/* === THEME TOKENS (mode clair par défaut) === */
  :root {
    --bg-page: #f0f4f8;
    --bg-header: #0a3d62;
    --bg-header-btn: #1e5c8b;
    --bg-header-btn-hover: #2a7bb8;
    --bg-panel: #ffffff;
    --border-panel: #cccccc;
    --shadow-panel: rgba(0,0,0,0.1);
    --text-default: #333333;
    --text-muted: #666666;
    --text-accent: #0a3d62;
    --link-stroke: #0a3d62;
    --link-stroke-opacity: 1;
    --link-stroke-width: 2.5;

    /* Modal */
    --bg-modal: #ffffff;
    --bg-modal-overlay: rgba(0,0,0,0.55);
    --border-modal-divider: #e0e0e0;
    --bg-modal-source: #f5f5f5;
    --border-modal-source: #999999;

    /* Nœuds par type — fonds légèrement transparents pour laisser voir les branches */
    --node-default-bg: rgba(227, 242, 253, 0.85);
    --node-default-border: #1976d2;
    --node-default-title: #0a3d62;
    --node-default-name: #333333;

    --node-verified-bg: rgba(232, 245, 233, 0.85);
    --node-verified-border: #2e7d32;
    --node-verified-title: #1b5e20;

    --node-partial-bg: rgba(255, 248, 225, 0.85);
    --node-partial-border: #f9a825;
    --node-partial-title: #6a4a00;

    --node-approximate-bg: rgba(252, 228, 236, 0.85);
    --node-approximate-border: #c2185b;
    --node-approximate-title: #88134a;

    --node-structural-bg: rgba(225, 245, 254, 0.85);
    --node-structural-border: #0277bd;
    --node-structural-title: #013b60;

    --node-minister-bg: rgba(10, 61, 98, 0.92);
    --node-minister-border: #062c4a;
    --node-minister-title: #ffffff;
    --node-minister-name: #b8d4e8;

    --node-vp-bg: rgba(197, 225, 165, 0.85);
    --node-vp-border: #558b2f;
    --node-vp-title: #2e4d0e;

    --node-pdg-bg: rgba(179, 229, 252, 0.85);
    --node-pdg-border: #0277bd;

    --node-direction-bg: rgba(240, 244, 195, 0.85);
    --node-direction-border: #9e9d24;
    --node-direction-title: #4a4800;

    --node-installation-bg: rgba(243, 229, 245, 0.85);
    --node-installation-border: #7b1fa2;
    --node-installation-title: #4a148c;

    /* Recherche */
    --search-match-shadow: rgba(255, 193, 7, 0.95);
    --search-match-border: #ffb300;
    --search-dim-opacity: 0.18;
  }

  /* === DARK MODE === */
  body.dark {
    --bg-page: #0d1418;
    --bg-header: #0a1f2e;
    --bg-header-btn: #14507a;
    --bg-header-btn-hover: #1d6ea3;
    --bg-panel: #1a2329;
    --border-panel: #2c3a44;
    --shadow-panel: rgba(0,0,0,0.5);
    --text-default: #d8e0e6;
    --text-muted: #8a98a4;
    --text-accent: #6cb6ee;
    --link-stroke: #5d8aae;
    --link-stroke-opacity: 0.55;
    --link-stroke-width: 2;

    --bg-modal: #1e2830;
    --bg-modal-overlay: rgba(0,0,0,0.75);
    --border-modal-divider: #354450;
    --bg-modal-source: #28333b;
    --border-modal-source: #4d5d6a;

    /* Nœuds : fonds plus sombres légèrement transparents */
    --node-default-bg: rgba(26, 58, 92, 0.85);
    --node-default-border: #4a90d9;
    --node-default-title: #c9e2f9;
    --node-default-name: #b9c8d4;

    --node-verified-bg: rgba(31, 56, 35, 0.85);
    --node-verified-border: #4caf50;
    --node-verified-title: #b6e5b8;

    --node-partial-bg: rgba(74, 58, 20, 0.85);
    --node-partial-border: #ffb300;
    --node-partial-title: #ffe082;

    --node-approximate-bg: rgba(69, 23, 46, 0.85);
    --node-approximate-border: #e91e63;
    --node-approximate-title: #f8bbd0;

    --node-structural-bg: rgba(13, 44, 64, 0.85);
    --node-structural-border: #29b6f6;
    --node-structural-title: #b3e5fc;

    --node-minister-bg: rgba(6, 32, 50, 0.92);
    --node-minister-border: #1976d2;
    --node-minister-title: #ffffff;
    --node-minister-name: #b8d4e8;

    --node-vp-bg: rgba(42, 67, 24, 0.85);
    --node-vp-border: #8bc34a;
    --node-vp-title: #d4e8b8;

    --node-pdg-bg: rgba(17, 64, 96, 0.85);
    --node-pdg-border: #29b6f6;

    --node-direction-bg: rgba(58, 64, 21, 0.85);
    --node-direction-border: #cddc39;
    --node-direction-title: #e6ee9c;

    --node-installation-bg: rgba(58, 26, 68, 0.85);
    --node-installation-border: #ab47bc;
    --node-installation-title: #ce93d8;

    --search-match-shadow: rgba(255, 213, 79, 0.95);
    --search-match-border: #ffd54f;
    --search-dim-opacity: 0.12;
  }

  * { box-sizing: border-box; margin: 0; padding: 0; }

  body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    background: transparent;
    color: var(--text-default);
    overflow: hidden;
    height: 100vh;
    width: 100vw;
    transition: background 0.2s, color 0.2s;
  }

  /* Bandeau d'entête fixe */
  body.dark #search-input {
    background: #2a3942;
    color: #e6edf3;
    border-color: #3d4a55;
  }
  #search-input:focus { width: 240px; background: #fff; }
  body.dark #search-input:focus { background: #36454f; }

  body.dark .costs-total .costs-box-title {
    background: #1565c0;   /* bleu foncé explicite en dark mode */
    color: #e8f4ff;
  }

  body.dark .result-card mark {
    background: rgba(255, 213, 79, 0.45);
    color: #fff8e1;
  }

  body.dark #reopen-disclaimer {
    border-color: #d81b60;
  }
  #reopen-disclaimer:hover {
    background: rgba(194, 24, 91, 0.08);
  }
  body.dark #reopen-disclaimer:hover {
    background: rgba(216, 27, 96, 0.18);
  }

  body.dark ::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.04);
  }
  body.dark ::-webkit-scrollbar-thumb {
    background: rgba(180, 195, 210, 0.4);
    background-clip: padding-box;
  }
  body.dark ::-webkit-scrollbar-thumb:hover {
    background: rgba(200, 215, 230, 0.65);
    background-clip: padding-box;
  }
  body.dark ::-webkit-scrollbar-button {
    background-color: rgba(255, 255, 255, 0.04);
  }
  body.dark ::-webkit-scrollbar-button:hover {
    background-color: rgba(255, 255, 255, 0.10);
  }
  body.dark ::-webkit-scrollbar-button:vertical:decrement {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'><polygon points='4,1.5 7,6 1,6' fill='%23c0cdd9'/></svg>");
  }
  body.dark ::-webkit-scrollbar-button:vertical:increment {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'><polygon points='1,2 7,2 4,6.5' fill='%23c0cdd9'/></svg>");
  }
  body.dark ::-webkit-scrollbar-button:horizontal:decrement {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'><polygon points='1.5,4 6,1 6,7' fill='%23c0cdd9'/></svg>");
  }
  body.dark ::-webkit-scrollbar-button:horizontal:increment {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'><polygon points='2,1 2,7 6.5,4' fill='%23c0cdd9'/></svg>");
  }
  /* Firefox — scrollbar-width: thin donne une scrollbar plus étroite.
     Les triangles sont gérés par le JS overlay ci-dessous (class .ff-scroll-host). */
  * {
    scrollbar-width: thin;
    scrollbar-color: rgba(80, 95, 110, 0.6) rgba(0, 0, 0, 0.06);
  }
  body.dark * {
    scrollbar-color: rgba(160, 180, 200, 0.5) rgba(255, 255, 255, 0.05);
  }

  /* ── Firefox custom scrollbar overlay ───────────────────────────────
     Le .ff-scrollbar est inséré comme enfant du wrapper scrollable.
     On utilise position:sticky sur les boutons + le thumb suit via JS.
     Le host conserve son position:fixed/relative d'origine. */
  .ff-scroll-host {
    scrollbar-width: none !important;   /* cache la scrollbar native FF */
    /* NE PAS forcer position ici — le host garde son position:fixed */
  }
  .ff-scrollbar {
    position: sticky;        /* reste dans le flux et suit le scroll */
    top: 0;
    right: 0;
    float: right;            /* se colle à droite du contenu */
    width: 11px;
    /* hauteur = 100% de la zone visible du host */
    height: 100vh;           /* remplacé dynamiquement par JS */
    margin-left: -11px;      /* ne prend pas de place supplémentaire */
    display: flex;
    flex-direction: column;
    z-index: 9999;
    pointer-events: none;
    user-select: none;
    background: transparent;
  }
  .ff-scrollbar.ff-sb-active { pointer-events: auto; }
  .ff-sb-btn {
    flex-shrink: 0;
    height: 14px;
    width: 11px;
    background: rgba(0,0,0,0.06);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.12s;
  }
  .ff-sb-btn:hover { background: rgba(0,0,0,0.15); }
  .ff-sb-btn svg { display: block; }
  .ff-sb-track {
    flex: 1;
    background: rgba(0,0,0,0.04);
    position: relative;
    cursor: pointer;
    overflow: hidden;
  }
  .ff-sb-thumb {
    position: absolute;
    left: 1px; right: 1px;
    min-height: 28px;
    background: rgba(60, 75, 90, 0.55);
    border-radius: 4px;
    cursor: grab;
    transition: background 0.12s;
  }
  .ff-sb-thumb:hover, .ff-sb-thumb.dragging { background: rgba(40, 55, 70, 0.78); }
  body.dark .ff-sb-btn { background: rgba(255,255,255,0.05); }
  body.dark .ff-sb-btn:hover { background: rgba(255,255,255,0.13); }
  body.dark .ff-sb-track { background: rgba(255,255,255,0.04); }
  body.dark .ff-sb-thumb { background: rgba(160, 185, 210, 0.45); }
  body.dark .ff-sb-thumb:hover,
  body.dark .ff-sb-thumb.dragging { background: rgba(180, 205, 230, 0.68); }

  /* Canvas panneau */
  body.dark #viewport::after {
    /* Mode nuit : voile sombre à 50% — image bien visible */
    background: rgba(13, 20, 24, 0.50);
  }
  /* S'assurer que les nœuds passent par-dessus l'image et le voile */
  #viewport > * { position: relative; z-index: 1; }

  #viewport.grabbing { cursor: grabbing; }

  body.dark .node.person-bg::after {
    /* Inverser la teinte en mode sombre pour que la silhouette soit
       claire sur fond foncé. */
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><circle cx='50' cy='35' r='18' fill='%23e8f4ff'/><path d='M 18 95 Q 18 60 50 60 Q 82 60 82 95 Z' fill='%23e8f4ff'/></svg>");
    opacity: 0.13;
  }
  /* Pour les nœuds Ministre (fond foncé bleu marine), inverser la couleur
     de la silhouette pour qu'elle reste perceptible mais discrète. */
  body.dark .node .info-btn {
    background: rgba(0,0,0,0.4);
    color: #e0e0e0;
    border-color: #6a7884;
  }

  body.dark .node .copy-btn {
    background: rgba(0,0,0,0.4);
    color: #e0e0e0;
    border-color: #6a7884;
  }
  body.dark .anomaly-block {
    background: #3a1414;
    color: #ffcdd2;
    border-left-color: #ef5350;
  }
  body.dark .anomaly-block .anomaly-title {
    color: #ff8a80;
  }

  /* Section sous-entités dans la modale */
  body.dark .incident-item.search-match {
    background: rgba(255, 213, 79, 0.10);
  }

  body.dark #intro-dismiss:hover {
    background: rgba(255,255,255,0.10);
  }

  body.dark #incidents-dismiss:hover {
    background: rgba(255,255,255,0.10);
  }

  /* Zone scrollable à l'intérieur du modal */
  body.dark #intro-content .warning-box {
    background: #3a2a0a;
    color: #ffd180;
  }

  /* Accordéon sources dans intro */
  .intro-accordion { margin-top: 16px; }
  .intro-accordion-body {
    display: none;
    padding: 0 0 8px 0;
  }
  .intro-accordion-body.open { display: block; }

  /* Petit séparateur (même style que celui au-dessus de "Sources") */
  body.dark .intro-book-block {
    background: rgba(108, 182, 238, 0.10);
  }
  .modal-accordion-body {
    display: none;
    padding: 0 0 10px 0;
    font-size: 13px;
    line-height: 1.55;
  }
  .modal-accordion-body.open { display: block; }
  .modal-accordion-body p { margin: 0 0 8px 0; }
  .modal-accordion-body p:last-child { margin-bottom: 0; }

  body.dark #disclaimer-readonly-close:hover {
    background: rgba(255,255,255,0.10);
  }