/* B.E.A.R.S. V139 — mobile portrait responsiveness only.
   Desktop approved layouts remain unchanged above 700px. */
@media (max-width:700px){
  html,body{width:100%;max-width:100%;overflow-x:hidden}
  #app,.page,.content{width:100%;max-width:100%;box-sizing:border-box;min-width:0}
  .topbar{width:100%;max-width:100%;box-sizing:border-box;gap:10px;padding:0 10px}
  .hamb{font-size:30px;padding:0 2px;flex:0 0 auto}
  .school-mark{min-width:0;flex:1;gap:7px;overflow:hidden}
  .school-mark .paw,.gold-paw{flex:0 0 auto}
  .school-title{font-size:14px;line-height:1.1;white-space:normal}
  .school-motto{display:none!important}
  .top-spacer{display:none}
  .bell-btn{width:38px;height:38px;flex:0 0 auto}
  .profile{padding-left:0;gap:5px;flex:0 0 auto}
  .avatar{width:38px;height:38px}
  .profile>div:not(.avatar),.profile>span:not(.avatar){display:none}

  /* Show the entire approved home hero instead of cropping it in portrait. */
  .landing-hero{width:100%;height:auto!important;min-height:0!important;aspect-ratio:1536/412!important;background-size:contain!important;background-position:center center!important;background-repeat:no-repeat!important;position:relative}
  .landing-system-label{left:17.2%;top:39%;font-size:clamp(6px,1.45vw,10px)}

  /* Keep home controls readable without widening the page. */
  .quick-row{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px;padding:10px 12px}
  .quick-btn{min-width:0;min-height:76px;padding:12px 13px;gap:9px}
  .quick-btn .qicon{font-size:27px;min-width:31px}
  .quick-btn .qtext{font-size:17px;overflow-wrap:normal;word-break:normal;hyphens:none;line-height:1.05}
  .quick-btn .arrow{font-size:28px}
  .landing-panels{grid-template-columns:1fr!important;padding:0 12px 12px;min-width:0}
  .panel{min-width:0;max-width:100%;overflow:hidden}

  /* Wide data stays inside its own scroll area instead of pushing the whole app off-screen. */
  .section,.toolbar,.cards,.grid2,.grid3,.obs-grid{min-width:0;max-width:100%;box-sizing:border-box}
  .recent-table,.data-table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .table-wrap,.table-scroll,.v30-assessment-table{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  img,svg,canvas{max-width:100%}
  .footer-img{margin-left:12px;margin-right:12px}
}
@media (max-width:430px){
  .quick-btn{padding-left:10px;padding-right:10px;gap:6px}
  .quick-btn .qicon{font-size:24px;min-width:27px}
  .quick-btn .qtext{font-size:15px}
  .school-title{font-size:13px}
}