/* Shared accessibility baseline — linked by every app page after its own
   <style>, so it only adds what the pages lack. UI audit 2026-10-14:
   - visible keyboard focus (WCAG 2.4.7), retunable per theme via --focus-ring
   - reduced motion for users who ask the OS for it
   - phone-size controls (44px) only on touch screens; desktop stays dense
   - inline SVG icon sizing (shared/icons.js) */

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

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* !important: page rules size buttons for a mouse (e.g. .btn { min-height: 40px });
   on a touch screen the 44px minimum has to win. */
@media (pointer: coarse) {
  :is(button, .btn, a.btn, select, nav a,
      input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden])) {
    min-height: 44px !important;
  }
  input[type=checkbox], input[type=radio] { width: 22px; height: 22px; }
}

.ic-svg {
  width: 1.15em; height: 1.15em;
  flex-shrink: 0;
  vertical-align: -0.2em;
  stroke: currentColor; fill: none;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}

.sr-only {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0);
  white-space: nowrap; border: 0;
}