/* Site styles. Kept in a file (no inline <style> or style="") so the
   Content-Security-Policy can forbid inline code entirely. */

.pre-wrap { white-space: pre-wrap; }

/* --- Speed drills --- */
.drill-question { font-size: clamp(3rem, 12vw, 5.5rem); font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1.1; }
.drill-input { font-size: clamp(2rem, 8vw, 3.5rem); max-width: 9rem; text-align: center; font-variant-numeric: tabular-nums; }
.drill-keypad { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; max-width: 18rem; margin: 0 auto; }
.drill-keypad button { font-size: 1.6rem; padding: .6rem 0; }
.drill-timer { font-variant-numeric: tabular-nums; }
.drill-progress { height: 6px; }
.drill-feedback { min-height: 2rem; }
.drill-mistakes { max-width: 22rem; }

.flash-ok { animation: flash-ok .25s; }
.flash-bad { animation: flash-bad .4s; }
@keyframes flash-ok { from { background: rgba(25, 135, 84, .45); } }
@keyframes flash-bad { from { background: rgba(220, 53, 69, .45); } }
@media (prefers-reduced-motion: reduce) { .flash-ok, .flash-bad { animation: none; } }