.learn-speed { max-width: 960px; padding: clamp(20px, 3vw, 30px); margin-top: 28px; border: 1px solid var(--line); background: var(--surface); }
.learn-speed > p { margin: 0 0 24px; }
.learn-speed-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 28px; margin-bottom: 26px; }
.learn-speed-control { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: center; min-width: 0; }
.learn-speed-control:last-child { grid-column: 1 / -1; }
.learn-speed-label { font-size: 14px; color: var(--text-soft); }
.learn-speed-value { font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.learn-speed-control input { grid-column: 1 / -1; width: 100%; margin: 0; min-height: 28px; accent-color: var(--red); cursor: pointer; }
.learn-speed-section { margin-bottom: 26px; padding-top: 20px; border-top: 1px solid var(--line); }
.learn-speed-section h3 { font: 600 21px/1.3 var(--font-display); margin: 0 0 15px; }
.learn-speed-section p { margin: -5px 0 18px; }
.learn-speed-row { display: grid; grid-template-columns: 76px minmax(0, 1fr) 80px; gap: 12px; align-items: center; margin: 14px 0; font-size: 14px; font-variant-numeric: tabular-nums; }
.learn-speed-row output { text-align: right; font-size: 19px; font-weight: 600; white-space: nowrap; }
.learn-speed-track { min-width: 0; height: 12px; background: var(--surface-3); }
.learn-speed-bar { position: relative; height: 100%; background: var(--muted); }
.learn-speed-bar::after { content: ''; position: absolute; top: -3px; bottom: -3px; right: -1px; width: 2px; background: inherit; }
.learn-speed-bar.is-second { background: var(--red); }
.learn-speed-scale { display: flex; justify-content: space-between; font-size: 11px; color: var(--muted); border-top: 1px solid var(--line); padding-top: 4px; }
.learn-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (max-width: 700px) {
  .learn-speed-controls { grid-template-columns: minmax(0, 1fr); }
  .learn-speed-row { grid-template-columns: 66px minmax(0, 1fr) 66px; gap: 8px; }
  .learn-speed-row output { font-size: 17px; }
}