:root{
  --space-0:0px; --space-1:2px; --space-2:4px; --space-3:8px; --space-4:12px;
  --space-5:16px; --space-6:20px; --space-7:24px; --space-8:32px; --space-9:40px;
  --space-10:48px; --space-11:64px; --space-12:80px;

  /* Layout */
  --screen-gutter:20px;      /* mobile horizontal padding */
  --screen-gutter-web:32px;  /* portal horizontal padding */
  --card-padding:16px;
  --card-padding-lg:20px;
  --section-gap:24px;
  --stack-gap:12px;
  --portal-sidebar-w:248px;
  --content-max:1280px;

  /* Radii */
  --radius-xs:4px; --radius-sm:8px; --radius-md:14px; /* buttons, cards */
  --radius-lg:20px; --radius-xl:28px; --radius-pill:999px; --radius-circle:50%;

  /* Control sizes — 44px minimum tap target everywhere */
  --control-h-lg:56px; --control-h-md:48px; --control-h-sm:40px; --tap-min:44px;
  --icon-sm:16px; --icon-md:20px; --icon-lg:24px; --icon-xl:32px;
}