html body.has-pack[class] .conversion-rail,
html body.has-pack .conversion-rail,
.conversion-rail {
  margin: 0.9rem 0 0;
  padding: 0.85rem 1rem;
  border: 1px solid color-mix(in srgb, var(--accent, #888) 38%, var(--text, #111) 18%);
  border-radius: 0.85rem;
  background: var(--surface, var(--bg, #111114));
  color: var(--text, #f4f4f4);
}
html body.has-pack[class] .conversion-rail p,
html body.has-pack[class] .conversion-rail .conversion-offer,
html body.has-pack[class] .conversion-rail .conversion-ttl,
html body.has-pack .conversion-rail p,
html body.has-pack .conversion-rail .conversion-offer,
html body.has-pack .conversion-rail .conversion-ttl,
.conversion-rail p,
.conversion-rail .conversion-offer,
.conversion-rail .conversion-ttl {
  margin: 0.28rem 0;
  color: inherit;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.45;
}
.conversion-rail .conversion-ask {
  margin-top: 0.55rem;
}
html body.has-pack[class] .conversion-rail .btn:not(.btn-ghost),
html body.has-pack .conversion-rail .btn:not(.btn-ghost),
.conversion-rail .btn:not(.btn-ghost) {
  margin-top: 0.45rem;
  background: var(--text, #f4f4f4);
  color: var(--surface, #111114);
  border: 2px solid var(--accent, currentColor);
  font-weight: 750;
}
html body.has-pack[class] .conversion-rail .btn-ghost,
html body.has-pack .conversion-rail .btn-ghost,
.conversion-rail .btn-ghost {
  margin-top: 0.45rem;
  background: transparent;
  color: var(--text, #f4f4f4);
  border: 2px solid var(--text, #f4f4f4);
  font-weight: 700;
}
.conversion-meter {
  height: 0.48rem;
  margin: 0.4rem 0 0.55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--text, #111) 22%, var(--surface, var(--bg, #fff)));
  overflow: hidden;
}
.conversion-meter span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--accent, #888);
}
.conversion-meter.is-bundle span {
  background: color-mix(in srgb, var(--accent, #888) 55%, #c9a227);
}
.conversion-bundle {
  margin-top: 0.65rem;
}
html body.has-pack[class] .conversion-overlay,
html body.has-pack .conversion-overlay,
.conversion-overlay {
  position: fixed;
  inset: 0;
  z-index: 2300;
  display: grid;
  place-items: end center;
  padding: 0;
  background: color-mix(in srgb, #000 55%, transparent);
}
@media (min-width: 720px) {
  .conversion-overlay { place-items: center; padding: 1.25rem; }
}
.conversion-overlay[hidden] { display: none; }
html body.has-pack[class] .conversion-sheet,
html body.has-pack .conversion-sheet,
.conversion-sheet {
  width: min(36rem, calc(100% - 0.5rem));
  max-width: 36rem;
  min-width: min(22rem, 100%);
  max-height: min(92vh, 48rem);
  overflow: auto;
  padding: 1.2rem 1.2rem 1.35rem;
  border-radius: 1.1rem 1.1rem 0 0;
  background: var(--surface, var(--bg, #111114));
  color: var(--text, #f4f4f4);
  box-shadow: 0 -12px 40px color-mix(in srgb, #000 45%, transparent);
  justify-self: center;
  box-sizing: border-box;
}
@media (min-width: 720px) {
  .conversion-sheet { border-radius: 1.1rem; }
}
.conversion-sheet img {
  display: block;
  width: 100%;
  max-height: 11rem;
  object-fit: cover;
  border-radius: 0.75rem;
  margin-bottom: 0.75rem;
}
html body.has-pack[class] .conversion-sheet-lead,
html body.has-pack[class] .conversion-sheet-bundle,
html body.has-pack .conversion-sheet-lead,
html body.has-pack .conversion-sheet-bundle,
.conversion-sheet-lead,
.conversion-sheet-bundle {
  margin: 0.35rem 0 0.7rem;
  color: inherit;
  font-size: 0.98rem;
  font-weight: 500;
  line-height: 1.5;
}
.conversion-sheet-bundle {
  margin-top: 0.85rem;
}
html body.has-pack[class] .conversion-sheet-prices,
html body.has-pack .conversion-sheet-prices,
.conversion-sheet-prices {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 0.75rem;
  align-items: baseline;
  margin: 0.55rem 0 0.2rem;
  color: inherit;
  font-size: 1.2rem;
}
.conversion-sheet-prices s {
  color: inherit;
  opacity: 0.88;
  font-size: 0.95em;
  font-weight: 600;
}
html body.has-pack[class] .conversion-sheet-prices strong,
html body.has-pack .conversion-sheet-prices strong,
.conversion-sheet-prices strong {
  color: inherit;
  font-size: 1.45rem;
  font-weight: 750;
}
.conversion-home {
  margin: 0.75rem auto 0;
}
.conversion-sheet-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 1rem;
}
html body.has-pack[class] .conversion-sheet .btn,
html body.has-pack .conversion-sheet .btn,
.conversion-sheet .btn {
  margin-top: 0;
  font-weight: 750;
}
html body.has-pack[class] .conversion-sheet .btn:not(.btn-ghost),
html body.has-pack .conversion-sheet .btn:not(.btn-ghost),
.conversion-sheet .btn:not(.btn-ghost) {
  background: var(--text, #f4f4f4);
  color: var(--surface, #111114);
  border: 2px solid var(--accent, currentColor);
}
html body.has-pack[class] .conversion-sheet .btn-ghost,
html body.has-pack .conversion-sheet .btn-ghost,
.conversion-sheet .btn-ghost {
  background: transparent;
  color: var(--text, #f4f4f4);
  border: 2px solid var(--text, #f4f4f4);
}
html body.has-pack[class] .conversion-sheet .btn:focus-visible,
html body.has-pack .conversion-sheet .btn:focus-visible,
.conversion-sheet .btn:focus-visible {
  outline: 3px solid var(--accent, #888);
  outline-offset: 3px;
}
.conversion-offer {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.7rem;
  align-items: baseline;
}
.conversion-code {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.04em;
  color: inherit;
}
.conversion-ttl {
  margin: 0.25rem 0;
  color: inherit;
  font-size: 0.95rem;
  font-weight: 650;
  opacity: 1;
}
.conversion-addon {
  margin-top: 0.55rem;
}
.conversion-addon-form {
  margin: 0.35rem 0 0;
}
.conversion-addon-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  align-items: center;
  margin-top: 0.75rem;
}
.conversion-addon-actions .btn,
.conversion-addon-actions .conversion-addon-form {
  margin-top: 0;
}
.conversion-addon-kicker {
  margin: 0 0 0.65rem;
  font-size: 0.82rem;
  font-weight: 650;
  letter-spacing: 0.02em;
  color: inherit;
  opacity: 0.82;
}
.conversion-addon-card.product-card {
  display: block;
  width: 100%;
  max-width: none;
  overflow: visible;
  text-decoration: none;
}
.conversion-addon-body {
  display: grid;
  gap: 0.85rem;
}
@media (min-width: 560px) {
  .conversion-addon-body:has(.thumb) {
    grid-template-columns: 9.5rem minmax(0, 1fr);
    align-items: start;
  }
}
.conversion-addon-card .thumb {
  aspect-ratio: 1;
  min-height: 0;
  border-radius: 0.75rem;
  overflow: hidden;
  background: color-mix(in srgb, var(--text, #111) 8%, transparent);
}
.conversion-addon-card .thumb img {
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: cover;
  margin: 0;
  border-radius: 0;
}
.conversion-addon-card .meta {
  padding: 0;
}
.conversion-addon-name {
  margin: 0 0 0.3rem;
  font-size: 1.2rem;
  line-height: 1.25;
}
.conversion-addon-name a {
  text-decoration: none;
}
.conversion-addon-excerpt {
  margin: 0 0 0.55rem;
  font-size: 0.92rem;
  line-height: 1.45;
  opacity: 0.9;
}
.conversion-addon-card .product-option-price-kicker {
  text-transform: none;
  letter-spacing: 0.02em;
  font-weight: 650;
}
.conversion-addon-card .product-option-prices li.is-offered {
  font-weight: 700;
  padding: 0.28rem 0.4rem;
  margin: 0.1rem -0.4rem;
  border-radius: 0.45rem;
  background: color-mix(in srgb, var(--accent, #888) 18%, transparent);
}
.conversion-addon-card .product-option-prices li.is-offered .product-option-price {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem 0.5rem;
  justify-content: flex-end;
}
.conversion-rail .conversion-addon-card .thumb {
  max-width: 7.5rem;
}
html body.has-pack .live-chat-card.conversion-addon-card,
html body.has-pack .thread .live-chat-card.conversion-addon-card,
.live-chat-card.conversion-addon-card {
  display: block;
  grid-template-columns: none;
  padding: 0.55rem 0.6rem 0.65rem;
}
.live-chat-card.conversion-addon-card .thumb {
  width: 5.6rem;
  max-width: 5.6rem;
}
.live-chat-card.conversion-addon-card img {
  grid-row: auto;
  width: 100%;
  height: 100%;
}
.conversion-viewed {
  margin-top: 1.5rem;
}
.conversion-viewed h2 {
  font-size: 1.15rem;
  margin-bottom: 0.7rem;
}
.cart-discount-line,
.checkout-discount-line {
  margin: 0.15rem 0;
}
.cart-voucher {
  border: 0;
  padding: 0;
  margin: 0.85rem 0;
}
.cart-voucher legend {
  font-weight: 600;
  margin-bottom: 0.35rem;
}
.cart-voucher-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  align-items: center;
}
.cart-voucher-row input {
  flex: 1 1 10rem;
  min-width: 8rem;
  letter-spacing: 0.04em;
}
