/* Subject navigation shares the app header; compact screens use an underline. */
.app-header{display:grid;grid-template-columns:minmax(0,1fr) auto auto;column-gap:20px;row-gap:8px}
.app-header>.brand{min-width:0}
.subject-tabs{display:flex;gap:4px;margin:0;padding:3px;border:1px solid var(--line);border-radius:12px;background:var(--card)}
.subject-tabs button{border:0;background:transparent;color:var(--muted);border-radius:8px;min-height:44px;padding:0 16px;font-size:14px;font-weight:650;white-space:nowrap;cursor:pointer}
.subject-tabs button[aria-selected=true]{background:var(--accent);color:white}
@media(min-width:901px){.app-header>.subject-tabs{height:52px;box-sizing:border-box}.app-header>.top-actions .btn{height:52px;min-height:52px;box-sizing:border-box}}
@media(min-width:901px) and (max-width:1050px){.app-header{column-gap:14px}.app-header>.brand p{display:none}.subject-tabs button{padding:0 12px}}
@media(max-width:900px){.app-header{grid-template-columns:minmax(0,1fr) auto;row-gap:8px}.app-header>.brand{grid-column:1;grid-row:1}.app-header>.top-actions{grid-column:2;grid-row:1;width:auto;margin:0}.app-header>.subject-tabs{grid-column:1/-1;grid-row:2;width:100%;padding:0;gap:24px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent}.subject-tabs button{position:relative;min-height:44px;padding:0 4px;border-radius:0;font-size:15px}.subject-tabs button[aria-selected=true]{color:var(--accent);background:transparent}.subject-tabs button[aria-selected=true]:after{content:"";position:absolute;left:4px;right:4px;bottom:-1px;height:3px;border-radius:2px;background:var(--accent)}}
@media(max-width:600px){.app-header{gap:6px}.app-header>.brand{grid-column:1/-1}.app-header>.top-actions{grid-column:1/-1;grid-row:2;justify-content:flex-end}.app-header>.subject-tabs{grid-row:3;gap:24px}.account-bar{margin-top:8px}}
.subject-tabs button:focus-visible,.math-panel button:focus-visible,.math-panel summary:focus-visible{outline:3px solid #b77912;outline-offset:3px}.math-panel{width:100%;max-width:880px;margin:24px auto 0}.math-panel svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.math-heading{display:flex;gap:16px;align-items:center;justify-content:space-between}.math-heading h2{font-size:24px;margin:0 0 8px}.math-heading p{font-size:14px;color:var(--muted);margin:0}.math-heading>span{color:var(--muted);font-size:12px;white-space:nowrap}.math-mode-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin:24px 0 20px;border-bottom:1px solid var(--line)}.math-mode-tabs button{background:transparent;border:0;border-bottom:3px solid transparent;color:var(--muted);padding:12px 4px;min-height:48px;font-size:16px;font-weight:600}.math-mode-tabs button[aria-selected=true]{border-bottom-color:var(--accent);color:var(--accent)}.math-options{display:flex;gap:16px;flex-wrap:wrap}.math-options label{flex:1;min-width:150px;font-size:13px;color:var(--muted)}.math-options select{display:block;margin-top:8px;background-color:var(--card);font-size:16px;min-height:48px;border-radius:12px}.math-scope{font-size:13px;color:var(--muted);line-height:1.7;margin:12px 0 16px}.math-round{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:var(--muted);margin-bottom:12px}.math-learning{background:var(--card);border:1px solid var(--line);border-radius:26px;padding:24px;min-height:360px;text-align:center}.math-card-top{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:13px;color:var(--muted)}.math-card-top button{display:grid;place-items:center;width:48px;height:48px;border:1px solid var(--line);border-radius:12px;background:var(--accent-soft);color:var(--accent);flex-shrink:0}.math-equation{font-size:clamp(42px,8vw,72px);font-weight:650;line-height:1.4;letter-spacing:.03em;font-variant-numeric:tabular-nums;margin:20px 0 8px;overflow-wrap:anywhere}.math-equation.number{font-size:112px;margin-top:4px}.math-equation .answer{color:var(--accent)}.math-number-name{font-size:26px;color:var(--accent);font-weight:600;margin:8px 0}.math-caption{font-size:14px;line-height:1.8;color:var(--muted);margin:12px 0 20px}.math-model{display:flex;gap:16px;flex-wrap:wrap;align-items:center;justify-content:center;font-size:14px;color:var(--muted);margin:16px 0}.model-group{display:flex;flex-direction:column;gap:8px;align-items:center;max-width:100%}.model-group>span{font-size:13px}.model-dots{display:flex;flex-wrap:wrap;gap:6px;max-width:214px;justify-content:center}.math-dot{display:block;width:16px;height:16px;border-radius:50%;background:var(--accent);position:relative;flex-shrink:0}.math-dot.warm{background:#b77912}.math-dot.empty{background:transparent;border:1px dashed #82977c}.math-dot.removed{background:#e5ebe0;border:1px solid #82977c}.math-dot.removed:after{content:"";position:absolute;left:0;right:0;top:7px;border-top:2px solid #994c35;transform:rotate(-45deg)}.ten-frame{display:grid;grid-template-columns:repeat(5,16px);gap:6px;padding:8px;border:1px solid var(--line);border-radius:8px}.ten-rods{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;max-width:240px}.ten-rod{display:grid;grid-template-rows:repeat(10,8px);gap:1px;border:1px solid #82977c;border-radius:4px;overflow:hidden}.ten-rod i{display:block;width:12px;background:var(--accent-soft)}.hundred-block{display:grid;place-items:center;width:72px;height:80px;background:var(--accent-soft);border:1px solid #82977c;border-radius:8px;color:var(--accent);font-size:24px}.math-helper{text-align:left;border-top:1px solid var(--line);padding-top:12px;margin:20px 0}.math-helper summary{cursor:pointer;min-height:44px;padding:10px 0;color:var(--accent);font-size:14px}.math-lesson{margin-top:20px;text-align:left;border-top:1px solid var(--line);padding-top:16px}.math-method-hint{font-size:14px;color:var(--muted);line-height:1.8;margin:0 0 16px}#mathStepCount{font-size:13px;color:var(--muted)}#mathStepTitle{font-size:18px;line-height:1.6;margin:8px 0}.math-step-equation{font-size:28px;color:var(--accent);font-weight:600;margin:12px 0}#mathStepDetail{font-size:14px;line-height:1.8;color:var(--ink);margin:16px 0}.math-step-actions{display:flex;gap:12px}.math-step-actions button{flex:1;min-height:48px;border:1px solid var(--line);border-radius:12px;background:transparent;color:var(--accent);font-size:14px;font-weight:600}.math-answer-form{margin:24px auto 0;max-width:420px;text-align:left}.math-answer-form label{display:block;font-size:14px;margin-bottom:8px}.math-answer-form>div{display:flex;gap:12px}.math-answer-form input{width:100%;min-width:0;min-height:52px;border:1px solid #82977c;background:white;border-radius:12px;padding:0 12px;font-size:22px;color:var(--ink);font-variant-numeric:tabular-nums}.math-answer-form button{min-height:52px;min-width:108px;border:1px solid var(--accent);background:var(--accent);color:white;font-size:16px;border-radius:12px;font-weight:600}.math-feedback{font-size:16px;line-height:1.7;color:var(--accent);margin:16px 0 0}.math-feedback[data-kind=try]{color:#994c35}.math-text-button{border:0;background:transparent;color:var(--muted);text-decoration:underline;text-underline-offset:4px;min-height:44px;font-size:14px;padding:8px;margin-top:12px}.math-bottom-actions{display:grid;grid-template-columns:1fr 1.6fr;gap:12px;margin-top:16px}.math-bottom-actions button{min-height:56px;padding:12px;border:1px solid var(--line);border-radius:16px;background:transparent;color:var(--ink);font-weight:600;font-size:16px}#mathNextBtn{background:var(--accent);border-color:var(--accent);color:white}.math-footnote{font-size:12px;color:var(--muted);text-align:center;line-height:1.8;margin:16px 0}.flashcard:has(.idiom-word){height:auto;min-height:420px}.example.idiom-meaning{max-width:40em;margin:16px auto 0;line-height:1.8;color:var(--ink);font-size:16px}
@media(hover:hover){.math-panel button:hover{filter:brightness(.96)}}
@media(max-width:600px){.math-panel{margin-top:20px}.math-heading h2{font-size:22px}.math-heading>span{font-size:11px}.math-options{gap:12px}.math-options label{min-width:130px}.math-learning{padding:16px;border-radius:22px;min-height:340px}.math-equation{font-size:46px}.math-equation.number{font-size:100px}.math-round{font-size:12px}.math-scope{font-size:13px}.math-answer-form>div{gap:8px}.math-answer-form button{min-width:96px;font-size:15px}.math-bottom-actions{gap:10px}.math-bottom-actions button{font-size:15px}.math-model{gap:12px}.toolbar>.segment{flex:1 0 100%}.toolbar>.segment button{flex:1;min-width:0;padding:0 8px}.math-step-equation{font-size:25px}.example.idiom-meaning{font-size:14px}}
@media(max-width:350px){.math-heading{align-items:flex-start;flex-direction:column;gap:8px}.math-equation{font-size:38px}.math-options label{min-width:0}.math-answer-form button{min-width:90px}.math-dot{width:14px;height:14px}.ten-frame{grid-template-columns:repeat(5,14px)}}
@media(prefers-reduced-motion:reduce){.math-panel *{animation:none!important;transition:none!important}}

.math-answer-form input[aria-invalid=true]{border-color:#994c35}
@media(max-width:600px){.math-active .account-bar{display:none}.math-active header .top-actions{width:auto;margin-left:auto}.math-active header{gap:8px}.math-active header .brand{gap:8px}.math-active header .brand h1{font-size:17px}.math-active .top-actions .btn{font-size:12px;padding:0 8px}.math-heading p{display:none}.math-heading h2{font-size:20px;margin:0}.math-heading>span{font-size:12px}.math-mode-tabs{margin:16px 0}.math-panel{margin-top:16px}.math-scope{font-size:12px;margin:8px 0 12px}.math-learning{min-height:300px}.math-equation{margin:12px 0 4px;font-size:44px}.math-equation.number{font-size:88px}.math-number-name{font-size:24px;margin:4px 0}.math-caption{margin:8px 0 12px;font-size:13px}.math-model{margin:12px 0}.math-helper{margin:12px 0;padding-top:8px}.math-answer-form{margin-top:16px}.math-card-top button{width:44px;height:44px}.math-bottom-actions{margin-top:12px}.math-footnote{margin-top:12px}}

/* Child-friendly answer pad: no system keyboard required. */
.math-answer-form .math-keypad{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px}
.math-keypad button{min-width:0;min-height:56px;border:1px solid var(--line);background:var(--card);color:var(--ink);font-size:26px;border-radius:12px;touch-action:manipulation}
.math-keypad .math-key-action{font-size:15px;color:var(--ink);background:var(--accent-soft)}
.math-keypad button:active{background:var(--accent-soft);border-color:var(--accent)}
.math-answer-form input[readonly]{cursor:default;caret-color:transparent;text-align:center;font-size:28px;font-weight:650}
@media(max-width:600px){.math-keypad button{min-height:52px;font-size:24px}.math-keypad .math-key-action{font-size:14px}}