« MediaWiki:Vaulttec.css » : différence entre les versions

Navigation interactive dans l’historique
← Modification précédente
Kims (discussion | contributions)
Bureaucrate, commentadmin, emailconfirmed, flow-bot, Administrateurs d’interface, Modérateurs, staff, Masqueurs de modifications, Administrateur
49 827 modifications
Kims (discussion | contributions)
Bureaucrate, commentadmin, emailconfirmed, flow-bot, Administrateurs d’interface, Modérateurs, staff, Masqueurs de modifications, Administrateur
49 827 modifications
Aucun résumé des modifications
Balise : Révoqué
Kims (discussion | contributions)
Bureaucrate, commentadmin, emailconfirmed, flow-bot, Administrateurs d’interface, Modérateurs, staff, Masqueurs de modifications, Administrateur
49 827 modifications
Aucun résumé des modifications
 
(34 versions intermédiaires par le même utilisateur non affichées)
Ligne 1 : Ligne 1 :
/**
/*
  * VaultTec skin — skin.less
  * MediaWiki:Vaulttec.css — v42
  * MediaWiki 1.39+  |  Vector 2022 alternative
  * Chargé uniquement pour les utilisateurs du skin VaultTec.
  *
  *
  * Palette : phosphore vert sur fond noir profond.
  * v42 (optimisation, lot 2 — requiert le skin >= 1.5.0) : sections 19, 37,
  * Typo    : IBM Plex Mono (chrome) + Instrument Serif (titres) + Crimson Pro (corps).
  * 51, 54, 55, 56 migrées dans le skin (chargement conditionnel), section 53
* réduite à son bloc (4). Lot 1 (v41, skin 1.4.0) : sections 18, 28, 42,
* 44, 45, 52 + partie .mw-highlight de la 46. Les numéros manquants sont
* volontaires — ne pas recréer ces sections ici.
  */
  */
/* ============================================================
  1. VARIABLES
  ============================================================ */
:root {
  --background-color-dp-00: #06100b;
  --background-color-dp-01: #0a1a0f;
  --background-color-dp-02: #0f2015;
  --background-color-dp-03: #11251a;
  --background-color-dp-04: #142b1e;
  --background-color-dp-06: #173122;
  --background-color-dp-08: #1a3727;
  --background-color-dp-12: #1e3f2c;
  --background-color-dp-16: #214531;
  --background-color-dp-24: #254c36;
  --background-img:        none;
  --background-main:        transparent;
  --box-background-color:  rgba(12, 24, 18, 0.85);
  --box-shadow:            0 0 10px rgba(125, 255, 156, 0.12);
  --color-base:            #cce8d4;
  --color-warning:          #f5c84a;
  --color-link:            #4ab06a;
  --color-link-visited:    #357a4d;
  --border-color-base:      rgba(125, 255, 156, 0.15);
}


// Polices chargées via Google Fonts CDN — voir templates/skin.mustache
/* ============================================================
 
  2. BODY & CONTAINERS
// ============================================================
  ============================================================ */
// TOKENS
body { background: #06100b !important; background-image: none !important; }
// ============================================================
.mw-page-container { background: transparent !important; border: none !important; max-width: 100% !important; padding: 0 !important; }
@bg:           #06100b;
@bg-panel:     #0c1812;
@bg-elevated:  #111f19;
@bg-infobox:   #0f1c15;
@phosphor:    #7dff9c;
@ph-dim:      #4ab06a;
@ph-faint:    rgba(125, 255, 156, 0.10);
@ph-border:   rgba(125, 255, 156, 0.15);
@ph-border2:  rgba(125, 255, 156, 0.35);
@amber:        #f5c84a;
@amber-faint:  rgba(245, 200, 74, 0.12);
@danger:      #ff5e5e;
@text:         #cce8d4;
@text-dim:     #7aaa88;
@text-muted:  #4a6e55;
@border:      rgba(125, 255, 156, 0.13);
 
@font-mono:    'IBM Plex Mono', 'Courier New', monospace;
@font-serif:  'Instrument Serif', Georgia, serif;
@font-body:    'Crimson Pro', Georgia, serif;


@header-h:     54px;
/* ============================================================
@tab-h:       44px;
  3. LAYOUT
@sidebar-w:   220px;
  ============================================================ */
.vt-page-container { display: flex !important; width: 100% !important; align-items: flex-start !important; min-height: calc(100vh - 54px) !important; }
.vt-sidebar, #mw-panel { width: 220px !important; flex-shrink: 0 !important; }
.vt-content-container, #content { flex: 1 1 auto !important; min-width: 0 !important; width: 0 !important; }
#bodyContent { max-width: none !important; width: 100% !important; padding: 28px 36px 60px !important; }


// ============================================================
/* ============================================================
// Z-INDEX SCALE — référence (ne pas modifier sans coordination)
  4. TOC — rétractable, replié par défaut
// ============================================================
  ============================================================ */
//  9999  .vt-scanlines          (effet CRT, top layer)
/* NOTE (audit) : les styles de toggle ci-dessous (.toctitle cliquable,
//  9998  .vt-vignette            (effet CRT)
  flèche ▸, états .vt-toc-collapsed) supposent un JS qui bascule la
//  1200  #vt-scroll-top          (bouton remonter)
  classe au clic — ce JS n'existe ni dans le skin ni dans
//  1100  .vt-header              (sticky)
  MediaWiki:Vaulttec.js. En pratique le TOC est déplacé dans la colonne
//  1099  .ve-ui-toolbar          (sticky sous header, depuis ve-overrides.less)
  de droite par skins.vaulttec.scripts ; ces règles ne s'appliquent
//  1001  .vt-sidebar            (drawer mobile, au-dessus de l'overlay)
  qu'avant l'exécution du JS (ou sans JS). Conservées pour compat. */
//  999  .vt-drawer-overlay      (overlay drawer mobile, capture les clics)
#mw-content-text .toc, #mw-content-text #toc {
//   950  .vt-toc-sidebar        (desktop > 1200px)
   float: none !important; clear: both !important; position: static !important;
//   800  .vt-toc-sidebar        (mobile/tablet ≤ 1200px)
   width: fit-content !important; max-width: min(300px, 100%) !important; min-width: 160px !important;
//   500  .vt-page-tabs-wrap      (sticky tabs mobile)
   margin: 0 0 20px 0 !important; padding: 0 !important;
//   500  .vt-page-tabs          (sticky tabs desktop, sous le header)
   background: rgba(6, 15, 11, 0.88) !important; border: 1px solid rgba(125, 255, 156, 0.15) !important;
//    2  .vt-content-row        (contexte d'empilement local)
  border-radius: 3px !important; overflow: hidden !important; box-sizing: border-box !important; font-size: 12px !important;
//    1  .vt-scroll-arrow
//    0  .vt-watermark
 
// ============================================================
// RESET & BASE
// ============================================================
* {
box-sizing: border-box;
}
}
 
#mw-content-text .toctitle, #mw-content-text .toc .toctitle {
html,
  display: flex !important; align-items: center !important; justify-content: space-between !important;
body {
  gap: 16px !important; padding: 8px 14px !important; cursor: pointer !important;
background: @bg;
  user-select: none !important; margin: 0 !important; border-bottom: 1px solid transparent !important; white-space: nowrap !important;
color: @text;
font-family: @font-body;
font-size: 16px;
line-height: 1.5;
margin: 0;
padding: 0;
}
}
 
#mw-content-text .toctitle h2, #mw-content-text .toc .toctitle h2 {
a {
  font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; font-weight: 500 !important;
color: @ph-dim;
  text-transform: uppercase !important; letter-spacing: 0.12em !important;
text-decoration: none;
  color: rgba(125, 255, 156, 0.65) !important; margin: 0 !important; padding: 0 !important; border: 0 !important;
transition: color 0.15s;
 
&:hover {
color: @phosphor;
text-decoration: underline;
text-decoration-color: @ph-faint;
}
 
&:visited {
color: darken(@ph-dim, 10%);
}
}
}
 
#mw-content-text .toctitle::after { content: '▸'; color: rgba(125, 255, 156, 0.4); font-size: 9px; flex-shrink: 0; transition: transform 0.2s ease; }
// ============================================================
#mw-content-text .toc:not(.vt-toc-collapsed) .toctitle { border-bottom-color: rgba(125, 255, 156, 0.12) !important; }
// EFFETS CRT
#mw-content-text .toc:not(.vt-toc-collapsed) .toctitle::after { transform: rotate(90deg); }
// ============================================================
#mw-content-text .toc.vt-toc-collapsed > ul { display: none !important; }
.vt-scanlines {
#mw-content-text .toc:not(.vt-toc-collapsed) > ul { display: block !important; padding: 6px 0 8px !important; margin: 0 !important; }
position: fixed;
#mw-content-text .toc ul { list-style: none !important; margin: 0 !important; padding: 0 !important; }
inset: 0;
#mw-content-text .toc li a {
pointer-events: none;
  display: flex !important; align-items: baseline !important; padding: 4px 14px !important;
background: repeating-linear-gradient(
  font-size: 11px !important; color: #7aaa88 !important; font-family: 'IBM Plex Mono', monospace !important;
0deg,
  border-left: 2px solid transparent !important; transition: all 0.15s !important; text-decoration: none !important; white-space: nowrap !important;
transparent 0px,
transparent 2px,
rgba(125, 255, 156, 0.018) 3px,
transparent 4px
);
z-index: 9999;
mix-blend-mode: screen;
}
}
#mw-content-text .toc li a:hover { color: #7dff9c !important; background: rgba(125, 255, 156, 0.08) !important; border-left-color: #4ab06a !important; }
#mw-content-text .toc li li a { padding-left: 24px !important; font-size: 10px !important; color: rgba(125, 255, 156, 0.4) !important; }
.tocnumber { color: rgba(125, 255, 156, 0.35) !important; margin-right: 6px !important; }


.vt-vignette {
/* ============================================================
position: fixed;
  5. INFOBOX
inset: 0;
  ============================================================ */
pointer-events: none;
.avt-infobox, .mw-parser-output .avt-infobox {
background: radial-gradient(ellipse at center, transparent 50%, rgba(0, 0, 0, 0.45) 100%);
  width: 320px !important; max-width: 100% !important; float: right !important; clear: right !important;
z-index: 9998;
  margin: 0 0 1em 1.5em !important; box-sizing: border-box !important;
  background-color: rgba(12, 24, 18, 0.9) !important; border-color: rgba(125, 255, 156, 0.2) !important;
  box-shadow: 0 0 10px rgba(125, 255, 156, 0.12) !important; color: #cce8d4 !important;
}
}
 
@media screen and (max-width: 720px) {
.vt-watermark {
  .avt-infobox, .mw-parser-output .avt-infobox { width: 100% !important; float: none !important; clear: both !important; margin: 0 0 1em 0 !important; }
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-family: @font-serif;
font-style: italic;
font-size: 55vw;
color: @phosphor;
opacity: 0.015;
z-index: 0;
user-select: none;
pointer-events: none;
line-height: 1;
}
}
.avt-infobox-header { background-color: #142b1e !important; border-color: rgba(125, 255, 156, 0.2) !important; color: #7dff9c !important; }
.avt-infobox p.bloc, .avt-infobox caption { background-color: #142b1e !important; color: #7dff9c !important; }
.avt-infobox th[scope="row"] { color: #4ab06a !important; }
.avt-infobox td { color: #cce8d4 !important; }
.infobox-default-image { background-image: url("/images/1/11/Logo_wiki_LAVT_vert.png") !important; }
.avt-infobox caption, .mw-parser-output .avt-infobox caption { display: table-caption !important; width: 100% !important; box-sizing: border-box !important; }


// ============================================================
/* ============================================================
// HEADER
  6. WIKITABLE
// ============================================================
  ============================================================ */
.vt-header {
.wikitable, .va-table, .mw-datatable { background-color: rgba(12, 24, 18, 0.85) !important; border-color: rgba(125, 255, 156, 0.15) !important; color: #cce8d4 !important; }
position: sticky;
.wikitable > tr > th, .wikitable > * > tr > th, .va-table > tr > th, .va-table > * > tr > th { background-color: #0f2015 !important; color: #7dff9c !important; }
top: 0;
.wikitable > tr > td, .wikitable > * > tr > td, .va-table > tr > td, .va-table > * > tr > td { border-color: rgba(125, 255, 156, 0.1) !important; color: #cce8d4 !important; }
z-index: 1100; // au-dessus de la sidebar drawer (1000)
.wikitable tr:hover td { background-color: rgba(125, 255, 156, 0.06) !important; }
height: @header-h;
display: flex;
align-items: center;
background: rgba(6, 16, 11, 0.92);
backdrop-filter: blur(14px);
border-bottom: 1px solid @border;
}


// Logo
/* ============================================================
.vt-logo {
  7. PALETTES & NAVBOXES
flex-shrink: 0;
  ============================================================ */
height: 100%;
.palette { background-color: rgba(12, 24, 18, 0.85) !important; border-color: rgba(125, 255, 156, 0.15) !important; color: #cce8d4 !important; }
border-right: 1px solid @border;
.palette-titre, .palette-banniere, .palette-section, .palette-groupe { background-color: #0f2015 !important; color: #7dff9c !important; }
padding: 0 20px;
.palette-pair { background-color: transparent !important; }
}
.va-infobox-title, .va-navbox-title { background: #0f2015 !important; color: #7dff9c !important; }


.vt-logo-link {
/* ============================================================
display: flex;
  8. BOÎTES GÉNÉRIQUES
align-items: center;
  ============================================================ */
gap: 12px;
.avt-warn-banner, .avt-note-banner, .avt-section-banner, .avt-dropdown-box, .avt-genericbox,
height: 100%;
.homepage-box, .spinoff-box, .avt-content-game-box { background-color: rgba(12, 24, 18, 0.85) !important; border-color: rgba(125, 255, 156, 0.15) !important; color: #cce8d4 !important; }
text-decoration: none !important;
.avt-dropdown-box-title { background-color: #0f2015 !important; color: #7dff9c !important; }


&:hover .vt-logo-mark {
/* Espacement réduit entre bandeaux d'avertissement consécutifs */
background: rgba(125, 255, 156, 0.2);
.mw-parser-output .avt-warn-banner,
box-shadow: 0 0 12px rgba(125, 255, 156, 0.3);
.mw-parser-output .avt-note-banner,
}
.mw-parser-output .avt-section-banner {
  background-color: rgba(12, 24, 18, 0.85) !important;
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
  color: #cce8d4 !important;
  margin-bottom: 4px !important;
  box-shadow: none !important;
}
}


.vt-logo-mark {
/* ============================================================
width: 32px;
  9. LIENS
height: 32px;
  ============================================================ */
border: 1.5px solid @phosphor;
.mw-parser-output a { color: #4ab06a; }
display: flex;
.mw-parser-output a:visited { color: #357a4d; }
align-items: center;
.mw-parser-output a:hover { color: #7dff9c; }
justify-content: center;
.new, a.new { color: #ff5e5e !important; }
font-family: @font-serif;
font-style: italic;
font-size: 18px;
color: @phosphor;
background: @ph-faint;
flex-shrink: 0;
transition: all 0.2s;
}


.vt-logo-text {
/* ============================================================
display: flex;
  10. TOC VECTOR 2022
flex-direction: column;
  ============================================================ */
line-height: 1.15;
.sidebar-toc, .vector-toc { background-color: rgba(12, 24, 18, 0.85) !important; border-color: rgba(125, 255, 156, 0.15) !important; }
}
.vector-toc .vector-toc-link, .sidebar-toc .sidebar-toc-link { color: #4ab06a !important; }
.vector-toc .vector-toc-link:hover, .sidebar-toc .sidebar-toc-link:hover { color: #7dff9c !important; }


.vt-logo-sup {
/* ============================================================
font-family: @font-mono;
  11. PORTAILS & ACCUEIL
font-size: 9px;
  ============================================================ */
letter-spacing: 0.28em;
.homepage-box-title, .portal-box-title, .spinoff-box-title, .canceled-box-title, .fangame-box-title,
color: @text-muted;
.homepage-presentation-title, .homepage-participation-title, .homepage-articleday-title {
text-transform: uppercase;
  color: #7dff9c !important; text-shadow: 0 0 8px rgba(125, 255, 156, 0.4) !important; border-color: rgba(125, 255, 156, 0.15) !important;
}
}


.vt-logo-name {
/* ============================================================
font-family: @font-serif;
  12. SITENOTICE
font-style: italic;
  ============================================================ */
font-size: 17px;
.avt-sitenotice { background-color: rgba(12, 24, 18, 0.9) !important; border-color: rgba(125, 255, 156, 0.2) !important; color: #cce8d4 !important; }
color: @text;
letter-spacing: 0.01em;
}


// Recherche
/* ============================================================
.vt-search {
  13. RECHERCHE — dropdown miniatures (header)
flex: 1;
  ============================================================ */
padding: 0 20px;
.vt-search { position: relative !important; }
.vt-search-dropdown { display: none; position: absolute; top: calc(100% + 2px); left: 0; width: 420px; max-width: calc(100vw - 40px); background: rgba(8, 18, 12, 0.98); border: 1px solid rgba(125, 255, 156, 0.2); border-top: none; z-index: 500; box-shadow: 0 12px 32px rgba(0, 0, 0, 0.7); backdrop-filter: blur(8px); }
.vt-search-item { display: flex; align-items: center; gap: 12px; padding: 9px 14px; color: #cce8d4; text-decoration: none !important; border-bottom: 1px solid rgba(125, 255, 156, 0.07); font-family: 'Crimson Pro', Georgia, serif; font-size: 15px; transition: background 0.1s; }
.vt-search-item:hover { background: rgba(125, 255, 156, 0.07); color: #7dff9c !important; text-decoration: none !important; }
.vt-search-thumb { width: 40px; height: 40px; flex-shrink: 0; background: rgba(125, 255, 156, 0.05); border: 1px solid rgba(125, 255, 156, 0.12); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.vt-search-thumb img { width: 40px; height: 40px; object-fit: cover; display: block; }
.vt-search-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vt-search-title mark { background: none; color: #7dff9c; font-weight: 700; }
.vt-search-footer { display: block; padding: 10px 14px; font-family: 'IBM Plex Mono', monospace; font-size: 10px; letter-spacing: 0.1em; color: rgba(125, 255, 156, 0.4); text-decoration: none !important; text-transform: uppercase; border-top: 1px dashed rgba(125, 255, 156, 0.1); background: rgba(125, 255, 156, 0.02); }
.vt-search-footer:hover { color: #7dff9c !important; background: rgba(125, 255, 156, 0.06); text-decoration: none !important; }


form {
/* ============================================================
display: flex;
  14. BOUTON RECHERCHE — loupe
gap: 6px;
  ============================================================ */
max-width: 380px;
.vt-search input.searchButton, .vt-search #searchButton { text-indent: -9999px !important; overflow: hidden !important; width: 42px !important; min-width: 42px !important; padding: 0 !important; flex-shrink: 0 !important; background-color: rgba(125, 255, 156, 0.10) !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%237dff9c' d='M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: center !important; background-size: 18px !important; border: 1px solid rgba(125, 255, 156, 0.35) !important; cursor: pointer !important; }
}
.vt-search input.searchButton:hover, .vt-search #searchButton:hover { background-color: rgba(125, 255, 156, 0.2) !important; }


input[type='search'],
/* ============================================================
input[type='text'],
  15. DARK MODE — icône parasite
.oo-ui-inputWidget-input {
  ============================================================ */
background: @bg-panel;
.ext-darkmode-link::before, .ext-darkmode-link:before { display: none !important; content: none !important; }
border: 1px solid @ph-border;
color: @phosphor;
font-family: @font-mono;
font-size: 12px;
padding: 7px 14px;
width: 100%;
letter-spacing: 0.05em;
transition: border-color 0.15s;


&::placeholder {
/* ============================================================
color: @text-muted;
  16. CATÉGORIES
}
  ============================================================ */
#catlinks { background-color: rgba(12, 24, 18, 0.85) !important; border-top: 1px solid rgba(125, 255, 156, 0.15) !important; border-bottom: none !important; padding: 10px 36px !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; letter-spacing: 0.1em !important; color: #7aaa88 !important; }
#catlinks a { color: #4ab06a !important; text-decoration: none !important; text-transform: uppercase !important; letter-spacing: 0.12em !important; font-size: 10px !important; }
#catlinks a:hover { color: #7dff9c !important; }
#mw-normal-catlinks > a:first-child { display: none !important; }
#catlinks ul { display: inline !important; list-style: none !important; margin: 0 !important; padding: 0 !important; }
#catlinks ul li { display: inline !important; }
#catlinks ul li::before { content: '·' !important; margin: 0 6px !important; color: rgba(125, 255, 156, 0.25) !important; }
#catlinks.catlinks-allhidden { display: none !important; }


&:focus {
/* ============================================================
outline: none;
  17. TITRES — structure MW 1.44+, sizing fluide responsive
border-color: @phosphor;
  ============================================================ */
box-shadow: 0 0 0 1px @ph-faint;
.mw-parser-output .mw-heading { display: flex !important; align-items: baseline !important; border-bottom: 1px solid rgba(125, 255, 156, 0.13) !important; margin: 22px 0 10px !important; padding-bottom: 6px !important; }
}
.mw-parser-output .mw-heading h2, .mw-parser-output > h2 { display: block !important; flex: 1 !important; border-bottom: 0 !important; margin: 0 !important; padding-bottom: 0 !important; font-family: 'Instrument Serif', Georgia, serif !important; font-style: italic !important; font-size: clamp(1.25rem, 1.05rem + 1vw, 1.625rem) !important; line-height: 1.25 !important; color: #cce8d4 !important; text-align: left !important; }
}
.mw-parser-output .mw-heading h3, .mw-parser-output > h3 { font-size: clamp(0.95rem, 0.85rem + 0.5vw, 1.1rem) !important; line-height: 1.3 !important; margin: 0 !important; flex: 1 !important; }
.mw-parser-output .mw-heading h4, .mw-parser-output > h4 { font-size: clamp(0.875rem, 0.8rem + 0.3vw, 1rem) !important; line-height: 1.3 !important; margin: 0 !important; flex: 1 !important; }
.mw-parser-output .mw-heading h5, .mw-parser-output > h5, .mw-parser-output .mw-heading h6, .mw-parser-output > h6 { font-size: 0.9rem !important; line-height: 1.3 !important; margin: 0 !important; flex: 1 !important; }
.mw-parser-output .mw-heading .mw-editsection { flex-shrink: 0 !important; margin-left: 12px !important; }
.mw-parser-output .mw-heading-3, .mw-parser-output .mw-heading-4, .mw-parser-output .mw-heading-5, .mw-parser-output .mw-heading-6 { margin: 16px 0 8px !important; padding-bottom: 4px !important; }
.mw-parser-output .mw-heading + .mw-heading { margin-top: 6px !important; }


button,
/* ============================================================
input[type='submit'] {
  18. MODIFICATIONS RÉCENTES — filtres OOUI + légende
background: @ph-faint;
  → MIGRÉE dans le skin : skinStyles/mediawiki.rcfilters.less + mediawiki.special.changeslist.less
border: 1px solid @ph-border2;
  ============================================================ */
color: @phosphor;
/* ============================================================
font-family: @font-mono;
  19. OOUI — fonds blancs résiduels
font-size: 11px;
  → MIGRÉE dans le skin : skinStyles/oojs-ui-core.less
letter-spacing: 0.15em;
  ============================================================ */
padding: 7px 14px;
/* ============================================================
cursor: pointer;
  20. ÉDITEUR — formulaire uniquement (pas de CodeMirror)
text-transform: uppercase;
  ============================================================ */
transition: all 0.15s;
#editform, .editOptions, .wikiEditor-ui, .wikiEditor-ui-toolbar, .wikiEditor-ui-text { background-color: rgba(12, 24, 18, 0.9) !important; border-color: rgba(125, 255, 156, 0.15) !important; color: #cce8d4 !important; }
flex-shrink: 0;
#wpTextbox1, .wikiEditor-ui-text textarea { background-color: #060f0b !important; color: #cce8d4 !important; border-color: rgba(125, 255, 156, 0.2) !important; }
.wikiEditor-ui-toolbar { background: #0f2015 !important; border-bottom: 1px solid rgba(125, 255, 156, 0.15) !important; }
.wikiEditor-ui-toolbar .group { border-right-color: rgba(125, 255, 156, 0.1) !important; }
.wikiEditor-ui-toolbar .tool:hover { background: rgba(125, 255, 156, 0.08) !important; }
#wpSave, #wpPreview, #wpDiff, .editButtons input[type="submit"] { background-color: rgba(12, 24, 18, 0.9) !important; border: 1px solid rgba(125, 255, 156, 0.3) !important; color: #4ab06a !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; letter-spacing: 0.1em !important; cursor: pointer !important; transition: all 0.15s !important; }
#wpSave:hover, #wpPreview:hover, #wpDiff:hover, .editButtons input[type="submit"]:hover { background-color: rgba(125, 255, 156, 0.1) !important; color: #7dff9c !important; border-color: rgba(125, 255, 156, 0.5) !important; }
#wpSave { background-color: rgba(125, 255, 156, 0.12) !important; color: #7dff9c !important; border-color: rgba(125, 255, 156, 0.4) !important; }
.editButtons .mw-editbutton-cancel { color: rgba(125, 255, 156, 0.4) !important; }
#wpSummary, #wpSummaryWidget input { background-color: #060f0b !important; border-color: rgba(125, 255, 156, 0.2) !important; color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important; }
#wpSummary:focus, #wpSummaryWidget input:focus { border-color: #7dff9c !important; outline: none !important; box-shadow: 0 0 0 2px rgba(125, 255, 156, 0.12) !important; }
.editCheckboxes label, .editOptions label { color: #7aaa88 !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; }
.editpage-head-copywarn, #editpage-copywarn { color: #4a6e55 !important; font-size: 11px !important; }


&:hover {
/* ============================================================
background: @phosphor;
  21. MOBILE — onglets défilants
color: @bg;
  ============================================================ */
}
@media screen and (max-width: 720px) {
}
  .vt-page-tabs { overflow-x: auto !important; overflow-y: hidden !important; -webkit-overflow-scrolling: touch !important; scrollbar-width: thin !important; flex-wrap: nowrap !important; height: auto !important; min-height: 44px !important; padding: 0 8px !important; }
  .vt-page-tabs::-webkit-scrollbar { height: 3px !important; }
  .vt-page-tabs::-webkit-scrollbar-thumb { background: rgba(125, 255, 156, 0.2) !important; }
  .vt-tabs-ns ul, .vt-tabs-views ul, .vt-tabs-more ul { flex-wrap: nowrap !important; white-space: nowrap !important; }
  .vt-page-tabs li a { white-space: nowrap !important; padding: 0 10px !important; font-size: 10px !important; }
  .vt-tabs-sep { display: none !important; }
}
}


// Outils utilisateur
/* ============================================================
.vt-user-tools {
  22. TITRE DE PAGE — padding cohérent
flex-shrink: 0;
  ============================================================ */
height: 100%;
#firstHeading, #mw-content-subtitle { padding-left: 36px !important; padding-right: 36px !important; }
border-left: 1px solid @border;
padding: 0 8px;
display: flex;
align-items: center;


ul {
/* ============================================================
display: flex;
  23. NAV PRIMAIRE — masquer si vide
list-style: none;
  ============================================================ */
margin: 0;
.vt-nav-primary:not(:has(a)) { display: none !important; width: 0 !important; padding: 0 !important; border: none !important; }
padding: 0;
gap: 2px;
}


li a {
/* ============================================================
font-family: @font-mono;
  24. FIXES SKIN
font-size: 11px;
  ============================================================ */
letter-spacing: 0.1em;
html body .CodeMirror { padding: 0 !important; }
color: @text-dim;
/* NOTE : la règle .vt-drawer-overlay { pointer-events: none } a été retirée car
padding: 0 12px;
  elle contredisait le comportement attendu de l'overlay (capture des clics
height: @header-h;
  pour fermer le drawer). Le skin.less gère cette propriété correctement
display: flex;
  en distinguant l'état fermé (none) et ouvert (auto). */
align-items: center;
@media screen and (min-width: 901px) { .vt-drawer-close { display: none !important; } }
text-transform: uppercase;
.vt-watermark { display: none !important; }
text-decoration: none;
@media screen and (max-width: 900px) {
transition: all 0.15s;
  .vt-user-tools { overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; max-width: calc(100vw - 180px); flex-shrink: 1; }
  .vt-user-tools::-webkit-scrollbar { display: none; }
  .vt-user-tools ul { flex-wrap: nowrap; }
  .vt-user-tools li a { padding: 0 8px; font-size: 10px; letter-spacing: 0.06em; }
}
@media screen and (max-width: 600px) { #pt-preferences, #pt-watchlist { display: none; } }


&:hover {
/* ============================================================
color: @phosphor;
  25. MEDIAUPLOADER — Spécial:MediaUploader
background: @ph-faint;
  ============================================================ */
}
#upload-wizard { background: rgba(12, 24, 18, 0.6); border: 1px solid rgba(125, 255, 156, 0.15); color: #cce8d4; padding: 24px; border-radius: 4px; margin-top: 16px; }
}
#upload-wizard .ui-widget, #upload-wizard .ui-widget-content, #upload-wizard .ui-state-default, #upload-wizard .ui-corner-all, #upload-wizard .ui-corner-top, #upload-wizard .ui-corner-bottom, #upload-wizard .mediauploader-form { background-color: transparent !important; border-color: transparent !important; color: inherit !important; }
#mediauploader-steps, #mediauploader-steps.arrowSteps { background: rgba(6, 15, 11, 0.8) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 4px; padding: 0 !important; margin: 0 0 24px 0 !important; list-style: none; display: flex !important; overflow: hidden; height: auto !important; }
#mediauploader-steps li, #mediauploader-steps.arrowSteps li { flex: 1; padding: 14px 6px !important; background: transparent !important; background-image: none !important; color: rgba(125, 255, 156, 0.4) !important; text-transform: uppercase; letter-spacing: 0.05em; font-size: 10px !important; font-family: 'IBM Plex Mono', monospace !important; font-weight: 500; border: 0 !important; border-right: 1px solid rgba(125, 255, 156, 0.15) !important; margin: 0 !important; text-align: center; line-height: 1.3 !important; height: auto !important; min-height: 0 !important; white-space: normal !important; overflow: visible !important; text-overflow: clip !important; word-break: keep-all; }
#mediauploader-steps li::before, #mediauploader-steps li::after, #mediauploader-steps.arrowSteps li::before, #mediauploader-steps.arrowSteps li::after { display: none !important; content: none !important; }
#mediauploader-steps li:last-child { border-right: 0 !important; }
#mediauploader-steps li.arrow, #mediauploader-steps li.current, #mediauploader-steps li.mediauploader-step-current { background: rgba(125, 255, 156, 0.12) !important; color: #7dff9c !important; box-shadow: inset 0 -2px 0 #7dff9c; }
#mediauploader-steps li.completed, #mediauploader-steps li.mediauploader-step-completed { color: #4ab06a !important; }
#mediauploader-content, .mediauploader-stepdiv { color: #cce8d4; }
.mediauploader-stepdiv h2, .mediauploader-stepdiv h3 { color: #7dff9c !important; font-family: 'IBM Plex Mono', monospace !important; font-weight: 500 !important; text-transform: uppercase; letter-spacing: 0.05em; border-bottom: 1px solid rgba(125, 255, 156, 0.2); padding-bottom: 8px; margin-top: 24px; }
#mediauploader-filelist, #mediauploader-filelist.ui-corner-all { background: transparent !important; border: 0 !important; padding: 0 !important; }
.mediauploader-file { background: rgba(6, 15, 11, 0.8) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 4px !important; padding: 16px !important; margin-bottom: 12px !important; color: #cce8d4 !important; }
.mediauploader-file.filled { border-color: rgba(125, 255, 156, 0.35) !important; }
#upload-wizard .mediauploader-visible-file, #upload-wizard .mediauploader-visible-file.ui-corner-top.ui-corner-bottom { background-color: rgba(6, 15, 11, 0.7) !important; border: 1px solid rgba(125, 255, 156, 0.15) !important; border-radius: 4px !important; padding: 16px 20px !important; color: #cce8d4 !important; }
#upload-wizard .mediauploader-visible-file-filename, #upload-wizard .mediauploader-file-texts, #upload-wizard .mediauploader-file-preview { background-color: transparent !important; }
#upload-wizard .mediauploader-visible-file-filename-text { color: #7dff9c !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 13px !important; font-weight: 500; }
.mediauploader-file-status-line { color: rgba(168, 230, 184, 0.7) !important; font-size: 12px; font-style: italic; margin-top: 4px; }
.mediauploader-file-indicator { background: transparent !important; }
#upload-wizard .mediauploader-thumbnail, #upload-wizard .mediauploader-thumbnail-side { background-color: transparent !important; position: relative !important; }
#upload-wizard .mediauploader-add-file, #upload-wizard .oo-ui-selectFileInputWidget, #upload-wizard .oo-ui-selectFileWidget { background: rgba(6, 15, 11, 0.6) !important; background-image: none !important; border: 2px dashed rgba(125, 255, 156, 0.25) !important; border-radius: 4px !important; padding: 16px 20px !important; color: #cce8d4 !important; transition: all 0.2s ease; box-shadow: none !important; }
#upload-wizard .mediauploader-add-file:hover, #upload-wizard .oo-ui-selectFileWidget-canDrop { border-color: #7dff9c !important; background: rgba(125, 255, 156, 0.05) !important; }
#upload-wizard .oo-ui-selectFileInputWidget-info, #upload-wizard .oo-ui-selectFileInputWidget-info.oo-ui-textInputWidget { background: transparent !important; background-image: none !important; border: 0 !important; box-shadow: none !important; color: rgba(168, 230, 184, 0.6) !important; }
#upload-wizard .oo-ui-selectFileInputWidget-info input[type="search"], #upload-wizard .oo-ui-selectFileInputWidget-info .oo-ui-inputWidget-input { background: transparent !important; background-image: none !important; color: rgba(168, 230, 184, 0.6) !important; border: 0 !important; box-shadow: none !important; font-style: italic; }
#upload-wizard .oo-ui-selectFileInputWidget-info input[type="search"]::placeholder { color: rgba(168, 230, 184, 0.5) !important; font-style: italic; }
#upload-wizard .oo-ui-selectFileInputWidget-dropLabel, #upload-wizard .oo-ui-selectFileWidget-dropLabel { background: transparent !important; color: rgba(168, 230, 184, 0.6) !important; font-style: italic; }
#upload-wizard .oo-ui-selectFileInputWidget-selectButton { background: transparent !important; }
#upload-wizard .oo-ui-buttonElement > .oo-ui-buttonElement-button, .mediauploader-stepdiv .oo-ui-buttonElement > .oo-ui-buttonElement-button { background: rgba(12, 24, 18, 0.9) !important; background-image: none !important; border: 1px solid rgba(125, 255, 156, 0.3) !important; color: #4ab06a !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; text-transform: uppercase !important; letter-spacing: 0.12em !important; padding: 8px 18px !important; border-radius: 2px !important; box-shadow: none !important; text-shadow: none !important; transition: all 0.2s ease; min-height: 36px !important; }
#upload-wizard .oo-ui-buttonElement > .oo-ui-buttonElement-button:hover, .mediauploader-stepdiv .oo-ui-buttonElement > .oo-ui-buttonElement-button:hover { background: rgba(125, 255, 156, 0.1) !important; color: #7dff9c !important; border-color: rgba(125, 255, 156, 0.6) !important; }
#upload-wizard .oo-ui-flaggedElement-primary > .oo-ui-buttonElement-button, #upload-wizard .oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button, .mediauploader-stepdiv .oo-ui-flaggedElement-primary > .oo-ui-buttonElement-button, .mediauploader-stepdiv .oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button { background: rgba(125, 255, 156, 0.15) !important; color: #7dff9c !important; border-color: #7dff9c !important; font-weight: 500 !important; }
#upload-wizard .oo-ui-flaggedElement-primary > .oo-ui-buttonElement-button:hover, #upload-wizard .oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover { background: rgba(125, 255, 156, 0.25) !important; color: #cdffd6 !important; box-shadow: 0 0 12px rgba(125, 255, 156, 0.3) !important; }
#upload-wizard .oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button, .mediauploader-stepdiv .oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button { background: rgba(255, 122, 122, 0.08) !important; color: #ff7a7a !important; border-color: rgba(255, 122, 122, 0.4) !important; }
#upload-wizard .oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:hover { background: rgba(255, 122, 122, 0.15) !important; color: #ff9a9a !important; }
#upload-wizard .oo-ui-widget-disabled .oo-ui-buttonElement-button, .mediauploader-stepdiv .oo-ui-widget-disabled .oo-ui-buttonElement-button { opacity: 0.4 !important; cursor: not-allowed !important; }
#upload-wizard .oo-ui-iconElement-icon, .mediauploader-stepdiv .oo-ui-iconElement-icon { filter: brightness(0) saturate(100%) invert(91%) sepia(15%) saturate(594%) hue-rotate(76deg) brightness(101%) contrast(101%); opacity: 0.85; }
#upload-wizard input[type="text"], #upload-wizard input[type="number"], #upload-wizard textarea, #upload-wizard .oo-ui-textInputWidget input, #upload-wizard .oo-ui-textInputWidget textarea, #upload-wizard .oo-ui-multilineTextInputWidget textarea { background: rgba(6, 15, 11, 0.9) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 13px !important; padding: 8px 12px !important; border-radius: 2px !important; box-shadow: none !important; }
#upload-wizard input:focus, #upload-wizard textarea:focus, #upload-wizard .oo-ui-textInputWidget input:focus, #upload-wizard .oo-ui-textInputWidget textarea:focus, #upload-wizard .oo-ui-multilineTextInputWidget textarea:focus { border-color: #7dff9c !important; outline: 0 !important; box-shadow: 0 0 0 2px rgba(125, 255, 156, 0.15) !important; }
#upload-wizard .oo-ui-progressBarWidget, #upload-wizard .mediauploader-progress { background: rgba(6, 15, 11, 0.9) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 2px; overflow: hidden; height: 8px; }
#upload-wizard .oo-ui-progressBarWidget-bar, #upload-wizard .mediauploader-progress-bar { background: linear-gradient(90deg, #4ab06a, #7dff9c) !important; height: 100% !important; transition: width 0.3s ease; }
#upload-wizard .errorbox, .mediauploader-error { background: rgba(255, 94, 94, 0.1) !important; border: 1px solid rgba(255, 94, 94, 0.4) !important; color: #ff9a9a !important; padding: 12px !important; border-radius: 4px; }
#upload-wizard .successbox, .mediauploader-success { background: rgba(125, 255, 156, 0.08) !important; border: 1px solid rgba(125, 255, 156, 0.4) !important; color: #7dff9c !important; padding: 12px !important; border-radius: 4px; }
#upload-wizard .warningbox, .mediauploader-warning { background: rgba(245, 200, 74, 0.1) !important; border: 1px solid rgba(245, 200, 74, 0.4) !important; color: #f5c84a !important; padding: 12px !important; border-radius: 4px; }
#upload-wizard a { color: #7dff9c !important; text-decoration: none; border-bottom: 1px solid rgba(125, 255, 156, 0.3); }
#upload-wizard a:hover { color: #cdffd6 !important; border-bottom-color: #7dff9c; }
.mediauploader-unavailable, .mw-special-MediaUploader #mw-content-text > p:first-child { background: rgba(6, 15, 11, 0.6); border: 1px solid rgba(125, 255, 156, 0.2); border-left: 3px solid #f5c84a; padding: 16px 20px; color: #cce8d4; border-radius: 4px; }
#mediauploader-deeds-thumbnails { background-color: transparent !important; border-radius: 2px; text-align: center; margin: 1em 0; }
#mediauploader-deeds-thumbnails .mediauploader-thumbnail { background: transparent !important; }
#mediauploader-deeds-thumbnails canvas { filter: brightness(0.8) sepia(1) hue-rotate(76deg) saturate(0.5); opacity: 0.7; }


// Bouton créer un compte / déconnexion : highlight
/* ============================================================
#pt-createaccount a,
  26. PAGE D'ACCUEIL — Grille responsive
#pt-logout a {
  ============================================================ */
background: @phosphor;
.homepage { display: grid; grid-template-columns: 1fr 1fr; grid-template-areas: "welcome welcome" "games games" "autres theme" "anecdotes articleday" "presentation participation"; gap: 16px; width: 100%; box-sizing: border-box; }
color: @bg !important;
.homepage-welcome { grid-area: welcome; }
font-weight: 600;
.homepage-portal-games { grid-area: games; }
margin-left: 4px;
.homepage-portal-autres { grid-area: autres; }
.homepage-portal-theme { grid-area: theme; }
.homepage-anecdotes { grid-area: anecdotes; }
.homepage-articleday { grid-area: articleday; }
.homepage-presentation { grid-area: presentation; }
.homepage-participation { grid-area: participation; }
.homepage-box { background: rgba(6, 15, 11, 0.7); border: 1px solid rgba(125, 255, 156, 0.15); border-radius: 4px; overflow: hidden; }
.homepage-box-title { background: rgba(125, 255, 156, 0.07); border-bottom: 1px solid rgba(125, 255, 156, 0.2); color: #7dff9c; font-family: 'IBM Plex Mono', monospace; font-size: 11px; font-weight: 500; text-transform: uppercase; letter-spacing: 0.12em; padding: 10px 16px; margin: 0; text-align: center; }
.homepage-box-content { padding: 16px; color: #cce8d4; }
.homepage-box-content a { color: #7dff9c; text-decoration: none; border-bottom: 1px solid rgba(125, 255, 156, 0.3); }
.homepage-box-content a:hover { color: #cdffd6; border-bottom-color: #7dff9c; }
.homepage-welcome { background: rgba(6, 15, 11, 0.7) !important; border: 1px solid rgba(125, 255, 156, 0.15) !important; border-radius: 4px !important; overflow: hidden; padding: 0 !important; text-align: center; }
.homepage-welcome-title { background: rgba(125, 255, 156, 0.07); border-bottom: 1px solid rgba(125, 255, 156, 0.2); color: #7dff9c !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; font-weight: 500; font-style: normal !important; text-transform: uppercase; letter-spacing: 0.12em; padding: 10px 16px; margin: 0; text-shadow: none !important; }
html body .homepage-welcome .logo-light, html body .homepage .logo-light { display: none !important; }
html body .homepage-welcome .logo-dark, html body .homepage .logo-dark { display: inline !important; }
.logo-accueil { margin: 20px auto; background: transparent !important; display: block; }
.logo-accueil img { max-width: 340px; width: 100%; height: auto; filter: drop-shadow(0 0 16px rgba(125, 255, 156, 0.2)); }
.homepage-welcome-subtitle { color: #cce8d4; font-size: 0.95em; margin: 6px 16px; line-height: 1.6; }
.homepage-welcome-subtitle a { color: #7dff9c !important; border-bottom: 1px solid rgba(125, 255, 156, 0.3); text-decoration: none; }
.homepage-welcome-subtitle a:hover { color: #cdffd6 !important; }
.homepage-welcome-links { margin: 20px 16px; display: flex; justify-content: center; align-items: center; gap: 20px; flex-wrap: wrap; border-top: 1px solid rgba(125, 255, 156, 0.1); padding-top: 16px; }
.homepage-welcome-links img { transition: filter 0.2s ease, transform 0.2s ease; }
.homepage-welcome-links img:hover { filter: brightness(1.15) drop-shadow(0 0 8px rgba(125, 255, 156, 0.4)); transform: scale(1.06); }
.homepage-portal-games-list { display: flex; flex-wrap: wrap; list-style: none; padding: 8px; margin: 0; gap: 12px; justify-content: center; }
.homepage-portal-games-item { flex: 0 0 calc(25% - 12px); max-width: 130px; text-align: center; color: #cce8d4; }
.homepage-portal-games-logo { margin-bottom: 6px; display: flex; justify-content: center; align-items: center; height: 70px; }
.homepage-portal-games-logo img { max-width: 100%; max-height: 70px; width: auto; height: auto; transition: filter 0.2s ease, transform 0.2s ease; }
.homepage-portal-games-logo img:hover { filter: brightness(1.2) drop-shadow(0 0 8px rgba(125, 255, 156, 0.4)); transform: scale(1.07); }
.homepage-portal-games-item div:last-child a, .homepage-portal-games-item em a, .homepage-portal-games-item i a { color: #7dff9c !important; font-size: 12px; text-decoration: none; border-bottom: 1px solid rgba(125, 255, 156, 0.3); font-style: italic; }
.homepage-portal-autres-list { display: flex; flex-wrap: wrap; list-style: none; padding: 8px; margin: 0; gap: 16px; justify-content: center; }
.homepage-portal-autres-list .homepage-portal-games-item { flex: 0 0 calc(33% - 16px); max-width: 150px; }
.homepage-portal-autres-list .homepage-portal-games-logo { height: 90px; }
.homepage-portal-autres-list .homepage-portal-games-logo img { max-height: 90px; }
.homepage-portal-theme .liste-horizontale ul { display: flex; flex-wrap: wrap; list-style: none; padding: 4px; margin: 0; gap: 6px; justify-content: center; }
.homepage-portal-theme .liste-horizontale li { background: rgba(125, 255, 156, 0.06); border: 1px solid rgba(125, 255, 156, 0.15); border-radius: 2px; padding: 5px 10px; list-style: none; margin: 0; }
.homepage-portal-theme .liste-horizontale li::before { display: none; }
.homepage-portal-theme .liste-horizontale li a { color: #7dff9c !important; font-family: 'IBM Plex Mono', monospace; font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; text-decoration: none; border-bottom: 0; }
.homepage-portal-theme .liste-horizontale li a:hover { color: #cdffd6 !important; }
@media screen and (max-width: 720px) {
  .nomobile { display: none !important; }
  .homepage { grid-template-columns: 1fr; grid-template-areas: "welcome" "games" "autres" "theme" "anecdotes" "articleday" "presentation" "participation"; gap: 10px; padding: 8px; }
  .homepage-welcome, .homepage-welcome.nomobile { display: block !important; grid-area: welcome !important; }
  .homepage-welcome .logo-accueil { display: none !important; }
  .homepage-welcome-title { font-size: 10px !important; padding: 8px 12px; }
  .homepage-welcome-subtitle { font-size: 0.85em; margin: 4px 12px; }
  .homepage-welcome-links { margin: 12px; gap: 12px; padding-top: 12px; }
  .homepage-portal-games-list { gap: 8px; padding: 8px 4px; }
  .homepage-portal-games-item { flex: 0 0 calc(50% - 8px); max-width: none; }
  .homepage-portal-games-logo { height: 55px; }
  .homepage-portal-games-logo img { max-height: 55px; }
  .homepage-portal-autres-list .homepage-portal-games-item { flex: 0 0 100%; max-width: none; display: flex; align-items: center; gap: 12px; text-align: left; }
  .homepage-portal-autres-list .homepage-portal-games-logo { height: 50px; min-width: 60px; flex-shrink: 0; }
  .homepage-portal-theme .liste-horizontale li { padding: 4px 8px; font-size: 10px; }
  .homepage-box-title { font-size: 10px; padding: 8px 12px; letter-spacing: 0.1em; }
  .homepage-box-content { padding: 12px; font-size: 14px; }
}
@media screen and (min-width: 721px) { .mobileonly { display: none !important; } }
@media screen and (min-width: 721px) and (max-width: 1100px) {
  .homepage-portal-games-item { flex: 0 0 calc(25% - 12px); }
  .homepage-portal-games-logo { height: 60px; }
  .homepage-portal-games-logo img { max-height: 60px; }
}


&:hover {
/* ============================================================
background: lighten(@phosphor, 10%);
  27. LISIBILITÉ — Taille du texte des articles
}
  ============================================================ */
}
.mw-parser-output { font-size: 17px; line-height: 1.75; }
#firstHeading { font-size: clamp(1.5rem, 1.2rem + 1.5vw, 2.25rem) !important; line-height: 1.2 !important; margin-bottom: 8px !important; }
@media screen and (max-width: 900px) {
  .mw-editsection, .mw-editsection-bracket, .mw-editsection-divider { display: none !important; }
  .mw-parser-output .mw-heading h2, .mw-parser-output .mw-heading h3, .mw-parser-output .mw-heading h4, .mw-parser-output .mw-heading h5, .mw-parser-output .mw-heading h6 { word-break: normal !important; overflow-wrap: normal !important; hyphens: none !important; white-space: normal !important; }
  #bodyContent { padding: 16px 16px 40px !important; }
  #firstHeading, #mw-content-subtitle { padding-left: 16px !important; padding-right: 16px !important; }
}
}


// ============================================================
/* ============================================================
// PAGE CONTAINER
  28. VISUAL EDITOR — Toolbar sticky + surface + popups
// ============================================================
  → MIGRÉE dans le skin : skinStyles/ve-overrides.less + oojs-ui-windows.less
.vt-page-container {
  ============================================================ */
display: flex;
/* ============================================================
min-height: calc(100vh - @header-h - 56px);
  29. LECTEUR AUDIO — thème phosphore
position: relative;
  ============================================================ */
z-index: 2;
.mw-tmh-player,
.mediaContainer {
  display: block !important;
  width: 100% !important;
  max-width: 440px !important;
  margin: 12px auto !important;
  background: rgba(6, 15, 11, 0.85) !important;
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
  border-radius: 3px !important;
  padding: 8px !important;
  box-sizing: border-box !important;
}
.mw-parser-output audio,
audio.mw-file-element,
.mw-parser-output audio.mw-file-element,
audio.oo-ui-widget {
  display: block !important;
  width: 100% !important;
  max-width: 440px !important;
  min-width: 280px !important;
  height: 40px !important;
  margin: 12px auto !important;
  background: rgba(6, 15, 11, 0.9) !important;
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
  border-radius: 3px !important;
  outline: none !important;
  accent-color: #7dff9c !important;
}
.mw-parser-output audio::-webkit-media-controls-panel,
audio.mw-file-element::-webkit-media-controls-panel { background: rgba(6, 15, 11, 0.95) !important; border-radius: 3px !important; }
.mw-parser-output audio::-webkit-media-controls-play-button,
.mw-parser-output audio::-webkit-media-controls-mute-button,
audio.mw-file-element::-webkit-media-controls-play-button,
audio.mw-file-element::-webkit-media-controls-mute-button { filter: invert(1) sepia(1) saturate(3) hue-rotate(76deg) !important; }
.mw-parser-output audio::-webkit-media-controls-current-time-display,
.mw-parser-output audio::-webkit-media-controls-time-remaining-display,
audio.mw-file-element::-webkit-media-controls-current-time-display,
audio.mw-file-element::-webkit-media-controls-time-remaining-display {
  color: #7dff9c !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important;
}
.mw-parser-output blockquote:has(audio) {
  background: rgba(6, 15, 11, 0.6) !important;
  border: 1px solid rgba(125, 255, 156, 0.12) !important;
  border-left: 3px solid rgba(125, 255, 156, 0.3) !important;
  border-radius: 3px !important;
  padding: 12px 16px !important;
  font-style: italic !important;
  color: #cce8d4 !important;
  max-width: 480px !important;
  margin: 12px auto !important;
}
}


// ============================================================
/* ============================================================
// SIDEBAR
  30. PAGES CONNEXION & CRÉATION DE COMPTE — Codex (MW 1.45)
// ============================================================
  ============================================================ */
.vt-sidebar {
.mw-special-Userlogin .mw-body-content,
width: @sidebar-w;
.mw-special-CreateAccount .mw-body-content { display: flex !important; gap: 40px !important; align-items: flex-start !important; }
flex-shrink: 0;
#userloginForm,
border-right: 1px solid @border;
#createaccount {
background: linear-gradient(180deg, @bg-panel 0%, @bg 100%);
  background: rgba(6, 15, 11, 0.85) !important;
padding: 20px 0;
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
position: sticky;
  border-radius: 4px !important;
top: @header-h;
  padding: 24px !important;
height: calc(100vh - @header-h);
  flex: 0 0 auto !important;
overflow-y: auto;
  width: auto !important;
overflow-x: hidden;
  min-width: 320px !important;
align-self: flex-start;
  max-width: 480px !important;
  box-sizing: border-box !important;
  color: #cce8d4 !important;
}
#userloginForm .cdx-field, #createaccount .cdx-field { margin-bottom: 16px !important; }
#userloginForm .cdx-text-input, #createaccount .cdx-text-input,
#userloginForm .cdx-field, #createaccount .cdx-field { width: 100% !important; box-sizing: border-box !important; }
#userloginForm .cdx-label__label, #createaccount .cdx-label__label,
#userloginForm .cdx-label, #createaccount .cdx-label {
  color: rgba(125, 255, 156, 0.6) !important; font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important; text-transform: uppercase !important; letter-spacing: 0.12em !important;
  margin-bottom: 6px !important; display: block !important;
}
#userloginForm .cdx-text-input__input,
#createaccount .cdx-text-input__input,
#userloginForm .cdx-text-input__input:enabled,
#createaccount .cdx-text-input__input:enabled {
  width: 100% !important; box-sizing: border-box !important;
  background-color: rgba(6, 15, 11, 0.9) !important;
  border-color: rgba(125, 255, 156, 0.2) !important;
  color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important;
  font-size: 13px !important; padding: 10px 12px !important;
}
#userloginForm .cdx-text-input__input:focus, #createaccount .cdx-text-input__input:focus {
  border-color: #7dff9c !important; outline: none !important;
  box-shadow: 0 0 0 2px rgba(125, 255, 156, 0.12) !important;
}
#userloginForm .cdx-text-input__input:-webkit-autofill,
#createaccount .cdx-text-input__input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px rgba(6, 15, 11, 0.95) inset !important;
  -webkit-text-fill-color: #cce8d4 !important;
}
#userloginForm .cdx-field__help-text, #createaccount .cdx-field__help-text { color: rgba(125, 255, 156, 0.3) !important; font-size: 11px !important; }
#wpLoginAttempt, #wpCreateaccount {
  display: block !important; width: 100% !important; box-sizing: border-box !important;
  background: rgba(125, 255, 156, 0.12) !important; border: 1px solid rgba(125, 255, 156, 0.4) !important;
  border-radius: 2px !important; color: #7dff9c !important; font-family: 'IBM Plex Mono', monospace !important;
  font-size: 11px !important; font-weight: 500 !important; text-transform: uppercase !important;
  letter-spacing: 0.15em !important; padding: 14px !important; cursor: pointer !important;
  margin-top: 8px !important; transition: all 0.2s !important;
}
#wpLoginAttempt:hover, #wpCreateaccount:hover { background: rgba(125, 255, 156, 0.22) !important; border-color: #7dff9c !important; box-shadow: 0 0 16px rgba(125, 255, 156, 0.2) !important; }
#userloginForm .mw-form-related-link-container, #createaccount .mw-form-related-link-container { margin-top: 16px !important; text-align: center !important; }
#userloginForm a, #createaccount a { color: #4ab06a !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 10px !important; text-transform: uppercase !important; letter-spacing: 0.1em !important; }
#userloginForm .mw-ui-checkbox input + label, #wpRemember + label { color: #7aaa88 !important; font-size: 12px !important; font-family: 'IBM Plex Mono', monospace !important; text-transform: none !important; letter-spacing: 0 !important; }
.mw-createaccount-benefits-container { flex: 1 !important; padding: 20px !important; }
.mw-createaccount-benefits-heading { color: #cce8d4 !important; font-family: 'Instrument Serif', Georgia, serif !important; font-style: italic !important; font-size: 1.3em !important; margin-bottom: 24px !important; }
.mw-number-text h2 { color: rgba(125, 255, 156, 0.5) !important; font-size: 3em !important; }
.mw-number-text p { color: rgba(125, 255, 156, 0.35) !important; }
.mw-message-box-error, .errorbox { background: rgba(255, 94, 94, 0.1) !important; border: 1px solid rgba(255, 94, 94, 0.4) !important; color: #ff9a9a !important; border-radius: 2px !important; padding: 12px !important; margin-bottom: 16px !important; }
@media screen and (max-width: 720px) {
  .mw-special-Userlogin .mw-body-content, .mw-special-CreateAccount .mw-body-content { flex-direction: column !important; }
  #userloginForm, #createaccount { flex: none !important; width: 100% !important; max-width: 100% !important; padding: 16px !important; }
  .mw-createaccount-benefits-container { display: none !important; }
}
 
/* ============================================================
  31. PAGE PRÉFÉRENCES
  ============================================================ */
.oo-ui-tabSelectWidget { background: rgba(6, 15, 11, 0.9) !important; border-bottom: 1px solid rgba(125, 255, 156, 0.15) !important; }
.oo-ui-tabOptionWidget { background: transparent !important; border: 0 !important; border-bottom: 2px solid transparent !important; color: rgba(125, 255, 156, 0.4) !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 10px !important; text-transform: uppercase !important; letter-spacing: 0.1em !important; padding: 10px 16px !important; transition: color 0.15s, border-color 0.15s !important; }
.oo-ui-tabOptionWidget:hover { color: #7dff9c !important; background: rgba(125, 255, 156, 0.05) !important; }
.oo-ui-tabOptionWidget.oo-ui-optionWidget-selected { color: #7dff9c !important; border-bottom-color: #7dff9c !important; background: rgba(125, 255, 156, 0.07) !important; }
#preferences { background: transparent !important; color: #cce8d4 !important; }
#preferences h2 { color: #7dff9c !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 10px !important; font-weight: 500 !important; text-transform: uppercase !important; letter-spacing: 0.15em !important; border-bottom: 1px dashed rgba(125, 255, 156, 0.15) !important; padding-bottom: 8px !important; margin: 24px 0 16px !important; }
#preferences .mw-htmlform-field label, #preferences .oo-ui-labelElement-label { color: #cce8d4 !important; font-size: 13px !important; }
#preferences .mw-htmlform-tip, #preferences .mw-htmlform-ooui .oo-ui-fieldLayout-help { color: rgba(125, 255, 156, 0.35) !important; font-size: 11px !important; }
#preferences input[type="text"], #preferences input[type="number"], #preferences input[type="email"], #preferences input[type="search"], #preferences textarea, #preferences .oo-ui-textInputWidget input { background: rgba(6, 15, 11, 0.9) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 2px !important; color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 13px !important; }
#preferences input:focus, #preferences .oo-ui-textInputWidget input:focus { border-color: #7dff9c !important; outline: none !important; box-shadow: 0 0 0 2px rgba(125, 255, 156, 0.12) !important; }
#preferences .mw-htmlform-submit-buttons { background: rgba(6, 15, 11, 0.96) !important; border-top: 1px solid rgba(125, 255, 156, 0.15) !important; box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.4) !important; }
#preferences .mw-htmlform-submit-buttons .oo-ui-buttonElement-button, #prefsubmit { background: rgba(125, 255, 156, 0.12) !important; border: 1px solid rgba(125, 255, 156, 0.4) !important; color: #7dff9c !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; text-transform: uppercase !important; letter-spacing: 0.12em !important; border-radius: 2px !important; }
#preferences .mw-htmlform-submit-buttons .oo-ui-buttonElement-button:hover, #prefsubmit:hover { background: rgba(125, 255, 156, 0.22) !important; border-color: #7dff9c !important; }
#preferences .mw-prefs-search input { background: rgba(6, 15, 11, 0.9) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important; }
.oo-ui-dropdownWidget-handle { background: rgba(6, 15, 11, 0.9) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 2px !important; color: #cce8d4 !important; }
.oo-ui-dropdownWidget-handle:hover { background: rgba(6, 15, 11, 0.95) !important; border-color: rgba(125, 255, 156, 0.4) !important; }
.oo-ui-dropdownWidget-handle .oo-ui-labelElement-label { color: #cce8d4 !important; }
.oo-ui-dropdownWidget .oo-ui-indicatorElement-indicator { filter: brightness(0) saturate(100%) invert(91%) sepia(15%) saturate(594%) hue-rotate(76deg) brightness(101%) !important; opacity: 0.5 !important; }
.oo-ui-dropdownInputWidget select, #preferences select { background: rgba(6, 15, 11, 0.95) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; color: #cce8d4 !important; border-radius: 2px !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 12px !important; padding: 8px 12px !important; }
.oo-ui-menuSelectWidget { background: rgba(8, 18, 12, 0.98) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 2px !important; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.7) !important; }
.oo-ui-menuSelectWidget .oo-ui-optionWidget { color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 12px !important; padding: 8px 14px !important; }
.oo-ui-menuSelectWidget .oo-ui-optionWidget:hover, .oo-ui-menuSelectWidget .oo-ui-optionWidget-highlighted { background: rgba(125, 255, 156, 0.08) !important; color: #7dff9c !important; }
.oo-ui-menuSelectWidget .oo-ui-optionWidget-selected { background: rgba(125, 255, 156, 0.12) !important; color: #7dff9c !important; }
.mw-htmlform-matrix, .mw-widget-checkMatrixWidget-matrix { border-collapse: collapse !important; width: 100% !important; background: transparent !important; }
.mw-htmlform-matrix th, .mw-widget-checkMatrixWidget-matrix th { color: rgba(125, 255, 156, 0.5) !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 10px !important; text-transform: uppercase !important; letter-spacing: 0.1em !important; padding: 8px 14px !important; border-bottom: 1px solid rgba(125, 255, 156, 0.12) !important; background: transparent !important; font-weight: 500 !important; }
.mw-htmlform-matrix td, .mw-widget-checkMatrixWidget-matrix td { padding: 6px 14px !important; border: 0 !important; background: transparent !important; color: #cce8d4 !important; font-size: 13px !important; }
.mw-htmlform-matrix tr:nth-child(even) td, .mw-widget-checkMatrixWidget-matrix tr:nth-child(even) td { background: rgba(125, 255, 156, 0.03) !important; }
.mw-htmlform-matrix tr.disabled td, .mw-widget-checkMatrixWidget-matrix tr.disabled td { color: rgba(125, 255, 156, 0.25) !important; }
.mw-htmlform-matrix tr, .mw-widget-checkMatrixWidget-matrix tr { background: transparent !important; }
.mw-htmlform-matrix .oo-ui-iconElement-icon, .mw-widget-checkMatrixWidget-matrix .oo-ui-iconElement-icon { filter: brightness(0) saturate(100%) invert(91%) sepia(15%) saturate(594%) hue-rotate(76deg) brightness(101%) !important; opacity: 0.4 !important; }
.oo-ui-checkboxInputWidget [type='checkbox'] + span { background-color: rgba(6, 15, 11, 0.9) !important; background-image: none !important; border: 2px solid rgba(125, 255, 156, 0.3) !important; border-radius: 2px !important; width: 18px !important; height: 18px !important; }
.oo-ui-checkboxInputWidget [type='checkbox'] + span.vt-checked { background-color: #4ab06a !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' viewBox='0 0 12 10'%3E%3Cpolyline points='1,5 4.5,8.5 11,1' stroke='%23ffffff' stroke-width='2.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: center !important; background-size: 12px 10px !important; border-color: #7dff9c !important; }
.oo-ui-checkboxInputWidget.oo-ui-widget-disabled [type='checkbox'] + span { opacity: 0.4 !important; }
.oo-ui-popupWidget-popup { background: rgba(8, 18, 12, 0.98) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 3px !important; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.7) !important; color: #cce8d4 !important; padding: 12px 14px !important; font-size: 13px !important; line-height: 1.5 !important; }
.mw-widget-DateInputWidget input, .mw-widget-DateTimeInputWidget input { background: rgba(6, 15, 11, 0.9) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important; border-radius: 2px !important; padding: 8px 12px !important; }
.oo-ui-calendarWidget { background: rgba(8, 18, 12, 0.98) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 3px !important; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.7) !important; }
.oo-ui-calendarWidget-header { background: rgba(6, 15, 11, 0.95) !important; border-bottom: 1px solid rgba(125, 255, 156, 0.12) !important; padding: 8px !important; }
.oo-ui-calendarWidget-header .oo-ui-buttonElement-button { color: rgba(125, 255, 156, 0.5) !important; background: transparent !important; }
.oo-ui-calendarWidget-header .oo-ui-buttonElement-button:hover { color: #7dff9c !important; background: rgba(125, 255, 156, 0.08) !important; }
.oo-ui-calendarWidget-title { color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; text-transform: uppercase !important; letter-spacing: 0.1em !important; }
.oo-ui-calendarWidget .oo-ui-calendarWidget-day-of-week { color: rgba(125, 255, 156, 0.35) !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 10px !important; }
.oo-ui-calendarWidget .oo-ui-calendarWidget-day { color: #cce8d4 !important; background: transparent !important; border-radius: 2px !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 12px !important; }
.oo-ui-calendarWidget .oo-ui-calendarWidget-day:hover { background: rgba(125, 255, 156, 0.1) !important; color: #7dff9c !important; }
.oo-ui-calendarWidget .oo-ui-calendarWidget-day-today { border: 1px solid rgba(125, 255, 156, 0.35) !important; color: #7dff9c !important; }
.oo-ui-calendarWidget .oo-ui-calendarWidget-day-selected { background: rgba(125, 255, 156, 0.18) !important; color: #7dff9c !important; font-weight: 600 !important; }
.oo-ui-calendarWidget .oo-ui-calendarWidget-day-prev-month, .oo-ui-calendarWidget .oo-ui-calendarWidget-day-next-month { color: rgba(125, 255, 156, 0.2) !important; }


&::-webkit-scrollbar { width: 3px; }
/* ============================================================
&::-webkit-scrollbar-thumb { background: @ph-border; }
  32. ÉDITEUR WIKICODE — CodeMirror coloration syntaxique
  ============================================================ */
.ve-ui-mwWikitextSurface .CodeMirror,
.ve-ui-mwWikitextSurface .CodeMirror-scroll {
  background: #060f0b !important;
  color: #cce8d4 !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}
}
.ve-ui-mwWikitextSurface .CodeMirror-cursor { border-left-color: #7dff9c !important; }
.ve-ui-mwWikitextSurface .CodeMirror-selected,
.ve-ui-mwWikitextSurface .CodeMirror-focused .CodeMirror-selected { background: rgba(125, 255, 156, 0.15) !important; }
.ve-ui-mwWikitextSurface .CodeMirror-gutters { background: rgba(6, 15, 11, 0.95) !important; border-right: 1px solid rgba(125, 255, 156, 0.1) !important; }
.ve-ui-mwWikitextSurface .CodeMirror-linenumber { color: rgba(125, 255, 156, 0.22) !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; }
.ve-ui-mwWikitextSurface .CodeMirror-activeline-background { background: rgba(125, 255, 156, 0.04) !important; }
.ve-ui-mwWikitextSurface .cm-mw-template-name,
.ve-ui-mwWikitextSurface .cm-mw-template-bracket { color: #f5c84a !important; }
.ve-ui-mwWikitextSurface .cm-mw-template-argument-name { color: #a8d8ea !important; }
.ve-ui-mwWikitextSurface .cm-mw-template-delimiter { color: rgba(245, 200, 74, 0.5) !important; }
.ve-ui-mwWikitextSurface .cm-mw-link-ground,
.ve-ui-mwWikitextSurface .cm-mw-link,
.ve-ui-mwWikitextSurface .cm-mw-link-pagename { color: #4ab06a !important; }
.ve-ui-mwWikitextSurface .cm-mw-link-bracket { color: rgba(74, 176, 106, 0.5) !important; }
.ve-ui-mwWikitextSurface .cm-mw-heading,
.ve-ui-mwWikitextSurface .cm-mw-section-header { color: #7dff9c !important; font-weight: bold !important; }
.ve-ui-mwWikitextSurface .cm-mw-htmlentity,
.ve-ui-mwWikitextSurface .cm-mw-tag-name { color: #ff9a9a !important; }
.ve-ui-mwWikitextSurface .cm-mw-tag-bracket { color: rgba(255, 154, 154, 0.5) !important; }
.ve-ui-mwWikitextSurface .cm-mw-attribute-name { color: #a8d8ea !important; }
.ve-ui-mwWikitextSurface .cm-mw-attribute-value { color: #f5c84a !important; }
.ve-ui-mwWikitextSurface .cm-mw-comment { color: rgba(125, 255, 156, 0.3) !important; font-style: italic !important; }
.ve-ui-mwWikitextSurface .cm-mw-apostrophes-bold { color: rgba(125, 255, 156, 0.5) !important; font-weight: bold !important; }
.ve-ui-mwWikitextSurface .cm-mw-apostrophes-italic { color: rgba(125, 255, 156, 0.5) !important; font-style: italic !important; }
.ve-ui-mwWikitextSurface .cm-mw-table-bracket,
.ve-ui-mwWikitextSurface .cm-mw-table-definition { color: rgba(168, 216, 234, 0.7) !important; }
.ve-ui-mwWikitextSurface .cm-mw-template-variable-bracket,
.ve-ui-mwWikitextSurface .cm-mw-template-variable-name { color: #ff9a9a !important; }
.ve-ui-mwWikitextSurface .cm-mw-parserfunction-name,
.ve-ui-mwWikitextSurface .cm-mw-parserfunction-bracket { color: rgba(245, 200, 74, 0.8) !important; }
.ve-ui-mwWikitextSurface .cm-mw-redirect { color: #7dff9c !important; font-weight: bold !important; }


.vt-sidebar-section {
/* ============================================================
margin-bottom: 24px;
  33. BOUTON LANGUES INTERWIKI
  ============================================================ */
#vt-title-lang-row { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 16px !important; }
#vt-title-lang-row #firstHeading { flex: 1 !important; min-width: 0 !important; }
#p-lang-btn { position: relative; flex-shrink: 0; margin-right: 36px !important; }
.vt-lang-btn-trigger {
  display: inline-flex !important; align-items: center !important; gap: 6px !important;
  background: rgba(125, 255, 156, 0.07) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important;
  border-radius: 2px !important; color: rgba(125, 255, 156, 0.6) !important;
  font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important;
  text-transform: uppercase !important; letter-spacing: 0.1em !important;
  padding: 6px 12px !important; cursor: pointer !important; white-space: nowrap !important;
  transition: all 0.15s !important;
}
.vt-lang-btn-trigger:hover,
.vt-lang-btn-trigger[aria-expanded="true"] {
  background: rgba(125, 255, 156, 0.14) !important;
  border-color: rgba(125, 255, 156, 0.4) !important;
  color: #7dff9c !important;
}
.vt-lang-list {
  position: absolute; top: calc(100% + 4px); right: 0; z-index: 200;
  background: rgba(8, 18, 12, 0.98) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important;
  border-radius: 3px !important; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.7) !important;
  min-width: 180px; padding: 4px 0;
}
.vt-lang-list[hidden] { display: none !important; }
.vt-lang-list ul { list-style: none !important; margin: 0 !important; padding: 0 !important; }
.vt-lang-list .interlanguage-link a {
  display: flex !important; align-items: center !important; gap: 8px !important;
  padding: 8px 16px !important; color: #cce8d4 !important; text-decoration: none !important;
  font-size: 13px !important; font-family: 'Crimson Pro', Georgia, serif !important;
  border-left: 2px solid transparent !important; transition: all 0.1s !important;
}
.vt-lang-list .interlanguage-link a:hover {
  background: rgba(125, 255, 156, 0.08) !important; color: #7dff9c !important;
  border-left-color: #4ab06a !important;
}
}


.vt-sidebar-title {
/* ============================================================
font-family: @font-mono;
  34. GALERIES & VIGNETTES (THUMBS)
font-size: 9px;
  ============================================================ */
font-weight: 400;
ul.gallery,
letter-spacing: 0.28em;
.mw-parser-output .gallery { background: transparent !important; border: 0 !important; margin: 16px 0 !important; padding: 0 !important; }
text-transform: uppercase;
li.gallerybox,
color: @text-muted;
.mw-parser-output .gallerybox { background: transparent !important; }
padding: 0 18px 8px;
li.gallerybox div.thumb,
margin: 0 0 4px;
.gallerybox .thumb {
border-bottom: 1px dashed @border;
  background: rgba(15, 28, 21, 0.65) !important;
  border: 1px solid rgba(125, 255, 156, 0.18) !important;
  border-radius: 2px !important; margin: 2px !important;
  transition: all 0.15s ease;
}
li.gallerybox div.thumb:hover,
.gallerybox .thumb:hover {
  border-color: rgba(125, 255, 156, 0.45) !important;
  box-shadow: 0 0 12px rgba(125, 255, 156, 0.12);
}
.gallerytext,
.gallerybox .gallerytext {
  color: #cce8d4 !important; background: transparent !important;
  font-family: 'Crimson Pro', Georgia, serif !important; padding: 6px 8px !important;
}
.gallerytext p,
.gallerybox .gallerytext p { color: #cce8d4 !important; margin: 0 !important; }
.gallerytext a,
.gallerybox .gallerytext a { color: #7dff9c !important; }
.gallerytext a:hover,
.gallerybox .gallerytext a:hover { color: #b6ffc6 !important; }
.thumbinner,
.mw-parser-output .thumbinner,
.mw-parser-output figure[typeof~="mw:File/Thumb"],
.mw-parser-output figure[typeof~="mw:File/Frame"],
.mw-parser-output figure.mw-default-size,
.mw-parser-output figure.thumb {
  background: rgba(15, 28, 21, 0.65) !important;
  border: 1px solid rgba(125, 255, 156, 0.18) !important;
  border-radius: 2px !important; color: #cce8d4 !important;
}
.mw-parser-output figure[typeof~="mw:File/Thumb"] img.mw-file-element,
.mw-parser-output figure[typeof~="mw:File/Frame"] img.mw-file-element,
.mw-parser-output figure.mw-default-size img.mw-file-element {
  background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important;
}
.mw-parser-output figure a.mw-file-description,
.mw-parser-output figure a {
  border: 0 !important; outline: 0 !important; background: transparent !important; display: block;
}
.thumbcaption,
.mw-parser-output .thumbcaption,
figcaption,
.mw-parser-output figcaption {
  color: #cce8d4 !important; background: transparent !important; border: 0 !important;
  border-top: 0 !important; outline: 0 !important;
  font-family: 'Crimson Pro', Georgia, serif !important;
  font-style: italic; font-size: 13px !important; padding: 6px 8px !important;
}
}
.magnify a {
  filter: invert(1) hue-rotate(90deg) saturate(0.6) brightness(1.2) !important;
  opacity: 0.6 !important;
}
.magnify a:hover { opacity: 1 !important; }


.vt-sidebar-section ul {
/* ============================================================
list-style: none;
  35. SCROLLBAR MOBILE — masquage agressif
margin: 0;
  ============================================================ */
padding: 0;
@media screen and (max-width: 900px) {
  .vt-page-tabs,
  .vt-user-tools,
  .vt-page-tabs *,
  .vt-user-tools * { scrollbar-width: none !important; -ms-overflow-style: none !important; }
  .vt-page-tabs::-webkit-scrollbar,
  .vt-user-tools::-webkit-scrollbar {
    display: none !important; width: 0 !important; height: 0 !important; background: transparent !important;
  }
  .vt-page-tabs::-webkit-scrollbar-track,
  .vt-user-tools::-webkit-scrollbar-track,
  .vt-page-tabs::-webkit-scrollbar-thumb,
  .vt-user-tools::-webkit-scrollbar-thumb { display: none !important; background: transparent !important; }
}


li a {
/* ============================================================
display: block;
  36. CITATIONS (blockquote)
padding: 7px 18px;
  ============================================================ */
font-family: @font-mono;
blockquote,
font-size: 12px;
.mw-parser-output blockquote,
color: @text-dim;
.mw-parser-output .noexcerpt:not(.avt-warn-banner):not(.avt-note-banner):not(.avt-section-banner) {
border-left: 2px solid transparent;
  background: transparent !important; border: 0 !important; box-shadow: none !important;
text-decoration: none;
  padding: 8px 16px !important; margin: 16px auto !important;
transition: all 0.15s;
  font-style: italic; color: #cce8d4;
  font-family: 'Crimson Pro', Georgia, serif;
  font-size: 16px; line-height: 1.6;
}
blockquote p,
.mw-parser-output blockquote p {
  margin: 0 0 8px !important; background: transparent !important; border: 0 !important;
}
blockquote p:last-child { margin-bottom: 0 !important; }
blockquote audio,
.mw-parser-output blockquote audio,
blockquote .mw-mmv-image,
blockquote figure,
blockquote .floatnone,
blockquote .center {
  border: 0 !important; background: transparent !important; box-shadow: none !important;
  margin: 8px auto !important;
}


&:hover {
/* ============================================================
color: @phosphor;
  37. PAGE RECHERCHE — Special:Recherche
background: @ph-faint;
  → MIGRÉE dans le skin : skinStyles/mediawiki.special.search.less
border-left-color: @ph-dim;
  ============================================================ */
}
/* ============================================================
}
  38. NOTIFICATIONS / TOAST POST-PUBLICATION
  ============================================================ */
.mw-notification,
.mw-notification-area .mw-notification,
.postedit,
.postedit-container {
  background: rgba(8, 18, 12, 0.97) !important;
  border: 1px solid rgba(125, 255, 156, 0.35) !important;
  border-radius: 3px !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(125, 255, 156, 0.1) !important;
  color: #cce8d4 !important;
  padding: 12px 16px !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}
.mw-notification-success,
.mw-notification.mw-notification-type-success,
.mw-notification[data-mw-notification-type="success"] {
  border-left: 3px solid #7dff9c !important;
  border-color: rgba(125, 255, 156, 0.4) !important;
}
.mw-notification-warn,
.mw-notification.mw-notification-type-warn {
  border-left: 3px solid #f5c84a !important;
  border-color: rgba(245, 200, 74, 0.4) !important;
}
.mw-notification-error,
.mw-notification.mw-notification-type-error {
  border-left: 3px solid #ff7a7a !important;
  border-color: rgba(255, 122, 122, 0.4) !important;
}
.mw-notification p,
.mw-notification div,
.mw-notification span,
.postedit-content {
  color: #cce8d4 !important;
  background: transparent !important;
  font-family: 'Crimson Pro', Georgia, serif !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}
.mw-notification strong,
.mw-notification b {
  color: #7dff9c !important;
  font-weight: 600 !important;
}
}
.mw-notification a,
.postedit a {
  color: #7dff9c !important;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(125, 255, 156, 0.3) !important;
}
.mw-notification a:hover,
.postedit a:hover {
  color: #b6ffc6 !important;
  border-bottom-color: #7dff9c !important;
}
.mw-notification .oo-ui-iconElement-icon,
.postedit .oo-ui-iconElement-icon {
  filter: brightness(0) saturate(100%) invert(91%) sepia(15%) saturate(594%) hue-rotate(76deg) brightness(101%) !important;
  opacity: 0.9 !important;
}
.mw-notification-close,
.postedit-icon-close {
  filter: brightness(0) saturate(100%) invert(72%) sepia(20%) saturate(400%) hue-rotate(76deg) !important;
  opacity: 0.5 !important;
  transition: opacity 0.15s !important;
}
.mw-notification-close:hover,
.postedit-icon-close:hover { opacity: 1 !important; }
.mw-notification-area { background: transparent !important; }


// ============================================================
/* ============================================================
// ONGLETS
  39. WIKITABLE — adaptation à l'infobox (desktop)
// ============================================================
  ============================================================ */
.vt-page-tabs {
@media screen and (min-width: 721px) {
display: flex;
  .mw-parser-output:has(.avt-infobox) .wikitable,
align-items: flex-end;
  .mw-parser-output:has(.avt-infobox) .va-table {
height: @tab-h;
    max-width: calc(100% - 344px) !important; /* 320px infobox + ~1.5em marge */
padding: 0 32px;
    width: auto !important;
gap: 2px;
  }
background: @bg-panel;
}
border-bottom: 1px solid @border;
font-family: @font-mono;
flex-shrink: 0;
overflow-x: auto;
overflow-y: hidden;
-webkit-overflow-scrolling: touch;
scrollbar-width: thin;
scrollbar-color: rgba(125, 255, 156, 0.25) transparent;
position: sticky;
top: @header-h;  // colle sous le header sticky
z-index: 500;    // sous l'overlay drawer mobile (999), sous le header sticky (1100)
&::-webkit-scrollbar { height: 3px; }
&::-webkit-scrollbar-track { background: transparent; }
&::-webkit-scrollbar-thumb {
background: rgba(125, 255, 156, 0.25);
border-radius: 2px;
&:hover { background: rgba(125, 255, 156, 0.5); }
}


ul {
/* ============================================================
display: flex;
  40. CORRECTIONS AVANCÉES — liens, tableaux collapsibles
list-style: none;
  ============================================================ */
margin: 0;
padding: 0;
gap: 2px;
height: 100%;
align-items: flex-end;
}


li a {
/* Liens rouges (.new) dans les tableaux — ne pas écraser avec le vert */
display: flex;
.mw-parser-output table td a.new,
align-items: center;
.mw-parser-output table th a.new,
padding: 0 14px;
.mw-parser-output .wikitable td a.new,
height: 36px;
.mw-parser-output .wikitable th a.new,
font-size: 11px;
.mw-parser-output .va-table td a.new {
letter-spacing: 0.12em;
  color: #ff5e5e !important;
text-transform: uppercase;
}
color: @text-dim;
.mw-parser-output table td a.new:hover,
border: 1px solid transparent;
.mw-parser-output .wikitable td a.new:hover {
border-bottom: none;
  color: #ff8888 !important;
margin-bottom: -1px;
}
text-decoration: none;
transition: all 0.15s;


&:hover {
/* Liens externes — ambre pour les distinguer des liens internes */
color: @phosphor;
.mw-parser-output a.external,
background: @ph-faint;
.mw-parser-output a[rel~="nofollow"] {
}
  color: #f5c84a !important;
}
}
 
.mw-parser-output a.external:visited,
// Onglet actif
.mw-parser-output a[rel~="nofollow"]:visited {
li.selected a,
  color: #c9973a !important;
li.new.selected a {
color: @phosphor;
border-color: @border;
border-bottom-color: @bg;
background: @bg;
}
 
// Onglet "nouvel article" (rouge)
li.new a {
color: @danger;
opacity: 0.7;
}
}
}
 
.mw-parser-output a.external:hover,
.vt-tabs-sep {
.mw-parser-output a[rel~="nofollow"]:hover {
flex: 1;
  color: #ffe080 !important;
}
}


// ============================================================
/* Tableaux collapsibles — ne pas bloquer le JS avec !important sur display */
// ARTICLE
/* Le JS MediaWiki masque les lignes via style="display:none" inline.
// ============================================================
  Toute règle CSS avec !important sur display écrase ce comportement.
.vt-content-container {
  On stylise uniquement l'apparence sans toucher display. */
flex: 1;
.mw-collapsible-toggle,
min-width: 0;
.mw-collapsible-toggle a {
display: flex;
  color: rgba(125, 255, 156, 0.55) !important;
flex-direction: column;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  cursor: pointer !important;
  text-decoration: none !important;
  background: transparent !important;
  border: 0 !important;
}
}
 
.mw-collapsible-toggle a:hover,
// Wrapper interne : article + TOC en flex row sur desktop
.mw-collapsible-toggle:hover {
.vt-content-row {
  color: #7dff9c !important;
display: flex;
  background: transparent !important;
flex: 1;
min-width: 0;
min-height: 0;
}
}


.vt-content-main {
/* Ligne d'en-tête collapsible */
flex: 1;
.mw-parser-output .wikitable.mw-collapsible > tbody > tr:first-child > th,
min-width: 0;
.mw-parser-output table.mw-collapsible > tbody > tr:first-child > th {
display: flex;
  background: rgba(10, 22, 16, 0.95) !important;
flex-direction: column;
  border-bottom: 1px solid rgba(125, 255, 156, 0.2) !important;
}
}


#bodyContent, .vt-article {
/* Cellules avec style inline "background: white" ou couleur claire — reset */
flex: 1;
.mw-parser-output .wikitable td[style*="background:#fff"],
padding: 36px 40px 60px;
.mw-parser-output .wikitable td[style*="background: #fff"],
max-width: 960px;
.mw-parser-output .wikitable td[style*="background:white"],
.mw-parser-output .wikitable td[style*="background: white"],
.mw-parser-output .wikitable td[style*="background:#FFF"],
.mw-parser-output .wikitable td[style*="background: #FFF"] {
  background-color: rgba(12, 24, 18, 0.85) !important;
  color: #cce8d4 !important;
}
}


// Titre principal
/* Titre de page — ne pas hériter de l'italique des h2 */
#firstHeading,
.firstHeading {
.firstHeading {
font-family: @font-serif;
  font-style: normal !important;
font-style: italic;
font-size: 46px;
line-height: 1.05;
letter-spacing: -0.01em;
color: @text;
margin: 0 0 20px;
padding-bottom: 16px;
border-bottom: 1px dashed @border;
}
}


// Sous-titres — structure MW 1.44+ avec .mw-heading wrapper
/* ============================================================
.mw-body-content {
  41. PAGE PREVIEWS — aperçus au survol des liens (Hovercards)
  ============================================================ */


// Le flex est sur .mw-heading (le wrapper), pas sur h2
/* Conteneur racine — fond sombre + ombrage phosphore */
.mw-heading {
.mwe-popups,
display: flex;
.mwe-popups.mwe-popups-fade-in-up,
align-items: baseline;
.mwe-popups.mwe-popups-fade-in-down,
border-bottom: 1px solid @border;
.mwe-popups.mwe-popups-no-image-tri,
margin: 32px 0 14px;
.mwe-popups.mwe-popups-image-tri,
padding-bottom: 8px;
.mwe-popups.mwe-popups-image-pointer,
}
.mwe-popups.mwe-popups-is-not-tall,
.mwe-popups.mwe-popups-is-tall {
  background: rgba(8, 18, 12, 0.98) !important;
  border: 1px solid rgba(125, 255, 156, 0.25) !important;
  border-radius: 3px !important;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.75),
              0 0 12px rgba(125, 255, 156, 0.08) !important;
  color: #cce8d4 !important;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}


h2 {
/* Force transparence sur tous les conteneurs internes —
font-family: @font-serif;
  neutralise les fonds blancs résiduels (div, a, container) */
font-style: italic;
.mwe-popups > div,
font-size: 28px;
.mwe-popups > a,
color: @text;
.mwe-popups > a > div,
margin: 0;
.mwe-popups .mwe-popups-container,
padding-bottom: 0;
.mwe-popups .mwe-popups-extract,
border-bottom: 0;
.mwe-popups .mwe-popups-extract p,
display: block;
.mwe-popups .mwe-popups-discreet,
flex: 1;
.mwe-popups .mwe-popups-scroll,
}
.mwe-popups .mwe-popups-body {
  background-color: transparent !important;
}


h3 {
/* Lien englobant (<a>) cliquable — fond blanc natif neutralisé */
font-family: @font-mono;
.mwe-popups a,
font-size: 13px;
.mwe-popups a:link,
font-weight: 600;
.mwe-popups a:visited,
color: @phosphor;
.mwe-popups a:hover {
letter-spacing: 0.1em;
  background: transparent !important;
text-transform: uppercase;
  color: #cce8d4 !important;
margin: 22px 0 10px;
  text-decoration: none !important;
padding-left: 10px;
}
border-left: 2px solid @phosphor;
}


h4 {
/* Pointe (triangle) — masquer la version blanche par défaut */
font-family: @font-mono;
.mwe-popups.flipped-x::before,
font-size: 12px;
.mwe-popups.flipped-y::before,
font-weight: 500;
.mwe-popups.flipped-x-y::before,
color: @text-dim;
.mwe-popups::before,
letter-spacing: 0.1em;
.mwe-popups.flipped-x::after,
text-transform: uppercase;
.mwe-popups.flipped-y::after,
margin: 18px 0 8px;
.mwe-popups.flipped-x-y::after,
}
.mwe-popups::after {
  border-color: transparent !important;
  display: none !important;
}


p {
/* Titre de l'article dans le popup */
margin-bottom: 14px;
.mwe-popups .mwe-popups-title,
}
.mwe-popups h3,
.mwe-popups .mwe-popups-extract h3 {
  color: #7dff9c !important;
  font-family: 'Instrument Serif', Georgia, serif !important;
  font-style: italic !important;
  font-size: 1.1rem !important;
  font-weight: normal !important;
  border: 0 !important;
  margin: 0 0 6px 0 !important;
  padding: 0 !important;
}


// Liens de modification de section
/* Indicateur de type d'article (icône à côté du titre) */
.mw-editsection {
.mwe-popups .mwe-popups-title .mw-ui-icon {
font-family: @font-mono;
  filter: brightness(0) saturate(100%) invert(91%) sepia(15%)
font-size: 10px;
          saturate(594%) hue-rotate(76deg) brightness(101%) !important;
letter-spacing: 0.1em;
  opacity: 0.65 !important;
font-style: normal;
}
margin-left: 10px;


a {
/* Extrait / résumé textuel */
color: @text-muted;
.mwe-popups .mwe-popups-extract {
border: 1px solid @border;
  color: #cce8d4 !important;
padding: 2px 8px;
  font-family: 'Crimson Pro', Georgia, serif !important;
transition: all 0.15s;
  font-size: 14px !important;
  line-height: 1.5 !important;
  padding: 14px 16px !important;
}


&:hover {
/* Variante "discreet" : titre seul, sans extrait */
color: @phosphor;
.mwe-popups .mwe-popups-discreet {
border-color: @ph-dim;
  padding: 10px 14px !important;
background: @ph-faint;
text-decoration: none;
}
}
}
}
}


// ============================================================
/* Conteneur de la miniature (image d'aperçu) */
// INFOBOX
.mwe-popups .mwe-popups-thumbnail,
// ============================================================
.mwe-popups .mwe-popups-thumbnail-link,
.infobox,
.mwe-popups svg.mwe-popups-thumbnail {
.mw-parser-output .infobox {
  background: rgba(6, 15, 11, 0.6) !important;
float: right;
  border-bottom: 1px solid rgba(125, 255, 156, 0.12) !important;
margin: 0 0 20px 28px;
}
width: 260px;
border: 1px solid @ph-border;
background: @bg-infobox;
font-family: @font-mono;
font-size: 12px;
clear: right;


// Titre
/* Filtre teinte phosphore sur la miniature pour rester dans le ton */
caption,
/* NOTE : neutralisé plus bas (section 53-(4)) — conservé pour historique. */
th.infobox-title,
.mwe-popups .mwe-popups-thumbnail image,
.infobox-title,
.mwe-popups svg.mwe-popups-thumbnail image {
> tbody > tr:first-child > th {
  filter: brightness(0.92) saturate(0.9) hue-rotate(-8deg) !important;
background: @amber !important;
}
color: #1a1000 !important;
font-family: @font-mono;
font-weight: 600;
font-size: 13px;
letter-spacing: 0.05em;
padding: 10px 14px;
text-align: center;
text-transform: uppercase;
display: block;
}


tr {
/* Aperçus "désambiguïsation" / page d'homonymie */
border-top: 1px dashed @border;
.mwe-popups.mwe-popups-type-disambiguation {
}
  border-color: rgba(245, 200, 74, 0.35) !important;
}
.mwe-popups.mwe-popups-type-disambiguation .mwe-popups-title {
  color: #f5c84a !important;
}


th {
/* Aperçus "lien rouge" (page inexistante) */
color: @text-muted;
.mwe-popups.mwe-popups-type-generic {
font-size: 10px;
  border-color: rgba(255, 122, 122, 0.35) !important;
letter-spacing: 0.08em;
}
text-transform: uppercase;
.mwe-popups.mwe-popups-type-generic .mwe-popups-title {
padding: 7px 12px;
  color: #ff7a7a !important;
font-weight: 400;
}
text-align: left;
vertical-align: top;
background: transparent;
width: 42%;
}


td {
/* Barre du bas : paramètres + lien "lire la suite" */
color: @text;
.mwe-popups .mwe-popups-settings,
padding: 7px 12px;
.mwe-popups footer,
vertical-align: top;
.mwe-popups .mwe-popups-read-link {
font-size: 11px;
  background: rgba(6, 15, 11, 0.6) !important;
background: transparent;
  border-top: 1px solid rgba(125, 255, 156, 0.12) !important;
}
  padding: 8px 14px !important;
}
}


// ============================================================
/* Lien "lire la suite" */
// TABLEAUX WIKI
.mwe-popups .mwe-popups-read-link {
// ============================================================
  color: #4ab06a !important;
.wikitable {
  font-family: 'IBM Plex Mono', monospace !important;
border-collapse: collapse;
  font-size: 10px !important;
width: 100%;
  text-transform: uppercase !important;
margin-bottom: 20px;
  letter-spacing: 0.12em !important;
background: transparent;
  text-decoration: none !important;
}
.mwe-popups .mwe-popups-read-link:hover {
  color: #7dff9c !important;
}


th {
/* Icône engrenage des paramètres */
background: @bg-elevated;
.mwe-popups .mwe-popups-settings-icon,
color: @phosphor;
.mwe-popups .mw-ui-icon-popups-settings {
font-family: @font-mono;
  filter: brightness(0) saturate(100%) invert(72%) sepia(20%)
font-size: 10px;
          saturate(400%) hue-rotate(76deg) brightness(100%) !important;
letter-spacing: 0.15em;
  opacity: 0.45 !important;
text-transform: uppercase;
  transition: opacity 0.15s !important;
padding: 8px 14px;
}
text-align: left;
.mwe-popups .mwe-popups-settings-icon:hover,
border: 1px solid @border;
.mwe-popups .mw-ui-icon-popups-settings:hover {
}
  opacity: 1 !important;
}


td {
/* Dialogue des paramètres Page Previews (Spécial:Préférences modal) */
padding: 8px 14px;
.mwe-popups-settings .oo-ui-window-frame,
border: 1px solid @border;
.mw-popups-settings .oo-ui-window-frame {
color: @text;
  background: rgba(10, 20, 15, 0.98) !important;
vertical-align: top;
  border: 1px solid rgba(125, 255, 156, 0.2) !important;
font-size: 14px;
}
 
tr:hover td {
background: @ph-faint;
}
}
}


// ============================================================
/* ============================================================
// TABLE DES MATIÈRES
  42. DIFF VIEW — comparaison de versions
// ============================================================
  → MIGRÉE dans le skin : skinStyles/mediawiki.diff.less
.toc,
  ============================================================ */
#toc {
/* ============================================================
background: @bg-panel;
  43. DISCUSSIONTOOLS — pages de discussion modernes
border: 1px solid @border;
  ============================================================ */
padding: 14px 0 10px;
font-family: @font-mono;
display: inline-block;
margin: 0 0 20px;
min-width: 200px;


.toctitle {
/* Boutons "Répondre", "Souscrire", "Ajouter un sujet" */
font-size: 9px;
.ext-discussiontools-init-replylink-buttons .oo-ui-buttonElement-button,
letter-spacing: 0.28em;
.ext-discussiontools-init-section-subscribeButton .oo-ui-buttonElement-button,
text-transform: uppercase;
.ext-discussiontools-init-new-topic .oo-ui-buttonElement-button {
color: @text-muted;
  background: transparent !important;
padding: 0 16px 10px;
  border: 1px solid rgba(125, 255, 156, 0.2) !important;
border-bottom: 1px dashed @border;
  color: rgba(125, 255, 156, 0.7) !important;
margin-bottom: 6px;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  border-radius: 2px !important;
  padding: 4px 10px !important;
  transition: all 0.15s !important;
}
.ext-discussiontools-init-replylink-buttons .oo-ui-buttonElement-button:hover,
.ext-discussiontools-init-section-subscribeButton .oo-ui-buttonElement-button:hover,
.ext-discussiontools-init-new-topic .oo-ui-buttonElement-button:hover {
  background: rgba(125, 255, 156, 0.08) !important;
  border-color: rgba(125, 255, 156, 0.5) !important;
  color: #7dff9c !important;
}


h2 {
/* Icônes des boutons */
// Override l'h2 général pour la TOC
.ext-discussiontools-init-replylink-buttons .oo-ui-iconElement-icon,
font-family: @font-mono;
.ext-discussiontools-init-section-subscribeButton .oo-ui-iconElement-icon {
font-size: 9px;
  filter: brightness(0) saturate(100%) invert(91%) sepia(15%) saturate(594%) hue-rotate(76deg) brightness(101%) !important;
font-style: normal;
  opacity: 0.65 !important;
color: @text-muted;
}
margin: 0;
padding: 0;
border: none;
}
}


ul {
/* Liens "Répondre" / "Modifier" textuels (legacy) */
list-style: none;
.ext-discussiontools-init-replylink-reply,
margin: 0;
.ext-discussiontools-init-replylink-open {
padding: 0;
  color: #4ab06a !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  text-decoration: none !important;
}
.ext-discussiontools-init-replylink-reply:hover,
.ext-discussiontools-init-replylink-open:hover {
  color: #7dff9c !important;
}


li a {
/* Conteneur d'une section commentée */
display: flex;
.ext-discussiontools-init-section,
align-items: baseline;
.ext-discussiontools-init-highlight,
gap: 8px;
.ext-discussiontools-init-targetcomment {
padding: 5px 16px;
  background: rgba(125, 255, 156, 0.04) !important;
font-size: 11px;
  border-left: 2px solid rgba(125, 255, 156, 0.25) !important;
color: @text-dim;
  padding-left: 12px !important;
line-height: 1.3;
  margin: 8px 0 !important;
transition: all 0.15s;
  border-radius: 2px !important;
border-left: 2px solid transparent;
}


&:hover {
/* Surlignage du commentaire ciblé (lien #cXXX) */
color: @phosphor;
.ext-discussiontools-init-targetcomment {
text-decoration: none;
  background: rgba(245, 200, 74, 0.08) !important;
background: @ph-faint;
  border-left-color: rgba(245, 200, 74, 0.4) !important;
border-left-color: @ph-dim;
}
}
}


// Sous-niveaux
/* Boîte d'auteur de commentaire */
ul li a {
.ext-discussiontools-init-timestamplink {
padding-left: 28px;
  color: rgba(125, 255, 156, 0.5) !important;
font-size: 10px;
  font-family: 'IBM Plex Mono', monospace !important;
color: @text-muted;
  font-size: 11px !important;
}
}
}
.ext-discussiontools-init-timestamplink:hover { color: #7dff9c !important; }


.tocnumber {
/* Surface d'édition inline */
color: @text-muted;
.ext-discussiontools-ui-replyWidget,
font-size: 10px;
.ext-discussiontools-ui-newTopic {
flex-shrink: 0;
  background: rgba(6, 15, 11, 0.85) !important;
min-width: 18px;
  border: 1px solid rgba(125, 255, 156, 0.2) !important;
}
  border-radius: 3px !important;
  padding: 12px !important;
  margin: 8px 0 !important;
}
}


// ============================================================
/* Boutons "Publier" / "Annuler" du widget réponse */
// BANDEAUX & NOTICES
.ext-discussiontools-ui-replyWidget-actions .oo-ui-flaggedElement-progressive .oo-ui-buttonElement-button,
// ============================================================
.ext-discussiontools-ui-replyWidget-actions .oo-ui-flaggedElement-primary .oo-ui-buttonElement-button {
.ambox,
  background: rgba(125, 255, 156, 0.15) !important;
.mbox-small {
  border: 1px solid rgba(125, 255, 156, 0.4) !important;
border: 1px solid @amber-faint;
  color: #7dff9c !important;
background: @amber-faint;
  font-family: 'IBM Plex Mono', monospace !important;
border-left: 3px solid @amber;
  font-size: 11px !important;
padding: 12px 16px;
  text-transform: uppercase !important;
margin-bottom: 16px;
  letter-spacing: 0.1em !important;
font-family: @font-mono;
}
font-size: 12px;
.ext-discussiontools-ui-replyWidget-actions .oo-ui-flaggedElement-progressive .oo-ui-buttonElement-button:hover,
color: @text-dim;
.ext-discussiontools-ui-replyWidget-actions .oo-ui-flaggedElement-primary .oo-ui-buttonElement-button:hover {
letter-spacing: 0.03em;
  background: rgba(125, 255, 156, 0.28) !important;
line-height: 1.6;
  border-color: #7dff9c !important;
display: flex;
  box-shadow: 0 0 10px rgba(125, 255, 156, 0.2) !important;
gap: 12px;
}
align-items: flex-start;
clear: both;


td {
/* Mode "ping" — mention d'un utilisateur */
border: none;
.ext-discussiontools-init-pingmark {
padding: 0;
  color: #7dff9c !important;
background: transparent;
  background: rgba(125, 255, 156, 0.1) !important;
}
  border-radius: 2px !important;
  padding: 0 4px !important;
}
}


// ============================================================
/* ============================================================
// CATÉGORIES
  44. ECHO — badges & menus de notifications (header)
// ============================================================
  → MIGRÉE dans le skin : skinStyles/ext.echo.less
#catlinks {
  ============================================================ */
margin-top: 40px;
/* ============================================================
padding-top: 16px;
  45. CITE — références [1][2] et notes de bas de page
border-top: 1px solid @border;
  → MIGRÉE dans le skin : skinStyles/ext.cite.less
font-family: @font-mono;
  ============================================================ */
font-size: 11px;
/* ============================================================
display: flex;
  46. CODE INLINE & PRE — styles génériques
align-items: baseline;
  ============================================================ */
gap: 10px;
/* La partie .mw-highlight (Pygments) est migrée dans le skin :
flex-wrap: wrap;
  skinStyles/ext.pygments.less. Ne restent ici que les styles
  code/tt/pre génériques, indépendants de SyntaxHighlight. */


a {
/* Code inline `<code>` standard */
padding: 2px 10px;
.mw-parser-output code,
border: 1px solid @border;
.mw-parser-output tt {
color: @text-dim;
  background: rgba(6, 15, 11, 0.9) !important;
font-size: 10px;
  border: 1px solid rgba(125, 255, 156, 0.12) !important;
letter-spacing: 0.1em;
  border-radius: 2px !important;
text-transform: uppercase;
  color: #b6ffc6 !important;
transition: all 0.15s;
  font-family: 'IBM Plex Mono', monospace !important;
text-decoration: none;
  font-size: 0.88em !important;
  padding: 1px 5px !important;
}


&:hover {
/* Pre standard (non-Pygments) */
color: @phosphor;
.mw-parser-output pre,
border-color: @ph-dim;
.mw-parser-output .mw-code {
background: @ph-faint;
  background: #060f0b !important;
}
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
}
  border-radius: 3px !important;
 
  color: #cce8d4 !important;
.mw-normal-catlinks {
  font-family: 'IBM Plex Mono', monospace !important;
&::before {
  font-size: 13px !important;
content: 'Catégories :';
  line-height: 1.55 !important;
color: @text-muted;
  padding: 12px 14px !important;
text-transform: uppercase;
  overflow-x: auto !important;
letter-spacing: 0.2em;
}
margin-right: 8px;
}
 
ul {
display: inline;
list-style: none;
padding: 0;
margin: 0;
}


ul li {
/* ============================================================
display: inline;
  47. TABBERNEUE — onglets <tabber>
}
  ============================================================ */


ul li::after {
/* Conteneur tabber */
content: ' ';
.tabber,
}
.tabber__container,
}
.mw-parser-output .tabber {
  background: transparent !important;
  border: 0 !important;
  margin: 16px 0 !important;
}
}


// ============================================================
/* Barre d'onglets */
// FOOTER
.tabber__header,
// ============================================================
.tabber__tabs {
.vt-footer {
  background: rgba(6, 15, 11, 0.6) !important;
border-top: 1px solid @border;
  border-bottom: 1px solid rgba(125, 255, 156, 0.2) !important;
background: @bg-panel;
  padding: 0 !important;
padding: 20px 32px;
  margin: 0 !important;
display: flex;
  display: flex !important;
flex-wrap: wrap;
  flex-wrap: wrap !important;
align-items: center;
  gap: 0 !important;
gap: 16px;
font-family: @font-mono;
font-size: 10px;
letter-spacing: 0.12em;
color: @text-muted;
text-transform: uppercase;
position: relative;
z-index: 2;
}
}


.vt-footer-links {
/* Onglet individuel */
display: flex;
.tabber__tab,
gap: 24px;
.tabber__header .tabber__tab,
flex-wrap: wrap;
.tabber__tabs .tabber__tab {
flex: 1;
  background: transparent !important;
 
  border: 0 !important;
ul {
  border-bottom: 2px solid transparent !important;
display: flex;
  color: rgba(125, 255, 156, 0.5) !important;
gap: 16px;
  font-family: 'IBM Plex Mono', monospace !important;
list-style: none;
  font-size: 11px !important;
margin: 0;
  font-weight: 500 !important;
padding: 0;
  text-transform: uppercase !important;
}
  letter-spacing: 0.1em !important;
 
  padding: 10px 16px !important;
a {
  margin: 0 !important;
color: @text-muted;
  cursor: pointer !important;
transition: color 0.15s;
  text-decoration: none !important;
 
  transition: all 0.15s !important;
&:hover {
color: @phosphor;
text-decoration: none;
}
}
}
}
 
.tabber__tab:hover {
.vt-footer-brand {
  color: #7dff9c !important;
display: flex;
  background: rgba(125, 255, 156, 0.05) !important;
align-items: center;
gap: 10px;
font-family: @font-serif;
font-style: italic;
font-size: 14px;
letter-spacing: 0.01em;
color: @ph-dim;
}
}


.vt-footer-brand-mark {
/* Onglet actif */
width: 22px;
.tabber__tab--active,
height: 22px;
.tabber__tab[aria-selected="true"] {
border: 1px solid @ph-dim;
  color: #7dff9c !important;
display: inline-flex;
  border-bottom-color: #7dff9c !important;
align-items: center;
  background: rgba(125, 255, 156, 0.08) !important;
justify-content: center;
font-size: 12px;
}
}


.vt-footer-status {
/* Contenu de l'onglet */
font-family: @font-mono;
.tabber__section,
font-style: normal;
.tabber__panel {
font-size: 9px;
  background: transparent !important;
letter-spacing: 0.2em;
  border: 0 !important;
color: @text-muted;
  padding: 16px 0 !important;
display: flex;
  color: #cce8d4 !important;
align-items: center;
gap: 5px;
}
}


.vt-dot {
/* Indicateur de défilement (flèches >) sur petits écrans */
display: inline-block;
.tabber__header__prev,
width: 6px;
.tabber__header__next {
height: 6px;
  background: rgba(6, 15, 11, 0.9) !important;
border-radius: 50%;
  color: rgba(125, 255, 156, 0.6) !important;
background: @phosphor;
  border: 0 !important;
box-shadow: 0 0 6px @phosphor;
  cursor: pointer !important;
animation: vt-blink 2s infinite;
}
}
.tabber__header__prev:hover,
.tabber__header__next:hover { color: #7dff9c !important; }


@keyframes vt-blink {
/* Version animée pendant la transition */
0%, 100% { opacity: 1; }
.tabber--live .tabber__section {
50%      { opacity: 0.3; }
  transition: opacity 0.2s ease;
}
}


// ============================================================
/* ============================================================
// PRINT
  48. REVISIONSLIDER — slider de diff entre versions
// ============================================================
  ============================================================ */
@media print {
.noprint,
.vt-header,
.vt-sidebar,
.vt-page-tabs,
.vt-scanlines,
.vt-vignette,
.vt-watermark,
.vt-footer {
display: none !important;
}


body {
/* Conteneur principal du slider */
background: #fff;
.mw-revslider-container,
color: #000;
.mw-revslider-wrapper {
}
  background: rgba(6, 15, 11, 0.8) !important;
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
  border-radius: 3px !important;
  color: #cce8d4 !important;
  margin: 8px 0 !important;
  padding: 12px !important;
}


.firstHeading {
/* Bouton toggle (déplier/replier) */
color: #000;
.mw-revslider-toggle-button {
border-bottom: 2px solid #000;
  background: transparent !important;
}
  border: 1px solid rgba(125, 255, 156, 0.2) !important;
  color: rgba(125, 255, 156, 0.55) !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  padding: 4px 10px !important;
  border-radius: 2px !important;
  cursor: pointer !important;
}
.mw-revslider-toggle-button:hover {
  background: rgba(125, 255, 156, 0.08) !important;
  color: #7dff9c !important;
}


a {
/* Axe horizontal (timeline) */
color: #000;
.mw-revslider-revisions-container,
}
.mw-revslider-revisions {
  background: rgba(6, 15, 11, 0.6) !important;
  border: 1px solid rgba(125, 255, 156, 0.1) !important;
  border-radius: 2px !important;
}
}


// ============================================================
/* Barres représentant chaque révision */
// RESPONSIVE
.mw-revslider-revision {
// ============================================================
  background: rgba(125, 255, 156, 0.25) !important;
// ── Desktop : burger et overlay cachés ──────────────────────
  border: 0 !important;
@media screen and (min-width: 901px) {
  transition: background 0.15s !important;
.vt-burger {
}
display: none;
.mw-revslider-revision:hover {
}
  background: rgba(125, 255, 156, 0.5) !important;
}


.vt-drawer-overlay {
/* Révision sélectionnée (les deux côtés du diff) */
display: none;
.mw-revslider-revision-old,
}
.mw-revslider-revision[data-pos="older"] {
  background: rgba(255, 94, 94, 0.6) !important;
}
.mw-revslider-revision-new,
.mw-revslider-revision[data-pos="newer"] {
  background: rgba(125, 255, 156, 0.7) !important;
}


// Flèches scroll : mobile-only
/* Pointers (curseurs glissants gauche/droite) */
.vt-scroll-arrow {
.mw-revslider-pointer-old,
display: none !important;
.mw-revslider-pointer-new,
}
.mw-revslider-pointer {
// Les wrappers créés par JS doivent disparaître du flux sur desktop
  background: rgba(8, 18, 12, 0.95) !important;
.vt-user-tools-wrap,
  border: 1px solid rgba(125, 255, 156, 0.5) !important;
.vt-page-tabs-wrap {
  color: #7dff9c !important;
display: contents;
  border-radius: 2px !important;
}
}
}
.mw-revslider-pointer-old { border-color: rgba(255, 94, 94, 0.6) !important; }
.mw-revslider-pointer-new { border-color: rgba(125, 255, 156, 0.6) !important; }


@media screen and (max-width: 1100px) {
/* Tooltips au survol d'une révision */
#bodyContent, .vt-article {
.mw-revslider-tooltip,
padding: 28px 28px 50px;
.mw-revslider-tooltip .oo-ui-popupWidget-popup {
}
  background: rgba(8, 18, 12, 0.98) !important;
  border: 1px solid rgba(125, 255, 156, 0.25) !important;
  border-radius: 3px !important;
  color: #cce8d4 !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 11px !important;
  padding: 8px 10px !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.6) !important;
}
}


@media screen and (max-width: 900px) {
/* Liens dans le tooltip */
.mw-revslider-tooltip a { color: #7dff9c !important; }


// ── Burger button ────────────────────────────────────────────
/* Flèches navigation */
.vt-burger {
.mw-revslider-arrow {
display: flex;
  background: transparent !important;
flex-direction: column;
  color: rgba(125, 255, 156, 0.5) !important;
justify-content: center;
  border: 0 !important;
gap: 5px;
  cursor: pointer !important;
width: 40px;
}
height: 40px;
.mw-revslider-arrow:hover { color: #7dff9c !important; }
padding: 8px;
background: transparent;
border: 1px solid @border;
border-radius: 2px;
cursor: pointer;
flex-shrink: 0;
transition: border-color 0.2s, background 0.2s;
order: -1;
margin-left: 12px;


&:hover {
/* Indicateurs de taille (+/- octets) */
border-color: @phosphor;
.mw-revslider-revision-wrapper .mw-revslider-bar-bigger,
background: @ph-faint;
.mw-revslider-bar-bigger {
}
  background: rgba(125, 255, 156, 0.6) !important;
}
}
.mw-revslider-revision-wrapper .mw-revslider-bar-smaller,
.mw-revslider-bar-smaller {
  background: rgba(255, 94, 94, 0.6) !important;
}


.vt-burger-bar {
/* ============================================================
display: block;
  49. TABLEPAGER & LISTES SPÉCIALES — pages d'admin et stats
width: 100%;
  ============================================================ */
height: 1.5px;
background: @text-dim;
border-radius: 1px;
transition: all 0.25s ease;
transform-origin: center;
}


// Burger → X quand ouvert
/* Tableau pager générique (Spécial:Statistiques, ListUsers, AllPages…) */
.vt-burger.is-open {
table.mw-statistics-table,
border-color: @phosphor;
table.TablePager,
background: @ph-faint;
table.mw-spcontent,
.mw-special-Statistics table,
.mw-special-ActiveUsers table,
.mw-special-Listusers table,
.mw-special-Listfiles table,
.mw-special-Listredirects table,
.mw-special-Wantedpages table,
.mw-special-Mostrevisions table,
.mw-special-Brokenredirects table {
  background: rgba(6, 15, 11, 0.75) !important;
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
  border-collapse: collapse !important;
  color: #cce8d4 !important;
  width: 100% !important;
  margin: 12px 0 !important;
}


.vt-burger-bar:nth-child(1) { transform: translateY(6.5px) rotate(45deg); background: @phosphor; }
/* Entêtes de colonnes */
.vt-burger-bar:nth-child(2) { opacity: 0; transform: scaleX(0); }
.TablePager th,
.vt-burger-bar:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); background: @phosphor; }
.mw-statistics-table th,
}
table.mw-spcontent th,
.mw-special-Statistics th,
.mw-special-ActiveUsers th,
.mw-special-Listusers th,
.mw-special-Listfiles th {
  background: #0f2015 !important;
  border-bottom: 1px solid rgba(125, 255, 156, 0.2) !important;
  color: #7dff9c !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  padding: 10px 12px !important;
  text-align: left !important;
}


// ── Bouton fermer dans le drawer ─────────────────────────────
/* En-têtes triables */
.vt-drawer-close {
.TablePager th.TablePager_sort,
display: block;
.TablePager th.headerSort,
width: 100%;
.TablePager th.headerSortUp,
padding: 14px 20px;
.TablePager th.headerSortDown {
background: transparent;
  cursor: pointer !important;
border: 0;
  background-image: none !important;
border-bottom: 1px solid @border;
}
color: @text-dim;
.TablePager th.headerSortUp,
font-family: @font-mono;
.TablePager th.headerSortDown { color: #7dff9c !important; }
font-size: 11px;
.TablePager th.headerSortUp::after { content: ' ▲'; opacity: 0.7; font-size: 9px; }
font-weight: 500;
.TablePager th.headerSortDown::after { content: ' ▼'; opacity: 0.7; font-size: 9px; }
letter-spacing: 0.12em;
text-transform: uppercase;
text-align: left;
cursor: pointer;
transition: color 0.15s, background 0.15s;


&::before {
/* Lignes */
content: '✕  ';
.TablePager tr,
color: @phosphor;
.mw-statistics-table tr,
}
table.mw-spcontent tr {
  background: transparent !important;
  border-bottom: 1px solid rgba(125, 255, 156, 0.06) !important;
}


&:hover {
/* Lignes alternées */
background: @ph-faint;
.TablePager tr:nth-child(even),
color: @phosphor;
.TablePager_even {
}
  background: rgba(125, 255, 156, 0.025) !important;
}
}
.TablePager tr:nth-child(odd),
.TablePager_odd {
  background: transparent !important;
}
.TablePager tr:hover {
  background: rgba(125, 255, 156, 0.06) !important;
}


/* Cellules */
.TablePager td,
.mw-statistics-table td,
table.mw-spcontent td {
  background: transparent !important;
  border: 0 !important;
  color: #cce8d4 !important;
  padding: 8px 12px !important;
  font-size: 13px !important;
}


.vt-drawer-overlay {
/* Liens dans les pagers */
display: block;
.TablePager a,
position: fixed;
.mw-statistics-table a { color: #7dff9c !important; }
inset: 0;
.TablePager a:visited { color: #4ab06a !important; }
background: rgba(0, 0, 0, 0.65);
.TablePager a:hover { color: #b6ffc6 !important; }
z-index: 999;              // sous .vt-sidebar (1001), au-dessus de tout le reste
opacity: 0;
pointer-events: none;
transition: opacity 0.3s ease;
-webkit-backdrop-filter: blur(2px);
backdrop-filter: blur(2px);


&.is-open {
/* Valeur numérique de statistiques (Spécial:Statistiques) */
opacity: 1;
.mw-statistics-numbers,
pointer-events: auto; // capture les clics (sinon le contenu derrière reste interactif)
.mw-statistics-table td.mw-statistics-numbers {
                      // Le handler document click ferme le drawer car l'overlay
  font-family: 'IBM Plex Mono', monospace !important;
                      // est hors de .vt-sidebar : un clic dessus déclenche closeDrawer().
  color: #f5c84a !important;
}
  text-align: right !important;
}
  font-weight: 500 !important;
}


// ── Sidebar → drawer latéral ─────────────────────────────────
/* Pagination des TablePagers */
.vt-sidebar {
.TablePager_nav,
position: fixed !important;
.mw-pager-navigation-bar {
top: 0;
  background: rgba(6, 15, 11, 0.6) !important;
left: 0;
  border: 1px solid rgba(125, 255, 156, 0.1) !important;
width: ~"min(280px, 85vw)";  // limite à 85% du viewport sur très petits écrans
  border-radius: 2px !important;
height: 100%;
  padding: 8px 12px !important;
overflow-y: auto;
  margin: 8px 0 !important;
overflow-x: hidden;
  color: rgba(204, 232, 212, 0.7) !important;
z-index: 1001;               // au-dessus de l'overlay (999)
   font-family: 'IBM Plex Mono', monospace !important;
background: @bg-panel;
  font-size: 11px !important;
border-right: 1px solid @border;
}
transform: translateX(-100%);
.TablePager_nav a,
transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
.mw-pager-navigation-bar a,
padding-top: 56px;
.mw-numlink {
box-shadow: none;
  color: #4ab06a !important;
align-self: auto;
  border: 1px solid rgba(125, 255, 156, 0.2) !important;
  background: rgba(6, 15, 11, 0.5) !important;
  padding: 3px 9px !important;
  margin: 0 2px !important;
  border-radius: 2px !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  font-size: 10px !important;
}
.TablePager_nav a:hover,
.mw-pager-navigation-bar a:hover {
  background: rgba(125, 255, 156, 0.1) !important;
  border-color: rgba(125, 255, 156, 0.4) !important;
  color: #7dff9c !important;
}


&.is-open {
/* Filtres en haut des pagers */
transform: translateX(0);
.mw-pager-body,
box-shadow: 4px 0 32px rgba(0, 0, 0, 0.6);
.mw-pager-tools,
}
.mw-htmlform-ooui-wrapper {
}
  background: transparent !important;
  border: 0 !important;
}


// Pas de margin-left sur mobile
/* Page Spécial:Contributions — fond des lignes */
.vt-page-container {
.mw-contributions-list li,
margin-left: 0 !important;
.mw-special-Contributions ul li {
}
  border-bottom: 1px solid rgba(125, 255, 156, 0.05) !important;
  padding: 4px 0 !important;
  background: transparent !important;
  color: #cce8d4 !important;
}
.mw-contributions-list li:hover {
  background: rgba(125, 255, 156, 0.04) !important;
}


// Masquer la nav primaire dans le header sur mobile (elle est dans le drawer)
/* Liens utilisateur / page dans les listes */
.vt-nav-primary {
.mw-userlink,
display: none;
.mw-changeslist-line .mw-userlink {
}
  color: #7dff9c !important;
  font-weight: 500 !important;
}
.mw-userlink:hover { color: #b6ffc6 !important; }


.infobox,
/* Boutons "annuler" / "défaire" / "rollback" dans les listes */
.mw-parser-output .infobox {
.mw-rollback-link a,
width: 220px;
.mw-history-undo a,
}
.mw-changeslist-links a {
  color: #f5c84a !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
}
.mw-rollback-link a:hover,
.mw-history-undo a:hover { color: #ffe080 !important; }


// ── Header mobile — CSS Grid pour layout fiable ───────────
/* Journaux (Spécial:Journal) */
.vt-header {
.mw-logevent-loglines,
display: grid !important;
.mw-special-Log .mw-logline,
grid-template-areas:
ul.mw-logevent-loglines li {
"burger logo"
  background: transparent !important;
"usertools usertools"
  border-bottom: 1px solid rgba(125, 255, 156, 0.05) !important;
"search search";
  padding: 6px 0 !important;
grid-template-columns: 54px 1fr;
  color: #cce8d4 !important;
grid-template-rows: 52px 36px auto;
  font-size: 13px !important;
height: auto;
}
padding: 0;
.mw-logevent-loglines li:hover { background: rgba(125, 255, 156, 0.04) !important; }
align-items: stretch;
.mw-logline-action {
background: @bg-panel !important; // solide sur mobile, pas de blur transparent
  color: rgba(125, 255, 156, 0.5) !important;
backdrop-filter: none !important;
  font-family: 'IBM Plex Mono', monospace !important;
}
  font-size: 11px !important;
}
.mw-logevent-actionlink {
  color: #4ab06a !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important;
  text-transform: uppercase !important;
}


.vt-burger    { grid-area: burger; display: flex !important; align-self: center; justify-self: center; }
/* Marqueurs (m, b, n) dans RC/historique */
.vt-logo {
.mw-changeslist-flags abbr,
grid-area: logo;
abbr.minoredit,
height: 52px;
abbr.botedit,
border-right: none;
abbr.newpage,
display: flex;
abbr.unpatrolled {
align-items: center;
  background: rgba(125, 255, 156, 0.08) !important;
justify-content: center;
  border: 1px solid rgba(125, 255, 156, 0.2) !important;
padding: 0 12px;
  color: #7dff9c !important;
}
  border-radius: 2px !important;
.vt-logo-link {
  font-family: 'IBM Plex Mono', monospace !important;
justify-content: center;
  font-size: 9px !important;
}
  font-weight: 600 !important;
.vt-nav-primary { display: none !important; }
  padding: 0 4px !important;
// ── Flèches scroll horizontal génériques (user-tools + page-tabs) ──
  margin: 0 1px !important;
.vt-scroll-wrap {
  text-decoration: none !important;
position: relative;
}
width: 100%;
max-width: 100%;
min-width: 0;
overflow: hidden;
}
.vt-user-tools-wrap {
grid-area: usertools;
height: 36px;
border-top: 1px solid @border;
}
.vt-page-tabs-wrap {
// La page-tabs est sticky avec son propre top, donc le wrap doit suivre
position: sticky;
top: 0; // JS ajustera le top en mobile (pour suivre le header de hauteur variable)
z-index: 500;     // sous l'overlay drawer (999) — évite que les tabs débordent par-dessus
background: @bg-panel;
border-bottom: 1px solid @border;
}
// Sur mobile, c'est le wrap qui est sticky : le tabs interne doit redevenir static
.vt-page-tabs {
position: static !important;
top: auto !important;
z-index: auto !important;
border-bottom: none !important;
// Scrollbar agressivement cachée (les flèches font le job)
scrollbar-width: none !important;
-ms-overflow-style: none !important;


&::-webkit-scrollbar { display: none !important; width: 0 !important; height: 0 !important; }
/* Différence d'octets (+12 / -45) */
&::-webkit-scrollbar-track { display: none !important; }
.mw-plusminus-pos {
&::-webkit-scrollbar-thumb { display: none !important; }
  color: #7dff9c !important;
}
  font-family: 'IBM Plex Mono', monospace !important;
// Pareil pour user-tools
  font-weight: 500 !important;
.vt-user-tools {
}
scrollbar-width: none !important;
.mw-plusminus-neg {
-ms-overflow-style: none !important;
  color: #ff7a7a !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-weight: 500 !important;
}
.mw-plusminus-null {
  color: rgba(125, 255, 156, 0.4) !important;
  font-family: 'IBM Plex Mono', monospace !important;
}
.mw-plusminus-bold {
  font-weight: 700 !important;
}


&::-webkit-scrollbar { display: none !important; width: 0 !important; height: 0 !important; }
/* ============================================================
&::-webkit-scrollbar-track { display: none !important; }
  50. PAGES FICHIER (Namespace File:) — Spécial:ImagePage
&::-webkit-scrollbar-thumb { display: none !important; }
  ============================================================ */
}


.vt-scroll-arrow {
/* TOC haut de page "Fichier / Historique / Utilisation" */
position: absolute;
#filetoc,
top: 0;
ul#filetoc {
bottom: 0;
  background: rgba(6, 15, 11, 0.85) !important;
width: 28px;
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
display: flex;
  border-radius: 3px !important;
align-items: center;
  color: #cce8d4 !important;
justify-content: center;
  padding: 8px 14px !important;
color: rgba(125, 255, 156, 0.6);
  margin: 12px 0 !important;
font-size: 16px;
  list-style: none !important;
font-family: @font-mono;
  display: flex !important;
font-weight: bold;
  flex-wrap: wrap !important;
z-index: 2;
  gap: 0 !important;
transition: opacity 0.2s ease, color 0.15s ease, background 0.15s ease;
  font-family: 'IBM Plex Mono', monospace !important;
opacity: 1;
  font-size: 10px !important;
background: transparent;
  text-transform: uppercase !important;
border: 0;
  letter-spacing: 0.12em !important;
padding: 0;
  text-align: center !important;
margin: 0;
  justify-content: center !important;
cursor: pointer;
}
-webkit-appearance: none;
#filetoc li {
appearance: none;
  display: inline !important;
user-select: none;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}
#filetoc li::before {
  content: '·' !important;
  margin: 0 10px !important;
  color: rgba(125, 255, 156, 0.3) !important;
}
#filetoc li:first-child::before { display: none !important; }
#filetoc a {
  color: rgba(125, 255, 156, 0.65) !important;
  text-decoration: none !important;
  letter-spacing: 0.12em !important;
}
#filetoc a:hover { color: #7dff9c !important; }


&:hover  { color: @phosphor; }
/* Conteneur principal de l'image */
&:active { color: @phosphor; transform: scale(0.92); }
.fullImageLink,
&:focus-visible {
#file,
outline: 1px solid @phosphor;
.mw-filepage-image {
outline-offset: -2px;
  background: transparent !important;
}
  text-align: center !important;
  margin: 16px 0 !important;
}
.fullImageLink a,
.fullImageLink img,
#file a,
#file img {
  background: transparent !important;
  border: 0 !important;
  display: inline-block !important;
}


&.is-left  {
/* Image elle-même : juste un cadre discret */
left: 0;
.fullImageLink img,
background: linear-gradient(to right, @bg-panel 60%, transparent);
#file > a > img {
}
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
&.is-right {
  border-radius: 2px !important;
right: 0;
  background: rgba(6, 15, 11, 0.4) !important;
background: linear-gradient(to left, @bg-panel 60%, transparent);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5) !important;
}
}
&.is-left:hover  { background: linear-gradient(to right, rgba(125, 255, 156, 0.15) 0%, @bg-panel 60%, transparent); }
&.is-right:hover { background: linear-gradient(to left,  rgba(125, 255, 156, 0.15) 0%, @bg-panel 60%, transparent); }
}


.vt-scroll-wrap.is-scroll-start .vt-scroll-arrow.is-left  { opacity: 0; pointer-events: none; }
/* Texte "Pas de plus haute résolution disponible" + lien filename */
.vt-scroll-wrap.is-scroll-end   .vt-scroll-arrow.is-right { opacity: 0; pointer-events: none; }
.mw-filepage-resolutioninfo,
.fullMedia {
  color: rgba(204, 232, 212, 0.65) !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 11px !important;
  text-align: center !important;
  margin: 8px 0 !important;
  background: transparent !important;
}
.fullMedia a,
.mw-filepage-resolutioninfo a {
  color: #7dff9c !important;
  font-weight: 500 !important;
  text-decoration: none !important;
   border-bottom: 1px solid rgba(125, 255, 156, 0.25) !important;
}
.fullMedia a:hover {
  color: #b6ffc6 !important;
  border-bottom-color: #7dff9c !important;
}


.vt-user-tools {
/* Informations sur le fichier (taille, type MIME) */
grid-area: unset !important;
.fileInfo,
display: block !important;
.mw-filepage-mime,
height: 36px;
.mw-filepage-dimensions {
width: 100% !important;
  color: rgba(204, 232, 212, 0.6) !important;
max-width: 100% !important;
  font-family: 'IBM Plex Mono', monospace !important;
min-width: 0 !important;
  font-size: 11px !important;
border-top: none;
border-left: none;
border-right: none;
padding: 0;
overflow-x: auto;
overflow-y: hidden;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
&::-webkit-scrollbar { display: none; }
ul {
display: flex !important;
width: max-content;        // largeur du contenu, pas 100%
min-width: 100%;            // mais au moins 100% si peu d'items
height: 100%;
margin: 0 !important;
padding: 0 !important;
list-style: none;
gap: 0 !important;
}
li {
flex: 0 0 auto !important; // taille selon contenu, pas étiré
min-width: 0 !important;
display: flex !important;
border-right: 1px solid @border;
}
li:last-child { border-right: none; }
li:empty { display: none !important; }
li a {
display: block !important;
height: 36px !important;
line-height: 36px !important;
font-size: 10px !important;
letter-spacing: 0.08em !important;
text-align: center !important;
padding: 0 14px !important; // padding confortable, pas de tronquage
margin: 0 !important;
white-space: nowrap !important;
border-right: none !important;
box-sizing: border-box !important;
}
// Override desktop logout/createaccount style on mobile
#pt-logout a,
#pt-createaccount a {
background: transparent !important;
color: @text-dim !important;
font-weight: normal !important;
margin-left: 0 !important;
}
}
.vt-search {
grid-area: search;
width: 100%;
padding: 8px 12px;
border-top: 1px solid @border;
form { max-width: 100%; }
}
.vt-logo-text { white-space: nowrap; overflow: hidden; }
.vt-logo-name { font-size: 15px; white-space: nowrap; }
.vt-logo-sup  { font-size: 8px;  white-space: nowrap; }
}
}


@media screen and (max-width: 640px) {
/* Tableau d'historique du fichier */
#bodyContent, .vt-article {
table.filehistory,
padding: 20px 16px 40px;
.filehistory {
}
  background: rgba(12, 24, 18, 0.85) !important;
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
  border-collapse: collapse !important;
  width: 100% !important;
  color: #cce8d4 !important;
  margin: 12px 0 !important;
}
.filehistory th {
  background: #0f2015 !important;
  border-bottom: 1px solid rgba(125, 255, 156, 0.2) !important;
  color: #7dff9c !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  padding: 10px 12px !important;
  text-align: left !important;
}
.filehistory td {
  background: transparent !important;
  border-bottom: 1px solid rgba(125, 255, 156, 0.06) !important;
  color: #cce8d4 !important;
  padding: 10px 12px !important;
  vertical-align: middle !important;
  font-size: 13px !important;
}
.filehistory tr:hover td {
  background: rgba(125, 255, 156, 0.04) !important;
}


.firstHeading {
/* Marqueur "actuel" dans l'historique */
font-size: 28px;
.filehistory td.filehistory-selected,
}
.filehistory tr.filehistory-selected td {
  background: rgba(125, 255, 156, 0.06) !important;
  color: #7dff9c !important;
}


.infobox,
/* Vignettes dans le tableau d'historique */
.mw-parser-output .infobox {
.filehistory img,
float: none;
.filehistory a img,
width: 100%;
.filehistory .mw-thumbnail-link img {
margin: 0 0 20px;
  background: rgba(6, 15, 11, 0.6) !important;
}
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
  border-radius: 2px !important;
  padding: 2px !important;
}


.vt-page-tabs {
/* Liens de date dans l'historique */
padding: 0 12px;
.filehistory a {
overflow-x: auto;
  color: #7dff9c !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 11px !important;
  text-decoration: none !important;
}
.filehistory a:hover { color: #b6ffc6 !important; }


ul {
/* "Vous ne pouvez pas remplacer ce fichier" / autres messages */
flex-shrink: 0;
.mw-filepage-other-versions,
}
.mw-filepage-upload-error,
}
.sharedUploadNotice {
  background: rgba(6, 15, 11, 0.6) !important;
  border: 1px solid rgba(245, 200, 74, 0.2) !important;
  border-left: 3px solid rgba(245, 200, 74, 0.5) !important;
  color: rgba(204, 232, 212, 0.85) !important;
  padding: 10px 14px !important;
  border-radius: 2px !important;
  margin: 12px 0 !important;
  font-style: italic !important;
}


.vt-footer {
/* Section "Utilisation du fichier" */
padding: 16px;
#mw-imagepage-section-linkstoimage,
flex-direction: column;
.mw-imagepage-linkstoimage {
align-items: flex-start;
  background: transparent !important;
}
}
.mw-imagepage-linkstoimage ul,
#mw-imagepage-section-linkstoimage ul {
  background: rgba(6, 15, 11, 0.5) !important;
  border: 1px solid rgba(125, 255, 156, 0.08) !important;
  border-radius: 2px !important;
  padding: 12px 16px 12px 36px !important;
  margin: 8px 0 !important;
  list-style: square !important;
}
.mw-imagepage-linkstoimage li,
#mw-imagepage-section-linkstoimage li {
  color: #cce8d4 !important;
  padding: 3px 0 !important;
}
.mw-imagepage-linkstoimage li::marker {
  color: rgba(125, 255, 156, 0.4) !important;
}
}


// ============================================================
/* Métadonnées EXIF (souvent collapsible) */
// NAVIGATION PRINCIPALE (header)
.mw_metadata,
// ============================================================
table.mw_metadata {
.vt-nav-primary {
  background: rgba(6, 15, 11, 0.6) !important;
display: flex;
  border: 1px solid rgba(125, 255, 156, 0.1) !important;
align-items: center;
  color: #cce8d4 !important;
height: 100%;
  margin: 12px 0 !important;
padding: 0 8px;
}
gap: 2px;
.mw_metadata th {
border-right: 1px solid @border;
  background: rgba(15, 32, 21, 0.5) !important;
overflow-x: auto;
  color: rgba(125, 255, 156, 0.65) !important;
flex-shrink: 1;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  text-align: left !important;
  padding: 6px 12px !important;
}
.mw_metadata td {
  background: transparent !important;
  border-bottom: 1px solid rgba(125, 255, 156, 0.05) !important;
  color: rgba(204, 232, 212, 0.75) !important;
  padding: 6px 12px !important;
  font-size: 12px !important;
}
}


.vt-nav-link {
/* Liens de section [modifier | modifier le wikicode] dans pages File: */
font-family: @font-mono;
.mw-editsection-bracket {
font-size: 11px;
  color: rgba(125, 255, 156, 0.3) !important;
letter-spacing: 0.1em;
}
color: @text-dim;
.mw-editsection a {
padding: 0 12px;
  color: rgba(125, 255, 156, 0.5) !important;
height: @header-h;
}
display: flex;
.mw-editsection a:hover { color: #7dff9c !important; }
align-items: center;
text-transform: uppercase;
text-decoration: none;
border-bottom: 2px solid transparent;
white-space: nowrap;
transition: all 0.15s;


&:hover {
/* Cas spécifique : namespace File: utilise des wikitables pour l'historique
color: @phosphor;
  mais sans la classe wikitable — on cible la table principale du contenu */
background: @ph-faint;
.mw-special-Filepage table:not(.wikitable):not(.va-table):not(.avt-infobox) {
text-decoration: none;
  background: rgba(12, 24, 18, 0.85) !important;
}
  color: #cce8d4 !important;
}
.mw-special-Filepage table:not(.wikitable):not(.va-table):not(.avt-infobox) th {
  background: #0f2015 !important;
  color: #7dff9c !important;
}
}
 
.mw-special-Filepage table:not(.wikitable):not(.va-table):not(.avt-infobox) td {
// ============================================================
  background: transparent !important;
// CODEMIRROR / VE / WIKIEDITOR — fix cursor offset
  color: #cce8d4 !important;
// Chargé avec le skin (avant init éditeur) — haute spécificité
  border-bottom: 1px solid rgba(125, 255, 156, 0.06) !important;
// pour empêcher l'héritage de Crimson Pro qui casse les mesures.
// Cf. T418793, T245532, T245568.
// ============================================================
html body #wpTextbox1,
html body .wikiEditor-ui-text textarea,
html body .CodeMirror,
html body .CodeMirror pre,
html body .CodeMirror-code,
html body .CodeMirror-linenumber,
html body .CodeMirror-measure,
html body .CodeMirror-measure pre,
html body .ve-ce-paragraphNode,
html body .ve-ui-mwWikitextSurface,
html body .ve-ui-mwWikitextSurface .ve-ce-paragraphNode {
font-family: monospace, monospace !important;
font-size: 13px !important;
line-height: 1.5em !important;
}
}


// ============================================================
/* ============================================================
// SCROLL TO TOP
  51. MULTIMEDIAVIEWER (MMV) — lightbox d'image + boutons Codex
// ============================================================
  → MIGRÉE dans le skin : skinStyles/mmv.less + codex.less
#vt-scroll-top {
  ============================================================ */
position: fixed;
/* ============================================================
bottom: 28px;
  52. VE DIALOG — fix bande blanche dans le panneau d'édition
right: 24px;
  → MIGRÉE dans le skin : skinStyles/oojs-ui-windows.less
width: 36px;
  ============================================================ */
height: 36px;
/* ============================================================
background: rgba(6, 15, 11, 0.85);
  53. CORRECTIONS CIBLÉES — toolbars dialogues, popups, checkboxes
border: 1px solid rgba(125, 255, 156, 0.25);
  ============================================================ */
color: rgba(125, 255, 156, 0.6);
/* Blocs (1), (2), (6) migrés dans skinStyles/ve-overrides.less ;
font-size: 16px;
  bloc (3) dans skinStyles/oojs-ui-core.less + codex.less ;
line-height: 1;
  bloc (5) dans skinStyles/mediawiki.widgets.less.
cursor: pointer;
  Ne reste ici que le bloc (4), qui surcharge la section 41. */
border-radius: 2px;
z-index: 800;
display: flex;
align-items: center;
justify-content: center;
opacity: 0;
transform: translateY(8px);
pointer-events: none;
transition: opacity 0.2s ease, transform 0.2s ease,
            color 0.15s, border-color 0.15s, background 0.15s;


&.is-visible {
/* ─── (4) Popups d'aperçu d'article : retirer le filtre hue-rotate ───
opacity: 1;
  Le filtre hue-rotate(-8deg) sur les miniatures donnait une teinte
transform: translateY(0);
  vert pomme indistincte aux images. À retirer pour garder les couleurs
pointer-events: auto;
  d'origine. */
}
.mwe-popups .mwe-popups-thumbnail image,
.mwe-popups svg.mwe-popups-thumbnail image {
  filter: none !important;
}
/* ============================================================
  54. WIDGET RECHERCHE VE — vignettes lisibles
  → MIGRÉE dans le skin : skinStyles/mediawiki.widgets.less
  ============================================================ */
/* ============================================================
  55. VE — Dialogues modaux au-dessus de la toolbar
  → MIGRÉE dans le skin : skinStyles/oojs-ui-windows.less
  ============================================================ */
/* ============================================================
  56. BOUTONS OOUI FRAMED — fond clair par défaut OOUI/Codex
  → MIGRÉE dans le skin : skinStyles/oojs-ui-core.less
  ============================================================ */
/* ============================================================
  57. BANDEAU DISCORD — barre fixe en bas de page
  ============================================================ */


&:hover {
.vt-discord-banner {
background: rgba(125, 255, 156, 0.1);
  position: fixed;
border-color: rgba(125, 255, 156, 0.5);
  bottom: 0;
color: #7dff9c;
  left: 0;
}
  right: 0;
  z-index: 1500;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 12px 24px;
  background: rgba(8, 18, 12, 0.97);
  border-top: 1px solid rgba(125, 255, 156, 0.35);
  box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  font-family: 'IBM Plex Mono', monospace;
  color: #cce8d4;
  transition: transform 0.35s ease, opacity 0.35s ease;
}
}


// ============================================================
.vt-discord-banner.vt-banner-hidden {
  transform: translateY(100%);
  opacity: 0;
  pointer-events: none;
}


// ============================================================
/* Texte principal — prend l'espace flexible, à gauche */
// TOC SIDEBAR — colonne droite desktop, panneau mobile
.vt-banner-text {
// ============================================================
  flex: 1;
  font-size: 13px;
  line-height: 1.5;
}


// ── Base commune ─────────────────────────────────────────────
.vt-banner-text strong {
.vt-toc-sidebar {
  color: #7dff9c;
background: linear-gradient(180deg, @bg-panel 0%, @bg 100%);
  font-weight: 600;
border-left: 1px solid @border;
  letter-spacing: 0.02em;
overflow-y: auto;
}
overflow-x: hidden;
z-index: 950;


&::-webkit-scrollbar { width: 2px; }
/* Bloc icône + compteur, collé à droite à côté du bouton Rejoindre */
&::-webkit-scrollbar-thumb { background: @ph-border; }
.vt-banner-info {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}


// Bouton collapse (desktop) / fermer (mobile)
.vt-banner-icon {
.vt-toc-collapse-btn {
  display: flex;
display: flex;
  align-items: center;
align-items: center;
  justify-content: center;
justify-content: center;
  width: 32px;
width: 100%;
  height: 32px;
padding: 8px 0;
  flex-shrink: 0;
background: transparent;
  color: #7dff9c;
border: 0;
}
border-bottom: 1px solid @border;
color: rgba(125, 255, 156, 0.4);
font-size: 14px;
cursor: pointer;
transition: color 0.15s, background 0.15s;


&:hover {
.vt-banner-icon svg {
color: @phosphor;
  width: 24px;
background: @ph-faint;
  height: 24px;
}
  fill: currentColor;
}
}


// Titre "SOMMAIRE"
.vt-banner-members {
.vt-toc-sidebar-title {
  font-size: 12px;
font-family: @font-mono;
  color: #7dff9c;
font-size: 9px;
  font-weight: 600;
font-weight: 500;
  white-space: nowrap;
letter-spacing: 0.28em;
  flex-shrink: 0;
text-transform: uppercase;
}
color: rgba(125, 255, 156, 0.4);
padding: 10px 16px 8px;
border-bottom: 1px dashed rgba(125, 255, 156, 0.12);
}


// TOC dans la sidebar
/* Bouton Rejoindre */
.toc, #toc {
.vt-banner-btn {
float: none !important;
  display: inline-flex;
position: static !important;
  align-items: center;
width: 100% !important;
  gap: 6px;
max-width: 100% !important;
  background: rgba(125, 255, 156, 0.12);
min-width: 0 !important;
  border: 1px solid rgba(125, 255, 156, 0.4);
margin: 0 !important;
  border-radius: 2px;
padding: 0 !important;
  color: #7dff9c !important;
background: transparent !important;
  font-family: 'IBM Plex Mono', monospace;
border: 0 !important;
  font-size: 11px;
border-radius: 0 !important;
  font-weight: 600;
font-size: 11px !important;
  letter-spacing: 0.12em;
overflow: visible !important;
  text-transform: uppercase;
}
  text-decoration: none !important;
  padding: 8px 18px;
  cursor: pointer;
  transition: all 0.15s;
  flex-shrink: 0;
}


.toctitle { display: none !important; }
.vt-banner-btn:hover {
  background: rgba(125, 255, 156, 0.22);
  border-color: #7dff9c;
  box-shadow: 0 0 12px rgba(125, 255, 156, 0.25);
  color: #b6ffc6 !important;
}


.toc > ul, #toc > ul {
/* Bouton fermer */
display: block !important;
.vt-banner-close {
padding: 4px 0 !important;
  display: flex;
margin: 0 !important;
  align-items: center;
}
  justify-content: center;
 
  width: 28px;
.toc ul { list-style: none !important; margin: 0 !important; padding: 0 !important; }
  height: 28px;
 
  border-radius: 50%;
.toc li a {
  background: transparent;
display: flex !important;
  border: 1px solid rgba(125, 255, 156, 0.2);
align-items: baseline !important;
  color: rgba(125, 255, 156, 0.5);
padding: 5px 16px !important;
  font-size: 18px;
font-size: 11px !important;
  line-height: 1;
color: #7aaa88 !important;
  cursor: pointer;
font-family: @font-mono !important;
  flex-shrink: 0;
border-left: 2px solid transparent !important;
  transition: all 0.15s;
transition: all 0.15s !important;
}
text-decoration: none !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
 
&:hover {
color: @phosphor !important;
background: @ph-faint !important;
border-left-color: @ph-dim !important;
}
}
 
.toc li li a {
padding-left: 28px !important;
font-size: 10px !important;
color: rgba(125, 255, 156, 0.4) !important;
}


.tocnumber {
.vt-banner-close:hover {
color: rgba(125, 255, 156, 0.3) !important;
  border-color: #ff7a7a;
margin-right: 6px !important;
  color: #ff7a7a;
}
  background: rgba(255, 122, 122, 0.08);
}
}


// ── DESKTOP > 1200px — TOC sticky dans le flux flex (pousse le texte)
/* Respecte prefers-reduced-motion : pas d'animation d'entrée/sortie */
@media screen and (min-width: 1201px) {
@media (prefers-reduced-motion: reduce) {
.vt-toc-sidebar {
  .vt-discord-banner { transition: none; }
// STICKY dans le flex — quand il s'ouvre il pousse le contenu
position: sticky;
top: @header-h; // JS override avec header+tabs height
height: calc(100vh - @header-h);
flex-shrink: 0;
width: 32px;    // collapsed par défaut
overflow: hidden;
transition: width 0.25s ease;
 
// Replié
&.is-collapsed {
width: 32px;
overflow: hidden;
 
.toc, #toc { display: none !important; }
 
.vt-toc-collapse-btn {
border-bottom: 1px solid @border;
height: 36px;
flex-shrink: 0;
}
 
.vt-toc-sidebar-title {
padding: 0;
border-bottom: 0;
display: flex;
align-items: center;
justify-content: center;
width: 32px;
flex: 1;
cursor: pointer;
overflow: hidden;
 
span {
writing-mode: vertical-rl;
transform: rotate(180deg);
white-space: nowrap;
letter-spacing: 0.2em;
font-size: 9px;
color: rgba(125, 255, 156, 0.35);
font-family: @font-mono;
font-weight: 500;
text-transform: uppercase;
display: block;
}
}
}
 
// Déplié — pousse le texte grâce au flex sticky
&.is-expanded {
width: 200px;
overflow-y: auto;
overflow-x: hidden;
 
.toc, #toc { display: block !important; }
}
}
 
#vt-toc-btn { display: none !important; }
#vt-toc-mobile-overlay { display: none !important; }
}
}


// ── TABLETTE + MOBILE ≤ 1200px — TOC sticky dans le flex (pousse le contenu)
/* Mobile */
@media screen and (max-width: 1200px) {
@media (max-width: 720px) {
.vt-content-row {
  .vt-discord-banner {
// Reste un flex row même sur mobile pour que le TOC pousse le contenu
    flex-wrap: wrap;
display: flex;
    gap: 10px;
}
    padding: 10px 16px;
 
   }
.vt-toc-sidebar {
  .vt-banner-text {
position: sticky;
    flex: 1 1 100%;
top: 0;         // JS override avec header+tabs
    font-size: 12px;
right: 0;
    order: 1;
height: 100vh;   // JS override avec calc(100vh - top)
  }
width: 32px;    // COLLAPSED PAR DÉFAUT (avant JS)
  .vt-banner-info {
flex-shrink: 0;
    order: 2;
overflow: hidden;
  }
transition: width 0.25s ease;
  .vt-banner-close {
z-index: 800;
    order: 3;
 
    margin-left: auto;
// Replié (explicite)
  }
&.is-collapsed {
  .vt-banner-btn {
width: 32px;
    order: 4;
 
    flex: 1 1 100%;
.toc, #toc { display: none !important; }
    justify-content: center;
 
    padding: 10px;
.vt-toc-collapse-btn {
  }
border-bottom: 1px solid @border;
height: 36px;
flex-shrink: 0;
}
 
.vt-toc-sidebar-title {
padding: 0;
border-bottom: 0;
display: flex;
align-items: center;
justify-content: center;
width: 32px;
flex: 1;
cursor: pointer;
overflow: hidden;
 
span {
writing-mode: vertical-rl;
transform: rotate(180deg);
white-space: nowrap;
letter-spacing: 0.2em;
font-size: 9px;
color: rgba(125, 255, 156, 0.35);
font-family: @font-mono;
font-weight: 500;
text-transform: uppercase;
display: block;
}
}
}
 
// Déplié — via classe JS .is-expanded UNIQUEMENT
&.is-expanded {
width: 260px;
max-width: 80vw;
overflow-y: auto;
overflow-x: hidden;
box-shadow: -4px 0 24px rgba(0, 0, 0, 0.6);
 
.toc li a {
white-space: normal !important;
overflow: visible !important;
text-overflow: unset !important;
}
}
}
 
#vt-toc-btn { display: none !important; }
#vt-toc-mobile-overlay { display: none !important; }
}
}

Dernière version du 10 juin 2026 à 23:58

/*
 * MediaWiki:Vaulttec.css — v42
 * Chargé uniquement pour les utilisateurs du skin VaultTec.
 *
 * v42 (optimisation, lot 2 — requiert le skin >= 1.5.0) : sections 19, 37,
 * 51, 54, 55, 56 migrées dans le skin (chargement conditionnel), section 53
 * réduite à son bloc (4). Lot 1 (v41, skin 1.4.0) : sections 18, 28, 42,
 * 44, 45, 52 + partie .mw-highlight de la 46. Les numéros manquants sont
 * volontaires — ne pas recréer ces sections ici.
 */
/* ============================================================
   1. VARIABLES
   ============================================================ */
:root {
  --background-color-dp-00: #06100b;
  --background-color-dp-01: #0a1a0f;
  --background-color-dp-02: #0f2015;
  --background-color-dp-03: #11251a;
  --background-color-dp-04: #142b1e;
  --background-color-dp-06: #173122;
  --background-color-dp-08: #1a3727;
  --background-color-dp-12: #1e3f2c;
  --background-color-dp-16: #214531;
  --background-color-dp-24: #254c36;
  --background-img:         none;
  --background-main:        transparent;
  --box-background-color:   rgba(12, 24, 18, 0.85);
  --box-shadow:             0 0 10px rgba(125, 255, 156, 0.12);
  --color-base:             #cce8d4;
  --color-warning:          #f5c84a;
  --color-link:             #4ab06a;
  --color-link-visited:     #357a4d;
  --border-color-base:      rgba(125, 255, 156, 0.15);
}

/* ============================================================
   2. BODY & CONTAINERS
   ============================================================ */
body { background: #06100b !important; background-image: none !important; }
.mw-page-container { background: transparent !important; border: none !important; max-width: 100% !important; padding: 0 !important; }

/* ============================================================
   3. LAYOUT
   ============================================================ */
.vt-page-container { display: flex !important; width: 100% !important; align-items: flex-start !important; min-height: calc(100vh - 54px) !important; }
.vt-sidebar, #mw-panel { width: 220px !important; flex-shrink: 0 !important; }
.vt-content-container, #content { flex: 1 1 auto !important; min-width: 0 !important; width: 0 !important; }
#bodyContent { max-width: none !important; width: 100% !important; padding: 28px 36px 60px !important; }

/* ============================================================
   4. TOC — rétractable, replié par défaut
   ============================================================ */
/* NOTE (audit) : les styles de toggle ci-dessous (.toctitle cliquable,
   flèche ▸, états .vt-toc-collapsed) supposent un JS qui bascule la
   classe au clic — ce JS n'existe ni dans le skin ni dans
   MediaWiki:Vaulttec.js. En pratique le TOC est déplacé dans la colonne
   de droite par skins.vaulttec.scripts ; ces règles ne s'appliquent
   qu'avant l'exécution du JS (ou sans JS). Conservées pour compat. */
#mw-content-text .toc, #mw-content-text #toc {
  float: none !important; clear: both !important; position: static !important;
  width: fit-content !important; max-width: min(300px, 100%) !important; min-width: 160px !important;
  margin: 0 0 20px 0 !important; padding: 0 !important;
  background: rgba(6, 15, 11, 0.88) !important; border: 1px solid rgba(125, 255, 156, 0.15) !important;
  border-radius: 3px !important; overflow: hidden !important; box-sizing: border-box !important; font-size: 12px !important;
}
#mw-content-text .toctitle, #mw-content-text .toc .toctitle {
  display: flex !important; align-items: center !important; justify-content: space-between !important;
  gap: 16px !important; padding: 8px 14px !important; cursor: pointer !important;
  user-select: none !important; margin: 0 !important; border-bottom: 1px solid transparent !important; white-space: nowrap !important;
}
#mw-content-text .toctitle h2, #mw-content-text .toc .toctitle h2 {
  font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; font-weight: 500 !important;
  text-transform: uppercase !important; letter-spacing: 0.12em !important;
  color: rgba(125, 255, 156, 0.65) !important; margin: 0 !important; padding: 0 !important; border: 0 !important;
}
#mw-content-text .toctitle::after { content: '▸'; color: rgba(125, 255, 156, 0.4); font-size: 9px; flex-shrink: 0; transition: transform 0.2s ease; }
#mw-content-text .toc:not(.vt-toc-collapsed) .toctitle { border-bottom-color: rgba(125, 255, 156, 0.12) !important; }
#mw-content-text .toc:not(.vt-toc-collapsed) .toctitle::after { transform: rotate(90deg); }
#mw-content-text .toc.vt-toc-collapsed > ul { display: none !important; }
#mw-content-text .toc:not(.vt-toc-collapsed) > ul { display: block !important; padding: 6px 0 8px !important; margin: 0 !important; }
#mw-content-text .toc ul { list-style: none !important; margin: 0 !important; padding: 0 !important; }
#mw-content-text .toc li a {
  display: flex !important; align-items: baseline !important; padding: 4px 14px !important;
  font-size: 11px !important; color: #7aaa88 !important; font-family: 'IBM Plex Mono', monospace !important;
  border-left: 2px solid transparent !important; transition: all 0.15s !important; text-decoration: none !important; white-space: nowrap !important;
}
#mw-content-text .toc li a:hover { color: #7dff9c !important; background: rgba(125, 255, 156, 0.08) !important; border-left-color: #4ab06a !important; }
#mw-content-text .toc li li a { padding-left: 24px !important; font-size: 10px !important; color: rgba(125, 255, 156, 0.4) !important; }
.tocnumber { color: rgba(125, 255, 156, 0.35) !important; margin-right: 6px !important; }

/* ============================================================
   5. INFOBOX
   ============================================================ */
.avt-infobox, .mw-parser-output .avt-infobox {
  width: 320px !important; max-width: 100% !important; float: right !important; clear: right !important;
  margin: 0 0 1em 1.5em !important; box-sizing: border-box !important;
  background-color: rgba(12, 24, 18, 0.9) !important; border-color: rgba(125, 255, 156, 0.2) !important;
  box-shadow: 0 0 10px rgba(125, 255, 156, 0.12) !important; color: #cce8d4 !important;
}
@media screen and (max-width: 720px) {
  .avt-infobox, .mw-parser-output .avt-infobox { width: 100% !important; float: none !important; clear: both !important; margin: 0 0 1em 0 !important; }
}
.avt-infobox-header { background-color: #142b1e !important; border-color: rgba(125, 255, 156, 0.2) !important; color: #7dff9c !important; }
.avt-infobox p.bloc, .avt-infobox caption { background-color: #142b1e !important; color: #7dff9c !important; }
.avt-infobox th[scope="row"] { color: #4ab06a !important; }
.avt-infobox td { color: #cce8d4 !important; }
.infobox-default-image { background-image: url("/images/1/11/Logo_wiki_LAVT_vert.png") !important; }
.avt-infobox caption, .mw-parser-output .avt-infobox caption { display: table-caption !important; width: 100% !important; box-sizing: border-box !important; }

/* ============================================================
   6. WIKITABLE
   ============================================================ */
.wikitable, .va-table, .mw-datatable { background-color: rgba(12, 24, 18, 0.85) !important; border-color: rgba(125, 255, 156, 0.15) !important; color: #cce8d4 !important; }
.wikitable > tr > th, .wikitable > * > tr > th, .va-table > tr > th, .va-table > * > tr > th { background-color: #0f2015 !important; color: #7dff9c !important; }
.wikitable > tr > td, .wikitable > * > tr > td, .va-table > tr > td, .va-table > * > tr > td { border-color: rgba(125, 255, 156, 0.1) !important; color: #cce8d4 !important; }
.wikitable tr:hover td { background-color: rgba(125, 255, 156, 0.06) !important; }

/* ============================================================
   7. PALETTES & NAVBOXES
   ============================================================ */
.palette { background-color: rgba(12, 24, 18, 0.85) !important; border-color: rgba(125, 255, 156, 0.15) !important; color: #cce8d4 !important; }
.palette-titre, .palette-banniere, .palette-section, .palette-groupe { background-color: #0f2015 !important; color: #7dff9c !important; }
.palette-pair { background-color: transparent !important; }
.va-infobox-title, .va-navbox-title { background: #0f2015 !important; color: #7dff9c !important; }

/* ============================================================
   8. BOÎTES GÉNÉRIQUES
   ============================================================ */
.avt-warn-banner, .avt-note-banner, .avt-section-banner, .avt-dropdown-box, .avt-genericbox,
.homepage-box, .spinoff-box, .avt-content-game-box { background-color: rgba(12, 24, 18, 0.85) !important; border-color: rgba(125, 255, 156, 0.15) !important; color: #cce8d4 !important; }
.avt-dropdown-box-title { background-color: #0f2015 !important; color: #7dff9c !important; }

/* Espacement réduit entre bandeaux d'avertissement consécutifs */
.mw-parser-output .avt-warn-banner,
.mw-parser-output .avt-note-banner,
.mw-parser-output .avt-section-banner {
  background-color: rgba(12, 24, 18, 0.85) !important;
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
  color: #cce8d4 !important;
  margin-bottom: 4px !important;
  box-shadow: none !important;
}

/* ============================================================
   9. LIENS
   ============================================================ */
.mw-parser-output a { color: #4ab06a; }
.mw-parser-output a:visited { color: #357a4d; }
.mw-parser-output a:hover { color: #7dff9c; }
.new, a.new { color: #ff5e5e !important; }

/* ============================================================
   10. TOC VECTOR 2022
   ============================================================ */
.sidebar-toc, .vector-toc { background-color: rgba(12, 24, 18, 0.85) !important; border-color: rgba(125, 255, 156, 0.15) !important; }
.vector-toc .vector-toc-link, .sidebar-toc .sidebar-toc-link { color: #4ab06a !important; }
.vector-toc .vector-toc-link:hover, .sidebar-toc .sidebar-toc-link:hover { color: #7dff9c !important; }

/* ============================================================
   11. PORTAILS & ACCUEIL
   ============================================================ */
.homepage-box-title, .portal-box-title, .spinoff-box-title, .canceled-box-title, .fangame-box-title,
.homepage-presentation-title, .homepage-participation-title, .homepage-articleday-title {
  color: #7dff9c !important; text-shadow: 0 0 8px rgba(125, 255, 156, 0.4) !important; border-color: rgba(125, 255, 156, 0.15) !important;
}

/* ============================================================
   12. SITENOTICE
   ============================================================ */
.avt-sitenotice { background-color: rgba(12, 24, 18, 0.9) !important; border-color: rgba(125, 255, 156, 0.2) !important; color: #cce8d4 !important; }

/* ============================================================
   13. RECHERCHE — dropdown miniatures (header)
   ============================================================ */
.vt-search { position: relative !important; }
.vt-search-dropdown { display: none; position: absolute; top: calc(100% + 2px); left: 0; width: 420px; max-width: calc(100vw - 40px); background: rgba(8, 18, 12, 0.98); border: 1px solid rgba(125, 255, 156, 0.2); border-top: none; z-index: 500; box-shadow: 0 12px 32px rgba(0, 0, 0, 0.7); backdrop-filter: blur(8px); }
.vt-search-item { display: flex; align-items: center; gap: 12px; padding: 9px 14px; color: #cce8d4; text-decoration: none !important; border-bottom: 1px solid rgba(125, 255, 156, 0.07); font-family: 'Crimson Pro', Georgia, serif; font-size: 15px; transition: background 0.1s; }
.vt-search-item:hover { background: rgba(125, 255, 156, 0.07); color: #7dff9c !important; text-decoration: none !important; }
.vt-search-thumb { width: 40px; height: 40px; flex-shrink: 0; background: rgba(125, 255, 156, 0.05); border: 1px solid rgba(125, 255, 156, 0.12); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.vt-search-thumb img { width: 40px; height: 40px; object-fit: cover; display: block; }
.vt-search-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vt-search-title mark { background: none; color: #7dff9c; font-weight: 700; }
.vt-search-footer { display: block; padding: 10px 14px; font-family: 'IBM Plex Mono', monospace; font-size: 10px; letter-spacing: 0.1em; color: rgba(125, 255, 156, 0.4); text-decoration: none !important; text-transform: uppercase; border-top: 1px dashed rgba(125, 255, 156, 0.1); background: rgba(125, 255, 156, 0.02); }
.vt-search-footer:hover { color: #7dff9c !important; background: rgba(125, 255, 156, 0.06); text-decoration: none !important; }

/* ============================================================
   14. BOUTON RECHERCHE — loupe
   ============================================================ */
.vt-search input.searchButton, .vt-search #searchButton { text-indent: -9999px !important; overflow: hidden !important; width: 42px !important; min-width: 42px !important; padding: 0 !important; flex-shrink: 0 !important; background-color: rgba(125, 255, 156, 0.10) !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%237dff9c' d='M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: center !important; background-size: 18px !important; border: 1px solid rgba(125, 255, 156, 0.35) !important; cursor: pointer !important; }
.vt-search input.searchButton:hover, .vt-search #searchButton:hover { background-color: rgba(125, 255, 156, 0.2) !important; }

/* ============================================================
   15. DARK MODE — icône parasite
   ============================================================ */
.ext-darkmode-link::before, .ext-darkmode-link:before { display: none !important; content: none !important; }

/* ============================================================
   16. CATÉGORIES
   ============================================================ */
#catlinks { background-color: rgba(12, 24, 18, 0.85) !important; border-top: 1px solid rgba(125, 255, 156, 0.15) !important; border-bottom: none !important; padding: 10px 36px !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; letter-spacing: 0.1em !important; color: #7aaa88 !important; }
#catlinks a { color: #4ab06a !important; text-decoration: none !important; text-transform: uppercase !important; letter-spacing: 0.12em !important; font-size: 10px !important; }
#catlinks a:hover { color: #7dff9c !important; }
#mw-normal-catlinks > a:first-child { display: none !important; }
#catlinks ul { display: inline !important; list-style: none !important; margin: 0 !important; padding: 0 !important; }
#catlinks ul li { display: inline !important; }
#catlinks ul li::before { content: '·' !important; margin: 0 6px !important; color: rgba(125, 255, 156, 0.25) !important; }
#catlinks.catlinks-allhidden { display: none !important; }

/* ============================================================
   17. TITRES — structure MW 1.44+, sizing fluide responsive
   ============================================================ */
.mw-parser-output .mw-heading { display: flex !important; align-items: baseline !important; border-bottom: 1px solid rgba(125, 255, 156, 0.13) !important; margin: 22px 0 10px !important; padding-bottom: 6px !important; }
.mw-parser-output .mw-heading h2, .mw-parser-output > h2 { display: block !important; flex: 1 !important; border-bottom: 0 !important; margin: 0 !important; padding-bottom: 0 !important; font-family: 'Instrument Serif', Georgia, serif !important; font-style: italic !important; font-size: clamp(1.25rem, 1.05rem + 1vw, 1.625rem) !important; line-height: 1.25 !important; color: #cce8d4 !important; text-align: left !important; }
.mw-parser-output .mw-heading h3, .mw-parser-output > h3 { font-size: clamp(0.95rem, 0.85rem + 0.5vw, 1.1rem) !important; line-height: 1.3 !important; margin: 0 !important; flex: 1 !important; }
.mw-parser-output .mw-heading h4, .mw-parser-output > h4 { font-size: clamp(0.875rem, 0.8rem + 0.3vw, 1rem) !important; line-height: 1.3 !important; margin: 0 !important; flex: 1 !important; }
.mw-parser-output .mw-heading h5, .mw-parser-output > h5, .mw-parser-output .mw-heading h6, .mw-parser-output > h6 { font-size: 0.9rem !important; line-height: 1.3 !important; margin: 0 !important; flex: 1 !important; }
.mw-parser-output .mw-heading .mw-editsection { flex-shrink: 0 !important; margin-left: 12px !important; }
.mw-parser-output .mw-heading-3, .mw-parser-output .mw-heading-4, .mw-parser-output .mw-heading-5, .mw-parser-output .mw-heading-6 { margin: 16px 0 8px !important; padding-bottom: 4px !important; }
.mw-parser-output .mw-heading + .mw-heading { margin-top: 6px !important; }

/* ============================================================
   18. MODIFICATIONS RÉCENTES — filtres OOUI + légende
   → MIGRÉE dans le skin : skinStyles/mediawiki.rcfilters.less + mediawiki.special.changeslist.less
   ============================================================ */
/* ============================================================
   19. OOUI — fonds blancs résiduels
   → MIGRÉE dans le skin : skinStyles/oojs-ui-core.less
   ============================================================ */
/* ============================================================
   20. ÉDITEUR — formulaire uniquement (pas de CodeMirror)
   ============================================================ */
#editform, .editOptions, .wikiEditor-ui, .wikiEditor-ui-toolbar, .wikiEditor-ui-text { background-color: rgba(12, 24, 18, 0.9) !important; border-color: rgba(125, 255, 156, 0.15) !important; color: #cce8d4 !important; }
#wpTextbox1, .wikiEditor-ui-text textarea { background-color: #060f0b !important; color: #cce8d4 !important; border-color: rgba(125, 255, 156, 0.2) !important; }
.wikiEditor-ui-toolbar { background: #0f2015 !important; border-bottom: 1px solid rgba(125, 255, 156, 0.15) !important; }
.wikiEditor-ui-toolbar .group { border-right-color: rgba(125, 255, 156, 0.1) !important; }
.wikiEditor-ui-toolbar .tool:hover { background: rgba(125, 255, 156, 0.08) !important; }
#wpSave, #wpPreview, #wpDiff, .editButtons input[type="submit"] { background-color: rgba(12, 24, 18, 0.9) !important; border: 1px solid rgba(125, 255, 156, 0.3) !important; color: #4ab06a !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; letter-spacing: 0.1em !important; cursor: pointer !important; transition: all 0.15s !important; }
#wpSave:hover, #wpPreview:hover, #wpDiff:hover, .editButtons input[type="submit"]:hover { background-color: rgba(125, 255, 156, 0.1) !important; color: #7dff9c !important; border-color: rgba(125, 255, 156, 0.5) !important; }
#wpSave { background-color: rgba(125, 255, 156, 0.12) !important; color: #7dff9c !important; border-color: rgba(125, 255, 156, 0.4) !important; }
.editButtons .mw-editbutton-cancel { color: rgba(125, 255, 156, 0.4) !important; }
#wpSummary, #wpSummaryWidget input { background-color: #060f0b !important; border-color: rgba(125, 255, 156, 0.2) !important; color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important; }
#wpSummary:focus, #wpSummaryWidget input:focus { border-color: #7dff9c !important; outline: none !important; box-shadow: 0 0 0 2px rgba(125, 255, 156, 0.12) !important; }
.editCheckboxes label, .editOptions label { color: #7aaa88 !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; }
.editpage-head-copywarn, #editpage-copywarn { color: #4a6e55 !important; font-size: 11px !important; }

/* ============================================================
   21. MOBILE — onglets défilants
   ============================================================ */
@media screen and (max-width: 720px) {
  .vt-page-tabs { overflow-x: auto !important; overflow-y: hidden !important; -webkit-overflow-scrolling: touch !important; scrollbar-width: thin !important; flex-wrap: nowrap !important; height: auto !important; min-height: 44px !important; padding: 0 8px !important; }
  .vt-page-tabs::-webkit-scrollbar { height: 3px !important; }
  .vt-page-tabs::-webkit-scrollbar-thumb { background: rgba(125, 255, 156, 0.2) !important; }
  .vt-tabs-ns ul, .vt-tabs-views ul, .vt-tabs-more ul { flex-wrap: nowrap !important; white-space: nowrap !important; }
  .vt-page-tabs li a { white-space: nowrap !important; padding: 0 10px !important; font-size: 10px !important; }
  .vt-tabs-sep { display: none !important; }
}

/* ============================================================
   22. TITRE DE PAGE — padding cohérent
   ============================================================ */
#firstHeading, #mw-content-subtitle { padding-left: 36px !important; padding-right: 36px !important; }

/* ============================================================
   23. NAV PRIMAIRE — masquer si vide
   ============================================================ */
.vt-nav-primary:not(:has(a)) { display: none !important; width: 0 !important; padding: 0 !important; border: none !important; }

/* ============================================================
   24. FIXES SKIN
   ============================================================ */
html body .CodeMirror { padding: 0 !important; }
/* NOTE : la règle .vt-drawer-overlay { pointer-events: none } a été retirée car
   elle contredisait le comportement attendu de l'overlay (capture des clics
   pour fermer le drawer). Le skin.less gère cette propriété correctement
   en distinguant l'état fermé (none) et ouvert (auto). */
@media screen and (min-width: 901px) { .vt-drawer-close { display: none !important; } }
.vt-watermark { display: none !important; }
@media screen and (max-width: 900px) {
  .vt-user-tools { overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; max-width: calc(100vw - 180px); flex-shrink: 1; }
  .vt-user-tools::-webkit-scrollbar { display: none; }
  .vt-user-tools ul { flex-wrap: nowrap; }
  .vt-user-tools li a { padding: 0 8px; font-size: 10px; letter-spacing: 0.06em; }
}
@media screen and (max-width: 600px) { #pt-preferences, #pt-watchlist { display: none; } }

/* ============================================================
   25. MEDIAUPLOADER — Spécial:MediaUploader
   ============================================================ */
#upload-wizard { background: rgba(12, 24, 18, 0.6); border: 1px solid rgba(125, 255, 156, 0.15); color: #cce8d4; padding: 24px; border-radius: 4px; margin-top: 16px; }
#upload-wizard .ui-widget, #upload-wizard .ui-widget-content, #upload-wizard .ui-state-default, #upload-wizard .ui-corner-all, #upload-wizard .ui-corner-top, #upload-wizard .ui-corner-bottom, #upload-wizard .mediauploader-form { background-color: transparent !important; border-color: transparent !important; color: inherit !important; }
#mediauploader-steps, #mediauploader-steps.arrowSteps { background: rgba(6, 15, 11, 0.8) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 4px; padding: 0 !important; margin: 0 0 24px 0 !important; list-style: none; display: flex !important; overflow: hidden; height: auto !important; }
#mediauploader-steps li, #mediauploader-steps.arrowSteps li { flex: 1; padding: 14px 6px !important; background: transparent !important; background-image: none !important; color: rgba(125, 255, 156, 0.4) !important; text-transform: uppercase; letter-spacing: 0.05em; font-size: 10px !important; font-family: 'IBM Plex Mono', monospace !important; font-weight: 500; border: 0 !important; border-right: 1px solid rgba(125, 255, 156, 0.15) !important; margin: 0 !important; text-align: center; line-height: 1.3 !important; height: auto !important; min-height: 0 !important; white-space: normal !important; overflow: visible !important; text-overflow: clip !important; word-break: keep-all; }
#mediauploader-steps li::before, #mediauploader-steps li::after, #mediauploader-steps.arrowSteps li::before, #mediauploader-steps.arrowSteps li::after { display: none !important; content: none !important; }
#mediauploader-steps li:last-child { border-right: 0 !important; }
#mediauploader-steps li.arrow, #mediauploader-steps li.current, #mediauploader-steps li.mediauploader-step-current { background: rgba(125, 255, 156, 0.12) !important; color: #7dff9c !important; box-shadow: inset 0 -2px 0 #7dff9c; }
#mediauploader-steps li.completed, #mediauploader-steps li.mediauploader-step-completed { color: #4ab06a !important; }
#mediauploader-content, .mediauploader-stepdiv { color: #cce8d4; }
.mediauploader-stepdiv h2, .mediauploader-stepdiv h3 { color: #7dff9c !important; font-family: 'IBM Plex Mono', monospace !important; font-weight: 500 !important; text-transform: uppercase; letter-spacing: 0.05em; border-bottom: 1px solid rgba(125, 255, 156, 0.2); padding-bottom: 8px; margin-top: 24px; }
#mediauploader-filelist, #mediauploader-filelist.ui-corner-all { background: transparent !important; border: 0 !important; padding: 0 !important; }
.mediauploader-file { background: rgba(6, 15, 11, 0.8) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 4px !important; padding: 16px !important; margin-bottom: 12px !important; color: #cce8d4 !important; }
.mediauploader-file.filled { border-color: rgba(125, 255, 156, 0.35) !important; }
#upload-wizard .mediauploader-visible-file, #upload-wizard .mediauploader-visible-file.ui-corner-top.ui-corner-bottom { background-color: rgba(6, 15, 11, 0.7) !important; border: 1px solid rgba(125, 255, 156, 0.15) !important; border-radius: 4px !important; padding: 16px 20px !important; color: #cce8d4 !important; }
#upload-wizard .mediauploader-visible-file-filename, #upload-wizard .mediauploader-file-texts, #upload-wizard .mediauploader-file-preview { background-color: transparent !important; }
#upload-wizard .mediauploader-visible-file-filename-text { color: #7dff9c !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 13px !important; font-weight: 500; }
.mediauploader-file-status-line { color: rgba(168, 230, 184, 0.7) !important; font-size: 12px; font-style: italic; margin-top: 4px; }
.mediauploader-file-indicator { background: transparent !important; }
#upload-wizard .mediauploader-thumbnail, #upload-wizard .mediauploader-thumbnail-side { background-color: transparent !important; position: relative !important; }
#upload-wizard .mediauploader-add-file, #upload-wizard .oo-ui-selectFileInputWidget, #upload-wizard .oo-ui-selectFileWidget { background: rgba(6, 15, 11, 0.6) !important; background-image: none !important; border: 2px dashed rgba(125, 255, 156, 0.25) !important; border-radius: 4px !important; padding: 16px 20px !important; color: #cce8d4 !important; transition: all 0.2s ease; box-shadow: none !important; }
#upload-wizard .mediauploader-add-file:hover, #upload-wizard .oo-ui-selectFileWidget-canDrop { border-color: #7dff9c !important; background: rgba(125, 255, 156, 0.05) !important; }
#upload-wizard .oo-ui-selectFileInputWidget-info, #upload-wizard .oo-ui-selectFileInputWidget-info.oo-ui-textInputWidget { background: transparent !important; background-image: none !important; border: 0 !important; box-shadow: none !important; color: rgba(168, 230, 184, 0.6) !important; }
#upload-wizard .oo-ui-selectFileInputWidget-info input[type="search"], #upload-wizard .oo-ui-selectFileInputWidget-info .oo-ui-inputWidget-input { background: transparent !important; background-image: none !important; color: rgba(168, 230, 184, 0.6) !important; border: 0 !important; box-shadow: none !important; font-style: italic; }
#upload-wizard .oo-ui-selectFileInputWidget-info input[type="search"]::placeholder { color: rgba(168, 230, 184, 0.5) !important; font-style: italic; }
#upload-wizard .oo-ui-selectFileInputWidget-dropLabel, #upload-wizard .oo-ui-selectFileWidget-dropLabel { background: transparent !important; color: rgba(168, 230, 184, 0.6) !important; font-style: italic; }
#upload-wizard .oo-ui-selectFileInputWidget-selectButton { background: transparent !important; }
#upload-wizard .oo-ui-buttonElement > .oo-ui-buttonElement-button, .mediauploader-stepdiv .oo-ui-buttonElement > .oo-ui-buttonElement-button { background: rgba(12, 24, 18, 0.9) !important; background-image: none !important; border: 1px solid rgba(125, 255, 156, 0.3) !important; color: #4ab06a !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; text-transform: uppercase !important; letter-spacing: 0.12em !important; padding: 8px 18px !important; border-radius: 2px !important; box-shadow: none !important; text-shadow: none !important; transition: all 0.2s ease; min-height: 36px !important; }
#upload-wizard .oo-ui-buttonElement > .oo-ui-buttonElement-button:hover, .mediauploader-stepdiv .oo-ui-buttonElement > .oo-ui-buttonElement-button:hover { background: rgba(125, 255, 156, 0.1) !important; color: #7dff9c !important; border-color: rgba(125, 255, 156, 0.6) !important; }
#upload-wizard .oo-ui-flaggedElement-primary > .oo-ui-buttonElement-button, #upload-wizard .oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button, .mediauploader-stepdiv .oo-ui-flaggedElement-primary > .oo-ui-buttonElement-button, .mediauploader-stepdiv .oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button { background: rgba(125, 255, 156, 0.15) !important; color: #7dff9c !important; border-color: #7dff9c !important; font-weight: 500 !important; }
#upload-wizard .oo-ui-flaggedElement-primary > .oo-ui-buttonElement-button:hover, #upload-wizard .oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover { background: rgba(125, 255, 156, 0.25) !important; color: #cdffd6 !important; box-shadow: 0 0 12px rgba(125, 255, 156, 0.3) !important; }
#upload-wizard .oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button, .mediauploader-stepdiv .oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button { background: rgba(255, 122, 122, 0.08) !important; color: #ff7a7a !important; border-color: rgba(255, 122, 122, 0.4) !important; }
#upload-wizard .oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:hover { background: rgba(255, 122, 122, 0.15) !important; color: #ff9a9a !important; }
#upload-wizard .oo-ui-widget-disabled .oo-ui-buttonElement-button, .mediauploader-stepdiv .oo-ui-widget-disabled .oo-ui-buttonElement-button { opacity: 0.4 !important; cursor: not-allowed !important; }
#upload-wizard .oo-ui-iconElement-icon, .mediauploader-stepdiv .oo-ui-iconElement-icon { filter: brightness(0) saturate(100%) invert(91%) sepia(15%) saturate(594%) hue-rotate(76deg) brightness(101%) contrast(101%); opacity: 0.85; }
#upload-wizard input[type="text"], #upload-wizard input[type="number"], #upload-wizard textarea, #upload-wizard .oo-ui-textInputWidget input, #upload-wizard .oo-ui-textInputWidget textarea, #upload-wizard .oo-ui-multilineTextInputWidget textarea { background: rgba(6, 15, 11, 0.9) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 13px !important; padding: 8px 12px !important; border-radius: 2px !important; box-shadow: none !important; }
#upload-wizard input:focus, #upload-wizard textarea:focus, #upload-wizard .oo-ui-textInputWidget input:focus, #upload-wizard .oo-ui-textInputWidget textarea:focus, #upload-wizard .oo-ui-multilineTextInputWidget textarea:focus { border-color: #7dff9c !important; outline: 0 !important; box-shadow: 0 0 0 2px rgba(125, 255, 156, 0.15) !important; }
#upload-wizard .oo-ui-progressBarWidget, #upload-wizard .mediauploader-progress { background: rgba(6, 15, 11, 0.9) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 2px; overflow: hidden; height: 8px; }
#upload-wizard .oo-ui-progressBarWidget-bar, #upload-wizard .mediauploader-progress-bar { background: linear-gradient(90deg, #4ab06a, #7dff9c) !important; height: 100% !important; transition: width 0.3s ease; }
#upload-wizard .errorbox, .mediauploader-error { background: rgba(255, 94, 94, 0.1) !important; border: 1px solid rgba(255, 94, 94, 0.4) !important; color: #ff9a9a !important; padding: 12px !important; border-radius: 4px; }
#upload-wizard .successbox, .mediauploader-success { background: rgba(125, 255, 156, 0.08) !important; border: 1px solid rgba(125, 255, 156, 0.4) !important; color: #7dff9c !important; padding: 12px !important; border-radius: 4px; }
#upload-wizard .warningbox, .mediauploader-warning { background: rgba(245, 200, 74, 0.1) !important; border: 1px solid rgba(245, 200, 74, 0.4) !important; color: #f5c84a !important; padding: 12px !important; border-radius: 4px; }
#upload-wizard a { color: #7dff9c !important; text-decoration: none; border-bottom: 1px solid rgba(125, 255, 156, 0.3); }
#upload-wizard a:hover { color: #cdffd6 !important; border-bottom-color: #7dff9c; }
.mediauploader-unavailable, .mw-special-MediaUploader #mw-content-text > p:first-child { background: rgba(6, 15, 11, 0.6); border: 1px solid rgba(125, 255, 156, 0.2); border-left: 3px solid #f5c84a; padding: 16px 20px; color: #cce8d4; border-radius: 4px; }
#mediauploader-deeds-thumbnails { background-color: transparent !important; border-radius: 2px; text-align: center; margin: 1em 0; }
#mediauploader-deeds-thumbnails .mediauploader-thumbnail { background: transparent !important; }
#mediauploader-deeds-thumbnails canvas { filter: brightness(0.8) sepia(1) hue-rotate(76deg) saturate(0.5); opacity: 0.7; }

/* ============================================================
   26. PAGE D'ACCUEIL — Grille responsive
   ============================================================ */
.homepage { display: grid; grid-template-columns: 1fr 1fr; grid-template-areas: "welcome welcome" "games games" "autres theme" "anecdotes articleday" "presentation participation"; gap: 16px; width: 100%; box-sizing: border-box; }
.homepage-welcome { grid-area: welcome; }
.homepage-portal-games { grid-area: games; }
.homepage-portal-autres { grid-area: autres; }
.homepage-portal-theme { grid-area: theme; }
.homepage-anecdotes { grid-area: anecdotes; }
.homepage-articleday { grid-area: articleday; }
.homepage-presentation { grid-area: presentation; }
.homepage-participation { grid-area: participation; }
.homepage-box { background: rgba(6, 15, 11, 0.7); border: 1px solid rgba(125, 255, 156, 0.15); border-radius: 4px; overflow: hidden; }
.homepage-box-title { background: rgba(125, 255, 156, 0.07); border-bottom: 1px solid rgba(125, 255, 156, 0.2); color: #7dff9c; font-family: 'IBM Plex Mono', monospace; font-size: 11px; font-weight: 500; text-transform: uppercase; letter-spacing: 0.12em; padding: 10px 16px; margin: 0; text-align: center; }
.homepage-box-content { padding: 16px; color: #cce8d4; }
.homepage-box-content a { color: #7dff9c; text-decoration: none; border-bottom: 1px solid rgba(125, 255, 156, 0.3); }
.homepage-box-content a:hover { color: #cdffd6; border-bottom-color: #7dff9c; }
.homepage-welcome { background: rgba(6, 15, 11, 0.7) !important; border: 1px solid rgba(125, 255, 156, 0.15) !important; border-radius: 4px !important; overflow: hidden; padding: 0 !important; text-align: center; }
.homepage-welcome-title { background: rgba(125, 255, 156, 0.07); border-bottom: 1px solid rgba(125, 255, 156, 0.2); color: #7dff9c !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; font-weight: 500; font-style: normal !important; text-transform: uppercase; letter-spacing: 0.12em; padding: 10px 16px; margin: 0; text-shadow: none !important; }
html body .homepage-welcome .logo-light, html body .homepage .logo-light { display: none !important; }
html body .homepage-welcome .logo-dark, html body .homepage .logo-dark { display: inline !important; }
.logo-accueil { margin: 20px auto; background: transparent !important; display: block; }
.logo-accueil img { max-width: 340px; width: 100%; height: auto; filter: drop-shadow(0 0 16px rgba(125, 255, 156, 0.2)); }
.homepage-welcome-subtitle { color: #cce8d4; font-size: 0.95em; margin: 6px 16px; line-height: 1.6; }
.homepage-welcome-subtitle a { color: #7dff9c !important; border-bottom: 1px solid rgba(125, 255, 156, 0.3); text-decoration: none; }
.homepage-welcome-subtitle a:hover { color: #cdffd6 !important; }
.homepage-welcome-links { margin: 20px 16px; display: flex; justify-content: center; align-items: center; gap: 20px; flex-wrap: wrap; border-top: 1px solid rgba(125, 255, 156, 0.1); padding-top: 16px; }
.homepage-welcome-links img { transition: filter 0.2s ease, transform 0.2s ease; }
.homepage-welcome-links img:hover { filter: brightness(1.15) drop-shadow(0 0 8px rgba(125, 255, 156, 0.4)); transform: scale(1.06); }
.homepage-portal-games-list { display: flex; flex-wrap: wrap; list-style: none; padding: 8px; margin: 0; gap: 12px; justify-content: center; }
.homepage-portal-games-item { flex: 0 0 calc(25% - 12px); max-width: 130px; text-align: center; color: #cce8d4; }
.homepage-portal-games-logo { margin-bottom: 6px; display: flex; justify-content: center; align-items: center; height: 70px; }
.homepage-portal-games-logo img { max-width: 100%; max-height: 70px; width: auto; height: auto; transition: filter 0.2s ease, transform 0.2s ease; }
.homepage-portal-games-logo img:hover { filter: brightness(1.2) drop-shadow(0 0 8px rgba(125, 255, 156, 0.4)); transform: scale(1.07); }
.homepage-portal-games-item div:last-child a, .homepage-portal-games-item em a, .homepage-portal-games-item i a { color: #7dff9c !important; font-size: 12px; text-decoration: none; border-bottom: 1px solid rgba(125, 255, 156, 0.3); font-style: italic; }
.homepage-portal-autres-list { display: flex; flex-wrap: wrap; list-style: none; padding: 8px; margin: 0; gap: 16px; justify-content: center; }
.homepage-portal-autres-list .homepage-portal-games-item { flex: 0 0 calc(33% - 16px); max-width: 150px; }
.homepage-portal-autres-list .homepage-portal-games-logo { height: 90px; }
.homepage-portal-autres-list .homepage-portal-games-logo img { max-height: 90px; }
.homepage-portal-theme .liste-horizontale ul { display: flex; flex-wrap: wrap; list-style: none; padding: 4px; margin: 0; gap: 6px; justify-content: center; }
.homepage-portal-theme .liste-horizontale li { background: rgba(125, 255, 156, 0.06); border: 1px solid rgba(125, 255, 156, 0.15); border-radius: 2px; padding: 5px 10px; list-style: none; margin: 0; }
.homepage-portal-theme .liste-horizontale li::before { display: none; }
.homepage-portal-theme .liste-horizontale li a { color: #7dff9c !important; font-family: 'IBM Plex Mono', monospace; font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; text-decoration: none; border-bottom: 0; }
.homepage-portal-theme .liste-horizontale li a:hover { color: #cdffd6 !important; }
@media screen and (max-width: 720px) {
  .nomobile { display: none !important; }
  .homepage { grid-template-columns: 1fr; grid-template-areas: "welcome" "games" "autres" "theme" "anecdotes" "articleday" "presentation" "participation"; gap: 10px; padding: 8px; }
  .homepage-welcome, .homepage-welcome.nomobile { display: block !important; grid-area: welcome !important; }
  .homepage-welcome .logo-accueil { display: none !important; }
  .homepage-welcome-title { font-size: 10px !important; padding: 8px 12px; }
  .homepage-welcome-subtitle { font-size: 0.85em; margin: 4px 12px; }
  .homepage-welcome-links { margin: 12px; gap: 12px; padding-top: 12px; }
  .homepage-portal-games-list { gap: 8px; padding: 8px 4px; }
  .homepage-portal-games-item { flex: 0 0 calc(50% - 8px); max-width: none; }
  .homepage-portal-games-logo { height: 55px; }
  .homepage-portal-games-logo img { max-height: 55px; }
  .homepage-portal-autres-list .homepage-portal-games-item { flex: 0 0 100%; max-width: none; display: flex; align-items: center; gap: 12px; text-align: left; }
  .homepage-portal-autres-list .homepage-portal-games-logo { height: 50px; min-width: 60px; flex-shrink: 0; }
  .homepage-portal-theme .liste-horizontale li { padding: 4px 8px; font-size: 10px; }
  .homepage-box-title { font-size: 10px; padding: 8px 12px; letter-spacing: 0.1em; }
  .homepage-box-content { padding: 12px; font-size: 14px; }
}
@media screen and (min-width: 721px) { .mobileonly { display: none !important; } }
@media screen and (min-width: 721px) and (max-width: 1100px) {
  .homepage-portal-games-item { flex: 0 0 calc(25% - 12px); }
  .homepage-portal-games-logo { height: 60px; }
  .homepage-portal-games-logo img { max-height: 60px; }
}

/* ============================================================
   27. LISIBILITÉ — Taille du texte des articles
   ============================================================ */
.mw-parser-output { font-size: 17px; line-height: 1.75; }
#firstHeading { font-size: clamp(1.5rem, 1.2rem + 1.5vw, 2.25rem) !important; line-height: 1.2 !important; margin-bottom: 8px !important; }
@media screen and (max-width: 900px) {
  .mw-editsection, .mw-editsection-bracket, .mw-editsection-divider { display: none !important; }
  .mw-parser-output .mw-heading h2, .mw-parser-output .mw-heading h3, .mw-parser-output .mw-heading h4, .mw-parser-output .mw-heading h5, .mw-parser-output .mw-heading h6 { word-break: normal !important; overflow-wrap: normal !important; hyphens: none !important; white-space: normal !important; }
  #bodyContent { padding: 16px 16px 40px !important; }
  #firstHeading, #mw-content-subtitle { padding-left: 16px !important; padding-right: 16px !important; }
}

/* ============================================================
   28. VISUAL EDITOR — Toolbar sticky + surface + popups
   → MIGRÉE dans le skin : skinStyles/ve-overrides.less + oojs-ui-windows.less
   ============================================================ */
/* ============================================================
   29. LECTEUR AUDIO — thème phosphore
   ============================================================ */
.mw-tmh-player,
.mediaContainer {
  display: block !important;
  width: 100% !important;
  max-width: 440px !important;
  margin: 12px auto !important;
  background: rgba(6, 15, 11, 0.85) !important;
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
  border-radius: 3px !important;
  padding: 8px !important;
  box-sizing: border-box !important;
}
.mw-parser-output audio,
audio.mw-file-element,
.mw-parser-output audio.mw-file-element,
audio.oo-ui-widget {
  display: block !important;
  width: 100% !important;
  max-width: 440px !important;
  min-width: 280px !important;
  height: 40px !important;
  margin: 12px auto !important;
  background: rgba(6, 15, 11, 0.9) !important;
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
  border-radius: 3px !important;
  outline: none !important;
  accent-color: #7dff9c !important;
}
.mw-parser-output audio::-webkit-media-controls-panel,
audio.mw-file-element::-webkit-media-controls-panel { background: rgba(6, 15, 11, 0.95) !important; border-radius: 3px !important; }
.mw-parser-output audio::-webkit-media-controls-play-button,
.mw-parser-output audio::-webkit-media-controls-mute-button,
audio.mw-file-element::-webkit-media-controls-play-button,
audio.mw-file-element::-webkit-media-controls-mute-button { filter: invert(1) sepia(1) saturate(3) hue-rotate(76deg) !important; }
.mw-parser-output audio::-webkit-media-controls-current-time-display,
.mw-parser-output audio::-webkit-media-controls-time-remaining-display,
audio.mw-file-element::-webkit-media-controls-current-time-display,
audio.mw-file-element::-webkit-media-controls-time-remaining-display {
  color: #7dff9c !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important;
}
.mw-parser-output blockquote:has(audio) {
  background: rgba(6, 15, 11, 0.6) !important;
  border: 1px solid rgba(125, 255, 156, 0.12) !important;
  border-left: 3px solid rgba(125, 255, 156, 0.3) !important;
  border-radius: 3px !important;
  padding: 12px 16px !important;
  font-style: italic !important;
  color: #cce8d4 !important;
  max-width: 480px !important;
  margin: 12px auto !important;
}

/* ============================================================
   30. PAGES CONNEXION & CRÉATION DE COMPTE — Codex (MW 1.45)
   ============================================================ */
.mw-special-Userlogin .mw-body-content,
.mw-special-CreateAccount .mw-body-content { display: flex !important; gap: 40px !important; align-items: flex-start !important; }
#userloginForm,
#createaccount {
  background: rgba(6, 15, 11, 0.85) !important;
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
  border-radius: 4px !important;
  padding: 24px !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 320px !important;
  max-width: 480px !important;
  box-sizing: border-box !important;
  color: #cce8d4 !important;
}
#userloginForm .cdx-field, #createaccount .cdx-field { margin-bottom: 16px !important; }
#userloginForm .cdx-text-input, #createaccount .cdx-text-input,
#userloginForm .cdx-field, #createaccount .cdx-field { width: 100% !important; box-sizing: border-box !important; }
#userloginForm .cdx-label__label, #createaccount .cdx-label__label,
#userloginForm .cdx-label, #createaccount .cdx-label {
  color: rgba(125, 255, 156, 0.6) !important; font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important; text-transform: uppercase !important; letter-spacing: 0.12em !important;
  margin-bottom: 6px !important; display: block !important;
}
#userloginForm .cdx-text-input__input,
#createaccount .cdx-text-input__input,
#userloginForm .cdx-text-input__input:enabled,
#createaccount .cdx-text-input__input:enabled {
  width: 100% !important; box-sizing: border-box !important;
  background-color: rgba(6, 15, 11, 0.9) !important;
  border-color: rgba(125, 255, 156, 0.2) !important;
  color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important;
  font-size: 13px !important; padding: 10px 12px !important;
}
#userloginForm .cdx-text-input__input:focus, #createaccount .cdx-text-input__input:focus {
  border-color: #7dff9c !important; outline: none !important;
  box-shadow: 0 0 0 2px rgba(125, 255, 156, 0.12) !important;
}
#userloginForm .cdx-text-input__input:-webkit-autofill,
#createaccount .cdx-text-input__input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px rgba(6, 15, 11, 0.95) inset !important;
  -webkit-text-fill-color: #cce8d4 !important;
}
#userloginForm .cdx-field__help-text, #createaccount .cdx-field__help-text { color: rgba(125, 255, 156, 0.3) !important; font-size: 11px !important; }
#wpLoginAttempt, #wpCreateaccount {
  display: block !important; width: 100% !important; box-sizing: border-box !important;
  background: rgba(125, 255, 156, 0.12) !important; border: 1px solid rgba(125, 255, 156, 0.4) !important;
  border-radius: 2px !important; color: #7dff9c !important; font-family: 'IBM Plex Mono', monospace !important;
  font-size: 11px !important; font-weight: 500 !important; text-transform: uppercase !important;
  letter-spacing: 0.15em !important; padding: 14px !important; cursor: pointer !important;
  margin-top: 8px !important; transition: all 0.2s !important;
}
#wpLoginAttempt:hover, #wpCreateaccount:hover { background: rgba(125, 255, 156, 0.22) !important; border-color: #7dff9c !important; box-shadow: 0 0 16px rgba(125, 255, 156, 0.2) !important; }
#userloginForm .mw-form-related-link-container, #createaccount .mw-form-related-link-container { margin-top: 16px !important; text-align: center !important; }
#userloginForm a, #createaccount a { color: #4ab06a !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 10px !important; text-transform: uppercase !important; letter-spacing: 0.1em !important; }
#userloginForm .mw-ui-checkbox input + label, #wpRemember + label { color: #7aaa88 !important; font-size: 12px !important; font-family: 'IBM Plex Mono', monospace !important; text-transform: none !important; letter-spacing: 0 !important; }
.mw-createaccount-benefits-container { flex: 1 !important; padding: 20px !important; }
.mw-createaccount-benefits-heading { color: #cce8d4 !important; font-family: 'Instrument Serif', Georgia, serif !important; font-style: italic !important; font-size: 1.3em !important; margin-bottom: 24px !important; }
.mw-number-text h2 { color: rgba(125, 255, 156, 0.5) !important; font-size: 3em !important; }
.mw-number-text p { color: rgba(125, 255, 156, 0.35) !important; }
.mw-message-box-error, .errorbox { background: rgba(255, 94, 94, 0.1) !important; border: 1px solid rgba(255, 94, 94, 0.4) !important; color: #ff9a9a !important; border-radius: 2px !important; padding: 12px !important; margin-bottom: 16px !important; }
@media screen and (max-width: 720px) {
  .mw-special-Userlogin .mw-body-content, .mw-special-CreateAccount .mw-body-content { flex-direction: column !important; }
  #userloginForm, #createaccount { flex: none !important; width: 100% !important; max-width: 100% !important; padding: 16px !important; }
  .mw-createaccount-benefits-container { display: none !important; }
}

/* ============================================================
   31. PAGE PRÉFÉRENCES
   ============================================================ */
.oo-ui-tabSelectWidget { background: rgba(6, 15, 11, 0.9) !important; border-bottom: 1px solid rgba(125, 255, 156, 0.15) !important; }
.oo-ui-tabOptionWidget { background: transparent !important; border: 0 !important; border-bottom: 2px solid transparent !important; color: rgba(125, 255, 156, 0.4) !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 10px !important; text-transform: uppercase !important; letter-spacing: 0.1em !important; padding: 10px 16px !important; transition: color 0.15s, border-color 0.15s !important; }
.oo-ui-tabOptionWidget:hover { color: #7dff9c !important; background: rgba(125, 255, 156, 0.05) !important; }
.oo-ui-tabOptionWidget.oo-ui-optionWidget-selected { color: #7dff9c !important; border-bottom-color: #7dff9c !important; background: rgba(125, 255, 156, 0.07) !important; }
#preferences { background: transparent !important; color: #cce8d4 !important; }
#preferences h2 { color: #7dff9c !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 10px !important; font-weight: 500 !important; text-transform: uppercase !important; letter-spacing: 0.15em !important; border-bottom: 1px dashed rgba(125, 255, 156, 0.15) !important; padding-bottom: 8px !important; margin: 24px 0 16px !important; }
#preferences .mw-htmlform-field label, #preferences .oo-ui-labelElement-label { color: #cce8d4 !important; font-size: 13px !important; }
#preferences .mw-htmlform-tip, #preferences .mw-htmlform-ooui .oo-ui-fieldLayout-help { color: rgba(125, 255, 156, 0.35) !important; font-size: 11px !important; }
#preferences input[type="text"], #preferences input[type="number"], #preferences input[type="email"], #preferences input[type="search"], #preferences textarea, #preferences .oo-ui-textInputWidget input { background: rgba(6, 15, 11, 0.9) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 2px !important; color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 13px !important; }
#preferences input:focus, #preferences .oo-ui-textInputWidget input:focus { border-color: #7dff9c !important; outline: none !important; box-shadow: 0 0 0 2px rgba(125, 255, 156, 0.12) !important; }
#preferences .mw-htmlform-submit-buttons { background: rgba(6, 15, 11, 0.96) !important; border-top: 1px solid rgba(125, 255, 156, 0.15) !important; box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.4) !important; }
#preferences .mw-htmlform-submit-buttons .oo-ui-buttonElement-button, #prefsubmit { background: rgba(125, 255, 156, 0.12) !important; border: 1px solid rgba(125, 255, 156, 0.4) !important; color: #7dff9c !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; text-transform: uppercase !important; letter-spacing: 0.12em !important; border-radius: 2px !important; }
#preferences .mw-htmlform-submit-buttons .oo-ui-buttonElement-button:hover, #prefsubmit:hover { background: rgba(125, 255, 156, 0.22) !important; border-color: #7dff9c !important; }
#preferences .mw-prefs-search input { background: rgba(6, 15, 11, 0.9) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important; }
.oo-ui-dropdownWidget-handle { background: rgba(6, 15, 11, 0.9) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 2px !important; color: #cce8d4 !important; }
.oo-ui-dropdownWidget-handle:hover { background: rgba(6, 15, 11, 0.95) !important; border-color: rgba(125, 255, 156, 0.4) !important; }
.oo-ui-dropdownWidget-handle .oo-ui-labelElement-label { color: #cce8d4 !important; }
.oo-ui-dropdownWidget .oo-ui-indicatorElement-indicator { filter: brightness(0) saturate(100%) invert(91%) sepia(15%) saturate(594%) hue-rotate(76deg) brightness(101%) !important; opacity: 0.5 !important; }
.oo-ui-dropdownInputWidget select, #preferences select { background: rgba(6, 15, 11, 0.95) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; color: #cce8d4 !important; border-radius: 2px !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 12px !important; padding: 8px 12px !important; }
.oo-ui-menuSelectWidget { background: rgba(8, 18, 12, 0.98) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 2px !important; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.7) !important; }
.oo-ui-menuSelectWidget .oo-ui-optionWidget { color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 12px !important; padding: 8px 14px !important; }
.oo-ui-menuSelectWidget .oo-ui-optionWidget:hover, .oo-ui-menuSelectWidget .oo-ui-optionWidget-highlighted { background: rgba(125, 255, 156, 0.08) !important; color: #7dff9c !important; }
.oo-ui-menuSelectWidget .oo-ui-optionWidget-selected { background: rgba(125, 255, 156, 0.12) !important; color: #7dff9c !important; }
.mw-htmlform-matrix, .mw-widget-checkMatrixWidget-matrix { border-collapse: collapse !important; width: 100% !important; background: transparent !important; }
.mw-htmlform-matrix th, .mw-widget-checkMatrixWidget-matrix th { color: rgba(125, 255, 156, 0.5) !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 10px !important; text-transform: uppercase !important; letter-spacing: 0.1em !important; padding: 8px 14px !important; border-bottom: 1px solid rgba(125, 255, 156, 0.12) !important; background: transparent !important; font-weight: 500 !important; }
.mw-htmlform-matrix td, .mw-widget-checkMatrixWidget-matrix td { padding: 6px 14px !important; border: 0 !important; background: transparent !important; color: #cce8d4 !important; font-size: 13px !important; }
.mw-htmlform-matrix tr:nth-child(even) td, .mw-widget-checkMatrixWidget-matrix tr:nth-child(even) td { background: rgba(125, 255, 156, 0.03) !important; }
.mw-htmlform-matrix tr.disabled td, .mw-widget-checkMatrixWidget-matrix tr.disabled td { color: rgba(125, 255, 156, 0.25) !important; }
.mw-htmlform-matrix tr, .mw-widget-checkMatrixWidget-matrix tr { background: transparent !important; }
.mw-htmlform-matrix .oo-ui-iconElement-icon, .mw-widget-checkMatrixWidget-matrix .oo-ui-iconElement-icon { filter: brightness(0) saturate(100%) invert(91%) sepia(15%) saturate(594%) hue-rotate(76deg) brightness(101%) !important; opacity: 0.4 !important; }
.oo-ui-checkboxInputWidget [type='checkbox'] + span { background-color: rgba(6, 15, 11, 0.9) !important; background-image: none !important; border: 2px solid rgba(125, 255, 156, 0.3) !important; border-radius: 2px !important; width: 18px !important; height: 18px !important; }
.oo-ui-checkboxInputWidget [type='checkbox'] + span.vt-checked { background-color: #4ab06a !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' viewBox='0 0 12 10'%3E%3Cpolyline points='1,5 4.5,8.5 11,1' stroke='%23ffffff' stroke-width='2.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: center !important; background-size: 12px 10px !important; border-color: #7dff9c !important; }
.oo-ui-checkboxInputWidget.oo-ui-widget-disabled [type='checkbox'] + span { opacity: 0.4 !important; }
.oo-ui-popupWidget-popup { background: rgba(8, 18, 12, 0.98) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 3px !important; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.7) !important; color: #cce8d4 !important; padding: 12px 14px !important; font-size: 13px !important; line-height: 1.5 !important; }
.mw-widget-DateInputWidget input, .mw-widget-DateTimeInputWidget input { background: rgba(6, 15, 11, 0.9) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important; border-radius: 2px !important; padding: 8px 12px !important; }
.oo-ui-calendarWidget { background: rgba(8, 18, 12, 0.98) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 3px !important; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.7) !important; }
.oo-ui-calendarWidget-header { background: rgba(6, 15, 11, 0.95) !important; border-bottom: 1px solid rgba(125, 255, 156, 0.12) !important; padding: 8px !important; }
.oo-ui-calendarWidget-header .oo-ui-buttonElement-button { color: rgba(125, 255, 156, 0.5) !important; background: transparent !important; }
.oo-ui-calendarWidget-header .oo-ui-buttonElement-button:hover { color: #7dff9c !important; background: rgba(125, 255, 156, 0.08) !important; }
.oo-ui-calendarWidget-title { color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; text-transform: uppercase !important; letter-spacing: 0.1em !important; }
.oo-ui-calendarWidget .oo-ui-calendarWidget-day-of-week { color: rgba(125, 255, 156, 0.35) !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 10px !important; }
.oo-ui-calendarWidget .oo-ui-calendarWidget-day { color: #cce8d4 !important; background: transparent !important; border-radius: 2px !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 12px !important; }
.oo-ui-calendarWidget .oo-ui-calendarWidget-day:hover { background: rgba(125, 255, 156, 0.1) !important; color: #7dff9c !important; }
.oo-ui-calendarWidget .oo-ui-calendarWidget-day-today { border: 1px solid rgba(125, 255, 156, 0.35) !important; color: #7dff9c !important; }
.oo-ui-calendarWidget .oo-ui-calendarWidget-day-selected { background: rgba(125, 255, 156, 0.18) !important; color: #7dff9c !important; font-weight: 600 !important; }
.oo-ui-calendarWidget .oo-ui-calendarWidget-day-prev-month, .oo-ui-calendarWidget .oo-ui-calendarWidget-day-next-month { color: rgba(125, 255, 156, 0.2) !important; }

/* ============================================================
   32. ÉDITEUR WIKICODE — CodeMirror coloration syntaxique
   ============================================================ */
.ve-ui-mwWikitextSurface .CodeMirror,
.ve-ui-mwWikitextSurface .CodeMirror-scroll {
  background: #060f0b !important;
  color: #cce8d4 !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}
.ve-ui-mwWikitextSurface .CodeMirror-cursor { border-left-color: #7dff9c !important; }
.ve-ui-mwWikitextSurface .CodeMirror-selected,
.ve-ui-mwWikitextSurface .CodeMirror-focused .CodeMirror-selected { background: rgba(125, 255, 156, 0.15) !important; }
.ve-ui-mwWikitextSurface .CodeMirror-gutters { background: rgba(6, 15, 11, 0.95) !important; border-right: 1px solid rgba(125, 255, 156, 0.1) !important; }
.ve-ui-mwWikitextSurface .CodeMirror-linenumber { color: rgba(125, 255, 156, 0.22) !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; }
.ve-ui-mwWikitextSurface .CodeMirror-activeline-background { background: rgba(125, 255, 156, 0.04) !important; }
.ve-ui-mwWikitextSurface .cm-mw-template-name,
.ve-ui-mwWikitextSurface .cm-mw-template-bracket { color: #f5c84a !important; }
.ve-ui-mwWikitextSurface .cm-mw-template-argument-name { color: #a8d8ea !important; }
.ve-ui-mwWikitextSurface .cm-mw-template-delimiter { color: rgba(245, 200, 74, 0.5) !important; }
.ve-ui-mwWikitextSurface .cm-mw-link-ground,
.ve-ui-mwWikitextSurface .cm-mw-link,
.ve-ui-mwWikitextSurface .cm-mw-link-pagename { color: #4ab06a !important; }
.ve-ui-mwWikitextSurface .cm-mw-link-bracket { color: rgba(74, 176, 106, 0.5) !important; }
.ve-ui-mwWikitextSurface .cm-mw-heading,
.ve-ui-mwWikitextSurface .cm-mw-section-header { color: #7dff9c !important; font-weight: bold !important; }
.ve-ui-mwWikitextSurface .cm-mw-htmlentity,
.ve-ui-mwWikitextSurface .cm-mw-tag-name { color: #ff9a9a !important; }
.ve-ui-mwWikitextSurface .cm-mw-tag-bracket { color: rgba(255, 154, 154, 0.5) !important; }
.ve-ui-mwWikitextSurface .cm-mw-attribute-name { color: #a8d8ea !important; }
.ve-ui-mwWikitextSurface .cm-mw-attribute-value { color: #f5c84a !important; }
.ve-ui-mwWikitextSurface .cm-mw-comment { color: rgba(125, 255, 156, 0.3) !important; font-style: italic !important; }
.ve-ui-mwWikitextSurface .cm-mw-apostrophes-bold { color: rgba(125, 255, 156, 0.5) !important; font-weight: bold !important; }
.ve-ui-mwWikitextSurface .cm-mw-apostrophes-italic { color: rgba(125, 255, 156, 0.5) !important; font-style: italic !important; }
.ve-ui-mwWikitextSurface .cm-mw-table-bracket,
.ve-ui-mwWikitextSurface .cm-mw-table-definition { color: rgba(168, 216, 234, 0.7) !important; }
.ve-ui-mwWikitextSurface .cm-mw-template-variable-bracket,
.ve-ui-mwWikitextSurface .cm-mw-template-variable-name { color: #ff9a9a !important; }
.ve-ui-mwWikitextSurface .cm-mw-parserfunction-name,
.ve-ui-mwWikitextSurface .cm-mw-parserfunction-bracket { color: rgba(245, 200, 74, 0.8) !important; }
.ve-ui-mwWikitextSurface .cm-mw-redirect { color: #7dff9c !important; font-weight: bold !important; }

/* ============================================================
   33. BOUTON LANGUES INTERWIKI
   ============================================================ */
#vt-title-lang-row { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 16px !important; }
#vt-title-lang-row #firstHeading { flex: 1 !important; min-width: 0 !important; }
#p-lang-btn { position: relative; flex-shrink: 0; margin-right: 36px !important; }
.vt-lang-btn-trigger {
  display: inline-flex !important; align-items: center !important; gap: 6px !important;
  background: rgba(125, 255, 156, 0.07) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important;
  border-radius: 2px !important; color: rgba(125, 255, 156, 0.6) !important;
  font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important;
  text-transform: uppercase !important; letter-spacing: 0.1em !important;
  padding: 6px 12px !important; cursor: pointer !important; white-space: nowrap !important;
  transition: all 0.15s !important;
}
.vt-lang-btn-trigger:hover,
.vt-lang-btn-trigger[aria-expanded="true"] {
  background: rgba(125, 255, 156, 0.14) !important;
  border-color: rgba(125, 255, 156, 0.4) !important;
  color: #7dff9c !important;
}
.vt-lang-list {
  position: absolute; top: calc(100% + 4px); right: 0; z-index: 200;
  background: rgba(8, 18, 12, 0.98) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important;
  border-radius: 3px !important; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.7) !important;
  min-width: 180px; padding: 4px 0;
}
.vt-lang-list[hidden] { display: none !important; }
.vt-lang-list ul { list-style: none !important; margin: 0 !important; padding: 0 !important; }
.vt-lang-list .interlanguage-link a {
  display: flex !important; align-items: center !important; gap: 8px !important;
  padding: 8px 16px !important; color: #cce8d4 !important; text-decoration: none !important;
  font-size: 13px !important; font-family: 'Crimson Pro', Georgia, serif !important;
  border-left: 2px solid transparent !important; transition: all 0.1s !important;
}
.vt-lang-list .interlanguage-link a:hover {
  background: rgba(125, 255, 156, 0.08) !important; color: #7dff9c !important;
  border-left-color: #4ab06a !important;
}

/* ============================================================
   34. GALERIES & VIGNETTES (THUMBS)
   ============================================================ */
ul.gallery,
.mw-parser-output .gallery { background: transparent !important; border: 0 !important; margin: 16px 0 !important; padding: 0 !important; }
li.gallerybox,
.mw-parser-output .gallerybox { background: transparent !important; }
li.gallerybox div.thumb,
.gallerybox .thumb {
  background: rgba(15, 28, 21, 0.65) !important;
  border: 1px solid rgba(125, 255, 156, 0.18) !important;
  border-radius: 2px !important; margin: 2px !important;
  transition: all 0.15s ease;
}
li.gallerybox div.thumb:hover,
.gallerybox .thumb:hover {
  border-color: rgba(125, 255, 156, 0.45) !important;
  box-shadow: 0 0 12px rgba(125, 255, 156, 0.12);
}
.gallerytext,
.gallerybox .gallerytext {
  color: #cce8d4 !important; background: transparent !important;
  font-family: 'Crimson Pro', Georgia, serif !important; padding: 6px 8px !important;
}
.gallerytext p,
.gallerybox .gallerytext p { color: #cce8d4 !important; margin: 0 !important; }
.gallerytext a,
.gallerybox .gallerytext a { color: #7dff9c !important; }
.gallerytext a:hover,
.gallerybox .gallerytext a:hover { color: #b6ffc6 !important; }
.thumbinner,
.mw-parser-output .thumbinner,
.mw-parser-output figure[typeof~="mw:File/Thumb"],
.mw-parser-output figure[typeof~="mw:File/Frame"],
.mw-parser-output figure.mw-default-size,
.mw-parser-output figure.thumb {
  background: rgba(15, 28, 21, 0.65) !important;
  border: 1px solid rgba(125, 255, 156, 0.18) !important;
  border-radius: 2px !important; color: #cce8d4 !important;
}
.mw-parser-output figure[typeof~="mw:File/Thumb"] img.mw-file-element,
.mw-parser-output figure[typeof~="mw:File/Frame"] img.mw-file-element,
.mw-parser-output figure.mw-default-size img.mw-file-element {
  background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important;
}
.mw-parser-output figure a.mw-file-description,
.mw-parser-output figure a {
  border: 0 !important; outline: 0 !important; background: transparent !important; display: block;
}
.thumbcaption,
.mw-parser-output .thumbcaption,
figcaption,
.mw-parser-output figcaption {
  color: #cce8d4 !important; background: transparent !important; border: 0 !important;
  border-top: 0 !important; outline: 0 !important;
  font-family: 'Crimson Pro', Georgia, serif !important;
  font-style: italic; font-size: 13px !important; padding: 6px 8px !important;
}
.magnify a {
  filter: invert(1) hue-rotate(90deg) saturate(0.6) brightness(1.2) !important;
  opacity: 0.6 !important;
}
.magnify a:hover { opacity: 1 !important; }

/* ============================================================
   35. SCROLLBAR MOBILE — masquage agressif
   ============================================================ */
@media screen and (max-width: 900px) {
  .vt-page-tabs,
  .vt-user-tools,
  .vt-page-tabs *,
  .vt-user-tools * { scrollbar-width: none !important; -ms-overflow-style: none !important; }
  .vt-page-tabs::-webkit-scrollbar,
  .vt-user-tools::-webkit-scrollbar {
    display: none !important; width: 0 !important; height: 0 !important; background: transparent !important;
  }
  .vt-page-tabs::-webkit-scrollbar-track,
  .vt-user-tools::-webkit-scrollbar-track,
  .vt-page-tabs::-webkit-scrollbar-thumb,
  .vt-user-tools::-webkit-scrollbar-thumb { display: none !important; background: transparent !important; }
}

/* ============================================================
   36. CITATIONS (blockquote)
   ============================================================ */
blockquote,
.mw-parser-output blockquote,
.mw-parser-output .noexcerpt:not(.avt-warn-banner):not(.avt-note-banner):not(.avt-section-banner) {
  background: transparent !important; border: 0 !important; box-shadow: none !important;
  padding: 8px 16px !important; margin: 16px auto !important;
  font-style: italic; color: #cce8d4;
  font-family: 'Crimson Pro', Georgia, serif;
  font-size: 16px; line-height: 1.6;
}
blockquote p,
.mw-parser-output blockquote p {
  margin: 0 0 8px !important; background: transparent !important; border: 0 !important;
}
blockquote p:last-child { margin-bottom: 0 !important; }
blockquote audio,
.mw-parser-output blockquote audio,
blockquote .mw-mmv-image,
blockquote figure,
blockquote .floatnone,
blockquote .center {
  border: 0 !important; background: transparent !important; box-shadow: none !important;
  margin: 8px auto !important;
}

/* ============================================================
   37. PAGE RECHERCHE — Special:Recherche
   → MIGRÉE dans le skin : skinStyles/mediawiki.special.search.less
   ============================================================ */
/* ============================================================
   38. NOTIFICATIONS / TOAST POST-PUBLICATION
   ============================================================ */
.mw-notification,
.mw-notification-area .mw-notification,
.postedit,
.postedit-container {
  background: rgba(8, 18, 12, 0.97) !important;
  border: 1px solid rgba(125, 255, 156, 0.35) !important;
  border-radius: 3px !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(125, 255, 156, 0.1) !important;
  color: #cce8d4 !important;
  padding: 12px 16px !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}
.mw-notification-success,
.mw-notification.mw-notification-type-success,
.mw-notification[data-mw-notification-type="success"] {
  border-left: 3px solid #7dff9c !important;
  border-color: rgba(125, 255, 156, 0.4) !important;
}
.mw-notification-warn,
.mw-notification.mw-notification-type-warn {
  border-left: 3px solid #f5c84a !important;
  border-color: rgba(245, 200, 74, 0.4) !important;
}
.mw-notification-error,
.mw-notification.mw-notification-type-error {
  border-left: 3px solid #ff7a7a !important;
  border-color: rgba(255, 122, 122, 0.4) !important;
}
.mw-notification p,
.mw-notification div,
.mw-notification span,
.postedit-content {
  color: #cce8d4 !important;
  background: transparent !important;
  font-family: 'Crimson Pro', Georgia, serif !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}
.mw-notification strong,
.mw-notification b {
  color: #7dff9c !important;
  font-weight: 600 !important;
}
.mw-notification a,
.postedit a {
  color: #7dff9c !important;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(125, 255, 156, 0.3) !important;
}
.mw-notification a:hover,
.postedit a:hover {
  color: #b6ffc6 !important;
  border-bottom-color: #7dff9c !important;
}
.mw-notification .oo-ui-iconElement-icon,
.postedit .oo-ui-iconElement-icon {
  filter: brightness(0) saturate(100%) invert(91%) sepia(15%) saturate(594%) hue-rotate(76deg) brightness(101%) !important;
  opacity: 0.9 !important;
}
.mw-notification-close,
.postedit-icon-close {
  filter: brightness(0) saturate(100%) invert(72%) sepia(20%) saturate(400%) hue-rotate(76deg) !important;
  opacity: 0.5 !important;
  transition: opacity 0.15s !important;
}
.mw-notification-close:hover,
.postedit-icon-close:hover { opacity: 1 !important; }
.mw-notification-area { background: transparent !important; }

/* ============================================================
   39. WIKITABLE — adaptation à l'infobox (desktop)
   ============================================================ */
@media screen and (min-width: 721px) {
  .mw-parser-output:has(.avt-infobox) .wikitable,
  .mw-parser-output:has(.avt-infobox) .va-table {
    max-width: calc(100% - 344px) !important; /* 320px infobox + ~1.5em marge */
    width: auto !important;
  }
}

/* ============================================================
   40. CORRECTIONS AVANCÉES — liens, tableaux collapsibles
   ============================================================ */

/* Liens rouges (.new) dans les tableaux — ne pas écraser avec le vert */
.mw-parser-output table td a.new,
.mw-parser-output table th a.new,
.mw-parser-output .wikitable td a.new,
.mw-parser-output .wikitable th a.new,
.mw-parser-output .va-table td a.new {
  color: #ff5e5e !important;
}
.mw-parser-output table td a.new:hover,
.mw-parser-output .wikitable td a.new:hover {
  color: #ff8888 !important;
}

/* Liens externes — ambre pour les distinguer des liens internes */
.mw-parser-output a.external,
.mw-parser-output a[rel~="nofollow"] {
  color: #f5c84a !important;
}
.mw-parser-output a.external:visited,
.mw-parser-output a[rel~="nofollow"]:visited {
  color: #c9973a !important;
}
.mw-parser-output a.external:hover,
.mw-parser-output a[rel~="nofollow"]:hover {
  color: #ffe080 !important;
}

/* Tableaux collapsibles — ne pas bloquer le JS avec !important sur display */
/* Le JS MediaWiki masque les lignes via style="display:none" inline.
   Toute règle CSS avec !important sur display écrase ce comportement.
   On stylise uniquement l'apparence sans toucher display. */
.mw-collapsible-toggle,
.mw-collapsible-toggle a {
  color: rgba(125, 255, 156, 0.55) !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  cursor: pointer !important;
  text-decoration: none !important;
  background: transparent !important;
  border: 0 !important;
}
.mw-collapsible-toggle a:hover,
.mw-collapsible-toggle:hover {
  color: #7dff9c !important;
  background: transparent !important;
}

/* Ligne d'en-tête collapsible */
.mw-parser-output .wikitable.mw-collapsible > tbody > tr:first-child > th,
.mw-parser-output table.mw-collapsible > tbody > tr:first-child > th {
  background: rgba(10, 22, 16, 0.95) !important;
  border-bottom: 1px solid rgba(125, 255, 156, 0.2) !important;
}

/* Cellules avec style inline "background: white" ou couleur claire — reset */
.mw-parser-output .wikitable td[style*="background:#fff"],
.mw-parser-output .wikitable td[style*="background: #fff"],
.mw-parser-output .wikitable td[style*="background:white"],
.mw-parser-output .wikitable td[style*="background: white"],
.mw-parser-output .wikitable td[style*="background:#FFF"],
.mw-parser-output .wikitable td[style*="background: #FFF"] {
  background-color: rgba(12, 24, 18, 0.85) !important;
  color: #cce8d4 !important;
}

/* Titre de page — ne pas hériter de l'italique des h2 */
#firstHeading,
.firstHeading {
  font-style: normal !important;
}

/* ============================================================
   41. PAGE PREVIEWS — aperçus au survol des liens (Hovercards)
   ============================================================ */

/* Conteneur racine — fond sombre + ombrage phosphore */
.mwe-popups,
.mwe-popups.mwe-popups-fade-in-up,
.mwe-popups.mwe-popups-fade-in-down,
.mwe-popups.mwe-popups-no-image-tri,
.mwe-popups.mwe-popups-image-tri,
.mwe-popups.mwe-popups-image-pointer,
.mwe-popups.mwe-popups-is-not-tall,
.mwe-popups.mwe-popups-is-tall {
  background: rgba(8, 18, 12, 0.98) !important;
  border: 1px solid rgba(125, 255, 156, 0.25) !important;
  border-radius: 3px !important;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.75),
              0 0 12px rgba(125, 255, 156, 0.08) !important;
  color: #cce8d4 !important;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}

/* Force transparence sur tous les conteneurs internes —
   neutralise les fonds blancs résiduels (div, a, container) */
.mwe-popups > div,
.mwe-popups > a,
.mwe-popups > a > div,
.mwe-popups .mwe-popups-container,
.mwe-popups .mwe-popups-extract,
.mwe-popups .mwe-popups-extract p,
.mwe-popups .mwe-popups-discreet,
.mwe-popups .mwe-popups-scroll,
.mwe-popups .mwe-popups-body {
  background-color: transparent !important;
}

/* Lien englobant (<a>) cliquable — fond blanc natif neutralisé */
.mwe-popups a,
.mwe-popups a:link,
.mwe-popups a:visited,
.mwe-popups a:hover {
  background: transparent !important;
  color: #cce8d4 !important;
  text-decoration: none !important;
}

/* Pointe (triangle) — masquer la version blanche par défaut */
.mwe-popups.flipped-x::before,
.mwe-popups.flipped-y::before,
.mwe-popups.flipped-x-y::before,
.mwe-popups::before,
.mwe-popups.flipped-x::after,
.mwe-popups.flipped-y::after,
.mwe-popups.flipped-x-y::after,
.mwe-popups::after {
  border-color: transparent !important;
  display: none !important;
}

/* Titre de l'article dans le popup */
.mwe-popups .mwe-popups-title,
.mwe-popups h3,
.mwe-popups .mwe-popups-extract h3 {
  color: #7dff9c !important;
  font-family: 'Instrument Serif', Georgia, serif !important;
  font-style: italic !important;
  font-size: 1.1rem !important;
  font-weight: normal !important;
  border: 0 !important;
  margin: 0 0 6px 0 !important;
  padding: 0 !important;
}

/* Indicateur de type d'article (icône à côté du titre) */
.mwe-popups .mwe-popups-title .mw-ui-icon {
  filter: brightness(0) saturate(100%) invert(91%) sepia(15%)
          saturate(594%) hue-rotate(76deg) brightness(101%) !important;
  opacity: 0.65 !important;
}

/* Extrait / résumé textuel */
.mwe-popups .mwe-popups-extract {
  color: #cce8d4 !important;
  font-family: 'Crimson Pro', Georgia, serif !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  padding: 14px 16px !important;
}

/* Variante "discreet" : titre seul, sans extrait */
.mwe-popups .mwe-popups-discreet {
  padding: 10px 14px !important;
}

/* Conteneur de la miniature (image d'aperçu) */
.mwe-popups .mwe-popups-thumbnail,
.mwe-popups .mwe-popups-thumbnail-link,
.mwe-popups svg.mwe-popups-thumbnail {
  background: rgba(6, 15, 11, 0.6) !important;
  border-bottom: 1px solid rgba(125, 255, 156, 0.12) !important;
}

/* Filtre teinte phosphore sur la miniature pour rester dans le ton */
/* NOTE : neutralisé plus bas (section 53-(4)) — conservé pour historique. */
.mwe-popups .mwe-popups-thumbnail image,
.mwe-popups svg.mwe-popups-thumbnail image {
  filter: brightness(0.92) saturate(0.9) hue-rotate(-8deg) !important;
}

/* Aperçus "désambiguïsation" / page d'homonymie */
.mwe-popups.mwe-popups-type-disambiguation {
  border-color: rgba(245, 200, 74, 0.35) !important;
}
.mwe-popups.mwe-popups-type-disambiguation .mwe-popups-title {
  color: #f5c84a !important;
}

/* Aperçus "lien rouge" (page inexistante) */
.mwe-popups.mwe-popups-type-generic {
  border-color: rgba(255, 122, 122, 0.35) !important;
}
.mwe-popups.mwe-popups-type-generic .mwe-popups-title {
  color: #ff7a7a !important;
}

/* Barre du bas : paramètres + lien "lire la suite" */
.mwe-popups .mwe-popups-settings,
.mwe-popups footer,
.mwe-popups .mwe-popups-read-link {
  background: rgba(6, 15, 11, 0.6) !important;
  border-top: 1px solid rgba(125, 255, 156, 0.12) !important;
  padding: 8px 14px !important;
}

/* Lien "lire la suite" */
.mwe-popups .mwe-popups-read-link {
  color: #4ab06a !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  text-decoration: none !important;
}
.mwe-popups .mwe-popups-read-link:hover {
  color: #7dff9c !important;
}

/* Icône engrenage des paramètres */
.mwe-popups .mwe-popups-settings-icon,
.mwe-popups .mw-ui-icon-popups-settings {
  filter: brightness(0) saturate(100%) invert(72%) sepia(20%)
          saturate(400%) hue-rotate(76deg) brightness(100%) !important;
  opacity: 0.45 !important;
  transition: opacity 0.15s !important;
}
.mwe-popups .mwe-popups-settings-icon:hover,
.mwe-popups .mw-ui-icon-popups-settings:hover {
  opacity: 1 !important;
}

/* Dialogue des paramètres Page Previews (Spécial:Préférences modal) */
.mwe-popups-settings .oo-ui-window-frame,
.mw-popups-settings .oo-ui-window-frame {
  background: rgba(10, 20, 15, 0.98) !important;
  border: 1px solid rgba(125, 255, 156, 0.2) !important;
}

/* ============================================================
   42. DIFF VIEW — comparaison de versions
   → MIGRÉE dans le skin : skinStyles/mediawiki.diff.less
   ============================================================ */
/* ============================================================
   43. DISCUSSIONTOOLS — pages de discussion modernes
   ============================================================ */

/* Boutons "Répondre", "Souscrire", "Ajouter un sujet" */
.ext-discussiontools-init-replylink-buttons .oo-ui-buttonElement-button,
.ext-discussiontools-init-section-subscribeButton .oo-ui-buttonElement-button,
.ext-discussiontools-init-new-topic .oo-ui-buttonElement-button {
  background: transparent !important;
  border: 1px solid rgba(125, 255, 156, 0.2) !important;
  color: rgba(125, 255, 156, 0.7) !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  border-radius: 2px !important;
  padding: 4px 10px !important;
  transition: all 0.15s !important;
}
.ext-discussiontools-init-replylink-buttons .oo-ui-buttonElement-button:hover,
.ext-discussiontools-init-section-subscribeButton .oo-ui-buttonElement-button:hover,
.ext-discussiontools-init-new-topic .oo-ui-buttonElement-button:hover {
  background: rgba(125, 255, 156, 0.08) !important;
  border-color: rgba(125, 255, 156, 0.5) !important;
  color: #7dff9c !important;
}

/* Icônes des boutons */
.ext-discussiontools-init-replylink-buttons .oo-ui-iconElement-icon,
.ext-discussiontools-init-section-subscribeButton .oo-ui-iconElement-icon {
  filter: brightness(0) saturate(100%) invert(91%) sepia(15%) saturate(594%) hue-rotate(76deg) brightness(101%) !important;
  opacity: 0.65 !important;
}

/* Liens "Répondre" / "Modifier" textuels (legacy) */
.ext-discussiontools-init-replylink-reply,
.ext-discussiontools-init-replylink-open {
  color: #4ab06a !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  text-decoration: none !important;
}
.ext-discussiontools-init-replylink-reply:hover,
.ext-discussiontools-init-replylink-open:hover {
  color: #7dff9c !important;
}

/* Conteneur d'une section commentée */
.ext-discussiontools-init-section,
.ext-discussiontools-init-highlight,
.ext-discussiontools-init-targetcomment {
  background: rgba(125, 255, 156, 0.04) !important;
  border-left: 2px solid rgba(125, 255, 156, 0.25) !important;
  padding-left: 12px !important;
  margin: 8px 0 !important;
  border-radius: 2px !important;
}

/* Surlignage du commentaire ciblé (lien #cXXX) */
.ext-discussiontools-init-targetcomment {
  background: rgba(245, 200, 74, 0.08) !important;
  border-left-color: rgba(245, 200, 74, 0.4) !important;
}

/* Boîte d'auteur de commentaire */
.ext-discussiontools-init-timestamplink {
  color: rgba(125, 255, 156, 0.5) !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 11px !important;
}
.ext-discussiontools-init-timestamplink:hover { color: #7dff9c !important; }

/* Surface d'édition inline */
.ext-discussiontools-ui-replyWidget,
.ext-discussiontools-ui-newTopic {
  background: rgba(6, 15, 11, 0.85) !important;
  border: 1px solid rgba(125, 255, 156, 0.2) !important;
  border-radius: 3px !important;
  padding: 12px !important;
  margin: 8px 0 !important;
}

/* Boutons "Publier" / "Annuler" du widget réponse */
.ext-discussiontools-ui-replyWidget-actions .oo-ui-flaggedElement-progressive .oo-ui-buttonElement-button,
.ext-discussiontools-ui-replyWidget-actions .oo-ui-flaggedElement-primary .oo-ui-buttonElement-button {
  background: rgba(125, 255, 156, 0.15) !important;
  border: 1px solid rgba(125, 255, 156, 0.4) !important;
  color: #7dff9c !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
}
.ext-discussiontools-ui-replyWidget-actions .oo-ui-flaggedElement-progressive .oo-ui-buttonElement-button:hover,
.ext-discussiontools-ui-replyWidget-actions .oo-ui-flaggedElement-primary .oo-ui-buttonElement-button:hover {
  background: rgba(125, 255, 156, 0.28) !important;
  border-color: #7dff9c !important;
  box-shadow: 0 0 10px rgba(125, 255, 156, 0.2) !important;
}

/* Mode "ping" — mention d'un utilisateur */
.ext-discussiontools-init-pingmark {
  color: #7dff9c !important;
  background: rgba(125, 255, 156, 0.1) !important;
  border-radius: 2px !important;
  padding: 0 4px !important;
}

/* ============================================================
   44. ECHO — badges & menus de notifications (header)
   → MIGRÉE dans le skin : skinStyles/ext.echo.less
   ============================================================ */
/* ============================================================
   45. CITE — références [1][2] et notes de bas de page
   → MIGRÉE dans le skin : skinStyles/ext.cite.less
   ============================================================ */
/* ============================================================
   46. CODE INLINE & PRE — styles génériques
   ============================================================ */
/* La partie .mw-highlight (Pygments) est migrée dans le skin :
   skinStyles/ext.pygments.less. Ne restent ici que les styles
   code/tt/pre génériques, indépendants de SyntaxHighlight. */

/* Code inline `<code>` standard */
.mw-parser-output code,
.mw-parser-output tt {
  background: rgba(6, 15, 11, 0.9) !important;
  border: 1px solid rgba(125, 255, 156, 0.12) !important;
  border-radius: 2px !important;
  color: #b6ffc6 !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 0.88em !important;
  padding: 1px 5px !important;
}

/* Pre standard (non-Pygments) */
.mw-parser-output pre,
.mw-parser-output .mw-code {
  background: #060f0b !important;
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
  border-radius: 3px !important;
  color: #cce8d4 !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
  padding: 12px 14px !important;
  overflow-x: auto !important;
}

/* ============================================================
   47. TABBERNEUE — onglets <tabber>
   ============================================================ */

/* Conteneur tabber */
.tabber,
.tabber__container,
.mw-parser-output .tabber {
  background: transparent !important;
  border: 0 !important;
  margin: 16px 0 !important;
}

/* Barre d'onglets */
.tabber__header,
.tabber__tabs {
  background: rgba(6, 15, 11, 0.6) !important;
  border-bottom: 1px solid rgba(125, 255, 156, 0.2) !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0 !important;
}

/* Onglet individuel */
.tabber__tab,
.tabber__header .tabber__tab,
.tabber__tabs .tabber__tab {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  color: rgba(125, 255, 156, 0.5) !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  padding: 10px 16px !important;
  margin: 0 !important;
  cursor: pointer !important;
  text-decoration: none !important;
  transition: all 0.15s !important;
}
.tabber__tab:hover {
  color: #7dff9c !important;
  background: rgba(125, 255, 156, 0.05) !important;
}

/* Onglet actif */
.tabber__tab--active,
.tabber__tab[aria-selected="true"] {
  color: #7dff9c !important;
  border-bottom-color: #7dff9c !important;
  background: rgba(125, 255, 156, 0.08) !important;
}

/* Contenu de l'onglet */
.tabber__section,
.tabber__panel {
  background: transparent !important;
  border: 0 !important;
  padding: 16px 0 !important;
  color: #cce8d4 !important;
}

/* Indicateur de défilement (flèches >) sur petits écrans */
.tabber__header__prev,
.tabber__header__next {
  background: rgba(6, 15, 11, 0.9) !important;
  color: rgba(125, 255, 156, 0.6) !important;
  border: 0 !important;
  cursor: pointer !important;
}
.tabber__header__prev:hover,
.tabber__header__next:hover { color: #7dff9c !important; }

/* Version animée pendant la transition */
.tabber--live .tabber__section {
  transition: opacity 0.2s ease;
}

/* ============================================================
   48. REVISIONSLIDER — slider de diff entre versions
   ============================================================ */

/* Conteneur principal du slider */
.mw-revslider-container,
.mw-revslider-wrapper {
  background: rgba(6, 15, 11, 0.8) !important;
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
  border-radius: 3px !important;
  color: #cce8d4 !important;
  margin: 8px 0 !important;
  padding: 12px !important;
}

/* Bouton toggle (déplier/replier) */
.mw-revslider-toggle-button {
  background: transparent !important;
  border: 1px solid rgba(125, 255, 156, 0.2) !important;
  color: rgba(125, 255, 156, 0.55) !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  padding: 4px 10px !important;
  border-radius: 2px !important;
  cursor: pointer !important;
}
.mw-revslider-toggle-button:hover {
  background: rgba(125, 255, 156, 0.08) !important;
  color: #7dff9c !important;
}

/* Axe horizontal (timeline) */
.mw-revslider-revisions-container,
.mw-revslider-revisions {
  background: rgba(6, 15, 11, 0.6) !important;
  border: 1px solid rgba(125, 255, 156, 0.1) !important;
  border-radius: 2px !important;
}

/* Barres représentant chaque révision */
.mw-revslider-revision {
  background: rgba(125, 255, 156, 0.25) !important;
  border: 0 !important;
  transition: background 0.15s !important;
}
.mw-revslider-revision:hover {
  background: rgba(125, 255, 156, 0.5) !important;
}

/* Révision sélectionnée (les deux côtés du diff) */
.mw-revslider-revision-old,
.mw-revslider-revision[data-pos="older"] {
  background: rgba(255, 94, 94, 0.6) !important;
}
.mw-revslider-revision-new,
.mw-revslider-revision[data-pos="newer"] {
  background: rgba(125, 255, 156, 0.7) !important;
}

/* Pointers (curseurs glissants gauche/droite) */
.mw-revslider-pointer-old,
.mw-revslider-pointer-new,
.mw-revslider-pointer {
  background: rgba(8, 18, 12, 0.95) !important;
  border: 1px solid rgba(125, 255, 156, 0.5) !important;
  color: #7dff9c !important;
  border-radius: 2px !important;
}
.mw-revslider-pointer-old { border-color: rgba(255, 94, 94, 0.6) !important; }
.mw-revslider-pointer-new { border-color: rgba(125, 255, 156, 0.6) !important; }

/* Tooltips au survol d'une révision */
.mw-revslider-tooltip,
.mw-revslider-tooltip .oo-ui-popupWidget-popup {
  background: rgba(8, 18, 12, 0.98) !important;
  border: 1px solid rgba(125, 255, 156, 0.25) !important;
  border-radius: 3px !important;
  color: #cce8d4 !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 11px !important;
  padding: 8px 10px !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.6) !important;
}

/* Liens dans le tooltip */
.mw-revslider-tooltip a { color: #7dff9c !important; }

/* Flèches navigation */
.mw-revslider-arrow {
  background: transparent !important;
  color: rgba(125, 255, 156, 0.5) !important;
  border: 0 !important;
  cursor: pointer !important;
}
.mw-revslider-arrow:hover { color: #7dff9c !important; }

/* Indicateurs de taille (+/- octets) */
.mw-revslider-revision-wrapper .mw-revslider-bar-bigger,
.mw-revslider-bar-bigger {
  background: rgba(125, 255, 156, 0.6) !important;
}
.mw-revslider-revision-wrapper .mw-revslider-bar-smaller,
.mw-revslider-bar-smaller {
  background: rgba(255, 94, 94, 0.6) !important;
}

/* ============================================================
   49. TABLEPAGER & LISTES SPÉCIALES — pages d'admin et stats
   ============================================================ */

/* Tableau pager générique (Spécial:Statistiques, ListUsers, AllPages…) */
table.mw-statistics-table,
table.TablePager,
table.mw-spcontent,
.mw-special-Statistics table,
.mw-special-ActiveUsers table,
.mw-special-Listusers table,
.mw-special-Listfiles table,
.mw-special-Listredirects table,
.mw-special-Wantedpages table,
.mw-special-Mostrevisions table,
.mw-special-Brokenredirects table {
  background: rgba(6, 15, 11, 0.75) !important;
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
  border-collapse: collapse !important;
  color: #cce8d4 !important;
  width: 100% !important;
  margin: 12px 0 !important;
}

/* Entêtes de colonnes */
.TablePager th,
.mw-statistics-table th,
table.mw-spcontent th,
.mw-special-Statistics th,
.mw-special-ActiveUsers th,
.mw-special-Listusers th,
.mw-special-Listfiles th {
  background: #0f2015 !important;
  border-bottom: 1px solid rgba(125, 255, 156, 0.2) !important;
  color: #7dff9c !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  padding: 10px 12px !important;
  text-align: left !important;
}

/* En-têtes triables */
.TablePager th.TablePager_sort,
.TablePager th.headerSort,
.TablePager th.headerSortUp,
.TablePager th.headerSortDown {
  cursor: pointer !important;
  background-image: none !important;
}
.TablePager th.headerSortUp,
.TablePager th.headerSortDown { color: #7dff9c !important; }
.TablePager th.headerSortUp::after { content: ' ▲'; opacity: 0.7; font-size: 9px; }
.TablePager th.headerSortDown::after { content: ' ▼'; opacity: 0.7; font-size: 9px; }

/* Lignes */
.TablePager tr,
.mw-statistics-table tr,
table.mw-spcontent tr {
  background: transparent !important;
  border-bottom: 1px solid rgba(125, 255, 156, 0.06) !important;
}

/* Lignes alternées */
.TablePager tr:nth-child(even),
.TablePager_even {
  background: rgba(125, 255, 156, 0.025) !important;
}
.TablePager tr:nth-child(odd),
.TablePager_odd {
  background: transparent !important;
}
.TablePager tr:hover {
  background: rgba(125, 255, 156, 0.06) !important;
}

/* Cellules */
.TablePager td,
.mw-statistics-table td,
table.mw-spcontent td {
  background: transparent !important;
  border: 0 !important;
  color: #cce8d4 !important;
  padding: 8px 12px !important;
  font-size: 13px !important;
}

/* Liens dans les pagers */
.TablePager a,
.mw-statistics-table a { color: #7dff9c !important; }
.TablePager a:visited { color: #4ab06a !important; }
.TablePager a:hover { color: #b6ffc6 !important; }

/* Valeur numérique de statistiques (Spécial:Statistiques) */
.mw-statistics-numbers,
.mw-statistics-table td.mw-statistics-numbers {
  font-family: 'IBM Plex Mono', monospace !important;
  color: #f5c84a !important;
  text-align: right !important;
  font-weight: 500 !important;
}

/* Pagination des TablePagers */
.TablePager_nav,
.mw-pager-navigation-bar {
  background: rgba(6, 15, 11, 0.6) !important;
  border: 1px solid rgba(125, 255, 156, 0.1) !important;
  border-radius: 2px !important;
  padding: 8px 12px !important;
  margin: 8px 0 !important;
  color: rgba(204, 232, 212, 0.7) !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 11px !important;
}
.TablePager_nav a,
.mw-pager-navigation-bar a,
.mw-numlink {
  color: #4ab06a !important;
  border: 1px solid rgba(125, 255, 156, 0.2) !important;
  background: rgba(6, 15, 11, 0.5) !important;
  padding: 3px 9px !important;
  margin: 0 2px !important;
  border-radius: 2px !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  font-size: 10px !important;
}
.TablePager_nav a:hover,
.mw-pager-navigation-bar a:hover {
  background: rgba(125, 255, 156, 0.1) !important;
  border-color: rgba(125, 255, 156, 0.4) !important;
  color: #7dff9c !important;
}

/* Filtres en haut des pagers */
.mw-pager-body,
.mw-pager-tools,
.mw-htmlform-ooui-wrapper {
  background: transparent !important;
  border: 0 !important;
}

/* Page Spécial:Contributions — fond des lignes */
.mw-contributions-list li,
.mw-special-Contributions ul li {
  border-bottom: 1px solid rgba(125, 255, 156, 0.05) !important;
  padding: 4px 0 !important;
  background: transparent !important;
  color: #cce8d4 !important;
}
.mw-contributions-list li:hover {
  background: rgba(125, 255, 156, 0.04) !important;
}

/* Liens utilisateur / page dans les listes */
.mw-userlink,
.mw-changeslist-line .mw-userlink {
  color: #7dff9c !important;
  font-weight: 500 !important;
}
.mw-userlink:hover { color: #b6ffc6 !important; }

/* Boutons "annuler" / "défaire" / "rollback" dans les listes */
.mw-rollback-link a,
.mw-history-undo a,
.mw-changeslist-links a {
  color: #f5c84a !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
}
.mw-rollback-link a:hover,
.mw-history-undo a:hover { color: #ffe080 !important; }

/* Journaux (Spécial:Journal) */
.mw-logevent-loglines,
.mw-special-Log .mw-logline,
ul.mw-logevent-loglines li {
  background: transparent !important;
  border-bottom: 1px solid rgba(125, 255, 156, 0.05) !important;
  padding: 6px 0 !important;
  color: #cce8d4 !important;
  font-size: 13px !important;
}
.mw-logevent-loglines li:hover { background: rgba(125, 255, 156, 0.04) !important; }
.mw-logline-action {
  color: rgba(125, 255, 156, 0.5) !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 11px !important;
}
.mw-logevent-actionlink {
  color: #4ab06a !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important;
  text-transform: uppercase !important;
}

/* Marqueurs (m, b, n) dans RC/historique */
.mw-changeslist-flags abbr,
abbr.minoredit,
abbr.botedit,
abbr.newpage,
abbr.unpatrolled {
  background: rgba(125, 255, 156, 0.08) !important;
  border: 1px solid rgba(125, 255, 156, 0.2) !important;
  color: #7dff9c !important;
  border-radius: 2px !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 9px !important;
  font-weight: 600 !important;
  padding: 0 4px !important;
  margin: 0 1px !important;
  text-decoration: none !important;
}

/* Différence d'octets (+12 / -45) */
.mw-plusminus-pos {
  color: #7dff9c !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-weight: 500 !important;
}
.mw-plusminus-neg {
  color: #ff7a7a !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-weight: 500 !important;
}
.mw-plusminus-null {
  color: rgba(125, 255, 156, 0.4) !important;
  font-family: 'IBM Plex Mono', monospace !important;
}
.mw-plusminus-bold {
  font-weight: 700 !important;
}

/* ============================================================
   50. PAGES FICHIER (Namespace File:) — Spécial:ImagePage
   ============================================================ */

/* TOC haut de page "Fichier / Historique / Utilisation" */
#filetoc,
ul#filetoc {
  background: rgba(6, 15, 11, 0.85) !important;
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
  border-radius: 3px !important;
  color: #cce8d4 !important;
  padding: 8px 14px !important;
  margin: 12px 0 !important;
  list-style: none !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0 !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  text-align: center !important;
  justify-content: center !important;
}
#filetoc li {
  display: inline !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}
#filetoc li::before {
  content: '·' !important;
  margin: 0 10px !important;
  color: rgba(125, 255, 156, 0.3) !important;
}
#filetoc li:first-child::before { display: none !important; }
#filetoc a {
  color: rgba(125, 255, 156, 0.65) !important;
  text-decoration: none !important;
  letter-spacing: 0.12em !important;
}
#filetoc a:hover { color: #7dff9c !important; }

/* Conteneur principal de l'image */
.fullImageLink,
#file,
.mw-filepage-image {
  background: transparent !important;
  text-align: center !important;
  margin: 16px 0 !important;
}
.fullImageLink a,
.fullImageLink img,
#file a,
#file img {
  background: transparent !important;
  border: 0 !important;
  display: inline-block !important;
}

/* Image elle-même : juste un cadre discret */
.fullImageLink img,
#file > a > img {
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
  border-radius: 2px !important;
  background: rgba(6, 15, 11, 0.4) !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5) !important;
}

/* Texte "Pas de plus haute résolution disponible" + lien filename */
.mw-filepage-resolutioninfo,
.fullMedia {
  color: rgba(204, 232, 212, 0.65) !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 11px !important;
  text-align: center !important;
  margin: 8px 0 !important;
  background: transparent !important;
}
.fullMedia a,
.mw-filepage-resolutioninfo a {
  color: #7dff9c !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(125, 255, 156, 0.25) !important;
}
.fullMedia a:hover {
  color: #b6ffc6 !important;
  border-bottom-color: #7dff9c !important;
}

/* Informations sur le fichier (taille, type MIME) */
.fileInfo,
.mw-filepage-mime,
.mw-filepage-dimensions {
  color: rgba(204, 232, 212, 0.6) !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 11px !important;
}

/* Tableau d'historique du fichier */
table.filehistory,
.filehistory {
  background: rgba(12, 24, 18, 0.85) !important;
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
  border-collapse: collapse !important;
  width: 100% !important;
  color: #cce8d4 !important;
  margin: 12px 0 !important;
}
.filehistory th {
  background: #0f2015 !important;
  border-bottom: 1px solid rgba(125, 255, 156, 0.2) !important;
  color: #7dff9c !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  padding: 10px 12px !important;
  text-align: left !important;
}
.filehistory td {
  background: transparent !important;
  border-bottom: 1px solid rgba(125, 255, 156, 0.06) !important;
  color: #cce8d4 !important;
  padding: 10px 12px !important;
  vertical-align: middle !important;
  font-size: 13px !important;
}
.filehistory tr:hover td {
  background: rgba(125, 255, 156, 0.04) !important;
}

/* Marqueur "actuel" dans l'historique */
.filehistory td.filehistory-selected,
.filehistory tr.filehistory-selected td {
  background: rgba(125, 255, 156, 0.06) !important;
  color: #7dff9c !important;
}

/* Vignettes dans le tableau d'historique */
.filehistory img,
.filehistory a img,
.filehistory .mw-thumbnail-link img {
  background: rgba(6, 15, 11, 0.6) !important;
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
  border-radius: 2px !important;
  padding: 2px !important;
}

/* Liens de date dans l'historique */
.filehistory a {
  color: #7dff9c !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 11px !important;
  text-decoration: none !important;
}
.filehistory a:hover { color: #b6ffc6 !important; }

/* "Vous ne pouvez pas remplacer ce fichier" / autres messages */
.mw-filepage-other-versions,
.mw-filepage-upload-error,
.sharedUploadNotice {
  background: rgba(6, 15, 11, 0.6) !important;
  border: 1px solid rgba(245, 200, 74, 0.2) !important;
  border-left: 3px solid rgba(245, 200, 74, 0.5) !important;
  color: rgba(204, 232, 212, 0.85) !important;
  padding: 10px 14px !important;
  border-radius: 2px !important;
  margin: 12px 0 !important;
  font-style: italic !important;
}

/* Section "Utilisation du fichier" */
#mw-imagepage-section-linkstoimage,
.mw-imagepage-linkstoimage {
  background: transparent !important;
}
.mw-imagepage-linkstoimage ul,
#mw-imagepage-section-linkstoimage ul {
  background: rgba(6, 15, 11, 0.5) !important;
  border: 1px solid rgba(125, 255, 156, 0.08) !important;
  border-radius: 2px !important;
  padding: 12px 16px 12px 36px !important;
  margin: 8px 0 !important;
  list-style: square !important;
}
.mw-imagepage-linkstoimage li,
#mw-imagepage-section-linkstoimage li {
  color: #cce8d4 !important;
  padding: 3px 0 !important;
}
.mw-imagepage-linkstoimage li::marker {
  color: rgba(125, 255, 156, 0.4) !important;
}

/* Métadonnées EXIF (souvent collapsible) */
.mw_metadata,
table.mw_metadata {
  background: rgba(6, 15, 11, 0.6) !important;
  border: 1px solid rgba(125, 255, 156, 0.1) !important;
  color: #cce8d4 !important;
  margin: 12px 0 !important;
}
.mw_metadata th {
  background: rgba(15, 32, 21, 0.5) !important;
  color: rgba(125, 255, 156, 0.65) !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  text-align: left !important;
  padding: 6px 12px !important;
}
.mw_metadata td {
  background: transparent !important;
  border-bottom: 1px solid rgba(125, 255, 156, 0.05) !important;
  color: rgba(204, 232, 212, 0.75) !important;
  padding: 6px 12px !important;
  font-size: 12px !important;
}

/* Liens de section [modifier | modifier le wikicode] dans pages File: */
.mw-editsection-bracket {
  color: rgba(125, 255, 156, 0.3) !important;
}
.mw-editsection a {
  color: rgba(125, 255, 156, 0.5) !important;
}
.mw-editsection a:hover { color: #7dff9c !important; }

/* Cas spécifique : namespace File: utilise des wikitables pour l'historique
   mais sans la classe wikitable — on cible la table principale du contenu */
.mw-special-Filepage table:not(.wikitable):not(.va-table):not(.avt-infobox) {
  background: rgba(12, 24, 18, 0.85) !important;
  color: #cce8d4 !important;
}
.mw-special-Filepage table:not(.wikitable):not(.va-table):not(.avt-infobox) th {
  background: #0f2015 !important;
  color: #7dff9c !important;
}
.mw-special-Filepage table:not(.wikitable):not(.va-table):not(.avt-infobox) td {
  background: transparent !important;
  color: #cce8d4 !important;
  border-bottom: 1px solid rgba(125, 255, 156, 0.06) !important;
}

/* ============================================================
   51. MULTIMEDIAVIEWER (MMV) — lightbox d'image + boutons Codex
   → MIGRÉE dans le skin : skinStyles/mmv.less + codex.less
   ============================================================ */
/* ============================================================
   52. VE DIALOG — fix bande blanche dans le panneau d'édition
   → MIGRÉE dans le skin : skinStyles/oojs-ui-windows.less
   ============================================================ */
/* ============================================================
   53. CORRECTIONS CIBLÉES — toolbars dialogues, popups, checkboxes
   ============================================================ */
/* Blocs (1), (2), (6) migrés dans skinStyles/ve-overrides.less ;
   bloc (3) dans skinStyles/oojs-ui-core.less + codex.less ;
   bloc (5) dans skinStyles/mediawiki.widgets.less.
   Ne reste ici que le bloc (4), qui surcharge la section 41. */

/* ─── (4) Popups d'aperçu d'article : retirer le filtre hue-rotate ───
   Le filtre hue-rotate(-8deg) sur les miniatures donnait une teinte
   vert pomme indistincte aux images. À retirer pour garder les couleurs
   d'origine. */
.mwe-popups .mwe-popups-thumbnail image,
.mwe-popups svg.mwe-popups-thumbnail image {
  filter: none !important;
}
/* ============================================================
   54. WIDGET RECHERCHE VE — vignettes lisibles
   → MIGRÉE dans le skin : skinStyles/mediawiki.widgets.less
   ============================================================ */
/* ============================================================
   55. VE — Dialogues modaux au-dessus de la toolbar
   → MIGRÉE dans le skin : skinStyles/oojs-ui-windows.less
   ============================================================ */
/* ============================================================
   56. BOUTONS OOUI FRAMED — fond clair par défaut OOUI/Codex
   → MIGRÉE dans le skin : skinStyles/oojs-ui-core.less
   ============================================================ */
/* ============================================================
   57. BANDEAU DISCORD — barre fixe en bas de page
   ============================================================ */

.vt-discord-banner {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1500;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 12px 24px;
  background: rgba(8, 18, 12, 0.97);
  border-top: 1px solid rgba(125, 255, 156, 0.35);
  box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  font-family: 'IBM Plex Mono', monospace;
  color: #cce8d4;
  transition: transform 0.35s ease, opacity 0.35s ease;
}

.vt-discord-banner.vt-banner-hidden {
  transform: translateY(100%);
  opacity: 0;
  pointer-events: none;
}

/* Texte principal — prend l'espace flexible, à gauche */
.vt-banner-text {
  flex: 1;
  font-size: 13px;
  line-height: 1.5;
}

.vt-banner-text strong {
  color: #7dff9c;
  font-weight: 600;
  letter-spacing: 0.02em;
}

/* Bloc icône + compteur, collé à droite à côté du bouton Rejoindre */
.vt-banner-info {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.vt-banner-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  color: #7dff9c;
}

.vt-banner-icon svg {
  width: 24px;
  height: 24px;
  fill: currentColor;
}

.vt-banner-members {
  font-size: 12px;
  color: #7dff9c;
  font-weight: 600;
  white-space: nowrap;
  flex-shrink: 0;
}

/* Bouton Rejoindre */
.vt-banner-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(125, 255, 156, 0.12);
  border: 1px solid rgba(125, 255, 156, 0.4);
  border-radius: 2px;
  color: #7dff9c !important;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-decoration: none !important;
  padding: 8px 18px;
  cursor: pointer;
  transition: all 0.15s;
  flex-shrink: 0;
}

.vt-banner-btn:hover {
  background: rgba(125, 255, 156, 0.22);
  border-color: #7dff9c;
  box-shadow: 0 0 12px rgba(125, 255, 156, 0.25);
  color: #b6ffc6 !important;
}

/* Bouton fermer */
.vt-banner-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: transparent;
  border: 1px solid rgba(125, 255, 156, 0.2);
  color: rgba(125, 255, 156, 0.5);
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  flex-shrink: 0;
  transition: all 0.15s;
}

.vt-banner-close:hover {
  border-color: #ff7a7a;
  color: #ff7a7a;
  background: rgba(255, 122, 122, 0.08);
}

/* Respecte prefers-reduced-motion : pas d'animation d'entrée/sortie */
@media (prefers-reduced-motion: reduce) {
  .vt-discord-banner { transition: none; }
}

/* Mobile */
@media (max-width: 720px) {
  .vt-discord-banner {
    flex-wrap: wrap;
    gap: 10px;
    padding: 10px 16px;
  }
  .vt-banner-text {
    flex: 1 1 100%;
    font-size: 12px;
    order: 1;
  }
  .vt-banner-info {
    order: 2;
  }
  .vt-banner-close {
    order: 3;
    margin-left: auto;
  }
  .vt-banner-btn {
    order: 4;
    flex: 1 1 100%;
    justify-content: center;
    padding: 10px;
  }
}
Récupérée de "https://fallout-wiki.com/index.php?title=MediaWiki:Vaulttec.css&oldid=208316"