:root {
  /* Teenage Engineering Palette - Dark mode default */
  --bg-color: #0a0a0a;
  --text-main: #e4e4e4;
  --text-dim: #888888;
  --accent-orange: #ff4d00;
  --grid-line: #333333;
  --product-bg: #1a1a1a;
  --product-bg-hover: #2a2a2a;
  
  /* Typos */
  --font-main: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  --spacing-unit: 8px;
  
  /* Layout */
  --header-height: 60px;
}

@media (prefers-color-scheme: light) {
  :root {
    /* Light mode overrides */
    --bg-color: #e4e4e4;
    --text-main: #000000;
    --text-dim: #666666;
    --grid-line: #cccccc;
    --product-bg: #f5f5f5;
    --product-bg-hover: #ffffff;
  }
}