@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";
*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#0a0a12;--surface:#14141f;--accent:#c084fc;--accent-glow:#c084fc59;--accent-active:#f472b6;--active-glow:#f472b666;--text:#e8e8f0;--text-muted:#9090a8;--radius:9999px;--font:"Inter", -apple-system, BlinkMacSystemFont, sans-serif}html,body{height:100%;font-family:var(--font);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}.page{flex-direction:column;justify-content:center;align-items:center;min-height:100vh;display:flex;position:relative;overflow:hidden}.page:before{content:"";background:radial-gradient(circle, var(--accent-glow) 0%, transparent 70%);pointer-events:none;opacity:.4;border-radius:50%;width:600px;height:600px;position:absolute}.hero{z-index:1;flex-direction:column;align-items:center;gap:16px;display:flex}.logo-mark{background:linear-gradient(135deg,#c084fc22,#f472b622);border-radius:16px;justify-content:center;align-items:center;width:56px;height:56px;margin-bottom:4px;display:flex}.logo-icon{font-size:28px}.title{letter-spacing:-.02em;background:linear-gradient(135deg,#c084fc,#f472b6);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:2rem;font-weight:700}.subtitle{color:var(--text-muted);margin-bottom:24px;font-size:1rem;font-weight:400}.voice-widget-container{flex-direction:column;align-items:center;gap:16px;display:flex;position:relative}.pulse-ring{border:2px solid var(--accent-active);opacity:0;pointer-events:none;border-radius:50%;width:96px;height:96px;animation:2s ease-out infinite pulse;position:absolute;top:50%;left:50%;transform:translate(-50%,calc(-50% - 8px))}.pulse-ring.speaking{border-color:var(--accent-active);animation:1s ease-out infinite pulse-fast}@keyframes pulse{0%{opacity:.6;transform:translate(-50%,calc(-50% - 8px))scale(1)}to{opacity:0;transform:translate(-50%,calc(-50% - 8px))scale(1.8)}}@keyframes pulse-fast{0%{opacity:.8;transform:translate(-50%,calc(-50% - 8px))scale(1)}50%{opacity:.3;transform:translate(-50%,calc(-50% - 8px))scale(1.4)}to{opacity:0;transform:translate(-50%,calc(-50% - 8px))scale(1.8)}}.voice-btn{cursor:pointer;z-index:2;border:none;border-radius:50%;justify-content:center;align-items:center;width:80px;height:80px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.voice-btn svg{width:32px;height:32px}.voice-btn.idle{color:#fff;box-shadow:0 4px 24px var(--accent-glow), 0 0 0 0 var(--accent-glow);background:linear-gradient(135deg,#a855f7,#c084fc)}.voice-btn.idle:hover{box-shadow:0 6px 32px var(--accent-glow), 0 0 0 8px #c084fc1f;transform:scale(1.08)}.voice-btn.idle:active{transform:scale(.96)}.voice-btn.connecting{color:#fff;box-shadow:0 4px 24px var(--accent-glow);pointer-events:none;background:linear-gradient(135deg,#a855f7,#c084fc)}.voice-btn.connected{color:#fff;box-shadow:0 4px 24px var(--active-glow);background:linear-gradient(135deg,#ec4899,#f472b6)}.voice-btn.connected:hover{box-shadow:0 6px 32px var(--active-glow), 0 0 0 8px #f472b61f;transform:scale(1.08)}.voice-btn.connected:active{transform:scale(.96)}.spinner{animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.widget-label{color:var(--text-muted);letter-spacing:.01em;text-align:center;min-height:1.25em;font-size:.875rem;font-weight:500;transition:color .3s}.footer{color:var(--text-muted);opacity:.5;font-size:.75rem;position:absolute;bottom:24px}@media (max-width:480px){.title{font-size:1.5rem}.subtitle{text-align:center;padding:0 24px;font-size:.875rem}.voice-btn{width:72px;height:72px}.voice-btn svg{width:28px;height:28px}.pulse-ring{width:88px;height:88px}}