
/* Thème « Fluo » : papier à petits carreaux, fournitures scolaires. Contours encre épais, ombres franches comme des stickers,
   titres de section sur du ruban adhésif fluo, chiffres clés en étiquettes de couleur. Bandeau encre, police Unbounded pour les titres,
   Atkinson Hyperlegible (conçue pour la lisibilité) pour le texte. */
:root{
  --paper:#f2f3f9; --card:#ffffff; --ink:#14163d; --muted:#4a4f78; --line:#d4d7ea; --seyes:#e1e4f1; --margin-red:#ff5a4e;
  --encre:#4330ff; --encre-soft:#e8e5ff; --surligneur:#ffe94a; --surligneur-ink:#14163d;
  --good:#0f7a4a; --good-soft:#d9f6e6; --warn:#8a5300; --warn-soft:#fff0cf; --bad:#c0263a; --bad-soft:#ffe1e6;
  --m0:#cfcaff; --m1:#a59bff; --m2:#7a6bff; --m3:#4330ff; --m4:#22179a;
  --stroke:#14163d; --shc:#14163d; --grid:#e0e3f1; --mast:#14163d; --mast-muted:#c4c8ee;
  --fy:#ffe94a; --fp:#ff9fd6; --fg:#86f2b6; --fb:#93d6ff; --fo:#ffbb6b; --on-fluo:#14163d;
  --display:"Unbounded","Arial Black",ui-sans-serif,system-ui,sans-serif;
  --body:"Atkinson Hyperlegible",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:ui-monospace,"SFMono-Regular",Menlo,monospace;
  --radius:12px;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --paper:#101230; --card:#1a1d44; --ink:#eef0ff; --muted:#b4b9e2; --line:#30355f; --seyes:#1b1e42; --margin-red:#ff7a70;
  --encre:#a69dff; --encre-soft:#2a2766; --surligneur:#ffe94a; --surligneur-ink:#14163d;
  --good:#5fe0a0; --good-soft:#123b2b; --warn:#ffc266; --warn-soft:#3b2c10; --bad:#ff8c9b; --bad-soft:#42182a;
  --m0:#2a2766; --m1:#3f36a8; --m2:#6b5cff; --m3:#a69dff; --m4:#dcd8ff;
  --stroke:#cfd3ff; --shc:#5b4cff; --grid:#1a1d42; --mast:#08091f; --mast-muted:#b4b9e2; color-scheme:dark}}
:root[data-theme="dark"]{
  --paper:#101230; --card:#1a1d44; --ink:#eef0ff; --muted:#b4b9e2; --line:#30355f; --seyes:#1b1e42; --margin-red:#ff7a70;
  --encre:#a69dff; --encre-soft:#2a2766; --surligneur:#ffe94a; --surligneur-ink:#14163d;
  --good:#5fe0a0; --good-soft:#123b2b; --warn:#ffc266; --warn-soft:#3b2c10; --bad:#ff8c9b; --bad-soft:#42182a;
  --m0:#2a2766; --m1:#3f36a8; --m2:#6b5cff; --m3:#a69dff; --m4:#dcd8ff;
  --stroke:#cfd3ff; --shc:#5b4cff; --grid:#1a1d42; --mast:#08091f; --mast-muted:#b4b9e2; color-scheme:dark}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{background:var(--paper);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--display);text-wrap:balance;margin:0;line-height:1.15}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--encre);outline-offset:2px;border-radius:6px}
.wrap{max-width:1180px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.num{font-variant-numeric:tabular-nums}
.mono{font-family:var(--mono);font-size:.8em;letter-spacing:.02em}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Bandeau sur papier Seyès */
.masthead{background-color:var(--paper);background-image:
  linear-gradient(90deg,transparent calc(max(16px,env(safe-area-inset-left,0px)) + 26px),var(--margin-red) calc(max(16px,env(safe-area-inset-left,0px)) + 26px),var(--margin-red) calc(max(16px,env(safe-area-inset-left,0px)) + 28px),transparent calc(max(16px,env(safe-area-inset-left,0px)) + 28px)),
  repeating-linear-gradient(0deg,var(--seyes) 0 1px,transparent 1px 8px);
  border-bottom:1px solid var(--line)}
.masthead .wrap{padding-block:28px 22px;display:flex;flex-wrap:wrap;gap:18px 32px;align-items:flex-end;justify-content:space-between}
.brand{padding-left:40px;min-width:0}
.brand :is(h1,.bname){font-size:clamp(2rem,5vw,3rem);font-weight:800;letter-spacing:-.02em}
.brand :is(h1,.bname) mark{background:linear-gradient(transparent 55%,var(--surligneur) 55% 92%,transparent 92%);color:inherit;padding:0 .08em}
.brand p{margin:.4rem 0 0;color:var(--muted);max-width:52ch}
.tabs{display:flex;gap:6px;background:var(--card);border:1px solid var(--line);border-radius:999px;padding:4px}
.tab{border:0;background:transparent;padding:.55rem 1.1rem;border-radius:999px;cursor:pointer;font-weight:700;color:var(--muted)}
.tab[aria-current="page"]{background:var(--encre);color:var(--paper)}

/* Barre d'outils */
.toolbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--paper);border-bottom:1px solid var(--line)}
.toolbar .wrap{padding-block:12px;display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
.searchrow{display:flex;gap:10px;flex-wrap:wrap}
.search{flex:1 1 280px;min-width:0;position:relative}
.search input{width:100%;padding:.7rem .9rem .7rem 2.4rem;border:1.5px solid var(--line);border-radius:var(--radius);background:var(--card)}
.search input:focus{border-color:var(--encre);outline:none}
.search svg{position:absolute;left:.75rem;top:50%;transform:translateY(-50%);width:18px;height:18px;stroke:var(--muted);fill:none}
.bacpick{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0;max-width:100%}
.searchrow>*{min-width:0} .bacpick select{max-width:100%;min-width:0} /* menus aux intitulés longs (matières) : le catalogue tient à 360 px */
.bacpick label{font-size:.85rem;color:var(--muted)}
select{padding:.6rem .7rem;border:1.5px solid var(--line);border-radius:var(--radius);background:var(--card);max-width:100%}
.filters{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.chip{border:1.5px solid var(--line);background:var(--card);border-radius:999px;padding:.3rem .8rem;cursor:pointer;font-size:.9rem;white-space:nowrap}
.chip[aria-pressed="true"]{border-color:var(--encre);background:var(--encre-soft);color:var(--encre);font-weight:700}
.filters .sep{width:1px;height:22px;background:var(--line)}

/* Résultats */
main{padding-block:18px 60px}
.resultbar{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;align-items:center;margin-bottom:12px;color:var(--muted)}
.banner{display:flex;flex-wrap:wrap;gap:10px;align-items:center;background:var(--encre-soft);color:var(--ink);border-radius:var(--radius);padding:.7rem 1rem;margin-bottom:12px}
.banner b{color:var(--encre)}
.banner button{margin-left:auto}
.list{display:grid;gap:10px}
.row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 18px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;cursor:pointer;text-align:left;width:100%}
.row:hover{border-color:var(--encre)}
.row h3{font-family:var(--body);font-size:1.02rem;font-weight:700;line-height:1.3}
.row .where{color:var(--muted);font-size:.92rem;margin-top:2px}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.tag{font-size:.75rem;padding:.12rem .5rem;border-radius:6px;background:var(--paper);border:1px solid var(--line);color:var(--muted);letter-spacing:.02em}
.tag.app{border-color:var(--encre);color:var(--encre)}
.odds{text-align:right;min-width:112px}
.odds .pct{font-family:var(--display);font-size:1.6rem;font-weight:700;line-height:1}
.odds .lab{font-size:.78rem;color:var(--muted)}
.pill{display:inline-block;font-size:.78rem;font-weight:700;padding:.15rem .55rem;border-radius:999px}
.p-good{background:var(--good-soft);color:var(--good)} .p-warn{background:var(--warn-soft);color:var(--warn)} .p-bad{background:var(--bad-soft);color:var(--bad)} .p-none{background:var(--paper);color:var(--muted);border:1px solid var(--line)}
.more{display:flex;justify-content:center;margin-top:16px}
.btn{border:1.5px solid var(--encre);background:var(--encre);color:var(--paper);padding:.6rem 1.1rem;border-radius:var(--radius);font-weight:700;cursor:pointer}
.btn.ghost{background:transparent;color:var(--encre)}
.empty{padding:40px 16px;text-align:center;color:var(--muted)}
@media (max-width:560px){.row{grid-template-columns:minmax(0,1fr)}.odds{text-align:left;display:flex;gap:10px;align-items:baseline}}

/* Panneau fiche */
.scrim{position:fixed;inset:0;background:rgba(10,14,25,.45);z-index:20}
.sheet{position:fixed;top:0;right:0;bottom:0;width:min(640px,100%);background:var(--paper);z-index:21;overflow-y:auto;border-left:1px solid var(--line);
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);padding-right:env(safe-area-inset-right,0px)}
.sheet-head{position:sticky;top:0;background:var(--paper);border-bottom:1px solid var(--line);padding:14px 20px;display:flex;gap:12px;align-items:flex-start;z-index:1}
.sheet-head h2{font-size:1.35rem;flex:1;min-width:0}
.close{border:1px solid var(--line);background:var(--card);border-radius:8px;width:38px;height:38px;cursor:pointer;flex:none;font-size:1.2rem;line-height:1}
.sheet-body{padding:18px 20px 40px;display:grid;gap:22px}
.sec h3{font-size:1.05rem;margin-bottom:10px;display:flex;align-items:baseline;gap:8px}
.sec h3 .src{font-family:var(--body);font-weight:400;font-size:.75rem;color:var(--muted)}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}
.fact{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:10px 12px}
.fact .v{font-family:var(--display);font-size:1.45rem;font-weight:700;line-height:1.1}
.fact .k{font-size:.8rem;color:var(--muted);margin-top:2px}
.bars{display:grid;gap:8px}
.bar{display:grid;grid-template-columns:150px minmax(0,1fr) 46px;gap:10px;align-items:center;font-size:.9rem}
.bar .track{height:12px;background:var(--line);border-radius:6px;overflow:hidden}
.bar .fill{height:100%;background:var(--encre);border-radius:6px}
.bar.me .fill{background:var(--surligneur)} .bar.me span:first-child{font-weight:700}
.bar .val{text-align:right}
.stack{display:flex;height:22px;border-radius:6px;overflow:hidden;border:1px solid var(--line)}
.stack div{height:100%}
.legend{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:.8rem;color:var(--muted);margin-top:8px}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.note{font-size:.85rem;color:var(--muted);margin:.5rem 0 0}
.prose{max-width:62ch}
.prose p{margin:.3rem 0 .6rem}
.metiers{display:flex;flex-wrap:wrap;gap:8px}
.tag.mat{background:var(--encre-soft);border-color:transparent;color:var(--encre)}
.matlist{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:6px}
.matlist li{display:flex;flex-wrap:wrap;gap:2px 10px;align-items:baseline;padding:8px 12px;background:var(--card);border:1px solid var(--line);border-radius:8px}
.matlist li>span:first-child{font-weight:700}
.matres{margin-top:14px;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.cmpwrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:var(--card)}
.cmp{width:100%;border-collapse:collapse;font-size:.92rem}
.cmp th,.cmp td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.cmp tbody tr:last-child th,.cmp tbody tr:last-child td{border-bottom:0}
.cmp thead th{font-family:var(--display);font-size:.95rem;background:var(--paper)}
.cmp thead th:nth-child(2){background:var(--encre-soft);color:var(--encre)}
.cmp td{font-family:var(--display);font-size:1.15rem;font-weight:700;white-space:nowrap}
.cmp td:nth-child(2){background:color-mix(in srgb,var(--encre-soft) 45%,transparent)}
.cmp tbody th{font-weight:400;color:var(--muted);min-width:150px}
.cmp .sub{display:block;font-family:var(--body);font-weight:400;font-size:.75rem;color:var(--muted);margin-top:2px}
.linkout{display:inline-flex;gap:6px;align-items:center;color:var(--encre);font-weight:700}
@media (max-width:480px){.bar{grid-template-columns:110px minmax(0,1fr) 40px}}

/* Questionnaire */
.quiz{display:grid;gap:22px;max-width:900px}
.step{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:18px}
.step h2{font-size:1.25rem;margin-bottom:4px}
.step .hint{color:var(--muted);margin:0 0 12px}
.ci{display:flex;flex-wrap:wrap;gap:8px}
.ci .chip{font-size:.95rem;padding:.45rem .9rem}
.profile{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.letter{display:grid;place-items:center;width:44px;height:44px;border-radius:10px;background:var(--surligneur);color:var(--surligneur-ink);font-family:var(--display);font-weight:800;font-size:1.4rem}
.letter.sec{background:var(--encre-soft);color:var(--encre)}
.mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.mcard{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:14px;display:flex;flex-direction:column;gap:8px}
.mcard h4{margin:0;font-family:var(--display);font-size:1.08rem}
.mcard p{margin:0;font-size:.9rem;color:var(--muted)}
.mcard .meta{display:flex;flex-wrap:wrap;gap:6px;font-size:.78rem}
.mcard .btn{margin-top:auto;align-self:flex-start;font-size:.9rem;padding:.45rem .8rem}
footer{border-top:1px solid var(--line);color:var(--muted);font-size:.85rem}
footer .wrap{padding-block:22px 40px;display:grid;gap:6px}
.loading{padding:60px 0;text-align:center;color:var(--muted)}
@media (prefers-reduced-motion:no-preference){.row,.chip,.btn{transition:border-color .15s,background-color .15s}}

/* ---------- M'orienter ---------- */
.subnav{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.subnav :is(a,button){border:1.5px solid var(--line);background:var(--card);border-radius:999px;padding:.45rem .95rem;font-weight:700;cursor:pointer;color:var(--ink)}
.subnav :is(a,button)[aria-current="page"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.subnav :is(a,button):disabled{cursor:default;color:var(--muted);font-weight:400}
.ohero{display:grid;gap:10px;margin-bottom:26px;max-width:70ch}
.ohero :is(h1,h2){font-size:clamp(1.6rem,4vw,2.3rem);font-weight:800;letter-spacing:-.01em}
.ohero p{margin:0;color:var(--muted);font-size:1.05rem}
.osec{margin-block:34px;display:grid;gap:14px}
.osec>h3{font-size:1.35rem}
.osec>.lead{margin:0;color:var(--muted);max-width:68ch}
.lanes{display:grid;gap:10px}
.lane{display:grid;grid-template-columns:180px repeat(4,minmax(0,1fr));gap:8px;align-items:stretch}
.lane .who{display:flex;flex-direction:column;justify-content:center;padding:10px 12px;border-radius:var(--radius);font-weight:700;font-family:var(--display);line-height:1.2}
.lane .who small{font-family:var(--body);font-weight:400;font-size:.8rem;opacity:.85}
.lane .st{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:10px 12px;font-size:.9rem;position:relative}
.lane .st b{display:block;font-size:.95rem}
.lane .st.end{border-style:dashed}
.lane .st.none{background:transparent;border:0}
.lane-gt .who{background:var(--encre-soft);color:var(--encre)}
.lane-pro .who{background:var(--surligneur);color:var(--surligneur-ink)}
.lane-cap .who{background:var(--good-soft);color:var(--good)}
.lanehead{display:grid;grid-template-columns:180px repeat(4,minmax(0,1fr));gap:8px;font-size:.78rem;color:var(--muted);letter-spacing:.04em;text-transform:uppercase}
.bridge{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:.9rem;color:var(--muted);padding:10px 12px;border:1px dashed var(--line);border-radius:var(--radius)}
.bridge b{color:var(--ink)}
@media (max-width:760px){.lane,.lanehead{grid-template-columns:minmax(0,1fr)}.lanehead{display:none}.lane .st.none{display:none}}
.cmptable{width:100%;border-collapse:collapse;font-size:.93rem}
.cmptable th,.cmptable td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top;text-align:left}
.cmptable thead th{font-family:var(--display);font-size:1rem}
.cmptable tbody th{color:var(--muted);font-weight:400;width:20%}
.kpis{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:6px}
.kpi{font-size:.85rem;color:var(--muted)}
.kpi b{font-family:var(--display);font-size:1.1rem;color:var(--ink)}
.qz{display:grid;gap:14px}
.qz fieldset{border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px;margin:0;background:var(--card)}
.qz legend{font-weight:700;padding:0 6px}
.qz .opts{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.qz label{display:flex;gap:8px;align-items:center;border:1.5px solid var(--line);border-radius:999px;padding:.35rem .8rem;cursor:pointer;font-size:.93rem}
.qz input{accent-color:var(--encre)}
.qz label:has(input:checked){border-color:var(--encre);background:var(--encre-soft)}
.qzres{border-radius:var(--radius);border:1.5px solid var(--encre);padding:14px 16px;display:grid;gap:10px;background:var(--card)}
.err{color:var(--bad);font-size:.88rem}
.fgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:10px}
.fcard{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px;display:flex;flex-direction:column;gap:8px}
.fcard h4{margin:0;font-family:var(--display);font-size:1.05rem;line-height:1.25}
.fcard details summary{cursor:pointer;color:var(--encre);font-size:.88rem}
.fcard details p{font-size:.9rem;margin:.4rem 0 0}
.fcard .btn{align-self:flex-start;margin-top:auto;font-size:.88rem;padding:.4rem .8rem}
.lycrow{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px;display:grid;gap:4px}
.lycrow h4{margin:0;font-size:1rem}
.timeline{list-style:none;margin:0;padding:0;display:grid;gap:10px;counter-reset:t}
.timeline li{display:grid;grid-template-columns:150px minmax(0,1fr);gap:14px;padding:12px 14px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius)}
.timeline li b{font-family:var(--display)}
@media (max-width:560px){.timeline li{grid-template-columns:minmax(0,1fr)}}
.ctrls{display:flex;flex-wrap:wrap;gap:8px;align-items:center}

.edsgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.eds{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px;display:flex;flex-direction:column;gap:8px}
.eds h4{margin:0;font-family:var(--display);font-size:1.05rem}
.eds p{margin:0;font-size:.9rem;color:var(--muted)}
.eds ol{margin:0;padding-left:1.1rem;font-size:.88rem;display:grid;gap:2px}
.pick{display:flex;flex-wrap:wrap;gap:8px}
.pairs{display:flex;flex-wrap:wrap;gap:8px}
.pairs button{border:1.5px solid var(--line);background:var(--card);border-radius:var(--radius);padding:.55rem .9rem;cursor:pointer;text-align:left;font-weight:700}
.pairs button[aria-pressed="true"]{border-color:var(--encre);background:var(--encre-soft);color:var(--encre)}
.pairs button small{display:block;font-weight:400;color:var(--muted)}
.ptable{width:100%;border-collapse:collapse;font-size:.92rem}
.ptable th,.ptable td{padding:9px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.ptable thead th{font-size:.8rem;color:var(--muted);font-weight:700;letter-spacing:.02em}
.ptable td.n{text-align:right;white-space:nowrap}
.ptable a{color:var(--encre);cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.mini{display:inline-block;height:8px;border-radius:4px;background:var(--encre);vertical-align:middle;margin-right:6px}
.warnbox{border:1px solid var(--warn);background:var(--warn-soft);border-radius:var(--radius);padding:10px 12px;font-size:.92rem}
.hbars{display:grid;gap:6px;max-width:560px}

.famtable{width:100%;border-collapse:collapse;font-size:.92rem}
.famtable th,.famtable td{padding:10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.famtable thead th{font-size:.8rem;color:var(--muted);letter-spacing:.02em}
.famtable td.n{text-align:right;white-space:nowrap}
.famtable td:first-child{min-width:170px}
.famtable button{border:0;background:none;color:var(--encre);font-weight:700;cursor:pointer;padding:0;text-align:left;font:inherit;text-decoration:underline;text-underline-offset:2px}
.vlist{display:grid;gap:8px}
.vitem{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:6px 12px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:10px 12px}
.vitem .nm{font-weight:700;cursor:pointer}
.vitem .rm{border:1px solid var(--line);background:var(--paper);border-radius:8px;width:32px;height:32px;cursor:pointer}
.sugg{display:grid;gap:4px;margin-top:6px}
.sugg button{display:block;width:100%;text-align:left;border:1px solid var(--line);background:var(--card);border-radius:8px;padding:8px 10px;cursor:pointer}
.sugg button:hover{border-color:var(--encre)}
.vsum{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.advice{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;margin:0;padding-left:1.1rem}.advice li{min-width:0} /* un bouton de spécialité trop long élargissait la page mobile */
.resp{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.resp div{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:12px}
.resp b{font-family:var(--display);font-size:1.1rem;display:block;margin-bottom:4px}
@media (max-width:560px){.vitem{grid-template-columns:minmax(0,1fr) auto}.vitem .pill{grid-column:1}}

/* ---------- Explorer > Formations ---------- */
:root{--f1:#2a78d6;--f2:#eb6834;--f3:#1baf7a;--f4:#eda100;--f5:#e87ba4;--f6:#008300;--f7:#6250d6;--f8:#e34948;
  --h0:#cde2fb;--h1:#9ec5f4;--h2:#6da7ec;--h3:#3987e5;--h4:#256abf;--h5:#184f95;--hi0:#152238;--hi1:#152238;--hi2:#152238;--hi3:#ffffff;--hi4:#ffffff;--hi5:#ffffff}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--f1:#3987e5;--f2:#d95926;--f3:#199e70;--f4:#c98500;--f5:#d55181;--f6:#008300;--f7:#9085e9;--f8:#e66767;
  --h0:#10203a;--h1:#104281;--h2:#1c5cab;--h3:#2a78d6;--h4:#5598e7;--h5:#9ec5f4;--hi0:#e7ebf5;--hi1:#e7ebf5;--hi2:#ffffff;--hi3:#ffffff;--hi4:#0f1522;--hi5:#0f1522}}
:root[data-theme="dark"]{--f1:#3987e5;--f2:#d95926;--f3:#199e70;--f4:#c98500;--f5:#d55181;--f6:#008300;--f7:#9085e9;--f8:#e66767;
  --h0:#10203a;--h1:#104281;--h2:#1c5cab;--h3:#2a78d6;--h4:#5598e7;--h5:#9ec5f4;--hi0:#e7ebf5;--hi1:#e7ebf5;--hi2:#ffffff;--hi3:#ffffff;--hi4:#0f1522;--hi5:#0f1522}
.exbar{background:var(--paper)}
.exbar .wrap{padding-top:14px}
.exbar .subnav{margin-bottom:0}
.btn.small{font-size:.85rem;padding:.35rem .7rem}
.tkpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:18px}
.tkpis div{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:10px 12px}
.tkpis b{display:block;font-family:var(--display);font-size:1.5rem;line-height:1.1}
.tkpis span{font-size:.82rem;color:var(--muted)}
.toc{display:flex;flex-wrap:wrap;gap:6px 16px;margin-bottom:14px;font-size:.92rem}
.toc a{color:var(--encre);font-weight:700;text-decoration:none;border-bottom:2px solid transparent}
.toc a:hover{border-bottom-color:var(--encre)}
.tfilters{border-block:1px solid var(--line);padding:12px 0;display:grid;gap:8px}
#exTypes .osec{scroll-margin-top:16px}
.tsearch{max-width:560px}
.trow{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.tlab{font-size:.82rem;color:var(--muted);min-width:7.5em}
@media (max-width:560px){.tlab{min-width:0;width:100%}}
.fdot{display:inline-block;width:10px;height:10px;border-radius:3px;flex:none}
/* carte des études */
.tmapwrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:var(--card)}
.tmap{min-width:760px;padding:8px 12px 12px;font-size:.86rem}
.tm-row{display:grid;grid-template-columns:210px minmax(0,1fr);gap:10px;align-items:center;min-height:24px}
.tm-row.head{position:sticky;top:0;background:var(--card);z-index:1;padding:4px 0 6px;border-bottom:1px solid var(--line);font-size:.75rem;color:var(--muted)}
.tm-cols{display:grid;grid-template-columns:repeat(11,minmax(0,1fr));text-align:center}
.tm-cols span:nth-child(3){color:var(--ink);font-weight:700}
.tm-niv{display:grid;grid-template-columns:repeat(11,minmax(0,1fr));font-size:.68rem;color:var(--muted);text-align:right;margin-top:2px}
.tm-fam{display:flex;gap:8px;align-items:center;font-family:var(--display);font-weight:700;margin-top:10px;padding:2px 0}
.tm-lab{border:0;background:none;padding:2px 0;text-align:left;cursor:pointer;color:var(--ink);font:inherit;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tm-lab:hover{color:var(--encre);text-decoration:underline}
.tm-track{position:relative;height:16px;background-image:repeating-linear-gradient(90deg,var(--line) 0 1px,transparent 1px calc(100% / 11))}
.tm-track::after{content:"";position:absolute;top:-5px;bottom:-5px;left:calc(300% / 11);width:3px;margin-left:-1px;background:var(--ink);opacity:.55}
.tm-bar{position:absolute;top:3px;height:10px;border-radius:4px;cursor:pointer}
.tm-bar.more{border-top-right-radius:0;border-bottom-right-radius:0}
.tm-dur{position:absolute;top:-1px;font-size:.72rem;color:var(--muted);white-space:nowrap;padding-left:6px}
.tm-row.dim{opacity:.22}
.tm-row>:first-child{position:sticky;left:0;background:var(--card);z-index:1}
.tm-fam{position:sticky;left:0;width:max-content;background:var(--card)}
.tmhint{display:none}
@media (max-width:560px){.tmap{min-width:640px;padding-left:8px}.tm-row{grid-template-columns:118px minmax(0,1fr)}.tmhint{display:block}}
.tm-row:hover .tm-bar{outline:2px solid var(--ink);outline-offset:1px}
/* cartes */
.tfam{margin-top:26px}
.tfam-h{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline;margin-bottom:10px}
.tfam-h h4{margin:0;font-family:var(--display);font-size:1.2rem;display:flex;gap:8px;align-items:center}
.tfam-h p{margin:0;color:var(--muted);font-size:.92rem;flex-basis:100%;max-width:80ch}
.tgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:10px}
.tcard{background:var(--card);border:1px solid var(--line);border-left:5px solid var(--fc,var(--line));border-radius:var(--radius);padding:12px 14px;display:flex;flex-direction:column;gap:8px;min-width:0}
.tcard h5{margin:0;font-family:var(--display);font-size:1.06rem;line-height:1.25}
.tcard h5 button{all:unset;cursor:pointer}
.tcard h5 button:hover{color:var(--encre);text-decoration:underline}
.tcard h5 button:focus-visible{outline:3px solid var(--encre);outline-offset:2px;border-radius:4px}
.tmeta{display:flex;flex-wrap:wrap;gap:6px;font-size:.78rem}
.tmeta .pill{font-weight:700}
.tcard .what{margin:0;font-size:.9rem;color:var(--muted);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.tk{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;border-block:1px solid var(--line);padding:8px 0}
.tk div{min-width:0}
.tk b{display:block;font-family:var(--display);font-size:1.12rem;line-height:1.1}
.tk span{display:block;font-size:.7rem;color:var(--muted);line-height:1.2}
.tch{display:grid;grid-template-columns:auto minmax(0,1fr) 34px;gap:2px 8px;align-items:center;font-size:.78rem}
.tch .track{height:7px;background:var(--line);border-radius:4px;overflow:hidden}
.tch .fill{height:100%;background:var(--encre);border-radius:4px}
.tch .v{text-align:right}
.tafter{font-size:.84rem}
.tafter b{font-family:var(--display)}
.tspecs{display:flex;flex-wrap:wrap;gap:5px}
.tspec{font-size:.76rem;padding:.12rem .5rem;border-radius:6px;background:var(--paper);border:1px solid var(--line);color:var(--ink);cursor:pointer;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tspec:hover{border-color:var(--encre);color:var(--encre)}
.tspec.hit{background:var(--surligneur);color:var(--surligneur-ink);border-color:transparent}
.tspec.static{cursor:default}.tspec.static:hover{border-color:var(--line);color:var(--ink)}
.tact{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:4px}
.tact .btn{font-size:.85rem;padding:.4rem .75rem}
.tflat .tcard .fam{font-size:.75rem;color:var(--muted);display:flex;gap:6px;align-items:center}
/* fiche type */
.tdl{display:grid;grid-template-columns:110px minmax(0,1fr);gap:8px 14px;margin:0;font-size:.93rem}
.tdl dt{color:var(--muted);font-size:.85rem}
.tdl dd{margin:0}
.tlist{columns:2 220px;column-gap:18px;margin:0;padding:0;list-style:none;font-size:.88rem}
.tlist li{break-inside:avoid;display:flex;justify-content:space-between;gap:8px;padding:3px 0;border-bottom:1px dashed var(--line)}
.tlist li button{all:unset;cursor:pointer;color:var(--encre)}
.tlist li button:hover{text-decoration:underline}
.tlist li button:focus-visible{outline:3px solid var(--encre);border-radius:3px}
.tlist .num{color:var(--muted)}
.mixbar{display:flex;height:16px;border-radius:5px;overflow:hidden;gap:2px;background:var(--card)}
.mixbar div{height:100%}
/* heatmap */
.heat{border-collapse:separate;border-spacing:3px;width:100%;min-width:720px;font-size:.84rem}
.heat th{font-weight:400;color:var(--muted);text-align:left;padding:4px 6px}
.heat thead th{font-size:.76rem;vertical-align:bottom;text-align:center}
.heat thead th .fdot{margin-right:4px}
.heat tbody th{color:var(--ink);white-space:nowrap}
.heat td{text-align:center;border-radius:6px;padding:0;height:34px}
.heat td button{all:unset;display:block;width:100%;height:100%;cursor:pointer;border-radius:6px;font-variant-numeric:tabular-nums;line-height:34px}
.heat td button:hover{outline:2px solid var(--ink);outline-offset:1px}
.heat td button:focus-visible{outline:3px solid var(--encre)}
.heat td.z{background:var(--paper);color:var(--muted)}
/* pépites */
.pepgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.pep{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:12px;display:flex;flex-direction:column;gap:6px}
.pep .fam{font-size:.75rem;color:var(--muted);display:flex;gap:6px;align-items:center}
.pep h5{margin:0;font-family:var(--display);font-size:1rem;line-height:1.25}
.pep .btn{align-self:flex-start;margin-top:auto;font-size:.82rem;padding:.35rem .7rem}
/* diplômes */
.dipgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:12px;align-items:start}
.dipbox{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px}
.dipbox h4{margin:0 0 10px;font-family:var(--display);font-size:1.08rem}
.niv{display:grid;grid-template-columns:42px minmax(0,1fr);gap:8px;padding:7px 0;border-bottom:1px solid var(--line);font-size:.88rem}
.niv:last-of-type{border-bottom:0}
.niv b{font-family:var(--display);font-size:1.3rem;line-height:1;color:var(--encre)}
.niv button{all:unset;cursor:pointer;color:var(--encre);text-decoration:underline;text-underline-offset:2px}
.niv button:focus-visible{outline:3px solid var(--encre)}
.gloss{margin:0;display:grid;gap:8px;font-size:.88rem}
.gloss dt{font-weight:700}
.gloss dd{margin:0;color:var(--muted)}
.costt{width:100%;border-collapse:collapse;font-size:.88rem}
.costt td{padding:6px 0;border-bottom:1px solid var(--line);vertical-align:top}
.costt td.n{text-align:right;white-space:nowrap;font-family:var(--display);font-weight:700;padding-left:10px}

/* ---------- Explorer > Métiers ---------- */
.mstart{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:12px;margin-bottom:12px}
.mbox{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px}
.mbox h4{margin:0;font-family:var(--display);font-size:1.05rem}
.mbox .note{margin:.2rem 0 .6rem}
.mbox .chip{font-size:.84rem;padding:.28rem .7rem;white-space:normal;text-align:left}
.chip .rl{font-family:var(--display);font-weight:800;margin-right:4px}
.ugrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.utile{background:var(--card);border:1.5px solid var(--line);border-radius:var(--radius);padding:12px 14px;display:flex;flex-direction:column;gap:7px;text-align:left;cursor:pointer;font:inherit;color:inherit}
.utile:hover{border-color:var(--encre)}
.utile[aria-pressed="true"]{border-color:var(--encre);background:var(--encre-soft)}
.utile h4{margin:0;font-family:var(--display);font-size:1.05rem;line-height:1.2}
.utile .lead2{font-size:.84rem;color:var(--muted)}
.utile .ex{font-size:.8rem;color:var(--ink);line-height:1.35}
.nvbar{display:flex;height:9px;border-radius:4px;overflow:hidden;gap:2px;background:var(--card)}
.nvbar div{height:100%}
.ukp{display:flex;gap:12px;font-size:.8rem;color:var(--muted)}
.ukp b{font-family:var(--display);font-size:1.05rem;color:var(--ink)}
.mgrid2{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:10px}
.mc{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px;display:flex;flex-direction:column;gap:7px;min-width:0}
.mc .uv{font-size:.74rem;color:var(--muted)}
.mc h5{margin:0;font-family:var(--display);font-size:1.05rem;line-height:1.25}
.mc h5 button{all:unset;cursor:pointer}
.mc h5 button:hover{color:var(--encre);text-decoration:underline}
.mc h5 button:focus-visible{outline:3px solid var(--encre);outline-offset:2px;border-radius:4px}
.mc p{margin:0;font-size:.88rem;color:var(--muted);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.mc .tmeta .pill{font-weight:700}
.mc .act{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:2px}
.mc .act .btn{font-size:.84rem;padding:.38rem .72rem}
.cihit{font-size:.74rem;padding:.1rem .45rem;border-radius:6px;background:var(--surligneur);color:var(--surligneur-ink)}
.rgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px}
.rcard{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px;display:flex;flex-direction:column;gap:8px}
.rcard header{display:flex;gap:10px;align-items:center}
.rcard h4{margin:0;font-family:var(--display);font-size:1.08rem}
.rcard p{margin:0;font-size:.88rem;color:var(--muted)}
.rcard .btn{align-self:flex-start;margin-top:auto;font-size:.84rem;padding:.38rem .72rem}
.mkey{display:grid;grid-template-columns:130px minmax(0,1fr);gap:8px 14px;margin:0;font-size:.93rem}
.mkey dt{color:var(--muted);font-size:.85rem}
.mkey dd{margin:0}
#mHeat{min-width:600px}
#mHeat tbody th{position:sticky;left:0;background:var(--card);white-space:normal;min-width:150px;z-index:1}
.tagbtn{cursor:pointer}
.tagbtn:hover{border-color:var(--encre);color:var(--encre)}

/* ---------- Explorer > Matières ---------- */
.xgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px}
.xc{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:13px 14px;display:flex;flex-direction:column;gap:8px;min-width:0}
.xc.sel{border-color:var(--encre);box-shadow:0 0 0 1.5px var(--encre) inset}
.xc h5{margin:0;font-family:var(--display);font-size:1.12rem;line-height:1.2}
.xc h5 button{all:unset;cursor:pointer}
.xc h5 button:hover{color:var(--encre);text-decoration:underline}
.xc h5 button:focus-visible{outline:3px solid var(--encre);outline-offset:2px;border-radius:4px}
.xc p{margin:0;font-size:.88rem;color:var(--muted)}
.xc .lyc{font-size:.82rem;color:var(--ink)}
.xc .act{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:2px}
.xc .act .btn{font-size:.82rem;padding:.36rem .68rem}
.xcomps{display:grid;gap:3px;font-size:.82rem;margin:0;padding:0;list-style:none}
.xcomps li::before{content:"→ ";color:var(--encre);font-weight:700}
.xpath{border-collapse:collapse;min-width:980px;font-size:.82rem;width:100%}
.xpath th,.xpath td{padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top;text-align:left}
.xpath thead th{font-family:var(--display);font-size:.9rem;background:var(--paper);position:sticky;top:0}
.xpath tbody th{position:sticky;left:0;background:var(--card);min-width:140px;font-weight:700;z-index:1}
.xpath tbody th button{all:unset;cursor:pointer;color:var(--encre)}
.xpath tbody th button:hover{text-decoration:underline}
.xcomp{border-collapse:separate;border-spacing:2px;min-width:860px;width:100%;font-size:.82rem}
.xcomp th{font-weight:400;padding:4px 6px}
.xcomp thead th{font-size:.72rem;color:var(--muted);vertical-align:bottom;text-align:center;line-height:1.15}
.xcomp thead th button{all:unset;cursor:pointer}
.xcomp thead th button:hover{color:var(--encre);text-decoration:underline}
.xcomp tbody th{text-align:left;position:sticky;left:0;background:var(--card);z-index:1;min-width:210px}
.xcomp tbody th button{all:unset;cursor:pointer;color:var(--ink)}
.xcomp tbody th button:hover,.xcomp tbody th button[aria-pressed="true"]{color:var(--encre);text-decoration:underline;font-weight:700}
.xcomp td{text-align:center;border-radius:5px;color:var(--encre);font-weight:700;letter-spacing:-.05em;height:28px}
.xcomp td.k2{background:var(--encre-soft)}
.xcomp tr.on td.k2,.xcomp tr.on td.k1{outline:2px solid var(--encre);outline-offset:-2px}
.xmix{margin-top:12px;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:10px}
.xmix .dipbox h4{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.xmix .big{font-family:var(--display);font-size:1.6rem;font-weight:800;line-height:1}
.xsteps{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.xsteps li{display:grid;grid-template-columns:96px minmax(0,1fr);gap:10px;padding:8px 10px;background:var(--card);border:1px solid var(--line);border-radius:8px;font-size:.9rem}
.xsteps li b{font-family:var(--display)}
.xcompd{display:grid;gap:8px}
.xcompd div{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:9px 11px;font-size:.9rem}
.xcompd b{display:block}
.xcompd span{color:var(--muted);font-size:.86rem}
.xtype{display:grid;grid-template-columns:minmax(0,1fr);gap:4px;padding:8px 0;border-bottom:1px dashed var(--line)}
.xtype:last-child{border-bottom:0}
.xtype .h{display:flex;justify-content:space-between;gap:10px;align-items:baseline;min-width:0}
.xtype .h .tspec{min-width:0}
.xtype .h span{flex:none}
.sheet-body>*{min-width:0}

/* ---------- Explorer > Établissements ---------- */
.emapgrid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:12px;align-items:start}
@media (max-width:820px){.emapgrid{grid-template-columns:minmax(0,1fr)}}
.emapbox{position:relative;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.emapbox canvas{display:block;width:100%;height:auto;cursor:crosshair}
.etip{position:absolute;pointer-events:none;background:var(--ink);color:var(--paper);font-size:.8rem;padding:6px 8px;border-radius:6px;max-width:260px;line-height:1.3;z-index:2}
.ec{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px;display:flex;flex-direction:column;gap:7px;min-width:0}
.ec .uv{font-size:.74rem;color:var(--muted)}
.ec h5{margin:0;font-family:var(--display);font-size:1.02rem;line-height:1.25}
.ec h5 button{all:unset;cursor:pointer}
.ec h5 button:hover{color:var(--encre);text-decoration:underline}
.ec h5 button:focus-visible{outline:3px solid var(--encre);outline-offset:2px;border-radius:4px}
.ec .act{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto}
.ec .act .btn{font-size:.84rem;padding:.38rem .72rem}
.spark{display:block;width:100%;height:60px}
.ptable td.nm button{all:unset;cursor:pointer;color:var(--encre);font-weight:700}
.ptable td.nm button:hover{text-decoration:underline}
.famtable tr.on td{background:var(--encre-soft)}

/* ---------- Trouver ma voie ---------- */
.vq{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:18px;display:grid;gap:14px;max-width:980px}
.vprog{display:flex;gap:4px}
.vprog i{flex:1;height:6px;border-radius:3px;background:var(--line)}
.vprog i.done{background:var(--encre)}
.vprog i.cur{background:var(--surligneur)}
.vq h4{margin:0;font-family:var(--display);font-size:1.35rem;line-height:1.2}
.vq .hint{margin:0;color:var(--muted)}
.vopts{display:flex;flex-wrap:wrap;gap:8px}
.vopts .chip{font-size:.95rem;padding:.5rem .95rem;white-space:normal;text-align:left}
.vopts.big .chip{flex:1 1 230px;border-radius:var(--radius);padding:.7rem .9rem}
.vopts .chip small{display:block;font-weight:400;color:var(--muted);font-size:.8rem}
.vnav{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-top:12px}
.vnav .grow{flex:1}
.vsub{display:grid;gap:10px}
.vsub label.tl{font-weight:700;font-size:.92rem}
.vprof6{display:grid;gap:6px;max-width:560px}
.vres-top{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
.vprofbox{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 24px;align-items:start}
@media (max-width:760px){.vprofbox{grid-template-columns:minmax(0,1fr)}}
.piste{background:var(--card);border:1px solid var(--line);border-top:4px solid var(--encre);border-radius:var(--radius);padding:14px;display:flex;flex-direction:column;gap:10px;min-width:0}
.piste h4{margin:0;font-family:var(--display);font-size:1.2rem}
.piste .lbl{font-size:.74rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700}
.why{display:flex;flex-wrap:wrap;gap:4px;margin-top:2px}
.why span{font-size:.72rem;padding:.08rem .45rem;border-radius:5px;background:var(--good-soft);color:var(--good)}
.vlist{display:grid;gap:8px}
.vrow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 14px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:10px 12px}
.vrow h5{margin:0;font-family:var(--display);font-size:1rem;line-height:1.25}
.vrow h5 button{all:unset;cursor:pointer}
.vrow h5 button:hover{color:var(--encre);text-decoration:underline}
.vrow h5 button:focus-visible{outline:3px solid var(--encre);border-radius:4px}
.vrow .sc{font-family:var(--display);font-weight:800;font-size:1.15rem;text-align:right}
.vrow .sc small{display:block;font-family:var(--body);font-weight:400;font-size:.72rem;color:var(--muted)}
.vcols{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:12px;align-items:start}

/* ---------- Mise en page v17 : respiration et repères ----------
   Chaque page = un en-tête aéré, un sommaire collant (« Sur cette page »), puis des sections en bandes
   alternées pleine largeur, titrées au surligneur. Les cartes respirent davantage. */
:root{--band:#ffffff;--band-line:#14163d;--hl:#ffe94a;--r2:14px;--sec-pad:clamp(44px,6vw,76px);--sh:4px 4px 0 var(--shc);--sh-s:3px 3px 0 var(--shc)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--band:#161939;--band-line:#cfd3ff;--hl:#ffe94a}}
:root[data-theme="dark"]{--band:#161939;--band-line:#cfd3ff;--hl:#ffe94a}
html{font-size:106.25%}
body{line-height:1.6}
main{padding-block:0}
main [id],#exTypes .osec{scroll-margin-top:84px}
p{text-wrap:pretty}

/* En-tête et onglets */
.masthead .wrap{padding-block:26px 20px}
.tab{padding:.65rem 1.2rem;font-size:1rem}
.tab:not([aria-current="page"]):hover{color:var(--ink);background:var(--encre-soft)}
.exbar{border-bottom:1px solid var(--line);background:var(--card)}
.exbar .wrap{padding-top:0}
.subnav{flex-wrap:nowrap;overflow-x:auto;gap:4px;scrollbar-width:none;position:relative}
.tlist .num{white-space:nowrap}
.subnav::-webkit-scrollbar{display:none}
.subnav :is(a,button){border:0;border-radius:0;background:transparent;padding:1rem .95rem .8rem;border-bottom:3px solid transparent;color:var(--muted);white-space:nowrap;font-size:.98rem}
.subnav :is(a,button):hover{color:var(--ink)}
.subnav :is(a,button)[aria-current="page"]{background:transparent;color:var(--ink);border-color:transparent;border-bottom-color:var(--encre)}
/* M'orienter : les quatre étapes sont une vraie suite, numérotées */
#view-orienter>.subnav{counter-reset:st;margin:0;border-bottom:1px solid var(--line);box-shadow:0 0 0 100vmax var(--card);clip-path:inset(0 -100vmax);background:var(--card)}
#view-orienter>.subnav :is(a,button){counter-increment:st;display:inline-flex;align-items:center;gap:.55em}
#view-orienter>.subnav :is(a,button)::before{content:counter(st);display:inline-grid;place-items:center;width:1.7em;height:1.7em;border-radius:50%;border:1.5px solid currentColor;font-size:.82em;font-family:var(--display);font-weight:800}
#view-orienter>.subnav :is(a,button)[aria-current="page"]::before{background:var(--encre);border-color:var(--encre);color:var(--card)}

/* En-tête de page */
.ohero{padding-block:clamp(34px,5vw,60px) 22px;margin-bottom:0;gap:14px;max-width:64ch}
.ohero :is(h1,h2){font-size:clamp(1.95rem,4.6vw,3.05rem);line-height:1.06;letter-spacing:-.02em}
.ohero p{font-size:1.1rem;line-height:1.55}
.tkpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,124px),1fr));gap:18px 24px;margin:6px 0 30px}
.tkpis div{background:none;border:0;border-left:3px solid var(--margin-red);border-radius:0;padding:2px 0 2px 14px}
.tkpis b{font-size:clamp(1.55rem,2.8vw,2.05rem);color:var(--encre);letter-spacing:-.01em}
.tkpis span{font-size:.86rem;display:block;margin-top:4px;line-height:1.35}

/* Sommaire collant */
.toc{position:sticky;top:env(safe-area-inset-top,0px);z-index:6;display:flex;align-items:center;gap:14px;margin:0;padding-block:10px;font-size:.95rem;
  background:var(--paper);box-shadow:0 0 0 100vmax var(--paper),0 1px 0 100vmax var(--line);clip-path:inset(0 -100vmax -1px)}
.toc-lab{flex:none;font-size:.82rem;color:var(--muted);font-weight:700}
.toc-in{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;min-width:0;padding:2px;flex:1 1 0}
.toc{flex-wrap:nowrap}
.osec>*{min-width:0} .ctrls select{max-width:100%} .costt td.n:not(.num){white-space:normal} /* « Plusieurs milliers d'€/an » peut passer à la ligne : la page tient à 360 px */ /* un menu aux intitulés longs (formations après la 3e) élargissait la section au-delà de l'écran mobile */
@media (min-width:900px){.toc-in{flex-wrap:wrap;overflow:visible} main [id],#exTypes .osec{scroll-margin-top:140px}} /* sur ordinateur, toutes les entrées restent visibles (passage à la ligne, le titre visé ne passe pas dessous) ; sur mobile, bande qui défile */
.toc-in::-webkit-scrollbar{display:none}
.toc a,.toc a:hover{border:0}
.toc-in a{flex:none;padding:.42rem .85rem;border-radius:999px;color:var(--muted);font-weight:700;text-decoration:none;white-space:nowrap}
.toc-in a:hover{color:var(--ink);background:var(--band)}
.toc-in a[aria-current="true"]{background:var(--encre-soft);color:var(--encre)}
@media (max-width:640px){.toc-lab{display:none}.toc{padding-block:8px}}

/* Sections en bandes */
.osec{margin:0;padding-block:var(--sec-pad);gap:20px;position:relative}
.osec.band{background:var(--band);box-shadow:0 0 0 100vmax var(--band);clip-path:inset(0 -100vmax)}
.osec>h3{font-size:clamp(1.5rem,2.7vw,2rem);font-weight:800;letter-spacing:-.015em;line-height:1.15;max-width:30ch}
.osec>h3 .hl{background:linear-gradient(transparent 60%,var(--hl) 60% 92%,transparent 92%);-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:0 .1em;margin-left:-.1em}
.osec>.lead{font-size:1.07rem;max-width:66ch;margin-top:-4px;line-height:1.6}
.osec>.note{max-width:75ch}
.note{font-size:.9rem;line-height:1.5}
.osec:focus{outline:none}

/* Panneaux de filtres */
.tfilters{border:1px solid var(--line);border-radius:var(--r2);background:var(--card);padding:20px 22px;gap:14px;margin:26px 0 6px}
.tfilters .tsearch{max-width:640px}
.tlab{font-weight:700;color:var(--ink);font-size:.86rem}
.mstart{gap:18px;margin:26px 0 0}
.mbox{padding:22px 24px;border-radius:var(--r2)}
.mbox h4{font-size:1.2rem}
.chip{padding:.45rem .95rem;font-size:.93rem;min-height:38px}
.filters{gap:8px}
.clamped>.chip:nth-child(n+11):not([aria-pressed="true"]){display:none}
.morechips{margin-top:12px}
.search input{padding-block:.8rem;font-size:1rem}
select{padding:.65rem .8rem}

/* Cartes : plus d'air, même rythme partout */
.tgrid,.mgrid2,.ugrid,.xgrid,.rgrid,.pepgrid,.edsgrid,.fgrid,.mgrid,.vcols,.xmix{gap:18px}
.dipgrid{gap:18px}
.tgrid{grid-template-columns:repeat(auto-fill,minmax(min(100%,330px),1fr))}
.mgrid2,.xgrid,.fgrid{grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
.ugrid{grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr))}
.tcard,.mc,.xc,.ec,.pep,.utile,.rcard,.eds,.fcard,.mcard,.dipbox,.piste,.lycrow,.resp div{padding:20px 22px;border-radius:var(--r2)}
.tcard,.mc,.xc,.ec,.pep,.utile,.rcard,.eds,.fcard,.mcard,.piste{gap:12px}
.tcard{border-left-width:6px}
.tcard h5,.mc h5,.xc h5,.ec h5{font-size:1.15rem}
.dipbox h4,.eds h4,.rcard h4,.fcard h4,.mcard h4,.utile h4{font-size:1.15rem}
.tcard .what,.mc p,.xc p,.eds p,.rcard p,.mcard p{font-size:.95rem;line-height:1.55}
.tag{font-size:.8rem;padding:.18rem .55rem}
.tspec{font-size:.83rem;padding:.22rem .62rem}
.tspecs{gap:6px}
.tmeta{font-size:.82rem;gap:6px}
.tk{padding:12px 0;gap:10px}
.tk b{font-size:1.3rem}
.tk span{font-size:.76rem;margin-top:2px}
.tch{font-size:.85rem;gap:5px 10px;grid-template-columns:auto minmax(0,1fr) 3.3em}
.tk{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 14px}
.tk span{font-size:.8rem}
.tch .track{height:8px}
.tafter{font-size:.9rem;line-height:1.5}
.tact{padding-top:8px}
.utile .lead2{font-size:.9rem}
.utile .ex{font-size:.86rem}
.mc .uv,.ec .uv,.pep .fam{font-size:.8rem}
.tfam{margin-top:44px;padding-top:30px;border-top:1px solid var(--band-line)}
.tfam:first-child{margin-top:4px;padding-top:0;border-top:0}
.tfam-h{margin-bottom:18px;gap:6px 14px}
.tfam-h h4{font-size:1.45rem;gap:10px}
.tfam-h .fdot{width:14px;height:14px;border-radius:4px}
.tfam-h p{font-size:.98rem}
.btn{padding:.65rem 1.15rem}
.btn.small{padding:.45rem .85rem}

/* Tableaux, cartes de chaleur, chronologies */
.cmpwrap,.tmapwrap,.emapbox{border-radius:var(--r2)}
.ptable th,.ptable td,.famtable th,.famtable td,.cmptable th,.cmptable td{padding:12px 14px}
.famtable{min-width:820px}
.ptable{min-width:560px}
.timeline{gap:12px}
.timeline li{padding:16px 18px;border-radius:var(--r2)}
.lanes{gap:14px}
.lane .st{padding:14px 16px;font-size:.95rem}
.lane .who{padding:14px 16px}
.qz{gap:16px}
.qz fieldset{padding:16px 18px;border-radius:var(--r2)}
.vq{padding:26px 28px;border-radius:var(--r2);gap:18px}
.vq h4{font-size:1.55rem}
.xsteps li,.xcompd div{padding:12px 14px}

/* Catalogue */
.list{gap:12px}
.row{padding:18px 20px;border-radius:var(--r2)}
.row h3{font-size:1.08rem}
main>#view-explorer>#exCat{padding-block:24px 60px}

/* Fiches (panneau latéral) */
.sheet{width:min(720px,100%)}
.sheet-head{padding:18px 24px}
.sheet-head h2{font-size:1.5rem}
.sheet-body{padding:10px 24px 56px;gap:26px}
.sheet-body>.sec+.sec{border-top:1px solid var(--line);padding-top:26px}
.sec h3{font-size:1.18rem;margin-bottom:14px}
.facts{gap:12px}
.fact{padding:14px 16px;border-radius:var(--r2)}

/* Bouton « haut de page » et pied de page */
.totop{position:fixed;right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:15;border:1.5px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:.6rem 1rem;font-weight:700;cursor:pointer;box-shadow:0 6px 20px -8px color-mix(in srgb,var(--ink) 45%,transparent)}
.totop:hover{border-color:var(--encre);color:var(--encre)}
footer{background:var(--band);border-top:1px solid var(--band-line)}
footer .wrap{padding-block:40px 64px;gap:10px;max-width:1180px}
@media (max-width:640px){
  .tfilters,.mbox{padding:16px}
  .tcard,.mc,.xc,.ec,.pep,.utile,.rcard,.eds,.fcard,.mcard,.dipbox,.piste,.lycrow{padding:16px 18px}
  .vq{padding:18px}
  .sheet-head,.sheet-body{padding-left:18px;padding-right:18px}
  .totop{width:46px;height:46px;padding:0;font-size:1.2rem}
  .totop-t{display:none}
  .masthead .wrap{padding-block:20px 16px;gap:14px}
  .brand{padding-left:34px}
  .brand p{font-size:.95rem}
  .tabs{width:100%}
  .tab{flex:1 1 auto;padding:.55rem .2rem;font-size:.84rem;white-space:nowrap;text-align:center} /* quatre rubriques : elles doivent tenir à 360 px */
}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}.toc-in a,.subnav :is(a,button),.tab{transition:background-color .15s,color .15s,border-color .15s}}

/* ---------- Thème Fluo (v18) ---------- */
body{background-color:var(--paper);background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:22px 22px;background-position:-1px -1px}
::selection{background:var(--fy);color:var(--on-fluo)}
h1,h2,h3{font-family:var(--display);letter-spacing:-.02em}
:focus-visible{outline:3px solid var(--encre);outline-offset:3px}

/* Bandeau */
.masthead{background:var(--mast);color:#fff;border-bottom:0;background-image:none}
.masthead .wrap{padding-block:28px 24px}
.brand{padding-left:0}
.brand :is(h1,.bname){font-weight:800;letter-spacing:-.03em;color:#fff}
.brand :is(h1,.bname) mark{background:var(--fy);color:var(--on-fluo);padding:.02em .22em .06em;border-radius:10px;display:inline-block;transform:rotate(-3deg);box-shadow:4px 4px 0 var(--fp);margin-left:.08em}
.brand p{color:var(--mast-muted)}
.brand .baseline{color:var(--fy);font-size:clamp(1.05rem,2.4vw,1.3rem);font-weight:700;letter-spacing:-.005em;margin-top:.55rem} /* jaune fluo sur l'encre du bandeau : contraste ≈ 15:1 */
.brand :is(h1,.bname) mark{margin:0 .1em}
.tabs{background:transparent;border:2px solid #fff;padding:4px;border-radius:999px}
.tab{color:#fff;font-weight:700}
.tab[aria-current="page"]{background:var(--fy);color:var(--on-fluo)}
.tab:not([aria-current="page"]):hover{background:rgba(255,255,255,.14);color:#fff}

/* Barre de menu compacte : apparaît quand le bandeau sort de l'écran (minibarSync) ; le sommaire et la barre d'outils se calent dessous */
.minibar{position:fixed;top:0;left:0;right:0;z-index:15;background:var(--mast);color:#fff;border-bottom:2px solid var(--stroke);padding-top:env(safe-area-inset-top,0px);transform:translateY(-110%);visibility:hidden;transition:transform .2s ease,visibility .2s}
.minibar.on{transform:none;visibility:visible}
.minibar .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;height:52px;padding-block:0}
.mini-brand{font-family:var(--display);font-weight:800;font-size:1.1rem;letter-spacing:-.03em;color:#fff;text-decoration:none;white-space:nowrap}
.mini-brand mark{background:var(--fy);color:var(--on-fluo);padding:0 .2em .04em;border-radius:7px;display:inline-block;transform:rotate(-3deg);margin:0 .08em}
.minibar .tabs{padding:2px}
.minibar .tab{padding:.32rem .95rem;font-size:.92rem}
html.mini-on .toc,html.mini-on .toolbar{top:calc(52px + env(safe-area-inset-top,0px))}
html.mini-on main [id],html.mini-on #exTypes .osec{scroll-margin-top:150px}
@media (min-width:900px){html.mini-on main [id],html.mini-on #exTypes .osec{scroll-margin-top:200px}}
@media (max-width:640px){.tab-long{display:none}.mini-brand{display:none}.minibar .tabs{width:100%}.minibar .tab{flex:1 1 auto;padding:.3rem .15rem;font-size:.78rem;white-space:nowrap;text-align:center}}

/* Sous-navigation (Explorer, M'orienter) */
.exbar{background:var(--card);border-bottom:2px solid var(--stroke)}
#view-orienter>.subnav{border-bottom:2px solid var(--stroke);box-shadow:0 0 0 100vmax var(--card),0 2px 0 100vmax var(--stroke);clip-path:inset(0 -100vmax -2px)}
.subnav :is(a,button){font-weight:700;color:var(--muted)}
.subnav :is(a,button)[aria-current="page"]{color:var(--ink);border-bottom:4px solid var(--stroke);margin-bottom:-2px}
#view-orienter>.subnav :is(a,button)::before{border-width:2px}
#view-orienter>.subnav :is(a,button)[aria-current="page"]::before{background:var(--fy);border-color:var(--stroke);color:var(--on-fluo)}

/* En-tête de page et chiffres clés */
.ohero :is(h1,h2){font-weight:800;font-size:clamp(1.8rem,4.2vw,2.85rem);line-height:1.08;letter-spacing:-.03em}
.ohero p{color:var(--muted)}
.tkpis{gap:16px 18px}
.tkpis div{background:var(--fy);border:2px solid var(--stroke);border-radius:12px;padding:12px 14px;box-shadow:var(--sh);color:var(--on-fluo)}
.tkpis div:nth-child(5n+2){background:var(--fb)}.tkpis div:nth-child(5n+3){background:var(--fp)}.tkpis div:nth-child(5n+4){background:var(--fg)}.tkpis div:nth-child(5n+5){background:var(--fo)}
.tkpis b{color:var(--on-fluo);font-family:var(--display);font-weight:700;font-size:clamp(1.2rem,2vw,1.6rem);letter-spacing:-.03em;white-space:nowrap}
.tkpis span{color:var(--on-fluo);opacity:.85}

/* Sommaire collant : bande jaune fluo pleine largeur, mêmes couleurs en clair et en sombre (texte --on-fluo) ; sous la barre compacte quand elle est affichée */
.toc{background:var(--fy);box-shadow:0 0 0 100vmax var(--fy);clip-path:inset(0 -100vmax -2px)}
.toc::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--stroke);box-shadow:0 0 0 100vmax var(--stroke);clip-path:inset(0 -100vmax)} /* filet sous la bande (l'ombre pleine largeur le recouvrait) ; ombre plutôt que débord, pour ne pas élargir la page */
.toc-lab{color:var(--on-fluo)}
.toc-in a{color:var(--on-fluo);border:2px solid transparent}
.toc a{color:var(--on-fluo)}.toc a:hover{border-bottom-color:var(--on-fluo)} /* sommaire tel qu'écrit dans le HTML (sans JavaScript) */
.toc-in a:hover{background:var(--mast);color:var(--fy);border-color:var(--mast)} /* bleu nuit du header */
.toc-in a[aria-current="true"]{background:var(--on-fluo);color:var(--fy);border-color:var(--on-fluo)}
.toc-in a:focus-visible{outline:3px solid var(--on-fluo);outline-offset:1px}
.dipbox h4 a{color:var(--ink);text-decoration-color:var(--encre);text-underline-offset:3px}.dipbox h4 a:hover{color:var(--encre)} /* cartes de navigation (accueil, étapes, outils) */
/* Tuiles de liens : listes de domaines, de villes, de guides (de vrais liens <a href>, une grille qui s'adapte à la largeur) */
.linkgrid{list-style:none;margin:14px 0 4px;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:12px}
.linkgrid li{margin:0;min-width:0;display:flex}
.linkgrid a{position:relative;flex:1;display:flex;flex-direction:column;justify-content:center;gap:2px;min-height:3.2rem;padding:.65rem 2.4rem .65rem .95rem;border:2px solid var(--stroke);border-left:8px solid var(--tone,var(--fy));border-radius:14px;background:var(--card);color:var(--ink);font-weight:700;line-height:1.3;text-decoration:none;box-shadow:var(--sh-s);transition:transform .15s,box-shadow .15s,background-color .15s}
.linkgrid a:visited{color:var(--ink)}
.linkgrid a::after{content:"→";position:absolute;right:.9rem;top:50%;transform:translateY(-50%);color:var(--encre);font-weight:800}
.linkgrid a:hover{transform:translate(-2px,-2px);box-shadow:var(--sh);background:var(--tone,var(--fy));color:var(--on-fluo)}
.linkgrid a:hover::after,.linkgrid a:hover .lg-n{color:var(--on-fluo)}
.linkgrid a:focus-visible{outline:3px solid var(--encre);outline-offset:2px}
.linkgrid .lg-n{font-weight:500;font-size:.85rem;color:var(--muted)}
.linkgrid.compact{grid-template-columns:repeat(auto-fill,minmax(min(100%,175px),1fr));gap:8px}
.linkgrid.compact a{min-height:2.6rem;padding:.45rem 2rem .45rem .8rem;border-left-width:6px;font-size:.93rem}
.linkgrid+h4,.linkgrid-titre{margin-top:22px}
.exemple-pm{margin:10px 0 4px;padding:14px 18px;border-left:6px solid var(--fg);background:var(--card);border-radius:12px;font-style:italic}.exemple-pm p{margin:0}
.a-completer{display:inline-block;min-width:12em;min-height:1.2em;vertical-align:middle;border:2px dashed var(--line);border-radius:6px} /* champ à remplir (pages légales) */
.legal th{width:38%;text-align:left;font-weight:700}.pied-liens a{color:inherit}
.dipbox.villes-reg{border-left:8px solid var(--tone)}.dipbox.villes-reg h4{margin:0 0 10px}  /* villes par région (page Établissements) */
@media (max-width:520px){.linkgrid.compact{grid-template-columns:repeat(2,minmax(0,1fr))}.linkgrid.compact a{padding:.45rem 1.5rem .45rem .65rem;font-size:.86rem}.linkgrid.compact a::after{right:.55rem}} /* mobile : deux colonnes */
@media (prefers-reduced-motion:reduce){.linkgrid a{transition:none}.linkgrid a:hover{transform:none}}
/* Petits liens en pastilles (types de formations, secteurs) */
.tplinks{gap:8px}.tplinks a{display:inline-flex;align-items:center;padding:.28rem .75rem;border:2px solid var(--stroke);border-radius:999px;background:var(--card);color:var(--ink);font-size:.92rem;text-decoration:none}
.tplinks a:hover{background:var(--fy);color:var(--on-fluo)}.tplinks a:focus-visible{outline:3px solid var(--encre);outline-offset:2px}
.promesse{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin:-6px 0 22px;max-width:62rem;font-weight:600;color:var(--ink)}
.pourqui{display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px}.pq-lab{font-size:.85rem;color:var(--muted);font-weight:700}
.ensuite{margin:34px 0 10px;padding:22px;border:2px solid var(--stroke);border-radius:18px;background:var(--card);box-shadow:var(--sh-s)}
.ensuite h3{margin:0 0 14px;font-family:var(--display)}
.osec .sous{margin-top:28px;min-width:0}.osec .sous>h4:first-child{font-family:var(--display);font-size:1.25rem;margin:0 0 10px}

/* Sections : une feuille blanche sur deux, titres sur ruban adhésif */
.osec.band{background:var(--band);box-shadow:0 0 0 100vmax var(--band),0 -2px 0 100vmax var(--stroke),0 2px 0 100vmax var(--stroke);clip-path:inset(-2px -100vmax)}
.osec{--tape:var(--fy)}
.osec:nth-of-type(4n+2){--tape:var(--fb)}.osec:nth-of-type(4n+3){--tape:var(--fp)}.osec:nth-of-type(4n+4){--tape:var(--fg)}
.osec>h3{font-weight:800;font-size:clamp(1.3rem,2.4vw,1.75rem);letter-spacing:-.025em;line-height:1.2;max-width:34ch}
.osec>h3 .hl{display:inline-block;background:var(--tape);color:var(--on-fluo);padding:.2em .5em .22em;margin:0 0 0 2px;border-radius:4px;transform:rotate(-1.2deg);box-shadow:var(--sh);border:2px solid var(--stroke)}
.osec:nth-of-type(even)>h3 .hl{transform:rotate(.9deg)}
.osec>.lead{color:var(--muted)}

/* Panneaux et cartes */
.tfilters,.mbox,.vq{border:2px solid var(--stroke);border-radius:16px;box-shadow:var(--sh);background:var(--card)}
.tcard,.mc,.xc,.ec,.pep,.utile,.rcard,.eds,.fcard,.mcard,.dipbox,.piste,.lycrow,.resp div,.row,.timeline li,.lane .st,.qz fieldset,.fact,.xsteps li,.xcompd div,.vrow,.vitem{border:2px solid var(--stroke);border-radius:14px;box-shadow:var(--sh-s);background:var(--card)}
.lane .st.none{border:0;box-shadow:none;background:transparent}
.lane .st.end{border-style:dashed}
.cmpwrap,.tmapwrap,.emapbox{border:2px solid var(--stroke);border-radius:14px;box-shadow:var(--sh-s)}
.tcard{border-left-width:2px;border-top:10px solid var(--fc,var(--stroke))}
.piste{border-top:10px solid var(--encre)}
.tcard,.mc,.utile,.row,.ec,.xc,.pep{transition:transform .12s,box-shadow .12s}
.tcard:hover,.mc:hover,.utile:hover,.row:hover,.ec:hover,.xc:hover,.pep:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--shc);border-color:var(--stroke)}
.utile[aria-pressed="true"],.xc.sel{background:var(--fy);color:var(--on-fluo);box-shadow:var(--sh)}
.utile[aria-pressed="true"] .lead2,.utile[aria-pressed="true"] .ex,.utile[aria-pressed="true"] .ukp,.utile[aria-pressed="true"] .ukp b{color:var(--on-fluo)}
.tcard h5,.mc h5,.xc h5,.ec h5,.pep h5,.vrow h5{font-family:var(--body);font-weight:700;font-size:1.16rem;letter-spacing:0}
.dipbox h4,.mbox h4,.utile h4,.rcard h4,.fcard h4,.eds h4,.mcard h4,.piste h4,.vq h4{font-family:var(--display);font-weight:700;font-size:1.02rem;letter-spacing:-.02em;line-height:1.25}
.vq h4{font-size:1.35rem}
.tfam{border-top:2px dashed var(--stroke)}
.tfam:first-child{border-top:0}
.tfam-h h4{font-family:var(--display);font-weight:800;font-size:1.3rem;letter-spacing:-.025em}
.tfam-h .fdot{width:16px;height:16px;border-radius:50%;border:2px solid var(--stroke)}
.tk{border-block:2px dashed var(--line)}
.letter{border:2px solid var(--stroke);background:var(--fy);color:var(--on-fluo);font-family:var(--display)}
.letter.sec{background:var(--fb);color:var(--on-fluo)}
.lane-gt .who{background:var(--fb);color:var(--on-fluo)}
.lane-pro .who{background:var(--fy);color:var(--on-fluo)}
.lane-cap .who{background:var(--fg);color:var(--on-fluo)}
.lane .who{border:2px solid var(--stroke);box-shadow:var(--sh-s)}

/* Puces, boutons, étiquettes */
.chip{border:2px solid var(--stroke);font-weight:700;background:var(--card);color:var(--ink)}
.chip:hover{background:var(--encre-soft)}
.chip[aria-pressed="true"]{background:var(--fy);color:var(--on-fluo);border-color:var(--stroke);box-shadow:2px 2px 0 var(--shc)}
.btn{border:2px solid var(--stroke);background:var(--ink);color:var(--paper);border-radius:12px;box-shadow:3px 3px 0 var(--encre);font-weight:700}
.btn:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--encre)}
.btn.ghost{background:var(--card);color:var(--ink);box-shadow:3px 3px 0 var(--shc)}
.btn.ghost:hover{box-shadow:4px 4px 0 var(--shc)}
.tag,.tspec{border:1.5px solid var(--line);color:var(--ink);border-radius:999px;background:var(--card)}
.tspec:hover{border-color:var(--stroke);color:var(--ink);background:var(--fy)}
.tag.mat,.tspec.hit,.cihit{background:var(--fg);color:var(--on-fluo);border-color:var(--stroke)}
.tag.app{border-color:var(--encre);color:var(--encre)}
.pill{border:1.5px solid currentColor}
.p-none{border-color:var(--line)}
.search input,select,.tfilters select{border:2px solid var(--stroke);border-radius:12px;background:var(--card)}
.search input:focus{border-color:var(--encre);box-shadow:3px 3px 0 var(--encre)}
.qz label{border:2px solid var(--stroke)}
.qz label:has(input:checked){background:var(--fy);color:var(--on-fluo);border-color:var(--stroke)}
.vprog i{height:10px;border:1.5px solid var(--stroke);background:var(--card)}
.vprog i.done{background:var(--encre)}
.vprog i.cur{background:var(--fy)}
.vopts .chip[aria-pressed="true"] small{color:var(--on-fluo)}
.banner{border:2px solid var(--stroke);background:var(--fb);color:var(--on-fluo);box-shadow:var(--sh-s)}
.banner b{color:var(--on-fluo)}
.warnbox{border:2px solid var(--stroke);background:var(--fo);color:var(--on-fluo)}
.toolbar{border-bottom:2px solid var(--stroke)}
.odds .pct{font-family:var(--display);letter-spacing:-.03em}

/* Fiche latérale */
.sheet{border-left:3px solid var(--stroke);background:var(--paper)}
.sheet-head{background:var(--card);border-bottom:2px solid var(--stroke)}
.sheet-head h2{font-weight:800;letter-spacing:-.025em;font-size:1.35rem}
.close{border:2px solid var(--stroke);border-radius:10px;box-shadow:2px 2px 0 var(--shc);font-weight:700}
.sec h3{font-family:var(--display);font-weight:700;font-size:1.05rem;letter-spacing:-.02em}
.sheet-body>.sec+.sec{border-top:2px dashed var(--line)}
.fact .v{font-family:var(--display);letter-spacing:-.03em}
.scrim{background:rgba(10,11,36,.55)}

/* Haut de page, pied de page */
.totop{border:2px solid var(--stroke);background:var(--fy);color:var(--on-fluo);box-shadow:var(--sh-s)}
.totop:hover{color:var(--on-fluo);border-color:var(--stroke);transform:translate(-1px,-1px)}
footer{background:var(--mast);color:var(--mast-muted);border-top:0}
footer b{color:#fff}
@media (prefers-reduced-motion:reduce){.tcard,.mc,.utile,.row,.ec,.xc,.pep,.btn{transition:none}.tcard:hover,.mc:hover,.utile:hover,.row:hover,.ec:hover,.xc:hover,.pep:hover,.btn:hover{transform:none}}
@media (max-width:640px){
  .tkpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .tkpis b{white-space:normal}
  .osec>h3 .hl{transform:rotate(-.8deg)}
  .tabs{border-width:1.5px}
}

/* ---------- Pages test (v19) : Types, Métiers, Après le bac ---------- */
/* Points d'entrée (Types) */
.entry{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:16px;margin:0 0 34px;padding:22px;border:2px dashed var(--stroke);border-radius:20px;background:var(--card)}
.entry-q{grid-column:1/-1;margin:0;font-family:var(--display);font-weight:700;font-size:1.05rem;letter-spacing:-.02em}
.entry-b{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;gap:6px;padding:16px 18px 14px;border:2px solid var(--stroke);border-radius:16px;background:var(--card);box-shadow:var(--sh);position:relative;transition:transform .12s,box-shadow .12s}
.entry-b::before{content:"";position:absolute;left:14px;right:14px;top:-2px;height:10px;background:var(--tape);border:2px solid var(--stroke);border-top:0;border-radius:0 0 8px 8px}
.entry-b b{font-family:var(--display);font-size:1.02rem;letter-spacing:-.02em;margin-top:8px;line-height:1.2}
.entry-b span{font-size:.9rem;color:var(--muted);line-height:1.4}
.entry-b em{font-style:normal;font-weight:700;font-size:.85rem;margin-top:auto;padding-top:4px}
.entry-b:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--shc)}
.entry-b:focus-visible{outline:3px solid var(--encre);outline-offset:3px}
.entry-b[aria-pressed="true"]{background:var(--tape);color:var(--on-fluo)}
.entry-b[aria-pressed="true"] span{color:var(--on-fluo)}
/* Sélecteur de famille */
.famswitch{display:flex;flex-wrap:wrap;gap:10px;margin:6px 0 10px}
.fsw{border:2px solid var(--stroke);background:var(--card);color:var(--ink);border-radius:999px;padding:.5rem 1rem;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:8px;font-size:.95rem}
.fsw .num{font-size:.8rem;background:var(--paper);border:1.5px solid var(--line);border-radius:999px;padding:0 .45rem}
.fsw[aria-pressed="true"]{background:var(--ink);color:var(--paper);box-shadow:3px 3px 0 var(--fc,var(--encre))}
.fsw[aria-pressed="true"] .num{background:transparent;color:var(--paper);border-color:var(--paper)}
.fsw .fdot{width:12px;height:12px;border-radius:50%;border:1.5px solid var(--stroke)}
/* Carte des études : barres plus franches */
.tm-bar{height:13px;top:1.5px;border:1.5px solid var(--stroke);border-radius:7px}
.tm-row{min-height:27px}
.tm-fam{font-family:var(--display);letter-spacing:-.02em}

/* Fiche de renseignements (Métiers) */
.fiche{display:block;background:var(--card);border:2px solid var(--stroke);border-radius:18px;box-shadow:var(--sh);margin:26px 0 0;overflow:hidden}
.fiche-head{padding:18px 24px 14px;background:var(--fy);color:var(--on-fluo);border-bottom:2px solid var(--stroke);display:flex;flex-wrap:wrap;gap:4px 18px;align-items:baseline}
.fiche-t{margin:0;font-family:var(--display);font-weight:800;font-size:1.25rem;letter-spacing:-.025em}
.fiche-head .note{margin:0;color:var(--on-fluo);opacity:.85}
.fiche-row{display:grid;grid-template-columns:230px minmax(0,1fr);border-bottom:1.5px dashed var(--line)}
.fiche-lab{padding:18px 18px 18px 24px;border-right:2px solid var(--margin-red);display:flex;flex-direction:column;gap:3px}
.fiche-lab b{font-size:1.02rem}
.fiche-lab span{font-size:.85rem;color:var(--muted);line-height:1.35}
.fiche-in{padding:16px 20px;min-width:0}
.fiche-in .morechips{margin-top:10px}
.fiche-foot{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;justify-content:space-between;padding:16px 24px;background:var(--paper)}
.fiche-foot p{margin:0;font-size:1.05rem}
.fiche-foot b{font-family:var(--display);font-size:1.6rem;letter-spacing:-.03em;margin-right:4px}
#mR .chip .note{color:inherit;opacity:.8}
.chip .rl{display:inline-grid;place-items:center;width:1.5em;height:1.5em;border:1.5px solid var(--stroke);border-radius:6px;background:var(--fb);color:var(--on-fluo);margin-right:6px;font-size:.85em}
@media (max-width:700px){.fiche-row{grid-template-columns:minmax(0,1fr)}.fiche-lab{border-right:0;border-bottom:2px solid var(--margin-red);padding:14px 16px 10px}.fiche-in{padding:12px 16px 16px}.fiche-head,.fiche-foot{padding-left:16px;padding-right:16px}}
/* Bulle de résultats */
.mfloat{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:14;display:flex;gap:12px;align-items:center;background:var(--ink);color:var(--paper);border:2px solid var(--stroke);border-radius:999px;padding:8px 8px 8px 18px;box-shadow:4px 4px 0 var(--fy)}
.mfloat b{font-family:var(--display)}
.mfloat .btn{background:var(--fy);color:var(--on-fluo);box-shadow:none;border-color:var(--paper)}
/* Univers */
.utile{position:relative;padding-top:26px}
.utile::before{content:"";position:absolute;left:16px;right:16px;top:-2px;height:10px;background:var(--tape);border:2px solid var(--stroke);border-top:0;border-radius:0 0 8px 8px}
.utile[aria-pressed="true"]{background:var(--tape)}
.utile .ukp b{font-family:var(--display);font-size:1.3rem;letter-spacing:-.03em}
.utile h4{font-size:1.08rem}
/* Cartes métier */
.lvl{display:inline-block;font-weight:700;font-size:.8rem;padding:.15rem .6rem;border:1.5px solid var(--stroke);border-radius:999px;background:var(--tape);color:var(--on-fluo)}
.price{display:inline-flex;align-items:baseline;gap:2px;font-weight:700;font-size:.9rem;padding:.12rem .7rem .12rem 1.05rem;border:1.5px solid var(--stroke);background:var(--card);color:var(--ink);
  clip-path:polygon(10px 0,100% 0,100% 100%,10px 100%,0 50%);border-radius:0 6px 6px 0;position:relative}
.price::before{content:"";position:absolute;left:8px;top:50%;width:5px;height:5px;margin-top:-2.5px;border-radius:50%;background:var(--stroke)}
.price small{font-weight:400;font-size:.75rem;color:var(--muted)}
.rls{display:inline-flex;gap:3px}
.rls i{font-style:normal;display:inline-grid;place-items:center;width:1.55em;height:1.55em;border:1.5px solid var(--stroke);border-radius:6px;font-family:var(--display);font-weight:700;font-size:.72rem;background:var(--fb);color:var(--on-fluo)}
.rls i+i{background:var(--card);color:var(--ink)}
.mc .uv{font-weight:700;color:var(--muted)}

/* Après le bac : bac et familles en cartes */
#bacPills{gap:10px}
#bacPills .chip{font-size:1.02rem;padding:.65rem 1.2rem;min-height:46px}
.famcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:20px}
.fam2{background:var(--card);border:2px solid var(--stroke);border-radius:16px;box-shadow:var(--sh-s);padding:22px 22px 20px;display:flex;flex-direction:column;gap:14px;position:relative;min-width:0}
.fam2::before{content:"";position:absolute;left:16px;width:64px;top:-2px;height:10px;background:var(--tape);border:2px solid var(--stroke);border-top:0;border-radius:0 0 8px 8px}
.fam2 header{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:baseline;justify-content:space-between;margin-top:4px}
.fam2 h4{margin:0;font-family:var(--display);font-weight:700;font-size:1.1rem;letter-spacing:-.02em;line-height:1.2}
.selb{font-size:.78rem;font-weight:700;border:1.5px solid var(--stroke);border-radius:999px;padding:.08rem .55rem}
.gauge{display:grid;gap:6px}
.g-top{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.g-top b{font-family:var(--display);font-size:2rem;letter-spacing:-.04em;line-height:1}
.g-top span{font-size:.86rem;color:var(--muted);flex:1 1 140px}
.zone{font-style:normal;font-weight:700;font-size:.8rem;border:1.5px solid var(--stroke);border-radius:999px;padding:.1rem .55rem;background:var(--z);color:var(--on-fluo)}
.g-track{position:relative;height:14px;border:2px solid var(--stroke);border-radius:8px;background:linear-gradient(90deg,var(--fp) 0 35%,var(--fy) 35% 70%,var(--fg) 70%)}
.g-track i{position:absolute;top:-7px;bottom:-7px;width:6px;margin-left:-3px;background:var(--ink);border:2px solid var(--card);border-radius:3px}
.g-leg{display:flex;justify-content:space-between;font-size:.74rem;color:var(--muted)}
.f2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 14px;margin:0;padding:12px 0;border-block:2px dashed var(--line)}
.f2 dt{font-size:.8rem;color:var(--muted);line-height:1.3}
.f2 dd{margin:2px 0 0;font-family:var(--display);font-weight:700;font-size:1.15rem;letter-spacing:-.03em}
.mix2{display:grid;gap:6px}
.mix2 .mixbar{height:14px;border:1.5px solid var(--stroke);border-radius:7px}
.mix2 .mixbar div+div{border-left:1.5px solid var(--stroke)}
.mix2 .legend{margin-top:0}
.mix2 .legend i{border:1.5px solid var(--stroke)}
.fam2 .after{margin:0;font-size:.9rem;line-height:1.5}
.fam2 .btn{align-self:flex-start;margin-top:auto}
.famctrl{justify-content:space-between}
/* Liste de vœux en 10 cases */
.vbal{display:flex;height:14px;border:2px solid var(--stroke);border-radius:8px;overflow:hidden;flex:1 1 200px;max-width:360px}
.vbal div+div{border-left:2px solid var(--stroke)}
#vList{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:12px}
.vitem{border-left-width:10px}
.vitem[data-cat="s"]{border-left-color:var(--fg)}.vitem[data-cat="r"]{border-left-color:var(--fy)}.vitem[data-cat="a"]{border-left-color:var(--fp)}
.vslot{border:2px dashed var(--line);border-radius:14px;min-height:64px;display:grid;place-items:center;color:var(--muted);font-weight:700;font-size:.9rem}
.vempty{grid-column:1/-1;order:-1;margin:0}
/* Agenda Parcoursup */
.agenda{list-style:none;margin:0;padding:6px 4px 14px;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,1fr);gap:16px;overflow-x:auto}
.agenda li{background:var(--card);border:2px solid var(--stroke);border-radius:14px;box-shadow:var(--sh-s);display:flex;flex-direction:column;overflow:hidden;position:relative}
.agenda li b{display:block;background:var(--fb);color:var(--on-fluo);font-family:var(--display);font-size:.95rem;letter-spacing:-.02em;padding:10px 14px;border-bottom:2px solid var(--stroke);
  background-image:radial-gradient(circle at 12px 50%,var(--card) 3.5px,transparent 4px),radial-gradient(circle at calc(100% - 12px) 50%,var(--card) 3.5px,transparent 4px)}
.agenda li span{padding:12px 14px 16px;font-size:.92rem;line-height:1.5}
.agenda li.next{box-shadow:5px 5px 0 var(--encre);border-color:var(--stroke)}
.agenda li.next b{background-color:var(--fy)}
.agenda .here{display:block;font-size:.78rem;font-weight:700;padding:.3rem 14px;background:var(--ink);color:var(--paper)}
@media (max-width:640px){.agenda{grid-auto-columns:78%}}
/* Réponses en tampons */
.stamps{gap:18px}
.stamps div{border:3px double var(--stroke)!important;border-radius:12px;box-shadow:none!important;background:var(--card);transform:rotate(-1deg)}
.stamps div:nth-child(even){transform:rotate(1deg)}
.stamps b{display:table!important;font-family:var(--display)!important;font-size:1.15rem!important;padding:.15rem .6rem;border:2px solid var(--stroke);border-radius:8px;margin-bottom:10px!important;color:var(--on-fluo)}
.stamps div:nth-child(1) b{background:var(--fg)}.stamps div:nth-child(2) b{background:var(--fy)}.stamps div:nth-child(3) b{background:var(--fb)}.stamps div:nth-child(4) b{background:var(--fp)}
/* Post-it et plan B */
.postits,.planb{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:20px}
.postits li{background:var(--fy);color:var(--on-fluo);padding:20px 18px 22px;border:2px solid var(--stroke);border-radius:4px 4px 18px 4px;box-shadow:var(--sh-s);transform:rotate(-1.2deg);display:flex;flex-direction:column;gap:6px;font-size:.95rem;line-height:1.5}
.postits li:nth-child(2){background:var(--fp);transform:rotate(1deg)}.postits li:nth-child(3){background:var(--fg);transform:rotate(-.6deg)}.postits li:nth-child(4){background:var(--fb);transform:rotate(1.3deg)}
.postits li b{font-family:var(--display);font-size:1.02rem;letter-spacing:-.02em}
.postits li span b{font-family:inherit;font-size:inherit;letter-spacing:normal}
.planb li{background:var(--card);border:2px solid var(--stroke);border-radius:14px;box-shadow:var(--sh-s);padding:18px;display:flex;flex-direction:column;gap:6px;font-size:.95rem;line-height:1.5}
.planb li b{font-family:var(--display);font-size:1rem;letter-spacing:-.02em;display:inline-block;align-self:flex-start;background:var(--fo);color:var(--on-fluo);border:1.5px solid var(--stroke);border-radius:6px;padding:.1rem .5rem}
@media (prefers-reduced-motion:reduce){.entry-b{transition:none}.entry-b:hover{transform:none}}
.bname{font-family:var(--display);margin:0;line-height:1.15} /* nom du site quand le h1 est le titre de la page (pages générées) */
.home-link{color:inherit;text-decoration:none;border-radius:10px}
.ohero .chapo{font-size:clamp(1.15rem,2.2vw,1.25rem);line-height:1.5;max-width:62ch;margin:0 0 .5rem;color:var(--ink);font-weight:400} /* phrase de présentation officielle : couleur du texte principal, pas atténuée */
.tab,.subnav a{text-decoration:none;display:inline-flex;align-items:center;justify-content:center}
.tab-long{white-space:pre} /* « Choisir une formation » : dans un onglet en flex, l'espace en tête du span serait supprimée */
/* Contenus explicatifs (Après la 3e) : l'essentiel, étapes, questions fréquentes */
/* Citations en exergue (figure.exergue) : elles coupent les sections denses ; couleur par --tone. Encart de contexte (aside.contexte). */
.exergue{margin:36px auto;max-width:780px;padding:26px 30px 22px 70px;position:relative;background:var(--tone,var(--fy));color:var(--on-fluo);border:2px solid var(--stroke);border-radius:6px 22px 6px 22px;box-shadow:var(--sh);transform:rotate(-.7deg)}
.exergue.tilt{transform:rotate(.6deg)}
.exergue::before{content:"«";position:absolute;left:18px;top:10px;font-family:var(--display);font-size:3.4rem;line-height:1}
.exergue blockquote{margin:0}
.exergue blockquote p{margin:0;font-family:var(--display);font-size:clamp(1.1rem,2.4vw,1.45rem);line-height:1.3;letter-spacing:-.02em;text-wrap:balance}
.exergue figcaption{margin-top:12px;font-size:.92rem}
.exergue .ex-suite{margin:12px 0 0;padding-top:10px;border-top:2px dashed currentColor;font-size:.95rem}
.exergue a{color:inherit;font-weight:700;text-decoration-thickness:2px;text-underline-offset:2px}
.exergue.chiffre{padding-left:30px}
.exergue.chiffre::before{content:none}
.exergue .big{display:block;font-family:var(--display);font-size:clamp(2.4rem,7vw,3.4rem);line-height:1;margin-bottom:6px}
.contexte{margin:36px 0;padding:22px 24px;background:var(--card);border:2px solid var(--stroke);border-radius:14px;box-shadow:var(--sh-s);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:8px 30px;align-items:center}
.contexte>*{min-width:0}
.contexte .ctx-kick{margin:0 0 6px;font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--encre)}
.contexte h3{font-size:1.15rem;margin-bottom:10px}
.contexte p{margin:0 0 10px}
.contexte .exergue{margin:10px 6px}
@media (max-width:700px){.contexte{grid-template-columns:minmax(0,1fr);padding:18px 16px}
  .exergue{padding:22px 18px 18px 50px;margin:28px 4px;transform:none}.exergue.tilt{transform:none}.exergue::before{left:12px;font-size:2.6rem}.exergue.chiffre{padding-left:18px}}
/* Pages métiers (A-Z, salaires, secteurs) */
.mslist{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.mslist li{min-width:0}.mslist .mn{font-weight:700;color:var(--encre);background:none;border:0;padding:0;cursor:pointer;text-align:left;font-size:1rem}
.mslist .mn:hover{text-decoration:underline}.mslist .acc{display:block;font-size:.88rem;color:var(--muted);margin-top:2px}
.mscols{columns:2 280px;column-gap:28px}.mscols li{break-inside:avoid;margin-bottom:6px}
.msletters{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}.msletters a{display:inline-grid;place-items:center;min-width:2.2em;height:2.2em;border:2px solid var(--stroke);border-radius:8px;font-weight:800;font-family:var(--display);color:var(--ink);text-decoration:none;background:var(--card)}
.msletters a:hover{background:var(--fy);color:var(--on-fluo)}
/* Pages de type de formation : fil d'Ariane, liens de l'index */
.crumbs{font-size:.86rem;color:var(--muted);margin:14px 0 0}.crumbs a{color:var(--encre);font-weight:700}
.tplinks{display:flex;flex-wrap:wrap;gap:6px 14px;margin:0}.tplinks a{color:var(--encre);font-weight:700}
#exTp .tmeta{margin-top:12px}
/* Barre « Pour aller plus loin » de M'orienter (pages thématiques) */
.topicnav{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;padding:10px 0 4px}
.topicnav .topic-lab{font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-right:4px}
.topicnav a{font-weight:700;font-size:.9rem;color:var(--ink);text-decoration:none;padding:.32rem .8rem;border:2px solid var(--stroke);border-radius:999px;background:var(--card)}
.topicnav a:hover{background:var(--fb);color:var(--on-fluo)}
.topicnav a[aria-current="page"]{background:var(--fy);color:var(--on-fluo)}
@media (max-width:640px){.topicnav{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.topicnav a{flex:none}}
/* Recherche avec autocomplétion (gs…) : bandeau, barre fixe, catalogue */
.gsearch{position:relative}
.gs-list{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:30;margin:0;padding:6px;list-style:none;background:var(--card);color:var(--ink);border:2px solid var(--stroke);border-radius:12px;box-shadow:var(--sh);max-height:min(70vh,480px);overflow:auto;text-align:left}
.gs-h{font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);padding:8px 10px 4px}
.gs-o{display:flex;flex-direction:column;gap:1px;padding:8px 10px;border-radius:8px;cursor:pointer}
.gs-o[aria-selected="true"],.gs-o:hover{background:var(--fy);color:var(--on-fluo)}
.gs-o[aria-selected="true"] .gs-s,.gs-o:hover .gs-s{color:var(--on-fluo)}
.gs-l{font-weight:700;overflow-wrap:anywhere}
.gs-s{font-size:.82rem;color:var(--muted)}
.gs-fix{padding:6px 10px 2px;font-size:.85rem;color:var(--muted)}
.gs-none{padding:10px;font-size:.9rem;color:var(--muted)}
.masthead .gsearch{flex:1 1 100%;max-width:760px}
.masthead .gsearch input{border-color:#fff}
.gsearch input{color:var(--ink)} .gsearch input::placeholder{color:var(--muted);opacity:1} /* le bandeau et la barre fixe sont en texte blanc : le champ garde l'encre du thème */
.minibar .gsearch{flex:1 1 auto;max-width:440px}
.minibar .gsearch input{padding-block:.42rem;font-size:.92rem}
@media (max-width:900px){.minibar .gsearch{display:none}}
.mgroup{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.mgroup li{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px}
.essentiel{background:var(--card);border:2px solid var(--stroke);border-radius:14px;box-shadow:var(--sh-s);padding:18px 22px;margin:22px 0 6px;max-width:900px}
.essentiel h3{font-size:1.1rem;margin-bottom:8px}
.essentiel ul{margin:0;padding-left:1.1rem;display:grid;gap:6px}
.essentiel li::marker{color:var(--encre)}
.steps{grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))}
.faq{display:grid;gap:10px;max-width:900px}
.faq details{background:var(--card);border:2px solid var(--stroke);border-radius:14px}
.faq details[open]{box-shadow:var(--sh-s)}
.faq summary{cursor:pointer;padding:14px 18px;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:12px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--display);font-size:1.3rem;line-height:1;flex:none}
.faq details[open] summary::after{content:"−"}
.faq details>div{padding:0 18px 16px}
.faq p{margin:0;max-width:70ch}
.faq a,.essentiel a,.dipbox .note a{color:var(--encre);font-weight:700}
.postits a{color:inherit;font-weight:700;text-decoration-thickness:2px;text-underline-offset:2px}
.planb a{color:var(--encre);font-weight:700}
.tfilters,.tfilters .trow,.tfilters .trow>*{min-width:0} .tfilters select{max-width:100%} .filters .chip,.ctrls .chip,.pick .chip{max-width:100%;white-space:normal;text-align:left} /* menus aux intitulés longs : le panneau de filtres tient à 360 px */
.efiltre{margin:0;max-width:78ch;color:var(--ink);border-left:4px solid var(--fy);padding:2px 0 2px 12px}
.etab-cmp td{font-family:var(--body);font-size:.92rem;font-weight:400;white-space:normal;min-width:150px}
.etab-cmp td .sub,.etab-cmp th .sub{display:block;font-size:.78rem;color:var(--muted);margin-top:3px;font-weight:400}
.etab-cmp tbody th{min-width:170px;color:var(--ink)}
.etab-cmp thead th:nth-child(2),.etab-cmp td:nth-child(2){background:none;color:inherit}
.faq details.dom summary .note{font-weight:400;white-space:nowrap} /* nombre de métiers à la suite du titre du domaine */
