/* Design Tokens - Auto-generated */
/* Do not edit directly - modify tokens.json instead */

/* === PRIMITIVES === */
:root {
  --primitive-color-brand-cyan: #4FA8C9;
  --primitive-color-brand-cyanLight: #7FC5E3;
  --primitive-color-brand-cyanDark: #356E92;
  --primitive-color-brand-purple: #B084D4;
  --primitive-color-brand-purpleDeep: #4A2D73;
  --primitive-color-brand-purpleDark: #35204F;
  --primitive-color-brand-orange: #F3773B;
  --primitive-color-brand-orangeLight: #F79B6E;
  --primitive-color-brand-orangeDark: #C73E15;
  --primitive-color-brand-yellow: #C9A227;
  --primitive-color-brand-yellowBright: #FCCF05;
  --primitive-color-dark-bg: #0B0F19;
  --primitive-color-dark-surface1: #1F242B;
  --primitive-color-dark-surface2: #161B26;
  --primitive-color-dark-surface3: #232A33;
  --primitive-color-dark-surface4: #2E3743;
  --primitive-color-dark-border: #2A3140;
  --primitive-color-dark-borderInteractive: #5C6678;
  --primitive-color-light-text1: #F8FAFB;
  --primitive-color-light-text2: #B8C0CC;
  --primitive-color-light-text3: #98A2AD;
  --primitive-color-light-onPrimary: #0B0F19;
  --primitive-color-state-success: #67C23A;
  --primitive-color-state-warning: #E5A32E;
  --primitive-color-state-danger: #F56C6C;
  --primitive-color-state-info: #7FC5E3;
  --primitive-color-state-teal: #4DD0E1;
  --primitive-color-state-tealFill: #2A8E9C;
  --primitive-color-alarm-critical: #F56C6C;
  --primitive-color-alarm-high: #E5A32E;
  --primitive-color-alarm-low: #7FC5E3;
  --primitive-color-alarm-noData: #5C6678;
  --primitive-color-alarm-stale: #B89A20;
  --primitive-color-alarm-acked: #C9A227;
  --primitive-color-ramp-seq1: #356E92;
  --primitive-color-ramp-seq2: #4FA8C9;
  --primitive-color-ramp-seq3: #7FC5E3;
  --primitive-color-ramp-seq4: #9BDDF2;
  --primitive-color-ramp-seq5: #C9EBF8;
  --primitive-color-ramp-divLow: #B084D4;
  --primitive-color-ramp-divMid: #F8FAFB;
  --primitive-color-ramp-divHigh: #F3773B;
  --primitive-font-sans: 'Inter', 'Open Sans', -apple-system, 'Segoe UI', sans-serif;
  --primitive-font-mono: 'JetBrains Mono', 'Cascadia Mono', 'Consolas', monospace;
  --primitive-space-1: 4px;
  --primitive-space-2: 8px;
  --primitive-space-3: 12px;
  --primitive-space-4: 16px;
  --primitive-space-5: 20px;
  --primitive-space-6: 24px;
  --primitive-space-8: 32px;
  --primitive-space-10: 40px;
  --primitive-space-12: 48px;
  --primitive-space-16: 64px;
  --primitive-radius-sm: 4px;
  --primitive-radius-md: 8px;
  --primitive-radius-lg: 12px;
  --primitive-radius-xl: 16px;
  --primitive-duration-micro: 180ms;
  --primitive-duration-transition: 350ms;
  --primitive-elevation-flat: none;
  --primitive-elevation-raised: 0 1px 3px rgba(0,0,0,0.4), 0 0 0 1px rgba(255,255,255,0.04);
  --primitive-elevation-floating: 0 4px 12px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,255,255,0.06);
  --primitive-elevation-overlay: 0 8px 32px rgba(0,0,0,0.65), 0 0 0 1px rgba(255,255,255,0.08);
  --primitive-zindex-base: 0;
  --primitive-zindex-dropdown: 100;
  --primitive-zindex-sticky: 200;
  --primitive-zindex-modal: 300;
  --primitive-zindex-toast: 400;
  --primitive-layout-containerMax: 1280px;
  --primitive-layout-gutter: 24px;
  --primitive-layout-bpSm: 640px;
  --primitive-layout-bpMd: 960px;
  --primitive-layout-bpLg: 1280px;
  --primitive-layout-bpXl: 1600px;
  --primitive-density-compactRow: 32px;
  --primitive-density-comfortableRow: 44px;
  --primitive-density-spaciousRow: 56px;
  --primitive-icon-sm: 16px;
  --primitive-icon-md: 20px;
  --primitive-icon-lg: 24px;
}

/* === SEMANTIC === */
:root {
  --color-primary: #4FA8C9;
  --color-primaryHover: #7FC5E3;
  --color-primaryFilled: #356E92;
  --color-secondary: #B084D4;
  --color-accentWarm: #F3773B;
  --color-highlight: #C9A227;
  --color-bg: #0B0F19;
  --color-surface1: #1F242B;
  --color-surface2: #161B26;
  --color-surface3: #232A33;
  --color-surface4: #2E3743;
  --color-border: #2A3140;
  --color-borderInteractive: #5C6678;
  --color-text1: #F8FAFB;
  --color-text2: #B8C0CC;
  --color-text3: #98A2AD;
  --color-textOnPrimary: #0B0F19;
  --color-focusRing: #4FA8C9;
  --color-success: #67C23A;
  --color-warning: #E5A32E;
  --color-danger: #F56C6C;
  --color-info: #7FC5E3;
  --color-alarmCritical: #F56C6C;
  --color-alarmHigh: #E5A32E;
  --color-alarmLow: #7FC5E3;
  --color-alarmNoData: #5C6678;
  --color-alarmStale: #B89A20;
  --color-alarmAcked: #C9A227;
  --color-dataOil: #C08552;
  --color-dataInjection: #3E7BDB;
  --color-dataGas: #FCCF05;
  --color-dataPressure: #B084D4;
  --color-dataAlert: #F56C6C;
  --font-sans: 'Inter', 'Open Sans', -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', 'Cascadia Mono', 'Consolas', monospace;
  --font-numeric: 'JetBrains Mono', 'Cascadia Mono', 'Consolas', monospace;
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-xxl: 48px;
  --space-2xl: 64px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --duration-micro: 180ms;
  --duration-transition: 350ms;
  --elevation-flat: none;
  --elevation-raised: 0 1px 3px rgba(0,0,0,0.4), 0 0 0 1px rgba(255,255,255,0.04);
  --elevation-floating: 0 4px 12px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,255,255,0.06);
  --elevation-overlay: 0 8px 32px rgba(0,0,0,0.65), 0 0 0 1px rgba(255,255,255,0.08);
  --zindex-base: 0;
  --zindex-dropdown: 100;
  --zindex-sticky: 200;
  --zindex-modal: 300;
  --zindex-toast: 400;
  --layout-containerMax: 1280px;
  --layout-gutter: 24px;
  --density-compact: 32px;
  --density-comfortable: 44px;
  --density-spacious: 56px;
}

/* === COMPONENTS === */
:root {
  --button-bg: #4FA8C9;
  --button-text: #0B0F19;
  --button-bgHover: #7FC5E3;
  --button-bgFilled: #356E92;
  --button-radius: 8px;
  --button-padding: 8px 16px;
  --card-bg: #1F242B;
  --card-border: 1px solid #2A3140;
  --card-radius: 12px;
  --card-padding: 24px;
  --card-shadow: 0 1px 3px rgba(0,0,0,0.4), 0 0 0 1px rgba(255,255,255,0.04);
  --input-border: 1px solid #5C6678;
  --input-focusRing: #4FA8C9;
  --table-rowCompact: 32px;
  --table-rowComfortable: 44px;
  --table-headerBg: #232A33;
  --table-zebraBg: #161B26;
  --table-numericFont: 'JetBrains Mono', 'Cascadia Mono', 'Consolas', monospace;
  --dashboard-panelBg: #161B26;
  --dashboard-gridLine: #2A3140;
  --dashboard-valueFont: 'JetBrains Mono', 'Cascadia Mono', 'Consolas', monospace;
  --hero-bg: #0B0F19;
  --hero-titleSize: clamp(2rem, 5vw, 3.5rem);
  --hero-subtitleColor: #98A2AD;
}