:root{--sp-1:0.25rem;--sp-2:0.5rem;--sp-3:0.75rem;--sp-4:1rem;--sp-5:1.5rem;--sp-6:2rem;--sp-7:3rem;--sp-8:4rem;--text-xs:0.75rem;--text-sm:0.8125rem;--text-base:0.9375rem;--text-lg:1.0625rem;--text-xl:1.375rem;--text-2xl:1.875rem;--text-3xl:2.5rem;--z-video:0;--z-scrim:10;--z-controls:20;--z-status:30;--z-banner:40;--dur-fast:140ms;--dur:220ms;--dur-slow:420ms;--ease-out:cubic-bezier(0.22,1,0.36,1);--safe-t:max(var(--sp-4),env(safe-area-inset-top));--safe-b:max(var(--sp-4),env(safe-area-inset-bottom));--safe-l:max(var(--sp-4),env(safe-area-inset-left));--safe-r:max(var(--sp-4),env(safe-area-inset-right));--tap:3rem}*{box-sizing:border-box}body,html{margin:0;padding:0;height:100%}body{background:var(--c-bg);color:var(--c-text);font-family:var(--font-sans);font-size:var(--text-base);line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overscroll-behavior:none;-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:none;background:none}a,button{color:inherit}a{text-decoration:none}:focus-visible{outline:2px solid var(--c-accent);outline-offset:3px;border-radius:6px}.cockpit{position:fixed;inset:0;overflow:hidden;background:#000;--pad-t:var(--safe-t);--pad-b:var(--safe-b)}.cockpit__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000;z-index:var(--z-video)}.cockpit__video[data-mirror=true]{transform:scaleX(-1)}.cockpit__idle{position:absolute;inset:0;z-index:var(--z-video);display:grid;place-items:center;background:radial-gradient(120% 90% at 50% 18%,color-mix(in oklab,var(--c-accent) 14%,transparent),transparent 60%),var(--c-bg)}.cockpit__idle-mark{font-family:var(--font-display);font-size:var(--text-3xl);font-weight:800;letter-spacing:-.03em;color:var(--c-text);margin:0}.cockpit__idle-hint{margin:var(--sp-2) 0 0;color:var(--c-text-muted);font-size:var(--text-sm)}.cockpit__scrim{position:absolute;left:0;right:0;z-index:var(--z-scrim);pointer-events:none}.cockpit__scrim--top{top:0;height:32%;background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,0))}.cockpit__scrim--bottom{bottom:0;height:42%;background:linear-gradient(0deg,rgba(0,0,0,.72),rgba(0,0,0,0))}.cockpit__top{position:absolute;top:0;left:0;right:0;z-index:var(--z-status);display:flex;align-items:center;gap:var(--sp-3);padding:var(--pad-t) var(--safe-r) 0 var(--safe-l)}.cockpit__brand{font-family:var(--font-display);font-weight:800;font-size:var(--text-lg);letter-spacing:-.02em;text-shadow:0 1px 12px rgba(0,0,0,.6)}.cockpit__spacer{flex:1 1}.iconbtn{display:grid;place-items:center;width:var(--tap);height:var(--tap);border-radius:999px;color:var(--c-text);background:rgba(0,0,0,.32);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background var(--dur-fast) var(--ease-out),transform var(--dur-fast) var(--ease-out)}.iconbtn:hover{background:rgba(0,0,0,.5)}.iconbtn:active{transform:scale(.94)}.iconbtn svg{width:22px;height:22px}.iconbtn[data-active=true]{background:rgba(255,255,255,.92);color:#14110b}.iconbtn[aria-disabled=true]{opacity:.4}.cockpit__rail{position:absolute;right:var(--safe-r);top:50%;transform:translateY(-50%);z-index:var(--z-status);display:flex;flex-direction:column;gap:var(--sp-3)}.statuspill{display:inline-flex;align-items:center;gap:var(--sp-2);height:2rem;padding:0 var(--sp-3);border-radius:999px;font-size:var(--text-sm);font-weight:700;letter-spacing:.01em;background:rgba(0,0,0,.42);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);white-space:nowrap}.statuspill__dot{width:9px;height:9px;border-radius:999px;flex:none}.statuspill[data-state=live]{color:#fff}.statuspill[data-state=live] .statuspill__dot{background:var(--c-live);box-shadow:0 0 0 0 color-mix(in oklab,var(--c-live) 70%,transparent);animation:live-pulse 2s var(--ease-out) infinite}.statuspill[data-state=reconnecting]{color:#fff;background:color-mix(in oklab,var(--c-live) 30%,rgba(0,0,0,.5))}.statuspill[data-state=reconnecting] .statuspill__dot{background:var(--c-live);animation:blink 1s steps(2,jump-none) infinite}.statuspill__time{font-feature-settings:"tnum";font-variant-numeric:tabular-nums;opacity:.85;font-weight:600}.reconnect-banner{position:absolute;left:50%;top:calc(var(--pad-t) + 3.25rem);transform:translateX(-50%);z-index:var(--z-banner);display:flex;align-items:center;gap:var(--sp-3);max-width:min(92vw,30rem);padding:var(--sp-3) var(--sp-4);border-radius:14px;background:rgba(8,8,10,.82);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 8px 30px rgba(0,0,0,.45);animation:rise var(--dur) var(--ease-out) both}.reconnect-banner__spinner{width:18px;height:18px;flex:none;border-radius:999px;border:2px solid color-mix(in oklab,var(--c-live) 40%,transparent);border-top-color:var(--c-live);animation:spin .9s linear infinite}.reconnect-banner__text{display:flex;flex-direction:column;gap:1px;line-height:1.25}.reconnect-banner__title{font-weight:700;font-size:var(--text-sm)}.reconnect-banner__sub{font-size:var(--text-xs);color:var(--c-text-muted)}.cockpit__controls{position:absolute;left:0;right:0;bottom:0;z-index:var(--z-controls);display:flex;flex-direction:column;align-items:center;gap:var(--sp-4);padding:var(--sp-5) var(--safe-r) var(--pad-b) var(--safe-l)}.readyhint{display:inline-flex;align-items:center;gap:var(--sp-2);font-size:var(--text-sm);color:rgba(255,255,255,.92);text-shadow:0 1px 8px rgba(0,0,0,.7)}.readyhint__dot{width:8px;height:8px;border-radius:999px;background:#36d399}.readyhint[data-blocked=true] .readyhint__dot{background:var(--c-text-muted)}.stats{align-items:stretch;border-radius:12px;overflow:hidden;background:rgba(255,255,255,.1);font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.stats,.stats__cell{display:flex;gap:1px}.stats__cell{flex-direction:column;align-items:center;min-width:4.25rem;padding:var(--sp-2) var(--sp-3);background:rgba(0,0,0,.5);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.stats__val{font-size:var(--text-base);font-weight:700;line-height:1}.stats__val[data-warn=true]{color:var(--c-live)}.stats__label{font-size:.6875rem;color:var(--c-text-muted);letter-spacing:.02em}.golive{position:relative;width:min(100%,22rem);min-height:3.75rem;padding:0 var(--sp-6);border-radius:var(--radius-button);font-size:var(--text-lg);font-weight:700;letter-spacing:-.01em;display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-3);color:var(--c-accent-text);background:var(--c-accent);box-shadow:0 10px 30px -8px color-mix(in oklab,var(--c-accent) 60%,transparent);transition:transform var(--dur-fast) var(--ease-out),box-shadow var(--dur) var(--ease-out),background var(--dur) var(--ease-out),opacity var(--dur-fast) var(--ease-out)}.golive:hover{transform:translateY(-1px)}.golive:active{transform:translateY(0) scale(.985)}.golive[data-variant=live]{color:#fff;background:var(--c-danger);box-shadow:0 10px 30px -8px color-mix(in oklab,var(--c-danger) 55%,transparent)}.golive[data-variant=busy]{pointer-events:none;opacity:.7}.golive__icon{width:11px;height:11px;border-radius:999px;background:currentColor;flex:none}.golive[data-variant=live] .golive__icon{border-radius:3px}.golive__spinner{width:18px;height:18px;border-radius:999px;border:2px solid color-mix(in oklab,currentColor 35%,transparent);border-top-color:currentcolor;animation:spin .8s linear infinite}.cockpit__error{width:min(100%,22rem);text-align:center;font-size:var(--text-sm);color:var(--c-error);background:rgba(0,0,0,.55);padding:var(--sp-2) var(--sp-3);border-radius:10px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.settings{min-height:100%;max-width:34rem;margin:0 auto;padding:var(--safe-t) var(--safe-r) var(--safe-b) var(--safe-l)}.settings__bar{display:flex;gap:var(--sp-3);margin-bottom:var(--sp-5)}.settings__back,.settings__bar{align-items:center;height:var(--tap)}.settings__back{display:inline-flex;gap:var(--sp-2);padding-right:var(--sp-2);color:var(--c-text-muted);font-size:var(--text-sm);font-weight:600;transition:color var(--dur-fast) var(--ease-out)}.settings__back:hover{color:var(--c-text)}.settings__title{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:800;letter-spacing:-.02em;margin:0 0 var(--sp-6)}.section{margin-bottom:var(--sp-7)}.section:last-of-type{margin-bottom:5.5rem}.section__head{font-size:var(--text-base);font-weight:700;margin:0 0 var(--sp-1)}.section__note{font-size:var(--text-sm);color:var(--c-text-muted);margin:0 0 var(--sp-4);max-width:60ch}.field{margin-bottom:var(--sp-4)}.field__label{display:block;font-size:var(--text-sm);font-weight:600;margin-bottom:var(--sp-2)}.field__hint{font-size:var(--text-xs);color:var(--c-text-muted);margin-top:var(--sp-2)}.input{width:100%;min-height:var(--tap);padding:0 var(--sp-4);border-radius:12px;background:var(--c-surface);color:var(--c-text);border:1px solid color-mix(in oklab,var(--c-text) 12%,transparent);font-size:var(--text-base);transition:border-color var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out)}.input::placeholder{color:color-mix(in oklab,var(--c-text-muted) 90%,transparent)}.input:focus{outline:none;border-color:var(--c-accent);box-shadow:0 0 0 3px color-mix(in oklab,var(--c-accent) 25%,transparent)}.input[type=number]{text-align:left}.input-row{display:flex;gap:var(--sp-2)}.input-reveal{flex:none;width:var(--tap);border-radius:12px;background:var(--c-surface);border:1px solid color-mix(in oklab,var(--c-text) 12%,transparent);color:var(--c-text-muted);display:grid;place-items:center;transition:color var(--dur-fast) var(--ease-out)}.input-reveal:hover{color:var(--c-text)}.grid-2{display:grid;grid-template-columns:1fr 1fr;grid-gap:var(--sp-3);gap:var(--sp-3)}.locked{display:flex;gap:var(--sp-3);align-items:flex-start;padding:var(--sp-4);border-radius:12px;background:var(--c-surface);border:1px solid color-mix(in oklab,var(--c-text) 10%,transparent)}.locked svg{width:18px;height:18px;flex:none;margin-top:1px;color:var(--c-text-muted)}.locked__text{font-size:var(--text-sm);color:var(--c-text-muted);line-height:1.45}.savebar{position:-webkit-sticky;position:sticky;bottom:0;display:flex;align-items:center;justify-content:flex-end;gap:var(--sp-3);padding:var(--sp-4) 0 var(--safe-b);background:linear-gradient(to top,var(--c-bg) 70%,transparent)}.savebar__status{margin-right:auto;font-size:var(--text-sm);color:var(--c-text-muted)}.btn{min-height:var(--tap);padding:0 var(--sp-5);border-radius:12px;font-weight:700;font-size:var(--text-base);color:var(--c-accent-text);background:var(--c-accent);transition:transform var(--dur-fast) var(--ease-out),opacity var(--dur-fast) var(--ease-out)}.btn:active{transform:scale(.98)}.btn[disabled]{opacity:.45;pointer-events:none}.btn--ghost{background:transparent;color:var(--c-text-muted)}.chat{display:flex;flex-direction:column;min-height:0}.chat--full{flex:1 1;background:var(--c-bg)}.chat__scroll{flex:1 1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:var(--sp-2);padding:var(--sp-3) var(--sp-4);-webkit-overflow-scrolling:touch;overscroll-behavior:contain}.chat__line{margin:0;font-size:var(--text-base);line-height:1.35;word-break:break-word}.chat__user{font-weight:700;margin-right:.4em;color:var(--c-accent)}.chat__text{color:var(--c-text)}.chat__empty{margin:auto;padding:var(--sp-5);text-align:center;color:var(--c-text-muted);font-size:var(--text-sm)}.chat-overlay{position:absolute;z-index:var(--z-status);left:var(--safe-l);bottom:calc(var(--pad-b) + 8.5rem);width:min(78vw,22rem);max-height:38vh;display:flex;flex-direction:column;border-radius:16px;overflow:hidden;background:rgba(8,8,10,.62);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 10px 34px rgba(0,0,0,.45)}.chat-overlay .chat__scroll{-webkit-mask-image:linear-gradient(180deg,transparent,#000 18%);mask-image:linear-gradient(180deg,transparent,#000 18%)}.chat-overlay .chat__text{color:rgba(255,255,255,.92)}.chat-overlay__head{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-2) var(--sp-2) var(--sp-3);border-bottom:1px solid rgba(255,255,255,.08)}.chat-overlay__chan{font-size:var(--text-sm);font-weight:700}.chat-overlay__btn{min-width:2rem;height:2rem;padding:0 var(--sp-2);border-radius:8px;font-size:var(--text-xs);font-weight:700;color:var(--c-text);background:rgba(255,255,255,.12)}.chat-overlay__btn[data-active=true]{background:var(--c-accent);color:var(--c-accent-text)}.monitor{position:fixed;inset:0;display:flex;flex-direction:column;background:var(--c-bg)}.monitor__stage{position:relative;width:100%;aspect-ratio:16/9;background:#000;flex:none}.monitor__video{width:100%;height:100%;object-fit:contain;background:#000}.monitor__overlay{inset:0;flex-direction:column;justify-content:center;gap:var(--sp-3);color:var(--c-text-muted);font-size:var(--text-sm)}.monitor__bar,.monitor__overlay{position:absolute;display:flex;align-items:center}.monitor__bar{left:0;right:0;top:0;gap:var(--sp-2);padding:var(--safe-t) var(--safe-r) var(--sp-2) var(--safe-l);background:linear-gradient(180deg,rgba(0,0,0,.55),transparent)}.monitor__chan{font-weight:700;font-size:var(--text-sm);text-shadow:0 1px 8px rgba(0,0,0,.7)}.monitor--start{align-items:center;justify-content:center;padding:var(--safe-t) var(--safe-r) var(--safe-b) var(--safe-l)}.monitor__back{position:absolute;top:var(--safe-t);left:var(--safe-l)}.monitor__startcard{max-width:22rem;text-align:center}.monitor__title{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:800;letter-spacing:-.02em;margin:0 0 var(--sp-3)}.monitor__sub{color:var(--c-text-muted);font-size:var(--text-base);line-height:1.5;margin:0 0 var(--sp-5)}.monitor__startbtn{width:100%}@keyframes live-pulse{0%{box-shadow:0 0 0 0 color-mix(in oklab,var(--c-live) 65%,transparent)}70%{box-shadow:0 0 0 7px color-mix(in oklab,var(--c-live) 0%,transparent)}to{box-shadow:0 0 0 0 color-mix(in oklab,var(--c-live) 0%,transparent)}}@keyframes blink{50%{opacity:.35}}@keyframes spin{to{transform:rotate(1turn)}}@keyframes rise{0%{opacity:0;transform:translateX(-50%) translateY(-6px)}}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.statuspill[data-state=reconnecting] .statuspill__dot{opacity:1}}