body{--glow:#88dfff;--warm:#428bf0;--halo:#3bb9ff26;--panel:#0d1b2bc9;--button:#102235;--button-hover:#1b3951;--on-accent:#082034}
body[data-persona=raphael]{--bg:#090a10;--surface:#171719;--line:#4b3a24;--text:#fff3d7;--muted:#b8ad98;--accent:#ffd174;--glow:#ffe19b;--warm:#ff9b27;--halo:#f89a2028;--panel:#171719e8;--button:#252119;--button-hover:#3d3020;--on-accent:#2c1b05;background:radial-gradient(ellipse at 50% 15%,#302114 0,transparent 43%),var(--bg)}
body[data-persona=iris]{--glow:#e2baff;--warm:#a374ff;--halo:#b681ff28;--accent:#dfbdff}
body[data-persona=raphael] button{background:var(--button)}body[data-persona=raphael] button:hover{background:var(--button-hover)}body[data-persona=raphael] .primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}body[data-persona=raphael] .primary:hover{background:#ffe3aa}body[data-persona=raphael] .modes button[aria-pressed=true]{border-color:#ae8345;background:#312619}body[data-persona=raphael] .voice-panel,body[data-persona=raphael] .conversation,body[data-persona=raphael] .jobs-panel,body[data-persona=raphael] .pc-panel,body[data-persona=raphael] .usage-panel{background:var(--panel);border-color:var(--line)}body[data-persona=raphael] .section-head,body[data-persona=raphael] form,body[data-persona=raphael] .settings{border-color:var(--line)}body[data-persona=raphael] .voice-grid select,body[data-persona=raphael] .voice-panel blockquote,body[data-persona=raphael] .jobs-panel textarea,body[data-persona=raphael] .jobs-panel select{background:#101115;border-color:var(--line)}body[data-persona=raphael] #usage-summary,body[data-persona=raphael] #pc-state{color:var(--accent)}
.voice-candidates{border-top:1px solid var(--line);padding-top:18px;margin-top:20px}.voice-candidates h3{font-size:14px;font-weight:500;margin:0}.voice-candidates .pc-buttons{margin:12px 0}.voice-candidates button[aria-pressed=true]{border-color:var(--accent)}
/* The light reacts to playback state, not measured microphone amplitude. */
.hero{position:relative;isolation:isolate;width:100vw;margin-left:calc(50% - 50vw);padding:34px 20px 28px;overflow:hidden;background:#0d0909}
.luminous-scene{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.hero>.eyebrow,.hero>.display-tools,.hero>h1,.hero>#status,.hero>.modes,.hero>.controls,.hero>.hint{position:relative;z-index:2}
.hero .eyebrow{font-size:10px;letter-spacing:.25em;opacity:.7}
.display-tools{display:flex;justify-content:flex-end;margin:12px 24px 0}.display-tools button{font-size:11px;padding:5px 12px;background:#100d0cb3;color:var(--muted)}
.astra-display{position:relative;z-index:1;width:min(100%,460px);aspect-ratio:1;margin:12px auto 18px;display:grid;place-items:center;color:var(--glow)}
.display-rings{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none;stroke:currentColor;filter:drop-shadow(0 0 5px var(--warm));opacity:.8;transition:opacity .6s}
.ring{transform-origin:250px 250px;animation:display-turn 130s linear infinite}
.seal-boundary{stroke-width:.8;opacity:.7}.sigil{stroke-width:.9;stroke-linecap:round;stroke-linejoin:round;opacity:.9}
.display-core{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:15px;pointer-events:none;color:#fff9ed;text-shadow:0 1px 3px #422100,0 0 8px #6a3500}
.display-name{font:500 15px/1.2 "Yu Mincho","Hiragino Mincho ProN",serif;letter-spacing:.28em;padding-left:.28em;color:#fff9e8}
.display-word{font:600 clamp(34px,7vw,54px)/1.25 "Yu Mincho","Hiragino Mincho ProN",serif;letter-spacing:.14em;padding-left:.14em;transition:transform .25s,text-shadow .25s;-webkit-text-stroke:.4px #80520d}
.display-state{font:8px/1.2 system-ui,sans-serif;letter-spacing:.26em;padding-left:.26em;color:#6c460c;text-shadow:0 0 4px #ffefb4}
.astra-display[data-state=speaking] .display-rings{opacity:1}.astra-display[data-state=speaking] .ring{animation-duration:75s}
.astra-display[data-emphasis=true] .display-word{transform:scale(1.16);text-shadow:0 1px 4px #623500,0 0 20px #fff6ca}
.astra-display[data-state=error] .display-rings{opacity:.4}
.hero>h1{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-weight:500;letter-spacing:.18em;text-shadow:0 0 16px #b7792244}
.hero>.modes button,.hero>.controls button{backdrop-filter:blur(8px);background:#17120ec9}
.hero>.controls .primary{background:var(--accent)}
body.focus-view main{max-width:none;padding:0 24px}
body.focus-view main>header,body.focus-view main>section:not(.hero),body.focus-view main>details,body.focus-view footer{display:none}
body.focus-view .hero{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 20px 20px}
body.focus-view .display-tools{position:absolute;top:16px;right:20px;margin:0}
body.focus-view .astra-display{width:min(60vh,680px,92vw)}
body.focus-view .hero>.hint{display:none}body.focus-view .eyebrow{margin-bottom:8px}body.focus-view .modes{margin-bottom:16px}
@keyframes display-turn{to{transform:rotate(360deg)}}
@media(max-width:600px){.hero{padding-top:22px}.astra-display{width:min(100%,350px)}.display-tools{margin:6px 0 0}.display-core{gap:10px}.hero .eyebrow{font-size:9px}body.focus-view main{padding:0 14px}body.focus-view .astra-display{width:min(62vh,95vw)}}
@media(prefers-reduced-motion:reduce){.astra-display *{animation:none!important;transition:none!important}.astra-display[data-emphasis=true] .display-word{transform:none}}
@media print{.astra-display *{animation:none!important}.luminous-scene{display:none}}

body{overflow-x:clip}

/* Match the reference's small nucleus and large engraved circumference. */
.display-rings{stroke:var(--warm);opacity:.95;filter:drop-shadow(0 0 4px var(--warm))}
.seal-boundary{stroke-width:1.25;opacity:.85}.sigil{stroke-width:1.15;opacity:1}
.display-name{position:absolute;bottom:calc(100% + 54px);white-space:nowrap;font-size:16px}
.display-state{position:absolute;top:calc(100% + 48px);color:var(--glow);text-shadow:0 0 8px #773900}
.display-word{color:#633600;text-shadow:0 0 8px #fff3b0;-webkit-text-stroke:0;font-size:clamp(26px,5vw,42px)}
.astra-display[data-emphasis=true] .display-word{color:#4b2700;text-shadow:0 0 10px #fffbe7}