/* ===========================================================
 * Le Voyage de Maxens — v5.0
 * Charte sombre, noble. Cinzel (titres) + Inter (texte).
 * Fond #0d1117, or #d4a72c. Zéro emoji.
 * =========================================================== */

:root{
  --bg:#0d1117; --bg2:#161b22; --card:#1b2230; --card2:#222b3a;
  --gold:#d4a72c; --gold-soft:#e9c46a;
  --txt:#e6edf3; --muted:#9aa7b4; --line:#2a3441;
  --good:#57cc99; --good-dk:#2f8f64;
  --regard:#e9c46a; --emotions:#e76f8a; --parole:#6ab0f3; --calme:#57cc99;
  --shadow:0 8px 24px rgba(0,0,0,.4);
}

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{margin:0;padding:0;}
body{
  background:var(--bg);
  color:var(--txt);
  font-family:'Inter',system-ui,sans-serif;
  font-size:16px;line-height:1.5;
  min-height:100vh;
  overflow-x:hidden;
}
.cinzel{font-family:'Cinzel',serif;letter-spacing:.02em;}
h1,h2{margin:0;}
button{font-family:inherit;cursor:pointer;border:none;}
input{font-family:inherit;}

/* ---------- bouton principal ---------- */
.big-btn{
  display:inline-block;width:100%;
  background:linear-gradient(180deg,var(--gold-soft),var(--gold));
  color:#1a1205;font-weight:700;font-size:1.05rem;
  padding:14px 18px;border-radius:14px;
  box-shadow:0 4px 0 #9c7715, var(--shadow);
  transition:transform .08s, box-shadow .08s;
}
.big-btn:active{transform:translateY(3px);box-shadow:0 1px 0 #9c7715;}
.big-btn.outline{
  background:transparent;color:var(--gold-soft);
  border:2px solid var(--gold);box-shadow:none;
}
.big-btn.outline:active{transform:translateY(1px);box-shadow:none;}

/* ===========================================================
 * ÉCRAN CODE
 * =========================================================== */
.screen-code{display:none;min-height:100vh;flex-direction:column;align-items:center;justify-content:center;
  padding:32px 22px;text-align:center;gap:14px;}
.screen-code.active{display:flex;}
.code-logo{font-size:2.4rem;color:var(--gold);}
.code-sub{color:var(--muted);max-width:300px;}
#codeInput{
  width:100%;max-width:320px;text-align:center;
  background:var(--card);color:var(--txt);
  border:1px solid var(--line);border-radius:12px;
  padding:14px;font-size:1.1rem;letter-spacing:.04em;
}
#codeInput:focus{outline:none;border-color:var(--gold);}
.screen-code .big-btn{max-width:320px;}
.code-err{color:#e76f8a;font-size:.9rem;min-height:1.1em;}

/* ===========================================================
 * COQUE DU JEU
 * =========================================================== */
#game[hidden]{display:none;}
.topbar{
  position:sticky;top:0;z-index:20;
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 16px;
  background:linear-gradient(180deg,#10151d,#0d1117);
  border-bottom:1px solid var(--line);
}
.tb-rank{display:flex;align-items:center;gap:8px;}
.tb-cmp{display:inline-flex;width:30px;height:30px;}
.tb-cmp svg{display:block;}
.tb-rank-name{font-size:1.15rem;color:var(--gold);}
.tb-stats{display:flex;gap:10px;align-items:center;}
.tb-xp{font-weight:700;color:var(--gold-soft);}
.tb-streak{font-size:.82rem;color:var(--muted);background:var(--card);
  padding:3px 9px;border-radius:20px;border:1px solid var(--line);}

#view{max-width:560px;margin:0 auto;padding:18px 16px 110px;}

/* ---------- bottom nav ---------- */
.bottomnav{
  position:fixed;left:0;right:0;bottom:0;z-index:30;
  display:flex;background:#10151d;border-top:1px solid var(--line);
  padding-bottom:env(safe-area-inset-bottom);
}
.navbtn{
  flex:1;background:none;color:var(--muted);
  display:flex;flex-direction:column;align-items:center;gap:3px;
  padding:10px 4px 12px;font-size:.78rem;font-weight:600;
  border-top:3px solid transparent;
}
.navbtn .nav-ico{font-size:1.1rem;line-height:1;}
.navbtn.active{color:var(--gold);border-top-color:var(--gold);}

/* ===========================================================
 * AUJOURD'HUI
 * =========================================================== */
.today-head h1{font-size:1.7rem;color:var(--txt);}
.today-sub{color:var(--muted);margin:4px 0 14px;}
.challenges{display:flex;flex-direction:column;gap:14px;}

/* objectif du jour */
.goal{background:var(--card);border:1px solid var(--line);border-radius:14px;
  padding:12px 14px;margin-bottom:16px;}
.goal-top{display:flex;justify-content:space-between;align-items:center;
  color:var(--muted);font-size:.85rem;font-weight:600;margin-bottom:7px;}
.goal-n{color:var(--gold-soft);}
.goal-bar{background:var(--bg2);border:1px solid var(--line);border-radius:20px;
  height:12px;overflow:hidden;}
.goal-bar>span{display:block;height:100%;
  background:linear-gradient(90deg,var(--gold-soft),var(--gold));transition:width .5s ease;}

/* astuce "Comment faire ?" */
.ch-tip-btn{display:inline-block;background:transparent;color:var(--gold-soft);
  font-size:.85rem;font-weight:600;padding:2px 0;margin:-6px 0 12px;
  text-decoration:underline;text-underline-offset:3px;}
.ch-tip{background:rgba(212,167,44,.08);border-left:3px solid var(--gold);
  border-radius:8px;padding:10px 12px;margin:0 0 14px;color:var(--txt);
  font-size:.95rem;line-height:1.45;}

.challenge{
  background:linear-gradient(180deg,var(--card2),var(--card));
  border:1px solid var(--line);border-radius:18px;
  padding:18px;box-shadow:var(--shadow);
  position:relative;overflow:hidden;
}
.challenge.done{opacity:.78;border-color:var(--good-dk);}
.challenge.done::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(87,204,153,.06),transparent);
  pointer-events:none;
}
.ch-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}
.ch-fam{font-size:.82rem;font-weight:700;color:var(--gold-soft);text-transform:uppercase;letter-spacing:.04em;}
.ch-stars .star{color:#3a414d;font-size:.85rem;}
.ch-stars .star.on{color:var(--gold);}
.ch-label{font-size:1.22rem;font-weight:600;line-height:1.35;margin-bottom:16px;}
.ch-foot{display:flex;align-items:center;gap:14px;}
.ch-xp{font-weight:700;color:var(--gold);white-space:nowrap;}
.ch-btn{flex:1;}
.ch-checked{flex:1;text-align:center;color:var(--good);font-weight:700;
  border:2px solid var(--good-dk);border-radius:14px;padding:12px;}

/* ---------- barre de répétition 0 -> 20 (engagement) ---------- */
.ch-reps{position:relative;margin:2px 0 16px;}
.ch-reps-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px;
  margin-bottom:6px;}
.ch-reps-cap{font-size:.82rem;font-weight:600;color:var(--gold-soft);line-height:1.3;}
.ch-reps-n{font-size:.9rem;font-weight:800;color:var(--gold);white-space:nowrap;
  font-variant-numeric:tabular-nums;}
.ch-reps-bar{position:relative;background:var(--bg2);border:1px solid var(--line);
  border-radius:20px;height:14px;overflow:hidden;}
.ch-reps-bar>span{display:block;height:100%;border-radius:20px;
  background:linear-gradient(90deg,var(--gold-soft),var(--gold));
  transition:width .5s cubic-bezier(.2,1.2,.4,1);
  background-size:200% 100%;}
/* paliers : la barre chauffe au fil des répétitions (Aujourd'hui ET Missions) */
.challenge[data-tier="2"] .ch-reps-bar>span,.mission[data-tier="2"] .ch-reps-bar>span{background:linear-gradient(90deg,#e9c46a,#f4a259);}
.challenge[data-tier="3"] .ch-reps-bar>span,.mission[data-tier="3"] .ch-reps-bar>span{background:linear-gradient(90deg,#f4a259,#ef7d57);}
.challenge[data-tier="4"] .ch-reps-bar>span,.mission[data-tier="4"] .ch-reps-bar>span{background:linear-gradient(90deg,#ef7d57,#e85d75);}
.challenge[data-tier="5"] .ch-reps-bar>span,.mission[data-tier="5"] .ch-reps-bar>span{
  background:linear-gradient(90deg,#e9c46a,#ef7d57,#e85d75,#e9c46a);
  background-size:300% 100%;animation:repsShine 1.6s linear infinite;}
@keyframes repsShine{0%{background-position:0% 0;}100%{background-position:300% 0;}}
.ch-combo{position:absolute;right:0;top:-26px;
  background:var(--gold);color:#1a1205;font-weight:800;font-size:.8rem;
  padding:2px 9px;border-radius:20px;box-shadow:var(--shadow);
  animation:comboPop .35s cubic-bezier(.2,1.5,.4,1);}
@keyframes comboPop{0%{transform:scale(.4);opacity:0;}100%{transform:scale(1);opacity:1;}}

/* défi « champion » (20/20) */
.challenge.maxed{border-color:var(--gold);
  box-shadow:0 0 0 1px var(--gold), 0 8px 28px rgba(212,167,44,.28);}
.challenge.maxed::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 50% 0%,rgba(212,167,44,.16),transparent 70%);}
.ch-checked.gold{color:var(--gold);border-color:var(--gold);
  background:rgba(212,167,44,.08);}
.challenge.champion-burst{animation:championBurst 1.3s ease-out;}
@keyframes championBurst{
  0%{box-shadow:0 0 0 1px var(--gold),0 0 0 0 rgba(212,167,44,.55);}
  40%{box-shadow:0 0 0 1px var(--gold),0 0 36px 10px rgba(212,167,44,.5);}
  100%{box-shadow:0 0 0 1px var(--gold),0 8px 28px rgba(212,167,44,.28);}
}

/* bouton "J'ai essayé" — doux, jamais aussi fort que la réussite */
.ch-try{
  display:block;width:100%;margin-top:10px;
  background:transparent;color:var(--muted);
  border:1px dashed var(--line);border-radius:12px;
  padding:10px;font-size:.92rem;font-weight:600;
  transition:border-color .12s,color .12s;
}
.ch-try:active{border-color:var(--gold);color:var(--gold-soft);}
.ch-tried{margin-top:8px;text-align:center;color:var(--good);font-size:.82rem;}

.day-done{
  margin-top:20px;text-align:center;
  background:radial-gradient(circle at 50% 0%,rgba(212,167,44,.14),transparent 70%);
  border:1px solid var(--gold);border-radius:18px;padding:22px 18px;
}
.dd-title{color:var(--gold);font-size:1.2rem;margin-bottom:6px;}
.dd-sub{color:var(--muted);margin-bottom:16px;font-size:.95rem;}
.replay-note{margin-top:16px;text-align:center;color:var(--muted);font-size:.9rem;}

/* ===========================================================
 * RÉPARATION — oubli ou erreur : tout se répare, jamais punitif.
 * Discret par défaut, doux à l'ouverture, accent cœur/or.
 * =========================================================== */
.repair{margin-top:18px;}
.repair-toggle{
  display:block;width:100%;
  background:transparent;color:var(--muted);
  border:1px dashed var(--line);border-radius:12px;
  padding:11px;font-size:.92rem;font-weight:600;
  transition:border-color .12s,color .12s;
}
.repair-toggle strong{color:var(--gold-soft);}
.repair-toggle:active{border-color:var(--gold);color:var(--gold-soft);}
.repair-panel{
  margin-top:10px;
  background:rgba(212,167,44,.06);
  border:1px solid var(--line);border-radius:14px;
  padding:14px;
}
.repair-intro{color:var(--muted);font-size:.9rem;line-height:1.45;margin-bottom:12px;}
.repair-intro strong{color:var(--gold-soft);}
.repair-item{margin-bottom:12px;}
.repair-item:last-child{margin-bottom:0;}
.repair-btn{
  display:block;width:100%;text-align:left;
  background:rgba(255,255,255,.03);color:var(--text);
  border:1px solid var(--line);border-radius:12px;
  padding:12px;font-size:.95rem;font-weight:600;line-height:1.35;
  transition:border-color .12s,background .12s;
}
.repair-btn:active{border-color:var(--gold);background:rgba(212,167,44,.1);}
.repair-tip{margin-top:6px;color:var(--muted);font-size:.82rem;line-height:1.4;padding-left:2px;}
.repair-done-note{margin-top:6px;text-align:center;color:var(--good);font-size:.82rem;}

/* ===========================================================
 * TOUTES LES MISSIONS — exploration libre (3e onglet)
 * Familles repliables, niveaux groupés, missions compactes.
 * =========================================================== */
.all-head h1{font-size:1.6rem;color:var(--txt);}
.all-sub{color:var(--muted);margin:4px 0 16px;font-size:.95rem;line-height:1.45;}
.famlist{display:flex;flex-direction:column;gap:12px;}

.famsec{
  background:linear-gradient(180deg,var(--card2),var(--card));
  border:1px solid var(--line);border-radius:16px;overflow:hidden;
}
.famsec.open{border-color:var(--gold-soft);}
.fam-toggle{
  display:flex;align-items:center;gap:12px;width:100%;text-align:left;
  background:transparent;color:var(--txt);padding:14px;
}
.fam-ico{font-size:1.5rem;color:var(--gold-soft);line-height:1;flex:none;width:26px;text-align:center;}
.fam-titles{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0;}
.fam-name{font-size:1.12rem;color:var(--txt);}
.fam-short{font-size:.78rem;color:var(--muted);line-height:1.3;}
.fam-meta{font-size:.78rem;font-weight:700;color:var(--gold);white-space:nowrap;flex:none;}
.fam-chev{color:var(--muted);font-size:.9rem;transition:transform .18s ease;flex:none;}
.famsec.open .fam-chev{transform:rotate(180deg);}
.fam-body{padding:0 14px 14px;display:flex;flex-direction:column;gap:16px;}

.lvlgroup{border-top:1px solid var(--line);padding-top:12px;}
.lvl-head{display:flex;align-items:center;gap:8px;margin-bottom:10px;}
.lvl-stars .star{color:#3a414d;font-size:.8rem;}
.lvl-stars .star.on{color:var(--gold);}
.lvl-name{font-size:.95rem;color:var(--txt);}
.lvl-badge{margin-left:auto;font-size:.68rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.04em;padding:2px 8px;border-radius:20px;
  color:var(--muted);border:1px solid var(--line);}
.lvlgroup.lvl-acquired .lvl-badge{color:var(--good);border-color:var(--good-dk);}
.lvlgroup.lvl-current .lvl-badge{color:var(--gold);border-color:var(--gold);}
.lvl-missions{display:flex;flex-direction:column;gap:10px;}

.mission{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:12px;
  position:relative;overflow:hidden;}
.mission.done{opacity:.82;border-color:var(--good-dk);}
.mission.maxed{opacity:1;border-color:var(--gold);
  box-shadow:0 0 0 1px var(--gold), 0 6px 18px rgba(212,167,44,.22);}
.mission.maxed::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 50% 0%,rgba(212,167,44,.14),transparent 70%);}
.mission.champion-burst{animation:championBurst 1.3s ease-out;}
/* barre de répétition compacte dans l'onglet Missions */
.ch-reps.sm{margin:2px 0 12px;}
.ch-reps.sm .ch-reps-cap{font-size:.74rem;}
.ch-reps.sm .ch-reps-n{font-size:.82rem;}
.ch-reps.sm .ch-reps-bar{height:11px;}
.m-label{font-size:1rem;font-weight:600;line-height:1.35;margin-bottom:10px;}
.m-foot{display:flex;align-items:center;gap:12px;}
.m-foot .ch-xp{font-size:.9rem;}
.m-foot .ch-btn{flex:1;padding:10px;font-size:.95rem;}
.ch-checked.sm{flex:1;text-align:center;padding:9px;font-size:.85rem;}
.m-ever{margin-top:8px;text-align:center;color:var(--good);font-size:.78rem;}

/* ===========================================================
 * MON CHEMIN
 * =========================================================== */
/* compagnon de lumière */
.companion-wrap{text-align:center;margin:4px 0 20px;}
.companion-svg{display:block;margin:0 auto;animation:cmpFloat 4s ease-in-out infinite;}
@keyframes cmpFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-6px);}}
.companion-cap{font-size:1.1rem;color:var(--gold);margin-top:6px;}
.companion-sub{color:var(--muted);font-size:.88rem;margin-top:2px;}

.path-head{text-align:center;margin-bottom:18px;}
.path-head h1{font-size:1.6rem;margin-bottom:10px;}
.rank-big{font-size:1.9rem;color:var(--gold);margin-bottom:10px;}
.rank-bar,.g-bar{
  background:var(--bg2);border:1px solid var(--line);border-radius:20px;
  height:14px;overflow:hidden;
}
.rank-bar>span,.g-bar>span{
  display:block;height:100%;
  background:linear-gradient(90deg,var(--gold-soft),var(--gold));
  transition:width .5s ease;
}
.rank-next{color:var(--muted);font-size:.85rem;margin-top:6px;}

.stat-row{display:flex;gap:10px;margin:18px 0;}
.stat{flex:1;background:var(--card);border:1px solid var(--line);border-radius:14px;
  padding:14px 6px;text-align:center;}
.stat-n{font-size:1.5rem;font-weight:700;color:var(--gold);font-family:'Cinzel',serif;}
.stat-l{font-size:.74rem;color:var(--muted);margin-top:2px;}

.sec{font-size:1.05rem;color:var(--gold-soft);margin:24px 0 12px;
  border-bottom:1px solid var(--line);padding-bottom:6px;}

/* carte d'aventure */
.advmap{display:flex;align-items:center;overflow-x:auto;padding:8px 2px 14px;gap:0;}
.pnode{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:62px;flex:0 0 auto;}
.pdot{width:18px;height:18px;border-radius:50%;background:var(--bg2);border:2px solid var(--line);}
.plabel{font-size:.66rem;color:var(--muted);text-align:center;white-space:nowrap;}
.pline{flex:1;min-width:14px;height:2px;background:var(--line);}
.pnode.past .pdot{background:var(--gold);border-color:var(--gold);}
.pnode.past .plabel{color:var(--gold-soft);}
.pnode.now .pdot{background:var(--gold);border-color:var(--gold-soft);
  box-shadow:0 0 0 5px rgba(212,167,44,.22);}
.pnode.now .plabel{color:var(--gold);font-weight:700;}

/* jauges compétences */
.gauges{display:flex;flex-direction:column;gap:12px;}
.gauge{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;}
.gauge.mastered{border-color:var(--good-dk);}
.g-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;}
.g-name{font-weight:600;}
.g-lvl{font-size:.78rem;color:var(--gold-soft);font-weight:700;}
.gauge.mastered .g-lvl{color:var(--good);}
.g-stars{margin-bottom:8px;}
.g-stars .star{color:#3a414d;}
.g-stars .star.on{color:var(--gold);}
.gauge.mastered .g-bar>span{background:linear-gradient(90deg,var(--good),var(--good-dk));}
.g-sub{font-size:.78rem;color:var(--muted);margin-top:7px;}

/* badges */
.badges{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;}
.badge{display:flex;align-items:center;gap:9px;
  background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:11px 12px;opacity:.5;}
.badge.on{opacity:1;border-color:var(--gold);
  background:linear-gradient(180deg,rgba(212,167,44,.10),var(--card));}
.b-ico{color:#3a414d;font-size:1.2rem;}
.badge.on .b-ico{color:var(--gold);}
.b-lbl{font-size:.82rem;font-weight:600;}

/* réglages */
.settings-row{margin:24px 0 8px;}
.switch{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:.95rem;}
.switch input{width:20px;height:20px;accent-color:var(--gold);}

/* ===========================================================
 * RÉCOMPENSE (overlay)
 * =========================================================== */
.reward-overlay{
  position:fixed;inset:0;z-index:100;
  display:flex;align-items:center;justify-content:center;
  background:rgba(5,8,12,.55);backdrop-filter:blur(2px);
  opacity:0;transition:opacity .25s;
}
.reward-overlay[hidden]{display:none;}
.reward-overlay.show{opacity:1;}
.reward-card{position:relative;text-align:center;
  transform:scale(.6);transition:transform .3s cubic-bezier(.2,1.4,.5,1);}
.reward-overlay.show .reward-card{transform:scale(1);}
.reward-xp{font-size:3rem;color:var(--gold);text-shadow:0 0 18px rgba(212,167,44,.7);}
.reward-combo{display:inline-block;margin-top:8px;
  background:linear-gradient(90deg,var(--gold-soft),var(--gold));color:#1a1205;
  font-weight:800;font-size:1.05rem;padding:4px 16px;border-radius:20px;
  box-shadow:0 0 18px rgba(212,167,44,.5);}
.reward-combo[hidden]{display:none;}
.reward-msg{font-size:1.15rem;color:var(--txt);margin-top:6px;font-weight:600;max-width:280px;}
.reward-spark{position:absolute;left:50%;top:30%;width:0;height:0;}
.spark{position:absolute;width:8px;height:8px;border-radius:50%;
  background:var(--gold-soft);
  transform:rotate(var(--a)) translateY(0);
  animation:spark .9s ease-out forwards;}
@keyframes spark{
  0%{opacity:1;transform:rotate(var(--a)) translateY(0) scale(1);}
  100%{opacity:0;transform:rotate(var(--a)) translateY(calc(var(--d)*-1)) scale(.3);}
}

/* ===========================================================
 * CÉRÉMONIE DE RANG (overlay plein écran)
 * =========================================================== */
.ceremony-overlay{
  position:fixed;inset:0;z-index:105;
  display:flex;align-items:center;justify-content:center;padding:24px;
  background:radial-gradient(circle at 50% 38%,rgba(212,167,44,.22),rgba(5,8,12,.82) 70%);
  backdrop-filter:blur(2px);
  opacity:0;transition:opacity .3s;
}
.ceremony-overlay[hidden]{display:none;}
.ceremony-overlay.show{opacity:1;}
.ceremony-card{text-align:center;transform:scale(.7);
  transition:transform .4s cubic-bezier(.2,1.4,.5,1);}
.ceremony-overlay.show .ceremony-card{transform:scale(1);}
.ceremony-cmp{margin-bottom:12px;}
.ceremony-cmp svg{display:block;margin:0 auto;}
.ceremony-title{color:var(--gold-soft);font-size:1rem;letter-spacing:.12em;text-transform:uppercase;}
.ceremony-name{color:var(--gold);font-size:2.4rem;text-shadow:0 0 18px rgba(212,167,44,.7);margin-top:2px;}
.ceremony-sub{color:var(--txt);font-size:1rem;margin-top:8px;max-width:280px;}

/* ---------- toast ---------- */
.toast{
  position:fixed;left:50%;bottom:84px;transform:translateX(-50%) translateY(20px);
  background:var(--card2);color:var(--txt);border:1px solid var(--line);
  padding:12px 18px;border-radius:12px;box-shadow:var(--shadow);
  z-index:120;max-width:90vw;text-align:center;font-size:.92rem;
  opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* ===========================================================
 * COIN CALME (respiration guidée)
 * =========================================================== */
.calm-fab{
  position:fixed;right:16px;bottom:84px;z-index:40;
  width:54px;height:54px;border-radius:50%;
  background:linear-gradient(180deg,var(--calme),var(--good-dk));
  color:#08130d;font-size:1.5rem;line-height:1;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 14px rgba(0,0,0,.45);
  margin-bottom:env(safe-area-inset-bottom);
}
.calm-fab:active{transform:scale(.94);}

.calm-overlay{
  position:fixed;inset:0;z-index:110;
  display:flex;align-items:center;justify-content:center;padding:24px;
  background:rgba(5,10,8,.78);backdrop-filter:blur(3px);
  opacity:0;transition:opacity .25s;
}
.calm-overlay[hidden]{display:none;}
.calm-overlay.show{opacity:1;}
.calm-card{
  width:100%;max-width:340px;text-align:center;
  display:flex;flex-direction:column;align-items:center;gap:14px;
}
.calm-title{color:var(--calme);font-size:1.3rem;}
.calm-stage{height:220px;display:flex;align-items:center;justify-content:center;}
.calm-bubble{
  width:120px;height:120px;border-radius:50%;
  background:radial-gradient(circle at 50% 40%,var(--good),var(--good-dk));
  box-shadow:0 0 40px rgba(87,204,153,.45);
  transform:scale(1);
}
.calm-bubble.in{transform:scale(1.7);transition:transform 4s ease-in-out;}
.calm-bubble.hold{transform:scale(1.7);transition:transform 2s linear;}
.calm-bubble.out{transform:scale(1);transition:transform 6s ease-in-out;}
.calm-phase{font-size:1.5rem;color:var(--txt);min-height:1.6em;}
.calm-sub{color:var(--muted);font-size:.92rem;min-height:2.4em;max-width:300px;}
.calm-card .big-btn{max-width:200px;}

@media(min-width:600px){
  .badges{grid-template-columns:repeat(3,1fr);}
}

/* ===========================================================
 * ESPACE PARENTS — code privé, compte rendu, boîte à idées
 * =========================================================== */
.parent-gate{display:flex;justify-content:center;padding:18px 0;}
.pg-card{width:100%;max-width:360px;text-align:center;
  background:linear-gradient(180deg,var(--card2),var(--card));
  border:1px solid var(--line);border-radius:18px;padding:26px 20px;box-shadow:var(--shadow);
  display:flex;flex-direction:column;gap:12px;align-items:center;}
.pg-ico{font-size:2.2rem;color:var(--gold-soft);line-height:1;}
.pg-title{font-size:1.5rem;color:var(--gold);}
.pg-sub{color:var(--muted);font-size:.92rem;line-height:1.5;margin:0;}
.pg-sub strong{color:var(--gold-soft);}
.pg-input{width:100%;text-align:center;background:var(--bg2);color:var(--txt);
  border:1px solid var(--line);border-radius:12px;padding:13px;font-size:1.15rem;letter-spacing:.3em;}
.pg-input:focus{outline:none;border-color:var(--gold);}
.pg-err{color:#e76f8a;font-size:.88rem;min-height:1.1em;}
.pg-card .big-btn{margin-top:4px;}

.parent-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin-bottom:16px;flex-wrap:wrap;}
.pb-title{font-size:1.3rem;color:var(--gold);}
.pb-acts{display:flex;gap:8px;flex-wrap:wrap;}
.pb-btn{background:linear-gradient(180deg,var(--gold-soft),var(--gold));color:#1a1205;
  font-weight:700;font-size:.85rem;padding:9px 13px;border-radius:11px;box-shadow:0 3px 0 #9c7715;}
.pb-btn:active{transform:translateY(2px);box-shadow:0 1px 0 #9c7715;}
.pb-btn.ghost{background:transparent;color:var(--gold-soft);border:1.5px solid var(--gold);box-shadow:none;}
.pb-btn.ghost:active{transform:translateY(1px);box-shadow:none;}

.report{background:var(--card);border:1px solid var(--line);border-radius:18px;
  padding:18px 16px;box-shadow:var(--shadow);}
.rep-head{text-align:center;border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:14px;}
.rep-title{font-size:1.3rem;color:var(--txt);}
.rep-meta{color:var(--muted);font-size:.82rem;margin-top:3px;}
.rep-rank{text-align:center;margin-bottom:14px;}
.rr-name{font-size:1.6rem;color:var(--gold);margin-bottom:8px;}
.rr-bar{background:var(--bg2);border:1px solid var(--line);border-radius:20px;height:13px;overflow:hidden;}
.rr-bar>span{display:block;height:100%;background:linear-gradient(90deg,var(--gold-soft),var(--gold));}
.rr-next{color:var(--muted);font-size:.82rem;margin-top:6px;}
.rep-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px;}
.rs{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:11px 4px;text-align:center;}
.rs-n{font-size:1.4rem;font-weight:700;color:var(--gold);font-family:'Cinzel',serif;}
.rs-l{font-size:.7rem;color:var(--muted);margin-top:2px;}
.rep-period{text-align:center;color:var(--muted);font-size:.82rem;margin-bottom:6px;}
.rep-period strong{color:var(--txt);}
.rep-sec{font-size:1rem;color:var(--gold-soft);margin:20px 0 10px;
  border-bottom:1px solid var(--line);padding-bottom:6px;}

.rfams{display:flex;flex-direction:column;gap:10px;}
.rfam{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:11px 12px;}
.rfam.mastered{border-color:var(--good-dk);}
.rfam-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;gap:8px;}
.rfam-name{font-weight:600;font-size:.95rem;}
.rfam-lvl{font-size:.76rem;font-weight:700;color:var(--gold-soft);white-space:nowrap;}
.rfam.mastered .rfam-lvl{color:var(--good);}
.rfam-bar{background:var(--card);border:1px solid var(--line);border-radius:20px;height:10px;overflow:hidden;}
.rfam-bar>span{display:block;height:100%;background:linear-gradient(90deg,var(--gold-soft),var(--gold));}
.rfam.mastered .rfam-bar>span{background:linear-gradient(90deg,var(--good),var(--good-dk));}
.rfam-sub{font-size:.76rem;color:var(--muted);margin-top:6px;}
.rfam-method{font-size:.72rem;color:var(--muted);margin-top:7px;padding-top:7px;border-top:1px dashed var(--line);line-height:1.35;}
.rfam-method-tag{display:inline-block;font-weight:700;font-size:.64rem;letter-spacing:.04em;text-transform:uppercase;color:var(--gold-soft);background:var(--card);border:1px solid var(--line);border-radius:6px;padding:1px 6px;margin-right:5px;}

.rchart{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:12px 10px 8px;}
.rbars{display:flex;align-items:flex-end;gap:3px;height:96px;}
.rbars.lbl{height:112px;}
.rbar{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;}
.rbar-fill{width:72%;max-width:18px;border-radius:5px 5px 2px 2px;
  background:linear-gradient(180deg,var(--gold-soft),var(--gold));}
.rbar-fill.empty{background:var(--line);}
.rbar-v{font-size:.62rem;color:var(--gold-soft);margin-bottom:2px;order:-1;}
.rbar-lbl{font-size:.58rem;color:var(--muted);margin-top:3px;white-space:nowrap;}
.rchart-cap{color:var(--muted);font-size:.76rem;margin-top:6px;line-height:1.4;}

.rbadges{display:flex;flex-wrap:wrap;gap:8px;}
.rbadge{background:linear-gradient(180deg,rgba(212,167,44,.12),var(--card));
  border:1px solid var(--gold);border-radius:20px;padding:6px 12px;font-size:.82rem;
  font-weight:600;color:var(--gold-soft);}
.rmuted{color:var(--muted);font-size:.85rem;}
.rep-note{margin-top:18px;background:rgba(212,167,44,.06);border-left:3px solid var(--gold);
  border-radius:8px;padding:10px 12px;color:var(--muted);font-size:.82rem;line-height:1.5;}

.pideas{margin-top:24px;}
.pideas-intro{color:var(--muted);font-size:.9rem;line-height:1.5;margin:0 0 12px;}
.pideas-intro strong{color:var(--gold-soft);}
.pideas-ta{width:100%;background:var(--bg2);color:var(--txt);border:1px solid var(--line);
  border-radius:12px;padding:12px;font-size:1rem;line-height:1.45;resize:vertical;margin-bottom:10px;}
.pideas-ta:focus{outline:none;border-color:var(--gold);}
.pideas-list{display:flex;flex-direction:column;gap:10px;margin-top:16px;}
.pidea{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px;}
.pidea.done{opacity:.7;border-color:var(--good-dk);}
.pidea-txt{font-size:.95rem;line-height:1.4;margin-bottom:10px;white-space:pre-wrap;word-break:break-word;}
.pidea.done .pidea-txt{text-decoration:line-through;color:var(--muted);}
.pidea-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;}
.pidea-meta{font-size:.74rem;color:var(--muted);}
.pidea-acts{display:flex;gap:6px;}
.pidea-btn{background:transparent;color:var(--gold-soft);border:1px solid var(--line);
  border-radius:9px;padding:6px 10px;font-size:.78rem;font-weight:600;}
.pidea-btn:active{border-color:var(--gold);}
.pidea-btn.del{color:#e76f8a;}

/* ===========================================================
 * REFONTE VISUELLE — lisibilité et confort pour un enfant de 9 ans
 * (ajouts non destructifs : cibles tactiles plus grandes, coins plus
 *  doux, barres plus vivantes. La charte sombre/or est conservée.)
 * =========================================================== */
.big-btn{min-height:54px;font-size:1.1rem;border-radius:16px;}
.navbtn .nav-ico{font-size:1.32rem;}
.navbtn{font-size:.82rem;}
.ch-label{font-size:1.28rem;}
.goal-bar,.rank-bar,.g-bar{height:16px;}
.goal-bar>span,.rank-bar>span,.g-bar>span{
  background:linear-gradient(90deg,var(--gold-soft),var(--gold));
  box-shadow:0 0 10px rgba(212,167,44,.4) inset;}
.ch-tip-btn{font-size:.92rem;}

/* ===========================================================
 * IMPRESSION / EXPORT PDF — on isole le compte rendu et on le passe
 * en thème clair pour un document propre et lisible.
 * =========================================================== */
@media print{
  .topbar,.bottomnav,.calm-fab,.no-print,.parent-bar,.pideas{display:none !important;}
  body{background:#fff !important;color:#111 !important;}
  #view{padding:0 !important;max-width:100% !important;}
  #report{box-shadow:none !important;border:none !important;border-radius:0 !important;
    background:#fff !important;color:#111 !important;padding:0 !important;}
  .report *{color:#111 !important;}
  .rep-title,.rr-name,.rs-n{color:#8a6d12 !important;}
  .rep-meta,.rep-sec,.rfam-lvl,.rr-next,.rs-l,.rfam-sub,.rfam-method,.rchart-cap,.rep-period,.rbar-lbl{color:#555 !important;}
  .rfam-method-tag{color:#8a6d1f !important;background:#faf7ef !important;border:1px solid #ddd !important;}
  .rep-sec{color:#8a6d12 !important;border-bottom:1px solid #ccc !important;}
  .rs,.rfam,.rchart,.rr-bar,.rfam-bar{background:#faf7ef !important;border:1px solid #ddd !important;}
  .rr-bar>span,.rfam-bar>span,.rbar-fill{background:#d4a72c !important;-webkit-print-color-adjust:exact;print-color-adjust:exact;}
  .rbar-fill.empty{background:#ddd !important;}
  .rbadge{background:#faf7ef !important;border:1px solid #d4a72c !important;color:#8a6d12 !important;}
  .rep-note{background:#faf7ef !important;border-left:3px solid #d4a72c !important;color:#555 !important;}
  .rep-head{border-bottom:1px solid #ccc !important;}
  @page{margin:14mm;}
}