/* Phase 3 teaching-scene system */
.phase3-scene .scene-main{overflow:hidden}.phase3-stage-layout{height:100%;min-height:0;display:grid;grid-template-columns:minmax(340px,.76fr) minmax(520px,1.24fr);gap:16px}.phase3-teach-card,.phase3-visual-card{min-width:0;min-height:0;border:1px solid var(--line);border-radius:17px;background:#fff}.phase3-teach-card{padding:18px;display:flex;flex-direction:column;gap:12px;background:linear-gradient(180deg,#fff,#fcfdff);overflow:auto}.phase3-visual-card{position:relative;padding:10px;display:flex;flex-direction:column;overflow:hidden;background:linear-gradient(180deg,#fff,#fbfdff)}.phase3-visual-card>.math-visual,.phase3-visual-card>.connected-story-wrap,.phase3-visual-card>.quadratic-story,.phase3-visual-card>.integer-story,.phase3-visual-card>.toolkit-visual{flex:1;min-height:0;width:100%}.phase3-card-kicker,.phase3-visual-caption span{text-transform:uppercase;letter-spacing:.11em;font-size:9px;font-weight:900;color:var(--teal)}.phase3-teach-card h3{font-size:20px;line-height:1.35;margin:0;color:var(--ink)}.phase3-question{font-size:22px!important}.phase3-visual-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:1px 4px 8px}.phase3-visual-caption strong{font-size:11px;color:#40566f;font-weight:750;text-align:right}.progressive-stack,.solve-stack{display:grid;gap:8px;min-height:0}.progressive-step,.solve-step{display:grid;grid-template-columns:32px minmax(0,1fr);gap:10px;padding:10px;border:1px solid #e2e8f1;border-radius:12px;background:#f9fbfd;opacity:.42;filter:saturate(.45);transform:translateY(2px);transition:opacity .18s ease,border-color .18s ease,background .18s ease,transform .18s ease}.progressive-step p,.solve-step p{display:none;margin:4px 0 0;font-size:11px;line-height:1.45;color:#455c78}.progressive-step strong,.solve-step strong{font-size:13px;display:block}.progressive-step.is-revealed,.solve-step.is-revealed{opacity:1;filter:none;background:#fff;transform:none}.progressive-step.is-revealed p,.solve-step.is-revealed p{display:block}.progressive-step.is-current,.solve-step.is-current{border-color:#c9b9ff;background:linear-gradient(90deg,#fff,#faf7ff);box-shadow:inset 3px 0 0 var(--purple)}.progressive-step-number,.solve-step-number{width:28px;height:28px;border-radius:9px;background:var(--purple-soft);display:grid;place-items:center;color:var(--purple);font-size:12px;font-weight:900}.solve-step-label{display:block;text-transform:uppercase;letter-spacing:.08em;font-size:8px;font-weight:900;color:var(--teal);margin-bottom:2px}.solve-intro{margin:-4px 0 2px;color:#5b6d84;font-size:12px;line-height:1.45}.phase3-action-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto}.step-action{border:1px solid var(--line-strong);border-radius:10px;background:#fff;color:#213854;padding:9px 12px;font-size:11px;font-weight:850;cursor:pointer}.step-action:hover{border-color:#b9a3ff;background:#faf8ff}.step-action.primary{background:linear-gradient(135deg,var(--purple),#6336e6);color:#fff;border-color:transparent;box-shadow:0 6px 14px rgba(109,63,242,.18)}.step-action:disabled{opacity:.55;cursor:default;box-shadow:none}.support-inline{margin-top:2px;align-self:flex-start}.phase3-result-strip{border:1px solid #d8cfff;background:linear-gradient(90deg,#faf8ff,#f5f1ff);border-radius:12px;padding:9px 11px;display:flex;align-items:center;justify-content:space-between;gap:10px}.phase3-result-strip span{text-transform:uppercase;letter-spacing:.08em;font-size:8px;font-weight:900;color:#6d5aa0}.phase3-result-strip strong{font-family:Georgia,"Times New Roman",serif;font-size:17px;color:var(--purple)}.phase3-feedback{display:grid;gap:3px;margin-top:2px}.phase3-feedback strong{font-size:12px;color:#304760}.phase3-feedback span{font-size:11px;line-height:1.45;color:#52677f}.phase3-feedback.is-correct{background:#effaf6;border:1px solid #bde6d7;color:#245d4f}.phase3-feedback.is-wrong{background:#fff6f6;border:1px solid #f0c6ca;color:#7b3940}.phase3-feedback.is-correct strong{color:#226a58}.phase3-feedback.is-wrong strong{color:#963e49}.phase3-choice{display:grid!important;grid-template-columns:28px minmax(0,1fr);align-items:center;gap:8px;min-height:46px;padding:8px 10px!important}.choice-letter{width:25px;height:25px;border-radius:8px;background:#f2f5fa;display:grid;place-items:center;font-size:10px;font-weight:900;color:#5b6c83}.phase3-choice.correct .choice-letter{background:#d6f2e8;color:#19604e}.phase3-choice.wrong .choice-letter{background:#fde1e4;color:#8f3742}.challenge-card{position:relative}.challenge-level{align-self:flex-start;border-radius:999px;background:#f0ebff;color:#6744ca;padding:5px 8px;font-size:9px;font-weight:850}.challenge-visual{border-color:#ddd4f6}.solve-result{background:linear-gradient(90deg,#eefaf7,#f7fffd);border-color:#c9e7df}.solve-result strong{color:var(--teal)}.phase3-focus-board{display:grid;grid-template-columns:1fr 1fr;gap:10px}.phase3-focus-card{border:1px solid var(--line);border-radius:12px;background:#fff;padding:10px}.phase3-focus-card span{display:block;text-transform:uppercase;letter-spacing:.08em;font-size:8px;font-weight:900;color:#77869b}.phase3-focus-card strong{display:block;margin-top:4px;font-family:Georgia,"Times New Roman",serif;font-size:18px;color:#1f3553}.phase3-stage-note{border:1px solid #d9ebe6;background:#f4fbf9;border-radius:12px;padding:10px 11px;font-size:11px;line-height:1.48;color:#335c53}.phase3-stage-note strong{color:#217464}.phase3-practice-layout .choice-grid,.phase3-challenge-layout .choice-grid{margin-top:2px}.phase3-example-layout .phase3-visual-card .math-visual,.phase3-practice-layout .phase3-visual-card .math-visual,.phase3-challenge-layout .phase3-visual-card .math-visual,.phase3-solve-layout .phase3-visual-card .math-visual{min-height:0}.phase3-teach-card::-webkit-scrollbar{width:6px}.phase3-teach-card::-webkit-scrollbar-thumb{background:#d6ddea;border-radius:999px}

@media (max-width:1200px) and (min-width:1101px){.phase3-stage-layout{grid-template-columns:minmax(300px,.72fr) minmax(450px,1.28fr);gap:12px}.phase3-teach-card{padding:14px;gap:9px}.phase3-teach-card h3{font-size:17px}.progressive-step,.solve-step{padding:8px;gap:8px}.phase3-visual-caption strong{font-size:10px}}
@media (max-width:1100px){.phase3-scene .scene-main{overflow:visible}.phase3-stage-layout{height:auto;grid-template-columns:1fr}.phase3-teach-card,.phase3-visual-card{min-height:0}.phase3-visual-card{min-height:430px}.phase3-visual-card>.connected-story-wrap,.phase3-visual-card>.integer-story,.phase3-visual-card>.quadratic-story,.phase3-visual-card>.toolkit-visual{min-height:410px}.phase3-teach-card{overflow:visible}.phase3-action-row{margin-top:6px}}
@media (max-width:640px){.phase3-stage-layout{gap:10px}.phase3-teach-card{padding:14px}.phase3-teach-card h3,.phase3-question{font-size:19px!important}.phase3-visual-card{padding:7px;min-height:340px}.phase3-visual-card>.connected-story-wrap,.phase3-visual-card>.integer-story,.phase3-visual-card>.quadratic-story,.phase3-visual-card>.toolkit-visual{min-height:320px}.phase3-visual-caption{align-items:flex-start;flex-direction:column;gap:2px}.phase3-visual-caption strong{text-align:left}.phase3-focus-board{grid-template-columns:1fr}.phase3-action-row{display:grid;grid-template-columns:1fr 1fr}.step-action{width:100%}.phase3-result-strip{align-items:flex-start;flex-direction:column}.phase3-choice{min-height:44px}}
@media (max-height:820px) and (min-width:1101px){.phase3-teach-card{padding:12px;gap:7px}.phase3-teach-card h3{font-size:16px}.progressive-stack,.solve-stack{gap:6px}.progressive-step,.solve-step{padding:7px}.progressive-step p,.solve-step p{font-size:10px;line-height:1.35}.phase3-action-row{margin-top:2px}.step-action{padding:7px 10px}.phase3-result-strip{padding:7px 9px}.phase3-visual-caption{padding-bottom:4px}}
@media (prefers-reduced-motion:reduce){.progressive-step,.solve-step{transition:none!important}}

.phase3-result-strip[hidden]{display:none!important}

/* Phase 5: example-bank learning, notebook worked examples, and dual-view Solve With Me */
.phase5-learn-bank{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 11px;border:1px solid #d9d0ff;border-radius:13px;background:linear-gradient(135deg,#fbf9ff,#f5f8ff)}
.phase5-learn-bank>div{min-width:0}.phase5-learn-bank strong{display:block;font-size:12px;line-height:1.4;color:#263b59;margin-top:2px}.phase5-learn-bank small{display:block;margin-top:3px;font-size:9px;color:#687b94}.phase5-bank-kicker{display:block;text-transform:uppercase;letter-spacing:.09em;font-size:8px;font-weight:900;color:var(--purple)}
.bank-random,.bank-nav{border:1px solid #cfc2ff;background:#fff;color:#5f3de0;border-radius:10px;font-weight:850;cursor:pointer}.bank-random{padding:7px 10px;font-size:9px;white-space:nowrap}.bank-nav{width:30px;height:30px;display:grid;place-items:center;font-size:14px}.bank-random:hover,.bank-nav:hover{background:#f6f2ff;border-color:#ab95ff}.bank-random:focus-visible,.bank-nav:focus-visible{outline:3px solid rgba(105,63,242,.2);outline-offset:2px}

.phase5-worked-grid,.phase5-solve-grid{height:100%;min-height:0;display:grid;grid-template-columns:minmax(250px,.72fr) minmax(350px,1.05fr) minmax(265px,.78fr);gap:12px}.worked-method-card,.solve-card{overflow:auto}.worked-visual-card,.solve-visual-card{min-width:0}.worked-bank-toolbar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:7px;align-items:center;padding:7px;border:1px solid var(--line);background:#fafbfe;border-radius:11px}.worked-bank-toolbar>span{text-align:center;font-size:9px;color:#687b94}.worked-bank-toolbar>span strong{font-size:10px;color:#293f5d}.worked-bank-toolbar .bank-random{grid-column:1/-1;width:100%}
.worked-static-stack{display:grid;gap:7px}.worked-static-step{display:grid;grid-template-columns:29px minmax(0,1fr);gap:8px;padding:8px 9px;border:1px solid #e1e7f0;border-radius:11px;background:#fff}.worked-static-step strong{display:block;font-size:11px;color:#283e5c}.worked-static-step p{margin:3px 0 0;font-size:9.5px;line-height:1.38;color:#51677f}.worked-static-step.is-answer{border-color:#c9e7df;background:#f4fbf9}.worked-static-step.is-answer .progressive-step-number{background:#dff5ee;color:#18715d}

.worked-notebook{min-width:0;min-height:0;border:1px solid #d8dfeb;border-radius:17px;background:#fff;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 8px 24px rgba(35,55,82,.05)}.notebook-top{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:9px 12px;border-bottom:1px solid #e4e9f1;background:linear-gradient(180deg,#fff,#fafbfe)}.notebook-top span{text-transform:uppercase;letter-spacing:.09em;font-size:8px;font-weight:900;color:var(--purple)}.notebook-top small{font-size:8px;color:#78889c}.notebook-paper{position:relative;flex:1;min-height:0;overflow:auto;padding:17px 14px 16px 34px;background-color:#fff;background-image:linear-gradient(90deg,transparent 0,transparent 24px,rgba(233,104,118,.34) 24px,rgba(233,104,118,.34) 25px,transparent 25px),repeating-linear-gradient(180deg,transparent 0,transparent 23px,rgba(80,145,210,.16) 23px,rgba(80,145,210,.16) 24px)}.notebook-question{font-family:"Segoe Print","Bradley Hand","Comic Sans MS",cursive;font-size:11px;line-height:1.45;color:#5b3bd2;margin-bottom:10px;font-weight:700}.notebook-line{display:grid;grid-template-columns:21px minmax(0,1fr);gap:7px;margin:8px 0 10px;font-family:"Segoe Print","Bradley Hand","Comic Sans MS",cursive;color:#4932bd}.notebook-step-number{width:18px;height:18px;border-radius:50%;background:#6b3ff0;color:#fff;display:grid;place-items:center;font-family:Arial,sans-serif;font-size:8px;font-weight:900;margin-top:1px}.notebook-line strong{display:block;font-size:10px;font-weight:700}.notebook-line p{margin:2px 0 0;font-size:10px;line-height:1.5}.notebook-answer{margin-top:10px;border:1px solid #a990ff;border-radius:10px;padding:8px 9px;background:rgba(248,245,255,.84);font-family:"Segoe Print","Bradley Hand","Comic Sans MS",cursive}.notebook-answer span{display:block;text-transform:uppercase;letter-spacing:.07em;font-family:Arial,sans-serif;font-size:7px;font-weight:900;color:#7a669f}.notebook-answer strong{display:block;margin-top:2px;font-size:13px;color:#5b35df}.notebook-paper::-webkit-scrollbar{width:5px}.notebook-paper::-webkit-scrollbar-thumb{background:#d5dcea;border-radius:999px}

.phase5-solve-grid .solve-stack{gap:6px}.phase5-solve-grid .solve-step{padding:8px}.solve-full-notebook .notebook-paper{background-color:#fffdfb}.solve-full-notebook .notebook-line{color:#513bc0}

@media (max-width:1280px) and (min-width:1101px){.phase5-worked-grid,.phase5-solve-grid{grid-template-columns:minmax(220px,.68fr) minmax(315px,1fr) minmax(230px,.72fr);gap:9px}.worked-method-card,.solve-card{padding:10px;gap:7px}.worked-static-step{padding:6px 7px}.worked-static-step p{font-size:9px}.notebook-paper{padding:13px 10px 12px 30px}.notebook-line{margin:6px 0 8px}.notebook-line p{font-size:9px}.notebook-question{font-size:10px}.phase5-learn-bank{padding:8px}}
@media (max-width:1100px){.phase5-worked-grid,.phase5-solve-grid{height:auto;grid-template-columns:1fr}.worked-notebook{min-height:390px}.phase5-worked-grid .phase3-visual-card,.phase5-solve-grid .phase3-visual-card{min-height:420px}}
@media (max-width:640px){.phase5-learn-bank{grid-template-columns:1fr}.phase5-learn-bank .bank-random{width:100%}.worked-bank-toolbar{grid-template-columns:auto 1fr auto}.worked-notebook{min-height:360px}.notebook-paper{padding-left:31px}.notebook-question{font-size:11px}.notebook-line p{font-size:10px}}
@media (max-height:820px) and (min-width:1101px){.worked-static-stack{gap:5px}.worked-static-step{padding:5px 7px}.worked-static-step p{font-size:8.5px;line-height:1.28}.worked-method-card .phase3-stage-note{font-size:9px;padding:7px}.notebook-top{padding:6px 9px}.notebook-paper{padding-top:10px;padding-bottom:10px}.notebook-line{margin:4px 0 6px}.notebook-line p{font-size:8.7px;line-height:1.35}.notebook-answer{padding:6px}.phase5-learn-bank strong{font-size:10px}.phase5-learn-bank small{font-size:8px}}

/* Phase 11: active practice before recognition */
.active-workpad{display:grid;gap:7px;padding:10px;border:1px solid var(--line);border-radius:13px;background:linear-gradient(180deg,#fff,#fafcff)}
.active-workpad-head,.active-check-label{display:flex;align-items:center;justify-content:space-between;gap:10px}.active-workpad-head span,.active-check-label span{font-size:8px;font-weight:900;letter-spacing:.09em;text-transform:uppercase;color:var(--purple)}.active-workpad-head strong,.active-check-label strong{font-size:9px;line-height:1.35;color:#52677f;text-align:right}
.active-work-label{font-size:9px;font-weight:850;color:#314a68}.active-work-input,.active-transfer-part textarea{width:100%;min-height:62px;resize:vertical;border:1px solid var(--line-strong);border-radius:10px;background:#fff;padding:9px 10px;font:inherit;font-size:11px;line-height:1.4;color:var(--ink);box-sizing:border-box}.active-work-input:focus,.active-transfer-part textarea:focus{outline:3px solid rgba(109,63,242,.13);border-color:#b8a6f5}
.active-work-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.active-work-status{font-size:8.5px;line-height:1.35;color:#6b7d93;flex:1;min-width:150px}.active-model{display:grid;gap:3px;border:1px solid #d9d0ff;border-radius:10px;background:#f8f6ff;padding:8px 9px}.active-model[hidden]{display:none!important}.active-model>span{font-size:7.5px;font-weight:900;letter-spacing:.09em;text-transform:uppercase;color:var(--purple)}.active-model>strong{font-family:Georgia,"Times New Roman",serif;font-size:14px;color:#4631a9}.active-model p,.active-model small{margin:0;font-size:9px;line-height:1.38;color:#52677f}.active-check-label{margin-top:1px;padding-top:2px}.active-transfer-part{display:grid;gap:4px;border-top:1px solid #e6eaf1;padding-top:7px}.active-transfer-part:first-of-type{border-top:0;padding-top:0}.active-transfer-part>span{font-size:8px;font-weight:900;color:var(--teal);text-transform:uppercase;letter-spacing:.08em}.active-transfer-part>strong{font-size:10px;line-height:1.35;color:#314a68}.challenge-mode{align-self:flex-start;border:1px solid #d8e9e4;border-radius:999px;background:#f4fbf9;color:#287062;padding:4px 7px;font-size:8px;font-weight:850;margin-top:-5px}.challenge-workpad{background:linear-gradient(180deg,#fff,#fbfaff)}
@media (max-height:820px) and (min-width:1101px){.active-workpad{padding:7px;gap:5px}.active-work-input,.active-transfer-part textarea{min-height:46px;padding:6px 8px;font-size:9.5px}.active-model{padding:6px 7px}.active-model>strong{font-size:12px}.active-workpad-head strong,.active-check-label strong{font-size:8px}.active-work-status{font-size:7.5px}.challenge-mode{padding:3px 6px}}
@media (max-width:640px){.active-workpad-head,.active-check-label{align-items:flex-start;flex-direction:column;gap:2px}.active-workpad-head strong,.active-check-label strong{text-align:left}.active-work-actions{display:grid;grid-template-columns:1fr}.active-work-status{min-width:0}.active-work-input,.active-transfer-part textarea{min-height:76px}}
