.zm-hamburger {
  display:  none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 38px;
  height: 38px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 6px;
  border-radius: var(--r-md, 8px);
  margin-left: auto;
  flex-shrink: 0;
  transition: background 0.15s;
}
.zm-hamburger:hover { background: var(--zm-surface, #f0eded); }
.zm-hamburger__bar {
  display: block;
  width: 100%;
  height: 2px;
  background: var(--zm-text, #1c1b1b);
  border-radius: 2px;
  transition: transform 0.22s ease, opacity 0.15s ease;
  transform-origin: center;
}
.zm-hamburger.is-open .zm-hamburger__bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.zm-hamburger.is-open .zm-hamburger__bar:nth-child(2) { opacity: 0; transform: scaleX(0); }
.zm-hamburger.is-open .zm-hamburger__bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.zm-mobile-nav {
  display: none;
  position: fixed;
  top: var(--nav-h, 58px);
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--zm-white, #fff);
  z-index: 450;
  overflow-y: auto;
  padding: 12px 0 100px;
  border-top: 1px solid var(--zm-border, #eae7e7);
  box-shadow: 0 8px 40px rgba(0,0,0,0.15);
  transform: translateY(-8px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.zm-mobile-nav.is-open {
  display: block;
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.zm-mobile-nav__link {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 20px;
  font-size: 15px;
  font-weight: 600;
  color: var(--zm-text, #1c1b1b);
  text-decoration: none;
  border-bottom: 1px solid var(--zm-surface, #f0eded);
  transition: background 0.12s;
  font-family: var(--font-display, 'Work Sans', sans-serif);
}
.zm-mobile-nav__link:hover { background: var(--zm-surface, #f0eded); }
.zm-mobile-nav__link.active { color: var(--zm-primary, #00512b); background: rgba(0,81,43,0.05); }
.zm-mobile-nav__link .mi    { font-size: 20px; color: var(--zm-text-muted, #6f7a70); }
.zm-mobile-nav__link.active .mi { color: var(--zm-primary, #00512b); }
.zm-mobile-nav__section {
  padding: 10px 20px 4px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--zm-text-muted, #6f7a70);
  background: var(--zm-surface, #f6f3f2);
  border-bottom: 1px solid var(--zm-border, #eae7e7);
}
.zm-mobile-nav__cta {
  margin: 14px 20px 0;
  display: block;
  background: var(--zm-primary, #00512b);
  color: #fff !important;
  text-align: center;
  border-radius: 10px;
  padding: 14px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  border-bottom: none !important;
}
.zm-mobile-nav__overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.35);
  z-index: 440;
}
.zm-mobile-nav__overlay.is-open { display: block; }

.admin-mobile-toggle {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  padding: 6px;
  border-radius: var(--r-md, 8px);
  color: var(--on-surface-muted, #6f7a70);
  flex-direction: column;
  gap: 5px;
  width: 36px;
  height: 36px;
  justify-content: center;
  align-items: center;
  margin-right: 8px;
}
.admin-mobile-toggle span {
  display: block;
  width: 20px;
  height: 2px;
  background: currentColor;
  border-radius: 2px;
  transition: all 0.2s;
}
.sidebar-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.45);
  z-index: 299;
}
.sidebar-overlay.open { display: block; }

@media (max-width: 768px) {
  
  .zm-nav__links,
  .zm-nav__search { display: none !important; }
  .zm-hamburger   { display: flex !important; }

.zm-nav__inner  { padding: 0 14px !important; }

.zm-nav__mobile-search-bar {
    display: block !important;
    padding: 8px 14px 10px;
    border-bottom: 1px solid var(--zm-border, #eae7e7);
    background: var(--zm-white, #fff);
  }

.zm-nav { position: sticky; top: 0; z-index: 500; }
}

.zm-nav__mobile-search-bar {
  display: none;
  background: var(--zm-white, #fff);
}
.zm-nav__mobile-search-bar form {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--zm-surface-mid, #f0eded);
  border-radius: 20px;
  padding: 8px 14px;
  border: 1px solid var(--zm-border, #eae7e7);
}
.zm-nav__mobile-search-bar input {
  border: none;
  background: transparent;
  outline: none;
  font-size: 14px;
  width: 100%;
}

@media (max-width: 900px) {
  
  .home-body { grid-template-columns: 1fr !important; padding: 16px 14px 40px !important; }
  .sellers-col { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
  .sellers-col .sellers-title { grid-column: 1/-1; }

.hero__title { font-size: 18px !important; }
  .hero { min-height: 200px !important; }
  .hero__tagline-bar span { font-size: 13px !important; }

.why-grid { grid-template-columns: 1fr !important; }
  .why-item { display: flex; gap: 14px; align-items: flex-start; text-align: left !important; }
  .why-icon { margin: 0 !important; flex-shrink: 0; }
}

@media (max-width: 600px) {
  .sellers-col { grid-template-columns: 1fr; }
  .seller-card-sm { text-align: left; display: flex; gap: 12px; align-items: flex-start; padding: 12px; }
  .seller-avatar-lg { margin: 0 !important; flex-shrink: 0; }
  .listings-grid { grid-template-columns: repeat(2,1fr) !important; gap: 10px !important; }
  .why-card { padding: 14px !important; }
}

@media (max-width: 400px) {
  .listings-grid { grid-template-columns: 1fr !important; }
  .category-grid { grid-template-columns: repeat(2,1fr) !important; }
}

@media (max-width: 768px) {
  .has-mobile-nav { padding-bottom: 68px; }
}

@media (max-width: 768px) {
  
  .filter-sidebar       { display: none !important; }
  .listings-layout      { grid-template-columns: 1fr !important; }
  .listings-toolbar     { flex-wrap: wrap; gap: 8px; }
  .listings-grid        { grid-template-columns: repeat(2,1fr) !important; gap: 10px !important; }
  .zm-mobile-filter-btn { display: flex !important; }
  .view-toggle          { display: none; }
}

.zm-mobile-filter-btn {
  display: none;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  background: var(--zm-white, #fff);
  border: 1.5px solid var(--zm-border, #eae7e7);
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  color: var(--zm-text, #1c1b1b);
}

.zm-filter-drawer {
  position: fixed;
  top: 0; bottom: 0; left: 0;
  width: min(320px, 90vw);
  background: var(--zm-white, #fff);
  z-index: 550;
  overflow-y: auto;
  transform: translateX(-100%);
  transition: transform 0.25s ease;
  box-shadow: 4px 0 24px rgba(0,0,0,0.12);
  padding: 0 0 80px;
}
.zm-filter-drawer.is-open { transform: translateX(0); }
.zm-filter-drawer__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 18px;
  border-bottom: 1px solid var(--zm-border, #eae7e7);
  position: sticky;
  top: 0;
  background: var(--zm-white, #fff);
  z-index: 1;
}
.zm-filter-drawer__title { font-size: 16px; font-weight: 700; }
.zm-filter-drawer__close {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--zm-text-muted, #6f7a70);
  display: flex;
  align-items: center;
  padding: 4px;
}
.zm-filter-drawer__body { padding: 16px 18px; }

@media (max-width: 768px) {
  .product-layout      { grid-template-columns: 1fr !important; gap: 16px !important; }
  .product-bottom      { grid-template-columns: 1fr !important; }
  .gallery__thumbnails { gap: 6px !important; }
  .gallery__thumb      { width: 60px !important; height: 60px !important; }
  .delivery-options    { grid-template-columns: repeat(3,1fr) !important; }
  .trust-grid          { grid-template-columns: 1fr 1fr !important; }
  .product-info__title { font-size: 17px !important; }
  .bid-box__price      { font-size: 22px !important; }

.mobile-buy-bar { display: flex !important; }
}

@media (max-width: 768px) {
  
  .dash-sidebar { display: none !important; }

.mobile-bottom-nav { display: flex !important; }

.dash-main { padding-bottom: 68px; }

.bento-grid   { grid-template-columns: 1fr !important; }
  .bento-bottom { grid-template-columns: 1fr !important; }

.wallet-card  { padding: 16px !important; }
  .wallet-card__amount { font-size: 22px !important; }

.dash-welcome { padding: 16px 14px 0 !important; }
  .dash-welcome__greeting { font-size: 22px !important; }
  .dash-welcome__row { flex-direction: column; align-items: flex-start; }
  .dash-premier-badge { font-size: 9px !important; padding: 5px 10px !important; }

.dash-topbar { padding: 0 14px !important; }
  .dash-search { max-width: 200px !important; }

.dash-body   { padding: 14px !important; }

.orders-card { overflow-x: auto; }
  table        { min-width: 500px; }
}

.mobile-bottom-nav {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  background: rgba(255,255,255,0.97);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-top: 1px solid var(--zm-border, #eae7e7);
  padding: 6px 0 10px;
  display: none;
  justify-content: space-around;
  align-items: center;
  z-index: 300;
  box-shadow: 0 -4px 20px rgba(0,0,0,0.06);
}
.mobile-nav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  color: var(--zm-text-muted, #6f7a70);
  text-decoration: none;
  font-size: 10px;
  font-weight: 500;
  padding: 4px 10px;
  border-radius: 10px;
  transition: all 0.12s;
  min-width: 52px;
  text-align: center;
}
.mobile-nav-item.active {
  color: var(--zm-primary, #00512b);
  background: rgba(0,81,43,0.07);
}
.mobile-nav-item.sell-btn .mi {
  font-size: 30px !important;
  color: var(--zm-primary, #00512b);
}
.mobile-nav-item.sell-btn {
  color: var(--zm-primary, #00512b);
  font-weight: 700;
}

@media (max-width: 768px) {
  
  .sidebar {
    position: fixed !important;
    top: 0; left: 0; bottom: 0;
    z-index: 300;
    transform: translateX(-100%);
    transition: transform 0.25s ease;
    box-shadow: 4px 0 24px rgba(0,0,0,0.15);
  }
  .sidebar.mobile-open {
    transform: translateX(0);
    display: flex !important;
  }

.admin-mobile-toggle { display: flex !important; }

.main-content { width: 100% !important; }

.stats-grid   { grid-template-columns: repeat(2,1fr) !important; }
  .stat-card__value { font-size: 20px !important; }

.page-body    { padding: 12px !important; }
  .topbar       { padding: 0 12px !important; }

.grid-2 { grid-template-columns: 1fr !important; }

.admin-table-wrap { overflow-x: auto; }
  .data-table       { min-width: 600px; }

.admin-table-tools .hide-mobile { display: none; }

.page-title   { font-size: 15px !important; }
}

@media (max-width: 480px) {
  .stats-grid   { grid-template-columns: 1fr !important; }
}

@media (max-width: 540px) {
  .auth-wrap    { padding: 12px !important; }
  .auth-header  { padding: 22px 20px !important; }
  .auth-body    { padding: 20px !important; }
  .form-row     { grid-template-columns: 1fr !important; }
  .auth-header img { height: 40px !important; }

.sell-container  { padding: 0 12px 80px !important; }
  .img-upload-grid { grid-template-columns: repeat(2,1fr) !important; }
  .price-row       { grid-template-columns: 1fr !important; }
  .sticky-footer   { padding: 10px 14px !important; }
  .sticky-footer .btn { padding: 10px 14px !important; font-size: 13px !important; }
}

@media (max-width: 768px) {
  
  .container, .zm-page, .zm-page-lg { padding-left: 14px !important; padding-right: 14px !important; }
  .zm-page-lg { max-width: 100% !important; }

.display-lg { font-size: clamp(22px,5vw,32px) !important; }
  .headline-md { font-size: 17px !important; }

.card-body { padding: 14px !important; }

.modal-backdrop { padding: 0; align-items: flex-end; }
  .modal {
    max-width: 100% !important;
    border-radius: 16px 16px 0 0 !important;
    max-height: 92vh;
    overflow-y: auto;
  }

.zm-footer__grid { grid-template-columns: 1fr 1fr !important; gap: 20px !important; }

.pagination { flex-wrap: wrap; gap: 4px; }

.btn-text-hide-mobile .btn-text { display: none; }
}

@media (max-width: 480px) {
  .zm-footer__grid { grid-template-columns: 1fr !important; }
}

@media (max-width: 768px) {
  .steps { overflow-x: auto; flex-wrap: nowrap !important; }
  .step  { min-width: 80px; flex-shrink: 0; }
  .form-grid { grid-template-columns: 1fr !important; }
}

.mobile-buy-bar {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 200;
  background: #fff;
  border-top: 1px solid #e5e7eb;
  box-shadow: 0 -4px 16px rgba(0,0,0,0.10);
  padding: 10px 16px 14px;
  align-items: center;
  gap: 12px;
}

@media (min-width: 641px) and (max-width: 1024px) {
  .zm-nav__search  { max-width: 280px !important; }
  .stats-grid      { grid-template-columns: repeat(2,1fr) !important; }
  .bento-grid      { grid-template-columns: 220px 1fr !important; }
  .bento-bottom    { grid-template-columns: 1fr 200px !important; }
  .home-body       { gap: 14px !important; }
  .category-grid   { grid-template-columns: repeat(3,1fr) !important; }
}

@media (min-width: 641px) and (max-width: 1024px) {
  .product-grid   { grid-template-columns: 1fr 300px !important; }
  .auction-grid   { grid-template-columns: repeat(3,1fr) !important; }
  .points-grid    { grid-template-columns: repeat(2,1fr) !important; }
  .stat-row       { gap: 10px !important; }
  .related-grid   { grid-template-columns: repeat(3,1fr) !important; }
}

@media (max-width: 768px) {
  .product-shell  { padding: 14px 14px 60px !important; }
  .product-grid   { grid-template-columns: 1fr !important; gap: 16px !important; }

  .gallery__main  { aspect-ratio: 1 / 1 !important; }
  .gallery__thumbs { gap: 6px !important; padding: 8px !important; }
  .gallery__thumb { width: 54px !important; height: 54px !important; }

  .product-title  { font-size: 18px !important; }
  .product-price  { font-size: 22px !important; }
  .product-meta-row { gap: 10px !important; }

  .specs-table    { font-size: 12px !important; }
  .specs-table td { padding: 6px 10px !important; }

  .related-grid   { grid-template-columns: repeat(2,1fr) !important; gap: 10px !important; }

  .breadcrumb     { font-size: 11.5px !important; gap: 4px !important; }

  .auction-grid   { grid-template-columns: repeat(2,1fr) !important; gap: 12px !important; }

  .page-hero      { padding: 24px 16px !important; }
  .page-hero h1   { font-size: 22px !important; }
  .page-body      { padding: 16px 14px 60px !important; }

  .stat-row       { gap: 8px !important; flex-wrap: wrap !important; }
  .stat-pill      { padding: 8px 12px !important; font-size: 12px !important; }
  .stat-pill strong { font-size: 15px !important; }

  .points-grid    { grid-template-columns: 1fr !important; gap: 10px !important; }

  .toolbar        { flex-direction: column; align-items: flex-start !important; gap: 10px !important; }
  .toolbar > div  { width: 100%; }
  .toolbar form   { width: 100%; flex-wrap: wrap; }

  .prose h2       { font-size: 15px !important; }
  .prose p, .prose li { font-size: 13px !important; }

  .auth-wrap      { padding: 10px !important; }
  .auth-card      { border-radius: 12px !important; }

  .zm-footer__grid { grid-template-columns: 1fr 1fr !important; gap: 16px !important; }
}

@media (max-width: 480px) {
  .gallery__main  { aspect-ratio: 4 / 3 !important; }

  .auction-grid   { grid-template-columns: 1fr !important; }
  .related-grid   { grid-template-columns: 1fr 1fr !important; }

  .btn-buy, .btn-secondary { font-size: 13px !important; padding: 12px !important; }

  .points-grid    { grid-template-columns: 1fr !important; }

  .zm-footer__grid { grid-template-columns: 1fr !important; }
}

@media (max-width: 360px) {
  .product-shell  { padding: 10px 10px 60px !important; }
  .product-title  { font-size: 16px !important; }
  .product-price  { font-size: 20px !important; }
  .category-grid  { grid-template-columns: repeat(2,1fr) !important; }
  .related-grid   { grid-template-columns: 1fr !important; }
  .listings-grid  { grid-template-columns: 1fr !important; }
  .auction-grid   { grid-template-columns: 1fr !important; }
}

@media print {
  .zm-nav, .mobile-bottom-nav, .dash-sidebar,
  .sidebar, .zm-hamburger, .btn-primary,
  .zm-footer { display: none !important; }
  body { font-size: 12px; }
  .card { box-shadow: none; border: 1px solid #ccc; }
}