/* OA front end only: shared by teacher, manager and student sessions. */
body[data-role=teacher]{-webkit-text-size-adjust:100%;text-size-adjust:100%;min-width:0}
body[data-role=teacher] .main,body[data-role=teacher] .main>section,body[data-role=teacher] .right-column,body[data-role=teacher] .card,body[data-role=teacher] .login-card>*{min-width:0;max-width:100%}
body[data-role=teacher] .sidebar{overflow-y:auto;overscroll-behavior-y:contain}
body[data-role=teacher] .sidebar .brand{white-space:normal;min-width:0}
body[data-role=teacher] .sidebar .brand strong,body[data-role=teacher] .sidebar .brand span{overflow-wrap:anywhere}
body[data-role=teacher] .page-header{flex-wrap:wrap;gap:16px;padding-left:0;padding-right:0}
body[data-role=teacher] .page-header>div:first-child{flex:1 1 420px;min-width:0}
body[data-role=teacher] .top-actions{max-width:100%;margin-left:auto;flex-wrap:wrap;white-space:normal}
body[data-role=teacher] #account-menu:not([hidden]){max-width:100%;flex-wrap:wrap;justify-content:flex-end;gap:8px 14px;white-space:normal}
body[data-role=teacher] #account-menu .account-identity{min-width:0;max-width:100%}
body[data-role=teacher] #account-menu #user-name{min-width:0;overflow-wrap:anywhere;white-space:normal}
body[data-role=teacher] .account-dropdown{max-width:calc(100vw - 24px)}
body[data-role=teacher] .teacher-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
body[data-role=teacher] .student-grid{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr)}
body[data-role=teacher] .two-columns{grid-template-columns:repeat(2,minmax(0,1fr))}
body[data-role=teacher] .card-heading,body[data-role=teacher] .author-line,body[data-role=teacher] .tags,body[data-role=teacher] .detail-tools,body[data-role=teacher] .receipt-actions,body[data-role=teacher] .reply-actions,body[data-role=teacher] .form-actions{flex-wrap:wrap}
body[data-role=teacher] .card-heading>*{min-width:0;max-width:100%}
body[data-role=teacher] .card h2,body[data-role=teacher] .description,body[data-role=teacher] .page-header h1,body[data-role=teacher] .status-row button{overflow-wrap:anywhere}
body[data-role=teacher] input,body[data-role=teacher] select,body[data-role=teacher] textarea{min-width:0;max-width:100%}
body[data-role=teacher] .toolbar{height:auto;min-height:44px;flex-wrap:wrap;gap:6px;padding:5px 8px}
body[data-role=teacher] .toolbar button{min-width:38px;min-height:38px;line-height:38px;height:auto}
body[data-role=teacher] .toolbar>span{margin-left:0}
body[data-role=teacher] .file-chip{min-width:0;max-width:100%}
body[data-role=teacher] .file-chip>span:nth-child(2){flex:1;min-width:0;max-width:none}
body[data-role=teacher] .file-chip .file-symbol,body[data-role=teacher] .file-chip button{flex-shrink:0}
body[data-role=teacher] .attachment-link{min-width:0;max-width:100%}
body[data-role=teacher] .attachment-link>span:last-child{min-width:0;overflow-wrap:anywhere}
body[data-role=teacher] .attachment-media img,body[data-role=teacher] .attachment-media video,body[data-role=teacher] .attachment-media audio{max-width:100%}
body[data-role=teacher] .attachment-media img{max-height:min(60svh,480px)}
body[data-role=teacher] .dialog{max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain;width:min(560px,calc(100vw - 24px))}
body[data-role=teacher] .learning-items{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
body[data-role=teacher] #vocabulary-frame{width:100%;max-width:100%;height:calc(100vh - 160px);height:calc(100dvh - 160px);min-height:540px}
@media(max-width:1179px){
 body[data-role=teacher] .teacher-grid,body[data-role=teacher] .student-grid{grid-template-columns:minmax(0,1fr)}
 body[data-role=teacher] .right-column{grid-template-columns:minmax(0,1fr)}
 body[data-role=teacher] .button,body[data-role=teacher] #account-menu button,body[data-role=teacher] .tabs button{min-height:44px}
 body[data-role=teacher] input:not([type=checkbox]),body[data-role=teacher] select{min-height:44px;font-size:16px}
 body[data-role=teacher] textarea,body[data-role=teacher] .editor{font-size:16px}
}
@media(max-width:960px){
 body[data-role=teacher] .sidebar{position:relative;inset:auto;width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;overflow:visible;padding-top:env(safe-area-inset-top,0px)}
 body[data-role=teacher] .sidebar .brand{grid-column:1;grid-row:1;padding:16px 20px}
 html[lang] body[data-role=teacher] .sidebar .brand strong{font-size:24px;line-height:1.35}
 html[lang] body[data-role=teacher] .sidebar .brand span{display:block;margin:4px 0 0;font-size:12px;line-height:1.45}
 body[data-role=teacher] .sidebar .side-footer{grid-column:2;grid-row:1;margin:0;padding:8px 16px 8px 0}
 body[data-role=teacher] .sidebar .side-footer>p{display:none}
 body[data-role=teacher] .sidebar .languages{position:static;display:flex;justify-content:flex-end;gap:4px;border:0;padding:0;margin:0}
 body[data-role=teacher] .sidebar .languages button{min-width:44px;min-height:44px;padding:4px;font-size:20px}
 body[data-role=teacher] .sidebar .languages button span{display:block;margin-top:0;font-size:10px;line-height:1.3}
 body[data-role=teacher] .sidebar nav{grid-column:1/-1;grid-row:2;display:flex;min-width:0;max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;border-top:1px solid #ffffff20}
 body[data-role=teacher] .sidebar nav>a{flex:0 0 auto;min-height:48px;border-left:0;border-bottom:3px solid transparent;padding:10px 16px;white-space:nowrap}
 body[data-role=teacher] .sidebar nav>a.selected{border-bottom-color:#73a8e4}
 body[data-role=teacher] .sidebar nav>a small{display:none}
 body[data-role=teacher] .sidebar nav>a svg{width:21px}
 html[lang] body[data-role=teacher] .sidebar nav>a b{font-size:15px}
 body[data-role=teacher] .main{margin-left:0;padding:20px max(16px,env(safe-area-inset-right,0px)) max(24px,env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
 body[data-role=teacher].login-screen .main{min-height:0;justify-content:flex-start}
 body[data-role=teacher].login-screen .login-card{margin:12px auto 24px;min-height:440px}
 body[data-role=teacher] #toast{left:50%;max-width:calc(100vw - 32px);bottom:max(20px,env(safe-area-inset-bottom,0px));overflow-wrap:anywhere}
}
@media(max-width:600px){
 body[data-role=teacher] .sidebar{grid-template-columns:minmax(0,1fr)}
 body[data-role=teacher] .sidebar .brand{grid-column:1;grid-row:1;padding:14px 16px 6px}
 html[lang] body[data-role=teacher] .sidebar .brand strong{font-size:clamp(19px,5.3vw,24px);line-height:1.4;white-space:normal;overflow-wrap:anywhere}
 html[lang=zh] body[data-role=teacher] .sidebar .brand strong{white-space:nowrap!important;overflow-wrap:normal!important}
 html[lang] body[data-role=teacher] .sidebar .brand span{font-size:11px;white-space:normal;overflow-wrap:anywhere}
 body[data-role=teacher] .sidebar .side-footer{grid-column:1;grid-row:2;padding:0 12px 6px}
 body[data-role=teacher] .sidebar .languages{justify-content:flex-end;gap:8px}
 body[data-role=teacher] .sidebar nav{grid-column:1;grid-row:3}
 body[data-role=teacher] .main{padding:16px max(12px,env(safe-area-inset-right,0px)) max(24px,env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px))}
 body[data-role=teacher] .page-header{gap:12px}
 body[data-role=teacher] .page-header>div:first-child{flex-basis:100%}
 body[data-role=teacher] .page-header h1{font-size:clamp(23px,6.5vw,30px);line-height:1.4}
 body[data-role=teacher] .top-actions{width:100%;justify-content:flex-end;padding-top:0}
 body[data-role=teacher] .card,body[data-role=teacher] .messages-card{padding:16px 12px}
 body[data-role=teacher] .two-columns{grid-template-columns:minmax(0,1fr);gap:0}
 body[data-role=teacher] .compose-card label:not(.check){font-size:15px}
 body[data-role=teacher] .toolbar button{min-width:40px;min-height:44px;line-height:44px}
 body[data-role=teacher] .editor{padding:12px;min-height:210px}
 body[data-role=teacher] .check{align-items:flex-start;min-height:44px;padding:8px 0}
 body[data-role=teacher] .check input{flex:0 0 auto;margin-top:3px}
 body[data-role=teacher] .form-actions{gap:8px}
 body[data-role=teacher] .form-actions .text{flex-basis:100%;justify-content:flex-start}
 body[data-role=teacher] .form-actions .button:not(.text){flex:1 1 110px;min-width:0;font-size:14px}
 body[data-role=teacher] .reply-body{margin-left:0;padding:10px}
 body[data-role=teacher] .author-line{gap:7px}
 body[data-role=teacher] .author-line>.subtle{border-left:0;padding-left:0;flex-basis:100%}
 body[data-role=teacher] .assignment-preview,body[data-role=teacher] .assignment-detail{padding:12px 10px}
 body[data-role=teacher] .status-row{align-items:flex-start;flex-wrap:wrap}
 body[data-role=teacher] .tabs{gap:14px;flex-wrap:wrap}
 body[data-role=teacher] .login-card{grid-template-columns:minmax(0,1fr)}
 body[data-role=teacher].login-screen .login-art{min-height:205px;padding:20px}
 body[data-role=teacher].login-screen .login-art>.login-system-title{left:20px;right:20px;font-size:clamp(20px,6vw,27px)}
 body[data-role=teacher].login-screen .login-art>.login-art-copyright{display:block;left:20px;right:20px;bottom:15px;font-size:11px}
 body[data-role=teacher] .login-form{padding:24px 20px}
 body[data-role=teacher] .dialog{padding:20px 16px}
 body[data-role=teacher] .dialog .two-columns{grid-template-columns:minmax(0,1fr)}
 body[data-role=teacher] #vocabulary-frame{height:80vh;height:80dvh;min-height:520px}
}
@media(max-height:500px) and (orientation:landscape){
 body[data-role=teacher] .dialog{max-height:calc(100dvh - 16px)}
 body[data-role=teacher].login-screen .login-card{margin-top:0}
}

@media(max-width:600px){html[lang=zh] body[data-role=teacher] .login-system-title>[data-i18n=oaFullName]{white-space:nowrap}}
@media(max-width:600px){html[lang=zh] body[data-role=teacher] .sidebar .brand strong br{display:none}}