:root{
--radius:0.5rem;
--radius-xs:calc(var(--radius) - 6px);
--radius-sm:calc(var(--radius) - 4px);
--radius-md:calc(var(--radius) - 2px);
--radius-lg:var(--radius);
--radius-xl:calc(var(--radius) + 4px);
--radius-2xl:calc(var(--radius)*1.8);
--radius-3xl:calc(var(--radius)*2.2);
--radius-4xl:calc(var(--radius)*2.6);
--radius-full:9999px;
--shadow-2xs:0px 1px 2px 0px hsl(220 40% 10% / 0.03);
--shadow-xs:0px 1px 2px 0px hsl(220 40% 10% / 0.04);
--shadow-sm:0px 2px 4px 0px hsl(220 40% 10% / 0.05),0px 1px 2px -1px hsl(220 40% 10% / 0.04);
--shadow:0px 3px 6px 0px hsl(220 40% 10% / 0.06),0px 1px 2px -1px hsl(220 40% 10% / 0.04);
--shadow-md:0px 4px 8px 0px hsl(220 40% 10% / 0.07),0px 2px 4px -1px hsl(220 40% 10% / 0.05);
--shadow-lg:0px 8px 16px 0px hsl(220 40% 10% / 0.08),0px 4px 6px -1px hsl(220 40% 10% / 0.05);
--shadow-xl:0px 16px 24px 0px hsl(220 40% 10% / 0.09),0px 8px 10px -1px hsl(220 40% 10% / 0.05);
--shadow-2xl:0px 24px 40px 0px hsl(220 40% 10% / 0.14);
/* Layout: site container is 80rem max, 2rem inline padding (1.25rem on mobile) */
--container-max:80rem;
--container-pad:2rem;
/* Spacing follows the Tailwind 4px scale (gap-2=8px, p-6=24px, py-32=128px section rhythm) */
--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-6:24px;--space-8:32px;--space-12:48px;--space-16:64px;--space-24:96px;--space-32:128px;
}