/*
 * Typesetting defaults every page shares (since 2026-11-11). The rules and their sources are in docs/typography.md.
 * They change how text breaks and how numbers sit. Since 2026-11-11 they also hold the one type scale (scale C, fluid
 * from 390 to 1300 px wide); before that each page set its own sizes. Display words in Genoid stay outside it.
 */
:root {
  --ui-title: clamp(33px, 26px + 2.2vw, 56px);
  --ui-h2: clamp(27px, 22px + 1.4vw, 42px);
  --ui-h3: clamp(19px, 17px + 0.6vw, 25px);
  --ui-lead: clamp(18px, 16px + 0.6vw, 22px);
  --ui-text: clamp(16px, 15px + 0.25vw, 18px);
  /* Labels, captions and help text: never sentences of body copy. Dense tool panels keep their 10.5 to 12 px labels. */
  --ui-small: 13px;
  /* Headings (since 2026-11-11): one weight, so size and tracking carry the order; tracking closes as size grows. */
  --ui-heading: 600;
  --ui-track-title: -0.02em;
  --ui-track-h2: -0.015em;
  --ui-track-h3: -0.01em;
  /* Rules are felt more than seen: a hairline of ink at 10%. */
  --ui-hairline: color-mix(in oklab, #0b0a12 10%, transparent);
  /* Spacing on an 8px scale; vertical rhythm takes its steps from here. */
  --ui-space-1: 8px;
  --ui-space-2: 16px;
  --ui-space-3: 24px;
  --ui-space-4: 40px;
  --ui-space-5: 64px;
  --ui-space-6: 96px;
  /* A missing weight or italic is never faked (rule 10). */
  font-synthesis: none;
}
/* Headings break into even lines; prose avoids a lone word on its last line (rules 4 and 7). */
h1,
h2,
h3,
h4 {
  text-wrap: balance;
}
p,
li,
dd,
figcaption,
blockquote {
  text-wrap: pretty;
}
/* Links are underlined thin and clear of descenders (rule 8). */
a {
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
}
/* Numbers that change in place keep their width (rule 5). Geist and Public Sans digits are proportional by default. */
output,
meter,
progress,
.num {
  font-variant-numeric: tabular-nums;
}
/* Case policy 3 (since 2026-11-11): headings, navigation, buttons and labels are lowercase; prose keeps its case so
   names and acronyms read right. Code keeps its case because it has to run. */
h1,
h2,
h3,
h4,
nav,
button,
.button,
label,
legend,
summary {
  text-transform: lowercase;
}
:is(h1, h2, h3, h4, nav, button, .button, label, legend, summary) :is(code, kbd, samp) {
  text-transform: none;
}
