:root{
  --foret:#2E4739; --foret-2:#3B5A47;
  --sauge:#8FAE8B; --sauge-clair:#C7DAC0; --sauge-pale:#E6EFE2;
  --creme:#FBF6E9; --creme-2:#F4EDD9;
  --brun:#6B4E3D; --brun-clair:#9C7B63;
  --dore:#C99A3F; --dore-clair:#E4C787;
  --texte:#2A2A24; --texte-doux:#5C5C50;
  --blanc:#FFFFFF;
  --ok:#4C8C5A; --alerte:#B4552F;
  --rayon:22px; --rayon-s:14px;
  --ombre:0 6px 22px rgba(46,71,57,.14);
  --focus:0 0 0 4px rgba(201,154,63,.55);
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:"Segoe UI",system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;
  background:var(--creme); color:var(--texte);
  min-height:100vh; line-height:1.5; -webkit-font-smoothing:antialiased;
}
body.contraste{ --creme:#FFFFFF; --creme-2:#F2F2F2; --texte:#000; --texte-doux:#222; --foret:#123322; }
h1,h2,h3{font-family:Georgia,"Times New Roman",serif;color:var(--foret);margin:0 0 .4em;}
button{font-family:inherit;cursor:pointer;border:none;background:none;}
button:focus-visible, a:focus-visible, [tabindex]:focus-visible{outline:none;box-shadow:var(--focus);border-radius:12px;}
.app-shell{max-width:1120px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column;}
.topbar{background:var(--foret);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:14px 22px;position:sticky;top:0;z-index:20;}
.brand{display:flex;align-items:center;gap:10px;font-family:Georgia,serif;font-weight:700;letter-spacing:.5px;font-size:20px;}
.brand .leaf{width:26px;height:26px;display:inline-block;}
.badge-role{background:var(--dore);color:#3a2c12;font-weight:700;font-size:12px;letter-spacing:1px;padding:5px 12px;border-radius:999px;text-transform:uppercase;}
.topbar-actions{display:flex;gap:8px;align-items:center;}
.icon-btn{background:rgba(255,255,255,.12);color:#fff;border-radius:10px;padding:8px 12px;font-size:13px;font-weight:600;display:flex;gap:6px;align-items:center;}
.icon-btn:hover{background:rgba(255,255,255,.22);}
main{flex:1;padding:26px 22px 60px;}
.center-narrow{max-width:760px;margin:0 auto;}
.btn{display:inline-flex;align-items:center;gap:8px;justify-content:center;background:var(--dore);color:#3a2c12;font-weight:700;font-size:16px;padding:14px 26px;border-radius:999px;box-shadow:0 3px 0 #a97e2c;transition:transform .08s;}
.btn:active{transform:translateY(2px);box-shadow:0 1px 0 #a97e2c;}
.btn.ghost{background:transparent;color:var(--foret);box-shadow:none;border:2px solid var(--sauge);}
.btn.soft{background:var(--sauge-clair);color:var(--foret);box-shadow:0 3px 0 #9ab894;}
.btn.lg{font-size:19px;padding:16px 34px;}
.btn:disabled{opacity:.5;cursor:not-allowed;}
.card{background:var(--blanc);border-radius:var(--rayon);box-shadow:var(--ombre);padding:22px;}
.grid{display:grid;gap:18px;}
@media(min-width:720px){ .g2{grid-template-columns:1fr 1fr;} .g3{grid-template-columns:1fr 1fr 1fr;} }
.hero{background:linear-gradient(160deg,var(--sauge-pale),var(--creme-2));border-radius:var(--rayon);padding:34px;text-align:center;margin-bottom:26px;position:relative;overflow:hidden;}
.hero h1{font-size:34px;}
.hero p{color:var(--texte-doux);max-width:560px;margin:8px auto 0;}
.role-card{text-align:left;border:2px solid transparent;transition:border-color .15s,transform .12s;display:flex;flex-direction:column;gap:6px;}
.role-card:hover{border-color:var(--dore);transform:translateY(-3px);}
.role-emoji{font-size:34px;}
.role-card h3{margin:.2em 0 .1em;}
.role-card small{color:var(--texte-doux);}
.pill{display:inline-block;background:var(--sauge-pale);color:var(--foret);border-radius:999px;padding:4px 12px;font-size:12px;font-weight:600;margin:3px 3px 0 0;}
.enfant-wrap{display:grid;gap:20px;grid-template-columns:1fr;}
@media(min-width:860px){ .enfant-wrap{grid-template-columns:1.6fr 1fr;} }
.map{background:linear-gradient(165deg,#dfeed6,#c3ddb6);border-radius:var(--rayon);padding:20px;position:relative;min-height:340px;}
.map h2{font-size:22px;}
.map-path{position:relative;height:260px;margin-top:6px;}
.dest{position:absolute;display:flex;flex-direction:column;align-items:center;gap:6px;width:120px;text-align:center;}
.dest button{width:64px;height:64px;border-radius:50%;background:#fff;border:3px solid var(--dore);font-size:28px;display:flex;align-items:center;justify-content:center;box-shadow:var(--ombre);transition:transform .12s;}
.dest button:hover{transform:scale(1.08);}
.dest .lieu{font-weight:700;color:var(--foret);font-size:14px;}
.dest .dom{font-size:12px;color:var(--brun);}
.map svg.link{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;}
.side-panel{display:flex;flex-direction:column;gap:16px;}
.mission-propo{background:var(--creme-2);border:2px solid var(--dore-clair);border-radius:var(--rayon);padding:20px;text-align:center;}
.mission-propo .titre{font-family:Georgia,serif;font-size:22px;color:var(--foret);margin:6px 0;}
.mission-meta{color:var(--texte-doux);font-size:14px;margin-bottom:12px;}
.today{background:#fff;border-radius:var(--rayon-s);padding:14px 18px;box-shadow:var(--ombre);}
.today li{list-style:none;margin:4px 0;}
.stage{max-width:720px;margin:0 auto;}
.progress-row{display:flex;align-items:center;gap:12px;margin-bottom:18px;}
.progress-track{flex:1;height:14px;background:var(--sauge-pale);border-radius:999px;overflow:hidden;}
.progress-fill{height:100%;background:var(--dore);width:0;transition:width .4s;}
.step-label{font-size:13px;color:var(--texte-doux);font-weight:600;white-space:nowrap;}
.consigne{background:#fff;border-radius:var(--rayon);box-shadow:var(--ombre);padding:26px;text-align:center;}
.consigne .txt{font-size:22px;font-weight:600;color:var(--foret);margin-bottom:6px;}
.play-audio{width:84px;height:84px;border-radius:50%;background:var(--foret);color:#fff;border:4px solid var(--dore);font-size:34px;display:flex;align-items:center;justify-content:center;margin:14px auto;transition:transform .1s;}
.play-audio:active{transform:scale(.94);}
.stim{font-size:64px;margin:8px 0;}
.choices{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:16px;}
.choice{min-width:96px;min-height:64px;padding:14px 22px;border-radius:var(--rayon-s);border:3px solid var(--sauge);background:#fff;font-size:24px;font-weight:700;color:var(--foret);transition:transform .1s,border-color .15s,background .15s;}
.choice:hover{transform:translateY(-2px);}
.choice.good{background:#dff2e2;border-color:var(--ok);}
.choice.bad{background:#f7e2da;border-color:var(--alerte);}
.choice.dim{opacity:.35;pointer-events:none;}
.feedback{margin-top:16px;min-height:28px;font-weight:600;font-size:16px;}
.feedback.pos{color:var(--ok);}
.feedback.neutre{color:var(--brun);}
.helpbar{display:flex;gap:10px;justify-content:center;margin-top:14px;flex-wrap:wrap;}
.toolrow{display:flex;justify-content:space-between;align-items:center;margin-top:20px;}
.quit{color:var(--texte-doux);font-size:14px;font-weight:600;padding:8px 14px;border-radius:10px;}
.quit:hover{background:var(--sauge-pale);}
.hint-note{color:var(--texte-doux);font-size:13px;}
.items-tray{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin:10px 0 18px;min-height:60px;}
.token{padding:12px 16px;border-radius:14px;background:var(--creme-2);border:2px solid var(--dore-clair);font-size:18px;font-weight:600;display:flex;gap:8px;align-items:center;}
.token.selected{outline:3px solid var(--dore);transform:translateY(-2px);}
.token.placed{opacity:.25;pointer-events:none;}
.baskets{display:grid;gap:14px;grid-template-columns:1fr 1fr;}
.basket{background:var(--sauge-pale);border:3px dashed var(--sauge);border-radius:var(--rayon-s);padding:14px;min-height:120px;text-align:center;}
.basket h4{margin:0 0 8px;color:var(--foret);}
.basket .drop{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;}
.basket.hi{border-color:var(--dore);background:#fff;}
.seq-source{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-bottom:16px;}
.seq-card{background:#fff;border:3px solid var(--sauge);border-radius:var(--rayon-s);padding:14px;min-width:130px;max-width:170px;text-align:center;font-weight:600;transition:transform .1s;}
.seq-card .big{font-size:40px;display:block;}
.seq-card:hover{transform:translateY(-2px);}
.seq-card.used{opacity:.3;pointer-events:none;}
.seq-slots{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;}
.slot{width:60px;height:76px;border-radius:14px;border:3px dashed var(--dore-clair);background:var(--creme-2);display:flex;align-items:center;justify-content:center;font-size:30px;position:relative;}
.slot .num{position:absolute;top:-10px;left:-10px;width:26px;height:26px;border-radius:50%;background:var(--foret);color:#fff;font-size:13px;display:flex;align-items:center;justify-content:center;}
.slot.filled{border-style:solid;background:#fff;}
.result{text-align:center;max-width:560px;margin:0 auto;}
.badge-big{font-size:70px;margin:6px 0;}
.reward-row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin:18px 0;}
.reward{background:var(--creme-2);border-radius:var(--rayon-s);padding:14px 18px;min-width:120px;}
.reward .r-emoji{font-size:30px;}
.carnet-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));}
.badge-tile{background:#fff;border-radius:var(--rayon-s);box-shadow:var(--ombre);padding:16px;text-align:center;}
.badge-tile.lock{opacity:.45;}
.badge-tile .em{font-size:34px;}
.pro-layout{display:grid;gap:20px;grid-template-columns:1fr;}
@media(min-width:820px){ .pro-layout{grid-template-columns:210px 1fr;} }
.pro-nav{background:var(--foret);border-radius:var(--rayon);padding:14px;display:flex;flex-direction:column;gap:4px;height:fit-content;}
.pro-nav button{color:#dfe8df;text-align:left;padding:11px 14px;border-radius:10px;font-weight:600;font-size:15px;}
.pro-nav button.active{background:var(--dore);color:#3a2c12;}
.pro-nav button:hover:not(.active){background:rgba(255,255,255,.1);}
.kpi-row{display:grid;gap:14px;grid-template-columns:repeat(3,1fr);}
.kpi{background:#fff;border-radius:var(--rayon-s);box-shadow:var(--ombre);padding:16px;}
.kpi .num{font-size:30px;font-family:Georgia,serif;color:var(--foret);font-weight:700;}
.kpi .lab{color:var(--texte-doux);font-size:13px;}
.bar-line{display:flex;align-items:center;gap:10px;margin:9px 0;}
.bar-line .name{width:130px;font-size:14px;}
.bar-track{flex:1;height:14px;background:var(--sauge-pale);border-radius:999px;overflow:hidden;}
.bar-fill{height:100%;background:var(--sauge);}
.watch{background:var(--creme-2);border-radius:var(--rayon-s);padding:10px 14px;margin:8px 0;border-left:4px solid var(--dore);}
.lib-item{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border-radius:var(--rayon-s);box-shadow:var(--ombre);padding:14px 16px;margin-bottom:10px;}
.lib-item .meta{color:var(--texte-doux);font-size:13px;}
.add-mini{width:40px;height:40px;border-radius:50%;background:var(--sauge-clair);color:var(--foret);font-size:22px;font-weight:700;display:flex;align-items:center;justify-content:center;}
.add-mini.on{background:var(--ok);color:#fff;}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;}
.chip{padding:8px 14px;border-radius:999px;background:#fff;border:2px solid var(--sauge);font-size:13px;font-weight:600;color:var(--foret);}
.chip.active{background:var(--foret);color:#fff;border-color:var(--foret);}
.basket-side{background:var(--foret);color:#fff;border-radius:var(--rayon);padding:18px;height:fit-content;}
.basket-side h3{color:#fff;}
.basket-side .li{background:rgba(255,255,255,.1);border-radius:10px;padding:8px 12px;margin:6px 0;display:flex;justify-content:space-between;font-size:14px;}
.res-table{width:100%;border-collapse:collapse;font-size:14px;}
.res-table th,.res-table td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--sauge-pale);}
.res-table th{color:var(--foret);}
.interdit{color:var(--alerte);font-size:12px;font-style:italic;}
.note-box{width:100%;min-height:80px;border:2px solid var(--sauge);border-radius:12px;padding:12px;font-family:inherit;font-size:15px;resize:vertical;}
.flash{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);background:var(--foret);color:#fff;padding:12px 22px;border-radius:999px;box-shadow:var(--ombre);font-weight:600;opacity:0;transition:opacity .3s;z-index:50;}
.flash.show{opacity:1;}
.a11y-panel{position:fixed;right:16px;bottom:16px;z-index:40;}
.disclaimer{background:#fff5e6;border:1px solid var(--dore-clair);border-radius:12px;padding:10px 14px;font-size:12.5px;color:var(--brun);margin-top:18px;}
.breadcrumb{color:var(--texte-doux);font-size:13px;margin-bottom:10px;}
.breadcrumb button{color:var(--foret);font-weight:600;text-decoration:underline;}
body.reduce-anim *{animation:none !important;transition:none !important;}
.aventure-banner{grid-column:1/-1;background:linear-gradient(120deg,var(--foret),var(--foret-2));color:#fff;border-radius:var(--rayon);padding:18px 22px;display:flex;align-items:center;gap:16px;box-shadow:var(--ombre);flex-wrap:wrap;}
.aventure-banner .av-em{font-size:40px;}
.aventure-banner .av-txt{flex:1;min-width:180px;}
.aventure-banner h3{color:#fff;margin:0 0 2px;}
.aventure-banner small{color:var(--dore-clair);}
.story-scene{background:linear-gradient(165deg,var(--foret),var(--foret-2));color:#fff;border-radius:var(--rayon);padding:34px;text-align:center;box-shadow:var(--ombre);max-width:640px;margin:0 auto;}
.story-scene h2{color:#fff;}
.story-emoji{font-size:64px;margin:6px 0;}
.story-perso{color:var(--dore-clair);font-weight:700;letter-spacing:.4px;}
.story-text{max-width:520px;margin:10px auto 18px;font-size:17px;line-height:1.6;}
.chapter-dots{display:flex;gap:8px;justify-content:center;margin:14px 0;}
.chapter-dots span{width:12px;height:12px;border-radius:50%;background:rgba(255,255,255,.3);}
.chapter-dots span.on{background:var(--dore);}
.chapter-dots span.done{background:var(--sauge);}
.form input[type=text],.form input[type=email],.form input[type=password],.form select{width:100%;padding:11px 12px;border:2px solid var(--sauge);border-radius:12px;font-size:15px;font-family:inherit;margin:4px 0 2px;background:#fff;}
.form .lbl{font-weight:600;color:var(--foret);font-size:14px;display:block;margin-top:12px;}
.form .row2{display:grid;gap:12px;grid-template-columns:1fr 1fr;}
.avatar-pick{display:flex;gap:10px;flex-wrap:wrap;margin:6px 0;}
.avatar-pick button{font-size:30px;width:56px;height:56px;border-radius:50%;border:3px solid transparent;background:var(--sauge-pale);}
.avatar-pick button.sel{border-color:var(--dore);background:#fff;}
.seg{display:inline-flex;background:var(--sauge-pale);border-radius:999px;padding:4px;gap:4px;}
.seg button{padding:8px 16px;border-radius:999px;font-weight:600;color:var(--foret);font-size:14px;}
.seg button.active{background:var(--foret);color:#fff;}
.form-note{color:var(--texte-doux);font-size:13px;margin-top:6px;}
.overlay{position:fixed;inset:0;background:rgba(20,30,24,.55);display:flex;align-items:center;justify-content:center;z-index:60;padding:16px;}
.ms-card{background:#fff;border-radius:10px;box-shadow:0 12px 40px rgba(0,0,0,.3);width:min(420px,96vw);padding:28px 30px;font-family:'Segoe UI',system-ui,sans-serif;color:#1b1b1b;}
.ms-logo{display:flex;align-items:center;gap:8px;font-weight:600;color:#5e5e5e;margin-bottom:18px;font-size:15px;}
.ms-tiles{display:grid;grid-template-columns:9px 9px;grid-gap:2px;}
.ms-tiles i{display:block;width:9px;height:9px;}
.ms-h{font-size:22px;font-weight:600;color:#1b1b1b;margin:0 0 6px;}
.ms-sub{color:#333;font-size:14px;margin-bottom:14px;}
.ms-input{width:100%;border:none;border-bottom:1px solid #666;padding:8px 2px;font-size:15px;outline:none;margin-bottom:16px;}
.ms-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:10px;}
.ms-btn{background:#0067b8;color:#fff;border:none;padding:8px 22px;font-size:15px;cursor:pointer;min-width:108px;}
.ms-btn.sec{background:#ebebeb;color:#1b1b1b;}
.ms-link{color:#0067b8;font-size:13px;cursor:pointer;}
.ms-note{background:#fff4ce;border:1px solid #e6d8a8;padding:8px 10px;font-size:12.5px;color:#6b5a17;margin:12px 0;border-radius:4px;}
.ms-consent-perms{font-size:13px;color:#333;margin:10px 0;padding-left:18px;}
.ms-consent-perms li{margin:4px 0;}
.sso-row{display:flex;gap:10px;flex-wrap:wrap;}
.sso-row .btn{flex:1;min-width:150px;}
body.big-text .consigne .txt{font-size:26px;} body.big-text .choice{font-size:28px;} body.big-text .story-text{font-size:20px;} body.big-text .seq-card{font-size:17px;}
body.big-text2 .consigne .txt{font-size:31px;} body.big-text2 .choice{font-size:33px;} body.big-text2 .story-text{font-size:23px;} body.big-text2 .seq-card{font-size:19px;}
body.dys{font-family:"Trebuchet MS",Verdana,sans-serif;}
body.dys .consigne .txt, body.dys .story-text, body.dys .choice, body.dys .seq-card, body.dys p, body.dys .token{letter-spacing:.045em;word-spacing:.16em;line-height:1.8;}
.stat{display:inline-block;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap;}
.stat.ok{background:#dff2e2;color:#256b38;} .stat.warn{background:#fff1cf;color:#8a6414;} .stat.exp{background:#f7ddd4;color:#9a3417;} .stat.off{background:#e6e6e6;color:#666;}
.adm-actions{display:flex;gap:6px;flex-wrap:wrap;}
.mini-btn{padding:6px 10px;border-radius:8px;font-size:12px;font-weight:600;background:var(--sauge-pale);color:var(--foret);border:1px solid var(--sauge);}
.mini-btn:hover{background:var(--sauge-clair);}
.mini-btn.danger{background:#f7e2da;border-color:#e0b3a3;color:#9a3417;}
.adm-form{display:grid;gap:10px;grid-template-columns:2fr 1.4fr 1.2fr auto;align-items:end;}
@media(max-width:680px){ .adm-form{grid-template-columns:1fr;} }
.env-ribbon{position:fixed;top:0;left:0;right:0;height:28px;line-height:28px;text-align:center;font-size:12.5px;font-weight:800;letter-spacing:1.5px;color:#fff;z-index:100;text-transform:uppercase;box-shadow:0 2px 6px rgba(0,0,0,.25);}
.env-ribbon.dev{background:repeating-linear-gradient(45deg,#B4552F,#B4552F 14px,#9a3417 14px,#9a3417 28px);}
.env-ribbon.preprod{background:repeating-linear-gradient(45deg,#3949ab,#3949ab 14px,#303f9f 14px,#303f9f 28px);}
body.has-env{padding-top:28px;}
body.has-env .topbar{top:28px;}
body.has-env .env-ribbon{display:block;}