/* Thèmes OS et sélecteur repris du guide SQ. */
    /* 1. THÈME CLAIR : macOS (Aqua / Cupertino Modern) */
    html[data-theme="macos"] {
      --bg-canvas: #f5f5f7;
      --bg-panel: #ffffff;
      --bg-panel-hover: #fafafa;
      --bg-pill: rgba(0, 0, 0, 0.05);
      --bg-pill-hover: rgba(0, 0, 0, 0.09);
      --border-subtle: rgba(0, 0, 0, 0.09);
      --border-bright: rgba(0, 113, 227, 0.4);
      --text-main: #1d1d1f;
      --text-muted: #4b4b4e;
      --text-dim: #76767b;
      --accent-cyan: #0071e3;
      --accent-blue: #0071e3;
      --accent-purple: #af52de;
      --accent-emerald: #34c759;
      --accent-amber: #ff9500;
      --accent-rose: #ff3b30;
      --shadow-glow: none;
      --shadow-card: 0 4px 20px rgba(0, 0, 0, 0.05);
    }
    html[data-theme="macos"] body {
      background-image: none !important;
      background-color: #f5f5f7 !important;
      font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", sans-serif !important;
    }
    html[data-theme="macos"] .top-bar {
      background: rgba(255, 255, 255, 0.88) !important;
      backdrop-filter: blur(20px) !important;
      -webkit-backdrop-filter: blur(20px) !important;
      border-bottom: 1px solid rgba(0, 0, 0, 0.09) !important;
      color: #1d1d1f !important;
    }
    html[data-theme="macos"] .top-bar .brand-title,
    html[data-theme="macos"] .top-bar .brand-sub {
      color: #1d1d1f !important;
    }
    html[data-theme="macos"] .tab-bar-container {
      background: rgba(245, 245, 247, 0.85) !important;
      border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
    }
    html[data-theme="macos"] .glass-card,
    html[data-theme="macos"] .toc-sidebar {
      border-radius: 16px !important;
      border: 1px solid rgba(0, 0, 0, 0.08) !important;
      box-shadow: 0 4px 24px rgba(0, 0, 0, 0.04) !important;
    }
    html[data-theme="macos"] .tab-btn {
      border-radius: 20px !important;
      background: rgba(0, 0, 0, 0.04) !important;
      border: 1px solid transparent !important;
      color: #515154 !important;
    }
    html[data-theme="macos"] .tab-btn.active {
      background: #ffffff !important;
      border-color: rgba(0, 0, 0, 0.1) !important;
      color: #0071e3 !important;
      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
    }

    /* 2. THÈME CLAIR : Windows XP (Luna Blue) */
    html[data-theme="winxp"] {
      --bg-canvas: #ece9d8;
      --bg-panel: #ffffff;
      --bg-panel-hover: #fbfaf4;
      --bg-pill: #e3dfd0;
      --bg-pill-hover: #d2cdbe;
      --border-subtle: #7f9db9;
      --border-bright: #0055ea;
      --text-main: #000000;
      --text-muted: #2b2b2b;
      --text-dim: #5c5c5c;
      --accent-cyan: #0055ea;
      --accent-blue: #288eff;
      --accent-purple: #7040a0;
      --accent-emerald: #388e3c;
      --accent-amber: #d97706;
      --accent-rose: #d32f2f;
      --shadow-glow: none;
      --shadow-card: 2px 4px 12px rgba(0, 40, 150, 0.12);
    }
    html[data-theme="winxp"] body {
      background-image: linear-gradient(180deg, #ece9d8 0%, #ded9c6 100%) !important;
      font-family: 'Tahoma', 'Segoe UI', Arial, sans-serif !important;
    }
    html[data-theme="winxp"] .top-bar {
      background: linear-gradient(180deg, #0058ee 0%, #3593ff 25%, #288eff 65%, #0055ea 100%) !important;
      border-bottom: 2px solid #002e88 !important;
      color: #ffffff !important;
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25) !important;
    }
    html[data-theme="winxp"] .top-bar .brand-title,
    html[data-theme="winxp"] .top-bar .brand-sub {
      color: #ffffff !important;
    }
    html[data-theme="winxp"] .tab-bar-container {
      background: #ece9d8 !important;
      border-bottom: 1px solid #7f9db9 !important;
    }
    html[data-theme="winxp"] .glass-card,
    html[data-theme="winxp"] .toc-sidebar {
      border-radius: 6px !important;
      border: 1px solid #7f9db9 !important;
      box-shadow: 2px 4px 10px rgba(0, 0, 0, 0.08) !important;
    }
    html[data-theme="winxp"] .tab-btn {
      border-radius: 6px 6px 0 0 !important;
      background: linear-gradient(180deg, #f5f2e6 0%, #e0ded0 100%) !important;
      border: 1px solid #7f9db9 !important;
      color: #000000 !important;
    }
    html[data-theme="winxp"] .tab-btn.active {
      background: #ffffff !important;
      border-bottom-color: #ffffff !important;
      color: #0055ea !important;
      font-weight: 700 !important;
      box-shadow: 0 -3px 0 #ff9900 !important;
    }
    html[data-theme="winxp"] .btn-action {
      border-radius: 4px !important;
      background: linear-gradient(180deg, #ffffff 0%, #ece9d8 100%) !important;
      border: 1px solid #7f9db9 !important;
      color: #000000 !important;
    }

    /* 3. THÈME CLAIR : Windows 98 (Classic Teal & Bevel) */
    html[data-theme="win98"] {
      --bg-canvas: #008080;
      --bg-panel: #c0c0c0;
      --bg-panel-hover: #d0d0d0;
      --bg-pill: #c0c0c0;
      --bg-pill-hover: #dfdfdf;
      --border-subtle: #808080;
      --border-bright: #000080;
      --text-main: #000000;
      --text-muted: #111111;
      --text-dim: #444444;
      --accent-cyan: #000080;
      --accent-blue: #1084d0;
      --accent-purple: #800080;
      --accent-emerald: #008000;
      --accent-amber: #808000;
      --accent-rose: #800000;
      --shadow-glow: none;
      --shadow-card: 2px 2px 0px #000000;
    }
    html[data-theme="win98"] body {
      background-image: none !important;
      background-color: #008080 !important;
      font-family: 'MS Sans Serif', Tahoma, 'Segoe UI', sans-serif !important;
    }
    html[data-theme="win98"] .top-bar {
      background: linear-gradient(90deg, #000080 0%, #1084d0 100%) !important;
      border-bottom: 2px solid #000000 !important;
      color: #ffffff !important;
    }
    html[data-theme="win98"] .top-bar .brand-title,
    html[data-theme="win98"] .top-bar .brand-sub {
      color: #ffffff !important;
    }
    html[data-theme="win98"] .tab-bar-container {
      background: #c0c0c0 !important;
      border-bottom: 2px solid #808080 !important;
    }
    html[data-theme="win98"] .glass-card,
    html[data-theme="win98"] .toc-sidebar {
      border-radius: 0 !important;
      background: #c0c0c0 !important;
      border-top: 2px solid #ffffff !important;
      border-left: 2px solid #ffffff !important;
      border-right: 2px solid #808080 !important;
      border-bottom: 2px solid #808080 !important;
      box-shadow: 2px 2px 0px #000000 !important;
    }
    html[data-theme="win98"] .tab-btn,
    html[data-theme="win98"] .btn-action,
    html[data-theme="win98"] .theme-btn {
      border-radius: 0 !important;
      background: #c0c0c0 !important;
      color: #000000 !important;
      border-top: 2px solid #ffffff !important;
      border-left: 2px solid #ffffff !important;
      border-right: 2px solid #808080 !important;
      border-bottom: 2px solid #808080 !important;
      font-weight: 700 !important;
    }
    html[data-theme="win98"] .tab-btn.active,
    html[data-theme="win98"] .theme-btn.active {
      border-top: 2px solid #808080 !important;
      border-left: 2px solid #808080 !important;
      border-right: 2px solid #ffffff !important;
      border-bottom: 2px solid #ffffff !important;
      background: #dfdfdf !important;
      box-shadow: none !important;
    }
    html[data-theme="win98"] .speech-box,
    html[data-theme="win98"] .toc-search-input,
    html[data-theme="win98"] .grid-item {
      border-radius: 0 !important;
      background: #ffffff !important;
      color: #000000 !important;
      border-top: 2px solid #808080 !important;
      border-left: 2px solid #808080 !important;
      border-right: 2px solid #ffffff !important;
      border-bottom: 2px solid #ffffff !important;
    }

    /* 4. THÈME CLAIR : Linux Mint (Mint-Y Light) */
    html[data-theme="linuxmint"] {
      --bg-canvas: #e8ebee;
      --bg-panel: #ffffff;
      --bg-panel-hover: #f7f9fa;
      --bg-pill: #dfe3e7;
      --bg-pill-hover: #cfd5dc;
      --border-subtle: #d4d7db;
      --border-bright: #87cf3e;
      --text-main: #2b303c;
      --text-muted: #4e5765;
      --text-dim: #738090;
      --accent-cyan: #87cf3e;
      --accent-blue: #55972a;
      --accent-purple: #8f60c4;
      --accent-emerald: #2f8f36;
      --accent-amber: #e69d00;
      --accent-rose: #d94141;
      --shadow-glow: none;
      --shadow-card: 0 2px 10px rgba(0, 0, 0, 0.06);
    }
    html[data-theme="linuxmint"] body {
      background-image: none !important;
      background-color: #e8ebee !important;
      font-family: 'Ubuntu', 'Cantarell', 'Roboto', 'DejaVu Sans', sans-serif !important;
    }
    html[data-theme="linuxmint"] .top-bar {
      background: #2f343f !important;
      border-bottom: 2px solid #87cf3e !important;
      color: #ffffff !important;
    }
    html[data-theme="linuxmint"] .top-bar .brand-title,
    html[data-theme="linuxmint"] .top-bar .brand-sub {
      color: #ffffff !important;
    }
    html[data-theme="linuxmint"] .tab-bar-container {
      background: #e8ebee !important;
      border-bottom: 1px solid #d4d7db !important;
    }
    html[data-theme="linuxmint"] .glass-card,
    html[data-theme="linuxmint"] .toc-sidebar {
      border-radius: 8px !important;
      border: 1px solid #d4d7db !important;
      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05) !important;
    }
    html[data-theme="linuxmint"] .tab-btn {
      border-radius: 6px !important;
      background: #ffffff !important;
      border: 1px solid #d4d7db !important;
      color: #2b303c !important;
    }
    html[data-theme="linuxmint"] .tab-btn.active {
      background: #ffffff !important;
      border-color: #87cf3e !important;
      border-bottom: 3px solid #87cf3e !important;
      color: #2f8f36 !important;
      box-shadow: none !important;
    }

    /* 5. THÈME SOMBRE : Antigravity Void */
    html[data-theme="void"] {
      --bg-canvas: #030712;
      --bg-panel: rgba(15, 23, 42, 0.78);
      --bg-panel-hover: rgba(30, 41, 59, 0.85);
      --bg-pill: rgba(255, 255, 255, 0.06);
      --bg-pill-hover: rgba(255, 255, 255, 0.12);
      --border-subtle: rgba(255, 255, 255, 0.08);
      --border-bright: rgba(56, 189, 248, 0.35);
      --text-main: #f8fafc;
      --text-muted: #94a3b8;
      --text-dim: #64748b;
      --accent-cyan: #00f0ff;
      --accent-blue: #38bdf8;
      --accent-purple: #c084fc;
      --accent-emerald: #10b981;
      --accent-amber: #f59e0b;
      --accent-rose: #f43f5e;
      --shadow-glow: 0 0 25px rgba(0, 240, 255, 0.15);
      --shadow-card: 0 20px 40px -15px rgba(0, 0, 0, 0.7);
    }

    /* RÈGLES DE CONTRASTE UNIVERSELLES POUR THÈMES CLAIRS */
    html:not([data-theme="void"]) .section-title,
    html:not([data-theme="void"]) .hero-heading,
    html:not([data-theme="void"]) .law-heading,
    html:not([data-theme="void"]) .grid-item-title {
      color: var(--text-main) !important;
    }

    html:not([data-theme="void"]) .speech-box {
      background: rgba(0, 113, 227, 0.05);
      color: var(--text-main);
      border-left-color: var(--accent-cyan);
    }

    html:not([data-theme="void"]) .pill-item {
      background: rgba(0, 0, 0, 0.04);
      color: var(--text-main);
      border-color: var(--border-subtle);
    }

    html:not([data-theme="void"]) .grid-item {
      background: #fafafc;
      border-color: var(--border-subtle);
    }

    html:not([data-theme="void"]) .star-card {
      background: #f8fafc;
      border-color: var(--border-subtle);
    }

    html:not([data-theme="void"]) .toc-search-input {
      background: #ffffff;
      color: var(--text-main);
      border-color: var(--border-subtle);
    }

    /* RÈGLES SÉLECTEUR DE THÈME DYNAMIQUE */
    html:not([data-theme="void"]) .theme-selector {
      background: rgba(0, 0, 0, 0.05);
      border-color: rgba(0, 0, 0, 0.12);
    }
    html:not([data-theme="void"]) .theme-btn {
      color: var(--text-muted);
    }
    html:not([data-theme="void"]) .theme-btn.active {
      background: #ffffff;
      color: var(--accent-cyan);
      border: 1px solid var(--border-bright);
      box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
    }
    html[data-theme="winxp"] .theme-selector {
      background: rgba(0, 0, 0, 0.22) !important;
      border-color: rgba(255, 255, 255, 0.4) !important;
      border-radius: 4px !important;
    }
    html[data-theme="winxp"] .theme-btn {
      border-radius: 3px !important;
      color: #ffffff !important;
      font-family: Tahoma, sans-serif !important;
    }
    html[data-theme="winxp"] .theme-btn.active {
      background: #ffffff !important;
      color: #0055ea !important;
      border: 1px solid #002e88 !important;
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
    }
    html[data-theme="win98"] .theme-selector {
      background: #c0c0c0 !important;
      border-top: 2px solid #808080 !important;
      border-left: 2px solid #808080 !important;
      border-right: 2px solid #ffffff !important;
      border-bottom: 2px solid #ffffff !important;
      border-radius: 0 !important;
    }
    html[data-theme="win98"] .theme-btn {
      border-radius: 0 !important;
      border-top: 2px solid #ffffff !important;
      border-left: 2px solid #ffffff !important;
      border-right: 2px solid #808080 !important;
      border-bottom: 2px solid #808080 !important;
      background: #c0c0c0 !important;
      color: #000000 !important;
      font-family: 'MS Sans Serif', Tahoma, sans-serif !important;
    }
    html[data-theme="win98"] .theme-btn.active {
      border-top: 2px solid #808080 !important;
      border-left: 2px solid #808080 !important;
      border-right: 2px solid #ffffff !important;
      border-bottom: 2px solid #ffffff !important;
      background: #ffffff !important;
      color: #000080 !important;
      box-shadow: none !important;
    }
    html[data-theme="linuxmint"] .theme-selector {
      background: #252830 !important;
      border-color: #3e4452 !important;
      border-radius: 6px !important;
    }
    html[data-theme="linuxmint"] .theme-btn {
      color: #d3dae3 !important;
      border-radius: 4px !important;
    }
    html[data-theme="linuxmint"] .theme-btn.active {
      background: #87cf3e !important;
      color: #1a1c23 !important;
      border: 1px solid #87cf3e !important;
      font-weight: 700 !important;
    }
    .theme-selector {
      display: flex;
      background: rgba(255, 255, 255, 0.04);
      border: 1px solid var(--border-subtle);
      border-radius: var(--radius-pill);
      padding: 3px;
      gap: 3px;
    }

    .theme-btn {
      background: transparent;
      border: none;
      color: var(--text-dim);
      padding: 4px 10px;
      border-radius: var(--radius-pill);
      font-size: 0.74rem;
      font-weight: 600;
      cursor: pointer;
      font-family: var(--font-mono);
      transition: all var(--transition-fast);
    }

    .theme-btn.active {
      background: linear-gradient(135deg, rgba(0, 240, 255, 0.25), rgba(56, 189, 248, 0.35));
      color: var(--text-main);
      border: 1px solid var(--accent-cyan);
      box-shadow: 0 0 10px rgba(0, 240, 255, 0.2);
    }

/* Adaptation des couleurs du dashboard aux cinq palettes du guide. */
html[data-theme="win98"], html[data-theme="winxp"], html[data-theme="macos"],
html[data-theme="linuxmint"], html[data-theme="void"] {
  --bg: var(--bg-canvas);
  --surface: var(--bg-panel);
  --surface-2: var(--bg-panel-hover);
  --surface-3: var(--bg-pill-hover);
  --bg-card: var(--bg-panel);
  --border: var(--border-subtle);
  --border-light: var(--border-subtle);
  --text: var(--text-main);
  --muted: var(--text-muted);
  --accent: var(--accent-cyan);
  --accent-soft: var(--bg-pill);
  --accent-dark: var(--accent-blue);
  --border-accent: var(--border-bright);
  --shadow: var(--shadow-card);
  --color-primary: var(--bg-panel);
}
html[data-theme="winxp"] { --guide-header-bg: linear-gradient(180deg, #0058ee, #3593ff 25%, #288eff 65%, #0055ea); }
html[data-theme="win98"] { --guide-header-bg: linear-gradient(90deg, #000080, #1084d0); }
html[data-theme="linuxmint"] { --guide-header-bg: #2f343f; }
html[data-theme="void"] { --guide-header-bg: rgba(15, 23, 42, .92); }
html[data-theme="winxp"] .guide-header,
html[data-theme="win98"] .guide-header,
html[data-theme="linuxmint"] .guide-header { --guide-ink: #fff; --guide-muted: #eef3fb; }
html[data-theme="winxp"] .guide-header,
html[data-theme="win98"] .guide-header,
html[data-theme="linuxmint"] .guide-header { color: #fff; }
html[data-theme="winxp"] .guide-header .app-title,
html[data-theme="win98"] .guide-header .app-title,
html[data-theme="linuxmint"] .guide-header .app-title { color: #fff; }
html[data-theme="winxp"] .guide-header .guide-subtitle,
html[data-theme="win98"] .guide-header .guide-subtitle,
html[data-theme="linuxmint"] .guide-header .guide-subtitle { color: #eef3fb; }

/* Neutraliser les fonds sombres codés en dur dans les cartes existantes. */
.guide-dashboard .filter-bar,
.guide-dashboard .app-main > section,
.guide-dashboard .guide-sidebar,
.guide-dashboard .kanban-col,
.guide-dashboard .task-card,
.guide-dashboard .kpi-card { color: var(--text-main); background: var(--bg-panel); border-color: var(--border-subtle); }
.guide-dashboard .kpi-card { background: var(--bg-panel-hover); }
.guide-dashboard .guide-tabs a { color: var(--text-muted); }
.guide-dashboard .guide-tabs a:hover,
.guide-dashboard .guide-tabs a[aria-current] { color: var(--accent-cyan); background: var(--bg-panel); }
.guide-dashboard .guide-sidebar a:hover,
.guide-dashboard .guide-sidebar a:focus-visible { color: var(--accent-cyan); background: var(--bg-pill-hover); }
.guide-dashboard .guide-header .guide-update { display: none; }
html[data-theme="win98"] .guide-dashboard :is(.guide-sidebar,.filter-bar,.app-main > section,.kanban-col,.task-card,.kpi-card) { border-radius: 0; }
html[data-theme="winxp"] .guide-dashboard :is(.guide-sidebar,.filter-bar,.app-main > section,.kanban-col,.task-card,.kpi-card) { border-radius: 6px; }
html[data-theme="linuxmint"] .guide-dashboard :is(.guide-sidebar,.filter-bar,.app-main > section,.kanban-col,.task-card,.kpi-card) { border-radius: 8px; }

/* Sélecteur de cinq onglets visible au même emplacement que dans le guide. */
.theme-selector {
  position: fixed;
  top: 16px;
  right: 18px;
  z-index: 10010;
  background: var(--bg-canvas);
  box-shadow: var(--shadow-card);
  white-space: nowrap;
}
html[data-theme="win98"] .theme-selector { background: #c0c0c0; }
html[data-theme="winxp"] .theme-selector { background: #f8f8f2; }
html[data-theme="macos"] .theme-selector { background: #f5f5f7; }
html[data-theme="linuxmint"] .theme-selector { background: #252830; }
html[data-theme="void"] .theme-selector { background: #0f172a; }
.theme-selector .theme-btn { color: var(--text-dim); }
.theme-btn { line-height: 1.5; min-height: 30px; }
.theme-btn:focus-visible { outline: 2px solid var(--accent-cyan); outline-offset: 2px; }
.guide-dashboard .guide-header { padding-right: 380px; }
@media (max-width: 740px) {
  .theme-selector { top: auto; bottom: 10px; right: 10px; left: 10px; justify-content: space-around; z-index: 10010; }
  .theme-btn { padding: 7px 5px; }
  .guide-dashboard .guide-header { padding-right: 18px; }
  body { padding-bottom: 56px; }
  .theme-switcher-container { bottom: 68px !important; }
  #htmx-update-note { bottom: 68px !important; }
}

/* Contraste partagé par les cinq pages : remplacer les surfaces sombres fixes
   de global.css par les surfaces de la palette active. */
html[data-theme] .app-header { background: var(--bg-panel); color: var(--text-main); }
html[data-theme] .app-header .app-title { color: var(--text-main); }
html[data-theme] .nav-back,
html[data-theme] .tools-notice,
html[data-theme] .filter-bar,
html[data-theme] .kpi-card,
html[data-theme] .kanban-col,
html[data-theme] .timeline,
html[data-theme] .e-banner,
html[data-theme] .section-item,
html[data-theme] .e-footer,
html[data-theme] .tool-card {
  background: var(--bg-panel);
  color: var(--text-main);
  border-color: var(--border-subtle);
}
html[data-theme] .task-card { background: var(--bg-panel-hover); color: var(--text-main); }
html[data-theme] .tools-notice { color: var(--text-muted); border-left-color: var(--accent-cyan); }
html[data-theme] .tool-card__desc { color: var(--text-muted); }
html[data-theme] .tool-card__name { color: var(--text-main); }
html[data-theme] .tool-card__url { color: var(--accent-cyan); }
html[data-theme] .nav-back { color: var(--text-main); }
html[data-theme] .section-body { background: var(--bg-panel); color: var(--text-main); }
html[data-theme] .badge--vps { color: var(--accent-blue); background: var(--bg-pill); }
html[data-theme] .badge--actif { color: var(--badge-positive, #047857); background: var(--bg-pill); }
html[data-theme] .badge--unhealthy { color: var(--badge-negative, #b91c1c); background: var(--bg-pill); }
html[data-theme="void"] { --badge-positive: #34d399; --badge-negative: #f87171; }
html[data-theme="win98"] .app-header,
html[data-theme="winxp"] .app-header,
html[data-theme="linuxmint"] .app-header { background: var(--guide-header-bg); }
html[data-theme="win98"] .app-header .app-title,
html[data-theme="winxp"] .app-header .app-title,
html[data-theme="linuxmint"] .app-header .app-title,
html[data-theme="win98"] .app-header .nav-back,
html[data-theme="winxp"] .app-header .nav-back,
html[data-theme="linuxmint"] .app-header .nav-back { color: #fff; }
html[data-theme="win98"] .app-header .nav-back,
html[data-theme="winxp"] .app-header .nav-back,
html[data-theme="linuxmint"] .app-header .nav-back { background: rgba(0,0,0,.25); border-color: rgba(255,255,255,.5); }
/* La navigation est sous le sélecteur fixe sur les sous-pages. */
html[data-theme] .app-header:not(.guide-header) { padding-right: 390px; }
@media (max-width: 740px) {
  html[data-theme] .app-header:not(.guide-header) { padding-right: 1rem; }
}

/* En thème clair, la teinte vive reste décorative ; les lettres utilisent
   une nuance plus foncée pour rester lisibles sur les cartes claires. */
html[data-theme="linuxmint"] { --accent: #285c00; --accent-cyan: #285c00; }
html[data-theme="macos"] { --accent: #0063c2; --accent-cyan: #0063c2; }
html[data-theme="win98"] { --badge-positive: #005b39; --badge-negative: #8f1515; }
html[data-theme="winxp"] { --badge-positive: #006a4a; }
html[data-theme="void"] .theme-btn { color: #b6c7dd; }
html[data-theme="void"] .theme-btn.active { color: var(--text-main); }
html[data-theme] .badge--tailnet { color: var(--accent); }
html[data-theme="win98"] .badge--vps,
html[data-theme="winxp"] .badge--vps { color: var(--accent); }
html[data-theme="win98"] .section-num,
html[data-theme="winxp"] .section-num,
html[data-theme="macos"] .section-num,
html[data-theme="linuxmint"] .section-num { color: #fff; }
html[data-theme="win98"] .app-footer { color: #fff; }
html[data-theme="win98"] .app-footer a { color: #fff; }
html[data-theme="macos"] .app-footer,
html[data-theme="linuxmint"] .app-footer,
html[data-theme="winxp"] .app-footer { color: var(--text-main); }
html[data-theme="macos"] .badge--vps { color: #004c98; }
html[data-theme="linuxmint"] .badge--vps { color: #00558c; }
html[data-theme="linuxmint"] .badge--actif { color: #005b39; }
html[data-theme="win98"] .proc-card__body code,
html[data-theme="win98"] .proc-table code,
html[data-theme="win98"] .proc-code code { color: #fff !important; }
html[data-theme="win98"] .proc-table .mono { color: #fff; }
html[data-theme="win98"] .proc-card .mono { color: #000; }
html[data-theme="macos"] .path-step span,
html[data-theme="winxp"] .path-step span,
html[data-theme="linuxmint"] .path-step span { color: var(--text-main); }
html[data-theme="macos"] .kpi-card:nth-child(2) .kpi-card__value,
html[data-theme="winxp"] .kpi-card:nth-child(2) .kpi-card__value,
html[data-theme="linuxmint"] .kpi-card:nth-child(2) .kpi-card__value { color: #0865ad; }
html[data-theme="macos"] .kpi-card:nth-child(3) .kpi-card__value,
html[data-theme="winxp"] .kpi-card:nth-child(3) .kpi-card__value,
html[data-theme="linuxmint"] .kpi-card:nth-child(3) .kpi-card__value { color: #047857; }
html[data-theme="macos"] .kpi-card:nth-child(5) .kpi-card__value,
html[data-theme="winxp"] .kpi-card:nth-child(5) .kpi-card__value,
html[data-theme="linuxmint"] .kpi-card:nth-child(5) .kpi-card__value { color: #b91c1c; }
html[data-theme="linuxmint"] .kanban-col__count { color: var(--text-main); }

/* Le contenu préformaté ne doit pas imposer sa largeur à la page mobile. */
html[data-theme] .app-main { width: 100%; min-width: 0; box-sizing: border-box; }
html[data-theme] .app-main > *,
html[data-theme] .proc-card__body > * { min-width: 0; max-width: 100%; }
html[data-theme] .proc-card__body { overflow-wrap: anywhere; }
html[data-theme] .proc-code { box-sizing: border-box; }