@font-face { font-family: "Archivo"; font-style: normal; font-display: swap; font-weight: 100 900; font-stretch: 62% 125%; src: url("../fonts/archivo-latin-ext-standard-normal.woff2") format("woff2-variations"), url("../fonts/archivo-latin-ext-standard-normal.woff2") format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Archivo"; font-style: normal; font-display: swap; font-weight: 100 900; font-stretch: 62% 125%; src: url("../fonts/archivo-latin-standard-normal.woff2") format("woff2-variations"), url("../fonts/archivo-latin-standard-normal.woff2") format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }

/* Secondary pages (privacy, thanks, 404): same stage and type family as the home page, set for long reading. */
:root {
  --ink: #070707;
  --fg: #f1f1ee;
  --read: #d3d3ce;
  --mute: #8d8d88;
  --dim: #55554f;
  --line: rgba(241, 241, 238, 0.14);
  --font-display: "Archivo", "Archivo Variable", "Helvetica Neue", Arial, sans-serif;
  --font-body: "Archivo", "Archivo Variable", "Helvetica Neue", Arial, sans-serif;
  color-scheme: dark;
}
*, *::before, *::after { box-sizing: border-box; }
html { background: var(--ink); -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--ink); color: var(--fg);
  font-family: var(--font-body); font-size: 1.0625rem; line-height: 1.65;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
::selection { background: var(--fg); color: var(--ink); }
a { color: inherit; }
:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.top {
  display: flex; justify-content: space-between; align-items: center; gap: 16px;
  max-width: 1432px; margin: 0 auto;
  padding: calc(env(safe-area-inset-top, 0px) + 18px) max(24px, env(safe-area-inset-right, 0px)) 0 max(24px, env(safe-area-inset-left, 0px));
}
.top svg { width: 74px; height: auto; fill: var(--fg); display: block; }
.top a.back { font-size: 0.9375rem; font-weight: 520; text-decoration: none; color: var(--mute); transition: color 0.3s; }
.top a.back:hover { color: var(--fg); }
.doc {
  max-width: 760px; margin: 0 auto;
  padding: clamp(72px, 12vw, 140px) max(24px, env(safe-area-inset-right, 0px)) clamp(80px, 12vw, 140px) max(24px, env(safe-area-inset-left, 0px));
}
.label { font-size: 0.9375rem; color: var(--mute); margin: 0 0 14px; }
.doc h1 {
  margin: 0 0 18px; font-family: var(--font-display); font-weight: 640; font-stretch: 116%;
  font-size: clamp(2.4rem, 6vw, 4.2rem); line-height: 0.98; letter-spacing: -0.035em; text-wrap: balance;
}
.doc .intro { font-size: 1.2rem; line-height: 1.5; color: var(--read); margin: 0 0 8px; }
.doc h2 {
  margin: 56px 0 12px; padding-top: 18px; border-top: 1px solid var(--line);
  font-family: var(--font-display); font-weight: 620; font-stretch: 110%; font-size: 1.35rem; letter-spacing: -0.015em;
}
.doc h2 span { font-weight: 500; color: var(--mute); margin-right: 12px; font-variant-numeric: tabular-nums; }
.doc p, .doc li { color: var(--read); max-width: 64ch; }
.doc ul { padding-left: 1.1em; }
.doc li { margin-bottom: 6px; }
.doc li::marker { color: var(--dim); }
.doc a { text-decoration: underline; text-underline-offset: 3px; }
.doc strong { color: var(--fg); font-weight: 600; }
.todo { background: rgba(241, 241, 238, 0.12); color: var(--fg); padding: 0 0.3em; }
.end { margin-top: 64px; padding-top: 18px; border-top: 1px solid var(--line); font-size: 0.9375rem; color: var(--mute); display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.btn {
  display: inline-flex; align-items: center; height: 54px; padding: 0 24px; margin-top: 28px;
  background: var(--fg); color: var(--ink); text-decoration: none !important;
  font-size: 1rem; font-weight: 580;
}