:root{color-scheme:dark;--bg:#101014;--surface:#19191f;--surface2:#202027;--line:#2b2b34;--text:#f4f2f6;--muted:#95939f;--subtle:#6d6b79;--accent:#c3b3f2;--accent-strong:#b29be9;--mint:#a8d5ba;--radius:16px;font-family:'DM Sans',sans-serif;font-synthesis:none;scroll-behavior:smooth}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-size:14px;line-height:1.55;-webkit-font-smoothing:antialiased}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:wait;opacity:.5}button,a{touch-action:manipulation}a{color:inherit;text-decoration:none}button{color:inherit}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}button svg{pointer-events:none}[hidden]{display:none!important}::selection{background:#c3b3f244}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:5px}input:focus{outline:none}input::placeholder{color:#74717e}.svg-defs{position:absolute;width:0;height:0;overflow:hidden}.shell{max-width:1320px;padding:0 54px;margin:auto}.topbar{height:104px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:inline-flex;gap:0;align-items:center;font-family:Manrope,sans-serif;font-size:24px;letter-spacing:-1.1px;font-weight:800}.brand-n{color:var(--accent)}.brand-mark{display:flex;gap:3px;align-items:center;margin-right:12px;transform:rotate(-13deg)}.brand-mark i{width:5px;height:19px;border-radius:3px;background:var(--accent)}.brand-mark i:nth-child(2){height:29px}.brand-mark i:nth-child(3){height:23px}.beta{font:550 8px 'DM Sans',sans-serif;letter-spacing:1px;border:1px solid #45414f;border-radius:4px;color:var(--muted);padding:2px 5px;margin-left:9px}.topbar nav{display:flex;gap:30px;align-items:center;font-size:12px}.topbar nav a{color:var(--muted)}.text-button{background:none;border:0;padding:6px 0;display:inline-flex;gap:10px;align-items:center;font-size:12px;font-weight:500;color:var(--accent)}.text-button:hover,.text-link:hover{color:#e2d7ff}.profile{width:34px;height:34px;border:1px solid #45414f;border-radius:50%;color:var(--accent);background:#25222e;font-size:12px}.hero{display:grid;grid-template-columns:1fr 1.1fr;gap:56px;align-items:center;padding:66px 0 55px}.eyebrow{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:9px;letter-spacing:1.7px;font-weight:600}.live-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 4px #a8d5ba10;flex-shrink:0}.hero h1{position:relative;margin:22px 0 20px;font:650 clamp(58px,6.1vw,80px)/1.07 Manrope,sans-serif;letter-spacing:-4px}.hero h1>span:first-of-type{color:var(--accent)}.title-star{font:400 68px/1 Manrope,sans-serif;position:absolute;left:300px;bottom:14px;color:var(--accent);transform:rotate(10deg)}.hero-description{color:var(--muted);font-size:14px;line-height:1.8;margin:0 0 30px}.create-form{max-width:420px}.create-form>label{display:block;font-size:11px;margin-bottom:10px;font-weight:500;color:#d0ccd7}.url-input{display:flex;align-items:center;padding:0 13px;gap:10px;height:50px;border:1px solid #38353f;background:#1b1a20;border-radius:9px}.url-input:focus-within{border-color:var(--accent)}.url-input>svg{width:17px;color:#8e879b}.url-input input{background:none;border:0;min-width:0;width:100%;color:var(--text);font-size:12px}.url-input>button{border:1px solid #3d3946;background:#26232c;color:#8a8397;border-radius:4px;font-size:9px;white-space:nowrap;padding:3px 5px}.button{display:inline-flex;justify-content:center;align-items:center;gap:9px;min-height:42px;padding:11px 17px;border-radius:8px;border:1px solid transparent;font-size:11px;font-weight:650;transition:background .18s,transform .18s}.button:hover{transform:translateY(-1px)}.button svg{width:17px;height:17px}.primary{background:var(--accent);color:#262031;border-color:var(--accent)}.primary:hover{background:#d0c2f8}.secondary{background:#24232b;border-color:#393640;color:#d8d3e1}.secondary:hover{background:#302d39}.create-form>.button{width:100%;justify-content:space-between;margin-top:10px;padding:13px 17px;min-height:47px;font-size:12px}.form-note{display:flex;gap:6px;align-items:center;justify-content:center;font-size:9px;color:var(--subtle);margin-top:13px}.form-note svg{width:12px;height:12px;color:#8ca392}.join-row{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted);margin-top:22px}.join-row .text-button{font-size:11px}.hero-visual{position:relative;padding:24px 0 38px;margin-top:18px;min-width:0}.visual-label{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1.2px;color:#817b8e;margin-bottom:15px;padding:0 8px}.visual-label>span:last-child{font-size:7px}.preview-window{position:relative;border-radius:13px;border:1px solid #45404d;background:#1a1920;box-shadow:0 24px 75px #0008;overflow:hidden;transform:rotate(-3deg)}.preview-top{display:flex;justify-content:space-between;align-items:center;padding:11px 16px;color:#9c94a7;font-size:9px}.window-dots{display:flex;gap:5px}.window-dots i{width:5px;height:5px;border-radius:50%;background:#514955}.window-dots i:first-child{background:#a27276}.window-dots i:nth-child(2){background:#af9373}.window-dots i:nth-child(3){background:#7c987d}.landscape{position:relative;height:300px;overflow:hidden;isolation:isolate;background:linear-gradient(180deg,#6e7889 0%,#a38888 30%,#c59685 48%,#d9ad87 65%,#73635f 100%)}.landscape-sun{position:absolute;width:74px;height:74px;background:#ffe1b0;box-shadow:0 0 55px #f4c6a8a8;border-radius:50%;left:54%;top:17%}.mountain{position:absolute;width:130%;height:220px;left:-10%;bottom:-40px;clip-path:polygon(0 65%,12% 40%,25% 50%,42% 5%,55% 24%,65% 20%,78% 56%,90% 33%,100% 55%,100% 100%,0 100%)}.mountain.back{background:#877879;bottom:5px;transform:scaleX(-1)}.mountain.middle{background:linear-gradient(140deg,#6d666b,#524f5d);bottom:-55px}.mountain.front{background:linear-gradient(150deg,#29363d,#142d30);bottom:-135px;transform:scaleX(-1.2) rotate(-3deg);height:250px}.landscape-grain{position:absolute;inset:0;background:linear-gradient(0deg,#091b23a6,transparent 70%);z-index:1}.preview-badge{position:absolute;z-index:2;top:18px;left:18px;display:flex;align-items:center;gap:6px;border:1px solid #ffffff30;background:#10182059;backdrop-filter:blur(10px);padding:6px 9px;border-radius:4px;font-size:7px;letter-spacing:1px;color:#f4eced}.preview-badge i{width:4px;height:4px;border-radius:50%;background:#bad6be}.film-caption{position:absolute;bottom:46px;left:25px;z-index:2;display:flex;flex-direction:column}.film-caption small{font-size:7px;letter-spacing:2px;color:#efe7e0bb}.film-caption strong{font:500 32px/1.5 Manrope,sans-serif;letter-spacing:-1px;color:#f8eee7}.preview-play{display:grid;place-items:center;position:absolute;top:40%;left:45%;z-index:3;border-radius:50%;border:1px solid #fff7;background:#fff2;backdrop-filter:blur(6px);width:53px;height:53px}.preview-play:hover{background:#fff5}.preview-play svg{width:20px;height:20px;fill:#f9efeb;stroke:none;transform:translateX(-1px)}.preview-timeline{position:absolute;bottom:17px;left:22px;right:22px;display:flex;gap:10px;align-items:center;z-index:2;font-size:7px;color:#d4d4d3}.preview-timeline>div{height:2px;flex:1;background:#d5d3d455}.preview-timeline i{display:block;width:29%;height:2px;background:#d9c4f7}.preview-bottom{display:flex;align-items:center;gap:10px;padding:14px 18px;color:#9c94a7;font-size:9px}.preview-avatars{display:flex;padding-left:4px}.preview-avatars>span{width:25px;height:25px;border:2px solid #1a1920;border-radius:50%;background:#b8a8c5;color:#382e40;display:grid;place-items:center;font-size:8px;font-weight:600;margin-left:-4px}.preview-avatars>span:nth-child(2){background:#c7b096}.preview-avatars>span:nth-child(3){background:#97b3a5}.audio-bars{margin-left:auto;display:flex;align-items:center;gap:3px;height:17px}.audio-bars i{background:#b2a3cf;width:2px;height:9px;border-radius:2px}.audio-bars i:nth-child(2){height:15px}.audio-bars i:nth-child(4){height:18px}.audio-bars i:last-child{height:6px}.float-note{position:absolute;z-index:4;display:flex;align-items:center;gap:10px;padding:13px 16px;border:1px solid #46404f;border-radius:11px;background:#27242ef2;box-shadow:0 10px 30px #0003;backdrop-filter:blur(16px);font-size:11px;color:#eee6f5}.sync-note{right:-24px;top:9px;transform:rotate(3deg)}.float-note small{display:block;font-size:8px;color:#a198ae;margin-top:2px}.float-icon{display:grid;place-items:center;background:#393044;color:var(--accent);width:31px;height:31px;border-radius:8px}.float-icon svg{width:15px;height:15px}.note-check{color:#b3d4ba;margin-left:7px;font-size:12px}.chat-note{bottom:10px;left:-29px;transform:rotate(2deg)}.note-avatar{width:32px;height:32px;background:#b99d84;color:#4e3b32;display:grid;place-items:center;border-radius:50%;font-size:11px}.chat-note small{margin:0 0 3px}.note-time{font-size:8px;color:#87808f;margin-left:15px;align-self:flex-start}.visual-caption{display:block;text-align:right;font-size:8px;color:#706979;padding-right:10px;margin-top:28px}.source-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:25px 0 27px;text-align:center}.source-strip>span{font-size:8px;letter-spacing:1.4px;color:var(--subtle)}.source-strip>div{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:18px;padding:0 45px;color:#aaa5b3}.source-strip b{font-size:14px;font-weight:500;display:flex;align-items:center;gap:7px;white-space:nowrap}.source-strip .youtube-label{font-size:19px;font-weight:700;letter-spacing:-.7px}.source-strip .vimeo-label{font-size:23px;font-style:italic;font-family:Georgia,serif;font-weight:bold}.source-strip small{display:block;font-size:8px;color:var(--subtle)}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;padding:44px 0 40px}.features article{position:relative;padding:0 22px}.features article:first-child{padding-left:0}.features article+article{border-left:1px solid var(--line);padding-left:34px}.feature-number{position:absolute;right:8px;top:0;color:#5d5768;font-size:9px;letter-spacing:1px}.features svg{width:23px;height:23px;color:var(--accent);margin-bottom:12px}.features h2{font:650 16px Manrope,sans-serif;margin:0 0 11px;letter-spacing:-.3px}.features p{font-size:11px;color:var(--muted);line-height:1.9;margin:0}.home-bottom{display:flex;align-items:center;justify-content:space-between;border:1px solid var(--line);background:#18171d;border-radius:9px;padding:12px 19px;margin-bottom:42px;font-size:10px;color:var(--muted)}.home-bottom>div{display:flex;align-items:center;gap:10px}.home-bottom .text-button{font-size:10px}.site-footer{border-top:1px solid var(--line);display:flex;align-items:center;gap:24px;padding:26px 0 30px;color:var(--subtle);font-size:9px}.brand.small{font-size:17px;color:#c5bfcd;letter-spacing:-.8px}.footer-star{font-size:21px;margin-left:10px;color:var(--accent)}.site-footer>span:last-child{margin-left:auto;letter-spacing:1.2px;font-size:7px}
/* Watch room */
#room-view{padding-top:30px}.room-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:25px}.back-button{background:none;border:0;padding:0;color:var(--subtle);font-size:10px}.room-heading h1{font:650 29px Manrope,sans-serif;letter-spacing:-1px;margin:10px 0 4px}.room-heading p{color:var(--muted);font-size:11px;margin:0}.room-actions{display:flex;align-items:center;gap:16px}.status-pill{font-size:10px;color:var(--muted);display:flex;align-items:center;gap:7px}.status-pill i{width:5px;height:5px;border-radius:50%;background:#d6b575}.status-pill.connected i{background:var(--mint)}.room-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:22px;align-items:start}.watch-column{min-width:0}.player-frame{position:relative;aspect-ratio:16/9;border:1px solid #34303d;border-bottom:0;background:#0a0a0e;border-radius:12px 12px 0 0;overflow:hidden}.player-frame>video,.embedded-player,.embedded-player>iframe,.screen-layer,.screen-layer video{width:100%;height:100%;border:0;object-fit:contain}.player-frame>video{display:block}.empty-player,.external-player{height:100%;width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;background:radial-gradient(ellipse at 50% 0%,#39304170,transparent 70%),#141219;padding:20px}.empty-icon{display:grid;place-items:center;width:48px;height:48px;background:#342b41;border:1px solid #554563;border-radius:14px;margin-bottom:20px;color:var(--accent)}.empty-icon svg{width:23px;height:23px}.empty-player .eyebrow,.external-player .eyebrow{font-size:7px;letter-spacing:1.4px;color:#9f8fab}.empty-player h2,.external-player h2{font:600 21px Manrope,sans-serif;letter-spacing:-.6px;margin:12px 0 9px}.empty-player p,.external-player p{font-size:11px;color:#a095ae;line-height:1.8;margin:0 0 18px}.empty-player>.text-button{font-size:9px;margin-top:9px}.external-actions{display:flex;gap:10px}.external-player>.text-button{font-size:10px;margin-top:12px}.external-player>small{color:#766a81;font-size:8px;margin-top:3px}.screen-layer{position:absolute;inset:0;background:#08080c;z-index:5}.screen-layer .preview-badge{pointer-events:none}.unlock{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:7;box-shadow:0 0 40px #000a;white-space:nowrap}.unlock:hover{transform:translate(-50%,-50%)}.player-bar{display:flex;align-items:center;gap:10px;background:#1c1922;border:1px solid #34303d;border-top:1px solid #2b2433;border-radius:0 0 12px 12px;padding:9px 13px;color:#9b90a6;font-size:9px}.source-badge{font-size:7px;letter-spacing:.8px;background:#302937;color:#c5b4d4;border:1px solid #44374c;padding:3px 6px;border-radius:4px}.player-bar>div{display:flex;gap:3px;margin-left:auto}.icon-button{width:30px;height:30px;display:inline-grid;place-items:center;background:transparent;border:0;border-radius:5px;color:#a598b4;font-size:20px}.icon-button:hover{background:#342a3f}.icon-button svg{width:14px;height:14px}.media-meta{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:23px 0 19px;border-bottom:1px solid var(--line)}.media-meta>div{min-width:0}.media-meta .eyebrow{font-size:7px;letter-spacing:1.4px}.media-meta h2{font:600 18px Manrope,sans-serif;margin:7px 0 6px;overflow-wrap:anywhere;letter-spacing:-.5px}.media-meta p{color:var(--subtle);font-size:10px;margin:0;overflow-wrap:anywhere}.media-meta>.button{flex-shrink:0;min-height:35px;font-size:9px;padding:8px 11px}.room-tools{display:flex;align-items:center;gap:15px;padding:15px 0;flex-wrap:wrap}.room-tools .button{min-height:34px;font-size:9px;padding:7px 11px}.room-tools .text-button{font-size:9px}.room-tools>span{font-size:8px;margin-left:auto;color:#706779;max-width:170px;overflow:hidden;text-overflow:ellipsis}.device-note{display:flex;align-items:center;gap:12px;color:#807589;margin-top:6px;padding:15px;background:#19151f;border:1px solid #2d2535;border-radius:8px}.device-note>span{font-size:19px;color:#9e8ab2}.device-note p{font-size:10px;margin:0}.device-note strong{display:block;color:#b6a9c2;font-weight:500;margin-bottom:3px}.social-panel{padding:20px 17px;border:1px solid #33303a;border-radius:12px;background:#19171e;display:flex;flex-direction:column;min-height:582px}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-bottom:15px;border-bottom:1px solid #302a36}.panel-heading h2{font:600 13px Manrope,sans-serif;margin:0;letter-spacing:-.2px}.panel-heading>span{font-size:8px;color:var(--accent);border:1px solid #44394e;padding:2px 5px;border-radius:4px;background:#2b2433}.people-list{padding:12px 0}.person-row{display:flex;align-items:center;gap:10px;padding:6px 0}.person-avatar{display:grid;place-items:center;width:31px;height:31px;border-radius:50%;background:#a999bd;color:#312639;font-size:10px;font-weight:600}.person-row:nth-child(3n+2) .person-avatar{background:#bbaa94}.person-row:nth-child(3n+3) .person-avatar{background:#98b5a3}.person-name{flex:1;font-size:11px}.person-name small{display:block;color:#796e84;font-size:8px}.person-state{font-size:8px;color:#a598b4}.person-state.active{color:var(--mint)}.voice-card{border:1px solid #3b3144;background:#241e2c;border-radius:9px;padding:13px 12px}.voice-card>div:first-child{display:flex;align-items:center;gap:8px}.voice-card strong{font-size:10px;font-weight:500}.live-dot.muted{background:#857593;box-shadow:none}.voice-card p{font-size:8px;color:#998ba7;line-height:1.7;margin:7px 0 11px}.voice-card .button{width:100%;font-size:10px;min-height:35px;background:#352b40;border-color:#4c3c5b;color:#d9c3f0}.voice-options{display:flex;justify-content:space-between}.voice-options .text-button{font-size:8px;margin-top:6px}.chat-heading{display:flex;justify-content:space-between;align-items:center;padding:22px 0 12px}.chat-heading h3{font-size:10px;font-weight:500;margin:0}.chat-heading>span{font-size:6px;letter-spacing:1.3px;color:#766880}.chat-messages{flex:1;min-height:140px;max-height:300px;overflow:auto;scrollbar-width:thin;scrollbar-color:#4c3a5c transparent}.chat-empty{height:130px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;font-size:9px;color:#7e6f8b}.chat-empty>span{font-size:26px;color:#5d486e}.message{margin-bottom:12px}.message-head{display:flex;gap:8px;font-size:8px;color:#a392b5;margin-bottom:4px}.message-head time{font-size:7px;color:#705f7d}.message p{display:inline-block;max-width:100%;font-size:10px;margin:0;background:#27202f;border:1px solid #35283e;border-radius:0 8px 8px;padding:8px 10px;color:#c3b4d1;white-space:pre-wrap;overflow-wrap:anywhere}.message.self p{background:#32263f;border-color:#473454}.chat-form{display:flex;border:1px solid #42334f;border-radius:8px;margin-top:12px;padding:5px;background:#211a29}.chat-form input{width:100%;min-width:0;border:0;background:none;color:#e5d8f0;padding:6px 7px;font-size:10px}.chat-form input::placeholder{color:#8b759d}.chat-form button{display:grid;place-items:center;border:0;background:#4a355d;border-radius:5px;color:#d2b4ed;width:31px;flex-shrink:0}.chat-form svg{width:15px}.room-footer{display:flex;justify-content:space-between;align-items:center;padding:23px 0 29px;color:#7b7086;font-size:9px}.room-footer>span{display:flex;gap:8px;align-items:center}.room-footer .live-dot{width:4px;height:4px}.room-footer .text-button{font-size:10px;color:#aa8fbb}.theater .room-grid{grid-template-columns:1fr}.theater .social-panel{max-width:none;min-height:0;display:grid;grid-template-columns:1fr 1fr;gap:14px}.theater .chat-messages{grid-column:2;grid-row:2/5}.theater .chat-form{grid-column:2}.notice{border:1px solid #6f503b;background:#32251e;color:#dfbb9f;font-size:11px;line-height:1.7;padding:12px 15px;border-radius:8px;margin-top:15px;overflow-wrap:anywhere}.error{font-size:11px;color:#edb0a3;line-height:1.7;margin:8px 0 0}.error:empty{display:none}
/* Dialogs and small screens */
dialog{position:fixed;max-height:90dvh;overflow:auto;width:min(92vw,450px);border:1px solid #51425e;background:#211a29;border-radius:17px;padding:32px;color:var(--text);box-shadow:0 25px 100px #0009}dialog::backdrop{background:#09060fbb;backdrop-filter:blur(9px)}.dialog-close{position:absolute;top:10px;right:10px;font-size:26px}dialog h2{font:600 26px/1.35 Manrope,sans-serif;letter-spacing:-.8px;margin:14px 0}dialog p,dialog>small{font-size:12px;color:#aa97b8;line-height:1.8}dialog label{display:block;margin:22px 0 8px;font-size:11px;color:#c7b5d4}dialog input{width:100%;border:1px solid #564362;background:#17111d;color:#e9d9f4;border-radius:8px;padding:13px;font-size:12px}dialog form>.primary{width:100%;justify-content:space-between;margin-top:12px}.wide-dialog{width:min(94vw,620px)}.help-list article{display:flex;gap:18px;border-top:1px solid #413149;padding:20px 0}.help-list article>span{font-size:10px;color:#8d71a2;padding-top:3px}.help-list h3{font-size:14px;font-weight:500;margin:0 0 8px}.help-list p{margin:0;font-size:11px}.text-link{display:inline-block;margin:13px 15px 0 0;font-size:11px;color:var(--accent);text-decoration:underline;text-underline-offset:4px}.help-note{padding:14px;border:1px solid #49364f;background:#2a1d30;border-radius:8px;font-size:10px!important}.toast{position:fixed;z-index:30;bottom:max(25px,env(safe-area-inset-bottom));left:50%;max-width:90vw;transform:translate(-50%,12px);background:#d2bee6;color:#2f203d;box-shadow:0 8px 40px #0006;padding:12px 20px;border-radius:9px;font-size:12px;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}.toast.visible{opacity:1;transform:translate(-50%,0)}
@media(min-width:1450px){.hero{padding-top:80px;padding-bottom:80px}}
@media(max-width:1100px){.shell{padding:0 32px}.hero{gap:38px}.hero h1{font-size:65px}.title-star{left:245px;font-size:54px}.landscape{height:270px}.sync-note{right:-8px;font-size:9px}.float-note small{font-size:7px}.chat-note{left:-16px}.source-strip>div{padding:0 15px;gap:14px}.source-strip b{font-size:12px}.source-strip b:last-child{flex-wrap:wrap;max-width:145px;gap:2px 6px}.source-strip b:last-child small{margin-left:25px}.room-grid{grid-template-columns:minmax(0,1fr) 270px;gap:16px}.empty-player h2,.external-player h2{font-size:18px}.empty-player p,.external-player p{font-size:10px;margin-bottom:12px}.empty-icon{width:38px;height:38px;margin-bottom:10px}.empty-player .button,.external-actions .button{min-height:35px;padding:8px 10px;font-size:9px}.room-actions{gap:11px}.media-meta h2{font-size:16px}}
@media(max-width:800px){.shell{padding:0 24px}.topbar{height:82px}.topbar nav{gap:18px}.nav-how{display:none}.hero{gap:24px;grid-template-columns:1fr 1fr;padding:45px 0}.hero h1{font-size:55px;letter-spacing:-2.5px}.title-star{font-size:40px;left:205px}.hero .eyebrow{font-size:7px;letter-spacing:1px}.hero-description{font-size:12px}.hero-visual{margin-top:0}.landscape{height:240px}.film-caption strong{font-size:25px}.float-note{padding:10px;gap:7px}.float-icon{width:24px;height:24px}.sync-note{right:-5px;top:10px}.sync-note small{display:none}.note-check{margin:0}.chat-note{left:-12px;bottom:22px;font-size:9px}.note-avatar{width:25px;height:25px}.note-time{margin:0;font-size:6px}.visual-caption{font-size:6px}.visual-label{font-size:6px}.visual-label>span:last-child{display:none}.source-strip>div{padding:0;flex-wrap:wrap;justify-content:center;gap:15px 25px}.features{gap:15px}.features article+article{padding-left:20px}.features h2{font-size:14px}.features p{font-size:10px}.room-grid{grid-template-columns:1fr}.social-panel{min-height:400px}.room-heading{align-items:flex-start}.room-actions{flex-direction:column-reverse;align-items:flex-end}.empty-player h2,.external-player h2{font-size:23px}.empty-player p,.external-player p{font-size:12px}.empty-icon{width:48px;height:48px;margin-bottom:20px}.empty-player .button,.external-actions .button{font-size:11px;min-height:40px}.chat-messages{min-height:180px}.site-footer>span:nth-child(2){font-size:8px}}
@media(max-width:600px){.shell{padding:0 20px}.brand{font-size:21px}.beta{font-size:6px;margin-left:6px}.brand-mark{margin-right:9px}.topbar{height:78px}.topbar nav{gap:12px}.topbar nav .text-button{font-size:9px;gap:4px}.profile{width:28px;height:28px;font-size:10px}.hero{grid-template-columns:1fr;gap:33px;padding-top:38px;padding-bottom:31px}.hero .eyebrow{font-size:8px;letter-spacing:1.4px}.hero h1{font-size:70px;line-height:1.05;letter-spacing:-3px;margin:22px 0}.title-star{left:260px;bottom:12px;font-size:57px}.hero-description{font-size:13px;margin-bottom:26px}.create-form{max-width:none}.url-input{height:52px}.url-input input{font-size:11px}.create-form>.button{min-height:48px}.join-row{justify-content:center;margin-top:17px}.hero-visual{margin:0 11px;padding:22px 0 25px}.landscape{height:260px}.preview-window{transform:rotate(-2deg)}.sync-note{right:-10px;top:2px;font-size:10px;transform:rotate(2deg);padding:12px}.sync-note small{display:block;font-size:7px}.float-icon{width:28px;height:28px}.chat-note{left:-15px;bottom:5px;padding:12px;font-size:10px}.visual-caption{margin-top:21px;font-size:6px}.source-strip{padding:21px 0}.source-strip>div{gap:20px 25px}.source-strip b{font-size:11px}.source-strip .youtube-label{font-size:17px}.source-strip .vimeo-label{font-size:22px}.source-strip b:last-child{max-width:none;flex-wrap:nowrap}.source-strip b:last-child small{margin-left:0}.features{grid-template-columns:1fr;padding:29px 0;gap:24px}.features article,.features article:first-child,.features article+article{padding:0 0 0 46px;border:0}.features svg{position:absolute;left:0;top:0}.features h2{font-size:16px;margin-bottom:8px}.features p{font-size:11px}.features p br{display:none}.feature-number{right:0;top:3px}.home-bottom{flex-direction:column;gap:10px;padding:15px 10px;font-size:9px;margin-bottom:30px}.home-bottom .live-dot{width:4px;height:4px}.site-footer{padding:22px 0;gap:12px;flex-wrap:wrap}.site-footer>span:nth-child(2){margin-left:auto;font-size:7px}.site-footer>span:last-child{display:none}.room-heading{flex-direction:column;gap:18px;margin-bottom:18px}.room-heading h1{font-size:27px}.room-actions{flex-direction:row;width:100%;align-items:center;justify-content:space-between}.room-actions .primary{font-size:10px;min-height:39px;padding:9px 12px}.room-grid{gap:20px}.player-frame{aspect-ratio:auto;min-height:260px}.player-frame:has(>video:not([hidden])),.player-frame:has(.embedded-player:not([hidden])),.player-frame:has(.screen-layer:not([hidden])){aspect-ratio:16/9;min-height:0}.empty-player,.external-player{min-height:260px;padding:22px 14px}.empty-icon{width:37px;height:37px;margin-bottom:13px}.empty-player h2,.external-player h2{font-size:18px}.empty-player p,.external-player p{font-size:10px}.empty-player .button,.external-actions .button{font-size:9px;min-height:35px}.external-player>.text-button{font-size:9px}.external-player>small{font-size:7px}.player-bar{padding:7px 9px;font-size:8px;gap:7px}.source-badge{font-size:6px}.media-meta{padding:19px 0;gap:8px}.media-meta h2{font-size:15px}.media-meta>.button{font-size:8px;padding:7px 8px;min-height:33px}.room-tools{gap:8px}.room-tools .text-button{font-size:8px}.room-tools>span{display:none}.device-note p{font-size:9px}.room-footer{font-size:8px;padding:20px 0}.room-footer .text-button{font-size:9px}.social-panel{padding:18px 16px}.chat-form{min-height:45px}.chat-form input{font-size:12px}.chat-form button{width:35px}.chat-messages{max-height:250px}.message p{font-size:12px}.message-head{font-size:10px}.voice-card p{font-size:10px}.voice-card .button{min-height:40px}.voice-card strong{font-size:12px}.person-name{font-size:12px}.theater .social-panel{display:flex}.unlock{font-size:9px;min-height:38px;padding:9px 11px}dialog{padding:28px 22px}.wide-dialog{padding:30px 20px}.help-list article{gap:12px}.help-list h3{font-size:13px}.help-list p{font-size:11px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.native-app #install-app,.native-app .nav-how{display:none}
.native-app .topbar{padding-top:12px;padding-bottom:12px}
.legal-page{max-width:760px;margin:55px auto 90px;line-height:1.8}.legal-page h1{font-size:clamp(32px,5vw,52px);letter-spacing:-.04em}.legal-page h2{font-size:20px;margin-top:36px}.legal-page p,.legal-page li{color:var(--muted,#b7b5c2)}.legal-page a{color:#c3b3f2}.footer-links{display:flex;gap:18px}

/* The iOS app renders its own SwiftUI navigation, room controls and chat.
   Only the interoperable provider/video surface is displayed in its WebView. */
body.native-app{background:#101014;overflow:hidden}
.native-app .shell{padding:0;max-width:none}
.native-app .topbar,.native-app #home-view,.native-app .site-footer,.native-app .room-heading,.native-app .social-panel,.native-app .room-footer,.native-app .watch-column>:not(.player-frame){display:none!important}
.native-app #room-view{margin:0;padding:0}
.native-app .room-grid{display:block;margin:0}
.native-app .player-frame,.native-app .player-frame:has(>video:not([hidden])){height:100dvh;min-height:0;aspect-ratio:auto;border:0;border-radius:0}
.native-app .external-player,.native-app .empty-player{min-height:0;height:100dvh;padding:16px}
.native-app .empty-icon,.native-app .external-player .eyebrow,.native-app #external-share,.native-app #extension-help,.native-app .external-player>small{display:none}
.native-app .external-player h2{font-size:18px}
.native-app .external-player p{font-size:12px}
.quiet-ad { width: 344px; max-width: 100%; margin: 40px auto 0; padding: 12px; text-align: center; border-top: 1px solid #28262e; }
.quiet-ad > span { display: block; margin-bottom: 7px; font-size: 9px; letter-spacing: .14em; color: #96909f; }
.quiet-ad[hidden] { display: none; }