:root{--ink: #111827;--brand: #6366f1;--brand-light: #818cf8;--text: #ffffff;--body: #d1d5db;--muted: #9ca3af;--surface: rgb(255 255 255 / .025);--surface-hover: rgb(255 255 255 / .06);--line: rgb(255 255 255 / .1);color-scheme:dark;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--ink);color:var(--body);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{cursor:wait;opacity:.6}:focus-visible{outline:2px solid var(--brand);outline-offset:3px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.app{min-height:100%;display:flex;flex-direction:column;padding:calc(env(safe-area-inset-top) + .75rem) 1.25rem calc(env(safe-area-inset-bottom) + 1rem);max-width:40rem;margin:0 auto}.top{display:flex;align-items:center;justify-content:space-between}.logo{height:1.5rem;width:auto}.stage{flex:1 0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding-block:2rem 1rem}.status{margin:0;min-height:1.5rem;color:var(--muted);font-size:.95rem;text-align:center}.orb{--level: 0;position:relative;width:min(68vw,16rem);aspect-ratio:1;display:grid;place-items:center}.orb>*{grid-area:1 / 1}.halo{width:100%;height:100%;border-radius:50%;background:#6366f138;filter:blur(28px);transform:scale(calc(1 + var(--level) * .5));opacity:.45;transition:opacity .5s}.ring{width:82%;height:82%;border-radius:50%;border:1px solid rgb(129 140 248 / .4);transform:scale(calc(1 + var(--level) * .35))}.core{width:58%;height:58%;border-radius:50%;border:0;display:grid;place-items:center;background:var(--brand);color:#ffffffeb;box-shadow:0 25px 50px -12px #6366f173;transform:scale(calc(1 + var(--level) * .18));transition:background-color .3s}.core svg{width:32%;height:32%}.core:hover{background:var(--brand-light)}.app[data-state=live] .halo,.app[data-state=connecting] .halo{opacity:1}.app[data-state=connecting] .core{animation:pulse 1.6s ease-in-out infinite}.app[data-state=live] .core[aria-pressed=false],.app[data-state=ended] .core{background:#ffffff1a}.app[data-state=ended] .core:hover{background:#fff3}@keyframes pulse{50%{opacity:.55}}@media(prefers-reduced-motion:reduce){.halo,.ring,.core{transform:none}.app[data-state=connecting] .core{animation:none}}.captions{list-style:none;margin:0;padding:1.5rem 0 0;max-height:32vh;overflow-y:auto;display:flex;flex-direction:column;gap:.75rem;text-align:center;-webkit-mask-image:linear-gradient(to bottom,transparent,black 2.5rem);mask-image:linear-gradient(to bottom,transparent,black 2.5rem)}.captions:empty{display:none}.captions li{text-wrap:pretty;transition:opacity .3s}.captions .assistant{color:var(--text);font-size:1.15rem;line-height:1.6}.captions .user{color:var(--muted);font-size:.95rem;line-height:1.5}.captions .notice{color:var(--muted);font-size:.8rem}.captions .older{opacity:.5}.dock{display:flex;flex-direction:column;gap:1rem;padding-top:1.25rem}.controls{display:flex;justify-content:center;align-items:center;gap:1rem}.round{width:3.25rem;height:3.25rem;border-radius:50%;display:grid;place-items:center;background:var(--surface);color:var(--body);border:1px solid var(--line)}.round svg{width:1.35rem;height:1.35rem}.round:hover{background:var(--surface-hover);color:var(--text)}.round[aria-pressed=true]{background:var(--text);color:var(--ink);border-color:var(--text)}.end{height:3.25rem;padding:0 1.4rem;border-radius:999px;border:0;display:inline-flex;align-items:center;gap:.5rem;background:var(--text);color:var(--ink);font-weight:600}.end svg{width:1.2rem;height:1.2rem}.end:hover{background:#e5e7eb}.compose{display:flex;gap:.5rem}.compose input{flex:1;min-width:0;padding:.7rem 1rem;border-radius:999px;background:var(--surface);color:var(--text);border:1px solid var(--line);font:inherit;font-size:16px}.compose input::placeholder{color:#6b7280}.compose input:focus{outline:2px solid var(--brand);outline-offset:0;border-color:transparent}.primary{border:0;border-radius:999px;padding:.8rem 1.6rem;background:var(--brand);color:var(--text);font-weight:600}.primary:hover{background:var(--brand-light)}.primary.small{padding:.7rem 1.1rem}.text-button{border:0;background:none;color:var(--muted);padding:.5rem;font-size:.9rem}.text-button:hover{color:var(--text)}.signed-out{justify-content:center;align-items:center;text-align:center;gap:.75rem}.signed-out .logo{height:2rem;margin-bottom:1.5rem}.signed-out h1{margin:0;color:var(--text);font-size:1.5rem;font-weight:600}.signed-out .muted{margin:0 0 1.5rem;color:var(--muted)}.notice{margin:0 0 1rem;color:var(--body);font-size:.9rem;max-width:22rem}
