
:root{
  --bg:#f7f7ff;
  --ink:#1f2340;
  --muted:#747a98;
  --card:#ffffff;
  --purple:#6d5dfc;
  --purple2:#8c7cff;
  --green:#28b463;
  --green-soft:#e6f8ee;
  --yellow:#ffbf3f;
  --red:#e45858;
  --blue:#41a5f5;
  --shadow:0 14px 36px rgba(54,56,110,.14);
  --radius:24px;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,ui-rounded,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:
radial-gradient(circle at 10% 10%, #ece9ff 0, transparent 26%),
radial-gradient(circle at 90% 5%, #e4f7ff 0, transparent 24%),
linear-gradient(180deg,#fafaff,#f5f6ff)}
button,input,select{font:inherit}
button{cursor:pointer}
.shell{max-width:1100px;margin:0 auto;padding:22px 18px 48px}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px}
.brand{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:-.02em}
.brand-mark{width:42px;height:42px;border-radius:16px;background:linear-gradient(135deg,var(--purple),#43c6ff);display:grid;place-items:center;color:#fff;box-shadow:var(--shadow);font-size:22px}
.kicker{font-size:.82rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);font-weight:800}
h1,h2,h3,p{margin-top:0}
.hero{background:linear-gradient(135deg,#6d5dfc,#8e7eff 55%,#52b9ff);color:#fff;border-radius:32px;padding:28px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;width:210px;height:210px;border-radius:50%;background:rgba(255,255,255,.12);right:-70px;top:-70px}
.hero h1{font-size:clamp(2rem,6vw,4rem);line-height:.95;margin-bottom:14px;letter-spacing:-.05em}
.hero p{max-width:680px;font-size:1.05rem;opacity:.95}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
.btn{border:0;border-radius:16px;padding:13px 18px;font-weight:900;box-shadow:0 8px 18px rgba(42,44,90,.12);transition:.18s transform,.18s box-shadow;background:#fff;color:var(--ink)}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn.primary{background:var(--purple);color:#fff}
.btn.secondary{background:#eef0ff;color:var(--purple)}
.btn.success{background:var(--green);color:#fff}
.btn.ghost{background:rgba(255,255,255,.16);color:#fff;border:1px solid rgba(255,255,255,.26);box-shadow:none}
.btn.danger{background:#fff0f0;color:#b83838}
.btn.small{padding:9px 12px;border-radius:13px;font-size:.9rem}
.btn.icon{width:44px;height:44px;padding:0;display:grid;place-items:center}
.section{margin-top:28px}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:14px}
.section-head h2{margin:0;font-size:1.35rem}
.section-head p{margin:0;color:var(--muted);font-size:.95rem}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px}
.profile{background:var(--card);border:2px solid transparent;border-radius:26px;padding:18px;text-align:center;box-shadow:var(--shadow);transition:.2s transform,.2s border-color}
.profile:hover{transform:translateY(-4px) rotate(-.5deg);border-color:#d9d4ff}
.avatar{width:92px;height:92px;border-radius:30px;margin:0 auto 12px;display:grid;place-items:center;font-size:54px;background:linear-gradient(145deg,#fff,#eeeaff);box-shadow:inset 0 0 0 3px rgba(109,93,252,.08),0 12px 24px rgba(74,68,140,.16)}
.profile strong{font-size:1.08rem;display:block}
.profile span{color:var(--muted);font-size:.9rem}
.add-card{min-height:172px;border:2px dashed #c9c5f8;background:rgba(255,255,255,.55);box-shadow:none;display:grid;place-items:center}
.plus{font-size:42px;color:var(--purple);line-height:1}
.card{background:var(--card);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow)}
.form-card{max-width:680px;margin:24px auto}
label{font-weight:800;display:block;margin:14px 0 7px}
input,select{width:100%;padding:13px 14px;border:2px solid #e5e6f2;background:#fbfbff;border-radius:15px;outline:0;color:var(--ink)}
input:focus,select:focus{border-color:#aaa2ff;box-shadow:0 0 0 4px rgba(109,93,252,.09)}
.species-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}
.species-choice{border:2px solid transparent;border-radius:18px;background:#f5f4ff;padding:11px;display:flex;align-items:center;gap:10px;text-align:left;color:var(--ink)}
.species-choice:hover{transform:translateY(-2px)}
.species-choice.selected{border-color:var(--purple);background:#e8e4ff;box-shadow:0 8px 20px rgba(109,93,252,.12)}
.species-glyph{font-size:36px;line-height:1}
.species-choice strong{display:block}
.species-choice small{display:block;color:var(--muted);margin-top:2px}
.evolution-preview{margin-top:14px;padding:14px;border-radius:20px;background:#faf9ff;border:1px solid #ebe9ff}
.stage-line{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;margin-top:10px}
.stage-mark{min-width:0;text-align:center;position:relative}
.stage-mark b{width:30px;height:30px;border-radius:10px;background:#e9e6ff;color:var(--purple);display:grid;place-items:center;margin:0 auto 6px}
.stage-mark small{display:block;font-size:.68rem;line-height:1.1;color:var(--muted)}
.stage-mark:not(:last-child):after{content:"";height:2px;background:#ddd9ff;position:absolute;top:14px;left:calc(50% + 18px);width:calc(100% - 36px)}
.hero-card{display:grid;grid-template-columns:minmax(240px,340px) 1fr;gap:20px;align-items:stretch}
.player-card{position:relative;overflow:hidden;min-height:430px;background:
radial-gradient(circle at 50% 24%,rgba(255,255,255,.9),rgba(255,255,255,.15) 42%,transparent 43%),
linear-gradient(145deg,#fff7d8,#f4e8ff 45%,#dff6ff);border:4px solid #fff;border-radius:32px;box-shadow:0 18px 50px rgba(55,59,120,.18)}
.player-card:before{content:"";position:absolute;inset:0;border-radius:28px;box-shadow:inset 0 0 0 2px rgba(109,93,252,.16);pointer-events:none}
.pc-top{padding:18px 20px;display:flex;align-items:center;justify-content:space-between;font-weight:950}
.pc-name{font-size:1.4rem;letter-spacing:.02em}
.pc-pv{background:#fff9;border:1px solid #fff;border-radius:999px;padding:7px 10px}
.pc-avatar{font-size:108px;text-align:center;padding:18px 0 8px;filter:drop-shadow(0 14px 12px rgba(57,49,110,.16))}
.pc-bottom{margin:0 14px 14px;background:rgba(255,255,255,.88);backdrop-filter:blur(9px);border-radius:22px;padding:16px}
.badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.badge{background:#fff;border-radius:999px;padding:8px 10px;font-size:.83rem;font-weight:900;border:1px solid #e9e8f8}
.progress{height:11px;background:#ececf5;border-radius:99px;overflow:hidden}
.progress i{display:block;height:100%;background:linear-gradient(90deg,var(--green),#61d889);border-radius:inherit}
.dashboard{display:flex;flex-direction:column;gap:15px}
.welcome{background:linear-gradient(135deg,#292d53,#4d438d);color:#fff}
.welcome p{color:#e9e9ff;margin-bottom:0}
.challenge-list{display:flex;flex-direction:column;gap:12px}
.challenge{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:stretch;background:#fff;border-radius:22px;box-shadow:var(--shadow);overflow:hidden;border:2px solid transparent;position:relative}
.challenge.ready{border-color:#ded9ff;box-shadow:0 0 0 5px rgba(109,93,252,.06),var(--shadow)}
.challenge.glow{animation:halo 2s infinite}
@keyframes halo{0%,100%{box-shadow:0 0 0 0 rgba(109,93,252,.08),var(--shadow)}50%{box-shadow:0 0 0 10px rgba(109,93,252,.10),var(--shadow)}}
.challenge.mastered{background:var(--green-soft);border-color:#bde9cf}
.challenge-main{padding:16px 18px}
.challenge-title{font-weight:950;margin-bottom:5px}
.challenge-meta{color:var(--muted);font-size:.92rem}
.challenge-actions{display:flex}
.challenge-actions button{border:0;border-left:1px solid #ececf5;background:rgba(255,255,255,.55);padding:0 16px;font-weight:900;color:var(--purple)}
.challenge-actions button:hover{background:#f1efff}
.pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:6px 9px;font-size:.77rem;font-weight:900;margin-top:8px;background:#f0effb;color:#625c8e}
.pill.good{background:#dff6e8;color:#287d4a}
.pill.lock{background:#fff2d8;color:#8a651b}
.modal-backdrop{position:fixed;inset:0;background:rgba(24,26,52,.48);display:grid;place-items:center;padding:18px;z-index:10}
.modal{background:#fff;border-radius:26px;padding:22px;width:min(560px,100%);box-shadow:0 25px 90px rgba(20,23,54,.30);max-height:90vh;overflow:auto}
.modal h3{font-size:1.5rem}
.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px;flex-wrap:wrap}
.question-box{text-align:center;padding:24px 8px}
.big-question{font-size:clamp(2.6rem,12vw,5rem);font-weight:950;letter-spacing:-.05em;margin:18px 0}
.answer-input{max-width:230px;margin:0 auto;text-align:center;font-size:2rem;font-weight:950}
.feedback{min-height:32px;font-weight:900;margin-top:14px}
.feedback.good{color:var(--green)}
.feedback.bad{color:#a15b22}
.exercise-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.stars{letter-spacing:4px}
.teacher-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:18px}
.student-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #ececf4}
.student-row:last-child{border-bottom:0}
.student-row .mini{font-size:32px;width:48px;height:48px;display:grid;place-items:center;background:#f3f1ff;border-radius:16px}
.student-row .grow{flex:1}
.stat{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.stat > div{background:#f7f7ff;border-radius:18px;padding:14px;text-align:center}
.stat strong{display:block;font-size:1.6rem}
.stat.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.stat.four strong{font-size:clamp(1.15rem,2.5vw,1.55rem)}
.muted{color:var(--muted)}
.empty{text-align:center;padding:24px;color:var(--muted)}
.footer-note{text-align:center;color:var(--muted);font-size:.85rem;margin-top:30px}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(80px);background:#25284c;color:#fff;padding:12px 16px;border-radius:14px;font-weight:800;opacity:0;transition:.25s;z-index:30;box-shadow:var(--shadow)}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media(max-width:760px){
  .shell{padding:16px 13px 36px}
  .hero{padding:22px}
  .hero-card,.teacher-grid{grid-template-columns:1fr}
  .player-card{min-height:400px}
  .species-picker{grid-template-columns:repeat(2,1fr)}
  .stage-line{grid-template-columns:repeat(5,1fr);gap:3px}
  .stage-mark small{font-size:.58rem}
  .section-head{align-items:flex-start;flex-direction:column}
  .challenge{grid-template-columns:1fr}
  .challenge-actions{border-top:1px solid #ececf5}
  .challenge-actions button{border-left:0;flex:1;padding:12px}
}

.creature-avatar{position:relative;image-rendering:pixelated}
.profile .creature-avatar{transition:.2s transform}
.profile:hover .creature-avatar{transform:scale(1.06)}
.stage-1{filter:saturate(.88) drop-shadow(0 10px 10px rgba(57,49,110,.12))}
.stage-2{filter:saturate(1) drop-shadow(0 12px 12px rgba(57,49,110,.15))}
.stage-3{filter:saturate(1.08) drop-shadow(0 14px 13px rgba(57,49,110,.17))}
.stage-4{filter:saturate(1.14) drop-shadow(0 16px 15px rgba(57,49,110,.19))}
.stage-5{filter:saturate(1.2) drop-shadow(0 0 18px rgba(109,93,252,.32))}
.pc-avatar.stage-1{font-size:92px}
.pc-avatar.stage-2{font-size:102px}
.pc-avatar.stage-3{font-size:112px}
.pc-avatar.stage-4{font-size:124px}
.pc-avatar.stage-5{font-size:138px}
.creature-stage-label{font-size:.72rem;color:#686b86;font-weight:850;margin-top:2px}
.evo-head,.mastery-head{display:flex;justify-content:space-between;gap:8px;font-weight:900;font-size:.8rem;margin-bottom:7px}
.mastery-head{margin-top:12px}
.evolution-progress i{background:linear-gradient(90deg,#8a6cff,#55b8ff)}

.module-progress{display:flex;align-items:center;gap:10px;margin-top:11px}
.module-progress .progress{flex:1;height:8px}
.module-progress span{font-size:.78rem;font-weight:900;color:var(--muted)}
.micro-label{font-size:.82rem;color:var(--muted);font-weight:850;margin-top:10px}
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em}

.teacher-layout{display:grid;grid-template-columns:minmax(430px,1.15fr) minmax(340px,.85fr);gap:18px;align-items:start}
.modal.wide{width:min(900px,100%)}
.row-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.radar-card{text-align:center}
.radar-card .section-head{text-align:left}
.radar-svg{max-width:100%;height:auto;display:block;margin:0 auto}
.axis-legend{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;text-align:left;margin-top:8px}
.axis-legend span{padding:8px 10px;border-radius:12px;background:#f6f5ff;color:var(--muted);font-size:.78rem}
.axis-legend b{color:var(--purple);font-size:.92rem}
.axis-legend small{display:block;margin-top:4px;color:var(--muted);font-size:.72rem;font-weight:800}
.axis-legend.compact{grid-template-columns:repeat(2,minmax(0,1fr))}
.student-radar-wrap{margin:16px 0;padding:12px;border-radius:20px;background:#fbfbff}
.radar-state-legend{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin:4px 0 10px;font-size:.76rem;font-weight:900;color:#666b82}
.radar-state-legend span{display:inline-flex;align-items:center;gap:6px}
.radar-state-legend span::before{content:"";width:10px;height:10px;border-radius:50%}
.radar-state-legend .waiting::before{background:#d6a400}
.radar-state-legend .validated::before{background:#239b56}
.validated-value{color:#18844c!important}
.waiting-value{color:#a97900!important}
.teacher-student-head{display:flex;align-items:center;gap:12px}
.module-tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:8px}
.module-tags span{font-size:.72rem;font-weight:850;color:#6c7090;background:#f5f5fb;border-radius:999px;padding:5px 8px}
@media(max-width:900px){
  .teacher-layout{grid-template-columns:1fr}
}
@media(max-width:720px){
  .stat.four{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){
  .axis-legend,.axis-legend.compact{grid-template-columns:1fr}
  .row-actions{flex-direction:column}
}

.track-title{display:flex;justify-content:space-between;align-items:center;margin:8px 2px 2px;color:var(--ink)}
.track-title span,.foundation-details summary span{color:var(--muted);font-size:.84rem;font-weight:800}
.foundation-details{margin-top:18px;background:rgba(255,255,255,.60);border:1px solid #e8e6f6;border-radius:22px;padding:4px}
.foundation-details summary{cursor:pointer;list-style:none;padding:15px 16px;font-weight:950;display:flex;justify-content:space-between;gap:10px}
.foundation-details summary::-webkit-details-marker{display:none}
.foundation-details[open] summary{border-bottom:1px solid #eceaf6}
.challenge-list.inner{padding:12px}
.teacher-layout .radar-card{overflow:hidden}

.foundation-details .inner{max-height:900px;overflow:auto}.track-title{position:sticky;top:0;z-index:2;background:rgba(247,247,253,.94);backdrop-filter:blur(8px);padding:9px 8px;border-radius:12px}.answer-input{font-variant-numeric:tabular-nums}

.player-card{display:flex;flex-direction:column}
.pc-avatar{margin-bottom:8px}
.mastery-badges{margin-top:12px;gap:10px}
.mastery-chip{
  display:inline-flex;align-items:center;gap:8px;
  border:1px solid #ddd9ff;background:#fff;color:var(--ink);
  border-radius:999px;padding:8px 12px;font-weight:900;font-size:.82rem;
  box-shadow:0 5px 14px rgba(86,72,190,.08)
}
.mastery-chip:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(86,72,190,.12)}
.mastery-chip-icon{font-size:1rem;line-height:1}
.mastery-chip-label{max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mastery-chip-check{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:999px;background:#eaf8ef;color:#23924d;font-size:.78rem;font-weight:1000}
.badge-empty{background:#fffdfd}
.compact-empty{padding:18px 16px}
@media (max-width: 980px){
  .mastery-chip-label{max-width:130px}
}

.pill.clock{background:#f5f0ff;color:#6551cc;border:1px solid #ddd0ff}
.challenge.waiting{border-color:#ddd0ff;box-shadow:0 8px 20px rgba(103,84,206,.07)}
.foundation-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:14px;
  padding:16px;
}
.foundation-tile{
  min-height:168px;
  border:1px solid #e2def8;
  border-radius:26px;
  background:#fff;
  padding:16px 14px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
  text-align:left;
  box-shadow:0 8px 18px rgba(86,72,190,.06)
}
.foundation-tile:hover{transform:translateY(-1px);box-shadow:0 10px 22px rgba(86,72,190,.1)}
.foundation-tile.ready{box-shadow:0 0 0 3px rgba(133,112,255,.12),0 10px 22px rgba(86,72,190,.08)}
.foundation-tile.waiting{background:#faf8ff;border-color:#ddd0ff}
.foundation-tile-icon{font-size:1.45rem;line-height:1;margin-bottom:12px}
.foundation-tile-title{
  font-weight:950;color:var(--ink);font-size:1rem;line-height:1.18;
  min-height:58px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden
}
.foundation-tile-meta{margin-top:auto;font-size:.82rem;color:var(--muted);font-weight:850}
.foundation-tile-state{margin-top:8px;font-size:.82rem;font-weight:900;color:#5a4ee3}
.foundation-empty{grid-column:1/-1}
.foundation-details{overflow:visible}
.foundation-details .challenge-list.inner{display:none}
@media (max-width:700px){
  .foundation-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:12px}
  .foundation-tile{min-height:156px;border-radius:22px;padding:14px 12px}
  .foundation-tile-title{font-size:.93rem;min-height:52px}
}

/* ===== V6 UX — dashboard élève Maths / Français ===== */
.shell{max-width:1280px}

.student-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 370px;
  gap:22px;
  align-items:start;
}
.student-work{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:16px;
}
.hero-side{
  position:relative;
  top:auto;
  min-height:0;
  align-self:start;
}
.hero-side .pc-bottom{
  margin-top:0;
}

.subject-switch{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.subject-tab{
  min-height:96px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:12px;
  align-items:center;
  text-align:left;
  border:2px solid transparent;
  border-radius:24px;
  padding:16px;
  background:#fff;
  color:var(--ink);
  box-shadow:0 10px 26px rgba(54,56,110,.09);
  transition:.18s transform,.18s border-color,.18s box-shadow;
}
.subject-tab:hover{transform:translateY(-2px)}
.subject-tab .subject-icon{font-size:1.75rem}
.subject-tab strong{display:block;font-size:1rem}
.subject-tab small{display:block;color:var(--muted);font-size:.76rem;font-weight:750;margin-top:3px}
.subject-percent{font-size:1.05rem;font-weight:1000}
.subject-tab.maths.active{
  border-color:#8c7cff;
  box-shadow:0 0 0 5px rgba(109,93,252,.07),0 12px 28px rgba(70,61,160,.13);
  background:linear-gradient(180deg,#fff,#f8f6ff);
}
.subject-tab.francais.active{
  border-color:#ff9a7a;
  box-shadow:0 0 0 5px rgba(255,138,100,.07),0 12px 28px rgba(170,88,62,.10);
  background:linear-gradient(180deg,#fff,#fff8f5);
}

.active-subject-head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:12px;
  padding:4px 4px 0;
}
.active-subject-head h2{margin:2px 0 0}
.active-subject-summary{
  border-radius:999px;
  padding:7px 11px;
  font-size:.8rem;
  font-weight:900;
  background:#f0effb;
  color:#625c8e;
}
.active-subject-head.francais .active-subject-summary{background:#fff0ea;color:#a95539}

.subject-empty{
  min-height:260px;
  border:2px dashed #e1dfef;
  border-radius:28px;
  background:rgba(255,255,255,.68);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:30px;
}
.subject-empty-icon{font-size:3rem;margin-bottom:12px}
.subject-empty h3{margin-bottom:8px}
.subject-empty p{max-width:520px;color:var(--muted);margin-bottom:0}

/* Carte : progression séparée par matière */
.domain-progress{margin-top:14px}
.domain-progress .mastery-head{margin-top:0}
.domain-progress.maths .progress i{background:linear-gradient(90deg,#6d5dfc,#56b7ff)}
.domain-progress.francais .progress i{background:linear-gradient(90deg,#ff8a66,#ffbd6d)}

.collection-section{margin-top:18px}
.collection-title{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  margin-bottom:10px;
  font-size:.8rem;
  font-weight:950;
}
.collection-title span:last-child{
  min-width:24px;height:24px;border-radius:999px;
  display:grid;place-items:center;
  background:#f0effb;color:#625c8e;
  font-size:.72rem;
}
.badge-collection{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  max-height:245px;
  overflow:auto;
  padding:2px 3px 7px 2px;
}
.collection-empty{
  grid-column:1/-1;
  color:var(--muted);
  background:rgba(255,255,255,.72);
  border:1px dashed #deddeb;
  border-radius:16px;
  padding:12px;
  font-size:.76rem;
  font-weight:750;
  line-height:1.25;
}

.mastery-token-wrap{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:5px;
}
.mastery-token{
  width:66px;
  height:66px;
  position:relative;
  display:grid;
  place-items:center;
  border:2px solid;
  background:#fff;
  box-shadow:0 7px 16px rgba(54,56,110,.09);
}
.mastery-token.square{
  border-radius:16px;
  border-color:#cbc5ff;
  background:linear-gradient(145deg,#fff,#f2efff);
}
.mastery-token.round{
  border-radius:50%;
  border-color:#ffc0ab;
  background:linear-gradient(145deg,#fff,#fff0ea);
}
.mastery-token:hover{transform:translateY(-2px)}
.mastery-token-icon{font-size:1.45rem}
.mastery-token-check{
  position:absolute;
  right:-4px;
  bottom:-4px;
  width:22px;height:22px;
  display:grid;place-items:center;
  border-radius:999px;
  background:#e2f7ea;
  border:2px solid #fff;
  color:#27834d;
  font-size:.7rem;
  font-weight:1000;
}
.mastery-token-label{
  max-width:88px;
  min-height:2.2em;
  font-size:.64rem;
  line-height:1.08;
  font-weight:850;
  color:#5f6480;
  text-align:center;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* Les anciens chips V5.1 ne sont plus utilisés dans la nouvelle carte */
.mastery-chip{display:none}

@media(max-width:900px){
  .student-layout{grid-template-columns:1fr}
  .hero-side{
    position:relative;
    top:auto;
    order:-1;
  }
  .badge-collection{
    grid-template-columns:repeat(5,minmax(0,1fr));
    max-height:220px;
  }
}
@media(max-width:620px){
  .subject-switch{grid-template-columns:1fr}
  .subject-tab{min-height:82px}
  .badge-collection{grid-template-columns:repeat(4,minmax(0,1fr))}
  .active-subject-head{align-items:flex-start;flex-direction:column}
}
@media(max-width:430px){
  .badge-collection{grid-template-columns:repeat(3,minmax(0,1fr))}
  .mastery-token{width:62px;height:62px}
}

/* ===== V7 — moteur Français : réponses textuelles, choix et performances ===== */
.answer-input.textual{
  font-family:inherit;
  letter-spacing:0;
  text-align:left;
  padding-left:18px;
}
.choice-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-top:18px;
}
.choice-answer{
  min-height:62px;
  border:2px solid #e3e0f5;
  background:#fff;
  border-radius:18px;
  padding:12px 14px;
  font:inherit;
  font-weight:900;
  color:var(--ink);
  box-shadow:0 7px 16px rgba(54,56,110,.06);
}
.choice-answer:hover{border-color:#a99cff;transform:translateY(-1px)}
.choice-answer:disabled{opacity:.62;transform:none}

.pill.performance{background:#eef8ff;color:#34749a;border:1px solid #cfe7f5}
.challenge.performance-module{border-color:#cfe7f5;background:linear-gradient(180deg,#fff,#f7fcff)}
.performance-card{max-width:720px;margin-inline:auto}
.performance-intro-icon,.performance-running-icon{font-size:64px;text-align:center;margin:8px 0 12px}
.performance-note,.hidden-timer-message{
  margin:18px 0;
  border-radius:18px;
  padding:14px 16px;
  background:#f5f7fb;
  color:#66708a;
  font-size:.88rem;
  font-weight:800;
  text-align:center;
}
.performance-running{text-align:center}
.performance-running h2{margin-top:8px}
.performance-running p{font-size:1.08rem;line-height:1.55}
.performance-progress{height:12px;margin:18px 0}
.performance-progress i{background:linear-gradient(90deg,#55b7ff,#6d5dfc)}

@media(max-width:620px){
 .choice-grid{grid-template-columns:1fr}
}

/* ===== V8 — Français CP + validation adulte ===== */
.listen-btn{
  margin:10px auto 18px;
  border:0;
  border-radius:18px;
  padding:13px 20px;
  display:inline-flex;
  align-items:center;
  gap:9px;
  background:linear-gradient(135deg,#ff8a66,#ffb65e);
  color:#fff;
  font-weight:950;
  box-shadow:0 10px 24px rgba(205,105,65,.18);
}
.listen-btn span{font-size:1.35rem}
.dictation-prompt{font-size:clamp(1.4rem,5vw,2.2rem);letter-spacing:-.02em}
.adult-mini{font-size:.8em;margin-left:5px}
.adult-pill{white-space:nowrap}
.adult-gate{text-align:center}
.adult-gate-icon{
  width:74px;height:74px;
  margin:0 auto 14px;
  border-radius:24px;
  display:grid;place-items:center;
  background:linear-gradient(145deg,#fff5df,#ffe3a7);
  font-size:40px;
  box-shadow:0 10px 24px rgba(140,106,35,.12)
}
.performance-running .performance-running-icon{font-size:58px}
.performance-running p{white-space:pre-line}

/* ===== V8.2 — banque CP enregistrée : phonèmes / mots / images ===== */
.recorded-target{text-align:center;margin:10px 0 16px}
.phoneme-listen strong{font-size:1.15em;margin-left:3px}
.word-image-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  margin:18px auto;
  max-width:620px;
}
.word-image-wrap{position:relative;min-width:0}
.word-image-card{
  width:100%;
  aspect-ratio:1.15/1;
  border:2px solid #e2def7;
  border-radius:24px;
  background:#fff;
  overflow:hidden;
  display:grid;
  place-items:center;
  padding:0;
  box-shadow:0 8px 18px rgba(60,54,115,.07)
}
.word-image-card:hover{transform:translateY(-2px);border-color:#a99cff}
.word-image-card img{width:100%;height:100%;object-fit:contain;background:#fff}
.image-fallback{
  width:100%;height:100%;
  place-items:center;
  padding:15px;
  font-size:1.05rem;
  font-weight:950;
  color:#61657c;
  background:#faf9ff;
}
.mini-listen{
  position:absolute;
  right:8px;bottom:8px;
  width:38px;height:38px;
  border-radius:50%;
  border:2px solid #fff;
  background:#5f55d9;color:#fff;
  box-shadow:0 5px 12px rgba(55,48,120,.22);
  font-size:.9rem;
}
@media(max-width:560px){
  .word-image-grid{gap:9px}
  .word-image-card{border-radius:18px}
}

/* ===== V8.4 — activités CP sans défilement de page ===== */
body.activity-mode{overflow:hidden}
body.activity-mode .shell{height:100dvh;min-height:0;padding:10px 18px;display:flex;flex-direction:column;overflow:hidden}
body.activity-mode .topbar{flex:0 0 auto;margin-bottom:6px;min-height:54px}
body.activity-mode .brand-mark{width:44px;height:44px;border-radius:15px}
body.activity-mode .brand{font-size:.96rem}
body.activity-mode .brand .kicker{font-size:.62rem}
body.activity-mode .footer-note{display:none}
.activity-card{width:min(820px,100%);max-width:820px;flex:1 1 auto;min-height:0;max-height:calc(100dvh - 82px);margin:4px auto 0;padding:15px 20px;overflow:hidden;display:flex;flex-direction:column}
.activity-card .exercise-top{flex:0 0 auto}
.activity-card .exercise-top h2{font-size:clamp(1.15rem,2.6vw,1.7rem);margin:2px 0}
.activity-card .question-box{flex:1 1 auto;min-height:0;padding:7px 8px 3px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.activity-card .question-counter{font-size:.8rem;color:var(--muted);font-weight:850}
.activity-card .micro-label{margin-top:4px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.76rem}
.activity-card .big-question{font-size:clamp(1.65rem,5.5vh,3.8rem);line-height:1.06;letter-spacing:-.035em;margin:8px 0 12px;text-wrap:balance;max-width:760px}
.activity-card .answer-input{font-size:clamp(1.5rem,4vh,2rem);padding:9px 12px}
.activity-card .feedback{min-height:25px;margin-top:7px}
.activity-card .activity-actions{margin-top:5px}
.activity-card .choice-grid{margin-top:9px;gap:9px}
.activity-card .choice-answer{min-height:52px;padding:9px 12px;font-size:1.05rem}
.morph-flashcard{position:relative;width:min(520px,92%);min-height:170px;border-radius:28px;background:linear-gradient(150deg,#fff,#f5f3ff);border:2px solid #ded9ff;display:grid;place-items:center;margin:4px auto 12px;box-shadow:0 12px 28px rgba(70,62,140,.10)}
.morph-missing{font-size:clamp(3rem,9vh,6rem);font-weight:1000;letter-spacing:.08em;color:#22264b}
.morph-help{position:absolute;right:13px;top:13px;width:40px;height:40px;border-radius:50%;border:0;background:#6d5dfc;color:#fff;font-size:1.25rem;font-weight:1000;box-shadow:0 7px 15px rgba(78,67,180,.22)}
.morph-hint-popup{position:absolute;right:12px;top:60px;background:#fff;border:1px solid #ddd8ff;border-radius:15px;padding:9px 13px;box-shadow:0 10px 25px rgba(45,42,92,.15);font-size:1.05rem;font-weight:900}
.hint-root{color:#5547db}.hint-suffix{color:#e46b42;text-transform:lowercase}.morph-answer{max-width:130px!important;text-transform:uppercase}
.performance-minihead{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:.85rem;font-weight:950;color:#5f6480;flex:0 0 auto}
.space-hint{text-align:center;color:var(--muted);font-weight:800;font-size:.82rem;margin:8px 0 7px}
kbd{display:inline-block;padding:3px 8px;border-radius:7px;border:1px solid #cfd1dd;background:#fff;box-shadow:0 2px 0 #c4c5d1;font:inherit;font-size:.78rem;color:#40445c}
.next-performance{align-self:center;flex:0 0 auto}
.flashcard-performance{justify-content:space-between}
.reading-flashcard{flex:1 1 auto;min-height:0;width:min(650px,94%);margin:10px auto;border:0;border-radius:34px;background:linear-gradient(145deg,#fff,#f0edff);box-shadow:0 18px 40px rgba(69,60,145,.14),inset 0 0 0 2px #ded9ff;color:#171b3d;font-size:clamp(3.6rem,15vh,9rem);font-weight:1000;letter-spacing:.02em;display:grid;place-items:center;cursor:pointer}
.reading-flashcard:active{transform:scale(.985)}
.fluency-performance{gap:8px}
.fluence-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;scroll-behavior:smooth;border-radius:22px;border:1px solid #e2e1ef;background:#fff;padding:24vh 28px;font-size:clamp(1.5rem,3.2vh,2.25rem);line-height:1.72;text-align:left}
.sense-group{display:inline;padding:4px 5px;border-radius:8px;color:#85889b;transition:.18s background,.18s color,.18s box-shadow}
.sense-group.done{color:#b0b2bd}
.sense-group.active{color:#171b3d;background:#fff0a9;box-shadow:0 0 0 5px rgba(255,222,81,.16);font-weight:950}
.copy-performance{gap:8px}
.seyes-sheet{position:relative;flex:1 1 auto;min-height:0;width:min(720px,96%);margin:8px auto;border:1px solid #d9ddeb;border-radius:18px;overflow:hidden;padding:18px 24px 18px 66px;background-color:#fff;background-image:linear-gradient(to right,transparent 0,transparent 47px,rgba(221,82,82,.55) 48px,rgba(221,82,82,.55) 49px,transparent 50px),repeating-linear-gradient(to bottom,rgba(70,126,206,.20) 0,rgba(70,126,206,.20) 1px,transparent 1px,transparent 8px),repeating-linear-gradient(to bottom,rgba(54,105,188,.46) 0,rgba(54,105,188,.46) 1.5px,transparent 1.5px,transparent 32px);box-shadow:0 10px 25px rgba(55,68,115,.08)}
.seyes-model{font-family:"Segoe Print","Comic Sans MS",cursive;font-size:clamp(1.3rem,3vh,2rem);line-height:32px;color:#1d2f65;white-space:normal}
.seyes-model.word-list{word-spacing:1.1rem}
.known-total{margin:8px auto 12px;padding:8px 12px;border-radius:999px;background:#f2f1fb;color:#66618c;font-weight:900;text-align:center;width:max-content}
@media(max-width:620px){
 body.activity-mode .shell{padding:7px 8px}
 body.activity-mode .topbar{min-height:46px}
 body.activity-mode .brand .kicker{display:none}
 .activity-card{max-height:calc(100dvh - 60px);padding:11px 12px;border-radius:22px}
 .activity-card .big-question{font-size:clamp(1.45rem,4.8vh,2.8rem)}
 .morph-flashcard{min-height:135px}
 .morph-missing{font-size:clamp(2.6rem,8vh,4.8rem)}
 .fluence-scroll{padding:20vh 16px;font-size:clamp(1.25rem,3vh,1.8rem)}
 .seyes-sheet{padding-left:54px}
}

/* V8.4.1 — lettres muettes : aucune révélation avant l'aide */
.morph-flashcard{isolation:isolate}
.morph-hint-popup[hidden]{display:none!important}
.morph-hint-popup{font-size:1.22rem}
.morph-missing{user-select:none}

/* ===== V8.4.2 — fluence fixe + Seyès réaligné ===== */
.fluence-scroll{display:none!important}
.fluence-fixed{
  flex:1 1 auto;
  min-height:0;
  width:min(760px,100%);
  margin:7px auto;
  overflow:hidden;
  border-radius:22px;
  border:1px solid #e2e1ef;
  background:#fff;
  padding:20px 24px;
  font-size:clamp(1.12rem,2.45vh,1.65rem);
  line-height:1.7;
  text-align:left;
  align-content:center
}
.fluence-fixed .sense-group{
  display:inline;
  padding:3px 4px;
  border-radius:7px;
  color:#7d8091;
  font-weight:750;
  box-decoration-break:clone;
  -webkit-box-decoration-break:clone
}
.fluence-fixed .sense-group.done{color:#9ea1ad;font-weight:750}
.fluence-fixed .sense-group.active{
  color:#171b3d;
  background:#fff0a9;
  box-shadow:0 0 0 3px rgba(255,222,81,.16);
  font-weight:750
}

/* Seyès : ligne principale calée sur la ligne de base du texte */
.seyes-sheet{
  padding:0 22px 0 66px!important;
  background-color:#fff!important;
  background-image:
    linear-gradient(to right,transparent 0,transparent 47px,rgba(219,68,68,.58) 48px,rgba(219,68,68,.58) 49px,transparent 50px),
    repeating-linear-gradient(to bottom,rgba(74,127,202,.22) 0,rgba(74,127,202,.22) 1px,transparent 1px,transparent 8px),
    repeating-linear-gradient(to bottom,rgba(46,98,178,.56) 0,rgba(46,98,178,.56) 1.5px,transparent 1.5px,transparent 32px)!important;
  background-position:0 0,0 25px,0 25px!important
}
.seyes-model{
  padding-top:0;
  font-family:"Belle Allure","Cursive Standard","Écriture A","Segoe Script","Lucida Handwriting",cursive!important;
  font-size:26px!important;
  line-height:32px!important;
  font-weight:400!important;
  font-variant-ligatures:common-ligatures contextual;
  font-feature-settings:"liga" 1,"calt" 1;
  color:#183b78!important
}
.seyes-copy-line{
  height:32px;
  line-height:32px;
  white-space:pre-wrap;
  overflow:hidden;
  transform:translateY(1px)
}
@media(max-width:620px){
 .fluence-fixed{font-size:clamp(1rem,2.2vh,1.35rem);line-height:1.62;padding:15px}
 .seyes-model{font-size:23px!important}
 .seyes-sheet{padding-left:56px!important}
}

/* ===== V9 — Français CP→CM2 2026-2027 ===== */
.home-program-note{
  position:absolute;
  top:18px;
  right:24px;
  z-index:5;
  max-width:330px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(109,93,252,.16);
  box-shadow:0 6px 18px rgba(50,49,100,.06);
  color:#66618c;
  font-size:.72rem;
  font-weight:850;
  text-align:center;
}
.footer-note{
  text-align:center;
  font-size:.68rem;
  font-weight:800;
  color:#8a8da0;
  letter-spacing:.02em;
}
body.activity-mode .footer-note{
  display:block!important;
  position:fixed;
  left:50%;
  bottom:2px;
  transform:translateX(-50%);
  z-index:20;
  background:rgba(250,250,255,.82);
  padding:2px 8px;
  border-radius:999px;
  pointer-events:none;
}
.teacher-subject-switch{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  max-width:620px;
  margin:0 auto 16px;
}
.teacher-subject-switch .subject-tab{min-height:58px;display:block;text-align:center}
.teacher-mini-switch{display:flex;gap:8px;margin:10px 0 14px}
@media(max-width:700px){
 .home-program-note{position:static;margin:0 0 10px auto;max-width:100%;border-radius:14px}
 .teacher-subject-switch{grid-template-columns:1fr 1fr}
}

/* ===== V9.2 — audit CM1 ===== */

/* Phrase à analyser : la cible domine, la consigne reste courte */
.analysis-instruction{
  margin:8px 0 10px;
  font-size:clamp(1rem,2.2vh,1.28rem);
  font-weight:900;
  color:#5e6481;
  text-align:center;
}
.analysis-sentence{
  width:min(760px,96%);
  margin:0 auto 16px;
  padding:12px 18px;
  border-radius:18px;
  background:
    linear-gradient(180deg,transparent 20%,rgba(255,235,85,.58) 20%,rgba(255,235,85,.58) 88%,transparent 88%);
  color:#1b2043;
  font-size:clamp(1.65rem,4.5vh,3.05rem);
  font-weight:950;
  line-height:1.15;
  text-align:center;
  text-wrap:balance;
}
.analysis-target{
  background:#ffd74c;
  color:#151a3c;
  border-radius:8px;
  padding:0 .12em;
  box-shadow:0 0 0 3px rgba(255,215,76,.25);
}

/* Conjugaison : le pronom est bien devant la zone de réponse */
.answer-prefix-row{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  width:min(570px,95%);
  margin:0 auto;
}
.answer-prefix{
  flex:0 0 auto;
  font-size:clamp(1.45rem,3.8vh,2.2rem);
  font-weight:1000;
  color:#22264b;
}
.answer-prefix-row .answer-input{
  flex:1 1 auto;
  min-width:0;
  margin:0;
}

/* Mode professeur : ne plus couper les noms et ne plus rogner le radar */
.teacher-layout .student-row .grow,
.modal .student-row .grow{
  min-width:0;
}
.teacher-layout .student-row strong,
.modal .student-row strong{
  display:block;
  white-space:normal;
  overflow-wrap:anywhere;
  line-height:1.18;
}
.radar-card{
  overflow:visible!important;
}
.radar-svg{
  display:block;
  width:min(100%,390px)!important;
  height:auto!important;
  margin:0 auto;
  overflow:visible;
}
.axis-legend{
  grid-template-columns:repeat(auto-fit,minmax(125px,1fr));
}
.axis-legend span{
  min-width:0;
  overflow-wrap:anywhere;
}

/* Dictée audio : priorité à l'écoute et à la saisie */
.activity-card .listen-btn{
  flex:0 0 auto;
}
@media(max-width:620px){
 .analysis-sentence{
   font-size:clamp(1.35rem,4vh,2.15rem);
   padding:10px 12px;
   margin-bottom:12px;
 }
 .answer-prefix-row{gap:8px;width:98%}
 .answer-prefix{font-size:1.45rem}
}

/* ===== V9.3 — QCM mélangés + synthèse vocale ===== */
.secondary-listen{
  margin:6px auto 10px!important;
  padding:10px 16px!important;
  background:#f3f1ff!important;
  color:#5147b8!important;
  border:1px solid #ddd8ff!important;
  box-shadow:none!important;
}
.secondary-listen:hover{
  background:#ebe8ff!important;
}

/* ===== V10 — avatars illustrés + décors évolutifs ===== */
.creature-avatar{image-rendering:auto}
.avatar-scene{
  position:relative;
  width:calc(100% - 28px);
  height:255px;
  margin:0 14px 10px;
  border-radius:24px;
  overflow:hidden;
  isolation:isolate;
  background:#eef1ff;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.72),0 12px 28px rgba(45,50,100,.12);
}
.avatar-scene-bg{
  position:absolute;inset:0;z-index:0;
  background-image:linear-gradient(180deg,rgba(13,20,54,.03),rgba(13,20,54,.16)),var(--avatar-bg);
  background-size:cover;
  background-position:center;
  transform:scale(1.02);
}
.avatar-art{
  position:absolute;
  z-index:2;
  left:50%;bottom:-5px;
  transform:translateX(-50%);
  width:min(94%,300px);
  height:94%;
  object-fit:contain;
  object-position:center bottom;
  filter:drop-shadow(0 11px 12px rgba(23,28,66,.24));
  pointer-events:none;
}
.avatar-art.stage-4,.avatar-art.stage-5{width:min(98%,318px);height:98%}
.avatar-bg-button{
  position:absolute;z-index:4;right:10px;top:10px;
  border:1px solid rgba(255,255,255,.82);
  background:rgba(20,25,58,.66);color:#fff;
  border-radius:999px;padding:7px 10px;
  font-size:.73rem;font-weight:950;
  backdrop-filter:blur(8px);
  box-shadow:0 5px 14px rgba(20,25,58,.17)
}
.avatar-bg-button:hover{background:rgba(20,25,58,.8)}
.avatar-scene.compact{
  width:100%;height:118px;margin:0 0 10px;border-radius:18px;
}
.avatar-scene.compact .avatar-art{height:105%;width:90%;bottom:-9px}
.hero-profile{overflow:hidden;padding-top:10px}
.hero-profile .avatar-scene{pointer-events:none}
.avatar-thumb{display:block;width:60px;height:60px;object-fit:contain;filter:drop-shadow(0 5px 5px rgba(30,35,75,.14))}
.species-avatar{width:62px;height:62px;flex:0 0 62px}
.species-choice{min-height:84px;padding:8px 10px}
.species-glyph{display:none}
.evolution-art-line{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px;margin-top:10px}
.evolution-art-stage{min-width:0;text-align:center;border-radius:16px;background:#fff;border:1px solid #ebe9ff;padding:5px 3px 7px}
.evolution-art-stage .avatar-thumb{width:100%;height:72px;margin:auto}
.evolution-art-stage b{display:grid;place-items:center;width:24px;height:24px;margin:-3px auto 3px;border-radius:8px;background:#ece9ff;color:#5f53d5;font-size:.72rem}
.evolution-art-stage small{display:block;font-size:.62rem;line-height:1.05;color:#686b86;font-weight:800}
.background-picker{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:14px}
.background-choice{position:relative;overflow:hidden;border:2px solid transparent;background:#fff;border-radius:18px;padding:0 0 9px;color:var(--ink);text-align:left;box-shadow:0 7px 17px rgba(48,50,105,.08)}
.background-choice img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block;margin-bottom:8px}
.background-choice span,.background-choice small{display:block;padding:0 9px}
.background-choice span{font-weight:950;font-size:.78rem}
.background-choice small{font-size:.67rem;color:var(--muted);margin-top:2px}
.background-choice.selected{border-color:#6d5dfc;box-shadow:0 0 0 4px rgba(109,93,252,.08),0 9px 20px rgba(48,50,105,.12)}
.background-choice.locked{filter:saturate(.15);opacity:.56;cursor:not-allowed}
.background-choice.locked img{filter:blur(1px)}
.login-avatar-wrap{width:150px;margin:-4px auto 8px}
.login-avatar-wrap .avatar-scene{height:130px}
.teacher-avatar-mini{width:78px;height:78px;position:relative;border-radius:20px;background:#f3f2ff;overflow:hidden}
.teacher-avatar-mini .avatar-art{height:100%;width:100%;bottom:-5px}
@media(max-width:700px){
 .avatar-scene{height:220px}
 .background-picker{grid-template-columns:repeat(2,minmax(0,1fr))}
 .species-picker{grid-template-columns:repeat(2,minmax(0,1fr))}
 .evolution-art-stage .avatar-thumb{height:58px}
 .evolution-art-stage small{font-size:.56rem}
}

/* ===== V13 — médias intégrés et activités CP recalées ===== */
.module-cp_fr_jentends_son .question-box{
  justify-content:flex-start;
}
.module-cp_fr_jentends_son .big-question{
  flex:0 0 auto;
  margin:5px 0 4px;
  font-size:clamp(1rem,2.4vh,1.35rem);
  letter-spacing:0;
}
.module-cp_fr_jentends_son .recorded-target{
  flex:0 0 auto;
  margin:2px 0 4px;
}
.module-cp_fr_jentends_son .phoneme-listen{
  margin:2px auto 4px;
  padding:9px 15px;
}
.module-cp_fr_jentends_son .word-image-grid{
  flex:1 1 auto;
  min-height:0;
  width:min(700px,100%);
  height:min(32dvh,220px);
  max-height:220px;
  margin:4px auto 2px;
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-template-rows:minmax(0,1fr);
  align-items:stretch;
}
.module-cp_fr_jentends_son .word-image-wrap,
.module-cp_fr_jentends_son .word-image-card{
  height:100%;
  min-height:0;
}
.module-cp_fr_jentends_son .word-image-card{
  aspect-ratio:auto;
}
.module-cp_fr_jentends_son .feedback{
  flex:0 0 auto;
}

.module-cp_fr_son_vers_grapheme .choice-grid{
  width:min(610px,100%);
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.module-cp_fr_son_vers_grapheme .choice-answer{
  min-height:112px;
  font-size:clamp(2.4rem,7vh,4rem);
}

@media(max-width:560px){
  .module-cp_fr_jentends_son .exercise-top .kicker,
  .module-cp_fr_jentends_son .micro-label{
    display:none;
  }
  .module-cp_fr_jentends_son .word-image-grid{
    width:min(390px,100%);
    height:min(43dvh,340px);
    max-height:340px;
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-template-rows:repeat(2,minmax(0,1fr));
    gap:8px;
  }
  .module-cp_fr_jentends_son .word-image-card{
    border-radius:16px;
  }
  .module-cp_fr_jentends_son .mini-listen{
    right:6px;
    bottom:6px;
    width:36px;
    height:36px;
  }
  .module-cp_fr_son_vers_grapheme .choice-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }
  .module-cp_fr_son_vers_grapheme .choice-answer{
    min-height:104px;
    font-size:clamp(2.2rem,8vh,3.4rem);
  }
}
/* ===== V11 — finition UX / défis / contenus 2026-2027 ===== */
/* Index : le tigre S1 possède davantage d'espace visuel */
.species-choice .avatar-tiger.species-avatar{transform:scale(1.34);transform-origin:center center}

/* Choix graphèmes / lettres : cible tactile et visuelle plus grande */
.module-cp_fr_son_vers_grapheme .choice-answer,
.module-cp_fr_valeurs_contextuelles .choice-answer,
.module-ce2_fr_graphies_multiples .choice-answer{
  min-height:90px;font-size:clamp(1.65rem,4.2vh,2.6rem);font-weight:1000;border-radius:24px
}
.green-letter{color:#138a44;font-weight:1000}
.quote-inline{white-space:nowrap}

/* Indice morphologique : TARDIF, LAITIER... entièrement en capitales */
.morph-hint-popup .hint-root,.morph-hint-popup .hint-suffix{text-transform:uppercase!important}

/* CE1 fluence : le texte utilise vraiment la surface disponible */
.module-ce1_fr_fluence .fluence-fixed{
  width:100%;height:100%;margin:3px auto;padding:10px 14px;
  font-size:clamp(1.35rem,3.05vh,2.12rem);line-height:1.5;align-content:center
}

/* Morphologie CE1 : grandes cases */
.module-ce1_fr_morphologie_vocabulaire .choice-answer{
  min-height:80px;font-size:clamp(1.08rem,2.45vh,1.45rem);border-radius:22px
}

/* Phrase analysée verte quand le module le demande */
.analysis-sentence.green{
  color:#126c39;
  background:linear-gradient(180deg,transparent 19%,rgba(147,230,176,.60) 19%,rgba(147,230,176,.60) 89%,transparent 89%);
}
.analysis-sentence.green .analysis-target{background:#73d898;color:#0d572d;box-shadow:0 0 0 3px rgba(91,198,131,.24)}

/* Questions structurées : contrôle explicite des retours à la ligne */
.structured-prompt{width:min(790px,98%);margin:7px auto 12px;text-align:center;color:#1b2043}
.prompt-line{font-size:clamp(1.42rem,4vh,2.8rem);font-weight:950;line-height:1.16;margin:3px 0}
.prompt-line.line-2{font-size:clamp(1.55rem,4.2vh,2.9rem)}
.sub-prompt{max-width:96%;margin:7px auto 0;font-size:clamp(.78rem,1.8vh,1rem);font-weight:500;line-height:1.2;color:#72768f;white-space:nowrap}

/* Flashcard image + haut-parleur : images réelles pourront remplacer l'emoji sans recoder */
.media-flashcard{
  position:relative;width:min(260px,56vw);aspect-ratio:1/1;margin:4px auto 10px;
  border:2px solid #e2def8;border-radius:28px;background:#fff;overflow:hidden;
  display:grid;place-items:center;box-shadow:0 10px 24px rgba(63,57,128,.10)
}
.media-flashcard img{width:100%;height:100%;object-fit:contain;padding:12px}
.media-emoji-fallback{width:100%;height:100%;place-items:center;font-size:clamp(4.4rem,13vh,8rem);background:linear-gradient(145deg,#fff,#f6f5ff)}
.media-speaker{
  position:absolute;right:10px;top:10px;width:46px;height:46px;border:0;border-radius:50%;
  background:#5d53d8;color:white;font-size:1.15rem;box-shadow:0 7px 16px rgba(61,51,155,.25);z-index:2
}

/* Méga-défis hors parcours */
.mega-section{margin-top:18px;border-top:1px solid #eceaf7;padding-top:16px}
.mega-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.mega-section-head h3{margin:2px 0}.mega-won{font-size:.8rem;font-weight:950;color:#936500;background:#fff1b6;padding:7px 10px;border-radius:999px}
.mega-challenge-card{
  width:100%;border:1px solid #eadcaa;border-radius:22px;background:linear-gradient(135deg,#fffaf0,#fff4ca);
  padding:14px 16px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:13px;text-align:left;color:var(--ink);
  box-shadow:0 9px 22px rgba(139,103,21,.08)
}
.mega-challenge-card.won{border-color:#e0b52d;box-shadow:0 0 0 4px rgba(255,204,45,.12),0 10px 25px rgba(139,103,21,.12)}
.mega-icon{font-size:2rem}.mega-challenge-card strong{display:block;font-size:1.02rem}.mega-challenge-card small{display:block;color:#776e59;margin-top:3px;line-height:1.25}.mega-action{font-size:.8rem;font-weight:950;color:#715600;white-space:nowrap}
.mega-run,.mega-finish{width:min(720px,100%);margin:12px auto;text-align:center}.mega-run-head{display:flex;justify-content:space-between;align-items:center;text-align:left;gap:12px}.mega-progress{height:10px;border-radius:999px;background:#eceaf6;overflow:hidden;margin:14px 0 24px}.mega-progress i{display:block;height:100%;background:linear-gradient(90deg,#ffca3a,#ff9b42);border-radius:inherit}.mega-dictation{display:grid;gap:12px;justify-items:center}.mega-listen{border:0;border-radius:18px;background:#5e55d9;color:#fff;font-weight:950;padding:12px 18px}.mega-exit{margin-top:22px}.mega-finish-icon{font-size:4rem}.mega-errors{display:flex;flex-wrap:wrap;gap:7px;justify-content:center;margin:12px 0}.mega-errors span{padding:6px 9px;border-radius:999px;background:#fff0ed;color:#a64838;font-weight:850;font-size:.8rem}

/* Halo gagné avec la méga-médaille */
.mega-halo{position:relative;isolation:isolate}
.mega-halo::after{
  content:"";position:absolute;inset:-5px;border-radius:inherit;pointer-events:none;z-index:10;
  border:3px solid rgba(255,197,44,.92);box-shadow:0 0 10px rgba(255,190,36,.65),0 0 26px rgba(255,201,65,.48),inset 0 0 14px rgba(255,218,101,.20);
  animation:megaHalo 2.2s ease-in-out infinite
}
@keyframes megaHalo{0%,100%{opacity:.72;filter:brightness(.95)}50%{opacity:1;filter:brightness(1.2)}}
.home-mega-medal{position:absolute;right:10px;top:8px;z-index:12;font-size:1.55rem;filter:drop-shadow(0 4px 5px rgba(68,48,0,.25))}

/* Niveau suivant débloqué */
.next-level-unlocked{margin:15px 0;padding:13px;border:1px solid #bfe5ce;border-radius:20px;background:#f3fff7}
.next-level-unlocked .challenge-list{margin-top:10px}

/* Mode professeur : les intitulés ne doivent jamais être rognés horizontalement */
.teacher-layout,.dashboard,.radar-card{min-width:0}
.teacher-layout .student-row .grow,.modal .student-row .grow{min-width:0}
.teacher-layout .student-row strong,.modal .student-row strong,.axis-legend span{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;overflow-wrap:anywhere}
.radar-card{overflow:visible!important;padding-left:18px;padding-right:18px}
.radar-svg{max-width:100%;overflow:visible}

@media(max-width:700px){
 .sub-prompt{white-space:normal}
 .media-flashcard{width:min(220px,62vw)}
 .mega-challenge-card{grid-template-columns:auto 1fr}.mega-action{grid-column:2}.mega-section-head{align-items:flex-start;flex-direction:column}
 .module-ce1_fr_fluence .fluence-fixed{font-size:clamp(1.15rem,2.45vh,1.55rem);line-height:1.43;padding:8px}
}

/* CM2 : texte plus long, mais toujours fixe et entièrement visible */
.module-cm2_fr_fluence .fluence-fixed{font-size:clamp(1.02rem,2.15vh,1.42rem);line-height:1.42;padding:7px 12px}

/* V13 — garde de cascade pour les grandes cibles graphèmes */
.module-cp_fr_son_vers_grapheme .choice-grid{
  width:min(610px,100%);
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.module-cp_fr_son_vers_grapheme .choice-answer{
  min-height:112px;
  font-size:clamp(2.4rem,7vh,4rem);
}
@media(max-width:560px){
  .module-cp_fr_son_vers_grapheme .choice-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }
  .module-cp_fr_son_vers_grapheme .choice-answer{
    min-height:104px;
    font-size:clamp(2.2rem,8vh,3.4rem);
  }
}
