/*
  ARTSHOP desktop storefront redesign.
  Clean desktop layer loaded after the legacy theme CSS.
  Mobile / Telegram Mini App keeps the legacy layout.
*/

@media (min-width: 1024px) {
  :root {
    --ds-bg: #f8f9fb;
    --ds-card: #ffffff;
    --ds-text: #111827;
    --ds-muted: #8b95a5;
    --ds-line: rgba(17, 24, 39, .08);
    --ds-line-strong: rgba(17, 24, 39, .12);
    --ds-accent: #ff304b;
    --ds-accent-soft: rgba(255, 48, 75, .10);
    --ds-accent-line: rgba(255, 48, 75, .22);
    --ds-success: #12a56b;
    --ds-success-soft: rgba(18, 165, 107, .10);
    --ds-warning: #d98716;
    --ds-warning-soft: rgba(217, 135, 22, .12);
    --ds-radius-xs: 8px;
    --ds-radius-sm: 10px;
    --ds-radius-md: 14px;
    --ds-radius-lg: 18px;
    --ds-radius-xl: 22px;
    --ds-shadow: 0 18px 48px rgba(15, 23, 42, .055);
    --ds-shadow-hover: 0 24px 70px rgba(15, 23, 42, .10);
    --desktop-shell: min(1460px, calc(100vw - 56px));
    --desktop-header-h: 62px;
  }

  html,
  body {
    min-width: 1024px;
    background: var(--ds-bg) !important;
    color: var(--ds-text) !important;
    font-family: "Manrope", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  }

  body::before {
    display: none !important;
  }

  .top,
  .bottomNav,
  .siteHeaderBanner,
  .desktopBenefits,
  html[data-theme-preset] .siteHeaderBanner,
  html[data-theme-preset] .desktopBenefits {
    display: none !important;
  }

  .view {
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .desktopStoreHeader {
    position: fixed !important;
    top: 14px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    z-index: 1000 !important;
    width: var(--desktop-shell) !important;
    max-width: var(--desktop-shell) !important;
    height: var(--desktop-header-h) !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    display: grid !important;
    grid-template-columns: 166px 116px minmax(260px, 1fr) 42px 42px 42px !important;
    align-items: center !important;
    gap: 10px !important;
    border: 1px solid var(--ds-line) !important;
    border-radius: var(--ds-radius-lg) !important;
    background: rgba(255, 255, 255, .94) !important;
    box-shadow: 0 14px 42px rgba(15, 23, 42, .06) !important;
    backdrop-filter: blur(18px) !important;
    -webkit-backdrop-filter: blur(18px) !important;
  }

  .desktopLogo {
    height: 44px !important;
    min-width: 0 !important;
    padding: 0 10px !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 8px !important;
    border: 0 !important;
    border-radius: var(--ds-radius-md) !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--ds-text) !important;
    font-size: 18px !important;
    font-weight: 950 !important;
    letter-spacing: -.035em !important;
  }

  .desktopLogoText {
    max-width: 142px !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
  }

  .desktopLogoImg {
    width: auto !important;
    max-width: 142px !important;
    max-height: 34px !important;
    object-fit: contain !important;
  }

  .desktopCatalogBtn {
    height: 42px !important;
    min-width: 0 !important;
    padding: 0 14px !important;
    border: 0 !important;
    border-radius: var(--ds-radius-md) !important;
    background: var(--ds-accent-soft) !important;
    color: var(--ds-accent) !important;
    box-shadow: none !important;
    font-size: 13px !important;
    font-weight: 900 !important;
  }

  .desktopCatalogBtn:hover,
  .desktopCatalogBtn.isOpen {
    background: var(--ds-accent) !important;
    color: #fff !important;
  }

  .desktopSearchBox {
    height: 42px !important;
    min-width: 0 !important;
    padding: 0 12px !important;
    border: 1px solid var(--ds-line) !important;
    border-radius: var(--ds-radius-md) !important;
    background: #f4f6f8 !important;
    box-shadow: none !important;
  }

  .desktopSearchBox:focus-within {
    border-color: var(--ds-accent-line) !important;
    background: #fff !important;
    box-shadow: 0 0 0 4px rgba(255, 48, 75, .08) !important;
  }

  #desktopSearchInput {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--ds-text) !important;
  }

  .desktopSearchIcon {
    color: var(--ds-muted) !important;
    font-size: 15px !important;
  }

  .desktopNavAction,
  .desktopIconAction {
    width: 42px !important;
    height: 42px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: var(--ds-radius-md) !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--ds-text) !important;
  }

  .desktopNavAction:hover,
  .desktopIconAction:hover {
    background: #f2f4f7 !important;
  }

  .desktopNavAction svg,
  .desktopIconAction svg {
    width: 22px !important;
    height: 22px !important;
    stroke-width: 2 !important;
  }

  .desktopIconAction.hasAccountAvatar .accountAvatar,
  #desktopAccountAvatar {
    width: 36px !important;
    height: 36px !important;
    border-radius: 10px !important;
  }

  .desktopCartBadge {
    top: 2px !important;
    right: 2px !important;
    min-width: 17px !important;
    height: 17px !important;
    border-radius: 999px !important;
    background: var(--ds-accent) !important;
    color: #fff !important;
    font-size: 10px !important;
    font-weight: 900 !important;
  }

  #viewCatalog,
  #viewFavorites,
  #viewNotifications,
  #viewPromos,
  #viewOrders,
  #viewCart,
  #viewProduct {
    width: var(--desktop-shell) !important;
    max-width: var(--desktop-shell) !important;
    margin: 0 auto !important;
    padding: 34px 0 86px !important;
  }

  #viewProduct {
    padding-top: calc(var(--desktop-header-h) + 44px) !important;
  }

  .section,
  .favoritesHero,
  .accountViewHero,
  .cartHero,
  .accountDeskMain > .section,
  .accountPromosPanel,
  .cartItemSection,
  .cartDesktopSummary,
  .orderSummaryCard,
  .orderItemCard,
  .orderCustomerCard {
    border: 1px solid var(--ds-line) !important;
    border-radius: var(--ds-radius-lg) !important;
    background: var(--ds-card) !important;
    box-shadow: var(--ds-shadow) !important;
  }

  .h1 {
    color: var(--ds-text) !important;
    font-size: 32px !important;
    line-height: 1.04 !important;
    font-weight: 950 !important;
    letter-spacing: -.055em !important;
  }

  .p,
  .smallMuted {
    color: var(--ds-muted) !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
  }

  #grid.grid,
  #viewCatalog > .grid,
  #gridFav.favoritesGrid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 18px !important;
  }

  #viewCatalog #grid.grid {
    padding-top: 2px !important;
  }

  .pCard {
    border: 1px solid var(--ds-line) !important;
    border-radius: var(--ds-radius-lg) !important;
    background: var(--ds-card) !important;
    box-shadow: 0 12px 34px rgba(15, 23, 42, .045) !important;
    overflow: hidden !important;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
  }

  .pCard:hover {
    transform: translateY(-2px) !important;
    border-color: var(--ds-line-strong) !important;
    box-shadow: 0 22px 58px rgba(15, 23, 42, .09) !important;
  }

  .pCardOff {
    opacity: .72 !important;
  }

  .pMedia {
    border-radius: 0 !important;
    background: #f2f3f5 !important;
  }

  .pMedia::after {
    display: none !important;
  }

  .pImg {
    width: 100% !important;
    aspect-ratio: 3 / 4 !important;
    object-fit: cover !important;
    background: #f2f3f5 !important;
  }

  .pCard:hover .pImg {
    transform: none !important;
    filter: none !important;
  }

  .pBody {
    min-height: 124px !important;
    padding: 14px 14px 16px !important;
    display: grid !important;
    align-content: start !important;
    gap: 12px !important;
  }

  .pTitle {
    min-height: 40px !important;
    color: var(--ds-text) !important;
    font-size: 14px !important;
    line-height: 1.34 !important;
    font-weight: 850 !important;
    letter-spacing: -.018em !important;
  }

  .pPrice {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: baseline !important;
    gap: 8px !important;
  }

  .nowPrice {
    color: var(--ds-text) !important;
    font-size: 17px !important;
    line-height: 1 !important;
    font-weight: 950 !important;
    letter-spacing: -.035em !important;
  }

  .oldPrice {
    color: #9ca3af !important;
    font-size: 13px !important;
    font-weight: 800 !important;
  }

  .favBtn {
    top: 12px !important;
    right: 12px !important;
    width: 34px !important;
    height: 34px !important;
    border: 1px solid rgba(255, 255, 255, .75) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, .78) !important;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .12) !important;
    color: var(--ds-accent) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
  }

  .favBtn svg {
    width: 18px !important;
    height: 18px !important;
  }

  .favBtn.favOn {
    background: var(--ds-accent) !important;
    color: #fff !important;
  }

  .discCorner,
  .pSold {
    top: 12px !important;
    left: 12px !important;
    padding: 6px 10px !important;
    border-radius: 999px !important;
    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 950 !important;
    letter-spacing: .015em !important;
  }

  .discCorner {
    background: var(--ds-accent) !important;
    color: #fff !important;
  }

  .pSold {
    background: rgba(17, 24, 39, .80) !important;
    color: #fff !important;
  }

  .accountDeskShell {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: 248px minmax(0, 1fr) !important;
    align-items: start !important;
    gap: 28px !important;
  }

  .accountDeskAside {
    position: sticky !important;
    top: calc(var(--desktop-header-h) + 34px) !important;
    padding: 18px !important;
    border: 1px solid var(--ds-line) !important;
    border-radius: var(--ds-radius-lg) !important;
    background: var(--ds-card) !important;
    box-shadow: var(--ds-shadow) !important;
  }

  .accountDeskAsideTitle {
    margin: 0 0 16px !important;
    color: var(--ds-text) !important;
    font-size: 18px !important;
    font-weight: 950 !important;
    letter-spacing: -.035em !important;
  }

  .accountDeskProfile,
  .accountDeskLogin {
    min-height: 72px !important;
    margin: 0 0 18px !important;
    padding: 12px !important;
    border: 1px solid var(--ds-line) !important;
    border-radius: var(--ds-radius-md) !important;
    background: #f7f8fa !important;
    box-shadow: none !important;
  }

  .accountDeskProfile .accountAvatar {
    width: 48px !important;
    height: 48px !important;
    border-radius: 10px !important;
  }

  .accountDeskProfile b,
  .accountDeskLogin b {
    color: var(--ds-text) !important;
    font-size: 14px !important;
    font-weight: 950 !important;
  }

  .accountDeskProfile span,
  .accountDeskLogin span {
    color: var(--ds-muted) !important;
    font-size: 12px !important;
  }

  .accountDeskNav {
    display: grid !important;
    gap: 8px !important;
  }

  .accountDeskNavItem {
    min-height: 56px !important;
    padding: 9px 10px !important;
    display: grid !important;
    grid-template-columns: 38px minmax(0, 1fr) !important;
    gap: 10px !important;
    align-items: center !important;
    border: 1px solid transparent !important;
    border-radius: var(--ds-radius-md) !important;
    background: transparent !important;
    color: var(--ds-text) !important;
  }

  .accountDeskNavItem:hover {
    background: #f7f8fa !important;
  }

  .accountDeskNavItem.active {
    border-color: var(--ds-accent-line) !important;
    background: var(--ds-accent-soft) !important;
    color: var(--ds-accent) !important;
  }

  .accountDeskNavIcon {
    width: 38px !important;
    height: 38px !important;
    border: 1px solid var(--ds-line) !important;
    border-radius: var(--ds-radius-sm) !important;
    background: #fff !important;
    color: currentColor !important;
    box-shadow: none !important;
  }

  .accountDeskNavIcon svg {
    width: 20px !important;
    height: 20px !important;
  }

  .accountDeskNavItem b {
    display: block !important;
    color: currentColor !important;
    font-size: 13px !important;
    line-height: 1.15 !important;
    font-weight: 950 !important;
  }

  .accountDeskNavItem em {
    display: block !important;
    margin-top: 3px !important;
    color: var(--ds-muted) !important;
    font-style: normal !important;
    font-size: 11px !important;
    line-height: 1.2 !important;
  }

  .accountDeskRecent {
    margin-top: 18px !important;
    padding-top: 16px !important;
    border-top: 1px solid var(--ds-line) !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .accountDeskRecentTitle {
    margin: 0 0 10px !important;
    color: var(--ds-text) !important;
    font-size: 13px !important;
    font-weight: 950 !important;
  }

  .accountDeskRecentList {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  .accountDeskRecentItem {
    border: 1px solid var(--ds-line) !important;
    border-radius: var(--ds-radius-sm) !important;
    background: #fff !important;
    overflow: hidden !important;
    box-shadow: none !important;
  }

  .accountDeskRecentItem img {
    width: 100% !important;
    aspect-ratio: 3 / 4 !important;
    object-fit: cover !important;
  }

  .accountDeskRecentItem span {
    display: none !important;
  }

  .accountDeskMain {
    min-width: 0 !important;
    display: grid !important;
    gap: 18px !important;
  }

  .accountDeskMain > .section:first-child,
  .accountDeskMain > .favoritesHero,
  .accountDeskMain > .accountViewHero {
    min-height: 92px !important;
    padding: 22px 28px !important;
    display: grid !important;
    align-content: center !important;
    border-radius: var(--ds-radius-lg) !important;
    background: var(--ds-card) !important;
    box-shadow: var(--ds-shadow) !important;
  }

  .accountDeskMain > .section:first-child .h1,
  .accountDeskMain > .favoritesHero .h1,
  .accountDeskMain > .accountViewHero .h1 {
    font-size: 30px !important;
  }

  .accountDeskMain #gridFav,
  .accountDeskMain .favoritesGrid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 20px !important;
  }

  body[data-view="notifications"] .accountDeskMain .orderNotif,
  body[data-view="notifications"] .accountDeskMain > .section:not(:first-child):not(:last-child),
  body[data-view="orders"] .accountDeskMain > .section[data-oid] {
    min-height: 88px !important;
    padding: 14px 18px !important;
    display: grid !important;
    grid-template-columns: 58px minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 14px !important;
    border: 1px solid var(--ds-line) !important;
    border-radius: var(--ds-radius-lg) !important;
    background: var(--ds-card) !important;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .04) !important;
  }

  body[data-view="notifications"] .accountDeskMain .orderNotif .thumbRow,
  body[data-view="orders"] .accountDeskMain > .section[data-oid] .thumbRow {
    grid-column: 1 !important;
    grid-row: 1 !important;
    margin: 0 !important;
  }

  body[data-view="notifications"] .accountDeskMain .orderNotif .thumb,
  body[data-view="orders"] .accountDeskMain > .section[data-oid] .thumb {
    width: 50px !important;
    height: 58px !important;
    border: 0 !important;
    border-radius: 10px !important;
    object-fit: cover !important;
  }

  body[data-view="notifications"] .accountDeskMain .orderNotif > div:first-child,
  body[data-view="orders"] .accountDeskMain > .section[data-oid] > div:first-child {
    grid-column: 2 !important;
    display: grid !important;
    gap: 4px !important;
  }

  body[data-view="notifications"] .accountDeskMain .orderNotif .h1,
  body[data-view="orders"] .accountDeskMain > .section[data-oid] .h1 {
    font-size: 16px !important;
    line-height: 1.2 !important;
    letter-spacing: -.025em !important;
  }

  body[data-view="notifications"] .accountDeskMain .orderNotif .smallMuted,
  body[data-view="orders"] .accountDeskMain > .section[data-oid] .smallMuted {
    color: var(--ds-muted) !important;
    font-size: 12px !important;
  }

  .statusPillFixed,
  .pillCount {
    border-radius: 999px !important;
    border: 0 !important;
    background: var(--ds-success-soft) !important;
    color: var(--ds-success) !important;
    font-size: 10px !important;
    font-weight: 950 !important;
    letter-spacing: .02em !important;
  }

  .accountPromosPanel {
    padding: 22px !important;
  }

  .accountPromosGrid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }

  .promoWalletCard {
    border: 1px solid var(--ds-line) !important;
    border-radius: var(--ds-radius-lg) !important;
    background: var(--ds-card) !important;
    box-shadow: none !important;
  }

  .promoWalletCard::before {
    display: none !important;
  }

  .promoWalletApply,
  .btnPrimary,
  #btnCheckout,
  #submitOrder {
    border: 0 !important;
    border-radius: var(--ds-radius-md) !important;
    background: var(--ds-accent) !important;
    color: #fff !important;
    box-shadow: none !important;
  }

  .btnSoft,
  .btnGhost {
    border: 0 !important;
    border-radius: var(--ds-radius-md) !important;
    background: #f1f3f6 !important;
    color: var(--ds-text) !important;
    box-shadow: none !important;
  }

  #accountOverlay.accountSheet {
    width: 520px !important;
    max-width: min(520px, calc(100vw - 48px)) !important;
    border: 1px solid var(--ds-line) !important;
    border-radius: 24px !important;
    background: rgba(255, 255, 255, .98) !important;
    box-shadow: 0 30px 90px rgba(15, 23, 42, .16) !important;
  }

  #accountOverlay .accountSheetResults {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  #accountOverlay .accountProfileCard,
  #accountOverlay .webTelegramLoginPanel,
  #accountOverlay #recentlyViewedContainer {
    grid-column: 1 / -1 !important;
  }

  #accountOverlay .searchResultItem,
  #accountOverlay .accountProfileCard,
  #accountOverlay .webTelegramLoginPanel {
    border-radius: var(--ds-radius-lg) !important;
  }

  .desktopCatalogMenu,
  .desktopSearchPanel {
    border: 1px solid var(--ds-line) !important;
    border-radius: 20px !important;
    background: rgba(255, 255, 255, .98) !important;
    box-shadow: 0 30px 90px rgba(15, 23, 42, .16) !important;
  }
}

.storefrontFooter{margin:48px auto 110px;padding:0 16px;color:#667085}.storefrontFooterInner{width:min(1500px,100%);margin:0 auto;padding:28px 32px;display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:24px;border-top:1px solid #e7e9ee}.storefrontFooterBrand{display:grid;gap:4px;color:#111827}.storefrontFooterBrand span,.storefrontFooterMeta{font-size:13px;color:#98a2b3}.storefrontFooter nav{display:flex;flex-wrap:wrap;gap:12px 22px}.storefrontFooter a{color:#667085;text-decoration:none;font-size:13px}.storefrontFooter a:hover{color:#ff334f}
@media(max-width:1023px){.storefrontFooter{margin:32px auto calc(96px + env(safe-area-inset-bottom));padding:0 14px}.storefrontFooterInner{padding:24px 6px;grid-template-columns:1fr;gap:14px}.storefrontFooter nav{display:grid}.storefrontFooterMeta{grid-row:3}}

/* Desktop polish v11: one radius system for navigation, catalog, cart and checkout. */
@media (min-width: 1024px) {
  .desktopStoreHeader {
    border-radius: 26px !important;
    background-clip: padding-box !important;
    border: 1px solid rgba(15, 23, 42, .07) !important;
    box-shadow: 0 16px 42px rgba(15, 23, 42, .08) !important;
  }

  .desktopCatalogMenu {
    border-radius: 24px !important;
    background-clip: padding-box !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  #viewCatalog .catalogLeadHeader,
  #viewCatalog .catalogCrumbs,
  .catalogLeadHeader,
  .catalogCrumbs {
    border-radius: 24px !important;
    overflow: hidden !important;
    background-clip: padding-box !important;
  }

  .accountDeskAside,
  .cartAccountShell > .accountDeskAside,
  #checkoutModal .checkoutDesktopAccount > .accountDeskAside {
    border-radius: 26px !important;
    overflow: hidden !important;
    background-clip: padding-box !important;
  }

  .desktopCartBtn { position: relative !important; }
  .desktopCartBadge {
    position: absolute !important;
    top: 7px !important;
    right: 7px !important;
    min-width: 19px !important;
    height: 19px !important;
    padding: 0 5px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 2px solid #fff !important;
    border-radius: 999px !important;
    background: #ff304b !important;
    color: #fff !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    z-index: 3 !important;
  }
  .desktopCartBadge.hidden { display: none !important; }

  .cartAccountMain {
    display: flex !important;
    flex-direction: column !important;
    gap: 28px !important;
  }
  .cartAccountMain > .cartHero { margin: 0 !important; }
  .cartAccountMain > .cartDeskGrid,
  .cartAccountMain > .cartList,
  .cartAccountMain > .cartEmpty { margin-top: 0 !important; }

  #checkoutModal .checkoutPageCard,
  #checkoutModal .checkoutPageHeader,
  #checkoutModal .checkoutPageSection,
  #checkoutModal .checkoutPageActions {
    border-radius: 24px !important;
    background-clip: padding-box !important;
  }
  #checkoutModal .checkoutPageCard { overflow: visible !important; }
  #checkoutModal .checkoutPageHeader,
  #checkoutModal .checkoutPageSection,
  #checkoutModal .checkoutPageActions {
    overflow: hidden !important;
  }
  #checkoutModal .checkoutChoices {
    gap: 12px !important;
  }
  #checkoutModal .checkoutChoiceWrap,
  #checkoutModal .checkoutChoice,
  #checkoutModal .checkoutFields.checkoutChoiceDetails,
  #checkoutModal .checkoutSummary,
  #checkoutModal .fInput,
  #checkoutModal .btn {
    border-radius: 16px !important;
    background-clip: padding-box !important;
  }
  #checkoutModal .checkoutChoiceWrap {
    overflow: hidden !important;
    border: 1px solid rgba(15, 23, 42, .08) !important;
  }
  #checkoutModal .checkoutChoiceWrap.isOpen {
    overflow: hidden !important;
  }
  #checkoutModal .checkoutChoice {
    width: 100% !important;
    border: 0 !important;
  }
  #checkoutModal .checkoutFields.checkoutChoiceDetails {
    margin: 0 12px 12px !important;
    width: calc(100% - 24px) !important;
    padding: 16px !important;
    overflow: visible !important;
  }
}

/* Unified desktop surfaces — final authority over legacy theme rules. */
@media (min-width: 1024px) {
  :root {
    --desktop-surface-radius: 24px;
    --desktop-inner-radius: 18px;
  }

  .desktopStoreHeader {
    border-radius: var(--desktop-surface-radius) !important;
    overflow: visible !important;
  }

  .accountDeskAside,
  .cartAccountShell > .accountDeskAside,
  #checkoutModal .checkoutDesktopAccount > .accountDeskAside {
    border-radius: var(--desktop-surface-radius) !important;
    overflow: hidden !important;
    background: #fff !important;
  }

  #viewProduct .desktopProductInfo,
  #viewProduct #descSection,
  #viewProduct #specsSection,
  #viewProduct #variantDescBox:not(:empty),
  #viewProduct #relatedSection,
  #viewProduct #feedbackBox {
    border: 1px solid var(--ds-line) !important;
    border-radius: var(--desktop-surface-radius) !important;
    background: #fff !important;
    box-shadow: var(--ds-shadow) !important;
    overflow: hidden !important;
  }

  #viewProduct .desktopProductInfo {
    padding: 26px 28px !important;
  }

  #viewProduct #descSection,
  #viewProduct #specsSection,
  #viewProduct #variantDescBox:not(:empty),
  #viewProduct #relatedSection,
  #viewProduct #feedbackBox {
    padding: 24px 26px !important;
  }

  #viewProduct .gWrap {
    border-radius: var(--desktop-surface-radius) !important;
    overflow: hidden !important;
  }

  #viewProduct .galleryThumb,
  #viewProduct #feedbackBox .segTabs {
    border-radius: var(--desktop-inner-radius) !important;
  }

  #viewProduct #feedbackBox .segBtn {
    border-radius: 14px !important;
  }

  .accountPromosPanel,
  .accountPromosGrid,
  .accountDeskMain > .section,
  .accountDeskMain > .accountOrderCard,
  .accountDeskMain > .orderNotif,
  .cartItemSection,
  .cartDesktopSummary,
  #checkoutModal .checkoutPageCard,
  #checkoutModal .checkoutPageSection,
  #checkoutModal .checkoutPageFooter {
    border-radius: var(--desktop-surface-radius) !important;
    overflow: hidden !important;
  }
}

/* Desktop account cards v8: bounded media rows and one rounded visual language. */
@media (min-width: 1024px) {
  .desktopStoreHeader { border-radius: 26px !important; border: 1px solid rgba(15,23,42,.07) !important; box-shadow: 0 16px 42px rgba(15,23,42,.08) !important; }
  .accountDeskAside { border-radius: 26px !important; overflow: hidden !important; border: 1px solid rgba(15,23,42,.07) !important; }
  .accountPromosPanel, .accountPromosGrid { border-radius: 24px !important; overflow: hidden !important; }
  .accountPromosPanel { padding: 28px !important; }
  .promoWalletCard { border-radius: 20px !important; }
  .promoCodeCopy { display:flex !important; align-items:center !important; gap:10px !important; margin-top:8px !important; padding:0 !important; border:0 !important; background:transparent !important; color:var(--ds-text) !important; cursor:pointer !important; text-align:left !important; }
  .promoCodeCopy b { font-size:22px !important; letter-spacing:.04em !important; }
  .promoCodeCopy small { padding:5px 8px !important; border-radius:8px !important; background:#f1f3f6 !important; color:var(--ds-muted) !important; font-size:10px !important; font-weight:700 !important; }
  .promoCodeCopy:hover small, .promoCodeCopy.isCopied small { background:var(--ds-accent-soft) !important; color:var(--ds-accent) !important; }

  body[data-view="orders"] .accountDeskMain > .accountOrderCard { display:grid !important; grid-template-columns:minmax(0,1fr) auto !important; grid-template-areas:"head head" "meta action" "thumbs action" !important; grid-template-rows:auto auto auto !important; gap:12px 20px !important; min-height:0 !important; padding:22px 24px !important; border-radius:22px !important; overflow:hidden !important; }
  .accountOrderHead { grid-area:head !important; display:flex !important; align-items:center !important; justify-content:space-between !important; gap:20px !important; min-width:0 !important; }
  .accountOrderHead .h1 { min-width:0 !important; font-size:18px !important; }
  .accountOrderDate { margin:0 !important; color:var(--ds-muted) !important; font-size:12px !important; white-space:nowrap !important; }
  .accountOrderMeta { grid-area:meta !important; display:flex !important; align-items:center !important; gap:16px !important; }
  .accountOrderStatus, .orderNotifFoot { margin:0 !important; }
  .accountOrderCard .statusPillFixed, .orderNotif .statusPillFixed { display:inline-block !important; padding:0 !important; border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; color:#0a9662 !important; font-size:11px !important; font-weight:800 !important; letter-spacing:.04em !important; }
  .accountOrderCard .accountOrderThumbs { grid-area:thumbs !important; }
  .accountOrderCard .thumbRow, .orderNotif .thumbRow { display:flex !important; align-items:center !important; gap:8px !important; width:100% !important; max-width:100% !important; min-width:0 !important; overflow:hidden !important; padding:0 !important; margin:0 !important; }
  .accountOrderCard .thumb, .orderNotif .thumb { flex:0 0 48px !important; width:48px !important; height:60px !important; object-fit:cover !important; border-radius:10px !important; }
  .accountOrderOpen { grid-area:action !important; align-self:end !important; justify-self:end !important; min-height:38px !important; padding:0 16px !important; border:0 !important; border-radius:12px !important; background:#f1f3f6 !important; color:var(--ds-text) !important; font-size:12px !important; font-weight:800 !important; }

  body[data-view="notifications"] .accountDeskMain > .orderNotif { display:block !important; min-height:0 !important; padding:22px 24px !important; border-radius:22px !important; overflow:hidden !important; }
  .orderNotifHead { display:flex !important; align-items:center !important; justify-content:space-between !important; gap:20px !important; min-width:0 !important; }
  .orderNotifTitleGroup { display:flex !important; align-items:center !important; gap:10px !important; min-width:0 !important; }
  .orderNotifDate { white-space:nowrap !important; }
  .orderNotifThumbs { margin-top:16px !important; }
  .orderNotifFoot { margin-top:12px !important; }
  .orderNotif .hist { margin-top:12px !important; }
}

/* Final desktop surface overrides — keep at EOF. */
@media (min-width: 1024px) {
  .desktopStoreHeader {
    border-radius: 26px !important;
    background-clip: padding-box !important;
    border: 1px solid rgba(15,23,42,.07) !important;
    box-shadow: 0 16px 42px rgba(15,23,42,.08) !important;
  }
  .desktopCatalogMenu {
    border-radius: 24px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    background-clip: padding-box !important;
  }
  #viewCatalog .catalogLeadHeader,
  #viewCatalog .catalogCrumbs,
  .catalogLeadHeader,
  .catalogCrumbs {
    border-radius: 24px !important;
    overflow: hidden !important;
    background-clip: padding-box !important;
  }
  .accountDeskAside,
  .cartAccountShell > .accountDeskAside,
  #checkoutModal .checkoutDesktopAccount > .accountDeskAside {
    border-radius: 26px !important;
    overflow: hidden !important;
    background-clip: padding-box !important;
  }
  .desktopCartBtn { position: relative !important; }
  .desktopCartBadge {
    position: absolute !important;
    top: 5px !important;
    right: 4px !important;
    min-width: 19px !important;
    height: 19px !important;
    padding: 0 5px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 2px solid #fff !important;
    border-radius: 999px !important;
    background: #ff304b !important;
    color: #fff !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    z-index: 3 !important;
  }
  .desktopCartBadge.hidden { display: none !important; }
  .cartAccountMain {
    display: flex !important;
    flex-direction: column !important;
    gap: 30px !important;
  }
  .cartAccountMain > .cartHero,
  .cartAccountMain > .cartDeskGrid,
  .cartAccountMain > .cartList,
  .cartAccountMain > .cartEmpty { margin-top: 0 !important; margin-bottom: 0 !important; }
  #checkoutModal .checkoutPageCard,
  #checkoutModal .checkoutPageHeader,
  #checkoutModal .checkoutPageSection,
  #checkoutModal .checkoutPageActions {
    border-radius: 24px !important;
    background-clip: padding-box !important;
  }
  #checkoutModal .checkoutPageCard { overflow: visible !important; }
  #checkoutModal .checkoutPageHeader,
  #checkoutModal .checkoutPageSection,
  #checkoutModal .checkoutPageActions { overflow: hidden !important; }
  #checkoutModal .checkoutChoices { gap: 12px !important; }
  #checkoutModal .checkoutChoiceWrap,
  #checkoutModal .checkoutChoice,
  #checkoutModal .checkoutFields.checkoutChoiceDetails,
  #checkoutModal .checkoutSummary,
  #checkoutModal .fInput,
  #checkoutModal .btn {
    border-radius: 16px !important;
    background-clip: padding-box !important;
  }
  #checkoutModal .checkoutChoiceWrap {
    overflow: hidden !important;
    border: 1px solid rgba(15,23,42,.08) !important;
  }
  #checkoutModal .checkoutChoice { width: 100% !important; border: 0 !important; }
  #checkoutModal .checkoutFields.checkoutChoiceDetails {
    box-sizing: border-box !important;
    width: calc(100% - 24px) !important;
    margin: 0 12px 12px !important;
    padding: 16px !important;
    overflow: visible !important;
  }
}

/* v10: keep the unified radii after every legacy compatibility rule. */
@media (min-width: 1024px) {
  .desktopStoreHeader,
  .accountDeskAside,
  .cartAccountShell > .accountDeskAside,
  #checkoutModal .checkoutDesktopAccount > .accountDeskAside {
    border-radius: 24px !important;
  }

  .accountDeskAside,
  .cartAccountShell > .accountDeskAside,
  #checkoutModal .checkoutDesktopAccount > .accountDeskAside {
    overflow: hidden !important;
  }

  #viewProduct .desktopProductInfo,
  #viewProduct #descSection,
  #viewProduct #specsSection,
  #viewProduct #variantDescBox:not(:empty),
  #viewProduct #relatedSection,
  #viewProduct #feedbackBox {
    border: 1px solid var(--ds-line) !important;
    border-radius: 24px !important;
    background: #fff !important;
    box-shadow: var(--ds-shadow) !important;
    overflow: hidden !important;
  }

  #viewProduct #descSection,
  #viewProduct #specsSection,
  #viewProduct #variantDescBox:not(:empty),
  #viewProduct #relatedSection,
  #viewProduct #feedbackBox {
    padding: 24px 26px !important;
  }

  #viewProduct .gWrap,
  .accountPromosPanel,
  .accountPromosGrid,
  .cartItemSection,
  .cartDesktopSummary,
  #checkoutModal .checkoutPageCard,
  #checkoutModal .checkoutPageSection,
  #checkoutModal .checkoutPageFooter {
    border-radius: 24px !important;
    overflow: hidden !important;
  }
}

/* Cart and checkout share the same desktop storefront shell. */
@media (min-width: 1024px) {
  .cartAccountShell {
    display: grid !important;
    grid-template-columns: 270px minmax(0, 1fr) !important;
    gap: 28px !important;
    align-items: start !important;
  }

  .cartAccountShell > .accountDeskAside {
    position: sticky !important;
    top: calc(var(--desktop-header-h) + 34px) !important;
  }

  .cartAccountMain {
    min-width: 0 !important;
  }

  .cartAccountMain > .cartHero {
    margin-top: 0 !important;
  }

  body.checkoutOpen .desktopStoreHeader {
    z-index: 100300 !important;
  }

  #checkoutModal.checkoutPageModal {
    z-index: 100100 !important;
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: 270px minmax(0, 1fr) !important;
    align-items: start !important;
    gap: 28px !important;
    width: 100% !important;
    height: 100dvh !important;
    padding: calc(var(--desktop-header-h) + 44px) max(28px, calc((100vw - 1460px) / 2)) 70px !important;
    background: var(--ds-bg) !important;
  }

  #checkoutModal .checkoutDesktopAccount {
    min-width: 0 !important;
  }

  #checkoutModal .checkoutDesktopAccount > .accountDeskAside {
    position: sticky !important;
    top: 0 !important;
  }

  #checkoutModal .checkoutPageCard {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
  }

  #checkoutModal .checkoutPageHeader {
    position: relative !important;
    top: auto !important;
    min-height: 76px !important;
    margin: 0 0 18px !important;
    padding: 12px 18px !important;
    border: 1px solid var(--ds-line) !important;
    border-radius: 24px !important;
    background: #fff !important;
    box-shadow: var(--ds-shadow) !important;
  }

  #checkoutModal .checkoutPageTitle {
    text-align: left !important;
    font-size: 28px !important;
  }

  #checkoutModal .checkoutPageIntro {
    margin: -8px 4px 18px 76px !important;
    text-align: left !important;
  }

  #checkoutModal .checkoutPageSection {
    padding: 24px !important;
    border: 1px solid var(--ds-line) !important;
    border-radius: 22px !important;
    background: #fff !important;
    box-shadow: var(--ds-shadow) !important;
  }

  #checkoutModal .checkoutPageActions {
    margin-top: 18px !important;
    padding: 22px !important;
    border: 1px solid var(--ds-line) !important;
    border-radius: 22px !important;
    background: #fff !important;
    box-shadow: var(--ds-shadow) !important;
  }

  #checkoutModal #cancelCheckout,
  #checkoutModal #closeCheckout {
    border-radius: 12px !important;
  }
}

/* Account workspace polish: stable shell, compact notifications and orders. */
@media (min-width: 1024px) {
  .desktopStoreHeader {
    border-radius: 22px !important;
  }

  .accountDeskAside {
    border-radius: 22px !important;
    overflow: hidden !important;
  }

  .accountDeskProfile,
  .accountDeskLogin,
  .accountDeskNavItem,
  .accountDeskRecentItem {
    border-radius: 14px !important;
  }

  body:not(.appReady) #viewFavorites,
  body:not(.appReady) #viewNotifications,
  body:not(.appReady) #viewPromos,
  body:not(.appReady) #viewOrders {
    visibility: hidden !important;
  }

  body[data-view="notifications"] .accountDeskMain > .looseNotif {
    min-height: 104px !important;
    padding: 18px 20px !important;
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 16px !important;
    border: 1px solid var(--ds-line) !important;
    border-radius: 18px !important;
    background: var(--ds-card) !important;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .04) !important;
  }

  body[data-view="notifications"] .accountDeskMain > .looseNotif.isUnread {
    border-color: var(--ds-accent-line) !important;
    background: linear-gradient(90deg, rgba(255, 48, 75, .045), #fff 24%) !important;
  }

  .looseNotifIcon {
    width: 48px !important;
    height: 48px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 14px !important;
    background: #f4f6f8 !important;
    color: var(--ds-accent) !important;
  }

  .looseNotifIcon svg {
    width: 22px !important;
    height: 22px !important;
  }

  .looseNotifContent {
    min-width: 0 !important;
  }

  .looseNotifTitle {
    color: var(--ds-text) !important;
    font-size: 16px !important;
    line-height: 1.3 !important;
    font-weight: 850 !important;
    overflow-wrap: anywhere !important;
  }

  .looseNotifBody {
    max-width: 820px !important;
    margin-top: 5px !important;
    color: var(--ds-muted) !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    overflow-wrap: anywhere !important;
  }

  .looseNotifDate {
    align-self: start !important;
    padding-top: 2px !important;
    color: var(--ds-muted) !important;
    font-size: 11px !important;
    line-height: 1.35 !important;
    white-space: nowrap !important;
  }

  body[data-view="notifications"] .accountDeskMain > .orderNotif {
    position: relative !important;
    min-height: 112px !important;
    padding: 18px 20px !important;
    grid-template-columns: 64px minmax(0, 1fr) auto !important;
    border-radius: 18px !important;
  }

  body[data-view="orders"] .accountDeskMain > .accountOrderCard {
    position: relative !important;
    min-height: 118px !important;
    padding: 18px 20px !important;
    display: grid !important;
    grid-template-columns: 68px minmax(0, 1fr) auto !important;
    grid-template-rows: auto auto !important;
    gap: 8px 16px !important;
    border-radius: 18px !important;
  }

  .accountOrderCard .thumbRow {
    grid-column: 1 !important;
    grid-row: 1 / 3 !important;
    align-self: center !important;
  }

  .accountOrderCard .thumb {
    width: 60px !important;
    height: 72px !important;
    border-radius: 12px !important;
  }

  .accountOrderLead {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: flex !important;
    align-items: baseline !important;
    gap: 14px !important;
  }

  .accountOrderLead .h1 {
    font-size: 17px !important;
  }

  .accountOrderTotal {
    color: var(--ds-text) !important;
    font-weight: 800 !important;
  }

  .accountOrderDate {
    grid-column: 2 !important;
    grid-row: 2 !important;
    margin: 0 !important;
    color: var(--ds-muted) !important;
    font-size: 12px !important;
  }

  .accountOrderStatus {
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    margin: 0 !important;
  }

  .accountOrderOpen {
    grid-column: 3 !important;
    grid-row: 2 !important;
    justify-self: end !important;
    align-self: end !important;
    min-height: 36px !important;
    padding: 0 14px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #f2f4f7 !important;
    color: var(--ds-text) !important;
    font: inherit !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    cursor: pointer !important;
  }

  .accountOrderCard:hover .accountOrderOpen {
    background: var(--ds-accent-soft) !important;
    color: var(--ds-accent) !important;
  }

  .accountDeskMain .btn,
  .accountDeskMain .btnSoft,
  .accountDeskMain .btnPrimary,
  .orderSummaryCard ~ .section .btn {
    border-radius: 14px !important;
  }

  .accountDeskMain > .section,
  .accountDeskMain .orderSummaryCard,
  .accountDeskMain .orderItemCard,
  .accountPromosPanel {
    border-radius: 18px !important;
  }
}

@media (min-width: 1280px) {
  #grid.grid,
  #viewCatalog > .grid {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }

  .accountDeskMain #gridFav,
  .accountDeskMain .favoritesGrid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (min-width: 1024px) and (max-width: 1279px) {
  :root {
    --desktop-shell: min(1180px, calc(100vw - 40px));
  }

  .desktopStoreHeader {
    grid-template-columns: 140px 112px minmax(220px, 1fr) 42px 42px 42px !important;
  }

  #grid.grid,
  #viewCatalog > .grid,
  #gridFav.favoritesGrid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .accountDeskShell {
    grid-template-columns: 232px minmax(0, 1fr) !important;
  }
}

/* Product desktop gallery polish + fixed top navigation.
   This block intentionally sits last: old Telegram/mobile-era styles are
   very specific, so the desktop storefront needs a clean final layer. */
@media (min-width: 1024px) {
  .desktopStoreHeader {
    position: fixed !important;
    top: 14px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    margin: 0 !important;
    z-index: 1000 !important;
  }

  #viewCatalog,
  #viewFavorites,
  #viewNotifications,
  #viewPromos,
  #viewOrders,
  #viewCart,
  #viewProduct {
    padding-top: calc(var(--desktop-header-h) + 44px) !important;
  }

  body[data-view="product"] main.view,
  body[data-view="product"] .view,
  #viewProduct {
    width: min(1280px, calc(100vw - 64px)) !important;
    max-width: min(1280px, calc(100vw - 64px)) !important;
  }

  #viewProduct .gallery {
    position: relative !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  #viewProduct .gWrap {
    position: relative !important;
    border-radius: 18px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    background: color-mix(in srgb, var(--bg) 72%, #fff) !important;
    scroll-behavior: smooth !important;
    cursor: zoom-in;
  }

  #viewProduct .gImg {
    height: min(760px, calc(100vh - var(--desktop-header-h) - 112px)) !important;
    min-height: 520px !important;
    object-fit: contain !important;
    background: color-mix(in srgb, var(--bg) 70%, #fff) !important;
  }

  #viewProduct .galleryThumbs {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 10px !important;
    margin-top: 14px !important;
    padding: 2px 0 4px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: none !important;
  }

  #viewProduct .galleryThumbsHidden {
    display: none !important;
  }

  #viewProduct .galleryThumbs::-webkit-scrollbar {
    display: none !important;
  }

  #viewProduct .galleryThumb {
    width: 74px !important;
    height: 92px !important;
    flex: 0 0 74px !important;
    border-radius: 10px !important;
    border: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    opacity: .72 !important;
    background: color-mix(in srgb, var(--bg) 78%, #fff) !important;
  }

  #viewProduct .galleryThumb.isActive {
    opacity: 1 !important;
    box-shadow: inset 0 0 0 2px var(--primary) !important;
  }

  #viewProduct .gNav {
    top: 50% !important;
    width: 46px !important;
    height: 46px !important;
    border-radius: 999px !important;
    transform: translateY(-50%) !important;
    background: rgba(255,255,255,.94) !important;
    color: var(--text) !important;
    border: 1px solid rgba(15,23,42,.08) !important;
    box-shadow: 0 10px 26px rgba(15,23,42,.12) !important;
    font-size: 38px !important;
    line-height: 38px !important;
    opacity: .98 !important;
  }

  #viewProduct .gPrev {
    left: 18px !important;
  }

  #viewProduct .gNext {
    right: 18px !important;
  }

  #viewProduct .gNav.hidden,
  #viewProduct .gNav.gNavAutoHidden {
    opacity: 0 !important;
    pointer-events: none !important;
  }

  body[data-view="product"] #favTopBtn {
    position: absolute !important;
    top: 22px !important;
    right: 22px !important;
    z-index: 6 !important;
    width: 48px !important;
    height: 48px !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.94) !important;
    color: #ff2f57 !important;
    border: 1px solid rgba(15,23,42,.08) !important;
    box-shadow: 0 14px 34px rgba(15,23,42,.16) !important;
  }

  #viewProduct #feedbackBox {
    width: 100% !important;
    max-width: none !important;
    margin: 28px 0 0 !important;
    border-radius: 16px !important;
  }

  #viewProduct #feedbackBox .segTabs {
    width: 100% !important;
    max-width: none !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
  }

  .desktopGalleryLightbox {
    position: fixed;
    inset: 0;
    z-index: 20000;
    display: grid;
    place-items: center;
    background: rgba(244, 246, 249, .88);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    padding: 56px 88px;
  }

  .desktopGalleryImage {
    max-width: min(1120px, 86vw);
    max-height: 86vh;
    object-fit: contain;
    border-radius: 16px;
    box-shadow: 0 30px 90px rgba(15, 23, 42, .16);
    background: #fff;
  }

  .desktopGalleryClose,
  .desktopGalleryArrow {
    position: fixed;
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 999px;
    background: rgba(255,255,255,.92);
    color: #111827;
    box-shadow: 0 18px 46px rgba(0,0,0,.22);
    cursor: pointer;
  }

  .desktopGalleryClose {
    top: 24px;
    right: 28px;
    font-size: 34px;
    line-height: 1;
  }

  .desktopGalleryArrow {
    top: 50%;
    transform: translateY(-50%);
    font-size: 46px;
    line-height: 1;
  }

  .desktopGalleryPrev {
    left: 28px;
  }

  .desktopGalleryNext {
    right: 28px;
  }

  .desktopGalleryCount {
    position: fixed;
    left: 50%;
    bottom: 26px;
    transform: translateX(-50%);
    padding: 8px 13px;
    border-radius: 999px;
    background: rgba(255,255,255,.88);
    color: #111827;
    font-weight: 800;
    font-size: 13px;
  }

  body.desktopGalleryOpen {
    overflow: hidden !important;
  }
}

/* Desktop storefront safety zone and unified product gallery controls. */
@media (min-width: 1024px) {
  :root {
    --desktop-safe-top: calc(14px + var(--desktop-header-h) + 30px);
  }

  html body {
    box-sizing: border-box !important;
    padding-top: var(--desktop-safe-top) !important;
  }

  html body main.view {
    box-sizing: border-box !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
  }

  .view > section,
  #viewCatalog,
  #viewFavorites,
  #viewNotifications,
  #viewPromos,
  #viewOrders,
  #viewCart,
  #viewProduct {
    padding-top: 0 !important;
    scroll-margin-top: var(--desktop-safe-top) !important;
  }

  .desktopStoreHeader {
    top: 14px !important;
    z-index: 12000 !important;
  }

  #viewProduct .pTopBar,
  #viewProduct #shareProductBtn {
    display: none !important;
  }

  #viewProduct .gallery,
  #viewProduct .gWrap {
    position: relative !important;
  }

  #viewProduct .gWrap {
    overflow-x: auto !important;
    overflow-y: hidden !important;
  }

  #viewProduct .gNav,
  .desktopGalleryArrow,
  .desktopGalleryClose {
    width: 48px !important;
    height: 48px !important;
    display: grid !important;
    place-items: center !important;
    padding: 0 0 4px !important;
    border: 1px solid rgba(15, 23, 42, .08) !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, .96) !important;
    color: #111827 !important;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .14) !important;
    font-family: Arial, sans-serif !important;
    font-size: 36px !important;
    line-height: 1 !important;
  }

  #viewProduct .gNav {
    position: absolute !important;
    top: 50% !important;
    bottom: auto !important;
    transform: translateY(-50%) !important;
    z-index: 8 !important;
  }

  #viewProduct .gPrev { left: 18px !important; }
  #viewProduct .gNext { right: 18px !important; }

  #viewProduct .galleryFavoriteBtn,
  body[data-view="product"] #favTopBtn.galleryFavoriteBtn {
    position: absolute !important;
    top: 18px !important;
    right: 18px !important;
    left: auto !important;
    bottom: auto !important;
    z-index: 9 !important;
    width: 48px !important;
    height: 48px !important;
    display: grid !important;
    place-items: center !important;
    padding: 0 !important;
    border: 1px solid rgba(15, 23, 42, .08) !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, .96) !important;
    color: #ff304b !important;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .14) !important;
  }

  #viewProduct .galleryFavoriteBtn svg {
    width: 23px !important;
    height: 23px !important;
  }

  #viewProduct .galleryThumbs {
    width: 100% !important;
    justify-content: center !important;
    padding-inline: 0 !important;
  }

  #viewProduct .galleryThumbsHidden,
  #viewProduct .galleryThumbs:has(.galleryThumb:only-child) {
    display: none !important;
  }

  .desktopGalleryArrow {
    top: 50% !important;
    transform: translateY(-50%) !important;
  }

  .desktopGalleryClose {
    padding-bottom: 2px !important;
    font-size: 30px !important;
  }

  #viewProduct #feedbackBox {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: none !important;
    margin: 26px 0 0 !important;
    padding: 22px !important;
  }

  #viewProduct #feedbackBox .segTabs {
    width: min(620px, 100%) !important;
    margin: 0 auto 18px !important;
  }
}

/* Keep the account v8 rules last so legacy desktop selectors cannot override them. */
@media (min-width: 1024px) {
  #viewProduct .desktopProductInfo,
  #viewProduct #descSection,
  #viewProduct #specsSection,
  #viewProduct #variantDescBox:not(:empty),
  #viewProduct #relatedSection,
  #viewProduct #feedbackBox {
    border: 1px solid var(--ds-line) !important;
    border-radius: 24px !important;
    background: #fff !important;
    box-shadow: var(--ds-shadow) !important;
    overflow: hidden !important;
  }
  #viewProduct #descSection,
  #viewProduct #specsSection,
  #viewProduct #variantDescBox:not(:empty),
  #viewProduct #relatedSection,
  #viewProduct #feedbackBox { padding:24px 26px !important; }
  #viewProduct .gWrap { border-radius:24px !important; overflow:hidden !important; }
  .desktopStoreHeader { border-radius:26px !important; }
  .accountDeskAside { border-radius:26px !important; overflow:hidden !important; }
  .accountPromosPanel, .accountPromosGrid { border-radius:24px !important; overflow:hidden !important; }
  body[data-view="orders"] .accountDeskMain > .accountOrderCard { display:grid !important; grid-template-columns:minmax(0,1fr) auto !important; grid-template-areas:"head head" "meta action" "thumbs action" !important; grid-template-rows:auto auto auto !important; gap:12px 20px !important; min-height:0 !important; padding:22px 24px !important; border-radius:22px !important; overflow:hidden !important; }
  .accountOrderHead { grid-area:head !important; display:flex !important; align-items:center !important; justify-content:space-between !important; gap:20px !important; min-width:0 !important; }
  .accountOrderHead .h1 { min-width:0 !important; font-size:18px !important; }
  .accountOrderDate { margin:0 !important; color:var(--ds-muted) !important; font-size:12px !important; white-space:nowrap !important; }
  .accountOrderMeta { grid-area:meta !important; display:flex !important; align-items:center !important; gap:16px !important; }
  .accountOrderCard .accountOrderThumbs { grid-area:thumbs !important; grid-column:auto !important; grid-row:auto !important; }
  .accountOrderCard .thumbRow, .orderNotif .thumbRow { display:flex !important; align-items:center !important; gap:8px !important; width:100% !important; max-width:100% !important; min-width:0 !important; overflow:hidden !important; padding:0 !important; margin:0 !important; }
  .accountOrderCard .thumb, .orderNotif .thumb { flex:0 0 48px !important; width:48px !important; height:60px !important; object-fit:cover !important; border-radius:10px !important; }
  .accountOrderStatus, .orderNotifFoot { margin:0 !important; }
  .accountOrderCard .statusPillFixed, .orderNotif .statusPillFixed { display:inline-block !important; padding:0 !important; border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; color:#0a9662 !important; font-size:11px !important; font-weight:800 !important; letter-spacing:.04em !important; }
  .accountOrderOpen { grid-area:action !important; grid-column:auto !important; grid-row:auto !important; align-self:end !important; justify-self:end !important; min-height:38px !important; padding:0 16px !important; border:0 !important; border-radius:12px !important; background:#f1f3f6 !important; color:var(--ds-text) !important; font-size:12px !important; font-weight:800 !important; }
  body[data-view="notifications"] .accountDeskMain > .orderNotif { display:block !important; min-height:0 !important; padding:22px 24px !important; border-radius:22px !important; overflow:hidden !important; }
  .orderNotifHead { display:flex !important; align-items:center !important; justify-content:space-between !important; gap:20px !important; min-width:0 !important; }
  .orderNotifTitleGroup { display:flex !important; align-items:center !important; gap:10px !important; min-width:0 !important; }
  .orderNotifDate { white-space:nowrap !important; }
  .orderNotifThumbs { margin-top:16px !important; grid-column:auto !important; grid-row:auto !important; }
  .orderNotifFoot { margin-top:12px !important; }
  .orderNotif .hist { margin-top:12px !important; }
}

/* Desktop polish v11 — actual final cascade layer. */
@media (min-width: 1024px) {
  .desktopStoreHeader { border-radius:26px !important; background-clip:padding-box !important; }
  .desktopCatalogMenu { border-radius:24px !important; overflow-x:hidden !important; overflow-y:auto !important; background-clip:padding-box !important; }
  #viewCatalog .catalogLeadHeader,
  #viewCatalog .catalogCrumbs,
  .catalogLeadHeader,
  .catalogCrumbs { border-radius:24px !important; overflow:hidden !important; background-clip:padding-box !important; }
  .accountDeskAside,
  .cartAccountShell > .accountDeskAside,
  #checkoutModal .checkoutDesktopAccount > .accountDeskAside { border-radius:26px !important; overflow:hidden !important; background-clip:padding-box !important; }
  .desktopCartBtn { position:relative !important; }
  .desktopCartBadge { position:absolute !important; top:5px !important; right:4px !important; min-width:19px !important; height:19px !important; padding:0 5px !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; border:2px solid #fff !important; border-radius:999px !important; background:#ff304b !important; color:#fff !important; font-size:10px !important; font-weight:800 !important; line-height:1 !important; z-index:3 !important; }
  .desktopCartBadge.hidden { display:none !important; }
  .cartAccountMain { display:flex !important; flex-direction:column !important; gap:30px !important; }
  .cartAccountMain > .cartHero,
  .cartAccountMain > .cartDeskGrid,
  .cartAccountMain > .cartList,
  .cartAccountMain > .cartEmpty { margin-top:0 !important; margin-bottom:0 !important; }
  #checkoutModal .checkoutPageHeader,
  #checkoutModal .checkoutPageSection,
  #checkoutModal .checkoutPageActions { border-radius:24px !important; overflow:hidden !important; background-clip:padding-box !important; }
  #checkoutModal .checkoutPageCard { border-radius:24px !important; overflow:visible !important; background-clip:padding-box !important; }
  #checkoutModal .checkoutChoices { gap:12px !important; }
  #checkoutModal .checkoutChoiceWrap,
  #checkoutModal .checkoutChoice,
  #checkoutModal .checkoutFields.checkoutChoiceDetails,
  #checkoutModal .checkoutSummary,
  #checkoutModal .fInput,
  #checkoutModal .btn { border-radius:16px !important; background-clip:padding-box !important; }
  #checkoutModal .checkoutChoiceWrap { overflow:hidden !important; border:1px solid rgba(15,23,42,.08) !important; }
  #checkoutModal .checkoutChoice { width:100% !important; border:0 !important; }
  #checkoutModal .checkoutFields.checkoutChoiceDetails { box-sizing:border-box !important; width:calc(100% - 24px) !important; margin:0 12px 12px !important; padding:16px !important; overflow:visible !important; }
}

/* Desktop polish v12 — visible surface radii and independent cart counter. */
@media (min-width: 1024px) {
  /* The catalog/search panels are children of the header, so the header itself
     cannot use overflow:hidden. A rounded visual surface keeps them functional. */
  .desktopStoreHeader {
    position: fixed !important;
    isolation: isolate !important;
    border: 0 !important;
    border-radius: 30px !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .desktopStoreHeader::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    border: 1px solid rgba(15, 23, 42, .07) !important;
    border-radius: 30px !important;
    background: rgba(255, 255, 255, .96) !important;
    box-shadow: 0 16px 42px rgba(15, 23, 42, .08) !important;
    backdrop-filter: blur(18px) !important;
    -webkit-backdrop-filter: blur(18px) !important;
  }

  .desktopCatalogMenu {
    border-radius: 28px !important;
    clip-path: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    background: #fff !important;
    box-shadow: 0 28px 80px rgba(15, 23, 42, .18) !important;
  }

  .accountDeskAside,
  .cartAccountShell > .accountDeskAside,
  #checkoutModal .checkoutDesktopAccount > .accountDeskAside {
    border: 0 !important;
    border-radius: 28px !important;
    clip-path: none !important;
    overflow: hidden !important;
    background: #fff !important;
    box-shadow: 0 18px 48px rgba(15, 23, 42, .08), inset 0 0 0 1px rgba(15,23,42,.08) !important;
  }

  .desktopStoreHeader > * { z-index: 1 !important; }

  .accountPromosPanel { border-radius:28px !important; overflow:hidden !important; }

  .accountPromosPanel {
    padding: 28px !important;
    border: 1px solid rgba(15, 23, 42, .07) !important;
    border-radius: 28px !important;
    clip-path: inset(0 round 28px) !important;
    overflow: hidden !important;
    background: #fff !important;
    box-shadow: 0 18px 48px rgba(15, 23, 42, .07) !important;
  }

  .accountPromosGrid {
    border-radius: 22px !important;
    clip-path: inset(0 round 22px) !important;
    overflow: hidden !important;
  }

  #desktopCartBtn.desktopCartAction { position: relative !important; overflow: visible !important; }
  #desktopCartCount.desktopCartBadge:not(.hidden) {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
}