/* Extra mobile responsive tweaks */
@media (max-width:860px){
  .overall-banner{margin-top:16px;}
}
@media (max-width:720px){
  .overall-banner{max-width:none;width:100%;border-radius:18px;text-align:center;}
  .overall-sub{margin:0 0 20px;padding:0 6px;}
}
@media (max-width:640px){
  .history-row{padding:4px 0 10px;}
  .service-card{margin:0 auto 14px;padding:6px 6px 10px;}
  .overall-banner{font-size:.9rem;padding:10px 14px;}
  .overall-sub{font-size:.85rem;}
  .site-footer{font-size:.75rem;}
  .maintenance-section h2{font-size:1rem;}
  .service-grid{grid-template-columns:200px 1fr 110px;column-gap:6px;}
  .service-meta{font-size:.7rem;}
  .mid-head{gap:10px;}
  .hist-progress{width:70px;}
}
@media (max-width:480px){
  .overall-banner{font-size:.85rem;}
  .service-name{flex-direction:column;align-items:flex-start;gap:4px;}
  .service-meta{font-size:.6rem;}
  .inline-history{flex-wrap:wrap;}
  #web-status,#mc-status{margin-top:0;}
}
@media (max-width:400px){
  .hist-progress{display:none;} /* hide tiny update bar if too narrow */
  .service-grid{padding-right:0;}
  .service-grid .right{position:static;margin-top:4px;}
  .history-bar{max-width:100%;}
}