/* Les graphiques du droit à l'établi — palette de radar.css, gravité de droit.css. */
#chiffres[data-etat="vide"] .gr-bloc{display:none}
.gr-cles{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:0 0 48px}
.gr-cle{background:var(--ardoise);border:1px solid var(--trait);border-radius:12px;padding:16px 18px}
.gr-cle b{display:block;font-family:var(--mono);font-size:clamp(28px,4vw,38px);font-weight:600;line-height:1.1;
  color:var(--blanc);font-variant-numeric:tabular-nums}
.gr-cle span{color:var(--gris);font-size:13.5px;line-height:1.4;display:block;margin-top:6px}
.gr-cle[data-k="fond"]{border-color:var(--numen)}
.gr-bloc{margin:0 0 56px}
.gr-bloc h3{font-size:20px;font-weight:600;margin:0 0 4px}
.gr-bloc .gr-sous{color:var(--gris);margin:0 0 16px;max-width:70ch;font-size:15px}
.gr-svg{width:100%;height:auto;display:block;overflow:visible}
.gr-grille{stroke:var(--trait);stroke-width:1}
.gr-axe{fill:var(--gris-sourd);font:12px var(--sans)}
.gr-etiq{fill:var(--blanc);font:600 12px var(--sans)}
.gr-col{fill:var(--soleil);opacity:.75;transform-box:fill-box;transform-origin:50% 100%;transform:scaleY(0);
  transition:transform .7s cubic-bezier(.22,1,.36,1)}
.vu .gr-col{transform:scaleY(1)}
.gr-col.pic{opacity:1}
.gr-zone{fill:transparent;cursor:pointer}
.gr-zone:focus{outline:none}
g:has(> .gr-zone:focus-visible) .gr-col,.gr-zone:focus-visible{stroke:var(--numen);stroke-width:2}
.gr-pt{fill:var(--soleil);stroke:var(--nuit);stroke-width:2;transition:r .5s cubic-bezier(.22,1,.36,1)}
a:hover .gr-pt,a:focus-visible .gr-pt{fill:var(--soleil-clair);stroke:var(--blanc)}
a:focus{outline:none}
.gr-moy{stroke:var(--numen);stroke-width:1.5;stroke-dasharray:4 4}
/* Gravité par code : barres empilées, 2 px de surface entre segments. */
.gr-legende{display:flex;flex-wrap:wrap;gap:6px 18px;list-style:none;padding:0;margin:0 0 14px;color:var(--gris);font-size:13.5px}
.gr-legende li{display:flex;align-items:center;gap:7px}
.gr-piles{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.gr-piles li{display:grid;grid-template-columns:minmax(120px,240px) 1fr 56px;gap:12px;align-items:center}
.gr-nom{color:var(--blanc);font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gr-nom:hover{color:var(--soleil-clair)}
.gr-pile{display:flex;gap:2px;height:14px;width:0;transition:width .9s cubic-bezier(.22,1,.36,1)}
.vu .gr-pile,#gr-gravite.calme .gr-pile{width:var(--l)}
.gr-pile i{display:block;height:100%;flex:0 0 var(--p);min-width:3px;cursor:pointer}
.gr-pile i:first-child{border-radius:4px 0 0 4px}
.gr-pile i:last-child{border-radius:0 4px 4px 0}
.gr-pile i:only-child{border-radius:4px}
.gr-pile i:focus-visible{outline:2px solid var(--numen);outline-offset:2px}
.gr-pile .s-rouge{background:var(--g-rouge)}
.gr-pile .s-orange{background:var(--g-orange)}
.gr-pile .s-jaune{background:var(--g-jaune)}
.gr-pile .s-vert{background:var(--g-vert)}
.gr-tot{font-family:var(--mono);font-size:13px;color:var(--gris);text-align:right}
@media(max-width:620px){.gr-piles li{grid-template-columns:1fr 48px}.gr-pile{grid-column:1 / -1;grid-row:2}}
/* L'entonnoir de fond. */
#gr-fond{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
#gr-fond > .gr-donnees{grid-column:1 / -1}
.gr-ent{background:var(--ardoise);border:1px solid var(--trait);border-radius:12px;padding:16px}
.gr-ent h4{margin:0 0 12px;font-size:15px}
.gr-ent h4 a{color:var(--blanc)}
.gr-etapes{display:grid;gap:6px}
.gr-etape{position:relative;font-size:13px;color:var(--gris);padding:6px 10px;border-radius:6px;overflow:hidden;z-index:0}
.gr-etape::before{content:"";position:absolute;inset:0 auto 0 0;width:0;background:rgba(244,244,246,.07);z-index:-1;
  border-radius:6px;transition:width 1s cubic-bezier(.22,1,.36,1)}
.gr-etape.compat::before{background:rgba(63,216,200,.14)}
.gr-etape.inco::before{background:rgba(240,120,42,.28)}
.vu .gr-etape::before{width:var(--w)}
.gr-etape b{color:var(--blanc);font-family:var(--mono)}
.gr-points{display:flex;flex-wrap:wrap;gap:6px 14px;margin:12px 0 0;font-size:13px;color:var(--gris)}
.gr-g{display:inline-flex;align-items:center;gap:6px}
/* Les données, en table, pour qui ne lit pas un graphique. */
.gr-donnees{margin:12px 0 0;font-size:13.5px}
.gr-donnees summary{cursor:pointer;color:var(--soleil);width:max-content}
.gr-table{max-height:320px;overflow:auto;border:1px solid var(--trait);border-radius:8px;margin-top:8px}
.gr-table table{border-collapse:collapse;width:100%}
.gr-table th,.gr-table td{padding:6px 10px;border-bottom:1px solid var(--trait);text-align:left;font-weight:400}
.gr-table thead th{position:sticky;top:0;background:var(--ardoise);color:var(--gris);font-weight:600}
.gr-table td.n{text-align:right;font-family:var(--mono)}
.gr-bulle{position:fixed;z-index:60;max-width:280px;background:var(--ardoise-clair);border:1px solid var(--trait);
  border-radius:8px;padding:8px 11px;font-size:13px;line-height:1.45;color:var(--blanc);pointer-events:none;
  box-shadow:0 8px 24px rgba(0,0,0,.45)}
.gr-bulle .pt{display:inline-block;vertical-align:-1px}
@media(prefers-reduced-motion:reduce){.gr-col,.gr-pt,.gr-pile,.gr-etape::before{transition:none}}
.gr-etiq.moy{fill:var(--numen)}

/* Les visites de chaque code sur sa vignette (20/10). */
.gr-ent h4{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 10px}
.gr-visites{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:400;color:var(--gris);white-space:nowrap}
.gr-visites:empty{display:none}
.gr-visites svg{opacity:.75;align-self:center}