/* v246 clean admin shell and 4-card dashboard layout */
html,
body{
  margin:0!important;
  width:100%!important;
  max-width:100%!important;
  min-height:100%!important;
  background:#f6f7f8!important;
  overflow-x:hidden!important;
}
*{
  box-sizing:border-box!important;
}

@media (min-width:901px){
  html,
  body{
    height:100dvh!important;
    overflow:hidden!important;
  }
  .app-shell{
    display:grid!important;
    grid-template-columns:286px minmax(0,1fr)!important;
    width:100dvw!important;
    height:100dvh!important;
    max-height:100dvh!important;
    overflow:hidden!important;
    background:#f6f7f8!important;
  }
  .sidebar{
    grid-column:1!important;
    position:relative!important;
    inset:auto!important;
    width:286px!important;
    min-width:286px!important;
    height:100dvh!important;
    max-height:100dvh!important;
    transform:none!important;
    overflow:hidden!important;
    z-index:20!important;
  }
  .main{
    grid-column:2!important;
    position:relative!important;
    display:block!important;
    margin:0!important;
    padding:26px 24px!important;
    width:auto!important;
    max-width:none!important;
    min-width:0!important;
    height:100dvh!important;
    max-height:100dvh!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    opacity:1!important;
    visibility:visible!important;
    scroll-padding-top:0!important;
  }
  .topbar{
    position:relative!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    display:grid!important;
    grid-template-columns:minmax(260px,1fr) auto!important;
    align-items:end!important;
    gap:16px!important;
    width:100%!important;
    max-width:none!important;
    margin:0 0 18px!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    background:transparent!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    overflow:visible!important;
    z-index:5!important;
  }
  .title-block{
    grid-column:1!important;
    min-width:0!important;
    overflow:visible!important;
  }
  .title-block h2{
    margin:3px 0 2px!important;
    line-height:1.08!important;
    letter-spacing:0!important;
  }
  .title-block p{
    white-space:normal!important;
  }
  .top-actions{
    grid-column:2!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:10px!important;
    flex-wrap:wrap!important;
    min-width:0!important;
    max-width:760px!important;
    overflow:visible!important;
  }
  .top-actions .btn,
  .top-actions button{
    flex:0 0 auto!important;
    white-space:nowrap!important;
  }
  .content{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
  }
  .page.active{
    display:block!important;
  }
  .admin-filter-bar{
    margin:0 0 16px!important;
  }
  .toolbar.admin-filters{
    display:grid!important;
    grid-template-columns:minmax(220px,1.35fr) minmax(140px,.55fr) minmax(130px,.5fr) minmax(150px,.55fr) minmax(150px,.55fr) auto!important;
    gap:10px!important;
    align-items:center!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    overflow:visible!important;
  }
  .toolbar.admin-filters > *{
    min-width:0!important;
    width:100%!important;
  }
  .toolbar.admin-filters .btn{
    width:auto!important;
    min-width:72px!important;
  }
  .grid{
    display:grid!important;
    gap:16px!important;
    width:100%!important;
    max-width:100%!important;
  }
  .grid.cards{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
  .grid.two{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .grid.three{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  .card,
  .metric,
  .table-wrap{
    min-width:0!important;
    max-width:100%!important;
  }
  .metric{
    min-height:132px!important;
  }
  .hamb{
    display:none!important;
  }
}

@media (max-width:1180px){
  .toolbar.admin-filters{
    grid-template-columns:1fr 1fr 1fr!important;
  }
  .grid.cards,
  .grid.two,
  .grid.three{
    grid-template-columns:1fr 1fr!important;
  }
}

@media (min-width:901px) and (max-width:1180px){
  .grid.cards{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
  .metric{
    padding:16px!important;
  }
  .metric .value{
    font-size:30px!important;
  }
  .metric .sub{
    font-size:12px!important;
  }
}

@media (max-width:900px){
  html,
  body{
    height:auto!important;
    min-height:100%!important;
    overflow:auto!important;
  }
  .app-shell{
    display:block!important;
    width:100%!important;
    min-height:100dvh!important;
    overflow:visible!important;
  }
  .main{
    display:block!important;
    margin:0!important;
    padding:12px!important;
    width:100%!important;
    min-height:100dvh!important;
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }
  .topbar{
    position:relative!important;
    top:auto!important;
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr)!important;
    gap:10px!important;
    margin:0 0 14px!important;
    padding:10px!important;
    border:1px solid var(--line)!important;
    border-radius:20px!important;
    background:rgba(247,248,248,.96)!important;
    box-shadow:0 12px 32px rgba(7,18,13,.08)!important;
    overflow:visible!important;
  }
  .top-actions{
    grid-column:1/-1!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    justify-content:stretch!important;
  }
  .top-actions .btn,
  .top-actions button{
    width:100%!important;
    min-width:0!important;
    justify-content:center!important;
  }
  .content{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
  }
  .toolbar.admin-filters,
  .grid.cards,
  .grid.two,
  .grid.three{
    grid-template-columns:1fr!important;
  }
  .toolbar.admin-filters .btn{
    width:100%!important;
  }
  .sidebar{
    position:fixed!important;
    top:0!important;
    left:0!important;
    bottom:0!important;
    width:min(86vw,320px)!important;
    height:100dvh!important;
    transform:translateX(-105%)!important;
    transition:transform .2s ease!important;
    z-index:100!important;
  }
  .sidebar.open{
    transform:none!important;
  }
  body.sidebar-open{
    overflow:hidden!important;
  }
}

@media (max-width:520px){
  .top-actions{
    grid-template-columns:1fr!important;
  }
  .title-block h2{
    font-size:22px!important;
  }
}

/* v248: final mobile drawer clarity override, loaded after style.css. */
@media(max-width:1180px){
  body.sidebar-open::before,
  .sidebar.open::after{
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    filter:none!important;
    background:rgba(7,18,13,.28)!important;
  }
  .sidebar,
  .sidebar.open,
  .sidebar *,
  .nav,
  .nav button,
  .side-status{
    filter:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    text-shadow:none!important;
  }
  .sidebar{
    background:#06130d!important;
    opacity:1!important;
    box-shadow:18px 0 54px rgba(0,0,0,.28)!important;
  }
  .topbar{
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
}