/* Pages d'information de Manhwarium (étape 1 de l'audit, 6 novembre 2026) : confidentialité, mentions légales,
   conditions et règles, contact, nouveautés. Lisibles sans compte ; même nuit bleutée et même sceau que le jeu. */
:root { color-scheme: dark; --systeme: #74d4ff; --pale: #c9f0ff; --texte: #e9ecf5; --doux: #a3aac0; --sourd: #6f7690; --nuit: #0a0b10;
  --titre: "Segoe UI Variable Display", "Segoe UI", system-ui, -apple-system, Roboto, sans-serif;
  --corps: "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, Roboto, sans-serif; }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; color: var(--texte); font-family: var(--corps); font-size: 1rem; line-height: 1.6;
  background: radial-gradient(900px 520px at 80% -10%, rgba(116, 212, 255, 0.10), transparent 70%), var(--nuit); background-attachment: fixed; }
a { color: var(--pale); text-underline-offset: 3px; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--pale); outline-offset: 3px; }
.haut { display: flex; align-items: center; justify-content: space-between; gap: 1rem; max-width: 760px; margin: 0 auto; padding: 1.1rem 1.25rem; }
.haut__marque { display: inline-flex; align-items: center; gap: 0.6rem; color: var(--texte); text-decoration: none; font-family: var(--titre); font-weight: 800; font-style: italic; font-size: 1.15rem; }
.haut__sceau { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50% 50% 46% 46% / 62% 62% 38% 38%; background: var(--systeme); color: #07090f;
  box-shadow: 0 0 14px rgba(116, 212, 255, 0.35); }
.haut__sceau svg { width: 62%; height: 62%; }
.haut__jeu { padding: 0.45rem 0.9rem; border-radius: 999px; background: rgba(116, 212, 255, 0.08); box-shadow: inset 0 0 0 1px rgba(116, 212, 255, 0.35);
  color: var(--pale); text-decoration: none; font-weight: 600; font-size: 0.92rem; white-space: nowrap; }
main { max-width: 760px; margin: 0 auto; padding: 0.5rem 1.25rem 3rem; }
h1 { margin: 1rem 0 0.4rem; font-family: var(--titre); font-weight: 800; font-size: clamp(1.9rem, 6vw, 2.6rem); line-height: 1.1; letter-spacing: -0.01em; }
.chapo { margin: 0 0 2rem; color: var(--doux); font-size: 1.05rem; max-width: 62ch; }
h2 { margin: 2.2rem 0 0.6rem; font-family: var(--titre); font-weight: 700; font-size: 1.3rem; line-height: 1.25; }
h3 { margin: 1.4rem 0 0.4rem; font-size: 1.05rem; }
p, li { max-width: 68ch; }
p { margin: 0 0 0.9rem; }
ul, ol { margin: 0 0 1rem; padding-left: 1.3rem; }
li { margin-bottom: 0.35rem; }
.encadre { margin: 1.2rem 0; padding: 1rem 1.15rem; border-radius: 16px; background: rgba(22, 25, 36, 0.85); border: 1px solid rgba(255, 255, 255, 0.07); }
.encadre p:last-child, .encadre ul:last-child { margin-bottom: 0; }
.date { color: var(--sourd); font-size: 0.9rem; }
.bas { max-width: 760px; margin: 0 auto; padding: 1.5rem 1.25rem 2.5rem; border-top: 1px solid rgba(255, 255, 255, 0.06); }
.bas nav { display: flex; flex-wrap: wrap; gap: 0.4rem 1.2rem; font-size: 0.9rem; }
.bas nav a { color: var(--doux); }
.bas nav a[aria-current="page"] { color: var(--texte); text-decoration: none; font-weight: 600; }
.bas small { display: block; margin-top: 0.9rem; color: var(--sourd); font-size: 0.8rem; line-height: 1.5; }

/* Nouveautés : une mise à jour par bloc, la plus récente en haut */
.maj { margin: 0 0 1.4rem; padding: 1.1rem 1.2rem; border-radius: 18px; background: rgba(22, 25, 36, 0.85); border: 1px solid rgba(255, 255, 255, 0.07); }
.maj h2 { margin: 0 0 0.2rem; font-size: 1.15rem; }
.maj time { color: var(--systeme); font-size: 0.88rem; font-weight: 600; }
.maj ul { margin: 0.7rem 0 0; }

/* Formulaire de contact */
.formulaire { display: flex; flex-direction: column; gap: 1rem; margin: 1.2rem 0; max-width: 560px; }
.champ { display: flex; flex-direction: column; gap: 0.3rem; }
.champ > span { color: var(--doux); font-size: 0.88rem; }
.champ small { color: var(--sourd); font-size: 0.8rem; }
.saisie { width: 100%; padding: 0.65rem 0.8rem; border-radius: 12px; border: 1px solid rgba(116, 212, 255, 0.22); background: rgba(5, 6, 10, 0.7);
  color: var(--texte); font: inherit; font-size: 0.98rem; }
textarea.saisie { min-height: 9rem; resize: vertical; line-height: 1.45; }
.envoyer { align-self: flex-start; padding: 0.75rem 1.4rem; border: 0; border-radius: 999px; background: var(--systeme); color: #07121b; font-family: var(--titre);
  font-weight: 700; font-size: 1rem; cursor: pointer; }
.envoyer:disabled { opacity: 0.45; cursor: not-allowed; }
.piege { position: absolute; left: -10000px; width: 1px; height: 1px; opacity: 0; }
.reponse { margin: 0; padding: 0.75rem 0.95rem; border-radius: 14px; }
.reponse--ok { background: rgba(79, 224, 176, 0.12); border: 1px solid rgba(79, 224, 176, 0.35); color: #b9f5df; }
.reponse--erreur { background: rgba(255, 90, 95, 0.12); border: 1px solid rgba(255, 90, 95, 0.35); color: #ffc3c5; }
@media (max-width: 480px) { .haut__jeu { padding: 0.4rem 0.7rem; font-size: 0.85rem; } }

/* Catalogue public : œuvres et cartes (étape 3 de l'audit) */
.catalogue { --commune: #9aa3b8; --rare: #4fa3ff; --epique: #b17cff; --legendaire: #ffc84a; --mythique: #ff5e57; --divine: #ffeeb0; --secrete: #f0a6ff; }
.catalogue main { max-width: 1040px; }
.catalogue .haut, .catalogue .bas { max-width: 1040px; }
.fil-ariane { margin: 0.6rem 0 0; color: var(--sourd); font-size: 0.9rem; }
.fil-ariane a { color: var(--doux); }
.appel { display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem 1.1rem; margin: 1rem 0 1.6rem; }
.appel__bouton { display: inline-flex; padding: 0.7rem 1.2rem; border-radius: 999px; background: var(--systeme); color: #06121b; font-family: var(--titre); font-weight: 700; text-decoration: none; }
.appel__lien { color: var(--pale); font-weight: 600; }
.liste-oeuvres { list-style: none; margin: 0.4rem 0 1.8rem; padding: 0; columns: 3 240px; column-gap: 2rem; }
.liste-oeuvres li { break-inside: avoid; display: flex; justify-content: space-between; gap: 0.8rem; padding: 0.3rem 0; border-bottom: 1px solid rgba(255, 255, 255, 0.05); max-width: none; margin: 0; }
.liste-oeuvres a { color: var(--texte); text-decoration: none; }
.liste-oeuvres a:hover { color: var(--pale); text-decoration: underline; }
.liste-oeuvres small, .catalogue h2 small { color: var(--sourd); font-weight: 400; font-size: 0.85rem; }
.grille-pub { list-style: none; margin: 0.6rem 0 2rem; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 0.8rem; }
.grille-pub li { margin: 0; max-width: none; }
.vignette-pub { display: flex; flex-direction: column; gap: 0.25rem; padding: 0.4rem 0.4rem 0.55rem; border-radius: 12px; background: rgba(22, 25, 36, 0.85);
  box-shadow: inset 0 0 0 1.5px var(--r); color: var(--texte); text-decoration: none; height: 100%; }
.vignette-pub img, .vignette-pub__vide { display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; object-position: center 20%; border-radius: 8px; background: #151824; }
.vignette-pub b { font-size: 0.86rem; line-height: 1.2; }
.vignette-pub em { font-style: normal; font-size: 0.72rem; font-weight: 700; color: var(--r); }
.vignette-pub:hover { box-shadow: inset 0 0 0 2px var(--r), 0 8px 24px rgba(0, 0, 0, 0.4); }
.carte-pub { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 2rem; align-items: start; margin: 1.2rem 0 2rem; }
.carte-pub__image img { display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; object-position: center 20%; border-radius: 14px;
  box-shadow: 0 0 0 3px var(--r), 0 20px 50px rgba(0, 0, 0, 0.5); background: #151824; }
.carte-pub h1 { margin-top: 0; }
.carte-pub__natif { margin: 0 0 0.6rem; color: var(--doux); font-size: 1.1rem; }
.carte-pub__rarete { display: flex; align-items: center; gap: 0.8rem; }
.carte-pub__rarete em { font-style: normal; padding: 0.15rem 0.7rem; border-radius: 999px; background: var(--r); color: #0b0c10; font-weight: 700; }
.carte-pub__rarete span { color: var(--sourd); font-variant-numeric: tabular-nums; }
.carte-pub h2 { font-size: 1.15rem; margin-top: 1.4rem; }
@media (max-width: 640px) { .carte-pub { grid-template-columns: 1fr; } .carte-pub__image { max-width: 260px; } }

/* Lire l’œuvre (étape 10) */
.lire-oeuvre { margin: 0.4rem 0 1.4rem; color: #b9bfd3; }
.lire-oeuvre a { color: #c9f0ff; }
