/* WarEra Web Intel mobile responsive layer v32 */
:root{--mobile-header-h:58px}
.mobile-topbar,.mobile-nav-overlay{display:none}

@media (max-width: 980px){
  html,body{max-width:100%;overflow-x:hidden}
  body.mobile-nav-open{overflow:hidden}
  .layout{display:block;min-height:100vh}
  .side{
    position:fixed!important;z-index:1002;top:0;left:0;bottom:0;
    width:min(84vw,320px)!important;height:100dvh!important;
    padding:22px 18px!important;margin:0!important;
    transform:translateX(-105%);transition:transform .2s ease;
    box-shadow:18px 0 50px rgba(0,0,0,.45);overflow-y:auto!important;
    overscroll-behavior:contain;background:#060b12!important
  }
  body.mobile-nav-open .side{transform:translateX(0)}
  .mobile-nav-overlay{
    display:block;position:fixed;z-index:1001;inset:0;background:rgba(0,0,0,.62);
    opacity:0;pointer-events:none;transition:opacity .2s ease;backdrop-filter:blur(2px)
  }
  body.mobile-nav-open .mobile-nav-overlay{opacity:1;pointer-events:auto}
  .mobile-topbar{
    display:flex;position:sticky;z-index:900;top:0;height:var(--mobile-header-h);
    align-items:center;justify-content:space-between;gap:12px;padding:8px 14px;
    border-bottom:1px solid var(--line,#263754);background:rgba(6,11,18,.96);
    backdrop-filter:blur(12px)
  }
  .mobile-brand{display:flex;align-items:center;gap:9px;min-width:0}
  .mobile-brand strong{font-size:18px;white-space:nowrap}.mobile-brand span{color:var(--blue,#67a6ff);font-size:12px;font-weight:800}
  .mobile-menu-button,.mobile-close-button{
    display:grid;place-items:center;width:42px;height:42px;padding:0;border:1px solid var(--line,#263754);
    border-radius:11px;background:#102039;color:#fff;font-size:23px;line-height:1
  }
  .mobile-close-button{position:absolute;right:14px;top:14px}
  .side .brand{padding-right:50px}
  .main{margin-left:0!important;width:100%!important;min-width:0;padding:16px!important}
  h1{font-size:clamp(28px,8vw,38px);line-height:1.12;margin-bottom:16px}
  h2{line-height:1.18}
  .card{padding:16px;margin:14px 0;border-radius:15px}
  .row{align-items:stretch;gap:12px}.row>*{max-width:100%}
  form.inline{flex-direction:column}.two{grid-template-columns:1fr!important}
  input,textarea,select,button,.btn{min-height:44px;font-size:16px}
  button,.btn{touch-action:manipulation}
  pre{max-width:100%;font-size:11px}
  table{min-width:720px}
  .table-scroll,.table-wrap,.responsive-table{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}

  /* Alliance */
  .alliance-dashboard{min-width:0!important}
  .alliance-commandbar,.alliance-hero,.table-panel-header,.catalog-header{align-items:flex-start!important;flex-direction:column!important}
  .alliance-commandbar,.alliance-hero{padding:16px!important}
  .auto-refresh-box{width:100%!important;max-width:none!important}
  .alliance-card-grid{display:flex!important;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:8px}
  .alliance-list-card{flex:0 0 min(86vw,360px);scroll-snap-align:start}
  .alliance-metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
  .metric-card{min-width:0!important;padding:13px!important}.metric-card strong{font-size:21px!important}
  .alliance-panels{grid-template-columns:1fr!important}.build-mode-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .table-tools,.member-tools{width:100%!important;display:grid!important;grid-template-columns:1fr!important;gap:9px!important}
  .country-search,.member-search,.member-sort{width:100%!important;min-width:0!important}
  .mode-filters{overflow-x:auto;flex-wrap:nowrap!important;padding:10px 14px!important}.mode-filter{flex:0 0 auto}
  .contribution-table,.fighter-table,.member-table{min-width:1120px!important}
  .table-footer{flex-direction:column!important;gap:4px!important}
  .fighter-vitals{min-width:145px!important}

  /* Trading Help */
  .trading-help-shell,.trading-help-layout,.trading-layout,.market-layout{min-width:0!important;max-width:100%!important}
  .trading-grid,.market-grid,.orderbook-layout{display:flex!important;flex-direction:column!important}
  .buy-panel,.sell-panel,.chart-panel,.orderbook-panel{width:100%!important;min-width:0!important}
  .chart-panel{order:-1}.chart-wrap,canvas{max-width:100%!important}
  .item-strip,.item-picker{overflow-x:auto!important;flex-wrap:nowrap!important}
  .item-card,.item-button{flex:0 0 auto}
  .trading-toolbar,.chart-toolbar,.range-controls{display:flex!important;overflow-x:auto!important;flex-wrap:nowrap!important;padding-bottom:5px}
  .trading-toolbar>* ,.chart-toolbar>* ,.range-controls>*{flex:0 0 auto}
  .orderbook-table{min-width:620px!important}

  /* Equipment */
  .equipment-layout,.equipment-grid,.equipment-summary-grid{grid-template-columns:1fr!important}
  .equipment-toolbar,.equipment-actions{flex-direction:column!important;align-items:stretch!important}
  .gear-strip{scroll-snap-type:x proximity}.gear-card{scroll-snap-align:start}
  .equipment-heading{flex-direction:column!important}.rarity-legend{overflow-x:auto;max-width:100%}

  /* Profile/admin/general forms */
  .profile-grid,.profile-hero,.profile-columns,.admin-grid{grid-template-columns:1fr!important}
  .profile-hero{flex-direction:column!important;align-items:flex-start!important}
  .stat-grid,.metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media (max-width: 560px){
  .main{padding:11px!important}
  .mobile-topbar{padding-inline:10px}
  .card{padding:13px;border-radius:13px}
  .grid,.alliance-metrics,.stat-grid,.metrics-grid{grid-template-columns:1fr!important}
  .build-mode-grid{grid-template-columns:1fr 1fr!important}
  .alliance-list-card{flex-basis:91vw}
  .alliance-emblem{width:64px!important;height:64px!important}
  .hero-meta{align-items:flex-start!important;flex-direction:column!important;gap:5px!important}
  .metric-card{min-height:78px!important}
  .mode-chip-label{display:inline!important}
  .userbox{margin:16px 0}
}

@media (hover:none){
  .gear-card:hover .gear-details:not([open]){opacity:0;pointer-events:none}
}
