:root {
  /* Spacing */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;

  /* Typography */
  --font-family: Arial, Helvetica, sans-serif;
  --font-size-base: 14px;
  --font-size-sm: 12px;
  --font-size-lg: 18px;
  --font-size-xl: 24px;
  --line-height-base: 1.5;

  /* Borders */
  --border-color: #dadada;
  --border-color-light: #e7e7e7;
  --border-radius: 4px;
  --border-width: 1px;

  /* Surfaces */
  --surface-bg: #ffffff;
  --surface-bg-alt: #f7f7f7;
  --surface-bg-raised: #ffffff;
  --surface-bg-sunken: #e7e7e7;
  --surface-overlay: rgba(255, 255, 255, 0.9);

  /* Text */
  --text-primary: #585858;
  --text-secondary: #676767;
  --text-muted: #999999;
  --text-inverse: #ffffff;
  --text-link: #585858;
  --text-link-hover: #65b3e6;

  /* Interactive */
  --interactive-bg: #f8f8f8;
  --interactive-bg-hover: #eeeeee;
  --interactive-border: #dadada;
  --interactive-focus-ring: #65b3e6;

  /* Status */
  --status-error-bg: #ffced5;
  --status-error-text: #b30000;
  --status-warning-bg: #fff7ce;
  --status-warning-text: #8a6d3b;
  --status-success-bg: #e7ffd4;
  --status-success-text: #3c763d;
  --status-info-bg: #d0d0ff;
  --status-info-text: #31708f;

  /* Sidebar/Nav */
  --nav-bg: whitesmoke;
  --nav-text: #676767;
  --nav-text-hover: #333333;
  --nav-active-bg: #e0e0e0;
  --nav-active-text: #333333;
  --nav-border: #dadada;
  --nav-separator: #cccccc;
  --nav-width: 250px;

  /* Game Accents */
  --game-iidx: #A12A5E;
  --game-popn: #ED0345;
  --game-ddr: #017351;
  --game-sdvx: #710162;
  --game-jubeat: #FBBF45;
  --game-museca: #AAD962;
  --game-reflec: #03C383;
  --game-mga: #ff0000;
  --game-bishi: #EF6A32;

   /* Miscellaneous */
   --status-error-border: #ffb3b3;
   --status-error-dark: #8b0000;
   --status-error-main: #dc2626;
   --status-warning-border: #ffe066;
   --status-warning-dark: #7c2d12;
   --status-warning-main: #f59e0b;
   --status-success-border: #b3e6b3;
   --status-success-dark: #065f46;
   --status-success-main: #10b981;
   --status-info-border: #b3b3ff;
   --status-info-dark: #1e3a8a;
   --status-info-main: #3b82f6;
   --tooltip-bg: #333;
   --tooltip-text: #fff;
   --tooltip-border: #555;
   --slider-on-bg: #6eb9f7;
   --slider-on-border: #3da2f5;
   --slider-off-bg: #cccccc;
   --slider-off-border: #a0a0a0;
   --alert-text: #459900;
   --btn-delete-border: #d9534f;
   --btn-delete-bg: #ffe4e4;
   --btn-delete-text: #d9534f;
   --btn-active-border: #4cae4c;
   --btn-active-shadow: rgba(76,174,76,0.3);
   --overlay-bg: rgba(0,0,0,0.5);
   --pill-border: #ff0000;
   --pill-bg: #ffb3d9;
   --slider-ball-bg: #ffffff;
}