/* Runtime Conf 2027 — design tokens (hand-maintained; the Labra originals were generated from tokens.json).
   Fonts: exactly two families, both SIL OFL (licences next to the files in assets/fonts/):
     Michroma (one weight, 400) — display/headlines, names, wordmark, nav, logo, buttons, section index (.idx), .tag,
                                  footer column heads, menu.
     Poppins 400/500/600        — everything else (body, leads, labels, captions, meta, tables, lists, chips, forms, FAQ).
   Michroma's € looks like a 0, so U+20AC and % are cut out of its unicode-range and fall back to Poppins.
   Neither family has arrows: "Runtime Arrows" (5 drawn glyphs, ← ↑ → ↓ ↗) sits next in every stack.

   CLEAN VALUES: every font size, line height and spacing value computes to a whole px number.
     type scale    12, 14, 16, 18, 20, 24, 28, 32, 40, 48, 56, 64, 72, 80, 96, 112, 128, 144, 160, 176, 192, 224, 256, 288  (--fs-N)
     spacing scale 4, 8, 12, 16, 20, 24, 28, 32, 40, 48, 56, 64, 72, 80, 88, 96, 112, 120, 128, 144, 160  (--sp-N, a 4px grid)
     breakpoints   desktop >= 1200 · laptop 901-1199 · tablet 600-900 · phone <= 599 (the layout switch stays at 900px)
   Stepped sizes (--fs-display … and --fs-<phone>-<desktop>) take one value from the scale per breakpoint — no clamp()/vw.
   Line heights: rules set a ratio in --lh; site.css rounds ratio x font-size to whole px for every element. */
@font-face { font-family: 'Michroma'; font-weight: 400; font-style: normal; font-display: block; src: url('assets/fonts/Michroma-Regular.woff2') format('woff2');
  unicode-range: U+0000-0024, U+0026-20AB, U+20AD-FFFF; }
@font-face { font-family: 'Poppins'; font-weight: 400; font-style: normal; font-display: block; src: url('assets/fonts/Poppins-Regular.woff2') format('woff2'); }
@font-face { font-family: 'Poppins'; font-weight: 500; font-style: normal; font-display: block; src: url('assets/fonts/Poppins-Medium.woff2') format('woff2'); }
@font-face { font-family: 'Poppins'; font-weight: 600; font-style: normal; font-display: block; src: url('assets/fonts/Poppins-SemiBold.woff2') format('woff2'); }
@font-face { font-family: 'Runtime Arrows'; font-weight: 400; font-style: normal; font-display: block; src: url('assets/fonts/RuntimeArrows.woff2') format('woff2');
  unicode-range: U+2190-2197; }
:root {
  --color-bg: #060606;
  --color-surface: #0F0F10;
  --color-surface-2: #18181A;
  --color-line: rgba(237,237,237,0.18);
  --color-line-strong: rgba(237,237,237,0.42);
  --color-text: #EDEDED;
  --color-muted: #8D8D8D;
  --color-dim: #5C5C5C;
  --color-acid: #C8FF3D;
  --color-acid-ink: #060606;
  --color-bar: #2A2A2A;
  --font-display: 'Michroma', 'Poppins', 'Runtime Arrows', sans-serif;
  --font-sans: 'Poppins', 'Runtime Arrows', sans-serif;
  --radius-none: 0px;
  --radius-sm: 2px;
  --tracking-display: -0.02em;
  --tracking-heading: 0px;
  --tracking-label: 1px;
  /* type scale */
  --fs-12: 12px; --fs-14: 14px; --fs-16: 16px; --fs-18: 18px; --fs-20: 20px; --fs-24: 24px; --fs-28: 28px; --fs-32: 32px; --fs-40: 40px; --fs-48: 48px; --fs-56: 56px; --fs-64: 64px;
  --fs-72: 72px; --fs-80: 80px; --fs-96: 96px; --fs-112: 112px; --fs-128: 128px; --fs-144: 144px; --fs-160: 160px; --fs-176: 176px; --fs-192: 192px; --fs-224: 224px; --fs-256: 256px; --fs-288: 288px;
  /* spacing scale (4px grid) */
  --sp-4: 4px; --sp-8: 8px; --sp-12: 12px; --sp-16: 16px; --sp-20: 20px; --sp-24: 24px; --sp-28: 28px; --sp-32: 32px; --sp-40: 40px; --sp-48: 48px; --sp-56: 56px; --sp-64: 64px;
  --sp-72: 72px; --sp-80: 80px; --sp-88: 88px; --sp-96: 96px; --sp-112: 112px; --sp-120: 120px; --sp-128: 128px; --sp-144: 144px; --sp-160: 160px;
  --lh: 1.5;
  /* desktop (>= 1200px) */
  --gut: 64px;
  --sec-pad: 120px;
  --fs-display: 160px;
  --fs-h1: 144px;
  --fs-h2: 96px;
  --fs-h3: 28px;
  --fs-h4: 18px;
  --fs-num: 96px;
  --fs-title-l: 96px;
  --fs-title-m: 72px;
  --fs-title-s: 56px;
  --fs-wordmark: 144px;
  --fs-side: 56px;
  --fs-side-s: 48px;
  --fs-row: 24px;
  --fs-author: 56px;
  --fs-author-long: 48px;
  --fs-name-long: 144px;
  --fs-mail: 24px;
  --tracking-nav: 2px;
  /* stepped sizes --fs-<phone>-<desktop>: one whole-px value per breakpoint */
  --fs-14-16: 16px; --fs-16-18: 18px; --fs-16-24: 24px; --fs-18-20: 20px; --fs-18-24: 24px; --fs-20-24: 24px;
  --fs-20-28: 28px; --fs-20-32: 32px; --fs-24-28: 28px; --fs-24-32: 32px; --fs-24-40: 40px; --fs-24-48: 48px;
  --fs-24-64: 64px; --fs-28-40: 40px; --fs-28-48: 48px; --fs-28-72: 72px; --fs-32-48: 48px; --fs-32-64: 64px;
  --fs-32-72: 72px; --fs-32-80: 80px; --fs-32-128: 128px; --fs-40-48: 48px; --fs-40-56: 56px; --fs-40-64: 64px;
  --fs-40-72: 72px; --fs-40-80: 80px; --fs-40-96: 96px; --fs-40-112: 112px; --fs-40-128: 128px; --fs-40-144: 144px;
  --fs-48-72: 72px; --fs-48-96: 96px; --fs-48-128: 128px; --fs-56-80: 80px; --fs-56-96: 96px; --fs-56-176: 176px;
  --fs-80-128: 128px; --fs-80-160: 160px; --fs-80-288: 288px; --fs-96-192: 192px; --fs-96-224: 224px;
}
@media (max-width: 1199px) { /* laptop (901-1199px) */
:root {
  --gut: 48px;
  --sec-pad: 96px;
  --fs-display: 112px;
  --fs-h1: 80px;
  --fs-h2: 56px;
  --fs-h3: 20px;
  --fs-h4: 18px;
  --fs-num: 56px;
  --fs-title-l: 64px;
  --fs-title-m: 48px;
  --fs-title-s: 40px;
  --fs-wordmark: 96px;
  --fs-side: 40px;
  --fs-side-s: 32px;
  --fs-row: 20px;
  --fs-author: 40px;
  --fs-author-long: 32px;
  --fs-name-long: 96px;
  --fs-mail: 16px;
  --tracking-nav: 1px;
  /* stepped sizes --fs-<phone>-<desktop>: one whole-px value per breakpoint */
  --fs-14-16: 14px; --fs-16-18: 16px; --fs-16-24: 18px; --fs-18-20: 18px; --fs-18-24: 18px; --fs-20-24: 20px;
  --fs-20-28: 20px; --fs-20-32: 24px; --fs-24-28: 24px; --fs-24-32: 24px; --fs-24-40: 28px; --fs-24-48: 32px;
  --fs-24-64: 64px; --fs-28-40: 32px; --fs-28-48: 32px; --fs-28-72: 56px; --fs-32-48: 32px; --fs-32-64: 48px;
  --fs-32-72: 48px; --fs-32-80: 80px; --fs-32-128: 96px; --fs-40-48: 40px; --fs-40-56: 48px; --fs-40-64: 48px;
  --fs-40-72: 56px; --fs-40-80: 56px; --fs-40-96: 72px; --fs-40-112: 96px; --fs-40-128: 96px; --fs-40-144: 112px;
  --fs-48-72: 48px; --fs-48-96: 64px; --fs-48-128: 96px; --fs-56-80: 64px; --fs-56-96: 72px; --fs-56-176: 144px;
  --fs-80-128: 96px; --fs-80-160: 112px; --fs-80-288: 192px; --fs-96-192: 144px; --fs-96-224: 160px;
}
}
@media (max-width: 900px) { /* tablet (600-900px) */
:root {
  --gut: 32px;
  --sec-pad: 88px;
  --fs-display: 96px;
  --fs-h1: 80px;
  --fs-h2: 64px;
  --fs-h3: 24px;
  --fs-h4: 18px;
  --fs-num: 56px;
  --fs-title-l: 72px;
  --fs-title-m: 56px;
  --fs-title-s: 40px;
  --fs-wordmark: 80px;
  --fs-side: 40px;
  --fs-side-s: 40px;
  --fs-row: 20px;
  --fs-author: 40px;
  --fs-author-long: 32px;
  --fs-name-long: 64px;
  --fs-mail: 24px;
  --tracking-nav: 2px;
  /* stepped sizes --fs-<phone>-<desktop>: one whole-px value per breakpoint */
  --fs-14-16: 14px; --fs-16-18: 16px; --fs-16-24: 16px; --fs-18-20: 18px; --fs-18-24: 18px; --fs-20-24: 20px;
  --fs-20-28: 20px; --fs-20-32: 20px; --fs-24-28: 24px; --fs-24-32: 24px; --fs-24-40: 24px; --fs-24-48: 28px;
  --fs-24-64: 48px; --fs-28-40: 28px; --fs-28-48: 28px; --fs-28-72: 40px; --fs-32-48: 32px; --fs-32-64: 32px;
  --fs-32-72: 40px; --fs-32-80: 64px; --fs-32-128: 72px; --fs-40-48: 40px; --fs-40-56: 40px; --fs-40-64: 40px;
  --fs-40-72: 40px; --fs-40-80: 40px; --fs-40-96: 56px; --fs-40-112: 72px; --fs-40-128: 72px; --fs-40-144: 80px;
  --fs-48-72: 48px; --fs-48-96: 48px; --fs-48-128: 64px; --fs-56-80: 56px; --fs-56-96: 56px; --fs-56-176: 112px;
  --fs-80-128: 80px; --fs-80-160: 80px; --fs-80-288: 144px; --fs-96-192: 96px; --fs-96-224: 112px;
}
}
@media (max-width: 599px) { /* phone (<= 599px) */
:root {
  --gut: 16px;
  --sec-pad: 88px;
  --fs-display: 48px;
  --fs-h1: 40px;
  --fs-h2: 32px;
  --fs-h3: 24px;
  --fs-h4: 18px;
  --fs-num: 48px;
  --fs-title-l: 40px;
  --fs-title-m: 28px;
  --fs-title-s: 24px;
  --fs-wordmark: 40px;
  --fs-side: 32px;
  --fs-side-s: 32px;
  --fs-row: 20px;
  --fs-author: 40px;
  --fs-author-long: 32px;
  --fs-name-long: 32px;
  --fs-mail: 24px;
  --tracking-nav: 1px;
  /* stepped sizes --fs-<phone>-<desktop>: one whole-px value per breakpoint */
  --fs-14-16: 14px; --fs-16-18: 16px; --fs-16-24: 16px; --fs-18-20: 18px; --fs-18-24: 18px; --fs-20-24: 20px;
  --fs-20-28: 20px; --fs-20-32: 20px; --fs-24-28: 24px; --fs-24-32: 24px; --fs-24-40: 24px; --fs-24-48: 24px;
  --fs-24-64: 24px; --fs-28-40: 28px; --fs-28-48: 28px; --fs-28-72: 28px; --fs-32-48: 32px; --fs-32-64: 32px;
  --fs-32-72: 32px; --fs-32-80: 32px; --fs-32-128: 32px; --fs-40-48: 40px; --fs-40-56: 40px; --fs-40-64: 40px;
  --fs-40-72: 40px; --fs-40-80: 40px; --fs-40-96: 40px; --fs-40-112: 40px; --fs-40-128: 40px; --fs-40-144: 40px;
  --fs-48-72: 48px; --fs-48-96: 48px; --fs-48-128: 48px; --fs-56-80: 56px; --fs-56-96: 56px; --fs-56-176: 56px;
  --fs-80-128: 80px; --fs-80-160: 80px; --fs-80-288: 80px; --fs-96-192: 96px; --fs-96-224: 96px;
}
}
