/* Thème sombre épuré par-dessus Twenty Twenty : aplats, pas de dégradé ni de lueur. Les @font-face sont dans fonts.css. */

:root {
	--fond: #0b0f1a;
	--surface: #121827;
	--surface2: #182033;
	--bord: #252e45;
	--or: #e3bc5c;
	--violet: #a493f5;
	--texte-clair: #e7e9f1;
	--doux: #98a1b9;
	--rubis: #ef6f7f;
	--emeraude: #5ccf9e;
	--ambre: #f0a751;
	--azur: #6fb3f5;
	--titres: 'Cinzel', Georgia, serif;
	--texte: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	--rayon: 10px;
	color-scheme: dark;
}

/* ---------- Base ---------- */

html, body, #site-content, .post-inner, article, .entry-content { background: var(--fond) !important; }
body, .entry-content, .entry-content p, .entry-content li, .entry-content td, .entry-content th {
	color: var(--texte-clair);
	font-family: var(--texte);
}
::selection { background: var(--or); color: var(--fond); }

a, .entry-content a { color: var(--or); text-decoration-color: rgba(227, 188, 92, .4); text-underline-offset: .2em; }
a:hover, a:focus, .entry-content a:hover { color: #fff; text-decoration-color: currentColor; }

h1, h2, h3, h4, h5, h6, .entry-title, .site-title,
.entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4, .entry-content h5, .entry-content h6 {
	color: #fff;
	font-family: var(--texte);
	font-weight: 650;
	letter-spacing: 0;
}
.entry-title, .site-title, .entry-content h2 { font-family: var(--titres); font-weight: 700; letter-spacing: .02em; }
strong, b { color: #fff; font-weight: 650; }
hr, hr.styled-separator { color: var(--bord); border-color: var(--bord); }

/* Pas de lien « Modifier », ni de bouton Recherche. */
.edit-link, .post-meta-wrapper, .search-toggle, .header-toggles .search-toggle-wrapper { display: none !important; }

/* ---------- En-tête ---------- */

#site-header, .header-footer-group { background: var(--fond) !important; color: var(--texte-clair); }
#site-header { border-bottom: 1px solid var(--bord); }
.header-inner { padding: 1.8rem 0; }
.site-title a { color: #fff !important; font-weight: 700; letter-spacing: .06em; display: inline-flex; align-items: center; gap: 1rem; }
.site-title a::before {
	content: "";
	width: 2.6rem; height: 2.6rem;
	flex: none;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%23e3bc5c' stroke-width='2' stroke-linejoin='round'%3E%3Cpolygon points='24,3 43,14 43,34 24,45 5,34 5,14'/%3E%3Cpolygon points='24,13 34,31 14,31'/%3E%3Cpath d='M24 3v10M43 14 34 31M43 34 34 31M24 45 34 31M24 45 14 31M5 34 14 31M5 14 14 31M5 14 24 13M43 14 24 13'/%3E%3C/svg%3E") center / contain no-repeat;
}
.site-description { color: var(--doux) !important; font-family: var(--texte); font-size: 1.5rem; }
.primary-menu a, .modal-menu a, .header-inner .toggle, .toggle-inner .toggle-text {
	color: var(--doux) !important;
	font-family: var(--texte);
	font-weight: 500;
}
.primary-menu > li > a { font-size: 1.6rem; }
.primary-menu a:hover, .primary-menu a:focus, .modal-menu a:hover,
.primary-menu .current-menu-item > a, .primary-menu .current_page_item > a { color: #fff !important; text-decoration: none; }
.primary-menu .current-menu-item > a::after, .primary-menu .current_page_item > a::after {
	content: ""; display: block; height: 2px; margin-top: .4rem; background: var(--or);
}
.toggle .svg-icon, .toggle svg { fill: var(--texte-clair) !important; color: var(--texte-clair) !important; }
.menu-modal, .menu-modal-inner { background: var(--fond) !important; }
.modal-menu li, .modal-menu > li > .ancestor-wrapper, .menu-modal .menu-bottom { border-color: var(--bord) !important; }
.menu-modal .close-nav-toggle { color: var(--texte-clair) !important; }

/* ---------- Titre de page ---------- */

.singular .entry-header, .entry-header { background: transparent !important; padding: 6rem 0 2rem; }
.entry-title, h1.entry-title { font-size: clamp(3.4rem, 6vw, 5.6rem); color: #fff !important; }
.entry-header::after { content: ""; display: block; width: 4.8rem; height: 3px; margin: 2rem auto 0; background: var(--or); border-radius: 2px; }
.post-inner { padding-top: 2rem; }

/* ---------- Contenu générique ---------- */

.entry-content { font-size: 1.75rem; line-height: 1.6; }
.entry-content blockquote {
	border: 0;
	border-left: 3px solid var(--or);
	background: var(--surface);
	border-radius: 0 var(--rayon) var(--rayon) 0;
	padding: 1.6rem 2rem;
	font-style: italic;
}
.entry-content small { color: var(--doux); }
input[type="text"], input[type="search"], input[type="password"], textarea { background: var(--surface); color: var(--texte-clair); border-color: var(--bord); }

/* ---------- Composants (.dnd) ---------- */

.dnd { font-size: 1.75rem; }
.dnd h2 { font-size: 2.4rem; margin: 5rem 0 1.6rem; padding: 0; border: 0; color: #fff; }
.dnd h3 { font-size: 1.9rem; margin: 2.6rem 0 1rem; color: #fff; }
.dnd p, .dnd li { line-height: 1.6; }
.dnd .intro { font-size: 2rem; color: var(--texte-clair); }

.dnd .stats { display: grid; grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); gap: 1rem; margin: 2.4rem 0; }
.dnd .stat { text-align: center; padding: 1.4rem .8rem 1.2rem; background: var(--surface); border: 1px solid var(--bord); border-radius: var(--rayon); }
.dnd .stat b { display: block; font-size: 2.8rem; font-weight: 700; line-height: 1.1; color: #fff; font-variant-numeric: tabular-nums; }
.dnd .stat span { display: block; margin-top: .5rem; font-size: 1.25rem; line-height: 1.3; color: var(--doux); }
.dnd .stat.cle { border-color: rgba(227, 188, 92, .55); }
.dnd .stat.cle b { color: var(--or); }

.dnd .tableau { overflow-x: auto; margin: 1.2rem 0 2.4rem; border: 1px solid var(--bord); border-radius: var(--rayon); }
.dnd table { font-size: 1.55rem; margin: 0; width: 100%; border-collapse: collapse; border: 0; }
.dnd th, .dnd td { padding: .9rem 1.2rem; vertical-align: top; border: 0; border-bottom: 1px solid var(--bord); text-align: left; }
.dnd tr:last-child td { border-bottom: 0; }
.dnd th { background: var(--surface2); color: var(--doux); font-size: 1.25rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; }
.dnd td { background: var(--surface); }

.dnd .boite { background: var(--surface); border: 1px solid var(--bord); border-left: 3px solid var(--azur); border-radius: var(--rayon); padding: 1.6rem 2rem; margin: 2rem 0; }
.dnd .boite.astuce { border-left-color: var(--emeraude); }
.dnd .boite.attention { border-left-color: var(--ambre); }
.dnd .boite.manque { border-left-color: var(--rubis); }
.dnd .boite > :first-child { margin-top: 0; }
.dnd .boite > :last-child { margin-bottom: 0; }

.dnd .etiquette {
	display: inline-block; font-size: 1.15rem; font-weight: 600; letter-spacing: .02em;
	padding: .15rem .65rem; border-radius: 99px; white-space: nowrap; vertical-align: .1em;
	background: var(--surface2); color: var(--doux); border: 1px solid var(--bord);
}
.dnd .etiquette.conc { color: var(--violet); border-color: rgba(164, 147, 245, .45); }
.dnd .etiquette.bonus { color: var(--emeraude); border-color: rgba(92, 207, 158, .45); }
.dnd .etiquette.reac { color: var(--ambre); border-color: rgba(240, 167, 81, .45); }

.dnd .tour { background: var(--surface); border: 1px solid var(--bord); border-radius: var(--rayon); padding: 1.8rem 2rem; margin: 1.4rem 0; }
.dnd .tour h3 { margin-top: 0; }
.dnd .tour .tableau td { background: var(--fond); }
.dnd .tour > :last-child, .dnd .tour ul:last-child { margin-bottom: 0; }

/* ---------- Accueil ---------- */

.dnd .hero { text-align: center; margin: 0 0 3rem; }
.dnd .hero p { font-size: 1.95rem; color: var(--doux); max-width: 56rem; margin: 0 auto; }
.dnd .persos { display: grid; grid-template-columns: repeat(auto-fill, minmax(24rem, 1fr)); gap: 1.2rem; margin: 3rem 0; }
.dnd .persos a, .dnd .liens a {
	display: flex;
	flex-direction: column;
	padding: 2.2rem 2rem;
	background: var(--surface);
	border: 1px solid var(--bord);
	border-radius: var(--rayon);
	text-decoration: none;
	color: var(--doux);
	font-size: 1.55rem;
	line-height: 1.5;
	transition: border-color .15s, background-color .15s;
}
.dnd .persos a:hover, .dnd .persos a:focus, .dnd .liens a:hover, .dnd .liens a:focus { border-color: var(--or); background: var(--surface2); }
.dnd .icone { width: 4.4rem; height: 4.4rem; display: grid; place-items: center; border-radius: 50%; margin-bottom: 1.6rem; color: var(--or); border: 1px solid var(--bord); }
.dnd .icone svg { width: 2.4rem; height: 2.4rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.dnd .persos strong, .dnd .liens strong { display: block; font-family: var(--titres); font-size: 2.2rem; color: #fff; margin-bottom: .3rem; }
.dnd .persos .classe { display: block; font-size: 1.3rem; font-weight: 600; color: var(--or); margin-bottom: .9rem; }
.dnd .liens { display: grid; grid-template-columns: repeat(auto-fit, minmax(28rem, 1fr)); gap: 1.2rem; margin: 1.6rem 0 3rem; }
.dnd .liens a { flex-direction: row; align-items: center; gap: 1.6rem; padding: 1.8rem 2rem; }
.dnd .liens .icone { margin: 0; flex: none; }
.dnd .liens strong { font-size: 1.8rem; }
.dnd .note-bas { text-align: center; color: var(--doux); font-size: 1.4rem; }

/* ---------- Pied de page maison ---------- */

#site-footer, .footer-nav-widgets-wrapper { display: none !important; }
.dnd-pied { margin-top: 5rem; padding: 3.6rem 2rem 4rem; text-align: center; border-top: 1px solid var(--bord); color: var(--doux); font-family: var(--texte); }
.dnd-pied-interieur { max-width: 120rem; margin: 0 auto; }
.dnd-pied-titre { font-family: var(--titres); font-weight: 700; color: #fff; letter-spacing: .06em; font-size: 1.7rem; margin: 0 0 1.2rem; }
.dnd-pied ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem 2.4rem; }
.dnd-pied li { margin: 0; }
.dnd-pied a { font-size: 1.5rem; color: var(--doux); text-decoration: none; }
.dnd-pied a:hover, .dnd-pied a:focus { color: #fff; }
.dnd-pied-note { margin: 1.6rem 0 0; font-size: 1.35rem; }

/* ---------- Petits écrans ---------- */

@media (max-width: 700px) {
	.dnd, .entry-content { font-size: 1.65rem; }
	.dnd .stats { grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr)); gap: .8rem; }
	.dnd .stat b { font-size: 2.3rem; }
	.singular .entry-header, .entry-header { padding: 4rem 0 1.6rem; }
}
@media (prefers-reduced-motion: reduce) {
	.dnd .persos a, .dnd .liens a { transition: none; }
}

/* Twenty Twenty coupe les mots n'importe où dans les cellules. */
.dnd th, .dnd td { word-break: normal; overflow-wrap: normal; hyphens: manual; }
.dnd td:first-child { min-width: 12rem; }

/* Twenty Twenty souligne déjà le lien actif : on ne garde que le trait doré. */
.primary-menu a, .primary-menu .current-menu-item > a, .primary-menu .current_page_item > a,
.primary-menu a:hover, .primary-menu a:focus { text-decoration: none !important; }
