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

Kims (discussion | contributions)
Aucun résumé des modifications
Balise : Révoqué
Kims (discussion | contributions)
Aucun résumé des modifications
 
(38 versions intermédiaires par le même utilisateur non affichées)
Ligne 1 : Ligne 1 :
/**
/*
  * VaultTec skin skin.less
  * MediaWiki:Vaulttec.css v46
  * MediaWiki 1.39+  |  Vector 2022 alternative
  * Chargé uniquement pour les utilisateurs du skin VaultTec.
  *
  *
  * Palette : phosphore vert sur fond noir profond.
  * v46 : retour de l'infobox à 320px. La borne à 42 % de la v45 accompagnait
  * Typo    : IBM Plex Mono (chrome) + Instrument Serif (titres) + Crimson Pro (corps).
  * une colonne de lecture de 38rem qui s'est révélée trop étroite pour du
* vrai contenu de wiki — elle est revenue à 960px, l'infobox n'a donc plus
* lieu d'être réduite.
* v44 : correction d'un sélecteur qui mettait TOUTE la page en majuscules
* pendant la rédaction d'une réponse (voir section 43, DiscussionTools).
* Les sections 43 et suivantes propres à DiscussionTools peuvent être
* retirées avec le skin >= 1.13.0, qui apporte skinStyles/
* ext.discussionTools.less.
* v43 (optimisation, lot 3 — requiert le skin >= 1.7.2) : sections 13, 16,
* 31, 33, 41 et le reliquat de la 53 migrés dans le skin ; deux règles de
* repli du sommaire (section 4) et la largeur de la barre latérale
* (section 3) supprimées car redondantes avec le skin.
* v42 (lot 2, skin >= 1.5.0) : sections 19, 37, 51, 54, 55, 56 migrées,
* 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;
@sidebar-w:    220px;


// ============================================================
/* ============================================================
// Z-INDEX SCALE — référence (ne pas modifier sans coordination)
  3. LAYOUT
// ============================================================
  ============================================================ */
//  9999  .vt-scanlines          (effet CRT, top layer)
.vt-page-container { display: flex !important; width: 100% !important; align-items: flex-start !important; min-height: calc(100vh - 54px) !important; }
//  9998  .vt-vignette            (effet CRT)
.vt-content-container, #content { flex: 1 1 auto !important; min-width: 0 !important; width: 0 !important; }
//  1200  #vt-scroll-top          (bouton remonter)
#bodyContent { max-width: none !important; width: 100% !important; padding: 28px 36px 60px !important; }
//  1100  .vt-header              (sticky)
//  1099  .ve-ui-toolbar          (sticky sous header, depuis ve-overrides.less)
//  1001  .vt-sidebar            (drawer mobile, au-dessus de l'overlay)
//  999  .vt-drawer-overlay      (overlay drawer mobile, capture les clics)
//  950  .vt-toc-sidebar        (desktop > 1200px)
//  800  .vt-toc-sidebar        (mobile/tablet ≤ 1200px)
//  500  .vt-page-tabs-wrap      (sticky tabs mobile)
//  500  .vt-page-tabs          (sticky tabs desktop, sous le header)
//    2  .vt-content-row        (contexte d'empilement local)
//    1 .vt-scroll-arrow
//    0 .vt-watermark
 
// ============================================================
// RESET & BASE
// ============================================================
* {
box-sizing: border-box;
}


html,
/* ============================================================
body {
  4. TOC — style avant exécution du JS
background: @bg;
  ============================================================ */
color: @text;
/* skins.vaulttec.scripts déplace le sommaire dans la colonne de droite.
font-family: @font-body;
  Ces règles ne s'appliquent donc qu'au premier rendu, ou sans JS.
font-size: 16px;
  Les règles de bascule (.vt-toc-collapsed, flèche ▸) ont été retirées
line-height: 1.5;
  en v43 : aucun script ne pose cette classe. */
margin: 0;
#mw-content-text .toc, #mw-content-text #toc {
padding: 0;
  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 {
a {
  display: flex !important; align-items: center !important; justify-content: space-between !important;
color: @ph-dim;
  gap: 16px !important; padding: 8px 14px !important;
text-decoration: none;
  margin: 0 !important; border-bottom: 1px solid rgba(125, 255, 156, 0.12) !important; white-space: nowrap !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 h2, #mw-content-text .toc .toctitle h2 {
// ============================================================
  font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; font-weight: 500 !important;
// EFFETS CRT
  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;
.vt-scanlines {
position: fixed;
inset: 0;
pointer-events: none;
background: repeating-linear-gradient(
0deg,
transparent 0px,
transparent 2px,
rgba(125, 255, 156, 0.018) 3px,
transparent 4px
);
z-index: 9999;
mix-blend-mode: screen;
}
}
 
#mw-content-text .toc > ul { display: block !important; padding: 6px 0 8px !important; margin: 0 !important; }
.vt-vignette {
#mw-content-text .toc ul { list-style: none !important; margin: 0 !important; padding: 0 !important; }
position: fixed;
#mw-content-text .toc li a {
inset: 0;
  display: flex !important; align-items: baseline !important; padding: 4px 14px !important;
pointer-events: none;
  font-size: 11px !important; color: #7aaa88 !important; font-family: 'IBM Plex Mono', monospace !important;
background: radial-gradient(ellipse at center, transparent 50%, rgba(0, 0, 0, 0.45) 100%);
  border-left: 2px solid transparent !important; transition: all 0.15s !important; text-decoration: none !important; white-space: nowrap !important;
z-index: 9998;
}
}
#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-watermark {
/* ============================================================
position: fixed;
  5. INFOBOX
top: 50%;
  ============================================================ */
left: 50%;
.avt-infobox, .mw-parser-output .avt-infobox {
transform: translate(-50%, -50%);
  width: 320px !important; max-width: 100% !important; float: right !important; clear: right !important;
font-family: @font-serif;
  margin: 0 0 1em 1.5em !important; box-sizing: border-box !important;
font-style: italic;
  background-color: rgba(12, 24, 18, 0.9) !important; border-color: rgba(125, 255, 156, 0.2) !important;
font-size: 55vw;
  box-shadow: 0 0 10px rgba(125, 255, 156, 0.12) !important; color: #cce8d4 !important;
color: @phosphor;
opacity: 0.015;
z-index: 0;
user-select: none;
pointer-events: none;
line-height: 1;
}
}
 
@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; }
// HEADER
// ============================================================
.vt-header {
position: sticky;
top: 0;
z-index: 1100; // au-dessus de la sidebar drawer (1000)
height: @header-h;
display: flex;
align-items: center;
background: rgba(6, 16, 11, 0.92);
backdrop-filter: blur(14px);
border-bottom: 1px solid @border;
}
}
.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; }


// Logo
/* ============================================================
.vt-logo {
  6. WIKITABLE
flex-shrink: 0;
  ============================================================ */
height: 100%;
.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; }
border-right: 1px solid @border;
.wikitable > tr > th, .wikitable > * > tr > th, .va-table > tr > th, .va-table > * > tr > th { background-color: #0f2015 !important; color: #7dff9c !important; }
padding: 0 20px;
.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; }


.vt-logo-link {
/* ============================================================
display: flex;
  7. PALETTES & NAVBOXES
align-items: center;
  ============================================================ */
gap: 12px;
.palette { background-color: rgba(12, 24, 18, 0.85) !important; border-color: rgba(125, 255, 156, 0.15) !important; color: #cce8d4 !important; }
height: 100%;
.palette-titre, .palette-banniere, .palette-section, .palette-groupe { background-color: #0f2015 !important; color: #7dff9c !important; }
text-decoration: none !important;
.palette-pair { background-color: transparent !important; }
.va-infobox-title, .va-navbox-title { background: #0f2015 !important; color: #7dff9c !important; }


&:hover .vt-logo-mark {
/* ============================================================
background: rgba(125, 255, 156, 0.2);
  8. BOÎTES GÉNÉRIQUES
box-shadow: 0 0 12px rgba(125, 255, 156, 0.3);
  ============================================================ */
}
.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; }


.vt-logo-mark {
/* Espacement réduit entre bandeaux d'avertissement consécutifs */
width: 32px;
.mw-parser-output .avt-warn-banner,
height: 32px;
.mw-parser-output .avt-note-banner,
border: 1.5px solid @phosphor;
.mw-parser-output .avt-section-banner {
display: flex;
  background-color: rgba(12, 24, 18, 0.85) !important;
align-items: center;
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
justify-content: center;
  color: #cce8d4 !important;
font-family: @font-serif;
  margin-bottom: 4px !important;
font-style: italic;
  box-shadow: none !important;
font-size: 18px;
color: @phosphor;
background: @ph-faint;
flex-shrink: 0;
transition: all 0.2s;
}
}


.vt-logo-text {
/* ============================================================
display: flex;
  9. LIENS
flex-direction: column;
  ============================================================ */
line-height: 1.15;
.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; }


.vt-logo-sup {
/* ============================================================
font-family: @font-mono;
  10. TOC VECTOR 2022
font-size: 9px;
  ============================================================ */
letter-spacing: 0.28em;
.sidebar-toc, .vector-toc { background-color: rgba(12, 24, 18, 0.85) !important; border-color: rgba(125, 255, 156, 0.15) !important; }
color: @text-muted;
.vector-toc .vector-toc-link, .sidebar-toc .sidebar-toc-link { color: #4ab06a !important; }
text-transform: uppercase;
.vector-toc .vector-toc-link:hover, .sidebar-toc .sidebar-toc-link:hover { color: #7dff9c !important; }
}


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


// Recherche
/* ============================================================
.vt-search {
  12. SITENOTICE
flex: 1;
  ============================================================ */
padding: 0 20px;
.avt-sitenotice { background-color: rgba(12, 24, 18, 0.9) !important; border-color: rgba(125, 255, 156, 0.2) !important; color: #cce8d4 !important; }


form {
/* ============================================================
display: flex;
  13. RECHERCHE — dropdown miniatures (header)
gap: 6px;
  → MIGRÉE dans le skin : resources/skins.vaulttec/skin.less (bloc RECHERCHE)
max-width: 380px;
  ============================================================ */
}
/* ============================================================
  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; }


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
}
  → MIGRÉE dans le skin : resources/skins.vaulttec/skin.less (bloc CATÉGORIES)
  ============================================================ */
/* ============================================================
  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; }


&:focus {
/* ============================================================
outline: none;
  18. MODIFICATIONS RÉCENTES — filtres OOUI + légende
border-color: @phosphor;
  → MIGRÉE dans le skin : skinStyles/mediawiki.rcfilters.less + mediawiki.special.changeslist.less
box-shadow: 0 0 0 1px @ph-faint;
  ============================================================ */
}
/* ============================================================
}
  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; }


button,
/* ============================================================
input[type='submit'] {
  21. MOBILE — onglets défilants
background: @ph-faint;
  ============================================================ */
border: 1px solid @ph-border2;
@media screen and (max-width: 720px) {
color: @phosphor;
  .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; }
font-family: @font-mono;
  .vt-page-tabs::-webkit-scrollbar { height: 3px !important; }
font-size: 11px;
  .vt-page-tabs::-webkit-scrollbar-thumb { background: rgba(125, 255, 156, 0.2) !important; }
letter-spacing: 0.15em;
  .vt-tabs-ns ul, .vt-tabs-views ul, .vt-tabs-more ul { flex-wrap: nowrap !important; white-space: nowrap !important; }
padding: 7px 14px;
  .vt-page-tabs li a { white-space: nowrap !important; padding: 0 10px !important; font-size: 10px !important; }
cursor: pointer;
  .vt-tabs-sep { display: none !important; }
text-transform: uppercase;
transition: all 0.15s;
flex-shrink: 0;
 
&:hover {
background: @phosphor;
color: @bg;
}
}
}
}


// 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; }
}


&::-webkit-scrollbar { width: 3px; }
/* ============================================================
&::-webkit-scrollbar-thumb { background: @ph-border; }
  31. PAGE PRÉFÉRENCES
  → MIGRÉE dans le skin : skinStyles/mediawiki.special.preferences.less,
    oojs-ui-core.less (dropdowns, menus, bulles) et
    mediawiki.widgets.datetime.less (champs date, calendriers — les
    sélecteurs .oo-ui-calendarWidget / .mw-widget-DateInputWidget
    utilisés ici n'existaient pas dans MediaWiki et ne s'appliquaient
    à rien ; le skin utilise les vraies classes).
  ============================================================ */
/* ============================================================
  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
  → MIGRÉE dans le skin : resources/skins.vaulttec/skin.less (bloc BOUTON LANGUES)
  ============================================================ */
/* ============================================================
  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; }


.vt-sidebar-title {
/* ============================================================
font-family: @font-mono;
  35. SCROLLBAR MOBILE — masquage agressif
font-size: 9px;
  ============================================================ */
font-weight: 400;
@media screen and (max-width: 900px) {
letter-spacing: 0.28em;
  .vt-page-tabs,
text-transform: uppercase;
  .vt-user-tools,
color: @text-muted;
  .vt-page-tabs *,
padding: 0 18px 8px;
  .vt-user-tools * { scrollbar-width: none !important; -ms-overflow-style: none !important; }
margin: 0 0 4px;
  .vt-page-tabs::-webkit-scrollbar,
border-bottom: 1px dashed @border;
  .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; }
}
}


.vt-sidebar-section ul {
/* ============================================================
list-style: none;
  36. CITATIONS (blockquote)
margin: 0;
  ============================================================ */
padding: 0;
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;
}


li a {
/* ============================================================
display: block;
  37. PAGE RECHERCHE — Special:Recherche
padding: 7px 18px;
  → MIGRÉE dans le skin : skinStyles/mediawiki.special.search.less
font-family: @font-mono;
  ============================================================ */
font-size: 12px;
/* ============================================================
color: @text-dim;
  38. NOTIFICATIONS / TOAST POST-PUBLICATION
border-left: 2px solid transparent;
  ============================================================ */
text-decoration: none;
.mw-notification,
transition: all 0.15s;
.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; }


&:hover {
/* ============================================================
color: @phosphor;
  39. WIKITABLE — adaptation à l'infobox (desktop)
background: @ph-faint;
  ============================================================ */
border-left-color: @ph-dim;
@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;
  }
}
}


// ============================================================
/* ============================================================
// ONGLETS
  40. CORRECTIONS AVANCÉES — liens, tableaux collapsibles
// ============================================================
  ============================================================ */
.vt-page-tabs {
display: flex;
align-items: flex-end;
height: @tab-h;
padding: 0 32px;
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 {
/* Liens rouges (.new) dans les tableaux — ne pas écraser avec le vert */
display: flex;
.mw-parser-output table td a.new,
list-style: none;
.mw-parser-output table th a.new,
margin: 0;
.mw-parser-output .wikitable td a.new,
padding: 0;
.mw-parser-output .wikitable th a.new,
gap: 2px;
.mw-parser-output .va-table td a.new {
height: 100%;
  color: #ff5e5e !important;
align-items: flex-end;
}
}
.mw-parser-output table td a.new:hover,
.mw-parser-output .wikitable td a.new:hover {
  color: #ff8888 !important;
}


li a {
/* Liens externes — ambre pour les distinguer des liens internes */
display: flex;
.mw-parser-output a.external,
align-items: center;
.mw-parser-output a[rel~="nofollow"] {
padding: 0 14px;
  color: #f5c84a !important;
height: 36px;
}
font-size: 11px;
.mw-parser-output a.external:visited,
letter-spacing: 0.12em;
.mw-parser-output a[rel~="nofollow"]:visited {
text-transform: uppercase;
  color: #c9973a !important;
color: @text-dim;
border: 1px solid transparent;
border-bottom: none;
margin-bottom: -1px;
text-decoration: none;
transition: all 0.15s;
 
&:hover {
color: @phosphor;
background: @ph-faint;
}
}
 
// Onglet actif
li.selected a,
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)
  → MIGRÉE dans le skin : skinStyles/ext.popups.less
  ============================================================ */
/* ============================================================
  42. DIFF VIEW comparaison de versions
  → MIGRÉE dans le skin : skinStyles/mediawiki.diff.less
  ============================================================ */
/* ============================================================
  43. DISCUSSIONTOOLS — pages de discussion modernes
  ============================================================ */


// Le flex est sur .mw-heading (le wrapper), pas sur h2
/* Boutons "Répondre", "Souscrire", "Ajouter un sujet" */
.mw-heading {
.ext-discussiontools-init-replylink-buttons .oo-ui-buttonElement-button,
display: flex;
.ext-discussiontools-init-section-subscribeButton .oo-ui-buttonElement-button,
align-items: baseline;
.ext-discussiontools-init-new-topic .oo-ui-buttonElement-button {
border-bottom: 1px solid @border;
  background: transparent !important;
margin: 32px 0 14px;
  border: 1px solid rgba(125, 255, 156, 0.2) !important;
padding-bottom: 8px;
  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;
}


h2 {
/* Icônes des boutons */
font-family: @font-serif;
.ext-discussiontools-init-replylink-buttons .oo-ui-iconElement-icon,
font-style: italic;
.ext-discussiontools-init-section-subscribeButton .oo-ui-iconElement-icon {
font-size: 28px;
  filter: brightness(0) saturate(100%) invert(91%) sepia(15%) saturate(594%) hue-rotate(76deg) brightness(101%) !important;
color: @text;
  opacity: 0.65 !important;
margin: 0;
}
padding-bottom: 0;
border-bottom: 0;
display: block;
flex: 1;
}


h3 {
/* Liens "Répondre" textuels.
font-family: @font-mono;
  NE PAS ajouter .ext-discussiontools-init-replylink-open à ce sélecteur :
font-size: 13px;
  contrairement à ce que son nom suggère, DiscussionTools pose cette classe
font-weight: 600;
  sur le <body>, pas sur un lien, pendant qu'un formulaire de réponse est
color: @phosphor;
  ouvert. Le text-transform: uppercase se propageait alors à TOUTE la page —
letter-spacing: 0.1em;
  commentaires, titres, texte de l'article — jusqu'à la fermeture du
text-transform: uppercase;
  formulaire. Mesuré : getComputedStyle(document.body).textTransform
margin: 22px 0 10px;
  valait « uppercase » après un clic sur Répondre. */
padding-left: 10px;
.ext-discussiontools-init-replylink-reply {
border-left: 2px solid @phosphor;
  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 {
  color: #7dff9c !important;
}


h4 {
/* Conteneur d'une section commentée */
font-family: @font-mono;
.ext-discussiontools-init-section,
font-size: 12px;
.ext-discussiontools-init-highlight,
font-weight: 500;
.ext-discussiontools-init-targetcomment {
color: @text-dim;
  background: rgba(125, 255, 156, 0.04) !important;
letter-spacing: 0.1em;
  border-left: 2px solid rgba(125, 255, 156, 0.25) !important;
text-transform: uppercase;
  padding-left: 12px !important;
margin: 18px 0 8px;
  margin: 8px 0 !important;
}
  border-radius: 2px !important;
}


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


// Liens de modification de section
/* Boîte d'auteur de commentaire */
.mw-editsection {
.ext-discussiontools-init-timestamplink {
font-family: @font-mono;
  color: rgba(125, 255, 156, 0.5) !important;
font-size: 10px;
  font-family: 'IBM Plex Mono', monospace !important;
letter-spacing: 0.1em;
  font-size: 11px !important;
font-style: normal;
}
margin-left: 10px;
.ext-discussiontools-init-timestamplink:hover { color: #7dff9c !important; }


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


&:hover {
/* Boutons "Publier" / "Annuler" du widget réponse */
color: @phosphor;
.ext-discussiontools-ui-replyWidget-actions .oo-ui-flaggedElement-progressive .oo-ui-buttonElement-button,
border-color: @ph-dim;
.ext-discussiontools-ui-replyWidget-actions .oo-ui-flaggedElement-primary .oo-ui-buttonElement-button {
background: @ph-faint;
  background: rgba(125, 255, 156, 0.15) !important;
text-decoration: none;
  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 */
// INFOBOX
.ext-discussiontools-init-pingmark {
// ============================================================
  color: #7dff9c !important;
.infobox,
  background: rgba(125, 255, 156, 0.1) !important;
.mw-parser-output .infobox {
  border-radius: 2px !important;
float: right;
  padding: 0 4px !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
/* ============================================================
caption,
  44. ECHO — badges & menus de notifications (header)
th.infobox-title,
  → MIGRÉE dans le skin : skinStyles/ext.echo.less
.infobox-title,
  ============================================================ */
> tbody > tr:first-child > th {
/* ============================================================
background: @amber !important;
  45. CITE — références [1][2] et notes de bas de page
color: #1a1000 !important;
  → MIGRÉE dans le skin : skinStyles/ext.cite.less
font-family: @font-mono;
  ============================================================ */
font-weight: 600;
/* ============================================================
font-size: 13px;
  46. CODE INLINE & PRE — styles génériques
letter-spacing: 0.05em;
  ============================================================ */
padding: 10px 14px;
/* La partie .mw-highlight (Pygments) est migrée dans le skin :
text-align: center;
  skinStyles/ext.pygments.less. Ne restent ici que les styles
text-transform: uppercase;
  code/tt/pre génériques, indépendants de SyntaxHighlight. */
display: block;
}


tr {
/* Code inline `<code>` standard */
border-top: 1px dashed @border;
.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;
}


th {
/* Pre standard (non-Pygments) */
color: @text-muted;
.mw-parser-output pre,
font-size: 10px;
.mw-parser-output .mw-code {
letter-spacing: 0.08em;
  background: #060f0b !important;
text-transform: uppercase;
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
padding: 7px 12px;
  border-radius: 3px !important;
font-weight: 400;
  color: #cce8d4 !important;
text-align: left;
  font-family: 'IBM Plex Mono', monospace !important;
vertical-align: top;
  font-size: 13px !important;
background: transparent;
  line-height: 1.55 !important;
width: 42%;
  padding: 12px 14px !important;
}
  overflow-x: auto !important;
 
td {
color: @text;
padding: 7px 12px;
vertical-align: top;
font-size: 11px;
background: transparent;
}
}
}


// ============================================================
/* ============================================================
// TABLEAUX WIKI
  47. TABBERNEUE — onglets <tabber>
// ============================================================
  ============================================================ */
.wikitable {
border-collapse: collapse;
width: 100%;
margin-bottom: 20px;
background: transparent;


th {
/* Conteneur tabber */
background: @bg-elevated;
.tabber,
color: @phosphor;
.tabber__container,
font-family: @font-mono;
.mw-parser-output .tabber {
font-size: 10px;
  background: transparent !important;
letter-spacing: 0.15em;
  border: 0 !important;
text-transform: uppercase;
  margin: 16px 0 !important;
padding: 8px 14px;
}
text-align: left;
border: 1px solid @border;
}


td {
/* Barre d'onglets */
padding: 8px 14px;
.tabber__header,
border: 1px solid @border;
.tabber__tabs {
color: @text;
  background: rgba(6, 15, 11, 0.6) !important;
vertical-align: top;
  border-bottom: 1px solid rgba(125, 255, 156, 0.2) !important;
font-size: 14px;
  padding: 0 !important;
}
  margin: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0 !important;
}


tr:hover td {
/* Onglet individuel */
background: @ph-faint;
.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 */
// TABLE DES MATIÈRES
.tabber__tab--active,
// ============================================================
.tabber__tab[aria-selected="true"] {
.toc,
  color: #7dff9c !important;
#toc {
  border-bottom-color: #7dff9c !important;
background: @bg-panel;
  background: rgba(125, 255, 156, 0.08) !important;
border: 1px solid @border;
}
padding: 14px 0 10px;
font-family: @font-mono;
display: inline-block;
margin: 0 0 20px;
min-width: 200px;


.toctitle {
/* Contenu de l'onglet */
font-size: 9px;
.tabber__section,
letter-spacing: 0.28em;
.tabber__panel {
text-transform: uppercase;
  background: transparent !important;
color: @text-muted;
  border: 0 !important;
padding: 0 16px 10px;
  padding: 16px 0 !important;
border-bottom: 1px dashed @border;
  color: #cce8d4 !important;
margin-bottom: 6px;
}


h2 {
/* Indicateur de défilement (flèches >) sur petits écrans */
// Override l'h2 général pour la TOC
.tabber__header__prev,
font-family: @font-mono;
.tabber__header__next {
font-size: 9px;
  background: rgba(6, 15, 11, 0.9) !important;
font-style: normal;
  color: rgba(125, 255, 156, 0.6) !important;
color: @text-muted;
  border: 0 !important;
margin: 0;
  cursor: pointer !important;
padding: 0;
}
border: none;
.tabber__header__prev:hover,
}
.tabber__header__next:hover { color: #7dff9c !important; }
}


ul {
/* Version animée pendant la transition */
list-style: none;
.tabber--live .tabber__section {
margin: 0;
  transition: opacity 0.2s ease;
padding: 0;
}


li a {
/* ============================================================
display: flex;
  48. REVISIONSLIDER — slider de diff entre versions
align-items: baseline;
  ============================================================ */
gap: 8px;
padding: 5px 16px;
font-size: 11px;
color: @text-dim;
line-height: 1.3;
transition: all 0.15s;
border-left: 2px solid transparent;


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


// Sous-niveaux
/* Bouton toggle (déplier/replier) */
ul li a {
.mw-revslider-toggle-button {
padding-left: 28px;
  background: transparent !important;
font-size: 10px;
  border: 1px solid rgba(125, 255, 156, 0.2) !important;
color: @text-muted;
  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;
}


.tocnumber {
/* Axe horizontal (timeline) */
color: @text-muted;
.mw-revslider-revisions-container,
font-size: 10px;
.mw-revslider-revisions {
flex-shrink: 0;
  background: rgba(6, 15, 11, 0.6) !important;
min-width: 18px;
  border: 1px solid rgba(125, 255, 156, 0.1) !important;
}
  border-radius: 2px !important;
}
}


// ============================================================
/* Barres représentant chaque révision */
// BANDEAUX & NOTICES
.mw-revslider-revision {
// ============================================================
  background: rgba(125, 255, 156, 0.25) !important;
.ambox,
  border: 0 !important;
.mbox-small {
  transition: background 0.15s !important;
border: 1px solid @amber-faint;
}
background: @amber-faint;
.mw-revslider-revision:hover {
border-left: 3px solid @amber;
  background: rgba(125, 255, 156, 0.5) !important;
padding: 12px 16px;
}
margin-bottom: 16px;
font-family: @font-mono;
font-size: 12px;
color: @text-dim;
letter-spacing: 0.03em;
line-height: 1.6;
display: flex;
gap: 12px;
align-items: flex-start;
clear: both;


td {
/* Révision sélectionnée (les deux côtés du diff) */
border: none;
.mw-revslider-revision-old,
padding: 0;
.mw-revslider-revision[data-pos="older"] {
background: transparent;
  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) */
// CATÉGORIES
.mw-revslider-pointer-old,
// ============================================================
.mw-revslider-pointer-new,
#catlinks {
.mw-revslider-pointer {
margin-top: 40px;
  background: rgba(8, 18, 12, 0.95) !important;
padding-top: 16px;
  border: 1px solid rgba(125, 255, 156, 0.5) !important;
border-top: 1px solid @border;
  color: #7dff9c !important;
font-family: @font-mono;
  border-radius: 2px !important;
font-size: 11px;
}
display: flex;
.mw-revslider-pointer-old { border-color: rgba(255, 94, 94, 0.6) !important; }
align-items: baseline;
.mw-revslider-pointer-new { border-color: rgba(125, 255, 156, 0.6) !important; }
gap: 10px;
flex-wrap: wrap;


a {
/* Tooltips au survol d'une révision */
padding: 2px 10px;
.mw-revslider-tooltip,
border: 1px solid @border;
.mw-revslider-tooltip .oo-ui-popupWidget-popup {
color: @text-dim;
  background: rgba(8, 18, 12, 0.98) !important;
font-size: 10px;
  border: 1px solid rgba(125, 255, 156, 0.25) !important;
letter-spacing: 0.1em;
  border-radius: 3px !important;
text-transform: uppercase;
  color: #cce8d4 !important;
transition: all 0.15s;
  font-family: 'IBM Plex Mono', monospace !important;
text-decoration: none;
  font-size: 11px !important;
  padding: 8px 10px !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.6) !important;
}


&:hover {
/* Liens dans le tooltip */
color: @phosphor;
.mw-revslider-tooltip a { color: #7dff9c !important; }
border-color: @ph-dim;
background: @ph-faint;
}
}


.mw-normal-catlinks {
/* Flèches navigation */
&::before {
.mw-revslider-arrow {
content: 'Catégories :';
  background: transparent !important;
color: @text-muted;
  color: rgba(125, 255, 156, 0.5) !important;
text-transform: uppercase;
  border: 0 !important;
letter-spacing: 0.2em;
  cursor: pointer !important;
margin-right: 8px;
}
}
.mw-revslider-arrow:hover { color: #7dff9c !important; }


ul {
/* Indicateurs de taille (+/- octets) */
display: inline;
.mw-revslider-revision-wrapper .mw-revslider-bar-bigger,
list-style: none;
.mw-revslider-bar-bigger {
padding: 0;
  background: rgba(125, 255, 156, 0.6) !important;
margin: 0;
}
}
.mw-revslider-revision-wrapper .mw-revslider-bar-smaller,
.mw-revslider-bar-smaller {
  background: rgba(255, 94, 94, 0.6) !important;
}


ul li {
/* ============================================================
display: inline;
  49. TABLEPAGER & LISTES SPÉCIALES — pages d'admin et stats
}
  ============================================================ */


ul li::after {
/* Tableau pager générique (Spécial:Statistiques, ListUsers, AllPages…) */
content: ' ';
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 */
// FOOTER
.TablePager th,
// ============================================================
.mw-statistics-table th,
.vt-footer {
table.mw-spcontent th,
border-top: 1px solid @border;
.mw-special-Statistics th,
background: @bg-panel;
.mw-special-ActiveUsers th,
padding: 20px 32px;
.mw-special-Listusers th,
display: flex;
.mw-special-Listfiles th {
flex-wrap: wrap;
  background: #0f2015 !important;
align-items: center;
  border-bottom: 1px solid rgba(125, 255, 156, 0.2) !important;
gap: 16px;
  color: #7dff9c !important;
font-family: @font-mono;
  font-family: 'IBM Plex Mono', monospace !important;
font-size: 10px;
  font-size: 10px !important;
letter-spacing: 0.12em;
  font-weight: 500 !important;
color: @text-muted;
  text-transform: uppercase !important;
text-transform: uppercase;
  letter-spacing: 0.1em !important;
position: relative;
  padding: 10px 12px !important;
z-index: 2;
  text-align: left !important;
}
}


.vt-footer-links {
/* En-têtes triables */
display: flex;
.TablePager th.TablePager_sort,
gap: 24px;
.TablePager th.headerSort,
flex-wrap: wrap;
.TablePager th.headerSortUp,
flex: 1;
.TablePager th.headerSortDown {
 
  cursor: pointer !important;
ul {
  background-image: none !important;
display: flex;
gap: 16px;
list-style: none;
margin: 0;
padding: 0;
}
 
a {
color: @text-muted;
transition: color 0.15s;
 
&:hover {
color: @phosphor;
text-decoration: none;
}
}
}
}
.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; }


.vt-footer-brand {
/* Lignes */
display: flex;
.TablePager tr,
align-items: center;
.mw-statistics-table tr,
gap: 10px;
table.mw-spcontent tr {
font-family: @font-serif;
  background: transparent !important;
font-style: italic;
  border-bottom: 1px solid rgba(125, 255, 156, 0.06) !important;
font-size: 14px;
letter-spacing: 0.01em;
color: @ph-dim;
}
}


.vt-footer-brand-mark {
/* Lignes alternées */
width: 22px;
.TablePager tr:nth-child(even),
height: 22px;
.TablePager_even {
border: 1px solid @ph-dim;
  background: rgba(125, 255, 156, 0.025) !important;
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 12px;
}
}
 
.TablePager tr:nth-child(odd),
.vt-footer-status {
.TablePager_odd {
font-family: @font-mono;
  background: transparent !important;
font-style: normal;
font-size: 9px;
letter-spacing: 0.2em;
color: @text-muted;
display: flex;
align-items: center;
gap: 5px;
}
}
 
.TablePager tr:hover {
.vt-dot {
  background: rgba(125, 255, 156, 0.06) !important;
display: inline-block;
width: 6px;
height: 6px;
border-radius: 50%;
background: @phosphor;
box-shadow: 0 0 6px @phosphor;
animation: vt-blink 2s infinite;
}
}


@keyframes vt-blink {
/* Cellules */
0%, 100% { opacity: 1; }
.TablePager td,
50%      { opacity: 0.3; }
.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 */
// PRINT
.TablePager a,
// ============================================================
.mw-statistics-table a { color: #7dff9c !important; }
@media print {
.TablePager a:visited { color: #4ab06a !important; }
.noprint,
.TablePager a:hover { color: #b6ffc6 !important; }
.vt-header,
.vt-sidebar,
.vt-page-tabs,
.vt-scanlines,
.vt-vignette,
.vt-watermark,
.vt-footer {
display: none !important;
}


body {
/* Valeur numérique de statistiques (Spécial:Statistiques) */
background: #fff;
.mw-statistics-numbers,
color: #000;
.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;
}


.firstHeading {
/* Pagination des TablePagers */
color: #000;
.TablePager_nav,
border-bottom: 2px solid #000;
.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;
}


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


// ============================================================
/* Page Spécial:Contributions — fond des lignes */
// RESPONSIVE
.mw-contributions-list li,
// ============================================================
.mw-special-Contributions ul li {
// ── Desktop : burger et overlay cachés ──────────────────────
  border-bottom: 1px solid rgba(125, 255, 156, 0.05) !important;
@media screen and (min-width: 901px) {
  padding: 4px 0 !important;
.vt-burger {
  background: transparent !important;
display: none;
  color: #cce8d4 !important;
}
}
.mw-contributions-list li:hover {
  background: rgba(125, 255, 156, 0.04) !important;
}


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


// Flèches scroll : mobile-only
/* Boutons "annuler" / "défaire" / "rollback" dans les listes */
.vt-scroll-arrow {
.mw-rollback-link a,
display: none !important;
.mw-history-undo a,
}
.mw-changeslist-links a {
// Les wrappers créés par JS doivent disparaître du flux sur desktop
  color: #f5c84a !important;
.vt-user-tools-wrap,
  font-family: 'IBM Plex Mono', monospace !important;
.vt-page-tabs-wrap {
  font-size: 10px !important;
display: contents;
  text-transform: uppercase !important;
}
  letter-spacing: 0.08em !important;
}
}
.mw-rollback-link a:hover,
.mw-history-undo a:hover { color: #ffe080 !important; }


@media screen and (max-width: 1100px) {
/* Journaux (Spécial:Journal) */
#bodyContent, .vt-article {
.mw-logevent-loglines,
padding: 28px 28px 50px;
.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;
}
}


@media screen and (max-width: 900px) {
/* 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;
}


// ── Burger button ────────────────────────────────────────────
/* Différence d'octets (+12 / -45) */
.vt-burger {
.mw-plusminus-pos {
display: flex;
  color: #7dff9c !important;
flex-direction: column;
  font-family: 'IBM Plex Mono', monospace !important;
justify-content: center;
  font-weight: 500 !important;
gap: 5px;
}
width: 40px;
.mw-plusminus-neg {
height: 40px;
  color: #ff7a7a !important;
padding: 8px;
  font-family: 'IBM Plex Mono', monospace !important;
background: transparent;
  font-weight: 500 !important;
border: 1px solid @border;
}
border-radius: 2px;
.mw-plusminus-null {
cursor: pointer;
  color: rgba(125, 255, 156, 0.4) !important;
flex-shrink: 0;
  font-family: 'IBM Plex Mono', monospace !important;
transition: border-color 0.2s, background 0.2s;
}
order: -1;
.mw-plusminus-bold {
margin-left: 12px;
  font-weight: 700 !important;
}


&:hover {
/* ============================================================
border-color: @phosphor;
  50. PAGES FICHIER (Namespace File:) — Spécial:ImagePage
background: @ph-faint;
  ============================================================ */
}
}


.vt-burger-bar {
/* TOC haut de page "Fichier / Historique / Utilisation" */
display: block;
#filetoc,
width: 100%;
ul#filetoc {
height: 1.5px;
  background: rgba(6, 15, 11, 0.85) !important;
background: @text-dim;
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
border-radius: 1px;
  border-radius: 3px !important;
transition: all 0.25s ease;
  color: #cce8d4 !important;
transform-origin: center;
  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; }


// Burger → X quand ouvert
/* Conteneur principal de l'image */
.vt-burger.is-open {
.fullImageLink,
border-color: @phosphor;
#file,
background: @ph-faint;
.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;
}


.vt-burger-bar:nth-child(1) { transform: translateY(6.5px) rotate(45deg); background: @phosphor; }
/* Image elle-même : juste un cadre discret */
.vt-burger-bar:nth-child(2) { opacity: 0; transform: scaleX(0); }
.fullImageLink img,
.vt-burger-bar:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); background: @phosphor; }
#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;
}


// ── Bouton fermer dans le drawer ─────────────────────────────
/* Texte "Pas de plus haute résolution disponible" + lien filename */
.vt-drawer-close {
.mw-filepage-resolutioninfo,
display: block;
.fullMedia {
width: 100%;
  color: rgba(204, 232, 212, 0.65) !important;
padding: 14px 20px;
  font-family: 'IBM Plex Mono', monospace !important;
background: transparent;
  font-size: 11px !important;
border: 0;
  text-align: center !important;
border-bottom: 1px solid @border;
  margin: 8px 0 !important;
color: @text-dim;
  background: transparent !important;
font-family: @font-mono;
}
font-size: 11px;
.fullMedia a,
font-weight: 500;
.mw-filepage-resolutioninfo a {
letter-spacing: 0.12em;
  color: #7dff9c !important;
text-transform: uppercase;
  font-weight: 500 !important;
text-align: left;
  text-decoration: none !important;
cursor: pointer;
  border-bottom: 1px solid rgba(125, 255, 156, 0.25) !important;
transition: color 0.15s, background 0.15s;
}
.fullMedia a:hover {
  color: #b6ffc6 !important;
  border-bottom-color: #7dff9c !important;
}


&::before {
/* Informations sur le fichier (taille, type MIME) */
content: '✕  ';
.fileInfo,
color: @phosphor;
.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;
}


&:hover {
/* Tableau d'historique du fichier */
background: @ph-faint;
table.filehistory,
color: @phosphor;
.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;
}


.vt-drawer-overlay {
/* Vignettes dans le tableau d'historique */
display: block;
.filehistory img,
position: fixed;
.filehistory a img,
inset: 0;
.filehistory .mw-thumbnail-link img {
background: rgba(0, 0, 0, 0.65);
  background: rgba(6, 15, 11, 0.6) !important;
z-index: 999;              // sous .vt-sidebar (1001), au-dessus de tout le reste
  border: 1px solid rgba(125, 255, 156, 0.15) !important;
opacity: 0;
  border-radius: 2px !important;
pointer-events: none;
  padding: 2px !important;
transition: opacity 0.3s ease;
}
-webkit-backdrop-filter: blur(2px);
backdrop-filter: blur(2px);


&.is-open {
/* Liens de date dans l'historique */
opacity: 1;
.filehistory a {
pointer-events: auto; // capture les clics (sinon le contenu derrière reste interactif)
  color: #7dff9c !important;
                      // 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().
  font-size: 11px !important;
}
  text-decoration: none !important;
}
}
.filehistory a:hover { color: #b6ffc6 !important; }


// ── Sidebar → drawer latéral ─────────────────────────────────
/* "Vous ne pouvez pas remplacer ce fichier" / autres messages */
.vt-sidebar {
.mw-filepage-other-versions,
position: fixed !important;
.mw-filepage-upload-error,
top: 0;
.sharedUploadNotice {
left: 0;
  background: rgba(6, 15, 11, 0.6) !important;
width: ~"min(280px, 85vw)"// limite à 85% du viewport sur très petits écrans
   border: 1px solid rgba(245, 200, 74, 0.2) !important;
height: 100%;
  border-left: 3px solid rgba(245, 200, 74, 0.5) !important;
overflow-y: auto;
  color: rgba(204, 232, 212, 0.85) !important;
overflow-x: hidden;
  padding: 10px 14px !important;
z-index: 1001;                // au-dessus de l'overlay (999)
  border-radius: 2px !important;
background: @bg-panel;
  margin: 12px 0 !important;
border-right: 1px solid @border;
  font-style: italic !important;
transform: translateX(-100%);
}
transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
padding-top: 56px;
box-shadow: none;
align-self: auto;


&.is-open {
/* Section "Utilisation du fichier" */
transform: translateX(0);
#mw-imagepage-section-linkstoimage,
box-shadow: 4px 0 32px rgba(0, 0, 0, 0.6);
.mw-imagepage-linkstoimage {
}
  background: transparent !important;
}
}
 
.mw-imagepage-linkstoimage ul,
// Pas de margin-left sur mobile
#mw-imagepage-section-linkstoimage ul {
.vt-page-container {
  background: rgba(6, 15, 11, 0.5) !important;
margin-left: 0 !important;
  border: 1px solid rgba(125, 255, 156, 0.08) !important;
}
  border-radius: 2px !important;
 
  padding: 12px 16px 12px 36px !important;
// Masquer la nav primaire dans le header sur mobile (elle est dans le drawer)
  margin: 8px 0 !important;
.vt-nav-primary {
  list-style: square !important;
display: none;
}
}
.mw-imagepage-linkstoimage li,
 
#mw-imagepage-section-linkstoimage li {
.infobox,
  color: #cce8d4 !important;
.mw-parser-output .infobox {
  padding: 3px 0 !important;
width: 220px;
}
}
.mw-imagepage-linkstoimage li::marker {
 
  color: rgba(125, 255, 156, 0.4) !important;
// ── Header mobile — CSS Grid pour layout fiable ───────────
}
.vt-header {
display: grid !important;
grid-template-areas:
"burger logo"
"usertools usertools"
"search search";
grid-template-columns: 54px 1fr;
grid-template-rows: 52px 36px auto;
height: auto;
padding: 0;
align-items: stretch;
background: @bg-panel !important; // solide sur mobile, pas de blur transparent
backdrop-filter: none !important;
}
 
.vt-burger    { grid-area: burger; display: flex !important; align-self: center; justify-self: center; }
.vt-logo {
grid-area: logo;
height: 52px;
border-right: none;
display: flex;
align-items: center;
justify-content: center;
padding: 0 12px;
}
.vt-logo-link {
justify-content: center;
}
.vt-nav-primary { display: none !important; }
// ── Flèches scroll horizontal génériques (user-tools + page-tabs) ──
.vt-scroll-wrap {
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; }
&::-webkit-scrollbar-track { display: none !important; }
&::-webkit-scrollbar-thumb { display: none !important; }
}
// Pareil pour user-tools
.vt-user-tools {
scrollbar-width: none !important;
-ms-overflow-style: none !important;
 
&::-webkit-scrollbar { display: none !important; width: 0 !important; height: 0 !important; }
&::-webkit-scrollbar-track { display: none !important; }
&::-webkit-scrollbar-thumb { display: none !important; }
}


.vt-scroll-arrow {
/* Métadonnées EXIF (souvent collapsible) */
position: absolute;
.mw_metadata,
top: 0;
table.mw_metadata {
bottom: 0;
  background: rgba(6, 15, 11, 0.6) !important;
width: 28px;
  border: 1px solid rgba(125, 255, 156, 0.1) !important;
display: flex;
  color: #cce8d4 !important;
align-items: center;
  margin: 12px 0 !important;
justify-content: center;
color: rgba(125, 255, 156, 0.6);
font-size: 16px;
font-family: @font-mono;
font-weight: bold;
z-index: 2;
transition: opacity 0.2s ease, color 0.15s ease, background 0.15s ease;
opacity: 1;
background: transparent;
border: 0;
padding: 0;
margin: 0;
cursor: pointer;
-webkit-appearance: none;
appearance: none;
user-select: none;
 
&:hover  { color: @phosphor; }
&:active { color: @phosphor; transform: scale(0.92); }
&:focus-visible {
outline: 1px solid @phosphor;
outline-offset: -2px;
}
 
&.is-left  {
left: 0;
background: linear-gradient(to right, @bg-panel 60%, transparent);
}
&.is-right {
right: 0;
background: linear-gradient(to left, @bg-panel 60%, transparent);
}
&.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; }
.vt-scroll-wrap.is-scroll-end  .vt-scroll-arrow.is-right { opacity: 0; pointer-events: none; }
 
.vt-user-tools {
grid-area: unset !important;
display: block !important;
height: 36px;
width: 100% !important;
max-width: 100% !important;
min-width: 0 !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; }
}
}
 
.mw_metadata th {
@media screen and (max-width: 640px) {
  background: rgba(15, 32, 21, 0.5) !important;
#bodyContent, .vt-article {
  color: rgba(125, 255, 156, 0.65) !important;
padding: 20px 16px 40px;
  font-family: 'IBM Plex Mono', monospace !important;
}
  font-size: 10px !important;
 
  text-transform: uppercase !important;
.firstHeading {
  letter-spacing: 0.08em !important;
font-size: 28px;
  text-align: left !important;
}
  padding: 6px 12px !important;
 
.infobox,
.mw-parser-output .infobox {
float: none;
width: 100%;
margin: 0 0 20px;
}
 
.vt-page-tabs {
padding: 0 12px;
overflow-x: auto;
 
ul {
flex-shrink: 0;
}
}
 
.vt-footer {
padding: 16px;
flex-direction: column;
align-items: flex-start;
}
}
}
 
.mw_metadata td {
// ============================================================
  background: transparent !important;
// NAVIGATION PRINCIPALE (header)
  border-bottom: 1px solid rgba(125, 255, 156, 0.05) !important;
// ============================================================
  color: rgba(204, 232, 212, 0.75) !important;
.vt-nav-primary {
  padding: 6px 12px !important;
display: flex;
  font-size: 12px !important;
align-items: center;
height: 100%;
padding: 0 8px;
gap: 2px;
border-right: 1px solid @border;
overflow-x: auto;
flex-shrink: 1;
}
}


.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;
padding: 0 12px;
height: @header-h;
display: flex;
align-items: center;
text-transform: uppercase;
text-decoration: none;
border-bottom: 2px solid transparent;
white-space: nowrap;
transition: all 0.15s;
 
&:hover {
color: @phosphor;
background: @ph-faint;
text-decoration: none;
}
}
}
 
.mw-editsection a {
// ============================================================
  color: rgba(125, 255, 156, 0.5) !important;
// CODEMIRROR / VE / WIKIEDITOR — fix cursor offset
// Chargé avec le skin (avant init éditeur) — haute spécificité
// 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;
}
}
.mw-editsection a:hover { color: #7dff9c !important; }


// ============================================================
/* Cas spécifique : namespace File: utilise des wikitables pour l'historique
// SCROLL TO TOP
  mais sans la classe wikitable — on cible la table principale du contenu */
// ============================================================
.mw-special-Filepage table:not(.wikitable):not(.va-table):not(.avt-infobox) {
#vt-scroll-top {
  background: rgba(12, 24, 18, 0.85) !important;
position: fixed;
  color: #cce8d4 !important;
bottom: 28px;
right: 24px;
width: 36px;
height: 36px;
background: rgba(6, 15, 11, 0.85);
border: 1px solid rgba(125, 255, 156, 0.25);
color: rgba(125, 255, 156, 0.6);
font-size: 16px;
line-height: 1;
cursor: pointer;
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 {
opacity: 1;
transform: translateY(0);
pointer-events: auto;
}
 
&:hover {
background: rgba(125, 255, 156, 0.1);
border-color: rgba(125, 255, 156, 0.5);
color: #7dff9c;
}
}
}
 
.mw-special-Filepage table:not(.wikitable):not(.va-table):not(.avt-infobox) th {
// ============================================================
  background: #0f2015 !important;
 
  color: #7dff9c !important;
// ============================================================
// TOC SIDEBAR — colonne droite desktop, panneau mobile
// ============================================================
 
// ── Base commune ─────────────────────────────────────────────
.vt-toc-sidebar {
background: linear-gradient(180deg, @bg-panel 0%, @bg 100%);
border-left: 1px solid @border;
overflow-y: auto;
overflow-x: hidden;
z-index: 950;
 
&::-webkit-scrollbar { width: 2px; }
&::-webkit-scrollbar-thumb { background: @ph-border; }
 
// Bouton collapse (desktop) / fermer (mobile)
.vt-toc-collapse-btn {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
padding: 8px 0;
background: transparent;
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 {
color: @phosphor;
background: @ph-faint;
}
}
 
// Titre "SOMMAIRE"
.vt-toc-sidebar-title {
font-family: @font-mono;
font-size: 9px;
font-weight: 500;
letter-spacing: 0.28em;
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
.toc, #toc {
float: none !important;
position: static !important;
width: 100% !important;
max-width: 100% !important;
min-width: 0 !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
border: 0 !important;
border-radius: 0 !important;
font-size: 11px !important;
overflow: visible !important;
}
 
.toctitle { display: none !important; }
 
.toc > ul, #toc > ul {
display: block !important;
padding: 4px 0 !important;
margin: 0 !important;
}
 
.toc ul { list-style: none !important; margin: 0 !important; padding: 0 !important; }
 
.toc li a {
display: flex !important;
align-items: baseline !important;
padding: 5px 16px !important;
font-size: 11px !important;
color: #7aaa88 !important;
font-family: @font-mono !important;
border-left: 2px solid transparent !important;
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 {
color: rgba(125, 255, 156, 0.3) !important;
margin-right: 6px !important;
}
}
}
 
.mw-special-Filepage table:not(.wikitable):not(.va-table):not(.avt-infobox) td {
// ── DESKTOP > 1200px — TOC sticky dans le flux flex (pousse le texte)
  background: transparent !important;
@media screen and (min-width: 1201px) {
  color: #cce8d4 !important;
.vt-toc-sidebar {
  border-bottom: 1px solid rgba(125, 255, 156, 0.06) !important;
// 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)
/* ============================================================
@media screen and (max-width: 1200px) {
  51. MULTIMEDIAVIEWER (MMV) — lightbox d'image + boutons Codex
.vt-content-row {
  → MIGRÉE dans le skin : skinStyles/mmv.less + codex.less
// Reste un flex row même sur mobile pour que le TOC pousse le contenu
  ============================================================ */
display: flex;
/* ============================================================
}
  52. VE DIALOG — fix bande blanche dans le panneau d'édition
 
  → MIGRÉE dans le skin : skinStyles/oojs-ui-windows.less
.vt-toc-sidebar {
  ============================================================ */
position: sticky;
/* ============================================================
top: 0;          // JS override avec header+tabs
  53. CORRECTIONS CIBLÉES — toolbars dialogues, popups, checkboxes
right: 0;
  → MIGRÉE dans le skin : skinStyles/ext.popups.less (bloc 4 ; blocs 1-3, 5, 6 déjà migrés en v42)
height: 100vh;  // JS override avec calc(100vh - top)
  ============================================================ */
width: 32px;    // COLLAPSED PAR DÉFAUT (avant JS)
/* ============================================================
flex-shrink: 0;
  54. WIDGET RECHERCHE VE — vignettes lisibles
overflow: hidden;
  → MIGRÉE dans le skin : skinStyles/mediawiki.widgets.less
transition: width 0.25s ease;
  ============================================================ */
z-index: 800;
/* ============================================================
 
  55. VE — Dialogues modaux au-dessus de la toolbar
// Replié (explicite)
  → MIGRÉE dans le skin : skinStyles/oojs-ui-windows.less
&.is-collapsed {
  ============================================================ */
width: 32px;
/* ============================================================
 
  56. BOUTONS OOUI FRAMED — fond clair par défaut OOUI/Codex
.toc, #toc { display: none !important; }
  → MIGRÉE dans le skin : skinStyles/oojs-ui-core.less
 
  ============================================================ */
.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 29 août 2026 à 13:43

/*
 * MediaWiki:Vaulttec.css — v46
 * Chargé uniquement pour les utilisateurs du skin VaultTec.
 *
 * v46 : retour de l'infobox à 320px. La borne à 42 % de la v45 accompagnait
 * une colonne de lecture de 38rem qui s'est révélée trop étroite pour du
 * vrai contenu de wiki — elle est revenue à 960px, l'infobox n'a donc plus
 * lieu d'être réduite.
 * v44 : correction d'un sélecteur qui mettait TOUTE la page en majuscules
 * pendant la rédaction d'une réponse (voir section 43, DiscussionTools).
 * Les sections 43 et suivantes propres à DiscussionTools peuvent être
 * retirées avec le skin >= 1.13.0, qui apporte skinStyles/
 * ext.discussionTools.less.
 * v43 (optimisation, lot 3 — requiert le skin >= 1.7.2) : sections 13, 16,
 * 31, 33, 41 et le reliquat de la 53 migrés dans le skin ; deux règles de
 * repli du sommaire (section 4) et la largeur de la barre latérale
 * (section 3) supprimées car redondantes avec le skin.
 * v42 (lot 2, skin >= 1.5.0) : sections 19, 37, 51, 54, 55, 56 migrées,
 * 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-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 — style avant exécution du JS
   ============================================================ */
/* skins.vaulttec.scripts déplace le sommaire dans la colonne de droite.
   Ces règles ne s'appliquent donc qu'au premier rendu, ou sans JS.
   Les règles de bascule (.vt-toc-collapsed, flèche ▸) ont été retirées
   en v43 : aucun script ne pose cette classe. */
#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;
  margin: 0 !important; border-bottom: 1px solid rgba(125, 255, 156, 0.12) !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 .toc > 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)
   → MIGRÉE dans le skin : resources/skins.vaulttec/skin.less (bloc RECHERCHE)
   ============================================================ */
/* ============================================================
   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
   → MIGRÉE dans le skin : resources/skins.vaulttec/skin.less (bloc CATÉGORIES)
   ============================================================ */
/* ============================================================
   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
   → MIGRÉE dans le skin : skinStyles/mediawiki.special.preferences.less,
     oojs-ui-core.less (dropdowns, menus, bulles) et
     mediawiki.widgets.datetime.less (champs date, calendriers — les
     sélecteurs .oo-ui-calendarWidget / .mw-widget-DateInputWidget
     utilisés ici n'existaient pas dans MediaWiki et ne s'appliquaient
     à rien ; le skin utilise les vraies classes).
   ============================================================ */
/* ============================================================
   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
   → MIGRÉE dans le skin : resources/skins.vaulttec/skin.less (bloc BOUTON LANGUES)
   ============================================================ */
/* ============================================================
   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)
   → MIGRÉE dans le skin : skinStyles/ext.popups.less
   ============================================================ */
/* ============================================================
   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" textuels.
   NE PAS ajouter .ext-discussiontools-init-replylink-open à ce sélecteur :
   contrairement à ce que son nom suggère, DiscussionTools pose cette classe
   sur le <body>, pas sur un lien, pendant qu'un formulaire de réponse est
   ouvert. Le text-transform: uppercase se propageait alors à TOUTE la page —
   commentaires, titres, texte de l'article — jusqu'à la fermeture du
   formulaire. Mesuré : getComputedStyle(document.body).textTransform
   valait « uppercase » après un clic sur Répondre. */
.ext-discussiontools-init-replylink-reply {
  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 {
  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
   → MIGRÉE dans le skin : skinStyles/ext.popups.less (bloc 4 ; blocs 1-3, 5, 6 déjà migrés en v42)
   ============================================================ */
/* ============================================================
   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
   ============================================================ */