/**
 * Hand-maintained B40 design tokens — there is no generator or npm package.
 * Source of truth: web/tokens.css in the Back40Engineering.com repo. When editing,
 * sync every copy: back40-community/src/tokens*.css and the marketing repo css/tokens.css.
 */

:root {
  --b40-color-orange-50: #fef6e7; /** Orange tint 50 — near white */
  --b40-color-orange-100: #fde7b3;
  --b40-color-orange-200: #fad07c;
  --b40-color-orange-300: #f5b94a;
  --b40-color-orange-400: #efa224;
  --b40-color-orange-500: #e8940d; /** Back40 brand orange — primary anchor */
  --b40-color-orange-600: #c87a09;
  --b40-color-orange-700: #a36007;
  --b40-color-orange-800: #7a4705;
  --b40-color-orange-900: #4f2e03;
  --b40-color-orange-950: #2a1701; /** Orange shade 950 — near black */
  --b40-color-neutral-0: #ffffff;
  --b40-color-neutral-50: #fafaf8;
  --b40-color-neutral-100: #f4f3f0;
  --b40-color-neutral-200: #e8e7e3;
  --b40-color-neutral-300: #d4d2cd;
  --b40-color-neutral-400: #acaaa3;
  --b40-color-neutral-500: #84827c;
  --b40-color-neutral-600: #605e58;
  --b40-color-neutral-700: #47453f;
  --b40-color-neutral-800: #312f2a;
  --b40-color-neutral-900: #1e1c18; /** Primary dark surface */
  --b40-color-neutral-950: #121009;
  --b40-color-neutral-1000: #000000;
  --b40-color-green-50: #edfbf0;
  --b40-color-green-300: #6dd98a;
  --b40-color-green-500: #1e9e3e; /** Success / safe zone */
  --b40-color-green-700: #146b2a;
  --b40-color-green-900: #0a3716;
  --b40-color-amber-50: #fdf9e8;
  --b40-color-amber-300: #fcd065;
  --b40-color-amber-500: #dfae1b; /** Warning / caution zone — gold-leaning, distinct from brand orange */
  --b40-color-amber-700: #96730f;
  --b40-color-amber-900: #443208;
  --b40-color-red-50: #fdf1ec;
  --b40-color-red-300: #f6907a;
  --b40-color-red-500: #d94a32; /** Error / danger zone — warm vermillion */
  --b40-color-red-700: #a93a24;
  --b40-color-red-900: #521c12;
  --b40-color-blue-50: #edf3fa;
  --b40-color-blue-300: #96bfe3;
  --b40-color-blue-500: #4381c8; /** Info / connectivity — steel blue, kin to the metal chrome */
  --b40-color-blue-700: #2b5a94;
  --b40-color-blue-900: #1c395c;
  --b40-color-purple-500: #b07aa1; /** Data viz series 5 — dusty plum */
  --b40-color-teal-500: #3fa08c; /** Data viz series 6 — muted teal */
  --b40-color-gold-300: #e8c93a; /** Gold accent — RPM/performance readouts */
  --b40-color-gold-400: #d4a90f; /** Gold borders */
  --b40-color-gold-950: #1a1301; /** Gold badge background */
  --b40-color-brand-primary: #e8940d; /** Primary brand color — the warm focal point on dark surfaces */
  --b40-color-brand-primary-hover: #efa224;
  --b40-color-brand-primary-active: #f5b94a;
  --b40-color-brand-primary-subtle: #2a1701; /** Muted brand tint for dark backgrounds */
  --b40-color-brand-on-primary: #ffffff; /** Text/icon color on brand primary background */
  --b40-color-surface-base: #121009; /** App background — near black, like an instrument cluster */
  --b40-color-surface-raised: #1e1c18; /** Cards, panels */
  --b40-color-surface-overlay: #312f2a; /** Modals, popovers */
  --b40-color-surface-sunken: #000000; /** Inset wells, gauge backgrounds */
  --b40-color-surface-inverse: #f4f3f0; /** Light surface on dark bg */
  --b40-color-surface-metal: #111820; /** Chrome — top bar, sidebars; separates chrome from content */
  --b40-color-text-primary: #fafaf8; /** Main body text — high contrast on dark */
  --b40-color-text-secondary: #d4d2cd; /** Supporting text, labels */
  --b40-color-text-tertiary: #acaaa3; /** Placeholder, hint text */
  --b40-color-text-disabled: #605e58;
  --b40-color-text-inverse: #1e1c18; /** Text on light surfaces */
  --b40-color-text-brand: #efa224; /** Brand-colored text — warm accent on dark */
  --b40-color-text-link: #96bfe3;
  --b40-color-text-data: #f4f3f0; /** Sensor values, numeric readouts — maximum legibility */
  --b40-color-border-default: #47453f;
  --b40-color-border-strong: #605e58;
  --b40-color-border-focus: #efa224; /** Focus ring — orange glow */
  --b40-color-border-brand: #e8940d;
  --b40-color-border-metal: #424f5e; /** Chrome borders and dividers */
  --b40-color-status-success: #6dd98a;
  --b40-color-status-success-surface: #0f2b17;
  --b40-color-status-success-text: #6dd98a;
  --b40-color-status-warning: #fcd065;
  --b40-color-status-warning-surface: #2b1a00;
  --b40-color-status-warning-text: #fcd065;
  --b40-color-status-error: #f6907a;
  --b40-color-status-error-surface: #2b0f0f;
  --b40-color-status-error-text: #f6907a;
  --b40-color-status-info: #96bfe3;
  --b40-color-status-info-surface: #0f1b33;
  --b40-color-status-info-text: #96bfe3;
  --b40-color-dataviz-series-1: #efa224; /** Primary data series — brand accent */
  --b40-color-dataviz-series-2: #96bfe3;
  --b40-color-dataviz-series-3: #6dd98a;
  --b40-color-dataviz-series-4: #fcd065;
  --b40-color-dataviz-series-5: #b07aa1;
  --b40-color-dataviz-series-6: #3fa08c;
  --b40-color-dataviz-gauge-safe: #6dd98a;
  --b40-color-dataviz-gauge-caution: #fcd065;
  --b40-color-dataviz-gauge-danger: #f6907a;
  --b40-font-family-display: 'Barlow Condensed', 'Arial Narrow', sans-serif; /** Headings, section titles — condensed for instrument cluster feel */
  --b40-font-family-sans: 'Barlow', 'IBM Plex Sans', system-ui, sans-serif; /** UI text — labels, body, controls */
  --b40-font-family-mono: 'IBM Plex Mono', 'Roboto Mono', monospace; /** Data values — sensor readings, timestamps, tables */
  --b40-font-size-2xs: 0.625rem; /** 10px — axis labels, micro text */
  --b40-font-size-xs: 0.75rem; /** 12px — captions, secondary labels */
  --b40-font-size-sm: 0.875rem; /** 14px — body small, table cells */
  --b40-font-size-md: 1rem; /** 16px — body default */
  --b40-font-size-lg: 1.125rem; /** 18px — lead text, card titles */
  --b40-font-size-xl: 1.25rem; /** 20px — section headings */
  --b40-font-size-2xl: 1.5rem; /** 24px — page headings */
  --b40-font-size-3xl: 1.875rem; /** 30px — large data values */
  --b40-font-size-4xl: 2.25rem; /** 36px — hero data value */
  --b40-font-size-5xl: 3rem; /** 48px — dashboard KPI */
  --b40-font-size-6xl: 3.75rem; /** 60px — oversized gauge readout */
  --b40-font-weight-light: 300;
  --b40-font-weight-regular: 400;
  --b40-font-weight-medium: 500;
  --b40-font-weight-semibold: 600;
  --b40-font-weight-bold: 700;
  --b40-font-lineheight-tight: 1.15; /** Headings, KPI numbers */
  --b40-font-lineheight-snug: 1.25; /** Compact labels */
  --b40-font-lineheight-normal: 1.5; /** Body text */
  --b40-font-lineheight-relaxed: 1.625; /** Long-form text */
  --b40-font-tracking-tight: -0.025em; /** Large display numbers */
  --b40-font-tracking-normal: 0em;
  --b40-font-tracking-wide: 0.025em; /** Uppercase labels */
  --b40-font-tracking-widest: 0.1em; /** All-caps status badges */
  --b40-spacing-0: 0px;
  --b40-spacing-1: 0.125rem; /** 2px — hairline */
  --b40-spacing-2: 0.25rem; /** 4px */
  --b40-spacing-3: 0.375rem; /** 6px */
  --b40-spacing-4: 0.5rem; /** 8px */
  --b40-spacing-5: 0.625rem; /** 10px */
  --b40-spacing-6: 0.75rem; /** 12px */
  --b40-spacing-7: 0.875rem; /** 14px */
  --b40-spacing-8: 1rem; /** 16px — default element padding */
  --b40-spacing-10: 1.25rem; /** 20px */
  --b40-spacing-12: 1.5rem; /** 24px — card padding */
  --b40-spacing-14: 1.75rem; /** 28px */
  --b40-spacing-16: 2rem; /** 32px — section gap */
  --b40-spacing-20: 2.5rem; /** 40px */
  --b40-spacing-24: 3rem; /** 48px */
  --b40-spacing-32: 4rem; /** 64px */
  --b40-spacing-40: 5rem; /** 80px */
  --b40-spacing-48: 6rem; /** 96px */
  --b40-spacing-64: 8rem; /** 128px */
  --b40-spacing-80: 10rem; /** 160px */
  --b40-spacing-96: 12rem; /** 192px */
  --b40-spacing-inset-xs: 0.5rem; /** Tight padding — chips, tags */
  --b40-spacing-inset-sm: 0.75rem; /** Compact padding — small buttons */
  --b40-spacing-inset-md: 1rem; /** Default control padding */
  --b40-spacing-inset-lg: 1.5rem; /** Card padding */
  --b40-spacing-inset-xl: 2rem; /** Section padding */
  --b40-spacing-gap-xs: 0.5rem;
  --b40-spacing-gap-sm: 1rem;
  --b40-spacing-gap-md: 1.5rem;
  --b40-spacing-gap-lg: 2rem;
  --b40-spacing-gap-xl: 3rem;
  --b40-spacing-stack-xs: 0.5rem; /** Tight vertical rhythm */
  --b40-spacing-stack-sm: 1rem;
  --b40-spacing-stack-md: 2rem;
  --b40-spacing-stack-lg: 3rem;
  --b40-spacing-stack-xl: 4rem;
  --b40-radius-none: 0px; /** Default — cards, panels, data displays. Sharp = precision. */
  --b40-radius-xs: 2px; /** Subtle softening — table cells, chips */
  --b40-radius-sm: 3px; /** Interactive controls — buttons, inputs */
  --b40-radius-md: 4px; /** Maximum for standard UI elements */
  --b40-radius-full: 9999px; /** Pills, circular avatars, status dots */
  --b40-shadow-none: none;
  --b40-shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.40);
  --b40-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.50), 0 1px 2px -1px rgba(0, 0, 0, 0.30);
  --b40-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.50), 0 2px 4px -2px rgba(0, 0, 0, 0.30);
  --b40-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.60), 0 4px 6px -4px rgba(0, 0, 0, 0.30);
  --b40-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.60), 0 8px 10px -6px rgba(0, 0, 0, 0.30);
  --b40-shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.70);
  --b40-shadow-inner: inset 0 2px 4px 0 rgba(0, 0, 0, 0.40); /** Inset wells, gauge bezels */
  --b40-shadow-glow-brand: 0 0 12px 2px rgba(232, 148, 13, 0.25); /** Subtle orange glow — active/focused elements */
  --b40-shadow-glow-sm: 0 0 6px 1px rgba(232, 148, 13, 0.15); /** Faint brand glow — hover states */
  --b40-shadow-edge-top: inset 0 1px 0 0 rgba(255, 255, 255, 0.05); /** Top edge highlight — simulates light catch on raised panels */
  --b40-shadow-edge-all: inset 0 0 0 1px rgba(255, 255, 255, 0.05); /** Full edge highlight — subtle border alternative */
  --b40-shadow-light-sm: 0 1px 3px 0 rgba(30, 28, 24, 0.10), 0 1px 2px -1px rgba(30, 28, 24, 0.06);
  --b40-shadow-light-md: 0 4px 6px -1px rgba(30, 28, 24, 0.10), 0 2px 4px -2px rgba(30, 28, 24, 0.06);
  --b40-shadow-light-lg: 0 10px 15px -3px rgba(30, 28, 24, 0.10), 0 4px 6px -4px rgba(30, 28, 24, 0.06);
  --b40-motion-duration-instant: 0ms;
  --b40-motion-duration-fast: 100ms; /** Micro-interactions — button press */
  --b40-motion-duration-normal: 200ms; /** Panel transitions, dropdowns */
  --b40-motion-duration-slow: 300ms; /** Modals, page transitions */
  --b40-motion-duration-glacial: 500ms; /** Gauge needle sweeps */
  --b40-motion-easing-linear: linear;
  --b40-motion-easing-ease: ease;
  --b40-motion-easing-ease-in: cubic-bezier(0.4, 0, 1, 1);
  --b40-motion-easing-ease-out: cubic-bezier(0, 0, 0.2, 1);
  --b40-motion-easing-ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --b40-motion-easing-spring: cubic-bezier(0.34, 1.56, 0.64, 1); /** Gauge needle bounce */
  --b40-zindex-base: 0;
  --b40-zindex-raised: 10; /** Cards, lifted elements */
  --b40-zindex-dropdown: 100; /** Dropdowns, tooltips */
  --b40-zindex-sticky: 200; /** Sticky headers */
  --b40-zindex-overlay: 300; /** Dimmed overlays */
  --b40-zindex-modal: 400; /** Modal dialogs */
  --b40-zindex-toast: 500; /** Toast notifications */
  --b40-zindex-tooltip: 600; /** Tooltips above modals */
}