:root{--bg:#0f0f14;--surface:#17171f;--surface-2:#1f1f29;--text:#f4f4f8;--text-muted:#a3a3b7;--border:#26262f;--accent:#8e7df8;--accent-contrast:#16102b;--accent-wash:#8e7df81f;--success:#46d393;--warning:#f0b429;--danger:#f87171;--radius-card:16px;--radius-tile:12px}@media (prefers-color-scheme:light){:root{--bg:#f6f6fa;--surface:#fff;--surface-2:#f0eff6;--text:#1c1b26;--text-muted:#5c5b6e;--border:#e5e4ee;--accent:#5f4bd8;--accent-contrast:#fff;--accent-wash:#5f4bd81a}}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}.shell{min-height:100dvh;padding:max(16px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom));flex-direction:column;gap:16px;max-width:430px;margin:0 auto;display:flex}.header{align-items:center;gap:10px;padding-top:8px;display:flex}.logo{background:var(--accent-wash);width:34px;height:34px;color:var(--accent);border-radius:12px;justify-content:center;align-items:center;display:flex}.title{margin:0;font-size:17px;font-weight:600}.banner{border-radius:var(--radius-tile);align-items:center;gap:8px;padding:10px 12px;font-size:13px;font-weight:500;display:flex}.banner.waiting{background:var(--surface-2);color:var(--text-muted)}.banner.connected{color:var(--success);background:#46d3931f}.banner.error{color:var(--danger);background:#f871711f}.dot{background:currentColor;border-radius:999px;flex-shrink:0;width:8px;height:8px}.preview-card{border-radius:var(--radius-card);background:var(--surface);border:1px solid var(--border);aspect-ratio:3/4;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.preview-card video{object-fit:cover;width:100%;height:100%;display:block}.preview-card video.mirrored{transform:scaleX(-1)}.preview-empty{color:var(--text-muted);text-align:center;justify-content:center;align-items:center;padding:0 24px;font-size:14px;line-height:1.5;display:flex;position:absolute;inset:0}.big-button{border-radius:var(--radius-card);background:var(--accent);width:100%;min-height:60px;color:var(--accent-contrast);cursor:pointer;border:none;justify-content:center;align-items:center;gap:10px;font-size:17px;font-weight:600;transition:transform .15s;display:flex}.big-button:active{transform:scale(.98)}.big-button:disabled{opacity:.6}.controls{gap:8px;display:flex}.control{border-radius:var(--radius-tile);border:1px solid var(--border);background:var(--surface);min-height:52px;color:var(--text);cursor:pointer;flex:1;font-size:13px;font-weight:600}.control.active{border-color:var(--accent);color:var(--accent);background:var(--accent-wash)}.control:disabled{opacity:.5}.ghost-button{border-radius:var(--radius-tile);background:var(--surface-2);min-height:52px;color:var(--danger);cursor:pointer;border:none;font-size:15px;font-weight:600}.code-row{gap:8px;display:flex}.code-input{border-radius:var(--radius-tile);border:1px solid var(--border);background:var(--surface);min-height:56px;color:var(--text);letter-spacing:.35em;text-align:center;text-transform:uppercase;flex:1;font-size:22px;font-weight:600}.code-input:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent)}.hint{color:var(--text-muted);margin:0;font-size:13px;line-height:1.55}.hint strong{color:var(--text)}.help{border:1px solid var(--border);border-radius:var(--radius-tile);color:var(--text-muted);padding:12px 14px;font-size:13px;line-height:1.6}.help strong{color:var(--text)}.mic-pending{border:1px solid var(--border);border-radius:var(--radius-tile);color:var(--text-muted);flex-direction:column;gap:10px;padding:12px 14px;font-size:13px;line-height:1.5;display:flex}.mic-pending-actions{gap:8px;display:flex}.pending-button{border-radius:var(--radius-tile);border:1px solid var(--border);background:var(--surface);min-height:48px;color:var(--text);cursor:pointer;flex:1;font-size:15px;font-weight:600}.pending-button.allow{color:var(--success);background:#46d39314;border-color:#46d39380}.pending-button.deny{color:var(--danger)}.pending-button:disabled{opacity:.5}.spacer{flex:1}.footer-note{text-align:center;color:var(--text-muted);font-size:12px}:root{--motion-instant:.1s;--motion-fast:.15s;--motion-base:.22s;--motion-slow:.35s;--motion-hero:.6s;--ease-standard:cubic-bezier(.2, 0, 0, 1);--ease-decelerate:cubic-bezier(.05, .7, .1, 1);--ease-accelerate:cubic-bezier(.3, 0, .8, .15)}:root[data-motion=reduced] *,:root[data-motion=off] *{transition-property:opacity,background-color,color,border-color!important;transition-duration:80ms!important;animation-duration:1ms!important;animation-iteration-count:1!important;animation-delay:0s!important}:root[data-motion=off] *{transition-duration:0s!important}@keyframes vc-fade-in{0%{opacity:0;transform:translateY(4px)}}@keyframes vc-appear{0%{opacity:.3;transform:scale(.985)}}@keyframes vc-shake{0%,to{transform:translate(0)}25%{transform:translate(-3px)}75%{transform:translate(3px)}}@keyframes vc-breathe{0%,to{opacity:1}50%{opacity:.55}}.vc-fade-in{animation:vc-fade-in .22s var(--ease-decelerate) both}.vc-appear{animation:vc-appear .4s var(--ease-decelerate) both}.vc-shake{animation:vc-shake .12s var(--ease-standard) 1}.vc-breathe{animation:3s ease-in-out infinite vc-breathe}.sas-card{border-radius:var(--radius-tile);border:1px solid var(--border);background:var(--surface-2);color:var(--text-muted);margin:0;padding:12px 14px;font-size:13px;line-height:1.6}.sas-card .sas-code{color:var(--text);letter-spacing:.12em;font-variant-numeric:tabular-nums;font-family:ui-monospace,Cascadia Code,Consolas,monospace;font-size:17px;font-weight:600}.mic-card{border:1px solid var(--border);border-radius:var(--radius-card);background:var(--surface);flex-direction:column;gap:12px;padding:14px;display:flex}.mic-toggle{cursor:pointer;align-items:center;gap:12px;display:flex}.mic-toggle input{opacity:0;pointer-events:none;position:absolute}.mic-toggle-text{flex-direction:column;flex:1;gap:2px;display:flex}.mic-toggle-text strong{color:var(--text);font-size:15px;font-weight:600}.mic-toggle-text small{color:var(--text-muted);font-size:12px;line-height:1.4}.switch{background:var(--surface-2);border:1px solid var(--border);width:44px;height:26px;transition:background var(--motion-base) var(--ease-standard);border-radius:999px;flex-shrink:0;position:relative}.switch:after{content:"";background:var(--text-muted);width:20px;height:20px;transition:transform var(--motion-base) var(--ease-standard), background var(--motion-base) var(--ease-standard);border-radius:999px;position:absolute;top:2px;left:2px}.mic-toggle input:checked~.switch{background:var(--accent);border-color:var(--accent)}.mic-toggle input:checked~.switch:after{background:var(--accent-contrast);transform:translate(18px)}.mic-toggle input:focus-visible~.switch{outline:2px solid var(--accent);outline-offset:2px}.mic-toggle input:disabled~.switch{opacity:.5}.mute-button{border-radius:var(--radius-tile);border:1px solid var(--border);background:var(--surface-2);min-height:60px;color:var(--text);cursor:pointer;justify-content:center;align-items:center;font-size:16px;font-weight:600;transition:transform .15s;display:flex}.mute-button:active{transform:scale(.98)}.mute-button.live{color:var(--success);border-color:#46d39380}.mute-button.muted{color:var(--danger);background:#f8717114;border-color:#f8717180}.meter{background:var(--surface-2);border-radius:999px;height:8px;position:relative;overflow:hidden}.meter-bar{background:linear-gradient(90deg, var(--success), var(--warning) 75%, var(--danger));border-radius:999px;width:0%;height:100%;transition:width .1s linear}.meter-peak{background:var(--text);opacity:.75;border-radius:999px;width:3px;transition:left .1s linear;position:absolute;top:0;bottom:0;left:0%}.picker-row{color:var(--text-muted);flex-direction:column;gap:6px;font-size:13px;font-weight:600;display:flex}.picker-row select{border-radius:var(--radius-tile);border:1px solid var(--border);background:var(--surface-2);min-height:48px;color:var(--text);padding:0 10px;font-size:14px;font-weight:400}.mic-note{color:var(--text-muted);margin:0;font-size:12px;line-height:1.5}