/* Compact desktop chrome and a readable phone header. Lesson actions reserve
   their own row in the app shell rather than covering the scrolling material. */
.app-mobile-menu{display:none}
@media(min-width:1000px){
  .app-shell>.app-header{min-height:64px;padding-block:9px;gap:12px}
  .app-header .teacher-identity strong{font-size:22px}
  .app-navigation button,.app-navigation .app-breadcrumb-current{min-height:36px}
  .app-shell>.app-content{padding-block:20px 28px}
}
@media(max-width:780px){
  .app-shell>.app-header{min-height:60px;padding:6px 14px;gap:12px;background:#fff}
  .app-header .teacher-identity{margin-inline:0 auto;min-width:0;gap:0}
  .app-header .teacher-identity img,.app-header #app-subtitle{display:none}
  .app-header .teacher-identity>div{display:block}
  .app-header .teacher-identity strong{font-size:21px;line-height:1.2;white-space:nowrap}
  .app-header .ai-badge{font-size:inherit;vertical-align:baseline;margin-left:0;padding:0;border:0;background:none;color:#1672e8}
  .app-header #back-button{min-width:44px;min-height:48px;padding:5px 8px;border:0;background:none}
  .app-header #back-button>span:not(.app-back-arrow){display:none}
  .app-header #back-button .app-back-arrow{font-size:25px}
  .app-header .app-course-button,.app-header #close-app{display:none}
  .app-mobile-menu{display:block;position:relative;flex:none}
  .app-mobile-menu>summary{display:flex;align-items:center;justify-content:center;min-width:48px;min-height:48px;list-style:none;border-radius:8px;cursor:pointer;color:#24577f}
  .app-mobile-menu>summary::-webkit-details-marker{display:none}
  .app-mobile-menu>summary svg{width:24px;height:24px}
  .app-mobile-menu[open]>summary{background:#edf5ff}
  .app-mobile-menu>nav{position:absolute;right:0;top:calc(100% + 8px);z-index:40;display:grid;gap:2px;width:232px;max-width:calc(100vw - 28px);padding:8px;border:1px solid #c6dcee;border-radius:10px;background:#fff;box-shadow:0 8px 24px rgba(28,69,111,.16)}
  .app-mobile-menu>nav button{display:block;width:100%;min-height:48px;padding:10px 12px;background:transparent;color:#24577f;text-align:left;font-size:16px;border-radius:6px}
  .app-mobile-menu>nav button:hover{background:#edf5ff}
  .app-mobile-menu summary:focus-visible,.app-mobile-menu button:focus-visible{outline:3px solid #69a7e9;outline-offset:2px}
  .app-shell>.app-navigation{padding-inline:14px}
  .app-navigation button,.app-navigation .app-breadcrumb-current{font-size:13px;min-height:34px}
  .app-navigation li+li::before{margin-inline:6px}
  .app-navigation .app-breadcrumb-compact{min-width:0}
  .app-navigation .app-breadcrumb-compact .app-breadcrumb-wide{display:none}
  .app-navigation .app-breadcrumb-compact .app-breadcrumb-mobile-parent{min-width:0;max-width:100%}
  .app-navigation .app-breadcrumb-compact .app-breadcrumb-mobile-parent::before{display:none}
  .app-navigation .app-breadcrumb-compact .app-breadcrumb-mobile-parent button{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}
  .app-shell>.app-content{padding:16px 14px 24px}
  .keyboard-open .app-shell>.app-header{min-height:48px;padding-block:0}
  .keyboard-open .app-header #back-button,.keyboard-open .app-mobile-menu>summary{min-height:44px}
  .keyboard-open .app-shell>.app-content{padding-block:8px 14px}
}