/* Consolidated from v217 geometry, v225 typography and v231 hierarchy.
   Canonical v1.237 rules at the end are the only active design decisions. */

/*
  Miller Gadgets v1.217 — fixed ribbon and theme layout parity.
  Generated from the existing light-mode geometry in core-v209.css.
  This layer intentionally contains layout only; theme colors remain in their
  original light and dark stylesheets.
*/

html[data-theme] input::placeholder,
html[data-theme] textarea::placeholder {
  opacity: 1 !important;
}

html[data-theme] [disabled],
html[data-theme] .disabled {
  opacity: .62 !important;
}

html[data-theme].mg-light-readable body:not(.dark-mode) :is(input,textarea)::placeholder,
html[data-theme].mg-light-readable body :is(input,textarea)::placeholder {
  opacity: 1 !important;
}

html[data-theme] {
  --mg-sticky-section-top: 64px !important;
}

html[data-theme] {
  --mg-section-y-tight: clamp(22px, 3.8vw, 48px) !important;
}

html[data-theme] main {
  overflow-x: clip !important;
}

html[data-theme] section {
  box-sizing: border-box !important;
}

html[data-theme] .section,
html[data-theme] .hero-section,
html[data-theme] .page-hero,
html[data-theme] .store-hero,
html[data-theme] .catalogue-section,
html[data-theme] .apple-store-section,
html[data-theme] .product-detail-section,
html[data-theme] .trade-section,
html[data-theme] .sell-section,
html[data-theme] .repair-section,
html[data-theme] .support-section,
html[data-theme] .faq-section,
html[data-theme] .contact-section {
  width: min(100% - (var(--mg-page-pad) * 2), var(--mg-page-max)) !important;
  margin-inline: auto !important;
  padding-block: calc(var(--mg-section-y) / 2) !important;
}

html[data-theme] main > section:first-child {
  padding-top: clamp(24px, 4vw, 54px) !important;
}

html[data-theme] main > section + section {
  margin-top: 0 !important;
}

html[data-theme] h1,
html[data-theme] h2,
html[data-theme] h3 {
  letter-spacing: -0.04em !important;
}

html[data-theme] .eyebrow {
  letter-spacing: .08em !important;
  font-weight: 950 !important;
}

html[data-theme] .top-nav {
  border-bottom-width: 1px !important;
  border-bottom-style: solid !important;
}

html[data-theme] .mg-floating-section-name {
  min-height: 34px !important;
  padding-block: 5px !important;
}

html[data-theme] .mg-floating-section-name span {
  min-height: 24px !important;
  padding: 4px 12px !important;
  font-size: .72rem !important;
  letter-spacing: .07em !important;
}

html[data-theme] .hero,
html[data-theme] .hero-card,
html[data-theme] .hero-panel,
html[data-theme] .store-hero,
html[data-theme] .page-hero,
html[data-theme] .apple-store-hero {
  border-radius: clamp(24px, 3vw, 38px) !important;
  border-width: 1px !important;
  border-style: solid !important;
}

html[data-theme] #storeGrid,
html[data-theme] .product-grid,
html[data-theme] .store-grid,
html[data-theme] .apple-store-row,
html[data-theme] .cards-grid,
html[data-theme] .support-grid,
html[data-theme] .faq-grid,
html[data-theme] .repair-grid {
  gap: var(--mg-grid-gap) !important;
  align-items: stretch !important;
}

html[data-theme] #storeGrid {
  width: min(100% - (var(--mg-page-pad) * 2), var(--mg-page-max)) !important;
  margin-inline: auto !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)) !important;
}

html[data-theme] body.mg-final-filter-ready .mg-final-filter-tools {
  position: relative !important;
  top: auto !important;
  z-index: 2 !important;
  width: min(100% - (var(--mg-page-pad) * 2), var(--mg-page-max)) !important;
  margin: 0 auto clamp(14px, 2vw, 20px) !important;
  padding: 0 !important;
  display: flex !important;
  justify-content: flex-end !important;
  border-width: 0 !important;
}

html[data-theme] body.mg-final-filter-ready .mg-final-filter-tools .mg-filter-sort-open {
  border-radius: 999px !important;
  border-width: 1px !important;
  border-style: solid !important;
}

html[data-theme] .product-card,
html[data-theme] .product-card-v39,
html[data-theme] .accessory-card,
html[data-theme] .store-feature-card,
html[data-theme] .service-card,
html[data-theme] .info-card,
html[data-theme] .trade-card,
html[data-theme] .support-card,
html[data-theme] .faq-card {
  border-radius: var(--mg-card-radius) !important;
  border-width: 1px !important;
  border-style: solid !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
  overflow: hidden !important;
}

html[data-theme] .product-card:hover,
html[data-theme] .product-card-v39:hover,
html[data-theme] .accessory-card:hover,
html[data-theme] .store-feature-card:hover {
  transform: translateY(-4px) !important;
}

html[data-theme] .product-card img,
html[data-theme] .accessory-card img,
html[data-theme] .store-feature-card img {
  object-fit: contain !important;
  max-width: 100% !important;
}

html[data-theme] #storeGrid .product-card {
  min-height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
}

html[data-theme] .product-card-body {
  display: grid !important;
  gap: 6px !important;
  padding-inline: clamp(12px, 1.5vw, 16px) !important;
}

html[data-theme] .product-card h3,
html[data-theme] .store-feature-card h3 {
  font-size: clamp(.92rem, 1.25vw, 1.08rem) !important;
  line-height: 1.14 !important;
  margin: 0 !important;
}

html[data-theme] .product-card p,
html[data-theme] .store-feature-card p {
  font-size: clamp(.74rem, 1vw, .86rem) !important;
  line-height: 1.4 !important;
  margin: 0 !important;
}

html[data-theme] .tag,
html[data-theme] .store-card-kicker,
html[data-theme] .family-option-count {
  border-radius: 999px !important;
  border-width: 1px !important;
  border-style: solid !important;
  font-weight: 900 !important;
}

html[data-theme] .primary-btn,
html[data-theme] .cta-button,
html[data-theme] .price-cta,
html[data-theme] #checkoutBtn,
html[data-theme] #sendTradeBtn,
html[data-theme] #sellWhatsappBtn {
  border-radius: 16px !important;
}

html[data-theme] .secondary-btn,
html[data-theme] .option,
html[data-theme] .mg-filter-option,
html[data-theme] .mg-sort-option {
  border-radius: 16px !important;
  border-width: 1px !important;
  border-style: solid !important;
}

html[data-theme] .product-detail-grid-v39,
html[data-theme] .product-detail-grid {
  width: min(100% - (var(--mg-page-pad) * 2), var(--mg-page-max)) !important;
  margin-inline: auto !important;
  gap: clamp(16px, 2.2vw, 28px) !important;
  align-items: start !important;
}

html[data-theme] .warehouse-product-header {
  width: min(100% - (var(--mg-page-pad) * 2), var(--mg-page-max)) !important;
  margin: 0 auto clamp(16px, 2vw, 24px) !important;
  padding: clamp(16px, 2vw, 24px) !important;
  border-radius: 28px !important;
}

html[data-theme] .product-media-card,
html[data-theme] .product-config-card,
html[data-theme] .purchase-summary-card {
  border-radius: 26px !important;
  border-width: 1px !important;
  border-style: solid !important;
}

html[data-theme] .selection-step {
  border-radius: 20px !important;
  border-width: 1px !important;
  border-style: solid !important;
  padding: clamp(12px, 1.6vw, 18px) !important;
}

html[data-theme] input,
html[data-theme] select,
html[data-theme] textarea {
  border-radius: 14px !important;
  border-width: 1px !important;
  border-style: solid !important;
}

html[data-theme] input:focus,
html[data-theme] select:focus,
html[data-theme] textarea:focus {
  outline-width: 3px !important;
  outline-style: solid !important;
}

html[data-theme] .apple-store-row {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)) !important;
}

html[data-theme] .store-feature-card {
  min-height: 100% !important;
}

html[data-theme] footer,
html[data-theme] .footer {
  border-top-width: 1px !important;
  border-top-style: solid !important;
}

html[data-theme] .spacer {
  min-height: 0 !important;
}

html[data-theme] .section-heading {
  margin-bottom: clamp(14px, 2vw, 24px) !important;
}

html[data-theme] .section-heading h2 {
  margin-bottom: 8px !important;
}

@media (max-width: 760px) {
  html[data-theme] {
    --mg-section-y-tight: 24px !important;
  }
  
  html[data-theme] .section,
  html[data-theme] .hero-section,
  html[data-theme] .page-hero,
  html[data-theme] .store-hero,
  html[data-theme] .catalogue-section,
  html[data-theme] .apple-store-section,
  html[data-theme] .product-detail-section {
    width: min(100% - 24px, var(--mg-page-max)) !important;
  }
  
  html[data-theme] #storeGrid {
    width: min(100% - 24px, var(--mg-page-max)) !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  
  html[data-theme] .product-card-body {
    padding-inline: 10px !important;
  }
  
  html[data-theme] .product-card h3 {
    font-size: .82rem !important;
  }
  
  html[data-theme] .product-card p {
    font-size: .7rem !important;
  }
  
  html[data-theme] .warehouse-product-header,
  html[data-theme] .product-detail-grid-v39,
  html[data-theme] .product-detail-grid {
    width: min(100% - 24px, var(--mg-page-max)) !important;
  }
}

@media (max-width: 380px) {
  html[data-theme] #storeGrid {
    gap: 10px !important;
  }
}

html[data-theme] {
}

html[data-theme] body.mg-v170-ui {
  overflow-x: clip !important;
  min-width: 320px !important;
}

html[data-theme] body.mg-v170-ui * {
  box-sizing: border-box !important;
}

html[data-theme] .mg-v170-ui main {
  width: 100% !important;
  overflow: clip !important;
}

html[data-theme] .mg-v170-ui main > section {
  scroll-margin-top: 120px !important;
}

html[data-theme] .mg-v170-ui .section,
html[data-theme] .mg-v170-ui .catalog-header,
html[data-theme] .mg-v170-ui .apple-store-section,
html[data-theme] .mg-v170-ui .apple-store-hero,
html[data-theme] .mg-v170-ui .hero-ad,
html[data-theme] .mg-v170-ui .promo,
html[data-theme] .mg-v170-ui .page-title,
html[data-theme] .mg-v170-ui .form-page,
html[data-theme] .mg-v170-ui .trade-hero,
html[data-theme] .mg-v170-ui .sell-device-hero,
html[data-theme] .mg-v170-ui .repair-hero,
html[data-theme] .mg-v170-ui .support-hero,
html[data-theme] .mg-v170-ui .contact-hero,
html[data-theme] .mg-v170-ui .product-detail-section {
  width: min(100% - (var(--mg-page-pad) * 2), var(--mg-page-max)) !important;
  margin-inline: auto !important;
}

html[data-theme] .mg-v170-ui h1,
html[data-theme] .mg-v170-ui h2,
html[data-theme] .mg-v170-ui h3 {
  letter-spacing: -.045em !important;
}

html[data-theme] .mg-v170-ui .eyebrow {
  font-weight: 950 !important;
  letter-spacing: .08em !important;
}

html[data-theme] .mg-v170-ui .top-nav {
  min-height: 56px !important;
  border-bottom-width: 1px !important;
  border-bottom-style: solid !important;
}

html[data-theme] .mg-v170-ui .top-nav a {
  min-height: 38px !important;
}

html[data-theme] .mg-v170-ui .hero-ad,
html[data-theme] .mg-v170-ui .apple-store-hero,
html[data-theme] .mg-v170-ui .catalog-header,
html[data-theme] .mg-v170-ui .trade-hero,
html[data-theme] .mg-v170-ui .sell-device-hero,
html[data-theme] .mg-v170-ui .repair-hero,
html[data-theme] .mg-v170-ui .support-hero,
html[data-theme] .mg-v170-ui .contact-hero,
html[data-theme] .mg-v170-ui .page-title {
  margin-top: clamp(18px, 3vw, 34px) !important;
  margin-bottom: clamp(14px, 2vw, 24px) !important;
  padding: clamp(24px, 4vw, 54px) !important;
  border-radius: var(--mg-radius-card) !important;
  border-width: 1px !important;
  border-style: solid !important;
  overflow: hidden !important;
}

html[data-theme] .mg-v170-ui .catalog-header h1,
html[data-theme] .mg-v170-ui .apple-store-hero h1,
html[data-theme] .mg-v170-ui .hero-ad h1,
html[data-theme] .mg-v170-ui .trade-hero h1,
html[data-theme] .mg-v170-ui .sell-device-hero h1,
html[data-theme] .mg-v170-ui .repair-hero h1,
html[data-theme] .mg-v170-ui .support-hero h1,
html[data-theme] .mg-v170-ui .contact-hero h1,
html[data-theme] .mg-v170-ui .page-title h1 {
  font-size: clamp(2.8rem, 7.2vw, 6.8rem) !important;
  line-height: .9 !important;
  max-width: 980px !important;
  margin: 0 0 clamp(10px, 1.5vw, 18px) !important;
}

html[data-theme] .mg-v170-ui .catalog-header p,
html[data-theme] .mg-v170-ui .apple-store-hero p,
html[data-theme] .mg-v170-ui .hero-ad p,
html[data-theme] .mg-v170-ui .page-title p {
  max-width: 720px !important;
  font-size: clamp(.95rem, 1.25vw, 1.08rem) !important;
  line-height: 1.55 !important;
}

html[data-theme] .mg-v170-category .catalog-header {
  margin-bottom: 10px !important;
  padding-bottom: clamp(20px, 3vw, 42px) !important;
}

html[data-theme] .mg-v170-category .product-listing-section {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

html[data-theme] .mg-v170-category .mg-final-filter-tools {
  margin-top: 0 !important;
  margin-bottom: 14px !important;
}

html[data-theme] .mg-v170-category #storeGrid {
  width: min(100% - (var(--mg-page-pad) * 2), var(--mg-page-max)) !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)) !important;
  gap: var(--mg-grid-gap) !important;
  align-items: stretch !important;
}

html[data-theme] .mg-v170-ui .product-card,
html[data-theme] .mg-v170-ui .store-feature-card {
  border-radius: var(--mg-radius-card) !important;
  border-width: 1px !important;
  border-style: solid !important;
  overflow: hidden !important;
  min-height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}

html[data-theme] .mg-v170-ui .product-card:hover,
html[data-theme] .mg-v170-ui .store-feature-card:hover {
  transform: translateY(-4px) !important;
}

html[data-theme] .mg-v170-ui .product-image-link {
  width: calc(100% - 24px) !important;
  margin: 10px auto 8px !important;
  aspect-ratio: 1.16 / .78 !important;
  min-height: 154px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 20px !important;
  border-width: 1px !important;
  border-style: solid !important;
  overflow: hidden !important;
}

html[data-theme] .mg-v170-ui .product-image-link img {
  max-width: 88% !important;
  max-height: 88% !important;
  object-fit: contain !important;
}

html[data-theme] .mg-v170-ui .product-card-body {
  padding: 0 16px 12px !important;
  display: grid !important;
  gap: 7px !important;
  flex: 1 1 auto !important;
}

html[data-theme] .mg-v170-ui .product-card h3 {
  font-size: clamp(.96rem, 1.15vw, 1.08rem) !important;
  line-height: 1.16 !important;
  margin: 0 !important;
}

html[data-theme] .mg-v170-ui .product-card p {
  font-size: .82rem !important;
  line-height: 1.42 !important;
  margin: 0 !important;
}

html[data-theme] .mg-v170-ui .tag,
html[data-theme] .mg-v170-ui .family-option-count {
  width: fit-content !important;
  max-width: calc(100% - 24px) !important;
  margin: 10px 12px 0 !important;
  padding: 5px 10px !important;
  border-radius: var(--mg-radius-pill) !important;
  border-width: 1px !important;
  border-style: solid !important;
  font-size: .74rem !important;
  font-weight: 950 !important;
  line-height: 1 !important;
}

html[data-theme] .mg-v170-ui .price-cta,
html[data-theme] .mg-v170-ui .cta-button {
  margin: auto 14px 14px !important;
  min-height: 42px !important;
  border-radius: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}

html[data-theme] .mg-v170-ui .apple-store-row,
html[data-theme] .mg-v170-ui .store-grid,
html[data-theme] .mg-v170-ui .category-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)) !important;
  gap: var(--mg-grid-gap) !important;
}

html[data-theme] .mg-v170-ui .apple-store-section,
html[data-theme] .mg-v170-ui .section.pad {
  padding-block: clamp(22px, 4vw, 54px) !important;
}

html[data-theme] .mg-v170-product .product-detail-section {
  padding-block: clamp(20px, 4vw, 52px) !important;
}

html[data-theme] .mg-v170-product .warehouse-product-header {
  padding: clamp(18px, 2.5vw, 30px) !important;
  border-radius: var(--mg-radius-card) !important;
  border-width: 1px !important;
  border-style: solid !important;
}

html[data-theme] .mg-v170-product .product-detail-grid {
  display: grid !important;
  grid-template-columns: minmax(260px, .9fr) minmax(320px, 1.1fr) minmax(280px, .8fr) !important;
  gap: var(--mg-grid-gap) !important;
  align-items: start !important;
}

html[data-theme] .mg-v170-product .product-media-card,
html[data-theme] .mg-v170-product .product-config-card,
html[data-theme] .mg-v170-product .purchase-summary-card {
  border-radius: var(--mg-radius-card) !important;
  border-width: 1px !important;
  border-style: solid !important;
}

html[data-theme] .mg-v170-service .form-page,
html[data-theme] .mg-v170-service .trade-page-grid,
html[data-theme] .mg-v170-service .sell-device-grid,
html[data-theme] .mg-v170-service .contact-layout,
html[data-theme] .mg-v170-service .support-section,
html[data-theme] .mg-v170-service .repair-section {
  margin-top: clamp(16px, 2.4vw, 28px) !important;
}

html[data-theme] .mg-v170-ui input,
html[data-theme] .mg-v170-ui select,
html[data-theme] .mg-v170-ui textarea {
  min-height: 46px !important;
  border-radius: 14px !important;
  border-width: 1px !important;
  border-style: solid !important;
}

html[data-theme] .mg-v170-ui input:focus,
html[data-theme] .mg-v170-ui select:focus,
html[data-theme] .mg-v170-ui textarea:focus {
  outline-width: 3px !important;
  outline-style: solid !important;
}

html[data-theme] .mg-v170-ui .primary-btn,
html[data-theme] .mg-v170-ui .secondary-btn,
html[data-theme] .mg-v170-ui button,
html[data-theme] .mg-v170-ui .mg-control-pill {
  min-height: 40px !important;
}

html[data-theme] .mg-v170-ui .mg-clean-separated-pill-cluster {
  display: grid !important;
  grid-auto-flow: column !important;
  grid-auto-columns: max-content !important;
  gap: 12px !important;
  align-items: center !important;
  justify-content: end !important;
}

html[data-theme] .mg-v170-ui .mg-clean-separated-pill-cluster .mg-control-pill {
  min-width: max-content !important;
  height: 38px !important;
  padding: 9px 15px !important;
  border-radius: var(--mg-radius-pill) !important;
  border-width: 1px !important;
  border-style: solid !important;
}

html[data-theme] .mg-v170-ui .mg-filter-sort-panel {
  border-radius: 28px !important;
  border-width: 1px !important;
  border-style: solid !important;
}

html[data-theme] .mg-v170-ui .mg-filter-option,
html[data-theme] .mg-v170-ui .mg-sort-option {
  min-height: 44px !important;
  border-radius: 16px !important;
  border-width: 1px !important;
  border-style: solid !important;
}

html[data-theme] .mg-v170-ui .mg-floating-help {
  width: 52px !important;
  height: 52px !important;
  right: max(18px, env(safe-area-inset-right)) !important;
  border-radius: 999px !important;
}

html[data-theme] .mg-v170-ui .mg-floating-help-tooltip {
  right: 0 !important;
  left: auto !important;
  white-space: nowrap !important;
  max-width: calc(100vw - 36px) !important;
}

html[data-theme] .mg-v170-ui .mg-v170-target:focus-visible {
  outline-width: 3px !important;
  outline-style: solid !important;
  outline-offset: 4px !important;
}

@media (max-width: 760px) {
  html[data-theme] {
  }
  
  html[data-theme] .mg-v170-ui .hero-ad,
  html[data-theme] .mg-v170-ui .apple-store-hero,
  html[data-theme] .mg-v170-ui .catalog-header,
  html[data-theme] .mg-v170-ui .trade-hero,
  html[data-theme] .mg-v170-ui .sell-device-hero,
  html[data-theme] .mg-v170-ui .repair-hero,
  html[data-theme] .mg-v170-ui .support-hero,
  html[data-theme] .mg-v170-ui .contact-hero,
  html[data-theme] .mg-v170-ui .page-title {
    width: min(100% - 24px, var(--mg-page-max)) !important;
    padding: 22px 16px !important;
    border-radius: 24px !important;
  }
  
  html[data-theme] .mg-v170-ui .catalog-header h1,
  html[data-theme] .mg-v170-ui .apple-store-hero h1,
  html[data-theme] .mg-v170-ui .hero-ad h1,
  html[data-theme] .mg-v170-ui .page-title h1 {
    font-size: clamp(2.4rem, 12vw, 4.3rem) !important;
    line-height: .92 !important;
  }
  
  html[data-theme] .mg-v170-category #storeGrid {
    width: min(100% - 24px, var(--mg-page-max)) !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
  
  html[data-theme] .mg-v170-ui .product-image-link {
    width: calc(100% - 18px) !important;
    min-height: 120px !important;
    margin: 8px auto 6px !important;
    border-radius: 18px !important;
  }
  
  html[data-theme] .mg-v170-ui .product-card-body {
    padding: 0 10px 10px !important;
  }
  
  html[data-theme] .mg-v170-ui .product-card h3 {
    font-size: .85rem !important;
    line-height: 1.18 !important;
  }
  
  html[data-theme] .mg-v170-ui .product-card p {
    font-size: .72rem !important;
  }
  
  html[data-theme] .mg-v170-ui .tag,
  html[data-theme] .mg-v170-ui .family-option-count {
    margin: 8px 9px 0 !important;
    font-size: .66rem !important;
    padding: 4px 8px !important;
  }
  
  html[data-theme] .mg-v170-ui .price-cta,
  html[data-theme] .mg-v170-ui .cta-button {
    margin: auto 10px 10px !important;
    min-height: 38px !important;
    font-size: .72rem !important;
    border-radius: 14px !important;
  }
  
  html[data-theme] .mg-v170-ui .mg-filter-sort-panel {
    border-radius: 26px 26px 0 0 !important;
    max-height: min(84vh, 700px) !important;
    overflow: auto !important;
  }
  
  html[data-theme] .mg-v170-ui .mg-filter-options,
  html[data-theme] .mg-v170-ui .mg-sort-options {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
}

@media (max-width: 380px) {
  html[data-theme] .mg-v170-category #storeGrid {
    gap: 10px !important;
  }
  
  html[data-theme] .mg-v170-ui .mg-clean-separated-pill-cluster {
    gap: 8px !important;
  }
}

html[data-theme] {
}

html[data-theme] body.mg-v170-ui {
  overflow-x: clip !important;
}

html[data-theme] .mg-v170-ui :where(h1,h2,h3,h4,h5,h6,p,li,a,button,span,strong,small,label,input,select,textarea,.eyebrow,.tag,.badge,.pill,.mg-control-pill,.price-cta) {
  letter-spacing: 0 !important;
}

html[data-theme] .mg-v170-ui main {
  padding-bottom: clamp(72px, 7vw, 112px) !important;
}

html[data-theme] .mg-v170-ui .section,
html[data-theme] .mg-v170-ui .catalog-header,
html[data-theme] .mg-v170-ui .apple-store-section,
html[data-theme] .mg-v170-ui .apple-store-hero,
html[data-theme] .mg-v170-ui .hero-ad,
html[data-theme] .mg-v170-ui .promo,
html[data-theme] .mg-v170-ui .page-title,
html[data-theme] .mg-v170-ui .form-page,
html[data-theme] .mg-v170-ui .trade-hero,
html[data-theme] .mg-v170-ui .sell-device-hero,
html[data-theme] .mg-v170-ui .repair-hero,
html[data-theme] .mg-v170-ui .support-hero,
html[data-theme] .mg-v170-ui .contact-hero,
html[data-theme] .mg-v170-ui .product-detail-section {
  width: min(100% - (var(--mg-page-pad) * 2), var(--mg-page-max)) !important;
  max-width: var(--mg-page-max) !important;
}

html[data-theme] .mg-v170-ui .hero-ad,
html[data-theme] .mg-v170-ui .apple-store-hero,
html[data-theme] .mg-v170-ui .catalog-header,
html[data-theme] .mg-v170-ui .trade-hero,
html[data-theme] .mg-v170-ui .sell-device-hero,
html[data-theme] .mg-v170-ui .repair-hero,
html[data-theme] .mg-v170-ui .support-hero,
html[data-theme] .mg-v170-ui .contact-hero,
html[data-theme] .mg-v170-ui .page-title {
  min-height: 0 !important;
  margin-top: clamp(16px, 2.5vw, 28px) !important;
  margin-bottom: clamp(16px, 2vw, 28px) !important;
  padding: clamp(24px, 3.6vw, 46px) !important;
  border-radius: var(--mg-radius-card) !important;
  border-width: 1px !important;
  border-style: solid !important;
}

html[data-theme] .mg-v170-ui .hero-ad h1,
html[data-theme] .mg-v170-ui .apple-store-hero h1,
html[data-theme] .mg-v170-ui .catalog-header h1,
html[data-theme] .mg-v170-ui .trade-hero h1,
html[data-theme] .mg-v170-ui .sell-device-hero h1,
html[data-theme] .mg-v170-ui .repair-hero h1,
html[data-theme] .mg-v170-ui .support-hero h1,
html[data-theme] .mg-v170-ui .contact-hero h1,
html[data-theme] .mg-v170-ui .page-title h1 {
  max-width: 900px !important;
  font-size: clamp(2.35rem, 5.4vw, 5.15rem) !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
}

html[data-theme] .mg-v170-product h1 {
  font-size: clamp(2.15rem, 4.4vw, 4.35rem) !important;
  line-height: 1.04 !important;
  letter-spacing: 0 !important;
}

html[data-theme] .mg-v170-ui .hero-ad p,
html[data-theme] .mg-v170-ui .apple-store-hero p,
html[data-theme] .mg-v170-ui .catalog-header p,
html[data-theme] .mg-v170-ui .page-title p,
html[data-theme] .mg-v170-ui .trade-hero p,
html[data-theme] .mg-v170-ui .sell-device-hero p,
html[data-theme] .mg-v170-ui .repair-hero p,
html[data-theme] .mg-v170-ui .support-hero p,
html[data-theme] .mg-v170-ui .contact-hero p {
  max-width: 760px !important;
  font-size: clamp(.96rem, 1.1vw, 1.05rem) !important;
  line-height: 1.6 !important;
}

html[data-theme] .mg-v170-ui .eyebrow {
  font-size: .78rem !important;
  line-height: 1.2 !important;
}

html[data-theme] .mg-v170-ui :where(.product-card,.product-card-v39,.store-feature-card,.service-card,.support-card,.repair-card,.contact-card,.trade-info-card,.trade-form-card,.sell-device-card,.form-card,.product-media-card,.product-config-card,.purchase-summary-card,.summary-box,.estimate-box,.mg-page-bottom-cta,.accordion-item) {
  border-radius: var(--mg-radius-card) !important;
}

html[data-theme] .mg-v170-ui :where(.product-card,.product-card-v39,.store-feature-card):hover {
  transform: translateY(-3px) !important;
}

html[data-theme] .mg-v170-ui :where(.product-image-link,.store-feature-image,.product-main-image,.product-media-card img) {
  border-radius: 12px !important;
}

html[data-theme] .mg-v170-category #storeGrid {
  width: min(100% - (var(--mg-page-pad) * 2), var(--mg-page-max)) !important;
  grid-template-columns: repeat(auto-fill, minmax(235px, 1fr)) !important;
  gap: var(--mg-grid-gap) !important;
}

html[data-theme] body.mg-final-filter-ready .mg-final-filter-tools {
  position: relative !important;
  width: min(100% - (var(--mg-page-pad) * 2), var(--mg-page-max)) !important;
  margin: clamp(6px, .8vw, 10px) auto clamp(16px, 1.7vw, 24px) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  overflow: visible !important;
  pointer-events: none !important;
}

html[data-theme] body.mg-final-filter-ready .mg-final-filter-tools .mg-product-tools-copy {
  position: static !important;
  clip: auto !important;
  clip-path: none !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  max-width: min(50%, 460px) !important;
  opacity: 1 !important;
  visibility: visible !important;
  overflow: hidden !important;
  white-space: normal !important;
  display: grid !important;
  gap: 2px !important;
  pointer-events: none !important;
}

html[data-theme] body.mg-final-filter-ready .mg-final-filter-tools .mg-product-tools-copy strong {
  font-size: .9rem !important;
  line-height: 1.15 !important;
}

html[data-theme] body.mg-final-filter-ready .mg-final-filter-tools .mg-product-tools-copy span {
  font-size: .78rem !important;
  line-height: 1.3 !important;
}

html[data-theme] body.mg-final-filter-ready .mg-clean-separated-pill-cluster {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  max-width: 100% !important;
  pointer-events: auto !important;
}

html[data-theme] body.mg-final-filter-ready .mg-clean-separated-pill-cluster .mg-control-pill,
html[data-theme] body.mg-final-filter-ready .mg-clean-separated-pill-cluster .mg-help-choose-pill,
html[data-theme] body.mg-final-filter-ready .mg-clean-separated-pill-cluster .mg-filter-sort-open {
  min-width: max-content !important;
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  padding: 10px 15px !important;
  border-radius: 999px !important;
  border-width: 1px !important;
  border-style: solid !important;
  font-size: .84rem !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

html[data-theme] .mg-v170-ui :where(.primary-btn,.secondary-btn,.cta-button,.price-cta,button) {
  min-height: 42px !important;
  border-radius: 12px !important;
  line-height: 1.15 !important;
  text-align: center !important;
}

html[data-theme] .mg-v170-ui :where(input,select,textarea) {
  border-radius: 10px !important;
}

html[data-theme] .mg-v170-ui .apple-category-rail {
  width: min(100%, calc(var(--mg-page-max) + (var(--mg-page-pad) * 2))) !important;
  padding: 10px var(--mg-page-pad) clamp(30px, 4vw, 54px) !important;
  gap: clamp(16px, 2vw, 28px) !important;
  scroll-padding-inline: var(--mg-page-pad) !important;
}

html[data-theme] .mg-v170-ui .store-icon-card {
  min-width: 92px !important;
  border-radius: var(--mg-radius-control) !important;
}

html[data-theme] .mg-v170-ui .store-icon-image {
  height: 74px !important;
}

html[data-theme] .mg-v170-ui .mg-scroll-arrow {
  width: 38px !important;
  height: 38px !important;
  border-radius: 999px !important;
}

html[data-theme] .mg-v170-ui .mg-floating-section-name {
  left: 50% !important;
  right: auto !important;
  width: max-content !important;
  max-width: calc(100vw - 24px) !important;
  transform: translateX(-50%) !important;
  overflow: visible !important;
}

html[data-theme] .mg-v170-ui .mg-floating-section-name span {
  max-width: calc(100vw - 24px) !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

html[data-theme] .mg-v170-ui .mg-floating-help {
  width: 48px !important;
  height: 48px !important;
  right: max(18px, env(safe-area-inset-right)) !important;
  border-radius: 999px !important;
}

html[data-theme] .mg-v170-ui .mg-floating-help-tooltip {
  font-size: .82rem !important;
  line-height: 1 !important;
}

html[data-theme] .page-home.mg-v170-ui .hero-image {
  width: min(620px, 72vw) !important;
  margin-top: clamp(14px, 2vw, 22px) !important;
}

html[data-theme] .page-home.mg-v170-ui .hero-image img {
  width: 100% !important;
  max-height: 330px !important;
  object-fit: contain !important;
}

@media (min-width: 1180px) {
  html[data-theme] .mg-v170-ui .apple-store-hero h1 {
    max-width: 780px !important;
  }
}

@media (max-width: 900px) {
  html[data-theme] .mg-v170-product .product-detail-grid,
  html[data-theme] .mg-v170-product .product-detail-grid-v39 {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 760px) {
  html[data-theme] {
  }
  
  html[data-theme] .mg-v170-ui main {
    padding-bottom: 96px !important;
  }
  
  html[data-theme] .mg-v170-ui .hero-ad,
  html[data-theme] .mg-v170-ui .apple-store-hero,
  html[data-theme] .mg-v170-ui .catalog-header,
  html[data-theme] .mg-v170-ui .trade-hero,
  html[data-theme] .mg-v170-ui .sell-device-hero,
  html[data-theme] .mg-v170-ui .repair-hero,
  html[data-theme] .mg-v170-ui .support-hero,
  html[data-theme] .mg-v170-ui .contact-hero,
  html[data-theme] .mg-v170-ui .page-title {
    width: calc(100% - 24px) !important;
    padding: 20px 16px !important;
    border-radius: 16px !important;
    margin-top: 12px !important;
    margin-bottom: 16px !important;
  }
  
  html[data-theme] .mg-v170-ui .hero-ad h1,
  html[data-theme] .mg-v170-ui .apple-store-hero h1,
  html[data-theme] .mg-v170-ui .catalog-header h1,
  html[data-theme] .mg-v170-ui .trade-hero h1,
  html[data-theme] .mg-v170-ui .sell-device-hero h1,
  html[data-theme] .mg-v170-ui .repair-hero h1,
  html[data-theme] .mg-v170-ui .support-hero h1,
  html[data-theme] .mg-v170-ui .contact-hero h1,
  html[data-theme] .mg-v170-ui .page-title h1 {
    font-size: clamp(2rem, 10vw, 3.35rem) !important;
    line-height: 1.02 !important;
    letter-spacing: 0 !important;
  }
  
  html[data-theme] .mg-v170-product h1 {
    font-size: clamp(2rem, 9vw, 3rem) !important;
  }
  
  html[data-theme] body.mg-final-filter-ready .mg-final-filter-tools {
    width: calc(100% - 48px) !important;
    margin: 10px auto 14px !important;
    justify-content: flex-end !important;
  }
  
  html[data-theme] body.mg-final-filter-ready .mg-final-filter-tools .mg-product-tools-copy {
    display: none !important;
  }
  
  html[data-theme] body.mg-final-filter-ready .mg-clean-separated-pill-cluster {
    width: 100% !important;
    justify-content: space-between !important;
    gap: 10px !important;
  }
  
  html[data-theme] body.mg-final-filter-ready .mg-clean-separated-pill-cluster .mg-control-pill,
  html[data-theme] body.mg-final-filter-ready .mg-clean-separated-pill-cluster .mg-help-choose-pill,
  html[data-theme] body.mg-final-filter-ready .mg-clean-separated-pill-cluster .mg-filter-sort-open {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    max-width: none !important;
    padding-inline: 10px !important;
    font-size: .8rem !important;
  }
  
  html[data-theme] .mg-v170-category #storeGrid {
    width: calc(100% - 24px) !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
  
  html[data-theme] .mg-v170-ui .product-card h3 {
    font-size: .86rem !important;
    line-height: 1.2 !important;
  }
  
  html[data-theme] .mg-v170-ui .product-card p {
    font-size: .72rem !important;
    line-height: 1.35 !important;
  }
  
  html[data-theme] .mg-v170-ui .apple-category-rail {
    padding: 8px 28px 28px !important;
    gap: 18px !important;
    grid-auto-columns: 86px !important;
    scroll-padding-inline: 28px !important;
  }
  
  html[data-theme] .mg-v170-ui .store-icon-image {
    width: 82px !important;
    height: 58px !important;
  }
  
  html[data-theme] .mg-v170-ui .store-icon-image img {
    max-width: 82px !important;
    max-height: 56px !important;
  }
  
  html[data-theme] .mg-v170-ui .store-icon-card strong {
    font-size: .82rem !important;
    line-height: 1.12 !important;
  }
  
  html[data-theme] .mg-v170-ui .store-icon-card span {
    font-size: .72rem !important;
  }
  
  html[data-theme] .mg-v170-ui .mg-floating-help {
    width: 44px !important;
    height: 44px !important;
    right: max(14px, env(safe-area-inset-right)) !important;
  }
  
  html[data-theme] .mg-v170-ui .mg-filter-sort-panel {
    border-radius: 18px 18px 0 0 !important;
  }
  
  html[data-theme] .page-home.mg-v170-ui .hero-image {
    width: min(100%, 310px) !important;
  }
  
  html[data-theme] .page-home.mg-v170-ui .hero-image img {
    max-height: 220px !important;
  }
  
  html[data-theme] .mg-v170-ui .trade-hero-copy {
    display: -webkit-box !important;
    overflow: hidden !important;
  }
  
  html[data-theme] .mg-v170-ui :where(.support-hero-card,.repair-hero-card) {
    padding: 14px !important;
    gap: 10px !important;
  }
  
  html[data-theme] .mg-v170-ui :where(.support-hero-card,.repair-hero-card) p {
    display: none !important;
  }
  
  html[data-theme] .mg-v170-ui :where(.support-hero-card,.repair-hero-card) strong {
    font-size: 1rem !important;
    line-height: 1.2 !important;
  }
}

@media (max-width: 380px) {
  html[data-theme] body.mg-final-filter-ready .mg-clean-separated-pill-cluster {
    gap: 8px !important;
  }
  
  html[data-theme] body.mg-final-filter-ready .mg-clean-separated-pill-cluster .mg-control-pill,
  html[data-theme] body.mg-final-filter-ready .mg-clean-separated-pill-cluster .mg-help-choose-pill,
  html[data-theme] body.mg-final-filter-ready .mg-clean-separated-pill-cluster .mg-filter-sort-open {
    font-size: .76rem !important;
    padding-inline: 8px !important;
  }
}

html[data-theme] .mg-v170-ui .apple-store-row {
  display: grid !important;
  grid-auto-flow: column !important;
  grid-auto-columns: minmax(285px, 380px) !important;
  grid-template-columns: none !important;
  gap: var(--mg172-row-gap) !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  overscroll-behavior-inline: contain !important;
  scroll-snap-type: inline proximity !important;
  scroll-padding-inline: var(--mg172-row-pad) !important;
  padding: 6px var(--mg172-row-pad) 24px !important;
  box-sizing: border-box !important;
}

html[data-theme] .mg-v170-ui .apple-store-row-featured {
  grid-auto-columns: minmax(310px, 430px) !important;
}

html[data-theme] .mg-v170-ui .apple-store-row::after {
  inline-size: max(1px, calc(var(--mg172-row-pad) - var(--mg172-row-gap))) !important;
  block-size: 1px !important;
  scroll-snap-align: end !important;
}

html[data-theme] .mg-v170-ui :where(.product-card,.product-card-v39,.store-feature-card) {
  position: relative !important;
  transform: none !important;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease !important;
}

html[data-theme] .mg-v170-ui :where(.product-card,.product-card-v39,.store-feature-card):hover,
html[data-theme] .mg-v170-ui :where(.product-card,.product-card-v39,.store-feature-card):focus-visible {
  transform: none !important;
}

html[data-theme] .mg-v170-ui :where(.product-card,.product-card-v39,.store-feature-card) img,
html[data-theme] .mg-v170-ui :where(.product-card,.product-card-v39,.store-feature-card):hover img,
html[data-theme] .mg-v170-ui :where(.product-card,.product-card-v39,.store-feature-card):focus-visible img {
  transform: none !important;
}

html[data-theme] .mg-v170-ui #storeGrid .product-card {
  overflow: hidden !important;
}

html[data-theme] .mg-v170-ui #storeGrid .product-card .price-cta {
  width: min(calc(100% - 28px), 230px) !important;
  min-height: 42px !important;
  margin: 0 auto 14px !important;
  align-self: center !important;
  border-radius: 999px !important;
  z-index: 2 !important;
  transition: transform .22s cubic-bezier(.2, .8, .2, 1),
    box-shadow .22s ease,
    filter .22s ease,
    background .22s ease !important;
}

@media (hover: none) {
  html[data-theme] .mg-v170-ui #storeGrid .product-card .price-cta {
    transform: none !important;
  }
}

@media (max-width: 760px) {
  html[data-theme] .mg-v170-ui .apple-store-row {
    grid-auto-columns: minmax(248px, 78vw) !important;
    padding-block: 4px 22px !important;
  }
  
  html[data-theme] .mg-v170-ui .apple-store-row-featured {
    grid-auto-columns: minmax(260px, 82vw) !important;
  }
}

@media (hover: hover) and (pointer: fine) {
  html[data-theme] .mg-v170-ui #storeGrid .product-card,
  html[data-theme] .mg-v170-ui #storeGrid .product-card:hover,
  html[data-theme] .mg-v170-ui #storeGrid .product-card:focus-visible {
    min-block-size: 100% !important;
    padding-bottom: 0 !important;
  }
  
  html[data-theme] .mg-v170-ui #storeGrid .product-card .price-cta,
  html[data-theme] .mg-v170-ui #storeGrid .product-card:hover .price-cta,
  html[data-theme] .mg-v170-ui #storeGrid .product-card:focus-visible .price-cta {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    width: calc(100% - 28px) !important;
    max-width: none !important;
    min-height: 42px !important;
    margin: auto 14px 14px !important;
    padding: 8px 12px !important;
    pointer-events: auto !important;
    transform: none !important;
  }
}

html[data-theme] body.mg-v170-ui #storeGrid .product-card,
html[data-theme] body.mg-v170-ui #storeGrid .product-card:hover,
html[data-theme] body.mg-v170-ui #storeGrid .product-card:focus-visible,
html[data-theme] body.mg-v170-ui .apple-store-row .store-feature-card,
html[data-theme] body.mg-v170-ui .apple-store-row .store-feature-card:hover,
html[data-theme] body.mg-v170-ui .apple-store-row .store-feature-card:focus-visible {
  transform: none !important;
  transition: box-shadow .18s ease, border-color .18s ease, background .18s ease !important;
}

html[data-theme] body.mg-v170-ui #storeGrid .product-card img,
html[data-theme] body.mg-v170-ui #storeGrid .product-card:hover img,
html[data-theme] body.mg-v170-ui #storeGrid .product-card:focus-visible img,
html[data-theme] body.mg-v170-ui .apple-store-row .store-feature-card img,
html[data-theme] body.mg-v170-ui .apple-store-row .store-feature-card:hover img,
html[data-theme] body.mg-v170-ui .apple-store-row .store-feature-card:focus-visible img {
  transform: none !important;
}

@media (max-width: 760px) {
  html[data-theme] body.mg-v170-ui #storeGrid .product-card {
    min-block-size: 0 !important;
    padding-bottom: 12px !important;
  }
  
  html[data-theme] body.mg-v170-ui #storeGrid .product-card .price-cta,
  html[data-theme] body.mg-v170-ui #storeGrid .product-card:hover .price-cta,
  html[data-theme] body.mg-v170-ui #storeGrid .product-card:focus-visible .price-cta {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    width: 100% !important;
    max-width: 230px !important;
    min-height: 48px !important;
    margin: 0 auto 12px !important;
    padding: 8px 9px !important;
    pointer-events: auto !important;
    transform: none !important;
    font-size: clamp(.66rem, 2.6vw, .76rem) !important;
    line-height: 1.08 !important;
  }
}

html[data-theme] body.mg-v170-ui #storeGrid .product-card::after,
html[data-theme] body.mg-v170-ui #storeGrid .product-card:hover::after,
html[data-theme] body.mg-v170-ui #storeGrid .product-card:focus-visible::after {
  opacity: 0 !important;
  display: none !important;
}

html[data-theme] body.mg-v170-ui #storeGrid .product-card .product-image-link,
html[data-theme] body.mg-v170-ui #storeGrid .product-card .product-card-body,
html[data-theme] body.mg-v170-ui #storeGrid .product-card .tag,
html[data-theme] body.mg-v170-ui #storeGrid .product-card .family-option-count,
html[data-theme] body.mg-v170-ui #storeGrid .product-card:hover .product-image-link,
html[data-theme] body.mg-v170-ui #storeGrid .product-card:hover .product-card-body,
html[data-theme] body.mg-v170-ui #storeGrid .product-card:hover .tag,
html[data-theme] body.mg-v170-ui #storeGrid .product-card:hover .family-option-count,
html[data-theme] body.mg-v170-ui #storeGrid .product-card:focus-visible .product-image-link,
html[data-theme] body.mg-v170-ui #storeGrid .product-card:focus-visible .product-card-body,
html[data-theme] body.mg-v170-ui #storeGrid .product-card:focus-visible .tag,
html[data-theme] body.mg-v170-ui #storeGrid .product-card:focus-visible .family-option-count {
  opacity: 1 !important;
  transform: none !important;
}

html[data-theme] body.mg-v170-ui #storeGrid .product-card:hover,
html[data-theme] body.mg-v170-ui #storeGrid .product-card:focus-visible {
  transform: none !important;
}

html[data-theme] body.mg-v183-ribbon-hardfix .top-nav :is(.logo-mark,.brand-logo,.logo-only-link,.restored-header-logo),
html[data-theme] body.mg-v183-ribbon-hardfix .top-nav :is(.logo-mark,.brand-logo,.logo-only-link,.restored-header-logo):hover,
html[data-theme] body.mg-v183-ribbon-hardfix .top-nav :is(.logo-mark,.brand-logo,.logo-only-link,.restored-header-logo):focus,
html[data-theme] body.mg-v183-ribbon-hardfix .top-nav :is(.logo-mark,.brand-logo,.logo-only-link,.restored-header-logo):focus-visible,
html[data-theme] body.mg-v183-ribbon-hardfix .top-nav :is(.logo-mark,.brand-logo,.logo-only-link,.restored-header-logo):active,
html[data-theme] body.mg-v183-ribbon-hardfix .top-nav :is(.logo-mark,.brand-logo,.logo-only-link,.restored-header-logo)[aria-current] {
  border-width: 0 !important;
  outline-width: 0 !important;
  transform: none !important;
}

html[data-theme] body.mg-v185-interactions #themeToggle .theme-icon-moon {
  opacity: 1 !important;
  transform: rotate(0deg) scale(1) !important;
}

html[data-theme] body.mg-v185-interactions #themeToggle .theme-icon-sun {
  opacity: 0 !important;
  transform: rotate(60deg) scale(.6) !important;
}

html[data-theme] body.mg-v201-dark-rebuild.mg-v185-interactions #themeToggle .theme-icon-moon,
html[data-theme] body.mg-v201-dark-rebuild.mg-v185-interactions #themeToggle .theme-icon-sun {
  position: relative !important;
  inset: auto !important;
  translate: none !important;
  display: inline-flex !important;
  opacity: 1 !important;
  transform: none !important;
  pointer-events: none !important;
}

/* Fixed ribbon and mobile current-page indicator. */
:root,
html[data-theme] {
  --mg217-ribbon-content-height: 68px;
  --mg217-ribbon-total-height: calc(var(--mg217-ribbon-content-height) + env(safe-area-inset-top, 0px));
  --mg217-page-indicator-height: 40px;
}

html[data-theme] {
  scroll-padding-top: calc(var(--mg217-ribbon-total-height) + 20px) !important;
}

html[data-theme] body {
  padding-top: var(--mg217-ribbon-total-height) !important;
}

html[data-theme] body .top-nav {
  position: fixed !important;
  inset: 0 0 auto !important;
  width: 100% !important;
  height: var(--mg217-ribbon-total-height) !important;
  min-height: var(--mg217-ribbon-total-height) !important;
  margin: 0 !important;
  transform: none !important;
  z-index: 3100 !important;
}

html[data-theme] body .top-nav > .nav-inner {
  width: 100% !important;
  height: var(--mg217-ribbon-content-height) !important;
  min-height: var(--mg217-ribbon-content-height) !important;
}

html[data-theme] body .mg-floating-section-name {
  box-sizing: border-box !important;
}

html[data-theme] body.page-store.mg-v170-ui .apple-store-row {
  grid-auto-columns: minmax(285px, 380px) !important;
}

html[data-theme] body.page-store.mg-v170-ui .apple-store-row-featured {
  grid-auto-columns: minmax(310px, 430px) !important;
}

html[data-theme] body.page-store.mg-v170-ui .apple-store-row::-webkit-scrollbar {
  width: 10px !important;
  height: 10px !important;
}

html[data-theme] body.page-store.mg-v170-ui .apple-store-row {
  scrollbar-width: thin !important;
}

html[data-theme] body.page-store.mg-v170-ui .apple-store-row::-webkit-scrollbar-thumb {
  border-width: 0 !important;
}

html[data-theme] body.page-store .apple-category-rail::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
}

html[data-theme] body.page-store .apple-category-rail {
  scrollbar-width: thin !important;
}

html[data-theme] body.page-store .apple-category-rail::-webkit-scrollbar-thumb {
  border-width: 0 !important;
}

html[data-theme] body.page-store.mg-v170-ui .apple-store-row > :is(
  .store-feature-card,
  .product-card,
  .product-card-v39,
  .accessory-card
) {
  inline-size: 100% !important;
  width: 100% !important;
  min-inline-size: 0 !important;
  min-width: 0 !important;
  max-inline-size: none !important;
  max-width: none !important;
  margin-inline: 0 !important;
  grid-column: auto !important;
  scroll-snap-align: start !important;
}

@media (min-width: 901px) {
  html[data-theme] body.mg-v170-ui .mg-floating-section-name,
  html[data-theme] body .mg-floating-section-name {
    display: none !important;
  }
}

@media (max-width: 900px) {
  :root,
  html[data-theme] {
    --mg217-ribbon-content-height: 64px;
  }

  html[data-theme] body.mg-v170-ui .mg-floating-section-name,
  html[data-theme] body .mg-floating-section-name {
    position: fixed !important;
    top: var(--mg-floating-section-top, var(--mg217-ribbon-total-height)) !important;
    right: 0 !important;
    left: 0 !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    height: var(--mg217-page-indicator-height) !important;
    min-height: var(--mg217-page-indicator-height) !important;
    margin: 0 !important;
    padding: 6px 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: none !important;
    z-index: 3050 !important;
  }

  html[data-theme] body.mg-v170-ui .mg-floating-section-name > span,
  html[data-theme] body .mg-floating-section-name > span {
    width: auto !important;
    max-width: min(88vw, 34rem) !important;
    min-height: 28px !important;
    margin: 0 !important;
    padding: 5px 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-width: 1px !important;
    border-style: solid !important;
    border-radius: 999px !important;
    font-size: .76rem !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
}

@media (max-width: 760px) {
  html[data-theme] body.page-store.mg-v170-ui .apple-store-row {
    grid-auto-columns: minmax(248px, 78vw) !important;
    gap: 10px !important;
    padding: 4px var(--mg190-mobile-gutter, 9px) 18px !important;
  }

  html[data-theme] body.page-store.mg-v170-ui .apple-store-row-featured {
    grid-auto-columns: minmax(260px, 82vw) !important;
  }
}


/*
 * Miller Gadgets v1.225 — Typography and text auto-layout system
 * Keeps the approved Manrope + Sora pairing while standardising supported
 * font weights, responsive sizes, line lengths, wrapping and component rhythm.
 */

:root {
  --mg225-font-body: "Manrope", "Sora", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --mg225-font-display: "Sora", "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;

  --mg225-text-xs: clamp(.74rem, .72rem + .08vw, .8rem);
  --mg225-text-sm: clamp(.84rem, .81rem + .12vw, .92rem);
  --mg225-text-base: clamp(.94rem, .91rem + .13vw, 1rem);
  --mg225-text-md: clamp(1rem, .96rem + .2vw, 1.12rem);
  --mg225-text-lg: clamp(1.12rem, 1.04rem + .38vw, 1.35rem);
  --mg225-heading-3: clamp(1.05rem, .99rem + .28vw, 1.22rem);
  --mg225-heading-2: clamp(1.65rem, 1.38rem + 1.32vw, 2.75rem);
  --mg225-heading-1: clamp(2rem, 1.56rem + 2.15vw, 4.25rem);

  --mg225-leading-tight: 1.08;
  --mg225-leading-heading: 1.14;
  --mg225-leading-body: 1.62;
  --mg225-leading-control: 1.25;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

html[data-theme] body {
  font-family: var(--mg225-font-body) !important;
  font-size: var(--mg225-text-base);
  font-weight: 400;
  line-height: var(--mg225-leading-body);
  font-synthesis: none;
  font-kerning: normal;
  font-variant-ligatures: common-ligatures contextual;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

html[data-theme] body :where(button, input, select, textarea) {
  font-family: inherit !important;
  font-synthesis: none;
}

html[data-theme] body :where(h1, h2, h3, h4, h5, h6, .headline) {
  min-inline-size: 0;
  max-inline-size: 100%;
  margin-block-start: 0;
  font-family: var(--mg225-font-display) !important;
  font-synthesis: none;
  overflow-wrap: break-word;
  word-break: normal;
  text-wrap: balance;
}

html[data-theme] body :where(h1, .headline) {
  font-size: var(--mg225-heading-1) !important;
  font-weight: 800 !important;
  line-height: var(--mg225-leading-tight) !important;
  letter-spacing: -.042em !important;
}

html[data-theme] body h2 {
  font-size: var(--mg225-heading-2) !important;
  font-weight: 700 !important;
  line-height: var(--mg225-leading-heading) !important;
  letter-spacing: -.03em !important;
}

html[data-theme] body h3 {
  font-size: var(--mg225-heading-3) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: -.016em !important;
}

html[data-theme] body :where(h4, h5, h6) {
  font-size: var(--mg225-text-md) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: -.01em !important;
}

html[data-theme] body :where(p, li, dd, dt) {
  font-size: var(--mg225-text-base);
  font-weight: 400;
  line-height: var(--mg225-leading-body);
  overflow-wrap: break-word;
  word-break: normal;
  text-wrap: pretty;
}

html[data-theme] body :where(strong, b) {
  font-weight: 700 !important;
}

html[data-theme] body :where(em, i) {
  font-weight: inherit;
}

/* Readable hero and section measure */
html[data-theme] body :where(
  .page-title,
  .page-hero,
  .section-heading,
  .trade-hero-copy,
  .sell-hero-copy,
  .support-hero-copy,
  .recommendation-hero-copy
) > :where(h1, h2, p) {
  margin-inline: auto;
}

html[data-theme] body :where(
  .page-title,
  .page-hero,
  .section-heading,
  .trade-hero-copy,
  .sell-hero-copy,
  .support-hero-copy,
  .recommendation-hero-copy
) > :where(h1, h2) {
  max-inline-size: 19ch;
}

html[data-theme] body :where(
  .page-title p,
  .page-hero p,
  .section-heading p,
  .ad-copy p:not(.eyebrow),
  .trade-hero-copy p,
  .sell-hero-copy p,
  .support-hero-copy p,
  .recommendation-hero-copy p
) {
  max-inline-size: 64ch !important;
  font-size: var(--mg225-text-md) !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
}

/* Eyebrows, badges and short metadata */
html[data-theme] body .eyebrow {
  font-size: var(--mg225-text-xs) !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  letter-spacing: .11em !important;
  text-transform: uppercase;
}

html[data-theme] body :where(
  .tag,
  .store-card-kicker,
  .product-family-specs-category,
  .trade-decision-badge,
  .trade-section-number
) {
  font-size: var(--mg225-text-xs) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: .015em !important;
}

html[data-theme] body :where(
  .small-note,
  .muted,
  .field-hint,
  .customer-copy-note,
  .warehouse-product-heading,
  .product-family-specs-intro,
  .product-family-specs-note,
  .summary-exact,
  .mg-noscript-notice,
  .mg-offline-notice
) {
  font-size: var(--mg225-text-sm) !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
  letter-spacing: 0 !important;
  overflow-wrap: break-word;
  text-wrap: pretty;
}

/* Navigation remains compact, but no synthetic heavy text */
html[data-theme] body .nav-inner {
  font-size: var(--mg225-text-sm) !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: -.005em !important;
}

html[data-theme] body :where(
  .nav-links a,
  .mobile-nav a,
  .mg-mega-filter-link,
  .mega-menu a,
  .footer-links a,
  .support-nav a
) {
  font-size: inherit;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  letter-spacing: -.008em !important;
}

html[data-theme] body :where(
  .nav-links a.active,
  .mobile-nav a.active,
  .mg-mega-filter-link.active,
  .logo-mark
) {
  font-weight: 700 !important;
}

/* Buttons and selectable controls */
html[data-theme] body :where(
  .btn,
  .primary-btn,
  .secondary-btn,
  .option,
  .category-filter,
  .mg-filter-sort-actions button,
  .trade-add-defect,
  .repair-submit-btn,
  .help-choosing-link,
  .product-photo-request-btn
) {
  min-inline-size: 0;
  max-inline-size: 100%;
  min-block-size: 44px;
  padding-inline: clamp(15px, 2vw, 22px);
  font-size: clamp(.88rem, .84rem + .16vw, .98rem) !important;
  font-weight: 700 !important;
  line-height: var(--mg225-leading-control) !important;
  letter-spacing: -.006em !important;
  text-align: center;
  white-space: normal !important;
  overflow-wrap: break-word;
  word-break: normal;
  text-wrap: balance;
}

html[data-theme] body :where(
  .option.active,
  .category-filter.active,
  .primary-btn
) {
  font-weight: 800 !important;
}

/* Form typography */
html[data-theme] body label:not(.sr-only) {
  min-inline-size: 0;
  max-inline-size: 100%;
  font-size: var(--mg225-text-sm) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  letter-spacing: -.004em !important;
  overflow-wrap: break-word;
}

html[data-theme] body :where(input, select, textarea) {
  min-inline-size: 0;
  max-inline-size: 100%;
  font-size: max(1rem, var(--mg225-text-base)) !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  letter-spacing: 0 !important;
}

html[data-theme] body :where(input, textarea)::placeholder {
  font-weight: 400;
  opacity: .72;
}

html[data-theme] body select {
  text-overflow: ellipsis;
}

/* Product listing cards */
html[data-theme] body #storeGrid :where(
  .product-card,
  .product-card-v39,
  .accessory-card,
  .mg-card-v220,
  .mg-card-v220-link,
  .product-card-body
) {
  min-inline-size: 0 !important;
  max-inline-size: 100%;
}

html[data-theme] body #storeGrid .product-card-body {
  gap: clamp(5px, .7vw, 9px) !important;
}

html[data-theme] body #storeGrid :where(
  .product-card-body h3,
  .mg-card-v220-title
) {
  display: -webkit-box;
  min-block-size: 2.5em;
  max-block-size: 3.75em;
  margin: 0 !important;
  overflow: hidden;
  font-family: var(--mg225-font-display) !important;
  font-size: clamp(.95rem, .91rem + .18vw, 1.08rem) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: -.014em !important;
  overflow-wrap: break-word;
  text-wrap: pretty;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

html[data-theme] body #storeGrid .family-option-count {
  font-size: clamp(.74rem, .71rem + .12vw, .82rem) !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
  white-space: normal !important;
}

html[data-theme] body #storeGrid .tag {
  max-inline-size: calc(100% - 24px) !important;
  font-size: clamp(.68rem, .65rem + .12vw, .76rem) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  white-space: normal !important;
  overflow-wrap: break-word;
  text-wrap: balance;
}

html[data-theme] body #storeGrid :where(.price, .price-cta) {
  font-variant-numeric: tabular-nums lining-nums;
}

html[data-theme] body #storeGrid .price-cta {
  min-block-size: 44px;
  padding: 10px 12px !important;
  font-size: clamp(.8rem, .76rem + .16vw, .9rem) !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  letter-spacing: -.006em !important;
  white-space: normal !important;
  overflow-wrap: break-word;
  text-wrap: balance;
}

/* Dedicated product page */
html[data-theme] body #productName {
  max-inline-size: 18ch;
  font-size: clamp(1.85rem, 1.55rem + 1.35vw, 2.9rem) !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
  letter-spacing: -.035em !important;
}

html[data-theme] body :where(
  .product-family-specs-card h2,
  .purchase-summary-card h2,
  .product-config-card h2,
  .form-card h2,
  .product-panel h2,
  .trust-box h2,
  .search-panel h2
) {
  font-size: clamp(1.3rem, 1.15rem + .7vw, 1.8rem) !important;
  font-weight: 700 !important;
  line-height: 1.18 !important;
  letter-spacing: -.022em !important;
  text-wrap: pretty;
}

html[data-theme] body :where(
  .product-config-card h3,
  .purchase-summary-card h3,
  .product-family-specs-card h3
) {
  font-size: clamp(.96rem, .92rem + .18vw, 1.08rem) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: -.008em !important;
}

html[data-theme] body :where(.price, .summary-price, .total-price, .trade-result-value) {
  font-weight: 800 !important;
  font-variant-numeric: tabular-nums lining-nums;
  letter-spacing: -.015em !important;
}

/* FAQ and information cards */
html[data-theme] body details summary {
  min-inline-size: 0;
  max-inline-size: 100%;
  font-size: var(--mg225-text-md) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  letter-spacing: -.01em !important;
  overflow-wrap: break-word;
  text-wrap: pretty;
}

html[data-theme] body :where(
  .card p,
  .product-card p,
  .service-card p,
  .support-card p,
  .support-help-card p,
  details p
) {
  font-size: var(--mg225-text-sm) !important;
  font-weight: 400 !important;
  line-height: 1.58 !important;
}

/* Search and status text */
html[data-theme] body :where(
  .mg-search-results-title,
  .search-result-title,
  .result-title,
  .recommendation-result-title
) {
  font-size: var(--mg225-text-md) !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  letter-spacing: -.01em !important;
}

/* Flex/grid text safety: allows content to shrink instead of forcing overflow. */
html[data-theme] body :where(
  .nav-inner,
  .nav-links,
  .nav-icons,
  .actions,
  .form-actions,
  .hero-actions,
  .page-actions,
  .cta-row,
  .button-row,
  .card-grid,
  .product-grid,
  .service-grid,
  .support-grid,
  .repair-grid,
  .contact-grid,
  .faq-grid,
  .form-grid,
  .field-row,
  .product-detail-grid,
  .product-left-rail-v200,
  .product-right-rail-v200
) > * {
  min-inline-size: 0;
  max-inline-size: 100%;
}

html[data-theme] body :where(
  .actions,
  .form-actions,
  .hero-actions,
  .page-actions,
  .cta-row,
  .button-row
) {
  align-items: stretch;
  row-gap: 10px;
}

/* Mobile tuning keeps type readable without destabilising the approved layout. */
@media (max-width: 900px) {
  html[data-theme] body {
    --mg225-heading-1: clamp(2rem, 1.7rem + 1.55vw, 2.65rem);
    --mg225-heading-2: clamp(1.55rem, 1.4rem + .8vw, 2rem);
  }

  html[data-theme] body :where(
    .mobile-nav a,
    .mobile-drawer a,
    .mobile-menu-panel a
  ) {
    font-size: .96rem !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    white-space: normal !important;
  }

  html[data-theme] body #storeGrid :where(
    .product-card-body h3,
    .mg-card-v220-title
  ) {
    font-size: clamp(.91rem, .86rem + .24vw, 1rem) !important;
    line-height: 1.28 !important;
  }

  html[data-theme] body #storeGrid .price-cta {
    font-size: clamp(.78rem, .73rem + .24vw, .88rem) !important;
  }
}

@media (max-width: 560px) {
  html[data-theme] body {
    --mg225-text-base: .94rem;
    --mg225-text-md: 1rem;
    --mg225-heading-1: clamp(1.95rem, 8.5vw, 2.28rem);
    --mg225-heading-2: clamp(1.5rem, 7vw, 1.82rem);
  }

  html[data-theme] body :where(h1, .headline) {
    letter-spacing: -.034em !important;
  }

  html[data-theme] body h2 {
    letter-spacing: -.024em !important;
  }

  html[data-theme] body :where(
    .btn,
    .primary-btn,
    .secondary-btn,
    .option,
    .category-filter,
    .help-choosing-link,
    .product-photo-request-btn
  ) {
    min-block-size: 46px;
    font-size: .9rem !important;
    line-height: 1.3 !important;
  }

  html[data-theme] body #productName {
    font-size: clamp(1.75rem, 8vw, 2.15rem) !important;
  }

  html[data-theme] body :where(
    .product-family-specs-card h2,
    .purchase-summary-card h2,
    .product-config-card h2,
    .form-card h2,
    .product-panel h2,
    .trust-box h2,
    .search-panel h2
  ) {
    font-size: clamp(1.22rem, 5.6vw, 1.48rem) !important;
    line-height: 1.22 !important;
  }

  html[data-theme] body #storeGrid .tag {
    font-size: .68rem !important;
  }

  html[data-theme] body #storeGrid .family-option-count {
    font-size: .74rem !important;
  }

  html[data-theme] body #storeGrid .price-cta {
    min-block-size: 46px;
    font-size: .79rem !important;
    line-height: 1.28 !important;
  }
}

@media (max-width: 360px) {
  html[data-theme] body {
    --mg225-heading-1: 1.9rem;
    --mg225-heading-2: 1.45rem;
  }

  html[data-theme] body #storeGrid :where(
    .product-card-body h3,
    .mg-card-v220-title
  ) {
    font-size: .88rem !important;
  }

  html[data-theme] body #storeGrid .price-cta {
    padding-inline: 8px !important;
    font-size: .75rem !important;
  }
}

/*
 * Final specificity layer.
 * The legacy compiled stylesheet contains page-specific !important rules.
 * main-content is present on every page, so this layer reliably keeps the
 * v1.225 type system authoritative without changing layout geometry.
 */
html[data-theme] body #main-content h1 {
  font-size: var(--mg225-heading-1) !important;
  font-weight: 800 !important;
  line-height: var(--mg225-leading-tight) !important;
  letter-spacing: -.042em !important;
}

html[data-theme] body #main-content h2 {
  font-size: var(--mg225-heading-2) !important;
  font-weight: 700 !important;
  line-height: var(--mg225-leading-heading) !important;
  letter-spacing: -.03em !important;
}

html[data-theme] body #main-content h3 {
  font-size: var(--mg225-heading-3) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: -.016em !important;
}

html[data-theme] body #main-content .eyebrow {
  font-size: var(--mg225-text-xs) !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  letter-spacing: .11em !important;
}

html[data-theme] body #main-content p,
html[data-theme] body #main-content li,
html[data-theme] body #main-content dd,
html[data-theme] body #main-content dt {
  font-size: var(--mg225-text-base) !important;
  font-weight: 400 !important;
  line-height: var(--mg225-leading-body) !important;
}

html[data-theme] body #main-content .muted,
html[data-theme] body #main-content .small-note,
html[data-theme] body #main-content .field-hint,
html[data-theme] body #main-content .warehouse-product-heading,
html[data-theme] body #main-content .product-family-specs-intro,
html[data-theme] body #main-content .product-family-specs-note,
html[data-theme] body #main-content .summary-exact {
  font-size: var(--mg225-text-sm) !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
}

html[data-theme] body #main-content label:not(.sr-only) {
  font-size: var(--mg225-text-sm) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
}

html[data-theme] body #main-content input,
html[data-theme] body #main-content select,
html[data-theme] body #main-content textarea {
  font-size: max(1rem, var(--mg225-text-base)) !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  letter-spacing: 0 !important;
}

html[data-theme] body #main-content .primary-btn,
html[data-theme] body #main-content .secondary-btn,
html[data-theme] body #main-content .btn,
html[data-theme] body #main-content .option,
html[data-theme] body #main-content .category-filter,
html[data-theme] body #main-content .help-choosing-link,
html[data-theme] body #main-content .product-photo-request-btn {
  min-block-size: 44px !important;
  font-size: clamp(.88rem, .84rem + .16vw, .98rem) !important;
  font-weight: 700 !important;
  line-height: var(--mg225-leading-control) !important;
  letter-spacing: -.006em !important;
  white-space: normal !important;
}

html[data-theme] body #main-content .primary-btn,
html[data-theme] body #main-content .option.active,
html[data-theme] body #main-content .category-filter.active {
  font-weight: 800 !important;
}

html[data-theme] body #main-content .trade-section-number,
html[data-theme] body #main-content .trade-decision-badge,
html[data-theme] body #main-content .product-family-specs-category,
html[data-theme] body #main-content .store-card-kicker {
  font-size: var(--mg225-text-xs) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}

html[data-theme] body #main-content #storeGrid .product-card-body h3,
html[data-theme] body #main-content #storeGrid .mg-card-v220-title {
  min-block-size: 2.5em !important;
  max-block-size: 3.75em !important;
  font-size: clamp(.95rem, .91rem + .18vw, 1.08rem) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: -.014em !important;
}

html[data-theme] body #main-content #storeGrid .family-option-count {
  font-size: clamp(.74rem, .71rem + .12vw, .82rem) !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
}

html[data-theme] body #main-content #storeGrid .tag {
  font-size: clamp(.68rem, .65rem + .12vw, .76rem) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  white-space: normal !important;
}

html[data-theme] body #main-content #storeGrid .price-cta {
  min-block-size: 44px !important;
  font-size: clamp(.8rem, .76rem + .16vw, .9rem) !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  letter-spacing: -.006em !important;
  white-space: normal !important;
}

html[data-theme] body #main-content #productName {
  font-size: clamp(1.85rem, 1.55rem + 1.35vw, 2.9rem) !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
  letter-spacing: -.035em !important;
}

html[data-theme] body #main-content .product-family-specs-card h2,
html[data-theme] body #main-content .purchase-summary-card h2,
html[data-theme] body #main-content .product-config-card h2,
html[data-theme] body #main-content .form-card h2,
html[data-theme] body #main-content .product-panel h2,
html[data-theme] body #main-content .trust-box h2,
html[data-theme] body #main-content .search-panel h2 {
  font-size: clamp(1.3rem, 1.15rem + .7vw, 1.8rem) !important;
  font-weight: 700 !important;
  line-height: 1.18 !important;
  letter-spacing: -.022em !important;
}

html[data-theme] body #main-content details summary {
  font-size: var(--mg225-text-md) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  letter-spacing: -.01em !important;
}

html[data-theme] body .top-nav .nav-links a,
html[data-theme] body .top-nav .mg-mega-filter-link {
  font-weight: 600 !important;
}

html[data-theme] body .top-nav .nav-links a.active,
html[data-theme] body .top-nav .logo-mark {
  font-weight: 700 !important;
}

@media (max-width: 560px) {
  html[data-theme] body #main-content .primary-btn,
  html[data-theme] body #main-content .secondary-btn,
  html[data-theme] body #main-content .btn,
  html[data-theme] body #main-content .option,
  html[data-theme] body #main-content .category-filter,
  html[data-theme] body #main-content .help-choosing-link,
  html[data-theme] body #main-content .product-photo-request-btn {
    min-block-size: 46px !important;
    font-size: .9rem !important;
    line-height: 1.3 !important;
  }

  html[data-theme] body #main-content #storeGrid .product-card-body h3,
  html[data-theme] body #main-content #storeGrid .mg-card-v220-title {
    font-size: .91rem !important;
    line-height: 1.28 !important;
  }

  html[data-theme] body #main-content #storeGrid .tag {
    font-size: .68rem !important;
  }

  html[data-theme] body #main-content #storeGrid .family-option-count {
    font-size: .74rem !important;
  }

  html[data-theme] body #main-content #storeGrid .price-cta {
    min-block-size: 46px !important;
    font-size: .79rem !important;
    line-height: 1.28 !important;
  }

  html[data-theme] body #main-content .product-family-specs-card h2,
  html[data-theme] body #main-content .purchase-summary-card h2,
  html[data-theme] body #main-content .product-config-card h2,
  html[data-theme] body #main-content .form-card h2,
  html[data-theme] body #main-content .product-panel h2,
  html[data-theme] body #main-content .trust-box h2,
  html[data-theme] body #main-content .search-panel h2 {
    font-size: clamp(1.22rem, 5.6vw, 1.48rem) !important;
    line-height: 1.22 !important;
  }
}

/* Remaining legacy heavy-label normalisation */
html[data-theme] body .mg-floating-help-tooltip {
  font-size: var(--mg225-text-sm) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: -.006em !important;
}

html[data-theme] body #main-content .trade-mobile-summary-strip span,
html[data-theme] body #main-content .upgrade-price-box > span,
html[data-theme] body #main-content .trade-model-explainer span,
html[data-theme] body #main-content .sell-guide-steps span,
html[data-theme] body #main-content .support-hero-card span,
html[data-theme] body #main-content .support-help-card > span {
  font-weight: 700 !important;
}

html[data-theme] body #main-content .trade-result-panel small {
  font-size: var(--mg225-text-sm) !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
}

html[data-theme] body #main-content .support-social-row a {
  font-weight: 600 !important;
}

html[data-theme] body #main-content .warehouse-status-strip span,
html[data-theme] body #main-content .warehouse-gallery-tile,
html[data-theme] body #main-content .warehouse-media-checks span,
html[data-theme] body #main-content .warehouse-quick-promises span,
html[data-theme] body #main-content .summary-total span {
  font-weight: 700 !important;
}

html[data-theme] body #main-content .warehouse-meta-card span {
  font-weight: 600 !important;
}

html[data-theme] body #main-content .upgrade-price-box span {
  font-weight: 700 !important;
}


/*
 * Miller Gadgets v1.231 — Visual hierarchy and interface rhythm
 * Loaded after the approved typography layer. This file does not change the
 * catalogue or Supabase logic; it standardises prominence, spacing and scan order.
 */

:root {
  --mg231-space-1: .25rem;
  --mg231-space-2: .5rem;
  --mg231-space-3: .75rem;
  --mg231-space-4: 1rem;
  --mg231-space-5: 1.5rem;
  --mg231-space-6: 2rem;
  --mg231-space-7: 3rem;
  --mg231-space-8: 4rem;
  --mg231-space-9: 6rem;
  --mg231-radius-card: 22px;
  --mg231-radius-control: 14px;
  --mg231-shadow-rest: 0 8px 28px rgba(17, 9, 51, .065);
  --mg231-shadow-raised: 0 18px 48px rgba(17, 9, 51, .13);
  --mg231-border-light: rgba(17, 9, 51, .10);
  --mg231-muted-light: #665f72;
}

html[data-theme="dark"] {
  --mg231-shadow-rest: 0 10px 32px rgba(0, 0, 0, .20);
  --mg231-shadow-raised: 0 20px 54px rgba(0, 0, 0, .34);
  --mg231-border-light: rgba(255, 255, 255, .10);
  --mg231-muted-light: rgba(255, 255, 255, .70);
}

/* ------------------------------
   1. Global reading hierarchy
   ------------------------------ */

body.mg-v231-visual-hierarchy #main-content {
  isolation: isolate;
}

body.mg-v231-visual-hierarchy #main-content :where(h1, h2, h3, h4, p) {
  margin-block-start: 0;
}

body.mg-v231-visual-hierarchy #main-content h1 {
  max-inline-size: 20ch;
  margin-block-end: clamp(14px, 1.5vw, 20px);
  font-size: clamp(2.15rem, 1.65rem + 2.25vw, 3.85rem) !important;
  line-height: 1.06 !important;
  letter-spacing: -.041em !important;
  text-wrap: balance;
}

body.mg-v231-visual-hierarchy #main-content h2 {
  margin-block-end: 12px;
  font-size: clamp(1.48rem, 1.30rem + .85vw, 2.2rem) !important;
  line-height: 1.14 !important;
  letter-spacing: -.028em !important;
  text-wrap: balance;
}

body.mg-v231-visual-hierarchy #main-content h3 {
  margin-block-end: 8px;
  font-size: clamp(1rem, .96rem + .2vw, 1.16rem) !important;
  line-height: 1.28 !important;
  letter-spacing: -.014em !important;
  text-wrap: pretty;
}

body.mg-v231-visual-hierarchy #main-content :where(p, li, dd) {
  color: var(--muted, var(--mg231-muted-light));
}

body.mg-v231-visual-hierarchy #main-content :where(
  .page-title p,
  .page-hero p,
  .catalog-header p,
  .hero-ad .ad-copy > p:not(.eyebrow),
  .support-hero-copy > p,
  .repair-hero-copy > p,
  .trade-hero-copy > p,
  .sell-device-hero-copy > p
) {
  max-inline-size: 62ch !important;
  margin-block: 0 clamp(20px, 2.5vw, 30px);
  font-size: clamp(1rem, .96rem + .18vw, 1.1rem) !important;
  line-height: 1.68 !important;
}

body.mg-v231-visual-hierarchy #main-content .eyebrow {
  margin: 0 0 10px !important;
  color: var(--orange, #fc6501);
  font-size: .73rem !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  letter-spacing: .12em !important;
}

/* Page heroes are the strongest level, but no longer consume a full screen. */
body.mg-v231-visual-hierarchy :where(
  .hero-ad,
  .apple-store-hero,
  .catalog-header,
  .page-title,
  .support-hero,
  .repair-hero,
  .trade-hero,
  .sell-device-hero
) {
  min-block-size: auto !important;
  padding-block: clamp(54px, 7vw, 92px) !important;
}

body.mg-v231-visual-hierarchy .hero-ad {
  min-height: clamp(520px, 70vh, 720px) !important;
}

body.mg-v231-visual-hierarchy :where(
  .hero-ad,
  .page-title,
  .catalog-header
) > :where(.ad-copy, div) {
  min-inline-size: 0;
}

/* ------------------------------
   2. Section rhythm and headings
   ------------------------------ */

body.mg-v231-visual-hierarchy #main-content > :where(
  .section,
  .promo,
  .homepage-adverts,
  .apple-store-section,
  .support-section,
  .repair-section,
  .trade-workbook-layout,
  .sell-device-layout,
  .form-page,
  .mg-page-bottom-cta,
  .accessories-bottom-cta
) {
  scroll-margin-top: 84px;
}

body.mg-v231-visual-hierarchy :where(
  .section-heading,
  .apple-store-section-head,
  .support-section-head,
  .repair-section-head,
  .trade-section-heading,
  .form-card > header,
  .catalog-results-head-v231
) {
  min-inline-size: 0;
}

body.mg-v231-visual-hierarchy :where(
  .section-heading,
  .support-section-head,
  .repair-section-head,
  .catalog-results-head-v231
) {
  margin-block-end: clamp(22px, 3vw, 34px) !important;
  text-align: left !important;
}

body.mg-v231-visual-hierarchy :where(
  .section-heading,
  .support-section-head,
  .repair-section-head,
  .catalog-results-head-v231
) > :where(h2, p) {
  margin-inline: 0 !important;
}

body.mg-v231-visual-hierarchy :where(
  .section-heading p,
  .support-section-head p,
  .repair-section-head p,
  .apple-store-section-head p,
  .catalog-results-head-v231 p
) {
  max-inline-size: 62ch !important;
  margin: 7px 0 0 !important;
  font-size: .96rem !important;
  line-height: 1.62 !important;
}

body.mg-v231-visual-hierarchy .section-heading h2,
body.mg-v231-visual-hierarchy .support-section-head h2,
body.mg-v231-visual-hierarchy .repair-section-head h2,
body.mg-v231-visual-hierarchy .apple-store-section-head h2,
body.mg-v231-visual-hierarchy .catalog-results-head-v231 h2 {
  max-inline-size: 26ch;
}

body.mg-v231-visual-hierarchy .section.pad,
body.mg-v231-visual-hierarchy .support-section,
body.mg-v231-visual-hierarchy .repair-section,
body.mg-v231-visual-hierarchy .apple-store-section {
  padding-block: clamp(54px, 7vw, 92px) !important;
}

body.mg-v231-visual-hierarchy .section.pad + .section.pad,
body.mg-v231-visual-hierarchy .support-section + .support-section,
body.mg-v231-visual-hierarchy .repair-section + .repair-section {
  border-top: 1px solid color-mix(in srgb, var(--line, var(--mg231-border-light)) 70%, transparent);
}

/* Category result heading: creates a clear level between page title and card titles. */
body.mg-v231-visual-hierarchy .catalog-results-head-v231 {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  width: min(1360px, 100%);
  margin-inline: auto;
  padding-inline: clamp(0px, 1vw, 8px);
}

body.mg-v231-visual-hierarchy .catalog-results-head-v231 > div {
  min-inline-size: 0;
}

body.mg-v231-visual-hierarchy .catalog-results-head-v231 p:last-child {
  max-inline-size: 42ch !important;
  text-align: right;
}

/* ------------------------------
   3. Action hierarchy
   ------------------------------ */

body.mg-v231-visual-hierarchy :where(
  .actions,
  .hero-actions,
  .page-actions,
  .form-actions,
  .repair-hero-actions,
  .support-hero-actions,
  .support-contact-actions,
  .summary-action-stack,
  .mg-page-bottom-actions
) {
  gap: 12px !important;
}

body.mg-v231-visual-hierarchy :where(
  .primary-btn,
  .btn.primary,
  .repair-submit-btn,
  #checkoutBtn
) {
  min-block-size: 48px;
  border-radius: var(--mg231-radius-control) !important;
  font-weight: 800 !important;
  box-shadow: 0 10px 24px rgba(252, 101, 1, .20) !important;
}

body.mg-v231-visual-hierarchy :where(
  .secondary-btn,
  .btn.secondary,
  .help-choosing-link,
  #backToCatalogBtn
) {
  min-block-size: 48px;
  border-radius: var(--mg231-radius-control) !important;
  font-weight: 700 !important;
  box-shadow: none !important;
}

body.mg-v231-visual-hierarchy :where(
  .primary-btn,
  .secondary-btn,
  .btn,
  .help-choosing-link
):focus-visible {
  outline: 3px solid color-mix(in srgb, var(--orange, #fc6501) 55%, transparent);
  outline-offset: 3px;
}

/* ------------------------------
   4. Card hierarchy
   ------------------------------ */

body.mg-v231-visual-hierarchy :where(
  .card,
  .service-card,
  .support-card,
  .support-help-card,
  .support-policy-card,
  .repair-type-card,
  .form-card,
  .trust-box,
  .search-panel,
  .apple-store-help,
  .future-hot-deals-placeholder
) {
  border-color: var(--mg231-border-light) !important;
  border-radius: var(--mg231-radius-card) !important;
  box-shadow: var(--mg231-shadow-rest) !important;
}

body.mg-v231-visual-hierarchy :where(
  .card,
  .service-card,
  .support-card,
  .support-help-card,
  .support-policy-card,
  .repair-type-card
) {
  padding: clamp(20px, 2.4vw, 28px) !important;
}

body.mg-v231-visual-hierarchy :where(
  .card,
  .service-card,
  .support-card,
  .support-help-card,
  .support-policy-card,
  .repair-type-card
) :where(h3, strong) {
  color: var(--text, #110933);
}

body.mg-v231-visual-hierarchy :where(
  .card,
  .service-card,
  .support-card,
  .support-help-card,
  .support-policy-card,
  .repair-type-card
) p {
  margin-block: 0;
}

body.mg-v231-visual-hierarchy :where(
  .card,
  .service-card,
  .support-card,
  .support-help-card,
  .repair-type-card
):hover {
  transform: translateY(-2px);
  box-shadow: var(--mg231-shadow-raised) !important;
}

/* Product cards: image -> product -> option metadata -> starting price. */
body.mg-v231-visual-hierarchy #storeGrid :where(
  .product-card,
  .product-card-v39,
  .accessory-card,
  .mg-card-v220-link
) {
  border-color: var(--mg231-border-light) !important;
  border-radius: 20px !important;
  box-shadow: 0 5px 20px rgba(17, 9, 51, .055) !important;
}

body.mg-v231-visual-hierarchy #storeGrid :where(
  .product-card,
  .product-card-v39,
  .accessory-card,
  .mg-card-v220-link
):hover {
  transform: translateY(-3px) !important;
  box-shadow: var(--mg231-shadow-raised) !important;
}

body.mg-v231-visual-hierarchy #storeGrid .tag {
  border-color: color-mix(in srgb, var(--line, var(--mg231-border-light)) 80%, transparent) !important;
  background: color-mix(in srgb, var(--surface, #fff) 92%, var(--purple, #3b3457) 8%) !important;
  color: var(--purple, #3b3457) !important;
  -webkit-text-fill-color: currentColor !important;
}

html[data-theme="dark"] body.mg-v231-visual-hierarchy #storeGrid .tag {
  color: rgba(255,255,255,.80) !important;
  background: rgba(255,255,255,.07) !important;
}

body.mg-v231-visual-hierarchy #storeGrid .product-card-body {
  gap: 6px !important;
  padding-block-start: 14px !important;
}

body.mg-v231-visual-hierarchy #storeGrid .product-card-body h3 {
  min-block-size: 2.55em;
  margin: 0 !important;
  color: var(--text, #110933);
  font-size: clamp(.96rem, .92rem + .17vw, 1.07rem) !important;
  font-weight: 700 !important;
  line-height: 1.28 !important;
}

body.mg-v231-visual-hierarchy #storeGrid :where(.family-option-count, .product-card-body p) {
  color: var(--muted, var(--mg231-muted-light)) !important;
  font-size: .78rem !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
}

body.mg-v231-visual-hierarchy #storeGrid .price-cta {
  margin-top: auto !important;
  border: 0 !important;
  border-radius: 13px !important;
  background: var(--orange, #fc6501) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: none !important;
}

/* Store rails receive clear title + supporting copy instead of one long heading. */
body.mg-v231-visual-hierarchy .apple-store-section-head {
  align-items: end !important;
  margin-block-end: 24px !important;
}

body.mg-v231-visual-hierarchy .apple-store-section-head > div {
  min-inline-size: 0;
}

body.mg-v231-visual-hierarchy .apple-store-section-head h2 {
  margin: 0 !important;
}

body.mg-v231-visual-hierarchy .apple-store-section-head p {
  color: var(--muted, var(--mg231-muted-light));
}

/* ------------------------------
   5. Product-page hierarchy
   ------------------------------ */

body.mg-v231-visual-hierarchy.page-product .warehouse-product-header {
  border-color: var(--mg231-border-light) !important;
  background: var(--surface, #fff) !important;
  box-shadow: var(--mg231-shadow-rest) !important;
}

body.mg-v231-visual-hierarchy.page-product .warehouse-status-strip span,
body.mg-v231-visual-hierarchy.page-product .warehouse-quick-promises span,
body.mg-v231-visual-hierarchy.page-product .warehouse-media-checks span {
  border-color: var(--mg231-border-light) !important;
  background: color-mix(in srgb, var(--surface, #fff) 94%, var(--purple, #3b3457) 6%) !important;
  color: var(--muted, var(--mg231-muted-light)) !important;
  -webkit-text-fill-color: currentColor !important;
  font-weight: 700 !important;
}

body.mg-v231-visual-hierarchy.page-product :where(
  .product-media-card,
  .product-config-card,
  .purchase-summary-card,
  .product-family-specs-card
) {
  border-color: var(--mg231-border-light) !important;
  border-radius: 24px !important;
  box-shadow: var(--mg231-shadow-rest) !important;
}

body.mg-v231-visual-hierarchy.page-product .product-media-card img#productImage {
  border-color: var(--mg231-border-light) !important;
  background: color-mix(in srgb, var(--surface, #fff) 97%, var(--purple, #3b3457) 3%) !important;
}

body.mg-v231-visual-hierarchy.page-product .product-config-card > .eyebrow {
  margin-bottom: 8px !important;
}

body.mg-v231-visual-hierarchy.page-product #productName {
  max-inline-size: 20ch !important;
  margin-bottom: 12px !important;
  font-size: clamp(1.9rem, 1.55rem + 1.45vw, 3rem) !important;
}

body.mg-v231-visual-hierarchy.page-product #productDescription {
  max-inline-size: 56ch;
  margin: 0 0 18px;
}

body.mg-v231-visual-hierarchy.page-product .selection-stack-title-v231 {
  margin: clamp(28px, 3vw, 36px) 0 6px !important;
  font-size: clamp(1.28rem, 1.16rem + .45vw, 1.62rem) !important;
}

body.mg-v231-visual-hierarchy.page-product .selection-stack-copy-v231 {
  max-inline-size: 54ch;
  margin: 0 0 16px;
  font-size: .9rem !important;
  line-height: 1.55 !important;
}

body.mg-v231-visual-hierarchy.page-product .warehouse-product-meta-grid {
  margin-block: 18px 8px !important;
}

body.mg-v231-visual-hierarchy.page-product .warehouse-meta-card,
body.mg-v231-visual-hierarchy.page-product .warehouse-summary-benefits div,
body.mg-v231-visual-hierarchy.page-product .warehouse-gallery-tile {
  border-color: var(--mg231-border-light) !important;
  background: color-mix(in srgb, var(--surface, #fff) 96%, var(--purple, #3b3457) 4%) !important;
}

body.mg-v231-visual-hierarchy.page-product .warehouse-meta-card span {
  font-size: .72rem !important;
  font-weight: 600 !important;
}

body.mg-v231-visual-hierarchy.page-product .warehouse-meta-card strong {
  font-weight: 700 !important;
}

body.mg-v231-visual-hierarchy.page-product .selection-stack {
  gap: 14px !important;
}

body.mg-v231-visual-hierarchy.page-product .selection-step {
  border: 1px solid var(--mg231-border-light) !important;
  border-radius: 18px !important;
  padding: clamp(16px, 2vw, 21px) !important;
  background: color-mix(in srgb, var(--surface, #fff) 97%, var(--purple, #3b3457) 3%) !important;
}

body.mg-v231-visual-hierarchy.page-product .selection-step h3 {
  margin: 0 0 12px !important;
  font-size: .92rem !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  letter-spacing: .015em !important;
  text-transform: none !important;
}

body.mg-v231-visual-hierarchy.page-product .selection-step .small-note {
  margin: -4px 0 12px !important;
}

body.mg-v231-visual-hierarchy.page-product .option {
  min-height: 48px !important;
  border-radius: 13px !important;
  background: var(--surface, #fff) !important;
  box-shadow: none !important;
}

body.mg-v231-visual-hierarchy.page-product .option.active {
  border-color: var(--orange, #fc6501) !important;
  background: color-mix(in srgb, var(--surface, #fff) 88%, var(--orange, #fc6501) 12%) !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--orange, #fc6501) 22%, transparent) !important;
}

body.mg-v231-visual-hierarchy.page-product .purchase-summary-card {
  background: var(--surface, #fff) !important;
}

body.mg-v231-visual-hierarchy.page-product .purchase-summary-card > h2 {
  font-size: clamp(1.25rem, 1.14rem + .46vw, 1.55rem) !important;
}

body.mg-v231-visual-hierarchy.page-product .summary-line {
  padding-block: 10px !important;
}

body.mg-v231-visual-hierarchy.page-product .summary-total {
  border-color: color-mix(in srgb, var(--orange, #fc6501) 30%, transparent) !important;
  background: color-mix(in srgb, var(--surface, #fff) 88%, var(--orange, #fc6501) 12%) !important;
}

body.mg-v231-visual-hierarchy.page-product #summaryPrice {
  color: var(--orange, #fc6501) !important;
  -webkit-text-fill-color: currentColor !important;
  font-size: clamp(1.35rem, 1.16rem + .8vw, 1.9rem) !important;
}

body.mg-v231-visual-hierarchy.page-product .product-family-specs-card {
  background: var(--surface, #fff) !important;
}

body.mg-v231-visual-hierarchy.page-product .product-family-spec-item {
  border-color: var(--mg231-border-light) !important;
  background: color-mix(in srgb, var(--surface, #fff) 97%, var(--purple, #3b3457) 3%) !important;
}

/* ------------------------------
   6. Forms, valuation and service pages
   ------------------------------ */

body.mg-v231-visual-hierarchy :where(
  .trade-workbook-card,
  .sell-device-card,
  .repair-form-card,
  .recommendation-form,
  .contact-form,
  .form-card
) {
  border-color: var(--mg231-border-light) !important;
  box-shadow: var(--mg231-shadow-rest) !important;
}

body.mg-v231-visual-hierarchy :where(
  .trade-section-heading,
  .repair-form-head
) {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  column-gap: 12px;
  row-gap: 4px;
}

body.mg-v231-visual-hierarchy .trade-section-number {
  display: inline-grid;
  place-items: center;
  inline-size: 30px;
  block-size: 30px;
  border-radius: 50%;
  background: var(--orange, #fc6501);
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font-weight: 800 !important;
}

body.mg-v231-visual-hierarchy .trade-section-heading :where(h3, p) {
  grid-column: 2;
}

body.mg-v231-visual-hierarchy :where(
  .trade-workbook-section,
  .sell-v198-result,
  .trade-result-panel,
  .deduction-panel,
  .repair-guide-card,
  .sell-device-guide-card
) {
  border-color: var(--mg231-border-light) !important;
  border-radius: 20px !important;
}

body.mg-v231-visual-hierarchy :where(
  .trade-result-panel,
  .sell-v198-result
) {
  box-shadow: 0 12px 34px rgba(252, 101, 1, .10) !important;
}

body.mg-v231-visual-hierarchy :where(
  input,
  select,
  textarea
) {
  border-radius: 13px !important;
}

body.mg-v231-visual-hierarchy label:not(.sr-only) {
  color: var(--text, #110933);
}

body.mg-v231-visual-hierarchy :where(input, select, textarea):focus {
  border-color: var(--orange, #fc6501) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--orange, #fc6501) 16%, transparent) !important;
}

/* FAQ summary is the primary item; expanded copy is subordinate. */
body.mg-v231-visual-hierarchy details {
  border-color: var(--mg231-border-light) !important;
}

body.mg-v231-visual-hierarchy details summary {
  font-weight: 700 !important;
}

body.mg-v231-visual-hierarchy details[open] summary {
  color: var(--orange, #fc6501);
}

/* ------------------------------
   7. Search, footer and utility UI
   ------------------------------ */

body.mg-v231-visual-hierarchy .mg-search-shell {
  border-color: var(--mg231-border-light) !important;
  box-shadow: var(--mg231-shadow-raised) !important;
}

body.mg-v231-visual-hierarchy .mg-search-results-title {
  color: var(--muted, var(--mg231-muted-light));
}

body.mg-v231-visual-hierarchy .footer {
  border-top: 1px solid var(--mg231-border-light);
}

body.mg-v231-visual-hierarchy .footer > p {
  color: var(--muted, var(--mg231-muted-light));
}

/* ------------------------------
   8. Dark-mode surface parity
   ------------------------------ */

html[data-theme="dark"] body.mg-v231-visual-hierarchy :where(
  .warehouse-product-header,
  .product-media-card,
  .product-config-card,
  .purchase-summary-card,
  .product-family-specs-card,
  .selection-step,
  .warehouse-meta-card,
  .warehouse-summary-benefits div,
  .warehouse-gallery-tile
) {
  background: var(--surface, #201a2d) !important;
}

html[data-theme="dark"] body.mg-v231-visual-hierarchy.page-product .option {
  background: color-mix(in srgb, var(--surface, #201a2d) 91%, #fff 9%) !important;
}

html[data-theme="dark"] body.mg-v231-visual-hierarchy.page-product .option.active {
  background: color-mix(in srgb, var(--surface, #201a2d) 78%, var(--orange, #fc6501) 22%) !important;
}

html[data-theme="dark"] body.mg-v231-visual-hierarchy.page-product .summary-total {
  background: color-mix(in srgb, var(--surface, #201a2d) 78%, var(--orange, #fc6501) 22%) !important;
}

/* ------------------------------
   9. Responsive hierarchy
   ------------------------------ */

@media (max-width: 900px) {
  body.mg-v231-visual-hierarchy #main-content h1 {
    font-size: clamp(2rem, 7vw, 2.75rem) !important;
  }

  body.mg-v231-visual-hierarchy #main-content h2 {
    font-size: clamp(1.4rem, 5vw, 1.9rem) !important;
  }

  body.mg-v231-visual-hierarchy :where(
    .hero-ad,
    .apple-store-hero,
    .catalog-header,
    .page-title,
    .support-hero,
    .repair-hero,
    .trade-hero,
    .sell-device-hero
  ) {
    padding-block: clamp(44px, 8vw, 68px) !important;
  }

  body.mg-v231-visual-hierarchy .hero-ad {
    min-height: auto !important;
  }

  body.mg-v231-visual-hierarchy .catalog-results-head-v231 {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }

  body.mg-v231-visual-hierarchy .catalog-results-head-v231 p:last-child {
    text-align: left;
  }

  body.mg-v231-visual-hierarchy .apple-store-section-head {
    align-items: flex-start !important;
  }
}

@media (max-width: 560px) {
  body.mg-v231-visual-hierarchy #main-content h1 {
    max-inline-size: 22ch;
    font-size: clamp(1.9rem, 9vw, 2.35rem) !important;
    letter-spacing: -.034em !important;
  }

  body.mg-v231-visual-hierarchy #main-content h2 {
    font-size: clamp(1.34rem, 6.7vw, 1.72rem) !important;
  }

  body.mg-v231-visual-hierarchy .section.pad,
  body.mg-v231-visual-hierarchy .support-section,
  body.mg-v231-visual-hierarchy .repair-section,
  body.mg-v231-visual-hierarchy .apple-store-section {
    padding-block: 48px !important;
  }

  body.mg-v231-visual-hierarchy :where(
    .section-heading,
    .support-section-head,
    .repair-section-head,
    .catalog-results-head-v231
  ) {
    margin-block-end: 20px !important;
  }

  body.mg-v231-visual-hierarchy #storeGrid .product-card-body h3 {
    min-block-size: 2.56em;
    font-size: .92rem !important;
  }

  body.mg-v231-visual-hierarchy #storeGrid .price-cta {
    font-size: .79rem !important;
  }

  body.mg-v231-visual-hierarchy.page-product .product-config-card,
  body.mg-v231-visual-hierarchy.page-product .purchase-summary-card,
  body.mg-v231-visual-hierarchy.page-product .product-family-specs-card {
    padding: 17px !important;
  }

  body.mg-v231-visual-hierarchy.page-product .warehouse-status-strip,
  body.mg-v231-visual-hierarchy.page-product .warehouse-quick-promises,
  body.mg-v231-visual-hierarchy.page-product .warehouse-media-checks {
    gap: 6px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.mg-v231-visual-hierarchy :where(
    .card,
    .service-card,
    .support-card,
    .support-help-card,
    .repair-type-card,
    .product-card,
    .product-card-v39,
    .accessory-card
  ) {
    transition: none !important;
  }
}

/* Visible option steps number themselves so hidden conditional steps never create duplicate numbers. */
body.mg-v231-visual-hierarchy.page-product .selection-stack {
  counter-reset: mg231-product-step;
}

body.mg-v231-visual-hierarchy.page-product .selection-step {
  counter-increment: mg231-product-step;
}

body.mg-v231-visual-hierarchy.page-product .selection-step > h3::before {
  content: counter(mg231-product-step) ". ";
  color: var(--orange, #fc6501);
  font-weight: 800;
}

/* Preserve the approved desktop visual columns after correcting source heading order. */
@media (min-width: 981px) {
  body.mg-v231-visual-hierarchy.page-product .product-detail-grid.product-detail-grid-v39 > .product-left-rail-v200 {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  body.mg-v231-visual-hierarchy.page-product .product-detail-grid.product-detail-grid-v39 > .product-right-rail-v200 {
    grid-column: 2 / -1 !important;
    grid-row: 1 !important;
  }
}


/*
 * Miller Gadgets v1.237 — consolidated visual source of truth
 * Typography, colour, spacing, radius, elevation, icon rail, hero composition,
 * condition badges and product-media disclosure live here.
 */

:root,
html[data-theme] {
  --mg-font-body: "Manrope", "Noto Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
  --mg-font-display: "Sora", "Manrope", "Noto Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;

  --mg-type-display: clamp(2.25rem, 1.93rem + 1.58vw, 3.5rem) !important;
  --mg-type-h1: clamp(2rem, 1.72rem + 1.38vw, 3rem) !important;
  --mg-type-h2: clamp(1.75rem, 1.51rem + 1.18vw, 2.5rem) !important;
  --mg-type-h3: clamp(1.0625rem, 1.02rem + .2vw, 1.1875rem) !important;
  --mg-type-price: clamp(1.1875rem, 1.145rem + .2vw, 1.3125rem) !important;
  --mg-type-body: clamp(.9375rem, .916rem + .1vw, 1rem) !important;
  --mg-type-meta: clamp(.8125rem, .79rem + .1vw, .875rem) !important;
  --mg-type-eyebrow: clamp(.71875rem, .697rem + .1vw, .78125rem) !important;

  --mg-space-1: 4px !important;
  --mg-space-2: 8px !important;
  --mg-space-3: 12px !important;
  --mg-space-4: 16px !important;
  --mg-space-5: 24px !important;
  --mg-space-6: 32px !important;
  --mg-space-7: 48px !important;
  --mg-space-8: 64px !important;
  --mg-space-9: 96px !important;
  --mg-page-max: 1500px !important;
  --mg-page-pad: clamp(16px, 3vw, 40px) !important;
  --mg-section-y: clamp(48px, 6.5vw, 96px) !important;
  --mg-section-y-tight: clamp(32px, 4.2vw, 64px) !important;
  --mg-grid-gap: clamp(16px, 1.8vw, 24px) !important;
  --mg-card-pad: clamp(16px, 2vw, 24px) !important;

  --mg-radius-control: 12px !important;
  --mg-radius-card: 20px !important;
  --mg-radius-pill: 999px !important;
  --mg-card-radius: var(--mg-radius-card) !important;
  --mg-card-radius-sm: var(--mg-radius-control) !important;
  --mg-shadow-hover: 0 18px 48px rgba(0,0,0,.10) !important;

  --bg: #FFFFFF !important;
  --surface: #FBFAFC !important;
  --surface-soft: #F5F2F7 !important;
  --card: #FBFAFC !important;
  --text: #1A1A1A !important;
  --muted: #55505F !important;
  --line: #E6E1E9 !important;
  --brand-orange: #FC6501 !important;
  --orange: #C94A00 !important;
  --action: #C94A00 !important;
  --action-hover: #AD3F00 !important;
  --action-text: #FFFFFF !important;
  --purple: #7C5CFF !important;
  --shadow: none !important;

  --badge-new-bg: #E7F7ED !important;
  --badge-new-text: #176B3A !important;
  --badge-new-line: #BFE8CE !important;
  --badge-used-bg: #FFF3DD !important;
  --badge-used-text: #754300 !important;
  --badge-used-line: #F0D19B !important;
  --badge-mixed-bg: #EEE9FF !important;
  --badge-mixed-text: #4B348E !important;
  --badge-mixed-line: #D7CCFF !important;
}

html[data-theme="dark"] {
  --bg: #1A1A1A !important;
  --surface: #222222 !important;
  --surface-soft: #282828 !important;
  --card: #222222 !important;
  --text: #F7F4FF !important;
  --muted: #C5BED3 !important;
  --line: #444444 !important;
  --brand-orange: #E08A4F !important;
  --orange: #E08A4F !important;
  --action: #E08A4F !important;
  --action-hover: #F09A5F !important;
  --action-text: #1A1A1A !important;
  --purple: #8F79FF !important;
  --shadow: none !important;
  --mg-shadow-hover: 0 18px 48px rgba(0,0,0,.38) !important;

  --badge-new-bg: rgba(43, 132, 78, .24) !important;
  --badge-new-text: #B8F1CC !important;
  --badge-new-line: rgba(111, 213, 148, .42) !important;
  --badge-used-bg: rgba(162, 99, 21, .24) !important;
  --badge-used-text: #FFD29B !important;
  --badge-used-line: rgba(236, 172, 83, .45) !important;
  --badge-mixed-bg: rgba(124, 92, 255, .22) !important;
  --badge-mixed-text: #D8D0FF !important;
  --badge-mixed-line: rgba(154, 142, 207, .46) !important;
}

html { text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }
html[data-theme] body {
  font-family: var(--mg-font-body) !important;
  font-size: var(--mg-type-body) !important;
  font-weight: 400;
  line-height: 1.6 !important;
  letter-spacing: 0;
  background: var(--bg) !important;
  color: var(--text) !important;
  font-synthesis: none;
  font-kerning: normal;
  text-rendering: optimizeLegibility;
}
html[data-theme] :is(button,input,select,textarea) { font-family: var(--mg-font-body) !important; }
html[data-theme] :is(h1,h2,h3,h4,h5,h6,.headline) {
  font-family: var(--mg-font-display) !important;
  max-inline-size: 100%;
  overflow-wrap: break-word;
  text-wrap: balance;
}
html[data-theme] body :is(.hero h1,.hero-ad h1,.page-hero h1,.store-hero h1,.apple-store-hero h1,.mg-v170-hero-block h1) {
  font-size: var(--mg-type-display) !important;
  font-weight: 800 !important;
  line-height: 1.05 !important;
  letter-spacing: -.03em !important;
  color: var(--text) !important;
  -webkit-text-fill-color: var(--text) !important;
}
html[data-theme] body h1:not(.mg-search-title) {
  font-size: var(--mg-type-h1);
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -.025em;
}
html[data-theme] body h2 {
  font-size: var(--mg-type-h2) !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  letter-spacing: -.02em !important;
}
html[data-theme] body :is(h3,.product-card h3,.product-card-v39 h3,.accessory-card h3,.store-feature-card h3,.store-icon-card strong,.service-card h3) {
  font-size: var(--mg-type-h3) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: -.01em !important;
}
html[data-theme] body :is(p,li,dd,dt,.body-copy) {
  font-size: var(--mg-type-body);
  line-height: 1.6;
}
html[data-theme] body :is(.meta,.label,small,label,.field-hint,.card-note,.product-card p,.store-feature-card p,.store-icon-card span,.family-option-count,.mg-pagination-info) {
  font-size: var(--mg-type-meta) !important;
  font-weight: 600;
  line-height: 1.4 !important;
  letter-spacing: 0;
}
html[data-theme] body :is(.eyebrow,.kicker,.store-card-kicker,.product-kicker,.card-kicker,.tag,.badge,.pill) {
  font-size: var(--mg-type-eyebrow) !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  letter-spacing: .09em !important;
  text-transform: uppercase;
}
html[data-theme] body :is(.price,.price-cta,.product-price,.summary-price,.warehouse-price-inline,.store-feature-card > strong,.product-card strong[data-price],.product-card .card-price) {
  font-family: var(--mg-font-body) !important;
  font-size: var(--mg-type-price) !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  letter-spacing: -.01em !important;
  font-variant-numeric: tabular-nums lining-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
}

html[data-theme] body :is(.btn.orange,.primary-btn,.cta-button,.mg-promotion-cta,.mg-filter-sort-apply) {
  background: var(--action) !important;
  border-color: var(--action) !important;
  color: var(--action-text) !important;
  -webkit-text-fill-color: var(--action-text) !important;
}
html[data-theme] body :is(.btn.orange,.primary-btn,.cta-button,.mg-promotion-cta,.mg-filter-sort-apply):hover {
  background: var(--action-hover) !important;
  border-color: var(--action-hover) !important;
}
html[data-theme] body :is(.eyebrow,.kicker,.product-kicker,.card-kicker,.price,.orange-text) {
  color: var(--orange) !important;
  -webkit-text-fill-color: var(--orange) !important;
}

/* condition badges — explicit in both themes */
html[data-theme] :is(.tag,.badge,.store-card-kicker,.product-kicker,.card-kicker)[data-condition-kind="new"] {
  background: var(--badge-new-bg) !important; color: var(--badge-new-text) !important;
  -webkit-text-fill-color: var(--badge-new-text) !important; border: 1px solid var(--badge-new-line) !important;
}
html[data-theme] :is(.tag,.badge,.store-card-kicker,.product-kicker,.card-kicker)[data-condition-kind="preowned"] {
  background: var(--badge-used-bg) !important; color: var(--badge-used-text) !important;
  -webkit-text-fill-color: var(--badge-used-text) !important; border: 1px solid var(--badge-used-line) !important;
}
html[data-theme] :is(.tag,.badge,.store-card-kicker,.product-kicker,.card-kicker)[data-condition-kind="mixed"] {
  background: var(--badge-mixed-bg) !important; color: var(--badge-mixed-text) !important;
  -webkit-text-fill-color: var(--badge-mixed-text) !important; border: 1px solid var(--badge-mixed-line) !important;
}
html[data-theme] :is(.tag,.badge,.store-card-kicker,.product-kicker,.card-kicker)[data-condition-kind] {
  border-radius: var(--mg-radius-pill) !important; padding: 6px 10px !important; display: inline-flex; width: fit-content;
}

/* one spacing and radius scale */
html[data-theme] :is(.section,.hero-section,.page-hero,.store-hero,.catalogue-section,.apple-store-section,.product-detail-section,.trade-section,.sell-section,.repair-section,.support-section,.faq-section,.contact-section) {
  width: min(calc(100% - (var(--mg-page-pad) * 2)), var(--mg-page-max)) !important;
  margin-inline: auto !important;
  padding-block: calc(var(--mg-section-y) / 2) !important;
}
html[data-theme] main > section + section { margin-top: 0 !important; }
html[data-theme] :is(#storeGrid,.product-grid,.store-grid,.apple-store-row,.cards-grid,.card-grid,.service-grid,.support-grid,.faq-grid,.repair-grid,.ad-banner-grid) {
  gap: var(--mg-grid-gap) !important;
}
html[data-theme] :is(.product-card,.product-card-v39,.accessory-card,.store-feature-card,.store-icon-card,.service-card,.info-card,.trade-card,.support-card,.faq-card,.promo-card,.trust-box,.product-detail,.product-media-card,.product-family-specs-card) {
  border-radius: var(--mg-radius-card) !important;
  box-shadow: none !important;
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
}

/* canonical card padding */
html[data-theme] body :is(.product-card,.product-card-v39,.accessory-card,.store-feature-card,.store-icon-card,.service-card,.info-card,.trade-card,.support-card,.faq-card,.promo-card,.trust-box,.product-family-specs-card) {
  padding: var(--mg-card-pad) !important;
}
html[data-theme] :is(.product-card,.product-card-v39,.accessory-card,.store-feature-card,.store-icon-card,.service-card,.interactive-card) {
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}
@media (hover:hover) and (pointer:fine) {
  html[data-theme] :is(.product-card,.product-card-v39,.accessory-card,.store-feature-card,.store-icon-card,.service-card,.interactive-card):hover {
    transform: translateY(-4px) !important;
    box-shadow: var(--mg-shadow-hover) !important;
  }
}
html[data-theme] :is(.btn,.primary-btn,.secondary-btn,.cta-button,.price-cta,button,input,select,textarea,.option,.category-filter,.mg-page-btn) {
  border-radius: var(--mg-radius-control) !important;
}
html[data-theme] :is(.tag,.badge,.pill,.chip) { border-radius: var(--mg-radius-pill) !important; }

/* dark-mode photo mat keeps neutral product photography from floating on black */
html[data-theme="dark"] :is(.product-image-link,.store-feature-image,.product-media,.product-media-card,.mg-product-media-stage,.card img,.service-card img) {
  background: #F5F2F7 !important;
  border-radius: var(--mg-radius-card);
}
html[data-theme="dark"] :is(.product-image-link,.store-feature-image,.product-media,.mg-product-media-stage) { padding: 8px; }

/* Store hero: headline, strongest visual and help links in one frame */
.apple-store-hero.mg-store-hero-v237 {
  display: grid !important;
  grid-template-columns: minmax(0,1.05fr) minmax(320px,.95fr) !important;
  gap: clamp(24px,4vw,64px) !important;
  min-height: clamp(480px,58vw,680px);
  padding: clamp(24px,5vw,72px) !important;
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--mg-radius-card) !important;
  overflow: hidden;
  align-items: center;
}
.mg-store-hero-copy { display:flex; flex-direction:column; align-items:flex-start; gap:16px; position:relative; z-index:2; }
.mg-store-hero-copy > p { max-width: 58ch; margin:0; }
.mg-store-hero-actions { display:flex; flex-wrap:wrap; gap:12px; }
.mg-store-hero-help { margin-top:8px; padding:16px; border:1px solid var(--line); border-radius:12px; background:color-mix(in srgb,var(--surface) 88%,transparent); }
.mg-store-hero-help h2 { font-size:clamp(1rem,.96rem + .2vw,1.125rem) !important; margin:0 0 8px; }
.mg-store-hero-help-links { display:flex; flex-wrap:wrap; gap:12px; }
.mg-store-hero-visual { min-height:360px; align-self:stretch; display:grid; place-items:center; overflow:hidden; border-radius:20px; background:var(--surface-soft); }
.mg-store-hero-visual :is(img,video) { width:100%; height:100%; object-fit:cover; border-radius:20px; }


/* Store hero helper actions */
html[data-theme] body.mg-v170-ui #main-content .mg-store-hero-help-links .help-choosing-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  padding: 0 16px !important;
  border-radius: var(--mg-radius-control) !important;
  border: 1px solid var(--line) !important;
  background: var(--surface) !important;
  color: var(--text) !important;
  -webkit-text-fill-color: var(--text) !important;
  font-size: var(--mg-type-meta) !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
}
html[data-theme] body.mg-v170-ui #main-content .mg-store-hero-help-links .help-choosing-link:last-child {
  background: var(--action) !important;
  border-color: var(--action) !important;
  color: var(--action-text) !important;
  -webkit-text-fill-color: var(--action-text) !important;
}

/* Category rail: one hand-drawn, currentColor icon language */
.apple-category-rail { gap:var(--mg-grid-gap) !important; }
.store-icon-card { padding:var(--mg-card-pad) !important; }
.store-icon-image.mg-category-icon-v237 { width:56px !important; height:56px !important; padding:0 !important; display:grid; place-items:center; color:var(--text); background:var(--surface-soft) !important; border-radius:16px !important; }
.store-icon-image.mg-category-icon-v237 svg { width:48px; height:48px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.store-icon-card strong { display:block; margin-top:16px; }
.store-icon-card span { display:block; margin-top:6px; color:var(--muted); }

/* Hot deals is a real, backend-controlled product row */
.store-hot-deals-section { display:block !important; }
.store-hot-deals-section[hidden] { display:none !important; }
.store-hot-deals-section .apple-store-row { margin-top:24px; }
.hot-deal-card { position:relative; }
.hot-deal-card::before { content:"Hot deal"; position:absolute; top:14px; right:14px; z-index:3; padding:6px 10px; border-radius:999px; background:var(--action); color:var(--action-text); font-size:var(--mg-type-eyebrow); font-weight:800; letter-spacing:.09em; text-transform:uppercase; }

/* Product media disclosure no longer competes as a large CTA under the photo */
.product-media-card { position:relative; }
.product-photo-disclosure { position:absolute; z-index:4; left:16px; top:16px; max-width:calc(100% - 32px); display:inline-flex; align-items:center; gap:6px; padding:7px 10px; border-radius:999px; background:rgba(26,26,26,.82); color:#fff; font-size:12px; font-weight:700; line-height:1.3; backdrop-filter:blur(8px); }
html[data-theme="dark"] .product-photo-disclosure { background:rgba(247,244,255,.9); color:#1A1A1A; }
.summary-action-stack .product-photo-request-btn { order:3; font-size:var(--mg-type-meta) !important; min-height:40px !important; }

/* section rhythm */
.page-home main > section,.page-store main > section { margin-block:0 !important; }
.page-home main > section + section,.page-store main > section + section { padding-top:var(--mg-section-y-tight) !important; }

@media (max-width: 760px) {
  .apple-store-hero.mg-store-hero-v237 { grid-template-columns:1fr !important; min-height:auto; padding:24px 18px !important; }
  .mg-store-hero-visual { min-height:260px; order:-1; }
  .mg-store-hero-actions { width:100%; }
  .mg-store-hero-actions > * { flex:1 1 150px; }
  .product-photo-disclosure { left:10px; top:10px; max-width:calc(100% - 20px); font-size:11px; }
}

@media (prefers-reduced-motion: reduce) {
  html[data-theme] :is(.product-card,.product-card-v39,.accessory-card,.store-feature-card,.store-icon-card,.service-card,.interactive-card) { transition:none !important; }
  html[data-theme] :is(.product-card,.product-card-v39,.accessory-card,.store-feature-card,.store-icon-card,.service-card,.interactive-card):hover { transform:none !important; }
}

/* v1.237 authority pass — defeat legacy specificity without adding another stylesheet */
html[data-theme] body .mg-store-hero-help h2 {
  font-size: clamp(1rem, .96rem + .2vw, 1.125rem) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: -.01em !important;
  margin: 0 0 8px !important;
}
html[data-theme] body .store-hot-deals-section [data-hot-deals-grid] {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)) !important;
  grid-auto-flow: row !important;
  grid-auto-columns: initial !important;
  width: 100% !important;
  max-width: none !important;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  scroll-snap-type: none !important;
  transform: none !important;
  translate: none !important;
}
html[data-theme] body .store-hot-deals-section [data-hot-deals-grid] > .hot-deal-card {
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  scroll-snap-align: none !important;
}
html[data-theme] body .hot-deal-card::before { inset: 14px 14px auto auto !important; }
@media (max-width: 560px) {
  html[data-theme] body .store-hot-deals-section [data-hot-deals-grid] { grid-template-columns: 1fr !important; }
}

/* v1.237 final authority — one intended answer for type, spacing, radius and colour */
html[data-theme] body.mg-v170-ui {
  font-family: var(--mg-font-body) !important;
  font-size: var(--mg-type-body) !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  letter-spacing: 0 !important;
  background: var(--bg) !important;
  color: var(--text) !important;
}
html[data-theme] body.mg-v170-ui #main-content > section {
  box-sizing: border-box !important;
  width: min(calc(100% - (var(--mg-page-pad) * 2)), var(--mg-page-max)) !important;
  max-width: var(--mg-page-max) !important;
  margin-inline: auto !important;
  padding-block: calc(var(--mg-section-y) / 2) !important;
}
html[data-theme] body.mg-v170-ui #main-content > section:not(.mg-store-hero-v237) {
  padding-inline: 0 !important;
}
html[data-theme] body.mg-v170-ui #main-content > .mg-store-hero-v237 {
  padding: clamp(24px, 5vw, 72px) !important;
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--mg-radius-card) !important;
  box-shadow: none !important;
}
html[data-theme] body.mg-v170-ui #main-content .mg-store-hero-visual {
  background: var(--surface-soft) !important;
  border-radius: var(--mg-radius-card) !important;
}
html[data-theme] body.mg-v170-ui #main-content :is(p,li,dd,dt,.body-copy) {
  font-family: var(--mg-font-body) !important;
  font-size: var(--mg-type-body) !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  letter-spacing: 0 !important;
}
html[data-theme] body.mg-v170-ui #main-content :is(.hero,.hero-ad,.page-hero,.store-hero,.apple-store-hero,.mg-v170-hero-block,.mg-store-hero-v237) h1 {
  font-family: var(--mg-font-display) !important;
  font-size: var(--mg-type-display) !important;
  font-weight: 800 !important;
  line-height: 1.05 !important;
  letter-spacing: -.03em !important;
  color: var(--text) !important;
  -webkit-text-fill-color: var(--text) !important;
}
html[data-theme] body.mg-v170-ui #main-content h2 {
  font-family: var(--mg-font-display) !important;
  font-size: var(--mg-type-h2) !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  letter-spacing: -.02em !important;
  color: var(--text) !important;
  -webkit-text-fill-color: var(--text) !important;
}
html[data-theme] body.mg-v170-ui #main-content :is(h3,.product-card h3,.product-card-v39 h3,.accessory-card h3,.store-feature-card h3,.store-icon-card strong,.service-card h3) {
  font-family: var(--mg-font-display) !important;
  font-size: var(--mg-type-h3) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: -.01em !important;
  color: var(--text) !important;
  -webkit-text-fill-color: var(--text) !important;
}
html[data-theme] body.mg-v170-ui #main-content :is(.price,.price-cta,.product-price,.summary-price,.warehouse-price-inline,.store-feature-card > strong,.product-card strong[data-price],.product-card .card-price) {
  font-family: var(--mg-font-body) !important;
  font-size: var(--mg-type-price) !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  letter-spacing: -.01em !important;
  font-variant-numeric: tabular-nums lining-nums !important;
  font-feature-settings: "tnum" 1, "lnum" 1 !important;
  color: var(--text) !important;
  -webkit-text-fill-color: var(--text) !important;
}
html[data-theme] body.mg-v170-ui #main-content :is(.meta,.label,small,label,.field-hint,.card-note,.product-card p,.store-feature-card p,.store-icon-card span,.family-option-count,.mg-pagination-info) {
  font-family: var(--mg-font-body) !important;
  font-size: var(--mg-type-meta) !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  letter-spacing: 0 !important;
  color: var(--muted) !important;
}
html[data-theme] body.mg-v170-ui #main-content :is(.eyebrow,.kicker,.store-card-kicker,.product-kicker,.card-kicker,.tag,.badge,.pill) {
  font-family: var(--mg-font-body) !important;
  font-size: var(--mg-type-eyebrow) !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
}

html[data-theme] body.mg-v170-ui #main-content :is(.mg-store-hero-copy > p:not(.eyebrow),.apple-store-section-head p,.store-feature-card p,.store-icon-card span,.service-card p,.card-note,.meta,.field-hint) {
  color: var(--muted) !important;
}
html[data-theme] body.mg-v170-ui #main-content .mg-store-hero-help h2 {
  font-size: clamp(1rem, calc(.96rem + .2vw), 1.125rem) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: -.01em !important;
  margin: 0 0 8px !important;
}
html[data-theme] body.mg-v170-ui #main-content :is(.product-card,.product-card-v39,.accessory-card,.store-feature-card,.store-icon-card,.service-card,.info-card,.trade-card,.support-card,.faq-card,.promo-card,.trust-box,.product-detail,.product-media-card,.product-family-specs-card) {
  border-radius: var(--mg-radius-card) !important;
  box-shadow: none !important;
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
}
html[data-theme] body.mg-v170-ui #main-content :is(.store-feature-card,.store-icon-card,.service-card,.info-card,.trade-card,.support-card,.faq-card,.promo-card,.trust-box) {
  padding: var(--mg-card-pad) !important;
}
html[data-theme] body.mg-v170-ui :is(.btn,.primary-btn,.secondary-btn,.cta-button,.price-cta,button,input,select,textarea,.option,.category-filter,.mg-page-btn) {
  border-radius: var(--mg-radius-control) !important;
}
html[data-theme] body.mg-v170-ui #main-content :is(.tag,.badge,.pill,.chip,.store-card-kicker,.product-kicker,.card-kicker) {
  border-radius: var(--mg-radius-pill) !important;
}
html[data-theme] body.mg-v170-ui #main-content :is(.tag,.badge,.store-card-kicker,.product-kicker,.card-kicker)[data-condition-kind="new"] {
  background: var(--badge-new-bg) !important; color: var(--badge-new-text) !important; -webkit-text-fill-color: var(--badge-new-text) !important; border-color: var(--badge-new-line) !important;
}
html[data-theme] body.mg-v170-ui #main-content :is(.tag,.badge,.store-card-kicker,.product-kicker,.card-kicker)[data-condition-kind="preowned"] {
  background: var(--badge-used-bg) !important; color: var(--badge-used-text) !important; -webkit-text-fill-color: var(--badge-used-text) !important; border-color: var(--badge-used-line) !important;
}
html[data-theme] body.mg-v170-ui #main-content :is(.tag,.badge,.store-card-kicker,.product-kicker,.card-kicker)[data-condition-kind="mixed"] {
  background: var(--badge-mixed-bg) !important; color: var(--badge-mixed-text) !important; -webkit-text-fill-color: var(--badge-mixed-text) !important; border-color: var(--badge-mixed-line) !important;
}
html[data-theme] body.mg-v170-ui :is(.btn.orange,.primary-btn,.cta-button,.mg-promotion-cta,.mg-filter-sort-apply) {
  background: var(--action) !important;
  border-color: var(--action) !important;
  color: var(--action-text) !important;
  -webkit-text-fill-color: var(--action-text) !important;
}
@media (hover:hover) and (pointer:fine) {
  html[data-theme] body.mg-v170-ui #main-content :is(.product-card,.product-card-v39,.accessory-card,.store-feature-card,.store-icon-card,.service-card,.interactive-card):hover {
    transform: translateY(-4px) !important;
    box-shadow: var(--mg-shadow-hover) !important;
  }
}
html[data-theme] body.mg-v170-ui #main-content :is(.btn.orange,.primary-btn,.cta-button,.price-cta,.mg-promotion-cta,.mg-filter-sort-apply,.mg-page-btn.is-active,.category-filter.active,.category-filter.is-active,#checkoutBtn,#sendTradeBtn,#sellWhatsappBtn) {
  background: var(--action) !important;
  background-color: var(--action) !important;
  background-image: none !important;
  border-color: var(--action) !important;
  color: var(--action-text) !important;
  -webkit-text-fill-color: var(--action-text) !important;
}
html[data-theme] body.mg-v170-ui #main-content :is(.eyebrow,.kicker):not([data-condition-kind]) {
  color: var(--orange) !important;
  -webkit-text-fill-color: var(--orange) !important;
}
