@font-face{font-family:system;src:local('Inter'),local('Arial')}*{box-sizing:border-box}html{background:#f5f7fb;color:#15233c;font-family:system,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}body{margin:0}[hidden]{display:none!important}header{height:86px;background:white;border-bottom:1px solid #e5eaf2;padding:0 max(24px,calc((100vw - 1240px)/2));display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:12px;color:#0b388b;text-decoration:none;font-weight:800;font-size:22px;letter-spacing:-.6px}.brand-icon{background:#0b388b;color:white;width:42px;height:42px;display:grid;place-content:center;border-radius:12px;position:relative;font-size:28px}.brand-icon span{position:absolute;right:6px;bottom:7px;color:#ffd209;font-size:16px}.pilot{font-size:10px;letter-spacing:1.4px;color:#617189;border:1px solid #dfe5ee;padding:5px 7px;border-radius:6px;margin-left:5px}.connection{font-size:13px;color:#66758d;display:flex;align-items:center;gap:8px}.connection.live:before{content:'';width:8px;height:8px;background:#2b9c71;border-radius:50%}.connection.offline{color:#a26408}main{max-width:1240px;margin:auto;padding:52px 24px;min-height:calc(100vh - 156px)}h1,h2,p{margin-top:0}h1{font-size:40px;letter-spacing:-1.4px;margin-bottom:12px;line-height:1.15}h2{font-size:25px;line-height:1.4;letter-spacing:-.5px}p{line-height:1.65;color:#6a778c;font-size:15px}.eyebrow,.small-label,.sidebar-title{font-size:11px;letter-spacing:1.7px;font-weight:800;color:#6b7b95}.eyebrow{margin-bottom:20px;color:#0b388b}.landing{display:grid;grid-template-columns:1.25fr 1fr;gap:100px;padding:36px 20px 45px;align-items:center}.intro h1{font-size:62px;line-height:1.06;letter-spacing:-2.6px}.intro h1 span{color:#0b388b}.intro>p{max-width:440px;font-size:17px;margin:24px 0}.intro-pills{display:flex;gap:10px;flex-wrap:wrap}.intro-pills span{background:#e9eef7;color:#355582;padding:9px 13px;border-radius:30px;font-size:12px}.lesson-preview{margin-top:36px;max-width:435px;background:white;border:1px solid #e1e7f0;border-radius:16px;padding:22px 24px;box-shadow:0 10px 25px #102c5710;transform:rotate(-1.5deg)}.preview-top{display:flex;justify-content:space-between;font-size:12px;color:#8490a3}.live-dot{color:#238264;font-size:10px;font-weight:800;letter-spacing:1px}.lesson-preview p{margin:28px 0;color:#233b62;font-size:21px}.lesson-preview strong{background:#fff2ae;padding:3px 10px;border-radius:5px}.preview-bottom{border-top:1px solid #edf0f5;padding-top:14px;font-size:12px;color:#7f8a9a;display:flex;justify-content:space-between}.login-card{background:white;border:1px solid #e2e7f0;border-radius:22px;padding:40px;box-shadow:0 20px 50px #17356008}.login-card h2{font-size:30px;margin:22px 0 10px}.login-card p{margin-bottom:25px}label{display:block;font-size:13px;font-weight:600;margin-bottom:10px}input,textarea,select{width:100%;font:inherit;font-size:15px;border:1px solid #dbe2ed;padding:13px 15px;border-radius:10px;background:#fff;color:#172641;outline:none}input:focus,textarea:focus,select:focus{border-color:#0b388b;box-shadow:0 0 0 3px #0b388b15}textarea{resize:vertical;line-height:1.6}button,.primary{font:inherit;font-size:14px;font-weight:650;border:none;border-radius:10px;padding:13px 18px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;transition:background .15s}button:disabled{cursor:wait;opacity:.55}.primary{background:#0b388b;color:white}.primary:hover{background:#082b6a}.secondary{background:#eaf0fa;color:#0b388b}.quiet{background:transparent;color:#6b7890}.quiet:hover{background:#e9eef6}.danger{color:#a64747}.success{background:#e6f6ee;color:#23764f}form .primary{margin-top:16px}.login-card form .primary{width:100%;justify-content:space-between}.note{font-size:12px;color:#8893a5;line-height:1.65;margin-top:20px}.page-title{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:32px}.page-title .eyebrow{margin-bottom:12px}.page-title p{margin-bottom:0}.toolbar{display:flex;gap:6px;flex-wrap:wrap}.create-card{display:flex;align-items:end;gap:20px;background:white;border:1px solid #e0e6ef;border-radius:16px;padding:24px;margin-bottom:28px}.create-card>div{flex:1}.create-card .primary{margin-top:0;min-height:46px}.room-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.room-card{background:#fff;border:1px solid #e0e6ef;border-radius:16px;padding:24px}.room-card h2{font-size:20px;margin-bottom:12px}.room-card .tag{margin-bottom:20px;display:inline-block}.room-card button{width:100%}.empty{padding:36px;color:#7b889a;border:1px dashed #d3dce9;border-radius:16px}.class-grid{display:grid;grid-template-columns:270px 1fr;gap:28px;align-items:start}aside{background:#fff;border:1px solid #e1e7f0;border-radius:16px;padding:24px 16px}.sidebar-title{padding:0 8px 16px;display:flex;justify-content:space-between}.sidebar-title span{color:#0b388b;background:#eef2f9;padding:1px 6px;border-radius:4px}nav button{width:100%;display:flex;justify-content:start;text-align:left;background:transparent;color:#607089;padding:14px 12px;margin-bottom:6px;gap:12px;font-size:13px}nav button.active{background:#edf2fb;color:#0b388b}nav button span:first-child{background:#e9edf4;border-radius:7px;min-width:27px;height:27px;display:grid;place-content:center;font-size:12px}nav button.active span:first-child{background:#0b388b;color:white}nav button span:nth-child(2){overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}nav button em{font-style:normal;color:#2d9467}.add-button{width:100%;background:#fff9dc;color:#776018;margin-top:12px;font-size:13px}.sidebar-note{font-size:12px;line-height:1.7;color:#93a0b1;margin:28px 10px 0}.exercise-card{background:white;border:1px solid #e1e7f0;border-radius:18px;padding:36px;min-height:455px}.exercise-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px;color:#8b98ab;font-size:12px}.tag{background:#fff3b5;color:#786317;padding:6px 10px;border-radius:6px;font-size:11px;font-weight:700}.exercise-card h2{font-size:26px;font-weight:650;margin-bottom:26px;white-space:pre-wrap;overflow-wrap:anywhere}#answer-label{font-size:13px;margin-bottom:10px}.answer-input{min-height:135px;background:#fcfdff;font-size:18px}.gap-input{min-height:50px}.choice{width:100%;text-align:left;justify-content:start;border:1px solid #e1e7f0;background:#fff;color:#314462;padding:17px;margin-bottom:10px;font-weight:500;white-space:pre-wrap;overflow-wrap:anywhere}.choice.selected{border-color:#0b388b;background:#edf3ff;color:#0b388b}.choice:disabled{cursor:default;opacity:1}.teacher-answer{background:#f5f7fb;border:1px solid #e6ebf2;border-radius:10px;padding:20px;min-height:90px;white-space:pre-wrap;font-size:18px;line-height:1.6;overflow-wrap:anywhere}.teacher-answer.blank{color:#a1adbd;font-size:15px}.save-state{font-size:12px;color:#8b99ad;margin:12px 0 24px;min-height:16px}.save-state.saved{color:#2b946c}.save-state.pending{color:#aa771a}#feedback{border-radius:12px;padding:16px 20px;background:#edf3fa;margin:20px 0;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px}#feedback.correct{background:#eaf6ee;color:#2b7552}#feedback.retry{background:#fff7df;color:#866926}#feedback-form{border-top:1px solid #edf0f5;padding-top:22px}.feedback-actions{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}.exercise-footer{margin-top:30px;padding-top:24px;border-top:1px solid #edf0f5;display:flex;justify-content:space-between;align-items:center;gap:14px}.exercise-footer>span{font-size:12px;color:#9aa5b5}.invite-panel{background:#edf3fd;border:1px solid #d7e3fa;border-radius:15px;padding:24px;margin-bottom:26px}.invite-panel p{font-size:13px;margin:8px 0 16px}.copy-row{display:flex;gap:10px}.copy-row input{font-size:12px}.blocked{text-align:center;padding:80px 20px}.blocked p{margin:24px auto;max-width:450px}dialog{border:1px solid #dfe5ee;border-radius:20px;width:min(560px,95vw);padding:30px;color:#15233c}dialog::backdrop{background:#15233c66;backdrop-filter:blur(3px)}.dialog-top{display:flex;justify-content:space-between;align-items:start}.dialog-top h2{margin-bottom:25px}dialog label{margin-top:16px}#toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);background:#182b49;color:white;padding:14px 22px;border-radius:12px;max-width:90vw;box-shadow:0 8px 25px #0b388b22;z-index:20;font-size:14px}footer{max-width:1240px;margin:auto;padding:22px 24px;font-weight:700;color:#6d7c92;font-size:12px;display:flex;justify-content:space-between}footer span{font-weight:400;color:#9ba6b6}:focus-visible{outline:3px solid #ffd209;outline-offset:3px}@media(max-width:950px){.landing{gap:40px;padding:20px 0}.intro h1{font-size:48px}.login-card{padding:28px}.room-grid{grid-template-columns:repeat(2,1fr)}.class-grid{grid-template-columns:220px 1fr;gap:16px}.exercise-card{padding:26px}.page-title{align-items:start}.toolbar{justify-content:end}}@media(max-width:680px){header{height:70px;padding:0 18px}.brand{font-size:19px}.brand-icon{width:34px;height:34px;font-size:24px}.pilot{display:none}.connection{font-size:11px}main{padding:30px 18px}.landing{grid-template-columns:1fr;gap:32px}.intro h1{font-size:43px}.intro>p{font-size:15px}.lesson-preview{display:none}.login-card{padding:28px}.page-title{display:block}.page-title h1{font-size:30px}.toolbar{justify-content:start;margin-top:20px}.create-card{display:block;padding:20px}.create-card .primary{width:100%;margin-top:14px}.room-grid{grid-template-columns:1fr}.class-grid{grid-template-columns:1fr}.sidebar-note{display:none}aside{padding:16px}nav{display:flex;gap:6px;overflow-x:auto}nav button{min-width:145px;max-width:180px;margin-bottom:0}.sidebar-title{padding-bottom:12px}.exercise-card{padding:24px 20px}.exercise-card h2{font-size:22px}.exercise-footer>span{display:none}.exercise-footer{justify-content:end}.copy-row{display:block}.copy-row button{margin-top:10px;width:100%}footer span{max-width:180px;text-align:right}.intro-pills span{font-size:11px}} .library-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:50px 0 24px}.library-heading h2{margin:0}.library-heading .eyebrow{margin-bottom:10px}.lesson-heading{display:flex;justify-content:space-between;gap:20px;align-items:start;margin-bottom:24px}.lesson-heading h2{margin-bottom:10px;font-size:27px}.lesson-heading p{margin:0;font-size:13px}.lesson-heading .eyebrow{margin-bottom:10px}.lesson-page{min-width:0}.exercise-cards{display:grid;gap:22px}.exercise-cards .exercise-card{min-height:0}.exercise-top{gap:12px;flex-wrap:wrap;margin-bottom:20px}.exercise-top .toolbar{margin-left:auto}.gap-sentence{font-size:22px;line-height:2.7;color:#233b62;white-space:pre-wrap;overflow-wrap:anywhere;padding:14px 0}.inline-gap{display:inline-block;width:145px;max-width:75vw;min-width:85px;margin:0 5px;padding:8px 10px;border-radius:7px;border:0;border-bottom:2px solid #0b388b;background:#eef3fc;font-size:19px;text-align:center}.inline-gap[readonly]{background:#fff5c9;border-color:#c5ac47;color:#344764}.feedback-box{border-radius:12px;padding:16px 20px;background:#edf3fa;margin:20px 0;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px}.feedback-box.correct{background:#eaf6ee;color:#2b7552}.feedback-box.retry{background:#fff7df;color:#866926}.card-feedback{border-top:1px solid #edf0f5;padding-top:18px}.card-feedback textarea{font-size:14px}.editor-toolbar{display:flex;justify-content:space-between;gap:15px;margin:22px 0}.editor-card .field-label{margin-top:18px}.editor-card label{font-weight:600}.editor-card textarea{background:#fcfdff}.editor-card{max-width:900px}#attach-library{display:grid;gap:14px;max-height:55vh;overflow-y:auto}#attach-library .room-card{padding:18px}#attach-library .room-card h2{font-size:19px;margin:0 0 8px}#attach-library .room-card p{margin-bottom:14px}nav button:disabled{cursor:default;opacity:1}#lesson-list button span:nth-child(2){white-space:normal;line-height:1.4}.exercise-cards .teacher-answer{min-height:75px}.exercise-cards .answer-input{font-size:17px}#editor>input{max-width:900px}.lesson-page .toolbar{justify-content:start}@media(max-width:950px){.lesson-heading{display:block}.lesson-heading .toolbar{margin-top:16px}.class-grid{grid-template-columns:230px 1fr}.gap-sentence{font-size:20px}}@media(max-width:680px){.class-grid{grid-template-columns:1fr}.library-heading{align-items:start}.library-heading .primary{font-size:12px;padding:12px}.lesson-heading h2{font-size:24px}.inline-gap{width:115px;font-size:17px}.gap-sentence{font-size:19px;line-height:2.9}.exercise-cards .exercise-card{padding:22px 18px}.exercise-top .toolbar{gap:0}.exercise-top button{padding:8px 12px}.editor-toolbar{flex-wrap:wrap}.editor-card .exercise-top{gap:4px}.lesson-heading .toolbar button{font-size:12px}} .rich-toolbar{display:flex;flex-wrap:wrap;gap:6px;padding:10px;background:#E8EBF0}.rich-toolbar label{display:flex;align-items:center;gap:5px;font-size:12px}.rich-toolbar input[type=color]{width:36px;padding:2px}.rich-area{min-height:160px;padding:18px;border:1px solid #E8EBF0;background:white;overflow-wrap:anywhere}.rich-content{font-size:18px;line-height:1.6;overflow-wrap:anywhere}.audio-block{display:flex;flex-wrap:wrap;gap:10px}.audio-block input[type=range],.audio-block .note{width:100%}.audio-block audio{display:none} .audio-volume{display:flex;align-items:center;gap:10px;width:100%}.audio-volume input[type=range]{flex:1;width:auto}.audio-volume span{min-width:45px} .exercise-image{display:block;max-width:100%;max-height:500px;object-fit:contain;margin-bottom:16px}.material-viewer{width:100%;min-height:360px;border:1px solid #E8EBF0}.letter-bank,.sentence-row{display:flex;gap:8px;align-items:center;margin-bottom:10px}.sentence-row span{flex:1}.letter-bank{flex-wrap:wrap} .role-check{display:flex;align-items:center;gap:8px;margin:8px 0}.role-check input{width:auto}#role-navigation{flex-wrap:wrap}#role-navigation[hidden]{display:none} /* Consistent type in sign-in controls and help text. */ .login-card p,.login-card .note,.login-card summary,.login-card label,.login-card input,.login-card button,.login-card a.primary{font-size:16px;line-height:1.5;font-family:inherit} .editor-card.validation-error{border:2px solid #b34141}.validation-message{color:#b34141;font-size:16px;font-weight:600}[aria-invalid="true"]{border-color:#b34141;outline-color:#b34141} .exercise-card.teacher-note{background:#fff8cf;border:2px solid #FFD209}.teacher-note-visibility{display:block;color:#0B388B;font-size:16px;font-weight:700;margin:0 0 16px}.teacher-note .tag{background:#FFD209;color:#0B388B} .pdf-file-card{display:flex;align-items:center;gap:20px;padding:24px;background:#E8EBF0;border:2px solid transparent;border-radius:16px;color:#0B388B;text-decoration:none;min-height:100px}.pdf-file-card:hover,.pdf-file-card:focus-visible{border-color:#0B388B;background:#f0f3fa}.pdf-file-icon{position:relative;flex:none;display:block}.pdf-file-icon>span{position:absolute;left:0;top:25px;background:#0B388B;color:#FFFFFF;padding:3px 7px;border-radius:4px;font-size:13px;font-weight:800}.pdf-file-text{display:flex;flex-direction:column;gap:6px}.pdf-file-text strong{font-size:20px}.pdf-file-text>span{font-size:14px;color:#536481} button{transition:background-color .15s,box-shadow .15s,transform .1s}button:not(:disabled):hover{box-shadow:0 0 0 2px #0B388B33}button:not(:disabled):active{transform:scale(.97);box-shadow:inset 0 2px 5px #0B388B33}button[aria-busy="true"]{cursor:wait;opacity:.8}button[aria-busy="true"]::after{content:'';display:inline-block;width:14px;height:14px;margin-left:10px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;vertical-align:middle;animation:button-spin .7s linear infinite}@keyframes button-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){button{transition:none}button[aria-busy="true"]::after{animation:none}}#toast{z-index:1000} /* Invitations and pupil assignment: clear labels and generous field spacing. */ #invite-account-form>div,#assign-student-form>div{display:grid;grid-template-columns:minmax(0,1fr);row-gap:12px;min-width:0} #invite-account-form label,#assign-student-form label,#account-invite-output label,#invite-panel strong{display:block;font-size:18px;font-weight:700;line-height:1.5;margin:0} #invite-account-form select,#assign-student-form select{margin:0 0 16px;min-height:48px;padding:10px 12px;width:100%} #invite-account-form,#assign-student-form{gap:24px;align-items:end} #account-invite-output{padding:24px;background:#FFFFFF;border:1px solid #E8EBF0;border-radius:16px;margin:20px 0} #account-invite-output input{margin:14px 0 18px} #invite-panel p,#account-invites p{font-size:17px;font-weight:600;line-height:1.7} #invite-panel .copy-row{margin-top:18px;gap:16px} @media(max-width:680px){#invite-account-form,#assign-student-form{padding:20px}#invite-account-form label,#assign-student-form label,#account-invite-output label,#invite-panel strong{font-size:17px}} .back-button,#editor-back{background:#E8EBF0;color:#0B388B;border:2px solid #0B388B;border-radius:12px;padding:12px 18px;font-size:16px;font-weight:700}.meeting-button,#meeting-link{display:inline-flex;align-items:center;gap:8px;background:#FFFFFF;color:#0B388B;border:3px solid #0B388B;border-radius:12px;padding:12px 18px;font-size:16px;font-weight:700;text-decoration:none} .question-editor,.question-row{padding:20px;margin:16px 0;border:1px solid #E8EBF0;border-radius:16px;background:#fff}.question-editor textarea{margin:12px 0}.question-row .choice{margin:6px}.question-row.correct{border-color:#46a36e}.question-row.retry{border-color:#d09849} /* Pending batch: one fixed spacing scale for actions across all cabinets. */ :root{--action-gap:16px;--section-gap:24px} .toolbar,.feedback-actions,.copy-row,.rich-toolbar,.audio-block,.letter-bank,.sentence-row,.editor-toolbar,.dialog-top,.exercise-top,.exercise-footer,.page-title,.library-heading,.lesson-heading{gap:var(--action-gap)} .toolbar,.feedback-actions,.copy-row,.rich-toolbar,.audio-block,.letter-bank,.editor-toolbar{flex-wrap:wrap} :where(button,a.primary,a.back-button,a.meeting-button)+:where(button,a.primary,a.back-button,a.meeting-button){margin-inline-start:var(--action-gap);margin-block-start:var(--action-gap)} :is(.toolbar,.feedback-actions,.copy-row,.rich-toolbar,.audio-block,.letter-bank,.sentence-row,.editor-toolbar,.dialog-top,.exercise-top,.exercise-footer,.page-title,.library-heading,.lesson-heading)>:is(button,a.primary,a.back-button,a.meeting-button){margin:0} .room-card>button,.question-row>.choice{display:flex;width:100%;margin:0 0 var(--action-gap);margin-inline-start:0} .choice{margin-bottom:var(--action-gap)} nav{gap:var(--action-gap)} nav button{margin-bottom:var(--action-gap)} nav button+button{margin-inline-start:0;margin-block-start:0} .rich-toolbar{padding:16px} .question-editor,.question-row{padding:24px;margin:var(--section-gap) 0} #invite-panel .copy-row{gap:var(--action-gap)} dialog form>input,dialog form>textarea,dialog form>select{margin-bottom:var(--action-gap)} @media(max-width:680px){nav button{margin:0}.copy-row{flex-direction:column;align-items:stretch}.page-title,.lesson-heading,.library-heading,.editor-toolbar{flex-wrap:wrap}.exercise-top{align-items:flex-start;flex-wrap:wrap}} /* Role buttons stay inside the header and identify the current cabinet. */ header{height:auto;min-height:86px;padding-block:16px;gap:16px;flex-wrap:wrap} #role-navigation{display:flex;flex:0 1 auto;max-width:100%;min-width:0;gap:12px;flex-wrap:wrap;overflow:visible;align-items:center} #role-navigation button{width:auto;min-width:0;max-width:100%;min-height:36px;padding:8px 12px;margin:0;border:1px solid #d9e1ed;border-radius:9px;background:#FFFFFF;color:#45618a;font-size:13px;line-height:1.25;justify-content:center;text-align:center;white-space:normal;overflow-wrap:anywhere} #role-navigation button.active-role{background:#edf2fa;color:#284c82;border-color:#bacbe3;box-shadow:none} #role-navigation button:hover{background:#E8EBF0} #role-navigation button.active-role:hover{background:#e3ebf7} @media(max-width:680px){header .brand{order:0}header .connection{order:1}#role-navigation{order:2;flex-basis:100%}} .exercise-menu{position:relative}.exercise-menu summary{list-style:none;cursor:pointer;border:1px solid #0B388B;border-radius:9px;color:#0B388B;padding:6px 12px;font-size:22px;line-height:1}.exercise-menu summary::-webkit-details-marker{display:none}.exercise-menu-actions{position:absolute;right:0;top:calc(100% + 8px);z-index:20;display:flex;flex-direction:column;gap:16px;min-width:210px;padding:16px;background:#FFFFFF;border:1px solid #E8EBF0;border-radius:12px;box-shadow:0 8px 24px #0B388B25}.exercise-menu-actions>button{margin:0;width:100%}.exercise-menu summary:focus-visible{outline:3px solid #FFD209;outline-offset:3px}.exercise-card.pointer-flash{animation:exercise-pointer .5s ease-in-out 6;outline:4px solid #0B388B;outline-offset:3px}@keyframes exercise-pointer{0%,100%{outline-color:#0B388B;box-shadow:0 0 0 6px #0B388B22}50%{outline-color:transparent;box-shadow:none}}@media(prefers-reduced-motion:reduce){.exercise-card.pointer-flash{animation:none;outline-color:#0B388B}} #page-controls,#editor-pages{display:flex;flex-direction:column;align-items:stretch;gap:16px;padding:20px;background:#FFFFFF;border:1px solid #E8EBF0;border-radius:16px;margin:20px 0 24px;min-width:0} .page-panel-label{font-size:13px;font-weight:700;color:#536481}.page-tabs{display:flex;flex-wrap:wrap;gap:16px;min-width:0}.page-tab-group{display:flex;align-items:center;gap:8px;padding:6px;border:1px solid #E8EBF0;border-radius:12px;max-width:100%;min-width:0}.page-tab-group>button{width:auto;min-width:0;margin:0;padding:8px 12px;font-size:14px}.page-tab-group>button:first-child{overflow-wrap:anywhere;white-space:normal;text-align:left}.page-tab-group>button:not(:first-child){padding:8px;flex-shrink:0}.page-actions-menu summary{cursor:pointer;color:#0B388B;font-size:14px;font-weight:650;list-style:none;padding:10px 0}.page-actions-menu summary::-webkit-details-marker{display:none}.page-actions{display:flex;flex-wrap:wrap;gap:16px;padding-top:12px;border-top:1px solid #E8EBF0}.page-actions>button{margin:0;font-size:13px;padding:10px 12px} .room-card.course-open{background:#eaf0fa;border:2px solid #0B388B;box-shadow:0 0 0 2px #FFD209}.exercise-title{font-size:28px;font-weight:750;line-height:1.35;color:#0B388B;margin:0 0 20px;overflow-wrap:anywhere}.exercise-instruction{font-size:17px;line-height:1.65;color:#314462;margin:0 0 24px;white-space:pre-wrap;overflow-wrap:anywhere}.exercise-title-input{font-size:20px;font-weight:700;margin-bottom:20px} .answer-confirm-actions{display:flex;justify-content:flex-end;gap:16px;margin-top:24px}.answer-confirm-actions>button{margin:0} /* Next batch: consistent cards and compact invitation history. */ .brand-logo{width:42px;height:42px;object-fit:contain;border-radius:10px;flex:none} .room-card{text-align:center}.room-card>button{width:100%;margin-inline:0;margin-block-start:0;margin-block-end:16px;justify-content:center}.room-card>button:last-child{margin-bottom:0} .room-card.course-open{background:#FFFFFF;border:2px solid #0B388B;box-shadow:none}.room-card.course-open>button{border:1px solid #0B388B}.room-card.course-open>button:first-of-type{background:#0B388B;color:#FFFFFF} .classes-heading{display:flex;align-items:center;flex-wrap:wrap;gap:16px;margin-bottom:12px}.classes-heading h1{margin:0}.compact-invite{font-size:13px;padding:9px 13px;border:1px solid #0B388B;white-space:nowrap;margin:0} #account-invites{display:flex;flex-direction:column;gap:0;background:#FFFFFF;border:1px solid #E8EBF0;border-radius:12px;overflow:hidden}.invitation-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:14px 18px;border-bottom:1px solid #E8EBF0}.invitation-row:last-child{border-bottom:0}.invitation-info{display:flex;flex-direction:column;gap:4px;flex:1;min-width:140px}.invitation-info .note{font-size:13px;font-weight:400}.invitation-status{font-size:14px;color:#536481}.invitation-row>button{margin:0;padding:8px 12px;width:auto;font-size:13px} /* Class actions have a common height and clear space before the lesson. */ #classroom>.toolbar{margin-bottom:32px;align-items:center;gap:16px} #classroom>.page-title .toolbar{align-items:center} #classroom>.toolbar>button,#classroom>.toolbar>a,#classroom>.page-title .toolbar>button{min-height:48px;padding:10px 16px;font-size:14px;line-height:1.4;box-sizing:border-box;border:2px solid #0B388B;border-radius:12px;margin:0;display:inline-flex;align-items:center;justify-content:center} #classroom .class-grid{margin-top:0}.library-heading,.page-title{margin-bottom:32px}.editor-toolbar{margin-bottom:28px}.room-grid{margin-bottom:32px} /* Explicitly prevent adjacent-action margins from shifting full-width card buttons. */ .room-card>button+button{margin-inline:0;margin-block-start:0;width:100%} .student-preview{margin:20px 0 24px}.exercise-edit-fields{border-top:1px solid #E8EBF0;padding-top:16px}.exercise-edit-fields>summary{cursor:pointer;font-size:15px;font-weight:700;color:#0B388B;padding:10px 0;margin-bottom:16px}.student-preview-content audio,.student-preview-content video{display:block;width:100%;max-width:100%;margin:16px 0} /* Keep library headings and related actions together, without stretching across the page. */ #dashboard .library-heading{justify-content:flex-start;align-items:center;gap:24px;margin:36px 0 16px;flex-wrap:wrap} #dashboard .library-actions{justify-content:flex-start;align-items:center;gap:16px;margin:0 0 24px;flex-wrap:wrap} #dashboard .library-heading>button,#dashboard .library-actions>button{width:auto;min-height:40px;padding:10px 14px;font-size:14px;margin:0} #dashboard .library-heading h2{font-size:27px} /* Separate creation from the library title without pushing it to the far edge. */ #dashboard .library-heading{column-gap:56px;row-gap:20px} @media(max-width:680px){#dashboard .library-heading{column-gap:24px;row-gap:20px}} /* Compact lesson and account lists. Controls use a single accessible overflow menu. */ .library-list,.user-groups{display:flex;flex-direction:column;gap:20px;width:100%;max-width:900px;margin:20px 0 32px} .lesson-rows,.user-rows,#my-students{display:flex;flex-direction:column;gap:10px} .lesson-row,.user-row,.student-row{display:flex;align-items:center;gap:16px;padding:14px 18px;border:1px solid #E8EBF0;border-radius:12px;background:white;min-width:0;text-align:left} .room-card.user-row{padding:14px 18px;text-align:left;box-shadow:none}.lesson-row-info,.user-info{flex:1;min-width:0}.lesson-row-info{display:flex;flex-direction:column;gap:4px}.user-row h2,.student-row h2{font-size:17px;line-height:1.4;margin:0 0 4px}.user-row p,.student-row p{margin:0;font-size:12px;overflow-wrap:anywhere} .lesson-row .lesson-name{display:block;text-align:left;background:transparent;border:0;color:#0B388B;font-size:16px;font-weight:650;padding:0;margin:0;box-shadow:none;white-space:normal;overflow-wrap:anywhere}.lesson-row>.secondary,.student-row>button{margin:0;padding:8px 12px;font-size:13px;flex-shrink:0}.drag-handle{cursor:grab;color:#8A98AD;font-size:24px;padding:4px;flex-shrink:0}.dragging{opacity:.45}.drop-target{outline:2px solid #0B388B;background:#EEF4FC} .row-menu{position:relative;flex-shrink:0}.row-menu>summary{list-style:none;cursor:pointer;color:#0B388B;font-size:25px;padding:0 12px;border-radius:8px;line-height:36px;border:1px solid #E8EBF0}.row-menu>summary::-webkit-details-marker{display:none}.row-menu>summary:focus-visible{outline:3px solid #FFD209}.row-menu[open]{z-index:20}.row-menu-body{position:absolute;right:0;top:calc(100% + 6px);display:flex;flex-direction:column;align-items:stretch;gap:8px;padding:12px;min-width:240px;max-width:min(320px,80vw);background:white;border:1px solid #D6DFED;border-radius:12px;box-shadow:0 12px 32px #10264B26;z-index:20}.row-menu-body>button,.row-menu-body>button+button{margin:0;width:100%;text-align:left;font-size:13px;padding:9px 12px}.row-menu-body label{margin:0;font-size:13px}.row-menu-body .role-check{display:flex;gap:8px;align-items:center}.row-menu-body select{margin-top:6px}.row-menu-body .note{font-size:12px;margin:0} .module-heading{display:flex;align-items:center;gap:16px;justify-content:space-between;margin:0 0 12px}.module-heading h3,.user-group h3{font-size:18px;margin:0}.user-group h3{margin:12px 0}.user-group .note{font-weight:400}#create-password-student{margin:12px 0 28px}#new-module{margin:0 0 20px;padding:9px 14px;font-size:14px}#my-students{max-width:900px;margin-bottom:32px}.attach-filters{display:flex;gap:16px;flex-wrap:wrap;margin:20px 0}.attach-filters>div{flex:1;min-width:180px}#attach-dialog{width:min(940px,94vw);overflow:visible}#attach-dialog .library-list{max-height:55vh;overflow:auto;padding-bottom:16px}#attach-dialog .lesson-name{cursor:default} @media(max-width:680px){.lesson-row,.user-row,.student-row{padding:12px;gap:10px}.lesson-row .lesson-name{font-size:15px}.drag-handle{font-size:20px}.row-menu-body{min-width:220px}.library-list,.user-groups{gap:16px}} /* Library refreshes must not move the viewport when lessons are reordered. */ #dashboard{overflow-anchor:none} .user-name-heading{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.user-name-heading h2{margin:0}.editor-badge{display:inline-flex;align-items:center;background:#FFD209;color:#0B388B;border-radius:35px;padding:4px 10px;font-size:13px;font-weight:650;line-height:1.4;white-space:nowrap}.user-name-heading+.note{margin-top:4px} /* Matching pairs and annotations. */ .matching-columns{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}.matching-column{display:flex;flex-direction:column;gap:12px}.match-button{display:flex;align-items:center;justify-content:space-between;gap:10px;text-align:left;width:100%;margin:0;padding:14px 16px;background:white;border:2px solid #D6DFED;border-radius:12px;color:#0B388B;font-size:16px;line-height:1.45;overflow-wrap:anywhere}.match-button.selected{outline:3px solid #FFD209;border-color:#0B388B}.match-button.paired{background:#EEF4FC;border-color:#0B388B}.match-index:empty{display:none}.match-index{flex-shrink:0;background:#0B388B;color:white;font-size:13px;border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.pair-row{display:grid;grid-template-columns:1fr 1fr auto;align-items:start;gap:12px;margin-bottom:12px}.pair-row textarea{min-width:0;margin:0}.pair-row>button{margin:0} .image-drawing{width:100%}.drawing-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 16px}.drawing-toolbar>button{margin:0;padding:8px 12px;font-size:13px}.drawing-toolbar>button.selected{outline:2px solid #0B388B;outline-offset:2px}.drawing-colors{display:flex;gap:8px;align-items:center}.drawing-color,.rich-color-swatch{width:26px;height:26px;min-width:26px;margin:0;padding:0;border:1px solid #9DA9B9;border-radius:50%}.drawing-color.selected,.rich-color-swatch.selected{outline:2px solid #0B388B;outline-offset:3px;box-shadow:0 0 0 2px white}.image-drawing-stage{position:relative;display:inline-block;max-width:100%;line-height:0}.image-drawing-stage .exercise-image{display:block;max-width:100%;width:auto;margin:0}.drawing-canvas{position:absolute;inset:0;width:100%;height:100%;cursor:crosshair;pointer-events:none} .exercise-card.teacher-note,.student-preview-content.teacher-note{background:#F1F3F5;border:1px solid #D9DFE7;border-radius:16px;padding:36px}.teacher-note .rich-content,.teacher-note .rich-content *{font-size:12px!important;line-height:1.6}.teacher-note .exercise-title{font-size:20px}.teacher-note .tag{background:#E0E5EB;color:#536481}.teacher-note-visibility{font-size:12px;color:#68758A}.teacher-note .rich-area{font-size:12px} .rich-color-group{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:6px 10px;border:1px solid #CCD5E2;border-radius:10px}.rich-toolbar input.selected-color{border:2px solid #0B388B;border-radius:7px;box-shadow:0 0 0 2px white}.rich-command{position:relative}.rich-command:hover::after,.rich-command:focus-visible::after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);background:rgba(15,33,61,.84);color:white;border-radius:8px;padding:7px 10px;font-size:12px;white-space:nowrap;pointer-events:none;z-index:50} @media(max-width:680px){.matching-columns{gap:12px}.match-button{padding:10px;font-size:14px}.pair-row{gap:8px}.exercise-card.teacher-note,.student-preview-content.teacher-note{padding:24px}} .teacher-note .student-preview-content.teacher-note{padding:0;border:0;background:transparent} .test-options-editor{display:flex;flex-direction:column;gap:12px;margin:16px 0}.test-option-row{display:flex;align-items:center;gap:12px}.test-option-row input[type=text]{flex:1;min-width:0;margin:0}.test-option-row>button{margin:0}.test-option-correct{display:flex;align-items:center;gap:6px;margin:0;white-space:nowrap;font-size:13px}.test-option-correct input{width:auto;margin:0}.option-limit{background:#FFF6D1;color:#675000;padding:10px 14px;border-radius:10px;font-size:13px;margin:0}.teacher-correct{background:#DFF3DF!important;border-color:#80BA84!important;color:#204B25!important}.answer-error{border:2px solid #D64242!important;box-shadow:0 0 0 1px #D64242;background:#FFF1F1!important}.teacher-key-wrap{position:relative;display:inline-block}.teacher-key-tooltip{display:none;position:absolute;bottom:calc(100% + 8px);left:0;min-width:max-content;max-width:300px;padding:8px 12px;border-radius:9px;border:1px solid #8CC28F;background:#DFF3DF;color:#204B25;font-size:14px;z-index:30;white-space:pre-wrap;line-height:1.4}.teacher-key-wrap:hover>.teacher-key-tooltip,.teacher-key-wrap:focus-within>.teacher-key-tooltip{display:block}.teacher-key-value{padding:9px 12px;background:#DFF3DF;border-radius:9px;color:#204B25;font-size:14px}.teacher-key-wrap[data-correct-hint]:hover::after{content:attr(data-correct-hint);position:absolute;bottom:100%;left:0;background:#DFF3DF;color:#204B25;padding:8px 12px;border-radius:8px;z-index:30}.inline-gap{appearance:auto;min-width:70px}.question-row.retry{background:transparent;border-color:#E8EBF0}@media(max-width:680px){.test-option-row{flex-wrap:wrap}.test-option-row input[type=text]{flex-basis:100%}.teacher-key-tooltip{min-width:120px;max-width:220px}} .teacher-correct.answer-error{background:#DFF3DF!important}.teacher-slot-key{display:block;background:#DFF3DF;color:#204B25;padding:3px 7px;margin-top:4px;border-radius:7px;font-size:12px} .teacher-dropdown{position:relative;display:inline-block;line-height:1.4}.teacher-dropdown-trigger{display:inline-flex;align-items:center;justify-content:space-between;gap:8px;font-weight:400;color:#233B62}.teacher-dropdown-options{position:absolute;top:calc(100% + 4px);left:5px;min-width:145px;max-width:300px;max-height:260px;overflow:auto;display:flex;flex-direction:column;gap:4px;padding:6px;background:white;border:1px solid #CBD5E2;border-radius:9px;box-shadow:0 6px 20px #10264B26;z-index:40;white-space:normal}.teacher-dropdown-options[hidden]{display:none}.teacher-dropdown-option,.teacher-dropdown-option+button{margin:0;padding:9px 12px;width:100%;text-align:left;font-size:16px;font-weight:400;background:white;border:1px solid transparent;border-radius:6px;color:#233B62}.teacher-dropdown-option:focus-visible{outline:2px solid #0B388B}.dropdown-arrow{font-size:15px}.teacher-dropdown>select[hidden]{display:none} /* Editor headings: stronger hierarchy and space between fields and actions. */ #editor>label[for="editor-title"],#editor>label[for="editor-course"]{font-size:21px;font-weight:800;line-height:1.4;margin:0 0 16px;letter-spacing:-.3px} #editor>#editor-title{font-size:21px;padding:16px 18px;margin:0 0 28px;max-width:900px} #editor>#editor-course{font-size:20px;padding:14px 18px;margin:0 0 28px;max-width:900px} #editor>#editor-delete{display:block;margin:0 0 32px;padding:12px 18px} #editor>.editor-toolbar{margin-top:28px;gap:20px} /* Exercise text is about 1.5 times smaller; titles and controls keep their hierarchy. */ .exercise-instruction{font-size:calc(17px / 1.5);line-height:1.7} .gap-sentence{font-size:calc(22px / 1.5);line-height:2.6;padding:10px 0} .rich-content{font-size:12px;line-height:1.7}.rich-content p,.rich-content li{font-size:inherit} .question-row h3{font-size:calc(20px / 1.5);line-height:1.6} .answer-area .choice,.question-row .choice{font-size:12px;line-height:1.6} .match-button{font-size:calc(16px / 1.5);line-height:1.6} .sentence-row>span{font-size:12px;line-height:1.7} .exercise-cards .answer-input,.student-preview-content .answer-input,.exercise-cards .teacher-answer{font-size:12px;line-height:1.7} /* A single shared size for native fields and the teacher's dropdown trigger. */ .gap-sentence .inline-gap{font-size:14px;line-height:1.4;min-height:0;height:28px;min-width:6ch;width:10ch;max-width:min(100%,240px);padding:3px 6px;margin:4px 6px;vertical-align:middle;box-sizing:border-box;border-radius:6px} .gap-sentence select.inline-gap,.gap-sentence .teacher-dropdown-trigger{width:9ch;min-width:6ch;padding-right:5px} .teacher-dropdown{vertical-align:middle}.teacher-dropdown-options{min-width:110px}.teacher-dropdown-option{font-size:14px;padding:7px 10px} @media(max-width:680px){#editor>label[for="editor-title"],#editor>label[for="editor-course"]{font-size:19px}#editor>#editor-title,#editor>#editor-course{font-size:18px}.gap-sentence{font-size:calc(19px / 1.5);line-height:2.8}.gap-sentence .inline-gap{font-size:13px;height:27px;margin:4px 5px;max-width:65vw}.match-button{font-size:calc(14px / 1.5)}} /* Larger, more legible exercise text; compact controls remain separate. */ .exercise-instruction{font-size:15px;font-weight:550;line-height:1.7}.gap-sentence{font-size:19px;font-weight:550;line-height:2.2}.rich-content{font-size:16px;font-weight:550;line-height:1.7}.question-row h3{font-size:17px;font-weight:650}.answer-area .choice,.question-row .choice{font-size:16px;font-weight:550}.match-button{font-size:14px;font-weight:550}.sentence-row>span{font-size:16px;font-weight:550}.exercise-cards .answer-input,.student-preview-content .answer-input,.exercise-cards .teacher-answer{font-size:16px;font-weight:500}.gap-sentence .inline-gap{font-size:16px;height:30px;font-weight:550}.teacher-note .rich-content,.teacher-note .rich-content *{font-size:calc(16px / 1.5)!important} .class-lesson-row{display:flex;align-items:center;gap:8px;position:relative;margin-bottom:12px}.class-lesson-row>button{flex:1;min-width:0;margin:0}.class-lesson-row>.row-menu{margin:0;flex-shrink:0}.class-lesson-row>.row-menu>summary{font-size:21px;padding:0 7px}.class-lesson-row .row-menu-body{min-width:220px} .exercise-card{position:relative}.exercise-card>.exercise-title{padding-right:90px}.exercise-top>.exercise-actions{position:absolute;right:20px;top:20px;display:flex;align-items:center;gap:8px;margin:0;z-index:20}.exercise-actions .exercise-drag-handle{font-size:26px;line-height:36px;padding:0 6px}.exercise-actions>.row-menu>summary{padding:0 10px}.exercise-actions .row-menu-body>button{font-size:13px;padding:9px 12px}.editor-card>.student-preview .exercise-title{padding-right:90px}#editor{overflow-anchor:none} @media(max-width:680px){.gap-sentence{font-size:16.5px;line-height:2.5}.gap-sentence .inline-gap{font-size:15px;height:29px}.match-button{font-size:12px}.exercise-top>.exercise-actions{top:14px;right:14px;gap:4px}.exercise-card>.exercise-title,.editor-card>.student-preview .exercise-title{padding-right:82px}} .course-create-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:0 0 24px}.course-create-actions>#new-module,.course-create-actions>#new-lesson{height:42px;min-height:42px;margin:0;padding:10px 16px;font-size:14px;line-height:20px;box-sizing:border-box}.lesson-group[data-module]:not([data-module=""]){margin-left:24px}.module-heading{justify-content:flex-start;gap:12px;align-items:center;padding:0;margin:12px 0 18px;background:transparent}.module-heading h3{font-size:24px;font-weight:800;color:#0B388B;line-height:1.4}.module-heading>.row-menu{flex:none} .teacher-class-card{text-align:left;min-height:140px}.teacher-class-heading{display:flex;align-items:center;gap:12px;justify-content:space-between;margin-bottom:18px}.teacher-class-heading .class-name{background:transparent;padding:0;border:0;color:#0B388B;font-size:23px;font-weight:750;text-align:left;white-space:normal;overflow-wrap:anywhere;min-width:0}.teacher-class-card .class-students{font-size:15px;font-weight:550;margin:0}.teacher-class-heading>.row-menu{flex-shrink:0} .page-tab-group{flex-direction:column;gap:8px;align-items:stretch}.page-reorder-actions{display:flex;align-items:center;justify-content:center;gap:12px}.page-reorder-actions>button,.page-reorder-actions>button+button{margin:0;padding:4px 10px;width:auto;font-size:18px}.page-tab-group>button:first-child{text-align:center;white-space:normal}#page-controls-bottom,#editor-pages-bottom{display:flex;flex-direction:column;align-items:stretch;gap:16px;padding:20px;background:white;border:1px solid #E8EBF0;border-radius:16px;margin:24px 0;min-width:0}#page-controls-bottom:empty{display:none} .gap-sentence .inline-gap{width:auto;max-width:calc(100vw - 72px);white-space:nowrap;overflow-wrap:normal;word-break:normal}.teacher-dropdown-trigger{white-space:nowrap!important;overflow-wrap:normal;word-break:normal}.teacher-dropdown{max-width:100%}.teacher-dropdown-trigger>span{flex-shrink:0}.teacher-dropdown-trigger{flex-wrap:nowrap} @media(max-width:680px){.lesson-group[data-module]:not([data-module=""]){margin-left:14px}.module-heading h3{font-size:21px}.course-create-actions{gap:12px}.teacher-class-heading .class-name{font-size:20px}} /* Every dropdown option uses the same size, including the first row. */ .teacher-dropdown-options>.teacher-dropdown-option{font-size:16px;font-weight:400;padding:9px 12px} .student-teacher-assignment{min-width:210px;max-width:300px;margin-left:auto}.student-teacher-select{display:block;margin-top:8px;border:1px solid #ccd7ea;border-radius:12px;background:#f5f8ff;color:#0b388b;padding:10px 12px;font-size:15px;font-weight:600}.student-teacher-status{margin:6px 0 0;font-size:13px}.student-online{color:#23764f;font-weight:700}#classes-toggle,#invites-toggle{margin:20px 0 28px}.class-open{margin-top:10px}@media(max-width:650px){.user-row{flex-wrap:wrap}.student-teacher-assignment{width:100%;max-width:none;order:3;margin-left:0}} #library .lesson-row .lesson-name{font-size:21px;line-height:1.4;font-weight:700}.module-zone{border:2px solid #ffd209;border-radius:16px;padding:18px;margin:20px 0;background:#fffef7}.module-zone .module-heading{flex-wrap:wrap;margin:0 0 18px;gap:12px}.module-zone .module-heading h3{background:#fff0a6;border-radius:10px;padding:8px 14px;color:#0b388b}.module-zone .module-grip{flex:none;cursor:grab}.module-drop-target{outline:3px solid #0b388b;outline-offset:3px}.module-zone.dragging{opacity:.55}@media(max-width:650px){.module-zone{padding:12px}.module-zone .module-heading>.secondary{width:100%}} .teacher-class-card .class-students{font-size:12px;font-weight:400;line-height:1.4;margin:0 0 6px} .teacher-class-card .class-open{margin-top:0} #editor>#editor-delete{background:rgba(190,52,52,.10);border:1px solid #be3434;color:#a32929} #editor>#editor-delete:hover{background:rgba(190,52,52,.18)} #editor>#editor-delete:focus-visible{outline:2px solid #be3434;outline-offset:3px} .rich-toolbar{display:flex;flex-wrap:wrap;gap:5px;padding:8px}.rich-toolbar button{border:1px solid #cbd1da;padding:5px 8px;min-height:30px;font-size:13px}.rich-color-group{flex-basis:auto}.rich-toolbar .rich-command{flex:none;width:auto;white-space:nowrap}.exercise-title{white-space:pre-wrap}.teacher-dropdown-options{width:max-content;max-width:calc(100vw - 48px);overflow-x:auto}.teacher-dropdown-options>.teacher-dropdown-option{white-space:nowrap;overflow-wrap:normal;word-break:normal;flex-shrink:0}.exercise-drag-handle{cursor:grab;touch-action:none;user-select:none}.exercise-title-input{min-height:60px} #page-controls,#page-controls-bottom,#editor-pages,#editor-pages-bottom{background:#edf2fa;border:1px solid #d5dfef}.page-bottom-actions{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0}.page-completed{background:#e3f5e8!important;color:#247344!important;border:1px solid #9bcbab}.lesson-completed{background:#e3f5e8;border-radius:10px}.completion-check{color:#247344;font-weight:800;padding:0 6px}.editor-toolbar>#editor-delete{margin-left:auto;background:rgba(190,52,52,.10);border:1px solid #be3434;color:#a32929}.editor-toolbar>#editor-delete:hover{background:rgba(190,52,52,.18)} .picture-label-bank{display:flex;flex-wrap:wrap;gap:8px;padding:14px;background:#edf2fa;border:1px solid #ccd7e8;border-radius:12px;margin-bottom:18px}.picture-label-chip{background:white;border:1px solid #98abc9;color:#0b388b;cursor:grab}.picture-label-chip.selected{background:#dbe8ff;border-color:#0b388b}.picture-label-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:18px}.picture-label-card{background:white;border:1px solid #d6deeb;border-radius:12px;padding:12px;min-width:0}.picture-label-card img{width:100%;height:170px;object-fit:contain;margin-bottom:10px}.picture-label-slot{width:100%;min-height:44px;border:1px dashed #8ea2c4;background:#f2f6fc;color:#0b388b}.picture-label-author-row{display:flex;align-items:center;gap:12px;margin:12px 0}.picture-label-author-row img{width:80px;height:70px;object-fit:contain}.picture-label-author-row input{flex:1;min-width:0}.picture-label-author-row button{flex-shrink:0}@media(max-width:600px){.picture-label-author-row{flex-wrap:wrap}.picture-label-author-row input{width:calc(100% - 100px)}} .picture-label-grid{grid-template-columns:repeat(var(--picture-columns,5),minmax(0,1fr));align-items:stretch}.picture-label-card{display:flex;flex-direction:column}.picture-label-card img{width:100%;height:auto;object-fit:contain;display:block}.picture-label-card>.picture-label-slot,.picture-label-card>input{width:100%;height:48px;min-height:48px;margin-top:auto}.picture-label-bank>.picture-label-chip{height:44px;min-height:44px;margin:0;padding:8px 14px;line-height:1.2;border:1px solid #98abc9;border-radius:10px;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}.picture-label-slot.picture-label-target-correct{background:#dff3df;border:2px solid #74ac78;color:#245d2b}.picture-label-upload{margin-top:24px}@media(max-width:900px){.picture-label-grid{grid-template-columns:repeat(min(3,var(--picture-columns)),minmax(0,1fr))}}@media(max-width:600px){.picture-label-grid{grid-template-columns:repeat(min(2,var(--picture-columns)),minmax(0,1fr))}}@media(max-width:360px){.picture-label-grid{grid-template-columns:1fr}} #page-controls,#page-controls-bottom,#editor-pages,#editor-pages-bottom{padding:12px 16px;gap:8px;margin:16px 0}.page-panel-label{font-size:12px}.page-actions-menu>summary{font-size:11px;padding:4px 0}.page-tabs{gap:6px;margin:0}.page-add-button{border:1px solid #bfc8d5;background:transparent;color:#526581;width:34px;height:34px;padding:0;font-size:22px;align-self:flex-start}.page-tab-group{padding:4px}.page-tab-group>button:first-child{padding:7px 10px}.page-reorder-actions button{padding:2px 7px}.inline-gap::placeholder{color:rgba(105,115,130,.4);opacity:1}.match-index{display:none}.matching-column{display:flex;flex-direction:column;gap:8px}.matching-column>.match-button{min-height:44px}.rich-toolbar .rich-color-group{padding:6px}#simple-prompt-wrap{margin-bottom:18px} .matching-columns{align-items:stretch}.matching-column{display:grid;grid-auto-rows:1fr}.matching-column>.match-button{width:100%;height:100%;margin:0} .exercise-visibility{padding:6px;width:34px;height:34px;border:1px solid #d9dfe7;border-radius:8px;color:#63728a;background:#fff}.exercise-visibility[aria-pressed="true"]{background:#edf0f5;color:#758196}.teacher-note .rich-content,.teacher-note .rich-content *{font-size:16px!important}.teacher-note .rich-area{font-size:18px} /* Keep course lesson titles away from their button and focus borders. */ .lesson-row .lesson-name{padding:8px 12px;border-radius:8px;max-width:100%;} .lesson-row-info>.note{padding-inline:12px;} /* Compact course lesson rows while retaining title inset. */ .lesson-row{padding:8px 18px;} .lesson-row-info{gap:2px;} .lesson-row-info>.note{margin:0;line-height:1.4;} @media(max-width:680px){.lesson-row{padding:7px 12px;}} /* Preserve the author's normal/bold distinction in rendered formatted text. */ .rich-content{font-weight:400;}.rich-content strong,.rich-content b{font-weight:700;} .question-row{padding:12px;margin:12px 0;border-radius:12px;} .question-row h3{margin:0 0 10px;}.question-row .choice,.answer-area .choice{padding:7px 12px;min-height:36px;margin:4px 0;line-height:1.4;} .rich-toolbar .rich-color-swatch{width:13px;height:13px;min-width:13px;} .rich-toolbar .rich-color-group{gap:6px;padding:4px 6px;} .rich-toolbar input[type=color]{width:24px;height:20px;min-width:24px;padding:1px;} .rich-toolbar .rich-color-swatch.selected{outline-offset:2px;outline-width:1px;} .lesson-table-wrap{overflow-x:auto;max-width:100%;}.lesson-table{border-collapse:collapse;width:100%;font-size:16px;font-weight:400;}.lesson-table td,.lesson-table th{border:1px solid #ccd5e2;padding:10px 12px;text-align:left;white-space:pre-wrap;min-width:90px;}.lesson-table th{background:#eef2f7;font-weight:700;}.table-editor-grid{overflow-x:auto;margin:16px 0;}.table-editor-row{display:flex;gap:6px;margin-bottom:6px;}.table-editor-row textarea{min-width:100px;flex:1;}.table-editor-grid+label input[type=checkbox],#table-fields input[type=checkbox]{width:auto;} .rich-toolbar .rich-color-swatch{width:8px;height:8px;min-width:8px;min-height:8px;max-width:8px;max-height:8px;padding:0;flex:0 0 8px;border-radius:50%;align-self:center;}.rich-toolbar .rich-color-swatch.selected{outline:1px solid #0B388B;outline-offset:2px;box-shadow:none;} .rich-toolbar{display:flex;flex-direction:column;flex-wrap:nowrap;gap:6px;padding:8px;min-width:0;}.rich-toolbar-row{display:flex;align-items:center;flex-wrap:nowrap;gap:5px;min-width:0;max-width:100%;overflow-x:auto;padding:3px;}.rich-toolbar-row>button{flex:none;margin:0;white-space:nowrap;}.rich-toolbar-row .rich-command{padding:4px 7px;min-height:28px;font-size:12px;}.rich-toolbar-row .rich-color-group{flex:none;flex-wrap:nowrap;padding:4px 6px;}.rich-color-group label{margin:0;white-space:nowrap;}.rich-toolbar-row .rich-color-swatch{padding:0;min-height:8px;}.rich-editor{min-width:0;max-width:100%;} /* Compact exercise layout shared by editor previews and live classrooms. */ .exercise-cards{gap:14px;} .exercise-cards .exercise-card,.exercise-card.editor-card{padding:18px 20px;min-height:0;border-radius:14px;} .exercise-top{margin-bottom:12px;min-height:30px;} .exercise-top>.exercise-actions{top:14px;right:16px;gap:6px;} .exercise-card h2.exercise-title{font-size:23px;line-height:1.3;margin:0 0 14px;} .exercise-card .student-preview{margin:0;} .exercise-card .exercise-prompt,.exercise-card .prompt{margin:0 0 12px;line-height:1.5;} .exercise-card .rich-content{font-size:16px;line-height:1.5;} .exercise-card .rich-content p{margin:0 0 8px;} .exercise-card .rich-content p:last-child{margin-bottom:0;} .exercise-card .rich-content ul,.exercise-card .rich-content ol{margin:8px 0;padding-left:24px;} .exercise-card .gap-sentence{padding:0;font-size:17px;font-weight:400;line-height:1.85;} .exercise-card .gap-sentence .inline-gap{height:28px;margin:2px 4px;padding:2px 6px;font-size:16px;font-weight:400;} .exercise-card .teacher-dropdown-trigger{min-height:28px;} .exercise-card .question-row{padding:10px 12px;margin:10px 0;} .exercise-card .question-row h3{font-size:16px;line-height:1.45;margin-bottom:8px;} .exercise-card .choice{padding:6px 12px;min-height:34px;line-height:1.4;} .exercise-card .answer-input,.exercise-card .teacher-answer{padding:9px 12px;line-height:1.45;} .exercise-card textarea.answer-input{min-height:72px;} .exercise-card .answer-confirm-actions{margin-top:12px;gap:8px;} .exercise-card .answer-confirm-actions>button{padding:8px 14px;} .exercise-card .card-feedback{margin-top:12px;padding-top:12px;} .exercise-card .card-feedback label{margin-bottom:6px;} .exercise-card .card-feedback textarea{padding:8px 10px;} .exercise-card .feedback-actions{gap:8px;margin-top:8px;} .exercise-card .feedback-actions button{padding:7px 12px;} .exercise-card .matching-columns{gap:12px;} .exercise-card .match-button{padding:7px 10px;min-height:36px;line-height:1.4;} .exercise-card .sentence-row{padding:8px 10px;margin-bottom:6px;gap:8px;} .exercise-card .picture-label-bank{padding:8px;margin-bottom:12px;gap:6px;} .exercise-card .picture-label-chip{height:34px;min-height:34px;padding:5px 10px;} .exercise-card .picture-label-grid{gap:10px;} .exercise-card .picture-label-card{padding:8px;} .exercise-card .picture-label-slot,.exercise-card .picture-label-card>input{height:36px;min-height:36px;padding:6px 8px;font-size:15px;} .exercise-card.teacher-note{padding:18px 20px;} .exercise-card .teacher-note-visibility{margin-bottom:10px;} .exercise-card .lesson-table td,.exercise-card .lesson-table th{padding:7px 10px;} .exercise-card .drawing-toolbar{gap:6px;padding:6px;} .exercise-card .drawing-toolbar button{padding:6px 9px;font-size:13px;} @media(max-width:680px){.exercise-cards .exercise-card,.exercise-card.editor-card{padding:16px 14px;}.exercise-card h2.exercise-title{font-size:21px;}.exercise-card .gap-sentence{font-size:16px;line-height:1.85;}.exercise-top>.exercise-actions{right:12px;top:12px;gap:4px;}} /* Formatted exercise text starts at normal weight; author markup defines emphasis. */ .exercise-instruction,.exercise-prompt,.gap-sentence,.question-row h3{font-weight:400;} .exercise-card .rich-rendered,.student-preview-content .rich-rendered{font-weight:400;} .rich-rendered b,.rich-rendered strong,.rich-content b,.rich-content strong{font-weight:700;} .rich-rendered i,.rich-rendered em{font-style:italic;} .rich-rendered u{text-decoration:underline;} .rich-rendered p{margin:0 0 8px;}.rich-rendered p:last-child{margin-bottom:0;} .course-cover{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:10px;margin-bottom:12px;}.lesson-cover{width:72px;height:48px;object-fit:cover;border-radius:7px;flex:none;}.editor-cover-panel{display:flex;align-items:center;gap:12px;margin:12px 0 20px;}.editor-cover{display:block;width:240px;max-width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:10px;}.cover-preview{margin:16px 0;} .profile-heading{display:flex;align-items:center;gap:18px;}.profile-heading h1{margin:0;}.profile-avatar{width:40px;height:40px;flex:none;border-radius:50%;object-fit:cover;}.profile-avatar.large{width:96px;height:96px;}.profile-initial{display:inline-flex;align-items:center;justify-content:center;background:#eaf0fa;color:#0b388b;font-size:22px;font-weight:700;}.profile-initial.large{font-size:40px;}.profile-form,.profile-panel{background:white;border:1px solid #e1e7f0;border-radius:16px;padding:22px;margin-bottom:20px;}.profile-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 20px;}.profile-form label{margin:0;}.profile-form label input{margin-top:6px;}.profile-metadata{margin:0;}.profile-avatar-settings{grid-column:1/-1;}.profile-checkbox{display:flex;align-items:center;gap:8px;}.profile-checkbox input{width:auto;}.profile-person{background:#f1f5fb;color:#0b388b;border:1px solid #dbe3ee;padding:8px 12px;margin:0 8px 8px 0;}.profile-person-name{background:transparent;color:#0b388b;padding:0;font-size:20px;}.profile-class-list{display:flex;flex-wrap:wrap;gap:10px;}.profile-panel>.secondary{margin-right:10px;margin-bottom:10px;}@media(max-width:600px){.profile-form{grid-template-columns:1fr;}.profile-heading h1{font-size:28px;}} header #connection{display:none;}header #nav-profile{flex-shrink:0;margin-left:auto;background:white;color:#0b388b;border:1px solid #0b388b;padding:10px 14px;border-radius:10px;}header .brand{margin-inline:auto;}@media(max-width:680px){header #nav-profile{font-size:12px;padding:8px 10px;}} .profile-summary{position:relative;display:grid;grid-template-columns:minmax(200px,280px) minmax(0,1fr);gap:36px;align-items:center;padding:40px;background:#fff;border:1px solid #e1e7f0;border-radius:22px;margin-bottom:22px;}.profile-identity{text-align:center;}.profile-photo{display:flex;justify-content:center;margin-bottom:18px;}.profile-avatar.profile-large{width:190px;height:190px;font-size:64px;}.profile-name-pill{display:inline-block;background:#0B388B;color:white;border-radius:14px;padding:10px 18px;font-size:25px;font-weight:700;overflow-wrap:anywhere;}.profile-role-pills{display:flex;justify-content:center;gap:6px;flex-wrap:wrap;margin-top:10px;}.profile-role-pill{display:inline-block;background:#FFD209;color:#0B388B;border-radius:24px;padding:6px 16px;font-weight:700;}.profile-info-pills{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding-right:20px;}.profile-info-pill{background:#E8EBF0;color:#0B388B;border-radius:14px;padding:11px 18px;font-size:18px;font-weight:600;max-width:100%;overflow-wrap:anywhere;}.profile-info-pill.profile-exams{background:#FFD209;}.profile-edit-pencil{position:absolute;right:16px;top:16px;padding:8px;background:#f1f4f8;color:#0B388B;border-radius:10px;}.profile-heading>.profile-avatar{display:none;}.profile-edit-dialog{width:min(760px,95vw);}.profile-edit-dialog .profile-form{border:0;padding:12px 0;margin:0;}.profile-edit-dialog input[type=checkbox]{width:auto;}.profile-checkbox{margin-top:14px;}@media(max-width:680px){.profile-summary{grid-template-columns:1fr;padding:30px 20px;gap:22px;}.profile-info-pills{align-items:stretch;padding:0;}.profile-avatar.profile-large{width:150px;height:150px;}.profile-name-pill{font-size:22px;}.profile-info-pill{font-size:16px;}} .profile-info-pill{background:#eaf0fa;}.profile-info-pill.profile-exams{background:#FFD209;}.profile-top-actions{gap:12px;align-items:center;}.profile-edit-dialog .profile-form{display:flex;flex-direction:column;gap:22px;padding:14px 0 20px;}.profile-edit-dialog .profile-form>label{display:flex;flex-direction:column;gap:8px;margin:0;}.profile-edit-dialog .profile-form>label input{margin:0;}.profile-edit-dialog .profile-form>label.profile-checkbox{flex-direction:row;align-items:center;gap:10px;line-height:1.5;}.profile-edit-dialog .profile-avatar-settings{padding-bottom:16px;border-bottom:1px solid #e1e7f0;}.profile-edit-dialog .profile-avatar-settings>label{margin-bottom:10px;}.profile-edit-dialog .profile-avatar-settings>input{margin-bottom:12px;}.profile-edit-dialog .profile-metadata{margin:0;}.profile-edit-dialog h2{margin-bottom:18px;}.profile-edit-dialog .profile-form>.primary{align-self:flex-start;margin-top:6px;}.profile-edit-dialog{padding:28px;max-height:90vh;overflow-y:auto;}@media(max-width:600px){.profile-top-actions{width:100%;}.profile-edit-dialog{padding:20px;}} .profile-language-pill{display:flex;align-items:center;gap:.5em;}.language-flag{display:inline-flex;height:.85em;width:1.275em;flex:none;overflow:hidden;border-radius:2px;box-shadow:0 0 0 1px #15233c15;}.language-flag svg{height:100%;width:100%;display:block;} .profile-students .profile-person{display:inline-flex;flex-direction:column;align-items:center;justify-content:flex-start;vertical-align:top;gap:12px;width:170px;min-height:142px;padding:16px 12px;white-space:normal;overflow-wrap:anywhere;text-align:center;}.profile-students .profile-person .profile-avatar{width:72px;height:72px;font-size:34px;}.profile-class-list{align-items:center;}.profile-class-list>button{box-sizing:border-box;height:48px;min-height:48px;margin:0;display:inline-flex;align-items:center;justify-content:center;line-height:1.25;padding:10px 16px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}@media(max-width:600px){.profile-students .profile-person{width:145px;}.profile-class-list>button{font-size:14px;}} .room-card.user-row>.user-profile-button{width:auto;flex:0 0 auto;margin:0;padding:8px 12px;font-size:14px;white-space:nowrap;}.room-card.user-row>.user-info{flex:1 1 0;min-width:0;}.room-card.user-row>.row-menu{flex:0 0 auto;}#credentials-dialog{padding:28px;max-height:90vh;overflow-y:auto;}#credentials-form h2{margin-bottom:24px;}#credentials-form label{margin:0 0 8px;}#credentials-form input:not([type=checkbox]){margin:0 0 22px;}#profile-login-mode{display:flex;flex-direction:column;gap:10px;margin-bottom:22px!important;}#profile-login-mode select{width:100%;padding:10px 12px;border:1px solid #ccd7ea;border-radius:10px;min-height:44px;}#credentials-form label:has(#credentials-show){display:flex;align-items:center;gap:10px;margin:0 0 20px;}#credentials-show{width:auto;margin:0;}#credentials-note{margin:0 0 22px;}#credentials-cancel{margin-left:12px;} .course-cover-settings{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin:22px 0;}.course-cover-settings>label{margin:0;} .exercise-card>.exercise-top{padding-top:0;}.exercise-card>.exercise-title{padding-right:150px;}.test-question-input{height:42px;min-height:42px;resize:vertical;padding:10px 12px;}.student-row>.profile-avatar{width:56px;height:56px;font-size:28px;}.exercise-card{scroll-margin-top:24px;} textarea.answer-input{resize:none;overflow-y:hidden;min-height:80px;} #course-list{align-items:start;}#course-list>.room-card{align-self:start;}.course-cover{width:min(100%,240px);height:auto!important;aspect-ratio:210/297;object-fit:contain!important;display:block;margin:0 auto 18px;background:#fff;}.exercise-select{width:18px;height:18px;flex:none;cursor:pointer;}.editor-batch{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:14px;margin:16px 0;background:#eaf0fa;border:1px solid #ccd7ea;border-radius:12px;position:sticky;top:0;z-index:30;}.exercise-version{padding:14px 0;border-bottom:1px solid #e1e7f0;}.exercise-versions{max-height:85vh;overflow:auto;}.exercise-actions:has(.exercise-select){max-width:calc(100% - 24px);} .teacher-picker{width:min(560px,94vw);max-height:85vh;overflow:auto;}.teacher-picker-list{display:flex;flex-direction:column;gap:12px;margin:22px 0;}.teacher-picker-option{display:flex;align-items:center;gap:12px;margin:0;padding:10px;border:1px solid #dbe3ee;border-radius:10px;}.teacher-picker-option input{width:18px;height:18px;margin:0;flex:none;}.teacher-picker-option .profile-avatar{width:38px;height:38px;}.class-teachers{margin-top:10px;}.student-teacher-assignment>button{margin-top:12px;width:auto;} .exercise-appearance{display:flex;gap:22px;align-items:center;flex-wrap:wrap;margin:18px 0;}.exercise-appearance label{display:flex;align-items:center;gap:10px;margin:0;}.exercise-appearance input[type=color]{width:36px;height:30px;padding:2px;}.student-preview-content:has(.rich-content){border-radius:12px;} .class-grid>aside{align-self:start;}.class-comments{margin-top:24px;border-top:1px solid #dce3ee;padding-top:20px;}.class-comments h3{font-size:18px;}.class-comments select{width:100%;font-size:14px;}.class-comments textarea{width:100%;font-size:14px;margin:10px 0;}.class-comments>.note{font-size:12px;line-height:1.5;}.comments-resolved-toggle{display:flex;gap:8px;align-items:center;font-size:12px;}.comments-resolved-toggle input{width:auto;margin:0;}.comment-thread{padding:12px;margin:12px 0;background:#fff;border:1px solid #dbe3ee;border-radius:12px;overflow-wrap:anywhere;}.comment-thread.resolved{opacity:.7;}.comment-post{padding:8px 0;border-bottom:1px solid #edf0f5;}.comment-post strong{display:block;font-size:13px;}.comment-post time{font-size:10px;color:#6a778c;}.comment-post p{white-space:pre-wrap;font-size:13px;line-height:1.5;margin:5px 0;}.comment-quote{font-size:12px;padding:8px;text-align:left;background:#fff4b8;color:#15233c;white-space:normal;max-width:100%;}.comment-tools{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0;}.comment-tools button{padding:5px;font-size:11px;}.comment-selection{margin:10px 0;padding:8px;background:#fff4b8;font-size:12px;overflow-wrap:anywhere;}.class-comments button.secondary{padding:8px 10px;font-size:12px;}.selection-comment{position:fixed;z-index:1000;background:#0b388b;color:white;padding:9px 12px;font-size:13px;border-radius:10px;box-shadow:0 4px 12px #15233c30;}.comment-focus{outline:3px solid #ffd209;outline-offset:4px;}::highlight(class-comment){background:#fff2a0;color:#15233c;}@media(max-width:850px){.class-comments{max-height:420px;overflow:auto;}} .course-cover{width:auto;max-width:min(100%,240px);max-height:340px;aspect-ratio:auto;height:auto!important;}.shared-class-option{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:14px;}.shared-class-option input{width:16px;height:16px;margin:0;} /* Compact exercise headers and visible answer selection. */ .exercise-card h2.exercise-title{margin-bottom:8px;} .exercise-card>.exercise-top{margin-bottom:6px;min-height:24px;} .editor-heading-row{min-height:36px;padding-right:158px;display:flex;align-items:center;} .editor-heading-row .exercise-title{margin:0 0 6px!important;padding:0!important;} .editor-card>.exercise-top{margin-bottom:6px;min-height:22px;} .colored-note .student-preview-content{background:transparent!important;} .truth-keys{display:flex;gap:8px;align-items:stretch;flex-wrap:wrap;margin:8px 0;} .truth-keys>.choice{flex:1 1 100px;width:auto;margin:0;padding:7px 12px;min-height:34px;text-align:center;} .truth-unknown-toggle{display:flex;align-items:center;gap:8px;font-size:13px;margin:10px 0;} .truth-unknown-toggle input{width:16px;height:16px;margin:0;} .question-editor{padding:12px;margin:10px 0;} .question-editor>.toolbar{gap:6px;margin-bottom:8px;} .question-editor>.toolbar button{padding:5px 9px;} .question-editor>.note{margin:8px 0;} .choice.selected,.choice.selected.teacher-correct{border-color:#145bd7!important;outline:2px solid #145bd7;outline-offset:1px;box-shadow:none;} .exercise-destination-dialog form>label{display:block;font-size:19px;margin:22px 0 8px;} .exercise-destination-dialog form>label>select{display:block;width:100%;margin-top:10px;font-size:18px;padding:10px 12px;min-height:44px;} .inline-comment-composer{position:fixed;z-index:1100;padding:14px;background:white;border:1px solid #ccd7e8;border-radius:12px;box-shadow:0 8px 30px #15233c33;max-height:85vh;overflow:auto;box-sizing:border-box;} .inline-comment-composer textarea{width:100%;font-size:14px;min-height:72px;margin:8px 0;} .inline-comment-composer button{padding:8px 12px;font-size:13px;} .comment-text-highlight{background:#ffdf57!important;color:inherit!important;border-radius:2px;box-shadow:0 0 0 2px #ffdf5780;} @media(max-width:680px){.editor-heading-row{padding-right:144px;}.truth-keys>.choice{flex-basis:80px;}} #create-form{align-items:start;}#create-form>button[type=submit]{margin-top:29px;align-self:start;} /* Comments belong to the exercise row, outside its content card. */ .exercise-with-comments{min-width:0;position:relative;} .exercise-with-comments>.exercise-card{margin-bottom:0;min-width:0;} .exercise-with-comments.has-comments{display:block;min-height:var(--comment-rail-height,0px);} @media(min-width:951px){.exercise-with-comments.has-comments>.exercise-comments{position:absolute;right:calc(100% + 18px);top:0;width:240px;box-sizing:border-box;}} .exercise-with-comments>.exercise-comments{min-width:0;padding:12px;background:#f3f5f8;border:1px solid #dce3ee;border-radius:14px;overflow-wrap:anywhere;} .exercise-comments[hidden]{display:none!important;} .exercise-comments h3{font-size:16px;margin:0 0 10px;}.exercise-comments textarea{font-size:13px;padding:8px;margin:8px 0;}.exercise-comments button{font-size:12px;padding:7px 9px;}.exercise-comments .comment-thread{margin:0 0 12px;padding:10px;} @media(max-width:950px){.exercise-with-comments.has-comments{display:grid;grid-template-columns:200px minmax(0,1fr);gap:14px;align-items:start;}.exercise-with-comments>.exercise-comments{grid-column:1;grid-row:1;}.exercise-with-comments>.exercise-card{grid-column:2;grid-row:1;}} @media(max-width:650px){.exercise-with-comments.has-comments{display:flex;flex-direction:column;}.exercise-with-comments>.exercise-card,.exercise-with-comments>.exercise-comments{width:100%;box-sizing:border-box;}} @media(max-width:680px){#create-form>button[type=submit]{margin-top:0;}} .comment-answer-wrap{position:relative;isolation:isolate;}.comment-answer-wrap>.answer-input{position:relative;background:transparent!important;z-index:1;display:block;}.answer-comment-mirror{position:absolute;inset:0;z-index:0;color:transparent;white-space:pre-wrap;overflow:hidden;pointer-events:none;}.answer-comment-mirror mark{background:#ffe790;color:transparent;} .memory-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px;margin:12px 0;}.memory-card{min-height:80px;padding:12px;background:#0b388b;color:white;border:2px solid #0b388b;border-radius:12px;font-size:20px;overflow-wrap:anywhere;transition:background .15s;}.memory-card.flipped{background:#fff4b8;color:#15233c;border-color:#d6b933;font-size:16px;}.memory-card.matched{background:#dff3df;color:#204b25;border-color:#80ba84;opacity:1;}.memory-status{font-size:14px;margin:8px 0;}.quiz-demo-dialog{max-width:760px;width:calc(100% - 32px);max-height:90vh;overflow:auto;}.quiz-demo-dialog .choice{display:block;width:100%;margin:7px 0;text-align:left;padding:9px 12px;}.quiz-demo-dialog>button{margin:8px 8px 0 0;}.quiz-demo-result{font-weight:600;margin:14px 0;} .rich-toolbar .rich-color-group{border:1px solid #cbd5df;border-radius:999px;background:#e8edf3;gap:9px;padding:6px 10px;}.rich-color-group label{display:flex;align-items:center;gap:10px;font-weight:700;font-size:13px;}.rich-color-group input[type=color]{width:31px;height:28px;padding:4px;border:1px solid #aeb8c5;background:#fff;border-radius:8px;cursor:pointer;}.rich-toolbar .rich-color-swatch{width:12px;height:12px;min-width:12px;min-height:12px;max-width:12px;max-height:12px;flex:0 0 12px;border:1px solid #bfc8d5;border-radius:50%;}.rich-palette-popup{position:fixed;z-index:1500;background:white;border:1px solid #ccd5e2;border-radius:14px;box-shadow:0 8px 28px #15233c30;padding:14px;box-sizing:border-box;}.rich-palette-grid{display:grid;grid-template-columns:repeat(11,minmax(0,1fr));gap:8px;}.rich-palette-dot{aspect-ratio:1;width:100%;min-width:0;min-height:0;padding:0;border:1px solid #d3d9e3;border-radius:50%;cursor:pointer;}.rich-palette-dot:hover,.rich-palette-dot:focus-visible{outline:2px solid #7a8ba8;outline-offset:2px;}.rich-palette-dot.selected{outline:2px solid #0b388b;outline-offset:2px;box-shadow:0 0 0 4px white;}.rich-palette-custom{display:flex;align-items:center;gap:8px;margin-top:14px;}.rich-palette-custom input{width:110px;font-size:13px;padding:7px 9px;}.rich-palette-custom button{font-size:12px;padding:8px 10px;} .exercise-card>.exercise-top{margin-top:0;margin-bottom:6px;}.exercise-card .exercise-instruction{margin-top:0;margin-bottom:8px;}.exercise-card .rich-content>:first-child{margin-top:0;} /* Teacher classroom: quieter hierarchy, existing exercise tools preserved. */ #classroom>.page-title{align-items:center;gap:20px;margin:18px 0 26px;padding-bottom:22px;border-bottom:1px solid #e1e6ee;} #classroom #role-label,#classroom .lesson-heading .eyebrow,#classroom .sidebar-note{display:none;} #classroom #class-title{font-size:28px;line-height:1.2;margin:0 0 7px;} #classroom #presence{font-size:13px;line-height:1.5;margin:0;color:#7a879b;} #classroom>.page-title .toolbar{gap:9px;} #classroom>.page-title .toolbar>button,#classroom>.page-title .toolbar>a{min-height:38px;border:1px solid #d9e0eb;border-radius:9px;padding:8px 13px;font-size:13px;font-weight:500;background:white;} #classroom #leave-class{background:transparent;border-color:transparent;} #class-tools-menu .row-menu-body{min-width:230px;} #class-tools-menu .row-menu-body button{width:100%;text-align:left;font-size:13px;font-weight:500;padding:10px 12px;min-height:0;border:0;margin:0;} #classroom .lesson-heading{align-items:center;margin-bottom:18px;} #classroom #lesson-title{font-size:27px;margin:0;} #classroom #lesson-description{display:none;} #classroom .lesson-heading>.toolbar{align-items:center;gap:8px;} #classroom .lesson-heading #add-open{padding:10px 15px;font-size:13px;border-radius:9px;} #classroom .sidebar-title{font-size:11px;letter-spacing:1.2px;margin-bottom:12px;} #classroom #lesson-list button{font-size:14px;padding:10px 12px;min-height:0;} #classroom .class-grid>aside{padding:18px 14px;border-radius:12px;} .exercise-with-comments>.exercise-comments{padding:0;background:transparent;border:0;} .exercise-comments .comment-thread{background:#fffdf5;border:1px solid #eadba6;border-radius:12px;padding:15px;margin:0 0 12px;box-shadow:none;} .comment-author{font-size:13px;margin-bottom:10px;color:#25354e;} .exercise-comments .comment-quote{border:0;border-left:2px solid #ddbb47;border-radius:0;padding:0 0 0 9px;background:transparent;text-align:left;font-size:13px;font-weight:400;color:#836d34;display:block;margin:0 0 12px;} .exercise-comments .comment-post{border:0;padding:0;margin:0;} .exercise-comments .comment-post p{font-size:13px;line-height:1.65;margin:8px 0;} .exercise-comments .comment-reply-toggle{border:0;background:transparent;color:#9c8847;padding:7px 0 0;font-size:12px;} .exercise-comments .comment-thread>.danger{float:right;border:0;background:transparent;padding:7px 0;font-size:11px;opacity:.65;} .comment-reply-form[hidden]{display:none!important;} @media(max-width:680px){#classroom>.page-title{align-items:flex-start;flex-wrap:wrap;}#classroom>.page-title .toolbar{flex-wrap:wrap;}#classroom #class-title{font-size:24px;}} /* Student classroom shares the compact shell and per-exercise comment rails. */ #classroom[data-view-role=student] .student-class-progress{border-top:1px solid #e2e7ef;margin-top:18px;padding:18px 6px 4px;} .student-class-progress>span{display:block;font-size:11px;color:#8794a8;} .student-class-progress>strong{display:block;font-size:13px;font-weight:500;color:#334b70;margin:6px 0 10px;} .student-class-progress progress{display:block;width:100%;height:5px;border:0;border-radius:8px;overflow:hidden;background:#e2e8f1;accent-color:#6b85b4;} .student-class-progress progress::-webkit-progress-bar{background:#e2e8f1;border-radius:8px;} .student-class-progress progress::-webkit-progress-value{background:#6b85b4;border-radius:8px;} .student-class-progress progress::-moz-progress-bar{background:#6b85b4;border-radius:8px;} #classroom[data-view-role=student] .exercise-card{border:1px solid #e0e5ed;box-shadow:0 2px 3px #20375803;background-color:white;} #classroom[data-view-role=student] #lesson-list button:disabled{opacity:.5;} #classroom[data-view-role=student] #lesson-list .lesson-completed button{background:#eff7f1;color:#3e7753;} #classroom[data-view-role=student] .exercise-title{font-weight:600;} #classroom[data-view-role=student] .exercise-instruction{color:#61728a;font-weight:400;} #classroom[data-view-role=student] .exercise-comments .comment-thread{background:#fffdf5;} .student-class-progress[hidden]{display:none!important;} /* Compact teacher dashboard and material library. */ #dashboard>.page-title>.eyebrow,#dashboard>.page-title .eyebrow{display:none;} #dashboard>.page-title{margin:24px 0 20px;align-items:center;} #dashboard .classes-heading{gap:12px;flex-wrap:wrap;} #dashboard .classes-heading h1{font-size:30px;letter-spacing:-.6px;margin-right:auto;} #dashboard .classes-heading button{font-size:13px;padding:10px 14px;min-height:0;border:1px solid #d9e1ee;border-radius:9px;} #dashboard .classes-summary{font-size:13px;color:#8794a8;margin:9px 0 0;} .class-search-tools{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:20px 0;} #class-search{width:290px;max-width:100%;font-size:13px;padding:10px 12px;} .class-search-tools label{display:flex;align-items:center;gap:8px;font-size:12px;color:#70819a;} .class-search-tools input[type=checkbox]{width:15px;height:15px;margin:0;} #rooms{gap:18px;} #rooms .teacher-class-card{position:relative;padding:22px;min-height:0;border-radius:14px;display:flex;flex-direction:column;align-items:stretch;text-align:left;} .class-card-avatar{width:48px!important;height:48px!important;border-radius:14px!important;object-fit:cover;margin-bottom:16px;} .class-avatar-fallback{display:grid;place-items:center;background:#eaf0fa;color:#5271a1;font-size:20px;} #rooms .teacher-class-heading{margin:0 0 9px;} #rooms .class-name{font-size:19px;font-weight:600;text-align:left;padding:0;line-height:1.3;} #rooms .teacher-class-heading>.row-menu{position:absolute;right:15px;top:21px;} #rooms .class-students{font-size:12px;font-weight:400;margin:0 0 17px;color:#8794a7;} #rooms .teacher-class-card[data-class-live=true]{border-color:#bcd9c7;} #rooms .teacher-class-card[data-class-live=true] .class-students{color:#578369;} #rooms .class-open{font-size:13px;padding:9px;border:0;border-radius:8px;min-height:0;margin-top:auto;background:#edf2fb;} #rooms .teacher-class-card[data-class-live=true] .class-open{background:#173f91;color:white;} .teacher-class-card[hidden],.class-search-tools[hidden],.lesson-rows[hidden]{display:none!important;} .create-class-dialog{width:min(460px,calc(100vw - 32px));padding:26px;border-radius:16px;border:1px solid #dce3ee;} .create-class-dialog #create-form{display:flex;flex-direction:column;align-items:stretch;padding:0;border:0;margin:22px 0 12px;gap:20px;box-shadow:none;} .create-class-dialog #create-form>button{margin:0;order:3;} .create-class-dialog #create-form label{font-size:13px;} #course-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start;} #course-list .compact-course-card{display:flex;align-items:center;gap:18px;padding:18px;min-height:126px;border:1px solid #dfe5ed;border-radius:13px;text-align:left;} #course-list .course-open{background:#f0f4fc;border-color:#bdcde7;} .course-thumbnail{width:62px;height:85px;flex:0 0 62px;background:#eef2f8;border-radius:5px;display:grid;place-items:center;color:#92a3bd;font-size:27px;overflow:hidden;} #course-list .course-thumbnail .course-cover{width:100%;height:100%;max-height:100%;object-fit:contain;margin:0;border-radius:0;} .compact-course-info{min-width:0;flex:1;} #course-list .compact-course-info h2{font-size:16px;line-height:1.4;font-weight:600;margin:0 0 6px;overflow-wrap:anywhere;} .course-meta{font-size:11px;color:#95a1b3;} .compact-course-actions{display:flex;align-items:center;gap:7px;} .compact-course-actions>button{font-size:12px;padding:8px 11px;width:auto;margin:0;min-height:0;} #library .compact-module{border:1px solid #dfe5ed;border-left:3px solid #e6c54a;border-radius:12px;background:white;padding:0;margin:16px 0;} #library .compact-module .module-heading{display:flex;align-items:center;gap:12px;padding:16px 18px;margin:0;flex-wrap:nowrap;} .compact-module-info{flex:1;min-width:0;} .module-kind{display:block;color:#a28c40;font-size:10px;letter-spacing:1px;text-transform:uppercase;margin-bottom:3px;} #library .compact-module .module-heading h3{background:transparent;font-size:18px;font-weight:600;padding:0;margin:0;color:#2c4266;line-height:1.35;} .module-count{font-size:11px;color:#97a3b5;} #library .compact-module .module-heading>button{font-size:12px;padding:7px 10px;white-space:nowrap;margin:0;min-height:0;} #library .compact-module .module-heading>.drag-handle{order:-1;} #library .compact-lesson-group .lesson-rows{padding:0 18px 8px 48px;gap:0;} #library .compact-lesson-group .lesson-row{display:flex;align-items:center;gap:12px;padding:13px 0;min-height:58px;border:0;border-top:1px solid #edf0f5;border-radius:0;background:white;margin:0;} #library .compact-lesson-group .lesson-row-info{display:flex;align-items:center;gap:15px;flex:1;min-width:0;} #library .compact-lesson-group .lesson-name{font-size:15px;font-weight:500;padding:3px 0;line-height:1.45;flex:1;text-align:left;} #library .compact-lesson-group .lesson-row-info>.note{font-size:11px;color:#98a5b8;white-space:nowrap;margin:0;} #library .compact-lesson-group .drag-handle{font-size:17px;color:#9facc0;} #dashboard .row-menu>summary{border:0;background:transparent;font-size:22px;width:30px;height:32px;padding:0;min-height:0;} @media(max-width:900px){#course-list{grid-template-columns:1fr;}} @media(max-width:650px){.class-search-tools{align-items:stretch;flex-direction:column;}#class-search{width:100%;}#dashboard .classes-heading h1{width:100%;font-size:26px;}#library .compact-module .module-heading{gap:7px;padding:14px 10px;flex-wrap:wrap;}#library .compact-lesson-group .lesson-rows{padding-left:22px;padding-right:12px;}#library .compact-lesson-group .lesson-row-info{align-items:flex-start;flex-direction:column;gap:3px;}.compact-course-actions{gap:3px;}#course-list .compact-course-card{padding:14px;gap:12px;}} /* Ungrouped lessons share module row typography and spacing. */ #library .compact-lesson-group:not(.compact-module){background:white;border:1px solid #dfe5ed;border-radius:12px;margin:16px 0;padding:0 18px;} #library .compact-lesson-group:not(.compact-module)>.lesson-rows{padding:0;gap:0;} #library .compact-lesson-group:not(.compact-module)>.lesson-rows>.lesson-row:first-child{border-top:0;} #library .compact-lesson-group .lesson-cover{width:38px;height:44px;object-fit:contain;flex:0 0 38px;margin:0;} /* Keep text anchored to the left regardless of shared button layouts. */ #rooms .teacher-class-heading{display:flex;justify-content:flex-start;align-items:center;padding-right:32px;} #rooms .teacher-class-heading .class-name{display:block;width:auto;max-width:100%;text-align:left;justify-content:flex-start;align-self:flex-start;margin:0;} #rooms .teacher-class-card{padding-top:22px;} #library .compact-lesson-group .lesson-row-info{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;text-align:left;} #library .compact-lesson-group .lesson-row-info .lesson-name{display:block;text-align:left;justify-content:flex-start;align-self:center;width:auto;margin:0;} #library .compact-lesson-group .lesson-row-info>.note{display:block;margin-left:auto;text-align:right;} @media(max-width:650px){#library .compact-lesson-group .lesson-row-info{align-items:flex-start;flex-direction:column;gap:3px;}#library .compact-lesson-group .lesson-row-info>.note{margin-left:0;text-align:left;}} /* A single gap controls spacing between expanded and collapsed groups. */ #library.library-list{gap:12px;} #library .compact-lesson-group,#library .compact-module,#library .compact-lesson-group:not(.compact-module){margin-top:0;margin-bottom:0;} #dashboard .classes-heading{align-items:center;} #dashboard .classes-heading>#teacher-invite-open,#dashboard .classes-heading>#create-class-open{display:inline-flex;align-items:center;justify-content:center;align-self:center;height:40px;min-height:40px;margin:0!important;line-height:1.2;vertical-align:middle;box-sizing:border-box;} #logout[hidden]{display:none!important;} .profile-exit{margin:32px 0 12px;padding-top:24px;border-top:1px solid #e1e6ee;} .profile-logout{background:#d94a4a16;color:#b33e3e;border:1px solid #c95858;border-radius:9px;padding:10px 18px;font-size:14px;font-weight:500;} .profile-logout:hover{background:#d94a4a28;border-color:#b33e3e;} /* Compact wordmark from the approved preview. */ header .brand.brand-wordmark{display:inline-flex;align-items:baseline;gap:0;font-family:Arial,sans-serif;font-size:28px;font-weight:800;letter-spacing:-1.05px;line-height:1;text-decoration:none;color:#173f91;white-space:nowrap;} header .brand-wordmark i{display:inline-block;width:10px;height:10px;background:#f1cb43;border-radius:50%;margin-left:5px;flex:0 0 10px;} header .brand-wordmark:hover{color:#12377e;} header .brand-wordmark:focus-visible{outline:2px solid #d7b536;outline-offset:7px;border-radius:3px;} @media(max-width:650px){header .brand.brand-wordmark{font-size:24px;letter-spacing:-.9px;}header .brand-wordmark i{width:8px;height:8px;flex-basis:8px;}} /* Compact global navigation and the space before page content. */ body>header{min-height:66px;padding-block:10px;gap:12px;} body>header #role-navigation{gap:6px;margin:0;} body>header #role-navigation>button,body>header #nav-profile{min-height:34px;height:34px;padding:7px 12px;margin:0;font-size:13px;line-height:1.2;border-radius:8px;} body>main{padding-top:24px;} #dashboard>.page-title{margin-top:0;} #classroom>.page-title{margin-top:0;} @media(max-width:650px){body>header{min-height:58px;padding-block:9px;gap:9px;}body>main{padding-top:18px;}body>header #role-navigation>button,body>header #nav-profile{height:32px;min-height:32px;padding:6px 9px;font-size:12px;}} .exercise-type-picker{width:min(900px,calc(100vw - 32px));max-width:900px;max-height:88vh;padding:26px;border:1px solid #dfe5ef;border-radius:17px;background:#f7f9fc;} .exercise-type-picker::backdrop{background:#172c4b65;} .exercise-type-picker .dialog-top{margin:0 0 18px;align-items:center;} .exercise-type-picker h2{font-size:24px;margin:0;} .exercise-type-search{width:100%;margin:0 0 20px;padding:11px 13px;font-size:14px;background:white;} .exercise-type-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;} .exercise-type-card{display:flex;flex-direction:column;align-items:stretch;text-align:left;padding:13px;border:1px solid #e0e6ef;border-radius:12px;background:white;gap:9px;min-width:0;margin:0;transition:border-color .15s,box-shadow .15s;} .exercise-type-card:hover{border-color:#8ba8d6;box-shadow:0 5px 16px #143b7712;} .exercise-type-card:focus-visible{outline:2px solid #315fa4;outline-offset:3px;} .exercise-type-card strong{font-size:14px;font-weight:600;line-height:1.35;color:#263f67;} .exercise-type-example{display:flex;align-items:center;justify-content:center;min-height:92px;border-radius:8px;background:#edf2fb;color:#426aa6;font-size:19px;font-weight:500;letter-spacing:.2px;overflow:hidden;} .example-image,.example-picture_labels{background:#edf5f1;color:#648d79;}.example-video,.example-memory{background:#f1eef9;color:#8b75b1;}.example-note,.example-color_note{background:#fff6d9;color:#a18b46;}.example-content{font-size:38px;}.example-video{font-size:46px;}.example-audio{font-size:25px;} .exercise-type-description{font-size:11px;font-weight:400;line-height:1.5;color:#8a98ad;} .exercise-type-card[hidden]{display:none!important;} @media(max-width:700px){.exercise-type-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.exercise-type-picker{padding:18px;}.exercise-type-example{font-size:15px;min-height:80px;}.exercise-type-picker h2{font-size:21px;}} @media(max-width:390px){.exercise-type-grid{grid-template-columns:1fr;}} /* Number and tools share normal flow, so neither can cover the other. */ .exercise-card>.exercise-top{display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:8px;} .exercise-card>.exercise-top>.exercise-actions{position:static;inset:auto;display:flex;align-items:center;flex-wrap:wrap;margin-left:auto;gap:6px;max-width:100%;} .exercise-card>.exercise-top>span{flex-shrink:0;} @media(min-width:951px){.exercise-with-comments.has-comments>.exercise-comments{top:var(--comment-rail-offset,0px);}} .page-tabs .homework-tab{margin-left:12px;border-left:1px solid #d6dfeb;padding-left:12px;}.page-tabs button.homework-tab{background:#edf2fa;color:#284c82;border:1px solid #bacbe3;}.homework-tab .page-reorder-actions{display:none;} /* Square memory cards with a quiet patterned back and consistent face layout. */ .memory-grid{grid-template-columns:repeat(auto-fill,minmax(110px,150px));gap:12px;align-items:start;justify-content:start;} .memory-grid .memory-card{width:100%;aspect-ratio:1;height:auto;min-height:0;margin:0;padding:12px;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;border-radius:15px;border:1px solid #c8d5e9;background:repeating-linear-gradient(45deg,#edf2fa,#edf2fa 9px,#e7edf7 9px,#e7edf7 10px);color:#5878a8;box-shadow:0 3px 8px #284c8209;overflow:hidden;} .memory-back-symbol{font-size:32px;font-weight:400;opacity:.7;}.memory-grid .memory-card.flipped{background:#fff;color:#284266;border-color:#aabedc;}.memory-grid .memory-card.matched{background:#edf6ef;color:#396448;border-color:#b8d5c0;}.memory-face-text{font-size:15px;line-height:1.3;overflow-wrap:anywhere;overflow:auto;max-height:100%;font-weight:500;}.memory-face-image{min-height:0;max-height:100%;max-width:100%;flex:1;object-fit:contain;border-radius:7px;}.memory-face-image+.memory-face-text{flex-shrink:0;max-height:40%;}.memory-pair-side{min-width:0;}.memory-pair-side input[type=file]{font-size:12px;margin:8px 0;}.memory-image-preview img{max-width:100%;height:80px;object-fit:contain;}.memory-image-preview button{font-size:12px;} .exercise-actions>.row-menu>summary{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:32px;height:32px;min-height:32px;padding:0;margin:0;border:1px solid transparent;background:transparent;border-radius:8px;font-size:21px;line-height:1;color:#75839a;list-style:none;letter-spacing:1px;} .exercise-actions>.row-menu>summary::-webkit-details-marker{display:none;}.exercise-actions>.row-menu>summary:hover,.exercise-actions>.row-menu[open]>summary{background:#edf2f8;border-color:#dce3ed;color:#284c82;}.exercise-actions>.row-menu>summary:focus-visible{outline:2px solid #8ea9cf;outline-offset:2px;} .exercise-actions .row-menu-body{min-width:220px;max-width:min(300px,calc(100vw - 40px));padding:6px;border:1px solid #e0e6ee;border-radius:11px;box-shadow:0 8px 24px #243d651a;background:#fff;} .exercise-actions .row-menu-body button{display:block;width:100%;min-height:0;padding:9px 11px;margin:0;border:0;border-radius:6px;background:transparent;text-align:left;justify-content:flex-start;font-size:13px;font-weight:400;line-height:1.35;color:#52627b;}.exercise-actions .row-menu-body button:hover{background:#f0f4f9;}.exercise-actions .row-menu-body button.danger{color:#b84b4b;} @media(max-width:420px){.memory-grid{grid-template-columns:repeat(2,minmax(0,1fr));}} /* Homework is a separate section, with the same geometry before and after creation. */ .homework-section{margin-top:16px;padding-top:14px;border-top:1px solid #dce3ed;width:100%;} .homework-section .homework-section-button{display:flex;align-items:center;justify-content:flex-start;gap:12px;width:100%;max-width:420px;margin:0;padding:13px 16px;min-height:64px;box-sizing:border-box;border:1px solid #cdd8e9;border-radius:12px;background:#f5f8fc;color:#35547f;text-align:left;box-shadow:none;} .homework-section .homework-section-button:hover{background:#edf3fb;border-color:#a9bddb;} .homework-section.is-active .homework-section-button{background:#e8effa;border-color:#91abd0;color:#284c82;} .homework-section-icon{display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;border-radius:9px;background:#e3eaf5;font-size:25px;font-weight:400;} .homework-section-text{display:flex;flex-direction:column;gap:4px;min-width:0;}.homework-section-text strong{font-size:14px;font-weight:600;line-height:1.3;}.homework-section-text>span{font-size:11px;font-weight:400;line-height:1.4;color:#7c8ba2;}.homework-section-arrow{margin-left:auto;font-size:18px;font-weight:400;} .lesson-section-switch{display:inline-flex;align-items:center;gap:4px;padding:4px;margin:8px 0 22px;border:1px solid #d8e1ed;border-radius:12px;background:#e9eef5;max-width:100%;box-sizing:border-box;} .lesson-section-switch .section-switch-option{width:auto;min-height:36px;margin:0;padding:9px 18px;border:0;border-radius:9px;background:transparent;color:#7b899f;font-size:14px;font-weight:500;line-height:1.3;box-shadow:none;transition:background .15s,color .15s;} .lesson-section-switch .section-switch-option.is-selected{background:white;color:#284c82;box-shadow:0 1px 5px #243d6512;opacity:1;} .lesson-section-switch .section-switch-option:disabled:not(.is-selected){opacity:.45;} #editor-pages[hidden],#editor-pages-bottom[hidden],#page-controls[hidden],#page-controls-bottom[hidden]{display:none!important;} .exercise-comments .comment-edit-button{border:0;background:transparent;color:#8390a3;font-size:11px;font-weight:400;margin:0 0 8px;padding:3px 0;}.comment-edit-dialog{width:min(460px,calc(100vw - 32px));padding:24px;border:1px solid #dce3ee;border-radius:14px;}.comment-edit-dialog textarea{display:block;width:100%;margin:18px 0;box-sizing:border-box;}.comment-edit-dialog>button{margin-right:8px;} .teacher-cabinet-menu{display:flex;gap:8px;flex-wrap:wrap;border-bottom:1px solid #dfe5ee;padding-bottom:16px;margin-bottom:26px;}.teacher-cabinet-menu .cabinet-menu-button{margin:0;background:transparent;border:0;border-radius:9px;padding:10px 16px;color:#7a899f;font-size:14px;font-weight:500;}.teacher-cabinet-menu .is-selected{background:#e8eff9;color:#284c82;} #cabinet-classes[hidden],#cabinet-students[hidden],#cabinet-materials[hidden],#cabinet-review[hidden],.teacher-cabinet-menu[hidden],.homework-submission[hidden]{display:none!important;} #cabinet-materials #course-list{display:grid;}.homework-pending-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 20px;background:white;border:1px solid #dfe5ee;border-radius:12px;margin:12px 0;}.homework-pending-row p{margin:6px 0;font-size:13px;color:#75849a;}.homework-submission{padding:18px 0;margin:20px 0;border-top:1px solid #dfe5ee;}.homework-submission button{margin-right:8px;}.homework-submission p{font-size:14px;color:#61758f;} /* Cabinet navigation stays on one horizontal line. */ #teacher-cabinet-menu{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:flex-start;gap:8px;overflow-x:auto;max-width:100%;box-sizing:border-box;} #teacher-cabinet-menu>.cabinet-menu-button{display:inline-flex;flex:0 0 auto;width:auto;max-width:none;min-width:0;white-space:nowrap;align-items:center;justify-content:center;transition:background-color .22s ease,color .22s ease,box-shadow .22s ease;} #teacher-cabinet-menu>.cabinet-menu-button:hover{background-color:#e1eafa;color:#284c82;} #teacher-cabinet-menu>.cabinet-menu-button.is-selected:hover{background-color:#d9e5f6;color:#244779;} #teacher-cabinet-menu>.cabinet-menu-button:focus-visible{outline:2px solid #8ea9cf;outline-offset:2px;} @media(prefers-reduced-motion:reduce){#teacher-cabinet-menu>.cabinet-menu-button{transition:none;}} .admin-support{margin-top:30px;padding-top:24px;border-top:1px solid #dde4ee;}.support-ticket-row{margin:10px 0;}.support-ticket-dialog{width:min(640px,calc(100vw - 32px));max-height:85vh;overflow:auto;padding:24px;border:1px solid #dce3ee;border-radius:14px;}.support-ticket-dialog textarea{width:100%;box-sizing:border-box;margin:20px 0;}.support-ticket-dialog>button{margin:5px;}.support-post{padding:12px 14px;background:#f0f4fa;border-radius:10px;margin:10px 0;}.support-post p{white-space:pre-wrap;overflow-wrap:anywhere;} .drag-word-bank{display:flex;flex-wrap:wrap;gap:8px;padding:14px;background:#f0f4fa;border-radius:10px;margin-bottom:18px;min-height:36px;}.drag-word-token{display:inline-flex;width:auto;min-height:0;margin:0;padding:6px 10px;border:1px solid #d3ddeb;background:white;color:#3e5679;border-radius:7px;font-size:14px;font-weight:400;cursor:grab;}.drag-word-token.is-selected{outline:2px solid #91acd3;}.drag-gap-text{white-space:pre-wrap;font-size:16px;line-height:2.7;}.drag-word-zone{display:inline-flex;align-items:center;justify-content:center;width:auto;min-width:76px;min-height:30px;margin:0 4px;padding:4px 10px;background:#f8faff;border:1px dashed #b9c8df;border-radius:7px;color:#526886;font-size:14px;vertical-align:baseline;}.category-drop-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;}.category-drop-panel{border:1px solid #d7e1ed;border-radius:12px;padding:16px;min-width:0;}.category-drop-panel h3{font-size:16px;text-align:center;margin:0 0 14px;}.category-drop-panel>.drag-word-zone{width:100%;box-sizing:border-box;margin:0;min-height:42px;font-size:12px;}.category-word-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;}.category-placed-word{display:inline-flex;align-items:center;gap:2px;}.remove-drag-word{border:0;background:transparent;color:#8d9bb0;margin:0;padding:3px;font-size:16px;min-height:0;}.drag-words-widget .teacher-drop-hint{background:#edf7ed;border-color:#9cc5a4;}.drag-words-widget .answer-wrong{border:1px solid #d65c63;background:#fff1f2;}.drag-words-widget .answer-correct{border:1px solid #a4c9aa;background:#edf7ef;} .lesson-row,.compact-module,.exercise-card,.match-button,.sentence-row,.picture-label-chip,.drag-word-token,.drag-word-zone{transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease,opacity .18s ease;} .lesson-row.dragging,.exercise-card.dragging,.compact-module.dragging{opacity:.55;box-shadow:0 10px 24px #284c821a;} .drop-target{outline:2px solid #a0b8db;outline-offset:3px;background-color:#f0f5fc;} .drag-word-zone:hover:not(:disabled){border-color:#8faace;background-color:#edf3fc;} .word-dragging .drag-word-token.is-selected{opacity:.6;} @media(prefers-reduced-motion:reduce){.lesson-row,.compact-module,.exercise-card,.match-button,.sentence-row,.picture-label-chip,.drag-word-token,.drag-word-zone{transition:none!important;animation:none!important;}} /* Tighter exercise tools menu with clearer labels. */ .exercise-actions .row-menu-body{display:flex;flex-direction:column;gap:2px;padding:5px;} .exercise-actions .row-menu-body>button{min-height:0;height:auto;padding:6px 10px;margin:0;font-size:13px;font-weight:600;line-height:1.3;color:#405675;} .exercise-actions .row-menu-body>button.danger{color:#b24747;} /* Full-width cabinet navigation, with room for borders and focus rings. */ #teacher-cabinet-menu{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:100%;gap:10px;padding:5px 3px 18px;overflow:visible;} #teacher-cabinet-menu>.cabinet-menu-button{display:flex;width:100%;box-sizing:border-box;min-height:44px;padding:11px 10px;border:1px solid #d7e1ee;background:#f7f9fc;color:#526b8e;font-size:14px;font-weight:600;white-space:normal;line-height:1.3;} #teacher-cabinet-menu>.cabinet-menu-button.is-selected{background:#e1ebf9;border-color:#a4bad9;color:#284c82;box-shadow:0 2px 6px #284c820a;} .lesson-section-switch{position:relative;display:flex;width:420px;max-width:100%;gap:0;touch-action:pan-y;user-select:none;} .lesson-section-switch .section-switch-option{position:relative;z-index:1;flex:1 1 0;width:50%;padding-inline:8px;background:transparent;box-shadow:none;white-space:nowrap;font-size:13px;} .lesson-section-switch .section-switch-option.is-selected{background:transparent;box-shadow:none;} .section-switch-thumb{position:absolute;left:4px;top:4px;bottom:4px;width:calc(50% - 4px);border-radius:9px;background:white;box-shadow:0 1px 5px #243d6518;transition:transform .22s cubic-bezier(.2,.75,.25,1);pointer-events:none;} .lesson-section-switch.is-sliding .section-switch-thumb{transition:none;}.lesson-section-switch.is-sliding{cursor:grabbing;} .drag-carry-preview{position:fixed!important;z-index:10000!important;pointer-events:none!important;opacity:.3!important;margin:0!important;max-height:300px;overflow:hidden;box-sizing:border-box;box-shadow:0 12px 32px #233b6430!important;transform:rotate(1deg);will-change:left,top;} .is-carried,.lesson-row.dragging,.exercise-card.dragging,.compact-module.dragging{opacity:.3!important;} @media(max-width:480px){#teacher-cabinet-menu{gap:5px;}#teacher-cabinet-menu>.cabinet-menu-button{font-size:12px;padding:10px 4px;}} @media(prefers-reduced-motion:reduce){.section-switch-thumb{transition:none;}}