/* Modern CSS reset — a small, stable baseline. See note at bottom. */

*,
*::before,
*::after {
    box-sizing: border-box;
}

* {
    margin: 0;
}

html {
    -webkit-text-size-adjust: 100%;
}

body {
    min-height: 100dvh; /* dvh accounts for the mobile address bar */
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}

/* Block-level media + never overflow their container */
img,
picture,
svg,
video,
canvas {
    display: block;
    max-width: 100%;
}

/* Form controls inherit your fonts instead of the OS default */
input,
button,
textarea,
select {
    font: inherit;
}

/* Avoid long words breaking layout; nicer headline wrapping */
p,
h1,
h2,
h3,
h4 {
    overflow-wrap: break-word;
}

h1,
h2,
h3,
h4 {
    text-wrap: balance;
}

/* Respect users who ask for less motion (disables scroll/gradient effects) */
@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;
    }
}

/*
 * Self-maintained on purpose: this targets stable, evergreen browser
 * defaults (not browser bugs), so it rarely needs changes. Review against
 * a current "modern CSS reset" reference ~once a year and add niceties.
 */