:root {
  color-scheme: dark;

  --font-sans: "IBM Plex Sans", "Segoe UI", Arial, sans-serif;
  --font-mono: "IBM Plex Mono", "JetBrains Mono", "Consolas", monospace;

  --text-xs: 12px;
  --text-sm: 13px;
  --text-md: 14px;
  --text-lg: 16px;
  --text-xl: 20px;
  --text-2xl: 26px;

  --space-1: 2px;
  --space-2: 4px;
  --space-3: 6px;
  --space-4: 8px;
  --space-5: 12px;
  --space-6: 16px;
  --space-7: 24px;
  --space-8: 32px;
  --chart-head: 28px;
  --quick-trade-height: 36px;
  --pane-head: 24px;

  --radius-1: 3px;
  --radius-2: 6px;
  --radius-3: 10px;
  --radius-4: 16px;

  --z-base: 1;
  --z-overlay: 40;
  --z-panel: 60;
  --z-modal: 80;
  --z-toast: 100;

  --duration-fast: 90ms;
  --duration-base: 160ms;
  --duration-slow: 280ms;

  --breakpoint-mobile: 640px;
  --breakpoint-tablet: 1024px;
  --breakpoint-laptop: 1440px;
  --breakpoint-desktop: 1920px;

  --color-bg: #070F13;
  --color-bg-soft: #101F26;
  --color-surface: #0C1A21;
  --color-surface-soft: #12242C;
  --color-surface-elevated: #172F39;
  --color-surface-inset: #0A151A;

  --color-border: #24404B;
  --color-border-soft: #2F4F5C;
  --color-border-strong: #5B8896;

  --color-text: #E9F3F2;
  --color-text-soft: #B5C9CB;
  --color-text-muted: #90A8AC;

  --color-accent: #2FD68D;
  --color-accent-hover: #4EE6A3;
  --color-accent-quiet: #123B2C;
  --color-accent-line: #1B7F55;
  --color-on-accent: #04160E;
  --color-accent-soft: rgba(47, 214, 141, .14);

  --color-bullish: #34D996;
  --color-bullish-deep: #7CF0BE;
  --color-bearish: #FF8592;
  --color-bearish-deep: #FFB3BC;
  --color-neutral: #90A8AC;

  --color-success-soft: rgba(52, 217, 150, .13);
  --color-danger-soft: rgba(255, 133, 146, .13);
  --color-warning-soft: rgba(255, 190, 74, .14);
  --color-info-soft: rgba(101, 205, 235, .13);

  --color-info: #64CDEB;
  --color-signal: #6FA8FF;
  --color-warning: #FFBE4A;
  --color-error: #FF8592;
  --color-on-warning: #06170F;

  --color-backdrop: rgba(3, 8, 11, .68);
  --color-float: rgba(13, 28, 35, .92);
  --color-highlight: rgba(255, 255, 255, .055);
  --color-scrollbar: #3A5A67;
  --color-scrollbar-hover: #5B8896;
  --color-focus: #4EE6A3;
  --color-qr-paper: #FFFFFF;
  --color-brand: #059657;
  --color-brand-alt: #FF7800;

  --shadow-1: 0 1px 2px rgba(0, 0, 0, .45);
  --shadow-2: 0 4px 14px rgba(0, 0, 0, .50);
  --shadow-3: 0 18px 44px rgba(0, 0, 0, .62);
  --shadow-inset: inset 0 1px 0 rgba(255, 255, 255, .04);

  --chart-bg: #0A151A;
  --chart-grid: #0A151A;
  --chart-border: #5B8896;
  --chart-crosshair: #7FA6B2;
  --chart-label-bg: #17303A;
  --chart-bullish: #34D996;
  --chart-bearish: #FA0A21;
  --chart-volume-up: #34D996;
  --chart-volume-down: #FA0A21;

  --series-1: #2FD68D;
  --series-2: #FF9A3C;
  --series-3: #64CDEB;
  --series-4: #FFBE4A;
  --series-5: #B096FF;
  --series-6: #FF8592;
  --series-7: #7DD3FC;
  --series-8: #F78FC0;
  --series-9: #A9DE62;
  --series-10: #CBD9DC;

  --drawing-default: #2FD68D;
  --drawing-handle: #E9F3F2;
  --drawing-selected: #FF9A3C;
}

[data-theme="light"] {
  color-scheme: light;

  --color-bg: #EEF2F4;
  --color-bg-soft: #F8FAFB;
  --color-surface: #FFFFFF;
  --color-surface-soft: #F4F7F8;
  --color-surface-elevated: #FFFFFF;
  --color-surface-inset: #E7EDF0;

  --color-border: #DCE3E7;
  --color-border-soft: #C6D0D6;
  --color-border-strong: #6E838F;

  --color-text: #16202A;
  --color-text-soft: #3D4C57;
  --color-text-muted: #465661;

  --color-accent: #056036;
  --color-accent-hover: #044C2B;
  --color-accent-quiet: #E2F4EA;
  --color-accent-line: #8FBFA4;
  --color-on-accent: #FFFFFF;
  --color-accent-soft: rgba(5, 96, 54, .10);

  --color-bullish: #045A33;
  --color-bullish-deep: #034828;
  --color-bearish: #99192A;
  --color-bearish-deep: #7C1122;
  --color-neutral: #465661;

  --color-success-soft: rgba(4, 90, 51, .10);
  --color-danger-soft: rgba(153, 25, 42, .09);
  --color-warning-soft: rgba(110, 66, 2, .12);
  --color-info-soft: rgba(8, 80, 108, .10);

  --color-info: #08506C;
  --color-signal: #1B44A2;
  --color-warning: #6E4202;
  --color-error: #99192A;
  --color-on-warning: #FFFFFF;

  --color-backdrop: rgba(22, 32, 42, .38);
  --color-float: rgba(255, 255, 255, .96);
  --color-highlight: rgba(22, 32, 42, .055);
  --color-scrollbar: #B4C2CA;
  --color-scrollbar-hover: #6E838F;
  --color-focus: #056036;
  --color-qr-paper: #FFFFFF;
  --color-brand: #059657;
  --color-brand-alt: #FF7800;

  --shadow-1: 0 1px 2px rgba(20, 45, 60, .10);
  --shadow-2: 0 4px 14px rgba(20, 45, 60, .12);
  --shadow-3: 0 18px 44px rgba(20, 45, 60, .18);
  --shadow-inset: inset 0 1px 0 rgba(255, 255, 255, .7);

  --chart-bg: #FBFDFD;
  --chart-grid: #FBFDFD;
  --chart-border: #6E838F;
  --chart-crosshair: #6E838F;
  --chart-label-bg: #E7EDF0;
  --chart-bullish: #045A33;
  --chart-bearish: #FA0A21;
  --chart-volume-up: #045A33;
  --chart-volume-down: #FA0A21;

  --series-1: #056036;
  --series-2: #A8470B;
  --series-3: #08506C;
  --series-4: #6E4202;
  --series-5: #5A2FBF;
  --series-6: #99192A;
  --series-7: #16588F;
  --series-8: #96205F;
  --series-9: #3F6308;
  --series-10: #3D4C57;

  --drawing-default: #056036;
  --drawing-handle: #16202A;
  --drawing-selected: #A8470B;
}

[hidden] { display: none !important; }