/* HeroWiki — feuille de style unique.
   Pensée d'abord pour un téléphone tenu à une main, puis élargie. */

:root{
  --fond:#0d1117; --fond2:#161b22; --fond3:#1c2330;
  --trait:#2a3240; --texte:#e5e9f0; --gris:#9aa5b5;
  --or:#f2c14e; --bleu:#5aa9e6; --rouge:#e5534b; --vert:#57ab5a;
  --r:10px;
  --pubc:#57ab5a; --superc:#5aa9e6; --secretc:#c986e0; --tsc:#e08a4b; --mjc:#e5534b;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--fond); color:var(--texte);
  font:16px/1.62 "Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  -webkit-text-size-adjust:100%;
}
a{color:var(--bleu);text-decoration:none;cursor:pointer}
a:hover{text-decoration:underline}
button,input{font-family:inherit;font-size:1rem}

/* `[hidden]` vient de la feuille du navigateur : un sélecteur d'identifiant le
   supplante. Sans ces deux lignes, la porte reste affichée par-dessus le site. */
[hidden]{display:none !important}

/* ── porte ───────────────────────────────────────────────────────────── */
#porte{position:fixed;inset:0;display:grid;place-items:center;padding:24px;
  background:radial-gradient(120% 90% at 50% 0%,#1b2436 0%,var(--fond) 70%);z-index:100}
#porte-form{width:100%;max-width:380px;text-align:center}
.eclair{font-size:48px;line-height:1;filter:drop-shadow(0 0 18px #f2c14e66)}
#porte h1{font-size:2rem;margin:.4em 0 .1em;letter-spacing:.02em}
#porte .sous{color:var(--gris);margin:0 0 1.8em;font-size:.95rem}
.champ{display:flex;align-items:center;border:1px solid var(--trait);
  border-radius:var(--r);background:var(--fond2)}
.champ:focus-within{border-color:var(--or)}
#phrase{flex:1;min-width:0;padding:14px 4px 14px 16px;border:0;background:none;
  color:var(--texte);text-align:center;letter-spacing:.02em}
#phrase:focus{outline:none}
#voirph{flex:none;margin-right:6px}
/* pendant le calcul de la clé, l'éclair bat : le téléphone travaille */
.travail .eclair{animation:bat 1s ease-in-out infinite}
@keyframes bat{50%{opacity:.35;transform:scale(.9)}}
#porte-ok{width:100%;margin-top:12px;padding:14px;border:0;border-radius:var(--r);
  background:var(--or);color:#231b06;font-weight:700;cursor:pointer}
#porte-ok:disabled{opacity:.55;cursor:progress}
.memo{display:flex;gap:8px;align-items:center;justify-content:center;
  margin-top:14px;color:var(--gris);font-size:.85rem;cursor:pointer}
.msg{min-height:1.4em;margin:14px 0 0;font-size:.9rem;color:var(--rouge)}
.msg.ok{color:var(--gris)}

/* ── le sas ──────────────────────────────────────────────────────────── */
#sas{position:fixed;inset:0;z-index:90;display:grid;place-items:center;
  background:radial-gradient(120% 90% at 50% 0%,#1b2436 0%,var(--fond) 70%)}
.sas-in{width:min(420px,86vw);text-align:center}
.sas-in .eclair{font-size:44px;animation:bat 1.1s ease-in-out infinite;
  filter:drop-shadow(0 0 18px #f2c14e66)}
#sas-lignes{min-height:120px;margin:22px 0 14px;font:13px/1.9 Consolas,Menlo,monospace;
  color:var(--gris);text-align:left}
#sas-lignes div{opacity:0;animation:sas-app .25s forwards}
#sas-lignes div::before{content:"▸ ";color:var(--or)}
#sas-lignes div.ok::after{content:" ✓";color:var(--vert)}
@keyframes sas-app{to{opacity:1}}
.sas-barre{height:6px;border-radius:6px;background:var(--fond3);overflow:hidden;
  border:1px solid var(--trait)}
#sas-jauge{height:100%;width:0;background:linear-gradient(90deg,var(--or),#ffe9a8);
  border-radius:6px;transition:width .45s ease}

/* ── barre ───────────────────────────────────────────────────────────── */
#barre{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:8px;
  padding:8px 10px;padding-top:calc(8px + env(safe-area-inset-top));
  background:#0d1117ee;backdrop-filter:blur(10px);border-bottom:1px solid var(--trait)}
.ico{background:none;border:0;color:var(--gris);font-size:1.15rem;cursor:pointer;
  padding:8px;border-radius:8px;line-height:1}
.ico:hover{background:var(--fond3);color:var(--texte)}
#logo{color:var(--texte);font-weight:700;white-space:nowrap;font-size:1.05rem}
#logo span{display:none}
#chercher{flex:1;display:flex;align-items:center;background:var(--fond2);
  border:1px solid var(--trait);border-radius:var(--r);padding-right:4px}
#chercher:focus-within{border-color:var(--bleu)}
#q{flex:1;min-width:0;background:none;border:0;color:var(--texte);padding:9px 12px}
#q:focus{outline:none}
#qui{color:var(--vert);font-size:.8rem}

/* ── colonne ─────────────────────────────────────────────────────────── */
#cote{position:fixed;z-index:45;top:0;bottom:0;left:0;width:270px;
  background:var(--fond2);border-right:1px solid var(--trait);
  transform:translateX(-100%);transition:transform .22s ease;overflow-y:auto;
  padding-top:calc(10px + env(safe-area-inset-top))}
body.ouvert #cote{transform:none}
#voile{position:fixed;inset:0;background:#0008;z-index:44;opacity:0;pointer-events:none;
  transition:opacity .22s}
body.ouvert #voile{opacity:1;pointer-events:auto}
.cote-in{padding:12px}
.grp{margin-bottom:22px}
.grp h4{margin:0 0 8px;font-size:.72rem;letter-spacing:.09em;text-transform:uppercase;
  color:var(--gris);font-weight:700}
#filtre{width:100%;padding:8px 10px;margin-bottom:10px;border-radius:8px;
  border:1px solid var(--trait);background:var(--fond3);color:var(--texte)}
#filtre:focus{outline:none;border-color:var(--bleu)}
.ray{display:flex;justify-content:space-between;align-items:center;gap:8px;
  padding:9px 10px;border-radius:8px;color:var(--texte);cursor:pointer}
.ray:hover{background:var(--fond3);text-decoration:none}
.ray.on{background:var(--fond3);box-shadow:inset 3px 0 0 var(--or)}
.ray b{font-weight:600}
.ray i{font-style:normal;color:var(--gris);font-size:.78rem;
  background:#0006;padding:1px 7px;border-radius:20px}
.puce{display:inline-block;padding:4px 9px;margin:0 5px 5px 0;border-radius:20px;
  background:var(--fond3);color:var(--gris);font-size:.76rem;cursor:pointer}
.puce:hover{color:var(--texte);text-decoration:none}
.puce.on{background:var(--bleu);color:#04121e}

/* ── vue ─────────────────────────────────────────────────────────────── */
#vue{max-width:820px;margin:0 auto;padding:20px 16px 10px}
h1.tt{font-size:1.7rem;line-height:1.2;margin:.2em 0 .1em}
.stt{color:var(--or);font-style:italic;margin:0 0 .3em}
.meta{color:var(--gris);font-size:.82rem;margin:0 0 1.4em}
.meta span+span::before{content:"·";margin:0 .5em;color:var(--trait)}

.entree{border-left:3px solid var(--trait);padding-left:16px;margin:0 0 2em}
.rub{margin:0 0 2.2em}
.rub>h2{font-size:1.18rem;margin:0 0 .1em;display:flex;flex-wrap:wrap;
  gap:8px;align-items:baseline}
.bal{font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;font-weight:700;
  padding:2px 8px;border-radius:20px;font-family:system-ui,sans-serif;white-space:nowrap}
.bal.b0{background:#57ab5a22;color:var(--pubc);border:1px solid #57ab5a44}
.bal.b1{background:#5aa9e622;color:var(--superc);border:1px solid #5aa9e644}
.bal.b2{background:#c986e022;color:var(--secretc);border:1px solid #c986e044}
.bal.b3{background:#e08a4b22;color:var(--tsc);border:1px solid #e08a4b44}
.bal.b4{background:#e5534b22;color:var(--mjc);border:1px solid #e5534b44}
.bal.b5{background:#8a5ae622;color:#b79aef;border:1px solid #8a5ae655}
/* le sceau du Projet Isekai : invisible des joueurs, violet pour le MJ */
.pi{display:none}
body.mj .pi{display:inline;color:#b79aef;cursor:help;margin-left:2px}
.rub>h2+*{margin-top:.7em}
p{margin:0 0 1em}
b{color:#fff}
blockquote{margin:0 0 1em;padding:.6em 1em;border-left:3px solid var(--or);
  background:var(--fond2);border-radius:0 8px 8px 0;font-style:italic;color:#cfd6e2}
ul{margin:0 0 1em;padding-left:1.3em}
li{margin-bottom:.35em}
code{background:var(--fond3);padding:1px 5px;border-radius:5px;font-size:.9em}
/* Un statbloc large déborde toujours d'un écran de téléphone. Il défile, et le
   dégradé à droite est le seul indice qui le dise. */
.tw{overflow-x:auto;margin:0 0 1.2em;border:1px solid var(--trait);border-radius:8px;
  background:linear-gradient(to left,#0d1117 0,#0d111700 28px) right/28px 100% no-repeat;
  background-attachment:local}
table{border-collapse:collapse;width:100%;font-size:.88rem;
  font-family:system-ui,-apple-system,sans-serif}
th,td{padding:8px 11px;text-align:left;border-bottom:1px solid var(--trait);
  vertical-align:top}
th{background:var(--fond3);font-size:.76rem;text-transform:uppercase;
  letter-spacing:.05em;color:var(--gris);white-space:nowrap}
tr:last-child td{border-bottom:0}
mark{background:#f2c14e44;color:#fff;border-radius:3px;padding:0 2px}

.visuel img{max-width:100%;max-height:52vh;border-radius:12px;margin:0 0 1.2em;
  border:1px solid var(--trait);display:block}

/* En tête de fiche, le portrait s'incruste à côté du préambule : cadre doré,
   ombre portée, léger déjeté — une carte de héros, pas une pièce jointe. */
.tete{display:flex;gap:20px;align-items:flex-start;margin:0 0 2em}
.tete .entree{flex:1;margin:0}
.portrait{flex:0 0 min(38%,240px);margin:0;transform:rotate(-1.2deg)}
.portrait img{width:100%;display:block;border-radius:10px;
  border:3px solid var(--or);outline:1px solid #00000066;
  box-shadow:0 10px 28px #000a, 0 0 0 6px var(--fond2);
  background:var(--fond2)}
@media (max-width:560px){
  .tete{flex-direction:column;align-items:center}
  .portrait{flex:none;width:min(78%,300px);transform:rotate(-1.2deg)}
  .tete .entree{width:100%}
}
#simu{position:fixed;bottom:0;left:0;right:0;z-index:60;text-align:center;
  background:#8a5ae6;color:#fff;padding:9px 12px;font:14px system-ui,sans-serif;
  padding-bottom:calc(9px + env(safe-area-inset-bottom))}
#simu a{color:#fff;text-decoration:underline;cursor:pointer}
.bandeau{background:#e08a4b1a;border:1px solid #e08a4b55;color:#f0c49a;
  border-radius:8px;padding:10px 14px;margin:0 0 1.5em;font-size:.88rem}

/* listes et résultats */
.liste{list-style:none;padding:0;margin:0}
.liste li{border-bottom:1px solid var(--trait);margin:0}
.liste a{display:block;padding:13px 4px;color:var(--texte)}
.liste a:hover{background:var(--fond2);text-decoration:none}
.liste .n{font-weight:600}
.liste .t{color:var(--or);font-style:italic;font-size:.88rem}
.liste .x{display:block;color:var(--gris);font-size:.85rem;margin-top:3px;
  font-family:system-ui,sans-serif}
.rien{color:var(--gris);text-align:center;padding:3em 1em}
.tuiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:10px;margin:0 0 1.4em}
.tuile{display:flex;flex-direction:column;gap:2px;padding:14px 12px;
  background:var(--fond2);border:1px solid var(--trait);border-radius:12px;
  color:var(--texte);min-height:86px}
.tuile:hover{border-color:var(--or);text-decoration:none;background:var(--fond3)}
.tuile-ico{font-size:1.5rem;line-height:1.2}
.tuile-t{font-weight:700;line-height:1.25}
.tuile-s{color:var(--gris);font-size:.78rem;font-family:system-ui,sans-serif}
.champ-rayon{margin:0 0 1em}
.champ-rayon input{flex:1;padding:11px 14px;border:0;background:none;color:var(--texte)}
.champ-rayon input:focus{outline:none}
.mj-actions{margin:.1em 0 .9em}
.de-barre{display:flex;gap:12px;align-items:center;margin:0 0 .5em;flex-wrap:wrap}
.de-btn{padding:7px 14px;font-size:.9rem}
.de-resultat{color:var(--texte);font-family:system-ui,sans-serif;font-size:.92rem}
.de-resultat b{color:var(--or);font-size:1.1rem}
tr.de-touche td{background:#f2c14e26;box-shadow:inset 3px 0 0 var(--or)}
details.sous{margin:.5em 0 .5em 10px}
details.sous2{margin-left:22px}
details.sous2 summary{font-weight:500;font-size:.95rem}
.sous-ray{padding:6px 10px 6px 26px;font-size:.9rem;color:var(--gris)}
.sous-ray:hover{color:var(--texte)}
.ray-d summary.ray{cursor:pointer;list-style:none}
.ray-d summary.ray::-webkit-details-marker{display:none}
.ray-d summary.ray i::after{content:" ▸";color:var(--gris)}
.ray-d[open] summary.ray i::after{content:" ▾"}
details.sous summary{display:flex;justify-content:space-between;cursor:pointer;
  font-weight:600;color:var(--texte);padding:7px 4px;border-bottom:1px dashed var(--trait);
  list-style:none;user-select:none}
details.sous summary::-webkit-details-marker{display:none}
details.sous summary span::before{content:"▸";color:var(--bleu);margin-right:8px;
  display:inline-block;transition:transform .15s}
details.sous[open] summary span::before{transform:rotate(90deg)}
details.sous summary i{font-style:normal;color:var(--gris);font-size:.78rem;font-weight:400}
details.cat{margin:1.2em 0 0;scroll-margin-top:64px}
details.cat summary{display:flex;justify-content:space-between;align-items:baseline;
  border-bottom:2px solid var(--trait);padding-bottom:6px;cursor:pointer;
  font-size:1.18rem;font-weight:700;list-style:none;user-select:none}
details.cat summary::-webkit-details-marker{display:none}
details.cat summary span::before{content:"▾";color:var(--or);margin-right:8px;
  display:inline-block;transition:transform .15s}
details.cat:not([open]) summary span::before{transform:rotate(-90deg)}
details.cat summary i{font-style:normal;color:var(--gris);font-size:.8rem;font-weight:400}
.lettre{position:sticky;top:56px;background:var(--fond);color:var(--or);
  font-weight:700;padding:14px 4px 6px;font-size:.9rem;letter-spacing:.1em;
  border-bottom:1px solid var(--trait)}
/* Le pied ne flotte pas : une barre fixe en bas d'un téléphone recouvre
   toujours la dernière ligne qu'on est en train de lire. */
#pied{padding:26px 14px calc(26px + env(safe-area-inset-bottom));
  color:var(--gris);font-size:.75rem;text-align:center;
  font-family:system-ui,sans-serif;border-top:1px solid var(--trait);
  margin:40px auto 0;max-width:820px}
.charge{text-align:center;color:var(--gris);padding:3em}

/* Sur un petit écran, la barre porte jusqu'à six commandes : les espacements
   se resserrent pour que la dernière ne sorte pas de l'écran. */
@media (max-width:480px){
  #barre{gap:2px;padding-left:4px;padding-right:4px}
  .ico{padding:8px 5px}
  #logo{font-size:1rem}
  #q{padding:9px 8px}
}

/* ── éditeur MJ ──────────────────────────────────────────────────────── */
#ed{width:100%;min-height:46vh;padding:12px;border-radius:var(--r);
  border:1px solid var(--trait);background:var(--fond2);color:var(--texte);
  font:13px/1.55 Consolas,Menlo,monospace;resize:vertical}
#ed:focus{outline:none;border-color:var(--or)}
.ed-b{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0;align-items:center}
.btn1{padding:10px 18px;border:0;border-radius:var(--r);background:var(--or);
  color:#231b06;font-weight:700;cursor:pointer}
.btn1:disabled{opacity:.5}
.btn2{padding:10px 18px;border:1px solid var(--trait);border-radius:var(--r);
  background:var(--fond3);color:var(--texte);cursor:pointer}
.btn3{padding:10px 14px;color:var(--gris)}
.btn-fichier{cursor:pointer}
.repli-corps{padding-top:.6em}
.petit{font-size:.9rem}
#ed-apercu{border-top:1px dashed var(--trait);margin-top:14px;padding-top:14px}
#pat{width:100%;padding:12px 14px;border:0;background:none;color:var(--texte)}
#pat:focus{outline:none}
.copie{white-space:nowrap;font-size:.85rem}
.cfg-in{width:100%;min-width:90px;padding:7px 9px;border-radius:8px;
  border:1px solid var(--trait);background:var(--fond3);color:var(--texte)}
select.cfg-in{min-width:120px}
.suppr{color:var(--rouge);font-size:.85rem;white-space:nowrap;cursor:pointer}
.cfg-large{width:100%;min-height:120px;padding:10px;border-radius:8px;
  border:1px solid var(--trait);background:var(--fond2);color:var(--texte);
  font:14px/1.6 inherit}
.exc{display:grid;gap:10px;grid-template-columns:1fr 1fr;margin:0 0 1em}
.exc textarea{width:100%;min-height:72px;padding:8px;border-radius:8px;
  border:1px solid var(--trait);background:var(--fond2);color:var(--texte);
  font:12px/1.5 Consolas,monospace}
@media (max-width:600px){.exc{grid-template-columns:1fr}}

/* ── messagerie ──────────────────────────────────────────────────────── */
#msgr{position:fixed;z-index:70;right:0;bottom:0;top:0;width:min(400px,100vw);
  background:var(--fond2);border-left:1px solid var(--trait);display:none;
  flex-direction:column;padding-top:env(safe-area-inset-top)}
#msgr.ouvert{display:flex}
.msgr-tete{display:flex;justify-content:space-between;align-items:center;
  padding:12px 14px;border-bottom:1px solid var(--trait)}
.msgr-canaux{padding:10px 12px;border-bottom:1px solid var(--trait);
  display:flex;flex-wrap:wrap;gap:6px}
.msgr-corps{flex:1;overflow-y:auto;padding:14px;display:flex;
  flex-direction:column;gap:10px}
.msgr-un{max-width:85%;background:var(--fond3);border:1px solid var(--trait);
  border-radius:12px 12px 12px 4px;padding:8px 12px;align-self:flex-start}
.msgr-un.moi{align-self:flex-end;border-radius:12px 12px 4px 12px;
  background:#f2c14e1c;border-color:#f2c14e55}
.msgr-de{display:block;color:var(--gris);font-size:.72rem;
  font-family:system-ui,sans-serif;margin-bottom:2px}
.msgr-t{white-space:pre-wrap;word-break:break-word}
.msgr-envoi{display:flex;flex-direction:column;gap:8px;
  padding:10px 12px calc(10px + env(safe-area-inset-bottom));
  border-top:1px solid var(--trait)}
.msgr-envoi input{flex:1;padding:11px 14px;border-radius:var(--r);
  border:1px solid var(--trait);background:var(--fond);color:var(--texte)}
.msgr-envoi input:focus{outline:none;border-color:var(--or)}
.msgr-envoi .btn1{padding:10px 16px}
.msgr-ligne{display:flex;gap:8px}
.cfg-url{width:100%;max-width:520px}
.neuf{font-size:.7rem;vertical-align:super}
.cfg-ctc{width:100%;max-width:520px;min-height:72px;padding:8px;border-radius:8px;
  border:1px solid var(--trait);background:var(--fond);color:var(--texte)}

/* ── le relevé d'aptitudes & le dossier scolaire (documents officiels) ── */
details.releve{border:1px solid var(--trait);border-radius:12px;overflow:hidden;
  margin:14px 0;max-width:640px;
  background:linear-gradient(160deg,var(--fond2),var(--fond3))}
details.releve summary{cursor:pointer;padding:12px 14px;display:flex;
  justify-content:space-between;align-items:center;list-style:none}
details.releve summary::-webkit-details-marker{display:none}
details.releve summary span{color:var(--or);letter-spacing:.05em}
details.releve summary i{font-style:normal;font-size:.66rem;color:var(--gris);
  font-family:system-ui,sans-serif}
details.releve[open] summary i{display:none}
.releve-corps{padding:0 14px 14px}
/* les sous-titres d'une rubrique : des intercalaires, pas des titres */
.rub h4{margin:1.4em 0 .4em;font-size:.74rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--or);font-family:system-ui,sans-serif}
.rub h4:first-child{margin-top:.2em}
section.rub.releve{border:1px solid var(--trait);border-radius:12px;
  padding:4px 14px 12px;background:linear-gradient(160deg,var(--fond2),var(--fond3))}
.releve table{width:100%;border-collapse:separate;border-spacing:0;margin:10px 0;
  border:1px solid var(--trait);border-radius:10px;overflow:hidden}
.releve th{background:#f2c14e14;color:var(--or);text-transform:uppercase;
  font-size:.66rem;letter-spacing:.08em;padding:7px 6px;
  font-family:system-ui,sans-serif}
.releve td{padding:8px;border-top:1px solid var(--trait)}
.releve tr:nth-child(even) td{background:#ffffff05}
/* les tables de valeurs (5 colonnes et plus) : les chiffres en vitrine */
.releve table:has(th:nth-child(5)) td{
  text-align:center;font-family:ui-monospace,SFMono-Regular,monospace;
  font-size:1.05rem;font-weight:600;color:var(--or)}

/* ── la carte étudiante (accueil) ────────────────────────────────────── */
.carte-etu{display:block;max-width:440px;border-radius:14px;overflow:hidden;
  border:1px solid var(--trait);background:linear-gradient(160deg,var(--fond2),var(--fond3));
  text-decoration:none;color:var(--texte);box-shadow:0 6px 18px #0004;
  transition:transform .15s}
.carte-etu:hover{transform:translateY(-2px)}
.ce-tete{display:flex;justify-content:space-between;align-items:baseline;gap:8px;
  padding:10px 14px;background:linear-gradient(90deg,#f2c14e22,transparent);
  border-bottom:1px solid var(--trait)}
.ce-tete b{letter-spacing:.14em;font-size:.82rem;color:var(--or)}
.ce-tete i{font-style:normal;font-size:.7rem;color:var(--gris)}
.ce-corps{display:flex;gap:14px;padding:14px;align-items:center}
.ce-photo{flex:0 0 72px;width:72px;height:72px;border-radius:10px;overflow:hidden;
  display:flex;align-items:center;justify-content:center;font-size:2rem;
  background:var(--fond);border:1px solid var(--trait);color:var(--or)}
.ce-photo img{width:100%;height:100%;object-fit:cover}
.ce-infos{display:flex;flex-direction:column;gap:3px;min-width:0}
.ce-nom{font-size:1.15rem}
.ce-infos i{font-style:normal;font-size:.78rem;color:var(--gris);
  font-family:system-ui,sans-serif}
.ce-pied{display:block;padding:7px 14px;font-size:.64rem;letter-spacing:.06em;
  color:var(--gris);border-top:1px dashed var(--trait);
  font-family:system-ui,sans-serif}
.msgr-mj{display:flex;gap:8px}
.msgr-mj input,.msgr-mj select{font-size:.8rem;padding:7px 10px;min-width:0;flex:1;
  border-radius:var(--r);border:1px solid var(--trait);background:var(--fond);
  color:var(--texte)}
.msgr-carnet{padding:8px 12px;border-bottom:1px solid var(--trait);
  display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.msgr-carnet:empty{display:none;padding:0;border:none}
.msgr-ctitre{color:var(--gris);font-size:.78rem;font-family:system-ui,sans-serif}
.msgr-dest{font-size:.82rem;color:var(--gris)}
.msgr-dest a{cursor:pointer;margin-left:6px}
.msgr-un.jrn{max-width:100%;align-self:stretch}
.msgr-jtete{display:flex;justify-content:space-between;align-items:center;
  position:sticky;top:-14px;background:var(--fond2);padding:6px 0;z-index:1}

/* ── large ───────────────────────────────────────────────────────────── */
@media (min-width:900px){
  #logo span{display:inline}
  #menu{display:none}
  #cote{transform:none;top:53px}
  #voile{display:none}
  #vue{margin-left:270px;max-width:none;padding:28px 40px 10px}
  #vue>*{max-width:820px}
  #pied{margin-left:270px}
}


/* ── lisibilité mobile (audit du 18/08/2026) ─────────────────────────── */
@media (max-width:480px){
  /* les tables de caractéristiques et de défenses : la dernière colonne
     sortait de l'écran. On serre la police et les marges plutôt que de
     laisser le joueur découvrir qu'il manque une valeur. */
  .rub table{font-size:.78rem}
  .rub table th,.rub table td{padding:5px 4px}
  /* zones tactiles : plancher de 44 px sur tout ce qui se touche */
  .liste a,.ray,.tuile,.ico,nav a{min-height:44px}
  .ico{padding:11px 9px}
  /* la barre du haut : deux icônes collées finissaient par se toucher */
  #barre{gap:8px}
}
@media (orientation:landscape){
  .rub p,.rub li{max-width:68ch}
}

.msg-ko{color:#e08a4b;border-left:2px solid #e08a4b;padding-left:10px}

/* le bloc des nouveautés sur l'accueil : discret mais repérable */
.liste-neuf li{border-left:2px solid var(--or);padding-left:8px}
.liste-neuf .n::before{content:"✨ ";font-size:.9em}

/* ── sas personnalisé : chaque joueur a son terminal et sa couleur ───── */
#sas{--sas-teinte:var(--or)}
#sas-titre{color:var(--sas-teinte);font:600 .82rem/1.5 Consolas,Menlo,monospace;
  letter-spacing:.14em;text-transform:uppercase;margin:0 0 14px;opacity:.85}
#sas-jauge{background:var(--sas-teinte)}
#sas .eclair{color:var(--sas-teinte)}
#sas-lignes div.ok{color:var(--sas-teinte);opacity:.75}

/* l'étoile des favoris : posée dans le titre de la fiche, discrète tant
   qu'elle n'est pas allumée. La liste ne vit que sur l'appareil. */
.etoile{background:none;border:0;cursor:pointer;font-size:1.1em;line-height:1;
  color:var(--doux,#8b949e);opacity:.55;padding:0 .2em;vertical-align:.05em;
  transition:opacity .15s,color .15s}
.etoile:hover{opacity:1}
.etoile.on{color:#ffb347;opacity:1}