body.home {
  --market-violet: #5433eb;
  --market-muted: #625f60;
  --market-border: #ebebeb;
  --market-shadow: 0 4px 22px rgb(23 19 41 / 8%);
  background: #f2f4f5;
  color: #17161a;
}
.market-shell { width: min(1200px, calc(100% - 128px)); margin-inline: auto; }
.market-main { padding: 34px 0 72px; }
.market-main a:focus-visible, .market-head :is(a, button):focus-visible, .market-search button:focus-visible {
  outline: 3px solid var(--market-violet);
  outline-offset: 4px;
}
.market-head { position: relative; z-index: 5; }
.market-actions {
  position: fixed;
  inset: 50% auto auto max(12px, calc((100vw - 1380px) / 2));
  transform: translateY(-50%);
  display: grid;
  gap: 5px;
  width: 64px;
  padding: 5px;
  border: 1px solid white;
  border-radius: 26px;
  background: white;
  box-shadow: var(--market-shadow);
}
.market-actions :is(a, button:not([hidden])) {
  min-height: 52px;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 3px;
  border-radius: 19px;
  border: 0;
  padding: 0;
  background: transparent;
  cursor: pointer;
  color: #222126;
  font-size: 9px;
  font-weight: 650;
  line-height: 1.15;
  text-decoration: none;
}
.market-actions :is(a, button):hover, .market-actions a[aria-current] { background: #f2f4f5; }
.market-main svg, .market-actions svg { display: block; width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.market-share-dialog { position: fixed; width: min(430px, calc(100% - 32px)); border: 1px solid #e4e4e7; border-radius: 24px; padding: 24px; color: #17161a; background: white; box-shadow: 0 14px 52px rgb(23 19 41 / 19%); }
.market-share-dialog::backdrop { background: rgb(22 18 35 / 35%); }
.market-share-dialog h2 { margin: 0 34px 14px 0; font: 680 1.5rem/1.2 system-ui, sans-serif; letter-spacing: -.035em; }
.market-share-dialog label { display: block; margin-bottom: 6px; font-size: .88rem; }
.market-share-dialog input { width: 100%; padding: 9px 12px; border: 1px solid #dcdcde; border-radius: 12px; }
.market-share-options { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.market-share-options button { min-height: 42px; padding: 6px 14px; border: 1px solid #e4e4e7; border-radius: 999px; background: #f2f2f4; color: inherit; font-weight: 650; cursor: pointer; }
.market-share-options #market-share-copy { background: var(--market-violet); color: white; border-color: var(--market-violet); }
.market-share-close { position: absolute; top: 12px; right: 12px; width: 36px; height: 36px; border: 0; border-radius: 50%; background: #f2f2f4; font-size: 22px; line-height: 1; cursor: pointer; }
.market-share-status { min-height: 1.5em; margin: 10px 0 0; font-size: .88rem; }
.market-showcase {
  border-radius: 36px;
  background: #fff;
  padding: clamp(30px, 5vw, 68px) 24px clamp(30px, 4.5vw, 56px);
  text-align: center;
}
.market-constellation {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 231px;
  padding: 0 2%;
  margin: 0 auto 10px;
}
.market-float {
  position: relative;
  z-index: 1;
  width: clamp(106px, 13.5vw, 170px);
  flex: 0 1 170px;
  margin-inline: -2px;
  padding: 7px 7px 10px;
  border-radius: 26px;
  background: white;
  color: #17161a;
  box-shadow: 0 8px 28px rgb(17 15 31 / 13%), 0 2px 4px rgb(17 15 31 / 7%);
  text-align: left;
  text-decoration: none;
  transform: translateY(var(--lift, 0px));
  transition: transform .2s ease, box-shadow .2s ease;
}
.market-float:nth-child(1) { --lift: 13px; }
.market-float:nth-child(2) { --lift: -12px; z-index: 2; }
.market-float:nth-child(3) { --lift: -23px; z-index: 3; }
.market-float:nth-child(4) { --lift: -5px; z-index: 2; }
.market-float:nth-child(5) { --lift: 17px; }
.market-float:hover, .market-float:focus-visible { z-index: 4; transform: translateY(calc(var(--lift, 0px) - 7px)); }
.market-float img { display: block; width: 100%; height: auto; aspect-ratio: 1; border-radius: 20px; object-fit: cover; background: #eeefef; }
.market-float span { display: block; margin: 8px 4px 0; font-size: clamp(10px, 1.15vw, 14px); font-weight: 650; line-height: 1.25; }
.market-showcase .market-brand { margin: 0; color: #111015; font: 720 clamp(2.4rem, 11vw, 6.1rem)/1 system-ui, sans-serif; letter-spacing: -.092em; }
.market-brand .market-brand-label { display: block; margin: 0 0 6px; color: var(--market-violet); font-size: clamp(.95rem, 2.5vw, 1.6rem); font-weight: 660; letter-spacing: .13em; line-height: 1.2; }
.market-brand-domain { color: var(--market-violet); }
.market-subtitle { margin: 12px 0 23px; color: var(--market-muted); letter-spacing: -.02em; }
.market-search { display: flex; gap: 7px; width: min(100%, 554px); margin-inline: auto; padding: 5px; border: 1px solid #dfdfe4; border-radius: 999px; background: white; box-shadow: 0 5px 22px rgb(17 15 31 / 5%); }
.market-search:focus-within { border-color: var(--market-violet); }
.market-search input { flex: 1; min-width: 0; border: 0; border-radius: 999px; background: transparent; padding: 0 0 0 17px; color: inherit; font: inherit; }
.market-search input:focus { outline: none; }
.market-search button { flex: 0 0 48px; min-height: 48px; display: grid; place-items: center; border: 0; border-radius: 50%; background: var(--market-violet); color: #fff; box-shadow: 0 4px 17px rgb(84 51 235 / 36%); cursor: pointer; }
.market-search button:hover { background: #4322d2; }
.market-topics { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; max-width: 100%; margin: 18px auto 0; padding: 14px 6px 13px; }
.market-topics a { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 7px; min-height: 42px; padding: 5px 13px 5px 6px; color: #222126; border: 1px solid #e4e4e7; border-radius: 999px; background: #fff; box-shadow: 0 2px 8px rgb(0 0 0 / 5%); text-decoration: none; white-space: nowrap; font-size: 14px; font-weight: 600; transform: translateY(var(--chip-offset, 0px)); }
@media (min-width: 1120px) {
  .market-topics a:nth-child(3n + 1) { --chip-offset: -4px; }
  .market-topics a:nth-child(3n + 2) { --chip-offset: 5px; }
}
.market-topics a:is(:hover, :focus-visible) { border-color: #ceced3; }
@media (prefers-reduced-motion: no-preference) and (hover: hover) {
  .market-topics a { transition: transform .2s ease; }
  .market-topics a:hover { transform: translateY(calc(var(--chip-offset, 0px) - 3px)); }
}
.market-topics img { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; }
.market-topics .market-holiday-link { padding-inline: 11px 14px; background: #f3f0ff; color: #3e24b6; }
.market-holiday-link svg, .market-section-head svg { width: 17px; height: 17px; }
.market-main > section + section { margin-top: clamp(42px, 6vw, 72px); scroll-margin-top: 60px; }
.market-section-head { display: flex; align-items: end; justify-content: space-between; flex-wrap: wrap; gap: 12px 24px; margin-bottom: 20px; }
.market-section-head h2 { margin: 3px 0 0; font: 680 clamp(1.85rem, 4vw, 2.8rem)/1.12 system-ui, sans-serif; letter-spacing: -.06em; }
.market-section-head span { display: inline-flex; align-items: center; gap: 6px; color: #4727c7; font-size: 13px; font-weight: 700; }
.market-section-head p { margin: 0; color: var(--market-muted); }
.market-store-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.market-store-grid .supplier-card, .market-holiday-grid a { border: 1px solid var(--market-border); border-radius: 28px; padding: 8px; background: white; color: inherit; box-shadow: var(--market-shadow); }
.market-store-grid .supplier-card:hover, .market-holiday-grid a:hover { border-color: #ceced3; }
.market-store-grid .supplier-card-art { aspect-ratio: 1.25; border-radius: 20px; background: #eaeaea; }
.market-store-grid .supplier-card-copy { align-items: flex-start; padding: 12px 7px 10px; gap: 5px; }
.market-store-grid .supplier-card-tag { color: var(--market-muted); font-size: 10px; letter-spacing: .03em; }
.market-store-grid h3 { margin: 3px 0; font: 680 20px/1.16 system-ui, sans-serif; letter-spacing: -.04em; }
.market-store-grid .supplier-card p { margin: 5px 0 0; font-size: 13px; line-height: 1.4; }
.market-store-grid .supplier-card-arrow { width: 28px; height: 28px; background: #f2f4f5; color: inherit; }
.market-holiday-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.market-holiday-grid a { display: block; text-decoration: none; }
.market-holiday-grid img { display: block; width: 100%; height: auto; aspect-ratio: 2.2; object-fit: cover; border-radius: 20px; }
.market-holiday-grid span { display: flex; justify-content: space-between; gap: 10px; padding: 12px 8px 6px; font-weight: 650; }
@media (min-width: 900px) and (max-width: 1340px) { .market-shell { margin-left: 90px; margin-right: 24px; width: auto; } }
@media (max-width: 899px) {
  .market-shell { width: min(100% - 28px, 750px); }
  .market-main { padding-top: 14px; }
  .market-actions { position: static; width: fit-content; margin: 14px auto 0; transform: none; display: flex; gap: 4px; }
  .market-actions :is(a, button:not([hidden])) { min-width: clamp(48px, 15vw, 58px); min-height: 45px; }
  .market-store-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .market-showcase { padding: 25px 14px 26px; border-radius: 28px; }
  .market-constellation { min-height: 116px; padding: 0; margin-bottom: 13px; }
  .market-float { width: 23%; flex-basis: 23%; margin-inline: -3px; padding: 4px 4px 6px; border-radius: 14px; }
  .market-float img { border-radius: 11px; }
  .market-float span { margin: 4px 1px 0; font-size: 9px; overflow-wrap: anywhere; }
  .market-float:nth-child(2n) { --lift: -5px; }
  .market-float:nth-child(2n+1) { --lift: 3px; }
  .market-topics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 12px; padding-inline: 0; }
  .market-topics a { min-height: 44px; padding: 5px 7px; text-align: left; white-space: normal; overflow-wrap: anywhere; font-size: 12px; line-height: 1.2; }
  .market-topics :is(img, svg) { flex-shrink: 0; }
  .market-store-grid .supplier-card-art, .market-holiday-grid img { border-radius: 16px; }
  .market-store-grid .supplier-card, .market-holiday-grid a { border-radius: 23px; }
  .market-store-grid .supplier-card-arrow { display: none; }
  .market-holiday-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .market-float { transition: none; }
  .market-float:is(:hover, :focus-visible) { transform: translateY(var(--lift, 0px)); }
}