/* =============================================================================
   DataGrade — thèmes clair et sombre de l'espace élève : sobres et professionnels
   =============================================================================

   Chaque thème a sa classe sur <html> (theme-light, theme-dark…), posée par le
   script anti-flash d'eleve_header.php et par theme-switcher.js. Les règles de
   ce fichier sont préfixées par html:is(.theme-light, .theme-dark) : le clair et
   le sombre partagent la même mise en page, seules les couleurs changent (les
   deux blocs de variables ci-dessous). Les autres thèmes (hacker, Barbie, disco…)
   gardent leur habillage, retravaillé à part.

   Principes : un fond neutre, des cartes à filet fin, une seule couleur
   d'accent par élément, pas de dégradés ni d'emojis décoratifs, des
   étiquettes rectangulaires au lieu des pilules, des icônes au trait.
   ============================================================================= */

/* Clair : fond papier, cartes blanches. */
html.theme-light {
    --s-violet-bg: #F0EDFA; --s-violet-fg: #4A2D9C;
    --s-coral-bg:  #FBEDEE; --s-coral-fg:  #A1263B;
    --s-mint-bg:   #E9F4EE; --s-mint-fg:   #17694C;
    --s-amber-bg:  #FAF2E1; --s-amber-fg:  #87570C;
    --s-red-bg:    #FDECEC; --s-red-fg:    #B42318;
    --s-exam-border: #EFC9C9; --s-exam-border-h: #E2A9A9; --s-exam-line: #C0262D; --s-exam-btn: #B42318;
    --s-live-line: #D97706;
    --s-ok: #15803D;
    --s-tile-mix: 9%;

    --bg:        #F7F6F3;
    --bg-elev:   #FFFFFF;
    --ink:       #18161D;
    --ink-soft:  #45414F;
    --ink-muted: #6E6979;
    --line:      #E6E3E9;
    --line-soft: #F1EFF3;
    --line-strong: #CFCAD6;

    --shadow-sm: 0 1px 2px rgba(24, 22, 29, 0.05);
    --shadow-md: 0 1px 3px rgba(24, 22, 29, 0.06), 0 6px 16px -8px rgba(24, 22, 29, 0.12);
    --shadow-lg: 0 16px 32px -14px rgba(24, 22, 29, 0.18), 0 4px 10px -6px rgba(24, 22, 29, 0.08);
    --shadow-xl: 0 28px 56px -20px rgba(24, 22, 29, 0.22), 0 8px 16px -10px rgba(24, 22, 29, 0.10);
}

/* Sombre : graphite neutre (plus de reflets violets), textes blanc cassé. */
html.theme-dark {
    --bg:        #111216;
    --bg-elev:   #1A1B21;
    --ink:       #ECEBF0;
    --ink-soft:  #C3C0CC;
    --ink-muted: #8E8A99;
    --line:      #2A2B33;
    --line-soft: #212228;
    --line-strong: #3B3D47;

    --s-violet-bg: rgba(167, 139, 250, 0.14); --s-violet-fg: #C4B5FD;
    --s-coral-bg:  rgba(251, 113, 133, 0.14); --s-coral-fg:  #FDA4AF;
    --s-mint-bg:   rgba(52, 211, 153, 0.13);  --s-mint-fg:   #6EE7B7;
    --s-amber-bg:  rgba(251, 191, 36, 0.13);  --s-amber-fg:  #FCD34D;
    --s-red-bg:    rgba(248, 113, 113, 0.15); --s-red-fg:    #FCA5A5;
    --s-exam-border: rgba(248, 113, 113, 0.35); --s-exam-border-h: rgba(248, 113, 113, 0.55); --s-exam-line: #EF4444; --s-exam-btn: #DC2626;
    --s-live-line: #F59E0B;
    --s-ok: #4ADE80;
    --s-tile-mix: 16%;

    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
    --shadow-md: 0 1px 2px rgba(0, 0, 0, 0.35), 0 8px 20px -10px rgba(0, 0, 0, 0.6);
    --shadow-lg: 0 16px 32px -14px rgba(0, 0, 0, 0.6), 0 4px 10px -6px rgba(0, 0, 0, 0.4);
    --shadow-xl: 0 28px 56px -20px rgba(0, 0, 0, 0.7), 0 8px 16px -10px rgba(0, 0, 0, 0.45);
}

/* Emojis décoratifs (dans les titres, les étiquettes) : retirés. */
html:is(.theme-light, .theme-dark) .dg-emoji { display: none; }

/* ─── Barre du haut ──────────────────────────────────────────────────────── */
html:is(.theme-light, .theme-dark) .eleve-topbar { padding: 12px 28px; }
html:is(.theme-light, .theme-dark) .eleve-topbar__brand { font-weight: 700; }
html:is(.theme-light, .theme-dark) .eleve-topbar__brand .brand__mark { box-shadow: none; border-radius: 7px; }
html:is(.theme-light, .theme-dark) .eleve-topbar__name { font-weight: 600; font-size: 14px; }
html:is(.theme-light, .theme-dark) .eleve-topbar .user__avatar {
    width: 32px; height: 32px; font-size: 13.5px; font-weight: 600;
    background: var(--violet-50); color: var(--violet-700);
    box-shadow: inset 0 0 0 1px var(--violet-100);
}
html:is(.theme-light, .theme-dark) body.eleve-app .eleve-topbar__meteo {
    padding: 0; background: none; box-shadow: none; border-radius: 0;
    color: var(--ink-muted); font-weight: 500; font-size: 13px;
}
html:is(.theme-light, .theme-dark) .eleve-topbar__clock { font-weight: 500; }
html:is(.theme-light, .theme-dark) .eleve-topbar__nav a,
html:is(.theme-light, .theme-dark) .theme-menu > summary { font-weight: 500; }

/* ─── Mes classes (comptes liés) : onglets ───────────────────────────────── */
html:is(.theme-light, .theme-dark) .eleve-classes {
    gap: 6px; padding: 0 0 14px; margin-bottom: 22px;
    background: none; border: 0; border-bottom: 1px solid var(--line); border-radius: 0;
    font-size: 13px;
}
html:is(.theme-light, .theme-dark) .eleve-classes__label { font-weight: 500; color: var(--ink-muted); margin-right: 4px; }
html:is(.theme-light, .theme-dark) .eleve-classes__chip {
    gap: 7px; padding: 5px 11px; border-radius: 6px; font-weight: 500;
    background: var(--bg-elev); color: var(--ink-soft); border: 1px solid var(--line);
}
html:is(.theme-light, .theme-dark) a.eleve-classes__chip:hover { border-color: var(--line-strong); color: var(--ink); }
html:is(.theme-light, .theme-dark) .eleve-classes__chip.is-current { font-weight: 600; background: var(--ink); color: var(--bg-elev); border-color: var(--ink); }
html:is(.theme-light, .theme-dark) .eleve-classes__dot { width: 7px; height: 7px; }
html:is(.theme-light, .theme-dark) .eleve-classes__chip.is-current .eleve-classes__dot { border: 0; }
html:is(.theme-light, .theme-dark) .eleve-classes__go { display: none; }
html:is(.theme-light, .theme-dark) .eleve-classes__xp strong { color: var(--ink); font-weight: 600; }

/* ─── Lien vers le classement ────────────────────────────────────────────── */
html:is(.theme-light, .theme-dark) .eleve-leaderboard-link {
    gap: 8px; padding: 7px 12px; margin-bottom: 4px;
    font-size: 13.5px; font-weight: 600; color: var(--ink-soft);
    border-radius: 8px; border-color: var(--line); background: var(--bg-elev);
}
html:is(.theme-light, .theme-dark) .eleve-leaderboard-link img { display: none; }
html:is(.theme-light, .theme-dark) .eleve-leaderboard-link:hover { transform: none; box-shadow: none; border-color: var(--line-strong); color: var(--ink); }

/* ─── En-tête « Choisis ton activité » : aligné à gauche, Liu en petit ───── */
html:is(.theme-light, .theme-dark) .eleve-state--list {
    display: grid; grid-template-columns: 56px minmax(0, 1fr); column-gap: 16px; align-items: center;
    text-align: left; padding: 22px 0 4px;
}
html:is(.theme-light, .theme-dark) .eleve-state--list > * { grid-column: 1 / -1; }
html:is(.theme-light, .theme-dark) .eleve-state--list > .eleve-liu-link { grid-column: 1; grid-row: 1 / span 2; margin: 0; }
html:is(.theme-light, .theme-dark) .eleve-state--list > .eleve-state__title,
html:is(.theme-light, .theme-dark) .eleve-state--list > .eleve-state__lead { grid-column: 2; }
html:is(.theme-light, .theme-dark) .eleve-state--list > .eleve-state__title { margin: 0; align-self: end; font-size: 24px; }
html:is(.theme-light, .theme-dark) .eleve-state--list > .eleve-state__lead { margin: 3px 0 0; max-width: none; align-self: start; font-size: 14.5px; color: var(--ink-muted); }
html:is(.theme-light, .theme-dark) .eleve-state__title { font-weight: 700; letter-spacing: -0.015em; }
html:is(.theme-light, .theme-dark) .eleve-liu {
    width: 88px; height: 88px; padding: 5px;
    background: var(--violet-50); box-shadow: 0 0 0 1px var(--line);
}
html:is(.theme-light, .theme-dark) .eleve-state--list .eleve-liu { width: 56px; height: 56px; padding: 3px; margin: 0; animation: none; }
html:is(.theme-light, .theme-dark) .eleve-liu-link:hover .eleve-liu { box-shadow: 0 0 0 1px var(--violet-200); }
html:is(.theme-light, .theme-dark) .eleve-state__badge .dot { animation: none; }

/* ─── Cartes d'activité ──────────────────────────────────────────────────── */
html:is(.theme-light, .theme-dark) .quiz-choices { gap: 10px; margin-top: 22px; }
html:is(.theme-light, .theme-dark) .quiz-choice { border: 1px solid var(--line); border-radius: 10px; }
html:is(.theme-light, .theme-dark) .quiz-choices > .quiz-choice:hover {
    transform: none; border-color: var(--line-strong); box-shadow: var(--shadow-md);
}
html:is(.theme-light, .theme-dark) .quiz-choice__link { padding: 16px 20px; column-gap: 18px; }
html:is(.theme-light, .theme-dark) .quiz-choice__title { font-size: 16px; font-weight: 700; letter-spacing: -0.005em; margin-bottom: 4px; }
html:is(.theme-light, .theme-dark) .quiz-choice__desc {
    color: var(--ink-muted); margin-bottom: 10px;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
html:is(.theme-light, .theme-dark) .quiz-choice__meta { gap: 6px 14px; }
html:is(.theme-light, .theme-dark) .quiz-choice__side { gap: 8px; min-width: 96px; }
html:is(.theme-light, .theme-dark) .quiz-choice__liu { width: 52px; height: 52px; filter: none; }
html:is(.theme-light, .theme-dark) .quiz-choice:hover .quiz-choice__liu { transform: none; }
html:is(.theme-light, .theme-dark) .quiz-choice__cta {
    padding: 6px 12px; border: 1px solid var(--line); border-radius: 6px; background: var(--bg-elev);
    color: var(--ink); font-size: 13px; font-weight: 600;
    transition: background .15s, color .15s, border-color .15s;
}
html:is(.theme-light, .theme-dark) .quiz-choice:hover .quiz-choice__cta { transform: none; background: var(--ink); border-color: var(--ink); color: var(--bg-elev); }

/* Métadonnées : le type et l'état en étiquettes rectangulaires, le reste en texte simple. */
html:is(.theme-light, .theme-dark) .q-pill {
    gap: 0; padding: 0; border: 0; border-radius: 0; background: none;
    font-weight: 500; color: var(--ink-muted);
}
html:is(.theme-light, .theme-dark) .q-pill img { display: none; }
html:is(.theme-light, .theme-dark) .q-pill:not(.q-pill--plain) {
    padding: 3px 7px; border-radius: 4px;
    font-size: 10.5px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase;
}
html:is(.theme-light, .theme-dark) .q-pill--violet { background: var(--s-violet-bg); color: var(--s-violet-fg); }
html:is(.theme-light, .theme-dark) .q-pill--coral  { background: var(--s-coral-bg); color: var(--s-coral-fg); }
html:is(.theme-light, .theme-dark) .q-pill--mint   { background: var(--s-mint-bg); color: var(--s-mint-fg); }
html:is(.theme-light, .theme-dark) .q-pill--amber  { background: var(--s-amber-bg); color: var(--s-amber-fg); }
html:is(.theme-light, .theme-dark) .q-pill--red    { background: var(--s-red-bg); color: var(--s-red-fg); }

/* Évaluation surveillée : filet rouge à gauche, pas de dégradé ni de pulsation. */
html:is(.theme-light, .theme-dark) .quiz-choice--exam {
    background: var(--bg-elev); border-color: var(--s-exam-border); box-shadow: inset 3px 0 0 var(--s-exam-line); animation: none;
}
html:is(.theme-light, .theme-dark) .quiz-choices > .quiz-choice--exam:hover { background: var(--bg-elev); border-color: var(--s-exam-border-h); box-shadow: inset 3px 0 0 var(--s-exam-line), var(--shadow-md); }
html:is(.theme-light, .theme-dark) .quiz-choice__exam-flag {
    padding: 0; margin-bottom: 6px; background: none; box-shadow: none; border-radius: 0;
    color: var(--s-red-fg); font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
}
html:is(.theme-light, .theme-dark) .quiz-choice--exam .quiz-choice__title { color: var(--ink); }
html:is(.theme-light, .theme-dark) .quiz-choice--exam .quiz-choice__desc,
html:is(.theme-light, .theme-dark) .quiz-choice--exam .q-pill--plain { color: var(--ink-muted); }
html:is(.theme-light, .theme-dark) .quiz-choice--exam .quiz-choice__cta { background: var(--s-exam-btn); border-color: var(--s-exam-btn); color: #fff; }

/* ─── Compétitions en cours ──────────────────────────────────────────────── */
html:is(.theme-light, .theme-dark) .eleve-live {
    text-align: left; padding: 16px 18px; border-radius: 10px;
    background: var(--bg-elev); border: 1px solid var(--line); box-shadow: inset 3px 0 0 var(--s-live-line);
}
html:is(.theme-light, .theme-dark) .eleve-live__badge { margin-bottom: 0; color: var(--s-amber-fg); font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; }
html:is(.theme-light, .theme-dark) .eleve-live__title { margin: 4px 0 12px; color: var(--ink); font-size: 18px; font-weight: 700; }
html:is(.theme-light, .theme-dark) .eleve-live__list { gap: 8px; }
html:is(.theme-light, .theme-dark) .eleve-live__item { padding: 12px 14px; border-radius: 8px; background: var(--bg); border: 1px solid var(--line); color: var(--ink); }
html:is(.theme-light, .theme-dark) .eleve-live__item:hover { transform: none; border-color: var(--line-strong); }
html:is(.theme-light, .theme-dark) .eleve-live__meta { color: var(--ink-muted); }
html:is(.theme-light, .theme-dark) .eleve-live__name { color: var(--ink); font-size: 16px; }
html:is(.theme-light, .theme-dark) .eleve-live__go { color: var(--s-amber-fg); font-size: 13px; }

/* ─── Briques d'accès : grille de cartes blanches, icône au trait ────────── */
html:is(.theme-light, .theme-dark) .dg-bricks {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 30px 0 8px;
}
html:is(.theme-light, .theme-dark) .dg-brick-pair { display: contents; }
/* PromptBench et ses autres défis : une seule case de la grille, les liens sous la carte. */
html:is(.theme-light, .theme-dark) .dg-brick-group { display: flex; flex-direction: column; gap: 6px; margin: 0; }
html:is(.theme-light, .theme-dark) .dg-brick-group > .dg-brick { flex: 1; }
html:is(.theme-light, .theme-dark) .dg-bricks__title {
    grid-column: 1 / -1; display: flex; align-items: center; gap: 10px; margin: 0 0 2px;
    font-family: var(--font-body); font-size: 12px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase;
    color: var(--ink-soft);
}
html:is(.theme-light, .theme-dark) .dg-bricks__title::after { content: ''; flex: 1; height: 1px; background: var(--line); }

html:is(.theme-light, .theme-dark) .dg-brick,
html:is(.theme-light, .theme-dark) .dg-brick-pair > .dg-brick {
    --l-accent: var(--violet-600);
    display: flex; flex-direction: column; margin: 0; padding: 16px; overflow: hidden;
    border-radius: 10px; border: 1px solid var(--line); background: var(--bg-elev); box-shadow: none;
    color: var(--ink); transition: border-color .15s, box-shadow .15s;
}
html:is(.theme-light, .theme-dark) .dg-brick:hover {
    transform: none; box-shadow: var(--shadow-md);
    border-color: color-mix(in srgb, var(--l-accent) 35%, var(--line));
}
html.theme-light .dg-brick--ctf         { --l-accent: #334155; }
html.theme-light .dg-brick--prompt      { --l-accent: #6D28D9; }
html.theme-light .dg-brick--orientation { --l-accent: #4338CA; }
html.theme-light .dg-brick--academy     { --l-accent: #4B2BFF; }
html.theme-light .dg-brick--maths       { --l-accent: #1D4ED8; }
html.theme-light .dg-brick--snt         { --l-accent: #0E7490; }
html.theme-light .dg-brick--langues     { --l-accent: #B91C1C; }
html.theme-light .dg-brick--cours       { --l-accent: #4F46E5; }
html.theme-light .dg-brick--libre       { --l-accent: #047857; }
html.theme-light .dg-brick--daily       { --l-accent: #B45309; }
html.theme-light .dg-brick--mindlock    { --l-accent: #8A6116; }
html.theme-light .dg-brick--ivy         { --l-accent: #B73225; }
/* Sombre : les mêmes couleurs d'espace, éclaircies pour rester lisibles sur fond graphite. */
html.theme-dark .dg-brick--ctf         { --l-accent: #94A3B8; }
html.theme-dark .dg-brick--prompt      { --l-accent: #C4B5FD; }
html.theme-dark .dg-brick--orientation { --l-accent: #A5B4FC; }
html.theme-dark .dg-brick--academy     { --l-accent: #A5A0FF; }
html.theme-dark .dg-brick--maths       { --l-accent: #93C5FD; }
html.theme-dark .dg-brick--snt         { --l-accent: #67E8F9; }
html.theme-dark .dg-brick--langues     { --l-accent: #FCA5A5; }
html.theme-dark .dg-brick--cours       { --l-accent: #A5B4FC; }
html.theme-dark .dg-brick--libre       { --l-accent: #6EE7B7; }
html.theme-dark .dg-brick--daily       { --l-accent: #FCD34D; }
html.theme-dark .dg-brick--mindlock    { --l-accent: #E3B866; }
html.theme-dark .dg-brick--ivy         { --l-accent: #F28B7D; }

html:is(.theme-light, .theme-dark) .dg-brick__row { flex: 1; flex-direction: column; align-items: stretch; flex-wrap: nowrap; gap: 12px; }
html:is(.theme-light, .theme-dark) .dg-brick__lead { align-items: flex-start; gap: 12px; min-width: 0; }
html:is(.theme-light, .theme-dark) .dg-brick-pair .dg-brick__lead { display: flex; }
html:is(.theme-light, .theme-dark) .dg-brick__img,
html:is(.theme-light, .theme-dark) .dg-brick__mark,
html:is(.theme-light, .theme-dark) .dg-brick__glow,
html:is(.theme-light, .theme-dark) .dg-brick__watermark { display: none; }
html:is(.theme-light, .theme-dark) .dg-brick__icon,
html:is(.theme-light, .theme-dark) .dg-brick__seal {
    display: grid; place-items: center; flex: 0 0 36px; width: 36px; height: 36px; border-radius: 8px;
    background: color-mix(in srgb, var(--l-accent) var(--s-tile-mix), var(--bg-elev)); color: var(--l-accent); box-shadow: none;
}
html:is(.theme-light, .theme-dark) .dg-brick__seal { background: #f4efe6; }
html:is(.theme-light, .theme-dark) .dg-brick__seal img { width: 32px; height: 32px; }
html:is(.theme-light, .theme-dark) .dg-brick__seal--text { font-size: 18px; }
html:is(.theme-light, .theme-dark) .dg-brick__eyebrow { font-size: 10.5px; font-weight: 600; letter-spacing: 0.08em; color: var(--ink-muted); }
html:is(.theme-light, .theme-dark) .dg-brick__title,
html:is(.theme-light, .theme-dark) .dg-brick-pair .dg-brick__title {
    margin-top: 2px; font-family: var(--font-display); font-size: 15.5px; font-weight: 700; letter-spacing: -0.005em; color: var(--ink);
}
html:is(.theme-light, .theme-dark) .dg-brick__title--serif em { font-style: normal; }
html:is(.theme-light, .theme-dark) .dg-brick__amp { color: inherit; }
html:is(.theme-light, .theme-dark) .dg-brick__zh { font-size: 14px; margin-left: 6px; color: var(--ink-muted); }
html:is(.theme-light, .theme-dark) .dg-brick__sub,
html:is(.theme-light, .theme-dark) .dg-brick-pair .dg-brick__sub { margin-top: 3px; font-size: 12.5px; line-height: 1.45; color: var(--ink-muted); }
html:is(.theme-light, .theme-dark) .dg-brick__extra,
html:is(.theme-light, .theme-dark) .dg-brick--ivy .dg-brick__extra { margin-top: 6px; font-size: 12px; font-weight: 500; color: var(--ink-soft); }
html:is(.theme-light, .theme-dark) .dg-brick__extra--ok { color: var(--s-ok); }
html:is(.theme-light, .theme-dark) .dg-brick__hl { color: inherit; font-weight: 600; }
html:is(.theme-light, .theme-dark) .dg-brick__extra-note,
html:is(.theme-light, .theme-dark) .dg-brick--ivy .dg-brick__extra-note { color: var(--ink-muted); }
html:is(.theme-light, .theme-dark) .dg-brick__code { background: var(--line-soft); color: var(--ink); border: 1px solid var(--line); border-radius: 4px; }

/* Action en bas de carte : texte de la couleur de l'espace, plus de bouton pilule. */
html:is(.theme-light, .theme-dark) .dg-brick__side,
html:is(.theme-light, .theme-dark) .dg-brick__score { margin-top: auto; padding-left: 48px; display: flex; align-items: center; gap: 10px; text-align: left; }
html:is(.theme-light, .theme-dark) .dg-brick__row > .dg-brick__cta { margin-top: auto; margin-left: 48px; }
html:is(.theme-light, .theme-dark) .dg-brick__cta {
    align-self: flex-start; padding: 0; border: 0; border-radius: 0; background: none;
    color: var(--l-accent); font-size: 13px; font-weight: 600;
}
html:is(.theme-light, .theme-dark) .dg-brick__badge {
    padding: 2px 7px; border-radius: 4px; background: var(--line-soft); border: 1px solid var(--line);
    color: var(--ink-soft); font-size: 11.5px; font-weight: 600;
}
html:is(.theme-light, .theme-dark) .dg-brick__score-label { color: var(--ink-muted); font-size: 11px; }
html:is(.theme-light, .theme-dark) .dg-brick__score-value { color: var(--ink); font-size: 14px; font-weight: 700; }

/* Actions qui n'ont pas de flèche dans leur texte (« ▶ Commencer », dont l'emoji est retiré). */
html:is(.theme-light, .theme-dark) .dg-brick--ctf .dg-brick__cta::after,
html:is(.theme-light, .theme-dark) .dg-brick--prompt .dg-brick__cta::after { content: " →"; }

/* Défis de prompt supplémentaires : liens discrets sous la carte. */
html:is(.theme-light, .theme-dark) .dg-brick-chips { margin-top: 0; gap: 6px; }
html:is(.theme-light, .theme-dark) .dg-brick-chip {
    padding: 5px 10px; border-radius: 6px; font-weight: 500;
    background: var(--bg-elev); color: var(--ink-soft); border: 1px solid var(--line);
}
html:is(.theme-light, .theme-dark) .dg-brick-chip:hover { border-color: var(--line-strong); color: var(--ink); }

@media (max-width: 720px) {
    html:is(.theme-light, .theme-dark) .dg-bricks { grid-template-columns: 1fr; }
}

/* ─── Règles (colonne de droite) : liste numérotée ───────────────────────── */
html:is(.theme-light, .theme-dark) .eleve-rules { border-radius: 10px; padding: 18px 20px; top: 84px; }
html:is(.theme-light, .theme-dark) .eleve-rules h3 {
    margin-bottom: 14px; font-family: var(--font-body); font-size: 12px; font-weight: 600;
    letter-spacing: 0.08em; color: var(--ink-soft);
}
html:is(.theme-light, .theme-dark) .eleve-rules h3 img,
html:is(.theme-light, .theme-dark) .eleve-rules .rule-icon { display: none; }
html:is(.theme-light, .theme-dark) .eleve-rules ul { gap: 12px; counter-reset: rule; }
html:is(.theme-light, .theme-dark) .eleve-rules li { align-items: flex-start; gap: 12px; counter-increment: rule; }
html:is(.theme-light, .theme-dark) .eleve-rules li::before {
    content: counter(rule); flex: 0 0 22px; height: 22px; margin-top: 1px;
    display: grid; place-items: center; border-radius: 6px;
    background: var(--line-soft); color: var(--ink-soft); font-size: 12px; font-weight: 600;
}
html:is(.theme-light, .theme-dark) .eleve-rules li > div { border-left: 0; padding-left: 0; }

/* ─── Citation du jour ───────────────────────────────────────────────────── */
html:is(.theme-light, .theme-dark) .dg-quote--eleve .dg-quote__mark { fill: var(--ink-muted); }
html:is(.theme-light, .theme-dark) .dg-quote--eleve .dg-quote__text { font-family: 'Lora', Georgia, serif; font-weight: 400; }

/* ─── Bandeau d'actualités (bas de page) : clair et discret ──────────────── */
html:is(.theme-light, .theme-dark) .news-ticker {
    height: 34px; background: var(--bg-elev); border-top: 1px solid var(--line); box-shadow: none;
    color: var(--ink-soft); font-family: var(--font-body); font-size: 12.5px;
}
html:is(.theme-light, .theme-dark) .news-ticker__label { gap: 0; padding: 0 14px; background: none; border-right: 1px solid var(--line); }
html:is(.theme-light, .theme-dark) .news-ticker__cn { display: none; }
html:is(.theme-light, .theme-dark) .news-ticker__live { color: var(--ink-muted); font-size: 10.5px; font-weight: 600; letter-spacing: 0.12em; }
html:is(.theme-light, .theme-dark) .news-ticker__dot { width: 6px; height: 6px; background: #DC2626; box-shadow: none; }
html:is(.theme-light, .theme-dark) .news-ticker__item { border-right-color: var(--line); }
html:is(.theme-light, .theme-dark) .news-ticker__item .ic { display: none; }
html:is(.theme-light, .theme-dark) .news-ticker__item b { color: var(--ink); font-weight: 600; }
html:is(.theme-light, .theme-dark) .news-ticker__item i { color: var(--ink-muted); font-weight: 400; }
html:is(.theme-light, .theme-dark) .news-ticker__close { color: var(--ink-muted); }
html:is(.theme-light, .theme-dark) .news-ticker__close:hover { color: var(--ink); }

/* ─── Bouton principal (Soumettre, Valider…) : encre pleine, texte de la couleur du fond.
   Le style commun met du texte blanc sur var(--ink) : illisible en sombre, où l'encre est claire. */
html:is(.theme-light, .theme-dark) .btn--primary { background: var(--ink); color: var(--bg-elev); box-shadow: none; }
html:is(.theme-light, .theme-dark) .btn--primary:hover:not(:disabled) {
    background: color-mix(in srgb, var(--ink) 85%, var(--bg-elev)); color: var(--bg-elev); box-shadow: var(--shadow-md);
}
html:is(.theme-light, .theme-dark) .btn--primary:disabled { opacity: 0.35; }