@import "./tokens.css";
@import "./components.css";

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; } }
body { margin: 0; background: var(--color-surface); color: var(--color-ink); font: 400 var(--text-base)/var(--leading-body) var(--font-body); -webkit-font-smoothing: antialiased; }
/* Headings: h1-h4 Unbounded, h5-h6 Instrument Sans. All weight 600. */
h1, h2, h3, h4, h5, h6 { margin: 0; font-weight: 600; line-height: var(--leading-tight); }
h1, h2, h3, h4 { font-family: var(--font-display); letter-spacing: -0.01em; }
h5, h6 { font-family: var(--font-body); line-height: 1.35; }
h1 { font-size: var(--text-h1); }
h2 { font-size: var(--text-h2); }
h3 { font-size: var(--text-h3); }
h4 { font-size: var(--text-h4); line-height: 1.3; }
h5 { font-size: var(--text-h5); }
h6 { font-size: var(--text-h6); letter-spacing: .01em; }
p, ul, ol, dl, figure { margin: 0; }
a { color: inherit; }
img, svg { display: block; max-width: 100%; }
:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 2px; }
.on-night :focus-visible { outline-color: var(--color-night-accent); }
[id] { scroll-margin-top: 72px; }
.wrap { width: var(--wrap); margin-inline: auto; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: -9999px; top: 8px; z-index: 50; background: var(--color-ink); color: var(--color-surface); padding: var(--space-2) var(--space-3); }
.skip:focus { left: var(--space-2); }
.muted { color: var(--color-muted); }
.on-night .muted { color: var(--color-on-night-muted); }