#richard-launcher{position:fixed;right:18px;top:78px;z-index:8;width:58px;height:58px;padding:0;border-radius:50%;overflow:hidden;border:1px solid var(--cyan);box-shadow:0 0 22px #00f2fe35;background:var(--bg)}
#richard-launcher img{width:100%;height:100%;object-fit:cover;transform:scale(1.3);transform-origin:50% 30%}
#richard-launcher:hover{box-shadow:0 0 30px #00f2fe70}
.topbar #richard-launcher{position:static;flex:0 0 30px;width:30px;height:30px;box-shadow:none;animation:none}
#richard-text,#richard-token{width:100%;padding:10px}#richard-speak{border-color:var(--cyan);margin-right:8px}
#richard-launcher[data-state=thinking],#richard-launcher[data-state=operating]{border-color:var(--purple);animation:richard-glow 2s ease-in-out infinite alternate}
#richard-launcher[data-state=error]{border-color:var(--red)}
#richard-panel{width:min(360px,calc(100vw - 24px));min-width:280px;min-height:300px;max-height:calc(100dvh - 32px);resize:both;overflow:auto;margin:auto;padding:16px;border-radius:20px;border:1px solid rgba(0,242,254,0.4);box-shadow:0 16px 48px rgba(0,0,0,0.55),0 0 35px rgba(0,242,254,0.22);background:var(--surface-strong);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);user-select:none}
#richard-panel::backdrop{background:rgba(0,8,18,.68);backdrop-filter:blur(7px)}
.richard-header{display:flex;justify-content:space-between;align-items:center;cursor:grab;padding-bottom:6px;border-bottom:1px solid rgba(0,242,254,0.15)}
.richard-header:active{cursor:grabbing}
.richard-header strong{font-size:16px;letter-spacing:-0.2px}
.richard-header small{display:block;color:var(--cyan);font:10px var(--mono);margin-top:2px}
#richard-close{background:transparent;border:0;color:var(--muted);font-size:16px;cursor:pointer;padding:4px 8px;border-radius:6px;transition:color .2s}
#richard-close:hover{color:var(--text);background:var(--hover)}
.richard-stage{position:relative;isolation:isolate;margin:12px auto 8px;width:min(100%,190px);aspect-ratio:1;overflow:hidden;border-radius:50%;border:1px solid rgba(0,242,254,0.45);background:#050913;box-shadow:0 0 30px rgba(0,242,254,0.25),inset 0 0 20px rgba(0,242,254,0.3)}
.richard-face{position:absolute;inset:0;--mouth:0;transform-origin:50% 85%}
.richard-face img{width:100%;height:100%;display:block;transform:scale(1.04)}
.richard-lid{position:absolute;top:28.6%;width:9.1%;height:3.4%;background:linear-gradient(#555b65,#a0a9b5 60%,#30353e);border-radius:55% 55% 40% 40%;border-bottom:1px solid #111;opacity:0;transition:opacity .25s}.richard-lid.left{left:35.6%;transform:rotate(3deg)}.richard-lid.right{left:54.6%;transform:rotate(-3deg)}
.richard-mouth{position:absolute;left:44%;top:47.7%;width:12%;height:3.6%;border-radius:45%;background:#080d16;border:1px solid #667689;transform:scaleY(var(--mouth));opacity:var(--mouth);box-shadow:inset 0 -2px 2px #8294a4}
.richard-orbit{position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 30px #00f2fe15;pointer-events:none}
.richard-stage-controls{position:absolute;bottom:8px;left:0;right:0;display:flex;justify-content:center;gap:6px;z-index:4;padding:0 8px;pointer-events:auto}
.richard-stage-btn{background:rgba(5,9,19,0.85);backdrop-filter:blur(8px);border:1px solid rgba(0,242,254,0.4);color:var(--text);border-radius:9999px;padding:3px 9px;font:10px var(--mono);font-weight:600;cursor:pointer;transition:all var(--fast);box-shadow:0 2px 8px rgba(0,0,0,0.5)}
.richard-stage-btn:hover{background:var(--hover);border-color:var(--cyan);transform:scale(1.05)}
.richard-stage-btn.primary{background:var(--cyan);color:var(--on-accent);border-color:transparent;box-shadow:0 0 10px var(--cyan-glow)}
.richard-stage-btn.danger{border-color:rgba(239,68,68,0.5);color:#ef4444;background:rgba(239,68,68,0.15)}
.richard-token-status-pill{display:inline-flex;align-items:center;justify-content:center;gap:7px;margin:2px auto 6px;padding:3px 10px;border-radius:9999px;background:rgba(0,255,196,0.12);border:1px solid rgba(0,255,196,0.35);font:9px var(--mono);color:#00ffc4;letter-spacing:0.8px;font-weight:600;width:fit-content}
.status-pulse-beacon{width:6px;height:6px;border-radius:50%;background:#00ffc4;box-shadow:0 0 6px #00ffc4;animation:beacon-pulse 1.4s infinite alternate ease-in-out}
@keyframes beacon-pulse{0%{transform:scale(0.8);opacity:0.6}100%{transform:scale(1.3);opacity:1}}
#richard-state{font:10.5px var(--mono);color:var(--cyan);text-align:center;min-height:16px;margin-bottom:6px}
.richard-aux-actions{display:flex;justify-content:flex-end;margin:4px 0 8px}
.richard-pill-btn{border:1px solid var(--line);background:var(--raised);color:var(--text);border-radius:8px;padding:5px 9px;font-size:11px;font-weight:600;cursor:pointer;transition:all var(--fast);display:inline-flex;align-items:center;gap:4px}
.richard-pill-btn:hover{background:var(--hover);border-color:var(--cyan)}
.richard-field-label{display:block;font-size:11px;color:var(--muted);margin-bottom:4px;font-family:var(--mono)}
#richard-text{width:100%;padding:10px;background:rgba(0,0,0,0.25);border:1px solid var(--line);border-radius:10px;color:var(--text);font-family:inherit;font-size:12px;resize:vertical}
#richard-text:focus{outline:0;border-color:var(--cyan);box-shadow:0 0 12px var(--cyan-glow)}
#richard-notice{font-size:11px;color:var(--muted);min-height:16px;margin:6px 0}
.richard-technical-details{margin-top:10px;border:1px solid var(--line);border-radius:12px;background:rgba(0,0,0,0.18);padding:8px 12px}
.richard-details-summary{cursor:pointer;color:var(--muted);font:10px var(--mono);user-select:none;outline:none}
.richard-details-summary:hover{color:var(--text)}
.richard-details-content{margin-top:10px;display:flex;flex-direction:column;gap:8px}
#richard-token{width:100%;padding:8px;border-radius:8px;border:1px solid var(--line);background:rgba(0,0,0,0.3);color:var(--text);font-family:var(--mono);font-size:11px}
#richard-panel audio{width:100%;height:34px;margin-top:6px}
#richard-audio-file{width:100%;font-size:11px;padding:6px}
#richard-panel .richard-motion{display:flex;gap:8px;align-items:center;font-size:11px;color:var(--muted)}
@keyframes richard-glow{to{box-shadow:0 0 28px #9871ff55,inset 0 0 25px #00f2fe25}}
@keyframes richard-think{50%{transform:rotate(-1.5deg) translateY(2px)}}
@keyframes richard-nod{50%{transform:translateY(3px) scale(.99)}}
#richard-panel.reduced-motion *,#richard-launcher.reduced-motion{animation:none!important;transition:none!important}.reduced-motion .richard-mouth{display:none}
@media(prefers-reduced-motion:reduce){#richard-panel *,#richard-launcher{animation:none!important;transition:none!important}}
@media(max-width:600px){#richard-launcher{width:44px;height:44px;top:76px;right:10px}#richard-panel{margin:auto}}