/* ============================================================================
   VOID HORIZON — shared minimal base for the web/*.html tool pages (web-design-pass)

   Loaded right after site-nav.css on every tool page. Deliberately tiny and
   low-specificity (:where) so each page's own styles still win; it only fills
   the accessibility gaps the audit found on every page (docs/web-design-pass/audit.md):

   - dark colour scheme for native UI (every tool page is dark-designed;
     modern-web-guidance: dark-mode — pages also carry the color-scheme meta)
   - a visible :focus-visible ring on every control (no page styled one)
   - ≥24px hit targets for nav/footer links and checkboxes (WCAG 2.5.8)
   - media and form controls never force horizontal page scroll, and wide data
     tables scroll inside themselves on narrow screens instead of the page
   ========================================================================== */
:root { color-scheme: dark; }

:where(a, button, summary, select, input, textarea, [tabindex]):focus-visible {
  outline: 2px solid #5fd4f5; outline-offset: 2px;
}

/* Inline padding grows the hit area without moving surrounding text. */
:where(nav, footer, header) :where(a) { padding-block: 5px; min-height: 24px; }
:where(summary) { min-height: 24px; }
:where(input[type="checkbox"], input[type="radio"]) { width: 20px; height: 20px; }

:where(img, video, canvas, iframe, select, input, textarea, model-viewer) { max-width: 100%; }

@media (max-width: 760px) {
  :where(table) { display: block; max-width: 100%; overflow-x: auto; }
}
