*{margin:0;padding:0;box-sizing:border-box}:root{--bg: #0a0a0a;--bg-secondary: #18181b;--bg-tertiary: #27272a;--text: #ffffff;--text-muted: #71717a;--text-subtle: #a1a1aa;--accent: #a78bfa;--accent-dark: #7c3aed;--border: rgba(255,255,255,.1);--orb-gradient: linear-gradient(180deg, #3f3f46 0%, #27272a 50%, #18181b 100%);--shadow: rgba(0,0,0,.5);--danger: #ef4444}[data-theme=light]{--bg: #fafafa;--bg-secondary: #f4f4f5;--bg-tertiary: #e4e4e7;--text: #18181b;--text-muted: #71717a;--text-subtle: #a1a1aa;--accent: #7c3aed;--accent-dark: #6d28d9;--border: rgba(0,0,0,.08);--orb-gradient: linear-gradient(180deg, #ffffff 0%, #f4f4f5 50%, #e4e4e7 100%);--shadow: rgba(0,0,0,.08);--danger: #dc2626}body{font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text);min-height:100dvh;display:flex;flex-direction:column;-webkit-font-smoothing:antialiased;transition:background .3s ease,color .3s ease}.app-header{padding:16px 20px;display:flex;align-items:center;justify-content:space-between;position:fixed;top:0;left:0;right:0;background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);z-index:100}.app-logo{font-size:20px;font-weight:700;color:var(--text)}.app-logo span{color:var(--accent)}.header-actions{display:flex;align-items:center;gap:12px}.theme-toggle{width:44px;height:24px;background:var(--bg-tertiary);border:none;border-radius:12px;cursor:pointer;position:relative;transition:background .2s ease}.theme-toggle:after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;background:var(--text);border-radius:50%;transition:transform .2s ease}[data-theme=light] .theme-toggle:after{transform:translate(20px)}.app-menu-btn{width:40px;height:40px;border:none;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:10px;transition:background .2s ease}.app-menu-btn:hover{background:var(--bg-secondary)}.app-menu-btn svg{width:22px;height:22px;stroke:var(--text);fill:none;transition:stroke .2s ease}.app-main{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 24px 40px}.voice-container{text-align:center;width:100%;max-width:400px}.voice-idle{display:flex;flex-direction:column;align-items:center}.voice-orb{width:200px;height:200px;position:relative;cursor:pointer;margin-bottom:30px}.voice-orb-ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:200px;height:200px;border-radius:50%;border:1px solid var(--border);transition:border-color .3s ease}.voice-orb-inner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:160px;height:160px;background:var(--orb-gradient);border-radius:50%;display:flex;align-items:center;justify-content:center;border:1px solid var(--border);box-shadow:0 15px 50px var(--shadow);transition:all .3s ease}.voice-orb:hover .voice-orb-inner{transform:translate(-50%,-50%) scale(1.05);box-shadow:0 20px 60px var(--shadow)}.voice-orb-inner svg{width:50px;height:50px;stroke:var(--text);stroke-width:1.5;transition:stroke .3s ease}.voice-label{font-size:18px;font-weight:600;color:var(--text);margin-bottom:8px}.voice-hint{font-size:15px;color:var(--text-muted);margin-bottom:35px}.voice-start-btn{display:inline-flex;align-items:center;gap:10px;padding:16px 36px;background:var(--text);border:none;border-radius:980px;color:var(--bg);font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease}.voice-start-btn:hover{opacity:.9;transform:scale(1.02)}.voice-start-btn svg{width:20px;height:20px;stroke:var(--bg)}.voice-orb.disabled{pointer-events:none;opacity:.6}.voice-orb.disabled .voice-orb-inner{animation:pulse-connecting 1.5s ease-in-out infinite}@keyframes pulse-connecting{0%,to{transform:translate(-50%,-50%) scale(1);opacity:1}50%{transform:translate(-50%,-50%) scale(1.05);opacity:.7}}.voice-start-btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.voice-active{display:none;flex-direction:column;align-items:center}.voice-active.show{display:flex}.voice-idle.hidden{display:none}.voice-wave{display:flex;align-items:center;justify-content:center;gap:5px;height:150px;margin-bottom:30px}.wave-bar{width:5px;background:linear-gradient(180deg,var(--accent) 0%,var(--accent-dark) 100%);border-radius:3px;animation:wave .8s ease-in-out infinite}.wave-bar:nth-child(1){height:25px;animation-delay:0s}.wave-bar:nth-child(2){height:40px;animation-delay:.1s}.wave-bar:nth-child(3){height:60px;animation-delay:.2s}.wave-bar:nth-child(4){height:85px;animation-delay:.3s}.wave-bar:nth-child(5){height:110px;animation-delay:.4s}.wave-bar:nth-child(6){height:130px;animation-delay:.5s}.wave-bar:nth-child(7){height:110px;animation-delay:.4s}.wave-bar:nth-child(8){height:85px;animation-delay:.3s}.wave-bar:nth-child(9){height:60px;animation-delay:.2s}.wave-bar:nth-child(10){height:40px;animation-delay:.1s}.wave-bar:nth-child(11){height:25px;animation-delay:0s}@keyframes wave{0%,to{transform:scaleY(.4)}50%{transform:scaleY(1)}}.voice-status{font-size:17px;color:var(--text);font-weight:500;margin-bottom:12px}.voice-transcript{font-size:14px;color:var(--text-muted);margin-bottom:30px;max-width:300px;min-height:40px;line-height:1.4}.voice-end-btn{display:inline-flex;align-items:center;gap:10px;padding:16px 36px;background:var(--danger);border:none;border-radius:980px;color:#fff;font-size:16px;font-weight:600;cursor:pointer;transition:opacity .2s ease}.voice-end-btn:hover{opacity:.9}.voice-end-btn svg{width:20px;height:20px}.app-footer{padding:20px;display:flex;flex-direction:column;align-items:center;gap:12px}.install-hint{display:inline-flex;align-items:center;gap:8px;padding:12px 20px;background:var(--bg-secondary);border-radius:12px;font-size:14px;color:var(--text-subtle);cursor:pointer;border:none;transition:background .2s ease}.install-hint:hover{background:var(--bg-tertiary)}.install-hint svg{width:18px;height:18px;stroke:var(--text-subtle)}.info-link{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--text-muted);text-decoration:none;padding:8px 12px;border-radius:8px;transition:color .2s ease,background .2s ease}.info-link:hover{color:var(--accent);background:var(--bg-secondary)}.info-link svg{width:14px;height:14px;stroke:currentColor;fill:none}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:none;align-items:flex-end;justify-content:center;z-index:1000;padding:20px}[data-theme=light] .modal-overlay{background:#0000004d}.modal-overlay.show{display:flex}.modal-content{background:var(--bg-secondary);border-radius:20px;width:100%;max-width:400px;max-height:80vh;overflow-y:auto;animation:slideUp .3s ease;border:1px solid var(--border)}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.modal-header{padding:20px 24px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}.modal-title{font-size:18px;font-weight:600;color:var(--text)}.modal-close{width:32px;height:32px;border:none;background:var(--bg-tertiary);border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s ease}.modal-close:hover{background:var(--border)}.modal-close svg{width:18px;height:18px;stroke:var(--text-subtle)}.modal-body{padding:24px}.platform-tabs{display:flex;gap:8px;margin-bottom:20px}.platform-tab{flex:1;padding:12px;border:1px solid var(--border);background:transparent;border-radius:10px;font-size:14px;font-weight:500;color:var(--text-subtle);cursor:pointer;transition:all .2s ease}.platform-tab:hover{background:var(--bg-tertiary)}.platform-tab.active{background:var(--text);color:var(--bg);border-color:var(--text)}.platform-content{display:none}.platform-content.active{display:block}.install-steps{list-style:none}.install-step{display:flex;gap:16px;padding:16px 0;border-bottom:1px solid var(--border)}.install-step:last-child{border-bottom:none}.step-number{width:28px;height:28px;background:var(--accent);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;flex-shrink:0}.step-content h4{font-size:15px;font-weight:600;margin-bottom:4px;color:var(--text)}.step-content p{font-size:14px;color:var(--text-muted);line-height:1.5}@media (max-width: 400px){.voice-orb,.voice-orb-ring{width:160px;height:160px}.voice-orb-inner{width:130px;height:130px}.voice-orb-inner svg{width:40px;height:40px}}@supports (padding-top: env(safe-area-inset-top)){.app-header{padding-top:calc(16px + env(safe-area-inset-top))}.app-footer{padding-bottom:calc(20px + env(safe-area-inset-bottom))}}
