:root{--bg:#09090b;--bg-raised:#131316;--bg-elevated:#1a1a1e;--border:#232327;--border-soft:#1c1c20;--text:#e8e0d5;--text-dim:#8f8a80;--white:#fafaf8;--fill:#e8e0d5;--fill-bright:#fafaf8;--fill-bg:#ffffff0f;--fill-border:#ffffff38;--danger:#d5604f;--live:#d5604f;--radius-sm:8px;--radius-md:14px;--radius-lg:22px;--radius-pill:999px;--heading:"Sora", "Inter", system-ui, sans-serif;--sans:"Inter", system-ui, "Segoe UI", Roboto, sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#root{height:100%}body{font-family:var(--sans);background:var(--bg);color:var(--text);cursor:none;margin:0}@media (pointer:coarse){body{cursor:auto}}h1,h2,h3{font-family:var(--heading);letter-spacing:-.02em;color:var(--white);margin:0;font-weight:800}h1{font-size:64px;line-height:1.04}h2{font-size:34px;line-height:1.1}h3{font-size:18px;line-height:1.25;font-family:var(--sans);letter-spacing:-.01em;font-weight:700}p{color:var(--text-dim);margin:0;line-height:1.55}a{color:inherit}button,input{font-family:var(--sans)}button,input,select,textarea,a,label,[role=button]{cursor:inherit}img{max-width:100%;display:block}:focus-visible{outline:2px solid var(--white);outline-offset:2px}::selection{color:var(--white);background:#e8e0d533}.pill-badge{border-radius:var(--radius-pill);border:1px solid var(--border);background:var(--bg-raised);color:var(--text-dim);letter-spacing:.03em;text-transform:uppercase;white-space:nowrap;align-items:center;gap:6px;padding:7px 16px;font-size:12px;font-weight:600;display:inline-flex}@media (width<=640px){h1{font-size:40px}h2{font-size:26px}}.reveal{opacity:0;transition:opacity .32s,transform .32s;transform:translateY(22px)}.reveal-visible{opacity:1;transform:translateY(0)}@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transition:none;transform:none}}.toast-viewport{z-index:5000;pointer-events:none;flex-direction:column-reverse;align-items:center;gap:8px;display:flex;position:fixed;bottom:28px;left:50%;transform:translate(-50%)}.toast{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-pill);color:var(--text);white-space:nowrap;animation:toast-lifecycle var(--toast-duration) ease forwards;align-items:center;gap:8px;padding:10px 18px;font-size:13px;font-weight:500;display:flex;box-shadow:0 12px 32px #00000073}.toast-success svg{color:var(--fill-bright);flex-shrink:0}.toast-error{border-color:var(--danger);color:var(--danger)}.toast-error svg{color:var(--danger);flex-shrink:0}@keyframes toast-lifecycle{0%{opacity:0;transform:translateY(10px)scale(.95)}10%{opacity:1;transform:translateY(0)scale(1)}88%{opacity:1;transform:translateY(0)scale(1)}to{opacity:0;transform:translateY(6px)scale(.97)}}@media (prefers-reduced-motion:reduce){.toast{animation:toast-fade var(--toast-duration) linear forwards}}@keyframes toast-fade{0%{opacity:0}10%{opacity:1}88%{opacity:1}to{opacity:0}}.brand-lockup{align-items:center;gap:9px;display:inline-flex}.brand-mark{background-color:var(--white);flex-shrink:0;width:20px;height:20px;display:inline-block;-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.brand-text{font-family:var(--sans);letter-spacing:.02em;color:var(--white);white-space:nowrap;font-size:15px;font-weight:800}.brand-slash{color:var(--text-dim);font-weight:500}.brand-lockup.sm .brand-mark{width:16px;height:16px}.brand-lockup.sm .brand-text{font-size:13px}.home{z-index:1;flex-direction:column;max-width:1160px;min-height:100svh;margin:0 auto;padding:0 32px;display:flex;position:relative}.home-vignette-top,.home-vignette-bottom{pointer-events:none;z-index:500;width:100vw;margin-left:-50vw;position:absolute;left:50%}.home-vignette-top{background:linear-gradient(to bottom, var(--bg), transparent);height:90px;top:0}.home-vignette-bottom{background:linear-gradient(to top, var(--bg), transparent);height:130px;bottom:0}.home-header{padding:40px 0}.home-hero{flex:1;grid-template-columns:1.15fr .85fr;align-items:center;gap:64px;padding:48px 0 96px;display:grid}.home-hero-copy{flex-direction:column;gap:28px;display:flex}.home-sub{max-width:46ch;font-size:18px}.btn-primary{background:var(--fill);color:var(--bg);border-radius:var(--radius-pill);transition:box-shadow .2s ease, transform var(--magnetic-duration,.1s) var(--magnetic-easing,ease);border:none;padding:16px 32px;font-size:16px;font-weight:600}.btn-primary:hover{box-shadow:0 0 0 1px #ffffff80,0 0 24px #ffffff4d}.btn-primary:active{transform:scale(.98)}.btn-ghost{color:var(--text);border:1px solid var(--border);border-radius:var(--radius-pill);transition:box-shadow .2s ease, border-color .2s ease, transform var(--magnetic-duration,.1s) var(--magnetic-easing,ease);background:0 0;padding:10px 18px;font-size:14px}.btn-ghost:hover{border-color:var(--fill-border);box-shadow:0 0 16px #ffffff1f}.home-join{flex-wrap:wrap;align-items:center;gap:10px;width:100%;max-width:440px;padding-top:12px;display:flex}.home-join-label{color:var(--text-dim);font-size:13px}.home-join input{background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--radius-pill);color:var(--text);flex:1;min-width:140px;padding:10px 16px;font-size:14px}.home-create-card{background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--radius-lg);flex-direction:column;gap:16px;padding:32px;display:flex}.home-create-sub{margin-top:-8px;font-size:14px}.home-name-input,.home-password-input{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);width:100%;padding:12px 14px;font-size:14px}.home-switch-row{justify-content:space-between;align-items:center;gap:16px;padding:4px 0;display:flex}.home-switch-text{flex-direction:column;gap:2px;display:flex}.home-switch-text strong{font-size:14px;font-weight:600}.home-switch-text small{color:var(--text-dim);font-size:12px}.home-switch{border-radius:var(--radius-pill);background:var(--bg-elevated);border:1px solid var(--border);flex-shrink:0;width:42px;height:24px;transition:background .15s,border-color .15s;display:inline-flex;position:relative}.home-switch.on{background:var(--fill);border-color:var(--fill)}.home-switch input{opacity:0;margin:0;position:absolute;inset:0}.home-switch-knob{background:var(--white);border-radius:50%;width:18px;height:18px;transition:transform .15s;position:absolute;top:2px;left:2px}.home-switch.on .home-switch-knob{background:var(--bg);transform:translate(18px)}.home-create-btn{text-align:center;width:100%;margin-top:4px}.home-create-footnote{text-align:center;color:var(--text-dim);font-size:12px}.home-features{border-top:1px solid #0000;border-image:linear-gradient(to right, transparent, var(--border-soft) 20%, var(--border-soft) 80%, transparent) 1;text-align:center;padding:64px 0 80px}.home-features-sub{max-width:44ch;margin:12px auto 0;font-size:16px}.home-feature-grid{text-align:left;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px;display:grid}.home-feature-card{background:var(--bg-raised);border:1px solid var(--border-soft);border-radius:var(--radius-md);flex-direction:column;gap:10px;padding:24px;display:flex}.home-feature-icon{border-radius:var(--radius-sm);background:var(--fill-bg);width:34px;height:34px;color:var(--fill-bright);justify-content:center;align-items:center;display:flex}.home-feature-icon svg{width:18px;height:18px}.home-feature-card p{font-size:14px}.home-how{border-top:1px solid #0000;border-image:linear-gradient(to right, transparent, var(--border-soft) 20%, var(--border-soft) 80%, transparent) 1;text-align:center;padding:64px 0 56px}.home-how-sub{margin-top:8px}.how-track{margin-top:44px;position:relative}.how-timeline{background:var(--border);height:2px;position:absolute;top:15px;left:calc(16.5% + 15px);right:calc(16.5% + 15px);overflow:hidden}.how-timeline:after{content:"";background:var(--fill-bright);transform-origin:0;animation:linear both how-timeline-fill;animation-timeline:view();animation-range:entry 15% cover 55%;position:absolute;inset:0;transform:scaleX(0)}@keyframes how-timeline-fill{to{transform:scaleX(1)}}.how-grid{text-align:left;grid-template-columns:repeat(3,1fr);gap:20px;display:grid;position:relative}.how-card{background:var(--bg-raised);border:1px solid var(--border-soft);border-radius:var(--radius-md);flex-direction:column;gap:10px;padding:24px;transition:transform .25s,box-shadow .25s,border-color .25s;animation:linear both how-card-reveal;animation-timeline:view();animation-range:entry entry 45%;display:flex}@keyframes how-card-reveal{0%{opacity:0;transform:translateY(28px)scale(.94)}to{opacity:1;transform:translateY(0)scale(1)}}.how-card:hover{border-color:var(--fill-border);transform:translateY(-5px);box-shadow:0 16px 36px #00000073}.how-badge{background:var(--fill);width:30px;height:30px;color:var(--bg);font-family:var(--heading);border-radius:50%;justify-content:center;align-items:center;font-size:14px;font-weight:800;display:inline-flex}.how-card p{font-size:14px}.mobile-warning{text-align:left;background:var(--bg-raised);border:1px solid var(--border-soft);border-radius:var(--radius-md);align-items:flex-start;gap:12px;margin-top:32px;padding:18px 20px;display:flex}.mobile-warning-icon{width:20px;height:20px;color:var(--text-dim);flex-shrink:0;margin-top:2px}.mobile-warning p{font-size:14px}.mobile-warning strong{color:var(--text)}.home-footer{border-top:1px solid #0000;border-image:linear-gradient(to right, transparent, var(--border-soft) 20%, var(--border-soft) 80%, transparent) 1;color:var(--text-dim);flex-wrap:wrap;align-items:center;gap:16px;padding:32px 0 40px;font-size:13px;display:flex}.home-footer-tagline{flex:1}.home-footer-terms{color:var(--text-dim)}@media (width<=900px){.home-hero{grid-template-columns:1fr;gap:40px;padding-top:24px}.home-feature-grid{grid-template-columns:repeat(2,1fr)}.how-grid{grid-template-columns:1fr}.how-timeline{display:none}}@media (width<=560px){.home{padding:0 20px}.home-feature-grid{grid-template-columns:1fr}}.presence-list{flex-direction:column;flex:1;gap:4px;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.presence-item{border-radius:var(--radius-sm);color:var(--text-dim);align-items:center;gap:10px;padding:8px 10px;font-size:14px;transition:opacity .25s,transform .25s,background .15s;display:flex}@starting-style{.presence-item{opacity:0;transform:translate(-6px)}}.presence-item.clickable:hover{background:var(--bg-elevated)}.presence-item.watching{background:var(--fill-bg);color:var(--text)}.presence-avatar{background:var(--bg-elevated);border:1.5px solid var(--border);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;transition:border-color .15s;display:flex}.presence-avatar-mark{background-color:var(--text-dim);width:13px;height:13px;display:inline-block;-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.presence-item.sharing .presence-avatar{border-color:var(--live)}.presence-item.sharing .presence-avatar-mark{background-color:var(--white)}.presence-name{color:var(--text);white-space:nowrap;text-overflow:ellipsis;flex:1;overflow:hidden}.presence-badge{text-transform:uppercase;letter-spacing:.04em;color:var(--live);border-radius:var(--radius-pill);border:1px solid #d5604f66;align-items:center;gap:5px;padding:3px 8px 3px 7px;font-size:11px;display:inline-flex}.live-dot{background:var(--live);border-radius:50%;flex-shrink:0;width:6px;height:6px;animation:1.4s ease-in-out infinite live-pulse}@keyframes live-pulse{0%,to{opacity:1;box-shadow:0 0 #d5604f80}50%{opacity:.6;box-shadow:0 0 0 3px #d5604f00}}.video-stage{border-radius:var(--radius-md);background:#000;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.video-stage.empty{background:var(--bg-raised);border:1px dashed var(--border);flex-direction:column;gap:14px;padding:32px}.video-stage-empty-icon{background:var(--bg-elevated);border:1px solid var(--border-soft);width:52px;height:52px;color:var(--text-dim);border-radius:50%;justify-content:center;align-items:center;display:flex}.video-stage-empty-icon svg{width:24px;height:24px}.video-stage.empty h3{color:var(--text)}.video-stage.empty p{text-align:center;max-width:32ch}.video-stage video{object-fit:contain;background:#000;width:100%;height:100%}.video-controls{opacity:0;gap:8px;transition:opacity .15s;display:flex;position:absolute;bottom:16px;right:16px}.video-stage:hover .video-controls{opacity:1}.video-controls .btn-ghost{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#09090bb3}.live-panel{border-left:1px solid var(--border-soft);background:var(--bg-raised);flex-direction:column;flex-shrink:0;gap:16px;width:240px;padding:24px;display:flex}.live-panel-header{text-transform:uppercase;letter-spacing:.06em;color:var(--text-dim);align-items:center;gap:8px;font-size:11px;display:flex}.live-panel-empty{max-width:26ch;font-size:13px}.live-panel-list{flex-direction:column;gap:4px;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.live-panel-item{border-radius:var(--radius-sm);color:var(--text-dim);align-items:center;gap:10px;padding:8px 10px;font-size:14px;transition:opacity .25s,transform .25s,background .15s;display:flex}@starting-style{.live-panel-item{opacity:0;transform:translate(6px)}}.live-panel-item.clickable{cursor:pointer}.live-panel-item.clickable:hover{background:var(--bg-elevated)}.live-panel-item.watching{background:var(--fill-bg);color:var(--text)}.live-panel-avatar{background:var(--bg-elevated);border:1.5px solid var(--live);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:26px;height:26px;display:flex}.live-panel-avatar-mark{background-color:var(--white);width:12px;height:12px;display:inline-block;-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.live-panel-name{color:var(--text);white-space:nowrap;text-overflow:ellipsis;flex:1;overflow:hidden}.live-panel-tag{text-transform:uppercase;letter-spacing:.04em;color:var(--fill-bright);font-size:10px}@media (width<=960px){.live-panel{display:none}}.pre-share-overlay{z-index:2000;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#09090bb3;justify-content:center;align-items:center;padding:24px;animation:.2s pre-share-fade;display:flex;position:fixed;inset:0}@keyframes pre-share-fade{0%{opacity:0}to{opacity:1}}.pre-share-card{background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--radius-lg);flex-direction:column;gap:20px;width:100%;max-width:480px;padding:32px;animation:.25s cubic-bezier(.22,1,.36,1) pre-share-rise;display:flex}@keyframes pre-share-rise{0%{opacity:0;transform:translateY(12px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}.pre-share-card h2{font-size:26px}.pre-share-hint{margin-top:-8px;font-size:14px}.pre-share-group{flex-direction:column;gap:8px;display:flex}.pre-share-group-label{text-transform:uppercase;letter-spacing:.06em;color:var(--text-dim);font-size:11px}.pre-share-options{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.pre-share-option{text-align:center;background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-sm);flex-direction:column;align-items:center;gap:4px;padding:10px 6px;transition:border-color .15s,box-shadow .2s,background .15s;display:flex}.pre-share-option:hover{border-color:var(--fill-border);box-shadow:0 0 14px #ffffff1a}.pre-share-option.active{background:var(--fill-bg);border-color:var(--fill-border)}.pre-share-option-title{font-family:var(--heading);color:var(--white);font-size:15px;font-weight:800}.pre-share-option-hint{color:var(--text-dim);font-size:10.5px;line-height:1.3}.pre-share-actions{justify-content:flex-end;gap:10px;margin-top:4px;display:flex}@media (width<=560px){.pre-share-options{grid-template-columns:repeat(2,1fr)}}.room{z-index:1;height:100svh;display:flex;position:relative}.room-sidebar{border-right:1px solid var(--border-soft);background:var(--bg-raised);flex-direction:column;flex-shrink:0;gap:24px;width:300px;padding:24px;display:flex}.room-online{flex-direction:column;gap:2px;display:flex}.room-online-number{font-family:var(--heading);letter-spacing:-.02em;color:var(--white);font-size:44px;font-weight:800;line-height:1}.room-online-label{color:var(--text-dim);font-size:13px}.room-code{border-bottom:1px solid var(--border-soft);flex-direction:column;gap:6px;padding-bottom:20px;display:flex}.room-code-top{justify-content:space-between;align-items:center;display:flex}.room-code-label{text-transform:uppercase;letter-spacing:.06em;color:var(--text-dim);font-size:11px}.room-exit-btn{color:var(--text-dim);border-radius:var(--radius-sm);background:0 0;border:none;justify-content:center;align-items:center;padding:5px;transition:color .15s,background .15s;display:flex}.room-exit-btn:hover{color:var(--danger);background:var(--bg-elevated)}.room-code-value{font-family:var(--heading);letter-spacing:-.01em;color:var(--white);font-size:22px;font-weight:800}.room-code-actions{gap:8px;margin-top:4px;display:flex}.room-code-actions .btn-ghost{text-align:center;white-space:nowrap;flex:1;padding-left:6px;padding-right:6px;font-size:12px}.room-rename-link{color:var(--text-dim);text-underline-offset:2px;background:0 0;border:none;align-self:flex-start;padding:0;font-size:12px;text-decoration:underline;transition:color .15s}.room-rename-link:hover{color:var(--text)}.room-rename-form{gap:8px;display:flex}.room-rename-form input{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-sm);min-width:0;color:var(--text);flex:1;padding:8px 10px;font-size:13px}.room-rename-form .btn-ghost{padding:8px 14px;font-size:13px}.room-share-row{gap:8px;display:flex}.room-share-btn{text-align:center;white-space:nowrap;flex:1;padding-left:6px;padding-right:6px;font-size:13px}.room-share-btn.active{border-color:var(--fill-border);color:var(--fill-bright)}.room-stop-btn{text-align:center;border-color:var(--danger);width:100%;color:var(--danger)}.room-stage{flex:1;padding:24px;display:flex}.room-gate{z-index:1;flex-direction:column;justify-content:center;align-items:center;gap:40px;min-height:100svh;display:flex;position:relative}.room-gate-mark.pulse{animation:1.6s ease-in-out infinite room-gate-pulse}@keyframes room-gate-pulse{0%,to{opacity:1}50%{opacity:.35}}.room-gate-form{text-align:center;flex-direction:column;gap:14px;width:320px;display:flex}.room-gate-form input{background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);text-align:center;padding:12px 14px;font-size:15px}.room-gate-error{color:var(--danger);font-size:13px}.room-gate-hint{margin-top:-6px;font-size:12px}@media (width<=720px){.room{flex-direction:column}.room-sidebar{border-right:none;border-bottom:1px solid var(--border-soft);width:100%;max-height:40svh}}.static-bg-fallback{z-index:-1;background:radial-gradient(ellipse 60% 45% at 50% 100%, #e8e0d524, transparent 70%), var(--bg);position:fixed;inset:0}