:root {
    /* Typography scale (x-based system) */
    --font-root-mobile: 14px;
    --font-root-desktop: 16px;
    --font-family-base: "DM Sans", Inter, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
    --font-base-x: 1rem;
    /* Heading formula system */
    --font-size-h6: calc(var(--font-base-x) * 1.1);
    --font-size-h5: calc(var(--font-base-x) * 1.25);
    --font-size-h4: calc(var(--font-base-x) * 1.4);
    --font-size-h3: calc(var(--font-base-x) * 1.6);
    --font-size-h2: calc(var(--font-base-x) * 2);
    --font-size-h1: calc(var(--font-base-x) * 2.5);
    /* Extended text scale */
    --font-size-056: calc(var(--font-base-x) * 0.5625); /* 9px */
    --font-size-059: calc(var(--font-base-x) * 0.59375); /* 9.5px */
    --font-size-062: calc(var(--font-base-x) * 0.625); /* 10px */
    --font-size-069: calc(var(--font-base-x) * 0.6875); /* 11px */
    --font-size-072: calc(var(--font-base-x) * 0.71875); /* 11.5px */
    --font-size-075: calc(var(--font-base-x) * 0.75); /* 12px */
    --font-size-081: calc(var(--font-base-x) * 0.8125); /* 13px */
    --font-size-087: calc(var(--font-base-x) * 0.875); /* 14px */
    --font-size-093: calc(var(--font-base-x) * 0.9375); /* 15px */
    --font-size-100: calc(var(--font-base-x) * 1); /* 16px */
    --font-size-112: calc(var(--font-base-x) * 1.125); /* 18px */
    --font-size-125: calc(var(--font-base-x) * 1.25); /* 20px */
    --font-size-175: calc(var(--font-base-x) * 1.75); /* 28px */
    --font-size-325: calc(var(--font-base-x) * 3.25); /* 52px */
    /* Existing rem literals normalized */
    --font-size-070: calc(var(--font-base-x) * 0.7);
    --font-size-072r: calc(var(--font-base-x) * 0.72);
    --font-size-074: calc(var(--font-base-x) * 0.74);
    --font-size-076: calc(var(--font-base-x) * 0.76);
    --font-size-077: calc(var(--font-base-x) * 0.77);
    --font-size-078: calc(var(--font-base-x) * 0.78);
    --font-size-080: calc(var(--font-base-x) * 0.8);
    --font-size-081r: calc(var(--font-base-x) * 0.81);
    --font-size-082: calc(var(--font-base-x) * 0.82);
    --font-size-083: calc(var(--font-base-x) * 0.83);
    --font-size-084: calc(var(--font-base-x) * 0.84);
    --font-size-085: calc(var(--font-base-x) * 0.85);
    --font-size-086: calc(var(--font-base-x) * 0.86);
    --font-size-087r: calc(var(--font-base-x) * 0.87);
    --font-size-088: calc(var(--font-base-x) * 0.88);
    --font-size-090: calc(var(--font-base-x) * 0.9);
    --font-size-092: calc(var(--font-base-x) * 0.92);
    --font-size-093r: calc(var(--font-base-x) * 0.93);
    --font-size-094: calc(var(--font-base-x) * 0.94);
    --font-size-095: calc(var(--font-base-x) * 0.95);
    --font-size-096: calc(var(--font-base-x) * 0.96);
    --font-size-098: calc(var(--font-base-x) * 0.98);
    --font-size-102: calc(var(--font-base-x) * 1.02);
    --font-size-103: calc(var(--font-base-x) * 1.03);
    --font-size-107: calc(var(--font-base-x) * 1.07);
    --font-size-108: calc(var(--font-base-x) * 1.08);
    --font-size-118: calc(var(--font-base-x) * 1.18);
    --font-size-155: calc(var(--font-base-x) * 1.55);
    --font-size-160: calc(var(--font-base-x) * 1.6);
    --font-size-170: calc(var(--font-base-x) * 1.7);
    --font-size-200: calc(var(--font-base-x) * 2);
    --font-size-300: calc(var(--font-base-x) * 3);
    /* Fluid display sizes */
    --font-size-fluid-hero-1: clamp(2rem, 3vw, 2.55rem);
    --font-size-fluid-hero-2: clamp(30px, 9vw, 38px);
    --font-size-fluid-hero-3: clamp(32px, 3.5vw, 46px);
    --font-size-fluid-hero-4: clamp(15px, 1.1vw, 18px);
    --font-size-fluid-title-1: clamp(1.35rem, 1.15rem + 1vw, 2rem);
    --font-size-fluid-title-2: clamp(1.5rem, 1.3rem + .65vw, 1.95rem);
    --font-size-fluid-title-3: clamp(2rem, 1.95rem + .35vw, 2.35rem);
    --font-size-fluid-title-4: clamp(2rem, 1.85rem + .22vw, 2.2rem);
    --font-size-fluid-title-5: clamp(1.55rem, 1.2rem + .9vw, 2.1rem);
    --font-size-fluid-title-6: clamp(1.2rem, .95rem + .65vw, 1.7rem);
    /* Typography rhythm tokens */
    --line-height-tight: 1.2;
    --line-height-heading: 1.25;
    --line-height-body: 1.55;
    --line-height-relaxed: 1.7;
    --line-height-caption: 1.35;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --space-text-2xs: 0.25rem;
    --space-text-xs: 0.375rem;
    --space-text-sm: 0.5rem;
    --space-text-md: 0.75rem;
    --space-text-lg: 1rem;
    --space-text-xl: 1.25rem;
    /* Core neutrals */
    --color-white: #ffffff;
    --color-black: #000000;
    /* Navy scale (primary brand) */
    --navy-950: #0f1623;
    --navy-900: #1a2336;
    --navy-800: #243048;
    --navy-700: #2e3d5c;
    --navy-600: #3b4f73;
    --navy-500: #4f6490;
    --navy-400: #6b80a8;
    --navy-300: #8fa5c4;
    --navy-200: #b8c4d8;
    --navy-100: #dce3ee;
    --navy-50: #f0f3f8;
    /* Gold scale (accent and CTA) */
    --gold-900: #7a4f1a;
    --gold-700: #9e6b25;
    --gold-600: #b8893a;
    --gold-500: #c9973f;
    --gold-400: #d4a84b;
    --gold-300: #e0bb6e;
    --gold-200: #edd9a3;
    --gold-100: #f7f0dc;
    --gold-50: #FDF4E3;
    /* Semantic tokens */
    --color-primary: var(--navy-900);
    --color-primary-dark: var(--navy-950);
    --color-primary-hover: var(--navy-700);
    --color-accent: var(--gold-400);
    --color-accent-dark: var(--gold-500);
    --color-accent-hover: var(--gold-300);
    --color-accent-light: var(--gold-100);
    --color-accent-strong: #c58b19;
    --color-accent-deep: #c8922a;
    --color-accent-darker: #d2a243;
    --color-surface: #f8f9fc;
    --color-surface-soft: #f8fafc;
    --color-surface-alt: #fafbfc;
    --color-surface-subtle: #f3f4f6;
    --color-surface-muted: #f7f9fc;
    --color-surface-cream: #fff9ed;
    --color-border: #e2e7f0;
    --color-border-soft: #e9ecef;
    --color-border-muted: #d6dde5;
    --color-border-subtle: #cbd5e1;
    --color-border-alt: #e2e8f0;
    --color-border-cool: #d8dbe2;
    --color-border-table: #eef2f6;
    --color-border-dashed: #b8b8b8;
    --color-border-light: #e5e7eb;
    --color-border-panel: #cfd7e2;
    --color-border-danger-soft: #f0b7b2;
    --color-text: var(--navy-800);
    --color-muted: var(--navy-400);
    --color-text-strong: #0f172a;
    --color-text-emphasis: #1f2937;
    --color-text-muted-2: #6c757d;
    --color-text-muted-3: #64748b;
    --color-text-muted-4: #6f7c92;
    --color-text-muted-5: #8290a7;
    --color-text-subtle: #95a0b4;
    --color-text-subtle-2: #8f9aae;
    --color-text-subtle-3: #a4aebe;
    --color-text-subtle-4: #7f8897;
    --color-text-subtle-5: #77829a;
    --text-main: #1a2336;
    --text-muted: #6b80a8;
    /* Status colors */
    --color-success: #16a34a;
    --color-success-light: #22c55e;
    --color-success-bg: #f0fdf4;
    --color-success-border: #bbf7d0;
    --color-warning: #d97706;
    --color-warning-strong: #f59e0b;
    --color-warning-deep: #c05a20;
    --color-warning-muted: #a07800;
    --color-warning-soft: #fff2df;
    --color-warning-surface: #fff7e6;
    --color-warning-soft-2: #fdf5e0;
    --color-warning-warm: #f4c46b;
    --color-warning-bg: #fffbeb;
    --color-warning-border: #fde68a;
    --color-danger: #dc2626;
    --color-danger-legacy: #dc3545;
    --color-danger-deep: #c0392b;
    --color-danger-soft: #ffd4d4;
    --color-danger-soft-surface: #fdecea;
    --color-danger-soft-panel: #fde9dd;
    --color-danger-shell: #fff8f7;
    --color-danger-bg: #fef2f2;
    --color-danger-border: #fecaca;
    --color-info: #2563eb;
    --color-info-light: #3b82f6;
    --color-info-bg: #eff6ff;
    --color-info-border: #bfdbfe;
    /* Overlay tokens */
    --overlay-accent-08: rgba(212,168,75,.08);
    --overlay-accent-12: rgba(212,168,75,.12);
    --overlay-accent-15: rgba(212,168,75,.15);
    --overlay-accent-18: rgba(212,168,75,.18);
    --overlay-accent-22: rgba(212,168,75,.22);
    --overlay-accent-24: rgba(212,168,75,.24);
    --overlay-accent-25: rgba(212, 168, 75, 0.25);
    --overlay-accent-28: rgba(212,168,75,.28);
    --overlay-accent-30: rgba(212,168,75,.3);
    --overlay-accent-35: rgba(212,168,75,.35);
    --overlay-accent-45: rgba(212,168,75,.45);
    --overlay-white-99: rgba(255,255,255,.99);
    --overlay-white-98: rgba(255,255,255,.98);
    --overlay-white-95: rgba(255,255,255,.95);
    --overlay-white-92: rgba(255,255,255,.92);
    --overlay-white-90: rgba(255,255,255,.9);
    --overlay-white-86: rgba(255,255,255,.86);
    --overlay-white-82: rgba(255,255,255,.82);
    --overlay-white-78: rgba(255,255,255,.78);
    --overlay-white-70: rgba(255,255,255,.7);
    --overlay-white-62: rgba(255,255,255,.62);
    --overlay-white-58: rgba(255,255,255,.58);
    --overlay-white-50: rgba(255,255,255,.5);
    --overlay-white-40: rgba(255,255,255,.4);
    --overlay-white-20: rgba(255,255,255,.2);
    --overlay-white-15: rgba(255,255,255,.15);
    --overlay-white-12: rgba(255,255,255,.12);
    --overlay-white-10: rgba(255,255,255,.1);
    --overlay-white-08: rgba(255,255,255,.08);
    --overlay-white-06: rgba(255,255,255,.06);
    --overlay-white-05: rgba(255,255,255,.05);
    --overlay-white-04: rgba(255,255,255,.04);
    --overlay-white-02: rgba(255,255,255,.02);
    --overlay-ink-18: rgba(15,23,42,.18);
    --overlay-ink-16: rgba(15, 23, 42, .16);
    --overlay-ink-12: rgba(15, 23, 42, .12);
    --overlay-ink-10: rgba(15,23,42,.1);
    --overlay-ink-09: rgba(15, 23, 42, .09);
    --overlay-ink-08: rgba(15,23,42,.08);
    --overlay-ink-07: rgba(15,23,42,.07);
    --overlay-ink-06: rgba(15,23,42,.06);
    --overlay-ink-04: rgba(15, 23, 42, .04);
    --overlay-ink-03: rgba(15, 23, 42, .03);
    --overlay-navy-50: rgba(26,35,54,.5);
    --overlay-navy-35: rgba(20, 31, 53, 0.35);
    --overlay-navy-16: rgba(26,35,54,.16);
    --overlay-navy-12: rgba(26,35,54,.12);
    --overlay-navy-08: rgba(26,35,54,.08);
    --overlay-navy-05: rgba(26,35,54,.05);
    --overlay-black-96: rgba(0,0,0,.96);
    --overlay-black-92: rgba(0,0,0,.92);
    --overlay-black-90: rgba(0,0,0,.9);
    --overlay-black-88: rgba(15, 23, 42, 0.88);
    --overlay-black-82: rgba(0,0,0,.82);
    --overlay-black-50: rgba(0,0,0,.5);
    --overlay-black-16: rgba(0,0,0,.16);
    /* Shadows */
    --shadow-sm: 0 1px 4px rgba(26,35,54,.08);
    --shadow-md: 0 4px 16px rgba(26,35,54,.12);
    --shadow-lg: 0 8px 32px rgba(26,35,54,.18);
    --shadow-gold: 0 4px 16px rgba(212,168,75,.3);
    /* Radius scale */
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 16px;
    --radius-xl: 24px;
    /* Spacing scale */
    --space-2xs: 0.25rem;
    --space-3xs: 0.35rem;
    --space-xxs: 0.45rem;
    --space-xs: 0.5rem;
    --space-sm: 0.75rem;
    --space-sm-plus: 0.9rem;
    --space-md: 1rem;
    --space-md-plus: 1.2rem;
    --space-lg: 1.25rem;
    --space-xl: 1.5rem;
    /* Component primitives (Phase 5) */
    --card-border-radius: var(--radius-lg);
    --card-shadow: 0 8px 18px var(--overlay-navy-05);
    --card-padding: var(--space-md);
    --control-border-radius: 12px;
    --control-min-height: 2.75rem;
    --control-padding-y: 0.6rem;
    --control-padding-x: 0.8rem;
    --btn-border-radius: var(--radius-md);
    --btn-padding-y: 0.45rem;
    --btn-padding-x: 0.8rem;
    --btn-font-weight: var(--font-weight-medium);
    --btn-gap: 0.35rem;
    --radius-pill: 999px;
    --radius-soft: 0.9rem;
    --nav-pill-radius: var(--radius-md);
    --nav-pill-padding-y: 0.45rem;
    --nav-pill-padding-x: 0.8rem;
    --nav-pill-gap: var(--space-2xs);
    /* Bootstrap overrides */
    --bs-primary: #d4a84b;
    --bs-primary-rgb: 212, 168, 75;
    --bs-secondary: #1a2336;
    --bs-secondary-rgb: 26, 35, 54;
    --bs-success: #16a34a;
    --bs-success-rgb: 22, 163, 74;
    --bs-danger: #dc2626;
    --bs-danger-rgb: 220, 38, 38;
    --bs-warning: #d97706;
    --bs-warning-rgb: 217, 119, 6;
    --bs-info: #2563eb;
    --bs-info-rgb: 37, 99, 235;
    /* Backward-compatible aliases */
    --app-bg: var(--color-surface);
    --cream: #f7f4ef;
    --app-panel: var(--color-white);
    --app-border: var(--color-border);
    --app-text: var(--color-text);
    --app-muted: var(--color-muted);
    --app-primary: var(--color-accent);
    --app-primary-2: var(--gold-500);
    --app-success: var(--color-success);
    --app-danger: var(--color-danger);
    --app-warning: var(--color-warning);
    --app-radius: var(--radius-lg);
    --app-shadow: var(--shadow-lg);
    --app-shadow-sm: var(--shadow-sm);
    /* Additional semantic and module tokens */
    --color-brand-topbar-start: #1f2633;
    --color-brand-topbar-mid: #19233a;
    --color-brand-topbar-end: #15203a;
    --color-brand-hero-start: #06142a;
    --color-brand-hero-mid: #112542;
    --color-brand-hero-end: #243a5c;
    --color-brand-deep-1: #1c2333;
    --color-brand-deep-2: #242d40;
    --color-link-soft: #0d6efd;
    --color-text-neutral-1: #111827;
    --color-text-neutral-2: #4b5563;
    --color-text-neutral-3: #5b6c86;
    --color-text-neutral-4: #7c8aa3;
    --color-text-neutral-5: #66758f;
    --color-text-neutral-6: #334155;
    --color-text-neutral-7: #111;
    --color-text-neutral-8: #5a5a5a;
    --color-panel-title: #1d2f4b;
    --color-panel-subtitle: #7d8ba1;
    --color-panel-copy: #6d7f99;
    --color-panel-heading: #0f2547;
    --color-danger-badge: #b42318;
    --color-status-seated-bg: #ebf4fc;
    --color-status-seated-text: #1a6fa8;
    --color-status-served-bg: #f1ebfb;
    --color-status-served-text: #7b4fbf;
    --color-status-kitchen-text: #d4780a;
    --color-status-success-bg: #e8f5ee;
    --color-status-success-text: #2e7d5e;
    --color-status-warning-soft: #f4f1ec;
    --color-status-warning-strong: #dfaa44;
    --color-status-accent-dot: #c99322;
    --color-border-grid: #dbe3ea;
    --color-border-neutral: #d7d7d7;
    --color-border-neutral-2: #d1d5db;
    --color-border-alert: #fecaca;
    --color-border-warm: #af7d1f;
    --overlay-danger-soft: rgba(220, 53, 69, 0.08);
    --overlay-danger-soft-2: rgba(220, 53, 69, 0.12);
    --overlay-info-soft: rgba(13, 110, 253, 0.08);
    --overlay-info-soft-2: rgba(13, 110, 253, 0.05);
    --overlay-info-soft-3: rgba(59,130,246,.06);
    --overlay-warning-soft: rgba(245,158,11,.09);
    --overlay-success-soft: rgba(34,197,94,.09);
    --overlay-success-focus: rgba(34,197,94,.14);
    --overlay-surface-98: rgba(255, 255, 255, 0.98);
    --overlay-surface-95: rgba(255, 255, 255, 0.95);
    --overlay-surface-85: rgba(255, 255, 255, 0.85);
    --overlay-surface-80: rgba(255, 255, 255, 0.8);
    --overlay-surface-65: rgba(255, 255, 255, 0.65);
    --overlay-surface-62: rgba(255, 255, 255, 0.62);
    --overlay-surface-15: rgba(255, 255, 255, 0.15);
    --overlay-surface-08: rgba(255, 255, 255, 0.08);
    --overlay-deep-20: rgba(16, 24, 40, 0.2);
    --overlay-deep-12: rgba(16, 24, 40, 0.12);
    --overlay-deep-28: rgba(16, 24, 40, 0.28);
    --overlay-brand-04: rgba(28, 35, 51, 0.04);
    --overlay-brand-03: rgba(28, 35, 51, 0.03);
    --overlay-brand-10: rgba(28, 35, 51, 0.1);
    --overlay-brand-18: rgba(28, 35, 51, 0.18);
    --overlay-accent-focus: rgba(200, 146, 42, 0.55);
    --overlay-accent-20: rgba(212,168,75,.20);
    --overlay-accent-40: rgba(212,168,75,.4);
    --overlay-accent-16: rgba(255, 201, 112, .16);
    --overlay-accent-0: rgba(255, 201, 112, 0);
    --overlay-danger-26: rgba(220,38,38,.26);
    --overlay-danger-09: rgba(220,38,38,.09);
    --overlay-danger-12: rgba(239,68,68,.12);
    --overlay-danger-24: rgba(239,68,68,.24);
    --overlay-danger-border-35: rgba(252,165,165,.35);
    --overlay-danger-border-40: rgba(252,165,165,.4);
    --overlay-danger-text-78: rgba(255,109,109,.78);
    --overlay-muted-blue-66: rgba(184,196,216,.66);
    --overlay-muted-blue-62: rgba(184,196,216,.62);
    --overlay-muted-blue-72: rgba(184,196,216,.72);
    --overlay-muted-blue-42: rgba(184,196,216,.42);
    --overlay-muted-blue-78: rgba(188,198,215,.78);
    --overlay-muted-blue-78b: rgba(196,205,220,.78);
    --overlay-muted-blue-86: rgba(216,223,235,.86);
    --overlay-muted-blue-90: rgba(226,232,240,.9);
    --overlay-muted-blue-94: rgba(226,232,240,.94);
    --overlay-muted-blue-75: rgba(226,232,240,.75);
    --overlay-muted-blue-55: rgba(226,232,240,.55);
    --overlay-shell-94: rgba(253,250,242,.94);
    --overlay-shell-96: rgba(253,250,242,.96);
    --overlay-shell-92: rgba(246,248,252,.92);
    --overlay-shell-95: rgba(245,247,251,.95);
    --overlay-shell-94b: rgba(245,247,251,.94);
    --overlay-shell-96b: rgba(244,247,251,.96);
    --overlay-shell-90: rgba(248, 249, 250, 0.9);
    --overlay-shell-94c: rgba(248, 249, 250, 0.94);
    --overlay-shell-95c: rgba(248, 249, 250, 0.95);
    --overlay-surface-82: rgba(248,250,252,.82);
    --overlay-blue-26: rgba(59,130,246,.26);
    --overlay-slate-35: rgba(148, 163, 184, .35);
    --overlay-indigo-30: rgba(97, 126, 182, .30);
    --overlay-indigo-0: rgba(97, 126, 182, 0);
}