/* 9) Synthwave Islands */
html[data-theme="synthwave-islands"] {
      --bg: #070014;
      --bg-alt: #02000a;
      --surface: rgba(3, 0, 24, 0.9);
      --surface-soft: rgba(10, 0, 35, 0.85);
      --border-subtle: rgba(244, 114, 182, 0.6);
      --accent: #f472b6;
      --accent-soft: #22d3ee;
      --text: #fdf2ff;
      --muted: #e9d5ff;
      --chip-bg: rgba(15, 23, 42, 0.4);
      --hero-glow-1: rgba(244, 114, 182, 0.45);
      --hero-glow-2: rgba(34, 211, 238, 0.35);
      --accent-strong: #fb7185;
      --card-border-strong: rgba(244, 114, 182, 0.85);

      --radius-lg: 20px;
      --radius-md: 16px;
      --radius-pill: 999px;
    }

/* Synthwave Islands */
html[data-theme="synthwave-islands"] body {
      background:
        radial-gradient(circle at 10% 0%, rgba(244, 114, 182, 0.5), transparent 60%),
        radial-gradient(circle at 90% 90%, rgba(56, 189, 248, 0.5), transparent 60%),
        radial-gradient(circle at 50% 110%, rgba(37, 99, 235, 0.8), #02000a);
      background-attachment: fixed;
    }
html[data-theme="synthwave-islands"] .hero-panel,
html[data-theme="synthwave-islands"] .feature-card,
html[data-theme="synthwave-islands"] .plan,
html[data-theme="synthwave-islands"] .card {
      backdrop-filter: blur(18px);
      background: linear-gradient(
        135deg,
        rgba(15, 23, 42, 0.8),
        rgba(15, 23, 42, 0.3)
      );
      border-radius: 22px;
      border: 1px solid rgba(244, 114, 182, 0.7);
      box-shadow:
        0 0 40px rgba(244, 114, 182, 0.4),
        0 30px 80px rgba(15, 23, 42, 0.9);
    }