html body .toys-variants{display:grid;gap:8px;margin:10px 0;min-width:0}
html body .toys-variant-row{min-width:0}
html body .toys-variant-label{font-size:13px;margin:0 0 5px;color:var(--text-muted)}
html body .toys-variant-label strong{color:var(--text)}
html body .toys-variant-choices{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
html body .toys-variant-choice{position:relative;display:inline-flex;min-height:32px;min-width:32px;align-items:center;justify-content:center;box-sizing:border-box;padding:3px 9px;border:1px solid var(--border,#b8c5d0);border-radius:8px;color:var(--text);background:var(--surface-muted);font-size:12px;line-height:1.2;text-decoration:none}
html body .toys-variant-choice.is-color{width:30px;height:30px;min-width:30px;min-height:30px;border-radius:50%;padding:0;background:var(--variant-color)}
html body .toys-variant-choice[aria-current],html body .toys-variant-choice:hover{border-color:#63cdfd;box-shadow:0 0 0 1px #63cdfd}
html body .toys-variant-choice:focus-visible{outline:2px solid #63cdfd;outline-offset:2px}
html body .toys-variant-choice.is-unavailable{opacity:.57;text-decoration:line-through}
html body .toys-variant-choice.is-unavailable.is-color::after{content:"";position:absolute;width:82%;height:2px;border-radius:2px;background:#fff;box-shadow:0 0 0 1px #364454;transform:rotate(-45deg)}
html body .toys-variants.is-compact{gap:4px;margin:3px 0 7px;padding-inline:6px}
html body .toys-variants.is-compact .toys-variant-choices{gap:5px;flex-wrap:nowrap;overflow-x:auto;padding:2px}
html body .toys-variants.is-compact .toys-variant-choice{min-height:24px;min-width:24px;font-size:11px;white-space:nowrap}
html body .toys-variants.is-compact .toys-variant-choice.is-color{width:24px;height:24px;flex:0 0 24px}


/* Reserve the same option space in cards within each grid or carousel. */
html body #container :is(.toys-category-card-grid,.cr-products,.crc-track,:is(.product-grid,.box-product,.toys-card-grid,.swiper-wrapper):has(> .product-grid-item .toys-variants.is-compact)) {
  --variant-space: 0px;
  align-items: stretch;
}
html body #container :is(.toys-category-card-grid,.cr-products,.crc-track,:is(.product-grid,.box-product,.toys-card-grid,.swiper-wrapper):has(> .product-grid-item .toys-variants.is-compact)):has(> .product-grid-item .toys-variants) { --variant-space: 32px; }
html body #container :is(.toys-category-card-grid,.cr-products,.crc-track,:is(.product-grid,.box-product,.toys-card-grid,.swiper-wrapper):has(> .product-grid-item .toys-variants.is-compact)):has(> .product-grid-item .toys-variant-row:nth-child(2)) { --variant-space: 64px; }
html body #container :is(.toys-category-card-grid,.cr-products,.crc-track,:is(.product-grid,.box-product,.toys-card-grid,.swiper-wrapper):has(> .product-grid-item .toys-variants.is-compact)):has(> .product-grid-item .toys-variant-row:nth-child(3)) { --variant-space: 96px; }
html body #container :is(.toys-category-card-grid,.cr-products,.crc-track,:is(.product-grid,.box-product,.toys-card-grid,.swiper-wrapper):has(> .product-grid-item .toys-variants.is-compact)):has(> .product-grid-item .toys-variant-row:nth-child(4)) { --variant-space: 128px; }
html body #container :is(.toys-category-card-grid,.cr-products,.crc-track,:is(.product-grid,.box-product,.toys-card-grid,.swiper-wrapper):has(> .product-grid-item .toys-variants.is-compact)):has(> .product-grid-item .toys-variant-row:nth-child(5)) { --variant-space: 160px; }
html body #container :is(.toys-category-card-grid,.cr-products,.crc-track,:is(.product-grid,.box-product,.toys-card-grid,.swiper-wrapper):has(> .product-grid-item .toys-variants.is-compact)) .product-grid-item:has(.product-wrapper .name a) .caption {
  display: grid !important;
  grid-template-areas: "brand" "name" "rating" "variants";
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: 16px 36px 22px var(--variant-space);
  max-height: none !important;
  align-items: center !important;
  row-gap: 2px;
  width: 100% !important;
}
html body #container :is(.toys-category-card-grid,.cr-products,.crc-track,:is(.product-grid,.box-product,.toys-card-grid,.swiper-wrapper):has(> .product-grid-item .toys-variants.is-compact)) .caption > .manufacturer { grid-area: brand; }
html body #container :is(.toys-category-card-grid,.cr-products,.crc-track,:is(.product-grid,.box-product,.toys-card-grid,.swiper-wrapper):has(> .product-grid-item .toys-variants.is-compact)) .caption > .name { grid-area: name; }
html body #container :is(.toys-category-card-grid,.cr-products,.crc-track,:is(.product-grid,.box-product,.toys-card-grid,.swiper-wrapper):has(> .product-grid-item .toys-variants.is-compact)) .product-grid-item:has(.product-wrapper .name a) .caption > .rating {
  grid-area: rating;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 4px;
  width: 100% !important;
  height: 22px !important;
  margin: 0 !important;
  padding: 0 !important;
}
html body #container :is(.toys-category-card-grid,.cr-products,.crc-track,:is(.product-grid,.box-product,.toys-card-grid,.swiper-wrapper):has(> .product-grid-item .toys-variants.is-compact)) .caption > .rating > :is(.rate_amount, .rating-amount, .site-rating-stars) {
  position: relative !important;
  inset: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  align-self: center !important;
  height: 18px !important;
  line-height: 18px !important;
}
html body #container :is(.toys-category-card-grid,.cr-products,.crc-track,:is(.product-grid,.box-product,.toys-card-grid,.swiper-wrapper):has(> .product-grid-item .toys-variants.is-compact)) .caption > .toys-variants {
  grid-area: variants;
  align-self: start;
  gap: 4px;
  margin: 0 !important;
  padding: 0 !important;
}
html body #container :is(.toys-category-card-grid,.cr-products,.crc-track,:is(.product-grid,.box-product,.toys-card-grid,.swiper-wrapper):has(> .product-grid-item .toys-variants.is-compact)) .toys-variant-choices { scrollbar-width: none; }
html body #container :is(.toys-category-card-grid,.cr-products,.crc-track,:is(.product-grid,.box-product,.toys-card-grid,.swiper-wrapper):has(> .product-grid-item .toys-variants.is-compact)) .toys-variant-choices::-webkit-scrollbar { display: none; }
html body #container #content > .toys-category-card-grid > .product-grid-item > .product-thumb.product-wrapper {
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
}
html body #container .toys-card-grid.toys-card-grid:not(.toys-category-card-grid,.cr-products,.crc-track):has(> .product-grid-item .toys-variants.is-compact) > .product-grid-item.product-grid-item,
html body #container .toys-card-grid.toys-card-grid:not(.toys-category-card-grid,.cr-products,.crc-track):has(> .product-grid-item .toys-variants.is-compact) > .product-grid-item.product-grid-item:hover {
  height: auto !important;
  min-height: calc(var(--toys-card-height, 0px) + var(--variant-space) - 10px) !important;
}
html body #container .product-grid:has(> .product-grid-item .toys-custom-variant-space > .toys-variants) .toys-custom-variant-space {
  box-sizing: border-box;
  min-height: var(--variant-space);
}
html body #container .toys-custom-variant-space > .toys-variants {
  margin: 0;
  padding: 0;
}
html body #container :is(.product-grid,.box-product,.toys-card-grid,.swiper-wrapper):not(.toys-category-card-grid):has(> .product-grid-item .toys-variants.is-compact) > .product-grid-item:has(.product-wrapper .name a) .product-details {
  padding-bottom: 44px !important;
}
html[data-site-theme="dark"] body #container.toys-product-page #product.toys-product-purchase > .toys-variants {
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-muted) !important;
  color: var(--text) !important;
}
html[data-site-theme="dark"] body #container.toys-product-page #product .toys-variants :is(.toys-variant-row,.toys-variant-label,.toys-variant-choices) {
  background: transparent !important;
}
html[data-site-theme="dark"] body #container.toys-product-page #product .toys-variant-label { color: var(--text-muted) !important; }
html[data-site-theme="dark"] body #container.toys-product-page #product .toys-variant-label strong { color: var(--text) !important; }
html[data-site-theme="dark"] body #container.toys-product-page #product .toys-variant-choice:not(.is-color) {
  background: var(--surface) !important;
  color: var(--text) !important;
}

html body .toys-variants.is-compact .toys-variant-choices { position: relative; }
html body .toys-variants.is-compact .toys-variant-choices.has-variant-overflow { overflow: hidden; }
html body .toys-variants.is-compact .toys-variant-choice { flex-shrink: 0; }
html body .toys-variants.is-compact .toys-variant-more { width: 24px; padding: 0; }
html body .toys-variants.is-compact .toys-variant-clipped {
  position: absolute;
  width: max-content;
  visibility: hidden;
  pointer-events: none;
}
html body .toys-variants.is-compact .toys-variant-clipped:is(.is-color,.toys-variant-more) { width: 24px; }

/* AJAX cards reserve the same single option row before and after loading. */
html body #container :is(.cr-module .cr-products,.crc-module .crc-track) {
  --variant-space: 32px !important;
  --ajax-card-details-height: 176px;
}
html body #container .cr-module .cr-products {
  container-type: inline-size;
  --ajax-column-gap: .6%;
  column-gap: var(--ajax-column-gap) !important;
}
html body #container :is(.cr-module .cr-products.cr-products,.crc-module .crc-track.crc-track) > .product-grid-item.product-grid-item.product-grid-item,
html body #container :is(.cr-module .cr-products.cr-products,.crc-module .crc-track.crc-track) > .product-grid-item.product-grid-item.product-grid-item:hover {
  position: relative !important;
  height: auto !important;
  min-height: 0 !important;
}
html body #container :is(.cr-module .cr-products.cr-products,.crc-module .crc-track.crc-track) > .product-grid-item::before {
  content: "";
  display: block;
  flex: none;
  width: 100%;
  aspect-ratio: 1;
  margin-bottom: var(--ajax-card-details-height);
  pointer-events: none;
}
html body #container :is(.cr-module .cr-products.cr-products,.crc-module .crc-track.crc-track) > .product-grid-item > .product-wrapper,
html body #container :is(.cr-module .cr-products.cr-products,.crc-module .crc-track.crc-track) > .product-grid-item:hover > .product-wrapper {
  position: absolute !important;
  inset: 0 !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 0 !important;
  transform: none !important;
}
html body #container .crc-module .crc-track > .crc-all-card > .crc-all-card-inner {
  position: absolute;
  inset: 0;
}
html body #container .cr-module .cr-products > .cr-slot {
  height: auto;
  position: relative;
  align-self: stretch;
  min-height: calc((100cqw - (var(--cr-columns) - 1) * .6cqw) / var(--cr-columns) + var(--ajax-card-details-height));
  contain: size;
}
html body #container .cr-module .cr-products > .cr-slot > .cr-slot-content {
  position: absolute;
  inset: 0;
  height: 100%;
}
html body #container .crc-module .crc-track > .product-grid-item > .product-wrapper > .image {
  height: auto !important;
  aspect-ratio: 1;
}
html body #container :is(.cr-module .cr-products,.crc-module .crc-track) .toys-variants.is-compact > .toys-variant-row:not(:first-child) {
  display: none;
}

html body #container .crc-module :is(.crc-window,.crc-track.product-grid) { height: auto !important; }

/* Draw the stars without the font glyph's leading space. */
html body #container .product-wrapper .caption > .rating {
  justify-content: flex-start !important;
  padding-inline-start: 0 !important;
  text-align: start;
}
html body #container .product-wrapper .rating .site-rating-stars {
  width: 76px;
  margin-inline-start: 0 !important;
  padding-inline-start: 0 !important;
}
html body #container .product-wrapper .rating :is(.site-rating-stars-base,.site-rating-stars-fill) {
  display: block;
  height: 18px;
  font-size: 0;
  background-color: currentColor;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15.2 18'%3E%3Cpath d='m7 2 2.2 4.5 4.8.7-3.5 3.5.8 4.8L7 13.2l-4.3 2.3.8-4.8L0 7.2l4.8-.7Z'/%3E%3C/svg%3E") 0 center / 15.2px 18px repeat-x;
}

/* Hover changes the highlight, never the card geometry. */
html body #container :is(.product-grid,.box-product,.swiper-wrapper,.toys-recent-grid):not(.cr-products,.crc-track)
  > .product-grid-item:has(> .product-wrapper .name a) > .product-wrapper,
html body #container :is(.product-grid,.box-product,.swiper-wrapper,.toys-recent-grid):not(.cr-products,.crc-track)
  > .product-grid-item:has(> .product-wrapper .name a):hover > .product-wrapper {
  position: relative !important;
  inset: 0 !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 0 !important;
  transform: none !important;
}

/* Journal carousels with multiple option rows need clearance above the cart. */
html body #container .swiper-wrapper:has(> .product-grid-item .toys-variants.is-compact > .toys-variant-row:nth-child(2))
  > .product-grid-item .caption {
  min-height: calc(80px + var(--variant-space)) !important;
}
html body #container .swiper-wrapper:has(> .product-grid-item .toys-variants.is-compact > .toys-variant-row:nth-child(2))
  > .product-grid-item:has(.product-wrapper .name a) .product-details {
  padding-bottom: 52px !important;
}
