/* Free exercises on fractions: figures to colour, boxes filled from the pad, graduated line, labels to order. Loaded after clock-exercise.css. */
.fraction-exercise .lesson-fraction{font-size:.95em}
.fraction-figure-box .fraction-figure{max-width:300px;margin:0 auto}
.fraction-figure-box .fraction-figure--disque{max-width:210px}
.fraction-figure-box--wide{margin-bottom:16px}
.fraction-figure-box--wide .fraction-figure{max-width:560px}
.fraction-figure-box--wide .fraction-figure--disque{max-width:460px;max-height:170px}
.fraction-display{margin:0 0 18px;font:750 32px Inter,sans-serif;color:#101052;white-space:pre-wrap;text-align:center}
.fraction-display .lesson-fraction{font-size:1em}
.fraction-signs{grid-template-columns:1fr}
.fraction-signs .clock-choice{font-size:19px;white-space:pre-wrap;text-align:left}
.fraction-signs .clock-choice::first-letter{font-size:26px;font-weight:800;color:#034cff}
.clock-choice[aria-pressed="true"]{border-color:#034cff;background:#e7eeff}
.fraction-multi{grid-template-columns:repeat(auto-fit,minmax(min(110px,100%),1fr))}
.fraction-multi .clock-choice,.clock-choice .lesson-fraction{font-size:20px}
.fraction-hint{margin:-8px 0 16px;text-align:left}
.fraction-colour{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:20px}
.fraction-colour .fraction-figure{max-width:340px}.fraction-colour .fraction-figure--disque{max-width:240px}
.fraction-colour--wide .fraction-figure{max-width:560px}.fraction-colour--wide .fraction-figure--disque{max-width:480px;max-height:190px}
.fraction-figure--interactive .fraction-part{cursor:pointer;-webkit-tap-highlight-color:transparent}
.fraction-figure--interactive .fraction-part:focus-visible{outline:none;stroke:#034cff;stroke-width:3}
.fraction-figure--interactive.is-locked .fraction-part{cursor:default;pointer-events:none}
.fraction-counter{margin:0;font-size:15px;font-weight:650;color:#323f86}
.fraction-clear{padding:0 18px}
.fraction-pad .fraction-entry{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin-bottom:14px;font:700 26px Inter,sans-serif;color:#101052}
.fraction-fixed{white-space:pre-wrap}
.fraction-entry-stack{display:inline-flex;flex-direction:column;align-items:center;gap:5px}
.fraction-entry-bar{align-self:stretch;height:3px;border-radius:2px;background:#101052}
.fraction-entry-stack .fraction-fixed{min-width:44px;text-align:center;line-height:1.1}
.fraction-slot{width:64px;min-height:52px;padding:4px;font-size:26px}
.fraction-slot--wide{width:104px}
.fraction-line-entry{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:20px}
.fraction-line-entry .fraction-figure{max-width:620px;touch-action:pan-y;cursor:pointer}
.fraction-line-entry .fraction-figure.is-locked{pointer-events:none;cursor:default}
.fraction-line-controls{width:min(380px,100%)}
.fraction-text--ask{font-size:17px}
.fraction-feedback-figure{margin-bottom:12px}
.fraction-feedback-figure .fraction-figure{max-width:420px}.fraction-feedback-figure .fraction-figure--disque{max-width:300px;max-height:130px}.fraction-feedback-figure .fraction-figure--bande{max-width:280px}
.fraction-pair{display:grid;gap:8px;max-width:340px}
.fraction-pair>div{display:flex;align-items:center;gap:12px}.fraction-pair .fraction-figure{flex:1}.fraction-pair span{font-weight:750;color:#101052}
.fraction-order{margin-bottom:20px}
.fraction-order-tray{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;min-height:68px;margin-bottom:14px;padding:10px;border:2px dashed #cdccff;border-radius:14px;background:#f8f9ff}
.fraction-order-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;margin-bottom:10px}
.fraction-order-sign{font:800 24px Inter,sans-serif;color:#505b99}
.fraction-order-slot{display:flex;align-items:center;justify-content:center;width:78px;height:78px;border:2px solid #cdccff;border-radius:14px;background:#fff}
.fraction-order-slot.is-correct{border-color:#16794a;background:#e4f6ec}.fraction-order-slot.is-wrong{border-color:#b3261e;background:#fdeceb}
.fraction-order-empty{width:100%;height:100%;border:0;border-radius:12px;background:none;color:#aab4e6;font:700 20px Inter,sans-serif;cursor:pointer}
.fraction-tag{min-width:62px;min-height:62px;padding:6px 10px;border:2px solid #034cff;border-radius:12px;background:#e7eeff;color:#101052;font:750 22px Inter,sans-serif;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}
.fraction-tag.is-selected{background:#034cff;color:#fff;box-shadow:0 0 0 3px #034cff33}
.fraction-tag:disabled{cursor:default;opacity:1}
.fraction-tag--ghost{position:fixed;z-index:50;transform:translate(-50%,-50%);pointer-events:none;box-shadow:0 10px 24px #10105240;cursor:grabbing}
.fraction-other-classes{margin:22px 0 0;text-align:center;font-size:15px;color:#505b99}
.fraction-other-classes a{color:#12208c;font-weight:650}
.clock-level .lesson-fraction{font-size:.9em}
@media(max-width:700px){
 .fraction-figure-box .fraction-figure{max-width:230px}.fraction-figure-box .fraction-figure--disque{max-width:150px}
 .fraction-figure-box--wide{margin-bottom:8px}.fraction-figure-box--wide .fraction-figure--disque{max-height:120px}
 .fraction-display{margin-bottom:10px;font-size:26px}
 .fraction-signs .clock-choice{font-size:16px}
 .fraction-exercise .fraction-signs,.fraction-exercise .fraction-multi{grid-template-columns:1fr}
 .fraction-exercise .fraction-multi{grid-template-columns:repeat(3,minmax(0,1fr))}
 .fraction-colour{gap:6px;margin-bottom:12px}.fraction-colour .fraction-figure{max-width:260px}.fraction-colour .fraction-figure--disque{max-width:180px}
 .fraction-colour--wide .fraction-figure--disque{max-height:130px}
 .fraction-pad .fraction-entry{gap:6px 7px;margin-bottom:10px;font-size:21px}
 .fraction-exercise .fraction-slot{width:52px;min-height:42px;font-size:22px}.fraction-exercise .fraction-slot--wide{width:86px}
 .fraction-entry-stack{gap:4px}.fraction-entry-stack .fraction-fixed{min-width:36px}
 .fraction-line-entry{gap:6px;margin-bottom:12px}
 .fraction-order-tray{min-height:60px;margin-bottom:10px;padding:8px}
 .fraction-order-slot{width:62px;height:66px}.fraction-tag{min-width:52px;min-height:54px;font-size:19px}
 .fraction-order-sign{font-size:18px}.fraction-order-row{gap:4px}
}
.fraction-figure--interactive{-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;outline:none}
@media(max-width:700px){.fraction-figure-box--wide .fraction-figure{max-width:100%}.fraction-figure-box--wide .fraction-figure--disque{max-width:300px}}
