:root{--bg:#f3f4f7;--card:#fff;--ink:#14171f;--ink2:#4b5260;--mut:#8b93a1;--line:#eceef2;--red:#d4202c;--red-w:#fdecee;--good:#13915a;--good-w:#e6f6ee;--bad:#d4202c;--warn:#d97706;--warn-w:#fef4e4;--blue:#3b6fd8}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:Inter,-apple-system,'Segoe UI',sans-serif;background:var(--bg);color:var(--ink);font-size:13.5px;-webkit-font-smoothing:antialiased}
.tn,td.n,th.n{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.mini b{white-space:nowrap}
a{color:inherit}
.shell{display:grid;grid-template-columns:230px minmax(0,1fr);gap:24px;max-width:1500px;margin:0 auto;padding:22px}
/* sidebar */
.side{position:sticky;top:22px;align-self:start;display:grid;gap:16px}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;text-decoration:none}
.logo i{width:32px;height:32px;border-radius:10px;background:var(--red);color:#fff;display:grid;place-items:center;font-style:normal}
.toc{display:grid;gap:2px}
.toc a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:11px;text-decoration:none;color:var(--ink2);font-weight:600}
.toc a span{width:22px;height:22px;border-radius:7px;background:#e6e8ee;display:grid;place-items:center;font-size:11px;font-weight:800;color:var(--ink2)}
.toc a:hover,.toc a.on{background:#fff;color:var(--ink);box-shadow:0 1px 3px rgba(16,24,40,.06)}
.toc a.on span{background:var(--red);color:#fff}
.flt{display:grid;gap:9px;background:#fff;border-radius:16px;padding:14px;box-shadow:0 1px 2px rgba(16,24,40,.04)}
.flt h4{font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--mut)}
.flt label{display:grid;gap:4px;font-size:11.5px;font-weight:600;color:var(--ink2)}
.flt select,.flt input{height:36px;border:1px solid #dfe2e8;border-radius:10px;padding:0 9px;font:inherit;font-size:13px;background:#fff;width:100%}
.flt a{font-size:12px;color:var(--red);font-weight:600;text-decoration:none}
.pbtn{height:40px;border:none;border-radius:12px;background:var(--ink);color:#fff;font:inherit;font-weight:700;cursor:pointer}
.other{font-size:12.5px;color:var(--ink2);text-decoration:none;padding:4px 10px}
/* main */
main{display:grid;gap:26px;min-width:0}
.hero{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap}
.hero h1{font-size:27px;font-weight:800;letter-spacing:-.025em}
.hero p{color:var(--ink2);margin-top:4px}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{background:#fff;border-radius:999px;padding:6px 12px;font-size:12px;font-weight:600;color:var(--ink2);box-shadow:0 1px 2px rgba(16,24,40,.05)}
.chip b{color:var(--red)}
.sec{display:grid;gap:14px;scroll-margin-top:16px}
.sh{display:flex;align-items:center;gap:12px}
.sh .num{width:30px;height:30px;border-radius:10px;background:var(--ink);color:#fff;display:grid;place-items:center;font-weight:800;font-size:13px;flex:none}
.sh h2{font-size:19px;font-weight:800;letter-spacing:-.015em}
.sh p{color:var(--mut);font-size:12.5px}
.card{background:var(--card);border-radius:18px;box-shadow:0 1px 2px rgba(16,24,40,.04),0 6px 20px rgba(16,24,40,.04);padding:18px;min-width:0}
.ch{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}
.ch h3{font-size:14.5px;font-weight:700;display:flex;align-items:center;gap:7px}
.ch small{color:var(--mut);font-size:12px}
.g{display:grid;gap:14px}
.g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:repeat(3,1fr)}.g32{grid-template-columns:3fr 2fr}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:12px}
.kpi{position:relative;background:#fff;border-radius:18px;padding:16px 16px 14px;box-shadow:0 1px 2px rgba(16,24,40,.04),0 6px 20px rgba(16,24,40,.04)}
.kpi.hl{background:linear-gradient(135deg,#d4202c,#a3121c);color:#fff}
.kpi.hl .lb,.kpi.hl .sub{color:rgba(255,255,255,.8)}.kpi.hl .ti{background:rgba(255,255,255,.2);color:#fff}
.kpi .lb{font-size:12px;font-weight:600;color:var(--ink2);display:flex;align-items:center;justify-content:space-between;gap:6px}
.kpi .v{font-size:26px;font-weight:800;letter-spacing:-.025em;margin:6px 0 4px;font-variant-numeric:tabular-nums}
.kpi .v small{font-size:13px;font-weight:600;opacity:.6}
.kpi .sub{font-size:12px;color:var(--mut);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.dl{font-weight:800;font-size:12px;padding:2px 7px;border-radius:999px;background:#eef0f4;color:var(--ink2);white-space:nowrap}
.dl.up{background:var(--good-w);color:var(--good)}.dl.dn{background:var(--red-w);color:var(--bad)}
.kpi.hl .dl{background:rgba(255,255,255,.18);color:#fff}
.ti{width:18px;height:18px;border-radius:50%;border:none;background:#eef0f4;color:var(--mut);font:700 11px Georgia,serif;font-style:italic;cursor:help;flex:none;display:inline-grid;place-items:center}
.ti:hover,.ti:focus{background:var(--ink);color:#fff;outline:none}
#tip{position:fixed;z-index:99;max-width:300px;background:#14171f;color:#fff;font-size:12.5px;line-height:1.5;padding:10px 12px;border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.25);pointer-events:none;opacity:0;transition:opacity .12s}
#tip.on{opacity:1}
.cv{position:relative;height:270px}.cv.sm{height:230px}
.leg{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;color:var(--ink2)}
.leg i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.mini{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.mini div{background:#f7f8fa;border-radius:12px;padding:11px 12px}
.verdict{display:flex;flex-wrap:wrap;align-items:center;gap:10px}.verdict b{font-size:17px}.verdict small{flex-basis:100%;color:var(--mut)}
.ex{display:grid;grid-template-columns:minmax(0,1.4fr) 1fr 110px;align-items:center;gap:14px;padding:12px 0;border-bottom:1px dashed var(--line)}.ex:last-child{border-bottom:none}
.ex-t b{display:flex;align-items:center;gap:6px;font-size:13.5px}.ex-t span{display:block;color:var(--mut);font-size:12px;margin-top:2px}
.ex-bar{position:relative;height:12px;background:#f3f4f7;border-radius:6px}.ex-bar::before{content:"";position:absolute;left:50%;top:-3px;bottom:-3px;width:1px;background:#c5cad3}
.ex-bar i{position:absolute;top:0;bottom:0;border-radius:6px}.ex-bar i.up{left:50%;background:var(--good)}.ex-bar i.dn{right:50%;background:var(--red)}
.ex-v{text-align:right;font-weight:800;font-variant-numeric:tabular-nums}.ex-v.up{color:var(--good)}.ex-v.dn{color:var(--red)}
.mini>div>span{display:flex;justify-content:space-between;align-items:center;font-size:11.5px;color:var(--mut);font-weight:600}
.mini b{display:block;font-size:19px;margin-top:3px;font-variant-numeric:tabular-nums}
.seg{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.sg{background:#fff;border-radius:16px;padding:13px;border:2px solid transparent;cursor:pointer;text-align:left;font:inherit;box-shadow:0 1px 2px rgba(16,24,40,.04),0 6px 20px rgba(16,24,40,.04);transition:.15s}
.sg:hover{transform:translateY(-2px)}.sg.on{border-color:var(--c)}
.sg .t{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:700;color:var(--c)}
.sg .t i{width:8px;height:8px;border-radius:50%;background:var(--c);display:inline-block;margin-right:6px}
.sg b{display:block;font-size:24px;margin:5px 0 2px}
.sg small{color:var(--mut);font-size:11.5px}
.bar{height:6px;border-radius:3px;background:#eef0f4;overflow:hidden;margin-top:8px}.bar i{display:block;height:100%;background:var(--c)}
table{width:100%;border-collapse:collapse}
th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--mut);font-weight:700;padding:9px 10px;border-bottom:1px solid var(--line);white-space:nowrap;background:#fafbfc;position:sticky;top:0}
td{padding:9px 10px;border-bottom:1px solid #f3f4f6;vertical-align:top}
tbody tr:hover td{background:#fafbfc}
.tw{max-height:420px;overflow:auto;border-radius:12px;border:1px solid var(--line)}
.pill{display:inline-block;font-size:11px;font-weight:700;padding:2px 9px;border-radius:999px;background:color-mix(in srgb,var(--c) 12%,#fff);color:var(--c);white-space:nowrap}
.sm2{display:block;color:var(--mut);font-size:11.5px}
.ok{color:var(--good);font-weight:600;padding:10px 0}
.an{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:14px}
.ab{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 7px;border-radius:999px;background:var(--red-w);color:var(--red);font-size:12px;font-weight:800}
.ab.z{background:var(--good-w);color:var(--good)}
.li{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px dashed var(--line)}
.li:last-child{border-bottom:none}
.li .r{text-align:right;white-space:nowrap}
.lst{max-height:330px;overflow:auto}
.flag{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:12px;background:#f7f8fa;margin-bottom:8px;font-size:13px}
.flag.w{background:var(--warn-w)}
.dt-bar{display:flex;align-items:center;gap:12px;padding:12px 14px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.dt-tabs{display:inline-flex;background:#f0f1f4;border-radius:11px;padding:3px}
.dt-tabs button{border:none;background:none;font:inherit;font-weight:700;color:var(--ink2);padding:7px 16px;border-radius:9px;cursor:pointer}
.dt-tabs button.on{background:#fff;color:var(--ink);box-shadow:0 1px 3px rgba(16,24,40,.1)}
#dt-q{flex:1;min-width:160px;height:36px;border:1px solid #dfe2e8;border-radius:10px;padding:0 12px;font:inherit}
#dt th{cursor:pointer;user-select:none}#dt th.s::after{content:" ▾"}#dt th.s.asc::after{content:" ▴"}
#dt tbody tr{cursor:pointer}
.spk{display:block}
.dr-bd{position:fixed;inset:0;background:rgba(20,23,31,.4);z-index:60;display:none}.dr-bd.on{display:block}
.dr{position:fixed;top:0;right:0;bottom:0;width:min(620px,100%);background:var(--bg);z-index:61;transform:translateX(100%);transition:transform .22s ease;overflow:auto;padding:20px;display:grid;gap:14px;align-content:start}
.dr.on{transform:none}
.dr-h{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.dr-h h3{font-size:20px;font-weight:800}.dr-h small{color:var(--mut)}
.dr-x{border:none;background:#fff;width:36px;height:36px;border-radius:10px;font-size:16px;cursor:pointer;box-shadow:0 1px 2px rgba(16,24,40,.08)}
.dr-say{background:#fff;border-left:4px solid var(--c,var(--ink));border-radius:12px;padding:12px 14px;font-size:13.5px;line-height:1.5}
.hb{display:grid;grid-template-columns:minmax(0,1fr) 90px;gap:4px 10px;align-items:center;font-size:12.5px;padding:5px 0}
.hb span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hb b{text-align:right;font-variant-numeric:tabular-nums}
.hb i{grid-column:1/-1;height:5px;border-radius:3px;background:#e6e8ee;overflow:hidden}.hb i em{display:block;height:100%;background:var(--ink)}
@media print{.dr,.dr-bd{display:none!important}}
.ms{display:grid;gap:4px}.ms-l{font-size:11.5px;font-weight:600;color:var(--ink2)}
#ms summary{list-style:none;height:36px;border:1px solid #dfe2e8;border-radius:10px;padding:0 28px 0 9px;display:flex;align-items:center;font-size:13px;cursor:pointer;background:#fff;position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#ms summary::-webkit-details-marker{display:none}#ms summary::after{content:"▾";position:absolute;right:10px;color:var(--mut)}
#ms[open] summary{border-color:var(--red)}
.ms-p{margin-top:6px;border:1px solid #dfe2e8;border-radius:12px;background:#fff;padding:8px;display:grid;gap:6px;box-shadow:0 8px 24px rgba(16,24,40,.1)}
#ms-q{height:32px!important}
.ms-a{display:flex;gap:6px}.ms-a button{flex:1;border:none;background:#f0f1f4;border-radius:8px;padding:5px;font:inherit;font-size:11.5px;font-weight:600;cursor:pointer}
.ms-list{max-height:260px;overflow:auto;display:grid}
.ms-list label{display:flex!important;grid-template-columns:none;align-items:center;gap:8px;font-size:12.5px;font-weight:500;padding:5px 4px;border-radius:6px;cursor:pointer}
.ms-list label:hover{background:#f7f8fa}.ms-list input{width:auto!important;height:auto!important;accent-color:var(--red)}
.ms-ok{height:34px;border:none;border-radius:9px;background:var(--red);color:#fff;font:inherit;font-weight:700;cursor:pointer}
.dt-st{display:inline-flex;gap:4px;flex-wrap:wrap}
.dt-st button{border:1px solid #dfe2e8;background:#fff;border-radius:999px;padding:5px 11px;font:inherit;font-size:12px;font-weight:700;color:var(--ink2);cursor:pointer}
.dt-st button.on{background:var(--ink);border-color:var(--ink);color:#fff}
.dt-st button[data-s=hausse].on{background:var(--good);border-color:var(--good)}.dt-st button[data-s=baisse].on,.dt-st button[data-s=perdu].on{background:var(--red);border-color:var(--red)}.dt-st button[data-s=nouveau].on{background:var(--blue);border-color:var(--blue)}
@media(max-width:1100px){.seg{grid-template-columns:repeat(3,1fr)}.g3,.g32,.g2{grid-template-columns:1fr}}
@media(max-width:800px){.shell{grid-template-columns:1fr;padding:14px}.side{position:static}.toc{grid-template-columns:repeat(6,1fr)}.toc a{flex-direction:column;font-size:10.5px;padding:6px;text-align:center}.seg{grid-template-columns:repeat(2,1fr)}}
@media print{@page{size:A4 landscape;margin:9mm}body{background:#fff;font-size:11px}.side,.ti{display:none!important}.shell{display:block;padding:0}
  .card,.kpi,.sg{box-shadow:none;border:1px solid #e5e7eb;break-inside:avoid}.tw,.lst{max-height:none;overflow:visible}.sec{break-before:auto}*{-webkit-print-color-adjust:exact;print-color-adjust:exact}.cv{height:220px}}
