@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Orbitron:wght@400;500;600;700;800;900&display=swap";:root{--bg-deep:#0a0a14;--bg-surface:#0f0f1ed9;--bg-glass:#14142d9e;--bg-glass-hover:#1e1e3cb8;--border-glass:#7850ff26;--border-glass-hover:#7850ff59;--accent-primary:#a855f7;--accent-primary-glow:#a855f766;--accent-secondary:#06b6d4;--accent-secondary-glow:#06b6d44d;--accent-hot:#f43f5e;--accent-hot-glow:#f43f5e4d;--accent-success:#10b981;--text-primary:#f0eef6;--text-secondary:#f0eef699;--text-muted:#f0eef659;--font-body:"Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-display:"Orbitron", monospace;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:20px;--radius-full:9999px;--shadow-glow:0 0 20px var(--accent-primary-glow), 0 0 60px #a855f71a;--shadow-glow-sm:0 0 10px var(--accent-primary-glow);--shadow-card:0 8px 32px #0006, inset 0 1px 0 #ffffff0d;--transition-fast:.15s cubic-bezier(.4, 0, .2, 1);--transition-base:.25s cubic-bezier(.4, 0, .2, 1);--transition-slow:.4s cubic-bezier(.4, 0, .2, 1);--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--header-h:56px;--stage-min:72dvh;--sheet-max:20dvh;--composer-h:52px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;height:100%;overflow:hidden}html{-webkit-text-size-adjust:100%}body{font-family:var(--font-body);color:var(--text-primary);background:var(--bg-deep);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overscroll-behavior:none;touch-action:manipulation}button,input,select{font:inherit;color:inherit}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{border-radius:var(--radius-full);background:#a855f74d}.app-container{width:100%;height:100dvh;padding:var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left);flex-direction:column;display:flex;position:relative;overflow:hidden}.app-bg{z-index:0;pointer-events:none;background:radial-gradient(at 30% 18%,#a855f71a 0%,#0000 55%),radial-gradient(at 70% 80%,#06b6d412 0%,#0000 50%),radial-gradient(#0f0f1e 0%,#0a0a14 100%);position:absolute;inset:0}.stage{z-index:1;min-height:var(--stage-min);flex-direction:column;flex:auto;display:flex;position:relative}.canvas-wrapper{z-index:0;position:absolute;inset:0}.sheet{z-index:10;flex:0 0 var(--sheet-max);width:100%;height:var(--sheet-max);max-height:var(--sheet-max);min-height:var(--sheet-max);flex-direction:column;display:flex;position:relative;overflow:hidden}.header-bar{z-index:10;min-height:var(--header-h);pointer-events:none;background:linear-gradient(#0a0a14bf 0%,#0000 100%);justify-content:space-between;align-items:center;gap:10px;padding:10px 14px;display:flex;position:relative}.header-bar>*{pointer-events:auto}.app-title{font-family:var(--font-display);letter-spacing:2px;text-transform:uppercase;background:linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;flex-shrink:0;font-size:.95rem;font-weight:700}.header-controls{align-items:center;gap:8px;min-width:0;display:flex}.status-indicators{align-items:center;gap:8px;display:flex}.status-dot{color:var(--text-secondary);letter-spacing:.4px;text-transform:uppercase;align-items:center;gap:5px;font-size:.62rem;font-weight:600;display:flex}.status-dot:before{content:"";background:var(--text-muted);width:7px;height:7px;transition:all var(--transition-base);border-radius:50%;flex-shrink:0}.status-dot.connected:before{background:var(--accent-success);animation:2s ease-in-out infinite pulse-glow;box-shadow:0 0 8px #10b98180}.status-dot.error:before{background:var(--accent-hot);box-shadow:0 0 8px var(--accent-hot-glow)}.status-label{display:none}@keyframes pulse-glow{0%,to{opacity:1}50%{opacity:.6}}.emotion-badge{z-index:10;background:var(--bg-glass);-webkit-backdrop-filter:blur(20px);border:1px solid var(--border-glass);border-radius:var(--radius-full);font-family:var(--font-display);letter-spacing:1px;text-transform:uppercase;color:var(--text-secondary);align-items:center;gap:8px;padding:8px 14px;font-size:.62rem;font-weight:600;display:flex;position:absolute;bottom:12px;left:12px}.emotion-badge .emotion-icon{font-size:1rem}.emotion-label{text-overflow:ellipsis;white-space:nowrap;max-width:9ch;overflow:hidden}.emotion-badge.idle{border-color:#10b9814d}.emotion-badge.talking{border-color:#06b6d44d}.emotion-badge.secret{border-color:#a855f74d}.emotion-badge.disappointed{border-color:#eab3084d}.emotion-badge.angry{border-color:#f43f5e4d}.emotion-badge.dance{border-color:#ec48994d}.emotion-badge.whatever{border-color:#94a3b84d}.chat-panel,.transcript-panel{width:100%;height:var(--sheet-max);max-height:var(--sheet-max);min-height:var(--sheet-max);flex:0 0 var(--sheet-max);background:var(--bg-glass);-webkit-backdrop-filter:blur(24px);border:1px solid var(--border-glass);border-radius:var(--radius-xl) var(--radius-xl) 0 0;box-shadow:var(--shadow-card);border-bottom:none;flex-direction:column;display:flex;position:relative;bottom:auto;left:auto;right:auto;overflow:hidden}.transcript-fixed{flex-shrink:0}.transcript-header-fixed{cursor:default!important}.memory-clear-btn{border:1px solid var(--border-glass);color:var(--text-muted);letter-spacing:.6px;text-transform:uppercase;border-radius:var(--radius-full);cursor:pointer;transition:all var(--transition-fast);background:#ffffff0a;flex-shrink:0;padding:6px 10px;font-size:.62rem;font-weight:600}.memory-clear-btn:hover{color:var(--text-primary);background:#f43f5e1f;border-color:#f43f5e66}.transcript-stream{gap:8px!important;padding:8px 12px 6px!important}.transcript-text{font-size:.82rem!important;line-height:1.4!important}.chat-header{min-height:40px!important;padding:8px 12px!important}.transcript-composer{padding:6px 10px calc(6px + env(safe-area-inset-bottom,0px))!important}.transcript-composer .mic-btn,.transcript-composer .chat-send-btn{width:40px;min-width:40px;height:40px;min-height:40px}.transcript-composer .chat-input{padding:8px 12px}.chat-panel.phase-listening{box-shadow:0 0 24px #06b6d41f, var(--shadow-card);border-color:#06b6d459}.chat-panel.phase-speaking{border-color:#a855f766}.chat-panel.phase-thinking{border-color:#facc154d}.chat-header{border-bottom:1px solid var(--border-glass);cursor:default;-webkit-user-select:none;user-select:none;flex-shrink:0;justify-content:space-between;align-items:center;min-height:52px;padding:12px 16px;display:flex}.chat-header-left{align-items:center;gap:10px;min-width:0;display:flex}.chat-header-meta{flex-direction:column;gap:2px;min-width:0;display:flex}.chat-header-title{font-family:var(--font-display);letter-spacing:1.4px;text-transform:uppercase;color:var(--text-primary);font-size:.72rem;font-weight:600}.chat-header-sub{color:var(--accent-secondary);letter-spacing:.8px;text-transform:uppercase;font-size:.62rem}.live-pulse{animation:1.4s ease-in-out infinite pulse-glow}.chat-header-icon{border-radius:var(--radius-sm);background:linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;font-size:.9rem;display:flex}.chat-header-icon.listening{background:linear-gradient(135deg,#06b6d4,#22d3ee)}.chat-header-icon.speaking{background:linear-gradient(135deg,#a855f7,#c084fc)}.chat-toggle-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;min-width:40px;min-height:40px;padding:8px;font-size:1rem;line-height:1}.chat-toggle-btn:hover{color:var(--text-primary)}.chat-messages,.transcript-stream{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;flex-direction:column;flex:1;gap:14px;min-height:0;max-height:none;padding:14px 16px 10px;display:flex;overflow-y:auto}.transcript-empty{text-align:center;color:var(--text-muted);padding:28px 16px;font-size:.82rem;line-height:1.55}.transcript-empty-icon{margin-bottom:10px;font-size:1.8rem}.transcript-empty-hint{opacity:.85;margin-top:8px;font-size:.72rem}.transcript-line{flex-direction:column;gap:4px;max-width:100%;animation:.28s cubic-bezier(.4,0,.2,1) messageSlideIn;display:flex}@keyframes messageSlideIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.transcript-line-meta{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.transcript-speaker{letter-spacing:.6px;text-transform:uppercase;color:var(--text-muted);font-size:.68rem;font-weight:700}.transcript-line.user .transcript-speaker{color:#a855f7d9}.transcript-line.ai .transcript-speaker{color:#06b6d4e6}.transcript-time{color:var(--text-muted);margin-left:auto;font-size:.62rem}.transcript-badge{opacity:.8;font-size:.62rem}.transcript-badge.live{color:var(--accent-secondary);text-transform:uppercase;letter-spacing:.5px;font-weight:600}.transcript-text{color:var(--text-primary);word-wrap:break-word;white-space:pre-wrap;font-size:.92rem;line-height:1.55}.transcript-line.user .transcript-text{color:#f0eef6f2}.transcript-line.interim .transcript-text,.interim-text{color:var(--text-secondary);opacity:.85;font-style:italic}.transcript-line.live .transcript-text{border-left:2px solid #06b6d473;padding-left:10px}.caret-blink{opacity:.5;margin-left:2px;animation:1s infinite typingBounce}.typing-indicator{align-items:center;gap:4px;padding:4px 0;display:inline-flex}.typing-indicator span{background:var(--accent-primary);border-radius:50%;width:6px;height:6px;animation:1.4s ease-in-out infinite typingBounce}.typing-indicator span:nth-child(2){animation-delay:.2s}.typing-indicator span:nth-child(3){animation-delay:.4s}@keyframes typingBounce{0%,60%,to{opacity:.4;transform:translateY(0)}30%{opacity:1;transform:translateY(-5px)}}.stt-error{color:#fecdd3;background:#f43f5e1f;border-top:1px solid #f43f5e40;flex-shrink:0;padding:8px 16px;font-size:.75rem}.chat-input-wrapper,.transcript-composer{padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--border-glass);background:#0a0a1459;flex-shrink:0;align-items:center;gap:10px;display:flex}.chat-input{border-radius:var(--radius-full);min-width:0;color:var(--text-primary);transition:all var(--transition-base);background:#ffffff0d;border:1px solid #ffffff14;outline:none;flex:1;padding:12px 16px;font-size:16px}.chat-input::placeholder{color:var(--text-muted)}.chat-input:focus{border-color:var(--accent-primary);box-shadow:0 0 0 2px var(--accent-primary-glow)}.chat-send-btn,.mic-btn{cursor:pointer;width:48px;min-width:48px;height:48px;min-height:48px;transition:all var(--transition-base);-webkit-tap-highlight-color:transparent;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex;position:relative}.chat-send-btn{background:linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));color:#fff;font-size:1.05rem}.chat-send-btn:hover:not(:disabled){box-shadow:var(--shadow-glow);transform:scale(1.06)}.chat-send-btn:active:not(:disabled){transform:scale(.95)}.chat-send-btn:disabled{opacity:.4;cursor:not-allowed;transform:none}.mic-btn{border:1px solid var(--border-glass);color:var(--text-primary);background:#ffffff0f;font-size:1.15rem;overflow:visible}.mic-btn:hover:not(:disabled),.mic-btn:focus-visible:not(:disabled){border-color:var(--accent-secondary);outline:none}.mic-btn.active{background:linear-gradient(135deg,#06b6d459,#22d3ee40);border-color:#06b6d4b3;animation:1.6s ease-in-out infinite micPulse;box-shadow:0 0 0 3px #06b6d42e,0 0 20px #06b6d440}.mic-btn:disabled{opacity:.4;cursor:not-allowed}.mic-icon{z-index:1;position:relative}.mic-level-ring{pointer-events:none;border:2px solid #06b6d48c;border-radius:50%;transition:transform 80ms linear,opacity 80ms linear;position:absolute;inset:-4px}@keyframes micPulse{0%,to{box-shadow:0 0 0 3px #06b6d426,0 0 16px #06b6d433}50%{box-shadow:0 0 0 5px #06b6d438,0 0 28px #06b6d459}}.loading-screen{z-index:100;background:var(--bg-deep);flex-direction:column;justify-content:center;align-items:center;gap:24px;display:flex;position:fixed;inset:0}.loading-screen .loader-ring{border:3px solid #a855f726;border-top-color:var(--accent-primary);border-radius:50%;width:48px;height:48px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.loading-screen .loader-text{font-family:var(--font-display);letter-spacing:3px;text-transform:uppercase;color:var(--text-secondary);font-size:.8rem;font-weight:500;animation:2s ease-in-out infinite loadPulse}@keyframes loadPulse{0%,to{opacity:.5}50%{opacity:1}}@media (width>=768px){:root{--stage-min:100%;--sheet-max:20dvh}.app-container{padding:0;display:block}.stage{min-height:100%;position:absolute;inset:0}.sheet{width:min(420px,100vw - 48px);height:var(--sheet-max);max-height:var(--sheet-max);min-height:var(--sheet-max);padding:0;position:absolute;bottom:24px;right:24px}.chat-panel,.transcript-panel{border-radius:var(--radius-xl);border-bottom:1px solid var(--border-glass);height:100%;min-height:100%;max-height:100%}.header-bar{padding:16px 24px;position:absolute;top:0;left:0;right:0}.app-title{font-size:1.1rem}.status-label{display:inline}.emotion-badge{bottom:24px;left:24px}.chat-input{font-size:.9rem}.transcript-composer{padding:12px 14px}}@media (width>=1024px){.sheet{width:440px}}@media (height<=700px) and (width<=767px){:root{--stage-min:70dvh;--sheet-max:20dvh}}