:root {
  /* Core brand tokens */
  --bg-base: #05080F;
  --bg-surface-low: #0B0F16;
  --bg-surface-mid: #141414;
  --bg-surface-high: #1E242F;
  --border-lines: #2B3240;
  --text-muted: #9CA3AF;
  --text-strong: #E5E7EB;
  --text-white: #FFFFFF;

  --accent-teal: #00E5FF;
  --accent-teal-subtle: #67E8F9;
  --accent-orange: #F97316;
  --accent-orange-subtle: #FDBA74;
  --accent-yellow: #FACC15;
  --accent-yellow-subtle: #FFE38A;
  --accent-success: #10B981;
  --accent-danger: #EF4444;

  --glass-bg-dark: rgba(15, 23, 42, 0.65);
  --glass-border-gradient: linear-gradient(135deg, #00E5FF 0%, #FACC15 50%, #F97316 100%);
  --glass-blur: blur(16px) saturate(130%);
  --elevation-shadow: 0 12px 30px rgba(0,0,0,0.45);

  --font-xs: 0.75rem;
  --font-sm: 0.875rem;
  --font-md: 1rem;
  --font-lg: 1.125rem;
  --font-xl: 1.5rem;
  --font-2xl: 2rem;
  --font-3xl: 2.75rem;

  --space-xxs: 4px;
  --space-xs: 8px;
  --space-sm: 12px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 40px;

  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-pill: 999px;

  /* Core backgrounds */
  --mtb-bg-0: #05080F;
  --mtb-bg-1: #0B0F16;
  --mtb-bg-2: #111827;
  --mtb-bg-3: #141414;

  --mtb-surface-low: #0B0F16;
  --mtb-surface-mid: #141414;
  --mtb-surface-high: #1E242F;

  --mtb-line: #2B3240;

  /* Text */
  --mtb-text-strong: #E5E7EB;
  --mtb-text-muted: #9CA3AF;
  --mtb-text-soft: #6B7280;
  --mtb-text-white: #FFFFFF;

  /* Accents */
  --mtb-accent-teal-a: #00E5FF;
  --mtb-accent-teal-b: #67E8F9;
  --mtb-accent-orange-a: #F97316;
  --mtb-accent-orange-b: #FDBA74;
  --mtb-accent-yellow-a: #FACC15;
  --mtb-accent-yellow-b: #FFE38A;
  --mtb-accent-green: #10B981;
  --mtb-accent-red: #EF4444;

  /* Gradients */
  --mtb-grad-teal-yellow: linear-gradient(135deg, var(--mtb-accent-teal-a), var(--mtb-accent-yellow-a), var(--mtb-accent-yellow-b));
  --mtb-grad-orange-yellow: linear-gradient(135deg, var(--mtb-accent-orange-a), var(--mtb-accent-orange-b), var(--mtb-accent-yellow-b));
  --mtb-grad-teal-orange: linear-gradient(145deg, var(--mtb-accent-teal-a), var(--mtb-accent-teal-b), var(--mtb-accent-orange-b), var(--mtb-accent-orange-a));

  /* Glass + blur */
  --mtb-glass-dark: rgba(16, 18, 24, 0.82);
  --mtb-glass-light: rgba(255, 255, 255, 0.8);
  --mtb-blur: blur(16px) saturate(130%);
  --mtb-border-glass: 1px solid transparent;

  /* Shadows */
  --mtb-shadow-card: 0 8px 20px rgba(0, 0, 0, 0.25);
  --mtb-shadow-glass: 0 12px 30px rgba(0, 0, 0, 0.45);
  --mtb-shadow-hover: 0 8px 24px rgba(0, 0, 0, 0.4);

  /* Radius */
  --mtb-radius-sm: 8px;
  --mtb-radius-md: 12px;
  --mtb-radius-lg: 16px;
  --mtb-radius-pill: 999px;

  /* Spacing */
  --mtb-space-1: 4px;
  --mtb-space-2: 8px;
  --mtb-space-3: 12px;
  --mtb-space-4: 16px;
  --mtb-space-5: 24px;
  --mtb-space-6: 32px;
  --mtb-space-7: 40px;

  /* Typography */
  --mtb-font-body: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mtb-font-heading: var(--mtb-font-body);
  --mtb-fs-xs: 12px;
  --mtb-fs-sm: 14px;
  --mtb-fs-md: 16px;
  --mtb-fs-lg: 18px;
  --mtb-fs-xl: 24px;
  --mtb-fs-2xl: 32px;
  --mtb-fs-3xl: 44px;
  --mtb-lh-body: 1.5;
  --mtb-lh-heading: 1.2;
}

:root.theme-light {
  --mtb-bg-0: #F9FAFB;
  --mtb-bg-1: #FFFFFF;
  --mtb-bg-2: #E5E7EB;
  --mtb-bg-3: #D1D5DB;
  --mtb-text-strong: #111827;
  --mtb-text-muted: #374151;
  --mtb-text-soft: #6B7280;
  --mtb-text-white: #000000;
  --mtb-glass-dark: rgba(255, 255, 255, 0.75);
  --mtb-shadow-card: 0 4px 12px rgba(0, 0, 0, 0.1);
}
