/* Spacing, radii, borders. Radii measured from the brand book at 1920px:
   card 20px · botão principal 8px · faixa de aviso 6px · selo/chip pill. */
:root{
  --space-0:0;
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:20px;
  --space-6:24px;
  --space-8:32px;
  --space-10:40px;   /* card padding (p.12) */
  --space-12:48px;
  --space-14:56px;   /* large card padding (p.02) */
  --space-16:64px;   /* hairline grid module */
  --space-20:80px;
  --space-24:96px;
  --space-32:128px;  /* page margin at 1920 */

  --gutter:32px;               /* gap between cards (p.02) */
  --page-margin:clamp(20px,6.6vw,128px);
  --container:1200px;
  --grid-module:128px;         /* "grade de linhas finas" · Elementos: ~170px a 1920 (≈9% da largura) */

  --radius-xs:4px;
  --radius-sm:6px;             /* faixa de aviso */
  --radius-md:8px;             /* botões, inputs */
  --radius-lg:12px;            /* dense tiles, menus */
  --radius-xl:20px;            /* card com hairline */
  --radius-2xl:28px;           /* big panels */
  --radius-app-icon:4.5%;      /* app icon artwork, % of the side (Elementos p.04) */
  --radius-pill:999px;         /* selos, chips */

  --border-width:1px;          /* hairline — the only border weight */
  --hairline:1px solid var(--border-hairline);
  --hairline-dark:1px solid var(--border-on-dark);

  --control-h-sm:36px;
  --control-h-md:44px;
  --control-h-lg:52px;
}