« MediaWiki:Vaulttec.css » : différence entre les versions
Aucun résumé des modifications |
Aucun résumé des modifications |
||
| Ligne 1 : | Ligne 1 : | ||
/* | /* | ||
* MediaWiki:Vaulttec.css — | * MediaWiki:Vaulttec.css — v42 | ||
* Chargé uniquement pour les utilisateurs du skin VaultTec. | * Chargé uniquement pour les utilisateurs du skin VaultTec. | ||
* | * | ||
* | * v42 (optimisation, lot 2 — requiert le skin >= 1.5.0) : sections 19, 37, | ||
* 51, 54, 55, 56 migrées dans le skin (chargement conditionnel), section 53 | |||
* réduite à son bloc (4). Lot 1 (v41, skin 1.4.0) : sections 18, 28, 42, | |||
* | * 44, 45, 52 + partie .mw-highlight de la 46. Les numéros manquants sont | ||
* volontaires — ne pas recréer ces sections ici. | |||
*/ | */ | ||
/* ============================================================ | /* ============================================================ | ||
| Ligne 226 : | Ligne 225 : | ||
/* ============================================================ | /* ============================================================ | ||
19. OOUI — fonds blancs résiduels | 19. OOUI — fonds blancs résiduels | ||
→ MIGRÉE dans le skin : skinStyles/oojs-ui-core.less | |||
============================================================ */ | ============================================================ */ | ||
/* ============================================================ | /* ============================================================ | ||
20. ÉDITEUR — formulaire uniquement (pas de CodeMirror) | 20. ÉDITEUR — formulaire uniquement (pas de CodeMirror) | ||
| Ligne 796 : | Ligne 791 : | ||
/* ============================================================ | /* ============================================================ | ||
37. PAGE RECHERCHE — Special:Recherche | 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, | |||
.mw- | .postedit, | ||
.postedit-container { | |||
background: rgba(8, 18, 12, 0.97) !important; | |||
.mw- | 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; | ||
. | |||
. | |||
background: | |||
border- | |||
color: #cce8d4 !important; | color: #cce8d4 !important; | ||
padding: 12px 16px !important; | |||
backdrop-filter: blur(8px) !important; | |||
-webkit-backdrop-filter: blur(8px) !important; | |||
} | } | ||
.mw- | .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 { | |||
.mw- | border-left: 3px solid #f5c84a !important; | ||
.mw- | border-color: rgba(245, 200, 74, 0.4) !important; | ||
border: | |||
} | } | ||
.mw- | .mw-notification-error, | ||
.mw-notification.mw-notification-type-error { | |||
border- | border-left: 3px solid #ff7a7a !important; | ||
border-color: rgba(255, 122, 122, 0.4) !important; | |||
} | } | ||
.mw-notification p, | |||
.mw-notification div, | |||
.mw- | .mw-notification span, | ||
.mw- | .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- | .mw-notification strong, | ||
.mw- | .mw-notification b { | ||
color: #7dff9c !important; | |||
font-weight: 600 !important; | |||
} | } | ||
.mw-notification a, | |||
.postedit a { | |||
.mw- | color: #7dff9c !important; | ||
. | text-decoration: none !important; | ||
border-bottom: 1px solid rgba(125, 255, 156, 0. | border-bottom: 1px solid rgba(125, 255, 156, 0.3) !important; | ||
} | } | ||
.mw- | .mw-notification a:hover, | ||
.postedit a:hover { | |||
. | color: #b6ffc6 !important; | ||
border-bottom-color: #7dff9c !important; | |||
color: # | |||
} | } | ||
.mw- | .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; } | |||
.mw- | /* ============================================================ | ||
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- | |||
. | |||
.mw- | |||
. | |||
.mw- | |||
.mw- | |||
.mw- | |||
color: # | |||
} | } | ||
.mw- | .mw-parser-output table td a.new:hover, | ||
.mw- | .mw-parser-output .wikitable td a.new:hover { | ||
color: #ff8888 !important; | |||
color: | |||
} | } | ||
/* | /* Liens externes — ambre pour les distinguer des liens internes */ | ||
.mw- | .mw-parser-output a.external, | ||
.mw-parser-output a[rel~="nofollow"] { | |||
color: #f5c84a !important; | |||
} | } | ||
.mw- | .mw-parser-output a.external:visited, | ||
.mw-parser-output a[rel~="nofollow"]:visited { | |||
color: #c9973a !important; | |||
} | } | ||
.mw- | .mw-parser-output a.external:hover, | ||
.mw-parser-output a[rel~="nofollow"]:hover { | |||
color: #ffe080 !important; | |||
.mw- | |||
color: # | |||
} | } | ||
/* | /* Tableaux collapsibles — ne pas bloquer le JS avec !important sur display */ | ||
. | /* Le JS MediaWiki masque les lignes via style="display:none" inline. | ||
.mw- | Toute règle CSS avec !important sur display écrase ce comportement. | ||
.mw- | 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; | background: transparent !important; | ||
border | border: 0 !important; | ||
} | } | ||
.mw-collapsible-toggle a:hover, | |||
.mw-collapsible-toggle:hover { | |||
.mw- | color: #7dff9c !important; | ||
.mw- | background: transparent !important; | ||
} | } | ||
/* | /* Ligne d'en-tête collapsible */ | ||
.mw- | .mw-parser-output .wikitable.mw-collapsible > tbody > tr:first-child > th, | ||
.mw- | .mw-parser-output table.mw-collapsible > tbody > tr:first-child > th { | ||
.mw- | background: rgba(10, 22, 16, 0.95) !important; | ||
.mw- | border-bottom: 1px solid rgba(125, 255, 156, 0.2) !important; | ||
background: | |||
} | } | ||
/* | /* Cellules avec style inline "background: white" ou couleur claire — reset */ | ||
.mw- | .mw-parser-output .wikitable td[style*="background:#fff"], | ||
.mw- | .mw-parser-output .wikitable td[style*="background: #fff"], | ||
.mw- | .mw-parser-output .wikitable td[style*="background:white"], | ||
.mw- | .mw-parser-output .wikitable td[style*="background: white"], | ||
.mw- | .mw-parser-output .wikitable td[style*="background:#FFF"], | ||
.mw- | .mw-parser-output .wikitable td[style*="background: #FFF"] { | ||
color: rgba( | background-color: rgba(12, 24, 18, 0.85) !important; | ||
color: #cce8d4 !important; | |||
} | } | ||
/* | /* Titre de page — ne pas hériter de l'italique des h2 */ | ||
#firstHeading, | |||
.firstHeading { | |||
. | font-style: normal !important; | ||
} | } | ||
/* | /* ============================================================ | ||
41. PAGE PREVIEWS — aperçus au survol des liens (Hovercards) | |||
============================================================ */ | |||
/* | /* Conteneur racine — fond sombre + ombrage phosphore */ | ||
. | .mwe-popups, | ||
. | .mwe-popups.mwe-popups-fade-in-up, | ||
. | .mwe-popups.mwe-popups-fade-in-down, | ||
. | .mwe-popups.mwe-popups-no-image-tri, | ||
background: rgba( | .mwe-popups.mwe-popups-image-tri, | ||
.mwe-popups.mwe-popups-image-pointer, | |||
.mwe-popups.mwe-popups-is-not-tall, | |||
.mwe-popups.mwe-popups-is-tall { | |||
border: 1px solid rgba(125, 255, 156, 0. | background: rgba(8, 18, 12, 0.98) !important; | ||
border-radius: | border: 1px solid rgba(125, 255, 156, 0.25) !important; | ||
border-radius: 3px !important; | |||
box-shadow: 0 8px 28px rgba(0, 0, 0, 0.75), | |||
0 0 12px rgba(125, 255, 156, 0.08) !important; | |||
color: #cce8d4 !important; | color: #cce8d4 !important; | ||
-webkit-backdrop-filter: blur(8px); | |||
backdrop-filter: blur(8px); | |||
} | } | ||
/* | /* Force transparence sur tous les conteneurs internes — | ||
. | neutralise les fonds blancs résiduels (div, a, container) */ | ||
.mwe-popups > div, | |||
. | .mwe-popups > a, | ||
.mwe-popups > a > div, | |||
.mwe-popups .mwe-popups-container, | |||
.mwe-popups .mwe-popups-extract, | |||
.mwe-popups .mwe-popups-extract p, | |||
.mwe-popups .mwe-popups-discreet, | |||
. | .mwe-popups .mwe-popups-scroll, | ||
. | .mwe-popups .mwe-popups-body { | ||
background-color: transparent !important; | |||
. | |||
. | |||
. | |||
color: | |||
} | } | ||
/* | /* Lien englobant (<a>) cliquable — fond blanc natif neutralisé */ | ||
. | .mwe-popups a, | ||
. | .mwe-popups a:link, | ||
.mwe-popups a:visited, | |||
.mwe-popups a:hover { | |||
background: transparent !important; | |||
. | |||
color: #cce8d4 !important; | color: #cce8d4 !important; | ||
text-decoration: none !important; | |||
} | } | ||
/* | /* Pointe (triangle) — masquer la version blanche par défaut */ | ||
. | .mwe-popups.flipped-x::before, | ||
. | .mwe-popups.flipped-y::before, | ||
.mwe-popups.flipped-x-y::before, | |||
.mwe-popups::before, | |||
.mwe-popups.flipped-x::after, | |||
.mwe-popups.flipped-y::after, | |||
.mwe-popups.flipped-x-y::after, | |||
.mwe-popups::after { | |||
border-color: transparent !important; | |||
display: none !important; | |||
} | } | ||
. | |||
/* Titre de l'article dans le popup */ | |||
.mwe-popups .mwe-popups-title, | |||
. | .mwe-popups h3, | ||
color: # | .mwe-popups .mwe-popups-extract h3 { | ||
font-family: ' | color: #7dff9c !important; | ||
font-size: | font-family: 'Instrument Serif', Georgia, serif !important; | ||
font-style: italic !important; | |||
font-size: 1.1rem !important; | |||
font-weight: normal !important; | |||
border: 0 !important; | |||
margin: 0 0 6px 0 !important; | |||
padding: 0 !important; | |||
} | } | ||
/* | /* Indicateur de type d'article (icône à côté du titre) */ | ||
. | .mwe-popups .mwe-popups-title .mw-ui-icon { | ||
.mw | filter: brightness(0) saturate(100%) invert(91%) sepia(15%) | ||
saturate(594%) hue-rotate(76deg) brightness(101%) !important; | |||
opacity: 0.65 !important; | |||
} | } | ||
. | /* Extrait / résumé textuel */ | ||
.mwe-popups .mwe-popups-extract { | |||
color: #cce8d4 !important; | |||
font-family: 'Crimson Pro', Georgia, serif !important; | |||
font-size: 14px !important; | |||
line-height: 1.5 !important; | |||
padding: 14px 16px !important; | |||
} | } | ||
/* | /* Variante "discreet" : titre seul, sans extrait */ | ||
. | .mwe-popups .mwe-popups-discreet { | ||
. | padding: 10px 14px !important; | ||
padding: | |||
} | } | ||
. | |||
. | /* Conteneur de la miniature (image d'aperçu) */ | ||
background: | .mwe-popups .mwe-popups-thumbnail, | ||
.mwe-popups .mwe-popups-thumbnail-link, | |||
.mwe-popups svg.mwe-popups-thumbnail { | |||
background: rgba(6, 15, 11, 0.6) !important; | |||
border-bottom: 1px solid rgba(125, 255, 156, 0.12) !important; | |||
} | } | ||
. | |||
. | /* Filtre teinte phosphore sur la miniature pour rester dans le ton */ | ||
/* NOTE : neutralisé plus bas (section 53-(4)) — conservé pour historique. */ | |||
.mwe-popups .mwe-popups-thumbnail image, | |||
.mwe-popups svg.mwe-popups-thumbnail image { | |||
filter: brightness(0.92) saturate(0.9) hue-rotate(-8deg) !important; | |||
} | } | ||
/* | /* Aperçus "désambiguïsation" / page d'homonymie */ | ||
. | .mwe-popups.mwe-popups-type-disambiguation { | ||
border-color: rgba(245, 200, 74, 0.35) !important; | |||
border | |||
} | } | ||
. | .mwe-popups.mwe-popups-type-disambiguation .mwe-popups-title { | ||
. | color: #f5c84a !important; | ||
color: # | |||
} | } | ||
/* | /* Aperçus "lien rouge" (page inexistante) */ | ||
. | .mwe-popups.mwe-popups-type-generic { | ||
border-color: rgba(255, 122, 122, 0.35) !important; | |||
} | } | ||
.mwe-popups.mwe-popups-type-generic .mwe-popups-title { | |||
color: #ff7a7a !important; | |||
. | |||
} | } | ||
/* | /* Barre du bas : paramètres + lien "lire la suite" */ | ||
. | .mwe-popups .mwe-popups-settings, | ||
.mwe-popups footer, | |||
background: rgba( | .mwe-popups .mwe-popups-read-link { | ||
border- | background: rgba(6, 15, 11, 0.6) !important; | ||
border-top: 1px solid rgba(125, 255, 156, 0.12) !important; | |||
padding: 8px 14px !important; | |||
} | } | ||
/* | /* Lien "lire la suite" */ | ||
.mw- | .mwe-popups .mwe-popups-read-link { | ||
color: #4ab06a !important; | |||
.mw- | font-family: 'IBM Plex Mono', monospace !important; | ||
background: rgba( | font-size: 10px !important; | ||
border: 1px solid rgba(125, 255, 156, 0. | text-transform: uppercase !important; | ||
letter-spacing: 0.12em !important; | |||
text-decoration: none !important; | |||
} | |||
.mwe-popups .mwe-popups-read-link:hover { | |||
color: #7dff9c !important; | |||
} | |||
/* Icône engrenage des paramètres */ | |||
.mwe-popups .mwe-popups-settings-icon, | |||
.mwe-popups .mw-ui-icon-popups-settings { | |||
filter: brightness(0) saturate(100%) invert(72%) sepia(20%) | |||
saturate(400%) hue-rotate(76deg) brightness(100%) !important; | |||
opacity: 0.45 !important; | |||
transition: opacity 0.15s !important; | |||
} | |||
.mwe-popups .mwe-popups-settings-icon:hover, | |||
.mwe-popups .mw-ui-icon-popups-settings:hover { | |||
opacity: 1 !important; | |||
} | |||
/* Dialogue des paramètres Page Previews (Spécial:Préférences modal) */ | |||
.mwe-popups-settings .oo-ui-window-frame, | |||
.mw-popups-settings .oo-ui-window-frame { | |||
background: rgba(10, 20, 15, 0.98) !important; | |||
border: 1px solid rgba(125, 255, 156, 0.2) !important; | |||
} | } | ||
/* ============================================================ | /* ============================================================ | ||
42. DIFF VIEW — comparaison de versions | |||
→ MIGRÉE dans le skin : skinStyles/mediawiki.diff.less | |||
============================================================ */ | |||
/* ============================================================ | |||
43. DISCUSSIONTOOLS — pages de discussion modernes | |||
============================================================ */ | ============================================================ */ | ||
. | |||
. | /* Boutons "Répondre", "Souscrire", "Ajouter un sujet" */ | ||
. | .ext-discussiontools-init-replylink-buttons .oo-ui-buttonElement-button, | ||
. | .ext-discussiontools-init-section-subscribeButton .oo-ui-buttonElement-button, | ||
background: rgba( | .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. | border-color: rgba(125, 255, 156, 0.5) !important; | ||
color: #7dff9c !important; | |||
} | } | ||
. | |||
. | /* Icônes des boutons */ | ||
.ext-discussiontools-init-replylink-buttons .oo-ui-iconElement-icon, | |||
.ext-discussiontools-init-section-subscribeButton .oo-ui-iconElement-icon { | |||
filter: brightness(0) saturate(100%) invert(91%) sepia(15%) saturate(594%) hue-rotate(76deg) brightness(101%) !important; | |||
opacity: 0.65 !important; | |||
} | } | ||
. | |||
. | /* Liens "Répondre" / "Modifier" textuels (legacy) */ | ||
.ext-discussiontools-init-replylink-reply, | |||
.ext-discussiontools-init-replylink-open { | |||
color: #4ab06a !important; | |||
font-family: 'IBM Plex Mono', monospace !important; | |||
font-size: 11px !important; | |||
text-transform: uppercase !important; | |||
letter-spacing: 0.08em !important; | |||
text-decoration: none !important; | |||
} | } | ||
. | .ext-discussiontools-init-replylink-reply:hover, | ||
. | .ext-discussiontools-init-replylink-open:hover { | ||
color: #7dff9c !important; | color: #7dff9c !important; | ||
} | } | ||
. | |||
. | /* Conteneur d'une section commentée */ | ||
.ext-discussiontools-init-section, | |||
.ext-discussiontools-init-highlight, | |||
border- | .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 { | |||
border- | 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 { | ||
color: # | 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; | |||
color: # | 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 | |||
============================================================ */ | |||
.mw- | /* ============================================================ | ||
.mw- | 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-family: 'IBM Plex Mono', monospace !important; | ||
font-size: | 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; | background: transparent !important; | ||
border: 0 !important; | border: 0 !important; | ||
margin: 16px 0 !important; | |||
} | } | ||
/* | /* Barre d'onglets */ | ||
. | .tabber__header, | ||
. | .tabber__tabs { | ||
background: rgba( | background: rgba(6, 15, 11, 0.6) !important; | ||
border-bottom: 1px solid rgba(125, 255, 156, 0.2) !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; | ||
background | 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; | |||
. | |||
. | |||
background: | |||
border: | |||
color: #cce8d4 !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; | 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; | |||
border: 0 !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; | |||
. | |||
background: | |||
} | } | ||
/* | /* 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, | ||
border | .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; | ||
background: | |||
} | } | ||
.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, | ||
.mw- | table.TablePager, | ||
background: rgba( | table.mw-spcontent, | ||
border: 1px solid rgba(125, 255, 156, 0. | .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; | ||
. | |||
background: | |||
border: 1px solid rgba(125, 255, 156, 0.2) !important; | |||
color: | |||
font-family: 'IBM Plex Mono', monospace !important; | font-family: 'IBM Plex Mono', monospace !important; | ||
font-size: 10px !important; | font-size: 10px !important; | ||
font-weight: 500 !important; | |||
text-transform: uppercase !important; | text-transform: uppercase !important; | ||
letter-spacing: 0.1em !important; | letter-spacing: 0.1em !important; | ||
padding: 10px 12px !important; | |||
padding: | 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; | |||
. | |||
background: rgba(125, 255, 156, 0. | |||
} | } | ||
/* | /* Cellules */ | ||
. | .TablePager td, | ||
background: | .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; | font-family: 'IBM Plex Mono', monospace !important; | ||
font- | 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. | background: rgba(6, 15, 11, 0.6) !important; | ||
border: 1px solid rgba(125, 255, 156, 0. | border: 1px solid rgba(125, 255, 156, 0.1) !important; | ||
border-radius: | border-radius: 2px !important; | ||
padding: 12px !important; | padding: 8px 12px !important; | ||
margin: 8px 0 !important; | margin: 8px 0 !important; | ||
color: rgba(204, 232, 212, 0.7) !important; | |||
font-family: 'IBM Plex Mono', monospace !important; | font-family: 'IBM Plex Mono', monospace !important; | ||
font-size: 11px !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; | text-transform: uppercase !important; | ||
letter-spacing: 0. | 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. | background: rgba(125, 255, 156, 0.1) !important; | ||
border-color: | border-color: rgba(125, 255, 156, 0.4) !important; | ||
color: #7dff9c !important; | |||
} | } | ||
/* | /* Filtres en haut des pagers */ | ||
. | .mw-pager-body, | ||
.mw-pager-tools, | |||
background: | .mw-htmlform-ooui-wrapper { | ||
border | 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- | .mw-userlink, | ||
.mw- | .mw-changeslist-line .mw-userlink { | ||
color: #7dff9c !important; | |||
font-weight: 500 !important; | |||
color: # | |||
font- | |||
} | } | ||
.mw-userlink:hover { color: #b6ffc6 !important; } | |||
/* | /* Boutons "annuler" / "défaire" / "rollback" dans les listes */ | ||
.mw- | .mw-rollback-link a, | ||
.mw- | .mw-history-undo a, | ||
.mw-changeslist-links a { | |||
color: #f5c84a !important; | |||
color: # | |||
font-family: 'IBM Plex Mono', monospace !important; | font-family: 'IBM Plex Mono', monospace !important; | ||
font-size: | 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 { | |||
. | |||
. | |||
.mw- | |||
background: transparent !important; | background: transparent !important; | ||
border: 0 !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; | color: rgba(125, 255, 156, 0.5) !important; | ||
font-family: 'IBM Plex Mono', monospace !important; | font-family: 'IBM Plex Mono', monospace !important; | ||
font-size: 11px !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; | 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; | 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. | background: rgba(6, 15, 11, 0.85) !important; | ||
border: 1px solid rgba(125, 255, 156, 0.15) !important; | border: 1px solid rgba(125, 255, 156, 0.15) !important; | ||
border-radius: 3px !important; | border-radius: 3px !important; | ||
color: #cce8d4 !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-family: 'IBM Plex Mono', monospace !important; | ||
font-size: 10px !important; | font-size: 10px !important; | ||
text-transform: uppercase !important; | text-transform: uppercase !important; | ||
letter-spacing: 0. | letter-spacing: 0.12em !important; | ||
text-align: center !important; | |||
border | 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 */ | ||
.mw- | .fullImageLink, | ||
background: | #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; | 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- | .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- | .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; | ||
border | |||
} | } | ||
/* | /* Informations sur le fichier (taille, type MIME) */ | ||
.mw- | .fileInfo, | ||
.mw- | .mw-filepage-mime, | ||
.mw-filepage-dimensions { | |||
color: rgba(204, 232, 212, 0.6) !important; | |||
font-family: 'IBM Plex Mono', monospace !important; | font-family: 'IBM Plex Mono', monospace !important; | ||
font-size: 11px !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; | ||
background: | border-collapse: collapse !important; | ||
width: 100% !important; | |||
border: | 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; | ||
background: rgba(125, 255, 156, 0. | 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; | |||
background: rgba(255, | |||
} | } | ||
/* | /* 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; | |||
. | |||
. | |||
. | |||
.mw- | |||
background: rgba(6, 15, 11, 0. | |||
border: 1px solid rgba(125, 255, 156, 0.15) !important; | border: 1px solid rgba(125, 255, 156, 0.15) !important; | ||
border- | border-radius: 2px !important; | ||
padding: 2px !important; | |||
} | } | ||
/* | /* Liens de date dans l'historique */ | ||
. | .filehistory a { | ||
color: #7dff9c !important; | color: #7dff9c !important; | ||
font-family: 'IBM Plex Mono', monospace !important; | font-family: 'IBM Plex Mono', monospace !important; | ||
font-size: | font-size: 11px !important; | ||
text-decoration: none !important; | |||
text- | |||
} | } | ||
.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; | 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 { | |||
table. | background: rgba(6, 15, 11, 0.6) !important; | ||
background: | border: 1px solid rgba(125, 255, 156, 0.1) !important; | ||
border: 0 !important; | |||
color: #cce8d4 !important; | color: #cce8d4 !important; | ||
padding: | margin: 12px 0 !important; | ||
font-size: | } | ||
.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 dans | /* Liens de section [modifier | modifier le wikicode] dans pages File: */ | ||
.mw-editsection-bracket { | |||
.mw- | color: rgba(125, 255, 156, 0.3) !important; | ||
. | } | ||
.mw-editsection a { | |||
color: rgba(125, 255, 156, 0.5) !important; | |||
.mw- | |||
} | } | ||
.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- | .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 { | |||
.mw- | background: #0f2015 !important; | ||
color: #7dff9c !important; | |||
} | } | ||
.mw-special-Filepage table:not(.wikitable):not(.va-table):not(.avt-infobox) td { | |||
.mw- | |||
. | |||
background: transparent !important; | background: transparent !important; | ||
color: #cce8d4 !important; | color: #cce8d4 !important; | ||
border-bottom: 1px solid rgba(125, 255, 156, 0.06) !important; | |||
} | } | ||
/* | /* ============================================================ | ||
. | 51. MULTIMEDIAVIEWER (MMV) — lightbox d'image + boutons Codex | ||
→ MIGRÉE dans le skin : skinStyles/mmv.less + codex.less | |||
============================================================ */ | |||
/* ============================================================ | |||
52. VE DIALOG — fix bande blanche dans le panneau d'édition | |||
. | → MIGRÉE dans le skin : skinStyles/oojs-ui-windows.less | ||
============================================================ */ | |||
/* ============================================================ | |||
53. CORRECTIONS CIBLÉES — toolbars dialogues, popups, checkboxes | |||
============================================================ */ | |||
/* Blocs (1), (2), (6) migrés dans skinStyles/ve-overrides.less ; | |||
bloc (3) dans skinStyles/oojs-ui-core.less + codex.less ; | |||
bloc (5) dans skinStyles/mediawiki.widgets.less. | |||
Ne reste ici que le bloc (4), qui surcharge la section 41. */ | |||
/* | /* ─── (4) Popups d'aperçu d'article : retirer le filtre hue-rotate ─── | ||
. | Le filtre hue-rotate(-8deg) sur les miniatures donnait une teinte | ||
. | vert pomme indistincte aux images. À retirer pour garder les couleurs | ||
. | d'origine. */ | ||
.mwe-popups .mwe-popups-thumbnail image, | |||
.mwe-popups svg.mwe-popups-thumbnail image { | |||
filter: none !important; | |||
} | } | ||
/* ============================================================ | /* ============================================================ | ||
54. WIDGET RECHERCHE VE — vignettes lisibles | |||
→ MIGRÉE dans le skin : skinStyles/mediawiki.widgets.less | |||
============================================================ */ | |||
/* ============================================================ | |||
55. VE — Dialogues modaux au-dessus de la toolbar | |||
→ MIGRÉE dans le skin : skinStyles/oojs-ui-windows.less | |||
============================================================ */ | |||
/* ============================================================ | |||
56. BOUTONS OOUI FRAMED — fond clair par défaut OOUI/Codex | |||
→ MIGRÉE dans le skin : skinStyles/oojs-ui-core.less | |||
============================================================ */ | ============================================================ */ | ||
/* ============================================================ | /* ============================================================ | ||
57. BANDEAU DISCORD — barre fixe en bas de page | 57. BANDEAU DISCORD — barre fixe en bas de page | ||
Dernière version du 10 juin 2026 à 23:58
/*
* MediaWiki:Vaulttec.css — v42
* Chargé uniquement pour les utilisateurs du skin VaultTec.
*
* v42 (optimisation, lot 2 — requiert le skin >= 1.5.0) : sections 19, 37,
* 51, 54, 55, 56 migrées dans le skin (chargement conditionnel), section 53
* réduite à son bloc (4). Lot 1 (v41, skin 1.4.0) : sections 18, 28, 42,
* 44, 45, 52 + partie .mw-highlight de la 46. Les numéros manquants sont
* volontaires — ne pas recréer ces sections ici.
*/
/* ============================================================
1. VARIABLES
============================================================ */
:root {
--background-color-dp-00: #06100b;
--background-color-dp-01: #0a1a0f;
--background-color-dp-02: #0f2015;
--background-color-dp-03: #11251a;
--background-color-dp-04: #142b1e;
--background-color-dp-06: #173122;
--background-color-dp-08: #1a3727;
--background-color-dp-12: #1e3f2c;
--background-color-dp-16: #214531;
--background-color-dp-24: #254c36;
--background-img: none;
--background-main: transparent;
--box-background-color: rgba(12, 24, 18, 0.85);
--box-shadow: 0 0 10px rgba(125, 255, 156, 0.12);
--color-base: #cce8d4;
--color-warning: #f5c84a;
--color-link: #4ab06a;
--color-link-visited: #357a4d;
--border-color-base: rgba(125, 255, 156, 0.15);
}
/* ============================================================
2. BODY & CONTAINERS
============================================================ */
body { background: #06100b !important; background-image: none !important; }
.mw-page-container { background: transparent !important; border: none !important; max-width: 100% !important; padding: 0 !important; }
/* ============================================================
3. LAYOUT
============================================================ */
.vt-page-container { display: flex !important; width: 100% !important; align-items: flex-start !important; min-height: calc(100vh - 54px) !important; }
.vt-sidebar, #mw-panel { width: 220px !important; flex-shrink: 0 !important; }
.vt-content-container, #content { flex: 1 1 auto !important; min-width: 0 !important; width: 0 !important; }
#bodyContent { max-width: none !important; width: 100% !important; padding: 28px 36px 60px !important; }
/* ============================================================
4. TOC — rétractable, replié par défaut
============================================================ */
/* NOTE (audit) : les styles de toggle ci-dessous (.toctitle cliquable,
flèche ▸, états .vt-toc-collapsed) supposent un JS qui bascule la
classe au clic — ce JS n'existe ni dans le skin ni dans
MediaWiki:Vaulttec.js. En pratique le TOC est déplacé dans la colonne
de droite par skins.vaulttec.scripts ; ces règles ne s'appliquent
qu'avant l'exécution du JS (ou sans JS). Conservées pour compat. */
#mw-content-text .toc, #mw-content-text #toc {
float: none !important; clear: both !important; position: static !important;
width: fit-content !important; max-width: min(300px, 100%) !important; min-width: 160px !important;
margin: 0 0 20px 0 !important; padding: 0 !important;
background: rgba(6, 15, 11, 0.88) !important; border: 1px solid rgba(125, 255, 156, 0.15) !important;
border-radius: 3px !important; overflow: hidden !important; box-sizing: border-box !important; font-size: 12px !important;
}
#mw-content-text .toctitle, #mw-content-text .toc .toctitle {
display: flex !important; align-items: center !important; justify-content: space-between !important;
gap: 16px !important; padding: 8px 14px !important; cursor: pointer !important;
user-select: none !important; margin: 0 !important; border-bottom: 1px solid transparent !important; white-space: nowrap !important;
}
#mw-content-text .toctitle h2, #mw-content-text .toc .toctitle h2 {
font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; font-weight: 500 !important;
text-transform: uppercase !important; letter-spacing: 0.12em !important;
color: rgba(125, 255, 156, 0.65) !important; margin: 0 !important; padding: 0 !important; border: 0 !important;
}
#mw-content-text .toctitle::after { content: '▸'; color: rgba(125, 255, 156, 0.4); font-size: 9px; flex-shrink: 0; transition: transform 0.2s ease; }
#mw-content-text .toc:not(.vt-toc-collapsed) .toctitle { border-bottom-color: rgba(125, 255, 156, 0.12) !important; }
#mw-content-text .toc:not(.vt-toc-collapsed) .toctitle::after { transform: rotate(90deg); }
#mw-content-text .toc.vt-toc-collapsed > ul { display: none !important; }
#mw-content-text .toc:not(.vt-toc-collapsed) > ul { display: block !important; padding: 6px 0 8px !important; margin: 0 !important; }
#mw-content-text .toc ul { list-style: none !important; margin: 0 !important; padding: 0 !important; }
#mw-content-text .toc li a {
display: flex !important; align-items: baseline !important; padding: 4px 14px !important;
font-size: 11px !important; color: #7aaa88 !important; font-family: 'IBM Plex Mono', monospace !important;
border-left: 2px solid transparent !important; transition: all 0.15s !important; text-decoration: none !important; white-space: nowrap !important;
}
#mw-content-text .toc li a:hover { color: #7dff9c !important; background: rgba(125, 255, 156, 0.08) !important; border-left-color: #4ab06a !important; }
#mw-content-text .toc li li a { padding-left: 24px !important; font-size: 10px !important; color: rgba(125, 255, 156, 0.4) !important; }
.tocnumber { color: rgba(125, 255, 156, 0.35) !important; margin-right: 6px !important; }
/* ============================================================
5. INFOBOX
============================================================ */
.avt-infobox, .mw-parser-output .avt-infobox {
width: 320px !important; max-width: 100% !important; float: right !important; clear: right !important;
margin: 0 0 1em 1.5em !important; box-sizing: border-box !important;
background-color: rgba(12, 24, 18, 0.9) !important; border-color: rgba(125, 255, 156, 0.2) !important;
box-shadow: 0 0 10px rgba(125, 255, 156, 0.12) !important; color: #cce8d4 !important;
}
@media screen and (max-width: 720px) {
.avt-infobox, .mw-parser-output .avt-infobox { width: 100% !important; float: none !important; clear: both !important; margin: 0 0 1em 0 !important; }
}
.avt-infobox-header { background-color: #142b1e !important; border-color: rgba(125, 255, 156, 0.2) !important; color: #7dff9c !important; }
.avt-infobox p.bloc, .avt-infobox caption { background-color: #142b1e !important; color: #7dff9c !important; }
.avt-infobox th[scope="row"] { color: #4ab06a !important; }
.avt-infobox td { color: #cce8d4 !important; }
.infobox-default-image { background-image: url("/images/1/11/Logo_wiki_LAVT_vert.png") !important; }
.avt-infobox caption, .mw-parser-output .avt-infobox caption { display: table-caption !important; width: 100% !important; box-sizing: border-box !important; }
/* ============================================================
6. WIKITABLE
============================================================ */
.wikitable, .va-table, .mw-datatable { background-color: rgba(12, 24, 18, 0.85) !important; border-color: rgba(125, 255, 156, 0.15) !important; color: #cce8d4 !important; }
.wikitable > tr > th, .wikitable > * > tr > th, .va-table > tr > th, .va-table > * > tr > th { background-color: #0f2015 !important; color: #7dff9c !important; }
.wikitable > tr > td, .wikitable > * > tr > td, .va-table > tr > td, .va-table > * > tr > td { border-color: rgba(125, 255, 156, 0.1) !important; color: #cce8d4 !important; }
.wikitable tr:hover td { background-color: rgba(125, 255, 156, 0.06) !important; }
/* ============================================================
7. PALETTES & NAVBOXES
============================================================ */
.palette { background-color: rgba(12, 24, 18, 0.85) !important; border-color: rgba(125, 255, 156, 0.15) !important; color: #cce8d4 !important; }
.palette-titre, .palette-banniere, .palette-section, .palette-groupe { background-color: #0f2015 !important; color: #7dff9c !important; }
.palette-pair { background-color: transparent !important; }
.va-infobox-title, .va-navbox-title { background: #0f2015 !important; color: #7dff9c !important; }
/* ============================================================
8. BOÎTES GÉNÉRIQUES
============================================================ */
.avt-warn-banner, .avt-note-banner, .avt-section-banner, .avt-dropdown-box, .avt-genericbox,
.homepage-box, .spinoff-box, .avt-content-game-box { background-color: rgba(12, 24, 18, 0.85) !important; border-color: rgba(125, 255, 156, 0.15) !important; color: #cce8d4 !important; }
.avt-dropdown-box-title { background-color: #0f2015 !important; color: #7dff9c !important; }
/* Espacement réduit entre bandeaux d'avertissement consécutifs */
.mw-parser-output .avt-warn-banner,
.mw-parser-output .avt-note-banner,
.mw-parser-output .avt-section-banner {
background-color: rgba(12, 24, 18, 0.85) !important;
border: 1px solid rgba(125, 255, 156, 0.15) !important;
color: #cce8d4 !important;
margin-bottom: 4px !important;
box-shadow: none !important;
}
/* ============================================================
9. LIENS
============================================================ */
.mw-parser-output a { color: #4ab06a; }
.mw-parser-output a:visited { color: #357a4d; }
.mw-parser-output a:hover { color: #7dff9c; }
.new, a.new { color: #ff5e5e !important; }
/* ============================================================
10. TOC VECTOR 2022
============================================================ */
.sidebar-toc, .vector-toc { background-color: rgba(12, 24, 18, 0.85) !important; border-color: rgba(125, 255, 156, 0.15) !important; }
.vector-toc .vector-toc-link, .sidebar-toc .sidebar-toc-link { color: #4ab06a !important; }
.vector-toc .vector-toc-link:hover, .sidebar-toc .sidebar-toc-link:hover { color: #7dff9c !important; }
/* ============================================================
11. PORTAILS & ACCUEIL
============================================================ */
.homepage-box-title, .portal-box-title, .spinoff-box-title, .canceled-box-title, .fangame-box-title,
.homepage-presentation-title, .homepage-participation-title, .homepage-articleday-title {
color: #7dff9c !important; text-shadow: 0 0 8px rgba(125, 255, 156, 0.4) !important; border-color: rgba(125, 255, 156, 0.15) !important;
}
/* ============================================================
12. SITENOTICE
============================================================ */
.avt-sitenotice { background-color: rgba(12, 24, 18, 0.9) !important; border-color: rgba(125, 255, 156, 0.2) !important; color: #cce8d4 !important; }
/* ============================================================
13. RECHERCHE — dropdown miniatures (header)
============================================================ */
.vt-search { position: relative !important; }
.vt-search-dropdown { display: none; position: absolute; top: calc(100% + 2px); left: 0; width: 420px; max-width: calc(100vw - 40px); background: rgba(8, 18, 12, 0.98); border: 1px solid rgba(125, 255, 156, 0.2); border-top: none; z-index: 500; box-shadow: 0 12px 32px rgba(0, 0, 0, 0.7); backdrop-filter: blur(8px); }
.vt-search-item { display: flex; align-items: center; gap: 12px; padding: 9px 14px; color: #cce8d4; text-decoration: none !important; border-bottom: 1px solid rgba(125, 255, 156, 0.07); font-family: 'Crimson Pro', Georgia, serif; font-size: 15px; transition: background 0.1s; }
.vt-search-item:hover { background: rgba(125, 255, 156, 0.07); color: #7dff9c !important; text-decoration: none !important; }
.vt-search-thumb { width: 40px; height: 40px; flex-shrink: 0; background: rgba(125, 255, 156, 0.05); border: 1px solid rgba(125, 255, 156, 0.12); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.vt-search-thumb img { width: 40px; height: 40px; object-fit: cover; display: block; }
.vt-search-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vt-search-title mark { background: none; color: #7dff9c; font-weight: 700; }
.vt-search-footer { display: block; padding: 10px 14px; font-family: 'IBM Plex Mono', monospace; font-size: 10px; letter-spacing: 0.1em; color: rgba(125, 255, 156, 0.4); text-decoration: none !important; text-transform: uppercase; border-top: 1px dashed rgba(125, 255, 156, 0.1); background: rgba(125, 255, 156, 0.02); }
.vt-search-footer:hover { color: #7dff9c !important; background: rgba(125, 255, 156, 0.06); text-decoration: none !important; }
/* ============================================================
14. BOUTON RECHERCHE — loupe
============================================================ */
.vt-search input.searchButton, .vt-search #searchButton { text-indent: -9999px !important; overflow: hidden !important; width: 42px !important; min-width: 42px !important; padding: 0 !important; flex-shrink: 0 !important; background-color: rgba(125, 255, 156, 0.10) !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%237dff9c' d='M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: center !important; background-size: 18px !important; border: 1px solid rgba(125, 255, 156, 0.35) !important; cursor: pointer !important; }
.vt-search input.searchButton:hover, .vt-search #searchButton:hover { background-color: rgba(125, 255, 156, 0.2) !important; }
/* ============================================================
15. DARK MODE — icône parasite
============================================================ */
.ext-darkmode-link::before, .ext-darkmode-link:before { display: none !important; content: none !important; }
/* ============================================================
16. CATÉGORIES
============================================================ */
#catlinks { background-color: rgba(12, 24, 18, 0.85) !important; border-top: 1px solid rgba(125, 255, 156, 0.15) !important; border-bottom: none !important; padding: 10px 36px !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; letter-spacing: 0.1em !important; color: #7aaa88 !important; }
#catlinks a { color: #4ab06a !important; text-decoration: none !important; text-transform: uppercase !important; letter-spacing: 0.12em !important; font-size: 10px !important; }
#catlinks a:hover { color: #7dff9c !important; }
#mw-normal-catlinks > a:first-child { display: none !important; }
#catlinks ul { display: inline !important; list-style: none !important; margin: 0 !important; padding: 0 !important; }
#catlinks ul li { display: inline !important; }
#catlinks ul li::before { content: '·' !important; margin: 0 6px !important; color: rgba(125, 255, 156, 0.25) !important; }
#catlinks.catlinks-allhidden { display: none !important; }
/* ============================================================
17. TITRES — structure MW 1.44+, sizing fluide responsive
============================================================ */
.mw-parser-output .mw-heading { display: flex !important; align-items: baseline !important; border-bottom: 1px solid rgba(125, 255, 156, 0.13) !important; margin: 22px 0 10px !important; padding-bottom: 6px !important; }
.mw-parser-output .mw-heading h2, .mw-parser-output > h2 { display: block !important; flex: 1 !important; border-bottom: 0 !important; margin: 0 !important; padding-bottom: 0 !important; font-family: 'Instrument Serif', Georgia, serif !important; font-style: italic !important; font-size: clamp(1.25rem, 1.05rem + 1vw, 1.625rem) !important; line-height: 1.25 !important; color: #cce8d4 !important; text-align: left !important; }
.mw-parser-output .mw-heading h3, .mw-parser-output > h3 { font-size: clamp(0.95rem, 0.85rem + 0.5vw, 1.1rem) !important; line-height: 1.3 !important; margin: 0 !important; flex: 1 !important; }
.mw-parser-output .mw-heading h4, .mw-parser-output > h4 { font-size: clamp(0.875rem, 0.8rem + 0.3vw, 1rem) !important; line-height: 1.3 !important; margin: 0 !important; flex: 1 !important; }
.mw-parser-output .mw-heading h5, .mw-parser-output > h5, .mw-parser-output .mw-heading h6, .mw-parser-output > h6 { font-size: 0.9rem !important; line-height: 1.3 !important; margin: 0 !important; flex: 1 !important; }
.mw-parser-output .mw-heading .mw-editsection { flex-shrink: 0 !important; margin-left: 12px !important; }
.mw-parser-output .mw-heading-3, .mw-parser-output .mw-heading-4, .mw-parser-output .mw-heading-5, .mw-parser-output .mw-heading-6 { margin: 16px 0 8px !important; padding-bottom: 4px !important; }
.mw-parser-output .mw-heading + .mw-heading { margin-top: 6px !important; }
/* ============================================================
18. MODIFICATIONS RÉCENTES — filtres OOUI + légende
→ MIGRÉE dans le skin : skinStyles/mediawiki.rcfilters.less + mediawiki.special.changeslist.less
============================================================ */
/* ============================================================
19. OOUI — fonds blancs résiduels
→ MIGRÉE dans le skin : skinStyles/oojs-ui-core.less
============================================================ */
/* ============================================================
20. ÉDITEUR — formulaire uniquement (pas de CodeMirror)
============================================================ */
#editform, .editOptions, .wikiEditor-ui, .wikiEditor-ui-toolbar, .wikiEditor-ui-text { background-color: rgba(12, 24, 18, 0.9) !important; border-color: rgba(125, 255, 156, 0.15) !important; color: #cce8d4 !important; }
#wpTextbox1, .wikiEditor-ui-text textarea { background-color: #060f0b !important; color: #cce8d4 !important; border-color: rgba(125, 255, 156, 0.2) !important; }
.wikiEditor-ui-toolbar { background: #0f2015 !important; border-bottom: 1px solid rgba(125, 255, 156, 0.15) !important; }
.wikiEditor-ui-toolbar .group { border-right-color: rgba(125, 255, 156, 0.1) !important; }
.wikiEditor-ui-toolbar .tool:hover { background: rgba(125, 255, 156, 0.08) !important; }
#wpSave, #wpPreview, #wpDiff, .editButtons input[type="submit"] { background-color: rgba(12, 24, 18, 0.9) !important; border: 1px solid rgba(125, 255, 156, 0.3) !important; color: #4ab06a !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; letter-spacing: 0.1em !important; cursor: pointer !important; transition: all 0.15s !important; }
#wpSave:hover, #wpPreview:hover, #wpDiff:hover, .editButtons input[type="submit"]:hover { background-color: rgba(125, 255, 156, 0.1) !important; color: #7dff9c !important; border-color: rgba(125, 255, 156, 0.5) !important; }
#wpSave { background-color: rgba(125, 255, 156, 0.12) !important; color: #7dff9c !important; border-color: rgba(125, 255, 156, 0.4) !important; }
.editButtons .mw-editbutton-cancel { color: rgba(125, 255, 156, 0.4) !important; }
#wpSummary, #wpSummaryWidget input { background-color: #060f0b !important; border-color: rgba(125, 255, 156, 0.2) !important; color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important; }
#wpSummary:focus, #wpSummaryWidget input:focus { border-color: #7dff9c !important; outline: none !important; box-shadow: 0 0 0 2px rgba(125, 255, 156, 0.12) !important; }
.editCheckboxes label, .editOptions label { color: #7aaa88 !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; }
.editpage-head-copywarn, #editpage-copywarn { color: #4a6e55 !important; font-size: 11px !important; }
/* ============================================================
21. MOBILE — onglets défilants
============================================================ */
@media screen and (max-width: 720px) {
.vt-page-tabs { overflow-x: auto !important; overflow-y: hidden !important; -webkit-overflow-scrolling: touch !important; scrollbar-width: thin !important; flex-wrap: nowrap !important; height: auto !important; min-height: 44px !important; padding: 0 8px !important; }
.vt-page-tabs::-webkit-scrollbar { height: 3px !important; }
.vt-page-tabs::-webkit-scrollbar-thumb { background: rgba(125, 255, 156, 0.2) !important; }
.vt-tabs-ns ul, .vt-tabs-views ul, .vt-tabs-more ul { flex-wrap: nowrap !important; white-space: nowrap !important; }
.vt-page-tabs li a { white-space: nowrap !important; padding: 0 10px !important; font-size: 10px !important; }
.vt-tabs-sep { display: none !important; }
}
/* ============================================================
22. TITRE DE PAGE — padding cohérent
============================================================ */
#firstHeading, #mw-content-subtitle { padding-left: 36px !important; padding-right: 36px !important; }
/* ============================================================
23. NAV PRIMAIRE — masquer si vide
============================================================ */
.vt-nav-primary:not(:has(a)) { display: none !important; width: 0 !important; padding: 0 !important; border: none !important; }
/* ============================================================
24. FIXES SKIN
============================================================ */
html body .CodeMirror { padding: 0 !important; }
/* NOTE : la règle .vt-drawer-overlay { pointer-events: none } a été retirée car
elle contredisait le comportement attendu de l'overlay (capture des clics
pour fermer le drawer). Le skin.less gère cette propriété correctement
en distinguant l'état fermé (none) et ouvert (auto). */
@media screen and (min-width: 901px) { .vt-drawer-close { display: none !important; } }
.vt-watermark { display: none !important; }
@media screen and (max-width: 900px) {
.vt-user-tools { overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; max-width: calc(100vw - 180px); flex-shrink: 1; }
.vt-user-tools::-webkit-scrollbar { display: none; }
.vt-user-tools ul { flex-wrap: nowrap; }
.vt-user-tools li a { padding: 0 8px; font-size: 10px; letter-spacing: 0.06em; }
}
@media screen and (max-width: 600px) { #pt-preferences, #pt-watchlist { display: none; } }
/* ============================================================
25. MEDIAUPLOADER — Spécial:MediaUploader
============================================================ */
#upload-wizard { background: rgba(12, 24, 18, 0.6); border: 1px solid rgba(125, 255, 156, 0.15); color: #cce8d4; padding: 24px; border-radius: 4px; margin-top: 16px; }
#upload-wizard .ui-widget, #upload-wizard .ui-widget-content, #upload-wizard .ui-state-default, #upload-wizard .ui-corner-all, #upload-wizard .ui-corner-top, #upload-wizard .ui-corner-bottom, #upload-wizard .mediauploader-form { background-color: transparent !important; border-color: transparent !important; color: inherit !important; }
#mediauploader-steps, #mediauploader-steps.arrowSteps { background: rgba(6, 15, 11, 0.8) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 4px; padding: 0 !important; margin: 0 0 24px 0 !important; list-style: none; display: flex !important; overflow: hidden; height: auto !important; }
#mediauploader-steps li, #mediauploader-steps.arrowSteps li { flex: 1; padding: 14px 6px !important; background: transparent !important; background-image: none !important; color: rgba(125, 255, 156, 0.4) !important; text-transform: uppercase; letter-spacing: 0.05em; font-size: 10px !important; font-family: 'IBM Plex Mono', monospace !important; font-weight: 500; border: 0 !important; border-right: 1px solid rgba(125, 255, 156, 0.15) !important; margin: 0 !important; text-align: center; line-height: 1.3 !important; height: auto !important; min-height: 0 !important; white-space: normal !important; overflow: visible !important; text-overflow: clip !important; word-break: keep-all; }
#mediauploader-steps li::before, #mediauploader-steps li::after, #mediauploader-steps.arrowSteps li::before, #mediauploader-steps.arrowSteps li::after { display: none !important; content: none !important; }
#mediauploader-steps li:last-child { border-right: 0 !important; }
#mediauploader-steps li.arrow, #mediauploader-steps li.current, #mediauploader-steps li.mediauploader-step-current { background: rgba(125, 255, 156, 0.12) !important; color: #7dff9c !important; box-shadow: inset 0 -2px 0 #7dff9c; }
#mediauploader-steps li.completed, #mediauploader-steps li.mediauploader-step-completed { color: #4ab06a !important; }
#mediauploader-content, .mediauploader-stepdiv { color: #cce8d4; }
.mediauploader-stepdiv h2, .mediauploader-stepdiv h3 { color: #7dff9c !important; font-family: 'IBM Plex Mono', monospace !important; font-weight: 500 !important; text-transform: uppercase; letter-spacing: 0.05em; border-bottom: 1px solid rgba(125, 255, 156, 0.2); padding-bottom: 8px; margin-top: 24px; }
#mediauploader-filelist, #mediauploader-filelist.ui-corner-all { background: transparent !important; border: 0 !important; padding: 0 !important; }
.mediauploader-file { background: rgba(6, 15, 11, 0.8) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 4px !important; padding: 16px !important; margin-bottom: 12px !important; color: #cce8d4 !important; }
.mediauploader-file.filled { border-color: rgba(125, 255, 156, 0.35) !important; }
#upload-wizard .mediauploader-visible-file, #upload-wizard .mediauploader-visible-file.ui-corner-top.ui-corner-bottom { background-color: rgba(6, 15, 11, 0.7) !important; border: 1px solid rgba(125, 255, 156, 0.15) !important; border-radius: 4px !important; padding: 16px 20px !important; color: #cce8d4 !important; }
#upload-wizard .mediauploader-visible-file-filename, #upload-wizard .mediauploader-file-texts, #upload-wizard .mediauploader-file-preview { background-color: transparent !important; }
#upload-wizard .mediauploader-visible-file-filename-text { color: #7dff9c !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 13px !important; font-weight: 500; }
.mediauploader-file-status-line { color: rgba(168, 230, 184, 0.7) !important; font-size: 12px; font-style: italic; margin-top: 4px; }
.mediauploader-file-indicator { background: transparent !important; }
#upload-wizard .mediauploader-thumbnail, #upload-wizard .mediauploader-thumbnail-side { background-color: transparent !important; position: relative !important; }
#upload-wizard .mediauploader-add-file, #upload-wizard .oo-ui-selectFileInputWidget, #upload-wizard .oo-ui-selectFileWidget { background: rgba(6, 15, 11, 0.6) !important; background-image: none !important; border: 2px dashed rgba(125, 255, 156, 0.25) !important; border-radius: 4px !important; padding: 16px 20px !important; color: #cce8d4 !important; transition: all 0.2s ease; box-shadow: none !important; }
#upload-wizard .mediauploader-add-file:hover, #upload-wizard .oo-ui-selectFileWidget-canDrop { border-color: #7dff9c !important; background: rgba(125, 255, 156, 0.05) !important; }
#upload-wizard .oo-ui-selectFileInputWidget-info, #upload-wizard .oo-ui-selectFileInputWidget-info.oo-ui-textInputWidget { background: transparent !important; background-image: none !important; border: 0 !important; box-shadow: none !important; color: rgba(168, 230, 184, 0.6) !important; }
#upload-wizard .oo-ui-selectFileInputWidget-info input[type="search"], #upload-wizard .oo-ui-selectFileInputWidget-info .oo-ui-inputWidget-input { background: transparent !important; background-image: none !important; color: rgba(168, 230, 184, 0.6) !important; border: 0 !important; box-shadow: none !important; font-style: italic; }
#upload-wizard .oo-ui-selectFileInputWidget-info input[type="search"]::placeholder { color: rgba(168, 230, 184, 0.5) !important; font-style: italic; }
#upload-wizard .oo-ui-selectFileInputWidget-dropLabel, #upload-wizard .oo-ui-selectFileWidget-dropLabel { background: transparent !important; color: rgba(168, 230, 184, 0.6) !important; font-style: italic; }
#upload-wizard .oo-ui-selectFileInputWidget-selectButton { background: transparent !important; }
#upload-wizard .oo-ui-buttonElement > .oo-ui-buttonElement-button, .mediauploader-stepdiv .oo-ui-buttonElement > .oo-ui-buttonElement-button { background: rgba(12, 24, 18, 0.9) !important; background-image: none !important; border: 1px solid rgba(125, 255, 156, 0.3) !important; color: #4ab06a !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; text-transform: uppercase !important; letter-spacing: 0.12em !important; padding: 8px 18px !important; border-radius: 2px !important; box-shadow: none !important; text-shadow: none !important; transition: all 0.2s ease; min-height: 36px !important; }
#upload-wizard .oo-ui-buttonElement > .oo-ui-buttonElement-button:hover, .mediauploader-stepdiv .oo-ui-buttonElement > .oo-ui-buttonElement-button:hover { background: rgba(125, 255, 156, 0.1) !important; color: #7dff9c !important; border-color: rgba(125, 255, 156, 0.6) !important; }
#upload-wizard .oo-ui-flaggedElement-primary > .oo-ui-buttonElement-button, #upload-wizard .oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button, .mediauploader-stepdiv .oo-ui-flaggedElement-primary > .oo-ui-buttonElement-button, .mediauploader-stepdiv .oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button { background: rgba(125, 255, 156, 0.15) !important; color: #7dff9c !important; border-color: #7dff9c !important; font-weight: 500 !important; }
#upload-wizard .oo-ui-flaggedElement-primary > .oo-ui-buttonElement-button:hover, #upload-wizard .oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover { background: rgba(125, 255, 156, 0.25) !important; color: #cdffd6 !important; box-shadow: 0 0 12px rgba(125, 255, 156, 0.3) !important; }
#upload-wizard .oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button, .mediauploader-stepdiv .oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button { background: rgba(255, 122, 122, 0.08) !important; color: #ff7a7a !important; border-color: rgba(255, 122, 122, 0.4) !important; }
#upload-wizard .oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:hover { background: rgba(255, 122, 122, 0.15) !important; color: #ff9a9a !important; }
#upload-wizard .oo-ui-widget-disabled .oo-ui-buttonElement-button, .mediauploader-stepdiv .oo-ui-widget-disabled .oo-ui-buttonElement-button { opacity: 0.4 !important; cursor: not-allowed !important; }
#upload-wizard .oo-ui-iconElement-icon, .mediauploader-stepdiv .oo-ui-iconElement-icon { filter: brightness(0) saturate(100%) invert(91%) sepia(15%) saturate(594%) hue-rotate(76deg) brightness(101%) contrast(101%); opacity: 0.85; }
#upload-wizard input[type="text"], #upload-wizard input[type="number"], #upload-wizard textarea, #upload-wizard .oo-ui-textInputWidget input, #upload-wizard .oo-ui-textInputWidget textarea, #upload-wizard .oo-ui-multilineTextInputWidget textarea { background: rgba(6, 15, 11, 0.9) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 13px !important; padding: 8px 12px !important; border-radius: 2px !important; box-shadow: none !important; }
#upload-wizard input:focus, #upload-wizard textarea:focus, #upload-wizard .oo-ui-textInputWidget input:focus, #upload-wizard .oo-ui-textInputWidget textarea:focus, #upload-wizard .oo-ui-multilineTextInputWidget textarea:focus { border-color: #7dff9c !important; outline: 0 !important; box-shadow: 0 0 0 2px rgba(125, 255, 156, 0.15) !important; }
#upload-wizard .oo-ui-progressBarWidget, #upload-wizard .mediauploader-progress { background: rgba(6, 15, 11, 0.9) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 2px; overflow: hidden; height: 8px; }
#upload-wizard .oo-ui-progressBarWidget-bar, #upload-wizard .mediauploader-progress-bar { background: linear-gradient(90deg, #4ab06a, #7dff9c) !important; height: 100% !important; transition: width 0.3s ease; }
#upload-wizard .errorbox, .mediauploader-error { background: rgba(255, 94, 94, 0.1) !important; border: 1px solid rgba(255, 94, 94, 0.4) !important; color: #ff9a9a !important; padding: 12px !important; border-radius: 4px; }
#upload-wizard .successbox, .mediauploader-success { background: rgba(125, 255, 156, 0.08) !important; border: 1px solid rgba(125, 255, 156, 0.4) !important; color: #7dff9c !important; padding: 12px !important; border-radius: 4px; }
#upload-wizard .warningbox, .mediauploader-warning { background: rgba(245, 200, 74, 0.1) !important; border: 1px solid rgba(245, 200, 74, 0.4) !important; color: #f5c84a !important; padding: 12px !important; border-radius: 4px; }
#upload-wizard a { color: #7dff9c !important; text-decoration: none; border-bottom: 1px solid rgba(125, 255, 156, 0.3); }
#upload-wizard a:hover { color: #cdffd6 !important; border-bottom-color: #7dff9c; }
.mediauploader-unavailable, .mw-special-MediaUploader #mw-content-text > p:first-child { background: rgba(6, 15, 11, 0.6); border: 1px solid rgba(125, 255, 156, 0.2); border-left: 3px solid #f5c84a; padding: 16px 20px; color: #cce8d4; border-radius: 4px; }
#mediauploader-deeds-thumbnails { background-color: transparent !important; border-radius: 2px; text-align: center; margin: 1em 0; }
#mediauploader-deeds-thumbnails .mediauploader-thumbnail { background: transparent !important; }
#mediauploader-deeds-thumbnails canvas { filter: brightness(0.8) sepia(1) hue-rotate(76deg) saturate(0.5); opacity: 0.7; }
/* ============================================================
26. PAGE D'ACCUEIL — Grille responsive
============================================================ */
.homepage { display: grid; grid-template-columns: 1fr 1fr; grid-template-areas: "welcome welcome" "games games" "autres theme" "anecdotes articleday" "presentation participation"; gap: 16px; width: 100%; box-sizing: border-box; }
.homepage-welcome { grid-area: welcome; }
.homepage-portal-games { grid-area: games; }
.homepage-portal-autres { grid-area: autres; }
.homepage-portal-theme { grid-area: theme; }
.homepage-anecdotes { grid-area: anecdotes; }
.homepage-articleday { grid-area: articleday; }
.homepage-presentation { grid-area: presentation; }
.homepage-participation { grid-area: participation; }
.homepage-box { background: rgba(6, 15, 11, 0.7); border: 1px solid rgba(125, 255, 156, 0.15); border-radius: 4px; overflow: hidden; }
.homepage-box-title { background: rgba(125, 255, 156, 0.07); border-bottom: 1px solid rgba(125, 255, 156, 0.2); color: #7dff9c; font-family: 'IBM Plex Mono', monospace; font-size: 11px; font-weight: 500; text-transform: uppercase; letter-spacing: 0.12em; padding: 10px 16px; margin: 0; text-align: center; }
.homepage-box-content { padding: 16px; color: #cce8d4; }
.homepage-box-content a { color: #7dff9c; text-decoration: none; border-bottom: 1px solid rgba(125, 255, 156, 0.3); }
.homepage-box-content a:hover { color: #cdffd6; border-bottom-color: #7dff9c; }
.homepage-welcome { background: rgba(6, 15, 11, 0.7) !important; border: 1px solid rgba(125, 255, 156, 0.15) !important; border-radius: 4px !important; overflow: hidden; padding: 0 !important; text-align: center; }
.homepage-welcome-title { background: rgba(125, 255, 156, 0.07); border-bottom: 1px solid rgba(125, 255, 156, 0.2); color: #7dff9c !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; font-weight: 500; font-style: normal !important; text-transform: uppercase; letter-spacing: 0.12em; padding: 10px 16px; margin: 0; text-shadow: none !important; }
html body .homepage-welcome .logo-light, html body .homepage .logo-light { display: none !important; }
html body .homepage-welcome .logo-dark, html body .homepage .logo-dark { display: inline !important; }
.logo-accueil { margin: 20px auto; background: transparent !important; display: block; }
.logo-accueil img { max-width: 340px; width: 100%; height: auto; filter: drop-shadow(0 0 16px rgba(125, 255, 156, 0.2)); }
.homepage-welcome-subtitle { color: #cce8d4; font-size: 0.95em; margin: 6px 16px; line-height: 1.6; }
.homepage-welcome-subtitle a { color: #7dff9c !important; border-bottom: 1px solid rgba(125, 255, 156, 0.3); text-decoration: none; }
.homepage-welcome-subtitle a:hover { color: #cdffd6 !important; }
.homepage-welcome-links { margin: 20px 16px; display: flex; justify-content: center; align-items: center; gap: 20px; flex-wrap: wrap; border-top: 1px solid rgba(125, 255, 156, 0.1); padding-top: 16px; }
.homepage-welcome-links img { transition: filter 0.2s ease, transform 0.2s ease; }
.homepage-welcome-links img:hover { filter: brightness(1.15) drop-shadow(0 0 8px rgba(125, 255, 156, 0.4)); transform: scale(1.06); }
.homepage-portal-games-list { display: flex; flex-wrap: wrap; list-style: none; padding: 8px; margin: 0; gap: 12px; justify-content: center; }
.homepage-portal-games-item { flex: 0 0 calc(25% - 12px); max-width: 130px; text-align: center; color: #cce8d4; }
.homepage-portal-games-logo { margin-bottom: 6px; display: flex; justify-content: center; align-items: center; height: 70px; }
.homepage-portal-games-logo img { max-width: 100%; max-height: 70px; width: auto; height: auto; transition: filter 0.2s ease, transform 0.2s ease; }
.homepage-portal-games-logo img:hover { filter: brightness(1.2) drop-shadow(0 0 8px rgba(125, 255, 156, 0.4)); transform: scale(1.07); }
.homepage-portal-games-item div:last-child a, .homepage-portal-games-item em a, .homepage-portal-games-item i a { color: #7dff9c !important; font-size: 12px; text-decoration: none; border-bottom: 1px solid rgba(125, 255, 156, 0.3); font-style: italic; }
.homepage-portal-autres-list { display: flex; flex-wrap: wrap; list-style: none; padding: 8px; margin: 0; gap: 16px; justify-content: center; }
.homepage-portal-autres-list .homepage-portal-games-item { flex: 0 0 calc(33% - 16px); max-width: 150px; }
.homepage-portal-autres-list .homepage-portal-games-logo { height: 90px; }
.homepage-portal-autres-list .homepage-portal-games-logo img { max-height: 90px; }
.homepage-portal-theme .liste-horizontale ul { display: flex; flex-wrap: wrap; list-style: none; padding: 4px; margin: 0; gap: 6px; justify-content: center; }
.homepage-portal-theme .liste-horizontale li { background: rgba(125, 255, 156, 0.06); border: 1px solid rgba(125, 255, 156, 0.15); border-radius: 2px; padding: 5px 10px; list-style: none; margin: 0; }
.homepage-portal-theme .liste-horizontale li::before { display: none; }
.homepage-portal-theme .liste-horizontale li a { color: #7dff9c !important; font-family: 'IBM Plex Mono', monospace; font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; text-decoration: none; border-bottom: 0; }
.homepage-portal-theme .liste-horizontale li a:hover { color: #cdffd6 !important; }
@media screen and (max-width: 720px) {
.nomobile { display: none !important; }
.homepage { grid-template-columns: 1fr; grid-template-areas: "welcome" "games" "autres" "theme" "anecdotes" "articleday" "presentation" "participation"; gap: 10px; padding: 8px; }
.homepage-welcome, .homepage-welcome.nomobile { display: block !important; grid-area: welcome !important; }
.homepage-welcome .logo-accueil { display: none !important; }
.homepage-welcome-title { font-size: 10px !important; padding: 8px 12px; }
.homepage-welcome-subtitle { font-size: 0.85em; margin: 4px 12px; }
.homepage-welcome-links { margin: 12px; gap: 12px; padding-top: 12px; }
.homepage-portal-games-list { gap: 8px; padding: 8px 4px; }
.homepage-portal-games-item { flex: 0 0 calc(50% - 8px); max-width: none; }
.homepage-portal-games-logo { height: 55px; }
.homepage-portal-games-logo img { max-height: 55px; }
.homepage-portal-autres-list .homepage-portal-games-item { flex: 0 0 100%; max-width: none; display: flex; align-items: center; gap: 12px; text-align: left; }
.homepage-portal-autres-list .homepage-portal-games-logo { height: 50px; min-width: 60px; flex-shrink: 0; }
.homepage-portal-theme .liste-horizontale li { padding: 4px 8px; font-size: 10px; }
.homepage-box-title { font-size: 10px; padding: 8px 12px; letter-spacing: 0.1em; }
.homepage-box-content { padding: 12px; font-size: 14px; }
}
@media screen and (min-width: 721px) { .mobileonly { display: none !important; } }
@media screen and (min-width: 721px) and (max-width: 1100px) {
.homepage-portal-games-item { flex: 0 0 calc(25% - 12px); }
.homepage-portal-games-logo { height: 60px; }
.homepage-portal-games-logo img { max-height: 60px; }
}
/* ============================================================
27. LISIBILITÉ — Taille du texte des articles
============================================================ */
.mw-parser-output { font-size: 17px; line-height: 1.75; }
#firstHeading { font-size: clamp(1.5rem, 1.2rem + 1.5vw, 2.25rem) !important; line-height: 1.2 !important; margin-bottom: 8px !important; }
@media screen and (max-width: 900px) {
.mw-editsection, .mw-editsection-bracket, .mw-editsection-divider { display: none !important; }
.mw-parser-output .mw-heading h2, .mw-parser-output .mw-heading h3, .mw-parser-output .mw-heading h4, .mw-parser-output .mw-heading h5, .mw-parser-output .mw-heading h6 { word-break: normal !important; overflow-wrap: normal !important; hyphens: none !important; white-space: normal !important; }
#bodyContent { padding: 16px 16px 40px !important; }
#firstHeading, #mw-content-subtitle { padding-left: 16px !important; padding-right: 16px !important; }
}
/* ============================================================
28. VISUAL EDITOR — Toolbar sticky + surface + popups
→ MIGRÉE dans le skin : skinStyles/ve-overrides.less + oojs-ui-windows.less
============================================================ */
/* ============================================================
29. LECTEUR AUDIO — thème phosphore
============================================================ */
.mw-tmh-player,
.mediaContainer {
display: block !important;
width: 100% !important;
max-width: 440px !important;
margin: 12px auto !important;
background: rgba(6, 15, 11, 0.85) !important;
border: 1px solid rgba(125, 255, 156, 0.15) !important;
border-radius: 3px !important;
padding: 8px !important;
box-sizing: border-box !important;
}
.mw-parser-output audio,
audio.mw-file-element,
.mw-parser-output audio.mw-file-element,
audio.oo-ui-widget {
display: block !important;
width: 100% !important;
max-width: 440px !important;
min-width: 280px !important;
height: 40px !important;
margin: 12px auto !important;
background: rgba(6, 15, 11, 0.9) !important;
border: 1px solid rgba(125, 255, 156, 0.15) !important;
border-radius: 3px !important;
outline: none !important;
accent-color: #7dff9c !important;
}
.mw-parser-output audio::-webkit-media-controls-panel,
audio.mw-file-element::-webkit-media-controls-panel { background: rgba(6, 15, 11, 0.95) !important; border-radius: 3px !important; }
.mw-parser-output audio::-webkit-media-controls-play-button,
.mw-parser-output audio::-webkit-media-controls-mute-button,
audio.mw-file-element::-webkit-media-controls-play-button,
audio.mw-file-element::-webkit-media-controls-mute-button { filter: invert(1) sepia(1) saturate(3) hue-rotate(76deg) !important; }
.mw-parser-output audio::-webkit-media-controls-current-time-display,
.mw-parser-output audio::-webkit-media-controls-time-remaining-display,
audio.mw-file-element::-webkit-media-controls-current-time-display,
audio.mw-file-element::-webkit-media-controls-time-remaining-display {
color: #7dff9c !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 10px !important;
}
.mw-parser-output blockquote:has(audio) {
background: rgba(6, 15, 11, 0.6) !important;
border: 1px solid rgba(125, 255, 156, 0.12) !important;
border-left: 3px solid rgba(125, 255, 156, 0.3) !important;
border-radius: 3px !important;
padding: 12px 16px !important;
font-style: italic !important;
color: #cce8d4 !important;
max-width: 480px !important;
margin: 12px auto !important;
}
/* ============================================================
30. PAGES CONNEXION & CRÉATION DE COMPTE — Codex (MW 1.45)
============================================================ */
.mw-special-Userlogin .mw-body-content,
.mw-special-CreateAccount .mw-body-content { display: flex !important; gap: 40px !important; align-items: flex-start !important; }
#userloginForm,
#createaccount {
background: rgba(6, 15, 11, 0.85) !important;
border: 1px solid rgba(125, 255, 156, 0.15) !important;
border-radius: 4px !important;
padding: 24px !important;
flex: 0 0 auto !important;
width: auto !important;
min-width: 320px !important;
max-width: 480px !important;
box-sizing: border-box !important;
color: #cce8d4 !important;
}
#userloginForm .cdx-field, #createaccount .cdx-field { margin-bottom: 16px !important; }
#userloginForm .cdx-text-input, #createaccount .cdx-text-input,
#userloginForm .cdx-field, #createaccount .cdx-field { width: 100% !important; box-sizing: border-box !important; }
#userloginForm .cdx-label__label, #createaccount .cdx-label__label,
#userloginForm .cdx-label, #createaccount .cdx-label {
color: rgba(125, 255, 156, 0.6) !important; font-family: 'IBM Plex Mono', monospace !important;
font-size: 10px !important; text-transform: uppercase !important; letter-spacing: 0.12em !important;
margin-bottom: 6px !important; display: block !important;
}
#userloginForm .cdx-text-input__input,
#createaccount .cdx-text-input__input,
#userloginForm .cdx-text-input__input:enabled,
#createaccount .cdx-text-input__input:enabled {
width: 100% !important; box-sizing: border-box !important;
background-color: rgba(6, 15, 11, 0.9) !important;
border-color: rgba(125, 255, 156, 0.2) !important;
color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important;
font-size: 13px !important; padding: 10px 12px !important;
}
#userloginForm .cdx-text-input__input:focus, #createaccount .cdx-text-input__input:focus {
border-color: #7dff9c !important; outline: none !important;
box-shadow: 0 0 0 2px rgba(125, 255, 156, 0.12) !important;
}
#userloginForm .cdx-text-input__input:-webkit-autofill,
#createaccount .cdx-text-input__input:-webkit-autofill {
-webkit-box-shadow: 0 0 0 1000px rgba(6, 15, 11, 0.95) inset !important;
-webkit-text-fill-color: #cce8d4 !important;
}
#userloginForm .cdx-field__help-text, #createaccount .cdx-field__help-text { color: rgba(125, 255, 156, 0.3) !important; font-size: 11px !important; }
#wpLoginAttempt, #wpCreateaccount {
display: block !important; width: 100% !important; box-sizing: border-box !important;
background: rgba(125, 255, 156, 0.12) !important; border: 1px solid rgba(125, 255, 156, 0.4) !important;
border-radius: 2px !important; color: #7dff9c !important; font-family: 'IBM Plex Mono', monospace !important;
font-size: 11px !important; font-weight: 500 !important; text-transform: uppercase !important;
letter-spacing: 0.15em !important; padding: 14px !important; cursor: pointer !important;
margin-top: 8px !important; transition: all 0.2s !important;
}
#wpLoginAttempt:hover, #wpCreateaccount:hover { background: rgba(125, 255, 156, 0.22) !important; border-color: #7dff9c !important; box-shadow: 0 0 16px rgba(125, 255, 156, 0.2) !important; }
#userloginForm .mw-form-related-link-container, #createaccount .mw-form-related-link-container { margin-top: 16px !important; text-align: center !important; }
#userloginForm a, #createaccount a { color: #4ab06a !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 10px !important; text-transform: uppercase !important; letter-spacing: 0.1em !important; }
#userloginForm .mw-ui-checkbox input + label, #wpRemember + label { color: #7aaa88 !important; font-size: 12px !important; font-family: 'IBM Plex Mono', monospace !important; text-transform: none !important; letter-spacing: 0 !important; }
.mw-createaccount-benefits-container { flex: 1 !important; padding: 20px !important; }
.mw-createaccount-benefits-heading { color: #cce8d4 !important; font-family: 'Instrument Serif', Georgia, serif !important; font-style: italic !important; font-size: 1.3em !important; margin-bottom: 24px !important; }
.mw-number-text h2 { color: rgba(125, 255, 156, 0.5) !important; font-size: 3em !important; }
.mw-number-text p { color: rgba(125, 255, 156, 0.35) !important; }
.mw-message-box-error, .errorbox { background: rgba(255, 94, 94, 0.1) !important; border: 1px solid rgba(255, 94, 94, 0.4) !important; color: #ff9a9a !important; border-radius: 2px !important; padding: 12px !important; margin-bottom: 16px !important; }
@media screen and (max-width: 720px) {
.mw-special-Userlogin .mw-body-content, .mw-special-CreateAccount .mw-body-content { flex-direction: column !important; }
#userloginForm, #createaccount { flex: none !important; width: 100% !important; max-width: 100% !important; padding: 16px !important; }
.mw-createaccount-benefits-container { display: none !important; }
}
/* ============================================================
31. PAGE PRÉFÉRENCES
============================================================ */
.oo-ui-tabSelectWidget { background: rgba(6, 15, 11, 0.9) !important; border-bottom: 1px solid rgba(125, 255, 156, 0.15) !important; }
.oo-ui-tabOptionWidget { background: transparent !important; border: 0 !important; border-bottom: 2px solid transparent !important; color: rgba(125, 255, 156, 0.4) !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 10px !important; text-transform: uppercase !important; letter-spacing: 0.1em !important; padding: 10px 16px !important; transition: color 0.15s, border-color 0.15s !important; }
.oo-ui-tabOptionWidget:hover { color: #7dff9c !important; background: rgba(125, 255, 156, 0.05) !important; }
.oo-ui-tabOptionWidget.oo-ui-optionWidget-selected { color: #7dff9c !important; border-bottom-color: #7dff9c !important; background: rgba(125, 255, 156, 0.07) !important; }
#preferences { background: transparent !important; color: #cce8d4 !important; }
#preferences h2 { color: #7dff9c !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 10px !important; font-weight: 500 !important; text-transform: uppercase !important; letter-spacing: 0.15em !important; border-bottom: 1px dashed rgba(125, 255, 156, 0.15) !important; padding-bottom: 8px !important; margin: 24px 0 16px !important; }
#preferences .mw-htmlform-field label, #preferences .oo-ui-labelElement-label { color: #cce8d4 !important; font-size: 13px !important; }
#preferences .mw-htmlform-tip, #preferences .mw-htmlform-ooui .oo-ui-fieldLayout-help { color: rgba(125, 255, 156, 0.35) !important; font-size: 11px !important; }
#preferences input[type="text"], #preferences input[type="number"], #preferences input[type="email"], #preferences input[type="search"], #preferences textarea, #preferences .oo-ui-textInputWidget input { background: rgba(6, 15, 11, 0.9) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 2px !important; color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 13px !important; }
#preferences input:focus, #preferences .oo-ui-textInputWidget input:focus { border-color: #7dff9c !important; outline: none !important; box-shadow: 0 0 0 2px rgba(125, 255, 156, 0.12) !important; }
#preferences .mw-htmlform-submit-buttons { background: rgba(6, 15, 11, 0.96) !important; border-top: 1px solid rgba(125, 255, 156, 0.15) !important; box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.4) !important; }
#preferences .mw-htmlform-submit-buttons .oo-ui-buttonElement-button, #prefsubmit { background: rgba(125, 255, 156, 0.12) !important; border: 1px solid rgba(125, 255, 156, 0.4) !important; color: #7dff9c !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; text-transform: uppercase !important; letter-spacing: 0.12em !important; border-radius: 2px !important; }
#preferences .mw-htmlform-submit-buttons .oo-ui-buttonElement-button:hover, #prefsubmit:hover { background: rgba(125, 255, 156, 0.22) !important; border-color: #7dff9c !important; }
#preferences .mw-prefs-search input { background: rgba(6, 15, 11, 0.9) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important; }
.oo-ui-dropdownWidget-handle { background: rgba(6, 15, 11, 0.9) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 2px !important; color: #cce8d4 !important; }
.oo-ui-dropdownWidget-handle:hover { background: rgba(6, 15, 11, 0.95) !important; border-color: rgba(125, 255, 156, 0.4) !important; }
.oo-ui-dropdownWidget-handle .oo-ui-labelElement-label { color: #cce8d4 !important; }
.oo-ui-dropdownWidget .oo-ui-indicatorElement-indicator { filter: brightness(0) saturate(100%) invert(91%) sepia(15%) saturate(594%) hue-rotate(76deg) brightness(101%) !important; opacity: 0.5 !important; }
.oo-ui-dropdownInputWidget select, #preferences select { background: rgba(6, 15, 11, 0.95) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; color: #cce8d4 !important; border-radius: 2px !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 12px !important; padding: 8px 12px !important; }
.oo-ui-menuSelectWidget { background: rgba(8, 18, 12, 0.98) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 2px !important; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.7) !important; }
.oo-ui-menuSelectWidget .oo-ui-optionWidget { color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 12px !important; padding: 8px 14px !important; }
.oo-ui-menuSelectWidget .oo-ui-optionWidget:hover, .oo-ui-menuSelectWidget .oo-ui-optionWidget-highlighted { background: rgba(125, 255, 156, 0.08) !important; color: #7dff9c !important; }
.oo-ui-menuSelectWidget .oo-ui-optionWidget-selected { background: rgba(125, 255, 156, 0.12) !important; color: #7dff9c !important; }
.mw-htmlform-matrix, .mw-widget-checkMatrixWidget-matrix { border-collapse: collapse !important; width: 100% !important; background: transparent !important; }
.mw-htmlform-matrix th, .mw-widget-checkMatrixWidget-matrix th { color: rgba(125, 255, 156, 0.5) !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 10px !important; text-transform: uppercase !important; letter-spacing: 0.1em !important; padding: 8px 14px !important; border-bottom: 1px solid rgba(125, 255, 156, 0.12) !important; background: transparent !important; font-weight: 500 !important; }
.mw-htmlform-matrix td, .mw-widget-checkMatrixWidget-matrix td { padding: 6px 14px !important; border: 0 !important; background: transparent !important; color: #cce8d4 !important; font-size: 13px !important; }
.mw-htmlform-matrix tr:nth-child(even) td, .mw-widget-checkMatrixWidget-matrix tr:nth-child(even) td { background: rgba(125, 255, 156, 0.03) !important; }
.mw-htmlform-matrix tr.disabled td, .mw-widget-checkMatrixWidget-matrix tr.disabled td { color: rgba(125, 255, 156, 0.25) !important; }
.mw-htmlform-matrix tr, .mw-widget-checkMatrixWidget-matrix tr { background: transparent !important; }
.mw-htmlform-matrix .oo-ui-iconElement-icon, .mw-widget-checkMatrixWidget-matrix .oo-ui-iconElement-icon { filter: brightness(0) saturate(100%) invert(91%) sepia(15%) saturate(594%) hue-rotate(76deg) brightness(101%) !important; opacity: 0.4 !important; }
.oo-ui-checkboxInputWidget [type='checkbox'] + span { background-color: rgba(6, 15, 11, 0.9) !important; background-image: none !important; border: 2px solid rgba(125, 255, 156, 0.3) !important; border-radius: 2px !important; width: 18px !important; height: 18px !important; }
.oo-ui-checkboxInputWidget [type='checkbox'] + span.vt-checked { background-color: #4ab06a !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' viewBox='0 0 12 10'%3E%3Cpolyline points='1,5 4.5,8.5 11,1' stroke='%23ffffff' stroke-width='2.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: center !important; background-size: 12px 10px !important; border-color: #7dff9c !important; }
.oo-ui-checkboxInputWidget.oo-ui-widget-disabled [type='checkbox'] + span { opacity: 0.4 !important; }
.oo-ui-popupWidget-popup { background: rgba(8, 18, 12, 0.98) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 3px !important; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.7) !important; color: #cce8d4 !important; padding: 12px 14px !important; font-size: 13px !important; line-height: 1.5 !important; }
.mw-widget-DateInputWidget input, .mw-widget-DateTimeInputWidget input { background: rgba(6, 15, 11, 0.9) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important; border-radius: 2px !important; padding: 8px 12px !important; }
.oo-ui-calendarWidget { background: rgba(8, 18, 12, 0.98) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important; border-radius: 3px !important; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.7) !important; }
.oo-ui-calendarWidget-header { background: rgba(6, 15, 11, 0.95) !important; border-bottom: 1px solid rgba(125, 255, 156, 0.12) !important; padding: 8px !important; }
.oo-ui-calendarWidget-header .oo-ui-buttonElement-button { color: rgba(125, 255, 156, 0.5) !important; background: transparent !important; }
.oo-ui-calendarWidget-header .oo-ui-buttonElement-button:hover { color: #7dff9c !important; background: rgba(125, 255, 156, 0.08) !important; }
.oo-ui-calendarWidget-title { color: #cce8d4 !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; text-transform: uppercase !important; letter-spacing: 0.1em !important; }
.oo-ui-calendarWidget .oo-ui-calendarWidget-day-of-week { color: rgba(125, 255, 156, 0.35) !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 10px !important; }
.oo-ui-calendarWidget .oo-ui-calendarWidget-day { color: #cce8d4 !important; background: transparent !important; border-radius: 2px !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 12px !important; }
.oo-ui-calendarWidget .oo-ui-calendarWidget-day:hover { background: rgba(125, 255, 156, 0.1) !important; color: #7dff9c !important; }
.oo-ui-calendarWidget .oo-ui-calendarWidget-day-today { border: 1px solid rgba(125, 255, 156, 0.35) !important; color: #7dff9c !important; }
.oo-ui-calendarWidget .oo-ui-calendarWidget-day-selected { background: rgba(125, 255, 156, 0.18) !important; color: #7dff9c !important; font-weight: 600 !important; }
.oo-ui-calendarWidget .oo-ui-calendarWidget-day-prev-month, .oo-ui-calendarWidget .oo-ui-calendarWidget-day-next-month { color: rgba(125, 255, 156, 0.2) !important; }
/* ============================================================
32. ÉDITEUR WIKICODE — CodeMirror coloration syntaxique
============================================================ */
.ve-ui-mwWikitextSurface .CodeMirror,
.ve-ui-mwWikitextSurface .CodeMirror-scroll {
background: #060f0b !important;
color: #cce8d4 !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 13px !important;
line-height: 1.6 !important;
}
.ve-ui-mwWikitextSurface .CodeMirror-cursor { border-left-color: #7dff9c !important; }
.ve-ui-mwWikitextSurface .CodeMirror-selected,
.ve-ui-mwWikitextSurface .CodeMirror-focused .CodeMirror-selected { background: rgba(125, 255, 156, 0.15) !important; }
.ve-ui-mwWikitextSurface .CodeMirror-gutters { background: rgba(6, 15, 11, 0.95) !important; border-right: 1px solid rgba(125, 255, 156, 0.1) !important; }
.ve-ui-mwWikitextSurface .CodeMirror-linenumber { color: rgba(125, 255, 156, 0.22) !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; }
.ve-ui-mwWikitextSurface .CodeMirror-activeline-background { background: rgba(125, 255, 156, 0.04) !important; }
.ve-ui-mwWikitextSurface .cm-mw-template-name,
.ve-ui-mwWikitextSurface .cm-mw-template-bracket { color: #f5c84a !important; }
.ve-ui-mwWikitextSurface .cm-mw-template-argument-name { color: #a8d8ea !important; }
.ve-ui-mwWikitextSurface .cm-mw-template-delimiter { color: rgba(245, 200, 74, 0.5) !important; }
.ve-ui-mwWikitextSurface .cm-mw-link-ground,
.ve-ui-mwWikitextSurface .cm-mw-link,
.ve-ui-mwWikitextSurface .cm-mw-link-pagename { color: #4ab06a !important; }
.ve-ui-mwWikitextSurface .cm-mw-link-bracket { color: rgba(74, 176, 106, 0.5) !important; }
.ve-ui-mwWikitextSurface .cm-mw-heading,
.ve-ui-mwWikitextSurface .cm-mw-section-header { color: #7dff9c !important; font-weight: bold !important; }
.ve-ui-mwWikitextSurface .cm-mw-htmlentity,
.ve-ui-mwWikitextSurface .cm-mw-tag-name { color: #ff9a9a !important; }
.ve-ui-mwWikitextSurface .cm-mw-tag-bracket { color: rgba(255, 154, 154, 0.5) !important; }
.ve-ui-mwWikitextSurface .cm-mw-attribute-name { color: #a8d8ea !important; }
.ve-ui-mwWikitextSurface .cm-mw-attribute-value { color: #f5c84a !important; }
.ve-ui-mwWikitextSurface .cm-mw-comment { color: rgba(125, 255, 156, 0.3) !important; font-style: italic !important; }
.ve-ui-mwWikitextSurface .cm-mw-apostrophes-bold { color: rgba(125, 255, 156, 0.5) !important; font-weight: bold !important; }
.ve-ui-mwWikitextSurface .cm-mw-apostrophes-italic { color: rgba(125, 255, 156, 0.5) !important; font-style: italic !important; }
.ve-ui-mwWikitextSurface .cm-mw-table-bracket,
.ve-ui-mwWikitextSurface .cm-mw-table-definition { color: rgba(168, 216, 234, 0.7) !important; }
.ve-ui-mwWikitextSurface .cm-mw-template-variable-bracket,
.ve-ui-mwWikitextSurface .cm-mw-template-variable-name { color: #ff9a9a !important; }
.ve-ui-mwWikitextSurface .cm-mw-parserfunction-name,
.ve-ui-mwWikitextSurface .cm-mw-parserfunction-bracket { color: rgba(245, 200, 74, 0.8) !important; }
.ve-ui-mwWikitextSurface .cm-mw-redirect { color: #7dff9c !important; font-weight: bold !important; }
/* ============================================================
33. BOUTON LANGUES INTERWIKI
============================================================ */
#vt-title-lang-row { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 16px !important; }
#vt-title-lang-row #firstHeading { flex: 1 !important; min-width: 0 !important; }
#p-lang-btn { position: relative; flex-shrink: 0; margin-right: 36px !important; }
.vt-lang-btn-trigger {
display: inline-flex !important; align-items: center !important; gap: 6px !important;
background: rgba(125, 255, 156, 0.07) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important;
border-radius: 2px !important; color: rgba(125, 255, 156, 0.6) !important;
font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important;
text-transform: uppercase !important; letter-spacing: 0.1em !important;
padding: 6px 12px !important; cursor: pointer !important; white-space: nowrap !important;
transition: all 0.15s !important;
}
.vt-lang-btn-trigger:hover,
.vt-lang-btn-trigger[aria-expanded="true"] {
background: rgba(125, 255, 156, 0.14) !important;
border-color: rgba(125, 255, 156, 0.4) !important;
color: #7dff9c !important;
}
.vt-lang-list {
position: absolute; top: calc(100% + 4px); right: 0; z-index: 200;
background: rgba(8, 18, 12, 0.98) !important; border: 1px solid rgba(125, 255, 156, 0.2) !important;
border-radius: 3px !important; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.7) !important;
min-width: 180px; padding: 4px 0;
}
.vt-lang-list[hidden] { display: none !important; }
.vt-lang-list ul { list-style: none !important; margin: 0 !important; padding: 0 !important; }
.vt-lang-list .interlanguage-link a {
display: flex !important; align-items: center !important; gap: 8px !important;
padding: 8px 16px !important; color: #cce8d4 !important; text-decoration: none !important;
font-size: 13px !important; font-family: 'Crimson Pro', Georgia, serif !important;
border-left: 2px solid transparent !important; transition: all 0.1s !important;
}
.vt-lang-list .interlanguage-link a:hover {
background: rgba(125, 255, 156, 0.08) !important; color: #7dff9c !important;
border-left-color: #4ab06a !important;
}
/* ============================================================
34. GALERIES & VIGNETTES (THUMBS)
============================================================ */
ul.gallery,
.mw-parser-output .gallery { background: transparent !important; border: 0 !important; margin: 16px 0 !important; padding: 0 !important; }
li.gallerybox,
.mw-parser-output .gallerybox { background: transparent !important; }
li.gallerybox div.thumb,
.gallerybox .thumb {
background: rgba(15, 28, 21, 0.65) !important;
border: 1px solid rgba(125, 255, 156, 0.18) !important;
border-radius: 2px !important; margin: 2px !important;
transition: all 0.15s ease;
}
li.gallerybox div.thumb:hover,
.gallerybox .thumb:hover {
border-color: rgba(125, 255, 156, 0.45) !important;
box-shadow: 0 0 12px rgba(125, 255, 156, 0.12);
}
.gallerytext,
.gallerybox .gallerytext {
color: #cce8d4 !important; background: transparent !important;
font-family: 'Crimson Pro', Georgia, serif !important; padding: 6px 8px !important;
}
.gallerytext p,
.gallerybox .gallerytext p { color: #cce8d4 !important; margin: 0 !important; }
.gallerytext a,
.gallerybox .gallerytext a { color: #7dff9c !important; }
.gallerytext a:hover,
.gallerybox .gallerytext a:hover { color: #b6ffc6 !important; }
.thumbinner,
.mw-parser-output .thumbinner,
.mw-parser-output figure[typeof~="mw:File/Thumb"],
.mw-parser-output figure[typeof~="mw:File/Frame"],
.mw-parser-output figure.mw-default-size,
.mw-parser-output figure.thumb {
background: rgba(15, 28, 21, 0.65) !important;
border: 1px solid rgba(125, 255, 156, 0.18) !important;
border-radius: 2px !important; color: #cce8d4 !important;
}
.mw-parser-output figure[typeof~="mw:File/Thumb"] img.mw-file-element,
.mw-parser-output figure[typeof~="mw:File/Frame"] img.mw-file-element,
.mw-parser-output figure.mw-default-size img.mw-file-element {
background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important;
}
.mw-parser-output figure a.mw-file-description,
.mw-parser-output figure a {
border: 0 !important; outline: 0 !important; background: transparent !important; display: block;
}
.thumbcaption,
.mw-parser-output .thumbcaption,
figcaption,
.mw-parser-output figcaption {
color: #cce8d4 !important; background: transparent !important; border: 0 !important;
border-top: 0 !important; outline: 0 !important;
font-family: 'Crimson Pro', Georgia, serif !important;
font-style: italic; font-size: 13px !important; padding: 6px 8px !important;
}
.magnify a {
filter: invert(1) hue-rotate(90deg) saturate(0.6) brightness(1.2) !important;
opacity: 0.6 !important;
}
.magnify a:hover { opacity: 1 !important; }
/* ============================================================
35. SCROLLBAR MOBILE — masquage agressif
============================================================ */
@media screen and (max-width: 900px) {
.vt-page-tabs,
.vt-user-tools,
.vt-page-tabs *,
.vt-user-tools * { scrollbar-width: none !important; -ms-overflow-style: none !important; }
.vt-page-tabs::-webkit-scrollbar,
.vt-user-tools::-webkit-scrollbar {
display: none !important; width: 0 !important; height: 0 !important; background: transparent !important;
}
.vt-page-tabs::-webkit-scrollbar-track,
.vt-user-tools::-webkit-scrollbar-track,
.vt-page-tabs::-webkit-scrollbar-thumb,
.vt-user-tools::-webkit-scrollbar-thumb { display: none !important; background: transparent !important; }
}
/* ============================================================
36. CITATIONS (blockquote)
============================================================ */
blockquote,
.mw-parser-output blockquote,
.mw-parser-output .noexcerpt:not(.avt-warn-banner):not(.avt-note-banner):not(.avt-section-banner) {
background: transparent !important; border: 0 !important; box-shadow: none !important;
padding: 8px 16px !important; margin: 16px auto !important;
font-style: italic; color: #cce8d4;
font-family: 'Crimson Pro', Georgia, serif;
font-size: 16px; line-height: 1.6;
}
blockquote p,
.mw-parser-output blockquote p {
margin: 0 0 8px !important; background: transparent !important; border: 0 !important;
}
blockquote p:last-child { margin-bottom: 0 !important; }
blockquote audio,
.mw-parser-output blockquote audio,
blockquote .mw-mmv-image,
blockquote figure,
blockquote .floatnone,
blockquote .center {
border: 0 !important; background: transparent !important; box-shadow: none !important;
margin: 8px auto !important;
}
/* ============================================================
37. PAGE RECHERCHE — Special:Recherche
→ MIGRÉE dans le skin : skinStyles/mediawiki.special.search.less
============================================================ */
/* ============================================================
38. NOTIFICATIONS / TOAST POST-PUBLICATION
============================================================ */
.mw-notification,
.mw-notification-area .mw-notification,
.postedit,
.postedit-container {
background: rgba(8, 18, 12, 0.97) !important;
border: 1px solid rgba(125, 255, 156, 0.35) !important;
border-radius: 3px !important;
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(125, 255, 156, 0.1) !important;
color: #cce8d4 !important;
padding: 12px 16px !important;
backdrop-filter: blur(8px) !important;
-webkit-backdrop-filter: blur(8px) !important;
}
.mw-notification-success,
.mw-notification.mw-notification-type-success,
.mw-notification[data-mw-notification-type="success"] {
border-left: 3px solid #7dff9c !important;
border-color: rgba(125, 255, 156, 0.4) !important;
}
.mw-notification-warn,
.mw-notification.mw-notification-type-warn {
border-left: 3px solid #f5c84a !important;
border-color: rgba(245, 200, 74, 0.4) !important;
}
.mw-notification-error,
.mw-notification.mw-notification-type-error {
border-left: 3px solid #ff7a7a !important;
border-color: rgba(255, 122, 122, 0.4) !important;
}
.mw-notification p,
.mw-notification div,
.mw-notification span,
.postedit-content {
color: #cce8d4 !important;
background: transparent !important;
font-family: 'Crimson Pro', Georgia, serif !important;
font-size: 14px !important;
line-height: 1.5 !important;
}
.mw-notification strong,
.mw-notification b {
color: #7dff9c !important;
font-weight: 600 !important;
}
.mw-notification a,
.postedit a {
color: #7dff9c !important;
text-decoration: none !important;
border-bottom: 1px solid rgba(125, 255, 156, 0.3) !important;
}
.mw-notification a:hover,
.postedit a:hover {
color: #b6ffc6 !important;
border-bottom-color: #7dff9c !important;
}
.mw-notification .oo-ui-iconElement-icon,
.postedit .oo-ui-iconElement-icon {
filter: brightness(0) saturate(100%) invert(91%) sepia(15%) saturate(594%) hue-rotate(76deg) brightness(101%) !important;
opacity: 0.9 !important;
}
.mw-notification-close,
.postedit-icon-close {
filter: brightness(0) saturate(100%) invert(72%) sepia(20%) saturate(400%) hue-rotate(76deg) !important;
opacity: 0.5 !important;
transition: opacity 0.15s !important;
}
.mw-notification-close:hover,
.postedit-icon-close:hover { opacity: 1 !important; }
.mw-notification-area { background: transparent !important; }
/* ============================================================
39. WIKITABLE — adaptation à l'infobox (desktop)
============================================================ */
@media screen and (min-width: 721px) {
.mw-parser-output:has(.avt-infobox) .wikitable,
.mw-parser-output:has(.avt-infobox) .va-table {
max-width: calc(100% - 344px) !important; /* 320px infobox + ~1.5em marge */
width: auto !important;
}
}
/* ============================================================
40. CORRECTIONS AVANCÉES — liens, tableaux collapsibles
============================================================ */
/* Liens rouges (.new) dans les tableaux — ne pas écraser avec le vert */
.mw-parser-output table td a.new,
.mw-parser-output table th a.new,
.mw-parser-output .wikitable td a.new,
.mw-parser-output .wikitable th a.new,
.mw-parser-output .va-table td a.new {
color: #ff5e5e !important;
}
.mw-parser-output table td a.new:hover,
.mw-parser-output .wikitable td a.new:hover {
color: #ff8888 !important;
}
/* Liens externes — ambre pour les distinguer des liens internes */
.mw-parser-output a.external,
.mw-parser-output a[rel~="nofollow"] {
color: #f5c84a !important;
}
.mw-parser-output a.external:visited,
.mw-parser-output a[rel~="nofollow"]:visited {
color: #c9973a !important;
}
.mw-parser-output a.external:hover,
.mw-parser-output a[rel~="nofollow"]:hover {
color: #ffe080 !important;
}
/* Tableaux collapsibles — ne pas bloquer le JS avec !important sur display */
/* Le JS MediaWiki masque les lignes via style="display:none" inline.
Toute règle CSS avec !important sur display écrase ce comportement.
On stylise uniquement l'apparence sans toucher display. */
.mw-collapsible-toggle,
.mw-collapsible-toggle a {
color: rgba(125, 255, 156, 0.55) !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 10px !important;
text-transform: uppercase !important;
letter-spacing: 0.1em !important;
cursor: pointer !important;
text-decoration: none !important;
background: transparent !important;
border: 0 !important;
}
.mw-collapsible-toggle a:hover,
.mw-collapsible-toggle:hover {
color: #7dff9c !important;
background: transparent !important;
}
/* Ligne d'en-tête collapsible */
.mw-parser-output .wikitable.mw-collapsible > tbody > tr:first-child > th,
.mw-parser-output table.mw-collapsible > tbody > tr:first-child > th {
background: rgba(10, 22, 16, 0.95) !important;
border-bottom: 1px solid rgba(125, 255, 156, 0.2) !important;
}
/* Cellules avec style inline "background: white" ou couleur claire — reset */
.mw-parser-output .wikitable td[style*="background:#fff"],
.mw-parser-output .wikitable td[style*="background: #fff"],
.mw-parser-output .wikitable td[style*="background:white"],
.mw-parser-output .wikitable td[style*="background: white"],
.mw-parser-output .wikitable td[style*="background:#FFF"],
.mw-parser-output .wikitable td[style*="background: #FFF"] {
background-color: rgba(12, 24, 18, 0.85) !important;
color: #cce8d4 !important;
}
/* Titre de page — ne pas hériter de l'italique des h2 */
#firstHeading,
.firstHeading {
font-style: normal !important;
}
/* ============================================================
41. PAGE PREVIEWS — aperçus au survol des liens (Hovercards)
============================================================ */
/* Conteneur racine — fond sombre + ombrage phosphore */
.mwe-popups,
.mwe-popups.mwe-popups-fade-in-up,
.mwe-popups.mwe-popups-fade-in-down,
.mwe-popups.mwe-popups-no-image-tri,
.mwe-popups.mwe-popups-image-tri,
.mwe-popups.mwe-popups-image-pointer,
.mwe-popups.mwe-popups-is-not-tall,
.mwe-popups.mwe-popups-is-tall {
background: rgba(8, 18, 12, 0.98) !important;
border: 1px solid rgba(125, 255, 156, 0.25) !important;
border-radius: 3px !important;
box-shadow: 0 8px 28px rgba(0, 0, 0, 0.75),
0 0 12px rgba(125, 255, 156, 0.08) !important;
color: #cce8d4 !important;
-webkit-backdrop-filter: blur(8px);
backdrop-filter: blur(8px);
}
/* Force transparence sur tous les conteneurs internes —
neutralise les fonds blancs résiduels (div, a, container) */
.mwe-popups > div,
.mwe-popups > a,
.mwe-popups > a > div,
.mwe-popups .mwe-popups-container,
.mwe-popups .mwe-popups-extract,
.mwe-popups .mwe-popups-extract p,
.mwe-popups .mwe-popups-discreet,
.mwe-popups .mwe-popups-scroll,
.mwe-popups .mwe-popups-body {
background-color: transparent !important;
}
/* Lien englobant (<a>) cliquable — fond blanc natif neutralisé */
.mwe-popups a,
.mwe-popups a:link,
.mwe-popups a:visited,
.mwe-popups a:hover {
background: transparent !important;
color: #cce8d4 !important;
text-decoration: none !important;
}
/* Pointe (triangle) — masquer la version blanche par défaut */
.mwe-popups.flipped-x::before,
.mwe-popups.flipped-y::before,
.mwe-popups.flipped-x-y::before,
.mwe-popups::before,
.mwe-popups.flipped-x::after,
.mwe-popups.flipped-y::after,
.mwe-popups.flipped-x-y::after,
.mwe-popups::after {
border-color: transparent !important;
display: none !important;
}
/* Titre de l'article dans le popup */
.mwe-popups .mwe-popups-title,
.mwe-popups h3,
.mwe-popups .mwe-popups-extract h3 {
color: #7dff9c !important;
font-family: 'Instrument Serif', Georgia, serif !important;
font-style: italic !important;
font-size: 1.1rem !important;
font-weight: normal !important;
border: 0 !important;
margin: 0 0 6px 0 !important;
padding: 0 !important;
}
/* Indicateur de type d'article (icône à côté du titre) */
.mwe-popups .mwe-popups-title .mw-ui-icon {
filter: brightness(0) saturate(100%) invert(91%) sepia(15%)
saturate(594%) hue-rotate(76deg) brightness(101%) !important;
opacity: 0.65 !important;
}
/* Extrait / résumé textuel */
.mwe-popups .mwe-popups-extract {
color: #cce8d4 !important;
font-family: 'Crimson Pro', Georgia, serif !important;
font-size: 14px !important;
line-height: 1.5 !important;
padding: 14px 16px !important;
}
/* Variante "discreet" : titre seul, sans extrait */
.mwe-popups .mwe-popups-discreet {
padding: 10px 14px !important;
}
/* Conteneur de la miniature (image d'aperçu) */
.mwe-popups .mwe-popups-thumbnail,
.mwe-popups .mwe-popups-thumbnail-link,
.mwe-popups svg.mwe-popups-thumbnail {
background: rgba(6, 15, 11, 0.6) !important;
border-bottom: 1px solid rgba(125, 255, 156, 0.12) !important;
}
/* Filtre teinte phosphore sur la miniature pour rester dans le ton */
/* NOTE : neutralisé plus bas (section 53-(4)) — conservé pour historique. */
.mwe-popups .mwe-popups-thumbnail image,
.mwe-popups svg.mwe-popups-thumbnail image {
filter: brightness(0.92) saturate(0.9) hue-rotate(-8deg) !important;
}
/* Aperçus "désambiguïsation" / page d'homonymie */
.mwe-popups.mwe-popups-type-disambiguation {
border-color: rgba(245, 200, 74, 0.35) !important;
}
.mwe-popups.mwe-popups-type-disambiguation .mwe-popups-title {
color: #f5c84a !important;
}
/* Aperçus "lien rouge" (page inexistante) */
.mwe-popups.mwe-popups-type-generic {
border-color: rgba(255, 122, 122, 0.35) !important;
}
.mwe-popups.mwe-popups-type-generic .mwe-popups-title {
color: #ff7a7a !important;
}
/* Barre du bas : paramètres + lien "lire la suite" */
.mwe-popups .mwe-popups-settings,
.mwe-popups footer,
.mwe-popups .mwe-popups-read-link {
background: rgba(6, 15, 11, 0.6) !important;
border-top: 1px solid rgba(125, 255, 156, 0.12) !important;
padding: 8px 14px !important;
}
/* Lien "lire la suite" */
.mwe-popups .mwe-popups-read-link {
color: #4ab06a !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 10px !important;
text-transform: uppercase !important;
letter-spacing: 0.12em !important;
text-decoration: none !important;
}
.mwe-popups .mwe-popups-read-link:hover {
color: #7dff9c !important;
}
/* Icône engrenage des paramètres */
.mwe-popups .mwe-popups-settings-icon,
.mwe-popups .mw-ui-icon-popups-settings {
filter: brightness(0) saturate(100%) invert(72%) sepia(20%)
saturate(400%) hue-rotate(76deg) brightness(100%) !important;
opacity: 0.45 !important;
transition: opacity 0.15s !important;
}
.mwe-popups .mwe-popups-settings-icon:hover,
.mwe-popups .mw-ui-icon-popups-settings:hover {
opacity: 1 !important;
}
/* Dialogue des paramètres Page Previews (Spécial:Préférences modal) */
.mwe-popups-settings .oo-ui-window-frame,
.mw-popups-settings .oo-ui-window-frame {
background: rgba(10, 20, 15, 0.98) !important;
border: 1px solid rgba(125, 255, 156, 0.2) !important;
}
/* ============================================================
42. DIFF VIEW — comparaison de versions
→ MIGRÉE dans le skin : skinStyles/mediawiki.diff.less
============================================================ */
/* ============================================================
43. DISCUSSIONTOOLS — pages de discussion modernes
============================================================ */
/* Boutons "Répondre", "Souscrire", "Ajouter un sujet" */
.ext-discussiontools-init-replylink-buttons .oo-ui-buttonElement-button,
.ext-discussiontools-init-section-subscribeButton .oo-ui-buttonElement-button,
.ext-discussiontools-init-new-topic .oo-ui-buttonElement-button {
background: transparent !important;
border: 1px solid rgba(125, 255, 156, 0.2) !important;
color: rgba(125, 255, 156, 0.7) !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 10px !important;
text-transform: uppercase !important;
letter-spacing: 0.1em !important;
border-radius: 2px !important;
padding: 4px 10px !important;
transition: all 0.15s !important;
}
.ext-discussiontools-init-replylink-buttons .oo-ui-buttonElement-button:hover,
.ext-discussiontools-init-section-subscribeButton .oo-ui-buttonElement-button:hover,
.ext-discussiontools-init-new-topic .oo-ui-buttonElement-button:hover {
background: rgba(125, 255, 156, 0.08) !important;
border-color: rgba(125, 255, 156, 0.5) !important;
color: #7dff9c !important;
}
/* Icônes des boutons */
.ext-discussiontools-init-replylink-buttons .oo-ui-iconElement-icon,
.ext-discussiontools-init-section-subscribeButton .oo-ui-iconElement-icon {
filter: brightness(0) saturate(100%) invert(91%) sepia(15%) saturate(594%) hue-rotate(76deg) brightness(101%) !important;
opacity: 0.65 !important;
}
/* Liens "Répondre" / "Modifier" textuels (legacy) */
.ext-discussiontools-init-replylink-reply,
.ext-discussiontools-init-replylink-open {
color: #4ab06a !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 11px !important;
text-transform: uppercase !important;
letter-spacing: 0.08em !important;
text-decoration: none !important;
}
.ext-discussiontools-init-replylink-reply:hover,
.ext-discussiontools-init-replylink-open:hover {
color: #7dff9c !important;
}
/* Conteneur d'une section commentée */
.ext-discussiontools-init-section,
.ext-discussiontools-init-highlight,
.ext-discussiontools-init-targetcomment {
background: rgba(125, 255, 156, 0.04) !important;
border-left: 2px solid rgba(125, 255, 156, 0.25) !important;
padding-left: 12px !important;
margin: 8px 0 !important;
border-radius: 2px !important;
}
/* Surlignage du commentaire ciblé (lien #cXXX) */
.ext-discussiontools-init-targetcomment {
background: rgba(245, 200, 74, 0.08) !important;
border-left-color: rgba(245, 200, 74, 0.4) !important;
}
/* Boîte d'auteur de commentaire */
.ext-discussiontools-init-timestamplink {
color: rgba(125, 255, 156, 0.5) !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 11px !important;
}
.ext-discussiontools-init-timestamplink:hover { color: #7dff9c !important; }
/* Surface d'édition inline */
.ext-discussiontools-ui-replyWidget,
.ext-discussiontools-ui-newTopic {
background: rgba(6, 15, 11, 0.85) !important;
border: 1px solid rgba(125, 255, 156, 0.2) !important;
border-radius: 3px !important;
padding: 12px !important;
margin: 8px 0 !important;
}
/* Boutons "Publier" / "Annuler" du widget réponse */
.ext-discussiontools-ui-replyWidget-actions .oo-ui-flaggedElement-progressive .oo-ui-buttonElement-button,
.ext-discussiontools-ui-replyWidget-actions .oo-ui-flaggedElement-primary .oo-ui-buttonElement-button {
background: rgba(125, 255, 156, 0.15) !important;
border: 1px solid rgba(125, 255, 156, 0.4) !important;
color: #7dff9c !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 11px !important;
text-transform: uppercase !important;
letter-spacing: 0.1em !important;
}
.ext-discussiontools-ui-replyWidget-actions .oo-ui-flaggedElement-progressive .oo-ui-buttonElement-button:hover,
.ext-discussiontools-ui-replyWidget-actions .oo-ui-flaggedElement-primary .oo-ui-buttonElement-button:hover {
background: rgba(125, 255, 156, 0.28) !important;
border-color: #7dff9c !important;
box-shadow: 0 0 10px rgba(125, 255, 156, 0.2) !important;
}
/* Mode "ping" — mention d'un utilisateur */
.ext-discussiontools-init-pingmark {
color: #7dff9c !important;
background: rgba(125, 255, 156, 0.1) !important;
border-radius: 2px !important;
padding: 0 4px !important;
}
/* ============================================================
44. ECHO — badges & menus de notifications (header)
→ MIGRÉE dans le skin : skinStyles/ext.echo.less
============================================================ */
/* ============================================================
45. CITE — références [1][2] et notes de bas de page
→ MIGRÉE dans le skin : skinStyles/ext.cite.less
============================================================ */
/* ============================================================
46. CODE INLINE & PRE — styles génériques
============================================================ */
/* La partie .mw-highlight (Pygments) est migrée dans le skin :
skinStyles/ext.pygments.less. Ne restent ici que les styles
code/tt/pre génériques, indépendants de SyntaxHighlight. */
/* Code inline `<code>` standard */
.mw-parser-output code,
.mw-parser-output tt {
background: rgba(6, 15, 11, 0.9) !important;
border: 1px solid rgba(125, 255, 156, 0.12) !important;
border-radius: 2px !important;
color: #b6ffc6 !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 0.88em !important;
padding: 1px 5px !important;
}
/* Pre standard (non-Pygments) */
.mw-parser-output pre,
.mw-parser-output .mw-code {
background: #060f0b !important;
border: 1px solid rgba(125, 255, 156, 0.15) !important;
border-radius: 3px !important;
color: #cce8d4 !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 13px !important;
line-height: 1.55 !important;
padding: 12px 14px !important;
overflow-x: auto !important;
}
/* ============================================================
47. TABBERNEUE — onglets <tabber>
============================================================ */
/* Conteneur tabber */
.tabber,
.tabber__container,
.mw-parser-output .tabber {
background: transparent !important;
border: 0 !important;
margin: 16px 0 !important;
}
/* Barre d'onglets */
.tabber__header,
.tabber__tabs {
background: rgba(6, 15, 11, 0.6) !important;
border-bottom: 1px solid rgba(125, 255, 156, 0.2) !important;
padding: 0 !important;
margin: 0 !important;
display: flex !important;
flex-wrap: wrap !important;
gap: 0 !important;
}
/* Onglet individuel */
.tabber__tab,
.tabber__header .tabber__tab,
.tabber__tabs .tabber__tab {
background: transparent !important;
border: 0 !important;
border-bottom: 2px solid transparent !important;
color: rgba(125, 255, 156, 0.5) !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 11px !important;
font-weight: 500 !important;
text-transform: uppercase !important;
letter-spacing: 0.1em !important;
padding: 10px 16px !important;
margin: 0 !important;
cursor: pointer !important;
text-decoration: none !important;
transition: all 0.15s !important;
}
.tabber__tab:hover {
color: #7dff9c !important;
background: rgba(125, 255, 156, 0.05) !important;
}
/* Onglet actif */
.tabber__tab--active,
.tabber__tab[aria-selected="true"] {
color: #7dff9c !important;
border-bottom-color: #7dff9c !important;
background: rgba(125, 255, 156, 0.08) !important;
}
/* Contenu de l'onglet */
.tabber__section,
.tabber__panel {
background: transparent !important;
border: 0 !important;
padding: 16px 0 !important;
color: #cce8d4 !important;
}
/* Indicateur de défilement (flèches >) sur petits écrans */
.tabber__header__prev,
.tabber__header__next {
background: rgba(6, 15, 11, 0.9) !important;
color: rgba(125, 255, 156, 0.6) !important;
border: 0 !important;
cursor: pointer !important;
}
.tabber__header__prev:hover,
.tabber__header__next:hover { color: #7dff9c !important; }
/* Version animée pendant la transition */
.tabber--live .tabber__section {
transition: opacity 0.2s ease;
}
/* ============================================================
48. REVISIONSLIDER — slider de diff entre versions
============================================================ */
/* Conteneur principal du slider */
.mw-revslider-container,
.mw-revslider-wrapper {
background: rgba(6, 15, 11, 0.8) !important;
border: 1px solid rgba(125, 255, 156, 0.15) !important;
border-radius: 3px !important;
color: #cce8d4 !important;
margin: 8px 0 !important;
padding: 12px !important;
}
/* Bouton toggle (déplier/replier) */
.mw-revslider-toggle-button {
background: transparent !important;
border: 1px solid rgba(125, 255, 156, 0.2) !important;
color: rgba(125, 255, 156, 0.55) !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 10px !important;
text-transform: uppercase !important;
letter-spacing: 0.1em !important;
padding: 4px 10px !important;
border-radius: 2px !important;
cursor: pointer !important;
}
.mw-revslider-toggle-button:hover {
background: rgba(125, 255, 156, 0.08) !important;
color: #7dff9c !important;
}
/* Axe horizontal (timeline) */
.mw-revslider-revisions-container,
.mw-revslider-revisions {
background: rgba(6, 15, 11, 0.6) !important;
border: 1px solid rgba(125, 255, 156, 0.1) !important;
border-radius: 2px !important;
}
/* Barres représentant chaque révision */
.mw-revslider-revision {
background: rgba(125, 255, 156, 0.25) !important;
border: 0 !important;
transition: background 0.15s !important;
}
.mw-revslider-revision:hover {
background: rgba(125, 255, 156, 0.5) !important;
}
/* Révision sélectionnée (les deux côtés du diff) */
.mw-revslider-revision-old,
.mw-revslider-revision[data-pos="older"] {
background: rgba(255, 94, 94, 0.6) !important;
}
.mw-revslider-revision-new,
.mw-revslider-revision[data-pos="newer"] {
background: rgba(125, 255, 156, 0.7) !important;
}
/* Pointers (curseurs glissants gauche/droite) */
.mw-revslider-pointer-old,
.mw-revslider-pointer-new,
.mw-revslider-pointer {
background: rgba(8, 18, 12, 0.95) !important;
border: 1px solid rgba(125, 255, 156, 0.5) !important;
color: #7dff9c !important;
border-radius: 2px !important;
}
.mw-revslider-pointer-old { border-color: rgba(255, 94, 94, 0.6) !important; }
.mw-revslider-pointer-new { border-color: rgba(125, 255, 156, 0.6) !important; }
/* Tooltips au survol d'une révision */
.mw-revslider-tooltip,
.mw-revslider-tooltip .oo-ui-popupWidget-popup {
background: rgba(8, 18, 12, 0.98) !important;
border: 1px solid rgba(125, 255, 156, 0.25) !important;
border-radius: 3px !important;
color: #cce8d4 !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 11px !important;
padding: 8px 10px !important;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.6) !important;
}
/* Liens dans le tooltip */
.mw-revslider-tooltip a { color: #7dff9c !important; }
/* Flèches navigation */
.mw-revslider-arrow {
background: transparent !important;
color: rgba(125, 255, 156, 0.5) !important;
border: 0 !important;
cursor: pointer !important;
}
.mw-revslider-arrow:hover { color: #7dff9c !important; }
/* Indicateurs de taille (+/- octets) */
.mw-revslider-revision-wrapper .mw-revslider-bar-bigger,
.mw-revslider-bar-bigger {
background: rgba(125, 255, 156, 0.6) !important;
}
.mw-revslider-revision-wrapper .mw-revslider-bar-smaller,
.mw-revslider-bar-smaller {
background: rgba(255, 94, 94, 0.6) !important;
}
/* ============================================================
49. TABLEPAGER & LISTES SPÉCIALES — pages d'admin et stats
============================================================ */
/* Tableau pager générique (Spécial:Statistiques, ListUsers, AllPages…) */
table.mw-statistics-table,
table.TablePager,
table.mw-spcontent,
.mw-special-Statistics table,
.mw-special-ActiveUsers table,
.mw-special-Listusers table,
.mw-special-Listfiles table,
.mw-special-Listredirects table,
.mw-special-Wantedpages table,
.mw-special-Mostrevisions table,
.mw-special-Brokenredirects table {
background: rgba(6, 15, 11, 0.75) !important;
border: 1px solid rgba(125, 255, 156, 0.15) !important;
border-collapse: collapse !important;
color: #cce8d4 !important;
width: 100% !important;
margin: 12px 0 !important;
}
/* Entêtes de colonnes */
.TablePager th,
.mw-statistics-table th,
table.mw-spcontent th,
.mw-special-Statistics th,
.mw-special-ActiveUsers th,
.mw-special-Listusers th,
.mw-special-Listfiles th {
background: #0f2015 !important;
border-bottom: 1px solid rgba(125, 255, 156, 0.2) !important;
color: #7dff9c !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 10px !important;
font-weight: 500 !important;
text-transform: uppercase !important;
letter-spacing: 0.1em !important;
padding: 10px 12px !important;
text-align: left !important;
}
/* En-têtes triables */
.TablePager th.TablePager_sort,
.TablePager th.headerSort,
.TablePager th.headerSortUp,
.TablePager th.headerSortDown {
cursor: pointer !important;
background-image: none !important;
}
.TablePager th.headerSortUp,
.TablePager th.headerSortDown { color: #7dff9c !important; }
.TablePager th.headerSortUp::after { content: ' ▲'; opacity: 0.7; font-size: 9px; }
.TablePager th.headerSortDown::after { content: ' ▼'; opacity: 0.7; font-size: 9px; }
/* Lignes */
.TablePager tr,
.mw-statistics-table tr,
table.mw-spcontent tr {
background: transparent !important;
border-bottom: 1px solid rgba(125, 255, 156, 0.06) !important;
}
/* Lignes alternées */
.TablePager tr:nth-child(even),
.TablePager_even {
background: rgba(125, 255, 156, 0.025) !important;
}
.TablePager tr:nth-child(odd),
.TablePager_odd {
background: transparent !important;
}
.TablePager tr:hover {
background: rgba(125, 255, 156, 0.06) !important;
}
/* Cellules */
.TablePager td,
.mw-statistics-table td,
table.mw-spcontent td {
background: transparent !important;
border: 0 !important;
color: #cce8d4 !important;
padding: 8px 12px !important;
font-size: 13px !important;
}
/* Liens dans les pagers */
.TablePager a,
.mw-statistics-table a { color: #7dff9c !important; }
.TablePager a:visited { color: #4ab06a !important; }
.TablePager a:hover { color: #b6ffc6 !important; }
/* Valeur numérique de statistiques (Spécial:Statistiques) */
.mw-statistics-numbers,
.mw-statistics-table td.mw-statistics-numbers {
font-family: 'IBM Plex Mono', monospace !important;
color: #f5c84a !important;
text-align: right !important;
font-weight: 500 !important;
}
/* Pagination des TablePagers */
.TablePager_nav,
.mw-pager-navigation-bar {
background: rgba(6, 15, 11, 0.6) !important;
border: 1px solid rgba(125, 255, 156, 0.1) !important;
border-radius: 2px !important;
padding: 8px 12px !important;
margin: 8px 0 !important;
color: rgba(204, 232, 212, 0.7) !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 11px !important;
}
.TablePager_nav a,
.mw-pager-navigation-bar a,
.mw-numlink {
color: #4ab06a !important;
border: 1px solid rgba(125, 255, 156, 0.2) !important;
background: rgba(6, 15, 11, 0.5) !important;
padding: 3px 9px !important;
margin: 0 2px !important;
border-radius: 2px !important;
text-decoration: none !important;
text-transform: uppercase !important;
letter-spacing: 0.06em !important;
font-size: 10px !important;
}
.TablePager_nav a:hover,
.mw-pager-navigation-bar a:hover {
background: rgba(125, 255, 156, 0.1) !important;
border-color: rgba(125, 255, 156, 0.4) !important;
color: #7dff9c !important;
}
/* Filtres en haut des pagers */
.mw-pager-body,
.mw-pager-tools,
.mw-htmlform-ooui-wrapper {
background: transparent !important;
border: 0 !important;
}
/* Page Spécial:Contributions — fond des lignes */
.mw-contributions-list li,
.mw-special-Contributions ul li {
border-bottom: 1px solid rgba(125, 255, 156, 0.05) !important;
padding: 4px 0 !important;
background: transparent !important;
color: #cce8d4 !important;
}
.mw-contributions-list li:hover {
background: rgba(125, 255, 156, 0.04) !important;
}
/* Liens utilisateur / page dans les listes */
.mw-userlink,
.mw-changeslist-line .mw-userlink {
color: #7dff9c !important;
font-weight: 500 !important;
}
.mw-userlink:hover { color: #b6ffc6 !important; }
/* Boutons "annuler" / "défaire" / "rollback" dans les listes */
.mw-rollback-link a,
.mw-history-undo a,
.mw-changeslist-links a {
color: #f5c84a !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 10px !important;
text-transform: uppercase !important;
letter-spacing: 0.08em !important;
}
.mw-rollback-link a:hover,
.mw-history-undo a:hover { color: #ffe080 !important; }
/* Journaux (Spécial:Journal) */
.mw-logevent-loglines,
.mw-special-Log .mw-logline,
ul.mw-logevent-loglines li {
background: transparent !important;
border-bottom: 1px solid rgba(125, 255, 156, 0.05) !important;
padding: 6px 0 !important;
color: #cce8d4 !important;
font-size: 13px !important;
}
.mw-logevent-loglines li:hover { background: rgba(125, 255, 156, 0.04) !important; }
.mw-logline-action {
color: rgba(125, 255, 156, 0.5) !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 11px !important;
}
.mw-logevent-actionlink {
color: #4ab06a !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 10px !important;
text-transform: uppercase !important;
}
/* Marqueurs (m, b, n) dans RC/historique */
.mw-changeslist-flags abbr,
abbr.minoredit,
abbr.botedit,
abbr.newpage,
abbr.unpatrolled {
background: rgba(125, 255, 156, 0.08) !important;
border: 1px solid rgba(125, 255, 156, 0.2) !important;
color: #7dff9c !important;
border-radius: 2px !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 9px !important;
font-weight: 600 !important;
padding: 0 4px !important;
margin: 0 1px !important;
text-decoration: none !important;
}
/* Différence d'octets (+12 / -45) */
.mw-plusminus-pos {
color: #7dff9c !important;
font-family: 'IBM Plex Mono', monospace !important;
font-weight: 500 !important;
}
.mw-plusminus-neg {
color: #ff7a7a !important;
font-family: 'IBM Plex Mono', monospace !important;
font-weight: 500 !important;
}
.mw-plusminus-null {
color: rgba(125, 255, 156, 0.4) !important;
font-family: 'IBM Plex Mono', monospace !important;
}
.mw-plusminus-bold {
font-weight: 700 !important;
}
/* ============================================================
50. PAGES FICHIER (Namespace File:) — Spécial:ImagePage
============================================================ */
/* TOC haut de page "Fichier / Historique / Utilisation" */
#filetoc,
ul#filetoc {
background: rgba(6, 15, 11, 0.85) !important;
border: 1px solid rgba(125, 255, 156, 0.15) !important;
border-radius: 3px !important;
color: #cce8d4 !important;
padding: 8px 14px !important;
margin: 12px 0 !important;
list-style: none !important;
display: flex !important;
flex-wrap: wrap !important;
gap: 0 !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 10px !important;
text-transform: uppercase !important;
letter-spacing: 0.12em !important;
text-align: center !important;
justify-content: center !important;
}
#filetoc li {
display: inline !important;
background: transparent !important;
border: 0 !important;
padding: 0 !important;
margin: 0 !important;
}
#filetoc li::before {
content: '·' !important;
margin: 0 10px !important;
color: rgba(125, 255, 156, 0.3) !important;
}
#filetoc li:first-child::before { display: none !important; }
#filetoc a {
color: rgba(125, 255, 156, 0.65) !important;
text-decoration: none !important;
letter-spacing: 0.12em !important;
}
#filetoc a:hover { color: #7dff9c !important; }
/* Conteneur principal de l'image */
.fullImageLink,
#file,
.mw-filepage-image {
background: transparent !important;
text-align: center !important;
margin: 16px 0 !important;
}
.fullImageLink a,
.fullImageLink img,
#file a,
#file img {
background: transparent !important;
border: 0 !important;
display: inline-block !important;
}
/* Image elle-même : juste un cadre discret */
.fullImageLink img,
#file > a > img {
border: 1px solid rgba(125, 255, 156, 0.15) !important;
border-radius: 2px !important;
background: rgba(6, 15, 11, 0.4) !important;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5) !important;
}
/* Texte "Pas de plus haute résolution disponible" + lien filename */
.mw-filepage-resolutioninfo,
.fullMedia {
color: rgba(204, 232, 212, 0.65) !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 11px !important;
text-align: center !important;
margin: 8px 0 !important;
background: transparent !important;
}
.fullMedia a,
.mw-filepage-resolutioninfo a {
color: #7dff9c !important;
font-weight: 500 !important;
text-decoration: none !important;
border-bottom: 1px solid rgba(125, 255, 156, 0.25) !important;
}
.fullMedia a:hover {
color: #b6ffc6 !important;
border-bottom-color: #7dff9c !important;
}
/* Informations sur le fichier (taille, type MIME) */
.fileInfo,
.mw-filepage-mime,
.mw-filepage-dimensions {
color: rgba(204, 232, 212, 0.6) !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 11px !important;
}
/* Tableau d'historique du fichier */
table.filehistory,
.filehistory {
background: rgba(12, 24, 18, 0.85) !important;
border: 1px solid rgba(125, 255, 156, 0.15) !important;
border-collapse: collapse !important;
width: 100% !important;
color: #cce8d4 !important;
margin: 12px 0 !important;
}
.filehistory th {
background: #0f2015 !important;
border-bottom: 1px solid rgba(125, 255, 156, 0.2) !important;
color: #7dff9c !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 10px !important;
font-weight: 500 !important;
text-transform: uppercase !important;
letter-spacing: 0.12em !important;
padding: 10px 12px !important;
text-align: left !important;
}
.filehistory td {
background: transparent !important;
border-bottom: 1px solid rgba(125, 255, 156, 0.06) !important;
color: #cce8d4 !important;
padding: 10px 12px !important;
vertical-align: middle !important;
font-size: 13px !important;
}
.filehistory tr:hover td {
background: rgba(125, 255, 156, 0.04) !important;
}
/* Marqueur "actuel" dans l'historique */
.filehistory td.filehistory-selected,
.filehistory tr.filehistory-selected td {
background: rgba(125, 255, 156, 0.06) !important;
color: #7dff9c !important;
}
/* Vignettes dans le tableau d'historique */
.filehistory img,
.filehistory a img,
.filehistory .mw-thumbnail-link img {
background: rgba(6, 15, 11, 0.6) !important;
border: 1px solid rgba(125, 255, 156, 0.15) !important;
border-radius: 2px !important;
padding: 2px !important;
}
/* Liens de date dans l'historique */
.filehistory a {
color: #7dff9c !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 11px !important;
text-decoration: none !important;
}
.filehistory a:hover { color: #b6ffc6 !important; }
/* "Vous ne pouvez pas remplacer ce fichier" / autres messages */
.mw-filepage-other-versions,
.mw-filepage-upload-error,
.sharedUploadNotice {
background: rgba(6, 15, 11, 0.6) !important;
border: 1px solid rgba(245, 200, 74, 0.2) !important;
border-left: 3px solid rgba(245, 200, 74, 0.5) !important;
color: rgba(204, 232, 212, 0.85) !important;
padding: 10px 14px !important;
border-radius: 2px !important;
margin: 12px 0 !important;
font-style: italic !important;
}
/* Section "Utilisation du fichier" */
#mw-imagepage-section-linkstoimage,
.mw-imagepage-linkstoimage {
background: transparent !important;
}
.mw-imagepage-linkstoimage ul,
#mw-imagepage-section-linkstoimage ul {
background: rgba(6, 15, 11, 0.5) !important;
border: 1px solid rgba(125, 255, 156, 0.08) !important;
border-radius: 2px !important;
padding: 12px 16px 12px 36px !important;
margin: 8px 0 !important;
list-style: square !important;
}
.mw-imagepage-linkstoimage li,
#mw-imagepage-section-linkstoimage li {
color: #cce8d4 !important;
padding: 3px 0 !important;
}
.mw-imagepage-linkstoimage li::marker {
color: rgba(125, 255, 156, 0.4) !important;
}
/* Métadonnées EXIF (souvent collapsible) */
.mw_metadata,
table.mw_metadata {
background: rgba(6, 15, 11, 0.6) !important;
border: 1px solid rgba(125, 255, 156, 0.1) !important;
color: #cce8d4 !important;
margin: 12px 0 !important;
}
.mw_metadata th {
background: rgba(15, 32, 21, 0.5) !important;
color: rgba(125, 255, 156, 0.65) !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 10px !important;
text-transform: uppercase !important;
letter-spacing: 0.08em !important;
text-align: left !important;
padding: 6px 12px !important;
}
.mw_metadata td {
background: transparent !important;
border-bottom: 1px solid rgba(125, 255, 156, 0.05) !important;
color: rgba(204, 232, 212, 0.75) !important;
padding: 6px 12px !important;
font-size: 12px !important;
}
/* Liens de section [modifier | modifier le wikicode] dans pages File: */
.mw-editsection-bracket {
color: rgba(125, 255, 156, 0.3) !important;
}
.mw-editsection a {
color: rgba(125, 255, 156, 0.5) !important;
}
.mw-editsection a:hover { color: #7dff9c !important; }
/* Cas spécifique : namespace File: utilise des wikitables pour l'historique
mais sans la classe wikitable — on cible la table principale du contenu */
.mw-special-Filepage table:not(.wikitable):not(.va-table):not(.avt-infobox) {
background: rgba(12, 24, 18, 0.85) !important;
color: #cce8d4 !important;
}
.mw-special-Filepage table:not(.wikitable):not(.va-table):not(.avt-infobox) th {
background: #0f2015 !important;
color: #7dff9c !important;
}
.mw-special-Filepage table:not(.wikitable):not(.va-table):not(.avt-infobox) td {
background: transparent !important;
color: #cce8d4 !important;
border-bottom: 1px solid rgba(125, 255, 156, 0.06) !important;
}
/* ============================================================
51. MULTIMEDIAVIEWER (MMV) — lightbox d'image + boutons Codex
→ MIGRÉE dans le skin : skinStyles/mmv.less + codex.less
============================================================ */
/* ============================================================
52. VE DIALOG — fix bande blanche dans le panneau d'édition
→ MIGRÉE dans le skin : skinStyles/oojs-ui-windows.less
============================================================ */
/* ============================================================
53. CORRECTIONS CIBLÉES — toolbars dialogues, popups, checkboxes
============================================================ */
/* Blocs (1), (2), (6) migrés dans skinStyles/ve-overrides.less ;
bloc (3) dans skinStyles/oojs-ui-core.less + codex.less ;
bloc (5) dans skinStyles/mediawiki.widgets.less.
Ne reste ici que le bloc (4), qui surcharge la section 41. */
/* ─── (4) Popups d'aperçu d'article : retirer le filtre hue-rotate ───
Le filtre hue-rotate(-8deg) sur les miniatures donnait une teinte
vert pomme indistincte aux images. À retirer pour garder les couleurs
d'origine. */
.mwe-popups .mwe-popups-thumbnail image,
.mwe-popups svg.mwe-popups-thumbnail image {
filter: none !important;
}
/* ============================================================
54. WIDGET RECHERCHE VE — vignettes lisibles
→ MIGRÉE dans le skin : skinStyles/mediawiki.widgets.less
============================================================ */
/* ============================================================
55. VE — Dialogues modaux au-dessus de la toolbar
→ MIGRÉE dans le skin : skinStyles/oojs-ui-windows.less
============================================================ */
/* ============================================================
56. BOUTONS OOUI FRAMED — fond clair par défaut OOUI/Codex
→ MIGRÉE dans le skin : skinStyles/oojs-ui-core.less
============================================================ */
/* ============================================================
57. BANDEAU DISCORD — barre fixe en bas de page
============================================================ */
.vt-discord-banner {
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: 1500;
display: flex;
align-items: center;
gap: 16px;
padding: 12px 24px;
background: rgba(8, 18, 12, 0.97);
border-top: 1px solid rgba(125, 255, 156, 0.35);
box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.6);
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
font-family: 'IBM Plex Mono', monospace;
color: #cce8d4;
transition: transform 0.35s ease, opacity 0.35s ease;
}
.vt-discord-banner.vt-banner-hidden {
transform: translateY(100%);
opacity: 0;
pointer-events: none;
}
/* Texte principal — prend l'espace flexible, à gauche */
.vt-banner-text {
flex: 1;
font-size: 13px;
line-height: 1.5;
}
.vt-banner-text strong {
color: #7dff9c;
font-weight: 600;
letter-spacing: 0.02em;
}
/* Bloc icône + compteur, collé à droite à côté du bouton Rejoindre */
.vt-banner-info {
display: flex;
align-items: center;
gap: 8px;
flex-shrink: 0;
}
.vt-banner-icon {
display: flex;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
flex-shrink: 0;
color: #7dff9c;
}
.vt-banner-icon svg {
width: 24px;
height: 24px;
fill: currentColor;
}
.vt-banner-members {
font-size: 12px;
color: #7dff9c;
font-weight: 600;
white-space: nowrap;
flex-shrink: 0;
}
/* Bouton Rejoindre */
.vt-banner-btn {
display: inline-flex;
align-items: center;
gap: 6px;
background: rgba(125, 255, 156, 0.12);
border: 1px solid rgba(125, 255, 156, 0.4);
border-radius: 2px;
color: #7dff9c !important;
font-family: 'IBM Plex Mono', monospace;
font-size: 11px;
font-weight: 600;
letter-spacing: 0.12em;
text-transform: uppercase;
text-decoration: none !important;
padding: 8px 18px;
cursor: pointer;
transition: all 0.15s;
flex-shrink: 0;
}
.vt-banner-btn:hover {
background: rgba(125, 255, 156, 0.22);
border-color: #7dff9c;
box-shadow: 0 0 12px rgba(125, 255, 156, 0.25);
color: #b6ffc6 !important;
}
/* Bouton fermer */
.vt-banner-close {
display: flex;
align-items: center;
justify-content: center;
width: 28px;
height: 28px;
border-radius: 50%;
background: transparent;
border: 1px solid rgba(125, 255, 156, 0.2);
color: rgba(125, 255, 156, 0.5);
font-size: 18px;
line-height: 1;
cursor: pointer;
flex-shrink: 0;
transition: all 0.15s;
}
.vt-banner-close:hover {
border-color: #ff7a7a;
color: #ff7a7a;
background: rgba(255, 122, 122, 0.08);
}
/* Respecte prefers-reduced-motion : pas d'animation d'entrée/sortie */
@media (prefers-reduced-motion: reduce) {
.vt-discord-banner { transition: none; }
}
/* Mobile */
@media (max-width: 720px) {
.vt-discord-banner {
flex-wrap: wrap;
gap: 10px;
padding: 10px 16px;
}
.vt-banner-text {
flex: 1 1 100%;
font-size: 12px;
order: 1;
}
.vt-banner-info {
order: 2;
}
.vt-banner-close {
order: 3;
margin-left: auto;
}
.vt-banner-btn {
order: 4;
flex: 1 1 100%;
justify-content: center;
padding: 10px;
}
}