.fractions6-shell{width:min(1180px,calc(100% - 2rem))}
.fractions6-hero{border-top-color:#7b5a96;background:linear-gradient(150deg,#fff,#f5f0f8 72%,#eef7f3)}
.fractions6-start{background:linear-gradient(135deg,#6f4f89,#3d7d79)}
.fractions6-targeted-grid button span{background:#efe8f4;color:#65467e}
.f6-head{padding:1.15rem 1.35rem .95rem;border-bottom:1px solid #e5e1e8;background:linear-gradient(180deg,#fdfcfe,#f8f5fa)}
.f6-head h1{margin:.2rem 0 .35rem;color:#18364c;font-size:clamp(1.4rem,3vw,1.95rem);letter-spacing:-.025em}
.f6-head p:last-child{margin:.25rem 0 0;color:#5b707d;line-height:1.5}
.f6-body{padding:clamp(1rem,3vw,1.35rem)}
.f6-prompt{margin:0 0 1rem;padding:.85rem 1rem;border-left:4px solid #7b5a96;border-radius:0 12px 12px 0;background:#f5f0f8;color:#18364c;line-height:1.55}
.f6-two-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem;margin:.85rem 0}
.f6-field{padding:.8rem .85rem;border:1px solid #d9dfe1;border-radius:13px;background:#fbfcfc}
.f6-field.compact{width:min(560px,100%);margin:.85rem auto}
.f6-field>label,.f6-field legend,.field-label{display:block;margin-bottom:.45rem;color:#18364c;font-size:.88rem;font-weight:850;line-height:1.35}
.f6-field input[type="text"],.f6-field input[type="number"],.f6-field input[inputmode]{min-height:44px;padding:.52rem .62rem;border:1px solid #afc2c7;border-radius:9px;background:#fff;color:#18364c;font-weight:850}
.f6-field input:focus,.input-fraction input:focus,.decompose-line input:focus,.encadre-line input:focus,.calc-line input:focus{border-color:#7b5a96;outline:none;box-shadow:0 0 0 3px rgba(123,90,150,.10)}
.f6-note{margin:.3rem 0;color:#5b707d;font-size:.86rem;line-height:1.45}
.strong-note{font-weight:750}
.f6-frac{display:inline-grid;grid-template-rows:auto auto;vertical-align:middle;min-width:1.7em;text-align:center;line-height:1;font-family:"Cambria Math",Cambria,Georgia,serif;font-weight:850}
.f6-frac>span:first-child{padding:0 .18em .13em;border-bottom:1.6px solid currentColor}
.f6-frac>span:last-child{padding:.13em .18em 0}
.figure-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
.figure-choice{display:block;cursor:pointer}
.figure-choice>input{position:absolute;opacity:0;pointer-events:none}
.figure-choice-card{display:block;padding:.85rem;border:2px solid #d8dfe2;border-radius:13px;background:#fff;transition:.15s ease}
.figure-choice-card>strong{display:block;margin-bottom:.65rem;color:#18364c;text-align:center}
.figure-choice>input:checked+.figure-choice-card{border-color:#7b5a96;background:#faf7fc;box-shadow:0 0 0 3px rgba(123,90,150,.08)}
.fraction-bar{display:flex;overflow:hidden;width:min(100%,430px);height:62px;margin:.35rem auto;border:2px solid #536d78;background:#fff}
.fraction-bar.equal>span{flex:1;border-right:1px solid #536d78}
.fraction-bar>span:last-child{border-right:0}
.fraction-bar.unequal>span{border-right:1px solid #536d78}
.fraction-bar .filled{background:repeating-linear-gradient(135deg,#d9edf2 0,#d9edf2 6px,#96c5d0 6px,#96c5d0 8px)}
.shade-units{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(.9rem,3vw,1.5rem);width:min(100%,820px);margin:.85rem auto 1.1rem}
.shade-unit-card{padding:.85rem .85rem .65rem;border:1px solid #d9e2e3;border-radius:14px;background:#fbfcfc}
.shade-band{display:grid;grid-template-columns:repeat(var(--den),minmax(34px,1fr));overflow:hidden;border:2px solid #536d78;background:#fff}
.shade-cell{height:74px;border:0;border-right:1px solid #536d78;background:#fff;cursor:pointer;transition:background .12s ease,box-shadow .12s ease}
.shade-cell:last-child{border-right:0}
.shade-cell:hover{box-shadow:inset 0 0 0 2px rgba(123,90,150,.16)}
.shade-cell.selected{background:repeating-linear-gradient(135deg,#eadff1 0,#eadff1 7px,#bfa5d0 7px,#bfa5d0 9px)}
.shade-unit-caption{display:flex;align-items:center;justify-content:center;gap:.5rem;margin-top:.55rem;color:#5b707d;font-size:.82rem}
.shade-unit-caption strong{padding:.22rem .55rem;border-radius:999px;background:#edf6f4;color:#236b63;font-size:.84rem}
.compare-card{background:#fbfcff}
.compare-line,.equiv-line,.decompose-line,.encadre-line{display:flex;align-items:center;justify-content:center;gap:.6rem;flex-wrap:wrap;font-family:"Cambria Math",Cambria,Georgia,serif;font-size:1.25rem;font-weight:850}
.compare-line select{min-width:64px;min-height:44px;border:1px solid #afc2c7;border-radius:9px;background:#fff;text-align:center;font-size:1.15rem;font-weight:850}
.input-fraction{display:inline-grid;grid-template-rows:auto 2px auto;vertical-align:middle;min-width:72px;text-align:center}
.input-fraction span{display:block;height:2px;background:#355a63}
.input-fraction input{width:72px;min-height:40px;padding:.35rem;border:1px solid #afc2c7;border-radius:7px;text-align:center;font-weight:850}
.input-fraction b{padding:.4rem .2rem .2rem;font-size:1rem}
.input-fraction.inline{min-width:68px}
.input-fraction.inline input{width:68px}
.decompose-line{margin:1.1rem 0}
.decompose-line.small{font-size:1.05rem}
.decompose-line>input,.encadre-line>input{width:82px;min-height:42px;padding:.4rem;border:1px solid #afc2c7;border-radius:8px;text-align:center;font-weight:850}
.encadre-line{margin:.9rem 0 1.15rem}
.f6-axis-wrap{margin:.65rem 0}
.f6-axis{display:block;width:min(100%,880px);height:auto;margin:auto;border:1px solid #d8e3e3;border-radius:14px;background:#fff}
.f6-axis-base{stroke:#5c7079;stroke-width:2.4}
.f6-axis-tick{stroke:#5c7079;stroke-width:1.8}
.f6-axis-known{fill:#536d78;font-size:13px;font-weight:800}
.f6-axis-label{fill:#18364c;font-size:15px;font-weight:900}
.f6-axis-read{stroke:#2f8a72;stroke-width:3.5;stroke-linecap:round}
.f6-axis-selected{stroke:#b36b25;stroke-width:4;stroke-linecap:round}
/* Le libellé du point placé ne doit pas hériter du trait épais du repère. */
.f6-axis-selected .f6-axis-label{fill:#18364c;stroke:none;font-size:16px;font-weight:900}
.f6-axis-click{fill:transparent;cursor:pointer}
.decimal-bars{display:grid;gap:.5rem;width:min(100%,780px);margin:.8rem auto 1rem}
.decimal-bar{display:grid;grid-template-columns:repeat(10,1fr);height:54px;border:2px solid #536d78;background:#fff}
.decimal-bar span{border-right:1px solid #6e7f87}
.decimal-bar span:last-child{border-right:0}
.decimal-bar .filled{background:repeating-linear-gradient(135deg,#d8edf0 0,#d8edf0 6px,#98cbd0 6px,#98cbd0 8px)}
.decimal-equivalence-visual{display:grid;grid-template-columns:minmax(0,180px) auto minmax(0,180px);align-items:center;justify-content:center;gap:1rem;margin:.9rem auto 1.05rem}
.decimal-equivalence-item{display:grid;justify-items:center;gap:.3rem;color:#5b707d;font-size:.8rem;text-align:center}
.decimal-equivalence-item>strong{color:#18364c;font-family:"Cambria Math",Cambria,Georgia,serif;font-size:1rem}
.decimal-grid{display:grid;width:160px;height:160px;overflow:hidden;border:2px solid #536d78;background:#fff}
.decimal-grid.tenths{grid-template-columns:repeat(10,1fr)}
.decimal-grid.hundredths{grid-template-columns:repeat(10,1fr);grid-template-rows:repeat(10,1fr)}
.decimal-grid span{border-right:1px solid #b7c4c8}
.decimal-grid.tenths span:last-child{border-right:0}
.decimal-grid.hundredths span{border-bottom:1px solid #d2dadd}
.decimal-grid.hundredths span:nth-child(10n){border-right:0}
.decimal-grid.hundredths span:nth-last-child(-n+10){border-bottom:0}
.decimal-grid .filled{background:repeating-linear-gradient(135deg,#d8edf0 0,#d8edf0 5px,#98cbd0 5px,#98cbd0 7px)}
.same-value-mark{color:#7b5a96;font-family:"Cambria Math",Cambria,Georgia,serif;font-size:1.8rem;font-weight:900}
.equivalence-card{background:#fbfcff}
.fraction-choice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem}
.fraction-check{cursor:pointer}
.fraction-check input{position:absolute;opacity:0}
.fraction-check>span{display:flex;align-items:center;justify-content:center;min-height:70px;border:2px solid #d5dee1;border-radius:10px;background:#fff;color:#18364c;font-size:1.12rem}
.fraction-check input:checked+span{border-color:#7b5a96;background:#f7f1fa;box-shadow:0 0 0 3px rgba(123,90,150,.07)}
.quotient-strip{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:.7rem;width:min(100%,660px);margin:.75rem auto 1rem}
.quotient-strip>span{font-weight:850;color:#18364c}
.quotient-strip>div{display:grid;grid-template-columns:repeat(var(--parts),1fr);height:54px;border:2px solid #536d78;background:#fff}
.quotient-strip i{border-right:1px solid #536d78;background:#d7e7eb}
.quotient-strip i:last-child{border-right:0}
.choice-list{display:grid;gap:.45rem}
.choice-list label{display:flex;align-items:center;gap:.5rem;min-height:43px;padding:.55rem .65rem;border:1px solid #d3dfe0;border-radius:9px;background:#fff;font-weight:750}
.choice-list input{accent-color:#7b5a96}
.quantity-dots{display:grid;grid-template-columns:repeat(10,1fr);gap:.42rem;width:min(100%,600px);margin:.75rem auto 1rem;padding:.7rem;border:1px solid #d7e2e2;border-radius:14px;background:#fff;text-align:center;color:#4e7982}
.method-grid.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
.method-card{padding:.8rem;border:1px solid #d8e3e3;border-radius:11px;background:#fbfcfc;text-align:center}
.method-card strong{display:block;margin-bottom:.6rem;color:#18364c}
.calc-line{display:flex;align-items:center;justify-content:center;gap:.45rem;flex-wrap:wrap;font-weight:850}
.calc-line input{width:80px;min-height:42px;padding:.4rem;border:1px solid #afc2c7;border-radius:8px;text-align:center;font-weight:850}
.feedback-box{display:none;margin-top:.8rem;padding:.75rem .85rem;border-radius:10px;line-height:1.5}
.feedback-box.show{display:block}
.feedback-box.error{background:#fff1ef;color:#7d3f3f;border:1px solid #e8c2bd}
.feedback-box.success{background:#edf8f1;color:#235f40;border:1px solid #acd4bb}
.f6-success{padding:1rem;border:1px solid #acd4bb;border-radius:13px;background:#edf8f1;color:#235f40;font-size:1.05rem;font-weight:850;text-align:center}
.solution-steps{display:grid;gap:.5rem}
.solution-steps>div{padding:.65rem .75rem;border:1px solid #dbe5e4;border-radius:10px;background:#f8fbfa;line-height:1.55}
.solution-transition{margin-top:.9rem;padding:.8rem .9rem;border-left:4px solid #80618e;border-radius:0 10px 10px 0;background:#f4eff6;line-height:1.55}
@media(max-width:760px){
  .f6-two-cols,.figure-grid,.method-grid.two{grid-template-columns:1fr}
  .shade-units{grid-template-columns:1fr}
  .decimal-equivalence-visual{grid-template-columns:1fr;gap:.55rem}
  .same-value-mark{font-size:1.45rem}
  .fraction-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .quantity-dots{grid-template-columns:repeat(8,1fr)}
}
@media(max-width:520px){
  .shade-cell{height:58px;min-width:0}
  .fraction-choice-grid{grid-template-columns:1fr 1fr}
  .quantity-dots{grid-template-columns:repeat(6,1fr)}
  .f6-head{padding:1rem}
  .f6-body{padding:.9rem}
}

/* 0.36.4 — sens des fractions, division posée et méthode fraction d'une quantité */
.fraction-meaning-card{margin:.85rem 0;padding:.85rem 1rem;border:1px solid #d9dfe1;border-radius:13px;background:#fbfcff}
.fraction-meaning-card>strong{display:block;margin-bottom:.65rem;color:#18364c}
.fraction-meaning-line{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}
.fraction-meaning-line label{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap;padding:.65rem .75rem;border:1px solid #dde5e6;border-radius:10px;background:#fff;color:#18364c;line-height:1.45}
.fraction-meaning-line input{width:68px;min-height:40px;padding:.35rem;border:1px solid #afc2c7;border-radius:8px;text-align:center;font-weight:850}

.division-preview{display:flex;align-items:center;justify-content:center;gap:1.25rem;width:min(100%,690px);margin:.75rem auto 1rem;padding:.8rem 1rem;border:1px solid #d8e3e3;border-radius:13px;background:#f8fbfb}
.division-preview-copy{display:grid;gap:.2rem;color:#5b707d;font-size:.84rem;line-height:1.4}
.division-preview-copy strong{color:#18364c;font-size:.9rem}
.long-division{display:grid;grid-template-columns:auto minmax(76px,auto);grid-template-rows:auto auto;align-items:stretch;font-family:"Cambria Math",Cambria,Georgia,serif;font-size:1.15rem;font-weight:850;color:#18364c}
.long-dividend{grid-row:1 / 3;display:flex;align-items:flex-start;justify-content:flex-end;padding:.35rem .65rem .35rem 0;min-width:92px}
.long-divisor{padding:.3rem .55rem;border-left:2px solid #536d78;border-bottom:2px solid #536d78;text-align:center;background:#fff}
.long-quotient{padding:.35rem .55rem;border-left:2px solid #536d78;color:#7a8b91;font-family:inherit;font-size:.78rem;font-weight:700;text-align:center;background:#fff}

.fraction-method-sentence{margin:.8rem 0;padding:.8rem .95rem;border-left:4px solid #2f8a72;border-radius:0 12px 12px 0;background:#eef7f4;color:#18364c;line-height:1.55}
.fraction-method-sentence>strong{display:block;margin-bottom:.4rem}
.fraction-method-sentence input{width:64px;min-height:40px;margin:0 .25rem;padding:.3rem;border:1px solid #9ebdb8;border-radius:8px;background:#fff;text-align:center;font-weight:850;color:#18364c}

@media(max-width:760px){
  .fraction-meaning-line{grid-template-columns:1fr}
  .division-preview{align-items:stretch;flex-direction:column}
  .long-division{align-self:center}
}