/* 4px base unit (Tailwind scale). Values below are the ones the app actually uses. */
:root{
  --space-px:1px;--space-0-5:0.125rem;--space-1:0.25rem;--space-1-5:0.375rem;--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-9:2.25rem;--space-10:2.5rem;--space-12:3rem;--space-14:3.5rem;--space-16:4rem;

  /* Layout rhythm */
  --page-pad-mobile:var(--space-6);   /* px-6 py-6 */
  --page-pad-desktop:var(--space-12); /* p-12 */
  --card-pad:var(--space-4);          /* p-4 */
  --modal-pad:var(--space-10);        /* md:p-10 */
  --row-pad-x:var(--space-4);--row-pad-y:var(--space-3); /* px-4 py-3 */
  --gap-tight:var(--space-2);--gap-section:var(--space-4);--gap-major:var(--space-8);
  --field-height:2rem;                /* h-8 — every input and tab */
  --content-max-width:96rem;          /* max-w-9xl */
  --installer-max-width:48rem;        /* max-w-3xl */

  /* Sidebar */
  --sidebar-collapsed:5rem;   /* w-20, desktop default */
  --sidebar-expanded:13rem;   /* w-52, desktop expanded */
  --sidebar-mobile:12rem;     /* w-[12rem] drawer */
  --topbar-height:4rem;       /* h-16 */

  /* Radii — the whole system is these three plus rounded-full */
  --radius-md:0.375rem;  /* badges, small inputs */
  --radius-lg:0.5rem;    /* buttons, list cells, nav links, inputs */
  --radius-xl:0.75rem;   /* notification drawer */
  --radius-2xl:1rem;     /* modals, feature cards */
  --radius-full:9999px;

  /* Breakpoints (custom — these OVERRIDE Tailwind defaults) */
  --screen-sm:600px;--screen-md:905px;--screen-lg:1240px;--screen-xl:1440px;
}