/* Modern CSS reset — small, opinionated. */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }

/* Lock the root font-size at 16px so 1rem === 16px,
   which keeps iOS Safari from auto-zooming on focused inputs. */
html { font-size: 100%; }

html, body { height: 100%; }

/* Defensive: clip any rogue child that's wider than the viewport.
   `clip` (not `hidden`) keeps position:sticky on descendants working. */
html { overflow-x: clip; }
body { overflow-x: clip; min-height: 100%; }

body { line-height: 1.55; -webkit-font-smoothing: antialiased; }

img, picture, video, canvas, svg {
    display: block;
    max-width: 100%;
    height: auto;
}

input, button, textarea, select { font: inherit; color: inherit; }
/* Hard cap on form-control widths — they can't blow out their containers. */
input, textarea, select { max-width: 100%; }

/* Long URLs / tokens shouldn't push a column wider than the viewport. */
p, li, td, h1, h2, h3, h4, h5, h6 { overflow-wrap: break-word; word-wrap: break-word; }
a { word-break: break-word; }

/* Fieldset has a peculiar `min-width: min-content` that defeats responsive shrink — reset it. */
fieldset { min-width: 0; border: 0; padding: 0; margin: 0; }
legend { padding: 0; }

button { cursor: pointer; background: none; border: 0; padding: 0; }
a { color: inherit; }
ul { padding: 0; list-style: none; }
:focus-visible { outline: 2px solid var(--c-accent); outline-offset: 2px; }
[hidden] { display: none !important; }
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; }
}
