:root{
  --bul:url("bulles.png");
  --navy:#092D59; --navy-d:#061D39; --navy-l:#1B4A85;
  --crimson:#C0093A; --crimson-d:#A91236;
  --paper:#EDF3F9; --blue:#E7EFF9; --rose:#F9ECF0; --brd:#D0DEED; --brd2:#DCE6F1;
  --ink:#15273D; --soft:#4B5A6B; --soft2:#4E5A68; --green:#357946; --amber:#9B5F08;
  --sand:#F2E9DB; --sand2:#E7DAC3;
  --a1:#B00836; --a2:#0C6E7A; --b1:#1B6E48; --b2:#9B5F08; --c1:#5F3891;
  --sh:0 1px 3px rgba(9,45,89,.08); --sh2:0 4px 18px rgba(9,45,89,.12);
}
.bulles{background:var(--bul) center/contain no-repeat;display:inline-block;aspect-ratio:1403/1042;height:22px}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--paper);color:var(--ink);margin:0;
  font-family:Inter,-apple-system,"Helvetica Neue",Segoe UI,Roboto,sans-serif;
  font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}

/* ══════════ NAVIGATEUR DE MAQUETTE ══════════ */
#nav{width:246px;flex:0 0 246px;background:var(--navy-d);color:#fff;height:100vh;
  overflow-y:auto;position:sticky;top:0;padding:18px 0 40px}
#nav .brand{display:flex;align-items:center;gap:8px;padding:0 14px 15px;border-bottom:1px solid rgba(255,255,255,.12)}
#nav .brand{border-bottom:1px solid rgba(255,255,255,.12)}
#nav .brand .bulles{height:22px}
#nav .brand b{font-size:10px;letter-spacing:.7px;white-space:nowrap}
#nav .brand span{display:block;font-size:9.5px;letter-spacing:1px;color:#A8C0DC;font-weight:600}
#nav h4{margin:20px 18px 7px;font-size:9.5px;letter-spacing:1.4px;color:#6E8BB0;font-weight:800}
#nav a{display:flex;align-items:center;gap:9px;padding:7px 18px;color:#C6D6E8;
  text-decoration:none;font-size:13px;cursor:pointer;border-left:3px solid transparent}
#nav a:hover{background:rgba(255,255,255,.05);color:#fff}
#nav a.on{background:rgba(192,9,58,.18);border-left-color:var(--crimson);color:#fff;font-weight:600}
#nav a i{font-style:normal;width:16px;text-align:center;opacity:.75;font-size:12px}
#nav .note{margin:22px 18px 0;padding:11px 12px;background:rgba(255,255,255,.06);
  border-radius:7px;font-size:11px;line-height:1.55;color:#B4C8E0}

/* ══════════ SCÈNE ══════════ */
#stage{flex:1;height:100vh;overflow-y:auto;padding:22px 26px 70px}
.screenwrap{max-width:1180px;margin:0 auto}
.screenhead{display:flex;align-items:baseline;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.screenhead h2{margin:0;font-size:17px;color:var(--navy);font-weight:800}
.screenhead .url{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;
  color:var(--soft);background:#fff;border:1px solid var(--brd);padding:2px 9px;border-radius:20px}
.screenhead .who{font-size:11px;font-weight:700;letter-spacing:.6px;padding:2px 9px;border-radius:20px}
.who.pub{background:#E3EEFB;color:var(--navy)}
.who.eleve{background:#E6F3EA;color:var(--green)}
.who.prof{background:#F4EAF7;color:#6B3FA0}
.who.app{background:#FBEAF0;color:var(--crimson-d)}
.screenhead .cmt{font-size:12.5px;color:var(--soft);font-style:italic;flex-basis:100%}
.browser{background:#fff;border-radius:11px;box-shadow:var(--sh2);overflow:hidden;border:1px solid #C4D3E4}
.chrome{background:#F2F5F9;border-bottom:1px solid var(--brd);padding:8px 13px;display:flex;align-items:center;gap:7px}
.dot{width:10px;height:10px;border-radius:50%}
.bar{flex:1;background:#fff;border:1px solid var(--brd);border-radius:20px;padding:3px 12px;
  font-size:11.5px;color:var(--soft);font-family:ui-monospace,Menlo,monospace}
.screen{display:none}
.screen.on{display:block}

/* ══════════ SITE ══════════ */
.site{background:var(--paper);font-size:14px}
.topnav{background:#fff;border-bottom:1px solid var(--brd);padding:11px 20px;
  display:flex;align-items:center;gap:15px;row-gap:9px;flex-wrap:wrap;
  position:relative;white-space:nowrap;z-index:30}
.topnav .lg{display:flex;align-items:center;gap:8px}
.topnav .lg .bulles{height:23px}
.topnav .lg{flex:0 0 auto}
.topnav .lg b{font-size:11px;letter-spacing:.8px;color:var(--navy);white-space:nowrap}
.topnav .lk{font-size:12.5px;color:var(--ink);cursor:pointer;font-weight:500;white-space:nowrap}
.topnav .lk:hover{color:var(--crimson)}
.topnav .lk.act{color:var(--crimson);font-weight:700}
.topnav .rt{margin-left:auto;display:flex;align-items:center;gap:10px;flex:0 0 auto}
.btn{display:inline-block;font-size:13px;font-weight:700;border:0;border-radius:7px;
  padding:8px 17px;background:var(--crimson);color:#fff;cursor:pointer;text-decoration:none;
  transition:.15s;line-height:1.4}
.btn:hover{background:var(--crimson-d)}
.btn.nv{background:var(--navy)} .btn.nv:hover{background:var(--navy-d)}
.btn.gh{background:transparent;color:var(--navy);border:1.5px solid var(--brd)}
.btn.gh:hover{border-color:var(--navy)}
.btn.sm{font-size:12px;padding:6px 13px}
.btn.lg{font-size:15px;padding:12px 26px}
.btn.w{background:#fff;color:var(--navy)}

.hero{background:linear-gradient(160deg,var(--navy) 0%,var(--navy-d) 100%);color:#fff;
  padding:52px 26px 56px;position:relative;overflow:hidden}
.hero .circ{position:absolute;border-radius:50%;background:rgba(255,255,255,.04)}
.heroin{max-width:1000px;margin:0 auto;display:grid;grid-template-columns:1.15fr .85fr;
  gap:34px;align-items:center;position:relative;z-index:2}
.hero .kick{display:inline-block;background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.2);
  font-size:11px;font-weight:700;letter-spacing:1px;padding:5px 13px;border-radius:20px;margin-bottom:15px}
.hero h1{font-size:37px;line-height:1.1;margin:0 0 13px;font-weight:900;letter-spacing:-1px}
.hero h1 em{color:#FFB8C9;font-style:normal}
.hero p{color:#C6D6E8;font-size:15.5px;margin:0 0 22px;max-width:460px}
.hero .cta{display:flex;gap:11px;flex-wrap:wrap}
.hero .tiny{font-size:11.5px;color:#8FA8C4;margin-top:13px}
.mascots{background:rgba(255,255,255,.05);border:1.5px dashed rgba(255,255,255,.22);
  border-radius:13px;height:246px;display:grid;place-items:center;text-align:center;
  color:#A8C0DC;font-size:12px;padding:16px}
.mascots b{display:block;font-size:11px;letter-spacing:1.3px;color:#B4C8E0;margin-bottom:6px}

section.blk{padding:44px 26px}
.in{max-width:1000px;margin:0 auto}
.eyebrow{font-size:10.5px;font-weight:800;letter-spacing:1.8px;color:var(--crimson);margin-bottom:8px}
h2.sh{font-size:26px;font-weight:900;color:var(--navy);margin:0 0 9px;letter-spacing:-.6px}
p.lead{color:var(--soft);font-size:15px;max-width:620px;margin:0 0 26px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:17px}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.card{background:#fff;border:1px solid var(--brd);border-radius:11px;padding:20px;box-shadow:var(--sh)}
.card h3{margin:0 0 7px;font-size:16px;color:var(--navy);font-weight:800}
.card p{margin:0;color:var(--soft);font-size:13.5px}
.card .ico{width:38px;height:38px;border-radius:9px;background:var(--blue);display:grid;
  place-items:center;font-size:18px;margin-bottom:12px}
.card.hi{border-color:var(--crimson);border-width:1.5px;position:relative}
.card.hi::after{content:"LE PLUS CHOISI";position:absolute;top:-9px;right:14px;background:var(--crimson);
  color:#fff;font-size:9px;font-weight:800;letter-spacing:.8px;padding:3px 9px;border-radius:20px}
.price{font-size:29px;font-weight:900;color:var(--navy);letter-spacing:-1px;margin:6px 0 2px;white-space:nowrap}
.price small{font-size:13px;font-weight:600;color:var(--soft2);white-space:nowrap}
ul.ck{list-style:none;padding:0;margin:14px 0 0;font-size:13px;color:var(--ink)}
ul.ck li{padding:4px 0 4px 22px;position:relative}
ul.ck li::before{content:"✓";position:absolute;left:0;color:var(--green);font-weight:800}
ul.ck li.no{color:var(--soft2)} ul.ck li.no::before{content:"—";color:var(--soft2)}


.mrow{display:grid;grid-template-columns:34px 1fr;gap:14px;margin-bottom:20px;align-items:start}
.mnum{width:34px;height:34px;border-radius:50%;background:var(--crimson);color:#fff;
  display:grid;place-items:center;font-weight:800;font-size:14px}
.mrow h4{margin:4px 0 4px;font-size:15px;color:var(--navy)}
.mrow p{margin:0;color:var(--soft);font-size:13.5px}
.samplebox{background:var(--rose);border-left:3px solid var(--crimson);border-radius:0 8px 8px 0;
  padding:14px 17px;font-size:13.5px}
.samplebox b{color:var(--crimson-d)}

.books{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.book{background:#fff;border:1px solid var(--brd);border-radius:10px;overflow:hidden;
  box-shadow:var(--sh);cursor:pointer;transition:.15s}
.book:hover{transform:translateY(-3px);box-shadow:var(--sh2)}
.book .cv{aspect-ratio:1/1.414;background:linear-gradient(165deg,var(--navy),var(--navy-d));
  display:grid;place-items:center;position:relative;color:#fff;text-align:center;padding:12px}
.book .cv .lvl{position:absolute;top:9px;right:9px;font-size:9.5px;font-weight:800;
  padding:3px 8px;border-radius:20px;color:#fff}
.book .cv h5{font-size:14px;font-weight:900;margin:0;line-height:1.15;letter-spacing:-.3px}
.book .cv span{font-size:9px;letter-spacing:1.2px;color:#8FA8C4;display:block;margin-top:5px}
.book .ft{padding:9px 11px;font-size:12px;display:flex;justify-content:space-between;align-items:center}
.book .ft b{color:var(--navy)}
.book .ft em{font-style:normal;color:var(--soft2);font-size:11px}

.b2b{background:linear-gradient(120deg,var(--sand),var(--sand2));border-radius:12px;
  padding:26px 30px;display:grid;grid-template-columns:1fr auto;gap:22px;align-items:center}
.b2b h3{margin:0 0 6px;font-size:19px;color:var(--navy);font-weight:900}
.b2b p{margin:0;color:#6B5A42;font-size:13.5px;max-width:520px}

.waitlist{background:var(--navy);color:#fff;border-radius:12px;padding:26px 30px;
  display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center}
.waitlist h3{margin:0 0 5px;font-size:19px;font-weight:900}
.waitlist p{margin:0;color:#B9CBE2;font-size:13.5px;max-width:520px}
.wlform{display:flex;gap:8px}
.wlform input{border:0;border-radius:7px;padding:10px 13px;font:inherit;font-size:13px;width:210px}
.counter{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.1);
  border-radius:20px;padding:4px 12px;font-size:12px;margin-top:11px}
.counter b{color:#fff}
.dotlive{width:7px;height:7px;border-radius:50%;background:#4ADE80;box-shadow:0 0 0 3px rgba(74,222,128,.25)}

footer.site{background:var(--navy-d);color:#8FA8C4;padding:34px 26px 24px;font-size:12.5px}
footer.site .cols{max-width:1000px;margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:26px}
footer.site h5{color:#fff;font-size:11px;letter-spacing:1.2px;margin:0 0 10px}
footer.site a{display:block;color:#8FA8C4;text-decoration:none;padding:2.5px 0}
footer.site .bot{max-width:1000px;margin:24px auto 0;padding-top:15px;
  border-top:1px solid rgba(255,255,255,.09);display:flex;gap:14px;font-size:11.5px}
footer.site .bot em{margin-left:auto;font-style:italic}

/* ── chapitre ── */
.chaphero{background:linear-gradient(160deg,var(--navy),var(--navy-d));color:#fff;padding:30px 26px}
.chaphero .chip{background:var(--crimson);font-size:10.5px;font-weight:800;letter-spacing:.9px;
  padding:4px 11px;border-radius:5px;display:inline-block}
.chaphero h1{font-size:31px;font-weight:900;color:#FFB8C9;margin:12px 0 4px;letter-spacing:-.8px}
.chaphero .hk{color:#C6D6E8;font-style:italic;font-size:14px;margin:0}
.videobox{aspect-ratio:16/9;background:#0B1D33;border-radius:11px;display:grid;place-items:center;
  color:#93AECD;position:relative;overflow:hidden;border:1px solid #1B3A5E}
.play{width:58px;height:58px;border-radius:50%;background:var(--crimson);display:grid;place-items:center;
  color:#fff;font-size:19px;box-shadow:0 6px 22px rgba(192,9,58,.4)}
.exdemo{background:#fff;border:1px solid var(--brd);border-radius:10px;padding:16px 18px;box-shadow:var(--sh)}
.exhd{display:flex;align-items:center;gap:11px;margin-bottom:9px}
.pill{background:var(--crimson);color:#fff;font-size:10px;font-weight:800;letter-spacing:.8px;padding:4px 11px;border-radius:5px}
.exhd b{color:var(--navy);font-size:14px}
.exhd .tg{margin-left:auto;font-size:10.5px;font-weight:700;color:var(--soft2);
  background:var(--blue);border:1px solid var(--brd);padding:2px 9px;border-radius:20px}
.exli{display:grid;grid-template-columns:20px 1fr auto;gap:8px;align-items:center;padding:3px 0;font-size:13.5px}
.exli .n{color:var(--crimson);font-weight:800;font-size:12px;text-align:right}
.fld{display:inline-block;min-width:88px;border-bottom:1.5px dotted #9FB0C2;padding:1px 6px;
  font-weight:600;color:var(--navy)}
.fld.ok{border-bottom:2px solid var(--green);background:#F1F8F3;color:var(--green);border-radius:3px 3px 0 0}
.fld.ko{border-bottom:2px solid var(--crimson);background:#FDF2F5;color:var(--crimson);border-radius:3px 3px 0 0}
.paywall{background:linear-gradient(180deg,rgba(237,243,249,0),var(--paper) 55%);margin-top:-80px;
  padding-top:80px;position:relative;text-align:center}
.pwcard{background:#fff;border:1.5px solid var(--crimson);border-radius:12px;padding:24px;
  max-width:520px;margin:0 auto;box-shadow:var(--sh2)}

/* ── cours ── */
.profcard{display:grid;grid-template-columns:96px 1fr;gap:18px;align-items:start}
.avatar{width:96px;height:96px;border-radius:14px;background:linear-gradient(150deg,var(--navy),var(--navy-l));
  display:grid;place-items:center;color:#fff;font-weight:900;font-size:26px;letter-spacing:-1px}
.badge{display:inline-block;font-size:10.5px;font-weight:700;background:var(--blue);color:var(--navy);
  border:1px solid var(--brd);padding:2px 9px;border-radius:20px;margin:0 5px 5px 0}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:7px}
.day{text-align:center}
.day .dn{font-size:10.5px;font-weight:800;color:var(--soft2);letter-spacing:.6px;margin-bottom:6px}
.slot{background:#fff;border:1px solid var(--brd);border-radius:7px;padding:6px 2px;font-size:11.5px;
  font-weight:600;color:var(--navy);margin-bottom:5px;cursor:pointer}
.slot:hover{border-color:var(--crimson);color:var(--crimson)}
.slot.full{background:#F4F6F9;color:#65707C;border-style:dashed;cursor:not-allowed;text-decoration:line-through}
.slot.sel{background:var(--crimson);color:#fff;border-color:var(--crimson)}

/* ── tableau de bord ── */
.dashgrid{display:grid;grid-template-columns:1.5fr 1fr;gap:17px}
.kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:17px}
.kpicard{background:#fff;border:1px solid var(--brd);border-radius:10px;padding:13px 15px;box-shadow:var(--sh)}
.kpicard .lb{font-size:10.5px;font-weight:700;letter-spacing:.7px;color:var(--soft2);margin-bottom:3px}
.kpicard .vl{font-size:25px;font-weight:900;color:var(--navy);letter-spacing:-1px;line-height:1.1}
.kpicard .vl small{font-size:12px;font-weight:600;color:var(--soft2);letter-spacing:0}
.kpicard .sub{font-size:11.5px;color:var(--soft);margin-top:2px}
.meter{margin:11px 0}
.meter .lab{display:flex;justify-content:space-between;align-items:baseline;font-size:12.5px;
  color:var(--soft);margin-bottom:4px}
.meter .lab b{color:var(--ink);font-weight:700}
.meter .lab .v{font-variant-numeric:tabular-nums;font-weight:800;color:var(--navy)}
.track{height:8px;background:var(--blue);border-radius:5px;overflow:hidden}
.fill{height:100%;border-radius:5px;background:var(--navy)}
.fill.weak{background:var(--crimson)}
.flag{font-size:10.5px;font-weight:700;color:var(--crimson);margin-left:7px}
.reco{background:var(--rose);border-left:3px solid var(--crimson);border-radius:0 9px 9px 0;padding:14px 16px}
.reco>b:first-child{display:block;font-size:10.5px;letter-spacing:1px;color:var(--crimson-d);margin-bottom:5px}
.reco p b,.reco .ritem b{color:var(--crimson-d)}
.reco p{margin:0 0 11px;font-size:13.5px}
.rlist{display:grid;gap:7px}
.ritem{background:#fff;border:1px solid var(--brd);border-radius:8px;padding:9px 12px;
  display:flex;align-items:center;gap:10px;font-size:13px;cursor:pointer}
.ritem:hover{border-color:var(--crimson)}
.ritem .ic{width:26px;height:26px;border-radius:6px;background:var(--blue);display:grid;place-items:center;font-size:13px}
.ritem .ar{margin-left:auto;color:var(--soft2)}
.next{background:linear-gradient(135deg,var(--navy),var(--navy-l));color:#fff;border-radius:11px;padding:18px}
.next .lb{font-size:10.5px;letter-spacing:1.1px;color:#B4C8E0;font-weight:800}
.next h4{margin:7px 0 3px;font-size:18px;font-weight:800}
.next p{margin:0 0 13px;color:#C6D6E8;font-size:13px}
.streak{display:flex;gap:5px;margin-top:9px}
.sday{width:26px;height:26px;border-radius:7px;background:var(--blue);display:grid;place-items:center;
  font-size:10.5px;font-weight:700;color:var(--soft2)}
.sday.on{background:var(--green);color:#fff}
table.tb{width:100%;border-collapse:separate;border-spacing:0;font-size:13px}
table.tb th{text-align:left;font-size:10.5px;letter-spacing:.7px;color:var(--soft2);
  font-weight:800;padding:7px 11px;border-bottom:1px solid var(--brd)}
table.tb td{padding:9px 11px;border-bottom:1px solid var(--brd2)}
.st{font-size:10.5px;font-weight:700;padding:2px 9px;border-radius:20px}
.st.ok{background:#E6F3EA;color:var(--green)} .st.wt{background:#FDF0E1;color:var(--amber)}
.st.dn{background:var(--blue);color:var(--soft)}

/* ── app mobile ── */
.phones{display:flex;gap:22px;flex-wrap:wrap;justify-content:center;padding:26px;background:var(--paper)}
.phone{width:265px;flex:0 0 265px;background:#101B2A;border-radius:32px;padding:9px;box-shadow:var(--sh2)}
.pscreen{background:var(--paper);border-radius:25px;overflow:hidden;height:540px;
  display:flex;flex-direction:column;position:relative}
.pnotch{height:24px;background:#fff;display:flex;align-items:center;justify-content:space-between;
  padding:0 16px;font-size:10px;font-weight:700;color:var(--navy)}
.pbody{flex:1;overflow:hidden;padding:14px}
.ptab{background:#fff;border-top:1px solid var(--brd);display:grid;grid-template-columns:repeat(4,1fr);
  padding:7px 0 9px}
.ptab div{text-align:center;font-size:8.5px;color:var(--soft2);font-weight:600}
.pscreen .ptab[style*="0B1B30"] div{color:#A8C0DC}
.ptab div i{display:block;font-style:normal;font-size:16px;margin-bottom:1px;opacity:.55}
.ptab div.on{color:var(--crimson)} .ptab div.on i{opacity:1}
.pcap{text-align:center;font-size:11.5px;color:var(--soft);margin-top:9px;font-weight:600}
.pcard{background:#fff;border:1px solid var(--brd);border-radius:10px;padding:11px 13px;margin-bottom:9px}
.pcard h5{margin:0 0 3px;font-size:13px;color:var(--navy);font-weight:800}
.pcard p{margin:0;font-size:11.5px;color:var(--soft)}
.psmall{font-size:10px;letter-spacing:.9px;font-weight:800;color:var(--soft2);margin:13px 0 7px}

/* ── architecture ── */
.arch{background:#fff;border-radius:12px;padding:30px;border:1px solid var(--brd)}
.archrow{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-bottom:20px}
.archbox{border:2px solid var(--navy);border-radius:11px;padding:17px;text-align:center;background:var(--blue)}
.archbox.core{border-color:var(--crimson);background:var(--rose);grid-column:1/-1}
.archbox h4{margin:0 0 5px;font-size:15px;color:var(--navy);font-weight:900}
.archbox p{margin:0;font-size:12.5px;color:var(--soft)}
.archbox .tech{display:inline-block;background:#fff;border:1px solid var(--brd);border-radius:20px;
  padding:2px 10px;font-size:11px;font-weight:700;color:var(--navy);margin:7px 4px 0}
.arrow{text-align:center;font-size:22px;color:var(--crimson);margin:-6px 0 8px}
.sharedtbl{width:100%;border-collapse:collapse;font-size:13px;margin-top:8px}
.sharedtbl th{background:var(--navy);color:#fff;font-size:10.5px;letter-spacing:.7px;
  padding:8px 12px;text-align:left}
.sharedtbl th:nth-child(2){background:var(--crimson)}
.sharedtbl td{padding:8px 12px;border-bottom:1px solid var(--brd2);background:var(--blue)}
.sharedtbl td:nth-child(2){background:var(--rose)}
.sharedtbl td:nth-child(3){background:#fff}

.legend{background:#fff;border:1px dashed var(--brd);border-radius:9px;padding:13px 16px;
  font-size:12.5px;color:var(--soft);margin-top:16px;line-height:1.65}
.legend b{color:var(--navy)}





.tvico{width:14px;height:14px;vertical-align:-2px;margin-right:5px;display:inline-block}
.ptab .tvico{width:16px;height:16px;margin:0 auto 1px;display:block}
.qimg{border-radius:12px;overflow:hidden;position:relative;aspect-ratio:16/10;max-width:430px;margin:0 auto 18px;
  border:1.5px dashed rgba(9,45,89,.18);background:
  radial-gradient(circle at 38% 40%,rgba(27,74,133,.16),transparent 62%),
  radial-gradient(circle at 70% 66%,rgba(192,9,58,.13),transparent 58%),
  linear-gradient(155deg,#E7EFF9,#F9ECF0)}
.qimg .lbl2{position:absolute;inset:0;display:grid;place-items:center;text-align:center;color:var(--soft2);
  font-size:12px;line-height:1.65;padding:16px}
.qimg .lbl2 b{display:block;font-size:10px;letter-spacing:1.4px;color:var(--soft);margin-bottom:4px}
.qimg .zoom{position:absolute;right:10px;bottom:10px;background:rgba(9,45,89,.82);color:#fff;
  font-size:10.5px;font-weight:700;padding:3px 9px;border-radius:20px}
.starnote{background:var(--sand);border:1px solid var(--sand2);border-radius:10px;padding:11px 15px;
  font-size:12.5px;color:#6B5A42;margin-bottom:20px;line-height:1.75}
.starnote b{color:var(--navy)}
.starnote .st2{color:var(--crimson);font-weight:800;margin-right:4px}
.fmtgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.fmt{background:#fff;border:1px solid var(--brd);border-radius:11px;padding:14px;box-shadow:var(--sh)}
.fmt .n2{width:24px;height:24px;border-radius:7px;background:var(--crimson);color:#fff;display:grid;
  place-items:center;font-size:11px;font-weight:800;margin-bottom:9px}
.fmt h5{margin:0 0 6px;font-size:12.5px;color:var(--navy);font-weight:800}
.fmt .ex2{background:var(--blue);border-radius:7px;padding:8px 10px;font-size:11.5px;color:var(--ink);line-height:1.5}
.fmt .ex2 em{font-style:normal;color:var(--crimson);font-weight:700}
.fmt .tr{font-size:10.5px;color:var(--soft2);margin-top:6px;font-style:italic}
.serthumb{width:44px;height:44px;border-radius:9px;flex:0 0 44px;position:relative;overflow:hidden;
  border:1px dashed rgba(9,45,89,.2)}

/* S ENTRAINER */
.quickband{background:linear-gradient(120deg,var(--navy),var(--navy-l));color:#fff;border-radius:13px;
  padding:24px 28px;display:grid;grid-template-columns:1fr auto;gap:26px;align-items:center;margin-bottom:24px}
.quickband .lb{font-size:10.5px;letter-spacing:1.1px;color:#B4C8E0;font-weight:800}
.quickband h3{margin:6px 0 4px;font-size:23px;font-weight:900;letter-spacing:-.6px}
.quickband p{margin:0;color:#C6D6E8;font-size:13.5px}
.qbtns{display:flex;gap:8px;align-items:center}
.qbig{background:#fff;color:var(--navy);border-radius:9px;padding:13px 24px;font-weight:800;font-size:14px;cursor:pointer}
.qsm{border:1.5px solid rgba(255,255,255,.4);border-radius:9px;padding:12px 16px;font-weight:700;font-size:13px;cursor:pointer}
.qsm:hover{background:rgba(255,255,255,.14)}
.tcard{background:#fff;border:1px solid var(--brd);border-radius:12px;padding:18px;box-shadow:var(--sh);
  cursor:pointer;transition:.15s;position:relative;display:flex;flex-direction:column}
.tcard:hover{border-color:var(--crimson);transform:translateY(-2px);box-shadow:var(--sh2)}
.tcard .ti{width:40px;height:40px;border-radius:11px;background:var(--blue);display:grid;place-items:center;
  font-size:18px;margin-bottom:12px}
.tcard.hot2 .ti{background:var(--rose)}
.tcard h4{margin:0 0 5px;font-size:15.5px;color:var(--navy);font-weight:800}
.tcard p{margin:0 0 12px;font-size:13px;color:var(--soft);flex:1}
.tcard .foot{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--soft2);font-weight:700}
.tcard .foot .go{margin-left:auto;color:var(--crimson);font-weight:800}
.lock{position:absolute;top:14px;right:14px;background:var(--blue);border:1px solid var(--brd);
  border-radius:20px;padding:2px 9px;color:var(--soft);font-weight:700;font-size:10.5px}
.qwrap{max-width:720px;margin:0 auto}
.qtop{display:flex;align-items:center;gap:12px;font-size:12px;color:var(--soft);margin-bottom:9px}
.qtop b{color:var(--navy)}
.qtop .tmr{margin-left:auto;font-family:ui-monospace,Menlo,monospace;background:#fff;border:1px solid var(--brd);
  border-radius:20px;padding:2px 11px;font-weight:700;color:var(--navy)}
.qprog{height:7px;background:var(--blue);border-radius:5px;overflow:hidden;margin-bottom:22px}
.qprog i{display:block;height:100%;background:var(--crimson);border-radius:5px}
.qtext{font-size:23px;font-weight:800;color:var(--navy);letter-spacing:-.5px;margin:0 0 5px;line-height:1.25}
.qsub{font-size:13px;color:var(--soft);margin:0 0 20px}
.opts{display:grid;gap:9px}
.opt{background:#fff;border:1.5px solid var(--brd);border-radius:10px;padding:13px 16px;font-size:15px;
  display:flex;align-items:center;gap:12px;cursor:pointer;transition:.13s}
.opt:hover{border-color:var(--navy)}
.opt .ltr{width:26px;height:26px;border-radius:7px;background:var(--blue);display:grid;place-items:center;
  font-size:12px;font-weight:800;color:var(--navy);flex:0 0 26px}
.opt .mk{margin-left:auto;font-size:12px;font-weight:800}
.opt.ok{border-color:var(--green);background:#F1F8F3}
.opt.ok .ltr{background:var(--green);color:#fff}
.opt.ok .mk{color:var(--green)}
.opt.ko{border-color:var(--crimson);background:#FDF2F5}
.opt.ko .ltr{background:var(--crimson);color:#fff}
.opt.ko .mk{color:var(--crimson)}
.expl{background:var(--blue);border-left:3px solid var(--navy);border-radius:0 10px 10px 0;
  padding:14px 17px;margin-top:16px;font-size:13.5px}
.expl b.t{display:block;font-size:10.5px;letter-spacing:1px;color:var(--navy);font-weight:800;margin-bottom:5px}
.exsent{background:#fff;border-radius:7px;padding:9px 12px;margin-top:10px;font-style:italic;
  font-size:13px;color:var(--ink);display:flex;align-items:center;gap:9px}
.exsent .src{margin-left:auto;font-style:normal;font-size:11px;color:var(--soft2);font-weight:700;white-space:nowrap}
.qfoot{display:flex;align-items:center;gap:12px;margin-top:20px;padding-top:16px;border-top:1px solid var(--brd)}
.qscore{font-size:13px;color:var(--soft)}
.qscore b{color:var(--navy);font-weight:800}
.resulthead{text-align:center;padding:8px 0 22px}
.ring{width:132px;height:132px;border-radius:50%;margin:0 auto 14px;display:grid;place-items:center;
  background:conic-gradient(var(--green) 0 85%, var(--blue) 85% 100%);position:relative}
.ring::after{content:"";position:absolute;inset:11px;border-radius:50%;background:#fff}
.ring div{position:relative;z-index:2;text-align:center}
.ring .big{font-size:31px;font-weight:900;color:var(--navy);letter-spacing:-1.5px;line-height:1}
.ring .sm2{font-size:11px;color:var(--soft2);font-weight:700}
.mistake{background:#fff;border:1px solid var(--brd);border-left:3px solid var(--crimson);border-radius:0 9px 9px 0;
  padding:11px 15px;margin-bottom:8px;font-size:13.5px}
.mistake .q{font-weight:700;color:var(--navy);margin-bottom:3px}
.mistake .a{color:var(--soft)}
.mistake .a b{color:var(--green)}
.mistake .a s{color:var(--crimson)}



/* ══════════ JAMAIS DE FOND BLANC NU — rappel de marque discret ══════════ */
.blk.wt{position:relative;overflow:hidden;background:
  radial-gradient(circle at 10% 12%, rgba(9,45,89,.055), transparent 42%),
  radial-gradient(circle at 90% 88%, rgba(192,9,58,.048), transparent 44%),
  linear-gradient(180deg,#FFFFFF 0%,#FBFCFE 55%,#F7FAFD 100%)}
.blk.wt::before{content:"";position:absolute;right:-58px;top:-46px;width:250px;height:250px;
  background:var(--bul) center/contain no-repeat;opacity:.05;pointer-events:none}
.blk.wt::after{content:"";position:absolute;left:-70px;bottom:-64px;width:200px;height:200px;
  background:var(--bul) center/contain no-repeat;opacity:.035;
  transform:rotate(-14deg);pointer-events:none}
.blk.wt .in{position:relative;z-index:2}

/* bandeau tarifs — dégradé de marque */
.blk.pricing{position:relative;overflow:hidden;background:
  radial-gradient(circle at 82% 8%, rgba(192,9,58,.10), transparent 46%),
  radial-gradient(circle at 6% 88%, rgba(9,45,89,.10), transparent 48%),
  linear-gradient(160deg,#F4F8FC 0%,#EDF3F9 48%,#F9ECF0 100%)}
.blk.pricing::before{content:"";position:absolute;left:50%;top:-90px;transform:translateX(-50%);
  width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.85),transparent 62%);
  pointer-events:none}
.blk.pricing .in{position:relative;z-index:2}

/* cartes tarifaires colorées */
.pm{overflow:hidden;padding-top:0}
.pm .cap2{height:5px;margin:0 -13px 14px;display:block}
.pm h4{margin-top:0}
.pm .p2{color:var(--acc,var(--navy))}
.pm ul li::before{content:"✓";position:absolute;left:0;color:var(--acc,var(--green));font-weight:900;font-size:11px}
.pm ul li{padding-left:16px}
.card .cap2{height:5px;margin:-20px -20px 15px;display:block;border-radius:11px 11px 0 0}
.card .price{color:var(--acc,var(--navy))}
ul.ck li::before{color:var(--acc,var(--green))}



/* ══════════ SÉLECTEUR D'APPARENCE (côté visiteur) ══════════ */
.thpick{position:relative;width:30px;height:30px;border-radius:50%;border:1px solid var(--brd);
  display:grid;place-items:center;font-size:15px;line-height:1;color:var(--navy);cursor:pointer;
  transition:.15s;background:var(--blue);flex:0 0 30px}
.thpick .thico{font-style:normal;display:block;margin-top:-1px}
.thpick:hover{border-color:var(--crimson);color:var(--crimson)}
.thpick .tip{position:absolute;top:36px;right:-6px;background:var(--navy);color:#fff;font-size:10.5px;
  font-weight:700;letter-spacing:.3px;padding:4px 10px;border-radius:6px;white-space:nowrap;
  opacity:0;pointer-events:none;transition:.15s;z-index:40}
.thpick:hover .tip{opacity:1}
body.dark .thpick{background:var(--surf2);border-color:var(--brd);color:#FFD8E2}
body.dark .thpick .tip{background:#461421}

/* ══════════ BASCULE MENSUEL / ANNUEL ══════════ */
.billrow{display:flex;align-items:center;justify-content:center;gap:14px;margin:0 0 26px;flex-wrap:wrap}
.billsw{display:inline-flex;align-items:center;gap:12px;background:rgba(9,45,89,.06);
  border:1px solid var(--brd);border-radius:30px;padding:5px 7px}
.billsw span{font-size:13px;font-weight:700;color:var(--soft);cursor:pointer;padding:4px 12px;border-radius:20px;transition:.15s}
.billsw span.on{background:var(--navy);color:#fff}
.billsw .knob{width:42px;height:22px;border-radius:20px;background:var(--brd);position:relative;
  cursor:pointer;transition:.2s;padding:0;flex:0 0 42px}
.billsw .knob::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;
  background:#fff;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.25)}
body.annual .billsw .knob{background:var(--crimson)}
body.annual .billsw .knob::after{left:23px}
.billbadge{background:var(--crimson);color:#fff;font-size:11px;font-weight:800;letter-spacing:.4px;
  padding:5px 13px;border-radius:20px}
.by{display:none}
body.annual .bm{display:none}
body.annual .by{display:inline}
.savenote{font-size:11.5px;color:var(--green);font-weight:700;display:none}
body.annual .savenote{display:block}

/* ══════════ ACCÈS RAPIDE / TEST DE NIVEAU / BASCULE KIDS ══════════ */
.audsw{display:inline-flex;background:var(--blue);border:1px solid var(--brd);border-radius:20px;padding:2px;gap:2px}
.audsw b{font-size:11.5px;font-weight:700;padding:4px 13px;border-radius:20px;color:var(--soft);cursor:pointer;transition:.15s}
.audsw b:hover{color:var(--navy)}
.audsw b.on{background:var(--navy);color:#fff}
.audsw b.kid.on{background:var(--crimson)}

.quickrow{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-top:-38px;position:relative;z-index:6}
.qcard2{background:#fff;border:1px solid var(--brd);border-radius:12px;padding:15px 14px;text-align:center;
  box-shadow:0 6px 22px rgba(9,45,89,.13);cursor:pointer;transition:.16s}
.qcard2:hover{transform:translateY(-3px);border-color:var(--crimson);box-shadow:0 10px 28px rgba(9,45,89,.18)}
.qcard2 .i2{width:36px;height:36px;border-radius:10px;background:var(--blue);display:grid;place-items:center;
  font-size:16px;margin:0 auto 9px}
.qcard2.hi2 .i2{background:var(--rose)}
.qcard2 b{display:block;font-size:13.5px;color:var(--navy);font-weight:800;margin-bottom:2px}
.qcard2 span{font-size:11.5px;color:var(--soft2)}

.leveltest{background:linear-gradient(125deg,var(--navy),var(--navy-l));color:#fff;border-radius:14px;
  padding:30px 34px;display:grid;grid-template-columns:1.05fr .95fr;gap:34px;align-items:center}
.leveltest h2{margin:0 0 9px;font-size:27px;font-weight:900;letter-spacing:-.8px;line-height:1.12}
.leveltest h2 em{color:#FFB8C9;font-style:normal}
.leveltest p{margin:0 0 18px;color:#C6D6E8;font-size:14.5px;max-width:420px}
.ltfacts{display:flex;gap:18px;margin-bottom:20px;flex-wrap:wrap}
.ltfacts div{font-size:12px;color:#B4C8E0}
.ltfacts div b{display:block;font-size:19px;color:#fff;font-weight:900;letter-spacing:-.5px}
.ladder{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:17px}
.ladder .st3{display:flex;align-items:center;gap:11px;padding:7px 0}
.ladder .dotl{width:11px;height:11px;border-radius:50%;background:rgba(255,255,255,.22);flex:0 0 11px}
.ladder .st3.hit .dotl{background:#F2436E;box-shadow:0 0 0 4px rgba(242,67,110,.22)}
.ladder .st3 b{font-size:13px;width:26px}
.ladder .st3 span{font-size:12.5px;color:#B4C8E0}
.ladder .st3.hit span{color:#fff}
.ladder .st3.hit b{color:#FFB8C9}
.ladder .res{margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.14);
  font-size:11.5px;color:#C3D5EC}

.kidsband{background:linear-gradient(120deg,#F2E9DB,#F9ECF0);border:1px solid var(--sand2);border-radius:14px;
  padding:26px 30px;display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:center}
.kidsband .kf{width:78px;height:78px;border-radius:18px;background:linear-gradient(150deg,var(--navy),var(--crimson));
  display:grid;place-items:center;font-size:32px;color:#fff;flex:0 0 78px}
.kidsband h3{margin:0 0 5px;font-size:21px;font-weight:900;color:var(--navy);letter-spacing:-.5px}
.kidsband p{margin:0;color:#6B5A42;font-size:13.5px;max-width:540px}
.kidsband .tags2{margin-top:9px}
.pricemini{display:grid;grid-template-columns:repeat(5,1fr);gap:13px}
.pm{background:#fff;border:1px solid var(--brd);border-radius:12px;padding:15px 13px;box-shadow:var(--sh);
  display:flex;flex-direction:column;cursor:pointer;transition:.15s}
.pm:hover{border-color:var(--navy);transform:translateY(-2px)}
.pm.best{border:1.5px solid var(--crimson);position:relative}
.pm.best::after{content:"LE PLUS CHOISI";position:absolute;top:-9px;left:50%;transform:translateX(-50%);
  background:var(--crimson);color:#fff;font-size:8.5px;font-weight:800;letter-spacing:.7px;padding:3px 10px;border-radius:20px;white-space:nowrap}
.pm h4{margin:0 0 6px;font-size:14px;color:var(--navy);font-weight:800}
.pm .p2{font-size:23px;font-weight:900;color:var(--navy);letter-spacing:-1px;line-height:1;white-space:nowrap}
.pm .p2 small{font-size:11.5px;font-weight:600;color:var(--soft2);letter-spacing:0}
.pm .u{font-size:11px;color:var(--soft2);margin:2px 0 11px}
.pm ul{list-style:none;margin:0 0 12px;padding:0;font-size:12px;color:var(--soft);flex:1}
.pm ul li{padding:2.5px 0 2.5px 13px;position:relative;font-size:11.5px}
.pm ul li::before{content:"·";position:absolute;left:3px;color:var(--crimson);font-weight:900}

/* ══════════ BANDEAU D'ACCUEIL — image pleine largeur ══════════ */
.hero2{position:relative;height:470px;overflow:hidden;background:#08152A}
.heroimg{position:absolute;inset:-24px;background:
  radial-gradient(circle at 26% 42%,rgba(27,74,133,.85),transparent 58%),
  radial-gradient(circle at 74% 58%,rgba(150,20,55,.62),transparent 56%),
  linear-gradient(150deg,#0E3A6B 0%,#08152A 52%,#2A0A1A 100%);
  animation:kenburns 26s ease-in-out infinite alternate;
  transition:transform .5s cubic-bezier(.22,.61,.36,1)}
@keyframes kenburns{from{transform:scale(1)}to{transform:scale(1.07)}}
.heroimg .ph{position:absolute;left:44px;bottom:96px;max-width:298px;text-align:left;background:rgba(6,18,34,.62);border-radius:9px;padding:10px 13px 11px;backdrop-filter:blur(2px);
  border-left:2px solid rgba(255,255,255,.22);padding-left:12px;
  color:rgba(255,255,255,.66);font-size:11px;line-height:1.65;z-index:2}
.heroimg .ph b{display:block;font-size:9.5px;letter-spacing:1.5px;color:rgba(255,255,255,.82);margin-bottom:4px}
.heroimg .ph em{font-style:normal;font-size:9.5px;color:rgba(255,255,255,.78)}
/* silhouettes indicatives des deux mascottes — remplacées par l'image finale */
.figs{position:absolute;inset:0;z-index:1;pointer-events:none}
.fig{position:absolute;bottom:0;border-radius:50% 50% 12% 12%/62% 62% 8% 8%;filter:blur(1.5px);
  animation:floaty 11s ease-in-out infinite alternate}
.fig::after{content:"";position:absolute;left:50%;top:-13%;transform:translateX(-50%);
  width:52%;aspect-ratio:1;border-radius:50%}
.fig.t{left:15%;width:190px;height:300px;background:linear-gradient(180deg,rgba(27,74,133,.62),rgba(9,45,89,.16))}
.fig.t::after{background:rgba(31,86,155,.66)}
.fig.f{right:16%;width:172px;height:272px;background:linear-gradient(180deg,rgba(150,20,55,.55),rgba(120,10,40,.14));
  animation-delay:-4s}
.fig.f::after{background:rgba(175,25,66,.62)}
.heroscrim{position:absolute;inset:0;background:linear-gradient(0deg,rgba(6,17,33,.92) 4%,rgba(6,17,33,.30) 46%,rgba(6,17,33,.55) 100%)}
.heroctn{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:0 30px;z-index:3;color:#fff}
.heroctn .kick2{font-size:11px;font-weight:700;letter-spacing:4.5px;color:#C6D6E8;margin-bottom:15px}
.heroctn h1{font-size:44px;font-weight:900;letter-spacing:-1.4px;line-height:1.06;margin:0 0 14px;max-width:760px}
.heroctn h1 em{color:#FFB8C9;font-style:normal}
.heroctn p{color:#C6D6E8;font-size:15.5px;max-width:520px;margin:0 0 24px;line-height:1.6}
.heroctn .cta{display:flex;gap:11px;flex-wrap:wrap;justify-content:center}
.hbtn{display:inline-block;font-size:14px;font-weight:700;border-radius:8px;padding:13px 30px;
  background:var(--crimson);color:#fff;text-decoration:none;cursor:pointer;transition:.18s;border:1.5px solid var(--crimson)}
.hbtn:hover{background:var(--crimson-d);border-color:var(--crimson-d)}
.hbtn.o{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.55);backdrop-filter:blur(6px)}
.hbtn.o:hover{background:rgba(255,255,255,.2)}
.heroctn .counter{margin-top:18px}
.scrollhint{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);z-index:4;color:rgba(255,255,255,.74);
  font-size:16px;animation:bob 2.4s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(6px)}}

/* ── figure mascottes « presque animee » ── */
.masc{position:relative;border-radius:14px;overflow:hidden;background:
  radial-gradient(circle at 40% 35%,rgba(27,74,133,.9),transparent 62%),
  radial-gradient(circle at 68% 66%,rgba(150,20,55,.6),transparent 58%),
  linear-gradient(160deg,#12365F,#0A1C33);
  border:1.5px dashed rgba(255,255,255,.18)}
.masc .inner{position:absolute;inset:0;animation:floaty 9s ease-in-out infinite alternate}
@keyframes floaty{from{transform:translateY(0) scale(1)}to{transform:translateY(-9px) scale(1.025)}}
.masc .glow{position:absolute;inset:0;background:linear-gradient(112deg,transparent 34%,rgba(255,255,255,.09) 50%,transparent 66%);
  background-size:250% 100%;animation:sweep 5.5s linear infinite}
.masc .lbl{position:absolute;inset:0;display:grid;place-items:center;text-align:center;
  color:rgba(255,255,255,.74);font-size:12px;line-height:1.7;padding:16px}
.masc .lbl b{display:block;font-size:10.5px;letter-spacing:1.5px;color:rgba(255,255,255,.86);margin-bottom:5px}
.masc .lbl em{font-style:normal;font-size:10.5px;color:rgba(255,255,255,.62)}
.masc .wave{position:absolute;right:14px;top:14px;font-size:19px;animation:hand 2.8s ease-in-out infinite;transform-origin:70% 80%}
@keyframes hand{0%,72%,100%{transform:rotate(0)}78%{transform:rotate(15deg)}84%{transform:rotate(-9deg)}90%{transform:rotate(12deg)}}

/* ══════════ TRULY FLUENT TV — surface sombre ══════════ */
.tv{background:#08152A;color:#fff;overflow:hidden}
.tv .topnav{background:rgba(6,17,33,.92);border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(8px)}
.tv .topnav b{color:#fff}
.tv .topnav .lk{color:#B9CBE2}
.tv .topnav .lk.act{color:#FFB8C9}
.tv .topnav .lk:hover{color:#fff}

.tvhero{position:relative;height:340px;display:flex;align-items:flex-end;padding:0 30px 26px;overflow:hidden}
.tvhero .bgv{position:absolute;inset:0;background:linear-gradient(125deg,#0E3A6B,#08152A 60%,#3A0E23)}
.tvhero .bgv::after{content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 72% 38%,rgba(242,67,110,.30),transparent 58%),
             radial-gradient(circle at 22% 72%,rgba(27,74,133,.55),transparent 62%);
  animation:drift 14s ease-in-out infinite alternate}
@keyframes drift{from{transform:scale(1) translate(0,0)}to{transform:scale(1.12) translate(-2.5%,-2%)}}
.tvhero .scrim{position:absolute;inset:0;background:linear-gradient(90deg,#08152A 8%,rgba(8,21,42,.72) 46%,transparent 78%),
  linear-gradient(0deg,#08152A 2%,transparent 42%)}
.tvhero .in2{position:relative;z-index:2;max-width:540px}
.tvhero .tag{display:inline-flex;align-items:center;gap:7px;font-size:10.5px;font-weight:800;letter-spacing:1.2px;
  color:#FFB8C9;margin-bottom:9px}
.tvhero h1{font-size:33px;font-weight:900;letter-spacing:-1px;margin:0 0 9px;line-height:1.08}
.tvhero p{color:#C6D6E8;font-size:14px;margin:0 0 17px;line-height:1.55}
.tvhero .meta{display:flex;gap:9px;align-items:center;margin-bottom:15px;font-size:11.5px;color:#C3D5EC}
.lvlchip{border:1px solid rgba(255,255,255,.35);border-radius:4px;padding:1px 7px;font-weight:700;font-size:10.5px;color:#fff}
.tvbtn{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:800;border:0;border-radius:7px;
  padding:10px 22px;background:#fff;color:#08152A;cursor:pointer;text-decoration:none}
.tvbtn.gh{background:rgba(255,255,255,.16);color:#fff;backdrop-filter:blur(4px)}
.tvhero .mute{position:absolute;right:30px;bottom:28px;z-index:3;width:34px;height:34px;border-radius:50%;
  border:1px solid rgba(255,255,255,.4);display:grid;place-items:center;color:#fff;font-size:13px;cursor:pointer}

.tvrow{margin:0 0 30px;position:relative}
.tvrow h3{font-size:15px;font-weight:800;margin:0 0 11px;padding:0 30px;color:#fff;letter-spacing:-.2px;
  display:flex;align-items:center;gap:9px}
.tvrow h3 span{font-size:11px;font-weight:600;color:#A8C0DC;letter-spacing:0}
.tvviewport{position:relative;overflow:visible}
.tvtrack{display:flex;gap:11px;padding:34px 30px;transition:transform .45s cubic-bezier(.22,.61,.36,1);will-change:transform}
.tvnav{position:absolute;top:34px;bottom:34px;width:38px;background:rgba(6,17,33,.78);border:0;color:#fff;
  font-size:17px;cursor:pointer;z-index:20;display:grid;place-items:center;opacity:0;transition:.2s}
.tvviewport:hover .tvnav{opacity:1}
.tvnav.l{left:0}.tvnav.r{right:0}
.tvnav:hover{background:rgba(6,17,33,.95)}

.tvcard{flex:0 0 208px;width:208px;cursor:pointer;position:relative;
  transition:transform .3s cubic-bezier(.22,.61,.36,1);transform-origin:center bottom}
.tvcard .thumb{aspect-ratio:16/9;border-radius:7px;overflow:hidden;position:relative;
  box-shadow:0 3px 12px rgba(0,0,0,.4)}
.tvcard .thumb .g{position:absolute;inset:0}
.tvcard .thumb .dur{position:absolute;right:6px;bottom:6px;background:rgba(0,0,0,.72);font-size:9.5px;
  padding:1px 6px;border-radius:3px;font-weight:600}
.tvcard .thumb .lk2{position:absolute;left:6px;top:6px;background:rgba(9,45,89,.9);font-size:9px;
  font-weight:800;letter-spacing:.5px;padding:2px 7px;border-radius:20px}
.tvcard .thumb .prog{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.22)}
.tvcard .thumb .prog i{display:block;height:100%;background:#F2436E}
.tvcard .cap{font-size:12px;color:#C6D6E8;margin-top:7px;line-height:1.35;font-weight:600}

/* état survolé — aperçu */
.tvcard.hot{transform:scale(1.24);z-index:30}
.tvcard .pop{position:absolute;left:0;right:0;top:0;background:#0E1F38;border-radius:7px;overflow:hidden;
  box-shadow:0 14px 40px rgba(0,0,0,.62);opacity:0;pointer-events:none;transition:opacity .18s}
.tvcard.hot .pop{opacity:1;pointer-events:auto}
.pop .prev{aspect-ratio:16/9;position:relative;overflow:hidden}
.pop .prev .anim{position:absolute;inset:0;animation:zoomslow 7s ease-out forwards}
@keyframes zoomslow{from{transform:scale(1)}to{transform:scale(1.16)}}
.pop .prev .shine{position:absolute;inset:0;
  background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.13) 50%,transparent 70%);
  background-size:260% 100%;animation:sweep 2.6s linear infinite}
@keyframes sweep{from{background-position:180% 0}to{background-position:-80% 0}}
.pop .prev .live{position:absolute;left:8px;top:8px;display:flex;align-items:center;gap:5px;font-size:9px;
  font-weight:800;letter-spacing:.8px;background:rgba(0,0,0,.5);padding:2px 8px;border-radius:20px}
.pop .prev .live i{width:5px;height:5px;border-radius:50%;background:#F2436E;animation:blink 1.1s infinite}
@keyframes blink{50%{opacity:.25}}
.pop .prev .tc{position:absolute;right:8px;bottom:11px;font-size:9.5px;font-family:ui-monospace,Menlo,monospace;
  background:rgba(0,0,0,.55);padding:1px 6px;border-radius:3px}
.pop .prev .mut{position:absolute;right:8px;top:8px;width:24px;height:24px;border-radius:50%;
  border:1px solid rgba(255,255,255,.45);display:grid;place-items:center;font-size:10px}
.pop .prev .pb{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.2)}
.pop .prev .pb i{display:block;height:100%;background:#F2436E;width:0}
.pop .info{padding:9px 11px 11px}
.pop .info .acts{display:flex;align-items:center;gap:6px;margin-bottom:7px}
.rndbtn{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:11px;cursor:pointer}
.rndbtn.play{background:#fff;color:#08152A;font-size:10px}
.rndbtn.gh2{border:1.5px solid rgba(255,255,255,.45);color:#fff}
.pop .info h5{margin:0 0 3px;font-size:11.5px;font-weight:800;color:#fff;line-height:1.3}
.pop .info .mt{font-size:9.5px;color:#8FA8C4;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.pop .info .mt b{color:#4ADE80;font-weight:800}
.pop .info .tags{margin-top:5px;font-size:9.5px;color:#C6D6E8}
.tvrow:last-child{margin-bottom:96px}
.tvfoot{padding:26px 30px 34px;border-top:1px solid rgba(255,255,255,.07);color:#A8C0DC;font-size:12px}
.tvchips{display:flex;gap:7px;flex-wrap:wrap;padding:0 30px 6px}
.tvchip{border:1px solid rgba(255,255,255,.18);border-radius:20px;padding:4px 13px;font-size:11.5px;
  color:#C6D6E8;cursor:pointer;font-weight:600}
.tvchip:hover{border-color:#fff;color:#fff}
.tvchip.on{background:#fff;color:#08152A;border-color:#fff;font-weight:800}

/* ── espace abonnements (membre) ── */
.member{background:linear-gradient(135deg,var(--navy),var(--navy-l));color:#fff;border-radius:12px;padding:22px 26px;margin-bottom:26px}
.member .lb{font-size:10.5px;letter-spacing:1.1px;color:#B4C8E0;font-weight:800}
.member h3{margin:6px 0 3px;font-size:22px;font-weight:900}
.member .row{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.16)}
.member .row div span{display:block;font-size:10.5px;letter-spacing:.8px;color:#B4C8E0;font-weight:700;margin-bottom:2px}
.member .row div b{font-size:15px}
.inv{width:100%;border-collapse:separate;border-spacing:0;font-size:13px}
.inv th{text-align:left;font-size:10.5px;letter-spacing:.7px;color:var(--soft2);font-weight:800;padding:7px 11px;border-bottom:1px solid var(--brd)}
.inv td{padding:9px 11px;border-bottom:1px solid var(--brd2)}

/* ── TFA KIDS ── */
.kidshero{background:linear-gradient(155deg,#0E3A6B,var(--navy-d));color:#fff;padding:46px 26px;position:relative;overflow:hidden}
.kidshero .blob{position:absolute;border-radius:50%}
.kidshero h1{font-size:36px;font-weight:900;letter-spacing:-1px;margin:12px 0 11px;line-height:1.1}
.kidshero h1 em{color:#FFB8C9;font-style:normal}
.kidshero p{color:#C6D6E8;font-size:15.5px;max-width:470px;margin:0 0 20px}
.agegrid{display:grid;grid-template-columns:repeat(6,1fr);gap:11px}
.age{background:#fff;border:1px solid var(--brd);border-radius:13px;padding:15px 10px;text-align:center;
  box-shadow:var(--sh);cursor:pointer;transition:.15s}
.age:hover{transform:translateY(-3px);box-shadow:var(--sh2);border-color:var(--crimson)}
.age .cl{font-size:19px;font-weight:900;color:var(--navy);letter-spacing:-.5px}
.age .ag{font-size:11px;color:var(--soft2);font-weight:600;margin-top:1px}
.age .bar2{height:5px;border-radius:4px;background:var(--blue);margin-top:9px;overflow:hidden}
.age .bar2 i{display:block;height:100%;background:var(--crimson);border-radius:4px}
.kcard{background:#fff;border:1px solid var(--brd);border-radius:14px;padding:18px;box-shadow:var(--sh)}
.kcard .ki{width:44px;height:44px;border-radius:12px;background:var(--rose);display:grid;place-items:center;
  font-size:20px;margin-bottom:11px}
.kcard h4{margin:0 0 5px;font-size:15px;color:var(--navy);font-weight:800}
.kcard p{margin:0;font-size:13px;color:var(--soft)}
.noteedit{background:var(--sand);border:1px solid var(--sand2);border-radius:11px;padding:15px 18px;font-size:13px;color:#6B5A42}
.noteedit b{color:var(--navy)}
.badgewall{display:flex;gap:9px;flex-wrap:wrap}
.bdg{width:58px;height:58px;border-radius:50%;background:var(--blue);border:2px solid var(--brd);
  display:grid;place-items:center;font-size:20px;color:var(--soft2)}
.bdg.on{background:var(--rose);border-color:var(--crimson);color:var(--crimson)}
.childtab{display:flex;gap:9px;margin-bottom:18px}
.child{background:#fff;border:1.5px solid var(--brd);border-radius:11px;padding:9px 15px;display:flex;
  align-items:center;gap:10px;cursor:pointer;font-size:13.5px}
.child.on{border-color:var(--crimson);background:var(--rose)}
.child .av{width:30px;height:30px;border-radius:9px;background:var(--navy);color:#fff;display:grid;
  place-items:center;font-weight:800;font-size:12px}
.rgpd{background:#fff;border:1px dashed var(--crimson);border-radius:10px;padding:13px 16px;font-size:12.5px;color:var(--soft)}
.rgpd b{color:var(--crimson-d)}

.site{position:relative}
.site:not(footer)::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.035;
  background-image:var(--bul),var(--bul);
  background-repeat:no-repeat;
  background-position:-60px 9%, calc(100% + 80px) 31%;
  background-size:330px,270px}
.site > *{position:relative;z-index:1}
.site > .topnav{z-index:30}
.sep{height:1px;background:var(--brd);margin:26px 0}
.mini{font-size:11.5px;color:var(--soft2)}

/* ── surcharges finales (doivent passer après les règles de base) ── */
.pm{overflow:visible;padding-top:0}
.pm .cap2{height:5px;margin:0 -13px 14px;display:block;border-radius:11px 11px 0 0}
.pm .p2{color:var(--acc,var(--navy))}
.pm ul li{padding:2.5px 0 2.5px 17px;position:relative;font-size:11.5px}
.pm ul li::before{content:"✓";position:absolute;left:1px;top:2.5px;color:var(--acc,var(--green));
  font-weight:900;font-size:10.5px}
.pm ul li.no{color:var(--soft2)}
.pm ul li.no::before{content:"✗";color:var(--crimson)}
.card .cap2{height:5px;margin:-20px -20px 15px;display:block;border-radius:11px 11px 0 0}
.card .price{color:var(--acc,var(--navy))}
.card ul.ck li::before{content:"✓";color:var(--acc,var(--green));font-weight:900}
.card ul.ck li.no::before{content:"—";color:var(--soft2)}
.blk.pricing .pm{box-shadow:0 3px 14px rgba(9,45,89,.10)}
.blk.pricing .card{box-shadow:0 3px 14px rgba(9,45,89,.10)}

/* ══════════════════════════════════════════════════════════════
   THÈME SOMBRE CHAUD — activé par body.dark
   Navy et crimson restent la marque ; seules les surfaces changent.
   ══════════════════════════════════════════════════════════════ */
body.dark{
  --paper:#11161F;      /* fond de page — sombre chaud */
  --navy:#DCE4F2;       /* devient l'encre claire des titres */
  --navy-d:#080C12;
  --navy-l:#2C3A5E;
  --crimson:#F2436E;    /* crimson éclairci, lisible sur sombre */
  --crimson-d:#C0093A;  /* crimson d'origine, réservé aux fonds */
  --blue:#1A222E;
  --rose:#2E181E;
  --brd:#2E394A;
  --brd2:#232C3A;
  --ink:#E9EEF6;
  --soft:#B0B9C8;
  --soft2:#8692A4;
  --green:#4FBE7B;
  --sand:#2B2318;
  --sand2:#3D3324;
  --sh:0 1px 3px rgba(0,0,0,.55);
  --sh2:0 10px 30px rgba(0,0,0,.6);
  --nvb:#22345C;        /* navy utilisable comme fond */
  --surf:#182130;       /* surface des cartes */
  --surf2:#1E293A;      /* surface surélevée */
}
body.dark{background:#0B0F16}
body.dark #stage{background:#0B0F16}
body.dark .screenhead h2{color:#E4EBF5}
body.dark .screenhead .cmt{color:#8692A4}
body.dark .browser{border-color:#242F40}
body.dark .chrome{background:#1C2636;border-bottom-color:#2B374A}

/* surfaces claires → surfaces sombres */
body.dark .screenhead .url,body.dark .bar,body.dark .card,body.dark .exdemo,body.dark .pwcard,
body.dark .slot,body.dark .kpicard,body.dark .ritem,body.dark .pcard,body.dark .arch,
body.dark .legend,body.dark .fmt,body.dark .tcard,body.dark .qtop .tmr,body.dark .opt,
body.dark .exsent,body.dark .mistake,body.dark .qcard2,body.dark .pm,body.dark .age,
body.dark .kcard,body.dark .child,body.dark .rgpd,body.dark .archbox .tech,
body.dark .sharedtbl td:nth-child(3),body.dark .browser{background:var(--surf);border-color:var(--brd)}
body.dark .topnav{background:#151C28;border-bottom-color:var(--brd)}
body.dark .pnotch{background:#151C28;color:var(--ink)}
body.dark .ptab{background:#151C28;border-top-color:var(--brd)}
body.dark .ring::after{background:var(--surf)}
body.dark .billsw .knob::after{background:#E9EEF6}
body.dark .book{background:var(--surf);border-color:var(--brd)}
body.dark .site{background:var(--paper)}

/* fonds « blancs » des sections → dégradé sombre chaud */
body.dark .blk.wt{background:
  radial-gradient(circle at 10% 12%, rgba(90,120,190,.10), transparent 44%),
  radial-gradient(circle at 90% 88%, rgba(192,9,58,.13), transparent 46%),
  linear-gradient(180deg,#131922 0%,#11161F 60%,#101620 100%)}
body.dark .blk.wt::before,body.dark .blk.wt::after{opacity:.07}
body.dark .blk.pricing{background:
  radial-gradient(circle at 82% 8%, rgba(192,9,58,.20), transparent 48%),
  radial-gradient(circle at 6% 88%, rgba(43,74,133,.26), transparent 50%),
  linear-gradient(160deg,#151C28 0%,#11161F 50%,#141B26 100%)}
body.dark .blk.pricing::before{background:radial-gradient(circle,rgba(255,255,255,.05),transparent 62%)}

/* fonds navy conservés en vrai navy */
body.dark .btn.nv{background:#2C4E86}
body.dark .btn.nv:hover{background:#38609F}
body.dark .waitlist{background:linear-gradient(135deg,#1C3357,#14203A)}
body.dark .sharedtbl th{background:var(--nvb)}
body.dark .billsw span.on,body.dark .audsw b.on,body.dark .child .av,
body.dark .avatar{background:var(--nvb);color:#fff}
body.dark .fill{background:#6E8FD6}
body.dark .track{background:#1E2838}
body.dark .badge{background:var(--blue);color:var(--ink);border-color:var(--brd)}

/* fonds crimson : garder le crimson d'origine sous le texte blanc */
body.dark .btn,body.dark .hbtn,body.dark .pill,body.dark .chip,body.dark .billbadge,
body.dark .mnum,body.dark .fmt .n2,body.dark .opt.ko .ltr,body.dark .slot.sel,
body.dark .audsw b.kid.on,body.dark .card.hi::after,body.dark .pm.best::after,
body.dark .chaphero .chip,body.dark .play,body.dark .qprog i,body.dark .age .bar2 i,
body.dark .fill.weak,body.dark body.annual .billsw .knob{background:var(--crimson-d);color:#fff}
body.dark .btn:hover,body.dark .hbtn:hover{background:#8E0A2E}
body.dark .btn.gh{background:transparent;color:var(--ink);border-color:var(--brd)}
body.dark .btn.ghost{background:transparent;color:var(--soft);border-color:var(--brd)}
body.dark .hbtn.o{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.42)}
body.dark .btn.w{background:#E9EEF6;color:#11161F}
body.dark .tvbtn{background:#E9EEF6;color:#0B0F16}
body.dark .tvchip.on{background:#E9EEF6;color:#0B0F16}
body.dark .rndbtn.play{background:#E9EEF6;color:#0B0F16}
body.dark .qbig{background:#E9EEF6;color:#11161F}

/* tableaux */
body.dark th{background:var(--nvb)}
body.dark th:nth-child(2){background:var(--crimson-d)}
body.dark td{border-bottom-color:var(--brd2)}
body.dark table.tb th{background:transparent;color:var(--soft2);border-bottom-color:var(--brd)}
body.dark table.tb td{border-bottom-color:var(--brd2)}
body.dark .inv th{background:transparent;color:var(--soft2)}

/* encadrés */
body.dark .examples{background:var(--surf2);border-left-color:#6E8FD6;box-shadow:none}
body.dark .watchout{background:#2E181E;border-left-color:var(--crimson)}
body.dark .tbody{background:var(--surf2);border-color:var(--brd)}
body.dark .nw{background:var(--surf);border-left-color:var(--crimson)}
body.dark .expl{background:var(--surf2);border-left-color:#6E8FD6}
body.dark .reco{background:#2E181E;border-left-color:var(--crimson)}
body.dark .starnote{background:#2B2318;border-color:#3D3324;color:#D6C8A8}
body.dark .starnote b{color:#E9EEF6}
body.dark .noteedit{background:#2B2318;border-color:#3D3324;color:#D6C8A8}
body.dark .b2b{background:linear-gradient(120deg,#2B2318,#3A2A22)}
body.dark .b2b p{color:#CDBFA6}
body.dark .kidsband{background:linear-gradient(120deg,#2B2318,#332025);border-color:#3D3324}
body.dark .kidsband p{color:#CDBFA6}
body.dark .samplebox{background:#2E181E}
body.dark .qimg{background:linear-gradient(155deg,#1B2433,#2C181D);border-color:#313D50}
body.dark .illus{border-color:#313D50}
body.dark .opt.ok{background:#16301F;border-color:var(--green)}
body.dark .opt.ko{background:#33151D;border-color:var(--crimson)}
body.dark .fld.ok{background:#16301F}
body.dark .fld.ko{background:#33151D}
body.dark .st.ok{background:#16301F;color:#69D394}
body.dark .st.wt{background:#332612;color:#E5A83E}
body.dark .st.dn{background:var(--blue);color:var(--soft)}
body.dark .mini,body.dark .lead,body.dark p{color:var(--soft)}
body.dark .cap,body.dark .pcap{color:var(--soft)}
body.dark footer.site{background:#080C12}
body.dark .sep{background:var(--brd)}
body.dark .heroctn p,body.dark .hero p{color:#C6D6E8}
body.dark .exfoot{border-top-color:var(--brd)}
body.dark .qfoot{border-top-color:var(--brd)}
body.dark input[type=text],body.dark .wlform input{background:var(--surf2);color:var(--ink);border-color:var(--brd)}
body.dark .wlform input::placeholder{color:var(--soft2)}
body.dark .serthumb,body.dark .qimg{border-color:#313D50}
body.dark .dotl{background:rgba(255,255,255,.22)}
body.dark .bdg{background:var(--surf2);border-color:var(--brd)}
body.dark .bdg.on{background:#33151D;border-color:var(--crimson)}
body.dark .sday{background:var(--surf2);color:var(--soft2)}
body.dark .sday.on{background:#2E7D50;color:#fff}

/* bascule de thème dans le navigateur de maquette */
.themesw{display:flex;gap:4px;margin:14px 18px 0;background:rgba(255,255,255,.07);
  border-radius:20px;padding:3px}
.themesw b{flex:1;text-align:center;font-size:10.5px;font-weight:800;letter-spacing:.6px;
  padding:5px 0;border-radius:20px;color:#B4C8E0;cursor:pointer;transition:.15s}
.themesw b.on{background:#fff;color:#0B2542}
body.dark .themesw b.on{background:var(--crimson-d);color:#fff}


/* dégradés navy : forcés en vrai navy sombre (— navy sert d'encre en mode sombre) */
body.dark .hero{background:linear-gradient(160deg,#183258,#0B1526)}
body.dark .chaphero{background:linear-gradient(160deg,#183258,#0B1526)}
body.dark .book .cv{background:linear-gradient(165deg,#1B3355,#0C1728)}
body.dark .avatar{background:linear-gradient(150deg,#22406E,#16294A)}
body.dark .next{background:linear-gradient(135deg,#1D3559,#2A3F66)}
body.dark .quickband{background:linear-gradient(120deg,#1D3559,#2A3F66)}
body.dark .leveltest{background:linear-gradient(125deg,#1D3559,#27364E)}
body.dark .member{background:linear-gradient(135deg,#1D3559,#27364E)}
body.dark .kidsband .kf{background:linear-gradient(150deg,#22406E,var(--crimson-d))}
body.dark .ladder{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.13)}
body.dark .who.pub{background:#22345C;color:#CBD9EE}
body.dark .who.eleve{background:#1B3A29;color:#8FDCAC}
body.dark .who.prof{background:#24334A;color:#A8BCDC}
body.dark .who.app{background:#3A1A23;color:#E7ABBB}
body.dark .heroimg .ph{border-left-color:rgba(255,255,255,.24)}
body.dark .leveltest p,body.dark .quickband p,body.dark .next p,body.dark .member p{color:#C6D6E8}
body.dark .leveltest h2,body.dark .quickband h3,body.dark .next h4,body.dark .member h3{color:#fff}
body.dark .ltfacts div b{color:#fff}
body.dark .waitlist h3{color:#fff}
body.dark .waitlist p{color:#B9CBE2}
body.dark .b2b h3,body.dark .kidsband h3{color:#F0E6D2}
body.dark .qbtns .qsm{border-color:rgba(255,255,255,.38);color:#fff}

/* ══════════════════════════════════════════════════════════════
   THÈME SOMBRE — version 2 : moins sombre, plus de bulles,
   barre latérale rouge translucide.
   ══════════════════════════════════════════════════════════════ */
body.dark{
  --paper:#1D2533;      /* fond de page — remonté, moins sombre */
  --navy:#E4EAF6;
  --navy-d:#131B27;
  --navy-l:#3A4770;
  --crimson:#FF5C87;
  --crimson-d:#C0093A;
  --blue:#253042;
  --rose:#3B2229;
  --brd:#3C4A61;
  --brd2:#2F3C52;
  --ink:#EEF2F9;
  --soft:#BDC6D4;
  --soft2:#939FB2;
  --green:#5FCB8A;
  --sand:#372D1F;
  --sand2:#4A3D2B;
  --nvb:#2C4470;
  --surf:#242F40;
  --surf2:#2C384C;
  --sh:0 1px 3px rgba(0,0,0,.4);
  --sh2:0 10px 30px rgba(0,0,0,.45);
}
body.dark{background:#171E29}
body.dark #stage{background:#171E29}

/* ── champ de bulles en fond de site ── */
body.dark .site{position:relative;background:var(--paper)}
body.dark .site:not(footer)::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.085;
  background-image:var(--bul),var(--bul);
  background-repeat:no-repeat;
  background-position:-60px 8%, calc(100% + 80px) 29%;
  background-size:340px,280px}
body.dark .site > *{position:relative;z-index:1}
body.dark .site > .topnav{z-index:30}
.site > .topnav{z-index:30}

/* filigranes plus présents */
body.dark .blk.wt::before{opacity:.10;width:300px;height:300px}
body.dark .blk.wt::after{opacity:.075;width:250px;height:250px}
body.dark .blk.pricing::after{content:"";position:absolute;right:-40px;bottom:60px;width:240px;height:240px;
  background:var(--bul) center/contain no-repeat;opacity:.09;pointer-events:none}
body.dark .blk.wt{background:
  radial-gradient(circle at 10% 12%, rgba(110,140,215,.13), transparent 44%),
  radial-gradient(circle at 90% 88%, rgba(255,92,135,.12), transparent 46%),
  linear-gradient(180deg,#242F40 0%,#1F2938 60%,#202938 100%)}
body.dark .blk.pricing{background:
  radial-gradient(circle at 82% 8%, rgba(255,92,135,.18), transparent 48%),
  radial-gradient(circle at 6% 88%, rgba(80,115,195,.22), transparent 50%),
  linear-gradient(160deg,#263246 0%,#1F2938 50%,#232E40 100%)}
body.dark .blk.pricing::before{background:radial-gradient(circle,rgba(255,255,255,.045),transparent 62%)}

/* ── barre latérale rouge translucide (thème sombre) ── */
body.dark #nav{background:
  linear-gradient(180deg, rgba(120,18,48,.82) 0%, rgba(88,16,42,.86) 46%, rgba(58,14,34,.92) 100%),
  #1B2028;
  border-right:1px solid rgba(255,255,255,.07)}
body.dark #nav::before{content:"";position:absolute;left:-50px;top:-30px;width:230px;height:230px;
  background:var(--bul) center/contain no-repeat;opacity:.07;pointer-events:none}
body.dark #nav::after{content:"";position:absolute;right:-60px;bottom:40px;width:190px;height:190px;
  background:var(--bul) center/contain no-repeat;opacity:.05;pointer-events:none}
body.dark #nav{position:relative;overflow-x:hidden}
body.dark #nav .brand{border-bottom-color:rgba(255,255,255,.16)}
body.dark #nav .brand span{color:#E6A9B9}
body.dark #nav h4{color:#E29CAF}
body.dark #nav a{color:#F0DCE1}
body.dark #nav a:hover{background:rgba(255,255,255,.09)}
body.dark #nav a.on{background:rgba(255,255,255,.16);border-left-color:#FFB3C7;color:#fff}
body.dark #nav .note{background:rgba(0,0,0,.22);color:#E3C3CC}
body.dark .themesw{background:rgba(0,0,0,.25)}
body.dark .themesw b{color:#EDCAD3}
body.dark .themesw b.on{background:#FFD8E2;color:#511727}

/* surfaces remontées */
body.dark .browser{border-color:#3C4A61}
body.dark .chrome{background:#2C384C;border-bottom-color:#3C4A61}
body.dark .topnav{background:#273346;border-bottom-color:var(--brd)}
body.dark .pnotch,body.dark .ptab{background:#273346}
body.dark .track{background:#334055}
body.dark footer.site{background:#192230}
body.dark .fill{background:#8AA6E4}

/* mode automatique : indicateur */
.themesw{display:flex;gap:3px;margin:14px 18px 0;background:rgba(255,255,255,.07);border-radius:20px;padding:3px}
.themesw b{flex:1;text-align:center;font-size:9.5px;font-weight:800;letter-spacing:.5px;
  padding:5px 0;border-radius:20px;color:#B4C8E0;cursor:pointer;transition:.15s}
.themesw b.on{background:#fff;color:#0B2542}
.thnote{margin:7px 18px 0;font-size:10px;color:#6E8BB0;line-height:1.5}
body.dark .thnote{color:#D3A6B2}

/* ══════════════════ LE CLUB & RENCONTRES NATIVES ══════════════════ */
.clubband{display:grid;grid-template-columns:1.35fr 1fr;gap:26px;align-items:center;
  background:linear-gradient(118deg,#07182C 0%,#0D2E56 48%,#16406F 100%);
  border-radius:14px;padding:26px 28px;color:#fff;margin-bottom:18px;position:relative;overflow:hidden}
.clubband::after{content:"";position:absolute;right:-40px;bottom:-70px;width:280px;height:280px;
  background:var(--bul) center/contain no-repeat;opacity:.07;pointer-events:none}
.clubband .lb{font-size:10.5px;font-weight:800;letter-spacing:1.7px;color:#FFB8C9;margin-bottom:7px}
.clubband h3{margin:0 0 8px;font-size:25px;font-weight:900;letter-spacing:-.4px;line-height:1.15}
.clubband p{margin:0;font-size:13.5px;line-height:1.65;color:#D4E0F2;max-width:52ch}
.clubkpi{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;position:relative;z-index:1}
.clubkpi div{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);
  border-radius:10px;padding:11px 12px;text-align:center}
.clubkpi b{display:block;font-size:21px;font-weight:900;letter-spacing:-.5px}
.clubkpi span{display:block;font-size:9.5px;font-weight:700;letter-spacing:.8px;color:#C7D6EC;margin-top:2px}

.accessbar{display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  background:var(--surf,#fff);border:1px solid var(--brd);border-left:4px solid var(--green);
  border-radius:11px;padding:14px 18px;margin-bottom:20px}
.acbadge{flex:0 0 auto;font-size:10.5px;font-weight:800;letter-spacing:.6px;
  background:#E6F3EA;color:var(--green);border-radius:20px;padding:5px 12px}
body.dark .acbadge{background:#16301F;color:#8FDCAC}
.accessbar .txt{flex:1;min-width:260px}
.accessbar .txt b{display:block;font-size:14px}
.accessbar .txt span{display:block;font-size:12px;color:var(--soft);line-height:1.6;margin-top:2px}
.acnote{font-size:11px;font-weight:700;color:var(--soft);background:var(--blue);
  border-radius:7px;padding:7px 11px}

.clubwrap{display:grid;grid-template-columns:266px 1fr;gap:16px;align-items:start}
.roomcol{background:var(--surf,#fff);border:1px solid var(--brd);border-radius:12px;overflow:hidden}
.roomhead{padding:13px 15px 10px;border-bottom:1px solid var(--brd2)}
.roomhead b{font-size:11px;font-weight:800;letter-spacing:1.1px;color:var(--soft)}
.roomsearch{display:block;width:100%;margin-top:9px;font:inherit;font-size:12px;
  border:1px solid var(--brd);border-radius:7px;padding:7px 10px;background:var(--surf2,#F7FAFD);color:var(--ink)}
.roomgrp{padding:11px 12px 4px;font-size:9.5px;font-weight:800;letter-spacing:1.2px;color:var(--soft2)}
.room{display:flex;align-items:center;gap:10px;padding:9px 12px;cursor:pointer;border-left:3px solid transparent}
.room:hover{background:var(--surf2,#F3F7FC)}
.room.on{background:var(--blue);border-left-color:var(--crimson)}
.room .rl{width:30px;height:30px;flex:0 0 30px;border-radius:8px;display:grid;place-items:center;
  font-size:10px;font-weight:800;color:#fff;letter-spacing:.3px}
.room .rt{flex:1;min-width:0}
.room .rt b{display:block;font-size:12.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.room .rt span{display:block;font-size:10.5px;color:var(--soft)}
.room .rn{font-size:10.5px;font-weight:800;color:var(--soft);white-space:nowrap}
.online{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--green);margin-right:5px}

.chatcol{background:var(--surf,#fff);border:1px solid var(--brd);border-radius:12px;overflow:hidden;
  display:flex;flex-direction:column}
.chathead{display:flex;align-items:center;gap:12px;padding:13px 17px;border-bottom:1px solid var(--brd2);flex-wrap:wrap}
.chathead h4{margin:0;font-size:15px;font-weight:800}
.chathead .sub{font-size:11.5px;color:var(--soft)}
.chathead .rt2{margin-left:auto;display:flex;align-items:center;gap:8px}
.mini2{font-size:10.5px;font-weight:800;letter-spacing:.5px;border-radius:20px;padding:4px 10px;
  background:var(--blue);color:var(--navy)}
body.dark .mini2{background:var(--surf2);color:var(--ink)}

.livebar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  background:linear-gradient(100deg,#7A1030,#B00836);color:#fff;padding:11px 17px}
.livebar .ld{width:8px;height:8px;border-radius:50%;background:#FFC9D6;animation:bob 1.6s ease-in-out infinite}
.livebar b{font-size:12.5px;font-weight:800}
.livebar span{font-size:11.5px;color:#FFD6E1}
.livebar .join{margin-left:auto;background:#fff;color:#7A1030;font-size:11px;font-weight:800;
  border-radius:7px;padding:6px 13px;cursor:pointer}

.thread{padding:17px;display:flex;flex-direction:column;gap:13px;background:var(--surf2,#FAFCFE)}
.msg{display:flex;gap:9px;max-width:76%}
.msg .av{width:28px;height:28px;flex:0 0 28px;border-radius:8px;display:grid;place-items:center;
  font-size:10px;font-weight:900;color:#fff;background:linear-gradient(150deg,var(--navy-l),var(--navy))}
.msg .bb{background:var(--surf,#fff);border:1px solid var(--brd);border-radius:3px 11px 11px 11px;
  padding:9px 13px;font-size:13px;line-height:1.6}
.msg .nm{display:block;font-size:10.5px;font-weight:800;color:var(--soft);margin-bottom:3px}
.msg .tm{font-size:9.5px;color:var(--soft2);margin-top:4px;display:block}
.msg.me{align-self:flex-end;flex-direction:row-reverse}
.msg.me .bb{background:var(--blue);border-color:#BFD3EC;border-radius:11px 3px 11px 11px}
body.dark .msg.me .bb{background:#22345C;border-color:#31477A}
.msg.me .av{background:linear-gradient(150deg,#7A1030,var(--crimson-d))}
.msg.mentor .bb{background:#EDF3FB;border-color:#C8DAF0}
body.dark .msg.mentor .bb{background:#16263D;border-color:#2A3F5E}
.msg.mentor .av{background:linear-gradient(150deg,#123A66,#08213F)}
.mtag{display:inline-block;font-size:9px;font-weight:800;letter-spacing:.9px;border-radius:4px;
  padding:1px 6px;background:#123A66;color:#fff;margin-left:6px;vertical-align:1px}
.fixit{margin-top:7px;padding-top:7px;border-top:1px dashed var(--brd);font-size:12px}
.fixit s{color:var(--crimson);text-decoration-thickness:1.5px}
.fixit b{color:var(--green)}

.voice{display:flex;align-items:center;gap:9px;min-width:190px}
.voice .pl{width:26px;height:26px;flex:0 0 26px;border-radius:50%;background:var(--navy);color:#fff;
  display:grid;place-items:center;font-size:9px}
.wave{display:flex;align-items:flex-end;gap:2px;height:20px;flex:1}
.wave i{display:block;width:3px;border-radius:2px;background:var(--navy-l);opacity:.55}
.voice .dur{font-size:10.5px;font-weight:700;color:var(--soft)}

.composer{display:flex;align-items:center;gap:10px;padding:12px 17px;border-top:1px solid var(--brd2);
  background:var(--surf,#fff);flex-wrap:wrap}
.composer .fld2{flex:1;min-width:220px;border:1px solid var(--brd);border-radius:9px;padding:9px 13px;
  font-size:12.5px;color:var(--soft);background:var(--surf2,#FAFCFE)}
.cbtn{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;font-size:14px;
  background:var(--blue);color:var(--navy);cursor:pointer}
body.dark .cbtn{background:var(--surf2);color:var(--ink)}
.cbtn.send{background:var(--crimson);color:#fff}
.enonly{width:100%;font-size:11px;color:var(--soft);display:flex;align-items:center;gap:7px}
.enonly b{color:var(--crimson)}

.charte{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:20px}
.chit{background:var(--surf,#fff);border:1px solid var(--brd);border-radius:11px;padding:14px 15px}
.chit .ci{font-size:17px;color:var(--crimson);margin-bottom:6px}
.chit b{display:block;font-size:13px;margin-bottom:3px}
.chit span{font-size:11.5px;color:var(--soft);line-height:1.6}

/* ── rencontres natives ── */
.ntband{background:linear-gradient(112deg,#0B2038,#123A5E 52%,#1B4A85);border-radius:14px;
  padding:26px 28px;color:#fff;margin-bottom:18px;position:relative;overflow:hidden}
.ntband::after{content:"";position:absolute;right:-30px;top:-60px;width:250px;height:250px;
  background:var(--bul) center/contain no-repeat;opacity:.07}
.ntband .lb{font-size:10.5px;font-weight:800;letter-spacing:1.7px;color:#8FD6E3;margin-bottom:7px}
.ntband h3{margin:0 0 8px;font-size:25px;font-weight:900;letter-spacing:-.4px}
.ntband p{margin:0;font-size:13.5px;color:#CFE0F0;max-width:62ch;line-height:1.65}
.incl{display:inline-flex;align-items:center;gap:9px;margin-top:14px;background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.26);border-radius:9px;padding:9px 14px;font-size:12.5px;position:relative;z-index:1}
.incl b{font-weight:800}

.natgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:18px}
.nat{background:var(--surf,#fff);border:1px solid var(--brd);border-radius:12px;padding:16px;position:relative}
.nat .top{display:flex;align-items:center;gap:11px;margin-bottom:10px}
.nat .ini{width:42px;height:42px;flex:0 0 42px;border-radius:11px;display:grid;place-items:center;
  font-size:14px;font-weight:900;color:#fff;background:linear-gradient(150deg,var(--navy-l),var(--navy))}
.nat h5{margin:0;font-size:14.5px;font-weight:800}
.nat .acc{font-size:11.5px;color:var(--soft)}
.nat p{margin:0 0 11px;font-size:12.5px;color:var(--soft);line-height:1.6}
.nat .slots{display:flex;gap:6px;flex-wrap:wrap}
.nslot{font-size:11px;font-weight:700;border:1px solid var(--brd);border-radius:7px;padding:5px 9px;
  background:var(--surf2,#F7FAFD);cursor:pointer}
.nslot.on{background:var(--navy);color:#fff;border-color:var(--navy)}
body.dark .nslot.on{background:#8AA6E4;color:#080C12;border-color:#8AA6E4}
.nat .tagf{position:absolute;top:14px;right:14px;font-size:9.5px;font-weight:800;letter-spacing:.6px;
  border-radius:20px;padding:3px 9px;background:var(--blue);color:var(--navy)}
body.dark .nat .tagf{background:var(--surf2);color:var(--ink)}

.report{display:grid;grid-template-columns:1fr 1.15fr;gap:18px;align-items:start;
  background:var(--surf,#fff);border:1px solid var(--brd);border-radius:12px;padding:20px 22px}
.report h4{margin:0 0 6px;font-size:16px;font-weight:800}
.report p{margin:0 0 12px;font-size:13px;color:var(--soft);line-height:1.65}
.rline{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.rline .rn2{width:112px;flex:0 0 112px;font-size:11.5px;font-weight:700;color:var(--soft)}
.rbar{flex:1;height:9px;border-radius:5px;background:var(--brd2);overflow:hidden}
.rbar i{display:block;height:100%;border-radius:5px;background:var(--navy)}
body.dark .rbar i{background:#8AA6E4}
.rline .rv{width:78px;text-align:right;font-size:11.5px;font-weight:800}
.gain{font-size:11px;font-weight:800;color:var(--green)}

/* ══════════════════ CONNEXION & COMPTE (haut à droite) ══════════════════ */
.authbtns{display:flex;align-items:center;gap:8px}
.lgin{font-size:12.5px;font-weight:700;color:var(--navy);border:1px solid var(--brd);
  border-radius:8px;padding:7px 13px;cursor:pointer;white-space:nowrap;background:var(--surf,#fff)}
.lgin:hover{border-color:var(--navy);background:var(--blue)}
.sgup{font-size:12.5px;font-weight:800;color:#fff;background:var(--crimson);border-radius:8px;
  padding:8px 15px;cursor:pointer;white-space:nowrap;box-shadow:0 2px 8px rgba(192,9,58,.28)}
.sgup:hover{background:var(--crimson-d)}

.acct{position:relative;display:flex;align-items:center;gap:9px;padding:4px 9px 4px 4px;color:var(--ink);
  border:1px solid var(--brd);border-radius:9px;cursor:pointer;background:var(--surf,#fff)}
.acct:hover{border-color:var(--navy-l)}
.acct .avatar{width:30px;height:30px;font-size:12px;border-radius:7px;letter-spacing:0}
.acct .idn{line-height:1.25;text-align:left}
.acct .idn b{display:block;font-size:12px;font-weight:800;white-space:nowrap;color:var(--ink)}
.acct .idn span{display:block;font-size:10px;font-weight:700;color:var(--soft);white-space:nowrap}
.acct .chev{font-size:9px;color:var(--soft);margin-left:1px}
.dotlive2{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--green);
  margin-right:4px;vertical-align:1px}

.acctmenu{position:absolute;top:calc(100% + 8px);right:0;width:242px;z-index:40;
  background:var(--surf,#fff);border:1px solid var(--brd);border-radius:11px;
  box-shadow:var(--sh2);padding:6px;opacity:0;visibility:hidden;transform:translateY(-4px);
  transition:.16s;text-align:left;cursor:default}
.acct:hover .acctmenu,.acct.open .acctmenu{opacity:1;visibility:visible;transform:none}
.acctmenu .hd{padding:9px 11px 10px;border-bottom:1px solid var(--brd2);margin-bottom:5px}
.acctmenu .hd b{display:block;font-size:13px}
.acctmenu .hd span{display:block;font-size:11px;color:var(--soft);margin-top:1px}
.acctmenu .pl{display:inline-block;margin-top:7px;font-size:10px;font-weight:800;letter-spacing:.5px;
  background:var(--blue);color:var(--navy);border-radius:20px;padding:3px 9px}
.acctmenu a{display:flex;align-items:center;gap:9px;font-size:12.5px;font-weight:600;
  color:var(--ink);padding:8px 11px;border-radius:7px;text-decoration:none}
.acctmenu a i{font-style:normal;font-size:13px;color:var(--soft);width:15px;text-align:center}
.acctmenu a:hover{background:var(--blue)}
.acctmenu a .kb{margin-left:auto;font-size:10px;font-weight:700;color:var(--soft)}
.acctmenu .sp{height:1px;background:var(--brd2);margin:5px 0}
.acctmenu a.out{color:var(--crimson)}
.acctmenu a.out i{color:var(--crimson)}
.acctmenu a.out:hover{background:var(--rose)}

/* onglets de famille de la collection — alimentés par le catalogue */
.famtabs{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.ftab{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:700;
  border:1px solid var(--brd);border-radius:20px;padding:6px 14px;cursor:pointer;
  background:var(--surf,#fff);color:var(--ink);transition:.14s}
.ftab:hover{border-color:var(--navy-l)}
.ftab.on{background:var(--navy);color:#fff;border-color:var(--navy)}
body.dark .ftab.on{background:#22406E;color:#fff;border-color:#3A5F9E}
.ftab b{font-size:10.5px;font-weight:800;background:var(--blue);color:var(--navy);
  border-radius:20px;padding:1px 7px}
.ftab.on b{background:rgba(255,255,255,.22);color:#fff}
body.dark .ftab b{background:var(--surf2);color:var(--ink)}
.books{grid-template-columns:repeat(auto-fill,minmax(168px,1fr))}
.code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;line-height:1.75;
  background:var(--surf,#fff);border:1px solid var(--brd);border-radius:8px;
  padding:11px 13px;margin-top:9px;color:var(--ink)}
.code i{font-style:normal;color:var(--navy-l);font-weight:700}
body.dark .code i{color:#9CBDF0}

/* ══════════ CORRECTIONS DE CONTRASTE — vérifiées par contrast_check.py ══════════
   Chaque règle ci-dessous répare un couple texte/fond mesuré sous 4.5:1
   (3:1 pour le grand texte) dans l'un des deux thèmes.                          */

body.dark{--soft2:#9FACC0; --amber:#E7A63C}

/* surfaces de contenu restées blanches en thème sombre */
body.dark .browser,body.dark .card,body.dark .book,body.dark .exdemo,body.dark .pwcard,
body.dark .slot,body.dark .kpicard,body.dark .ritem,body.dark .pcard,body.dark .arch,
body.dark .legend,body.dark .fmt,body.dark .tcard,body.dark .opt,body.dark .exsent,
body.dark .mistake,body.dark .qcard2,body.dark .pm,body.dark .age,body.dark .kcard,
body.dark .child,body.dark .rgpd,body.dark .archbox .tech,body.dark .sharedtbl td:nth-child(3),
body.dark .qtop .tmr,body.dark .screenhead .url{background:var(--surf);border-color:var(--brd)}
body.dark .slot.full{background:var(--surf2);color:#96A2B4}
body.dark .opt.ok,body.dark .fld.ok{background:#16301F}
body.dark .opt.ko{background:#3A151F}
body.dark .expl{background:var(--surf2)}
body.dark .qbig{background:var(--surf2);color:var(--ink)}

/* crimson foncé employé comme encre : illisible sur fond sombre */
body.dark .who.app,body.dark .samplebox b,body.dark .reco>b:first-child,
body.dark .reco p b,body.dark .reco .ritem b,body.dark .rgpd b,
body.dark .tag,body.dark .lk.act,body.dark .eyebrow{color:#FF8AA8}

/* pastilles claires en thème sombre : l'encre repasse en foncé */
body.dark .opt.ok .ltr,body.dark .opt.ko .ltr{color:#080C12}
body.dark .sday.on{color:#fff}
body.dark .lvl,body.dark .lvlchip{color:#fff}

/* textes de repérage posés sur les blocs image */
body.dark .ph{color:rgba(255,255,255,.66)}
body.dark .ph em{color:rgba(255,255,255,.55)}
body.dark .scrollhint{color:rgba(255,255,255,.74)}

/* accents tarifaires codés en dur sur les cartes : version claire en thème sombre */
body.dark [style*="--acc:#092D59"]{--acc:#A9C4EE}
body.dark [style*="--acc:#1B4A85"]{--acc:#9CBDF0}
body.dark [style*="--acc:#5A6B7E"]{--acc:#BCC6D4}
body.dark [style*="--acc:#C0093A"]{--acc:#FF8AA8}
body.dark [style*="--acc:#1B4A85"]{--acc:#5CD2E0}
body.dark [style*="--acc:#092D59"]{--acc:#63D093}

/* le crimson de marque reste lisible quand il est posé sur un fond navy */
.leveltest .eyebrow,.hero .eyebrow,.chaphero .eyebrow{color:#FFB8C9}

/* inline styles : la déclaration en attribut l'emporte, il faut !important */
body.dark [style*="--acc:#092D59"]{--acc:#A9C4EE!important}
body.dark [style*="--acc:#1B4A85"]{--acc:#9CBDF0!important}
body.dark [style*="--acc:#5A6B7E"]{--acc:#BCC6D4!important}
body.dark [style*="--acc:#C0093A"]{--acc:#FF8AA8!important}
body.dark [style*="--acc:#5F3891"]{--acc:#C4A5F0!important}
body.dark [style*="--acc:#1B4A85"]{--acc:#5CD2E0!important}
body.dark [style*="--acc:#092D59"]{--acc:#63D093!important}
body.dark [style*="crimson-d"]{color:#FF8AA8!important}
body.dark .pbody[style*="#fff"]{background:var(--surf)!important}
body.dark .pcard[style*="linear-gradient"]{background:linear-gradient(135deg,#22345C,#324A7C)!important}
body.dark .room .rl[style*="--crimson"]{color:#260B12}

/* rail de la maquette : fond navy, l'encre secondaire doit s'éclaircir */
#nav .mini{color:#B4C8E0}

/* réserves d'images en fond clair : l'étiquette doit rester lisible */
.qimg .lbl2,.qimg .lbl2 b{color:#4B5A6B}

body.dark .qimg .lbl2,body.dark .qimg .lbl2 b{color:#B2BDCE}
body.dark .opt.ko .ltr{color:#fff}
body.dark [style*="background:#fff"]{background:var(--surf)!important;color:var(--ink)}

/* ══════════ RAIL DE MAQUETTE — navy de la charte, crimson pour l'actif ══════════ */
body.dark #nav{background:#08111F}
body.dark #nav .brand{border-bottom-color:rgba(255,255,255,.13)}
body.dark #nav .brand span{color:#93ADCB}
body.dark #nav h4{color:#8AA5C4}
body.dark #nav a{color:#DCE6F3}
body.dark #nav .mini{color:#9DB6D2}
body.dark #nav a:hover{background:rgba(255,255,255,.07)}
body.dark #nav a.on{background:rgba(192,9,58,.26);border-left-color:#FF6E92;color:#fff}
body.dark #nav .note{background:rgba(255,255,255,.05);color:#AFC4DB}
body.dark .themesw{background:rgba(255,255,255,.08)}
body.dark .themesw b{color:#A7BDD6}
body.dark .themesw b.on{background:#E9F0FA;color:#0B2542}
body.dark .thnote{color:#93ADCB}
body.dark .thpick .tip{background:#0B2542}
body.dark .thpick{background:rgba(255,255,255,.1)}

/* accents tarifaires : deux teintes navy et le crimson, rien d'autre */
body.dark [style*="--acc:#092D59"]{--acc:#A9C4EE!important}
body.dark [style*="--acc:#1B4A85"]{--acc:#9CBDF0!important}
body.dark [style*="--acc:#5A6B7E"]{--acc:#BCC6D4!important}
body.dark [style*="--acc:#C0093A"]{--acc:#FF8AA8!important}
body.dark [style*="--acc:#5F3891"]{--acc:#C4A5F0!important}

body.dark .sgup{background:#C0093A;color:#fff;box-shadow:none}
body.dark .sgup:hover{background:#8E0A2E}
body.dark .ptab .on,body.dark .ptab .on i{color:#FF9BB4}

/* le pied de page passe au-dessus du filigrane : il doit rester net */
footer.site{position:relative;z-index:2}

/* variante neutre du tableau : pas de colonne mise en avant */
.sharedtbl.plain th:nth-child(2){background:var(--navy)}
.sharedtbl.plain td:nth-child(2),.sharedtbl.plain td:nth-child(3){background:var(--blue)}
body.dark .sharedtbl.plain th:nth-child(2){background:var(--nvb)}
body.dark .sharedtbl.plain td:nth-child(2),body.dark .sharedtbl.plain td:nth-child(3){background:var(--surf)}