:root{--bg:#070a18;--fg:#f2f4fb;--muted:#9aa3c4;--line:#ffffff1a;--glass:#ffffff0e;--accent:#7c5cff;--accent-2:#2dd4bf;--accent-3:#f472b6;--ok:#34d399;--warn:#fbbf24;--err:#fb7185;--radius:18px}*{box-sizing:border-box}html,body{height:100%}body{background:var(--bg);color:var(--fg);-webkit-font-smoothing:antialiased;flex-direction:column;min-height:100dvh;margin:0;font:16px/1.6 ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,sans-serif;display:flex;overflow-x:hidden}.aurora{z-index:0;pointer-events:none;position:fixed;inset:0;overflow:hidden}.aurora i{filter:blur(90px);opacity:.38;mix-blend-mode:screen;border-radius:50%;width:46vmax;height:46vmax;animation:26s ease-in-out infinite drift;display:block;position:absolute}.aurora i:first-child{background:#4f46e5;top:-12vmax;left:-8vmax}.aurora i:nth-child(2){background:#9333ea;animation-delay:-9s;bottom:-16vmax;right:-10vmax}.aurora i:nth-child(3){opacity:.22;background:#db2777;animation-delay:-17s;top:30%;left:55%}@keyframes drift{0%,to{transform:translate(0,0)scale(1)}50%{transform:translate(3vmax,-4vmax)scale(1.12)}}header,main,footer{z-index:1;position:relative}header{justify-content:space-between;align-items:center;gap:16px;padding:20px clamp(16px,5vw,40px);display:flex}.brand{color:inherit;letter-spacing:-.01em;align-items:center;gap:12px;font-weight:650;text-decoration:none;display:flex}.brand svg{width:26px;height:26px}.brand small{color:var(--muted);letter-spacing:0;font-size:.78rem;font-weight:400;display:block}.home{color:var(--muted);font-size:.9rem;text-decoration:none}.home:hover{color:var(--fg)}.seg{background:var(--glass);border:1px solid var(--line);border-radius:999px;padding:3px;display:inline-flex}.seg button{color:var(--muted);font:inherit;cursor:pointer;background:0 0;border:0;border-radius:999px;padding:7px 16px;font-size:.86rem;transition:color .18s,background .18s}.seg button[aria-pressed=true]{color:var(--fg);background:#ffffff1f}.seg button:disabled{opacity:.45;cursor:not-allowed}main{flex-direction:column;flex:1;align-items:center;width:100%;max-width:860px;margin:0 auto;padding:clamp(8px,3vh,28px) clamp(16px,5vw,40px) 40px;display:flex}h1{letter-spacing:-.025em;text-align:center;margin:0 0 8px;font-size:clamp(1.55rem,3.4vw,2.15rem);font-weight:680;line-height:1.15}h1 em{background:linear-gradient(100deg,#a78bfa,#f472b6 60%,#38bdf8);color:#0000;-webkit-background-clip:text;background-clip:text;font-style:normal}.lede{color:var(--muted);text-align:center;max-width:44ch;margin:0 0 clamp(10px,2.4vh,20px);font-size:.95rem}.stage{aspect-ratio:1;place-items:center;width:min(210px,46vw);display:grid;position:relative}.orb{transform:scale(var(--level,1));background:radial-gradient(circle at 32% 28%,#a78bfa,#6d28d9 45%,#1e1b4b 100%);border-radius:50%;transition:transform 70ms ease-out,box-shadow .3s,background .5s;position:absolute;inset:0;box-shadow:0 0 70px #7c5cff6b,inset 0 0 60px #00000073}main[data-state=listening] .orb{background:radial-gradient(circle at 32% 28%,#5eead4,#0d9488 45%,#042f2e 100%);box-shadow:0 0 70px #2dd4bf6b,inset 0 0 60px #00000073}main[data-state=idle] .orb{background:radial-gradient(circle at 32% 28%,#8b7cf6,#4c1d95 48%,#17123a 100%);box-shadow:0 0 52px #7c5cff4d,inset 0 0 60px #00000073}.portrait{aspect-ratio:1;pointer-events:none;border-radius:50%;width:78%;transition:box-shadow .4s ease-out;position:absolute;box-shadow:0 0 0 3px #a78bfa99,0 0 34px 4px #7c5cff73}main[data-state=listening] .portrait{box-shadow:0 0 0 3px #2dd4bfcc,0 0 40px 6px #2dd4bf80}.portrait img,.portrait video{object-fit:cover;border-radius:50%;width:100%;height:100%;display:block;position:absolute;inset:0;-webkit-mask-image:radial-gradient(circle,#000 86%,#0000 100%);mask-image:radial-gradient(circle,#000 86%,#0000 100%)}.portrait video{opacity:0;transition:opacity 90ms linear}.portrait video.on{opacity:1;transition:opacity .2s ease-out}.ring{color:#a78bfa8c;opacity:0;border:1px solid;border-radius:50%;position:absolute;inset:0}main[data-state=listening] .ring{color:#2dd4bf8c}main[data-state=speaking] .ring,main[data-state=listening] .ring{animation:2.6s ease-out infinite pulse}.ring:nth-of-type(2){animation-delay:.85s}.ring:nth-of-type(3){animation-delay:1.7s}@keyframes pulse{0%{opacity:.5;transform:scale(1)}to{opacity:0;transform:scale(1.65)}}.status{color:var(--muted);text-align:center;min-height:1.6em;margin:18px 0 4px;font-size:.95rem}.status b{color:var(--fg);font-weight:600}.controls{flex-direction:column;align-items:center;gap:12px;margin-top:6px;display:flex}.mic{cursor:pointer;font:inherit;color:#fff;background:linear-gradient(135deg, var(--accent), #4f46e5 55%, var(--accent-3));border:0;border-radius:999px;align-items:center;gap:12px;padding:16px 34px;font-weight:620;transition:transform .16s cubic-bezier(.2,.8,.2,1),box-shadow .2s,filter .2s;display:inline-flex;box-shadow:0 12px 34px -12px #7c5cffd9}.mic:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 18px 40px -12px #7c5cfff2}.mic:active:not(:disabled){transform:translateY(0)scale(.985)}.mic:disabled{filter:grayscale(.6)brightness(.75);cursor:wait}.mic.stop{background:linear-gradient(135deg,#f43f5e,#be123c);box-shadow:0 12px 34px -12px #f43f5ecc}.mic svg{width:20px;height:20px}.hint{color:var(--muted);text-align:center;font-size:.84rem}.timer{font-variant-numeric:tabular-nums}.panels{grid-template-columns:minmax(0,1fr);align-items:start;gap:22px;width:100%;display:grid}.panels .side{flex-direction:column;align-items:center;display:flex}@media (width>=900px){.panels{grid-template-columns:340px minmax(0,1fr);gap:36px}.panels .side{flex-direction:column;align-items:center;display:flex}.panels .feed{text-align:left}.metrics-note,.log{margin-left:0!important;margin-right:0!important}}.chips{flex-wrap:wrap;justify-content:center;align-items:center;gap:7px;margin:16px 0 0;display:flex}@media (width>=900px){.chips{justify-content:flex-start}}.chips span:not(.chips-label){color:var(--muted);border:1px solid var(--line);background:var(--glass);border-radius:999px;padding:5px 12px;font-size:.8rem}.chips-label{text-transform:uppercase;letter-spacing:.09em;width:100%;color:var(--muted);font-size:.74rem}.metrics{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;width:100%;max-width:560px;margin:0;display:grid}.metric{background:var(--glass);border:1px solid var(--line);border-radius:var(--radius);text-align:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:14px 12px}.metric .v{font-variant-numeric:tabular-nums;letter-spacing:-.02em;font-size:clamp(1.25rem,4.5vw,1.75rem);font-weight:680}.metric .v.flash{animation:.7s ease-out flash}@keyframes flash{0%{color:var(--accent-2);transform:scale(1.12)}to{color:inherit;transform:scale(1)}}.metric .l{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-top:3px;font-size:.72rem}.metrics-note{color:var(--muted);max-width:58ch;margin:10px 0 0;font-size:.78rem}.log-label{text-transform:uppercase;letter-spacing:.09em;width:100%;color:var(--muted);margin:18px 0 -8px;font-size:.74rem;display:block}.hint .tip{color:var(--warn)}.log{scrollbar-width:thin;flex-direction:column;gap:10px;width:100%;max-width:640px;max-height:42vh;margin:18px 0 0;display:flex;overflow-y:auto}.bubble{border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:16px;max-width:86%;padding:11px 15px;animation:.32s cubic-bezier(.2,.8,.2,1) both rise}@keyframes rise{0%{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}.bubble.you{max-width:78%;color:var(--muted);background:#2dd4bf17;border-color:#2dd4bf38;align-self:flex-end;font-size:.89rem}.bubble.sari{background:#7c5cff24;border-color:#7c5cff52;align-self:flex-start}.bubble.sys{color:var(--muted);background:0 0;border-style:dashed;align-self:center;font-size:.85rem}.bubble .who{text-transform:uppercase;letter-spacing:.09em;color:var(--muted);margin-bottom:3px;font-size:.68rem}.bubble .ms{float:right;color:var(--accent-2);font-variant-numeric:tabular-nums;margin-left:10px;font-size:.72rem}.notice{border-radius:var(--radius);color:#ffe4e6;background:#fb71851a;border:1px solid #fb718559;width:100%;max-width:560px;margin:20px 0 0;padding:15px 18px}.notice.hidden{display:none}.notice b{margin-bottom:3px;display:block}footer{text-align:center;color:var(--muted);padding:22px clamp(16px,5vw,40px) 32px;font-size:.82rem}footer a{color:#c4b5fd}@media (width<=430px){.brand small{display:none}}@media (width<=480px){.metrics{grid-template-columns:1fr 1fr}.metrics .metric:last-child{grid-column:span 2}}@media (prefers-reduced-motion:reduce){.aurora i,.ring,.bubble,.metric .v.flash{animation:none!important}.orb{transition:none}*{scroll-behavior:auto!important}}