:root {
      --sf-flat-surface: #0e1020;
      --sf-desktop-shell-max: 1400px;
      --sf-desktop-shell-gap: 16px;
      --sf-vivid-blue: #435fff;
      --sf-vivid-blue-soft: #5b72ff;
      --sf-vivid-cyan: #22d3ee;
      --sf-vivid-green: #24e987;
      --sf-vivid-orange: #ff9f3f;
      --sf-vivid-violet: #9b5cff;
    }

    html {
      background-color: var(--sf-flat-surface) !important;
      background-image: none !important;
    }

    body.storefront-body {
      background-color: var(--sf-flat-surface) !important;
      background-image:
        radial-gradient(900px 520px at 8% -8%, rgba(67, 95, 255, 0.24), transparent 58%),
        linear-gradient(180deg, #101326 0%, #0e1020 48%, #101326 100%) !important;
    }

    .storefront-main,
    .sf-footer,
    .sf-footer__intro,
    .sf-footer__top,
    .sf-footer__bottom {
      background-color: transparent !important;
      background-image: none !important;
    }

    html,
    body,
    body.storefront-body {
      margin: 0 !important;
      padding: 0 !important;
    }

    body.storefront-body > .sf-header {
      margin-top: 0 !important;
      top: 0 !important;
    }

    body.storefront-body > :first-child {
      margin-top: 0 !important;
      padding-top: 0 !important;
    }

    body.storefront-body > header.sf-header {
      margin: 0 !important;
      padding-top: 0 !important;
      inset-block-start: 0 !important;
      transform: none !important;
    }

    body.storefront-body {
      position: relative;
      isolation: isolate;
      --sf-header-radius: 4px;
      --sf-page-radius: var(--sf-header-radius);
      --sf-panel-radius: var(--sf-header-radius);
    }

    body.storefront-body > .sf-header,
    body.storefront-body > .storefront-main,
    body.storefront-body > .sf-footer {
      position: relative;
    }

    body.storefront-body > .site-global-backdrop {
      position: fixed !important;
      inset: 0 !important;
      margin: 0 !important;
      padding: 0 !important;
    }

    .storefront-main > :where(:not([data-storefront-isolated])) {
      background-color: transparent !important;
      background-image: none !important;
    }

    .storefront-main > :where(:not([data-storefront-isolated]))::before,
    .storefront-main > :where(:not([data-storefront-isolated]))::after {
      background-image: none !important;
    }

    .storefront-results__hero,
.storefront-results__card,
.storefront-results__empty,
.account-profile-card,
.account-banner-card,
.account-hero-card,
.account-stats-card,
.account-wallet-card,
.account-section-card {
      box-shadow: none !important;
    }

    .storefront-results__hero,
.storefront-results__card,
.storefront-results__empty,
.account-banner-card,
.account-hero-card,
.account-stats-card,
.account-wallet-card,
.account-section-card,
.cart-page__panel,
.cart-page__summary,
.blog-page__post-card,
.blog-article-page__panel,
.legal-page__panel {
      border-color: rgba(91, 114, 255, 0.18) !important;
      background-color: rgba(24, 28, 51, 0.96) !important;
    }

    .storefront-results__cta--buy,
.cart-page__checkout,
.account-primary-button,
.load-balance-submit {
      background: linear-gradient(135deg, var(--sf-vivid-green), #16c76e) !important;
      color: #ffffff !important;
      border-color: rgba(255, 255, 255, 0.16) !important;
    }

    .storefront-results__cta,
.blog-page__button,
.account-inline-button {
      background: linear-gradient(135deg, var(--sf-vivid-blue), var(--sf-vivid-blue-soft)) !important;
      color: #ffffff !important;
      border-color: rgba(255, 255, 255, 0.16) !important;
    }

    .sf-shell,
.storefront-results__shell,
.account-shell,
.account-layout,
.account-main,
.account-sidebar {
      background: transparent !important;
      border: 0 !important;
      box-shadow: none !important;
    }

    body.storefront-body::before,
    body.storefront-body::after,
    .storefront-main::before,
    .storefront-main::after {
      display: none !important;
      content: none !important;
    }

    /* Global responsive hardening */
    * {
      min-width: 0;
    }

    img,
    video,
    canvas,
    svg {
      max-width: 100%;
      height: auto;
    }

    iframe {
      max-width: 100%;
    }

    table {
      width: 100%;
      max-width: 100%;
      table-layout: auto;
    }

    .table-responsive,
    .storefront-main .table-wrap {
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
    }

    input,
    textarea,
    select,
    button {
      max-width: 100%;
    }

    .storefront-main {
      overflow-x: clip;
    }

    .storefront-main :where(h1, h2, h3, h4, h5, h6, p, li, td, th, a, span, strong, em) {
      overflow-wrap: anywhere;
      word-break: break-word;
    }

    .sf-mobile-dock {
      display: none;
    }

    @media (min-width: 1200px) {
      body.storefront-body {
        --sf-shell-gap: var(--sf-desktop-shell-gap);
      }

      .sf-shell,
.storefront-results__shell,
.account-shell,
.sf-footer__shell,
.sf-megamenu > .sf-shell {
        width: min(calc(100% - (var(--sf-desktop-shell-gap) * 2)), var(--sf-desktop-shell-max)) !important;
        max-width: var(--sf-desktop-shell-max) !important;
        margin-left: auto !important;
        margin-right: auto !important;
      }
    }

    @media (max-width: 1199.98px) {
      .sf-shell,
.storefront-results__shell,
.account-shell {
        width: min(100%, calc(100% - 20px)) !important;
      }
    }

    @media (max-width: 767.98px) {
      html,
      body {
        overflow-x: hidden !important;
      }

      body.storefront-body {
        --sf-header-radius: 4px;
        --sf-page-radius: var(--sf-header-radius);
        --sf-panel-radius: var(--sf-header-radius);
        padding-bottom: calc(74px + env(safe-area-inset-bottom, 0px)) !important;
      }

      .storefront-main {
        overflow-x: hidden !important;
      }

      .sf-mobile-dock {
        position: fixed !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100vw !important;
        max-width: 100vw !important;
        height: auto !important;
        min-height: 0 !important;
        box-sizing: border-box !important;
        z-index: 9999 !important;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        align-items: end;
        gap: 4px;
        padding: 8px 8px calc(8px + env(safe-area-inset-bottom, 0px));
        border-top: 1px solid rgba(255, 255, 255, 0.08);
        border-radius: 4px 4px 0 0;
        background: rgba(8, 10, 16, 0.92);
        box-shadow: 0 -10px 30px rgba(0, 0, 0, 0.28);
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
        transform: none !important;
        margin: 0 !important;
        overflow: visible !important;
        isolation: isolate;
      }

      body.storefront-body.sf-megamenu-mobile-open .sf-mobile-dock {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transform: translateY(16px) !important;
      }

      body.storefront-body.sf-megamenu-mobile-open {
        padding-bottom: 0 !important;
      }

      .sf-mobile-dock__item {
        box-sizing: border-box !important;
        min-width: 0;
        width: 100% !important;
        min-height: 54px;
        padding: 8px 6px;
        border-radius: var(--sf-header-radius);
        color: #f8fafc;
        text-decoration: none;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 5px;
        text-align: center;
        transition: background-color 0.2s ease, transform 0.2s ease;
      }

      button.sf-mobile-dock__item {
        border: 0;
        background: transparent;
        font: inherit;
        cursor: pointer;
        appearance: none;
        -webkit-appearance: none;
        min-width: 0 !important;
      }

      .sf-mobile-dock__item svg {
        width: 18px;
        height: 18px;
        flex-shrink: 0;
      }

      .sf-mobile-dock__item span {
        display: block;
        max-width: 100%;
        font-size: 10px;
        font-weight: 700;
        line-height: 1.15;
        letter-spacing: 0.01em;
        overflow-wrap: normal;
        word-break: normal;
      }

      .sf-mobile-dock__item--center {
        min-height: 60px;
        margin-top: -12px;
        background: linear-gradient(135deg, #1d4ed8, #2563eb);
        box-shadow: 0 14px 28px rgba(37, 99, 235, 0.34);
        position: relative;
        z-index: 1;
      }

      .sf-mobile-dock__item--active {
        background: transparent;
      }

      .sf-mobile-dock__item--center.sf-mobile-dock__item--active {
        background: linear-gradient(135deg, #2563eb, #3b82f6);
      }

      .sf-mobile-dock {
        gap: 7px !important;
        padding: 9px 10px calc(9px + env(safe-area-inset-bottom, 0px)) !important;
        border-top: 1px solid rgba(109, 128, 255, 0.24) !important;
        background:
          radial-gradient(360px 110px at 50% -46px, rgba(67, 95, 255, 0.22), transparent 72%),
          linear-gradient(180deg, rgba(17, 22, 43, 0.94) 0%, rgba(8, 11, 22, 0.98) 100%) !important;
        box-shadow:
          0 -18px 38px rgba(0, 0, 0, 0.34),
          inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
        backdrop-filter: blur(18px) saturate(1.18) !important;
        -webkit-backdrop-filter: blur(18px) saturate(1.18) !important;
      }

      .sf-mobile-dock::before {
        content: "";
        position: absolute;
        left: 10px;
        right: 10px;
        top: 6px;
        height: 1px;
        background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.18), transparent);
        pointer-events: none;
      }

      .sf-mobile-dock__item {
        min-height: 54px !important;
        padding: 7px 4px 6px !important;
        border: 1px solid transparent !important;
        color: #dce5ff !important;
        background: rgba(255, 255, 255, 0.025) !important;
        transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease !important;
      }

      .sf-mobile-dock__item svg {
        width: 20px !important;
        height: 20px !important;
        filter: drop-shadow(0 6px 10px rgba(0, 0, 0, 0.24));
      }

      .sf-mobile-dock__item span {
        color: inherit !important;
        font-size: 10.5px !important;
        font-weight: 800 !important;
        letter-spacing: 0 !important;
      }

      .sf-mobile-dock__item:active {
        transform: translateY(1px) !important;
      }

      .sf-mobile-dock__item--active {
        color: #ffffff !important;
        border-color: rgba(91, 114, 255, 0.28) !important;
        background: rgba(67, 95, 255, 0.16) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
      }

      .sf-mobile-dock__item--center {
        min-height: 62px !important;
        margin-top: -14px !important;
        border-color: rgba(255, 255, 255, 0.18) !important;
        background:
          radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.24), transparent 48%),
          linear-gradient(135deg, #24e987 0%, #16c76e 100%) !important;
        color: #06120c !important;
        box-shadow:
          0 16px 30px rgba(36, 233, 135, 0.28),
          inset 0 1px 0 rgba(255, 255, 255, 0.32) !important;
      }

      .sf-mobile-dock__item--center.sf-mobile-dock__item--active {
        background:
          radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.25), transparent 48%),
          linear-gradient(135deg, #24e987 0%, #18d978 100%) !important;
        color: #04100a !important;
      }

      @media (max-width: 374.98px) {
        .sf-mobile-dock {
          gap: 5px !important;
          padding-left: 7px !important;
          padding-right: 7px !important;
        }

        .sf-mobile-dock__item span {
          font-size: 9.5px !important;
        }
      }

      .storefront-main .table-responsive,
      .storefront-main .table-wrap,
      .storefront-main .storefront-table-scroll {
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
      }

      .sf-shell,
.storefront-results__shell,
.account-shell {
        width: min(100%, calc(100% - 20px)) !important;
      }

      .storefront-results,
.cart-page,
.blog-page,
.blog-article-page,
.legal-page {
        padding-left: 0 !important;
        padding-right: 0 !important;
      }

      .storefront-results__hero,
.storefront-results__grid,
.cart-page__shell,
.blog-page__layout,
.blog-article-page__layout,
.legal-page__layout {
        grid-template-columns: 1fr !important;
      }

      .account-layout,
      .account-page-grid,
      .account-form-grid,
      .account-membership-grid,
      .account-wallet-grid,
      .account-stat-grid,
      .account-achievements-grid,
      .account-orders-grid {
        grid-template-columns: 1fr !important;
      }

      .account-sidebar,
      .account-main,
      .account-section-card,
      .account-banner-card,
      .account-hero-card,
      .account-stats-card,
      .account-wallet-card,
      .account-profile-card,
      .account-nav {
        min-width: 0 !important;
      }

      .storefront-main .account-shell .account-sidebar {
        display: grid !important;
      }

      .storefront-main .account-shell {
        margin-top: 12px !important;
      }

      .storefront-main .account-shell .account-profile-card {
        min-height: 0 !important;
        padding: 10px 12px !important;
      }

      .storefront-main .account-shell .account-profile-head {
        align-items: center !important;
        flex-direction: row !important;
        margin-bottom: 0 !important;
      }

      .storefront-main .account-shell .account-profile-avatar {
        width: 48px !important;
        height: 48px !important;
      }

      .storefront-main .account-shell .account-menu-toggle {
        width: 38px !important;
        height: 38px !important;
        margin-left: auto !important;
        border: 0 !important;
        border-radius: var(--sf-header-radius) !important;
        background: rgba(255, 255, 255, 0.16) !important;
        color: #ffffff !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
      }

      .storefront-main .account-shell .account-menu-toggle svg {
        width: 22px !important;
        height: 22px !important;
        transition: transform .18s ease !important;
      }

      .storefront-main .account-shell .account-sidebar.is-menu-open .account-menu-toggle svg {
        transform: rotate(180deg) !important;
      }

      .storefront-main .account-shell .account-sidebar .account-quick-actions,
      .storefront-main .account-shell .account-sidebar .account-nav {
        display: none !important;
      }

      .storefront-main .account-shell .account-sidebar.is-menu-open .account-quick-actions {
        display: grid !important;
        margin-top: 12px !important;
      }

      .storefront-main .account-shell .account-sidebar.is-menu-open .account-nav {
        display: block !important;
        min-height: 0 !important;
      }

      .storefront-results__hero,
.storefront-results__card,
.cart-page__panel,
.cart-page__summary,
.blog-page__post-card,
.blog-page__sidebar-post,
.blog-article-page__panel,
.blog-article-page__side-card,
.legal-page__panel {
        padding: 14px !important;
      }

      .account-banner-card,
      .account-hero-card,
      .account-stats-card,
      .account-wallet-card,
      .account-section-card,
      .account-profile-card,
      .account-nav {
        padding-left: 14px !important;
        padding-right: 14px !important;
      }

      .storefront-results__hero,
.storefront-results__card,
.cart-page__panel,
.cart-page__summary,
.blog-page__post-card,
.blog-page__sidebar-post,
.blog-article-page__panel,
.blog-article-page__side-card {
        border-radius: var(--sf-header-radius) !important;
      }

      .blog-page__hero-copy,
.blog-page__posts,
.blog-page__sidebar,
.blog-page__sidebar-stack,
.blog-article-page__content {
        min-width: 0 !important;
      }

      .account-profile-head,
      .account-hero-user,
      .account-section-header,
      .account-player-modal__header,
      .account-wallet-head,
      .account-orders-head {
        align-items: stretch !important;
        flex-direction: column !important;
      }

      .account-profile-avatar,
      .account-hero-avatar {
        width: 84px !important;
        height: 84px !important;
      }

      .account-hero-badges,
      .account-quick-actions,
      .account-section-actions,
      .account-player-actions {
        width: 100% !important;
      }

      .account-quick-link,
      .account-section-actions .btn,
      .account-player-actions .btn,
      .account-form-submit,
      .account-primary-button,
      .account-secondary-button {
        width: 100% !important;
        min-width: 0 !important;
      }

      .account-nav-link {
        min-height: 40px !important;
      }

      .storefront-results__filters,
.allcats-tabs {
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
      }

      

      

      

      

      

      

      

      

      

      

      

      .cart-page__item-controls {
        display: grid !important;
        grid-template-columns: 1fr !important;
      }

      .cart-page__summary-link,
.blog-page__button {
        width: 100% !important;
      }

      .blog-page__button {
        justify-content: center !important;
      }

      .blog-page__hero {
        min-height: 240px !important;
        height: auto !important;
      }

      .blog-page__hero-copy {
        max-width: 100% !important;
        padding: 16px 16px 40px !important;
      }

      .blog-page__hero-panel,
      .blog-page__hero-copy h1,
      .blog-page__hero-copy p {
        max-width: 100% !important;
      }

      .blog-page__post-card,
      .blog-page__sidebar-post {
        grid-template-columns: 1fr !important;
      }

      .blog-page__post-thumb,
      .blog-page__post-fallback,
      .blog-page__sidebar-thumb,
      .blog-page__sidebar-fallback {
        width: 100% !important;
        max-width: 100% !important;
      }

      .cart-page__item {
        grid-template-columns: 1fr !important;
      }

      .cart-page__item-total {
        min-width: 0 !important;
        text-align: left !important;
      }

      .allcats-grid {
        grid-template-columns: 1fr !important;
      }

      .allcats-card {
        min-width: 0 !important;
      }

      .sf-userpanel,
      .sf-userbar__menu {
        width: min(calc(100vw - 20px), 360px) !important;
        max-width: calc(100vw - 20px) !important;
      }

      .sf-cart-preview__panel {
        width: min(calc(100vw - 20px), 420px) !important;
        max-width: calc(100vw - 20px) !important;
        top: auto !important;
        bottom: 10px !important;
        right: 10px !important;
        max-height: min(82vh, 720px) !important;
      }

      .storefront-home-vitrin__icons,
.storefront-home-vitrin__tabs,
.storefront-home-featured__tabs {
        scrollbar-width: none;
      }

      .storefront-home-vitrin__icons::-webkit-scrollbar,
.storefront-home-vitrin__tabs::-webkit-scrollbar,
.storefront-home-featured__tabs::-webkit-scrollbar {
        display: none;
      }

      

      

      

      .storefront-home-vitrin__topbar,
.storefront-home-showcase__grid {
        min-width: 0 !important;
      }

      .storefront-home-showcase__grid {
        grid-template-columns: 1fr !important;
      }

      .storefront-home-vitrin__topbar {
        gap: 12px !important;
      }

      .storefront-home-vitrin__block,
.storefront-home-showcase__card {
        padding: 14px !important;
      }

      .storefront-home-featured__tabs {
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
      }

      .storefront-home-vitrin__topbar {
        align-items: stretch !important;
      }

      .storefront-home-vitrin__icons {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 8px !important;
        overflow: visible !important;
        padding-bottom: 0 !important;
      }

      .storefront-home-vitrin__icon,
      .storefront-home-vitrin__icons > * {
        width: 100% !important;
        min-width: 0 !important;
      }

      .storefront-home-vitrin__cards,
      .storefront-home-showcase__cards {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
      }

      .storefront-home-featured__title,
      .storefront-home-featured h2,
      .storefront-home-featured .section-title {
        font-size: 18px !important;
        line-height: 1.15 !important;
      }

      .storefront-home-featured__tab {
        min-width: 0 !important;
        width: auto !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
        white-space: nowrap !important;
        flex: 0 0 auto !important;
      }

      .storefront-home-vitrin__card,
      .storefront-home-showcase__card {
        min-width: 0 !important;
      }

      

      

      

      

      

      

      

      

      

      

      

      

      

      

      

      

      

      

      

      .storefront-home-copypanel,
      .storefront-home-category-hub,
      .storefront-home-vitrin__topbar {
        min-width: 0 !important;
      }

      .sf-search-suggestions {
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
      }

      .sf-search-suggestions-list {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
      }
    }

    @media (max-width: 575.98px) {
      body.storefront-body {
        padding-bottom: calc(70px + env(safe-area-inset-bottom, 0px)) !important;
      }

      .sf-mobile-dock {
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        gap: 3px;
        padding: 7px 6px calc(7px + env(safe-area-inset-bottom, 0px));
        border-radius: 4px 4px 0 0;
      }

      .sf-mobile-dock__item {
        min-height: 50px;
        padding: 7px 4px;
      }

      .sf-mobile-dock__item span {
        font-size: 9px;
      }

      .sf-mobile-dock__item--center {
        min-height: 54px;
        margin-top: -10px;
      }

      .sf-userpanel,
      .sf-userbar__menu,
      .sf-cart-preview__panel {
        width: calc(100vw - 16px) !important;
        max-width: calc(100vw - 16px) !important;
      }

      .storefront-home-vitrin__block {
        padding: 12px !important;
      }

      .storefront-home-vitrin__cards,
      .storefront-home-showcase__cards {
        grid-template-columns: 1fr !important;
      }

      .storefront-home-vitrin__icons {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 6px !important;
      }

      .storefront-home-featured__title,
      .storefront-home-featured h2,
      .storefront-home-featured .section-title {
        font-size: 16px !important;
      }

      .account-banner-card,
.account-hero-card,
.account-stats-card,
.account-wallet-card,
.account-section-card,
.account-profile-card,
.account-nav {
        padding: 12px !important;
      }

      

      

      

      

      

      .sf-search-suggestions-list {
        grid-template-columns: 1fr !important;
      }

      

      

      
    }

    /* Global 4px corner standard: match header radius on mobile and desktop */
    :root,
    body.storefront-body {
      --sf-header-radius: 4px !important;
      --sf-page-radius: 4px !important;
      --sf-panel-radius: 4px !important;
      --sf-footer-radius: 4px !important;
      --cdkey-radius: 4px !important;
      --panel-radius: 4px !important;
      --vitrin-radius: 4px !important;
    }

    /* Self-contained content modules and the account panel own their corner styles. */
    body.storefront-body :where(*, *::before, *::after):not(:where([data-storefront-isolated], [data-storefront-isolated] *, .account-shell, .account-shell *)) {
      border-radius: 4px !important;
    }

    body.storefront-body :where(svg, svg *, path, circle, rect, line, polyline, polygon) {
      border-radius: 0 !important;
    }

    @media (max-width: 767.98px) {
      body.storefront-body--home .storefront-main {
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
      }

      body.storefront-body--home .storefront-results--home,
      body.storefront-body--home .storefront-results--home .storefront-results__shell,
      body.storefront-body--home .storefront-results--home .storefront-home-sections,
      body.storefront-body--home .storefront-results--home .storefront-home-copypanel,
      body.storefront-body--home .storefront-results--home .storefront-home-mobile-deals,
      body.storefront-body--home .storefront-results--home .storefront-home-mobile-deals__grid {
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
      }

      body.storefront-body--home .storefront-results--home .storefront-home-copypanel {
        margin-top: 0 !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
      }

      body.storefront-body--home .storefront-results--home .storefront-home-copypanel__inner {
        display: none !important;
      }

      body.storefront-body--home .sf-footer,
      body.storefront-body--home .sf-footer__shell,
      body.storefront-body--home .sf-footer-mobile {
        margin-top: 0 !important;
        padding-top: 0 !important;
      }

      body.storefront-body .sf-footer {
        margin-bottom: calc(-74px - env(safe-area-inset-bottom, 0px)) !important;
      }

      body.storefront-body .sf-footer-mobile {
        padding-bottom: calc(74px + env(safe-area-inset-bottom, 0px)) !important;
      }
    }

    /* Keep header top alignment without shifting layers */
    html,
    body,
    body.storefront-body,
    body.storefront-body > .sf-header,
    body.storefront-body > header.sf-header {
      margin-top: 0 !important;
      padding-top: 0 !important;
      transform: none !important;
    }