/* ===== Légendes — thèmes « Galerie de nuit » (sombre, A) et « Archive » (clair, B) =====
   Sobres, sans or : une couleur forte (ivoire ou encre), des filets fins, l'accent de l'époque (--acc) en touche.
   Les cartes à collectionner gardent leurs matières ; l'arène reste sombre dans les deux thèmes. */
:root[data-theme] { --acc: #b0643c; --f-title: "Cormorant Garamond", "Cinzel", Georgia, serif; }
:root[data-theme="dark"], :root[data-theme] .arena, :root[data-theme] .reveal, :root[data-theme] .onb {
  --bg: #111213; --bg2: #151618; --sf: #18191b; --sf2: #1f2022; --bd: #2b2c30; --tx: #ecebe6; --mu: #8c8b86;
  --gold: #ecebe6; --gold2: #ffffff; --ink: #ecebe6; --paper: #111213; --chip: #ffffff0a; --hov: #ffffff12; --ok: #7fc794; --red: #d0563f;
  color-scheme: dark;
}
:root[data-theme="light"] {
  --bg: #ebe6db; --bg2: #e5dfd2; --sf: #f5f1e8; --sf2: #efe9dd; --bd: #d0c7b6; --tx: #1c1a17; --mu: #6c665b;
  --gold: #1c1a17; --gold2: #1c1a17; --ink: #1c1a17; --paper: #f5f1e8; --chip: #1c1a170a; --hov: #1c1a1712; --ok: #3f7d52; --red: #a8392a;
  color-scheme: light;
}
:root[data-theme] body { background: var(--bg); color: var(--tx); }
:root[data-theme="dark"] body { background: radial-gradient(ellipse at 50% -20%, #ffffff0a, transparent 60%), var(--bg); }

/* en-tête et onglets */
:root[data-theme] header.top h1 { color: var(--tx); text-shadow: none; font-weight: 600; font-size: 20px; letter-spacing: .24em; }
:root[data-theme] .res, :root[data-theme] .iconbtn { background: transparent; border-color: var(--bd); color: var(--tx); }
:root[data-theme] .res.plvl b { color: var(--tx); }
:root[data-theme] .xpbar > i { background: var(--acc); }
:root[data-theme] nav.tabs { background: color-mix(in srgb, var(--bg) 92%, transparent); border-color: var(--bd); }
:root[data-theme] nav.tabs button.on { color: var(--tx); }
:root[data-theme] nav.tabs button.on::before { content: ""; position: absolute; top: 4px; left: 50%; translate: -50% 0; width: 22px; height: 2px; border-radius: 2px; background: var(--acc); }
@media (min-width: 900px) { :root[data-theme] nav.tabs button.on::before { top: 50%; left: 2px; translate: 0 -50%; width: 2px; height: 26px; } :root[data-theme] nav.tabs { background: transparent; } }
:root[data-theme] nav.tabs button .dot { background: var(--acc); box-shadow: none; }

/* titres, textes */
:root[data-theme] h2.sec { color: var(--mu); font: 600 11px Inter, sans-serif; letter-spacing: .18em; }
:root[data-theme] h2.sec::before { content: ""; width: 18px; height: 1px; background: var(--acc); }
:root[data-theme] .power, :root[data-theme] .fc .big, :root[data-theme] .stats b, :root[data-theme] .feat-title { color: var(--tx); }
:root[data-theme] .fc h3 { font-weight: 600; font-size: 20px; letter-spacing: .04em; }
:root[data-theme] .quote { color: var(--mu); border-color: var(--acc); }

/* boutons : le principal est plein (ivoire sur sombre, encre sur clair), les autres au trait */
:root[data-theme] .btn { background: transparent; border: 1px solid var(--bd); color: var(--tx); border-radius: 10px; font-weight: 600; letter-spacing: .2px; }
:root[data-theme] .btn:hover { background: var(--hov); }
:root[data-theme] .btn.gold { background: var(--ink); color: var(--paper); border-color: var(--ink); box-shadow: none; text-shadow: none; }
:root[data-theme] .btn.gold:hover { opacity: .9; }
:root[data-theme] .btn:disabled { filter: none; opacity: .4; }
:root[data-theme] .btn.big { border-radius: 12px; }

/* pastilles, segments, menus */
:root[data-theme] .pill { background: transparent; border-color: var(--bd); color: var(--tx); }
:root[data-theme] .pill.on { border-color: var(--tx); color: var(--tx); background: var(--chip); box-shadow: none; }
:root[data-theme] .ipill { background: transparent; border-color: var(--bd); color: var(--tx); }
:root[data-theme] .ipill.on, :root[data-theme] .imenu.set { border-color: var(--tx); background: var(--chip); }
:root[data-theme] .ipill.aff { border-color: color-mix(in srgb, var(--tx) 32%, transparent); background: none; }
:root[data-theme] .ipill.aff.off { border-color: color-mix(in srgb, var(--tx) 22%, transparent); background: none; }
:root[data-theme] .seg { border-color: var(--bd); }
:root[data-theme] .seg button.on { background: var(--ink); color: var(--paper); }
:root[data-theme] .menu-pop { background: var(--sf); border-color: var(--bd); color: var(--tx); }
:root[data-theme] .menu-pop button.on { color: var(--tx); }
:root[data-theme] .speed-pick button { background: transparent; }
:root[data-theme] .speed-pick button.on { background: var(--chip); border-color: var(--tx); }

/* panneaux, fenêtres, bulles */
:root[data-theme] .panel { background: var(--sf); border-color: var(--bd); border-radius: 14px; }
:root[data-theme] .sheet { background: var(--sf); border-color: var(--bd); color: var(--tx); }
:root[data-theme] .sheet .grab { background: var(--sf); }
:root[data-theme] .tip, :root[data-theme] .toast { background: var(--sf); border-color: var(--bd); color: var(--tx); box-shadow: 0 10px 30px #0004; }
:root[data-theme] .ipill .il { background: var(--sf); border-color: var(--bd); color: var(--tx); }
:root[data-theme] .stats div, :root[data-theme] .era-progress button { background: transparent; }
:root[data-theme] .era-progress button.on { border-color: var(--tx); }
:root[data-theme] .bar { background: var(--chip); }
:root[data-theme] .bar i { background: var(--acc); }
:root[data-theme] .charge { border-color: var(--tx); background: transparent; }
:root[data-theme] .charge.full { background: var(--tx); box-shadow: none; }
:root[data-theme] .grid-cards .card.inteam { outline-color: var(--tx); }
:root[data-theme] .pick select { background-color: var(--sf); color: var(--tx); border-color: var(--bd); }
:root[data-theme] .copy-n, :root[data-theme] .feat-count { background: var(--ink); color: var(--paper); border-color: var(--ink); }
:root[data-theme] .invite-link { border-color: var(--bd); background: var(--chip); }
:root[data-theme] .preset { background: transparent; }
:root[data-theme] .preset.cur { border-color: var(--tx); background: var(--chip); }
:root[data-theme] .chest.full { animation: float 2.5s infinite; }
:root[data-theme] * { scrollbar-color: var(--bd) transparent; }
:root[data-theme] ::-webkit-scrollbar-thumb, :root[data-theme] ::-webkit-scrollbar-thumb:hover { background: var(--bd); background-clip: padding-box; }

/* ouverture et démarrage : sobres */
:root[data-theme] .onb { background: var(--bg); }
:root[data-theme] .onb h2 { color: var(--tx); text-shadow: none; font-weight: 600; letter-spacing: .24em; }
:root[data-theme] .onb p { color: var(--mu); }
:root[data-theme] .onb .dots i.on { background: var(--acc); }
:root[data-theme] .pack-announce small { color: var(--mu); }
:root[data-theme] .pack-announce b { color: var(--tx); text-shadow: none; }

/* arène : boutons sobres */
:root[data-theme] .arena .hud button { background: #0b0b0dcc; border: 1px solid #ffffff30; color: #f1efea; border-radius: 99px; font-weight: 600; }
:root[data-theme] .result .win { color: #fff; text-shadow: none; }

/* thème clair : les fonds sombres d'origine passent en papier */
:root[data-theme="light"] .pill, :root[data-theme="light"] .stats div { background: transparent; }
:root[data-theme="light"] .sheet-bg { background: #1c1a1766; }
:root[data-theme="light"] .featrow, :root[data-theme="light"] .src { background: transparent; }
:root[data-theme="light"] .grid-cards .cell .c-name { color: inherit; }

/* paquets : carton sobre (graphite ou papier), sceau à l'encre, sans dorure */
:root[data-theme] .draw-stage .pack.ready { animation: float 3.5s ease-in-out infinite; }
:root[data-theme="dark"] .pack.std .c-support { background: linear-gradient(160deg, #26272a, #1a1b1d 60%, #141517); color: #ecebe6; box-shadow: inset 0 0 0 1px #ffffff1f, inset 0 0 0 2.6cqw #0000, 0 24px 40px -14px #000; }
:root[data-theme="light"] .pack.std .c-support { background: linear-gradient(160deg, #faf7f0, #ece6d9); color: #1c1a17; box-shadow: inset 0 0 0 1px #1c1a1730, 0 24px 40px -18px #1c1a1766; }
:root[data-theme] .pack.std .c-support::before { opacity: .35; }
:root[data-theme] .pack.std .emblem { background: transparent; color: currentColor; border: 0.6cqw solid currentColor; box-shadow: inset 0 0 0 2cqw transparent, 0 0 0 2.2cqw transparent; font-weight: 600; outline: 0.3cqw solid currentColor; outline-offset: 1.6cqw; }
:root[data-theme] .pack-top { border-bottom-color: currentColor; opacity: .5; background: none; }
:root[data-theme] .pack .ribbon { background: var(--acc); box-shadow: none; }
:root[data-theme] .pack-title { font-weight: 600; letter-spacing: .3em; }
/* cartes : cadre sobre (graphite ou papier) ; la rareté n'est plus qu'un filet de couleur */
:root[data-theme="dark"] .card .c-frame { background: linear-gradient(160deg, #2a2b2e, #1a1b1d); }
:root[data-theme="light"] .card .c-frame { background: linear-gradient(160deg, #fbf9f4, #e9e3d6); }
:root[data-theme] .card .c-frame { box-shadow: 0 0 0 1px color-mix(in srgb, var(--rc) 70%, transparent), inset 0 0 0 1px #ffffff14, 0 10px 24px -12px #000c; }
:root[data-theme] .card.big .c-frame { box-shadow: 0 0 0 1px color-mix(in srgb, var(--rc) 70%, transparent), 0 14px 40px -16px #000c; }
:root[data-theme] .card .c-shine { opacity: .25; }
:root[data-theme] .bc-stats div { background: #0000002e; border-color: #ffffff22; color: inherit; }
:root[data-theme] .bc-stats b { color: inherit; }
:root[data-theme] .bc-pill.on { border-color: currentColor; box-shadow: none; }
:root[data-theme] .power { font: 600 21px Inter, sans-serif; letter-spacing: .02em; }

/* liens d'équipe lisibles dans les deux thèmes */
:root[data-theme] .ipill.aff .aff-c b { color: var(--tx); }
:root[data-theme] .ipill.aff .aff-c .ab { color: var(--tx); }
:root[data-theme] .ipill.aff.off .aff-c, :root[data-theme] .ipill.aff.off .aff-c b, :root[data-theme] .ipill.aff.off .aff-c .ab { color: var(--mu); }
:root[data-theme] .reveal { background: radial-gradient(circle at 50% 45%, #1e1f22, #000 75%); }

/* dos des cartes : graphite, monogramme au trait */
:root[data-theme] .card.back .c-support { background: radial-gradient(circle at 50% 40%, #2a2b2f, #141517 75%); }
:root[data-theme] .card.back .emblem { color: #ecebe6; border-color: #ecebe6aa; background: transparent; box-shadow: none; font-weight: 600; }
:root[data-theme] .card.back .c-support::before { border-color: #ffffff22; }