:root{font-family:Segoe UI,Malgun Gothic,system-ui,sans-serif;color:#edeef0;background:#111315;font-synthesis:none;font-weight:400;--muted: #9a9fa5;--line: #2a2d31;--mint: #bce9cb;--panel: #191c1f}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0}button,input,select{font:inherit}button{display:inline-flex;align-items:center;justify-content:center;gap:7px;color:inherit;background:#262a2e;border:1px solid transparent;border-radius:8px;padding:10px 14px;min-height:40px;cursor:pointer;transition:background .15s,border-color .15s;font-size:13px;white-space:nowrap}button:hover:not(:disabled){background:#33383e}button:disabled{opacity:.4;cursor:not-allowed}button svg{flex-shrink:0;font-size:18px}input,select{background:#141719;border:1px solid #383d42;border-radius:8px;color:#edeef0;padding:12px;min-width:0}input::placeholder{color:#969ca3}input:focus,select:focus,button:focus-visible,summary:focus-visible{outline:2px solid var(--mint);outline-offset:3px}a{color:var(--mint)}.legal-links{display:flex;flex-wrap:wrap;align-items:center;gap:14px;font-size:14px}.legal-links a{text-underline-offset:3px}.legal-links button{min-height:40px;padding:4px 0;background:transparent;border:0;color:var(--mint);font-size:14px;text-decoration:underline;text-underline-offset:3px}.help-modal .legal-links{margin-bottom:16px}h1,h2,p{margin:0;word-break:keep-all}small,.quiet{color:var(--muted);font-size:12px}.primary{background:var(--mint);color:#193625;font-weight:650}.primary:hover:not(:disabled){background:#d3f2dd}.wide{width:100%}.brand{display:flex;gap:10px;align-items:center;font-size:19px;font-weight:700;letter-spacing:-.7px}.brand-mark{width:30px;height:30px;border-radius:9px;background:var(--mint);display:grid;place-items:center;color:#193625;font-size:16px}.lobby{min-height:100dvh;padding:28px 36px;display:flex;flex-direction:column}.lobby-main{flex:1;display:grid;place-items:center;padding:56px 0}.join-card{width:100%;max-width:400px}.join-card h1{font-size:32px;letter-spacing:-1.2px;font-weight:650;margin-bottom:12px}.join-card>p{color:var(--muted);font-size:14px;line-height:1.8}.join-card form{display:grid;gap:24px;margin-top:36px}.join-card label{display:grid;gap:10px;font-size:13px;color:#cbd0d5}.join-card input{min-height:46px;font-size:14px}.join-card small{line-height:1.7}.join-card .primary{min-height:46px;margin-top:4px}.lobby footer{display:flex;justify-content:center;gap:24px;color:var(--muted);font-size:12px;padding-bottom:10px}.lobby footer span{display:inline-flex;align-items:center;gap:7px}.lobby footer svg{font-size:17px}.loading-line{padding:20px 0;color:var(--mint);font-size:13px}.error,.player-error{background:#342324;color:#ffc2bd;padding:16px;font-size:13px;line-height:1.8;border-radius:8px;overflow-wrap:anywhere}.error{margin-top:24px}.error button,.player-error button{margin-left:8px;background:#533;color:#ffe6e3}.app-shell{min-height:100dvh}.workspace{min-width:0}.topbar{position:relative;height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 32px;border-bottom:1px solid var(--line)}.top-actions{display:flex;align-items:center;gap:10px}.connection{color:#e0b98a;font-size:12px;display:inline-flex;align-items:center;gap:7px;margin-right:8px}.connection i,.status-dot,.live-dot{width:6px;height:6px;border-radius:50%;background:#e0b98a;display:inline-block;flex-shrink:0}.status-dot{background:var(--mint)}.status-dot.offline{background:#e0b98a}.icon-button{background:transparent;color:#a5acb3;padding:8px;min-width:40px}.panel-toggle{background:transparent;color:#a5acb3}.panel-toggle.active{background:#24292c;color:#e3e7e6}.invite{background:var(--mint);color:#193625;font-weight:600}.invite:hover:not(:disabled){background:#d3f2dd}.room-layout{max-width:1640px;margin:auto;padding:28px 32px 40px;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:stretch}.room-layout.panel-closed{grid-template-columns:minmax(0,1fr)}.watch-column{min-width:0}.player-shell{position:relative;overflow:hidden;background:#090b0d;border:1px solid var(--line);border-radius:12px}.player-expand-control{position:absolute;top:12px;right:12px;z-index:5;background:#171b20e6;color:#e4e8eb;width:36px;min-height:36px;padding:8px}.player-expand-control span{display:none}.player-expand-control:hover,.player-expand-control:focus-visible{background:#30373de6}.player-shell.is-expanded{position:fixed;inset:0;width:100%;height:100%;z-index:1000;display:flex;flex-direction:column;border:0;border-radius:0;background:#000}.player-shell.is-expanded .video-frame,.player-shell.is-expanded .empty-player{flex:1;min-height:0;aspect-ratio:auto}.player-shell.is-expanded video{object-fit:contain}.player-shell.is-expanded .player-bottom{flex-shrink:0}.player-shell.is-expanded .player-error{flex-shrink:0;max-height:35%;overflow:auto}.empty-player{aspect-ratio:16/9;min-height:280px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:32px 24px;background:#0d1012}.empty-player>svg{color:#75817b;margin-bottom:20px}.empty-player h1{font-size:24px;letter-spacing:-.8px;font-weight:600}.empty-player p{color:var(--muted);font-size:13px;line-height:1.8;margin-top:12px}.empty-action{background:#202925;color:var(--mint);margin-top:24px;padding:10px 16px}.empty-action:hover:not(:disabled){background:#2c3a32}.video-frame{position:relative;aspect-ratio:16/9;min-height:180px;width:100%;background:#070808}.video-frame video,.youtube-mount,.youtube-mount iframe{width:100%;height:100%;position:absolute;inset:0;border:0}.player-message{position:absolute;inset:0;display:grid;place-items:center;font-size:13px;color:var(--muted)}.player-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;background:#171b1e;color:var(--muted);font-size:12px}.player-bottom strong{font-size:13px;font-weight:500;line-height:1.7}.player-bottom small{display:block;margin-top:4px;font-size:12px}.player-bottom button{font-size:12px}.inline{display:flex;gap:8px;align-items:center}.inline select{font-size:12px;padding:9px}.now-playing{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 0 16px}.now-playing>div{min-width:0}.now-playing h2{font-size:17px;line-height:1.6;letter-spacing:-.3px;font-weight:600;overflow-wrap:anywhere;margin-top:4px}.provider{display:inline-flex;align-items:center;gap:5px;font-size:11px;color:var(--muted)}.provider svg{font-size:16px}.provider.youtube svg{color:#ed938e}.provider.chzzk svg{color:var(--mint)}.transport{display:flex;flex-wrap:wrap;align-items:center;gap:12px;border-top:1px solid var(--line);padding:14px 0}.play-button{background:var(--mint);color:#193625;border-radius:50%;width:40px;height:40px;padding:0}.play-button:hover:not(:disabled){background:#d3f2dd}.timecode{font-size:13px;font-variant-numeric:tabular-nums;color:#d0d5d9}.seek-form{display:flex;gap:6px}.seek-form input{width:76px;font-size:12px;padding:8px}.seek-form button{font-size:12px}.next-button{margin-left:auto;background:transparent;color:#c0c6cb}.live-dot{background:#eea49e}.transport>strong{font-size:12px;color:#eea49e}.latency-label{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}.latency-label select{font-size:12px;padding:8px}.add-form{display:flex;align-items:center;gap:10px;border:1px solid #363d40;background:var(--panel);border-radius:10px;padding:7px 7px 7px 16px;margin-top:16px;color:var(--muted)}.add-form:focus-within{border-color:var(--mint)}.add-form input{border:0;background:transparent;flex:1;padding:11px 4px;font-size:13px;width:100%;outline:none}.side-panel{display:flex;flex-direction:column;min-width:0;border:1px solid var(--line);background:var(--panel);border-radius:12px;overflow:hidden}.panel-tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--line);padding:0 14px;gap:12px}.panel-tabs button{background:transparent;color:var(--muted);border-radius:0;padding:16px 0;position:relative}.panel-tabs button.active{color:#edf2ef}.panel-tabs button.active:after{position:absolute;content:"";height:2px;background:var(--mint);left:0;right:0;bottom:0}.panel-tabs button span{font-size:11px;color:var(--muted);margin-left:2px}.queue-body,.members-body{flex:1;padding:16px}.queue-body{display:flex;flex-direction:column}.queue-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:48px 0}.queue-empty>svg{color:#737e78}.queue-empty strong{font-size:13px;color:#b8c0bd;margin:16px 0 8px;font-weight:500}.queue-empty p{font-size:12px;color:var(--muted);line-height:1.8}.queue-list{list-style:none;padding:0;margin:0;max-height:520px;overflow-y:auto}.queue-list li{display:flex;align-items:center;gap:10px;padding:14px 0;border-bottom:1px solid var(--line)}.queue-list li:last-child{border-bottom:0}.queue-number{font-size:11px;color:var(--muted)}.queue-art{width:38px;height:38px;flex-shrink:0;border-radius:8px;background:#24312a;color:var(--mint);display:grid;place-items:center}.queue-art.youtube{background:#35292a;color:#ed938e}.queue-info{flex:1;min-width:0}.queue-info .provider{font-size:10px}.queue-info .provider svg{font-size:13px}.queue-info>button{display:block;max-width:100%;padding:4px 0;min-height:0;background:transparent;text-align:left;font-size:13px;overflow:hidden;text-overflow:ellipsis;color:#e3e7e5}.queue-info>button:disabled{opacity:1}.queue-info small{font-size:11px}.delete-button{background:transparent;color:var(--muted);padding:8px;min-width:36px}.member{display:flex;align-items:center;gap:10px;padding:14px 0;border-bottom:1px solid var(--line)}.member>div{min-width:0}.avatar{width:34px;height:34px;flex-shrink:0;border-radius:50%;background:#31453a;color:#c2dfca;display:grid;place-items:center;font-size:13px}.avatar-1{background:#403c4d;color:#d4c7e6}.avatar-2{background:#484133;color:#e1d0ac}.avatar-3{background:#31424d;color:#bbd4e3}.member strong{display:flex;gap:6px;align-items:center;font-weight:500;font-size:13px;overflow-wrap:anywhere}.member small{display:block;margin-top:5px;font-size:11px;line-height:1.6}.member strong small{margin:0;color:var(--mint)}.crown{color:#d8c293;font-size:14px}.transfer{background:transparent;padding:8px;margin-left:auto}.room-info{border-top:1px solid var(--line);font-size:12px;color:var(--muted)}.room-info summary{cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:8px;padding:16px;list-style:none}.room-info summary::-webkit-details-marker{display:none}.room-info summary>span:first-child{display:inline-flex;align-items:center;gap:7px;color:#c7cfca}.room-info summary>span:last-child{font-size:11px;text-decoration:underline;text-underline-offset:3px}.room-details{padding:0 16px 16px}.room-details>span{display:flex;align-items:center;gap:7px;line-height:1.8}.room-details>small{display:block;margin-top:8px;font-size:11px;line-height:1.8}.room-details>div{display:flex;justify-content:space-between;margin-top:16px;gap:12px}.room-details strong{font-weight:500;color:#c7cfca;max-width:165px;overflow-wrap:anywhere}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%);z-index:1100;display:flex;align-items:center;gap:16px;border-radius:10px;border:1px solid #496352;background:#25362c;padding:14px 18px;max-width:calc(100vw - 32px);width:max-content;color:#e0ede4;font-size:13px;line-height:1.7;box-shadow:0 8px 30px #0004}.toast button{background:transparent;padding:4px;min-height:32px}.modal-backdrop{position:fixed;inset:0;background:#000a;z-index:1200;display:grid;place-items:center;padding:20px}.help-modal{background:var(--panel);border:1px solid #3d4449;border-radius:16px;padding:32px;max-width:500px;position:relative;max-height:90dvh;overflow:auto}.help-modal>svg{color:var(--mint)}.help-modal h2{font-size:22px;letter-spacing:-.6px;margin:16px 0}.help-modal ol{padding-left:20px;margin:24px 0}.help-modal li{padding-left:6px;color:var(--mint);margin:18px 0;font-size:13px}.help-modal li strong{color:#e3e7e5}.help-modal li p{color:var(--muted);font-size:13px;line-height:1.8;margin-top:6px}.close-modal{position:absolute;right:12px;top:12px;padding:8px;background:transparent}@media(max-width:1050px){.topbar{padding:0 24px}.room-layout{padding:24px;gap:18px;grid-template-columns:minmax(0,1fr) 270px}.empty-player h1{font-size:22px}.player-bottom{flex-wrap:wrap}}@media(max-width:800px){.room-layout{grid-template-columns:1fr}.side-panel{min-height:230px}.queue-empty{padding:36px 0}.queue-list{max-height:320px}}@media(max-width:520px){.lobby{padding:24px}.lobby-main{padding:48px 0}.topbar{height:64px;padding:0 16px}.brand{font-size:17px;gap:8px}.brand-mark{width:26px;height:26px;border-radius:8px}.top-actions{gap:3px}.top-actions button{padding:8px}.panel-toggle span{display:none}.invite{font-size:12px}.connection{position:absolute;top:70px;right:16px;z-index:6;padding:6px 10px;border-radius:6px;background:#30271e;font-size:11px;margin-right:2px}.room-layout{padding:16px;gap:16px}.empty-player{min-height:260px;padding:28px 16px}.empty-player h1{font-size:21px}.empty-player p{max-width:240px;font-size:12px}.player-expand-control{top:8px;right:8px}.add-form{padding-left:10px;gap:6px}.add-form>svg{width:18px}.add-form input{font-size:12px}.add-form button{padding:10px;font-size:12px}.transport{gap:8px}.latency-label,.inline{flex-wrap:wrap}.player-bottom{padding:12px}.help-modal{padding:24px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}.player-bottom:not(:has(.player-status)){justify-content:flex-end}.player-status{font-size:12px;min-width:0}.player-status summary{cursor:pointer;padding:6px 0}.player-status strong{display:block;margin-top:8px;overflow-wrap:anywhere}