/* ==========================================================================
   PRÉPA ISPITS — Système visuel « Revue académique »
   Lecture longue reposante · hiérarchie claire · sobriété
   Titres Fraunces · Corps Source Serif 4 · Interface Inter
   ========================================================================== */
:root {
  --paper:#fbfcfd; --paper-2:#f3f6f8; --card:#ffffff; --line:#e4e8ec; --line-soft:#eef1f4;
  --ink:#1f2933; --ink-2:#46535f; --ink-3:#78858f; --ink-4:#9aa5ae;
  --blue:#1d4e6f; --blue-deep:#163c56; --blue-soft:#e8eff4; --blue-tint:#f2f7fa;
  --ok:#2f6b57; --ok-bg:#e7f1ec; --warn:#9a6b1f; --warn-bg:#f6eeda; --err:#a23b3b; --err-bg:#f6e7e6;
  --display:"Fraunces",Georgia,serif; --read:"Source Serif 4",Georgia,serif;
  --ui:"Inter",system-ui,-apple-system,sans-serif;
  --r-sm:8px; --r-md:12px; --r-lg:18px;
  --sh-1:0 1px 2px rgba(31,41,51,.05); --sh-2:0 2px 10px rgba(31,41,51,.06); --sh-3:0 8px 28px rgba(31,41,51,.09);
  --measure:68ch; --sidebar-w:268px; --ease:cubic-bezier(.4,0,.2,1);
  /* alias de compatibilité (anciennes classes) */
  --ivory:var(--paper); --ivory-soft:var(--paper-2); --ivory-deep:var(--paper-2); --cream:var(--card);
  --gold:var(--blue); --gold-deep:var(--blue-deep); --gold-soft:var(--blue-soft);
  --sage:var(--ok); --sage-deep:var(--ok); --ink-soft:var(--ink-2); --ink-mute:var(--ink-3);
  --success:var(--ok); --success-bg:var(--ok-bg); --error:var(--err); --error-bg:var(--err-bg);
  /* v9.18 — doré des étoiles d'avis (ajusté par thème dans themes.css) */
  --star:#e8a838; --star-deep:#d8901f;
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;overflow-x:hidden;}
body{margin:0;font-family:var(--ui);color:var(--ink);background:var(--paper);
  line-height:1.6;font-size:16px;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  padding-bottom:env(safe-area-inset-bottom);}
h1,h2,h3,h4{font-family:var(--display);font-weight:600;line-height:1.2;letter-spacing:-.01em;color:var(--ink);margin:0;}
a{color:var(--blue);text-decoration:none;} a:hover{color:var(--blue-deep);}
p{margin:0 0 1em;}
code{font-family:ui-monospace,"SF Mono",Menlo,monospace;background:var(--paper-2);
  padding:1px 6px;border-radius:5px;font-size:.85em;color:var(--ink-2);}
.mute{color:var(--ink-3);} img{max-width:100%;}
:focus-visible{outline:2.5px solid var(--blue);outline-offset:2px;border-radius:3px;}

/* ---------- Boutons & puces ---------- */
.btn-primary,.btn-ghost,.btn-gold{font-family:var(--ui);font-size:.95rem;font-weight:600;
  padding:12px 22px;border-radius:var(--r-sm);border:1px solid transparent;cursor:pointer;
  transition:all .18s var(--ease);display:inline-flex;align-items:center;gap:8px;text-decoration:none;line-height:1;}
.btn-primary,.btn-gold{background:var(--blue);color:var(--btn-txt,#fff);box-shadow:var(--sh-1);}
.btn-primary:hover,.btn-gold:hover{background:var(--blue-deep);color:var(--btn-txt,#fff);box-shadow:var(--sh-2);transform:translateY(-1px);}
.btn-ghost{background:var(--card);color:var(--ink-2);border-color:var(--line);}
.btn-ghost:hover{border-color:var(--blue);color:var(--blue);}
.landing-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:26px;}
@media(max-width:440px){.landing-cta{flex-direction:column;align-items:stretch;max-width:280px;margin-left:auto;margin-right:auto;}
  .landing-cta a{justify-content:center;}}
.chip{font-family:var(--ui);font-size:.82rem;font-weight:600;padding:7px 13px;border-radius:99px;
  border:1px solid var(--line);background:var(--card);color:var(--ink-2);cursor:pointer;
  transition:all .15s var(--ease);text-decoration:none;display:inline-flex;align-items:center;gap:6px;line-height:1;}
.chip:hover{border-color:var(--blue);color:var(--blue);}
.chip-primary,.chip-gold{background:var(--blue);color:var(--btn-txt,#fff);border-color:var(--blue);}
.chip-primary:hover,.chip-gold:hover{background:var(--blue-deep);color:var(--btn-txt,#fff);}
.chip-danger{background:var(--err-bg);color:var(--err);border-color:#e0b7b5;}
.chip-danger:hover{background:var(--err);color:var(--btn-txt,#fff);border-color:var(--err);}
.chip-warn{background:var(--warn-bg);color:var(--warn);border-color:#ddc48a;}
.chip-warn:hover{background:var(--warn);color:var(--btn-txt,#fff);}

/* ---------- Topbar + sidebar ---------- */
.topbar{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:14px;padding:0 20px;
  height:60px;background:var(--topbar-bg,rgba(251,252,253,.9));backdrop-filter:blur(10px);border-bottom:1px solid var(--line);}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;}
.brand-badge{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;
  background:var(--blue);color:var(--btn-txt,#fff);font-size:1.05rem;flex-shrink:0;}
.brand-txt{display:flex;flex-direction:column;line-height:1.15;}
.brand-txt strong{font-family:var(--display);font-size:1.02rem;font-weight:600;color:var(--ink);}
.brand-txt small{font-size:.72rem;color:var(--ink-3);letter-spacing:.02em;}
.burger{display:none;width:40px;height:40px;border:1px solid var(--line);background:var(--card);
  border-radius:var(--r-sm);cursor:pointer;flex-direction:column;gap:4px;align-items:center;justify-content:center;}
.burger span{width:18px;height:2px;background:var(--ink-2);border-radius:2px;}
.topbar-zone{margin-left:auto;font-size:.8rem;font-weight:600;color:var(--ink-3);
  padding:5px 12px;background:var(--paper-2);border-radius:99px;}
.topbar-out{font-size:.85rem;font-weight:600;color:var(--ink-3);}
.topbar-out:hover{color:var(--err);}
.shell{display:flex;min-height:calc(100vh - 60px);}
.sidebar{width:var(--sidebar-w);flex-shrink:0;border-right:1px solid var(--line);padding:24px 16px;
  position:sticky;top:60px;height:calc(100vh - 60px);overflow-y:auto;background:var(--paper);}
.sidebar-group{margin-bottom:22px;}
.sidebar-label{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em;
  color:var(--ink-4);padding:0 12px;margin-bottom:8px;}
.sidebar a{display:flex;align-items:center;gap:11px;padding:9px 12px;border-radius:var(--r-sm);
  font-size:.9rem;font-weight:500;color:var(--ink-2);transition:all .15s var(--ease);margin-bottom:2px;}
.sidebar a:hover{background:var(--paper-2);color:var(--ink);}
.sidebar a.is-active{background:var(--blue-soft);color:var(--blue-deep);font-weight:600;}
.sidebar a.is-locked{color:var(--ink-4);cursor:not-allowed;}
.sidebar-ico{width:18px;text-align:center;opacity:.75;}
.content{flex:1;min-width:0;padding:34px 40px 80px;position:relative;}
.scrim{display:none;}

/* ---------- Fil d'Ariane ---------- */
.crumbs{display:flex;align-items:center;gap:8px;font-size:.82rem;color:var(--ink-3);margin-bottom:22px;flex-wrap:wrap;}
.crumbs a{color:var(--ink-3);} .crumbs a:hover{color:var(--blue);}
.crumbs span{color:var(--ink-4);} .crumbs strong{color:var(--ink-2);font-weight:600;}

/* ---------- Accueil : en-tête, stats, grille modules ---------- */
.page-head{max-width:var(--measure);margin-bottom:30px;}
.eyebrow{font-family:var(--ui);font-size:.74rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.1em;color:var(--blue);margin-bottom:10px;display:block;}
.page-title{font-size:clamp(1.8rem,3vw,2.4rem);margin-bottom:10px;}
.page-sub{font-size:1.02rem;color:var(--ink-2);line-height:1.6;}
.stat-row{display:flex;gap:30px;flex-wrap:wrap;padding:20px 0;border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);margin-bottom:34px;}
.stat{display:flex;flex-direction:column;gap:2px;}
.stat b{font-family:var(--display);font-size:1.7rem;font-weight:600;color:var(--blue);}
.stat span{font-size:.82rem;color:var(--ink-3);}
.section-title{font-size:1.3rem;margin:0 0 18px;padding-bottom:10px;border-bottom:1px solid var(--line);}
.mod-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(280px,100%),1fr));gap:18px;}
.mod-card{display:flex;flex-direction:column;gap:12px;padding:22px;background:var(--card);
  border:1px solid var(--line);border-radius:var(--r-md);transition:all .2s var(--ease);
  position:relative;text-decoration:none;}
.mod-card:hover{border-color:var(--blue);box-shadow:var(--sh-2);transform:translateY(-2px);}
.mod-card-num{font-family:var(--display);font-size:.9rem;font-weight:600;color:var(--ink-4);}
.mod-card h3{font-size:1.18rem;line-height:1.25;color:var(--ink);}
.mod-card p{font-size:.88rem;color:var(--ink-3);margin:0;line-height:1.5;}
.mod-card-meta{display:flex;gap:14px;margin-top:auto;padding-top:12px;border-top:1px solid var(--line-soft);
  font-size:.8rem;color:var(--ink-3);}
.mod-card-meta b{color:var(--ink-2);font-weight:600;}
.mod-card.is-locked{opacity:.62;} .mod-card.is-locked:hover{transform:none;border-color:var(--line);box-shadow:none;}
.mod-lock{position:absolute;top:18px;right:18px;font-size:.95rem;opacity:.5;}

/* ---------- Lecteur de cours ---------- */
.reader{max-width:var(--measure);}
.reader-head{margin-bottom:30px;padding-bottom:22px;border-bottom:2px solid var(--line);}
.reader-eyebrow{font-family:var(--ui);font-size:.76rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.09em;color:var(--blue);margin-bottom:12px;}
.reader-title{font-family:var(--display);font-size:clamp(1.8rem,3.4vw,2.55rem);font-weight:600;
  line-height:1.15;margin-bottom:12px;}
.reader-sub{font-family:var(--read);font-size:1.12rem;color:var(--ink-2);line-height:1.55;font-style:italic;}
.reader-meta{display:flex;gap:16px;margin-top:16px;font-size:.82rem;color:var(--ink-3);font-family:var(--ui);}
.reader-meta span{display:inline-flex;align-items:center;gap:6px;}
.reader-intro{font-family:var(--read);font-size:1.16rem;line-height:1.75;color:var(--ink);margin-bottom:30px;}
.reader-intro::first-letter{font-family:var(--display);font-size:3.1em;float:left;line-height:.78;
  padding:6px 12px 0 0;color:var(--blue);font-weight:600;}
.reader-sec{margin-bottom:42px;padding-left:24px;border-left:2px solid var(--line-soft);}
.reader-sec>h2{font-size:1.32rem;margin-bottom:16px;color:var(--ink);line-height:1.3;}
.reader-sec>h2 .sec-num{font-family:var(--ui);font-size:.8rem;font-weight:700;color:var(--blue);
  display:block;margin-bottom:4px;letter-spacing:.05em;}
.reader-sec p,.reader-sec li{font-family:var(--read);font-size:1.09rem;line-height:1.8;color:var(--ink);}
.reader-sec p{margin-bottom:1.1em;}
.reader-sec ul{padding-left:22px;margin:0 0 1.1em;} .reader-sec li{margin-bottom:10px;padding-left:4px;}
.reader-sec li::marker{color:var(--blue);}
.reader-schema{margin:20px 0;padding:20px 24px;background:var(--blue-tint);border:1px solid var(--blue-soft);
  border-radius:var(--r-md);border-left:3px solid var(--blue);}
.reader-schema h4{font-family:var(--ui);font-size:.78rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.07em;color:var(--blue);margin-bottom:10px;}
.reader-schema-body{font-family:var(--read);font-size:1.04rem;line-height:1.7;white-space:pre-wrap;}
.schema-formule{text-align:center;font-size:1.15rem;}
.reader-pager{display:flex;justify-content:space-between;gap:12px;margin-top:40px;padding-top:24px;
  border-top:1px solid var(--line);}
.pager-link{display:flex;flex-direction:column;gap:3px;padding:14px 18px;border:1px solid var(--line);
  border-radius:var(--r-md);background:var(--card);max-width:47%;transition:all .18s var(--ease);}
.pager-link:hover{border-color:var(--blue);box-shadow:var(--sh-1);}
.pager-link small{font-size:.72rem;color:var(--ink-4);text-transform:uppercase;letter-spacing:.06em;}
.pager-link b{font-family:var(--display);font-size:.98rem;font-weight:600;color:var(--ink);}
.pager-link.next{text-align:right;margin-left:auto;}

/* ---------- Liste des cours d'un module ---------- */
.lesson-list{display:flex;flex-direction:column;gap:10px;max-width:var(--measure);}
.lesson{display:flex;align-items:center;gap:16px;padding:16px 20px;background:var(--card);
  border:1px solid var(--line);border-radius:var(--r-md);transition:all .18s var(--ease);text-decoration:none;}
.lesson:hover{border-color:var(--blue);box-shadow:var(--sh-1);transform:translateX(2px);}
.lesson-num{font-family:var(--display);font-size:1.3rem;font-weight:600;color:var(--ink-4);
  min-width:32px;text-align:center;}
.lesson-body{flex:1;min-width:0;}
.lesson-body h3{font-size:1.05rem;color:var(--ink);margin-bottom:3px;}
.lesson-body p{font-size:.85rem;color:var(--ink-3);margin:0;}
.lesson-tags{display:flex;gap:8px;flex-shrink:0;}
.lesson-tag{font-family:var(--ui);font-size:.72rem;font-weight:600;padding:4px 10px;border-radius:99px;
  background:var(--paper-2);color:var(--ink-3);}
.lesson-arrow{color:var(--ink-4);font-size:1.1rem;}

/* ---------- QCM ---------- */
.q-card,.qcard{max-width:var(--measure);background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-lg);padding:30px 32px;box-shadow:var(--sh-1);}
.q-progress{display:flex;justify-content:space-between;font-family:var(--ui);font-size:.82rem;
  color:var(--ink-3);font-weight:600;margin-bottom:12px;}
.q-bar{height:4px;background:var(--paper-2);border-radius:99px;overflow:hidden;margin-bottom:24px;}
.q-bar i{display:block;height:100%;background:var(--blue);border-radius:99px;transition:width .3s var(--ease);}
.q-text{font-family:var(--read);font-size:1.22rem;line-height:1.5;color:var(--ink);margin-bottom:22px;font-weight:500;}
.q-opts{display:flex;flex-direction:column;gap:10px;}
.q-opt{font-family:var(--ui);font-size:1rem;text-align:left;padding:15px 18px;border:1.5px solid var(--line);
  border-radius:var(--r-md);background:var(--card);color:var(--ink);cursor:pointer;
  transition:all .15s var(--ease);line-height:1.4;}
.q-opt:hover:not(:disabled){border-color:var(--blue);background:var(--blue-tint);}
.q-opt:disabled{cursor:default;}
.q-opt.is-good{background:var(--ok-bg);border-color:var(--ok);color:var(--ok);font-weight:600;}
.q-opt.is-bad{background:var(--err-bg);border-color:var(--err);color:var(--err);}
.q-expl{margin-top:18px;padding:16px 20px;background:var(--blue-tint);border-left:3px solid var(--blue);
  border-radius:var(--r-sm);font-family:var(--read);font-size:1rem;line-height:1.65;color:var(--ink-2);}
.q-expl strong{color:var(--blue-deep);}
.q-next{margin-top:22px;}
.q-score{text-align:center;}
.q-ring{width:130px;height:130px;margin:0 auto 8px;display:block;}
.q-ring circle.bg{stroke:var(--paper-2);}
.q-ring circle.fg{stroke:var(--blue);transition:stroke-dashoffset 1s var(--ease);}
.q-ring text{font-family:var(--display);font-size:1.5rem;font-weight:600;fill:var(--ink);}
.q-mention{font-family:var(--display);font-size:1.5rem;color:var(--blue);margin:6px 0;}

/* ---------- Fiches de révision ---------- */
.fiche{max-width:var(--measure);background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-lg);padding:32px 34px;box-shadow:var(--sh-1);}
.fiche-title{font-size:1.6rem;margin-bottom:24px;padding-bottom:14px;border-bottom:2px solid var(--line);}
.fiche-point{margin-bottom:22px;padding-left:20px;border-left:2px solid var(--blue-soft);}
.fiche-point h4{font-family:var(--display);font-size:1.12rem;color:var(--blue-deep);margin-bottom:6px;}
.fiche-point p{font-family:var(--read);font-size:1.05rem;line-height:1.7;color:var(--ink);margin:0;}
.rev-group{margin-bottom:34px;}
.rev-group-title{font-size:1.15rem;color:var(--ink-2);margin-bottom:14px;
  padding-bottom:8px;border-bottom:1px solid var(--line);}

/* ---------- Examen ---------- */
.exam-intro{max-width:var(--measure);background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-lg);padding:30px 32px;}
.exam-timer{position:sticky;top:72px;z-index:20;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-md);padding:12px 20px;margin-bottom:22px;display:flex;align-items:center;
  gap:12px;box-shadow:var(--sh-1);max-width:var(--measure);}
.exam-timer #exam-clock{font-family:var(--display);font-size:1.5rem;font-weight:600;color:var(--blue);}
.exam-timer.is-danger #exam-clock{color:var(--err);animation:pulse 1s infinite;}
@keyframes pulse{50%{opacity:.5;}}
.corr-tag{font-family:var(--ui);font-size:.75rem;font-weight:600;color:var(--ink-3);
  text-transform:uppercase;letter-spacing:.05em;}
.exam-q{max-width:var(--measure);background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-md);padding:22px 26px;margin-bottom:16px;}
.exam-q h4{font-family:var(--read);font-size:1.08rem;line-height:1.5;margin-bottom:14px;font-weight:600;}
.exam-q label{display:flex;gap:11px;align-items:flex-start;padding:11px 14px;border-radius:var(--r-sm);
  cursor:pointer;transition:background .12s var(--ease);font-family:var(--ui);font-size:.98rem;}
.exam-q label:hover{background:var(--blue-tint);}
.corr-item{border-left:3px solid var(--line);}
.corr-item.is-good{border-left-color:var(--ok);} .corr-item.is-bad{border-left-color:var(--err);}

/* ---------- Préparation / glossaire ---------- */
.prep-search{max-width:var(--measure);}
.glo-list{max-width:var(--measure);display:flex;flex-direction:column;gap:8px;margin-top:16px;}
.glo-item{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:0;overflow:hidden;}
.glo-item summary{padding:15px 20px;cursor:pointer;font-weight:600;color:var(--ink);
  display:flex;justify-content:space-between;align-items:center;font-family:var(--ui);}
.glo-item summary:hover{background:var(--paper-2);}
.glo-item[open] summary{border-bottom:1px solid var(--line);}
.glo-terme{font-size:1rem;}
.glo-cat{font-size:.72rem;color:var(--ink-4);font-weight:500;}
.glo-def{padding:16px 20px;font-family:var(--read);font-size:1.02rem;line-height:1.7;color:var(--ink-2);}
.syn-block{max-width:var(--measure);background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-md);padding:0;margin-bottom:10px;overflow:hidden;}
.syn-block summary{padding:16px 22px;cursor:pointer;font-family:var(--display);font-size:1.1rem;
  font-weight:600;color:var(--ink);}
.syn-block summary:hover{background:var(--paper-2);}
.syn-block-body{padding:0 22px 18px;font-family:var(--read);font-size:1.02rem;line-height:1.7;color:var(--ink-2);}

/* ---------- Cartes / clés (landing) ---------- */
.landing{max-width:960px;margin:0 auto;padding:56px 24px;}
.landing-head{text-align:center;margin-bottom:40px;}
.landing-logo{width:56px;height:56px;border-radius:14px;background:var(--blue);color:var(--btn-txt,#fff);
  display:grid;place-items:center;font-size:1.6rem;margin:0 auto 20px;}
.landing-eyebrow{font-family:var(--ui);font-size:.76rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.12em;color:var(--blue);margin-bottom:12px;}
.landing-title{font-size:clamp(1.15rem,4.2vw,1.7rem);margin-bottom:14px;line-height:1.25;} /* v9.29 : réduit + guillemets */
.landing-sub{font-size:1.08rem;color:var(--ink-2);max-width:52ch;margin:0 auto;line-height:1.6;}
.keycard{max-width:460px;margin:0 auto 40px;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-lg);padding:32px;box-shadow:var(--sh-2);}
.keycard-badge{display:inline-block;font-family:var(--ui);font-size:.72rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.08em;color:var(--blue);background:var(--blue-soft);
  padding:4px 11px;border-radius:99px;margin-bottom:14px;}
.keycard-title{font-size:1.35rem;margin-bottom:8px;}
.keycard-hint{font-size:.9rem;color:var(--ink-3);margin-bottom:20px;line-height:1.55;}
.keyform{display:flex;flex-direction:column;gap:14px;}
.keyform label{font-family:var(--ui);font-size:.85rem;font-weight:600;color:var(--ink-2);
  display:flex;flex-direction:column;gap:6px;}
.keyinput{font-family:var(--ui);font-size:1rem;padding:13px 16px;border:1.5px solid var(--line);
  border-radius:var(--r-sm);background:var(--card);color:var(--ink);width:100%;transition:border-color .15s var(--ease);}
.keyinput:focus{outline:none;border-color:var(--blue);}
.keyinput.search{font-size:.95rem;}
.remember{flex-direction:row!important;align-items:center;gap:8px!important;font-weight:500!important;
  color:var(--ink-3)!important;cursor:pointer;}
.zone-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(250px,100%),1fr));gap:16px;margin-top:8px;}
.zone-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:24px;
  display:flex;flex-direction:column;gap:10px;transition:all .2s var(--ease);}
.zone-card:hover{border-color:var(--blue);box-shadow:var(--sh-2);transform:translateY(-2px);}
.zone-card h3{font-size:1.2rem;}
.zone-card p{font-size:.86rem;color:var(--ink-3);margin:0;flex:1;line-height:1.5;}
.landing-foot{text-align:center;margin-top:30px;font-size:.9rem;}
.landing-body{background:var(--paper);}

/* ---------- Page « Comment obtenir ma clé » ---------- */
.obt-lifetime{max-width:760px;margin:0 auto 34px;display:flex;align-items:center;gap:18px;
  background:var(--blue);color:var(--btn-txt,#fff);border-radius:var(--r-lg);
  padding:22px 26px;box-shadow:var(--sh-2);}
.obt-lifetime-ico{flex-shrink:0;font-size:2.6rem;line-height:1;font-weight:700;opacity:.9;}
.obt-lifetime strong{display:block;font-family:var(--display);font-size:1.3rem;
  margin-bottom:4px;line-height:1.25;}
.obt-lifetime span{display:block;font-size:.98rem;line-height:1.55;opacity:.92;}
@media(max-width:560px){
  .obt-lifetime{flex-direction:column;text-align:center;gap:10px;padding:22px 20px;}
  .obt-lifetime strong{font-size:1.15rem;}
}
.obt-step{max-width:760px;margin:0 auto 38px;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-lg);padding:26px 28px;box-shadow:var(--sh-1);}
.obt-step-head{display:flex;align-items:center;gap:14px;margin-bottom:8px;}
.obt-step-head h2{font-size:1.25rem;margin:0;}
.obt-num{flex-shrink:0;width:36px;height:36px;border-radius:99px;background:var(--blue);
  color:var(--btn-txt,#fff);display:grid;place-items:center;font-family:var(--ui);
  font-weight:700;font-size:1.05rem;}
.obt-lead{margin:0 0 18px;line-height:1.6;}
.obt-card{position:relative;}
.obt-tag{display:inline-block;font-family:var(--ui);font-size:.68rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.05em;color:var(--btn-txt,#fff);background:var(--blue);
  padding:4px 10px;border-radius:99px;margin-bottom:4px;align-self:flex-start;}
.obt-eap .obt-tag{background:#1f52b8;}
.obt-isp .obt-tag{background:#1d6b45;}
.obt-mqss .obt-tag{background:#5a3a9e;}
.obt-key{display:block;margin-top:6px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:.82rem;color:var(--ink-3);background:var(--paper-2);padding:8px 10px;
  border-radius:var(--r-sm);letter-spacing:.02em;text-align:center;}
.obt-pack{margin-top:20px;border:1.5px dashed var(--blue);background:var(--blue-tint);
  border-radius:var(--r-md);padding:16px 18px;}
.obt-pack-badge{display:inline-block;font-family:var(--ui);font-size:.7rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.06em;color:var(--btn-txt,#fff);background:var(--blue);
  padding:4px 11px;border-radius:99px;margin-bottom:8px;}
.obt-pack p{margin:0;font-size:.95rem;color:var(--ink-2);line-height:1.55;}
.obt-contact{display:flex;gap:12px;flex-wrap:wrap;margin-top:4px;}
.obt-contact .btn-ghost{align-items:center;}
.obt-includes{list-style:none;padding:0;margin:0;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:10px 20px;}
.obt-includes li{font-size:.95rem;color:var(--ink-2);padding-left:22px;position:relative;line-height:1.5;}
.obt-includes li::before{content:"✓";position:absolute;left:0;color:var(--blue);font-weight:700;}
@media(max-width:560px){
  .obt-step{padding:22px 18px;}
  .obt-contact .btn-primary,.obt-contact .btn-ghost{width:100%;justify-content:center;}
}

/* ---------- Annonces ---------- */
.ann-stack{max-width:var(--measure);display:flex;flex-direction:column;gap:12px;margin-bottom:28px;}
.ann-stack-landing{max-width:560px;margin:0 auto 30px;}
.ann-card{display:flex;gap:14px;align-items:flex-start;padding:16px 20px;border-radius:var(--r-md);
  border:1px solid var(--line);background:var(--card);border-left:3px solid var(--blue);}
.ann-info{border-left-color:var(--blue);} .ann-offre{border-left-color:var(--ok);background:var(--ok-bg);}
.ann-alerte{border-left-color:var(--err);background:var(--err-bg);}
.ann-icon{font-size:1.2rem;} .ann-title{font-size:1.08rem;margin-bottom:4px;}
.ann-body{font-family:var(--read);font-size:.94rem;color:var(--ink-2);margin:0;line-height:1.55;}

/* ---------- Flash ---------- */
.flash{padding:13px 18px;border-radius:var(--r-sm);font-size:.92rem;margin-bottom:18px;font-family:var(--ui);}
.flash-err{background:var(--err-bg);color:var(--err);border:1px solid #e0b7b5;}
.flash-ok{background:var(--ok-bg);color:var(--ok);border:1px solid #b8d4c6;}
.flash-lock{background:var(--warn-bg);color:var(--warn);border:1px solid #ddc48a;}

/* ---------- Pager & tables (partagés) ---------- */
.pager{display:flex;gap:8px;margin-top:26px;flex-wrap:wrap;}
.hist-table{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-md);background:var(--card);}
.hist-table table{width:100%;border-collapse:collapse;font-family:var(--ui);font-size:.88rem;}
.hist-table th{text-align:left;padding:11px 14px;background:var(--paper-2);color:var(--ink-3);
  font-weight:600;font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid var(--line);}
.hist-table td{padding:11px 14px;border-bottom:1px solid var(--line-soft);color:var(--ink-2);}
.hist-table tr:last-child td{border-bottom:none;}
.gen-keys{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-sm);
  padding:16px;font-family:ui-monospace,monospace;font-size:.9rem;line-height:1.8;white-space:pre-wrap;color:var(--ink);}
.crumbs+.reader,.crumbs+.q-card{margin-top:0;}

/* ---------- Responsive ---------- */
@media(max-width:900px){
  .burger{display:flex;}
  .sidebar{position:fixed;top:60px;left:0;transform:translateX(-100%);transition:transform .25s var(--ease);
    z-index:45;box-shadow:var(--sh-3);}
  .sidebar.is-open{transform:translateX(0);}
  .scrim{display:block;position:fixed;inset:60px 0 0;background:rgba(31,41,51,.4);opacity:0;
    pointer-events:none;transition:opacity .25s var(--ease);z-index:44;}
  .scrim.is-visible{opacity:1;pointer-events:auto;}
  .content{padding:24px 20px 70px;}
  .reader-intro::first-letter{font-size:2.6em;}
}
@media(max-width:560px){
  .content{padding:20px 16px 60px;}
  .stat-row{gap:20px;} .stat b{font-size:1.4rem;}
  .qcard,.fiche{padding:22px 20px;}
  .reader-pager{flex-direction:column;} .pager-link{max-width:100%;}
  .lesson{flex-wrap:wrap;} .lesson-tags{width:100%;padding-left:48px;}
}
@media print{
  .topbar,.sidebar,.scrim,.reader-pager,.q-next,.crumbs{display:none!important;}
  .content{padding:0;} body{background:#fff;}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;}}

/* ==========================================================================
   ADMINISTRATION (v9.1–9.3) — adapté à la palette académique
   ========================================================================== */
.admin-topbar{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:18px;
  padding:0 20px;height:60px;background:var(--card);border-bottom:1px solid var(--line);}
.admin-nav{display:flex;gap:2px;flex:1;overflow-x:auto;scrollbar-width:none;}
.admin-nav::-webkit-scrollbar{display:none;}
.admin-nav a{padding:8px 13px;border-radius:var(--r-sm);font-size:.85rem;font-weight:600;
  color:var(--ink-3);white-space:nowrap;transition:all .15s var(--ease);}
.admin-nav a:hover{background:var(--paper-2);color:var(--ink);}
.admin-nav a.is-active{background:var(--blue-soft);color:var(--blue-deep);}
.admin-body{background:var(--paper);}
/* v9.18 — Menu admin en barre latérale verticale (réutilise .sidebar).
   Les vues admin sont enveloppées dans .admin-shell : à l'intérieur de la
   colonne .content, on retire son centrage/plafond de largeur (la colonne
   s'en charge déjà) tout en gardant un padding confortable. */
.admin-side .sidebar-ico{opacity:.8;}
.admin-shell{max-width:1080px;margin:0 auto;padding:30px 22px 70px;}
.admin-body .content{padding:0;}
.admin-body .content .admin-shell{max-width:100%;margin:0;padding:30px 34px 70px;}
.admin-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:22px;flex-wrap:wrap;}
.admin-head h1{font-size:1.7rem;margin-bottom:3px;}
.admin-filters{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:var(--card);
  border:1px solid var(--line);border-radius:var(--r-md);padding:12px 14px;margin-bottom:16px;}
.admin-filters .keyinput{width:auto;min-width:140px;}
.filter-check{margin:0;white-space:nowrap;}
.admin-cols{display:grid;grid-template-columns:1fr 1fr;gap:22px;}
@media(max-width:800px){.admin-cols{grid-template-columns:1fr;}}
.inline-form{display:inline-block;margin:0 2px 2px 0;}
.actions-cell{white-space:nowrap;}
.hero-stats,.admin-stats{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:22px;}
.hstat{flex:1;min-width:120px;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-md);padding:16px 18px;display:flex;flex-direction:column;gap:3px;}
.hstat strong{font-family:var(--display);font-size:1.7rem;font-weight:600;color:var(--blue);}
.hstat span{font-size:.78rem;color:var(--ink-3);}
.badge{display:inline-block;padding:2px 9px;border-radius:99px;font-size:.72rem;font-weight:700;
  letter-spacing:.03em;border:1px solid var(--line);background:var(--paper-2);color:var(--ink-3);text-decoration:none;}
.badge-ok{background:var(--ok-bg);color:var(--ok);border-color:#b8d4c6;}
.badge-warn{background:var(--warn-bg);color:var(--warn);border-color:#ddc48a;}
.badge-err{background:var(--err-bg);color:var(--err);border-color:#e0b7b5;}
.dot-online{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--ok);
  box-shadow:0 0 0 0 rgba(47,107,87,.5);animation:dot-pulse 1.8s infinite;margin-right:4px;}
@keyframes dot-pulse{0%{box-shadow:0 0 0 0 rgba(47,107,87,.45);}70%{box-shadow:0 0 0 7px rgba(47,107,87,0);}100%{box-shadow:0 0 0 0 rgba(47,107,87,0);}}
.row-online td{background:rgba(47,107,87,.05);}
.hstat-live strong{display:flex;align-items:center;justify-content:center;gap:8px;}
.flash-link{display:block;text-decoration:none;color:inherit;transition:transform .18s var(--ease);}
.flash-link:hover{transform:translateY(-1px);}
.ua-cell{max-width:320px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.8rem;}
.share-card{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--err);
  border-radius:var(--r-md);padding:16px 18px;margin-bottom:18px;}
.share-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px;}
.share-hash{font-size:1rem;font-weight:700;}
.share-metrics{display:flex;gap:6px;} .share-actions{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap;}
.ann-form-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:20px 22px;margin-bottom:26px;}
.ann-form label{display:block;font-weight:600;font-size:.85rem;margin:12px 0 5px;font-family:var(--ui);}
.ann-form textarea{resize:vertical;font-family:var(--ui);}
.ann-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;}
.ann-form-actions{display:flex;gap:10px;margin-top:18px;align-items:center;}
.ann-row{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;background:var(--card);
  border:1px solid var(--line);border-radius:var(--r-md);padding:14px 16px;margin-bottom:10px;}
.ann-row.is-off{opacity:.55;} .ann-row-main{flex:1;min-width:0;} .ann-row-main>*{margin-right:8px;}
.ann-preview{margin:6px 0 0;font-size:.85rem;max-width:60ch;overflow:hidden;display:-webkit-box;
  -webkit-line-clamp:2;-webkit-box-orient:vertical;}
.ann-row-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;}
.ann-type{font-size:.75rem;font-weight:700;}
.gen-form{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:12px;}
.setup-steps{margin:14px 0 0;padding-left:20px;line-height:1.9;}
.setup-steps li{margin-bottom:16px;}
.qr-box{display:inline-block;margin:12px 0 8px;padding:12px;background:#fff;border:1px solid var(--line);border-radius:var(--r-md);}
.qr-box svg{display:block;width:200px;height:200px;}
.secret-code{font-size:.95rem;letter-spacing:.12em;font-weight:700;background:var(--paper-2);
  padding:4px 8px;border-radius:var(--r-sm);user-select:all;}
.code-input{text-align:center;font-size:1.5rem;letter-spacing:.35em;font-weight:700;font-family:var(--display);}
.danger-details{margin-top:18px;border-top:1px solid var(--line);padding-top:12px;}
.danger-details summary{cursor:pointer;font-size:.85rem;color:var(--ink-3);}
.danger-details summary:hover{color:var(--err);}
.sec-log{max-height:520px;overflow-y:auto;}
.notfound{min-height:70vh;justify-content:center;}
.admin-form label{text-align:left;}

/* ---------- Filigrane de traçabilité ---------- */
.wm-layer{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden;display:flex;
  flex-wrap:wrap;align-content:flex-start;gap:120px 100px;padding:60px;user-select:none;}
.wm-layer span{font-family:var(--ui);font-size:.7rem;font-weight:600;letter-spacing:.22em;
  color:var(--ink);opacity:.018;transform:rotate(-24deg);white-space:nowrap;}
.content>*:not(.wm-layer){position:relative;z-index:1;}
@media print{.wm-layer span{opacity:.14;font-size:.85rem;}}
/* ---------- Gêne à la copie ---------- */
/* v9.32 — La garde portait sur une liste de classes qu'il fallait penser à
   compléter à chaque nouvel onglet ; un onglet oublié restait copiable.
   Elle porte désormais sur TOUT le conteneur de contenu, ce qui couvre les
   onglets actuels et ceux à venir. Les champs de saisie restent utilisables.
   Rappel : ceci gêne la copie, cela ne l'empêche pas (inspecteur, source,
   impression, capture d'écran). La protection réelle reste l'accès par clé,
   la détection de partage et le filigrane. */
.guard-on .content{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;
  user-select:none;-webkit-touch-callout:none;}
.guard-on .content input,.guard-on .content textarea,.guard-on .content select,
.guard-on .content [contenteditable="true"],.guard-on .keyinput{
  -webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;
  -webkit-touch-callout:default;}
.guard-on .secret-code{-webkit-user-select:all;user-select:all;}
.hp-field{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0;pointer-events:none;}
.sidebar-foot{margin-top:24px;padding:16px 12px 0;border-top:1px solid var(--line);
  font-family:var(--ui);font-size:.76rem;color:var(--ink-3);line-height:1.6;}
.inst-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(240px,100%),1fr));gap:14px;max-width:900px;margin-bottom:34px;}
.inst-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:18px 20px;}
.inst-card h3{font-size:1.05rem;margin-bottom:6px;color:var(--ink);}
.inst-card p{font-size:.85rem;color:var(--ink-3);margin:0;line-height:1.5;}
.fil-options{margin:0;padding:16px 22px 18px 38px;font-family:var(--read);font-size:1rem;line-height:1.7;color:var(--ink-2);}
.demo-banner{max-width:var(--measure);}

/* ==========================================================================
   v9.5 — AIDE À L'UTILISATION
   ========================================================================== */
/* Bandeau d'aide contextuel */
.hint{display:flex;align-items:flex-start;gap:12px;max-width:var(--measure);
  background:var(--blue-tint);border:1px solid var(--blue-soft);border-left:3px solid var(--blue);
  border-radius:var(--r-md);padding:13px 16px;margin-bottom:22px;position:relative;}
.hint-ico{flex-shrink:0;width:20px;height:20px;border-radius:50%;background:var(--blue);color:var(--btn-txt,#fff);
  font-family:var(--display);font-size:.78rem;font-weight:700;display:grid;place-items:center;margin-top:1px;}
.hint p{margin:0;font-size:.9rem;line-height:1.55;color:var(--ink-2);flex:1;}
.hint strong{color:var(--blue-deep);}
.hint-close{flex-shrink:0;background:none;border:none;color:var(--ink-4);font-size:1.3rem;
  line-height:1;cursor:pointer;padding:0 2px;border-radius:4px;}
.hint-close:hover{color:var(--ink);}
.hint.is-hidden{display:none;}

/* Landing : blocs numérotés */
.start-block{max-width:860px;margin:0 auto 46px;}
.start-head{display:flex;gap:16px;align-items:flex-start;margin-bottom:20px;}
.start-num{flex-shrink:0;width:34px;height:34px;border-radius:50%;background:var(--blue);color:var(--btn-txt,#fff);
  font-family:var(--display);font-size:1.05rem;font-weight:600;display:grid;place-items:center;}
.start-head h2{font-size:1.4rem;margin-bottom:5px;}
.start-head p{margin:0;font-size:.92rem;line-height:1.55;max-width:60ch;}
.zone-card .btn-primary{width:100%;justify-content:center;margin-top:4px;white-space:nowrap;padding:12px 10px;}
.zone-card{align-items:stretch;text-align:left;}

/* Landing : ce que contient la plateforme */
.feat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:18px;}
.feat{text-align:center;padding:20px 14px;}
.feat-ico{display:grid;place-items:center;width:42px;height:42px;margin:0 auto 12px;border-radius:11px;
  background:var(--blue-soft);color:var(--blue);font-size:1.1rem;}
.feat h3{font-size:1.02rem;margin-bottom:6px;}
.feat p{font-size:.85rem;color:var(--ink-3);margin:0;line-height:1.5;}

/* Examen : brief avant départ */
.exam-brief{margin:0;padding-left:20px;font-size:.95rem;line-height:1.75;color:var(--ink-2);}
.exam-brief li{margin-bottom:7px;} .exam-brief li::marker{color:var(--blue);}

/* Page d'aide : étapes et cartes */
.guide-steps{display:flex;flex-direction:column;gap:16px;max-width:var(--measure);margin-bottom:38px;}
.guide-step{display:flex;gap:16px;align-items:flex-start;background:var(--card);
  border:1px solid var(--line);border-radius:var(--r-md);padding:18px 20px;}
.guide-step-num{flex-shrink:0;width:30px;height:30px;border-radius:50%;background:var(--blue);color:var(--btn-txt,#fff);
  font-family:var(--display);font-size:.95rem;font-weight:600;display:grid;place-items:center;}
.guide-step h3{font-size:1.06rem;margin-bottom:4px;}
.guide-step p{margin:0;font-size:.92rem;color:var(--ink-2);line-height:1.6;}
.guide-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(240px,100%),1fr));gap:16px;margin-bottom:38px;}
.guide-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:20px;}
.guide-card-ico{width:36px;height:36px;border-radius:9px;background:var(--blue-soft);color:var(--blue);
  display:grid;place-items:center;font-size:1rem;margin-bottom:11px;}
.guide-card h3{font-size:1.02rem;margin-bottom:6px;}
.guide-card p{font-size:.88rem;color:var(--ink-3);margin:0;line-height:1.55;}

/* Visite guidée (premier passage) */
.tour-mask{position:fixed;inset:0;z-index:900;}
.tour-hole{position:absolute;border-radius:var(--r-md);box-shadow:0 0 0 9999px rgba(31,41,51,.55);
  z-index:901;pointer-events:none;border:2px solid var(--blue);}
.tour-pop{position:absolute;z-index:902;max-width:330px;background:var(--card);border-radius:var(--r-md);
  padding:18px 20px;box-shadow:var(--sh-3);}
.tour-pop h4{font-size:1.05rem;margin-bottom:7px;}
.tour-pop p{font-size:.9rem;color:var(--ink-2);line-height:1.55;margin:0 0 14px;}
.tour-actions{display:flex;justify-content:space-between;align-items:center;gap:10px;}
.tour-step{font-size:.78rem;color:var(--ink-4);font-weight:600;}
.tour-btns{display:flex;gap:8px;}
@media(max-width:700px){
  .tour-pop{left:14px!important;right:14px!important;max-width:none;}
  .start-head{gap:12px;} .hint{padding:12px 14px;}
}

/* ==========================================================================
   v9.6 — Page de blocage (contenu réservé)
   ========================================================================== */
.mod-card.is-locked{opacity:1;background:var(--paper-2);border-style:dashed;}
.mod-card.is-locked:hover{border-color:var(--blue);border-style:solid;box-shadow:var(--sh-1);transform:translateY(-2px);}
.mod-card.is-locked h3,.mod-card.is-locked .mod-card-num{color:var(--ink-3);}
.mod-card.is-locked .mod-card-meta span{color:var(--blue);font-weight:600;}
.lock-page{max-width:640px;margin:0 auto;text-align:center;padding:20px 0 40px;}
.lock-badge{width:64px;height:64px;border-radius:16px;background:var(--blue-soft);color:var(--blue);
  display:grid;place-items:center;font-size:1.7rem;margin:0 auto 22px;}
.lock-title{font-size:clamp(1.5rem,3vw,2rem);margin-bottom:12px;}
.lock-sub{font-size:1.05rem;color:var(--ink-2);line-height:1.6;max-width:52ch;margin:0 auto 30px;}
.lock-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:28px 30px;text-align:left;box-shadow:var(--sh-1);}
.lock-card h2{font-size:1.2rem;margin-bottom:16px;}
.lock-steps{margin:0 0 22px;padding-left:22px;line-height:1.8;color:var(--ink-2);}
.lock-steps li{margin-bottom:8px;} .lock-steps li::marker{color:var(--blue);font-weight:700;}
.lock-actions{display:flex;gap:12px;flex-wrap:wrap;}
.lock-foot{margin-top:26px;font-size:.92rem;}
@media(max-width:560px){.lock-actions .btn-primary,.lock-actions .btn-ghost{width:100%;justify-content:center;}}

/* v9.9 — Retour à l'accueil (mode découverte) + fiche verrouillée */
.topbar-back{margin-left:auto;display:inline-flex;align-items:center;gap:6px;
  font-size:.85rem;font-weight:600;color:var(--ink-2);padding:7px 13px;
  border:1px solid var(--line);border-radius:99px;background:var(--card);
  transition:all .15s var(--ease);white-space:nowrap;}
.topbar-back:hover{border-color:var(--blue);color:var(--blue);}
.topbar-back + .topbar-zone{margin-left:0;}
.lesson.is-locked{background:var(--paper-2);border-style:dashed;}
.lesson.is-locked:hover{border-color:var(--blue);border-style:solid;transform:translateX(2px);}
.lesson.is-locked h3{color:var(--ink-3);}
.lesson.is-locked .lesson-body p{color:var(--blue);font-weight:600;font-size:.78rem;}
@media(max-width:560px){
  .topbar-back{padding:6px 10px;font-size:.78rem;}
  .topbar-back span{display:inline;}
  .topbar{gap:8px;}
  .topbar-zone{margin-left:0;font-size:.72rem;padding:5px 9px;white-space:nowrap;}
}
@media(max-width:440px){
  /* Le bouton retour garde son libellé « Accueil » (assez court) pour rester
     compréhensible ; seul le libellé plus long « J'ai une clé » est masqué. */
  .topbar-zone .tb-label{display:none;}
  .topbar-back{padding:7px 13px;}
  .topbar-back .tb-label{display:inline;}
  .topbar-zone{padding:7px 12px;}
}

/* ==========================================================================
   v9.10 — Page de maintenance + formulaire d'identification
   ========================================================================== */
.maint-page{max-width:560px;margin:0 auto;text-align:center;padding:70px 24px;}
.maint-icon{font-size:2.6rem;margin-bottom:18px;}
.maint-title{font-size:clamp(1.7rem,3.5vw,2.3rem);margin-bottom:14px;}
.maint-msg{font-size:1.08rem;color:var(--ink-2);line-height:1.65;margin-bottom:10px;}
.maint-until{font-size:.95rem;color:var(--blue);margin-bottom:26px;}
.maint-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);
  padding:20px 24px;text-align:left;}
.maint-card p{font-size:.94rem;line-height:1.6;color:var(--ink-2);}
.maint-foot{margin-top:30px;font-size:.82rem;}

.ident-page{max-width:640px;margin:0 auto;padding:10px 0 50px;}
.ident-why{background:var(--blue-tint);border:1px solid var(--blue-soft);
  border-left:3px solid var(--blue);border-radius:var(--r-md);padding:20px 24px;margin:22px 0 26px;}
.ident-why h2{font-size:1.08rem;margin-bottom:10px;color:var(--blue-deep);}
.ident-why p{font-size:.93rem;line-height:1.65;color:var(--ink-2);margin-bottom:9px;}
.ident-why p:last-child{margin-bottom:0;}
.ident-form{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:26px 28px;box-shadow:var(--sh-1);}
.ident-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px;}
.ident-form label{display:flex;flex-direction:column;gap:6px;font-family:var(--ui);
  font-size:.88rem;font-weight:600;color:var(--ink-2);}
.ident-fs{border:none;padding:0;margin:0 0 20px;}
.ident-fs legend{font-family:var(--ui);font-size:.88rem;font-weight:600;color:var(--ink-2);
  padding:0;margin-bottom:12px;}
.ident-choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:16px;}
.ident-choice{flex-direction:row!important;align-items:center;gap:10px!important;
  padding:13px 15px;border:1.5px solid var(--line);border-radius:var(--r-md);
  cursor:pointer;transition:all .15s var(--ease);font-weight:500!important;background:var(--card);}
.ident-choice:hover{border-color:var(--blue);background:var(--blue-tint);}
.ident-choice:has(input:checked){border-color:var(--blue);background:var(--blue-soft);font-weight:600!important;}
.ident-choice input{accent-color:var(--blue);flex-shrink:0;}
.ident-choice-ico{font-size:1rem;}
.ident-note{margin-top:4px;}
.ident-note .keyinput{font-weight:400;}
.ident-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;
  padding-top:18px;border-top:1px solid var(--line-soft);}
@media(max-width:560px){
  .ident-row{grid-template-columns:1fr;}
  .ident-actions .btn-primary{width:100%;justify-content:center;}
  .maint-page{padding:50px 18px;}
}
/* v9.10 — Page d'identification : pas de barre latérale (étape obligatoire) */
.shell-gate .content{max-width:none;padding-top:40px;}

/* ==========================================================================
   v9.11 — Sélecteur d'espaces (client ayant acheté plusieurs concours)
   ========================================================================== */
.zoneswitch{position:relative;margin-left:18px;}
.zoneswitch-btn{display:inline-flex;align-items:center;gap:7px;background:var(--card);
  border:1px solid var(--line);border-radius:99px;padding:7px 13px;cursor:pointer;
  font-family:var(--ui);font-size:.84rem;font-weight:600;color:var(--ink-2);
  transition:all .15s var(--ease);}
.zoneswitch-btn:hover{border-color:var(--blue);color:var(--blue);}
.zoneswitch-btn[aria-expanded="true"]{border-color:var(--blue);color:var(--blue);background:var(--blue-tint);}
.zoneswitch-arrow{font-size:.7rem;transition:transform .15s var(--ease);}
.zoneswitch-btn[aria-expanded="true"] .zoneswitch-arrow{transform:rotate(180deg);}
.zoneswitch-menu{position:absolute;top:calc(100% + 8px);left:0;min-width:260px;z-index:60;
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);
  box-shadow:var(--sh-3);padding:8px;}
.zoneswitch-menu[hidden]{display:none;}
.zoneswitch-title{font-family:var(--ui);font-size:.72rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.06em;color:var(--ink-4);
  margin:6px 10px 8px;}
.zoneswitch-item{display:flex;align-items:center;gap:10px;padding:10px 11px;
  border-radius:var(--r-sm);font-size:.9rem;color:var(--ink-2);transition:background .12s var(--ease);}
.zoneswitch-item:hover{background:var(--paper-2);color:var(--ink);}
.zoneswitch-item.is-current{background:var(--blue-soft);color:var(--blue-deep);font-weight:600;}
.zoneswitch-ico{color:var(--blue);font-size:.7rem;}
.zoneswitch-add{display:flex;align-items:center;gap:8px;padding:10px 11px;margin-top:6px;
  border-top:1px solid var(--line-soft);border-radius:0 0 var(--r-sm) var(--r-sm);
  font-size:.85rem;color:var(--blue);font-weight:600;}
.zoneswitch-add:hover{background:var(--blue-tint);}

/* Page « Ajouter un espace » */
.addkey-page{max-width:var(--measure);}
.addkey-current{background:var(--paper-2);border:1px solid var(--line);
  border-radius:var(--r-md);padding:18px 22px;margin:22px 0 26px;}
.addkey-current h2{font-size:1rem;margin-bottom:12px;}
.addkey-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;}
.addkey-list li{display:flex;align-items:center;gap:10px;font-size:.93rem;}
.addkey-dot{color:var(--blue);font-size:.7rem;}
.addkey-list .chip{margin-left:auto;}
.addkey-list .badge{margin-left:auto;}
@media(max-width:760px){
  .zoneswitch{margin-left:10px;}
  .zoneswitch-cur{max-width:96px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .zoneswitch-menu{min-width:220px;}
}

/* v9.11 — Bannière « Ajouter un espace » sur l'accueil */
.addspace-banner{display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  background:var(--blue-tint);border:1px solid var(--blue-soft);
  border-radius:var(--r-md);padding:14px 18px;margin-bottom:26px;}
.addspace-txt{flex:1;min-width:220px;font-size:.9rem;line-height:1.5;color:var(--ink-2);}
.addspace-txt strong{display:block;color:var(--blue-deep);margin-bottom:2px;}
.addspace-btn{flex-shrink:0;white-space:nowrap;}
@media(max-width:520px){ .addspace-btn{width:100%;justify-content:center;} }

/* ==========================================================================
   Module Permutation (« Autres services ») — responsive + suit les 13 thèmes
   ========================================================================== */
.pm-wrap{max-width:820px;margin:0 auto;padding:0 4px;}
.pm-nav{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 auto 24px;
  max-width:820px;padding-bottom:14px;border-bottom:1px solid var(--line);
  padding-top:56px;padding-right:120px;}
/* Le bouton « Thème » flotte en haut à droite ; on réserve la place pour que
   les liens (Se connecter, Créer un compte) ne passent jamais dessous. */
@media(max-width:560px){
  .pm-nav{padding-top:52px;padding-right:0;}
}
.pm-nav a{font-family:var(--ui);font-size:.9rem;font-weight:600;color:var(--ink-2);
  padding:9px 16px;border-radius:999px;border:1px solid transparent;text-decoration:none;
  transition:all .15s var(--ease);}
.pm-nav a:hover{background:var(--paper-2);color:var(--ink);}
.pm-nav a.is-active{background:var(--blue-soft);color:var(--blue-deep);border-color:var(--blue-soft);}
/* v9.19.2 — « Se connecter » : bouton contour ; « Créer un compte » : bouton
   d'action principal. Uniquement des variables de thème (13 thèmes ok). */
.pm-nav a.pm-btn-ghost{border-color:var(--line);background:var(--card);color:var(--ink-2);}
.pm-nav a.pm-btn-ghost:hover{border-color:var(--blue);color:var(--blue);background:var(--card);}
.pm-nav a.pm-btn-ghost.is-active{border-color:var(--blue);color:var(--blue);background:var(--blue-tint);}
.pm-nav a.pm-btn-cta{background:var(--blue);color:var(--btn-txt,#fff);border-color:var(--blue);
  box-shadow:var(--sh-1);}
.pm-nav a.pm-btn-cta:hover{background:var(--blue-deep);border-color:var(--blue-deep);
  color:var(--btn-txt,#fff);transform:translateY(-1px);box-shadow:var(--sh-2);}
.pm-nav a.pm-btn-cta.is-active{background:var(--blue-deep);border-color:var(--blue-deep);
  color:var(--btn-txt,#fff);}
.pm-nav .pm-spacer{margin-left:auto;}
/* v9.19.2 — Pages Permutation intégrées à l'espace membre : la topbar existe
   déjà (avec le sélecteur de thème), donc plus besoin de réserver la place du
   bouton Thème flottant, ni du grand padding d'accueil. */
.content .pm-nav{padding-top:0;padding-right:0;}
.content .landing{padding:8px 0 48px;}
.pm-badge{display:inline-block;font-family:var(--ui);font-size:.7rem;font-weight:700;
  letter-spacing:.05em;text-transform:uppercase;color:var(--btn-txt,#fff);background:var(--blue);
  padding:4px 11px;border-radius:99px;}
.pm-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:22px 24px;box-shadow:var(--sh-1);margin-bottom:18px;}
.pm-offre{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);
  padding:18px 20px;margin-bottom:14px;transition:border-color .2s var(--ease),box-shadow .2s var(--ease);}
.pm-offre:hover{border-color:var(--blue);box-shadow:var(--sh-2);}
.pm-offre-phrase{font-size:1rem;line-height:1.6;color:var(--ink);margin:0 0 10px;}
.pm-offre-meta{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;
  font-size:.85rem;color:var(--ink-3);}
.pm-tag-rem{font-weight:600;color:var(--ok);}
.pm-tag-norem{font-weight:600;color:var(--ink-3);}
.pm-form label{display:block;font-family:var(--ui);font-weight:600;font-size:.9rem;
  color:var(--ink-2);margin:14px 0 5px;}
.pm-form input[type=text],.pm-form input[type=email],.pm-form input[type=password],
.pm-form select,.pm-form textarea{width:100%;padding:11px 13px;border:1px solid var(--line);
  border-radius:var(--r-sm);background:var(--paper);color:var(--ink);font-size:1rem;
  font-family:inherit;box-sizing:border-box;}
.pm-form textarea{min-height:90px;resize:vertical;}
.pm-form input:focus,.pm-form select:focus,.pm-form textarea:focus{outline:none;
  border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-tint);}
.pm-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.pm-check{display:flex;align-items:flex-start;gap:9px;margin-top:14px;font-size:.92rem;
  color:var(--ink-2);line-height:1.5;}
.pm-check input{margin-top:3px;flex-shrink:0;}
.pm-filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(160px,100%),1fr));
  gap:10px;background:var(--paper-2);border-radius:var(--r-md);padding:14px;margin-bottom:18px;}
.pm-filters select{padding:9px 11px;font-size:.9rem;}
.pm-count{font-size:.9rem;color:var(--ink-3);margin:0 0 14px;}
.pm-empty{text-align:center;padding:40px 20px;color:var(--ink-3);}
.pm-info{background:var(--blue-tint);border:1px solid var(--blue-soft);border-radius:var(--r-md);
  padding:14px 16px;font-size:.9rem;color:var(--ink-2);line-height:1.55;margin:14px 0;}
.pm-step-list{counter-reset:pm;list-style:none;padding:0;margin:0;}
.pm-step-list li{position:relative;padding:0 0 18px 46px;line-height:1.6;color:var(--ink-2);}
.pm-step-list li::before{counter-increment:pm;content:counter(pm);position:absolute;left:0;top:0;
  width:32px;height:32px;border-radius:99px;background:var(--blue);color:var(--btn-txt,#fff);
  display:grid;place-items:center;font-family:var(--ui);font-weight:700;}
.pm-admin-preview{background:var(--warn-bg);border:1px solid var(--warn);border-radius:var(--r-md);
  padding:10px 14px;font-size:.85rem;color:var(--ink-2);margin-bottom:16px;text-align:center;}
@media(max-width:560px){
  .pm-row{grid-template-columns:1fr;}
  .pm-card{padding:18px 16px;}
  .pm-nav{gap:4px;}
  .pm-nav a{padding:7px 9px;font-size:.82rem;}
}

/* ---- Messagerie permutation (chat interne anonyme) ---- */
/* v9.20 — Chat de permutation (temps réel, mobile + desktop) */
.pm-chat-head{display:flex;align-items:center;justify-content:space-between;gap:12px;
  flex-wrap:wrap;margin-bottom:12px;}
.pm-chat-actions{display:flex;gap:8px;}
.pm-act{font-family:var(--ui);font-size:.8rem;font-weight:600;cursor:pointer;
  padding:6px 12px;border-radius:999px;border:1px solid var(--line);
  background:var(--card);color:var(--ink-3);transition:all .15s var(--ease);}
.pm-act:hover{border-color:var(--blue);color:var(--blue);}
.pm-act-danger:hover{border-color:var(--err);color:var(--err);background:var(--err-bg);}

.pm-chat{display:flex;flex-direction:column;gap:8px;margin-bottom:14px;
  height:min(52vh,440px);overflow-y:auto;padding:10px 4px;
  background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-md);
  scroll-behavior:smooth;overscroll-behavior:contain;}
.pm-chat-empty{margin:auto;text-align:center;color:var(--ink-3);font-size:.9rem;padding:20px;}
.pm-msg{display:flex;align-items:flex-end;gap:6px;max-width:82%;animation:pmIn .18s var(--ease);}
@keyframes pmIn{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}
.pm-msg-me{align-self:flex-end;flex-direction:row-reverse;}
.pm-msg-other{align-self:flex-start;}
.pm-bubble{padding:9px 13px;border-radius:16px;line-height:1.5;word-break:break-word;}
.pm-msg-me .pm-bubble{background:var(--blue);color:var(--btn-txt,#fff);border-bottom-right-radius:5px;}
.pm-msg-other .pm-bubble{background:var(--card);color:var(--ink);border:1px solid var(--line);
  border-bottom-left-radius:5px;}
.pm-msg-body{white-space:pre-wrap;word-wrap:break-word;font-size:.94rem;}
.pm-msg-time{font-size:.66rem;opacity:.75;margin-top:3px;text-align:right;}
.pm-flag{opacity:0;background:none;border:none;cursor:pointer;color:var(--ink-4);
  font-size:.85rem;padding:2px 4px;border-radius:5px;transition:opacity .15s var(--ease),color .15s;}
.pm-msg:hover .pm-flag,.pm-flag:focus{opacity:1;}
.pm-flag:hover{color:var(--err);background:var(--err-bg);}

/* Zone de saisie */
.pm-composer{display:flex;align-items:flex-end;gap:8px;position:relative;
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:8px;}
.pm-composer textarea{flex:1;border:none;background:none;resize:none;outline:none;
  font-family:var(--ui);font-size:.95rem;color:var(--ink);line-height:1.45;
  max-height:140px;padding:6px 4px;}
.pm-composer textarea::placeholder{color:var(--ink-4);}
.pm-emoji-btn,.pm-send{flex:0 0 auto;cursor:pointer;border-radius:50%;width:38px;height:38px;
  display:flex;align-items:center;justify-content:center;font-size:1.15rem;
  transition:all .15s var(--ease);}
.pm-emoji-btn{background:var(--paper-2);border:1px solid var(--line);color:var(--ink-2);}
.pm-emoji-btn:hover{border-color:var(--blue);color:var(--blue);}
.pm-send{background:var(--blue);border:1px solid var(--blue);color:var(--btn-txt,#fff);}
.pm-send:hover{background:var(--blue-deep);border-color:var(--blue-deep);}
.pm-send:disabled{opacity:.5;cursor:default;}
.pm-hint-send{font-size:.72rem;color:var(--ink-4);margin:6px 2px 0;}
.pm-emoji-panel{position:absolute;bottom:56px;left:6px;z-index:30;
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);
  box-shadow:var(--sh-3);padding:8px;display:grid;grid-template-columns:repeat(6,1fr);
  gap:2px;width:236px;max-height:190px;overflow-y:auto;}
/* v9.20.1 — « display:grid » ci-dessus écrasait l'attribut HTML `hidden`
   (dont le display:none par défaut est moins prioritaire). Le panneau
   d'émojis ne doit s'afficher QUE sur clic du bouton ☺. */
.pm-emoji-panel[hidden]{display:none;}
.pm-emoji{background:none;border:none;cursor:pointer;font-size:1.25rem;padding:5px;
  border-radius:7px;line-height:1;}
.pm-emoji:hover{background:var(--paper-2);}

/* Fenêtres modales (signalement / blocage) */
.pm-modal{position:fixed;inset:0;z-index:120;background:rgba(0,0,0,.5);
  display:flex;align-items:center;justify-content:center;padding:16px;}
.pm-modal[hidden]{display:none;}
.pm-modal-box{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--sh-3);padding:22px;max-width:440px;width:100%;max-height:90vh;overflow-y:auto;}
.pm-modal-box h3{margin:0 0 8px;}
.pm-modal-sub{color:var(--ink-2);font-size:.9rem;line-height:1.55;margin:0 0 16px;}
.pm-modal-box label{display:block;font-weight:600;font-size:.88rem;color:var(--ink-2);margin:12px 0 5px;}
.pm-modal-box select,.pm-modal-box textarea{width:100%;box-sizing:border-box;
  border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper-2);
  color:var(--ink);font-family:var(--ui);font-size:.92rem;padding:9px 11px;}
.pm-modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:18px;flex-wrap:wrap;}
.btn-danger{font-family:var(--ui);font-weight:600;cursor:pointer;padding:10px 18px;
  border-radius:var(--r-sm);border:1px solid var(--err);background:var(--err);
  color:#fff;transition:opacity .15s var(--ease);}
.btn-danger:hover{opacity:.88;}

.pm-chat-form textarea{width:100%;box-sizing:border-box;}
.pm-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);}

@media(max-width:640px){
  .pm-chat{height:min(58vh,420px);}
  .pm-msg{max-width:88%;}
  .pm-flag{opacity:1;}            /* pas de survol sur mobile : toujours visible */
  .pm-emoji-panel{width:calc(100vw - 60px);grid-template-columns:repeat(7,1fr);}
  .pm-chat-head{flex-direction:column;align-items:flex-start;gap:8px;}
  .pm-composer{padding:6px;}
  .pm-emoji-btn,.pm-send{width:36px;height:36px;}
}

/* =========================================================================
   v9.18 — AVIS & COMMENTAIRES
   ========================================================================= */
.avis-page{max-width:860px;margin:0 auto;}
.avis-head{margin-bottom:22px;}

/* --- Étoiles (affichage) --- */
.star{color:var(--line);font-size:1.05em;line-height:1;letter-spacing:1px;}
.star.st-full{color:var(--star);}
.star.st-half{position:relative;color:var(--line);}
.star.st-half::before{content:"★";position:absolute;left:0;top:0;width:50%;overflow:hidden;color:var(--star);}
.star.st-empty{color:var(--line);}

/* --- Synthèse de la note --- */
.avis-summary{display:flex;gap:28px;align-items:center;flex-wrap:wrap;
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:24px 26px;box-shadow:var(--sh-1);margin-bottom:24px;}
.avis-score{text-align:center;flex:0 0 auto;min-width:140px;}
.avis-score-num{font-family:var(--display);font-size:3.4rem;font-weight:700;color:var(--blue);line-height:1;}
.avis-score-stars{font-size:1.3rem;margin:6px 0 4px;letter-spacing:2px;}
.avis-score-count{font-size:.85rem;color:var(--ink-3);}
.avis-bars{flex:1;min-width:220px;display:flex;flex-direction:column;gap:7px;}
.avis-bar-row{display:flex;align-items:center;gap:10px;font-size:.82rem;color:var(--ink-3);}
.avis-bar-label{flex:0 0 42px;display:flex;align-items:center;gap:3px;color:var(--ink-2);font-weight:500;}
.avis-bar-track{flex:1;height:9px;background:var(--paper-2);border-radius:6px;overflow:hidden;}
.avis-bar-fill{display:block;height:100%;background:linear-gradient(90deg,var(--star),var(--star-deep));border-radius:6px;transition:width .5s var(--ease);}
.avis-bar-val{flex:0 0 26px;text-align:right;color:var(--ink-3);}

/* --- Bandeau porte obligatoire --- */
.avis-gate-note{background:var(--blue-tint);border:1px solid var(--blue-soft);
  border-radius:var(--r-lg);padding:22px 24px;margin-bottom:24px;}
.avis-gate-note h1{margin:6px 0 12px;}
.avis-gate-note p{color:var(--ink-2);line-height:1.6;margin:0 0 8px;font-family:var(--read);}

/* --- Formulaire d'avis --- */
.avis-form-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:24px 26px;box-shadow:var(--sh-1);margin-bottom:30px;}
.avis-form-title{font-size:1.3rem;margin-bottom:4px;}
.avis-form-sub{font-size:.88rem;margin:0 0 18px;line-height:1.5;}
.avis-form{display:flex;flex-direction:column;gap:18px;}
.avis-rate{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.avis-rate-label{font-weight:600;color:var(--ink-2);font-size:.95rem;}
.stars-input{display:flex;gap:4px;}
.star-btn{background:none;border:none;cursor:pointer;font-size:2rem;line-height:1;
  color:var(--line);padding:0 2px;transition:transform .1s var(--ease),color .1s var(--ease);}
.star-btn:hover{transform:scale(1.15);}
.star-btn.is-on{color:var(--star);}
.stars-hint{font-size:.85rem;color:var(--ink-3);font-weight:500;min-height:1em;}
.avis-field{display:flex;flex-direction:column;gap:6px;}
.avis-field>span{font-weight:600;color:var(--ink-2);font-size:.92rem;}
.avis-textarea{resize:vertical;min-height:100px;font-family:var(--read);line-height:1.55;}
.avis-count{font-size:.76rem;color:var(--ink-4);text-align:right;}
.avis-form-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center;}

/* --- CTA pour visiteurs sans clé --- */
.avis-cta-locked{background:var(--paper-2);border:1px dashed var(--line);border-radius:var(--r-md);
  padding:18px 22px;margin-bottom:28px;display:flex;align-items:center;justify-content:space-between;
  gap:16px;flex-wrap:wrap;}
.avis-cta-locked p{margin:0;color:var(--ink-2);font-size:.92rem;}

/* --- Liste --- */
.avis-list-head{display:flex;align-items:center;justify-content:space-between;gap:14px;
  flex-wrap:wrap;margin:10px 0 16px;}
.avis-sort{display:flex;gap:4px;background:var(--paper-2);border-radius:999px;padding:3px;}
.avis-sort a{font-size:.8rem;font-weight:600;color:var(--ink-3);padding:6px 13px;border-radius:999px;
  transition:all .15s var(--ease);}
.avis-sort a.is-active{background:var(--card);color:var(--blue);box-shadow:var(--sh-1);}
.avis-list{display:flex;flex-direction:column;gap:14px;}
.avis-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);
  padding:18px 20px;box-shadow:var(--sh-1);}
.avis-card-top{display:flex;align-items:center;gap:12px;}
.avis-avatar{flex:0 0 42px;width:42px;height:42px;border-radius:50%;
  background:var(--blue);color:var(--btn-txt,#fff);display:flex;align-items:center;justify-content:center;
  font-family:var(--display);font-weight:600;font-size:1.15rem;}
.avis-who{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px;}
.avis-name{font-size:.98rem;color:var(--ink);display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.avis-lastinit{color:var(--ink-3);font-weight:500;}
.avis-badge-you{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  background:var(--blue-soft);color:var(--blue);padding:2px 7px;border-radius:5px;}
.avis-role{font-size:.8rem;color:var(--ink-3);}
.avis-date{font-size:.78rem;color:var(--ink-4);flex:0 0 auto;}
.avis-card-stars{font-size:1.05rem;letter-spacing:1px;margin:10px 0 8px;}
.avis-comment{font-family:var(--read);color:var(--ink-2);line-height:1.6;margin:0 0 12px;
  white-space:normal;word-break:break-word;}
.avis-card-foot{display:flex;align-items:center;gap:12px;}
.avis-like{display:inline-flex;align-items:center;gap:7px;background:var(--paper-2);
  border:1px solid var(--line);border-radius:999px;padding:6px 14px;cursor:pointer;
  font-family:var(--ui);font-size:.82rem;font-weight:600;color:var(--ink-3);
  transition:all .15s var(--ease);}
.avis-like:hover{border-color:var(--err);color:var(--err);}
.avis-like-ico{font-size:1rem;line-height:1;transition:transform .15s var(--ease);}
.avis-like.is-liked{background:var(--err-bg);border-color:var(--err);color:var(--err);}
.avis-like.is-liked .avis-like-ico{transform:scale(1.1);}
.avis-like-count{min-width:14px;text-align:center;font-variant-numeric:tabular-nums;}
.avis-like.pulse .avis-like-ico{animation:likePulse .32s var(--ease);}
@keyframes likePulse{0%{transform:scale(1);}45%{transform:scale(1.45);}100%{transform:scale(1.1);}}

.avis-empty{text-align:center;padding:40px 20px;background:var(--card);border:1px dashed var(--line);
  border-radius:var(--r-md);color:var(--ink-3);}
.avis-empty-ico{font-size:2.4rem;color:var(--line);margin-bottom:8px;}
.avis-back-public{margin-top:26px;text-align:center;}

/* --- Admin : filtres, table, boutons --- */
.avis-admin-filters{display:flex;gap:4px;background:var(--paper-2);border-radius:999px;padding:3px;
  width:fit-content;margin-bottom:16px;}
.avis-admin-filters a{font-size:.82rem;font-weight:600;color:var(--ink-3);padding:6px 14px;
  border-radius:999px;transition:all .15s var(--ease);}
.avis-admin-filters a.is-active{background:var(--card);color:var(--blue);box-shadow:var(--sh-1);}
.avis-admin-table td.nowrap{white-space:nowrap;}
.avis-admin-comment{max-width:320px;font-family:var(--read);line-height:1.5;color:var(--ink-2);}
.avis-admin-actions{display:flex;flex-direction:column;gap:6px;}
.avis-admin-actions form{margin:0;}
.avis-row-hidden{opacity:.55;}
.tag-ok{color:var(--ok);font-weight:600;white-space:nowrap;font-size:.82rem;}
.tag-warn{color:var(--warn);font-weight:600;white-space:nowrap;font-size:.82rem;}
.btn-mini{font-family:var(--ui);font-size:.78rem;font-weight:600;cursor:pointer;
  padding:5px 11px;border-radius:7px;border:1px solid var(--line);background:var(--card);
  color:var(--ink-2);white-space:nowrap;transition:all .15s var(--ease);width:100%;}
.btn-mini:hover{border-color:var(--blue);color:var(--blue);}
.btn-mini-ok{border-color:var(--ok);color:var(--ok);}
.btn-mini-ok:hover{background:var(--ok-bg);}
.btn-mini-danger{border-color:var(--err);color:var(--err);}
.btn-mini-danger:hover{background:var(--err-bg);}

/* --- Mobile --- */
@media(max-width:640px){
  .avis-summary{gap:18px;padding:20px;}
  .avis-score{min-width:110px;flex:1;}
  .avis-score-num{font-size:2.8rem;}
  .avis-form-card,.avis-gate-note{padding:18px 16px;}
  .star-btn{font-size:1.9rem;}
  .avis-card{padding:16px;}
  .avis-list-head{flex-direction:column;align-items:flex-start;}
  .avis-admin-comment{max-width:180px;}
}

/* v9.19 — Permutation : bloc « Commencer la permutation » */
.pm-start{border-color:var(--blue-soft);}
.pm-start-state{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px;}
.pm-chip{display:inline-flex;align-items:center;gap:6px;font-size:.82rem;font-weight:600;
  padding:6px 12px;border-radius:999px;background:var(--paper-2);color:var(--ink-3);
  border:1px solid var(--line);}
.pm-chip-on{background:var(--ok-bg);color:var(--ok);border-color:var(--ok);}
.pm-linkbtn{background:none;border:none;padding:0;color:var(--blue);font-weight:600;
  cursor:pointer;font-family:var(--ui);font-size:.9rem;text-decoration:underline;}
.pm-linkbtn:hover{color:var(--blue-deep);}

/* v9.20 — Admin : signalements */
.sig-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-bottom:6px;}
.sig-box{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:14px 16px;}
.sig-label{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-4);
  font-weight:700;margin-bottom:5px;}
.sig-val{font-weight:600;color:var(--ink);font-size:1rem;word-break:break-word;}
.sig-chat{display:flex;flex-direction:column;gap:10px;background:var(--paper-2);
  border:1px solid var(--line);border-radius:var(--r-md);padding:14px;max-height:520px;overflow-y:auto;}
.sig-msg{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:11px 14px;}
.sig-msg.is-flagged{border-color:var(--err);background:var(--err-bg);box-shadow:0 0 0 1px var(--err);}
.sig-msg-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px;font-size:.84rem;}
.sig-msg-head time{margin-left:auto;color:var(--ink-4);font-size:.76rem;}
.sig-tag-vise{font-size:.7rem;font-weight:700;background:var(--warn-bg);color:var(--warn);
  padding:2px 7px;border-radius:5px;}
.sig-tag-flag{font-size:.7rem;font-weight:700;background:var(--err-bg);color:var(--err);
  padding:2px 7px;border-radius:5px;}
.sig-msg-body{color:var(--ink-2);line-height:1.55;white-space:pre-wrap;word-break:break-word;font-family:var(--read);}
.sig-actions{display:flex;gap:16px;align-items:flex-start;flex-wrap:wrap;margin-bottom:24px;}
.sig-form{flex:1;min-width:260px;}
.sig-form label{display:block;font-weight:600;font-size:.88rem;color:var(--ink-2);margin-bottom:5px;}
.sig-form textarea{width:100%;box-sizing:border-box;border:1px solid var(--line);
  border-radius:var(--r-sm);background:var(--card);color:var(--ink);padding:9px 11px;
  font-family:var(--ui);font-size:.92rem;resize:vertical;}
.sig-btns{margin-top:10px;}
.sig-danger{border:1px solid var(--err);border-radius:var(--r-md);padding:18px;
  background:var(--err-bg);margin-top:8px;}
.sig-danger label{display:block;font-weight:600;font-size:.88rem;color:var(--ink-2);margin:10px 0 5px;}
@media(max-width:640px){
  .sig-actions{flex-direction:column;}
  .sig-msg-head time{margin-left:0;width:100%;}
}

/* v9.20.1 — Aperçu du premier message (page « Je suis intéressé ») */
.pm-chat-preview{height:auto;min-height:110px;max-height:240px;margin-bottom:14px;}
.pm-chat-preview .pm-msg[hidden]{display:none;}

/* v9.20.2 — Bulle en cours d'envoi (affichage optimiste) */
.pm-msg-sending{opacity:.6;}
.pm-msg-sending .pm-msg-time::after{content:" · envoi…";font-size:.9em;}

/* v9.21 — Pastille « messages non lus » (permutation).
   Le texte utilise --btn-txt : sur les thèmes clairs c'est du blanc, sur les
   thèmes sombres (où --err est un rouge clair) c'est du noir — ce qui garde
   un contraste conforme dans les deux cas. */
.pm-unread{display:inline-flex;align-items:center;gap:5px;margin-left:7px;
  background:var(--err);color:var(--btn-txt,#fff);font-size:.72rem;font-weight:700;
  padding:2px 9px;border-radius:999px;line-height:1.5;white-space:nowrap;
  vertical-align:middle;}
.pm-unread::before{content:"●";font-size:.6em;line-height:1;}
.pm-nav a.pm-has-unread{color:var(--ink);font-weight:700;}
.pm-offre-unread{border-color:var(--err);box-shadow:0 0 0 1px var(--err);}
@media(max-width:640px){
  .pm-unread{font-size:.68rem;padding:2px 7px;margin-left:5px;}
}


/* =========================================================================
   v9.23 — JEUX PÉDAGOGIQUES
   Uniquement des variables de thème (compatible avec les 13 thèmes).
   Style sobre et académique. Boutons larges, lisibles au doigt.
   ========================================================================= */

/* --- Liste des jeux --- */
.jeux-intro{background:var(--blue-tint);border:1px solid var(--blue-soft);
  border-radius:var(--r-md);padding:16px 18px;margin-bottom:22px;}
.jeux-intro p{margin:0;color:var(--ink-2);line-height:1.6;font-size:.95rem;}
.jeux-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;}
.jeu-card{display:flex;flex-direction:column;gap:8px;background:var(--card);
  border:1px solid var(--line);border-radius:var(--r-lg);padding:18px 20px;
  box-shadow:var(--sh-1);text-decoration:none;transition:border-color .15s var(--ease),
  box-shadow .15s var(--ease),transform .15s var(--ease);}
.jeu-card:hover{border-color:var(--blue);box-shadow:var(--sh-2);transform:translateY(-2px);}
.jeu-card-top{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.jeu-ico{font-size:1.9rem;line-height:1;}
.jeu-comp{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  background:var(--blue-soft);color:var(--blue-deep);padding:3px 9px;border-radius:999px;text-align:right;}
.jeu-titre{font-family:var(--display);font-size:1.15rem;color:var(--ink);margin:2px 0 0;}
.jeu-obj{color:var(--ink-2);font-size:.88rem;line-height:1.55;margin:0;flex:1;}
.jeu-card-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;
  border-top:1px solid var(--line-soft);padding-top:10px;margin-top:4px;flex-wrap:wrap;}
.jeu-stat{font-size:.78rem;color:var(--ink-3);}
.jeu-stat-neuf{font-style:italic;color:var(--ink-4);}
.jeu-go{font-size:.85rem;font-weight:600;color:var(--blue);}

/* --- Page de présentation --- */
.jeu-hero{display:flex;align-items:center;gap:16px;margin-bottom:22px;}
.jeu-hero-ico{font-size:3rem;line-height:1;}
.jeu-bloc{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:20px 22px;margin-bottom:16px;box-shadow:var(--sh-1);}
.jeu-bloc-titre{font-family:var(--display);font-size:1.1rem;color:var(--ink);margin:0 0 10px;}
.jeu-bloc-txt{color:var(--ink-2);line-height:1.65;margin:0;font-size:.97rem;}
.jeu-bloc-note{color:var(--ink-3);font-size:.87rem;line-height:1.55;margin:12px 0 0;}
.jeu-etapes{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px;}
.jeu-etapes li{display:flex;align-items:flex-start;gap:11px;color:var(--ink-2);
  line-height:1.55;font-size:.95rem;}
.jeu-etape-num{flex:0 0 26px;width:26px;height:26px;border-radius:50%;background:var(--blue);
  color:var(--btn-txt,#fff);display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:.82rem;}
.jeu-stats-row{display:flex;gap:14px;flex-wrap:wrap;}
.jeu-stats-row>div{flex:1;min-width:110px;background:var(--paper-2);border-radius:var(--r-md);
  padding:12px;text-align:center;}
.jeu-stats-row strong{display:block;font-family:var(--display);font-size:1.5rem;color:var(--blue);}
.jeu-stats-row span{font-size:.76rem;color:var(--ink-3);}
.jeu-start-zone{text-align:center;padding:12px 0 30px;}
.jeu-btn-start{font-size:1.05rem;padding:14px 30px;}

/* --- Cadre commun de partie --- */
.jeu-hud{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px;}
.jeu-hud-item{flex:1;min-width:82px;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-md);padding:9px 12px;text-align:center;}
.jeu-hud-val{display:block;font-family:var(--display);font-size:1.25rem;color:var(--blue);font-weight:600;}
.jeu-hud-lab{display:block;font-size:.7rem;color:var(--ink-3);text-transform:uppercase;letter-spacing:.03em;}
.jeu-hud-danger .jeu-hud-val{color:var(--err);}
.jeu-plateau{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:20px;box-shadow:var(--sh-1);}
.jeu-question{font-family:var(--read);font-size:1.05rem;color:var(--ink);line-height:1.6;
  margin:16px 0 14px;white-space:pre-wrap;word-break:break-word;}
.jeu-options{display:flex;flex-direction:column;gap:9px;}
.jeu-option{display:block;width:100%;text-align:left;font-family:var(--ui);font-size:.96rem;
  line-height:1.5;color:var(--ink);background:var(--paper-2);border:2px solid var(--line);
  border-radius:var(--r-md);padding:13px 15px;cursor:pointer;
  transition:border-color .15s var(--ease),background .15s var(--ease);}
.jeu-option:hover:enabled{border-color:var(--blue);background:var(--card);}
.jeu-aide{font-size:.85rem;color:var(--ink-3);margin:10px 0 0;text-align:center;}
.jeu-message{margin-top:14px;padding:12px 15px;border-radius:var(--r-md);
  background:var(--paper-2);border:1px solid var(--line);color:var(--ink-2);
  font-size:.93rem;line-height:1.55;}
.jeu-msg-ok{background:var(--ok-bg);border-color:var(--ok);color:var(--ok);font-weight:600;}
.jeu-msg-ko{background:var(--err-bg);border-color:var(--err);color:var(--err);}
.jeu-actions-bas{text-align:center;margin-top:16px;}

/* --- 1. Memory --- */
.mem-grille{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.mem-carte{min-height:104px;border:2px solid var(--line);border-radius:var(--r-md);
  background:var(--blue);cursor:pointer;padding:9px;display:flex;align-items:center;
  justify-content:center;transition:all .18s var(--ease);}
.mem-carte:hover:enabled{transform:translateY(-2px);box-shadow:var(--sh-2);}
.mem-dos{font-size:1.7rem;color:var(--btn-txt,#fff);font-weight:700;}
.mem-face,.mem-ouverte{background:var(--paper-2);border-color:var(--blue);}
.mem-ouverte{background:var(--ok-bg);border-color:var(--ok);}
.mem-attente{background:var(--paper-2);border-color:var(--blue);}
.mem-txt{font-size:.76rem;line-height:1.35;color:var(--ink);text-align:center;
  max-height:88px;overflow:hidden;}

/* --- 4. Reconstruis la phrase --- */
.rec-zone{min-height:74px;border:2px dashed var(--line);border-radius:var(--r-md);
  padding:12px;display:flex;flex-wrap:wrap;gap:7px;align-items:flex-start;
  background:var(--paper-2);margin-bottom:16px;}
.rec-vide{color:var(--ink-4);font-size:.88rem;font-style:italic;}
.rec-dispo{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:16px;}
.rec-bloc{font-family:var(--read);font-size:.93rem;padding:9px 13px;border-radius:var(--r-sm);
  border:1px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer;
  transition:all .15s var(--ease);}
.rec-bloc:hover{border-color:var(--blue);color:var(--blue);}
.rec-place{background:var(--blue-soft);border-color:var(--blue);color:var(--blue-deep);font-weight:500;}
.rec-actions{text-align:center;}
.rec-solution{margin-top:14px;padding:13px;background:var(--ok-bg);border:1px solid var(--ok);
  border-radius:var(--r-md);color:var(--ink-2);line-height:1.6;font-size:.93rem;}

/* --- 5. Gagnez votre place --- */
.mil-echelle{display:flex;flex-direction:column-reverse;gap:3px;margin-bottom:16px;}
.mil-palier{font-size:.76rem;padding:5px 11px;border-radius:var(--r-sm);
  background:var(--paper-2);color:var(--ink-4);border:1px solid transparent;}
.mil-franchi{background:var(--ok-bg);color:var(--ok);font-weight:600;}
.mil-courant{background:var(--blue-soft);color:var(--blue-deep);font-weight:700;
  border-color:var(--blue);}
.mil-garanti{border-left:3px solid var(--warn);}
.mil-aides{display:flex;flex-direction:column;gap:8px;margin-top:16px;}
.jeu-aide-btn{font-family:var(--ui);font-size:.88rem;font-weight:600;padding:11px 14px;
  border-radius:var(--r-md);border:1px solid var(--line);background:var(--paper-2);
  color:var(--ink-2);cursor:pointer;text-align:left;}
.jeu-aide-btn:hover:enabled{border-color:var(--blue);color:var(--blue);}
.jeu-aide-btn:disabled{opacity:.45;cursor:default;}
.jeu-aide-stop{border-color:var(--warn);color:var(--warn);}

/* --- 6. Course contre la montre --- */
.chrono-barre{height:11px;background:var(--paper-2);border-radius:6px;overflow:hidden;
  margin-bottom:6px;}
.chrono-fill{height:100%;background:var(--blue);border-radius:6px;transition:width 1s linear;}

/* --- 8. Ascension --- */
.asc-echelle{display:flex;flex-direction:column;gap:3px;margin-bottom:14px;}
.asc-barreau{font-size:.78rem;padding:6px 12px;border-radius:var(--r-sm);
  background:var(--paper-2);color:var(--ink-4);}
.asc-franchi{background:var(--ok-bg);color:var(--ok);}
.asc-ici{background:var(--blue);color:var(--btn-txt,#fff);font-weight:700;}

/* --- Résultat --- */
.jeu-fin-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:34px 26px;text-align:center;box-shadow:var(--sh-2);max-width:520px;margin:0 auto;}
.jeu-fin-ico{font-size:3.4rem;line-height:1;margin-bottom:8px;}
.jeu-fin-score{font-family:var(--display);font-size:3rem;color:var(--blue);margin:0;line-height:1;}
.jeu-fin-detail{color:var(--ink-2);margin:8px 0 4px;font-weight:600;}
.jeu-fin-msg{color:var(--ink-2);line-height:1.6;margin:10px 0 20px;}
.jeu-fin-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;}

/* --- Page verrouillée --- */
.jeux-argu{list-style:none;margin:14px 0;padding:0;display:flex;flex-direction:column;gap:9px;}
.jeux-argu li{color:var(--ink-2);line-height:1.55;font-size:.93rem;padding-left:20px;position:relative;}
.jeux-argu li::before{content:"✓";position:absolute;left:0;color:var(--ok);font-weight:700;}

/* --- Administration --- */
.jeux-admin-table td.jeu-nom{font-weight:600;color:var(--ink);}
.jeux-admin-table .jeu-nom small{display:block;font-weight:400;color:var(--ink-3);
  font-size:.78rem;margin-top:2px;}
.jeu-switch{display:inline-flex;align-items:center;gap:6px;}
.jeu-switch form{margin:0;}
.jeu-toggle{font-family:var(--ui);font-size:.76rem;font-weight:700;cursor:pointer;
  padding:5px 11px;border-radius:999px;border:1px solid var(--line);white-space:nowrap;}
.jeu-toggle-on{background:var(--ok-bg);border-color:var(--ok);color:var(--ok);}
.jeu-toggle-off{background:var(--paper-2);border-color:var(--line);color:var(--ink-4);}
.jeu-global{display:flex;align-items:center;justify-content:space-between;gap:16px;
  flex-wrap:wrap;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-lg);padding:18px 20px;margin-bottom:20px;}

/* --- Mobile --- */
@media(max-width:640px){
  .jeux-grid{grid-template-columns:1fr;}
  .jeu-plateau{padding:15px 13px;}
  .jeu-hero-ico{font-size:2.4rem;}
  .jeu-bloc{padding:16px 15px;}
  .mem-grille{grid-template-columns:repeat(2,1fr);gap:8px;}
  .mem-carte{min-height:92px;}
  .mem-txt{font-size:.72rem;max-height:76px;}
  .jeu-hud-item{min-width:70px;padding:7px 9px;}
  .jeu-hud-val{font-size:1.05rem;}
  .jeu-fin-card{padding:26px 18px;}
  .jeu-fin-score{font-size:2.5rem;}
}

/* --- Le grand tri --- */
.tri-item{font-family:var(--read);font-size:1rem;line-height:1.6;color:var(--ink);
  background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-md);
  padding:16px 18px;margin:12px 0 16px;text-align:center;}
.tri-colonnes{display:grid;grid-template-columns:1fr 1fr;gap:11px;}
.tri-colonne{display:flex;flex-direction:column;align-items:center;gap:7px;
  padding:16px 13px;border:2px solid var(--line);border-radius:var(--r-md);
  background:var(--card);cursor:pointer;transition:all .15s var(--ease);min-height:96px;
  justify-content:center;}
.tri-colonne:hover{border-color:var(--blue);background:var(--blue-tint);}
.tri-col-num{font-family:var(--display);font-size:1.5rem;font-weight:700;color:var(--blue);}
.tri-col-titre{font-size:.84rem;line-height:1.4;color:var(--ink-2);text-align:center;font-weight:600;}


/* =========================================================================
   v9.26 — MISE EN AVANT DES AVIS
   Sobre et discret : la preuve sociale ne doit jamais gêner la lecture ni
   retarder l'accès au contenu. Uniquement des variables de thème.
   ========================================================================= */

/* --- Section sur la page d'accueil publique --- */
.une-section{border-top:1px solid var(--line-soft);padding-top:30px;}
.une-entete{display:flex;align-items:center;gap:22px;flex-wrap:wrap;
  justify-content:center;text-align:center;margin-bottom:22px;}
.une-note{display:flex;align-items:baseline;gap:5px;flex-wrap:wrap;justify-content:center;}
.une-note-val{font-family:var(--display);font-size:2.6rem;font-weight:700;color:var(--blue);
  line-height:1;}
.une-note-max{font-size:1rem;color:var(--ink-3);}
.une-etoiles{margin-left:8px;font-size:1.05rem;letter-spacing:1px;white-space:nowrap;}
.une-texte{text-align:left;}
.une-sous{color:var(--ink-3);font-size:.9rem;margin:5px 0 0;line-height:1.5;}

.une-grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:15px;}
.une-carte{margin:0;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-lg);padding:18px 20px;box-shadow:var(--sh-1);
  display:flex;flex-direction:column;gap:11px;}
.une-carte-note{font-size:.95rem;letter-spacing:1px;line-height:1;}
.une-carte-txt{margin:0;font-family:var(--read);font-size:.92rem;line-height:1.6;
  color:var(--ink-2);flex:1;}
.une-carte-txt::before{content:"« ";color:var(--ink-4);}
.une-carte-txt::after{content:" »";color:var(--ink-4);}
.une-carte-sign{display:flex;align-items:center;gap:9px;
  border-top:1px solid var(--line-soft);padding-top:11px;}
.une-carte-sign strong{display:block;font-size:.87rem;color:var(--ink);}
.une-carte-sign small{display:block;font-size:.76rem;color:var(--ink-3);}
.une-avatar{flex:0 0 32px;width:32px;height:32px;border-radius:50%;background:var(--blue);
  color:var(--btn-txt,#fff);display:flex;align-items:center;justify-content:center;
  font-family:var(--display);font-weight:600;font-size:.9rem;}
.une-lien{text-align:center;margin:20px 0 0;}
.une-lien a{font-size:.9rem;font-weight:600;color:var(--blue);}

/* --- Encart discret dans l'espace membre --- */
.une-encart{margin-top:34px;padding-top:20px;border-top:1px solid var(--line-soft);}
.une-encart-tete{display:flex;align-items:baseline;justify-content:space-between;
  gap:12px;flex-wrap:wrap;margin-bottom:12px;}
.une-encart-titre{font-size:.8rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.05em;color:var(--ink-4);}
.une-encart-tete a{font-size:.82rem;font-weight:600;color:var(--blue);}
.une-encart-liste{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:13px;}
.une-encart-item{background:var(--paper-2);border:1px solid var(--line-soft);
  border-radius:var(--r-md);padding:14px 16px;}
.une-encart-item p{margin:7px 0 8px;font-family:var(--read);font-size:.87rem;
  line-height:1.55;color:var(--ink-2);}
.une-encart-sign{font-size:.76rem;color:var(--ink-3);}

/* --- Mobile : empilement, rien ne déborde --- */
@media(max-width:640px){
  .une-section{padding-top:24px;}
  .une-entete{flex-direction:column;gap:10px;}
  .une-texte{text-align:center;}
  .une-note-val{font-size:2.2rem;}
  .une-grille{grid-template-columns:1fr;gap:12px;}
  .une-carte{padding:15px 16px;}
  .une-encart-liste{grid-template-columns:1fr;}
}

/* =========================================================================
   v9.27 — PAGE D'ACCUEIL : HABILLAGE VISUEL
   Illustrations SVG pilotées par la couleur du thème (currentColor), fond
   qui respire, repères visuels, animation d'entrée discrète.
   Aucune couleur figée, aucune image, aucune dépendance JavaScript.
   ========================================================================= */

/* --- Base commune des illustrations --- */
.ill{display:block;width:100%;height:auto;color:var(--blue);}
.ill-hero{max-width:250px;margin:0 auto;}
.ill-zone{width:42px;height:42px;}
.ill-cle{width:42px;height:42px;}
.ill-repere{width:21px;height:21px;flex:0 0 21px;}
.ill-sceau{width:19px;height:19px;flex:0 0 19px;color:var(--ok);}
.ill-feat{width:31px;height:31px;}
.ill-quote{width:24px;height:auto;color:var(--ink-4);opacity:.5;}

/* --- Bloc d'introduction : un fond qui respire ---------------------------
   Deux halos très légers, dessinés en CSS (aucune image à télécharger).
   Sur un navigateur qui ne gère pas les dégradés radiaux, le fond reste
   simplement uni : la page demeure lisible. */
.hero{position:relative;padding-top:14px;}
.hero::before{
  content:"";position:absolute;z-index:-1;left:50%;top:-40px;
  /* Jamais plus large que le conteneur : au-delà, le halo créerait un
     défilement horizontal sur petit écran (constaté en test à 390 px). */
  width:min(620px,100%);height:340px;transform:translateX(-50%);
  background:
    radial-gradient(closest-side, var(--blue-tint), transparent 72%),
    radial-gradient(closest-side, var(--blue-soft), transparent 68%);
  background-position:30% 30%, 72% 62%;
  background-size:62% 62%, 52% 52%;
  background-repeat:no-repeat;
  opacity:.85;pointer-events:none;
}
.hero-ill{margin:0 auto 16px;max-width:250px;}

/* v9.30 — Le "+" du graphique devient un curseur qu'on peut attraper.
   touch-action:none empêche le geste de faire défiler la page pendant qu'on
   glisse dessus (mobile). Aucune dimension du SVG n'est modifiée ici. */
.ill-progress{touch-action:none;}
#ip-handle{cursor:grab;}
#ip-handle:active{cursor:grabbing;}
.hero-accent{color:var(--blue);}

/* v9.29 — Barre de couleur décorative : glisser change la couleur du bloc
   d'accroche (eyebrow + titre + sous-titre) ; se fige au relâchement.
   Purement visuel — n'affecte ni la navigation ni le contenu du site.
   Placée juste sous le sous-titre. */
.hero-colorbar{max-width:320px;margin:22px auto 4px;}
.hero-colorbar input[type=range]{
  width:100%;height:6px;-webkit-appearance:none;appearance:none;
  background:linear-gradient(90deg,var(--blue),#e63946,#f4a300,#2a9d5c,#8e44ad,#e07a3f,var(--blue));
  border-radius:3px;outline:none;cursor:pointer;}
.hero-colorbar input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;width:22px;height:22px;border-radius:50%;
  background:#fff;border:3px solid var(--ink-2);cursor:pointer;
  box-shadow:0 2px 6px rgba(20,30,40,.18);}
.hero-colorbar input[type=range]::-moz-range-thumb{
  width:22px;height:22px;border-radius:50%;background:#fff;
  border:3px solid var(--ink-2);cursor:pointer;box-shadow:0 2px 6px rgba(20,30,40,.18);}
.hero-colorbar-hint{font-size:.76rem;color:var(--ink-3);text-align:center;margin:8px 0 0;}

/* v9.29 — Ce que contient le programme : grille 2×2, cartes cliquables
   → ancre #essayer (même destination que les liens .feat plus bas sur la
   page). Icônes ill_feature(), déjà utilisées ailleurs : cohérence visuelle. */
.hero-content-grid{list-style:none;display:grid;grid-template-columns:1fr 1fr;
  gap:8px;margin:24px auto 0;padding:0;max-width:380px;}
.hero-content-grid li{display:flex;}
.hero-content-grid a{display:flex;align-items:center;justify-content:center;gap:7px;
  width:100%;text-decoration:none;white-space:nowrap;
  background:var(--card);border:1px solid var(--line);border-radius:999px;
  padding:7px 14px 7px 9px;box-shadow:var(--sh-1);
  transition:border-color .18s var(--ease),transform .18s var(--ease);}
.hero-content-grid a:hover{border-color:var(--blue);transform:translateY(-2px);}
.hero-content-grid svg{width:18px;height:18px;flex:0 0 18px;color:var(--blue);}
.hero-content-grid span{font-size:.8rem;font-weight:600;color:var(--ink-2);}
@media (max-width:480px){
  .hero-content-grid{max-width:320px;gap:7px;}
  .hero-content-grid a{padding:6px 10px 6px 8px;}
  .hero-content-grid svg{width:16px;height:16px;flex:0 0 16px;}
  .hero-content-grid span{font-size:.74rem;}
}

/* Mention officielle : autorité rendue visible d'un coup d'œil */
.hero-officiel{display:inline-flex;align-items:center;gap:9px;text-align:left;
  background:var(--ok-bg);border:1px solid var(--ok);border-radius:999px;
  padding:8px 16px;margin:20px auto 20px;max-width:520px;}
.hero-officiel span{font-size:.83rem;line-height:1.45;color:var(--ink-2);}

.hero-amorce{font-size:.85rem;color:var(--ink-3);margin:12px 0 0;}

/* --- Cartes des espaces --- */
.zone-ill{display:block;margin-bottom:10px;}
.zone-card{transition:border-color .18s var(--ease),box-shadow .18s var(--ease),
  transform .18s var(--ease);}
.zone-card:hover{border-color:var(--blue);box-shadow:var(--sh-2);transform:translateY(-3px);}

/* --- Bloc de la clé --- */
.keycard{position:relative;}
.keycard-ill{margin:0 auto 14px;width:42px;}

/* --- Témoignages : guillemet décoratif --- */
.une-quote{display:block;margin-bottom:-4px;}

/* --- « Ce que vous y trouverez » : cartes avec plus de présence --- */
/* v9.27.1 — Les cartes sont des liens : un clic ramène en haut, vers le
   choix de l'espace. Le défilement est natif (aucun JavaScript requis). */
.feat{display:block;text-decoration:none;background:var(--card);
  border:1px solid var(--line);border-radius:var(--r-lg);
  padding:20px 18px;box-shadow:var(--sh-1);cursor:pointer;
  transition:border-color .18s var(--ease),box-shadow .18s var(--ease),
  transform .18s var(--ease);}
.feat:hover{border-color:var(--blue);box-shadow:var(--sh-2);transform:translateY(-3px);}
.feat:hover h3{color:var(--blue);}
.feat h3{transition:color .18s var(--ease);}
.feat-ico{display:inline-flex;align-items:center;justify-content:center;
  width:52px;height:52px;border-radius:var(--r-md);background:var(--blue-tint);
  margin-bottom:12px;}

/* --- Animation d'entrée : discrète, purement décorative -------------------
   Le contenu est visible même si l'animation ne se joue pas (vieux appareil,
   JavaScript lent) : on n'anime que l'opacité et un léger décalage. */
@keyframes heroApparait{
  from{opacity:0;transform:translateY(10px);}
  to  {opacity:1;transform:none;}
}
.anim-1,.anim-2,.anim-3,.anim-4,.anim-5{
  animation:heroApparait .5s var(--ease) both;
}
.anim-1{animation-delay:.02s;}
.anim-2{animation-delay:.10s;}
.anim-3{animation-delay:.18s;}
.anim-4{animation-delay:.26s;}
.anim-5{animation-delay:.34s;}
.hero-ill{animation:heroApparait .6s var(--ease) both;}

/* Respect du réglage système « réduire les animations » : rien ne bouge,
   et le contenu reste évidemment visible. */
@media (prefers-reduced-motion: reduce){
  .anim-1,.anim-2,.anim-3,.anim-4,.anim-5,.hero-ill{animation:none;}
  .zone-card:hover,.feat:hover{transform:none;}
}

/* --- Mobile --- */
@media(max-width:640px){
  .hero::before{height:250px;top:-24px;}
  .hero-ill,.ill-hero{max-width:190px;}
  .hero-officiel{border-radius:var(--r-md);padding:10px 14px;}
  .feat{padding:17px 15px;}
  .feat-ico{width:46px;height:46px;}
  .ill-feat{width:27px;height:27px;}
}

/* ---------- v9.32 — Pièges des QCM ---------- */
.astuces-head{max-width:var(--measure);margin-bottom:34px;}
.astuces-title{font-family:var(--display);font-size:2rem;color:var(--blue-deep);
  margin:6px 0 12px;line-height:1.2;}
.astuces-sub{font-family:var(--read);font-size:1.06rem;line-height:1.7;color:var(--ink-2);margin:0;}

.astuces-section{margin-bottom:38px;max-width:var(--measure);}
.astuces-section-title{font-family:var(--display);font-size:1.28rem;color:var(--ink-2);
  margin:0 0 16px;padding-bottom:9px;border-bottom:1px solid var(--line);}

.astuce-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:22px 26px;margin-bottom:16px;box-shadow:var(--sh-1);}
.astuce-card h3{font-family:var(--display);font-size:1.14rem;color:var(--blue-deep);
  margin:0 0 10px;line-height:1.35;}
.astuce-chapo{font-family:var(--read);font-size:1.02rem;line-height:1.7;color:var(--ink);margin:0;}
.astuce-chapo + .astuce-points{margin-top:14px;}

.astuce-points{list-style:none;margin:0;padding:0;}
.astuce-points li{font-family:var(--read);font-size:1rem;line-height:1.7;color:var(--ink-2);
  padding:9px 0 9px 18px;border-left:2px solid var(--blue-soft);margin-bottom:2px;}
.astuce-points li:last-child{margin-bottom:0;}
.astuce-points li strong{font-family:var(--ui);font-size:.94rem;font-weight:600;color:var(--blue);}

.astuces-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:8px;max-width:var(--measure);}

@media (max-width:680px){
  .astuces-title{font-size:1.6rem;}
  .astuce-card{padding:18px 18px;}
  .astuce-points li{padding-left:14px;}
}

/* ==========================================================================
   v9.35 — TRAFIC WEB (analytics interne)
   Aucune couleur en dur : tout passe par les variables de thème, donc
   l'ensemble reste lisible sur les 13 thèmes sans règle dédiée.
   ========================================================================== */

/* Icônes SVG au trait, alignées sur la ligne de texte */
.ico{display:inline-block;vertical-align:-.18em;flex:none;}

/* ---------- En-tête de page ---------- */
.t-head{display:flex;gap:18px;align-items:flex-start;flex-wrap:wrap;justify-content:space-between;}
.t-head-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;}
.t-tabs{display:inline-flex;background:var(--paper-2);border:1px solid var(--line);
  border-radius:99px;padding:3px;gap:2px;}
.t-tabs a{font-family:var(--ui);font-size:.82rem;font-weight:600;color:var(--ink-3);
  padding:6px 14px;border-radius:99px;text-decoration:none;transition:all .18s var(--ease);}
.t-tabs a:hover{color:var(--blue);}
.t-tabs a.is-active{background:var(--card);color:var(--blue);box-shadow:var(--sh-1);}

/* ---------- Cartes d'indicateurs ---------- */
.t-kpis{display:grid;gap:14px;margin-bottom:22px;
  grid-template-columns:repeat(auto-fit,minmax(178px,1fr));}
.t-kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);
  padding:16px 18px;display:flex;flex-direction:column;gap:4px;position:relative;
  transition:border-color .18s var(--ease),transform .18s var(--ease);}
.t-kpi:hover{border-color:var(--blue);transform:translateY(-1px);}
.t-kpi-ico{position:absolute;top:14px;right:14px;color:var(--ink-4);opacity:.7;}
.t-kpi strong{font-family:var(--display);font-size:1.85rem;font-weight:600;color:var(--blue);
  line-height:1.1;letter-spacing:-.01em;}
.t-kpi strong.t-kpi-sm{font-size:1.12rem;line-height:1.3;}
.t-kpi-lbl{font-family:var(--ui);font-size:.78rem;color:var(--ink-3);}
.t-live{display:flex;align-items:center;gap:8px;}

.t-trend{font-family:var(--ui);font-size:.72rem;font-weight:700;letter-spacing:.02em;
  display:inline-block;margin-top:2px;}
.t-trend-up{color:var(--ok);}
.t-trend-down{color:var(--err);}
.t-trend-flat{color:var(--ink-4);font-weight:600;}

/* ---------- Panneaux ---------- */
.t-panel{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);
  padding:20px 22px;margin-bottom:22px;}
.t-panel-quiet{background:var(--paper-2);}
.t-panel-title{font-family:var(--display);font-size:1.08rem;font-weight:600;color:var(--ink);
  display:flex;align-items:center;gap:9px;margin:0 0 16px;}
.t-panel-title .ico{color:var(--blue);}
.t-panel-note{font-size:.85rem;margin:-8px 0 16px;}
.t-alert{display:flex;gap:11px;align-items:flex-start;}

/* ---------- Graphique SVG ---------- */
.tg-wrap{position:relative;}
.tg{width:100%;height:190px;display:block;overflow:visible;}
.tg-grid{stroke:var(--line-soft);stroke-width:1;vector-effect:non-scaling-stroke;}
.tg-line{fill:none;stroke:var(--blue);stroke-width:2.2;stroke-linejoin:round;
  stroke-linecap:round;vector-effect:non-scaling-stroke;}
.tg-s1{stop-color:var(--blue);stop-opacity:.26;}
.tg-s2{stop-color:var(--blue);stop-opacity:0;}
.tg-dot{fill:var(--card);stroke:var(--blue);stroke-width:2;vector-effect:non-scaling-stroke;}
.tg-hit{fill:transparent;cursor:pointer;}
.tg-hit:hover + .tg-dot{fill:var(--blue);}
.tg-lbl{font-family:var(--ui);font-size:11px;fill:var(--ink-4);}
.tg-max{font-size:.75rem;text-align:right;margin-top:2px;}

/* ---------- Barres horizontales (top pages, tunnel) ---------- */
.t-bars,.t-funnel{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px;}
.t-bar-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  font-family:var(--ui);font-size:.87rem;margin-bottom:5px;}
.t-bar-lbl{color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.t-bar-val{font-weight:700;color:var(--blue);flex:none;}
.t-bar-track{height:7px;background:var(--paper-2);border-radius:99px;overflow:hidden;}
.t-bar-fill{height:100%;background:var(--blue);border-radius:99px;
  transition:width .5s var(--ease);}
.t-bar-sub{font-size:.74rem;margin-top:4px;}

/* ---------- Répartitions compactes ---------- */
.t-split{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px;}
.t-split li{display:flex;align-items:center;gap:11px;font-family:var(--ui);font-size:.86rem;}
.t-split-lbl{flex:1;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.t-split-bar{flex:0 0 84px;height:6px;background:var(--paper-2);border-radius:99px;overflow:hidden;}
.t-split-bar i{display:block;height:100%;background:var(--blue);border-radius:99px;}
.t-split-val{flex:none;font-weight:700;color:var(--ink-2);font-variant-numeric:tabular-nums;}

/* ---------- Tunnel ---------- */
.t-funnel{counter-reset:none;}
.t-funnel-head{display:flex;align-items:center;gap:10px;font-family:var(--ui);
  font-size:.87rem;margin-bottom:5px;}
.t-funnel-step{flex:none;width:21px;height:21px;border-radius:50%;background:var(--blue-soft);
  color:var(--blue);font-size:.72rem;font-weight:700;display:grid;place-items:center;}
.t-funnel-lbl{flex:1;color:var(--ink-2);}
.t-funnel-val{font-weight:700;color:var(--blue);}

/* ---------- Journal ---------- */
.t-filters{display:flex;gap:9px;flex-wrap:wrap;align-items:center;}
.t-route{font-size:.72rem;font-family:ui-monospace,"SF Mono",Menlo,monospace;
  margin-top:2px;word-break:break-all;}
.t-sess{font-family:ui-monospace,"SF Mono",Menlo,monospace;font-size:.8rem;
  color:var(--blue);text-decoration:none;border-bottom:1px dotted var(--blue);}
.t-nowrap{white-space:nowrap;}
.t-pager{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:16px;
  font-family:var(--ui);font-size:.82rem;}

/* ---------- Chronologie d'une session ---------- */
.t-timeline{list-style:none;margin:0;padding:0 0 0 4px;}
.t-timeline li{display:flex;gap:14px;padding:0 0 16px 18px;position:relative;
  border-left:2px solid var(--line);}
.t-timeline li:last-child{border-left-color:transparent;padding-bottom:0;}
.t-timeline li::before{content:"";position:absolute;left:-6px;top:5px;width:10px;height:10px;
  border-radius:50%;background:var(--card);border:2px solid var(--blue);}
.t-tl-time{flex:none;font-family:ui-monospace,"SF Mono",Menlo,monospace;font-size:.76rem;
  color:var(--ink-4);padding-top:1px;}
.t-tl-body{display:flex;flex-direction:column;gap:2px;min-width:0;}
.t-tl-page{font-family:var(--ui);font-size:.88rem;color:var(--ink-2);font-weight:600;}

/* ---------- Adaptation mobile ---------- */
@media (max-width:900px){
  .t-panel{padding:17px 16px;}
}
@media (max-width:760px){
  .t-head{flex-direction:column;}
  .t-head-actions{width:100%;}
  .t-tabs{flex:1;justify-content:center;}
  .t-kpis{grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:11px;}
  .t-kpi{padding:14px 15px;}
  .t-kpi strong{font-size:1.5rem;}
  .t-kpi-ico{top:12px;right:12px;}
  .tg{height:168px;}

  /* Le tableau devient une pile de fiches : plus lisible qu'un défilement
     horizontal sur un écran de téléphone. */
  .t-table{border:none;background:none;overflow:visible;}
  .t-table table,.t-table tbody,.t-table tr,.t-table td{display:block;width:100%;}
  .t-table thead{display:none;}
  .t-table tr{background:var(--card);border:1px solid var(--line);
    border-radius:var(--r-md);padding:12px 14px;margin-bottom:11px;}
  .t-table td{border:none!important;padding:4px 0;display:flex;gap:12px;
    justify-content:space-between;align-items:baseline;}
  .t-table td::before{content:attr(data-lbl);font-size:.72rem;font-weight:700;
    color:var(--ink-4);text-transform:uppercase;letter-spacing:.04em;flex:none;}
  .t-table td:nth-child(2){flex-direction:column;align-items:stretch;gap:3px;}
  .t-split-bar{flex-basis:60px;}
  .t-timeline li{flex-direction:column;gap:3px;}
}

/* =========================================================================
   v9.43 — TRAFIC WEB : nouveaux composants
   Aucune couleur en dur : tout passe par les variables de thème, pour rester
   lisible sur les 13 thèmes sans règle dupliquée.
   ========================================================================= */

/* Badge secondaire : information de moindre certitude (durée estimée). */
.badge-soft{background:var(--paper-2);color:var(--ink-3);border-color:var(--line);}

/* Sous-titre à l'intérieur d'un panneau. */
.t-sub{font-family:var(--ui);font-size:.82rem;font-weight:700;color:var(--ink-3);
  text-transform:uppercase;letter-spacing:.04em;margin:18px 0 10px;}

/* Petits indicateurs groupés (bloc « visiteurs sans clé »). */
.t-mini-kpis{display:flex;flex-wrap:wrap;gap:14px;margin:4px 0 6px;}
.t-mini{flex:1 1 140px;background:var(--paper-2);border:1px solid var(--line-soft);
  border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:3px;}
.t-mini strong{font-size:1.28rem;color:var(--ink);line-height:1.15;}
.t-mini span{font-family:var(--ui);font-size:.78rem;}

/* Liste des visiteurs présents en ce moment. */
.t-live-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
.t-live-list li{display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  font-family:var(--ui);font-size:.85rem;padding-bottom:10px;
  border-bottom:1px solid var(--line-soft);}
.t-live-list li:last-child{border-bottom:0;padding-bottom:0;}
.t-live-page{font-weight:600;color:var(--ink);}

/* Légende du graphique comparant les espaces. */
.t-legend{display:flex;flex-wrap:wrap;gap:16px;margin-bottom:10px;
  font-family:var(--ui);font-size:.8rem;color:var(--ink-3);}
.t-leg{display:inline-flex;align-items:center;gap:7px;}
.t-leg::before{content:"";width:16px;height:3px;border-radius:99px;background:currentColor;}
.t-leg-0{color:var(--blue);}
.t-leg-1{color:var(--ok);}
.t-leg-2{color:var(--warn);}

/* Courbes multiples : une teinte par espace, cohérente avec la légende. */
.tg-line-0{stroke:var(--blue);}
.tg-line-1{stroke:var(--ok);}
.tg-line-2{stroke:var(--warn);}

/* Carte de chaleur jour × heure. */
.t-heat{overflow-x:auto;}
.t-heat-grid{display:grid;grid-template-columns:auto repeat(24, minmax(13px, 1fr));
  gap:3px;align-items:center;min-width:520px;}
.t-heat-corner{display:block;}
.t-heat-hour{font-family:var(--ui);font-size:.66rem;color:var(--ink-4);text-align:center;}
.t-heat-day{font-family:var(--ui);font-size:.72rem;color:var(--ink-3);
  padding-right:8px;text-align:right;}
.t-heat-cell{display:block;aspect-ratio:1;border-radius:3px;background:var(--paper-2);
  border:1px solid var(--line-soft);}
.t-heat-cell:focus-visible{outline:2px solid var(--blue);outline-offset:1px;}
.t-heat-0{background:var(--paper-2);}
.t-heat-1{background:var(--blue-soft);}
.t-heat-2{background:var(--blue-soft);filter:brightness(.94);}
.t-heat-3{background:var(--blue);opacity:.62;}
.t-heat-4{background:var(--blue);}
.t-heat-legend{display:flex;align-items:center;gap:5px;margin-top:12px;
  font-family:var(--ui);font-size:.74rem;}
.t-heat-legend .t-heat-cell{width:13px;height:13px;aspect-ratio:auto;}

@media (max-width:640px){
  .t-mini{flex-basis:calc(50% - 7px);}
  .t-live-list li{font-size:.8rem;}
}

/* =========================================================================
   v9.44 — TRAFIC WEB : navigation par onglets, accents et blocs repliables
   Toutes les couleurs viennent des variables de thème (--blue, --ok, --warn,
   --err) : l'apparence suit automatiquement les 13 thèmes, sans règle
   dupliquée ni teinte figée.
   ========================================================================= */

/* ---- Accents : une teinte fonctionnelle par famille d'information ---- */
.t-acc-blue{--acc:var(--blue); --acc-bg:var(--blue-soft); --acc-tint:var(--blue-tint);}
.t-acc-ok  {--acc:var(--ok);   --acc-bg:var(--ok-bg);    --acc-tint:var(--ok-bg);}
.t-acc-warn{--acc:var(--warn); --acc-bg:var(--warn-bg);  --acc-tint:var(--warn-bg);}
.t-acc-err {--acc:var(--err);  --acc-bg:var(--err-bg);   --acc-tint:var(--err-bg);}

/* ---- Barre d'onglets ---- */
.t-nav{display:flex;gap:6px;flex-wrap:wrap;margin:20px 0 18px;padding:5px;
  background:var(--paper-2);border:1px solid var(--line-soft);border-radius:var(--r-lg);
  position:sticky;top:0;z-index:20;backdrop-filter:blur(6px);}
.t-nav-item{display:inline-flex;align-items:center;gap:9px;padding:10px 16px;
  border-radius:var(--r-md);font-family:var(--ui);font-size:.87rem;font-weight:600;
  color:var(--ink-3);text-decoration:none;border:1px solid transparent;
  transition:background .18s var(--ease),color .18s var(--ease),border-color .18s var(--ease);}
.t-nav-item:hover{color:var(--ink);background:var(--card);}
.t-nav-item.is-active{background:var(--card);color:var(--acc);
  border-color:var(--acc-bg);box-shadow:var(--sh-1);}
.t-nav-ico{display:inline-flex;color:var(--acc);opacity:.75;}
.t-nav-item.is-active .t-nav-ico{opacity:1;}
.t-nav-badge{display:inline-flex;align-items:center;justify-content:center;
  min-width:20px;height:20px;padding:0 6px;border-radius:99px;
  background:var(--err);color:#fff;font-size:.7rem;font-weight:700;}

/* ---- Pastille d'icône colorée en tête de panneau ---- */
.t-pico{display:inline-flex;align-items:center;justify-content:center;
  width:32px;height:32px;border-radius:10px;flex:none;
  background:var(--acc-bg,var(--blue-soft));color:var(--acc,var(--blue));}
.t-panel-title{display:flex;align-items:center;gap:11px;flex-wrap:wrap;}

/* Filet coloré à gauche du panneau : repère visuel au défilement. */
.t-panel.t-acc-blue,.t-panel.t-acc-ok,.t-panel.t-acc-warn,.t-panel.t-acc-err{
  border-left:3px solid var(--acc);}

/* ---- Indicateurs clés : icône en pastille colorée ---- */
.t-kpi .t-kpi-ico{display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:11px;
  background:var(--acc-bg,var(--blue-soft));color:var(--acc,var(--blue));}

/* ---- Blocs repliables ---- */
.t-fold{background:var(--card);border:1px solid var(--line);border-left:3px solid var(--acc,var(--blue));
  border-radius:var(--r-lg);margin-bottom:16px;box-shadow:var(--sh-1);overflow:hidden;}
.t-fold > summary{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding:16px 20px;cursor:pointer;list-style:none;font-family:var(--ui);
  transition:background .16s var(--ease);}
.t-fold > summary::-webkit-details-marker{display:none;}
.t-fold > summary:hover{background:var(--paper-2);}
.t-fold > summary::after{content:"▾";margin-left:auto;color:var(--ink-4);
  font-size:.9rem;transition:transform .2s var(--ease);}
.t-fold[open] > summary::after{transform:rotate(180deg);}
.t-fold[open] > summary{border-bottom:1px solid var(--line-soft);}
.t-fold-lbl{font-size:.98rem;font-weight:700;color:var(--ink);}
.t-fold-sum{font-size:.82rem;color:var(--ink-3);}
.t-fold-body{padding:18px 20px 20px;}
.t-fold summary:focus-visible{outline:2px solid var(--acc,var(--blue));outline-offset:-2px;}

/* Sous-panneau à l'intérieur d'un bloc replié (répartitions). */
.t-sub-panel{background:var(--paper-2);border:1px solid var(--line-soft);
  border-radius:var(--r-md);padding:15px 16px;}
.t-sub-panel .t-sub{display:flex;align-items:center;gap:7px;margin:0 0 12px;}

/* ---- Pagination d'un bloc ---- */
.t-pager{display:flex;align-items:center;justify-content:center;gap:14px;
  flex-wrap:wrap;margin-top:16px;padding-top:14px;border-top:1px solid var(--line-soft);
  font-family:var(--ui);font-size:.83rem;}
.btn-mini.is-off{opacity:.4;cursor:default;pointer-events:none;}

/* ---- Suppression manuelle des données ---- */
.t-purge{margin-top:18px;padding:16px;background:var(--warn-bg);
  border:1px solid var(--line);border-radius:var(--r-md);}
.t-purge .t-sub{margin-top:0;}
.t-purge-opts{display:flex;flex-direction:column;gap:8px;margin:14px 0 16px;}
.t-purge-opt{display:flex;align-items:center;gap:11px;padding:10px 13px;
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-sm);
  font-family:var(--ui);font-size:.85rem;cursor:pointer;
  transition:border-color .16s var(--ease);}
.t-purge-opt:hover{border-color:var(--warn);}
.t-purge-opt.is-empty{opacity:.5;cursor:default;}
.t-purge-opt.is-empty:hover{border-color:var(--line);}
.t-purge-lbl{flex:1;color:var(--ink);}
.t-purge-n{color:var(--ink-2);}
.t-purge-n strong{color:var(--err);}
.t-purge-form .btn-mini-danger{width:100%;justify-content:center;}

@media (max-width:640px){
  .t-nav{position:static;padding:4px;}
  .t-nav-item{padding:9px 12px;font-size:.8rem;flex:1 1 auto;justify-content:center;}
  .t-nav-lbl{display:none;}
  .t-nav-item.is-active .t-nav-lbl{display:inline;}
  .t-fold > summary{padding:14px 15px;}
  .t-fold-body{padding:15px;}
  .t-purge-opt{flex-wrap:wrap;gap:6px;}
}

/* ==========================================================================
   v9.47 — ONGLET « ISPITS AU MAROC »
   Refonte : définition, missions, changement de dénomination (loi 59.24),
   chiffres clés, tableau instituts/annexes, filières et options.
   Aucune couleur en dur : tout passe par les variables, donc les 13 thèmes
   restent valides. Responsive : le tableau devient une pile de cartes sous
   720px (les en-têtes sont réinjectés via data-label).
   ========================================================================== */

/* Gêne à la copie, en renfort du garde global .guard-on. Rappel honnête :
   cela dissuade, cela n'empêche pas (inspecteur, source, capture d'écran). */
.isp-page{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;
  user-select:none;-webkit-touch-callout:none;}
.isp-page *::selection{background:transparent;}
.isp-page *::-moz-selection{background:transparent;}

.isp-page{max-width:960px;}
.isp-ico{width:20px;height:20px;flex:0 0 20px;display:block;}
.isp-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);
  clip-path:inset(50%);white-space:nowrap;}
.isp-src{font-family:var(--ui);font-size:.78rem;color:var(--ink-3);line-height:1.55;
  margin:10px 0 30px;font-style:italic;}

/* ---------------------------- Définition ---------------------------- */
.isp-def{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--blue);
  border-radius:var(--r-md);padding:24px 26px;margin-bottom:26px;box-shadow:var(--sh-1);}
.isp-def-head{display:flex;align-items:center;gap:11px;margin-bottom:14px;color:var(--blue);}
.isp-def-head h2{font-size:1.28rem;margin:0;color:var(--ink);}
.isp-def-head .isp-ico{width:24px;height:24px;flex:0 0 24px;}
.isp-lead{font-family:var(--read);font-size:1.03rem;line-height:1.72;color:var(--ink-2);
  margin-bottom:20px;}
.isp-lead strong{color:var(--ink);font-weight:600;}

.isp-def-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));
  gap:12px;margin-bottom:20px;}
.isp-def-item{background:var(--blue-tint);border:1px solid var(--line-soft);
  border-radius:var(--r-sm);padding:13px 15px;display:flex;flex-direction:column;gap:3px;}
.isp-lbl{font-family:var(--ui);font-size:.72rem;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-3);}
.isp-val{font-family:var(--ui);font-size:.95rem;font-weight:600;color:var(--ink);}

.isp-cycles{list-style:none;padding:0;margin:0 0 18px;display:flex;flex-wrap:wrap;gap:10px;}
.isp-cycles li{display:flex;align-items:center;gap:9px;background:var(--card);
  border:1px solid var(--line);border-radius:99px;padding:7px 16px 7px 7px;
  font-family:var(--ui);font-size:.9rem;font-weight:600;color:var(--ink-2);}
.isp-cy-n{width:23px;height:23px;flex:0 0 23px;border-radius:50%;background:var(--blue);
  color:var(--btn-txt,#fff);display:flex;align-items:center;justify-content:center;
  font-size:.76rem;font-weight:700;}
.isp-note-int{font-family:var(--read);font-size:.94rem;line-height:1.7;color:var(--ink-2);
  margin:0;padding-top:16px;border-top:1px dashed var(--line);}

/* --------------------- Changement de dénomination --------------------- */
.isp-renom{background:var(--warn-bg);border:1px solid var(--line);border-radius:var(--r-md);
  padding:24px 26px;margin-bottom:30px;}
.isp-renom-head{display:flex;align-items:center;gap:11px;flex-wrap:wrap;margin-bottom:18px;
  color:var(--warn);}
.isp-renom-head h2{font-size:1.2rem;margin:0;color:var(--ink);}
.isp-renom-head .isp-ico{width:23px;height:23px;flex:0 0 23px;}

.isp-swap{display:grid;grid-template-columns:1fr auto 1fr;align-items:stretch;gap:14px;
  margin-bottom:20px;}
.isp-swap-box{background:var(--card);border:1px solid var(--line);border-radius:var(--r-sm);
  padding:15px 17px;display:flex;flex-direction:column;gap:7px;}
.isp-swap-box p{margin:0;font-family:var(--read);font-size:.97rem;line-height:1.55;
  color:var(--ink-2);}
.isp-swap-box strong{color:var(--ink);font-weight:600;}
.isp-swap-tag{font-family:var(--ui);font-size:.7rem;font-weight:700;letter-spacing:.07em;
  text-transform:uppercase;}
.isp-swap-old{opacity:.82;}
.isp-swap-old .isp-swap-tag{color:var(--ink-3);}
.isp-swap-old p{text-decoration:line-through;text-decoration-color:var(--ink-4);
  text-decoration-thickness:1px;}
.isp-swap-new{border-color:var(--ok);box-shadow:var(--sh-1);}
.isp-swap-new .isp-swap-tag{color:var(--ok);}
.isp-swap-arrow{display:flex;align-items:center;justify-content:center;color:var(--ink-3);}
.isp-swap-arrow .isp-ico{width:26px;height:26px;flex:0 0 26px;}

.isp-renom-def,.isp-renom-why{font-family:var(--read);font-size:.96rem;line-height:1.72;
  color:var(--ink-2);margin-bottom:12px;}
.isp-renom-def strong,.isp-renom-why strong{color:var(--ink);font-weight:600;}
.isp-renom .isp-src{margin-bottom:0;}

/* ---------------------------- Chiffres clés ---------------------------- */
.isp-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(150px,100%),1fr));
  gap:12px;margin-bottom:34px;}
.isp-kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);
  padding:17px 15px;display:flex;flex-direction:column;align-items:center;gap:3px;
  text-align:center;box-shadow:var(--sh-1);transition:border-color .18s var(--ease),
  transform .18s var(--ease);}
.isp-kpi:hover{border-color:var(--blue);transform:translateY(-2px);}
.isp-kpi .isp-ico{color:var(--blue);margin-bottom:5px;}
.isp-kpi b{font-family:var(--display);font-size:1.85rem;font-weight:600;color:var(--blue);
  line-height:1;}
.isp-kpi span{font-family:var(--ui);font-size:.79rem;color:var(--ink-3);line-height:1.35;}

/* ------------------------------ Missions ------------------------------ */
.isp-miss-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(250px,100%),1fr));
  gap:14px;margin-bottom:6px;}
.isp-miss{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);
  padding:19px 20px;box-shadow:var(--sh-1);transition:border-color .18s var(--ease),
  box-shadow .18s var(--ease);}
.isp-miss:hover{border-color:var(--blue);box-shadow:var(--sh-2);}
.isp-miss-ico{width:38px;height:38px;border-radius:var(--r-sm);background:var(--blue-soft);
  color:var(--blue);display:flex;align-items:center;justify-content:center;margin-bottom:12px;}
.isp-miss h3{font-size:1.02rem;margin:0 0 6px;color:var(--ink);}
.isp-miss p{font-family:var(--read);font-size:.92rem;line-height:1.62;color:var(--ink-2);
  margin:0;}

/* ------------------------- Tableau instituts ------------------------- */
.isp-tbl-intro{font-family:var(--ui);font-size:.93rem;color:var(--ink-2);margin-bottom:14px;}
.isp-tbl-intro strong{color:var(--blue);font-weight:700;}
.isp-table-wrap{border:1px solid var(--line);border-radius:var(--r-md);background:var(--card);
  overflow:hidden;margin-bottom:34px;box-shadow:var(--sh-1);}
.isp-table{width:100%;border-collapse:collapse;font-family:var(--ui);font-size:.9rem;}
.isp-table thead th{background:var(--paper-2);color:var(--ink-3);font-size:.73rem;
  font-weight:700;letter-spacing:.06em;text-transform:uppercase;text-align:left;
  padding:12px 15px;border-bottom:1px solid var(--line);}
.isp-table tbody td{padding:13px 15px;border-bottom:1px solid var(--line-soft);
  color:var(--ink-2);vertical-align:middle;}
.isp-table tbody tr:last-child td{border-bottom:none;}
.isp-table tbody tr{transition:background .15s var(--ease);}
.isp-table tbody tr:hover{background:var(--blue-tint);}
.isp-c-n{width:52px;color:var(--ink-4);font-variant-numeric:tabular-nums;}
.isp-c-nb{width:92px;text-align:center;}
.isp-c-mere{display:flex;align-items:center;gap:8px;font-weight:600;color:var(--ink);}
.isp-c-mere .isp-ico{width:17px;height:17px;flex:0 0 17px;color:var(--blue);}
.isp-ann-list{display:flex;flex-wrap:wrap;gap:6px;}
.isp-ann{background:var(--blue-soft);color:var(--blue);border-radius:99px;padding:3px 11px;
  font-size:.82rem;font-weight:600;}
.isp-none{color:var(--ink-4);font-style:italic;font-size:.85rem;}
.isp-count{display:inline-flex;align-items:center;justify-content:center;min-width:26px;
  height:26px;padding:0 7px;border-radius:99px;background:var(--blue);color:var(--btn-txt,#fff);
  font-size:.82rem;font-weight:700;}
.isp-count.is-zero{background:var(--paper-2);color:var(--ink-4);}
.isp-table tfoot td{background:var(--paper-2);padding:13px 15px;font-weight:700;
  color:var(--ink);border-top:1px solid var(--line);font-size:.87rem;}

/* --------------------------- Filières --------------------------- */
.isp-fil-list{display:flex;flex-direction:column;gap:10px;margin-bottom:6px;}
.isp-fil{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;transition:border-color .18s var(--ease);}
.isp-fil[open]{border-color:var(--blue);box-shadow:var(--sh-1);}
.isp-fil > summary{display:flex;align-items:center;gap:11px;padding:15px 18px;cursor:pointer;
  font-family:var(--ui);list-style:none;}
.isp-fil > summary::-webkit-details-marker{display:none;}
.isp-fil > summary:hover{background:var(--blue-tint);}
.isp-fil-ico{width:32px;height:32px;flex:0 0 32px;border-radius:var(--r-sm);
  background:var(--blue-soft);color:var(--blue);display:flex;align-items:center;
  justify-content:center;}
.isp-fil-ico .isp-ico{width:17px;height:17px;flex:0 0 17px;}
.isp-fil-nom{flex:1;font-size:1rem;font-weight:600;color:var(--ink);line-height:1.35;}
.isp-fil-nb{font-size:.78rem;font-weight:700;color:var(--blue);background:var(--blue-soft);
  border-radius:99px;padding:4px 11px;white-space:nowrap;}
.isp-opts{margin:0;padding:4px 18px 18px 18px;list-style:none;counter-reset:isp-o;}
.isp-opts li{counter-increment:isp-o;position:relative;padding:9px 0 9px 38px;
  font-family:var(--read);font-size:.94rem;line-height:1.6;color:var(--ink-2);
  border-top:1px solid var(--line-soft);}
.isp-opts li::before{content:counter(isp-o);position:absolute;left:0;top:9px;width:25px;
  height:25px;border-radius:50%;background:var(--paper-2);color:var(--ink-3);
  font-family:var(--ui);font-size:.74rem;font-weight:700;display:flex;align-items:center;
  justify-content:center;}

/* ------------------------------ Mobile ------------------------------ */
@media (max-width:720px){
  .isp-swap{grid-template-columns:1fr;gap:10px;}
  .isp-swap-arrow{transform:rotate(90deg);}

  /* Le tableau devient une pile de cartes lisibles au pouce. */
  .isp-table-wrap{border:none;background:none;box-shadow:none;overflow:visible;}
  .isp-table,.isp-table tbody,.isp-table tr,.isp-table td{display:block;width:100%;}
  .isp-table thead{position:absolute;width:1px;height:1px;overflow:hidden;
    clip:rect(0 0 0 0);clip-path:inset(50%);}
  .isp-table tbody tr{background:var(--card);border:1px solid var(--line);
    border-radius:var(--r-md);margin-bottom:10px;padding:6px 4px;box-shadow:var(--sh-1);}
  .isp-table tbody tr:hover{background:var(--card);}
  .isp-table tbody td{border-bottom:1px solid var(--line-soft);padding:10px 14px;
    display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:right;}
  .isp-table tbody td:last-child{border-bottom:none;}
  .isp-table tbody td::before{content:attr(data-label);font-size:.7rem;font-weight:700;
    letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);text-align:left;
    flex:0 0 auto;}
  .isp-c-n,.isp-c-nb{width:auto;text-align:right;}
  .isp-c-mere{justify-content:flex-end;}
  .isp-ann-list{justify-content:flex-end;}
  .isp-table tfoot{display:block;}
  .isp-table tfoot tr{display:block;background:var(--paper-2);border:1px solid var(--line);
    border-radius:var(--r-md);}
  .isp-table tfoot td{display:flex;justify-content:space-between;gap:12px;
    border-bottom:1px solid var(--line-soft);}
  .isp-table tfoot td:last-child{border-bottom:none;}
  .isp-table tfoot td::before{content:attr(data-label);font-size:.7rem;font-weight:700;
    letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);}

  .isp-def,.isp-renom{padding:19px 17px;}
  .isp-def-head h2{font-size:1.14rem;}
  .isp-kpi b{font-size:1.5rem;}
  .isp-fil > summary{flex-wrap:wrap;padding:13px 15px;}
  .isp-fil-nom{flex:1 1 100%;order:3;}
  .isp-opts{padding:4px 15px 15px;}
}

@media (max-width:420px){
  .isp-kpis{grid-template-columns:repeat(2,1fr);}
  .isp-cycles li{width:100%;}
}

/* Respect du réglage système « moins d'animations ». */
@media (prefers-reduced-motion:reduce){
  .isp-kpi,.isp-miss,.isp-fil,.isp-table tbody tr{transition:none;}
  .isp-kpi:hover{transform:none;}
}

/* ==========================================================================
   v9.49 — DÉTECTION DE PARTAGE DE CLÉ : score composite (admin)
   Uniquement des variables de thème : aucune couleur littérale.
   ========================================================================== */

/* Bandeau de synthèse par niveau */
.sc-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(150px,100%),1fr));
  gap:10px;margin-bottom:18px;}
.sc-sum{background:var(--card);border:1px solid var(--line);border-left-width:4px;
  border-radius:var(--r-md);padding:13px 15px;display:flex;flex-direction:column;gap:2px;}
.sc-sum b{font-family:var(--display);font-size:1.6rem;line-height:1;color:var(--ink);}
.sc-sum span{font-family:var(--ui);font-size:.78rem;color:var(--ink-3);}
.sc-sum.sc-fort{border-left-color:var(--err);}
.sc-sum.sc-fort b{color:var(--err);}
.sc-sum.sc-moyen{border-left-color:var(--warn);}
.sc-sum.sc-moyen b{color:var(--warn);}
.sc-sum.sc-faible{border-left-color:var(--line);}
.sc-sum.sc-faible b{color:var(--ink-3);}

/* Liseré de niveau sur la fiche de clé */
.share-card.sc-fort{border-left:4px solid var(--err);}
.share-card.sc-moyen{border-left:4px solid var(--warn);}
.share-card.sc-faible{border-left:4px solid var(--line);}

/* Badge de score */
.sc-badge{font-family:var(--ui);font-size:.78rem;font-weight:700;border-radius:99px;
  padding:5px 12px;white-space:nowrap;border:1px solid transparent;}
.sc-badge.sc-fort{background:var(--err-bg,var(--card));color:var(--err);border-color:var(--err);}
.sc-badge.sc-moyen{background:var(--warn-bg,var(--card));color:var(--warn);border-color:var(--warn);}
.sc-badge.sc-faible{background:var(--paper-2);color:var(--ink-3);border-color:var(--line);}

/* Détail des signaux */
.sc-signals{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px;padding:0;}
.sc-signals li{display:flex;align-items:baseline;gap:6px;background:var(--paper-2);
  border:1px solid var(--line-soft);border-radius:var(--r-sm);padding:7px 12px;
  font-family:var(--ui);font-size:.82rem;color:var(--ink-3);}
.sc-signals li b{font-size:1rem;font-weight:700;color:var(--ink);}
.sc-signals li.is-hot{background:var(--warn-bg,var(--paper-2));border-color:var(--warn);}
.sc-signals li.is-hot b{color:var(--warn);}

/* Appareil déduit */
.sc-dev{font-family:var(--ui);font-size:.82rem;font-weight:600;color:var(--ink-2);
  white-space:nowrap;}

/* Aide à la lecture */
.sc-help{margin:22px 0 14px;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-md);overflow:hidden;}
.sc-help > summary{padding:13px 16px;cursor:pointer;font-family:var(--ui);
  font-weight:600;font-size:.9rem;color:var(--ink-2);}
.sc-help > summary:hover{background:var(--paper-2);}
.sc-help-body{padding:2px 16px 16px;border-top:1px solid var(--line-soft);}
.sc-help-body p{font-family:var(--read);font-size:.9rem;line-height:1.65;
  color:var(--ink-2);margin:11px 0 0;}

@media (max-width:720px){
  .sc-summary{grid-template-columns:repeat(3,1fr);}
  .sc-sum{padding:10px;}
  .sc-sum b{font-size:1.3rem;}
  .sc-sum span{font-size:.7rem;}
  .sc-signals li{flex:1 1 calc(50% - 8px);}
  .share-head{flex-wrap:wrap;gap:8px;}
}

/* ==========================================================================
   v9.51 — PROFIL DU CANDIDAT & RÉACTIONS
   Écrit uniquement avec les variables de thème (--paper, --card, --ink,
   --line, --blue, --ok, --err, --star, --sh-*, --r-*) : les 13 thèmes
   s'appliquent sans une seule règle spécifique par thème.
   ========================================================================== */

/* ---------- Réactions : j'aime / j'adore / favori ---------- */
/* Le conteneur .lesson-wrap rend les boutons FRÈRES du lien de la card :
   un <button> imbriqué dans un <a> serait invalide et rendrait le clic ambigu. */
.lesson-wrap{position:relative;}
.lesson-wrap .lesson{padding-right:240px;}     /* place réservée aux icônes + libellés */
.lesson-wrap .rx{position:absolute;right:14px;top:50%;transform:translateY(-50%);}

.rx{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.reader-head .rx,.fiche header .rx{margin-top:14px;}

/* Variante compacte : icône + compteur sur une ligne, LIBELLÉ EN DESSOUS.
   Une icône seule ne dit pas laquelle est « j'aime » et laquelle « favoris » :
   le mot est donc toujours écrit. */
.rx-btn{display:inline-flex;flex-direction:column;align-items:center;gap:3px;
  min-height:34px;padding:6px 10px;border-radius:var(--r-md);cursor:pointer;
  font-family:var(--ui);font-size:.82rem;font-weight:600;line-height:1;
  background:var(--card);color:var(--ink-3);border:1px solid var(--line);
  transition:border-color .18s var(--ease),color .18s var(--ease),background .18s var(--ease);}
.rx-btn:hover{border-color:var(--blue);color:var(--blue);}
.rx-btn:disabled{opacity:.55;cursor:default;}
.rx-haut{display:inline-flex;align-items:center;gap:5px;}
.rx-ico{font-size:1rem;line-height:1;}
.rx-n{font-variant-numeric:tabular-nums;font-size:.78rem;}
.rx-n[hidden]{display:none;}
.rx-txt{font-size:.68rem;font-weight:600;letter-spacing:.02em;white-space:nowrap;
  opacity:.85;}

/* États actifs — couleurs issues des variables, donc lisibles sur les thèmes
   sombres (nuit, encre, nébuleuse) comme sur les thèmes clairs. */
.rx-btn.is-on{background:var(--blue-tint);border-color:var(--blue);color:var(--blue);}
.rx-jadore.is-on{color:var(--star,var(--warn));border-color:var(--star,var(--warn));
  background:var(--warn-bg,var(--paper-2));}
.rx-favori.is-on{color:var(--ok);border-color:var(--ok);background:var(--ok-bg);}
.rx-inline{color:var(--ok);font-weight:700;}

/* Retour visuel bref après un clic réussi, sans dépendre du réseau. */
@keyframes rx-pop{0%{transform:scale(1);}45%{transform:scale(1.28);}100%{transform:scale(1);}}
.rx-btn.is-pop .rx-ico{animation:rx-pop .32s var(--ease);}

/* ---------- Bloc de fin de lecture ---------- */
/* Plus présent que le bloc compact de l'en-tête : c'est après avoir lu que le
   candidat a de quoi juger, donc c'est là qu'on l'invite à réagir. */
.rx-final{margin:34px 0 8px;padding:20px;text-align:center;
  background:var(--paper-2);border:1px solid var(--line-soft);border-radius:var(--r-lg);}
.rx-final-q{font-family:var(--display);font-size:1.05rem;color:var(--ink);margin:0 0 14px;}
.rx-final .rx{justify-content:center;}
.rx-final-note{font-family:var(--ui);font-size:.8rem;color:var(--ink-3);margin:14px 0 0;}
.rx-lg .rx-btn{flex-direction:row;align-items:center;gap:8px;
  min-height:42px;padding:10px 18px;font-size:.88rem;background:var(--card);
  border-radius:99px;}
.rx-lg .rx-txt{font-size:.88rem;opacity:1;}

/* ---------- Profil : grille des cards ---------- */
.prof-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start;}
.prof-card-wide{grid-column:1/-1;}
.prof-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:22px;box-shadow:var(--sh-1);}
.prof-card-head{display:flex;align-items:center;gap:10px;margin-bottom:16px;}
.prof-card-head h2{font-size:1.12rem;margin:0;}
.prof-card-ico{width:32px;height:32px;flex-shrink:0;display:inline-flex;align-items:center;
  justify-content:center;border-radius:var(--r-sm);background:var(--blue-soft);color:var(--blue);
  font-size:1rem;}
.prof-count{margin-left:auto;font-family:var(--ui);font-size:.75rem;font-weight:700;
  padding:3px 10px;border-radius:99px;background:var(--paper-2);color:var(--ink-3);}
.prof-lbl{display:block;font-family:var(--ui);font-size:.72rem;font-weight:700;
  letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);margin-bottom:6px;}

/* ---------- Reprendre où l'on en était ---------- */
.prof-reprise{display:flex;align-items:center;gap:14px;padding:14px 18px;margin-bottom:20px;
  background:var(--blue-tint);border:1px solid var(--blue-soft);border-radius:var(--r-md);
  text-decoration:none;transition:border-color .18s var(--ease);}
.prof-reprise:hover{border-color:var(--blue);}
.prof-reprise-ico{font-size:1.3rem;color:var(--blue);flex-shrink:0;}
.prof-reprise-txt{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1;}
.prof-reprise-txt strong{font-family:var(--ui);font-size:.82rem;color:var(--blue);}
.prof-reprise-txt span{font-size:.95rem;color:var(--ink);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap;}
.prof-reprise-fleche{color:var(--blue);flex-shrink:0;}

/* ---------- Card identité ---------- */
.prof-identite{display:flex;align-items:center;gap:14px;margin-bottom:20px;}
.prof-avatar{width:52px;height:52px;flex-shrink:0;border-radius:99px;display:inline-flex;
  align-items:center;justify-content:center;background:var(--blue);color:var(--btn-txt,#fff);
  font-family:var(--display);font-size:1.25rem;font-weight:600;text-transform:uppercase;}
.prof-identite-txt{display:flex;flex-direction:column;gap:2px;min-width:0;}
.prof-identite-txt strong{font-size:1.05rem;color:var(--ink);}
.prof-identite-txt span{font-size:.8rem;}
.prof-zones{margin-bottom:20px;}
.prof-chips{display:flex;gap:8px;flex-wrap:wrap;}
.prof-chip{font-family:var(--ui);font-size:.78rem;font-weight:600;padding:5px 12px;
  border-radius:99px;background:var(--paper-2);color:var(--ink-2);border:1px solid var(--line);}
.prof-chip.is-on{background:var(--blue-soft);color:var(--blue);border-color:var(--blue);}

.prof-mail-row{display:flex;gap:8px;}
.prof-mail-row input{flex:1;min-width:0;font-family:var(--ui);font-size:.92rem;
  padding:11px 13px;border:1px solid var(--line);border-radius:var(--r-sm);
  background:var(--paper);color:var(--ink);}
.prof-mail-row input:focus{outline:none;border-color:var(--blue);}
.prof-mail-row .btn-primary{flex-shrink:0;padding:11px 16px;}
.prof-msg{font-family:var(--ui);font-size:.85rem;margin:8px 0 0;}
.prof-msg.is-err{color:var(--err);}
.prof-msg.is-ok{color:var(--ok);}
.prof-note{font-size:.8rem;color:var(--ink-3);margin:10px 0 0;line-height:1.55;}

/* ---------- Card progression ---------- */
.prof-serie{font-family:var(--ui);font-size:.88rem;color:var(--ink-2);
  background:var(--ok-bg);border-radius:var(--r-sm);padding:9px 13px;margin:0 0 16px;}
.prof-serie strong{color:var(--ok);}
.prof-prog{margin-bottom:16px;}
.prof-prog-head{display:flex;justify-content:space-between;align-items:baseline;
  font-family:var(--ui);font-size:.88rem;color:var(--ink-2);margin-bottom:6px;}
.prof-prog-head strong{font-size:1.05rem;color:var(--blue);}
.prof-bar{height:9px;border-radius:99px;background:var(--paper-2);overflow:hidden;}
.prof-bar span{display:block;height:100%;border-radius:99px;background:var(--blue);
  transition:width .4s var(--ease);}
.prof-prog-sub{font-size:.8rem;color:var(--ink-3);margin:6px 0 0;}

.prof-scores{margin-top:20px;padding-top:18px;border-top:1px solid var(--line-soft);}
.prof-chart{display:flex;align-items:flex-end;gap:6px;height:110px;margin-bottom:6px;
  overflow-x:auto;padding-bottom:2px;}
.prof-chart-col{display:flex;flex-direction:column;align-items:center;gap:5px;
  flex:1 0 26px;min-width:26px;height:100%;}
.prof-chart-bar{flex:1;width:100%;display:flex;align-items:flex-end;
  background:var(--paper-2);border-radius:var(--r-sm) var(--r-sm) 3px 3px;overflow:hidden;}
.prof-chart-bar span{display:block;width:100%;background:var(--blue);
  border-radius:var(--r-sm) var(--r-sm) 0 0;}
.prof-chart-lbl{font-family:var(--ui);font-size:.65rem;color:var(--ink-4);
  white-space:nowrap;}

/* ---------- Filtres ---------- */
.prof-filtres{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end;
  padding:14px;margin-bottom:16px;background:var(--paper-2);border-radius:var(--r-md);}
.prof-filtres label{display:flex;flex-direction:column;flex:1 1 130px;min-width:0;}
.prof-filtres select,.prof-filtres input{font-family:var(--ui);font-size:.88rem;
  padding:9px 11px;border:1px solid var(--line);border-radius:var(--r-sm);
  background:var(--card);color:var(--ink);width:100%;}
.prof-filtres select:focus,.prof-filtres input:focus{outline:none;border-color:var(--blue);}
.prof-filtres-act{display:flex;gap:8px;flex-shrink:0;}
.prof-filtres-act .btn-primary,.prof-filtres-act .btn-ghost{padding:9px 16px;font-size:.88rem;}

/* ---------- Listes du profil ---------- */
.prof-liste{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;}
.prof-item{display:flex;align-items:center;gap:14px;padding:13px 16px;text-decoration:none;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);
  transition:border-color .18s var(--ease);}
.prof-item:hover{border-color:var(--blue);}
.prof-item-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;}
.prof-item-txt strong{font-size:.96rem;color:var(--ink);}
.prof-item-txt span{font-size:.8rem;}
.prof-item-meta{display:flex;align-items:center;gap:10px;flex-shrink:0;font-size:.8rem;}
.prof-badge{font-family:var(--ui);font-size:.72rem;font-weight:600;padding:3px 9px;
  border-radius:99px;background:var(--blue-soft);color:var(--blue);white-space:nowrap;}
.prof-badge.is-fiche{background:var(--ok-bg);color:var(--ok);}

/* ---------- Responsive : mêmes seuils que le reste du site ---------- */
@media(max-width:900px){
  .prof-grid{grid-template-columns:1fr;}
}
@media(max-width:700px){
  /* Les icônes passent SOUS le lien : superposées, elles chevaucheraient
     le titre du cours sur un écran étroit. */
  .lesson-wrap .lesson{padding-right:20px;}
  .lesson-wrap .rx{position:static;transform:none;margin:-4px 0 10px;padding:0 16px;}
  .prof-card{padding:18px;}
}
@media(max-width:560px){
  /* Cibles tactiles confortables, même norme que .theme-item en mobile. */
  .rx-btn{min-height:44px;padding:7px 12px;}
  .rx-ico{font-size:1.1rem;}
  .rx-txt{font-size:.7rem;}
  .prof-filtres label{flex:1 1 100%;}
  .prof-filtres-act{width:100%;}
  .prof-filtres-act .btn-primary,.prof-filtres-act .btn-ghost{flex:1;justify-content:center;}
  .prof-mail-row{flex-direction:column;}
  .prof-mail-row .btn-primary{width:100%;justify-content:center;}
  .prof-item{flex-direction:column;align-items:flex-start;gap:8px;}
  .prof-item-meta{width:100%;justify-content:space-between;}
  .prof-reprise{padding:12px 14px;gap:11px;}
  .prof-chart{height:92px;}
  .rx-final{padding:16px 12px;}
  .rx-final .rx{gap:8px;}
}
@media(max-width:420px){
  /* Le libellé reste TOUJOURS lisible : c'est lui qui manquait. Sur écran très
     étroit, c'est le bloc de fin de lecture qui repasse en colonne (icône et
     compteur au-dessus, mot en dessous), plutôt que de masquer le mot. */
  .rx-lg .rx-btn{flex-direction:column;gap:3px;padding:8px 12px;min-height:52px;}
  .rx-lg .rx-txt{font-size:.72rem;}
  .rx-final .rx{gap:6px;}
}

/* ==========================================================================
   v9.53 — BOUTON DE CONTACT WHATSAPP
   La couleur de marque (#25D366) est la SEULE valeur codée en dur de tout le
   fichier. C'est délibéré : un logo de réseau social garde sa couleur sur les
   13 thèmes, exactement comme le ferait un logo Facebook. Tout le reste
   (bordures, ombres, rayons, textes secondaires) passe par les variables,
   donc l'intégration suit le thème actif.
   ========================================================================== */
:root{
  --wa:#25D366;          /* vert WhatsApp officiel */
  --wa-fonce:#1da851;    /* survol */
  --wa-txt:#ffffff;      /* contraste vérifié sur les deux verts */
}

.wa-svg{width:1.25em;height:1.25em;flex-shrink:0;display:block;}

/* ---------- Bouton plein (page « Obtenir votre clé », admin) ---------- */
.wa-btn{display:inline-flex;align-items:center;gap:9px;
  padding:12px 20px;border-radius:99px;text-decoration:none;
  font-family:var(--ui);font-size:.95rem;font-weight:600;line-height:1;
  background:var(--wa);color:var(--wa-txt);border:1px solid transparent;
  box-shadow:var(--sh-1);
  transition:background .18s var(--ease),transform .18s var(--ease),box-shadow .18s var(--ease);}
.wa-btn:hover{background:var(--wa-fonce);box-shadow:var(--sh-2);color:var(--wa-txt);}
.wa-btn:active{transform:translateY(1px);}
.wa-btn:focus-visible{outline:3px solid var(--blue);outline-offset:3px;}

/* ---------- Lien discret (pied de page de l'accueil) ---------- */
.wa-lien{display:inline-flex;align-items:center;gap:6px;
  color:var(--wa-fonce);text-decoration:none;font-weight:600;}
.wa-lien:hover{text-decoration:underline;}
/* Sur fond sombre, le vert foncé manque de contraste : on reprend le vif. */
[data-theme="nuit"] .wa-lien,
[data-theme="encre"] .wa-lien,
[data-theme="nebuleuse"] .wa-lien{color:var(--wa);}

/* ---------- Bouton flottant ---------- */
/* z-index 80 : au-dessus du contenu et de la barre du haut (50), mais SOUS
   les fenêtres modales (120) et surtout sous le tour guidé (900-902) —
   sans quoi le bouton flotterait au-dessus du voile sombre affiché à la
   première visite, exactement au moment où l'on veut guider le visiteur. */
.wa-float{position:fixed;right:18px;bottom:18px;z-index:80;
  display:inline-flex;align-items:center;gap:9px;
  padding:13px 18px;border-radius:99px;text-decoration:none;
  font-family:var(--ui);font-size:.9rem;font-weight:600;line-height:1;
  background:var(--wa);color:var(--wa-txt);
  box-shadow:0 6px 20px rgba(0,0,0,.22);
  transition:background .18s var(--ease),transform .18s var(--ease),box-shadow .18s var(--ease);}
.wa-float:hover{background:var(--wa-fonce);color:var(--wa-txt);
  box-shadow:0 8px 26px rgba(0,0,0,.28);transform:translateY(-2px);}
.wa-float:active{transform:translateY(0);}
.wa-float:focus-visible{outline:3px solid var(--wa-txt);outline-offset:3px;}
.wa-float .wa-svg{width:1.45em;height:1.45em;}

/* Apparition douce, une seule fois, pour attirer l'œil sans agresser. */
@keyframes wa-in{from{opacity:0;transform:translateY(14px) scale(.94);}
                 to{opacity:1;transform:translateY(0) scale(1);}}
.wa-float{animation:wa-in .45s var(--ease) both;animation-delay:.7s;}

/* ---------- Responsive : seuils déjà utilisés par le site ---------- */
@media(max-width:700px){
  .wa-float{right:14px;bottom:14px;padding:12px 16px;font-size:.86rem;}
}
@media(max-width:560px){
  /* Pastille ronde : le texte prendrait trop de largeur et masquerait le
     contenu. La cible reste large (52 px) pour rester confortable au doigt. */
  .wa-float{padding:0;width:52px;height:52px;justify-content:center;
    right:14px;bottom:16px;}
  .wa-float-txt{display:none;}
  .wa-float .wa-svg{width:1.7em;height:1.7em;}
  .wa-btn{width:100%;justify-content:center;}
}

/* Respect du réglage système « réduire les animations ». */
@media(prefers-reduced-motion:reduce){
  .wa-float{animation:none;}
  .wa-btn,.wa-float{transition:none;}
  .wa-float:hover{transform:none;}
}

/* ==========================================================================
   v9.54 — AIDE EN LIGNE
   Contrairement au bouton WhatsApp (couleur de marque figée), l'aide est une
   fonctionnalité DU SITE : tout passe donc par les variables de thème, y
   compris les rayons (--r-sm/md/lg), que chaque thème redéfinit — le thème
   Bibliothèque garde ainsi ses angles nets là où Océan arrondit.
   ========================================================================== */

.aide-zone{position:fixed;left:18px;bottom:18px;z-index:80;
  display:flex;flex-direction:column;align-items:flex-start;gap:10px;}
.aide-zone[hidden]{display:none;}

/* ---------- Bouton d'ouverture ---------- */
.aide-fab{display:inline-flex;align-items:center;gap:9px;
  padding:13px 18px;border-radius:99px;cursor:pointer;border:none;
  font-family:var(--ui);font-size:.9rem;font-weight:600;line-height:1;
  background:var(--blue);color:var(--btn-txt,#fff);
  box-shadow:0 6px 20px rgba(0,0,0,.22);
  transition:background .18s var(--ease),transform .18s var(--ease),box-shadow .18s var(--ease);}
.aide-fab:hover{background:var(--blue-deep);box-shadow:0 8px 26px rgba(0,0,0,.28);
  transform:translateY(-2px);}
.aide-fab:active{transform:translateY(0);}
.aide-fab:focus-visible{outline:3px solid var(--ink);outline-offset:3px;}
.aide-fab-ico{width:1.45em;height:1.45em;flex-shrink:0;display:block;}

/* Croix de masquage : discrète, ancrée sur le bouton */
.aide-fab-x{position:absolute;top:-7px;right:-7px;width:22px;height:22px;
  border-radius:99px;cursor:pointer;padding:0;line-height:1;
  display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--ui);font-size:1rem;font-weight:700;
  background:var(--card);color:var(--ink-3);border:1px solid var(--line);
  box-shadow:var(--sh-1);opacity:0;transition:opacity .18s var(--ease),color .18s var(--ease);}
.aide-zone:hover .aide-fab-x,.aide-fab-x:focus-visible{opacity:1;}
.aide-fab-x:hover{color:var(--err);border-color:var(--err);}
/* Sur écran tactile, le survol n'existe pas : la croix reste visible. */
@media(hover:none){.aide-fab-x{opacity:1;}}

/* ---------- Conflit avec le bouton WhatsApp ----------
   Les deux flottants partagent le même z-index, et WhatsApp est écrit APRÈS
   le panneau dans la page : à égalité, c'est lui qui passe au-dessus. Il
   recouvrait donc le coin inférieur droit du panneau — exactement le bouton
   d'envoi — sur tout écran de 700 px ou moins (tablettes et téléphones).
   Le panneau et WhatsApp étant frères, et WhatsApp venant après, le sélecteur
   de frère général permet de le retirer pendant la conversation. Il réapparaît
   dès la fermeture, et le lien WhatsApp reste proposé DANS les réponses quand
   la question le justifie. */
.aide-zone.is-ouvert ~ .wa-float{display:none;}
/* Ceinture et bretelles : même si la règle ci-dessus ne s'appliquait pas
   (ordre du HTML modifié un jour), le panneau resterait au-dessus. */
.aide-zone.is-ouvert{z-index:90;}

/* ---------- Fenêtre de discussion ---------- */
.aide-panneau{display:flex;flex-direction:column;
  width:min(390px,calc(100vw - 36px));height:min(540px,calc(100vh - 130px));
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--sh-3);overflow:hidden;}
.aide-panneau[hidden]{display:none;}

@keyframes aide-ouvre{from{opacity:0;transform:translateY(12px) scale(.97);}
                      to{opacity:1;transform:translateY(0) scale(1);}}
.aide-panneau{animation:aide-ouvre .22s var(--ease) both;}

.aide-tete{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:14px 16px;background:var(--blue);color:var(--btn-txt,#fff);flex-shrink:0;}
.aide-tete-txt{display:flex;flex-direction:column;gap:2px;min-width:0;}
.aide-tete-txt strong{font-family:var(--display);font-size:1rem;}
.aide-tete-txt span{font-family:var(--ui);font-size:.74rem;opacity:.85;}
.aide-fermer{background:none;border:none;cursor:pointer;padding:2px 6px;
  color:inherit;font-size:1.5rem;line-height:1;opacity:.85;flex-shrink:0;}
.aide-fermer:hover{opacity:1;}
.aide-fermer:focus-visible{outline:2px solid var(--btn-txt,#fff);outline-offset:2px;}

/* ---------- Fil des messages ---------- */
.aide-fil{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;
  background:var(--paper);}
.aide-msg{max-width:86%;padding:11px 14px;border-radius:var(--r-md);
  font-family:var(--read,var(--ui));font-size:.9rem;line-height:1.55;
  word-wrap:break-word;overflow-wrap:break-word;}
.aide-msg p{margin:0;}
.aide-msg p + p{margin-top:8px;}
.aide-msg-bot{align-self:flex-start;background:var(--card);color:var(--ink);
  border:1px solid var(--line);}
.aide-msg-moi{align-self:flex-end;background:var(--blue);color:var(--btn-txt,#fff);}
.aide-msg-err{align-self:flex-start;background:var(--err-bg);color:var(--ink);
  border:1px solid var(--err);}
.aide-note{font-size:.8rem;color:var(--ink-3);}
.aide-msg-moi .aide-note{color:inherit;opacity:.8;}

.aide-wa{display:inline-flex;align-items:center;gap:7px;margin-top:10px;
  padding:9px 15px;border-radius:99px;text-decoration:none;
  font-family:var(--ui);font-size:.85rem;font-weight:600;
  background:var(--wa,#25D366);color:#fff;}
.aide-wa:hover{background:var(--wa-fonce,#1da851);color:#fff;}
.aide-wa svg{width:1.15em;height:1.15em;}

/* Indicateur d'attente : trois points, plutôt qu'une roue générique */
.aide-attente{align-self:flex-start;display:flex;gap:5px;padding:13px 15px;
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);}
.aide-attente span{width:7px;height:7px;border-radius:99px;background:var(--ink-3);
  animation:aide-point 1.3s infinite ease-in-out;}
.aide-attente span:nth-child(2){animation-delay:.18s;}
.aide-attente span:nth-child(3){animation-delay:.36s;}
@keyframes aide-point{0%,60%,100%{opacity:.3;transform:translateY(0);}
                      30%{opacity:1;transform:translateY(-4px);}}

/* ---------- Zone de saisie ---------- */
.aide-bas{flex-shrink:0;padding:12px 14px;background:var(--card);
  border-top:1px solid var(--line-soft);}
.aide-saisie{display:flex;align-items:flex-end;gap:8px;}
.aide-champ{flex:1;min-width:0;resize:none;max-height:110px;
  font-family:var(--ui);font-size:.92rem;line-height:1.45;
  padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-md);
  background:var(--paper);color:var(--ink);}
.aide-champ:focus{outline:none;border-color:var(--blue);}
.aide-envoyer{flex-shrink:0;width:40px;height:40px;border:none;cursor:pointer;
  border-radius:99px;display:inline-flex;align-items:center;justify-content:center;
  background:var(--blue);color:var(--btn-txt,#fff);
  transition:background .18s var(--ease),opacity .18s var(--ease);}
.aide-envoyer:hover:not(:disabled){background:var(--blue-deep);}
.aide-envoyer:disabled{opacity:.45;cursor:default;}
.aide-envoyer:focus-visible{outline:3px solid var(--blue);outline-offset:2px;}
.aide-envoyer svg{width:1.15em;height:1.15em;}

.aide-pied{display:flex;justify-content:space-between;align-items:center;gap:10px;
  margin-top:8px;font-family:var(--ui);font-size:.74rem;color:var(--ink-4);}
.aide-compteur[hidden]{display:none;}
.aide-compteur.is-proche{color:var(--warn);font-weight:600;}
.aide-compteur.is-max{color:var(--err);font-weight:700;}

/* ---------- Responsive : seuils déjà utilisés par le site ---------- */
@media(max-width:700px){
  .aide-zone{left:14px;bottom:14px;}
  .aide-fab{padding:12px 16px;font-size:.86rem;}
  .aide-panneau{width:calc(100vw - 28px);height:min(75vh,540px);}
}
@media(max-width:560px){
  /* Pastille ronde : le libellé prendrait la largeur du bouton WhatsApp voisin. */
  .aide-fab{padding:0;width:52px;height:52px;justify-content:center;}
  .aide-fab-txt{display:none;}
  .aide-fab-ico{width:1.7em;height:1.7em;}
  /* Quasi plein écran, en laissant l'accès au reste de la page. */
  .aide-zone.is-ouvert{left:0;right:0;bottom:0;align-items:stretch;}
  .aide-zone.is-ouvert .aide-fab,
  .aide-zone.is-ouvert .aide-fab-x{display:none;}
  .aide-panneau{width:100vw;height:88vh;
    border-radius:var(--r-lg) var(--r-lg) 0 0;border-bottom:none;}
  .aide-msg{max-width:92%;font-size:.92rem;}
  .aide-champ{font-size:16px;}   /* 16px : empêche le zoom automatique sur iOS */
}

@media(prefers-reduced-motion:reduce){
  .aide-panneau{animation:none;}
  .aide-fab,.aide-envoyer{transition:none;}
  .aide-fab:hover{transform:none;}
  .aide-attente span{animation:none;opacity:.6;}
}