        :root {
            /* USA Fires palette — see docs/design/ui-design-guide.md */
            --ds-deep-teal: #2D6B5A;
            --ds-bg: #F4F4F4;
            --ds-surface: #FFFFFF;
            --ds-surface-header: #EEEEEE;
            --ds-foreground: #333333;
            --ds-text-muted: #6b7280;
            --ds-muted: #8B8B8B;
            --ds-forest: #3C836F;
            --ds-sage: #61AE82;
            --ds-light-green: #9DCF94;
            --ds-highlight: #A0D2A7;
            --ds-green-mid-dark: #4F997E;
            --ds-green-mid-1: #74C09B;
            --ds-green-mid-2: #86D1B4;
            --ds-green-light-1: #B6E0CF;
            --ds-green-light-2: #C8EAE0;
            --ds-green-light-3: #DBF4F1;
            --ds-green-light-4: #EDF9F9;
            --ds-green-near-white: #F5FDFD;
            /* Semantic (map to palette) */
            --background: var(--ds-bg);
            --foreground: var(--ds-foreground);
            --card: var(--ds-surface);
            --card-foreground: var(--ds-foreground);
            --popover: var(--ds-surface);
            --popover-foreground: var(--ds-foreground);
            --primary: var(--ds-forest);
            --primary-foreground: var(--ds-surface);
            --secondary: var(--ds-surface-header);
            --secondary-foreground: var(--ds-foreground);
            --muted: var(--ds-surface-header);
            --muted-foreground: var(--ds-text-muted);
            --accent: var(--ds-surface-header);
            --accent-foreground: var(--ds-foreground);
            --destructive: #c53030;
            --destructive-foreground: var(--ds-surface);
            --border: var(--ds-muted);
            --input: var(--ds-muted);
            --ring: var(--ds-forest);
            --radius: 0.625rem;
            --radius-sm: calc(var(--radius) - 4px);
            --radius-md: calc(var(--radius) - 2px);
            --radius-lg: var(--radius);
            --radius-xl: calc(var(--radius) + 4px);
            --chart-1: var(--ds-forest);
            --chart-2: var(--ds-sage);
            --chart-3: var(--ds-light-green);
            --chart-4: var(--ds-green-mid-dark);
            --chart-5: var(--ds-green-mid-1);
            --chart-6: var(--ds-green-mid-2);
            --chart-1-hex: #3C836F;
            --chart-2-hex: #61AE82;
            --chart-roas-hex: #4A7FB5;
            --chart-3-hex: #9DCF94;
            --chart-4-hex: #4F997E;
            --chart-5-hex: #74C09B;
            --chart-6-hex: #86D1B4;
            /* Sidebar — dark base, bright active accent */
            --sidebar: #366259;
            --sidebar-foreground: rgba(255,255,255,0.85);
            --sidebar-foreground-dim: rgba(255,255,255,0.5);
            --sidebar-primary: var(--ds-forest);
            --sidebar-primary-foreground: var(--ds-surface);
            --sidebar-inactive-icon: rgba(255,255,255,0.12);
            --sidebar-active-bg: var(--sidebar-brand-bg);
            --sidebar-active-accent: #3C836F;
            --sidebar-active-icon: #FFFFFF;
            --sidebar-active-icon-detail: #FFFFFF;
            --sidebar-active-border: rgba(255,255,255,0.2);
            --sidebar-left-edge: #3C836F;
            --sidebar-separator: rgba(255,255,255,0.08);
            --sidebar-accent: rgba(255,255,255,0.08);
            --sidebar-brand-bg: rgba(255,255,255,0.06);
            --sidebar-accent-foreground: var(--ds-surface);
            --sidebar-border: rgba(255,255,255,0.1);
            --sidebar-ring: var(--ds-forest);
            --sidebar-width: 224px;
            --sidebar-collapsed-width: 64px;
            /* Spacing & type */
            --space-4: 4px;
            --space-8: 8px;
            --space-12: 12px;
            --space-14: 14px;
            --space-16: 16px;
            --space-20: 20px;
            --space-24: 24px;
            --space-32: 32px;
            --space-40: 40px;
            --space-48: 48px;
            --text-xs: 12px;
            --text-sm: 14px;
            --text-base: 16px;
            --text-lg: 20px;
            --text-xl: 25px;
            --text-2xl: 31px;
            --text-3xl: 39px;
            --text-primary: var(--foreground);
            --text-secondary: var(--secondary-foreground);
            --text-tertiary: var(--muted-foreground);
            --bg: var(--background);
            --surface: var(--card);
            --surface-warm: var(--muted);
            --surface-container: var(--muted);
            --border-soft: var(--border);
            --text: var(--foreground);
            --text-muted: var(--muted-foreground);
            --accent-hover: #2d6b5a;
            --accent-soft: rgba(60,131,111,0.08);
            --forest-900: var(--ds-forest);
            --forest-800: var(--ds-forest);
            --forest-700: var(--ds-forest);
            --forest-600: var(--ds-forest);
            --forest-500: var(--ds-forest);
            --sage-400: var(--ds-sage);
            --sage-300: var(--ds-sage);
            --sage-200: var(--secondary);
            --sage-100: var(--secondary);
            --sage-50: var(--muted);
            --success: var(--ds-sage);
            --warning: #b45309;
            --shadow-sm: 0 1px 3px rgba(0,0,0,0.04);
            --shadow-md: 0 4px 12px rgba(0,0,0,0.06);
            --shadow-lg: 0 8px 24px rgba(0,0,0,0.08);
            --shadow-xl: 0 16px 48px rgba(0,0,0,0.1);
            --elevation-1: var(--shadow-sm);
            --elevation-2: var(--shadow-md);
            --elevation-3: var(--shadow-lg);
            --ease-out: cubic-bezier(0.33, 1, 0.68, 1);
            --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
        }
        * { margin: 0; padding: 0; box-sizing: border-box; }
        *:focus-visible { outline: 2px solid var(--ring); outline-offset: 2px; }
        html {
            height: 100%;
            overflow: hidden;
            direction: ltr;
        }
        body {
            font-family: 'Geist', 'Geist Fallback', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
            background: var(--background);
            color: var(--foreground);
            height: 100vh;
            min-height: 0;
            overflow: hidden;
            display: flex;
            flex-direction: row;
            direction: ltr;
        }
