/* 已批准布局的生产接入层。只负责摆放现有真实控件，不定义业务数据。 */
:root {
  --shell-paper: #f7f8fb;
  --shell-ink: #182338;
  --shell-muted: #5b6d88;
  --shell-caption: #60708a;
  --shell-blue: #345be8;
  --shell-blue-deep: #2448cf;
  --shell-blue-soft: #eaf0ff;
  --shell-blue-line: #dce5ff;
  --shell-line: #e5e9f0;
  --sticky-search: 70px;
}

body { background: var(--shell-paper); color: var(--shell-ink); }
.rail { display: none !important; }
.hd { position: relative; background: #fff; backdrop-filter: none; box-shadow: none; }
.hd__in { max-width: 1440px; height: 80px; padding-left: 0; padding-right: 0; }
.logo__mark { background: var(--shell-blue); box-shadow: none; }
.logo__text i { color: var(--shell-caption); }
.nav { align-self: center; align-items: center; gap: 30px; margin-left: 42px; }
.nav__item {
  position: relative; z-index: 1; align-self: auto;
  min-height: 38px; padding: 0 14px; border-radius: 8px;
  color: var(--shell-caption); font-size: 14px; background: transparent;
}
.nav__item.is-active { color: var(--shell-blue-deep); background: var(--shell-blue-soft); }
.nav__item.is-active::after { display: none; }
.hd .search { display: none; }
.hd__actions { gap: 14px; margin-left: auto; }
#engagement-nav { padding: 0; }
.bj-nav__btn {
  width: 38px; height: 38px; border: 1px solid transparent; border-radius: 8px;
  background: transparent; color: var(--shell-caption);
}
.bj-nav__btn:hover { background: var(--shell-blue-soft); color: var(--shell-blue); border-color: transparent; }
.account__login {
  height: 38px; min-height: 38px; padding: 8px 15px; border-radius: 8px;
  border: 1px solid var(--shell-line); background: #fff; color: var(--shell-ink);
  box-shadow: none; font-size: 13px; font-weight: 600; line-height: 1.3;
  display: inline-flex; align-items: center; justify-content: center;
  white-space: nowrap; flex-shrink: 0;
}
.account__login:hover { background: var(--shell-blue-soft); border-color: var(--shell-blue-line); color: var(--shell-blue-deep); }
.account__me {
  height: 38px; max-width: 168px; border-radius: 8px; border-color: var(--shell-line);
  white-space: nowrap;
}
.account__nick {
  min-width: 0; overflow: hidden; text-overflow: ellipsis;
}
.seg button {
  display: inline-flex; align-items: center; justify-content: center;
  transition: background .16s, color .16s, box-shadow .16s;
}
.seg button:hover:not(.is-active) { color: var(--shell-ink); }
.quick-nav { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.hero {
  display: block; max-width: 1440px; min-height: 454px; margin: 30px auto 0; padding: 0;
  border: 1px solid #182746; border-radius: 20px; background: #0b1429; color: #fff;
}
[data-hero]:not([hidden]) { display: block !important; }
.hero__in {
  max-width: none; min-height: 452px; display: grid; grid-template-columns: 44% 56%;
  gap: 0; align-items: center;
}
.hero__text { min-width: 0; padding: 54px 0 54px 48px; }
.hero__badge {
  height: auto; margin: 0 0 22px; padding: 0; border: 0; background: transparent;
  color: #a3b7d8; box-shadow: none; font-size: 11px; letter-spacing: .14em;
}
.hero__badge::before {
  content: ""; width: 5px; height: 5px; margin-right: 10px; border-radius: 50%;
  display: inline-block; background: #7094ff; box-shadow: 0 0 12px #7094ff;
}
.hero__title { font-size: clamp(33px, 3.2vw, 48px); font-weight: 650; line-height: 1.4; }
.hero__title em {
  color: #8ba8ff; background: none; -webkit-text-fill-color: currentColor;
}
.hero__stats { display: flex; align-items: center; gap: 0; margin-top: 34px; max-width: 390px; }
.stat-card {
  flex: 1; min-width: 0; padding: 0 25px 0 0; border: 0; border-radius: 0;
  background: transparent; box-shadow: none;
}
.stat-card + .stat-card { padding-left: 25px; border-left: 1px solid #7896c129; }
.stat-card:hover { transform: none; box-shadow: none; }
.stat-card b { color: #e8efff; font-size: 29px; font-weight: 550; }
.stat-card span { color: #91a5ca; font-size: 11px; letter-spacing: .06em; }

/* 首屏环绕：交给 orbit.css / CategoryOrbit，不再用静态热销卡片硬摆。 */
.hot-entries { position: relative; min-width: 0; height: 440px; }
.hot-entries > .co-orbit { width: 100%; height: 100%; }

.desktop-search {
  position: relative; top: auto; z-index: 2; max-width: 968px; height: auto;
  margin: -27px auto 0; padding: 0 20px; border: 0; background: transparent;
}
.desktop-search .search {
  display: flex; max-width: none; width: 100%; height: 62px; margin: 0;
  padding: 7px 8px 7px 22px; border: 1px solid #dfe5f0; border-radius: 12px;
  background: #fff; box-shadow: 0 8px 26px #12244309;
}
.desktop-search .search input {
  height: 46px; padding: 0 130px 0 28px; border: 0; font-size: 15px; box-shadow: none;
}
.desktop-search .search__icon { left: 20px; }
/* 清空按钮和回车提示各留自己的位置；装饰提示不拦截鼠标。 */
.desktop-search .search__clear { right: 62px; width: 32px; height: 32px; font-size: 20px; }
.desktop-search .search__kbd { pointer-events: none; }
.desktop-search .search__submit { height: 44px; min-width: 94px; margin: 1px; border-radius: 8px; }
.desktop-search .search__submit.desktop-press {
  --press-face: var(--shell-blue); --press-base: var(--shell-blue-deep);
  --press-ink: #fff; --press-border: var(--shell-blue);
  background: var(--shell-blue-deep); border-color: var(--shell-blue);
  box-shadow: 0 3px 0 var(--shell-blue-deep), 0 4px 11px #345be817;
}

.cols { max-width: 1440px; padding-top: 30px; padding-left: 0; padding-right: 0; gap: 24px; overflow-anchor: none; }
.filters { width: 216px; margin: 0; display: flex; flex-direction: column; }
.production-rail {
  min-height: 0 !important; flex: 1;
  border: 0; background: transparent; box-shadow: none;
  display: flex; flex-direction: column; overflow: hidden;
}
.rail-brand-page {
  display: flex; flex-direction: column; flex: 1; min-height: 0;
}
.brand-links { display: grid; gap: 5px; min-height: 0; padding: 4px 8px 4px 2px; overflow-y: auto; overflow-x: hidden; }
.sidebar-label {
  display: flex; justify-content: space-between; margin: 2px 12px 12px;
  color: var(--shell-caption); font-size: 12px;
}
.brand-link {
  width: 100%; min-height: 58px; padding: 9px 11px; display: flex; align-items: center; gap: 10px;
  border: 1px solid transparent; border-radius: 10px; text-align: left;
  transform: scale(1);
  transform-origin: left center;
  transition: transform .28s cubic-bezier(.22, 1.15, .36, 1), background .2s, box-shadow .2s, border-color .2s;
}
.brand-link .brand-mark {
  transition: transform .28s cubic-bezier(.22, 1.15, .36, 1);
}
.brand-link:hover,
.brand-link:focus-visible {
  background: #eef1f8;
  transform: scale(1.045);
  z-index: 1;
}
.brand-link:hover .brand-mark,
.brand-link:focus-visible .brand-mark { transform: scale(1.12); }
.brand-link.is-active { background: #fff; border-color: #e4e9f2; box-shadow: inset 3px 0 var(--shell-blue); }
.brand-mark {
  width: 32px; height: 32px; flex: none; display: grid; place-items: center;
  border: 1px solid #e4e9f2; border-radius: 9px; background: #fff;
  color: #3a4964; font-size: 15px; font-weight: 650;
}
.brand-mark--logo { padding: 5px; overflow: hidden; }
.brand-mark--logo img { width: 100%; height: 100%; object-fit: contain; display: block; }
.brand-name { min-width: 0; color: var(--shell-ink); font-size: 13px; font-weight: 600; white-space: nowrap; }
.brand-name small:not(.chosen-plan) {
  display: block; margin-top: 2px; color: #939db0; font-size: 9px; font-weight: 400; letter-spacing: .02em;
}
.brand-mark .ic { width: 16px; height: 16px; }
.chosen-plan {
  display: block; max-width: 102px; margin-top: 2px; overflow: hidden; text-overflow: ellipsis;
  color: var(--shell-blue); font-size: 10px; font-weight: 500; white-space: nowrap;
}
.brand-link .count { display: none; }
.brand-caret { width: 13px; height: 13px; color: #9aa6ba; }
.rail-plan-page { display: none; min-height: 0; overflow: hidden; }
[data-rail-layer="plan"] .rail-brand-page { display: none; }
[data-rail-layer="plan"] .rail-plan-page {
  display: flex; flex-direction: column; flex: 1; min-height: 0; overflow: hidden;
}
@media (min-width: 1081px) and (prefers-reduced-motion: no-preference) {
  [data-rail-motion="open"] .plan-option {
    animation: rail-plan-item .4s cubic-bezier(0.05, 0.7, 0.1, 1) both;
    animation-delay: calc(var(--i, 0) * 48ms);
  }
  [data-rail-motion="back"] .rail-brand-page {
    animation: rail-page-in .4s cubic-bezier(0.05, 0.7, 0.1, 1) both;
  }
}
@media (prefers-reduced-motion: reduce) {
  .brand-link,
  .brand-link .brand-mark { transition: none; }
  .brand-link:hover,
  .brand-link:focus-visible { transform: none; }
  .brand-link:hover .brand-mark,
  .brand-link:focus-visible .brand-mark { transform: none; }
}
@keyframes rail-plan-item {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}
@keyframes rail-page-in {
  from { opacity: 0; transform: translateX(-10px); }
  to { opacity: 1; transform: none; }
}
.rail-back {
  width: 100%; min-height: 40px; margin-bottom: 10px; padding: 7px 9px;
  display: flex; align-items: center; gap: 7px; border: 1px solid #e4eaf4;
  border-radius: 8px; background: #f7f9fd; color: var(--shell-muted); text-align: left;
  flex: none;
}
.rail-plan-head { display: flex; align-items: center; gap: 10px; padding: 0 3px 12px; border-bottom: 1px solid #e9edf4; flex: none; }
.rail-plan-head strong { display: block; font-size: 14px; }
.rail-plan-head small { color: var(--shell-caption); font-size: 11px; }
.plan-panel { display: grid; gap: 3px; margin-top: 8px; flex: 1; min-height: 0; overflow: auto; }
.plan-option {
  width: 100%; min-height: 40px; padding: 7px 9px; display: flex; align-items: center; gap: 8px;
  border-radius: 8px; text-align: left; color: var(--shell-ink); font-size: 13px;
}
.plan-option:hover { background: var(--shell-blue-soft); }
.plan-option.is-active { background: var(--shell-blue-soft); color: var(--shell-blue-deep); box-shadow: inset 2px 0 var(--shell-blue); }
.plan-option small { margin-left: auto; color: var(--shell-caption); font-size: 11px; }
.rail-empty { padding: 14px 8px; color: var(--shell-caption); font-size: 12px; }
/* 窄屏档位和卖法排在一起，中间用一行小字分开（大屏是翻页，用不上）。 */
.rail-more { margin: 10px 2px 2px; color: var(--shell-caption); font-size: 11px; }
.production-rail > .stock-row { margin-top: 14px; padding: 12px 9px; border-top: 1px solid var(--shell-line); border-bottom: 0; }

.desktop-facets,
.active-chips { display: none !important; }
.sortbar {
  min-height: 48px; margin-bottom: 12px; padding: 6px 10px; border: 1px solid #e1e7f0;
  border-radius: 10px; background: #fff;
}
.sorts { gap: 3px; }
.sort-tab {
  min-height: 36px; padding: 8px 11px; border: 0; border-radius: 6px;
  color: var(--shell-muted); font-size: 13px;
}
.sort-tab.is-active { background: var(--shell-blue-soft); color: var(--shell-blue-deep); box-shadow: inset 0 -2px var(--shell-blue); }
.sortbar__count { margin-left: 12px; color: var(--shell-ink); font-size: 13px; }
.sortbar__count b { font-weight: 700; }
[data-desktop-stock] .switch input { width: 32px; height: 19px; }
[data-desktop-stock] .switch__track { width: 32px; height: 19px; background: var(--shell-caption); }
[data-desktop-stock] .switch__track::after { top: 2px; left: 2px; width: 13px; height: 13px; }
[data-desktop-stock] .switch input:checked + .switch__track { background: var(--shell-blue); }
[data-desktop-stock] .switch input:checked + .switch__track::after { transform: translateX(13px); }
.hd__fresh { display: none !important; }
.list { gap: 14px; }
.list.is-entering .product-card-face { opacity: 0; transition: none; }
/* 外层是点中区域，不跟着浮；浮的是里面那一层，鼠标贴边就不会抖。 */
.row.product-card {
  position: relative; z-index: 0;
  display: block; min-height: 0; padding: 0; border: 0; background: transparent; box-shadow: none; transform: none;
}
.row.product-card:hover,
.row.product-card:focus-within { z-index: 2; transform: none; }
.product-card-face {
  display: grid; grid-template-columns: 176px minmax(0, 1fr) 180px;
  grid-template-rows: auto; gap: 18px; min-height: 122px; padding: 18px 20px;
  border: 1px solid var(--shell-line); border-radius: 14px; background: #fff;
  transition: transform .28s cubic-bezier(0.05, 0.7, 0.1, 1), border-color .2s, box-shadow .2s;
}
.row.product-card.is-out .product-card-face { background: #f7f9fc; }
@media (hover: hover) and (pointer: fine) {
  .row.product-card:hover .product-card-face,
  .row.product-card:focus-within .product-card-face {
    transform: translateY(-3px); border-color: #98afe2; box-shadow: 0 12px 28px #243e7014;
  }
}
/* 价格直接占原识别图的位置，白底、不重复，所有卡片的价格列等宽。 */
.product-card .product-price {
  --price-size: 46px; --currency-size: 18px;
  grid-column: 1; grid-row: 1; min-width: 0; align-self: center;
}
.product-card .product-price .money {
  display: inline-block; margin: 0; color: var(--shell-blue);
  font-size: calc(var(--price-size) * var(--price-scale, 1)); font-weight: 720;
  line-height: 1.1; letter-spacing: -.045em; font-variant-numeric: tabular-nums; white-space: nowrap;
}
.product-card .product-price--long { --price-size: 30px; }
.product-card .product-price .currency {
  display: inline; font-size: calc(var(--currency-size) * var(--price-scale, 1)); font-weight: 550;
  margin-right: calc(4px * var(--price-scale, 1));
}
.product-card .row__name { grid-column: 2; grid-row: 1; width: auto; padding: 0; align-self: center; }
.product-card .row__title { font-size: 18px; font-weight: 650; line-height: 1.5; }
.product-card .product-meta {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px;
  margin-top: 9px; color: var(--shell-muted); font-size: 13px;
}
.product-card .product-meta b { color: #344a69; font-size: 14px; }
.compare-trigger {
  min-height: 32px; padding: 5px 9px; display: inline-flex; align-items: center; gap: 4px;
  border: 1px solid var(--shell-blue-line); border-radius: 6px;
  background: var(--shell-blue-soft); color: var(--shell-blue-deep); font-size: 12px; font-weight: 650;
}
.compare-trigger .ic { width: 13px; height: 13px; }
.compare-trigger[aria-expanded="true"] .ic { transform: rotate(180deg); }
/* 右侧只保留操作：购买在上，收藏／提醒／分享等宽横排在下。 */
.product-card .row__price.product-actions {
  grid-column: 3; grid-row: 1; width: auto; padding: 0; border: 0;
  display: grid; grid-template-columns: minmax(0, 1fr);
  grid-template-rows: 40px 32px; align-items: center; gap: 8px; align-self: center;
}
.purchase-action {
  grid-column: 1; grid-row: 1; width: 100%; height: 40px; min-height: 40px;
  border: 1px solid var(--shell-blue); border-radius: 8px; background: var(--shell-blue);
  box-shadow: 0 2px 0 var(--shell-blue-deep);
  color: #fff; font-size: 14px; font-weight: 600; padding: 9px 14px;
}
.purchase-action:hover { background: var(--shell-blue); box-shadow: 0 3px 0 var(--shell-blue-deep), 0 5px 13px #345be821; }
.purchase-action[disabled] { background: #eef1f6; border-color: #dfe4ee; color: #7b8799; box-shadow: none; }
.product-card .quick-actions {
  grid-column: 1; grid-row: 2; margin: 0; padding: 0; border: 0;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px;
}
.product-card .quick-actions .bj-actions--compact {
  display: contents;
}
.product-card .bj-actions__btn--icon {
  width: 100%; min-width: 0; height: 32px; min-height: 32px; padding: 5px 0; gap: 3px;
  color: var(--shell-muted); border-color: transparent; background: transparent;
  border-radius: 6px; font-size: 12px; white-space: nowrap;
}
.product-card .bj-actions__btn--icon .ic { width: 14px; height: 14px; }
.product-card .bj-actions__btn--icon:hover {
  background: var(--shell-blue-soft); border-color: var(--shell-blue-line); color: var(--shell-blue-deep);
}
.product-card .desktop-action-label { display: inline; }
.product-card .row__expanded {
  grid-column: 1 / -1; grid-row: 2; width: calc(100% + 40px);
  margin: 0 -20px -18px; padding: 18px 20px; border-radius: 0 0 14px 14px;
}

@media (min-width: 761px) {
  .desktop-search { display: block; }
}

.hero,
.hd__in,
.cols,
.page,
.ft__in {
  width: calc(100% - 112px);
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
}
.page { padding: 29px 0 48px; }
.ft__in { padding-left: 0; padding-right: 0; }
.bj-tabs--page {
  gap: 30px; margin-bottom: 24px; padding: 0;
  border-bottom: 1px solid var(--shell-line);
}
.bj-tabs--page .bj-tab {
  position: relative; min-height: 0; padding: 0 0 15px; border: 0; border-radius: 0;
  background: transparent; color: var(--shell-muted); font-size: 14px;
}
.bj-tabs--page .bj-tab[aria-selected="true"] {
  color: var(--shell-ink); font-weight: 600; background: transparent; box-shadow: none;
}
.bj-tabs--page .bj-tab[aria-selected="true"]::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--shell-blue);
}
.view__title { font-size: 29px; font-weight: 650; letter-spacing: -.035em; }
.view__sub { margin-top: 9px; font-size: 14px; color: var(--shell-muted); }

@media (min-width: 1081px) {
  .desktop-search .search__clear { right: 174px; }
  :root { --desktop-header: 80px; --sticky-search: 70px; --brand-col: 240px; }
  .hd { height: 80px; }
  .hd__in { height: 80px; padding-left: 0; padding-right: 0; }
  .hd__actions { margin-left: auto; }
  .desktop-only { display: block; }
  /* 搜索仍压在横幅上；横向上只占商品列，避免粘住后盖住左侧档位。 */
  .hero { margin-bottom: -27px; }
  .desktop-search {
    position: sticky;
    top: 0;
    z-index: 36;
    width: calc(100% - 112px);
    max-width: 1440px;
    height: auto;
    margin: 0 auto;
    padding: 0 0 0 var(--brand-col);
    background: transparent;
    border-bottom: 0;
    box-sizing: border-box;
    pointer-events: none;
  }
  .desktop-search .search {
    pointer-events: auto;
    max-width: 968px;
    width: 100%;
    height: 62px;
    margin: 0;
  }
  .sortbar {
    position: sticky;
    top: var(--sticky-search);
    z-index: 28;
  }
  .cols { padding: 30px 0 56px; }
  .filters {
    position: sticky;
    top: 16px;
    z-index: 30;
    max-height: calc(100vh - 24px);
    overflow: hidden;
    align-self: flex-start;
  }
  [data-desktop-stock] { display: flex; align-items: center; margin-left: auto; }
  .hall-fab {
    right: 0; top: 42%; bottom: auto; width: 31px; min-height: 100px; padding: 12px 4px;
    flex-direction: column; gap: 9px;
    background: var(--shell-blue-soft); color: var(--shell-blue-deep);
    border: 1px solid var(--shell-blue-line); border-right: 0; border-radius: 10px 0 0 10px;
    box-shadow: 0 3px 13px #263f7210; font-size: 13px; font-weight: 600;
  }
  .hall-fab:hover { color: var(--shell-blue-deep); border-color: var(--shell-blue); }
}

@media (max-width: 1080px) {
  .hd__in, .cols, .page, .ft__in { width: auto; }
  .hd__in { width: calc(100% - 40px); height: 68px; }
  .page { padding-left: 20px; padding-right: 20px; }
  .nav { display: none; }
  #engagement-nav { display: none; }
  .quick-nav { display: grid; padding: 0 20px 8px; }
  .hero { width: calc(100% - 40px); margin-top: 20px; }
  .hero__in { grid-template-columns: 40% 60%; }
  .hero__text { padding-left: 28px; }
  .hero__title { font-size: 30px; }
  .hero__stats { max-width: 300px; }
  .stat-card { padding-right: 10px; }
  .stat-card + .stat-card { padding-left: 10px; }
  .stat-card b { font-size: 24px; }
  .stat-card span { font-size: 10px; }
  .hot-entries { height: 370px; }
  .cols { display: block; padding: 24px 20px 44px; }
  .filters {
    position: static; inset: auto; width: 100%; max-height: none; margin: 0 0 16px; padding: 0;
    transform: none; visibility: visible; pointer-events: auto; box-shadow: none; overflow: visible;
  }
  .filters[aria-hidden="true"] { visibility: visible; pointer-events: auto; }
  .mobile-tools { display: none; }
  .production-rail > .stock-row { display: none; }
  [data-rail-layer] .rail-brand-page { display: block; }
  [data-rail-layer] .rail-plan-page { display: block; }
  .sidebar-label, .rail-back, .rail-plan-head { display: none; }
  .brand-name small:not(.chosen-plan) { display: none; }
  .brand-links { display: flex; gap: 8px; overflow-x: auto; padding: 2px 2px 8px; }
  .brand-link { flex: 0 0 156px; min-height: 56px; transform: none; }
  .brand-link:hover,
  .brand-link:focus-visible { transform: none; }
  .rail-plan-page:empty { display: none; }
  .plan-panel { display: flex; flex-wrap: wrap; gap: 7px; margin: 6px 2px 0; flex: none; overflow: visible; }
  .plan-option { width: auto; min-height: 40px; padding: 0 12px; border: 1px solid #e3e9f4; background: #f7f9fd; }
  .product-card-face { grid-template-columns: 148px minmax(0, 1fr) 159px; }
  .product-card .product-price { --price-size: 40px; --currency-size: 16px; }
  .product-card .product-price--long { --price-size: 26px; }
}

/* 电脑卡片共用两条行轨：标题对购买，库存销量对次要操作。
 * 只覆盖电脑；手机继续使用原来的名称、价格、操作三段排布。 */
@media (min-width: 761px) {
  .list { gap: 10px; }
  .product-card-face {
    grid-template-columns: 100px minmax(0, 1fr) 168px;
    grid-template-rows: minmax(40px, auto) minmax(32px, auto);
    gap: 4px 12px; min-height: 110px; padding: 16px 20px; border-radius: 12px;
  }
  /* 窄价格列不挪动：短金额居中，长金额继续靠右并按实际宽度适配。 */
  .product-card .product-price {
    --price-size: 22px; --currency-size: var(--price-size); grid-row: 1 / span 2; text-align: right;
  }
  .product-card .product-price:not(.product-price--long) { text-align: center; }
  .product-card .product-price .money { font-weight: 700; letter-spacing: 0; }
  .product-card .product-price .currency { font-weight: inherit; margin-right: 0; }
  .product-card .row__name,
  .product-card .row__price.product-actions {
    grid-row: 1 / span 2; display: grid; grid-template-rows: subgrid; row-gap: 4px; align-self: stretch;
  }
  .product-card .row__heading { align-self: center; }
  .product-card .row__title { margin-bottom: 0; font-size: 17px; }
  .product-card .product-meta { margin-top: 0; gap: 6px 12px; align-self: center; }
  .product-card .row__expanded {
    grid-row: 3; margin: 12px -20px -16px; padding: 16px 20px; border-radius: 0 0 12px 12px;
  }
}
@media (min-width: 761px) and (max-width: 1080px) {
  .product-card-face { grid-template-columns: 92px minmax(0, 1fr) 156px; }
}

@media (max-width: 760px) {
  .app { padding-bottom: 66px; }
  .hd__in { width: 100%; min-height: 62px; height: auto; padding: 9px 16px; }
  .page { padding-left: 16px; padding-right: 16px; }
  .view__title { font-size: 25px; }
  .logo__text b { font-size: 18px; }
  .logo__mark { width: 38px; height: 38px; }
  .account__login, .account__me { min-height: 44px; }
  .quick-nav {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 45; padding: 5px 8px;
    background: #fff; border-top: 1px solid var(--shell-line);
  }
  .quick-nav__item { min-height: 50px; }
  .hero { width: calc(100% - 24px); min-height: 0; margin-top: 14px; border-radius: 15px; }
  .hero__in { min-height: 0; display: flex; flex-direction: column; align-items: stretch; }
  .hero__text { padding: 24px 20px 8px; }
  .hero__badge { margin-bottom: 12px; font-size: 9px; }
  .hero__title { font-size: 28px; }
  .hero__stats { margin-top: 20px; }
  .stat-card { padding-right: 12px; }
  .stat-card + .stat-card { padding-left: 12px; }
  .stat-card b { font-size: 22px; }
  .stat-card span { font-size: 9px; }
  .hot-entries {
    width: 100%; min-width: 0; max-width: 100%; height: auto; min-height: 104px;
    padding: 6px 0 14px; overflow: visible;
  }
  .hot-entries > .co-orbit { height: auto; min-height: 104px; }
  .hd .search { display: flex; order: 3; flex-basis: 100%; }
  .desktop-search { display: none !important; }
  .cols { padding: 15px 12px 32px; }
  .filters { margin-bottom: 12px; }
  .brand-links { gap: 7px; }
  .brand-link { flex-basis: auto; min-height: 44px; padding: 7px 10px; }
  .brand-link .brand-mark { width: 24px; height: 24px; font-size: 11px; }
  .brand-link .brand-mark--logo { padding: 3px; }
  .brand-link .count { display: none; }
  .chosen-plan { max-width: 84px; }
  .plan-panel { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; }
  .plan-option { flex: 0 0 auto; min-height: 44px; }
  .sortbar { gap: 5px; padding: 8px; }
  .sorts { width: 100%; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .sort-tab { min-height: 44px; padding: 7px 3px; font-size: 12px; }
  .sortbar__count { margin-left: 0; min-height: 32px; }
  /* 手机先完整显示名称，再放价格＋购买，最后一排三个次要操作。 */
  .product-card-face {
    grid-template-columns: minmax(0, 1fr) minmax(112px, .8fr); gap: 13px; padding: 16px; border-radius: 12px;
  }
  .product-card .row__name { grid-column: 1 / -1; grid-row: 1; }
  .product-card .row__title { font-size: 16px; }
  .product-card .product-meta { font-size: 11px; gap: 7px 10px; }
  .product-card .product-meta b { font-size: 12px; }
  .compare-trigger { min-height: 44px; flex-basis: 100%; justify-content: center; }
  .product-card .product-price { --price-size: clamp(30px, 10vw, 40px); grid-column: 1; grid-row: 2; }
  .product-card .product-price--long { --price-size: clamp(20px, 6.7vw, 32px); }
  .product-card .row__price.product-actions { display: contents; }
  .purchase-action {
    grid-column: 2; grid-row: 2; width: 100%; height: 44px; min-height: 44px;
    padding: 8px 10px; font-size: 14px; box-shadow: 0 2px 0 var(--shell-blue-deep);
  }
  .product-card .quick-actions { grid-column: 1 / -1; grid-row: 3; gap: 8px; }
  .product-card .bj-actions__btn--icon {
    height: 44px; min-height: 44px; padding: 8px 10px; gap: 6px;
    border: 1px solid var(--shell-line); border-radius: 6px; background: #f7f9fd; color: var(--shell-muted);
  }
  .product-card .bj-actions__btn--icon:hover {
    background: var(--shell-blue-soft); border-color: var(--shell-blue-line); color: var(--shell-blue-deep);
  }
  .product-card .row__expanded { grid-row: 4; width: calc(100% + 32px); margin: 0 -16px -16px; padding: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  .row.product-card, .product-card-face, .compare-trigger .ic { transition: none !important; }
  .row.product-card:hover .product-card-face,
  .row.product-card:focus-within .product-card-face { transform: none; }
  [data-rail-motion] .rail-brand-page,
  [data-rail-motion] .plan-option { animation: none !important; }
}