[hidden]{display:none!important}
:root.cip header.sticky>div:first-child{height:4.5rem}
#cipside{position:relative;z-index:30;box-shadow:6px 0 24px rgba(15,23,42,.10),2px 0 6px rgba(15,23,42,.06)}
@media (prefers-color-scheme: dark){:root.cip:not([data-theme="light"]) #cipside{box-shadow:6px 0 24px rgba(0,0,0,.5),2px 0 6px rgba(0,0,0,.35)}}
:root.cip[data-theme="dark"] #cipside{box-shadow:6px 0 24px rgba(0,0,0,.5),2px 0 6px rgba(0,0,0,.35)}
#opscard{box-shadow:0 10px 30px rgba(15,23,42,.10),0 2px 6px rgba(15,23,42,.06)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) #opscard{box-shadow:0 10px 30px rgba(0,0,0,.5),0 2px 6px rgba(0,0,0,.35)}}
:root[data-theme="dark"] #opscard{box-shadow:0 10px 30px rgba(0,0,0,.5),0 2px 6px rgba(0,0,0,.35)}
:root.cip #alerts{padding-top:1.75rem}
:root.cip #view{padding-top:2rem}
:root{
  --bg:244 246 249; --surface:255 255 255; --surface2:238 242 248; --line:220 225 234;
  --ink:22 33 58; --muted:86 96 121; --brand:47 84 150; --brandsoft:228 235 246;
  --side:22 38 71; --sideink:205 216 236; --accent:184 98 27; --accentsoft:248 235 221;
  --ok:46 125 91; --oksoft:224 242 233; --warn:166 98 15; --warnsoft:251 240 220; --crit:180 35 24; --critsoft:252 228 225;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:13 18 28; --surface:22 30 45; --surface2:30 40 60; --line:44 56 80;
    --ink:230 234 242; --muted:154 165 188; --brand:127 162 224; --brandsoft:32 46 74;
    --side:9 14 24; --sideink:190 202 226; --accent:227 154 91; --accentsoft:58 42 28;
    --ok:108 196 156; --oksoft:22 52 40; --warn:230 174 92; --warnsoft:58 46 23; --crit:240 128 116; --critsoft:66 30 28;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:13 18 28; --surface:22 30 45; --surface2:30 40 60; --line:44 56 80;
  --ink:230 234 242; --muted:154 165 188; --brand:127 162 224; --brandsoft:32 46 74;
  --side:9 14 24; --sideink:190 202 226; --accent:227 154 91; --accentsoft:58 42 28;
  --ok:108 196 156; --oksoft:22 52 40; --warn:230 174 92; --warnsoft:58 46 23; --crit:240 128 116; --critsoft:66 30 28;
  color-scheme:dark;
}
/* Portail OPS : palette et formes inspirées de Metronic 8 (démo 23) */
:root.ops{--band:240 246 253;--bg:247 247 247;--surface:255 255 255;--surface2:249 249 249;--line:228 232 240;--ink:7 20 55;--muted:58 68 95;--brand:0 96 209;--brandsoft:233 243 255;--accent:122 79 0;--accentsoft:255 241 194;--ok:4 120 57;--oksoft:223 255 234;--warn:161 98 7;--warnsoft:255 241 194;--crit:200 20 70;--critsoft:255 238 243;--sun:255 232 150;}
@media (prefers-color-scheme: dark){:root.ops:not([data-theme="light"]){--band:24 33 52;--bg:15 16 22;--surface:21 23 28;--surface2:27 28 34;--line:38 39 48;--ink:245 245 245;--muted:128 135 153;--brand:0 110 239;--brandsoft:23 35 56;--accent:198 160 0;--accentsoft:48 40 18;--ok:0 163 86;--oksoft:31 33 42;--warn:198 160 0;--warnsoft:48 40 18;--crit:226 44 89;--critsoft:48 25 34;--sun:94 78 22;color-scheme:dark}}
:root.ops[data-theme="dark"]{--band:24 33 52;--bg:15 16 22;--surface:21 23 28;--surface2:27 28 34;--line:38 39 48;--ink:245 245 245;--muted:128 135 153;--brand:0 110 239;--brandsoft:23 35 56;--accent:198 160 0;--accentsoft:48 40 18;--ok:0 163 86;--oksoft:31 33 42;--warn:198 160 0;--warnsoft:48 40 18;--crit:226 44 89;--critsoft:48 25 34;--sun:94 78 22;color-scheme:dark}
:root.ops body{font-family:Roboto,"Segoe UI",system-ui,sans-serif;font-size:13.5px}
:root.ops body{background:rgb(var(--band))}
:root.ops:not([data-theme="dark"]) #view section.bg-surface,:root.ops:not([data-theme="dark"]) #view .kpi,:root.ops:not([data-theme="dark"]) #opscard{background:#FFFFFF}
@media (prefers-color-scheme: dark){:root.ops:not([data-theme="light"]) #view section.bg-surface,:root.ops:not([data-theme="light"]) #view .kpi,:root.ops:not([data-theme="light"]) #opscard{background:rgb(var(--surface))}}
:root.ops header.sticky{position:relative;background:transparent;border-color:transparent}
:root.ops #view section.bg-surface,:root.ops #view .kpi{border-radius:1.25rem;box-shadow:0 3px 4px rgba(0,0,0,.03)}
:root.ops #view section.bg-surface>div:first-child.border-b{border-color:transparent;padding:1.25rem 1.5rem .25rem}
:root.ops #view section.bg-surface>div.p-4{padding:1rem 1.5rem 1.5rem}
:root.ops #view section h2{font-size:17px;font-weight:600}
:root.ops #view .kpi{border-style:dashed;border-width:1.5px;box-shadow:none}
:root.ops #view button.bg-brand,:root.ops #view a.bg-brand{border-radius:.5rem;padding:.55rem 1rem}
:root.ops #view input,:root.ops #view select,:root.ops #view textarea{border-radius:.5rem;background:rgb(var(--surface2));border-color:transparent}
:root.ops #view input:focus,:root.ops #view select:focus,:root.ops #view textarea:focus{background:rgb(var(--surface));border-color:rgb(var(--brand) / .5)}
:root.ops #view h1{font-size:24px;font-weight:600;color:rgb(var(--ink))}
.tile{display:grid;place-items:center;gap:.4rem;aspect-ratio:1/1;border-radius:.9rem;background:rgb(var(--surface2));border:1px solid rgb(var(--line));font-weight:600;font-size:12.5px;text-align:center;padding:.4rem;color:rgb(var(--ink))}
.tile:hover{border-color:rgb(var(--brand) / .5)}
.tile[aria-current="page"]{background:rgb(var(--brandsoft));border-color:rgb(var(--brand));color:rgb(var(--brand))}
.tile svg,.ico svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tile svg{color:rgb(var(--muted))}.tile[aria-current="page"] svg{color:rgb(var(--brand))}
.topnav a{color:rgb(var(--ink));font-weight:500;font-size:15px}.topnav a[aria-current="page"],.topnav a:hover{color:rgb(var(--brand))}
.btn-sec{background:#FFFFFF;color:rgb(var(--ink));border:1px solid rgb(var(--line));box-shadow:0 1px 2px rgba(7,20,55,.06),0 2px 6px rgba(7,20,55,.06)}
.btn-sec:hover{color:rgb(var(--brand));border-color:rgb(var(--brand) / .35);box-shadow:0 4px 12px rgba(7,20,55,.12)}
.btn-sec:active{box-shadow:0 1px 2px rgba(7,20,55,.08)}
@media (prefers-reduced-motion:no-preference){.btn-sec{transition:box-shadow .15s ease,transform .15s ease,color .15s ease,border-color .15s ease}.btn-sec:hover{transform:translateY(-1px)}.btn-sec:active{transform:translateY(0)}}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .btn-sec{background:rgb(var(--surface2));box-shadow:0 1px 2px rgba(0,0,0,.4)}}
:root[data-theme="dark"] .btn-sec{background:rgb(var(--surface2));box-shadow:0 1px 2px rgba(0,0,0,.4)}
:root.ops #view .btn-sec{border-radius:.5rem}
/* Espace CIPRES : structure et palette inspirées de Metronic 8 (démo 7) */
:root.cip{--bg:251 245 240;--surface:255 255 255;--surface2:249 249 249;--line:241 241 244;--ink:7 20 55;--muted:62 68 88;--brand:180 74 34;--brandsoft:253 236 227;--accent:122 79 0;--accentsoft:255 241 194;--ok:0 132 64;--oksoft:223 255 234;--warn:161 98 7;--warnsoft:255 241 194;--crit:200 20 70;--critsoft:255 238 243}
@media (prefers-color-scheme: dark){:root.cip:not([data-theme="light"]){--bg:24 18 15;--surface:21 23 28;--surface2:27 28 34;--line:38 39 48;--ink:245 245 245;--muted:184 190 208;--brand:232 124 84;--brandsoft:52 30 22;--accent:230 174 92;--accentsoft:48 40 18;--ok:23 198 83;--oksoft:23 45 32;--warn:230 174 92;--warnsoft:48 40 18;--crit:240 110 130;--critsoft:48 25 34;color-scheme:dark}
:root.cip:not([data-theme="light"]) .bg-brand.text-white{color:rgb(24 18 15)}}
:root.cip[data-theme="dark"]{--bg:24 18 15;--surface:21 23 28;--surface2:27 28 34;--line:38 39 48;--ink:245 245 245;--muted:184 190 208;--brand:232 124 84;--brandsoft:52 30 22;--accent:230 174 92;--accentsoft:48 40 18;--ok:23 198 83;--oksoft:23 45 32;--warn:230 174 92;--warnsoft:48 40 18;--crit:240 110 130;--critsoft:48 25 34;color-scheme:dark}
:root.cip[data-theme="dark"] .bg-brand.text-white{color:rgb(24 18 15)}
:root.cip .psub{margin:.1rem 0 .5rem 1.95rem;padding-left:1rem;border-left:1px dashed rgb(var(--muted) / .35);display:grid;gap:.1rem}
:root.cip .psub a{display:flex;align-items:center;gap:.6rem;padding:.4rem .6rem;border-radius:.45rem;font-size:13.5px;font-weight:500;color:rgb(var(--muted));min-width:0}
:root.cip .psub a::before{content:"";width:6px;height:6px;border-radius:9999px;background:currentColor;opacity:.45;flex-shrink:0}
:root.cip .psub a:hover{color:rgb(var(--brand));background:rgb(var(--surface2))}
:root.cip .psub a[aria-current="true"]{color:rgb(var(--brand));font-weight:600}
:root.cip .psub a[aria-current="true"]::before{opacity:1}
.pchev{width:16px;height:16px;flex-shrink:0;color:rgb(var(--muted));transition:transform .15s}
.pitem[aria-expanded="true"] .pchev{transform:rotate(90deg)}
:root.cip body{font-family:Roboto,"Segoe UI",system-ui,sans-serif;font-size:13.5px}
:root.cip header.sticky{background:rgb(var(--bg));border-color:transparent}
:root.cip #crumb{font-size:13px}
:root.cip #view section.bg-surface,:root.cip #view .kpi{border-radius:.5rem;box-shadow:0 3px 4px rgba(0,0,0,.03)}
:root.cip #view h1{font-size:22px;font-weight:600}
:root.cip #view input,:root.cip #view select,:root.cip #view textarea{border-radius:.45rem;background:rgb(var(--surface2));border-color:transparent}
:root.cip #view input:focus,:root.cip #view select:focus,:root.cip #view textarea:focus{background:rgb(var(--surface));border-color:rgb(var(--brand) / .5)}
.rail-btn{width:44px;height:44px;border-radius:.45rem;display:grid;place-items:center;color:rgb(var(--muted));position:relative}
.rail-btn:hover{background:rgb(var(--surface2));color:rgb(var(--brand))}
.rail-btn[aria-pressed="true"]{background:rgb(var(--surface2));color:rgb(var(--brand))}
.rail-btn svg,.pitem .pico svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pitem{display:flex;align-items:center;gap:.8rem;padding:.55rem .6rem;border-radius:.45rem;min-width:0}
.pitem:hover{background:rgb(var(--surface2))}
.pitem[aria-current="page"]{background:rgb(var(--brandsoft))}
.pitem .pico{width:44px;height:44px;border-radius:.45rem;display:grid;place-items:center;background:rgb(var(--surface2));color:rgb(var(--brand));flex-shrink:0}
.pitem[aria-current="page"] .pico{background:rgb(var(--surface))}
html,body{height:100%}
body{background:rgb(var(--bg));color:rgb(var(--ink));font-family:Roboto,"Segoe UI",system-ui,sans-serif;font-size:14px}
.mono{font-family:"JetBrains Mono",ui-monospace,Consolas,monospace;font-variant-numeric:tabular-nums}
.num{font-variant-numeric:tabular-nums}
h1,h2,h3{text-wrap:balance}
:focus-visible{outline:2px solid rgb(var(--brand));outline-offset:2px}
.scroll-x{overflow-x:auto}
.bar-hit:hover rect.bar{fill:rgb(var(--accent))}
@media (prefers-reduced-motion:no-preference){.fade{animation:f .18s ease-out}@keyframes f{from{opacity:.4}to{opacity:1}}}