.sf-head   { z-index: 90 }
.sf-navbar { z-index: 70 }
.sf-head .sf-acct      { position: relative }
.sf-head .sf-acct.open { z-index: 31 }
.sf-head .sf-acct-menu { z-index: 30 }
.sf-head .nc-pop,
.sf-head .sf-suggest   { z-index: 32 }
.sf-navbar { position: relative }
.sf-navbar .sfnav-item.has-mega { position: static }
.sf-navbar .sfnav-item.mmx-item.has-mega > .sfmega.mmx,
.sf-navbar .sfnav-item.has-mega > .sfmega {
  position: absolute;
  top: 100%;
  inset-inline: auto;
  right: auto;
  left: 50%;
  margin: 0;
  min-width: 0;
  width: min(var(--mmx-w, 1180px), calc(100% - 24px));
  max-width: calc(100% - 24px);
  transform: translate3d(-50%, 10px, 0);
}
.sf-navbar .sfnav-item.mmx-item.has-mega:hover > .sfmega.mmx,
.sf-navbar .sfnav-item.mmx-item.has-mega.open > .sfmega.mmx,
.sf-navbar .sfnav-item.mmx-item.has-mega:focus-within > .sfmega.mmx,
.sf-navbar .sfnav-item.has-mega:hover > .sfmega,
.sf-navbar .sfnav-item.has-mega.open > .sfmega {
  transform: translate3d(-50%, 0, 0);
}
.sf-navbar .sfnav-item.has-mega > .sfmega { --mmx-shift: 0px }
@supports (overflow: clip) {
  html, body { overflow-x: clip }
}
@media (max-width: 1360px) {
  :root { --mmx-pad: 16px; --mmx-gap: 14px; --mmx-r: 16px }
  .mmx-in:not(.no-side) { grid-template-columns: minmax(0, 1fr) 216px }
  .mmx-in.is-rail .mmx-body { grid-template-columns: minmax(158px, 188px) minmax(0, 1fr) }
  .mmx-rail  { max-height: min(56vh, 420px); padding: 9px 8px }
  .mmx-panes { padding: 13px 14px; min-height: 186px; max-height: min(56vh, 420px) }
  .mmx-grid  { grid-template-columns: repeat(auto-fill, minmax(148px, 1fr)) }
  .mmx-in.is-grid .mmx-cols { max-height: min(58vh, 440px); gap: 14px 16px }
  .mmx-pick-img { width: 46px; height: 46px }
  .mmx-promo { min-height: 104px }
}
@media (max-width: 1180px) {
  .mmx-in.is-rail .mmx-body { grid-template-columns: minmax(142px, 168px) minmax(0, 1fr) }
  .mmx-rail  { max-height: min(52vh, 380px) }
  .mmx-panes { max-height: min(52vh, 380px); min-height: 168px }
  .mmx-in .mmx-side { padding-block: 14px }
}
@media (max-width: 1024px) {
  :root { --mmx-pad: 14px; --mmx-gap: 12px }
  .mmx-in.is-grid .mmx-cols { grid-template-columns: repeat(2, minmax(0, 1fr)) }
  .mmx-grid { grid-template-columns: repeat(auto-fill, minmax(136px, 1fr)) }
  .mmx-in:not(.no-side) { grid-template-columns: minmax(0, 1fr) }
}
:root {
  --sf-dock-gap: 10px;
  --sf-dock-b: calc(16px + env(safe-area-inset-bottom, 0px));
}
html body #nv-dock,
html body .lc-wrap, html body .lcf,
html body .rs-bar, html body .cb-bar,
html body .flashwrap, html body .sf-toast,
html body:has(.cb-bar) .rs-bar,
html body:has(.cb-bar) .flashwrap,
html body:has(.rs-bar) .flashwrap,
html body:has(.sf-stickybuy) .rs-bar,
html body:has(.sf-stickybuy.on) .rs-bar {
  bottom: calc(var(--sf-dock-b) + var(--sf-dock-y, 0px)) !important;
  top: auto !important;
}
html body #nv-dock .rs-bar,
html body #nv-dock .cb-bar,
html body #nv-dock > * {
  bottom: auto !important;
  top: auto !important;
}
html body.has-v9dock #nv-dock,
html body.has-v9dock .lc-wrap, html body.has-v9dock .lcf,
html body.has-v9dock .rs-bar, html body.has-v9dock .cb-bar,
html body.has-v9dock .flashwrap, html body.has-v9dock .sf-toast {
  bottom: calc(var(--sf-dock-b) + var(--sf-dock-y, 0px)) !important;
  top: auto !important;
}
html body.has-v9dock #nv-dock .rs-bar,
html body.has-v9dock #nv-dock .cb-bar,
html body.has-v9dock #nv-dock > * {
  bottom: auto !important;
  top: auto !important;
}
.cb-bar    { z-index: 96 }
.rs-bar    { z-index: 97 }
#nv-dock   { z-index: 97 }
.flashwrap { z-index: 98 }
@media (min-width: 901px) {
  .rs-bar, .cb-bar, .flashwrap {
    inset-inline-start: 16px;
    inset-inline-end: auto;
    left: auto;
    right: auto;
    margin-inline: 0;
    max-width: min(560px, calc(100vw - 150px));
  }
  #nv-dock       { --sf-dock-y: 0px }
  .rs-bar        { --sf-dock-y: 0px }
  .cb-bar        { --sf-dock-y: 74px }
  .flashwrap     { --sf-dock-y: calc(var(--nv-dock-h, 0px) + 10px) }
  .lc-wrap, .lcf { --sf-dock-y: 0px }
}
@media (max-width: 900px) {
  :root { --sf-dock-b: calc(var(--sf-bnav-h, 64px) + 10px + env(safe-area-inset-bottom, 0px)) }
  .lc-wrap, .lcf { --sf-dock-y: 0px }
  #nv-dock       { --sf-dock-y: calc(var(--nv-fab-h, 56px) + 10px) }
  .rs-bar        { --sf-dock-y: calc(var(--nv-fab-h, 56px) + 10px) }
  .cb-bar        { --sf-dock-y: calc(var(--nv-fab-h, 56px) + 88px) }
  .flashwrap     { --sf-dock-y: calc(var(--nv-fab-h, 56px) + var(--nv-dock-h, 0px) + 20px) }
  .rs-bar, .cb-bar, .flashwrap {
    inset-inline: 10px;
    left: auto;
    right: auto;
    width: auto;
    max-width: none;
    margin-inline: 0;
  }
}
@media (max-width: 600px) {
  .rs-bar {
    padding: 9px 11px;
    gap: 6px 8px;
    border-radius: 14px;
    font-size: calc(11px * var(--fz-base, 1));
  }
  .rs-bar b { font-size: calc(11.5px * var(--fz-base, 1)); line-height: 1.6 }
  .rs-bar > span:not(.rs-bar-dot) {
    flex: 1 1 100%;
    min-width: 0;
    font-size: calc(10.5px * var(--fz-small, 1));
    line-height: 1.7;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .rs-bar .rs-bar-act { margin-inline-start: auto }
  .rs-bar .rs-bar-act button,
  .rs-bar .rs-bar-link {
    padding: 5px 10px;
    border-radius: 10px;
    font-size: calc(10.5px * var(--fz-btn, 1));
    white-space: nowrap;
  }
  .cb-bar {
    padding: 9px 11px;
    gap: 9px;
    border-radius: 14px;
  }
  .cb-bar .cb-ic { font-size: 19px }
  .cb-bar b { font-size: calc(11.5px * var(--fz-base, 1)); line-height: 1.6 }
  .cb-bar span {
    font-size: calc(10.5px * var(--fz-base, 1));
    line-height: 1.7;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .cb-bar .cb-more { font-size: calc(10.5px * var(--fz-base, 1)) }
  .lc-wrap { inset-inline-end: 12px }
  .lc-wrap.lc-left { inset-inline-start: 12px }
  .lc-fab {
    width: 46px;
    height: 46px;
    padding: 0;
    border-radius: 50%;
    justify-content: center;
    gap: 0;
  }
  .lc-fab .lc-fab-txt { display: none }
  .lc-fab .lc-dot {
    position: absolute;
    inset-block-end: 3px;
    inset-inline-end: 3px;
    width: 8px;
    height: 8px;
  }
  .lc-badge { top: -4px; inset-inline-start: -4px; min-width: 18px; height: 18px; line-height: 18px }
  .flashwrap { max-width: none }
}
@media (max-width: 640px) {
  html:has(body.has-v9dock) {
    --sf-dock-b: calc(var(--sf-v9dock-h, 84px) + 10px + env(safe-area-inset-bottom, 0px));
  }
}
@media (max-width: 380px) {
  .rs-bar > span:not(.rs-bar-dot),
  .cb-bar span { -webkit-line-clamp: 1 }
}
@media (prefers-reduced-motion: reduce) {
  .lc-fab, .rs-bar, .cb-bar { transition: none !important }
}
@media (max-width: 900px) {
  html body:has(.sf-stickybuy.on) .cb-bar,
  html body.has-stickybuy .cb-bar { display: none !important }
}
@media print {
  #nv-dock, .lc-wrap, .lcf, .rs-bar, .cb-bar, .flashwrap, .sf-toast { display: none !important }
}
html .sf-ann .sf-ann-cta{color:#fff;text-decoration:none}
html .sf-ann .sf-ann-cta:hover,
html .sf-ann .sf-ann-cta:focus-visible{background:#fff;color:#111827;border-color:#fff;box-shadow:0 2px 10px rgba(0,0,0,.18)}
html[data-theme="dark"] .sf-ann .sf-ann-cta{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.26);color:#f8fafc}
html[data-theme="dark"] .sf-ann .sf-ann-cta:hover,
html[data-theme="dark"] .sf-ann .sf-ann-cta:focus-visible{background:#f8fafc;color:#0b1220;border-color:#f8fafc;box-shadow:0 2px 12px rgba(0,0,0,.42)}
html .sf-ann .sf-ann-cta:hover *,
html[data-theme="dark"] .sf-ann .sf-ann-cta:hover *{color:inherit}
