:root {
  --bg-deep: #050810;
  --bg-base: #0A1020;
  --bg-card: #121A2E;
  --bg-elevated: #1A2440;
  --bg-hover: #223050;

  --gold: #E4AC38;
  --gold-soft: #FFCC66;
  --blue: #2082F0;
  --cyan: #00FFFF;
  --orange: #E84D1E;
  --purple: #6834BE;
  --emerald: #10B981;
  --pink: #EC4899;
  --amber: #F59E0B;
  --red: #EF4444;

  --chess-primary: #2563EB;
  --chess-secondary: #F5B731;
  --ludo-primary: #8B5CF6;
  --ludo-secondary: #EC4899;
  --domino-primary: #10B981;
  --domino-secondary: #06B6D4;
  --backgammon-primary: #F59E0B;
  --backgammon-secondary: #EF4444;

  --bg-board-border: #5C3A0E;
  --bg-board-light: #3D6B1E;
  --bg-board-dark: #2D5016;
  --bg-bar-dark: #2A1800;
  --bg-bar-light: #3D2B1A;
  --bg-bearoff: #1A0E00;
  --bg-point-dark: #8B4513;
  --bg-point-dark-tip: #5C2D0A;
  --bg-point-light: #D2691E;
  --bg-point-light-tip: #A0522D;
  --bg-checker-white: #F5E6D3;
  --bg-checker-black: #2A2A2A;
  --bg-highlight: #10B981;
  --bg-selected: #FFD700;

  --text-primary: #F8FAFC;
  --text-secondary: #94A3B8;
  --text-muted: #475569;

  --success: #34D399;
  --error: #EF4444;
  --warning: #F59E0B;
  --win: #34D399;
  --loss: #F87171;

  --border: rgba(255,255,255,0.06);
  --border-hover: rgba(255,255,255,0.12);
  --border-active: rgba(32,130,240,0.4);

  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 20px;
  --r-2xl: 24px;
  --r-full: 9999px;

  --s-1: 4px; --s-2: 8px; --s-3: 12px;
  --s-4: 16px; --s-5: 20px; --s-6: 24px;
  --s-8: 32px; --s-10: 40px; --s-12: 48px;
  --s-16: 64px;

  --font-ar: 'IBM Plex Sans Arabic', sans-serif;
  --font-lat: 'Inter', sans-serif;
  --font-mono: 'IBM Plex Mono', monospace;

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-in: cubic-bezier(0.4, 0, 1, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast: 150ms;
  --dur-normal: 250ms;
  --dur-slow: 400ms;

  --shadow-sm: 0 2px 8px rgba(0,0,0,0.3);
  --shadow-md: 0 4px 16px rgba(0,0,0,0.4);
  --shadow-lg: 0 8px 32px rgba(0,0,0,0.5);
  --shadow-glow: 0 0 20px rgba(228,172,56,0.3);

  --hud-height: 56px;
  --tab-height: 64px;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}
