/* Voice to Text Counter Styles */
.stats-bar { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-4); }
.stat { text-align: center; padding: var(--space-4); }
.stat-value { font-size: var(--text-2xl); font-weight: 800; font-family: var(--font-mono); }
.stat-label { font-size: var(--text-xs); color: var(--color-text-muted); text-transform: uppercase; letter-spacing: 0.1em; }
.record-btn { font-size: var(--text-lg) !important; padding: var(--space-4) var(--space-8) !important; text-transform: none !important; }
.rec-dot { display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: #d63031; margin-right: 8px; }
.rec-dot.active { animation: pulse 0.8s infinite; }
.transcript { min-height: 200px; padding: var(--space-4); background: var(--color-surface); border-radius: var(--radius-md); line-height: 1.8; font-size: var(--text-base); color: var(--color-text); border: 1px solid var(--color-border); }
.transcript .filler { background: rgba(225,112,85,0.2); color: var(--color-error); border-radius: 3px; padding: 0 2px; font-weight: 600; }
.filler-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: var(--space-3); }
.filler-chip { display: flex; justify-content: space-between; padding: var(--space-2) var(--space-3); background: var(--color-surface); border-radius: var(--radius-sm); font-size: var(--text-sm); border: 1px solid var(--color-border); }
.filler-chip .word { font-weight: 600; }
.filler-chip .count { color: var(--color-error); font-family: var(--font-mono); font-weight: 700; }
@media (max-width: 768px) { .stats-bar { grid-template-columns: repeat(2, 1fr); } }
