/* Vetra 0.3.1.37c - VS1B Developer Asset Mobile Correction
   Additive live correction over approved VS1A (0.3.1.37b).
   This file changes only Developer Asset Catalog mobile/tablet presentation.
   Asset data, private-data authority, listing links, desktop table behavior,
   Trust, Reviews, Offers, Messaging, Storefront, AI, Workbench and SEO are untouched. */

/* The VS1A rule relied on the Navigator-created .devhub-view wrapper. The live mobile
   report showed that the Asset Catalog could still present as the wide desktop table.
   Target the stable Developer Asset container itself so the correction is independent
   of view-wrapper timing/structure. Keep desktop (>1000px) completely unchanged. */
@media(max-width:1000px){
  #developerHubModal,
  #developerHubModal .developer-hub-modal,
  #developerHubModal #developerHubContent,
  #developerHubModal .developer-hub,
  #developerHubModal [data-dev-liquidation],
  #developerHubModal [data-dev-liquidation] .liquidation-dashboard{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
    overflow-x:hidden!important;
  }

  /* Keep the summary metrics inside the phone viewport. */
  #developerHubModal [data-dev-liquidation] .developer-section-head{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
    flex-wrap:wrap!important;
  }
  #developerHubModal [data-dev-liquidation] .developer-section-head>div{
    min-width:0!important;
    max-width:100%!important;
  }
  #developerHubModal [data-dev-liquidation] .developer-section-head .pill{
    max-width:100%!important;
  }
  #developerHubModal [data-dev-liquidation] .liquidation-stat-grid{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }
  #developerHubModal [data-dev-liquidation] .liquidation-stat-grid article{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    padding:10px!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }
  #developerHubModal [data-dev-liquidation] .liquidation-stat-grid strong{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    font-size:clamp(.9rem,4.2vw,1.12rem)!important;
    line-height:1.2!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
    font-variant-numeric:tabular-nums;
  }
  #developerHubModal [data-dev-liquidation] .liquidation-stat-grid span{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    line-height:1.3!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  #developerHubModal [data-dev-liquidation] .liquidation-actions{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }
  #developerHubModal [data-dev-liquidation] .liquidation-actions button{
    width:100%!important;
    max-width:100%!important;
    white-space:normal!important;
  }

  /* Mobile Asset Catalog: one listing card, then one readable key/value line per field.
     This targets the actual data-dev-liquidation node and therefore does not depend on
     the Developer Hub Navigator wrapper being present when styles resolve. */
  #developerHubModal [data-dev-liquidation] .liquidation-table-shell{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    max-height:none!important;
    margin-top:4px!important;
    overflow:visible!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-sizing:border-box!important;
  }
  #developerHubModal [data-dev-liquidation] table.liquidation-table{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    table-layout:auto!important;
    border-collapse:separate!important;
    border-spacing:0!important;
    box-sizing:border-box!important;
  }
  #developerHubModal [data-dev-liquidation] table.liquidation-table thead{
    display:none!important;
  }
  #developerHubModal [data-dev-liquidation] table.liquidation-table tbody{
    display:grid!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    gap:12px!important;
  }
  #developerHubModal [data-dev-liquidation] table.liquidation-table tbody tr{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    overflow:hidden!important;
    border:1px solid var(--line)!important;
    border-radius:15px!important;
    background:linear-gradient(180deg,var(--panel-2),var(--panel))!important;
    box-shadow:0 8px 24px rgba(0,0,0,.12)!important;
    box-sizing:border-box!important;
  }
  #developerHubModal [data-dev-liquidation] table.liquidation-table tbody tr[hidden]{
    display:none!important;
  }
  #developerHubModal [data-dev-liquidation] table.liquidation-table tbody td{
    position:static!important;
    left:auto!important;
    display:grid!important;
    grid-template-columns:minmax(86px,34%) minmax(0,1fr)!important;
    align-items:start!important;
    gap:10px!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    padding:9px 11px!important;
    border:0!important;
    border-top:1px solid var(--line)!important;
    background:transparent!important;
    box-sizing:border-box!important;
    text-align:left!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }
  #developerHubModal [data-dev-liquidation] table.liquidation-table tbody td::before{
    display:block!important;
    color:var(--muted)!important;
    font-size:.68rem!important;
    font-weight:900!important;
    letter-spacing:.055em!important;
    line-height:1.35!important;
    text-transform:uppercase!important;
  }
  #developerHubModal [data-dev-liquidation] table.liquidation-table tbody td:nth-child(1){
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    padding:12px!important;
    border-top:0!important;
    background:linear-gradient(135deg,rgba(44,139,229,.14),rgba(44,139,229,.04))!important;
  }
  #developerHubModal [data-dev-liquidation] table.liquidation-table tbody td:nth-child(1)::before{
    content:none!important;
    display:none!important;
  }
  #developerHubModal [data-dev-liquidation] .liquidation-listing-cell,
  #developerHubModal [data-dev-liquidation] .liquidation-listing-cell>div{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }
  #developerHubModal [data-dev-liquidation] .liquidation-listing-cell .text-btn{
    position:static!important;
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    color:var(--brand)!important;
    font-size:.92rem!important;
    font-weight:900!important;
    line-height:1.35!important;
    text-align:left!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }
  #developerHubModal [data-dev-liquidation] .liquidation-listing-cell small{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin-top:5px!important;
    color:var(--muted)!important;
    font-size:.72rem!important;
    line-height:1.35!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  #developerHubModal [data-dev-liquidation] table.liquidation-table tbody td:nth-child(2)::before{content:"Status"!important}
  #developerHubModal [data-dev-liquidation] table.liquidation-table tbody td:nth-child(3)::before{content:"Qty"!important}
  #developerHubModal [data-dev-liquidation] table.liquidation-table tbody td:nth-child(4)::before{content:"Market"!important}
  #developerHubModal [data-dev-liquidation] table.liquidation-table tbody td:nth-child(5)::before{content:"Ask"!important}
  #developerHubModal [data-dev-liquidation] table.liquidation-table tbody td:nth-child(6)::before{content:"Sold"!important}
  #developerHubModal [data-dev-liquidation] table.liquidation-table tbody td:nth-child(7)::before{content:"Target"!important}
  #developerHubModal [data-dev-liquidation] table.liquidation-table tbody td:nth-child(8)::before{content:"Floor"!important}
  #developerHubModal [data-dev-liquidation] table.liquidation-table tbody td:nth-child(9)::before{content:"Storage"!important}
  #developerHubModal [data-dev-liquidation] table.liquidation-table tbody td.storage-cell{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }
}

@media(max-width:430px){
  #developerHubModal [data-dev-liquidation] .liquidation-stat-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  #developerHubModal [data-dev-liquidation] table.liquidation-table tbody td{
    grid-template-columns:82px minmax(0,1fr)!important;
  }
}