/* Accessibility layer for the v7 page.
   Kept separate so css/v7.css stays a verbatim copy of the approved prototype.
   Paired with js/a11y.js. */

/* The prototype ships no focus styling at all, so anything made focusable here
   needs a visible ring. Cobalt on cream, blue-soft on the navy dial section. */
.dial-card:focus-visible {
  outline: 2px solid var(--blue-soft);
  outline-offset: 3px;
}
.tscroll:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 2px;
}
.dial-grid.hoverable .dial-card {
  /* a focusable card should look interactive to a pointer user too */
  cursor: pointer;
}