@charset "UTF-8";
/* Vanilla menu-helper styles (TECH-6179).
 *
 * Values are copied VERBATIM from the compiled React CSS (index-CvBjmC9U.css,
 * AddToWishList-5FVhy1K-.css, BrandFollow-4t5wUZth.css) so rendering is
 * byte-identical. They came from SCSS get-vw()/get-vw-m() helpers, which are a
 * build-time function - reproducing the numbers is correct, re-deriving them
 * would risk drifting. The hashed CSS-module class names (._button_1gxtv_1 etc)
 * are replaced with stable mph-* names.
 *
 * The React build also had an index.scss carrying a global reset and @font-face
 * set, but vite injected it ONLY in non-production mode, so production never
 * shipped it. Deliberately not reproduced here. */

/* was ._button_1gxtv_1 - header wishlist link */
.mph-wishlist-button {
  display: flex;
  height: 2.6041666667vw;
  width: 1.0416666667vw;
}

/* was ._toggle_1c0u2_1 - per-product heart */
.mph-wishlist-toggle {
  all: unset;
  cursor: pointer;
  top: 0.6913716814vw;
  right: 0.6913716814vw;
  width: 1.3366519174vw;
  height: 1.290560472vw;
  z-index: 3;
}

/* was ._following_181ea_2 - brand follow button */
.mph-brand-follow {
  all: unset;
  background: none;
  border: 0;
  cursor: pointer;
  display: block;
  font-family: "ヒラギノ角ゴ Pro W6";
  font-weight: 600;
  color: #000;
  width: max-content;
  padding: 1.1983775811vw 0;
  height: 1.8436578171vw;
  font-size: 0.8296460177vw;
}

.mph-brand-follow span {
  word-break: keep-all;
  right: 0;
  left: 0;
}

@media screen and (max-width: 768px) {
  .mph-wishlist-button {
    height: fit-content;
    width: auto;
  }

  .mph-wishlist-toggle {
    width: 5.6vw;
    height: 5.3333333333vw;
    top: 2.16vw;
    right: 4vw;
  }

  .mph-brand-follow {
    font-size: 3.4666666667vw;
    line-height: 3.4666666667vw;
    margin-bottom: 4.8vw;
    padding: 0;
    height: 10.6666666667vw;
  }
}