/* Shared responsive contract. Loaded after feature styles to resolve older conflicting breakpoints. */
:root{--app-height:100vh;--usable-height:var(--app-height);--app-top:0px;--site-header-height:90px;--bottom-nav-height:0px}
@supports(height:100dvh){:root{--app-height:100dvh;--usable-height:min(var(--app-height),100dvh)}}
html{min-width:0;scroll-padding-top:calc(var(--site-header-height) + 16px);-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{min-width:0;min-height:100vh;min-height:var(--app-height);overflow-wrap:break-word;-webkit-text-size-adjust:100%;text-size-adjust:100%}
*,*::before,*::after{box-sizing:border-box}
img,video,canvas{max-width:100%}img,video{height:auto}
input,select,textarea,button,fieldset{min-width:0;max-width:100%}
input[type=range]{width:100%}textarea{resize:vertical}
button,a,summary,input,select,textarea{-webkit-tap-highlight-color:transparent}
button,summary{touch-action:manipulation}
button:not(.close):not(.lina-round):not(.lina-icon):not([data-test-pane]),summary{overflow-wrap:anywhere}
:where(.main,.view,.shell,.header-inner,.pagehead,.sectionhead,.business,.catalog,.workspace,.test-top,.test-footer,.modalbody,.admin-main,.admin-split,.owner-panel,.control-card,.member-card,.dash-card,.ov-today,.ov-task,.notification-item)>*{min-width:0}
.main,.view,.business,.catalog,.workspace,.admin-main,.admin-split,.control-learners{min-width:0}
:where(h1,h2,h3,h4,p,li,dd,code,.badge,.notice,.sub,.feedback,.answer-copy,.theme-title-ar){overflow-wrap:anywhere}
:where(.toolbar,.tools,.pagehead,.sectionhead,.class-actions,.member-account-actions,.report-actions,.video-controls,.helper-options,.reportrow,.site-announcement){flex-wrap:wrap}
:where(.toolbar,.tools,.pagehead,.sectionhead,.reportrow)>*{min-width:0}
:where(.librarytools,.teaching-form,.owner-panel,.notification-preferences) :is(input:not([type=radio]):not([type=checkbox]),select,textarea){width:100%}
:where(.librarytools,.helper-options,.gemini-options) label{min-width:0}
:where(.passage,.source-passage,.matching-passage,.arabic-text,.answer-translation,.instant-arabic,.generated-feedback){overflow-wrap:anywhere;max-width:100%}
:where(.word,.planstep){min-width:0}:where(.word,.planstep)>div{min-width:0}
:where(.word,.planstep) button{flex-shrink:0}
.responsive-table{max-width:100%;min-width:0;overflow:auto;overscroll-behavior-x:contain;scrollbar-width:thin;margin:12px 0}
.responsive-table:focus-visible,:where(.owner-table-wrap,.control-table,.admin-records):focus-visible{outline:3px solid #d79254;outline-offset:3px}
.responsive-table table{width:100%;border-collapse:collapse;margin:0}
:where(.owner-table-wrap,.control-table,.admin-scroll,.admin-records,.admin-choices){min-width:0;max-width:100%;overscroll-behavior:contain}
:where(.owner-table,.scoring-reference table) :is(th,td){white-space:normal;overflow-wrap:anywhere}
:where(.owner-table,.scoring-reference table) :is(input,button,select){max-width:100%}
:where(.owner-table-wrap,.control-table) .owner-table{min-width:620px}
.control-ranked li>span,.control-ranked li>b{min-width:0}.control-ranked li>b{flex-shrink:0}
.control-bars{min-width:0;max-width:100%}.control-bars>span{min-width:0}
.admin-split{grid-template-columns:minmax(0,.9fr) minmax(0,1.4fr)}
.control-learners{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}
.admin-main .admin-colors{grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr))}
.control-inline{grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
#bank-fields{grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr))}
.admin-top h1,.admin-records button,.admin-choices span{overflow-wrap:anywhere}
.admin-top>div:first-child{min-width:0}.admin-top>div:last-child{flex-wrap:wrap;flex-shrink:0}
.admin-main [data-admin-panel]>.business{grid-template-columns:repeat(2,minmax(0,1fr))}
.admin-sidebar nav{scroll-padding:12px;overscroll-behavior-x:contain}
.admin-sidebar nav button{flex-shrink:0}
.site-header .header-inner{min-width:0;gap:12px}
.site-header .brand{min-width:0}.site-header .brandmark{flex-shrink:0}
.header-actions{min-width:0;flex-wrap:wrap}.header-actions .admin-entry{white-space:normal}
.notification-trigger{flex-shrink:0;margin:0}
.learning-design .skill-nav,.skill-nav{min-width:0;max-width:100%;scroll-padding-inline:12px;overscroll-behavior-x:contain}
.skill-nav button{flex-shrink:0}
.skill-nav [data-browse=grammar]{display:block}
.menu-panel{max-height:calc(var(--usable-height) - var(--site-header-height) - 12px);scroll-padding:12px;overflow:auto}
.menu-panel .nav{overflow:visible}
.menu-panel .nav button,.menu-panel .nav a{width:100%;min-height:44px;white-space:normal;text-align:start}
.site-header .menu-panel .nav a{display:flex;align-items:center;gap:10px;padding:9px 10px;min-height:44px;font-size:13px;font-weight:500;line-height:1.5;border-radius:9px;overflow-wrap:anywhere}
.menu-panel .nav button .ico{flex-shrink:0}
#learningmenu:not([open])>.menu-panel{display:none!important}
#learningmenu>summary{list-style:none}
#learningmenu>summary::-webkit-details-marker{display:none}
#learningmenu>summary::marker{content:''}
.menu-panel .menu-group{display:block;min-width:0;width:100%}
.menu-panel .menu-group:last-child{display:grid}
.menu-panel .menu-group h3{display:block;line-height:1.5}
.menu-panel .nav button,.menu-panel .nav a{font-family:inherit;line-height:1.5;-webkit-appearance:none;appearance:none}
.footer{gap:12px;flex-wrap:wrap;overflow-wrap:anywhere}
body.has-modal{overflow:hidden;overscroll-behavior:none}
dialog{max-width:calc(100vw - 24px);max-height:calc(var(--usable-height) - 24px);overscroll-behavior:contain;scroll-padding-block:16px}
dialog :where(header,.modalhead)>div{min-width:0}
#lesson:not(.exam-workspace){width:min(1040px,calc(100% - 24px));padding:0}
#lesson:not(.exam-workspace)[open]{display:flex;flex-direction:column}
#lesson:not(.exam-workspace) .modalhead{flex-shrink:0;max-height:35dvh;overflow:auto;padding:16px 20px}
#lesson:not(.exam-workspace) #lessonbody{flex:1;min-height:0;max-height:none;overflow:auto;padding:20px;scroll-padding:16px}
#lesson:not(.exam-workspace) .modalbody>.source-passage{position:static;max-height:none}
#lesson.exam-workspace{inset:var(--app-top) 0 auto;margin:0;width:100%;max-width:none;height:var(--usable-height);max-height:var(--usable-height)}
#lesson.exam-workspace .modalhead{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) auto;min-width:0;max-height:32%;overflow:auto;flex-shrink:0;gap:10px}
#lesson.exam-workspace .modalhead h2{max-width:none;font-size:clamp(14px,1.3vw,18px);overflow-wrap:anywhere}
#lesson.exam-workspace .header-part-nav{min-width:0;max-width:100%;scrollbar-width:thin}
#lesson.exam-workspace .focus-controls{min-width:0;flex-wrap:wrap;justify-content:flex-end}
#lesson.exam-workspace .focus-controls button{min-height:40px}
#lesson.exam-workspace #lessonbody{flex:1;min-height:0;min-width:0;max-height:none;overflow:hidden;padding:0;display:flex;flex-direction:column}
#lesson.exam-workspace .test-top{min-width:0;flex-shrink:0;gap:8px;max-height:28%;overflow:auto}
#lesson.exam-workspace .test-top .toolbar{flex-wrap:wrap;gap:8px}
#lesson.exam-workspace .test-top .examtop{min-width:0;max-width:100%}
#lesson.exam-workspace .test-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:0;flex:1;overflow:hidden}
#lesson.exam-workspace .test-source,#lesson.exam-workspace .test-questions{display:block;height:auto;max-height:none;min-height:0;min-width:0;overflow:auto;padding:16px 20px 28px;scroll-padding:16px;overscroll-behavior:contain}
#lesson.exam-workspace .test-source{order:0;flex:initial;border-bottom:0}
#lesson.exam-workspace .test-footer{min-width:0;max-height:26%;overflow:auto;flex-shrink:0;gap:8px;padding:8px 16px max(8px,env(safe-area-inset-bottom))}
#lesson.exam-workspace .test-footer button{font-size:12px;min-height:44px}
#lesson.exam-workspace .test-mobile-tabs{display:none;flex-shrink:0}
#lesson.exam-workspace:has(.final-report) #lessonbody{display:block;overflow:auto;padding:16px}
#lesson .matching-option{min-width:0;flex-wrap:wrap;overflow-wrap:anywhere}
#lesson .matching-option>span{min-width:0;flex:1 1 180px}
#lesson .matching-option small{white-space:normal;flex-shrink:1}
#lesson .matching-selected{position:static;margin-bottom:12px;max-width:100%}
#lesson .matching-text header{flex-wrap:wrap}
#lesson .question-progress{top:-16px;scroll-margin-top:8px}
#lesson .question-progress nav{max-height:84px;overflow:auto;padding:3px}
#lesson .advanced-match-preview{min-width:0;align-items:flex-start}
#lesson .advanced-match-preview span{min-width:0}
#lesson .practice-mode-switch{min-width:0;gap:6px}
#lesson .practice-mode-switch button{min-height:40px}
#lesson .final-report{width:100%;max-width:950px;min-width:0}
#lesson .result-section summary{flex-wrap:wrap;gap:8px}
#lesson .result-section summary>b{white-space:normal}
#lesson .report-actions{flex-wrap:wrap}.report-actions button{flex:1 1 180px;min-height:44px}
#lesson .answer-review>div:first-child{flex-wrap:wrap}
#lesson .grammar-gap{overflow-wrap:anywhere;min-height:40px;scroll-margin-block:20px}
.video-stage{min-width:0}.video-stage .video-picture{min-height:0;aspect-ratio:16/9}
.video-stage:has(.video-overlay:not([hidden])) .video-picture{min-height:min(450px,65dvh)}
.video-overlay{align-items:flex-start;overscroll-behavior:contain}
.video-stage .video-prompt{min-width:0;max-height:100%;margin:auto;overflow:auto}
.video-stage .video-option{font-size:15px;min-height:44px}
.video-controls button{min-height:44px}.video-controls progress{min-width:80px}
.video-stage:fullscreen .video-picture{min-height:0;flex:1;aspect-ratio:auto}
.video-stage:fullscreen .video-controls{flex-shrink:0}
.uploaded-player{max-width:100%;height:auto}
:is(#tutors,#lina-panel) .tutor-studio,:is(#tutors,#lina-panel) .studio-has-session{min-width:0}
:is(#tutors,#lina-panel) .studio-dialog{overflow:auto;max-height:calc(var(--usable-height) - 24px)}
:is(#tutors,#lina-panel) .gemini-active .gemini-avatar-stage{height:auto;min-height:0;max-height:none}
:is(#tutors,#lina-panel) .studio-answer-panel{min-height:100px;max-height:50dvh;overflow:auto}
:is(#tutors,#lina-panel) #g-session{min-width:0;min-height:0}
:is(#tutors,#lina-panel) #g-transcript{max-height:55dvh;overflow:auto}
#lina-panel{max-width:calc(100vw - 24px);height:min(660px,calc(var(--usable-height) - 32px));max-height:calc(var(--usable-height) - 32px)}
#lesson #lina-panel{height:min(620px,calc(var(--usable-height) - 32px));bottom:16px}
#lina-panel :where(.lina-head,.lina-tabs,.lina-compose){flex-shrink:0}
#learning-widgets{bottom:calc(20px + var(--bottom-nav-height) + env(safe-area-inset-bottom));right:max(16px,env(safe-area-inset-right))}
#whatsapp-widget{bottom:calc(20px + var(--bottom-nav-height) + env(safe-area-inset-bottom));left:max(16px,env(safe-area-inset-left))}
body.has-modal>#learning-widgets{visibility:hidden}
.notification-dialog{max-height:calc(var(--usable-height) - 24px)}
.notification-dialog[open]{display:flex;flex-direction:column}
.notification-dialog .notification-header{flex-shrink:0}
.notification-dialog .notification-content{min-height:0;max-height:none;overflow:auto}
@media(min-width:761px) and (max-width:1180px){
 .admin-main .admin-split,.admin-main .control-learners{grid-template-columns:1fr}
 .admin-main .admin-records{max-height:340px}
 .notification-form-grid{grid-template-columns:1fr}
 .member-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 #lesson.exam-workspace .modalhead{grid-template-columns:minmax(0,1fr) auto}
 #lesson.exam-workspace .header-part-nav{grid-column:1/-1;grid-row:2}
 #lesson.exam-workspace .focus-controls{grid-column:2;grid-row:1}
}
@media(max-width:900px){
 .admin-sidebar{position:static;width:100%;padding:14px}
 .admin-sidebar nav{display:flex;overflow:auto;margin:10px 0;gap:6px;padding-bottom:6px}
 .admin-sidebar nav button{white-space:nowrap;min-height:44px}
 .admin-top,.admin-main,html[dir=rtl] .admin-top,html[dir=rtl] .admin-main{margin:0;padding:18px;max-width:100%}
 .admin-top{flex-wrap:wrap;align-items:flex-start;gap:12px}
 .admin-main .admin-split,.admin-main .control-learners{grid-template-columns:minmax(0,1fr)}
 #admin-workspace-status,html[dir=rtl] #admin-workspace-status{margin:0 18px}
 .ov-task-top>div:last-child{min-width:0}
 .ov-task-scene{min-height:0}
 .home-hero,.home-check{grid-template-columns:minmax(0,1fr)}
 .home-check{gap:24px}
}
@media(max-width:760px){
 :root{--bottom-nav-height:68px}
 .learning-design .main{padding-bottom:calc(32px + var(--bottom-nav-height) + env(safe-area-inset-bottom))}
 .main{max-width:100%;padding-inline:max(14px,env(safe-area-inset-left)) max(14px,env(safe-area-inset-right))}
 .site-header .header-inner{display:flex;flex-wrap:wrap;align-items:center;gap:8px 6px;padding:10px 12px 8px;padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
 .site-header .brand{order:1;flex:1 1 100px;font-size:16px;gap:6px;letter-spacing:-.6px}
 .site-header .brand small{display:none}.site-header .brandmark{width:28px;height:30px;font-size:20px}
 .site-header .header-actions,.dashboard-design .header-actions{order:2;display:flex!important;flex:0 1 auto;flex-wrap:nowrap;align-items:center;gap:6px;max-width:calc(100% - 110px)}
 .site-header #accountlink{flex:0 1 auto;max-width:100px;padding:10px 8px;font-size:11px;line-height:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .site-header #accountlink .member-plan-slot{display:none}
 .site-header #learningmenu{flex:0 0 40px;margin:0;position:static}
 .site-header #learningmenu>summary{width:40px;min-height:40px;padding:7px;font-size:0;text-align:center}
 .site-header #learningmenu>summary::after{content:'☰';font-size:20px;line-height:1.2}
 .site-header #learningmenu>summary>span{display:none}
 .site-header .notification-trigger{flex:0 0 auto;margin:0;min-width:38px;min-height:40px;padding:8px;gap:3px}
 .site-header .notification-trigger .notification-label{display:none}
 .site-header .header-actions>#lang,.site-header .header-actions>.admin-entry,.site-header .overview-header-controls,.site-header .overview-nav{display:none!important}
 .site-header .skill-nav,.learning-design .skill-nav{order:3;flex:1 1 100%;width:100%;margin:0;padding:4px;display:flex;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;justify-content:flex-start;max-width:100%;-webkit-overflow-scrolling:touch}
 .site-header .skill-nav button{flex:0 0 auto;padding:10px 14px;min-height:42px;font-size:13px}
 .site-header .menu-panel,html[dir=rtl] .site-header .menu-panel{position:fixed;top:var(--site-header-height);left:8px;right:8px;width:auto;max-width:calc(100% - 16px);max-height:calc(var(--usable-height) - var(--site-header-height) - 12px);padding-bottom:env(safe-area-inset-bottom);-webkit-overflow-scrolling:touch;z-index:120}
 .site-header .menu-panel .nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:12px}
 .pagehead{align-items:flex-start;gap:12px}.pagehead h1{font-size:clamp(24px,6vw,34px)}
 .pagehead>div:first-child{flex:1 1 210px}
 .catalog,.business,.workspace,.rightcol,.dashboard-bottom,.dash-columns,.home-check,.notification-form-grid{grid-template-columns:minmax(0,1fr)}
 .home-level-detail{grid-template-columns:minmax(0,1fr)}
 .home-copy h1{font-size:clamp(34px,9vw,54px)}
 .home-check,.home-closing{padding:24px 18px}
 .home-hero:before{width:min(100%,470px);left:0}
 #practice .librarytools{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:14px}
 #practice .librarytools label{min-width:0;width:auto}
 #practice .librarytools label:first-child{grid-column:1/-1}
 #practice .librarytools :is(input,select){min-width:0;width:100%}
 .member-grid,.admin-main [data-admin-panel]>.business{grid-template-columns:minmax(0,1fr)}
 .member-card,.owner-panel,.control-card{padding:18px 14px}
 .bank-details{grid-template-columns:minmax(0,1fr)}.bank-details dd{margin-bottom:8px}
 .admin-main .admin-quick{grid-template-columns:repeat(2,minmax(0,1fr))}
 .admin-main .admin-toolbar{flex-wrap:wrap}.admin-toolbar>*{flex:1 1 160px}
 .admin-main .control-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
 .admin-main .faq-row{grid-template-columns:minmax(0,1fr) auto}
 .admin-main .control-save{position:static}
 .admin-workspace .admin-login{margin:24px 12px;padding:24px 18px}
 .ov-week-days,.dash-calendar{grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
 .ov-week-days>*{min-width:0}.dash-day{min-width:0;min-height:40px;padding:4px;font-size:13px}
 .dash-legend,.dash-heading,.ov-greeting,.ov-task-top,.ov-footer{flex-wrap:wrap}
 .ov-today,.ov-week,.dash-card{padding:20px 16px}
 .ov-task-top{gap:12px}.ov-task-top>div:last-child{min-width:0;flex:1 1 150px}
 .ov-task-scene{flex-wrap:wrap}.overview-scene{max-width:100%;min-width:0}
 .ov-skills,.home-skill-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .ov-skills>button,.home-skill{min-width:0}
 .ov-skills>button>strong{overflow-wrap:anywhere}
 .home-actions{flex-wrap:wrap}.home-actions>*{min-width:0}
 :is(input:not([type=checkbox]):not([type=radio]),textarea,select){font-size:16px}
 :where(.primary,.secondary,.textbutton,.pill,.close,.menu-close,.notification-trigger,.study-actions button,.control-filters button){min-height:44px}
 .planstep{flex-wrap:wrap;gap:12px}.planstep>div{flex:1 1 160px}.planstep button{margin-inline-start:auto}
 .word{align-items:flex-start;gap:10px;flex-wrap:wrap}.word>div{flex:1 1 170px}
 dialog,#variantpicker,#study-helper{max-width:calc(100vw - 16px);max-height:calc(var(--usable-height) - 16px);border-radius:16px}
 #lesson:not(.exam-workspace){width:calc(100% - 16px)}
 #lesson:not(.exam-workspace) .modalhead{padding:12px;gap:8px;max-height:32dvh}
 #lesson:not(.exam-workspace) #lessonbody{padding:16px 12px}
 #lesson:not(.exam-workspace) .modalbody{display:block}
 #lesson .focus-controls button{min-height:40px;font-size:12px}
 #lesson.exam-workspace .modalhead{grid-template-columns:minmax(0,1fr) auto;padding:8px 10px;gap:6px;max-height:30%}
 #lesson.exam-workspace .modalhead h2{font-size:15px;line-height:1.3}
 #lesson.exam-workspace .header-part-nav{grid-column:1/-1;grid-row:2;border-radius:14px;padding:3px}
 #lesson.exam-workspace .header-part-nav button{min-width:72px;padding:8px;font-size:12px;min-height:40px}
 #lesson.exam-workspace .focus-controls{grid-column:2;grid-row:1;gap:4px}
 #lesson.exam-workspace .focus-controls button{padding:8px;min-width:40px;font-size:11px}
 #lesson.exam-workspace .test-top{padding:8px 10px;max-height:25%;gap:6px}
 #lesson.exam-workspace .test-top .examnav{flex-basis:100%;flex-wrap:nowrap;overflow:auto}
 #lesson.exam-workspace .test-top .examnav button{flex:0 0 auto;min-height:40px;white-space:nowrap}
 #lesson.exam-workspace .test-top .toolbar{gap:6px}
 #lesson.exam-workspace .practice-mode-switch{width:auto;flex:1 1 auto;margin:0}
 #lesson.exam-workspace .practice-mode-switch>span{display:none}
 #lesson.exam-workspace .practice-mode-switch button{flex:1;font-size:12px;min-height:40px}
 #lesson.exam-workspace .test-mobile-tabs{display:flex;gap:8px;padding:6px 10px;border-bottom:1px solid #dce5ed}
 #lesson.exam-workspace .test-mobile-tabs button{flex:1;min-height:42px;font-size:13px;padding:9px;border-radius:9px;background:#eef3f8;overflow-wrap:anywhere}
 #lesson.exam-workspace .test-mobile-tabs button[aria-pressed=true]{background:#087f65;color:#fff}
 #lesson.exam-workspace .test-split{display:block;position:relative;flex:1;min-height:100px}
 #lesson.exam-workspace .test-questions,#lesson.exam-workspace .test-source{height:100%;max-height:none;padding:16px 14px 30px;overflow:auto}
 #lesson.exam-workspace .test-source{display:none;order:0}
 #lesson.exam-workspace .show-test-source .test-source{display:block}
 #lesson.exam-workspace .show-test-source .test-questions{display:none}
 #lesson.exam-workspace .test-footer{max-height:25%;padding:6px 10px max(6px,env(safe-area-inset-bottom))}
 #lesson.exam-workspace .test-footer .toolbar{gap:8px}
 #lesson.exam-workspace .test-footer button{font-size:12px;min-height:44px;padding:9px 12px}
 #lesson.exam-workspace .study-actions{margin:0;gap:6px}
 #lesson .matching-text{padding:14px}
 #lesson .question-progress nav{max-height:54px}
 #lesson .question-progress nav button{min-height:34px;min-width:34px}
 .answer-comparison{grid-template-columns:minmax(0,1fr)}
 #study-helper{padding:16px}.helper-options{flex-wrap:wrap}.helper-options label{flex:1 1 130px}
 .helper-suggestions{grid-template-columns:minmax(0,1fr)}
 .video-controls progress{flex-basis:100%;order:5}
 .video-picture .teaching-video{max-height:55dvh}
 .video-stage .video-prompt{padding:14px}.video-stage .video-option{font-size:15px;padding:10px}
 :is(#tutors,#lina-panel) .gemini-avatar-stage{min-height:0;padding:18px 14px}
 :is(#tutors,#lina-panel) .studio-prep-tips,:is(#tutors,#lina-panel) .studio-topics,:is(#tutors,#lina-panel) .gemini-options{grid-template-columns:minmax(0,1fr)}
 :is(#tutors,#lina-panel) .studio-launch{font-size:18px;padding:16px 24px}
 #lina-panel,#lesson #lina-panel{inset:var(--app-top) 0 auto;width:100%;max-width:none;height:var(--usable-height);max-height:var(--usable-height);border-radius:0;padding-bottom:env(safe-area-inset-bottom)}
 .notification-header{padding:14px}.notification-header h2{font-size:20px}.notification-content{padding:14px}
 .notification-dialog .notification-item button{min-height:44px}
 .notification-preferences label{gap:12px}.notification-preferences input{flex-shrink:0}
}
@media(max-width:420px){
 .site-header .menu-panel .nav{grid-template-columns:minmax(0,1fr);gap:18px}
 .site-header .menu-panel .menu-group:last-child{grid-column:auto;display:block}
 .site-header .menu-panel .menu-group h3{font-size:11px;letter-spacing:.08em;margin:0 8px 8px}
 .site-header .menu-panel .nav button,.site-header .menu-panel .nav a{font-size:14px;line-height:1.5;padding:10px;min-height:44px}
 .site-header .menu-panel .nav a{display:flex;align-items:center}
 .site-header .menu-panel .menu-heading{padding:14px}
}
@media(max-width:900px){
 #lesson.schreiben-dialog .dk-write-footer,#lesson.sprechen-dialog .dk-sp-foot{padding-bottom:max(12px,env(safe-area-inset-bottom))}
}
@media(max-width:360px){
 .site-header #accountlink{max-width:82px;font-size:10px;padding-inline:6px}
 .site-header .brand{font-size:14px;gap:4px}
 .site-header .brandmark{width:25px;height:28px;font-size:18px}
 .main{padding-inline:12px}
 #practice .librarytools{grid-template-columns:minmax(0,1fr)}
 .menu-panel .nav,.site-header .menu-panel .nav{grid-template-columns:minmax(0,1fr)}
 .menu-panel .menu-group:last-child{grid-column:auto}
 .control-stats strong{font-size:20px}
 .home-copy h1{font-size:34px}
}
@media(max-height:500px){
 .site-header{position:relative}
 .menu-panel{max-height:calc(var(--usable-height) - 24px);top:12px!important}
 #lesson.exam-workspace .modalhead{max-height:32%;padding:4px 10px}
 #lesson.exam-workspace .modalhead h2{font-size:14px;margin:0}
 #lesson.exam-workspace #lessonbody{overflow:auto}
 #lesson.exam-workspace .test-split{flex:none;height:max(220px,calc(var(--usable-height) - 200px));min-height:220px}
 #lesson.exam-workspace .test-top,#lesson.exam-workspace .test-footer{max-height:none;overflow:visible}
 #lesson.exam-workspace .test-top{padding-block:4px}
 #lesson.exam-workspace .test-footer{position:static}
 #lesson.exam-workspace .test-mobile-tabs{padding-block:3px}
 .notification-dialog .notification-header{padding-block:8px}
}
@media(pointer:coarse){
 :where(.menu-panel button,.header-part-nav button,.matching-option,.matching-slot,.video-option,.owner-table button,.admin-records button){min-height:44px}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

body.visual-short #lesson.exam-workspace #lessonbody{overflow:auto}
body.visual-short #lesson.exam-workspace .test-split{flex:none;height:240px;min-height:220px}
body.visual-short #lesson.exam-workspace .test-top,body.visual-short #lesson.exam-workspace .test-footer{max-height:none;overflow:visible}

.admin-workspace .admin-main{padding-bottom:100px}

.menu-panel .menu-group>a[data-responsive-admin]{display:flex;align-items:center;min-height:44px;padding:10px 12px;border-radius:10px;color:inherit;font-weight:600}
.menu-panel .menu-group>a[data-responsive-admin]:hover{background:#ecfdf5}
.menu-panel .profile>div,.menu-panel .menu-heading>div{min-width:0}
.menu-panel #profilename{overflow-wrap:anywhere}

/* Keep bilingual controls from consuming the title's grid column. */
@media(max-width:1180px){
 #lesson.exam-workspace .modalhead{grid-template-columns:minmax(0,1fr);align-items:start;max-height:40%}
 #lesson.exam-workspace .modalhead>div:first-child{grid-column:1;grid-row:1;width:100%}
 #lesson.exam-workspace .focus-controls{grid-column:1;grid-row:2;width:100%;justify-content:flex-end;flex-wrap:wrap}
 #lesson.exam-workspace .header-part-nav{grid-column:1;grid-row:3;width:100%;margin:0}
 #lesson.exam-workspace .focus-controls button{white-space:normal;overflow-wrap:break-word;line-height:1.4;max-width:100%}
 #lesson.exam-workspace .modalhead .eyebrow{overflow-wrap:normal;word-break:normal;line-height:1.5}
}
@media(max-width:760px){
 #lesson.exam-workspace .modalhead{gap:8px;padding:10px 12px}
 #lesson.exam-workspace .modalhead h2{font-size:17px;line-height:1.35;overflow-wrap:break-word;word-break:normal;margin:3px 0}
 #lesson.exam-workspace .modalhead .theme-title-ar{margin-top:3px;font-size:14px;line-height:1.4}
 #lesson.exam-workspace .focus-controls{gap:8px}
 #lesson.exam-workspace .focus-controls button{flex:1 1 120px;min-height:44px;padding:8px;font-size:12px}
 #lesson.exam-workspace .focus-controls .close{flex:0 1 110px}
 #lesson.exam-workspace .header-part-nav{border-radius:10px}
 #lesson.exam-workspace .test-footer{align-items:stretch}
 #lesson.exam-workspace .test-footer>.toolbar{flex:1 1 100%;justify-content:space-between}
 #lesson.exam-workspace .test-footer .study-actions{flex:1 1 100%;padding:0}
 #lesson.exam-workspace .test-footer .study-actions button{flex:1 1 110px;justify-content:center;white-space:normal;line-height:1.4}
 #lesson.exam-workspace .test-footer .ai-orb{width:18px;height:18px}
 #lesson.exam-workspace .lesson-variants{max-width:100%;flex-shrink:0;flex-wrap:nowrap;overflow:auto;padding:6px 12px}
 #lesson.exam-workspace .lesson-variants button{flex-shrink:0;min-height:40px}
}
/* Practice already has a dedicated AI action. Keep fixed launchers off the answers;
   the assistant panel itself can still open from that action. */
#lesson[open] #lina-bubble,#lesson[open] #whatsapp-widget{display:none!important}
@media(max-height:500px){
 #lesson.exam-workspace .modalhead{max-height:45%}
 #lesson.exam-workspace .modalhead .theme-title-ar{font-size:12px}
}

/* Skill names keep their intrinsic width; owner tools must never squeeze them. */
body.learning-design .site-header .skill-nav button{flex:0 0 auto;min-width:max-content;white-space:nowrap;overflow-wrap:normal}
@media(min-width:761px){
 body.learning-design .site-header .header-inner{flex-wrap:wrap}
 body.learning-design .site-header .skill-nav{flex:0 0 100%;order:3;width:100%;margin:0;justify-content:flex-start;overflow-x:auto}
 body.learning-design .site-header .header-actions{margin-left:auto;max-width:100%;gap:8px}
}