@import "https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap";:root{--bg-primary:#07090e;--bg-secondary:#0e121cc7;--bg-tertiary:#161c2aa6;--bg-card:#101521d1;--bg-card-hover:#181f31e6;--border-subtle:#ffffff12;--border-glow:#6366f159;--border-active:#818cf899;--primary:#6366f1;--primary-hover:#4f46e5;--primary-glow:#6366f173;--accent-cyan:#06b6d4;--accent-purple:#a855f7;--accent-emerald:#10b981;--accent-rose:#f43f5e;--accent-amber:#f59e0b;--text-main:#f1f5f9;--text-muted:#94a3b8;--text-dim:#64748b;--font-sans:"Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:"JetBrains Mono", monospace;--radius-sm:8px;--radius-md:14px;--radius-lg:20px;--radius-xl:26px;--shadow-card:0 25px 60px -15px #0009, 0 0 1px 1px #ffffff0f;--shadow-glow:0 0 35px -5px var(--primary-glow)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--bg-primary);color:var(--text-main);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-image:radial-gradient(circle at 18% 12%,#6366f129 0%,#0000 40%),radial-gradient(circle at 82% 16%,#a855f724 0%,#0000 35%),radial-gradient(circle at 50% 85%,#06b6d41a 0%,#0000 45%);background-attachment:fixed;min-height:100vh;line-height:1.6;overflow-x:hidden}.bg-mesh-glow{pointer-events:none;z-index:0;background:radial-gradient(80% 50% at 50% -20%,#7877c640,#0000);height:480px;position:fixed;top:0;left:0;right:0}.container{z-index:1;width:min(1180px,100% - 36px);margin:0 auto;padding:32px 0 60px;position:relative}.header{background:var(--bg-secondary);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);justify-content:space-between;align-items:center;gap:20px;margin-bottom:28px;padding:16px 24px;display:flex;box-shadow:0 10px 30px #00000059}.brand{align-items:center;gap:16px;display:flex}.logo-wrapper{position:relative}.logo{color:#fff;z-index:1;background:linear-gradient(135deg,#6366f1 0%,#a855f7 50%,#06b6d4 100%);border-radius:14px;justify-content:center;align-items:center;width:48px;height:48px;font-size:24px;font-weight:800;transition:transform .3s cubic-bezier(.34,1.56,.64,1);display:flex;position:relative;box-shadow:0 8px 25px #6366f173}.logo:hover{transform:scale(1.05)rotate(3deg)}.brand-info{flex-direction:column;display:flex}.brand-title-row{align-items:center;gap:10px;display:flex}.brand h1{letter-spacing:-.5px;background:linear-gradient(135deg,#fff 0%,#cbd5e1 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:22px;font-weight:800}.version-badge{font-family:var(--font-mono);color:#c084fc;background:linear-gradient(135deg,#6366f133,#a855f733);border:1px solid #a855f766;border-radius:20px;padding:3px 8px;font-size:11px;font-weight:600;box-shadow:0 0 12px #a855f740}.brand p{color:var(--text-muted);font-size:13px;font-weight:500}.header-status-group{align-items:center;gap:12px;display:flex}.engine-pill{border:1px solid var(--border-subtle);color:var(--text-muted);background:#0f172ab3;border-radius:999px;align-items:center;gap:9px;padding:8px 16px;font-size:12px;font-weight:600;transition:all .25s;display:flex}.engine-pill.ready{color:#a7f3d0;background:#10b98114;border-color:#10b98159}.engine-dot{background:#64748b;border-radius:50%;width:8px;height:8px;position:relative}.engine-dot.ready{background:var(--accent-emerald);box-shadow:0 0 12px var(--accent-emerald)}.engine-dot.ready:after{content:"";border:2px solid var(--accent-emerald);opacity:.75;border-radius:50%;width:12px;height:12px;animation:2s infinite pulse-ring;position:absolute;top:-2px;left:-2px}@keyframes pulse-ring{0%{opacity:.8;transform:scale(.9)}50%{opacity:0;transform:scale(1.6)}to{opacity:0;transform:scale(.9)}}.pill-tag{color:#818cf8;background:#6366f114;border:1px solid #6366f133;border-radius:999px;align-items:center;gap:6px;padding:8px 14px;font-size:12px;font-weight:600;display:flex}.hero-card{background:var(--bg-card);-webkit-backdrop-filter:blur(20px);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);box-shadow:var(--shadow-card);margin-bottom:24px;padding:32px 36px;transition:border-color .3s;position:relative;overflow:hidden}.hero-card:before{content:"";background:linear-gradient(90deg, transparent, var(--primary), var(--accent-cyan), transparent);opacity:.7;height:2px;position:absolute;top:0;left:0;right:0}.hero-content{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:28px;display:flex}.hero-text{max-width:620px}.hero-title{letter-spacing:-.6px;align-items:center;gap:10px;margin-bottom:8px;font-size:26px;font-weight:800;display:flex}.hero-gradient-text{background:linear-gradient(135deg,#a5b4fc 0%,#38bdf8 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.hero-subtitle{color:var(--text-muted);font-size:14px;line-height:1.65}.hero-features{flex-wrap:wrap;gap:10px;margin-top:14px;display:flex}.feature-chip{color:var(--text-dim);background:#ffffff0a;border:1px solid #ffffff12;border-radius:8px;align-items:center;gap:6px;padding:4px 10px;font-size:12px;font-weight:500;display:inline-flex}.feature-chip span.bullet{color:var(--accent-cyan)}.hero-cta{flex-direction:column;align-items:flex-end;gap:10px;display:flex}.pipeline-progress-box{border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:#090d16b3;margin-top:24px;padding:18px 20px;display:none}.pipeline-progress-box.active{animation:.3s fadeIn;display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.pipeline-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.pipeline-title{color:#cbd5e1;align-items:center;gap:8px;font-size:13px;font-weight:600;display:flex}.pipeline-percent{font-family:var(--font-mono);color:var(--accent-cyan);font-size:12px;font-weight:600}.pipeline-bar-bg{background:#ffffff14;border-radius:999px;width:100%;height:6px;margin-bottom:14px;position:relative;overflow:hidden}.pipeline-bar-fill{background:linear-gradient(90deg,#6366f1,#38bdf8);border-radius:999px;width:0%;height:100%;transition:width .35s}.pipeline-steps{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;display:grid}.step-item{color:var(--text-dim);align-items:center;gap:6px;font-size:11px;font-weight:500;display:flex}.step-indicator{background:#ffffff26;border-radius:50%;width:8px;height:8px;transition:all .25s}.step-item.active .step-indicator{background:var(--accent-amber);box-shadow:0 0 8px var(--accent-amber)}.step-item.active{color:#fef08a}.step-item.done .step-indicator{background:var(--accent-emerald);box-shadow:0 0 8px var(--accent-emerald)}.step-item.done{color:#a7f3d0}.studio-card{background:var(--bg-card);-webkit-backdrop-filter:blur(20px);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);box-shadow:var(--shadow-card);grid-template-columns:1fr 1.25fr;min-height:580px;display:grid;overflow:hidden}.input-panel{border-right:1px solid var(--border-subtle);background:#0c101a80;flex-direction:column;padding:30px;display:flex}.panel-header{margin-bottom:20px}.panel-title{color:#fff;margin-bottom:4px;font-size:16px;font-weight:700}.panel-desc{color:var(--text-muted);font-size:13px}.mode-tabs{border-radius:var(--radius-md);border:1px solid var(--border-subtle);background:#080b12b3;gap:4px;margin-bottom:20px;padding:4px;display:flex}.tab-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:10px;flex:1;justify-content:center;align-items:center;gap:8px;padding:10px 14px;font-size:13px;font-weight:600;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.tab-btn:hover:not(.active){color:var(--text-main);background:#ffffff0a}.tab-btn.active{background:var(--primary);color:#fff;box-shadow:0 4px 14px #6366f159}.tab-pane{flex-direction:column;flex:1;gap:16px;display:none}.tab-pane.active{animation:.25s fadeIn;display:flex}.live-mic-container{border:1px solid var(--border-subtle);border-radius:var(--radius-lg);text-align:center;background:#080b1299;flex-direction:column;flex:1;justify-content:center;align-items:center;padding:24px 20px;display:flex;position:relative;overflow:hidden}.mic-pulse-ring{justify-content:center;align-items:center;width:104px;height:104px;margin-bottom:18px;display:flex;position:relative}.mic-glow-circle{background:radial-gradient(circle,#6366f140 0%,#0000 70%);border-radius:50%;width:100%;height:100%;animation:2.4s ease-in-out infinite pulse-mic;position:absolute}.live-mic-container.recording .mic-glow-circle{background:radial-gradient(circle,#f43f5e59 0%,#0000 70%);animation:1.2s ease-in-out infinite pulse-mic}@keyframes pulse-mic{0%{opacity:.5;transform:scale(.9)}50%{opacity:.9;transform:scale(1.3)}to{opacity:.5;transform:scale(.9)}}.mic-action-btn{cursor:pointer;color:#fff;z-index:2;background:linear-gradient(135deg,#6366f1,#4f46e5);border:none;border-radius:50%;justify-content:center;align-items:center;width:80px;height:80px;font-size:32px;transition:all .2s cubic-bezier(.34,1.56,.64,1);display:flex;position:relative;box-shadow:0 10px 28px #6366f166}.mic-action-btn:hover:not(:disabled){transform:scale(1.08);box-shadow:0 14px 34px #6366f18c}.mic-action-btn:active:not(:disabled){transform:scale(.96)}.mic-action-btn:disabled{opacity:.4;cursor:not-allowed;box-shadow:none;transform:none}.mic-action-btn.recording{background:linear-gradient(135deg,#f43f5e,#e11d48);animation:1.5s infinite recording-bounce;box-shadow:0 10px 30px #f43f5e80}@keyframes recording-bounce{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.mic-status-label{color:#fff;margin-bottom:4px;font-size:15px;font-weight:700}.mic-hint{color:var(--text-muted);font-size:12px}.waveform-canvas-box{border-radius:var(--radius-sm);border:1px solid var(--border-subtle);background:#05070cb3;width:100%;height:54px;margin-top:14px;position:relative;overflow:hidden}.waveform-canvas-box canvas{width:100%;height:100%;display:block}.dropzone{border-radius:var(--radius-lg);text-align:center;cursor:pointer;background:#080b1280;border:2px dashed #ffffff1f;flex-direction:column;justify-content:center;align-items:center;gap:10px;padding:32px 20px;transition:all .25s;display:flex;position:relative}.dropzone:hover:not(.disabled){border-color:var(--primary);background:#6366f10d;transform:translateY(-2px)}.dropzone.dragover{border-color:var(--accent-cyan);background:#06b6d414}.dropzone.disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.dropzone-icon{color:#818cf8;background:#6366f11f;border:1px solid #6366f140;border-radius:14px;justify-content:center;align-items:center;width:52px;height:52px;font-size:24px;display:flex}.dropzone-title{color:#fff;font-size:14px;font-weight:700}.dropzone-subtitle{color:var(--text-muted);font-size:12px}.file-format-pills{gap:6px;margin-top:4px;display:flex}.file-format-pill{font-family:var(--font-mono);color:var(--text-dim);background:#ffffff0f;border-radius:4px;padding:2px 7px;font-size:10px}.audio-preview-card{border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:#080b12b3;flex-direction:column;gap:12px;padding:16px;display:none}.audio-preview-card.active{animation:.25s fadeIn;display:flex}.audio-meta-row{justify-content:space-between;align-items:center;display:flex}.audio-file-name{color:#f1f5f9;white-space:nowrap;text-overflow:ellipsis;max-width:220px;font-size:13px;font-weight:600;overflow:hidden}.audio-duration-badge{font-family:var(--font-mono);color:#a5b4fc;background:#6366f126;border-radius:6px;padding:2px 8px;font-size:11px}audio.custom-audio-player{border-radius:8px;outline:none;width:100%;height:38px}.demo-pane-box{border:1px solid var(--border-subtle);border-radius:var(--radius-lg);background:#080b1299;flex-direction:column;gap:16px;padding:22px;display:flex}.demo-title-row{align-items:center;gap:12px;display:flex}.demo-badge{text-transform:uppercase;color:#34d399;background:#10b98126;border:1px solid #10b9814d;border-radius:6px;padding:3px 8px;font-size:11px;font-weight:700}.demo-audio-desc{color:var(--text-muted);font-size:13px;line-height:1.5}.status-pill-bar{border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:#070a10cc;align-items:center;gap:10px;margin-top:auto;padding:12px 16px;display:flex}.status-dot{background:#64748b;border-radius:50%;flex-shrink:0;width:8px;height:8px;transition:all .3s}.status-dot.loading{background:var(--accent-amber);box-shadow:0 0 10px var(--accent-amber);animation:1.5s infinite pulse-ring}.status-dot.success{background:var(--accent-emerald);box-shadow:0 0 10px var(--accent-emerald)}.status-dot.error{background:var(--accent-rose);box-shadow:0 0 10px var(--accent-rose)}.status-msg-text{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;font-size:12px;font-weight:500;overflow:hidden}.output-panel{background:#0a0d144d;flex-direction:column;padding:30px;display:flex}.workspace-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;display:flex}.workspace-title-group{align-items:center;gap:10px;display:flex}.workspace-title{color:#fff;font-size:16px;font-weight:700}.telemetry-tag{font-family:var(--font-mono);color:var(--text-dim);background:#ffffff0d;border:1px solid #ffffff14;border-radius:6px;padding:3px 8px;font-size:11px}.workspace-actions{align-items:center;gap:8px;display:flex}.action-btn{border-radius:var(--radius-sm);color:var(--text-muted);cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;align-items:center;gap:6px;padding:7px 12px;font-size:12px;font-weight:600;transition:all .2s;display:inline-flex}.action-btn:hover:not(:disabled){color:#fff;background:#ffffff1f;border-color:#fff3;transform:translateY(-1px)}.action-btn:disabled{opacity:.35;cursor:not-allowed;transform:none}.action-btn.primary-action{color:#fff;background:linear-gradient(135deg,#6366f1,#4f46e5);border-color:#6366f166;box-shadow:0 4px 14px #6366f140}.action-btn.primary-action:hover:not(:disabled){background:linear-gradient(135deg,#4f46e5,#4338ca);box-shadow:0 6px 18px #6366f159}.transcript-canvas{border-radius:var(--radius-lg);color:#f8fafc;white-space:pre-wrap;word-break:break-word;background:#06080ee6;border:1px solid #ffffff14;flex:1;min-height:240px;padding:24px;font-size:16px;line-height:1.85;transition:font-size .2s;position:relative;overflow-y:auto;box-shadow:inset 0 2px 8px #0006}.transcript-canvas.placeholder{color:#475569;text-align:center;justify-content:center;align-items:center;font-style:italic;display:flex}.transcript-canvas.streaming:after{content:"▋";color:var(--accent-cyan);margin-left:4px;animation:1s infinite blink}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.metrics-strip{grid-template-columns:repeat(4,1fr);gap:10px;margin-top:16px;display:grid}.metric-item{border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:#080b1299;flex-direction:column;padding:10px 12px;display:flex}.metric-label{color:var(--text-dim);text-transform:uppercase;letter-spacing:.3px;font-size:11px;font-weight:500}.metric-value{font-family:var(--font-mono);color:#f1f5f9;margin-top:2px;font-size:14px;font-weight:600}button{cursor:pointer;border-radius:var(--radius-md);border:none;outline:none;justify-content:center;align-items:center;gap:8px;padding:12px 22px;font-family:inherit;font-size:14px;font-weight:600;transition:all .2s cubic-bezier(.4,0,.2,1);display:inline-flex}.btn-primary{color:#fff;background:linear-gradient(135deg,#6366f1 0%,#4f46e5 100%);box-shadow:0 8px 20px #6366f14d}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 12px 26px #6366f173}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-primary:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;transform:none}.btn-secondary{color:var(--text-main);background:#ffffff0f;border:1px solid #ffffff1f}.btn-secondary:hover:not(:disabled){background:#ffffff1f;border-color:#ffffff40;transform:translateY(-2px)}.btn-secondary:disabled{opacity:.4;cursor:not-allowed;transform:none}.btn-success{color:#fff;background:linear-gradient(135deg,#10b981 0%,#059669 100%);box-shadow:0 8px 20px #10b9814d}.btn-success:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 12px 26px #10b98173}.btn-danger{color:#fff;background:linear-gradient(135deg,#f43f5e 0%,#e11d48 100%);box-shadow:0 8px 20px #f43f5e4d}.btn-danger:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 12px 26px #f43f5e73}.btn-large{padding:14px 28px;font-size:15px}.diagnostics-section{margin-top:24px}.diagnostics-accordion{background:var(--bg-card);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);overflow:hidden}.diagnostics-summary{cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--text-muted);justify-content:space-between;align-items:center;padding:16px 24px;font-size:13px;font-weight:600;transition:background .2s;display:flex}.diagnostics-summary:hover{color:var(--text-main);background:#ffffff05}.diagnostics-summary::-webkit-details-marker{display:none}.diagnostics-summary-left{align-items:center;gap:10px;display:flex}.chevron-icon{transition:transform .2s}details[open] .chevron-icon{transform:rotate(90deg)}.diagnostics-body{padding:0 24px 20px}.diagnostics-actions{justify-content:flex-end;gap:8px;margin-bottom:10px;display:flex}pre#debug{border-radius:var(--radius-md);max-height:260px;font-family:var(--font-mono);color:#94a3b8;white-space:pre-wrap;word-break:break-all;background:#04060a;border:1px solid #ffffff0f;padding:16px;font-size:11.5px;line-height:1.65;overflow-y:auto}.toast-notice{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:var(--radius-md);color:#fff;z-index:999;opacity:0;pointer-events:none;background:#0f172af2;border:1px solid #6366f166;align-items:center;gap:10px;padding:12px 20px;font-size:13px;font-weight:600;transition:all .3s cubic-bezier(.34,1.56,.64,1);display:flex;position:fixed;bottom:28px;right:28px;transform:translateY(100px);box-shadow:0 10px 30px #00000080}.toast-notice.show{opacity:1;transform:translateY(0)}.footer{text-align:center;color:var(--text-dim);flex-direction:column;align-items:center;gap:6px;margin-top:36px;font-size:12px;display:flex}.footer-links{gap:14px;display:flex}.footer-link{color:var(--text-muted);text-decoration:none;transition:color .2s}.footer-link:hover{color:var(--accent-cyan)}@media (width<=900px){.studio-card{grid-template-columns:1fr}.input-panel{border-right:none;border-bottom:1px solid var(--border-subtle)}.header{flex-direction:column;align-items:flex-start}.header-status-group{justify-content:space-between;width:100%}.metrics-strip{grid-template-columns:repeat(2,1fr)}}@media (width<=600px){.hero-content{flex-direction:column;align-items:flex-start}.hero-cta{align-items:stretch;width:100%}.hero-cta button{width:100%}}