/*
  Acta — registre d'entités.

  Parti pris : le référentiel est un REGISTRE, pas un explorateur de fichiers.
  Les fonds luxembourgeois se lisent sur des extraits RCS et des tableaux de
  compartiments, faits de codes (LEI, ISIN, RCS). Tout le registre est donc
  composé en monospace : les identifiants s'alignent d'eux-mêmes, colonne par
  colonne, comme sur les documents sources. L'interface (chrome, libellés,
  formulaires) reste en sans-serif système pour ne pas concurrencer les données.
*/

/*
  Thèmes de couleur (menu « Layout », app `ui`). Les couleurs ne vivent QUE dans les
  tokens `--color-*` ci-dessous ; une règle n'écrit jamais une couleur en dur.
  :root = thème Standard. Ajouter un thème = une entrée dans `ui/themes.py` + un bloc
  `:root[data-theme="<clé>"]` redéfinissant les mêmes tokens (vérifié par ui/tests.py).
  Contraste WCAG AA vérifié sur Black & White et Generali ; le Standard est conservé
  tel quel (`--color-text-subtle` y reste sous 4,5:1, signalé).
*/
:root {
  --color-bg:            #E7EAED;
  --color-surface:       #F7F8FA;
  --color-toolbar:       #EDF1F2;
  --color-input:         #FFFFFF;
  --color-row-hover:     #EFF3F4;
  --color-text:          #101922;
  --color-text-muted:    #55646F;
  --color-text-subtle:   #8A98A3;
  --color-border:        #CBD3D9;
  --color-border-soft:   #DFE5EA;
  --color-primary:       #0E5B55;
  --color-primary-hover: #0E5B55;
  --color-primary-soft:  #D6E3E1;
  --color-on-primary:    #F7F8FA;
  --color-link:          #0E5B55;
  --color-success:       #0E5B55;
  --color-warning:       #7A5C0C;
  --color-danger:        #9E4023;
  --color-danger-soft:   #F0DFD8;
  --color-info:          #4A5A7A;   /* configuration (documentation) */
  --color-info-soft:     #DDE2EC;
  --color-shadow:        rgba(16, 25, 34, 0.12);
  /* Statut qualité : texte, bordure, fond, motif de bordure. */
  --color-bronze:        #8A4F1E;
  --color-bronze-border: #B98A5E;
  --color-bronze-bg:     #F3E7DA;
  --color-silver:        #4A5A7A;
  --color-silver-border: #4A5A7A;
  --color-silver-bg:     #DDE2EC;
  --color-gold:          #7A5C0C;
  --color-gold-border:   #B8962E;
  --color-gold-bg:       #F4ECD0;
  --quality-bronze-style: solid;
  --quality-silver-style: solid;
  --quality-gold-style:   solid;
  --quality-gold-width:   1px;

  /* Noms historiques des règles, alias des tokens sémantiques. */
  --paper:    var(--color-bg);
  --folio:    var(--color-surface);
  --ink:      var(--color-text);
  --ink-2:    var(--color-text-muted);
  --ink-3:    var(--color-text-subtle);
  --rule:     var(--color-border);
  --rule-soft:var(--color-border-soft);
  --accent:   var(--color-primary);
  --accent-2: var(--color-primary-soft);
  --oxide:    var(--color-danger);
  --oxide-2:  var(--color-danger-soft);
  --slate:    var(--color-info);
  --slate-2:  var(--color-info-soft);

  --mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas,
          "Liberation Mono", monospace;
  --ui: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --rail-w: 1.45rem;
  --gutter-w: 5.25rem;
}

/* Black & White : monochrome, contraste élevé (impression, captures réglementaires).
   La qualité ne repose pas sur la couleur : libellé + motif de bordure
   (Bronze pointillé, Silver plein, Gold double). Même bloc dans @media print. */
:root[data-theme="bw"] {
  --color-bg: #FFFFFF; --color-surface: #FFFFFF; --color-toolbar: #F2F2F2;
  --color-input: #FFFFFF; --color-row-hover: #F0F0F0;
  --color-text: #000000; --color-text-muted: #333333; --color-text-subtle: #555555;
  --color-border: #8C8C8C; --color-border-soft: #CCCCCC;
  --color-primary: #000000; --color-primary-hover: #333333; --color-primary-soft: #E6E6E6;
  --color-on-primary: #FFFFFF; --color-link: #000000;
  --color-success: #000000; --color-warning: #000000;
  --color-danger: #000000; --color-danger-soft: #E6E6E6;
  --color-info: #000000; --color-info-soft: #F2F2F2;
  --color-shadow: rgba(0, 0, 0, 0.25);
  --color-bronze: #000000; --color-bronze-border: #000000; --color-bronze-bg: #FFFFFF;
  --color-silver: #000000; --color-silver-border: #000000; --color-silver-bg: #FFFFFF;
  --color-gold: #000000; --color-gold-border: #000000; --color-gold-bg: #FFFFFF;
  --quality-bronze-style: dotted; --quality-silver-style: solid;
  --quality-gold-style: double; --quality-gold-width: 3px;
}

/* Generali : rouge #C5281C, rouge foncé #8B1A12 au survol / actif, gris neutres,
   fond blanc. */
:root[data-theme="generali"] {
  --color-bg: #FFFFFF; --color-surface: #FFFFFF; --color-toolbar: #F5F5F5;
  --color-input: #FFFFFF; --color-row-hover: #FBF3F2;
  --color-text: #1A1A1A; --color-text-muted: #555555; --color-text-subtle: #6B6B6B;
  --color-border: #CCCCCC; --color-border-soft: #E5E5E5;
  --color-primary: #C5281C; --color-primary-hover: #8B1A12; --color-primary-soft: #FBE9E7;
  --color-on-primary: #FFFFFF; --color-link: #C5281C;
  --color-success: #2E6B34; --color-warning: #7A5C0C;
  --color-danger: #8B1A12; --color-danger-soft: #F6DCD9;
  --color-info: #4A5A7A; --color-info-soft: #E8EBF1;
  --color-shadow: rgba(0, 0, 0, 0.14);
  --color-bronze: #8A4F1E; --color-bronze-border: #B98A5E; --color-bronze-bg: #F3E7DA;
  --color-silver: #4A5A7A; --color-silver-border: #4A5A7A; --color-silver-bg: #DDE2EC;
  --color-gold: #7A5C0C; --color-gold-border: #B8962E; --color-gold-bg: #F4ECD0;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--ui);
  font-size: 15px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--color-link); text-decoration-thickness: 1px; text-underline-offset: 2px; }

:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* ---------- Chrome ---------- */

.masthead {
  display: flex;
  flex-wrap: wrap;
  row-gap: 0.6rem;
  align-items: baseline;
  gap: 1.25rem;
  padding: 1rem 1.75rem;
  border-bottom: 1px solid var(--rule);
  background: var(--folio);
}

.wordmark {
  font-family: var(--mono);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--ink);
  text-decoration: none;
}

.masthead__sub {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-3);
}

.masthead__spacer { flex: 1; }

.masthead__links {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 1rem;
  font-size: 13px;
}

/* Sélecteur de langue : l'étiquette reste pour les lecteurs d'écran. */
.lang { display: flex; align-items: baseline; gap: 0.4rem; }
.lang__label {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip-path: inset(50%); white-space: nowrap;
}
.lang select { padding: 0.2rem 0.4rem; font-size: 12px; }

.shell {
  max-width: 1080px;
  margin: 0 auto;
  padding: 2rem 1.75rem 5rem;
}
/* Documentation : diagrammes de 1 340 px, prose élargie en conséquence. */
.shell--wide { max-width: 1480px; }
/* Fiche d'une entité : pleine largeur, gouttières de 24 px ; les tableaux défilent
   dans leur propre conteneur, jamais la page. */
.shell--full { max-width: none; padding: 1.25rem 24px 4rem; }

/* ---------- Recherche ---------- */

.search {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: flex-end;
  margin-bottom: 1.5rem;
}

.field { display: flex; flex-direction: column; gap: 0.3rem; }

.field__label {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-3);
}

input[type="search"], input[type="text"], input[type="date"], input[type="password"], select {
  font-family: var(--mono);
  font-size: 13px;
  color: var(--ink);
  background: var(--folio);
  border: 1px solid var(--rule);
  border-radius: 2px;
  padding: 0.45rem 0.6rem;
}

input[type="search"] { min-width: 18rem; }

.btn {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-on-primary);
  background: var(--accent);
  border: 1px solid var(--accent);
  border-radius: 2px;
  padding: 0.5rem 0.9rem;
  cursor: pointer;
}

.btn:hover { background: var(--color-primary-hover); border-color: var(--color-primary-hover); }
.btn--ghost { background: transparent; color: var(--accent); }
.btn--ghost:hover { background: transparent; color: var(--color-primary-hover); }

/* ---------- Liste d'entités ---------- */

.count {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-3);
  margin-bottom: 0.75rem;
}

.ledger {
  background: var(--folio);
  border: 1px solid var(--rule);
  border-radius: 2px;
}

.ledger__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 8rem 3rem 12rem;
  gap: 1rem;
  align-items: baseline;
  padding: 0.7rem 1rem;
  border-bottom: 1px solid var(--rule-soft);
  font-family: var(--mono);
  font-size: 13px;
}

.ledger__row:last-child { border-bottom: 0; }
.ledger__row:hover { background: var(--color-row-hover); }

.ledger__name { font-weight: 600; }
.ledger__name a { text-decoration: none; color: var(--ink); }
.ledger__name a:hover { text-decoration: underline; }

/* ---------- Folio : en-tête de structure ---------- */

.folio {
  background: var(--folio);
  border: 1px solid var(--rule);
  border-radius: 2px;
  overflow: hidden;
}

/* En-tête compact (2 lignes) : fil + nom + type, puis métadonnées ; indicateurs à droite. */
.folio__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.6rem 2rem;
  padding: 0.75rem 1.5rem;
  border-bottom: 1px solid var(--rule);
}
.folio__lead { flex: 1 1 28rem; min-width: 0; display: flex; flex-direction: column; gap: 0.35rem; }
.folio__line { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.35rem 0.6rem; }

.folio__title {
  font-family: var(--mono);
  font-size: 19px;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin: 0;
}
.folio__type {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--ink-3); border: 1px solid var(--rule); border-radius: 2px; padding: 0 0.35rem;
}

/* Indicateurs du fonds (dernière NAV de la période). */
.kpis { display: flex; flex-wrap: wrap; gap: 0.25rem 1.5rem; margin: 0; }
.kpis:empty { display: none; }
.kpi { display: flex; flex-direction: column; gap: 0.1rem; }
.kpi dt {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-3);
}
.kpi dd {
  margin: 0; font-family: var(--mono); font-size: 14px; font-weight: 700;
  font-variant-numeric: tabular-nums; white-space: nowrap; color: var(--ink);
}
.kpi dd small { font-size: 10px; font-weight: 400; color: var(--ink-3); }
.kpi--alert dd { color: var(--oxide); }

.folio__ids {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 1.25rem;
  font-family: var(--mono);
  font-size: 12px;
  color: var(--ink-2);
}

.folio__ids b {
  font-weight: 400;
  color: var(--ink-3);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-size: 10px;
  margin-right: 0.35rem;
}

/* ---------- Barre de date ---------- */

/* Barre d'outils unique : outils de l'onglet (période NAV) à gauche, point de vue
   bitemporel à droite, séparé par un filet, actions (export) à l'extrême droite. */
.toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1rem;
  padding: 0.45rem 1.5rem;
  border-bottom: 1px solid var(--rule);
  background: var(--color-toolbar);
}
.toolbar__tab { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; }
.toolbar__tab:empty, .toolbar__actions:empty { display: none; }
.toolbar__period { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.toolbar__time {
  display: flex; flex-wrap: wrap; gap: 0.5rem 0.75rem; align-items: center;
  margin-left: auto; padding-left: 1rem; border-left: 1px solid var(--rule);
}
.toolbar__tab:empty + .toolbar__time { margin-left: 0; padding-left: 0; border-left: 0; }
.toolbar__actions { display: flex; align-items: center; padding-left: 1rem; border-left: 1px solid var(--rule); }

/* Raccourcis de période : segmentés, l'actif en accent. */
.ranges { display: inline-flex; border: 1px solid var(--rule); border-radius: 2px; background: var(--folio); }
.ranges__item {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.06em; text-decoration: none;
  color: var(--ink-2); padding: 0.25rem 0.55rem; border-left: 1px solid var(--rule-soft);
}
.ranges__item:first-child { border-left: 0; }
.ranges__item:hover { color: var(--ink); background: var(--paper); }
.ranges__item[aria-current="true"] { color: var(--folio); background: var(--accent); }
.btn--small { padding: 0.3rem 0.6rem; }

.asof__label {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-3);
}

/* Une étiquette ne se sépare jamais de son champ quand le formulaire passe à la ligne. */
.asof__field { display: inline-flex; gap: 0.5rem; align-items: center; }

.stamp {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 0.3rem 0.6rem;
  border: 1px solid var(--accent);
  color: var(--accent);
  border-radius: 2px;
}

/* Quand la date consultée n'est pas aujourd'hui, le folio devient une archive. */
.stamp--archive {
  border-color: var(--oxide);
  color: var(--oxide);
  background: var(--oxide-2);
}

.asof__spacer { flex: 1; }

/* Version lue sur l'axe de connaissance — explicite, même quand « Connu au » est vide. */
.asof__version {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--ink-2);
}

.tally {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--ink-2);
  letter-spacing: 0.04em;
}

/* ---------- Registre : l'arbre ---------- */

.register__head {
  display: flex;
  padding: 0.6rem 1.5rem 0.5rem;
  border-bottom: 1px solid var(--rule);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-3);
}

.register__head .eff {
  width: var(--gutter-w);
  flex: none;
  /* Libellés longs (de : « Durch­gerechnet ») : coupure à la césure conditionnelle. */
  hyphens: manual;
  overflow-wrap: break-word;
  text-align: right;
  padding: 0 1rem 0 0;
  font-size: 10px;
  font-weight: 400;
  color: var(--ink-3);
}

.register { padding: 0.35rem 0 0.9rem; }

.row {
  display: flex;
  align-items: stretch;
  min-height: 2.05rem;
  padding: 0 1.5rem;
}

.row:hover { background: var(--color-row-hover); }

/*
  `display: flex` écraserait l'attribut `hidden` (règle UA de même poids, mais
  moins prioritaire que l'auteur) : sans cette règle, une branche repliée restait
  visible alors que son bouton affichait « + ».
*/
.row[hidden] { display: none; }

/* Gouttière de détention effective — la colonne qui rend la dilution lisible. */
.eff {
  width: var(--gutter-w);
  flex: none;
  padding: 0.3rem 1rem 0 0;
  text-align: right;
  font-family: var(--mono);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  color: var(--accent);
  font-weight: 600;
}

.eff--diluted { color: var(--oxide); }

/* Racine de la structure, en tête du registre. */
.row--root { border-bottom: 1px solid var(--rule-soft); }
.row--root .name { font-size: 14px; }

/* Légende de la gouttière : la couleur n'est jamais le seul porteur du sens. */
.legend {
  margin: 0;
  padding: 0 1.5rem 0.5rem;
  font-family: var(--mono);
  font-size: 11px;
  color: var(--ink-2);
}
.legend b { font-weight: 600; color: var(--ink); }
.legend__key { font-weight: 600; font-variant-numeric: tabular-nums; }
.legend__key--full { color: var(--accent); }
.legend__key--diluted { color: var(--oxide); }

.branch { display: flex; flex: none; }

.rail, .elbow {
  width: var(--rail-w);
  flex: none;
  position: relative;
}

.rail--on::before,
.elbow::before {
  content: "";
  position: absolute;
  left: 0.62rem;
  top: 0;
  bottom: 0;
  border-left: 1px solid var(--rule);
}

.elbow--last::before { bottom: auto; height: 1.03rem; }

.elbow::after {
  content: "";
  position: absolute;
  left: 0.62rem;
  top: 1.03rem;
  width: 0.6rem;
  border-top: 1px solid var(--rule);
}

.node {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0 0.6rem;
  padding: 0.3rem 0 0.3rem 0.15rem;
  min-width: 0;
}

.disclose {
  font-family: var(--mono);
  font-size: 10px;
  line-height: 1;
  width: 1.15rem;
  height: 1.15rem;
  border: 1px solid var(--rule);
  background: var(--folio);
  color: var(--ink-2);
  border-radius: 2px;
  cursor: pointer;
  align-self: center;
}

.row.is-collapsed .disclose { background: var(--accent-2); color: var(--accent); }

/* Les feuilles réservent la place du bouton pour que les noms restent alignés. */
.disclose--empty { visibility: hidden; border-color: transparent; }

.name {
  font-family: var(--mono);
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ink);
  text-decoration: none;
}

.name:hover { text-decoration: underline; }

.tag {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-3);
}

.tag--edge { color: var(--accent); }
.tag--code { letter-spacing: 0.02em; text-transform: none; font-size: 11px; }

/* ---------- Sections de la fiche : actif / passif ---------- */

/*
  Détention = actif, structure = passif. Chaque côté a sa section ; ils ne se
  mélangent jamais dans une même liste.
*/
.section + .section { border-top: 1px solid var(--rule); }

.section__title {
  margin: 0;
  padding: 1rem 1.5rem 0.4rem;
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink);
}

.section__note {
  margin-left: 0.6rem;
  font-weight: 400;
  font-size: 10px;
  letter-spacing: 0.1em;
  color: var(--ink-3);
}

/* Colonne « Direct » : % de l'arête, en encre neutre à côté de l'effectif. */
.eff--direct { color: var(--ink-2); font-weight: 400; }
.register__head .eff--head-direct { padding-top: 0; color: var(--ink-3); font-weight: 400; font-size: 10px; }

.table { padding: 0.25rem 0 0.9rem; }

.table__row {
  display: grid;
  gap: 1rem;
  align-items: baseline;
  padding: 0.45rem 1.5rem;
  font-family: var(--mono);
  font-size: 13px;
  border-bottom: 1px solid var(--rule-soft);
}

.table__row:last-child { border-bottom: 0; }

.table__row--head {
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-3);
  border-bottom-color: var(--rule);
}

.table__row--compartment { grid-template-columns: minmax(0, 1fr) 3rem 8rem; }

.table__code { color: var(--ink-2); font-size: 12px; }
.table__num { text-align: right; font-variant-numeric: tabular-nums; }

/* Poids d'une share class : filet proportionnel sous le chiffre. */
.weight { position: relative; font-weight: 600; color: var(--accent); padding-bottom: 0.3rem; }
.weight__bar {
  position: absolute;
  right: 0;
  bottom: 0;
  height: 2px;
  width: var(--w);
  max-width: 100%;
  background: var(--accent);
  opacity: 0.55;
}
.weight--missing { color: var(--oxide); font-weight: 400; }

/* Tableau de données (share classes) : un vrai <table>, lisible même sans CSS. */
.grid {
  width: calc(100% - 3rem);
  margin: 0.25rem 1.5rem 0.9rem;
  border-collapse: collapse;
  font-family: var(--mono);
  font-size: 13px;
}

.grid th, .grid td {
  padding: 0.45rem 0.5rem;
  text-align: left;
  vertical-align: baseline;
  border-bottom: 1px solid var(--rule-soft);
  font-weight: 400;
}

.grid th:first-child, .grid td:first-child { padding-left: 0; }
.grid th:last-child, .grid td:last-child { padding-right: 0; }

.grid thead th {
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-3);
  border-bottom-color: var(--rule);
  white-space: nowrap;
}

.grid tbody tr:last-child > * { border-bottom: 0; }
.grid tbody tr:hover { background: var(--color-row-hover); }
/* Ligne cliquable (onglet « Share classes ») : toute la ligne suit son lien. */
.grid tbody tr.row--link { cursor: pointer; }
.grid tbody tr.row--link:focus-within { background: var(--color-row-hover); }

.grid .num {
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.grid .code { color: var(--ink-2); font-size: 12px; white-space: nowrap; }

.grid tfoot th, .grid tfoot td {
  border-top: 1px solid var(--rule);
  border-bottom: 0;
  font-weight: 600;
}

.table-note {
  margin: 0;
  padding: 0.2rem 1.5rem 0;
  font-family: var(--mono);
  font-size: 11px;
  color: var(--oxide);
}

/* ---------- États ---------- */

.notice {
  padding: 1.5rem;
  font-family: var(--mono);
  font-size: 13px;
  color: var(--ink-2);
}

.notice--alert { color: var(--oxide); }

.notice a { color: var(--accent); }

/* ---------- Connexion ---------- */

.login {
  max-width: 22rem;
  margin: 6rem auto;
  background: var(--folio);
  border: 1px solid var(--rule);
  border-radius: 2px;
  padding: 2rem;
}

.login h1 {
  font-family: var(--mono);
  font-size: 15px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  margin: 0 0 1.5rem;
}

.login .field { margin-bottom: 1rem; }
.login input { width: 100%; }

/* ---------- Documentation ---------- */

/*
  Pages de référence (modèle de données). Même registre que la fiche : codes et
  noms de champs en monospace, prose en sans-serif. Trois familles de couleur dans
  le diagramme : patine = graphe, oxyde = NAV, ardoise = configuration.
*/
.doc { display: grid; gap: 2.25rem; }
.doc__head { display: grid; gap: 0.7rem; }
.doc__eyebrow {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--ink-3);
}
.doc h1 { margin: 0; font-size: 1.6rem; line-height: 1.2; font-weight: 650; text-wrap: balance; }
.doc h2 {
  margin: 0 0 0.75rem; font-family: var(--mono); font-size: 12px; font-weight: 700;
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink);
}
.doc p { margin: 0; max-width: 110ch; }
.doc code, .doc .mono { font-family: var(--mono); font-size: 12.5px; }
.doc__lede { color: var(--ink-2); }
.doc__rule { border-left: 3px solid var(--oxide); background: var(--folio); padding: 0.75rem 1rem; max-width: 110ch; }
.doc__rule strong { color: var(--oxide); }
.doc__versions { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; font-size: 13px; color: var(--ink-3); }
.doc__versions [aria-current] { color: var(--ink); font-weight: 600; text-decoration: none; }

.doc__sheet { background: var(--folio); border: 1px solid var(--rule); }
.doc__scroll { overflow-x: auto; }
.doc__legend {
  display: flex; flex-wrap: wrap; gap: 0.5rem 1.4rem; padding: 0.75rem 1rem;
  border-top: 1px solid var(--rule); font-size: 12.5px; color: var(--ink-2);
}
.doc__legend span { display: inline-flex; align-items: center; gap: 0.5rem; }
.doc__sw { width: 14px; height: 10px; border: 1px solid; display: inline-block; }
.doc__sw--graph { background: var(--accent-2); border-color: var(--accent); }
.doc__sw--nav { background: var(--oxide-2); border-color: var(--oxide); }
.doc__sw--config { background: var(--slate-2); border-color: var(--slate); }
.doc__sw--abstract { border: 1px dashed var(--ink-3); }
.doc__b { font-family: var(--mono); font-weight: 700; color: var(--accent); }

.erd { display: block; width: 100%; min-width: 980px; height: auto; font-family: var(--mono); }
.erd-box__body { fill: var(--paper); stroke: var(--accent); }
.erd-box__head { fill: var(--accent-2); }
.erd-box--nav .erd-box__head { fill: var(--oxide-2); }
.erd-box--nav .erd-box__body { stroke: var(--oxide); }
.erd-box--config .erd-box__head { fill: var(--slate-2); }
.erd-box--config .erd-box__body { stroke: var(--slate); }
.erd-box--abstract .erd-box__head { fill: var(--rule-soft); }
.erd-box--abstract .erd-box__body { stroke: var(--ink-3); stroke-dasharray: 4 3; fill: var(--folio); }
/* Table d'un autre diagramme, rappelée pour ses liens : contour pointillé. */
.erd-box--ref .erd-box__body { stroke-dasharray: 4 3; fill: var(--folio); }
.erd-box__title { font-size: 13px; font-weight: 700; fill: var(--ink); }
.erd-box__badge { font-size: 11px; font-weight: 700; fill: var(--accent); }
.erd-box__sep { stroke: var(--rule-soft); }
.erd-f { font-size: 12px; fill: var(--ink); }
.erd-f--opt { fill: var(--ink-2); }
.erd-t { font-size: 11px; fill: var(--ink-3); }
.erd-key { font-size: 9.5px; font-weight: 700; fill: var(--ink-2); }
.erd-key--fk { fill: var(--oxide); }
.erd-link { fill: none; stroke: var(--ink-2); stroke-width: 1.3; }
.erd-link--soft { stroke-dasharray: 4 3; stroke: var(--ink-3); }
.erd-arrowhead { fill: var(--ink-2); }
.erd-link__label { font-size: 10.5px; fill: var(--ink-2); }
.erd-zone { font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; fill: var(--ink-3); }
.erd-note { font-family: var(--ui); font-size: 12px; fill: var(--ink-2); }
.erd-note--mono { font-family: var(--mono); font-size: 11.5px; }

.doc__cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 460px), 1fr)); gap: 1.75rem; }
.doc__table-wrap { overflow-x: auto; background: var(--folio); border: 1px solid var(--rule); }
.doc__table { border-collapse: collapse; width: 100%; font-size: 13.5px; }
.doc__table th, .doc__table td {
  text-align: left; padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rule-soft); vertical-align: top;
}
.doc__table th {
  font-family: var(--mono); font-size: 11px; font-weight: 600; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--ink-3); background: var(--paper);
}
.doc__table tr:last-child td { border-bottom: 0; }
.doc__table td.mono { white-space: nowrap; }
.doc__chip { font-family: var(--mono); font-size: 11px; padding: 1px 7px; border: 1px solid; display: inline-block; white-space: nowrap; }
.doc__chip--own { color: var(--accent); border-color: var(--accent); background: var(--accent-2); }
.doc__chip--str { color: var(--oxide); border-color: var(--oxide); background: var(--oxide-2); }
.doc__chip--rel { color: var(--slate); border-color: var(--slate); background: var(--slate-2); }
.doc__yes { color: var(--accent); font-weight: 600; }
.doc__no { color: var(--ink-3); }

.doc__enums { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 0.9rem; }
.doc__enum { background: var(--folio); border: 1px solid var(--rule); padding: 0.75rem 0.9rem; display: grid; gap: 0.5rem; align-content: start; }
.doc__enum h3 { margin: 0; font-family: var(--mono); font-size: 13px; }
.doc__enum ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 5px; }
.doc__enum li { font-family: var(--mono); font-size: 11.5px; padding: 1px 6px; background: var(--paper); border: 1px solid var(--rule-soft); }
.doc__enum small { font-family: var(--mono); font-size: 11px; color: var(--ink-3); }
.doc__foot { font-size: 12.5px; color: var(--ink-3); border-top: 1px solid var(--rule); padding-top: 0.9rem; }

/* ---------- Balances comptables ---------- */

.folio__eyebrow {
  margin: 0 0 0.35rem;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-3);
}

/* Statut qualité (médaillon) : la couleur double le libellé, jamais seule. */
.quality {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 1px 6px;
  border: 1px solid;
  border-radius: 2px;
  white-space: nowrap;
}
.quality--bronze {
  color: var(--color-bronze); background: var(--color-bronze-bg);
  border-color: var(--color-bronze-border); border-style: var(--quality-bronze-style);
}
.quality--silver {
  color: var(--color-silver); background: var(--color-silver-bg);
  border-color: var(--color-silver-border); border-style: var(--quality-silver-style);
}
.quality--gold {
  color: var(--color-gold); background: var(--color-gold-bg);
  border-color: var(--color-gold-border); border-style: var(--quality-gold-style);
  border-width: var(--quality-gold-width);
}

/* Lignes de balance : défilement horizontal plutôt que colonnes écrasées. */
.grid-scroll { overflow-x: auto; }
.grid-scroll .grid { min-width: 44rem; }
.grid--lines tbody th { font-weight: 400; }
.grid .account { font-weight: 600; }
.grid .sub { display: block; font-size: 11px; color: var(--ink-2); }
.grid .sub--inline b {
  font-weight: 400; font-size: 10px; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--ink-3);
}
.grid tr.is-shown { background: var(--accent-2); }

/* Ligne de balance entièrement cliquable : le lien « Détail » s'étend à la ligne. */
.grid--balances tbody tr { position: relative; cursor: pointer; }
.row-link {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}
.row-link::after { content: ""; position: absolute; inset: 0; }
.grid--balances tbody tr:hover .row-link { text-decoration-thickness: 2px; }

/* Vue par défaut : dernières balances ; l'historique se déplie en dessous. */
.badge-latest {
  margin-left: 0.4rem;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 1px 6px;
  border: 1px solid var(--accent);
  border-radius: 2px;
  color: var(--accent);
  background: var(--accent-2);
  white-space: nowrap;
}
.grid .balance-row--replaced > *, .grid .balance-row--replaced .code { color: var(--ink-3); }
.balance-row--replaced .quality { opacity: 0.55; }
.balances-history > tr:first-child > * { border-top: 1px dashed var(--rule); }
/* Au-dessus du lien étendu de la ligne, pour rester cliquable. */
.replaced-by {
  position: relative;
  z-index: 1;
  display: block;
  font-size: 11px;
  color: var(--ink-2);
}
.history-toggle { margin: 0; padding: 0 1.5rem 1rem; }

.visually-hidden {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip-path: inset(50%); white-space: nowrap;
}

/* ---------- Onglets de la fiche ---------- */

/*
  La barre temporelle reste au-dessus des onglets : elle vaut pour tous. Un onglet
  n'est jamais masqué ; son compteur dit s'il a des données à la date affichée.
*/
.tabs {
  display: flex;
  gap: 0;
  /* overflow-x seul imposerait overflow-y: auto — le soulignement de l'onglet actif
     (2 px, marge −1 px) dépassait d'un pixel et faisait naître une barre verticale.
     Le filet du bas est une ombre interne : rien ne déborde. */
  overflow-x: auto;
  overflow-y: hidden;
  padding: 0 1.5rem;
  box-shadow: inset 0 -1px 0 var(--rule);
  background: var(--folio);
}
.tabs__tab {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.6rem 0.9rem 0.5rem;
  border-bottom: 2px solid transparent;
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  white-space: nowrap;
  text-decoration: none;
  color: var(--ink-2);
}
.tabs__tab:hover { color: var(--ink); }
.tabs__tab[aria-selected="true"] { color: var(--accent); border-bottom-color: var(--accent); }
.tabs__count {
  font-weight: 400;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0;
  padding: 0 5px;
  border: 1px solid var(--rule);
  border-radius: 2px;
  color: var(--ink-2);
  background: var(--paper);
}
.tabs__tab[aria-selected="true"] .tabs__count { border-color: var(--accent); color: var(--accent); background: var(--accent-2); }
.tab-panel:focus-visible { outline-offset: -2px; }
.tab-panel.htmx-request { opacity: 0.55; transition: opacity 120ms; }

/* Filtres d'un onglet (période des NAV, choix de balance). */
.filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  align-items: center;
  padding: 0.25rem 1.5rem 0.75rem;
}

.grid .grid__subtotal > * { font-weight: 600; }

/* Positions investisseurs : une ligne d'en-tête et un total par classe de parts. */
.grid--investor-positions .position-class__head th {
  padding-top: 0.8rem;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-3);
}
.grid--investor-positions tbody tr.position-class__head:hover { background: transparent; }
.grid--investor-positions .related-party { color: var(--accent); }

.grid--transactions .transaction--cancelled > * { color: var(--ink-3); text-decoration: line-through; }

.pager { display: flex; gap: 1rem; align-items: center; padding: 0 1.5rem 1rem; }
.pager__label { font-size: 12px; color: var(--ink-3); }


/* ---------- Écran NAV (tableau pivoté, 2026-10-12) ---------- */

/* Fil d'Ariane de la structure (umbrella → compartiment) et métadonnées du fonds. */
.crumbs {
  display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 0.35rem;
  margin: 0;
  font-family: var(--mono); font-size: 12px; color: var(--ink-2);
}
.crumbs__sep { color: var(--ink-3); }
.folio__meta {
  display: flex; flex-wrap: wrap; gap: 0.3rem 1.25rem;
  font-family: var(--mono); font-size: 12px; color: var(--ink);
}
.folio__meta b {
  font-weight: 400; color: var(--ink-3); letter-spacing: 0.1em;
  text-transform: uppercase; font-size: 10px; margin-right: 0.35rem;
}

/* Champ de date JJ/MM/AAAA (texte masqué : un <input type="date"> suivrait la
   langue du navigateur). */
.date-input {
  width: 7.6rem;
  font-family: var(--mono);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  padding: 0.3rem 0.45rem;
  border: 1px solid var(--rule);
  border-radius: 2px;
  background: var(--color-input);
  color: var(--ink);
}
.date-input:invalid:not(:placeholder-shown) { border-color: var(--oxide); }

/* Onglet sans donnée à la date : grisé, toujours cliquable. */
.tabs__tab--empty { color: var(--ink-3); }
.tabs__tab--empty .tabs__count { color: var(--ink-3); background: transparent; }

.note {
  margin: 0;
  padding: 0.2rem 1.5rem 0;
  font-family: var(--mono);
  font-size: 11px;
  color: var(--ink-2);
}

.nav-export { display: inline-flex; align-items: center; gap: 0.4rem; }

/* Fraîcheur de la dernière NAV : date, âge, fréquence renseignée — aucune sévérité. */
.freshness {
  margin: 0.6rem 1.5rem 0.5rem;
  padding: 0.3rem 0.7rem;
  border: 1px solid var(--rule);
  border-left: 3px solid var(--accent);
  border-radius: 2px;
  font-family: var(--mono); font-size: 12px;
  background: var(--folio); color: var(--ink);
}

/* Tableau pivoté : défilement dans son conteneur, en-tête collant, date figée. */
.nav-scroll {
  overflow: auto;
  max-height: 72vh;
  margin: 0 1.5rem 0.6rem;
  border: 1px solid var(--rule-soft);
  background: var(--folio);
}
.grid--pivot { width: 100%; margin: 0; }
.grid--pivot th, .grid--pivot td { padding: 0.35rem 0.6rem; }
.grid--pivot th:first-child, .grid--pivot td:first-child { padding-left: 0.6rem; }
.grid--pivot th:last-child, .grid--pivot td:last-child { padding-right: 0.6rem; }
.grid--pivot thead th { position: sticky; background: var(--folio); z-index: 2; }
.grid--pivot .pivot__groups th { top: 0; height: 3rem; vertical-align: bottom; }
.grid--pivot .pivot__cols th { top: 3rem; }
.grid--pivot .pivot__date {
  position: sticky; left: 0; z-index: 1;
  background: var(--folio);
  border-right: 1px solid var(--rule);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.grid--pivot thead .pivot__date { z-index: 3; vertical-align: bottom; }
.grid--pivot .pivot__group {
  text-align: left; border-left: 1px solid var(--rule);
  font-size: 12px; letter-spacing: 0.04em; text-transform: none; color: var(--ink);
}
.grid--pivot .pivot__group--fund { background: var(--accent-2); }
.pivot__code { font-weight: 700; text-decoration: none; color: var(--ink); }
.pivot__code:hover { text-decoration: underline; }
.pivot__isin { display: block; font-size: 10px; color: var(--ink-3); letter-spacing: 0.04em; font-weight: 400; }
.pivot__ccy { color: var(--ink-2); letter-spacing: 0.04em; }
.grid--pivot .pivot__first { border-left: 1px solid var(--rule); }
.grid--pivot tbody tr:hover > .pivot__date { background: var(--color-row-hover); }
.grid--pivot .pivot__row--reference > * { background: var(--accent-2); }
.grid--pivot .pivot__row--reference > .pivot__date { color: var(--accent); font-weight: 700; background: var(--accent-2); }
.grid--pivot .pivot__row--ghost > * { color: var(--ink-3); background: repeating-linear-gradient(135deg, transparent 0 6px, var(--rule-soft) 6px 7px); }
.grid--pivot .pivot__row--ghost > .pivot__date { background: var(--paper); }
.pivot__ghost { font-style: italic; }
.grid--pivot.is-compact .col--detail { display: none; }
.grid--pivot .weight { position: relative; }
.grid--pivot button.quality { cursor: pointer; font: inherit; font-family: var(--mono); font-size: 10px; letter-spacing: 0.1em; }
.change--alert { color: var(--oxide); font-weight: 700; background: var(--oxide-2); }
.cell--alert { background: var(--oxide-2); }
.cell-alert { color: var(--oxide); }

/* Pastille de version : la NAV de cette date a été corrigée (v2, v3…). */
.version-pill {
  margin-left: 0.3rem;
  padding: 0 5px;
  font-family: var(--mono); font-size: 10px; font-weight: 700;
  border: 1px solid var(--slate); border-radius: 8px;
  color: var(--slate); background: var(--slate-2);
  cursor: pointer;
}

/* Panneau latéral (versions, qualité) : par-dessus la page, à droite. */
.side-panel {
  position: fixed; top: 0; right: 0; bottom: 0; z-index: 20;
  width: min(30rem, 100vw);
  overflow-y: auto;
  background: var(--folio);
  border-left: 1px solid var(--rule);
  box-shadow: -8px 0 24px var(--color-shadow);
}
.side-panel:focus { outline: none; }
.side-panel__inner { padding: 1.1rem 1.25rem 2rem; display: grid; gap: 0.6rem; }
.side-panel__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; }
.side-panel__kicker { margin: 0; font-family: var(--mono); font-size: 11px; color: var(--ink-2); }
.side-panel__title { margin: 0.15rem 0 0; font-family: var(--mono); font-size: 16px; }
.side-panel__sub {
  margin: 0.6rem 0 0; font-family: var(--mono); font-size: 10px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--ink-3);
}
.side-panel__status { margin: 0; font-family: var(--mono); font-size: 12px; }
.side-panel .note, .side-panel .notice { padding: 0; }
.kv { display: grid; grid-template-columns: max-content 1fr; gap: 0.2rem 0.9rem; margin: 0; font-size: 12px; }
.kv dt { color: var(--ink-3); font-family: var(--mono); font-size: 11px; }
.kv dd { margin: 0; font-family: var(--mono); overflow-wrap: anywhere; }
.kv .num { text-align: left; font-variant-numeric: tabular-nums; }
.versions { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.6rem; }
.versions__item { border: 1px solid var(--rule-soft); padding: 0.5rem 0.7rem; display: grid; gap: 0.35rem; }
.versions__item--shown { border-color: var(--accent); }
.versions__line { display: flex; gap: 0.5rem; align-items: center; font-family: var(--mono); font-size: 12px; }
.versions__current { font-family: var(--mono); font-size: 10px; color: var(--accent); text-transform: uppercase; letter-spacing: 0.1em; }
.events { margin: 0; padding-left: 1rem; display: grid; gap: 0.35rem; font-size: 12px; }
.check--fail { color: var(--oxide); font-weight: 700; }

/* ---------- Menu « Layout » (thèmes de couleur) ---------- */

/* <details> : s'ouvre sans JS ; acta-theme.js ajoute Échap, flèches, clic extérieur
   et l'application sans rechargement. */
.layout-menu { position: relative; }
.layout-menu > summary {
  list-style: none;
  cursor: pointer;
  color: var(--color-link);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}
.layout-menu > summary::-webkit-details-marker { display: none; }
.layout-menu__list {
  position: absolute; right: 0; top: calc(100% + 0.4rem); z-index: 30;
  min-width: 12rem; margin: 0; padding: 0.3rem 0;
  display: grid;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 2px;
  box-shadow: 0 6px 18px var(--color-shadow);
}
.layout-menu__item {
  display: flex; align-items: center; gap: 0.55rem;
  width: 100%; padding: 0.4rem 0.8rem;
  font: inherit; font-size: 13px; text-align: left;
  color: var(--color-text); background: transparent; border: 0; cursor: pointer;
}
.layout-menu__item:hover, .layout-menu__item:focus-visible { background: var(--color-row-hover); }
.layout-menu__item:focus-visible { outline-offset: -2px; }
.layout-menu__swatch {
  width: 0.8rem; height: 0.8rem; flex: none;
  border-radius: 50%; border: 1px solid var(--color-border);
  background: var(--swatch);
}
.layout-menu__label { flex: 1; }
.layout-menu__check { visibility: hidden; color: var(--color-primary); }
.layout-menu__item[aria-checked="true"] .layout-menu__check { visibility: visible; }

/* ---------- Responsive ---------- */

@media (max-width: 760px) {
  :root { --gutter-w: 4rem; --rail-w: 1.1rem; }
  .shell { padding: 1.25rem 0.9rem 4rem; }
  .row, .register__head, .toolbar, .folio__head { padding-left: 0.9rem; padding-right: 0.9rem; }
  .ledger__row { grid-template-columns: minmax(0, 1fr) 5rem; }
  .ledger__row .ledger__hide { display: none; }
  .tag--code { display: none; }
  .history-toggle { padding-left: 0.9rem; padding-right: 0.9rem; }
  .tabs, .filters, .pager { padding-left: 0.9rem; padding-right: 0.9rem; }
  .shell--full { padding-left: 16px; padding-right: 16px; }
  .nav-scroll, .freshness { margin-left: 0.9rem; margin-right: 0.9rem; }
  .toolbar__time, .toolbar__actions { margin-left: 0; padding-left: 0; border-left: 0; }
  .note { padding-left: 0.9rem; }
  .section__title, .table__row, .legend, .table-note { padding-left: 0.9rem; padding-right: 0.9rem; }
  .section__note { display: block; margin: 0.2rem 0 0; }
  .eff--direct, .eff--head-direct { display: none; }
  .grid { width: calc(100% - 1.8rem); margin-left: 0.9rem; margin-right: 0.9rem; }
  .masthead { padding: 0.9rem; }
  .masthead__spacer { flex-basis: 100%; height: 0; }
  .register__head .eff { letter-spacing: 0; padding-right: 0.5rem; }
  .grid thead th { white-space: normal; }
  .grid--classes tr > :nth-child(2),
  .grid--classes tr > :nth-child(3) { display: none; }
  .grid--balances tr > :nth-child(3),
  .grid--balances tr > :nth-child(4),
  .grid--balances tr > :nth-child(5),
  .grid--balances tr > :nth-child(6),
  .grid--balances tr > :nth-child(7) { display: none; }
  .grid--assets tr > :nth-child(2),
  .grid--assets tr > :nth-child(5),
  .grid--assets tr > :nth-child(9) { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; }
}

/* ---------- Impression : toujours en Black & White ---------- */

@media print {
  :root, :root[data-theme] {
  --color-bg: #FFFFFF; --color-surface: #FFFFFF; --color-toolbar: #F2F2F2;
  --color-input: #FFFFFF; --color-row-hover: #F0F0F0;
  --color-text: #000000; --color-text-muted: #333333; --color-text-subtle: #555555;
  --color-border: #8C8C8C; --color-border-soft: #CCCCCC;
  --color-primary: #000000; --color-primary-hover: #333333; --color-primary-soft: #E6E6E6;
  --color-on-primary: #FFFFFF; --color-link: #000000;
  --color-success: #000000; --color-warning: #000000;
  --color-danger: #000000; --color-danger-soft: #E6E6E6;
  --color-info: #000000; --color-info-soft: #F2F2F2;
  --color-shadow: rgba(0, 0, 0, 0.25);
  --color-bronze: #000000; --color-bronze-border: #000000; --color-bronze-bg: #FFFFFF;
  --color-silver: #000000; --color-silver-border: #000000; --color-silver-bg: #FFFFFF;
  --color-gold: #000000; --color-gold-border: #000000; --color-gold-bg: #FFFFFF;
  --quality-bronze-style: dotted; --quality-silver-style: solid;
  --quality-gold-style: double; --quality-gold-width: 3px;
  }
  body { background: var(--color-bg); }
  .masthead__links, .side-panel { display: none !important; }
  .quality { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}