.learning-visual{margin:0;min-width:0;overflow:hidden;border-radius:9px;background:#18251c}.learning-visual>svg{display:block;width:100%;height:auto}.learning-visual figcaption{font-size:12px;line-height:1.8;color:#c1d2b0;padding:14px 17px;background:#23301e}.learning-exercise{margin:16px 0 22px;min-width:0}.learning-rich-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(235px,1fr);gap:22px;align-items:start}.learning-preview{min-width:0}.learning-picture{position:relative;overflow:hidden;border:1px solid #596d46;border-radius:9px;background:#17271c;isolation:isolate}.learning-picture[data-rich-surface]{touch-action:none;cursor:crosshair}.learning-picture:focus-visible{outline:3px solid var(--lime);outline-offset:4px}.learning-picture #rich-scene>svg{display:block;width:100%;height:auto}.learning-live{font-size:11px;line-height:1.9;margin:12px 2px 0;color:#d3e8bc;font-variant-numeric:tabular-nums}.learning-small{font-size:10px;line-height:1.85;margin:8px 2px 0;color:#a7b799}.learning-controls{background:#222d1f;border:1px solid #405335;border-radius:10px;padding:8px 20px 18px;min-width:0}.learning-control{padding:17px 0 10px}.learning-control+.learning-control{border-top:1px solid #3a4b31}.learning-control>label{display:flex;align-items:baseline;justify-content:space-between;gap:13px;font-size:12px;font-weight:600}.learning-control output{font-size:20px;color:var(--lime);font-weight:700;white-space:nowrap;letter-spacing:-.6px;font-variant-numeric:tabular-nums}.learning-control input[type=range]{width:100%;height:40px;margin:6px 0 2px;accent-color:var(--lime);cursor:pointer;touch-action:pan-y}.learning-control>small{display:block;color:#a9bd99;font-size:10px;line-height:1.8}.learning-control input:disabled{opacity:.65;cursor:default}.learning-button{background:#2d3b25;border:1px solid #596c46;color:#dfebd2;border-radius:7px;padding:10px 13px;min-height:44px;font:inherit;font-size:11px;line-height:1.5;cursor:pointer}.learning-button:hover:not(:disabled){background:#3b502d;border-color:#94b66b}.learning-button[aria-pressed=true]{color:#dcffad;border-color:#a9ce7b;background:#3b5029}.learning-button:disabled{opacity:.55;cursor:default}.learning-focus-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;border-top:1px solid #405234;padding-top:17px;margin-top:6px}.learning-focus-choices>.learning-button{font-size:9px;padding:8px 4px}.learning-toggle{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:19px 0 5px;border-top:1px solid #3d5033;font-size:12px;font-weight:600}.learning-toggle small{font-size:10px;font-weight:400;line-height:1.8;color:#a4ba92;display:block;margin-top:5px}.learning-toggle input{width:23px;height:23px;accent-color:var(--lime);flex-shrink:0}.learning-light-buttons{display:grid;grid-template-columns:1fr;gap:9px;margin:14px 0 18px}.learning-track-actions{display:grid;gap:8px;margin-top:16px}.learning-track-actions>.learning-button:first-child{background:var(--lime);border-color:var(--lime);color:#25321c;font-weight:700}#rich-track-status{font-size:11px;color:#c3d8ad;line-height:1.8;margin-top:13px}.learning-criteria{border:1px solid #455a36;background:#27351f;border-radius:9px;margin-top:20px}.learning-criteria summary{font-size:12px;font-weight:600;min-height:44px;cursor:pointer;padding:13px 16px;color:#d4e8bd}.learning-criteria summary:focus-visible,.learning-crop-result summary:focus-visible{outline:3px solid var(--lime);outline-offset:3px}.learning-criteria ul{margin:0 17px 17px;padding-left:18px;color:#bbcfaa;font-size:11px;line-height:1.9}.learning-criteria li+li{margin-top:5px}.learning-creative-note{font-size:10px;line-height:1.9;color:#a5b894;margin:13px 2px 0}.learning-crop-result{border:1px solid #405335;border-radius:9px;margin:20px 0 0;background:#1c2819}.learning-crop-result summary{min-height:44px;padding:13px 16px;cursor:pointer;color:#cbdcbb;font-size:11px}.learning-crop-result>div{max-width:560px;padding:0 15px 15px;margin:auto}.learning-crop-result svg{display:block;width:100%;height:auto;border:1px solid #6e8855;border-radius:5px}#rich-focus-points{position:absolute;inset:0;pointer-events:none}.learning-focus-point{width:44px;height:44px;position:absolute;transform:translate(-50%,-50%);padding:0;border:1px solid transparent;border-radius:7px;background:transparent;pointer-events:auto;cursor:crosshair}.learning-focus-point:hover:not(:disabled){background:#d6ffa11c;border-color:#e6ffb77d}.learning-focus-point[aria-pressed=true]{border-color:#dcffb6;box-shadow:0 0 0 1px #1b381d75}.learning-focus-point:focus-visible{outline:3px solid #e4ffc5;outline-offset:0}.learning-focus-point:disabled{pointer-events:none}.answer-option .learning-visual{width:100%;border:1px solid #50603f}.answer-option .learning-visual figcaption{font-size:10px;padding:9px 11px}.teaching-visual .learning-visual{width:100%;max-width:900px;margin:auto}@media(max-width:1000px){.learning-rich-layout{grid-template-columns:1fr;gap:18px}.learning-controls{display:grid;grid-template-columns:1fr 1fr;gap:0 22px;padding:8px 22px 19px}.learning-focus-choices,.learning-light-buttons,.learning-track-actions,#rich-track-status{grid-column:1/-1}.learning-light-buttons{grid-template-columns:repeat(3,1fr)}.learning-preview{display:contents}.learning-screen{position:sticky;top:8px;z-index:24;background:#171b17;padding-bottom:8px;border-radius:9px}.learning-preview .learning-small{display:block;margin:0 2px}.learning-control output{font-size:23px}.learning-focus-choices>.learning-button{font-size:11px}.learning-control+.learning-control{border-top:0}.learning-toggle{margin-top:8px}.learning-live{font-size:11px;margin-top:9px}.learning-criteria{margin-top:18px}}@media(max-width:550px){.learning-rich-layout{gap:14px}.learning-controls{display:block;padding:7px 19px 18px}.learning-control{padding-top:18px}.learning-control+.learning-control{border-top:1px solid #3a4b31}.learning-control>label{font-size:13px}.learning-control output{font-size:25px}.learning-control>small{font-size:11px}.learning-toggle{font-size:13px}.learning-toggle small{font-size:11px}.learning-light-buttons{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px}.learning-light-buttons .learning-button{padding:10px 7px;font-size:11px}.learning-live{font-size:10px;line-height:1.8;margin-top:8px}.learning-focus-choices{gap:6px}.learning-focus-choices>.learning-button{font-size:10px;padding:10px 5px}.learning-track-actions>.learning-button{font-size:12px}.learning-criteria summary{font-size:11px;padding:13px 14px}.learning-criteria ul{font-size:11px}.learning-crop-result summary{font-size:10px}.learning-visual figcaption{font-size:11px;padding:12px 13px}.learning-creative-note{font-size:10px}.learning-screen{top:4px}.learning-crop-result>div{padding:0 10px 10px}}@media(max-width:1000px) and (max-height:600px){.learning-screen{position:relative;top:auto}}@media(prefers-reduced-motion:reduce){.learning-exercise *{scroll-behavior:auto!important}}.reduce-motion .learning-exercise *{scroll-behavior:auto!important}

@media(max-width:1000px){.learning-live,.learning-small,.learning-criteria summary,.learning-criteria ul,.learning-creative-note,.learning-visual figcaption,.learning-control>small,.learning-toggle small,.learning-crop-result summary,#rich-track-status{font-size:12px}.learning-control>label,.learning-toggle{font-size:14px}.learning-control input[type=range]{height:44px}.learning-focus-choices>.learning-button,.learning-light-buttons .learning-button{font-size:12px}.learning-rich-layout{gap:14px}.answer-option .learning-visual figcaption{font-size:12px}}

/* Keep instructional text and native range targets readable at every width. */
.learning-control input[type=range]{height:44px}
.learning-live,.learning-small,.learning-control>small,.learning-toggle small,.learning-criteria ul,.learning-creative-note,.learning-crop-result summary,#rich-track-status,.answer-option .learning-visual figcaption{font-size:12px}
.learning-control>label,.learning-toggle{font-size:14px}
.learning-button,.learning-focus-choices>.learning-button{font-size:12px}
#rich-track-status:focus{outline:2px solid var(--lime);outline-offset:4px;border-radius:3px}

/* Conceptual diagrams keep their model limits readable outside the scaled SVG. */
.advanced-learning-visual figcaption,.answer-option .advanced-learning-visual figcaption{font-size:14px;line-height:1.65}
