/**
 * Shared design tokens — single source for Legend, landing, auth pages.
 * Mirrors Tailwind extend.colors in templates/landing.html.
 */
:root {
  --banana-background: #0e0e0e;
  --banana-surface: #0e0e0e;
  --banana-surface-dim: #0e0e0e;
  --banana-surface-container-low: #131313;
  --banana-surface-container: #1a1a1a;
  --banana-surface-container-high: #20201f;
  --banana-surface-container-highest: #262626;
  --banana-surface-container-lowest: #000000;
  --banana-surface-bright: #2c2c2c;
  --banana-surface-variant: #262626;
  --banana-surface-tint: #f3ffca;
  --banana-on-surface: #ffffff;
  --banana-on-background: #ffffff;
  /* Body text on dark surfaces (between on-surface and muted) */
  --banana-text-body: #e0e0e0;
  --banana-on-surface-variant: #adaaaa;
  --banana-inverse-on-surface: #565555;
  --banana-inverse-surface: #fcf9f8;
  --banana-outline: #767575;
  --banana-outline-variant: #484847;
  --banana-primary: #f3ffca;
  --banana-primary-fixed: #cafd00;
  --banana-primary-fixed-dim: #beee00;
  --banana-primary-container: #cafd00;
  --banana-primary-dim: #beee00;
  --banana-on-primary: #516700;
  --banana-on-primary-fixed: #3a4a00;
  --banana-on-primary-fixed-variant: #526900;
  --banana-on-primary-container: #4a5e00;
  --banana-accent-lime: #ccff00;
  --banana-secondary: #ece856;
  --banana-secondary-fixed: #ece856;
  --banana-secondary-dim: #ddda49;
  --banana-secondary-fixed-dim: #ddda49;
  --banana-secondary-container: #636100;
  --banana-on-secondary: #565400;
  --banana-on-secondary-container: #fffca4;
  --banana-on-secondary-fixed: #434100;
  --banana-on-secondary-fixed-variant: #605e00;
  --banana-tertiary: #ffeea5;
  --banana-tertiary-fixed: #fce047;
  --banana-tertiary-container: #fce047;
  --banana-tertiary-dim: #edd13a;
  --banana-tertiary-fixed-dim: #edd13a;
  --banana-on-tertiary: #665800;
  --banana-on-tertiary-fixed: #483d00;
  --banana-on-tertiary-container: #5d5000;
  --banana-on-tertiary-fixed-variant: #685900;
  --banana-error: #ff7351;
  --banana-error-dim: #d53d18;
  --banana-error-container: #b92902;
  --banana-on-error: #450900;
  --banana-on-error-container: #ffd2c8;
  --banana-inverse-primary: #516700;
  /* Chart-adjacent UI (keep static/js/legend.js BANANA_CHART_COLORS in sync) */
  --banana-chart-price: #42a5f5;
  /* Call / bullish series — citrus lime (#ccff00 family); muted = primary_dim for fills/secondary emphasis */
  --banana-chart-call: #ccff00;
  --banana-chart-call-muted: #beee00;
  --banana-chart-put: #ff7351;
  --banana-chart-bear: #ff7351;
  --banana-chart-put-muted: #ff9a7d;
  /* Volume / secondary series: theme yellow (replaces amber #ffc107) */
  --banana-chart-volume: #fce047;

  /* Cyber-Citrus elevation & boundaries — see docs/cyber-citrus-design-system.md §2–§4 */
  --banana-outline-ghost: color-mix(in srgb, var(--banana-outline-variant) 15%, transparent);
  /* Ambient "neon hum" for active/selected emphasis (primary @ low opacity, wide blur) */
  --banana-shadow-neon-hum: 0 0 32px rgba(243, 255, 202, 0.07);
  /* Floating glass panels (HUD overlays) */
  --banana-glass-surface: color-mix(in srgb, var(--banana-surface-container-high) 72%, transparent);
  --banana-glass-blur: 20px;
}