
:root{--papier:#f3efe6;--papier2:#ebe5d8;--carte:#fbf9f4;--encre:#16202a;--doux:#4f5b66;--pale:#7c8792;--filet:#d8d0bf;
--sodium:#e39410;--sodium2:#f6b545;--erable:#b8321f;--epinette:#1d7552;--fleur:#1b4f9c;--nuit:#0e151c;--nuit2:#17222c;--tuile:#fbf6e9;
--disp:"Barlow Condensed","Arial Narrow",Impact,sans-serif;--mono:"IBM Plex Mono",ui-monospace,Consolas,monospace;
--txt:"PT Serif",Georgia,"Times New Roman",serif;--r:14px;color-scheme:light dark}
@media (prefers-color-scheme:dark){:root{--papier:#0f161d;--papier2:#141d26;--carte:#18232d;--encre:#ece6d9;--doux:#b3b8bb;--pale:#8b949b;
--filet:#2b3946;--sodium:#ffb43a;--sodium2:#ffcc70;--erable:#ff7559;--epinette:#4fcf98;--fleur:#9dbdff;--tuile:#fff4dc}}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:clip;scroll-padding-top:16px}
body{margin:0;background:var(--papier);color:var(--encre);font:17.5px/1.85 var(--txt);overflow-x:hidden}
a{color:var(--fleur);text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
b,strong{font-family:var(--disp);font-weight:700;font-size:1.08em;letter-spacing:.01em}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;z-index:60;background:var(--sodium);color:#000;padding:8px 12px;border-radius:8px}
:focus-visible{outline:3px solid var(--sodium);outline-offset:3px}
.num,td.n,.m{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.01em}

/* --- cabecera --- */
.cab{background:var(--nuit);color:#ece6d9}
.cab-in{max-width:1180px;margin:0 auto;padding:10px 16px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.logo{display:inline-flex;align-items:center;gap:10px;color:#fff;text-decoration:none;margin-right:auto}
.logo svg{width:34px;height:34px;flex:none}
.logo b{font:700 27px/1 var(--disp);letter-spacing:.06em;text-transform:uppercase}
.logo small{display:block;font:500 10.5px/1.2 var(--mono);color:#9aa6b1;letter-spacing:.04em;text-transform:none}
.langue{display:flex;gap:2px;background:rgba(255,255,255,.07);border-radius:999px;padding:3px}
.langue a,.langue span{min-width:42px;height:34px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;font:500 12.5px/1 var(--mono);color:#c9d0d6;text-decoration:none}
.langue span{background:var(--sodium2);color:#1a1205}
.menu{width:100%;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:0 16px}
.menu::-webkit-scrollbar{display:none}
.menu ul{list-style:none;display:flex;gap:6px;margin:0;padding:4px 0 2px}
.menu a{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;height:40px;padding:0 14px;border-radius:10px;background:rgba(255,255,255,.06);color:#e8e2d4;text-decoration:none;font:700 15.5px/1 var(--disp);letter-spacing:.05em;text-transform:uppercase}
.menu a svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.menu a[aria-current]{background:var(--sodium2);color:#1a1205}
@media (min-width:900px){.menu{width:auto;margin:0;padding:0;order:0}.cab-in{flex-wrap:nowrap}}

/* --- hero: la enseigne --- */
.hero{background:radial-gradient(120% 90% at 50% 0%,#24313c 0%,var(--nuit) 62%);color:#ece6d9;padding:18px 16px 30px;position:relative;overflow:hidden}
.hero::after{content:"";position:absolute;inset:auto -10% -40px -10%;height:80px;background:radial-gradient(50% 100% at 50% 0%,rgba(255,180,58,.20),rgba(255,180,58,0));pointer-events:none}
.hero-in{max-width:1180px;margin:0 auto;display:grid;gap:18px;position:relative;z-index:1}
.fil{font:500 12.5px/1.5 var(--mono);color:#9aa6b1;margin:0;display:block}
.fil a{color:#c9d3dc}
.fil span{opacity:.6;margin:0 6px}
.hero h1{font:700 clamp(30px,7.6vw,52px)/1.02 var(--disp);letter-spacing:.01em;margin:4px 0 0;text-transform:uppercase;color:#fff}
.hero h1 em{font-style:normal;color:var(--sodium2)}
.enseigne{background:#0a0f14;border-radius:18px;padding:14px 14px 12px;box-shadow:0 0 0 3px #26323d,0 0 0 9px #0a0f14,0 18px 50px rgba(0,0,0,.55),0 0 90px rgba(255,180,58,.16);max-width:560px;width:100%}
.ens-tete{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font:700 13px/1 var(--disp);letter-spacing:.16em;text-transform:uppercase;color:var(--sodium2);padding:2px 4px 10px}
.ens-tete i{font-style:normal;color:#7f8b96;letter-spacing:.06em;font-family:var(--mono);font-weight:500;font-size:11px}
.rangee{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;padding:7px 4px;border-bottom:1px solid #1d2832}
.rangee:last-child{border-bottom:0}
.rangee .lab{font:700 clamp(17px,4.6vw,22px)/1 var(--disp);letter-spacing:.12em;text-transform:uppercase;color:#e6dfd0}
.rangee .lab small{display:block;font:500 11px/1.4 var(--mono);letter-spacing:0;text-transform:none;color:#8a96a1;margin-top:4px}
.tuiles{display:flex;gap:4px;align-items:flex-start}
.tuiles span{display:inline-grid;place-items:center;width:clamp(30px,8.4vw,44px);height:clamp(42px,11.6vw,60px);background:var(--tuile);color:#121212;border-radius:5px;
font:700 clamp(32px,9vw,50px)/1 var(--disp);box-shadow:inset 0 -3px 0 rgba(0,0,0,.12),0 0 18px rgba(255,200,110,.18)}
.tuiles span.sep{width:auto;background:none;box-shadow:none;color:var(--tuile);font-size:clamp(24px,6vw,34px);align-self:flex-end;padding-bottom:4px}
.tuiles span.dixieme{width:clamp(20px,5.4vw,28px);height:clamp(26px,7vw,36px);font-size:clamp(20px,5.6vw,30px)}
.rangee.vide .tuiles span{background:#1d2731;color:#5d6b77}
.etat{display:flex;flex-wrap:wrap;gap:8px 16px;font:500 12.5px/1.5 var(--mono);color:#aab4bd}
.etat .pt{display:inline-block;width:8px;height:8px;border-radius:50%;background:#43c58e;margin-right:7px;box-shadow:0 0 0 0 rgba(67,197,142,.6);animation:bat 2.4s infinite}
@keyframes bat{70%{box-shadow:0 0 0 9px rgba(67,197,142,0)}100%{box-shadow:0 0 0 0 rgba(67,197,142,0)}}
@media (prefers-reduced-motion:reduce){.etat .pt{animation:none}}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 14px;border-radius:12px;background:rgba(255,255,255,.07);color:#f1ead9;text-decoration:none;font:700 16px/1.15 var(--disp);letter-spacing:.04em;text-transform:uppercase;border:0;cursor:pointer}
.chip svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.chip.fort{background:var(--sodium2);color:#1a1205}
.chip .num{font-size:14px;text-transform:none;letter-spacing:0}
.hero-tete{grid-area:tete}.hero-txt{grid-area:txt;display:grid;gap:14px}.enseigne{grid-area:ens}
.hero-in{grid-template-areas:"tete" "ens" "txt"}
@media (min-width:900px){.hero{padding:26px 24px 40px}.hero-in{grid-template-columns:minmax(0,1fr) 560px;grid-template-areas:"tete ens" "txt ens";align-items:start;column-gap:36px;row-gap:14px}}

/* --- jauge (varilla de rango) --- */
.jauge{margin:4px 0 0;max-width:560px}
.jauge svg{width:100%;height:auto;display:block;overflow:visible}
.jauge p{margin:4px 0 0;font:500 12px/1.5 var(--mono);color:#9aa6b1}
.jauge-claire p{color:var(--doux)}

/* --- cuerpo --- */
main{display:block}
.cont{max-width:1180px;margin:0 auto;padding:0 16px}
.prose{max-width:70ch}
.prose p,.prose li{margin:0 0 1.05em}
.premier{margin-top:50px}
h2{font:700 clamp(25px,5.6vw,34px)/1.1 var(--disp);letter-spacing:.015em;text-transform:uppercase;margin:58px 0 14px;color:var(--encre)}
h2 small{display:block;font:500 12.5px/1.5 var(--mono);text-transform:none;letter-spacing:0;color:var(--pale);margin-top:6px}
h3{font:700 21px/1.2 var(--disp);letter-spacing:.03em;text-transform:uppercase;margin:30px 0 8px}
.surtitre{font:500 12.5px/1.4 var(--mono);color:var(--pale);margin:0 0 6px}
.pub{min-height:280px;margin:34px auto 0;max-width:1180px;padding:0 16px;display:flex;flex-direction:column;align-items:stretch}
.pub::before{content:attr(data-l);font:500 10.5px/1 var(--mono);letter-spacing:.12em;color:var(--pale);text-transform:uppercase;text-align:center;padding:6px 0}
.pub>div{flex:1;min-height:250px;border-radius:var(--r);background:repeating-linear-gradient(135deg,transparent 0 12px,rgba(127,127,127,.05) 12px 24px)}
@media (min-width:900px){.pub{min-height:130px}.pub>div{min-height:100px}}

/* --- bordereau (tablas y calculadora con aspecto de albarán) --- */
.bordereau{background:var(--carte);border-radius:var(--r);box-shadow:0 1px 0 rgba(0,0,0,.04),0 10px 30px rgba(22,32,42,.08);position:relative;margin:18px 0;overflow:hidden}
.bordereau::before{content:"";display:block;height:12px;background:radial-gradient(circle at 8px 6px,var(--papier) 3.2px,transparent 3.6px) 0 0/16px 12px repeat-x}
.bord-tete{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:baseline;padding:4px 16px 10px;font:500 12px/1.4 var(--mono);color:var(--pale);border-bottom:1px dashed var(--filet)}
.bord-tete b{font:700 15px/1.2 var(--disp);letter-spacing:.1em;text-transform:uppercase;color:var(--encre)}
.defile{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{border-collapse:collapse;width:100%;font-size:15.5px;line-height:1.45}
th{font:700 13.5px/1.2 var(--disp);letter-spacing:.08em;text-transform:uppercase;color:var(--doux);text-align:left;padding:10px 12px;border-bottom:1px solid var(--filet);white-space:nowrap;cursor:default;background:var(--carte);position:sticky;top:0}
th[data-tri]{cursor:pointer}
th[data-tri]::after{content:" ↕";opacity:.35}
td{padding:9px 12px;border-bottom:1px solid var(--filet);vertical-align:top}
tr:last-child td{border-bottom:0}
td.n,th.n{text-align:right;white-space:nowrap}
td .sous{display:block;font-size:13px;color:var(--pale);line-height:1.35}
tr.moi td{background:rgba(227,148,16,.10)}
.bas{color:var(--epinette)}.haut{color:var(--erable)}
.barre{display:block;height:5px;border-radius:3px;background:var(--papier2);margin-top:5px;position:relative;min-width:60px}
.barre i{position:absolute;top:-2px;width:9px;height:9px;border-radius:50%;background:var(--sodium);transform:translateX(-50%)}
.sceau{display:inline-block;font:700 12px/1 var(--disp);letter-spacing:.12em;text-transform:uppercase;color:var(--erable);padding:5px 8px;border-radius:6px;box-shadow:inset 0 0 0 2px var(--erable);transform:rotate(-3deg)}
.filtres{display:flex;flex-wrap:wrap;gap:8px;padding:10px 16px;border-bottom:1px dashed var(--filet)}
.filtres input,.filtres select{font:16px/1.2 var(--txt);padding:9px 12px;border-radius:10px;border:1px solid var(--filet);background:var(--papier);color:var(--encre);min-height:44px;flex:1 1 180px}
.compte{font:500 12px/1 var(--mono);color:var(--pale);align-self:center}
.pied-tab{padding:10px 16px;font:500 12px/1.5 var(--mono);color:var(--pale);background:rgba(127,127,127,.06)}

/* --- carte --- */
.carte{background:var(--nuit);border-radius:20px;padding:12px;color:#e6dfd0;position:relative;margin:18px 0 0;box-shadow:0 18px 44px rgba(14,21,28,.25)}
.carte-barre{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:8px}
.carte-barre button{font:700 14px/1 var(--disp);letter-spacing:.07em;text-transform:uppercase;min-height:40px;padding:0 13px;border-radius:10px;border:0;background:rgba(255,255,255,.08);color:#e6dfd0;cursor:pointer}
.carte-barre button[aria-pressed=true]{background:var(--sodium2);color:#1a1205}
.carte-cadre{position:relative}
.carte svg{width:100%;height:auto;display:block}
.carte path{vector-effect:non-scaling-stroke}
.carte path.z{stroke:#0e151c;stroke-width:1.2;cursor:pointer;transition:opacity .15s}
.carte path.z.foc{stroke:#ffcc70;stroke-width:3}
.carte path.z:hover,.carte path.z:focus{opacity:.82;outline:none}
.carte path.z.nd{fill:url(#raye)}
.carte path.ctx{fill:#1b2630;stroke:#0e151c;stroke-width:1}
.carte text{font:700 13px/1 var(--disp);fill:#0e151c;pointer-events:none;letter-spacing:.04em}
.carte canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.legende{display:flex;align-items:center;gap:10px;font:500 12px/1.3 var(--mono);color:#aab4bd;margin-top:8px;flex-wrap:wrap}
.legende .deg{flex:1 1 140px;max-width:260px;height:10px;border-radius:5px;background:linear-gradient(90deg,#4fcf98,#ffcc70,#ff7559)}
.encart{position:absolute;right:8px;top:8px;width:34%;min-width:120px;background:#0a0f14;border-radius:12px;padding:6px;box-shadow:0 0 0 1px #2b3946}
.encart b{display:block;font:700 11px/1 var(--disp);letter-spacing:.12em;text-transform:uppercase;color:var(--sodium2);margin:2px 2px 4px}
.bulle{position:absolute;pointer-events:none;background:#fbf6e9;color:#121212;border-radius:10px;padding:7px 10px;font:500 12.5px/1.4 var(--mono);box-shadow:0 8px 24px rgba(0,0,0,.35);opacity:0;transition:opacity .1s;z-index:5;max-width:240px}
.fiche{display:none;background:var(--carte);color:var(--encre);border-radius:16px;padding:14px 16px;margin-top:10px}
.fiche.ouverte{display:block}
.fiche h3{margin:0 0 6px}
.fiche .ferme{float:right;border:0;background:var(--papier2);color:var(--encre);border-radius:10px;min-width:40px;min-height:40px;font-size:20px;cursor:pointer}
.fiche dl{display:grid;grid-template-columns:auto 1fr;gap:2px 14px;margin:6px 0 10px;font-size:15px}
.fiche dt{color:var(--pale);font:500 12.5px/1.8 var(--mono)}
.fiche dd{margin:0;font-family:var(--mono)}

/* --- graficos --- */
.graphe{background:var(--carte);border-radius:var(--r);padding:12px 12px 8px;margin:18px 0;box-shadow:0 10px 30px rgba(22,32,42,.06)}
.graphe svg{width:100%;max-width:860px;height:auto;display:block;overflow:visible;touch-action:pan-y;margin:0 auto}
.graphe .axe{font:500 11px/1 var(--mono);fill:var(--pale)}
.graphe .grille{stroke:var(--filet);stroke-width:1}
.graphe .ligne{fill:none;stroke:var(--sodium);stroke-width:2.2;stroke-linejoin:round}
.graphe .ligne2{fill:none;stroke:var(--fleur);stroke-width:1.6;stroke-dasharray:4 3}
.graphe .aire{fill:var(--sodium);opacity:.10}
.graphe .lecture{font:500 12.5px/1.4 var(--mono);color:var(--doux);min-height:20px;margin:4px 2px 0}
.onglets{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:6px}
.onglets button{font:700 14px/1 var(--disp);letter-spacing:.07em;text-transform:uppercase;min-height:38px;padding:0 12px;border-radius:9px;border:0;background:var(--papier2);color:var(--encre);cursor:pointer}
.onglets button[aria-pressed=true]{background:var(--encre);color:var(--papier)}

/* --- piezas --- */
.faits{list-style:none;padding:0;margin:18px 0;display:grid;gap:10px}
.faits li{background:var(--carte);border-radius:12px;padding:12px 14px 12px 46px;position:relative;box-shadow:0 4px 14px rgba(22,32,42,.05)}
.faits li svg{position:absolute;left:14px;top:15px;width:20px;height:20px;fill:none;stroke:var(--sodium);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.nuage{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0;padding:0;list-style:none}
.nuage a{display:inline-flex;gap:8px;align-items:baseline;padding:8px 12px;border-radius:10px;background:var(--carte);text-decoration:none;color:var(--encre);box-shadow:0 2px 8px rgba(22,32,42,.06);min-height:44px;align-items:center}
.nuage a .num{font-size:13px;color:var(--doux)}
.grille-liens{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px;margin:14px 0;padding:0;list-style:none}
.grille-liens a{display:block;padding:12px 14px;border-radius:12px;background:var(--carte);text-decoration:none;color:var(--encre);box-shadow:0 2px 10px rgba(22,32,42,.06);height:100%}
.grille-liens a b{display:block;font-size:19px;text-transform:uppercase;letter-spacing:.04em}
.grille-liens a span{font:500 13px/1.5 var(--mono);color:var(--doux)}
details.faq{background:var(--carte);border-radius:12px;margin:10px 0;padding:0 16px;box-shadow:0 2px 10px rgba(22,32,42,.05)}
details.faq summary{cursor:pointer;font:700 19px/1.3 var(--disp);letter-spacing:.02em;padding:14px 0;list-style:none}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary::after{content:"+";float:right;color:var(--sodium);font-size:22px}
details.faq[open] summary::after{content:"−"}
details.faq p{margin:0 0 14px;max-width:70ch}
.encadre{background:var(--papier2);border-radius:var(--r);padding:16px 18px;margin:20px 0;max-width:76ch}
.encadre p{margin:0 0 .7em}.encadre p:last-child{margin:0}
.signal{display:grid;gap:4px;background:var(--nuit);color:#ece6d9;border-radius:18px;padding:18px;margin:18px 0;max-width:640px}
.signal .gros{font:700 clamp(34px,9vw,54px)/1 var(--disp);text-transform:uppercase;letter-spacing:.02em}
.signal .gros.baisse{color:#4fcf98}.signal .gros.hausse{color:#ff7559}.signal .gros.stable{color:var(--sodium2)}
.signal p{margin:0;font:500 13px/1.6 var(--mono);color:#aab4bd}
.calc{display:grid;gap:12px;padding:14px 16px}
.calc label{font:700 14px/1.2 var(--disp);letter-spacing:.08em;text-transform:uppercase;color:var(--doux);display:grid;gap:6px}
.calc input,.calc select{font:18px/1.2 var(--mono);padding:10px 12px;border-radius:10px;border:1px solid var(--filet);background:var(--papier);color:var(--encre);min-height:48px}
.calc output{font:700 34px/1.1 var(--disp);color:var(--encre)}
@media (min-width:700px){.calc{grid-template-columns:repeat(3,1fr);align-items:end}}
.pres-btn{margin-top:10px}
.liste-pres{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:6px}
.liste-pres li{background:var(--carte);color:var(--encre);border-radius:10px;padding:9px 12px;display:grid;grid-template-columns:1fr auto;gap:2px 10px;font-size:15px}
.liste-pres li .num{font-size:18px;font-weight:500}
.liste-pres li small{grid-column:1/-1;color:var(--pale);font:500 12px/1.4 var(--mono)}
.voisins{display:flex;gap:8px;flex-wrap:wrap}
@media (max-width:560px){table{font-size:14.5px}td,th{padding:8px 6px}table.st td:first-child,table.st th:first-child{display:none}
.barre{min-width:40px}td .sous{font-size:12.5px}.premier{margin-top:44px}}

/* --- pie --- */
.pied{background:var(--nuit);color:#b9c1c8;margin-top:80px;padding:34px 16px 40px;font-size:15px;line-height:1.75}
.pied-in{max-width:1180px;margin:0 auto;display:grid;gap:22px}
.pied a{color:#e6dfd0}
.pied h2{color:#fff;font-size:20px;margin:0 0 8px}
.pied ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.pied .legal{font-size:13.5px;color:#8f99a2;max-width:90ch}
@media (min-width:900px){.pied-in{grid-template-columns:2fr 1fr 1fr}}
@media (min-width:900px){body{font-size:18px}.cont{padding:0 24px}}
