:root{--bg: #000000;--surface: rgba(28, 28, 30, .72);--surface-2: rgba(44, 44, 46, .82);--border: rgba(255, 255, 255, .18);--border-strong: rgba(255, 255, 255, .32);--text: #f0f0f0;--text-dim: #9a9a9a;--danger: #ff453a;--ok: #30d158;--warn: #ffd60a;--radius: 28px;--radius-sm: 18px;--radius-pill: 999px;--blur: blur(40px) saturate(160%);--blur-sm: blur(24px) saturate(150%);--ease-out: cubic-bezier(.22, 1, .36, 1);--ease-spring: cubic-bezier(.34, 1.4, .64, 1);--ease-soft: cubic-bezier(.25, .1, .25, 1);--font-display: "SF Pro Display", "Helvetica Neue", "Noto Sans SC", system-ui, sans-serif;--font-body: "SF Pro Text", "Helvetica Neue", "Noto Sans SC", system-ui, sans-serif}*{box-sizing:border-box}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}html,body,#root{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:var(--font-body);-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit;color:inherit}.app{position:relative;width:100%;height:100%;background:var(--bg)}.starfield{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;z-index:0;animation:canvasFadeIn 1.2s var(--ease-out) both}@keyframes canvasFadeIn{0%{opacity:0}to{opacity:1}}.overlay{position:relative;z-index:1;height:100%;display:flex;flex-direction:column;pointer-events:none}.overlay>*{pointer-events:auto}.top-bar{display:flex;justify-content:space-between;align-items:center;padding:28px 32px 0}.brand-name{font-family:var(--font-display);font-weight:600;font-size:clamp(2.1rem,4.2vw,3.4rem);letter-spacing:-.03em;line-height:1;color:#fff;animation:brandIn 1s var(--ease-out) both}@keyframes brandIn{0%{opacity:0;transform:translateY(12px) scale(.96);filter:blur(8px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}.icon-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--border);background:var(--surface);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);color:var(--text);border-radius:var(--radius-pill);padding:10px 18px;cursor:pointer;animation:chipIn .9s var(--ease-out) .12s both;transition:background .35s var(--ease-soft),border-color .35s var(--ease-soft),transform .45s var(--ease-spring)}.icon-btn:hover{background:var(--surface-2);border-color:var(--border-strong);transform:scale(1.04)}.icon-btn:active{transform:scale(.94);transition-duration:.12s}@keyframes chipIn{0%{opacity:0;transform:translateY(-8px) scale(.92)}to{opacity:1;transform:translateY(0) scale(1)}}.center-stage{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding-bottom:48px;gap:18px}.glass-panel{width:min(560px,calc(100% - 40px));background:#202022c7;border:1px solid var(--border);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);border-radius:var(--radius);padding:22px 24px;transform-origin:50% 100%;animation:panelIn 1s var(--ease-out) .18s both;transition:transform .7s var(--ease-out),border-color .5s var(--ease-soft),background .5s var(--ease-soft),box-shadow .7s var(--ease-out)}.glass-panel.in-call{transform:translateY(-6px) scale(1.015);border-color:#ffffff42;background:#262628d1}@keyframes panelIn{0%{opacity:0;transform:translateY(40px) scale(.94);filter:blur(12px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}.status-row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px}.status-pill{display:inline-flex;align-items:center;gap:8px;color:var(--text-dim);font-size:.85rem;transition:color .4s var(--ease-soft)}.status-pill[data-state=listening]{color:#ffffffbf}.status-pill[data-state=thinking]{color:var(--warn)}.status-pill[data-state=speaking]{color:var(--ok)}.status-label{display:inline-block;animation:labelSwap .45s var(--ease-out)}@keyframes labelSwap{0%{opacity:0;transform:translateY(6px);filter:blur(4px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--text-dim);transition:background .4s var(--ease-soft),transform .5s var(--ease-spring)}.status-dot.listening{background:#fff;animation:softPulse 1.8s var(--ease-soft) infinite}.status-dot.thinking{background:var(--warn);animation:softPulse 1.1s var(--ease-soft) infinite}.status-dot.speaking{background:var(--ok);animation:softPulse .9s var(--ease-soft) infinite}@keyframes softPulse{0%,to{opacity:.45;transform:scale(1)}50%{opacity:1;transform:scale(1.35)}}.mode-toggle{display:flex;gap:2px;padding:3px;border-radius:var(--radius-pill);background:#0c0c0e8c;border:1px solid var(--border);backdrop-filter:var(--blur-sm);-webkit-backdrop-filter:var(--blur-sm)}.mode-toggle button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:transparent;color:var(--text-dim);padding:6px 14px;border-radius:var(--radius-pill);cursor:pointer;font-size:.8rem;transition:background .4s var(--ease-out),color .35s var(--ease-soft),transform .4s var(--ease-spring)}.mode-toggle button:hover{color:#fff}.mode-toggle button:active{transform:scale(.94)}.mode-toggle button.active{background:#ffffff24;color:#fff}.captions{min-height:72px;max-height:140px;overflow-y:auto;display:flex;flex-direction:column;gap:10px}.caption{font-size:.95rem;line-height:1.55;animation:captionIn .55s var(--ease-out) both}.caption.user{color:#b0b0b0}.caption.jack{color:var(--text)}.caption .who{display:block;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim);margin-bottom:2px}@keyframes captionIn{0%{opacity:0;transform:translateY(10px) scale(.98);filter:blur(6px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}.controls{display:flex;justify-content:center;gap:12px;margin-top:18px;flex-wrap:wrap;min-height:48px}.control-enter{animation:controlIn .55s var(--ease-spring) both}@keyframes controlIn{0%{opacity:0;transform:translateY(14px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}.primary-btn,.ghost-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:var(--radius-pill);padding:12px 26px;cursor:pointer;transition:background .35s var(--ease-soft),border-color .35s var(--ease-soft),opacity .3s var(--ease-soft),transform .45s var(--ease-spring),filter .35s var(--ease-soft)}.primary-btn{border:1px solid #fff;background:#fff;color:#111;font-weight:600}.primary-btn:hover{background:#e8e8e8;transform:scale(1.04)}.primary-btn:active{transform:scale(.94);transition-duration:.12s}.primary-btn:disabled{opacity:.45;cursor:not-allowed;transform:none}.primary-btn.danger{border-color:var(--danger);background:var(--danger);color:#fff}.primary-btn.danger:hover{background:#e03e34}.ghost-btn{border:1px solid var(--border);background:#1c1c1eb3;color:var(--text);backdrop-filter:var(--blur-sm);-webkit-backdrop-filter:var(--blur-sm)}.ghost-btn:hover{border-color:var(--border-strong);background:#ffffff14;transform:scale(1.04)}.ghost-btn:active{transform:scale(.94);transition-duration:.12s}.ghost-btn.holding{background:#ffffff29;border-color:#fff6;transform:scale(1.06);animation:holdPulse 1.2s var(--ease-soft) infinite}@keyframes holdPulse{0%,to{box-shadow:0 0 #ffffff1f}50%{box-shadow:0 0 0 10px #fff0}}.hint{text-align:center;color:var(--text-dim);font-size:.8rem;margin-top:10px;transition:opacity .4s var(--ease-soft)}.hint-swap{animation:labelSwap .4s var(--ease-out)}.text-row{margin-top:14px;display:flex;gap:8px;animation:controlIn .55s var(--ease-out) both}.text-row input{flex:1;border-radius:var(--radius-sm);border:1px solid var(--border);background:#121214b8;backdrop-filter:var(--blur-sm);-webkit-backdrop-filter:var(--blur-sm);padding:10px 14px;outline:none;transition:border-color .35s var(--ease-soft),background .35s var(--ease-soft),transform .4s var(--ease-spring)}.text-row input:focus{border-color:var(--border-strong);background:#18181ad9}.settings-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;background:#0000006b;backdrop-filter:blur(28px) saturate(140%);-webkit-backdrop-filter:blur(28px) saturate(140%);display:flex;justify-content:flex-end;animation:backdropIn .4s var(--ease-out) both}.settings-backdrop.closing{animation:backdropOut .35s var(--ease-soft) both}@keyframes backdropIn{0%{opacity:0;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}to{opacity:1;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}}@keyframes backdropOut{0%{opacity:1}to{opacity:0}}.settings-panel{width:min(420px,100%);height:100%;background:#161618d1;border-left:1px solid var(--border);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);padding:28px 24px;overflow-y:auto;animation:drawerIn .55s var(--ease-out) both}.settings-backdrop.closing .settings-panel{animation:drawerOut .35s var(--ease-soft) both}@keyframes drawerIn{0%{opacity:0;transform:translate(48px)}to{opacity:1;transform:translate(0)}}@keyframes drawerOut{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(36px)}}.settings-panel h2{font-family:var(--font-display);font-weight:600;letter-spacing:-.02em;margin:0 0 6px;animation:captionIn .5s var(--ease-out) .08s both}.settings-panel .desc{color:var(--text-dim);font-size:.85rem;margin-bottom:22px;animation:captionIn .5s var(--ease-out) .14s both}.provider-block{margin-bottom:18px;animation:captionIn .5s var(--ease-out) .16s both}.provider-block>label{display:block;font-size:.78rem;color:var(--text-dim);letter-spacing:.04em;margin-bottom:8px}.provider-grid{display:flex;flex-wrap:wrap;gap:8px}.provider-chip,.model-chip{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--border);background:#1c1c1ebf;color:var(--text-dim);border-radius:var(--radius-pill);padding:7px 12px;font-size:.78rem;cursor:pointer;backdrop-filter:var(--blur-sm);-webkit-backdrop-filter:var(--blur-sm);transition:background .35s var(--ease-soft),border-color .35s var(--ease-soft),color .3s var(--ease-soft),transform .4s var(--ease-spring)}.provider-chip:hover,.model-chip:hover{color:#fff;border-color:var(--border-strong);transform:scale(1.04)}.provider-chip:active,.model-chip:active{transform:scale(.95);transition-duration:.12s}.provider-chip.active,.model-chip.active{background:#ffffff29;border-color:#ffffff59;color:#fff}.provider-hint{margin:10px 0 0;font-size:.78rem;color:var(--text-dim);line-height:1.45}.model-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.settings-fields{display:flex;flex-direction:column}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;animation:captionIn .55s var(--ease-out) both}.settings-fields>.field:nth-child(1){animation-delay:.18s}.settings-fields>.field:nth-child(2){animation-delay:.24s}.settings-fields>.field:nth-child(3){animation-delay:.3s}.settings-fields>.field:nth-child(4){animation-delay:.36s}.field label{font-size:.78rem;color:var(--text-dim);letter-spacing:.04em}.field-label-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.link-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:transparent;color:#fff;font-size:.78rem;cursor:pointer;padding:0;text-decoration:underline;text-underline-offset:3px;opacity:.75;transition:opacity .25s var(--ease-soft)}.link-btn:hover{opacity:1}.link-btn:disabled{opacity:.4;cursor:not-allowed}.detected-block{display:flex;flex-direction:column;gap:8px;margin-top:4px;animation:captionIn .45s var(--ease-out) both}.model-filter{border-radius:14px!important;border:1px solid var(--border)!important;background:#00000047!important;padding:8px 12px!important;outline:none;font-size:.8rem}.model-chips.detected{max-height:180px;overflow-y:auto;padding-right:2px}.model-chips.detected .model-chip{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.field input{border-radius:var(--radius-sm);border:1px solid var(--border);background:#121214b8;padding:10px 12px;outline:none;backdrop-filter:var(--blur-sm);-webkit-backdrop-filter:var(--blur-sm);transition:border-color .35s var(--ease-soft),background .35s var(--ease-soft),transform .4s var(--ease-spring)}.field input:focus{border-color:var(--border-strong);transform:scale(1.01)}.settings-actions{display:flex;gap:10px;margin-top:8px;flex-wrap:wrap;animation:controlIn .5s var(--ease-out) .4s both}.test-msg{margin-top:12px;font-size:.85rem;color:var(--text-dim);animation:captionIn .4s var(--ease-out);white-space:pre-line;line-height:1.45}.test-msg.ok{color:var(--ok)}.test-msg.err{color:var(--danger)}.error-toast{position:absolute;left:50%;bottom:24px;transform:translate(-50%);z-index:6;max-width:min(520px,calc(100% - 32px));padding:12px 16px;border-radius:var(--radius-sm);background:#301012d1;border:1px solid rgba(255,69,58,.4);color:#ffd0d0;font-size:.85rem;backdrop-filter:var(--blur-sm);-webkit-backdrop-filter:var(--blur-sm);animation:toastIn .5s var(--ease-spring) both;cursor:pointer}.settings-section{margin-top:8px;margin-bottom:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,.08);animation:captionIn .5s var(--ease-out) .2s both}.settings-section h3{margin:12px 0 6px;font-size:.95rem;font-weight:600;letter-spacing:-.01em}@keyframes toastIn{0%{opacity:0;transform:translate(-50%,18px) scale(.94)}to{opacity:1;transform:translate(-50%) scale(1)}}@media (max-width: 640px){.top-bar{padding:20px 16px 0}.brand-name{font-size:1.9rem}.center-stage{padding-bottom:28px}.glass-panel{border-radius:24px}}