/* HaulFoundry UI consistency hotfix: iPad/tablet portrait (720–1023 CSS px).
   Presentation only: keeps all original navigation, fields and app handlers. */
@media (min-width:720px) and (max-width:1023px) {
  /* Use the available tablet canvas rather than the phone-width composition. */
  html { width:100%; }
  body {
    max-width:none!important;
    margin:0!important;
    padding:14px 18px 28px 120px!important;
    min-width:0;
  }
  body>.top-dock,body>section,body>.install {
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
    min-width:0;
  }
  .top-dock { margin-bottom:14px!important; }
  .command-head { min-height:76px!important; padding:12px 15px!important; }
  .command-brand .brand-mark { width:128px!important; height:52px!important; }
  .top-dock .terminalbar { padding:11px 14px!important; }

  /* The existing six real navigation buttons become a compact tablet rail.
     No duplicate links, removed destinations or changed navigation handlers. */
  .nav {
    position:fixed!important;
    top:12px!important;
    bottom:12px!important;
    left:10px!important;
    right:auto!important;
    width:96px!important;
    height:auto!important;
    padding:12px 7px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
    align-items:stretch!important;
    gap:7px!important;
    border:1px solid rgba(100,175,238,.28)!important;
    border-radius:15px!important;
    background:rgba(8,22,39,.98)!important;
    box-shadow:10px 0 30px rgba(0,0,0,.16)!important;
    overflow-y:auto;
    overflow-x:hidden;
    z-index:29;
  }
  .nav-brand { display:none!important; }
  .nav button {
    flex:0 0 auto!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    min-width:0!important;
    min-height:67px!important;
    padding:8px 3px!important;
    font-size:10px!important;
    line-height:1.2!important;
    border:1px solid transparent!important;
    border-radius:11px!important;
    text-align:center;
    white-space:normal;
  }
  .nav button.on { border-color:rgba(93,175,247,.35)!important; }
  .nav button i { font-size:21px!important; line-height:1.25!important; }

  /* Four metrics / three action-center columns, rather than phone's two. */
  .metrics { grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:10px!important; }
  .metric { min-height:79px!important; padding:12px!important; }
  .coveragebar { grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:9px!important; }
  .view { padding:14px 10px 24px!important; min-width:0; }
  .view .form,.modal .form { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  .sortbar,.exportbar { max-width:none!important; }

  /* Tablet editor dialogs are centered and substantially wider than a phone sheet. */
  .modal { align-items:center!important; justify-content:center!important; padding:20px!important; }
  .modal .sheet {
    width:min(820px,calc(100vw - 160px))!important;
    max-width:100%!important;
    max-height:90vh!important;
    max-height:90dvh!important;
    padding:19px!important;
    border-radius:17px!important;
  }
  .item-actions .btn { flex:1 1 110px; }
}
