/* a11y.css — additive styles that won't break layout */
:root {
  --focus-ring: 2px;
  --focus-color: #00c2ff; /* visible on dark backgrounds */
}
/* Respect user's reduced motion preference */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; }
}

/* Strong, visible focus indicator */
:where(a, button, [role="button"], input, select, textarea, summary, [tabindex])\:focus,
:where(a, button, [role="button"], input, select, textarea, summary, [tabindex]):focus-visible {
  outline: var(--focus-ring) solid var(--focus-color);
  outline-offset: 3px;
  box-shadow: 0 0 0 calc(var(--focus-ring) + 1px) rgba(0,0,0,0.3);
}

/* Improve link hit targets */
a { text-underline-offset: 0.15em; }
a:focus-visible { text-decoration-thickness: 0.2em; }

/* Utility for visually-hidden but accessible text */
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,1px,1px); white-space: nowrap; border: 0; }