:root{
  --bois:#1b1208; --bois2:#2a1c0e; --bois3:#3b2814;
  --or:#d9a441; --or2:#f0c96b; --or3:#8a6420;
  --parchemin:#f3e6c8; --parchemin2:#e4d2a8;
  --encre:#2b1e0e; --rouge:#a8322c; --vert:#4a8f5b; --bleu:#3f6fa8;
  --txt:#f4e9d4; --txt2:#c4ae86; --ombre:0 10px 30px rgba(0,0,0,.55);
  --r:16px;
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html,body{height:100%}
body{
  font-family:"Iowan Old Style","Palatino Linotype",Georgia,serif;
  background:
    radial-gradient(1200px 600px at 50% -10%, #4a3418 0%, transparent 60%),
    linear-gradient(#150e06,#0c0803);
  color:var(--txt); overflow-x:hidden; min-height:100dvh;
}
button{font:inherit;color:inherit;cursor:pointer;border:none;background:none}
input,textarea,select{font:inherit}

/* ---------- coque ---------- */
.wrap{max-width:900px;margin:0 auto;padding:14px 14px 90px}
.ecran{display:none;animation:fade .28s ease}
.ecran.on{display:block}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ---------- entete profil ---------- */
.hdr{
  display:flex;align-items:center;gap:12px;padding:12px 14px;margin-bottom:16px;
  background:linear-gradient(180deg,#33220f,#231708);
  border:1px solid #5a3d18;border-radius:var(--r);box-shadow:var(--ombre);position:relative;overflow:hidden
}
.hdr::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(255,255,255,.03) 0 2px,transparent 2px 7px);pointer-events:none}
.ava{width:52px;height:52px;flex:0 0 52px;border-radius:50%;display:grid;place-items:center;font-size:26px;
  background:radial-gradient(circle at 30% 30%,#f0c96b,#8a6420);border:2px solid #f0c96b;cursor:pointer}
.hdr .qui{flex:1;min-width:0}
.hdr .nom{font-weight:700;font-size:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hdr .rang{font-size:14px;color:var(--or2);letter-spacing:.5px}
.xpbar{height:7px;background:#1a1006;border-radius:99px;margin-top:6px;overflow:hidden;border:1px solid #5a3d18}
.xpbar i{display:block;height:100%;background:linear-gradient(90deg,#8a6420,#f0c96b);border-radius:99px;transition:width .6s}
.lvl{flex:0 0 auto;text-align:center;padding:4px 10px;border-radius:10px;background:#120b04;border:1px solid #5a3d18}
.lvl b{display:block;font-size:20px;color:var(--or2);line-height:1}
.lvl span{font-size:11px;letter-spacing:1px;color:var(--txt2)}

/* ---------- titres ---------- */
h1{font-size:31px;letter-spacing:1px;text-align:center;margin:6px 0 2px;
  background:linear-gradient(#f0c96b,#b8862c);-webkit-background-clip:text;background-clip:text;color:transparent}
.heb{text-align:center;font-size:17px;color:var(--or);margin-bottom:16px;letter-spacing:2px}
h2{font-size:21px;color:var(--or2);margin:18px 0 10px;display:flex;align-items:center;gap:8px}
h2::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,#5a3d18,transparent)}
.sous{color:var(--txt2);font-size:15px;line-height:1.55}

/* ---------- cartes de mode ---------- */
.modes{display:grid;grid-template-columns:repeat(auto-fill,minmax(178px,1fr));gap:13px}
.mode{
  text-align:left;padding:16px 14px;border-radius:var(--r);position:relative;overflow:hidden;
  background:linear-gradient(160deg,#3b2814,#211508);border:1px solid #5a3d18;box-shadow:var(--ombre);
  transition:transform .15s,border-color .15s
}
.mode:active{transform:scale(.97)}
.mode:hover{border-color:var(--or)}
.mode .ico{font-size:26px;display:block;margin-bottom:8px}
.mode b{display:block;font-size:17.5px;color:var(--or2);margin-bottom:4px}
.mode small{color:var(--txt2);font-size:13.5px;line-height:1.4;display:block}
.mode .ia{position:absolute;top:8px;right:8px;font-size:11px;background:#3f6fa8;color:#fff;padding:2px 7px;border-radius:99px;letter-spacing:.5px}

/* ---------- boutons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 20px;border-radius:12px;
  background:linear-gradient(180deg,#e0b354,#a9761f);color:#2b1e0e;font-weight:700;box-shadow:0 4px 0 #6b4a12;transition:.12s}
.btn:active{transform:translateY(3px);box-shadow:0 1px 0 #6b4a12}
.btn.sec{background:linear-gradient(180deg,#3b2814,#241708);color:var(--or2);border:1px solid #5a3d18;box-shadow:0 4px 0 #150d04}
.btn.full{width:100%}
.row{display:flex;gap:10px;flex-wrap:wrap}
.retour{margin-bottom:12px;font-size:13px;color:var(--txt2)}

/* ---------- mondes / niveaux ---------- */
.monde{display:flex;gap:12px;align-items:center;width:100%;padding:14px;border-radius:var(--r);margin-bottom:10px;
  background:linear-gradient(90deg,#3b2814,#1d1207);border:1px solid #5a3d18;text-align:left}
.monde .em{font-size:30px}
.monde b{display:block;color:var(--or2);font-size:18px}
.monde .jauge{height:6px;background:#160d05;border-radius:99px;margin-top:6px;overflow:hidden}
.monde .jauge i{display:block;height:100%;background:linear-gradient(90deg,#4a8f5b,#8fd6a0)}
.niveaux{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
.niv{padding:12px;border-radius:14px;background:linear-gradient(160deg,#3b2814,#1d1207);border:1px solid #5a3d18;text-align:left;position:relative}
.niv.lock{opacity:.42;filter:grayscale(.6)}
.niv b{display:block;font-size:16px;color:var(--or2)}
.niv small{font-size:13px;color:var(--txt2)}
.etoiles{margin-top:6px;font-size:13px;letter-spacing:2px;color:#5a3d18}
.etoiles .on{color:var(--or2)}

/* ---------- quiz ---------- */
.quizbar{display:flex;align-items:center;gap:10px;margin-bottom:14px;font-size:14px;color:var(--txt2)}
.chrono{flex:1;height:8px;background:#180f06;border-radius:99px;overflow:hidden;border:1px solid #5a3d18}
.chrono i{display:block;height:100%;background:linear-gradient(90deg,#4a8f5b,#f0c96b);transition:width .25s linear}
.chrono.warn i{background:linear-gradient(90deg,#a8322c,#e0703c)}
.carte{
  background:linear-gradient(170deg,var(--parchemin),var(--parchemin2));color:var(--encre);
  border-radius:var(--r);padding:20px 18px;box-shadow:var(--ombre);border:1px solid #b99b5f;position:relative
}
.carte::before{content:"";position:absolute;inset:6px;border:1px solid rgba(120,90,40,.35);border-radius:10px;pointer-events:none}
.qtxt{font-size:21px;line-height:1.5;font-weight:600;position:relative}
.qmeta{font-size:13px;color:#6b5228;letter-spacing:1px;text-transform:uppercase;margin-bottom:10px}
.reps{display:grid;gap:9px;margin-top:16px}
.rep{padding:15px 16px;border-radius:12px;text-align:left;font-size:17px;background:#fffdf6;color:var(--encre);
  border:1px solid #c9ab72;box-shadow:0 2px 0 #c2a468;transition:.12s;display:flex;gap:10px;align-items:center}
.rep:active{transform:translateY(2px);box-shadow:none}
.rep .l{width:27px;height:27px;flex:0 0 27px;border-radius:7px;background:#e8d6ab;display:grid;place-items:center;font-size:14px;font-weight:700}
.rep.bon{background:#cdeccf;border-color:#4a8f5b;box-shadow:0 2px 0 #4a8f5b}
.rep.mauv{background:#f3ccc9;border-color:#a8322c;box-shadow:0 2px 0 #a8322c}
.rep.off{opacity:.35}
.expl{margin-top:14px;padding:12px;border-radius:12px;background:rgba(43,30,14,.08);border-left:3px solid var(--or3);
  font-size:15.5px;line-height:1.6;color:#4a3a1c}
.expl b{color:#2b1e0e}
.expl a{color:#7a3f14}
.combo{position:fixed;top:14px;right:14px;background:#a8322c;color:#fff;padding:6px 12px;border-radius:99px;font-weight:700;
  font-size:13px;box-shadow:var(--ombre);z-index:40;animation:pop .3s}
@keyframes pop{from{transform:scale(.5);opacity:0}to{transform:none;opacity:1}}
.jokers{display:flex;gap:8px;margin-top:12px}
.joker{padding:10px 14px;border-radius:10px;background:#241708;border:1px solid #5a3d18;font-size:13.5px;color:var(--or2)}
.joker:disabled{opacity:.35}

/* ---------- bilan ---------- */
.bilan{text-align:center;padding:26px 18px}
.bilan .score{font-size:52px;color:var(--or2);line-height:1}
.bilan .etoiles{font-size:34px;justify-content:center;margin:12px 0}
.gainxp{color:#8fd6a0;font-weight:700;font-size:16px}

/* ---------- classement ---------- */
.tab{width:100%;border-collapse:collapse;font-size:15.5px}
.tab th{text-align:left;font-size:13px;color:var(--txt2);letter-spacing:.6px;padding:9px;border-bottom:1px solid #5a3d18}
.tab td{padding:10px 8px;border-bottom:1px solid #2e1f0d}
.tab tr.moi td{background:rgba(217,164,65,.12);color:var(--or2)}
.tab .pos{width:34px;font-weight:700;color:var(--or2)}

/* ---------- champs ---------- */
.champ{width:100%;padding:13px;border-radius:12px;background:#fffdf6;color:var(--encre);border:1px solid #c9ab72;font-size:16.5px}
textarea.champ{min-height:130px;resize:vertical;line-height:1.5;font-family:inherit}
select.champ{appearance:none}
label.lab{display:block;font-size:13.5px;color:var(--txt2);margin:12px 0 5px;letter-spacing:.5px}

/* ---------- note IA ---------- */
.note{display:flex;align-items:center;gap:14px;padding:14px;border-radius:14px;background:#241708;border:1px solid #5a3d18;margin-top:14px}
.note .n{font-size:34px;font-weight:700;color:var(--or2);line-height:1}
.note .n small{font-size:14px;color:var(--txt2)}
.crit{margin-top:10px;display:grid;gap:6px}
.crit div{display:flex;justify-content:space-between;font-size:14.5px;color:var(--txt2);padding:6px 0;border-bottom:1px dashed #3b2814}
.crit b{color:var(--or2)}
.spin{display:inline-block;width:16px;height:16px;border:2px solid #5a3d18;border-top-color:var(--or2);border-radius:50%;animation:sp .7s linear infinite;vertical-align:-3px}
@keyframes sp{to{transform:rotate(360deg)}}

/* ---------- havrouta ---------- */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.joueur{padding:12px;border-radius:14px;background:linear-gradient(160deg,#3b2814,#1d1207);border:1px solid #5a3d18;text-align:center}
.joueur.actif{border-color:var(--or2);box-shadow:0 0 0 2px rgba(240,201,107,.25)}
.joueur b{display:block;color:var(--or2);font-size:15px}
.joueur .pts{font-size:26px;color:var(--txt)}

/* ---------- bibliotheque ---------- */
.tour{position:relative;border-radius:var(--r);overflow:hidden;border:1px solid #5a3d18;box-shadow:var(--ombre);
  background:linear-gradient(180deg,#2a1c0e,#160e05)}
.etageHdr{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:linear-gradient(180deg,#3b2814,#2a1c0e);border-bottom:1px solid #5a3d18}
.etageHdr b{color:var(--or2);font-size:16px}
.etageHdr small{color:var(--txt2);font-size:13px;display:block}
.salle{padding:16px 12px;background:
  repeating-linear-gradient(90deg,rgba(0,0,0,.18) 0 1px,transparent 1px 40px),
  linear-gradient(180deg,#3a2712,#241708)}
.etagere{margin-bottom:14px;padding:0 0 10px;border-bottom:8px solid #4a3218;border-radius:0 0 4px 4px;
  box-shadow:0 6px 10px rgba(0,0,0,.4);display:flex;gap:5px;align-items:flex-end;min-height:86px;flex-wrap:wrap}
.livre{width:30px;border-radius:3px 3px 1px 1px;position:relative;cursor:pointer;transition:.18s;
  display:flex;align-items:center;justify-content:center;box-shadow:inset -4px 0 6px rgba(0,0,0,.35),0 2px 4px rgba(0,0,0,.5)}
.livre span{writing-mode:vertical-rl;transform:rotate(180deg);font-size:10.5px;color:rgba(255,255,255,.92);
  white-space:nowrap;overflow:hidden;max-height:90%;letter-spacing:.5px;text-shadow:0 1px 2px rgba(0,0,0,.6)}
.livre:hover{transform:translateY(-8px)}
.livre.lu{opacity:.35;transform:translateY(4px)}
.livre.lu::after{content:"✓";position:absolute;top:-14px;left:50%;transform:translateX(-50%);color:#8fd6a0;font-size:12px}
.escalier{text-align:center;padding:14px;background:linear-gradient(180deg,#241708,#160e05)}
.progEtage{height:8px;background:#160d05;border-radius:99px;overflow:hidden;margin:10px 14px}
.progEtage i{display:block;height:100%;background:linear-gradient(90deg,#8a6420,#f0c96b);transition:width .4s}
.confetti{position:fixed;inset:0;pointer-events:none;z-index:60}

/* ---------- texte sefaria ---------- */
.sefer{background:linear-gradient(170deg,var(--parchemin),var(--parchemin2));color:var(--encre);padding:18px;border-radius:14px;
  border:1px solid #b99b5f;max-height:340px;overflow:auto;line-height:1.8;font-size:17px}
.sefer .he{direction:rtl;text-align:right;font-size:19px;line-height:2;font-family:"Times New Roman",serif;border-bottom:1px dashed #b99b5f;padding-bottom:10px;margin-bottom:10px}
.src{font-size:12.5px;color:var(--txt2);margin-top:8px}
.src a{color:var(--or2)}

/* ---------- barre du bas ---------- */
.bas{position:fixed;left:0;right:0;bottom:0;display:flex;justify-content:center;gap:6px;padding:8px;
  background:linear-gradient(180deg,rgba(12,8,3,.4),#0c0803);backdrop-filter:blur(8px);border-top:1px solid #3b2814;z-index:30}
.bas button{padding:8px 12px;border-radius:10px;font-size:12.5px;color:var(--txt2);display:flex;flex-direction:column;align-items:center;gap:3px}
.bas button.on{color:var(--or2)}
.bas .i{font-size:19px}

.pill{display:inline-block;padding:4px 11px;border-radius:99px;font-size:13px;background:#241708;border:1px solid #5a3d18;color:var(--or2);margin:0 4px 4px 0}
.vide{text-align:center;color:var(--txt2);padding:30px 10px;font-size:16px}
@media(max-width:420px){h1{font-size:26px}.modes{grid-template-columns:1fr 1fr}.mode b{font-size:16.5px}.mode small{font-size:13.5px}.qtxt{font-size:19px}.rep{font-size:16px}}

/* ---------- exploration ---------- */
.zone{margin-bottom:14px;border-radius:var(--r);overflow:hidden;border:1px solid #5a3d18;background:linear-gradient(160deg,#3b2814,#1d1207)}
.zoneHdr{display:flex;align-items:center;gap:10px;padding:12px 14px;background:linear-gradient(180deg,#463017,#2a1c0e)}
.zoneHdr .em{font-size:24px}
.zoneHdr b{flex:1;color:var(--or2);font-size:17px}
.panneaux{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px;padding:12px}
.panneau{padding:10px 6px;border-radius:12px;background:#241708;border:1px solid #5a3d18;text-align:center;transition:.15s}
.panneau:hover{border-color:var(--or);transform:translateY(-3px)}
.panneau .pico{font-size:24px;display:block;margin-bottom:4px}
.panneau small{font-size:13px;color:var(--txt2);line-height:1.25;display:block}
.panneau.fait{border-color:#4a8f5b;background:#1c2a1c}
.panneau.fait small{color:#8fd6a0}

/* ---------- sac ---------- */
.sacGrille{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}
.objet{padding:12px;border-radius:14px;text-align:center;background:linear-gradient(160deg,#3b2814,#1d1207);border:1px solid #5a3d18}
.objet .oem{font-size:30px;display:block;margin-bottom:6px}
.objet b{display:block;font-size:14px;color:var(--or2);line-height:1.3}
.objet small{font-size:12px;color:var(--txt2);text-transform:uppercase;letter-spacing:1px}
.objet.r-rare{border-color:#3f6fa8;box-shadow:0 0 12px rgba(63,111,168,.25)}
.objet.r-epique{border-color:#8a4fb8;box-shadow:0 0 12px rgba(138,79,184,.3)}
.objet.r-legendaire{border-color:#f0c96b;box-shadow:0 0 16px rgba(240,201,107,.35)}

/* ---------- guematria ---------- */
.gCible{text-align:center;font-size:62px;color:#7a3f14;line-height:1;margin:6px 0 4px;font-weight:700;text-shadow:0 2px 0 rgba(255,255,255,.35)}
.gSaisie{direction:rtl;text-align:center;font-size:30px;letter-spacing:4px;min-height:56px;padding:10px;
  background:#fffdf6;color:var(--encre);border-radius:12px;border:1px solid #c9ab72;font-family:"Times New Roman",serif}
.clavier{display:grid;grid-template-columns:repeat(11,1fr);gap:4px;margin-top:10px;direction:rtl}
.clavier button{padding:9px 0;border-radius:8px;background:#3b2814;border:1px solid #5a3d18;color:var(--or2);
  font-size:17px;font-family:"Times New Roman",serif}
.clavier button:active{background:#5a3d18}
.clavier button.act{grid-column:span 2;font-size:12px;font-family:inherit;background:#241708}
.motsTrouves{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;direction:rtl}
.motG{padding:6px 10px;border-radius:10px;background:#241708;border:1px solid #5a3d18;font-size:17px;color:var(--parchemin);
  font-family:"Times New Roman",serif;cursor:pointer}
.motG small{display:block;direction:ltr;font-size:9px;color:var(--txt2);font-family:inherit}

/* ---------- enigmes ---------- */
.enig{background:linear-gradient(170deg,#2a2418,#1a1408);border:1px solid #5a3d18;border-radius:var(--r);padding:18px;margin-bottom:12px}
.enig .txt{font-size:19px;line-height:1.5;color:var(--parchemin);font-style:italic}
.enig .srcE{font-size:13px;color:var(--txt2);margin-top:10px;border-top:1px dashed #3b2814;padding-top:8px}

/* ---------- credits ---------- */
.credits{margin-top:26px;padding:16px;border-radius:var(--r);background:#160e05;border:1px solid #2e1f0d;
  font-size:13px;line-height:1.6;color:#8a7a5e}
.credits b{display:block;color:var(--or);letter-spacing:1px;margin-bottom:6px;font-size:13px}
.credits a{color:var(--or)}

/* ---------- message au centre de l'ecran ---------- */
.avis{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
  z-index:95;background:rgba(8,5,2,.72);backdrop-filter:blur(3px);padding:24px;animation:fade .18s ease}
.avisTxt{max-width:520px;text-align:center;font-size:19px;line-height:1.5;color:var(--parchemin);
  background:linear-gradient(170deg,#33220f,#1c1207);border:1px solid var(--or);border-radius:var(--r);
  padding:22px 20px;box-shadow:0 20px 60px rgba(0,0,0,.7)}
.avisOk{padding:10px 22px;border-radius:12px;background:linear-gradient(180deg,#e0b354,#a9761f);color:#2b1e0e;font-weight:700}

/* ---------- enonce complet de la question au rav ---------- */
.enonce{margin-top:12px;padding:16px;border-radius:12px;background:rgba(43,30,14,.07);border-left:3px solid var(--or3);
  font-size:16px;line-height:1.6;color:#4a3a1c;max-height:260px;overflow:auto;white-space:normal}
.enonce i{color:#7a6134}
.enonce a{color:#7a3f14}

/* ---------- enchainement automatique ---------- */
.autoSuite{font-size:12px;color:#7a6134;margin-left:10px;letter-spacing:.5px}
.autoSuite::after{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:#4a8f5b;margin-left:6px;
  animation:pulse .7s infinite alternate}
@keyframes pulse{from{opacity:.25}to{opacity:1}}

/* ---------- personnage ---------- */
.ava.avaFig{background:radial-gradient(circle at 30% 30%,#3b2814,#1b1208);overflow:hidden;display:grid;place-items:center;padding:0}
.ava.avaFig svg{display:block;transform:translateY(2px)}
.persScene{display:grid;place-items:center;padding:18px;border-radius:var(--r);
  background:radial-gradient(120% 90% at 50% 20%,#3b2814,#160e05);border:1px solid #5a3d18;box-shadow:var(--ombre)}
.persNom{text-align:center;margin:14px 0}
.persNom b{display:block;font-size:26px;color:var(--or2)}
.persNom span{font-size:19px;color:var(--or)}
.echelle{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:10px}
.stade{padding:10px 6px;border-radius:14px;text-align:center;background:linear-gradient(160deg,#2a1c0e,#160e05);
  border:1px solid #3b2814;opacity:.62;filter:grayscale(.5)}
.stade.atteint{opacity:1;filter:none;border-color:#5a3d18;background:linear-gradient(160deg,#3b2814,#1d1207)}
.stade.courant{border-color:var(--or2);box-shadow:0 0 0 2px rgba(240,201,107,.25)}
.stade b{display:block;font-size:13.5px;color:var(--or2);margin-top:4px}
.stade small{font-size:13px;color:var(--txt2)}
.stadeFig{display:grid;place-items:center;min-height:70px}

/* ---------- Beth HaMikdach ---------- */
.mikCadre{border-radius:var(--r);overflow:hidden;border:1px solid #5a3d18;box-shadow:var(--ombre);background:#241708}
.mikSvg{display:block;width:100%;height:auto}
.mikEtat{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}
.mikEtat div{padding:12px 8px;border-radius:14px;text-align:center;background:linear-gradient(160deg,#3b2814,#1d1207);border:1px solid #5a3d18}
.mikEtat b{display:block;font-size:24px;color:var(--or2);line-height:1.1}
.mikEtat span{font-size:13px;color:var(--txt2);letter-spacing:.3px}
.phases{display:grid;gap:8px}
.phaseLigne{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;
  background:#1d1207;border:1px solid #2e1f0d;opacity:.72}
.phaseLigne.faite{opacity:1;border-color:#5a3d18;background:linear-gradient(90deg,#3b2814,#1d1207)}
.phasePastille{flex:0 0 46px;text-align:center;font-size:12.5px;color:var(--or2);
  background:#241708;border:1px solid #5a3d18;border-radius:99px;padding:4px 0}
.phaseLigne b{display:block;font-size:15.5px;color:var(--txt)}
.phaseLigne small{font-size:13.5px;color:var(--or)}

/* ---------- messages courts, sans clic ---------- */
.toasts{position:fixed;top:14px;left:50%;transform:translateX(-50%);z-index:90;display:flex;flex-direction:column;
  gap:8px;align-items:center;pointer-events:none;width:max-content;max-width:92vw}
.toast{background:linear-gradient(180deg,#3b2814,#231708);border:1px solid var(--or);color:var(--or2);
  padding:12px 20px;border-radius:99px;font-size:17px;font-weight:700;letter-spacing:.3px;
  box-shadow:0 12px 34px rgba(0,0,0,.6);animation:tombe .26s cubic-bezier(.2,1.4,.4,1);
  max-width:92vw;text-align:center;line-height:1.35;border-radius:18px}
.toast.part{opacity:0;transform:translateY(-14px);transition:.3s}
@keyframes tombe{from{opacity:0;transform:translateY(-22px) scale(.9)}to{opacity:1;transform:none}}

/* ---------- choix de l age ---------- */
.choixAge{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;max-width:520px;width:100%}
.choixAge .btn{flex-direction:column;align-items:flex-start;padding:14px 16px;text-align:left;gap:2px}
.choixAge .btn b{font-size:16px;color:var(--or2)}
.choixAge .btn small{font-size:12.5px;color:var(--txt2);font-weight:400}
.choixAge .btn.actif{border-color:var(--or2);box-shadow:0 0 0 2px rgba(240,201,107,.3),0 4px 0 #150d04}

/* ---------- echelle Olam Haba ---------- */
.echelleOlam{display:grid;gap:5px}
.marche{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:10px;
  background:#1a1207;border:1px solid #2e1f0d;opacity:.5}
.marche.passee{opacity:1;border-color:#5a3d18;background:linear-gradient(90deg,#3b2814,#1d1207)}
.marcheNum{flex:0 0 34px;text-align:center;font-weight:700;color:var(--or2);font-size:15px}
.marcheTxt{flex:1;font-size:14.5px;color:var(--txt2)}
.marchePrix{font-size:13px;color:var(--or2)}
.marche:first-child{border-color:var(--or3)}

/* ---------- bestiaire ---------- */
.bestiaire{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;margin-top:14px}
.fiche{padding:12px;border-radius:16px;text-align:center;background:linear-gradient(160deg,#2a1c0e,#160e05);
  border:1px solid #3b2814;opacity:.75}
.fiche.prise{opacity:1;border-color:var(--rar);box-shadow:0 0 16px color-mix(in srgb,var(--rar) 30%,transparent)}
.ficheFig{display:grid;place-items:center;min-height:96px}
.fiche b{display:block;font-size:15px;color:var(--or2)}
.ficheHeb{display:block;font-size:15px;color:var(--or);font-family:"Times New Roman",serif}
.ficheRar{display:inline-block;margin-top:4px;font-size:10.5px;text-transform:uppercase;letter-spacing:1px;color:var(--rar)}
.ficheTxt{font-size:12.5px;color:var(--txt2);line-height:1.45;margin-top:6px}
.ficheSrc{display:block;font-size:11px;color:#8a7a5e;margin-top:6px}

/* ---------- ceremonie du tapis rouge ---------- */
.ceremonie{position:fixed;inset:0;z-index:95;display:grid;place-items:center;
  background:radial-gradient(120% 90% at 50% 40%,rgba(58,25,15,.92),rgba(8,5,2,.97));animation:fade .3s}
.tapis{position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:52vw;max-width:420px;height:0;
  background:linear-gradient(180deg,#a8322c,#6b1f1a);border-left:6px solid #d9a441;border-right:6px solid #d9a441;
  animation:deroule .9s cubic-bezier(.22,1,.3,1) forwards;box-shadow:0 -10px 40px rgba(168,50,44,.5)}
@keyframes deroule{from{height:0}to{height:72vh}}
.etincelles{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.etincelles i{position:absolute;top:-12px;width:7px;height:7px;border-radius:50%;background:#f0c96b;
  box-shadow:0 0 12px #f0c96b;animation:chute 2.6s linear infinite}
@keyframes chute{to{transform:translateY(110vh) rotate(360deg);opacity:0}}
.creatureScene{position:relative;z-index:2;display:grid;place-items:center;gap:14px;padding:20px;max-width:520px;text-align:center}
.creatureHalo{position:absolute;top:6%;width:280px;height:280px;border-radius:50%;
  background:radial-gradient(circle,rgba(240,201,107,.42),transparent 70%);animation:respire 2.4s ease-in-out infinite}
@keyframes respire{0%,100%{transform:scale(.92);opacity:.7}50%{transform:scale(1.08);opacity:1}}
.creatureFig{position:relative;animation:surgit .8s cubic-bezier(.2,1.5,.4,1) .35s both}
@keyframes surgit{from{transform:scale(.3) translateY(40px);opacity:0}to{transform:none;opacity:1}}
.creatureNom{animation:fade .5s .9s both}
.creatureNom b{display:block;font-size:30px;color:var(--or2);line-height:1.15}
.creatureNom .rarete{font-size:12px;text-transform:uppercase;letter-spacing:2px}
.creatureHeb{display:block;font-size:21px;color:var(--or);font-family:"Times New Roman",serif;margin-top:2px}
.creatureNom p{font-size:15px;color:var(--txt);line-height:1.55;margin-top:10px;max-width:420px}
.creatureNom small{display:block;font-size:12px;color:var(--txt2);margin-top:8px}
.ceremonie .btn{animation:fade .5s 1.3s both}

/* =========================================================
   MODE CLAIR, le monde Olam Haba
   Le jeu passe du beit midrach du soir a la pleine lumiere.
   ========================================================= */
body.clair{
  --or:#a06a12; --or2:#7a4f0a; --or3:#b8862c;
  --txt:#2b2419; --txt2:#6b6152;
  --ombre:0 10px 30px rgba(90,70,40,.18);
  background:
    radial-gradient(1200px 600px at 50% -10%, #fffdf6 0%, transparent 60%),
    linear-gradient(#f6efdd,#eadfc4);
  color:var(--txt);
}
body.clair .hdr{background:linear-gradient(180deg,#fffdf6,#f2e8d0);border-color:#d8c9a4}
body.clair .hdr::after{background:repeating-linear-gradient(90deg,rgba(0,0,0,.02) 0 2px,transparent 2px 7px)}
body.clair .hdr .nom{color:#2b2419}
body.clair .lvl{background:#fffdf6;border-color:#d8c9a4}
body.clair .xpbar{background:#e0d3b2;border-color:#d8c9a4}
body.clair h1{background:linear-gradient(#a06a12,#6b4306);-webkit-background-clip:text;background-clip:text}
body.clair h2::after{background:linear-gradient(90deg,#d8c9a4,transparent)}

body.clair .mode,
body.clair .monde,
body.clair .niv,
body.clair .zone,
body.clair .stade,
body.clair .objet,
body.clair .fiche,
body.clair .joueur,
body.clair .mikEtat div{background:linear-gradient(160deg,#fffdf6,#f0e6cd);border-color:#d8c9a4;color:var(--txt)}
body.clair .mode:hover,body.clair .niv:hover{border-color:#a06a12}
body.clair .zoneHdr{background:linear-gradient(180deg,#f5ecd6,#eadfc4);border-color:#d8c9a4}
body.clair .panneau,
body.clair .phaseLigne,
body.clair .marche,
body.clair .joker,
body.clair .clavier button,
body.clair .motG,
body.clair .phasePastille{background:#fffdf6;border-color:#d8c9a4;color:#6b4306}
body.clair .panneau.fait{background:#e6f2e4;border-color:#4a8f5b}
body.clair .panneau.fait small{color:#2f6b3f}
body.clair .marche.passee,
body.clair .phaseLigne.faite{background:linear-gradient(90deg,#f7edd4,#fffdf6);border-color:#c9b489}

body.clair .btn.sec{background:linear-gradient(180deg,#fffdf6,#efe4c9);color:#7a4f0a;border-color:#d8c9a4;box-shadow:0 4px 0 #d3c19a}
body.clair .btn{box-shadow:0 4px 0 #b08a34}
body.clair .retour{color:#6b6152}
body.clair .sous,body.clair .mode small,body.clair .niv small,body.clair .stade small,
body.clair .mikEtat span,body.clair .marcheTxt,body.clair .panneau small{color:#6b6152}
body.clair .mode b,body.clair .monde b,body.clair .niv b,body.clair .mikEtat b,
body.clair .marcheNum,body.clair .persNom b,body.clair .fiche b{color:#7a4f0a}
body.clair .etoiles{color:#cfc0a0}
body.clair .etoiles .on{color:#c8901f}

body.clair .tour,body.clair .mikCadre{border-color:#d8c9a4}
body.clair .salle{background:repeating-linear-gradient(90deg,rgba(0,0,0,.04) 0 1px,transparent 1px 40px),linear-gradient(180deg,#efe0bf,#e2d2ad)}
body.clair .etageHdr{background:linear-gradient(180deg,#f5ecd6,#eadfc4);border-color:#d8c9a4}
body.clair .etagere{border-bottom-color:#c3ac7c;box-shadow:0 6px 10px rgba(120,100,60,.22)}
body.clair .escalier{background:linear-gradient(180deg,#eadfc4,#e0d3b2)}
body.clair .progEtage,body.clair .monde .jauge{background:#ded0ae}
body.clair .persScene{background:radial-gradient(120% 90% at 50% 20%,#fffdf6,#ece0c4);border-color:#d8c9a4}

body.clair .expl{background:rgba(43,30,14,.05);border-left-color:#a06a12;color:#4a3a1c}
body.clair .enig{background:linear-gradient(170deg,#fffdf6,#f2e8d0);border-color:#d8c9a4}
body.clair .enig .txt{color:#3a3020}
body.clair .credits{background:#f2e8d0;border-color:#ded0ae;color:#6b6152}
body.clair .tab th{color:#6b6152;border-bottom-color:#d8c9a4}
body.clair .tab td{border-bottom-color:#e6dcc2}
body.clair .tab tr.moi td{background:rgba(160,106,18,.10);color:#7a4f0a}
body.clair .bas{background:linear-gradient(180deg,rgba(246,239,221,.4),#eadfc4);border-top-color:#d8c9a4}
body.clair .bas button{color:#6b6152}
body.clair .bas button.on{color:#7a4f0a}
body.clair .pill{background:#fffdf6;border-color:#d8c9a4;color:#7a4f0a}
body.clair .vide{color:#6b6152}
body.clair .toast{background:linear-gradient(180deg,#fffdf6,#f0e2c2);border-color:#a06a12;color:#7a4f0a}
body.clair .avis{background:radial-gradient(120% 90% at 50% 40%,rgba(255,253,246,.94),rgba(226,210,173,.97))}
body.clair .avisTxt{background:linear-gradient(170deg,#fffdf6,#f2e8d0);border-color:#a06a12;color:#3a3020;
  box-shadow:0 20px 60px rgba(120,100,60,.3)}
body.clair .spin{border-color:#d8c9a4;border-top-color:#a06a12}
body.clair .note,body.clair .crit div{background:#fffdf6;border-color:#d8c9a4;color:var(--txt)}
body.clair .crit div{border-bottom-color:#e6dcc2}
body.clair .note .n{color:#7a4f0a}
body.clair .chrono,body.clair .xpbar{background:#e0d3b2}

/* le bouton en haut a gauche */
#btnOlam{position:fixed;top:12px;left:12px;z-index:70;display:flex;align-items:center;gap:8px;
  padding:10px 16px;border-radius:99px;font-size:14px;font-weight:700;letter-spacing:.4px;
  background:linear-gradient(180deg,#fffdf6,#e8dcc0);color:#7a4f0a;border:1px solid #d9a441;
  box-shadow:0 6px 22px rgba(240,201,107,.35);animation:apparait .5s cubic-bezier(.2,1.4,.4,1)}
#btnOlam .bo-ico{font-size:16px}
#btnOlam.actif{background:linear-gradient(180deg,#3b2814,#1d1207);color:#f0c96b;border-color:#a06a12;
  box-shadow:0 6px 22px rgba(90,70,40,.3)}
@keyframes apparait{from{opacity:0;transform:translateY(-14px) scale(.85)}to{opacity:1;transform:none}}
@media(max-width:520px){#btnOlam{padding:9px 13px;font-size:13px}#btnOlam .bo-txt{display:none}}

/* ---------- chat rabbin ---------- */
.chAvert{padding:12px 14px;border-radius:12px;background:rgba(63,111,168,.14);border:1px solid #3f6fa8;
  color:var(--txt2);font-size:13.5px;line-height:1.5;margin-bottom:12px}
body.clair .chAvert{background:rgba(63,111,168,.1);color:#4a5a6b}
.chFil{min-height:220px;max-height:52vh;overflow-y:auto;display:flex;flex-direction:column;gap:10px;
  padding:14px;border-radius:var(--r);background:linear-gradient(180deg,#241708,#160e05);border:1px solid #5a3d18}
body.clair .chFil{background:linear-gradient(180deg,#fffdf6,#f2e8d0);border-color:#d8c9a4}
.bulle{max-width:88%;padding:13px 15px;border-radius:16px;font-size:15.5px;line-height:1.55}
.bulle p{margin:0 0 8px}
.bulle p:last-child{margin:0}
.bulle.moi{align-self:flex-end;background:linear-gradient(180deg,#3f6fa8,#2f4a7a);color:#fff;border-bottom-right-radius:5px}
.bulle.rav{align-self:flex-start;background:linear-gradient(170deg,var(--parchemin),var(--parchemin2));
  color:var(--encre);border:1px solid #b99b5f;border-bottom-left-radius:5px}
.bulleSrc{margin-top:10px;padding-top:9px;border-top:1px dashed #b99b5f;font-size:13px}
.bulleSrc b{display:block;color:#7a6134;margin-bottom:5px;font-size:12.5px}
.bulleSrc a{display:block;color:#7a3f14;margin-bottom:4px;text-decoration:none}
.bulleSrc a:hover{text-decoration:underline}
.bulleSrc a small{color:#8a7a5e;font-size:11.5px}
.bulleAlerte{margin-top:9px;padding:9px 11px;border-radius:10px;background:rgba(168,50,44,.12);
  border-left:3px solid #a8322c;font-size:13.5px;color:#6b2420}
.bulleMeta{margin-top:7px;font-size:11px;color:#8a7a5e}
.chEx{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}
.chEx .pill{cursor:pointer;text-align:left;line-height:1.35;max-width:100%}
.chEx .pill:hover{border-color:var(--or)}
.chBarre{display:flex;gap:10px;align-items:flex-end}
.chBarre textarea{flex:1;min-height:56px;resize:vertical}
.chBtns{display:flex;flex-direction:column;gap:8px}
.chBtns .btn{padding:11px 16px;white-space:nowrap}
@media(max-width:520px){.chBarre{flex-direction:column;align-items:stretch}.chBtns{flex-direction:row}.chBtns .btn{flex:1}}

/* ---------- duel de vitesse ---------- */
body.enDuel .hdr,body.enDuel .bas,body.enDuel #btnOlam,body.enDuel .credits{display:none}
body.enDuel .wrap{padding:0;max-width:none}
#e-duelJeu{position:fixed;inset:0;z-index:60}
.duJeu{display:flex;flex-direction:column;height:100dvh;background:#0c0803}
.duCote{flex:1;display:flex;flex-direction:column;justify-content:center;gap:10px;padding:14px 16px;
  transition:background .2s}
.duCote.haut{transform:rotate(180deg);background:linear-gradient(180deg,#1b2740,#0f1626)}
.duCote.bas{background:linear-gradient(180deg,#2a1c0e,#160e05)}
.duCote.gagne{background:linear-gradient(180deg,#1f4a2c,#122b19)}
.duCote.rate{opacity:.5}
.duScore{display:flex;align-items:center;justify-content:space-between;font-size:15px}
.duScore b{color:#f0c96b}
.duScore span{font-size:26px;font-weight:700;color:#fff}
.duCote.haut .duScore b{color:#8ab4e0}
.duQ{font-size:17px;line-height:1.35;font-weight:600;color:#f4e9d4;text-align:center}
.duReps{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.duRep{display:flex;align-items:center;gap:8px;padding:12px 10px;border-radius:12px;text-align:left;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:#f4e9d4;font-size:14px;line-height:1.25}
.duRep:active{transform:scale(.97)}
.duL{width:22px;height:22px;flex:0 0 22px;border-radius:6px;background:rgba(255,255,255,.18);
  display:grid;place-items:center;font-size:12px;font-weight:700}
.duRep.bon{background:#2f6b3f;border-color:#8fd6a0}
.duRep.mauv{background:#7a2420;border-color:#e0a08a}
.duMilieu{flex:0 0 34px;display:grid;place-items:center;background:#160e05;border-top:1px solid #3b2814;border-bottom:1px solid #3b2814}
.duMilieu span{font-size:13px;color:#c4ae86;letter-spacing:2px}
.duFlash{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:5;
  background:#f0c96b;color:#2b1e0e;padding:10px 22px;border-radius:99px;font-weight:700;font-size:16px;
  box-shadow:0 8px 30px rgba(0,0,0,.6);animation:pop .25s}
.duQuit{position:fixed;top:8px;right:10px;z-index:6;width:34px;height:34px;border-radius:50%;
  background:rgba(0,0,0,.45);color:#f4e9d4;font-size:16px}
@media(min-height:700px){.duQ{font-size:19px}.duRep{font-size:15px;padding:14px 12px}}

/* ---------- blind test ---------- */
.lecteur{display:flex;align-items:center;gap:14px;padding:14px;border-radius:14px;
  background:rgba(43,30,14,.08);border:1px solid #c9ab72;margin:12px 0}
.btLire{width:52px;height:52px;flex:0 0 52px;border-radius:50%;font-size:19px;
  background:linear-gradient(180deg,#e0b354,#a9761f);color:#2b1e0e;box-shadow:0 4px 0 #6b4a12}
.btLire:active{transform:translateY(3px);box-shadow:0 1px 0 #6b4a12}
.btOnde{flex:1;display:flex;align-items:center;gap:4px;height:34px}
.btOnde i{flex:1;height:6px;border-radius:99px;background:#c9ab72;transition:height .18s}
.btOnde.joue i{animation:onde 1.1s ease-in-out infinite}
.btOnde.joue i:nth-child(2n){animation-delay:.15s}
.btOnde.joue i:nth-child(3n){animation-delay:.3s}
.btOnde.joue i:nth-child(5n){animation-delay:.45s}
@keyframes onde{0%,100%{height:6px}50%{height:28px}}
.btTemps{font-size:14px;color:#7a6134;font-variant-numeric:tabular-nums;min-width:38px;text-align:right}
.ficheMusique{margin-top:12px;padding:14px;border-radius:12px;background:#241708;border:1px solid #5a3d18}
body.clair .ficheMusique{background:#fffdf6;border-color:#d8c9a4}
.ficheMusique b{display:block;font-size:19px;color:var(--or2)}
.ficheMusique>span{display:block;font-size:14.5px;color:var(--txt2);margin-top:2px}
.ficheLic{margin-top:9px;padding-top:8px;border-top:1px dashed #3b2814;font-size:12.5px;color:var(--txt2);line-height:1.5}
body.clair .ficheLic{border-top-color:#ded0ae}
.ficheLic a{color:var(--or);margin-left:6px}

/* ---------- visages et lieux ---------- */
.cadreImage{position:relative;margin:12px 0;border-radius:14px;overflow:hidden;border:1px solid #c9ab72;
  background:#241708;min-height:200px;display:grid;place-items:center}
body.clair .cadreImage{background:#f0e6cd;border-color:#d8c9a4}
.cadreImage img{display:block;width:100%;height:auto;max-height:52vh;object-fit:contain}
.chargement{position:absolute;font-size:14px;color:var(--txt2);letter-spacing:1px;padding:20px;text-align:center}

/* ---------- compte ---------- */
.champ.secret{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13.5px;word-break:break-all;
  user-select:all;cursor:text;line-height:1.5;padding:11px 13px}
.pill.actif{background:linear-gradient(180deg,#e0b354,#a9761f);color:#2b1e0e;border-color:#f0c96b;font-weight:700}
body.clair .pill.actif{color:#2b1e0e}

/* ---------- blocs replies, pour alleger le bas des ecrans ---------- */
.sousHeb{text-align:center;font-size:13.5px;color:var(--txt2);margin:-10px 0 16px;font-style:italic}
details.repli,details.credits{margin-top:16px;padding:0;border-radius:var(--r);background:#160e05;border:1px solid #2e1f0d;
  font-size:13px;line-height:1.6;color:#8a7a5e}
body.clair details.repli,body.clair details.credits{background:#f2e8d0;border-color:#ded0ae;color:#6b6152}
details.repli summary,details.credits summary{cursor:pointer;padding:13px 16px;color:var(--or3);font-size:13.5px;
  letter-spacing:.3px;list-style:none;user-select:none}
details.repli summary::-webkit-details-marker,details.credits summary::-webkit-details-marker{display:none}
details.repli summary::after,details.credits summary::after{content:" ▾";opacity:.6}
details.repli[open] summary::after,details.credits[open] summary::after{content:" ▴"}
details.repli[open],details.credits[open]{padding-bottom:14px}
details.repli>*:not(summary),details.credits>*:not(summary){padding:0 16px}
details.credits a{color:var(--or)}

/* ========== LA COUVÉE ==========
   L'œuf, la bête du moment, la collection, et l'arche.
   Tout est du SVG dessiné dans la page, rien n'est chargé. */
.cvScene { display:flex; justify-content:center; align-items:flex-end; min-height:190px; margin:6px 0 2px; }
.cvScene svg { filter:drop-shadow(0 4px 10px rgba(0,0,0,.35)); }
.cvNom { font-size:19px; font-weight:700; color:var(--or); margin-top:6px; }
.cvNom .heb { font-size:17px; opacity:.85; margin-left:6px; }
.cvMot { font-size:14.5px; line-height:1.5; color:#e6dcc6; margin-top:6px; }
body.clair .cvMot { color:#4a3c22; }
.cvChiffres { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:12px; }
.cvChiffres div { background:rgba(0,0,0,.22); border-radius:10px; padding:8px 4px; }
body.clair .cvChiffres div { background:rgba(0,0,0,.06); }
.cvChiffres b { display:block; font-size:19px; color:var(--or); }
.cvChiffres span { font-size:11.5px; opacity:.8; }

.cvGrille { display:grid; grid-template-columns:repeat(auto-fill,minmax(88px,1fr)); gap:8px; margin-top:10px; }
.cvCase { background:rgba(0,0,0,.24); border:1px solid rgba(217,164,65,.28); border-radius:12px;
  padding:6px 4px 4px; display:flex; flex-direction:column; align-items:center; cursor:pointer; }
body.clair .cvCase { background:rgba(0,0,0,.05); border-color:rgba(122,63,20,.25); }
.cvCase small { font-size:11px; margin-top:2px; color:#e6dcc6; text-align:center; line-height:1.25; }
body.clair .cvCase small { color:#4a3c22; }
.cvCase.vide { opacity:.4; cursor:default; justify-content:center; min-height:86px; }
.cvCase.vide span { font-size:22px; color:var(--or); }
.cvCase:not(.vide):hover { border-color:var(--or); }

.cvGagne { display:flex; align-items:center; gap:12px; margin-top:12px; padding:10px;
  background:linear-gradient(120deg,rgba(217,164,65,.18),rgba(217,164,65,.04));
  border:1px solid rgba(217,164,65,.4); border-radius:14px; animation:cvPop .45s ease-out; }
.cvGagne b { color:var(--or); font-size:16px; }
.cvGagne small { display:block; font-size:13px; line-height:1.45; opacity:.9; margin-top:3px; }
@keyframes cvPop { from{transform:scale(.86);opacity:0} to{transform:scale(1);opacity:1} }

/* ---- l'arche ---- */
.arche { position:fixed; inset:0; z-index:120; background:#080c12;
  display:flex; flex-direction:column; align-items:center; justify-content:center; padding:16px; overflow:auto; }
.archeCiel { position:relative; width:min(560px,94vw); height:min(360px,52vh);
  background:linear-gradient(180deg,#16273b 0%,#2c4a63 55%,#3f6a86 100%); border-radius:18px; overflow:hidden; }
.archeArcEnCiel { position:absolute; left:0; right:0; top:6%; width:100%; height:46%; opacity:0; animation:arcApparait 2s ease-out 2.4s forwards; }
@keyframes arcApparait { to { opacity:.9 } }
.archePluie { position:absolute; inset:0;
  background:repeating-linear-gradient(102deg,rgba(200,225,245,.28) 0 1px,transparent 1px 13px);
  animation:archePleut 1.1s linear infinite, archeCesse 2.6s ease-out forwards; }
@keyframes archePleut { to { background-position:44px 120px } }
@keyframes archeCesse { to { opacity:0 } }
.archeBateau { position:absolute; left:50%; bottom:11%; width:58%; transform:translateX(-50%); animation:archeFlotte 3.6s ease-in-out infinite; }
@keyframes archeFlotte { 0%,100%{transform:translateX(-50%) translateY(0) rotate(-1deg)} 50%{transform:translateX(-50%) translateY(-7px) rotate(1deg)} }
.archeRampe { position:absolute; left:0; right:0; bottom:9%; height:56px; }
.archeBete { position:absolute; bottom:0; left:-14%; display:flex; gap:2px;
  animation:archeMonte 8s linear infinite; }
@keyframes archeMonte { 0%{left:-18%;opacity:0} 10%{opacity:1} 70%{left:36%;opacity:1} 86%{left:44%;opacity:0} 100%{left:44%;opacity:0} }
.archeEau { position:absolute; left:0; right:0; bottom:0; height:16%;
  background:linear-gradient(180deg,#2f6a8a,#17364a);
  box-shadow:inset 0 4px 12px rgba(255,255,255,.16); }
.archeTxt { text-align:center; max-width:min(560px,94vw); margin-top:14px; }
.archeTxt b { display:block; font-size:20px; color:var(--or); }
.archeTxt span { display:block; font-size:14px; line-height:1.55; color:#e6dcc6; margin:6px 0 12px; }
@media (max-width:420px) {
  .cvGrille { grid-template-columns:repeat(auto-fill,minmax(76px,1fr)); }
  .cvCase small { font-size:11.5px; }
  .archeCiel { height:44vh; }
}

/* ========== RÉCOMPENSES ==========
   Une pièce qui monte à chaque bonne réponse, un coffre toutes les dix.
   Rien ne bloque la lecture de l'explication. */
.zouzVole { position:fixed; left:50%; bottom:86px; transform:translateX(-50%); z-index:95;
  font-size:17px; font-weight:800; color:#f0d264; text-shadow:0 2px 6px rgba(0,0,0,.7);
  pointer-events:none; animation:zouzMonte 1.5s ease-out forwards; }
.zouzPiece { font-size:15px; }
@keyframes zouzMonte { 0%{opacity:0;transform:translateX(-50%) translateY(10px) scale(.7)}
  18%{opacity:1;transform:translateX(-50%) translateY(0) scale(1.1)}
  32%{transform:translateX(-50%) translateY(-4px) scale(1)}
  100%{opacity:0;transform:translateX(-50%) translateY(-62px) scale(.9)} }

.coffre { position:fixed; inset:0; z-index:130; background:rgba(8,12,18,.92);
  display:flex; align-items:center; justify-content:center; padding:16px; }
.coffreBoite { background:linear-gradient(160deg,#2a1c0e,#1a1208); border:1px solid rgba(217,164,65,.55);
  border-radius:18px; padding:18px 16px; width:min(420px,94vw); text-align:center;
  box-shadow:0 18px 50px rgba(0,0,0,.6); animation:cvPop .4s ease-out; }
.coffreSeuil { font-size:12.5px; letter-spacing:.08em; text-transform:uppercase; color:#c2a468; }
.coffreSvg { display:flex; justify-content:center; margin:6px 0 4px; }
.coffreGain { display:flex; align-items:center; gap:12px; text-align:left; margin:10px 0 4px;
  padding:10px; border-radius:14px; border:1px solid rgba(217,164,65,.45);
  background:linear-gradient(120deg,rgba(217,164,65,.2),rgba(217,164,65,.05)); }
.coffreEm { font-size:30px; }
.coffreGain b { display:block; color:#f0d264; font-size:16px; }
.coffreGain small { display:block; font-size:13px; line-height:1.45; color:#e6dcc6; margin-top:3px; }
.coffreFrag { display:flex; align-items:center; gap:4px; flex-wrap:wrap; justify-content:center; margin:8px 0; }
.coffreFrag i { width:15px; height:19px; border-radius:2px; background:rgba(255,255,255,.1);
  border:1px solid rgba(217,164,65,.4); }
.coffreFrag i.on { background:linear-gradient(180deg,#e8dcc4,#c9a06a); border-color:#d9a441; }
.coffreFrag span { font-size:12.5px; color:#c2a468; margin-left:6px; }
.coffreSefer { margin-top:10px; padding:10px; border-radius:12px; font-size:13.5px; line-height:1.5;
  background:rgba(217,164,65,.16); border:1px solid rgba(217,164,65,.5); color:#f4e9d4; }
body.clair .coffreBoite { background:linear-gradient(160deg,#fdf8ec,#f0e5cf); border-color:rgba(122,63,20,.4); }
body.clair .coffreGain b { color:#7a3f14; }
body.clair .coffreGain small, body.clair .coffreSefer { color:#4a3c22; }

/* ========== LE MYSTÈRE ==========
   Ce qui n'est pas encore gagné ne se montre pas. */
.stade.mystere .stadeFig { position:relative; }
.stade.mystere .stadeFig svg { filter:brightness(0) saturate(0); opacity:.45; }
body.clair .stade.mystere .stadeFig svg { filter:brightness(0) saturate(0); opacity:.3; }
.stadeQ { position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-size:26px; font-weight:800; color:var(--or); text-shadow:0 2px 6px rgba(0,0,0,.6); }
.stade.mystere b { opacity:.6; font-style:italic; }
.livre.ferme { background:linear-gradient(90deg,#14100a,#241708) !important; border:1px solid rgba(217,164,65,.22); }
.livre.ferme span { color:var(--or); opacity:.75; font-weight:800; letter-spacing:0; }

/* ========== LE VERDICT ==========
   Bonne ou mauvaise reponse, ca doit se voir sans lire. */
.verdict { display:flex; align-items:center; justify-content:center; gap:12px;
  margin:12px 0 8px; padding:14px 16px; border-radius:16px; animation:verdictPop .34s cubic-bezier(.2,1.4,.4,1); }
.verdictSigne { font-size:34px; line-height:1; font-weight:900; }
.verdictMot { font-size:30px; font-weight:900; letter-spacing:.02em; }
.verdict.juste { background:linear-gradient(120deg,rgba(74,138,106,.34),rgba(74,138,106,.12));
  border:2px solid #4a8a6a; color:#8fe0b4; }
.verdict.faux { background:linear-gradient(120deg,rgba(168,50,44,.34),rgba(168,50,44,.12));
  border:2px solid #a8322c; color:#f2a09a; }
body.clair .verdict.juste { background:linear-gradient(120deg,rgba(31,106,74,.2),rgba(31,106,74,.06));
  border-color:#1f6a4a; color:#12513a; }
body.clair .verdict.faux { background:linear-gradient(120deg,rgba(150,32,26,.18),rgba(150,32,26,.05));
  border-color:#96201a; color:#8a1a14; }
@keyframes verdictPop { from{transform:scale(.7);opacity:0} to{transform:scale(1);opacity:1} }
@media (max-width:420px) { .verdictSigne { font-size:28px } .verdictMot { font-size:25px } }

/* ========== PALIERS VERROUILLÉS ==========
   Une fenetre noire, un point d'interrogation, rien d'autre. */
.niv.mystere { background:linear-gradient(160deg,#0d0a06,#181008) !important;
  border-color:rgba(217,164,65,.22) !important; }
body.clair .niv.mystere { background:linear-gradient(160deg,#1a1610,#2a231a) !important;
  border-color:rgba(122,63,20,.35) !important; }
.niv.mystere b { font-size:30px; color:var(--or); opacity:.85; }
.niv.mystere small { color:#c2a468; opacity:.75; font-style:italic; }
.niv.mystere .etoiles span { color:#4a3a22; opacity:.5; }

/* ========== MOTEUR 3D ==========
   Des boîtes en CSS 3D. Pas de bibliothèque, pas de WebGL,
   l'application reste jouable hors ligne. */
.s3hote { position:relative; margin-top:12px; }
.s3 { position:relative; height:min(58vh,420px); border-radius:16px; overflow:hidden;
  background:radial-gradient(ellipse at 50% 30%, #3a2712 0%, #1a1208 70%);
  perspective:1100px; perspective-origin:50% 42%; cursor:grab; touch-action:none;
  border:1px solid rgba(217,164,65,.28); }
.s3:active { cursor:grabbing; }
body.clair .s3 { background:radial-gradient(ellipse at 50% 30%, #efe3c8 0%, #cdbc98 70%);
  border-color:rgba(122,63,20,.3); }
.s3monde { position:absolute; left:50%; top:52%; width:0; height:0;
  transform-style:preserve-3d; transition:transform .12s linear; }
.s3monde.s3tourne { animation:s3rot 22s linear infinite; transition:none; }
@keyframes s3rot { to { transform:rotateX(-30deg) rotateY(322deg) scale(.72) } }
.b3 { position:absolute; transform-style:preserve-3d; }
/* backface masquee : chaque face ne se peint que vue de l'exterieur.
   C'est ce qui rend les volumes pleins au lieu de les rendre troues.
   ⚠️ PAS d'outline ici : 744 faces composees en 3D avec un contour
   chacune saturent le compositeur et la scene se met a clignoter ou
   a ne plus se repeindre. Le trait de separation est dessine dans le
   degrade de l'appareil de pierre, ca ne coute rien de plus. */
.f3 { position:absolute; left:0; top:0; transform-origin:0 0;
  backface-visibility:hidden; -webkit-backface-visibility:hidden; }
.b3etq { position:absolute; left:0; top:0; transform-origin:0 0; font-size:9px; color:#f4e9d4;
  text-shadow:0 1px 3px rgba(0,0,0,.9); pointer-events:none; white-space:nowrap; }
.b3[data-p3] { cursor:pointer; }
.b3[data-p3]:hover .f3 { filter:brightness(1.3); }
.b3plan .f3 { filter:saturate(.5) brightness(1.1); box-shadow:inset 0 0 0 1px rgba(217,164,65,.6); }

.s3outils { display:flex; gap:6px; justify-content:center; flex-wrap:wrap; margin-top:8px; }
.s3b { min-width:42px; height:38px; border-radius:10px; font-size:16px; cursor:pointer;
  background:rgba(217,164,65,.13); border:1px solid rgba(217,164,65,.4); color:var(--or); }
.s3b:hover { background:rgba(217,164,65,.26); }
body.clair .s3b { background:rgba(122,63,20,.08); border-color:rgba(122,63,20,.32); color:#7a3f14; }

.m3Liste { display:grid; grid-template-columns:repeat(auto-fill,minmax(132px,1fr)); gap:8px; margin-top:10px; }
.m3Case { text-align:left; padding:10px; border-radius:12px; cursor:pointer;
  background:rgba(0,0,0,.24); border:1px solid rgba(217,164,65,.28); }
body.clair .m3Case { background:rgba(0,0,0,.05); border-color:rgba(122,63,20,.25); }
.m3Case b { display:block; color:var(--or); font-size:14.5px; }
.m3Case small { display:block; font-size:12.5px; opacity:.8; margin-top:2px; }
.m3Case.ferme { opacity:.45; cursor:default; }
.m3Case:not(.ferme):hover { border-color:var(--or); }
.m3Fiche { margin-top:12px; }
.m3Mesure { margin-top:8px; font-size:13.5px; line-height:1.5; padding:8px 10px; border-radius:10px;
  background:rgba(217,164,65,.12); border-left:3px solid var(--or); }
.m3Mesure b { color:var(--or); margin-right:6px; }

/* ========== LA LOUPE ==========
   Tout ce qui est dessiné peut s'ouvrir en grand. */
.loupe { position:fixed; inset:0; z-index:140; background:rgba(8,12,18,.95);
  display:flex; flex-direction:column; padding:10px; }
body.clair .loupe { background:rgba(250,244,230,.97); }
.loupeBarre { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; padding:4px 6px 8px; }
.loupeTitre b { display:block; color:var(--or); font-size:17px; }
.loupeTitre small { display:block; font-size:12.5px; opacity:.75; margin-top:2px; }
.loupeX { width:40px; height:40px; border-radius:12px; font-size:17px; cursor:pointer; flex:0 0 auto;
  background:rgba(217,164,65,.14); border:1px solid rgba(217,164,65,.42); color:var(--or); }
.loupeZone { flex:1; overflow:hidden; display:flex; align-items:center; justify-content:center;
  touch-action:none; cursor:grab; }
.loupeZone:active { cursor:grabbing; }
.loupeContenu { width:min(86vw,560px); height:min(62vh,560px); display:flex;
  align-items:center; justify-content:center; transition:transform .06s linear; }
.loupeContenu svg, .loupeContenu img { max-width:100%; max-height:100%; }
.loupeOutils { display:flex; gap:8px; align-items:center; justify-content:center; padding:8px 0 4px; }
.loupeNiv { min-width:64px; text-align:center; font-size:13.5px; color:var(--or); }

/* le bouton clair sombre en haut à droite */
#btnTheme { position:fixed; top:10px; right:10px; z-index:90; width:44px; height:44px;
  border-radius:14px; font-size:19px; cursor:pointer; line-height:1;
  background:rgba(26,18,8,.82); border:1px solid rgba(217,164,65,.45); color:var(--or);
  box-shadow:0 4px 14px rgba(0,0,0,.35); }
body.clair #btnTheme { background:rgba(253,248,236,.9); border-color:rgba(122,63,20,.35); color:#7a3f14; }
#btnTheme:hover { transform:scale(1.06); }

/* ========== LA VITRINE DE L'ACCUEIL ==========
   Les deux chantiers en cours, visibles dès la première seconde. */
.vitrine { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:14px; }
.vitrineCase { background:rgba(0,0,0,.24); border:1px solid rgba(217,164,65,.3); border-radius:16px;
  padding:10px 8px 12px; text-align:center; cursor:pointer; }
body.clair .vitrineCase { background:rgba(0,0,0,.05); border-color:rgba(122,63,20,.25); }
.vitrineCase:hover { border-color:var(--or); }
.vitrineFig { display:flex; align-items:flex-end; justify-content:center; min-height:80px; }
.vitrineCase b { display:block; color:var(--or); font-size:14.5px; margin-top:4px; }
.vitrineCase small { display:block; font-size:12px; opacity:.82; margin:2px 0 6px; }
.vitrineCase .jauge { display:block; }
@media (max-width:360px) { .vitrine { grid-template-columns:1fr } }

/* ========== LA VISITE ==========
   Caméra libre dans le Temple, joystick au pouce, vol aux boutons. */
.vi3 { position:relative; height:min(66vh,480px); border-radius:16px; overflow:hidden;
  perspective:520px; perspective-origin:50% 50%; touch-action:none; cursor:grab;
  border:1px solid rgba(217,164,65,.35); background:#0a0d14; }
.vi3:active { cursor:grabbing; }
.vi3ciel { position:absolute; inset:0;
  background:linear-gradient(180deg,#0d1b2c 0%,#254059 42%,#7a6a4a 74%,#3a2f20 100%); }
.vi3monde { position:absolute; left:50%; top:50%; width:0; height:0; transform-style:preserve-3d; }
.vi3perso { position:absolute; left:0; top:0; width:76px; height:76px; margin:-76px 0 0 -38px;
  transform-style:preserve-3d; pointer-events:none;
  filter:drop-shadow(0 6px 10px rgba(0,0,0,.6)); }

.vi3hud { position:absolute; left:0; right:0; top:0; padding:10px 12px; pointer-events:none; }
.vi3lieu { display:inline-block; font-size:15px; font-weight:700; color:#f4e9d4;
  background:rgba(10,13,20,.72); border:1px solid rgba(217,164,65,.45);
  border-radius:10px; padding:5px 12px; }
.vi3aide { margin-top:6px; font-size:11.5px; color:#e6dcc6; opacity:.8;
  background:rgba(10,13,20,.5); border-radius:8px; padding:3px 8px; display:inline-block; }

.vi3stick { position:absolute; left:14px; bottom:14px; width:104px; height:104px; border-radius:50%;
  background:rgba(10,13,20,.5); border:1px solid rgba(217,164,65,.4); touch-action:none; }
.vi3stick i { position:absolute; left:50%; top:50%; width:42px; height:42px; margin:-21px 0 0 -21px;
  border-radius:50%; background:radial-gradient(circle at 35% 30%,#f0d264,#8a6420);
  box-shadow:0 3px 10px rgba(0,0,0,.5); }
.vi3vol { position:absolute; right:14px; bottom:14px; display:flex; flex-direction:column; gap:8px; }
.vi3vue { position:absolute; right:14px; top:14px; display:flex; flex-direction:column; gap:8px; align-items:flex-end; }
.vi3b { min-width:48px; height:40px; padding:0 10px; border-radius:12px; font-size:14px; cursor:pointer;
  background:rgba(10,13,20,.68); border:1px solid rgba(217,164,65,.45); color:#f0d264; }
.vi3b:hover { background:rgba(217,164,65,.24); }
@media (max-width:420px) {
  .vi3 { height:62vh; }
  .vi3stick { width:92px; height:92px; }
  .vi3stick i { width:38px; height:38px; margin:-19px 0 0 -19px; }
}

/* =========================================================
   TAILLE DU TEXTE
   Demandé le 20/08/2026 : le texte est trop petit, l'hébreu
   surtout. L'hébreu vocalisé porte ses points sous la lettre,
   il devient illisible bien avant le français à taille égale.
   On le monte donc beaucoup plus fort que le reste.
   Ce bloc est en fin de feuille pour passer devant le reste.
   ========================================================= */

/* --- l'hébreu, très fortement agrandi --- */
.heb {
  font-size: 40px !important;
  line-height: 1.75 !important;
  letter-spacing: 3px !important;
  margin-bottom: 20px !important;
}
.cvNom .heb, .m3Case small, .persNom span,
.qtxt .heb, .coffreGain .heb { font-size: 26px !important; line-height: 1.7 !important; }
.stade small, .phaseLigne small { font-size: 17px !important; line-height: 1.6 !important; }
.phaseLigne small, .m3Case small { color: var(--or); opacity: .95; }

/* --- le corps du texte --- */
body { font-size: 17.5px; }
.qtxt { font-size: 23px !important; line-height: 1.5 !important; }
.rep span:last-child { font-size: 18px !important; line-height: 1.45 !important; }
.expl, .cvMot, .m3Mesure, .archeTxt span { font-size: 17px !important; line-height: 1.62 !important; }
.qmeta { font-size: 14.5px !important; letter-spacing: .06em; }
.sous, .monde .sous { font-size: 15px !important; }
.mode b, .monde b, .niv b, .m3Case b, .cvCase b { font-size: 18px !important; }
.mode small, .niv small, .cvCase small { font-size: 14.5px !important; line-height: 1.4 !important; }
.mikEtat b, .cvChiffres b, .chiffre b { font-size: 24px !important; }
.mikEtat span, .cvChiffres span { font-size: 13.5px !important; }
h1 { font-size: 30px !important; }
h2 { font-size: 21px !important; }
.src, .ficheLic { font-size: 13.5px !important; line-height: 1.55 !important; }
.persNom b { font-size: 24px !important; }
.verdictMot { font-size: 34px !important; }
.verdictSigne { font-size: 38px !important; }

@media (max-width: 420px) {
  .heb { font-size: 32px !important; letter-spacing: 2px !important; }
  .cvNom .heb, .persNom span { font-size: 23px !important; }
  .qtxt { font-size: 21px !important; }
  .rep span:last-child { font-size: 17px !important; }
  h1 { font-size: 26px !important; }
  .verdictMot { font-size: 29px !important; }
  .verdictSigne { font-size: 33px !important; }
}

/* L'hébreu porté à 300 pour cent de sa taille d'origine, comme demandé.
   17px au départ, donc 51px. Les mottos hébreux sont courts, ils tiennent
   sur deux ou trois lignes, et la vocalisation redevient lisible. */
.heb { font-size: 51px !important; line-height: 1.7 !important; }
.cvNom .heb, .persNom span, .qtxt .heb { font-size: 34px !important; }
.stade small, .phaseLigne small, .m3Case small { font-size: 21px !important; }
@media (max-width: 420px) {
  .heb { font-size: 40px !important; letter-spacing: 1px !important; }
  .cvNom .heb, .persNom span { font-size: 28px !important; }
  .stade small, .phaseLigne small, .m3Case small { font-size: 18px !important; }
}

/* ========== NAVIGATION EN HAUT A GAUCHE ==========
   Gros, noir, au même endroit sur toutes les pages. */
#navHaut { position:fixed; left:10px; top:10px; z-index:92; display:flex; gap:6px;
  background:rgba(8,10,14,.9); border:1px solid rgba(217,164,65,.5); border-radius:14px;
  padding:6px; box-shadow:0 6px 18px rgba(0,0,0,.5); }
#navHaut.cache { display:none; }
#navHaut button { min-height:44px; padding:0 14px; border-radius:10px; cursor:pointer;
  font-size:16px; font-weight:700; color:#f0d264; background:rgba(217,164,65,.12);
  border:1px solid rgba(217,164,65,.4); }
#navHaut button:hover:not(:disabled) { background:rgba(217,164,65,.28); }
#navHaut button:disabled { opacity:.35; cursor:default; }
body.clair #navHaut { background:rgba(20,14,6,.9); }
/* les anciens petits retours de chaque écran font doublon */
.retour { display:none !important; }
/* on dégage la place sous le bandeau */
.ecran { padding-top:58px; }
@media (max-width:420px) {
  #navHaut button { font-size:15px; padding:0 11px; }
}

/* ========== LA VACHE ========== */
.avert { margin-top:10px; padding:10px 12px; border-radius:12px; font-size:14.5px; line-height:1.55;
  background:rgba(168,50,44,.16); border-left:4px solid #a8322c; color:#f4e9d4; }
body.clair .avert { background:rgba(150,32,26,.1); color:#5a2018; }
.v3Legende { display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.v3Pastille { display:flex; align-items:center; gap:6px; padding:7px 11px; border-radius:11px;
  font-size:14px; cursor:pointer; color:#e6dcc6;
  background:rgba(0,0,0,.24); border:1px solid rgba(217,164,65,.28); }
body.clair .v3Pastille { background:rgba(0,0,0,.05); border-color:rgba(122,63,20,.25); color:#4a3c22; }
.v3Pastille i { width:13px; height:13px; border-radius:4px; background:var(--c); flex:0 0 auto; }
.v3Pastille b { color:var(--or); }
.v3Pastille.actif { border-color:var(--c); background:color-mix(in srgb, var(--c) 22%, transparent); }
.v3rep { width:34px; height:34px; margin:-17px 0 0 -17px; display:flex; align-items:center;
  justify-content:center; font-size:20px; border-radius:50%; cursor:pointer;
  background:rgba(10,13,20,.82); border:2px solid var(--or); }
.v3rep:hover { transform-origin:center; filter:brightness(1.3); }

/* ========== BLIND TEST DES NIGGOUNIM ========== */
.ngParties { display:flex; flex-wrap:wrap; gap:8px; margin:4px 0 12px; }
.ngPartie { padding:10px 14px; border-radius:12px; font-size:15px; cursor:pointer; color:var(--or);
  background:rgba(217,164,65,.13); border:1px solid rgba(217,164,65,.42); }
.ngPartie:hover { background:rgba(217,164,65,.26); }
.ngPartie.joue { background:rgba(217,164,65,.45); color:#1a1208; font-weight:700; }
body.clair .ngPartie { background:rgba(122,63,20,.09); border-color:rgba(122,63,20,.3); color:#7a3f14; }

/* ---- la visite guidée ---- */
.vi3guide { position:absolute; left:10px; right:10px; bottom:10px; z-index:6;
  background:rgba(8,10,14,.93); border:1px solid rgba(217,164,65,.5); border-radius:14px;
  padding:12px 14px; max-height:56%; overflow:auto; }
.vi3gTitre { font-size:19px; font-weight:700; color:var(--or); margin-bottom:6px; }
.vi3gTitre .heb { font-size:24px !important; margin-left:8px; }
.vi3gTxt { font-size:15px; line-height:1.55; color:#f4e9d4; }
.vi3gTxt small { display:block; margin-top:6px; font-size:13.5px; color:#e8c95a; }
.vi3gTxt em { display:block; margin-top:6px; font-size:12.5px; color:#c2a468; font-style:normal; }
.vi3gBarre { display:flex; align-items:center; gap:8px; margin-top:10px; flex-wrap:wrap; }
.vi3gBarre span { font-size:14px; color:#c2a468; min-width:52px; text-align:center; }
.vi3b.actif { background:rgba(217,164,65,.42); color:#1a1208; font-weight:700; }

/* ---- le sélecteur de langue ---- */
#btnLangue { position:fixed; top:10px; right:62px; z-index:90; width:44px; height:44px;
  border-radius:14px; font-size:19px; cursor:pointer; line-height:1;
  background:rgba(26,18,8,.82); border:1px solid rgba(217,164,65,.45);
  box-shadow:0 4px 14px rgba(0,0,0,.35); }
body.clair #btnLangue { background:rgba(253,248,236,.9); border-color:rgba(122,63,20,.35); }
#btnLangue:hover { transform:scale(1.06); }
.langueChoix { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:14px 0 4px; }
/* l'hébreu passe la page de droite à gauche */
body.rtl #navHaut { left:auto !important; right:10px !important; }
body.rtl #btnTheme { right:auto !important; left:10px !important; }
body.rtl #btnLangue { right:auto !important; left:62px !important; }
body.rtl .cvChiffres, body.rtl .mikEtat { direction:rtl; }
body.rtl .expl, body.rtl .m3Mesure { border-left:none; border-right:3px solid var(--or); }

/* ========== MON SEFER ========== */
.sfTexte { min-height:220px; resize:vertical; line-height:1.65; font-size:17px; }
.sfEtat { margin-top:6px; font-size:13px; color:#c2a468; }
#sfMicro.ecoute { background:linear-gradient(120deg,#a8322c,#7a2320); color:#f4e9d4;
  border-color:#a8322c; animation:sfPulse 1.3s ease-in-out infinite; }
@keyframes sfPulse { 0%,100%{box-shadow:0 0 0 0 rgba(168,50,44,.55)} 50%{box-shadow:0 0 0 10px rgba(168,50,44,0)} }

/* ---- la visite en plein écran ---- */
.vi3:fullscreen, .vi3.vi3plein { border-radius:0; border:none; }
.vi3.vi3plein { position:fixed; inset:0; z-index:200; height:100vh; width:100vw; }
.vi3:fullscreen .vi3stick, .vi3.vi3plein .vi3stick { width:130px; height:130px; left:24px; bottom:24px; }
.vi3:fullscreen .vi3stick i, .vi3.vi3plein .vi3stick i { width:54px; height:54px; margin:-27px 0 0 -27px; }
.vi3:fullscreen .vi3b, .vi3.vi3plein .vi3b { min-width:56px; height:46px; font-size:15px; }
.vi3:fullscreen .vi3lieu, .vi3.vi3plein .vi3lieu { font-size:19px; padding:8px 16px; }
