:root{
  /* breakpoint is a square-cornered brand. Radius is used sparingly and never above 4px
     except on pills (buttons, tags), which are fully round. */
  --radius-0:0px; --radius-1:2px; --radius-2:4px; --radius-pill:999px;

  --border-hairline:1px solid var(--neutral-200);
  --border-strong:1px solid var(--neutral-300);
  --border-ink:1px solid var(--ink);
  --border-citrus:1px solid var(--citrus);

  /* Shadows are near-absent; elevation comes from rules and color blocks. */
  --shadow-none:none;
  --shadow-raise:0 1px 2px rgba(20,18,16,.06);
  --shadow-pop:0 8px 24px -8px rgba(20,18,16,.18);
  --shadow-modal:0 32px 64px -24px rgba(20,18,16,.32);
  --shadow-focus:0 0 0 2px var(--neutral-0),0 0 0 4px var(--citrus);
  --inset-hairline:inset 0 -1px 0 var(--neutral-200);
}