.teaching-entry{display:flex;align-items:center;gap:16px;padding:16px 20px;background:linear-gradient(120deg,#edf5ff,#f2f0ff);border-bottom:1px solid #dce6f3}.teaching-entry[hidden]{display:none}.teaching-entry strong{color:#23476c;font-size:16px}.teaching-entry p{margin:5px 0 0;color:#64748b;font-size:12px;line-height:1.6}.teaching-entry button{flex-shrink:0}.teaching-dialog{width:min(620px,calc(100vw - 24px));max-height:90dvh;overflow:auto;border:1px solid #dce6f3;border-radius:22px;padding:26px;background:#fbfdff;color:#26364c;box-shadow:0 24px 80px #172c4c40}.teaching-dialog form{padding:0;display:grid;gap:16px}.teaching-dialog header{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.teaching-dialog h3{margin:5px 0;font-size:23px}.teaching-dialog header small{color:#5280ad}.teaching-dialog header button{width:36px;height:36px;border-radius:50%;font-size:22px}.teaching-dialog label,.teaching-speech-settings label{display:grid;gap:8px;margin-bottom:12px;font-size:13px;color:#52627a}.teaching-dialog textarea,.teaching-dialog select,.teaching-speech-settings input,.teaching-speech-settings select{width:100%;box-sizing:border-box;padding:12px;border:1px solid #d9e3ef;border-radius:12px;background:white;font:inherit;color:#26364c}.teaching-dialog textarea{resize:vertical;line-height:1.7;min-height:90px}.teaching-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}.teaching-dialog footer{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px;padding-top:16px;border-top:1px solid #e4ebf4}.teaching-note{font-size:12px;line-height:1.7;color:#78869b}.teaching-dialog [role=status]{font-size:13px;line-height:1.7;color:#486d99}.teaching-speech-settings{margin-top:20px;padding:18px;border:1px solid #e0e7f2;border-radius:16px}.teaching-speech-settings summary{cursor:pointer;font-weight:600}.teaching-speech-settings p{font-size:12px;color:#6a7b91;line-height:1.7}.teaching-speech-settings button{margin:6px 6px 0 0}#openPageNarration[hidden]{display:none!important}@media(max-width:600px){.teaching-fields{grid-template-columns:1fr}.teaching-entry{align-items:stretch;flex-direction:column}.teaching-dialog{padding:20px}}
/* Reader has three compact settings; collapse gracefully for tablet and phone widths. */
#pageNarrationDialog .teaching-fields{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:700px){#pageNarrationDialog .teaching-fields{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){#pageNarrationDialog .teaching-fields{grid-template-columns:1fr}}

/* On-board narration controls: playback continues after the editor closes. */
.narration-dock{position:fixed;z-index:65;left:50%;bottom:calc(76px + env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;align-items:center;gap:10px;padding:9px 12px 9px 14px;border:1px solid rgba(214,226,242,.9);border-radius:999px;background:rgba(250,253,255,.88);color:#31445f;box-shadow:0 12px 34px rgba(40,64,100,.2);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);font-size:13px}.narration-dock[hidden]{display:none}.narration-dock button{display:grid;place-items:center;width:34px;height:34px;border:0;border-radius:50%;background:#e9f1fd;color:#326bb2;font-size:14px;cursor:pointer}.narration-dock button:hover{background:#dceafd;transform:scale(1.06)}.narration-dock button:last-child{background:#fff0f1;color:#bd5360}.narration-dock-pulse{width:9px;height:9px;border-radius:50%;background:#4b91e8;box-shadow:0 0 0 5px #4b91e822;animation:narration-pulse 1.6s infinite}@keyframes narration-pulse{50%{box-shadow:0 0 0 9px #4b91e800}}

/* Voice-first classroom AI teacher. The orb communicates state without displaying its answer. */
.narration-playing .ai-teacher{display:none}.ai-teacher{position:fixed;z-index:64;right:22px;bottom:calc(88px + env(safe-area-inset-bottom));font-family:inherit}.ai-teacher-launch{display:flex;align-items:center;gap:9px;min-height:48px;padding:7px 15px 7px 9px;border:1px solid rgba(222,231,248,.74);border-radius:999px;background:linear-gradient(135deg,rgba(28,39,79,.94),rgba(42,59,113,.9));color:#fff;font-family:inherit;font-size:13px;font-weight:600;line-height:1;letter-spacing:.02em;box-shadow:0 10px 28px rgba(26,37,83,.28),inset 0 1px 0 #ffffff42;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);cursor:pointer;transition:transform .22s,box-shadow .22s}.ai-teacher-launch:hover{transform:translateY(-3px) scale(1.025);box-shadow:0 15px 34px rgba(47,64,130,.34),inset 0 1px 0 #ffffff55}.ai-teacher-launch-orb{position:relative;display:grid;place-items:center;width:31px;height:31px;border-radius:50%;background:radial-gradient(circle at 34% 28%,#d8c9ff,#857cf2 38%,#5069d3 74%,#324594);box-shadow:0 0 18px #8c8df5a8,inset 0 1px 4px #fff9;overflow:hidden}.ai-teacher-launch-orb::before,.ai-teacher-launch-orb::after{content:"";position:absolute;width:22px;height:12px;border:1px solid #ffffff76;border-radius:50%;transform:rotate(-28deg)}.ai-teacher-launch-orb::after{width:13px;height:24px;transform:rotate(35deg)}.ai-teacher-launch-orb i{position:absolute;width:4px;height:4px;border-radius:50%;background:white;box-shadow:0 0 9px white}.ai-teacher-launch-orb i:nth-child(1){transform:translate(-7px,-2px)}.ai-teacher-launch-orb i:nth-child(2){transform:translate(5px,6px);opacity:.7}.ai-teacher-launch-orb i:nth-child(3){transform:translate(6px,-6px);opacity:.55}.ai-teacher-panel{position:absolute;right:0;bottom:58px;width:min(340px,calc(100vw - 28px));padding:19px;border:1px solid rgba(221,231,247,.76);border-radius:24px;background:linear-gradient(145deg,rgba(19,27,57,.94),rgba(30,43,84,.93));color:#f4f7ff;box-shadow:0 24px 70px rgba(14,22,54,.4),inset 0 1px 0 #ffffff26;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);transform-origin:bottom right}.ai-teacher-panel[hidden]{display:none}.ai-teacher-panel header{display:flex;align-items:center;justify-content:space-between}.ai-teacher-panel header div{display:grid;gap:3px}.ai-teacher-panel header small{color:#abb8dd;font-size:10px;letter-spacing:.11em;text-transform:uppercase}.ai-teacher-panel header b{font-size:15px;letter-spacing:.02em}.ai-teacher-panel header button{width:32px;height:32px;border:0;border-radius:50%;background:#ffffff14;color:#e7ecff;font-size:20px;cursor:pointer}.ai-teacher-visual{position:relative;display:grid;place-items:center;width:156px;height:156px;margin:5px auto 2px}.ai-teacher-halo,.ai-teacher-ripple{position:absolute;inset:15px;border:1px solid #a6a7ff35;border-radius:50%;box-shadow:0 0 35px #7e8eff17}.ai-teacher-ripple{inset:28px;border-color:#a6c4ff6b;opacity:0;transform:scale(.7)}.ai-teacher-orb{position:relative;display:flex;align-items:center;justify-content:center;gap:5px;width:86px;height:86px;border-radius:50%;background:radial-gradient(circle at 34% 28%,#d9d4ff 0,#a49af7 20%,#716ce2 44%,#4e60c4 71%,#344996 100%);box-shadow:0 0 34px #7c8cff55,inset 0 3px 9px #fff9,inset 0 -12px 24px #243e9680;overflow:hidden}.ai-teacher-orb::before{content:"";position:absolute;inset:-8px;background:linear-gradient(130deg,#fff5,transparent 46%,#c1cbff28);border-radius:50%}.ai-teacher-orb i{position:relative;width:3px;height:12px;border-radius:4px;background:#fffde8;box-shadow:0 0 8px #fff;opacity:.82;transform:scaleY(.45)}.ai-teacher-orb i:nth-child(2),.ai-teacher-orb i:nth-child(4){height:22px}.ai-teacher-orb i:nth-child(3){height:30px}.ai-teacher-visual[data-state="listening"] .ai-teacher-orb i{animation:teacher-wave .72s ease-in-out infinite alternate}.ai-teacher-visual[data-state="listening"] .ai-teacher-orb i:nth-child(2){animation-delay:.12s}.ai-teacher-visual[data-state="listening"] .ai-teacher-orb i:nth-child(3){animation-delay:.24s}.ai-teacher-visual[data-state="listening"] .ai-teacher-orb i:nth-child(4){animation-delay:.18s}.ai-teacher-visual[data-state="speaking"] .ai-teacher-orb i{animation:teacher-wave .42s ease-in-out infinite alternate}.ai-teacher-visual[data-state="thinking"] .ai-teacher-orb{animation:teacher-think 1.2s ease-in-out infinite alternate}@keyframes teacher-wave{to{transform:scaleY(1.55);opacity:1}}@keyframes teacher-think{to{filter:hue-rotate(25deg);transform:rotate(12deg) scale(.96)}}.ai-teacher-panel>p{min-height:21px;margin:0 0 13px;text-align:center;color:#c4ceec;font-size:12px;letter-spacing:.01em}.ai-teacher-mic{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;min-height:43px;border:1px solid #a9b6ff70;border-radius:999px;background:linear-gradient(120deg,#8d84f0,#647cde);color:white;font-family:inherit;font-size:13px;font-weight:650;box-shadow:0 7px 20px #4e5dcc52;cursor:pointer;transition:transform .18s,filter .18s}.ai-teacher-mic:hover{transform:translateY(-2px);filter:brightness(1.08)}.ai-teacher-mic>span:first-child{display:grid;place-items:center;width:21px;height:21px;border-radius:50%;background:#ffffff28;font-size:8px}.ai-teacher-mic.is-listening>span:first-child{animation:mic-pulse 1s infinite}@keyframes mic-pulse{50%{box-shadow:0 0 0 8px #ffffff00;background:#ff667f}}.ai-teacher-mic:disabled{opacity:.75;cursor:wait}.ai-teacher-fallback{margin-top:12px;color:#b9c4e2;font-size:11px}.ai-teacher-fallback summary{width:max-content;margin:auto;cursor:pointer}.ai-teacher-fallback form{display:grid;grid-template-columns:1fr auto;gap:7px;margin-top:8px}.ai-teacher-fallback textarea{min-width:0;resize:vertical;border:1px solid #ffffff2b;border-radius:11px;padding:9px;background:#ffffff0c;color:#f5f7ff;font-family:inherit;font-size:12px;line-height:1.5}.ai-teacher-fallback textarea::placeholder{color:#9ca8cb}.ai-teacher-fallback form button{padding:0 12px;border:0;border-radius:10px;background:#ffffff1b;color:white;font-family:inherit;font-size:11px;font-weight:600;cursor:pointer}.ai-teacher-privacy{display:block;margin-top:12px;color:#929fc3;font-size:9px;line-height:1.5;text-align:center}.ai-teacher [hidden]{display:none!important}body.code-open .ai-teacher{display:none}@media(max-width:600px){.ai-teacher{right:14px;bottom:calc(82px + env(safe-area-inset-bottom))}.ai-teacher-panel{padding:16px}.narration-dock{bottom:calc(72px + env(safe-area-inset-bottom));max-width:calc(100vw - 20px);white-space:nowrap}}@media(prefers-reduced-motion:reduce){.ai-teacher-visual *, .ai-teacher-launch-orb,.narration-dock-pulse{animation:none!important}}

/* The teacher is available from More tools and only occupies the board after an explicit open. */
.ai-teacher{position:fixed;inset:0;z-index:64;pointer-events:none;font-family:inherit}.ai-teacher-panel{position:fixed;right:20px;bottom:calc(24px + env(safe-area-inset-bottom));width:min(340px,calc(100vw - 28px));max-height:min(640px,calc(100dvh - 48px));overflow:auto;pointer-events:auto}.ai-teacher-menu-button{min-width:86px}.ai-teacher-menu-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.ai-teacher [hidden]{display:none!important}@media(max-width:600px){.ai-teacher-panel{right:14px;bottom:calc(16px + env(safe-area-inset-bottom));max-height:calc(100dvh - 32px)}}

/* Keep the narration editor and its action row inside short viewports. */
.teaching-dialog{box-sizing:border-box;max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overscroll-behavior:contain}
#pageNarrationDialog{width:min(620px,calc(100vw - 24px));height:fit-content!important;max-height:calc(100dvh - 24px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));display:flex;flex-direction:column;padding:clamp(18px,3vw,26px)}
#pageNarrationDialog footer{position:sticky;bottom:0;z-index:1;height:auto!important;min-height:42px;flex:none;margin:0;padding:12px 0 max(0px,env(safe-area-inset-bottom, 0px));background:transparent;border-top:0}
#pageNarrationDialog #narrationStatus:empty{display:none}
#pageNarrationDialog footer button{min-height:42px}
@media(max-width:480px){#pageNarrationDialog{padding:18px}#pageNarrationDialog footer{gap:8px}#pageNarrationDialog footer button{flex:1;min-width:0}}
