/* carneva.fr · Tendances › tableau de bord « Ton territoire en un coup d'œil » (tendances/tableau.js).
   Identité Basalte : jetons de css/famille.css (--f-*), galets, Bricolage Grotesque / Plus Jakarta Sans. Mobile d'abord. */

/* ---------- Haut de page, plus court ---------- */
.td-hero.db-hero{padding:24px 0 26px}
.db-hero h1{font-size:clamp(2.4rem,10.5vw,5.6rem)}
.db-hero .td-lead{max-width:620px;margin:14px 0 0}

/* ---------- Sélecteur collant ---------- */
.db-sel{position:sticky;top:62px;z-index:9;background:color-mix(in srgb,var(--f-bg) 92%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--f-line);padding:10px 0}
@media (max-width:700px){.db-sel{top:88px;padding:8px 0}}
.db-sel .wrap{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;align-items:end}
@media (max-width:420px){.db-sel .wrap{padding:0 12px}}
.db-sel label{display:flex;flex-direction:column;gap:3px;min-width:0;font:700 .7rem/1 var(--f-font-b);letter-spacing:.06em;text-transform:uppercase;color:var(--f-ink-3)}
.db-sel select{width:100%;min-width:0;appearance:none;-webkit-appearance:none;min-height:44px;padding:0 22px 0 8px;border:1.5px solid var(--f-line);border-radius:14px 10px 13px 9px;background:var(--f-surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%231B1A1F' stroke-width='3'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 7px center;font:700 .88rem var(--f-font-b);color:var(--f-ink);text-overflow:ellipsis;white-space:nowrap;overflow:hidden;letter-spacing:0;text-transform:none}
.db-sel select:focus-visible{outline:3px solid var(--f-ink);outline-offset:2px}
.db-sel select.on{border-color:var(--f-ink);background-color:var(--f-sable-t)}
@media (min-width:900px){.db-sel .wrap{grid-template-columns:repeat(3,minmax(0,280px));justify-content:start}.db-sel select{font-size:1rem}}

/* ---------- Titre du territoire ---------- */
.db-head{padding:22px 0 6px}
.db-head h2{font:800 clamp(2rem,8vw,3.4rem)/1 var(--f-font-d);letter-spacing:-.035em;margin:0}
.db-head p{margin:6px 0 0;color:var(--f-ink-2);font-size:.95rem}
.db-share{all:unset;cursor:pointer;font:700 .85rem var(--f-font-b);color:var(--f-ink-2);text-decoration:underline;text-underline-offset:3px;margin-left:6px}
.db-share:focus-visible{outline:3px solid var(--f-ink);outline-offset:2px}
.db-flagbar{margin:12px 0 0}
#db-chido[hidden]{display:none}
.db-src-g{grid-column:1/-1;margin:0}

/* ---------- Grille ---------- */
.db-dash{display:grid;gap:14px;padding:14px 0 30px}
.db-blk{background:var(--f-surface);border:1px solid var(--f-line);border-radius:var(--f-r);box-shadow:var(--f-shadow);padding:18px 16px;min-width:0}
.db-blk:nth-of-type(even){border-radius:var(--f-galet-2)}
.db-blk h3{font:800 1.35rem/1.15 var(--f-font-d);letter-spacing:-.02em;margin:0}
.db-blk .db-lead{font-size:.9rem;color:var(--f-ink-2);margin:4px 0 12px}
.db-blk .f-src{margin-top:12px}
@media (min-width:1000px){
  .db-dash{grid-template-columns:repeat(12,minmax(0,1fr));gap:18px}
  .db-tiles{grid-column:1/-1}
  .db-carte{grid-column:1/-1}
  .db-up{grid-column:1/7}
  .db-dn{grid-column:7/-1}
  .db-ferme{grid-column:1/6}
  .db-courbe{grid-column:6/-1}
  .db-blk{padding:22px 24px}
}

/* ---------- Tuiles ---------- */
.db-tiles{display:grid;gap:12px;grid-template-columns:1fr}
@media (min-width:640px){.db-tiles{grid-template-columns:1fr 1fr}}
.db-tile{background:var(--f-surface);border:1px solid var(--f-line);border-radius:var(--f-r);box-shadow:var(--f-shadow);padding:16px 16px 6px;min-width:0}
.db-tile:nth-child(2),.db-tile:nth-child(3){border-radius:var(--f-galet-2)}
.db-tl{margin:0;font-weight:700;font-size:.95rem;color:var(--f-ink-2)}
.db-big{font:800 clamp(2.5rem,11vw,3.4rem)/1 var(--f-font-d);letter-spacing:-.035em;margin:6px 0 2px;display:block}
.db-big small{font-size:.45em;letter-spacing:0;margin-left:.1em}
.db-sub{margin:0;font-size:.85rem;color:var(--f-ink-2)}
.db-tile .ep-fls{margin:10px 0 0}
.db-tile .ep-un{grid-template-columns:1fr}
.db-tile .ep-un .ep-fl{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:2px 10px}
.db-tile .ep-un .ep-fl-h{min-width:3.4em}
.db-tile .ep-plus{margin-top:8px}
.db-tile .ep-plus[hidden]{display:none}
.db-act{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 12px}
.db-more,.db-copy{all:unset;box-sizing:border-box;cursor:pointer;min-height:44px;display:inline-flex;align-items:center;padding:0 14px;border-radius:999px;font:700 .85rem var(--f-font-b);color:var(--f-ink);box-shadow:inset 0 0 0 1.5px var(--f-ink-3)}
.db-copy{background:var(--f-sable-t);box-shadow:none}
.db-more:hover,.db-copy:hover{background:var(--f-sable-t)}
.db-more:focus-visible,.db-copy:focus-visible{outline:3px solid var(--f-ink);outline-offset:2px}
.ep-fl.s-n b{color:var(--f-ink)}
.ep-fl.s-n{background:var(--f-bg)}
.ep-fl.s-x b{font-size:1rem;white-space:normal;color:var(--f-ink-3)}

/* ---------- Courbe ---------- */
.db-lg{display:flex;flex-wrap:wrap;gap:6px 14px;margin:0 0 6px;padding:0;list-style:none;font-size:.85rem;color:var(--f-ink-2)}
.db-lg li{display:inline-flex;align-items:center;gap:6px}
.db-lg i{display:inline-block;width:20px;height:0;border-top:3px solid var(--f-ink)}
.db-lg .l1{border-top-color:var(--f-vert)}.db-lg .l2{border-top:2px dashed var(--f-ink-3)}
.db-cv{position:relative;outline:0;touch-action:pan-y}
.db-cv:focus-visible{outline:3px solid var(--f-ink);outline-offset:4px;border-radius:8px}
.db-cv svg{display:block;width:100%;height:auto;overflow:visible}
.db-cv .gr{stroke:var(--f-line);stroke-width:1}
.db-cv .g100{stroke:var(--f-ink-3);stroke-width:1}
.db-cv .ax{font:500 11px var(--f-font-b);fill:var(--f-ink-3)}
.db-cv .ln0{fill:none;stroke:var(--f-ink);stroke-width:3;stroke-linejoin:round;stroke-linecap:round}
.db-cv .ln1{fill:none;stroke:var(--f-vert);stroke-width:2.2;stroke-linejoin:round}
.db-cv .ln2{fill:none;stroke:var(--f-ink-3);stroke-width:2;stroke-dasharray:5 4}
.db-cv .ev{font:800 12px var(--f-font-b)}
.db-cv .ev0{fill:var(--f-ink)}.db-cv .ev1{fill:var(--f-vert)}.db-cv .ev2{fill:var(--f-ink-3)}
.db-cv .gd{stroke:var(--f-ink);stroke-width:1;opacity:.35}
.db-cv .d0{fill:var(--f-ink)}.db-cv .d1{fill:var(--f-vert)}.db-cv .d2{fill:var(--f-ink-3)}
.db-cv .dk{stroke:var(--f-surface);stroke-width:2}
.db-rd{margin:8px 0 0;padding:10px 12px;background:var(--f-bg);border-radius:var(--f-r-s);font-size:.86rem;color:var(--f-ink-2);min-height:3.2em}
.db-rd b{color:var(--f-ink)}
.db-rd span{display:block}

/* ---------- Classements ---------- */
.db-rk{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.db-rk>li{border-bottom:1px solid var(--f-line)}
.db-rk>li:last-child{border-bottom:0}
.db-rw{all:unset;box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;width:100%;padding:10px 4px;cursor:pointer;border-radius:12px;color:var(--f-ink)}
.db-rw:hover{background:var(--f-bg)}
a.db-rw{text-decoration:none}
.db-rw.plain{cursor:default}
.db-rw.plain:hover{background:none}
.db-all{margin-top:8px;border-top:1px solid var(--f-line)}
.db-all summary{cursor:pointer;font-weight:700;font-size:.9rem;padding:12px 4px;min-height:44px;display:flex;align-items:center}
.db-all summary:focus-visible{outline:3px solid var(--f-ink);outline-offset:2px}
.db-rw:focus-visible{outline:3px solid var(--f-ink);outline-offset:1px}
.db-rl{font-weight:700;font-size:.92rem;line-height:1.25}
.db-rl small{font-weight:500;color:var(--f-ink-3);margin-left:4px}
.db-rv{font:800 1.05rem/1.2 var(--f-font-d);text-align:right;white-space:nowrap}
.db-up .db-rv{color:var(--f-vert)}.db-dn .db-rv{color:var(--f-rose)}
.db-rb{grid-column:1/-1;display:flex;align-items:center;gap:8px}
.db-rb i{display:block;height:10px;border-radius:0 6px 6px 0;min-width:3px}
.db-up .db-rb i{background:var(--f-vert-v)}.db-dn .db-rb i{background:var(--f-rose-v)}
.db-rb span{font-size:.78rem;color:var(--f-ink-3);white-space:nowrap}
.db-ra{grid-column:1/-1;font-size:.78rem;font-weight:700;color:var(--f-ink-2)}
.db-fi{margin:0 4px 12px;padding:12px;background:var(--f-bg);border-radius:var(--f-r-s);font-size:.86rem;color:var(--f-ink-2)}
.db-fi[hidden]{display:none}
.db-fi p{margin:0 0 6px}
.db-sp{display:block;width:100%;max-width:320px;height:auto;margin:6px 0 2px}
.db-sp polyline{fill:none;stroke:var(--f-ink);stroke-width:2.5;stroke-linejoin:round}
.db-sp circle{fill:var(--f-ink)}
.db-sp text{font:600 10px var(--f-font-b);fill:var(--f-ink-3)}
.db-vide{font-size:.9rem;color:var(--f-ink-2);background:var(--f-bg);border-radius:var(--f-r-s);padding:12px}

/* ---------- Fermetures ---------- */
.db-fb{margin:4px 0 14px}
.db-fb p{margin:0 0 4px;font-size:.86rem;font-weight:700;color:var(--f-ink-2)}
.db-fb p span{font-weight:500;color:var(--f-ink-3)}
.db-fb .ep-bar{height:22px;border-radius:8px;margin:0}
.db-fb.ref .ep-bar{height:12px;opacity:.85}
.db-fl{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.db-fl li{display:grid;grid-template-columns:14px minmax(0,1fr) auto auto;gap:8px;align-items:center;padding:6px 0;border-bottom:1px solid var(--f-line);font-size:.88rem}
.db-fl li:last-child{border-bottom:0}
.db-fl i{width:14px;height:14px;border-radius:4px}
.db-fl b{font:800 1rem var(--f-font-d);text-align:right}
.db-fl em{font-style:normal;color:var(--f-ink-3);font-size:.8rem;min-width:4.6em;text-align:right}
.db-fl .b1,.ep-bar .b1{background:var(--f-vert-v)}.db-fl .b2{background:var(--f-rose)}.db-fl .b3{background:#FFD27A}.db-fl .b4{background:var(--f-rose-v)}.db-fl .b5{background:var(--f-mute)}

/* ---------- Carte ---------- */
.db-cw{display:grid;gap:16px}
@media (min-width:1000px){.db-cw{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:start}}
.db-map{display:block;width:100%;height:auto;max-height:70vh}
.db-map path{stroke:#fff;stroke-width:1.2;stroke-linejoin:round;cursor:pointer;vector-effect:non-scaling-stroke}
.db-map path:hover{stroke:var(--f-ink);stroke-width:1.6}
.db-map path.sel{stroke:var(--f-ink);stroke-width:2.6}
.db-map path.dim{opacity:.38}
.db-map path:focus{outline:0}
.db-map path:focus-visible{stroke:var(--f-ink);stroke-width:3}
.k0{fill:#B52F5B}.k1{fill:#F2A7C0}.k2{fill:#E6E2DB}.k3{fill:#8FD9B6}.k4{fill:#137A57}.kn{fill:url(#db-hach)}
.db-leg{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:4px;font-size:.72rem;color:var(--f-ink-2);line-height:1.2}
.db-leg li{display:flex;flex-direction:column;gap:3px}
.db-leg i{display:block;height:10px;border-radius:3px}
.db-leg .k0{background:#B52F5B}.db-leg .k1{background:#F2A7C0}.db-leg .k2{background:#E6E2DB}.db-leg .k3{background:#8FD9B6}.db-leg .k4{background:#137A57}
.db-leg-t{display:flex;justify-content:space-between;font-size:.76rem;font-weight:700;color:var(--f-ink-2);margin-top:6px}
.db-leg-n{font-size:.76rem;color:var(--f-ink-3);margin:4px 0 0}
.db-leg-n i{display:inline-block;width:12px;height:10px;border-radius:2px;vertical-align:middle;margin-right:4px;background:repeating-linear-gradient(45deg,#E6E2DB 0 2px,#fff 2px 4px);border:1px solid var(--f-line)}
.db-mi{margin:10px 0 0;padding:10px 12px;background:var(--f-bg);border-radius:var(--f-r-s);font-size:.88rem;color:var(--f-ink-2);min-height:2.6em}
.db-mi b{color:var(--f-ink)}
.db-mi button{all:unset;cursor:pointer;font-weight:700;color:var(--f-ink);text-decoration:underline;text-underline-offset:3px;margin-left:4px}
.db-mi button:focus-visible{outline:3px solid var(--f-ink);outline-offset:2px}
.db-cl h4{font:800 1.02rem var(--f-font-d);margin:0 0 6px}
.db-cl h4+ol{margin-bottom:14px}
.db-cl ol{list-style:none;margin:0;padding:0}
.db-cl li button{all:unset;box-sizing:border-box;width:100%;cursor:pointer;display:flex;justify-content:space-between;gap:10px;padding:8px 6px;border-bottom:1px solid var(--f-line);font-size:.9rem}
.db-cl li button:hover{background:var(--f-bg)}
.db-cl li button:focus-visible{outline:3px solid var(--f-ink);outline-offset:-2px}
.db-cl li button b{font-family:var(--f-font-d);white-space:nowrap}
.db-cl li button.on{background:var(--f-sable-t)}
.db-cl details{margin-top:6px}
.db-cl summary{cursor:pointer;font-weight:700;font-size:.9rem;padding:8px 0}

/* ---------- Bas de page : recherche et listes ---------- */
.db-proj{padding:30px 0 10px}
.db-proj-c{background:var(--f-basalte);color:#fff;border-radius:var(--f-galet);padding:24px 20px}
.db-proj-c h2{font:800 clamp(1.9rem,7vw,3rem)/1 var(--f-font-d);letter-spacing:-.035em;margin:0;color:#fff}
.db-proj-c h2 .hl{color:var(--f-vert-v)}
.db-proj-c p{color:var(--f-mute);margin:8px 0 0;max-width:560px}
.db-proj-c .td-q{margin-top:16px}
.db-proj-c .td-ex{color:var(--f-mute)}
.db-proj-c .td-ex a{color:#fff}
.db-proj-c :focus-visible{outline-color:var(--f-vert-v)}
.db-err{padding:16px;background:var(--f-rose-t);border-radius:var(--f-r-s)}
@media (prefers-reduced-motion:reduce){.db-rw,.db-sel{transition:none}}

/* ---------- Repris de l'étude (tendances/projet/etude.css) : source au toucher, repère sous la flèche, barre empilée ---------- */
.sx{display:inline-grid;place-items:center;width:22px;height:22px;margin-left:6px;border-radius:50%;border:1.5px solid var(--f-ink-3);background:transparent;color:var(--f-ink-3);font:700 .72rem/1 var(--f-font-b);cursor:pointer;vertical-align:.1em;padding:0;position:relative}
.sx::before{content:"";position:absolute;inset:-11px}
.sx[aria-expanded=true]{background:var(--f-ink);color:#fff;border-color:var(--f-ink)}
.sx:focus-visible{outline:3px solid var(--f-ink);outline-offset:2px}
.sx-p{display:block;margin-top:6px;font-size:.8rem;line-height:1.4;color:var(--f-ink-2);background:var(--f-bg);border-left:3px solid var(--f-sable);padding:6px 10px;border-radius:0 8px 8px 0;font-weight:400;text-transform:none;letter-spacing:0}
.sx-p[hidden]{display:none}
.ep-fl-d{font-size:.78rem;color:var(--f-ink-2)}
.ep-bar{display:flex;height:14px;border-radius:7px;overflow:hidden;margin:10px 0 4px;gap:2px}
.ep-bar i{display:block;min-width:4px}
.ep-bar .b1{background:var(--f-vert-v)}.ep-bar .b2{background:var(--f-rose)}.ep-bar .b3{background:#FFD27A}.ep-bar .b4{background:var(--f-rose-v)}.ep-bar .b5{background:var(--f-mute)}
