:root {
  color-scheme: dark;

  /* 8BIT.C semantic brand layer. */
  --brand-canvas: #090a0c;
  --brand-surface: #111318;
  --brand-surface-raised: #16191f;
  --brand-text: #f4f1ea;
  --brand-text-muted: #8b9098;
  --brand-accent: #f7931a;
  --market-up: #3caea3;
  --market-down: #d96c6c;
  --brand-border: rgba(244, 241, 234, 0.10);
  --chart-grid: rgba(244, 241, 234, 0.07);
  --brand-header-fragment-opacity: 0.085;
  --brand-panel-fragment-opacity: 0.07;
  --brand-watermark-opacity: 0.05;
  --brand-panel-fragment-width: 76%;

  /* Compatibility aliases used by the existing application. */
  --bg: var(--brand-canvas);
  --chart-bg: var(--brand-canvas);
  --panel: var(--brand-surface);
  --panel-2: #0d0f13;
  --panel-3: var(--brand-surface-raised);
  --panel-glass: rgba(17, 19, 24, 0.92);
  --border: var(--brand-border);
  --text: var(--brand-text);
  --muted: var(--brand-text-muted);
  --soft-text: #cbc8c1;
  --blue: var(--brand-accent);
  --blue-soft: rgba(247, 147, 26, 0.11);
  --green: var(--market-up);
  --red: var(--market-down);
  --bitcoin: var(--brand-accent);
  --yellow: #c8a84e;
  --focus: 0 0 0 3px rgba(247, 147, 26, 0.24);
  --shadow: 0 14px 36px rgba(0, 0, 0, 0.24);
  --surface-gradient: none;
  --floating-surface: rgba(17, 19, 24, 0.97);
  --floating-border: rgba(244, 241, 234, 0.14);
  --floating-shadow: 0 14px 34px rgba(0, 0, 0, 0.28);
  --profile-shade: rgba(0, 0, 0, 0.54);
  --loader-track: rgba(244, 241, 234, 0.16);
}

:root[data-theme="light"] {
  color-scheme: light;
  --brand-canvas: #f1eee7;
  --brand-surface: #fbf9f4;
  --brand-surface-raised: #fffdf8;
  --brand-text: #1d1b18;
  --brand-text-muted: #706c64;
  --brand-accent: #d87500;
  --market-up: #247f74;
  --market-down: #b84f52;
  --brand-border: rgba(45, 39, 31, 0.13);
  --chart-grid: rgba(45, 39, 31, 0.075);
  --brand-header-fragment-opacity: 0.065;
  --brand-panel-fragment-opacity: 0.045;
  --brand-watermark-opacity: 0.05;
  --brand-panel-fragment-width: 76%;

  --bg: var(--brand-canvas);
  --chart-bg: #f8f6f0;
  --panel: #fffdf9;
  --panel-2: #f4f0e8;
  --panel-3: #f8f5ef;
  --panel-glass: rgba(255, 253, 249, 0.94);
  --border: var(--brand-border);
  --text: var(--brand-text);
  --muted: var(--brand-text-muted);
  --soft-text: #45413b;
  --blue: var(--brand-accent);
  --blue-soft: rgba(216, 117, 0, 0.09);
  --green: var(--market-up);
  --red: var(--market-down);
  --bitcoin: var(--brand-accent);
  --yellow: #8e731d;
  --focus: 0 0 0 3px rgba(216, 117, 0, 0.18);
  --shadow: 0 12px 30px rgba(54, 43, 28, 0.09);
  --surface-gradient: none;
  --floating-surface: rgba(255, 253, 249, 0.985);
  --floating-border: rgba(45, 39, 31, 0.14);
  --floating-shadow: 0 14px 32px rgba(54, 43, 28, 0.13);
  --profile-shade: rgba(70, 56, 35, 0.10);
  --loader-track: rgba(45, 39, 31, 0.14);
}