body[data-theme="dre"] {
  --color-bg: #0B1416;
  --color-bg-alt: #101C1F;

  --color-surface: #111C1F;
  --color-surface-2: #16252A;
  --color-surface-soft: #1A2A2F;
  --color-surface-dark: #0E1A1D;
  --color-surface-dark-2: #091417;

  --color-text: #E6F1F1;
  --color-text-soft: #C8D6D5;
  --color-text-muted: #91A6A6;
  --color-text-on-dark: #EFF7F6;
  --color-text-on-dark-soft: rgba(231, 242, 241, 0.88);
  --color-text-on-dark-muted: rgba(185, 205, 202, 0.82);

  /* Muted light blocks visible in the Dre reference image */
  --color-contrast-surface: #DEE6E2;
  --color-contrast-surface-2: #EEF2EF;
  --color-contrast-soft: #D2DBD7;
  --color-text-on-contrast: #20302D;
  --color-text-on-contrast-soft: #526561;
  --color-text-on-contrast-muted: #7E8E89;

  --color-accent: #6FE1D3;
  --color-accent-2: #2EC4B6;
  --color-accent-3: #B9ECE5;
  --color-accent-strong: #2EC4B6;

  --color-border: rgba(93, 171, 170, 0.16);
  --color-border-soft: rgba(93, 171, 170, 0.10);
  --color-border-on-dark: rgba(111, 225, 211, 0.18);
  --color-border-on-contrast: rgba(32, 48, 45, 0.10);

  --shadow-soft: 0 14px 34px rgba(4, 11, 13, 0.24);
  --shadow-medium: 0 18px 40px rgba(4, 11, 13, 0.30);
  --shadow-dark: 0 18px 50px rgba(2, 10, 10, 0.34);

  --gradient-page:
    radial-gradient(circle at 12% 0%, rgba(46, 196, 182, 0.12), transparent 24%),
    radial-gradient(circle at 86% 10%, rgba(111, 225, 211, 0.10), transparent 24%),
    linear-gradient(180deg, #0B1416 0%, #0E181B 44%, #0A1214 100%);
  --gradient-surface:
    linear-gradient(180deg, #111C1F 0%, #0E181B 100%);
  --gradient-surface-soft:
    linear-gradient(180deg, #16252A 0%, #101A1D 100%);
  --gradient-hero:
    linear-gradient(180deg, #071115 0%, #081013 100%);
  --gradient-cta:
    linear-gradient(135deg, #2EC4B6, #67E1D3);
  --gradient-quote:
    linear-gradient(180deg, rgba(46, 196, 182, 0.12), rgba(111, 225, 211, 0.08));
  --gradient-contrast-surface:
    linear-gradient(180deg, #EEF2EF 0%, #DEE6E2 100%);
  --gradient-contrast-soft:
    linear-gradient(180deg, #DEE6E2 0%, #D2DBD7 100%);

  --glow-hero:
    radial-gradient(circle, rgba(46, 196, 182, 0.18), transparent 72%);
  --glow-logo:
    radial-gradient(circle, rgba(103, 225, 211, 0.14), transparent 66%);
}