:root{--bg-primary:#0d0d0d;--bg-secondary:#0d0d0d;--bg-tertiary:#1a1a1a;--bg-elevated:#111;--bg-glass:#0d0d0dd9;--text-primary:beige;--text-secondary:#aaa;--text-tertiary:#777;--text-inverse:#000;--accent-primary:#ffb800;--accent-primary-hover:#ffca40;--accent-primary-glow:#ffb80026;--accent-danger:#c43;--accent-danger-hover:#e35d4d;--accent-danger-glow:#cc443326;--accent-success:#10b981;--accent-success-glow:#10b98126;--accent-warning:#f59e0b;--lang-de:#ffb800;--lang-de-bg:#ffb8001f;--lang-es:#047857;--lang-es-bg:#10b9811f;--border-subtle:#222;--border-default:#333;--border-focus:#555;--shadow-sm:0 1px 3px #00000080;--shadow-md:0 4px 6px -1px #00000080, 0 2px 4px -2px #00000080;--shadow-lg:0 10px 15px -3px #00000080, 0 4px 6px -4px #00000080;--shadow-glow:0 0 15px #ffb80026;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:20px;--font-serif:"VT323", monospace;--font-sans:"Avenir Next", "Avenir", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono:"JetBrains Mono", "Cascadia Code", "Consolas", monospace;--transition-fast:.15s cubic-bezier(.4, 0, .2, 1);--transition-normal:.25s cubic-bezier(.4, 0, .2, 1);--transition-smooth:.35s cubic-bezier(.22, 1, .36, 1);--transcript-font-size:16px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}body{background:var(--bg-primary);color:var(--text-primary);height:100vh;font-family:Avenir Next,Avenir,Inter,system-ui,-apple-system,sans-serif;line-height:1.6;overflow:hidden}#app{flex-direction:column;height:100vh;display:flex;overflow:hidden}#topbar{background:var(--bg-secondary);border-bottom:1px solid var(--border-subtle);z-index:100;flex-shrink:0;justify-content:space-between;align-items:center;height:56px;padding:0 20px;display:flex}.topbar-left,.topbar-right,.logo{align-items:center;gap:8px;display:flex}.logo-de{color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.5px;font-size:14px;font-weight:500}.logo-text{color:var(--text-primary);letter-spacing:-.01em;font-family:VT323,monospace;font-size:22px;font-weight:700}.session-timer{background:var(--bg-tertiary);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);font-family:var(--font-mono);color:var(--text-secondary);transition:all var(--transition-normal);align-items:center;gap:8px;padding:6px 16px;font-size:15px;font-weight:500;display:flex}.session-timer.active{color:var(--accent-success);border-color:var(--accent-success-glow);background:#22c55e14}.timer-icon{font-size:14px}.btn-icon{border:1px solid var(--border-subtle);border-radius:var(--radius-sm);width:36px;height:36px;color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);background:0 0;justify-content:center;align-items:center;display:flex}.btn-icon:hover{background:var(--bg-tertiary);color:var(--text-primary);border-color:var(--border-default)}.btn-icon:disabled{opacity:.4;cursor:not-allowed}.btn-icon-sm{width:28px;height:28px}.btn-outline{border:1px solid var(--border-default);height:38px;color:var(--text-primary);cursor:pointer;transition:all var(--transition-fast);background:0 0;border-radius:30px;justify-content:center;align-items:center;padding:0 16px;font-family:Avenir Next,Avenir,Inter,system-ui,-apple-system,sans-serif;font-size:13px;font-weight:500;display:inline-flex}.btn-outline:hover{background:var(--bg-tertiary);border-color:var(--text-secondary)}.btn-primary,.btn-secondary,.btn-danger{border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-normal);border:none;align-items:center;gap:8px;padding:10px 20px;font-family:Avenir Next,Avenir,Inter,system-ui,-apple-system,sans-serif;font-size:14px;font-weight:600;display:inline-flex}.btn-primary{background:var(--accent-primary);color:var(--text-inverse);box-shadow:var(--shadow-sm)}.btn-primary:hover{background:var(--accent-primary-hover);box-shadow:var(--shadow-glow);transform:translateY(-1px)}.btn-secondary{background:var(--bg-tertiary);color:var(--text-secondary);border:1px solid var(--border-default)}.btn-secondary:hover{background:var(--bg-elevated);color:var(--text-primary)}.btn-danger{color:var(--accent-danger);background:#ef444426;border:1px solid #ef444433}.btn-danger:hover{box-shadow:0 0 15px var(--accent-danger-glow);background:#ef444440}.btn-control{border-radius:var(--radius-lg);padding:10px 24px}.btn-control:disabled{opacity:.35;cursor:not-allowed;box-shadow:none!important;transform:none!important}#main-content{flex:1;display:flex;overflow:hidden}#transcript-section{flex-direction:column;flex:1;min-width:0;display:flex;overflow:hidden}.session-info{background:var(--bg-secondary);border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:center;padding:12px 24px;display:flex}.session-date{color:var(--text-tertiary);font-size:13px;font-weight:500}.language-switcher{background:var(--bg-primary);border-radius:var(--radius-md);border:1px solid var(--border-subtle);gap:6px;padding:4px;display:flex}.lang-btn{border-radius:var(--radius-sm);color:var(--text-tertiary);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;align-items:center;gap:6px;padding:6px 14px;font-family:Avenir Next,Avenir,Inter,system-ui,-apple-system,sans-serif;font-size:13px;font-weight:600;display:flex}.lang-btn:hover{background:var(--bg-tertiary);color:var(--text-secondary)}.lang-btn.active[data-lang=de-DE]{background:var(--lang-de-bg);color:var(--lang-de);box-shadow:0 0 10px #ffcc0026}.lang-btn.active[data-lang=es-MX]{background:var(--lang-es-bg);color:var(--lang-es);box-shadow:0 0 10px #00b89426}.lang-flag{font-size:16px}.transcript-container{scroll-behavior:smooth;flex:1;padding:24px;overflow-y:auto}.transcript-container::-webkit-scrollbar{width:6px}.transcript-container::-webkit-scrollbar-track{background:0 0}.transcript-container::-webkit-scrollbar-thumb{background:var(--border-default);border-radius:3px}.transcript-container::-webkit-scrollbar-thumb:hover{background:var(--text-tertiary)}.transcript-empty{text-align:center;height:100%;color:var(--text-tertiary);flex-direction:column;justify-content:center;align-items:center;display:flex}.empty-icon{margin-bottom:16px;font-size:56px;animation:3s ease-in-out infinite float}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.serif-title{color:var(--text-primary);letter-spacing:-.02em;margin-bottom:8px;font-family:VT323,monospace;font-size:36px;font-weight:700}.transcript-empty p{max-width:400px;font-size:14px;line-height:1.7}.hint{color:var(--text-tertiary);margin-top:12px;font-size:12px!important}kbd{background:var(--bg-elevated);border:1px solid var(--border-default);font-family:var(--font-mono);color:var(--text-secondary);border-radius:4px;padding:2px 7px;font-size:11px;display:inline-block}.transcript-content{max-width:720px;margin:0 auto}.transcript-entry{gap:12px;padding:8px 0;animation:.3s fadeInUp;display:flex}@keyframes fadeInUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.entry-timestamp{font-family:var(--font-mono);color:var(--text-tertiary);-webkit-user-select:none;user-select:none;flex-shrink:0;min-width:52px;padding-top:3px;font-size:12px}.entry-lang-badge{-webkit-user-select:none;user-select:none;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:20px;margin-top:3px;font-size:10px;font-weight:700;display:flex}.entry-lang-badge.de{background:var(--lang-de-bg);color:var(--lang-de)}.entry-lang-badge.es{background:var(--lang-es-bg);color:var(--lang-es)}.entry-text{font-size:var(--transcript-font-size);color:var(--text-primary);flex:1;line-height:1.7}.interim-text{max-width:720px;font-size:var(--transcript-font-size);color:var(--text-tertiary);opacity:.6;min-height:30px;margin:0 auto;padding:8px 0 8px 92px;font-style:italic;line-height:1.7}.lang-separator{align-items:center;gap:12px;max-width:720px;margin:16px auto;display:flex}.lang-separator:before,.lang-separator:after{content:"";background:var(--border-subtle);flex:1;height:1px}.lang-separator-label{text-transform:uppercase;letter-spacing:.1em;color:var(--text-tertiary);border-radius:var(--radius-sm);padding:2px 10px;font-size:11px;font-weight:600}.lang-separator-label.de{background:var(--lang-de-bg);color:var(--lang-de)}.lang-separator-label.es{background:var(--lang-es-bg);color:var(--lang-es)}.pause-marker{background:var(--bg-tertiary);border:1px solid var(--border-subtle);border-radius:var(--radius-md);max-width:720px;color:var(--text-tertiary);align-items:center;gap:12px;margin:20px auto;padding:10px 16px;font-size:12px;display:flex}.pause-marker-icon{font-size:14px}.pause-marker-text{font-weight:500}.control-bar{background:var(--bg-secondary);border-top:1px solid var(--border-subtle);flex-shrink:0;justify-content:space-between;align-items:center;padding:16px 24px;display:flex}.controls-left,.controls-center,.controls-right{align-items:center;gap:12px;display:flex}.controls-center{gap:8px}.recording-indicator{border-radius:var(--radius-lg);transition:opacity var(--transition-normal);background:#ef44441a;align-items:center;gap:8px;padding:4px 12px;display:flex}.recording-indicator.hidden{opacity:0;pointer-events:none}.pulse-dot{background:var(--accent-danger);border-radius:50%;width:8px;height:8px;animation:1.5s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:1;box-shadow:0 0 #ef444499}50%{opacity:.6;box-shadow:0 0 0 6px #ef444400}}.rec-label{color:var(--accent-danger);letter-spacing:.1em;font-size:11px;font-weight:700}.word-count{color:var(--text-tertiary);font-size:12px;font-weight:500}.engine-status{color:var(--text-tertiary);transition:color var(--transition-fast);font-size:12px;font-weight:500}.mic-level-container{background:var(--bg-primary);border:1px solid var(--border-subtle);border-radius:3px;width:60px;height:6px;overflow:hidden}.mic-level-container.hidden{display:none}.mic-level-bar{background:var(--accent-success);border-radius:3px;width:0%;height:100%;transition:width 80ms,background .2s}.mic-level-bar.high{background:var(--accent-warning)}.mic-level-bar.clipping{background:var(--accent-danger)}.sidebar{background:var(--bg-secondary);border-left:1px solid var(--border-subtle);width:320px;transition:width var(--transition-smooth), opacity var(--transition-normal);flex-direction:column;flex-shrink:0;display:flex;overflow:hidden}.sidebar.collapsed{opacity:0;width:0}.sidebar-header{border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.sidebar-header h3{color:var(--text-secondary);font-size:14px;font-weight:600}.summary-list{flex:1;padding:16px;overflow-y:auto}.summary-list::-webkit-scrollbar{width:4px}.summary-list::-webkit-scrollbar-thumb{background:var(--border-default);border-radius:2px}.summary-empty{text-align:center;height:100%;color:var(--text-tertiary);justify-content:center;align-items:center;padding:20px;font-size:13px;line-height:1.7;display:flex}.summary-card{background:var(--bg-tertiary);border:1px solid var(--border-subtle);border-radius:var(--radius-md);margin-bottom:12px;padding:14px;animation:.3s fadeInUp}.summary-card-header{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.summary-card-time{font-family:var(--font-mono);color:var(--text-tertiary);font-size:11px}.summary-card-segment{color:var(--accent-primary);background:var(--accent-primary-glow);border-radius:var(--radius-sm);padding:2px 8px;font-size:11px;font-weight:600}.summary-card-stats{grid-template-columns:1fr 1fr;gap:8px;display:grid}.stat-item{background:var(--bg-primary);border-radius:var(--radius-sm);flex-direction:column;padding:8px;display:flex}.stat-value{color:var(--text-primary);font-size:16px;font-weight:700}.stat-label{color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.08em;font-size:10px}.modal{z-index:1000;transition:opacity var(--transition-normal);justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal.hidden{opacity:0;pointer-events:none}.modal-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0009;position:absolute;inset:0}.modal-content{background:var(--bg-elevated);border:1px solid var(--border-default);border-radius:var(--radius-xl);min-width:380px;max-width:480px;box-shadow:var(--shadow-lg);padding:28px;animation:.25s modalIn;position:relative}@keyframes modalIn{0%{opacity:0;transform:scale(.95)translateY(10px)}to{opacity:1;transform:scale(1)translateY(0)}}.modal-content h3{color:var(--text-primary);margin-bottom:20px;font-size:18px;font-weight:700}.modal-close{text-align:center;justify-content:center;width:100%;margin-top:16px}.export-options{flex-direction:column;gap:8px;display:flex}.export-btn{background:var(--bg-tertiary);border:1px solid var(--border-subtle);border-radius:var(--radius-md);width:100%;color:var(--text-primary);cursor:pointer;transition:all var(--transition-fast);align-items:center;gap:12px;padding:14px 16px;font-family:Avenir Next,Avenir,Inter,system-ui,-apple-system,sans-serif;font-size:14px;font-weight:500;display:flex}.export-btn:hover{background:var(--bg-primary);border-color:var(--accent-primary);box-shadow:var(--shadow-glow)}.export-icon{font-size:20px}.settings-group{margin-bottom:16px}.settings-group label{color:var(--text-secondary);margin-bottom:6px;font-size:13px;font-weight:500;display:block}.settings-group input[type=number],.settings-group select{background:var(--bg-primary);border:1px solid var(--border-default);border-radius:var(--radius-sm);width:100%;color:var(--text-primary);transition:border-color var(--transition-fast);padding:8px 12px;font-family:Avenir Next,Avenir,Inter,system-ui,-apple-system,sans-serif;font-size:14px}.settings-group input[type=number]:focus,.settings-group select:focus{border-color:var(--accent-primary);outline:none}.settings-group input[type=checkbox]{accent-color:var(--accent-primary);margin-right:8px}.settings-actions{gap:8px;margin-top:20px;display:flex}.settings-actions .btn-primary,.settings-actions .btn-secondary{flex:1;justify-content:center}@media (width<=900px){.sidebar{opacity:0;width:0}.sidebar.collapsed{width:0}.topbar-left .logo-text{display:none}}.hide-timestamps .entry-timestamp{display:none}.hide-timestamps .interim-text{padding-left:40px}