/* Audio Recorder Card */
#recorderSection{padding:0 28px 24px}
#transcribeSection{padding:0 28px 24px}
.recorder-card{background:#fff; border:1px solid var(--border); border-radius:28px; box-shadow:0 10px 30px rgba(2,6,23,0.06); padding:28px}
.recorder-label{letter-spacing:.22em; font-size:11px; color:#cbd5e1; text-align:center; margin-bottom:16px}
.recorder-controls{display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap}
.rec-btn{display:inline-flex; align-items:center; gap:8px; padding:12px 20px; border-radius:14px; border:1px solid var(--border); background:#fff; color:var(--text); cursor:pointer; font-size:15px; font-weight:700; box-shadow:var(--shadow); transition:background .18s ease, box-shadow .18s ease, transform .08s ease, border-color .18s ease}
.rec-btn:hover{transform:translateY(-1px)}
.rec-btn:disabled{opacity:0.5; cursor:not-allowed; transform:none}
.rec-btn-label{white-space:nowrap}
.rec-start{background:var(--accent); border-color:var(--accent-2); color:#fff}
.rec-start:hover{background:var(--accent-2)}
.rec-stop{background:#dc2626; border-color:#b91c1c; color:#fff}
.rec-stop:hover{background:#b91c1c}
.rec-pause{background:#f5f3ff; border-color:#ede9fe; color:var(--accent)}
.rec-pause:hover{background:#ede9fe}
.rec-pause.is-paused{background:#fef3c7; border-color:#fde68a; color:#92400e}
.rec-download{background:#f5f3ff; border-color:#ede9fe; color:var(--accent)}
.rec-download:hover{background:#ede9fe}
.rec-transcribe{background:#e0f2fe; border-color:#bae6fd; color:#075985}
.rec-transcribe:hover{background:#bae6fd}
.rec-discard{background:#fff; border-color:var(--border); color:#9aa3b2}
.rec-discard:hover{color:#ef4444; background:#fee2e2; border-color:#fecaca}
.rec-status{display:flex; align-items:center; justify-content:center; gap:10px; margin-top:16px; padding:10px 0}
.rec-dot{width:10px; height:10px; border-radius:50%; background:#ef4444; animation:recPulse 1.2s ease-in-out infinite}
.rec-status.is-paused .rec-dot{animation:none; background:#f59e0b}
@keyframes recPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.85)}}
.rec-timer{font-size:18px; font-weight:700; font-variant-numeric:tabular-nums; color:var(--text)}
.rec-state-label{font-size:13px; font-weight:600; color:#ef4444; text-transform:uppercase; letter-spacing:.08em}
.rec-status.is-paused .rec-state-label{color:#f59e0b}
.rec-result{display:flex; align-items:center; gap:12px; margin-top:16px; flex-wrap:wrap}
.rec-result audio{flex:1; min-width:200px; height:40px; border-radius:12px}
.rec-transcribe-status{width:100%; font-size:13px; color:#64748b; margin-top:4px}

#fileUploadSection .drop-area{display:flex; align-items:center; gap:12px; border:2px dashed #cbd5e1; background:#f8fafc; color:#334155; border-radius:14px; padding:16px; cursor:pointer}
#fileUploadSection .drop-area:hover{background:#f1f5f9}
#fileUploadSection .drop-icon{font-size:18px}
#fileUploadSection .drop-title{font-weight:700}
#fileUploadSection .drop-hint{font-size:12px}

#transcriptArea{
  resize:none;
  min-height:0;
  width:100%;
  border-radius:14px;
  background:transparent;
  color:#334155;
  border:0;
  outline:none;
  padding:16px;
  line-height:1.8;
  font-size:16px;
  overflow:hidden;
}
#transcriptArea::placeholder{color:#64748b}