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

Navigation interactive dans l’historique
Dernière version du 29 août 2026 à 12: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
   ============================================================ */
« MediaWiki:Vaulttec.css » : différence entre les versions

Dernière version du 29 août 2026 à 12:43

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