// ─── Spacing scale (4 dp grid) ────────────────────────────────────────────────── // Every value is a multiple of 4 for pixel-perfect alignment on all screens. export const spacing = { /** 4 dp – hairline / micro-gap */ xs: 4, /** 8 dp – compact padding */ sm: 8, /** 12 dp – default inner padding */ md: 12, /** 16 dp – standard section padding */ lg: 16, /** 24 dp – card-level spacing */ xl: 24, /** 32 dp – large gaps / page margins */ xxl: 32, /** 48 dp – hero / full-section gaps */ xxxl: 48, } as const; /** Keys available in the spacing scale – useful for typed helper utilities */ export type SpacingKeys = keyof typeof spacing; /** * Helper: retrieve a spacing value by key. * @example spacingValue('lg') // 16 */ export function spacingValue(key: SpacingKeys): number { return spacing[key]; }