:root{--gradient-start:#3b82f6;--gradient-end:#8b5cf6;--recording-color:#10b981;--stop-color:#ef4444;--glass-bg:hsla(0,0%,100%,.1);--glass-border:hsla(0,0%,100%,.2);--transition-smooth:all 0.3s cubic-bezier(0.4,0,0.2,1)}.dark{--bg-primary:#0f172a;--bg-secondary:#1e293b;--text-primary:#e2e8f0;--text-secondary:#94a3b8;--border-color:#334155}.light{--bg-primary:#fff;--bg-secondary:#f8fafc;--text-primary:#1e293b;--text-secondary:#64748b;--border-color:#e2e8f0}.app-container{width:100vw;height:100vh;display:flex;flex-direction:column;background:var(--bg-primary);color:var(--text-primary);font-family:Inter,system-ui,sans-serif;overflow:hidden;transition:var(--transition-smooth)}.app-header{height:60px;background:var(--bg-secondary);border-bottom:1px solid var(--border-color);padding:0 24px;z-index:100}.app-header,.header-content{display:flex;align-items:center}.header-content{width:100%;justify-content:space-between}.app-branding{display:flex;align-items:center;gap:12px}.app-icon{width:32px;height:32px;animation:pulse-gentle 4s ease-in-out infinite}.app-title{font-size:20px;font-weight:600;background:linear-gradient(135deg,var(--gradient-start),var(--gradient-end));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-fill-color:transparent}.header-actions{display:flex;gap:8px}.icon-button{width:40px;height:40px;border-radius:8px;border:none;background:transparent;color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:var(--transition-smooth)}.icon-button:hover{background:var(--glass-bg);color:var(--text-primary)}.app-main{flex:1;overflow:hidden}.panels-container{height:100%;display:grid;grid-template-columns:1fr 2fr 300px;gap:1px;background:var(--border-color)}.panel{background:var(--bg-primary);overflow:hidden;display:flex;flex-direction:column}.recording-panel{padding:40px;flex-direction:column;gap:32px}.record-button,.recording-panel{display:flex;align-items:center;justify-content:center}.record-button{width:120px;height:120px;border-radius:50%;border:none;color:#fff;cursor:pointer;font-size:20px;font-weight:600;transition:var(--transition-smooth);position:relative;overflow:hidden}.record-button,.record-button:before{background:linear-gradient(135deg,var(--gradient-start),var(--gradient-end))}.record-button:before{content:"";position:absolute;inset:-2px;border-radius:50%;opacity:0;animation:pulse-ring 2s cubic-bezier(.4,0,.6,1) infinite;z-index:-1}.record-button.recording{background:var(--recording-color)}.record-button.recording:before{animation:pulse-ring 1s cubic-bezier(.4,0,.6,1) infinite}.record-button:hover{transform:scale(1.05);box-shadow:0 10px 40px -10px rgba(59,130,246,.5)}.waveform-container{width:100%;height:100px;background:var(--bg-secondary);border-radius:12px;padding:16px;position:relative;overflow:hidden}.waveform-canvas{width:100%;height:100%}.audio-meter{width:100%;height:8px;background:var(--bg-secondary);border-radius:4px;overflow:hidden;position:relative}.audio-level{height:100%;background:linear-gradient(90deg,var(--recording-color),var(--gradient-end));transition:width .1s ease-out}.recording-timer{font-size:32px;font-weight:300;font-variant-numeric:tabular-nums;color:var(--text-primary)}.editor-panel{padding:24px;display:flex;flex-direction:column;gap:16px}.editor-toolbar{display:flex;gap:8px;padding:12px;background:var(--bg-secondary);border-radius:8px;flex-wrap:wrap}.toolbar-button{width:36px;height:36px;border:none;background:transparent;color:var(--text-secondary);cursor:pointer;border-radius:6px;display:flex;align-items:center;justify-content:center;transition:var(--transition-smooth)}.toolbar-button.active,.toolbar-button:hover{background:var(--glass-bg);color:var(--text-primary)}.toolbar-separator{width:1px;height:24px;background:var(--border-color);margin:0 4px;align-self:center}.editor-content{flex:1;background:var(--bg-secondary);border-radius:8px;padding:24px;overflow-y:auto;font-family:JetBrains Mono,monospace;font-size:16px;line-height:1.6;white-space:pre-wrap;word-wrap:break-word;min-height:300px;outline:none}.editor-content:focus{box-shadow:0 0 0 2px var(--gradient-start)}.editor-footer{display:flex;justify-content:space-between;align-items:center;padding:12px;background:var(--bg-secondary);border-radius:8px;font-size:14px;color:var(--text-secondary)}.transcription-progress{width:100%;height:4px;background:var(--bg-secondary);border-radius:2px;overflow:hidden;margin-bottom:16px}.progress-bar{height:100%;background:linear-gradient(90deg,var(--gradient-start),var(--gradient-end));transition:width .3s ease}.sessions-panel{background:var(--bg-secondary);display:flex;flex-direction:column}.sessions-header{padding:16px;border-bottom:1px solid var(--border-color)}.search-input{width:100%;padding:8px 12px;background:var(--bg-primary);border:1px solid var(--border-color);border-radius:6px;color:var(--text-primary);font-size:14px;outline:none;transition:var(--transition-smooth)}.search-input:focus{border-color:var(--gradient-start)}.sessions-list{flex:1;overflow-y:auto;padding:8px}.session-card{padding:12px;background:var(--bg-primary);border-radius:8px;margin-bottom:8px;cursor:pointer;transition:var(--transition-smooth);border:2px solid transparent}.session-card:hover{border-color:var(--gradient-start)}.session-card.active{border-color:var(--gradient-end);background:var(--glass-bg)}.session-title{font-weight:500;margin-bottom:4px;display:flex;justify-content:space-between;align-items:center}.session-meta{font-size:12px;color:var(--text-secondary)}.session-preview{font-size:13px;color:var(--text-secondary);margin-top:8px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.app-footer{height:80px;background:var(--bg-secondary);border-top:1px solid var(--border-color);padding:0 24px}.app-footer,.footer-content{display:flex;align-items:center}.footer-content{width:100%;justify-content:space-between}.stats-section{display:flex;gap:32px}.stat-item{display:flex;flex-direction:column;align-items:center}.stat-value{font-size:24px;font-weight:600;color:var(--text-primary)}.stat-label{font-size:12px;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em}.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .2s ease-out}.modal-content{background:var(--bg-primary);border-radius:16px;box-shadow:0 20px 60px -10px rgba(0,0,0,.3);max-width:90vw;max-height:90vh;overflow:hidden;animation:slideUp .3s ease-out}.modal-header{padding:24px;border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;align-items:center}.modal-title{font-size:20px;font-weight:600}.modal-body{padding:24px;max-height:calc(90vh - 160px);overflow-y:auto}.modal-footer{padding:24px;border-top:1px solid var(--border-color);display:flex;justify-content:flex-end;gap:12px}.button{padding:10px 20px;border-radius:8px;border:none;font-weight:500;cursor:pointer;transition:var(--transition-smooth);display:inline-flex;align-items:center;gap:8px}.button-primary{background:linear-gradient(135deg,var(--gradient-start),var(--gradient-end));color:#fff}.button-primary:hover{transform:translateY(-1px);box-shadow:0 10px 20px -5px rgba(59,130,246,.3)}.button-secondary{background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border-color)}.button-secondary:hover{background:var(--glass-bg)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes pulse-ring{0%{transform:scale(1);opacity:1}to{transform:scale(1.5);opacity:0}}@keyframes pulse-gentle{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@media (max-width:1024px){.panels-container{grid-template-columns:1fr;grid-template-rows:auto 1fr auto}.recording-panel{padding:24px}.record-button{width:100px;height:100px}.sessions-panel{height:200px}}.glass{background:var(--glass-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--glass-border)}.tooltip{position:absolute;background:var(--bg-secondary);color:var(--text-primary);padding:8px 12px;border-radius:6px;font-size:12px;box-shadow:0 4px 12px rgba(0,0,0,.1);z-index:1000;animation:fadeIn .2s ease-out}.loading,.tooltip{pointer-events:none}.loading{opacity:.6}.spinner{width:20px;height:20px;border:2px solid var(--border-color);border-top-color:var(--gradient-start);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}.speech-error{display:flex;align-items:center;gap:8px;padding:12px 16px;margin:16px;background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.3);border-radius:8px;color:#ef4444;font-size:14px}.speech-error svg{flex-shrink:0}.listening-status{display:flex;align-items:center;gap:8px}.listening-dot{width:8px;height:8px;background:#ef4444;border-radius:50%;animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.2)}}input[type=checkbox]{width:16px;height:16px;margin-right:8px;cursor:pointer}.setting-item label{display:flex;align-items:center;cursor:pointer}.setting-item label:has(input[type=checkbox]){font-size:14px;color:var(--text-primary);margin-bottom:0}