/*
 * ItemPrice V317 — home grid cache-mismatch guard.
 *
 * V312's grid used --landing-market-columns with a fallback of 1. If the new
 * CSS arrived before the matching app script (or an older app was cached), the
 * whole Today market page became one long column. This override supplies a
 * CSS-only 1~4 column fallback and lets the current script override it when it
 * is available.
 */

body[data-page="landing"] .v49-market-panel,
body.landing-v49 .v49-market-panel,
body.landing-v51 .v49-market-panel {
  container-type: inline-size;
  container-name: landing-market-v317;
}

body[data-page="landing"] #landingMarketGrid,
body.landing-v49 #landingMarketGrid,
body.landing-v51 #landingMarketGrid {
  --landing-market-fallback-columns: 1;
  grid-template-columns: repeat(
    var(--landing-market-columns, var(--landing-market-fallback-columns, 1)),
    minmax(0, 1fr)
  ) !important;
}

/* Exact card-width fallbacks: 390px cards + 14px gaps, capped at four columns. */
@container landing-market-v317 (min-width: 794px) {
  body[data-page="landing"] #landingMarketGrid,
  body.landing-v49 #landingMarketGrid,
  body.landing-v51 #landingMarketGrid {
    --landing-market-fallback-columns: 2;
  }
}

@container landing-market-v317 (min-width: 1198px) {
  body[data-page="landing"] #landingMarketGrid,
  body.landing-v49 #landingMarketGrid,
  body.landing-v51 #landingMarketGrid {
    --landing-market-fallback-columns: 3;
  }
}

@container landing-market-v317 (min-width: 1602px) {
  body[data-page="landing"] #landingMarketGrid,
  body.landing-v49 #landingMarketGrid,
  body.landing-v51 #landingMarketGrid {
    --landing-market-fallback-columns: 4;
  }
}

body[data-page="landing"] #landingMarketGrid > .item-card[hidden],
body.landing-v49 #landingMarketGrid > .item-card[hidden],
body.landing-v51 #landingMarketGrid > .item-card[hidden] {
  display: none !important;
}

@media (max-width: 820px) {
  body[data-page="landing"] #landingMarketGrid,
  body.landing-v49 #landingMarketGrid,
  body.landing-v51 #landingMarketGrid {
    --landing-market-columns: 1;
    --landing-market-fallback-columns: 1;
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Fallback for older engines without container queries. */
@supports not (container-type: inline-size) {
  @media (min-width: 821px) and (max-width: 1279px) {
    body[data-page="landing"] #landingMarketGrid,
    body.landing-v49 #landingMarketGrid,
    body.landing-v51 #landingMarketGrid {
      --landing-market-fallback-columns: 1;
    }
  }

  @media (min-width: 1280px) and (max-width: 1699px) {
    body[data-page="landing"] #landingMarketGrid,
    body.landing-v49 #landingMarketGrid,
    body.landing-v51 #landingMarketGrid {
      --landing-market-fallback-columns: 2;
    }
  }

  @media (min-width: 1700px) and (max-width: 2199px) {
    body[data-page="landing"] #landingMarketGrid,
    body.landing-v49 #landingMarketGrid,
    body.landing-v51 #landingMarketGrid {
      --landing-market-fallback-columns: 3;
    }
  }

  @media (min-width: 2200px) {
    body[data-page="landing"] #landingMarketGrid,
    body.landing-v49 #landingMarketGrid,
    body.landing-v51 #landingMarketGrid {
      --landing-market-fallback-columns: 4;
    }
  }
}


/* V323 — single-line responsive home slogan and drag-selection guard */
body[data-page="landing"] .v49-hero-copy{
  container-type:inline-size;
  container-name:home-hero-v323;
}
body[data-page="landing"] .v49-hero-copy h1{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  align-content:start!important;
  gap:clamp(10px,1vw,16px)!important;
  max-width:100%!important;
  overflow:visible!important;
  user-select:none!important;
  -webkit-user-select:none!important;
  -webkit-user-drag:none!important;
}
body[data-page="landing"] .v49-hero-copy h1::selection,
body[data-page="landing"] .v49-hero-copy h1 *::selection{
  background:transparent!important;
}
body[data-page="landing"] .home-hero-slogan-v323{
  display:block!important;
  min-width:0!important;
  max-width:100%!important;
  white-space:nowrap!important;
  overflow:visible!important;
  font-size:clamp(11px,3.34cqw,56px)!important;
  line-height:1.06!important;
  letter-spacing:-.045em!important;
  word-break:normal!important;
  overflow-wrap:normal!important;
  text-wrap:nowrap!important;
  user-select:none!important;
  -webkit-user-select:none!important;
  -webkit-user-drag:none!important;
}
body[data-page="landing"] .brand-query-signal-v223{
  justify-self:start;
  user-select:none!important;
  -webkit-user-select:none!important;
}
@supports not (font-size:1cqw){
  body[data-page="landing"] .home-hero-slogan-v323{font-size:clamp(11px,2.72vw,56px)!important}
}
@media(max-width:820px){
  body[data-page="landing"] .v49-hero-copy h1{max-width:100%!important}
  body[data-page="landing"] .home-hero-slogan-v323{font-size:clamp(10.5px,3.34cqw,34px)!important;letter-spacing:-.038em!important}
}
@media(max-width:360px){
  body[data-page="landing"] .home-hero-slogan-v323{font-size:10.5px!important}
}

/* V324 — give the brand line and responsive slogan a little breathing room. */
@media(max-width:820px){
  body[data-page="landing"] .v49-hero-copy h1{gap:8px!important}
}
