*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}:root{--bp-sm: 480px;--bp-md: 768px;--bp-lg: 1024px;--bp-xl: 1280px;--bp-2xl: 1536px;--space-1: clamp(.25rem, .2rem + .25vw, .5rem);--space-2: clamp(.5rem, .4rem + .5vw, 1rem);--space-3: clamp(1rem, .8rem + 1vw, 2rem);--space-4: clamp(1.5rem, 1rem + 2vw, 3rem);--fs-body: clamp(.95rem, .9rem + .25vw, 1.05rem);--fs-h3: clamp(1.1rem, 1rem + .6vw, 1.4rem);--fs-h2: clamp(1.35rem, 1.1rem + 1.2vw, 2rem);--fs-h1: clamp(1.75rem, 1.2rem + 2.5vw, 3.25rem);font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;font-size:var(--fs-body);color-scheme:light dark;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-height:100dvh;overflow-x:clip;background:#f0f2f5;color:#111}img,picture,video,canvas,svg{display:block;max-width:100%;height:auto}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,li,td,.card-content,.topbar-status{overflow-wrap:anywhere}h1,h2,h3{line-height:1.2}.shell{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"top" "stage" "panel";min-height:100dvh;min-width:0}.topbar{grid-area:top}.stage{grid-area:stage}.panel{grid-area:panel}.topbar,.stage,.panel{min-width:0}.topbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-2);padding:max(var(--space-2),env(safe-area-inset-top)) max(var(--space-2),env(safe-area-inset-right)) var(--space-2) max(var(--space-2),env(safe-area-inset-left));background:#111;color:#f5f5f5}.brand{margin:0;font-size:var(--fs-h3);font-weight:650}.topbar-status{margin:0;min-width:0;flex:1 1 12rem;text-align:end}.stage{display:grid;align-content:center;padding:var(--space-2);padding-inline:max(var(--space-2),env(safe-area-inset-left)) max(var(--space-2),env(safe-area-inset-right));background:#1a1a1a}.video-container{position:relative;width:min(100%,80rem);margin-inline:auto;border-radius:12px;overflow:hidden;background:#111}.video-source{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;opacity:0;pointer-events:none;z-index:0}.video-media{position:relative;z-index:1;width:100%;max-width:100%;height:auto;max-height:min(62dvh,100%);object-fit:contain;background:#111}.panel{display:grid;align-content:start;gap:var(--space-2);padding:var(--space-2);padding-inline:max(var(--space-2),env(safe-area-inset-left)) max(var(--space-2),env(safe-area-inset-right));padding-bottom:max(var(--space-3),env(safe-area-inset-bottom))}.status-grid{display:grid;gap:var(--space-2);grid-template-columns:repeat(auto-fit,minmax(min(100%,11rem),1fr))}.status-card,.session-card{min-width:0;background:#fff;border-radius:12px;padding:var(--space-2);box-shadow:0 4px 12px #0000000d;color:#111}.card-title{font-size:.9rem;color:#666;margin-bottom:var(--space-1)}.card-content{font-size:var(--fs-h3);font-weight:650}.session-card p{margin:var(--space-1) 0}.api-connected{color:#1e7a34}.api-error{color:#b42318}.field{display:grid;gap:var(--space-1);margin:var(--space-2) 0}.field span,.check-row span{font-weight:650}.check-row{display:flex;align-items:center;gap:var(--space-2);min-height:44px;cursor:pointer}input:not([type=checkbox]):not([type=range]):not([type=file]),select,textarea{width:100%;min-height:44px;font-size:16px}input[type=checkbox]{width:1.25rem;height:1.25rem;min-width:1.25rem;min-height:1.25rem;accent-color:#111}input[type=file],input[type=range]{font-size:16px;min-height:44px;max-width:100%;min-width:0}.dev-source{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-2)}.dev-source button{flex:1 1 9rem;color:#fff;background:#1a1a1a}.dev-source label{flex:1 1 100%;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-1);align-items:center;min-width:0}a{font-weight:500;color:#646cff;text-decoration:inherit}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;min-height:44px;font-size:1rem;font-weight:500;font-family:inherit;color:#fff;background-color:#1a1a1a;cursor:pointer}button:focus,button:focus-visible,select:focus,select:focus-visible,input:focus,input:focus-visible{outline:3px solid #646cff;outline-offset:2px}.toast{position:fixed;z-index:60;left:max(var(--space-2),env(safe-area-inset-left));right:max(var(--space-2),env(safe-area-inset-right));top:max(var(--space-2),env(safe-area-inset-top));width:auto;max-width:28rem;margin-inline:auto;padding:var(--space-2) var(--space-3);border-radius:8px;background:#1e7a34;color:#fff;font-size:var(--fs-body);font-weight:650;text-align:center;overflow-wrap:anywhere;box-shadow:0 4px 12px #00000026}@media (min-width: 480px){.dev-source label{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}}@media (min-width: 1024px){.shell{height:100dvh;grid-template-columns:minmax(0,1fr) clamp(16rem,32vw,26rem);grid-template-rows:auto minmax(0,1fr);grid-template-areas:"top top" "stage panel"}.stage{min-height:0}.status-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.video-media{width:auto;max-width:100%;max-height:calc(100dvh - 5rem)}.panel{overflow:auto;padding-bottom:max(var(--space-2),env(safe-area-inset-bottom))}.topbar-status{text-align:end}}@media (hover: hover){a:hover{color:#535bf2}button:hover{border-color:#646cff}}@media (prefers-color-scheme: dark){body{background:#242424;color:#ffffffde}.status-card,.session-card{background:#2a2a2a;color:#ffffffde}.card-title{color:#aaa}.card-content{color:#fff}.api-connected{color:#3ddc84}.api-error{color:#ff8a80}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation:none!important;transition:none!important}}.pwa-install-prompt-banner{position:fixed;z-index:50;left:max(var(--space-2),env(safe-area-inset-left));right:max(var(--space-2),env(safe-area-inset-right));bottom:max(var(--space-2),env(safe-area-inset-bottom));width:auto;max-width:min(28rem,100%);max-height:90dvh;margin-inline:auto;overflow:auto;padding:var(--space-3);border-radius:12px;background:#333;color:#fff;box-shadow:0 4px 12px #0000004d}.pwa-install-content{display:flex;flex-direction:column;align-items:stretch;gap:var(--space-2);text-align:center;min-width:0}.pwa-install-content p,.pwa-install-content li{margin:0;overflow-wrap:anywhere}.pwa-install-content ol{margin:0;padding-left:1.25rem;text-align:start}.pwa-install-buttons{display:flex;flex-wrap:wrap;gap:var(--space-2);width:100%}.pwa-install-button{flex:1 1 8rem;min-height:44px;padding:.7em 1em;border:none;border-radius:8px;font-size:1rem;font-weight:650;cursor:pointer}.pwa-install-button.yes{background:#646cff;color:#fff}.pwa-install-button.no,.pwa-install-content>.pwa-install-button{background:#555;color:#eee}@media (hover: hover){.pwa-install-button.yes:hover{background:#535bf2}.pwa-install-button.no:hover,.pwa-install-content>.pwa-install-button:hover{background:#666}}
