.rx-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
.rx-pad{--pad:#2f6fb3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;width:100%;min-height:320px;padding:24px;border-radius:16px;background:var(--pad);color:#fff;text-align:center;touch-action:manipulation;user-select:none;-webkit-user-select:none;transition:background-color .12s}
.rx-pad strong{font-size:clamp(30px,6vw,48px);font-weight:800;letter-spacing:-1px}
.rx-pad span{max-width:440px;font-size:15px;line-height:1.6;opacity:.92}
.rx-pad[data-state="waiting"]{--pad:#b0302a}
/* No transition into green: the colour must change in the frame that is timed. */
.rx-pad[data-state="go"]{--pad:#1f9d55;transition:none}
.rx-pad[data-state="early"]{--pad:#c77d14}
.rx-pad[data-state="shown"],.rx-pad[data-state="done"]{--pad:#3e4a57}
.rx-pad:focus-visible{outline:4px solid var(--accent);outline-offset:4px}
.rx-rounds{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.rx-rounds li{padding:8px 4px;border:1px dashed var(--border);border-radius:10px;text-align:center;font:600 13px var(--mono);color:var(--muted)}
.rx-rounds li.done{border-style:solid;background:var(--paper);color:var(--ink)}
.rx-rating{font-weight:700;font-size:16px}
.rx-bands{list-style:none;margin:12px 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.rx-bands li{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:10px;background:var(--paper);border:1px solid var(--border)}
.rx-bands strong{font:700 14px var(--mono)}
.rx-bands span{font-size:13px;color:var(--muted)}

@media(max-width:720px){
  .rx-pad{min-height:260px}
  .rx-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .rx-rounds li{font-size:11px}
  .rx-bands{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(prefers-reduced-motion:reduce){.rx-pad{transition:none}}