/* Classroom layout follows the approved hand-in-hand sample. */
.classroom-page .scene .point-label{font-family:Georgia,'Times New Roman',serif;font-size:32px;font-style:italic;stroke-width:3px}
.classroom-page{min-height:540px}.classroom{max-width:1920px;padding:0 28px}.classroom-page .pp-header{padding:0 28px;min-height:64px}
.lesson-selectors{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--line);flex-shrink:0}
.lesson-selectors label{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:14px;min-width:0;white-space:nowrap}
.lesson-selectors select{font:inherit;color:var(--ink);background:#fff;border:1px solid #cbd6e7;border-radius:6px;min-height:46px;padding:8px 34px 8px 13px;min-width:100px;max-width:100%;text-overflow:ellipsis;cursor:pointer}
.lesson-selectors .problem-picker{flex:1.05}.lesson-selectors .subquestion-picker{flex:.95}.lesson-selectors .knowledge-picker{flex:1.15}.lesson-selectors select{width:100%}select:focus-visible{outline:3px solid #e9a431;outline-offset:3px}
.lecture-bar{padding:9px 0;gap:10px;font-size:12px;min-height:46px;color:var(--muted)}.lecture-bar #lecture-title{margin-right:auto}.lecture-bar #offline-save{min-height:44px;padding:6px 9px;background:transparent;border-color:transparent;color:var(--muted);font-size:12px}
.class-stage{grid-template-columns:minmax(310px,40%) minmax(0,1fr);gap:28px}
.teaching-panel{padding:3px 0 0;overflow:hidden;min-width:0;display:flex;flex-direction:column}.question-context{display:flex;flex-direction:column;flex:0 1 auto;max-height:57%;overflow:hidden;padding:0 9px 12px 0}.question-context .item-heading{flex-shrink:0}.question-stem{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;flex:1 1 auto}.current-question{min-height:1.7em;max-height:25svh;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;flex:0 1 auto}
.item-heading{justify-content:flex-start;gap:12px;margin:0 0 12px}.item-heading>span:first-child{font-size:17px}.item-heading>span:last-child{font-family:inherit;font-size:12px}
.question-stem{font-size:clamp(18px,1.65vw,26px);line-height:1.85;overflow-wrap:anywhere}.question-stem p{margin:0 0 8px}.question-stem:empty{display:none}.current-question{font-size:clamp(20px,1.85vw,30px);line-height:1.7;font-weight:620;margin:14px 0 2px;overflow-wrap:anywhere}.current-question p{margin:0 0 8px}.current-question:empty{display:none}
.answer-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-top:1px solid var(--line);font-size:12px;color:var(--muted);flex-shrink:0}.answer-scroll{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;flex:1;min-height:75px;padding:0 9px 20px 0}
.teaching-body{font-size:clamp(17px,1.4vw,23px);line-height:1.8;overflow-wrap:anywhere}.teaching-body p{margin:0 0 10px}.answer-placeholder{color:#8a98ad;font-size:.93em;padding-top:13px}.proof-row{display:grid;grid-template-columns:24px minmax(0,1fr);gap:9px;padding:10px 0 11px;border-bottom:1px solid #e5ebf3}.proof-row:last-child{border:0}.proof-number{font-size:12px;line-height:25px;color:var(--muted);font-variant-numeric:tabular-nums}.proof-row.current-row .proof-number{color:var(--blue)}
.proof-row .proof-block{border:0;padding:0;margin:0 0 10px}.proof-row .conclusion{font-size:1em;margin:8px 0;line-height:1.8}.proof-row :last-child{margin-bottom:0}.proof-row li{margin:5px 0}.proof-row ul,.proof-row ol{margin:8px 0;padding-left:1.2em}
.visual-panel{min-width:0}.visual-heading{padding:17px 20px 7px;font-size:13px}.visual-heading #item-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.visual-heading #visual-tag{white-space:normal;text-align:right;font-size:11px;max-width:55%}.scene{padding:5px 14px;min-height:0;position:relative}.scene>svg{overflow:hidden}.scene[data-draggable=true]{touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none}.scene[data-draggable=true] *{touch-action:none;-webkit-user-drag:none}.scene.is-dragging{cursor:grabbing}.scene svg text{user-select:none}
.figure-caption{padding:6px 20px 14px;color:var(--muted);font-size:13px;line-height:1.65;flex-shrink:0}.figure-caption p{margin:0}.figure-caption #scene-note{display:block;margin-top:6px;color:var(--orange)}
.motion-controls{padding:11px 16px}.event-mark{min-height:44px}.motion-row{gap:9px}.motion-row input[type=range]{height:44px;touch-action:none}.motion-row input[type=number]{flex:0 0 84px;width:84px;min-width:0;min-height:44px;border:1px solid #ced9e9;border-radius:5px;background:white;color:var(--ink);padding:8px;font-variant-numeric:tabular-nums;text-align:center}.motion-row output{min-width:0;max-width:35px;font-size:12px}.drag-hint{font-size:11px;color:var(--muted);text-align:center;margin:5px 0 0}
.class-footer{margin-top:18px;min-height:78px}.navigation-button{min-width:128px;min-height:52px;font-size:16px}.classroom .soft-button,.classroom .icon-control{min-height:44px}.whole-progress{width:230px;line-height:1.6}.toc-group-title{font-size:15px;color:var(--muted);font-weight:550;margin:24px 0 8px}.toc-item{min-height:54px}.toc-item>span{font-size:13px}.toc-item strong{font-weight:500}.toc-item small{grid-column:2}.question-context table{font-size:.8em;width:100%;border-collapse:collapse}.question-context td,.question-context th{border:1px solid var(--line);padding:5px}.question-context ul,.question-context ol{padding-left:1.3em}
@media(min-width:1550px){.class-stage{grid-template-columns:minmax(450px,40%) minmax(0,1fr);gap:35px}}
@media(max-width:1100px){.classroom{padding:0 20px}.classroom-page .pp-header{padding:0 20px}.lesson-selectors{gap:13px}.lesson-selectors label{gap:7px;font-size:12px}.lesson-selectors select{padding-left:10px;min-width:70px}.class-stage{grid-template-columns:minmax(280px,40%) minmax(0,1fr);gap:20px}.question-stem{font-size:18px}.current-question{font-size:22px}.teaching-body{font-size:18px}.visual-heading{padding:14px 13px 6px}.figure-caption{padding:5px 13px 12px}.motion-controls{padding:9px}.motion-row input[type=number]{flex-basis:72px;width:72px}.event-mark{font-size:11px}.whole-progress{width:175px}}
@media(min-width:700px) and (max-width:950px) and (orientation:portrait){.classroom-page{height:100svh;min-height:600px}.class-stage{display:grid;grid-template-columns:minmax(265px,41%) minmax(0,1fr);flex:1}.teaching-panel{overflow:hidden}.scene{height:auto;flex:1;min-height:0}.class-footer{position:static}.whole-progress{display:block}.lesson-actions{width:auto}.navigation-button{min-width:90px}.lesson-selectors label{display:flex;flex-direction:column;align-items:stretch;gap:6px}.lecture-bar{font-size:11px}.lecture-bar #book-name{max-width:34%}.library-link{display:none}.motion-row label{display:none}.motion-row{flex-wrap:wrap}.motion-row input[type=range]{flex-basis:100%;order:5}.drag-hint{display:none}.question-context{max-height:58%}.question-stem{font-size:17px}.current-question{font-size:20px}.teaching-body{font-size:17px}.pp-brand>span{display:none}}
@media(max-width:699px){.classroom-page{height:auto;min-height:100svh}.classroom{padding:0 15px}.classroom-page .pp-header{padding:0 15px;min-height:61px}.library-link,.pp-brand>span{display:none}.header-tools .icon-control{min-width:44px}.lesson-selectors{gap:8px;padding:11px 0;align-items:stretch;flex-wrap:wrap}.lesson-selectors label{flex:1 1 calc(50% - 5px)!important;max-width:calc(50% - 5px);flex-direction:column;align-items:stretch;gap:5px;font-size:11px}.lesson-selectors select{padding:8px 18px 8px 7px;font-size:12px;min-width:0;width:100%}.lecture-bar{flex-wrap:wrap;gap:3px 8px;padding:5px 0}.lecture-bar #book-name{font-size:10px}.lecture-bar #lecture-title{font-size:11px}.lecture-bar .source-location{display:none}.lecture-bar #offline-save{margin-left:auto;font-size:10px}.class-stage{display:flex;flex-direction:column;gap:15px}.teaching-panel{padding:0;overflow:visible}.question-context{max-height:none;overflow:visible;padding-right:0}.question-stem{font-size:18px;line-height:1.85}.current-question{font-size:21px;margin-top:10px}.item-heading{margin-bottom:8px}.answer-scroll{flex:none;max-height:270px;min-height:75px;padding-bottom:8px}.teaching-body{font-size:17px}.proof-row{padding:8px 0}.scene{height:335px;min-height:290px;flex:auto}.visual-panel{min-height:365px}.figure-caption{font-size:12px}.class-footer{position:sticky;bottom:0;z-index:4;background:rgba(245,247,251,.98);min-height:76px;margin-top:15px}.whole-progress{display:none}.lesson-actions{width:100%;gap:6px}.navigation-button{min-width:0;flex:1;font-size:14px}.lesson-actions>button:first-child{font-size:11px;margin:0;padding:8px}.motion-row label{display:none}.source-dialog .dialog-top h2{font-size:19px}}
@media(min-width:700px) and (max-height:740px){.classroom-page .pp-header{min-height:54px}.lesson-selectors{padding:9px 0}.lecture-bar{padding:2px 0;min-height:44px}.class-footer{margin-top:11px;min-height:70px}.question-stem{font-size:17px}.current-question{font-size:21px}.answer-heading{padding:8px 0}.question-context{max-height:60%}.figure-caption{padding-bottom:8px}.motion-controls{padding:7px 9px}.drag-hint{display:none}.teaching-body{font-size:17px}}
@media(prefers-reduced-motion:reduce){.whole-progress .progress-track>span{transition:none}}


.answer-blank{display:inline-block;min-width:4.5em;height:1.15em;border-bottom:2px solid currentColor;margin:0 .18em;vertical-align:baseline}
.choice-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:12px 0 0;flex-shrink:0}
.choice-options.long-options{grid-template-columns:repeat(2,minmax(0,1fr))}
.choice-option{display:grid;grid-template-columns:1.1em minmax(0,1fr);column-gap:9px;align-items:start;min-height:70px;padding:12px 14px 7px;border:1.5px solid #bfcbdc;border-radius:5px;font-size:clamp(18px,1.5vw,23px);line-height:1.5;overflow-wrap:anywhere}
.option-letter{font-family:Georgia,serif}.option-content{min-width:0}.option-content p{margin:0}.option-content svg{display:block;width:100%;height:auto;max-height:150px}
.option-status{grid-column:2;font-size:12px;min-height:1.6em;font-weight:600}
.image-options .option-content{grid-column:1/-1}.image-options .option-letter{position:absolute;left:12px;top:10px}.image-options .choice-option{position:relative}.image-options .option-status{grid-column:1/-1}
.choice-option.is-discussing{color:#b82935;border-color:#b82935;border-width:2px;padding:11.5px 13.5px 6.5px}
.choice-option.is-answer{color:#226a50;border-color:#226a50;border-width:2px;padding:11.5px 13.5px 6.5px}

/* 2026-09-16: approved three-type template, preserving original artwork. */
.classroom-page[data-template]{min-height:0;height:100svh;background:#fff}
[data-template] .pp-header{min-height:56px;padding-block:4px}
[data-template] .pp-avatar{width:44px;height:44px}
[data-template] .classroom{padding-inline:24px}
[data-template] .lesson-selectors{padding:8px 0;gap:18px}
[data-template] .lecture-bar{display:none}
[data-template] .pp-brand>span{font-size:12px;color:var(--muted)}
[data-template] #toc-dialog #offline-save{margin-bottom:12px;min-height:44px}
[data-template] .lecture-bar #offline-save{min-height:44px}
[data-template] .class-stage{gap:22px;grid-template-columns:minmax(0,43%) minmax(0,1fr)}
[data-template] .question-context{max-height:none;overflow:visible;flex:0 0 auto;padding:0 8px 10px 0;scrollbar-width:thin}
[data-template] .question-stem{font-size:clamp(17px,1.42vw,21px);line-height:1.6;overflow:visible;flex:none}
[data-template] .current-question{font-size:clamp(18px,1.5vw,22px);line-height:1.55;margin:10px 0 0;max-height:none;overflow:visible;flex:none;min-height:0}
[data-template] .question-context .item-heading{margin-bottom:7px}
[data-template] .item-heading>span:first-child{font-size:14px}
[data-template] .answer-heading{padding:8px 0;min-height:32px}
[data-template] .answer-scroll{padding-bottom:10px;min-height:70px}
[data-template] .proof-row{font-size:17px;line-height:1.55;color:#53667e;padding:7px 0;grid-template-columns:22px minmax(0,1fr);gap:7px}
[data-template] .proof-row.current-row{font-size:clamp(21px,1.75vw,26px);color:#192d49;line-height:1.6}
[data-template] .proof-row.current-row .proof-number{font-weight:750;color:var(--blue)}
[data-template] .proof-row .proof-block,[data-template] .proof-row p{margin:0 0 5px}
[data-template] .proof-row .conclusion{font-size:1em;line-height:inherit;margin:5px 0}
[data-template] .proof-row[hidden],[data-template] .proof-pages[hidden],[data-template] .case-controls[hidden]{display:none!important}
[data-template] .proof-pages{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);padding:0 0 5px;flex-shrink:0}
[data-template] #proof-range{margin-right:auto}
[data-template] .proof-pages button{font-size:12px;padding:6px 10px;white-space:nowrap;min-height:44px}
[data-template] .case-controls{display:flex;gap:6px;flex-wrap:wrap;padding:6px 12px;flex-shrink:0}
[data-template] .case-controls button{min-height:44px;font-size:13px;flex:1;padding:6px 9px}
[data-template] .visual-heading{padding:11px 14px 4px}
[data-template] .figure-caption{padding:5px 14px 8px;line-height:1.5}
[data-template] .figure-caption:has(#caption:empty):has(#scene-note[hidden]){display:none}
[data-template] .class-footer{min-height:66px;margin-top:10px;padding:8px 0;position:static;gap:12px}
[data-template] .navigation-button{min-height:48px}
[data-template] #conclusion-button{border-color:#aebdd2;color:var(--blue);background:#fff}
[data-template] #conclusion-button:disabled{color:var(--muted);border-color:var(--line);background:#f7f9fc}
[data-template] .motion-controls{padding:7px 10px}
[data-template] .motion-controls:not([hidden]){display:flex;align-items:center;gap:8px;flex-wrap:wrap}
[data-template] .motion-controls .event-marks{margin:0}
[data-template] .motion-controls .motion-row{flex:1;min-width:260px}
[data-template] .motion-controls .drag-hint{display:none}
[data-template] .motion-row{gap:6px}
[data-template] .event-marks{gap:4px;margin-bottom:4px}
[data-template] .event-mark{min-height:44px}
[data-template] .choice-option{border-radius:8px;min-height:76px;font-size:21px}
[data-template] .image-options .option-content{padding-top:20px}
[data-template] .image-options .option-content svg{height:90px;max-height:none;width:100%;object-fit:contain}

.toc-dialog .dialog-top{margin-bottom:8px}.toc-dialog .dialog-top .eyebrow{display:none}.toc-dialog .dialog-top h2{font-size:20px;margin:5px 0}.toc-dialog .toc-item{min-height:68px;padding:9px 12px;margin:7px 0;grid-template-columns:90px minmax(0,1fr)}.toc-dialog .toc-item strong{font-size:17px}.toc-dialog .toc-item small{font-size:12px}.toc-pager{display:flex;align-items:center;gap:8px;margin-top:8px}.toc-pager span{margin-right:auto;font-size:13px;color:var(--muted)}.toc-pager button{min-height:44px}

.option-pages{display:flex;gap:8px;margin-top:8px}.option-pages button{flex:1;min-height:44px}

#question-viewport,#question-content{display:block;min-height:0}
#question-viewport.is-paged{display:block;width:100%;min-height:0;overflow-x:hidden;overflow-y:hidden}
#question-viewport.is-paged #question-content{display:block;column-count:auto;column-gap:0;column-fill:auto;width:100%;orphans:2;widows:2}
#question-viewport.is-paged :is(.choice-option,.option-pages,svg){break-inside:avoid}
.question-pages{display:flex;align-items:center;gap:8px;padding-top:8px}.question-pages span{margin-right:auto;font-size:12px;color:var(--muted)}.question-pages button{min-height:44px;font-size:13px;padding:6px 10px}

/* 2026-09-27 & 2026-11-03: shared hand-in-hand pair + self-service handout 4.5:5.5 & unified proof typography. */
.classroom-page[data-template]{height:100svh;min-height:0;background:#fff}
[data-template] .class-stage[data-layout]{display:grid;grid-template-columns:minmax(0,45%) minmax(0,55%);grid-template-rows:minmax(0,1fr);gap:24px;min-height:0;flex:1;padding-top:12px}
[data-template] .teaching-panel{display:flex;flex-direction:column;min-width:0;min-height:0;padding:0;overflow:visible}
[data-template] .question-context{display:flex;flex-direction:column;flex:0 1 auto;min-height:0;max-height:48%;padding:0 0 10px;overflow:visible}
[data-template] .question-stem{font-size:clamp(18px,1.42vw,22px)}
[data-template] .question-stem .stem-source{display:inline-block;font-size:.78em;line-height:1.4;color:var(--muted);font-weight:450;margin-right:4px}
[data-template] .current-question{font-size:clamp(19px,1.5vw,23px)}
[data-template] .proof-panel{display:flex;flex-direction:column;flex:1;min-height:0;min-width:0;overflow:visible}
[data-template] .answer-scroll{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;flex:1;min-height:0;max-height:none;padding:0 9px 8px 0}
[data-template] .answer-scroll:focus-visible{outline:2px solid #e9a431;outline-offset:2px}
[data-template] .visual-panel{display:flex;min-width:0;min-height:0;border:1px solid var(--line);border-radius:5px;background:#fff}
[data-template] .scene{height:auto;min-height:0;flex:1 1 0;padding:5px 12px}
[data-template] .visual-heading{flex-shrink:0}
[data-template] .proof-row{border:0;font-size:clamp(18px,1.45vw,21px);line-height:1.62;color:#2b3d54;padding:7px 0;grid-template-columns:22px minmax(0,1fr);gap:7px;border-left:3px solid transparent}
[data-template] .proof-row.current-row{font-size:clamp(18px,1.45vw,21px);line-height:1.62;color:#142338;border-left-color:var(--blue);padding-left:8px;background:rgba(36,94,200,.035);border-radius:0 6px 6px 0}
[data-template] .proof-row > div[data-step-title]::before,[data-template] .proof-row .proof-page-content[data-step-title]::before{content:attr(data-step-title);display:block;font-size:13px;line-height:1.38;font-weight:650;color:var(--blue);margin-bottom:3px;letter-spacing:.01em}
[data-template] .proof-row .proof-line-be{color:#53667e;font-weight:450}
[data-template] .proof-row .proof-line-th{color:#142338;font-weight:650}
[data-template] .proof-row .proof-congruence{border-left:2.2px solid #64748b;padding-left:10px;margin:4px 0 4px 4px;border-radius:2px}
[data-template] .proof-row .conclusion{color:var(--blue);font-weight:650}
[data-template] .proof-row .proof-block,[data-template] .proof-row .pending-note,[data-template] .proof-row .boundary-note{border:0;background:transparent;padding:0}
[data-template] .class-footer{background:#fff}
[data-template] .classroom .scene foreignObject .proof-block{border:0;background:transparent;padding:0;margin:0}
[data-template] .choice-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:10px}
[data-template] .choice-options.long-options{grid-template-columns:minmax(0,1fr)}
[data-template] .choice-option{min-height:62px;padding:8px 11px 4px;font-size:19px;break-inside:avoid}
[data-template] .choice-option:is(.is-discussing,.is-answer){padding:7.5px 10.5px 3.5px}
[data-template] .option-status:empty{display:none}
[data-template] .image-options.dense-image-options .option-content svg{height:150px}
[data-template] #question-viewport.is-paged{flex-shrink:0}
[data-template] .question-pages{flex-shrink:0;padding-top:6px}
[data-template] .navigation-button{min-width:112px;white-space:nowrap}
[data-template] .whole-progress{display:block;width:200px}
@media(max-width:1100px){
 [data-template] .classroom{padding-inline:16px}
 [data-template] .lesson-selectors{gap:9px}
 [data-template] .class-stage[data-layout]{gap:18px;grid-template-columns:minmax(0,47%) minmax(0,1fr)}
 [data-template] .question-stem{font-size:18px}[data-template] .current-question{font-size:20px}
 [data-template] .proof-row.current-row{font-size:21px}[data-template] .choice-option{font-size:18px}
 [data-template] .whole-progress{width:155px}[data-template] .navigation-button{min-width:90px}
}
@media(min-width:700px) and (max-width:950px){
 [data-template] .pp-brand>span,[data-template] .library-link{display:none}
 [data-template] .lesson-selectors label{flex-direction:row;align-items:center;gap:5px}
 [data-template] .motion-row label{display:none}[data-template] .motion-row{flex-wrap:wrap}
 [data-template] .motion-row input[type=range]{flex-basis:100%;order:5}
 [data-template] .scene{padding-inline:5px}
 [data-template] .class-footer{gap:6px}[data-template] .lesson-actions{width:auto;gap:6px}
 [data-template] .navigation-button{min-width:80px;padding-inline:12px}
}
@media(min-width:700px) and (max-height:700px){
 [data-template] .pp-header{min-height:50px}[data-template] .lesson-selectors{padding-block:4px}
 [data-template] .class-stage[data-layout]{padding-top:8px}
 [data-template] .class-footer{min-height:62px;margin-top:6px}
 [data-template] .proof-row.current-row{font-size:21px}
 [data-template] .figure-caption{font-size:12px;padding-bottom:5px}
}
/* Phones keep both proof and figure visible vertically; no separate views. */
@media(max-width:699px){
 [data-template] .classroom{padding-inline:12px}
 [data-template] .pp-header{padding-inline:12px;min-height:50px;gap:6px}
 [data-template] .pp-brand strong{font-size:14px}[data-template] .pp-avatar{width:34px;height:34px}
 [data-template] .lesson-selectors{flex-wrap:wrap;align-items:stretch;gap:5px 8px;padding:5px 0}
 [data-template] .lesson-selectors label{flex:1 1 calc(50% - 4px)!important;max-width:calc(50% - 4px);flex-direction:row;gap:4px;font-size:11px}
 [data-template] .lesson-selectors select{font-size:12px;padding:7px 16px 7px 6px;min-height:44px}
 [data-template] .class-stage[data-layout]{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(160px,1fr) minmax(120px,.85fr);gap:8px;padding-top:8px}
 [data-template] .teaching-panel{display:contents}
 [data-template] .question-context{grid-row:1;max-height:170px;padding:0;min-height:0}
 [data-template] .visual-panel{grid-row:2;min-height:0}
 [data-template] .proof-panel{grid-row:3;min-height:0;flex:1}
 [data-template] .item-heading{margin-bottom:4px}
 [data-template] .question-stem,[data-template] .current-question{font-size:18px;line-height:1.5}
 [data-template] .current-question{margin-top:6px}
 [data-template] .visual-heading{padding:4px 8px;font-size:11px}
 [data-template] .visual-heading #visual-tag{font-size:10px}
 [data-template] .scene{height:auto;min-height:0;flex:1 1 0;padding:0 4px}
 [data-template] .figure-caption{padding:3px 8px;font-size:12px;line-height:1.4}
 [data-template] .motion-controls{padding:4px 6px}
 [data-template] .motion-controls .motion-row{min-width:0;flex-basis:100%}
 [data-template] .motion-row input[type=number]{width:62px;flex-basis:62px}
 [data-template] .case-controls{padding:3px 6px}
 [data-template] .proof-row{font-size:16px}[data-template] .proof-row.current-row{font-size:20px}
 [data-template] .answer-heading{padding:4px 0}[data-template] .answer-scroll{padding-bottom:4px}
 [data-template] .proof-pages{padding-bottom:3px}[data-template] .proof-pages button{padding:4px 8px}
 [data-template] .choice-option{font-size:17px}
 [data-template] .class-footer{min-height:62px;margin-top:6px;position:static}
 [data-template] .whole-progress{display:none}[data-template] .lesson-actions{width:100%;gap:6px}
 [data-template] .lesson-actions>button:first-child{min-width:68px;margin:0;padding:5px;font-size:12px}
 [data-template] .lesson-actions>.navigation-button{flex:1;min-width:0;font-size:14px;padding:7px}
}

/* History actions share the heading; they do not consume a proof row. */
[data-template] .answer-heading{flex-wrap:wrap;gap:4px 10px}
[data-template] #item-progress{margin-left:auto}
[data-template] .proof-pages{padding:0;gap:5px}
[data-template] #proof-range{display:none}
[data-template] .proof-pages button{padding:4px 7px;min-height:44px}

@media(max-width:699px){
 /* Reserve the diagram itself as well as its real parameter controls. */
 [data-template] .class-stage[data-layout]:has(.image-options):has(#motion-controls:not([hidden])){grid-template-rows:auto minmax(220px,1fr) minmax(100px,.65fr)}
}

/* Accepted exam-style solution: main relation plus its local justification. */
[data-template] .proof-row .proof-reason{font-family:inherit;font-size:max(15px,.78em);line-height:1.5;color:#53667e;margin:4px 0 0}
[data-template] .proof-row .proof-case{font-weight:650;margin:0 0 5px;line-height:1.45}
[data-template] .case-controls{flex-wrap:wrap}
[data-template] .case-controls button{flex:1 1 44px;min-width:44px}

/* Long current deductions use explicit pages without reducing the text size. */
[data-template] .is-paged-proof>div{overflow:hidden;min-width:0}
[data-template] .proof-page-content{column-gap:0;column-fill:auto;overflow-wrap:anywhere}
[data-template] .proof-page-content p,[data-template] .proof-page-content .math{orphans:1;widows:1}
[data-template] #proof-step-page-label{font-size:12px;white-space:nowrap;color:var(--muted)}
[data-template] #proof-step-pages button{font-size:12px;padding:4px 7px}

@media(max-width:699px){[data-template] .image-options.dense-image-options .option-content svg{height:110px}}

/* The anchored dropdown structure follows the Uiverse recipe by aadium
   (massive-seahorse-39). Interaction is explicit click/touch and keyboard. */
.custom-picker{position:relative}
.picker-trigger{display:flex;align-items:center;gap:8px;font:inherit;color:var(--ink);background:#fff;border:1px solid #cbd6e7;border-radius:6px;min-height:46px;padding:8px 12px;min-width:0;width:100%;text-align:left;cursor:pointer}
.picker-trigger>span:first-child{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.picker-arrow{font-size:20px;line-height:1;flex-shrink:0}
.picker-trigger:focus-visible,.picker-options button:focus-visible{outline:3px solid #e9a431;outline-offset:2px}
.picker-trigger[aria-expanded=true]{border-color:var(--blue)}
.picker-menu{position:fixed;z-index:30;border:1px solid #bccadb;border-radius:6px;background:white;box-shadow:0 8px 25px #17253b26;padding:5px;box-sizing:border-box}
.picker-menu[hidden]{display:none!important}
.picker-options{display:flex;flex-direction:column;gap:2px}
.picker-options button{font:inherit;min-height:44px;width:100%;border:0;border-radius:3px;background:white;color:var(--ink);padding:9px 10px;text-align:left;white-space:normal;overflow-wrap:anywhere;cursor:pointer}
.picker-options button[aria-selected=true]{color:var(--blue);background:#f0f5fd;font-weight:650}
.picker-options button:hover{background:#edf2fa}
.picker-pager{display:flex;align-items:center;gap:5px;border-top:1px solid var(--line);padding-top:4px;margin-top:4px}
.picker-pager>span{flex:1;text-align:center;font-size:12px;color:var(--muted)}
.picker-pager .soft-button{min-width:44px;min-height:44px;padding:4px 8px;font-size:22px}

/* Notes render complete answers into actual pages. Hidden pages have no
   scroll geometry; every page is measured at its readable final font size. */
.note-display[hidden]{display:none!important}
.note-display{display:flex;flex-direction:column;flex:1;min-height:0;min-width:0}
.note-heading{display:flex;align-items:center;gap:8px;flex-shrink:0;border-bottom:1px solid var(--line);padding:0 0 6px;margin-bottom:6px}
.note-heading>strong{font-size:14px;font-weight:600;flex:1;min-width:0;line-height:1.45}
.note-heading nav{display:flex;align-items:center;gap:6px;flex-shrink:0}
.note-heading button{min-width:44px;font-size:22px;padding:3px 8px}
#note-explanations{font-size:13px;padding:5px 8px;white-space:nowrap}
#note-explanations[aria-pressed=true]{color:var(--blue);background:#edf2fa}
#note-page-label{font-size:13px;color:var(--muted);white-space:nowrap}
.note-viewport{flex:1;min-height:0;min-width:0;position:relative;outline-offset:2px}
.note-sheet{box-sizing:border-box;width:100%;font-size:clamp(21px,1.72vw,26px);line-height:1.6;color:var(--ink);overflow-wrap:anywhere}
.note-sheet[hidden]{display:none!important}
.note-block{position:relative;padding:4px 0 5px 28px;min-width:0}
.note-number{position:absolute;left:1px;top:7px;font:12px/1.6 system-ui,sans-serif;color:var(--muted)}
.note-block :is(p,.proof-block,.conclusion){margin:0 0 3px;line-height:inherit}
.note-block .proof-reason{font-family:inherit;font-size:max(15px,.78em);line-height:1.5;color:#53667e}
.note-block .proof-case{font-weight:650}
.note-block :last-child{margin-bottom:0}
.note-reading-fallback{overflow:auto}
.math-token{white-space:nowrap}
[data-notes=true] .class-stage[data-layout]{grid-template-columns:minmax(0,52%) minmax(0,1fr)}
[data-notes=true] .question-context,[data-notes=true] .proof-panel>.answer-heading,[data-notes=true] .answer-scroll,[data-notes=true] :is(.figure-caption,.motion-controls,.case-controls){display:none!important}
[data-notes=true] .visual-panel{align-self:stretch;height:auto;min-height:0}
[data-notes=true] .visual-heading{padding:7px 9px;font-size:12px}
[data-notes=true] #visual-tag{display:none}
[data-notes=true] .scene{padding:4px}
[data-notes=true] .note-heading{flex-wrap:wrap}
[data-notes=true] .note-heading>strong{flex-basis:100%}
[data-notes=true] .note-heading nav{width:100%;justify-content:flex-end}
[data-notes=true] .scene>svg{overflow:visible}
[data-notes=true][data-notes-text-only=true] .class-stage[data-layout]{grid-template-columns:minmax(0,1fr)}
[data-notes-text-only=true] .visual-panel{display:none}
[data-notes=true] .scene[data-draggable=true]{cursor:default;touch-action:auto}
[data-notes=true] :is(#replay-button,#prev-button,#next-button){display:none}
[data-notes=true] .lesson-actions{margin-left:auto}
[data-notes=true] #conclusion-button{color:white;background:var(--blue);border-color:var(--blue)}
@media(min-width:700px) and (max-width:950px){
 [data-notes=true] .class-stage[data-layout]{grid-template-columns:minmax(0,41%) minmax(0,1fr)}
}

/* Source reading shows one original page with fixed return and page controls. */
.source-dialog[open]{display:flex;flex-direction:column;height:90svh;max-height:calc(100svh - 20px);box-sizing:border-box;overflow:visible;padding:14px 18px}
.source-dialog .dialog-top{flex-shrink:0;margin-bottom:8px;gap:10px;align-items:center}
.source-dialog .dialog-top h2{font-size:18px;margin:3px 0}
.source-dialog .eyebrow{font-size:12px;overflow-wrap:anywhere}
#source-images{display:flex;flex:1;min-height:0;min-width:0;align-items:center;justify-content:center}
.source-dialog #source-images img{width:100%;height:100%;object-fit:contain;border:0}
.source-pager{display:flex;gap:8px;align-items:center;justify-content:space-between;flex-shrink:0;padding-top:8px;font-size:13px;color:var(--muted)}
.source-pager span{text-align:center}.source-pager button{min-height:44px;white-space:nowrap}
@media(max-width:699px){
 [data-template] .picker-trigger{font-size:12px;min-height:44px;padding:7px 8px}
 .picker-menu{font-size:14px}
 [data-notes=true] .class-stage[data-layout]{grid-template-columns:minmax(0,52%) minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:8px}
 [data-notes=true] .teaching-panel{display:flex;grid-column:1;grid-row:1}
 [data-notes=true] .proof-panel{grid-row:auto}
 [data-notes=true] .visual-panel{grid-column:2;grid-row:1;height:auto;min-height:0}
 [data-notes=true] .visual-heading{padding:4px;font-size:10px}
 .note-heading{flex-wrap:wrap;gap:3px}
 .note-heading>strong{flex-basis:100%;font-size:13px}
 .note-heading nav{width:100%;justify-content:space-between}
 .note-sheet{font-size:19px;line-height:1.55}
 .note-block{padding-left:20px}
 .note-number{font-size:11px}
 [data-notes=true] .lesson-actions{width:auto}
 .source-dialog[open]{padding:10px}
 .source-dialog .dialog-top h2{font-size:15px}
 .source-pager{font-size:12px;gap:4px}
 .source-pager button{font-size:12px;padding:5px 8px}
}