/* Minimal element defaults. Components carry their own styling. */
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--surface-page);color:var(--text-body);font:var(--text-style-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4,h5,h6{margin:0;color:var(--text-heading);text-wrap:balance}
h1{font:var(--text-style-h1);letter-spacing:var(--ls-display)}
h2{font:var(--text-style-h2);letter-spacing:var(--ls-heading)}
h3{font:var(--text-style-h3)}
p{margin:0 0 var(--gap-stack);text-wrap:pretty;max-width:var(--measure-prose)}
a{color:var(--text-link);text-decoration:none;border-bottom:1px solid var(--js-deep-ocean-40);transition:var(--transition-color)}
a:hover{color:var(--text-link-hover);border-bottom-color:var(--js-ocean-blue)}
a:focus-visible{outline:none;box-shadow:var(--shadow-focus);border-radius:var(--radius-xs)}
img,video{max-width:100%;display:block}
hr{border:none;border-top:1px solid var(--border-hairline);margin:var(--space-12) 0}
::selection{background:var(--js-warm-cream);color:var(--js-deep-charcoal)}