:root {
  --color-bg: #131313;
  --color-surface: #1a1a1a;
  --color-surface-soft: #202020;
  --color-text: #ffffff;
  --color-text-muted: #cfcfcf;
  --color-primary-soft: #ffec90;
  --color-primary: #ffe046;
  --color-accent-warm: #ed6a4b;
  --color-accent-blue: #1786fe;
  --color-accent-blue-soft: #5aa9ff;
  --color-border: #343434;

  --surface-card: rgba(255, 255, 255, 0.05);
  --hairline-top: rgba(255, 255, 255, 0.07);

  --font-heading: "Dela Gothic One", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;

  --radius-pill: 99px;
  --radius-card: 24px;
  --radius-soft: 16px;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;

  --shadow-soft: 0 8px 20px rgba(0, 0, 0, 0.22);
  --shadow-card-hover: 0 16px 32px rgba(0, 0, 0, 0.32);
  --shadow-focus: 0 0 0 3px rgba(255, 224, 70, 0.28);

  --container: 1160px;

  --bg-halftone:
    radial-gradient(circle at 88% 6%, rgba(23, 134, 254, 0.1), transparent 40%),
    radial-gradient(circle at 5% 96%, rgba(255, 224, 70, 0.07), transparent 44%),
    radial-gradient(rgba(255, 255, 255, 0.028) 1px, transparent 1.4px);
  --bg-halftone-size: auto, auto, 10px 10px;

  --burst-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath fill='%23000' d='M50 4 L57.2 23 L73 10.2 L69.8 30.2 L89.8 27 L77 42.8 L96 50 L77 57.2 L89.8 73 L69.8 69.8 L73 89.8 L57.2 77 L50 96 L42.8 77 L27 89.8 L30.2 69.8 L10.2 73 L23 57.2 L4 50 L23 42.8 L10.2 27 L30.2 30.2 L27 10.2 L42.8 23 Z'/%3E%3C/svg%3E");
}