/* argos.ai · Filières — charte Le Canari Noir (site du 06/10/2026) : trois habillages, ardoise par défaut, clair, noir.
   Titres Cormorant Garamond · texte Barlow · étiquettes DM Mono · accent jaune canari (foncé sur fond clair pour rester lisible). */
:root{
  --noir:#1b2430; --charbon:#232f3e; --ardoise:#2b394b; --gris:#3c4d63;
  --canari:#f2ce3c; --canari-pale:#f7e07a; --canari-sombre:#d0ad2e;
  --blanc:#eef2f7; --blanc-casse:#a9b8c9; --blanc-f:rgba(238,242,247,.55);
  --trait:rgba(242,206,60,.22); --trait-n:rgba(255,255,255,.08);
  --alerte:#e8765c; --alerte-f:rgba(232,118,92,.16); --bon:#7fc29b; --bon-f:rgba(127,194,155,.14);
  --vide:#2b394b;
  --f-titre:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --f-texte:'Barlow','Segoe UI',system-ui,sans-serif;
  --f-mono:'DM Mono',ui-monospace,Consolas,monospace;
  color-scheme:dark;
}
:root[data-habillage="noir"]{
  --noir:#0a0c0f; --charbon:#111418; --ardoise:#1a1f28; --gris:#2e3540;
  --canari:#e8c832; --canari-pale:#f0d96a; --canari-sombre:#b89e20;
  --blanc:#f4f2ed; --blanc-casse:#c8c4ba; --blanc-f:rgba(244,242,237,.5);
  --trait:rgba(232,200,50,.16); --trait-n:rgba(244,242,237,.08); --vide:#1a1f28;
}
:root[data-habillage="clair"]{
  --noir:#faf8f3; --charbon:#ffffff; --ardoise:#f3f0e7; --gris:#dcd6c8;
  --canari:#84690e; --canari-pale:#63500a; --canari-sombre:#6b5806;
  --blanc:#0f1115; --blanc-casse:#333a44; --blanc-f:rgba(15,17,21,.6);
  --trait:rgba(132,105,14,.32); --trait-n:rgba(20,22,26,.10);
  --alerte:#b2462c; --alerte-f:rgba(178,70,44,.10); --bon:#2f7a52; --bon-f:rgba(47,122,82,.10); --vide:#ece7da;
  color-scheme:light;
}
*{margin:0;padding:0;box-sizing:border-box}
body{background:var(--noir);color:var(--blanc);font-family:var(--f-texte);font-weight:300;font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column}
:focus-visible{outline:2px solid var(--canari);outline-offset:2px}
b,strong{font-weight:500;color:var(--blanc)}
a{color:var(--canari)}
.mono{font-family:var(--f-mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--canari-sombre)}
.note{font-size:.78rem;color:var(--blanc-f);line-height:1.45}
button{font:inherit;color:inherit}

/* En-tête */
.top{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:.7rem clamp(16px,3vw,32px);border-bottom:1px solid var(--trait);position:sticky;top:0;z-index:20;background:var(--noir)}
.marque{display:flex;align-items:center;gap:.7rem}
.logo{font-family:var(--f-titre);font-size:1.55rem;line-height:1;font-weight:600}
.logo span{color:var(--canari)}
.logo em{font-style:italic;font-weight:400;color:var(--blanc-casse);margin-left:.25rem}
.par{font-family:var(--f-mono);font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:var(--blanc-casse);margin-top:.25rem}
.mode{font-family:var(--f-mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--alerte);color:var(--alerte);padding:.3rem .6rem;max-width:34rem}
.themes{display:flex;border:1px solid var(--gris)}
.themes button{background:transparent;border:0;border-right:1px solid var(--gris);color:var(--blanc-casse);font-family:var(--f-mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;padding:.35rem .65rem;cursor:pointer}
.themes button:last-child{border-right:0}
.themes button[aria-pressed="true"]{background:var(--trait);color:var(--canari)}

/* Choix */
.choix{display:flex;flex-wrap:wrap;gap:1rem 1.6rem;align-items:flex-end;padding:1rem clamp(16px,3vw,32px);border-bottom:1px solid var(--trait-n)}
.champ{display:flex;flex-direction:column;gap:.35rem;min-width:0}
.territoire{flex:1;min-width:280px}
.terr-ligne{display:flex;flex-wrap:wrap;gap:.45rem;align-items:center}
select{background:var(--charbon);color:var(--blanc);border:1px solid var(--gris);font-family:var(--f-texte);font-size:.9rem;padding:.42rem .6rem;min-width:12rem;max-width:100%}
.btn-l{background:transparent;border:1px solid var(--gris);color:var(--blanc-casse);font-family:var(--f-mono);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;padding:.5rem .7rem;cursor:pointer}
.btn-l:hover{border-color:var(--canari);color:var(--canari)}
.puces{display:flex;flex-wrap:wrap;gap:.35rem}
.puce{display:inline-flex;align-items:center;gap:.35rem;font-family:var(--f-mono);font-size:.66rem;border:1px solid var(--canari-sombre);color:var(--canari);padding:.25rem .5rem;background:transparent;cursor:pointer}
.puce:hover{background:var(--trait)}
.puce.france{border-color:var(--gris);color:var(--blanc-casse);cursor:default}
.seg{display:flex;border:1px solid var(--gris)}
.seg button{background:transparent;border:0;border-right:1px solid var(--gris);color:var(--blanc-casse);font-size:.84rem;padding:.42rem .75rem;cursor:pointer;white-space:nowrap}
.seg button:last-child{border-right:0}
.seg button[aria-pressed="true"]{background:var(--trait);color:var(--canari)}

/* Onglets */
.onglets{display:flex;gap:0;overflow-x:auto;padding:0 clamp(16px,3vw,32px);border-bottom:1px solid var(--trait-n);scrollbar-width:thin}
.onglets button{background:transparent;border:0;border-bottom:2px solid transparent;padding:.8rem .95rem .7rem;font-family:var(--f-mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--blanc-casse);cursor:pointer;white-space:nowrap}
.onglets button:hover{color:var(--blanc)}
.onglets button[aria-selected="true"]{color:var(--canari);border-bottom-color:var(--canari)}

/* Corps */
.corps{flex:1;display:grid;grid-template-columns:minmax(300px,420px) minmax(0,1fr);gap:0;min-height:0}
.carte-col{border-right:1px solid var(--trait-n);padding:1rem clamp(14px,2vw,22px);display:flex;flex-direction:column;gap:.5rem;position:sticky;top:3.6rem;align-self:start}
.carte-tete{display:flex;flex-direction:column;gap:.15rem}
.aide{font-size:.74rem;color:var(--blanc-f)}
#carte{width:100%;aspect-ratio:1/1;display:block}
#carte path{stroke:var(--noir);stroke-width:.6;cursor:pointer;transition:opacity .15s}
#carte path:hover{opacity:.82}
#carte path.sel{stroke:var(--canari);stroke-width:1.8}
#carte .contour-region{fill:none;stroke:var(--blanc-f);stroke-width:.8;pointer-events:none}
.legende{display:flex;align-items:center;gap:.5rem;font-family:var(--f-mono);font-size:.62rem;color:var(--blanc-casse)}
.legende .rampe{height:8px;flex:1;max-width:160px}
.vue{padding:1.2rem clamp(16px,3vw,32px) 2.5rem;min-width:0;display:flex;flex-direction:column;gap:1.4rem}

/* Blocs de contenu */
.tete-vue{display:flex;flex-direction:column;gap:.35rem}
.tete-vue h1{font-family:var(--f-titre);font-weight:400;font-size:clamp(1.7rem,2.6vw,2.3rem);line-height:1.08;text-wrap:balance}
.tete-vue h1 em{font-style:italic;color:var(--canari)}
.tete-vue p{color:var(--blanc-casse);max-width:80ch;font-size:.95rem}
h2{font-family:var(--f-titre);font-weight:600;font-size:1.35rem;line-height:1.15}
h3{font-family:var(--f-titre);font-weight:600;font-size:1.12rem;line-height:1.2}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--trait-n);border:1px solid var(--trait-n)}
.kpi{background:var(--noir);padding:1rem 1.1rem;display:flex;flex-direction:column;gap:.25rem;min-width:0}
.kpi strong{font-family:var(--f-titre);font-size:2rem;font-weight:600;color:var(--canari);line-height:1;font-variant-numeric:lining-nums tabular-nums}
.kpi span{font-size:.8rem;color:var(--blanc-casse)}
.kpi small{font-family:var(--f-mono);font-size:.62rem;color:var(--blanc-f);letter-spacing:.04em}
.bloc{display:flex;flex-direction:column;gap:.7rem}
.bloc-tete{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;flex-wrap:wrap}
.grille2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem}
.carte-info{border:1px solid var(--gris);background:var(--charbon);padding:1rem 1.1rem;display:flex;flex-direction:column;gap:.5rem}
.carte-info.alerte{border-color:var(--alerte);background:var(--alerte-f)}
.carte-info p{font-size:.88rem;color:var(--blanc-casse)}

/* Tableaux */
.tab-wrap{overflow-x:auto;border:1px solid var(--trait-n)}
table{width:100%;border-collapse:collapse;font-size:.84rem}
th{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--canari-sombre);font-weight:400;text-align:left;padding:.55rem .65rem;border-bottom:1px solid var(--trait);white-space:nowrap;background:var(--charbon);position:sticky;top:0}
th.n,td.n{text-align:right;font-variant-numeric:lining-nums tabular-nums}
td{padding:.5rem .65rem;border-bottom:1px solid var(--trait-n);vertical-align:top}
tr:hover td{background:var(--charbon)}
tr.actif td{background:var(--trait)}
tr.cliquable{cursor:pointer}
td .sous{display:block;font-size:.72rem;color:var(--blanc-f)}
.prio{font-family:var(--f-mono);font-size:.66rem;padding:.1rem .35rem;border:1px solid var(--gris);color:var(--blanc-casse);white-space:nowrap}
.prio.P1{border-color:var(--canari);color:var(--canari)}
.prio.P2{border-color:var(--canari-sombre);color:var(--canari-sombre)}
.etiq{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.06em;text-transform:uppercase;padding:.12rem .4rem;white-space:nowrap}
.etiq.alerte{background:var(--alerte-f);color:var(--alerte);border:1px solid var(--alerte)}
.etiq.bon{background:var(--bon-f);color:var(--bon);border:1px solid var(--bon)}
.etiq.neutre{border:1px solid var(--gris);color:var(--blanc-casse)}
.delta-mauvais{color:var(--alerte);font-weight:500}
.delta-bon{color:var(--bon)}
.faible{color:var(--blanc-f);font-style:italic}
.barre{height:6px;background:var(--ardoise);position:relative;min-width:60px}
.barre i{position:absolute;inset:0 auto 0 0;background:var(--canari)}
.barre i.terr{background:var(--canari)}
.pyramide{display:flex;flex-direction:column;gap:.4rem}
.niv{display:grid;grid-template-columns:2.2rem minmax(0,1fr) 5rem;gap:.7rem;align-items:center}
.niv-tag{font-family:var(--f-mono);font-size:.78rem;text-align:center;padding:.2rem 0;background:var(--canari);color:var(--noir)}
.niv-tag.faible{background:var(--gris);color:var(--blanc);font-style:normal}
.niv-corps{display:flex;flex-direction:column;gap:.2rem;min-width:0}
.niv-corps span{font-size:.84rem}
.niv-n{font-family:var(--f-mono);font-size:.78rem;text-align:right;color:var(--blanc-casse)}
.chips{display:flex;flex-wrap:wrap;gap:.35rem}
.chip{font-family:var(--f-mono);font-size:.66rem;padding:.25rem .55rem;border:1px solid var(--gris);color:var(--blanc-casse)}
.chip b{color:var(--canari);font-weight:500;margin-left:.3rem}
.fiche-texte{max-width:78ch;display:flex;flex-direction:column;gap:.9rem;font-size:.98rem}
.fiche-texte p{color:var(--blanc-casse)}
.fiche-texte h2{margin-top:.6rem}
.fiche-texte ul{padding-left:1.1rem;color:var(--blanc-casse);display:flex;flex-direction:column;gap:.3rem}
.btn-p{align-self:flex-start;background:var(--canari);border:1px solid var(--canari);color:var(--noir);font-family:var(--f-mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;padding:.6rem 1rem;cursor:pointer}
.vide-msg{border:1px dashed var(--gris);padding:1.2rem;color:var(--blanc-casse);font-size:.9rem}
.pied{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:1rem clamp(16px,3vw,32px);border-top:1px solid var(--trait);font-size:.74rem;color:var(--blanc-f)}
.tip{position:fixed;pointer-events:none;background:var(--ardoise);border:1px solid var(--canari-sombre);padding:.5rem .7rem;font-size:.8rem;color:var(--blanc);max-width:18rem;z-index:50;line-height:1.4}
.tip b{color:var(--canari)}

@media (max-width:980px){
  .corps{grid-template-columns:1fr}
  .carte-col{position:static;border-right:0;border-bottom:1px solid var(--trait-n)}
  #carte{max-width:420px;margin:0 auto}
  .grille2{grid-template-columns:1fr}
}
@media (max-width:560px){
  .mode{order:3;max-width:100%}
  .seg button{padding:.42rem .5rem;font-size:.78rem}
  .kpi strong{font-size:1.6rem}
}
@media print{
  .top,.choix,.onglets,.carte-col,.pied,.btn-p{display:none!important}
  body{background:#fff;color:#000}
  .corps{display:block}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* Fiche configurable */
.fiche-reglages{display:flex;flex-wrap:wrap;gap:1rem 1.6rem;align-items:flex-end;border:1px solid var(--trait-n);background:var(--charbon);padding:1rem 1.1rem}
.fiche-reglages .champ{min-width:0}
.chip-btn{font-family:var(--f-mono);font-size:.66rem;padding:.3rem .6rem;border:1px solid var(--gris);color:var(--blanc-casse);background:transparent;cursor:pointer}
.chip-btn[aria-pressed="true"]{border-color:var(--canari-sombre);color:var(--canari);background:var(--trait)}
.fiche-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-left:auto}
.btn-p[disabled]{opacity:.6;cursor:wait}
.fiche-ia h3{font-family:var(--f-titre);font-size:1.3rem;margin-top:.8rem}
.fiche-ia h4{font-family:var(--f-titre);font-size:1.08rem}
.fiche-ia table{font-size:.82rem;margin:.4rem 0}
.fiche-ia td,.fiche-ia th{border:1px solid var(--trait-n);padding:.35rem .5rem}
@media print{.fiche-reglages,.fiche-actions{display:none!important}}

/* Lecture du territoire et panneau de méthode */
.lien-methode{background:none;border:0;padding:0;color:var(--canari);font:inherit;font-size:.86rem;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.pied .lien-methode{font-size:.74rem}
dialog.methode{border:1px solid var(--canari-sombre);background:var(--noir);color:var(--blanc);width:min(92vw,760px);max-height:88vh;padding:0;margin:auto}
dialog.methode::backdrop{background:rgba(0,0,0,.72)}
.methode-corps{padding:1.4rem 1.6rem 1.8rem;display:flex;flex-direction:column;gap:.8rem;overflow-y:auto;max-height:88vh}
.methode-tete{display:flex;justify-content:space-between;align-items:center}
.methode h2{font-family:var(--f-titre);font-weight:400;font-size:1.9rem}
.methode h3{margin-top:.6rem}
.methode p,.methode li{font-size:.92rem;color:var(--blanc-casse)}
.methode ul{padding-left:1.1rem;display:flex;flex-direction:column;gap:.3rem}

/* Vue d'ensemble (11/10/2026) : histogrammes horizontaux, une seule teinte (canari) ; teinte d'alerte réservée aux difficultés */
.histo{display:flex;flex-direction:column;gap:.45rem}
.h-ligne{display:grid;grid-template-columns:minmax(0,13rem) minmax(60px,1fr) 7.5rem;gap:.7rem;align-items:center;padding:.1rem 0}
.h-ligne:hover .h-barre i{filter:brightness(1.15)}
.h-ligne:hover .h-lib{color:var(--blanc)}
.h-lib{font-size:.84rem;color:var(--blanc-casse);line-height:1.25;min-width:0;overflow-wrap:anywhere}
.h-lib small{display:block;font-family:var(--f-mono);font-size:.58rem;color:var(--blanc-f);letter-spacing:.03em}
.h-barre{height:10px;background:var(--ardoise);position:relative}
.h-barre i{position:absolute;inset:0 auto 0 0;background:var(--canari);border-radius:0 3px 3px 0}
.histo.alerte .h-barre i{background:var(--alerte)}
.h-ref{position:absolute;top:-4px;bottom:-4px;width:2px;margin-left:-1px;background:var(--blanc);opacity:.75}
.h-val{font-family:var(--f-mono);font-size:.72rem;text-align:right;color:var(--blanc);font-variant-numeric:tabular-nums;white-space:nowrap}
.h-petit{font-size:.95rem;margin-top:.6rem}
.kpi.kpi-alerte strong{color:var(--alerte)}
.kpis-petits .kpi strong{font-size:1.6rem}
.constitution{border-top:1px solid var(--trait-n);padding-top:.8rem}
.constitution summary{cursor:pointer;display:flex;gap:.8rem;align-items:baseline;flex-wrap:wrap;list-style:none}
.constitution summary::-webkit-details-marker{display:none}
.constitution summary::before{content:'+';font-family:var(--f-mono);color:var(--canari-sombre)}
.constitution[open] summary::before{content:'–'}
.constitution[open] > .grille2{margin-top:1rem}
.constitution h3{font-size:.9rem;margin-top:.3rem}
@media (max-width:760px){.h-ligne{grid-template-columns:minmax(0,1fr) 6.5rem}.h-barre{grid-column:1 / -1;grid-row:2}}
.kpis .kpi strong{white-space:nowrap;font-size:clamp(1.45rem,2.1vw,2rem)}
/* Vue d'ensemble : les 6 chiffres clés sur une seule ligne (demande Carine 11/10/2026) */
.kpis.kpis-6{grid-template-columns:repeat(6,minmax(0,1fr))}
.kpis-6 .kpi{padding:.8rem .75rem}
.kpis-6 .kpi strong{font-size:clamp(1.15rem,1.75vw,1.85rem)}
.kpis-6 .kpi span{font-size:.76rem;line-height:1.3}
.kpis-6 .kpi small{font-size:.56rem;line-height:1.35}
@media (max-width:1100px){.kpis.kpis-6{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:560px){.kpis.kpis-6{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Accès abonné (12/10/2026) */
.acces{display:flex;align-items:center;gap:.5rem}
.acces .btn-l{text-decoration:none}
.verrou{border:1px dashed var(--canari-sombre);background:var(--charbon);padding:1.1rem 1.2rem;display:flex;flex-direction:column;gap:.45rem;align-items:flex-start}
.verrou h3{font-family:var(--f-titre);font-weight:500;font-size:1.25rem}
.verrou p{font-size:.88rem;color:var(--blanc-casse);max-width:75ch}
.verrou .btn-p,.verrou .btn-l{text-decoration:none;display:inline-block;margin-top:.3rem}
.verrou > a + a{margin-left:.4rem}
.verrou-actions{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;margin-top:.3rem}
.verrou-actions a{margin:0!important}
/* Barre de choix sur une seule ligne (12/10/2026, demande Carine) : libellés alignés en haut, contrôles sur une ligne ;
   les territoires choisis s'affichent en petites étiquettes sous le menu, sans repousser les autres choix. Pas de chevauchement :
   sous 1 300 px la barre passe sur deux lignes. */
.choix{flex-wrap:wrap;gap:.8rem 1.2rem;align-items:flex-start}
.choix > .champ{flex:0 0 auto}
.choix .territoire{flex:0 1 auto;min-width:0}
.choix .terr-ligne{flex-wrap:wrap;gap:.45rem}
.choix .terr-ligne .puces{flex:1 0 100%;gap:.3rem}
.puces:empty{display:none}
.choix .puce{white-space:nowrap;font-size:.6rem;padding:.15rem .45rem}
.choix .btn-l,.choix .seg button{white-space:nowrap}
.choix #sel-filiere{min-width:11rem}
.choix #sel-region{min-width:9rem}
.choix .terr-ligne .puces{contain:inline-size;flex-wrap:wrap}
.choix{gap:.8rem 1rem}
.choix #sel-filiere{min-width:10rem}
.choix #sel-region{min-width:8.5rem}
.choix .seg button{padding-left:.6rem;padding-right:.6rem}
.choix #sel-filiere{width:13.5rem;min-width:0}
.choix #sel-region{width:10rem;min-width:0}
