@font-face{font-family:SF Pro Display;src:url(/fonts/SF-Pro-Display-Medium.woff2) format("woff2");font-style:normal;font-display:swap}@font-face{font-family:SF Mono Light;src:url(/fonts/SFMono-Light.woff2) format("woff2");font-style:normal;font-display:swap}@font-face{font-family:SF Mono Regular;src:url(/fonts/SFMono-Regular.woff2) format("woff2");font-style:normal;font-display:swap}@font-face{font-family:SF Mono Medium;src:url(/fonts/SFMono-Medium.woff2) format("woff2");font-style:normal;font-display:swap}@font-face{font-family:SF Mono Bold;src:url(/fonts/SFMono-Bold.woff2) format("woff2");font-style:normal;font-display:swap}*{margin:0;padding:0;box-sizing:border-box}:root{--bg-primary: #000000;--bg-secondary: #1a1a1a;--text-primary: #ffffff;--text-secondary: #000000;--accent-primary: #6464ff;--accent-secondary: #ff64ff;--danger: #ff6464;--border: #2a2a2a;--border-radius: 12px;--transition: all .3s cubic-bezier(.4, 0, .2, 1)}html{overflow:hidden;height:100%}body{font-family:SF Pro Display;background:#000;color:var(--text-primary);overflow:hidden;position:fixed;width:100%;height:100%;overscroll-behavior:none;touch-action:pan-y}.screen{min-height:100vh;display:flex;flex-direction:column}.hidden{display:none!important}main{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;gap:1rem}#orb-container{width:512px;height:512px;display:flex;align-items:center;justify-content:center}#orb-container video,#orb-container img,#orb-container canvas{width:150%;height:150%;object-fit:contain;clip-path:circle(40% at 50% 50%)}#orb-container video{transition:opacity .3s ease-in-out,filter .3s ease-in-out}#orb-container img{filter:drop-shadow(0 0 50px rgba(100,200,255,.6))}#orb-container canvas{filter:drop-shadow(0 0 30px rgba(100,100,255,.5))}#status-text{text-align:center;font-family:SF Pro Display;font-size:20000px;font-style:normal;font-weight:400;line-height:28px;transition:color .3s ease}#status-text.idle{color:#fff;font-size:24px}#status-text.connecting,#status-text.listening{color:#ffffff4d;font-size:20px}#status-text.thinking{color:#ffffff80;font-size:20px}#status-text.speaking{color:#fff;font-size:20px}#status-container{text-align:center;transition:opacity .3s ease-in-out}#status-text{font-size:24px;line-height:28px;margin-bottom:4px;align-items:center;justify-content:center;color:#fff;text-align:center;font-family:SF Pro Display;font-weight:400}.tagline{font-size:24px;line-height:28px;align-items:center;justify-content:center;color:#ffffff80;font-family:SF Pro Display;font-weight:400;transition:opacity .8s ease-in-out}.tagline.fade-out{opacity:0;pointer-events:none}#controls{display:flex;justify-content:center;margin-top:1.5rem}button{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.4rem .5rem .4rem 1.5rem;background:#ffffff1a;border:1px solid transparent;background-image:linear-gradient(#1a1a1a,#1a1a1a),linear-gradient(135deg,rgba(255,255,255,.3) 0%,transparent 50%,rgba(255,255,255,.3) 100%);background-origin:padding-box,border-box;background-clip:padding-box,border-box;border-radius:50px;font-size:16px;color:#fff;cursor:pointer;transition:all .5s ease,width .3s ease;width:auto;font-family:SF Pro Display;font-weight:400;box-shadow:inset 1px 1px 2px #ffffff1a,inset -1px -1px 2px #ffffff1a}button:active:not(:disabled){transform:translateY(0)}button:disabled{opacity:.5;cursor:not-allowed}.btn-icon{width:44px;height:44px;border:1px solid transparent;border-radius:50%;background-image:linear-gradient(#15151580,#15151580),linear-gradient(135deg,rgba(255,255,255,.3) 0%,transparent 50%,rgba(255,255,255,.3) 100%);background-origin:padding-box,border-box;background-clip:padding-box,border-box;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .5s ease}button:hover .btn-icon{background-image:linear-gradient(#ffffff1a,#ffffff1a),linear-gradient(135deg,rgba(255,255,255,.4) 0%,transparent 50%,rgba(255,255,255,.4) 100%)}.btn-icon svg{width:100%;height:100%}.error-message{position:fixed;bottom:2rem;left:50%;transform:translate(-50%);padding:1rem 2rem;background:var(--danger);color:#fff;border-radius:var(--border-radius);box-shadow:0 4px 12px #fff6;animation:slideUp .3s ease-out;z-index:1000}@keyframes slideUp{0%{transform:translate(-50%) translateY(100%);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}.menu-btn{position:fixed;display:flex;align-items:center;gap:8px;background:transparent;border:none;border-radius:100px;cursor:pointer;transition:var(--transition);z-index:100;padding:.75rem 1rem;top:1.5rem;left:1.5rem}.menu-logo{width:28px;height:28px;object-fit:contain}.menu-text{color:#fff3;font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,Segoe UI,Roboto,sans-serif;font-weight:400;font-size:1.3rem;letter-spacing:.5px}.menu-btn svg{color:var(--text-primary);width:16px;height:16px}.menu-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:transparent;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:200;display:flex;align-items:center;justify-content:center;padding:2rem;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.menu-panel{background:#0a0a0a80;border:1px solid rgba(255,255,255,.15);border-radius:24px;padding:1rem;max-width:500px;width:100%;max-height:90vh;overflow-y:auto}.menu-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.menu-header-left{display:flex;align-items:center;gap:8px;border-radius:100px;box-shadow:inset 1px 1px 8px #ffffff1a,inset -1px -1px 8px #ffffff1a;padding:4px 12px}.menu-logo-large{width:24px;height:24px}.menu-title{font-size:24px;font-weight:400;color:#fff;opacity:20%}.menu-close{background:solid #2a2a2a;border-radius:50px;padding:.25rem .75rem;color:#fff;font-size:.875rem;font-weight:500;cursor:pointer;transition:var(--transition)}.menu-close:hover{background:#3a3a3a}.menu-section{margin:16px}.menu-divider{height:1px;color:#fff;opacity:50%;background:var(--border);margin:16px}.section-title{color:#fff;font-size:24px;font-style:normal;font-weight:400;line-height:24px;margin-bottom:4px}.section-subtitle{color:#fff6;font-family:SF Pro Display;font-size:16px;font-style:normal;font-weight:400;line-height:24px;margin-bottom:8px}.theme-toggle{display:inline-flex;background:#fffc;border-radius:50px;padding:.25rem;gap:4px}.theme-btn{padding:.25rem 1.5rem;border:none;border-radius:50px;background:transparent;color:var(--text-secondary);font-size:.875rem;font-weight:500;cursor:pointer;transition:var(--transition)}.theme-btn.active{background:#1a1a1a;color:#fff}.action-btn-small{background:#fff;color:#000;border:none;border-radius:100px;padding:.25rem .75rem;font-size:.875rem;font-weight:400;cursor:pointer;transition:var(--transition)}.credits-amount{color:#fff;font-family:SF Mono Regular;font-size:32px;font-style:normal;font-weight:400;line-height:32px;margin-bottom:4px}.user-info-display{margin-bottom:4px}.user-name-display{color:#fff;font-size:24px;font-style:normal;font-weight:400;line-height:32px;margin-bottom:.25rem}.user-email-display{color:#fff6;font-family:SF Pro Display;font-size:16px;font-style:normal;font-weight:400;line-height:16px;margin-bottom:1rem}.logout-btn{background:solid #2a2a2a;border-radius:50px;padding:.25rem .75rem;color:#fff;font-size:.875rem;font-weight:500;cursor:pointer;transition:var(--transition);text-align:left}.logout-btn:hover{background:#3a3a3a}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--text-secondary);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-primary)}@media (max-width: 768px){main{padding:1rem}#orb-container{width:360px;height:304px;aspect-ratio:45/38}#controls{flex-direction:column;width:auto;align-items:center}button{width:auto;max-width:200px;font-size:16px}.menu-btn{top:16px;left:16px;padding:7px 13px;box-shadow:inset 1px 1px 4px #ffffff26,inset -1px -1px 4px #ffffff26}.menu-logo{width:24px;height:24px}.menu-text{color:#fff3;text-align:center;font-family:SF Pro Display;font-size:24px;font-style:normal;font-weight:400;line-height:24px}.menu-overlay{padding:0;align-items:flex-start}.menu-panel{max-width:100%;max-height:100%;border-radius:0;min-height:100vh}}html.light{--bg-primary: #ffffff;--bg-secondary: #f5f5f5;--text-primary: #000000;--text-secondary: #ffffff;--border: #e0e0e0}html.light body{background:#f9f9f9;color:var(--text-primary)}html.light #status-text.idle{color:#000}html.light #status-text.connecting,html.light #status-text.listening{color:#0000004d}html.light #status-text.thinking{color:#00000080}html.light #status-text.speaking,html.light #status-text{color:#000}html.light .tagline{color:#00000080}html.light button{background:#0000001a;background-image:linear-gradient(#f0f0f0,#f0f0f0),linear-gradient(135deg,rgba(0,0,0,.3) 0%,transparent 50%,rgba(0,0,0,.3) 100%);color:#000;box-shadow:inset 1px 1px 2px #0000001a,inset -1px -1px 2px #0000001a}html.light .btn-icon{background-image:linear-gradient(#e6e6e680,#e6e6e680),linear-gradient(135deg,rgba(0,0,0,.3) 0%,transparent 50%,rgba(0,0,0,.3) 100%)}html.light button:hover .btn-icon{background-image:linear-gradient(#c8c8c880,#c8c8c880),linear-gradient(135deg,rgba(0,0,0,.4) 0%,transparent 50%,rgba(0,0,0,.4) 100%)}html.light .btn-icon svg{filter:invert(1)}html.light .menu-text{color:#000}html.light .menu-btn svg{color:#000}html.light .menu-panel{background:#f5f5f5d9;color:#000;border:1px solid rgba(0,0,0,.15)}html.light .menu-title{color:#000;opacity:1}html.light .menu-close{background:#e0e0e0;color:#000}html.light .menu-close:hover{background:#d0d0d0}html.light .menu-divider{color:#000;background:var(--border)}html.light .section-title{color:#000}html.light .section-subtitle{color:#0006}html.light .theme-toggle{background:#0000001a}html.light .theme-btn{color:#0009}html.light .theme-btn.active{background:#fff;color:#000}html.light .action-btn-small{background:#000;color:#fff}html.light .credits-amount,html.light .user-name-display{color:#000}html.light .user-email-display{color:#0006}html.light .logout-btn{background:#e0e0e0;color:#000}html.light .logout-btn:hover{background:#d0d0d0}html.light ::-webkit-scrollbar-thumb{background:#999}html.light ::-webkit-scrollbar-thumb:hover{background:#666}@media (max-width: 768px){html.light .menu-text,html.light .menu-title{color:#000}}