/* Développement · Performances. Interface sombre uniquement (comme le reste de l'espace staff).
   Palette catégorielle validée (dark, fond #131318) : bleu, orange, aqua, jaune, magenta ; gris neutre pour « sans détail ». */
.perf{--fond:#17171c;--texte:#ececf1;--doux:#a1a1ae;--pale:#6f6f7d;--ligne:#ffffff12;--ligne-forte:#ffffff22;
 --ok:#0ca30c;--attention:#fab219;--serieux:#ec835a;--critique:#d03b3b;display:grid;gap:14px;color:var(--texte);font-family:var(--s-police,inherit)}
.perf.chargement{opacity:.7}
.perf .muted{color:var(--doux)}
.perf-f-jeu{--c:#3987e5}.perf-f-services{--c:#d95926}.perf-f-bdd{--c:#199e70}.perf-f-dev{--c:#c98500}.perf-f-systeme{--c:#d55181}.perf-f-nd{--c:#6f6f7d}.perf-f-hausse{--c:#d95926}.perf-f-baisse{--c:#3987e5}
.perf-l-swap,.perf-l-fil{--c:#f0efec}.perf-cle-ev{--c:#a1a1ae}
.perf-cle{display:inline-block;flex:none;width:10px;height:10px;margin-right:7px;border-radius:3px;background:var(--c,#888)}
.perf-cle-ligne{height:3px;width:14px;border-radius:2px}

/* Bandeau d'état */
.perf-bandeau{display:grid;gap:8px;padding:14px 18px;border:1px solid var(--ligne);border-radius:12px;background:linear-gradient(160deg,#1a1a21,#121216)}
.perf-etat{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.perf-etat strong{font-size:17px;font-weight:600}
.perf-ico{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;font-size:12px;font-weight:700;background:#ffffff10}
.perf-ok .perf-ico{color:var(--ok)}.perf-attention .perf-ico{color:var(--attention)}.perf-critique .perf-ico{color:var(--critique)}
.perf-problemes{color:var(--doux);font-size:14px}
.perf-live{display:inline-flex;align-items:center;gap:8px;margin-left:auto;padding:5px 12px;border:1px solid var(--ligne-forte);border-radius:999px;background:transparent;color:var(--doux);font:13px var(--s-police,inherit);cursor:pointer}
.perf-live:hover{border-color:#ffffff44;color:var(--texte)}
.perf-point{width:8px;height:8px;border-radius:50%;background:var(--ok);animation:perf-pouls 1.6s ease-in-out infinite}
.perf-live.pause .perf-point{background:var(--pale);animation:none}
@keyframes perf-pouls{50%{opacity:.35}}
@media(prefers-reduced-motion:reduce){.perf-point{animation:none}}
.perf-direct{margin:0;font-size:15px;line-height:1.5;color:var(--texte)}
.perf-note{margin:0;font-size:13px}

/* Filtres : une seule ligne au-dessus des graphiques */
.perf-filtres{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px}
.perf-groupe{display:flex;flex-wrap:wrap;gap:6px}
.perf-puce{display:inline-flex;align-items:center;padding:6px 14px;border:1px solid var(--ligne-forte);border-radius:999px;background:#131318;color:var(--doux);font:13.5px var(--s-police,inherit);cursor:pointer}
.perf-puce:hover{color:var(--texte);background:#ffffff0a}
.perf-puce.actif{color:#f0dca8;border-color:#b89a63;background:#b89a632b}
.perf-puce .perf-cle{margin-right:7px}

/* Tuiles */
.perf-tuiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px}
.perf-tuile{display:grid;gap:5px;align-content:start;padding:13px 15px;border:1px solid var(--ligne);border-radius:12px;background:linear-gradient(160deg,#1a1a21,#121216)}
.perf-tuile-haut{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.perf-tuile-titre{font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--doux)}
.perf-tuile-etat{font-size:12px;font-weight:600}
.perf-tuile.perf-attention .perf-tuile-etat{color:var(--attention)}.perf-tuile.perf-critique .perf-tuile-etat{color:var(--critique)}.perf-tuile.perf-ok .perf-tuile-etat{color:var(--ok)}
.perf-tuile.perf-critique{border-color:#d03b3b66}.perf-tuile.perf-attention{border-color:#fab21955}
.perf-valeur{font:600 26px/1.1 var(--s-police,inherit);color:var(--texte)}
.perf-sous{font-size:12.5px;line-height:1.4;color:var(--doux)}
.perf-jauge{height:5px;border-radius:999px;background:#ffffff10;overflow:hidden}
.perf-jauge span{display:block;height:100%;border-radius:999px;background:var(--ok)}
.perf-attention .perf-jauge span{background:var(--attention)}.perf-critique .perf-jauge span{background:var(--critique)}

/* Cartes et graphiques */
.perf-carte{display:grid;gap:10px;align-content:start;min-width:0;padding:16px 18px;border:1px solid var(--ligne);border-radius:12px;background:linear-gradient(160deg,#1a1a21,#121216)}
.perf-carte-tete h3{margin:0 0 3px;font:600 16px var(--s-police,inherit);color:var(--texte)}
.perf-carte h4{margin:8px 0 0;font:600 13px var(--s-police,inherit);letter-spacing:.06em;text-transform:uppercase;color:var(--doux)}
.perf-sous-titre{margin:0;font-size:13px;line-height:1.45;color:var(--doux)}
.perf-legende{display:flex;flex-wrap:wrap;gap:6px 18px}
.perf-leg{display:inline-flex;align-items:center;font-size:13px;color:var(--doux)}
.perf-graph{position:relative;min-width:0}
.perf-svg{display:block;width:100%;height:auto;overflow:visible}
.perf-grille{stroke:#ffffff14;stroke-width:1}
.perf-zero{stroke:#ffffff40;stroke-width:1}
.perf-axe{fill:#a1a1ae;font:11px var(--s-police,inherit)}
.perf-axe-ev{fill:#d6d6de}
.perf-aire{fill:var(--c);fill-opacity:.9;stroke:#16161b;stroke-width:1.5;stroke-linejoin:round}
.perf-ligne{fill:none;stroke:var(--c);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.perf-redem{stroke:#f0efec;stroke-opacity:.55;stroke-width:1}
.perf-redem-texte{fill:#d6d6de}
.perf-focus{fill:#ffffff;fill-opacity:.09}
.perf-curseur{stroke:#f0efec;stroke-opacity:.7;stroke-width:1;pointer-events:none}
.perf-zone{fill:transparent;cursor:crosshair}
.perf-zone:focus-visible{outline:2px solid #b89a63;outline-offset:-2px}
.perf-barre-ev{fill:var(--c);fill-opacity:.85;cursor:pointer}
.perf-barre-ev:hover,.perf-barre-ev:focus{fill-opacity:1;outline:none;stroke:#f0efec;stroke-width:1.5}
.perf-barre{fill:var(--c);cursor:pointer;outline:none}
.perf-barre:hover,.perf-barre:focus,.perf-barre.actif{stroke:#f0efec;stroke-width:2}
.perf-zone-barre{fill:transparent;cursor:pointer}
.perf-duo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;align-items:start}
@media(max-width:1100px){.perf-duo{grid-template-columns:1fr}}

/* Infobulle */
.perf-tip{position:fixed;z-index:300;display:grid;gap:4px;min-width:200px;max-width:320px;padding:10px 12px;border:1px solid var(--ligne-forte,#ffffff22);border-radius:10px;background:#101015;box-shadow:0 10px 28px #000b;color:#ececf1;font:13px var(--s-police,inherit);pointer-events:none}
.perf-tip[hidden]{display:none}
.perf-tip-titre{font-weight:600;color:#a1a1ae;font-size:12px;margin-bottom:2px}
.perf-tip-ligne{display:flex;align-items:center;gap:6px}
.perf-tip-ligne strong{font-weight:600;color:#ececf1}
.perf-tip-ligne span{color:#a1a1ae}
.perf-tip-ligne .perf-cle{margin-right:2px}
.perf-tip-aide{font-size:11.5px;color:#8a8a96;margin-top:2px}

/* Tableaux */
.perf-table{width:100%;border-collapse:collapse;font-size:13.5px}
.perf-table th{padding:6px 8px;text-align:left;font-weight:600;font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--doux);border-bottom:1px solid var(--ligne-forte)}
.perf-table td{padding:8px;border-bottom:1px solid var(--ligne);color:var(--texte);vertical-align:middle}
.perf-table .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.perf-table th:not(:first-child){text-align:right}
.perf-table tbody tr[role=button]{cursor:pointer}
.perf-table tbody tr[role=button]:hover,.perf-table tbody tr.actif{background:#b89a631a}
.perf-table tbody tr:focus-visible{outline:2px solid #b89a63;outline-offset:-2px}
.perf-table .perf-hausse{color:#ec835a}
.perf-part{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-width:110px}
.perf-mini{flex:1;height:6px;border-radius:999px;background:#ffffff10;overflow:hidden;min-width:50px}
.perf-mini span{display:block;height:100%;border-radius:999px;background:var(--c)}
.perf-proc td:first-child{white-space:nowrap}

/* Explications */
.perf-expl{display:grid;gap:10px}
.perf-exp{padding:12px 14px;border:1px solid var(--ligne);border-left:3px solid var(--pale);border-radius:10px;background:#ffffff05}
.perf-exp.perf-attention{border-left-color:var(--attention)}.perf-exp.perf-critique{border-left-color:var(--critique)}.perf-exp.perf-ok{border-left-color:#3987e5}
.perf-exp h4{display:flex;align-items:center;gap:8px;margin:0 0 5px;font:600 15px var(--s-police,inherit);letter-spacing:0;text-transform:none;color:var(--texte)}
.perf-exp p{margin:0 0 6px;font-size:14px;line-height:1.55;color:#d6d6de}
.perf-exp .perf-ico{width:20px;height:20px;font-size:11px}
.perf-exp.perf-ok .perf-ico{color:#74a9de}.perf-exp.perf-attention .perf-ico{color:var(--attention)}.perf-exp.perf-critique .perf-ico{color:var(--critique)}
.perf-classement{display:grid;gap:7px}
.perf-classe{display:grid;grid-template-columns:minmax(120px,220px) 1fr 44px;align-items:center;gap:12px;font-size:13.5px}
.perf-classe-nom{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--texte)}
.perf-classe strong{text-align:right;font-variant-numeric:tabular-nums}
.perf-tableau summary{cursor:pointer;color:var(--doux);font-size:14px}
.perf-defile{max-height:380px;overflow:auto;margin-top:10px}
@media(max-width:700px){.perf-valeur{font-size:22px}.perf-classe{grid-template-columns:110px 1fr 36px}}