/* ==== 00-tokens.css ==== */
/* ═══ SCI-AUTONOME — thème « Laboratoire moderne » : jetons partagés ═══ */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400&family=IBM+Plex+Mono:wght@400;500;600&family=Source+Serif+4:opsz,wght@8..60,500;8..60,600;8..60,700&display=swap');
html:root {
  --lab-bg: #070b14;            /* fond général */
  --lab-bg-2: #0b1120;
  --lab-surface: rgba(17, 24, 39, .78);   /* panneaux (verre dépoli) */
  --lab-surface-solid: #111827;
  --lab-surface-2: rgba(30, 41, 59, .62); /* cartes internes */
  --lab-surface-3: #1e293b;
  --lab-line: rgba(148, 163, 184, .14);
  --lab-line-2: rgba(148, 163, 184, .26);
  --lab-text: #f1f5f9;          /* texte principal */
  --lab-text-2: #cbd5e1;        /* texte secondaire */
  --lab-muted: #94a3b8;         /* libellés */
  --lab-primary: #4f8cff;       /* bleu labo */
  --lab-primary-2: #7aa7ff;
  --lab-teal: #2dd4bf;          /* données / validé */
  --lab-cyan: #22d3ee;
  --lab-violet: #a78bfa;
  --lab-green: #34d399;
  --lab-amber: #fbbf24;
  --lab-red: #f87171;
  --lab-radius: 14px;
  --lab-radius-sm: 10px;
  --lab-radius-xs: 7px;
  --lab-shadow: 0 1px 0 rgba(255,255,255,.04) inset, 0 18px 40px -22px rgba(0,0,0,.85);
  --lab-shadow-hi: 0 1px 0 rgba(255,255,255,.06) inset, 0 24px 60px -24px rgba(0,0,0,.9), 0 0 0 1px rgba(79,140,255,.18);
  --lab-blur: blur(14px) saturate(140%);
  --lab-font: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --lab-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --lab-ease: cubic-bezier(.2, .8, .2, 1);
  --lab-serif: 'Source Serif 4', 'Iowan Old Style', Charter, Georgia, serif;
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 32px;
}

/* ==== 10-layout.css ==== */
/* ═══════════════════════════════════════════════════════════════════════════
   SCI-AUTONOME — thème « Laboratoire moderne »
   10-layout.css : coque globale (fond, en-tête, barre des domaines,
   grille 3 colonnes, barre latérale gauche, typographie générique).
   Ne stylise PAS l'intérieur de main.center-panel ni de aside.sidebar-right
   (seulement les conteneurs eux-mêmes).
   Dépend de 00-tokens.css (jetons --lab-*). Variables locales : --lay-*.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── 0. Variables locales de mise en page ─────────────────────────────────── */
html:root {
  --lay-gutter: 16px;                 /* marge extérieure de la coque */
  --lay-gap: 16px;                    /* espace entre colonnes */
  --lay-col-left: minmax(260px, 288px);
  --lay-col-right: minmax(300px, 340px);
  --lay-sticky-top: 12px;
  --lay-acc: var(--lab-primary);      /* accent courant (surchargé par domaine) */
  --lay-tint-primary: color-mix(in srgb, var(--lab-primary) 14%, transparent);
  --lay-tint-primary-2: color-mix(in srgb, var(--lab-primary) 24%, transparent);
  --lay-border-primary: color-mix(in srgb, var(--lab-primary) 45%, transparent);
  --lay-panel-bg: linear-gradient(180deg, color-mix(in srgb, var(--lab-surface-3) 55%, transparent) 0%, var(--lab-surface) 140px);
}
@media (min-width: 1600px) {
  html:root {
    --lay-gutter: 24px;
    --lay-gap: 20px;
    --lay-col-left: minmax(280px, 304px);
    --lay-col-right: minmax(330px, 380px);
  }
}
html body.sci-banner-shown { --lay-sticky-top: 54px; }   /* bandeau licence fixe */

/* ── 1. Base : fond, typo, sélection, focus ──────────────────────────────── */
html {
  background: var(--lab-bg) !important;
  scrollbar-color: var(--lab-line-2) transparent;
  scrollbar-width: thin;
}
html body {
  background: transparent !important;
  color: var(--lab-text);
  font-family: var(--lab-font);
  font-size: 14.5px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "cv11", "ss01", "tnum" 0;
}

/* Typo générique des contrôles (spécificité basse : les autres couches
   peuvent surcharger avec une simple classe). */
html body button,
html body input,
html body select,
html body textarea {
  font-family: var(--lab-font);
}
html body input,
html body select,
html body textarea { color: var(--lab-text); }
html body input::placeholder,
html body textarea::placeholder { color: var(--lab-muted); opacity: 1; }

html body ::selection {
  background: color-mix(in srgb, var(--lab-primary) 38%, transparent);
  color: var(--lab-text);
}
html body *:focus-visible {
  outline: 2px solid var(--lab-primary-2) !important;
  outline-offset: 2px !important;
  border-radius: var(--lab-radius-xs);
}

/* ── 2. Barres de défilement ─────────────────────────────────────────────── */
html body ::-webkit-scrollbar { width: 10px; height: 10px; }
html body ::-webkit-scrollbar-track { background: transparent; }
html body ::-webkit-scrollbar-thumb {
  background: var(--lab-line-2);
  border-radius: 999px;
  border: 3px solid transparent;
  background-clip: padding-box;
}
html body ::-webkit-scrollbar-thumb:hover {
  background: color-mix(in srgb, var(--lab-primary) 60%, transparent);
  background-clip: padding-box;
}
html body ::-webkit-scrollbar-corner { background: transparent; }

/* ── 3. Scène spatiale en arrière-plan : conservée mais atténuée ──────────── */
html body #space-journey {
  opacity: .5 !important;
  filter: saturate(.7) brightness(.85);
  pointer-events: none !important;
}
html body #particles-canvas,
html body[data-domain] #particles-canvas {
  opacity: .28 !important;
  pointer-events: none !important;
}
html body #const-canvas {
  opacity: .32 !important;
  pointer-events: none !important;
}
html body #cia-bg {
  opacity: .012 !important;            /* motif de sceau quasi imperceptible */
  pointer-events: none !important;
}
html body #planet-labels {
  opacity: .55;
  pointer-events: none !important;
}
html body #planet-labels .planet-label {
  font-family: var(--lab-font) !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  letter-spacing: .14em !important;
  color: var(--lab-text-2) !important;
}
html body #planet-labels .planet-label .pl-sub {
  font-family: var(--lab-mono) !important;
  font-size: 11.5px !important;
  letter-spacing: .08em !important;
  color: var(--lab-muted) !important;
}

/* body::before → halos doux + grille fine de laboratoire (au-dessus des canvas) */
html body::before {
  content: '' !important;
  display: block !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: -2 !important;
  pointer-events: none !important;
  background-image:
    radial-gradient(1200px 700px at 12% -10%, color-mix(in srgb, var(--lab-primary) 16%, transparent), transparent 60%),
    radial-gradient(900px 600px at 100% 110%, color-mix(in srgb, var(--lab-violet) 10%, transparent), transparent 60%),
    linear-gradient(var(--lab-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--lab-line) 1px, transparent 1px) !important;
  background-size: 100% 100%, 100% 100%, 56px 56px, 56px 56px !important;
  background-position: 0 0, 0 0, 0 0, 0 0;
  -webkit-mask-image: linear-gradient(180deg, #000 0%, rgba(0,0,0,.35) 70%, rgba(0,0,0,.15) 100%);
          mask-image: linear-gradient(180deg, #000 0%, rgba(0,0,0,.35) 70%, rgba(0,0,0,.15) 100%);
  opacity: .55;
  animation: lay-grid-drift 60s linear infinite !important;
}
@keyframes lay-grid-drift {
  from { background-position: 0 0, 0 0, 0 0, 0 0; }
  to   { background-position: 0 0, 0 0, 56px 56px, 56px 56px; }
}

/* body::after → voile d'assombrissement + vignette (remplace les scanlines CRT) */
html body::after {
  content: '' !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: -1 !important;
  pointer-events: none !important;
  background:
    radial-gradient(ellipse 120% 90% at 50% 40%, transparent 40%, color-mix(in srgb, var(--lab-bg) 70%, transparent) 100%),
    linear-gradient(180deg, color-mix(in srgb, var(--lab-bg) 52%, transparent), color-mix(in srgb, var(--lab-bg) 72%, transparent)) !important;
  animation: none !important;
}

/* ── 4. En-tête : barre d'application ─────────────────────────────────────── */
html body > header {
  position: relative;
  z-index: 10;
  margin: var(--lay-gutter) var(--lay-gutter) 0;
  padding: 12px 16px !important;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 12px 16px;
  background: var(--lay-panel-bg), var(--lab-surface) !important;
  -webkit-backdrop-filter: var(--lab-blur);
          backdrop-filter: var(--lab-blur);
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius);
  box-shadow: var(--lab-shadow) !important;
  font-family: var(--lab-font);
}
/* liseré supérieur lumineux discret (remplace le shimmer tricolore) */
html body > header::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: 24px !important; right: 24px !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--lab-primary-2) 55%, transparent), transparent) !important;
  opacity: 1 !important;
  filter: none !important;
  animation: none !important;
  pointer-events: none;
}
/* reflet lent qui parcourt la bordure basse */
html body > header::after {
  content: '' !important;
  position: absolute !important;
  bottom: -1px !important; left: 0 !important; right: auto !important;
  width: 22% !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, var(--lab-cyan), transparent) !important;
  opacity: .55;
  pointer-events: none;
  animation: lay-header-glint 9s var(--lab-ease) infinite;
}
@keyframes lay-header-glint {
  0%   { transform: translateX(-30%);  opacity: 0; }
  15%  { opacity: .55; }
  85%  { opacity: .55; }
  100% { transform: translateX(480%); opacity: 0; }
}

/* Logo */
html body header .logo-block {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
  min-width: 0;
}
html body header .logo-icon {
  width: 44px !important;
  height: 44px !important;
  clip-path: none !important;
  border-radius: 12px;
  border: 1px solid var(--lab-line-2) !important;
  background:
    radial-gradient(circle at 30% 20%, color-mix(in srgb, var(--lab-primary) 30%, transparent), transparent 70%),
    var(--lab-surface-3) !important;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--lab-primary) 18%, transparent), 0 8px 22px -12px color-mix(in srgb, var(--lab-primary) 80%, transparent) !important;
  animation: none !important;
  font-family: var(--lab-font) !important;
  color: var(--lab-primary-2) !important;
  transition: transform .4s var(--lab-ease), box-shadow .3s var(--lab-ease);
}
html body header .logo-icon:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 0 0 1px var(--lay-border-primary), 0 10px 26px -10px var(--lab-primary) !important;
}
html body header .cia-logo-img,
html body header .cia-logo-img img {
  width: 30px;
  height: 30px;
  object-fit: contain;
  display: block;
  filter: saturate(.9) !important;   /* on retire la teinte cyan forcée */
  opacity: 1 !important;
}
html body header .logo-text { min-width: 0; }
html body header .logo-text h1 {
  font-family: var(--lab-font) !important;
  font-size: 19px !important;
  font-weight: 800 !important;
  letter-spacing: .01em !important;
  line-height: 1.15;
  color: var(--lab-text) !important;
  background: linear-gradient(90deg, var(--lab-text) 0%, var(--lab-text) 55%, var(--lab-primary-2) 100%);
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
  animation: none !important;
  clip-path: none !important;
  transform: none !important;
  margin: 0;
}
html body header .logo-text p {
  font-family: var(--lab-font) !important;
  font-size: 11.5px !important;
  font-weight: 500 !important;
  letter-spacing: .06em !important;
  color: var(--lab-muted) !important;      /* écrase le style="color:#fff" */
  margin-top: 3px !important;
  line-height: 1.3;
  max-width: 46ch;
}

/* Pastilles KPI */
html body header .header-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-left: auto;
  align-items: stretch;
}
html body header .hstat {
  --lay-kpi: var(--lab-primary);
  position: relative;
  min-width: 96px;
  padding: 7px 12px 7px 14px !important;
  text-align: left !important;
  clip-path: none !important;
  background: var(--lab-surface-2) !important;
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius-sm);
  box-shadow: 0 1px 0 rgba(255,255,255,.03) inset;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  transition: border-color .25s var(--lab-ease), transform .25s var(--lab-ease), background .25s var(--lab-ease);
}
html body header .hstat::before {               /* barre d'accent verticale */
  content: '';
  position: absolute;
  left: 0; top: 9px; bottom: 9px;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: var(--lay-kpi);
  opacity: .9;
}
html body header .hstat:hover {
  border-color: var(--lab-line-2) !important;
  background: color-mix(in srgb, var(--lab-surface-3) 80%, transparent) !important;
  transform: translateY(-1px);
}
html body header .hstat:nth-child(1) { --lay-kpi: var(--lab-primary); }
html body header .hstat:nth-child(2) { --lay-kpi: var(--lab-cyan); }
html body header .hstat:nth-child(3) { --lay-kpi: var(--lab-violet); }
html body header .hstat:nth-child(4) { --lay-kpi: var(--lab-green); }
html body header .hstat.hstat-session { --lay-kpi: var(--lab-amber); border-color: var(--lab-line) !important; }

html body header .hstat-val {
  font-family: var(--lab-mono) !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 1.1 !important;
  letter-spacing: -.01em !important;
  color: var(--lab-text) !important;
  font-variant-numeric: tabular-nums;
  text-shadow: none !important;
  white-space: nowrap;
}
html body header #stat-complete { color: var(--lab-green) !important; }
html body header #mission-time {
  font-size: 16px !important;
  letter-spacing: 0 !important;
  color: var(--lab-amber) !important;
}
html body header .hstat-lbl {
  display: block !important;               /* l'ancien CSS masquait les libellés < 900px */
  font-family: var(--lab-font) !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase;
  color: var(--lab-muted) !important;
  margin-top: 0 !important;
  white-space: nowrap;
}

/* État système */
html body header .sys-status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  border-radius: 999px;
  background: var(--lab-surface-2);
  border: 1px solid var(--lab-line);
  font-family: var(--lab-mono) !important;
  font-size: 12px !important;
  letter-spacing: 0 !important;
  color: var(--lab-text-2) !important;
  white-space: nowrap;
}
html body header .status-dot {
  position: relative;
  width: 8px !important;
  height: 8px !important;
  border-radius: 50%;
  background: var(--lab-green) !important;
  box-shadow: 0 0 0 0 color-mix(in srgb, var(--lab-green) 55%, transparent) !important;
  animation: lay-status-ping 2.4s var(--lab-ease) infinite !important;
  flex-shrink: 0;
}
@keyframes lay-status-ping {
  0%   { box-shadow: 0 0 0 0 color-mix(in srgb, var(--lab-green) 55%, transparent); }
  70%  { box-shadow: 0 0 0 7px transparent; }
  100% { box-shadow: 0 0 0 0 transparent; }
}

/* Boutons ronds (aide / notifications) — display laissé au JS (inline) */
html body header .help-btn,
html body header .notif-btn {
  width: 38px !important;
  height: 38px !important;
  border-radius: var(--lab-radius-sm) !important;
  border: 1px solid var(--lab-line-2) !important;
  background: var(--lab-surface-2) !important;
  box-shadow: none !important;
  animation: none !important;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  cursor: pointer;
  transition: background .2s var(--lab-ease), border-color .2s var(--lab-ease), transform .2s var(--lab-ease);
}
html body header .help-btn:hover,
html body header .notif-btn:hover {
  background: var(--lay-tint-primary) !important;
  border-color: var(--lay-border-primary) !important;
  transform: translateY(-1px);
}
html body header .help-icon {
  font-family: var(--lab-font) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--lab-text) !important;
  text-shadow: none !important;
}
html body header .notif-btn.new-discovery {
  border-color: color-mix(in srgb, var(--lab-amber) 70%, transparent) !important;
  animation: lay-notif-ring 1.6s var(--lab-ease) infinite !important;
}
@keyframes lay-notif-ring {
  0%   { box-shadow: 0 0 0 0 color-mix(in srgb, var(--lab-amber) 50%, transparent); }
  70%  { box-shadow: 0 0 0 8px transparent; }
  100% { box-shadow: 0 0 0 0 transparent; }
}
html body header .notif-icon { font-size: 16px !important; line-height: 1; }
html body header .notif-badge {
  top: -6px !important; right: -6px !important;
  min-width: 18px; width: auto !important; height: 18px !important;
  padding: 0 5px;
  border-radius: 999px !important;
  background: var(--lab-red) !important;
  color: var(--lab-text) !important;
  font-family: var(--lab-mono) !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  box-shadow: 0 0 0 2px var(--lab-surface-solid) !important;
  animation: none !important;
}

/* ── 5. Barre des domaines : contrôle segmenté ───────────────────────────── */
html body .domain-bar {
  position: relative;
  z-index: 9;
  margin: 10px var(--lay-gutter) 0;
  padding: 5px;
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  background: var(--lab-surface) !important;
  -webkit-backdrop-filter: var(--lab-blur);
          backdrop-filter: var(--lab-blur);
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius);
  box-shadow: var(--lab-shadow);
}
html body .domain-bar .domain-tab {
  --lay-acc: var(--lab-primary);
  position: relative;
  flex: 1 1 180px;
  min-width: 0;
  min-height: 42px;
  padding: 9px 14px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid transparent !important;
  border-radius: var(--lab-radius-sm);
  background: transparent !important;
  box-shadow: none !important;
  color: var(--lab-text-2) !important;
  font-family: var(--lab-font) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  letter-spacing: .01em !important;
  text-transform: none !important;
  text-shadow: none !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  animation: none !important;
  cursor: pointer;
  transition: background .25s var(--lab-ease), color .2s var(--lab-ease), border-color .25s var(--lab-ease), box-shadow .25s var(--lab-ease);
}
html body .domain-bar #dtab-medical { --lay-acc: var(--lab-cyan); }
html body .domain-bar #dtab-cyber   { --lay-acc: var(--lab-red); }
html body .domain-bar #dtab-tech    { --lay-acc: var(--lab-amber); }
html body .domain-bar #dtab-physics { --lay-acc: var(--lab-green); }

/* soulignement d'accent animé (largeur 0 → 40%) */
html body .domain-bar .domain-tab::after {
  content: '';
  position: absolute;
  left: 50%; bottom: 4px;
  width: 0; height: 2px;
  border-radius: 2px;
  background: var(--lay-acc);
  transform: translateX(-50%);
  transition: width .35s var(--lab-ease);
  pointer-events: none;
}
html body .domain-bar .domain-tab:hover {
  color: var(--lab-text) !important;
  background: var(--lab-surface-2) !important;
}
html body .domain-bar .domain-tab:hover::after { width: 18%; }

html body .domain-bar .domain-tab[class*="active-"] {
  color: var(--lab-text) !important;
  background: color-mix(in srgb, var(--lay-acc) 13%, var(--lab-surface-solid)) !important;
  border-color: color-mix(in srgb, var(--lay-acc) 40%, transparent) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.05) inset, 0 8px 22px -14px var(--lay-acc) !important;
}
html body .domain-bar .domain-tab[class*="active-"]::after { width: 40%; }

html body .domain-bar .domain-icon {
  font-size: 15px !important;
  line-height: 1;
  display: inline-grid;
  place-items: center;
  width: 26px; height: 26px;
  border-radius: 8px;
  background: var(--lab-surface-2);
  flex-shrink: 0;
  transition: background .25s var(--lab-ease);
}
html body .domain-bar .domain-tab[class*="active-"] .domain-icon {
  background: color-mix(in srgb, var(--lay-acc) 22%, transparent);
}

/* ── 6. Grille principale 3 colonnes ─────────────────────────────────────── */
html body .main-layout {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: var(--lay-col-left) minmax(0, 1fr) var(--lay-col-right);
  gap: var(--lay-gap);
  align-items: start;
  padding: var(--lay-gap) var(--lay-gutter) var(--lay-gutter);
  min-height: calc(100vh - 150px);
  max-width: 100%;
}
html body.focus-mode .main-layout { grid-template-columns: minmax(0, 1fr) !important; }

/* Panneaux de colonnes : verre dépoli */
html body .sidebar-left,
html body .sidebar-right,
html body .center-panel {
  background: var(--lay-panel-bg), var(--lab-surface) !important;
  -webkit-backdrop-filter: var(--lab-blur);
          backdrop-filter: var(--lab-blur);
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius);
  box-shadow: var(--lab-shadow) !important;
}

/* Colonnes latérales : collantes, défilement interne fin */
html body .sidebar-left,
html body .sidebar-right {
  position: sticky;
  top: var(--lay-sticky-top);
  align-self: start;
  max-height: calc(100vh - var(--lay-sticky-top) - 12px);
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--lab-line-2) transparent;
}
html body .sidebar-left {
  padding: 16px 14px !important;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
html body .sidebar-right {
  padding: 16px 14px !important;
  gap: 10px;
}
html body .sidebar-left::-webkit-scrollbar { display: block; width: 8px; }
html body .sidebar-left > * { flex-shrink: 0; }   /* évite l'écrasement des cartes dans la colonne collante */

/* les flux lumineux rouge/cyan de l'ancienne sidebar sont remplacés
   par des repères d'angle (voir section 14) */
html body .sidebar-left::before,
html body .sidebar-left::after {
  animation: none !important;
}

/* Colonne centrale : conteneur seulement (l'intérieur appartient à la couche B) */
html body .center-panel {
  min-width: 0;
  display: flex;
  flex-direction: column;
  overflow: visible;
  position: relative;
}

/* ── 7. Titres de section (globaux) ──────────────────────────────────────── */
html body .section-title {
  display: flex;
  align-items: center;
  gap: 8px;
  position: relative;
  padding: 2px 0 6px !important;
  margin-bottom: 2px;
  border-bottom: none !important;
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase;
  color: var(--lab-muted) !important;
  text-shadow: none !important;
}
html body .section-title::before {           /* petite pastille d'accent */
  content: '' !important;
  width: 3px;
  height: 12px;
  border-radius: 2px;
  background: var(--lab-primary);
  opacity: .9 !important;
  flex-shrink: 0;
  font-size: 0;
}
html body .section-title::after {            /* filet qui remplit la ligne */
  content: '' !important;
  position: static !important;
  flex: 1 1 auto;
  width: auto !important;
  height: 1px !important;
  background: linear-gradient(90deg, var(--lab-line-2), transparent) !important;
  opacity: 1 !important;
  animation: none !important;
}
html body .sidebar-left .section-title { margin-top: 8px !important; }
html body .sidebar-left > .section-title:first-child { margin-top: 0 !important; }
html body #sidebar-domain-label {
  letter-spacing: .04em;
  font-weight: 700;
  text-transform: none;
}

/* ── 8. Boutons de phase du pipeline (cartes) ────────────────────────────── */
html body .sidebar-left .phase-btn {
  position: relative;
  overflow: hidden;
  width: 100%;
  min-height: 58px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px 10px 14px !important;
  text-align: left;
  background: var(--lab-surface-2) !important;
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius-sm) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.03) inset !important;
  color: var(--lab-text);
  font-family: var(--lab-font) !important;
  font-size: 13px;
  transform: none;
  transition: background .25s var(--lab-ease), border-color .25s var(--lab-ease), transform .25s var(--lab-ease), box-shadow .25s var(--lab-ease);
}
/* barre d'état à gauche (remplace le balayage lumineux) */
html body .sidebar-left .phase-btn::before {
  content: '' !important;
  position: absolute !important;
  left: 0 !important; top: 12px !important; bottom: 12px !important;
  width: 3px !important; height: auto !important;
  border-radius: 0 3px 3px 0;
  background: var(--lab-line-2) !important;
  transition: background .3s var(--lab-ease), top .3s var(--lab-ease), bottom .3s var(--lab-ease) !important;
}
html body .sidebar-left .phase-btn:hover {
  background: color-mix(in srgb, var(--lab-surface-3) 85%, transparent) !important;
  border-color: var(--lay-border-primary) !important;
  transform: translateY(-1px) !important;
  box-shadow: var(--lab-shadow-hi) !important;
}
html body .sidebar-left .phase-btn:hover::before { background: var(--lab-primary) !important; top: 8px !important; bottom: 8px !important; left: 0 !important; }

/* P1–P5 sont des indicateurs désactivés par le JS : ne pas les griser */
html body:not(.demo-mode) .sidebar-left .phase-btn[id^="btn-p"]:disabled { opacity: 1; color: var(--lab-text); }

/* États */
html body .sidebar-left .phase-btn.success {
  border-color: color-mix(in srgb, var(--lab-green) 35%, transparent) !important;
  background: color-mix(in srgb, var(--lab-green) 7%, var(--lab-surface-2)) !important;
}
html body .sidebar-left .phase-btn.success::before { background: var(--lab-green) !important; }
html body .sidebar-left .phase-btn.error {
  border-color: color-mix(in srgb, var(--lab-red) 45%, transparent) !important;
  background: color-mix(in srgb, var(--lab-red) 7%, var(--lab-surface-2)) !important;
}
html body .sidebar-left .phase-btn.error::before { background: var(--lab-red) !important; }
html body .sidebar-left .phase-btn.loading {
  --ang: 0deg;
  border: 1px solid transparent !important;
  background:
    linear-gradient(var(--lab-surface-solid), var(--lab-surface-solid)) padding-box,
    conic-gradient(from var(--ang), var(--lab-line) 0deg, var(--lab-primary) 70deg, var(--lab-cyan) 120deg, var(--lab-line) 180deg, var(--lab-line) 360deg) border-box !important;
  animation: plasma 1.6s linear infinite !important;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--lab-primary) 20%, transparent), 0 10px 26px -16px var(--lab-primary) !important;
}
html body .sidebar-left .phase-btn.loading::before { background: var(--lab-primary) !important; }

/* Numéro de phase */
html body .sidebar-left .phase-num {
  width: 30px !important;
  height: 30px !important;
  flex-shrink: 0;
  display: grid !important;
  place-items: center;
  clip-path: none !important;
  border-radius: 9px;
  background: var(--lay-tint-primary) !important;
  border: 1px solid color-mix(in srgb, var(--lab-primary) 30%, transparent);
  color: var(--lab-primary-2) !important;
  font-family: var(--lab-mono) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-shadow: none !important;
  transform: none !important;
  animation: none !important;
  transition: background .25s var(--lab-ease), color .25s var(--lab-ease), border-color .25s var(--lab-ease);
}
html body .sidebar-left .phase-btn:hover .phase-num {
  background: var(--lay-tint-primary-2) !important;
  color: var(--lab-text) !important;
  transform: none !important;
}
html body .sidebar-left .phase-btn.success .phase-num {
  background: color-mix(in srgb, var(--lab-green) 16%, transparent) !important;
  border-color: color-mix(in srgb, var(--lab-green) 40%, transparent);
  color: var(--lab-green) !important;
}
html body .sidebar-left .phase-btn.error .phase-num {
  background: color-mix(in srgb, var(--lab-red) 16%, transparent) !important;
  border-color: color-mix(in srgb, var(--lab-red) 40%, transparent);
  color: var(--lab-red) !important;
}
html body .sidebar-left .phase-btn.loading .phase-num {
  background: var(--lay-tint-primary-2) !important;
  color: var(--lab-text) !important;
  animation: lay-num-pulse 1.4s var(--lab-ease) infinite !important;
}
@keyframes lay-num-pulse {
  0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--lab-primary) 50%, transparent); }
  60%      { box-shadow: 0 0 0 6px transparent; }
}
/* INIT BASE (phase 0) : teinte neutre */
html body .sidebar-left #btn-init .phase-num {
  background: var(--lab-surface-3) !important;
  border-color: var(--lab-line-2);
  color: var(--lab-text-2) !important;
}

/* Textes */
html body .sidebar-left .phase-info { flex: 1; min-width: 0; }
html body .sidebar-left .phase-name {
  font-family: var(--lab-font) !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  letter-spacing: .02em !important;
  line-height: 1.25;
  color: var(--lab-text) !important;
}
html body .sidebar-left .phase-desc {
  font-family: var(--lab-font) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 1.35;
  color: var(--lab-text-2) !important;
  margin-top: 2px !important;
}

/* Pastille de statut (background/box-shadow inline du JS respectés : pas de !important) */
html body .sidebar-left .phase-indicator {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  flex-shrink: 0;
  background: var(--lab-surface-3);
  border: 1px solid var(--lab-line-2) !important;
  box-shadow: none;
  transition: background .3s var(--lab-ease), box-shadow .3s var(--lab-ease);
}
html body .sidebar-left .phase-btn.success .phase-indicator {
  background: var(--lab-green);
  border-color: transparent !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--lab-green) 22%, transparent);
}
html body .sidebar-left .phase-btn.error .phase-indicator {
  background: var(--lab-red);
  border-color: transparent !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--lab-red) 22%, transparent);
}
html body .sidebar-left .phase-btn.loading .phase-indicator {
  background: var(--lab-primary);
  border-color: transparent !important;
  animation: lay-dot-ping 1.2s var(--lab-ease) infinite !important;
}
@keyframes lay-dot-ping {
  0%   { box-shadow: 0 0 0 0 color-mix(in srgb, var(--lab-primary) 60%, transparent); }
  80%  { box-shadow: 0 0 0 7px transparent; }
  100% { box-shadow: 0 0 0 0 transparent; }
}

/* ── 9. Bloc AUTO-CYCLE ──────────────────────────────────────────────────── */
html body .sidebar-left .auto-block {
  padding: 12px !important;
  background: var(--lab-surface-2) !important;
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius-sm) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.03) inset;
}
html body .sidebar-left .auto-label {
  font-family: var(--lab-font) !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  letter-spacing: .08em !important;
  color: var(--lab-muted) !important;
  margin-bottom: 8px;
}
html body .sidebar-left .auto-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
html body .sidebar-left .auto-controls > div { text-align: right; flex-shrink: 0; }
html body .sidebar-left .cycle-count {
  font-family: var(--lab-mono) !important;
  font-size: 22px !important;
  font-weight: 600 !important;
  line-height: 1.1;
  color: var(--lab-amber) !important;
  font-variant-numeric: tabular-nums;
  text-shadow: none !important;
}

/* Boutons auto — couleurs de bordure/texte laissées au JS (états inline) */
html body .sidebar-left .auto-btn {
  position: relative;
  overflow: hidden;
  min-height: 40px;
  padding: 9px 14px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  clip-path: none !important;
  border-radius: var(--lab-radius-sm) !important;
  background: var(--lay-tint-primary);
  border: 1px solid var(--lay-border-primary);
  color: var(--lab-primary-2);
  font-family: var(--lab-font) !important;
  font-size: 12.5px !important;
  font-weight: 650 !important;
  letter-spacing: .03em !important;
  cursor: pointer;
  filter: none !important;
  transition: background .25s var(--lab-ease), border-color .25s var(--lab-ease), transform .2s var(--lab-ease), box-shadow .25s var(--lab-ease) !important;
}
html body .sidebar-left .auto-controls .auto-btn { flex: 1 1 auto; }
html body .sidebar-left .auto-btn::before {        /* reflet au survol */
  content: '' !important;
  position: absolute;
  top: 0; left: -80%;
  width: 50%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.08), transparent) !important;
  transition: left .6s var(--lab-ease);
  pointer-events: none;
}
html body .sidebar-left .auto-btn:hover::before { left: 140%; }
html body .sidebar-left .auto-btn:hover {
  background: var(--lay-tint-primary-2);
  transform: translateY(-1px);
  box-shadow: 0 10px 24px -16px var(--lab-primary);
  filter: none !important;
}
html body .sidebar-left .auto-btn.active {
  background: color-mix(in srgb, var(--lab-amber) 12%, transparent);
  border-color: color-mix(in srgb, var(--lab-amber) 55%, transparent);
  color: var(--lab-amber);
  animation: lay-auto-breathe 2.2s var(--lab-ease) infinite !important;
}
@keyframes lay-auto-breathe {
  0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--lab-amber) 35%, transparent); }
  50%      { box-shadow: 0 0 0 4px color-mix(in srgb, var(--lab-amber) 10%, transparent); }
}
html body .sidebar-left #btn-auto-all {
  width: 100%;
  margin-top: 8px !important;
}
html body .sidebar-left #autocycle-status {
  font-family: var(--lab-mono) !important;
  font-size: 12px !important;
  color: var(--lab-text-2) !important;
  margin-top: 8px !important;
  min-height: 16px !important;
  letter-spacing: 0;
}

/* ── 10. Navigation (REFRESH / GRAPHE / RAPPORTS / RECHERCHE) ────────────── */
html body .sidebar-left .util-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}
html body .sidebar-left .util-btn {
  min-height: 40px;
  padding: 8px 10px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: var(--lab-surface-2) !important;
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius-sm) !important;
  color: var(--lab-text-2) !important;
  font-family: var(--lab-font) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  letter-spacing: .05em !important;
  box-shadow: none !important;
  cursor: pointer;
  transition: background .2s var(--lab-ease), border-color .2s var(--lab-ease), color .2s var(--lab-ease), transform .2s var(--lab-ease) !important;
}
html body .sidebar-left .util-btn:hover {
  background: var(--lay-tint-primary) !important;
  border-color: var(--lay-border-primary) !important;
  color: var(--lab-text) !important;
  transform: translateY(-1px);
}
html body .sidebar-left .util-btn:active { transform: translateY(0); }

/* ── 11. Pied « CLÉS IA » (div inline margin-top:auto) ───────────────────── */
html body .sidebar-left > div[style*="margin-top:auto"] {
  margin-top: auto !important;
  padding-top: 14px !important;
  border-top: 1px solid var(--lab-line) !important;
}
html body .sidebar-left > div[style*="margin-top:auto"] > div[style*="display:flex"] {
  gap: 9px !important;
  padding: 4px 0 !important;
}
html body .sidebar-left > div[style*="margin-top:auto"] > div[style*="display:flex"] > div {
  width: 7px !important;
  height: 7px !important;
  background: var(--lab-green) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--lab-green) 18%, transparent) !important;
  flex-shrink: 0;
}
html body .sidebar-left > div[style*="margin-top:auto"] span {
  font-family: var(--lab-mono) !important;
  font-size: 12px !important;
  color: var(--lab-text-2) !important;
  letter-spacing: 0 !important;
}

/* ── 12. Mode démo : verrou lisible ──────────────────────────────────────── */
html body.demo-mode .sidebar-left .phase-btn,
html body.demo-mode .sidebar-left .auto-btn { opacity: .6; }
html body.demo-mode .sidebar-left .phase-btn::after,
html body.demo-mode .sidebar-left .auto-btn::after { top: 6px; right: 8px; font-size: 11px; opacity: .85; }

/* ═══════════════════════════════════════════════════════════════════════════
   13. RESPONSIVE
   ═══════════════════════════════════════════════════════════════════════════ */

/* ≤ 1400px : colonnes latérales un peu plus étroites, en-tête plus compact */
@media (max-width: 1400px) {
  html:root {
    --lay-col-left: minmax(240px, 264px);
    --lay-col-right: minmax(280px, 310px);
  }
  html body header .hstat { min-width: 84px; padding: 6px 10px 6px 12px !important; }
  html body header .hstat-val { font-size: 16px !important; }
  html body header .logo-text p { max-width: 34ch; }
}

/* ≤ 1200px : 2 colonnes ; la colonne droite passe sous le contenu
   (l'ancien CSS la masquait — on la garde accessible) */
@media (max-width: 1200px) {
  html body .main-layout {
    grid-template-columns: minmax(230px, 250px) minmax(0, 1fr);
  }
  html body .sidebar-right {
    display: flex;                        /* pas de !important : le mode focus garde la main */
    flex-direction: column;
    grid-column: 1 / -1;
    position: relative;
    top: auto;
    max-height: none;
    overflow: visible;
  }
  html body header .header-stats { margin-left: 0; order: 3; width: 100%; }
  html body header .sys-status { margin-left: auto; }
}

/* ≤ 900px : en-tête sur deux lignes, KPI défilables horizontalement */
@media (max-width: 900px) {
  html:root { --lay-gutter: 12px; --lay-gap: 12px; }
  html body .main-layout { grid-template-columns: minmax(210px, 230px) minmax(0, 1fr); }
  html body header .header-stats {
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
    padding-bottom: 2px;
  }
  html body header .header-stats::-webkit-scrollbar { display: none; }
  html body header .hstat { flex: 0 0 auto; }
  html body .sidebar-left .phase-desc { font-size: 12px !important; }
}

/* ≤ 768px (mobile) : une seule colonne */
@media (max-width: 768px) {
  html body > header {
    flex-wrap: wrap !important;
    padding: 10px 12px !important;
    gap: 10px;
  }
  html body header .logo-block { flex: 1 1 auto; }
  html body header .logo-icon { width: 38px !important; height: 38px !important; border-radius: 10px; }
  html body header .logo-text h1 { font-size: 16px !important; }
  html body header .logo-text p { display: block !important; font-size: 11.5px !important; }
  html body header .header-stats { display: flex !important; }   /* l'ancien CSS les masquait */
  html body header .sys-status { order: 2; margin-left: 0; font-size: 12px !important; }
  html body header .help-btn,
  html body header .notif-btn { width: 38px !important; height: 38px !important; }

  html body .domain-bar {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
  }
  html body .domain-bar .domain-tab {
    min-height: 42px !important;
    font-size: 13px !important;
    padding: 8px 8px !important;
    letter-spacing: 0 !important;
    justify-content: flex-start;
  }

  html body .main-layout {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto;
    padding-top: 12px;
  }
  html body .sidebar-left,
  html body .sidebar-right {
    position: relative;
    top: auto;
    max-height: none !important;
    overflow: visible;
  }
  html body .sidebar-left {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    align-content: start;
    padding: 12px !important;
  }
  html body .sidebar-left > .section-title,
  html body .sidebar-left > .auto-block,
  html body .sidebar-left > .util-row,
  html body .sidebar-left > div[style*="margin-top:auto"] { grid-column: 1 / -1; }
  html body .sidebar-left .util-row { grid-template-columns: repeat(2, 1fr); }
  html body .sidebar-left .phase-btn { min-height: 54px; padding: 9px 10px 9px 12px !important; gap: 10px; }
  html body .sidebar-left .phase-num { width: 26px !important; height: 26px !important; font-size: 12px !important; }
  html body .sidebar-left .phase-name { font-size: 13px !important; }
  html body .sidebar-left .phase-desc { font-size: 12px !important; }
  html body .section-title { font-size: 12px !important; letter-spacing: .08em !important; }
}

/* ≤ 480px : boutons de phase sur une colonne */
@media (max-width: 480px) {
  html body .sidebar-left { grid-template-columns: 1fr; }
  html body .domain-bar .domain-tab { font-size: 12.5px !important; gap: 6px; }
  html body .domain-bar .domain-icon { width: 22px; height: 22px; font-size: 13px !important; }
  html body header .logo-text p { display: none !important; }  /* sous-titre décoratif seulement */
}

/* ═══════════════════════════════════════════════════════════════════════════
   14. SIGNATURE « INSTRUMENT SCIENTIFIQUE »
   Motifs discrets : papier millimétré, règles graduées, repères de coupe,
   rail de pipeline pointillé, index de section, lectures (readouts) mono.
   Tous les éléments ajoutés sont décoratifs (pointer-events: none).
   ═══════════════════════════════════════════════════════════════════════════ */

html:root {
  --lay-mark: color-mix(in srgb, var(--lab-primary-2) 55%, transparent);
  --lay-grid-minor: color-mix(in srgb, var(--lab-line) 45%, transparent);
  --lay-graph-paper:
    linear-gradient(var(--lay-grid-minor) 1px, transparent 1px),
    linear-gradient(90deg, var(--lay-grid-minor) 1px, transparent 1px);
}

/* 14.1 Fond : grille majeure + mineure (papier millimétré) */
html body::before {
  background-image:
    radial-gradient(1200px 700px at 12% -10%, color-mix(in srgb, var(--lab-primary) 16%, transparent), transparent 60%),
    radial-gradient(900px 600px at 100% 110%, color-mix(in srgb, var(--lab-violet) 10%, transparent), transparent 60%),
    linear-gradient(var(--lab-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--lab-line) 1px, transparent 1px),
    linear-gradient(var(--lay-grid-minor) 1px, transparent 1px),
    linear-gradient(90deg, var(--lay-grid-minor) 1px, transparent 1px) !important;
  background-size: 100% 100%, 100% 100%, 56px 56px, 56px 56px, 14px 14px, 14px 14px !important;
  animation: lay-grid-drift-2 80s linear infinite !important;
}
@keyframes lay-grid-drift-2 {
  from { background-position: 0 0, 0 0, 0 0, 0 0, 0 0, 0 0; }
  to   { background-position: 0 0, 0 0, 56px 56px, 56px 56px, 56px 56px, 56px 56px; }
}

/* 14.2 En-tête : règle graduée le long du bord inférieur */
html body > header {
  background:
    repeating-linear-gradient(90deg, var(--lab-line-2) 0 1px, transparent 1px 8px) left bottom / 100% 4px no-repeat,
    repeating-linear-gradient(90deg, var(--lay-mark) 0 1px, transparent 1px 80px) 40px bottom / 100% 8px no-repeat,
    var(--lay-panel-bg), var(--lab-surface) !important;
}

/* 14.3 Logo : anneau orbital pointillé + satellite */
html body header .logo-block { gap: 18px; padding-left: 4px; }
html body header .logo-icon { position: relative; overflow: visible !important; }
html body header .logo-icon::before,
html body header .logo-icon::after {
  content: '';
  position: absolute;
  inset: -7px;
  border-radius: 50%;
  pointer-events: none;
}
html body header .logo-icon::before {
  border: 1px dashed color-mix(in srgb, var(--lab-primary-2) 40%, transparent);
  animation: lay-spin 40s linear infinite;
}
html body header .logo-icon::after {
  background: radial-gradient(circle at 50% 0, var(--lab-cyan) 0 2.5px, transparent 3.5px);
  filter: drop-shadow(0 0 4px var(--lab-cyan));
  animation: lay-spin 7s linear infinite;
}
@keyframes lay-spin { to { transform: rotate(360deg); } }

/* 14.4 KPI : lectures d'instrument sur papier millimétré */
html body header .hstat {
  background:
    var(--lay-graph-paper),
    var(--lab-surface-2) !important;
  background-size: 8px 8px, 8px 8px, auto !important;
}
html body header .hstat::after {             /* graduation miniature en bas à droite */
  content: '';
  position: absolute;
  right: 8px; top: 6px;
  width: 22px; height: 4px;
  background: repeating-linear-gradient(90deg, var(--lab-line-2) 0 1px, transparent 1px 4px);
  opacity: .9;
  pointer-events: none;
  transition: width .35s var(--lab-ease);
}
html body header .hstat:hover::after {
  width: 34px;
  background: repeating-linear-gradient(90deg, var(--lay-kpi) 0 1px, transparent 1px 4px);
}

/* 14.5 Barre des domaines : spectre des 4 domaines + reflet sur l'actif */
html body .domain-bar::before {
  content: '';
  position: absolute;
  top: -1px; left: 18px; right: 18px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--lab-cyan) 15%, var(--lab-red) 38%, var(--lab-amber) 62%, var(--lab-green) 85%, transparent);
  opacity: .55;
  pointer-events: none;
}
html body .domain-bar .domain-tab::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent 35%, rgba(255,255,255,.06) 50%, transparent 65%);
  background-size: 250% 100%;
  background-position: 120% 0;
  opacity: 0;
  pointer-events: none;
  border-radius: inherit;
}
html body .domain-bar .domain-tab[class*="active-"]::before {
  opacity: 1;
  animation: lay-sheen 6s var(--lab-ease) infinite;
}
@keyframes lay-sheen {
  0%, 55% { background-position: 120% 0; }
  100%    { background-position: -120% 0; }
}
html body .domain-bar .domain-tab[class*="active-"] .domain-icon {
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--lay-acc) 55%, transparent);
}
html body .domain-bar .domain-tab:active { transform: scale(.985); }

/* 14.6 Panneaux : repères de coupe (crop marks) */
html body .sidebar-left::before,
html body .sidebar-left::after,
html body .sidebar-right::before,
html body .sidebar-right::after {
  content: '' !important;
  position: absolute !important;
  top: 7px !important; bottom: auto !important;
  width: 10px !important; height: 10px !important;
  background: none !important;
  opacity: .9 !important;
  transform: none !important;
  pointer-events: none !important;
  z-index: 2 !important;
}
html body .sidebar-left::before,
html body .sidebar-right::before {
  left: 7px !important; right: auto !important;
  border-top: 1px solid var(--lay-mark);
  border-left: 1px solid var(--lay-mark);
}
html body .sidebar-left::after,
html body .sidebar-right::after {
  right: 7px !important; left: auto !important;
  border-top: 1px solid var(--lay-mark);
  border-right: 1px solid var(--lay-mark);
}
/* colonne centrale : repères posés à l'extérieur du cadre (aucun chevauchement) */
html body .center-panel::before,
html body .center-panel::after {
  content: '';
  position: absolute;
  width: 12px; height: 12px;
  pointer-events: none;
  z-index: 2;
}
html body .center-panel::before {
  top: -6px; left: -6px;
  border-top: 1px solid var(--lay-mark);
  border-left: 1px solid var(--lay-mark);
}
html body .center-panel::after {
  bottom: -6px; right: -6px;
  border-bottom: 1px solid var(--lay-mark);
  border-right: 1px solid var(--lay-mark);
}

/* 14.7 Titres de section de la colonne gauche : index mono + règle graduée */
html body .sidebar-left { counter-reset: lay-sec; }
html body .sidebar-left .section-title { counter-increment: lay-sec; }
html body .sidebar-left .section-title::before {
  content: counter(lay-sec, decimal-leading-zero) !important;
  width: auto !important;
  height: auto !important;
  padding: 1px 6px;
  border-radius: 5px;
  background: var(--lay-tint-primary) !important;
  border: 1px solid color-mix(in srgb, var(--lab-primary) 30%, transparent);
  color: var(--lab-primary-2) !important;
  font-family: var(--lab-mono) !important;
  font-size: 11.5px !important;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.4;
}
html body .sidebar-left .section-title::after {
  height: 5px !important;
  align-self: flex-end;
  margin-bottom: 4px;
  background:
    linear-gradient(var(--lab-line-2), var(--lab-line-2)) left bottom / 100% 1px no-repeat,
    repeating-linear-gradient(90deg, var(--lab-line-2) 0 1px, transparent 1px 6px) left bottom / 100% 5px no-repeat !important;
  -webkit-mask-image: linear-gradient(90deg, #000 20%, transparent);
          mask-image: linear-gradient(90deg, #000 20%, transparent);
}
html body .sidebar-left .section-title { color: var(--lab-text-2) !important; }

/* 14.8 Pipeline : rail pointillé qui relie les numéros de phase
   (::after réservé au cadenas en mode démo → rail désactivé en démo) */
html body .sidebar-left .phase-num { position: relative; z-index: 1; }
html body:not(.demo-mode) .sidebar-left .phase-btn::after {
  content: '';
  position: absolute;
  left: 28px;                        /* 14px padding + 15px (demi-badge) − 1px */
  top: 0; bottom: 0;
  width: 1px;
  background: repeating-linear-gradient(180deg, var(--lab-line-2) 0 3px, transparent 3px 6px);
  -webkit-mask-image: linear-gradient(#000 calc(50% - 17px), transparent calc(50% - 17px), transparent calc(50% + 17px), #000 calc(50% + 17px));
          mask-image: linear-gradient(#000 calc(50% - 17px), transparent calc(50% - 17px), transparent calc(50% + 17px), #000 calc(50% + 17px));
  pointer-events: none;
  z-index: 0;
}
html body:not(.demo-mode) .sidebar-left #btn-init::after { top: calc(50% + 17px); -webkit-mask-image: none; mask-image: none; }
html body:not(.demo-mode) .sidebar-left #btn-p5::after   { bottom: calc(50% + 17px); -webkit-mask-image: none; mask-image: none; }
html body:not(.demo-mode) .sidebar-left .phase-btn.success::after {
  background: repeating-linear-gradient(180deg, color-mix(in srgb, var(--lab-green) 70%, transparent) 0 3px, transparent 3px 6px);
}
html body:not(.demo-mode) .sidebar-left .phase-btn.loading::after {
  background: repeating-linear-gradient(180deg, var(--lab-primary) 0 3px, transparent 3px 6px);
  background-size: 1px 12px;
  animation: lay-rail-flow .6s linear infinite;
}
@keyframes lay-rail-flow { to { background-position: 0 12px; } }
/* resserre légèrement les cartes pour que le rail paraisse continu */
html body .sidebar-left > .phase-btn + .phase-btn { margin-top: -2px; }

/* 14.9 Auto-cycle : papier millimétré + lecture « CYCLES » encadrée */
html body .sidebar-left .auto-block {
  background:
    var(--lay-graph-paper),
    var(--lab-surface-2) !important;
  background-size: 12px 12px, 12px 12px, auto !important;
}
html body .sidebar-left .auto-controls > div {
  padding: 6px 10px 8px;
  border-radius: 8px;
  background:
    repeating-linear-gradient(90deg, var(--lab-line-2) 0 1px, transparent 1px 5px) left bottom / 100% 3px no-repeat,
    var(--lab-surface-solid);
  border: 1px solid var(--lab-line);
  min-width: 74px;
}
html body .sidebar-left .auto-controls > div .auto-label { font-size: 11.5px !important; }

/* 14.10 Micro-interactions boutons */
html body .sidebar-left .util-btn,
html body .sidebar-left .auto-btn { will-change: transform; }
html body .sidebar-left .util-btn:active,
html body .sidebar-left .auto-btn:active { transform: translateY(0) scale(.98) !important; }
html body header .help-btn:active,
html body header .notif-btn:active { transform: scale(.95); }

/* 14.11 Responsive des motifs */
@media (max-width: 768px) {
  html body:not(.demo-mode) .sidebar-left .phase-btn::after { content: none; }
  html body .sidebar-left > .phase-btn + .phase-btn { margin-top: 0; }
  html body .center-panel::before,
  html body .center-panel::after { display: none; }
}

/* ==== 20-center.css ==== */
/* ═══════════════════════════════════════════════════════════════════════════
   SCI-AUTONOME — thème « Laboratoire moderne »
   20-center.css — tout ce qui vit DANS main.center-panel
   (onglets, journal d'exécution, résultats, tableau de bord, graphe,
    rapports, recherche, timeline, logs, réseau, comparaison, santé, historique)

   Conventions :
   - préfixe `html body main.center-panel` pour passer devant style.css et
     les <style> injectés au runtime ;
   - !important uniquement pour battre les style="" inline (markup + JS) ;
   - jamais d'!important sur position / taille / radius des éléments qui
     ont un mode plein écran (console .console-fs, #graphCanvas) ;
   - jetons partagés de 00-tokens.css uniquement ; helpers locaux en --ctr-.
   ═══════════════════════════════════════════════════════════════════════════ */


/* ───────────────────────────────────────────────────────────────────────────
   0. PORTÉE : helpers --ctr- + remappage des anciennes variables du thème
      (les style="" inline utilisent var(--panel), var(--textdim), var(--med)…
       → on les redéfinit localement pour que tout l'inline suive le thème).
      NB : --active (accent du domaine, piloté par JS sur :root) n'est PAS touché.
   ─────────────────────────────────────────────────────────────────────────── */
html body main.center-panel {
  /* helpers */
  --ctr-accent:        var(--lab-primary);
  --ctr-accent-soft:   color-mix(in srgb, var(--lab-primary) 14%, transparent);
  --ctr-accent-line:   color-mix(in srgb, var(--lab-primary) 42%, transparent);
  --ctr-ok-soft:       color-mix(in srgb, var(--lab-green) 13%, transparent);
  --ctr-ok-line:       color-mix(in srgb, var(--lab-green) 38%, transparent);
  --ctr-info-soft:     color-mix(in srgb, var(--lab-primary-2) 13%, transparent);
  --ctr-info-line:     color-mix(in srgb, var(--lab-primary-2) 38%, transparent);
  --ctr-warn-soft:     color-mix(in srgb, var(--lab-amber) 13%, transparent);
  --ctr-warn-line:     color-mix(in srgb, var(--lab-amber) 38%, transparent);
  --ctr-err-soft:      color-mix(in srgb, var(--lab-red) 13%, transparent);
  --ctr-err-line:      color-mix(in srgb, var(--lab-red) 40%, transparent);
  --ctr-violet-soft:   color-mix(in srgb, var(--lab-violet) 14%, transparent);
  --ctr-violet-line:   color-mix(in srgb, var(--lab-violet) 42%, transparent);
  --ctr-cyan-soft:     color-mix(in srgb, var(--lab-cyan) 13%, transparent);
  --ctr-cyan-line:     color-mix(in srgb, var(--lab-cyan) 38%, transparent);
  --ctr-console-bg:    color-mix(in srgb, var(--lab-bg) 92%, transparent);
  --ctr-hover:         color-mix(in srgb, var(--lab-text) 5%, transparent);
  --ctr-pill:          999px;

  /* remappage de l'ancien thème (portée : panneau central uniquement) */
  --bg2:        var(--lab-bg-2);
  --bg3:        var(--lab-surface-solid);
  --panel:      var(--lab-surface-2);
  --panel2:     var(--lab-surface-3);
  --border:     var(--lab-line);
  --border2:    var(--lab-line);
  --text:       var(--lab-text-2);
  --textdim:    var(--lab-muted);
  --textbright: var(--lab-text);
  --gov:        var(--lab-primary-2);
  --med:        var(--lab-cyan);
  --cyber:      var(--lab-red);
  --tech:       var(--lab-amber);
  --phy:        var(--lab-green);
  --radius:     var(--lab-radius-xs);
  --radius-lg:  var(--lab-radius-sm);

  font-family: var(--lab-font);
  color: var(--lab-text-2);
}


/* ───────────────────────────────────────────────────────────────────────────
   1. TYPOGRAPHIE GLOBALE DU PANNEAU (rattrape les polices/tailles inline)
   ─────────────────────────────────────────────────────────────────────────── */
html body main.center-panel button,
html body main.center-panel input,
html body main.center-panel select,
html body main.center-panel textarea {
  font-family: var(--lab-font);
}

/* Orbitron / Share Tech Mono injectés en inline → police UI */
html body main.center-panel [style*="Orbitron"],
html body main.center-panel [style*="Share Tech Mono"] {
  font-family: var(--lab-font) !important;
  letter-spacing: .01em !important;
}
html body main.center-panel [style*="Orbitron"] {
  font-weight: 700 !important;
  font-variant-numeric: tabular-nums;
}

/* Tailles minuscules inline → plancher de lisibilité (11 / 12 px) */
html body main.center-panel [style*="font-size:7px"],
html body main.center-panel [style*="font-size:8px"],
html body main.center-panel [style*="font-size:9px"] {
  font-size: 12px !important;
}
html body main.center-panel [style*="font-size:10px"],
html body main.center-panel [style*="font-size:11px"] {
  font-size: 13px !important;
}

/* Couleurs « néon » codées en dur dans l'inline → jetons */
html body main.center-panel [style*="color:#30d158"]  { color: var(--lab-green) !important; }
html body main.center-panel [style*="color:#ff2d6b"]  { color: var(--lab-red) !important; }
html body main.center-panel [style*="color:#bf5af2"]  { color: var(--lab-violet) !important; }
html body main.center-panel [style*="color:#d4d4dc"]  { color: var(--lab-text-2) !important; }

/* Sélection de texte */
html body main.center-panel ::selection {
  background: color-mix(in srgb, var(--lab-primary) 35%, transparent);
  color: var(--lab-text);
}

/* Focus clavier visible et cohérent */
html body main.center-panel button:focus-visible,
html body main.center-panel input:focus-visible,
html body main.center-panel select:focus-visible,
html body main.center-panel [onclick]:focus-visible {
  outline: 2px solid var(--lab-primary-2) !important;
  outline-offset: 2px !important;
}


/* ───────────────────────────────────────────────────────────────────────────
   2. BARRE D'ONGLETS + MENU « PLUS »
   ─────────────────────────────────────────────────────────────────────────── */
html body main.center-panel .tab-nav {
  gap: 4px;
  padding: 8px 12px;
  background: var(--lab-surface);
  -webkit-backdrop-filter: var(--lab-blur);
  backdrop-filter: var(--lab-blur);
  border: 0;
  border-bottom: 1px solid var(--lab-line);
  box-shadow: 0 1px 0 rgba(255,255,255,.03) inset;
}

html body main.center-panel .tab {
  position: relative;
  min-height: 38px;
  padding: 8px 14px;
  font-family: var(--lab-font);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .025em;
  color: var(--lab-muted);
  background: transparent;
  border: 1px solid transparent;
  border-radius: var(--lab-radius-sm);
  text-shadow: none;
  transition: color .18s var(--lab-ease), background-color .18s var(--lab-ease),
              border-color .18s var(--lab-ease), box-shadow .18s var(--lab-ease);
}
html body main.center-panel .tab:hover {
  color: var(--lab-text);
  background: var(--ctr-hover);
}
html body main.center-panel .tab.active {
  color: var(--lab-text);
  background: var(--ctr-accent-soft);
  border-color: var(--ctr-accent-line);
  text-shadow: none;
  box-shadow: 0 6px 18px -10px var(--lab-primary);
}
/* indicateur actif : fine barre sous le libellé */
html body main.center-panel .tab.active::after {
  left: 14px;
  right: 14px;
  bottom: 3px;
  height: 2px;
  border-radius: 2px;
  background: var(--lab-primary-2);
  box-shadow: none;
  opacity: .9;
}

/* Bouton FOCUS (poussé à droite par style.css) */
html body main.center-panel #btn-focus-mode {
  border-color: var(--lab-line-2);
}
html body main.center-panel #btn-focus-mode.active {
  color: var(--lab-text) !important;
  background: var(--ctr-accent-soft) !important;
  border-color: var(--ctr-accent-line) !important;
}

/* ▼ PLUS */
html body main.center-panel .dropdown-btn {
  background: var(--lab-surface-2) !important;
  border: 1px solid var(--lab-line-2) !important;
  border-radius: var(--lab-radius-sm) !important;
  color: var(--lab-text-2);
}
html body main.center-panel .dropdown-btn:hover,
html body main.center-panel .dropdown-btn.active {
  background: var(--ctr-accent-soft) !important;
  border-color: var(--ctr-accent-line) !important;
  color: var(--lab-text) !important;
}

html body main.center-panel .dropdown-content {
  top: calc(100% + 8px);
  min-width: 210px;
  padding: 6px;
  background: var(--lab-surface-solid);
  border: 1px solid var(--lab-line-2);
  border-radius: var(--lab-radius);
  box-shadow: var(--lab-shadow-hi);
  -webkit-backdrop-filter: var(--lab-blur);
  backdrop-filter: var(--lab-blur);
}
html body main.center-panel .dropdown-content .tab {
  min-height: 36px;
  padding: 9px 12px !important;
  font-size: 12.5px !important;
  font-weight: 500;
  letter-spacing: .02em;
  color: var(--lab-text-2);
  border: 0 !important;
  border-radius: var(--lab-radius-xs);
  box-shadow: none;
}
html body main.center-panel .dropdown-content .tab:hover {
  background: var(--ctr-hover) !important;
  color: var(--lab-text) !important;
}
html body main.center-panel .dropdown-content .tab.active {
  background: var(--ctr-accent-soft) !important;
  color: var(--lab-text) !important;
}
html body main.center-panel .dropdown-content .tab.active::after { display: none; }


/* ───────────────────────────────────────────────────────────────────────────
   3. CONTENU DES ONGLETS, TITRES DE SECTION, ÉTATS VIDES
   ─────────────────────────────────────────────────────────────────────────── */
html body main.center-panel .tab-content {
  padding: 18px;
  border-radius: 0 0 var(--lab-radius) var(--lab-radius);
  scrollbar-width: thin;
  scrollbar-color: var(--lab-line-2) transparent;
}

html body main.center-panel .tab-pane.active {
  animation: ctr-pane-in .28s var(--lab-ease);
}
@keyframes ctr-pane-in {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: none; }
}

html body main.center-panel .section-title {
  font-family: var(--lab-font);
  font-size: 13.5px;
  font-weight: 700;
  letter-spacing: .05em;
  color: var(--lab-text);
  text-shadow: none;
  gap: 9px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--lab-line);
}
/* « // » décoratif → pastille d'accent */
html body main.center-panel .section-title::before {
  content: '';
  width: 6px;
  height: 6px;
  flex: 0 0 6px;
  border-radius: 50%;
  background: var(--lab-primary);
  box-shadow: 0 0 0 3px var(--ctr-accent-soft);
  opacity: 1;
}
/* faisceau animé → trait d'accent statique */
html body main.center-panel .section-title::after {
  width: 36px;
  height: 2px;
  bottom: -1px;
  background: var(--lab-primary);
  border-radius: 2px;
  opacity: .9;
  animation: none;
}

/* États vides / chargement générés en <p style="color:var(--textdim)…"> */
html body main.center-panel .tab-pane p[style*="color:var(--textdim)"] {
  margin: 4px 0 0;
  padding: 22px 18px;
  text-align: center;
  font-family: var(--lab-font) !important;
  font-size: 13px !important;
  line-height: 1.55;
  color: var(--lab-muted) !important;
  background: color-mix(in srgb, var(--lab-surface-2) 55%, transparent);
  border: 1px dashed var(--lab-line-2);
  border-radius: var(--lab-radius-sm);
}
/* message d'erreur générique (recherche) */
html body main.center-panel .tab-pane p[style*="color:var(--cyber)"] {
  padding: 12px 14px;
  font-size: 13px !important;
  color: var(--lab-red) !important;
  background: var(--ctr-err-soft);
  border: 1px solid var(--ctr-err-line);
  border-radius: var(--lab-radius-sm);
}


/* ───────────────────────────────────────────────────────────────────────────
   4. BOUTONS DU PANNEAU (util / graph / dl / search / auto)
   ─────────────────────────────────────────────────────────────────────────── */
html body main.center-panel .util-btn,
html body main.center-panel .graph-btn,
html body main.center-panel .dl-btn,
html body main.center-panel .rpag-btn {
  font-family: var(--lab-font);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .03em;
  color: var(--lab-text-2) !important;
  background: var(--lab-surface-2) !important;
  border: 1px solid var(--lab-line-2) !important;
  border-radius: var(--lab-radius-sm);
  box-shadow: none;
  text-shadow: none;
  clip-path: none;
  transition: background-color .18s var(--lab-ease), border-color .18s var(--lab-ease),
              color .18s var(--lab-ease), transform .18s var(--lab-ease);
}
html body main.center-panel .util-btn,
html body main.center-panel .graph-btn {
  min-height: 34px;
  padding: 7px 13px;
}
html body main.center-panel .util-btn:hover:not(:disabled),
html body main.center-panel .graph-btn:hover,
html body main.center-panel .dl-btn:hover,
html body main.center-panel .rpag-btn:hover:not(:disabled) {
  color: var(--lab-text) !important;
  background: var(--ctr-accent-soft) !important;
  border-color: var(--ctr-accent-line) !important;
  box-shadow: none;
  transform: translateY(-1px);
}
html body main.center-panel .util-btn:disabled,
html body main.center-panel .rpag-btn:disabled {
  opacity: .45;
  cursor: not-allowed;
  transform: none;
}
html body main.center-panel .graph-btn.active {
  color: var(--lab-text) !important;
  background: var(--ctr-accent-soft) !important;
  border-color: var(--ctr-accent-line) !important;
}

/* Bouton d'action principale (ex. ⚖ COMPARER VIA IA) */
html body main.center-panel .auto-btn {
  min-height: 42px;
  padding: 10px 16px;
  font-family: var(--lab-font);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .04em;
  color: #fff;
  background: linear-gradient(180deg, var(--lab-primary-2), var(--lab-primary));
  border: 1px solid color-mix(in srgb, var(--lab-primary-2) 70%, transparent);
  border-radius: var(--lab-radius-sm);
  clip-path: none;
  filter: none;
  box-shadow: 0 10px 24px -14px var(--lab-primary), 0 1px 0 rgba(255,255,255,.18) inset;
  animation: none;
}
html body main.center-panel .auto-btn::before { display: none; }
html body main.center-panel .auto-btn:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
  background: linear-gradient(180deg, var(--lab-primary-2), var(--lab-primary));
  border-color: var(--lab-primary-2);
}
html body main.center-panel .auto-btn:disabled {
  opacity: .6;
  cursor: progress;
  transform: none;
}


/* ───────────────────────────────────────────────────────────────────────────
   5. CONSOLE → « journal d'exécution » (#main-console, #sys-logs)
   ─────────────────────────────────────────────────────────────────────────── */
html body main.center-panel .console {
  font-family: var(--lab-mono);
  font-size: 13px;
  line-height: 1.7;
  background: var(--lab-surface);
  -webkit-backdrop-filter: var(--lab-blur);
  backdrop-filter: var(--lab-blur);
  border: 1px solid var(--lab-line-2);
  border-radius: var(--lab-radius);
  box-shadow: var(--lab-shadow);
  min-height: 200px;
  max-height: 420px;
}

/* Barre de titre (texte conservé, pastilles adoucies) */
html body main.center-panel .console::before {
  height: 40px;
  line-height: 40px;
  padding: 0 120px 0 80px;
  font-family: var(--lab-mono);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .02em;
  color: var(--lab-muted);
  text-align: left;
  border-bottom: 1px solid var(--lab-line);
  border-radius: var(--lab-radius) var(--lab-radius) 0 0;
  background:
    radial-gradient(circle at 20px 50%, color-mix(in srgb, var(--lab-red) 85%, transparent) 0 5px, transparent 5.6px),
    radial-gradient(circle at 38px 50%, color-mix(in srgb, var(--lab-amber) 85%, transparent) 0 5px, transparent 5.6px),
    radial-gradient(circle at 56px 50%, color-mix(in srgb, var(--lab-green) 85%, transparent) 0 5px, transparent 5.6px),
    linear-gradient(180deg, color-mix(in srgb, var(--lab-surface-3) 80%, transparent), color-mix(in srgb, var(--lab-surface-solid) 85%, transparent));
}
/* Ligne de balayage « CRT » → retirée (décor uniquement) */
html body main.center-panel .console::after {
  animation: none;
  opacity: 0;
}

/* Boutons COPY / ⬇ dans la barre de titre */
html body main.center-panel .console-copy-btn,
html body main.center-panel .console-save-btn {
  top: 8px;
  height: 24px;
  padding: 0 10px;
  line-height: 22px;
  font-family: var(--lab-font);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--lab-text);
  background: var(--lab-surface-2);
  border: 1px solid var(--lab-line-2);
  border-radius: var(--lab-radius-xs);
  transition: background-color .18s var(--lab-ease), border-color .18s var(--lab-ease), color .18s var(--lab-ease);
}
html body main.center-panel .console-copy-btn { right: 10px; }
html body main.center-panel .console-save-btn { right: 72px; }
html body main.center-panel .console-copy-btn:hover {
  color: var(--lab-text);
  background: var(--ctr-accent-soft);
  border-color: var(--ctr-accent-line);
}
html body main.center-panel .console-save-btn:hover {
  color: var(--lab-text);
  background: var(--ctr-ok-soft);
  border-color: var(--ctr-ok-line);
}
html body main.center-panel .console-copy-btn.copied,
html body main.center-panel .console-save-btn.saved {
  color: var(--lab-green);
  background: var(--ctr-ok-soft);
  border-color: var(--ctr-ok-line);
}

/* Barre de filtres (chips) */
html body main.center-panel .console-filters {
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px 12px;
  background: color-mix(in srgb, var(--lab-surface-solid) 70%, transparent);
  border-bottom: 1px solid var(--lab-line);
}
html body main.center-panel .cf-label {
  font-family: var(--lab-font);
  font-size: 12px;
  color: var(--lab-muted);
  letter-spacing: 0;
  margin-right: 2px;
}
html body main.center-panel .cf-sep {
  color: var(--lab-line-2);
  margin: 0 4px;
}
html body main.center-panel .cf-btn,
html body main.center-panel .cf-action {
  height: 26px;
  padding: 0 11px;
  line-height: 24px;
  font-family: var(--lab-font);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  border-radius: var(--ctr-pill);
  transition: background-color .18s var(--lab-ease), border-color .18s var(--lab-ease),
              color .18s var(--lab-ease), opacity .18s var(--lab-ease);
}
/* filtre désactivé : lisible mais clairement « off » */
html body main.center-panel .cf-btn {
  opacity: 1;
  color: var(--lab-muted);
  background: transparent;
  border: 1px dashed var(--lab-line-2);
  text-decoration: line-through;
  text-decoration-color: color-mix(in srgb, var(--lab-muted) 60%, transparent);
}
html body main.center-panel .cf-btn.active { text-decoration: none; border-style: solid; }
html body main.center-panel .cf-btn.active[data-type="ok"]    { color: var(--lab-green);     background: var(--ctr-ok-soft);   border-color: var(--ctr-ok-line); }
html body main.center-panel .cf-btn.active[data-type="info"]  { color: var(--lab-primary-2); background: var(--ctr-info-soft); border-color: var(--ctr-info-line); }
html body main.center-panel .cf-btn.active[data-type="warn"]  { color: var(--lab-amber);     background: var(--ctr-warn-soft); border-color: var(--ctr-warn-line); }
html body main.center-panel .cf-btn.active[data-type="error"] { color: var(--lab-red);       background: var(--ctr-err-soft);  border-color: var(--ctr-err-line); }

html body main.center-panel .cf-action {
  color: var(--lab-text-2);
  background: transparent;
  border: 1px solid var(--lab-line-2);
}
html body main.center-panel .cf-action:hover {
  color: var(--lab-text);
  background: var(--ctr-hover);
}
html body main.center-panel .cf-action.active {
  color: var(--lab-text);
  background: var(--ctr-accent-soft);
  border-color: var(--ctr-accent-line);
}
html body main.center-panel .cf-action.danger:hover {
  color: var(--lab-red);
  background: var(--ctr-err-soft);
  border-color: var(--ctr-err-line);
}

/* Corps du journal */
html body main.center-panel .console-body {
  padding: 10px 0 12px;
  color: var(--lab-text-2);
  background: var(--ctr-console-bg);
  scrollbar-color: var(--lab-line-2) transparent;
}
html body main.center-panel .console-body::-webkit-scrollbar,
html body main.center-panel #sys-logs::-webkit-scrollbar { width: 8px; }
html body main.center-panel .console-body::-webkit-scrollbar-track,
html body main.center-panel #sys-logs::-webkit-scrollbar-track { background: transparent; }
html body main.center-panel .console-body::-webkit-scrollbar-thumb,
html body main.center-panel #sys-logs::-webkit-scrollbar-thumb {
  background: var(--lab-line-2);
  border-radius: 8px;
  border: 2px solid transparent;
  background-clip: padding-box;
}
html body main.center-panel .console-body ::selection {
  background: color-mix(in srgb, var(--lab-primary) 40%, transparent);
  color: var(--lab-text);
}

/* Lignes */
html body main.center-panel .log-line {
  font-family: var(--lab-mono);
  font-size: 13px;
  line-height: 1.75;
  padding: 2px 18px;
  background: transparent;
  text-shadow: none;
  border-left: 2px solid transparent;
  word-break: normal;
  overflow-wrap: anywhere;
  animation: ctr-log-in .32s var(--lab-ease) backwards;
  transition: background-color .15s;
}
html body main.center-panel .log-line:hover { background: var(--ctr-hover); }
@keyframes ctr-log-in {
  from { opacity: 0; transform: translateX(-4px); }
  to   { opacity: 1; transform: none; }
}
/* invite « root@sci:~$ » : conservée, en retrait visuel */
html body main.center-panel .log-line::before {
  color: color-mix(in srgb, var(--lab-teal) 70%, var(--lab-muted));
  font-weight: 500;
}
/* .dim d'abord : une ligne « dim error » (logs système) reste rouge */
html body main.center-panel .log-line.dim                 { color: var(--lab-muted); }
html body main.center-panel .log-line.dim::before         { color: color-mix(in srgb, var(--lab-muted) 70%, transparent); }
html body main.center-panel .log-line.ok                  { color: var(--lab-green); }
html body main.center-panel .log-line.info                { color: var(--lab-primary-2); }
html body main.center-panel .log-line.warn                { color: var(--lab-amber); }
html body main.center-panel .log-line.error {
  color: var(--lab-red);
  padding-left: 18px;
  background: color-mix(in srgb, var(--lab-red) 7%, transparent);
  border-left-color: var(--lab-red);
}
/* curseur de fin : fin, bleu, doux */
html body main.center-panel .log-line:last-child::after {
  color: var(--lab-primary-2);
  font-size: 12px;
  opacity: .85;
}
/* horodatage */
html body main.center-panel .log-ts {
  font-family: var(--lab-mono);
  font-size: 12px;
  color: var(--lab-text-2);
  opacity: .8;
  margin-right: 10px;
  font-variant-numeric: tabular-nums;
}

/* Plein écran (classe JS .console-fs — on ne touche qu'à l'habillage) */
html body main.center-panel .console.console-fs {
  background: var(--lab-bg);
  border: 0;
}

/* #sys-logs : les lignes sont enfants directs de .console */
html body main.center-panel #sys-logs {
  background: var(--ctr-console-bg);
  scrollbar-width: thin;
  scrollbar-color: var(--lab-line-2) transparent;
}
html body main.center-panel #sys-logs > .log-line:first-of-type { margin-top: 8px; }

/* Barre de contrôle LOGS */
html body main.center-panel .logs-controls {
  gap: 8px;
  margin-bottom: 12px;
}
html body main.center-panel .logs-controls .util-btn { flex: 0 0 auto; }
html body main.center-panel .logs-info {
  font-family: var(--lab-mono);
  font-size: 12px;
  color: var(--lab-muted);
  letter-spacing: 0;
  margin-left: 4px;
}


/* ───────────────────────────────────────────────────────────────────────────
   6. BLOC RÉSULTAT (#result-display, généré par showResult())
      structure : #result-display > div(wrapper) > [titre, phase, message,
                  …, items(.badge + <b> + <div>)]
   ─────────────────────────────────────────────────────────────────────────── */
html body main.center-panel #result-display {
  margin-top: 16px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: var(--lab-radius) !important;
  box-shadow: none !important;
  transform: none !important;
  font-family: var(--lab-font) !important;
  font-size: 13px !important;
}
html body main.center-panel #result-display:empty { display: none; }

/* Carte résultat */
html body main.center-panel #result-display > div {
  position: relative;
  padding: 16px 18px 16px 20px !important;
  font-family: var(--lab-font) !important;
  font-size: 13px !important;
  line-height: 1.55;
  color: var(--lab-text-2);
  background: var(--lab-surface) !important;
  -webkit-backdrop-filter: var(--lab-blur);
  backdrop-filter: var(--lab-blur);
  border: 1px solid var(--lab-line-2) !important;
  border-radius: var(--lab-radius) !important;
  box-shadow: var(--lab-shadow);
  overflow: hidden;
  animation: ctr-pane-in .32s var(--lab-ease);
}
/* liseré d'état à gauche : vert (ok), ambre (warn), rouge (erreur) */
html body main.center-panel #result-display > div::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: var(--lab-green);
}
html body main.center-panel #result-display > div[style*="255,159,10"]::before { background: var(--lab-amber); }
html body main.center-panel #result-display > div[style*="255,45,107"]::before  { background: var(--lab-red); }
html body main.center-panel #result-display > div[style*="255,45,107"] { border-color: var(--ctr-err-line) !important; }
html body main.center-panel #result-display > div[style*="255,159,10"] { border-color: var(--ctr-warn-line) !important; }

/* En-tête « // 💊 RÉSULTAT [MEDICAL] » */
html body main.center-panel #result-display > div > div:first-child {
  margin-bottom: 10px !important;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--lab-line);
  font-size: 12px !important;
  font-weight: 700;
  letter-spacing: .08em !important;
  color: var(--lab-green) !important;
}
html body main.center-panel #result-display > div[style*="255,159,10"] > div:first-child { color: var(--lab-amber) !important; }
html body main.center-panel #result-display > div[style*="255,45,107"] > div:first-child { color: var(--lab-red) !important; }

/* « PHASE 5 — OK » → pastille */
html body main.center-panel #result-display > div > div[style*="color:var(--active)"] {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 6px;
  padding: 3px 11px;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--lab-primary-2) !important;
  background: var(--ctr-accent-soft);
  border: 1px solid var(--ctr-accent-line);
  border-radius: var(--ctr-pill);
}
html body main.center-panel #result-display > div > div[style*="color:var(--active)"]::before {
  content: '';
  width: 6px; height: 6px;
  border-radius: 50%;
  background: currentColor;
}

/* message / analyse / résumé */
html body main.center-panel #result-display > div > div[style*="color:var(--text)"] {
  color: var(--lab-text) !important;
  font-size: 13.5px;
  margin-top: 6px !important;
}
html body main.center-panel #result-display > div > div[style*="color:var(--textdim)"] {
  color: var(--lab-text-2) !important;
  margin-top: 6px !important;
}
html body main.center-panel #result-display > div > div[style*="color:var(--cyber)"] {
  margin-top: 8px !important;
  padding: 8px 12px;
  color: var(--lab-red) !important;
  background: var(--ctr-err-soft);
  border-radius: var(--lab-radius-xs);
}

/* Items : PRÉ-PRINT (rapports) et simulations */
html body main.center-panel #result-display > div > div:has(> .badge) {
  margin-top: 10px !important;
  padding: 12px 14px !important;
  color: var(--lab-text-2);
  background: var(--lab-surface-2);
  border: 1px solid var(--lab-line) !important;
  border-left: 3px solid var(--lab-teal) !important;
  border-radius: var(--lab-radius-sm) !important;
  line-height: 1.7;
  transition: border-color .18s var(--lab-ease), background-color .18s var(--lab-ease), transform .18s var(--lab-ease);
}
html body main.center-panel #result-display > div > div:has(> .badge):hover {
  border-color: var(--lab-line-2) !important;
  border-left-color: var(--lab-teal) !important;
  transform: translateY(-1px);
}
html body main.center-panel #result-display > div > div:has(> .badge-reject) {
  border-left-color: var(--lab-red) !important;
}
html body main.center-panel #result-display > div > div:has(> .badge-reject):hover {
  border-left-color: var(--lab-red) !important;
}
/* item PRÉ-PRINT (contient un sous-titre <div>) → mise en page carte */
html body main.center-panel #result-display > div > div:has(> .badge):has(> div) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
}
html body main.center-panel #result-display > div > div:has(> .badge) > b {
  color: var(--lab-text);
  font-weight: 600;
  font-size: 14px;
  line-height: 1.4;
}
html body main.center-panel #result-display > div > div:has(> .badge):has(> div) > b {
  flex: 1 1 260px;
  min-width: 0;
}
html body main.center-panel #result-display > div > div:has(> .badge) > div {
  flex: 1 1 100%;
  margin-top: 0 !important;
  font-size: 12.5px;
  color: var(--lab-muted) !important;
  line-height: 1.6;
}
/* « ✓ NOUVEAUTÉ ABSOLUE » → chip */
html body main.center-panel #result-display span[style*="#30d158"] {
  display: inline-flex;
  align-items: center;
  margin-left: 2px;
  padding: 1px 9px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .03em;
  color: var(--lab-green) !important;
  background: var(--ctr-ok-soft);
  border: 1px solid var(--ctr-ok-line);
  border-radius: var(--ctr-pill);
  white-space: nowrap;
}
html body main.center-panel #result-display span[style*="color:var(--tech)"] {
  color: var(--lab-amber) !important;
  font-weight: 600;
}


/* ───────────────────────────────────────────────────────────────────────────
   7. BADGES GÉNÉRIQUES (panneau central)
   ─────────────────────────────────────────────────────────────────────────── */
html body main.center-panel .badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin: 2px 4px 2px 0;
  padding: 2px 10px;
  font-family: var(--lab-font);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .03em;
  line-height: 1.6;
  border-radius: var(--ctr-pill);
  border: 1px solid var(--lab-line-2);
  background: var(--lab-surface-3);
  color: var(--lab-text-2);
  vertical-align: middle;
}
html body main.center-panel .badge-valid {
  color: var(--lab-green);
  background: var(--ctr-ok-soft);
  border-color: var(--ctr-ok-line);
}
html body main.center-panel .badge-reject {
  color: var(--lab-red);
  background: var(--ctr-err-soft);
  border-color: var(--ctr-err-line);
}


/* ───────────────────────────────────────────────────────────────────────────
   8. TABLEAU DE BORD
   ─────────────────────────────────────────────────────────────────────────── */
html body main.center-panel .cards-grid {
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 12px;
}

html body main.center-panel .card {
  padding: 16px 18px;
  background: var(--lab-surface);
  -webkit-backdrop-filter: var(--lab-blur);
  backdrop-filter: var(--lab-blur);
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius);
  box-shadow: var(--lab-shadow);
  transition: transform .22s var(--lab-ease), box-shadow .22s var(--lab-ease), border-color .22s var(--lab-ease);
}
html body main.center-panel .card::before { display: none; }
html body main.center-panel .card::after {
  height: 1px;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--lab-primary-2) 55%, transparent), transparent);
  opacity: .6;
}
html body main.center-panel .card:hover {
  transform: translateY(-2px);
  border-color: var(--ctr-accent-line) !important;
  box-shadow: var(--lab-shadow-hi);
}
html body main.center-panel .card:hover::after { opacity: .9; }

html body main.center-panel .card-title {
  font-family: var(--lab-font);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .05em;
  color: var(--lab-text-2);
  margin-bottom: 10px;
}
html body main.center-panel .card-val {
  font-family: var(--lab-font);
  font-size: 30px;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--lab-text);
  font-variant-numeric: tabular-nums;
}
html body main.center-panel .card-sub {
  font-family: var(--lab-font);
  font-size: 12.5px;
  color: var(--lab-text-2);
  opacity: .85;
  margin-top: 8px;
}
/* cartes VALIDÉES / PRÉ-PRINTS : accent conservé (vert / cyan) */
html body main.center-panel .card[style*="48,209,88"]  { border-top: 2px solid var(--lab-green) !important; }
html body main.center-panel .card[style*="0,229,255"]  { border-top: 2px solid var(--lab-cyan) !important; }
html body main.center-panel .card .card-title[style*="color"] { opacity: 1; }

/* Blocs de section (inline background:rgba(0,0,0,.45)) → panneaux verre */
html body main.center-panel #tab-dashboard > div[style] {
  margin-top: 14px !important;
  padding: 16px 18px !important;
  background: var(--lab-surface) !important;
  -webkit-backdrop-filter: var(--lab-blur);
  backdrop-filter: var(--lab-blur);
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius) !important;
  box-shadow: var(--lab-shadow);
}

/* Répartition par domaine */
html body main.center-panel .dom-stats {
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 10px;
  margin-top: 14px;
}
html body main.center-panel .dom-card {
  padding: 14px 12px;
  background: var(--lab-surface-2);
  border: 1px solid var(--lab-line);
  border-top-width: 2px;
  border-radius: var(--lab-radius-sm);
  transition: transform .2s var(--lab-ease), border-color .2s var(--lab-ease);
}
html body main.center-panel .dom-card:hover { transform: translateY(-2px); filter: none; border-color: var(--lab-line-2); }
html body main.center-panel .dom-card-med     { border-top-color: var(--lab-cyan); }
html body main.center-panel .dom-card-cyber   { border-top-color: var(--lab-red); }
html body main.center-panel .dom-card-tech    { border-top-color: var(--lab-amber); }
html body main.center-panel .dom-card-physics { border-top-color: var(--lab-green); }
html body main.center-panel .dom-card:hover.dom-card-med     { border-top-color: var(--lab-cyan); }
html body main.center-panel .dom-card:hover.dom-card-cyber   { border-top-color: var(--lab-red); }
html body main.center-panel .dom-card:hover.dom-card-tech    { border-top-color: var(--lab-amber); }
html body main.center-panel .dom-card:hover.dom-card-physics { border-top-color: var(--lab-green); }
html body main.center-panel .dom-val {
  font-family: var(--lab-font);
  font-size: 26px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
html body main.center-panel .dom-label {
  font-family: var(--lab-font);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .03em;
  margin-top: 6px;
}

/* Top concepts (lignes générées par loadStats) */
html body main.center-panel #top-concepts > div {
  gap: 12px !important;
  padding: 7px 4px !important;
  border-bottom: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius-xs);
  transition: background-color .15s;
}
html body main.center-panel #top-concepts > div:last-child { border-bottom: 0 !important; }
html body main.center-panel #top-concepts > div:hover { background: var(--ctr-hover); }
html body main.center-panel #top-concepts > div > div:first-child {
  height: 4px !important;
  border-radius: var(--ctr-pill) !important;
  opacity: .85;
}
html body main.center-panel #top-concepts > div > span:nth-of-type(1) {
  font-size: 13px !important;
  color: var(--lab-text) !important;
}
html body main.center-panel #top-concepts > div > span:nth-of-type(2) {
  font-family: var(--lab-mono) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  font-variant-numeric: tabular-nums;
}

/* Clusters */
html body main.center-panel #clusters-display { display: flex; flex-wrap: wrap; gap: 6px; }
html body main.center-panel #clusters-display .badge {
  margin: 0;
  background: var(--lab-surface-2) !important;
  border-color: var(--lab-line-2) !important;
  font-variant-numeric: tabular-nums;
}

/* Graphique d'activité */
html body main.center-panel #activityCanvas { border-radius: var(--lab-radius-xs); }
html body main.center-panel #activity-legend {
  gap: 16px !important;
  margin-top: 10px !important;
  font-size: 12px !important;
  color: var(--lab-text-2) !important;
}


/* ───────────────────────────────────────────────────────────────────────────
   9. GRAPHE DE CONNAISSANCES + RÉSEAU
   ─────────────────────────────────────────────────────────────────────────── */
html body main.center-panel .graph-controls {
  gap: 6px;
  margin: 12px 0;
  padding: 8px;
  background: var(--lab-surface);
  -webkit-backdrop-filter: var(--lab-blur);
  backdrop-filter: var(--lab-blur);
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius);
}
html body main.center-panel .graph-controls > span {
  font-family: var(--lab-mono) !important;
  font-size: 12px !important;
  color: var(--lab-muted) !important;
  margin-left: auto !important;
  padding: 0 6px;
  font-variant-numeric: tabular-nums;
}
html body main.center-panel .graph-controls > span span { color: var(--lab-text); font-weight: 600; }

html body main.center-panel .graph-search {
  min-height: 34px;
  max-width: 220px;
  padding: 6px 12px;
  font-family: var(--lab-font);
  font-size: 12.5px;
  letter-spacing: 0;
  color: var(--lab-text);
  background: var(--lab-bg-2);
  border: 1px solid var(--lab-line-2);
  border-radius: var(--lab-radius-sm);
  transition: border-color .18s var(--lab-ease), box-shadow .18s var(--lab-ease);
}
html body main.center-panel .graph-search::placeholder { color: var(--lab-muted); }
html body main.center-panel .graph-search:focus {
  border-color: var(--lab-primary);
  box-shadow: 0 0 0 3px var(--ctr-accent-soft);
}

/* Canvas : pas d'!important (le plein écran pose ses styles en inline) */
html body main.center-panel #graphCanvas {
  background:
    radial-gradient(ellipse at 50% 40%, color-mix(in srgb, var(--lab-primary) 7%, transparent), transparent 65%),
    var(--lab-bg-2);
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius);
  box-shadow: var(--lab-shadow);
}
html body main.center-panel #graphCanvas:hover {
  box-shadow: var(--lab-shadow-hi);
}

html body main.center-panel .graph-legend {
  gap: 8px;
  margin-top: 12px;
  font-family: var(--lab-font);
  font-size: 12px;
  color: var(--lab-text-2);
  align-items: center;
}
html body main.center-panel .legend-item {
  gap: 7px;
  padding: 4px 10px;
  background: var(--lab-surface-2);
  border: 1px solid var(--lab-line);
  border-radius: var(--ctr-pill);
  margin-left: 0 !important;
}
html body main.center-panel .legend-item span { color: var(--lab-text-2) !important; }
html body main.center-panel .legend-dot { width: 8px; height: 8px; }
html body main.center-panel #graph-legend > div:last-child:not(.legend-item) {
  margin-left: auto !important;
  font-size: 12px !important;
  color: var(--lab-muted) !important;
}

/* Réseau des rapports */
html body main.center-panel #networkCanvas {
  background:
    radial-gradient(ellipse at 50% 40%, color-mix(in srgb, var(--lab-violet) 6%, transparent), transparent 65%),
    var(--lab-bg-2) !important;
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius) !important;
  box-shadow: var(--lab-shadow);
}
html body main.center-panel #network-info { color: var(--lab-muted) !important; }
/* infobulle (position/display gérés par JS → non touchés) */
html body main.center-panel #network-tooltip {
  padding: 10px 12px !important;
  font-family: var(--lab-font) !important;
  font-size: 12.5px !important;
  line-height: 1.5;
  color: var(--lab-text) !important;
  background: var(--lab-surface-solid) !important;
  border: 1px solid var(--lab-line-2) !important;
  border-radius: var(--lab-radius-sm) !important;
  box-shadow: var(--lab-shadow-hi);
}


/* ───────────────────────────────────────────────────────────────────────────
   10. RAPPORTS — en-tête, filtres, onglets domaine, liste, pagination
   ─────────────────────────────────────────────────────────────────────────── */
/* libellé « CONFIANCE ≥ » + select */
html body main.center-panel #tab-reports label {
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: .05em !important;
  color: var(--lab-muted) !important;
}

/* selects inline (rapports, comparaison) */
html body main.center-panel #conf-filter,
html body main.center-panel #compare-file-a,
html body main.center-panel #compare-file-b,
html body main.center-panel .search-scope {
  min-height: 34px;
  padding: 6px 30px 6px 11px !important;
  font-family: var(--lab-font) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  color: var(--lab-text) !important;
  background-color: var(--lab-bg-2) !important;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--lab-muted) 50%),
    linear-gradient(135deg, var(--lab-muted) 50%, transparent 50%) !important;
  background-position: calc(100% - 15px) 52%, calc(100% - 10px) 52% !important;
  background-size: 5px 5px, 5px 5px !important;
  background-repeat: no-repeat !important;
  border: 1px solid var(--lab-line-2) !important;
  border-radius: var(--lab-radius-sm) !important;
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
  transition: border-color .18s var(--lab-ease), box-shadow .18s var(--lab-ease);
}
html body main.center-panel #conf-filter:focus,
html body main.center-panel #compare-file-a:focus,
html body main.center-panel #compare-file-b:focus,
html body main.center-panel .search-scope:focus {
  border-color: var(--lab-primary) !important;
  box-shadow: 0 0 0 3px var(--ctr-accent-soft);
  outline: none;
}
html body main.center-panel select option {
  background: var(--lab-surface-solid);
  color: var(--lab-text);
}

html body main.center-panel #tab-reports .util-btn { flex: 0 0 auto; }

/* Onglets de domaine */
html body main.center-panel .report-domain-tabs {
  gap: 6px;
  margin: 14px 0 16px;
  align-items: center;
}
html body main.center-panel .report-dtab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 6px 13px !important;
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: .03em !important;
  color: var(--lab-text-2) !important;
  background: var(--lab-surface-2) !important;
  border: 1px solid var(--lab-line-2) !important;
  border-radius: var(--ctr-pill) !important;
  text-shadow: none !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
  animation: none !important;
  cursor: pointer;
  transition: background-color .18s var(--lab-ease), border-color .18s var(--lab-ease), color .18s var(--lab-ease);
}
html body main.center-panel .report-dtab:hover {
  color: var(--lab-text) !important;
  background: var(--ctr-hover) !important;
  border-color: var(--lab-line-2) !important;
}
html body main.center-panel .report-dtab.active {
  color: var(--lab-text) !important;
  background: var(--ctr-accent-soft) !important;
  border-color: var(--ctr-accent-line) !important;
}
html body main.center-panel .report-dtab-med.active     { background: var(--ctr-cyan-soft) !important;   border-color: var(--ctr-cyan-line) !important; }
html body main.center-panel .report-dtab-cyber.active   { background: var(--ctr-err-soft) !important;    border-color: var(--ctr-err-line) !important; }
html body main.center-panel .report-dtab-tech.active    { background: var(--ctr-warn-soft) !important;   border-color: var(--ctr-warn-line) !important; }
html body main.center-panel .report-dtab-physics.active { background: var(--ctr-ok-soft) !important;     border-color: var(--ctr-ok-line) !important; }
/* CONVERGENCE : accent violet sobre (plus de pulsation dorée) */
html body main.center-panel .report-dtab.report-dtab-cross {
  color: var(--lab-violet) !important;
  background: var(--ctr-violet-soft) !important;
  border-color: var(--ctr-violet-line) !important;
}
html body main.center-panel .report-dtab.report-dtab-cross:hover,
html body main.center-panel .report-dtab.report-dtab-cross.active {
  color: var(--lab-text) !important;
  background: color-mix(in srgb, var(--lab-violet) 22%, transparent) !important;
  border-color: var(--lab-violet) !important;
}

/* compteur dans l'onglet */
html body main.center-panel .rdc-badge {
  display: inline-block;
  min-width: 20px;
  margin-left: 2px;
  padding: 0 7px;
  font-family: var(--lab-font);
  font-size: 11px;
  font-weight: 700;
  line-height: 18px;
  text-align: center;
  color: var(--lab-text);
  background: color-mix(in srgb, var(--lab-text) 10%, transparent);
  border-radius: var(--ctr-pill);
  font-variant-numeric: tabular-nums;
}
html body main.center-panel .rdc-badge:empty { display: none; }

/* Boutons d'admin inline : 🌉 GÉNÉRER CONVERGENCE / 🧹 NETTOYER DOUBLONS */
html body main.center-panel .report-domain-tabs > button[onclick^="generateConvergence"],
html body main.center-panel .report-domain-tabs > button[onclick^="cleanupDuplicates"],
html body main.center-panel .report-domain-tabs > button[onclick^="testAdvisorKeys"] {
  min-height: 34px;
  padding: 6px 14px !important;
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .03em !important;
  border-radius: var(--lab-radius-sm) !important;
  text-shadow: none !important;
  box-shadow: none !important;
  transition: background-color .18s var(--lab-ease), border-color .18s var(--lab-ease), transform .18s var(--lab-ease);
}
html body main.center-panel .report-domain-tabs > button[onclick^="generateConvergence"] {
  color: var(--lab-violet) !important;
  background: var(--ctr-violet-soft) !important;
  border: 1px solid var(--ctr-violet-line) !important;
}
html body main.center-panel .report-domain-tabs > button[onclick^="cleanupDuplicates"] {
  color: var(--lab-amber) !important;
  background: var(--ctr-warn-soft) !important;
  border: 1px solid var(--ctr-warn-line) !important;
}
html body main.center-panel .report-domain-tabs > button[onclick^="testAdvisorKeys"] {
  color: var(--lab-green) !important;
  background: var(--ctr-ok-soft) !important;
  border: 1px solid var(--ctr-ok-line) !important;
}
html body main.center-panel .report-domain-tabs > button[onclick^="generateConvergence"]:hover,
html body main.center-panel .report-domain-tabs > button[onclick^="cleanupDuplicates"]:hover,
html body main.center-panel .report-domain-tabs > button[onclick^="testAdvisorKeys"]:hover {
  transform: translateY(-1px);
  filter: brightness(1.15);
}

/* Barre d'info « N rapport(s) · page x/y » + pagination */
html body main.center-panel #reports-container > div[style*="space-between"] {
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 12px !important;
  padding: 8px 12px !important;
  font-size: 12.5px !important;
  color: var(--lab-muted) !important;
  background: var(--lab-surface) !important;
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius-sm) !important;
}
/* pastille « 🆕 N NOUVEAUX » */
html body main.center-panel #reports-container span[style*="background:#30d158"] {
  padding: 2px 9px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  color: var(--lab-bg) !important;
  background: var(--lab-green) !important;
  border-radius: var(--ctr-pill) !important;
}
html body main.center-panel .reports-pagination { gap: 4px; }
html body main.center-panel #reports-pagination-bot { justify-content: center; margin-top: 14px; }
html body main.center-panel .rpag-btn {
  min-width: 32px;
  height: 30px;
  padding: 0 10px;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  border-radius: var(--lab-radius-xs);
}
html body main.center-panel .rpag-btn.rpag-active {
  color: #fff !important;
  background: var(--lab-primary) !important;
  border-color: var(--lab-primary) !important;
}
html body main.center-panel .rpag-btn.rpag-nav { padding: 0 12px; }
html body main.center-panel .rpag-ellipsis {
  font-family: var(--lab-font);
  color: var(--lab-muted);
}

/* Carte rapport */
html body main.center-panel .report-item {
  position: relative;
  margin-bottom: 10px;
  padding: 14px 16px 14px 18px;
  background: var(--lab-surface) !important;
  -webkit-backdrop-filter: var(--lab-blur);
  backdrop-filter: var(--lab-blur);
  border: 1px solid var(--lab-line) !important;
  border-left: 3px solid var(--lab-line-2) !important;
  border-radius: var(--lab-radius) !important;
  box-shadow: var(--lab-shadow) !important;
  transition: border-color .2s var(--lab-ease), box-shadow .2s var(--lab-ease), transform .2s var(--lab-ease);
}
html body main.center-panel .report-item:hover {
  border-color: var(--lab-line-2) !important;
  box-shadow: var(--lab-shadow-hi) !important;
}
html body main.center-panel .report-item.dom-medical { border-left-color: var(--lab-cyan) !important; }
html body main.center-panel .report-item.dom-cyber   { border-left-color: var(--lab-red) !important; }
html body main.center-panel .report-item.dom-tech    { border-left-color: var(--lab-amber) !important; }
html body main.center-panel .report-item.dom-physics { border-left-color: var(--lab-green) !important; }
html body main.center-panel .report-item.dom-cross {
  border-left-color: var(--lab-violet) !important;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--lab-violet) 8%, transparent), transparent 55%),
    var(--lab-surface) !important;
}
/* non lu : halo bleu discret (la classe .dot-unread disparaît à la lecture) */
html body main.center-panel .report-item:has(.dot-unread) {
  border-top-color: var(--ctr-accent-line) !important;
  border-right-color: var(--ctr-accent-line) !important;
  border-bottom-color: var(--ctr-accent-line) !important;
  box-shadow: var(--lab-shadow-hi) !important;
}

html body main.center-panel .report-header { gap: 12px; }
html body main.center-panel .report-title {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-bottom: 6px;
  font-size: 14.5px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--lab-text);
}
html body main.center-panel .rpt-title-text { margin-left: 2px !important; }
html body main.center-panel .report-meta {
  font-family: var(--lab-mono);
  font-size: 12.5px;
  color: var(--lab-text-2);
  letter-spacing: 0;
  word-break: break-all;
}
/* aperçu / résumé */
html body main.center-panel .report-item .report-header div[style*="Share Tech Mono"] {
  margin-top: 8px !important;
  font-family: var(--lab-font) !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
  color: var(--lab-text-2) !important;
}

/* badge domaine */
html body main.center-panel .report-domain-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-right: 0;
  padding: 2px 9px !important;
  font-family: var(--lab-font);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .04em;
  line-height: 1.6;
  border-radius: var(--ctr-pill);
}
html body main.center-panel .rdb-medical { color: var(--lab-cyan);  background: var(--ctr-cyan-soft); border: 1px solid var(--ctr-cyan-line); }
html body main.center-panel .rdb-cyber   { color: var(--lab-red);   background: var(--ctr-err-soft);  border: 1px solid var(--ctr-err-line); }
html body main.center-panel .rdb-tech    { color: var(--lab-amber); background: var(--ctr-warn-soft); border: 1px solid var(--ctr-warn-line); }
html body main.center-panel .rdb-physics { color: var(--lab-green); background: var(--ctr-ok-soft);   border: 1px solid var(--ctr-ok-line); }
html body main.center-panel .rdb-cross {
  color: var(--lab-violet) !important;
  background: var(--ctr-violet-soft) !important;
  border: 1px solid var(--ctr-violet-line) !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

/* ● NON LU */
html body main.center-panel .report-item .badge-new {
  margin-left: 0 !important;
  padding: 2px 9px;
  font-family: var(--lab-font);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--lab-primary-2);
  background: var(--ctr-accent-soft);
  border: 1px solid var(--ctr-accent-line);
  border-radius: var(--ctr-pill);
  box-shadow: none;
}
html body main.center-panel .report-item span.dot-unread:not(.badge-new) {
  background: var(--lab-primary-2) !important;
  box-shadow: 0 0 0 3px var(--ctr-accent-soft) !important;
}

/* actions */
html body main.center-panel .report-actions { gap: 6px; }
html body main.center-panel .dl-btn {
  min-height: 32px;
  padding: 5px 10px;
  font-size: 12px;
  border-radius: var(--lab-radius-xs);
}
html body main.center-panel .dl-btn[onclick^="deleteReport"]:hover {
  color: var(--lab-red) !important;
  background: var(--ctr-err-soft) !important;
  border-color: var(--ctr-err-line) !important;
}
html body main.center-panel .dl-btn.pdf:hover {
  color: var(--lab-text) !important;
}
html body main.center-panel .dl-btn[onclick^="generatePoC"] {
  color: var(--lab-violet) !important;
  border-color: var(--ctr-violet-line) !important;
}
html body main.center-panel .report-toggle {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 12px;
  font-family: var(--lab-font);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--lab-primary-2);
  background: var(--ctr-accent-soft);
  border: 1px solid var(--ctr-accent-line);
  border-radius: var(--ctr-pill);
  transition: background-color .18s var(--lab-ease), color .18s var(--lab-ease);
}
html body main.center-panel .report-toggle:hover {
  color: var(--lab-text);
  background: color-mix(in srgb, var(--lab-primary) 24%, transparent);
}

/* Corps du rapport (markdown rendu) */
html body main.center-panel .report-body {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--lab-line);
}
html body main.center-panel .report-content {
  padding: 18px 22px;
  font-family: var(--lab-font);
  font-size: 14px;
  line-height: 1.72;
  color: var(--lab-text-2);
  background: color-mix(in srgb, var(--lab-bg) 70%, transparent);
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius-sm);
  scrollbar-width: thin;
  scrollbar-color: var(--lab-line-2) transparent;
}
html body main.center-panel .report-content .md-p  { margin: 0 0 10px; }
html body main.center-panel .report-content .md-h1 {
  font-family: var(--lab-font);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -.01em;
  color: var(--lab-text);
  margin: 18px 0 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--lab-line-2);
}
html body main.center-panel .report-content .md-h2 {
  font-family: var(--lab-font);
  font-size: 15.5px;
  font-weight: 700;
  letter-spacing: 0;
  color: var(--lab-text);
  margin: 16px 0 8px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--lab-line);
}
html body main.center-panel .report-content .md-h3 {
  font-family: var(--lab-font);
  font-size: 13.5px;
  font-weight: 700;
  letter-spacing: .02em;
  color: var(--lab-primary-2);
  margin: 14px 0 6px;
}
html body main.center-panel .report-content .md-h4 {
  font-family: var(--lab-font);
  font-size: 13px;
  font-weight: 600;
  color: var(--lab-muted);
  letter-spacing: .02em;
}
html body main.center-panel .report-content .md-hr { border-top: 1px solid var(--lab-line-2); opacity: 1; margin: 14px 0; }
html body main.center-panel .report-content .md-ul { margin: 4px 0 10px 4px; }
html body main.center-panel .report-content .md-li { padding-left: 16px; margin: 3px 0; }
html body main.center-panel .report-content .md-li::before {
  content: '';
  top: .7em;
  width: 5px; height: 5px;
  border-radius: 50%;
  background: var(--lab-primary-2);
  opacity: .9;
}
html body main.center-panel .report-content .md-code {
  font-family: var(--lab-mono);
  font-size: 12.5px;
  padding: 1px 6px;
  color: var(--lab-teal);
  background: color-mix(in srgb, var(--lab-teal) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--lab-teal) 22%, transparent);
  border-radius: var(--lab-radius-xs);
}
html body main.center-panel .report-content .md-pre {
  font-family: var(--lab-mono);
  font-size: 12.5px;
  line-height: 1.6;
  padding: 12px 14px;
  color: var(--lab-text-2);
  background: var(--lab-bg);
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius-sm);
}
html body main.center-panel .report-content .md-table {
  font-size: 13px;
  margin: 10px 0 14px;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--lab-line-2);
  border-radius: var(--lab-radius-sm);
  overflow: hidden;
}
html body main.center-panel .report-content .md-table th {
  font-family: var(--lab-font);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .03em;
  color: var(--lab-text);
  background: var(--lab-surface-3);
  border: 0;
  border-bottom: 1px solid var(--lab-line-2);
  padding: 9px 12px;
}
html body main.center-panel .report-content .md-table td {
  padding: 8px 12px;
  color: var(--lab-text-2);
  border: 0;
  border-bottom: 1px solid var(--lab-line);
}
html body main.center-panel .report-content .md-table tr:last-child td { border-bottom: 0; }
html body main.center-panel .report-content .md-table tr:nth-child(even) td { background: color-mix(in srgb, var(--lab-text) 2.5%, transparent); }
html body main.center-panel .report-content .md-table tr:hover td { background: var(--ctr-accent-soft); }
html body main.center-panel .report-content .md-table td strong,
html body main.center-panel .report-content strong { color: var(--lab-text); }
html body main.center-panel .report-content .md-link {
  color: var(--lab-primary-2);
  border-bottom: 1px solid var(--ctr-accent-line);
}
html body main.center-panel .report-content .md-link:hover {
  color: var(--lab-text);
  border-bottom-color: var(--lab-primary-2);
}


/* ───────────────────────────────────────────────────────────────────────────
   11. RECHERCHE FULL-TEXT
   ─────────────────────────────────────────────────────────────────────────── */
html body main.center-panel .search-bar {
  gap: 8px;
  margin-bottom: 16px;
  padding: 8px;
  background: var(--lab-surface);
  -webkit-backdrop-filter: var(--lab-blur);
  backdrop-filter: var(--lab-blur);
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius);
  box-shadow: var(--lab-shadow);
}
html body main.center-panel .search-input {
  min-height: 42px;
  padding: 10px 14px;
  font-family: var(--lab-font);
  font-size: 14px;
  color: var(--lab-text);
  background: var(--lab-bg-2);
  border: 1px solid var(--lab-line-2);
  border-radius: var(--lab-radius-sm);
  transition: border-color .18s var(--lab-ease), box-shadow .18s var(--lab-ease);
}
html body main.center-panel .search-input::placeholder { color: var(--lab-muted); }
html body main.center-panel .search-input:focus {
  border-color: var(--lab-primary);
  box-shadow: 0 0 0 3px var(--ctr-accent-soft);
}
html body main.center-panel .search-scope { min-height: 42px; }
html body main.center-panel .search-btn {
  min-height: 42px;
  padding: 0 18px;
  font-family: var(--lab-font);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .04em;
  color: #fff;
  background: linear-gradient(180deg, var(--lab-primary-2), var(--lab-primary));
  border: 1px solid color-mix(in srgb, var(--lab-primary-2) 70%, transparent);
  border-radius: var(--lab-radius-sm);
  clip-path: none;
  box-shadow: 0 10px 24px -14px var(--lab-primary), 0 1px 0 rgba(255,255,255,.18) inset;
  transition: filter .18s var(--lab-ease), transform .18s var(--lab-ease);
}
html body main.center-panel .search-btn:hover {
  background: linear-gradient(180deg, var(--lab-primary-2), var(--lab-primary));
  filter: brightness(1.08);
  transform: translateY(-1px);
  box-shadow: 0 10px 24px -12px var(--lab-primary), 0 1px 0 rgba(255,255,255,.18) inset;
}

html body main.center-panel .search-results { margin-top: 4px; }
/* ligne « N résultat(s) pour … » */
html body main.center-panel #search-results > div:not(.search-result-item) {
  margin-bottom: 10px !important;
  font-size: 12.5px !important;
  color: var(--lab-muted) !important;
}
html body main.center-panel #search-results > div:not(.search-result-item) span { color: var(--lab-primary-2) !important; font-weight: 600; }

html body main.center-panel .search-result-item {
  margin-bottom: 8px;
  padding: 12px 14px;
  background: var(--lab-surface);
  -webkit-backdrop-filter: var(--lab-blur);
  backdrop-filter: var(--lab-blur);
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius-sm);
  box-shadow: var(--lab-shadow);
  transition: border-color .18s var(--lab-ease), transform .18s var(--lab-ease), box-shadow .18s var(--lab-ease);
}
html body main.center-panel .search-result-item:hover {
  border-color: var(--ctr-accent-line);
  box-shadow: var(--lab-shadow-hi);
  transform: translateY(-1px);
}
html body main.center-panel .search-result-item > div:first-child {
  gap: 8px !important;
  margin-bottom: 6px !important;
}
html body main.center-panel .search-result-item > div:first-child > span:not(.sr-type) {
  font-size: 12px !important;
  font-weight: 600;
}
html body main.center-panel .search-result-item > div:first-child > span[style*="margin-left:auto"] {
  font-family: var(--lab-mono);
  font-size: 12px !important;
  font-weight: 400;
  color: var(--lab-text-2) !important;
}
html body main.center-panel .sr-type {
  margin-right: 0;
  padding: 2px 9px;
  font-family: var(--lab-font);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .04em;
  border-radius: var(--ctr-pill);
  border: 1px solid transparent;
}
html body main.center-panel .sr-type-concept { color: var(--lab-cyan);  background: var(--ctr-cyan-soft); border-color: var(--ctr-cyan-line); }
html body main.center-panel .sr-type-edge    { color: var(--lab-amber); background: var(--ctr-warn-soft); border-color: var(--ctr-warn-line); }
html body main.center-panel .sr-type-report  { color: var(--lab-green); background: var(--ctr-ok-soft);   border-color: var(--ctr-ok-line); }
html body main.center-panel .sr-type-article { color: var(--lab-violet); background: var(--ctr-violet-soft); border-color: var(--ctr-violet-line); }
html body main.center-panel .sr-title {
  font-size: 14.5px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--lab-text);
}
html body main.center-panel .sr-sub {
  margin-top: 4px;
  font-family: var(--lab-font);
  font-size: 12.5px;
  color: var(--lab-muted);
}


/* ───────────────────────────────────────────────────────────────────────────
   12. TIMELINE (lignes générées par loadTimeline)
   ─────────────────────────────────────────────────────────────────────────── */
html body main.center-panel #timeline-container {
  position: relative;
  padding-left: 4px;
}
html body main.center-panel #timeline-container > div {
  position: relative;
  gap: 14px !important;
  margin-bottom: 8px;
  padding: 12px 16px !important;
  background: var(--lab-surface);
  -webkit-backdrop-filter: var(--lab-blur);
  backdrop-filter: var(--lab-blur);
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius-sm);
  box-shadow: var(--lab-shadow);
  transition: border-color .18s var(--lab-ease), transform .18s var(--lab-ease);
}
html body main.center-panel #timeline-container > div:hover {
  border-color: var(--lab-line-2) !important;
  transform: translateX(2px);
}
/* pastille icône + #id */
html body main.center-panel #timeline-container > div > div:first-child {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 46px !important;
  padding: 6px 0;
  background: var(--lab-surface-2);
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius-sm);
}
html body main.center-panel #timeline-container > div > div:first-child > div:last-child {
  font-family: var(--lab-mono);
  font-size: 12px !important;
  color: var(--lab-text-2) !important;
}
/* titre A → C */
html body main.center-panel #timeline-container > div > div:nth-child(2) > div:first-child {
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.4;
  margin-bottom: 4px !important;
}
/* méta */
html body main.center-panel #timeline-container > div > div:nth-child(2) > div:nth-child(2) {
  font-size: 12.5px !important;
  color: var(--lab-muted) !important;
}
html body main.center-panel #timeline-container [onclick^="openReportFromSearch"] {
  color: var(--lab-primary-2) !important;
  font-weight: 600;
  text-decoration: none !important;
  border-bottom: 1px solid var(--ctr-accent-line);
}
html body main.center-panel #timeline-container [onclick^="openReportFromSearch"]:hover {
  color: var(--lab-text) !important;
  border-bottom-color: var(--lab-primary-2);
}


/* ───────────────────────────────────────────────────────────────────────────
   13. COMPARAISON
   ─────────────────────────────────────────────────────────────────────────── */
html body main.center-panel #tab-compare > div[style*="grid"] > div > div:first-child {
  margin-bottom: 6px !important;
  font-size: 12.5px !important;
  font-weight: 700;
  letter-spacing: .05em !important;
  color: var(--lab-text-2) !important;
}
html body main.center-panel #compare-file-a,
html body main.center-panel #compare-file-b { min-height: 38px; }

html body main.center-panel #compare-result > div {
  padding: 18px 20px !important;
  font-size: 13px !important;
  line-height: 1.6;
  background: var(--lab-surface) !important;
  -webkit-backdrop-filter: var(--lab-blur);
  backdrop-filter: var(--lab-blur);
  border: 1px solid var(--lab-line-2) !important;
  border-radius: var(--lab-radius) !important;
  box-shadow: var(--lab-shadow);
}
/* score % */
html body main.center-panel #compare-result > div > div:first-child > div:first-child {
  font-size: 32px !important;
  letter-spacing: -.02em !important;
}
html body main.center-panel #compare-result > div > div:first-child {
  padding-bottom: 14px;
  border-bottom: 1px solid var(--lab-line);
  margin-bottom: 14px !important;
}
html body main.center-panel #compare-result > div > div:first-child > div:last-child { color: var(--lab-text-2); }
/* listes SIMILITUDES / SYNERGIES / CONTRADICTIONS */
html body main.center-panel #compare-result > div > div:not(:first-child) > div:first-child {
  font-weight: 700;
  letter-spacing: .06em;
  margin-bottom: 6px !important;
}
html body main.center-panel #compare-result > div > div:not(:first-child) > div:not(:first-child) {
  color: var(--lab-text-2) !important;
  padding: 2px 0 !important;
}
/* 🧬 HYPOTHÈSE COMBINÉE */
html body main.center-panel #compare-result div[style*="border-left:3px solid var(--active)"] {
  padding: 14px 16px !important;
  background: var(--ctr-accent-soft) !important;
  border-left: 3px solid var(--lab-primary) !important;
  border-radius: 0 var(--lab-radius-sm) var(--lab-radius-sm) 0 !important;
}
html body main.center-panel #compare-result div[style*="border-left:3px solid var(--active)"] > div:first-child {
  color: var(--lab-primary-2) !important;
}
html body main.center-panel #compare-result div[style*="border-left:3px solid var(--active)"] > div:last-child {
  color: var(--lab-text) !important;
}


/* ───────────────────────────────────────────────────────────────────────────
   14. SANTÉ BDD
   ─────────────────────────────────────────────────────────────────────────── */
html body main.center-panel #tab-health > div[style*="display:flex"] {
  padding: 16px 18px;
  background: var(--lab-surface);
  -webkit-backdrop-filter: var(--lab-blur);
  backdrop-filter: var(--lab-blur);
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius);
  box-shadow: var(--lab-shadow);
}
html body main.center-panel #health-score-val {
  font-size: 34px !important;
  font-weight: 700 !important;
  letter-spacing: -.02em !important;
  line-height: 1.1;
}
html body main.center-panel #health-score-val + div {
  font-size: 12.5px !important;
  font-weight: 600;
  letter-spacing: .05em !important;
  color: var(--lab-text-2) !important;
}
html body main.center-panel #health-label {
  display: inline-block;
  margin-top: 8px !important;
  font-size: 12px !important;
  font-weight: 700;
  letter-spacing: .04em !important;
}
html body main.center-panel #health-metrics { gap: 10px !important; }
html body main.center-panel #health-metrics > div {
  padding: 12px 14px !important;
  background: var(--lab-surface-2) !important;
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius-sm) !important;
}
html body main.center-panel #health-metrics > div > div:first-child {
  font-size: 12.5px !important;
  font-weight: 600;
  letter-spacing: .03em !important;
  color: var(--lab-text-2) !important;
}
html body main.center-panel #health-metrics > div > div:last-child {
  margin-top: 4px !important;
  font-size: 20px !important;
}


/* ───────────────────────────────────────────────────────────────────────────
   15. HISTORIQUE DES SESSIONS
   ─────────────────────────────────────────────────────────────────────────── */
html body main.center-panel #history-container > div:first-child:not([style*="border-bottom"]) {
  margin-bottom: 10px !important;
  font-size: 12.5px !important;
  color: var(--lab-muted) !important;
}
html body main.center-panel #history-container > div[style*="border-bottom"] {
  gap: 14px !important;
  margin-bottom: 6px;
  padding: 9px 14px !important;
  font-family: var(--lab-mono) !important;
  font-size: 12.5px !important;
  background: var(--lab-surface);
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius-sm);
  font-variant-numeric: tabular-nums;
  transition: border-color .15s, background-color .15s;
}
html body main.center-panel #history-container > div[style*="border-bottom"]:hover {
  border-color: var(--lab-line-2) !important;
  background: var(--lab-surface-2);
}
html body main.center-panel #history-container > div[style*="border-bottom"] > span:first-child {
  font-family: var(--lab-font);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  font-size: 12.5px;
}


/* ───────────────────────────────────────────────────────────────────────────
   16. RESPONSIVE
   ─────────────────────────────────────────────────────────────────────────── */
@media (max-width: 1100px) {
  html body main.center-panel .tab { padding: 8px 10px; font-size: 11.5px; }
}
@media (max-width: 900px) {
  html body main.center-panel .tab-content { padding: 14px; }
  html body main.center-panel .tab { padding: 7px 10px; font-size: 11.5px; letter-spacing: .02em; }
  html body main.center-panel .card-val { font-size: 26px; }
  html body main.center-panel .card-title { font-size: 11px; }
  html body main.center-panel .report-dtab { font-size: 11.5px !important; padding: 5px 11px !important; }
  html body main.center-panel .report-domain-badge { font-size: 10.5px; }
  html body main.center-panel .graph-btn { padding: 6px 10px; font-size: 11.5px; }
  html body main.center-panel .graph-legend { font-size: 11.5px; }
  html body main.center-panel .console::before { font-size: 11.5px; letter-spacing: 0; }
  html body main.center-panel .section-title { font-size: 11.5px; }
}
@media (max-width: 640px) {
  html body main.center-panel .tab-nav { padding: 6px 8px; }
  html body main.center-panel .tab-content { padding: 10px; }
  html body main.center-panel .cards-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  html body main.center-panel .card { padding: 12px 14px; }
  html body main.center-panel .card-val { font-size: 22px; }
  html body main.center-panel .console::before { padding: 0 120px 0 72px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  html body main.center-panel .log-line { font-size: 12px; padding: 2px 12px; }
  html body main.center-panel .report-header { flex-direction: column; }
  html body main.center-panel #graph-legend > div:last-child:not(.legend-item) { margin-left: 0 !important; }
  html body main.center-panel .graph-controls > span { margin-left: 0 !important; }
  html body main.center-panel .graph-search { max-width: none; flex: 1 1 100%; }
  html body main.center-panel #tab-compare > div[style*="grid"] { grid-template-columns: 1fr !important; }
  html body main.center-panel #health-metrics { grid-template-columns: 1fr 1fr !important; }
  html body main.center-panel #history-container > div[style*="border-bottom"] { flex-wrap: wrap; gap: 6px 12px !important; }
  html body main.center-panel #history-container > div[style*="border-bottom"] > span { min-width: 0 !important; }
}
@media (max-width: 420px) {
  html body main.center-panel .cards-grid { grid-template-columns: 1fr; }
  html body main.center-panel .tab { padding: 7px 9px; font-size: 11px; }
}


/* ═══════════════════════════════════════════════════════════════════════════
   17. COUCHE « SIGNATURE » — identité Laboratoire moderne
       instrument de mesure (console), fiches de pré-print (résultats/rapports),
       repères de cadrage (cartes), papier millimétré (console / graphe),
       états vides illustrés, micro-interactions.
       Placée en fin de fichier : elle affine les sections précédentes.
   ═══════════════════════════════════════════════════════════════════════════ */
html body main.center-panel {
  /* typo « revue scientifique » pour les titres de pré-prints */
  --ctr-serif: var(--lab-serif);
  /* papier millimétré très discret */
  --ctr-grid: color-mix(in srgb, var(--lab-primary-2) 5%, transparent);
  --ctr-grid-strong: color-mix(in srgb, var(--lab-primary-2) 8%, transparent);
  /* repères de cadrage (coins) */
  --ctr-tick: color-mix(in srgb, var(--lab-primary-2) 55%, transparent);
}

/* ── 17.1 Onglets : rail segmenté + soulignement « lumière » ─────────────── */
html body main.center-panel .tab.active::after {
  background: linear-gradient(90deg, transparent, var(--lab-primary-2), transparent);
  height: 2px;
  bottom: 2px;
  animation: ctr-tab-line .35s var(--lab-ease);
}
@keyframes ctr-tab-line {
  from { transform: scaleX(.2); opacity: 0; }
  to   { transform: scaleX(1);  opacity: .9; }
}
html body main.center-panel .tab:active { transform: translateY(1px); }

/* ── 17.2 Console = afficheur d'instrument ───────────────────────────────── */
/* en-tête : un voyant « en service » (teal) + deux témoins éteints */
html body main.center-panel .console::before {
  background:
    radial-gradient(circle at 20px 50%, var(--lab-teal) 0 4px, color-mix(in srgb, var(--lab-teal) 30%, transparent) 5px, transparent 9px),
    radial-gradient(circle at 38px 50%, color-mix(in srgb, var(--lab-muted) 45%, transparent) 0 3.5px, transparent 4.2px),
    radial-gradient(circle at 54px 50%, color-mix(in srgb, var(--lab-muted) 45%, transparent) 0 3.5px, transparent 4.2px),
    linear-gradient(180deg, color-mix(in srgb, var(--lab-surface-3) 85%, transparent), color-mix(in srgb, var(--lab-surface-solid) 90%, transparent));
  color: var(--lab-text-2);
  font-size: 12.5px;
}
/* liseré lumineux sous l'en-tête, qui « respire » lentement */
html body main.center-panel .console::after {
  top: 40px;
  height: 1px;
  opacity: 1;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--lab-teal) 55%, transparent), transparent);
  animation: ctr-breathe 4.5s ease-in-out infinite;
}
@keyframes ctr-breathe {
  0%, 100% { opacity: .35; }
  50%      { opacity: 1; }
}

/* zone de lecture : papier millimétré discret */
html body main.center-panel .console-body,
html body main.center-panel #sys-logs {
  background-color: var(--ctr-console-bg);
  background-image:
    linear-gradient(var(--ctr-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--ctr-grid) 1px, transparent 1px);
  background-size: 22px 22px;
  background-position: -1px -1px;
}

/* numérotation des lignes (style relevé d'instrument) — invite conservée */
html body main.center-panel .console-body,
html body main.center-panel #sys-logs { counter-reset: ctr-line; }
html body main.center-panel .log-line { counter-increment: ctr-line; }
html body main.center-panel .log-line::before {
  content: counter(ctr-line, decimal-leading-zero) "  root@sci:~$ ";
  color: color-mix(in srgb, var(--lab-teal) 75%, var(--lab-text-2));
  font-variant-numeric: tabular-nums;
}
html body main.center-panel .log-line.dim::before {
  content: counter(ctr-line, decimal-leading-zero) "  root@sci:~$ ";
  color: var(--lab-muted);
}
/* lignes « dim » : lisibles (pas de gris éteint) */
html body main.center-panel .log-line.dim { color: var(--lab-text-2); opacity: .82; }
html body main.center-panel .log-line.dim.error { opacity: 1; }
/* nouvelle ligne : bref surlignage puis fondu */
html body main.center-panel .console-body > .log-line:last-child {
  background: linear-gradient(90deg, color-mix(in srgb, var(--lab-primary) 10%, transparent), transparent 70%);
}
html body main.center-panel .log-line.error:hover { background: color-mix(in srgb, var(--lab-red) 11%, transparent); }

/* chips de filtre : témoin coloré devant le libellé */
html body main.center-panel .cf-btn::before {
  content: '';
  display: inline-block;
  width: 6px; height: 6px;
  margin-right: 6px;
  border-radius: 50%;
  vertical-align: 1px;
  background: currentColor;
  opacity: .45;
}
html body main.center-panel .cf-btn.active::before { opacity: 1; box-shadow: 0 0 0 2px color-mix(in srgb, currentColor 22%, transparent); }
html body main.center-panel .cf-btn:active,
html body main.center-panel .cf-action:active { transform: scale(.96); }

/* ── 17.3 Fiche résultat = carte de pré-print ────────────────────────────── */
/* masthead « RÉSULTAT [DOMAINE] » : ligne de revue, en mono */
html body main.center-panel #result-display > div > div:first-child {
  font-family: var(--lab-mono) !important;
  font-size: 12.5px !important;
  font-weight: 600;
  letter-spacing: .04em !important;
  display: flex;
  align-items: center;
  gap: 10px;
}
html body main.center-panel #result-display > div > div:first-child::after {
  content: '';
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, var(--lab-line-2), transparent);
}
html body main.center-panel #result-display > div > div:first-child { border-bottom: 0; padding-bottom: 4px; }

/* numérotation des pré-prints « № 01 » */
html body main.center-panel #result-display > div { counter-reset: ctr-pp; }
html body main.center-panel #result-display > div > div:has(> .badge) {
  position: relative;
  counter-increment: ctr-pp;
  padding: 14px 64px 14px 16px !important;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--lab-text) 2.5%, transparent), transparent 60%),
    var(--lab-surface-2);
}
html body main.center-panel #result-display > div > div:has(> .badge)::after {
  content: '№ ' counter(ctr-pp, decimal-leading-zero);
  position: absolute;
  top: 12px; right: 14px;
  font-family: var(--lab-mono);
  font-size: 12px;
  font-weight: 600;
  color: var(--lab-muted);
  font-variant-numeric: tabular-nums;
}
/* titre du pré-print : typographie de revue */
html body main.center-panel #result-display > div > div:has(> .badge):has(> div) > b {
  flex-basis: 100%;
  order: 2;
  font-family: var(--ctr-serif);
  font-size: 16.5px;
  font-weight: 600;
  line-height: 1.38;
  letter-spacing: .002em;
  color: var(--lab-text);
}
/* label « 💊 PRÉ-PRINT » : étiquette de rubrique en haut */
html body main.center-panel #result-display > div > div:has(> .badge):has(> div) > .badge { order: 1; margin: 0; }
/* ligne méta « relation | ✓ NOUVEAUTÉ ABSOLUE » façon DOI */
html body main.center-panel #result-display > div > div:has(> .badge):has(> div) > div {
  order: 3;
  margin-top: 4px !important;
  padding-top: 8px;
  border-top: 1px dashed var(--lab-line-2);
  font-family: var(--lab-mono);
  font-size: 12.5px;
  color: var(--lab-text-2) !important;
  line-height: 1.65;
}
/* simulations : concepts en relief, mono pour les mesures */
html body main.center-panel #result-display > div > div:has(> .badge):not(:has(> div)) {
  font-family: var(--lab-mono);
  font-size: 12.5px;
  color: var(--lab-text-2);
}
html body main.center-panel #result-display > div > div:has(> .badge):not(:has(> div)) > b {
  font-family: var(--lab-font);
  font-size: 14px;
}

/* ── 17.4 Rapports : fiche de bibliothèque / revue ───────────────────────── */
html body main.center-panel .rpt-title-text {
  font-family: var(--ctr-serif);
  font-size: 16.5px;
  line-height: 1.38;
  color: var(--lab-text);
  flex-basis: 100%;
  margin-left: 0 !important;
  margin-top: 4px;
}
html body main.center-panel .report-meta {
  display: inline-block;
  margin-top: 2px;
  padding: 3px 9px;
  background: color-mix(in srgb, var(--lab-bg) 55%, transparent);
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius-xs);
}
/* aperçu : extrait façon « abstract » avec filet à gauche */
html body main.center-panel .report-item .report-header div[style*="Share Tech Mono"] {
  padding-left: 12px;
  border-left: 2px solid var(--lab-line-2);
  max-width: 78ch;
}
html body main.center-panel .report-content .md-h1,
html body main.center-panel .report-content .md-h2 {
  font-family: var(--ctr-serif);
  letter-spacing: 0;
}
html body main.center-panel .report-content .md-h1 { font-size: 20px; }
html body main.center-panel .report-content .md-h2 { font-size: 17px; }
html body main.center-panel .report-content { max-width: 100%; }
html body main.center-panel .report-content .md-p,
html body main.center-panel .report-content .md-li { max-width: 80ch; }
html body main.center-panel .rdc-badge { font-size: 11.5px; }

/* ── 17.5 Cartes de mesure : repères de cadrage aux coins ────────────────── */
html body main.center-panel .card,
html body main.center-panel #tab-dashboard > div[style],
html body main.center-panel #health-metrics > div {
  background-image:
    linear-gradient(var(--ctr-tick), var(--ctr-tick)),
    linear-gradient(var(--ctr-tick), var(--ctr-tick)),
    linear-gradient(var(--ctr-tick), var(--ctr-tick)),
    linear-gradient(var(--ctr-tick), var(--ctr-tick)) !important;
  background-size: 10px 1px, 1px 10px, 10px 1px, 1px 10px !important;
  background-position: 8px 8px, 8px 8px, calc(100% - 8px) calc(100% - 8px), calc(100% - 8px) calc(100% - 8px) !important;
  background-repeat: no-repeat !important;
}
html body main.center-panel .card,
html body main.center-panel #tab-dashboard > div[style] { background-color: var(--lab-surface) !important; }
html body main.center-panel #health-metrics > div { background-color: var(--lab-surface-2) !important; }
html body main.center-panel .card-val { font-size: 32px; }
/* « chiffre qui s'allume » au survol */
html body main.center-panel .card:hover .card-val { filter: drop-shadow(0 0 14px color-mix(in srgb, var(--lab-primary) 35%, transparent)); }

/* ── 17.6 Graphe : plan de travail millimétré ────────────────────────────── */
html body main.center-panel #graphCanvas,
html body main.center-panel #networkCanvas {
  background-image:
    linear-gradient(var(--ctr-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--ctr-grid) 1px, transparent 1px),
    linear-gradient(var(--ctr-grid-strong) 1px, transparent 1px),
    linear-gradient(90deg, var(--ctr-grid-strong) 1px, transparent 1px),
    radial-gradient(ellipse at 50% 40%, color-mix(in srgb, var(--lab-primary) 8%, transparent), transparent 65%);
  background-size: 20px 20px, 20px 20px, 100px 100px, 100px 100px, 100% 100%;
  background-color: var(--lab-bg-2);
}

/* ── 17.7 États vides illustrés (anneau pointillé + point central) ───────── */
html body main.center-panel .tab-pane p[style*="color:var(--textdim)"] {
  padding: 30px 20px 24px;
  color: var(--lab-text-2) !important;
  font-size: 13.5px !important;
}
html body main.center-panel .tab-pane p[style*="color:var(--textdim)"]::before {
  content: '';
  display: block;
  width: 34px; height: 34px;
  margin: 0 auto 12px;
  border-radius: 50%;
  border: 1.5px dashed color-mix(in srgb, var(--lab-primary-2) 55%, transparent);
  background: radial-gradient(circle, var(--lab-primary-2) 0 3px, transparent 3.6px);
  animation: ctr-orbit 9s linear infinite;
}
@keyframes ctr-orbit { to { transform: rotate(360deg); } }

/* ── 17.8 Micro-interactions communes ────────────────────────────────────── */
html body main.center-panel .util-btn:active:not(:disabled),
html body main.center-panel .graph-btn:active,
html body main.center-panel .dl-btn:active,
html body main.center-panel .rpag-btn:active:not(:disabled),
html body main.center-panel .report-dtab:active,
html body main.center-panel .auto-btn:active:not(:disabled),
html body main.center-panel .search-btn:active { transform: translateY(0) scale(.97) !important; }
html body main.center-panel .search-result-item:active,
html body main.center-panel .report-item:active { transform: scale(.997); }

/* apparition en cascade des listes générées */
html body main.center-panel .report-item,
html body main.center-panel .search-result-item,
html body main.center-panel #timeline-container > div,
html body main.center-panel #history-container > div[style*="border-bottom"] {
  animation: ctr-rise .38s var(--lab-ease) backwards;
}
html body main.center-panel :is(.report-item, .search-result-item):nth-child(2)  { animation-delay: .03s; }
html body main.center-panel :is(.report-item, .search-result-item):nth-child(3)  { animation-delay: .06s; }
html body main.center-panel :is(.report-item, .search-result-item):nth-child(4)  { animation-delay: .09s; }
html body main.center-panel :is(.report-item, .search-result-item):nth-child(5)  { animation-delay: .12s; }
html body main.center-panel :is(.report-item, .search-result-item):nth-child(n+6){ animation-delay: .15s; }
@keyframes ctr-rise {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: none; }
}

/* timeline : rail vertical reliant les découvertes */
html body main.center-panel #timeline-container::before {
  content: '';
  position: absolute;
  left: 44px; top: 8px; bottom: 8px;
  width: 1px;
  background: linear-gradient(180deg, transparent, var(--lab-line-2) 6%, var(--lab-line-2) 94%, transparent);
}
html body main.center-panel #timeline-container > div > div:first-child { position: relative; z-index: 1; background: var(--lab-surface-solid); }

/* ==== 30-right.css ==== */
/* ══════════════════════════════════════════════════════════════════════════
   SCI-AUTONOME — thème « Laboratoire moderne »
   30-right.css — Sidebar droite + overlays / modales / toasts / boutons flottants
   ──────────────────────────────────────────────────────────────────────────
   Calque d'override pur CSS, chargé APRÈS style.css.
   • Jetons : 00-tokens.css (aucune redéfinition ; variables locales --rgt-*).
   • Toutes les règles sont préfixées `html body` pour battre la spécificité
     des <style> injectés dans le body et, avec !important, les style="" inline.
   • On ne force JAMAIS `display` avec !important (le JS pilote l'affichage
     via style.display) et on ne masque aucun contrôle fonctionnel.
   • Les couleurs « sémantiques » posées par le JS (score santé, bordure
     teintée du domaine, halo audio-réactif) sont volontairement conservées.

   SOMMAIRE
   0.  Variables locales (--rgt-*)
   1.  Sidebar droite : titres de section + polices inline
   2.  Carte DOMAINE ACTIF
   3.  Badge mode d'accès
   4.  LECTEUR SPATIAL (carte, cover, piste, progression, transport, volume)
   5.  Panneau SPATIAL · MASTERING (toggles, sliders, EQ, select)
   6.  Playlist
   7.  SANTÉ BASE
   8.  ACTIVITÉ EN DIRECT
   9.  PROGRESSION (pipeline + phases)
   10. Overlays : base commune (fonds, boîtes, boutons fermer)
   11. Modale Aide (#help-overlay)
   12. Modale Auth, Modale GPU + bannière GPU
   13. Modales JS (stop / info / confirm / test clés / rapport / présentation / PDF)
   14. Toasts, tooltips
   15. Boutons flottants (#btn-toggle-all lune/soleil, #back-to-top)
   16. Focus clavier (accessibilité)
   ══════════════════════════════════════════════════════════════════════════ */


/* ── 0. Variables locales ─────────────────────────────────────────────── */
html body {
  --rgt-card-bg: linear-gradient(180deg, rgba(30, 41, 59, .55) 0%, rgba(17, 24, 39, .62) 100%);
  --rgt-tint-primary: rgba(79, 140, 255, .12);
  --rgt-tint-primary-2: rgba(79, 140, 255, .22);
  --rgt-tint-violet: rgba(167, 139, 250, .14);
  --rgt-tint-green: rgba(52, 211, 153, .12);
  --rgt-tint-amber: rgba(251, 191, 36, .12);
  --rgt-tint-red: rgba(248, 113, 113, .12);
  --rgt-scrim: rgba(3, 6, 12, .72);
  --rgt-track: rgba(148, 163, 184, .16);
  --rgt-focus: 0 0 0 2px var(--lab-bg), 0 0 0 4px var(--lab-primary-2);
}


/* ══ 1. SIDEBAR DROITE — titres de section & polices ═══════════════════ */

/* Titres de section : libellé sobre, petite barre d'accent bleue.
   (pas de display !important : certains titres ont style="display:none") */
html body aside.sidebar-right .section-title {
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase;
  color: var(--lab-muted) !important;
  text-shadow: none !important;
  border-bottom: 0 !important;
  padding: 0 2px !important;
  margin: 6px 0 -2px !important;
  gap: 8px;
  align-items: center;
}
html body aside.sidebar-right .section-title::before {
  content: '' !important;
  width: 3px;
  height: 12px;
  border-radius: 2px;
  background: linear-gradient(180deg, var(--lab-primary-2), var(--lab-primary));
  opacity: 1 !important;
  flex-shrink: 0;
}
html body aside.sidebar-right .section-title::after {
  /* ancien « beam » lumineux remplacé par un filet discret pleine largeur */
  content: '' !important;
  position: static !important;
  flex: 1;
  width: auto !important;
  height: 1px !important;
  background: var(--lab-line) !important;
  opacity: 1 !important;
  animation: none !important;
}

/* Polices inline héritées (Orbitron / Share Tech Mono) → Inter */
html body aside.sidebar-right [style*="Orbitron"],
html body aside.sidebar-right [style*="Share Tech Mono"] {
  font-family: var(--lab-font) !important;
  text-shadow: none !important;
}


/* ══ 2. CARTE « DOMAINE ACTIF » ═════════════════════════════════════════ */
/* NB : border-color non forcée → le JS la teinte à la couleur du domaine. */
html body #active-domain-card {
  position: relative;
  display: grid !important;
  grid-template-columns: 44px 1fr;
  grid-template-rows: auto auto;
  column-gap: 12px;
  align-items: center;
  text-align: left !important;
  padding: 12px 14px !important;
  background: var(--rgt-card-bg) !important;
  border-width: 1px !important;
  border-style: solid !important;
  border-radius: var(--lab-radius) !important;
  box-shadow: var(--lab-shadow);
  backdrop-filter: var(--lab-blur);
  -webkit-backdrop-filter: var(--lab-blur);
  overflow: hidden;
}
html body #active-domain-card::before {
  /* léger halo bleu en haut à gauche, très discret */
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(120% 90% at 0% 0%, rgba(79, 140, 255, .14), transparent 60%);
  pointer-events: none;
}
html body #adc-icon {
  grid-row: 1 / span 2;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 !important;
  font-size: 22px !important;
  line-height: 1;
  border-radius: var(--lab-radius-sm);
  background: rgba(148, 163, 184, .08);
  border: 1px solid var(--lab-line);
  position: relative;
}
html body #adc-label {
  font-family: var(--lab-font) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: .04em !important;
  color: var(--lab-text) !important;
  line-height: 1.25;
  align-self: end;
  position: relative;
}
html body #adc-desc {
  font-family: var(--lab-font) !important;
  font-size: 13px !important;
  color: var(--lab-muted) !important;
  margin-top: 2px !important;
  line-height: 1.35;
  align-self: start;
  position: relative;
}


/* ══ 3. BADGE MODE D'ACCÈS ═════════════════════════════════════════════ */
html body .access-badge {
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  font-weight: 600;
  letter-spacing: .04em !important;
  border-radius: 999px !important;
  backdrop-filter: var(--lab-blur);
  -webkit-backdrop-filter: var(--lab-blur);
  box-shadow: var(--lab-shadow) !important;
}
html body .access-badge.access-badge-inline {
  margin-top: 0 !important;
  padding: 7px 8px 7px 12px !important;
  gap: 8px;
  border-radius: var(--lab-radius-sm) !important;
  flex-wrap: wrap;
}
html body .access-badge.access-badge-inline .ab-label {
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.3;
  min-width: 0;
}
html body .access-badge-demo {
  background: var(--rgt-tint-amber) !important;
  border: 1px solid rgba(251, 191, 36, .35) !important;
  color: #fde68a !important;
}
html body .access-badge-full {
  background: var(--rgt-tint-green) !important;
  border: 1px solid rgba(52, 211, 153, .32) !important;
  color: #a7f3d0 !important;
}
html body .access-badge .ab-dot {
  width: 8px !important;
  height: 8px !important;
}
html body .access-badge-demo .ab-dot {
  background: var(--lab-amber) !important;
  box-shadow: 0 0 0 3px rgba(251, 191, 36, .18) !important;
}
html body .access-badge-full .ab-dot {
  background: var(--lab-green) !important;
  box-shadow: 0 0 0 3px rgba(52, 211, 153, .18) !important;
}
html body .ab-login-btn,
html body .access-badge.access-badge-inline .ab-login-btn {
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  font-weight: 600;
  letter-spacing: .03em !important;
  padding: 5px 10px !important;
  border-radius: var(--lab-radius-xs) !important;
  background: rgba(255, 255, 255, .06) !important;
  border: 1px solid currentColor !important;
  color: inherit !important;
  opacity: 1 !important;
  transition: background .18s var(--lab-ease), border-color .18s var(--lab-ease) !important;
}
html body .ab-login-btn:hover {
  background: rgba(255, 255, 255, .14) !important;
  box-shadow: none !important;
}


/* ══ 4. LECTEUR SPATIAL ════════════════════════════════════════════════ */

/* 4.1 Carte */
html body aside.sidebar-right .audio-player,
html body aside.sidebar-right .audio-player.ap-spatial {
  background: var(--rgt-card-bg) !important;
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius) !important;
  box-shadow: var(--lab-shadow) !important;
  backdrop-filter: var(--lab-blur) !important;
  -webkit-backdrop-filter: var(--lab-blur) !important;
  padding: 14px 14px 12px !important;
  gap: 12px !important;
  font-family: var(--lab-font);
}
/* filet supérieur : dégradé bleu→violet statique (plus de shimmer néon) */
html body aside.sidebar-right .audio-player.ap-spatial::before {
  height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(122, 167, 255, .55), rgba(167, 139, 250, .55), transparent) !important;
  animation: none !important;
}
html body aside.sidebar-right .audio-player::after { display: none; }
html body aside.sidebar-right .audio-player.ap-spatial.spatial-off::before {
  background: linear-gradient(90deg, transparent, var(--lab-line-2), transparent) !important;
}

/* 4.2 Cover orbitale + visualiseur (canvas conservé) */
html body .ap-cover-orbit {
  border: 1px solid var(--lab-line-2) !important;
  box-shadow: 0 0 0 6px rgba(148, 163, 184, .05), 0 12px 30px -12px rgba(0, 0, 0, .8) !important;
  background: radial-gradient(circle at 35% 30%, var(--lab-surface-3) 0%, var(--lab-bg-2) 100%) !important;
}
html body .audio-player.ap-spatial.spatial-off .ap-cover-orbit {
  border-color: var(--lab-line) !important;
}
/* halo audio-réactif (box-shadow inline JS) : on l'atténue sans le supprimer */
html body .ap-cover-halo { opacity: .55; }
html body .ap-viz { opacity: .85; }

/* 4.3 Infos piste */
html body aside.sidebar-right .audio-player.ap-spatial .ap-track {
  border-bottom: 1px solid var(--lab-line) !important;
  padding: 2px 0 10px !important;
}
html body aside.sidebar-right .ap-track-title,
html body aside.sidebar-right .audio-player.ap-spatial .ap-track-title {
  font-family: var(--lab-font) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: .01em !important;
  color: var(--lab-text) !important;
  text-shadow: none !important;
}
html body aside.sidebar-right .ap-track-artist,
html body aside.sidebar-right .audio-player.ap-spatial .ap-track-artist {
  font-family: var(--lab-font) !important;
  font-size: 13px !important;
  letter-spacing: .02em !important;
  text-transform: none !important;
  color: var(--lab-text-2) !important;
  margin-top: 2px !important;
}
html body aside.sidebar-right .ap-track-idx,
html body aside.sidebar-right .audio-player.ap-spatial .ap-track-idx {
  font-family: var(--lab-mono) !important;
  font-size: 12px !important;
  letter-spacing: .02em !important;
  color: var(--lab-muted) !important;
}

/* 4.4 Barre de progression */
html body aside.sidebar-right .ap-progress-wrap { padding: 4px 0 0; }
html body aside.sidebar-right .ap-progress-bar,
html body aside.sidebar-right .audio-player.ap-spatial .ap-progress-bar {
  height: 4px !important;
  border-radius: 999px !important;
  background: var(--rgt-track) !important;
  transition: height .18s var(--lab-ease);
}
html body aside.sidebar-right .ap-progress-wrap:hover .ap-progress-bar { height: 6px !important; }
html body aside.sidebar-right .ap-progress-buffer {
  background: rgba(148, 163, 184, .22) !important;
  border-radius: 999px !important;
}
html body aside.sidebar-right .ap-progress-fill,
html body aside.sidebar-right .audio-player.ap-spatial .ap-progress-fill {
  background: linear-gradient(90deg, var(--lab-primary) 0%, var(--lab-cyan) 100%) !important;
  box-shadow: none !important;
  border-radius: 999px !important;
}
html body aside.sidebar-right .ap-progress-thumb,
html body aside.sidebar-right .audio-player.ap-spatial .ap-progress-thumb {
  width: 12px !important;
  height: 12px !important;
  background: #fff !important;
  box-shadow: 0 0 0 3px rgba(79, 140, 255, .35), 0 2px 6px rgba(0, 0, 0, .5) !important;
}
html body aside.sidebar-right .ap-times {
  font-family: var(--lab-mono) !important;
  font-size: 12px !important;
  letter-spacing: 0 !important;
  color: var(--lab-muted) !important;
  margin-top: 6px !important;
  font-variant-numeric: tabular-nums;
}

/* 4.5 Transport */
html body aside.sidebar-right .ap-btns { gap: 8px !important; }
html body aside.sidebar-right .ap-btn,
html body aside.sidebar-right .audio-player.ap-spatial .ap-btn {
  width: 34px !important;
  height: 34px !important;
  border-radius: 50% !important;
  background: rgba(148, 163, 184, .08) !important;
  border: 1px solid var(--lab-line) !important;
  color: var(--lab-text-2) !important;
  font-size: 13px !important;
  text-shadow: none !important;
  box-shadow: none !important;
  transition: background .18s var(--lab-ease), border-color .18s var(--lab-ease), color .18s var(--lab-ease), transform .18s var(--lab-ease) !important;
}
html body aside.sidebar-right .ap-btn:hover,
html body aside.sidebar-right .audio-player.ap-spatial .ap-btn:hover {
  background: var(--rgt-tint-primary) !important;
  border-color: rgba(122, 167, 255, .45) !important;
  color: var(--lab-text) !important;
  box-shadow: none !important;
}
html body aside.sidebar-right .ap-btn:active { transform: scale(.94); }
/* Bouton lecture principal */
html body aside.sidebar-right .ap-btn.ap-btn-main,
html body aside.sidebar-right .audio-player.ap-spatial .ap-btn-main {
  width: 46px !important;
  height: 46px !important;
  font-size: 16px !important;
  color: #fff !important;
  background: linear-gradient(180deg, var(--lab-primary-2) 0%, var(--lab-primary) 100%) !important;
  border: 1px solid rgba(255, 255, 255, .18) !important;
  box-shadow: 0 8px 20px -8px rgba(79, 140, 255, .75), inset 0 1px 0 rgba(255, 255, 255, .25) !important;
}
html body aside.sidebar-right .ap-btn.ap-btn-main:hover,
html body aside.sidebar-right .audio-player.ap-spatial .ap-btn-main:hover {
  background: linear-gradient(180deg, #93b8ff 0%, var(--lab-primary-2) 100%) !important;
  box-shadow: 0 10px 24px -8px rgba(79, 140, 255, .9), inset 0 1px 0 rgba(255, 255, 255, .3) !important;
}
/* Aléatoire / Répéter : les icônes sont des emoji (couleur non applicable)
   → l'état actif est rendu par le fond + la bordure. */
html body aside.sidebar-right .ap-btn-shuffle.active,
html body aside.sidebar-right .ap-btn-repeat.active {
  background: var(--rgt-tint-primary-2) !important;
  border-color: var(--lab-primary-2) !important;
  color: var(--lab-primary-2) !important;
  text-shadow: none !important;
  box-shadow: 0 0 0 3px rgba(79, 140, 255, .12) !important;
}

/* 4.6 Volume */
html body aside.sidebar-right .ap-vol-wrap { gap: 10px !important; }
html body aside.sidebar-right .ap-vol-icon {
  font-size: 13px !important;
  color: var(--lab-muted) !important;
}
html body aside.sidebar-right .ap-vol-slider {
  height: 4px !important;
  border-radius: 999px !important;
  background: var(--rgt-track) !important;
  accent-color: var(--lab-primary);
}
html body aside.sidebar-right .ap-vol-slider::-webkit-slider-thumb {
  width: 12px !important;
  height: 12px !important;
  background: #fff !important;
  border: 0 !important;
  box-shadow: 0 0 0 3px rgba(79, 140, 255, .35), 0 1px 4px rgba(0, 0, 0, .5) !important;
}
html body aside.sidebar-right .ap-vol-slider::-moz-range-thumb {
  width: 12px;
  height: 12px;
  background: #fff;
  border: 0;
  box-shadow: 0 0 0 3px rgba(79, 140, 255, .35), 0 1px 4px rgba(0, 0, 0, .5);
}


/* ══ 5. PANNEAU « SPATIAL · MASTERING » ════════════════════════════════ */
html body aside.sidebar-right .ap-spatial-panel {
  background: rgba(7, 11, 20, .45) !important;
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius-sm) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html body aside.sidebar-right .ap-spatial-header {
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: .08em !important;
  color: var(--lab-text-2) !important;
  background: rgba(148, 163, 184, .05) !important;
  padding: 10px 12px !important;
  transition: background .18s var(--lab-ease);
}
html body aside.sidebar-right .ap-spatial-header:hover {
  background: rgba(148, 163, 184, .1) !important;
  color: var(--lab-text) !important;
}
html body aside.sidebar-right .ap-sp-caret {
  color: var(--lab-muted) !important;
  font-size: 12px !important;
}
/* LED d'état */
html body aside.sidebar-right .ap-sp-led {
  background: var(--lab-surface-3) !important;
  box-shadow: inset 0 0 0 1px var(--lab-line-2) !important;
  animation: none !important;
}
html body aside.sidebar-right .ap-sp-led.on {
  background: var(--lab-violet) !important;
  box-shadow: 0 0 0 3px rgba(167, 139, 250, .2) !important;
  animation: rgt-led 2.6s ease-in-out infinite !important;
}
html body aside.sidebar-right .audio-player.ap-spatial.spatial-off .ap-sp-led {
  background: var(--lab-surface-3) !important;
  animation: none !important;
}
@keyframes rgt-led {
  0%, 100% { box-shadow: 0 0 0 2px rgba(167, 139, 250, .18); }
  50%      { box-shadow: 0 0 0 4px rgba(167, 139, 250, .28); }
}

/* Interrupteurs (grand + mini) */
html body aside.sidebar-right .ap-sp-toggle label,
html body aside.sidebar-right .ap-mini-toggle label {
  background: var(--lab-surface-3) !important;
  border: 1px solid var(--lab-line-2) !important;
  box-shadow: none !important;
}
html body aside.sidebar-right .ap-sp-toggle label::after,
html body aside.sidebar-right .ap-mini-toggle label::after {
  background: var(--lab-text-2) !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .5) !important;
}
html body aside.sidebar-right .ap-sp-toggle input:checked + label,
html body aside.sidebar-right .ap-mini-toggle input:checked + label {
  background: var(--lab-primary) !important;
  border-color: var(--lab-primary-2) !important;
  box-shadow: none !important;
}
html body aside.sidebar-right .ap-sp-toggle input:checked + label::after,
html body aside.sidebar-right .ap-mini-toggle input:checked + label::after {
  background: #fff !important;
}
/* mini-toggle légèrement agrandi pour une cible plus confortable */
html body aside.sidebar-right .ap-mini-toggle { width: 30px !important; height: 16px !important; }
html body aside.sidebar-right .ap-mini-toggle label::after { width: 12px !important; height: 12px !important; }
html body aside.sidebar-right .ap-mini-toggle input:checked + label::after { left: 15px !important; }

/* Lignes de réglage */
html body aside.sidebar-right .ap-spatial-body:not(.collapsed) {
  padding: 12px 12px 14px !important;
  gap: 10px !important;
}
html body aside.sidebar-right .ap-row {
  font-family: var(--lab-font) !important;
  gap: 8px !important;
}
html body aside.sidebar-right .ap-row-lbl {
  font-family: var(--lab-font) !important;
  min-width: 82px !important;
  font-size: 12px !important;
  font-weight: 600;
  letter-spacing: .02em !important;
  color: var(--lab-text-2) !important;
  white-space: nowrap;
}
html body aside.sidebar-right .ap-row-lbl-dim {
  color: var(--lab-muted) !important;
  font-weight: 500;
  text-transform: none !important;
}
html body aside.sidebar-right .ap-row-val {
  font-family: var(--lab-mono) !important;
  font-size: 12px !important;
  letter-spacing: 0 !important;
  color: var(--lab-primary-2) !important;
  min-width: 38px !important;
  font-variant-numeric: tabular-nums;
}

/* Sliders horizontaux */
html body aside.sidebar-right .ap-slider:not(.ap-slider-vert) {
  height: 4px !important;
  border-radius: 999px !important;
  background: var(--rgt-track) !important;
}
html body aside.sidebar-right .ap-slider::-webkit-slider-thumb {
  width: 12px !important;
  height: 12px !important;
  background: #fff !important;
  border: 0 !important;
  box-shadow: 0 0 0 3px rgba(79, 140, 255, .35), 0 1px 4px rgba(0, 0, 0, .5) !important;
}
html body aside.sidebar-right .ap-slider::-moz-range-thumb {
  width: 12px;
  height: 12px;
  background: #fff;
  border: 0;
  box-shadow: 0 0 0 3px rgba(79, 140, 255, .35), 0 1px 4px rgba(0, 0, 0, .5);
}
/* teintes discrètes par fonction */
html body aside.sidebar-right .ap-slider-pan::-webkit-slider-thumb    { box-shadow: 0 0 0 3px rgba(34, 211, 238, .35), 0 1px 4px rgba(0,0,0,.5) !important; }
html body aside.sidebar-right .ap-slider-reverb::-webkit-slider-thumb { box-shadow: 0 0 0 3px rgba(167, 139, 250, .38), 0 1px 4px rgba(0,0,0,.5) !important; }
html body aside.sidebar-right .ap-slider-width::-webkit-slider-thumb  { box-shadow: 0 0 0 3px rgba(52, 211, 153, .35), 0 1px 4px rgba(0,0,0,.5) !important; }

/* Égaliseur : passe à la ligne pour respirer dans 288 px */
html body aside.sidebar-right .ap-row-eq {
  flex-wrap: wrap;
  align-items: stretch !important;
}
html body aside.sidebar-right .ap-row-eq > .ap-row-lbl { flex-basis: 100%; }
html body aside.sidebar-right .ap-eq-group {
  background: rgba(148, 163, 184, .05) !important;
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius-xs) !important;
  padding: 8px 6px !important;
}
html body aside.sidebar-right .ap-eq-band { width: 40px !important; gap: 4px !important; }
html body aside.sidebar-right .ap-slider-vert {
  background: var(--rgt-track) !important;
  border-radius: 999px !important;
}
html body aside.sidebar-right .ap-slider-vert::-webkit-slider-thumb {
  border-radius: 4px !important;
  background: #fff !important;
  border: 0 !important;
}
html body aside.sidebar-right .ap-slider-low::-webkit-slider-thumb  { box-shadow: 0 0 0 3px rgba(248, 113, 113, .4), 0 1px 4px rgba(0,0,0,.5) !important; }
html body aside.sidebar-right .ap-slider-mid::-webkit-slider-thumb  { box-shadow: 0 0 0 3px rgba(251, 191, 36, .4), 0 1px 4px rgba(0,0,0,.5) !important; }
html body aside.sidebar-right .ap-slider-high::-webkit-slider-thumb { box-shadow: 0 0 0 3px rgba(34, 211, 238, .4), 0 1px 4px rgba(0,0,0,.5) !important; }
html body aside.sidebar-right .ap-eq-label {
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  font-weight: 600;
  letter-spacing: .04em !important;
  color: var(--lab-muted) !important;
}
html body aside.sidebar-right .ap-eq-val {
  font-family: var(--lab-mono) !important;
  font-size: 12px !important;
  color: var(--lab-primary-2) !important;
}
html body aside.sidebar-right .ap-eq-presets { gap: 4px !important; }
html body aside.sidebar-right .ap-preset-btn {
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  font-weight: 600;
  letter-spacing: .04em !important;
  padding: 4px 8px !important;
  min-width: 64px !important;
  color: var(--lab-text-2) !important;
  background: rgba(148, 163, 184, .07) !important;
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius-xs) !important;
  box-shadow: none !important;
  transition: background .18s var(--lab-ease), border-color .18s var(--lab-ease), color .18s var(--lab-ease) !important;
}
html body aside.sidebar-right .ap-preset-btn:hover {
  background: var(--rgt-tint-primary) !important;
  border-color: rgba(122, 167, 255, .45) !important;
  color: var(--lab-text) !important;
}

/* Select type de reverb */
html body aside.sidebar-right .ap-select {
  font-family: var(--lab-font) !important;
  font-size: 13px !important;
  letter-spacing: 0 !important;
  color: var(--lab-text) !important;
  background-color: var(--lab-surface-solid) !important;
  border: 1px solid var(--lab-line-2) !important;
  border-radius: var(--lab-radius-xs) !important;
  padding: 5px 8px !important;
}
html body aside.sidebar-right .ap-select:hover { border-color: rgba(122, 167, 255, .45) !important; }
html body aside.sidebar-right .ap-select option {
  background: var(--lab-surface-solid) !important;
  color: var(--lab-text) !important;
}


/* ══ 6. PLAYLIST ═══════════════════════════════════════════════════════ */
html body aside.sidebar-right .ap-playlist {
  border-top: 1px solid var(--lab-line) !important;
  padding-top: 8px !important;
  max-height: 180px;
  scrollbar-color: var(--lab-line-2) transparent !important;
}
html body aside.sidebar-right .ap-playlist::-webkit-scrollbar { width: 6px !important; }
html body aside.sidebar-right .ap-playlist::-webkit-scrollbar-thumb {
  background: var(--lab-line-2) !important;
  border-radius: 999px !important;
}
html body aside.sidebar-right .ap-track-item,
html body aside.sidebar-right .audio-player.ap-spatial .ap-track-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 8px !important;
  margin: 1px 0;
  border-radius: var(--lab-radius-xs) !important;
  border: 1px solid transparent !important;
  border-left: 1px solid transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  cursor: pointer;
  transition: background .15s var(--lab-ease), border-color .15s var(--lab-ease);
}
html body aside.sidebar-right .ap-track-item:hover {
  background: rgba(148, 163, 184, .08) !important;
}
html body aside.sidebar-right .ap-track-item.active,
html body aside.sidebar-right .audio-player.ap-spatial .ap-track-item.active {
  background: var(--rgt-tint-primary) !important;
  border-color: rgba(122, 167, 255, .3) !important;
  box-shadow: inset 2px 0 0 var(--lab-primary) !important;
}
html body aside.sidebar-right .ap-track-num {
  font-family: var(--lab-mono) !important;
  font-size: 12px !important;
  color: var(--lab-muted) !important;
  min-width: 18px;
  text-align: right;
  font-variant-numeric: tabular-nums;
}
html body aside.sidebar-right .ap-track-item.active .ap-track-num { color: var(--lab-primary-2) !important; }
html body aside.sidebar-right .ap-track-info { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 1px; }
html body aside.sidebar-right .ap-ti-title {
  font-family: var(--lab-font) !important;
  font-size: 13px !important;
  font-weight: 500;
  letter-spacing: 0 !important;
  color: var(--lab-text-2) !important;
  text-shadow: none !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
html body aside.sidebar-right .ap-track-item.active .ap-ti-title { color: var(--lab-text) !important; font-weight: 600; }
html body aside.sidebar-right .ap-ti-artist {
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--lab-muted) !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
html body aside.sidebar-right .ap-ti-playing {
  color: var(--lab-primary-2) !important;
  font-size: 13px !important;
}
/* anciens items (.ap-item) si jamais réutilisés */
html body aside.sidebar-right .ap-item-title { font-family: var(--lab-font) !important; font-size: 13px !important; color: var(--lab-text-2) !important; }
html body aside.sidebar-right .ap-item-artist,
html body aside.sidebar-right .ap-item-num { font-family: var(--lab-font) !important; font-size: 12px !important; color: var(--lab-muted) !important; }
html body aside.sidebar-right .ap-item.active { background: var(--rgt-tint-primary) !important; border-color: rgba(122, 167, 255, .3) !important; }
html body aside.sidebar-right .ap-loading,
html body aside.sidebar-right .ap-error {
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  letter-spacing: .06em !important;
  color: var(--lab-muted) !important;
}
html body aside.sidebar-right .ap-error { color: var(--lab-red) !important; }


/* ══ 7. SANTÉ BASE ═════════════════════════════════════════════════════
   Le bloc n'a ni id ni classe : ciblage via son onclick.
   La couleur du score et de la barre est posée par le JS (sémantique) → conservée. */
html body aside.sidebar-right > div[onclick*="'health'"] {
  padding: 12px 14px !important;
  background: var(--rgt-card-bg) !important;
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius) !important;
  box-shadow: var(--lab-shadow);
  backdrop-filter: var(--lab-blur);
  -webkit-backdrop-filter: var(--lab-blur);
  transition: border-color .18s var(--lab-ease), transform .18s var(--lab-ease);
}
html body aside.sidebar-right > div[onclick*="'health'"]:hover {
  border-color: rgba(122, 167, 255, .4) !important;
  transform: translateY(-1px);
}
html body aside.sidebar-right > div[onclick*="'health'"] > div:first-child {
  margin-bottom: 8px !important;
}
html body aside.sidebar-right > div[onclick*="'health'"] > div:first-child > span:first-child {
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  font-weight: 600;
  letter-spacing: .08em;
  color: var(--lab-muted) !important;
}
html body #sidebar-health-score {
  font-family: var(--lab-mono) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  letter-spacing: -.01em;
  text-shadow: none !important;
  font-variant-numeric: tabular-nums;
}
html body aside.sidebar-right > div[onclick*="'health'"] > div:nth-child(2) {
  /* piste de la barre */
  height: 6px !important;
  background: var(--rgt-track) !important;
  border-radius: 999px !important;
}
html body #sidebar-health-bar {
  border-radius: 999px !important;
  box-shadow: none !important;
}
html body #sidebar-health-label {
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  margin-top: 7px !important;
  letter-spacing: .01em;
}


/* ══ 8. ACTIVITÉ EN DIRECT ═════════════════════════════════════════════ */
html body aside.sidebar-right .live-feed {
  background: rgba(7, 11, 20, .5) !important;
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius) !important;
  padding: 6px 12px !important;
  font-family: var(--lab-font) !important;
  font-size: 13px !important;
  max-height: 260px;
  scrollbar-width: thin;
  scrollbar-color: var(--lab-line-2) transparent;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .02);
}
html body aside.sidebar-right .live-feed::-webkit-scrollbar { width: 6px; }
html body aside.sidebar-right .live-feed::-webkit-scrollbar-thumb { background: var(--lab-line-2); border-radius: 999px; }
html body aside.sidebar-right .feed-item {
  position: relative;
  padding: 8px 0 8px 14px !important;
  border-bottom: 1px solid var(--lab-line) !important;
  color: var(--lab-text-2) !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  word-break: break-word;
  animation: rgt-feed-in .35s var(--lab-ease) both;
}
html body aside.sidebar-right .feed-item:last-child { border-bottom: 0 !important; }
/* puce de chronologie */
html body aside.sidebar-right .feed-item::before {
  content: '';
  position: absolute;
  left: 0;
  top: 13px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--lab-line-2);
}
html body aside.sidebar-right .feed-item:first-child::before {
  background: var(--lab-teal);
  box-shadow: 0 0 0 3px rgba(45, 212, 191, .18);
}
html body aside.sidebar-right .feed-time {
  font-family: var(--lab-mono) !important;
  font-size: 12px !important;
  color: var(--lab-primary-2) !important;
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
}
@keyframes rgt-feed-in {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: none; }
}


/* ══ 9. PROGRESSION (pipeline + phases) ════════════════════════════════ */
html body aside.sidebar-right .progress-bar-wrap {
  margin: 0 !important;
  padding: 12px 14px !important;
  background: var(--rgt-card-bg);
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius);
  box-shadow: var(--lab-shadow);
}
html body aside.sidebar-right .progress-bar-track {
  height: 8px !important;
  background: var(--rgt-track) !important;
  border: 0 !important;
  border-radius: 999px !important;
}
html body aside.sidebar-right .progress-bar-fill {
  background: linear-gradient(90deg, var(--lab-primary) 0%, var(--lab-cyan) 100%) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}
html body aside.sidebar-right .progress-bar-track.running .progress-bar-fill {
  background: linear-gradient(90deg, var(--lab-primary) 0%, var(--lab-violet) 50%, var(--lab-primary) 100%) !important;
  background-size: 200% 100% !important;
  animation: rgt-bar-flow 2.4s linear infinite !important;
  box-shadow: none !important;
}
html body aside.sidebar-right .progress-bar-track.complete .progress-bar-fill {
  background: var(--lab-green) !important;
  animation: rgt-bar-done 2s ease-in-out infinite !important;
}
html body aside.sidebar-right .progress-bar-shine {
  background: linear-gradient(180deg, rgba(255, 255, 255, .14) 0%, transparent 60%) !important;
  border-radius: 999px !important;
}
@keyframes rgt-bar-flow { to { background-position: -200% 0; } }
@keyframes rgt-bar-done {
  0%, 100% { opacity: 1; }
  50%      { opacity: .78; }
}
html body aside.sidebar-right .progress-bar-meta {
  margin-top: 8px !important;
  align-items: center !important;
  font-family: var(--lab-font) !important;
}
html body aside.sidebar-right .progress-bar-sub {
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  font-weight: 600;
  letter-spacing: .08em !important;
  color: var(--lab-muted) !important;
}
html body aside.sidebar-right .progress-bar-pct {
  font-family: var(--lab-mono) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--lab-text) !important;
  text-shadow: none !important;
  font-variant-numeric: tabular-nums;
}
html body aside.sidebar-right .progress-bar-track.running ~ .progress-bar-meta .progress-bar-pct { color: var(--lab-primary-2) !important; }
html body aside.sidebar-right .progress-bar-track.complete ~ .progress-bar-meta .progress-bar-pct { color: var(--lab-green) !important; }

/* Liste des phases (lignes générées par le JS avec couleur inline) */
html body #progress-phases {
  font-family: var(--lab-font) !important;
  font-size: 13px !important;
  margin-top: 10px !important;
  padding-top: 8px;
  border-top: 1px solid var(--lab-line);
  display: flex;
  flex-direction: column;
  gap: 2px;
}
html body #progress-phases:empty { border-top: 0; padding-top: 0; }
html body #progress-phases > div {
  position: relative;
  padding: 4px 0 4px 18px;
  line-height: 1.4;
  color: var(--lab-muted) !important;
}
html body #progress-phases > div::before {
  content: '';
  position: absolute;
  left: 2px;
  top: 50%;
  width: 8px;
  height: 8px;
  margin-top: -4px;
  border-radius: 50%;
  border: 1.5px solid var(--lab-line-2);
  box-sizing: border-box;
}
/* phase terminée (#30d158 inline) */
html body #progress-phases > div[style*="30d158"] { color: var(--lab-text-2) !important; }
html body #progress-phases > div[style*="30d158"]::before {
  background: var(--lab-green);
  border-color: var(--lab-green);
  box-shadow: 0 0 0 3px rgba(52, 211, 153, .15);
}


/* ══ 10. OVERLAYS — base commune ═══════════════════════════════════════ */

/* Fonds (scrims) : sombres, flou modéré */
html body .help-overlay,
html body .auth-modal,
html body .gpu-howto-modal,
html body #presentation-overlay,
html body #report-popup-overlay,
html body #pdf-pw-modal,
html body #stop-confirm-overlay,
html body #info-modal-overlay,
html body #confirm-modal-overlay,
html body #key-test-modal {
  background: var(--rgt-scrim) !important;
  backdrop-filter: blur(10px) saturate(120%) !important;
  -webkit-backdrop-filter: blur(10px) saturate(120%) !important;
}

/* Boîtes de dialogue : panneau verre, rayon 14, ombre haute */
html body .help-popup,
html body .auth-modal-content,
html body .gpu-howto-content,
html body #presentation-content,
html body #report-popup-overlay > div,
html body #pdf-pw-modal > div,
html body .sco-box,
html body .imo-box,
html body .cmo-box,
html body .ktm-box {
  background: linear-gradient(180deg, rgba(30, 41, 59, .92) 0%, rgba(17, 24, 39, .96) 100%) !important;
  border: 1px solid var(--lab-line-2) !important;
  border-radius: var(--lab-radius) !important;
  box-shadow: var(--lab-shadow-hi) !important;
  color: var(--lab-text-2) !important;
  font-family: var(--lab-font) !important;
  backdrop-filter: var(--lab-blur);
  -webkit-backdrop-filter: var(--lab-blur);
  animation: rgt-dialog-in .28s var(--lab-ease) both;
}
@keyframes rgt-dialog-in {
  from { opacity: 0; transform: translateY(10px) scale(.985); }
  to   { opacity: 1; transform: none; }
}
/* défilement interne */
html body .help-popup *,
html body .gpu-howto-content,
html body #presentation-content,
html body #report-popup-overlay > div,
html body .ktm-box {
  scrollbar-width: thin;
  scrollbar-color: var(--lab-line-2) transparent;
}

/* Boutons « fermer » ronds */
html body .help-close,
html body .auth-modal-close,
html body .gpu-howto-close,
html body #presentation-overlay button[onclick*="closePresentationMode"],
html body #report-popup-overlay > div > button:first-child {
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  background: rgba(148, 163, 184, .08) !important;
  border: 1px solid var(--lab-line-2) !important;
  color: var(--lab-text-2) !important;
  font-family: var(--lab-font) !important;
  font-size: 14px !important;
  box-shadow: none !important;
  transition: background .18s var(--lab-ease), border-color .18s var(--lab-ease), color .18s var(--lab-ease) !important;
}
html body .help-close:hover,
html body .auth-modal-close:hover,
html body .gpu-howto-close:hover,
html body #presentation-overlay button[onclick*="closePresentationMode"]:hover,
html body #report-popup-overlay > div > button:first-child:hover {
  background: rgba(248, 113, 113, .14) !important;
  border-color: rgba(248, 113, 113, .5) !important;
  color: #fecaca !important;
  box-shadow: none !important;
}


/* ══ 11. MODALE AIDE (#help-overlay) ═══════════════════════════════════ */
html body .help-popup::before,
html body .help-popup::after { display: none; }   /* coins « HUD » supprimés */
html body .help-popup h2 {
  font-family: var(--lab-font) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  letter-spacing: .01em !important;
  color: var(--lab-text) !important;
  text-shadow: none !important;
}
html body .help-popup .subtitle {
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  font-weight: 500;
  letter-spacing: .08em !important;
  color: var(--lab-muted) !important;
}
html body #help-tabs-nav { border-bottom-color: var(--lab-line) !important; gap: 4px !important; }
html body .htab {
  font-family: var(--lab-font) !important;
  font-size: 13px !important;
  font-weight: 500;
  letter-spacing: .02em !important;
  color: var(--lab-muted) !important;
  padding: 9px 12px !important;
  border-bottom: 2px solid transparent !important;
  border-radius: var(--lab-radius-xs) var(--lab-radius-xs) 0 0;
  transition: color .15s var(--lab-ease), background .15s var(--lab-ease), border-color .15s var(--lab-ease) !important;
}
html body .htab:hover { color: var(--lab-text) !important; background: rgba(148, 163, 184, .06); }
html body .htab.htab-active {
  color: var(--lab-primary-2) !important;
  border-bottom-color: var(--lab-primary) !important;
  font-weight: 600;
}
/* Contenu markdown de l'aide */
html body .help-popup .md-h1 {
  font-family: var(--lab-font) !important;
  font-size: 18px !important;
  font-weight: 700;
  letter-spacing: 0 !important;
  color: var(--lab-text) !important;
  border-bottom: 1px solid var(--lab-line-2) !important;
  padding-bottom: 10px !important;
}
html body .help-popup .md-h2 {
  font-family: var(--lab-font) !important;
  font-size: 13px !important;
  font-weight: 600;
  letter-spacing: .06em !important;
  color: var(--lab-text) !important;
  border-bottom: 1px solid var(--lab-line) !important;
}
html body .help-popup .md-h3 {
  font-family: var(--lab-font) !important;
  font-size: 13px !important;
  font-weight: 600;
  letter-spacing: 0 !important;
  color: var(--lab-primary-2) !important;
}
html body .help-popup .md-p,
html body .help-popup .md-ul li,
html body .help-popup .md-ol li {
  font-size: 13px !important;
  line-height: 1.7 !important;
  color: var(--lab-text-2) !important;
}
html body .help-popup .md-code,
html body .help-popup .md-key {
  font-family: var(--lab-mono) !important;
  font-size: 12.5px !important;
  background: rgba(148, 163, 184, .1) !important;
  border: 1px solid var(--lab-line-2) !important;
  color: var(--lab-text) !important;
  border-radius: 6px !important;
}
html body .help-popup .md-block {
  font-family: var(--lab-mono) !important;
  font-size: 13px !important;
  background: rgba(7, 11, 20, .6) !important;
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius-sm) !important;
  color: var(--lab-text-2) !important;
}
html body .help-popup .md-tip,
html body .help-popup .md-warn {
  font-size: 13px !important;
  color: var(--lab-text-2) !important;
  border-radius: var(--lab-radius-xs) !important;
  border-left-width: 3px !important;
}
html body .help-popup .md-tip  { background: var(--rgt-tint-green) !important; border-left-color: var(--lab-green) !important; }
html body .help-popup .md-warn { background: var(--rgt-tint-amber) !important; border-left-color: var(--lab-amber) !important; }
html body .help-popup .md-table { font-size: 13px !important; border-radius: var(--lab-radius-sm); overflow: hidden; }
html body .help-popup .md-table th {
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  font-weight: 600;
  letter-spacing: .06em !important;
  background: rgba(148, 163, 184, .08) !important;
  color: var(--lab-text) !important;
  border-color: var(--lab-line) !important;
}
html body .help-popup .md-table td { border-color: var(--lab-line) !important; color: var(--lab-text-2) !important; }
html body .help-popup .md-table tr:nth-child(even) td { background: rgba(148, 163, 184, .04) !important; }
html body .help-popup .md-badge,
html body .help-popup [style*="Share Tech Mono"] {
  font-family: var(--lab-font) !important;
}
html body .help-popup .md-badge { font-size: 12px !important; }
html body .help-popup .feature-card {
  background: rgba(148, 163, 184, .06) !important;
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius-sm) !important;
}
html body .help-popup .feature-card:hover { border-color: rgba(122, 167, 255, .45) !important; }
html body .help-popup .feature-title {
  font-family: var(--lab-font) !important;
  font-size: 13px !important;
  font-weight: 600;
  color: var(--lab-text) !important;
}
html body .help-popup .feature-desc { font-size: 13px !important; color: var(--lab-muted) !important; }
html body .help-popup .hstat-val { font-family: var(--lab-mono) !important; }
html body .help-popup .hstat-lbl { font-family: var(--lab-font) !important; font-size: 12px !important; }
html body .help-footer {
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  color: var(--lab-muted) !important;
  border-top-color: var(--lab-line) !important;
}


/* ══ 12. AUTH · GPU ════════════════════════════════════════════════════ */

/* 12.1 Modale d'authentification */
html body .auth-modal-content { padding: 32px 30px 24px !important; }
html body .auth-modal-content h2 {
  font-family: var(--lab-font) !important;
  font-size: 20px !important;
  font-weight: 700;
  letter-spacing: 0 !important;
  color: var(--lab-text) !important;
  text-shadow: none !important;
}
html body .auth-modal-sub {
  font-size: 13px !important;
  line-height: 1.6 !important;
  color: var(--lab-text-2) !important;
}
html body .auth-modal-input {
  font-family: var(--lab-font) !important;
  font-size: 15px !important;
  letter-spacing: .04em !important;
  background: rgba(7, 11, 20, .7) !important;
  border: 1px solid var(--lab-line-2) !important;
  border-radius: var(--lab-radius-sm) !important;
  color: var(--lab-text) !important;
}
html body .auth-modal-input::placeholder { color: var(--lab-muted); }
html body .auth-modal-input:focus {
  border-color: var(--lab-primary) !important;
  box-shadow: 0 0 0 3px rgba(79, 140, 255, .25) !important;
  background: rgba(7, 11, 20, .85) !important;
}
html body .auth-modal-submit {
  font-family: var(--lab-font) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: .06em !important;
  border-radius: var(--lab-radius-sm) !important;
  background: linear-gradient(180deg, var(--lab-primary-2) 0%, var(--lab-primary) 100%) !important;
  border: 1px solid rgba(255, 255, 255, .16) !important;
  box-shadow: 0 10px 24px -10px rgba(79, 140, 255, .8) !important;
}
html body .auth-modal-submit:hover {
  background: linear-gradient(180deg, #93b8ff 0%, var(--lab-primary-2) 100%) !important;
  box-shadow: 0 12px 28px -10px rgba(79, 140, 255, .95) !important;
}
html body .auth-modal-error {
  font-size: 13px !important;
  background: var(--rgt-tint-red) !important;
  border: 1px solid rgba(248, 113, 113, .4) !important;
  color: #fecaca !important;
  border-radius: var(--lab-radius-xs) !important;
}
html body .auth-modal-note {
  font-size: 13px !important;
  color: var(--lab-muted) !important;
  border-top-color: var(--lab-line) !important;
}
html body .auth-modal-note code {
  font-family: var(--lab-mono) !important;
  font-size: 12px !important;
  background: rgba(148, 163, 184, .1) !important;
  color: var(--lab-text) !important;
}

/* 12.2 Bannière GPU (haut d'écran) */
html body .gpu-warn-banner {
  font-family: var(--lab-font) !important;
  font-size: 13px !important;
  letter-spacing: 0 !important;
  color: #fde68a !important;
  background: linear-gradient(90deg, rgba(251, 191, 36, .14), rgba(17, 24, 39, .92) 40%, rgba(17, 24, 39, .92)) !important;
  border-bottom: 1px solid rgba(251, 191, 36, .35) !important;
  box-shadow: 0 10px 30px -14px rgba(0, 0, 0, .9) !important;
  backdrop-filter: var(--lab-blur) !important;
  -webkit-backdrop-filter: var(--lab-blur) !important;
  padding: 9px 16px !important;
}
html body .gpu-warn-icon {
  color: var(--lab-amber) !important;
  text-shadow: none !important;
}
html body .gpu-warn-text { color: var(--lab-text-2) !important; }
html body .gpu-warn-btn {
  font-family: var(--lab-font) !important;
  font-size: 13px !important;
  font-weight: 600;
  letter-spacing: .02em !important;
  padding: 6px 12px !important;
  border-radius: var(--lab-radius-xs) !important;
  background: rgba(148, 163, 184, .08) !important;
  border: 1px solid var(--lab-line-2) !important;
  color: var(--lab-text-2) !important;
  box-shadow: none !important;
}
html body .gpu-warn-btn:hover {
  background: rgba(148, 163, 184, .16) !important;
  color: var(--lab-text) !important;
  box-shadow: none !important;
}
html body .gpu-warn-btn.gpu-warn-btn-primary {
  background: var(--lab-amber) !important;
  border-color: var(--lab-amber) !important;
  color: #1f1500 !important;
}
html body .gpu-warn-btn.gpu-warn-btn-primary:hover { background: #fcd34d !important; }

/* 12.3 Modale « Activer l'accélération matérielle » */
html body .gpu-howto-content {
  font-size: 13px !important;
  line-height: 1.7 !important;
  padding: 32px 32px 26px !important;
}
html body .gpu-howto-content h2 {
  font-family: var(--lab-font) !important;
  font-size: 20px !important;
  font-weight: 700;
  letter-spacing: 0 !important;
  color: var(--lab-text) !important;
  text-shadow: none !important;
}
html body .gpu-howto-content h3 {
  font-family: var(--lab-font) !important;
  font-size: 14px !important;
  font-weight: 600;
  letter-spacing: .02em !important;
  color: var(--lab-primary-2) !important;
  border-bottom: 1px solid var(--lab-line) !important;
}
html body .gpu-howto-content h3[style*="ff9f0a"] { color: var(--lab-amber) !important; }
html body .gpu-howto-content li { color: var(--lab-text-2) !important; }
html body .gpu-howto-content strong { color: var(--lab-text) !important; }
html body .gpu-howto-content em { color: var(--lab-muted) !important; }
html body .gpu-howto-content code,
html body .gpu-howto-detect code {
  font-family: var(--lab-mono) !important;
  font-size: 13px !important;
  background: rgba(79, 140, 255, .1) !important;
  border: 1px solid rgba(122, 167, 255, .28) !important;
  color: #c7d8ff !important;
  border-radius: 6px !important;
}
html body .gpu-howto-detect {
  font-size: 13px !important;
  background: rgba(7, 11, 20, .55) !important;
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius-sm) !important;
  color: var(--lab-text-2) !important;
}
html body .gpu-howto-note {
  font-size: 13px !important;
  background: var(--rgt-tint-primary) !important;
  border-left: 3px solid var(--lab-primary) !important;
  border-radius: var(--lab-radius-xs) !important;
  color: var(--lab-text-2) !important;
}


/* ══ 13. MODALES GÉNÉRÉES PAR LE JS ════════════════════════════════════ */

/* 13.1 Stop / Info / Confirmation (sco-, imo-, cmo-) */
html body .sco-icon,
html body .imo-icon,
html body .cmo-icon { filter: none !important; font-size: 40px !important; }
html body .sco-title,
html body .imo-title,
html body .cmo-title {
  font-family: var(--lab-font) !important;
  font-size: 19px !important;
  font-weight: 700 !important;
  color: var(--lab-text) !important;
}
html body .sco-body,
html body .imo-body,
html body .cmo-body { color: var(--lab-text-2) !important; font-size: 14px !important; }
html body .sco-body[style*="#888"] { color: var(--lab-muted) !important; }
html body .sco-info {
  background: var(--rgt-tint-amber) !important;
  border-left: 3px solid var(--lab-amber) !important;
  border-radius: var(--lab-radius-xs) !important;
  color: var(--lab-text-2) !important;
  font-family: var(--lab-font) !important;
}
html body .sco-btn,
html body .imo-btn,
html body .cmo-btn,
html body .ktm-btn {
  font-family: var(--lab-font) !important;
  font-weight: 600 !important;
  letter-spacing: .01em !important;
  border-radius: var(--lab-radius-sm) !important;
  transition: background .18s var(--lab-ease), box-shadow .18s var(--lab-ease), transform .18s var(--lab-ease) !important;
}
/* action sûre (continuer / annuler / OK / fermer) → bleu labo */
html body .sco-btn-continue,
html body .cmo-cancel,
html body .imo-btn,
html body .ktm-btn {
  background: linear-gradient(180deg, var(--lab-primary-2) 0%, var(--lab-primary) 100%) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, .16) !important;
  box-shadow: 0 10px 22px -12px rgba(79, 140, 255, .9) !important;
}
html body .sco-btn-continue:hover,
html body .cmo-cancel:hover,
html body .imo-btn:hover,
html body .ktm-btn:hover { box-shadow: 0 12px 26px -10px rgba(79, 140, 255, 1) !important; }
/* action destructrice → rouge discret */
html body .sco-btn-stop,
html body .cmo-confirm {
  background: var(--rgt-tint-red) !important;
  color: #fecaca !important;
  border: 1px solid rgba(248, 113, 113, .4) !important;
}
html body .sco-btn-stop:hover,
html body .cmo-confirm:hover { background: rgba(248, 113, 113, .22) !important; }

/* 13.2 Résultats test des clés */
html body .ktm-box [style*="color:#30d158"] { color: var(--lab-green) !important; }
html body .ktm-box table { font-family: var(--lab-font); font-size: 13px; }
html body .ktm-box th,
html body .ktm-box td { border-color: var(--lab-line) !important; }

/* 13.3 Popup rapport (#report-popup-overlay) — contenu inline */
html body #report-popup-overlay > div { padding: 28px 30px 22px !important; }
html body #report-popup-overlay [style*="Orbitron"] {
  font-family: var(--lab-font) !important;
  font-weight: 700;
  letter-spacing: 0;
}
html body #report-popup-overlay [style*="Share Tech Mono"] {
  font-family: var(--lab-mono) !important;
  font-size: 12px !important;
  color: var(--lab-muted) !important;
}
html body #report-popup-overlay [style*="border-bottom:1px solid var(--border)"] { border-bottom-color: var(--lab-line) !important; }
html body #popup-report-content {
  font-family: var(--lab-font) !important;
  font-size: 14px !important;
  line-height: 1.75 !important;
  color: var(--lab-text-2) !important;
  background: rgba(7, 11, 20, .5) !important;
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius-sm) !important;
  padding: 18px 20px !important;
}

/* 13.4 Mode présentation (#presentation-overlay) */
html body #presentation-content { padding: 26px 28px !important; color: var(--lab-text-2) !important; }
html body #presentation-nav {
  font-family: var(--lab-mono) !important;
  font-size: 13px !important;
  color: var(--lab-muted) !important;
}
html body #presentation-overlay [style*="Share Tech Mono"] {
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  color: var(--lab-muted) !important;
}

/* 13.5 Modale mot de passe PDF (#pdf-pw-modal, tout en inline) */
html body #pdf-pw-modal > div { padding: 34px 32px 28px !important; }
html body #pdf-pw-modal h2 {
  font-family: var(--lab-font) !important;
  font-size: 19px !important;
  font-weight: 700;
  letter-spacing: .02em !important;
  color: var(--lab-text) !important;
}
html body #pdf-pw-modal p { color: var(--lab-text-2) !important; font-family: var(--lab-font) !important; }
html body #pdf-pw-display {
  font-family: var(--lab-mono) !important;
  font-size: 20px !important;
  letter-spacing: .12em !important;
  color: var(--lab-amber) !important;
  background: rgba(7, 11, 20, .75) !important;
  border: 1px solid var(--lab-line-2) !important;
  border-radius: var(--lab-radius-sm) !important;
}
html body #pdf-pw-copy {
  font-family: var(--lab-font) !important;
  font-weight: 600;
  background: rgba(148, 163, 184, .08) !important;
  border: 1px solid var(--lab-line-2) !important;
  color: var(--lab-text) !important;
  border-radius: var(--lab-radius-sm) !important;
}
html body #pdf-pw-copy:hover { background: rgba(148, 163, 184, .16) !important; }
html body #pdf-pw-modal > div > div[style*="ffc864"] {
  background: var(--rgt-tint-amber) !important;
  border: 1px solid rgba(251, 191, 36, .35) !important;
  color: #fde68a !important;
  border-radius: var(--lab-radius-sm) !important;
  font-size: 13px !important;
}
html body #pdf-pw-cancel {
  font-family: var(--lab-font) !important;
  background: transparent !important;
  border: 1px solid var(--lab-line-2) !important;
  color: var(--lab-text-2) !important;
  border-radius: var(--lab-radius-sm) !important;
}
html body #pdf-pw-cancel:hover { background: rgba(148, 163, 184, .1) !important; }
html body #pdf-pw-confirm {
  font-family: var(--lab-font) !important;
  font-weight: 600 !important;
  background: linear-gradient(180deg, var(--lab-primary-2) 0%, var(--lab-primary) 100%) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, .16) !important;
  border-radius: var(--lab-radius-sm) !important;
  box-shadow: 0 10px 22px -12px rgba(79, 140, 255, .9) !important;
}


/* ══ 14. TOASTS & TOOLTIPS ═════════════════════════════════════════════ */
html body #toast-container { gap: 8px !important; max-width: 340px !important; }
html body .toast {
  font-family: var(--lab-font) !important;
  font-size: 13px !important;
  line-height: 1.45;
  color: var(--lab-text) !important;
  padding: 10px 14px 10px 14px !important;
  background: rgba(17, 24, 39, .94) !important;
  border: 1px solid var(--lab-line-2) !important;
  border-left: 3px solid var(--lab-primary) !important;
  border-radius: var(--lab-radius-sm) !important;
  box-shadow: 0 14px 34px -14px rgba(0, 0, 0, .9) !important;
  backdrop-filter: var(--lab-blur);
  -webkit-backdrop-filter: var(--lab-blur);
}
html body .toast.ok    { border-left-color: var(--lab-green) !important; }
html body .toast.info  { border-left-color: var(--lab-primary) !important; }
html body .toast.warn  { border-left-color: var(--lab-amber) !important; }
html body .toast.error { border-left-color: var(--lab-red) !important; }

/* Infobulles flottantes (graphe / réseau) — display piloté par le JS */
html body .graph-tooltip,
html body #graph-tooltip,
html body #network-tooltip,
html body aside.sidebar-right .kinetic-crosshair {
  font-family: var(--lab-font) !important;
  font-size: 13px !important;
  line-height: 1.45;
  color: var(--lab-text) !important;
  background: rgba(17, 24, 39, .96) !important;
  border: 1px solid var(--lab-line-2) !important;
  border-radius: var(--lab-radius-xs) !important;
  box-shadow: 0 12px 28px -12px rgba(0, 0, 0, .9) !important;
  backdrop-filter: var(--lab-blur);
  -webkit-backdrop-filter: var(--lab-blur);
}


/* ══ 15. BOUTONS FLOTTANTS ═════════════════════════════════════════════ */

/* 15.1 Bouton lune / soleil (#btn-toggle-all) — bas centre.
   Inline + JS (borderColor, color, boxShadow, background, textShadow)
   → !important ; display & transform (translateX(-50%)) laissés au JS. */
html body #btn-toggle-all {
  width: 48px !important;
  height: 48px !important;
  bottom: 24px !important;
  background: rgba(17, 24, 39, .82) !important;
  border: 1px solid var(--lab-line-2) !important;
  color: var(--lab-text-2) !important;
  text-shadow: none !important;
  font-family: var(--lab-font) !important;
  font-size: 19px !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .06) inset, 0 14px 32px -12px rgba(0, 0, 0, .9) !important;
  backdrop-filter: var(--lab-blur) !important;
  -webkit-backdrop-filter: var(--lab-blur) !important;
  transition: border-color .2s var(--lab-ease), background .2s var(--lab-ease), box-shadow .2s var(--lab-ease) !important;
}
html body #btn-toggle-all:hover {
  background: rgba(30, 41, 59, .92) !important;
  border-color: rgba(122, 167, 255, .55) !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .08) inset, 0 0 0 4px rgba(79, 140, 255, .14), 0 16px 34px -12px rgba(0, 0, 0, .9) !important;
}
/* mode immersif (icône soleil) : accent ambre discret pour signaler l'état */
html body.immersive-mode #btn-toggle-all {
  border-color: rgba(251, 191, 36, .45) !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .06) inset, 0 0 0 4px rgba(251, 191, 36, .1), 0 14px 32px -12px rgba(0, 0, 0, .9) !important;
}

/* 15.2 Retour en haut (#back-to-top) — bas droite */
html body .back-to-top {
  background: rgba(17, 24, 39, .85) !important;
  border: 1px solid var(--lab-line-2) !important;
  color: var(--lab-text) !important;
  font-family: var(--lab-font) !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .06) inset, 0 14px 30px -12px rgba(0, 0, 0, .9) !important;
  backdrop-filter: var(--lab-blur);
  -webkit-backdrop-filter: var(--lab-blur);
}
html body .back-to-top:hover {
  background: var(--lab-primary) !important;
  border-color: var(--lab-primary-2) !important;
  box-shadow: 0 12px 26px -10px rgba(79, 140, 255, .9) !important;
}


/* ══ 16. FOCUS CLAVIER (WCAG 2.4.7) ════════════════════════════════════ */
html body aside.sidebar-right button:focus-visible,
html body aside.sidebar-right select:focus-visible,
html body aside.sidebar-right input[type="range"]:focus-visible,
html body aside.sidebar-right > div[onclick]:focus-visible,
html body .help-close:focus-visible,
html body .auth-modal-close:focus-visible,
html body .gpu-howto-close:focus-visible,
html body .gpu-warn-btn:focus-visible,
html body .htab:focus-visible,
html body .auth-modal-submit:focus-visible,
html body .sco-btn:focus-visible,
html body .imo-btn:focus-visible,
html body .cmo-btn:focus-visible,
html body .ktm-btn:focus-visible,
html body #pdf-pw-modal button:focus-visible,
html body #presentation-overlay button:focus-visible,
html body #btn-toggle-all:focus-visible,
html body .back-to-top:focus-visible {
  outline: none !important;
  box-shadow: var(--rgt-focus) !important;
}
/* toggles masqués (input opacity:0) → anneau de focus sur le label */
html body aside.sidebar-right .ap-sp-toggle input:focus-visible + label,
html body aside.sidebar-right .ap-mini-toggle input:focus-visible + label {
  box-shadow: var(--rgt-focus) !important;
}
html body aside.sidebar-right .ap-track-item:focus-visible {
  outline: 2px solid var(--lab-primary-2);
  outline-offset: 1px;
}


/* ══════════════════════════════════════════════════════════════════════════
   17. ÉDITION « SIGNATURE » — identité instrument scientifique
   ──────────────────────────────────────────────────────────────────────────
   Couche d'enrichissement (placée en dernier → l'emporte à spécificité égale) :
   • cartes « panneau d'instrument » : bordure en dégradé (hairline), trame
     papier millimétré estompée, repères d'étalonnage aux coins ;
   • titres de section numérotés (canaux 01, 02…) via compteur CSS (décoratif) ;
   • lecteur premium : anneau conique gradué autour de la pochette, plateau de
     transport ; jauge santé segmentée type vu-mètre ; fil d'activité en
     chronologie ; progression en stepper vertical numéroté ; modales avec
     liseré d'accent et trame.
   ══════════════════════════════════════════════════════════════════════════ */

html body {
  /* repères d'étalonnage (coins haut-gauche / bas-droite) */
  --rgt-tick: rgba(122, 167, 255, .55);
  --rgt-ticks:
    linear-gradient(var(--rgt-tick), var(--rgt-tick)) left 6px top 6px / 9px 1px no-repeat,
    linear-gradient(var(--rgt-tick), var(--rgt-tick)) left 6px top 6px / 1px 9px no-repeat,
    linear-gradient(var(--rgt-tick), var(--rgt-tick)) right 6px bottom 6px / 9px 1px no-repeat,
    linear-gradient(var(--rgt-tick), var(--rgt-tick)) right 6px bottom 6px / 1px 9px no-repeat;
  /* trame millimétrée très légère, estompée vers le bas */
  --rgt-grid:
    linear-gradient(180deg, transparent 0%, rgba(17, 24, 39, .9) 100%),
    repeating-linear-gradient(0deg, rgba(148, 163, 184, .045) 0 1px, transparent 1px 14px),
    repeating-linear-gradient(90deg, rgba(148, 163, 184, .045) 0 1px, transparent 1px 14px);
  /* surface + bordure dégradée (padding-box / border-box) */
  --rgt-face: linear-gradient(180deg, rgba(30, 41, 59, .72) 0%, rgba(15, 23, 42, .82) 100%) padding-box;
  --rgt-rim: linear-gradient(160deg, rgba(122, 167, 255, .38) 0%, rgba(148, 163, 184, .12) 38%, rgba(148, 163, 184, .08) 70%, rgba(167, 139, 250, .3) 100%) border-box;
}

/* ── 17.1 Cartes « instrument » ───────────────────────────────────────── */
html body #active-domain-card,
html body aside.sidebar-right .audio-player.ap-spatial,
html body aside.sidebar-right > div[onclick*="'health'"],
html body aside.sidebar-right .progress-bar-wrap,
html body aside.sidebar-right .live-feed {
  border: 1px solid transparent !important;
  background: var(--rgt-ticks), var(--rgt-grid), var(--rgt-face), var(--rgt-rim) !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, .05) inset,
    0 0 0 1px rgba(0, 0, 0, .25),
    0 22px 44px -26px rgba(0, 0, 0, .95) !important;
}
/* le domaine actif garde sa teinte : on la ré-applique en liseré gauche via outline interne */
html body #active-domain-card { border-left-width: 1px !important; }
html body aside.sidebar-right .live-feed {
  background: var(--rgt-ticks), var(--rgt-face), var(--rgt-rim) !important;
}

/* ── 17.2 Titres de section numérotés (canaux) ────────────────────────── */
html body aside.sidebar-right { counter-reset: rgt-sec; }
html body aside.sidebar-right .section-title { counter-increment: rgt-sec; }
html body aside.sidebar-right .section-title::after {
  content: counter(rgt-sec, decimal-leading-zero) !important;
  flex: 1;
  text-align: right;
  font-family: var(--lab-mono);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .04em;
  color: var(--lab-muted);
  height: auto !important;
  background: linear-gradient(var(--lab-line), var(--lab-line)) left center / calc(100% - 30px) 1px no-repeat !important;
}

/* ── 17.3 Domaine actif : statut « en ligne » ─────────────────────────── */
html body #active-domain-card { padding: 14px 16px !important; }
html body #adc-icon {
  background:
    radial-gradient(circle at 30% 25%, rgba(122, 167, 255, .22), transparent 65%),
    rgba(7, 11, 20, .6) !important;
  border: 1px solid rgba(122, 167, 255, .28) !important;
  box-shadow: 0 0 0 4px rgba(79, 140, 255, .06), inset 0 1px 0 rgba(255, 255, 255, .06);
}
html body #adc-label::after {
  /* pastille d'état décorative */
  content: '';
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-left: 8px;
  vertical-align: middle;
  border-radius: 50%;
  background: var(--lab-teal);
  box-shadow: 0 0 0 3px rgba(45, 212, 191, .16);
  animation: rgt-live 2.4s ease-in-out infinite;
}
@keyframes rgt-live {
  0%, 100% { box-shadow: 0 0 0 2px rgba(45, 212, 191, .14); }
  50%      { box-shadow: 0 0 0 5px rgba(45, 212, 191, .06); }
}

/* ── 17.4 Lecteur premium ─────────────────────────────────────────────── */
html body aside.sidebar-right .audio-player.ap-spatial { padding: 16px 14px 14px !important; }
/* anneau conique gradué autour de la pochette */
html body aside.sidebar-right .ap-cover-wrap::before,
html body aside.sidebar-right .ap-cover-wrap::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  border-radius: 50%;
  pointer-events: none;
  z-index: 1;
}
html body aside.sidebar-right .ap-cover-wrap::before {
  /* graduations façon cadran (72 traits) */
  width: 136px;
  height: 136px;
  margin: -68px 0 0 -68px;
  background: repeating-conic-gradient(rgba(148, 163, 184, .38) 0 .6deg, transparent .6deg 5deg);
  -webkit-mask: radial-gradient(circle, transparent 61px, #000 62px, #000 67px, transparent 68px);
          mask: radial-gradient(circle, transparent 61px, #000 62px, #000 67px, transparent 68px);
}
html body aside.sidebar-right .ap-cover-wrap::after {
  /* arc lumineux bleu→violet en rotation lente */
  width: 118px;
  height: 118px;
  margin: -59px 0 0 -59px;
  background: conic-gradient(from 0deg, transparent 0 55%, rgba(79, 140, 255, .0) 55%, rgba(79, 140, 255, .85) 82%, rgba(167, 139, 250, .95) 100%);
  -webkit-mask: radial-gradient(circle, transparent 57px, #000 58px);
          mask: radial-gradient(circle, transparent 57px, #000 58px);
  animation: rgt-orbit 9s linear infinite;
}
html body aside.sidebar-right .audio-player.ap-spatial.spatial-off .ap-cover-wrap::after {
  background: conic-gradient(transparent 0 70%, rgba(148, 163, 184, .45) 100%);
  animation-duration: 24s;
}
@keyframes rgt-orbit { to { transform: rotate(360deg); } }
html body aside.sidebar-right .ap-cover-orbit {
  width: 104px !important;
  height: 104px !important;
  border: 1px solid rgba(255, 255, 255, .1) !important;
  box-shadow:
    0 0 0 5px rgba(7, 11, 20, .7),
    0 18px 36px -14px rgba(0, 0, 0, .95),
    inset 0 0 0 1px rgba(255, 255, 255, .04) !important;
  background:
    repeating-radial-gradient(circle at 50% 50%, rgba(255, 255, 255, .025) 0 1px, transparent 1px 4px),
    radial-gradient(circle at 35% 30%, var(--lab-surface-3) 0%, var(--lab-bg) 100%) !important;
}
html body aside.sidebar-right .ap-cover-halo { width: 104px !important; height: 104px !important; }

/* titre de piste façon étiquette d'instrument */
html body aside.sidebar-right .audio-player.ap-spatial .ap-track-title { font-size: 15px !important; letter-spacing: -.005em !important; }
html body aside.sidebar-right .audio-player.ap-spatial .ap-track-idx {
  display: inline-block;
  margin-top: 6px !important;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(148, 163, 184, .08);
  border: 1px solid var(--lab-line);
}
html body aside.sidebar-right .audio-player.ap-spatial .ap-track-idx:empty { display: none; }

/* progression : rail fin avec repères au quart */
html body aside.sidebar-right .audio-player.ap-spatial .ap-progress-bar {
  background:
    linear-gradient(90deg, transparent calc(25% - 1px), rgba(148, 163, 184, .35) calc(25% - 1px) 25%, transparent 25% calc(50% - 1px), rgba(148, 163, 184, .35) calc(50% - 1px) 50%, transparent 50% calc(75% - 1px), rgba(148, 163, 184, .35) calc(75% - 1px) 75%, transparent 75%),
    var(--rgt-track) !important;
}
html body aside.sidebar-right .audio-player.ap-spatial .ap-progress-fill {
  background: linear-gradient(90deg, var(--lab-primary) 0%, var(--lab-primary-2) 60%, var(--lab-violet) 100%) !important;
}

/* plateau de transport */
html body aside.sidebar-right .ap-controls {
  gap: 12px !important;
  padding: 10px 10px 12px;
  border-radius: var(--lab-radius-sm);
  background: linear-gradient(180deg, rgba(7, 11, 20, .55), rgba(7, 11, 20, .25));
  border: 1px solid var(--lab-line);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .45);
}
html body aside.sidebar-right .ap-btn.ap-btn-main,
html body aside.sidebar-right .audio-player.ap-spatial .ap-btn-main {
  width: 50px !important;
  height: 50px !important;
  box-shadow:
    0 0 0 4px rgba(79, 140, 255, .12),
    0 10px 24px -8px rgba(79, 140, 255, .8),
    inset 0 1px 0 rgba(255, 255, 255, .3) !important;
}

/* ── 17.5 Jauge SANTÉ BASE : vu-mètre segmenté + graduation ──────────── */
html body aside.sidebar-right > div[onclick*="'health'"] { padding: 14px 16px 12px !important; }
html body #sidebar-health-score { font-size: 22px !important; font-weight: 600 !important; letter-spacing: -.02em; }
html body aside.sidebar-right > div[onclick*="'health'"] > div:nth-child(2) {
  position: relative;
  height: 12px !important;
  border-radius: 3px !important;
  overflow: hidden !important;
  /* 20 segments : le fond ET le remplissage (couleur JS) sont découpés */
  -webkit-mask: repeating-linear-gradient(90deg, #000 0 calc(5% - 2px), transparent calc(5% - 2px) 5%);
          mask: repeating-linear-gradient(90deg, #000 0 calc(5% - 2px), transparent calc(5% - 2px) 5%);
  background: rgba(148, 163, 184, .14) !important;
}
html body #sidebar-health-bar {
  border-radius: 0 !important;
  /* reflet vertical sur la couleur JS conservée */
  background-image: linear-gradient(180deg, rgba(255, 255, 255, .28), rgba(255, 255, 255, 0) 55%, rgba(0, 0, 0, .18)) !important;
}
html body #sidebar-health-label { margin-top: 8px !important; font-weight: 600; }

/* ── 17.6 ACTIVITÉ EN DIRECT : chronologie raffinée ────────────────────── */
html body aside.sidebar-right .live-feed { padding: 8px 14px 8px 12px !important; }
html body aside.sidebar-right .feed-item {
  padding: 9px 0 9px 22px !important;
  border-bottom: 0 !important;
}
/* rail vertical continu */
html body aside.sidebar-right .feed-item::after {
  content: '';
  position: absolute;
  left: 4px;
  top: 0;
  bottom: 0;
  width: 1px;
  background: linear-gradient(180deg, var(--lab-line-2), var(--lab-line));
}
html body aside.sidebar-right .feed-item:first-child::after { top: 14px; }
html body aside.sidebar-right .feed-item:last-child::after  { bottom: calc(100% - 16px); }
html body aside.sidebar-right .feed-item::before {
  left: 1px !important;
  top: 13px !important;
  width: 7px !important;
  height: 7px !important;
  z-index: 1;
  background: var(--lab-surface-solid) !important;
  border: 1.5px solid var(--lab-muted);
  box-sizing: border-box;
}
html body aside.sidebar-right .feed-item:first-child::before {
  background: var(--lab-teal) !important;
  border-color: var(--lab-teal);
  animation: rgt-live 2.4s ease-in-out infinite;
}
html body aside.sidebar-right .feed-item:first-child { color: var(--lab-text) !important; }
/* horodatage en puce */
html body aside.sidebar-right .feed-time {
  display: inline-block;
  padding: 1px 7px;
  margin-bottom: 3px;
  border-radius: 6px;
  background: rgba(79, 140, 255, .1);
  border: 1px solid rgba(122, 167, 255, .2);
}
html body aside.sidebar-right .feed-time + br { display: none; }
html body aside.sidebar-right .feed-time { display: table !important; white-space: nowrap !important; width: auto !important; margin: 0 0 5px !important; } /* heure sur sa propre ligne (le <br> est masqué) */

/* ── 17.7 PROGRESSION : stepper vertical numéroté ─────────────────────── */
html body aside.sidebar-right .progress-bar-wrap { padding: 14px 16px !important; }
html body aside.sidebar-right .progress-bar-pct { font-size: 22px !important; letter-spacing: -.02em; }
html body aside.sidebar-right .progress-bar-track {
  height: 10px !important;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .5);
}
/* graduation tous les 10 % sur la piste */
html body aside.sidebar-right .progress-bar-shine {
  background:
    repeating-linear-gradient(90deg, transparent 0 calc(10% - 1px), rgba(7, 11, 20, .55) calc(10% - 1px) 10%),
    linear-gradient(180deg, rgba(255, 255, 255, .16) 0%, transparent 60%) !important;
}

html body #progress-phases {
  counter-reset: rgt-step;
  gap: 0 !important;
  margin-top: 12px !important;
  padding-top: 12px !important;
}
html body #progress-phases > div {
  counter-increment: rgt-step;
  padding: 6px 0 6px 34px !important;
  min-height: 30px;
  display: flex;
  align-items: center;
  font-size: 13px !important;
  font-variant-numeric: tabular-nums;
}
/* pastille numérotée */
html body #progress-phases > div::before {
  content: counter(rgt-step) !important;
  left: 0 !important;
  top: 50% !important;
  width: 22px !important;
  height: 22px !important;
  margin-top: -11px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--lab-mono);
  font-size: 12px;
  font-weight: 600;
  color: var(--lab-muted);
  background: var(--lab-surface-solid) !important;
  border: 1.5px solid var(--lab-line-2) !important;
  box-shadow: none !important;
  z-index: 1;
}
/* liaison verticale entre étapes */
html body #progress-phases > div:not(:last-child)::after {
  content: '';
  position: absolute;
  left: 10.5px;
  top: calc(50% + 11px);
  height: calc(100% - 22px);
  width: 1.5px;
  background: var(--lab-line-2);
}
/* étape terminée */
html body #progress-phases > div[style*="30d158"]::before {
  content: '✓' !important;
  color: #04261a;
  background: var(--lab-green) !important;
  border-color: var(--lab-green) !important;
  box-shadow: 0 0 0 3px rgba(52, 211, 153, .15) !important;
}
html body #progress-phases > div[style*="30d158"]:not(:last-child)::after {
  background: linear-gradient(180deg, var(--lab-green), rgba(52, 211, 153, .35));
}
/* étape courante = première non terminée après une terminée (ou la toute première) */
html body #progress-phases > div[style*="30d158"] + div:not([style*="30d158"]),
html body #progress-phases > div:first-child:not([style*="30d158"]) {
  color: var(--lab-text) !important;
}
html body #progress-phases > div[style*="30d158"] + div:not([style*="30d158"])::before,
html body #progress-phases > div:first-child:not([style*="30d158"])::before {
  color: var(--lab-primary-2);
  border-color: var(--lab-primary) !important;
  animation: rgt-step-pulse 2s ease-in-out infinite;
}
@keyframes rgt-step-pulse {
  0%, 100% { box-shadow: 0 0 0 2px rgba(79, 140, 255, .18); }
  50%      { box-shadow: 0 0 0 6px rgba(79, 140, 255, .06); }
}

/* ── 17.8 Modales : liseré d'accent + trame ───────────────────────────── */
html body .help-popup,
html body .auth-modal-content,
html body .gpu-howto-content,
html body #presentation-content,
html body #report-popup-overlay > div,
html body #pdf-pw-modal > div,
html body .sco-box,
html body .imo-box,
html body .cmo-box,
html body .ktm-box {
  border: 1px solid transparent !important;
  background:
    linear-gradient(90deg, transparent, rgba(122, 167, 255, .7), rgba(167, 139, 250, .7), transparent) top center / 70% 1px no-repeat padding-box,
    radial-gradient(120% 60% at 50% 0%, rgba(79, 140, 255, .1), transparent 60%) padding-box,
    linear-gradient(180deg, rgba(30, 41, 59, .95) 0%, rgba(15, 23, 42, .97) 100%) padding-box,
    linear-gradient(160deg, rgba(122, 167, 255, .4), rgba(148, 163, 184, .14) 40%, rgba(167, 139, 250, .32)) border-box !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, .06) inset,
    0 40px 90px -30px rgba(0, 0, 0, .95),
    0 0 0 1px rgba(0, 0, 0, .3) !important;
}
/* les icônes emoji des petites modales posées dans un médaillon */
html body .sco-icon,
html body .imo-icon,
html body .cmo-icon {
  width: 72px;
  height: 72px;
  margin: 0 auto 18px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 34px !important;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, rgba(122, 167, 255, .2), rgba(7, 11, 20, .6) 70%);
  border: 1px solid rgba(122, 167, 255, .3);
  box-shadow: 0 0 0 6px rgba(79, 140, 255, .06);
}
/* scrim avec vignettage */
html body .help-overlay,
html body .auth-modal,
html body .gpu-howto-modal,
html body #presentation-overlay,
html body #report-popup-overlay,
html body #pdf-pw-modal,
html body #stop-confirm-overlay,
html body #info-modal-overlay,
html body #confirm-modal-overlay,
html body #key-test-modal {
  background: radial-gradient(120% 90% at 50% 40%, rgba(7, 11, 20, .55), rgba(3, 6, 12, .88)) !important;
}


/* ══ 18. LISIBILITÉ (priorité propriétaire) ═════════════════════════════
   Texte courant ≥ 12.5px, libellés ≥ 12px, chiffres en mono tabulaire,
   contraste élevé, pas de micro-texte majuscule. Placé en dernier. */
html body aside.sidebar-right .ap-row-lbl { min-width: 94px !important; }
html body aside.sidebar-right .ap-row-lbl,
html body aside.sidebar-right .ap-eq-label,
html body aside.sidebar-right .progress-bar-sub,
html body aside.sidebar-right > div[onclick*="'health'"] > div:first-child > span:first-child {
  color: var(--lab-text-2) !important;
}
html body aside.sidebar-right .ap-track-num,
html body aside.sidebar-right .ap-times,
html body aside.sidebar-right .feed-time,
html body aside.sidebar-right .ap-row-val,
html body aside.sidebar-right .ap-eq-val,
html body #progress-pct,
html body #sidebar-health-score {
  font-variant-numeric: tabular-nums slashed-zero;
}
html body aside.sidebar-right .feed-item,
html body #progress-phases > div,
html body aside.sidebar-right .ap-ti-title,
html body #adc-desc,
html body #sidebar-health-label { font-size: 13px !important; }
html body aside.sidebar-right .ap-ti-artist,
html body aside.sidebar-right .ap-track-artist { font-size: 12.5px !important; color: var(--lab-text-2) !important; }
html body aside.sidebar-right .ap-select { font-size: 13px !important; }

/* ==== 40-fx.css ==== */
/* ═══ SCI-AUTONOME — couche FX « Laboratoire moderne » (40-fx) ═══
   Uniquement des éléments préfixés .scifx-* / #scifx-* créés par 40-fx.js,
   plus des anneaux de focus clavier globaux. Aucune règle sur la mise en page. */

/* ── 1. Fond : réseau moléculaire (canvas) ─────────────────────────── */
#scifx-bg {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: -2;               /* entre les décors existants (-4/-3) et la grille (-1) */
  pointer-events: none;
  opacity: .5;               /* très discret : ne gêne jamais la lecture */
  contain: strict;
}

/* ── 2. KPI : compteur animé, delta, sparkline ─────────────────────── */
.hstat { position: relative; }

/* Pendant l'interpolation, la valeur réelle (écrite par l'app) reste dans le DOM
   mais est rendue transparente ; l'overlay affiche la valeur interpolée. */
.hstat[data-scifx-tw] > .hstat-val {
  -webkit-text-fill-color: transparent !important;
  text-shadow: none !important;
}
.scifx-ticker {
  position: absolute;
  box-sizing: border-box;
  pointer-events: none;
  white-space: nowrap;
  overflow: visible;
  font-variant-numeric: tabular-nums;
  display: none;
}
.hstat[data-scifx-tw] > .scifx-ticker { display: block; }

.scifx-delta {
  position: absolute;
  top: -14px;
  right: -6px;
  padding: 1px 5px;
  border-radius: 999px;
  font: 600 11px/1.4 var(--lab-mono);
  letter-spacing: .02em;
  color: var(--lab-teal);
  background: color-mix(in srgb, var(--lab-teal) 14%, transparent);
  border: 1px solid color-mix(in srgb, var(--lab-teal) 35%, transparent);
  pointer-events: none;
  white-space: nowrap;
  animation: scifx-delta-rise 1.6s var(--lab-ease) forwards;
}
.scifx-delta.is-neg {
  color: var(--lab-amber);
  background: color-mix(in srgb, var(--lab-amber) 14%, transparent);
  border-color: color-mix(in srgb, var(--lab-amber) 35%, transparent);
}
@keyframes scifx-delta-rise {
  0%   { opacity: 0; }
  12%  { opacity: 1; }
  75%  { opacity: 1; }
  100% { opacity: 0; }
}

.hstat[data-scifx-pulse] > .hstat-val {
  animation: scifx-kpi-pulse .9s var(--lab-ease);
}
@keyframes scifx-kpi-pulse {
  0%   { filter: drop-shadow(0 0 0 transparent); }
  30%  { filter: drop-shadow(0 0 6px color-mix(in srgb, var(--lab-cyan) 70%, transparent)); }
  100% { filter: drop-shadow(0 0 0 transparent); }
}

.scifx-spark {
  position: absolute;
  left: 50%;
  bottom: -5px;
  width: 44px;
  height: 9px;
  transform: translateX(-50%);
  pointer-events: none;
  overflow: visible;
  opacity: 0;
  transition: opacity .6s var(--lab-ease);
}
.scifx-spark.is-ready { opacity: .85; }
.scifx-spark .scifx-spark-line {
  fill: none;
  stroke: var(--lab-cyan);
  stroke-width: 1.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}
.scifx-spark .scifx-spark-area { fill: url(#scifx-spark-grad); stroke: none; }
.scifx-spark .scifx-spark-dot { fill: var(--lab-teal); }

/* ── 3. Palette de commandes (Alt+K / Ctrl⇧K) ──────────────────────── */
#scifx-palette {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: none;
  align-items: flex-start;
  justify-content: center;
  padding: 12vh var(--s4) var(--s4);
  background: rgba(3, 6, 12, .55);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  font-family: var(--lab-font);
}
#scifx-palette.is-open { display: flex; animation: scifx-fade .16s var(--lab-ease); }
@keyframes scifx-fade { from { opacity: 0; } to { opacity: 1; } }

.scifx-pal-box {
  width: min(560px, 100%);
  max-height: 70vh;
  display: flex;
  flex-direction: column;
  background: var(--lab-surface-solid);
  border: 1px solid var(--lab-line-2);
  border-radius: var(--lab-radius);
  box-shadow: var(--lab-shadow-hi);
  overflow: hidden;
  animation: scifx-pop .2s var(--lab-ease);
}
@keyframes scifx-pop {
  from { opacity: 0; transform: translateY(-8px) scale(.985); }
  to   { opacity: 1; transform: none; }
}
.scifx-pal-head {
  display: flex;
  align-items: center;
  gap: var(--s3);
  padding: var(--s3) var(--s4);
  border-bottom: 1px solid var(--lab-line);
}
.scifx-pal-glyph {
  flex: none;
  font: 600 13px/1 var(--lab-mono);
  color: var(--lab-primary-2);
  letter-spacing: .08em;
}
.scifx-pal-input {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--lab-text);
  font: 500 15px/1.4 var(--lab-font);
  padding: var(--s1) 0;
}
.scifx-pal-input::placeholder { color: var(--lab-muted); }
.scifx-pal-list {
  list-style: none;
  margin: 0;
  padding: var(--s2);
  overflow-y: auto;
  overscroll-behavior: contain;
}
.scifx-pal-group {
  padding: var(--s2) var(--s3) var(--s1);
  font: 600 13px/1.4 var(--lab-mono);
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--lab-muted);
}
.scifx-pal-opt {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s3);
  padding: 9px var(--s3);
  border-radius: var(--lab-radius-xs);
  color: var(--lab-text-2);
  font: 500 14px/1.4 var(--lab-font);
  cursor: pointer;
}
.scifx-pal-opt[aria-selected="true"] {
  background: color-mix(in srgb, var(--lab-primary) 18%, transparent);
  color: var(--lab-text);
  box-shadow: inset 2px 0 0 var(--lab-primary);
}
.scifx-pal-opt mark {
  background: none;
  color: var(--lab-cyan);
  font-weight: 700;
}
.scifx-pal-hint {
  flex: none;
  font: 500 13px/1 var(--lab-mono);
  color: var(--lab-muted);
}
.scifx-pal-empty {
  padding: var(--s5) var(--s3);
  text-align: center;
  color: var(--lab-muted);
  font-size: 14px;
}
.scifx-pal-foot {
  display: flex;
  gap: var(--s4);
  padding: var(--s2) var(--s4);
  border-top: 1px solid var(--lab-line);
  font: 500 13px/1.4 var(--lab-mono);
  color: var(--lab-muted);
}
.scifx-pal-foot kbd, .scifx-pal-trigger kbd {
  font: inherit;
  padding: 1px 5px;
  border: 1px solid var(--lab-line-2);
  border-radius: 4px;
  color: var(--lab-text-2);
  background: var(--lab-surface-3);
}

.scifx-pal-trigger {
  position: fixed;
  right: var(--s4);
  bottom: var(--s4);
  z-index: 9000;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border: 1px solid var(--lab-line-2);
  border-radius: 999px;
  background: var(--lab-surface);
  -webkit-backdrop-filter: var(--lab-blur);
  backdrop-filter: var(--lab-blur);
  color: var(--lab-muted);
  font: 500 13px/1.2 var(--lab-mono);
  letter-spacing: .02em;
  cursor: pointer;
  opacity: .72;
  transition: opacity .2s var(--lab-ease), color .2s var(--lab-ease), border-color .2s var(--lab-ease);
}
.scifx-pal-trigger:hover { opacity: 1; color: var(--lab-text); border-color: var(--lab-primary); }

.scifx-sr {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0; border: 0;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}

/* ── 4. Anneaux de focus clavier (WCAG 2.4.7) ──────────────────────── */
:where(button, a[href], input, select, textarea, summary, [tabindex]:not([tabindex="-1"]), [contenteditable="true"]):focus-visible {
  outline: 2px solid var(--lab-primary-2) !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--lab-primary) 22%, transparent);
}
.scifx-pal-input:focus-visible { outline: none !important; box-shadow: none; }

@media (max-width: 640px) {
  .scifx-spark { display: none; }
  .scifx-pal-trigger { right: var(--s3); bottom: var(--s3); }
  #scifx-palette { padding-top: 8vh; }
}

/* ==== 50-polish.css ==== */
/* ═══ 50 — Finitions d'assemblage (chef d'orchestre) ═══ */

/* Fond : plus de scène spatiale (planètes, particules) — fond « laboratoire » : nuit profonde + réseau moléculaire (FX) */
html body #space-journey,
html body #planet-labels,
html body #cia-bg,
html body #particles-canvas,
html body #const-canvas { display: none !important; }
html, html body { background: radial-gradient(1400px 700px at 70% -10%, rgba(79,140,255,.10), transparent 60%),
                               radial-gradient(1000px 600px at -10% 110%, rgba(45,212,191,.07), transparent 60%),
                               var(--lab-bg) !important; background-attachment: fixed !important; }

/* Lecteur : bloc titre/artiste dans le flux (plus de chevauchement avec la pochette ni la barre) */
html body aside.sidebar-right #audio-player .ap-track {
  height: auto !important; min-height: 0 !important; overflow: visible !important;
  display: block !important; margin: 18px 0 8px !important; text-align: center;
}
html body aside.sidebar-right #audio-player .ap-track-info-wrap { position: static !important; transform: none !important; }
html body aside.sidebar-right #audio-player .ap-progress-wrap { margin-top: 6px !important; }

/* Domaine actif : la carte prend sa hauteur réelle */
html body #active-domain-card { height: auto !important; min-height: 0 !important; overflow: visible !important; }

/* Typographie scientifique : plus aucune police « hacker » (Orbitron / Share Tech Mono), y compris dans les styles posés par le JS */
html body { font-family: var(--lab-font) !important; font-feature-settings: "kern", "liga", "calt"; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
html body [style*="Orbitron"], html body [style*="orbitron"] { font-family: var(--lab-font) !important; letter-spacing: .01em !important; }
html body [style*="Share Tech"], html body [style*="monospace"] { font-family: var(--lab-mono) !important; }
html body .hstat-val, html body [id^="stat-"], html body .kpi-value, html body .ap-times, html body #mission-time { font-variant-numeric: tabular-nums slashed-zero; }

/* ==== 70-views.css ==== */
/* ═══════════════════════════════════════════════════════════════════════════
   SCI-AUTONOME — thème « Laboratoire moderne »
   70-views.css — vues secondaires & overlays (chargé après 50, avant 60)

   Sommaire
     0.  Jetons locaux --v70-*
     1.  Barres d'outils « instrument » (graphe, réseau, logs)
     2.  GRAPHE : barre, groupe zoom, compteurs, cadre, légende, infobulle
     3.  États vides compacts & informatifs (rapports, recherche, timeline…)
     4.  LOGS SYSTÈME
     5.  TIMELINE
     6.  RÉSEAU des rapports
     7.  COMPARAISON
     8.  SANTÉ BDD
     9.  HISTORIQUE
     10. Simulateur cinétique Michaelis-Menten (sidebar droite)
     11. Système de modales commun (feuille, en-tête, fermer, boutons)
     12. Aide (#help-overlay)
     13. Mode présentation
     14. Popup rapport (openReportPopup) — typographie de publication
     15. Authentification (démo) & modale PDF chiffré
     16. Toasts
     17. Bannière d'expiration de licence
     18. Responsive local

   Règles : CSS seul, préfixe `html body`, !important uniquement contre les
   style="" inline / cssText ; jamais de display:none sur un contrôle.
   ═══════════════════════════════════════════════════════════════════════════ */


/* ── 0. JETONS LOCAUX ───────────────────────────────────────────────────── */
html body {
  --v70-sheet:
    linear-gradient(180deg, rgba(30, 41, 59, .96) 0%, rgba(15, 23, 42, .98) 100%);
  --v70-well: color-mix(in srgb, var(--lab-bg) 78%, transparent);
  --v70-hair: var(--lab-line);
  --v70-hair-2: var(--lab-line-2);
  --v70-acc-soft: color-mix(in srgb, var(--lab-primary) 14%, transparent);
  --v70-acc-line: color-mix(in srgb, var(--lab-primary-2) 42%, transparent);
  --v70-ok-soft: color-mix(in srgb, var(--lab-green) 13%, transparent);
  --v70-ok-line: color-mix(in srgb, var(--lab-green) 40%, transparent);
  --v70-warn-soft: color-mix(in srgb, var(--lab-amber) 13%, transparent);
  --v70-warn-line: color-mix(in srgb, var(--lab-amber) 40%, transparent);
  --v70-err-soft: color-mix(in srgb, var(--lab-red) 13%, transparent);
  --v70-err-line: color-mix(in srgb, var(--lab-red) 42%, transparent);
  --v70-label: 600 11.5px/1.3 var(--lab-font);
  --v70-serif: var(--lab-serif, 'Source Serif 4', Georgia, serif);
  --v70-btn-h: 36px;
}


/* ══ 1. BARRES D'OUTILS « INSTRUMENT » ═════════════════════════════════════ */
html body main.center-panel .graph-controls,
html body main.center-panel .logs-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding: 8px;
  margin: 12px 0;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--lab-surface-3) 55%, transparent), transparent),
    var(--lab-surface);
  -webkit-backdrop-filter: var(--lab-blur);
  backdrop-filter: var(--lab-blur);
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius);
  box-shadow: var(--lab-shadow);
}
html body main.center-panel .graph-controls .graph-btn,
html body main.center-panel .logs-controls .util-btn {
  min-height: var(--v70-btn-h);
  padding: 7px 12px;
  font-size: 12.5px;
  letter-spacing: .02em;
  white-space: nowrap;
}


/* ══ 2. GRAPHE ═════════════════════════════════════════════════════════════ */

/* 2.1 Premier bouton (ACTUALISER) = action principale de la barre */
html body #tab-graph .graph-controls > .graph-btn:first-child,
html body #tab-network .graph-controls > .graph-btn:first-child {
  color: #fff !important;
  background: linear-gradient(180deg, var(--lab-primary-2), var(--lab-primary)) !important;
  border-color: color-mix(in srgb, var(--lab-primary-2) 70%, transparent) !important;
  box-shadow: 0 10px 22px -14px var(--lab-primary), 0 1px 0 rgba(255,255,255,.18) inset;
}
html body #tab-graph .graph-controls > .graph-btn:first-child:hover,
html body #tab-network .graph-controls > .graph-btn:first-child:hover {
  filter: brightness(1.08);
  background: linear-gradient(180deg, var(--lab-primary-2), var(--lab-primary)) !important;
}

/* 2.2 Groupe segmenté RECENTRER · ＋ · － (boutons 3-4-5) */
html body #tab-graph .graph-controls > .graph-btn:nth-child(3) {
  margin-left: 6px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
html body #tab-graph .graph-controls > .graph-btn:nth-child(4) {
  margin-left: -7px;
  border-radius: 0;
}
html body #tab-graph .graph-controls > .graph-btn:nth-child(5) {
  margin-left: -7px;
  margin-right: 6px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
html body #tab-graph .graph-controls > .graph-btn:nth-child(4),
html body #tab-graph .graph-controls > .graph-btn:nth-child(5) {
  min-width: 64px;
  font-variant-numeric: tabular-nums;
}
html body #tab-graph .graph-controls > .graph-btn:nth-child(n+3):nth-child(-n+5):hover { transform: none; position: relative; z-index: 1; }

/* PAUSE : état clair (le JS change le texte ▶/⏸) */
html body #graph-anim-btn { min-width: 96px; }

/* 2.3 Recherche de nœud : champ à loupe intégré */
html body main.center-panel #graph-search-input {
  flex: 1 1 180px;
  max-width: 260px;
  min-height: var(--v70-btn-h);
  padding-left: 12px;
  font-size: 13px;
}

/* 2.4 Compteurs Nœuds / Edges → lecture d'instrument */
html body main.center-panel #tab-graph .graph-controls > span {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  margin-left: auto !important;
  padding: 6px 12px !important;
  font-family: var(--lab-mono) !important;
  font-size: 12px !important;
  color: var(--lab-muted) !important;
  background: var(--v70-well);
  border: 1px solid var(--lab-line);
  border-radius: 999px;
  white-space: nowrap;
}
html body main.center-panel #graph-nodes,
html body main.center-panel #graph-edges {
  font-family: var(--lab-mono);
  font-size: 13px;
  font-weight: 600;
  color: var(--lab-text) !important;
  font-variant-numeric: tabular-nums slashed-zero;
}

/* 2.5 Cadre du canvas : légère profondeur + liseré d'accent en haut
   (pas d'!important : le plein écran pose ses styles inline) */
html body main.center-panel #graphCanvas {
  box-shadow:
    0 1px 0 color-mix(in srgb, var(--lab-primary-2) 22%, transparent) inset,
    0 0 0 1px rgba(0, 0, 0, .25),
    0 22px 48px -28px rgba(0, 0, 0, .9);
  cursor: grab;
}
html body main.center-panel #graphCanvas:active { cursor: grabbing; }

/* 2.6 Légende : bande unique, puces lisibles, aide d'interaction en kbd */
html body main.center-panel #graph-legend {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
  padding: 8px 10px;
  background: color-mix(in srgb, var(--lab-surface) 80%, transparent);
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius-sm);
}
html body main.center-panel #graph-legend .legend-item {
  display: inline-flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center;
  white-space: nowrap;
  min-height: 28px;
  padding: 3px 11px;
  font-size: 12.5px;
  font-weight: 500;
}
html body main.center-panel #graph-legend .legend-item span { color: var(--lab-text-2) !important; }
html body main.center-panel #graph-legend .legend-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  box-shadow: 0 0 0 2px rgba(0, 0, 0, .35);
}
/* séparateur avant les types de liens */
html body main.center-panel #graph-legend .legend-item[style*="margin-left"] {
  margin-left: 6px !important;
  position: relative;
}
html body main.center-panel #graph-legend .legend-item[style*="margin-left"]::before {
  content: '';
  position: absolute;
  left: -7px;
  top: 5px;
  bottom: 5px;
  width: 1px;
  background: var(--lab-line-2);
}
/* traits Active / Inhibe : plus épais, pleinement lisibles */
html body main.center-panel #graph-legend .legend-item > div[style*="height:2px"] {
  height: 3px !important;
  width: 22px !important;
  opacity: .9 !important;
  border-radius: 2px;
}
html body main.center-panel #graph-legend > div:last-child:not(.legend-item) {
  margin-left: auto !important;
  padding: 4px 10px;
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  letter-spacing: 0 !important;
  color: var(--lab-muted) !important;
  border: 1px dashed var(--lab-line-2);
  border-radius: var(--lab-radius-xs);
}

/* 2.7 Infobulle du graphe (#graph-tooltip, hors <main>) — position/display = JS */
html body #graph-tooltip,
html body .graph-tooltip {
  min-width: 160px;
  max-width: 280px !important;
  padding: 10px 13px 10px 13px !important;
  font-family: var(--lab-font) !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  color: var(--lab-text) !important;
  background:
    linear-gradient(90deg, var(--lab-primary-2), var(--lab-violet)) top left / 100% 2px no-repeat,
    rgba(13, 19, 33, .97) !important;
  border: 1px solid var(--lab-line-2) !important;
  border-radius: var(--lab-radius-sm) !important;
  box-shadow: 0 18px 40px -16px rgba(0, 0, 0, .95), 0 0 0 1px rgba(0, 0, 0, .3) !important;
  z-index: 10050 !important;
}
html body #graph-tooltip > div:first-child {
  font-size: 13.5px;
  font-weight: 600 !important;
  line-height: 1.35;
  margin-bottom: 4px !important;
  word-break: break-word;
}
html body #graph-tooltip > div:nth-child(2) {
  display: inline-block;
  padding: 1px 8px;
  font: var(--v70-label);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--lab-text-2) !important;
  background: rgba(148, 163, 184, .1);
  border: 1px solid var(--lab-line);
  border-radius: 999px;
}
html body #network-tooltip {
  padding: 10px 13px !important;
  font-size: 13px !important;
  max-width: 300px !important;
  background:
    linear-gradient(90deg, var(--lab-violet), var(--lab-primary-2)) top left / 100% 2px no-repeat,
    rgba(13, 19, 33, .97) !important;
}


/* ══ 3. ÉTATS VIDES COMPACTS & INFORMATIFS ═════════════════════════════════
   Gabarit : [anneau] titre / ligne d'aide — sur 2 lignes, hauteur ≈ 76px.
   La ligne d'aide est un ::after (texte statique, aucune donnée inventée). */
html body main.center-panel #reports-container > p:only-child,
html body main.center-panel #search-results > p:only-child,
html body main.center-panel #compare-result > p:only-child,
html body main.center-panel #history-container > p:only-child,
html body main.center-panel #timeline-container > p:only-child {
  display: grid !important;
  grid-template-columns: auto 1fr;
  column-gap: 14px;
  row-gap: 2px;
  align-items: center;
  max-width: 640px;
  margin: 6px 0 0 !important;
  padding: 14px 18px !important;
  text-align: left !important;
  font-family: var(--lab-font) !important;
  font-size: 13.5px !important;
  font-weight: 600;
  line-height: 1.4 !important;
  color: var(--lab-text) !important;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--lab-primary) 8%, transparent), transparent 60%),
    color-mix(in srgb, var(--lab-surface-2) 60%, transparent) !important;
  border: 1px solid var(--lab-line-2) !important;
  border-left: 3px solid var(--lab-primary) !important;
  border-radius: var(--lab-radius-sm) !important;
}
html body main.center-panel #reports-container > p:only-child::before,
html body main.center-panel #search-results > p:only-child::before,
html body main.center-panel #compare-result > p:only-child::before,
html body main.center-panel #history-container > p:only-child::before,
html body main.center-panel #timeline-container > p:only-child::before {
  grid-column: 1;
  grid-row: 1 / span 2;
  width: 36px !important;
  height: 36px !important;
  margin: 0 !important;
}
html body main.center-panel #reports-container > p:only-child::after,
html body main.center-panel #search-results > p:only-child::after,
html body main.center-panel #compare-result > p:only-child::after,
html body main.center-panel #history-container > p:only-child::after,
html body main.center-panel #timeline-container > p:only-child::after {
  grid-column: 2;
  font-family: var(--lab-font);
  font-size: 12.5px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--lab-muted);
}
html body main.center-panel #reports-container > p:only-child::after {
  content: '①  Lancez un cycle complet (phases 1 → 5) depuis le pipeline, à gauche.\A ②  La phase 5 rédige chaque pré-print : hypothèse, méthode, confiance.\A ③  Filtrez par domaine ou confiance ≥, puis ouvrez, exportez (CSV · JSON) ou présentez.';
  white-space: pre-line;
  margin-top: 4px;
  line-height: 1.7;
}
html body main.center-panel #search-results > p:only-child::after {
  content: 'Plein texte sur concepts, relations, rapports et articles · portée réglable · Entrée ↵ pour lancer.';
}
html body main.center-panel #compare-result > p:only-child::after {
  content: 'Score de compatibilité, similitudes, synergies, contradictions et hypothèse combinée.';
}
html body main.center-panel #history-container > p:only-child::after {
  content: 'Chaque session enregistre domaine, phase, résultat et volumes (concepts · relations · hypothèses).';
}
html body main.center-panel #timeline-container > p:only-child::after {
  content: 'Chaque hypothèse validée apparaît ici, datée, avec sa confiance et son rapport.';
}
/* erreurs : même gabarit, accent rouge */
html body main.center-panel #search-results > p[style*="color:var(--cyber)"]:only-child,
html body main.center-panel #compare-result > p[style*="color:var(--cyber)"]:only-child {
  color: var(--lab-red) !important;
  border-left-color: var(--lab-red) !important;
  background: var(--v70-err-soft) !important;
}
html body main.center-panel #search-results > p[style*="color:var(--cyber)"]:only-child::after,
html body main.center-panel #compare-result > p[style*="color:var(--cyber)"]:only-child::after { content: none; }
html body main.center-panel #search-results > p[style*="color:var(--cyber)"]:only-child::before,
html body main.center-panel #compare-result > p[style*="color:var(--cyber)"]:only-child::before { content: none; }

/* Rapports : la bibliothèque ne laisse pas un grand vide sous l'état vide */
html body main.center-panel #reports-container:has(> p:only-child) { min-height: 0 !important; }


/* ══ 4. LOGS SYSTÈME ═══════════════════════════════════════════════════════ */
html body main.center-panel .logs-controls .logs-info,
html body main.center-panel #logs-info {
  margin-left: auto !important;
  padding: 6px 12px;
  font-family: var(--lab-mono) !important;
  font-size: 12px !important;
  color: var(--lab-text-2) !important;
  background: var(--v70-well);
  border: 1px solid var(--lab-line);
  border-radius: 999px;
  font-variant-numeric: tabular-nums slashed-zero;
  white-space: nowrap;
}
html body main.center-panel .logs-controls > .util-btn:first-child {
  color: #fff !important;
  background: linear-gradient(180deg, var(--lab-primary-2), var(--lab-primary)) !important;
  border-color: color-mix(in srgb, var(--lab-primary-2) 70%, transparent) !important;
}
html body main.center-panel #sys-logs {
  min-height: 320px;
  font-variant-numeric: tabular-nums;
}
html body main.center-panel #sys-logs .log-line { font-size: 12.5px; }


/* ══ 5. TIMELINE ═══════════════════════════════════════════════════════════ */
/* « ✓ Complétée » → pastille d'état */
html body main.center-panel #timeline-container span[style*="color:#30d158"] {
  display: inline-block;
  padding: 0 8px;
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
  color: var(--lab-green) !important;
  background: var(--v70-ok-soft);
  border: 1px solid var(--v70-ok-line);
  border-radius: 999px;
}
html body main.center-panel #timeline-container > div > div:first-child > div:first-child {
  font-size: 18px !important;
  line-height: 1;
}
html body main.center-panel #timeline-container > div > div:nth-child(2) > div:nth-child(2) {
  font-variant-numeric: tabular-nums;
  line-height: 1.8;
}


/* ══ 6. RÉSEAU DES RAPPORTS ════════════════════════════════════════════════ */
html body main.center-panel #network-info {
  display: inline-flex;
  align-items: center;
  margin-left: auto !important;
  padding: 6px 12px;
  font-family: var(--lab-mono) !important;
  font-size: 12px !important;
  color: var(--lab-text-2) !important;
  background: var(--v70-well);
  border: 1px solid var(--lab-line);
  border-radius: 999px;
  font-variant-numeric: tabular-nums;
}
html body main.center-panel #networkCanvas {
  box-shadow:
    0 1px 0 color-mix(in srgb, var(--lab-violet) 25%, transparent) inset,
    0 22px 48px -28px rgba(0, 0, 0, .9) !important;
}
/* Légende du réseau (le canvas n'en dessine pas) : couleurs = celles du JS */
html body main.center-panel #tab-network::after {
  content: 'Médical · Cyber · Tech · Physique     —     nœud = rapport · lien = concepts partagés · survol = détails';
  display: block;
  margin-top: 10px;
  padding: 8px 12px 8px 128px;
  font-family: var(--lab-font);
  font-size: 12px;
  line-height: 1.5;
  color: var(--lab-muted);
  white-space: pre-wrap;
  background:
    radial-gradient(circle at 18px 50%, #00e5ff 0 4.5px, transparent 5px),
    radial-gradient(circle at 44px 50%, #ff2d6b 0 4.5px, transparent 5px),
    radial-gradient(circle at 70px 50%, #ff9f0a 0 4.5px, transparent 5px),
    radial-gradient(circle at 96px 50%, #30d158 0 4.5px, transparent 5px),
    linear-gradient(90deg, transparent 114px, var(--lab-line-2) 114px 115px, transparent 115px),
    color-mix(in srgb, var(--lab-surface) 80%, transparent);
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius-sm);
}


/* ══ 7. COMPARAISON ════════════════════════════════════════════════════════ */
html body main.center-panel #tab-compare > div[style*="grid"] {
  position: relative;
  gap: 40px !important;
  padding: 14px;
  background: var(--lab-surface);
  -webkit-backdrop-filter: var(--lab-blur);
  backdrop-filter: var(--lab-blur);
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius);
  box-shadow: var(--lab-shadow);
}
/* symbole ⇄ entre A et B */
html body main.center-panel #tab-compare > div[style*="grid"]::after {
  content: '⇄';
  position: absolute;
  left: 50%;
  top: calc(50% + 11px);
  transform: translate(-50%, -50%);
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  font-size: 15px;
  color: var(--lab-primary-2);
  background: var(--lab-surface-solid);
  border: 1px solid var(--v70-acc-line);
  border-radius: 50%;
  pointer-events: none;
}
/* libellés RAPPORT A / RAPPORT B → pastille lettrée */
html body main.center-panel #tab-compare > div[style*="grid"] > div > div:first-child {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px !important;
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  font-weight: 700;
  letter-spacing: .08em !important;
  color: var(--lab-text-2) !important;
}
html body main.center-panel #tab-compare > div[style*="grid"] > div > div:first-child::before {
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  font-family: var(--lab-mono);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0;
  border-radius: 6px;
}
html body main.center-panel #tab-compare > div[style*="grid"] > div:first-child > div:first-child::before {
  content: 'A';
  color: var(--lab-primary-2);
  background: var(--v70-acc-soft);
  border: 1px solid var(--v70-acc-line);
}
html body main.center-panel #tab-compare > div[style*="grid"] > div:last-child > div:first-child::before {
  content: 'B';
  color: var(--lab-violet);
  background: color-mix(in srgb, var(--lab-violet) 14%, transparent);
  border: 1px solid color-mix(in srgb, var(--lab-violet) 42%, transparent);
}
html body main.center-panel #compare-file-a,
html body main.center-panel #compare-file-b { min-height: 40px; font-size: 13px !important; }
html body main.center-panel #btn-compare { min-height: 44px; font-size: 13.5px; }

/* résultat : score en jauge, recommandation en pastille */
html body main.center-panel #compare-result > div {
  font-family: var(--lab-font) !important;
  font-size: 13.5px !important;
}
html body main.center-panel #compare-result > div > div:first-child {
  gap: 18px !important;
  align-items: center !important;
}
html body main.center-panel #compare-result > div > div:first-child > div:first-child {
  min-width: 108px;
  padding: 10px 14px;
  text-align: center;
  font-family: var(--lab-mono) !important;
  font-size: 30px !important;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  background: var(--v70-well);
  border: 1px solid var(--lab-line-2);
  border-radius: var(--lab-radius-sm);
}
html body main.center-panel #compare-result > div > div:first-child > div:nth-child(2) > div:first-child {
  font: var(--v70-label) !important;
  letter-spacing: .08em !important;
  color: var(--lab-muted) !important;
  margin-bottom: 4px;
}
html body main.center-panel #compare-result > div > div:first-child > div:nth-child(2) > div:last-child {
  display: inline-block;
  padding: 2px 10px;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  letter-spacing: .05em;
  border: 1px solid currentColor;
  border-radius: 999px;
}
html body main.center-panel #compare-result > div > div:first-child > div:last-child {
  font-size: 13.5px;
  line-height: 1.65;
}
html body main.center-panel #compare-result > div > div:not(:first-child):not([style*="border-left"]) {
  margin-bottom: 12px !important;
  padding: 10px 14px;
  background: color-mix(in srgb, var(--lab-surface-2) 55%, transparent);
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius-sm);
}
html body main.center-panel #compare-result > div > div:not(:first-child) > div:first-child {
  font-size: 12px !important;
}
html body main.center-panel #compare-result > div > div:not(:first-child) > div:not(:first-child) {
  font-size: 13.5px !important;
  line-height: 1.6;
}
html body main.center-panel #compare-result div[style*="border-left:3px solid var(--active)"] > div:last-child {
  font-family: var(--v70-serif) !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
}


/* ══ 8. SANTÉ BDD ══════════════════════════════════════════════════════════ */
/* en-tête : cadran (canvas JS) dans un médaillon */
html body main.center-panel #tab-health > div[style*="display:flex"] {
  gap: 22px !important;
  padding: 18px 20px !important;
}
html body main.center-panel #healthGaugeCanvas {
  flex: 0 0 auto;
  padding: 10px 12px 6px;
  background:
    radial-gradient(120% 100% at 50% 100%, color-mix(in srgb, var(--lab-primary) 10%, transparent), transparent 70%),
    var(--v70-well);
  border: 1px solid var(--lab-line-2);
  border-radius: var(--lab-radius-sm);
  box-sizing: content-box;
}
html body main.center-panel #health-score-val {
  font-family: var(--lab-mono) !important;
  font-size: 34px !important;
  font-weight: 600 !important;
  font-variant-numeric: tabular-nums slashed-zero;
}
html body main.center-panel #health-score-val + div {
  font: var(--v70-label) !important;
  letter-spacing: .1em !important;
  color: var(--lab-muted) !important;
}
html body main.center-panel #health-label {
  padding: 3px 10px;
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  border: 1px solid currentColor;
  border-radius: 999px;
  background: rgba(148, 163, 184, .06);
}
/* grille de métriques : 4 colonnes en large, témoin d'état coloré */
html body main.center-panel #health-metrics {
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)) !important;
  gap: 10px !important;
}
html body main.center-panel #health-metrics > div {
  position: relative;
  padding: 14px 16px 12px !important;
  border-left: 3px solid var(--lab-amber) !important;
}
html body main.center-panel #health-metrics > div:has(> div[style*="#30d158"]) {
  border-left-color: var(--lab-green) !important;
}
html body main.center-panel #health-metrics > div > div:first-child {
  font: var(--v70-label) !important;
  letter-spacing: .08em !important;
  text-transform: uppercase;
  color: var(--lab-muted) !important;
}
html body main.center-panel #health-metrics > div > div:last-child {
  margin-top: 6px !important;
  font-family: var(--lab-mono) !important;
  font-size: 22px !important;
  font-weight: 600;
  letter-spacing: -.01em !important;
  font-variant-numeric: tabular-nums slashed-zero;
}
html body main.center-panel #health-metrics > div::after {
  content: 'à surveiller';
  position: absolute;
  top: 12px;
  right: 12px;
  font-size: 11.5px;
  font-weight: 500;
  color: var(--lab-amber);
}
html body main.center-panel #health-metrics > div:has(> div[style*="#30d158"])::after {
  content: 'ok';
  color: var(--lab-green);
}
html body main.center-panel #tab-health > .util-btn {
  min-height: 40px;
  margin-top: 14px !important;
}


/* ══ 9. HISTORIQUE ═════════════════════════════════════════════════════════ */
html body main.center-panel #history-container > div:first-child:not([style*="border-bottom"]) {
  display: inline-block;
  padding: 4px 12px;
  font-family: var(--lab-mono) !important;
  font-size: 12px !important;
  color: var(--lab-text-2) !important;
  background: var(--v70-well);
  border: 1px solid var(--lab-line);
  border-radius: 999px;
}
html body main.center-panel #history-container > div[style*="border-bottom"] {
  display: grid !important;
  grid-template-columns: minmax(96px, auto) minmax(84px, auto) minmax(72px, auto) 1fr auto;
  align-items: center;
  column-gap: 14px !important;
  min-height: 42px;
  padding: 8px 14px !important;
}
html body main.center-panel #history-container > div[style*="border-bottom"]:nth-child(even) {
  background: color-mix(in srgb, var(--lab-surface-2) 70%, transparent);
}
html body main.center-panel #history-container > div[style*="border-bottom"] > span { min-width: 0 !important; }
/* domaine : pastille */
html body main.center-panel #history-container > div[style*="border-bottom"] > span:first-child {
  justify-self: start;
  padding: 2px 10px;
  font-size: 12px !important;
  border: 1px solid currentColor;
  border-radius: 999px;
  background: rgba(148, 163, 184, .06);
}
/* phase */
html body main.center-panel #history-container > div[style*="border-bottom"] > span:nth-child(2) {
  font-family: var(--lab-font) !important;
  font-weight: 600;
  color: var(--lab-text) !important;
}
/* résultat ✓ OK / ✗ ERR */
html body main.center-panel #history-container > div[style*="border-bottom"] > span:nth-child(3) {
  justify-self: start;
  padding: 1px 9px;
  font-size: 12px;
  font-weight: 700;
  border-radius: 6px;
  background: var(--v70-err-soft);
  border: 1px solid var(--v70-err-line);
}
html body main.center-panel #history-container > div[style*="border-bottom"] > span[style*="#30d158"]:nth-child(3) {
  background: var(--v70-ok-soft);
  border-color: var(--v70-ok-line);
}
/* volumes C:/E:/H: et date */
html body main.center-panel #history-container > div[style*="border-bottom"] > span:nth-child(4) {
  color: var(--lab-text-2) !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
html body main.center-panel #history-container > div[style*="border-bottom"] > span:last-child {
  color: var(--lab-muted) !important;
  white-space: nowrap;
}


/* ══ 10. SIMULATEUR CINÉTIQUE (sidebar droite — visibilité gérée par l'app) ═ */
html body aside.sidebar-right .kinetic-chart {
  padding: 14px !important;
  background:
    linear-gradient(180deg, rgba(30, 41, 59, .55) 0%, rgba(17, 24, 39, .62) 100%) !important;
  border: 1px solid var(--lab-line) !important;
  border-radius: var(--lab-radius) !important;
  box-shadow: var(--lab-shadow);
}
html body aside.sidebar-right #kineticCanvas {
  height: 150px;
  background:
    linear-gradient(color-mix(in srgb, var(--lab-primary-2) 6%, transparent) 1px, transparent 1px) 0 0 / 100% 25%,
    linear-gradient(90deg, color-mix(in srgb, var(--lab-primary-2) 6%, transparent) 1px, transparent 1px) 0 0 / 20% 100%,
    var(--v70-well);
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius-sm);
}
html body aside.sidebar-right .kinetic-crosshair {
  padding: 3px 8px !important;
  font-family: var(--lab-mono) !important;
  font-size: 12px !important;
  font-variant-numeric: tabular-nums;
}
html body aside.sidebar-right .kinetic-params { gap: 8px; margin-top: 12px; }
html body aside.sidebar-right .kparam {
  padding: 8px 10px;
  text-align: left;
  background: rgba(148, 163, 184, .05);
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius-xs);
}
html body aside.sidebar-right .kparam-label {
  font: var(--v70-label);
  letter-spacing: .04em;
  text-transform: none;
  color: var(--lab-muted);
}
html body aside.sidebar-right .kparam-val {
  margin-top: 3px;
  font-family: var(--lab-mono) !important;
  font-size: 15px !important;
  font-weight: 600;
  color: var(--lab-text);
  font-variant-numeric: tabular-nums slashed-zero;
}
html body aside.sidebar-right #kp-status { font-family: var(--lab-font) !important; font-size: 12.5px !important; color: var(--lab-amber); }
html body aside.sidebar-right .ks-controls { padding: 12px 0 2px; }
html body aside.sidebar-right .ks-row { gap: 10px; margin-bottom: 10px; }
html body aside.sidebar-right .ks-label {
  width: 40px;
  font: var(--v70-label);
  letter-spacing: 0;
  color: var(--lab-text-2);
}
html body aside.sidebar-right .ks-val {
  width: 52px;
  font-family: var(--lab-mono);
  font-size: 12.5px;
  color: var(--lab-text);
  font-variant-numeric: tabular-nums;
}
html body aside.sidebar-right .ks-slider {
  height: 4px;
  background: linear-gradient(90deg, var(--lab-primary), var(--lab-violet));
  border-radius: 999px;
  opacity: .9;
}
html body aside.sidebar-right .ks-slider::-webkit-slider-thumb {
  width: 16px; height: 16px;
  background: #fff;
  border: 3px solid var(--lab-primary);
  box-shadow: 0 2px 8px rgba(0, 0, 0, .5);
}
html body aside.sidebar-right .ks-slider::-moz-range-thumb {
  width: 12px; height: 12px;
  background: #fff;
  border: 3px solid var(--lab-primary);
  box-shadow: 0 2px 8px rgba(0, 0, 0, .5);
}
html body aside.sidebar-right .ks-slider:focus-visible { outline: 2px solid var(--lab-primary-2); outline-offset: 4px; }
html body aside.sidebar-right .ks-btn {
  min-height: 36px;
  margin-top: 6px;
  font-family: var(--lab-font);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .04em;
  color: #fff;
  background: linear-gradient(180deg, var(--lab-primary-2), var(--lab-primary));
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: var(--lab-radius-sm);
  box-shadow: 0 10px 22px -14px var(--lab-primary);
}
html body aside.sidebar-right .ks-btn:hover { filter: brightness(1.08); background: linear-gradient(180deg, var(--lab-primary-2), var(--lab-primary)); }
html body aside.sidebar-right .ks-stats {
  gap: 0;
  margin-top: 10px;
  padding: 0;
  background: var(--v70-well);
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius-sm);
  overflow: hidden;
}
html body aside.sidebar-right .ks-stat { padding: 8px 4px; }
html body aside.sidebar-right .ks-stat + .ks-stat { border-left: 1px solid var(--lab-line); }
html body aside.sidebar-right .ks-stat-label {
  font: var(--v70-label);
  letter-spacing: 0;
  color: var(--lab-muted);
  margin-bottom: 2px;
}
html body aside.sidebar-right .ks-stat-val {
  font-family: var(--lab-mono);
  font-size: 12.5px;
  font-weight: 600;
  color: var(--lab-text);
  font-variant-numeric: tabular-nums;
}


/* ══ 11. SYSTÈME DE MODALES COMMUN ═════════════════════════════════════════
   Feuille verre (30-right §10/§17.8) + ici : rythme interne, en-têtes,
   boutons primaire / secondaire / danger homogènes, focus. */

/* 11.1 Bouton fermer : toujours en haut à droite de la feuille, 32px */
html body .help-close,
html body .auth-modal-close,
html body #report-popup-overlay > div > button:first-child {
  position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  display: grid !important;
  place-items: center;
  line-height: 1 !important;
  z-index: 2;
  cursor: pointer;
}

/* 11.2 Boutons des modales : hauteur commune, rôles explicites */
html body .sco-btn,
html body .imo-btn,
html body .cmo-btn,
html body .ktm-btn,
html body #pdf-pw-copy,
html body #pdf-pw-cancel,
html body #pdf-pw-confirm,
html body .auth-modal-submit {
  min-height: 42px !important;
  padding: 10px 18px !important;
  font-size: 13.5px !important;
  line-height: 1.2 !important;
  cursor: pointer;
}
/* secondaire (annuler / continuer) : surface neutre et non plus bleu plein —
   le bleu reste réservé à l'action principale */
html body .cmo-cancel,
html body .sco-btn-continue {
  background: rgba(148, 163, 184, .08) !important;
  color: var(--lab-text) !important;
  border: 1px solid var(--lab-line-2) !important;
  box-shadow: none !important;
}
html body .cmo-cancel:hover,
html body .sco-btn-continue:hover {
  background: rgba(148, 163, 184, .16) !important;
  box-shadow: none !important;
}
/* danger (arrêter / confirmer suppression) : rouge plein lisible */
html body .sco-btn-stop,
html body .cmo-confirm {
  background: linear-gradient(180deg, #f87171, #dc2626) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  box-shadow: 0 10px 22px -14px #dc2626 !important;
}
html body .sco-btn-stop:hover,
html body .cmo-confirm:hover { filter: brightness(1.08); background: linear-gradient(180deg, #f87171, #dc2626) !important; }

/* 11.3 Titres & corps des petites modales */
html body .sco-title,
html body .imo-title,
html body .cmo-title { letter-spacing: -.005em !important; line-height: 1.3 !important; }
html body .sco-body,
html body .imo-body,
html body .cmo-body { line-height: 1.65 !important; }
html body .imo-body b,
html body .cmo-body b,
html body .sco-body b { color: var(--lab-text); }

/* 11.4 Focus clavier dans toutes les feuilles */
html body #report-popup-overlay button:focus-visible,
html body #report-popup-overlay a:focus-visible,
html body .help-popup button:focus-visible,
html body .auth-modal-input:focus-visible,
html body #sci-licence-banner button:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 2px var(--lab-bg), 0 0 0 4px var(--lab-primary-2) !important;
}


/* ══ 12. AIDE (#help-overlay) ══════════════════════════════════════════════ */
html body .help-popup {
  width: min(860px, calc(100vw - 32px)) !important;
  max-width: 860px !important;
  overflow: hidden !important;
}
/* en-tête fixe : titre + sous-titre + rail d'onglets */
html body .help-popup > div:first-child {
  position: relative;
  padding: 24px 28px 0 !important;
  background: linear-gradient(180deg, rgba(79, 140, 255, .07), transparent);
}
html body .help-popup h2 {
  padding-right: 48px;
  font-family: var(--v70-serif) !important;
  font-size: 23px !important;
  font-weight: 600 !important;
  letter-spacing: -.01em !important;
}
html body .help-popup .subtitle {
  font-size: 12px !important;
  letter-spacing: .06em !important;
  line-height: 1.5;
  margin-top: 4px;
}
html body #help-tabs-nav {
  overflow-x: auto;
  flex-wrap: nowrap !important;
  scrollbar-width: none;
}
html body #help-tabs-nav::-webkit-scrollbar { display: none; }
html body .htab {
  flex: 0 0 auto;
  min-height: 40px;
  font-size: 13px !important;
  letter-spacing: .01em !important;
  margin-bottom: -1px;
}
/* zone de contenu : mesure de lecture confortable */
html body .help-popup > div:nth-of-type(2) {
  padding: 24px 32px 28px !important;
}
html body .help-popup .help-tab .md-p { max-width: 78ch; }
html body .help-popup .help-tab.active { animation: v70-fade .24s var(--lab-ease); }
@keyframes v70-fade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
html body .help-popup .md-h1 {
  font-family: var(--v70-serif) !important;
  font-size: 21px !important;
  font-weight: 600 !important;
  letter-spacing: -.005em !important;
  margin-bottom: 16px !important;
}
html body .help-popup .md-h2 {
  margin-top: 24px !important;
  font-size: 12px !important;
  letter-spacing: .09em !important;
  color: var(--lab-muted) !important;
}
html body .help-popup .md-p,
html body .help-popup .md-ul li,
html body .help-popup .md-ol li { font-size: 13.5px !important; }
html body .help-popup .md-p strong { color: var(--lab-text) !important; }
html body .help-popup [style*="color:var(--active)"] { color: var(--lab-primary-2) !important; }
html body .help-popup .md-key {
  display: inline-block;
  min-width: 24px;
  text-align: center;
  padding: 1px 7px !important;
  border-bottom-width: 2px !important;
  font-size: 12px !important;
}
html body .help-popup .md-badge,
html body .help-popup td > span[style*="border-radius:10px"] {
  font-size: 11.5px !important;
  letter-spacing: .04em !important;
  padding: 2px 9px !important;
}
html body .help-popup .md-table { border: 1px solid var(--lab-line-2); border-collapse: separate !important; border-spacing: 0; }
html body .help-popup .md-table th,
html body .help-popup .md-table td { border-width: 0 0 1px 0 !important; padding: 9px 12px !important; }
html body .help-popup .md-table tr:last-child td { border-bottom: 0 !important; }
html body .help-popup .feature-grid { gap: 10px !important; }
html body .help-popup .feature-card { padding: 14px 14px 12px !important; }
html body .help-popup .feature-card:hover { transform: translateY(-1px) !important; }
html body .help-popup .feature-icon { font-size: 18px !important; margin-bottom: 8px !important; }
html body .help-footer {
  padding: 12px 28px !important;
  background: rgba(7, 11, 20, .35);
}


/* ══ 13. MODE PRÉSENTATION ═════════════════════════════════════════════════ */
html body #presentation-overlay {
  padding: 56px 24px 24px !important;
}
html body #presentation-overlay > div {
  max-width: 920px !important;
}
/* barre de navigation : ◀  1 / N  ▶ */
html body #presentation-overlay > div > div:nth-child(2) {
  margin-bottom: 14px !important;
  gap: 12px;
}
html body #presentation-overlay .graph-btn {
  min-width: 44px;
  min-height: 40px;
  padding: 8px 14px !important;
  font-size: 15px !important;
  color: var(--lab-text) !important;
  background: rgba(148, 163, 184, .08) !important;
  border: 1px solid var(--lab-line-2) !important;
  border-radius: var(--lab-radius-sm) !important;
  cursor: pointer;
  transition: background .18s var(--lab-ease), border-color .18s var(--lab-ease);
}
html body #presentation-overlay .graph-btn:hover {
  background: var(--v70-acc-soft) !important;
  border-color: var(--v70-acc-line) !important;
}
html body #presentation-nav {
  padding: 5px 14px;
  font-family: var(--lab-mono) !important;
  font-size: 13px !important;
  font-weight: 600;
  color: var(--lab-text) !important;
  background: rgba(7, 11, 20, .55);
  border: 1px solid var(--lab-line);
  border-radius: 999px;
  font-variant-numeric: tabular-nums;
}
html body #presentation-overlay button[onclick*="closePresentationMode"] {
  top: -46px !important;
  display: grid !important;
  place-items: center;
}
/* diapositive = page de pré-print */
html body #presentation-content {
  padding: 32px 36px 26px !important;
  max-height: calc(100vh - 190px) !important;
}
html body #presentation-content > div:nth-child(2) {
  font-family: var(--v70-serif) !important;
  font-size: 26px !important;
  font-weight: 600;
  line-height: 1.25 !important;
  letter-spacing: -.01em !important;
  color: var(--lab-text) !important;
  margin: 6px 0 10px !important;
  text-wrap: balance;
}
html body #presentation-content > div:nth-child(3) {
  padding-bottom: 14px;
  margin-bottom: 16px !important;
  font-family: var(--lab-mono) !important;
  font-size: 12px !important;
  color: var(--lab-muted) !important;
  border-bottom: 1px solid var(--lab-line);
}
html body #presentation-content > div:nth-child(4) {
  max-height: 48vh !important;
  padding: 18px 20px !important;
  font-family: var(--lab-font) !important;
  font-size: 14px !important;
  line-height: 1.75 !important;
  color: var(--lab-text-2) !important;
  background: var(--v70-well) !important;
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius-sm) !important;
}
html body #presentation-content > div:last-child { margin-top: 18px !important; gap: 10px !important; }
html body #presentation-content .dl-btn {
  min-height: 38px;
  padding: 8px 16px;
  font-family: var(--lab-font);
  font-size: 13px;
  font-weight: 600;
  color: var(--lab-text);
  background: rgba(148, 163, 184, .08);
  border: 1px solid var(--lab-line-2);
  border-radius: var(--lab-radius-sm);
  cursor: pointer;
}
html body #presentation-content .dl-btn.pdf {
  color: #fff;
  background: linear-gradient(180deg, var(--lab-primary-2), var(--lab-primary));
  border-color: rgba(255, 255, 255, .16);
}
/* aide clavier sous la diapositive */
html body #presentation-overlay > div > div:last-child {
  margin-top: 12px !important;
  font-family: var(--lab-font) !important;
  font-size: 12px !important;
  color: var(--lab-muted) !important;
}


/* ══ 14. POPUP RAPPORT (openReportPopup → style.cssText) ═══════════════════ */
html body #report-popup-overlay {
  padding: 24px 16px;
  animation: v70-fade .22s var(--lab-ease) !important;
}
html body #report-popup-overlay > div {
  width: min(940px, 100%) !important;
  max-width: 940px !important;
  max-height: calc(100vh - 48px) !important;
  padding: 30px 36px 26px !important;
  font-family: var(--lab-font) !important;
}
/* en-tête : badge domaine + titre (serif de revue) + actions */
html body #report-popup-overlay > div > div:last-child > div:first-child {
  align-items: flex-start !important;
  gap: 14px !important;
  padding: 0 44px 16px 0 !important;
  margin-bottom: 12px !important;
}
html body #report-popup-overlay > div > div:last-child > div:first-child > div:first-child {
  flex: 1 1 360px;
  min-width: 0;
}
html body #report-popup-overlay > div > div:last-child > div:first-child > div:first-child > span[style*="font-size:18px"] {
  display: block;
  margin: 10px 0 0 !important;
  font-family: var(--v70-serif) !important;
  font-size: 24px !important;
  font-weight: 600 !important;
  line-height: 1.25;
  letter-spacing: -.01em !important;
  color: var(--lab-text) !important;
  text-wrap: balance;
}
html body #report-popup-overlay .report-domain-badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  font-family: var(--lab-font);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .06em;
  border-radius: 999px;
}
/* boutons PDF / MD / .md */
html body #report-popup-overlay .dl-btn {
  min-height: 34px;
  padding: 6px 12px;
  font-family: var(--lab-font);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .02em;
  color: var(--lab-text-2);
  background: rgba(148, 163, 184, .08);
  border: 1px solid var(--lab-line-2);
  border-radius: var(--lab-radius-sm);
  box-shadow: none;
  text-shadow: none;
  cursor: pointer;
  transition: background .18s var(--lab-ease), border-color .18s var(--lab-ease), color .18s var(--lab-ease);
}
html body #report-popup-overlay .dl-btn:hover { color: var(--lab-text); background: var(--v70-acc-soft); border-color: var(--v70-acc-line); }
html body #report-popup-overlay .dl-btn.pdf {
  color: #fff;
  background: linear-gradient(180deg, var(--lab-primary-2), var(--lab-primary));
  border-color: rgba(255, 255, 255, .16);
}
/* ligne de méta (fichier · date · taille) */
html body #report-popup-overlay > div > div:last-child > div:nth-child(2) {
  margin-bottom: 16px !important;
  font-size: 12px !important;
  font-variant-numeric: tabular-nums;
}
/* corps : typographie de publication */
html body #popup-report-content {
  padding: 26px 32px !important;
  font-size: 14.5px !important;
  line-height: 1.75 !important;
}
html body #popup-report-content .md-p { margin: 0 0 12px; font-size: 14.5px; color: var(--lab-text-2); line-height: 1.75; max-width: 76ch; }
html body #popup-report-content .md-h1,
html body #popup-report-content .md-h2 {
  font-family: var(--v70-serif) !important;
  font-weight: 600 !important;
  letter-spacing: -.005em !important;
  color: var(--lab-text) !important;
  text-transform: none !important;
}
html body #popup-report-content .md-h1 {
  font-size: 22px !important;
  margin: 8px 0 14px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid var(--lab-line-2) !important;
}
html body #popup-report-content .md-h2 {
  font-size: 18px !important;
  margin: 24px 0 10px !important;
  padding-bottom: 6px !important;
  border-bottom: 1px solid var(--lab-line) !important;
}
html body #popup-report-content .md-h3 {
  font-family: var(--lab-font) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: .02em !important;
  color: var(--lab-primary-2) !important;
  margin: 18px 0 8px !important;
}
html body #popup-report-content .md-h4 {
  font-family: var(--lab-font) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--lab-muted) !important;
  margin: 14px 0 6px !important;
}
html body #popup-report-content .md-hr { border: 0; border-top: 1px solid var(--lab-line-2); margin: 18px 0; }
html body #popup-report-content .md-ul { margin: 4px 0 12px; padding-left: 4px; list-style: none; }
html body #popup-report-content .md-li { position: relative; padding-left: 18px; margin: 4px 0; font-size: 14.5px; color: var(--lab-text-2); line-height: 1.7; }
html body #popup-report-content .md-li::before {
  content: '';
  position: absolute;
  left: 4px;
  top: .72em;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--lab-primary-2);
}
html body #popup-report-content strong { color: var(--lab-text); }
html body #popup-report-content .md-code {
  font-family: var(--lab-mono) !important;
  font-size: 12.5px !important;
  padding: 1px 6px !important;
  color: var(--lab-teal) !important;
  background: color-mix(in srgb, var(--lab-teal) 10%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--lab-teal) 22%, transparent) !important;
  border-radius: var(--lab-radius-xs) !important;
}
html body #popup-report-content .md-pre {
  margin: 10px 0 14px;
  padding: 14px 16px;
  font-family: var(--lab-mono);
  font-size: 12.5px;
  line-height: 1.6;
  color: var(--lab-text-2);
  background: var(--lab-bg);
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius-sm);
  overflow-x: auto;
}
html body #popup-report-content .md-table {
  width: 100%;
  margin: 12px 0 16px !important;
  font-size: 13px !important;
  border-collapse: separate !important;
  border-spacing: 0;
  border: 1px solid var(--lab-line-2);
  border-radius: var(--lab-radius-sm);
  overflow: hidden;
  font-variant-numeric: tabular-nums;
}
html body #popup-report-content .md-table th {
  padding: 9px 12px !important;
  font-family: var(--lab-font) !important;
  font-size: 12.5px !important;
  font-weight: 700;
  letter-spacing: .03em !important;
  text-align: left;
  color: var(--lab-text) !important;
  background: var(--lab-surface-3) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--lab-line-2) !important;
}
html body #popup-report-content .md-table td {
  padding: 8px 12px !important;
  color: var(--lab-text-2) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--lab-line) !important;
}
html body #popup-report-content .md-table tr:last-child td { border-bottom: 0 !important; }
html body #popup-report-content .md-table tr:nth-child(even) td { background: rgba(241, 245, 249, .025) !important; }
html body #popup-report-content .md-link { color: var(--lab-primary-2); text-decoration: none; border-bottom: 1px solid var(--v70-acc-line); }
html body #popup-report-content .md-link:hover { color: var(--lab-text); border-bottom-color: var(--lab-primary-2); }


/* ══ 15. AUTHENTIFICATION & PDF CHIFFRÉ ════════════════════════════════════ */
html body .auth-modal-content {
  position: relative;
  width: min(440px, calc(100vw - 32px)) !important;
  max-width: 440px !important;
}
html body .auth-modal-content h2 {
  font-family: var(--v70-serif) !important;
  font-weight: 600 !important;
  font-size: 22px !important;
  padding-right: 40px;
  margin-bottom: 8px !important;
}
html body .auth-modal-content form {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 18px 0 4px;
}
html body .auth-modal-input {
  width: 100% !important;
  min-height: 46px !important;
  padding: 10px 14px !important;
  box-sizing: border-box;
}
html body .auth-modal-submit { width: 100% !important; min-height: 46px !important; }
html body .auth-modal-note { margin-top: 16px !important; padding-top: 14px !important; line-height: 1.55; }

html body #pdf-pw-modal > div {
  width: min(520px, calc(100vw - 32px)) !important;
}
html body #pdf-pw-modal h2 {
  font-family: var(--v70-serif) !important;
  font-weight: 600 !important;
  font-size: 22px !important;
  letter-spacing: -.005em !important;
  margin-bottom: 10px !important;
}
html body #pdf-pw-modal p { font-size: 13.5px !important; margin-bottom: 16px !important; }
html body #pdf-pw-display {
  padding: 16px !important;
  font-size: 21px !important;
  font-weight: 600 !important;
  font-variant-numeric: tabular-nums slashed-zero;
  word-break: break-all;
  box-shadow: 0 0 0 4px rgba(251, 191, 36, .06) inset;
}
html body #pdf-pw-modal > div > div[style*="ffc864"] { line-height: 1.6 !important; }
html body #pdf-pw-modal > div > div:last-child { gap: 10px !important; }


/* ══ 16. TOASTS ════════════════════════════════════════════════════════════ */
html body #toast-container {
  bottom: 24px !important;
  left: 24px !important;
  gap: 10px !important;
  max-width: 360px !important;
}
html body .toast {
  position: relative;
  overflow: hidden;
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 16px 13px 14px !important;
  font-size: 13.5px !important;
  font-weight: 500;
  border-left-width: 1px !important;
  border-left-color: var(--lab-line-2) !important;
  animation: v70-toast-in .26s var(--lab-ease) both, v70-toast-out .28s ease-in 2.75s forwards !important;
}
/* pastille d'état */
html body .toast::before {
  content: 'i';
  flex: 0 0 22px;
  height: 22px;
  display: grid;
  place-items: center;
  font: 700 12px/1 var(--lab-mono);
  color: var(--lab-primary-2);
  background: var(--v70-acc-soft);
  border: 1px solid var(--v70-acc-line);
  border-radius: 50%;
}
html body .toast.ok::before    { content: '✓'; color: var(--lab-green); background: var(--v70-ok-soft);   border-color: var(--v70-ok-line); }
html body .toast.warn::before  { content: '!'; color: var(--lab-amber); background: var(--v70-warn-soft); border-color: var(--v70-warn-line); }
html body .toast.error::before { content: '×'; color: var(--lab-red);   background: var(--v70-err-soft);  border-color: var(--v70-err-line); }
/* barre de durée (3,1 s) */
html body .toast::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: var(--lab-primary);
  transform-origin: left;
  animation: v70-toast-timer 2.9s linear forwards;
}
html body .toast.ok::after    { background: var(--lab-green); }
html body .toast.warn::after  { background: var(--lab-amber); }
html body .toast.error::after { background: var(--lab-red); }
@keyframes v70-toast-in  { from { opacity: 0; transform: translateY(10px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes v70-toast-out { to { opacity: 0; transform: translateY(6px); } }
@keyframes v70-toast-timer { from { transform: scaleX(1); } to { transform: scaleX(0); } }


/* ══ 17. BANNIÈRE D'EXPIRATION DE LICENCE (#sci-licence-banner, inline PHP) ═ */
html body #sci-licence-banner {
  min-height: 42px;
  box-sizing: border-box;
  padding: 9px 56px 9px 20px !important;
  font-family: var(--lab-font) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: 1.4;
  color: var(--lab-text) !important;
  background:
    linear-gradient(90deg, rgba(251, 191, 36, .2), rgba(17, 24, 39, .94) 38%, rgba(17, 24, 39, .94)) !important;
  border-bottom: 1px solid rgba(251, 191, 36, .45);
  box-shadow: 0 12px 30px -16px rgba(0, 0, 0, .95) !important;
  -webkit-backdrop-filter: var(--lab-blur);
  backdrop-filter: var(--lab-blur);
}
html body #sci-licence-banner strong { color: #fde68a; font-weight: 700; }
/* critique (≤ 7 jours) */
html body #sci-licence-banner[style*="#ff453a"] {
  background: linear-gradient(90deg, rgba(248, 113, 113, .32), rgba(40, 14, 18, .95) 42%, rgba(17, 24, 39, .95)) !important;
  border-bottom-color: rgba(248, 113, 113, .6);
}
html body #sci-licence-banner[style*="#ff453a"] strong { color: #fecaca; }
/* information (> 15 jours) */
html body #sci-licence-banner[style*="#ffd700"] {
  background: linear-gradient(90deg, rgba(79, 140, 255, .2), rgba(17, 24, 39, .94) 38%, rgba(17, 24, 39, .94)) !important;
  border-bottom-color: var(--v70-acc-line);
}
html body #sci-licence-banner[style*="#ffd700"] strong { color: var(--lab-primary-2); }
html body #sci-licence-banner > button {
  width: 30px !important;
  height: 30px !important;
  color: var(--lab-text-2) !important;
  background: rgba(148, 163, 184, .1) !important;
  border: 1px solid var(--lab-line-2) !important;
  font-size: 13px !important;
}
html body #sci-licence-banner > button:hover { background: rgba(148, 163, 184, .2) !important; color: var(--lab-text) !important; }


/* ══ 18. RESPONSIVE LOCAL (60-responsive reste prioritaire, chargé après) ══ */
@media (max-width: 900px) {
  html body main.center-panel #tab-graph .graph-controls > span { margin-left: 0 !important; }
  html body main.center-panel #graph-search-input { max-width: none; }
  html body main.center-panel #tab-compare > div[style*="grid"] { gap: 14px !important; }
  html body .help-popup > div:nth-of-type(2) { padding: 20px 20px 24px !important; }
  html body #report-popup-overlay > div { padding: 24px 18px 20px !important; }
  html body #popup-report-content { padding: 18px 16px !important; }
}
@media (max-width: 640px) {
  html body main.center-panel #tab-compare > div[style*="grid"]::after { display: none; }
  html body main.center-panel #history-container > div[style*="border-bottom"] {
    grid-template-columns: auto auto 1fr;
    row-gap: 6px;
  }
  html body main.center-panel #history-container > div[style*="border-bottom"] > span:nth-child(4),
  html body main.center-panel #history-container > div[style*="border-bottom"] > span:last-child { grid-column: span 3; }
  html body main.center-panel #tab-network::after { padding-left: 12px; padding-top: 30px; background-position: 0 -12px; }
  html body #presentation-content { padding: 22px 18px !important; }
  html body #presentation-content > div:nth-child(2) { font-size: 21px !important; }
  html body #report-popup-overlay > div > div:last-child > div:first-child > div:first-child > span[style*="font-size:18px"] { font-size: 20px !important; }
  html body #toast-container { left: 12px !important; right: 12px !important; bottom: 16px !important; max-width: none !important; }
  html body #sci-licence-banner { font-size: 12.5px !important; text-align: left !important; }
  html body main.center-panel #reports-container > p:only-child,
  html body main.center-panel #search-results > p:only-child { padding: 12px 14px !important; }
  html body main.center-panel :is(#reports-container, #search-results, #compare-result, #history-container, #timeline-container) > p:only-child { grid-template-columns: 1fr; }
  html body main.center-panel :is(#reports-container, #search-results, #compare-result, #history-container, #timeline-container) > p:only-child::before { display: none; }
  html body main.center-panel :is(#reports-container, #search-results, #compare-result, #history-container, #timeline-container) > p:only-child::after { grid-column: 1; }
}

/* ==== 60-responsive.css ==== */
/* ═══════════════════════════════════════════════════════════════════════════
   SCI-AUTONOME — thème « Laboratoire moderne »
   60-responsive.css : système fluide + passe responsive (chargé en dernier).
   Plages : ultra-large 1920-2560+ · laptop 1280-1440 · petit laptop 1024-1200 ·
            tablette portrait 768-1023 · téléphone 360-767.
   Principe : une échelle typographique et d'espacement fluide (clamp sur vw),
   appliquée à la coque, aux panneaux, cartes, console, KPI et colonnes.
   Aucun contrôle fonctionnel n'est masqué ; seuls des décors le sont < 768px.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── 0. Échelle fluide (typo + espacements + colonnes) ───────────────────── */
html:root {
  /* typographie : min lisible téléphone → max ultra-large */
  --fs-2xs: clamp(11.5px, 10.9px + .12vw, 13px);     /* micro-libellés, eyebrows */
  --fs-xs:  clamp(12px,   11.3px + .16vw, 13.5px);   /* libellés, méta */
  --fs-sm:  clamp(13px,   12.2px + .2vw,  15px);     /* texte d'interface */
  --fs-md:  clamp(14px,   13px   + .25vw, 16.5px);   /* texte courant */
  --fs-lg:  clamp(15.5px, 14px   + .4vw,  19px);     /* titres de carte */
  --fs-xl:  clamp(19px,   16px   + .8vw,  28px);     /* valeurs KPI */
  --fs-2xl: clamp(22px,   17px   + 1.35vw, 38px);    /* grands chiffres */
  --fs-mono: clamp(12.5px, 11.8px + .18vw, 14.5px);  /* console / journaux */
  /* espacements */
  --sp-1: clamp(4px,  3px  + .2vw,  6px);
  --sp-2: clamp(6px,  4.5px + .3vw, 10px);
  --sp-3: clamp(8px,  6px  + .45vw, 14px);
  --sp-4: clamp(12px, 9px  + .6vw,  20px);
  --sp-5: clamp(16px, 11px + .9vw,  28px);
  --sp-6: clamp(20px, 13px + 1.3vw, 40px);
  /* coque */
  --rsp-shell-max: 2280px;             /* largeur max de la coque (ultra-large) */
  --rsp-measure: 82ch;                 /* longueur de ligne max pour la prose */
  --rsp-touch: 44px;                   /* cible tactile minimale */
  --lay-gutter: clamp(12px, 6px + 1vw, 32px);
  --lay-gap:    clamp(10px, 6px + .7vw, 24px);
  --lay-col-left:  minmax(clamp(236px, 120px + 9vw, 330px), clamp(248px, 110px + 10vw, 350px));
  --lay-col-right: minmax(clamp(276px, 150px + 9.5vw, 400px), clamp(290px, 140px + 11vw, 430px));
}

/* ── 1. Application de l'échelle (toutes tailles) ────────────────────────── */
html body { font-size: var(--fs-md); }

/* En-tête */
html body > header { gap: var(--sp-3) var(--sp-4); padding: var(--sp-3) var(--sp-4) !important; }
html body header .logo-text h1 { font-size: var(--fs-lg) !important; }
html body header .logo-text p  { font-size: var(--fs-2xs) !important; }
html body header .header-stats { gap: var(--sp-2); }
html body header .hstat { padding: var(--sp-2) var(--sp-3) var(--sp-2) calc(var(--sp-3) + 2px) !important; }
html body header .hstat-val { font-size: clamp(16px, 13.5px + .45vw, 22px) !important; }
html body header #mission-time { font-size: clamp(15px, 12.5px + .4vw, 20px) !important; }
html body header .hstat-lbl { font-size: var(--fs-2xs) !important; }
html body header .sys-status { font-size: var(--fs-xs) !important; }

/* Barre des domaines */
html body .domain-bar { padding: var(--sp-1); gap: var(--sp-1); }
html body .domain-bar .domain-tab { font-size: var(--fs-sm) !important; padding: var(--sp-2) var(--sp-4) !important; }

/* Grille */
html body .main-layout { gap: var(--lay-gap); padding: var(--lay-gap) var(--lay-gutter) var(--lay-gutter); }
html body .sidebar-left,
html body .sidebar-right { padding: var(--sp-4) var(--sp-3) !important; }
html body .section-title { font-size: var(--fs-2xs) !important; }

/* Colonne gauche */
html body .sidebar-left .phase-name { font-size: var(--fs-sm) !important; }
html body .sidebar-left .phase-desc { font-size: var(--fs-xs) !important; }
html body .sidebar-left .auto-btn,
html body .sidebar-left .util-btn { font-size: var(--fs-xs) !important; }
html body .sidebar-left .auto-label { font-size: var(--fs-2xs) !important; }

/* Panneau central */
html body main.center-panel .tab-nav { gap: var(--sp-1); padding: var(--sp-2) var(--sp-3); flex-wrap: wrap; row-gap: 4px; }
html body main.center-panel .tab { font-size: var(--fs-xs); padding: var(--sp-2) var(--sp-3); }
html body main.center-panel .tab-content { padding: var(--sp-4); }
html body main.center-panel .section-title { font-size: var(--fs-2xs); }
html body main.center-panel .console { font-size: var(--fs-mono); }
html body main.center-panel .log-line { font-size: var(--fs-mono); padding-inline: var(--sp-4); }
html body main.center-panel .console::before { font-size: var(--fs-2xs); }
html body main.center-panel .cf-btn,
html body main.center-panel .cf-action,
html body main.center-panel .cf-label { font-size: var(--fs-2xs); }
html body main.center-panel .cards-grid {
  grid-template-columns: repeat(auto-fit, minmax(clamp(150px, 110px + 6vw, 230px), 1fr));
  gap: var(--sp-3);
}
html body main.center-panel .card { padding: var(--sp-4) var(--sp-4); }
html body main.center-panel .card-title { font-size: var(--fs-2xs); }
html body main.center-panel .card-val { font-size: var(--fs-2xl); }
html body main.center-panel .card-sub { font-size: var(--fs-xs); }
html body main.center-panel .dom-stats {
  grid-template-columns: repeat(auto-fit, minmax(clamp(120px, 90px + 4vw, 190px), 1fr));
  gap: var(--sp-3);
}
html body main.center-panel .dom-card { padding: var(--sp-3) var(--sp-3); }
html body main.center-panel .dom-val { font-size: var(--fs-xl); }
html body main.center-panel .dom-label { font-size: var(--fs-2xs); }
html body main.center-panel .report-title,
html body main.center-panel .rpt-title-text { font-size: var(--fs-md); }
html body main.center-panel .report-meta,
html body main.center-panel .sr-sub { font-size: var(--fs-xs); }
html body main.center-panel .report-content,
html body main.center-panel .report-body,
html body main.center-panel .sr-title { font-size: var(--fs-sm); }
html body main.center-panel .graph-btn,
html body main.center-panel .report-dtab,
html body main.center-panel .search-btn,
html body main.center-panel .rpag-btn { font-size: var(--fs-xs) !important; }
html body main.center-panel .search-input { font-size: var(--fs-md); }

/* Colonne droite */
html body aside.sidebar-right .feed-item { font-size: var(--fs-xs); }
html body aside.sidebar-right .feed-time { font-size: var(--fs-2xs); }
html body aside.sidebar-right .progress-bar-sub,
html body aside.sidebar-right .progress-bar-pct { font-size: var(--fs-2xs); }

/* Prose : pas de lignes interminables (rapports, résultats, aide) */
html body main.center-panel .report-content p,
html body main.center-panel .report-content li,
html body main.center-panel .report-body p,
html body main.center-panel .report-body li,
html body main.center-panel #result-display p,
html body .help-popup .md-p,
html body .help-popup .md-ul li,
html body .help-popup .md-ol li { max-width: var(--rsp-measure); }

/* Tableaux / blocs de code : défilement interne, jamais la page */
html body main.center-panel table,
html body .help-popup .md-table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
html body main.center-panel pre,
html body main.center-panel .md-block { max-width: 100%; overflow-x: auto; }
html body main.center-panel img,
html body main.center-panel canvas,
html body main.center-panel svg { max-width: 100%; }

/* ═══════════════════════════════════════════════════════════════════════════
   2. ULTRA-LARGE (≥ 1920px) : coque centrée, colonnes équilibrées
   ═══════════════════════════════════════════════════════════════════════════ */
@media (min-width: 1920px) {
  html body > header,
  html body .domain-bar,
  html body .main-layout {
    max-width: var(--rsp-shell-max);
    margin-left: auto !important;
    margin-right: auto !important;
  }
  html body > header,
  html body .domain-bar { width: calc(100% - 2 * var(--lay-gutter)); }
  /* la grille garde ses gouttières internes : bords alignés sur l'en-tête */
  html body .main-layout { width: 100%; max-width: calc(var(--rsp-shell-max) + 2 * var(--lay-gutter)); }
  html body header .logo-text p { max-width: none; }
  html body header .hstat { min-width: 118px; }
  /* console plus haute : on profite de l'écran */
  html body main.center-panel .console { min-height: min(46vh, 560px); max-height: min(62vh, 760px); }
  html body main.center-panel .console-body { max-height: calc(min(62vh, 760px) - 90px); }
  html body main.center-panel .cards-grid { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }
}
@media (min-width: 2400px) {
  html:root { --rsp-shell-max: 2440px; --rsp-measure: 88ch; }
  html body .sidebar-left .phase-btn { min-height: 72px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   3. LAPTOP (1280-1440) : densité maîtrisée
   ═══════════════════════════════════════════════════════════════════════════ */
@media (min-width: 1201px) and (max-width: 1440px) {
  html body header .logo-text p { max-width: 30ch; }
  html body header .hstat { min-width: 80px; }
  html body main.center-panel .tab { padding: 8px 11px; letter-spacing: .01em; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   4. PETIT LAPTOP / TABLETTE PAYSAGE (1024-1200)
      gauche + centre ; la colonne droite passe dessous en 2 colonnes
   ═══════════════════════════════════════════════════════════════════════════ */
@media (min-width: 1024px) and (max-width: 1200px) {
  html body .main-layout { grid-template-columns: clamp(250px, 23vw, 272px) minmax(0, 1fr); }
  html body:not(.focus-mode) .sidebar-right {
    display: block;
    columns: 2 300px;
    column-gap: var(--lay-gap);
  }
  html body .sidebar-right > * { break-inside: avoid; }
  html body .sidebar-right > .section-title { break-after: avoid; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   5. TABLETTE PORTRAIT + TÉLÉPHONE (≤ 1023px) — une seule colonne
   ═══════════════════════════════════════════════════════════════════════════ */
@media (max-width: 1023px) {
  html:root { --lay-gutter: 16px; --lay-gap: 14px; }
  html, html body { overflow-x: hidden; overflow-x: clip; max-width: 100%; }
  html body { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

  /* ── En-tête compact : logo + actions, puis KPI défilables ── */
  html body > header {
    margin: var(--lay-gutter) var(--lay-gutter) 0 !important;
    padding: 12px 14px !important;
    gap: 10px 12px;
    flex-wrap: wrap !important;
  }
  html body header .logo-block { flex: 1 1 auto; min-width: 0; order: 1; }
  html body header .sys-status { order: 2; margin-left: auto; }
  html body header .notif-btn,
  html body header .help-btn { order: 3; flex: 0 0 auto; width: var(--rsp-touch) !important; height: var(--rsp-touch) !important; }
  html body header .header-stats {
    order: 4;
    display: flex !important;
    flex: 1 1 100%;
    width: 100%;
    margin: 0 !important;
    flex-wrap: nowrap !important;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 2px;
    /* fondu en bord droit : indique qu'on peut défiler */
    -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent);
            mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent);
  }
  html body header .header-stats::-webkit-scrollbar { display: none; }
  html body header .hstat { flex: 0 0 auto; min-width: 0 !important; scroll-snap-align: start; }
  html body header .hstat:last-child { margin-right: 28px; }

  /* ── Domaines : contrôle segmenté défilant ── */
  html body .domain-bar {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    margin: 10px var(--lay-gutter) 0 !important;
    padding: 4px !important;
    gap: 4px !important;
  }
  html body .domain-bar::-webkit-scrollbar { display: none; }
  html body .domain-bar .domain-tab {
    flex: 1 0 auto !important;
    min-height: var(--rsp-touch) !important;
    padding: 8px 14px !important;
    white-space: nowrap;
    justify-content: center !important;
    scroll-snap-align: start;
    font-size: var(--fs-sm) !important;
  }

  /* ── Grille : une colonne, contenu principal d'abord ── */
  html body .main-layout {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    gap: var(--lay-gap);
    padding: 14px var(--lay-gutter) var(--lay-gutter) !important;
    min-height: 0;
  }
  html body .main-layout > * { width: 100%; min-width: 0; max-width: 100%; }
  html body .center-panel  { order: 1; }
  html body .sidebar-left  { order: 2; }
  html body .sidebar-right { order: 3; }
  html body .sidebar-left,
  html body .sidebar-right {
    position: relative !important;
    top: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  /* ── Pipeline (gauche) : cartes empilées, en-têtes de section « repliables » ── */
  html body .sidebar-left {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px !important;
    padding: 14px !important;
  }
  html body .sidebar-left > .section-title,
  html body .sidebar-left > .auto-block,
  html body .sidebar-left > div[style*="margin-top:auto"] { grid-column: 1 / -1; }
  html body .sidebar-left > .util-row { grid-column: 1 / -1; }
  html body .sidebar-left > .section-title {
    min-height: var(--rsp-touch);
    margin: 6px 0 0 !important;
    padding: 0 12px !important;
    background: var(--lab-surface-2);
    border: 1px solid var(--lab-line);
    border-radius: var(--lab-radius-sm);
  }
  html body .sidebar-left > .section-title:first-child { margin-top: 0 !important; }
  /* chevron décoratif (le contenu reste toujours visible) */
  html body .sidebar-left > .section-title::after {
    content: '' !important;
    flex: 0 0 8px !important;
    width: 8px !important;
    height: 8px !important;
    margin: 0 4px 0 auto !important;
    align-self: center !important;
    background: none !important;
    border-right: 2px solid var(--lab-muted);
    border-bottom: 2px solid var(--lab-muted);
    transform: rotate(45deg) translateY(-2px);
    opacity: .7 !important;
  }
  html body .sidebar-left .phase-btn { min-height: 64px; margin: 0 !important; }
  html body .sidebar-left .util-row { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  html body .sidebar-left .util-btn,
  html body .sidebar-left .auto-btn { min-height: var(--rsp-touch) !important; }

  /* ── Colonne droite : cartes après le contenu ── */
  html body:not(.focus-mode) .sidebar-right {
    display: block !important;
    columns: 2 280px;
    column-gap: var(--lay-gap);
    padding: 14px !important;
  }
  html body .sidebar-right > * { break-inside: avoid; }
  html body .sidebar-right > .section-title { break-after: avoid; }

  /* ── Panneau central ── */
  html body .center-panel { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background: var(--lab-surface-solid) !important; }
  html body main.center-panel .tab-nav {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    padding: 6px 8px !important;
    -webkit-backdrop-filter: none !important;
            backdrop-filter: none !important;
    -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 24px), transparent);
            mask-image: linear-gradient(90deg, #000 calc(100% - 24px), transparent);
  }
  html body main.center-panel .tab-nav::-webkit-scrollbar { display: none; }
  /* le masque rognerait la feuille ▼ PLUS (enfant fixe) : retiré quand elle est ouverte */
  html body main.center-panel .tab-nav:has(.dropdown-content.show) { -webkit-mask-image: none; mask-image: none; }
  html body main.center-panel .tab-nav > .tab,
  html body main.center-panel .tab-dropdown { flex: 0 0 auto; scroll-snap-align: start; }
  html body main.center-panel .tab-dropdown { margin-right: 24px; }
  html body main.center-panel .tab {
    min-height: var(--rsp-touch) !important;
    padding: 8px 14px !important;
    white-space: nowrap;
    font-size: var(--fs-xs) !important;
  }
  html body main.center-panel #btn-focus-mode { margin-left: 0 !important; }
  /* ▼ PLUS : feuille ancrée en bas d'écran (la barre défile, le menu ne doit pas être rogné) */
  html body main.center-panel .dropdown-content {
    position: fixed !important;
    left: var(--lay-gutter) !important;
    right: var(--lay-gutter) !important;
    top: auto !important;
    bottom: max(var(--lay-gutter), env(safe-area-inset-bottom)) !important;
    min-width: 0 !important;
    max-height: 70vh;
    overflow-y: auto;
    z-index: 1000;
    padding: 8px !important;
    display: none;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
  }
  html body main.center-panel .dropdown-content[style*="block"],
  html body main.center-panel .dropdown-content.show,
  html body main.center-panel .dropdown-content.open,
  html body main.center-panel .tab-dropdown.open .dropdown-content { display: grid !important; }
  html body main.center-panel .dropdown-content .tab { min-height: 48px !important; justify-content: flex-start; }

  html body main.center-panel .tab-content { padding: 14px !important; }

  /* Console : barre de titre + filtres défilables, lignes qui passent à la ligne */
  html body main.center-panel .console::before { padding: 0 128px 0 72px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; height: 52px; line-height: 52px; }
  html body main.center-panel .console-copy-btn,
  html body main.center-panel .console-save-btn { top: 4px !important; height: var(--rsp-touch) !important; min-width: var(--rsp-touch); line-height: 42px !important; }
  html body main.center-panel .console-copy-btn { right: 6px !important; }
  html body main.center-panel .console-save-btn { right: 72px !important; }
  html body main.center-panel .console-filters {
    flex-wrap: nowrap !important;
    overflow-x: auto;
    scrollbar-width: none;
    padding: 6px 10px !important;
  }
  html body main.center-panel .console-filters::-webkit-scrollbar { display: none; }
  html body main.center-panel .cf-btn,
  html body main.center-panel .cf-action {
    flex: 0 0 auto;
    height: auto !important;
    min-height: var(--rsp-touch);
    min-width: var(--rsp-touch);
    line-height: 1 !important;
  }
  html body main.center-panel .log-line { overflow-wrap: anywhere; word-break: break-word; padding: 3px 12px !important; }
  html body main.center-panel .console { max-height: 62vh; }
  html body main.center-panel #result-display { overflow-x: auto; max-width: 100%; }

  /* Contrôles de vues : cibles tactiles, champs pleine largeur */
  html body main.center-panel .graph-btn,
  html body main.center-panel .report-dtab,
  html body main.center-panel .search-btn,
  html body main.center-panel .rpag-btn,
  html body main.center-panel .dl-btn,
  html body main.center-panel .report-toggle,
  html body main.center-panel .logs-controls button,
  html body main.center-panel select,
  html body main.center-panel input[type="text"],
  html body main.center-panel input[type="search"],
  html body main.center-panel .search-input { min-height: var(--rsp-touch) !important; }
  html body main.center-panel .report-domain-tabs { flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: none; }
  html body main.center-panel .report-domain-tabs::-webkit-scrollbar { display: none; }
  html body main.center-panel .report-domain-tabs > * { flex: 0 0 auto; }
  html body main.center-panel .search-bar { flex-wrap: wrap; }
  html body main.center-panel .search-input { flex: 1 1 100%; min-width: 0; }
  html body main.center-panel .graph-controls { flex-wrap: wrap; }

  /* Colonne droite : cibles tactiles */
  html body aside.sidebar-right .ap-btn,
  html body aside.sidebar-right .ap-preset-btn,
  html body aside.sidebar-right .ap-spatial-header,
  html body aside.sidebar-right .ap-track-item,
  html body .ab-login-btn { min-height: var(--rsp-touch) !important; }
  html body aside.sidebar-right .ap-btn { min-width: var(--rsp-touch) !important; }
  html body aside.sidebar-right input[type="range"] { min-height: 32px; }
  html body aside.sidebar-right select { min-height: var(--rsp-touch) !important; }

  /* Boutons fermer des modales : 44px */
  html body .help-close,
  html body .auth-modal-close,
  html body .gpu-howto-close,
  html body #presentation-overlay button[onclick*="closePresentationMode"],
  html body #report-popup-overlay > div > button:first-child { width: var(--rsp-touch) !important; height: var(--rsp-touch) !important; }
  html body .htab { min-height: var(--rsp-touch) !important; }
}

/* Tablette portrait (768-1023) : la colonne gauche affiche 3 phases par ligne */
@media (min-width: 768px) and (max-width: 1023px) {
  html body main.center-panel .cards-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  html body main.center-panel .dom-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* ═══════════════════════════════════════════════════════════════════════════
   6. TÉLÉPHONE (≤ 767px)
   ═══════════════════════════════════════════════════════════════════════════ */
@media (max-width: 767px) {
  html:root { --lay-gutter: 16px; --lay-gap: 12px; }

  html body > header { padding: 10px 12px !important; border-radius: var(--lab-radius-sm); }
  html body header .logo-icon { width: 40px !important; height: 40px !important; }
  html body header .logo-text h1 { font-size: 17px !important; }
  html body header .logo-text p { display: none !important; }             /* sous-titre décoratif */
  html body header .sys-status { order: 5; flex: 1 1 100%; margin: 0 !important; justify-content: flex-start; font-size: 12px !important; padding: 6px 10px !important; }
  html body header .hstat { padding: 6px 10px 6px 12px !important; }
  html body header .hstat-val { font-size: 16px !important; }
  html body header #mission-time { font-size: 15px !important; }
  html body header .hstat-lbl { font-size: 11.5px !important; letter-spacing: .05em !important; }

  html body .domain-bar .domain-tab { flex: 0 0 auto !important; font-size: 13.5px !important; padding: 8px 12px !important; }

  /* Pipeline : 2 phases par ligne, puis 1 sous 480px */
  html body .sidebar-left { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 12px !important; }
  html body .sidebar-left .util-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html body .sidebar-left > .util-row { grid-column: 1 / -1; }
  html body .sidebar-left .phase-btn { min-height: 60px; padding: 10px 10px 10px 12px !important; }
  html body .sidebar-left .phase-name { font-size: 13.5px !important; }
  html body .sidebar-left .phase-desc { font-size: 12.5px !important; }

  /* Colonne droite : une colonne */
  html body:not(.focus-mode) .sidebar-right { columns: 1; padding: 12px !important; }

  html body main.center-panel .tab-content { padding: 12px !important; }
  html body main.center-panel .cards-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px; }
  html body main.center-panel .card { padding: 12px !important; }
  html body main.center-panel .card-val { font-size: 22px !important; }
  html body main.center-panel .card-sub { font-size: 12.5px !important; }
  html body main.center-panel .dom-stats { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html body main.center-panel .log-line { font-size: 12.5px !important; line-height: 1.6; }
  html body main.center-panel .console::before { padding: 0 128px 0 16px !important; background-size: 0 0, 0 0, 0 0, auto !important; } /* pastilles décoratives masquées */
  html body main.center-panel .console { min-height: 0; }
  html body main.center-panel .report-header { flex-direction: column; align-items: stretch !important; gap: 8px; }
  html body main.center-panel .report-actions { flex-wrap: wrap; }
  html body main.center-panel [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
  html body main.center-panel .cards-grid[style*="grid-template-columns"],
  html body main.center-panel #health-metrics { grid-template-columns: 1fr 1fr !important; }
  html body main.center-panel [style*="white-space:nowrap"],
  html body main.center-panel [style*="white-space: nowrap"] { white-space: normal !important; }
  html body main.center-panel [style*="min-width"] { min-width: 0 !important; }

  /* Décors masqués (coûtent de la place, aucune fonction) */
  html body .scifx-spark,
  html body > header::after,
  html body aside.sidebar-right .progress-bar-shine,
  html body aside.sidebar-right .ap-cover-halo,
  html body aside.sidebar-right .ap-cover-orbit { display: none !important; }
  html body aside.sidebar-right .ap-cover-wrap { max-width: 168px; margin-inline: auto; }

  /* ── Modales : feuilles pleine largeur ancrées en bas ── */
  html body .help-overlay,
  html body .auth-modal,
  html body .gpu-howto-modal,
  html body #report-popup-overlay,
  html body #pdf-pw-modal,
  html body #stop-confirm-overlay,
  html body #info-modal-overlay,
  html body #confirm-modal-overlay,
  html body #key-test-modal {
    align-items: flex-end !important;
    justify-content: stretch !important;
    padding: 0 !important;
  }
  html body .help-popup,
  html body .auth-modal-content,
  html body .gpu-howto-content,
  html body #report-popup-overlay > div,
  html body #pdf-pw-modal > div,
  html body .sco-box,
  html body .imo-box,
  html body .cmo-box,
  html body .ktm-box {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    max-height: 92dvh !important;
    margin: 0 !important;
    overflow-y: auto;
    border-radius: 18px 18px 0 0 !important;
    border-bottom: 0 !important;
    padding-bottom: max(16px, env(safe-area-inset-bottom)) !important;
    animation: rsp-sheet-in .32s var(--lab-ease) both !important;
  }
  /* poignée de feuille (décorative) */
  html body .help-popup::before,
  html body .auth-modal-content::before {
    content: '' !important;
    display: block !important;
    position: sticky !important;
    top: 0;
    width: 40px; height: 4px;
    margin: 8px auto 0;
    border-radius: 4px;
    background: var(--lab-line-2) !important;
    border: 0 !important;
  }
  html body .help-popup > div:first-child { padding: 14px 16px 0 !important; }
  html body .help-popup h2 { font-size: 18px !important; padding-right: 52px; }
  html body .help-popup .subtitle { font-size: 12px !important; }
  html body #help-tabs-nav {
    flex-wrap: nowrap !important;
    overflow-x: auto;
    scrollbar-width: none;
    margin: 0 -16px !important;
    padding: 0 16px !important;
  }
  html body #help-tabs-nav::-webkit-scrollbar { display: none; }
  html body #help-tabs-nav .htab { flex: 0 0 auto; white-space: nowrap; }
  html body .help-popup [style*="padding:22px 28px"],
  html body .help-popup [style*="padding: 22px 28px"] { padding-left: 16px !important; padding-right: 16px !important; }
  html body .help-popup [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
  html body .help-close { top: 12px !important; right: 12px !important; }
  html body .auth-modal-content { padding: 24px 18px !important; }
  /* présentation : plein écran */
  html body #presentation-overlay { padding: 56px 12px 12px !important; justify-content: flex-start !important; }
  html body #presentation-overlay > div { max-width: 100% !important; }
  html body #presentation-content { padding: 16px !important; max-height: calc(100dvh - 160px) !important; }
  html body #presentation-overlay button[onclick*="closePresentationMode"] { top: -48px !important; }
  /* toasts pleine largeur */
  html body #toast-container { left: 12px !important; right: 12px !important; max-width: none !important; }
  html body #toast-container > * { max-width: 100% !important; }
}
@keyframes rsp-sheet-in {
  from { transform: translateY(24px); opacity: 0; }
  to   { transform: none; opacity: 1; }
}

/* Petit téléphone (≤ 480px) */
@media (max-width: 480px) {
  html body .sidebar-left { grid-template-columns: minmax(0, 1fr); }
  html body .sidebar-left .phase-btn { min-height: 56px; }
  html body main.center-panel .console::before { font-size: 11.5px !important; }
}
@media (max-width: 380px) {
  html body main.center-panel .card { padding: 10px !important; }
  html body main.center-panel .card-val { font-size: 20px !important; }
  html body header .sys-status span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

/* Écrans haute densité : filets plus fins, texte plus net */
@media (min-resolution: 2dppx) {
  html body { -webkit-font-smoothing: antialiased; }
}

/* ==== 80-signature-B.css ==== */
/* ═══════════════════════════════════════════════════════════════════════════
   SCI-AUTONOME — 80-signature-B.css · langage « CARNET » (clair, moderne)
   Feuilles blanches · marine profond (marque) · encre noire · jaune signal (signature)
   Typo éditoriale scientifique (Source Serif 4 / IBM Plex Sans / Plex Mono).
   REMPLACE 80-signature.css. Préfixe : html body:not(#b#b)  (+2 ID). Voir DESIGN-B.md.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── 0. Jetons ──────────────────────────────────────────────────────────── */
html:root, html body {
  /* surfaces */
  --c-bg: #F5F5F1; --c-0: #FFFFFF; --c-1: #FFFFFF; --c-2: #F9F9F6; --c-3: #F0F0EB; --c-4: #E5E5DE;
  --c-line: #E7E6E0; --c-line-2: #D3D2CA;
  /* encre */
  --c-text: #0B0C0E; --c-text-2: #2C2E33; --c-muted: #5A5C64; --c-faint: #74767E;
  /* marque : bleu marine profond (primaire) + jaune signal (signature) */
  --c-acc: #0B1F4D; --c-acc-2: #17327A; --c-acc-ink: #FFFFFF;
  --c-acc-soft: #EEF1F8; --c-acc-soft-2: #DDE4F2; --c-acc-line: #B9C4DD;
  --c-navy-900: #071538; --c-navy-ink: #C9D4EC;
  --c-y: #FFC400; --c-y-2: #F0B400; --c-y-soft: #FFF6CC; --c-y-line: #F5D66B; --c-y-ink: #5A4100;
  /* états */
  --c-ok: #067647;   --c-ok-soft: #ECFDF3;   --c-ok-line: #ABEFC6;
  --c-warn: #B54708; --c-warn-soft: #FFF6E5; --c-warn-line: #FEDF89;
  --c-err: #B42318;  --c-err-soft: #FEF3F2;  --c-err-line: #FECDCA;
  --c-vio: #6938EF;  --c-vio-soft: #F4F1FE;
  /* domaines (≥ 4.5:1 sur blanc) */
  --c-med: #0E6F8C; --c-cyber: #B3135F; --c-tech: #B9470C; --c-phy: #1B7A3E;
  --c-med-soft: #ECFAFE; --c-cyber-soft: #FDF0F7; --c-tech-soft: #FFF4ED; --c-phy-soft: #EEFBF2;
  /* planches (figures à fond sombre dessinées par canvas) */
  --c-plate: #070E15; --c-plate-line: #1B2633;
  /* élévation */
  --bevel: inset 0 1px 0 rgba(255,255,255,.9);
  --sh-1: 0 1px 2px rgba(11,31,77,.05), 0 0 0 1px rgba(11,31,77,.015);
  --sh-2: 0 1px 2px rgba(11,31,77,.05), 0 2px 6px -1px rgba(11,31,77,.06), 0 8px 20px -12px rgba(11,31,77,.10);
  --sh-3: 0 2px 4px rgba(11,31,77,.05), 0 8px 18px -6px rgba(11,31,77,.12), 0 18px 36px -18px rgba(11,31,77,.18);
  --sh-pop: 0 4px 8px -2px rgba(11,31,77,.08), 0 18px 40px -10px rgba(11,31,77,.22);
  --sh-modal: 0 8px 16px -4px rgba(11,31,77,.10), 0 32px 72px -16px rgba(11,31,77,.34);
  --sh-navy: 0 1px 0 rgba(255,255,255,.08) inset, 0 10px 24px -12px rgba(11,31,77,.6), 0 2px 6px -2px rgba(11,31,77,.35);
  --g-navy: linear-gradient(135deg, #0F2A63 0%, #0B1F4D 48%, #081638 100%);
  --ring: 0 0 0 3px rgba(255,196,0,.55);
  /* forme & mouvement */
  --r-xl: 16px; --r-lg: 14px; --r: 12px; --r-md: 10px; --r-sm: 8px; --r-xs: 6px; --r-pill: 999px;
  --ease: cubic-bezier(.2,.8,.2,1); --t-fast: .14s; --t: .2s;
  --gut: clamp(10px, 1.1vw, 20px);
  --fs-lbl: clamp(11.5px, .68vw, 11.5px); --fs-s: clamp(12px, .76vw, 12.5px); --fs: clamp(13px, .8vw, 13.5px);
  --f-sans: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --f-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --f-serif: 'Source Serif 4', 'Iowan Old Style', Charter, Georgia, serif;

  /* re-cartographie : jetons CALIBRE (--k-*) lus par 95-analytics.css */
  --k-0: var(--c-2); --k-1: var(--c-1); --k-2: var(--c-2); --k-3: var(--c-3);
  --k-line: var(--c-line); --k-line-2: var(--c-line-2);
  --k-text: var(--c-text); --k-text-2: var(--c-text-2); --k-muted: var(--c-muted);
  --k-acc: var(--c-acc); --k-acc-2: var(--c-acc-2); --k-acc-ink: #fff;
  --k-acc-08: var(--c-acc-soft); --k-acc-16: var(--c-acc-soft-2); --k-acc-40: var(--c-acc-line);
  --k-ok: var(--c-ok); --k-warn: var(--c-warn); --k-err: var(--c-err);
  --k-ok-08: var(--c-ok-soft); --k-warn-08: var(--c-warn-soft); --k-err-08: var(--c-err-soft);
  --k-med: var(--c-med); --k-cyber: var(--c-cyber); --k-tech: var(--c-tech); --k-phy: var(--c-phy);
  --k-r: var(--r); --k-r-sm: var(--r-sm); --k-r-xs: var(--r-xs); --k-ease: var(--ease);
  --k-sans: var(--f-sans); --k-mono: var(--f-mono); --k-serif: var(--f-serif);
  /* couches 00→70 */
  --lab-bg: var(--c-bg); --lab-bg-2: var(--c-bg);
  --lab-surface: var(--c-1); --lab-surface-solid: var(--c-1);
  --lab-surface-2: var(--c-2); --lab-surface-3: var(--c-3);
  --lab-line: var(--c-line); --lab-line-2: var(--c-line-2);
  --lab-text: var(--c-text); --lab-text-2: var(--c-text-2); --lab-muted: var(--c-muted);
  --lab-primary: var(--c-acc); --lab-primary-2: var(--c-acc-2);
  --lab-teal: var(--c-med); --lab-cyan: var(--c-med); --lab-violet: var(--c-vio);
  --lab-green: var(--c-ok); --lab-amber: var(--c-warn); --lab-red: var(--c-err);
  --lab-radius: var(--r-lg); --lab-radius-sm: var(--r-md); --lab-radius-xs: var(--r-sm);
  --lab-shadow: var(--sh-2); --lab-shadow-hi: var(--sh-3); --lab-blur: none;
  --lab-ease: var(--ease);
  --lab-font: var(--f-sans); --lab-mono: var(--f-mono); --lab-serif: var(--f-serif);
  /* style.css d'origine */
  --bg: var(--c-bg); --bg2: var(--c-2); --bg3: var(--c-3);
  --panel: var(--c-1); --panel2: var(--c-2);
  --border: var(--c-line); --border2: var(--c-line);
  --text: var(--c-text-2); --textdim: var(--c-muted); --textbright: var(--c-text);
  --red: var(--c-err); --red-glow: transparent;
  --med: var(--c-med); --cyber: var(--c-cyber); --tech: var(--c-tech); --phy: var(--c-phy);
  --gov: var(--c-acc); --gov-dim: var(--c-acc-soft);
  /* décors des couches précédentes */
  --lay-panel-bg: var(--c-1); --lay-graph-paper: none; --lay-grid-minor: transparent; --lay-mark: transparent;
  --lay-tint-primary: var(--c-acc-soft); --lay-tint-primary-2: var(--c-acc-soft-2); --lay-border-primary: var(--c-acc-line);
  --lay-gutter: var(--gut); --lay-gap: var(--gut);
  --lay-col-left: clamp(244px, 17.5vw, 292px); --lay-col-right: clamp(272px, 19.5vw, 336px);
  --rgt-ticks: none; --rgt-grid: none; --rgt-tick: transparent;
  --rgt-face: linear-gradient(var(--c-1), var(--c-1)) padding-box;
  --rgt-rim: linear-gradient(var(--c-line), var(--c-line)) border-box;
  --rgt-card-bg: var(--c-1); --rgt-scrim: rgba(17,24,39,.38); --rgt-track: var(--c-3);
  --rgt-focus: var(--ring);
  --rgt-tint-primary: var(--c-acc-soft); --rgt-tint-primary-2: var(--c-acc-soft-2);
  --rgt-tint-violet: var(--c-vio-soft); --rgt-tint-green: var(--c-ok-soft);
  --rgt-tint-amber: var(--c-warn-soft); --rgt-tint-red: var(--c-err-soft);
  --ctr-grid: transparent; --ctr-grid-strong: transparent; --ctr-tick: transparent;
  --ctr-console-bg: var(--c-1); --ctr-hover: var(--c-2);
  --ctr-accent-soft: var(--c-acc-soft); --ctr-accent-line: var(--c-acc-line);
  --ctr-ok-soft: var(--c-ok-soft); --ctr-ok-line: var(--c-ok-line);
  /* 90-ux */
  --sciux-focus: var(--ring); --sciux-dom: var(--active);
  /* couleur de domaine posée en ligne par switchDomain() → remplacée par une teinte lisible */
  --active: var(--c-acc) !important; --active-glow: transparent !important; --glow1: none !important;
}
html:root:has(#dtab-medical[class*="active-"]) { --active: var(--c-med) !important; --active-soft: var(--c-med-soft); }
html:root:has(#dtab-cyber[class*="active-"])   { --active: var(--c-cyber) !important; --active-soft: var(--c-cyber-soft); }
html:root:has(#dtab-tech[class*="active-"])    { --active: var(--c-tech) !important; --active-soft: var(--c-tech-soft); }
html:root:has(#dtab-physics[class*="active-"]) { --active: var(--c-phy) !important; --active-soft: var(--c-phy-soft); }
html:root { --active-soft: var(--c-acc-soft); color-scheme: light; }

/* ── 1. Socle ───────────────────────────────────────────────────────────── */
html, html body:not(#b#b) {
  background: var(--c-bg) !important; background-image: none !important;
  color: var(--c-text);
  font-family: var(--f-sans) !important; font-size: var(--fs); line-height: 1.5;
  font-feature-settings: "kern", "liga", "calt" !important;
  -webkit-font-smoothing: antialiased;
}
html body:not(#b#b)::before, html body:not(#b#b)::after, html body:not(#b#b) #scifx-bg { display: none !important; }
html body:not(#b#b) *, html body:not(#b#b) *::before, html body:not(#b#b) *::after { text-shadow: none !important; }
html body:not(#b#b) ::selection { background: var(--c-acc-soft-2); color: var(--c-text); }
html body:not(#b#b) :focus { outline: none; }
html body:not(#b#b) :focus-visible { outline: 2px solid var(--c-acc) !important; outline-offset: 2px !important; }
html body:not(#b#b) [style*="Share Tech"], html body:not(#b#b) [style*="monospace"] { font-family: var(--f-mono) !important; }
html body:not(#b#b) [style*="Orbitron"] { font-family: var(--f-sans) !important; letter-spacing: .02em !important; }
html body:not(#b#b) [style*="font-size:8px"], html body:not(#b#b) [style*="font-size:9px"],
html body:not(#b#b) [style*="font-size: 8px"], html body:not(#b#b) [style*="font-size: 9px"] { font-size: var(--fs-lbl) !important; }
html body:not(#b#b) [style*="font-size:10px"], html body:not(#b#b) [style*="font-size: 10px"],
html body:not(#b#b) [style*="font-size:11px"], html body:not(#b#b) [style*="font-size: 11px"] { font-size: var(--fs-s) !important; }

/* couleurs néon posées en ligne (gabarits JS) → teintes AA sur clair */
html body:not(#b#b) [style*="color:#30d158"], html body:not(#b#b) [style*="color: #30d158"],
html body:not(#b#b) [style*="color:#6ee592"] { color: var(--c-ok) !important; }
html body:not(#b#b) [style*="color:#ff9f0a"], html body:not(#b#b) [style*="color:#ffd700"],
html body:not(#b#b) [style*="color:#ffc266"], html body:not(#b#b) [style*="color:#ffc864"] { color: var(--c-warn) !important; }
html body:not(#b#b) [style*="color:#ff453a"], html body:not(#b#b) [style*="color:#ff2d6b"] { color: var(--c-err) !important; }
html body:not(#b#b) [style*="color:#bf5af2"] { color: var(--c-vio) !important; }
html body:not(#b#b) [style*="color:#00e5ff"] { color: var(--active) !important; }
html body:not(#b#b) [style*="color:#fff"]:not([style*="background:#"]):not([style*="background: #"]),
html body:not(#b#b) [style*="color:#ffffff"], html body:not(#b#b) [style*="color:#d4d4dc"],
html body:not(#b#b) [style*="color:#bbb"] { color: var(--c-text) !important; }
html body:not(#b#b) [style*="color:#888"], html body:not(#b#b) [style*="color:#999"] { color: var(--c-muted) !important; }
html body:not(#b#b) [style*="border:1px solid #30d158"], html body:not(#b#b) [style*="rgba(48,209,88"] { border-color: var(--c-ok-line) !important; }
html body:not(#b#b) [style*="border:1px solid #ff9f0a"], html body:not(#b#b) [style*="border:1px solid #ffd700"],
html body:not(#b#b) [style*="border:1px solid #ffc864"], html body:not(#b#b) [style*="rgba(255,159,10"] { border-color: var(--c-warn-line) !important; }
html body:not(#b#b) [style*="rgba(255,45,107"], html body:not(#b#b) [style*="border:1px solid #6b1010"] { border-color: var(--c-err-line) !important; }
html body:not(#b#b) [style*="rgba(0,229,255"], html body:not(#b#b) [style*="border:1px solid #00e5ff"],
html body:not(#b#b) [style*="border:2px solid #00e5ff"] { border-color: var(--c-acc-line) !important; }
html body:not(#b#b) [style*="rgba(191,90,242"] { border-color: #D9D0FC !important; }
/* fonds sombres posés en ligne → surfaces claires (hors canvas = planches) */
html body:not(#b#b) :not(canvas)[style*="background:#000"], html body:not(#b#b) :not(canvas)[style*="background: #000"],
html body:not(#b#b) :not(canvas)[style*="rgba(0,0,0,0.7)"], html body:not(#b#b) :not(canvas)[style*="rgba(6,13,20"],
html body:not(#b#b) :not(canvas)[style*="rgba(2,4,8"] { background: var(--c-2) !important; color: var(--c-text-2); }
html body:not(#b#b) [style*="background:#1f1408"] { background: var(--c-warn-soft) !important; }
html body:not(#b#b) [style*="background:#0d0218"] { background: var(--c-vio-soft) !important; }
html body:not(#b#b) [style*="background:#062321"] { background: var(--c-ok-soft) !important; }
html body:not(#b#b) [style*="background:#30d158"] { background: var(--c-ok) !important; color: #fff !important; }
html body:not(#b#b) [style*="background:#ff2d6b"] { background: var(--c-err) !important; }
html body:not(#b#b) [style*="background:#ff9f0a"] { background: var(--c-warn) !important; }
html body:not(#b#b) [style*="background:#00e5ff"] { background: var(--active) !important; }
html body:not(#b#b) [style*="box-shadow:0 0"] { box-shadow: none !important; }

/* chiffres tabulaires */
html body:not(#b#b) .hstat-val, html body:not(#b#b) .card-val, html body:not(#b#b) .dom-val,
html body:not(#b#b) .cycle-count, html body:not(#b#b) .progress-bar-pct, html body:not(#b#b) .ap-times,
html body:not(#b#b) .feed-time, html body:not(#b#b) .ks-stat-val, html body:not(#b#b) .kparam-val,
html body:not(#b#b) .ks-val, html body:not(#b#b) .rdc-badge, html body:not(#b#b) #mission-time,
html body:not(#b#b) .phase-num, html body:not(#b#b) .log-ts {
  font-variant-numeric: tabular-nums slashed-zero !important; font-feature-settings: "tnum", "zero" !important;
}

/* ── 2. Coque : 3 feuilles blanches flottant sur un fond gris perle ─────── */
html body:not(#b#b) .main-layout { gap: var(--gut) !important; padding: var(--gut) !important; }
html body:not(#b#b) .sidebar-left, html body:not(#b#b) .center-panel, html body:not(#b#b) .sidebar-right {
  background: var(--c-1) !important; background-image: none !important;
  border: 1px solid var(--c-line) !important; border-radius: var(--r-xl) !important;
  box-shadow: var(--sh-2) !important;
  -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
}
html body:not(#b#b) .sidebar-left::before, html body:not(#b#b) .sidebar-left::after,
html body:not(#b#b) .sidebar-right::before, html body:not(#b#b) .sidebar-right::after,
html body:not(#b#b) .center-panel::before, html body:not(#b#b) .center-panel::after { display: none !important; }
html body:not(#b#b) .sidebar-left > *, html body:not(#b#b) .sidebar-right > * { flex-shrink: 0 !important; }

/* ── 3. En-tête : bandeau institutionnel marine, relevés en ligne ───────── */
html body:not(#b#b) > header {
  position: relative; margin: 0 !important; padding: 0 var(--gut) !important; min-height: 64px;
  gap: 10px 22px !important;
  background: var(--c-acc) !important; background-image: none !important;
  border: 0 !important; border-radius: 0 !important;
  box-shadow: inset 0 -1px 0 rgba(255,255,255,.06) !important; color: #fff;
}
/* liseré jaune signature (3 px) sous le bandeau */
html body:not(#b#b) > header::after {
  content: '' !important; display: block !important; position: absolute !important;
  left: 0 !important; right: 0 !important; bottom: -3px !important; top: auto !important; height: 3px !important; width: auto !important;
  background: linear-gradient(90deg, var(--c-y) 0 132px, var(--c-acc-2) 132px 100%) !important;
  opacity: 1 !important; z-index: 2; transform: none !important; box-shadow: none !important; animation: none !important;
}
html body:not(#b#b) > header::before { display: none !important; }
html body:not(#b#b) > header .logo-block { gap: 12px !important; padding: 12px 0; }
html body:not(#b#b) > header .logo-icon {
  width: 38px !important; height: 38px !important; border-radius: var(--r-md) !important;
  background: rgba(255,255,255,.08) !important; border: 1px solid rgba(255,255,255,.14) !important;
  box-shadow: none !important; transform: none !important; overflow: hidden; display: grid !important; place-items: center !important;
}
html body:not(#b#b) > header .logo-icon::before, html body:not(#b#b) > header .logo-icon::after { display: none !important; }
html body:not(#b#b) > header .cia-logo-img, html body:not(#b#b) > header .cia-logo-img img { width: 26px !important; height: 26px !important; filter: none !important; animation: none !important; }
html body:not(#b#b) > header .logo-text h1 {
  font: 700 16.5px/1.1 var(--f-sans) !important; letter-spacing: .02em !important;
  color: #fff !important; -webkit-text-fill-color: #fff !important; background: none !important;
}
html body:not(#b#b) > header .logo-text p {
  max-width: 60ch !important; margin-top: 3px !important;
  font: 400 italic 13px/1.3 var(--f-serif) !important; letter-spacing: 0 !important; text-transform: lowercase !important;
  color: var(--c-navy-ink) !important;
}
html body:not(#b#b) > header .logo-text p::first-letter { text-transform: uppercase; }
html body:not(#b#b) > header .header-stats { gap: 0 !important; align-items: stretch !important; align-self: stretch; flex-wrap: wrap; }
html body:not(#b#b) > header .hstat {
  --b-kpi: #8FB0FF;
  min-width: 0 !important; padding: 10px clamp(12px, 1.3vw, 20px) !important;
  background: transparent !important; border: 0 !important; border-left: 1px solid rgba(255,255,255,.1) !important;
  border-radius: 0 !important; box-shadow: none !important; transform: none !important;
  display: grid !important; grid-template-columns: auto auto; grid-template-areas: "dot lbl" "val val";
  column-gap: 7px !important; row-gap: 3px !important; align-content: center !important; align-items: center !important;
  transition: background-color var(--t-fast) var(--ease) !important;
}
html body:not(#b#b) > header .hstat:last-child { border-right: 1px solid rgba(255,255,255,.1) !important; }
html body:not(#b#b) > header .hstat:hover { background: rgba(255,255,255,.05) !important; }
html body:not(#b#b) > header .hstat:nth-child(2) { --b-kpi: #7FD4F5; }
html body:not(#b#b) > header .hstat:nth-child(3) { --b-kpi: #C7B8FF; }
html body:not(#b#b) > header .hstat:nth-child(4) { --b-kpi: var(--c-y); }
html body:not(#b#b) > header .hstat.hstat-session { --b-kpi: rgba(255,255,255,.45); }
html body:not(#b#b) > header .hstat::after { display: none !important; }
html body:not(#b#b) > header .hstat::before {
  content: '' !important; display: block !important; grid-area: dot; position: static !important;
  width: 6px !important; height: 6px !important; border-radius: 1px !important;
  background: var(--b-kpi) !important; box-shadow: none !important; opacity: 1 !important; transform: none !important; inset: auto !important;
}
html body:not(#b#b) > header .hstat-val {
  grid-area: val; font: 600 clamp(15px, 1.25vw, 18.5px)/1.05 var(--f-mono) !important;
  color: #fff !important; letter-spacing: -.02em !important;
}
html body:not(#b#b) > header #stat-complete { color: var(--c-y) !important; }
html body:not(#b#b) > header .hstat-lbl {
  grid-area: lbl; font: 600 10.5px/1.2 var(--f-sans) !important; letter-spacing: .09em !important;
  text-transform: uppercase; color: var(--c-navy-ink) !important;
}
html body:not(#b#b) .scifx-spark { color: var(--b-kpi, var(--c-y)) !important; opacity: .9; }
html body:not(#b#b) .scifx-delta { font: 600 11px/1.4 var(--f-mono) !important; border-radius: var(--r-pill) !important; }
html body:not(#b#b) .hstat[data-scifx-pulse] > .hstat-val { filter: none !important; }
html body:not(#b#b) > header .sys-status {
  font: 500 11.5px/1 var(--f-mono) !important; color: #fff !important;
  padding: 8px 12px 8px 10px !important; gap: 8px !important;
  background: rgba(255,255,255,.07) !important; border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: var(--r-pill) !important; box-shadow: none !important;
}
html body:not(#b#b) > header .status-dot {
  width: 8px !important; height: 8px !important; border-radius: 50% !important;
  background: #32D583 !important; animation: b-live 2.4s var(--ease) infinite !important;
}
@keyframes b-live { 0% { box-shadow: 0 0 0 0 rgba(50,213,131,.45); } 70%,100% { box-shadow: 0 0 0 6px rgba(50,213,131,0); } }
html body:not(#b#b) > header .help-btn, html body:not(#b#b) > header .notif-btn {
  width: 36px !important; height: 36px !important; min-width: 36px;
  background: rgba(255,255,255,.06) !important; border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: var(--r-md) !important; box-shadow: none !important;
  color: #fff !important; font: 600 14px/1 var(--f-sans) !important;
  transition: background-color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease), transform var(--t-fast) var(--ease) !important;
}
html body:not(#b#b) > header .help-btn:hover, html body:not(#b#b) > header .notif-btn:hover { background: var(--c-y) !important; border-color: var(--c-y) !important; color: var(--c-acc) !important; transform: translateY(-1px) !important; }
html body:not(#b#b) > header .help-icon { color: inherit !important; font: inherit !important; }
html body:not(#b#b) > header .notif-badge { background: var(--c-y) !important; color: var(--c-acc) !important; box-shadow: 0 0 0 2px var(--c-acc) !important; font: 700 10.5px/1 var(--f-mono) !important; border-radius: var(--r-pill) !important; animation: none !important; }
html body:not(#b#b) > header :focus-visible { outline-color: var(--c-y) !important; }

/* ── 4. Domaines : registre de sections, onglet actif marine ────────────── */
html body:not(#b#b) .domain-bar {
  margin: 0 !important; padding: 10px var(--gut) !important; gap: 6px !important;
  background: var(--c-1) !important; border: 0 !important; border-bottom: 1px solid var(--c-line) !important; border-radius: 0 !important;
  box-shadow: none !important; display: flex !important; justify-content: flex-start !important; flex-wrap: wrap;
}
html body:not(#b#b) .domain-bar::before, html body:not(#b#b) .domain-bar::after { display: none !important; }
html body:not(#b#b) .domain-bar .domain-tab {
  --b-dom: var(--c-muted); --b-dom-soft: var(--c-2);
  flex: 0 1 auto !important; position: relative;
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 10px !important;
  min-height: 40px; padding: 0 16px 0 7px !important;
  background: var(--c-1) !important; border: 1px solid var(--c-line) !important; border-radius: var(--r-pill) !important;
  box-shadow: none !important; transform: none !important;
  font: 600 11.5px/1 var(--f-sans) !important; letter-spacing: .05em !important; text-transform: uppercase;
  color: var(--c-text-2) !important;
  transition: background-color var(--t) var(--ease), color var(--t) var(--ease), border-color var(--t) var(--ease), box-shadow var(--t) var(--ease), transform var(--t-fast) var(--ease) !important;
}
html body:not(#b#b) .domain-bar #dtab-medical { --b-dom: var(--c-med); --b-dom-soft: var(--c-med-soft); }
html body:not(#b#b) .domain-bar #dtab-cyber { --b-dom: var(--c-cyber); --b-dom-soft: var(--c-cyber-soft); }
html body:not(#b#b) .domain-bar #dtab-tech { --b-dom: var(--c-tech); --b-dom-soft: var(--c-tech-soft); }
html body:not(#b#b) .domain-bar #dtab-physics { --b-dom: var(--c-phy); --b-dom-soft: var(--c-phy-soft); }
html body:not(#b#b) .domain-bar .domain-tab::before { display: none !important; }
html body:not(#b#b) .domain-bar .domain-tab::after {
  content: '' !important; display: block !important; position: absolute !important;
  left: auto !important; right: 12px !important; top: 50% !important; bottom: auto !important;
  width: 7px !important; height: 7px !important; margin-top: -3.5px; border-radius: 50% !important;
  background: var(--c-y) !important; opacity: 0 !important; transform: scale(.2) !important; box-shadow: none !important;
  transition: opacity var(--t) var(--ease), transform var(--t) var(--ease) !important;
}
html body:not(#b#b) .domain-bar .domain-tab:hover { color: var(--c-text) !important; border-color: var(--c-line-2) !important; box-shadow: var(--sh-2) !important; transform: translateY(-1px) !important; }
html body:not(#b#b) .domain-bar .domain-tab[class*="active-"] {
  color: #fff !important; background: var(--c-acc) !important; border-color: var(--c-acc) !important;
  padding-right: 30px !important; box-shadow: 0 6px 16px -6px rgba(11,31,77,.45) !important; transform: none !important;
}
html body:not(#b#b) .domain-bar .domain-tab[class*="active-"]::after { opacity: 1 !important; transform: scale(1) !important; }
html body:not(#b#b) .domain-tab .domain-icon {
  display: inline-grid !important; place-items: center; font-size: 13px !important; line-height: 1 !important;
  width: 28px !important; height: 28px !important; min-width: 28px; border-radius: 50% !important;
  background: var(--b-dom-soft, var(--c-2)) !important; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--b-dom) 25%, transparent) !important;
  filter: none !important; margin: 0 !important; opacity: 1 !important;
}
html body:not(#b#b) .domain-tab[class*="active-"] .domain-icon { background: #fff !important; box-shadow: none !important; }

/* ── 5. Titres de section : numérotés façon article ─────────────────────── */
html body:not(#b#b) .sidebar-left, html body:not(#b#b) .sidebar-right { counter-reset: b-sec; }
html body:not(#b#b) .section-title {
  counter-increment: b-sec;
  font: 700 var(--fs-lbl)/1.2 var(--f-sans) !important; letter-spacing: .08em !important; text-transform: uppercase;
  color: var(--c-acc) !important; align-items: center; gap: 8px;
  margin: 18px 2px 10px !important; padding: 0 !important; border: 0 !important; background: none !important;
}
html body:not(#b#b) .section-title:not([style*="display:none"]):not([style*="display: none"]) { display: flex; }
html body:not(#b#b) .section-title::before {
  content: counter(b-sec, decimal-leading-zero) !important; display: inline-block !important; position: static !important;
  font: 700 10.5px/1 var(--f-mono) !important; letter-spacing: 0 !important; color: var(--c-acc) !important;
  background: var(--c-y) !important; padding: 3px 5px !important; border-radius: var(--r-xs) !important;
  width: auto !important; height: auto !important; border: 0 !important; box-shadow: none !important; opacity: 1 !important; transform: none !important;
}
html body:not(#b#b) .section-title::after {
  content: '' !important; display: block !important; position: static !important;
  flex: 1 1 auto !important; height: 1px !important; width: auto !important;
  background: var(--c-line) !important; opacity: 1 !important; margin: 0 !important;
  font-size: 0 !important; border: 0 !important; transform: none !important;
}
html body:not(#b#b) .sidebar-left > .section-title:first-child, html body:not(#b#b) .sidebar-right > .section-title:first-child { margin-top: 2px !important; }

/* ── 6. Pipeline : étapes à pastilles d'état ────────────────────────────── */
html body:not(#b#b) .sidebar-left { padding: 14px !important; }
html body:not(#b#b) .sidebar-left .phase-btn {
  position: relative; display: flex !important; align-items: flex-start !important; gap: 12px !important;
  width: 100%; min-height: 0 !important; margin: 0 0 4px !important; padding: 10px 10px !important;
  background: transparent !important; border: 1px solid transparent !important; border-radius: var(--r) !important;
  box-shadow: none !important; transform: none !important; text-align: left !important; color: var(--c-text) !important;
  transition: background-color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease) !important;
}
html body:not(#b#b) .sidebar-left .phase-btn:hover { background: var(--c-2) !important; border-color: var(--c-line) !important; }
html body:not(#b#b) .sidebar-left .phase-btn:active { background: var(--c-3) !important; }
/* fil de progression vertical entre étapes */
html body:not(#b#b) .sidebar-left .phase-btn::before {
  content: '' !important; display: block !important; position: absolute !important;
  left: 23px !important; top: 38px !important; bottom: -10px !important; width: 2px !important; height: auto !important;
  border-radius: 2px !important; background: var(--c-line) !important; box-shadow: none !important; opacity: 1 !important; z-index: 0;
}
html body:not(#b#b) .sidebar-left .phase-btn:last-of-type::before { display: none !important; }
html body:not(.demo-mode):not(#b#b) .sidebar-left .phase-btn::after { display: none !important; }
html body:not(#b#b) .sidebar-left .phase-num {
  flex: none !important; position: relative; z-index: 1;
  width: 28px !important; height: 28px !important; min-width: 28px;
  display: grid !important; place-items: center !important;
  font: 600 11.5px/1 var(--f-mono) !important; color: var(--c-text-2) !important;
  background: var(--c-1) !important; border: 1.5px solid var(--c-line-2) !important; border-radius: 50% !important;
  box-shadow: none !important; clip-path: none !important;
  transition: background-color var(--t) var(--ease), border-color var(--t) var(--ease), color var(--t) var(--ease) !important;
}
html body:not(#b#b) .sidebar-left .phase-info { flex: 1 1 auto; min-width: 0; padding-top: 1px; }
html body:not(#b#b) .sidebar-left .phase-name { font: 600 13px/1.3 var(--f-sans) !important; letter-spacing: 0 !important; color: var(--c-text) !important; text-transform: none !important; }
html body:not(#b#b) .sidebar-left .phase-name::first-letter { text-transform: uppercase; }
html body:not(#b#b) .sidebar-left .phase-desc { font: 400 11.5px/1.4 var(--f-sans) !important; letter-spacing: 0 !important; color: var(--c-muted) !important; margin-top: 2px !important; text-transform: none !important; }
html body:not(#b#b) .sidebar-left .phase-indicator {
  flex: none; width: 8px !important; height: 8px !important; margin-top: 10px;
  border-radius: 50% !important; background: var(--c-line-2) !important; box-shadow: none !important; animation: none !important; border: 0 !important;
}
html body:not(#b#b) .sidebar-left .phase-btn.loading { background: var(--c-y-soft) !important; border-color: var(--c-y-line) !important; }
html body:not(#b#b) .sidebar-left .phase-btn.loading .phase-num { color: var(--c-y) !important; background: var(--c-acc) !important; border-color: var(--c-acc) !important; box-shadow: 0 0 0 3px var(--c-y) !important; }
html body:not(#b#b) .sidebar-left .phase-btn.loading .phase-indicator { background: var(--c-y-2) !important; animation: b-pulse 1.4s var(--ease) infinite !important; }
html body:not(#b#b) .sidebar-left .phase-btn.success::before { background: var(--c-ok-line) !important; }
html body:not(#b#b) .sidebar-left .phase-btn.success .phase-num { color: var(--c-ok) !important; background: var(--c-ok-soft) !important; border-color: var(--c-ok) !important; }
html body:not(#b#b) .sidebar-left .phase-btn.success .phase-indicator { background: var(--c-ok) !important; }
html body:not(#b#b) .sidebar-left .phase-btn.error { background: var(--c-err-soft) !important; border-color: var(--c-err-line) !important; }
html body:not(#b#b) .sidebar-left .phase-btn.error .phase-num { color: var(--c-err) !important; background: #fff !important; border-color: var(--c-err) !important; }
html body:not(#b#b) .sidebar-left .phase-btn.error .phase-indicator { background: var(--c-err) !important; }
html body:not(#b#b) .phase-btn:disabled, html body:not(#b#b) .phase-btn[disabled] { opacity: .5 !important; cursor: not-allowed !important; }
@keyframes b-pulse { 0%,100% { transform: scale(1); opacity: 1; } 50% { transform: scale(.6); opacity: .5; } }

html body:not(#b#b) .sidebar-left .auto-block {
  position: relative; padding: 16px !important; margin: 0 !important; overflow: hidden;
  background: var(--c-acc) !important; background-image: none !important; color: #fff !important;
  border: 0 !important; border-radius: var(--r-lg) !important; box-shadow: 0 10px 24px -12px rgba(11,31,77,.55) !important;
}
html body:not(#b#b) .sidebar-left .auto-block::before {
  content: '' !important; display: block !important; position: absolute !important; left: 0 !important; top: 0 !important; right: auto !important; bottom: auto !important;
  width: 44px !important; height: 4px !important; background: var(--c-y) !important; border-radius: 0 0 4px 0 !important; opacity: 1 !important; box-shadow: none !important; transform: none !important;
}
html body:not(#b#b) .sidebar-left .auto-block::after { display: none !important; }
html body:not(#b#b) .auto-label { font: 700 var(--fs-lbl)/1.3 var(--f-sans) !important; letter-spacing: .09em !important; text-transform: uppercase; color: var(--c-navy-ink) !important; }
html body:not(#b#b) .sidebar-left .auto-block :is(span, div, p, small, label):not(.auto-btn):not(button *) { color: inherit; }
html body:not(#b#b) .sidebar-left .auto-btn { white-space: nowrap !important; }
html body:not(#b#b) .sidebar-left .auto-controls { display: grid !important; grid-template-columns: 1fr auto !important; gap: 10px !important; align-items: center !important; }
html body:not(#b#b) .sidebar-left .auto-controls > div { text-align: right; padding: 0 !important; background: none !important; border: 0 !important; color: var(--c-navy-ink) !important; }
html body:not(#b#b) .cycle-count { font: 600 26px/1.05 var(--f-mono) !important; color: #fff !important; letter-spacing: -.03em !important; }
html body:not(#b#b) #autocycle-status { font: 400 11.5px/1.45 var(--f-mono) !important; color: var(--c-navy-ink) !important; }
html body:not(#b#b) .sidebar-left .auto-block .auto-btn:not(#btn-auto) { background: rgba(255,255,255,.06) !important; color: #fff !important; border-color: rgba(255,255,255,.22) !important; box-shadow: none !important; }
html body:not(#b#b) .sidebar-left .auto-block .auto-btn:not(#btn-auto):hover { background: rgba(255,255,255,.14) !important; border-color: rgba(255,255,255,.4) !important; color: #fff !important; }
html body:not(#b#b) .sidebar-left .auto-block :focus-visible { outline-color: var(--c-y) !important; }

/* ── 7. Boutons ─────────────────────────────────────────────────────────── */
html body:not(#b#b) .auto-btn, html body:not(#b#b) .util-btn, html body:not(#b#b) .graph-btn,
html body:not(#b#b) .search-btn, html body:not(#b#b) .ks-btn, html body:not(#b#b) .dl-btn,
html body:not(#b#b) .ab-login-btn, html body:not(#b#b) .ab-logout-btn, html body:not(#b#b) .ap-preset-btn,
html body:not(#b#b) .rpag-btn, html body:not(#b#b) .cmo-btn, html body:not(#b#b) .imo-btn, html body:not(#b#b) .sco-btn,
html body:not(#b#b) .ktm-btn, html body:not(#b#b) .gpu-warn-btn, html body:not(#b#b) .console-copy-btn, html body:not(#b#b) .console-save-btn,
html body:not(#b#b) .sciux-btn {
  font: 500 13px/1.2 var(--f-sans) !important; letter-spacing: 0 !important; text-transform: none;
  color: var(--c-text) !important; background: var(--c-1) !important;
  border: 1px solid var(--c-line-2) !important; border-radius: var(--r-md) !important;
  box-shadow: var(--sh-1) !important; transform: none; clip-path: none !important;
  min-height: 34px; padding: 7px 13px !important;
  transition: background-color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease), transform var(--t-fast) var(--ease) !important;
}
html body:not(#b#b) .console-copy-btn, html body:not(#b#b) .console-save-btn { min-height: 28px; height: 28px !important; padding: 0 10px !important; line-height: 26px !important; top: 8px !important; font-size: 11.5px !important; border-radius: var(--r-sm) !important; }
html body:not(#b#b) .auto-btn::before { display: none !important; }
html body:not(#b#b) :is(.auto-btn,.util-btn,.graph-btn,.search-btn,.ks-btn,.dl-btn,.ap-preset-btn,.rpag-btn,.cmo-btn,.imo-btn,.sco-btn,.ktm-btn,.console-copy-btn,.console-save-btn,.ab-login-btn,.ab-logout-btn,.sciux-btn):hover:not(:disabled) {
  background: var(--c-2) !important; border-color: var(--c-faint) !important; color: var(--c-text) !important;
  box-shadow: var(--sh-3) !important; transform: translateY(-1px);
}
html body:not(#b#b) :is(.auto-btn,.util-btn,.graph-btn,.search-btn,.ks-btn,.dl-btn,.rpag-btn,.cmo-btn,.sco-btn,.sciux-btn):active:not(:disabled) { transform: translateY(0) scale(.98); box-shadow: none !important; }
html body:not(#b#b) .search-btn, html body:not(#b#b) .cmo-confirm,
html body:not(#b#b) .auth-modal-submit, html body:not(#b#b) .sco-btn-continue, html body:not(#b#b) .gpu-warn-btn-primary, html body:not(#b#b) .sciux-btn--primary {
  background: var(--c-acc) !important; border-color: var(--c-acc-2) !important; color: #fff !important; font-weight: 600 !important;
  box-shadow: 0 1px 2px rgba(11,31,77,.3), inset 0 1px 0 rgba(255,255,255,.12) !important;
}
html body:not(#b#b) .search-btn:hover, html body:not(#b#b) .cmo-confirm:hover,
html body:not(#b#b) .auth-modal-submit:hover, html body:not(#b#b) .sco-btn-continue:hover, html body:not(#b#b) .sciux-btn--primary:hover {
  background: var(--c-acc-2) !important; border-color: var(--c-acc-2) !important; color: #fff !important;
  box-shadow: 0 8px 18px -6px rgba(11,31,77,.5) !important;
}
html body:not(#b#b) #btn-auto {
  background: var(--c-y) !important; border: 1px solid var(--c-y-2) !important; color: var(--c-acc) !important; font-weight: 700 !important; letter-spacing: .03em !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.4) inset, 0 6px 16px -6px rgba(255,196,0,.6) !important;
}
html body:not(#b#b) #btn-auto:hover { background: #FFD233 !important; color: var(--c-acc) !important; border-color: var(--c-y-2) !important; transform: translateY(-1px); box-shadow: 0 10px 22px -8px rgba(255,196,0,.75) !important; }
html body:not(#b#b) .danger, html body:not(#b#b) .sco-btn-stop, html body:not(#b#b) .cf-action.danger { color: var(--c-err) !important; border-color: var(--c-err-line) !important; background: var(--c-1) !important; }
html body:not(#b#b) .danger:hover, html body:not(#b#b) .sco-btn-stop:hover { background: var(--c-err-soft) !important; border-color: var(--c-err) !important; color: var(--c-err) !important; }
html body:not(#b#b) .util-row { gap: 8px !important; }

/* ── 8. Onglets principaux : pilules ────────────────────────────────────── */
html body:not(#b#b) main.center-panel { padding: 0 !important; overflow: visible; }
html body:not(#b#b) main.center-panel .tab-nav {
  gap: 0 !important; padding: 0 8px !important; margin: 0 !important; min-height: 50px; flex-wrap: nowrap !important;
  background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--c-line) !important;
  border-radius: var(--r-xl) var(--r-xl) 0 0 !important; box-shadow: none !important; align-items: stretch !important;
}
html body:not(#b#b) main.center-panel .tab-nav > .tab, html body:not(#b#b) main.center-panel .tab-dropdown > .tab {
  position: relative; display: inline-flex !important; align-items: center !important; gap: 6px;
  height: auto !important; min-height: 50px; padding: 0 clamp(8px, .75vw, 14px) !important; margin: 0 !important;
  background: transparent !important; border: 0 !important; border-radius: 0 !important;
  box-shadow: none !important; transform: none !important; white-space: nowrap !important; flex: 0 0 auto !important;
  font: 600 clamp(11.5px, .78vw, 11.5px)/1 var(--f-sans) !important; letter-spacing: .06em !important; text-transform: uppercase; color: var(--c-muted) !important;
  transition: color var(--t-fast) var(--ease) !important;
}
html body:not(#b#b) main.center-panel .tab-nav > .tab:hover, html body:not(#b#b) main.center-panel .tab-dropdown > .tab:hover { color: var(--c-acc) !important; }
html body:not(#b#b) main.center-panel .tab-nav > .tab.active { color: var(--c-acc) !important; }
html body:not(#b#b) main.center-panel .tab::before { display: none !important; }
html body:not(#b#b) main.center-panel .tab::after {
  content: '' !important; display: block !important; position: absolute !important;
  left: clamp(8px, .75vw, 14px) !important; right: clamp(8px, .75vw, 14px) !important; bottom: -1px !important; top: auto !important; width: auto !important;
  height: 3px !important; border-radius: 3px 3px 0 0 !important; background: var(--c-y) !important;
  opacity: 0 !important; transform: scaleX(.4) !important; box-shadow: none !important; animation: none !important;
  transition: opacity var(--t) var(--ease), transform var(--t) var(--ease) !important;
}
html body:not(#b#b) main.center-panel .tab-nav > .tab.active::after { opacity: 1 !important; transform: scaleX(1) !important; }
html body:not(#b#b) main.center-panel .dropdown-content .tab::after { display: none !important; }
html body:not(#b#b) main.center-panel #btn-focus-mode { margin-left: auto !important; }
html body:not(#b#b) main.center-panel .tab-dropdown { display: flex; align-items: stretch; }
html body:not(#b#b) main.center-panel .dropdown-content {
  background: var(--c-1) !important; border: 1px solid var(--c-line) !important;
  border-radius: var(--r) !important; box-shadow: var(--sh-pop) !important; padding: 6px !important; min-width: 224px;
}
html body:not(#b#b) main.center-panel .dropdown-content .tab {
  display: flex !important; width: 100%; min-height: 34px; padding: 0 10px !important;
  background: transparent !important; border: 0 !important; border-radius: var(--r-sm) !important;
  font: 500 13px/1 var(--f-sans) !important; letter-spacing: 0 !important; color: var(--c-text-2) !important;
  justify-content: flex-start !important; align-items: center; box-shadow: none !important;
}
html body:not(#b#b) main.center-panel .dropdown-content .tab:hover { background: var(--c-2) !important; color: var(--c-text) !important; }
html body:not(#b#b) main.center-panel .dropdown-content .tab.active { background: var(--c-acc-soft) !important; color: var(--c-acc-2) !important; }
html body:not(#b#b) main.center-panel .tab-content { padding: clamp(14px, 1.5vw, 24px) !important; background: transparent !important; }

/* ── 9. Console : « relevé d'instrument » clair, lignes zébrées ─────────── */
html body:not(#b#b) main.center-panel .console {
  background: var(--c-1) !important; border: 1px solid var(--c-line) !important;
  border-radius: var(--r-lg) !important; box-shadow: var(--sh-1) !important; overflow: hidden;
}
html body:not(#b#b) main.center-panel .console::before {
  height: 44px !important; line-height: 44px !important; padding: 0 140px 0 36px !important;
  font: 600 11.5px/44px var(--f-mono) !important; letter-spacing: .04em !important; color: #fff !important;
  background: radial-gradient(circle at 19px 50%, var(--c-y) 0 4px, transparent 4.5px), var(--c-acc) !important;
  border-bottom: 0 !important; border-radius: 0 !important;
}
html body:not(#b#b) main.center-panel .console::after { display: none !important; }
html body:not(#b#b) main.center-panel .console-filters { gap: 6px !important; padding: 8px 12px !important; background: var(--c-1) !important; border-bottom: 1px solid var(--c-line) !important; }
html body:not(#b#b) main.center-panel .cf-btn, html body:not(#b#b) main.center-panel .cf-action {
  font: 500 11.5px/1 var(--f-sans) !important; letter-spacing: .01em !important;
  min-height: 28px; padding: 0 10px !important; gap: 6px;
  background: var(--c-1) !important; border: 1px solid var(--c-line-2) !important;
  border-radius: var(--r-pill) !important; box-shadow: none !important; color: var(--c-muted) !important;
  transition: all var(--t-fast) var(--ease) !important;
}
html body:not(#b#b) main.center-panel .cf-btn:hover, html body:not(#b#b) main.center-panel .cf-action:hover { color: var(--c-text) !important; border-color: var(--c-faint) !important; }
html body:not(#b#b) main.center-panel .cf-btn.active { color: var(--c-text) !important; background: var(--c-2) !important; }
html body:not(#b#b) main.center-panel .cf-btn::before { width: 7px !important; height: 7px !important; border-radius: 50% !important; box-shadow: none !important; opacity: .45; }
html body:not(#b#b) main.center-panel .cf-btn.active::before { opacity: 1 !important; box-shadow: none !important; }
html body:not(#b#b) main.center-panel .cf-btn[data-type="ok"]::before { background: var(--c-ok) !important; }
html body:not(#b#b) main.center-panel .cf-btn[data-type="info"]::before { background: var(--c-acc) !important; }
html body:not(#b#b) main.center-panel .cf-btn[data-type="warn"]::before { background: var(--c-warn) !important; }
html body:not(#b#b) main.center-panel .cf-btn[data-type="error"]::before { background: var(--c-err) !important; }
html body:not(#b#b) main.center-panel .cf-action.active { color: var(--c-acc-2) !important; border-color: var(--c-acc-line) !important; background: var(--c-acc-soft) !important; }
html body:not(#b#b) main.center-panel .cf-label, html body:not(#b#b) main.center-panel .cf-sep { color: var(--c-faint) !important; }
html body:not(#b#b) main.center-panel .console-body, html body:not(#b#b) main.center-panel #sys-logs {
  background: var(--c-1) !important; background-image: none !important;
  font: 400 13px/1.7 var(--f-mono) !important; color: var(--c-text-2) !important; padding: 6px 0 !important;
}
html body:not(#b#b) main.center-panel .log-line {
  font: inherit !important; color: var(--c-text-2); display: block !important;
  padding: 1px 16px 1px calc(7.8ch + 1px) !important; text-indent: calc(-7.8ch - 1px) !important;
  border-left: 3px solid transparent !important; animation: none !important; background: transparent !important;
  transition: background-color var(--t-fast) var(--ease) !important;
}
html body:not(#b#b) main.center-panel .log-line:nth-child(even) { background: #FAFBFC !important; }
html body:not(#b#b) main.center-panel .log-line:hover { background: var(--c-acc-soft) !important; }
html body:not(#b#b) main.center-panel .log-line::before, html body:not(#b#b) main.center-panel .log-line.dim::before {
  content: counter(ctr-line, decimal-leading-zero) !important;
  display: inline-block !important; width: 5ch !important; padding-right: 1.6ch !important; margin-right: 1.2ch !important;
  text-align: right !important; color: var(--c-faint) !important; font-weight: 400 !important;
  border-right: 1px solid var(--c-line) !important; background: none !important;
}
html body:not(#b#b) main.center-panel .log-ts { color: var(--c-faint) !important; }
html body:not(#b#b) main.center-panel .log-line.dim { color: var(--c-muted) !important; opacity: 1 !important; }
html body:not(#b#b) main.center-panel .log-line.ok { color: var(--c-ok) !important; }
html body:not(#b#b) main.center-panel .log-line.info { color: var(--c-acc-2) !important; }
html body:not(#b#b) main.center-panel .log-line.warn { color: var(--c-warn) !important; background: var(--c-warn-soft) !important; border-left-color: #F79009 !important; }
html body:not(#b#b) main.center-panel .log-line.error { color: var(--c-err) !important; background: var(--c-err-soft) !important; border-left-color: var(--c-err) !important; font-weight: 500 !important; }
html body:not(#b#b) main.center-panel .log-line:last-child::after { color: var(--c-acc) !important; }

/* ── 10. Fiche résultat / pré-prints : carte éditoriale ─────────────────── */
html body:not(#b#b) #result-display { background: transparent !important; border: 0 !important; box-shadow: none !important; transform: none !important; padding: 0 !important; margin-top: 16px !important; font-family: var(--f-sans) !important; }
html body:not(#b#b) #result-display > div {
  position: relative; background: var(--c-1) !important;
  border: 1px solid var(--c-line) !important; border-radius: var(--r-lg) !important;
  box-shadow: var(--sh-2) !important; transform: none !important; padding: 18px 20px 18px 22px !important;
  font: 400 var(--fs)/1.6 var(--f-sans) !important; color: var(--c-text-2) !important; overflow: hidden;
}
html body:not(#b#b) #result-display > div::before {
  content: '' !important; display: block !important; position: absolute !important; inset: 0 auto 0 0 !important;
  width: 4px !important; height: auto !important; background: var(--active) !important; border-radius: 0 !important; opacity: 1 !important; box-shadow: none !important;
}
html body:not(#b#b) #result-display > div[style*="255,45,107"]::before { background: var(--c-err) !important; }
html body:not(#b#b) #result-display > div[style*="255,159,10"]::before { background: var(--c-warn) !important; }
html body:not(#b#b) #result-display > div > div:first-child {
  display: block !important; font: 600 11.5px/1.3 var(--f-mono) !important; letter-spacing: .06em !important;
  color: var(--c-muted) !important; margin-bottom: 10px !important; padding-bottom: 10px !important; border-bottom: 1px solid var(--c-line) !important;
}
html body:not(#b#b) #result-display > div > div:first-child::after { display: none !important; }
html body:not(#b#b) #result-display div[style*="color:var(--active)"] {
  display: inline-block !important; font: 600 11.5px/1 var(--f-mono) !important; letter-spacing: .04em !important;
  color: var(--active) !important; background: var(--active-soft) !important;
  padding: 6px 10px !important; border-radius: var(--r-pill) !important; margin: 2px 0 6px !important;
}
html body:not(#b#b) #result-display div[style*="color:var(--active)"]::before { display: none !important; }
html body:not(#b#b) #result-display div[style*="color:var(--text)"] { color: var(--c-text) !important; font: 500 14.5px/1.5 var(--f-sans) !important; }
html body:not(#b#b) #result-display > div > div[style*="border:1px solid"] {
  margin-top: 10px !important; padding: 12px 64px 12px 14px !important;
  background: var(--c-2) !important; border: 1px solid var(--c-line) !important; border-radius: var(--r) !important;
  box-shadow: none !important; transform: none !important; font: 400 13px/1.6 var(--f-sans) !important; color: var(--c-text-2) !important;
}
html body:not(#b#b) #result-display > div > div[style*="border:1px solid"]::before { display: none !important; }
html body:not(#b#b) #result-display b { font: 600 15.5px/1.35 var(--f-serif) !important; color: var(--c-text) !important; letter-spacing: -.005em !important; }
html body:not(#b#b) .badge, html body:not(#b#b) .md-badge, html body:not(#b#b) .badge-new {
  display: inline-flex; align-items: center; gap: 4px; vertical-align: 2px;
  font: 600 11px/1 var(--f-sans) !important; letter-spacing: .04em !important; text-transform: uppercase;
  padding: 4px 9px !important; margin-right: 8px;
  background: var(--c-3) !important; border: 1px solid transparent !important;
  border-radius: var(--r-pill) !important; color: var(--c-text-2) !important; box-shadow: none !important;
}
html body:not(#b#b) .badge-valid { color: var(--c-ok) !important; background: var(--c-ok-soft) !important; border-color: var(--c-ok-line) !important; }
html body:not(#b#b) .badge-reject { color: var(--c-err) !important; background: var(--c-err-soft) !important; border-color: var(--c-err-line) !important; }
html body:not(#b#b) .badge-new { color: var(--c-acc-2) !important; background: var(--c-acc-soft) !important; border-color: var(--c-acc-line) !important; animation: none !important; }

/* ── 11. Tableau de bord : cartes KPI ───────────────────────────────────── */
html body:not(#b#b) main.center-panel .cards-grid, html body:not(#b#b) main.center-panel .dom-stats {
  display: grid !important; gap: clamp(8px, .8vw, 14px) !important;
  grid-template-columns: repeat(auto-fit, minmax(clamp(138px, 11vw, 190px), 1fr)) !important;
  border: 0 !important; background: none !important; background-image: none !important; padding: 0 !important;
}
html body:not(#b#b) main.center-panel .card, html body:not(#b#b) main.center-panel .dom-card {
  --b-c: var(--c-acc);
  position: relative; background: var(--c-1) !important; background-image: none !important;
  border: 1px solid var(--c-line) !important; border-radius: var(--r-lg) !important;
  box-shadow: var(--sh-1) !important; transform: none; margin: 0 !important;
  padding: 16px 16px 14px !important; min-height: 0 !important; text-align: left !important; overflow: hidden;
  transition: box-shadow var(--t) var(--ease), transform var(--t) var(--ease), border-color var(--t) var(--ease) !important;
}
html body:not(#b#b) main.center-panel .card:nth-child(6n+2) { --b-c: var(--c-med); }
html body:not(#b#b) main.center-panel .card:nth-child(6n+3) { --b-c: var(--c-vio); }
html body:not(#b#b) main.center-panel .card:nth-child(6n+4) { --b-c: var(--c-tech); }
html body:not(#b#b) main.center-panel .card:nth-child(6n+5) { --b-c: var(--c-ok); }
html body:not(#b#b) main.center-panel .card:nth-child(6n+6) { --b-c: var(--c-cyber); }
html body:not(#b#b) main.center-panel .dom-card-med { --b-c: var(--c-med); }
html body:not(#b#b) main.center-panel .dom-card-cyber { --b-c: var(--c-cyber); }
html body:not(#b#b) main.center-panel .dom-card-tech { --b-c: var(--c-tech); }
html body:not(#b#b) main.center-panel .dom-card-physics { --b-c: var(--c-phy); }
html body:not(#b#b) main.center-panel .card::after, html body:not(#b#b) main.center-panel .dom-card::after { display: none !important; }
html body:not(#b#b) main.center-panel .card::before, html body:not(#b#b) main.center-panel .dom-card::before {
  content: '' !important; display: block !important; position: absolute !important; top: 0 !important; left: 16px !important; right: auto !important;
  width: 28px !important; height: 3px !important; border-radius: 0 0 3px 3px !important;
  background: var(--b-c) !important; opacity: 1 !important; box-shadow: none !important; transform: none !important;
}
html body:not(#b#b) main.center-panel .card:hover, html body:not(#b#b) main.center-panel .dom-card:hover { box-shadow: var(--sh-3) !important; transform: translateY(-2px); border-color: var(--c-line-2) !important; }
html body:not(#b#b) main.center-panel [style*="rgba(0,0,0,0.45)"], html body:not(#b#b) main.center-panel [style*="rgba(0, 0, 0, 0.45)"] {
  background: var(--c-1) !important; background-image: none !important;
  border: 1px solid var(--c-line) !important; border-radius: var(--r-lg) !important; padding: 16px !important; box-shadow: var(--sh-1) !important;
  margin-top: 18px !important;
}
html body:not(#b#b) main.center-panel [style*="rgba(0,0,0,0.45)"]::before, html body:not(#b#b) main.center-panel [style*="rgba(0,0,0,0.45)"]::after { display: none !important; }
html body:not(#b#b) .card-title, html body:not(#b#b) .dom-label { font: 500 var(--fs-lbl)/1.3 var(--f-sans) !important; letter-spacing: .05em !important; text-transform: uppercase; color: var(--c-muted) !important; }
html body:not(#b#b) .card-val, html body:not(#b#b) .dom-val {
  font: 600 clamp(20.5px, 2vw, 28px)/1.1 var(--f-mono) !important; color: var(--c-text) !important;
  margin: 8px 0 4px !important; letter-spacing: -.03em !important; -webkit-text-fill-color: currentColor !important; background: none !important;
}
html body:not(#b#b) .card-sub { font: 400 11.5px/1.4 var(--f-sans) !important; color: var(--c-muted) !important; }
html body:not(#b#b) main.center-panel .dom-card { display: flex !important; flex-direction: column-reverse !important; justify-content: flex-end !important; }
html body:not(#b#b) main.center-panel .dom-card .dom-val { margin: 8px 0 0 !important; color: var(--b-c) !important; }

/* ── 12. Planches : figures sombres dessinées par canvas, légendées ─────── */
html body:not(#b#b) #activityCanvas, html body:not(#b#b) #graphCanvas, html body:not(#b#b) #kineticCanvas,
html body:not(#b#b) #networkCanvas, html body:not(#b#b) #tab-graph canvas {
  background: var(--c-plate) !important; border: 1px solid var(--c-plate-line) !important;
  border-radius: var(--r) !important; box-shadow: var(--sh-2) !important;
}
html body:not(#b#b) #graph-container, html body:not(#b#b) #tab-graph svg:not(.scifx-spark) { border-radius: var(--r-lg) !important; border-color: var(--c-line) !important; box-shadow: none !important; }
html body:not(#b#b) .graph-controls, html body:not(#b#b) .search-bar, html body:not(#b#b) .logs-controls { gap: 8px !important; }
html body:not(#b#b) .graph-legend { font: 500 11.5px/1.4 var(--f-sans) !important; color: var(--c-text-2) !important; gap: 8px 14px !important; }
html body:not(#b#b) .legend-item { padding: 3px 9px 3px 7px; border-radius: var(--r-pill); background: var(--c-2); border: 1px solid var(--c-line); }
html body:not(#b#b) .legend-dot { border-radius: 50% !important; box-shadow: none !important; width: 8px !important; height: 8px !important; }
html body:not(#b#b) .graph-tooltip {
  background: var(--c-1) !important; border: 1px solid var(--c-line) !important; border-radius: var(--r) !important;
  box-shadow: var(--sh-pop) !important; font: 400 13px/1.45 var(--f-sans) !important; color: var(--c-text) !important;
}
/* champs */
html body:not(#b#b) input[type="text"], html body:not(#b#b) input[type="search"], html body:not(#b#b) input[type="password"],
html body:not(#b#b) input[type="email"], html body:not(#b#b) input[type="number"], html body:not(#b#b) select, html body:not(#b#b) textarea,
html body:not(#b#b) .search-input, html body:not(#b#b) .graph-search, html body:not(#b#b) .auth-modal-input {
  font: 400 13px/1.4 var(--f-sans) !important; color: var(--c-text) !important;
  background: var(--c-1) !important; border: 1px solid var(--c-line-2) !important;
  border-radius: var(--r-md) !important; box-shadow: var(--sh-1) !important; min-height: 36px;
  transition: border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease) !important;
}
html body:not(#b#b) input::placeholder, html body:not(#b#b) textarea::placeholder { color: var(--c-faint) !important; }
html body:not(#b#b) input:hover, html body:not(#b#b) select:hover, html body:not(#b#b) textarea:hover { border-color: var(--c-faint) !important; }
html body:not(#b#b) input:focus, html body:not(#b#b) select:focus, html body:not(#b#b) textarea:focus { border-color: var(--c-acc) !important; outline: none !important; box-shadow: var(--ring) !important; }
html body:not(#b#b) input[type="range"] { accent-color: var(--c-acc); }
html body:not(#b#b) input[type="checkbox"], html body:not(#b#b) input[type="radio"] { accent-color: var(--c-acc); }

/* rapports : onglets domaine en pilules */
html body:not(#b#b) .report-domain-tabs { gap: 6px !important; border: 0 !important; padding: 0 0 4px !important; background: none !important; flex-wrap: wrap; }
html body:not(#b#b) .report-dtab {
  background: var(--c-1) !important; border: 1px solid var(--c-line-2) !important; border-radius: var(--r-pill) !important; box-shadow: none !important;
  padding: 7px 12px !important; position: relative; font: 500 11.5px/1 var(--f-sans) !important; letter-spacing: 0 !important; color: var(--c-text-2) !important;
  transition: all var(--t-fast) var(--ease) !important;
}
html body:not(#b#b) .report-dtab:hover { color: var(--c-text) !important; background: var(--c-2) !important; }
html body:not(#b#b) .report-dtab.active { color: #fff !important; background: var(--c-text) !important; border-color: var(--c-text) !important; }
html body:not(#b#b) .report-dtab.active .rdc-badge { background: rgba(255,255,255,.18) !important; color: #fff !important; border-color: transparent !important; }
html body:not(#b#b) .rdc-badge { font: 600 11px/1 var(--f-mono) !important; padding: 3px 6px !important; margin-left: 6px; background: var(--c-3) !important; border: 0 !important; border-radius: var(--r-pill) !important; color: var(--c-text-2) !important; }
html body:not(#b#b) .report-item, html body:not(#b#b) .search-result-item, html body:not(#b#b) [class*="report-card"] {
  background: var(--c-1) !important; border: 1px solid var(--c-line) !important; border-radius: var(--r-lg) !important;
  box-shadow: var(--sh-1) !important; transform: none !important;
  transition: box-shadow var(--t) var(--ease), border-color var(--t) var(--ease) !important;
}
html body:not(#b#b) .report-item:hover, html body:not(#b#b) .search-result-item:hover { box-shadow: var(--sh-3) !important; border-color: var(--c-line-2) !important; }
html body:not(#b#b) .report-header { padding: 16px 18px !important; background: transparent !important; border: 0 !important; gap: 14px; }
html body:not(#b#b) .report-header:hover { background: transparent !important; }
html body:not(#b#b) .report-title, html body:not(#b#b) .rpt-title-text, html body:not(#b#b) .sr-title {
  font: 600 clamp(14.5px, 1.1vw, 16.5px)/1.35 var(--f-serif) !important; letter-spacing: -.005em !important; color: var(--c-text) !important; text-transform: none !important;
}
html body:not(#b#b) .report-title { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; }
html body:not(#b#b) .rpt-title-text { flex-basis: 100%; margin: 4px 0 0 !important; }
html body:not(#b#b) .report-meta, html body:not(#b#b) .sr-sub, html body:not(#b#b) .pl-sub { font: 400 11.5px/1.45 var(--f-mono) !important; color: var(--c-muted) !important; letter-spacing: 0 !important; margin-top: 4px; }
html body:not(#b#b) .report-toggle { color: var(--c-acc-2) !important; font: 600 11.5px/1 var(--f-sans) !important; padding: 8px 10px; border-radius: var(--r-sm); cursor: pointer; }
html body:not(#b#b) .report-toggle:hover { background: var(--c-acc-soft); }
html body:not(#b#b) .report-body { border-top: 1px solid var(--c-line) !important; background: var(--c-2) !important; }
html body:not(#b#b) .report-content { font: 400 14px/1.7 var(--f-sans) !important; color: var(--c-text-2) !important; }
html body:not(#b#b) .md-h1, html body:not(#b#b) .md-h2, html body:not(#b#b) .md-h3 {
  font-family: var(--f-serif) !important; color: var(--c-text) !important; letter-spacing: -.01em !important;
  text-transform: none !important; border: 0 !important; background: none !important; -webkit-text-fill-color: currentColor !important;
}
html body:not(#b#b) .md-h1 { font-size: 22.5px !important; font-weight: 600 !important; }
html body:not(#b#b) .md-h2 { font-size: 17.5px !important; font-weight: 600 !important; padding-bottom: 6px !important; border-bottom: 1px solid var(--c-line) !important; }
html body:not(#b#b) .md-h3 { font-size: 15.5px !important; font-weight: 600 !important; }
html body:not(#b#b) .md-code, html body:not(#b#b) .md-pre, html body:not(#b#b) .md-block {
  font-family: var(--f-mono) !important; font-size: 13px !important;
  background: var(--c-3) !important; border: 1px solid var(--c-line) !important; border-radius: var(--r-sm) !important; color: var(--c-text) !important;
}
html body:not(#b#b) .md-code { padding: 1px 6px !important; }
html body:not(#b#b) .md-table { border-collapse: collapse !important; font-size: 13px !important; }
html body:not(#b#b) .md-table th { font: 600 var(--fs-lbl)/1.3 var(--f-sans) !important; letter-spacing: .05em; text-transform: uppercase; color: var(--c-muted) !important; background: var(--c-2) !important; border-bottom: 1px solid var(--c-line-2) !important; }
html body:not(#b#b) .md-table td { border-bottom: 1px solid var(--c-line) !important; font-variant-numeric: tabular-nums; }
html body:not(#b#b) .md-link { color: var(--c-acc-2) !important; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--c-acc-line); }
html body:not(#b#b) .md-tip, html body:not(#b#b) .md-warn { border-radius: var(--r) !important; box-shadow: none !important; padding: 10px 14px !important; }
html body:not(#b#b) .md-warn { border: 1px solid var(--c-warn-line) !important; background: var(--c-warn-soft) !important; color: #7A2E0E !important; }
html body:not(#b#b) .md-tip { border: 1px solid var(--c-acc-line) !important; background: var(--c-acc-soft) !important; color: #1F2F7A !important; }
html body:not(#b#b) main.center-panel [style*="background:#000000"], html body:not(#b#b) main.center-panel [style*="background:#000;"] {
  background: var(--c-2) !important; border: 1px solid var(--c-line) !important; border-radius: var(--r) !important;
  font: 500 11.5px/1.4 var(--f-sans) !important; color: var(--c-muted) !important; padding: 8px 8px 8px 14px !important; flex-wrap: wrap; gap: 8px;
}
html body:not(#b#b) .report-item { margin-bottom: 12px !important; overflow: hidden; }
html body:not(#b#b) .report-item[style*="box-shadow"] { border-color: var(--c-acc-line) !important; box-shadow: var(--sh-2), inset 4px 0 0 var(--active) !important; background: var(--c-1) !important; }
html body:not(#b#b) .report-domain-badge {
  display: inline-flex; align-items: center; gap: 5px;
  font: 600 11px/1 var(--f-sans) !important; letter-spacing: .04em !important;
  color: var(--b-rd, var(--c-text-2)) !important; background: var(--b-rd-soft, var(--c-3)) !important;
  border: 0 !important; border-radius: var(--r-pill) !important; padding: 5px 10px !important; box-shadow: none !important;
}
html body:not(#b#b) .report-domain-badge.rdb-medical { --b-rd: var(--c-med); --b-rd-soft: var(--c-med-soft); }
html body:not(#b#b) .report-domain-badge.rdb-cyber   { --b-rd: var(--c-cyber); --b-rd-soft: var(--c-cyber-soft); }
html body:not(#b#b) .report-domain-badge.rdb-tech    { --b-rd: var(--c-tech); --b-rd-soft: var(--c-tech-soft); }
html body:not(#b#b) .report-domain-badge.rdb-physics { --b-rd: var(--c-phy); --b-rd-soft: var(--c-phy-soft); }
html body:not(#b#b) .report-header [style*="font-size:9px"] { font: 400 13px/1.6 var(--f-sans) !important; color: var(--c-text-2) !important; margin-top: 8px !important; max-width: 88ch; }
html body:not(#b#b) .report-actions { gap: 6px !important; flex-wrap: wrap; align-items: center; }
html body:not(#b#b) .report-actions .dl-btn { min-height: 32px; padding: 5px 10px !important; font-size: 11.5px !important; box-shadow: none !important; }
html body:not(#b#b) .dl-btn[style*="ff2d6b"] { color: var(--c-err) !important; }
html body:not(#b#b) .dl-btn[style*="ff2d6b"]:hover { background: var(--c-err-soft) !important; border-color: var(--c-err) !important; }
html body:not(#b#b) .dot-unread { box-shadow: 0 0 0 3px var(--active-soft) !important; animation: none !important; background-color: var(--active) !important; }
html body:not(#b#b) .badge-new.dot-unread { background-color: var(--c-acc-soft) !important; box-shadow: none !important; }
html body:not(#b#b) .reports-pagination { gap: 4px !important; }
html body:not(#b#b) .rpag-btn { min-height: 30px; min-width: 30px; padding: 0 8px !important; font-family: var(--f-mono) !important; box-shadow: none !important; border-radius: var(--r-sm) !important; }
html body:not(#b#b) .rpag-btn.rpag-active { background: var(--c-text) !important; border-color: var(--c-text) !important; color: #fff !important; }
html body:not(#b#b) .rpag-btn:disabled { opacity: .4 !important; }

/* ── 13. Colonne droite : cartes compactes ─────────────────────────────── */
html body:not(#b#b) .sidebar-right { padding: 12px !important; }
html body:not(#b#b) #active-domain-card, html body:not(#b#b) aside.sidebar-right .audio-player,
html body:not(#b#b) aside.sidebar-right > div[onclick*="'health'"], html body:not(#b#b) aside.sidebar-right .progress-bar-wrap,
html body:not(#b#b) aside.sidebar-right .live-feed, html body:not(#b#b) aside.sidebar-right .kinetic-chart,
html body:not(#b#b) aside.sidebar-right .access-badge {
  background: var(--c-2) !important; background-image: none !important;
  border: 1px solid var(--c-line) !important; border-radius: var(--r-lg) !important;
  box-shadow: none !important; transform: none !important;
  transition: border-color var(--t) var(--ease), background-color var(--t) var(--ease) !important;
}
html body:not(#b#b) aside.sidebar-right > div[onclick*="'health'"]:hover { background: var(--c-1) !important; border-color: var(--c-line-2) !important; }
html body:not(#b#b) #active-domain-card {
  background: var(--active-soft) !important; border-color: color-mix(in srgb, var(--active) 28%, transparent) !important;
  position: relative; overflow: hidden;
}
html body:not(#b#b) #active-domain-card::before, html body:not(#b#b) #active-domain-card::after,
html body:not(#b#b) aside.sidebar-right .audio-player::before, html body:not(#b#b) aside.sidebar-right .audio-player::after,
html body:not(#b#b) aside.sidebar-right .ap-cover-wrap::before, html body:not(#b#b) aside.sidebar-right .ap-cover-wrap::after,
html body:not(#b#b) #adc-label::after { display: none !important; }
html body:not(#b#b) #adc-label { color: var(--active) !important; font: 650 14px/1.25 var(--f-sans) !important; letter-spacing: 0 !important; -webkit-text-fill-color: currentColor !important; background: none !important; }
html body:not(#b#b) #adc-desc { color: var(--c-text-2) !important; font: 400 13px/1.45 var(--f-sans) !important; }
html body:not(#b#b) #adc-icon { filter: none !important; text-shadow: none !important; animation: none !important; }
html body:not(#b#b) aside.sidebar-right .ap-cover-halo { display: none !important; }
html body:not(#b#b) aside.sidebar-right .ap-cover-orbit { background: var(--c-plate) !important; border: 0 !important; box-shadow: var(--sh-3) !important; filter: none !important; }
html body:not(#b#b) aside.sidebar-right .ap-cover, html body:not(#b#b) aside.sidebar-right .ap-viz { box-shadow: none !important; filter: none !important; }
html body:not(#b#b) aside.sidebar-right .ap-cover-wrap { box-shadow: none !important; filter: none !important; }
html body:not(#b#b) aside.sidebar-right .ap-track-title { font: 600 13px/1.35 var(--f-sans) !important; color: var(--c-text) !important; letter-spacing: 0 !important; }
html body:not(#b#b) aside.sidebar-right .ap-track-artist { font: 400 11.5px/1.35 var(--f-sans) !important; color: var(--c-muted) !important; }
html body:not(#b#b) aside.sidebar-right .ap-btn {
  background: var(--c-1) !important; border: 1px solid var(--c-line) !important; color: var(--c-text-2) !important;
  box-shadow: var(--sh-1) !important; border-radius: 50% !important; transition: all var(--t-fast) var(--ease) !important;
}
html body:not(#b#b) aside.sidebar-right .ap-btn:hover { background: var(--c-1) !important; color: var(--c-text) !important; box-shadow: var(--sh-3) !important; transform: translateY(-1px); }
html body:not(#b#b) aside.sidebar-right .ap-btn-main { background: var(--c-text) !important; color: #fff !important; border-color: var(--c-text) !important; box-shadow: var(--sh-3) !important; }
html body:not(#b#b) aside.sidebar-right .ap-btn-main:hover { background: var(--c-acc) !important; border-color: var(--c-acc) !important; color: #fff !important; }
html body:not(#b#b) aside.sidebar-right .ap-progress-bar, html body:not(#b#b) aside.sidebar-right .progress-bar-track { background: var(--c-4) !important; box-shadow: none !important; border: 0 !important; border-radius: var(--r-pill) !important; }
html body:not(#b#b) aside.sidebar-right .ap-progress-fill, html body:not(#b#b) aside.sidebar-right .progress-bar-fill { background: var(--c-acc) !important; box-shadow: none !important; border-radius: var(--r-pill) !important; }
html body:not(#b#b) aside.sidebar-right .progress-bar-shine { display: none !important; }
html body:not(#b#b) aside.sidebar-right .ap-progress-thumb { background: #fff !important; border: 2px solid var(--c-acc) !important; box-shadow: var(--sh-2) !important; }
html body:not(#b#b) aside.sidebar-right .ap-spatial-panel { background: var(--c-1) !important; border-color: var(--c-line) !important; box-shadow: none !important; border-radius: var(--r) !important; }
html body:not(#b#b) aside.sidebar-right .ap-sp-led { background: var(--c-ok) !important; box-shadow: 0 0 0 3px var(--c-ok-soft) !important; animation: none !important; }
html body:not(#b#b) aside.sidebar-right :is(.ap-row-lbl,.ap-eq-label,.kparam-label,.ks-label,.ks-stat-label,.ab-label,.progress-bar-sub,.ap-sp-title) {
  font: 500 var(--fs-lbl)/1.3 var(--f-sans) !important; letter-spacing: .03em !important; color: var(--c-muted) !important;
}
html body:not(#b#b) aside.sidebar-right :is(.ap-row-val,.ap-eq-val,.kparam-val,.ks-val,.ks-stat-val,.progress-bar-pct,.ap-times) { color: var(--c-text) !important; font-family: var(--f-mono) !important; }
html body:not(#b#b) aside.sidebar-right .progress-bar-pct { font-weight: 600 !important; color: var(--c-acc-2) !important; }
html body:not(#b#b) aside.sidebar-right .ab-dot { box-shadow: 0 0 0 3px currentColor; animation: none !important; }
html body:not(#b#b) aside.sidebar-right .access-badge-demo { background: var(--c-warn-soft) !important; border-color: var(--c-warn-line) !important; color: #7A2E0E !important; }
html body:not(#b#b) aside.sidebar-right .access-badge-full { background: var(--c-ok-soft) !important; border-color: var(--c-ok-line) !important; color: #054F31 !important; }
html body:not(#b#b) aside.sidebar-right .access-badge-demo .ab-dot { background: var(--c-warn) !important; color: var(--c-warn-line); }
html body:not(#b#b) aside.sidebar-right .access-badge-full .ab-dot { background: var(--c-ok) !important; color: var(--c-ok-line); }
html body:not(#b#b) aside.sidebar-right .live-feed { background: var(--c-1) !important; padding: 4px 12px !important; }
html body:not(#b#b) aside.sidebar-right .feed-item {
  font: 400 13px/1.45 var(--f-sans) !important; color: var(--c-text-2) !important;
  background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--c-line) !important;
  border-radius: 0 !important; box-shadow: none !important; padding: 8px 0 8px 16px !important; position: relative;
}
html body:not(#b#b) aside.sidebar-right .feed-item:first-child { animation: b-in .35s var(--ease) both !important; }
html body:not(#b#b) aside.sidebar-right .feed-item:last-child { border-bottom: 0 !important; }
html body:not(#b#b) aside.sidebar-right .feed-item::before {
  content: '' !important; position: absolute !important; left: 2px !important; top: 15px !important;
  width: 6px !important; height: 6px !important; border-radius: 50% !important; background: var(--active) !important;
  box-shadow: 0 0 0 3px var(--active-soft) !important; animation: none !important;
}
html body:not(#b#b) aside.sidebar-right .feed-time { font-size: 11.5px !important; color: var(--c-faint) !important; margin-right: 6px; }
@keyframes b-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
html body:not(#b#b) #progress-phases > div { box-shadow: none !important; animation: none !important; border-radius: var(--r-pill) !important; }
html body:not(#b#b) #progress-phases > div::before { box-shadow: none !important; animation: none !important; }
html body:not(#b#b) aside.sidebar-right .kinetic-chart { background: var(--c-1) !important; }

/* ── 14. Modales, superpositions, notifications ─────────────────────────── */
html body:not(#b#b) .help-overlay, html body:not(#b#b) #auth-modal, html body:not(#b#b) #presentation-overlay,
html body:not(#b#b) #pdf-pw-modal, html body:not(#b#b) .gpu-howto-modal, html body:not(#b#b) #scifx-palette {
  background: rgba(17,24,39,.36) !important;
  -webkit-backdrop-filter: blur(6px) !important; backdrop-filter: blur(6px) !important;
}
html body:not(#b#b) :is(.help-popup,.auth-modal-content,.cmo-box,.imo-box,.sco-box,.ktm-box,.ktw-box,.gpu-howto-content,.scifx-pal-box,#sciux-keys .sciux-keys-box,#sciux-inspector) {
  background: var(--c-1) !important; background-image: none !important;
  border: 1px solid var(--c-line) !important; border-radius: var(--r-xl) !important;
  box-shadow: var(--sh-modal) !important; clip-path: none !important;
  color: var(--c-text-2) !important; font-family: var(--f-sans) !important;
}
html body:not(#b#b) .help-popup::before, html body:not(#b#b) .help-popup::after,
html body:not(#b#b) .cmo-box::before, html body:not(#b#b) .imo-box::before, html body:not(#b#b) .sco-box::before { display: none !important; }
html body:not(#b#b) :is(.cmo-title,.imo-title,.sco-title,.help-popup h2,.auth-modal-content h2,.auth-modal-content h3) {
  font: 650 16.5px/1.3 var(--f-sans) !important; letter-spacing: -.01em !important; color: var(--c-text) !important;
  -webkit-text-fill-color: currentColor !important; background: none !important; text-transform: none;
}
html body:not(#b#b) .cmo-body, html body:not(#b#b) .imo-body, html body:not(#b#b) .sco-info { font: 400 13px/1.6 var(--f-sans) !important; color: var(--c-text-2) !important; }
html body:not(#b#b) .cmo-actions, html body:not(#b#b) .sco-actions { justify-content: flex-end !important; gap: 8px !important; }
html body:not(#b#b) .htab, html body:not(#b#b) .help-tab {
  background: transparent !important; border: 0 !important; border-radius: var(--r-md) !important; box-shadow: none !important;
  font: 500 13px/1 var(--f-sans) !important; letter-spacing: 0 !important; color: var(--c-muted) !important; padding: 9px 12px !important;
}
html body:not(#b#b) .htab:hover, html body:not(#b#b) .help-tab:hover { color: var(--c-text) !important; background: var(--c-2) !important; }
html body:not(#b#b) .htab-active, html body:not(#b#b) .help-tab.active { color: var(--c-acc-2) !important; background: var(--c-acc-soft) !important; }
html body:not(#b#b) .help-close, html body:not(#b#b) .auth-modal-close, html body:not(#b#b) .gpu-howto-close {
  background: var(--c-2) !important; border: 1px solid var(--c-line) !important; border-radius: 50% !important; color: var(--c-text-2) !important; box-shadow: none !important;
}
html body:not(#b#b) .feature-card { background: var(--c-2) !important; border: 1px solid var(--c-line) !important; border-radius: var(--r-lg) !important; box-shadow: none !important; }
html body:not(#b#b) .feature-card:hover { background: var(--c-1) !important; box-shadow: var(--sh-3) !important; }
html body:not(#b#b) .feature-title { font: 600 13.5px/1.35 var(--f-sans) !important; color: var(--c-text) !important; letter-spacing: 0 !important; }
html body:not(#b#b) .feature-desc { font: 400 13px/1.55 var(--f-sans) !important; color: var(--c-text-2) !important; }
html body:not(#b#b) #toast-container > * {
  background: var(--c-text) !important; border: 0 !important; border-radius: var(--r) !important;
  box-shadow: var(--sh-pop) !important; color: #fff !important; font: 500 13px/1.45 var(--f-sans) !important;
  padding: 10px 14px 10px 14px !important; animation: b-in .25s var(--ease) both !important;
}
html body:not(#b#b) #toast-container > .ok, html body:not(#b#b) #toast-container > .success { box-shadow: var(--sh-pop), inset 3px 0 0 #32D583 !important; }
html body:not(#b#b) #toast-container > .error { box-shadow: var(--sh-pop), inset 3px 0 0 #F97066 !important; }
html body:not(#b#b) #toast-container > .warn { box-shadow: var(--sh-pop), inset 3px 0 0 #FDB022 !important; }
html body:not(#b#b) .gpu-warn-banner { background: var(--c-warn-soft) !important; border: 1px solid var(--c-warn-line) !important; box-shadow: none !important; color: #7A2E0E !important; }
html body:not(#b#b) #back-to-top, html body:not(#b#b) #btn-toggle-all {
  background: var(--c-1) !important; border: 1px solid var(--c-line) !important; border-radius: var(--r-pill) !important;
  box-shadow: var(--sh-3) !important; color: var(--c-text-2) !important;
}

/* ── 15. Couche UX (90-ux) : barre d'état, fil d'Ariane, inspecteur ─────── */
html body:not(#b#b) #sciux-statusbar {
  background: rgba(255,255,255,.9) !important; -webkit-backdrop-filter: saturate(180%) blur(12px) !important; backdrop-filter: saturate(180%) blur(12px) !important;
  border-top: 1px solid var(--c-line) !important; color: var(--c-text-2) !important; box-shadow: 0 -1px 0 rgba(16,24,40,.02) !important;
  font-family: var(--f-sans) !important;
}
html body:not(#b#b) #sciux-statusbar :is(.sciux-sb-val,.sciux-mono) { color: var(--c-text) !important; font-family: var(--f-mono) !important; }
html body:not(#b#b) #sciux-statusbar .sciux-sb-meter { background: var(--c-4) !important; border-radius: var(--r-pill) !important; }
html body:not(#b#b) #sciux-statusbar .sciux-sb-meter-fill { background: var(--c-acc) !important; border-radius: var(--r-pill) !important; }
html body:not(#b#b) #sciux-statusbar .sciux-sb-dot { box-shadow: none !important; }
html body:not(#b#b) #sciux-statusbar .sciux-sb-link:hover, html body:not(#b#b) #sciux-statusbar .sciux-sb-seg:hover { background: var(--c-2) !important; }
html body:not(#b#b) #sciux-statusbar kbd, html body:not(#b#b) #sciux-keys kbd { background: var(--c-1) !important; color: var(--c-text) !important; border-color: var(--c-line-2) !important; box-shadow: 0 1px 0 var(--c-line-2) !important; }
html body:not(#b#b) #sciux-crumbs { color: var(--c-muted) !important; font-family: var(--f-sans) !important; }
html body:not(#b#b) #sciux-crumbs .sciux-crumb-dom { color: var(--active) !important; font-weight: 600; }
html body:not(#b#b) .sciux-tag { background: var(--c-3) !important; color: var(--c-text-2) !important; border-color: transparent !important; border-radius: var(--r-pill) !important; }
html body:not(#b#b) .sciux-inspect-btn { background: var(--c-1) !important; color: var(--c-text-2) !important; border: 1px solid var(--c-line-2) !important; border-radius: var(--r-pill) !important; box-shadow: var(--sh-2) !important; }
html body:not(#b#b) .sciux-inspect-btn:hover { color: var(--c-acc-2) !important; border-color: var(--c-acc-line) !important; }
html body:not(#b#b) #sciux-inspector .sciux-insp-title { font-family: var(--f-serif) !important; color: var(--c-text) !important; }
html body:not(#b#b) #sciux-inspector .sciux-insp-kicker { color: var(--active) !important; }

/* ── 16. Mode démo ─────────────────────────────────────────────────────── */
html body.demo-mode:not(#b#b) .sidebar-left .phase-btn::after { color: var(--c-muted) !important; filter: grayscale(1); opacity: .8 !important; }

/* ── 17. Analyse scientifique (95-analytics, #sciana-root) ─────────────── */
html body:not(#b#b) #sciana-root.sciana {
  --sa-bg: var(--c-1); --sa-bg-2: var(--c-2); --sa-bg-3: var(--c-3);
  --sa-ink: var(--c-text); --sa-ink-2: var(--c-text-2); --sa-muted: var(--c-muted);
  --sa-line: var(--c-line); --sa-line-2: var(--c-line-2); --sa-acc: var(--c-acc);
  --sa-c1: var(--c-acc); --sa-c2: var(--c-y-2); --sa-c3: #6E86C2; --sa-c4: #3D5A99; --sa-neutral: #B8B9B2;
  --sa-ok: var(--c-ok); --sa-err: var(--c-err); --sa-warn: var(--c-warn);
  --sa-med: var(--c-med); --sa-cyber: var(--c-cyber); --sa-tech: var(--c-tech); --sa-phy: var(--c-phy);
  --sa-r: var(--r-lg); --sa-r-sm: var(--r-sm);
  margin-top: 28px !important;
}
html body:not(#b#b) #sciana-root .sa-head { border-bottom: 0 !important; padding-bottom: 0 !important; }
html body:not(#b#b) #sciana-root .sa-h { font: 600 clamp(17.5px, 1.5vw, 21.5px)/1.2 var(--f-serif) !important; color: var(--c-text) !important; letter-spacing: -.01em !important; }
html body:not(#b#b) #sciana-root .sa-h::before { content: 'Fig.'; display: inline-block; margin-right: 10px; padding: 3px 7px; vertical-align: 3px; font: 700 11px/1 var(--f-mono); color: var(--c-acc); background: var(--c-y); border-radius: var(--r-xs); }
html body:not(#b#b) #sciana-root .sa-lede { font: 400 13px/1.55 var(--f-sans) !important; color: var(--c-text-2) !important; }
html body:not(#b#b) #sciana-root .sa-card {
  background: var(--c-1) !important; border: 1px solid var(--c-line) !important; border-radius: var(--r-lg) !important;
  box-shadow: var(--sh-1) !important; padding: clamp(14px, 1.2vw, 20px) !important;
  transition: box-shadow var(--t) var(--ease), border-color var(--t) var(--ease) !important;
}
html body:not(#b#b) #sciana-root .sa-card:hover { box-shadow: var(--sh-3) !important; border-color: var(--c-line-2) !important; }
html body:not(#b#b) #sciana-root .sa-card-title { font: 700 11.5px/1.3 var(--f-sans) !important; letter-spacing: .07em !important; text-transform: uppercase; color: var(--c-acc) !important; }
html body:not(#b#b) #sciana-root .sa-card-head { border-bottom: 1px solid var(--c-line); padding-bottom: 10px; margin-bottom: 12px; }
html body:not(#b#b) #sciana-root .sa-kpi { background: var(--c-2) !important; border: 1px solid var(--c-line) !important; border-radius: var(--r) !important; position: relative; overflow: hidden; }
html body:not(#b#b) #sciana-root .sa-kpi::before { content: ''; position: absolute; left: 0; top: 0; width: 3px; height: 100%; background: var(--c-acc); }
html body:not(#b#b) #sciana-root .sa-kpi:first-child::before { background: var(--c-y); }
html body:not(#b#b) #sciana-root .sa-kpi-v { font: 600 clamp(20.5px, 1.9vw, 26px)/1.1 var(--f-mono) !important; color: var(--c-acc) !important; letter-spacing: -.03em !important; }
html body:not(#b#b) #sciana-root .sa-kpi-k { color: var(--c-muted) !important; font-weight: 600 !important; }
html body:not(#b#b) #sciana-root .sa-svg .sa-gl { stroke: var(--c-line) !important; stroke-dasharray: 2 3; }
html body:not(#b#b) #sciana-root .sa-svg .sa-base { stroke: var(--c-text) !important; }
html body:not(#b#b) #sciana-root .sa-svg .sa-tick { fill: var(--c-muted) !important; }
html body:not(#b#b) #sciana-root .sa-svg .sa-label { fill: var(--c-text-2) !important; }
html body:not(#b#b) #sciana-root .sa-svg .sa-axis-title { fill: var(--c-acc) !important; font-weight: 600; }
html body:not(#b#b) #sciana-root .sa-svg .sa-value, html body:not(#b#b) #sciana-root .sa-svg .sa-endlbl { fill: var(--c-text) !important; }
html body:not(#b#b) #sciana-root .sa-svg .sa-line { stroke: var(--c-acc) !important; stroke-width: 2px; }
html body:not(#b#b) #sciana-root .sa-svg .sa-ma { stroke: var(--c-y-2) !important; }
html body:not(#b#b) #sciana-root .sa-svg .sa-median { stroke: var(--c-y-2) !important; }
html body:not(#b#b) #sciana-root .sa-svg .sa-dot { fill: #fff !important; stroke: var(--c-acc) !important; }
html body:not(#b#b) #sciana-root .sa-svg .sa-hit.is-hover > .sa-hitbox,
html body:not(#b#b) #sciana-root .sa-svg .is-hover.sa-col > .sa-hitbox,
html body:not(#b#b) #sciana-root .sa-svg .is-hover.sa-row > .sa-hitbox { fill: var(--c-y-soft) !important; }
html body:not(#b#b) #sciana-root .sa-meter { background: var(--c-3) !important; border-radius: var(--r-pill) !important; }
html body:not(#b#b) #sciana-root .sa-meter-fill { background: var(--c-acc) !important; border-radius: var(--r-pill) !important; }
html body:not(#b#b) #sciana-root .sa-btn, html body:not(#b#b) #sciana-root .sa-toggle { background: var(--c-1) !important; border: 1px solid var(--c-line-2) !important; border-radius: var(--r-md) !important; color: var(--c-text) !important; }
html body:not(#b#b) #sciana-root .sa-btn:hover:not(:disabled), html body:not(#b#b) #sciana-root .sa-toggle:hover { border-color: var(--c-acc) !important; color: var(--c-acc) !important; }
html body:not(#b#b) #sciana-root .sa-toggle[aria-pressed="true"] { background: var(--c-acc) !important; color: #fff !important; border-color: var(--c-acc) !important; }
html body:not(#b#b) #sciana-root .sa-foot, html body:not(#b#b) #sciana-root .sa-src, html body:not(#b#b) #sciana-root .sa-mult-cap { font-family: var(--f-serif) !important; font-style: italic; color: var(--c-muted) !important; }
html body:not(#b#b) #sciana-root .sa-details > summary { color: var(--c-acc) !important; font-weight: 600; }
html body:not(#b#b) #sciana-root .sa-table th { color: var(--c-muted) !important; background: var(--c-2) !important; }
html body:not(#b#b) #sciana-root .sa-skel > span { background: linear-gradient(90deg, var(--c-3), var(--c-2), var(--c-3)) !important; background-size: 200% 100% !important; }
html body:not(#b#b) #sciana-tip.sa-tip {
  background: var(--c-acc) !important; color: #fff !important; border: 0 !important;
  border-radius: var(--r) !important; box-shadow: var(--sh-pop) !important; padding: 10px 12px !important;
  font: 400 11.5px/1.45 var(--f-sans) !important;
}
html body:not(#b#b) #sciana-tip .sa-tip-h { color: var(--c-y) !important; }
html body:not(#b#b) #sciana-tip .sa-tip-l { color: var(--c-navy-ink) !important; }

/* ── 18. Ajustements fins ──────────────────────────────────────────────── */
html body:not(#b#b) > header .logo-text p[style], html body:not(#b#b) > header [style*="color"]:not(#stat-complete) { color: var(--c-navy-ink) !important; }
html body:not(#b#b) > header .hstat-val[style] { color: #fff !important; }
html body:not(#b#b) > header #stat-complete[style] { color: var(--c-y) !important; }
html:root { --sciux-acc: var(--c-acc); }
html body:not(#b#b) #sciux-crumbs {
  background: var(--c-2) !important; border: 0 !important; border-bottom: 1px solid var(--c-line) !important; border-radius: 0 !important;
  padding: 8px clamp(14px, 1.5vw, 24px) !important; box-shadow: none !important; color: var(--c-muted) !important;
}
html body:not(#b#b) #sciux-crumbs .sciux-crumb-root { color: var(--c-acc) !important; font-weight: 700 !important; }
html body:not(#b#b) #sciux-crumbs [aria-current="page"] { color: var(--c-text) !important; }
html body:not(#b#b) #sciux-crumbs .sciux-crumb-ctx { background: var(--c-y-soft) !important; border-color: var(--c-y-line) !important; color: var(--c-y-ink) !important; }
html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge)::after { color: var(--c-acc) !important; font-weight: 700 !important; }

/* ── 19. Petits écrans ─────────────────────────────────────────────────── */
@media (max-width: 760px) {
  html body:not(#b#b) .domain-bar { flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: none; padding: 10px 16px !important; }
  html body:not(#b#b) .domain-bar .domain-tab { flex: 0 0 auto !important; min-height: 40px; font-size: 11.5px !important; padding: 0 14px 0 6px !important; }
  html body:not(#b#b) .domain-bar .domain-tab[class*="active-"] { padding-right: 28px !important; }
  html body:not(#b#b) > header .hstat:last-child { margin-right: 0 !important; }
  html body:not(#b#b) > header .header-stats { display: grid !important; grid-template-columns: repeat(5, minmax(0, 1fr)) !important; width: 100%; overflow: visible !important; -webkit-mask-image: none !important; mask-image: none !important; }
  html body:not(#b#b) > header .hstat { padding: 8px 6px !important; grid-template-columns: auto minmax(0,1fr); }
  html body:not(#b#b) > header .hstat:first-child { border-left: 0 !important; }
  html body:not(#b#b) > header .hstat:last-child { border-right: 0 !important; }
  html body:not(#b#b) > header .hstat-lbl { font-size: 10px !important; letter-spacing: .04em !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  html body:not(#b#b) > header .hstat-val { font-size: 14px !important; }
  html body:not(#b#b) .sidebar-left, html body:not(#b#b) .center-panel, html body:not(#b#b) .sidebar-right { border-radius: var(--r-lg) !important; }
}
@media (min-width: 1920px) {
  html body:not(#b#b) > header, html body:not(#b#b) .domain-bar {
    width: 100% !important; max-width: none !important;
    padding-left: max(var(--gut), calc((100% - var(--rsp-shell-max, 2200px)) / 2)) !important;
    padding-right: max(var(--gut), calc((100% - var(--rsp-shell-max, 2200px)) / 2)) !important;
  }
}

/* ── 20. <header> internes (sciana, inspecteur…) : style.css d'origine visait tout <header> ── */
html body :where(header:not(body > header)) {
  background: none; box-shadow: none; border-bottom: 0; padding: 0; z-index: auto; gap: 8px;
}
html body :where(header:not(body > header))::before,
html body :where(header:not(body > header))::after { content: none; animation: none; }

/* ── 21. Finitions : panneaux dynamiques 90-ux (spécificité 3 ID > #u#u#u) ── */
/* sections repliables */
html body:not(#b#b#b) .section-title[data-sciux-acc] { border-radius: var(--r-sm) !important; padding: 4px 6px !important; margin-left: -6px !important; margin-right: -6px !important; transition: background-color var(--t-fast) var(--ease) !important; }
html body:not(#b#b#b) .section-title[data-sciux-acc]:hover { background: var(--c-2) !important; }
html body:not(#b#b#b) .section-title[data-sciux-open="0"] { margin-bottom: 6px !important; }
html body:not(#b#b#b) .sciux-acc-btn { color: var(--c-muted) !important; font: 500 11.5px/1.2 var(--f-sans) !important; }
html body:not(#b#b#b) .sciux-acc-sum { color: var(--c-text-2) !important; font-family: var(--f-mono) !important; font-size: 11.5px !important; letter-spacing: 0 !important; text-transform: none !important; }
html body:not(#b#b#b) .sciux-acc-sum[data-level="ok"] { color: var(--c-ok) !important; }
html body:not(#b#b#b) .sciux-acc-sum[data-level="warn"] { color: var(--c-warn) !important; }
html body:not(#b#b#b) .sciux-acc-sum[data-level="bad"] { color: var(--c-err) !important; }
html body:not(#b#b#b) .sciux-acc-sum[data-level="run"] { color: var(--c-acc) !important; font-weight: 600 !important; }
html body:not(#b#b#b) .sciux-acc-chev { width: 22px !important; height: 22px !important; border-radius: 50%; color: var(--c-acc) !important; background: var(--c-acc-soft); transition: transform var(--t) var(--ease), background-color var(--t-fast) var(--ease) !important; }
html body:not(#b#b#b) .section-title[data-sciux-acc]:hover .sciux-acc-chev { background: var(--c-y) !important; color: var(--c-acc) !important; }
html body:not(#b#b#b) .sciux-acc-btn:focus-visible::before { outline: 2px solid var(--c-acc) !important; outline-offset: 2px; }

/* lecteur compact */
html body:not(#b#b#b) aside.sidebar-right .audio-player[data-sciux-mini="1"] { padding: 10px 10px 10px 10px !important; background: var(--c-1) !important; border-color: var(--c-line) !important; box-shadow: var(--sh-1) !important; column-gap: 10px !important; }
html body:not(#b#b#b) .audio-player[data-sciux-mini="1"] #ap-play-btn { width: 36px !important; height: 36px !important; min-width: 36px !important; background: var(--c-acc) !important; border-color: var(--c-acc) !important; color: var(--c-y) !important; }
html body:not(#b#b#b) .audio-player[data-sciux-mini="1"] #ap-play-btn:hover { background: var(--c-acc-2) !important; }
html body:not(#b#b#b) .audio-player[data-sciux-mini="1"] .ap-track-title { font: 600 13px/1.3 var(--f-sans) !important; color: var(--c-text) !important; }
html body:not(#b#b#b) .sciux-ap-mode { min-height: 30px !important; padding: 4px 10px !important; font: 500 11.5px/1 var(--f-sans) !important; border-radius: var(--r-pill) !important; box-shadow: none !important; }

/* rail d'icônes */
html body:not(#b#b#b) .sidebar-right[data-sciux-rail="1"] { padding: 10px 6px !important; }
html body:not(#b#b#b) .sciux-rail-list { border-top-color: var(--c-line) !important; gap: 6px !important; }
html body:not(#b#b#b) .sciux-rail-btn { width: 46px !important; border-radius: var(--r) !important; color: var(--c-muted) !important; transition: background-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease), transform var(--t-fast) var(--ease) !important; }
html body:not(#b#b#b) .sciux-rail-btn:hover { background: var(--c-acc-soft) !important; color: var(--c-acc) !important; transform: translateY(-1px); }
html body:not(#b#b#b) .sciux-rail-val { font: 600 11.5px/1 var(--f-mono) !important; color: var(--c-text-2) !important; }
html body:not(#b#b#b) .sciux-rail-btn[data-level="ok"] .sciux-rail-val { color: var(--c-ok) !important; }
html body:not(#b#b#b) .sciux-rail-btn[data-level="warn"] .sciux-rail-val { color: var(--c-warn) !important; }
html body:not(#b#b#b) .sciux-rail-btn[data-level="bad"] .sciux-rail-val { color: var(--c-err) !important; }
html body:not(#b#b#b) .sciux-rail-btn[data-level="run"] { color: var(--c-acc) !important; background: var(--c-y-soft) !important; }
html body:not(#b#b#b) .sciux-rail-btn[data-level="run"]::before { background: var(--c-y) !important; width: 3px !important; border-radius: 3px; }

/* barre d'état : instrument de bas de page */
html body:not(#b#b#b) #sciux-statusbar { font: 500 11.5px/1 var(--f-sans) !important; color: var(--c-text-2) !important; border-top: 1px solid var(--c-line) !important; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-seg { border-color: var(--c-line) !important; transition: background-color var(--t-fast) var(--ease) !important; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-key, html body:not(#b#b#b) #sciux-statusbar .sciux-sb-hint-lbl { color: var(--c-muted) !important; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-val { color: var(--c-text) !important; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-link:hover { background: var(--c-acc-soft) !important; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-link:hover .sciux-sb-hint-lbl { color: var(--c-acc) !important; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-state { background: var(--c-acc) !important; color: #fff !important; padding: 0 14px 0 12px !important; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-state .sciux-sb-val { color: #fff !important; font-family: var(--f-mono) !important; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-dot { border-color: rgba(255,255,255,.6) !important; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-state[data-state="run"] .sciux-sb-dot { background: var(--c-y) !important; border-color: var(--c-y) !important; animation: b-pulse 1.4s var(--ease) infinite; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-state[data-state="run"] .sciux-sb-val { color: var(--c-y) !important; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-state[data-state="done"] .sciux-sb-dot { background: #32D583 !important; border-color: #32D583 !important; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-domain .sciux-sb-val::before { border-radius: 50% !important; background: var(--active) !important; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-meter { background: var(--c-3) !important; box-shadow: none !important; border-radius: var(--r-pill) !important; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-meter-fill { background: var(--c-acc) !important; border-radius: var(--r-pill) !important; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-auto[data-on="1"] .sciux-sb-val { color: var(--c-ok) !important; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-health[data-level="ok"] .sciux-sb-val { color: var(--c-ok) !important; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-health[data-level="warn"] .sciux-sb-val { color: var(--c-warn) !important; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-health[data-level="bad"] .sciux-sb-val, html body:not(#b#b#b) #sciux-statusbar .sciux-sb-net .sciux-sb-val { color: var(--c-err) !important; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-act { border-radius: var(--r-pill) !important; border-color: var(--c-line-2) !important; color: var(--c-acc) !important; font-weight: 600; padding: 2px 9px !important; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-auto:hover .sciux-sb-act { background: var(--c-y) !important; border-color: var(--c-y) !important; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-rail[aria-pressed="true"], html body:not(#b#b#b) #sciux-statusbar .sciux-sb-rail[aria-pressed="true"] .sciux-sb-hint-lbl { color: var(--c-acc) !important; }
html body:not(#b#b#b) #sciux-statusbar .sciux-sb-rail[aria-pressed="true"] { box-shadow: inset 0 -2px 0 var(--c-y) !important; }

/* inspecteur : tiroir latéral */
html body:not(#b#b#b) #sciux-inspector {
  top: 8px !important; border-radius: var(--r-xl) 0 0 var(--r-xl) !important; border: 1px solid var(--c-line) !important; border-right: 0 !important;
  box-shadow: -24px 0 48px -16px rgba(11,31,77,.22) !important; overflow: hidden;
}
html body:not(#b#b#b) #sciux-inspector .sciux-insp-head { border-top: 0 !important; background: var(--c-acc) !important; color: #fff !important; padding: 18px 16px 16px 22px !important; border-bottom: 3px solid var(--c-y) !important; }
html body:not(#b#b#b) #sciux-inspector .sciux-insp-title { font: 600 clamp(16px, 1.3vw, 18.5px)/1.3 var(--f-serif) !important; color: #fff !important; }
html body:not(#b#b#b) #sciux-inspector .sciux-insp-kicker { color: var(--c-navy-ink) !important; }
html body:not(#b#b#b) #sciux-inspector .sciux-insp-head .sciux-tag { color: #fff !important; background: rgba(255,255,255,.1) !important; border-color: rgba(255,255,255,.2) !important; }
html body:not(#b#b#b) #sciux-inspector .sciux-insp-pos { color: var(--c-navy-ink) !important; }
html body:not(#b#b#b) #sciux-inspector .sciux-insp-head .sciux-btn { background: rgba(255,255,255,.08) !important; border-color: rgba(255,255,255,.2) !important; color: #fff !important; box-shadow: none !important; }
html body:not(#b#b#b) #sciux-inspector .sciux-insp-head .sciux-btn:hover { background: var(--c-y) !important; border-color: var(--c-y) !important; color: var(--c-acc) !important; }
html body:not(#b#b#b) #sciux-inspector .sciux-insp-head :focus-visible { outline-color: var(--c-y) !important; }
html body:not(#b#b#b) #sciux-inspector .sciux-insp-h { color: var(--c-acc) !important; font-weight: 700 !important; display: flex; align-items: center; gap: 8px; }
html body:not(#b#b#b) #sciux-inspector .sciux-insp-h::before { content: ''; width: 10px; height: 3px; border-radius: 2px; background: var(--c-y); }
html body:not(#b#b#b) #sciux-inspector .sciux-insp-reco { background: var(--c-y-soft) !important; border-left-color: var(--c-y) !important; color: var(--c-text) !important; border-radius: 0 var(--r) var(--r) 0 !important; }
html body:not(#b#b#b) #sciux-inspector .sciux-fact { background: var(--c-2) !important; border-color: var(--c-line) !important; border-radius: var(--r) !important; }
html body:not(#b#b#b) #sciux-inspector .sciux-fact dd { font-family: var(--f-mono) !important; color: var(--c-acc) !important; font-weight: 600 !important; }
html body:not(#b#b#b) #sciux-inspector .sciux-toc-link:hover { background: var(--c-acc-soft) !important; color: var(--c-acc) !important; border-radius: var(--r-sm); }
html body:not(#b#b#b) #sciux-inspector .sciux-insp-abs { font: 400 14px/1.65 var(--f-serif) !important; color: var(--c-text-2) !important; }

/* aide clavier */
html body:not(#b#b#b) #sciux-keys { background: rgba(11,31,77,.32) !important; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
html body:not(#b#b#b) #sciux-keys .sciux-keys-head { background: var(--c-1) !important; border-bottom: 1px solid var(--c-line) !important; }
html body:not(#b#b#b) #sciux-keys .sciux-keys-title { font: 650 16.5px/1.3 var(--f-sans) !important; color: var(--c-acc) !important; }
html body:not(#b#b#b) #sciux-keys .sciux-keys-row { border-top-color: var(--c-line) !important; }
html body:not(#b#b#b) #sciux-keys kbd { border-bottom-width: 2px !important; border-radius: var(--r-xs) !important; font-weight: 600 !important; }

/* inspecteur : bouton d'ouverture flottant */
html body:not(#b#b#b) .sciux-inspect-btn--float { background: var(--c-acc) !important; color: #fff !important; border-color: var(--c-acc) !important; box-shadow: 0 8px 20px -8px rgba(11,31,77,.55) !important; }
html body:not(#b#b#b) .sciux-inspect-btn--float:hover { background: var(--c-y) !important; color: var(--c-acc) !important; border-color: var(--c-y) !important; }

/* ── 22. Finitions : tableau de bord, états vides, analyse ─────────────── */
html body:not(#b#b) main.center-panel .card .card-val { color: var(--c-acc) !important; }
html body:not(#b#b) main.center-panel .card:first-child { background: var(--c-acc) !important; border-color: var(--c-acc) !important; box-shadow: 0 10px 24px -12px rgba(11,31,77,.5) !important; }
html body:not(#b#b) main.center-panel .card:first-child::before { background: var(--c-y) !important; }
html body:not(#b#b) main.center-panel .card:first-child .card-val { color: #fff !important; }
html body:not(#b#b) main.center-panel .card:first-child :is(.card-title, .card-sub) { color: var(--c-navy-ink) !important; }
html body:not(#b#b) #sciana-root .sa-msg { border-radius: var(--r) !important; padding: 14px 16px !important; font: 400 13px/1.55 var(--f-sans) !important; }
html body:not(#b#b) #sciana-root .is-error .sa-msg { background: var(--c-err-soft) !important; border: 1px solid var(--c-err-line) !important; color: #7A271A !important; }
html body:not(#b#b) #sciana-root .is-error .sa-msg::before { color: var(--c-err) !important; }
html body:not(#b#b) #sciana-root .is-empty .sa-msg { background: var(--c-2) !important; border: 1px dashed var(--c-line-2) !important; color: var(--c-muted) !important; text-align: center; font-family: var(--f-serif) !important; font-style: italic !important; }
html body:not(#b#b) #sciana-root .sa-card.is-error { border-color: var(--c-line) !important; }
html body:not(#b#b) #sciana-root .sa-meta { color: var(--c-muted) !important; }
html body:not(#b#b) #sciana-root .sa-legend > span { color: var(--c-text-2) !important; font-size: 11.5px !important; }
html body:not(#b#b) #sciana-root .sa-key { border-radius: var(--r-pill) !important; }
html body:not(#b#b) #sciana-root .sa-key.is-ok { color: var(--c-ok) !important; background: var(--c-ok-soft) !important; }
html body:not(#b#b) #sciana-root .sa-key.is-ko { color: var(--c-err) !important; background: var(--c-err-soft) !important; }
html body:not(#b#b) #sciana-root .sa-stat dt { color: var(--c-muted) !important; }
html body:not(#b#b) #sciana-root .sa-stat dd { color: var(--c-text) !important; font-family: var(--f-mono) !important; font-weight: 600 !important; }
html body:not(#b#b) #sciana-root .sa-multiple { background: var(--c-2) !important; border: 1px solid var(--c-line) !important; border-radius: var(--r) !important; }
html body:not(#b#b) #sciana-root .sa-mult-name { color: var(--c-acc) !important; font-weight: 700 !important; }
html body:not(#b#b) #sciana-root .sa-svg .sa-iqr { fill: var(--c-acc-soft-2) !important; }
html body:not(#b#b) #sciana-root .sa-svg .sa-marker { stroke: var(--c-y-2) !important; }
html body:not(#b#b) #sciana-root .sa-svg .sa-marker-lbl { fill: var(--c-y-ink) !important; font-weight: 600; }
html body:not(#b#b) #sciana-root .sa-table { border-collapse: collapse; font-variant-numeric: tabular-nums; }
html body:not(#b#b) #sciana-root .sa-table td { border-bottom: 1px solid var(--c-line) !important; color: var(--c-text-2); }
html body:not(#b#b) #sciana-root .sa-table tr:hover td { background: var(--c-y-soft) !important; }
html body:not(#b#b) #sciana-root .sa-card-title::before { content: '' !important; display: inline-block !important; width: 10px; height: 3px; margin-right: 8px; vertical-align: 3px; border-radius: 2px; background: var(--c-y); }

/* états pressés / désactivés cohérents */
html body:not(#b#b) button:disabled, html body:not(#b#b) button[disabled] { cursor: not-allowed !important; }
html body:not(#b#b) :is(.dl-btn,.util-btn,.graph-btn,.cf-btn,.cf-action,.report-dtab,.rpag-btn):active:not(:disabled) { transform: scale(.97) !important; }

/* ═══ 23. Passe « premium » : profondeur, rythme, micro-interactions ═══════ */
/* 23.1 bandeau : dégradé marine discret + trame technique très légère */
html body:not(#b#b) > header {
  background: radial-gradient(900px 140px at 18% -40%, rgba(255,196,0,.10), transparent 70%),
              radial-gradient(700px 160px at 92% 120%, rgba(110,150,255,.16), transparent 70%),
              var(--g-navy) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 6px 18px -10px rgba(8,22,56,.55) !important;
}
html body:not(#b#b) > header .logo-icon { background: linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.04)) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 4px 10px -4px rgba(0,0,0,.4) !important; }
html body:not(#b#b) > header .hstat { position: relative; }
html body:not(#b#b) > header .hstat:hover { background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.02)) !important; }
html body:not(#b#b) > header .hstat:hover .hstat-val { color: var(--c-y) !important; }
html body:not(#b#b) > header .hstat-val { transition: color var(--t) var(--ease) !important; }
html body:not(#b#b) > header .sys-status { box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important; }

/* 23.2 feuilles : biseau clair + ombre étagée */
html body:not(#b#b) :is(.sidebar-left, .center-panel, .sidebar-right) { box-shadow: var(--bevel), var(--sh-2) !important; border-color: rgba(11,31,77,.08) !important; }
html body:not(#b#b) .domain-bar { background: linear-gradient(180deg, #fff, var(--c-2)) !important; box-shadow: 0 1px 0 var(--c-line) !important; }
html body:not(#b#b) .domain-bar .domain-tab { box-shadow: var(--bevel), var(--sh-1) !important; }
html body:not(#b#b) .domain-bar .domain-tab:hover { box-shadow: var(--bevel), var(--sh-2) !important; }
html body:not(#b#b) .domain-bar .domain-tab[class*="active-"] { background: var(--g-navy) !important; box-shadow: var(--sh-navy) !important; }
html body:not(#b#b) .domain-bar .domain-tab:active { transform: translateY(0) scale(.98) !important; }
/* place réservée aux icônes SVG (96-icons) : la pastille s'efface si une icône/chip y est posée */
html body:not(#b#b) .domain-tab .domain-icon:has(.sci-ic, .sci-chip) { width: auto !important; height: auto !important; min-width: 0; background: none !important; box-shadow: none !important; }
html body:not(#b#b) :is(button, .tab, .dl-btn, .badge, .report-domain-badge, .feed-item, .card-title, .dom-label, .section-title, .phase-name):has(> .sci-ic, > .sci-chip) { display: inline-flex; align-items: center; gap: 6px; }
html body:not(#b#b) .section-title:has(> .sci-ic, > .sci-chip) { display: flex !important; }
html body:not(#b#b) :is(.sci-ic, .sci-chip) { flex: none; }

/* 23.3 rythme vertical : échelle 4/8/12/16/24/32 */
html body:not(#b#b) .tab-content > .tab-pane > * + * { margin-top: 16px; }
html body:not(#b#b) .tab-content > .tab-pane > .section-title { margin-top: 28px !important; }
html body:not(#b#b) .tab-content > .tab-pane > .section-title:first-child { margin-top: 4px !important; }
html body:not(#b#b) .sidebar-right > * + * { margin-top: 8px; }

/* 23.4 tuiles KPI : biseau, repère, chiffre, micro-graphe implicite */
html body:not(#b#b) main.center-panel :is(.card, .dom-card) {
  background: linear-gradient(180deg, #fff 0%, #fff 60%, var(--c-2) 100%) !important;
  box-shadow: var(--bevel), var(--sh-1) !important; border-color: rgba(11,31,77,.08) !important;
}
html body:not(#b#b) main.center-panel :is(.card, .dom-card):hover { box-shadow: var(--bevel), var(--sh-3) !important; transform: translateY(-2px) !important; }
html body:not(#b#b) main.center-panel :is(.card, .dom-card):active { transform: translateY(0) scale(.99) !important; }
html body:not(#b#b) main.center-panel :is(.card, .dom-card)::after {
  content: '' !important; display: block !important; position: absolute !important; right: -24px !important; top: -24px !important; left: auto !important; bottom: auto !important;
  width: 88px !important; height: 88px !important; border-radius: 50% !important; opacity: 1 !important;
  background: radial-gradient(circle, color-mix(in srgb, var(--b-c) 10%, transparent) 0 60%, transparent 61%) !important;
  pointer-events: none; transition: transform var(--t) var(--ease) !important; transform: scale(.9) !important;
}
html body:not(#b#b) main.center-panel :is(.card, .dom-card):hover::after { transform: scale(1.12) !important; }
html body:not(#b#b) main.center-panel .card:first-child { background: var(--g-navy) !important; box-shadow: var(--sh-navy) !important; }
html body:not(#b#b) main.center-panel .card:first-child::after { background: radial-gradient(circle, rgba(255,196,0,.18) 0 60%, transparent 61%) !important; }
html body:not(#b#b) .card-val, html body:not(#b#b) .dom-val { font-feature-settings: "tnum", "zero", "ss01" !important; }
html body:not(#b#b) .card-title, html body:not(#b#b) .dom-label { display: flex; align-items: center; gap: 6px; }

/* 23.5 tableaux élégants (rapports md, sciana, historique, santé) */
html body:not(#b#b) :is(.md-table, .sa-table, #tab-history table, #tab-health table, #tab-compare table, .sciux-md-table) {
  border-collapse: separate !important; border-spacing: 0 !important; width: 100%;
  border: 1px solid var(--c-line) !important; border-radius: var(--r) !important; overflow: hidden;
  background: #fff; box-shadow: var(--sh-1);
  font-variant-numeric: tabular-nums slashed-zero;
}
html body:not(#b#b) :is(.md-table, .sa-table, #tab-history table, #tab-health table, #tab-compare table, .sciux-md-table) th {
  position: sticky; top: 0; z-index: 1;
  background: linear-gradient(180deg, #fff, var(--c-2)) !important; color: var(--c-acc) !important;
  font: 700 11px/1.3 var(--f-sans) !important; letter-spacing: .07em !important; text-transform: uppercase;
  padding: 10px 12px !important; text-align: left; border-bottom: 1px solid var(--c-line-2) !important;
}
html body:not(#b#b) :is(.md-table, .sa-table, #tab-history table, #tab-health table, #tab-compare table, .sciux-md-table) td {
  padding: 9px 12px !important; border-bottom: 1px solid var(--c-line) !important; color: var(--c-text-2) !important; font-size: 13px;
  transition: background-color var(--t-fast) var(--ease);
}
html body:not(#b#b) :is(.md-table, .sa-table, #tab-history table, #tab-health table, #tab-compare table, .sciux-md-table) tr:last-child td { border-bottom: 0 !important; }
html body:not(#b#b) :is(.md-table, .sa-table, #tab-history table, #tab-health table, #tab-compare table, .sciux-md-table) tbody tr:nth-child(even) td { background: #FCFCFA; }
html body:not(#b#b) :is(.md-table, .sa-table, #tab-history table, #tab-health table, #tab-compare table, .sciux-md-table) tbody tr:hover td { background: var(--c-y-soft) !important; }
html body:not(#b#b) :is(.md-table, .sa-table, #tab-history table, #tab-health table) td:is(:last-child) { font-family: var(--f-mono); }

/* 23.6 états vides : encart éditorial centré */
html body:not(#b#b) :is(#reports-container, #search-results, #timeline-container, #history-container, #live-feed) > p:only-child {
  display: block; margin: 8px 0 !important; padding: 36px 24px 32px !important; text-align: center;
  background: repeating-linear-gradient(135deg, transparent 0 10px, rgba(11,31,77,.018) 10px 20px), var(--c-2) !important;
  border: 1px dashed var(--c-line-2) !important; border-radius: var(--r-lg) !important;
  font: italic 400 14px/1.55 var(--f-serif) !important; color: var(--c-muted) !important;
}
html body:not(#b#b) :is(#reports-container, #search-results, #timeline-container, #history-container) > p:only-child::before {
  content: ''; display: block; width: 36px; height: 4px; margin: 0 auto 14px; border-radius: 4px; background: var(--c-y);
}

/* 23.7 micro-interactions boutons : biseau, survol, pression, focus en anneau */
html body:not(#b#b) :is(.auto-btn,.util-btn,.graph-btn,.ks-btn,.dl-btn,.ap-preset-btn,.cmo-btn,.imo-btn,.sco-btn,.ktm-btn,.ab-login-btn,.ab-logout-btn,.sciux-btn,.console-copy-btn,.console-save-btn) {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  background: linear-gradient(180deg, #fff, #FAFAF7) !important; box-shadow: var(--bevel), var(--sh-1) !important;
}
html body:not(#b#b) :is(.auto-btn,.util-btn,.graph-btn,.ks-btn,.dl-btn,.ap-preset-btn,.cmo-btn,.imo-btn,.sco-btn,.ktm-btn,.ab-login-btn,.ab-logout-btn,.sciux-btn):hover:not(:disabled) {
  background: #fff !important; border-color: var(--c-acc-line) !important; color: var(--c-acc) !important; box-shadow: var(--bevel), var(--sh-2) !important;
}
html body:not(#b#b) :is(.search-btn, .cmo-confirm, .auth-modal-submit, .sco-btn-continue, .sciux-btn--primary, .gpu-warn-btn-primary) { background: var(--g-navy) !important; box-shadow: var(--sh-navy) !important; }
html body:not(#b#b) :is(.search-btn, .cmo-confirm, .auth-modal-submit, .sco-btn-continue, .sciux-btn--primary):hover { background: linear-gradient(135deg, #17327A, #0F2A63) !important; color: #fff !important; }
html body:not(#b#b) #btn-auto { background: linear-gradient(180deg, #FFD43D, var(--c-y) 55%, #F2B600) !important; }
html body:not(#b#b) :is(button, [role="button"], .tab, a):focus-visible { outline: 2px solid var(--c-acc) !important; outline-offset: 2px !important; box-shadow: 0 0 0 5px rgba(255,196,0,.45) !important; }
html body:not(#b#b) :is(.auto-block, #sciux-inspector .sciux-insp-head) :focus-visible,
html body:not(#b#b) > header :focus-visible { outline-color: var(--c-y) !important; box-shadow: none !important; }
html body:not(#b#b) .danger, html body:not(#b#b) .sco-btn-stop { background: #fff !important; }

/* 23.8 pipeline : fil animé de l'étape en cours, survol plus vivant */
html body:not(#b#b) .sidebar-left .phase-btn:hover .phase-num { border-color: var(--c-acc) !important; color: var(--c-acc) !important; transform: scale(1.06); }
html body:not(#b#b) .sidebar-left .phase-num { transition: transform var(--t) var(--ease), background-color var(--t) var(--ease), border-color var(--t) var(--ease) !important; }
html body:not(#b#b) .sidebar-left .phase-btn.loading::before { background: linear-gradient(180deg, var(--c-y) 0 40%, var(--c-line) 40% 100%) !important; background-size: 100% 250% !important; animation: b-flow 1.6s linear infinite !important; }
@keyframes b-flow { from { background-position: 0 100%; } to { background-position: 0 0; } }
html body:not(#b#b) .sidebar-left .phase-btn.loading { box-shadow: var(--bevel), 0 6px 16px -10px rgba(240,180,0,.6) !important; }
html body:not(#b#b) .sidebar-left .auto-block { background: radial-gradient(260px 120px at 100% 0%, rgba(255,196,0,.14), transparent 70%), var(--g-navy) !important; box-shadow: var(--sh-navy) !important; }

/* 23.9 colonne droite : cartes-instruments plus fines */
html body:not(#b#b) :is(#active-domain-card, aside.sidebar-right .live-feed, aside.sidebar-right .kinetic-chart, aside.sidebar-right .progress-bar-wrap, aside.sidebar-right > div[onclick*="'health'"]) { box-shadow: var(--bevel), var(--sh-1) !important; }
html body:not(#b#b) #active-domain-card { background: linear-gradient(135deg, var(--active-soft), #fff 85%) !important; }
html body:not(#b#b) aside.sidebar-right .progress-bar-fill { background: linear-gradient(90deg, var(--c-acc), #2B4A9E) !important; position: relative; }
html body:not(#b#b) aside.sidebar-right .feed-item { transition: background-color var(--t-fast) var(--ease) !important; border-radius: var(--r-sm) !important; }
html body:not(#b#b) aside.sidebar-right .feed-item:hover { background: var(--c-2) !important; }

/* 23.10 rapports & résultats : relief et survol */
html body:not(#b#b) .report-item { box-shadow: var(--bevel), var(--sh-1) !important; }
html body:not(#b#b) .report-item:hover { box-shadow: var(--bevel), var(--sh-3) !important; transform: translateY(-1px) !important; }
html body:not(#b#b) .report-item .report-actions { opacity: .82; transition: opacity var(--t) var(--ease); }
html body:not(#b#b) .report-item:hover .report-actions, html body:not(#b#b) .report-item:focus-within .report-actions { opacity: 1; }
html body:not(#b#b) #result-display > div { box-shadow: var(--bevel), var(--sh-2) !important; }
html body:not(#b#b) main.center-panel .console { box-shadow: var(--bevel), var(--sh-2) !important; }
html body:not(#b#b) main.center-panel .console::before { background: radial-gradient(circle at 19px 50%, var(--c-y) 0 4px, transparent 4.5px), var(--g-navy) !important; }

/* 23.11 sciana : tuiles KPI et cartes */
html body:not(#b#b) #sciana-root .sa-card { box-shadow: var(--bevel), var(--sh-1) !important; }
html body:not(#b#b) #sciana-root .sa-card:hover { box-shadow: var(--bevel), var(--sh-3) !important; }
html body:not(#b#b) #sciana-root .sa-kpi { background: linear-gradient(180deg, #fff, var(--c-2)) !important; box-shadow: var(--bevel), var(--sh-1) !important; transition: transform var(--t) var(--ease), box-shadow var(--t) var(--ease); }
html body:not(#b#b) #sciana-root .sa-kpi:hover { transform: translateY(-2px); box-shadow: var(--bevel), var(--sh-2) !important; }
html body:not(#b#b) #sciana-root .sa-svg .sa-mark { transition: opacity var(--t-fast) var(--ease), filter var(--t-fast) var(--ease); }
html body:not(#b#b) #sciana-root .sa-svg .is-hover .sa-mark { filter: brightness(1.15); }

/* 23.12 modales et popovers : entrée douce */
html body:not(#b#b) :is(.help-popup,.auth-modal-content,.cmo-box,.imo-box,.sco-box,.ktm-box,.ktw-box,.gpu-howto-content,.scifx-pal-box) { animation: b-pop .22s var(--ease) both; }
html body:not(#b#b) main.center-panel .dropdown-content { animation: b-pop .16s var(--ease) both; transform-origin: top right; }
@keyframes b-pop { from { opacity: 0; transform: translateY(6px) scale(.985); } to { opacity: 1; transform: none; } }

/* ═══ 24. QA visuelle (captures 1512 / 1920 / 390) ═══════════════════════ */
/* fiche pré-print : texte pleine largeur, actions en barre d'outils sous le résumé */
html body:not(#b#b) .report-header { display: flex !important; flex-wrap: wrap !important; align-items: flex-start !important; gap: 0 !important; padding: 18px 20px 14px 22px !important; }
html body:not(#b#b) .report-header > div:first-child { flex: 1 1 100% !important; min-width: 0 !important; }
html body:not(#b#b) .report-header .report-actions {
  flex: 1 1 100% !important; justify-content: flex-start !important; margin-top: 14px !important; padding-top: 12px !important;
  border-top: 1px solid var(--c-line) !important; max-width: none !important;
}
html body:not(#b#b) .report-header .report-actions .report-toggle { margin-left: auto !important; }
html body:not(#b#b) .report-meta {
  display: inline-flex !important; flex-wrap: wrap; gap: 4px 10px; background: none !important; border: 0 !important; padding: 0 !important;
  margin: 6px 0 0 !important; box-shadow: none !important; font: 500 11.5px/1.4 var(--f-mono) !important; color: var(--c-muted) !important;
}
html body:not(#b#b) .report-header [style*="font-size:9px"] {
  border-left: 3px solid var(--c-y) !important; padding: 2px 0 2px 14px !important; margin-top: 12px !important;
  font: 400 13.5px/1.65 var(--f-serif) !important; color: var(--c-text-2) !important; max-width: 92ch !important;
}
html body:not(#b#b) .rpt-title-text { font-size: clamp(16px, 1.25vw, 18.5px) !important; line-height: 1.3 !important; margin-top: 8px !important; color: var(--c-text) !important; }
html body:not(#b#b) .report-item[style*="box-shadow"] .rpt-title-text { color: var(--c-acc) !important; }
html body:not(#b#b) #sciux-crumbs .sciux-crumb-ctx:empty { display: none !important; }
/* boutons d'action rapports en ligne (convergence / doublons) → boutons du système */
html body:not(#b#b) button[onclick^="generateConvergence"], html body:not(#b#b) button[onclick^="cleanupDuplicates"] {
  display: inline-flex !important; align-items: center; gap: 6px; min-height: 34px; padding: 7px 13px !important;
  font: 600 11.5px/1.2 var(--f-sans) !important; letter-spacing: .02em !important; border-radius: var(--r-md) !important;
  box-shadow: var(--bevel), var(--sh-1) !important; transition: all var(--t-fast) var(--ease) !important;
}
html body:not(#b#b) button[onclick^="generateConvergence"] { background: var(--g-navy) !important; color: #fff !important; border: 1px solid var(--c-acc) !important; box-shadow: var(--sh-navy) !important; }
html body:not(#b#b) button[onclick^="generateConvergence"]:hover { color: var(--c-y) !important; transform: translateY(-1px); }
html body:not(#b#b) button[onclick^="cleanupDuplicates"] { background: #fff !important; color: var(--c-warn) !important; border: 1px solid var(--c-warn-line) !important; }
html body:not(#b#b) button[onclick^="cleanupDuplicates"]:hover { background: var(--c-warn-soft) !important; border-color: var(--c-warn) !important; transform: translateY(-1px); }
html body:not(#b#b) .report-toggle { background: var(--c-acc-soft) !important; border: 1px solid var(--c-acc-line) !important; color: var(--c-acc) !important; border-radius: var(--r-pill) !important; padding: 8px 14px !important; font: 700 11.5px/1 var(--f-sans) !important; letter-spacing: .06em !important; box-shadow: none !important; }
html body:not(#b#b) .report-toggle:hover { background: var(--c-y) !important; border-color: var(--c-y-2) !important; }
/* chiffres-vedettes : Plex Sans tabulaire (espaces fines, plus élégant que la chasse fixe) */
html body:not(#b#b) :is(.card-val, .dom-val, .cycle-count, #sciana-root .sa-kpi-v),
html body:not(#b#b) > header .hstat-val {
  font-family: var(--f-sans) !important; font-weight: 600 !important; letter-spacing: -.02em !important;
  font-variant-numeric: tabular-nums lining-nums !important; font-feature-settings: "tnum", "lnum" !important;
}
html body:not(#b#b) :is(.card-val, .dom-val) { font-size: clamp(22.5px, 2.1vw, 30px) !important; }
html body:not(#b#b) main.center-panel .cards-grid { grid-template-columns: repeat(auto-fit, minmax(clamp(128px, 8.6vw, 184px), 1fr)) !important; }
html body:not(#b#b) main.center-panel :is(.card, .dom-card)::after {
  width: 64px !important; height: 64px !important; right: -18px !important; top: -18px !important;
  background: radial-gradient(circle, color-mix(in srgb, var(--b-c) 7%, transparent) 0 62%, transparent 63%) !important;
}
html body:not(#b#b) main.center-panel .card:first-child::after { background: radial-gradient(circle, rgba(255,196,0,.16) 0 62%, transparent 63%) !important; }
html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge)::after { content: 'N° ' counter(ctr-pp, decimal-leading-zero) !important; font: 700 11.5px/1 var(--f-mono) !important; letter-spacing: .02em; }
@media (max-width: 760px) {
  html body:not(#b#b) #result-display > div > div[style*="border:1px solid"] { padding: 34px 14px 12px !important; }
  html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge)::after { top: 12px !important; right: 12px !important; }
  html body:not(#b#b) #result-display > div { padding: 16px 16px 16px 18px !important; }
}
/* micro-courbes des relevés : traits jaunes/clairs sur marine, invisibles tant qu'il n'y a pas d'historique */
html body:not(#b#b) > header .scifx-spark:not(.is-ready) { opacity: 0 !important; }
html body:not(#b#b) > header .scifx-spark .scifx-spark-line { stroke: var(--b-kpi, #8FB0FF) !important; stroke-width: 1.25px !important; }
html body:not(#b#b) > header .scifx-spark .scifx-spark-area { fill: color-mix(in srgb, var(--b-kpi, #8FB0FF) 14%, transparent) !important; }
html body:not(#b#b) > header .scifx-spark .scifx-spark-dot { fill: var(--c-y) !important; }
/* colonne droite : rythme resserré, sections repliées alignées comme une table des matières */
html body:not(#b#b) .sidebar-right > * + * { margin-top: 0; }
html body:not(#b#b#b) .sidebar-right > .section-title { margin: 6px -6px 6px !important; min-height: 36px; }
html body:not(#b#b#b) .sidebar-right > .section-title[data-sciux-open="0"] { margin-bottom: 2px !important; border-bottom: 1px solid var(--c-line) !important; border-radius: var(--r-sm) var(--r-sm) 0 0 !important; }
html body:not(#b#b#b) .sidebar-right > .section-title[data-sciux-open="0"]::after { opacity: 0 !important; }
html body:not(#b#b#b) .sidebar-right > .section-title + :not(.section-title) { margin-bottom: 10px !important; }
html body:not(#b#b) aside.sidebar-right .feed-time {
  display: inline-block !important; margin: 0 8px 0 0 !important; padding: 2px 6px !important; vertical-align: 1px;
  background: var(--c-acc-soft) !important; color: var(--c-acc) !important; border: 0 !important; border-radius: var(--r-xs) !important; font-weight: 600 !important;
}
html body:not(#b#b) aside.sidebar-right .feed-item { display: block !important; }
/* grille KPI : 3 × 2 équilibrée, 6 en ligne sur très grand écran, 2 sur mobile */
html body:not(#b#b) main.center-panel .cards-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
@media (min-width: 1800px) { html body:not(#b#b) main.center-panel .cards-grid { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; } }
@media (max-width: 560px) { html body:not(#b#b) main.center-panel :is(.cards-grid, .dom-stats) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
html body:not(#b#b) main.center-panel .card:first-child::after { background: radial-gradient(circle, rgba(255,255,255,.07) 0 62%, transparent 63%) !important; }

/* ═══ 25. Round 3 — accueil « centre de commande » ═══════════════════════ */
/* 25.1 compteurs d'état du pipeline (ordre DOM : colonne gauche → centre) */
html body:not(#b#b) .main-layout { counter-reset: b-all b-ok b-run b-err; }
html body:not(#b#b) .sidebar-left .phase-btn { counter-increment: b-all; }
html body:not(#b#b) .sidebar-left .phase-btn.success { counter-increment: b-all b-ok; }
html body:not(#b#b) .sidebar-left .phase-btn.loading { counter-increment: b-all b-run; }
html body:not(#b#b) .sidebar-left .phase-btn.error { counter-increment: b-all b-err; }

/* 25.2 règle graduée jaune sous le bandeau */
html body:not(#b#b) > header::after {
  bottom: 0 !important; height: 7px !important;
  background:
    linear-gradient(var(--c-y), var(--c-y)) left bottom / 132px 3px no-repeat,
    repeating-linear-gradient(90deg, rgba(255,196,0,.75) 0 1px, transparent 1px 40px) left bottom / 100% 7px no-repeat,
    repeating-linear-gradient(90deg, rgba(255,255,255,.22) 0 1px, transparent 1px 8px) left bottom / 100% 4px no-repeat !important;
}
html body:not(#b#b) > header .hstat-lbl::after { content: none; }

/* 25.3 bandeau-titre de l'accueil (fil d'Ariane enrichi, vue Console) */
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs {
  display: grid !important; align-items: end !important;
  grid-template-columns: minmax(0, 1fr) auto auto; grid-template-areas: "id run state";
  column-gap: clamp(16px, 2vw, 32px) !important; row-gap: 4px;
  padding: clamp(18px, 1.8vw, 26px) clamp(18px, 1.8vw, 28px) clamp(16px, 1.5vw, 22px) !important;
  background:
    radial-gradient(420px 160px at 100% 0%, color-mix(in srgb, var(--active) 9%, transparent), transparent 70%),
    linear-gradient(180deg, #fff, var(--c-2)) !important;
  border-bottom: 1px solid var(--c-line) !important; position: relative;
}
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs::selection { background: none; }
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs > ol {
  grid-area: id; display: flex !important; flex-wrap: wrap; align-items: baseline; row-gap: 6px; min-width: 0;
}
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs li:nth-child(1),
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs li:nth-child(3) { order: 1; font: 600 11px/1.2 var(--f-sans) !important; letter-spacing: .09em; text-transform: uppercase; color: var(--c-muted) !important; }
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs li:nth-child(3) [aria-current] { color: var(--c-acc) !important; }
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs li:nth-child(2) { order: 2; flex: 1 1 100%; }
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs li:nth-child(2)::before { content: none !important; }
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs li:nth-child(3)::before { content: '·' !important; margin: 0 8px !important; }
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs .sciux-crumb-dom {
  display: inline-flex; align-items: center; gap: 12px;
  font: 600 clamp(22.5px, 2.1vw, 31.5px)/1.1 var(--f-serif) !important; letter-spacing: -.015em !important; color: var(--c-text) !important;
}
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs .sciux-crumb-dom::before {
  content: '' !important; display: inline-block !important; width: 12px; height: 12px; border-radius: 3px; flex: none;
  background: var(--active) !important; box-shadow: 0 0 0 4px color-mix(in srgb, var(--active) 16%, transparent) !important; margin: 0 !important;
}
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs .sciux-crumb-root { color: var(--c-acc) !important; font: inherit !important; letter-spacing: inherit !important; }
/* relevés : étapes validées / en cours / erreurs (compteurs CSS) */
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs::before,
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs::after {
  display: block !important; position: static !important; white-space: pre; text-align: right;
  padding: 0 0 0 clamp(14px, 1.4vw, 24px); border-left: 1px solid var(--c-line); background: none !important;
  font: 600 10.5px/1.6 var(--f-sans); letter-spacing: .09em; text-transform: uppercase; color: var(--c-muted);
}
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs::before {
  grid-area: run; content: counter(b-ok, decimal-leading-zero) " / " counter(b-all, decimal-leading-zero) "\A étapes validées" !important;
}
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs::after {
  grid-area: state; content: counter(b-run) " en cours\A " counter(b-err) " en erreur" !important;
  font: 600 11.5px/1.55 var(--f-mono) !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--c-text-2) !important;
}
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs::before { color: var(--c-muted) !important; }
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs::before {
  font-feature-settings: "tnum";
  background: linear-gradient(var(--c-acc), var(--c-acc)) 0 0 / 0 0 no-repeat !important;
}
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs .sciux-crumb-ctx { grid-column: 1; }
/* chiffre du relevé principal en grand : on agrandit tout le pseudo puis on réduit la 2e ligne impossible → on joue la hiérarchie par graisse */
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs::before { font: 700 13px/1.5 var(--f-mono) !important; letter-spacing: .02em !important; color: var(--c-acc) !important; }
html body:not(#b#b#b) main.center-panel:has(.sidebar-left .phase-btn.error) #sciux-crumbs::after { color: var(--c-err) !important; }
@media (max-width: 760px) {
  html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs { grid-template-columns: 1fr 1fr; grid-template-areas: "id id" "run state"; row-gap: 14px; }
  html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs::before { border-left: 0; padding-left: 0; text-align: left; }
  html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs li:nth-child(1) { display: inline !important; }
}
/* relevé : grand chiffre + légende */
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs { align-items: center !important; }
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs::before {
  content: counter(b-ok) "/" counter(b-all) !important; white-space: nowrap;
  font: 600 clamp(26px, 2.4vw, 35.5px)/1 var(--f-sans) !important; letter-spacing: -.03em !important; color: var(--c-acc) !important;
  font-variant-numeric: tabular-nums; padding-left: clamp(16px, 1.6vw, 26px) !important;
}
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs::after {
  content: "étapes validées\A" counter(b-run) " en cours · " counter(b-err) " en erreur" !important;
  text-align: left !important; border-left: 0 !important; padding-left: 0 !important;
  font: 500 11.5px/1.5 var(--f-sans) !important; color: var(--c-text-2) !important;
}
html body:not(#b#b#b) main.center-panel:has(#tab-console.active):has(.sidebar-left .phase-btn.error) #sciux-crumbs::after { color: var(--c-text-2) !important; }
html:has(#dtab-medical[class*="active-"]) body:not(#b#b#b) #sciux-crumbs .sciux-crumb-dom:empty::after { content: 'Médical & Pharma'; }
html:has(#dtab-cyber[class*="active-"]) body:not(#b#b#b) #sciux-crumbs .sciux-crumb-dom:empty::after { content: 'Cyber-sécurité'; }
html:has(#dtab-tech[class*="active-"]) body:not(#b#b#b) #sciux-crumbs .sciux-crumb-dom:empty::after { content: 'Tech & IA'; }
html:has(#dtab-physics[class*="active-"]) body:not(#b#b#b) #sciux-crumbs .sciux-crumb-dom:empty::after { content: 'Physique & Chimie'; }
html body:not(#b#b#b) #sciux-crumbs [aria-current="page"]:empty::after { content: 'Console'; }

/* 25.4 console : relevé d'instrument — perforation, repères tous les 5 lignes, pied de relevé */
html body:not(#b#b) main.center-panel .console { position: relative; }
html body:not(#b#b) main.center-panel .console-body .log-line:nth-child(5n), html body:not(#b#b) main.center-panel #console-inner .log-line:nth-child(5n) {
  box-shadow: inset 0 -1px 0 rgba(11,31,77,.07);
}
html body:not(#b#b) main.center-panel .console-body .log-line:nth-child(5n)::before { color: var(--c-acc) !important; font-weight: 600 !important; }
html body:not(#b#b) main.center-panel .console-filters { background: linear-gradient(180deg, var(--c-2), #fff) !important; }
html body:not(#b#b) main.center-panel .console::after {
  content: 'relevé continu · journal du moteur' !important; display: block !important; position: static !important; animation: none !important;
  height: 30px !important; line-height: 30px !important; padding: 0 16px 0 calc(7.8ch + 17px) !important; width: auto !important; opacity: 1 !important;
  font: italic 400 11.5px/30px var(--f-serif) !important; color: var(--c-muted) !important; letter-spacing: 0 !important; text-transform: none !important;
  background:
    radial-gradient(circle, var(--c-bg) 0 2.5px, transparent 3px) 6px 0 / 14px 6px repeat-x,
    linear-gradient(var(--c-2), var(--c-2)) !important;
  border-top: 1px dashed var(--c-line-2) !important; border-radius: 0 0 var(--r-lg) var(--r-lg);
}

/* 25.5 fiche résultat : en-tête de rapport, hypothèses en liste à statut, pré-print « couverture » */
html body:not(#b#b) #result-display > div > div:first-child {
  display: flex !important; align-items: center; gap: 10px;
  font: 700 11px/1.3 var(--f-sans) !important; letter-spacing: .1em !important; text-transform: uppercase; color: var(--c-acc) !important;
}
html body:not(#b#b) #result-display > div > div:first-child::before { content: ''; width: 18px; height: 3px; border-radius: 2px; background: var(--c-y); flex: none; }
html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge-valid):not(:has(> div)),
html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge-reject) {
  background: #fff !important; border: 1px solid var(--c-line) !important; box-shadow: inset 3px 0 0 var(--c-ok) !important;
  border-radius: var(--r-sm) !important; padding: 12px 64px 12px 16px !important; margin-top: 8px !important;
}
html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge-reject) { box-shadow: inset 3px 0 0 var(--c-err) !important; }
html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge):has(> div) {
  position: relative; margin-top: 14px !important; padding: 22px 64px 18px 22px !important;
  background: linear-gradient(180deg, #fff 0%, #fff 70%, var(--c-2) 100%) !important;
  border: 1px solid rgba(11,31,77,.12) !important; border-radius: var(--r) !important;
  box-shadow: var(--bevel), var(--sh-2), inset 0 3px 0 var(--c-acc) !important; overflow: hidden;
}
html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge):has(> div) > b {
  display: block; margin: 10px 0 4px; font: 600 clamp(17.5px, 1.45vw, 21.5px)/1.25 var(--f-serif) !important; color: var(--c-acc) !important; letter-spacing: -.01em !important;
}
html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge):has(> div) > div { border-top: 1px solid var(--c-line) !important; padding-top: 10px !important; margin-top: 10px !important; font-family: var(--f-mono) !important; }
html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge):has(> div)::before {
  content: '' !important; display: block !important; position: absolute !important; top: 3px !important; right: 0 !important; left: auto !important; bottom: auto !important;
  width: 120px !important; height: 3px !important; background: var(--c-y) !important; border-radius: 0 !important; opacity: 1 !important;
}
html body:not(#b#b) #result-display div[style*="color:var(--active)"] { background: var(--c-acc) !important; color: #fff !important; }
html body:not(#b#b) #result-display div[style*="color:var(--active)"]::after { content: ''; display: inline-block; width: 7px; height: 7px; margin-left: 8px; border-radius: 50%; background: var(--c-y); vertical-align: 1px; }

/* 25.6 système de mouvement : entrée de vue, cartes en cascade */
html:root { --t-enter: .32s; }
html body:not(#b#b) main.center-panel .tab-pane.active { animation: b-view var(--t-enter) var(--ease) both; }
@keyframes b-view { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
html body:not(#b#b) main.center-panel .tab-pane.active :is(.card, .dom-card, .report-item, #sciana-root .sa-card) { animation: b-view var(--t-enter) var(--ease) both; }
html body:not(#b#b) main.center-panel .tab-pane.active :is(.card, .report-item):nth-child(2) { animation-delay: .04s; }
html body:not(#b#b) main.center-panel .tab-pane.active :is(.card, .report-item):nth-child(3) { animation-delay: .08s; }
html body:not(#b#b) main.center-panel .tab-pane.active :is(.card, .report-item):nth-child(4) { animation-delay: .12s; }
html body:not(#b#b) main.center-panel .tab-pane.active :is(.card, .report-item):nth-child(5) { animation-delay: .16s; }
html body:not(#b#b) main.center-panel .tab-pane.active :is(.card, .report-item):nth-child(n+6) { animation-delay: .2s; }
html body:not(#b#b) #sciux-crumbs { animation: b-view var(--t-enter) var(--ease) both; }
@media (max-width: 760px) {
  html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs li:nth-child(3)::before { content: none !important; }
  html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs::before { padding-left: 0 !important; }
  html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge):has(> div) { padding: 34px 16px 16px !important; }
  html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge-valid):not(:has(> div)),
  html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge-reject) { padding: 34px 14px 12px 16px !important; }
}

/* 25.7 pré-prints : dos de revue (tranche colorée du domaine, titre vertical) */
html body:not(#b#b) .report-item { --b-sp: var(--c-acc); position: relative; padding-left: 34px !important; }
html body:not(#b#b) .report-item.dom-medical { --b-sp: var(--c-med); }
html body:not(#b#b) .report-item.dom-cyber { --b-sp: var(--c-cyber); }
html body:not(#b#b) .report-item.dom-tech { --b-sp: var(--c-tech); }
html body:not(#b#b) .report-item.dom-physics { --b-sp: var(--c-phy); }
html body:not(#b#b) .report-item.dom-cross { --b-sp: var(--c-vio); }
html body:not(#b#b) .report-item::before {
  content: 'PRÉ-PRINT · SCI-AUTONOME' !important; display: flex !important; align-items: center; justify-content: center;
  position: absolute !important; left: 0 !important; top: 0 !important; bottom: 0 !important; right: auto !important; width: 34px !important; height: auto !important;
  writing-mode: vertical-rl; transform: rotate(180deg) !important;
  font: 700 9.5px/1 var(--f-sans) !important; letter-spacing: .22em !important; color: rgba(255,255,255,.92) !important;
  background: linear-gradient(0deg, color-mix(in srgb, var(--b-sp) 82%, #000) 0%, var(--b-sp) 100%) !important;
  box-shadow: inset -1px 0 0 rgba(255,255,255,.18) !important; opacity: 1 !important; border-radius: 0 !important; animation: none !important;
}
html body:not(#b#b) .report-item::after {
  content: '' !important; display: block !important; position: absolute !important; left: 34px !important; top: 0 !important; right: auto !important; bottom: auto !important;
  width: 72px !important; height: 3px !important; background: var(--c-y) !important; opacity: 1 !important; border-radius: 0 !important;
}
html body:not(#b#b) .report-item[style*="box-shadow"] { box-shadow: var(--bevel), var(--sh-2) !important; border-color: rgba(11,31,77,.16) !important; }
html body:not(#b#b) .report-item:not([style*="box-shadow"])::after { background: var(--c-line-2) !important; }

/* ═══ 26. Retours propriétaire : résultats plus denses, colonne gauche affinée ═══ */
/* 26.1 échelle éditoriale dense des résultats (console) */
html body:not(#b#b) #result-display > div { padding: 16px 18px 16px 20px !important; font: 400 13px/1.55 var(--f-sans) !important; }
html body:not(#b#b) #result-display > div > div:first-child { font-size: 10.5px !important; margin-bottom: 10px !important; padding-bottom: 8px !important; }
html body:not(#b#b) #result-display div[style*="color:var(--active)"] { font-size: 11px !important; padding: 5px 9px !important; }
html body:not(#b#b) #result-display div[style*="color:var(--text)"] { font: 600 13.5px/1.45 var(--f-sans) !important; margin-top: 6px !important; }
html body:not(#b#b) #result-display div[style*="color:var(--textdim)"] { font: 400 13px/1.55 var(--f-sans) !important; color: var(--c-muted) !important; }
html body:not(#b#b) #result-display b { font: 600 14px/1.35 var(--f-serif) !important; }
html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge) { font: 400 11.5px/1.5 var(--f-sans) !important; color: var(--c-muted) !important; }
html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge-valid):not(:has(> div)),
html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge-reject) { padding: 9px 56px 9px 14px !important; margin-top: 6px !important; }
html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge):has(> div) { padding: 16px 56px 14px 18px !important; margin-top: 10px !important; }
html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge):has(> div) > b { margin: 8px 0 2px !important; font: 600 15.5px/1.3 var(--f-serif) !important; }
html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge):has(> div) > div { font: 400 11.5px/1.5 var(--f-mono) !important; padding-top: 8px !important; margin-top: 8px !important; }
html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge):has(> div)::before { width: 72px !important; }
html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge)::after { font-size: 10.5px !important; top: 10px !important; }
html body:not(#b#b) #result-display .badge { font-size: 10.5px !important; padding: 3px 8px !important; }
/* liste de pré-prints */
html body:not(#b#b) .rpt-title-text { font-size: 15px !important; line-height: 1.35 !important; margin-top: 6px !important; }
html body:not(#b#b) .report-header { padding: 14px 18px 12px 20px !important; }
html body:not(#b#b) .report-header [style*="font-size:9px"] { font: 400 13px/1.6 var(--f-serif) !important; margin-top: 10px !important; padding-left: 12px !important; }
html body:not(#b#b) .report-meta { font-size: 11.5px !important; margin-top: 4px !important; }
html body:not(#b#b) .report-header .report-actions { margin-top: 12px !important; padding-top: 10px !important; }
html body:not(#b#b) .report-actions .dl-btn { min-height: 30px !important; padding: 4px 9px !important; font-size: 11.5px !important; }
html body:not(#b#b) .report-toggle { padding: 7px 12px !important; font-size: 11px !important; }
html body:not(#b#b) .report-domain-badge { font-size: 10.5px !important; padding: 4px 9px !important; }
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs .sciux-crumb-dom { font-size: clamp(20.5px, 1.8vw, 26px) !important; }

/* 26.2 colonne gauche */
html body:not(#b#b) .sidebar-left { padding: 12px 12px 14px !important; }
html body:not(#b#b) .sidebar-left > .section-title { margin: 14px 0 8px !important; }
html body:not(#b#b) .sidebar-left > .section-title:first-child { margin-top: 2px !important; }
html body:not(#b#b) #sidebar-domain-label { color: var(--active) !important; margin-left: 4px; }
/* étapes : hauteur constante, numéros et témoins alignés sur un axe */
html body:not(#b#b) .sidebar-left .phase-btn {
  display: grid !important; grid-template-columns: 26px minmax(0, 1fr) 8px; align-items: center !important; column-gap: 12px !important;
  min-height: 58px !important; margin: 0 0 4px !important; padding: 8px 12px 8px 10px !important; border-radius: var(--r) !important;
}
html body:not(#b#b) .sidebar-left .phase-num { width: 26px !important; height: 26px !important; min-width: 26px; margin: 0 !important; font-size: 11.5px !important; border-width: 1.5px !important; }
html body:not(#b#b) .sidebar-left .phase-btn::before { left: 22px !important; top: 42px !important; bottom: -14px !important; width: 1.5px !important; }
html body:not(#b#b) .sidebar-left .phase-btn:has(+ .phase-btn)::before { display: block !important; }
html body:not(#b#b) .sidebar-left .phase-btn:not(:has(+ .phase-btn))::before { display: none !important; }
html body:not(#b#b) .sidebar-left .phase-info { padding: 0 !important; }
html body:not(#b#b) .sidebar-left .phase-name { font: 600 11.5px/1.25 var(--f-sans) !important; letter-spacing: .02em !important; text-transform: uppercase !important; }
html body:not(#b#b) .sidebar-left .phase-name::first-letter { text-transform: none; }
html body:not(#b#b) .sidebar-left .phase-desc {
  font: 400 11.5px/1.35 var(--f-sans) !important; margin-top: 2px !important;
  display: -webkit-box !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
html body:not(#b#b) .sidebar-left .phase-indicator { margin: 0 !important; width: 8px !important; height: 8px !important; justify-self: end; }
html body:not(#b#b) .sidebar-left .phase-btn.success .phase-indicator { box-shadow: 0 0 0 3px var(--c-ok-soft) !important; }
html body:not(#b#b) .sidebar-left .phase-btn.error .phase-indicator { box-shadow: 0 0 0 3px #FDE3E1 !important; }
html body:not(#b#b) .sidebar-left .phase-btn.loading .phase-indicator { box-shadow: 0 0 0 3px rgba(255,196,0,.3) !important; }
html body:not(#b#b) .sidebar-left .phase-btn.success .phase-num { background: var(--c-ok) !important; color: #fff !important; border-color: var(--c-ok) !important; }
html body:not(#b#b) .sidebar-left .phase-btn.loading::before { left: 22px !important; }
/* auto-cycle */
html body:not(#b#b) .sidebar-left .auto-block { padding: 14px 14px 12px !important; }
html body:not(#b#b) .sidebar-left .auto-block > .auto-label { font-size: 10.5px !important; margin-bottom: 10px !important; }
html body:not(#b#b) .sidebar-left .auto-controls { grid-template-columns: minmax(0, 1fr) auto !important; }
html body:not(#b#b) .sidebar-left .auto-controls > div { display: flex !important; flex-direction: column; align-items: flex-end; gap: 2px; }
html body:not(#b#b) .sidebar-left .auto-controls .auto-label { font-size: 10px !important; }
html body:not(#b#b) .sidebar-left #btn-auto { width: 100% !important; min-height: 38px !important; }
html body:not(#b#b) .sidebar-left .cycle-count { font-size: 24px !important; line-height: 1 !important; }
html body:not(#b#b) .sidebar-left #btn-auto-all { margin-top: 10px !important; min-height: 34px !important; font-size: 11.5px !important; color: #fff !important; }
html body:not(#b#b) .sidebar-left #autocycle-status { min-height: 0 !important; margin-top: 6px !important; font-size: 11.5px !important; color: var(--c-navy-ink) !important; }
html body:not(#b#b) .sidebar-left #autocycle-status:empty { display: none !important; }
/* navigation : grille 2 × 2 de raccourcis égaux */
html body:not(#b#b) .sidebar-left .util-row { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 6px !important; margin: 0 0 6px !important; }
html body:not(#b#b) .sidebar-left .util-row .util-btn {
  width: 100% !important; min-height: 36px !important; justify-content: flex-start !important; padding: 6px 10px !important;
  font: 600 11.5px/1.2 var(--f-sans) !important; letter-spacing: .05em !important; color: var(--c-acc) !important;
}
html body:not(#b#b) .sidebar-left .util-row .util-btn:hover { background: var(--c-acc-soft) !important; }
/* clés IA : registre compact */
html body:not(#b#b) .sidebar-left > div[style*="margin-top:auto"] { border-top: 1px solid var(--c-line) !important; padding-top: 8px !important; margin-top: 14px !important; }
html body:not(#b#b) .sidebar-left > div[style*="margin-top:auto"] > div[style*="display:flex"] {
  padding: 5px 8px !important; margin: 0 0 4px; border-radius: var(--r-sm); background: var(--c-2); border: 1px solid var(--c-line);
}
html body:not(#b#b) .sidebar-left > div[style*="margin-top:auto"] > div[style*="display:flex"] > div { width: 7px !important; height: 7px !important; background: var(--c-ok) !important; box-shadow: 0 0 0 3px var(--c-ok-soft) !important; }
html body:not(#b#b) .sidebar-left > div[style*="margin-top:auto"] span { font: 500 11.5px/1.4 var(--f-mono) !important; color: var(--c-text-2) !important; }
/* sections repliables (90-ux) à gauche : même traitement que la colonne droite */
html body:not(#b#b#b) .sidebar-left .section-title[data-sciux-acc] { min-height: 34px; margin-left: -6px !important; margin-right: -6px !important; }
html body:not(#b#b#b) .sidebar-left .section-title[data-sciux-open="0"] { border-bottom: 1px solid var(--c-line) !important; border-radius: var(--r-sm) var(--r-sm) 0 0 !important; margin-bottom: 2px !important; }
html body:not(#b#b#b) .sidebar-left .section-title[data-sciux-open="0"]::after { opacity: 0 !important; }
/* 26.3 corrections QA colonne gauche */
html body:not(#b#b) .sidebar-left .phase-name { text-transform: lowercase !important; font-size: 13px !important; letter-spacing: 0 !important; }
html body:not(#b#b) .sidebar-left .phase-name::first-letter { text-transform: uppercase !important; }
html body:not(#b#b) .sidebar-left .phase-btn { min-height: 60px !important; }
html body:not(#b#b) .sidebar-left > div[style*="margin-top:auto"] { border-top: 0 !important; padding-top: 0 !important; }

/* ═══ 27. Identité propre : langage du dessin technique ═════════════════════ */
:root {
  --b-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .04  0 0 0 0 .12  0 0 0 0 .3  0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --b-reg: var(--c-acc);
}
/* 27.1 papier : grain très léger sur le plan de travail */
html, html body:not(#b#b) { background: var(--b-grain), var(--c-bg) !important; background-attachment: scroll !important; }

/* 27.2 repères de calage aux 4 coins des feuilles (traits 10 px, en retrait de 7 px) */
html body:not(#b#b) :is(.center-panel, .sidebar-right) {
  background:
    linear-gradient(var(--b-reg), var(--b-reg)) 7px 7px / 10px 1px no-repeat,
    linear-gradient(var(--b-reg), var(--b-reg)) 7px 7px / 1px 10px no-repeat,
    linear-gradient(var(--b-reg), var(--b-reg)) calc(100% - 7px) 7px / 10px 1px no-repeat,
    linear-gradient(var(--b-reg), var(--b-reg)) calc(100% - 7px) 7px / 1px 10px no-repeat,
    linear-gradient(var(--b-reg), var(--b-reg)) 7px calc(100% - 7px) / 10px 1px no-repeat,
    linear-gradient(var(--b-reg), var(--b-reg)) 7px calc(100% - 7px) / 1px 10px no-repeat,
    linear-gradient(var(--b-reg), var(--b-reg)) calc(100% - 7px) calc(100% - 7px) / 10px 1px no-repeat,
    linear-gradient(var(--b-reg), var(--b-reg)) calc(100% - 7px) calc(100% - 7px) / 1px 10px no-repeat,
    #fff !important;
}

/* 27.3 colonne gauche : dos marine + spectre vertical des 4 domaines */
html body:not(#b#b) .sidebar-left {
  position: relative; padding-left: 22px !important;
  background:
    linear-gradient(var(--c-acc), var(--c-acc)) 0 0 / 8px 100% no-repeat,
    linear-gradient(180deg, var(--c-med) 0 25%, var(--c-cyber) 25% 50%, var(--c-tech) 50% 75%, var(--c-phy) 75% 100%) 8px 22px / 3px 120px no-repeat,
    #fff !important;
}
/* curseur du domaine actif sur le spectre (triangle jaune) */
html body:not(#b#b) .sidebar-left::after {
  content: '' !important; display: block !important; position: absolute !important; left: 0 !important; right: auto !important; bottom: auto !important;
  top: 22px; width: 8px !important; height: 30px !important; background: var(--c-y) !important; opacity: 1 !important; border-radius: 0 !important;
  clip-path: polygon(0 0, 100% 50%, 0 100%); transition: top var(--t) var(--ease) !important; transform: none !important;
}
html:has(#dtab-cyber[class*="active-"]) body:not(#b#b) .sidebar-left::after { top: 52px !important; }
html:has(#dtab-tech[class*="active-"]) body:not(#b#b) .sidebar-left::after { top: 82px !important; }
html:has(#dtab-physics[class*="active-"]) body:not(#b#b) .sidebar-left::after { top: 112px !important; }

/* 27.4 règle de coordonnées sur le bord gauche de la feuille centrale */
html body:not(#b#b) main.center-panel { position: relative; }
html body:not(#b#b) main.center-panel::before {
  content: '' !important; display: block !important; position: absolute !important; z-index: 0; pointer-events: none;
  left: 0 !important; top: 51px !important; bottom: 14px !important; width: 9px !important; height: auto !important; right: auto !important;
  background:
    repeating-linear-gradient(180deg, var(--c-line-2) 0 1px, transparent 1px 8px) 0 0 / 5px 100% no-repeat,
    repeating-linear-gradient(180deg, var(--c-acc) 0 1px, transparent 1px 40px) 0 0 / 9px 100% no-repeat !important;
  opacity: .55 !important; border: 0 !important; box-shadow: none !important; transform: none !important;
}

/* 27.5 séparateurs « cote » : filet terminé par un trait d'extrémité */
html body:not(#b#b) .section-title::after {
  height: 7px !important; background:
    linear-gradient(var(--c-line-2), var(--c-line-2)) right center / 1px 7px no-repeat,
    linear-gradient(var(--c-line), var(--c-line)) center / 100% 1px no-repeat !important;
}

/* 27.6 bandeau-titre : ligne de cote sous le domaine + surligneur jaune */
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs .sciux-crumb-dom {
  background: linear-gradient(transparent 64%, rgba(255,196,0,.42) 64% 92%, transparent 92%) 30px 0 / calc(100% - 30px) 100% no-repeat !important;
  padding-right: 4px;
}
html body:not(#b#b#b) main.center-panel:has(#tab-console.active) #sciux-crumbs {
  background:
    linear-gradient(var(--c-acc), var(--c-acc)) clamp(18px, 1.8vw, 28px) calc(100% - 9px) / 1px 9px no-repeat,
    linear-gradient(var(--c-acc), var(--c-acc)) calc(100% - clamp(18px, 1.8vw, 28px)) calc(100% - 9px) / 1px 9px no-repeat,
    linear-gradient(var(--c-line-2), var(--c-line-2)) center calc(100% - 13px) / calc(100% - 2 * clamp(18px, 1.8vw, 28px)) 1px no-repeat,
    radial-gradient(420px 160px at 100% 0%, color-mix(in srgb, var(--active) 9%, transparent), transparent 70%),
    linear-gradient(180deg, #fff, var(--c-2)) !important;
  padding-bottom: clamp(26px, 2.2vw, 32px) !important;
}

/* 27.7 étiquettes de labo : coin replié sur fiches, tuiles et pré-prints */
html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge):has(> div),
html body:not(#b#b) main.center-panel :is(.card, .dom-card):not(:first-child),
html body:not(#b#b) #result-display > div {
  border-top-right-radius: 0 !important;
}
html body:not(#b#b) #result-display > div,
html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge):has(> div) {
  background-image: linear-gradient(225deg, var(--c-bg) 0 9px, var(--c-line-2) 9px 10px, #EDECE5 10px 14px, transparent 14px) !important;
  background-repeat: no-repeat !important; background-size: 20px 20px !important; background-position: top right !important;
}
html body:not(#b#b) main.center-panel #result-display > div > div:has(> .badge):has(> div) { background-color: #fff !important; }
html body:not(#b#b) .report-item { border-top-right-radius: 0 !important; background-image: linear-gradient(225deg, var(--c-bg) 0 11px, var(--c-line-2) 11px 12px, #EDECE5 12px 17px, transparent 17px) !important; background-repeat: no-repeat !important; background-size: 24px 24px !important; background-position: top right !important; }

/* 27.8 puces « étiquette d'échantillon » : œillet perforé */
html body:not(#b#b) :is(.badge, .md-badge, .badge-new, .report-domain-badge) {
  padding-left: 18px !important; position: relative;
  background-image: radial-gradient(circle at 9px 50%, #fff 0 2px, rgba(11,31,77,.35) 2.2px 3px, transparent 3.3px) !important;
  background-repeat: no-repeat !important;
}
html body:not(#b#b) .report-domain-badge { clip-path: polygon(7px 0, 100% 0, 100% 100%, 7px 100%, 0 50%); border-radius: 0 var(--r-pill) var(--r-pill) 0 !important; padding-left: 20px !important; background-position: 3px 0 !important; }

/* 27.9 avertissements uniquement : micro-ruban de chantier */
html body:not(#b#b) main.center-panel .log-line.warn {
  background: repeating-linear-gradient(-45deg, rgba(255,196,0,.55) 0 4px, rgba(11,31,77,.85) 4px 8px) 0 0 / 4px 100% no-repeat, var(--c-warn-soft) !important;
  border-left-color: transparent !important;
}
html body:not(#b#b) :is(.md-warn, .gpu-warn-banner, .access-badge-demo) {
  background: repeating-linear-gradient(-45deg, var(--c-y) 0 5px, var(--c-acc) 5px 10px) 0 0 / 5px 100% no-repeat, var(--c-warn-soft) !important;
  border-left: 0 !important; padding-left: 16px !important;
}

/* 27.10 chiffres de mesure : unités et deltas */
html body:not(#b#b) :is(.scifx-delta) { font: 600 10.5px/1 var(--f-mono) !important; padding: 2px 6px !important; background: rgba(255,196,0,.16) !important; color: var(--c-y) !important; }
html body:not(#b#b) > header .hstat-val { font-size: clamp(16.5px, 1.45vw, 21.5px) !important; }
html body:not(#b#b) > header .hstat-lbl { font-size: 10px !important; }

/* 27.11 colonne gauche : textes en noir encre (sauf bloc auto-cycle marine) */
html body:not(#b#b#b) .sidebar-left :is(.phase-name, .phase-desc, .phase-num, .section-title, .sciux-acc-btn, .sciux-acc-sum, .util-btn, span, div):not(.auto-block, .auto-block *):not([id="sidebar-domain-label"]) {
  color: #0A0B0D !important;
}
html body:not(#b#b#b) .sidebar-left .phase-btn.success .phase-num { color: #fff !important; }
html body:not(#b#b#b) .sidebar-left .phase-btn.loading .phase-num { color: var(--c-y) !important; }
html body:not(#b#b#b) .sidebar-left .phase-btn.error .phase-num { color: var(--c-err) !important; }
html body:not(#b#b#b) .sidebar-left .section-title::before { color: var(--c-acc) !important; }
/* place pour les illustrations 98-signature (sci-sig-*) dans le bandeau-titre : pleine largeur */
html body:not(#b#b#b) #sciux-crumbs > :not(ol):not(.sciux-crumb-ctx) { grid-column: 1 / -1; }

/* ═══ 28. Rapport ouvert : vue de lecture pleine largeur (« article ») ═════ */
html body:not(#b#b) .report-item .report-body.open, html body:not(#b#b) .report-item .report-body[style*="block"] {
  width: 100% !important; max-width: none !important; padding: 0 !important;
  background: #fff !important; border-top: 1px solid var(--c-line) !important;
}
html body:not(#b#b) .report-content {
  container: b-article / inline-size;
  display: grid !important; grid-template-columns: [rail] minmax(140px, 20%) [main] minmax(0, 1fr); column-gap: clamp(20px, 2.4vw, 40px);
  width: 100% !important; max-width: none !important; box-sizing: border-box;
  padding: clamp(18px, 2vw, 32px) clamp(18px, 2.2vw, 36px) clamp(22px, 2.4vw, 36px) !important;
  font: 400 14px/1.72 var(--f-sans) !important; color: #1E2025 !important;
  background: linear-gradient(var(--c-line), var(--c-line)) calc(20% + clamp(18px, 2.2vw, 36px) + clamp(10px, 1.2vw, 20px)) 0 / 1px 100% no-repeat !important;
}
html body:not(#b#b) .report-content > * { grid-column: main; min-width: 0; margin: 0 0 12px !important; }
/* titres de section dans la marge, alignés sur leur premier paragraphe */
html body:not(#b#b) .report-content > :is(.md-h2, .md-h3, h2, h3) {
  grid-column: rail; align-self: start; margin: 4px 0 12px !important; padding: 0 !important; border: 0 !important;
  font: 600 14px/1.3 var(--f-serif) !important; color: var(--c-acc) !important; text-align: right;
}
html body:not(#b#b) .report-content > :is(.md-h2, h2)::after { content: ''; display: block; width: 28px; height: 3px; margin: 8px 0 0 auto; background: var(--c-y); border-radius: 2px; }
html body:not(#b#b) .report-content > :is(.md-h3, h3) { font-size: 13px !important; color: var(--c-text-2) !important; font-style: italic; }
html body:not(#b#b) .report-content > :is(.md-h1, h1) {
  grid-column: 1 / -1; margin: 0 0 18px !important; padding: 0 0 14px !important; border-bottom: 2px solid var(--c-acc) !important;
  font: 600 clamp(18.5px, 1.6vw, 24px)/1.25 var(--f-serif) !important; color: var(--c-text) !important;
}
html body:not(#b#b) .report-content > :is(.md-h4, h4) { font: 700 11.5px/1.3 var(--f-sans) !important; letter-spacing: .08em; text-transform: uppercase; color: var(--c-acc) !important; }
html body:not(#b#b) .report-content > .md-p:first-of-type::first-letter { float: left; font: 600 3.1em/.85 var(--f-serif); color: var(--c-acc); margin: 6px 8px 0 0; }
html body:not(#b#b) .report-content .md-ul { padding-left: 1.2em !important; }
html body:not(#b#b) .report-content .md-li { margin: 0 0 6px !important; }
html body:not(#b#b) .report-content .md-li::marker { color: var(--c-y-2); }
html body:not(#b#b) .report-content strong { color: var(--c-text); font-weight: 600; }
html body:not(#b#b) .report-content .md-hr { grid-column: 1 / -1; height: 0 !important; border: 0 !important; border-top: 1px dashed var(--c-line-2) !important; margin: 10px 0 18px !important; background: none !important; }
/* tableaux et code : pleine largeur, présentés comme « Tab. » et « Fig. » */
html body:not(#b#b) .report-content { counter-reset: b-tab b-fig; }
html body:not(#b#b) .report-content > :is(.md-table, table) { grid-column: 1 / -1; width: 100% !important; margin: 8px 0 20px !important; counter-increment: b-tab; }
html body:not(#b#b) .report-content > :is(.md-table, table) caption, html body:not(#b#b) .report-content > :is(.md-table, table)::before { display: none; }
html body:not(#b#b) .report-content > :is(.md-table, table) thead th:first-child::before {
  content: 'Tab. ' counter(b-tab) ' — '; color: var(--c-y-ink); background: var(--c-y); padding: 1px 5px; border-radius: 3px; margin-right: 6px; letter-spacing: 0;
}
html body:not(#b#b) .report-content > .md-pre {
  grid-column: 1 / -1; counter-increment: b-fig; position: relative; margin: 8px 0 20px !important;
  padding: 30px 18px 16px !important; background: var(--c-plate) !important; color: #E6EAF2 !important;
  border: 0 !important; border-radius: var(--r) !important; box-shadow: var(--sh-2) !important; overflow-x: auto;
  font: 400 13px/1.6 var(--f-mono) !important;
}
html body:not(#b#b) .report-content > .md-pre::before {
  content: 'Fig. ' counter(b-fig) ' · listing'; position: absolute; top: 9px; left: 18px;
  font: 700 10.5px/1 var(--f-sans); letter-spacing: .08em; text-transform: uppercase; color: var(--c-y);
}
html body:not(#b#b) .report-content > .md-pre code { background: none !important; border: 0 !important; color: inherit !important; padding: 0 !important; }
html body:not(#b#b) .report-content > :is(.md-tip, .md-warn) { grid-column: main; }
/* étroit : une seule colonne */
@container b-article (max-width: 600px) {
  html body:not(#b#b) .report-content > *, html body:not(#b#b) .report-content > :is(.md-h2, .md-h3, h2, h3) { grid-column: 1 / -1 !important; text-align: left !important; }
  html body:not(#b#b) .report-content > :is(.md-h2, h2)::after { margin-left: 0 !important; }
}
@media (max-width: 900px) {
  html body:not(#b#b) .report-content { grid-template-columns: minmax(0, 1fr) !important; background: #fff !important; }
  html body:not(#b#b) .report-content > *, html body:not(#b#b) .report-content > :is(.md-h2, .md-h3, h2, h3) { grid-column: 1 / -1 !important; text-align: left !important; }
  html body:not(#b#b) .report-content > :is(.md-h2, h2)::after { margin-left: 0 !important; }
}
/* rapport ouvert : pas de hauteur plafonnée, lettrine sur le 1er paragraphe seulement */
html body:not(#b#b) .report-item .report-body.open { max-height: none !important; overflow: visible !important; }
html body:not(#b#b) .report-content .md-p:not(:first-of-type)::first-letter { float: none; font: inherit; color: inherit; margin: 0; }
html body:not(#b#b) .report-content { max-height: none !important; overflow: visible !important; background: #fff !important; }
html body:not(#b#b) .report-content > :is(.md-h2, .md-h3, h2, h3) { padding-right: 0 !important; }
html body:not(#b#b) .report-content > :is(.md-table, table) { display: table !important; table-layout: auto; }
html body:not(#b#b) .report-content > :is(.md-table, table) :is(th, td) { white-space: normal; }
html body:not(#b#b) .report-content > :is(.md-table, table) td:not(:first-child) { font-family: var(--f-mono); }

/* ═══ 29. Passe de cohérence globale (QA toutes vues) ═════════════════════ */
/* 29.1 bandeau : une seule ligne ≥ 1100 px (marque compressible, relevés et actions fixes) */
@media (min-width: 1100px) {
  html body:not(#b#b) > header { flex-wrap: nowrap !important; }
  html body:not(#b#b) > header .logo-block { flex: 1 1 auto !important; min-width: 0 !important; }
  html body:not(#b#b) > header .logo-text { min-width: 0 !important; }
  html body:not(#b#b) > header .logo-text p { white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
  html body:not(#b#b) > header :is(.header-stats, .sys-status, .help-btn, .notif-btn) { flex: 0 0 auto !important; }
  html body:not(#b#b) > header .header-stats { flex-wrap: nowrap !important; }
}
@media (min-width: 1100px) and (max-width: 1440px) {
  html body:not(#b#b) > header .logo-text p { display: none !important; }
  html body:not(#b#b) > header .hstat { padding-left: 12px !important; padding-right: 12px !important; }
}

/* 29.2 survols stables : pas de déplacement de la zone cliquable (ombre / contour uniquement) */
html body:not(#b#b) :is(.auto-btn,.util-btn,.graph-btn,.search-btn,.ks-btn,.dl-btn,.ap-preset-btn,.rpag-btn,.cmo-btn,.imo-btn,.sco-btn,.ktm-btn,.console-copy-btn,.console-save-btn,.ab-login-btn,.ab-logout-btn,.sciux-btn,.domain-tab,.help-btn,.notif-btn,.ap-btn,.sciux-rail-btn,.sciux-inspect-btn,button[onclick^="generateConvergence"],button[onclick^="cleanupDuplicates"],#btn-auto):hover {
  transform: none !important;
}
html body:not(#b#b) :is(.report-item, .card, .dom-card, .feature-card, #sciana-root .sa-kpi, #sciana-root .sa-card):hover { transform: none !important; }
html body:not(#b#b) :is(.domain-tab, .help-btn, .notif-btn, .ap-btn, .util-btn, .dl-btn, #btn-auto):hover { box-shadow: var(--bevel), 0 0 0 3px rgba(11,31,77,.08), var(--sh-2) !important; }
html body:not(#b#b) .domain-bar .domain-tab[class*="active-"]:hover { box-shadow: var(--sh-navy), 0 0 0 3px rgba(255,196,0,.35) !important; }
html body:not(#b#b) #btn-auto:hover { box-shadow: 0 0 0 3px rgba(255,255,255,.25), 0 10px 22px -8px rgba(255,196,0,.75) !important; }
html body:not(#b#b) .sidebar-left .phase-btn:hover .phase-num { transform: none !important; box-shadow: 0 0 0 3px var(--c-acc-soft) !important; }
/* 29.3 états vides : gabarit unique (pastille + titre + aide), pleine largeur */
html body:not(#b#b) main.center-panel :is(#reports-container, #search-results, #compare-result, #history-container, #timeline-container) > p:only-child {
  display: grid !important; grid-template-columns: 40px minmax(0, 1fr) !important; column-gap: 16px !important; row-gap: 2px !important; align-items: center !important;
  max-width: none !important; width: 100% !important; margin: 4px 0 0 !important; padding: 18px 20px !important; text-align: left !important;
  background: repeating-linear-gradient(135deg, transparent 0 10px, rgba(11,31,77,.02) 10px 20px), var(--c-2) !important;
  border: 1px dashed var(--c-line-2) !important; border-left: 1px dashed var(--c-line-2) !important; border-radius: var(--r-lg) !important;
  font: italic 500 14px/1.4 var(--f-serif) !important; color: var(--c-text) !important;
}
html body:not(#b#b) main.center-panel :is(#reports-container, #search-results, #compare-result, #history-container, #timeline-container) > p:only-child::before {
  content: '' !important; display: block !important; grid-column: 1; grid-row: 1 / span 2; width: 40px !important; height: 40px !important; margin: 0 !important;
  border-radius: var(--r-md) !important; transform: none !important;
  background: radial-gradient(circle at 50% 50%, var(--c-y) 0 5px, transparent 5.5px), radial-gradient(circle at 50% 50%, transparent 0 11px, rgba(255,255,255,.35) 11px 12px, transparent 12.5px), var(--g-navy) !important;
  box-shadow: var(--sh-navy) !important;
}
html body:not(#b#b) main.center-panel :is(#reports-container, #search-results, #compare-result, #history-container, #timeline-container) > p:only-child::after {
  grid-column: 2; font: normal 400 11.5px/1.55 var(--f-sans) !important; color: var(--c-muted) !important;
}
html body:not(#b#b) main.center-panel :is(#reports-container, #search-results, #compare-result, #history-container, #timeline-container) > p[style*="color:var(--cyber)"]:only-child { border-color: var(--c-err-line) !important; background: var(--c-err-soft) !important; color: var(--c-err) !important; }
/* 29.4 couleur de domaine posée en ligne par 90-ux (--sciux-dom néon) → teinte AA */
html body:not(#b#b) :is(#sciux-crumbs, #sciux-inspector, #sciux-statusbar, #sciux-rail) { --sciux-dom: var(--active) !important; }
/* 29.5 numérotation des sections : chaque vue repart à 01 */
html body:not(#b#b) main.center-panel .tab-pane { counter-reset: b-sec; }
/* 29.6 feuilles des vues/modales de la couche 70 : blanches (le jeton d'origine est un dégradé sombre) */
html body:not(#b#b) {
  --v70-sheet: linear-gradient(#fff, #fff); --v70-well: var(--c-2);
  --v70-acc-soft: var(--c-acc-soft); --v70-acc-line: var(--c-acc-line);
  --v70-ok-soft: var(--c-ok-soft); --v70-ok-line: var(--c-ok-line);
  --v70-warn-soft: var(--c-warn-soft); --v70-warn-line: var(--c-warn-line);
  --v70-err-soft: var(--c-err-soft); --v70-serif: var(--f-serif);
}
/* popup rapport : feuille blanche, en-tête marine fin, lecture confortable */
html body:not(#b#b) #report-popup-overlay { background: rgba(11,31,77,.38) !important; -webkit-backdrop-filter: blur(6px) !important; backdrop-filter: blur(6px) !important; }
html body:not(#b#b) #report-popup-overlay > div {
  background: #fff !important; border: 1px solid var(--c-line) !important; border-top: 4px solid var(--c-acc) !important;
  border-radius: var(--r-xl) !important; box-shadow: var(--sh-modal) !important; color: var(--c-text-2) !important; animation: b-pop .22s var(--ease) both;
}
html body:not(#b#b) #report-popup-overlay > div > div:last-child > div:first-child { border-bottom: 1px solid var(--c-line) !important; }
html body:not(#b#b) #report-popup-overlay span[style*="font-size:16.5px"] { color: var(--c-acc) !important; font-size: 19.5px !important; }
html body:not(#b#b) #report-popup-overlay > div > button:first-child { background: var(--c-2) !important; border: 1px solid var(--c-line) !important; color: var(--c-text-2) !important; }
html body:not(#b#b) #popup-report-content { background: #fff !important; border: 0 !important; padding: 4px 0 0 !important; color: #1E2025 !important; font: 400 14px/1.72 var(--f-sans) !important; }
html body:not(#b#b) #popup-report-content :is(.md-p, .md-li) { color: #1E2025 !important; max-width: 80ch; }
html body:not(#b#b) #popup-report-content :is(.md-h1, .md-h2, .md-h3) { color: var(--c-acc) !important; font-family: var(--f-serif) !important; }
html body:not(#b#b) #popup-report-content .md-pre { background: var(--c-plate) !important; color: #E6EAF2 !important; border: 0 !important; }
html body:not(#b#b) #popup-report-content .md-table { width: 100% !important; }
/* présentation et mot de passe PDF : feuilles blanches */
html body:not(#b#b) #presentation-overlay { background: rgba(11,31,77,.55) !important; -webkit-backdrop-filter: blur(8px) !important; backdrop-filter: blur(8px) !important; }
html body:not(#b#b) #presentation-content { background: #fff !important; border: 1px solid var(--c-line) !important; border-top: 4px solid var(--c-acc) !important; border-radius: var(--r-xl) !important; box-shadow: var(--sh-modal) !important; color: var(--c-text-2) !important; }
html body:not(#b#b) #pdf-pw-modal { background: rgba(11,31,77,.38) !important; -webkit-backdrop-filter: blur(6px) !important; backdrop-filter: blur(6px) !important; }
html body:not(#b#b) #pdf-pw-modal > div { background: #fff !important; border: 1px solid var(--c-line) !important; border-top: 4px solid var(--c-y) !important; border-radius: var(--r-xl) !important; box-shadow: var(--sh-modal) !important; color: var(--c-text-2) !important; }
html body:not(#b#b) #pdf-pw-modal h2 { color: var(--c-acc) !important; }
html body:not(#b#b) #pdf-pw-modal :is(input, code, [id*="pw-value"], [style*="monospace"]) { background: var(--c-2) !important; color: var(--c-text) !important; border: 1px solid var(--c-line-2) !important; }
html body:not(#b#b) #pdf-pw-confirm { background: var(--g-navy) !important; color: #fff !important; border-color: var(--c-acc) !important; }
html body:not(#b#b) :is(#pdf-pw-copy, #pdf-pw-cancel) { background: #fff !important; color: var(--c-text) !important; border: 1px solid var(--c-line-2) !important; }
/* aide : onglets + corps */
html body:not(#b#b) .help-popup { color: var(--c-text-2) !important; }
html body:not(#b#b) .help-popup :is(p, li, td) { color: var(--c-text-2) !important; }
html body:not(#b#b) .help-popup :is(h3, h4, strong) { color: var(--c-acc) !important; }

/* ═══ 30. Round 5 (pile complète avec 85-a11y) ════════════════════════════ */
/* article ouvert : corps de texte à taille de lecture (les couches héritées réduisaient p/li) */
html body:not(#b#b) .report-content :is(.md-p, .md-li, p, li) { font: 400 14px/1.72 var(--f-sans) !important; color: #1E2025 !important; }
html body:not(#b#b) .report-content :is(.md-table, table) :is(td) { font-size: 13px !important; }
/* aide-mémoire clavier : en-tête marine comme l'inspecteur */
html body:not(#b#b#b) #sciux-keys .sciux-keys-head { background: var(--g-navy) !important; border-bottom: 3px solid var(--c-y) !important; color: #fff !important; }
html body:not(#b#b#b) #sciux-keys .sciux-keys-head :is(.sciux-keys-title, h2) { color: #fff !important; }
html body:not(#b#b#b) #sciux-keys .sciux-keys-head :not(.sciux-keys-title):not(h2):not(button):not(button *) { color: var(--c-navy-ink) !important; }
html body:not(#b#b#b) #sciux-keys .sciux-keys-head .sciux-btn { background: rgba(255,255,255,.08) !important; border-color: rgba(255,255,255,.25) !important; color: #fff !important; box-shadow: none !important; }
html body:not(#b#b#b) #sciux-keys .sciux-keys-box { overflow: hidden; }
html body:not(#b#b#b) #sciux-keys .sciux-keys-sec > :first-child { color: var(--c-acc) !important; font-weight: 700 !important; }
/* tableau de bord : listes encore vides → ligne d'attente discrète (disparaît dès que le JS remplit) */
html body:not(#b#b) :is(#top-concepts, #clusters-display):empty {
  display: flex !important; align-items: center; gap: 10px; min-height: 44px; margin-top: 10px !important; padding: 10px 14px;
  border: 1px dashed var(--c-line-2); border-radius: var(--r); background: var(--c-2);
  font: italic 400 13px/1.4 var(--f-serif); color: var(--c-muted);
}
html body:not(#b#b) #top-concepts:empty::before { content: 'Aucun concept classé pour l’instant — lancez les phases 1 à 3.'; }
html body:not(#b#b) #clusters-display:empty::before { content: 'Aucun cluster détecté pour l’instant — le regroupement apparaît après la phase 2.'; }
/* mobile : dos de revue réduit à une tranche de 6 px (gain de largeur de lecture) */
@media (max-width: 760px) {
  html body:not(#b#b) .report-item { padding-left: 6px !important; }
  html body:not(#b#b) .report-item::before { width: 6px !important; font-size: 0 !important; content: '' !important; }
  html body:not(#b#b) .report-item::after { left: 6px !important; }
  html body:not(#b#b) .report-header { padding: 14px 14px 12px 14px !important; }
  html body:not(#b#b) .report-content { padding: 16px 14px 20px !important; }
}

/* ═══ 31. Round 6 — couches 92-power / 95b-views / lune (spécificité 4 ID face aux 3 ID de 92) ═══ */
/* 31.1 console : barre d'outils = pupitre de lecture ; filtres (contours) ≠ compteurs (relevés teintés) */
html body:not(#b#b#b#b) .spw-ctool { background: var(--c-2) !important; border-bottom: 1px solid var(--c-line) !important; padding: 8px 12px !important; gap: 8px 12px !important; }
html body:not(#b#b#b#b) main.center-panel .console-filters { background: #fff !important; }
html body:not(#b#b#b#b) .spw-ctool input.spw-cq { background: #fff !important; border-radius: var(--r-pill) !important; padding-left: 34px !important; box-shadow: var(--bevel), var(--sh-1) !important; }
html body:not(#b#b#b#b) .spw-ctool input.spw-cq:focus { box-shadow: 0 0 0 3px rgba(255,196,0,.45) !important; border-color: var(--c-acc) !important; }
html body:not(#b#b#b#b) .spw-cmatch { color: var(--c-acc) !important; font-weight: 600 !important; }
html body:not(#b#b#b#b) .spw-ccount { gap: 0 !important; border: 1px solid var(--c-line) !important; border-radius: var(--r-pill) !important; background: #fff !important; overflow: hidden; box-shadow: var(--sh-1); }
html body:not(#b#b#b#b) .spw-cnt { border: 0 !important; border-radius: 0 !important; background: transparent !important; height: 28px !important; padding: 0 10px !important; }
html body:not(#b#b#b#b) .spw-cnt + .spw-cnt { box-shadow: inset 1px 0 0 var(--c-line) !important; }
html body:not(#b#b#b#b) .spw-cnt[data-k="ok"] { background: linear-gradient(0deg, var(--c-ok) 0 2px, transparent 2px) !important; }
html body:not(#b#b#b#b) .spw-cnt[data-k="info"] { background: linear-gradient(0deg, var(--c-acc) 0 2px, transparent 2px) !important; }
html body:not(#b#b#b#b) .spw-cnt[data-k="warn"] { background: linear-gradient(0deg, var(--c-warn) 0 2px, transparent 2px) !important; }
html body:not(#b#b#b#b) .spw-cnt[data-k="error"] { background: linear-gradient(0deg, var(--c-err) 0 2px, transparent 2px) !important; }
html body:not(#b#b#b#b) .spw-cnt[data-off] { background: var(--c-3) !important; opacity: .7; }
html body:not(#b#b#b#b) .spw-cnt > b { font: 700 11.5px/1 var(--f-mono) !important; color: var(--c-text) !important; }
html body:not(#b#b#b#b) :is(.spw-tg, .spw-btn) { width: auto; min-width: 30px; background: #fff !important; box-shadow: var(--bevel), var(--sh-1) !important; }
html body:not(#b#b#b#b) :is(.spw-tg, .spw-btn):hover:not(:disabled) { border-color: var(--c-acc-line) !important; color: var(--c-acc) !important; background: #fff !important; box-shadow: var(--bevel), 0 0 0 3px rgba(11,31,77,.08) !important; }
html body:not(#b#b#b#b) :is(.spw-tg, .spw-btn):active:not(:disabled) { transform: none !important; background: var(--c-acc-soft) !important; }
html body:not(#b#b#b#b) .spw-tg[aria-pressed="true"] { background: var(--c-acc) !important; color: #fff !important; border-color: var(--c-acc) !important; box-shadow: var(--sh-navy) !important; }
html body:not(#b#b#b#b) .spw-tg--err { color: var(--c-err) !important; border-color: var(--c-err-line) !important; }
html body:not(#b#b#b#b) .spw-tg--err[aria-pressed="true"] { background: var(--c-err) !important; color: #fff !important; border-color: var(--c-err) !important; box-shadow: none !important; }
html body:not(#b#b#b#b) #main-console .spw-mark { background: rgba(255,196,0,.55) !important; color: inherit !important; border-radius: 2px; box-shadow: 0 0 0 1px rgba(240,180,0,.6); }
html body:not(#b#b#b#b) #main-console .spw-rep::before { background: var(--c-acc) !important; color: #fff !important; border-radius: var(--r-pill) !important; }

/* 31.2 rapports : sommaire collant marine discret, entrée-titre en sérif */
html body:not(#b#b#b#b) .spw-rbar { background: rgba(255,255,255,.96) !important; border-bottom: 1px solid var(--c-line) !important; box-shadow: 0 6px 14px -12px rgba(11,31,77,.35) !important; }
html body:not(#b#b#b#b) .spw-toc-k { color: var(--c-acc) !important; padding-right: 10px; margin-right: 2px; box-shadow: inset -1px 0 0 var(--c-line); }
html body:not(#b#b#b#b) a.spw-toc-a[data-lvl="1"] { font: italic 600 13px/32px var(--f-serif) !important; color: var(--c-text) !important; max-width: 22ch; }
html body:not(#b#b#b#b) a.spw-toc-a:hover { background: var(--c-acc-soft) !important; color: var(--c-acc) !important; }
html body:not(#b#b#b#b) .spw-prog { height: 3px !important; background: var(--c-3) !important; }

/* 31.3 bouton lune (99-owner le loge dans la barre d'état ; 96-icons y pose une pastille .sci-chip) : conteneur neutre, anneau au survol */
html body:not(#b#b#b#b) #btn-toggle-all {
  background: transparent !important; border: 0 !important; border-radius: var(--r-sm) !important; box-shadow: none !important;
  -webkit-backdrop-filter: none !important; backdrop-filter: none !important; color: var(--c-acc) !important;
}
html body:not(#b#b#b#b) #btn-toggle-all:hover { box-shadow: 0 0 0 2px var(--c-acc), 0 0 0 5px rgba(255,196,0,.45) !important; }
/* 31.4 analyse : légendes de petits multiples en sans compact (le sérif italique débordait), graduations plus fines */
html body:not(#b#b) #sciana-root .sa-mult-cap { font: 500 11.5px/1.35 var(--f-sans) !important; font-style: normal !important; letter-spacing: .02em; }
html body:not(#b#b) #sciana-root .sa-svg .sa-tick { font-size: 10.5px !important; }
html body:not(#b#b) #sciana-root .sa-svg .sa-label { font-size: 11.5px !important; }
html body:not(#b#b) #sciana-root .sa-svg .sa-panel-title { font: 600 10px/1 var(--f-sans) !important; letter-spacing: .02em !important; fill: var(--c-acc) !important; }
html body:not(#b#b) #sciana-root .sa-svg .sa-value { font-size: 11px !important; }

/* ==== 85-a11y.css ==== */
/* ════════════════════════════════════════════════════════════════════════
   SCI-AUTONOME — 85-a11y.css · accessibilité WCAG 2.2 AA (langage CARNET)
   Inséré juste après 80-signature-B.css. N'altère que : contrastes des jetons
   en échec, focus visible, taille de cible, statuts non-chromatiques,
   prefers-contrast: more. Les animations ne sont PAS conditionnées à
   prefers-reduced-motion (choix du propriétaire).
   Audit (ratio sur #FFF / --c-bg #F5F5F1 / pire surface claire --c-4|--c-acc-soft-2) :
     --c-faint  #74767E  4.53 / 4.15 / 3.55  ÉCHEC → #62646C  5.90 / 5.40 / 4.62
     --c-ok     #067647  5.69 / 5.21 / 4.46  ÉCHEC → #05693F  ≥4.9 partout
     --c-warn   #B54708  5.43 / 4.97 / 4.25  ÉCHEC → #A14506  ≥4.5 partout
     --c-tech   #B9470C  5.29 / 4.84 / 4.15  ÉCHEC → #A03F06  5.17 sur --c-4
     --c-phy    #1B7A3E  5.38 / 4.93 / 4.22  ÉCHEC → #17703A  4.82 sur soft-2
     --c-med    #0E6F8C  5.72 / 5.23 / 4.48  ÉCHEC → #0C6680  5.10 sur soft-2
     bordure de champ --c-line-2 #D3D2CA 1.52:1 (< 3:1 composant) → #85878E 3.28:1 sur --c-bg
     OK : texte/texte-2/muted/acc/err/vio/cyber/y-ink sur clair ; blanc, --c-navy-ink,
          --c-y sur marine (≥ 9.9) ; #E6EAF2 sur planche (16.1).
   ════════════════════════════════════════════════════════════════════════ */

/* ── 1. Jetons : contrastes texte ≥ 4.5:1 sur toutes les surfaces claires ── */
html:root, html body {
  --c-faint: #62646C;
  --c-ok: #05693F;
  --c-warn: #A14506;
  --c-tech: #A03F06;
  --c-phy: #17703A;
  --c-med: #0C6680;
  /* bordure des champs (SC 1.4.11 : ≥ 3:1) */
  --a11y-field-line: #85878E;
  /* indicateurs de focus */
  --a11y-ring-in: var(--c-acc);
  --a11y-ring-out: 0 0 0 5px rgba(255,196,0,.6);
}

/* ── 2. Champs : limites perceptibles ───────────────────────────────────── */
html body:not(#b#b) :is(input:not([type="hidden"]):not([type="range"]):not([type="color"]):not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]):not([type="file"]), select, textarea):not(:disabled) {
  border-color: var(--a11y-field-line) !important;
}
html body:not(#b#b) :is(input, select, textarea):not(:disabled):hover { border-color: var(--c-text-2) !important; }
html body:not(#b#b) :is(input[type="checkbox"], input[type="radio"], input[type="range"]) { accent-color: var(--c-acc); }

/* ── 3. Focus visible (SC 2.4.7 / 2.4.11) ───────────────────────────────── */
/* surfaces claires : contour marine 2 px + halo jaune */
html body:not(#b#b) :is(input, select, textarea, summary, [contenteditable=""], [contenteditable="true"],
  [tabindex]:not([tabindex="-1"]), [role="tab"], [role="option"], [role="menuitem"], [role="switch"],
  [role="checkbox"], [role="radio"], [role="slider"], [role="link"], a[href]):focus-visible {
  outline: 2px solid var(--a11y-ring-in) !important; outline-offset: 2px !important;
  box-shadow: var(--a11y-ring-out) !important;
}
html body:not(#b#b) :is(input, select, textarea):focus-visible { outline-offset: 1px !important; }
/* en mode souris, le champ garde un repère non-chromatique (contour) en plus de l'anneau */
html body:not(#b#b) :is(input, select, textarea):focus:not(:focus-visible) { outline: 2px solid var(--c-acc) !important; outline-offset: 1px !important; }

/* surfaces marine / sombres : contour jaune, halo blanc discret */
html body:not(#a#a#a) > header :focus-visible,
html body:not(#a#a#a) .sidebar-left .auto-block :focus-visible,
html body:not(#a#a#a) main.center-panel .card:first-child :focus-visible,
html body:not(#a#a#a) #sciux-inspector .sciux-insp-head :focus-visible,
html body:not(#a#a#a) #sciux-statusbar .sciux-sb-state :focus-visible,
html body:not(#a#a#a) #sciana-tip :focus-visible,
html body:not(#a#a#a) .report-content > .md-pre :focus-visible,
html body.immersive-mode:not(#a#a#a) :focus-visible {
  outline: 2px solid var(--c-y) !important; outline-offset: 2px !important;
  box-shadow: 0 0 0 5px rgba(7,21,56,.85) !important;
}
/* éléments eux-mêmes marine dont le contour serait posé sur marine (offset négatif) */
html body:not(#a#a#a) :is(.sciux-sb-state, .sciux-inspect-btn--float):focus-visible { outline-color: var(--c-y) !important; }
/* les canvases-planches focalisables : contour jaune sur fond planche */
html body:not(#a#a#a) :is(#activityCanvas, #graphCanvas, #kineticCanvas, #networkCanvas, #tab-graph canvas):focus-visible {
  outline: 3px solid var(--c-y) !important; outline-offset: 2px !important;
}
/* le focus ne doit pas être masqué par la barre d'état fixe (SC 2.4.11) */
html { scroll-padding-bottom: calc(var(--sciux-sb-h, 32px) + 12px); }

/* ── 4. Taille de cible minimale 24×24 (SC 2.5.8) ───────────────────────── */
html body:not(#b#b) :is(button, [role="button"], [role="tab"], [role="menuitem"], [role="switch"], .tab, select,
  input[type="button"], input[type="submit"], input[type="reset"], summary):not([hidden]) {
  min-height: 24px; min-width: 24px;
}
html body:not(#b#b) .sciux-acc-chev { min-width: 24px !important; min-height: 24px !important; }

/* tactile : 44×44 (SC 2.5.5) sauf zones à hauteur fixe (barre d'état ; boutons de console 28 px ≥ 24 conformes AA) */
@media (pointer: coarse) {
  html body:not(#a#a#a) :is(button, [role="button"], [role="tab"], [role="menuitem"], [role="switch"], .tab, select,
    input[type="button"], input[type="submit"], input[type="reset"], input:not([type]), input[type="text"], input[type="search"],
    input[type="email"], input[type="password"], input[type="number"], summary):not([hidden]):not(#sciux-statusbar *):not(.console-copy-btn):not(.console-save-btn) {
    min-height: 44px !important;
  }
  html body:not(#a#a#a) :is(button, [role="button"], [role="tab"]):not([hidden]):not(#sciux-statusbar *):not(.console-copy-btn):not(.console-save-btn) {
    min-width: 44px !important;
  }
  html body:not(#a#a#a) :is(input[type="checkbox"], input[type="radio"]) { min-width: 22px; min-height: 22px; }
}

/* ── 5. Statuts non uniquement chromatiques (SC 1.4.1) ──────────────────── */
/* indicateurs de phase (pastilles vides) : forme distincte par état */
html body:not(#b#b) .sidebar-left .phase-btn.success .phase-indicator { border-radius: 50% !important; }
html body:not(#b#b) .sidebar-left .phase-btn.error .phase-indicator {
  border-radius: 1px !important; transform: rotate(45deg) scale(.92) !important; /* losange = erreur */
}
html body:not(#b#b) .sidebar-left .phase-btn.loading .phase-indicator {
  background: transparent !important; border: 2px solid var(--c-y-2) !important; box-sizing: border-box; /* anneau = en cours */
}
/* point de la barre d'état : terminé = carré, en cours = anneau (en plus du libellé texte) */
html body:not(#a#a#a) #sciux-statusbar .sciux-sb-state[data-state="done"] .sciux-sb-dot { border-radius: 2px !important; }
html body:not(#a#a#a) #sciux-statusbar .sciux-sb-state[data-state="run"] .sciux-sb-dot { background: transparent !important; border-width: 2px !important; }
/* badges d'accès : pastille démo = losange */
html body:not(#a#a#a) aside.sidebar-right .access-badge-demo .ab-dot { border-radius: 1px !important; transform: rotate(45deg) scale(.85); }

/* ── 6. prefers-contrast: more ──────────────────────────────────────────── */
@media (prefers-contrast: more) {
  html:root, html body {
    --c-line: #8A8C93; --c-line-2: #5A5C64; --c-acc-line: #5F6F99;
    --c-faint: #4A4C53; --c-muted: #3A3C42; --c-text-2: #1A1C20;
    --c-ok-line: #05693F; --c-warn-line: #A14506; --c-err-line: #B42318;
    --a11y-field-line: #3A3C42;
    --a11y-ring-out: 0 0 0 5px #FFC400;
    --sh-1: 0 0 0 1px #5A5C64; --sh-2: 0 0 0 1px #5A5C64;
  }
  html body:not(#b#b) :is(.card, .panel, .report-item, .badge, .domain-tab, .phase-btn, .tab,
    .auto-btn, .util-btn, .graph-btn, .ks-btn, .dl-btn, .rpag-btn, .sciux-btn, .cmo-btn, .imo-btn, .sco-btn) {
    border-width: 1px !important; border-style: solid !important; border-color: var(--c-line-2) !important;
  }
  html body:not(#b#b) :focus-visible { outline-width: 3px !important; }
  html body:not(#b#b) ::placeholder { color: var(--c-muted) !important; opacity: 1 !important; }
  html body:not(#b#b) a:not([class]) { text-decoration: underline !important; text-underline-offset: 2px; }
}

/* ── 7. Liens dans le texte courant : non-chromatique (SC 1.4.1) ────────── */
html body:not(#b#b) :is(p, li, td, .report-content, .md-p) a[href]:not([class]) { text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: 1px; }

/* ==== 86-critic.css ==== */
/* ═══ 86 — Revue critique « regard neuf » (après 85-a11y) — CSS seul, aucun contrôle masqué ═══ */

/* 1. Cartes KPI : retrait des disques décoratifs rognés (effet « gabarit SaaS ») → relief papier gravé */
html body:not(#q#q#q) main.center-panel :is(.card, .dom-card)::after { display: none !important; }
html body:not(#q#q#q) main.center-panel :is(.card, .dom-card) {
  box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgba(11,31,77,.04), 0 1px 2px rgba(11,31,77,.06), 0 6px 14px -8px rgba(11,31,77,.16) !important;
}
html body:not(#q#q#q) main.center-panel .card:first-child {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 2px 4px rgba(11,31,77,.18), 0 12px 26px -12px rgba(11,31,77,.55) !important;
}
html body:not(#q#q#q) main.center-panel :is(.card, .dom-card)::before { width: 36px !important; }

/* 2. Bandeau : la devise ne se tronque plus (2 lignes sérif sobres quand la place manque) */
@media (max-width: 1760px) and (min-width: 1241px) {
  html body:not(#q#q#q) > header .logo-text p {
    white-space: normal !important; overflow: visible !important; text-overflow: clip !important;
    max-width: 34ch !important; line-height: 1.16 !important; font-size: 12.5px !important; margin-top: 1px !important;
  }
}

/* 3. Badge d'accès (colonne droite) : libellé sur 2 lignes max, bouton compact — plus de 3 lignes écrasées */
html body:not(#q#q#q) aside.sidebar-right .access-badge.access-badge-inline {
  display: grid !important; grid-template-columns: auto minmax(0,1fr) auto !important; align-items: center !important;
  column-gap: 8px !important; row-gap: 0 !important; padding: 8px 8px 8px 12px !important;
}
html body:not(#q#q#q) aside.sidebar-right .access-badge.access-badge-inline .ab-label {
  white-space: normal !important; font-size: 11.5px !important; letter-spacing: .03em !important; line-height: 1.25 !important;
}
html body:not(#q#q#q) aside.sidebar-right .access-badge.access-badge-inline .ab-login-btn {
  padding: 4px 9px !important; font-size: 11px !important; min-height: 28px !important; white-space: nowrap !important;
}

/* 4. Activité en direct : heure en colonne fixe, texte en retrait suspendu (plus de « débit » sous l'heure) */
html body:not(#q#q#q) aside.sidebar-right .feed-item { padding-left: 82px !important; min-height: 20px; }
html body:not(#q#q#q) aside.sidebar-right .feed-item > br { display: none !important; }
html body:not(#q#q#q) aside.sidebar-right .feed-item > .feed-time { position: absolute !important; left: 16px !important; top: 8px !important; margin: 0 !important; }
html body:not(#q#q#q) aside.sidebar-right .feed-item > .sci-ic { vertical-align: -2px; margin-right: 4px; }

/* 5. Barre d'état : libellés secondaires retirés sous 1760 px pour que les VALEURS ne soient plus tronquées */
@media (max-width: 1760px) {
  html body:not(#q#q#q) #sciux-statusbar :is(.sciux-sb-domain, .sciux-sb-session, .sciux-sb-pipe, .sciux-sb-pipeline, .sciux-sb-auto) .sciux-sb-key { display: none !important; }
  html body:not(#q#q#q) #sciux-statusbar .sciux-sb-seg { padding-left: 9px !important; padding-right: 9px !important; }
}


/* 7. Très grands écrans (≥ 2200 px) : l'interface était minuscule et laissait 45 % de la hauteur vide → échelle 1,2 */
@media (min-width: 2200px) {
  html:not(.sci-no-zoom) { zoom: 1.08; }   /* owner : un peu moins gros (1.2 → 1.08) */
}

/* 8. Colonne droite : résumés des sections repliées (« 82/100 · Nominal ») lisibles sans points de suspension */
@media (max-width: 1760px) {
  html body:not(#q#q#q) aside.sidebar-right .sciux-acc-sum { letter-spacing: -.01em !important; font-size: 11.5px !important; }
}

/* ═══ Passe 2 (feu vert propriétaire) ═══ */

/* 9. Tableau de bord — « Top concepts » : classement gravé (rang, nom, jauge en creux à la couleur du domaine, valeur mono) */
html body:not(#q#q#q) #top-concepts { counter-reset: q-tc; display: grid; gap: 2px; margin-top: 12px !important; }
html body:not(#q#q#q) #top-concepts > div {
  counter-increment: q-tc; position: relative;
  display: grid !important; grid-template-columns: 28px minmax(0, 1fr) 180px 48px; align-items: center; column-gap: 14px;
  padding: 8px 10px !important; border: 0 !important; border-bottom: 1px solid var(--c-line, #E7E6E0) !important; border-radius: 8px 8px 0 0;
  transition: background-color .14s cubic-bezier(.2,.8,.2,1);
}
html body:not(#q#q#q) #top-concepts > div:last-child { border-bottom: 0 !important; }
html body:not(#q#q#q) #top-concepts > div:hover { background: var(--c-2, #F9F9F6) !important; }
html body:not(#q#q#q) #top-concepts > div::before {
  content: counter(q-tc, decimal-leading-zero); grid-column: 1; grid-row: 1;
  display: grid; place-items: center; width: 28px; height: 22px; border-radius: 6px;
  font: 600 11px/1 var(--f-mono, "IBM Plex Mono", monospace); font-variant-numeric: tabular-nums; color: var(--c-muted, #5A5C64);
  background: var(--c-3, #F0F0EB); box-shadow: inset 0 1px 0 #fff, 0 1px 1px rgba(11,31,77,.12), 0 0 0 1px rgba(11,31,77,.05);
}
html body:not(#q#q#q) #top-concepts > div:first-child::before { background: var(--c-y, #FFC400); color: var(--c-acc, #0B1F4D); box-shadow: inset 0 1px 0 rgba(255,255,255,.55), 0 1px 2px rgba(90,65,0,.35); }
html body:not(#q#q#q) #top-concepts > div:nth-child(2)::before, html body:not(#q#q#q) #top-concepts > div:nth-child(3)::before { background: var(--c-acc, #0B1F4D); color: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 1px 2px rgba(11,31,77,.3); }
/* gouttière en creux (piste) */
html body:not(#q#q#q) #top-concepts > div::after {
  content: ''; grid-column: 3; grid-row: 1; align-self: center; width: 180px; height: 8px; border-radius: 4px;
  background: var(--c-3, #F0F0EB); box-shadow: inset 0 1px 2px rgba(11,31,77,.16), 0 1px 0 #fff;
}
/* jauge en relief, à la couleur du domaine de découverte (posée en ligne par le JS) */
html body:not(#q#q#q) #top-concepts > div > div:first-child {
  grid-column: 3; grid-row: 1; z-index: 1; justify-self: start; max-width: 180px;
  height: 8px !important; border-radius: 4px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.4), inset 0 -1px 0 rgba(0,0,0,.12), 0 1px 2px rgba(11,31,77,.2);
}
html body:not(#q#q#q) #top-concepts > div > span:nth-of-type(1) {
  grid-column: 2; grid-row: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font: 500 14px/1.3 var(--f-sans, "IBM Plex Sans", sans-serif) !important; color: var(--c-text, #0B0C0E) !important;
}
html body:not(#q#q#q) #top-concepts > div:first-child > span:nth-of-type(1) { font-weight: 600 !important; }
html body:not(#q#q#q) #top-concepts > div > span:nth-of-type(2) {
  grid-column: 4; grid-row: 1; margin: 0 !important; text-align: right;
  font: 600 13.5px/1 var(--f-mono, "IBM Plex Mono", monospace) !important; font-variant-numeric: tabular-nums; color: var(--c-acc, #0B1F4D) !important;
}
/* feuille large : classement sur 2 colonnes (lecture verticale 01→04 | 05→08) — plus de grand vide entre nom et jauge */
/* (requêtes média, pas de container-type : la contention de style casserait les compteurs 01/02/03 et « N° ») */
@media (min-width: 1600px), (min-width: 1000px) and (max-width: 1240px) {
  html body:not(#q#q#q) #top-concepts { display: block !important; columns: 2; column-gap: 44px; column-rule: 1px solid var(--c-line, #E7E6E0); }
  html body:not(#q#q#q) #top-concepts > div { break-inside: avoid; margin-bottom: 2px; }
  html body:not(#q#q#q) #top-concepts > div:last-child { border-bottom: 1px solid var(--c-line, #E7E6E0) !important; }
}
@media (max-width: 560px) {
  html body:not(#q#q#q) #top-concepts > div { grid-template-columns: 26px minmax(0, 1fr) 90px 34px; column-gap: 10px; padding: 8px 4px !important; }
  html body:not(#q#q#q) #top-concepts > div::after { width: 90px; }
  html body:not(#q#q#q) #top-concepts > div > div:first-child { transform: scaleX(.5); transform-origin: left center; }
}

/* 10. Rapports — actions « Générer convergence / Nettoyer doublons » intégrées à la rangée de filtres :
       groupe segmenté aligné à droite, séparé par un filet ; icônes seules quand la feuille est étroite (libellé = title + texte lu) */
html body:not(#q#q#q) .report-domain-tabs { display: flex !important; flex-wrap: wrap; align-items: center; row-gap: 8px !important; }
html body:not(#q#q#q) .report-dtab { padding: 7px 11px !important; min-height: 34px; }
html body:not(#q#q#q) .report-domain-tabs > button[onclick^="generateConvergence"] {
  margin-left: auto !important; position: relative; border-radius: 10px 0 0 10px !important;
}
html body:not(#q#q#q) .report-domain-tabs > button[onclick^="generateConvergence"]::before {
  content: ''; position: absolute; left: -9px; top: 6px; bottom: 6px; width: 1px; background: var(--c-line-2, #D3D2CA);
}
html body:not(#q#q#q) .report-domain-tabs > button[onclick^="cleanupDuplicates"] { margin-left: -1px !important; border-radius: 0 10px 10px 0 !important; }
html body:not(#q#q#q) .report-domain-tabs > button:is([onclick^="generateConvergence"], [onclick^="cleanupDuplicates"]) { min-height: 34px; white-space: nowrap; }
@media (max-width: 1640px) {
  html body:not(#q#q#q) .report-dtab :is(.sci-ic, .sci-chip) { display: none !important; }
  html body:not(#q#q#q) .report-dtab { padding: 7px 10px !important; }
  html body:not(#q#q#q) .report-domain-tabs { gap: 5px !important; }
}
@media (max-width: 1960px) {
  html body:not(#q#q#q) .report-domain-tabs > button:is([onclick^="generateConvergence"], [onclick^="cleanupDuplicates"]) {
    font-size: 0 !important; letter-spacing: 0 !important; gap: 0 !important; width: 38px; min-width: 38px; padding: 0 !important; justify-content: center;
  }
  html body:not(#q#q#q) .report-domain-tabs > button:is([onclick^="generateConvergence"], [onclick^="cleanupDuplicates"]) :is(.sci-ic, svg) { width: 16px !important; height: 16px !important; margin: 0 !important; font-size: 16px; }
}

/* 11. Colonne droite à 1241–1800 px : un peu plus d'air (≈ +28 px pris sur la feuille centrale) */
@media (min-width: 1241px) and (max-width: 1800px) {
  html body:not(#q#q#q) { --lay-col-right: clamp(300px, 21.5vw, 340px); }
}

/* 12. Colonne gauche : spectre 4 couleurs → un seul filet à la teinte du domaine actif, en fondu (le dos marine et le curseur jaune restent) */
html body:not(#q#q#q) .sidebar-left {
  background:
    linear-gradient(var(--c-acc, #0B1F4D), var(--c-acc, #0B1F4D)) 0 0 / 8px 100% no-repeat,
    linear-gradient(180deg, var(--active, #0B1F4D), color-mix(in srgb, var(--active, #0B1F4D) 0%, transparent)) 8px 22px / 2px 140px no-repeat,
    #fff !important;
}

/* 13. Mobile : règle graduée masquée, bandeau compacté (pilule système sous la marque, KPI à largeur de contenu, libellés 10,5 px) */
@media (max-width: 760px) {
  html body:not(#q#q#q) main.center-panel::before { display: none !important; }
}
@media (max-width: 560px) {
  html body:not(#q#q#q) > header { position: relative; row-gap: 6px !important; padding-bottom: 10px !important; }
  html body:not(#q#q#q) > header .logo-block { min-height: 54px; height: auto !important; align-items: flex-start !important; padding-top: 6px; }
  html body:not(#q#q#q) > header .sys-status {
    position: absolute !important; left: 66px !important; top: 36px !important; width: auto !important; max-width: calc(100% - 120px);
    height: 20px !important; min-height: 0 !important; padding: 0 8px !important; margin: 0 !important; font-size: 10.5px !important; gap: 5px !important;
  }
  html body:not(#q#q#q) > header .sys-status span { font-size: 10.5px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  html body:not(#q#q#q) > header .header-stats { grid-template-columns: repeat(5, auto) !important; justify-content: space-between !important; }
  html body:not(#q#q#q) > header .hstat { padding: 6px 4px 4px !important; min-width: 0 !important; }
  html body:not(#q#q#q) > header .hstat::before { display: none !important; }
  html body:not(#q#q#q) > header .hstat-lbl { font-size: 10.5px !important; letter-spacing: 0 !important; overflow: visible !important; text-overflow: clip !important; }
  html body:not(#q#q#q) > header .hstat-val { font-size: 19px !important; }
}

/* ==== 90-ux.css ==== */
/* ═══ SCI-AUTONOME — couche UX avancée (90-ux.css, pairée avec 90-ux.js) ═══
 * Sobre et institutionnelle : surfaces opaques, filets fins, aucun effet
 * décoratif. Ne cible que des éléments #sciux-* / .sciux-* (et, via :has(),
 * réserve la place de la barre d'état sous les éléments flottants existants).
 */
:root {
  --sciux-sb-h: 32px;
  --sciux-acc: var(--k-acc, #7C9DFF);
  --sciux-acc-ink: var(--k-acc-ink, #0B1020);
  --sciux-dom: var(--lab-primary, #4f8cff);
}

.sciux-offscreen {
  position: absolute !important; width: 1px !important; height: 1px !important;
  overflow: hidden !important; clip: rect(0 0 0 0) !important; clip-path: inset(50%) !important;
  white-space: nowrap !important; left: -9999px !important;
}

/* ── Boutons communs ──────────────────────────────────────────────────── */
.sciux-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  min-height: 34px; padding: 6px 12px;
  font: 500 13px/1.2 var(--lab-font); letter-spacing: 0; text-transform: none;
  color: var(--lab-text-2); background: transparent;
  border: 1px solid var(--lab-line-2); border-radius: var(--lab-radius-xs);
  cursor: pointer; white-space: nowrap;
  transition: background-color .15s var(--lab-ease), border-color .15s var(--lab-ease), color .15s var(--lab-ease);
}
.sciux-btn:hover { background: var(--lab-surface-3); color: var(--lab-text); border-color: var(--lab-muted); }
.sciux-btn:disabled { opacity: .45; cursor: not-allowed; background: transparent; }
.sciux-btn.is-done { color: var(--lab-green); border-color: rgba(52, 211, 153, .5); }
.sciux-btn--icon { width: 34px; padding: 0; flex: none; }
.sciux-btn--primary { color: var(--sciux-acc-ink); background: var(--sciux-acc); border-color: var(--sciux-acc); font-weight: 600; }
.sciux-btn--primary:hover { background: var(--k-acc-2, #A7BCFF); border-color: var(--k-acc-2, #A7BCFF); color: var(--sciux-acc-ink); }
.sciux-btn svg, .sciux-inspect-btn svg { flex: none; }

#sciux-statusbar :focus-visible,
#sciux-crumbs :focus-visible,
#sciux-inspector :focus-visible,
#sciux-keys :focus-visible,
.sciux-inspect-btn:focus-visible { outline: 2px solid var(--sciux-acc) !important; outline-offset: 2px !important; box-shadow: none; }
html body:not(#u#u#u) #sciux-inspector [tabindex="-1"]:focus,
html body:not(#u#u#u) #sciux-keys [tabindex="-1"]:focus { outline: none !important; box-shadow: none !important; }

kbd, #sciux-keys kbd, #sciux-statusbar kbd {
  font-family: var(--lab-mono);
}
#sciux-statusbar kbd, #sciux-keys kbd {
  display: inline-block; min-width: 22px; padding: 1px 6px;
  font: 500 12.5px/1.45 var(--lab-mono); color: var(--lab-text); text-align: center;
  background: var(--lab-surface-3); border: 1px solid var(--lab-line-2);
  border-bottom-width: 2px; border-radius: 5px;
}

/* ═══ 1. Barre d'état ════════════════════════════════════════════════════ */
#sciux-statusbar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 9990;
  height: var(--sciux-sb-h);
  padding: 0 max(8px, env(safe-area-inset-right)) env(safe-area-inset-bottom) max(8px, env(safe-area-inset-left));
  display: flex; align-items: stretch; justify-content: space-between; gap: 8px;
  background: var(--lab-surface-solid, #111827);
  border-top: 1px solid var(--lab-line-2);
  font: 400 13px/1 var(--lab-font); color: var(--lab-text-2);
  font-variant-numeric: tabular-nums;
  box-sizing: content-box;
}
.sciux-sb-group { display: flex; align-items: stretch; min-width: 0; }
.sciux-sb-left { flex: 1 1 auto; overflow: hidden; }
.sciux-sb-right { flex: none; }
.sciux-sb-seg {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 0 12px; min-width: 0; white-space: nowrap;
  border: 0; border-right: 1px solid var(--lab-line);
  background: transparent; color: inherit; font: inherit;
}
.sciux-sb-right .sciux-sb-seg { border-right: 0; border-left: 1px solid var(--lab-line); }
.sciux-sb-seg[hidden] { display: none; }
.sciux-sb-key { color: var(--lab-muted); }
.sciux-sb-val { color: var(--lab-text); overflow: hidden; text-overflow: ellipsis; }
.sciux-sb-link { cursor: pointer; transition: background-color .15s var(--lab-ease); }
.sciux-sb-link:hover { background: var(--lab-surface-3); }
.sciux-sb-link:focus-visible { outline: 2px solid var(--sciux-acc) !important; outline-offset: -2px !important; box-shadow: none !important; }

/* État worker */
.sciux-sb-state { min-width: 0; flex: 0 1 auto; padding-left: 4px; }
.sciux-sb-dot {
  width: 8px; height: 8px; border-radius: 50%; flex: none;
  background: transparent; border: 1.5px solid var(--lab-muted); box-sizing: border-box;
}
.sciux-sb-state[data-state="run"] .sciux-sb-dot { background: var(--sciux-acc); border-color: var(--sciux-acc); }
.sciux-sb-state[data-state="done"] .sciux-sb-dot { background: var(--lab-green); border-color: var(--lab-green); }
.sciux-sb-state[data-state="run"] .sciux-sb-val { color: var(--sciux-acc); font-weight: 500; }

.sciux-sb-domain .sciux-sb-val::before {
  content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 7px;
  border-radius: 2px; background: var(--sciux-dom); vertical-align: 0;
}
.sciux-sb-meter {
  position: relative; width: 64px; height: 6px; border-radius: 3px; overflow: hidden;
  background: var(--lab-surface-3); box-shadow: inset 0 0 0 1px var(--lab-line);
}
.sciux-sb-meter-fill { position: absolute; inset: 0 auto 0 0; width: 0; background: var(--lab-teal); transition: width .4s var(--lab-ease); }
.sciux-sb-pipe .sciux-sb-val { min-width: 3.6ch; text-align: right; font-family: var(--lab-mono); font-size: 12.5px; }
.sciux-sb-auto[data-on="1"] .sciux-sb-val { color: var(--lab-green); }
.sciux-sb-health .sciux-sb-val { font-family: var(--lab-mono); font-size: 12.5px; }
.sciux-sb-health[data-level="ok"] .sciux-sb-val { color: var(--lab-green); }
.sciux-sb-health[data-level="warn"] .sciux-sb-val { color: var(--lab-amber); }
.sciux-sb-health[data-level="bad"] .sciux-sb-val { color: var(--lab-red); }
.sciux-sb-net .sciux-sb-val { color: var(--lab-red); font-weight: 600; }
.sciux-sb-session .sciux-sb-val { font-family: var(--lab-mono); font-size: 12.5px; }
.sciux-sb-hint kbd { min-width: 0; padding: 0 5px; font-size: 12px; line-height: 1.5; }
.sciux-sb-hint-lbl { color: var(--lab-muted); }
.sciux-sb-hint:hover .sciux-sb-hint-lbl { color: var(--lab-text); }

/* Réserve la place de la barre : contenu, colonnes collantes, éléments flottants. */
body:has(> #sciux-statusbar) { padding-bottom: var(--sciux-sb-h) !important; }
html body:has(> #sciux-statusbar) .sidebar-left,
html body:has(> #sciux-statusbar) .sidebar-right {
  max-height: calc(100vh - var(--lay-sticky-top, 12px) - 12px - var(--sciux-sb-h));
}
html body:has(> #sciux-statusbar) #toast-container { bottom: calc(22px + var(--sciux-sb-h)) !important; }
html body:has(> #sciux-statusbar) #back-to-top { bottom: calc(22px + var(--sciux-sb-h)) !important; }
html body:has(> #sciux-statusbar) #btn-toggle-all { bottom: calc(24px + var(--sciux-sb-h)) !important; }
/* Le déclencheur flottant de la palette (40-fx) est remplacé par l'entrée « Naviguer » de la barre. */
html body:has(> #sciux-statusbar) .scifx-pal-trigger { display: none !important; }
/* Interface masquée (mode immersif / tout masqué) : la barre s'efface aussi. */
html body.immersive-mode > #sciux-statusbar,
html body:has(> .main-layout[style*="none"]) > #sciux-statusbar { display: none; }
html body.immersive-mode:has(> #sciux-statusbar),
html body:has(> .main-layout[style*="none"]):has(> #sciux-statusbar) { padding-bottom: 0 !important; }

/* ═══ 2. Fil d'Ariane ════════════════════════════════════════════════════ */
#sciux-crumbs {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 7px 14px;
  font: 400 13px/1.3 var(--lab-font); color: var(--lab-muted);
  border-bottom: 1px solid var(--lab-line);
  background: rgba(11, 17, 32, .6);
}
#sciux-crumbs ol { display: flex; flex-wrap: wrap; align-items: center; margin: 0; padding: 0; list-style: none; min-width: 0; }
#sciux-crumbs li { display: inline-flex; align-items: center; min-width: 0; }
#sciux-crumbs li + li::before {
  content: "›"; margin: 0 9px; color: var(--lab-muted); opacity: .8;
}
.sciux-crumb-root { font: 500 12px/1 var(--lab-mono); letter-spacing: .04em; color: var(--lab-muted); }
.sciux-crumb-dom { display: inline-flex; align-items: center; color: var(--lab-text-2); }
.sciux-crumb-dom::before {
  content: ""; width: 8px; height: 8px; margin-right: 7px; border-radius: 2px; background: var(--sciux-dom);
}
#sciux-crumbs [aria-current="page"] { color: var(--lab-text); font-weight: 600; }
.sciux-crumb-ctx {
  flex: none; padding: 2px 8px; font-size: 12.5px; color: var(--lab-text-2);
  border: 1px solid var(--lab-line-2); border-radius: 999px;
}
.sciux-crumb-ctx[hidden] { display: none; }

/* ═══ 3. Inspecteur ══════════════════════════════════════════════════════ */
.sciux-inspect-btn {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 30px; padding: 4px 10px;
  font: 500 13px/1.2 var(--lab-font); letter-spacing: 0; text-transform: none;
  color: var(--lab-text-2); background: transparent;
  border: 1px solid var(--lab-line-2); border-radius: var(--lab-radius-xs);
  cursor: pointer; white-space: nowrap; flex: none;
  transition: background-color .15s var(--lab-ease), color .15s var(--lab-ease), border-color .15s var(--lab-ease);
}
.sciux-inspect-btn:hover { color: var(--lab-text); background: var(--lab-surface-3); border-color: var(--lab-muted); }
.sciux-inspect-btn[aria-expanded="true"] { color: var(--sciux-acc); background: var(--k-acc-08, rgba(124,157,255,.08)); border-color: var(--sciux-acc); }
#search-results .search-result-item .sciux-inspect-btn { margin-left: 8px; min-height: 28px; padding: 3px 9px; }
#search-results .search-result-item > div:first-child:not(:has(> span[style*="margin-left:auto"])) .sciux-inspect-btn { margin-left: auto; }
.sciux-inspect-btn--float { float: right; margin: -4px -4px 6px 10px; }

#sciux-inspector {
  position: fixed; z-index: 10000;
  top: 0; right: 0; bottom: var(--sciux-sb-h);
  width: clamp(320px, 36vw, 560px); max-width: 100vw;
  display: flex; flex-direction: column;
  background: var(--lab-surface-solid, #111827);
  border-left: 1px solid var(--lab-line-2);
  font-family: var(--lab-font); color: var(--lab-text);
  transform: translateX(16px); opacity: 0;
  transition: transform .2s var(--lab-ease), opacity .2s var(--lab-ease);
}
#sciux-inspector[hidden] { display: none; }
#sciux-inspector.is-open { transform: none; opacity: 1; }
body:not(:has(> #sciux-statusbar)) #sciux-inspector { bottom: 0; }

.sciux-insp-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  padding: 16px 16px 14px 20px;
  border-bottom: 1px solid var(--lab-line);
  border-top: 3px solid var(--sciux-dom);
}
.sciux-insp-headtxt { min-width: 0; }
.sciux-insp-kicker {
  display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin: 0 0 6px;
  font: 500 12.5px/1.3 var(--lab-font); color: var(--lab-muted); letter-spacing: .01em;
}
.sciux-insp-domdot { width: 8px; height: 8px; border-radius: 2px; background: var(--sciux-dom); }
.sciux-tag {
  padding: 1px 7px; font-size: 12px; color: var(--lab-text);
  border: 1px solid var(--lab-line-2); border-radius: 999px;
}
.sciux-insp-title {
  margin: 0; font: 600 clamp(16px, 1.25vw, 19px)/1.35 var(--lab-font); color: var(--lab-text);
  letter-spacing: -.005em; text-transform: none; overflow-wrap: anywhere;
}
.sciux-insp-nav { display: flex; align-items: center; gap: 6px; flex: none; }
.sciux-insp-pos { margin-right: 4px; font: 500 12.5px/1 var(--lab-mono); color: var(--lab-muted); font-variant-numeric: tabular-nums; }

.sciux-insp-body { flex: 1 1 auto; overflow-y: auto; overscroll-behavior: contain; padding: 4px 20px 24px; scrollbar-width: thin; }
.sciux-insp-sec { padding: 16px 0; border-bottom: 1px solid var(--lab-line); }
.sciux-insp-sec:last-child { border-bottom: 0; }
.sciux-insp-h {
  margin: 0 0 10px; font: 600 12px/1.2 var(--lab-font); color: var(--lab-muted);
  text-transform: uppercase; letter-spacing: .08em;
}
.sciux-insp-meta { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 8px 16px; margin: 0; font-size: 13.5px; }
.sciux-insp-meta dt { color: var(--lab-muted); }
.sciux-insp-meta dd { display: flex; align-items: center; gap: 8px; margin: 0; color: var(--lab-text); min-width: 0; }
.sciux-insp-meta dd > span { overflow-wrap: anywhere; }
.sciux-insp-meta .sciux-btn--icon { width: 28px; min-height: 28px; }
.sciux-mono { font-family: var(--lab-mono); font-size: 13px; }
.sciux-insp-reco {
  margin: 0; padding: 10px 12px; font-size: 14px; line-height: 1.5; color: var(--lab-text);
  background: var(--lab-surface-2); border-left: 3px solid var(--sciux-dom); border-radius: 0 6px 6px 0;
}
.sciux-insp-facts { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; margin: 0; }
.sciux-fact { padding: 9px 11px; background: var(--lab-surface-2); border: 1px solid var(--lab-line); border-radius: 8px; min-width: 0; }
.sciux-fact dt { font-size: 12.5px; color: var(--lab-muted); margin-bottom: 4px; }
.sciux-fact dd { margin: 0; font: 500 14px/1.35 var(--lab-font); color: var(--lab-text); overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.sciux-insp-abs, .sciux-insp-note { margin: 0; font-size: 14px; line-height: 1.6; color: var(--lab-text-2); }
.sciux-insp-lines { margin: 0; padding: 0; list-style: none; font: 400 13px/1.55 var(--lab-mono); color: var(--lab-text-2); }
.sciux-insp-lines li { padding: 6px 0; border-top: 1px dashed var(--lab-line); white-space: pre-wrap; overflow-wrap: anywhere; }
.sciux-insp-lines li:first-child { border-top: 0; }
.sciux-insp-toc { margin: 0; padding: 0; list-style: none; counter-reset: none; }
.sciux-insp-toc li[data-level="3"] { padding-left: 16px; }
.sciux-toc-link {
  display: block; width: 100%; padding: 5px 8px; margin: 0 -8px;
  font: 400 13.5px/1.4 var(--lab-font); color: var(--lab-text-2); text-align: left;
  background: transparent; border: 0; border-radius: 5px; cursor: pointer;
}
.sciux-toc-link:hover { color: var(--lab-text); background: var(--lab-surface-3); }

/* Document Markdown */
.sciux-md { font-size: 14.5px; line-height: 1.65; color: var(--lab-text-2); overflow-wrap: anywhere; }
.sciux-md > :first-child { margin-top: 0; }
.sciux-md h2, .sciux-md h3, .sciux-md h4, .sciux-md h5, .sciux-md h6 {
  color: var(--lab-text); font-family: var(--lab-font); letter-spacing: 0; text-transform: none; scroll-margin-top: 12px;
}
.sciux-md h2 { margin: 22px 0 10px; font-size: 18px; font-weight: 600; line-height: 1.35; }
.sciux-md h3 { margin: 22px 0 8px; font-size: 16px; font-weight: 600; padding-bottom: 6px; border-bottom: 1px solid var(--lab-line); }
.sciux-md h4, .sciux-md h5, .sciux-md h6 { margin: 16px 0 6px; font-size: 14.5px; font-weight: 600; }
.sciux-md p { margin: 0 0 10px; }
.sciux-md ul, .sciux-md ol { margin: 0 0 12px; padding-left: 22px; }
.sciux-md li { margin: 3px 0; }
.sciux-md strong { color: var(--lab-text); font-weight: 600; }
.sciux-md a { color: var(--lab-primary-2); text-decoration: underline; text-underline-offset: 2px; }
.sciux-md code { padding: 1px 5px; font: 13px/1.4 var(--lab-mono); color: var(--lab-text); background: var(--lab-surface-3); border-radius: 4px; }
.sciux-md pre {
  margin: 0 0 12px; padding: 12px; overflow-x: auto;
  background: var(--lab-bg-2); border: 1px solid var(--lab-line); border-radius: 8px;
}
.sciux-md pre code { padding: 0; background: none; font-size: 13px; white-space: pre; }
.sciux-md blockquote {
  margin: 0 0 12px; padding: 8px 12px; color: var(--lab-text-2);
  border-left: 3px solid var(--lab-line-2); background: var(--lab-surface-2); border-radius: 0 6px 6px 0;
}
.sciux-md blockquote p { margin: 2px 0; }
.sciux-md hr { margin: 18px 0; border: 0; border-top: 1px solid var(--lab-line); }
.sciux-md-table { margin: 0 0 14px; overflow-x: auto; border: 1px solid var(--lab-line); border-radius: 8px; }
.sciux-md table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.sciux-md th, .sciux-md td { padding: 7px 10px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--lab-line); }
.sciux-md th { color: var(--lab-muted); font-weight: 600; background: var(--lab-surface-2); }
.sciux-md tr:last-child td { border-bottom: 0; }

.sciux-insp-foot {
  flex: none; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px;
  padding: 12px 20px; border-top: 1px solid var(--lab-line); background: var(--lab-bg-2);
}
.sciux-insp-actions { display: flex; flex-wrap: wrap; gap: 8px; }

/* ═══ 4. Aide-mémoire clavier ════════════════════════════════════════════ */
#sciux-keys {
  position: fixed; inset: 0; z-index: 10001;
  display: flex; align-items: flex-start; justify-content: center;
  padding: max(6vh, 16px) 16px 16px;
  background: rgba(6, 7, 9, .72);
  font-family: var(--lab-font);
}
#sciux-keys[hidden] { display: none; }
.sciux-keys-box {
  width: min(820px, 100%); max-height: calc(100vh - 12vh); overflow-y: auto;
  background: var(--lab-surface-solid, #111827); color: var(--lab-text);
  border: 1px solid var(--lab-line-2); border-radius: var(--lab-radius);
}
.sciux-keys-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  padding: 18px 20px 14px; border-bottom: 1px solid var(--lab-line);
  position: sticky; top: 0; background: var(--lab-surface-solid, #111827);
}
.sciux-keys-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 4px 28px; padding: 8px 20px 4px; }
.sciux-keys-sec { padding: 12px 0; }
.sciux-keys-list { margin: 0; }
.sciux-keys-row {
  display: grid; grid-template-columns: minmax(118px, max-content) minmax(0, 1fr); align-items: center; gap: 14px;
  padding: 7px 0; border-top: 1px solid var(--lab-line);
}
.sciux-keys-row:first-child { border-top: 0; }
.sciux-keys-row dt { display: flex; align-items: center; gap: 4px; white-space: nowrap; }
.sciux-keys-row dd { margin: 0; font-size: 14px; line-height: 1.4; color: var(--lab-text-2); }
.sciux-plus { color: var(--lab-muted); font-size: 12px; }
.sciux-keys-note { margin: 0; padding: 12px 20px 16px; font-size: 13px; color: var(--lab-muted); border-top: 1px solid var(--lab-line); }

/* ═══ 5. Panneaux dynamiques (sections repliables, lecteur compact, rail) ═══
   Spécificité : html body:not(#u#u#u) (= 3 ID) pour l'emporter sur 80-signature. */

/* 5.1 En-tête de section = bouton plein (titre existant + résumé + chevron) */
html body:not(#u#u#u) .section-title[data-sciux-acc] {
  position: relative; min-height: 28px; white-space: nowrap; border-radius: var(--k-r-sm, 4px) !important;
  transition: background-color .12s var(--lab-ease);
}
html body:not(#u#u#u) .section-title[data-sciux-acc]::after { order: 1; min-width: 12px; }
html body:not(#u#u#u) .section-title[data-sciux-acc]:hover { background: var(--k-2, rgba(255,255,255,.03)) !important; }
html body:not(#u#u#u) .section-title[data-sciux-open="0"] { margin-bottom: 4px !important; }
.sciux-acc-btn {
  order: 2; position: static; flex: 0 1 auto; min-width: 0;
  display: flex; align-items: center; justify-content: flex-end; gap: 6px;
  padding: 0; margin: 0;
  background: transparent; border: 0;
  color: var(--lab-muted); font: 400 13px/1.2 var(--lab-font);
  letter-spacing: 0; text-transform: none; text-align: right;
  cursor: pointer;
}
/* zone cliquable = toute la ligne de titre */
.sciux-acc-btn::before { content: ""; position: absolute; inset: -4px -6px; border-radius: var(--k-r-sm, 4px); }
.sciux-acc-btn:hover .sciux-acc-chev, .section-title[data-sciux-acc]:hover .sciux-acc-chev { color: var(--lab-text); }
.sciux-acc-btn:focus-visible { outline: none !important; }
.sciux-acc-btn:focus-visible::before { outline: 2px solid var(--sciux-acc); outline-offset: 0; }
.sciux-acc-sum {
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  color: var(--lab-text-2); font-variant-numeric: tabular-nums;
  display: none;
}
.section-title[data-sciux-open="0"] .sciux-acc-sum { display: block; }
.sciux-acc-sum[data-level="ok"] { color: var(--lab-green); }
.sciux-acc-sum[data-level="warn"] { color: var(--lab-amber); }
.sciux-acc-sum[data-level="bad"] { color: var(--lab-red); }
.sciux-acc-sum[data-level="run"] { color: var(--sciux-acc); }
.sciux-acc-chev {
  display: inline-flex; width: 20px; height: 20px; align-items: center; justify-content: center; flex: none;
  color: var(--lab-muted);
  transition: transform .18s var(--lab-ease), color .12s var(--lab-ease);
}
.section-title[data-sciux-open="0"] .sciux-acc-chev { transform: rotate(-90deg); }
html body:not(#u#u#u) [data-sciux-hidden="1"] { display: none !important; }

/* 5.2 Lecteur compact : [lecture] [titre / progression] [complet] */
html body:not(#u#u#u) aside.sidebar-right .audio-player[data-sciux-mini="1"] {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto;
  grid-template-areas: "ctl title mode" "ctl prog mode";
  align-items: center; column-gap: 12px; row-gap: 4px;
  padding: 10px 12px !important; min-height: 0 !important;
}
html body:not(#u#u#u) .audio-player[data-sciux-mini="1"] > .ap-cover-wrap,
html body:not(#u#u#u) .audio-player[data-sciux-mini="1"] > .ap-spatial-panel,
html body:not(#u#u#u) .audio-player[data-sciux-mini="1"] > .ap-playlist,
html body:not(#u#u#u) .audio-player[data-sciux-mini="1"] .ap-vol-wrap,
html body:not(#u#u#u) .audio-player[data-sciux-mini="1"] .ap-track-artist,
html body:not(#u#u#u) .audio-player[data-sciux-mini="1"] .ap-track-idx,
html body:not(#u#u#u) .audio-player[data-sciux-mini="1"] .ap-times,
html body:not(#u#u#u) .audio-player[data-sciux-mini="1"] .ap-btns > :not(#ap-play-btn) { display: none !important; }
html body:not(#u#u#u) .audio-player[data-sciux-mini="1"] > .ap-controls {
  grid-area: ctl; display: block !important; margin: 0 !important; padding: 0 !important;
}
html body:not(#u#u#u) .audio-player[data-sciux-mini="1"] .ap-btns { display: block !important; margin: 0 !important; }
html body:not(#u#u#u) .audio-player[data-sciux-mini="1"] #ap-play-btn {
  width: 34px !important; height: 34px !important; min-width: 34px !important; margin: 0 !important; font-size: 13px !important;
}
html body:not(#u#u#u) .audio-player[data-sciux-mini="1"] > .ap-track {
  grid-area: title; margin: 0 !important; padding: 0 !important; text-align: left !important; min-width: 0;
}
html body:not(#u#u#u) .audio-player[data-sciux-mini="1"] .ap-track-title {
  font: 500 13.5px/1.3 var(--lab-font) !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: left !important;
}
html body:not(#u#u#u) .audio-player[data-sciux-mini="1"] > .ap-progress-wrap { grid-area: prog; padding: 0 !important; margin: 0 !important; }
.sciux-ap-mode { grid-area: mode; min-height: 30px; padding: 4px 8px; font-size: 13px; }
.sciux-ap-mode svg { transform: rotate(180deg); transition: transform .18s var(--lab-ease); }
.audio-player[data-sciux-mini="1"] .sciux-ap-mode svg { transform: none; }
html body:not(#u#u#u) .audio-player[data-sciux-mini="0"] .sciux-ap-mode { display: flex; margin: 10px auto 0; }

/* 5.3 Rail d'icônes (colonne droite réduite) */
#sciux-rail { display: none; }
@media (min-width: 1201px) {
  html body:not(#u#u#u) .main-layout[data-sciux-rail="1"] {
    grid-template-columns: var(--lay-col-left) minmax(0, 1fr) 60px !important;
  }
  html body:not(#u#u#u) .sidebar-right[data-sciux-rail="1"] { padding: 8px 6px !important; overflow-x: hidden; }
  html body:not(#u#u#u) .sidebar-right[data-sciux-rail="1"] > :not(#sciux-rail) { display: none !important; }
  html body:not(#u#u#u) .sidebar-right[data-sciux-rail="1"] > #sciux-rail { display: flex; }
}
#sciux-rail { flex-direction: column; align-items: center; gap: 4px; }
.sciux-rail-list { display: flex; flex-direction: column; gap: 4px; margin: 0; padding: 4px 0 0; list-style: none; border-top: 1px solid var(--lab-line); }
.sciux-rail-btn {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
  width: 46px; min-height: 44px; padding: 6px 0;
  color: var(--lab-muted); background: transparent;
  border: 0; border-radius: var(--k-r-sm, 4px); cursor: pointer;
  transition: background-color .12s var(--lab-ease), color .12s var(--lab-ease);
}
.sciux-rail-btn:hover { background: var(--k-2, var(--lab-surface-3)); color: var(--lab-text); }
.sciux-rail-btn:focus-visible { outline: 2px solid var(--sciux-acc) !important; outline-offset: 0 !important; }
.sciux-rail-expand { min-height: 36px; margin-bottom: 4px; }
.sciux-rail-val { font: 500 12.5px/1 var(--lab-mono); color: var(--lab-text-2); font-variant-numeric: tabular-nums; }
.sciux-rail-val[hidden] { display: none; }
.sciux-rail-btn[data-level="ok"] .sciux-rail-val { color: var(--lab-green); }
.sciux-rail-btn[data-level="warn"] .sciux-rail-val { color: var(--lab-amber); }
.sciux-rail-btn[data-level="bad"] .sciux-rail-val { color: var(--lab-red); }
.sciux-rail-btn[data-level="run"] { color: var(--sciux-acc); }
.sciux-rail-btn[data-level="run"]::before {
  content: ""; position: absolute; left: -6px; top: 8px; bottom: 8px; width: 2px; background: var(--sciux-acc);
}

/* 5.4 Barre d'état : nouvelles commandes */
.sciux-sb-act {
  margin-left: 2px; padding: 1px 7px; font-size: 12.5px; color: var(--lab-text-2);
  border: 1px solid var(--lab-line-2); border-radius: var(--k-r-sm, 4px);
}
.sciux-sb-auto:hover .sciux-sb-act { color: var(--lab-text); border-color: var(--lab-muted); }
.sciux-sb-auto[data-on="1"] .sciux-sb-act { color: var(--lab-text); }
.sciux-sb-player { max-width: 260px; }
.sciux-sb-player[hidden], .sciux-sb-feed[hidden] { display: none; }
.sciux-sb-play { width: 16px; text-align: center; font: 600 11.5px/1 var(--lab-mono); color: var(--lab-text); flex: none; }
.sciux-sb-feed { flex: 1 1 auto; min-width: 0; max-width: 520px; border-right: 0 !important; }
.sciux-sb-feed .sciux-sb-val { color: var(--lab-muted); }
.sciux-sb-rail[aria-pressed="true"] { color: var(--sciux-acc); }
.sciux-sb-rail[aria-pressed="true"] .sciux-sb-hint-lbl { color: var(--sciux-acc); }
@media (max-width: 1200px) { .sciux-sb-rail { display: none !important; } }
@media (max-width: 1536px) { .sciux-sb-feed { display: none !important; } }
@media (max-width: 1440px) { .sciux-sb-player .sciux-sb-val { display: none; } .sciux-sb-player { padding: 0 10px; } }
@media (max-width: 720px) { .sciux-sb-auto .sciux-sb-act, .sciux-sb-player { display: none !important; } }

#sciux-inspector .sciux-insp-title { font-family: var(--lab-serif); font-weight: 600; }

/* ═══ Adaptatif ══════════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
  .sciux-sb-hint-lbl, .sciux-sb-auto .sciux-sb-key, .sciux-sb-health .sciux-sb-key, .sciux-sb-session .sciux-sb-key { display: none; }
}
@media (max-width: 1024px) {
  .sciux-sb-session, .sciux-sb-auto, .sciux-sb-domain .sciux-sb-key { display: none; }
  .sciux-sb-pal { display: none !important; }
}
@media (max-width: 720px) {
  :root { --sciux-sb-h: 30px; }
  .sciux-sb-domain, .sciux-sb-health, .sciux-sb-pipe .sciux-sb-key, .sciux-sb-meter { display: none; }
  .sciux-sb-seg { padding: 0 9px; }
  #sciux-statusbar { font-size: 13px; }
  #sciux-crumbs { padding: 6px 12px; }
  .sciux-crumb-root, .sciux-crumb-root + * { display: none; }
  #sciux-crumbs li:first-child { display: none; }
  #sciux-crumbs li:nth-child(2)::before { content: none; }
  .sciux-inspect-lbl { display: none; }
  .sciux-inspect-btn { padding: 4px 8px; min-height: 34px; min-width: 34px; justify-content: center; }
  #sciux-inspector { width: 100vw; border-left: 0; }
  .sciux-insp-head { padding: 14px 12px 12px 16px; }
  .sciux-insp-body { padding: 4px 16px 20px; }
  .sciux-insp-foot { padding: 10px 16px; }
  .sciux-insp-foot .sciux-btn { flex: 1 1 auto; }
  .sciux-keys-row { grid-template-columns: minmax(96px, max-content) minmax(0, 1fr); }
}
@media print {
  #sciux-statusbar, #sciux-crumbs, .sciux-inspect-btn, #sciux-keys, #sciux-rail, .sciux-acc-btn, .sciux-ap-mode { display: none !important; }
  body:has(> #sciux-statusbar) { padding-bottom: 0 !important; }
}

/* ==== 92-power.css ==== */
/* ═══════════════════════════════════════════════════════════════════════════
   SCI-AUTONOME — 92-power.css · outils experts « CARNET » (voir 92-power.js)
   Préfixe : html body:not(#spw#spw#spw)  (3 ID : passe devant 80-signature-B à 2 ID).
   Jetons --c-* / --f-* / --r-* de 80-signature-B.css, avec replis.
   ═══════════════════════════════════════════════════════════════════════════ */

.spw-sr { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important;
  overflow: hidden !important; clip: rect(0 0 0 0) !important; clip-path: inset(50%) !important; white-space: nowrap !important; border: 0 !important; }

/* ── 1. Console : barre d'outils ─────────────────────────────────────────── */
html body:not(#spw#spw#spw) .spw-ctool {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px;
  padding: 8px 12px; margin: 0;
  background: var(--c-1, #fff); border-bottom: 1px solid var(--c-line, #E7E6E0);
  font: 500 12px/1.2 var(--f-sans, system-ui, sans-serif); color: var(--c-text-2, #2C2E33);
  container: spwct / inline-size;
}
html body:not(#spw#spw#spw) .spw-cfind {
  position: relative; display: flex; align-items: center; flex: 1 1 240px; min-width: 0; max-width: 420px;
}
html body:not(#spw#spw#spw) .spw-cfind-ic { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); display: inline-flex; color: var(--c-muted, #5A5C64); pointer-events: none; }
html body:not(#spw#spw#spw) .spw-ctool input.spw-cq {
  flex: 1 1 auto; min-width: 0; width: 100%; height: 32px !important; min-height: 32px !important; box-sizing: border-box;
  padding: 0 92px 0 32px !important; margin: 0 !important;
  font: 400 12.5px/1 var(--f-mono, ui-monospace, monospace) !important; letter-spacing: 0 !important;
  color: var(--c-text, #0B0C0E) !important; background: var(--c-2, #F9F9F6) !important;
  border: 1px solid var(--c-line-2, #D3D2CA) !important; border-radius: var(--r-sm, 8px) !important; box-shadow: none !important;
}
html body:not(#spw#spw#spw) .spw-ctool input.spw-cq:focus { background: #fff !important; border-color: var(--c-acc, #0B1F4D) !important; box-shadow: 0 0 0 3px var(--c-acc-soft-2, #DDE4F2) !important; }
html body:not(#spw#spw#spw) .spw-ctool input.spw-cq::-webkit-search-cancel-button { cursor: pointer; }
html body:not(#spw#spw#spw) .spw-cmatch {
  position: absolute; right: 30px; top: 50%; transform: translateY(-50%); pointer-events: none;
  font: 500 11px/1 var(--f-mono, monospace); font-variant-numeric: tabular-nums slashed-zero; color: var(--c-muted, #5A5C64); white-space: nowrap;
}
html body:not(#spw#spw#spw) .spw-cmatch[data-none] { color: var(--c-err, #B42318); }

html body:not(#spw#spw#spw) .spw-ccount { display: flex; align-items: center; gap: 4px; flex: 0 0 auto; }
html body:not(#spw#spw#spw) .spw-cnt {
  display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 9px 0 8px;
  border: 1px solid var(--c-line, #E7E6E0); border-radius: 999px; background: var(--c-1, #fff);
  font: 600 11px/1 var(--f-mono, monospace); font-variant-numeric: tabular-nums slashed-zero; color: var(--c-text-2, #2C2E33);
}
html body:not(#spw#spw#spw) .spw-cnt > i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: none; }
html body:not(#spw#spw#spw) .spw-cnt > b { font-weight: 700; color: var(--c-text, #0B0C0E); min-width: 1ch; text-align: right; }
html body:not(#spw#spw#spw) .spw-cnt-l { font: 600 10.5px/1 var(--f-sans, sans-serif); letter-spacing: .07em; color: var(--c-muted, #5A5C64); }
html body:not(#spw#spw#spw) .spw-cnt[data-k="ok"] > i { color: var(--c-ok, #067647); }
html body:not(#spw#spw#spw) .spw-cnt[data-k="info"] > i { color: var(--c-acc, #0B1F4D); }
html body:not(#spw#spw#spw) .spw-cnt[data-k="warn"] > i { color: var(--c-warn, #B54708); }
html body:not(#spw#spw#spw) .spw-cnt[data-k="error"] > i { color: var(--c-err, #B42318); }
html body:not(#spw#spw#spw) .spw-cnt[data-off] { background: var(--c-3, #F0F0EB); border-style: dashed; }
html body:not(#spw#spw#spw) .spw-cnt[data-off] > b { text-decoration: line-through; text-decoration-thickness: 1px; color: var(--c-muted, #5A5C64); }

html body:not(#spw#spw#spw) .spw-cact { display: flex; align-items: center; gap: 6px; margin-left: auto; flex: 0 0 auto; }
html body:not(#spw#spw#spw) :is(.spw-tg, .spw-btn) {
  display: inline-flex; align-items: center; gap: 6px; height: 30px; min-height: 30px; padding: 0 11px; margin: 0;
  font: 500 12px/1 var(--f-sans, sans-serif); letter-spacing: .01em; text-transform: none;
  color: var(--c-text-2, #2C2E33); background: var(--c-1, #fff);
  border: 1px solid var(--c-line-2, #D3D2CA); border-radius: 999px; box-shadow: none; cursor: pointer;
  transition: background-color .14s cubic-bezier(.2,.8,.2,1), border-color .14s cubic-bezier(.2,.8,.2,1), color .14s cubic-bezier(.2,.8,.2,1);
}
html body:not(#spw#spw#spw) :is(.spw-tg, .spw-btn):hover:not(:disabled) { color: var(--c-text, #0B0C0E); border-color: var(--c-faint, #74767E); background: var(--c-2, #F9F9F6); }
html body:not(#spw#spw#spw) :is(.spw-tg, .spw-btn):active:not(:disabled) { transform: scale(.97); }
html body:not(#spw#spw#spw) :is(.spw-tg, .spw-btn, .spw-copy, .spw-toc-a):focus-visible { outline: 2px solid var(--c-acc, #0B1F4D) !important; outline-offset: 2px !important; }
html body:not(#spw#spw#spw) .spw-tg-ic { display: inline-flex; flex: none; }
html body:not(#spw#spw#spw) .spw-tg[aria-pressed="true"] { color: #fff; background: var(--c-acc, #0B1F4D); border-color: var(--c-acc, #0B1F4D); }
html body:not(#spw#spw#spw) .spw-tg[aria-pressed="true"] .spw-tg-ic { color: var(--c-y, #FFC400); }
html body:not(#spw#spw#spw) .spw-tg--err:not(:disabled) { color: var(--c-err, #B42318); background: var(--c-err-soft, #FEF3F2); border-color: var(--c-err-line, #FECDCA); }
html body:not(#spw#spw#spw) .spw-tg--err:not(:disabled):hover { background: #FDE3E0; border-color: var(--c-err, #B42318); color: var(--c-err, #B42318); }
html body:not(#spw#spw#spw) .spw-tg:disabled { opacity: .5; cursor: not-allowed; }

/* barre étroite (colonne centrale à 3 feuilles) : bascules en icônes, nom accessible conservé */
@container spwct (max-width: 960px) {
  html body:not(#spw#spw#spw) .spw-tg-l {
    position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
  }
  html body:not(#spw#spw#spw) .spw-tg { width: 32px; padding: 0; justify-content: center; }
  html body:not(#spw#spw#spw) .spw-cfind { flex-basis: 200px; }
}
@container spwct (max-width: 640px) {
  html body:not(#spw#spw#spw) .spw-cfind { flex-basis: 100%; max-width: none; }
  html body:not(#spw#spw#spw) .spw-cnt-l {
    position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
  }
}

/* ── 1b. Console : lignes ────────────────────────────────────────────────── */
/* puces OK / INFO / WARN / ERR de l'application : rétablies au-dessus du display:block !important du thème */
html body:not(#spw#spw#spw) .console.hide-ok .log-line.ok,
html body:not(#spw#spw#spw) .console.hide-info .log-line.info,
html body:not(#spw#spw#spw) .console.hide-warn .log-line.warn,
html body:not(#spw#spw#spw) .console.hide-error .log-line.error,
html body:not(#spw#spw#spw) #main-console[data-spw-filter] .log-line[data-spw-miss],
html body:not(#spw#spw#spw) #main-console[data-spw-collapse] .log-line[data-spw-dup] { display: none !important; }

html body:not(#spw#spw#spw) #main-console[data-spw-filter] .log-line[data-spw-hit] { box-shadow: inset -3px 0 0 var(--c-y, #FFC400); }
::highlight(spw-con) { background-color: var(--c-y, #FFC400); color: var(--c-acc, #0B1F4D); }
html body:not(#spw#spw#spw) #main-console .log-line[data-spw-flash] {
  background: var(--c-y-soft, #FFF6CC) !important; outline: 2px solid var(--c-y, #FFC400); outline-offset: -2px;
}
html body:not(#spw#spw#spw) #main-console .spw-rel {
  display: inline-block; min-width: 7.5ch; margin-right: 1ch; text-indent: 0;
  font: 500 11px/1 var(--f-mono, monospace); font-variant-numeric: tabular-nums; color: var(--c-faint, #74767E); vertical-align: 1px;
}
html body:not(#spw#spw#spw) #main-console .spw-rel::before { content: attr(data-v); }
html body:not(#spw#spw#spw) #main-console:not([data-spw-rel]) .spw-rel { display: none; }
html body:not(#spw#spw#spw) #main-console .spw-rep { display: none; }
html body:not(#spw#spw#spw) #main-console[data-spw-collapse] .log-line[data-spw-rep] > .spw-rep {
  display: inline-block; margin-left: 1ch; padding: 2px 7px; text-indent: 0; vertical-align: 1px;
  font: 700 10.5px/1.2 var(--f-mono, monospace); font-variant-numeric: tabular-nums;
  color: #fff; background: var(--c-acc, #0B1F4D); border-radius: 999px; box-shadow: inset 0 -2px 0 var(--c-y, #FFC400);
}
html body:not(#spw#spw#spw) #main-console .spw-rep::before { content: attr(data-v); }
/* plein écran du terminal : la barre d'outils prend sa place */
html body:not(#spw#spw#spw) #main-console.console-fs[data-spw-tool] .console-body { max-height: calc(100vh - 110px) !important; }

/* ── 2. Rapports : sommaire collant, progression, copie ──────────────────── */
html body:not(#spw#spw#spw) .report-item:has(> .report-body.open > .spw-rbar) { overflow: clip; }
html body:not(#spw#spw#spw) .spw-rbar {
  position: sticky; top: 0; z-index: 4;
  display: flex; align-items: center; gap: 10px; min-height: 46px; padding: 6px 12px 6px 16px; box-sizing: border-box;
  background: rgba(255, 255, 255, .94); -webkit-backdrop-filter: saturate(1.4) blur(8px); backdrop-filter: saturate(1.4) blur(8px);
  border-bottom: 1px solid var(--c-line, #E7E6E0);
  font: 500 12.5px/1.2 var(--f-sans, sans-serif);
}
html body:not(#spw#spw#spw) .spw-toc { display: flex; align-items: center; gap: 10px; flex: 1 1 auto; min-width: 0; }
html body:not(#spw#spw#spw) .spw-toc-k {
  display: inline-flex; align-items: center; gap: 6px; flex: none;
  font: 700 11px/1 var(--f-sans, sans-serif); letter-spacing: .08em; text-transform: uppercase; color: var(--c-acc, #0B1F4D);
}
html body:not(#spw#spw#spw) .spw-toc-k--none { flex: 1 1 auto; color: var(--c-muted, #5A5C64); font-weight: 600; }
html body:not(#spw#spw#spw) .spw-toc-l {
  display: flex; align-items: stretch; gap: 2px; flex: 1 1 auto; min-width: 0; margin: 0; padding: 0; list-style: none;
  overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; scroll-behavior: smooth;
  -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent);
}
html body:not(#spw#spw#spw) .spw-toc-l::-webkit-scrollbar { display: none; }
html body:not(#spw#spw#spw) .spw-toc-l > li { flex: none; margin: 0; padding: 0; list-style: none; }
html body:not(#spw#spw#spw) .spw-toc-l > li::before { content: none; }
html body:not(#spw#spw#spw) a.spw-toc-a {
  position: relative; display: inline-flex; align-items: center; max-width: 26ch; min-height: 32px; padding: 0 10px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font: 500 12.5px/32px var(--f-sans, sans-serif) !important; color: var(--c-muted, #5A5C64) !important; text-decoration: none !important;
  border-radius: var(--r-xs, 6px); transition: color .14s, background-color .14s;
}
html body:not(#spw#spw#spw) a.spw-toc-a[data-lvl="3"], html body:not(#spw#spw#spw) a.spw-toc-a[data-lvl="4"] { font-size: 12px !important; font-style: italic; }
html body:not(#spw#spw#spw) a.spw-toc-a:hover { color: var(--c-text, #0B0C0E) !important; background: var(--c-2, #F9F9F6); }
html body:not(#spw#spw#spw) a.spw-toc-a[aria-current] { color: var(--c-acc, #0B1F4D) !important; font-weight: 600 !important; }
html body:not(#spw#spw#spw) a.spw-toc-a[aria-current]::after {
  content: ''; position: absolute; left: 10px; right: 10px; bottom: 3px; height: 3px; border-radius: 2px; background: var(--c-y, #FFC400);
}
html body:not(#spw#spw#spw) .spw-rbar-act { display: flex; gap: 6px; flex: none; }
html body:not(#spw#spw#spw) .spw-btn { color: var(--c-acc, #0B1F4D); border-color: var(--c-acc-line, #B9C4DD); }
html body:not(#spw#spw#spw) .spw-prog { position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; background: var(--c-3, #F0F0EB); overflow: hidden; }
html body:not(#spw#spw#spw) .spw-prog > i {
  display: block; height: 100%; width: 100%; transform-origin: 0 50%; transform: scaleX(0);
  background: linear-gradient(90deg, var(--c-acc, #0B1F4D) calc(100% - 6px), var(--c-y, #FFC400) 0);
  transition: transform .12s linear;
}
html body:not(#spw#spw#spw) .report-content > :is(h1, h2, h3, h4)[id] { scroll-margin-top: 64px; }
html body:not(#spw#spw#spw) .report-content > :is(h1, h2, h3, h4)[id]:focus { outline: none; }
html body:not(#spw#spw#spw) .report-content > :is(h1, h2, h3, h4)[id]:focus-visible { outline: 2px solid var(--c-acc, #0B1F4D); outline-offset: 3px; border-radius: 2px; }
html body:not(#spw#spw#spw) button.spw-copy {
  display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; min-height: 28px; padding: 0; margin: -4px 0 -4px 6px;
  vertical-align: middle; color: var(--c-acc, #0B1F4D); background: transparent; border: 1px solid transparent; border-radius: var(--r-xs, 6px);
  font-style: normal; cursor: pointer; opacity: 0; transition: opacity .14s, background-color .14s, border-color .14s;
}
html body:not(#spw#spw#spw) .report-content > :is(h1, h2, h3, h4):hover > .spw-copy,
html body:not(#spw#spw#spw) button.spw-copy:focus-visible, html body:not(#spw#spw#spw) button.spw-copy[data-done] { opacity: 1; }
html body:not(#spw#spw#spw) button.spw-copy:hover { background: var(--c-acc-soft, #EEF1F8); border-color: var(--c-acc-line, #B9C4DD); }
html body:not(#spw#spw#spw) button.spw-copy[data-done] { color: var(--c-ok, #067647); background: var(--c-ok-soft, #ECFDF3); border-color: var(--c-ok-line, #ABEFC6); }
@media (hover: none) { html body:not(#spw#spw#spw) button.spw-copy { opacity: .7; } }
html body:not(#spw#spw#spw) .spw-phead { display: none; }

/* ── 3. Recherche ────────────────────────────────────────────────────────── */
::highlight(spw-srch) { background-color: var(--c-y, #FFC400); color: var(--c-acc, #0B1F4D); }
html body:not(#spw#spw#spw) mark.spw-mark { background: var(--c-y, #FFC400); color: var(--c-acc, #0B1F4D); padding: 0 1px; border-radius: 2px; }
html body:not(#spw#spw#spw) .search-result-item[data-spw-nav] { scroll-margin: 12px; }
html body:not(#spw#spw#spw) .search-result-item[data-spw-nav]:focus { outline: none; }
html body:not(#spw#spw#spw) .search-result-item[data-spw-nav]:focus-visible {
  outline: 2px solid var(--c-acc, #0B1F4D) !important; outline-offset: 2px !important;
  box-shadow: inset 4px 0 0 var(--c-y, #FFC400), var(--sh-3, 0 6px 18px rgba(11,31,77,.12)) !important;
}
html body:not(#spw#spw#spw) .spw-shint {
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px 5px; margin: -4px 0 12px; padding: 0;
  font: 400 12px/1.5 var(--f-sans, sans-serif); color: var(--c-muted, #5A5C64);
}
html body:not(#spw#spw#spw) .spw-shint kbd {
  display: inline-block; min-width: 20px; padding: 1px 6px; text-align: center; box-sizing: border-box;
  font: 600 11px/1.5 var(--f-mono, monospace); color: var(--c-acc, #0B1F4D);
  background: var(--c-1, #fff); border: 1px solid var(--c-line-2, #D3D2CA); border-bottom-width: 2px; border-radius: 5px;
}

/* ── responsive ──────────────────────────────────────────────────────────── */
@media (max-width: 560px) {
  html body:not(#spw#spw#spw) .spw-ctool { padding: 8px 10px; gap: 6px; }
  html body:not(#spw#spw#spw) .spw-cnt-l, html body:not(#spw#spw#spw) .spw-tg-l {
    position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
  }
  html body:not(#spw#spw#spw) .spw-cnt { padding: 0 8px; }
  html body:not(#spw#spw#spw) .spw-tg { width: 34px; height: 34px; padding: 0; justify-content: center; }
  html body:not(#spw#spw#spw) .spw-rbar { padding: 6px 8px 6px 10px; gap: 6px; }
  html body:not(#spw#spw#spw) .spw-rbar .spw-toc-k > span:last-child,
  html body:not(#spw#spw#spw) .spw-rbar .spw-btn > span:last-child {
    position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
  }
  html body:not(#spw#spw#spw) .spw-rbar .spw-btn { width: 34px; height: 34px; padding: 0; justify-content: center; }
  html body:not(#spw#spw#spw) .spw-shint { display: none; }
}
@media (forced-colors: active) {
  ::highlight(spw-con), ::highlight(spw-srch) { background-color: Highlight; color: HighlightText; }
  html body:not(#spw#spw#spw) .spw-prog > i { background: Highlight; }
  html body:not(#spw#spw#spw) a.spw-toc-a[aria-current]::after { background: Highlight; }
}

/* ── impression : seul le rapport choisi (html[data-spw-printing]) ───────── */
@media print {
  @page { margin: 18mm 17mm 20mm; }
  .spw-ctool, .spw-rbar, .spw-copy, .spw-shint, #spw-live { display: none !important; }

  html[data-spw-printing]:not(#spw#spw#spw) body > :not([data-spw-ppath]):not([data-spw-print]),
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-ppath] > :not([data-spw-ppath]):not([data-spw-print]),
  html[data-spw-printing]:not(#spw#spw#spw) body::before, html[data-spw-printing]:not(#spw#spw#spw) body::after,
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-ppath]::before, html[data-spw-printing]:not(#spw#spw#spw) [data-spw-ppath]::after,
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] > .report-header,
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] :is(.sciux-inspect-btn, .report-actions, .spw-rbar, .spw-copy) { display: none !important; }

  html[data-spw-printing]:not(#spw#spw#spw), html[data-spw-printing]:not(#spw#spw#spw) [data-spw-ppath] {
    display: block !important; position: static !important; inset: auto !important; float: none !important;
    width: auto !important; max-width: none !important; min-width: 0 !important;
    height: auto !important; max-height: none !important; min-height: 0 !important;
    margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important;
    overflow: visible !important; background: #fff !important; box-shadow: none !important;
    transform: none !important; filter: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
    contain: none !important; content-visibility: visible !important; opacity: 1 !important; animation: none !important;
  }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print],
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] > .report-body {
    display: block !important; position: static !important; width: auto !important; max-width: none !important;
    margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important;
    background: #fff !important; box-shadow: none !important; transform: none !important; overflow: visible !important; opacity: 1 !important;
  }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] * { animation: none !important; transition: none !important; }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print]::before, html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print]::after,
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] > .report-body::before, html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] > .report-body::after,
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content::before, html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content::after { display: none !important; content: none !important; }

  /* en-tête du document : marque · domaine · dates */
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .spw-phead {
    display: block !important; margin: 0 0 9mm !important; padding: 0 0 4mm !important;
    border-bottom: 1.5pt solid #0B1F4D !important; break-after: avoid; page-break-after: avoid;
    -webkit-print-color-adjust: exact; print-color-adjust: exact;
  }
  html[data-spw-printing]:not(#spw#spw#spw) .spw-phead-k {
    display: flex; flex-wrap: wrap; gap: 0 10pt; align-items: baseline;
    font: 600 8pt/1.4 'IBM Plex Sans', 'Helvetica Neue', Arial, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: #3A3C42;
  }
  html[data-spw-printing]:not(#spw#spw#spw) .spw-phead-brand { color: #0B1F4D; font-weight: 700; padding-left: 8pt; border-left: 4pt solid #FFC400; }
  html[data-spw-printing]:not(#spw#spw#spw) .spw-phead-dom { margin-left: auto; color: #0B1F4D; }
  html[data-spw-printing]:not(#spw#spw#spw) h1.spw-phead-t {
    display: block !important; margin: 5mm 0 3mm !important; padding: 0 !important; border: 0 !important;
    font: 600 20pt/1.2 'Source Serif 4', 'Iowan Old Style', Georgia, 'Times New Roman', serif !important; color: #000 !important;
    letter-spacing: -.01em !important; text-transform: none !important; -webkit-text-fill-color: #000 !important; background: none !important;
  }
  html[data-spw-printing]:not(#spw#spw#spw) dl.spw-phead-m { display: flex; flex-wrap: wrap; gap: 2mm 9mm; margin: 0; padding: 0; }
  html[data-spw-printing]:not(#spw#spw#spw) dl.spw-phead-m > div { display: block; }
  html[data-spw-printing]:not(#spw#spw#spw) dl.spw-phead-m dt { margin: 0; font: 600 7pt/1.3 'IBM Plex Sans', Arial, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: #5A5C64; }
  html[data-spw-printing]:not(#spw#spw#spw) dl.spw-phead-m dd { margin: 0; font: 400 9.5pt/1.4 'IBM Plex Mono', 'Courier New', monospace; color: #111; }

  /* corps du rapport : sérif, marges de revue */
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content {
    display: block !important; width: auto !important; max-width: none !important; margin: 0 !important; padding: 0 !important;
    background: none !important; border: 0 !important; box-shadow: none !important; columns: auto !important;
    font: 400 11pt/1.55 'Source Serif 4', 'Iowan Old Style', Charter, Georgia, 'Times New Roman', serif !important; color: #000 !important;
    orphans: 3; widows: 3;
  }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content > * {
    grid-column: auto !important; margin: 0 0 3.2mm !important; color: #000 !important; background: none !important;
    -webkit-text-fill-color: currentColor !important; max-width: none !important;
  }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content > :is(h1, h2, h3, h4) {
    margin: 6mm 0 2.5mm !important; padding: 0 !important; border: 0 !important; position: static !important;
    font-family: 'Source Serif 4', 'Iowan Old Style', Georgia, 'Times New Roman', serif !important; font-style: normal !important;
    color: #0B1F4D !important; text-transform: none !important; letter-spacing: 0 !important; text-align: left !important;
    break-after: avoid; page-break-after: avoid; break-inside: avoid;
  }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content > :is(h1, h2, h3, h4)::before,
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content > :is(h1, h2, h3, h4)::after { display: none !important; content: none !important; }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content > h1 { font-size: 16pt !important; font-weight: 600 !important; }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content > h2 { font-size: 13.5pt !important; font-weight: 600 !important; }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content > h3 { font-size: 11.5pt !important; font-weight: 600 !important; font-style: italic !important; }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content > h4 { font: 700 8.5pt/1.3 'IBM Plex Sans', Arial, sans-serif !important; letter-spacing: .08em !important; text-transform: uppercase !important; }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content :is(p, li, blockquote, dd, dt, em, strong, span) {
    font-family: 'Source Serif 4', 'Iowan Old Style', Charter, Georgia, 'Times New Roman', serif !important;
  }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content :is(p, li) { font-size: 11pt !important; line-height: 1.55 !important; color: #000 !important; text-align: left; hyphens: auto; }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content > :first-child { margin-top: 0 !important; }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content :is(table, pre, blockquote, figure, img) { break-inside: avoid; page-break-inside: avoid; }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content table { width: 100% !important; border-collapse: collapse !important; font: 9pt/1.35 'IBM Plex Sans', Arial, sans-serif !important; }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content :is(th, td) { border: .5pt solid #888 !important; padding: 1.4mm 2mm !important; color: #000 !important; background: none !important; text-align: left; }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content th { background: #EEF1F8 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; font-weight: 600 !important; }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content :is(pre, code) {
    font: 8.5pt/1.45 'IBM Plex Mono', 'Courier New', monospace !important; color: #000 !important; background: #F5F5F1 !important;
    white-space: pre-wrap !important; word-break: break-word; -webkit-print-color-adjust: exact; print-color-adjust: exact;
  }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content pre { padding: 3mm !important; border: .5pt solid #ccc !important; border-radius: 0 !important; }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content hr { border: 0 !important; border-top: .5pt solid #999 !important; height: 0 !important; margin: 5mm 0 !important; }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content a { color: #0B1F4D !important; text-decoration: underline !important; }
  html[data-spw-printing]:not(#spw#spw#spw) [data-spw-print] .report-content a[href^="http"]::after {
    content: " (" attr(href) ")"; font: 8pt/1 'IBM Plex Mono', monospace; color: #444; word-break: break-all;
  }
}

/* ==== 95-analytics.css ==== */
/* ═══════════════════════════════════════════════════════════════════════════
   SCI-AUTONOME — 95-analytics.css — couche « Analyse scientifique » (SCIANA)
   Portée stricte : #sciana-root. Couleurs = jetons CALIBRE (--k-*) avec repli
   sur les jetons labo (--lab-*), pour suivre la palette finale.
   ═══════════════════════════════════════════════════════════════════════════ */
#sciana-root.sciana {
  --sa-ink: var(--k-text, var(--lab-text, #E4E7EB));
  --sa-ink-2: var(--k-text-2, var(--lab-text-2, #B3BAC3));
  --sa-muted: var(--k-muted, var(--lab-muted, #8C949E));
  --sa-bg: var(--k-1, var(--lab-surface-solid, #131518));
  --sa-bg-2: var(--k-2, var(--lab-surface-3, #191C20));
  --sa-bg-3: var(--k-3, #21252B);
  --sa-line: var(--k-line, var(--lab-line, #262A30));
  --sa-line-2: var(--k-line-2, var(--lab-line-2, #363B43));
  --sa-acc: var(--k-acc, var(--lab-primary, #7C9DFF));
  --sa-ok: var(--k-ok, var(--lab-green, #4CC38A));
  --sa-err: var(--k-err, var(--lab-red, #F06B66));
  --sa-warn: var(--k-warn, var(--lab-amber, #E3B54F));
  --sa-sans: var(--k-sans, var(--lab-font, 'IBM Plex Sans', system-ui, sans-serif));
  --sa-mono: var(--k-mono, var(--lab-mono, 'IBM Plex Mono', ui-monospace, monospace));
  --sa-r: var(--k-r, 6px);
  --sa-r-sm: var(--k-r-sm, 4px);
  --sa-ease: var(--k-ease, cubic-bezier(.2, 0, 0, 1));

  /* séries de données : une teinte principale sobre + états normalisés */
  --sa-c1: color-mix(in srgb, var(--sa-acc) 82%, var(--sa-bg));
  --sa-c2: var(--sa-ok);
  --sa-c3: color-mix(in srgb, var(--sa-acc) 40%, var(--sa-muted));
  --sa-c4: color-mix(in srgb, var(--sa-acc) 82%, var(--sa-bg));
  --sa-neutral: var(--sa-muted);
  --sa-med: var(--k-med, var(--med, #5FB0D6));
  --sa-cyber: var(--k-cyber, var(--cyber, #E07A86));
  --sa-tech: var(--k-tech, var(--tech, #D7A452));
  --sa-phy: var(--k-phy, var(--phy, #58B98C));

  display: block;
  container-type: inline-size;
  container-name: sciana;
  margin: 24px 0 8px;
  padding: 0;
  color: var(--sa-ink);
  font-family: var(--sa-sans);
  font-size: 13px;
  line-height: 1.45;
  font-variant-numeric: tabular-nums slashed-zero;
  background: none;
  border: 0;
  box-shadow: none;
  text-align: left;
}
#sciana-root.sciana *,
#sciana-root.sciana *::before,
#sciana-root.sciana *::after { box-sizing: border-box; }

/* ── En-tête de section ─────────────────────────────────────────────────── */
#sciana-root .sa-head {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
  gap: 8px 24px;
  padding: 0 0 12px;
  margin: 0 0 16px;
  border-bottom: 1px solid var(--sa-line);
  background: none;
}
#sciana-root .sa-h {
  margin: 0; padding: 0;
  font: 600 17px/1.25 var(--sa-sans);
  letter-spacing: 0;
  color: var(--sa-ink);
  text-transform: none;
  text-shadow: none;
}
#sciana-root .sa-lede { margin: 4px 0 0; max-width: 72ch; color: var(--sa-ink-2); font-size: 13px; }
#sciana-root .sa-head-r { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
#sciana-root .sa-meta { margin: 0; color: var(--sa-muted); font: 500 12px/1.4 var(--sa-mono); }

#sciana-root .sa-btn,
#sciana-root .sa-toggle {
  appearance: none;
  min-height: 32px;
  padding: 0 12px;
  border: 1px solid var(--sa-line-2);
  border-radius: var(--sa-r-sm);
  background: var(--sa-bg-2);
  color: var(--sa-ink);
  font: 500 12.5px/1 var(--sa-sans);
  letter-spacing: .02em;
  text-transform: none;
  cursor: pointer;
  box-shadow: none;
  text-shadow: none;
  transition: background-color .12s var(--sa-ease), border-color .12s var(--sa-ease);
}
#sciana-root .sa-toggle { min-height: 28px; padding: 0 10px; font-size: 12px; color: var(--sa-ink-2); }
#sciana-root .sa-btn:hover:not(:disabled),
#sciana-root .sa-toggle:hover { background: var(--sa-bg-3); border-color: var(--sa-muted); }
#sciana-root .sa-toggle[aria-pressed="true"] { border-color: var(--sa-acc); color: var(--sa-ink); background: color-mix(in srgb, var(--sa-acc) 14%, var(--sa-bg-2)); }
#sciana-root .sa-btn:disabled { opacity: .45; cursor: not-allowed; }
#sciana-root .sa-btn:focus-visible,
#sciana-root .sa-toggle:focus-visible,
#sciana-root summary:focus-visible { outline: 2px solid var(--sa-acc); outline-offset: 2px; }

/* ── Grille ─────────────────────────────────────────────────────────────── */
#sciana-root .sa-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 16px;
}
#sciana-root .sa-card { grid-column: span 12; }
@container sciana (min-width: 760px) {
  #sciana-root .sa-half { grid-column: span 6; }
  #sciana-root .sa-wide { grid-column: span 7; }
  #sciana-root .sa-card[data-sa="domains"],
  #sciana-root .sa-card[data-sa="reltypes"],
  #sciana-root .sa-card[data-sa="phases"] { grid-column: span 5; }
  #sciana-root .sa-card[data-sa="growth"] { grid-column: span 7; }
}
@container sciana (max-width: 759.98px) {
  #sciana-root .sa-card { grid-column: span 12 !important; }
}

/* ── Carte ──────────────────────────────────────────────────────────────── */
#sciana-root .sa-card {
  position: relative;
  display: flex; flex-direction: column;
  min-width: 0;
  margin: 0;
  padding: 16px;
  background: var(--sa-bg);
  border: 1px solid var(--sa-line);
  border-radius: var(--sa-r);
  box-shadow: none;
}
#sciana-root .sa-card.is-error { border-left: 2px solid var(--sa-err); }
#sciana-root .sa-card-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  margin: 0 0 12px; padding: 0; background: none; border: 0;
}
#sciana-root .sa-card-title {
  margin: 0; padding: 0;
  font: 500 11.5px/1.3 var(--sa-sans);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--sa-ink-2);
  text-shadow: none;
}
#sciana-root .sa-card-title::before, #sciana-root .sa-card-title::after { content: none; }
#sciana-root .sa-unit { margin: 4px 0 0; color: var(--sa-muted); font-size: 12px; line-height: 1.4; }
#sciana-root .sa-body { min-width: 0; flex: 1 1 auto; }
#sciana-root .sa-foot { margin-top: 8px; }
#sciana-root .sa-foot:empty { display: none; }

/* ── SVG : ossature ─────────────────────────────────────────────────────── */
#sciana-root .sa-svg { display: block; width: 100%; height: auto; overflow: visible; font-family: var(--sa-mono); }
#sciana-root .sa-svg .sa-gl { stroke: var(--sa-line); stroke-width: 1; shape-rendering: crispEdges; }
#sciana-root .sa-svg .sa-base { stroke: var(--sa-line-2); stroke-width: 1; shape-rendering: crispEdges; }
#sciana-root .sa-svg .sa-tick { fill: var(--sa-muted); font: 400 11px var(--sa-mono); font-variant-numeric: tabular-nums slashed-zero; }
#sciana-root .sa-svg .sa-axis-title { fill: var(--sa-muted); font: 400 11px var(--sa-sans); font-style: italic; }
#sciana-root .sa-svg .sa-label { fill: var(--sa-ink-2); font: 400 12px var(--sa-sans); }
#sciana-root .sa-svg .sa-endlbl { font-family: var(--sa-mono); font-size: 11.5px; }
#sciana-root .sa-svg .sa-value { fill: var(--sa-ink); font: 500 12px var(--sa-mono); font-variant-numeric: tabular-nums slashed-zero; }
#sciana-root .sa-svg .sa-panel-title { fill: var(--sa-muted); font: 500 11px var(--sa-sans); letter-spacing: .06em; text-transform: uppercase; }

/* marques */
#sciana-root .sa-svg .sa-mark.is-ok { fill: var(--sa-ok); }
#sciana-root .sa-svg .sa-mark.is-ko { fill: var(--sa-err); }

/* Relief : reflet, ombre portée, ombrage sphérique, plan d'appui */
#sciana-root .sa-svg .sa-bar { filter: url(#sa-f-depth); transition: opacity .12s var(--sa-ease); }
#sciana-root .sa-svg .sa-sheen { fill: url(#sa-g-sheen); pointer-events: none; }
#sciana-root .sa-svg .sa-orb { fill: url(#sa-g-orb); pointer-events: none; }
#sciana-root .sa-svg .sa-floor { fill: color-mix(in srgb, var(--sa-ink) 6%, transparent); stroke: none; pointer-events: none; }
#sciana-root .is-anim .sa-svg .sa-bar { transform-box: fill-box; animation: sa-grow-y .62s cubic-bezier(.2, .8, .2, 1) both; }
#sciana-root .is-anim .sa-svg .sa-bar.is-v { transform-origin: 50% 100%; }
#sciana-root .is-anim .sa-svg .sa-bar.is-h { transform-origin: 0 50%; animation-name: sa-grow-x; }
#sciana-root .is-anim .sa-svg .sa-dot, #sciana-root .is-anim .sa-svg .sa-orb { animation: sa-fade .5s ease-out both .15s; }
@keyframes sa-grow-y { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@keyframes sa-grow-x { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes sa-fade { from { opacity: 0; } to { opacity: 1; } }

/* Interaction : couche « hits » transparente au-dessus, bandes de surbrillance DESSOUS les marques.
   Aucun thème ne peut masquer les données : les zones actives sont forcées transparentes. */
#sciana-root .sa-svg .sa-hits .sa-hit { fill: transparent !important; fill-opacity: 0 !important; stroke: none !important; opacity: 0 !important; pointer-events: all; cursor: default; }
#sciana-root .sa-svg .sa-band { fill: transparent; stroke: none; pointer-events: none; }
#sciana-root .sa-svg .sa-band.is-hover { fill: color-mix(in srgb, var(--sa-ink) 6%, transparent); }
#sciana-root .sa-svg.has-hover .sa-col:not(.is-hover) .sa-bar { opacity: .55; }
#sciana-root .sa-svg .is-hover .sa-label { fill: var(--sa-ink); }
#sciana-root .sa-svg .sa-dot { stroke: var(--sa-bg); stroke-width: 1.5px; }
#sciana-root .sa-svg .sa-dot.is-hover { stroke: var(--sa-ink); stroke-width: 2px; }
#sciana-root .sa-svg.is-explorable:focus { outline: none; }
#sciana-root .sa-svg.is-explorable:focus-visible { outline: 2px solid var(--sa-acc); outline-offset: 3px; border-radius: 2px; }
#sciana-root .sa-svg .sa-line { fill: none; stroke-width: 2px; stroke-linejoin: round; stroke-linecap: round; }
#sciana-root .sa-svg .sa-ma { fill: none; stroke: var(--sa-ink); stroke-width: 2px; stroke-linejoin: round; stroke-dasharray: 5 3; pointer-events: none; }
#sciana-root .sa-svg .sa-ma-dot { fill: var(--sa-bg); stroke: var(--sa-ink); stroke-width: 1.5px; pointer-events: none; }
#sciana-root .sa-svg .sa-marker { stroke: var(--sa-ink); stroke-width: 1.5px; stroke-dasharray: 4 3; pointer-events: none; }
#sciana-root .sa-svg .sa-marker.is-med { stroke: var(--sa-warn); stroke-dasharray: none; }
#sciana-root .sa-svg .sa-marker-lbl { fill: var(--sa-ink-2); font: 500 11px var(--sa-mono); paint-order: stroke; stroke: var(--sa-bg); stroke-width: 3px; }
#sciana-root .sa-svg .sa-iqr { fill: color-mix(in srgb, var(--sa-ink) 9%, transparent); stroke: var(--sa-line-2); stroke-width: 1px; }
#sciana-root .sa-svg .sa-median { stroke: var(--sa-ink); stroke-width: 2px; }

/* ── Légendes & clés ────────────────────────────────────────────────────── */
#sciana-root .sa-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 0 0 8px; color: var(--sa-ink-2); font-size: 12px; }
#sciana-root .sa-legend > span { display: inline-flex; align-items: center; gap: 6px; }
#sciana-root .sa-key { display: inline-block; width: 10px; height: 10px; border-radius: 2px; background: var(--sa-c1); flex: none; }
#sciana-root .sa-key.is-ok { background: var(--sa-ok); }
#sciana-root .sa-key.is-ko { background: var(--sa-err); }
#sciana-root .sa-key-line { display: inline-block; width: 18px; height: 0; border-top: 2px dashed var(--sa-ink); flex: none; }

/* ── Petits multiples ───────────────────────────────────────────────────── */
#sciana-root .sa-multiples { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
@container sciana (max-width: 619.98px) { #sciana-root .sa-multiples { grid-template-columns: 1fr; } }
#sciana-root .sa-multiple { margin: 0; padding: 8px 0 0; border-top: 1px solid var(--sa-line); min-width: 0; }
#sciana-root .sa-mult-cap { display: flex; align-items: center; gap: 8px; margin: 0 0 4px; font-size: 12.5px; color: var(--sa-ink); }
#sciana-root .sa-mult-name { font-weight: 500; }
#sciana-root .sa-mult-sum { margin-left: auto; color: var(--sa-muted); font: 400 11.5px var(--sa-mono); }

/* ── KPI ────────────────────────────────────────────────────────────────── */
#sciana-root .sa-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 0;
  border-top: 1px solid var(--sa-line);
  border-left: 1px solid var(--sa-line);
}
#sciana-root .sa-kpi {
  padding: 12px 14px;
  border-right: 1px solid var(--sa-line);
  border-bottom: 1px solid var(--sa-line);
  min-width: 0;
}
#sciana-root .sa-kpi-k { font: 500 11.5px/1.3 var(--sa-sans); letter-spacing: .06em; text-transform: uppercase; color: var(--sa-muted); }
#sciana-root .sa-kpi-v { margin-top: 6px; font: 500 24px/1.1 var(--sa-mono); color: var(--sa-ink); font-variant-numeric: tabular-nums slashed-zero; white-space: nowrap; }
#sciana-root .sa-kpi-u { margin-top: 4px; font-size: 12px; color: var(--sa-muted); overflow-wrap: anywhere; }
#sciana-root .sa-meter { position: relative; height: 4px; margin-top: 10px; background: var(--sa-bg-3); border-radius: 2px; overflow: hidden; }
#sciana-root .sa-meter-fill { position: absolute; inset: 0 auto 0 0; background: var(--sa-c1); border-radius: 2px; }
#sciana-root .sa-meter-fill.is-inv { background: var(--sa-muted); }

/* ── Statistiques descriptives ──────────────────────────────────────────── */
#sciana-root .sa-stats {
  display: flex; flex-wrap: wrap; gap: 6px 20px;
  margin: 8px 0 0; padding: 8px 0 0;
  border-top: 1px solid var(--sa-line);
}
#sciana-root .sa-stat { display: flex; align-items: baseline; gap: 6px; margin: 0; }
#sciana-root .sa-stat dt { margin: 0; color: var(--sa-muted); font-size: 12px; }
#sciana-root .sa-stat dd { margin: 0; color: var(--sa-ink); font: 500 12.5px var(--sa-mono); font-variant-numeric: tabular-nums slashed-zero; }
#sciana-root .sa-src { margin: 6px 0 0; color: var(--sa-muted); font-size: 12px; }

/* ── Tableau de données (vue accessible) ────────────────────────────────── */
#sciana-root .sa-details { margin-top: 8px; }
#sciana-root .sa-details > summary {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 28px; padding: 0 2px;
  cursor: pointer; color: var(--sa-ink-2); font-size: 12px;
  list-style: none; border-radius: var(--sa-r-sm);
}
#sciana-root .sa-details > summary::-webkit-details-marker { display: none; }
#sciana-root .sa-details > summary::before { content: '▸'; font-size: 10px; color: var(--sa-muted); transition: transform .12s var(--sa-ease); }
#sciana-root .sa-details[open] > summary::before { transform: rotate(90deg); }
#sciana-root .sa-details > summary:hover { color: var(--sa-ink); }
#sciana-root .sa-table-wrap { max-height: 280px; overflow: auto; margin-top: 4px; border: 1px solid var(--sa-line); border-radius: var(--sa-r-sm); }
#sciana-root .sa-table { width: 100%; border-collapse: collapse; font-size: 12px; background: none; }
#sciana-root .sa-table caption { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
#sciana-root .sa-table th, #sciana-root .sa-table td {
  padding: 6px 10px; border: 0; border-bottom: 1px solid var(--sa-line);
  text-align: left; color: var(--sa-ink-2); font-weight: 400; background: none;
}
#sciana-root .sa-table thead th {
  position: sticky; top: 0; z-index: 1;
  background: var(--sa-bg-2); color: var(--sa-muted);
  font: 500 11.5px var(--sa-sans); letter-spacing: .06em; text-transform: uppercase;
}
#sciana-root .sa-table tbody th { color: var(--sa-ink); }
#sciana-root .sa-table .sa-num { text-align: right; font-family: var(--sa-mono); font-variant-numeric: tabular-nums slashed-zero; white-space: nowrap; }
#sciana-root .sa-table tbody tr:hover > * { background: var(--sa-bg-2); }

/* ── États : chargement / vide / erreur ─────────────────────────────────── */
#sciana-root .sa-msg { margin: 0; padding: 20px 0; color: var(--sa-ink-2); font-size: 13px; }
#sciana-root .is-empty .sa-msg { color: var(--sa-muted); }
#sciana-root .is-error .sa-msg { color: var(--sa-ink); }
#sciana-root .is-error .sa-msg::before { content: 'Erreur — '; color: var(--sa-err); font-weight: 600; }
#sciana-root .sa-vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; padding: 0; }
#sciana-root .sa-skel { display: grid; gap: 10px; padding: 8px 0; }
#sciana-root .sa-skel > span {
  display: block; height: 12px; border-radius: 2px;
  background: linear-gradient(90deg, var(--sa-bg-2) 0%, var(--sa-bg-3) 50%, var(--sa-bg-2) 100%);
  background-size: 200% 100%;
  animation: sa-skel 1.4s linear infinite;
}
#sciana-root .sa-skel > span:nth-child(1) { width: 92%; }
#sciana-root .sa-skel > span:nth-child(2) { width: 74%; }
#sciana-root .sa-skel > span:nth-child(3) { width: 58%; }
#sciana-root .sa-skel > span:nth-child(4) { width: 36%; }
@keyframes sa-skel { from { background-position: 200% 0; } to { background-position: 0 0; } }

/* ── Infobulle ──────────────────────────────────────────────────────────── */
#sciana-tip.sa-tip {
  --sa-ink: var(--k-text, var(--lab-text, #E4E7EB));
  --sa-ink-2: var(--k-text-2, var(--lab-text-2, #B3BAC3));
  --sa-bg-2: var(--k-2, var(--lab-surface-3, #191C20));
  --sa-line-2: var(--k-line-2, var(--lab-line-2, #363B43));
  --sa-sans: var(--k-sans, var(--lab-font, 'IBM Plex Sans', system-ui, sans-serif));
  --sa-mono: var(--k-mono, var(--lab-mono, 'IBM Plex Mono', ui-monospace, monospace));
  --sa-ease: var(--k-ease, cubic-bezier(.2, 0, 0, 1));
  box-sizing: border-box;
  font-variant-numeric: tabular-nums slashed-zero;
  position: fixed; left: 0; top: 0; z-index: 9000;
  max-width: 300px;
  padding: 8px 10px;
  background: var(--sa-bg-2);
  border: 1px solid var(--sa-line-2);
  border-radius: var(--k-r-sm, 4px);
  color: var(--sa-ink-2);
  font: 400 12px/1.45 var(--sa-sans);
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  max-width: min(300px, calc(100vw - 16px));
  will-change: transform;
}
#sciana-tip.sa-tip.is-on { opacity: 1; visibility: visible; }
#sciana-tip .sa-tip-h { color: var(--sa-ink); font-weight: 600; margin-bottom: 2px; overflow-wrap: anywhere; }
#sciana-tip .sa-tip-l { font-family: var(--sa-mono); font-size: 11.5px; font-variant-numeric: tabular-nums slashed-zero; }

/* ── Mode clair éventuel / contraste forcé / impression ─────────────────── */
@media (forced-colors: active) {
  #sciana-root .sa-svg .sa-mark, #sciana-root .sa-svg .sa-dot { fill: CanvasText !important; }
  #sciana-root .sa-card { border: 1px solid CanvasText; }
}
@media print {
  #sciana-root .sa-btn, #sciana-root .sa-toggle, #sciana-tip { display: none !important; }
  #sciana-root .sa-card { break-inside: avoid; }
}

/* ==== 95b-views.css ==== */
/* ═══════════════════════════════════════════════════════════════════════════
   SCI-AUTONOME — 95b-views.css — visualisations des vues ▼ PLUS (SCIVIEWS)
   Portée stricte : section.svw (#svw-health, #svw-history, #svw-timeline) et
   l'infobulle #sciviews-tip. Langage CARNET : jetons --c-* (80-signature-B)
   avec replis codés en dur pour fonctionner sans la couche signature.
   Préfixe : html body:not(#v#v) section.svw → 2 ID, au-dessus des couches 00→80
   pour les propriétés de mise en forme ; les tableaux de #tab-health /
   #tab-history héritent volontairement du style « 23.5 » de 80-signature-B.
   ═══════════════════════════════════════════════════════════════════════════ */
html body:not(#v#v) section.svw {
  --svw-bg: var(--c-1, #FFFFFF);
  --svw-bg-2: var(--c-2, #F9F9F6);
  --svw-bg-3: var(--c-3, #F0F0EB);
  --svw-line: var(--c-line, #E7E6E0);
  --svw-line-2: var(--c-line-2, #D3D2CA);
  --svw-ink: var(--c-text, #0B0C0E);
  --svw-ink-2: var(--c-text-2, #2C2E33);
  --svw-muted: var(--c-muted, #5A5C64);
  --svw-acc: var(--c-acc, #0B1F4D);
  --svw-acc-2: var(--c-acc-2, #17327A);
  --svw-acc-soft: var(--c-acc-soft, #EEF1F8);
  --svw-acc-soft-2: var(--c-acc-soft-2, #DDE4F2);
  --svw-y: var(--c-y, #FFC400);
  --svw-y-2: var(--c-y-2, #F0B400);
  --svw-y-soft: var(--c-y-soft, #FFF6CC);
  --svw-y-line: var(--c-y-line, #F5D66B);
  --svw-y-ink: var(--c-y-ink, #5A4100);
  --svw-ok: var(--c-ok, #067647);
  --svw-ok-soft: var(--c-ok-soft, #ECFDF3);
  --svw-ok-line: var(--c-ok-line, #ABEFC6);
  --svw-warn: var(--c-warn, #B54708);
  --svw-warn-soft: var(--c-warn-soft, #FFF6E5);
  --svw-warn-line: var(--c-warn-line, #FEDF89);
  --svw-err: var(--c-err, #B42318);
  --svw-err-soft: var(--c-err-soft, #FEF3F2);
  --svw-err-line: var(--c-err-line, #FECDCA);
  --svw-med: var(--c-med, #0E6F8C);
  --svw-cyber: var(--c-cyber, #B3135F);
  --svw-tech: var(--c-tech, #B9470C);
  --svw-phy: var(--c-phy, #1B7A3E);
  --svw-neutral: #9C9D96;
  --svw-sans: var(--f-sans, 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);
  --svw-mono: var(--f-mono, 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace);
  --svw-serif: var(--f-serif, 'Source Serif 4', 'Iowan Old Style', Charter, Georgia, serif);
  --svw-r: var(--r-lg, 14px);
  --svw-r-sm: var(--r-sm, 8px);
  --svw-ease: var(--ease, cubic-bezier(.2, .8, .2, 1));
  --svw-sh-1: var(--sh-1, 0 1px 2px rgba(11,31,77,.05), 0 0 0 1px rgba(11,31,77,.015));
  --svw-sh-3: var(--sh-3, 0 2px 4px rgba(11,31,77,.05), 0 8px 18px -6px rgba(11,31,77,.12), 0 18px 36px -18px rgba(11,31,77,.18));

  display: block;
  container-type: inline-size;
  container-name: svw;
  margin: 4px 0 22px;
  padding: 0;
  color: var(--svw-ink);
  font: 400 13.5px/1.5 var(--svw-sans);
  font-variant-numeric: tabular-nums slashed-zero;
  text-align: left;
  background: none;
  border: 0;
  box-shadow: none;
}
html body:not(#v#v) section.svw *,
html body:not(#v#v) section.svw *::before,
html body:not(#v#v) section.svw *::after { box-sizing: border-box; }

/* ── En-tête ─────────────────────────────────────────────────────────────── */
html body:not(#v#v) section.svw .svw-head {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
  gap: 8px 24px; margin: 0 0 14px; padding: 0;
  background: none; border: 0; box-shadow: none; position: static;
}
html body:not(#v#v) section.svw .svw-head::before,
html body:not(#v#v) section.svw .svw-head::after,
html body:not(#v#v) section.svw .svw-card-head::before,
html body:not(#v#v) section.svw .svw-card-head::after { content: none; display: none; }
html body:not(#v#v) section.svw .svw-h {
  margin: 0; padding: 0;
  font: 600 clamp(18px, 1.4vw, 22px)/1.2 var(--svw-serif);
  letter-spacing: -.01em; color: var(--svw-ink); text-transform: none; text-shadow: none;
  background: none; border: 0;
}
html body:not(#v#v) section.svw .svw-h::before {
  content: 'Fig.'; display: inline-block; margin-right: 10px; padding: 3px 7px; vertical-align: 3px;
  font: 700 11px/1 var(--svw-mono); color: var(--svw-acc); background: var(--svw-y); border-radius: var(--r-xs, 6px);
}
html body:not(#v#v) section.svw .svw-lede { margin: 6px 0 0; max-width: 76ch; color: var(--svw-ink-2); font: 400 14px/1.55 var(--svw-sans); }
html body:not(#v#v) section.svw .svw-head-r { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
html body:not(#v#v) section.svw .svw-meta { margin: 0; color: var(--svw-muted); font: 500 12px/1.4 var(--svw-mono); }

/* ── Boutons ─────────────────────────────────────────────────────────────── */
html body:not(#v#v) section.svw :is(.svw-btn, .svw-toggle) {
  appearance: none; -webkit-appearance: none;
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 34px; min-width: 0; padding: 0 14px; margin: 0;
  border: 1px solid var(--svw-line-2); border-radius: var(--r-md, 10px);
  background: var(--svw-bg); color: var(--svw-ink);
  font: 600 12.5px/1 var(--svw-sans); letter-spacing: .02em; text-transform: none;
  cursor: pointer; box-shadow: var(--svw-sh-1); text-shadow: none; width: auto;
  transition: background-color .14s var(--svw-ease), border-color .14s var(--svw-ease), color .14s var(--svw-ease), transform .14s var(--svw-ease);
}
html body:not(#v#v) section.svw .svw-toggle { min-height: 30px; padding: 0 12px; font-size: 12px; color: var(--svw-ink-2); }
html body:not(#v#v) section.svw :is(.svw-btn, .svw-toggle):hover:not(:disabled) { border-color: var(--svw-acc); color: var(--svw-acc); background: var(--svw-bg); }
html body:not(#v#v) section.svw :is(.svw-btn, .svw-toggle):active:not(:disabled) { transform: scale(.97); }
html body:not(#v#v) section.svw .svw-toggle[aria-pressed="true"] { background: var(--svw-acc); color: #fff; border-color: var(--svw-acc); }
html body:not(#v#v) section.svw .svw-toggle[aria-pressed="true"]::before { content: '✓'; margin-right: 6px; color: var(--svw-y); }
html body:not(#v#v) section.svw :is(.svw-btn, .svw-toggle):disabled { opacity: .5; cursor: not-allowed; box-shadow: none; }
html body:not(#v#v) section.svw :is(.svw-btn, .svw-toggle, summary):focus-visible { outline: 2px solid var(--svw-acc) !important; outline-offset: 2px !important; }

/* ── Grille ──────────────────────────────────────────────────────────────── */
html body:not(#v#v) section.svw .svw-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 16px; margin: 0; }
html body:not(#v#v) section.svw .svw-card { grid-column: span 12; }
@container svw (min-width: 760px) {
  html body:not(#v#v) section.svw .svw-s5 { grid-column: span 5; }
  html body:not(#v#v) section.svw .svw-s6 { grid-column: span 6; }
  html body:not(#v#v) section.svw .svw-s7 { grid-column: span 7; }
}

/* ── Carte ───────────────────────────────────────────────────────────────── */
html body:not(#v#v) section.svw .svw-card {
  position: relative; display: flex; flex-direction: column; min-width: 0; margin: 0;
  padding: clamp(14px, 1.2vw, 20px);
  background: var(--svw-bg); border: 1px solid var(--svw-line); border-radius: var(--svw-r);
  box-shadow: var(--svw-sh-1);
  transition: box-shadow .2s var(--svw-ease), border-color .2s var(--svw-ease);
}
html body:not(#v#v) section.svw .svw-card:hover { box-shadow: var(--svw-sh-3); border-color: var(--svw-line-2); }
html body:not(#v#v) section.svw .svw-card-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  margin: 0 0 12px; padding: 0 0 10px; border: 0; border-bottom: 1px solid var(--svw-line);
  background: none; box-shadow: none; position: static;
}
html body:not(#v#v) section.svw .svw-card-title {
  margin: 0; padding: 0; font: 700 12px/1.3 var(--svw-sans); letter-spacing: .07em; text-transform: uppercase;
  color: var(--svw-acc); text-shadow: none; background: none; border: 0;
}
html body:not(#v#v) section.svw .svw-card-title::before,
html body:not(#v#v) section.svw .svw-card-title::after { content: none; }
html body:not(#v#v) section.svw .svw-unit { margin: 4px 0 0; color: var(--svw-muted); font: 400 12.5px/1.45 var(--svw-sans); }
html body:not(#v#v) section.svw .svw-body { min-width: 0; flex: 1 1 auto; }
html body:not(#v#v) section.svw .svw-foot { margin-top: 8px; }
html body:not(#v#v) section.svw .svw-foot:empty { display: none; }
html body:not(#v#v) section.svw .svw-stack > * + * { margin-top: 10px; }
html body:not(#v#v) section.svw .svw-panel-cap {
  margin: 14px 0 2px; padding-top: 10px; border-top: 1px dashed var(--svw-line-2);
  font: 600 11.5px/1.3 var(--svw-sans); letter-spacing: .06em; text-transform: uppercase; color: var(--svw-muted);
}

/* ── SVG : ossature ──────────────────────────────────────────────────────── */
html body:not(#v#v) section.svw .svw-svg { display: block; width: 100%; max-width: 100%; height: auto; overflow: visible; font-family: var(--svw-mono); touch-action: manipulation; }
html body:not(#v#v) section.svw .svw-svg .svw-gl { stroke: var(--svw-line); stroke-width: 1; stroke-dasharray: 2 3; shape-rendering: crispEdges; }
html body:not(#v#v) section.svw .svw-svg .svw-base { stroke: var(--svw-ink); stroke-width: 1; shape-rendering: crispEdges; }
html body:not(#v#v) section.svw .svw-svg .svw-tick { fill: var(--svw-muted); font: 400 11px var(--svw-mono); font-variant-numeric: tabular-nums slashed-zero; }
html body:not(#v#v) section.svw .svw-svg .svw-axis-title { fill: var(--svw-acc); font: italic 600 11px var(--svw-sans); }
html body:not(#v#v) section.svw .svw-svg .svw-label { fill: var(--svw-ink-2); font: 400 12px var(--svw-sans); }
html body:not(#v#v) section.svw .svw-svg .svw-sublabel { fill: var(--svw-muted); font: 400 10.5px var(--svw-mono); }
html body:not(#v#v) section.svw .svw-svg .svw-value { fill: var(--svw-ink); font: 600 12px var(--svw-mono); font-variant-numeric: tabular-nums slashed-zero; }
html body:not(#v#v) section.svw .svw-svg .svw-value.is-ok { fill: var(--svw-ok); }
html body:not(#v#v) section.svw .svw-svg .svw-value.is-ko { fill: var(--svw-err); }
html body:not(#v#v) section.svw .svw-svg .svw-value.is-na { fill: var(--svw-muted); }
html body:not(#v#v) section.svw .svw-svg .svw-panel-title { fill: var(--svw-muted); font: 600 10.5px var(--svw-sans); letter-spacing: .06em; text-transform: uppercase; }
html body:not(#v#v) section.svw .svw-svg .svw-floor { fill: rgba(11, 31, 77, .05); stroke: none; pointer-events: none; }

/* Relief : barre à dégradé + ombre douce (mêmes règles que SCIANA) */
html body:not(#v#v) section.svw .svw-svg .svw-bar { filter: url(#svw-f-depth); transition: opacity .14s var(--svw-ease); }
html body:not(#v#v) section.svw .svw-svg .svw-mark { fill: var(--svw-acc); }
html body:not(#v#v) section.svw .svw-svg .svw-mark.is-unknown { opacity: .55; }
html body:not(#v#v) section.svw .svw-svg .svw-sheen { fill: url(#svw-g-sheen); pointer-events: none; }
html body:not(#v#v) section.svw .svw-svg .svw-hatch { fill: url(#svw-p-hatch); pointer-events: none; }
html body:not(#v#v) section.svw .svw-svg .svw-orb { fill: url(#svw-g-orb); pointer-events: none; }
html body:not(#v#v) section.svw .svw-svg .svw-dot { stroke: #fff; stroke-width: 1.4px; }
html body:not(#v#v) section.svw .svw-svg .svw-dotg.is-needle .svw-dot { stroke: var(--svw-acc); stroke-width: 2px; }
html body:not(#v#v) section.svw .svw-svg .svw-slot { fill: var(--svw-bg-2); stroke: var(--svw-line-2); stroke-width: 1px; stroke-dasharray: 3 2; }
html body:not(#v#v) section.svw .svw-svg .svw-thr { stroke: var(--svw-y-2); stroke-width: 2.5px; stroke-linecap: round; pointer-events: none; }
html body:not(#v#v) section.svw .svw-svg .svw-marker { stroke: var(--svw-acc); stroke-width: 1.5px; stroke-dasharray: 4 3; pointer-events: none; }
html body:not(#v#v) section.svw .svw-svg .svw-marker.is-med { stroke: var(--svw-y-2); stroke-width: 2px; stroke-dasharray: none; }
html body:not(#v#v) section.svw .svw-svg .svw-marker-lbl { fill: var(--svw-y-ink); font: 600 11px var(--svw-mono); paint-order: stroke; stroke: #fff; stroke-width: 3px; }

/* jauge */
html body:not(#v#v) section.svw .svw-svg .svw-zone { stroke: #fff; stroke-width: 1.5px; transition: filter .14s var(--svw-ease); }
html body:not(#v#v) section.svw .svw-svg .svw-zone.is-bad { fill: var(--svw-err-soft); }
html body:not(#v#v) section.svw .svw-svg .svw-zone.is-mid { fill: var(--svw-warn-soft); }
html body:not(#v#v) section.svw .svw-svg .svw-zone.is-good { fill: var(--svw-ok-soft); }
html body:not(#v#v) section.svw .svw-svg .svw-zone.is-hover { stroke: var(--svw-y-2); stroke-width: 2px; }
html body:not(#v#v) section.svw .svw-svg .svw-gauge-val .svw-mark { fill: var(--svw-acc); }
html body:not(#v#v) section.svw .svw-svg .svw-gauge-num { fill: var(--svw-acc); font: 600 38px var(--svw-mono); letter-spacing: -.03em; }
html body:not(#v#v) section.svw .svw-svg .svw-gauge-lbl { font: 700 12px var(--svw-sans); letter-spacing: .05em; text-transform: uppercase; }
html body:not(#v#v) section.svw .svw-svg .svw-gauge-lbl.is-good { fill: var(--svw-ok); }
html body:not(#v#v) section.svw .svw-svg .svw-gauge-lbl.is-mid { fill: var(--svw-warn); }
html body:not(#v#v) section.svw .svw-svg .svw-gauge-lbl.is-bad { fill: var(--svw-err); }

/* puces */
html body:not(#v#v) section.svw .svw-svg .svw-track { fill: var(--svw-bg-3); }
html body:not(#v#v) section.svw .svw-svg .svw-zone-b.is-good { fill: var(--svw-ok-soft); stroke: var(--svw-ok-line); stroke-width: 1px; }
html body:not(#v#v) section.svw .svw-svg .svw-zone-b.is-bad { fill: var(--svw-err-soft); stroke: var(--svw-err-line); stroke-width: 1px; }

/* chronologie */
html body:not(#v#v) section.svw .svw-svg .svw-lane { fill: var(--svw-bg-2); }
html body:not(#v#v) section.svw .svw-svg .svw-idle { fill: url(#svw-p-idle); }
html body:not(#v#v) section.svw .svw-svg .svw-idle-lbl { fill: var(--svw-muted); font: italic 400 10.5px var(--svw-serif); }

/* carte de chaleur : divergente échec (rouge) → succès (marine) ; texte toujours affiché */
html body:not(#v#v) section.svw .svw-svg .svw-hm { stroke: #fff; stroke-width: 1px; filter: url(#svw-f-depth); }
html body:not(#v#v) section.svw .svw-svg .svw-hm.is-r0 { fill: var(--svw-err); }
html body:not(#v#v) section.svw .svw-svg .svw-hm.is-r1 { fill: #E08A7F; }
html body:not(#v#v) section.svw .svw-svg .svw-hm.is-r2 { fill: #D9D6C9; }
html body:not(#v#v) section.svw .svw-svg .svw-hm.is-r3 { fill: #6E86C2; }
html body:not(#v#v) section.svw .svw-svg .svw-hm.is-r4 { fill: var(--svw-acc); }
html body:not(#v#v) section.svw .svw-svg .svw-hm-empty { fill: none; stroke: var(--svw-line-2); stroke-width: 1px; stroke-dasharray: 3 3; }
html body:not(#v#v) section.svw .svw-svg .svw-hm-txt { font: 600 11px var(--svw-mono); pointer-events: none; fill: #fff; }
html body:not(#v#v) section.svw .svw-svg .svw-hm-txt.is-r1,
html body:not(#v#v) section.svw .svw-svg .svw-hm-txt.is-r2 { fill: var(--svw-ink); }
html body:not(#v#v) section.svw .svw-svg .svw-cell.is-hover .svw-hm { stroke: var(--svw-y); stroke-width: 2.5px; }

/* animation d'entrée (1er rendu de chaque carte) — non conditionnée (choix du propriétaire) */
html body:not(#v#v) section.svw .is-anim .svw-svg .svw-bar { transform-box: fill-box; animation: svw-grow-y .62s cubic-bezier(.2, .8, .2, 1) both; }
html body:not(#v#v) section.svw .is-anim .svw-svg .svw-bar.is-v { transform-origin: 50% 100%; }
html body:not(#v#v) section.svw .is-anim .svw-svg .svw-bar.is-h { transform-origin: 0 50%; animation-name: svw-grow-x; }
html body:not(#v#v) section.svw .is-anim .svw-svg .svw-gauge-val { animation: svw-fade .7s ease-out both; }
html body:not(#v#v) section.svw .is-anim .svw-svg .svw-dotg { animation: svw-fade .5s ease-out both .15s; }
@keyframes svw-grow-y { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@keyframes svw-grow-x { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes svw-fade { from { opacity: 0; } to { opacity: 1; } }

/* Interaction : hits transparents au-dessus, bandes de surbrillance SOUS les marques */
html body:not(#v#v) section.svw .svw-svg .svw-hits .svw-hit { fill: transparent !important; fill-opacity: 0 !important; stroke: none !important; opacity: 0 !important; pointer-events: all; cursor: default; }
html body:not(#v#v) section.svw .svw-svg .svw-band { fill: transparent; stroke: none; pointer-events: none; }
html body:not(#v#v) section.svw .svw-svg .svw-band.is-hover { fill: var(--svw-y-soft); }
html body:not(#v#v) section.svw .svw-svg.has-hover .svw-col:not(.is-hover) .svw-bar { opacity: .6; }
html body:not(#v#v) section.svw .svw-svg .svw-row.is-hover .svw-label,
html body:not(#v#v) section.svw .svw-svg .svw-row.is-hover .svw-sublabel { fill: var(--svw-ink); }
html body:not(#v#v) section.svw .svw-svg .svw-run.is-hover .svw-bar { filter: url(#svw-f-depth) brightness(1.15); }
html body:not(#v#v) section.svw .svw-svg .svw-col.is-hover .svw-dot { stroke: var(--svw-acc); stroke-width: 2px; }
html body:not(#v#v) section.svw .svw-svg.is-explorable:focus { outline: none; }
html body:not(#v#v) section.svw .svw-svg.is-explorable:focus-visible { outline: 2px solid var(--svw-acc) !important; outline-offset: 4px !important; border-radius: 4px; }

/* brossage (TIMELINE) */
html body:not(#v#v) section.svw .svw-svg.svw-brushable { touch-action: pan-y; user-select: none; -webkit-user-select: none; }
html body:not(#v#v) section.svw .svw-svg.svw-brushable .svw-hits .svw-hit { cursor: crosshair; }
html body:not(#v#v) section.svw .svw-svg .svw-brush { fill: transparent; stroke: none; pointer-events: none; }
html body:not(#v#v) section.svw .svw-svg .svw-brush.is-on { fill: var(--svw-y-soft); stroke: var(--svw-y-2); stroke-width: 1.5px; stroke-dasharray: 5 3; }
html body:not(#v#v) section.svw .svw-svg.has-sel .svw-band.is-hover { fill: rgba(240, 180, 0, .18); }
html body:not(#v#v) section.svw .svw-svg .svw-col.is-out .svw-bar,
html body:not(#v#v) section.svw .svw-svg .svw-col.is-out .svw-dotg { opacity: .22; transition: opacity .2s var(--svw-ease); }
html body:not(#v#v) section.svw .svw-svg.has-hover.has-sel .svw-col.is-out:not(.is-hover) .svw-bar { opacity: .22; }
html body:not(#v#v) section.svw .svw-brushbar {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: 12px 0 0; padding: 10px 12px;
  background: var(--svw-bg-2); border: 1px solid var(--svw-line); border-radius: var(--r, 12px);
}
html body:not(#v#v) section.svw.is-brushed .svw-brushbar { background: var(--svw-y-soft); border-color: var(--svw-y-line); }
html body:not(#v#v) section.svw .svw-brush-status { flex: 1 1 260px; margin: 0; color: var(--svw-ink-2); font: 400 13px/1.45 var(--svw-sans); }
html body:not(#v#v) section.svw.is-brushed .svw-brush-status { color: var(--svw-y-ink); font-weight: 600; }

/* ── Légendes ────────────────────────────────────────────────────────────── */
html body:not(#v#v) section.svw .svw-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 0 0 8px; color: var(--svw-ink-2); font: 400 12.5px/1.4 var(--svw-sans); }
html body:not(#v#v) section.svw .svw-legend > span { display: inline-flex; align-items: center; gap: 6px; }
html body:not(#v#v) section.svw .svw-key { display: inline-block; width: 12px; height: 10px; border-radius: 3px; background: var(--svw-acc); flex: none; }
html body:not(#v#v) section.svw .svw-key.is-ko { background: repeating-linear-gradient(45deg, var(--svw-err) 0 3px, #E9928A 3px 5px); }
html body:not(#v#v) section.svw .svw-key.is-unknown { background: var(--svw-acc); opacity: .55; }
html body:not(#v#v) section.svw .svw-key.is-idle { background: repeating-linear-gradient(-45deg, var(--svw-bg-3) 0 4px, var(--svw-line-2) 4px 5px); border: 1px solid var(--svw-line-2); }
html body:not(#v#v) section.svw .svw-key.is-thr { width: 3px; height: 14px; border-radius: 2px; background: var(--svw-y-2); }
html body:not(#v#v) section.svw .svw-key.is-med { width: 14px; height: 3px; border-radius: 2px; background: var(--svw-y-2); }
html body:not(#v#v) section.svw .svw-key.is-good { background: var(--svw-ok-soft); border: 1px solid var(--svw-ok-line); }
html body:not(#v#v) section.svw .svw-key.is-bad { background: var(--svw-err-soft); border: 1px solid var(--svw-err-line); }
html body:not(#v#v) section.svw .svw-scale { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0 0 8px; font: 400 12px/1.3 var(--svw-mono); color: var(--svw-muted); }
html body:not(#v#v) section.svw .svw-scale-bar { display: inline-flex; gap: 2px; }
html body:not(#v#v) section.svw .svw-scale-bar > i { display: block; width: 22px; height: 10px; border-radius: 3px; }
html body:not(#v#v) section.svw .svw-scale-bar > i.is-r0 { background: var(--svw-err); }
html body:not(#v#v) section.svw .svw-scale-bar > i.is-r1 { background: #E08A7F; }
html body:not(#v#v) section.svw .svw-scale-bar > i.is-r2 { background: #D9D6C9; }
html body:not(#v#v) section.svw .svw-scale-bar > i.is-r3 { background: #6E86C2; }
html body:not(#v#v) section.svw .svw-scale-bar > i.is-r4 { background: var(--svw-acc); }
html body:not(#v#v) section.svw .svw-scale-l.is-empty { margin-left: auto; font-family: var(--svw-serif); font-style: italic; }

/* ── Statistiques & sources ──────────────────────────────────────────────── */
html body:not(#v#v) section.svw .svw-stats { display: flex; flex-wrap: wrap; gap: 6px 20px; margin: 8px 0 0; padding: 8px 0 0; border-top: 1px solid var(--svw-line); }
html body:not(#v#v) section.svw .svw-stat { display: flex; align-items: baseline; gap: 6px; margin: 0; }
html body:not(#v#v) section.svw .svw-stat dt { margin: 0; color: var(--svw-muted); font: 400 12px var(--svw-sans); }
html body:not(#v#v) section.svw .svw-stat dd { margin: 0; color: var(--svw-ink); font: 600 12.5px var(--svw-mono); font-variant-numeric: tabular-nums slashed-zero; }
html body:not(#v#v) section.svw .svw-src { margin: 6px 0 0; color: var(--svw-muted); font: italic 400 13px/1.5 var(--svw-serif); }

/* ── Tableau de données (repli accessible) ───────────────────────────────── */
html body:not(#v#v) section.svw .svw-details { margin-top: 8px; }
html body:not(#v#v) section.svw .svw-details > summary {
  display: inline-flex; align-items: center; gap: 6px; min-height: 28px; padding: 0 2px;
  cursor: pointer; color: var(--svw-acc); font: 600 12.5px var(--svw-sans); list-style: none; border-radius: var(--svw-r-sm);
}
html body:not(#v#v) section.svw .svw-details > summary::-webkit-details-marker { display: none; }
html body:not(#v#v) section.svw .svw-details > summary::before { content: '▸'; font-size: 10px; color: var(--svw-muted); transition: transform .14s var(--svw-ease); }
html body:not(#v#v) section.svw .svw-details[open] > summary::before { transform: rotate(90deg); }
html body:not(#v#v) section.svw .svw-table-wrap { max-height: 300px; overflow: auto; margin-top: 4px; border-radius: var(--r, 12px); }
html body:not(#v#v) section.svw .svw-table {
  width: 100%; border-collapse: separate; border-spacing: 0; font-size: 12.5px;
  background: #fff; border: 1px solid var(--svw-line); border-radius: var(--r, 12px);
}
html body:not(#v#v) section.svw .svw-table caption { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
html body:not(#v#v) section.svw .svw-table :is(th, td) { padding: 7px 10px; border: 0; border-bottom: 1px solid var(--svw-line); text-align: left; color: var(--svw-ink-2); font-weight: 400; background: none; }
html body:not(#v#v) section.svw .svw-table thead th {
  position: sticky; top: 0; z-index: 1; background: linear-gradient(180deg, #fff, var(--svw-bg-2)); color: var(--svw-acc);
  font: 700 11px/1.3 var(--svw-sans); letter-spacing: .07em; text-transform: uppercase; border-bottom-color: var(--svw-line-2);
}
html body:not(#v#v) section.svw .svw-table tbody th { color: var(--svw-ink); }
html body:not(#v#v) section.svw .svw-table .svw-num { text-align: right; font-family: var(--svw-mono); font-variant-numeric: tabular-nums slashed-zero; white-space: nowrap; }
html body:not(#v#v) section.svw .svw-table tbody tr:hover > * { background: var(--svw-y-soft); }

/* ── États ───────────────────────────────────────────────────────────────── */
html body:not(#v#v) section.svw .svw-msg { margin: 0; padding: 14px 16px; border-radius: var(--r, 12px); color: var(--svw-ink-2); font: 400 13.5px/1.55 var(--svw-sans); }
html body:not(#v#v) section.svw .is-empty .svw-msg { background: var(--svw-bg-2); border: 1px dashed var(--svw-line-2); color: var(--svw-muted); text-align: center; font-family: var(--svw-serif); font-style: italic; }
html body:not(#v#v) section.svw .is-error .svw-msg { background: var(--svw-err-soft); border: 1px solid var(--svw-err-line); color: #7A271A; }
html body:not(#v#v) section.svw .is-error .svw-msg::before { content: 'Erreur — '; color: var(--svw-err); font-weight: 700; }
html body:not(#v#v) section.svw .svw-vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; padding: 0; }
html body:not(#v#v) section.svw .svw-skel { display: grid; gap: 10px; padding: 8px 0; }
html body:not(#v#v) section.svw .svw-skel > span {
  display: block; height: 12px; border-radius: 4px;
  background: linear-gradient(90deg, var(--svw-bg-3), var(--svw-bg-2), var(--svw-bg-3)); background-size: 200% 100%;
  animation: svw-skel 1.4s linear infinite;
}
html body:not(#v#v) section.svw .svw-skel > span:nth-child(1) { width: 92%; }
html body:not(#v#v) section.svw .svw-skel > span:nth-child(2) { width: 74%; }
html body:not(#v#v) section.svw .svw-skel > span:nth-child(3) { width: 58%; }
html body:not(#v#v) section.svw .svw-skel > span:nth-child(4) { width: 36%; }
@keyframes svw-skel { from { background-position: 200% 0; } to { background-position: 0 0; } }

/* ── Petits écrans ───────────────────────────────────────────────────────── */
@container svw (max-width: 479.98px) {
  html body:not(#v#v) section.svw .svw-head-r { width: 100%; justify-content: space-between; }
  html body:not(#v#v) section.svw .svw-card { padding: 12px; }
  html body:not(#v#v) section.svw .svw-scale-l.is-empty { margin-left: 0; width: 100%; }
}

/* ── Infobulle (dans <body>) ─────────────────────────────────────────────── */
#sciviews-tip.svw-tip {
  box-sizing: border-box;
  position: fixed; left: 0; top: 0; z-index: 9000;
  max-width: min(320px, calc(100vw - 16px));
  padding: 10px 12px;
  background: var(--c-acc, #0B1F4D);
  color: #fff;
  border: 0;
  border-radius: var(--r, 12px);
  box-shadow: var(--sh-pop, 0 4px 8px -2px rgba(11,31,77,.08), 0 18px 40px -10px rgba(11,31,77,.22));
  font: 400 12.5px/1.45 var(--f-sans, 'IBM Plex Sans', system-ui, sans-serif);
  font-variant-numeric: tabular-nums slashed-zero;
  pointer-events: none;
  opacity: 0; visibility: hidden;
  will-change: transform;
}
#sciviews-tip.svw-tip.is-on { opacity: 1; visibility: visible; }
#sciviews-tip .svw-tip-h { color: var(--c-y, #FFC400); font-weight: 600; margin-bottom: 2px; overflow-wrap: anywhere; }
#sciviews-tip .svw-tip-l { color: var(--c-navy-ink, #C9D4EC); font-family: var(--f-mono, 'IBM Plex Mono', ui-monospace, monospace); font-size: 11.5px; overflow-wrap: anywhere; }
html body.immersive-mode #sciviews-tip { display: none !important; }

/* ── Contraste forcé / impression ────────────────────────────────────────── */
@media (forced-colors: active) {
  html body:not(#v#v) section.svw .svw-svg :is(.svw-mark, .svw-dot, .svw-hm) { fill: CanvasText !important; }
  html body:not(#v#v) section.svw .svw-svg .svw-thr { stroke: Highlight !important; }
  html body:not(#v#v) section.svw .svw-card { border: 1px solid CanvasText; }
}
@media print {
  html body:not(#v#v) section.svw :is(.svw-btn, .svw-toggle, .svw-brushbar) { display: none !important; }
  #sciviews-tip { display: none !important; }
  html body:not(#v#v) section.svw .svw-card { break-inside: avoid; box-shadow: none; }
}

/* ==== 96-icons.css ==== */
/* ============================================================================
   SCI-AUTONOME · 96-icons.css   (CARNET / concept B)
   Habillage des icônes SVG injectées par 96-icons.js.
   Chargé APRÈS toutes les autres couches. Aucune dépendance externe.

   Deux variantes, calquées sur les « ic-chip » du site principal
   (triplet RGB --cc + fond teinté doux + trait coloré) :
     .sci-ic    → icône trait, couleur = texte courant (ou --cc), inline.
     .sci-chip  → icône trait dans une pastille arrondie teintée (--cc).

   Le JS pose --cc (triplet r,g,b) et, au besoin, une classe sémantique
   (--ok/--warn/--err/--acc) ou de domaine (--med/--cyber/--tech/--phy/--cross).
   ========================================================================== */

:root {
  /* triplets RGB (couleurs CARNET) — servent de teintes aux pastilles/traits */
  --sci-cc-acc:   11,31,77;     /* marine primaire  #0B1F4D */
  --sci-cc-ink:   44,46,51;     /* encre 2          #2C2E33 */
  --sci-cc-muted: 90,92,100;    /* libellé          #5A5C64 */
  --sci-cc-ok:    6,118,71;     /* succès           #067647 */
  --sci-cc-warn:  181,71,8;     /* attention        #B54708 */
  --sci-cc-err:   180,35,24;    /* erreur           #B42318 */
  --sci-cc-y:     90,65,0;      /* jaune encré      #5A4100 (jamais le jaune pur sur blanc) */
  --sci-cc-med:   14,111,140;   /* médical          #0E6F8C */
  --sci-cc-cyber: 179,19,95;    /* cyber            #B3135F */
  --sci-cc-tech:  185,71,12;    /* tech & IA        #B9470C */
  --sci-cc-phy:   27,122,62;    /* physique         #1B7A3E */
  --sci-cc-cross: 105,56,239;   /* convergence      #6938EF */

  --sci-ic-stroke: 1.75;
  --sci-ease: cubic-bezier(.2,.8,.2,1);
}

/* ─── 1. Icône trait inline ──────────────────────────────────────────────── */
html body .sci-ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: -0.16em;                 /* aligne sur la ligne de base du texte */
  width: 1.1em;
  height: 1.1em;
  flex: 0 0 auto;
  line-height: 0;
  color: inherit;                          /* suit la couleur du texte par défaut */
}
html body .sci-ic > svg {
  width: 100%;
  height: 100%;
  display: block;
  stroke: currentColor;
  fill: none;
  overflow: visible;
}
/* teintes sémantiques (icône trait colorée, lisible sur blanc) */
html body .sci-ic.sci-ic--ok    { color: rgb(var(--sci-cc-ok)); }
html body .sci-ic.sci-ic--warn  { color: rgb(var(--sci-cc-warn)); }
html body .sci-ic.sci-ic--err   { color: rgb(var(--sci-cc-err)); }
html body .sci-ic.sci-ic--acc   { color: rgb(var(--sci-cc-acc)); }
html body .sci-ic.sci-ic--y     { color: rgb(var(--sci-cc-y)); }
html body .sci-ic.sci-ic--med   { color: rgb(var(--sci-cc-med)); }
html body .sci-ic.sci-ic--cyber { color: rgb(var(--sci-cc-cyber)); }
html body .sci-ic.sci-ic--tech  { color: rgb(var(--sci-cc-tech)); }
html body .sci-ic.sci-ic--phy   { color: rgb(var(--sci-cc-phy)); }
html body .sci-ic.sci-ic--cross { color: rgb(var(--sci-cc-cross)); }

/* légère emphase quand l'icône est le SEUL contenu d'un bouton (cursor etc.) */
html body button > .sci-ic:only-child { vertical-align: middle; width: 1.15em; height: 1.15em; }

/* ─── 2. Pastille (chip) : icône trait + fond teinté doux + anneau ───────── */
html body .sci-chip {
  --cc: var(--sci-cc-acc);
  --sci-chip-size: 28px;
  --sci-chip-icon: 17px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--sci-chip-size);
  height: var(--sci-chip-size);
  min-width: var(--sci-chip-size);
  flex: 0 0 auto;
  border-radius: 9px;
  vertical-align: middle;
  line-height: 0;
  color: rgb(var(--cc));
  background:
    linear-gradient(0deg, rgba(var(--cc), .12), rgba(var(--cc), .12)),
    #ffffff;
  box-shadow: inset 0 0 0 1px rgba(var(--cc), .28);
  transition: background-color .2s var(--sci-ease),
              box-shadow .2s var(--sci-ease),
              transform .2s var(--sci-ease);
}
html body .sci-chip > svg {
  width: var(--sci-chip-icon);
  height: var(--sci-chip-icon);
  display: block;
  stroke: currentColor;
  fill: none;
  overflow: visible;
}
html body .sci-chip.sci-chip--sm { --sci-chip-size: 22px; --sci-chip-icon: 14px; border-radius: 7px; }
html body .sci-chip.sci-chip--lg { --sci-chip-size: 36px; --sci-chip-icon: 21px; border-radius: 11px; }

/* teintes de pastille */
html body .sci-chip.sci-chip--acc   { --cc: var(--sci-cc-acc); }
html body .sci-chip.sci-chip--ok    { --cc: var(--sci-cc-ok); }
html body .sci-chip.sci-chip--warn  { --cc: var(--sci-cc-warn); }
html body .sci-chip.sci-chip--err   { --cc: var(--sci-cc-err); }
html body .sci-chip.sci-chip--y     { --cc: var(--sci-cc-y); }
html body .sci-chip.sci-chip--med   { --cc: var(--sci-cc-med); }
html body .sci-chip.sci-chip--cyber { --cc: var(--sci-cc-cyber); }
html body .sci-chip.sci-chip--tech  { --cc: var(--sci-cc-tech); }
html body .sci-chip.sci-chip--phy   { --cc: var(--sci-cc-phy); }
html body .sci-chip.sci-chip--cross { --cc: var(--sci-cc-cross); }

/* survol des pastilles (quand dans un contrôle cliquable) */
html body a:hover > .sci-chip,
html body button:hover > .sci-chip,
html body .domain-tab:hover .sci-chip,
html body .tab:hover .sci-chip,
html body .report-dtab:hover .sci-chip {
  background: linear-gradient(0deg, rgba(var(--cc), .18), rgba(var(--cc), .18)), #ffffff;
  box-shadow: inset 0 0 0 1px rgba(var(--cc), .42);
  transform: translateY(-1px);
}

/* ─── 3. Intégrations ciblées (places prominentes) ───────────────────────── */

/* onglet de domaine : la pastille remplace l'emoji .domain-icon (déjà 28px rond) */
html body .domain-bar .domain-tab .domain-icon .sci-ic,
html body .domain-bar .domain-tab .domain-icon .sci-chip { vertical-align: middle; }
/* domaine actif (bandeau marine) : pastille blanche, icône marine bien lisible */
html body .domain-bar .domain-tab[class*="active-"] .sci-chip {
  background: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(var(--cc), .20);
}

/* carte domaine actif (colonne droite) : grande pastille */
html body #adc-icon .sci-chip { --sci-chip-size: 40px; --sci-chip-icon: 23px; border-radius: 12px; }
html body #adc-icon { font-size: 0 !important; }   /* neutralise tout emoji résiduel */

/* barre d'onglets principale : icône trait marine devant le libellé */
html body main.center-panel .tab-nav .tab .sci-ic { margin-right: 6px; color: rgb(var(--sci-cc-acc)); }
html body main.center-panel .tab-nav .tab.active .sci-ic { color: inherit; }

/* badges de rapport / domaine : petite pastille alignée au texte */
html body .md-badge .sci-ic,
html body .report-domain-badge .sci-ic,
html body .report-dtab .sci-ic { margin-right: 5px; vertical-align: -0.12em; }

/* cartes KPI du tableau de bord : libellé de domaine */
html body .dom-card .dom-label .sci-ic { margin-right: 5px; }

/* étapes du pipeline (aide) : médaillon .ps-num */
html body .phase-step .ps-num .sci-ic { width: 1.25em; height: 1.25em; }

/* cartes « fonctionnalités » de l'aide : grande icône trait centrée */
html body .help-popup .feature-icon { font-size: 0 !important; }
html body .help-popup .feature-icon .sci-ic { width: 24px; height: 24px; color: rgb(var(--sci-cc-acc)); }

/* médaillons des petites modales (sco/imo/cmo) : icône trait dans le rond */
html body .sco-icon, html body .imo-icon, html body .cmo-icon { font-size: 0 !important; }
html body .sco-icon .sci-ic, html body .imo-icon .sci-ic, html body .cmo-icon .sci-ic {
  width: 34px; height: 34px; color: rgb(var(--sci-cc-acc));
}

/* en-tête : cloche de notification */
html body header .notif-icon { font-size: 0 !important; }
html body header .notif-icon .sci-ic { width: 16px; height: 16px; color: #ffffff; }

/* lignes de log / fil d'activité : icône trait discrète, taille du texte */
html body .log-line .sci-ic,
html body #live-feed .sci-ic { width: 1em; height: 1em; vertical-align: -0.14em; }

/* réduction densité sur petits écrans */
@media (max-width: 1100px) {
  html body .sci-chip { --sci-chip-size: 26px; --sci-chip-icon: 16px; }
  html body #adc-icon .sci-chip { --sci-chip-size: 36px; --sci-chip-icon: 21px; }
}
@media (max-width: 768px) {
  html body .sci-chip { --sci-chip-size: 24px; --sci-chip-icon: 15px; border-radius: 8px; }
}

/* accessibilité : pas d'animation si l'utilisateur la refuse */
@media (prefers-reduced-motion: reduce) {
  html body .sci-chip { transition: none; }
}

/* ==== 97-graph.css ==== */
/* ═══════════════════════════════════════════════════════════════════════════
   SCI-AUTONOME — 97-graph.css — vue « Graphe de connaissances » (SCIGRAPH)
   Portée stricte : #scigraph (créé par 97-graph.js dans #tab-graph).
   Thème B « Carnet » : feuille blanche, marine, encre, jaune signal.
   Le canvas / la barre / la légende d'origine restent dans le DOM (le code de
   l'app continue de tourner) mais sont masqués via le sélecteur frère
   `#scigraph ~ …` — aucun nœud de l'app n'est modifié.
   Le préfixe « html body:not(#sg#sg#sg) » (3 ID) ne sert qu'à surclasser les
   règles !important des couches 20/70/80 (planches sombres, champs, tableaux).
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── 0. Masquage visuel des éléments d'origine (restent dans le DOM) ────── */
html body:not(#sg#sg#sg) #tab-graph > #scigraph ~ .graph-controls,
html body:not(#sg#sg#sg) #tab-graph > #scigraph ~ #graphCanvas,
html body:not(#sg#sg#sg) #tab-graph > #scigraph ~ #graph-legend {
  position: absolute !important; left: 0 !important; top: 0 !important;
  width: 1px !important; height: 1px !important; min-width: 0 !important; min-height: 0 !important;
  margin: 0 !important; padding: 0 !important; border: 0 !important;
  overflow: hidden !important; clip-path: inset(50%) !important; clip: rect(0 0 0 0) !important;
  opacity: 0 !important; visibility: hidden !important; pointer-events: none !important;
  box-shadow: none !important; animation: none !important; transition: none !important;
}

/* ── 1. Jetons locaux ────────────────────────────────────────────────── */
#scigraph.sg {
  --sg-bg: var(--c-1, #FFFFFF);
  --sg-bg-2: var(--c-2, #F9F9F6);
  --sg-bg-3: var(--c-3, #F0F0EB);
  --sg-line: var(--c-line, #E7E6E0);
  --sg-line-2: var(--c-line-2, #D3D2CA);
  --sg-ink: var(--c-text, #0B0C0E);
  --sg-ink-2: var(--c-text-2, #2C2E33);
  --sg-muted: var(--c-muted, #5A5C64);
  --sg-faint: var(--c-faint, #74767E);
  --sg-acc: var(--c-acc, #0B1F4D);
  --sg-acc-2: var(--c-acc-2, #17327A);
  --sg-acc-soft: var(--c-acc-soft, #EEF1F8);
  --sg-acc-line: var(--c-acc-line, #B9C4DD);
  --sg-navy-ink: var(--c-navy-ink, #C9D4EC);
  --sg-y: var(--c-y, #FFC400);
  --sg-y-soft: var(--c-y-soft, #FFF6CC);
  --sg-y-line: var(--c-y-line, #F5D66B);
  --sg-y-ink: var(--c-y-ink, #5A4100);
  --sg-sans: var(--f-sans, 'IBM Plex Sans', -apple-system, 'Segoe UI', Roboto, sans-serif);
  --sg-mono: var(--f-mono, 'IBM Plex Mono', ui-monospace, Menlo, monospace);
  --sg-serif: var(--f-serif, 'Source Serif 4', Charter, Georgia, serif);
  --sg-sh-1: var(--sh-1, 0 1px 2px rgba(11,31,77,.05));
  --sg-sh-2: var(--sh-2, 0 1px 2px rgba(11,31,77,.05), 0 8px 20px -12px rgba(11,31,77,.10));
  --sg-sh-pop: var(--sh-pop, 0 4px 8px -2px rgba(11,31,77,.08), 0 18px 40px -10px rgba(11,31,77,.22));
  --sg-navy: var(--g-navy, linear-gradient(135deg, #0F2A63 0%, #0B1F4D 48%, #081638 100%));
  --sg-ease: var(--ease, cubic-bezier(.2,.8,.2,1));
  --sg-panel-w: min(340px, 42%);

  container: sg / inline-size;
  position: relative;
  display: block;
  background: var(--sg-bg);
  color: var(--sg-ink-2);
  font: 400 13.5px/1.45 var(--sg-sans);
  border: 1px solid var(--sg-line);
  border-radius: var(--r-xl, 16px);
  box-shadow: var(--sg-sh-2), var(--bevel, inset 0 1px 0 rgba(255,255,255,.9));
  overflow: hidden;
  isolation: isolate;
  -webkit-font-smoothing: antialiased;
}
#scigraph.sg *, #scigraph.sg *::before, #scigraph.sg *::after { box-sizing: border-box; }
#scigraph .sg-ic { width: 16px; height: 16px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
#scigraph [hidden] { display: none !important; }
#scigraph .sg-sr, #scigraph .sg-vh {
  position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}

/* ── 2. Barre d'outils ───────────────────────────────────────────────── */
#scigraph .sg-bar {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px;
  padding: 10px 12px;
  background: var(--sg-bg-2);
  border-bottom: 1px solid var(--sg-line);
  position: relative; z-index: 30;
}
#scigraph .sg-grp { display: inline-flex; align-items: center; gap: 6px; }
#scigraph .sg-grp + .sg-grp { padding-left: 10px; border-left: 1px solid var(--sg-line); }

#scigraph .sg-btn {
  position: relative;
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-width: 36px; height: 36px; padding: 0 10px; margin: 0;
  font: 600 12.5px/1 var(--sg-sans); letter-spacing: .01em; color: var(--sg-ink-2);
  background: var(--sg-bg); border: 1px solid var(--sg-line-2); border-radius: var(--r-md, 10px);
  box-shadow: var(--sg-sh-1);
  cursor: pointer; user-select: none; -webkit-user-select: none;
  transition: background-color .14s var(--sg-ease), border-color .14s var(--sg-ease), color .14s var(--sg-ease), transform .14s var(--sg-ease), box-shadow .14s var(--sg-ease);
}
#scigraph .sg-btn:hover { background: var(--sg-bg-2); border-color: var(--sg-faint); color: var(--sg-ink); }
#scigraph .sg-btn:active { transform: scale(.97); }
#scigraph .sg-btn[aria-pressed="true"] { background: var(--sg-acc); border-color: var(--sg-acc); color: #fff; }
#scigraph .sg-btn.is-on { background: var(--sg-acc-soft); border-color: var(--sg-acc-line); color: var(--sg-acc); }
#scigraph .sg-btn[aria-expanded="true"] { background: var(--sg-acc); border-color: var(--sg-acc); color: #fff; }
#scigraph .sg-badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 18px; height: 18px; padding: 0 5px; margin-left: 2px;
  font: 700 11px/1 var(--sg-mono); color: var(--sg-acc); background: var(--sg-y); border-radius: 999px;
}
#scigraph button:focus-visible, #scigraph select:focus-visible, #scigraph summary:focus-visible, #scigraph input:focus-visible {
  outline: 2px solid var(--sg-acc) !important; outline-offset: 2px !important;
}

/* recherche (combobox) */
#scigraph .sg-search { position: relative; flex: 1 1 240px; min-width: 200px; max-width: 400px; }
#scigraph .sg-search > .sg-ic { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: var(--sg-muted); pointer-events: none; z-index: 1; }
html body:not(#sg#sg#sg) #scigraph .sg-search-in {
  width: 100% !important; height: 36px !important; min-height: 36px !important; margin: 0 !important;
  padding: 0 12px 0 34px !important;
  font: 400 13.5px/1 var(--sg-sans) !important; color: var(--sg-ink) !important;
  background: var(--sg-bg) !important; border: 1px solid var(--sg-line-2) !important;
  border-radius: var(--r-md, 10px) !important; box-shadow: var(--sg-sh-1) !important;
  -webkit-appearance: none; appearance: none;
}
html body:not(#sg#sg#sg) #scigraph .sg-search-in:focus { border-color: var(--sg-acc) !important; box-shadow: 0 0 0 3px rgba(255,196,0,.5) !important; outline: none !important; }
#scigraph .sg-search-in::-webkit-search-cancel-button { cursor: pointer; }
#scigraph .sg-list {
  position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 40;
  margin: 0; padding: 4px; list-style: none;
  max-height: 320px; overflow: auto;
  background: var(--sg-bg); border: 1px solid var(--sg-line); border-radius: var(--r-md, 10px);
  box-shadow: var(--sg-sh-pop);
}
#scigraph .sg-opt {
  display: flex; align-items: center; gap: 9px;
  padding: 8px 10px; border-radius: 7px; cursor: pointer;
  font: 400 13px/1.3 var(--sg-sans); color: var(--sg-ink-2);
}
#scigraph .sg-opt.is-active, #scigraph .sg-opt:hover { background: var(--sg-y-soft); color: var(--sg-ink); }
#scigraph .sg-opt.is-hidden { color: var(--sg-muted); }
#scigraph .sg-opt-empty { cursor: default; color: var(--sg-muted); font-style: italic; }
#scigraph .sg-opt-empty:hover { background: transparent; }
#scigraph .sg-opt-dot { width: 9px; height: 9px; border-radius: 50%; flex: none; box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--sg-line-2); }
#scigraph .sg-opt-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#scigraph .sg-opt-name mark { background: none; color: var(--sg-acc); font-weight: 700; text-decoration: underline; text-decoration-color: var(--sg-y); text-decoration-thickness: 2px; text-underline-offset: 2px; }
#scigraph .sg-opt-meta { flex: none; font: 500 11.5px/1 var(--sg-mono); color: var(--sg-muted); }

/* couleur */
html body:not(#sg#sg#sg) #scigraph .sg-select {
  height: 36px !important; min-height: 36px !important; margin: 0 !important;
  padding: 0 30px 0 11px !important;
  font: 600 12.5px/1 var(--sg-sans) !important; color: var(--sg-ink-2) !important;
  background-color: var(--sg-bg) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235A5C64' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important; background-position: right 9px center !important; background-size: 14px !important;
  border: 1px solid var(--sg-line-2) !important; border-radius: var(--r-md, 10px) !important;
  box-shadow: var(--sg-sh-1) !important; cursor: pointer;
  -webkit-appearance: none; appearance: none;
}
html body:not(#sg#sg#sg) #scigraph .sg-select:hover { border-color: var(--sg-faint) !important; }

#scigraph .sg-stats {
  margin-left: auto; display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 14px;
  font: 400 12px/1.2 var(--sg-mono); color: var(--sg-muted); font-variant-numeric: tabular-nums slashed-zero;
}
#scigraph .sg-st b { font-weight: 600; color: var(--sg-acc); }
#scigraph .sg-st + .sg-st { position: relative; }
#scigraph .sg-st + .sg-st::before { content: ''; position: absolute; left: -8px; top: 50%; width: 3px; height: 3px; border-radius: 50%; background: var(--sg-line-2); transform: translateY(-50%); }

/* ── 3. Scène ────────────────────────────────────────────────────────── */
#scigraph .sg-stage {
  position: relative; height: 620px; min-height: 520px;
  background: var(--sg-bg); overflow: hidden;
}
html body:not(#sg#sg#sg) #tab-graph #scigraph canvas.sg-canvas {
  display: block !important; width: 100%; height: 100%; max-width: none !important;
  margin: 0 !important; padding: 0 !important;
  background: var(--sg-bg) !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
  touch-action: none; cursor: grab; outline: none;
  -webkit-tap-highlight-color: transparent;
}
html body:not(#sg#sg#sg) #tab-graph #scigraph canvas.sg-canvas.is-panning { cursor: grabbing; }
html body:not(#sg#sg#sg) #tab-graph #scigraph canvas.sg-canvas:focus-visible { outline: none !important; box-shadow: inset 0 0 0 2px var(--sg-acc), inset 0 0 0 5px rgba(255,196,0,.55) !important; }

/* légende */
#scigraph .sg-legend {
  position: absolute; top: 12px; left: 12px; z-index: 10;
  width: 244px; max-height: calc(100% - 152px);
  display: flex; flex-direction: column;
  background: rgba(255,255,255,.94);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  border: 1px solid var(--sg-line); border-radius: var(--r, 12px);
  box-shadow: var(--sg-sh-2);
  overflow: hidden;
}
#scigraph .sg-lg-head {
  display: flex; align-items: center; gap: 8px; width: 100%; min-height: 36px;
  padding: 8px 10px; margin: 0; border: 0; background: transparent; cursor: pointer;
  font: 700 11.5px/1 var(--sg-sans); letter-spacing: .08em; text-transform: uppercase; color: var(--sg-acc);
}
#scigraph .sg-lg-head .sg-ic:last-child { margin-left: auto; transition: transform .2s var(--sg-ease); color: var(--sg-muted); }
#scigraph .sg-legend.is-closed .sg-lg-head .sg-ic:last-child { transform: rotate(-90deg); }
#scigraph .sg-legend.is-closed .sg-lg-body { display: none; }
#scigraph .sg-lg-body { padding: 0 8px 10px; overflow: auto; border-top: 1px solid var(--sg-line); }
#scigraph .sg-lg-h {
  margin: 10px 4px 4px; font: 600 11px/1.2 var(--sg-sans); letter-spacing: .07em; text-transform: uppercase; color: var(--sg-muted);
}
#scigraph .sg-lg-list { list-style: none; margin: 0; padding: 0; }
#scigraph .sg-lg-item {
  display: flex; align-items: center; gap: 8px; width: 100%; min-height: 28px;
  padding: 4px 6px; margin: 0; border: 1px solid transparent; border-radius: 7px; background: transparent;
  font: 400 12.5px/1.25 var(--sg-sans); color: var(--sg-ink-2); text-align: left;
}
#scigraph button.sg-lg-item { cursor: pointer; }
#scigraph button.sg-lg-item:hover { background: var(--sg-bg-2); }
#scigraph .sg-lg-item[aria-pressed="true"] { background: var(--sg-y-soft); border-color: var(--sg-y-line); color: var(--sg-ink); }
#scigraph .sg-lg-t { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#scigraph .sg-lg-n { flex: none; font: 500 11.5px/1 var(--sg-mono); color: var(--sg-muted); }
#scigraph .sg-lg-note { margin: 10px 4px 0; font: italic 400 12px/1.4 var(--sg-serif); color: var(--sg-muted); }
#scigraph .sg-sw { display: inline-block; flex: none; width: 10px; height: 10px; border-radius: 50%; box-shadow: 0 0 0 1.5px #fff, 0 0 0 2.5px rgba(11,31,77,.12); vertical-align: middle; }
#scigraph .sg-dot { display: inline-block; flex: none; width: 7px; height: 7px; border-radius: 50%; }
#scigraph .sg-ln { display: inline-block; flex: none; width: 20px; height: 0; border-top: 2.5px solid currentColor; border-radius: 2px; vertical-align: middle; }
#scigraph .sg-ln.is-dash { border-top-style: dashed; }

/* zoom */
#scigraph .sg-zoom {
  position: absolute; right: 12px; bottom: 12px; z-index: 11;
  display: flex; flex-direction: column;
  background: var(--sg-bg); border: 1px solid var(--sg-line-2); border-radius: var(--r-md, 10px);
  box-shadow: var(--sg-sh-2); overflow: hidden;
  transition: right .2s var(--sg-ease);
}
#scigraph .sg-zoom .sg-btn { border: 0; border-radius: 0; box-shadow: none; height: 36px; width: 38px; padding: 0; background: transparent; }
#scigraph .sg-zoom .sg-btn + .sg-btn { border-top: 1px solid var(--sg-line); }
#scigraph .sg-zoom .sg-btn:hover { background: var(--sg-bg-2); }
#scigraph .sg-zoom .sg-btn[aria-pressed="true"] { background: var(--sg-acc-soft); color: var(--sg-acc); }
#scigraph .sg-stage:has(.sg-panel.is-open) .sg-zoom { right: calc(var(--sg-panel-w) + 14px); }

/* mini-carte */
html body:not(#sg#sg#sg) #tab-graph #scigraph canvas.sg-mini {
  position: absolute; left: 12px; bottom: 12px; z-index: 10;
  width: 176px; height: 112px; max-width: none !important;
  background: rgba(255,255,255,.94) !important;
  border: 1px solid var(--sg-line-2) !important; border-radius: var(--r-md, 10px) !important;
  box-shadow: var(--sg-sh-2) !important; cursor: crosshair; touch-action: none;
}

/* aide clavier */
#scigraph .sg-hint {
  position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%); z-index: 9;
  margin: 0; padding: 5px 12px; white-space: nowrap; pointer-events: none;
  font: 400 11.5px/1.3 var(--sg-sans); color: var(--sg-muted);
  background: rgba(255,255,255,.88); border: 1px solid var(--sg-line); border-radius: 999px;
}
#scigraph .sg-hint kbd {
  display: inline-block; padding: 1px 5px; margin: 0 1px;
  font: 500 10.5px/1.3 var(--sg-mono); color: var(--sg-ink-2);
  background: var(--sg-bg-2); border: 1px solid var(--sg-line-2); border-bottom-width: 2px; border-radius: 4px;
}

/* info-bulle : marine, titre jaune */
#scigraph .sg-tip {
  position: absolute; left: 0; top: 0; z-index: 20; pointer-events: none;
  max-width: 300px; padding: 8px 11px;
  background: var(--sg-acc); color: var(--sg-navy-ink);
  border-radius: 8px; box-shadow: var(--sg-sh-pop);
  font: 400 12px/1.4 var(--sg-sans);
}
#scigraph .sg-tip strong { display: block; margin-bottom: 2px; font: 600 13px/1.3 var(--sg-sans); color: var(--sg-y); }
#scigraph .sg-tip span { display: block; }
#scigraph .sg-tip .sg-tip-m { font: 400 11.5px/1.35 var(--sg-mono); color: #fff; opacity: .82; }

/* ── 4. Panneau de détail ────────────────────────────────────────────── */
#scigraph .sg-panel {
  position: absolute; top: 0; right: 0; bottom: 0; z-index: 15;
  width: var(--sg-panel-w);
  display: flex; flex-direction: column;
  background: var(--sg-bg);
  border-left: 1px solid var(--sg-line);
  box-shadow: -14px 0 32px -18px rgba(11,31,77,.28);
  opacity: 0; transform: translateX(18px);
  transition: opacity .2s var(--sg-ease), transform .2s var(--sg-ease);
}
#scigraph .sg-panel.is-open { opacity: 1; transform: none; }
#scigraph .sg-ph {
  position: relative; flex: none;
  padding: 14px 52px 14px 16px;
  background: var(--sg-navy); color: #fff;
  border-bottom: 3px solid var(--sg-y);
}
#scigraph .sg-ph-kick { font: 600 11px/1.2 var(--sg-sans); letter-spacing: .08em; text-transform: uppercase; color: var(--sg-navy-ink); }
#scigraph .sg-ph-title { margin: 5px 0 0; font: 600 19px/1.25 var(--sg-serif); color: #fff; overflow-wrap: anywhere; }
#scigraph .sg-ph-close {
  position: absolute; top: 10px; right: 10px;
  background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.28); color: #fff; box-shadow: none;
}
#scigraph .sg-ph-close:hover { background: rgba(255,255,255,.18); border-color: rgba(255,255,255,.5); color: #fff; }
#scigraph .sg-ph-close:focus-visible { outline-color: var(--sg-y) !important; }
#scigraph .sg-pb { flex: 1; min-height: 0; overflow: auto; padding: 6px 16px 14px; overscroll-behavior: contain; }
#scigraph .sg-kv { margin: 0; }
#scigraph .sg-kv-r { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px dashed var(--sg-line); }
#scigraph .sg-kv dt { font: 400 12.5px/1.3 var(--sg-sans); color: var(--sg-muted); }
#scigraph .sg-kv dd { margin: 0; text-align: right; font: 600 13px/1.3 var(--sg-sans); color: var(--sg-ink); font-variant-numeric: tabular-nums; }
#scigraph .sg-h4 { margin: 16px 0 8px; font: 700 11.5px/1.2 var(--sg-sans); letter-spacing: .08em; text-transform: uppercase; color: var(--sg-muted); }
#scigraph .sg-muted { margin: 0; color: var(--sg-muted); font-size: 13px; }
#scigraph .sg-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
#scigraph .sg-chip {
  display: inline-flex; align-items: center; gap: 6px; max-width: 100%;
  padding: 3px 9px; border-radius: 999px; background: var(--sg-bg-2); border: 1px solid var(--sg-line);
  font: 500 12px/1.3 var(--sg-sans); color: var(--sg-ink-2);
}
#scigraph .sg-chip b { font: 500 11px/1 var(--sg-mono); color: var(--sg-muted); }
#scigraph .sg-chip .sg-ln { width: 14px; }
#scigraph .sg-meter { display: inline-flex; align-items: center; gap: 8px; font: 500 12.5px/1 var(--sg-mono); }
#scigraph .sg-mbar { position: relative; display: inline-block; width: 64px; height: 5px; border-radius: 3px; background: var(--sg-bg-3); overflow: hidden; }
#scigraph .sg-mbar i { position: absolute; left: 0; top: 0; bottom: 0; background: var(--sg-acc); border-radius: 3px; }
#scigraph .sg-nb { list-style: none; margin: 0; padding: 0; }
#scigraph .sg-nb li + li { border-top: 1px solid var(--sg-line); }
#scigraph .sg-nb-b {
  display: grid; grid-template-columns: 22px 1fr auto; align-items: center; gap: 8px;
  width: 100%; padding: 8px 6px; margin: 0; border: 0; border-radius: 8px; background: transparent;
  text-align: left; cursor: pointer; color: var(--sg-ink-2);
  transition: background-color .14s var(--sg-ease);
}
#scigraph .sg-nb-b:hover { background: var(--sg-y-soft); }
#scigraph .sg-nb-b.is-filtered { opacity: .62; }
#scigraph .sg-nb-dir { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 6px; background: var(--sg-acc-soft); color: var(--sg-acc); }
#scigraph .sg-nb-dir .sg-ic { width: 14px; height: 14px; }
#scigraph .sg-nb-main { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
#scigraph .sg-nb-name { display: flex; align-items: center; gap: 6px; font: 600 13px/1.3 var(--sg-sans); color: var(--sg-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#scigraph .sg-nb-name .sg-sw { width: 8px; height: 8px; }
#scigraph .sg-nb-type { font: 500 11.5px/1.2 var(--sg-mono); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#scigraph .sg-nb-conf { display: inline-flex; align-items: center; gap: 6px; font: 500 11.5px/1 var(--sg-mono); color: var(--sg-muted); }
#scigraph .sg-nb-conf .sg-mbar { width: 38px; height: 4px; }
#scigraph .sg-pf { flex: none; display: flex; gap: 8px; padding: 10px 16px; border-top: 1px solid var(--sg-line); background: var(--sg-bg-2); }

#scigraph .sg-act {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-height: 34px; padding: 0 12px; margin: 0;
  font: 600 12.5px/1 var(--sg-sans); color: var(--sg-ink-2);
  background: var(--sg-bg); border: 1px solid var(--sg-line-2); border-radius: 8px; cursor: pointer;
  transition: background-color .14s var(--sg-ease), border-color .14s var(--sg-ease), transform .14s var(--sg-ease);
}
#scigraph .sg-act:hover { background: var(--sg-bg-2); border-color: var(--sg-faint); color: var(--sg-ink); }
#scigraph .sg-act:active { transform: scale(.98); }
#scigraph .sg-act.is-on, #scigraph .sg-act[aria-pressed="true"], #scigraph .sg-act-p { background: var(--sg-acc); border-color: var(--sg-acc); color: #fff; }
#scigraph .sg-act.is-on:hover, #scigraph .sg-act-p:hover { background: var(--sg-acc-2); color: #fff; }
#scigraph .sg-link {
  padding: 0; margin: 0; border: 0; background: none; cursor: pointer;
  font: 600 12.5px/1.3 var(--sg-sans); color: var(--sg-acc); text-decoration: underline; text-decoration-color: var(--sg-acc-line); text-underline-offset: 2px;
}
#scigraph .sg-link:hover { text-decoration-color: var(--sg-y); text-decoration-thickness: 2px; }

/* ── 5. Filtres (popover) ────────────────────────────────────────────── */
#scigraph .sg-pop {
  position: absolute; top: 10px; left: 10px; z-index: 25;
  width: 330px; max-width: calc(100% - 20px); max-height: calc(100% - 20px); overflow: auto;
  padding: 12px 14px;
  background: var(--sg-bg); border: 1px solid var(--sg-line); border-radius: var(--r, 12px);
  box-shadow: var(--sg-sh-pop);
  overscroll-behavior: contain;
}
#scigraph .sg-pop-h { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding-bottom: 10px; margin-bottom: 4px; border-bottom: 1px solid var(--sg-line); }
#scigraph .sg-pop-h strong { font: 600 16px/1.2 var(--sg-serif); color: var(--sg-ink); }
#scigraph .sg-pop-c { font: 400 11.5px/1.2 var(--sg-mono); color: var(--sg-muted); text-align: right; }
#scigraph .sg-f-row { padding: 10px 0 4px; }
#scigraph .sg-f-l { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 6px; font: 600 12.5px/1.2 var(--sg-sans); color: var(--sg-ink-2); }
#scigraph .sg-out { font: 600 12px/1 var(--sg-mono); color: var(--sg-acc); }
html body:not(#sg#sg#sg) #scigraph input[type="range"] {
  width: 100%; height: 24px; margin: 0; padding: 0; background: transparent !important; border: 0 !important; box-shadow: none !important;
  accent-color: var(--sg-acc); cursor: pointer; min-height: 0 !important;
}
#scigraph .sg-f-set { margin: 10px 0 0; padding: 0; border: 0; min-width: 0; }
#scigraph .sg-f-set legend, #scigraph .sg-f-types summary {
  padding: 0; margin-bottom: 4px; font: 600 12.5px/1.2 var(--sg-sans); color: var(--sg-ink-2);
}
#scigraph .sg-f-types { margin-top: 10px; }
#scigraph .sg-f-types summary { cursor: pointer; padding: 6px 0; }
#scigraph .sg-f-tall { display: flex; gap: 14px; padding: 2px 0 6px; }
#scigraph .sg-f-tlist { max-height: 180px; overflow: auto; padding-right: 4px; border-top: 1px solid var(--sg-line); }
#scigraph .sg-f-cb {
  display: flex; align-items: center; gap: 8px; min-height: 30px; padding: 3px 2px;
  font: 400 13px/1.25 var(--sg-sans); color: var(--sg-ink-2); cursor: pointer;
}
#scigraph .sg-f-cb span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#scigraph .sg-f-cb b { flex: none; font: 500 11.5px/1 var(--sg-mono); color: var(--sg-muted); }
#scigraph .sg-f-cb input { width: 16px; height: 16px; margin: 0; flex: none; accent-color: var(--sg-acc); cursor: pointer; }
#scigraph .sg-f-iso { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--sg-line); }
#scigraph .sg-pop-f { display: flex; justify-content: space-between; gap: 8px; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--sg-line); }

/* ── 6. États (chargement / vide / erreur) ───────────────────────────── */
#scigraph .sg-state {
  position: absolute; inset: 0; z-index: 12;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
  padding: 24px; text-align: center;
  background: rgba(255,255,255,.78);
  font: 400 14px/1.45 var(--sg-sans); color: var(--sg-muted);
}
#scigraph .sg-state strong { font: 600 19px/1.3 var(--sg-serif); color: var(--sg-ink); }
#scigraph .sg-state[data-kind="error"] strong { color: var(--c-err, #B42318); }
#scigraph .sg-state .sg-act { margin-top: 6px; }
#scigraph .sg-spin {
  width: 26px; height: 26px; border-radius: 50%;
  border: 2.5px solid var(--sg-bg-3); border-top-color: var(--sg-acc); border-right-color: var(--sg-y);
  animation: sg-spin .9s linear infinite;
}
@keyframes sg-spin { to { transform: rotate(360deg); } }

/* ── 7. Tableau accessible ───────────────────────────────────────────── */
#scigraph .sg-data { border-top: 1px solid var(--sg-line); background: var(--sg-bg-2); }
#scigraph .sg-data > summary {
  padding: 10px 14px; cursor: pointer; list-style-position: inside;
  font: 600 12.5px/1.2 var(--sg-sans); color: var(--sg-acc);
}
#scigraph .sg-table-wrap { max-height: 380px; overflow: auto; margin: 0 12px 12px; border: 1px solid var(--sg-line); border-radius: var(--r-md, 10px); background: var(--sg-bg); }
html body:not(#sg#sg#sg) #scigraph table.sg-table { display: table !important; width: 100%; max-width: none !important; overflow: visible !important; border-collapse: collapse; font: 400 13px/1.35 var(--sg-sans); }
#scigraph .sg-table caption { caption-side: top; text-align: left; padding: 10px 12px; font: italic 400 13px/1.3 var(--sg-serif); color: var(--sg-muted); }
#scigraph .sg-table th, #scigraph .sg-table td { padding: 7px 12px; border-bottom: 1px solid var(--sg-line); text-align: left; vertical-align: middle; color: var(--sg-ink-2); }
#scigraph .sg-table thead th { position: sticky; top: 0; z-index: 1; background: var(--sg-bg-2); font: 600 11.5px/1.2 var(--sg-sans); letter-spacing: .06em; text-transform: uppercase; color: var(--sg-muted); }
#scigraph .sg-table tbody tr:nth-child(even) { background: rgba(11,31,77,.018); }
#scigraph .sg-table tbody tr:hover { background: var(--sg-y-soft); }
#scigraph .sg-table td .sg-sw { width: 8px; height: 8px; margin-right: 6px; }
#scigraph .sg-table .sg-num { text-align: right; font: 500 12.5px/1 var(--sg-mono); font-variant-numeric: tabular-nums; }

/* ── 8. Plein écran ──────────────────────────────────────────────────── */
#scigraph.sg.is-fs { display: flex; flex-direction: column; width: 100%; height: 100%; border-radius: 0; border: 0; margin: 0 !important; }
#scigraph.sg.is-fs .sg-stage { flex: 1 1 auto; height: auto !important; min-height: 0; }
#scigraph.sg.is-fs .sg-data { display: none; }
#scigraph.sg:fullscreen { background: var(--sg-bg); }
#scigraph.sg::backdrop { background: var(--sg-bg); }
#scigraph.sg.sg--fs { position: fixed !important; inset: 0 !important; z-index: 9600 !important; height: 100vh; height: 100dvh; }
html.sg-noscroll, html.sg-noscroll body { overflow: hidden !important; }

/* ── 9. Adaptatif (requêtes de conteneur : la colonne centrale varie) ── */
@container sg (max-width: 1080px) {
  #scigraph .sg-hint { display: none; }
}
@container sg (max-width: 900px) {
  #scigraph .sg-stats { margin-left: 0; width: 100%; order: 10; }
}
@container sg (max-width: 1000px) {
  #scigraph .sg-btn:not(.sg-btn-3d):not([aria-controls]) .sg-btn-t { display: none; }
  #scigraph .sg-search { flex-basis: 180px; }
}
@container sg (max-width: 640px) {
  #scigraph .sg-btn:not(.sg-btn-3d) .sg-btn-t { display: none; }
}
@container sg (max-width: 760px) {
  #scigraph .sg-bar { padding: 8px; gap: 8px; }
  #scigraph .sg-search { flex-basis: 100%; max-width: none; }
  #scigraph .sg-grp + .sg-grp { padding-left: 6px; }
  #scigraph .sg-legend { width: 210px; max-height: calc(100% - 80px); }
  #scigraph canvas.sg-mini { display: none !important; }
  #scigraph .sg-panel {
    top: auto; left: 0; width: auto; height: 62%;
    border-left: 0; border-top: 1px solid var(--sg-line); border-radius: 14px 14px 0 0;
    box-shadow: 0 -14px 32px -18px rgba(11,31,77,.3);
    transform: translateY(24px); overflow: hidden;
  }
  #scigraph .sg-panel.is-open { transform: none; }
  #scigraph .sg-stage:has(.sg-panel.is-open) .sg-zoom { right: 12px; bottom: calc(62% + 12px); }
  #scigraph .sg-pop { width: auto; right: 10px; }
}
@container sg (max-width: 420px) {
  #scigraph .sg-grp + .sg-grp { border-left: 0; padding-left: 0; }
  #scigraph .sg-select { max-width: 170px; }
}

@media (prefers-reduced-motion: reduce) {
  #scigraph *, #scigraph *::before, #scigraph *::after { transition: none !important; animation: none !important; }
  #scigraph .sg-spin { border-top-color: var(--sg-acc); }
}
@media (forced-colors: active) {
  #scigraph .sg-btn, #scigraph .sg-act, #scigraph .sg-legend, #scigraph .sg-panel, #scigraph .sg-pop { border: 1px solid CanvasText; }
  #scigraph .sg-sw, #scigraph .sg-dot { forced-color-adjust: none; }
}
@media print {
  #scigraph .sg-bar, #scigraph .sg-zoom, #scigraph canvas.sg-mini, #scigraph .sg-hint, #scigraph .sg-data { display: none !important; }
}

/* ── 10. Mode 3D (WebGL, optionnel) ──────────────────────────────────── */
html body:not(#sg#sg#sg) #tab-graph #scigraph canvas.sg-canvas3d {
  position: absolute; left: 0; top: 0; z-index: 0; display: block;
  max-width: none !important; margin: 0 !important; padding: 0 !important;
  background: #FFFFFF !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
  pointer-events: none;
}
html body:not(#sg#sg#sg) #tab-graph #scigraph canvas.sg-canvas { position: relative; z-index: 1; }
html body:not(#sg#sg#sg) #tab-graph #scigraph.is-3d canvas.sg-canvas { background: transparent !important; cursor: grab; }
#scigraph.is-3d .sg-stage {
  background: radial-gradient(120% 90% at 50% 40%, #FFFFFF 55%, var(--sg-bg-2) 100%);
}
#scigraph .sg-btn-3d .sg-btn-t { font-family: var(--sg-mono); letter-spacing: .04em; }
#scigraph .sg-btn-3d[aria-pressed="true"] { background: var(--sg-navy); border-color: var(--sg-acc); color: #fff; box-shadow: inset 0 -2px 0 var(--sg-y), var(--sg-sh-1); }
#scigraph.is-3d .sg-zoom [aria-label*="mini-carte"] { display: none; }

/* ==== 98-signature.css ==== */
/* SCI-AUTONOME — 98-signature.css : moments signature « CARNET » (concept B)
 * Planche d'accueil (Fig. 1 illustration 3D · Fig. 2 schéma de procédé), pouls du savoir,
 * inclinaison 3D + reflet spéculaire, transition de profondeur entre vues.
 * Préfixe sci-sig- ; spécificité « html body:not(#s#s#s) » pour passer après 80-signature-B / 90-ux. */

:root {
  --sig-navy: var(--c-acc, #0B1F4D);
  --sig-y: var(--c-y, #FFC400);
  --sig-line: var(--c-line, #E7E6E0);
  --sig-line-2: var(--c-line-2, #D3D2CA);
  --sig-muted: var(--c-muted, #5A5C64);
  --sig-ease: cubic-bezier(.2, .8, .2, 1);
  --sig-ease-out: cubic-bezier(.16, 1, .3, 1);
}

/* ═════════ 1. Planche d'accueil ═════════ */
html body:not(#s#s#s) #sci-sig-hero {
  container: sci-sig-hero / inline-size;
  position: relative; display: grid; gap: clamp(10px, 1vw, 16px);
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.38fr);
  margin: 0 0 clamp(12px, 1.1vw, 18px) !important; padding: 0;
  --sig-px: 0px; --sig-py: 0px; --sig-mx: 50%; --sig-my: 50%;
}
html body:not(#s#s#s) #sci-sig-hero .sci-sig-fig {
  position: relative; margin: 0 !important; min-width: 0;
  display: flex; flex-direction: column;
  background: #fff; border: 1px solid var(--sig-line); border-radius: 12px;
  box-shadow: inset 0 1px 0 #fff, 0 1px 2px rgba(11,31,77,.05), 0 10px 24px -18px rgba(11,31,77,.35);
  overflow: hidden; isolation: isolate;
}
html body:not(#s#s#s) #sci-sig-hero .sci-sig-stage {
  position: relative; height: 172px; overflow: hidden;
  background: linear-gradient(180deg, #fff, #FBFBF8);
  border-bottom: 1px solid var(--sig-line);
}
html body:not(#s#s#s) #sci-sig-hero .sci-sig-stage--flow { height: 172px; display: flex; align-items: center; }
/* papier millimétré (plan arrière, parallaxe inverse) */
html body:not(#s#s#s) #sci-sig-hero .sci-sig-grid {
  position: absolute; inset: -12px; pointer-events: none;
  background:
    radial-gradient(circle, rgba(11,31,77,.16) .7px, transparent 1.1px) 0 0 / 8px 8px,
    linear-gradient(rgba(11,31,77,.045) 1px, transparent 1px) 0 0 / 40px 40px,
    linear-gradient(90deg, rgba(11,31,77,.045) 1px, transparent 1px) 0 0 / 40px 40px;
  -webkit-mask-image: radial-gradient(120% 100% at 50% 50%, #000 40%, transparent 95%);
          mask-image: radial-gradient(120% 100% at 50% 50%, #000 40%, transparent 95%);
  transform: translate3d(var(--sig-px), var(--sig-py), 0);
  transition: transform .6s var(--sig-ease);
}
html body:not(#s#s#s) #sci-sig-hero .sci-sig-illu-cv {
  position: absolute; inset: 0; width: 100%; height: 100%; display: block;
}
/* repères de coupe (planche imprimée) */
html body:not(#s#s#s) #sci-sig-hero .sci-sig-crop { position: absolute; width: 12px; height: 12px; pointer-events: none; border: 0 solid var(--sig-navy); opacity: .55; }
html body:not(#s#s#s) #sci-sig-hero .sci-sig-crop--tl { top: 8px; left: 8px; border-top-width: 1.5px; border-left-width: 1.5px; }
html body:not(#s#s#s) #sci-sig-hero .sci-sig-crop--br { bottom: 8px; right: 8px; border-bottom-width: 1.5px; border-right-width: 1.5px; }
html body:not(#s#s#s) #sci-sig-hero .sci-sig-plate {
  position: absolute; top: 9px; right: 10px; z-index: 2;
  font: 600 10px/1 var(--f-mono, monospace); letter-spacing: .08em; color: var(--sig-navy);
  padding: 4px 7px 4px 16px; border-radius: 999px; background: rgba(255,255,255,.9);
  box-shadow: inset 0 0 0 1px var(--sig-line);
}
html body:not(#s#s#s) #sci-sig-hero .sci-sig-plate::before {
  content: ''; position: absolute; left: 7px; top: 50%; width: 5px; height: 5px; margin-top: -2.5px; border-radius: 1px; background: var(--sig-y);
}
html body:not(#s#s#s) #sci-sig-hero .sci-sig-fig--flow .sci-sig-plate { left: 10px; right: auto; top: auto; bottom: 9px; }
html body:not(#s#s#s) #sci-sig-hero figcaption {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px;
  padding: 9px 14px 10px; min-height: 38px;
  font: 400 italic 13px/1.35 var(--f-serif, Georgia, serif); color: var(--c-text-2, #2C2E33);
}
html body:not(#s#s#s) #sci-sig-hero figcaption b {
  font: 700 11px/1 var(--f-sans, sans-serif); font-style: normal; letter-spacing: .08em; text-transform: uppercase;
  color: var(--sig-navy); padding: 3px 6px; border-radius: 4px; background: var(--c-y-soft, #FFF6CC); box-shadow: inset 0 -2px 0 var(--sig-y);
}
html body:not(#s#s#s) #sci-sig-hero .sci-sig-cap-t { font-style: normal; font-weight: 600; color: var(--c-text, #0B0C0E); }
html body:not(#s#s#s) #sci-sig-hero .sci-sig-cap-s { color: var(--sig-muted); }
html body:not(#s#s#s) #sci-sig-hero .sci-sig-cap-t + .sci-sig-cap-s::before { content: '— '; }
html body:not(#s#s#s) #sci-sig-hero .sci-sig-fig--flow .sci-sig-cap-s { font: 500 12px/1.35 var(--f-mono, monospace); font-style: normal; color: var(--sig-navy); margin-left: auto; }
html body:not(#s#s#s) #sci-sig-hero .sci-sig-fig--flow .sci-sig-cap-t + .sci-sig-cap-s::before { content: none; }
/* reflet spéculaire qui suit le pointeur sur toute la planche */
html body:not(#s#s#s) #sci-sig-hero .sci-sig-sheen {
  position: absolute; inset: 0; pointer-events: none; border-radius: 12px; z-index: 3; opacity: 0;
  background: radial-gradient(420px circle at var(--sig-mx) var(--sig-my), rgba(255,196,0,.09), transparent 60%);
  transition: opacity .4s var(--sig-ease);
}
html body:not(#s#s#s) #sci-sig-hero.sci-sig-lit .sci-sig-sheen { opacity: 1; }

/* ── Fig. 2 : schéma de procédé (SVG) ── */
html body:not(#s#s#s) #sci-sig-hero .sci-sig-flow { position: relative; width: 100%; min-width: 0; overflow: hidden; z-index: 1; }
html body:not(#s#s#s) #sci-sig-hero .sci-sig-flow-svg { max-width: 100%; }
html body:not(#s#s#s) #sci-sig-hero > .sci-sig-fig { max-width: 100%; }
html body:not(#s#s#s) #sci-sig-hero .sci-sig-flow-svg { display: block; overflow: visible; font-family: var(--f-mono, monospace); }
#sci-sig-hero .sci-sig-pipe { fill: none; stroke: var(--sig-line-2); stroke-width: 1.5; }
#sci-sig-hero .sci-sig-flowline { fill: none; stroke: transparent; stroke-width: 2.2; stroke-linecap: round; }
#sci-sig-hero .sci-sig-arw-p { fill: var(--sig-line-2); }
#sci-sig-hero .sci-sig-arw-p.is-y { fill: var(--sig-y); }
#sci-sig-hero .sci-sig-arw-p.is-n { fill: var(--sig-navy); }
#sci-sig-hero .sci-sig-tick { stroke: var(--sig-line-2); stroke-width: 1; }
#sci-sig-hero .sci-sig-lid, #sci-sig-hero .sci-sig-io-t { font: 600 9.5px var(--f-mono, monospace); letter-spacing: .06em; fill: var(--sig-muted); }
#sci-sig-hero :is(.sci-sig-seg, .sci-sig-io).is-done .sci-sig-pipe { stroke: var(--sig-navy); }
#sci-sig-hero :is(.sci-sig-seg, .sci-sig-io).is-done .sci-sig-flowline { stroke: rgba(255,255,255,.95); stroke-width: 1.2; stroke-dasharray: 1.5 9; animation: sci-sig-flow 2.4s linear infinite; }
#sci-sig-hero :is(.sci-sig-seg, .sci-sig-io, .sci-sig-loop).is-flow .sci-sig-pipe { stroke: var(--sig-navy); stroke-width: 2.4; }
#sci-sig-hero :is(.sci-sig-seg, .sci-sig-io, .sci-sig-loop).is-flow .sci-sig-flowline { stroke: var(--sig-y); stroke-dasharray: 5 7; animation: sci-sig-flow .7s linear infinite; }
#sci-sig-hero .sci-sig-seg.is-err .sci-sig-pipe { stroke: var(--c-err, #B42318); stroke-dasharray: 3 3; }
#sci-sig-hero .sci-sig-loop .sci-sig-pipe { stroke-dasharray: 2 4; stroke-width: 1.2; stroke: var(--sig-line-2); }
#sci-sig-hero .sci-sig-loop.is-flow .sci-sig-pipe { stroke-dasharray: none; stroke-width: 1.6; }
#sci-sig-hero .sci-sig-chip { fill: #fff; stroke: var(--sig-line); }
#sci-sig-hero .sci-sig-chip-t { font: 600 9.5px var(--f-mono, monospace); letter-spacing: .08em; fill: var(--sig-muted); }
#sci-sig-hero .sci-sig-loop.is-flow .sci-sig-chip { fill: var(--sig-navy); stroke: var(--sig-navy); }
#sci-sig-hero .sci-sig-loop.is-flow .sci-sig-chip-t { fill: #fff; }
@keyframes sci-sig-flow { to { stroke-dashoffset: -24; } }

/* nœuds (bulles d'instrument) */
#sci-sig-hero .sci-sig-body { fill: #fff; stroke: var(--sig-navy); stroke-width: 1.6; transition: fill .25s, stroke .25s; }
#sci-sig-hero .sci-sig-halo { fill: none; stroke: transparent; stroke-width: 1.6; transform-box: fill-box; transform-origin: center; }
#sci-sig-hero .sci-sig-num { font: 700 13px var(--f-mono, monospace); fill: var(--sig-navy); }
#sci-sig-hero .is-compact .sci-sig-num { font-size: 11.5px; }
#sci-sig-hero .sci-sig-lab { font: 600 11px var(--f-sans, sans-serif); letter-spacing: .01em; fill: var(--c-text, #0B0C0E); }
#sci-sig-hero .sci-sig-st { font: 500 10.5px var(--f-mono, monospace); fill: var(--sig-muted); }
#sci-sig-hero .is-compact .sci-sig-lab { font-size: 10px; }
#sci-sig-hero .is-compact .sci-sig-st { font-size: 9.5px; }
#sci-sig-hero .sci-sig-st.is-hidden { display: none; }
#sci-sig-hero .sci-sig-badge { opacity: 0; transition: opacity .2s; }
#sci-sig-hero .sci-sig-badge circle { stroke: #fff; stroke-width: 1.5; }
#sci-sig-hero .sci-sig-badge path { fill: none; stroke: #fff; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; display: none; }

#sci-sig-hero .sci-sig-node.is-ok .sci-sig-body { fill: var(--c-ok-soft, #E7F6EE); stroke: var(--c-ok, #067647); }
#sci-sig-hero .sci-sig-node.is-ok .sci-sig-num { fill: var(--c-ok, #067647); }
#sci-sig-hero .sci-sig-node.is-ok .sci-sig-badge { opacity: 1; }
#sci-sig-hero .sci-sig-node.is-ok .sci-sig-badge circle { fill: var(--c-ok, #067647); }
#sci-sig-hero .sci-sig-node.is-ok .sci-sig-badge-ok { display: block; }
#sci-sig-hero .sci-sig-node.is-ok .sci-sig-st { fill: var(--c-ok, #067647); }

#sci-sig-hero .sci-sig-node.is-run .sci-sig-body { fill: var(--sig-navy); stroke: var(--sig-navy); }
#sci-sig-hero .sci-sig-node.is-run .sci-sig-num { fill: var(--sig-y); }
#sci-sig-hero .sci-sig-node.is-run .sci-sig-halo { stroke: var(--sig-y); stroke-width: 2.4; stroke-dasharray: 4 5; animation: sci-sig-spin 3s linear infinite; }
#sci-sig-hero .sci-sig-node.is-run .sci-sig-st { fill: var(--sig-navy); font-weight: 700; }
#sci-sig-hero .sci-sig-node.is-run .sci-sig-lab { fill: var(--sig-navy); }

#sci-sig-hero .sci-sig-node.is-err .sci-sig-body { fill: var(--c-err-soft, #FDECEA); stroke: var(--c-err, #B42318); }
#sci-sig-hero .sci-sig-node.is-err .sci-sig-num { fill: var(--c-err, #B42318); }
#sci-sig-hero .sci-sig-node.is-err .sci-sig-badge { opacity: 1; }
#sci-sig-hero .sci-sig-node.is-err .sci-sig-badge circle { fill: var(--c-err, #B42318); }
#sci-sig-hero .sci-sig-node.is-err .sci-sig-badge-err { display: block; }
#sci-sig-hero .sci-sig-node.is-err .sci-sig-st { fill: var(--c-err, #B42318); font-weight: 700; }

#sci-sig-hero .sci-sig-node.is-off .sci-sig-body { fill: url(#sci-sig-hatch); stroke: var(--sig-line-2); stroke-dasharray: 3 2.5; }
#sci-sig-hero .sci-sig-node.is-off :is(.sci-sig-num, .sci-sig-lab) { fill: var(--sig-muted); }
#sci-sig-hero .sci-sig-hatch-l { stroke: var(--sig-line); stroke-width: 2; }
@keyframes sci-sig-spin { to { transform: rotate(360deg); } }
/* transitions d'état : remplissage des conduites, pastille qui « s'enclenche », onde de choc */
#sci-sig-hero .sci-sig-fillline { fill: none; stroke: var(--sig-navy); stroke-width: 1.6; stroke-dasharray: 1 1; stroke-dashoffset: 1; transition: stroke-dashoffset .9s var(--sig-ease-out); }
#sci-sig-hero .sci-sig-seg:is(.is-done, .is-flow) .sci-sig-fillline { stroke-dashoffset: 0; }
#sci-sig-hero .sci-sig-seg.is-flow .sci-sig-fillline { stroke-width: 2.4; }
#sci-sig-hero .sci-sig-core { transform-box: fill-box; transform-origin: center; transition: transform .5s var(--sig-ease-out); }
#sci-sig-hero .sci-sig-node.is-changed .sci-sig-core { animation: sci-sig-pop .7s var(--sig-ease-out); }
#sci-sig-hero .sci-sig-ripple { fill: none; stroke: transparent; stroke-width: 2; transform-box: fill-box; transform-origin: center; opacity: 0; }
#sci-sig-hero .sci-sig-node.is-changed .sci-sig-ripple { stroke: var(--sig-y); animation: sci-sig-ripple 1s var(--sig-ease-out); }
#sci-sig-hero .sci-sig-node.is-changed.is-ok .sci-sig-ripple { stroke: var(--c-ok, #067647); }
#sci-sig-hero .sci-sig-node.is-changed.is-err .sci-sig-ripple { stroke: var(--c-err, #B42318); }
#sci-sig-hero .sci-sig-body { filter: drop-shadow(0 1.5px 1.5px rgba(11,31,77,.22)); }
#sci-sig-hero .sci-sig-gloss { fill: none; stroke: rgba(255,255,255,.75); stroke-width: 1.4; stroke-dasharray: 9 60; stroke-dashoffset: -26; stroke-linecap: round; pointer-events: none; }
#sci-sig-hero .sci-sig-node:is(.is-ok, .is-idle, .is-err) .sci-sig-gloss { stroke: rgba(255,255,255,.95); }
#sci-sig-hero .sci-sig-node.is-run .sci-sig-gloss { stroke: rgba(255,255,255,.28); }
#sci-sig-hero .sci-sig-node.is-off .sci-sig-gloss { display: none; }
#sci-sig-hero .sci-sig-node.is-run .sci-sig-core { animation: sci-sig-breathe 2.4s ease-in-out infinite; }
#sci-sig-hero .sci-sig-node.is-run.is-changed .sci-sig-core { animation: sci-sig-pop .7s var(--sig-ease-out), sci-sig-breathe 2.4s ease-in-out .7s infinite; }
@keyframes sci-sig-pop { 0% { transform: scale(.82); } 55% { transform: scale(1.08); } 100% { transform: scale(1); } }
@keyframes sci-sig-ripple { 0% { opacity: .9; transform: scale(1); } 100% { opacity: 0; transform: scale(2.1); } }
@keyframes sci-sig-breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.05); } }

/* ═════════ 2. Pouls du savoir (bandeau marine) ═════════ */
html body:not(#s#s#s) > header .sci-sig-pulse {
  display: flex; align-items: center; gap: 10px; align-self: stretch;
  margin-left: auto; padding: 0 clamp(10px, 1vw, 16px) 0 0; flex: none;
}
html body:not(#s#s#s) > header .sci-sig-pulse-cv { display: block; width: 112px; height: 38px; }
html body:not(#s#s#s) > header .sci-sig-pulse-k { display: grid; gap: 3px; }
html body:not(#s#s#s) > header .sci-sig-pulse-l { font: 600 10.5px/1 var(--f-sans, sans-serif); letter-spacing: .09em; color: rgba(255,255,255,.72); white-space: nowrap; }
html body:not(#s#s#s) > header .sci-sig-pulse-v { font: 600 18px/1 var(--f-mono, monospace); font-variant-numeric: tabular-nums; color: #fff; }
html body:not(#s#s#s) > header .sci-sig-pulse.is-empty .sci-sig-pulse-v { color: rgba(255,255,255,.6); }
html body:not(#s#s#s) > header .sci-sig-pulse + .header-stats { margin-left: 0 !important; }
@media (max-width: 1240px) { html body:not(#s#s#s) > header .sci-sig-pulse { display: none; } }

/* ═════════ 3. Profondeur : inclinaison 3D + reflet spéculaire + relief ═════════ */
html.sci-sig-tilt-on body:not(#s#s#s) :is(.sci-sig-tilt, .sci-sig-relief) {
  position: relative; isolation: isolate;
  transition: transform .9s var(--sig-ease-out), box-shadow .6s var(--sig-ease-out), background-color .14s, border-color .14s !important;
}
html.sci-sig-tilt-on body:not(#s#s#s) .sci-sig-tilt {
  transform: perspective(1000px) rotateX(var(--sig-rx, 0deg)) rotateY(var(--sig-ry, 0deg)) !important;
  backface-visibility: hidden;
}
html.sci-sig-tilt-on body:not(#s#s#s) .sci-sig-tilt.sci-sig-tilting { will-change: transform; transition: transform .08s linear, box-shadow .45s var(--sig-ease-out), background-color .14s, border-color .14s !important; }
html.sci-sig-tilt-on body:not(#s#s#s) :is(.sci-sig-tilt, .sci-sig-relief).sci-sig-tilting {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), var(--sig-sx, 0px) var(--sig-sy, 12px) 30px -14px rgba(11,31,77,.30), 0 1px 2px rgba(11,31,77,.08) !important;
  z-index: 2;
}
html.sci-sig-tilt-on body:not(#s#s#s) .sci-sig-relief.sci-sig-tilting { box-shadow: inset 0 1px 0 rgba(255,255,255,.9), calc(var(--sig-sx, 0px) * .5) calc(var(--sig-sy, 12px) * .6) 22px -14px rgba(11,31,77,.26), 0 1px 2px rgba(11,31,77,.06) !important; }
/* le reflet passe SOUS le contenu (z-index -1 dans le contexte isolé) : le texte n'est jamais délavé */
html body:not(#s#s#s) .sci-sig-spec {
  position: absolute !important; inset: 0; border-radius: inherit; pointer-events: none; z-index: -1; opacity: 0; margin: 0 !important;
  background:
    radial-gradient(260px circle at var(--sig-mx, 50%) var(--sig-my, 50%), rgba(255,196,0,.13), rgba(255,196,0,0) 60%),
    radial-gradient(520px circle at var(--sig-mx, 50%) var(--sig-my, 50%), rgba(11,31,77,.035), transparent 70%),
    linear-gradient(calc(180deg + var(--sig-dx, 0) * 90deg), rgba(255,255,255,.55), rgba(255,255,255,0) 45%);
  transition: opacity .35s var(--sig-ease);
}
html body:not(#s#s#s) .sci-sig-tilting > .sci-sig-spec { opacity: 1; }
/* surfaces marine (1re carte KPI) : reflet blanc */
html body:not(#s#s#s) #tab-dashboard .cards-grid > .card:first-child > .sci-sig-spec {
  background: radial-gradient(280px circle at var(--sig-mx, 50%) var(--sig-my, 50%), rgba(255,255,255,.16), transparent 60%);
}
html.sci-sig-tilt-on body:not(#s#s#s) #tab-dashboard .cards-grid > .card:first-child.sci-sig-tilting { box-shadow: inset 0 1px 0 rgba(255,255,255,.18), var(--sig-sx, 0px) var(--sig-sy, 12px) 30px -12px rgba(11,31,77,.45) !important; }

/* graphiques : plans étagés (grille au fond, marques au milieu, libellés devant) ;
   la couche « hits » ne bouge pas → info-bulles et zones de survol restent alignées */
html body:not(#s#s#s) #sciana-root .sa-svg :is(.sa-gl, .sa-base, .sa-tick, .sa-label, .sa-value, .sa-endlbl, .sa-marker-lbl, .sa-axis-title) {
  transition: translate .3s var(--sig-ease);
}
html body:not(#s#s#s) #sciana-root .sci-sig-tilting .sa-svg :is(.sa-gl, .sa-base) { translate: calc(var(--sig-dx, 0) * -3px) calc(var(--sig-dy, 0) * -2px); }
html body:not(#s#s#s) #sciana-root .sci-sig-tilting .sa-svg :is(.sa-tick, .sa-label, .sa-value, .sa-endlbl, .sa-marker-lbl, .sa-axis-title) { translate: calc(var(--sig-dx, 0) * 2.5px) calc(var(--sig-dy, 0) * 1.6px); }
/* relief des barres : l'ombre portée suit la lumière (opposée au pointeur) */
html body:not(#s#s#s) #sciana-root .sci-sig-tilting .sa-svg .sa-bar {
  filter: drop-shadow(calc(var(--sig-dx, 0) * -3.2px) calc(1.6px + var(--sig-dy, 0) * -2.4px) 1.5px rgba(11,31,77,.38)) !important;
}
html body:not(#s#s#s) #sciana-root .sci-sig-tilting .sa-svg :is(.sa-dot, .sa-orb) {
  filter: drop-shadow(calc(var(--sig-dx, 0) * -2.4px) calc(1.2px + var(--sig-dy, 0) * -2px) 1.2px rgba(11,31,77,.35));
}
/* jauges HTML : arête claire + ombre interne (relief permanent, discret) */
html body:not(#s#s#s) #sciana-root .sa-meter-fill { box-shadow: inset 0 1px 0 rgba(255,255,255,.45), inset 0 -1px 0 rgba(0,0,0,.18), 0 1px 2px rgba(11,31,77,.25); }

/* reflet du bandeau-titre (90-ux) */
html body:not(#s#s#s) #sciux-crumbs { isolation: isolate; }
html body:not(#s#s#s) #sciux-crumbs > .sci-sig-band-sheen {
  position: absolute; inset: 0; pointer-events: none; z-index: -1; opacity: 0; border-radius: inherit;
  background: radial-gradient(520px 200px at var(--sig-mx, 70%) var(--sig-my, 0%), rgba(255,196,0,.13), transparent 70%);
  transition: opacity .5s var(--sig-ease);
}
html body:not(#s#s#s) #sciux-crumbs.sci-sig-lit > .sci-sig-band-sheen { opacity: 1; }

/* transition de profondeur entre vues (propriétés individuelles : se composent avec b-view) */
html body:not(#s#s#s) .tab-pane.sci-sig-dt {
  transform-origin: 50% 0;
  transition: scale .62s var(--sig-ease-out), translate .62s var(--sig-ease-out);
}
html body:not(#s#s#s) .tab-pane.sci-sig-d0 { scale: .985; translate: 0 8px; }
/* les cartes de la vue entrante remontent du plan arrière en cascade (ombre qui se pose) */
html body:not(#s#s#s) .tab-pane.sci-sig-dt :is(.card, .dom-card, .sa-card, .svw-card, .report-item):nth-child(-n+12) {
  animation: sci-sig-land .7s var(--sig-ease-out) both;
}
html body:not(#s#s#s) .tab-pane.sci-sig-dt :is(.card, .dom-card, .sa-card, .svw-card, .report-item):nth-child(2) { animation-delay: .04s; }
html body:not(#s#s#s) .tab-pane.sci-sig-dt :is(.card, .dom-card, .sa-card, .svw-card, .report-item):nth-child(3) { animation-delay: .08s; }
html body:not(#s#s#s) .tab-pane.sci-sig-dt :is(.card, .dom-card, .sa-card, .svw-card, .report-item):nth-child(n+4) { animation-delay: .12s; }
@keyframes sci-sig-land {
  from { box-shadow: 0 18px 34px -18px rgba(11,31,77,.35); }
  to { }
}

/* ═════════ 4. Langage de profondeur sur les couches récentes ═════════ */
/* 95b-views (SANTÉ / HISTORIQUE / TIMELINE) : mêmes plans étagés que les graphiques d'analyse */
html body:not(#s#s#s) section.svw .svw-svg :is(.svw-gl, .svw-base, .svw-tick, .svw-label, .svw-value, .svw-scale-l) { transition: translate .5s var(--sig-ease-out); }
html body:not(#s#s#s) section.svw .sci-sig-tilting .svw-svg :is(.svw-gl, .svw-base) { translate: calc(var(--sig-dx, 0) * -3px) calc(var(--sig-dy, 0) * -2px); }
html body:not(#s#s#s) section.svw .sci-sig-tilting .svw-svg :is(.svw-tick, .svw-label, .svw-value, .svw-scale-l) { translate: calc(var(--sig-dx, 0) * 2.5px) calc(var(--sig-dy, 0) * 1.6px); }
html body:not(#s#s#s) section.svw .sci-sig-tilting .svw-svg .svw-bar { filter: drop-shadow(calc(var(--sig-dx, 0) * -3px) calc(1.5px + var(--sig-dy, 0) * -2.2px) 1.4px rgba(11,31,77,.34)); }
/* graphiques : la grille glisse sous les marques avec inertie, retour lent */
html body:not(#s#s#s) #sciana-root .sa-svg :is(.sa-gl, .sa-base, .sa-tick, .sa-label, .sa-value, .sa-endlbl, .sa-marker-lbl, .sa-axis-title) { transition: translate .5s var(--sig-ease-out); }

/* 92-power : barre d'outils de la console = réglette usinée (relief fixe, jamais d'inclinaison) */
html body:not(#s#s#s) .spw-ctool {
  background: linear-gradient(180deg, #fff, var(--c-2, #F9F9F6)) !important;
  box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgba(11,31,77,.04), 0 1px 0 rgba(11,31,77,.04);
}
html body:not(#s#s#s) .spw-ctool :is(.spw-btn, .spw-tg, .spw-cnt) {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 1px 1.5px rgba(11,31,77,.10);
  transition: box-shadow .2s var(--sig-ease-out), translate .2s var(--sig-ease-out);
}
html body:not(#s#s#s) .spw-ctool :is(.spw-btn, .spw-tg):hover { box-shadow: inset 0 1px 0 #fff, 0 3px 8px -3px rgba(11,31,77,.25); translate: 0 -1px; }
html body:not(#s#s#s) .spw-ctool :is(.spw-btn, .spw-tg):active { box-shadow: inset 0 1px 2px rgba(11,31,77,.18); translate: 0 0; }
html body:not(#s#s#s) .spw-ctool .spw-cfind :is(input, [type="search"]) { box-shadow: inset 0 1px 2px rgba(11,31,77,.10), inset 0 0 0 1px rgba(11,31,77,.04); }

/* 90-ux : barre d'état = plateau flottant (arête lumineuse + ombre vers le haut) */
html body:not(#s#s#s) #sciux-statusbar {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75), 0 -10px 24px -18px rgba(11,31,77,.35) !important;
}
html body:not(#s#s#s) #sciux-statusbar .sciux-sb-dot { box-shadow: 0 0 0 2px rgba(255,255,255,.18), 0 1px 2px rgba(0,0,0,.25); }

/* pause quand l'onglet est masqué */
html.sci-sig-paused #sci-sig-hero * { animation-play-state: paused !important; }

/* ═════════ Adaptatif ═════════ */
@container sci-sig-hero (max-width: 760px) {
  #sci-sig-hero.sci-sig-hero { grid-template-columns: minmax(0, 1fr); }
  #sci-sig-hero .sci-sig-fig--illu .sci-sig-stage { height: 150px; }
}
@media (max-width: 760px) {
  html body:not(#s#s#s) #sci-sig-hero { grid-template-columns: minmax(0, 1fr); }
  html body:not(#s#s#s) #sci-sig-hero .sci-sig-fig--illu { display: none; }
  html body:not(#s#s#s) #sci-sig-hero .sci-sig-stage--flow { height: 140px; }
  html body:not(#s#s#s) #sci-sig-hero .sci-sig-fig--flow .sci-sig-plate { display: none; }
  html body:not(#s#s#s) #sci-sig-hero figcaption { padding: 8px 12px; font-size: 12.5px; }
}
body.focus-mode #sci-sig-hero .sci-sig-stage { height: 150px; }

/* ==== 99-owner.css ==== */
/* ═══ 99 — Retours directs du propriétaire (chargé tout en dernier) ═══ */
/* Console : hauteur ajustée au contenu (plus de grand vide), défile au-delà de ~16 lignes */
html body #main-console { min-height: 0 !important; height: auto !important; max-height: clamp(220px, 34vh, 420px) !important; overflow-y: auto !important; }

/* Barres de défilement invisibles partout (le défilement reste actif : molette, pavé, tactile, clavier) */
html, html body, html body * { scrollbar-width: none !important; -ms-overflow-style: none !important; }
html::-webkit-scrollbar, html body::-webkit-scrollbar, html body *::-webkit-scrollbar { width: 0 !important; height: 0 !important; display: none !important; background: transparent !important; }

/* Colonne de gauche : textes bien noirs (sauf dans le bloc bleu foncé de l'auto-cycle) */
html body:not(#o#o#o) aside.sidebar-left .phase-name,
html body:not(#o#o#o) aside.sidebar-left .phase-desc,
html body:not(#o#o#o) aside.sidebar-left .util-btn,
html body:not(#o#o#o) aside.sidebar-left .sciux-acc-sum,
html body:not(#o#o#o) aside.sidebar-left .section-title,
html body:not(#o#o#o) aside.sidebar-left .section-title span,
html body:not(#o#o#o) aside.sidebar-left div[style*="margin-top:auto"] span { color: #0a0b0d !important; -webkit-text-fill-color: #0a0b0d !important; }
html body:not(#o#o#o) aside.sidebar-left .phase-desc { font-weight: 500 !important; }
html body:not(#o#o#o) aside.sidebar-left span[style*="0,229,255"], html body:not(#o#o#o) aside.sidebar-left span[style*="00e5ff"] { color: #0b1f4d !important; -webkit-text-fill-color: #0b1f4d !important; }

/* Rapports : « VOIR » ouvre le rapport sur TOUTE la largeur (plus de colonne de lecture étroite) */
html body:not(#o#o#o) #tab-reports .report-item:has(> .report-body.open) { padding-left: clamp(16px, 1.6vw, 28px) !important; padding-right: clamp(16px, 1.6vw, 28px) !important; }
html body:not(#o#o#o) #tab-reports .report-body.open,
html body:not(#o#o#o) #tab-reports .report-body.open .report-content,
html body:not(#o#o#o) #tab-reports .report-body.open .report-content * { max-width: none !important; }
html body:not(#o#o#o) #tab-reports .report-body.open { width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }
html body:not(#o#o#o) #tab-reports .report-body.open .report-content table { width: 100% !important; }

/* ═══ Mode ESPACE (bouton lune / Ctrl+Espace → body.immersive-mode) : la scène spatiale 3D d'origine revient en plein écran ═══ */
html:has(body.immersive-mode) { background: #02040a !important; }
html body.immersive-mode:not(#o#o#o#o), html body.immersive-mode:not(#o#o#o#o) .main-layout { background: transparent !important; background-image: none !important; }
html body.immersive-mode::before, html body.immersive-mode::after { display: none !important; }
html body.immersive-mode #space-journey,
html body.immersive-mode #particles-canvas,
html body.immersive-mode #const-canvas,
html body.immersive-mode #cia-bg { display: block !important; opacity: 1 !important; filter: none !important; visibility: visible !important; }
html body.immersive-mode #planet-labels { display: block !important; opacity: 1 !important; filter: none !important; visibility: visible !important; }
/* Couches de la refonte masquées pendant le mode espace (seul le bouton de retour reste) */
html body.immersive-mode #scifx-bg,
html body.immersive-mode #scifx-palette,
html body.immersive-mode .scifx-pal-trigger,
html body.immersive-mode #sciux-statusbar,
html body.immersive-mode #sciux-inspector,
html body.immersive-mode #sciux-keys,
html body.immersive-mode #sciana-tip,
html body.immersive-mode [id^="sci-sig"], html body.immersive-mode [class^="sci-sig"] { display: none !important; }
html body.immersive-mode #btn-toggle-all { display: flex !important; z-index: 2147483000 !important; }

/* Graphiques statistiques : le surlignage de survol ne doit JAMAIS masquer les barres/points (il est dessiné au-dessus) */
html body:not(#o#o#o) #sciana-root .sa-svg .sa-hitbox { mix-blend-mode: multiply; }
html body:not(#o#o#o) #sciana-root .sa-svg .sa-hit.is-hover > .sa-hitbox,
html body:not(#o#o#o) #sciana-root .sa-svg .is-hover.sa-col > .sa-hitbox,
html body:not(#o#o#o) #sciana-root .sa-svg .is-hover.sa-row > .sa-hitbox { fill: #ffe680 !important; fill-opacity: .45 !important; }
html body:not(#o#o#o) #sciana-root .sa-svg .is-hover .sa-mark { filter: none !important; }

/* Bouton lune (mode Espace) : descendu DANS la barre d'état, en bas à gauche — ne chevauche plus aucun contenu */
html body:not(#o#o#o) #btn-toggle-all {
  position: fixed !important; left: 6px !important; right: auto !important; bottom: 3px !important; top: auto !important;
  width: 27px !important; height: 27px !important; min-width: 0 !important; min-height: 0 !important;
  transform: none !important; margin: 0 !important; padding: 0 !important; font-size: 14px !important;
  z-index: 10001 !important;
}
html body:not(#o#o#o) #btn-toggle-all svg, html body:not(#o#o#o) #btn-toggle-all .sci-ic { width: 15px !important; height: 15px !important; }
html body:not(#o#o#o) #sciux-statusbar { padding-left: 40px !important; }
/* Mode Espace : interface masquée → la lune reste seule, un peu plus grande, en bas au centre */
html body.immersive-mode:not(#o#o#o) #btn-toggle-all { left: 50% !important; bottom: 18px !important; width: 44px !important; height: 44px !important; transform: translateX(-50%) !important; }


/* ══ SOMMAIRE COMPACT (rapports) — bouton + panneau, plus de ligne qui déborde ══ */
html body:not(#spw#spw#spw#spw) .spw-rbar { flex-wrap: nowrap; gap: 10px; overflow: visible; min-height: 48px; padding: 7px 12px 7px 14px; max-width: 100%; }
html body:not(#spw#spw#spw#spw) .spw-toc { position: static; display: flex; align-items: center; gap: 12px; flex: 1 1 auto; min-width: 0; }
html body:not(#spw#spw#spw#spw) button.spw-toc-k {
  display: inline-flex; align-items: center; gap: 7px; flex: none; height: 32px; min-height: 32px; padding: 0 10px 0 9px; margin: 0;
  font: 700 11px/1 var(--f-sans, sans-serif) !important; letter-spacing: .08em; text-transform: uppercase;
  color: var(--c-acc, #0B1F4D) !important; background: linear-gradient(180deg, #fff, #F4F6FB) !important;
  border: 1px solid var(--c-acc-line, #B9C4DD) !important; border-radius: 8px !important; cursor: pointer;
  box-shadow: 0 1px 0 #fff inset, 0 2px 0 rgba(11,31,77,.10), 0 6px 14px -10px rgba(11,31,77,.45) !important;
  transition: transform .12s, box-shadow .12s, background-color .12s;
}
html body:not(#spw#spw#spw#spw) button.spw-toc-k:hover { transform: translateY(-1px); }
html body:not(#spw#spw#spw#spw) button.spw-toc-k[aria-expanded="true"] { background: var(--c-acc, #0B1F4D) !important; color: #fff !important; border-color: var(--c-acc, #0B1F4D) !important; }
html body:not(#spw#spw#spw#spw) .spw-toc-n {
  min-width: 20px; height: 18px; padding: 0 5px; box-sizing: border-box; display: inline-grid; place-items: center;
  font: 700 10.5px/1 var(--f-mono, monospace); letter-spacing: 0; color: var(--c-acc, #0B1F4D); background: var(--c-y, #FFC400); border-radius: 9px;
}
html body:not(#spw#spw#spw#spw) .spw-toc-chev { width: 7px; height: 7px; margin: -3px 1px 0 1px; border: solid currentColor; border-width: 0 1.8px 1.8px 0; transform: rotate(45deg); transition: transform .16s; }
html body:not(#spw#spw#spw#spw) button.spw-toc-k[aria-expanded="true"] .spw-toc-chev { transform: rotate(225deg); margin-top: 3px; }
html body:not(#spw#spw#spw#spw) .spw-toc-cur {
  flex: 1 1 auto; min-width: 0; display: flex; align-items: baseline; gap: 9px;
  overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
  font: italic 600 13px/1.3 var(--f-serif, serif); color: var(--c-text, #0A0B0D);
}
html body:not(#spw#spw#spw#spw) .spw-toc-cur > b {
  flex: none; font: 600 10.5px/1 var(--f-mono, monospace); font-style: normal; letter-spacing: .04em; color: var(--c-muted, #5A5C64);
  padding: 4px 6px; border: 1px solid var(--c-line, #E7E6E0); border-radius: 5px; background: var(--c-2, #F9F9F6);
}
html body:not(#spw#spw#spw#spw) .spw-toc-pop {
  position: absolute; z-index: 30; top: calc(100% + 6px); left: 12px; width: min(760px, calc(100% - 24px)); box-sizing: border-box;
  max-height: min(62vh, 560px); overflow: auto; scrollbar-width: none; padding: 8px;
  background: #fff; border: 1px solid var(--c-line, #E7E6E0); border-radius: 12px;
  box-shadow: 0 1px 0 #fff inset, 0 24px 48px -18px rgba(11,31,77,.40), 0 8px 18px -10px rgba(11,31,77,.25);
  animation: spwTocIn .16s ease-out;
}
html body:not(#spw#spw#spw#spw) .spw-toc-pop[hidden] { display: none !important; }
html body:not(#spw#spw#spw#spw) .spw-toc-pop::-webkit-scrollbar { display: none; }
@keyframes spwTocIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
html body:not(#spw#spw#spw#spw) .spw-toc-pop .spw-toc-l {
  display: block; overflow: visible; margin: 0; padding: 0; counter-reset: spwtoc;
  -webkit-mask-image: none; mask-image: none; columns: 2 300px; column-gap: 8px;
}
html body:not(#spw#spw#spw#spw) .spw-toc-pop .spw-toc-l > li { break-inside: avoid; counter-increment: spwtoc; }
html body:not(#spw#spw#spw#spw) .spw-toc-pop a.spw-toc-a {
  display: flex; gap: 10px; align-items: baseline; max-width: none; min-height: 0; padding: 8px 10px; white-space: normal; overflow: visible;
  font: 500 13px/1.35 var(--f-sans, sans-serif) !important; color: var(--c-text, #0A0B0D) !important; border-radius: 8px;
}
html body:not(#spw#spw#spw#spw) .spw-toc-pop a.spw-toc-a[data-lvl="3"], html body:not(#spw#spw#spw#spw) .spw-toc-pop a.spw-toc-a[data-lvl="4"] { padding-left: 22px; font-size: 12.5px !important; color: var(--c-muted, #5A5C64) !important; }
html body:not(#spw#spw#spw#spw) .spw-toc-pop a.spw-toc-a:hover { background: var(--c-acc-soft, #EEF1F8) !important; color: var(--c-acc, #0B1F4D) !important; }
html body:not(#spw#spw#spw#spw) .spw-toc-pop a.spw-toc-a[aria-current] { background: #FFF8DB !important; color: var(--c-acc, #0B1F4D) !important; font-weight: 600 !important; box-shadow: inset 3px 0 0 var(--c-y, #FFC400); }
html body:not(#spw#spw#spw#spw) .spw-toc-pop a.spw-toc-a[aria-current]::after { content: none; }
html body:not(#spw#spw#spw#spw) .spw-rbar-act { display: flex; gap: 4px; flex: none; }
html body:not(#spw#spw#spw#spw) .spw-nav-b { width: 32px; height: 32px; min-height: 32px; padding: 0; display: inline-grid; place-items: center; border-radius: 8px; }
html body:not(#spw#spw#spw#spw) .report-item:has(> .report-body.open > .spw-rbar[data-toc-open]) { overflow: visible; }
@media (max-width: 560px) {
  html body:not(#spw#spw#spw#spw) .spw-toc-cur { font-size: 12px; }
  html body:not(#spw#spw#spw#spw) .spw-toc-pop { left: 6px; width: calc(100% - 12px); }
  html body:not(#spw#spw#spw#spw) .spw-toc-pop .spw-toc-l { columns: 1; }
}
@media print { .spw-toc-pop { display: none !important; } }

/* ══ Bouton PRÉSENTATION (en-tête, à côté de « ? ») ══ */
html body:not(#b#b#b) > header .pres-btn {
  display: inline-flex; align-items: center; gap: 8px; flex: 0 0 auto; height: 36px; padding: 0 13px 0 11px; box-sizing: border-box;
  color: var(--c-acc, #0B1F4D) !important; background: linear-gradient(180deg, #FFD43B, var(--c-y, #FFC400)) !important;
  border: 1px solid #E5B000; border-radius: var(--r-md, 8px); text-decoration: none !important;
  font: 700 11px/1 var(--f-sans, sans-serif); letter-spacing: .09em; text-transform: uppercase; white-space: nowrap;
  box-shadow: 0 1px 0 rgba(255,255,255,.55) inset, 0 2px 0 #C99A00, 0 8px 18px -8px rgba(255,196,0,.55);
  transition: transform .14s, box-shadow .14s;
}
html body:not(#b#b#b) > header .pres-btn:hover { transform: translateY(-1px); box-shadow: 0 1px 0 rgba(255,255,255,.55) inset, 0 3px 0 #C99A00, 0 12px 22px -8px rgba(255,196,0,.7); }
html body:not(#b#b#b) > header .pres-btn:active { transform: translateY(1px); box-shadow: 0 1px 0 #C99A00; }
html body:not(#b#b#b) > header .pres-btn:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
@media (max-width: 900px) {
  html body:not(#b#b#b) > header .pres-btn { width: 36px; padding: 0; justify-content: center; order: 3; }
  html body:not(#b#b#b) > header .pres-btn > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}
@media print { header .pres-btn { display: none !important; } }