* { box-sizing: border-box; }
html { color-scheme: light; overflow-y: scroll; }
body { margin: 0; background: var(--paper) url('../images/paper.svg'); color: var(--ink); font-family: var(--serif); font-size: 18px; line-height: 1.5; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
button, a, input, textarea { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
img { display: block; max-width: 100%; height: auto; }
h1, h2, h3, p, figure { margin: 0; }
h1, h2, h3 { font-family: var(--serif); font-weight: 700; line-height: 1.2; color: var(--accent); }
h1 { font-size: var(--heading-size); letter-spacing: -.035em; }
button:disabled { cursor: wait; opacity: .65; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
[hidden] { display: none !important; }
::selection { color: var(--paper); background: var(--accent); }
.shell { width: min(var(--content-width), calc(100% - 120px)); margin-inline: auto; }
.eyebrow { font-family: var(--sans); font-size: .68rem; font-weight: 600; letter-spacing: .14em; line-height: 1.5; }
.accent { color: var(--accent); }
.skip-link { position: absolute; left: 1rem; top: -100px; background: var(--paper); padding: 1rem; z-index: 2; }
.skip-link:focus { top: 0; }
@media (max-width: 600px) { .shell { width: calc(100% - 36px); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; } }
