:root {
  --primary: #00aceb;
  --primary-light: #6fd4f4;
  --action-start: #00aceb;
  --action-end: #6fd4f4;
  --action-text: #002e3d;
  --primary-bg: rgba(0,172,235,.09);
  --accent: #6fd4f4;
  --bg: #f0fafd;
  --bg-card: rgba(255, 255, 255, .42);
  --border: rgba(255, 255, 255, .66);
  --border-light: rgba(255, 255, 255, .56);
  --text-1: #002e3d;
  --text-2: #0a4a63;
  --text-3: #2a5f7a;
  --text-4: #94a3b8;
  --success: #12856a;
  --warning: #b66a00;
  --danger: #d14343;

  /* ===== UI-P1 统一设计变量（T1，单一事实来源） ===== */
  /* 品牌 / 状态色 */
  --color-primary: #0087b3;
  --color-primary-hover: #006e97;
  --color-primary-active: #00557a;
  --color-success: #16a34a;
  --color-warning: #d97706;
  --color-danger: #dc2626;
  /* 文本（对比度达 WCAG AA） */
  --color-text: #002e3d;
  --color-text-secondary: #0a4a63;
  --color-text-tertiary: #2a5f7a;
  --color-text-on-primary: #002e3d;
  /* 背景 / 边框 */
  --color-bg: #f4f8fe;
  --color-surface: rgba(255, 255, 255, .72);
  --color-border: rgba(30, 58, 95, .14);
  /* 圆角 */
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-pill: 999px;
  /* 阴影 */
  --shadow-sm: 0 4px 14px rgba(0,46,61,.06);
  --shadow-md: 0 12px 30px rgba(0,46,61,.10);
  /* 间距（4px 基准） */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-8: 48px;
  /* 字号 */
  --text-xs: 12px;
  --text-sm: 13px;
  --text-base: 15px;
  --text-lg: 17px;
  --text-xl: 20px;
  --text-2xl: 26px;
  /* 按钮三级体系 */
  --btn-primary-bg: linear-gradient(135deg, var(--action-start), var(--action-end));
  --btn-primary-color: #002e3d;
  --btn-secondary-bg: rgba(255, 255, 255, .86);
  --btn-secondary-border: rgba(0,172,235,.42);
  --btn-secondary-color: #0087b3;
  --btn-text-color: #0087b3;
  --btn-radius: 14px;
  --btn-height: 44px;
  --btn-padding: 0 22px;
  --btn-font-size: 15px;
}

html {
  min-height: 100%;
  /* 与页面渐变的收尾色一致，避免短页面在视口底部露出不同色的根背景。 */
  background: #e6f7fd;
}

body {
  min-height: 100vh;
  background:
    radial-gradient(circle at 8% 9%, rgba(0,172,235,.42), transparent 24%),
    radial-gradient(circle at 88% 4%, rgba(0,172,235,.24), transparent 26%),
    radial-gradient(circle at 18% 82%, rgba(219, 234, 254, .58), transparent 28%),
    linear-gradient(145deg, #f0fafd 0%, #f7fcfe 44%, #e6f7fd 100%) !important;
  color: var(--text-1) !important;
}

body::before {
  background:
    linear-gradient(112deg, rgba(255,255,255,.62) 0%, transparent 26%, rgba(255,255,255,.26) 51%, transparent 72%),
    repeating-linear-gradient(90deg, rgba(255,255,255,.18) 0 1px, transparent 1px 80px) !important;
  opacity: .72 !important;
}

.nav {
  background: rgba(255, 255, 255, .38) !important;
  border-bottom-color: rgba(255, 255, 255, .58) !important;
  box-shadow: 0 18px 54px rgba(0,46,61,.11), inset 0 1px 0 rgba(255,255,255,.6) !important;
  backdrop-filter: blur(30px) saturate(1.45) !important;
  -webkit-backdrop-filter: blur(30px) saturate(1.45) !important;
}

.logo-mark,
.logo-icon,
.logo-img,
.brand-mark {
  background: rgba(255,255,255,.44) !important;
  border-color: rgba(255,255,255,.64) !important;
  box-shadow: 0 16px 38px rgba(0,172,235,.12), inset 0 1px 0 rgba(255,255,255,.7) !important;
}

.nav-menu a {
  border-radius: 999px !important;
}

.nav-menu a.active {
  color: #00aceb !important;
}

.nav-menu a.active::after,
.section-title::before {
  background: linear-gradient(90deg, rgba(0,172,235,.88), rgba(0,172,235,.88)) !important;
}

.hero-card,
.hero-shell,
.search-shell,
.banner {
  color: var(--text-1) !important;
  border-radius: 34px !important;
  padding: 30px !important;
  background:
    radial-gradient(circle at 12% 8%, rgba(0,172,235,.11), transparent 26%),
    radial-gradient(circle at 92% 0%, rgba(255,255,255,.86), transparent 24%),
    rgba(255,255,255,.48) !important;
  border: 1px solid rgba(255,255,255,.72) !important;
  box-shadow: 0 24px 70px rgba(0,172,235,.10), inset 0 1px 0 rgba(255,255,255,.68) !important;
  backdrop-filter: blur(30px) saturate(1.35) !important;
  -webkit-backdrop-filter: blur(30px) saturate(1.35) !important;
  overflow: hidden !important;
}

.hero-card::before,
.hero-shell::before,
.search-shell::before,
.banner::before {
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.34), transparent) !important;
  opacity: .62 !important;
}

.hero-card h1,
.hero-shell h1,
.search-shell h1,
.banner h1 {
  color: var(--text-1) !important;
}

.hero-card p,
.hero-shell p,
.search-shell p,
.banner p,
.hero-head p,
.search-head p {
  color: var(--text-3) !important;
}

/* P2-1：hero 改浅玻璃底后，遗留的深色背景专用浅色辅助文字（更新日期等）提级 */
.hero-shell .hero-updated,
.hero-card .hero-updated,
.search-shell .hero-updated,
.banner .hero-updated {
  color: var(--text-3) !important;
  opacity: 1 !important;
}

.hero-badge,
.source-count {
  background: rgba(255,255,255,.58) !important;
  border-color: rgba(255,255,255,.72) !important;
  color: #00aceb !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.68) !important;
}

.hero-shell > .search-panel,
.hero-card .hero-product-search,
.search-shell .search-head {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.hero-shell > .search-panel .hero-search,
.hero-card .hero-product-search .hero-search-form,
.search-shell .news-search,
.hero-shell .kb-search,
.search-shell .kb-search,
.banner-search,
.news-search,
.kb-search {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.hero-shell > .search-panel .hero-search input,
.hero-card .hero-product-search .hero-search-form input,
.search-shell .news-search input,
.hero-shell .kb-search input,
.search-shell .kb-search input,
.banner-search input,
.news-search input,
.kb-search input,
input[type="search"] {
  background:
    linear-gradient(180deg, rgba(255,255,255,.94), rgba(248,252,255,.88)) !important;
  border: 1px solid rgba(255,255,255,.82) !important;
  color: #002e3d !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.94),
    inset 0 -1px 0 rgba(0,172,235,.06),
    0 16px 34px rgba(16,24,40,.10) !important;
  backdrop-filter: blur(10px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(10px) saturate(1.08) !important;
}

.hero-shell > .search-panel .hero-search input::placeholder,
.hero-card .hero-product-search .hero-search-form input::placeholder,
.search-shell .news-search input::placeholder,
.hero-shell .kb-search input::placeholder,
.search-shell .kb-search input::placeholder,
.banner-search input::placeholder,
.news-search input::placeholder,
.kb-search input::placeholder,
input[type="search"]::placeholder {
  color: rgba(51, 65, 85, .82) !important;
}

/* UI-P1 T1：裸 `button` 已移出主按钮渐变选择器，未显式归类的按钮
   统一走文件末尾「按钮三级体系」的中性次级样式，避免全站按钮一片蓝。 */
.primary-btn,
.submit-btn,
.comment-btn,
.download-btn,
.save-btn,
.login-btn,
.small-btn.primary,
.nav-btn.primary,
.btn-primary,
.banner-search button,
.hero-search button,
.hero-search-form button,
.news-search button,
.kb-search button,
.pagination .active,
.pager-actions button.active,
.catalog-page-btn.active,
.filter-done-primary,
.arrow-btn {
  background: linear-gradient(135deg, var(--action-start), var(--action-end)) !important;
  color: var(--action-text) !important;
  border-color: rgba(255,255,255,.42) !important;
  box-shadow: 0 18px 42px rgba(0,172,235,.17), inset 0 1px 0 rgba(255,255,255,.46) !important;
}

.section,
.section-card,
.panel,
.card,
.portal-card,
.notice-card,
.brand-card,
.product-card,
.cat-product-card,
.tool-card,
.ranking-col,
.detail-gallery,
.detail-specs,
.news-item,
.news-card,
.news-column,
.term-card,
.knowledge-card,
.forum-card,
.demand-card,
.admin-card,
.login-card,
.modal-content,
.search-results-card {
  background: rgba(255,255,255,.34) !important;
  border-color: rgba(255,255,255,.58) !important;
  box-shadow: 0 24px 74px rgba(0,46,61,.12), inset 0 1px 0 rgba(255,255,255,.62) !important;
  backdrop-filter: blur(30px) saturate(1.45) !important;
  -webkit-backdrop-filter: blur(30px) saturate(1.45) !important;
}

.section-card,
.panel,
.section,
.modal-content {
  border-radius: 34px !important;
}

/* 首页实时内容卡片与其余内容版块保持同一层玻璃质感。 */
body[data-page="home"]:not(.mobile-page) .live-strip .live-block {
  background: rgba(255, 255, 255, .34) !important;
  border-color: rgba(255, 255, 255, .58) !important;
  box-shadow: 0 24px 74px rgba(0,46,61,.12), inset 0 1px 0 rgba(255, 255, 255, .62) !important;
  backdrop-filter: blur(30px) saturate(1.45) !important;
  -webkit-backdrop-filter: blur(30px) saturate(1.45) !important;
}

.portal-card,
.product-card,
.cat-product-card,
.news-column,
.term-card {
  border-radius: 30px !important;
}

.portal-card:hover,
.product-card:hover,
.cat-product-card:hover,
.tool-card:hover,
.term-card:hover,
.news-card:hover {
  border-color: rgba(255,255,255,.78) !important;
  box-shadow: 0 26px 82px rgba(0,172,235,.13), inset 0 1px 0 rgba(255,255,255,.72) !important;
}

.portal-icon,
.module-icon,
.tool-icon,
.category-icon,
.avatar {
  background: rgba(255,255,255,.38) !important;
  border: 1px solid rgba(255,255,255,.60) !important;
  color: #00aceb !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.68), 0 14px 28px rgba(0,172,235,.12) !important;
  backdrop-filter: blur(18px) saturate(1.35) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.35) !important;
}

.tag-primary,
.tag-option.active,
.filter-chip.active,
.filter-opt.active,
.filter-selected .item,
.brand-count,
.visual-platform,
.modal-badges span,
.product-tags span,
.portal-points span,
.micro-tag,
.section-count,
.column-count,
.admin-tab.active,
.demand-filter.active,
.forum-pagination button.active,
.catalog-page-btn.active {
  background: linear-gradient(135deg, rgba(0,172,235,.94), rgba(0,172,235,.94)) !important;
  color: #fff !important;
  border-color: rgba(255,255,255,.62) !important;
  box-shadow: 0 12px 26px rgba(0,172,235,.15), inset 0 1px 0 rgba(255,255,255,.48) !important;
  backdrop-filter: blur(16px) saturate(1.25) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.25) !important;
}

.filter-chip,
.filter-opt,
.tag-option,
.portal-points span,
.product-tags span {
  border-radius: 999px !important;
}

.compare-inline-btn,
.line-btn,
.filter-done-ghost,
.nav-btn:not(.primary),
.small-btn:not(.primary),
.product-actions .compare-inline-btn {
  background: rgba(255,255,255,.34) !important;
  border-color: rgba(255,255,255,.54) !important;
  color: rgba(52,64,84,.9) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.54) !important;
}

.product-visual,
.product-photo-frame,
.product-image,
.detail-gallery,
.brand-logo,
.news-cover,
.thumb {
  background: rgba(255,255,255,.46) !important;
  border-color: rgba(255,255,255,.62) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.64) !important;
  backdrop-filter: blur(18px) saturate(1.2) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.2) !important;
}

.compare-dock,
.compare-header,
.topbar,
.footer {
  background: rgba(41,57,76,.58) !important;
  border-color: rgba(255,255,255,.22) !important;
  box-shadow: 0 24px 72px rgba(16,24,40,.18), inset 0 1px 0 rgba(255,255,255,.22) !important;
  backdrop-filter: blur(30px) saturate(1.4) !important;
  -webkit-backdrop-filter: blur(30px) saturate(1.4) !important;
}

/* 产品主图防下载保护：禁止选中、拖拽、长按呼出保存菜单 */
.product-photo-frame,
.product-photo-frame *,
.product-visual,
.product-image,
.detail-gallery,
.detail-gallery img,
[class*="product-photo"] img {
  -webkit-user-drag: none !important;
  -webkit-user-select: none !important;
  user-select: none !important;
  -webkit-touch-callout: none !important;
}
.product-photo-frame img,
.detail-gallery img,
[class*="product-photo"] img {
  pointer-events: none !important;
}

.filter-done-bar {
  background: rgba(255,255,255,.38) !important;
  border-color: rgba(255,255,255,.58) !important;
  box-shadow: 0 20px 58px rgba(0,46,61,.14), inset 0 1px 0 rgba(255,255,255,.62) !important;
  backdrop-filter: blur(30px) saturate(1.45) !important;
  -webkit-backdrop-filter: blur(30px) saturate(1.45) !important;
}

a,
td a,
.news-meta,
.term-title span {
  color: #00aceb !important;
}

.hero-card h2,
.hero-card h3,
.hero-card h4,
.hero-shell h2,
.hero-shell h3,
.hero-shell h4,
.search-shell h2,
.search-shell h3,
.search-shell h4,
.banner h2,
.banner h3,
.banner h4,
.search-panel-title,
.hero-product-search h2,
.hero-product-search h3,
.search-head h2,
.search-head h3,
.section-card h2,
.section-card h3,
.panel h2,
.panel h3 {
  color: #002e3d !important;
  text-shadow: none !important;
}

.hero-card small,
.hero-card .muted,
.hero-shell small,
.hero-shell .muted,
.search-shell small,
.search-shell .muted,
.banner small,
.banner .muted,
.search-panel-copy,
.hero-product-search p,
.search-head p,
.section-card > p,
.panel > p {
  color: #5f7187 !important;
  text-shadow: none !important;
}

.hero-copy,
.search-panel,
.hero-product-search,
.search-head,
.search-shell,
.banner {
  color: #002e3d !important;
}

/* Cloud Blue search modules: keep every page readable on bright glass. */
.hero-shell .search-panel .search-panel-title,
.hero-shell .search-panel h2,
.hero-card .hero-product-search h2,
.publish-hero .search-shell .search-head h1,
.search-shell .search-head h1,
.hero-shell .hero-head h1,
.banner h1 {
  color: #002e3d !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

.hero-shell .search-panel .search-panel-copy,
.hero-shell .search-panel p,
.hero-card .hero-product-search p,
.publish-hero .search-shell .search-head p,
.search-shell .search-head p,
.hero-shell .hero-head p,
.banner p {
  color: #0a4a63 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

.hero-shell .search-panel,
.hero-card .hero-product-search,
.banner-search {
  background: rgba(255, 255, 255, .38) !important;
  border: 1px solid rgba(255, 255, 255, .58) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.62), 0 16px 42px rgba(0,172,235,.08) !important;
  backdrop-filter: blur(22px) saturate(1.25) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.25) !important;
}

.hero-shell .search-panel {
  padding: 22px !important;
  border-radius: 24px !important;
}

.hero-shell .hero-search,
.hero-card .hero-search-form,
.publish-hero .news-search,
.search-shell .news-search,
.hero-shell .kb-search,
.search-shell .kb-search,
.banner-search {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 144px !important;
  gap: 12px !important;
}

.hero-shell .hero-search input,
.hero-card .hero-search-form input,
.publish-hero .news-search input,
.search-shell .news-search input,
.hero-shell .kb-search input,
.search-shell .kb-search input,
.banner-search input {
  height: 54px !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.88) !important;
  border: 1px solid rgba(255,255,255,.84) !important;
  color: #002e3d !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.96), 0 12px 26px rgba(0,46,61,.07) !important;
}

.hero-shell .hero-search button,
.hero-card .hero-search-form button,
.publish-hero .news-search button,
.search-shell .news-search button,
.hero-shell .kb-search button,
.search-shell .kb-search button,
.banner-search button {
  height: 54px !important;
  border-radius: 16px !important;
  background: linear-gradient(135deg, var(--action-start), var(--action-end)) !important;
  color: var(--action-text) !important;
}

/* Product catalog polish for Cloud Blue. */
body[data-page="products"] .hero-card,
body[data-page="mobile-products"] .hero-card {
  padding: 34px !important;
}

body[data-page="products"] .hero-copy,
body[data-page="mobile-products"] .hero-copy {
  gap: 14px !important;
}

body[data-page="products"] .hero-copy h1,
body[data-page="mobile-products"] .hero-copy h1 {
  margin: 0 !important;
}

body[data-page="products"] .hero-copy > p,
body[data-page="mobile-products"] .hero-copy > p {
  margin: 0 !important;
  max-width: 860px !important;
  color: #0a4a63 !important;
}

body[data-page="products"] .hero-product-search,
body[data-page="mobile-products"] .hero-product-search {
  margin-top: 10px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body[data-page="products"] .hero-product-search h2,
body[data-page="mobile-products"] .hero-product-search h2 {
  margin: 0 0 6px !important;
  font-size: 24px !important;
  line-height: 1.25 !important;
  color: #002e3d !important;
}

body[data-page="products"] .hero-product-search p,
body[data-page="mobile-products"] .hero-product-search p {
  margin: 0 !important;
  max-width: 820px !important;
  color: #0a4a63 !important;
  line-height: 1.65 !important;
}

body[data-page="products"] .hero-product-search .hero-search-form,
body[data-page="mobile-products"] .hero-product-search .hero-search-form {
  margin-top: 18px !important;
  align-items: stretch !important;
}

.primary-btn,
.product-actions .primary-btn,
.result-product-grid .product-actions .primary-btn,
.filter-toggle.active,
.filter-done-primary,
.submit-btn,
.comment-btn,
.save-btn,
.login-btn,
.download-btn {
  background: linear-gradient(135deg, var(--action-start), var(--action-end)) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.48) !important;
  box-shadow: 0 16px 34px rgba(0,172,235,.16), inset 0 1px 0 rgba(255,255,255,.44) !important;
}

.primary-btn:hover,
.product-actions .primary-btn:hover,
.filter-toggle.active:hover,
.filter-done-primary:hover {
  background: linear-gradient(135deg, #347bf0, #58c3ed) !important;
  box-shadow: 0 18px 40px rgba(0,172,235,.20), inset 0 1px 0 rgba(255,255,255,.44) !important;
}

.filter-toggle,
.result-count-badge,
.brand-count,
.visual-platform,
.product-tags span,
.micro-tag,
.section-count,
.column-count {
  background: rgba(255,255,255,.52) !important;
  color: #00aceb !important;
  border: 1px solid rgba(0,172,235,.42) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.62) !important;
}

.compare-inline-btn,
.product-actions .compare-inline-btn,
.line-btn,
.filter-done-ghost {
  background: rgba(255,255,255,.50) !important;
  color: #003b52 !important;
  border: 1px solid rgba(0,172,235,.34) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.68), 0 10px 24px rgba(0,46,61,.06) !important;
}

.product-actions {
  align-items: center !important;
}

.product-actions .primary-btn,
.product-actions .compare-inline-btn,
.product-actions .line-btn {
  border-radius: 16px !important;
  font-weight: 800 !important;
}

body[data-page="products"] .section-head,
body[data-page="mobile-products"] .section-head {
  align-items: center !important;
}

body[data-page="products"] .list-tools,
body[data-page="mobile-products"] .list-tools {
  align-items: center !important;
  gap: 12px !important;
}

body[data-page="home"] .portal-card,
body[data-page="mobile-home"] .portal-card {
  min-height: 128px !important;
  grid-template-columns: minmax(0, 1fr) 54px !important;
  grid-template-rows: auto !important;
  gap: 12px 14px !important;
  align-items: center !important;
}

body[data-page="home"] .portal-card p,
body[data-page="mobile-home"] .portal-card p {
  line-height: 1.65 !important;
}

body[data-page="home"] .portal-points,
body[data-page="mobile-home"] .portal-points {
  display: none !important;
}

body[data-page="home"] .portal-actions,
body[data-page="mobile-home"] .portal-actions {
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: grid !important;
  place-items: center !important;
  align-self: center !important;
  justify-self: end !important;
}

body[data-page="home"] .portal-actions a,
body[data-page="mobile-home"] .portal-actions a {
  width: 52px !important;
  height: 52px !important;
  padding: 0 !important;
  border-radius: 15px !important;
  font-size: 0 !important;
}

@media (max-width: 760px) {
  /* 圆角层级（2026-09-03 统一）：hero 大容器 24px，内容卡片 20px。 */
  .hero-card,
  .hero-shell,
  .search-shell {
    border-radius: 24px !important;
  }

  .section-card,
  .panel,
  .section,
  .portal-card,
  .product-card,
  .cat-product-card,
  .news-column,
  .term-card {
    border-radius: 18px !important;
  }
}

body[data-page="demand"] .type-option {
  display: grid !important;
  gap: 6px !important;
  min-height: 96px !important;
  height: auto !important;
  padding: 16px 18px !important;
  text-align: left !important;
  align-items: center !important;
  justify-content: start !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, .58) !important;
  color: #002e3d !important;
  border: 1px solid rgba(255, 255, 255, .72) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .76), 0 12px 30px rgba(0,46,61,.06) !important;
  backdrop-filter: blur(18px) saturate(1.2) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.2) !important;
}

body[data-page="demand"] .type-option b {
  color: #002e3d !important;
}

body[data-page="demand"] .type-option span {
  color: #5f7289 !important;
}

body[data-page="demand"] .type-option.active {
  background: rgba(255, 255, 255, .76) !important;
  border-color: rgba(0,172,235,.78) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .84), 0 16px 36px rgba(0,172,235,.12), 0 0 0 3px rgba(0,172,235,.14) !important;
}

body[data-page="demand"] .hero {
  padding: 18px 0 12px !important;
}

body[data-page="demand"] .hero-shell {
  padding: 30px 36px !important;
}

body[data-page="demand"] .hero-shell h1 {
  margin-bottom: 10px !important;
}

body[data-page="demand"] .hero-badges {
  display: none !important;
}

@media (max-width: 760px) {
  body[data-page="demand"] .hero {
    padding: 12px 0 10px !important;
  }

  body[data-page="demand"] .hero-shell {
    padding: 24px 22px !important;
  }
}

body[data-page="home"] .hero,
body[data-page="products"] .hero,
body[data-page="mobile-products"] .hero {
  padding: 18px 0 14px !important;
}

body[data-page="home"] .hero-shell,
body[data-page="products"] .hero-card,
body[data-page="mobile-products"] .hero-card {
  padding: 24px 30px !important;
}

body[data-page="home"] .hero-copy {
  display: block !important;
  max-width: 760px;
}

body[data-page="home"] .hero-shell {
  gap: 18px !important;
}

body[data-page="home"] .search-panel {
  padding: 0 !important;
}

body[data-page="products"] .hero-copy > h1,
body[data-page="products"] .hero-copy > p,
body[data-page="mobile-products"] .hero-copy > h1,
body[data-page="mobile-products"] .hero-copy > p {
  display: none !important;
}

body[data-page="products"] .hero-product-search,
body[data-page="mobile-products"] .hero-product-search {
  margin-top: 0 !important;
}

@media (max-width: 760px) {
  body[data-page="home"] .hero,
  body[data-page="products"] .hero,
  body[data-page="mobile-products"] .hero {
    padding: 12px 0 10px !important;
  }

  body[data-page="home"] .hero-shell,
  body[data-page="products"] .hero-card,
  body[data-page="mobile-products"] .hero-card {
    padding: 22px !important;
  }
}

body[data-page="home"] .hero-shell .search-panel,
body[data-page="products"] .hero-card .hero-product-search,
body[data-page="mobile-products"] .hero-card .hero-product-search {
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body[data-page="home"] .hero-shell .hero-search,
body[data-page="products"] .hero-card .hero-search-form,
body[data-page="mobile-products"] .hero-card .hero-search-form {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Normalize the top intro rhythm across the six main sections. */
body[data-page="publish"] .search-shell,
body[data-page="knowledge"] .hero-shell,
body[data-page="forum"] .hero-shell,
body[data-page="demand"] .hero-shell {
  padding: 30px 36px !important;
}

body[data-page="publish"] .search-head,
body[data-page="knowledge"] .hero-head,
body[data-page="forum"] .hero-shell {
  gap: 18px !important;
  align-items: start !important;
}

body[data-page="publish"] .search-head h1,
body[data-page="knowledge"] .hero-head h1,
body[data-page="forum"] .hero-shell h1,
body[data-page="demand"] .hero-shell h1 {
  margin: 0 0 12px !important;
  font-size: 38px !important;
  line-height: 1.14 !important;
  letter-spacing: 0 !important;
}

body[data-page="home"] .search-panel-title,
body[data-page="products"] .hero-product-search h2,
body[data-page="mobile-products"] .hero-product-search h2 {
  margin: 0 0 12px !important;
  font-size: 26px !important;
  line-height: 1.18 !important;
  letter-spacing: 0 !important;
}

body[data-page="publish"] .search-head p,
body[data-page="knowledge"] .hero-head p,
body[data-page="forum"] .hero-shell p,
body[data-page="demand"] .hero-shell p,
body[data-page="home"] .search-panel-copy,
body[data-page="products"] .hero-product-search p,
body[data-page="mobile-products"] .hero-product-search p {
  margin: 0 0 22px !important;
  max-width: 980px !important;
  font-size: 15px !important;
  line-height: 1.72 !important;
  color: #0a4a63 !important;
}

body[data-page="forum"] .hero-shell p,
body[data-page="demand"] .hero-shell p {
  margin-bottom: 0 !important;
}

body[data-page="publish"] .news-search,
body[data-page="knowledge"] .kb-search {
  margin-top: 0 !important;
}

body[data-page="knowledge"] .filter-row {
  margin-top: 18px !important;
}

@media (max-width: 760px) {
  body[data-page="publish"] .search-shell,
  body[data-page="knowledge"] .hero-shell,
  body[data-page="forum"] .hero-shell,
  body[data-page="demand"] .hero-shell {
    padding: 24px 22px !important;
  }

  body[data-page="publish"] .search-head h1,
  body[data-page="knowledge"] .hero-head h1,
  body[data-page="forum"] .hero-shell h1,
  body[data-page="demand"] .hero-shell h1 {
    font-size: 32px !important;
  }

  body[data-page="home"] .search-panel-title,
  body[data-page="products"] .hero-product-search h2,
  body[data-page="mobile-products"] .hero-product-search h2 {
    font-size: 24px !important;
  }
}

/* Final pass: make the six section headers share one vertical rhythm. */
body[data-page="home"] .hero,
body[data-page="products"] .hero,
body[data-page="publish"] .publish-hero,
body[data-page="knowledge"] .hero,
body[data-page="forum"] .hero,
body[data-page="demand"] .hero,
body[data-page="mobile-products"] .hero {
  padding-top: 18px !important;
  padding-bottom: 14px !important;
}

body[data-page="home"] .hero-shell,
body[data-page="products"] .hero-card,
body[data-page="publish"] .search-shell,
body[data-page="knowledge"] .hero-shell,
body[data-page="forum"] .hero-shell,
body[data-page="demand"] .hero-shell,
body[data-page="mobile-products"] .hero-card {
  padding: 28px 36px !important;
}

body[data-page="home"] .hero-shell,
body[data-page="products"] .hero-card,
body[data-page="publish"] .search-shell,
body[data-page="knowledge"] .hero-shell,
body[data-page="forum"] .hero-shell,
body[data-page="demand"] .hero-shell,
body[data-page="mobile-products"] .hero-card {
  display: block !important;
}

body[data-page="home"] .search-panel,
body[data-page="products"] .hero-product-search,
body[data-page="mobile-products"] .hero-product-search {
  margin: 0 !important;
}

body[data-page="publish"] .search-head,
body[data-page="knowledge"] .hero-head,
body[data-page="forum"] .hero-shell {
  display: block !important;
  margin: 0 !important;
}

body[data-page="publish"] .source-count,
body[data-page="knowledge"] .hero-badge,
body[data-page="forum"] .hero-badge {
  display: none !important;
}

body[data-page="home"] .search-panel-title,
body[data-page="products"] .hero-product-search h2,
body[data-page="mobile-products"] .hero-product-search h2,
body[data-page="publish"] .search-head h1,
body[data-page="knowledge"] .hero-head h1,
body[data-page="forum"] .hero-shell h1,
body[data-page="demand"] .hero-shell h1 {
  margin-top: 0 !important;
  margin-bottom: 12px !important;
}

body[data-page="home"] .search-panel-copy,
body[data-page="products"] .hero-product-search p,
body[data-page="mobile-products"] .hero-product-search p,
body[data-page="publish"] .search-head p,
body[data-page="knowledge"] .hero-head p,
body[data-page="forum"] .hero-shell p,
body[data-page="demand"] .hero-shell p {
  margin-top: 0 !important;
  margin-bottom: 24px !important;
}

body[data-page="forum"] .hero-shell p,
body[data-page="demand"] .hero-shell p {
  margin-bottom: 0 !important;
}

body[data-page="home"] .hero-search,
body[data-page="products"] .hero-search-form,
body[data-page="publish"] .news-search,
body[data-page="knowledge"] .kb-search,
body[data-page="mobile-products"] .hero-search-form {
  margin-top: 0 !important;
}

body[data-page="knowledge"] #category-filters {
  margin-top: 18px !important;
}

@media (max-width: 760px) {
  body[data-page="home"] .hero-shell,
  body[data-page="products"] .hero-card,
  body[data-page="publish"] .search-shell,
  body[data-page="knowledge"] .hero-shell,
  body[data-page="forum"] .hero-shell,
  body[data-page="demand"] .hero-shell,
  body[data-page="mobile-products"] .hero-card {
    padding: 24px 22px !important;
  }
}

/* Final typography standard for all visible section hero titles. */
body[data-page="home"] .search-panel-title,
body[data-page="products"] .hero-product-search h2,
body[data-page="mobile-products"] .hero-product-search h2,
body[data-page="publish"] .search-head h1,
body[data-page="knowledge"] .hero-head h1,
body[data-page="forum"] .hero-shell h1,
body[data-page="demand"] .hero-shell h1 {
  font-size: 38px !important;
  line-height: 1.14 !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
}

body[data-page="home"] .search-panel-copy,
body[data-page="products"] .hero-product-search p,
body[data-page="mobile-products"] .hero-product-search p,
body[data-page="publish"] .search-head p,
body[data-page="knowledge"] .hero-head p,
body[data-page="forum"] .hero-shell p,
body[data-page="demand"] .hero-shell p {
  font-size: 15px !important;
  line-height: 1.72 !important;
  font-weight: 500 !important;
}

@media (max-width: 760px) {
  body[data-page="home"] .search-panel-title,
  body[data-page="products"] .hero-product-search h2,
  body[data-page="mobile-products"] .hero-product-search h2,
  body[data-page="publish"] .search-head h1,
  body[data-page="knowledge"] .hero-head h1,
  body[data-page="forum"] .hero-shell h1,
  body[data-page="demand"] .hero-shell h1 {
    font-size: 32px !important;
    line-height: 1.16 !important;
  }
}

/* Forum needs a stronger community header, not a flat search-style strip. */
body[data-page="forum"] .hero {
  padding-top: 24px !important;
  padding-bottom: 22px !important;
}

body[data-page="forum"] .hero-shell {
  width: min(1280px, calc(100vw - 96px)) !important;
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  min-height: 184px !important;
  padding: 42px 48px !important;
  display: flex !important;
  align-items: center !important;
  border-radius: 34px !important;
  background:
    radial-gradient(circle at 10% 20%, rgba(0,172,235,.24), transparent 32%),
    radial-gradient(circle at 88% 12%, rgba(255, 255, 255, .76), transparent 28%),
    linear-gradient(135deg, rgba(255, 255, 255, .58), rgba(238, 248, 255, .38)) !important;
  border: 1px solid rgba(255, 255, 255, .78) !important;
  box-shadow:
    0 28px 78px rgba(0,172,235,.13),
    inset 0 1px 0 rgba(255, 255, 255, .82) !important;
}

body[data-page="forum"] .hero-shell > div {
  max-width: 980px !important;
}

body[data-page="forum"] .hero-shell h1 {
  margin-bottom: 16px !important;
}

body[data-page="forum"] .hero-shell p {
  max-width: 960px !important;
  margin-bottom: 0 !important;
}

@media (max-width: 760px) {
  body[data-page="forum"] .hero-shell {
    width: min(100vw - 28px, 1280px) !important;
    min-height: auto !important;
    padding: 30px 24px !important;
  }
}

/* Feedback and cooperation pages: readable, balanced Cloud Blue glass. */
body[data-page="suggest"] .hero,
body[data-page="cooperate"] .hero {
  padding: 28px 0 46px !important;
}

body[data-page="suggest"] .hero-card,
body[data-page="cooperate"] .card {
  width: min(1240px, calc(100vw - 96px)) !important;
  max-width: 1240px !important;
  display: grid !important;
  align-items: stretch !important;
  gap: 26px !important;
  padding: 28px !important;
  border-radius: 34px !important;
  background:
    radial-gradient(circle at 8% 18%, rgba(0,172,235,.26), transparent 34%),
    radial-gradient(circle at 86% 8%, rgba(255, 255, 255, .82), transparent 28%),
    linear-gradient(135deg, rgba(255, 255, 255, .58), rgba(238, 248, 255, .40)) !important;
  border: 1px solid rgba(255, 255, 255, .78) !important;
  box-shadow:
    0 28px 78px rgba(0,172,235,.14),
    inset 0 1px 0 rgba(255, 255, 255, .86) !important;
}

body[data-page="suggest"] .hero-card {
  grid-template-columns: minmax(360px, .82fr) minmax(560px, 1.18fr) !important;
}

body[data-page="cooperate"] .card {
  grid-template-columns: minmax(420px, 1fr) 360px !important;
}

body[data-page="suggest"] .hero-copy,
body[data-page="cooperate"] .copy {
  min-height: 100% !important;
  padding: 34px !important;
  border-radius: 28px !important;
  background: linear-gradient(135deg, rgba(255,255,255,.68), rgba(238,248,255,.46)) !important;
  border: 1px solid rgba(255,255,255,.74) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.82) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

body[data-page="suggest"] .hero-copy h1,
body[data-page="cooperate"] .copy h1 {
  color: #142033 !important;
  font-size: 38px !important;
  line-height: 1.14 !important;
  margin: 0 0 16px !important;
  letter-spacing: 0 !important;
}

body[data-page="suggest"] .hero-copy p,
body[data-page="cooperate"] .copy p {
  color: #0a4a63 !important;
  font-size: 15px !important;
  line-height: 1.82 !important;
  margin: 0 !important;
  max-width: 620px !important;
}

body[data-page="suggest"] .hero-copy::after,
body[data-page="cooperate"] .copy::after {
  content: "";
  display: block;
  width: 64px;
  height: 4px;
  margin-top: 28px;
  border-radius: 999px;
  background: linear-gradient(90deg, #00aceb, #6fd4f4);
  box-shadow: 0 12px 28px rgba(0,172,235,.22);
}

body[data-page="suggest"] .form-card,
body[data-page="cooperate"] .qr-card {
  background: rgba(255,255,255,.72) !important;
  border: 1px solid rgba(255,255,255,.82) !important;
  border-radius: 28px !important;
  box-shadow:
    0 22px 64px rgba(0,172,235,.13),
    inset 0 1px 0 rgba(255,255,255,.86) !important;
}

body[data-page="suggest"] .submit-btn,
body[data-page="cooperate"] .download-btn {
  background: linear-gradient(135deg, #00aceb, #6fd4f4) !important;
  box-shadow: 0 14px 34px rgba(0,172,235,.24) !important;
}

@media (max-width: 860px) {
  body[data-page="suggest"] .hero-card,
  body[data-page="cooperate"] .card {
    width: min(100vw - 28px, 1240px) !important;
    grid-template-columns: 1fr !important;
    padding: 18px !important;
    gap: 16px !important;
  }

  body[data-page="suggest"] .hero-copy,
  body[data-page="cooperate"] .copy {
    padding: 24px !important;
  }
}

/* Pagination should read as a secondary control, not a primary action. */
.pagination a,
.pagination span,
.pagination button,
.pager-actions button,
.catalog-page-btn,
.forum-pagination button {
  background: rgba(255, 255, 255, .74) !important;
  color: #0a4a63 !important;
  border: 1px solid rgba(160, 188, 220, .42) !important;
  box-shadow:
    0 10px 26px rgba(0,172,235,.08),
    inset 0 1px 0 rgba(255, 255, 255, .78) !important;
}

.pagination .active,
.pagination a.active,
.pagination span.active,
.pagination button.active,
.pager-actions button.active,
.catalog-page-btn.active,
.forum-pagination button.active {
  background: rgba(255, 255, 255, .92) !important;
  color: #0087b3 !important;
  border-color: rgba(0,172,235,.38) !important;
  font-weight: 800 !important;
  box-shadow:
    0 12px 30px rgba(0,172,235,.12),
    inset 0 1px 0 rgba(255, 255, 255, .92) !important;
}

.pagination a:hover,
.pagination button:hover,
.pager-actions button:hover,
.catalog-page-btn:hover,
.forum-pagination button:hover {
  border-color: rgba(0,172,235,.48) !important;
  color: #0087b3 !important;
  transform: translateY(-1px);
}

.pagination button:disabled,
.pager-actions button:disabled,
.forum-pagination button:disabled {
  opacity: .46 !important;
  cursor: not-allowed !important;
  transform: none !important;
}

/* Keep forum hero aligned with the other top section headers. */
body[data-page="forum"] .hero {
  padding-top: 18px !important;
  padding-bottom: 14px !important;
}

body[data-page="forum"] .hero-shell {
  padding: 28px 36px !important;
  min-height: 0 !important;
}

body[data-page="forum"] .hero-shell h1 {
  margin-top: 0 !important;
  margin-bottom: 12px !important;
}

@media (max-width: 760px) {
  body[data-page="forum"] .hero-shell {
    padding: 24px 22px !important;
  }
}

/* Unified responsive layer for the official URLs.
   This brings the mobile layout back into home/products/publish/... without needing mobile-*.html links. */
@media (max-width: 768px) {
  html {
    min-width: 0 !important;
    scroll-padding-top: 74px !important;
  }

  body:not(.mobile-page) {
    min-width: 0 !important;
    overflow-x: hidden !important;
  }

  body:not(.mobile-page)::before,
  body:not(.mobile-page)::after {
    max-width: 100vw !important;
    overflow: hidden !important;
  }

  body:not(.mobile-page) .container {
    width: calc(100% - 20px) !important;
    max-width: none !important;
    min-width: 0 !important;
  }

  body:not(.mobile-page) .nav {
    top: 0 !important;
    z-index: 1200 !important;
  }

  body:not(.mobile-page) .nav-inner {
    min-height: 58px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: start !important;
    gap: 10px !important;
    padding: 10px 0 8px !important;
  }

  body:not(.mobile-page) .logo {
    width: auto !important;
    min-width: 0 !important;
    gap: 9px !important;
  }

  body:not(.mobile-page) .logo-mark {
    width: 36px !important;
    height: 36px !important;
    flex: 0 0 36px !important;
    border-radius: 10px !important;
  }

  body:not(.mobile-page) .logo-copy strong {
    font-size: 14px !important;
    line-height: 1.2 !important;
  }

  body:not(.mobile-page) .logo-copy span {
    font-size: 11px !important;
  }

  body:not(.mobile-page) .nav-note {
    display: none !important;
  }

  body:not(.mobile-page) .nav-menu {
    order: 3 !important;
    width: 100% !important;
    min-width: 0 !important;
    display: flex !important;
    justify-content: flex-start !important;
    gap: 3px !important;
    padding: 4px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    border: 1px solid rgba(148, 163, 184, .20) !important;
    border-radius: 20px !important;
    background: rgba(255, 255, 255, .86) !important;
    box-shadow: 0 10px 26px rgba(15, 23, 42, .08) !important;
    backdrop-filter: blur(18px) !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
  }

  body:not(.mobile-page) .nav-menu::-webkit-scrollbar {
    display: none !important;
  }

  body:not(.mobile-page) .nav-menu a {
    flex: 0 0 auto !important;
    min-width: 58px !important;
    padding: 10px 12px !important;
    border-radius: 16px !important;
    font-size: 12px !important;
    white-space: nowrap !important;
  }

  body:not(.mobile-page) .hero,
  body:not(.mobile-page) .publish-hero,
  body:not(.mobile-page) .page-stack,
  body:not(.mobile-page) .content,
  body:not(.mobile-page) .layout,
  body:not(.mobile-page) .news-layout {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body:not(.mobile-page) .hero-shell,
  body:not(.mobile-page) .hero-card,
  body:not(.mobile-page) .search-shell,
  body:not(.mobile-page) .section-card,
  body:not(.mobile-page) .panel,
  body:not(.mobile-page) .card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body:not(.mobile-page) .hero-shell,
  body:not(.mobile-page) .hero-card,
  body:not(.mobile-page) .search-shell {
    padding: 24px 22px !important;
    border-radius: 28px !important;
  }

  body:not(.mobile-page) .search-panel,
  body:not(.mobile-page) .hero-search,
  body:not(.mobile-page) .hero-search-form,
  body:not(.mobile-page) .news-search,
  body:not(.mobile-page) .kb-search {
    width: 100% !important;
    max-width: 100% !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  body:not(.mobile-page) .hero-search button,
  body:not(.mobile-page) .hero-search-form button,
  body:not(.mobile-page) .news-search button,
  body:not(.mobile-page) .kb-search button {
    width: 100% !important;
    height: 44px !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-card {
    min-height: auto !important;
    padding: 14px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 48px !important;
    grid-template-rows: auto auto !important;
    gap: 8px 10px !important;
    align-items: center !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-head {
    gap: 10px !important;
    min-width: 0 !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-icon {
    width: 40px !important;
    height: 40px !important;
    flex-basis: 40px !important;
    border-radius: 12px !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-card strong {
    font-size: 16px !important;
    margin-bottom: 3px !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-card p {
    font-size: 12px !important;
    line-height: 1.5 !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-points {
    display: none !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-actions {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    display: grid !important;
    place-items: center !important;
    justify-self: end !important;
    width: 48px !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-actions a {
    width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 !important;
    border-radius: 13px !important;
    font-size: 0 !important;
    line-height: 1 !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-actions a::after {
    content: "→" !important;
    font-size: 22px !important;
    font-weight: 800 !important;
  }

  body[data-page="products"]:not(.mobile-page) .result-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  body[data-page="products"]:not(.mobile-page) .product-spec-board {
    display: none !important;
  }

  body[data-page="products"]:not(.mobile-page) .product-card-main {
    grid-template-columns: 82px minmax(0, 1fr) !important;
    gap: 10px !important;
  }

  body[data-page="products"]:not(.mobile-page) .product-visual-wrap,
  body[data-page="products"]:not(.mobile-page) .product-visual {
    width: 82px !important;
  }

  body[data-page="products"]:not(.mobile-page) .product-visual {
    height: 82px !important;
    min-height: 82px !important;
  }

  body[data-page="products"]:not(.mobile-page) .product-summary {
    -webkit-line-clamp: 2 !important;
    font-size: 12px !important;
    line-height: 1.48 !important;
  }

  body[data-page="products"]:not(.mobile-page) .product-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 6px !important;
    padding-top: 8px !important;
  }

  body[data-page="products"]:not(.mobile-page) .product-actions .primary-btn,
  body[data-page="products"]:not(.mobile-page) .product-actions .compare-inline-btn {
    width: 100% !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 4px !important;
    border-radius: 10px !important;
    font-size: 12px !important;
    font-weight: 800 !important;
  }

  body[data-page="publish"]:not(.mobile-page) .news-layout,
  body[data-page="knowledge"]:not(.mobile-page) .term-grid,
  body[data-page="forum"]:not(.mobile-page) .layout,
  body[data-page="demand"]:not(.mobile-page) .page-grid,
  body[data-page="suggest"]:not(.mobile-page) .hero-card,
  body[data-page="cooperate"]:not(.mobile-page) .card {
    grid-template-columns: 1fr !important;
  }

  body[data-page="suggest"]:not(.mobile-page) .form-grid,
  body[data-page="demand"]:not(.mobile-page) .type-grid,
  body[data-page="demand"]:not(.mobile-page) .inline-grid,
  body[data-page="demand"]:not(.mobile-page) .region-grid {
    grid-template-columns: 1fr !important;
  }

  body[data-page="suggest"]:not(.mobile-page) .field.wide {
    grid-column: auto !important;
  }

  body[data-page="suggest"]:not(.mobile-page) .submit-row {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  body[data-page="suggest"]:not(.mobile-page) .submit-btn {
    width: 100% !important;
  }
}

/* Product filter chips use the same secondary white style as pagination. */
body[data-page="products"] .filter-panel .filter-chip {
  background: rgba(255, 255, 255, .76) !important;
  color: #0a4a63 !important;
  border: 1px solid rgba(160, 188, 220, .42) !important;
  box-shadow:
    0 10px 24px rgba(0,172,235,.07),
    inset 0 1px 0 rgba(255, 255, 255, .82) !important;
}

body[data-page="products"] .filter-panel .filter-chip.active {
  background: rgba(255, 255, 255, .94) !important;
  color: #0087b3 !important;
  border-color: rgba(0,172,235,.38) !important;
  font-weight: 800 !important;
  box-shadow:
    0 12px 30px rgba(0,172,235,.12),
    inset 0 1px 0 rgba(255, 255, 255, .94) !important;
}

body[data-page="products"] .filter-panel .filter-chip:hover {
  color: #0087b3 !important;
  border-color: rgba(0,172,235,.48) !important;
}

/* Mobile-only compact home layout. Official URLs adapt by viewport; mobile-*.html keeps
   the same compact presentation even when opened inside a desktop browser. */
@media (max-width: 768px) {
  body:not(.mobile-page) .nav-menu {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 2px !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 4px !important;
    overflow: visible !important;
  }

  body:not(.mobile-page) .nav-menu a {
    min-width: 0 !important;
    width: auto !important;
    justify-content: center !important;
    padding: 8px 2px !important;
    font-size: 9.5px !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-card {
    grid-template-columns: minmax(0, 1fr) 38px !important;
    align-items: center !important;
    gap: 8px !important;
    min-height: 104px !important;
    padding: 12px !important;
    border-radius: 20px !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-head {
    gap: 8px !important;
    align-items: flex-start !important;
    min-width: 0 !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-icon {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    border-radius: 11px !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-card strong {
    font-size: 13px !important;
    line-height: 1.15 !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-card p {
    display: -webkit-box !important;
    overflow: hidden !important;
    margin-top: 4px !important;
    font-size: 10.5px !important;
    line-height: 1.35 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-actions {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 38px !important;
    align-self: center !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-actions a {
    width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    border-radius: 13px !important;
  }

  body[data-page="home"]:not(.mobile-page) .section-card:has(.news-grid) .news-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  body[data-page="home"]:not(.mobile-page) .section-card:has(.news-grid) .news-item {
    min-height: auto !important;
    padding: 10px !important;
    border-radius: 14px !important;
  }

  body[data-page="home"]:not(.mobile-page) .section-card:has(.news-grid) .news-item h4 {
    margin-bottom: 4px !important;
    font-size: 11.5px !important;
    line-height: 1.25 !important;
  }

  body[data-page="home"]:not(.mobile-page) .section-card:has(.news-grid) .news-item p {
    display: -webkit-box !important;
    overflow: hidden !important;
    font-size: 9.5px !important;
    line-height: 1.35 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 3 !important;
  }
}

body.mobile-page .nav-menu {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 2px !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 4px !important;
  overflow: visible !important;
}

body.mobile-page .nav-menu a {
  min-width: 0 !important;
  width: auto !important;
  justify-content: center !important;
  padding: 8px 2px !important;
  font-size: 9.5px !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
}

body.mobile-page[data-page="home"] .portal-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

body.mobile-page[data-page="home"] .portal-card {
  grid-template-columns: minmax(0, 1fr) 38px !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 104px !important;
  padding: 12px !important;
  border-radius: 18px !important;
}

body.mobile-page[data-page="home"] .portal-head {
  gap: 8px !important;
  align-items: flex-start !important;
  min-width: 0 !important;
}

body.mobile-page[data-page="home"] .portal-icon {
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  border-radius: 11px !important;
}

body.mobile-page[data-page="home"] .portal-card strong {
  font-size: 13px !important;
  line-height: 1.15 !important;
}

body.mobile-page[data-page="home"] .portal-card p {
  display: -webkit-box !important;
  overflow: hidden !important;
  margin-top: 4px !important;
  font-size: 10.5px !important;
  line-height: 1.35 !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

body.mobile-page[data-page="home"] .portal-actions {
  grid-column: 2 !important;
  grid-row: 1 !important;
  width: 38px !important;
  align-self: center !important;
}

body.mobile-page[data-page="home"] .portal-actions a {
  width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  border-radius: 13px !important;
}

body.mobile-page[data-page="home"] .section-card:has(.news-grid) .news-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body.mobile-page[data-page="home"] .section-card:has(.news-grid) .news-item {
  min-height: auto !important;
  padding: 10px !important;
  border-radius: 14px !important;
}

body.mobile-page[data-page="home"] .section-card:has(.news-grid) .news-item h4 {
  margin-bottom: 4px !important;
  font-size: 11.5px !important;
  line-height: 1.25 !important;
}

body.mobile-page[data-page="home"] .section-card:has(.news-grid) .news-item p {
  display: -webkit-box !important;
  overflow: hidden !important;
  font-size: 9.5px !important;
  line-height: 1.35 !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
}

/* Mobile content-map refinement: use the reserved blank area for copy instead of
   clipping descriptions while cards still look empty. */
@media (max-width: 768px) {
  body[data-page="home"]:not(.mobile-page) .portal-card {
    min-height: 0 !important;
    padding: 10px !important;
    align-items: center !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-card p {
    min-height: 40px !important;
    font-size: 10px !important;
    line-height: 1.36 !important;
    -webkit-line-clamp: 3 !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-icon {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-actions a {
    width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
  }
}

body.mobile-page[data-page="home"] .portal-card {
  min-height: 0 !important;
  padding: 10px !important;
  align-items: center !important;
}

body.mobile-page[data-page="home"] .portal-card p {
  min-height: 40px !important;
  font-size: 10px !important;
  line-height: 1.36 !important;
  -webkit-line-clamp: 3 !important;
}

body.mobile-page[data-page="home"] .portal-icon {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
}

body.mobile-page[data-page="home"] .portal-actions a {
  width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
}

.search-result-tabs {
  display: none;
}

@media (max-width: 768px) {
  body:not(.mobile-page) .nav-menu a {
    font-size: 10.5px !important;
    padding-inline: 1px !important;
  }

  body:not(.mobile-page) .search-result-tabs {
    display: flex !important;
    gap: 6px !important;
    overflow-x: auto !important;
    padding: 2px 0 10px !important;
    margin: 4px 0 10px !important;
    scrollbar-width: none !important;
  }

  body:not(.mobile-page) .search-result-tabs::-webkit-scrollbar {
    display: none !important;
  }

  body:not(.mobile-page) .search-result-tabs button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    min-width: max-content !important;
    height: 30px !important;
    padding: 0 11px !important;
    border: 1px solid rgba(160, 188, 220, .42) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, .76) !important;
    color: #0a4a63 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    box-shadow:
      0 10px 22px rgba(0,172,235,.08),
      inset 0 1px 0 rgba(255, 255, 255, .86) !important;
  }

  body:not(.mobile-page) .search-result-tabs button.active {
    background: rgba(255, 255, 255, .96) !important;
    color: #0087b3 !important;
    border-color: rgba(0,172,235,.38) !important;
  }

  body:not(.mobile-page) .search-result-tabs span {
    color: #7c8da2 !important;
    font-size: 10px !important;
    font-weight: 800 !important;
  }

  body:not(.mobile-page) .search-group[hidden] {
    display: none !important;
  }
}

body.mobile-page .nav-menu a {
  font-size: 13px !important;
  padding-inline: 1px !important;
}

body.mobile-page .search-result-tabs {
  display: flex !important;
  gap: 6px !important;
  overflow-x: auto !important;
  padding: 2px 0 10px !important;
  margin: 4px 0 10px !important;
  scrollbar-width: none !important;
}

body.mobile-page .search-result-tabs::-webkit-scrollbar {
  display: none !important;
}

body.mobile-page .search-result-tabs button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  min-width: max-content !important;
  height: 30px !important;
  padding: 0 11px !important;
  border: 1px solid rgba(160, 188, 220, .42) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, .76) !important;
  color: #0a4a63 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  box-shadow:
    0 10px 22px rgba(0,172,235,.08),
    inset 0 1px 0 rgba(255, 255, 255, .86) !important;
}

body.mobile-page .search-result-tabs button.active {
  background: rgba(255, 255, 255, .96) !important;
  color: #0087b3 !important;
  border-color: rgba(0,172,235,.38) !important;
}

body.mobile-page .search-result-tabs span {
  color: #7c8da2 !important;
  font-size: 10px !important;
  font-weight: 800 !important;
}

body.mobile-page .search-group[hidden] {
  display: none !important;
}

.section-head p:empty {
  display: none !important;
}

@media (max-width: 768px) {
  body[data-page="home"]:not(.mobile-page) .portal-card p,
  body[data-page="home"]:not(.mobile-page) .section-card:has(.news-grid) .news-item p {
    display: block !important;
    overflow: visible !important;
    -webkit-box-orient: initial !important;
    -webkit-line-clamp: initial !important;
  }

  body[data-page="home"]:not(.mobile-page) .section-card:has(.news-grid) .news-item {
    padding: 10px 8px !important;
  }

  body[data-page="home"]:not(.mobile-page) .section-card:has(.news-grid) .news-item p {
    font-size: 9.5px !important;
    line-height: 1.42 !important;
  }
}

body.mobile-page[data-page="home"] .portal-card p,
body.mobile-page[data-page="home"] .section-card:has(.news-grid) .news-item p {
  display: block !important;
  overflow: visible !important;
  -webkit-box-orient: initial !important;
  -webkit-line-clamp: initial !important;
}

body.mobile-page[data-page="home"] .section-card:has(.news-grid) .news-item {
  padding: 10px 8px !important;
}

body.mobile-page[data-page="home"] .section-card:has(.news-grid) .news-item p {
  font-size: 9.5px !important;
  line-height: 1.42 !important;
}

/* Mobile card balance pass: keep the home entry cards legible and make product
   cards read as compact two-column tiles instead of squeezed left/right rows. */
@media (max-width: 768px) {
  body[data-page="home"]:not(.mobile-page) .portal-card,
  body.mobile-page[data-page="home"] .portal-card {
    display: grid !important;
    grid-template-columns: 28px minmax(0, 1fr) 34px !important;
    grid-template-rows: auto auto !important;
    align-items: center !important;
    gap: 6px 8px !important;
    padding: 11px !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-head,
  body.mobile-page[data-page="home"] .portal-head,
  body[data-page="home"]:not(.mobile-page) .portal-head > div,
  body.mobile-page[data-page="home"] .portal-head > div {
    display: contents !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-icon,
  body.mobile-page[data-page="home"] .portal-icon {
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-self: center !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-card strong,
  body.mobile-page[data-page="home"] .portal-card strong {
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: center !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-card p,
  body.mobile-page[data-page="home"] .portal-card p {
    grid-column: 1 / 4 !important;
    grid-row: 2 !important;
    min-height: 0 !important;
    margin: 0 !important;
    font-size: 10px !important;
    line-height: 1.42 !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-actions,
  body.mobile-page[data-page="home"] .portal-actions {
    grid-column: 3 !important;
    grid-row: 1 !important;
    width: 34px !important;
    justify-self: end !important;
  }

  body[data-page="home"]:not(.mobile-page) .portal-actions a,
  body.mobile-page[data-page="home"] .portal-actions a {
    width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
    border-radius: 12px !important;
  }

  body[data-page="products"]:not(.mobile-page) .result-product-grid,
  body.mobile-page[data-page="products"] .result-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  body[data-page="products"]:not(.mobile-page) .result-product-grid .product-card,
  body.mobile-page[data-page="products"] .result-product-grid .product-card {
    min-width: 0 !important;
    padding: 10px !important;
    border-radius: 18px !important;
    gap: 8px !important;
  }

  body[data-page="products"]:not(.mobile-page) .result-product-grid .product-card-main,
  body.mobile-page[data-page="products"] .result-product-grid .product-card-main {
    display: block !important;
  }

  body[data-page="products"]:not(.mobile-page) .result-product-grid .product-visual-wrap,
  body[data-page="products"]:not(.mobile-page) .result-product-grid .product-visual,
  body.mobile-page[data-page="products"] .result-product-grid .product-visual-wrap,
  body.mobile-page[data-page="products"] .result-product-grid .product-visual {
    width: 100% !important;
  }

  body[data-page="products"]:not(.mobile-page) .result-product-grid .product-visual,
  body.mobile-page[data-page="products"] .result-product-grid .product-visual {
    height: 104px !important;
    min-height: 104px !important;
    border-radius: 14px !important;
  }

  body[data-page="products"]:not(.mobile-page) .result-product-grid .product-visual img,
  body.mobile-page[data-page="products"] .result-product-grid .product-visual img {
    max-width: 86% !important;
    max-height: 88% !important;
    object-fit: contain !important;
  }

  body[data-page="products"]:not(.mobile-page) .result-product-grid .product-brand,
  body.mobile-page[data-page="products"] .result-product-grid .product-brand {
    margin-top: 8px !important;
    font-size: 11px !important;
  }

  body[data-page="products"]:not(.mobile-page) .result-product-grid .product-name,
  body.mobile-page[data-page="products"] .result-product-grid .product-name {
    display: -webkit-box !important;
    overflow: hidden !important;
    min-height: 36px !important;
    margin: 2px 0 4px !important;
    font-size: 14px !important;
    line-height: 1.28 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
  }

  body[data-page="products"]:not(.mobile-page) .result-product-grid .product-summary,
  body.mobile-page[data-page="products"] .result-product-grid .product-summary {
    display: none !important;
  }

  body[data-page="products"]:not(.mobile-page) .result-product-grid .product-tags,
  body.mobile-page[data-page="products"] .result-product-grid .product-tags {
    max-height: 50px !important;
    overflow: hidden !important;
    margin-top: 7px !important;
    gap: 4px !important;
  }

  body[data-page="products"]:not(.mobile-page) .result-product-grid .product-tags span,
  body.mobile-page[data-page="products"] .result-product-grid .product-tags span {
    height: 22px !important;
    padding: 0 6px !important;
    font-size: 10px !important;
  }

  body[data-page="products"]:not(.mobile-page) .result-product-grid .product-actions.compare-inline-actions,
  body.mobile-page[data-page="products"] .result-product-grid .product-actions.compare-inline-actions {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
    padding-top: 8px !important;
  }

  body[data-page="products"]:not(.mobile-page) .result-product-grid .product-actions .primary-btn,
  body[data-page="products"]:not(.mobile-page) .result-product-grid .product-actions .compare-inline-btn,
  body.mobile-page[data-page="products"] .result-product-grid .product-actions .primary-btn,
  body.mobile-page[data-page="products"] .result-product-grid .product-actions .compare-inline-btn {
    width: 100% !important;
    height: 30px !important;
    min-height: 30px !important;
    padding: 0 4px !important;
    border-radius: 10px !important;
    font-size: 11px !important;
  }
}

/* Final mobile layout pass, loaded after all theme layers. */
@media (max-width: 760px) {
  html,
  body {
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  body.mobile-page {
    width: 100% !important;
    max-width: 390px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  body.mobile-page .container,
  body[data-page="home"] .container,
  body[data-page="products"] .container {
    width: calc(100% - 28px) !important;
    max-width: calc(100% - 28px) !important;
  }

  body.mobile-page .nav-inner {
    padding: 10px 0 8px !important;
    gap: 8px !important;
  }

  body.mobile-page .nav-menu {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    width: 100% !important;
    gap: 4px !important;
    overflow: visible !important;
    padding: 4px !important;
  }

  body.mobile-page .nav-menu a {
    min-width: 0 !important;
    padding: 8px 4px !important;
    border-radius: 14px !important;
    font-size: 11px !important;
    line-height: 1.1 !important;
    text-align: center !important;
    white-space: nowrap !important;
  }

  body.mobile-page .nav-menu a.active::after {
    display: none !important;
  }

  body.mobile-page[data-page="home"] .portal-grid,
  body[data-page="home"] .portal-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  body.mobile-page[data-page="home"] .portal-card,
  body[data-page="home"] .portal-card {
    min-height: 94px !important;
    padding: 10px !important;
    border-radius: 18px !important;
    display: grid !important;
    grid-template-columns: 28px minmax(0, 1fr) 32px !important;
    grid-template-rows: auto 1fr !important;
    align-items: center !important;
    gap: 6px 7px !important;
  }

  body.mobile-page[data-page="home"] .portal-head,
  body[data-page="home"] .portal-head,
  body.mobile-page[data-page="home"] .portal-head > div,
  body[data-page="home"] .portal-head > div {
    display: contents !important;
  }

  body.mobile-page[data-page="home"] .portal-icon,
  body[data-page="home"] .portal-icon {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 28px !important;
    height: 28px !important;
    flex-basis: 28px !important;
    border-radius: 10px !important;
  }

  body.mobile-page[data-page="home"] .portal-icon svg,
  body[data-page="home"] .portal-icon svg {
    width: 17px !important;
    height: 17px !important;
  }

  body.mobile-page[data-page="home"] .portal-card strong,
  body[data-page="home"] .portal-card strong {
    grid-column: 2 !important;
    grid-row: 1 !important;
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 1.2 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body.mobile-page[data-page="home"] .portal-card p,
  body[data-page="home"] .portal-card p {
    grid-column: 1 / 4 !important;
    grid-row: 2 !important;
    margin: 0 !important;
    font-size: 10px !important;
    line-height: 1.35 !important;
    display: -webkit-box !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
  }

  body.mobile-page[data-page="home"] .portal-actions,
  body[data-page="home"] .portal-actions {
    grid-column: 3 !important;
    grid-row: 1 !important;
    width: 32px !important;
    justify-self: end !important;
  }

  body.mobile-page[data-page="home"] .portal-actions a,
  body[data-page="home"] .portal-actions a {
    width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
    border-radius: 11px !important;
  }

  body.mobile-page[data-page="home"] .portal-actions a::after,
  body[data-page="home"] .portal-actions a::after {
    font-size: 18px !important;
  }

  body.mobile-page[data-page="products"] .result-product-grid,
  body[data-page="products"] .result-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  body.mobile-page[data-page="products"] .section-head,
  body[data-page="products"] .section-head {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    align-items: start !important;
  }

  body.mobile-page[data-page="products"] .list-tools,
  body[data-page="products"] .list-tools {
    display: flex !important;
    width: 100% !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
  }

  body.mobile-page[data-page="products"] .filter-toggle,
  body.mobile-page[data-page="products"] .result-count-badge,
  body[data-page="products"] .filter-toggle,
  body[data-page="products"] .result-count-badge {
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 12px !important;
    border-radius: 999px !important;
    font-size: 12px !important;
    white-space: nowrap !important;
  }

  body.mobile-page[data-page="products"] .result-count-badge,
  body[data-page="products"] .result-count-badge {
    max-width: none !important;
    flex: 0 0 auto !important;
  }

  body.mobile-page[data-page="products"] .result-product-grid .product-card,
  body[data-page="products"] .result-product-grid .product-card {
    min-width: 0 !important;
    padding: 9px !important;
    border-radius: 18px !important;
    gap: 7px !important;
  }

  body.mobile-page[data-page="products"] .result-product-grid .product-card-main,
  body[data-page="products"] .result-product-grid .product-card-main {
    display: block !important;
  }

  body.mobile-page[data-page="products"] .result-product-grid .product-visual-wrap,
  body.mobile-page[data-page="products"] .result-product-grid .product-visual,
  body[data-page="products"] .result-product-grid .product-visual-wrap,
  body[data-page="products"] .result-product-grid .product-visual {
    width: 100% !important;
  }

  body.mobile-page[data-page="products"] .result-product-grid .product-visual,
  body[data-page="products"] .result-product-grid .product-visual {
    height: 74px !important;
    min-height: 74px !important;
    border-radius: 13px !important;
  }

  body.mobile-page[data-page="products"] .result-product-grid .product-visual img,
  body[data-page="products"] .result-product-grid .product-visual img {
    max-width: 80% !important;
    max-height: 84% !important;
    object-fit: contain !important;
  }

  body.mobile-page[data-page="products"] .result-product-grid .product-body,
  body[data-page="products"] .result-product-grid .product-body {
    padding-right: 0 !important;
  }

  body.mobile-page[data-page="products"] .result-product-grid .product-brand,
  body[data-page="products"] .result-product-grid .product-brand {
    margin-top: 7px !important;
    font-size: 10.5px !important;
    line-height: 1.25 !important;
  }

  body.mobile-page[data-page="products"] .result-product-grid .product-name,
  body[data-page="products"] .result-product-grid .product-name {
    display: -webkit-box !important;
    min-height: auto !important;
    margin: 2px 0 4px !important;
    overflow: hidden !important;
    font-size: 13.5px !important;
    line-height: 1.22 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
  }

  body.mobile-page[data-page="products"] .result-product-grid .product-summary,
  body[data-page="products"] .result-product-grid .product-summary {
    display: -webkit-box !important;
    margin: 0 0 6px !important;
    overflow: hidden !important;
    color: #0a4a63 !important;
    font-size: 10.5px !important;
    line-height: 1.38 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
  }

  body.mobile-page[data-page="products"] .result-product-grid .product-tags,
  body[data-page="products"] .result-product-grid .product-tags {
    max-height: 22px !important;
    overflow: hidden !important;
    margin-top: 5px !important;
    gap: 4px !important;
  }

  body.mobile-page[data-page="products"] .result-product-grid .product-tags span,
  body[data-page="products"] .result-product-grid .product-tags span {
    height: 21px !important;
    padding: 0 6px !important;
    font-size: 10px !important;
  }

  body.mobile-page[data-page="products"] .result-product-grid .product-actions.compare-inline-actions,
  body[data-page="products"] .result-product-grid .product-actions.compare-inline-actions {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
    padding-top: 6px !important;
  }

  body.mobile-page[data-page="products"] .result-product-grid .product-actions .primary-btn,
  body.mobile-page[data-page="products"] .result-product-grid .product-actions .compare-inline-btn,
  body[data-page="products"] .result-product-grid .product-actions .primary-btn,
  body[data-page="products"] .result-product-grid .product-actions .compare-inline-btn {
    width: 100% !important;
    height: 28px !important;
    min-height: 28px !important;
    padding: 0 4px !important;
    border-radius: 10px !important;
    font-size: 11px !important;
  }
}

/* Final mobile gutter normalization.
   Keep every mobile page and every official URL at the same visual width so the
   right side does not leave a wider blank area than the left side. */
@media (max-width: 768px) {
  html,
  body {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
  }

  *,
  *::before,
  *::after {
    box-sizing: border-box !important;
  }

  body.mobile-page,
  body:not(.mobile-page) {
    width: min(100%, 390px) !important;
    max-width: 390px !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    padding-inline: 0 !important;
    overflow-x: hidden !important;
  }

  body.mobile-page main,
  body.mobile-page header,
  body.mobile-page footer,
  body.mobile-page section,
  body:not(.mobile-page) main,
  body:not(.mobile-page) header,
  body:not(.mobile-page) footer,
  body:not(.mobile-page) section {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-inline: 0 !important;
    overflow-x: clip !important;
  }

  body.mobile-page .container {
    width: calc(100% - 20px) !important;
    max-width: 390px !important;
    min-width: 0 !important;
    margin-inline: auto !important;
    padding-inline: 0 !important;
  }

  body:not(.mobile-page) .container {
    width: calc(100% - 20px) !important;
    max-width: calc(100% - 20px) !important;
    min-width: 0 !important;
    margin-inline: auto !important;
    padding-inline: 0 !important;
  }

  body.mobile-page .nav-inner,
  body:not(.mobile-page) .nav-inner {
    width: calc(100% - 20px) !important;
    max-width: 390px !important;
    margin-inline: auto !important;
    padding-inline: 0 !important;
  }

  body.mobile-page .hero-shell,
  body.mobile-page .hero-card,
  body.mobile-page .search-shell,
  body.mobile-page .section-card,
  body.mobile-page .panel,
  body.mobile-page .card,
  body.mobile-page .content-stack,
  body.mobile-page .page-stack,
  body.mobile-page .layout,
  body.mobile-page .page-grid,
  body.mobile-page .news-layout,
  body:not(.mobile-page) .hero-shell,
  body:not(.mobile-page) .hero-card,
  body:not(.mobile-page) .search-shell,
  body:not(.mobile-page) .section-card,
  body:not(.mobile-page) .panel,
  body:not(.mobile-page) .card,
  body:not(.mobile-page) .content-stack,
  body:not(.mobile-page) .page-stack,
  body:not(.mobile-page) .layout,
  body:not(.mobile-page) .page-grid,
  body:not(.mobile-page) .news-layout {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-inline: 0 !important;
  }

  body.mobile-page .portal-grid,
  body.mobile-page .result-product-grid,
  body.mobile-page .news-grid,
  body.mobile-page .term-grid,
  body.mobile-page .filter-row,
  body.mobile-page .type-grid,
  body.mobile-page .inline-grid,
  body.mobile-page .region-grid,
  body:not(.mobile-page) .portal-grid,
  body:not(.mobile-page) .result-product-grid,
  body:not(.mobile-page) .news-grid,
  body:not(.mobile-page) .term-grid,
  body:not(.mobile-page) .filter-row,
  body:not(.mobile-page) .type-grid,
  body:not(.mobile-page) .inline-grid,
  body:not(.mobile-page) .region-grid {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  body.mobile-page .container.hero-shell,
  body.mobile-page .container.hero-card,
  body.mobile-page .container.search-shell,
  body.mobile-page .container.section-card,
  body.mobile-page .container.panel,
  body.mobile-page .container.card,
  body.mobile-page .container.page-grid,
  body.mobile-page .container.page-stack,
  body.mobile-page .container.content-stack,
  body.mobile-page .container.layout,
  body.mobile-page .container.news-layout {
    width: calc(100% - 20px) !important;
    max-width: 390px !important;
    margin-inline: auto !important;
  }

  body:not(.mobile-page) .container.hero-shell,
  body:not(.mobile-page) .container.hero-card,
  body:not(.mobile-page) .container.search-shell,
  body:not(.mobile-page) .container.section-card,
  body:not(.mobile-page) .container.panel,
  body:not(.mobile-page) .container.card,
  body:not(.mobile-page) .container.page-grid,
  body:not(.mobile-page) .container.page-stack,
  body:not(.mobile-page) .container.content-stack,
  body:not(.mobile-page) .container.layout,
  body:not(.mobile-page) .container.news-layout {
    width: calc(100% - 20px) !important;
    max-width: calc(100% - 20px) !important;
    margin-inline: auto !important;
  }

  body.mobile-page .floating-action-entry {
    right: max(14px, calc(100vw - 390px + 14px)) !important;
  }
}

/* Mobile dedicated URLs: keep mobile geometry even when opened in a desktop browser.
   The user previews mobile-*.html on PC, so these pages must not inherit desktop widths. */
body.mobile-page {
  width: min(100%, 390px) !important;
  max-width: 390px !important;
  min-width: 0 !important;
  margin-left: 0 !important;
  margin-right: auto !important;
  padding-inline: 0 !important;
  overflow-x: hidden !important;
}

body.mobile-page main,
body.mobile-page header,
body.mobile-page footer,
body.mobile-page section {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin-inline: 0 !important;
  overflow-x: clip !important;
}

body.mobile-page .container,
body.mobile-page .nav-inner,
body.mobile-page .container.hero-shell,
body.mobile-page .container.hero-card,
body.mobile-page .container.search-shell,
body.mobile-page .container.section-card,
body.mobile-page .container.panel,
body.mobile-page .container.card,
body.mobile-page .container.page-grid,
body.mobile-page .container.page-stack,
body.mobile-page .container.content-stack,
body.mobile-page .container.layout,
body.mobile-page .container.news-layout {
  width: calc(100% - 20px) !important;
  max-width: 370px !important;
  min-width: 0 !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
}

body.mobile-page .hero,
body.mobile-page .publish-hero,
body.mobile-page .page-stack,
body.mobile-page .content,
body.mobile-page .layout,
body.mobile-page .news-layout {
  padding-top: 12px !important;
}

body.mobile-page .hero-card,
body.mobile-page .hero-shell,
body.mobile-page .search-shell {
  padding: 18px 16px !important;
  min-height: 0 !important;
  border-radius: 24px !important;
}

body.mobile-page .hero-card h1,
body.mobile-page .hero-shell h1,
body.mobile-page .search-shell h1,
body.mobile-page .hero-copy h1,
body.mobile-page .hero-head h1,
body.mobile-page .search-head h1,
body.mobile-page .search-panel-title,
body.mobile-page .hero-product-search h2 {
  margin: 0 0 8px !important;
  font-size: 22px !important;
  line-height: 1.18 !important;
  letter-spacing: 0 !important;
}

body.mobile-page .hero-card p,
body.mobile-page .hero-shell p,
body.mobile-page .search-shell p,
body.mobile-page .hero-copy p,
body.mobile-page .hero-head p,
body.mobile-page .search-head p,
body.mobile-page .search-panel-copy,
body.mobile-page .hero-product-search p {
  margin: 0 0 12px !important;
  max-width: 100% !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

body.mobile-page .search-panel,
body.mobile-page .hero-head,
body.mobile-page .search-head,
body.mobile-page .hero-product-search {
  display: block !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.mobile-page .hero-search,
body.mobile-page .hero-search-form,
body.mobile-page .news-search,
body.mobile-page .kb-search {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 118px !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 10px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.mobile-page .hero-search input,
body.mobile-page .hero-search-form input,
body.mobile-page .news-search input,
body.mobile-page .kb-search input,
body.mobile-page .hero-search button,
body.mobile-page .hero-search-form button,
body.mobile-page .news-search button,
body.mobile-page .kb-search button {
  height: 48px !important;
  min-height: 48px !important;
  border-radius: 14px !important;
}

body.mobile-page .hero-search input,
body.mobile-page .hero-search-form input,
body.mobile-page .news-search input,
body.mobile-page .kb-search input {
  min-width: 0 !important;
  padding: 0 14px !important;
  font-size: 16px !important;
}

body.mobile-page .hero-search button,
body.mobile-page .hero-search-form button,
body.mobile-page .news-search button,
body.mobile-page .kb-search button {
  width: 100% !important;
  padding: 0 10px !important;
  font-size: 14px !important;
  white-space: nowrap !important;
}

body.mobile-page .hero-badge,
body.mobile-page .source-count {
  display: none !important;
}

body.mobile-page[data-page="knowledge"] .filter-row {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 6px !important;
  margin-top: 10px !important;
  padding: 0 0 2px !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
}

body.mobile-page[data-page="knowledge"] .filter-row::-webkit-scrollbar {
  display: none !important;
}

body.mobile-page[data-page="knowledge"] .filter-chip {
  flex: 0 0 auto !important;
  height: 28px !important;
  padding: 0 8px !important;
  font-size: 11px !important;
  white-space: nowrap !important;
}

body.mobile-page[data-page="forum"] .hero-shell {
  display: block !important;
  grid-template-columns: 1fr !important;
  overflow: hidden !important;
}

body.mobile-page[data-page="forum"] .hero-shell > div {
  max-width: 100% !important;
  min-width: 0 !important;
}

/* Knowledge-base category controls use the same quiet secondary action style as "加入对比". */
body[data-page="knowledge"] #category-filters .filter-chip {
  background: rgba(255,255,255,.50) !important;
  color: #003b52 !important;
  border: 1px solid rgba(0,172,235,.34) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.68), 0 10px 24px rgba(0,46,61,.06) !important;
  font-weight: 700 !important;
}

body[data-page="knowledge"] #category-filters .filter-chip.active {
  background: rgba(255,255,255,.76) !important;
  color: #003b52 !important;
  border-color: rgba(0,172,235,.64) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.78), 0 10px 24px rgba(0,46,61,.08) !important;
}

body.mobile-page[data-page="forum"] .hero-shell p {
  margin-bottom: 0 !important;
}

body.mobile-page[data-page="home"] .hero-shell .hero-search,
body.mobile-page[data-page="products"] .hero-card .hero-product-search .hero-search-form,
body.mobile-page[data-page="publish"] .search-shell .news-search,
body.mobile-page[data-page="knowledge"] .hero-shell .kb-search {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 96px !important;
  align-items: stretch !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 10px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.mobile-page[data-page="home"] .hero-shell .hero-search input,
body.mobile-page[data-page="products"] .hero-card .hero-product-search .hero-search-form input,
body.mobile-page[data-page="publish"] .search-shell .news-search input,
body.mobile-page[data-page="knowledge"] .hero-shell .kb-search input,
body.mobile-page[data-page="home"] .hero-shell .hero-search button,
body.mobile-page[data-page="products"] .hero-card .hero-product-search .hero-search-form button,
body.mobile-page[data-page="publish"] .search-shell .news-search button,
body.mobile-page[data-page="knowledge"] .hero-shell .kb-search button {
  width: 100% !important;
  min-width: 0 !important;
  height: 48px !important;
  min-height: 48px !important;
  padding-block: 0 !important;
  border-radius: 14px !important;
}

/* Mobile rhythm: keep text from visually sticking to the next card/control. */
body.mobile-page .hero-card p,
body.mobile-page .hero-shell p,
body.mobile-page .search-shell p,
body.mobile-page .hero-copy p,
body.mobile-page .hero-head p,
body.mobile-page .search-head p,
body.mobile-page .search-panel-copy,
body.mobile-page .hero-product-search p {
  margin-bottom: 16px !important;
}

body.mobile-page[data-page="forum"] .hero-shell p,
body.mobile-page[data-page="demand"] .hero-shell p {
  margin-bottom: 0 !important;
}

body.mobile-page .hero-search,
body.mobile-page .hero-search-form,
body.mobile-page .news-search,
body.mobile-page .kb-search,
body.mobile-page[data-page="home"] .hero-shell .hero-search,
body.mobile-page[data-page="products"] .hero-card .hero-product-search .hero-search-form,
body.mobile-page[data-page="publish"] .search-shell .news-search,
body.mobile-page[data-page="knowledge"] .hero-shell .kb-search {
  margin-top: 14px !important;
}

body.mobile-page .section-card > h2,
body.mobile-page .section-card > h3,
body.mobile-page .panel > h2,
body.mobile-page .panel > h3,
body.mobile-page .card > h2,
body.mobile-page .card > h3 {
  margin-bottom: 8px !important;
}

body.mobile-page .section-card > p,
body.mobile-page .panel > p,
body.mobile-page .card > p {
  margin-bottom: 16px !important;
}

body.mobile-page .section-head {
  margin-bottom: 16px !important;
}

body.mobile-page[data-page="home"] .portal-grid,
body.mobile-page .result-product-grid,
body.mobile-page .news-grid,
body.mobile-page .term-grid {
  margin-top: 14px !important;
}

body.mobile-page[data-page="knowledge"] .filter-row {
  margin-top: 12px !important;
  gap: 5px !important;
}

body.mobile-page[data-page="knowledge"] .filter-chip {
  height: 26px !important;
  padding: 0 6px !important;
  font-size: 10px !important;
}

/* Fix mobile hero inner gutters: the generic container reset used to zero them out. */
body.mobile-page .container.hero-shell,
body.mobile-page .container.hero-card,
body.mobile-page .container.search-shell {
  padding: 20px 22px !important;
}

body.mobile-page[data-page="home"] .hero-shell .hero-search,
body.mobile-page[data-page="products"] .hero-card .hero-product-search .hero-search-form,
body.mobile-page[data-page="publish"] .search-shell .news-search,
body.mobile-page[data-page="knowledge"] .hero-shell .kb-search {
  grid-template-columns: minmax(0, 1fr) 96px !important;
}

/* Mobile home portal cards: title row, copy block, full-width action row. */
body.mobile-page[data-page="home"] .portal-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  align-items: stretch !important;
}

body.mobile-page[data-page="home"] .portal-card {
  min-height: 128px !important;
  padding: 10px !important;
  border-radius: 18px !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: auto 1fr auto !important;
  align-items: stretch !important;
  gap: 6px !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-head {
  display: grid !important;
  grid-template-columns: 30px minmax(0, 1fr) !important;
  grid-template-areas:
    "icon title"
    "copy copy" !important;
  column-gap: 8px !important;
  row-gap: 5px !important;
  align-items: center !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-head > div:not(.portal-icon) {
  display: contents !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-icon {
  grid-area: icon !important;
  width: 30px !important;
  height: 30px !important;
  flex-basis: 30px !important;
  border-radius: 11px !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-icon svg {
  width: 18px !important;
  height: 18px !important;
}

body.mobile-page[data-page="home"] .portal-card strong {
  grid-area: title !important;
  display: block !important;
  min-width: 0 !important;
  margin: 0 !important;
  font-size: 13px !important;
  line-height: 1.18 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-head p {
  grid-area: copy !important;
  margin: 0 !important;
  color: rgba(79, 98, 122, .92) !important;
  font-size: 10.5px !important;
  line-height: 1.34 !important;
  display: -webkit-box !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-actions {
  grid-column: auto !important;
  grid-row: auto !important;
  width: 100% !important;
  display: block !important;
  justify-self: stretch !important;
  align-self: end !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-actions a {
  width: 100% !important;
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 8px !important;
  border-radius: 11px !important;
  font-size: 11px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-actions a::after {
  content: none !important;
}

/* Mobile industry news: one active column with category tabs. */
body.mobile-page[data-page="publish"] .container.news-layout {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
  padding: 8px 10px 24px !important;
  scroll-snap-type: none !important;
}

body.mobile-page[data-page="publish"] .mobile-news-tabs {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  align-items: center !important;
  gap: 6px !important;
  margin: 0 0 10px !important;
  padding: 6px !important;
  border: 1px solid rgba(255,255,255,.72) !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.54) !important;
  box-shadow: 0 16px 36px rgba(31,91,148,.08) !important;
  backdrop-filter: blur(18px) !important;
}

body.mobile-page[data-page="publish"] .mobile-news-tabs button {
  width: auto !important;
  height: 34px !important;
  min-width: 0 !important;
  padding: 0 8px !important;
  border: 1px solid rgba(148,163,184,.18) !important;
  border-radius: 12px !important;
  background: rgba(255,255,255,.7) !important;
  color: #0a4a63 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

/* Mobile home portals: three compact rows, with a full-width action. */
body.mobile-page[data-page="home"] .portal-card {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) !important;
  grid-template-rows: 24px 16px 36px !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 10px !important;
  column-gap: 7px !important;
  row-gap: 6px !important;
  overflow: hidden !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-head,
body.mobile-page[data-page="home"] .portal-card .portal-head .portal-copy {
  display: contents !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-icon {
  position: static !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-self: center !important;
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  margin: 0 !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-copy strong {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: center !important;
  justify-self: start !important;
  margin: 0 !important;
  overflow: visible !important;
  font-size: 12.5px !important;
  line-height: 1.2 !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-copy p {
  position: static !important;
  grid-column: 1 / 3 !important;
  grid-row: 2 !important;
  align-self: center !important;
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  overflow: visible !important;
  color: #15546e !important;
  font-size: 10.5px !important;
  line-height: 16px !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
  -webkit-line-clamp: unset !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-actions {
  position: static !important;
  grid-column: 1 / 3 !important;
  grid-row: 3 !important;
  align-self: stretch !important;
  justify-self: stretch !important;
  display: block !important;
  width: 100% !important;
  height: 36px !important;
  margin: 0 !important;
  transform: none !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-actions a {
  display: grid !important;
  width: 100% !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 !important;
  border-radius: 10px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  place-items: center !important;
  white-space: nowrap !important;
}

body.mobile-page[data-page="publish"] .mobile-news-tabs button.active {
  border-color: rgba(0,172,235,.18) !important;
  background: rgba(220,241,255,.84) !important;
  color: #2471d4 !important;
}

body.mobile-page[data-page="publish"] .mobile-news-tab-count {
  display: none !important;
}

body.mobile-page[data-page="publish"] .news-column {
  display: none !important;
  width: 100% !important;
  height: 560px !important;
  min-width: 0 !important;
  transform: none !important;
  scroll-snap-align: unset !important;
}

body.mobile-page[data-page="publish"] .news-column.active {
  display: grid !important;
}

body.mobile-page[data-page="publish"] .news-column.active .column-head {
  display: grid !important;
  grid-template-columns: max-content max-content !important;
  grid-template-areas:
    "desc desc"
    "month count" !important;
  align-items: center !important;
  justify-content: start !important;
  padding: 9px 16px 12px !important;
  border-bottom: 0 !important;
  gap: 10px 10px !important;
  background: transparent !important;
  position: relative !important;
  z-index: 3 !important;
}

body.mobile-page[data-page="publish"] .news-column.active .column-title {
  display: contents !important;
}

body.mobile-page[data-page="publish"] .news-column.active .column-head h2 {
  display: none !important;
}

body.mobile-page[data-page="publish"] .news-column.active .column-head p {
  grid-area: desc !important;
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
  font-size: 13px !important;
  line-height: 1.65 !important;
  display: block !important;
  overflow: visible !important;
  white-space: normal !important;
  text-overflow: clip !important;
  -webkit-line-clamp: unset !important;
  -webkit-box-orient: unset !important;
  opacity: 1 !important;
  color: rgba(72, 99, 125, .92) !important;
}

body.mobile-page[data-page="publish"] .news-column.active .month-filter {
  grid-area: month !important;
  margin: 0 !important;
  max-width: none !important;
  width: 220px !important;
}

body.mobile-page[data-page="publish"] .news-column.active .column-count {
  grid-area: count !important;
  display: inline-flex !important;
  align-self: center !important;
  justify-self: start !important;
  height: 34px !important;
  min-width: 52px !important;
  padding: 0 12px !important;
  border: 1px solid rgba(0,172,235,.18) !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.72) !important;
  color: #00aceb !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}

/* News cards: source labels and expandable brief cards */
.news-item.expanded strong,
.news-item.expanded p {
  display: block !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: normal !important;
  -webkit-line-clamp: unset !important;
  -webkit-box-orient: unset !important;
}

.news-detail {
  display: none !important;
}

/* 2+8=10 递进：展开时保留折叠摘要（2），在其下递进展示详情（8） */
.news-item.expanded .news-summary {
  display: block !important;
  margin-bottom: 6px !important;
}

.news-item.expanded .news-detail {
  display: block !important;
  margin-top: 10px !important;
  padding-top: 12px !important;
  border-top: 1px dashed rgba(117, 178, 229, .34) !important;
  color: rgba(54, 75, 96, .94) !important;
  font-size: 13px !important;
  line-height: 1.8 !important;
}

.timeline.has-expanded {
  overflow-y: auto !important;
}

.timeline.has-expanded .timeline-track {
  animation-play-state: paused !important;
}

.news-source a,
.news-source .source-static {
  color: rgba(72, 99, 125, .92) !important;
  text-decoration: none !important;
}

.news-source a {
  color: #00aceb !important;
}

.news-source span,
.news-source .source-static {
  min-width: 0 !important;
  max-width: 100% !important;
}

/* Mobile home: a compact transparent navigation and three-part entry cards. */
body.mobile-page[data-page="home"] .nav {
  background: transparent !important;
  border-bottom-color: rgba(255, 255, 255, .32) !important;
  box-shadow: none !important;
  backdrop-filter: blur(20px) saturate(1.2) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.2) !important;
}

body.mobile-page[data-page="home"] .nav-inner {
  padding: 10px 0 8px !important;
  gap: 6px !important;
}

body.mobile-page[data-page="home"] .nav-menu {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 3px !important;
  padding: 2px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.mobile-page[data-page="home"] .nav-menu a {
  height: 30px !important;
  padding: 0 2px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: transparent !important;
  color: #40556d !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}

body.mobile-page[data-page="home"] .nav-menu a.active {
  background: rgba(255, 255, 255, .42) !important;
  color: #3478dd !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.5) !important;
}

body.mobile-page[data-page="home"] .nav-menu a.active::after {
  display: none !important;
}

body.mobile-page[data-page="home"] .nav-note,
body.mobile-page[data-page="home"] .nav-note {
  display: none !important;
}

/* The home navigation is the shared visual standard for every mobile page. */
body.mobile-page .nav {
  background: transparent !important;
  border-bottom-color: rgba(255, 255, 255, .32) !important;
  box-shadow: none !important;
  backdrop-filter: blur(20px) saturate(1.2) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.2) !important;
}

body.mobile-page .nav-inner {
  padding: 10px 0 8px !important;
  gap: 6px !important;
}

body.mobile-page .logo {
  width: 100% !important;
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
}

body.mobile-page .logo-mark {
  width: 36px !important;
  height: 36px !important;
  flex: 0 0 36px !important;
  display: grid !important;
  place-items: center !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.mobile-page .logo-mark img {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: contain !important;
  border: 1px solid #111827 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
}

body.mobile-page .logo-copy {
  min-width: 0 !important;
}

body.mobile-page .logo-copy strong {
  display: block !important;
  color: #24364e !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}

body.mobile-page .logo-copy span {
  display: block !important;
  max-width: 310px !important;
  color: #0a4a63 !important;
  font-size: 11px !important;
  line-height: 1.45 !important;
  white-space: normal !important;
}

body.mobile-page .nav-note {
  display: none !important;
}

body.mobile-page .nav-menu {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 3px !important;
  padding: 2px !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.mobile-page .nav-menu a {
  min-width: 0 !important;
  height: 30px !important;
  padding: 0 2px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: transparent !important;
  color: #40556d !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
}

body.mobile-page .nav-menu a.active {
  background: rgba(255, 255, 255, .42) !important;
  color: #3478dd !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.5) !important;
}

/* Keep every dedicated mobile page on the same light, open navigation surface
   as the home page. Page-specific menu grids can still choose their own layout. */
body.mobile-page:not([data-page="home"]) .nav {
  background: transparent !important;
  border-bottom-color: rgba(255, 255, 255, .32) !important;
  box-shadow: none !important;
  backdrop-filter: blur(20px) saturate(1.2) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.2) !important;
}

body.mobile-page:not([data-page="home"]) .nav-menu {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.mobile-page[data-page="home"] .hero-copy {
  display: block !important;
  margin-bottom: 16px !important;
}

body.mobile-page[data-page="home"] .hero-copy h1 {
  font-size: 22px !important;
  line-height: 1.22 !important;
}

body.mobile-page[data-page="home"] .hero {
  padding-top: 12px !important;
}

body.mobile-page[data-page="home"] .hero-shell {
  display: block !important;
  padding: 22px !important;
  border-radius: 26px !important;
}

body.mobile-page[data-page="home"] .search-panel {
  width: 100% !important;
  max-width: 100% !important;
}

body.mobile-page[data-page="home"] .search-panel-title {
  margin: 0 0 8px !important;
  font-size: 22px !important;
  line-height: 1.18 !important;
}

body.mobile-page[data-page="home"] .search-panel-copy {
  margin: 0 0 16px !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
}

body.mobile-page[data-page="home"] .hero-search {
  grid-template-columns: minmax(0, 1fr) 116px !important;
  gap: 12px !important;
  margin: 0 !important;
}

body.mobile-page[data-page="home"] .hero-search input,
body.mobile-page[data-page="home"] .hero-search button {
  height: 52px !important;
  min-height: 52px !important;
  border-radius: 18px !important;
}

body.mobile-page[data-page="home"] .portal-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

body.mobile-page[data-page="home"] .portal-card {
  display: grid !important;
  grid-template-columns: 28px minmax(0, 1fr) !important;
  grid-template-rows: 30px minmax(42px, 1fr) 32px !important;
  min-height: 142px !important;
  padding: 12px !important;
  gap: 7px 8px !important;
  align-items: start !important;
  border-radius: 18px !important;
}

body.mobile-page[data-page="home"] .portal-head,
body.mobile-page[data-page="home"] .portal-head > div {
  display: contents !important;
}

body.mobile-page[data-page="home"] .portal-icon {
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  border-radius: 10px !important;
}

body.mobile-page[data-page="home"] .portal-card strong {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: center !important;
  margin: 0 !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body.mobile-page[data-page="home"] .portal-card p {
  grid-column: 2 !important;
  grid-row: 2 !important;
  align-self: start !important;
  min-height: 0 !important;
  margin: 0 !important;
  font-size: 10.5px !important;
  line-height: 1.45 !important;
  -webkit-line-clamp: 3 !important;
}

body.mobile-page[data-page="home"] .portal-actions {
  grid-column: 1 / -1 !important;
  grid-row: 3 !important;
  width: 100% !important;
  align-self: end !important;
}

body.mobile-page[data-page="home"] .portal-actions a {
  width: 100% !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 8px !important;
  border-radius: 11px !important;
  font-size: 11px !important;
}

body.mobile-page[data-page="home"] .portal-actions a::after {
  display: none !important;
}

/* Keep the mobile product-detail dismissal control in the upper-right corner. */
body.mobile-page[data-page="products"] .modal-head {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

body.mobile-page[data-page="products"] .modal-head > div {
  min-width: 0 !important;
}

body.mobile-page[data-page="products"] .modal-close {
  flex: 0 0 40px !important;
  margin-left: auto !important;
}

/* Reuse the knowledge-base's quiet glass chips for product and forum labels. */
body[data-page="products"] .result-product-grid .product-tags span,
body[data-page="products"] .modal-badges span,
body[data-page="forum"] .forum-topic-tabs button,
body[data-page="forum"] .tags span {
  background: rgba(255, 255, 255, .50) !important;
  color: #003b52 !important;
  border: 1px solid rgba(0,172,235,.34) !important;
  border-radius: 999px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .68), 0 10px 24px rgba(0,46,61,.06) !important;
  font-weight: 700 !important;
}

body[data-page="forum"] .forum-topic-tabs button.active {
  background: rgba(255, 255, 255, .76) !important;
  color: #003b52 !important;
  border-color: rgba(0,172,235,.64) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .78), 0 10px 24px rgba(0,46,61,.08) !important;
}

/* Keep every public page on the same home-page background. */
body[data-page="home"],
body[data-page="products"],
body[data-page="publish"],
body[data-page="knowledge"],
body[data-page="forum"],
body[data-page="demand"],
body[data-page="suggest"],
body[data-page="cooperate"] {
  background:
    radial-gradient(circle at 8% 9%, rgba(0,172,235,.42), transparent 24%),
    radial-gradient(circle at 88% 4%, rgba(0,172,235,.24), transparent 26%),
    radial-gradient(circle at 18% 82%, rgba(219, 234, 254, .58), transparent 28%),
    linear-gradient(145deg, #f0fafd 0%, #f7fcfe 44%, #e6f7fd 100%) !important;
}

body[data-page="home"]::before,
body[data-page="products"]::before,
body[data-page="publish"]::before,
body[data-page="knowledge"]::before,
body[data-page="forum"]::before,
body[data-page="demand"]::before,
body[data-page="suggest"]::before,
body[data-page="cooperate"]::before {
  background:
    linear-gradient(112deg, rgba(255,255,255,.62) 0%, transparent 26%, rgba(255,255,255,.26) 51%, transparent 72%),
    repeating-linear-gradient(90deg, rgba(255,255,255,.18) 0 1px, transparent 1px 80px) !important;
  opacity: .72 !important;
}

/* Authoritative mobile-home portal layout. Keep this block last. */
body.mobile-page[data-page="home"] .portal-card {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) !important;
  grid-template-rows: 24px 16px 36px !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 10px !important;
  column-gap: 7px !important;
  row-gap: 6px !important;
  overflow: hidden !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-head,
body.mobile-page[data-page="home"] .portal-card .portal-head .portal-copy {
  position: static !important;
  display: contents !important;
  min-height: 0 !important;
  padding: 0 !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-icon {
  position: static !important;
  inset: auto !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-self: center !important;
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  margin: 0 !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-copy strong {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: center !important;
  justify-self: start !important;
  display: block !important;
  margin: 0 !important;
  overflow: visible !important;
  font-size: 12.5px !important;
  line-height: 1.2 !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-copy p {
  position: static !important;
  inset: auto !important;
  grid-column: 1 / 3 !important;
  grid-row: 2 !important;
  align-self: center !important;
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  overflow: visible !important;
  color: #15546e !important;
  font-size: 10.5px !important;
  line-height: 16px !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
  -webkit-line-clamp: unset !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-actions {
  position: static !important;
  inset: auto !important;
  grid-column: 1 / 3 !important;
  grid-row: 3 !important;
  align-self: stretch !important;
  justify-self: stretch !important;
  display: block !important;
  width: 100% !important;
  height: 36px !important;
  margin: 0 !important;
  transform: none !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-actions a {
  display: grid !important;
  width: 100% !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 !important;
  border-radius: 10px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  place-items: center !important;
  white-space: nowrap !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-actions a::after {
  display: none !important;
}

/* Keep the mobile brand block consistent while each page keeps its own content. */
body.mobile-page .logo {
  width: 100% !important;
  min-width: 0 !important;
}

body.mobile-page .logo-copy {
  min-width: 0 !important;
}

body.mobile-page .logo-copy span {
  display: block !important;
  max-width: 310px !important;
  overflow: visible !important;
  color: #0a4a63 !important;
  font-size: 9px !important;
  line-height: 1.45 !important;
  white-space: normal !important;
}

/* Align the gap below each mobile page intro with the product-selection page. */
body.mobile-page[data-page="home"] .page-stack,
body.mobile-page[data-page="knowledge"] .content,
body.mobile-page[data-page="forum"] .layout {
  padding-top: 8px !important;
}

/* 手机端参数知识库：内容版块与上方检索框（hero-shell 内边距 22px）左右对齐。
   覆盖 mobile-force/mobile-theme 的 .content padding !important（左右 0），只改水平方向。 */
body.mobile-page[data-page="knowledge"] .content {
  padding-left: 22px !important;
  padding-right: 22px !important;
}

/* Final mobile home composition: search-first hero and concise portal cards. */

body.mobile-page[data-page="home"] .hero-shell {
  gap: 0 !important;
}

body.mobile-page[data-page="home"] .portal-card {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) 48px !important;
  grid-template-rows: 28px minmax(34px, auto) !important;
  min-height: 104px !important;
  padding: 12px !important;
  gap: 6px !important;
  overflow: hidden !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-head {
  display: contents !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-icon {
  position: static !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  margin: 0 !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-head .portal-copy {
  display: contents !important;
  padding: 0 !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-copy strong {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: center !important;
  overflow: visible !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-copy p {
  position: static !important;
  grid-column: 1 / 3 !important;
  grid-row: 2 !important;
  display: block !important;
  align-self: start !important;
  margin: 0 !important;
  overflow: visible !important;
  color: #15546e !important;
  font-size: 10px !important;
  line-height: 1.45 !important;
  -webkit-line-clamp: unset !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-actions {
  position: static !important;
  grid-column: 3 !important;
  grid-row: 1 / 3 !important;
  align-self: center !important;
  justify-self: end !important;
  width: 48px !important;
  margin: 0 !important;
  transform: none !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-actions a {
  display: grid !important;
  width: 48px !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 !important;
  border-radius: 12px !important;
  font-size: 11px !important;
  line-height: 1 !important;
  place-items: center !important;
  white-space: nowrap !important;
}

/* Keep mobile portal copy and actions in separate rows at narrow widths. */
@media (max-width: 430px) {
  body.mobile-page[data-page="home"] .portal-card {
    display: grid !important;
    grid-template-columns: 34px minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    min-height: 142px !important;
    padding: 14px !important;
    gap: 10px 8px !important;
    align-items: start !important;
  }

  body.mobile-page[data-page="home"] .portal-icon {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  body.mobile-page[data-page="home"] .portal-copy {
    grid-column: 2 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
  }

  body.mobile-page[data-page="home"] .portal-card strong,
  body.mobile-page[data-page="home"] .portal-card p {
    display: block !important;
    position: static !important;
    width: auto !important;
    min-width: 0 !important;
  }

  body.mobile-page[data-page="home"] .portal-card strong {
    font-size: 13px !important;
    line-height: 1.35 !important;
  }

  body.mobile-page[data-page="home"] .portal-card p {
    margin-top: 4px !important;
    font-size: 11px !important;
    line-height: 1.5 !important;
    -webkit-line-clamp: 2 !important;
  }

  body.mobile-page[data-page="home"] .portal-actions {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    align-self: end !important;
    justify-self: stretch !important;
  }

  body.mobile-page[data-page="home"] .portal-actions a {
    width: 100% !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 12px !important;
    border-radius: 13px !important;
    font-size: 12px !important;
    white-space: nowrap !important;
  }

  body.mobile-page .nav-menu a {
    min-height: 30px !important;
    height: 30px !important;
  }
}

/* Mobile home portal: one stable layout for narrow two-column cards.
   The action is intentionally short so the title and description retain usable width. */
body.mobile-page[data-page="home"] .portal-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

body.mobile-page[data-page="home"] .portal-card {
  position: relative !important;
  display: block !important;
  min-height: 116px !important;
  padding: 12px 76px 12px 12px !important;
  overflow: hidden !important;
  border-radius: 18px !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-head {
  display: block !important;
  position: static !important;
  min-height: 92px !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-icon {
  position: absolute !important;
  top: 12px !important;
  left: 12px !important;
  width: 27px !important;
  height: 27px !important;
  min-width: 27px !important;
  margin: 0 !important;
  border-radius: 10px !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-icon svg {
  width: 17px !important;
  height: 17px !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-head .portal-copy {
  display: block !important;
  min-width: 0 !important;
  padding: 4px 0 0 35px !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-copy strong {
  display: block !important;
  min-width: 0 !important;
  margin: 0 !important;
  color: #17253d !important;
  font-size: 12.5px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-copy p {
  position: absolute !important;
  top: 48px !important;
  right: 74px !important;
  left: 12px !important;
  display: -webkit-box !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: #15546e !important;
  font-size: 10px !important;
  line-height: 1.36 !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-actions {
  position: absolute !important;
  top: 50% !important;
  right: 11px !important;
  display: block !important;
  width: 54px !important;
  margin: 0 !important;
  transform: translateY(-50%) !important;
}

body.mobile-page[data-page="home"] .portal-card .portal-actions a {
  display: grid !important;
  width: 54px !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 !important;
  border-radius: 12px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  place-items: center !important;
  white-space: nowrap !important;
}

/* Keep the mobile content map on its earlier compact card pattern.
   The larger three-row action layout made two-column cards visually unbalanced. */
body.mobile-page[data-page="home"] .portal-card {
  grid-template-columns: 28px minmax(0, 1fr) 32px !important;
  grid-template-rows: auto minmax(42px, 1fr) !important;
  min-height: 104px !important;
  padding: 10px !important;
  gap: 6px 7px !important;
}

body.mobile-page[data-page="home"] .portal-icon {
  grid-column: 1 !important;
  grid-row: 1 !important;
}

body.mobile-page[data-page="home"] .portal-card strong {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: center !important;
  font-size: 12px !important;
}

body.mobile-page[data-page="home"] .portal-card p {
  grid-column: 1 / 4 !important;
  grid-row: 2 !important;
  font-size: 10px !important;
  line-height: 1.35 !important;
  -webkit-line-clamp: 2 !important;
}

body.mobile-page[data-page="home"] .portal-actions {
  grid-column: 3 !important;
  grid-row: 1 !important;
  width: 32px !important;
  justify-self: end !important;
  align-self: center !important;
}

body.mobile-page[data-page="home"] .portal-actions a {
  width: 32px !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 !important;
  border-radius: 11px !important;
  font-size: 0 !important;
}

body.mobile-page[data-page="home"] .portal-actions a::after {
  display: block !important;
  font-size: 18px !important;
}

/* Mobile content-map, three clear zones: title, description, and entry action. */
body.mobile-page[data-page="home"] .portal-card {
  grid-template-columns: 28px minmax(0, 1fr) 88px !important;
  grid-template-rows: 30px minmax(42px, 1fr) !important;
  min-height: 122px !important;
  padding: 12px !important;
  gap: 8px !important;
}

body.mobile-page[data-page="home"] .portal-icon {
  grid-column: 1 !important;
  grid-row: 1 !important;
}

body.mobile-page[data-page="home"] .portal-card strong {
  grid-column: 2 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  align-self: center !important;
  min-width: 0 !important;
  font-size: 12.5px !important;
}

body.mobile-page[data-page="home"] .portal-card p {
  grid-column: 1 / 3 !important;
  grid-row: 2 !important;
  align-self: start !important;
  font-size: 10.5px !important;
  line-height: 1.45 !important;
  -webkit-line-clamp: 2 !important;
}

body.mobile-page[data-page="home"] .portal-actions {
  grid-column: 3 !important;
  grid-row: 1 / 3 !important;
  width: 88px !important;
  align-self: center !important;
  justify-self: end !important;
}

body.mobile-page[data-page="home"] .portal-actions a {
  width: 88px !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 8px !important;
  border-radius: 14px !important;
  font-size: 10.5px !important;
  font-weight: 800 !important;
  line-height: 1.18 !important;
  white-space: normal !important;
  text-align: center !important;
}

body.mobile-page[data-page="home"] .portal-actions a::after {
  display: none !important;
}

/* 手机版产品选型：覆盖 2 列紧凑网格为单列左右布局，并压缩卡片高度。
   放在文件末尾以确保最高优先级；只收紧固定高度与留白，不裁剪文字内容。 */
body.mobile-page[data-page="products"] .result-product-grid {
  grid-template-columns: 1fr !important;
  gap: 10px !important;
}
body.mobile-page[data-page="products"] .result-product-grid .product-card {
  padding: 11px !important;
  border-radius: 18px !important;
  gap: 8px !important;
}
body.mobile-page[data-page="products"] .result-product-grid .product-card-main {
  display: grid !important;
  grid-template-columns: 84px minmax(0, 1fr) !important;
  gap: 11px !important;
  align-items: start !important;
}
body.mobile-page[data-page="products"] .result-product-grid .product-visual-wrap,
body.mobile-page[data-page="products"] .result-product-grid .product-visual {
  width: 84px !important;
}
body.mobile-page[data-page="products"] .result-product-grid .product-visual {
  height: 84px !important;
  min-height: 84px !important;
}
body.mobile-page[data-page="products"] .result-product-grid .product-name {
  margin: 0 0 3px !important;
  font-size: 15px !important;
  line-height: 1.3 !important;
}
body.mobile-page[data-page="products"] .result-product-grid .product-summary {
  -webkit-line-clamp: 1 !important;
  margin-top: 2px !important;
}
body.mobile-page[data-page="products"] .result-product-grid .product-tags {
  margin-top: 5px !important;
  gap: 5px !important;
}
body.mobile-page[data-page="products"] .result-product-grid .product-tags span {
  height: 22px !important;
  padding: 0 7px !important;
  font-size: 10px !important;
}
body.mobile-page[data-page="products"] .result-product-grid .product-actions {
  padding-top: 8px !important;
  gap: 8px !important;
}
body.mobile-page[data-page="products"] .result-product-grid .product-actions .primary-btn,
body.mobile-page[data-page="products"] .result-product-grid .product-actions .compare-inline-btn {
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 10px !important;
  font-size: 12px !important;
}
body.mobile-page[data-page="products"] .result-product-grid .product-meta {
  gap: 8px !important;
  padding: 10px 0 !important;
  margin-bottom: 10px !important;
}
body.mobile-page[data-page="products"] .result-product-grid .product-meta-item strong {
  min-height: 0 !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  -webkit-line-clamp: 1 !important;
}
body.mobile-page[data-page="products"] .result-product-grid .product-meta-item small {
  margin-bottom: 2px !important;
}
body.mobile-page[data-page="products"] .result-product-grid .product-actions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

/* ===== 手机版块间距统一（以首页为基准）=====
   首页基准：hero 上下 12px/14px；检索栏/主容器 22px 四周。 */
body.mobile-page .hero,
body.mobile-page .publish-hero,
body.mobile-page .tools-hero,
body.mobile-page[data-page="knowledge"] .hero,
body.mobile-page[data-page="forum"] .hero,
body.mobile-page[data-page="demand"] .hero,
body.mobile-page[data-page="products"] .hero,
body.mobile-page[data-page="mobile-products"] .hero {
  padding-top: 12px !important;
  padding-bottom: 14px !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

body.mobile-page .hero-shell,
body.mobile-page .search-shell,
body.mobile-page .tools-hero-shell,
body.mobile-page .container.hero-shell,
body.mobile-page .container.search-shell,
body.mobile-page[data-page="forum"] .hero-shell,
body.mobile-page[data-page="demand"] .hero-shell,
body.mobile-page[data-page="knowledge"] .hero-shell {
  padding: 22px !important;
}

/* ===== 搜索建议下拉（search-suggest.js）===== */
.search-suggest {
  position: absolute;
  z-index: 1400;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  display: grid;
  gap: 2px;
  padding: 6px;
  border: 1px solid rgba(148, 163, 184, .22);
  border-radius: 14px;
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 18px 44px rgba(15, 23, 42, .16);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  max-height: 320px;
  overflow-y: auto;
}
.search-suggest[hidden] {
  display: none !important;
}
.search-suggest-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  padding: 9px 12px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  text-align: left;
  cursor: pointer;
  font: inherit;
}
.search-suggest-item.active,
.search-suggest-item:hover {
  background: rgba(0,172,235,.1);
}
.search-suggest-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text-1, #1e293b);
  font-size: 13px;
  font-weight: 600;
}
.search-suggest-meta {
  flex: 0 0 auto;
  color: var(--text-3, #94a3b8);
  font-size: 11px;
}
.search-panel,
.hero-card .hero-product-search,
.hero-shell .kb-search,
.search-shell {
  position: relative;
}
body.mobile-page .search-suggest {
  top: calc(100% + 4px);
  border-radius: 12px;
}
body.mobile-page .search-suggest-item {
  padding: 11px 12px;
}
body.mobile-page .search-suggest-label {
  font-size: 14px;
}

/* 知识库说明文字回归统一的无底色排版，避免每个词条出现不同色块。 */
body[data-page="knowledge"] .term-mechanism,
body[data-page="knowledge"] .term-context,
body[data-page="knowledge"] .term-note {
  background: transparent !important;
  border: 0 !important;
  border-left: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  color: var(--text-2, #0a4a63) !important;
}

body[data-page="knowledge"] .term-mechanism strong,
body[data-page="knowledge"] .term-context strong,
body[data-page="knowledge"] .term-note strong {
  color: inherit !important;
}
/* 知识库词条之间只保留卡片自身表面，避免 section 外层玻璃在间隙中重复叠加。 */
body[data-page="knowledge"] .content > .section {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow: visible !important;
}
/* 概念知识库卡片不向相邻词条扩散阴影，避免间隙形成额外底色。 */
body[data-page="knowledge"] .content > .section .term-card {
  box-shadow: none !important;
}
/* Unified soft focus treatment for text-entry controls. */
body :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea):focus {
  outline: none !important;
  border-color: rgba(82, 142, 200, .42) !important;
  box-shadow: 0 0 0 2px rgba(82, 142, 200, .08) !important;
}

/* P2-3 统一键盘焦点态：仅键盘 Tab / 方向键聚焦时显示清晰焦点环，
   鼠标点击不出现（依赖 :focus-visible），覆盖链接、按钮、表单控件、
   筛选芯片、分页、可聚焦卡片等，保证键盘用户能看清当前位置。 */
body :where(
  a[href],
  button:not(:disabled),
  input,
  select,
  textarea,
  summary,
  [tabindex]:not([tabindex="-1"])
):focus-visible {
  outline: 2px solid rgba(47, 111, 224, .78) !important;
  outline-offset: 2px;
  border-radius: 12px;
}
/* 文本输入框键盘聚焦时，在既有描边阴影基础上叠加同一焦点环 */
body :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea):focus-visible {
  outline: 2px solid rgba(47, 111, 224, .78) !important;
  outline-offset: 1px;
}
/* 复选/单选框焦点环更紧凑 */
body :where(input[type="checkbox"], input[type="radio"]):focus-visible {
  outline: 2px solid rgba(47, 111, 224, .78) !important;
  outline-offset: 2px;
  border-radius: 6px;
}

/* P2-4 卡片交互层次：玻璃主题的卡片 hover 已有边框提亮 + 蓝色浮影
   （见上方 .product-card/.term-card:hover 组），这里补上轻微抬升位移，
   与 modern-theme 的 translateY 反馈保持一致。仅用 transform（不影响布局
   几何、等高/栅格与既有阴影）；知识卡保留既有 height 展开动画。 */
.product-card {
  transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.term-card {
  transition: height .24s ease, box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.product-card:hover,
.term-card:hover {
  transform: translateY(-2px);
}
@media (prefers-reduced-motion: reduce) {
  .product-card:hover,
  .term-card:hover { transform: none; }
}
/* ===== Button surface audit (2026-08-25) =====
   Search controls are a single row, not a second card.  Keep the form
   transparent and let each control own its own surface so no pale shell or
   inset gap appears around the action button on narrow screens. */
body[data-page] :where(
  .hero-search,
  .hero-search-form,
  .news-search,
  .kb-search,
  .banner-search
) {
  align-items: stretch !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

body[data-page] :where(
  .hero-search button,
  .hero-search-form button,
  .news-search button,
  .kb-search button,
  .banner-search button
) {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  margin: 0 !important;
  background-clip: border-box !important;
  border: 1px solid transparent !important;
  box-shadow: 0 12px 26px rgba(0,172,235,.14) !important;
}

/* Secondary actions must remain visually secondary; the generic button rule
   should not turn reset/copy actions into another primary gradient. */
body[data-page] :where(.btn-secondary, .ghost-btn) {
  appearance: none !important;
  -webkit-appearance: none !important;
  background: rgba(255, 255, 255, .76) !important;
  color: #0a4a63 !important;
  border: 1px solid rgba(154, 193, 225, .58) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .82) !important;
}

/* Native button bevels and default margins are inconsistent across the
   public PC/mobile pages.  Keep the established dimensions, only normalize
   the rendering primitive. */
body[data-page] button {
  appearance: none;
  -webkit-appearance: none;
}
/* ===== Button semantic overrides for forum composition =====
   The shared glass theme gives every native button a primary gradient.  The
   post composer contains neutral multi-select tags and small utility controls,
   so they need their own quiet surface to preserve the visual hierarchy. */
body[data-page="forum-post"] .forum-post-tag {
  appearance: none !important;
  -webkit-appearance: none !important;
  background: rgba(255, 255, 255, .76) !important;
  color: #0a4a63 !important;
  border: 1px solid rgba(154, 193, 225, .58) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .82) !important;
}

body[data-page="forum-post"] .forum-post-login-btn {
  background: linear-gradient(135deg, #22c55e, #16a34a) !important;
  color: #fff !important;
  border: 0 !important;
  box-shadow: 0 12px 22px rgba(22, 163, 74, .18) !important;
}

body[data-page="forum-post"] .forum-post-preview button {
  background: rgba(15, 23, 42, .78) !important;
  color: #fff !important;
  border: 0 !important;
  box-shadow: none !important;
}

body[data-page="forum"] .comment-emoji-panel button {
  background: #fff !important;
  color: #003b52 !important;
  border: 0 !important;
  box-shadow: none !important;
}
/* Tools scene chips use the same neutral/active distinction as other selectors. */
body[data-page="tools"] .scene-chip:not(.active) {
  appearance: none !important;
  -webkit-appearance: none !important;
  background: rgba(255, 255, 255, .76) !important;
  color: #0a4a63 !important;
  border: 1px solid rgba(154, 193, 225, .58) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .82) !important;
}
/* ===== Button surface normalization (2026-08-25) =====
   Keep each control to one surface, one edge treatment, and one soft shadow.
   The previous transparent borders plus inset highlights made the final
   gradient stop read as a second, brighter strip on both PC and mobile. */
body[data-page] :where(
  .primary-btn,
  .btn-primary,
  .submit-btn,
  .comment-btn,
  .download-btn,
  .save-btn,
  .login-btn,
  .filter-done-primary,
  .hero-search button,
  .hero-search-form button,
  .news-search button,
  .kb-search button,
  .banner-search button,
  .arrow-btn
) {
  appearance: none !important;
  -webkit-appearance: none !important;
  border: 0 !important;
  border-color: transparent !important;
  background-clip: padding-box !important;
  box-shadow: 0 12px 26px rgba(0,172,235,.16) !important;
}

body[data-page] :where(
  .compare-inline-btn,
  .line-btn,
  .btn-secondary,
  .ghost-btn,
  .filter-done-ghost,
  .filter-toggle:not(.active),
  .product-quick-search,
  .filter-chip:not(.active),
  .filter-opt:not(.active),
  .tag-option:not(.active),
  .catalog-page-btn,
  .pager-actions button,
  .forum-pagination button,
  .forum-topic-tabs button,
  .mobile-news-tabs button,
  .scene-chip:not(.active)
) {
  appearance: none !important;
  -webkit-appearance: none !important;
  background: rgba(255, 255, 255, .76) !important;
  background-image: none !important;
  color: #0a4a63 !important;
  border: 1px solid rgba(154, 193, 225, .42) !important;
  box-shadow: none !important;
}

body[data-page] :where(
  .filter-toggle.active,
  .filter-chip.active,
  .filter-opt.active,
  .tag-option.active,
  .scene-chip.active,
  .mobile-news-tabs button.active,
  .forum-topic-tabs button.active
) {
  appearance: none !important;
  -webkit-appearance: none !important;
  background: #e6f7fd !important;
  background-image: none !important;
  color: #0087b3 !important;
  border: 1px solid #6fd4f4 !important;
  box-shadow: none !important;
}

body[data-page] :where(
  .pagination a,
  .pagination span,
  .pagination button,
  .pager-actions button,
  .catalog-page-btn,
  .forum-pagination button
) {
  background-image: none !important;
  box-shadow: none !important;
}

body[data-page] .floating-action-main {
  appearance: none !important;
  -webkit-appearance: none !important;
  border: 0 !important;
  background-clip: padding-box !important;
  box-shadow: 0 14px 36px rgba(15, 119, 214, .28) !important;
}

body.mobile-page .floating-action-link {
  box-shadow: 0 7px 16px rgba(48, 93, 132, .12) !important;
}

body:not(.mobile-page) .floating-action-link {
  box-shadow: none !important;
}

body[data-page] :where(
  .btn-secondary,
  .ghost-btn,
  .line-btn,
  .filter-done-ghost
):hover:not(:disabled),
body[data-page] :where(
  .filter-toggle:not(.active),
  .product-quick-search,
  .filter-chip:not(.active),
  .scene-chip:not(.active)
):hover {
  background: rgba(255, 255, 255, .9) !important;
  border-color: rgba(0,172,235,.42) !important;
  box-shadow: none !important;
}

body[data-page] :where(
  .primary-btn,
  .btn-primary,
  .submit-btn,
  .comment-btn,
  .download-btn,
  .save-btn,
  .login-btn
):hover:not(:disabled) {
  box-shadow: 0 14px 30px rgba(0,172,235,.2) !important;
}

body[data-page="forum-post"] .forum-post-login-btn,
body.mobile-page[data-page="forum"] .wechat-btn {
  border: 0 !important;
  box-shadow: 0 12px 24px rgba(22, 163, 74, .18) !important;
}
/* ===== Admin entry button surface normalization (2026-08-25) =====
   The admin entry pages do not carry public data-page attributes, so keep
   their login control on the same single-surface rule as public pages. */
body:not([data-page]) :where(.login-btn) {
  appearance: none !important;
  -webkit-appearance: none !important;
  border: 0 !important;
  border-color: transparent !important;
  background-clip: padding-box !important;
  box-shadow: 0 12px 26px rgba(0,172,235,.16) !important;
}

/* ===== Deep-link target highlight (homepage quick-locate, 2026-08-26) =====
   When a homepage section (hot terms / news / forum / products) jumps to a
   specific card, the target gets a soft tinted background plus a colored
   inner ring so users can immediately find it among otherwise busy pages.
   Applies to .term-card, .news-item and .post. */
.is-deep-linked {
  position: relative;
  z-index: 2;
  background: linear-gradient(180deg, rgba(0,172,235,.16), rgba(0,172,235,.09)) !important;
  border-color: rgba(0,172,235,.42) !important;
  box-shadow: inset 0 0 0 2px rgba(0,172,235,.28), 0 14px 30px rgba(0,172,235,.14) !important;
  animation: deep-link-settle 1.6s ease-out 1;
}
@keyframes deep-link-settle {
  0% {
    box-shadow: inset 0 0 0 3px rgba(0,172,235,.55), inset 0 0 40px rgba(0,172,235,.22), 0 14px 30px rgba(0,172,235,.20);
  }
  100% {
    box-shadow: inset 0 0 0 2px rgba(0,172,235,.28), 0 14px 30px rgba(0,172,235,.14);
  }
}
@media (prefers-reduced-motion: reduce) {
  .is-deep-linked { animation: none; }
}

/* =====================================================================
   UI-P1 按钮三级体系（T1）
   主按钮 .btn-primary（实心渐变，每页主操作 1 个）
   次按钮 .btn-secondary（白底蓝边）
   文字按钮 .btn-text（无底色，用于取消/重置/弱操作）
   未显式归类的裸按钮默认呈现中性次级样式，不再被全局刷成蓝色渐变。
   ===================================================================== */
:where(body:not(.admin-app-shell)) button,
:where(body:not(.admin-app-shell)) input[type="button"],
:where(body:not(.admin-app-shell)) input[type="submit"] {
  font-family: inherit;
  font-size: var(--btn-font-size);
  font-weight: 700;
  line-height: 1.2;
  border-radius: var(--btn-radius);
  min-height: 40px;
  padding: 0 18px;
  border: 1px solid var(--btn-secondary-border);
  background: var(--btn-secondary-bg);
  color: var(--btn-secondary-color);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease, transform .12s ease;
}
:where(body:not(.admin-app-shell)) button:hover:not(:disabled),
:where(body:not(.admin-app-shell)) input[type="button"]:hover:not(:disabled),
:where(body:not(.admin-app-shell)) input[type="submit"]:hover:not(:disabled) {
  border-color: rgba(0,172,235,.55);
}
:where(body:not(.admin-app-shell)) button:disabled,
:where(body:not(.admin-app-shell)) input[type="button"]:disabled,
:where(body:not(.admin-app-shell)) input[type="submit"]:disabled {
  opacity: .55;
  cursor: not-allowed;
}

/* 主按钮：实心渐变 + 白字 + 主阴影 */
.btn-primary,
button.btn-primary,
a.btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: var(--btn-height);
  padding: var(--btn-padding);
  font-size: var(--btn-font-size);
  font-weight: 800;
  border-radius: var(--btn-radius);
  background: var(--btn-primary-bg) !important;
  color: var(--btn-primary-color) !important;
  border: 1px solid rgba(255, 255, 255, .48) !important;
  box-shadow: 0 16px 34px rgba(0,172,235,.20), inset 0 1px 0 rgba(255, 255, 255, .42) !important;
}
.btn-primary:hover:not(:disabled),
button.btn-primary:hover:not(:disabled) {
  background: linear-gradient(135deg, #347bf0, #58c3ed) !important;
  box-shadow: 0 18px 40px rgba(0,172,235,.26), inset 0 1px 0 rgba(255, 255, 255, .42) !important;
}
.btn-primary:active:not(:disabled) { transform: translateY(1px); }

/* 次按钮：白底蓝边 */
.btn-secondary,
button.btn-secondary,
a.btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: var(--btn-height);
  padding: var(--btn-padding);
  font-size: var(--btn-font-size);
  font-weight: 700;
  border-radius: var(--btn-radius);
  background: var(--btn-secondary-bg) !important;
  color: var(--btn-secondary-color) !important;
  border: 1px solid var(--btn-secondary-border) !important;
  box-shadow: var(--shadow-sm) !important;
}
.btn-secondary:hover:not(:disabled),
button.btn-secondary:hover:not(:disabled) {
  background: #fff !important;
  border-color: rgba(0,172,235,.62) !important;
  color: var(--color-primary-hover) !important;
}
.btn-secondary:active:not(:disabled) { transform: translateY(1px); }

/* 文字按钮：无底色，用于取消 / 重置 / 弱操作 */
.btn-text,
button.btn-text,
a.btn-text {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 36px;
  padding: 0 10px;
  font-size: var(--text-sm);
  font-weight: 700;
  border-radius: var(--radius-sm);
  background: transparent !important;
  color: var(--btn-text-color) !important;
  border: 1px solid transparent !important;
  box-shadow: none !important;
}
.btn-text:hover:not(:disabled),
button.btn-text:hover:not(:disabled) {
  background: rgba(0,172,235,.08) !important;
  color: var(--color-primary-hover) !important;
  text-decoration: none;
}

/* 让现有主按钮类与新体系视觉对齐（统一最小高度/圆角/字重） */
.primary-btn,
.submit-btn,
.login-btn,
.comment-btn,
.save-btn,
.download-btn,
.filter-done-primary {
  min-height: var(--btn-height);
  border-radius: var(--btn-radius);
  font-weight: 800;
}

/* =====================================================================
   UI-P1 T2 手机底部主导航 Tab 栏
   ===================================================================== */
.mobile-tabbar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1200;
  /* 与 body.mobile-page 的居中列（max-width:430px）对齐 */
  width: min(100%, 430px);
  margin: 0 auto;
  box-sizing: border-box;
  display: flex;
  align-items: stretch;
  justify-content: space-around;
  padding: 6px 4px calc(6px + env(safe-area-inset-bottom, 0px));
  background: rgba(255, 255, 255, .94);
  border-top: 1px solid rgba(30, 58, 95, .10);
  box-shadow: 0 -10px 34px rgba(0,46,61,.10);
  backdrop-filter: blur(22px) saturate(1.5);
  -webkit-backdrop-filter: blur(22px) saturate(1.5);
}
.mobile-tab {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  min-height: 54px;
  padding: 6px 2px;
  color: #2a5f7a;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.1;
  text-decoration: none;
  border-radius: 12px;
  transition: color .18s ease;
  -webkit-tap-highlight-color: transparent;
}
.mobile-tab svg {
  width: 23px;
  height: 23px;
  flex: 0 0 auto;
}
.mobile-tab.is-active {
  color: var(--color-primary, #0087b3);
}
.mobile-tab.is-active svg {
  filter: drop-shadow(0 4px 10px rgba(0,172,235,.28));
}
.mobile-tab.is-active::before {
  content: "";
  position: absolute;
  top: 4px;
  left: 50%;
  width: 46px;
  height: 30px;
  transform: translateX(-50%);
  border-radius: 999px;
  background: rgba(0,172,235,.10);
  z-index: -1;
}
.mobile-tab { position: relative; }
/* B-1 定稿（2026-08）：手机端主导航改为「右下悬浮钮 + 右侧半屏抽屉」，底部 Tab 已停用。
   顶部只保留品牌区，主导航入口收敛到右下悬浮钮。
   选择器加 html 前缀提升特异性，以覆盖 mobile-functional-layout.css 后加载的同权重规则。 */
html body.mobile-page header.nav .nav-menu.mobile-primary-nav,
html body.mobile-page header.nav .nav-menu,
html body.mobile-page header.nav .tools-nav-menu {
  display: none !important;
}

/* 表单页（cooperate/demand/suggest）补齐顶部导航后的菜单排布 */
@media (min-width: 769px) {
  .nav .nav-menu {
    display: flex !important;
    align-items: center;
    gap: 26px;
  }
  .nav .nav-menu a {
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    padding: 8px 2px;
    white-space: nowrap;
  }
  .nav .nav-menu a:not(.active) { color: #0a4a63 !important; }
  .nav .nav-menu a:not(.active):hover { color: var(--color-primary, #0087b3) !important; }
  .nav .nav-menu a.active { color: var(--color-primary, #0087b3) !important; }
}

/* ============================================================
   T3：文字对比度提级（WCAG AA）
   加深次要文本变量、占位符、协议/免责小字、时间戳
   ============================================================ */
:root {
  --text-3: #566780;  /* 原 #2a5f7a ≈4.4:1 → 现 ≈5.2:1 */
  --text-4: #2a5f7a;  /* 原 #94a3b8 ≈2.9:1 → 现 ≈4.6:1 */
}

/* 通用输入框占位符（文本/邮箱/电话/多行） */
input::placeholder,
textarea::placeholder,
select:invalid,
.form-control::placeholder {
  color: #6b7a8d !important;
  opacity: 1;
}

/* 登录/注册：协议勾选、说明文字、时间戳 */
.account-agreement { color: #58697f !important; }
.account-agreement a { color: #2f6fbd !important; }
.account-auth p { color: #51657d !important; }
.account-points-summary small { color: #5f7187 !important; }
.account-list-item time,
.account-timeline-item time { color: #2a5f7a !important; }

/* 首页免责声明：小字正文提级 */
.usage-disclaimer .news-item p { color: #4a5b70; }
.usage-disclaimer .news-item h4 { color: #2c3e55; }

/* ============================================================
   T4：首页门面改版（价值主张 + 数据带 + 免责声明下沉）
   ============================================================ */

/* —— 价值主张 Hero：桌面左右双栏，移动端上下堆叠 —— */
body[data-page="home"]:not(.mobile-page) .hero-shell {
  display: grid !important;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr) !important;
  align-items: center !important;
  gap: 42px !important;
  padding: 46px 48px !important;
}
body[data-page="home"]:not(.mobile-page) .hero-shell .search-panel { align-self: center; }
body[data-page="home"] .hero-intro { position: relative; z-index: 1; min-width: 0; }
body[data-page="home"] .hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 13px;
  border-radius: 999px;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .02em;
  color: #0087b3;
  background: rgba(0,172,235,.12);
  border: 1px solid rgba(0,172,235,.22);
}
body[data-page="home"] .hero-title {
  margin: 16px 0 14px;
  font-size: 38px;
  line-height: 1.22;
  font-weight: 800;
  letter-spacing: -.02em;
  color: var(--text-1, #002e3d) !important;
}
body[data-page="home"] .hero-lede {
  margin: 0 0 26px;
  max-width: 540px;
  font-size: 15.5px;
  line-height: 1.85;
  color: #0a4a63 !important;
}
body[data-page="home"] .hero-cta-row { display: flex; flex-wrap: wrap; gap: 13px; }
body[data-page="home"] .hero-shell .hero-cta-primary,
body[data-page="home"] .hero-shell .hero-cta-ghost {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  height: 50px;
  padding: 0 28px;
  border-radius: 14px;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
body[data-page="home"] .hero-shell .hero-cta-primary {
  color: #fff !important;
  background: linear-gradient(135deg, #1d5fd0, #2f7df0) !important;
  border: 1px solid transparent !important;
  box-shadow: 0 14px 28px rgba(29, 95, 208, .30) !important;
}
body[data-page="home"] .hero-shell .hero-cta-primary:hover { transform: translateY(-1px); box-shadow: 0 18px 34px rgba(29, 95, 208, .38) !important; }
body[data-page="home"] .hero-shell .hero-cta-ghost {
  color: #1d66c8 !important;
  background: rgba(255, 255, 255, .85) !important;
  border: 1px solid rgba(0,172,235,.35) !important;
  box-shadow: none !important;
}
body[data-page="home"] .hero-shell .hero-cta-ghost:hover { background: #fff !important; transform: translateY(-1px); }

/* —— 数据带 —— */
body[data-page="home"] .home-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin-top: 22px;
  margin-bottom: 4px;
}
body[data-page="home"] .home-stat {
  text-align: center;
  padding: 22px 14px;
  border-radius: 20px;
  background: rgba(255, 255, 255, .62);
  border: 1px solid rgba(255, 255, 255, .78);
  box-shadow: 0 16px 40px rgba(0,172,235,.08), inset 0 1px 0 rgba(255, 255, 255, .7);
  backdrop-filter: blur(20px) saturate(1.3);
  -webkit-backdrop-filter: blur(20px) saturate(1.3);
}
body[data-page="home"] .home-stat-num {
  display: block;
  font-size: 32px;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -.02em;
  background: linear-gradient(135deg, #0087b3, #38bdf8);
  -webkit-background-clip: text;
  background-clip: text;
  color: #0087b3;
}
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  body[data-page="home"] .home-stat-num { color: transparent; }
}
body[data-page="home"] .home-stat-label {
  display: block;
  margin-top: 7px;
  font-size: 13px;
  font-weight: 600;
  color: #566780;
}

/* —— 免责声明下沉：弱化为页脚式附注，去除重卡片感 —— */
body[data-page="home"] .usage-disclaimer {
  background: rgba(255, 255, 255, .42) !important;
  border: 1px solid rgba(148, 163, 184, .20) !important;
  box-shadow: none !important;
  padding: 18px 22px !important;
  border-radius: 18px !important;
}
body[data-page="home"] .usage-disclaimer .section-head { margin-bottom: 8px; }
body[data-page="home"] .usage-disclaimer .section-head h2 {
  font-size: 14px;
  font-weight: 700;
  color: #5b6b80;
}
body[data-page="home"] .usage-disclaimer .news-grid { gap: 14px; }
/* 免责声明三卡：参照手机端白色玻璃小卡，整卡细边框替代原先仅底部的一条浅线（2026-09 用户反馈） */
body[data-page="home"] .usage-disclaimer .news-item {
  background: rgba(255, 255, 255, .5) !important;
  border: 1px solid rgba(255, 255, 255, .68) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .72), 0 10px 26px rgba(31, 72, 112, .05) !important;
  border-radius: 14px !important;
  padding: 14px 16px !important;
}
body[data-page="home"] .usage-disclaimer .news-item h4 { font-size: 12.5px; color: #3d5069; }
body[data-page="home"] .usage-disclaimer .news-item p { font-size: 12px; line-height: 1.7; color: #5d6e83 !important; margin: 3px 0 0; }

@media (max-width: 900px) {
  body[data-page="home"] .hero-title { font-size: 27px; }
  body[data-page="home"] .hero-lede { font-size: 14px; margin-bottom: 20px; }
  body[data-page="home"] .home-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  body[data-page="home"] .home-stat { padding: 16px 10px; }
  body[data-page="home"] .home-stat-num { font-size: 26px; }
  body[data-page="home"] .hero-cta-primary,
  body[data-page="home"] .hero-cta-ghost { flex: 1 1 auto; padding: 0 18px; }
}

/* ============================================================
   T5：需求 / 合作 / 建议 三表单页布局与控件统一
   作用于 data-page = cooperate | demand | suggest（PC 与手机同页名）
   只规范化通用表单元素，不改动各页字段结构与业务逻辑。
   ============================================================ */
body[data-page="cooperate"] .form-card,
body[data-page="demand"] .form-card,
body[data-page="suggest"] .form-card {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  background: rgba(255, 255, 255, .96) !important;
  border: 1px solid rgba(255, 255, 255, .6) !important;
  border-radius: 22px !important;
  box-shadow: 0 18px 45px rgba(15, 23, 42, .10) !important;
}
body[data-page="cooperate"] .form-card *,
body[data-page="demand"] .form-card *,
body[data-page="suggest"] .form-card * {
  box-sizing: border-box;
}

/* 表单标题与引导文案 */
body[data-page="cooperate"] .form-card h2,
body[data-page="demand"] .form-card h2,
body[data-page="suggest"] .form-card h2 {
  font-size: 22px;
  font-weight: 800;
  color: var(--text-1, #002e3d);
}
body[data-page="cooperate"] .form-intro,
body[data-page="demand"] .form-intro,
body[data-page="suggest"] .form-intro {
  margin: 6px 0 18px;
  font-size: 13px;
  line-height: 1.7;
  color: #566780;
}

/* 字段标签统一 */
body[data-page="cooperate"] .form-card .field > label,
body[data-page="demand"] .form-card .field > label,
body[data-page="suggest"] .form-card .field > label {
  display: block;
  margin-bottom: 8px;
  font-size: 14px;
  font-weight: 700;
  color: #33415c;
}

/* 必填标记基础样式；表单页随后统一为浅色弱提示。 */
body[data-page="demand"] .form-card .required,
body[data-page="cooperate"] .form-card .required,
body[data-page="suggest"] .form-card .required {
  color: #e5484d;
  font-weight: 800;
}

/* 必填说明放在字段名称后，以浅色弱化显示，不与字段正文抢视觉重点。 */
body[data-page="cooperate"] .form-card .required,
body[data-page="demand"] .form-card .required,
body[data-page="suggest"] .form-card .required,
body[data-page="cooperate"] .form-card .required-mark,
body[data-page="demand"] .form-card .required-mark,
body[data-page="suggest"] .form-card .required-mark {
  color: #8799ab !important;
  font-weight: 600 !important;
  margin: 0 0 0 4px;
}

body[data-page="cooperate"] .form-card .required-hint,
body[data-page="demand"] .form-card .required-hint,
body[data-page="suggest"] .form-card .required-hint {
  color: #8799ab;
  font-size: .88em;
  font-weight: 500;
  margin-left: 2px;
  white-space: nowrap;
}

/* 输入控件统一：高度、边框、圆角、聚焦态 */
body[data-page="cooperate"] .form-card input:not([type="checkbox"]):not([type="radio"]),
body[data-page="cooperate"] .form-card select,
body[data-page="cooperate"] .form-card textarea,
body[data-page="demand"] .form-card input:not([type="checkbox"]):not([type="radio"]),
body[data-page="demand"] .form-card select,
body[data-page="demand"] .form-card textarea,
body[data-page="suggest"] .form-card input:not([type="checkbox"]):not([type="radio"]),
body[data-page="suggest"] .form-card select,
body[data-page="suggest"] .form-card textarea {
  width: 100%;
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid rgba(148, 163, 184, .38) !important;
  border-radius: 12px !important;
  background: #f0fafd !important;
  font-size: 16px;
  color: #1f2d40;
  box-shadow: none !important;
  transition: border-color .16s ease, box-shadow .16s ease;
}
body[data-page="cooperate"] .form-card textarea,
body[data-page="demand"] .form-card textarea,
body[data-page="suggest"] .form-card textarea {
  min-height: 132px;
  padding: 12px 14px;
  line-height: 1.7;
  resize: vertical;
}
body[data-page="cooperate"] .form-card input:focus,
body[data-page="cooperate"] .form-card select:focus,
body[data-page="cooperate"] .form-card textarea:focus,
body[data-page="demand"] .form-card input:focus,
body[data-page="demand"] .form-card select:focus,
body[data-page="demand"] .form-card textarea:focus,
body[data-page="suggest"] .form-card input:focus,
body[data-page="suggest"] .form-card select:focus,
body[data-page="suggest"] .form-card textarea:focus {
  outline: none;
  border-color: rgba(0,172,235,.6) !important;
  box-shadow: 0 0 0 3px rgba(0,172,235,.12) !important;
  background: #fff !important;
}

/* 提交按钮统一（cooperate/suggest 用 .submit-btn，demand 用 .primary-btn） */
body[data-page="cooperate"] .form-card .submit-btn,
body[data-page="suggest"] .form-card .submit-btn,
body[data-page="demand"] .form-card .primary-btn {
  min-height: 48px;
  padding: 0 30px;
  border: 0;
  border-radius: 14px;
  font-size: 15px;
  font-weight: 700;
  color: #fff !important;
  background: linear-gradient(135deg, #1d5fd0, #2f7df0) !important;
  box-shadow: 0 12px 24px rgba(29, 95, 208, .26) !important;
  cursor: pointer;
  transition: transform .16s ease, box-shadow .16s ease;
}
body[data-page="cooperate"] .form-card .submit-btn:hover,
body[data-page="suggest"] .form-card .submit-btn:hover,
body[data-page="demand"] .form-card .primary-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 16px 30px rgba(29, 95, 208, .32) !important;
}

/* 隐私授权勾选统一 */
body[data-page="cooperate"] .form-card .privacy-consent,
body[data-page="demand"] .form-card .privacy-consent,
body[data-page="suggest"] .form-card .privacy-consent {
  font-size: 13px;
  line-height: 1.7;
  color: #58697f;
}
body[data-page="cooperate"] .form-card .privacy-consent a,
body[data-page="demand"] .form-card .privacy-consent a,
body[data-page="suggest"] .form-card .privacy-consent a {
  color: #2f6fbd;
  font-weight: 600;
}

/* 提交状态/提示文字统一 */
body[data-page="cooperate"] .form-status,
body[data-page="suggest"] .form-status,
body[data-page="demand"] .status {
  font-size: 13px;
  color: #168356;
}

/* T5 移动端：三表单页窄屏防横向溢出兜底（360–430 真机） */
body.mobile-page[data-page="cooperate"] .form-card,
body.mobile-page[data-page="demand"] .form-card,
body.mobile-page[data-page="suggest"] .form-card,
body.mobile-page[data-page="cooperate"] .form-grid,
body.mobile-page[data-page="demand"] .form-grid,
body.mobile-page[data-page="suggest"] .form-grid,
body.mobile-page[data-page="cooperate"] .field,
body.mobile-page[data-page="demand"] .field,
body.mobile-page[data-page="suggest"] .field,
body.mobile-page[data-page="cooperate"] .submit-row,
body.mobile-page[data-page="demand"] .submit-row,
body.mobile-page[data-page="suggest"] .submit-row {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}
body.mobile-page[data-page="cooperate"] .form-grid,
body.mobile-page[data-page="demand"] .form-grid,
body.mobile-page[data-page="suggest"] .form-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 16px !important;
}
body.mobile-page[data-page="cooperate"] .form-card input:not([type="checkbox"]):not([type="radio"]),
body.mobile-page[data-page="cooperate"] .form-card select,
body.mobile-page[data-page="cooperate"] .form-card textarea,
body.mobile-page[data-page="demand"] .form-card input:not([type="checkbox"]):not([type="radio"]),
body.mobile-page[data-page="demand"] .form-card select,
body.mobile-page[data-page="demand"] .form-card textarea,
body.mobile-page[data-page="suggest"] .form-card input:not([type="checkbox"]):not([type="radio"]),
body.mobile-page[data-page="suggest"] .form-card select,
body.mobile-page[data-page="suggest"] .form-card textarea {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  font-size: 16px !important;
}
/* 手机端表单控件统一规格（2026-09-03）：输入/下拉 48px 高、12px 圆角；
   主提交 48px、14px 圆角；次级/重置按钮 44px、14px 圆角。 */
body.mobile-page[data-page="cooperate"] .form-card input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body.mobile-page[data-page="cooperate"] .form-card select,
body.mobile-page[data-page="demand"] .form-card input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body.mobile-page[data-page="demand"] .form-card select,
body.mobile-page[data-page="suggest"] .form-card input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body.mobile-page[data-page="suggest"] .form-card select {
  height: 48px !important;
  min-height: 48px !important;
  line-height: 1.4 !important;
  border-radius: 12px !important;
}
/* 隐私授权行：checkbox 保持固有尺寸，文字正常横排 */
body.mobile-page[data-page="cooperate"] .form-card .privacy-consent,
body.mobile-page[data-page="demand"] .form-card .privacy-consent,
body.mobile-page[data-page="suggest"] .form-card .privacy-consent {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  flex-wrap: nowrap !important;
}
body.mobile-page[data-page="cooperate"] .form-card .privacy-consent input[type="checkbox"],
body.mobile-page[data-page="demand"] .form-card .privacy-consent input[type="checkbox"],
body.mobile-page[data-page="suggest"] .form-card .privacy-consent input[type="checkbox"] {
  width: 18px !important;
  min-width: 18px !important;
  height: 18px !important;
  flex: 0 0 18px !important;
  margin: 2px 0 0 !important;
}
body.mobile-page[data-page="cooperate"] .form-card .privacy-consent span,
body.mobile-page[data-page="demand"] .form-card .privacy-consent span,
body.mobile-page[data-page="suggest"] .form-card .privacy-consent span {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  white-space: normal !important;
  word-break: break-word !important;
}
body.mobile-page[data-page="cooperate"] .form-card .submit-btn,
body.mobile-page[data-page="suggest"] .form-card .submit-btn,
body.mobile-page[data-page="demand"] .form-card .primary-btn {
  width: 100% !important;
  height: 48px !important;
  min-height: 48px !important;
  border-radius: 14px !important;
}
body.mobile-page[data-page="demand"] .form-card .ghost-btn {
  width: 100% !important;
  height: 44px !important;
  min-height: 44px !important;
  border-radius: 14px !important;
}
body.mobile-page[data-page="demand"] .form-card .submit-row {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

/* ============================================================
   T6：产品详情 —— 关键参数摘要 + 同品牌其他型号
   ============================================================ */
.modal-related[hidden] {
  display: none !important;
}
/* 同品牌其他型号：与上方参数清晰分隔 */
.modal-related {
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px dashed rgba(148, 163, 184, .45);
}
.modal-related h4 {
  margin-bottom: 12px;
}
.related-models {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.related-model-btn {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 2px;
  min-height: 40px;
  box-sizing: border-box;
  padding: 9px 14px;
  background: #f6f9fe;
  border: 1px solid rgba(148, 163, 184, .35);
  border-radius: 12px;
  cursor: pointer;
  text-align: left;
  transition: border-color .15s ease, background .15s ease, transform .15s ease;
}
.related-model-btn:hover {
  border-color: rgba(47, 125, 240, .6);
  background: #eef4ff;
  transform: translateY(-1px);
}
.related-model-btn .related-model-name {
  font-size: 13px;
  font-weight: 700;
  color: #1f2d40;
  line-height: 1.35;
  white-space: nowrap;
}
.related-model-more {
  align-self: center;
  font-size: 12px;
  color: #7a8aa0;
  padding: 9px 4px;
}
@media (max-width: 600px) {
  .related-model-btn { flex: 0 1 auto; min-width: 0; }
}

/* ============================================================
   T7：产品库筛选前置
   PC 端筛选面板默认内联展开在列表上方；实时筛选，无需“查看结果”。
   底部完成条仅服务于移动端底部弹层，PC 内联态隐藏。
   ============================================================ */
body:not(.mobile-page)[data-page="products"] .filter-panel.open .filter-done-bar {
  display: none;
}
body:not(.mobile-page)[data-page="products"] .filter-panel.open {
  margin: 0 0 18px;
  padding: 18px 20px;
}
body:not(.mobile-page)[data-page="products"] .filter-panel.open .filter-row {
  margin-bottom: 0;
}

/* ============================================================
   T8：论坛未登录降噪 + 登录按钮配色
   1. 未登录信息流不再在每条帖子下重复大登录按钮；
      仅展开评论后出现一条低调文字登录链接。
   2. 登录/发布按钮统一品牌蓝（移动端微信绿已在 mobile-forum-p1 修正）。
   ============================================================ */
body[data-page="forum"] .comment-login-tip {
  padding: 8px 12px;
  margin-top: 8px;
}
body[data-page="forum"] .comment-login-link {
  flex: 0 0 auto;
  padding: 4px 2px;
  font-size: 13px;
  font-weight: 600;
  color: #2f7fe8;
  text-decoration: none;
  white-space: nowrap;
}
body[data-page="forum"] .comment-login-link:hover { text-decoration: underline; }
body[data-page="forum"] .side-login-action { margin-top: 12px; }
body[data-page="forum"] .side-login-action .wechat-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 42px;
  color: #fff !important;
  -webkit-text-fill-color: #fff;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 8px 18px rgba(47, 127, 232, .22);
}

/* ============================================================
   手机端圆角层级统一（2026-09-03 视觉归一）
   层级：hero 大容器 24px / 内容卡片 20px / 内部控件 12–14px。
   用 html + data-page 提高特异性，收敛各页面级 CSS 的离散值
   （原 28/24/22/20/18/16/15px 并存）。
   注意：首页以外的 hero/搜索标题区按 mobile-section-layout 的
   设计刻意扁平化（透明、0 圆角，融入页面流），此处不覆盖；
   内部小卡（帖子、列表项、评论、输入控件、弹层）保持小尺度圆角。
   ============================================================ */
html body.mobile-page[data-page="home"] .hero-shell,
html body.mobile-page[data-page="home"] .hero-card,
html body.mobile-page[data-page="home"] .search-shell {
  border-radius: 24px !important;
}
html body.mobile-page[data-page] .card,
html body.mobile-page[data-page] .section-card,
html body.mobile-page[data-page] .panel,
html body.mobile-page[data-page] .form-card,
html body.mobile-page[data-page] .section,
html body.mobile-page[data-page] .news-column,
html body.mobile-page[data-page] .feed,
html body.mobile-page[data-page] .portal-card,
html body.mobile-page[data-page] .product-card,
html body.mobile-page[data-page] .cat-product-card,
html body.mobile-page[data-page] .term-card,
html body.mobile-page[data-page] .tool-panel,
html body.mobile-page[data-page] .knowledge-reports,
html body.mobile-page[data-page="home"] .live-block {
  border-radius: 18px !important;
}