/* MeshCave 7.3.1 — full mobile usability audit */
html,body{max-width:100%;overflow-x:clip}
*{box-sizing:border-box}
img,svg,video,canvas,iframe{max-width:100%}
main,.container,.panel,.form-card,.summary-card,.dashboard-panel,.cs-panel,.admin-content{min-width:0}

@media(max-width:820px){
  html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
  body{width:100%;min-width:0;overflow-x:hidden}
  main{width:100%;min-width:0;overflow:hidden}
  .container{width:100%!important;max-width:100%!important;padding-left:14px!important;padding-right:14px!important;margin-left:auto!important;margin-right:auto!important}
  .page-head{padding-top:22px}
  .page-head h1{font-size:clamp(25px,8vw,34px);line-height:1.08;overflow-wrap:anywhere}
  .page-head p,.muted{overflow-wrap:anywhere}

  /* Header: no compression or accidental overflow */
  .header-inner{width:100%;grid-template-columns:minmax(0,1fr) auto!important}
  .header-inner>.logo{min-width:0;overflow:hidden;text-overflow:ellipsis}
  .mobile-header-actions{flex:0 0 auto}
  .mobile-search-toggle,.mobile-menu-toggle{width:42px;height:42px;flex:0 0 42px}
  .header-search{min-width:0}
  .header-search input{min-width:0;width:100%}

  /* Generic layouts */
  .admin-layout,.account-shell,.pd-layout,.cart-layout,.checkout-layout,.cs-layout,.analytics-layout,.creator-layout,.form-grid,.cockpit-grid,.dashboard-columns{display:grid!important;grid-template-columns:minmax(0,1fr)!important;width:100%!important;min-width:0!important;gap:16px!important}
  .admin-nav,.account-sidebar{position:static!important;width:100%!important;max-width:100%!important;overflow-x:auto;overflow-y:hidden;display:flex!important;gap:8px!important;padding:10px!important;scrollbar-width:thin}
  .admin-nav a,.account-sidebar nav a{white-space:nowrap;flex:0 0 auto}
  .account-sidebar nav{display:flex!important;gap:8px!important;margin-top:0!important}
  .account-user{display:none!important}

  /* Forms */
  input,select,textarea,button,.btn-primary,.btn-secondary,.btn-ghost{max-width:100%;font-size:16px}
  input:not([type=checkbox]):not([type=radio]),select,textarea{width:100%!important;min-width:0!important}
  input[type=file]{white-space:normal;overflow:hidden}
  .form-grid,.form-row,.field-row,.upload-grid,.edit-grid,.rep-create-grid,.cc-editor-fields{grid-template-columns:minmax(0,1fr)!important}
  .form-card,.panel,.dashboard-panel,.cs-panel,.cockpit-card{padding:15px!important;border-radius:16px!important}
  .form-foot,.actions,.page-actions,.cs-hero-actions,.cc-card-actions{display:flex!important;flex-wrap:wrap!important;gap:9px!important}
  .form-foot>* , .actions>* , .page-actions>*{flex:1 1 150px;min-width:0}

  /* Product page */
  .pd-layout{display:block!important}
  .pd-media,.pd-info,.pd-side,.pd-main,.pd-package-layout,.package-layout{width:100%!important;max-width:100%!important;min-width:0!important}
  .pd-info{margin-top:18px}
  .pd-main-image,.pd-main-image-viewer-fallback,.viewer-shell,.viewer-stage{min-height:260px!important;height:auto!important;max-height:66vh!important}
  .pd-gallery-thumbs{width:100%;overflow-x:auto!important;overscroll-behavior-inline:contain;scroll-snap-type:x proximity}
  .pd-gallery-thumbs>*{scroll-snap-align:start;flex:0 0 68px!important;width:68px!important;height:68px!important}
  .pd-actions{display:grid!important;grid-template-columns:minmax(0,1fr) auto auto!important;gap:8px!important}
  .pd-actions .btn-primary,.pd-actions .btn-secondary{grid-column:1/-1;width:100%}
  .package-explorer,.package-tree,.technical-card,.trust-panel{width:100%;min-width:0;overflow-wrap:anywhere}
  .package-tree{overflow-x:auto}

  /* Seller / Creator Studio */
  .cs-shell{padding:24px 14px 56px!important;width:100%!important}
  .cs-hero{display:block!important}
  .cs-hero h1{font-size:clamp(30px,10vw,44px)!important;overflow-wrap:anywhere}
  .cs-hero-actions{justify-content:flex-start!important;margin-top:14px}
  .cs-quick-actions,.cs-metrics,.cs-assets{grid-template-columns:minmax(0,1fr)!important}
  .cs-quick-actions a,.cs-metric{min-width:0!important}
  .cs-asset-card{grid-template-columns:82px minmax(0,1fr)!important}
  .cs-asset-preview{min-height:96px!important}
  .cs-asset-title{min-width:0}
  .cs-asset-title h3{white-space:normal!important;overflow-wrap:anywhere}
  .creator-score-main,.studio-reputation-head,.analytics-head{flex-direction:column!important;align-items:flex-start!important}
  .edit-image-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .upload-layout,.launch-layout,.upload-step-layout{display:grid!important;grid-template-columns:minmax(0,1fr)!important}
  .upload-left,.upload-right{width:100%!important;min-width:0!important}

  /* Catalog */
  .catalog-layout{width:100%;min-width:0}
  .catalog-toolbar{width:100%;min-width:0}
  .catalog-results,.product-grid{width:100%;min-width:0}
  .product-card,.product-card-shell{min-width:0}

  /* Tables: safe scrolling until phone-card conversion */
  .table-wrap{width:100%;max-width:100%;overflow-x:auto!important;-webkit-overflow-scrolling:touch}
  table.table{width:100%;max-width:100%}

  /* Tabs and horizontal toolbars */
  .buyer-nav,.dashboard-tabs,.tabs,.tab-list,.notification-tabs,.period-tabs,.analytics-periods{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;max-width:100%;padding-bottom:4px;scrollbar-width:thin;overscroll-behavior-inline:contain}
  .buyer-nav>* ,.dashboard-tabs>* ,.tabs>* ,.tab-list>* ,.notification-tabs>* ,.period-tabs>* ,.analytics-periods>*{flex:0 0 auto;white-space:nowrap}

  /* Cards and long content */
  .dashboard-stats,.cockpit-metrics,.analytics-metrics,.metric-grid,.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .dashboard-stats article,.cockpit-metrics>*,.analytics-metrics>*{min-width:0;padding:14px!important}
  pre,code{max-width:100%;white-space:pre-wrap;overflow-wrap:anywhere}
  .notification-item,.purchase-row,.order-row,.cart-item{max-width:100%;min-width:0}

  /* Footer */
  .site-footer,.footer-mobile{width:100%!important;max-width:100%!important;overflow:hidden}
  .footer-mobile{padding-left:14px!important;padding-right:14px!important}
  .footer-mobile-brand p{overflow-wrap:anywhere}
}

@media(max-width:640px){
  .container{padding-left:10px!important;padding-right:10px!important}
  .page-head{padding-top:18px}
  .page-head h1{font-size:27px}

  /* Order and generic data tables become touch-friendly cards */
  table.table.mobile-cards, body .container>table.table{display:block!important;min-width:0!important;border:0!important;background:transparent!important}
  table.table.mobile-cards thead, body .container>table.table thead{display:none!important}
  table.table.mobile-cards tbody, body .container>table.table tbody{display:grid!important;gap:12px!important;width:100%}
  table.table.mobile-cards tr, body .container>table.table tr{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:8px!important;width:100%!important;padding:14px!important;border:1px solid var(--border)!important;border-radius:15px!important;background:var(--surface)!important}
  table.table.mobile-cards td, body .container>table.table td{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;width:100%!important;min-width:0!important;padding:0!important;border:0!important;text-align:right!important;overflow-wrap:anywhere}
  table.table.mobile-cards td::before, body .container>table.table td::before{content:attr(data-label);flex:0 0 auto;color:var(--muted);font-size:12px;font-weight:700;text-align:left}
  table.table.mobile-cards td:empty::before, body .container>table.table td:empty::before{display:none}
  table.table.mobile-cards td:last-child, body .container>table.table td:last-child{padding-top:8px!important;border-top:1px solid var(--border)!important;justify-content:stretch!important}
  table.table.mobile-cards td:last-child::before, body .container>table.table td:last-child::before{display:none}
  table.table.mobile-cards td:last-child>* , body .container>table.table td:last-child>*{width:100%;max-width:100%;text-align:center}
  table.table.mobile-cards .btn-primary,table.table.mobile-cards .btn-secondary,body .container>table.table .btn-primary,body .container>table.table .btn-secondary{display:flex;align-items:center;justify-content:center;min-height:44px}

  .dashboard-stats,.cockpit-metrics,.analytics-metrics,.metric-grid,.stats-grid{grid-template-columns:minmax(0,1fr)!important}
  .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
  .product-card-body{padding:10px!important}
  .product-title{font-size:13px!important}
  .product-seller{font-size:11px!important}
  .product-price{font-size:15px!important}
  .cart-item{grid-template-columns:54px minmax(0,1fr)!important}
  .cart-item>*{min-width:0}
  .edit-image-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .upload-dropzone{min-height:220px!important;padding:18px 12px!important}
  .launch-steps,.upload-steps{grid-template-columns:1fr!important;gap:7px!important}
  .launch-steps>* ,.upload-steps>*{min-height:44px}
}

@media(max-width:390px){
  .product-grid{grid-template-columns:minmax(0,1fr)!important}
  .edit-image-grid{grid-template-columns:minmax(0,1fr)!important}
  .pd-actions{grid-template-columns:minmax(0,1fr) auto!important}
  .pd-actions>*{min-width:0}
  .mobile-menu{width:94vw!important}
}
