/* Dashboards and the KPI shop (A-29): a twelve-column grid of cards, the shop beside it while arranging. */
#indicators-host .db-tools{display:flex;justify-content:flex-end;gap:8px;align-items:center;margin:0 0 12px;flex-wrap:wrap}
#indicators-host .db-tools.editing{justify-content:flex-start;background:var(--ki-card);border:1px solid var(--ki-line);border-radius:var(--ki-r);padding:8px 10px;box-shadow:var(--ki-shadow)}
#indicators-host .db-tools .db-gap{flex:1}
#indicators-host .db-name{font:inherit;font-size:14px;font-weight:700;color:var(--ki-text);border:1px solid var(--ki-line);border-radius:9px;padding:7px 10px;min-width:220px}
#indicators-host .db-reason{font:inherit;font-size:13px;border:1px solid var(--ki-line);border-radius:9px;padding:7px 10px;min-width:200px}
#indicators-host .db-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-items:start}
#indicators-host .db-layout.with-shop{grid-template-columns:minmax(0,1fr) 330px}
#indicators-host .db-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px;align-items:stretch;grid-auto-flow:row dense}
#indicators-host .db-cell{min-width:0;display:flex;flex-direction:column;position:relative}
#indicators-host .db-cell.s-s{grid-column:span 3}#indicators-host .db-cell.s-m{grid-column:span 4}
#indicators-host .db-cell.s-l{grid-column:span 6}#indicators-host .db-cell.s-w{grid-column:span 12}
#indicators-host .db-cell>.ki-card,#indicators-host .db-cell>.ki-strip,#indicators-host .db-cell>.db-card{flex:1;margin:0}
#indicators-host .db-cell>.ki-strip{grid-column:auto}
#indicators-host .db-card{display:flex;flex-direction:column;gap:4px;min-width:0;padding:14px 16px 10px;border:1px solid var(--ki-line);border-radius:var(--ki-r);background:var(--ki-card);box-shadow:var(--ki-shadow);transition:box-shadow .2s}
#indicators-host .db-card:hover{box-shadow:0 0 0 2px color-mix(in srgb,var(--ki-teal) 22%,transparent),var(--ki-shadow)}
#indicators-host .db-card header{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
#indicators-host .db-card .kl{font-size:10.3px;letter-spacing:.9px;text-transform:uppercase;color:var(--ki-muted);font-weight:700;line-height:1.35}
#indicators-host .db-head{display:flex;flex-direction:column;gap:3px}
#indicators-host .db-card .kv{font-size:clamp(22px,1.8vw,28px);font-weight:800;letter-spacing:-.6px;line-height:1.15;color:var(--ki-text);font-variant-numeric:tabular-nums;white-space:nowrap}
#indicators-host .db-card .kv small{font-size:13px;font-weight:600;letter-spacing:0;color:var(--ki-muted);margin-left:2px}
#indicators-host .db-deltas{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center}
#indicators-host .db-chart{flex:1;min-height:170px;margin-top:4px}
#indicators-host .db-cell.s-s .db-chart{min-height:120px}
#indicators-host .db-cell.s-l .db-chart,#indicators-host .db-cell.s-w .db-chart{min-height:230px}
#indicators-host .db-card.chart-bars_target .db-chart,#indicators-host .db-card.chart-bars_whole .db-chart,#indicators-host .db-card.chart-distribution .db-chart,#indicators-host .db-card.chart-dumbbell .db-chart{min-height:210px}
#indicators-host .db-why{margin:6px 0 0}
#indicators-host .db-card footer{display:flex;gap:6px;margin-top:6px;opacity:0;transition:opacity .2s}
#indicators-host .db-card:hover footer,#indicators-host .db-card:focus-within footer{opacity:1}
#indicators-host .db-ask{font-size:11.5px!important;padding:4px 10px!important;border-radius:99px!important}
#indicators-host .db-card.pending{border-style:dashed;justify-content:center;min-height:140px}
#indicators-host .db-empty{grid-column:1/-1;padding:40px;text-align:center;border:2px dashed var(--ki-line);border-radius:var(--ki-r)}
#indicators-host .db-ctl{display:flex;gap:4px;align-items:center;flex-wrap:wrap;padding:6px 6px 4px;margin-bottom:-6px;background:color-mix(in srgb,var(--ki-teal) 8%,var(--ki-card));border:1px solid color-mix(in srgb,var(--ki-teal) 30%,var(--ki-line));border-bottom:0;border-radius:var(--ki-r) var(--ki-r) 0 0;position:relative;z-index:1}
#indicators-host .db-ctl button{font-size:11px;padding:3px 8px;border-radius:7px}
#indicators-host .db-ctl button[aria-pressed=true]{background:var(--ki-ink);color:var(--ki-card);border-color:var(--ki-ink)}
#indicators-host .db-ctl select{font:inherit;font-size:11.5px;border:1px solid var(--ki-line);border-radius:7px;padding:3px 6px;flex:1 1 120px;min-width:0;max-width:200px;background:var(--ki-card);color:var(--ki-text)}
#indicators-host .db-ctl .db-x{margin-left:auto;color:var(--ki-red)}
#indicators-host .db-grip{cursor:grab;color:var(--ki-muted);letter-spacing:-2px;padding:0 4px;user-select:none}
#indicators-host .db-cell[draggable=true]{cursor:grab}
#indicators-host .db-cell.dragging{opacity:.4}
#indicators-host .db-cell.over::before{content:"";position:absolute;left:-8px;top:0;bottom:0;width:3px;border-radius:2px;background:var(--ki-teal)}
#indicators-host .db-shop{position:sticky;top:10px;display:flex;flex-direction:column;gap:10px;max-height:calc(100dvh - 40px);padding:14px;border:1px solid var(--ki-line);border-radius:var(--ki-r);background:var(--ki-card);box-shadow:var(--ki-shadow)}
#indicators-host .db-shop header{display:flex;justify-content:space-between;align-items:center;gap:8px}
#indicators-host .db-shop header strong{color:var(--ki-text);font-size:14px}
#indicators-host .db-shop header button{font-size:11.5px;padding:6px 10px}
#indicators-host .db-shop input[type=search]{font:inherit;font-size:13px;border:1px solid var(--ki-line);border-radius:9px;padding:8px 10px;width:100%;box-sizing:border-box}
#indicators-host .db-shelves{display:flex;gap:5px;flex-wrap:wrap}
#indicators-host .db-shelves button{font-size:11px;padding:4px 9px;border-radius:99px;background:var(--ki-soft);border-color:transparent;color:var(--ki-slate)}
#indicators-host .db-shelves button[aria-pressed=true]{background:var(--ki-ink);color:var(--ki-card)}
#indicators-host .db-items{list-style:none;margin:0;padding:0;overflow:auto;display:flex;flex-direction:column;gap:6px}
#indicators-host .db-items li{display:flex;gap:9px;align-items:center;padding:8px 9px;border:1px dashed color-mix(in srgb,var(--ki-slate) 30%,var(--ki-line));border-radius:10px;cursor:grab;background:color-mix(in srgb,var(--ki-soft) 40%,var(--ki-card))}
#indicators-host .db-items li span{flex:1;min-width:0;display:flex;flex-direction:column}
#indicators-host .db-items li b{font-size:12.3px;color:var(--ki-text);font-weight:600;line-height:1.3}
#indicators-host .db-items li small{font-size:10.8px;color:var(--ki-muted)}
#indicators-host .db-items li button{font-size:11px;padding:4px 9px}
#indicators-host .db-items li em{font-size:10.5px;color:var(--ki-green);font-style:normal;font-weight:600;white-space:nowrap}
#indicators-host .db-items li.on{cursor:default;border-style:solid;opacity:.7}
#indicators-host .db-none{justify-content:center;color:var(--ki-muted);font-size:12px;cursor:default!important}
#indicators-host .db-glyph{flex:0 0 30px;width:30px;height:22px;fill:var(--ki-teal);stroke:var(--ki-teal);stroke-width:1.4;opacity:.9}
#indicators-host .db-glyph text{stroke:none;fill:var(--ki-teal)}
#indicators-host .db-skeleton{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
#indicators-host .db-skeleton div{height:240px;border-radius:var(--ki-r);background:linear-gradient(90deg,var(--ki-soft) 0%,var(--ki-card) 50%,var(--ki-soft) 100%);background-size:220% 100%;animation:ki-shimmer 1.4s ease-in-out infinite}
@media(max-width:1280px){#indicators-host .db-cell.s-s{grid-column:span 4}#indicators-host .db-cell.s-m{grid-column:span 6}#indicators-host .db-layout.with-shop{grid-template-columns:minmax(0,1fr)}#indicators-host .db-shop{position:static;max-height:none}}
@media(max-width:900px){#indicators-host .db-cell.s-s,#indicators-host .db-cell.s-m{grid-column:span 6}#indicators-host .db-cell.s-l{grid-column:span 12}}
@media(max-width:700px){#indicators-host .db-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}#indicators-host .db-cell.s-s{grid-column:span 1}#indicators-host .db-cell.s-m,#indicators-host .db-cell.s-l,#indicators-host .db-cell.s-w{grid-column:span 2}#indicators-host .db-skeleton{grid-template-columns:1fr}#indicators-host .db-card footer{opacity:1}}
@media(prefers-reduced-motion:reduce){#indicators-host .db-skeleton div{animation:none}}
/* « Présenter »: the dashboard full screen, one card per slide. */
#indicators-host .db-present{position:fixed;inset:0;z-index:1000;background:#0B1424;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3vh 3vw 0;outline:none}
#indicators-host .dp-slide{width:min(94vw,calc((100vh - 110px) * 16 / 9));aspect-ratio:16/9;background:var(--ki-card);border-radius:18px;box-shadow:0 24px 70px rgba(0,0,0,.45);padding:clamp(22px,3.4vw,52px);display:flex;flex-direction:column;overflow:hidden;animation:dp-in .32s cubic-bezier(.2,.7,.2,1)}
@keyframes dp-in{from{opacity:0;transform:translateY(10px) scale(.99)}to{opacity:1;transform:none}}
#indicators-host .dp-cover{margin:auto 0;display:flex;flex-direction:column;gap:10px;border-left:6px solid var(--ki-red);padding-left:28px}
#indicators-host .dp-cover h1{margin:0;font-size:clamp(30px,4.2vw,62px);font-weight:800;letter-spacing:-1.2px;color:var(--ki-text)}
#indicators-host .dp-cover p{margin:0;font-size:clamp(14px,1.5vw,22px);color:var(--ki-muted)}
#indicators-host .dp-eyebrow{font-size:clamp(10px,.9vw,13px);letter-spacing:1.4px;text-transform:uppercase;color:var(--ki-red);font-weight:700}
#indicators-host .dp-kpi{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.9fr);gap:clamp(18px,3vw,48px);height:100%}
#indicators-host .dp-left{display:flex;flex-direction:column;gap:12px;min-width:0}
#indicators-host .dp-left h2{margin:0;font-size:clamp(18px,2vw,30px);font-weight:800;letter-spacing:-.4px;color:var(--ki-text);line-height:1.2}
#indicators-host .dp-value{font-size:clamp(36px,5vw,76px);font-weight:800;letter-spacing:-1.6px;color:var(--ki-text);line-height:1;margin-top:auto}
#indicators-host .dp-value small{font-size:.38em;color:var(--ki-muted);font-weight:600;letter-spacing:0;margin-left:6px}
#indicators-host .dp-left .db-deltas{font-size:clamp(12px,1vw,15px)}
#indicators-host .dp-def{margin:auto 0 0;font-size:clamp(11px,.9vw,13px);color:var(--ki-muted);line-height:1.5}
#indicators-host .dp-right{min-width:0;display:flex;flex-direction:column;justify-content:center}
#indicators-host .dp-chart{width:100%;height:100%;min-height:260px}
#indicators-host .dp-section{height:100%;display:flex;flex-direction:column}
#indicators-host .dp-section>.ki-card,#indicators-host .dp-section>.ki-strip{flex:1;border:0;box-shadow:none;padding:0;margin:0}
#indicators-host .dp-section .ki-chart{height:100%!important;min-height:300px}
#indicators-host .dp-bar{width:min(94vw,calc((100vh - 110px) * 16 / 9));display:flex;justify-content:space-between;align-items:center;color:#8C9AB0;font-size:13px;padding:14px 4px}
#indicators-host .dp-nav{display:flex;gap:10px;align-items:center}
#indicators-host .dp-nav b{color:#E7ECF4;font-weight:600;min-width:56px;text-align:center}
#indicators-host .dp-bar button{background:rgba(255,255,255,.08)!important;color:#E7ECF4!important;border-color:rgba(255,255,255,.14)!important;border-radius:99px!important;padding:6px 14px!important}
#indicators-host .dp-bar button:disabled{opacity:.3}
@media(max-width:700px){#indicators-host .dp-kpi{grid-template-columns:1fr}#indicators-host .dp-slide{aspect-ratio:auto;height:calc(100vh - 110px)}}
@media(prefers-reduced-motion:reduce){#indicators-host .dp-slide{animation:none}}
#indicators-host .dp-section{justify-content:center}
#indicators-host .dp-section>.ki-strip{flex:none;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
#indicators-host .db-present .ki-tile-actions,#indicators-host .db-present details.ki-definition,#indicators-host .db-present .ki-info,#indicators-host .db-present .ki-card-head button{display:none}
#indicators-host .dp-section>.ki-card{display:flex;flex-direction:column}
#indicators-host .dp-section>.ki-card .ki-chart{flex:1}
#indicators-host .dp-section>.ki-strip{zoom:1.45}
#indicators-host .dp-section>.ki-card:has(.ki-table){zoom:1.3}
#indicators-host .db-present [data-ask]{display:none}
