@import"https://fonts.googleapis.com/css2?family=Syne:wght@400;600;700;800&family=DM+Sans:wght@300;400;500&display=swap";*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root,[data-theme=dark]{--bg: #0d1117;--surface: #161b24;--surface2: #1e2736;--border: #2a3347;--accent: #f97316;--accent2: #fbbf24;--text: #e8edf5;--text-muted: #7a8ba8;--green: #22c55e;--red: #ef4444;--blue: #3b82f6;--header-bg: linear-gradient(135deg, #0a0f16 0%, #1a2235 100%);--orb-bg: radial-gradient(ellipse at 50% 60%, #1a2538 0%, #0d1117 70%);--chip-hover-bg: rgba(249,115,22,.08);--error-bg: rgba(239,68,68,.12);--error-border: rgba(239,68,68,.3);--error-text: #fca5a5;--input-bg: #1e2736;--shadow: 0 4px 24px rgba(0,0,0,.4);--track-line: rgba(249,115,22,.04);--transcript-bg: rgba(249,115,22,.12);--response-bg: #1e2736;--empty-hint: #7a8ba8;--radius: 14px;font-family:DM Sans,sans-serif;color:var(--text);background:var(--bg)}[data-theme=light]{--bg: #f5f7fa;--surface: #ffffff;--surface2: #eef1f6;--border: #d1d9e6;--accent: #f97316;--accent2: #f59e0b;--text: #1a2235;--text-muted: #5a6a82;--green: #16a34a;--red: #dc2626;--blue: #2563eb;--header-bg: linear-gradient(135deg, #ffffff 0%, #f0f4ff 100%);--orb-bg: radial-gradient(ellipse at 50% 60%, #f0f4ff 0%, #f5f7fa 70%);--chip-hover-bg: rgba(249,115,22,.1);--error-bg: rgba(220,38,38,.08);--error-border: rgba(220,38,38,.25);--error-text: #b91c1c;--input-bg: #eef1f6;--shadow: 0 4px 24px rgba(0,0,0,.1);--track-line: rgba(249,115,22,.06);--transcript-bg: rgba(249,115,22,.1);--response-bg: #eef1f6;--empty-hint: #5a6a82}html,body,#root{height:100%;width:100%;overflow:hidden}.vb-wrapper{display:flex;flex-direction:column;height:100vh;height:100dvh;width:100%;max-width:600px;margin:0 auto;background:var(--surface);border-left:1px solid var(--border);border-right:1px solid var(--border);position:relative;overflow:hidden;color:var(--text)}.vb-wrapper:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(90deg,transparent,transparent 48px,var(--track-line) 48px,var(--track-line) 50px);pointer-events:none;z-index:0}.vb-header{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:14px 20px;background:var(--header-bg);border-bottom:2px solid var(--accent);box-shadow:0 2px 20px #f9731626;flex-shrink:0}.vb-header-right{display:flex;flex-direction:column;align-items:flex-end;gap:8px}.vb-header-controls{display:flex;align-items:center;gap:8px}.vb-logo{display:flex;align-items:center;gap:12px}.vb-train-icon{font-size:1.8rem;line-height:1;filter:drop-shadow(0 0 8px rgba(249,115,22,.5))}.vb-logo h1{font-family:Syne,sans-serif;font-size:1.35rem;font-weight:800;background:linear-gradient(90deg,var(--accent),var(--accent2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1.1}.vb-logo p{font-size:.68rem;color:var(--text-muted);letter-spacing:.04em}.vb-lang-switcher-area{margin-top:24px;display:flex;justify-content:center;width:100%}.vb-lang-switcher{display:flex;gap:4px;background:var(--surface2);padding:4px;border-radius:999px;border:1px solid var(--border);box-shadow:0 4px 14px #0000000d}.vb-lang-btn{padding:8px 16px;border-radius:999px;border:none;background:transparent;color:var(--text-muted);font-family:DM Sans,sans-serif;font-size:.85rem;font-weight:600;cursor:pointer;transition:all .2s}.vb-lang-btn.active{background:var(--accent);color:#fff;box-shadow:0 2px 8px #f9731666}.vb-lang-btn:hover:not(.active):not(:disabled){color:var(--text);background:#f973161a}.vb-lang-btn:disabled{opacity:.5;cursor:not-allowed}.vb-theme-btn{width:36px;height:36px;border-radius:50%;border:1px solid var(--border);background:var(--surface2);color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0}.vb-theme-btn:hover{border-color:var(--accent);color:var(--accent);background:#f9731614}.vb-status-badge{display:flex;align-items:center;gap:6px;font-size:.7rem;font-weight:500;color:var(--text-muted);background:var(--surface2);padding:4px 10px;border-radius:999px;border:1px solid var(--border)}.vb-dot{width:6px;height:6px;border-radius:50%;background:var(--text-muted);transition:background .3s}[data-status=idle] .vb-dot{background:var(--green)}[data-status=recording] .vb-dot{background:var(--red);animation:blink .8s step-end infinite}[data-status=processing] .vb-dot{background:var(--accent);animation:blink .6s step-end infinite}[data-status=playing] .vb-dot{background:var(--blue)}[data-status=error] .vb-dot{background:var(--red)}@keyframes blink{0%,to{opacity:1}50%{opacity:.3}}.vb-main{flex:1;display:flex;flex-direction:column;align-items:center;position:relative;z-index:1;overflow-y:auto;overflow-x:hidden;background:var(--orb-bg);padding:20px 24px}.vb-orb-area{display:flex;flex-direction:column;align-items:center;gap:20px;width:100%;max-width:360px;margin:auto 0}.vb-transcript-bubble{display:flex;align-items:flex-start;gap:10px;background:var(--transcript-bg);border:1px solid rgba(249,115,22,.25);border-radius:var(--radius);padding:12px 16px;width:100%;animation:slide-in .25s ease}.vb-transcript-icon{font-size:1.1rem;flex-shrink:0;margin-top:1px}.vb-transcript-text{font-size:.9rem;color:var(--text);line-height:1.5;font-style:italic}.vb-orb-wrapper{display:flex;align-items:center;justify-content:center}.vb-response-bubble{display:flex;align-items:flex-start;gap:10px;background:var(--response-bg);border:1px solid var(--border);border-radius:var(--radius);padding:12px 16px;width:100%;animation:slide-in .25s ease}.vb-response-icon{font-size:1.1rem;flex-shrink:0;margin-top:1px}.vb-response-text{font-size:.9rem;color:var(--text);line-height:1.6}.vb-processing{display:flex;align-items:center;gap:10px;padding:12px 16px;background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);font-size:.875rem;color:var(--text-muted)}.vb-spinner{width:18px;height:18px;border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite;flex-shrink:0}@keyframes spin{to{transform:rotate(360deg)}}.vb-empty{text-align:center;padding:8px 0}.vb-empty-hint{font-size:.82rem;color:var(--empty-hint);line-height:1.5}.vb-mic-btn{position:relative;width:96px;height:96px;border-radius:50%;border:none;background:linear-gradient(145deg,var(--accent),#ea580c);color:#fff;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;box-shadow:0 0 28px #f9731666,0 4px 20px #0000004d;transition:all .25s;flex-shrink:0}.vb-mic-btn svg{width:32px;height:32px}.vb-mic-label{font-family:Syne,sans-serif;font-size:.58rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.vb-mic-btn:hover:not(:disabled){transform:scale(1.06);box-shadow:0 0 40px #f9731699,0 6px 24px #0000004d}.vb-mic-btn:active:not(:disabled){transform:scale(.96)}.vb-mic-btn:disabled{opacity:.5;cursor:not-allowed;background:var(--surface2);box-shadow:none}.vb-mic-btn.recording{background:linear-gradient(145deg,var(--red),#b91c1c);box-shadow:0 0 36px #ef444480,0 4px 20px #0000004d;animation:mic-pulse 1.5s ease-in-out infinite}.vb-mic-btn.playing{background:linear-gradient(145deg,var(--blue),#1d4ed8);box-shadow:0 0 36px #3b82f680,0 4px 20px #0000004d}@keyframes mic-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.04)}}.vb-pulse-ring{position:absolute;top:-10px;right:-10px;bottom:-10px;left:-10px;border-radius:50%;border:2px solid var(--red);animation:ring-expand 1.8s ease-out infinite;pointer-events:none}.vb-pulse-ring--delay{animation-delay:.6s;top:-18px;right:-18px;bottom:-18px;left:-18px;opacity:.5}@keyframes ring-expand{0%{transform:scale(.85);opacity:.9}to{transform:scale(1.4);opacity:0}}.vb-error{position:relative;z-index:2;margin:0 16px;padding:10px 14px;background:var(--error-bg);border:1px solid var(--error-border);border-radius:var(--radius);display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:.82rem;color:var(--error-text);animation:slide-in .2s ease;flex-shrink:0}.vb-error button{background:none;border:none;color:var(--error-text);cursor:pointer;font-size:1rem;padding:0 4px;flex-shrink:0}.vb-suggestions{position:relative;z-index:2;padding:10px 16px 8px;border-top:1px solid var(--border);background:var(--surface);flex-shrink:0}.vb-suggestions-label{font-size:.65rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin-bottom:8px;font-weight:600}.vb-suggestions-row{display:flex;gap:6px;flex-wrap:wrap}.vb-chip{padding:6px 13px;border-radius:999px;border:1px solid var(--border);background:var(--surface2);color:var(--text);font-size:.73rem;font-family:DM Sans,sans-serif;cursor:pointer;transition:all .2s;white-space:nowrap;line-height:1.4}.vb-chip:hover:not(:disabled){border-color:var(--accent);color:var(--accent);background:var(--chip-hover-bg)}.vb-chip:disabled{opacity:.4;cursor:not-allowed}.vb-text-area{position:relative;z-index:2;padding:10px 16px 16px;background:var(--surface);border-top:1px solid var(--border);flex-shrink:0}.vb-text-form{display:flex;gap:8px;align-items:center}.vb-text-input{flex:1;padding:11px 16px;background:var(--input-bg);border:1px solid var(--border);border-radius:999px;color:var(--text);font-family:DM Sans,sans-serif;font-size:.875rem;outline:none;transition:border-color .2s}.vb-text-input:focus{border-color:var(--accent)}.vb-text-input::placeholder{color:var(--text-muted)}.vb-text-send{width:44px;height:44px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:var(--accent);border:none;border-radius:50%;color:#fff;cursor:pointer;transition:all .2s}.vb-text-send:hover:not(:disabled){background:#ea580c;transform:scale(1.05)}.vb-text-send:disabled{opacity:.4;cursor:not-allowed}@keyframes slide-in{0%{transform:translateY(8px);opacity:0}to{transform:translateY(0);opacity:1}}*{scrollbar-width:thin;scrollbar-color:var(--border) transparent}@media (max-width: 480px){.vb-wrapper{border:none}.vb-header{padding:10px 14px}.vb-logo h1{font-size:1.1rem}.vb-mic-btn{width:84px;height:84px}.vb-mic-btn svg{width:28px;height:28px}.vb-suggestions{padding:8px 12px 6px}.vb-chip{font-size:.7rem;padding:5px 10px}}