/* The plain pages (privacy, terms, 404): About's tokens and rhythm, words only. */
:root {
  --ground: #0B0907; --bone: #D9CFBE; --lantern: #E9C493;
  --mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --fs-mark: clamp(28px, 3.6vw, 56px); --fs-line: clamp(14px, 1.3vw, 19px); --fs-label: clamp(12px, 0.95vw, 14px);
  --gap: clamp(16px, 3.6vw, 56px); --track: 0.22em;
  color-scheme: dark;
}
*, *::before, *::after { box-sizing: border-box; }
html, body { background: var(--ground); color: var(--bone); }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; font-family: var(--mono); font-weight: 300; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 3px; }
a:hover { border-bottom-color: var(--lantern); }
a:focus-visible { outline: 1px solid var(--bone); outline-offset: 6px; }
.label, h2 { margin: 0; font-size: var(--fs-label); font-weight: 400; letter-spacing: var(--track); line-height: 1.7; text-transform: uppercase; }
.top { display: flex; justify-content: space-between; align-items: start; gap: 24px; padding: var(--gap) max(var(--gap), env(safe-area-inset-right, 0px)) 0 max(var(--gap), env(safe-area-inset-left, 0px)); }
.top a { border: 0; }
.top .mark span { display: block; }
main { max-width: calc(760px + 2 * var(--gap)); margin: 0 auto; padding: clamp(72px, 14vh, 160px) var(--gap) clamp(88px, 15vh, 168px); }
h1 { margin: 0 0 18px; font-size: var(--fs-mark); font-weight: 300; letter-spacing: 0.14em; line-height: 1.3; text-transform: uppercase; text-wrap: balance; }
h2 { margin: 56px 0 14px; }
p, li { font-size: var(--fs-line); line-height: 1.85; letter-spacing: 0.02em; max-width: 60ch; text-wrap: pretty; }
p { margin: 0 0 16px; }
ul { margin: 0 0 16px; padding: 0; list-style: none; }
li { padding-left: 1.6em; text-indent: -1.6em; }
li::before { content: "–"; display: inline-block; width: 1.6em; text-indent: 0; }   /* a hairline dash, never a dot */
.foot { display: flex; flex-wrap: wrap; gap: 8px 0.9em; padding: 0 var(--gap) max(var(--gap), env(safe-area-inset-bottom, 0px)); }
@media (pointer: coarse) { a { position: relative; } a::after { content: ""; position: absolute; inset: -14px -6px; } }
p.label { margin-bottom: 32px; }