/* Suggested gradients per palette (PROPOSED, 2026-10-06). Built from the colour research:
   - keep saturation low on large areas (research rule R4: saturated colour is a small share of the screen);
   - no animated gradients (motion distracts ADHD readers);
   - text sits on every stop at >= 4.5:1 (checked by scripts/check-gradients.mjs);
   - no red / rose / mauve stops (owner rule: site colours are not the product colours).
   Tokens:
   --grad-hero    large page or hero background, very subtle
   --grad-accent  buttons, badges, highlight bars (text: --color-on-accent)
   --grad-glow    soft radial glow layered behind a section (decorative, no text contrast role)
   --grad-mood    one bold feature band per page at most (text: --grad-mood-fg) */

[data-palette="1"] { /* Deep Teal, dark */
  --grad-hero: linear-gradient(160deg, #0c1a1d 0%, #12302f 55%, #1b2f3f 100%);
  --grad-accent: linear-gradient(135deg, #3dbcab 0%, #6fc9e0 100%);
  --grad-glow: radial-gradient(circle at 20% 0%, rgba(61, 188, 171, 0.22), transparent 60%);
  --grad-mood: linear-gradient(120deg, #0f3a3a 0%, #1f3d5c 55%, #2c2f5e 100%);
  --grad-mood-fg: #e6eeec;
}
[data-palette="2"] { /* Daylight Amber, light */
  --grad-hero: linear-gradient(160deg, #f6f6f3 0%, #fbf1dc 60%, #f6efe4 100%);
  --grad-accent: linear-gradient(135deg, #c27f00 0%, #e0a23a 100%);
  --grad-glow: radial-gradient(circle at 80% 0%, rgba(224, 162, 58, 0.22), transparent 60%);
  --grad-mood: linear-gradient(120deg, #f3e2bd 0%, #ece0cf 50%, #dcdfe9 100%);
  --grad-mood-fg: #1c1b17;
}
[data-palette="3"] { /* Cobalt Studio, light */
  --grad-hero: linear-gradient(160deg, #f4f7fb 0%, #e8eefc 60%, #eef3f8 100%);
  --grad-accent: linear-gradient(135deg, #2450d6 0%, #4a3fc4 100%);
  --grad-glow: radial-gradient(circle at 20% 0%, rgba(36, 80, 214, 0.14), transparent 60%);
  --grad-mood: linear-gradient(120deg, #1d3fa8 0%, #33309a 55%, #1e5a87 100%);
  --grad-mood-fg: #ffffff;
}
[data-palette="4"] { /* Plum Linen, light */
  --grad-hero: linear-gradient(160deg, #f4f0eb 0%, #ebe8f2 60%, #f6eee6 100%);
  --grad-accent: linear-gradient(135deg, #5a2f86 0%, #732da9 100%);
  --grad-glow: radial-gradient(circle at 15% 0%, rgba(115, 45, 169, 0.12), transparent 55%),
               radial-gradient(circle at 90% 20%, rgba(233, 169, 130, 0.20), transparent 55%);
  --grad-mood: linear-gradient(120deg, #efd9c7 0%, #e6dbe9 60%, #ddd3ec 100%);
  --grad-mood-fg: #2a2430;
}
[data-palette="5"] { /* Sea Glass, light */
  --grad-hero: linear-gradient(160deg, #f3efea 0%, #e6efe9 60%, #eaf1f0 100%);
  --grad-accent: linear-gradient(135deg, #226f6a 0%, #1f6478 100%);
  --grad-glow: radial-gradient(circle at 85% 0%, rgba(34, 111, 106, 0.14), transparent 60%);
  --grad-mood: linear-gradient(120deg, #d6e8df 0%, #d9e6ee 55%, #efe4d6 100%);
  --grad-mood-fg: #232a28;
}
[data-palette="6"] { /* Dusk Plum, dark */
  --grad-hero: linear-gradient(160deg, #1c1724 0%, #2a1e3b 60%, #2b2238 100%);
  --grad-accent: linear-gradient(135deg, #e9a982 0%, #f2c7a5 100%);
  --grad-glow: radial-gradient(circle at 20% 0%, rgba(233, 169, 130, 0.20), transparent 60%);
  --grad-mood: linear-gradient(120deg, #3d2456 0%, #452a5a 50%, #5e4630 100%);
  --grad-mood-fg: #efe9e4;
}

/* PV: palettes 7-10. Same rules as above. Palette 8 is preview only and is exempt from the red/rose stop guard. */
[data-palette="7"] { /* Plum Peach, light: peach carries the large areas, plum the small ones */
  --grad-hero: linear-gradient(160deg, #f6efe8 0%, #f7e2d1 55%, #ece3f0 100%);
  --grad-accent: linear-gradient(135deg, #5a2f86 0%, #7a2db0 100%);
  --grad-glow: radial-gradient(circle at 12% 0%, rgba(240, 160, 110, 0.38), transparent 55%),
               radial-gradient(circle at 92% 15%, rgba(115, 45, 169, 0.16), transparent 55%);
  --grad-mood: linear-gradient(120deg, #f4c9a6 0%, #efd3bd 50%, #dccfee 100%);
  --grad-mood-fg: #2a2430;
}
[data-palette="8"] { /* Evidence Pick, light. PREVIEW ONLY: pink and red */
  --grad-hero: linear-gradient(160deg, #f7eee7 0%, #f6e0df 55%, #f8e4d2 100%);
  --grad-accent: linear-gradient(135deg, #8a2336 0%, #a03a3a 100%);
  --grad-glow: radial-gradient(circle at 15% 0%, rgba(232, 150, 160, 0.30), transparent 55%),
               radial-gradient(circle at 90% 18%, rgba(240, 170, 120, 0.30), transparent 55%);
  --grad-mood: linear-gradient(120deg, #f2c4cb 0%, #f3d3cc 50%, #f4cfae 100%);
  --grad-mood-fg: #281839;
}
[data-palette="9"] { /* Sea Glass Plum, light */
  --grad-hero: linear-gradient(160deg, #f3efea 0%, #e3eee8 55%, #ebe5f0 100%);
  --grad-accent: linear-gradient(135deg, #6d2f9a 0%, #3d5a8a 100%);
  --grad-glow: radial-gradient(circle at 85% 0%, rgba(109, 47, 154, 0.15), transparent 55%),
               radial-gradient(circle at 10% 20%, rgba(34, 111, 106, 0.18), transparent 55%);
  --grad-mood: linear-gradient(120deg, #cfe5da 0%, #ddd9ea 55%, #e8d9ec 100%);
  --grad-mood-fg: #232a28;
}
[data-palette="10"] { /* Dusk Peach, dark: a dusk-tinted mood band (owner rule 2026-10-10: no big light blocks on dark pages), peach stays in the glow and the small accent */
  --grad-hero: linear-gradient(160deg, #1e1621 0%, #272028 55%, #35271f 100%);
  --grad-accent: linear-gradient(135deg, #f0b48c 0%, #f6cfae 100%);
  --grad-glow: radial-gradient(circle at 18% 0%, rgba(240, 180, 140, 0.30), transparent 58%),
               radial-gradient(circle at 92% 20%, rgba(150, 110, 200, 0.18), transparent 55%);
  --grad-mood: linear-gradient(120deg, #3a2f4f 0%, #4a3a3a 55%, #5a4030 100%);
  --grad-mood-fg: #f6ede4;
}

/* PX: palettes 11-20 (light/dark pairs). Same rules as above: hero and mood bands keep text at 4.5:1, no red/rose/mauve stops. */
[data-palette="11"] { /* Apricot, light. Plum Linen with a warmer base and apricot leading the secondary colour (research: peach is the comforted hue, R4). Plum stays the one small deep accent. */
  --grad-hero: linear-gradient(160deg, #f7eee4 0%, #f8e0cb 55%, #eee6f0 100%);
  --grad-accent: linear-gradient(135deg, #5e2a80 0%, #752d9e 100%);
  --grad-glow: radial-gradient(circle at 10% 0%, rgba(244, 160, 100, 0.34), transparent 55%);
  --grad-mood: linear-gradient(120deg, #f8c79b 0%, #f2cfb3 50%, #e2d2ee 100%);
  --grad-mood-fg: #2e2420;
}
[data-palette="12"] { /* Apricot, dark. Dusk Plum with an apricot-orange accent, a warmer plum base and an apricot mood band. Low-saturation page, warm light only in small areas. */
  --grad-hero: linear-gradient(160deg, #1f1622 0%, #2b1d30 55%, #3a2a1f 100%);
  --grad-accent: linear-gradient(135deg, #f4a76a 0%, #f9c79d 100%);
  --grad-glow: radial-gradient(circle at 15% 0%, rgba(244, 167, 106, 0.28), transparent 58%),
               radial-gradient(circle at 92% 25%, rgba(130, 90, 190, 0.18), transparent 55%);
  --grad-mood: linear-gradient(120deg, #6a3c22 0%, #43304f 55%, #3d2456 100%);
  --grad-mood-fg: #f0e8e2;
}
[data-palette="13"] { /* Lavender Ash, light. Cooler Plum Linen: greyed lilac linen, a blue-violet accent (hue 260, clear of the mauve guard). Cool, quiet, low saturation on large areas. */
  --grad-hero: linear-gradient(160deg, #f0eff4 0%, #e5e3f2 60%, #e8edf3 100%);
  --grad-accent: linear-gradient(135deg, #483390 0%, #5a3a9e 100%);
  --grad-glow: radial-gradient(circle at 12% 0%, rgba(90, 58, 158, 0.13), transparent 55%),
               radial-gradient(circle at 92% 20%, rgba(120, 150, 200, 0.18), transparent 55%);
  --grad-mood: linear-gradient(120deg, #d9d5ee 0%, #dfe0f0 55%, #d0dae8 100%);
  --grad-mood-fg: #25232e;
}
[data-palette="14"] { /* Lavender Ash, dark. Midnight plum: a blue-leaning dark base with a lilac accent. The cool sibling of Dusk Plum, same lightness steps. */
  --grad-hero: linear-gradient(160deg, #15131f 0%, #1f1b33 60%, #1c2335 100%);
  --grad-accent: linear-gradient(135deg, #b9a8f2 0%, #d0c4f7 100%);
  --grad-glow: radial-gradient(circle at 20% 0%, rgba(185, 168, 242, 0.20), transparent 60%),
               radial-gradient(circle at 90% 20%, rgba(90, 130, 200, 0.14), transparent 55%);
  --grad-mood: linear-gradient(120deg, #35286a 0%, #2c3868 55%, #40306e 100%);
  --grad-mood-fg: #ebe8f1;
}
[data-palette="15"] { /* Ink Plum, light. Bolder, higher contrast: crisp white surfaces, near-black ink, a deep aubergine accent and a strong mood band (research: deep accents in small areas, R13). */
  --grad-hero: linear-gradient(160deg, #f6f3ee 0%, #ffffff 55%, #ece6f2 100%);
  --grad-accent: linear-gradient(135deg, #491374 0%, #561987 100%);
  --grad-glow: radial-gradient(circle at 12% 0%, rgba(86, 25, 135, 0.14), transparent 55%),
               radial-gradient(circle at 92% 18%, rgba(240, 150, 90, 0.18), transparent 55%);
  --grad-mood: linear-gradient(120deg, #3a1260 0%, #561987 55%, #6a2a9c 100%);
  --grad-mood-fg: #ffffff;
}
[data-palette="16"] { /* Ink Plum, dark. Near-black aubergine with a bright apricot accent and a saturated plum mood band. Highest contrast of the dark set. */
  --grad-hero: linear-gradient(160deg, #120d1a 0%, #1b1128 60%, #2a1a2e 100%);
  --grad-accent: linear-gradient(135deg, #ffb887 0%, #ffd2ae 100%);
  --grad-glow: radial-gradient(circle at 18% 0%, rgba(255, 184, 135, 0.24), transparent 58%),
               radial-gradient(circle at 92% 20%, rgba(150, 80, 220, 0.24), transparent 55%);
  --grad-mood: linear-gradient(120deg, #4f1f82 0%, #6a2fa6 55%, #7d3fba 100%);
  --grad-mood-fg: #ffffff;
}
[data-palette="17"] { /* Soft Focus, light. Gentlest and lowest stimulation: very low saturation, quiet dusty-plum accent, near-flat gradients. For overload-prone readers (research: low saturation on large areas). */
  --grad-hero: linear-gradient(160deg, #f2efeb 0%, #efecef 60%, #f1ede8 100%);
  --grad-accent: linear-gradient(135deg, #58407a 0%, #6a4a8c 100%);
  --grad-glow: radial-gradient(circle at 15% 0%, rgba(106, 74, 140, 0.07), transparent 60%);
  --grad-mood: linear-gradient(120deg, #e6e0e8 0%, #e3e2ea 55%, #ece4dd 100%);
  --grad-mood-fg: #2c2831;
}
[data-palette="18"] { /* Soft Focus, dark. Charcoal-plum with a muted peach accent and low-chroma surfaces. The quietest dark: no saturated area bigger than a button. */
  --grad-hero: linear-gradient(160deg, #1d1b22 0%, #242130 60%, #26232c 100%);
  --grad-accent: linear-gradient(135deg, #cfa88d 0%, #dbb9a0 100%);
  --grad-glow: radial-gradient(circle at 18% 0%, rgba(207, 168, 141, 0.12), transparent 60%);
  --grad-mood: linear-gradient(120deg, #383245 0%, #3c3a49 55%, #45403f 100%);
  --grad-mood-fg: #e8e4e6;
}
[data-palette="19"] { /* Plum & Sage, light. Plum Linen with a sage secondary for calm (research: calm skews green-blue-grey). Plum accent and links, sage in borders, glows and the mood band. */
  --grad-hero: linear-gradient(160deg, #f2f0e8 0%, #e6eee4 55%, #ece6ef 100%);
  --grad-accent: linear-gradient(135deg, #55307f 0%, #6b2f9c 100%);
  --grad-glow: radial-gradient(circle at 10% 0%, rgba(120, 160, 120, 0.22), transparent 55%),
               radial-gradient(circle at 92% 15%, rgba(107, 47, 156, 0.13), transparent 55%);
  --grad-mood: linear-gradient(120deg, #cfe3d0 0%, #dce3da 50%, #ddd4ec 100%);
  --grad-mood-fg: #2a2530;
}
[data-palette="20"] { /* Plum & Sage, dark. Dusk Plum with a sage accent and plum surfaces: calm green on a deep plum dark. */
  --grad-hero: linear-gradient(160deg, #1a1822 0%, #1f2530 55%, #26233a 100%);
  --grad-accent: linear-gradient(135deg, #a8d3ae 0%, #c4e4c8 100%);
  --grad-glow: radial-gradient(circle at 18% 0%, rgba(168, 211, 174, 0.18), transparent 58%),
               radial-gradient(circle at 92% 22%, rgba(130, 90, 190, 0.16), transparent 55%);
  --grad-mood: linear-gradient(120deg, #2e4a3c 0%, #38483f 50%, #403462 100%);
  --grad-mood-fg: #ece8e6;
}

/* 21-22: Painted pair (PROPOSED, 2026-10-10). Colours from the approved illustrations: cream, slate, terracotta-peach, quiet indigo. */
[data-palette="21"] { /* Painted Linen, light: cream with a peach wash, indigo only in the small accent */
  --grad-hero: linear-gradient(160deg, #fbf6ef 0%, #f6e6d6 55%, #ece6ee 100%);
  --grad-accent: linear-gradient(135deg, #4d3b73 0%, #5e4a86 100%);
  --grad-glow: radial-gradient(circle at 12% 0%, rgba(239, 201, 166, 0.45), transparent 55%),
               radial-gradient(circle at 92% 15%, rgba(94, 74, 134, 0.12), transparent 55%);
  --grad-mood: linear-gradient(120deg, #efc9a6 0%, #ecd6c2 50%, #d9d3e8 100%);
  --grad-mood-fg: #2b2a3a;
}
[data-palette="22"] { /* Painted Dusk, dark: slate ink with a terracotta glow; the mood band is a dusk tint, not a light slab */
  --grad-hero: linear-gradient(160deg, #1d1c2a 0%, #232234 55%, #2b2430 100%);
  --grad-accent: linear-gradient(135deg, #e3ad83 0%, #efbc91 100%);
  --grad-glow: radial-gradient(circle at 18% 0%, rgba(227, 173, 131, 0.20), transparent 58%),
               radial-gradient(circle at 92% 20%, rgba(132, 130, 183, 0.16), transparent 55%);
  --grad-mood: linear-gradient(120deg, #35304f 0%, #43374a 55%, #4f3e30 100%);
  --grad-mood-fg: #f3ebe2;
}