:root{--bg:#0b1020;--card:#121a33;--text:#e8ecf8;--muted:#8d97b5;--accent:#4f7cff;--accent-2:#8a5cff;--danger:#ff4d6a;--me:#24315c;--agent:#1b2547;color:var(--text);background:radial-gradient(1200px 600px at 50% -10%, #1d2a5a 0%, var(--bg) 60%);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}body{place-items:center;min-height:100vh;margin:0;padding:24px;display:grid}.card{background:var(--card);text-align:center;border:1px solid #ffffff12;border-radius:24px;width:min(440px,100%);padding:32px 28px;box-shadow:0 30px 80px #0008}h1{margin:0;font-size:1.5rem}.sub{color:var(--muted);margin:8px 0 0;font-size:.9rem}.orb{width:148px;height:148px;margin:36px auto 20px;position:relative}.orb span{background:linear-gradient(135deg, var(--accent), var(--accent-2));opacity:.25;border-radius:50%;transition:transform .4s,opacity .4s;position:absolute;inset:0}.orb span:nth-child(2){opacity:.45;inset:18px}.orb span:nth-child(3){opacity:1;inset:36px}.orb[data-state=idle] span,.orb[data-state=ended] span{filter:grayscale(.7)}.orb[data-state=connecting] span,.orb[data-state=waiting] span{animation:1.6s ease-in-out infinite pulse}.orb[data-state=listening] span:first-child{animation:3s ease-in-out infinite breathe}.orb[data-state=thinking] span:nth-child(3){background:conic-gradient(var(--accent), var(--accent-2), var(--accent));animation:1.2s linear infinite spin}.orb[data-state=speaking] span:first-child{animation:.5s ease-in-out infinite alternate talk}.orb[data-state=speaking] span:nth-child(2){animation:.5s ease-in-out .15s infinite alternate talk}.orb[data-state=error] span{background:var(--danger)}@keyframes pulse{50%{opacity:.6;transform:scale(.9)}}@keyframes breathe{50%{transform:scale(1.08)}}@keyframes talk{to{transform:scale(1.15)}}@keyframes spin{to{transform:rotate(360deg)}}.status{min-height:1.4em;margin:0;font-weight:600}.timer{color:var(--muted);font-variant-numeric:tabular-nums;margin:6px 0 0}.controls{justify-content:center;gap:12px;margin-top:24px;display:flex}button{font:inherit;color:#fff;cursor:pointer;border:0;border-radius:999px;padding:12px 26px;font-weight:600;transition:transform .1s,opacity .2s,background .2s}button:active{transform:scale(.97)}button:disabled{opacity:.5;cursor:progress}button:focus-visible{outline-offset:2px;outline:2px solid #fff}.primary{background:linear-gradient(135deg, var(--accent), var(--accent-2))}.danger{background:var(--danger)}.secondary{background:#ffffff14}.secondary.active{background:#ffffff30}.transcript{text-align:left;flex-direction:column;gap:8px;max-height:260px;margin-top:24px;padding-right:4px;display:flex;overflow-y:auto}.bubble{white-space:pre-wrap;border-radius:16px;max-width:85%;padding:10px 14px;font-size:.92rem;line-height:1.4}.bubble.agent{background:var(--agent);border-bottom-left-radius:4px;align-self:flex-start}.bubble.me{background:var(--me);border-bottom-right-radius:4px;align-self:flex-end}@media (prefers-reduced-motion:reduce){.orb span{animation:none!important}}