.teaching-banner{background:#551d2a;color:#fff;border:1px solid #ed879f;padding:10px 16px;border-radius:10px;display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 16px}.teaching-banner[hidden],.teaching-hint[hidden]{display:none}.teaching-banner p{margin:0}.teaching-hint{margin:8px 16px;color:#eee}.teaching-dialog{width:min(92vw,740px);max-height:85dvh;overflow:auto;background:#171b24;color:#f4f5f7;border:1px solid #536178;border-radius:16px;padding:20px}.teaching-dialog::backdrop{background:#000a}.teaching-dialog header{display:flex;justify-content:space-between;gap:12px;align-items:center}.teaching-dialog h2{font-size:1.2rem}.teaching-dialog article{border-block-end:1px solid #536178;padding-block:12px}.teaching-dialog button,.teaching-dialog input,.teaching-dialog select,.teaching-dialog textarea{font:inherit;max-width:100%;min-height:44px;color:inherit;background:#252d3c;border:1px solid #6c7c95;padding:8px;border-radius:8px}.teaching-dialog label{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-block:10px}.teaching-dialog select[multiple]{display:block;min-height:120px;width:100%}.teaching-dialog textarea{display:block;width:100%;box-sizing:border-box}.teaching-dialog :focus-visible{outline:3px solid #81efdb;outline-offset:3px}.teaching-dialog mark{background:#ffe39b;color:#151515}
.tile.teaching-breach{outline:2px solid #f2b561;outline-offset:-2px}.tile.teaching-breach .tile-heading::after{content:'●';color:#f2b561;margin-inline-start:4px}
.teaching-dialog{box-sizing:border-box;max-width:calc(100vw - 16px);overflow-wrap:anywhere}.teaching-dialog header{position:sticky;top:-20px;background:#171b24;z-index:1;padding-block:8px}.teaching-mushaf a{color:#9eeddf}

.teaching-mushaf [data-word][role=button]{cursor:pointer;border-radius:3px}.teaching-mushaf [data-word][role=button]:focus-visible{outline:2px solid #69dcc4;outline-offset:2px}.teaching-basmala{text-align:center}
/* 2.65 hifz mode (request 24): masked verse, its « Révéler » button, observed peeks. */
.teaching-dialog .teaching-peek-count{color:#fcd34d;font-weight:700}
/* 2.66 teacher's private fault notebook (requests 19 and 22). */
.teaching-faults{border-top:1px solid #333a4a;margin-top:12px;padding-top:8px}.teaching-faults label{display:flex;flex-direction:column;align-items:stretch;text-align:start;gap:4px;margin:6px 0}.teaching-fault-word{font-weight:700}.teaching-fault-list{list-style:none;padding:0;margin:6px 0;display:grid;gap:6px}.teaching-fault-list li{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;border:1px solid #333a4a;border-radius:8px;padding:6px 8px}.teaching-fault-list p{margin:0;line-height:1.5}
/* 2.66 Talqin (request 20): phase shown to students at the top of the room. */
.teaching-talqin-controls{border:1px solid #333a4a;border-radius:10px;margin:10px 0;padding:8px 10px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}.teaching-talqin-controls legend{font-weight:700}.teaching-talqin-controls [aria-pressed=true]{outline:2px solid #69dcc4;outline-offset:1px}.teaching-talqin-controls p{flex-basis:100%;margin:0}
body.is-connected .teaching-talqin:not([hidden]){position:fixed;top:calc(var(--header-h,60px) + 10px);left:50%;transform:translateX(-50%);z-index:36;width:max-content;max-width:min(560px,calc(100vw - 24px));box-sizing:border-box;margin:0;padding:10px 18px;border-radius:12px;background:#0f3d36;color:#e8fffa;border:1px solid #2fd3b5;font-size:1.1rem;font-weight:700;text-align:center;box-shadow:0 8px 24px #0008}body.is-connected .teaching-talqin[data-phase=mine]{background:#5b3d00;border-color:#fcd34d;color:#fff7e0}.teaching-talqin[hidden]{display:none}
/* Below the red rule alert when both are shown. */
body.is-connected .teaching-banner:not([hidden])~.teaching-talqin:not([hidden]){top:calc(var(--header-h,60px) + 96px)}@media (max-width:700px){body.is-connected .teaching-banner:not([hidden])~.teaching-talqin:not([hidden]){top:calc(var(--header-h,60px) + 104px)}}
/* 2.71: the recitation controls wrap on a phone (also outside the « Coran » panel). */
.teaching-talqin-controls label,.teaching-dialog details label,.quran-teacher-tools label{display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px;max-width:100%;min-width:0}
.teaching-talqin-controls select,.teaching-dialog details select,.quran-teacher-tools select{max-width:100%;min-width:0}
.teaching-talqin-plan{display:flex;flex-wrap:wrap;gap:8px;align-items:center;flex-basis:100%;min-width:0}
.teaching-talqin-plan p,.teaching-talqin-plan h4{margin:0;flex-basis:100%}
.teaching-talqin-controls{min-width:0;max-width:100%;box-sizing:border-box}
.teaching-talqin-plan label{flex:1 1 12em}
/* 2.73.1: in a vertical label, a flex basis was a height (12em tall lists). */
.teaching-talqin-plan select{flex:0 0 auto;width:100%;height:auto;min-height:40px}
