/* ============================================================
   Nuage Bleu · themes.css
   Cinq variantes calées sur la colorimétrie personnelle de Martin
   (Été clair : sous-ton neutre-froid, contraste moyen-bas).
   Interdits respectés : aucun noir pur, aucun orange, moutarde,
   camel, kaki ni rouge vif. Règle : brume matinale.
   Sélection par ?theme=1..5
   ============================================================ */

/* ---------- 1 · Brume · ivoire et denim, la plus claire ---------- */
html[data-theme="1"] {
  --on-pop: #FFFFFF;
  --inset: rgba(62,84,115,.07);
  --bg: #F3EFE7; --bg-2: #EDE8DD; --surf: #FFFFFF;
  --line: rgba(62,84,115,.16);
  --txt: #3E5473; --txt-2: rgba(75,79,85,.86); --txt-3: rgba(75,79,85,.58);
  --card-a: #FFFFFF; --card-b: #F1EEE6;
  --paper: #FFFFFF; --paper-ink: #3E5473;
  --deep: #3E5473; --deep-2: #52678A; --silhouette: rgba(62,84,115,.5);
  --clip-a: #B8C9DE; --clip-b: #A9CCE3;
  --dot: rgba(62,84,115,.14);
  --shadow: rgba(62,84,115,.28);
  --orb-1: rgba(169,204,227,.7); --orb-2: rgba(185,169,214,.5);
  --mesh-1: rgba(169,204,227,.75); --mesh-2: rgba(239,198,207,.6); --mesh-3: rgba(183,220,203,.7);
  --t1: #7FA0C2; --t2: #A6B8A2; --t3: #3E5473; --t4: #A8D5D0; --t5: #B8C9DE; --t6: #B9A9D6;
  --forest: #3E5473; --moss: #7FA0C2; --teal: #A9CCE3; --cyan: #DADCE0;
  --pop: #3E5473; --pop-2: #7FA0C2; --pop-deep: #F3EFE7;
  --pop-grad: linear-gradient(100deg, #3E5473, #7FA0C2);
}
/* ---------- 2 · Denim · marine doux, le sombre le plus lisible ---------- */
html[data-theme="2"] {
  --on-pop: var(--bg);
  --inset: rgba(0,0,0,.22);
  --bg: #2B3B52; --bg-2: #33455F; --surf: #3E5473;
  --line: rgba(218,220,224,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.74); --txt-3: rgba(243,239,231,.5);
  --card-a: #3A4E6B; --card-b: #2F4058;
  --paper: #F5F0E4; --paper-ink: #3E5473;
  --deep: #222F42; --deep-2: #2B3B52; --silhouette: rgba(26,36,50,.72);
  --clip-a: #4E6787; --clip-b: #5B7799;
  --dot: rgba(218,220,224,.13);
  --shadow: rgba(18,26,38,.7);
  --orb-1: rgba(169,204,227,.5); --orb-2: rgba(185,169,214,.42);
  --mesh-1: rgba(169,204,227,.6); --mesh-2: rgba(183,220,203,.45); --mesh-3: rgba(185,169,214,.5);
  --t1: #7FA0C2; --t2: #A6B8A2; --t3: #52678A; --t4: #A8D5D0; --t5: #B8C9DE; --t6: #B9A9D6;
  --forest: #3E5473; --moss: #7FA0C2; --teal: #A9CCE3; --cyan: #DADCE0;
  --pop: #A9CCE3; --pop-2: #DADCE0; --pop-deep: #222F42;
  --pop-grad: linear-gradient(100deg, #A9CCE3, #B7DCCB);
}
/* ---------- 3 · Lavande · gris perle et mauve ---------- */
html[data-theme="3"] {
  --on-pop: #FFFFFF;
  --inset: rgba(75,79,85,.07);
  --bg: #EFEDF1; --bg-2: #E5E2EA; --surf: #FFFFFF;
  --line: rgba(75,79,85,.16);
  --txt: #4B4F55; --txt-2: rgba(75,79,85,.82); --txt-3: rgba(75,79,85,.55);
  --card-a: #FFFFFF; --card-b: #EDEAF1;
  --paper: #FFFFFF; --paper-ink: #4B4F55;
  --deep: #6B6480; --deep-2: #857D9B; --silhouette: rgba(107,100,128,.45);
  --clip-a: #C9CCD1; --clip-b: #B9A9D6;
  --dot: rgba(75,79,85,.14);
  --shadow: rgba(88,82,104,.28);
  --orb-1: rgba(185,169,214,.75); --orb-2: rgba(169,204,227,.55);
  --mesh-1: rgba(185,169,214,.7); --mesh-2: rgba(239,198,207,.6); --mesh-3: rgba(169,204,227,.65);
  --t1: #B9A9D6; --t2: #A889B5; --t3: #7FA0C2; --t4: #C9CCD1; --t5: #B8C9DE; --t6: #A8D5D0;
  --forest: #6B6480; --moss: #A889B5; --teal: #B9A9D6; --cyan: #DADCE0;
  --pop: #A889B5; --pop-2: #B9A9D6; --pop-deep: #FFFFFF;
  --pop-grad: linear-gradient(100deg, #A889B5, #B9A9D6);
}
/* ---------- 4 · Framboise · ivoire, taupe rosé et framboise douce ---------- */
html[data-theme="4"] {
  --on-pop: #FFFFFF;
  --inset: rgba(138,96,112,.08);
  --bg: #F5F0E4; --bg-2: #EFE9DB; --surf: #FFFFFF;
  --line: rgba(154,146,140,.28);
  --txt: #4B4F55; --txt-2: rgba(75,79,85,.82); --txt-3: rgba(154,146,140,.9);
  --card-a: #FFFFFF; --card-b: #F4EFE6;
  --paper: #FFFFFF; --paper-ink: #4B4F55;
  --deep: #8A6070; --deep-2: #A8808E; --silhouette: rgba(138,96,112,.45);
  --clip-a: #D9C7C0; --clip-b: #EFC6CF;
  --dot: rgba(154,146,140,.24);
  --shadow: rgba(120,100,100,.28);
  --orb-1: rgba(239,198,207,.8); --orb-2: rgba(183,163,154,.5);
  --mesh-1: rgba(239,198,207,.75); --mesh-2: rgba(212,154,166,.5); --mesh-3: rgba(169,204,227,.55);
  --t1: #D49AA6; --t2: #B7A39A; --t3: #C0607F; --t4: #EFC6CF; --t5: #B8C9DE; --t6: #A6B8A2;
  --forest: #8A6070; --moss: #D49AA6; --teal: #EFC6CF; --cyan: #F3EFE7;
  --pop: #C0607F; --pop-2: #D49AA6; --pop-deep: #FFFFFF;
  --pop-grad: linear-gradient(100deg, #C0607F, #D49AA6);
}
/* ---------- 5 · Anthracite · le sombre autorisé, accent vert d'eau ---------- */
html[data-theme="5"] {
  --on-pop: var(--bg);
  --inset: rgba(0,0,0,.22);
  --bg: #3B3F45; --bg-2: #44484F; --surf: #4B4F55;
  --line: rgba(243,239,231,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.74); --txt-3: rgba(243,239,231,.5);
  --card-a: #4B4F55; --card-b: #40444A;
  --paper: #F5F0E4; --paper-ink: #4B4F55;
  --deep: #2F3238; --deep-2: #3B3F45; --silhouette: rgba(30,33,37,.7);
  --clip-a: #5C6068; --clip-b: #6E737C;
  --dot: rgba(243,239,231,.13);
  --shadow: rgba(24,26,29,.7);
  --orb-1: rgba(168,213,208,.45); --orb-2: rgba(169,204,227,.4);
  --mesh-1: rgba(168,213,208,.55); --mesh-2: rgba(239,198,207,.4); --mesh-3: rgba(169,204,227,.5);
  --t1: #7FA0C2; --t2: #A6B8A2; --t3: #5C6068; --t4: #A8D5D0; --t5: #B8C9DE; --t6: #B7DCCB;
  --forest: #4B4F55; --moss: #7FA0C2; --teal: #A8D5D0; --cyan: #DADCE0;
  --pop: #A8D5D0; --pop-2: #B7DCCB; --pop-deep: #2F3238;
  --pop-grad: linear-gradient(100deg, #A8D5D0, #A9CCE3);
}

/* ============================================================
   Déclinaisons de la Framboise (variante 4 retenue) · ?theme=6..10
   ============================================================ */

/* ---------- 6 · Framboise clair · ivoire et framboise douce ---------- */
html[data-theme="6"] {
  --on-pop: #FFFFFF;
  --inset: rgba(138,96,112,.08);
  --bg: #F5F0E4; --bg-2: #EFE9DB; --surf: #FFFFFF;
  --line: rgba(154,146,140,.28);
  --txt: #4B4F55; --txt-2: rgba(75,79,85,.82); --txt-3: rgba(154,146,140,.95);
  --card-a: #FFFFFF; --card-b: #F4EFE6;
  --paper: #FFFFFF; --paper-ink: #4B4F55;
  --deep: #8A6070; --deep-2: #A8808E; --silhouette: rgba(138,96,112,.45);
  --clip-a: #D9C7C0; --clip-b: #EFC6CF;
  --dot: rgba(154,146,140,.24); --shadow: rgba(120,100,100,.28);
  --orb-1: rgba(239,198,207,.8); --orb-2: rgba(183,163,154,.5);
  --mesh-1: rgba(239,198,207,.75); --mesh-2: rgba(212,154,166,.5); --mesh-3: rgba(169,204,227,.55);
  --t1: #D49AA6; --t2: #B7A39A; --t3: #C0607F; --t4: #EFC6CF; --t5: #B8C9DE; --t6: #A6B8A2;
  --forest: #8A6070; --moss: #D49AA6; --teal: #EFC6CF; --cyan: #F3EFE7;
  --pop: #C0607F; --pop-2: #D49AA6; --pop-deep: #FFFFFF;
  --pop-grad: linear-gradient(100deg, #C0607F, #D49AA6);
}
/* ---------- 7 · Framboise nuit · anthracite doux et vieux rose ---------- */
html[data-theme="7"] {
  --on-pop: var(--bg);
  --inset: rgba(0,0,0,.22);
  --bg: #34363B; --bg-2: #3C3F45; --surf: #474B52;
  --line: rgba(243,239,231,.16);
  --txt: #F5F1EA; --txt-2: rgba(245,241,234,.86); --txt-3: rgba(245,241,234,.66);
  --card-a: #474B52; --card-b: #3B3E44;
  --paper: #F5F0E4; --paper-ink: #4B4F55;
  --deep: #26282C; --deep-2: #34363B; --silhouette: rgba(20,21,24,.72);
  --clip-a: #6B4E58; --clip-b: #8A6070;
  --dot: rgba(243,239,231,.13); --shadow: rgba(18,19,21,.72);
  --orb-1: rgba(212,154,166,.5); --orb-2: rgba(183,163,154,.36);
  --mesh-1: rgba(212,154,166,.6); --mesh-2: rgba(239,198,207,.42); --mesh-3: rgba(169,204,227,.4);
  --t1: #C0607F; --t2: #B7A39A; --t3: #5C6068; --t4: #D49AA6; --t5: #8A6070; --t6: #EFC6CF;
  --forest: #6B4E58; --moss: #C0607F; --teal: #D49AA6; --cyan: #EFC6CF;
  --pop: #D49AA6; --pop-2: #EFC6CF; --pop-deep: #26282C;
  --pop-grad: linear-gradient(100deg, #C0607F, #EFC6CF);
}
/* ---------- 8 · Framboise marine · marine doux et rose poudré ---------- */
html[data-theme="8"] {
  --on-pop: var(--bg);
  --inset: rgba(0,0,0,.22);
  --bg: #2B3B52; --bg-2: #33455F; --surf: #3E5473;
  --line: rgba(243,239,231,.17);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.75); --txt-3: rgba(243,239,231,.52);
  --card-a: #3A4E6B; --card-b: #2F4058;
  --paper: #F5F0E4; --paper-ink: #3E5473;
  --deep: #222F42; --deep-2: #2B3B52; --silhouette: rgba(26,36,50,.72);
  --clip-a: #4E6787; --clip-b: #8A6070;
  --dot: rgba(243,239,231,.13); --shadow: rgba(18,26,38,.7);
  --orb-1: rgba(239,198,207,.52); --orb-2: rgba(169,204,227,.42);
  --mesh-1: rgba(239,198,207,.6); --mesh-2: rgba(169,204,227,.5); --mesh-3: rgba(212,154,166,.45);
  --t1: #7FA0C2; --t2: #D49AA6; --t3: #52678A; --t4: #EFC6CF; --t5: #B8C9DE; --t6: #A6B8A2;
  --forest: #3E5473; --moss: #7FA0C2; --teal: #D49AA6; --cyan: #EFC6CF;
  --pop: #EFC6CF; --pop-2: #F3EFE7; --pop-deep: #222F42;
  --pop-grad: linear-gradient(100deg, #D49AA6, #EFC6CF);
}
/* ---------- 9 · Rose poudré · blanc cassé, marine et vieux rose ---------- */
html[data-theme="9"] {
  --on-pop: #FFFFFF;
  --inset: rgba(62,84,115,.07);
  --bg: #F3EFE7; --bg-2: #EDE7E2; --surf: #FFFFFF;
  --line: rgba(62,84,115,.16);
  --txt: #3E5473; --txt-2: rgba(62,84,115,.78); --txt-3: rgba(154,146,140,.95);
  --card-a: #FFFFFF; --card-b: #F5F0EC;
  --paper: #FFFFFF; --paper-ink: #3E5473;
  --deep: #A8808E; --deep-2: #C69AA6; --silhouette: rgba(120,100,110,.4);
  --clip-a: #E4CFD4; --clip-b: #EFC6CF;
  --dot: rgba(62,84,115,.13); --shadow: rgba(110,100,105,.26);
  --orb-1: rgba(239,198,207,.85); --orb-2: rgba(184,201,222,.6);
  --mesh-1: rgba(239,198,207,.8); --mesh-2: rgba(184,201,222,.6); --mesh-3: rgba(183,220,203,.6);
  --t1: #EFC6CF; --t2: #B8C9DE; --t3: #D49AA6; --t4: #B7DCCB; --t5: #B7A39A; --t6: #B9A9D6;
  --forest: #A8808E; --moss: #D49AA6; --teal: #EFC6CF; --cyan: #F3EFE7;
  --pop: #D49AA6; --pop-2: #EFC6CF; --pop-deep: #FFFFFF;
  --pop-grad: linear-gradient(100deg, #D49AA6, #EFC6CF);
}
/* ---------- 10 · Framboise perle · gris clair et framboise ---------- */
html[data-theme="10"] {
  --on-pop: #FFFFFF;
  --inset: rgba(75,79,85,.08);
  --bg: #E4E3E2; --bg-2: #DAD8D7; --surf: #FFFFFF;
  --line: rgba(75,79,85,.2);
  --txt: #4B4F55; --txt-2: rgba(75,79,85,.82); --txt-3: rgba(154,146,140,.98);
  --card-a: #FFFFFF; --card-b: #F0EEED;
  --paper: #FFFFFF; --paper-ink: #4B4F55;
  --deep: #7A6870; --deep-2: #9A8790; --silhouette: rgba(90,80,86,.42);
  --clip-a: #CFC9CB; --clip-b: #D49AA6;
  --dot: rgba(75,79,85,.16); --shadow: rgba(90,86,88,.3);
  --orb-1: rgba(212,154,166,.62); --orb-2: rgba(201,204,209,.8);
  --mesh-1: rgba(212,154,166,.6); --mesh-2: rgba(201,204,209,.7); --mesh-3: rgba(184,201,222,.55);
  --t1: #C0607F; --t2: #C9CCD1; --t3: #B7A39A; --t4: #D49AA6; --t5: #9A928C; --t6: #B8C9DE;
  --forest: #7A6870; --moss: #C0607F; --teal: #D49AA6; --cyan: #C9CCD1;
  --pop: #C0607F; --pop-2: #D49AA6; --pop-deep: #FFFFFF;
  --pop-grad: linear-gradient(100deg, #C0607F, #D49AA6);
}

/* ---------- règles de lisibilité communes, pilotées par data-light ---------- */
.btn.pop, .btn.amber, .nav .btn { color: var(--on-pop, var(--bg)); }
.btn.pop::after, .btn.amber::after, .nav .btn::after { background: var(--on-pop, var(--bg)); }
html[data-light] .btn { color: var(--surf); }
html[data-light] .btn::after { background: var(--surf); }
html[data-light] .shine-ring { opacity: .5; }
html[data-light] .grain { opacity: .028; }
html[data-light] .cart b { color: #FFFFFF; }
html[data-light] .stamp { color: #FFFFFF; border-color: #FFFFFF; }
html[data-light] .tl-sub, html[data-light] .scrub-frame, html[data-light] .ba-tag, html[data-light] .vid-sound { color: #FFFFFF; }
html[data-light] .cur-dot { background: var(--txt); }
html[data-light] .cur-ring { border-color: color-mix(in srgb, var(--txt) 55%, transparent); }
html[data-light] .cur.is-frame .cur-ring { background: var(--txt); }
html[data-light] .p-num { -webkit-text-stroke-color: color-mix(in srgb, var(--txt) 22%, transparent); }
html[data-light] .toast { background: var(--txt); color: var(--bg); }
html[data-light] .lg-r i.no { box-shadow: 0 0 0 1px color-mix(in srgb, var(--txt) 28%, transparent) inset; }

/* ============================================================
   Dix combinaisons autour du rose poudré, du bleu poudré
   et du vert menthe · ?theme=11..20
   ============================================================ */

/* 11 · Poudré nuit · anthracite, rose poudré dominant */
html[data-theme="11"] {
  --on-pop: #34363B; --inset: rgba(0,0,0,.22);
  --bg: #34363B; --bg-2: #3C3F45; --surf: #474B52;
  --line: rgba(243,239,231,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.75); --txt-3: rgba(243,239,231,.5);
  --card-a: #474B52; --card-b: #3B3E44;
  --paper: #F5F0E4; --paper-ink: #4B4F55;
  --deep: #26282C; --deep-2: #34363B; --silhouette: rgba(20,21,24,.72);
  --clip-a: #6E5A62; --clip-b: #9A7883;
  --dot: rgba(243,239,231,.13); --shadow: rgba(18,19,21,.72);
  --orb-1: rgba(239,198,207,.55); --orb-2: rgba(201,204,209,.3);
  --mesh-1: rgba(239,198,207,.65); --mesh-2: rgba(192,96,127,.35); --mesh-3: rgba(201,204,209,.4);
  --t1: #EFC6CF; --t2: #B7A39A; --t3: #C0607F; --t4: #D49AA6; --t5: #9A928C; --t6: #C9CCD1;
  --forest: #6E5A62; --moss: #D49AA6; --teal: #EFC6CF; --cyan: #F3EFE7;
  --pop: #EFC6CF; --pop-2: #F3EFE7; --pop-deep: #26282C;
  --pop-grad: linear-gradient(100deg, #EFC6CF, #F3EFE7);
}
/* 12 · Poudré menthe · blanc cassé, rose poudré et vert menthe */
html[data-theme="12"] {
  --on-pop: #FFFFFF; --inset: rgba(62,84,115,.07);
  --bg: #F3EFE7; --bg-2: #EBE9E1; --surf: #FFFFFF;
  --line: rgba(75,79,85,.17);
  --txt: #4B4F55; --txt-2: rgba(75,79,85,.8); --txt-3: rgba(154,146,140,.95);
  --card-a: #FFFFFF; --card-b: #F2F1EA;
  --paper: #FFFFFF; --paper-ink: #4B4F55;
  --deep: #7F9E92; --deep-2: #A8808E; --silhouette: rgba(110,110,110,.4);
  --clip-a: #CDE6DA; --clip-b: #EFC6CF;
  --dot: rgba(75,79,85,.14); --shadow: rgba(100,105,100,.26);
  --orb-1: rgba(239,198,207,.8); --orb-2: rgba(183,220,203,.7);
  --mesh-1: rgba(239,198,207,.75); --mesh-2: rgba(183,220,203,.7); --mesh-3: rgba(184,201,222,.5);
  --t1: #EFC6CF; --t2: #B7DCCB; --t3: #D49AA6; --t4: #A6B8A2; --t5: #B8C9DE; --t6: #B7A39A;
  --forest: #7F9E92; --moss: #B7DCCB; --teal: #EFC6CF; --cyan: #F3EFE7;
  --pop: #D49AA6; --pop-2: #B7DCCB; --pop-deep: #FFFFFF;
  --pop-grad: linear-gradient(100deg, #D49AA6, #B7DCCB);
}
/* 13 · Framboise poudré · ivoire, framboise et bleu poudré */
html[data-theme="13"] {
  --on-pop: #FFFFFF; --inset: rgba(62,84,115,.07);
  --bg: #F5F0E4; --bg-2: #EDE9E1; --surf: #FFFFFF;
  --line: rgba(62,84,115,.18);
  --txt: #3E5473; --txt-2: rgba(62,84,115,.78); --txt-3: rgba(154,146,140,.95);
  --card-a: #FFFFFF; --card-b: #F1F0EC;
  --paper: #FFFFFF; --paper-ink: #3E5473;
  --deep: #8A6070; --deep-2: #7FA0C2; --silhouette: rgba(90,100,120,.42);
  --clip-a: #C9D6E4; --clip-b: #EFC6CF;
  --dot: rgba(62,84,115,.14); --shadow: rgba(90,100,115,.26);
  --orb-1: rgba(192,96,127,.5); --orb-2: rgba(184,201,222,.8);
  --mesh-1: rgba(184,201,222,.8); --mesh-2: rgba(239,198,207,.6); --mesh-3: rgba(183,220,203,.5);
  --t1: #B8C9DE; --t2: #EFC6CF; --t3: #7FA0C2; --t4: #D49AA6; --t5: #A9CCE3; --t6: #B7A39A;
  --forest: #3E5473; --moss: #7FA0C2; --teal: #B8C9DE; --cyan: #EFC6CF;
  --pop: #C0607F; --pop-2: #D49AA6; --pop-deep: #FFFFFF;
  --pop-grad: linear-gradient(100deg, #C0607F, #B8C9DE);
}
/* 14 · Framboise poudré nuit · marine, framboise et bleu poudré */
html[data-theme="14"] {
  --on-pop: #2B3B52; --inset: rgba(0,0,0,.22);
  --bg: #2B3B52; --bg-2: #33455F; --surf: #3E5473;
  --line: rgba(243,239,231,.17);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.75); --txt-3: rgba(243,239,231,.52);
  --card-a: #3A4E6B; --card-b: #2F4058;
  --paper: #F5F0E4; --paper-ink: #3E5473;
  --deep: #222F42; --deep-2: #2B3B52; --silhouette: rgba(26,36,50,.72);
  --clip-a: #4E6787; --clip-b: #9A7883;
  --dot: rgba(243,239,231,.13); --shadow: rgba(18,26,38,.7);
  --orb-1: rgba(192,96,127,.45); --orb-2: rgba(184,201,222,.5);
  --mesh-1: rgba(184,201,222,.6); --mesh-2: rgba(192,96,127,.4); --mesh-3: rgba(239,198,207,.45);
  --t1: #B8C9DE; --t2: #C0607F; --t3: #52678A; --t4: #EFC6CF; --t5: #7FA0C2; --t6: #D49AA6;
  --forest: #3E5473; --moss: #7FA0C2; --teal: #B8C9DE; --cyan: #EFC6CF;
  --pop: #B8C9DE; --pop-2: #EFC6CF; --pop-deep: #222F42;
  --pop-grad: linear-gradient(100deg, #B8C9DE, #EFC6CF);
}
/* 15 · Menthe nuit · anthracite, vert menthe et framboise */
html[data-theme="15"] {
  --on-pop: #2F3A36; --inset: rgba(0,0,0,.22);
  --bg: #2F3A36; --bg-2: #37423E; --surf: #414D48;
  --line: rgba(243,239,231,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.74); --txt-3: rgba(243,239,231,.5);
  --card-a: #414D48; --card-b: #35403C;
  --paper: #F5F0E4; --paper-ink: #4B4F55;
  --deep: #232C29; --deep-2: #2F3A36; --silhouette: rgba(18,24,22,.72);
  --clip-a: #4C5F58; --clip-b: #6E8C81;
  --dot: rgba(243,239,231,.13); --shadow: rgba(16,21,19,.72);
  --orb-1: rgba(183,220,203,.5); --orb-2: rgba(239,198,207,.4);
  --mesh-1: rgba(183,220,203,.6); --mesh-2: rgba(239,198,207,.45); --mesh-3: rgba(166,184,162,.5);
  --t1: #B7DCCB; --t2: #A6B8A2; --t3: #C0607F; --t4: #D49AA6; --t5: #4C5F58; --t6: #EFC6CF;
  --forest: #4C5F58; --moss: #A6B8A2; --teal: #B7DCCB; --cyan: #EFC6CF;
  --pop: #B7DCCB; --pop-2: #EFC6CF; --pop-deep: #232C29;
  --pop-grad: linear-gradient(100deg, #B7DCCB, #EFC6CF);
}
/* 16 · Trio poudré · blanc cassé, rose, bleu et menthe ensemble */
html[data-theme="16"] {
  --on-pop: #FFFFFF; --inset: rgba(75,79,85,.07);
  --bg: #F4F1EC; --bg-2: #ECE9E4; --surf: #FFFFFF;
  --line: rgba(75,79,85,.16);
  --txt: #4B4F55; --txt-2: rgba(75,79,85,.8); --txt-3: rgba(154,146,140,.95);
  --card-a: #FFFFFF; --card-b: #F2F0EC;
  --paper: #FFFFFF; --paper-ink: #4B4F55;
  --deep: #8A6070; --deep-2: #7F9E92; --silhouette: rgba(105,105,110,.4);
  --clip-a: #D8E3EC; --clip-b: #EFC6CF;
  --dot: rgba(75,79,85,.13); --shadow: rgba(100,100,105,.25);
  --orb-1: rgba(239,198,207,.75); --orb-2: rgba(183,220,203,.6);
  --mesh-1: rgba(239,198,207,.7); --mesh-2: rgba(184,201,222,.65); --mesh-3: rgba(183,220,203,.65);
  --t1: #EFC6CF; --t2: #B8C9DE; --t3: #B7DCCB; --t4: #D49AA6; --t5: #A9CCE3; --t6: #A6B8A2;
  --forest: #7F9E92; --moss: #B8C9DE; --teal: #EFC6CF; --cyan: #B7DCCB;
  --pop: #C0607F; --pop-2: #EFC6CF; --pop-deep: #FFFFFF;
  --pop-grad: linear-gradient(100deg, #C0607F, #B8C9DE 60%, #B7DCCB);
}
/* 17 · Poudré marine · marine profond, rose poudré et menthe */
html[data-theme="17"] {
  --on-pop: #222F42; --inset: rgba(0,0,0,.24);
  --bg: #24344A; --bg-2: #2C3E57; --surf: #364A66;
  --line: rgba(243,239,231,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.74); --txt-3: rgba(243,239,231,.5);
  --card-a: #35485F; --card-b: #2A3B51;
  --paper: #F5F0E4; --paper-ink: #3E5473;
  --deep: #1C2938; --deep-2: #24344A; --silhouette: rgba(20,30,42,.74);
  --clip-a: #46607F; --clip-b: #7F9E92;
  --dot: rgba(243,239,231,.12); --shadow: rgba(14,22,32,.72);
  --orb-1: rgba(239,198,207,.5); --orb-2: rgba(183,220,203,.42);
  --mesh-1: rgba(239,198,207,.55); --mesh-2: rgba(183,220,203,.5); --mesh-3: rgba(184,201,222,.45);
  --t1: #EFC6CF; --t2: #B7DCCB; --t3: #46607F; --t4: #B8C9DE; --t5: #D49AA6; --t6: #A6B8A2;
  --forest: #3E5473; --moss: #7F9E92; --teal: #B7DCCB; --cyan: #EFC6CF;
  --pop: #EFC6CF; --pop-2: #B7DCCB; --pop-deep: #1C2938;
  --pop-grad: linear-gradient(100deg, #EFC6CF, #B7DCCB);
}
/* 18 · Menthe claire · vert menthe dominant, framboise en accent */
html[data-theme="18"] {
  --on-pop: #FFFFFF; --inset: rgba(75,90,85,.08);
  --bg: #EFF3EE; --bg-2: #E5EBE4; --surf: #FFFFFF;
  --line: rgba(75,90,85,.18);
  --txt: #3F4C47; --txt-2: rgba(63,76,71,.8); --txt-3: rgba(120,132,126,.95);
  --card-a: #FFFFFF; --card-b: #EFF3EE;
  --paper: #FFFFFF; --paper-ink: #3F4C47;
  --deep: #6E8C81; --deep-2: #8A6070; --silhouette: rgba(80,100,92,.4);
  --clip-a: #CBE3D7; --clip-b: #A6B8A2;
  --dot: rgba(75,90,85,.15); --shadow: rgba(90,105,98,.26);
  --orb-1: rgba(183,220,203,.85); --orb-2: rgba(239,198,207,.6);
  --mesh-1: rgba(183,220,203,.8); --mesh-2: rgba(239,198,207,.6); --mesh-3: rgba(168,213,208,.6);
  --t1: #B7DCCB; --t2: #A6B8A2; --t3: #A8D5D0; --t4: #EFC6CF; --t5: #B8C9DE; --t6: #D49AA6;
  --forest: #6E8C81; --moss: #A6B8A2; --teal: #B7DCCB; --cyan: #EFC6CF;
  --pop: #C0607F; --pop-2: #B7DCCB; --pop-deep: #FFFFFF;
  --pop-grad: linear-gradient(100deg, #C0607F, #D49AA6);
}
/* 19 · Bleu poudré nuit · anthracite bleuté, bleu poudré et framboise */
html[data-theme="19"] {
  --on-pop: #2E353E; --inset: rgba(0,0,0,.22);
  --bg: #2E353E; --bg-2: #363E48; --surf: #414A56;
  --line: rgba(243,239,231,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.74); --txt-3: rgba(243,239,231,.5);
  --card-a: #414A56; --card-b: #343C46;
  --paper: #F5F0E4; --paper-ink: #3E5473;
  --deep: #232830; --deep-2: #2E353E; --silhouette: rgba(18,22,28,.72);
  --clip-a: #4A5568; --clip-b: #6E7E96;
  --dot: rgba(243,239,231,.13); --shadow: rgba(16,19,24,.72);
  --orb-1: rgba(184,201,222,.55); --orb-2: rgba(192,96,127,.35);
  --mesh-1: rgba(184,201,222,.65); --mesh-2: rgba(239,198,207,.45); --mesh-3: rgba(183,220,203,.4);
  --t1: #B8C9DE; --t2: #A9CCE3; --t3: #4A5568; --t4: #C0607F; --t5: #EFC6CF; --t6: #A6B8A2;
  --forest: #4A5568; --moss: #7FA0C2; --teal: #B8C9DE; --cyan: #EFC6CF;
  --pop: #B8C9DE; --pop-2: #A9CCE3; --pop-deep: #232830;
  --pop-grad: linear-gradient(100deg, #B8C9DE, #A9CCE3);
}
/* 20 · Framboise menthe · ivoire, framboise et vert menthe */
html[data-theme="20"] {
  --on-pop: #FFFFFF; --inset: rgba(90,80,85,.08);
  --bg: #F6F2E9; --bg-2: #EEEAE1; --surf: #FFFFFF;
  --line: rgba(75,79,85,.17);
  --txt: #4B4F55; --txt-2: rgba(75,79,85,.8); --txt-3: rgba(154,146,140,.95);
  --card-a: #FFFFFF; --card-b: #F3F1EB;
  --paper: #FFFFFF; --paper-ink: #4B4F55;
  --deep: #8A6070; --deep-2: #6E8C81; --silhouette: rgba(100,95,95,.4);
  --clip-a: #CBE3D7; --clip-b: #EFC6CF;
  --dot: rgba(75,79,85,.14); --shadow: rgba(100,95,95,.26);
  --orb-1: rgba(192,96,127,.45); --orb-2: rgba(183,220,203,.75);
  --mesh-1: rgba(183,220,203,.75); --mesh-2: rgba(192,96,127,.4); --mesh-3: rgba(239,198,207,.6);
  --t1: #C0607F; --t2: #B7DCCB; --t3: #A6B8A2; --t4: #EFC6CF; --t5: #D49AA6; --t6: #A8D5D0;
  --forest: #6E8C81; --moss: #B7DCCB; --teal: #EFC6CF; --cyan: #C0607F;
  --pop: #C0607F; --pop-2: #B7DCCB; --pop-deep: #FFFFFF;
  --pop-grad: linear-gradient(100deg, #C0607F, #B7DCCB);
}
/* ============================================================
   Dix variantes SOMBRES bâties sur la recette de Framboise nuit :
   fond neutre foncé, accent intense sur textes et boutons.
   ?theme=21..30
   ============================================================ */

/* 21 · Sauge nuit · anthracite verdi, accent vert sauge */
html[data-theme="21"] {
  --on-pop: #2F332F; --inset: rgba(0,0,0,.22);
  --bg: #2F332F; --bg-2: #373C36; --surf: #424840;
  --line: rgba(243,239,231,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.75); --txt-3: rgba(243,239,231,.5);
  --card-a: #424840; --card-b: #363B34;
  --paper: #F5F0E4; --paper-ink: #4B4F55;
  --deep: #232722; --deep-2: #2F332F; --silhouette: rgba(18,21,18,.72);
  --clip-a: #4E5A4A; --clip-b: #6B7A66;
  --dot: rgba(243,239,231,.13); --shadow: rgba(16,19,16,.72);
  --orb-1: rgba(166,184,162,.5); --orb-2: rgba(192,96,127,.3);
  --mesh-1: rgba(166,184,162,.6); --mesh-2: rgba(239,198,207,.4); --mesh-3: rgba(183,220,203,.45);
  --t1: #A6B8A2; --t2: #B7DCCB; --t3: #4E5A4A; --t4: #C0607F; --t5: #B7A39A; --t6: #A8D5D0;
  --forest: #4E5A4A; --moss: #A6B8A2; --teal: #B7DCCB; --cyan: #EFC6CF;
  --pop: #A6B8A2; --pop-2: #B7DCCB; --pop-deep: #232722;
  --pop-grad: linear-gradient(100deg, #A6B8A2, #B7DCCB);
}
/* 22 · Denim nuit · anthracite, accent denim clair */
html[data-theme="22"] {
  --on-pop: #34363B; --inset: rgba(0,0,0,.22);
  --bg: #34363B; --bg-2: #3C3F45; --surf: #474B52;
  --line: rgba(243,239,231,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.75); --txt-3: rgba(243,239,231,.5);
  --card-a: #474B52; --card-b: #3B3E44;
  --paper: #F5F0E4; --paper-ink: #3E5473;
  --deep: #26282C; --deep-2: #34363B; --silhouette: rgba(20,21,24,.72);
  --clip-a: #46566B; --clip-b: #62789A;
  --dot: rgba(243,239,231,.13); --shadow: rgba(18,19,21,.72);
  --orb-1: rgba(127,160,194,.55); --orb-2: rgba(212,154,166,.32);
  --mesh-1: rgba(127,160,194,.6); --mesh-2: rgba(239,198,207,.42); --mesh-3: rgba(169,204,227,.5);
  --t1: #7FA0C2; --t2: #A9CCE3; --t3: #46566B; --t4: #D49AA6; --t5: #B8C9DE; --t6: #A6B8A2;
  --forest: #46566B; --moss: #7FA0C2; --teal: #A9CCE3; --cyan: #D49AA6;
  --pop: #7FA0C2; --pop-2: #A9CCE3; --pop-deep: #26282C;
  --pop-grad: linear-gradient(100deg, #7FA0C2, #A9CCE3);
}
/* 23 · Sauge framboise · vert sauge en accent, framboise très présente */
html[data-theme="23"] {
  --on-pop: #2F3A36; --inset: rgba(0,0,0,.22);
  --bg: #2F3A36; --bg-2: #37423E; --surf: #414D48;
  --line: rgba(243,239,231,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.75); --txt-3: rgba(243,239,231,.5);
  --card-a: #414D48; --card-b: #35403C;
  --paper: #F5F0E4; --paper-ink: #4B4F55;
  --deep: #232C29; --deep-2: #2F3A36; --silhouette: rgba(18,24,22,.72);
  --clip-a: #57634F; --clip-b: #8A6070;
  --dot: rgba(243,239,231,.13); --shadow: rgba(16,21,19,.72);
  --orb-1: rgba(192,96,127,.45); --orb-2: rgba(166,184,162,.55);
  --mesh-1: rgba(166,184,162,.6); --mesh-2: rgba(192,96,127,.45); --mesh-3: rgba(239,198,207,.45);
  --t1: #C0607F; --t2: #A6B8A2; --t3: #57634F; --t4: #EFC6CF; --t5: #B7DCCB; --t6: #D49AA6;
  --forest: #57634F; --moss: #A6B8A2; --teal: #C0607F; --cyan: #EFC6CF;
  --pop: #A6B8A2; --pop-2: #EFC6CF; --pop-deep: #232C29;
  --pop-grad: linear-gradient(100deg, #A6B8A2, #EFC6CF);
}
/* 24 · Mauve nuit · anthracite violacé, accent mauve */
html[data-theme="24"] {
  --on-pop: #34313B; --inset: rgba(0,0,0,.22);
  --bg: #34313B; --bg-2: #3C3944; --surf: #474351;
  --line: rgba(243,239,231,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.75); --txt-3: rgba(243,239,231,.5);
  --card-a: #474351; --card-b: #3B3743;
  --paper: #F5F0E4; --paper-ink: #4B4F55;
  --deep: #262330; --deep-2: #34313B; --silhouette: rgba(20,18,26,.72);
  --clip-a: #574E68; --clip-b: #7A6B90;
  --dot: rgba(243,239,231,.13); --shadow: rgba(18,16,22,.72);
  --orb-1: rgba(168,137,181,.55); --orb-2: rgba(212,154,166,.34);
  --mesh-1: rgba(168,137,181,.6); --mesh-2: rgba(239,198,207,.45); --mesh-3: rgba(185,169,214,.5);
  --t1: #A889B5; --t2: #B9A9D6; --t3: #574E68; --t4: #D49AA6; --t5: #C0607F; --t6: #B8C9DE;
  --forest: #574E68; --moss: #A889B5; --teal: #B9A9D6; --cyan: #EFC6CF;
  --pop: #A889B5; --pop-2: #B9A9D6; --pop-deep: #262330;
  --pop-grad: linear-gradient(100deg, #A889B5, #B9A9D6);
}
/* 25 · Sauge marine · marine profond, accent vert sauge */
html[data-theme="25"] {
  --on-pop: #24344A; --inset: rgba(0,0,0,.24);
  --bg: #24344A; --bg-2: #2C3E57; --surf: #364A66;
  --line: rgba(243,239,231,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.74); --txt-3: rgba(243,239,231,.5);
  --card-a: #35485F; --card-b: #2A3B51;
  --paper: #F5F0E4; --paper-ink: #3E5473;
  --deep: #1C2938; --deep-2: #24344A; --silhouette: rgba(20,30,42,.74);
  --clip-a: #3F5A66; --clip-b: #6B8A76;
  --dot: rgba(243,239,231,.12); --shadow: rgba(14,22,32,.72);
  --orb-1: rgba(166,184,162,.5); --orb-2: rgba(169,204,227,.4);
  --mesh-1: rgba(166,184,162,.55); --mesh-2: rgba(169,204,227,.5); --mesh-3: rgba(183,220,203,.5);
  --t1: #A6B8A2; --t2: #7FA0C2; --t3: #3F5A66; --t4: #B7DCCB; --t5: #B8C9DE; --t6: #D49AA6;
  --forest: #3F5A66; --moss: #A6B8A2; --teal: #B7DCCB; --cyan: #A9CCE3;
  --pop: #A6B8A2; --pop-2: #A9CCE3; --pop-deep: #1C2938;
  --pop-grad: linear-gradient(100deg, #A6B8A2, #A9CCE3);
}
/* 26 · Denim sauge · anthracite bleuté, denim en accent, sauge en second */
html[data-theme="26"] {
  --on-pop: #2E353E; --inset: rgba(0,0,0,.22);
  --bg: #2E353E; --bg-2: #363E48; --surf: #414A56;
  --line: rgba(243,239,231,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.74); --txt-3: rgba(243,239,231,.5);
  --card-a: #414A56; --card-b: #343C46;
  --paper: #F5F0E4; --paper-ink: #3E5473;
  --deep: #232830; --deep-2: #2E353E; --silhouette: rgba(18,22,28,.72);
  --clip-a: #45596B; --clip-b: #6B8A76;
  --dot: rgba(243,239,231,.13); --shadow: rgba(16,19,24,.72);
  --orb-1: rgba(127,160,194,.55); --orb-2: rgba(166,184,162,.45);
  --mesh-1: rgba(127,160,194,.6); --mesh-2: rgba(166,184,162,.5); --mesh-3: rgba(184,201,222,.45);
  --t1: #7FA0C2; --t2: #A6B8A2; --t3: #45596B; --t4: #A9CCE3; --t5: #B7DCCB; --t6: #B8C9DE;
  --forest: #45596B; --moss: #7FA0C2; --teal: #A6B8A2; --cyan: #A9CCE3;
  --pop: #7FA0C2; --pop-2: #A6B8A2; --pop-deep: #232830;
  --pop-grad: linear-gradient(100deg, #7FA0C2, #A6B8A2);
}
/* 27 · Rose et sauge · l'accent de Framboise nuit, les pubs en vert */
html[data-theme="27"] {
  --on-pop: #34363B; --inset: rgba(0,0,0,.22);
  --bg: #34363B; --bg-2: #3C3F45; --surf: #474B52;
  --line: rgba(243,239,231,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.75); --txt-3: rgba(243,239,231,.5);
  --card-a: #474B52; --card-b: #3B3E44;
  --paper: #F5F0E4; --paper-ink: #4B4F55;
  --deep: #26282C; --deep-2: #34363B; --silhouette: rgba(20,21,24,.72);
  --clip-a: #4E5A4A; --clip-b: #8A6070;
  --dot: rgba(243,239,231,.13); --shadow: rgba(18,19,21,.72);
  --orb-1: rgba(212,154,166,.5); --orb-2: rgba(166,184,162,.45);
  --mesh-1: rgba(212,154,166,.55); --mesh-2: rgba(166,184,162,.5); --mesh-3: rgba(183,220,203,.45);
  --t1: #A6B8A2; --t2: #B7DCCB; --t3: #4E5A4A; --t4: #A8D5D0; --t5: #C0607F; --t6: #B7A39A;
  --forest: #4E5A4A; --moss: #A6B8A2; --teal: #B7DCCB; --cyan: #D49AA6;
  --pop: #D49AA6; --pop-2: #EFC6CF; --pop-deep: #26282C;
  --pop-grad: linear-gradient(100deg, #D49AA6, #EFC6CF);
}
/* 28 · Rose et denim · l'accent de Framboise nuit, les pubs en bleu */
html[data-theme="28"] {
  --on-pop: #34363B; --inset: rgba(0,0,0,.22);
  --bg: #34363B; --bg-2: #3C3F45; --surf: #474B52;
  --line: rgba(243,239,231,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.75); --txt-3: rgba(243,239,231,.5);
  --card-a: #474B52; --card-b: #3B3E44;
  --paper: #F5F0E4; --paper-ink: #3E5473;
  --deep: #26282C; --deep-2: #34363B; --silhouette: rgba(20,21,24,.72);
  --clip-a: #46566B; --clip-b: #8A6070;
  --dot: rgba(243,239,231,.13); --shadow: rgba(18,19,21,.72);
  --orb-1: rgba(212,154,166,.5); --orb-2: rgba(127,160,194,.45);
  --mesh-1: rgba(212,154,166,.55); --mesh-2: rgba(127,160,194,.5); --mesh-3: rgba(184,201,222,.45);
  --t1: #7FA0C2; --t2: #B8C9DE; --t3: #46566B; --t4: #A9CCE3; --t5: #C0607F; --t6: #A6B8A2;
  --forest: #46566B; --moss: #7FA0C2; --teal: #B8C9DE; --cyan: #D49AA6;
  --pop: #D49AA6; --pop-2: #EFC6CF; --pop-deep: #26282C;
  --pop-grad: linear-gradient(100deg, #D49AA6, #EFC6CF);
}
/* 29 · Perle nuit · gris perle foncé, rose et bleu ciel */
html[data-theme="29"] {
  --on-pop: #3B3D40; --inset: rgba(0,0,0,.2);
  --bg: #3B3D40; --bg-2: #43454A; --surf: #4E5156;
  --line: rgba(243,239,231,.18);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.76); --txt-3: rgba(243,239,231,.52);
  --card-a: #4E5156; --card-b: #414449;
  --paper: #F5F0E4; --paper-ink: #4B4F55;
  --deep: #2C2E31; --deep-2: #3B3D40; --silhouette: rgba(24,25,27,.7);
  --clip-a: #5A5D63; --clip-b: #7E848C;
  --dot: rgba(243,239,231,.15); --shadow: rgba(20,21,23,.7);
  --orb-1: rgba(212,154,166,.5); --orb-2: rgba(201,204,209,.4);
  --mesh-1: rgba(212,154,166,.55); --mesh-2: rgba(169,204,227,.5); --mesh-3: rgba(201,204,209,.45);
  --t1: #D49AA6; --t2: #A9CCE3; --t3: #5A5D63; --t4: #C9CCD1; --t5: #B8C9DE; --t6: #EFC6CF;
  --forest: #5A5D63; --moss: #A9CCE3; --teal: #C9CCD1; --cyan: #D49AA6;
  --pop: #D49AA6; --pop-2: #A9CCE3; --pop-deep: #2C2E31;
  --pop-grad: linear-gradient(100deg, #D49AA6, #A9CCE3);
}
/* 30 · Eau nuit · anthracite verdi, accent vert d'eau */
html[data-theme="30"] {
  --on-pop: #2C3735; --inset: rgba(0,0,0,.22);
  --bg: #2C3735; --bg-2: #343F3D; --surf: #3E4A48;
  --line: rgba(243,239,231,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.74); --txt-3: rgba(243,239,231,.5);
  --card-a: #3E4A48; --card-b: #323D3B;
  --paper: #F5F0E4; --paper-ink: #4B4F55;
  --deep: #202927; --deep-2: #2C3735; --silhouette: rgba(16,22,21,.72);
  --clip-a: #47605C; --clip-b: #6E9089;
  --dot: rgba(243,239,231,.13); --shadow: rgba(14,19,18,.72);
  --orb-1: rgba(168,213,208,.5); --orb-2: rgba(192,96,127,.32);
  --mesh-1: rgba(168,213,208,.6); --mesh-2: rgba(239,198,207,.42); --mesh-3: rgba(166,184,162,.45);
  --t1: #A8D5D0; --t2: #A6B8A2; --t3: #47605C; --t4: #C0607F; --t5: #B7DCCB; --t6: #B8C9DE;
  --forest: #47605C; --moss: #A8D5D0; --teal: #B7DCCB; --cyan: #EFC6CF;
  --pop: #A8D5D0; --pop-2: #B7DCCB; --pop-deep: #202927;
  --pop-grad: linear-gradient(100deg, #A8D5D0, #B7DCCB);
}
/* ============================================================
   Dix variantes SOMBRES où la framboise douce #C0607F passe au
   premier plan : titres, boutons, cartes. ?theme=31..40
   ============================================================ */

/* 31 · Framboise pleine · l'accent devient la framboise elle-même */
html[data-theme="31"] {
  --on-pop: #FFFFFF; --inset: rgba(0,0,0,.24);
  --bg: #2F3136; --bg-2: #373940; --surf: #43464D;
  --line: rgba(243,239,231,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.75); --txt-3: rgba(243,239,231,.5);
  --card-a: #43464D; --card-b: #37393F;
  --paper: #F5F0E4; --paper-ink: #4B4F55;
  --deep: #222429; --deep-2: #2F3136; --silhouette: rgba(18,19,22,.72);
  --clip-a: #6B4353; --clip-b: #9A5670;
  --dot: rgba(243,239,231,.13); --shadow: rgba(16,17,20,.72);
  --orb-1: rgba(192,96,127,.6); --orb-2: rgba(239,198,207,.32);
  --mesh-1: rgba(192,96,127,.6); --mesh-2: rgba(239,198,207,.5); --mesh-3: rgba(154,146,140,.35);
  --t1: #C0607F; --t2: #D49AA6; --t3: #6B4353; --t4: #EFC6CF; --t5: #B7A39A; --t6: #9A928C;
  --forest: #6B4353; --moss: #C0607F; --teal: #D49AA6; --cyan: #EFC6CF;
  --pop: #C0607F; --pop-2: #EFC6CF; --pop-deep: #222429;
  --pop-grad: linear-gradient(100deg, #C0607F, #EFC6CF);
}
/* 32 · Framboise profonde · le fond lui-même est teinté framboise */
html[data-theme="32"] {
  --on-pop: #FFFFFF; --inset: rgba(0,0,0,.24);
  --bg: #2C2429; --bg-2: #352B31; --surf: #40343B;
  --line: rgba(243,239,231,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.75); --txt-3: rgba(243,239,231,.5);
  --card-a: #40343B; --card-b: #332A2F;
  --paper: #F5F0E4; --paper-ink: #4B4F55;
  --deep: #1F191D; --deep-2: #2C2429; --silhouette: rgba(16,12,14,.72);
  --clip-a: #6B4353; --clip-b: #A05A74;
  --dot: rgba(243,239,231,.13); --shadow: rgba(14,11,13,.74);
  --orb-1: rgba(192,96,127,.6); --orb-2: rgba(183,163,154,.35);
  --mesh-1: rgba(192,96,127,.65); --mesh-2: rgba(239,198,207,.5); --mesh-3: rgba(212,154,166,.5);
  --t1: #C0607F; --t2: #B7A39A; --t3: #6B4353; --t4: #D49AA6; --t5: #EFC6CF; --t6: #9A928C;
  --forest: #6B4353; --moss: #C0607F; --teal: #D49AA6; --cyan: #EFC6CF;
  --pop: #C0607F; --pop-2: #EFC6CF; --pop-deep: #1F191D;
  --pop-grad: linear-gradient(100deg, #C0607F, #D49AA6);
}
/* 33 · Framboise marine · marine profond, framboise en accent plein */
html[data-theme="33"] {
  --on-pop: #FFFFFF; --inset: rgba(0,0,0,.24);
  --bg: #24344A; --bg-2: #2C3E57; --surf: #364A66;
  --line: rgba(243,239,231,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.74); --txt-3: rgba(243,239,231,.5);
  --card-a: #35485F; --card-b: #2A3B51;
  --paper: #F5F0E4; --paper-ink: #3E5473;
  --deep: #1C2938; --deep-2: #24344A; --silhouette: rgba(20,30,42,.74);
  --clip-a: #46607F; --clip-b: #A05A74;
  --dot: rgba(243,239,231,.12); --shadow: rgba(14,22,32,.72);
  --orb-1: rgba(192,96,127,.6); --orb-2: rgba(127,160,194,.42);
  --mesh-1: rgba(192,96,127,.6); --mesh-2: rgba(184,201,222,.5); --mesh-3: rgba(239,198,207,.5);
  --t1: #C0607F; --t2: #7FA0C2; --t3: #46607F; --t4: #D49AA6; --t5: #EFC6CF; --t6: #B8C9DE;
  --forest: #46607F; --moss: #C0607F; --teal: #D49AA6; --cyan: #EFC6CF;
  --pop: #C0607F; --pop-2: #EFC6CF; --pop-deep: #1C2938;
  --pop-grad: linear-gradient(100deg, #C0607F, #EFC6CF);
}
/* 34 · Framboise sauge · framboise en accent, vert sauge autour */
html[data-theme="34"] {
  --on-pop: #FFFFFF; --inset: rgba(0,0,0,.22);
  --bg: #2F3A36; --bg-2: #37423E; --surf: #414D48;
  --line: rgba(243,239,231,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.75); --txt-3: rgba(243,239,231,.5);
  --card-a: #414D48; --card-b: #35403C;
  --paper: #F5F0E4; --paper-ink: #4B4F55;
  --deep: #232C29; --deep-2: #2F3A36; --silhouette: rgba(18,24,22,.72);
  --clip-a: #57634F; --clip-b: #A05A74;
  --dot: rgba(243,239,231,.13); --shadow: rgba(16,21,19,.72);
  --orb-1: rgba(192,96,127,.6); --orb-2: rgba(166,184,162,.45);
  --mesh-1: rgba(192,96,127,.6); --mesh-2: rgba(166,184,162,.5); --mesh-3: rgba(239,198,207,.45);
  --t1: #C0607F; --t2: #A6B8A2; --t3: #57634F; --t4: #EFC6CF; --t5: #B7DCCB; --t6: #D49AA6;
  --forest: #57634F; --moss: #C0607F; --teal: #A6B8A2; --cyan: #EFC6CF;
  --pop: #C0607F; --pop-2: #EFC6CF; --pop-deep: #232C29;
  --pop-grad: linear-gradient(100deg, #C0607F, #EFC6CF);
}
/* 35 · Framboise denim · framboise en accent, bleus autour */
html[data-theme="35"] {
  --on-pop: #FFFFFF; --inset: rgba(0,0,0,.22);
  --bg: #2E353E; --bg-2: #363E48; --surf: #414A56;
  --line: rgba(243,239,231,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.74); --txt-3: rgba(243,239,231,.5);
  --card-a: #414A56; --card-b: #343C46;
  --paper: #F5F0E4; --paper-ink: #3E5473;
  --deep: #232830; --deep-2: #2E353E; --silhouette: rgba(18,22,28,.72);
  --clip-a: #45596B; --clip-b: #A05A74;
  --dot: rgba(243,239,231,.13); --shadow: rgba(16,19,24,.72);
  --orb-1: rgba(192,96,127,.58); --orb-2: rgba(127,160,194,.45);
  --mesh-1: rgba(192,96,127,.6); --mesh-2: rgba(127,160,194,.5); --mesh-3: rgba(184,201,222,.45);
  --t1: #C0607F; --t2: #7FA0C2; --t3: #45596B; --t4: #B8C9DE; --t5: #EFC6CF; --t6: #A9CCE3;
  --forest: #45596B; --moss: #C0607F; --teal: #7FA0C2; --cyan: #EFC6CF;
  --pop: #C0607F; --pop-2: #EFC6CF; --pop-deep: #232830;
  --pop-grad: linear-gradient(100deg, #C0607F, #EFC6CF);
}
/* 36 · Framboise perle · gris perle foncé, framboise au premier plan */
html[data-theme="36"] {
  --on-pop: #FFFFFF; --inset: rgba(0,0,0,.2);
  --bg: #3B3D40; --bg-2: #43454A; --surf: #4E5156;
  --line: rgba(243,239,231,.18);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.76); --txt-3: rgba(243,239,231,.52);
  --card-a: #4E5156; --card-b: #414449;
  --paper: #F5F0E4; --paper-ink: #4B4F55;
  --deep: #2C2E31; --deep-2: #3B3D40; --silhouette: rgba(24,25,27,.7);
  --clip-a: #5A5D63; --clip-b: #A05A74;
  --dot: rgba(243,239,231,.15); --shadow: rgba(20,21,23,.7);
  --orb-1: rgba(192,96,127,.6); --orb-2: rgba(201,204,209,.38);
  --mesh-1: rgba(192,96,127,.6); --mesh-2: rgba(201,204,209,.5); --mesh-3: rgba(239,198,207,.5);
  --t1: #C0607F; --t2: #C9CCD1; --t3: #5A5D63; --t4: #D49AA6; --t5: #EFC6CF; --t6: #9A928C;
  --forest: #5A5D63; --moss: #C0607F; --teal: #D49AA6; --cyan: #EFC6CF;
  --pop: #C0607F; --pop-2: #EFC6CF; --pop-deep: #2C2E31;
  --pop-grad: linear-gradient(100deg, #C0607F, #C9CCD1);
}
/* 37 · Framboise mauve · framboise et mauve ensemble */
html[data-theme="37"] {
  --on-pop: #FFFFFF; --inset: rgba(0,0,0,.22);
  --bg: #322D38; --bg-2: #3A3541; --surf: #453F4E;
  --line: rgba(243,239,231,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.75); --txt-3: rgba(243,239,231,.5);
  --card-a: #453F4E; --card-b: #383341;
  --paper: #F5F0E4; --paper-ink: #4B4F55;
  --deep: #241F29; --deep-2: #322D38; --silhouette: rgba(18,15,21,.72);
  --clip-a: #574E68; --clip-b: #A05A74;
  --dot: rgba(243,239,231,.13); --shadow: rgba(16,13,19,.72);
  --orb-1: rgba(192,96,127,.6); --orb-2: rgba(168,137,181,.45);
  --mesh-1: rgba(192,96,127,.6); --mesh-2: rgba(168,137,181,.5); --mesh-3: rgba(185,169,214,.45);
  --t1: #C0607F; --t2: #A889B5; --t3: #574E68; --t4: #B9A9D6; --t5: #EFC6CF; --t6: #D49AA6;
  --forest: #574E68; --moss: #C0607F; --teal: #A889B5; --cyan: #EFC6CF;
  --pop: #C0607F; --pop-2: #B9A9D6; --pop-deep: #241F29;
  --pop-grad: linear-gradient(100deg, #C0607F, #A889B5);
}
/* 38 · Framboise totale · toute la page dans la famille rose */
html[data-theme="38"] {
  --on-pop: #FFFFFF; --inset: rgba(0,0,0,.22);
  --bg: #2A2126; --bg-2: #33282E; --surf: #3E3138;
  --line: rgba(243,239,231,.17);
  --txt: #F5EDEE; --txt-2: rgba(245,237,238,.76); --txt-3: rgba(245,237,238,.52);
  --card-a: #4A3941; --card-b: #372B31;
  --paper: #F5F0E4; --paper-ink: #4B4F55;
  --deep: #1C1519; --deep-2: #2A2126; --silhouette: rgba(14,10,12,.74);
  --clip-a: #7A4759; --clip-b: #B05A78;
  --dot: rgba(245,237,238,.14); --shadow: rgba(12,9,11,.74);
  --orb-1: rgba(192,96,127,.7); --orb-2: rgba(239,198,207,.4);
  --mesh-1: rgba(192,96,127,.7); --mesh-2: rgba(239,198,207,.55); --mesh-3: rgba(212,154,166,.55);
  --t1: #C0607F; --t2: #D49AA6; --t3: #7A4759; --t4: #EFC6CF; --t5: #B7A39A; --t6: #A05A74;
  --forest: #7A4759; --moss: #C0607F; --teal: #D49AA6; --cyan: #EFC6CF;
  --pop: #C0607F; --pop-2: #EFC6CF; --pop-deep: #1C1519;
  --pop-grad: linear-gradient(100deg, #C0607F, #EFC6CF);
}
/* 39 · Framboise menthe nuit · framboise en accent, menthe en second */
html[data-theme="39"] {
  --on-pop: #FFFFFF; --inset: rgba(0,0,0,.22);
  --bg: #303634; --bg-2: #383E3C; --surf: #434A47;
  --line: rgba(243,239,231,.16);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.75); --txt-3: rgba(243,239,231,.5);
  --card-a: #434A47; --card-b: #373D3B;
  --paper: #F5F0E4; --paper-ink: #4B4F55;
  --deep: #232827; --deep-2: #303634; --silhouette: rgba(18,21,20,.72);
  --clip-a: #4C5F58; --clip-b: #A05A74;
  --dot: rgba(243,239,231,.13); --shadow: rgba(16,19,18,.72);
  --orb-1: rgba(192,96,127,.6); --orb-2: rgba(183,220,203,.45);
  --mesh-1: rgba(192,96,127,.6); --mesh-2: rgba(183,220,203,.55); --mesh-3: rgba(239,198,207,.45);
  --t1: #C0607F; --t2: #B7DCCB; --t3: #4C5F58; --t4: #EFC6CF; --t5: #A8D5D0; --t6: #D49AA6;
  --forest: #4C5F58; --moss: #C0607F; --teal: #B7DCCB; --cyan: #EFC6CF;
  --pop: #C0607F; --pop-2: #B7DCCB; --pop-deep: #232827;
  --pop-grad: linear-gradient(100deg, #C0607F, #B7DCCB);
}
/* 40 · Framboise taupe · framboise sur les neutres taupe froid */
html[data-theme="40"] {
  --on-pop: #FFFFFF; --inset: rgba(0,0,0,.22);
  --bg: #34322F; --bg-2: #3C3A37; --surf: #474441;
  --line: rgba(243,239,231,.17);
  --txt: #F3EFE7; --txt-2: rgba(243,239,231,.75); --txt-3: rgba(243,239,231,.52);
  --card-a: #474441; --card-b: #3A3835;
  --paper: #F5F0E4; --paper-ink: #4B4F55;
  --deep: #26241F; --deep-2: #34322F; --silhouette: rgba(20,19,16,.72);
  --clip-a: #5E5751; --clip-b: #A05A74;
  --dot: rgba(243,239,231,.14); --shadow: rgba(18,17,14,.72);
  --orb-1: rgba(192,96,127,.6); --orb-2: rgba(183,163,154,.45);
  --mesh-1: rgba(192,96,127,.6); --mesh-2: rgba(183,163,154,.5); --mesh-3: rgba(239,198,207,.45);
  --t1: #C0607F; --t2: #B7A39A; --t3: #5E5751; --t4: #D49AA6; --t5: #9A928C; --t6: #EFC6CF;
  --forest: #5E5751; --moss: #C0607F; --teal: #B7A39A; --cyan: #EFC6CF;
  --pop: #C0607F; --pop-2: #EFC6CF; --pop-deep: #26241F;
  --pop-grad: linear-gradient(100deg, #C0607F, #B7A39A);
}

/* ============================================================
   Textures de fond · ?bg=1..8 · remplacent la trame de points
   ============================================================ */

/* 1 · Grain seul : aucune trame, juste le grain argentique */
html[data-bg="1"] .bg::before { background-image: none; }
html[data-bg="1"] .grain { opacity: .16; }
html[data-bg="1"][data-light] .grain { opacity: .06; }

/* 2 · Papier : fibres irrégulières, comme une feuille tenue à la lumière */
html[data-bg="2"] .bg::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.62' numOctaves='3' seed='11'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='260' height='260' filter='url(%23p)'/%3E%3C/svg%3E");
  background-size: 260px 260px;
  opacity: .32; mix-blend-mode: soft-light;
}
html[data-bg="2"][data-light] .bg::before { opacity: .5; mix-blend-mode: multiply; }
html[data-bg="2"] .grain { opacity: .05; }

/* 3 · Lignes : fines lignes horizontales, façon banc de montage */
html[data-bg="3"] .bg::before {
  background-image: repeating-linear-gradient(180deg, var(--dot) 0 1px, transparent 1px 7px);
  background-size: auto;
}
/* 4 · Quadrillage : grille de timeline */
html[data-bg="4"] .bg::before {
  background-image:
    repeating-linear-gradient(180deg, var(--dot) 0 1px, transparent 1px 64px),
    repeating-linear-gradient(90deg, var(--dot) 0 1px, transparent 1px 64px);
  background-size: auto;
}
/* 5 · Diagonales : hachures fines à 45 degrés */
html[data-bg="5"] .bg::before {
  background-image: repeating-linear-gradient(45deg, var(--dot) 0 1px, transparent 1px 9px);
  background-size: auto;
}
/* 6 · Nuages : aucune trame, de grandes nappes floues et du grain */
html[data-bg="6"] .bg::before { background-image: none; }
html[data-bg="6"] .orb { filter: blur(120px); opacity: .8; }
html[data-bg="6"] .orb.o1 { width: 80vw; height: 80vw; left: -26vw; top: -30vw; }
html[data-bg="6"] .orb.o2 { width: 70vw; height: 70vw; right: -24vw; top: 8vh; }
html[data-bg="6"] .grain { opacity: .1; }

/* 7 · Tissu : croisillon serré, texture textile */
html[data-bg="7"] .bg::before {
  background-image:
    repeating-linear-gradient(45deg, var(--dot) 0 1px, transparent 1px 5px),
    repeating-linear-gradient(-45deg, var(--dot) 0 1px, transparent 1px 5px);
  background-size: auto;
  opacity: .65;
}
/* 8 · Voile : rien qu'un halo doux, la surface la plus nue */
html[data-bg="8"] .bg::before { background-image: none; }
html[data-bg="8"] .grain { opacity: .05; }
html[data-bg="8"] .orb { opacity: .38; }

/* ---------- fonds animés (bg.js) · ?bg=9..16 ---------- */
#bgfx { position: absolute; inset: 0; width: 100%; height: 100%; }
html[data-bg="9"] .bg::before, html[data-bg="10"] .bg::before, html[data-bg="11"] .bg::before,
html[data-bg="12"] .bg::before, html[data-bg="13"] .bg::before, html[data-bg="14"] .bg::before,
html[data-bg="15"] .bg::before, html[data-bg="16"] .bg::before { background-image: none; }
html[data-bg="9"] .orb, html[data-bg="14"] .orb, html[data-bg="15"] .orb { display: none; }
html[data-bg="10"] .orb, html[data-bg="11"] .orb, html[data-bg="16"] .orb { opacity: .3; }
html[data-bg="12"] .orb { opacity: .4; }
html[data-bg="10"] .grain, html[data-bg="13"] .grain { opacity: .07; }
html[data-bg="14"] #bgfx { mix-blend-mode: screen; opacity: .55; }
html[data-bg="14"][data-light] #bgfx { mix-blend-mode: multiply; opacity: .35; }

/* ---------- l'orage : éclair et bascule des nuages au bleu nuit ---------- */
html[data-theme="7"] { --storm-1: #2f5288; --storm-2: #0e1728; --storm-3: #5b82c4; }
#bolt { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 44; mix-blend-mode: screen; pointer-events: none; }
#flash { position: fixed; inset: 0; z-index: 46; pointer-events: none; opacity: 0; mix-blend-mode: screen;
  background:
    radial-gradient(85% 70% at var(--fx, 50%) 6%, #ffffff, rgba(226,241,255,.75) 42%, rgba(170,205,255,.35) 74%, transparent 92%),
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(236,246,255,.9) 55%, rgba(214,232,255,.88)); }
@media (prefers-reduced-motion: reduce) { #bolt, #flash { display: none; } }