:root {
  /* Colors */
  --color-bg: #080807;
  --color-bg-soft: #34120b;
  --color-surface: #0f0f0e;
  --color-primary: #e74627;
  --color-primary-soft: rgba(231, 70, 39, 0.1);
  --color-primary-border: rgba(231, 70, 39, 0.3);
  --color-text: #ffffff;
  --color-text-muted: #d5d4db;
  --color-success: #00d116;
  --color-rating: #fbb600;

  /* Gradients */
  --gradient-heading: linear-gradient(90deg, var(--color-primary), #ffffff);
  --gradient-panel: linear-gradient(90deg, #080807, var(--color-bg-soft), #080807);
  --gradient-card: linear-gradient(90deg, rgba(231, 70, 39, 0), var(--color-primary));

  /* Typography */
  --font-family-base: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-family-mono: "SF Mono", ui-monospace, "IBM Plex Mono", monospace;

  /* Radii */
  --radius-pill: 999px;
  --radius-lg: 30px;
  --radius-md: 20px;
  --radius-sm: 10px;

  /* Layout */
  --container-max-width: 1338px;
  --container-padding: 24px;

  /* Breakpoints (reference only, see media queries in styles.css) */
  --bp-tablet: 900px;
  --bp-mobile: 480px;
}