/**
 * Charte SBM — Cyber Board
 * ---------------------------------------------------------------------------
 * Valeurs reprises telles quelles de la feuille de style du SBM Pentest Board
 * (rapport imprimable, septembre 2026), pour que les deux boards soient
 * visuellement indiscernables :
 *
 *   or            #B0A06C     filets, soulignés de titres, boutons
 *   or clair      #CDC19E     liens sur fond sombre
 *   encre         #12171E     texte, bandeaux, blocs de code
 *   filet         #DCD9D1
 *   gris          #7A7A72     libellés secondaires
 *   fond page     #EEEDE9     ivoire, sur lequel les cartes blanches se détachent
 *   fond d'en-tête de tableau #FAF9F6
 *   typographies  Judson (titres, serif) + Noto Sans (texte)
 *
 * Sévérités du Pentest Board, conservées à l'identique :
 *   Critique #8B1A1A · Élevée #C0392B · Moyenne #B0A06C · Faible #5B7C99 · Information #7A7A72
 *
 * Ces cinq couleurs sont un jeu d'étiquettes, pas une échelle de données : mesurées,
 * elles ne forment pas une rampe ordinale valide (clarté non monotone, et surtout
 * « Faible » #5B7C99 et « Information » #7A7A72 ne diffèrent que de 0,005 en clarté —
 * ils fusionnent à l'impression en noir et blanc). Elles ne sont donc utilisées ici
 * que sur des pastilles portant le libellé en toutes lettres, jamais seules sur un
 * graphique.
 *
 * Les séries de graphiques utilisent la palette qualitative validée plus bas
 * (bandes de clarté, plancher de chroma, séparation en vision déficiente,
 * contraste). L'or SBM ne peut pas en faire partie : mesuré, il tombe sous le
 * plancher de chroma (0,072) et sous 3:1 de contraste sur blanc — il « lit gris ».
 */

:root {
  --cyb-gold:        #B0A06C;
  --cyb-gold-soft:   #CDC19E;
  --cyb-gold-dark:   #7a6d40;
  --cyb-ink:         #12171E;
  --cyb-line:        #DCD9D1;
  --cyb-grey:        #7A7A72;
  --cyb-bg:          #FFFFFF;
  --cyb-page:        #EEEDE9;
  --cyb-head-bg:     #FAF9F6;
  --cyb-text:        #12171E;
  --cyb-text-2:      #52514E;

  /* Sévérités / niveaux — toujours accompagnées de leur libellé */
  --cyb-crit:    #8B1A1A;
  --cyb-high:    #C0392B;
  --cyb-med:     #B0A06C;
  --cyb-low:     #5B7C99;
  --cyb-info:    #7A7A72;

  /* Rampe de criticité (Basse → Très haute), une seule teinte, clarté monotone.
     Validée comme rampe ordinale sur fond blanc : les couleurs de sévérité du
     Pentest Board ne peuvent pas servir ici — « Haute » et « Très haute » n'y
     sont séparées que de 13,0 ΔE en vision normale, sous le plancher de 15,
     donc indistinguables sur les petits segments d'un graphique empilé. */
  --cyb-c1: #DE9481;
  --cyb-c2: #CE6A52;
  --cyb-c3: #B23422;
  --cyb-c4: #7A190F;

  /* Séries de données (palette qualitative validée) */
  --cyb-s1: #2a78d6;
  --cyb-s2: #eb6834;
  --cyb-s3: #1baf7a;
  --cyb-s4: #eda100;
  --cyb-s5: #e87ba4;
  --cyb-s6: #008300;
  --cyb-s7: #4a3aa7;   /* stock (backlog) : distinct des deux séries de flux */

  /* États de variation */
  --cyb-good:    #1E7A32;
  --cyb-warning: #B0A06C;
  --cyb-serious: #C0392B;
  --cyb-bad:     #8B1A1A;

  --cyb-font:       "Noto Sans", Arial, Helvetica, sans-serif;
  --cyb-font-title: Judson, "Times New Roman", Times, serif;
  --cyb-mono:       ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

/* ---- Composants partagés avec le Pentest Board ---- */

.cyb-brand {
  font-family: var(--cyb-font-title);
  letter-spacing: .22em;
  font-size: 15px;
  text-transform: uppercase;
  color: var(--cyb-ink);
  line-height: 1.2;
}
.cyb-brand span {
  display: block;
  font-family: var(--cyb-font);
  font-size: 8.5px;
  letter-spacing: .3em;
  color: var(--cyb-grey);
  margin-top: 3px;
}
.cyb-brand--light { color: #fff; }
.cyb-brand--light span { color: var(--cyb-gold-soft); }

.cyb-conf {
  display: inline-block;
  margin-top: 26px;
  border: 1px solid var(--cyb-crit);
  color: var(--cyb-crit);
  padding: 4px 12px;
  font: 700 9.5px/1.4 var(--cyb-font);
  letter-spacing: .16em;
  text-transform: uppercase;
}

.cyb-btn {
  background: var(--cyb-gold);
  color: #fff;
  border: 0;
  padding: 9px 18px;
  font: 600 10.5px/1 var(--cyb-font);
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
}
.cyb-btn:hover { background: var(--cyb-gold-dark); color: #fff; }
.cyb-btn.ghost { background: transparent; color: var(--cyb-ink); border: 1px solid var(--cyb-line); }
.cyb-btn.ghost:hover { background: var(--cyb-ink); color: #fff; border-color: var(--cyb-ink); }
.cyb-btn.sm { padding: 6px 12px; font-size: 9.5px; }

.cyb-pill {
  display: inline-block;
  padding: 2px 9px;
  border-radius: 40px;
  background: var(--c, var(--cyb-grey));
  color: #fff;
  font: 700 8.5px/1.6 var(--cyb-font);
  letter-spacing: .07em;
  text-transform: uppercase;
}
.cyb-pill.sm { font-size: 7.5px; padding: 1px 6px; }

.cyb-mono { font-family: var(--cyb-mono); }
.cyb-muted { color: var(--cyb-grey); }
.cyb-small { font-size: 10px; }