/* Trading Terminal design system tokens — extracted from the SKYAI token page export */
@layer{:root{--bg-base:#0b0e11;--bg-secondary:#14181d;--surface:#1b2026;--surface-elevated:#242a31;--surface-overlay:#2b323a;--state-hover:#f0f2f50d;--state-active:#f0f2f517;--state-selected:#5b8def24;--state-disabled-bg:#1f242a;--border-default:#30363d;--border-subtle:#24292f;--border-control:#6b7480;--border-strong:#48505a;--focus-ring:#7da4f2;--text-primary:#f0f2f5;--text-secondary:#a0a8b3;--text-tertiary:#707985;--text-disabled:#565e68;--text-inverse:#0b0e11;--text-link:#7da4f2;--accent:#5b8def;--accent-hover:#76a0f2;--accent-subtle:#5b8def24;--on-accent:#0b0e11;--positive:#19b99a;--positive-hover:#2bcbab;--positive-subtle:#19b99a1f;--on-positive:#0b0e11;--negative:#f05b70;--negative-hover:#f37587;--negative-subtle:#f05b701f;--on-negative:#0b0e11;--buy:#19b99a;--sell:#f05b70;--bid:#19b99a;--ask:#f05b70;--depth-bid:#19b99a24;--depth-ask:#f05b7024;--flash-up:#19b99a38;--flash-down:#f05b7038;--warning:#f2b84b;--warning-subtle:#f2b84b1f;--on-warning:#0b0e11;--liquidation:#ff8a4c;--liquidation-subtle:#ff8a4c24;--info:#5b8def;--status-connected:#19b99a;--status-reconnecting:#f2b84b;--status-disconnected:#f05b70;--status-stale:#707985;--risk-low:#19b99a;--risk-medium:#f2b84b;--risk-high:#ff8a4c;--risk-critical:#f05b70;--chart-bg:#1b2026;--chart-grid:#232930;--chart-axis:#a0a8b3;--chart-crosshair:#707985;--chart-tooltip-bg:#2b323a;--chart-tooltip-text:#f0f2f5;--candle-up:#19b99a;--candle-down:#f05b70;--volume-up:#19b99a59;--volume-down:#f05b7059;--chart-series-1:#5b8def;--chart-series-2:#c08bf0;--chart-series-3:#f2b84b;--chart-area:#5b8def29;--alloc-1:#5b8def;--alloc-2:#19b99a;--alloc-3:#c08bf0;--alloc-4:#f2b84b;--alloc-5:#707985;--scrim:#050709b8;--skeleton:#242a31;--skeleton-shine:#2b323a;--shadow-popover:0 8px 24px rgba(0, 0, 0, 0.45);--shadow-modal:0 16px 48px rgba(0, 0, 0, 0.6);--space-0-5:2px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--radius-xs:2px;--radius-sm:4px;--radius-md:6px;--radius-lg:8px;--radius-full:9999px;--control-xs:24px;--control-sm:28px;--control-md:32px;--control-lg:40px;--control-touch:44px;--row-compact:20px;--row-default:28px;--row-comfortable:40px;--nav-height:48px;--icon-sm:12px;--icon-md:16px;--bp-mobile:375px;--bp-tablet:768px;--bp-laptop:1024px;--bp-desktop:1440px;--bp-wide:1920px;--z-sticky:10;--z-dropdown:100;--z-popover:200;--z-modal:300;--z-toast:400;--opacity-disabled:0.45;--font-sans:Inter, system-ui, -apple-system, "Segoe UI", sans-serif;--font-mono:"IBM Plex Mono", "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--text-display:600 32px/40px var(--font-sans);--text-heading-1:600 24px/32px var(--font-sans);--text-heading-2:600 20px/28px var(--font-sans);--text-heading-3:600 16px/24px var(--font-sans);--text-body-lg:400 14px/20px var(--font-sans);--text-body:400 13px/18px var(--font-sans);--text-body-sm:400 12px/16px var(--font-sans);--text-caption:400 11px/14px var(--font-sans);--text-label:500 12px/16px var(--font-sans);--text-num-xl:500 20px/28px var(--font-mono);--text-num-lg:500 14px/20px var(--font-mono);--text-num:500 13px/18px var(--font-mono);--text-num-sm:500 12px/16px var(--font-mono);}}
/* Trading Terminal tokens as CSS variables (from the system's tokens.json). Dark is the default theme. */
:root, [data-theme="dark"] {
  --font-sans: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  --bg-base: #0B0E11; --bg-secondary: #14181D; --surface: #1B2026; --surface-elevated: #242A31; --surface-overlay: #2B323A;
  --state-hover: rgba(240, 242, 245, 0.05); --state-active: rgba(240, 242, 245, 0.09); --state-selected: rgba(91, 141, 239, 0.14); --state-disabled-bg: #1F242A;
  --border-default: #30363D; --border-subtle: #24292F; --border-control: #6B7480; --border-strong: #48505A; --focus-ring: #7DA4F2;
  --text-primary: #F0F2F5; --text-secondary: #A0A8B3; --text-tertiary: #707985; --text-disabled: #565E68; --text-inverse: #0B0E11; --text-link: #7DA4F2;
  --accent: #5B8DEF; --accent-hover: #76A0F2; --accent-subtle: rgba(91, 141, 239, 0.14); --on-accent: #0B0E11;
  --positive: #19B99A; --positive-hover: #2BCBAB; --positive-subtle: rgba(25, 185, 154, 0.12); --on-positive: #0B0E11;
  --negative: #F05B70; --negative-hover: #F37587; --negative-subtle: rgba(240, 91, 112, 0.12); --on-negative: #0B0E11;
  --depth-bid: rgba(25, 185, 154, 0.14); --depth-ask: rgba(240, 91, 112, 0.14);
  --flash-up: rgba(25, 185, 154, 0.22); --flash-down: rgba(240, 91, 112, 0.22);
  --warning: #F2B84B; --warning-subtle: rgba(242, 184, 75, 0.12); --on-warning: #0B0E11;
  --liquidation: #FF8A4C; --liquidation-subtle: rgba(255, 138, 76, 0.14);
  --status-stale: #707985;
  --chart-bg: #1B2026; --chart-grid: #232930; --chart-axis: #A0A8B3; --chart-crosshair: #707985; --chart-tooltip-bg: #2B323A; --chart-tooltip-text: #F0F2F5;
  --volume-up: rgba(25, 185, 154, 0.35); --volume-down: rgba(240, 91, 112, 0.35);
  --chart-series-2: #C08BF0; --chart-series-3: #F2B84B; --chart-area: rgba(91, 141, 239, 0.16);
  --alloc-1: #5B8DEF; --alloc-2: #19B99A; --alloc-3: #C08BF0; --alloc-4: #F2B84B; --alloc-5: #707985;
  --scrim: rgba(5, 7, 9, 0.72); --skeleton: #242A31; --skeleton-shine: #2B323A;
  --shadow-popover: 0 8px 24px rgba(0, 0, 0, 0.45); --shadow-modal: 0 16px 48px rgba(0, 0, 0, 0.6);
}
[data-theme="light"] {
  --bg-base: #F5F7F9; --bg-secondary: #FFFFFF; --surface: #FFFFFF; --surface-elevated: #F0F3F6; --surface-overlay: #FFFFFF;
  --state-hover: rgba(21, 26, 32, 0.04); --state-active: rgba(21, 26, 32, 0.08); --state-selected: rgba(42, 98, 204, 0.10); --state-disabled-bg: #EDF0F3;
  --border-default: #DCE1E7; --border-subtle: #E9EDF1; --border-control: #7E8895; --border-strong: #B9C1CB; --focus-ring: #2A62CC;
  --text-primary: #151A20; --text-secondary: #596473; --text-tertiary: #87919D; --text-disabled: #B4BCC6; --text-inverse: #FFFFFF; --text-link: #2A62CC;
  --accent: #2A62CC; --accent-hover: #2356B8; --accent-subtle: rgba(42, 98, 204, 0.10); --on-accent: #FFFFFF;
  --positive: #077D66; --positive-hover: #066B58; --positive-subtle: rgba(7, 125, 102, 0.09); --on-positive: #FFFFFF;
  --negative: #C92C45; --negative-hover: #B0243B; --negative-subtle: rgba(201, 44, 69, 0.08); --on-negative: #FFFFFF;
  --depth-bid: rgba(7, 125, 102, 0.12); --depth-ask: rgba(201, 44, 69, 0.11);
  --flash-up: rgba(7, 125, 102, 0.16); --flash-down: rgba(201, 44, 69, 0.14);
  --warning: #9A6200; --warning-subtle: rgba(154, 98, 0, 0.10); --on-warning: #FFFFFF;
  --liquidation: #C2410C; --liquidation-subtle: rgba(194, 65, 12, 0.10);
  --status-stale: #87919D;
  --chart-bg: #FFFFFF; --chart-grid: #EEF1F4; --chart-axis: #596473; --chart-crosshair: #87919D; --chart-tooltip-bg: #151A20; --chart-tooltip-text: #FFFFFF;
  --volume-up: rgba(7, 125, 102, 0.30); --volume-down: rgba(201, 44, 69, 0.28);
  --chart-series-2: #7B3FC4; --chart-series-3: #9A6200; --chart-area: rgba(42, 98, 204, 0.10);
  --alloc-1: #2A62CC; --alloc-2: #077D66; --alloc-3: #7B3FC4; --alloc-4: #B07A10; --alloc-5: #87919D;
  --scrim: rgba(21, 26, 32, 0.40); --skeleton: #E9EDF1; --skeleton-shine: #F3F5F8;
}
:root, [data-theme] {
  --buy: var(--positive); --sell: var(--negative); --bid: var(--positive); --ask: var(--negative); --info: var(--accent);
  --status-connected: var(--positive); --status-reconnecting: var(--warning); --status-disconnected: var(--negative);
  --risk-low: var(--positive); --risk-medium: var(--warning); --risk-high: var(--liquidation); --risk-critical: var(--negative);
  --candle-up: var(--positive); --candle-down: var(--negative); --chart-series-1: var(--accent);

  --space-0-5: 2px; --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px; --space-6: 24px; --space-8: 32px; --space-10: 40px; --space-12: 48px;
  --radius-xs: 2px; --radius-sm: 4px; --radius-md: 6px; --radius-lg: 8px; --radius-full: 9999px;
  --control-xs: 24px; --control-sm: 28px; --control-md: 32px; --control-lg: 40px; --control-touch: 44px;
  --row-compact: 20px; --row-default: 28px; --row-comfortable: 40px; --nav-height: 48px;
  --icon-sm: 12px; --icon-md: 16px;
  --z-sticky: 10; --z-dropdown: 100; --z-popover: 200; --z-modal: 300; --z-toast: 400;
  --opacity-disabled: 0.45;
}