:root{color-scheme:dark;font-family:system-ui,-apple-system,Segoe UI,sans-serif;--bg: #06080d;--panel: #0e1320;--line: #1c2333;--text: #e8edf6;--muted: #8a97ac;--accent: #3b82f6;--accent-soft: #3b82f633;--danger: #ef4444}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:radial-gradient(1200px 600px at 50% -10%,#11203a 0%,transparent 60%),var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}.btn{border:1px solid var(--line);background:transparent;color:var(--text);border-radius:10px;padding:.55rem .9rem;font-size:.85rem;font-weight:600;cursor:pointer;text-decoration:none;transition:border-color .15s,background .15s,transform .1s}.btn:hover{border-color:var(--accent)}.btn:active{transform:translateY(1px)}.btn--primary{background:var(--accent);border-color:var(--accent);width:100%;padding:.7rem;font-size:.95rem}.btn--primary:disabled{opacity:.6;cursor:default}.btn--ghost{color:var(--muted)}.btn--ghost:hover{color:var(--text)}.linklike{background:none;border:none;color:var(--muted);cursor:pointer;font-size:.8rem;padding:0}.linklike:hover{color:var(--text)}.error{color:#fca5a5;font-size:.85rem}.auth{height:100%;display:flex;align-items:center;justify-content:center;padding:1.5rem}.auth__card{width:100%;max-width:360px;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:2rem 1.75rem;display:flex;flex-direction:column;gap:.9rem;box-shadow:0 30px 80px -30px #000}.auth__brand{display:flex;align-items:center;gap:.6rem}.auth__brand h1{font-size:1.5rem;margin:0;letter-spacing:-.02em}.auth__mark,.topbar__mark,.auth__brand .auth__mark{width:22px;height:22px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#93c5fd,var(--accent) 60%,#1d4ed8);box-shadow:0 0 18px var(--accent-soft)}.auth__lede{color:var(--muted);margin:0 0 .4rem;line-height:1.5;font-size:.92rem}.auth label{display:flex;flex-direction:column;gap:.35rem;font-size:.8rem;color:var(--muted)}.auth input{background:#0a0e18;border:1px solid var(--line);border-radius:9px;padding:.6rem .7rem;color:var(--text);font-size:.95rem}.auth input:focus{outline:none;border-color:var(--accent)}.app{height:100%;display:flex;flex-direction:column;max-width:520px;margin:0 auto}.topbar{display:flex;align-items:center;justify-content:space-between;padding:.9rem 1.1rem}.topbar__brand{display:flex;align-items:center;gap:.5rem}.topbar__mark{width:18px;height:18px}.topbar__name{font-weight:700;letter-spacing:-.01em}.topbar__right{display:flex;align-items:center;gap:.6rem}.select{background:#0a0e18;color:var(--text);border:1px solid var(--line);border-radius:9px;padding:.4rem .55rem;font-size:.8rem}.select--static{color:var(--muted)}.bell{position:relative;color:var(--accent);font-size:.95rem}.bell__count{position:absolute;top:-7px;right:-10px;background:var(--accent);color:#04111f;font-size:.6rem;font-weight:800;border-radius:999px;padding:0 4px;min-width:14px;text-align:center}.stage{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.2rem;padding:1rem;position:relative}.character-wrap{display:flex;flex-direction:column;align-items:center;gap:1.1rem}.character{position:relative;width:180px;height:180px;border:none;background:none;cursor:pointer;padding:0}.character__glow{position:absolute;top:-30%;right:-30%;bottom:-30%;left:-30%;border-radius:50%;background:radial-gradient(circle,var(--accent-soft),transparent 65%);transform:scale(var(--glow, 1));transition:transform .12s ease-out,opacity .4s;opacity:.5}.character__body{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:radial-gradient(circle at 36% 30%,#bfdbfe,#60a5fa,#2563eb 70%,#1e3a8a);box-shadow:inset 0 -16px 40px -10px #0b245e,0 20px 60px -20px var(--accent);display:flex;align-items:center;justify-content:center;animation:breathe 5s ease-in-out infinite}.character__face{position:relative;width:96px;height:60px}.character__eye{position:absolute;top:6px;width:16px;height:30px;background:#08142e;border-radius:10px;transition:height .25s,transform .25s,border-radius .25s,width .25s}.character__eye--l{left:12px}.character__eye--r{right:12px}.character__mouth{position:absolute;bottom:2px;left:50%;width:26px;height:5px;margin-left:-13px;background:#08142e;border-radius:999px;transition:all .25s}.character--sleeping .character__body{animation:breathe 7s ease-in-out infinite;filter:saturate(.5) brightness(.7)}.character--sleeping .character__eye{height:4px;border-radius:4px}.character--sleeping .character__mouth{width:16px;margin-left:-8px;opacity:.6}.character--connecting .character__body{animation:pulse 1.1s ease-in-out infinite}.character--idle .character__eye{animation:blink 5.5s infinite}.character--listening .character__body{animation:breathe 2.4s ease-in-out infinite}.character--listening .character__eye{height:34px;top:4px}.character--thinking .character__eye{transform:translateY(-5px);height:22px}.character--thinking .character__eye--r{transform:translateY(-9px);height:18px}.character--thinking .character__body{animation:sway 2.2s ease-in-out infinite}.character--thinking .character__mouth{width:14px;margin-left:-10px}.character--speaking .character__body{animation:bob .9s ease-in-out infinite}.character--speaking .character__mouth{width:30px;margin-left:-15px;height:16px;border-radius:14px;animation:talk .34s ease-in-out infinite}.character--happy .character__eye{height:12px;border-radius:16px 16px 4px 4px;transform:translateY(-2px)}.character--happy .character__mouth{width:34px;margin-left:-17px;height:16px;background:transparent;border-bottom:5px solid #08142e;border-radius:0 0 40px 40px}.character--concerned .character__eye--l{transform:rotate(14deg)}.character--concerned .character__eye--r{transform:rotate(-14deg)}.character--concerned .character__mouth{width:22px;margin-left:-11px;height:12px;background:transparent;border-top:5px solid #08142e;border-radius:40px 40px 0 0}.character__hint{color:var(--muted);font-size:.85rem;margin:0;letter-spacing:.01em;min-height:1.2em}.waveform{display:flex;align-items:center;gap:5px;height:34px;opacity:.35;transition:opacity .3s}.waveform--live{opacity:1}.waveform__bar{width:5px;border-radius:999px;background:linear-gradient(var(--accent),#1d4ed8);height:12%;transition:height .1s ease-out}.waveform--live .waveform__bar{animation:wave 1s ease-in-out infinite}.waveform--speaking .waveform__bar{animation:wave .5s ease-in-out infinite}.caption{max-width:420px;text-align:center;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:.75rem 1rem;color:var(--text);line-height:1.45;font-size:.95rem;animation:rise .3s ease-out}.error--float{position:absolute;bottom:.5rem}.dock{display:flex;flex-direction:column;align-items:center;gap:.4rem;padding:1rem 1rem 1.4rem}.talk{border:1px solid var(--accent);background:var(--accent-soft);color:#dbeafe;border-radius:999px;padding:.8rem 2.4rem;font-size:1rem;font-weight:700;cursor:pointer;transition:background .15s,transform .1s}.talk:hover{background:#3b82f644}.talk:active{transform:translateY(1px)}.talk--live{background:var(--accent);color:#04111f;border-color:var(--accent)}.talk:disabled{opacity:.6;cursor:default}.dock__hint{color:var(--muted);font-size:.72rem}.dev{border-top:1px solid var(--line);font-size:.8rem}.dev summary{padding:.5rem 1.1rem;color:var(--muted);cursor:pointer;-webkit-user-select:none;user-select:none}.dev__body{padding:0 1.1rem 1rem;max-height:200px;overflow:auto}.dev__row{color:var(--muted);display:flex;align-items:center;gap:.4rem}.dev__meter{display:inline-block;width:90px;height:6px;background:var(--line);border-radius:999px;overflow:hidden}.dev__meterfill{display:block;height:100%;background:var(--accent);transition:width .1s}.dev code{color:var(--accent)}.dev__events{list-style:none;margin:.5rem 0 0;padding:0;display:flex;flex-direction:column;gap:.2rem}.dev__events li,.muted{color:var(--muted)}@keyframes breathe{0%,to{transform:scale(1)}50%{transform:scale(1.035)}}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.06);opacity:.85}}@keyframes sway{0%,to{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}@keyframes bob{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-4px) scale(1.02)}}@keyframes talk{0%,to{transform:scaleY(.45)}50%{transform:scaleY(1.35)}}@keyframes blink{0%,92%,to{transform:scaleY(1)}96%{transform:scaleY(.1)}}@keyframes wave{0%,to{transform:scaleY(.7)}50%{transform:scaleY(1.25)}}@keyframes rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion: reduce){.character__body,.character__eye,.character__mouth,.waveform--live .waveform__bar{animation:none!important}}
