#emojiPanel{height:clamp(150px,28dvh,225px);min-height:clamp(150px,28dvh,225px);max-height:clamp(150px,28dvh,225px);overflow-y:auto;overflow-anchor:none;overscroll-behavior:contain;scrollbar-gutter:stable;align-content:start;touch-action:pan-y}#emojiPanel button{min-height:38px;height:38px;touch-action:pan-y;border-radius:8px}#emojiPanel button:active{background:#dceef6}#emojiToggle[aria-expanded=true]{background:#dceef6;color:#126cb0}

.watch-launch{display:flex;align-items:center;gap:12px;width:100%;min-height:58px;margin:9px 0;padding:10px 13px;border:1px solid #cdddeb;border-radius:15px;background:linear-gradient(110deg,#edf5ff,#e9f6f5);color:#1c416b;text-align:left;flex-shrink:0}.watch-launch>span:nth-child(2){display:flex;flex:1;flex-direction:column;gap:3px}.watch-launch strong{font-size:15px}.watch-launch small{font-size:12px;color:#667d94}.watch-launch-icon{display:grid;place-items:center;width:36px;height:36px;background:#d9e9ff;border-radius:11px;color:#2266ad}
.watch-screen{position:fixed;inset:0;z-index:96;display:flex;flex-direction:column;background:#f0f5fa;color:#203b55;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);font-size:13px;overflow:hidden}.watch-screen button{cursor:pointer;min-height:36px;border-radius:9px;border:1px solid #ccd9e5;background:#fff;color:#24496f;padding:5px 10px;font-size:12px}.watch-screen button.primary{background:#1978c3;border-color:#1978c3;color:white}.watch-screen button.danger{background:#fcebed;border-color:#f1ccd1;color:#a63749}.watch-screen button:disabled{opacity:.4;cursor:default}.watch-head{display:flex;gap:10px;align-items:center;padding:9px 12px;background:#173454;color:#fff;flex-shrink:0}.watch-head>div{display:flex;flex:1;min-width:0;flex-direction:column;gap:3px}.watch-head strong{font-size:17px}.watch-head small{font-size:11px;color:#c0d2e2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.watch-head #watchBack{font-size:27px;padding:0 12px;min-width:38px;background:#264565;color:white;border-color:#46607b}
.watch-lobby{padding:18px 15px;overflow:auto;flex:1;min-height:0;width:min(100%,760px);margin:auto}.watch-lobby h2{font-size:22px;margin:0 0 8px}.watch-lobby>p{line-height:1.5;color:#6a8095}.watch-lobby form{display:flex;flex-direction:column;gap:8px;padding:16px;background:#fff;border:1px solid #d8e3ed;border-radius:16px}.watch-screen input,.watch-screen textarea,.watch-screen select{font:inherit;border:1px solid #cad8e6;border-radius:9px;min-height:40px;padding:8px 10px;color:#203b55;background:white;min-width:0;font-size:16px}.watch-lobby form label{font-size:12px;margin-top:5px}.watch-lobby form .primary{margin-top:7px;min-height:43px;font-size:14px}.watch-room-row{display:flex;align-items:center;gap:10px;background:white;border-radius:12px;padding:12px;margin-bottom:8px;border:1px solid #d9e3ed}.watch-room-row>div{display:flex;flex:1;flex-direction:column;gap:4px;min-width:0}.watch-room-row small{color:#73899f;font-size:11px}
.watch-session{flex:1;min-height:0;display:flex;flex-direction:column;width:min(100%,960px);margin:0 auto;overflow:hidden}.watch-address{display:flex;gap:5px;padding:7px 8px;background:#e8eff6;flex-shrink:0}.watch-address input{flex:1;height:36px;min-height:36px;font-size:13px}.watch-address button{padding:4px 9px}
.watch-video-box{position:relative;width:100%;height:min(44dvh,440px);min-height:150px;flex-shrink:0;background:#081623;display:flex;align-items:center;justify-content:center}.watch-video-box video{width:100%;height:100%;object-fit:contain;display:block;touch-action:none}.watch-video-status{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:30px;color:#d0dfeb;pointer-events:none;font-size:13px;background:#071523a6}.watch-video-box #watchReconnect{position:absolute;bottom:15px;left:50%;transform:translateX(-50%);white-space:nowrap}.watch-video-box:fullscreen{height:100vh;max-height:none}.watch-video-box:fullscreen video{height:100vh}
.watch-playback{display:flex;gap:4px;padding:6px 8px;background:#fff;flex-shrink:0;overflow-x:auto}.watch-playback button{min-width:33px;padding:4px 7px;white-space:nowrap}.watch-playback #watchSound{margin-left:auto;font-size:11px}.watch-control-row{display:flex;align-items:center;gap:5px;padding:2px 8px 5px;flex-shrink:0}.watch-control-row small{flex:1;color:#6c8299;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:10px}.watch-control-row button{min-height:29px;padding:3px 7px;font-size:10px}.watch-type{display:flex;gap:5px;padding:0 8px 5px;flex-shrink:0}.watch-type input{flex:1;min-height:33px;height:33px;font-size:13px}.watch-type button{min-height:33px;font-size:10px;padding:3px 8px}.watch-note{font-size:10px;line-height:1.35;color:#778a9d;padding:0 9px 5px;flex-shrink:0}
.watch-comments{flex:1;min-height:55px;overflow:auto;overscroll-behavior:contain;padding:7px 10px;overflow-anchor:none}.watch-comment{position:relative;padding:8px 64px 8px 10px;background:#fff;border:1px solid #e1e8f0;border-radius:11px;margin-bottom:7px;max-width:94%;width:fit-content}.watch-comment.mine{margin-left:auto;background:#e2f2ee}.watch-comment small{font-size:10px;color:#6b8297;display:block}.watch-comment p{margin:4px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;line-height:1.4}.watch-comment button{position:absolute;top:5px;right:5px;min-height:25px;width:25px;padding:0;border:0;background:transparent;color:#70899f;font-size:17px}.watch-comment button:nth-last-child(2){right:32px;font-size:14px}.watch-comment-form{display:flex;gap:7px;padding:7px 8px;background:#fff;border-top:1px solid #dbe4ee;flex-shrink:0}.watch-comment-form textarea{flex:1;min-height:38px;max-height:80px;resize:none;font-size:15px;line-height:1.3}.watch-comment-form button{padding:6px 11px}.watch-error{font-size:12px;color:#aa3547;background:#fff5f4;margin:0;padding:0 10px;flex-shrink:0;max-height:60px;overflow:auto}.watch-error:not(:empty){padding-top:7px;padding-bottom:7px}
.watch-invitation{position:fixed;z-index:110;left:10px;right:10px;bottom:calc(78px + env(safe-area-inset-bottom));max-width:480px;margin:0 auto;display:flex;align-items:center;gap:7px;flex-wrap:wrap;padding:13px;background:#fff;border:1px solid #bed6e9;border-radius:15px;box-shadow:0 10px 40px #17345440;color:#244765}.watch-invitation span{width:100%;font-size:13px}.watch-invitation button{min-height:35px;font-size:12px;padding:5px 10px}
@media(max-height:700px){.watch-video-box{height:32dvh;min-height:110px}.watch-note{display:none}.watch-playback{padding-top:4px;padding-bottom:4px}.watch-control-row{padding-bottom:3px}.watch-type{padding-bottom:3px}.watch-head{padding-top:6px;padding-bottom:6px}}
@media(min-width:900px){.watch-video-box{height:45dvh}.watch-session{border-left:1px solid #d6e1ec;border-right:1px solid #d6e1ec}.watch-invitation{left:auto;right:20px}}
.watch-screen.watch-chatting .watch-address,.watch-screen.watch-chatting .watch-type,.watch-screen.watch-chatting .watch-control-row,.watch-screen.watch-chatting .watch-note{display:none}.watch-screen.watch-chatting .watch-video-box{height:27dvh;min-height:95px}.watch-screen.watch-chatting .watch-comments{min-height:35px}
body.watch-open{overflow:hidden}.watch-screen{bottom:var(--bottom-nav-height);padding-bottom:0}.watch-remove-room{min-width:36px;font-size:21px!important}.watch-type input::placeholder{font-size:11px}
#watchFullscreenExit{display:none;position:absolute;right:12px;top:max(10px,env(safe-area-inset-top));z-index:2;width:40px;height:40px;border-radius:50%;font-size:28px;background:#173454d9;color:white;border:1px solid #8aa9c3}.watch-video-box.watch-expanded{position:fixed;inset:0;z-index:250;width:100vw;height:100dvh;max-height:none}.watch-video-box.watch-expanded #watchFullscreenExit,.watch-video-box:fullscreen #watchFullscreenExit{display:block}.watch-video-box.watch-expanded video{height:100dvh}

/* 3.8: keep the composer inside the visible mobile viewport. */
.watch-screen{top:var(--watch-vv-top,0px);bottom:auto;height:calc(var(--watch-vv-height,100dvh) - var(--watch-nav-space,var(--bottom-nav-height)) - 10px);min-height:0;padding-bottom:0}
.watch-session{min-height:0;overflow:hidden}
.watch-browser-area{flex:0 1 auto;min-height:80px;max-height:58%;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
.watch-browser-area .watch-video-box{height:auto;aspect-ratio:16/9;min-height:100px;max-height:34dvh;flex-shrink:1}
.watch-browser-tools{background:#e8eff6;border-bottom:1px solid #d4e1ed}
.watch-browser-tools summary{padding:8px 12px;font-size:12px;color:#315d82;cursor:pointer;min-height:36px}
.watch-browser-tools[open] summary{padding-bottom:5px}
.watch-browser-tools .watch-type{padding:5px 8px 8px}.watch-browser-tools .watch-note{display:block;padding-bottom:8px}
.watch-discussion-title{flex-shrink:0;min-height:27px;padding:6px 12px 4px;font-size:11px;font-weight:650;color:#57738c;border-top:1px solid #d6e3ee;background:#f1f6fb}
.watch-comments{flex:1 1 64px;min-height:40px;padding-top:5px;padding-bottom:8px}
.watch-comment-form{position:relative;z-index:1;flex:0 0 auto;align-items:flex-end;padding:10px 10px 12px;box-shadow:0 -3px 12px #1734540c;border-top:1px solid #cddcea}
.watch-comment-form textarea{min-height:44px;height:44px;max-height:88px;font-size:16px}
.watch-comment-form button{min-height:44px;white-space:nowrap}
.watch-error{max-height:44px;font-size:11px;line-height:1.35}
.watch-external{display:block;flex-shrink:0;padding:6px 12px;color:#176aae;background:#fff5f4;font-size:12px;text-decoration:underline}
body.nav-input-mode #bottomTabs{display:none!important}
.watch-screen.watch-chatting .watch-browser-area{max-height:29%;min-height:65px}
.watch-screen.watch-chatting .watch-browser-tools,.watch-screen.watch-chatting .watch-playback,.watch-screen.watch-chatting .watch-address{display:none}
.watch-screen.watch-chatting .watch-video-box{min-height:65px;max-height:120px;height:100px}
.watch-expand-button{position:absolute;right:9px;bottom:9px;z-index:2;min-height:35px!important;background:#173454eb!important;color:#fff!important;border-color:#8099b0!important;box-shadow:0 2px 8px #0004;font-size:12px!important}
.watch-full-controls{display:none;position:absolute;bottom:max(12px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);gap:8px;z-index:3;padding:7px;border-radius:13px;background:#102942c9}
.watch-full-controls button{width:43px;min-height:40px;background:#254966;color:white;border-color:#7897b2;font-size:18px}
.watch-video-box.watch-expanded,.watch-video-box:fullscreen{position:fixed;inset:0;z-index:1250;width:100vw!important;height:100dvh!important;min-height:0!important;max-height:none!important;aspect-ratio:auto}
.watch-video-box.watch-expanded video,.watch-video-box:fullscreen video{width:100%;height:100%;object-fit:contain}
.watch-video-box.watch-expanded #watchExpand,.watch-video-box:fullscreen #watchExpand{display:none}
.watch-video-box.watch-expanded .watch-full-controls,.watch-video-box:fullscreen .watch-full-controls{display:flex}
.watch-video-box.watch-expanded #watchFullscreenExit,.watch-video-box:fullscreen #watchFullscreenExit{display:block;z-index:4}
@media(max-height:480px){.watch-head{padding:4px 8px}.watch-head strong{font-size:14px}.watch-head small{display:none}.watch-browser-area{max-height:48%;min-height:60px}.watch-comments{min-height:25px}.watch-discussion-title{min-height:22px;padding-top:4px;padding-bottom:3px}.watch-comment-form{padding-top:6px;padding-bottom:8px}.watch-error{max-height:32px}}

.watch-screen.watch-fullscreen{z-index:1200;overflow:visible}body.watch-fullscreen #bottomTabs{display:none!important}


.watch-screen .watch-done-typing{display:none;background:#37668c;color:white;border-color:#6789a7}body.nav-input-mode .watch-done-typing{display:block}

/* 3.9: explicitly selected ordinary browser tab as a video source. */
.watch-source-panel{margin:12px 0;padding:12px;background:#e3f4ed;border:1px solid #bdddcf;border-radius:13px}.watch-source-panel p{font-size:12px;line-height:1.5;margin:0 0 9px;color:#245d51}.watch-source-panel video{display:block;width:100%;max-height:150px;object-fit:contain;background:#102332;border-radius:8px;margin-bottom:9px}.watch-source-panel button{width:100%;background:#fff3ef;color:#97452d;border-color:#e2bfae}
.watch-share-guide{font-size:12px!important;line-height:1.5;color:#5b7790!important}
.watch-room-row{flex-wrap:wrap}.watch-room-share{width:100%;font-size:12px!important;background:#eaf4fc!important;color:#245d8d!important}
#watchShareTab{margin:4px 8px 9px;width:calc(100% - 16px)}
.watch-device-source .watch-address,.watch-device-source .watch-type,.watch-device-source .watch-control-row,.watch-device-source .watch-note,.watch-device-source #watchPlay,.watch-device-source #watchPause,.watch-device-source #watchSeekBack,.watch-device-source #watchSeekNext,.watch-device-source #watchPlayer{display:none}
.watch-device-source .watch-full-controls button:not(:nth-child(3)){display:none}