/* Responsive presentation only; do not override role-based display rules. */
.mobile-menu-toggle{display:none}
@media(max-width:900px){
  .app{display:block!important;min-height:100dvh}
  .app .sidebar{position:sticky!important;top:0;bottom:auto;left:auto;width:100%!important;padding:10px 16px!important;padding-top:max(10px,env(safe-area-inset-top))!important;z-index:30;display:flex;align-items:center;justify-content:space-between;min-height:64px}
  .app .sidebar .brand{display:flex!important;align-items:center;gap:8px;font-size:16px!important;padding:0!important;letter-spacing:0;min-width:0}
  .app .sidebar .brand:before{content:none!important}
  .app .sidebar .brand img{width:36px!important;height:36px!important;object-fit:contain;flex-shrink:0}
  .app .sidebar .brand span{display:inline!important;font-size:16px!important}
  .app .sidebar .mobile-menu-toggle{display:block;flex-shrink:0;min-width:70px;min-height:44px;border:1px solid #64748b;border-radius:10px;padding:8px 12px;color:white;background:#26365a;font:inherit;font-size:15px;cursor:pointer}
  .app .sidebar .nav{display:none;position:absolute;left:0;right:0;top:100%;padding:10px 12px 16px;background:#17223b;max-height:75dvh;overflow-y:auto;box-shadow:0 10px 20px #17223b26;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  .app .sidebar[data-mobile-menu-open="true"] .nav{display:grid}
  .app .sidebar .nav button{font-size:14px!important;min-height:48px;padding:10px!important;line-height:1.5;white-space:normal;overflow-wrap:break-word}
  .app .sidebar .nav .num{font-size:12px;width:24px!important}
  .app .main{margin-left:0!important;width:100%!important;min-width:0;padding:18px 14px 30px!important;scroll-margin-top:80px}
  .app .topbar{display:block;margin-bottom:16px}
  .app .topbar h1{font-size:23px;line-height:1.4;margin-bottom:5px}
  .app .date{font-size:12px}
  .app .page,.app .card,.app .two-col>*{min-width:0;max-width:100%}
  .app .card{padding:16px!important;border-radius:14px}
  .app .two-col,.app .easy-admin,.app .meal-planning-layout{grid-template-columns:minmax(0,1fr)!important;gap:14px!important}
  .app .statgrid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px}
  .app .statgrid .card{padding:12px 9px!important}
  .app .stat .label,.app .stat .hint{font-size:11px;line-height:1.5}
  .app .stat .value{font-size:27px;margin:8px 0}
  #summaryOverview>div:first-child{padding:16px!important;gap:8px!important;border-radius:14px!important}
  #summaryClockDay{font-size:25px!important}#summaryClockTime{font-size:32px!important}
  #summaryClockDate{font-size:13px}
  .app .section-title{font-size:17px;line-height:1.5}
  .app input:not([type="checkbox"]):not([type="radio"]),.app select,.app textarea{font-size:16px!important;max-width:100%;min-width:0}
  .app button:not(.seat-cell),.app select{min-height:44px}
  .app input[type="checkbox"],.app input[type="radio"]{width:20px;height:20px;flex-shrink:0}
  .app .formgrid,.app .easy-grid,.app .school-manager-grid,.app .special-controls,.app .day-grid{grid-template-columns:minmax(0,1fr)!important}
  .app .formgrid>*,.app .easy-grid>*,.app .school-manager-grid>*,.app .special-controls>*{grid-column:auto!important;min-width:0}
  .app .week-tabs,.app .time-tabs{gap:6px;margin-bottom:12px}
  .app .week-tabs button,.app .time-tabs button{padding:8px 10px;font-size:13px}
  .app .school-filter{align-items:stretch!important}
  .app .school-filter select,.app .admin-feature-chooser select{width:100%!important;min-width:0!important}
  .app .attendance-row:not(.header){grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px;border:1px solid #e5eaf2;border-radius:12px;margin:10px 0;padding:14px;font-size:14px}
  .app .attendance-row.header{display:none!important}
  .app .attendance-row>.student{grid-column:1/-1;font-size:16px;line-height:1.6}
  .app .attendance-row>*:nth-child(4){display:flex!important}
  .app .attendance-row>.check{min-height:44px;flex-wrap:wrap;font-size:12px}
  .app .attendance-row>div:nth-last-child(2),.app .attendance-row>div:last-child{grid-column:1/-1;min-width:0}
  .app .attendance-row .greenbtn{margin-top:0}
  .app .tag{max-width:100%;white-space:normal;display:inline-block}
  .app .table{display:block;max-width:100%;overflow-x:auto}
  .app .summary-grade-grid{max-width:100%;overflow-x:auto}
  .app .meal-row{grid-template-columns:minmax(0,1fr) auto!important;gap:10px!important}
  .app .meal-row>.avatar{display:none!important}
  .app .meal-row .name{min-width:0;overflow-wrap:anywhere}
  .app .meal-row button{grid-column:1/-1}
  .app .permission-row,.app .teacher-identity{overflow-wrap:anywhere}
  .app .teacher-identity{flex-wrap:wrap}
  .app .admin-search{flex-wrap:wrap}.app .admin-search input{flex:1;min-width:130px!important}
  #logout{position:static!important;display:block;margin:8px 14px 20px!important;max-width:calc(100% - 28px);min-height:44px}
  .mobile-menu-toggle:focus-visible,.nav button:focus-visible{outline:3px solid #8cb5ff;outline-offset:2px}
}