:root{--font: "Outfit", system-ui, sans-serif;--ease-out: cubic-bezier(.22, 1, .36, 1);--ease-in-out: cubic-bezier(.65, 0, .35, 1);--panel-bg: rgba(12, 14, 20, .55);--panel-border: rgba(255, 255, 255, .1);--text: #f4f6fa;--text-muted: rgba(244, 246, 250, .55);--accent: #6ee7b7;--accent-dim: rgba(110, 231, 183, .15);--danger: #f87171;--danger-dim: rgba(248, 113, 113, .15);--primary: #60a5fa;--dock-width: 300px;--dock-compact: 56px;--transition: .7s var(--ease-out)}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:var(--font);font-weight:300;background:#080a0f url(/bg.jpg) center / cover no-repeat fixed;color:var(--text);overflow:hidden}#app{position:relative;width:100%;height:100%;min-height:100dvh}.stage{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;overflow:hidden}.stage-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(#080a0f33,#080a0f73),#030408 url(/bg.jpg) center / cover no-repeat}.stage-vignette{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 40%,rgba(0,0,0,.45) 100%);opacity:.6;transition:opacity var(--transition)}#video,#overlay{position:absolute;display:none;object-fit:fill}#video{opacity:0;transition:opacity .9s var(--ease-out)}#overlay{pointer-events:none}#app.active #video{opacity:1}#app.active .stage-vignette{opacity:.25}.brand{position:fixed;top:0;left:0;z-index:5;max-width:22rem;padding:.9rem 1.1rem;pointer-events:none;opacity:0;transform:translateY(-8px);background:var(--panel-bg);backdrop-filter:blur(24px) saturate(1.4);-webkit-backdrop-filter:blur(24px) saturate(1.4);box-shadow:0 8px 32px #00000047;animation:brand-in .9s var(--ease-out) .15s forwards}@keyframes brand-in{to{opacity:1;transform:translateY(0)}}.brand h1{margin:0;font-size:clamp(1.75rem,3vw,2.35rem);font-weight:200;letter-spacing:-.03em;line-height:1.1;color:var(--text)}.brand-sub{margin:.45rem 0 0;font-size:.92rem;font-weight:300;color:var(--text-muted);line-height:1.45}.controls-dock{position:fixed;top:50%;z-index:10;display:flex;flex-direction:column;gap:.65rem;width:min(var(--dock-width),calc(100vw - 2rem));transition:left var(--transition),right var(--transition),transform var(--transition),width var(--transition)}#app.idle .controls-dock{left:50%;right:auto;transform:translate(-50%,-50%);align-items:stretch}#app.active .controls-dock{left:auto;right:2.25rem;transform:translateY(-50%);align-items:flex-end;width:var(--dock-width);gap:.85rem}.controls-panel{display:flex;flex-direction:column;gap:.85rem;padding:1.15rem;border-radius:10px;background:var(--panel-bg);border:1px solid var(--panel-border);backdrop-filter:blur(24px) saturate(1.4);-webkit-backdrop-filter:blur(24px) saturate(1.4);box-shadow:0 24px 64px #00000073,inset 0 1px #ffffff0f;transition:width var(--transition),padding var(--transition),gap var(--transition)}#app.active .controls-panel{width:var(--dock-compact);padding:.65rem .55rem;gap:.72rem;align-items:center}.icon-slot{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.btn-icon,.status-icon,.action-icon{width:22px;height:22px}#app.active .status-label,#app.active .status-value,#app.active .btn-text,#app.active #start-btn,#app.active .camera-picker{display:none}.camera-picker{display:flex;flex-direction:column;gap:.35rem;width:100%;margin-top:.35rem}.camera-picker-label{font-size:.78rem;font-weight:300;letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted)}.camera-select{width:100%;padding:.62rem 2rem .62rem .75rem;border-radius:8px;border:1px solid rgba(255,255,255,.14);background:#00000047;color:var(--text);font-family:var(--font);font-size:.86rem;font-weight:300;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23a8b0bd' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .7rem center}.camera-select:disabled{opacity:.45;cursor:not-allowed}.camera-select:focus{outline:none;border-color:#60a5fa73}.btn-start{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;width:100%;border:none;border-radius:10px;padding:.72rem 1rem;font-family:var(--font);font-size:.88rem;font-weight:400;cursor:pointer;color:#dbeafe;background:#60a5fa38;border:1px solid rgba(96,165,250,.38);transition:background .2s ease,transform .15s ease}.btn-start:hover:not(:disabled){background:#60a5fa52}.btn-start:active:not(:disabled){transform:scale(.98)}.btn-start:disabled{opacity:.38;cursor:not-allowed}.btn-action{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;font-family:var(--font);font-size:.88rem;font-weight:400;cursor:pointer;transition:background .2s ease,border-color .2s ease,box-shadow .2s ease,transform .15s ease}.btn-action:disabled{opacity:.38;cursor:not-allowed}.btn-action:active:not(:disabled){transform:scale(.96)}#app.idle #stop-btn{display:none!important}#app.active #stop-btn{display:inline-flex}#app.idle .btn-stop{width:100%;justify-content:flex-start;padding:.65rem 1rem;border-radius:10px;border:1px solid rgba(248,113,113,.45);background:#f8717124;color:#fecaca}#app.idle .btn-stop:hover:not(:disabled){background:#f871713d}#app.idle .btn-start{margin-top:0}#app.idle .btn-ptt{width:100%;justify-content:flex-start;margin-top:.15rem;padding:.75rem 1rem;border-radius:12px;border:2px solid rgba(110,231,183,.4);background:#6ee7b71f;color:var(--accent);touch-action:none;-webkit-user-select:none;user-select:none}#app.idle .btn-ptt .btn-text{display:flex;flex-direction:column;align-items:flex-start;text-align:left}#app.idle .btn-ptt:hover:not(:disabled){background:#6ee7b72e}#app.active .btn-stop{width:40px;height:40px;padding:0;margin-top:0;border-radius:8px;border:1px solid rgba(248,113,113,.55);background:#f8717133;color:#fecaca}#app.active .btn-stop:hover:not(:disabled){background:#f8717152}#app.active .btn-ptt{width:42px;height:42px;padding:0;border-radius:50%;border:1px solid rgba(110,231,183,.55);background:#6ee7b729;color:var(--accent);touch-action:none;-webkit-user-select:none;user-select:none}#app.active .btn-ptt:hover:not(:disabled){background:#6ee7b73d}#app.active .btn-ptt:active:not(:disabled),#app.active .btn-ptt.active{background:#6ee7b752;border-color:#6ee7b7bf;box-shadow:0 0 0 3px #6ee7b726}.ptt-label{font-size:.95rem;font-weight:400;color:var(--accent)}.ptt-hint{font-size:.72rem;font-weight:300;color:var(--text-muted)}.status-grid{display:flex;flex-direction:column;gap:0;padding:.15rem 0}#app.active .status-grid{flex-direction:column;align-items:center;gap:.62rem;padding:0}.status-item{pointer-events:none;display:flex;align-items:center;gap:.65rem;padding:.55rem 0;border:none;background:transparent;color:var(--text-muted);transition:color .2s ease}#app.idle .status-item{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:0 .65rem;width:100%;border-bottom:1px solid rgba(255,255,255,.06)}#app.idle .status-item:last-child{border-bottom:none}#app.active .status-item{width:auto;height:auto;padding:.2rem;justify-content:center;flex-direction:column;gap:.2rem}#app.active .status-item:after{content:"";width:4px;height:4px;border-radius:50%;background:currentColor;opacity:.85}.status-item.standing,.status-item.mic-on{color:var(--accent)}.status-item.sitting,.status-item.mic-off{color:var(--danger)}.status-item.scanning{color:var(--text-muted)}.status-label{font-size:.78rem;font-weight:300;letter-spacing:.04em;color:var(--text-muted);text-transform:uppercase}.status-value{font-size:.86rem;font-weight:400}.status-value.on{color:var(--accent)}.status-value.off{color:var(--danger)}.waveform-wrap{width:100%;padding:8px 10px;border-radius:6px;background:#00000038}#app.idle .waveform-wrap{margin-top:.15rem}#app.active .waveform-wrap{width:140px;padding:7px 8px}#waveform{display:block;width:100%;height:28px}.error{position:fixed;bottom:1.75rem;left:50%;transform:translate(-50%);z-index:20;margin:0;padding:.75rem 1.1rem;max-width:min(90vw,420px);border-radius:12px;background:#3c0c0ce0;border:1px solid rgba(248,113,113,.35);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fecaca;font-size:.86rem;font-weight:300;text-align:center;box-shadow:0 12px 40px #0006}.error.hidden{display:none}@media(max-width:640px){.brand{top:0;left:0;right:auto;max-width:none}.brand h1{font-size:1.55rem}.brand-sub{font-size:.82rem}#app.idle .controls-dock,#app.active .controls-dock{left:50%;right:auto;top:auto;bottom:1.25rem;transform:translate(-50%);width:calc(100vw - 1.5rem);align-items:stretch}#app.active .controls-panel{width:100%;flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:flex-end;padding:.75rem .85rem;gap:1.15rem}#app.active .status-grid{flex-direction:row;gap:1.15rem}#app.active .btn-stop,#app.active .btn-ptt{flex-shrink:0}#app.active .waveform-wrap{align-self:flex-end}#app.active .controls-dock{bottom:1rem;gap:.85rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}