body[data-page=teacher] .portal-nav { display:none; }
body[data-page=teacher] .simple-header { flex-wrap:nowrap; justify-content:space-between; gap:8px; }
body[data-page=teacher] .simple-brand>.brand-title,body[data-page=teacher] .simple-footer { display:none; }
.learning-entry,.ability-page { max-width:1050px; margin:auto; }
.learning-entry h1,.ability-page h1 { font-size:38px; color:#456536; line-height:1.6; }
.learning-entry>div>p,.ability-page>p { font-size:23px; line-height:1.9; color:#74835f; }
.learning-mode-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin:28px 0; }
.learning-mode { text-align:left; padding:28px; border:2px solid #d5dfc0; border-radius:22px; background:#fffef9; color:#4e6d3e; }
.learning-mode[aria-pressed=true] { border-color:#8ba365; background:#eef4df; }
.learning-mode>span { font-size:36px; }.learning-mode h2 { font-size:29px; }.learning-mode p { font-size:22px; line-height:1.9; }
.teacher-main { min-height:72px; font-size:28px!important; margin:12px 10px 12px 0; }
.teacher-preferences { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin:20px 0; }
.teacher-preferences label { display:flex; flex-direction:column; gap:12px; font-size:21px; min-width:0; }
.teacher-preferences select { width:100%; min-width:0; min-height:56px; font-size:20px; }
.teacher-adult { padding:25px; margin:28px 0; border:1px solid #dbe3cd; border-radius:18px; background:#fffef8; }
.teacher-adult summary { cursor:pointer; font-size:21px; }.teacher-adult p { font-size:20px; line-height:1.9; }
.teacher-footnote { font-size:19px; color:#7c886e; line-height:1.9; }
.teacher-room { max-width:1050px; margin:10px auto; padding:24px; border-radius:26px; background:#f4f6e9; border:1px solid #dbe5c9; }
.teacher-welcome,.teacher-guide { display:grid; grid-template-columns:190px minmax(0,1fr); align-items:center; gap:24px; }
.teacher-portrait { position:relative; text-align:center; align-self:start; }.teacher-mascot { display:block; width:180px; height:205px; object-fit:contain; margin:auto; }
.teacher-portrait>span { font-size:23px; color:#678347; }.teacher-portrait .teacher-speaking { position:absolute; right:0; top:0; font-size:42px; opacity:0; }
.teacher-room[data-speaking=true] .teacher-speaking { opacity:1; animation:teacher-note 1.3s ease-in-out infinite; }
.teacher-room[data-speaking=true] .teacher-mascot { animation:teacher-breathe 2s ease-in-out infinite; transform-origin:50% 80%; }
.teacher-bubble { padding:26px; border-radius:24px; background:#fffef9; border:1px solid #dce4cc; min-width:0; }
.teacher-bubble h1 { font-size:33px; line-height:1.9; color:#456335; margin:0 0 15px; overflow-wrap:anywhere; }.teacher-bubble>p { font-size:23px; line-height:1.9; }
.teacher-bubble .teacher-step { font-size:21px; color:#8a9b6e; margin:0 0 12px; }#teacher-audio-status { min-height:40px; font-size:19px; color:#7d8b68; }
.teacher-topline { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:22px; color:#7a8966; font-size:20px; flex-wrap:wrap; }
.teacher-topline .teacher-back { display:grid; place-items:center; width:48px; height:48px; padding:0; font-size:30px; line-height:1; border:1px solid #c8d5b3; border-radius:14px; background:#fffef9; }
.teacher-progress { display:flex; gap:8px; align-items:center; }
.teacher-progress-dot { display:block; width:12px; height:12px; border:2px solid #8ca66b; border-radius:50%; background:#fffef9; }
.teacher-progress-dot.done { background:#7c995d; }
.teacher-step-row { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.teacher-step-row .teacher-step { min-width:0; margin:0; }
.teacher-sentence { display:block; }
.teacher-sentence+.teacher-sentence { margin-top:.4em; }
.teacher-pause { flex-shrink:0; min-width:48px; min-height:48px; font-size:25px; color:#526d3e; background:#f2f5e7; }
.choice-label { min-width:0; max-width:100%; }
body[data-full-zhuyin=true] .teacher-voice-tools .btn>.phonetic-run { flex:0 0 auto; max-width:100%; white-space:normal; }
.teacher-voice-tools { display:flex; gap:12px; flex-wrap:wrap; }.teacher-voice-tools .btn { min-height:58px; font-size:22px; }
.teacher-choices { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin:28px 0 16px; }.teacher-choices.two { grid-template-columns:1fr 1fr; }
.teacher-choice { display:flex; position:relative; min-width:0; min-height:150px; align-items:center; justify-content:center; gap:16px; flex-direction:column; padding:32px 20px; background:#fffef9; border:3px solid #c1d0a6; border-radius:23px; font-size:31px; line-height:1.9; color:#476637; touch-action:manipulation; overflow-wrap:anywhere; }
.teacher-choice:hover { background:#eef4df; border-color:#8ca967; }.teacher-choice:focus-visible { outline:5px solid #e6b668; outline-offset:4px; }.teacher-choice:disabled { opacity:.35; }
.teacher-choice svg { width:115px; height:115px; }.choice-position { position:absolute; left:12px; top:7px; color:#94a77b; font-size:19px; }.teacher-hint { margin:12px; font-size:22px; }
.teacher-feedback,.teacher-finish { margin:25px 0 0; padding:28px; border-radius:22px; border:1px solid #d1dfb9; background:#fffef8; }.teacher-feedback h2 { color:#658448; font-size:31px; }.teacher-feedback p,.teacher-finish p { font-size:26px; line-height:2; }
.ability-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; margin:26px 0; }.ability-card { padding:26px; }.ability-card h2 { font-size:28px; color:#526f3f; }.ability-card strong { font-size:26px; color:#8b9e69; }.ability-card p,.ability-card small,.teacher-evidence p { font-size:21px; line-height:1.9; }.ability-card details { margin:18px 0; }.ability-card summary { font-size:18px; }.teacher-evidence { padding:28px; margin-top:24px; }.teacher-evidence a { font-size:20px; color:#627e46; overflow-wrap:anywhere; }
.teacher-hub-entry { display:flex; align-items:center; gap:20px; padding:24px; border:2px solid #a4b987; border-radius:22px; background:#f1f5e5; margin:24px 0; width:100%; text-align:left; color:#526e3d; }.teacher-hub-entry img { width:85px; height:95px; object-fit:contain; }.teacher-hub-entry strong { font-size:29px; display:block; }.teacher-hub-entry p { font-size:22px; line-height:1.8; margin:6px 0 0; }
@keyframes teacher-note { 50% { transform:translateY(-5px); } }@keyframes teacher-breathe { 50% { transform:scale(1.018); } }
@media(max-width:700px) { .learning-mode-grid,.teacher-preferences,.ability-grid { grid-template-columns:1fr; }.learning-entry h1,.ability-page h1 { font-size:30px; }.learning-mode { padding:20px; }.teacher-room { padding:16px; }.teacher-welcome,.teacher-guide { grid-template-columns:1fr; gap:12px; }.teacher-portrait { display:flex; align-items:center; justify-content:center; gap:10px; }.teacher-mascot { width:90px; height:100px; margin:0; }.teacher-bubble { padding:18px; }.teacher-bubble h1 { font-size:28px; }.teacher-choices,.teacher-choices.two { gap:12px; grid-template-columns:1fr 1fr; }.teacher-choices:not(.two)>.teacher-choice:last-child { grid-column:1/-1; }.teacher-choice { min-height:125px; padding:25px 12px; font-size:27px; }.teacher-choice svg { width:92px; height:92px; }.teacher-main { width:100%; margin:12px 0; font-size:26px!important; }.teacher-feedback,.teacher-finish { padding:20px; }.teacher-topline { font-size:18px; }.teacher-topline .text-btn { font-size:18px; }.teacher-hub-entry { padding:16px; gap:10px; }.teacher-hub-entry strong { font-size:25px; }.teacher-hub-entry p { font-size:20px; } }
@media(prefers-reduced-motion:reduce) { .teacher-room * { animation:none!important; } }
/* Keep the picture answers close to the prompt on a child's phone. */
.teacher-topline .text-btn { font-size:20px; min-height:48px; }
@media(max-width:700px) {
 .teacher-room { padding:12px; margin:0 auto; }
 .teacher-topline { margin-bottom:8px; gap:6px; }
 .teacher-topline .text-btn { font-size:17px; }
 .teacher-guide { gap:8px; }.teacher-guide .teacher-mascot { width:65px; height:72px; }
 .teacher-guide .teacher-portrait>span { font-size:21px; }
 .teacher-bubble { padding:14px; }.teacher-bubble .teacher-step { margin-bottom:4px; font-size:18px; }
 .teacher-bubble h1 { margin-bottom:5px; line-height:1.65; }
 #teacher-audio-status { font-size:16px; min-height:28px; margin:6px 0; }
 .teacher-voice-tools { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto; gap:6px; align-items:center; }
 .teacher-voice-tools .btn { padding:10px 6px; min-width:0; font-size:18px; min-height:48px; }
 .teacher-voice-tools .text-btn { min-height:48px; font-size:17px; padding:6px; }
 .teacher-choices { margin-top:16px; gap:10px; }
 .teacher-choice { min-height:112px; padding:22px 10px 14px; gap:5px; }
 .teacher-choice svg { width:76px; height:76px; }
 .teacher-hint { margin:5px; min-height:44px; font-size:20px; }
 body[data-full-zhuyin=true] .teacher-voice-tools { grid-template-columns:repeat(2,minmax(0,1fr)); }
 body[data-full-zhuyin=true] .teacher-voice-tools .btn { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:4px; }
 body[data-full-zhuyin=true] .teacher-voice-tools .text-btn { grid-column:1/-1; justify-self:end; min-height:40px; }
}
@media(max-width:700px) {
 .teacher-topline { flex-wrap:nowrap; }
 .teacher-topline .teacher-help { font-size:18px; }
 .teacher-topline .teacher-back { width:44px; height:44px; min-height:44px; font-size:28px; }
 .teacher-progress { gap:6px; }.teacher-progress-dot { width:10px; height:10px; }
 .teacher-guide .teacher-mascot { width:48px; height:56px; }
 .teacher-guide .teacher-portrait { gap:6px; }
 .teacher-guide .teacher-portrait>span { font-size:20px; }
 .teacher-step-row { margin-bottom:8px; }
 .teacher-voice-tools { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
 body[data-full-zhuyin=true] .teacher-choices.text-choices { grid-template-columns:minmax(0,1fr); }
 body[data-full-zhuyin=true] .teacher-choices.text-choices>.teacher-choice { grid-column:auto; min-height:100px; padding:18px 22px; }
 body[data-full-zhuyin=true] .teacher-choices.text-choices .choice-label { width:100%; text-align:center; }
}