:root{
  --space-0:0;
  --space-px:1px;
  --space-1:0.25rem;
  --space-2:0.5rem;
  --space-3:0.75rem;
  --space-4:1rem;
  --space-5:1.25rem;
  --space-6:1.5rem;
  --space-7:1.75rem;
  --space-8:2rem;
  --space-10:2.5rem;
  --space-12:3rem;
  --space-14:3.5rem;
  --space-16:4rem;
  --space-20:5rem;
  --space-24:6rem;
  --space-32:8rem;

  /* Editorial flow — vertical rhythm inside an article body. */
  --flow-tight:0.5rem;
  --flow-para:1.1rem;
  --flow-block:2rem;
  --flow-section:3rem;
  --flow-major:4.5rem;

  /* Layout */
  --gutter:clamp(1rem,4vw,2.5rem); /* @kind spacing */
  --shell-max:82.5rem;
  --shell-article:43rem;
  --rail-width:15.5rem;
  --rail-wide:19rem;
  --sticky-offset:5.5rem;
  --card-gap:clamp(1rem,1.6vw,1.5rem);

  /* Radius. v2 rounds up — cards, images and media all carry real radius.
     Only table cells and hairline dividers stay square. */
  --radius-0:0;
  --radius-xs:4px;
  --radius-sm:8px;
  --radius-md:12px;
  --radius-lg:16px;
  --radius-xl:22px;
  --radius-2xl:28px;
  --radius-card:var(--radius-md);
  --radius-image:var(--radius-md);
  --radius-media-lg:var(--radius-lg);
  --radius-pill:999px;
  --radius-field:var(--radius-pill);

  /* Border widths */
  --border-hair:1px;
  --border-rule:2px;
  --border-heavy:3px;

  /* Aspect ratios. 16:9 heroes are a publication-gate requirement. */
  --ratio-hero:16 / 9; /* @kind other */
  --ratio-card:16 / 10; /* @kind other */
  --ratio-portrait:4 / 5; /* @kind other */
  --ratio-square:1 / 1; /* @kind other */
  --ratio-thumb:4 / 3; /* @kind other */
}