.scratch-training-page{
  --scratch-motion:#4c97ff;
  --scratch-turn:#4c97ff;
  --scratch-control:#ffab19;
  --scratch-variables:#ff8c1a;
  --scratch-sensing:#5cb1d6;
  --scratch-operators:#59c059;
  --scratch-looks:#9966ff;
  --scratch-events:#ffbf00;
  --scratch-dark:#173b62;
}
.scratch-training-shell{max-width:1220px}
.scratch-hero{display:flex;align-items:center;justify-content:space-between;gap:2rem}
.scratch-hero-mark{display:grid;gap:.42rem;min-width:170px;justify-items:start;transform:rotate(-2deg)}
.scratch-mini-block{display:inline-flex;padding:.5rem .82rem;border-radius:8px;color:#fff;font-weight:900;font-size:.82rem;box-shadow:inset 0 -2px 0 rgba(0,0,0,.16)}
.scratch-mini-block.motion{background:var(--scratch-motion)}
.scratch-mini-block.control{background:var(--scratch-control)}
.scratch-mini-block.variables{background:var(--scratch-variables)}
.scratch-course-note{margin:1rem 0 1.2rem;padding:.9rem 1rem;border:1px solid #d8e5e1;border-left:4px solid #2d8d71;border-radius:12px;background:#f5faf8;color:#315866;line-height:1.55}
.scratch-targeted-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.scratch-exercise-card{padding:clamp(1rem,2.2vw,1.6rem)}
.scratch-step-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1rem}
.scratch-step-head h1{margin:.1rem 0 .25rem;font-size:clamp(1.45rem,2.3vw,2rem);color:#173d5b}
.scratch-step-head p{margin:0;color:#5d727d;line-height:1.5}
.scratch-step-number{display:inline-grid;place-items:center;min-width:42px;height:42px;border-radius:12px;background:#eaf3f0;color:#176b5a;font-weight:950}
.scratch-prompt{font-size:1.04rem;line-height:1.55;color:#294b5e;margin:.6rem 0 1rem}
.scratch-workspace{display:grid;grid-template-columns:minmax(330px,.95fr) minmax(360px,1.05fr);gap:1rem;align-items:stretch}
.scratch-panel{border:1px solid #d8e4e5;border-radius:17px;background:#fbfdfd;padding:1rem;min-width:0}
.scratch-panel h2{font-size:.85rem;text-transform:uppercase;letter-spacing:.07em;color:#607681;margin:0 0 .75rem}
.scratch-board{position:relative;display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(7,1fr);aspect-ratio:8/7;max-width:560px;margin:auto;border:1px solid #cfdcdf;border-radius:14px;overflow:hidden;background:#eef4f3}
.scratch-cell{position:relative;border-right:1px solid #dce6e5;border-bottom:1px solid #dce6e5;display:grid;place-items:center;min-width:0}
.scratch-cell.path{background:#fff}
.scratch-cell.path::after{content:"";width:28%;height:28%;border-radius:50%;background:#dce9e6}
.scratch-cell.start::after{background:#bfe2d7}
.scratch-cell.start::before{content:"DÉPART";position:absolute;left:4px;bottom:3px;font-size:.4rem;font-weight:950;color:#347463;letter-spacing:.03em;z-index:2}
.scratch-cell.goal::after{width:48%;height:48%;border-radius:10px;background:#dff1cc;border:2px solid #6fa94f}
.scratch-cell.goal::before{content:attr(data-goal-label);position:absolute;left:3px;top:3px;font-size:.38rem;font-weight:950;color:#4d7839;z-index:2;letter-spacing:.02em}.scratch-goal-icon{position:absolute;z-index:3;font-size:clamp(.85rem,2.2vw,1.25rem);filter:drop-shadow(0 2px 2px #fff)}
.scratch-robot{position:absolute;z-index:5;width:74%;height:74%;display:grid;place-items:center;filter:drop-shadow(0 4px 5px #173b6238);transform-origin:center;transition:transform .28s ease}
.scratch-robot-face{font-size:clamp(1rem,2.8vw,1.55rem);line-height:1}.scratch-direction{position:absolute;left:50%;top:-8px;transform:translateX(-50%);display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#123e69;color:#fff;font-size:.62rem;box-shadow:0 2px 5px #173b6240}.scratch-robot.error .scratch-direction{background:#b84b4b}.scratch-robot.error .scratch-robot-face{filter:grayscale(.5)}
.scratch-code-layout{display:grid;grid-template-columns:145px minmax(0,1fr);gap:.8rem;min-height:350px}
.scratch-palette{display:grid;align-content:start;gap:.55rem}
.scratch-palette-label{font-size:.72rem;color:#71838d;font-weight:850;text-transform:uppercase;letter-spacing:.06em}
.scratch-palette-block,.scratch-code-block{position:relative;border:0;color:#fff;text-align:left;font-weight:850;border-radius:8px;padding:.58rem .72rem;box-shadow:inset 0 -2px 0 rgba(0,0,0,.14);line-height:1.22}
button.scratch-palette-block{cursor:pointer;width:100%}
.scratch-palette-block.motion,.scratch-code-block.motion{background:var(--scratch-motion)}
.scratch-palette-block.control,.scratch-code-block.control{background:var(--scratch-control);color:#4b3300}
.scratch-program{min-height:315px;max-height:430px;padding:.75rem;border:2px dashed #cbd9da;border-radius:13px;background:#fff;overflow-y:auto;overflow-x:hidden}
.scratch-program.dragover,.scratch-repeat-body.dragover{border-color:#419a85;background:#f3fbf8}
.scratch-drophelp{padding:1rem;text-align:center;color:#7a8d96;font-size:.84rem}
.scratch-program-node{margin-bottom:.38rem}
.scratch-code-block{display:flex;align-items:center;justify-content:space-between;gap:.45rem;cursor:grab}
.scratch-code-block.executing{outline:4px solid #ffe36c;transform:translateX(3px)}
.scratch-code-block.program-error{outline:4px solid #e67b7b}
.scratch-block-delete{border:0;background:#ffffff38;color:inherit;width:25px;height:25px;border-radius:50%;font-weight:950;cursor:pointer}
.scratch-repeat{border-radius:12px;background:var(--scratch-control);padding:.42rem;box-shadow:inset 0 -2px 0 rgba(0,0,0,.16)}
.scratch-repeat.running{outline:4px solid #ffe36c}
.scratch-repeat-head{display:flex;align-items:center;gap:.42rem;padding:.2rem .2rem .48rem;color:#553900;font-size:.82rem;font-weight:950;cursor:grab}
.scratch-repeat-head input{width:58px;min-height:34px;padding:.22rem .4rem;border:1px solid #c87e00;background:#fff7dc;color:#4e3a13;text-align:center;font-weight:900}
.scratch-repeat-body{min-height:58px;border:2px dashed #d48700;border-radius:8px;background:#fff7df;padding:.38rem}
.scratch-repeat-help{color:#8b6a25;font-size:.75rem;padding:.3rem}
.scratch-repeat-add{display:flex;gap:.3rem;flex-wrap:wrap;margin-top:.35rem}
.scratch-repeat-add button{border:1px solid #d9a84f;background:#fffaf0;border-radius:7px;padding:.3rem .42rem;color:#684d13;font-size:.72rem;font-weight:800;cursor:pointer}
.scratch-code-actions{display:flex;gap:.45rem;flex-wrap:wrap;margin-top:.65rem}
.scratch-code-actions button{min-height:38px;border-radius:9px;padding:.48rem .72rem;font-weight:850;cursor:pointer}
.scratch-test{border:0;background:#18745b;color:#fff}
.scratch-clear,.scratch-undo{border:1px solid #cfdbdd;background:#fff;color:#345566}
.scratch-constraint{display:flex;gap:.45rem;flex-wrap:wrap;margin:.7rem 0 0}
.scratch-constraint span{padding:.35rem .56rem;border-radius:999px;background:#eef4f4;color:#44616c;font-size:.78rem;font-weight:850}
.scratch-constraint span.required{background:#fff0c9;color:#795400}
.scratch-result{min-height:46px;margin-top:.8rem;padding:.7rem .8rem;border-radius:11px;background:#eef4f4;color:#49636f;line-height:1.4}
.scratch-result.ok{background:#e5f5eb;color:#246447}
.scratch-result.no{background:#faeaea;color:#8a4141}
.scratch-result.hint{background:#fff4d9;color:#775916}
.scratch-answer-area{max-width:840px;margin:0 auto;padding:1rem;border:1px solid #dae5e5;border-radius:17px;background:#fbfdfd}
.scratch-static-program{display:grid;gap:.42rem;justify-items:start;margin:.8rem 0 1rem;padding:.85rem;border-radius:14px;background:#f1f3f5;border:1px solid #d9e0e3;overflow-x:auto}
.scratch-static-block{display:inline-flex;align-items:center;gap:.35rem;min-height:38px;padding:.46rem .7rem;border-radius:8px;color:#fff;font-weight:850;box-shadow:inset 0 -2px 0 rgba(0,0,0,.16);width:max-content;max-width:none;flex-wrap:nowrap;white-space:nowrap}
.scratch-static-block.event{background:var(--scratch-events);color:#543c00}
.scratch-static-block.sensing{background:var(--scratch-sensing)}
.scratch-static-block.variables{background:var(--scratch-variables);color:#522d00}
.scratch-static-block.operators{background:var(--scratch-operators);color:#143d14}
.scratch-static-block.looks{background:var(--scratch-looks)}
.scratch-static-block.control{background:var(--scratch-control);color:#4f3600}
.scratch-static-block.motion{background:var(--scratch-motion)}
.scratch-slot{display:inline-flex;align-items:center;min-height:25px;padding:.12rem .42rem;border-radius:999px;background:#fff;color:#253e4a;font-weight:850;box-shadow:inset 0 0 0 1px #0002}
.scratch-slot.operator{background:#65c766;color:#153b17}
.scratch-variable-pill{display:inline-flex;padding:.14rem .38rem;border-radius:999px;background:#ff8c1a;color:#fff;font-weight:900}
.scratch-qcm{display:grid;gap:.58rem;margin:.8rem 0}
.scratch-qcm label{display:flex;align-items:flex-start;gap:.65rem;padding:.72rem .8rem;border:1px solid #d7e2e2;border-radius:11px;background:#fff;color:#2f5162;font-size:.95rem;font-weight:650;cursor:pointer}
.scratch-qcm label:hover{border-color:#8fb8ae;background:#f7fbfa}
.scratch-qcm input{width:auto;min-height:0;margin-top:.15rem}
.scratch-number-input{max-width:260px;margin:.75rem 0}
.scratch-answer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.65rem;margin:.75rem 0}
.scratch-answer-grid label{font-weight:800;color:#3c5b6a}
.scratch-order-wrap{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin:.8rem 0}
.scratch-order-bank,.scratch-order-program{min-height:180px;padding:.7rem;border:1px solid #d7e1e2;border-radius:12px;background:#fff}
.scratch-order-bank h3,.scratch-order-program h3{font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:#6c7e87;margin:0 0 .55rem}
.scratch-order-bank button{display:block;width:100%;border:0;background:transparent;padding:0;margin:0 0 .4rem;text-align:left;cursor:pointer}
.scratch-order-selected{display:flex;align-items:center;gap:.4rem;margin-bottom:.4rem}
.scratch-order-selected .scratch-static-block{flex:1}
.scratch-order-selected button{width:30px;height:30px;border:1px solid #d5dede;border-radius:50%;background:#fff;color:#6c7b82;cursor:pointer}
.scratch-empty-program{padding:.8rem;color:#7b8b92;text-align:center;font-size:.85rem}
.scratch-form-actions{display:flex;justify-content:space-between;align-items:center;gap:.6rem;flex-wrap:wrap;margin-top:1rem}
.scratch-help-actions{display:flex;gap:.45rem;flex-wrap:wrap}
.scratch-help-actions button,.scratch-submit{min-height:40px;border-radius:9px;padding:.55rem .82rem;font-weight:850;cursor:pointer}
.scratch-hint-button,.scratch-solution-button{border:1px solid #d1dcde;background:#fff;color:#3e5c6b}
.scratch-submit{border:0;background:#18745b;color:#fff}
.scratch-feedback{margin-top:.7rem;padding:.7rem .85rem;border-radius:11px;line-height:1.45}
.scratch-feedback.ok{background:#e5f5eb;color:#246447}
.scratch-feedback.no{background:#faeaea;color:#8a4141}
.scratch-math{font-family:Cambria,"Times New Roman",serif;font-size:1.1em;color:#18384b}.scratch-math-var{font-family:"Segoe Print","Comic Sans MS",cursive;font-style:italic;font-weight:750;color:#153f5e}.scratch-square-note{margin:.75rem 0;padding:.85rem 1rem;border-left:4px solid #2d8d71;border-radius:10px;background:#f2f8f6;color:#183f50;font-family:Cambria,"Times New Roman",serif;font-size:1.12rem;line-height:1.65}.scratch-task-goal{margin:.65rem 0;padding:.72rem .85rem;border-radius:11px;background:#eef7f4;color:#285568}.scratch-static-repeat{display:grid;width:max-content;max-width:100%;padding:.4rem;border-radius:12px;background:var(--scratch-control);box-shadow:inset 0 -2px 0 rgba(0,0,0,.16)}.scratch-static-repeat-head{display:flex;align-items:center;gap:.35rem;padding:.25rem .35rem .45rem;color:#553900;font-weight:900}.scratch-static-repeat-head span{display:inline-grid;place-items:center;min-width:28px;height:25px;padding:0 .3rem;border-radius:999px;background:#fff7dc;border:1px solid #d18b16}.scratch-static-repeat-body{display:grid;gap:.3rem;padding:.38rem;border-radius:8px;background:#fff7df}.scratch-event-fixed{display:inline-flex;align-items:center;gap:.35rem;width:max-content;max-width:100%;margin:0 0 .42rem;padding:.52rem .72rem;border-radius:8px;background:var(--scratch-events);color:#543c00;font-weight:900;box-shadow:inset 0 -2px 0 rgba(0,0,0,.16)}.scratch-green-flag{color:#17864d;font-size:1.05rem}.scratch-event-fixed.solution-event{margin-bottom:.55rem}
.scratch-table-vars{width:100%;border-collapse:collapse;margin:.8rem 0}
.scratch-table-vars th,.scratch-table-vars td{border:1px solid #d7e0e1;padding:.5rem;text-align:center}
.scratch-table-vars th{background:#eef4f3;color:#405c68;font-size:.82rem}
.scratch-table-vars input{min-width:70px;text-align:center}
.scratch-solution-program{margin:.65rem 0;padding:.7rem;background:#f3f5f6;border-radius:12px}
@media(max-width:900px){
  .scratch-workspace{grid-template-columns:1fr}
  .scratch-board{max-width:520px}
  .scratch-order-wrap{grid-template-columns:1fr}
}
@media(max-width:640px){
  .scratch-hero-mark{display:none}
  .scratch-targeted-grid{grid-template-columns:1fr}
  .scratch-code-layout{grid-template-columns:1fr;min-height:0}
  .scratch-palette{grid-template-columns:repeat(2,minmax(0,1fr))}
  .scratch-palette-label{grid-column:1/-1}
  .scratch-program{min-height:250px}
  .scratch-step-head{flex-direction:column}
}
.scratch-choice-content{min-width:0;flex:1;overflow-x:auto}
.scratch-choice-content .scratch-static-program{margin:0}

/* 0.26.1 — RÉPÉTER se remplit uniquement par glisser-déposer, comme dans Scratch. */
.scratch-repeat-add{display:none!important}.scratch-repeat-body{min-height:54px;transition:background .15s,border-color .15s,box-shadow .15s}.scratch-repeat-body.dragover{background:#fff4d5!important;border-color:#d7971d!important;box-shadow:inset 0 0 0 2px #f0b64c55}.scratch-repeat-help{pointer-events:none}

/* 0.26.1 — lisibilité des blocs Scratch statiques et des écritures algébriques. */
.scratch-static-program{max-width:100%;overflow-x:auto}
.scratch-static-block{max-width:100%;flex-wrap:wrap;white-space:normal;line-height:1.28}
.scratch-static-block .scratch-slot{max-width:100%;flex-wrap:wrap;white-space:normal;line-height:1.2}
.scratch-static-block .scratch-slot.operator{gap:.22rem}
.scratch-math-var{font-family:"Cambria Math","STIX Two Math","Times New Roman",serif;font-style:italic;font-weight:500;font-size:1.08em;letter-spacing:.01em}
.scratch-square-note{display:grid;gap:.22rem;overflow-wrap:anywhere}