:root{color-scheme:dark;--aqua:#23e5ff;--white:#ecfaff;--muted:#76909e;--bg:#02070b}*{box-sizing:border-box}html{min-height:100%;background:var(--bg)}body{margin:0;color:var(--white);font-family:Inter,Segoe UI,Roboto,system-ui,sans-serif;background:radial-gradient(ellipse at 50% 35%,#05212d 0%,#02090d 48%,#02070b 85%);min-height:100svh}.app{width:min(100%,640px);min-height:100svh;margin:auto;padding:env(safe-area-inset-top) clamp(18px,5vw,35px) max(22px,env(safe-area-inset-bottom));display:flex;flex-direction:column}.topbar{height:68px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}.brand{font-size:12px;letter-spacing:.22em;color:#cef7fe;font-weight:650}.brand-small{font-size:9px;color:#507588;letter-spacing:.13em}.signal,.status-dot{display:inline-block;width:7px;height:7px;background:#1fe0ed;box-shadow:0 0 12px #1fe0ed;border-radius:50%;margin-right:9px}.icon-btn{background:#0c1c26;color:#62dbea;border:1px solid #1a4658;border-radius:12px;width:38px;height:38px;font-size:22px;cursor:pointer}.hero{position:relative;width:100%;min-height:0;flex:1 1 auto;display:flex;align-items:center;justify-content:center;max-height:620px;isolation:isolate}.hero svg{width:100%;max-height:min(64svh,620px);overflow:visible;filter:drop-shadow(0 0 4px #0080a466)}.ambient{position:absolute;inset:15% 12%;border:1px solid #08b8de10;border-radius:50%;pointer-events:none}.ambient-b{inset:23% 21%}.floor-glow{position:absolute;bottom:11%;width:52%;height:4px;filter:blur(20px);background:#05c6e4;opacity:.5;z-index:-1}.rays{transform-origin:300px 313px;animation:spin 110s linear infinite}.rays line{transition:opacity .3s,stroke .3s}.eyes{transform-origin:300px 355px;animation:eyesBreathe 5s ease-in-out infinite}.pupil{transition:transform .3s}.letter{opacity:.9;animation:letterPulse 4s ease-in-out infinite}.head{animation:float 6s ease-in-out infinite}.mouth{transition:opacity .3s}.conversation{text-align:center;margin-top:-20px;z-index:1}.status-led{display:flex;justify-content:center;align-items:center;gap:2px;font-size:10px;letter-spacing:.2em;color:#84a9b6}.status-dot{width:6px;height:6px}.conversation h1{font-size:clamp(30px,7vw,43px);font-weight:500;letter-spacing:.23em;margin:13px 0 8px;padding-left:.23em;text-shadow:0 0 24px #13d4ff50}.conversation p{font-size:14px;color:#8faab6;min-height:20px;margin:0}.controls{display:flex;flex-direction:column;gap:10px;margin:24px auto 14px;width:min(100%,360px)}button{font:inherit;touch-action:manipulation}.primary,.secondary{border-radius:14px;min-height:55px;cursor:pointer;font-weight:650;letter-spacing:.095em;font-size:12px}.primary{background:linear-gradient(112deg,#2ae5f7,#0ba9cb);color:#03151c;box-shadow:0 5px 25px #03aacf26;border:0;display:flex;align-items:center;justify-content:center;gap:12px}.secondary{background:#081924;border:1px solid #194355;color:#7fbfce;min-height:45px}.test-panel{background:#05121bbd;border:1px solid #12313f;border-radius:14px;padding:15px 13px;margin-bottom:14px}.panel-top{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.1em;color:#5d8da2;margin-bottom:13px}.states{display:flex;gap:6px;flex-wrap:wrap}.state{flex:1 1 auto;border-radius:9px;min-height:35px;padding:0 10px;background:#0b222f;border:1px solid #164154;color:#95bac6;font-size:11px;cursor:pointer}.state.active{border-color:#2acee5;color:#cbfaff;background:#103544}footer{text-align:center;font-size:9px;letter-spacing:.08em;color:#426579;line-height:1.6;padding-bottom:6px}.app[data-mode=listening] .eyes{animation:eyesBreathe 1.6s ease-in-out infinite}.app[data-mode=listening] .rays{animation-duration:24s}.app[data-mode=thinking] .rays{animation-duration:9s}.app[data-mode=thinking] .letter{animation-duration:.7s}.app[data-mode=speaking] .rays{animation-duration:26s}.app[data-mode=speaking] .speaking-bars{opacity:1}.app[data-mode=error] .hero{filter:hue-rotate(145deg) saturate(1.4)}.app[data-mode=error] .rays{animation-play-state:paused}@keyframes spin{to{transform:rotate(360deg)}}@keyframes eyesBreathe{0%,100%{transform:scaleY(1)}48%{transform:scaleY(.95)}51%{transform:scaleY(.82)}55%{transform:scaleY(1)}}@keyframes letterPulse{0%,100%{opacity:.7}50%{opacity:1}}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}@media(max-height:740px){.hero svg{max-height:47svh}.topbar{height:51px}.controls{margin-top:14px}.test-panel{padding:10px}.conversation h1{margin:7px 0}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition:none!important}}

.voice-label{font-size:12px;color:#90afbd;display:block;margin:12px 0 6px}#voiceSelect,#password{width:100%;color:#e4faff;background:#081924;border:1px solid #194355;border-radius:9px;padding:11px;font-size:14px}.transcript{max-height:180px;overflow:auto;text-align:left;font-size:13px;color:#bad7e2}.transcript p{border-top:1px solid #183443;padding-top:8px;line-height:1.45}.transcript strong{color:#52daf2}.login-cover{position:fixed;inset:0;background:#02070bf5;z-index:50;display:flex;align-items:center;justify-content:center;padding:20px}.login-cover[hidden]{display:none}.login-box{width:min(100%,370px);background:#09212c;border:1px solid #1f5768;padding:28px;border-radius:17px;display:flex;flex-direction:column;gap:14px}.login-box h2{margin:0}.login-box p{color:#a8cbd6;font-size:14px}.login-error{color:#ff9a9a!important;min-height:1em}.logout{position:absolute;top:14px;right:70px;font-size:12px;background:none;color:#6e9aa8;border:0;cursor:pointer}.primary:disabled{opacity:.55;cursor:wait}