/* ============================================================================
   北极星 V3 · 基础层（reset + 应用外壳 + 极光背景 + 顶栏/底栏 + 排版基线）
   ----------------------------------------------------------------------------
   依赖：tokens.css
   布局：390×844 手机竖屏为基准；桌面居中最大 --app-max(560)，两侧露出深空底。
   安全区：一律 var(--safe-t/-b/-l/-r)（安卓壳注入覆盖值；Web 用 env() 兜底）。
   背景：.aurora 固定三层（天光 / 3 团星云 / 核心呼吸）+ 压暗 + 噪点；
        动画只动 transform/opacity；滚动时 body.is-scrolling 暂停（JS 一行）。
   ========================================================================== */

/* ------------------------------ reset ------------------------------ */
*, *::before, *::after { box-sizing: border-box; }
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  background: var(--bg-0);
}
html, body { margin: 0; padding: 0; }
body {
  min-height: 100vh;
  min-height: 100dvh;
  background: var(--bg-0);
  color: var(--txt-0);
  font-family: var(--font-sans);
  font-size: var(--fs-15);
  line-height: var(--lh-3);
  letter-spacing: var(--ls-cjk);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
  overscroll-behavior-y: none;
  transition: background-color var(--dur-2) var(--ease-out), color var(--dur-2) var(--ease-out);
}
h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd { margin: 0; }
ul, ol { margin: 0; padding-left: 1.25em; }
img, svg, video { max-width: 100%; display: block; }
button, input, select, textarea { font: inherit; color: inherit; letter-spacing: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; -webkit-tap-highlight-color: transparent; }
a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; }
table { border-collapse: collapse; }
[hidden] { display: none !important; }
hr { border: 0; }
::selection { background: var(--brand-soft); color: var(--txt-0); }

:where(button, a, [role="button"], [tabindex]):focus-visible {
  outline: 2px solid var(--aurora-teal);
  outline-offset: 2px;
  border-radius: inherit;
}
:focus:not(:focus-visible) { outline: none; }

/* ------------------------------ 极光背景 ------------------------------ */
.aurora {
  position: fixed;
  inset: 0;
  z-index: var(--z-aurora);
  pointer-events: none;
  overflow: hidden;
  contain: strict;
  background: var(--page-grad);
}
.aurora__sky {
  position: absolute;
  left: -20%; right: -20%; top: -18%;
  height: 56%;
  background:
    radial-gradient(46% 100% at 50% 100%, var(--aurora-2), transparent 72%),
    radial-gradient(70% 92% at 50% 0%, var(--aurora-3), transparent 74%);
}
.aurora__orb {
  position: absolute;
  width: 124vmax; height: 124vmax;
  border-radius: 50%;
  will-change: transform;
  transform: translate3d(0, 0, 0);
}
.aurora__orb--1 {
  top: -58vmax; left: -44vmax;
  background: radial-gradient(circle at 50% 50%, var(--aurora-1) 0%, transparent 62%);
  animation: orb-a var(--ambient-1) var(--ease-in-out) infinite alternate;
}
.aurora__orb--2 {
  top: -52vmax; right: -50vmax;
  background: radial-gradient(circle at 50% 50%, var(--aurora-2) 0%, transparent 60%);
  animation: orb-b var(--ambient-2) var(--ease-in-out) infinite alternate;
}
.aurora__orb--3 {
  bottom: -64vmax; left: -24vmax;
  background: radial-gradient(circle at 50% 50%, var(--aurora-4) 0%, transparent 56%);
  animation: orb-c calc(var(--ambient-2) * 1.4) var(--ease-in-out) infinite alternate;
}
/* 核心呼吸：大柔光之上再叠「小而亮」的核心 → 形成光晕半径差（纵深感的关键） */
.aurora__core {
  position: absolute;
  left: 50%; top: -18%;
  width: 96vmax; height: 72vmax;
  transform: translateX(-50%);
  background: radial-gradient(closest-side,
    rgba(190, 255, 246, .16) 0%,
    var(--aurora-teal-soft) 34%,
    transparent 72%);
  mix-blend-mode: screen;
  animation: core-breathe var(--breathe) var(--ease-in-out) infinite alternate;
}
.aurora__vignette {
  position: absolute;
  inset: 0;
  background: var(--vignette);
}
:root[data-theme="light"] .aurora__core { mix-blend-mode: soft-light; }

/* 噪点：内联 SVG 湍流（零请求），压色带、加胶片质感。alpha 必须极低 */
.noise {
  position: fixed;
  inset: 0;
  z-index: var(--z-noise);
  pointer-events: none;
  opacity: .035;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E");
  background-size: 160px 160px;
}
:root[data-theme="light"] .noise { opacity: .022; mix-blend-mode: soft-light; }

/* 滚动保护：滚动时暂停环境光动画（省电、保滚动 FPS） */
body.is-scrolling .aurora__orb,
body.is-scrolling .aurora__core { animation-play-state: paused; }

/* 低端机 / 省电模式：关动态、关噪点、玻璃降级（由 JS 设 data-perf="lite"） */
html[data-perf="lite"] .aurora__orb,
html[data-perf="lite"] .aurora__core { animation: none !important; }
html[data-perf="lite"] .noise { display: none; }

/* ------------------------------ 应用外壳 ------------------------------ */
#app {
  position: relative;
  z-index: var(--z-content);
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-height: 100dvh;
  width: 100%;
  max-width: var(--app-max);
  margin: 0 auto;
}

/* ------------------------------ 顶栏 ------------------------------ */
#topbar {
  position: sticky;
  top: 0;
  z-index: var(--z-sticky);
  display: flex;
  align-items: center;
  gap: var(--s-2);
  height: calc(var(--topbar-h) + var(--safe-t));
  padding: var(--safe-t) calc(var(--s-3) + var(--safe-r)) 0 calc(var(--s-3) + var(--safe-l));
  background: var(--bg-0);                       /* 老 WebView 兜底 */
  background: color-mix(in srgb, var(--bg-0) 66%, transparent);
  -webkit-backdrop-filter: var(--surface-blur);
  backdrop-filter: var(--surface-blur);
  border-bottom: 1px solid transparent;
  transition: border-color var(--dur-2) var(--ease-out), background-color var(--dur-2) var(--ease-out);
}
#topbar::after {                                  /* 顶栏底缘一条极光渐变线 */
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  height: 1px;
  background: linear-gradient(90deg,
    transparent 0%, var(--aurora-teal-line) 32%, var(--aurora-violet-line) 62%, transparent 100%);
  opacity: 0;
  transition: opacity var(--dur-2) var(--ease-out);
  pointer-events: none;
}
#topbar.scrolled { border-bottom-color: var(--line-1); }
#topbar.scrolled::after { opacity: .5; }

.brand {
  display: inline-flex;
  align-items: center;
  gap: var(--s-2);
  min-width: 0;
  color: var(--txt-0);
  -webkit-tap-highlight-color: transparent;
}
.brand-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px; height: 30px;
  border-radius: 50%;
  background:
    radial-gradient(120% 120% at 30% 20%, rgba(255, 224, 138, .30), transparent 62%),
    var(--brand-soft);
  box-shadow: inset 0 0 0 1px var(--brand-line), 0 0 18px var(--brand-glow);
  flex: none;
}
.brand-mark svg { width: 18px; height: 18px; }
.brand-text { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; line-height: 1; }
.brand-name {
  font-size: var(--fs-17);
  font-weight: var(--fw-bold);
  letter-spacing: .04em;
  line-height: 1.1;
  white-space: nowrap;
}
.brand-sub {
  margin-top: 3px;
  font-size: var(--fs-11);
  color: var(--txt-2);
  letter-spacing: .04em;
  line-height: 1.2;
}
.top-right { margin-left: auto; display: flex; align-items: center; gap: 6px; flex: none; }

/* 连接状态：常驻但弱化（小圆点 + 12px 灰字），只在异常时上色 */
.conn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 24px;
  padding: 0 8px;
  border-radius: var(--r-full);
  border: 1px solid var(--line-1);
  background: var(--surface-1);
  font-size: var(--fs-11);
  font-weight: var(--fw-medium);
  letter-spacing: .02em;
  color: var(--txt-2);
  white-space: nowrap;
  max-width: 132px;
  overflow: hidden;
}
.conn::before {
  content: "";
  width: 5px; height: 5px;
  border-radius: 50%;
  background: currentColor;
  flex: none;
  box-shadow: 0 0 6px currentColor;
}
.conn.on { color: var(--txt-2); border-color: var(--line-1); background: var(--surface-1); }
.conn.on::before { background: var(--ok); box-shadow: 0 0 7px var(--ok); }
.conn.off { color: var(--danger); border-color: var(--danger-line); background: var(--danger-soft); }
.conn.wait { color: var(--txt-2); }
.conn.ping::before { animation: pulse-dot 1.2s var(--ease-out) 1; }
/* 320 窄屏：顶栏品牌+连接徽标+刷新+头像会互相挤压，隐藏连接徽标（异常状态仍由首页诊断条兜底） */
@media (max-width: 340px) {
  .conn { display: none; }
}

.icon-btn {
  width: var(--tap-min);
  height: var(--tap-min);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--r-sm);
  color: var(--txt-1);
  background: transparent;
  -webkit-tap-highlight-color: transparent;
  transition: background-color var(--dur-1) var(--ease-out),
              color var(--dur-1) var(--ease-out),
              transform var(--dur-1) var(--ease-out);
}
.icon-btn svg { width: 21px; height: 21px; }
.icon-btn:active { transform: scale(.92); background: var(--surface-2); }
@media (hover: hover) { .icon-btn:hover { background: var(--surface-1); color: var(--txt-0); } }
.icon-btn.back { margin-left: -8px; }
.icon-btn.back svg { width: 23px; height: 23px; }
.icon-btn.spin svg { animation: spin .6s var(--ease-in-out); }

/* 头像：登录=首字金底；游客=线性 user 图标（CSS 背景实现，textContent 被 app.js 改写也不丢） */
.avatar-btn {
  width: 34px; height: 34px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--fs-13);
  font-weight: var(--fw-bold);
  color: var(--txt-on-brand);
  background: var(--brand-grad);
  box-shadow: var(--sh-brand), inset 0 1px 0 rgba(255, 255, 255, .5);
  flex: none;
  -webkit-tap-highlight-color: transparent;
  transition: transform var(--dur-1) var(--ease-out);
}
.avatar-btn:active { transform: scale(.92); }
.avatar-btn.guest {
  background: var(--surface-2);
  color: transparent;                     /* 文字（👤）不可见，图标走背景 */
  box-shadow: inset 0 0 0 1px var(--line-2);
  background-image:
    linear-gradient(transparent, transparent),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23aeb9ce' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='3.6'/%3E%3Cpath d='M4.8 20.4a7.2 7.2 0 0 1 14.4 0'/%3E%3C/svg%3E");
  background-repeat: no-repeat, no-repeat;
  background-position: center, center;
  background-size: 100% 100%, 18px 18px;
  font-size: 0;
}

/* ------------------------------ 页面容器 ------------------------------ */
#views {
  position: relative;
  flex: 1;
  width: 100%;
  padding:
    var(--s-3)
    calc(var(--page-x) + var(--safe-r))
    calc(var(--tabbar-h) + 36px + var(--safe-b))
    calc(var(--page-x) + var(--safe-l));
}
.view { min-height: 40vh; }
.page { display: flex; flex-direction: column; gap: var(--s-3); }
.page--flush { gap: 0; }

/* 页面通用标题（非 tab 页顶部） */
.page-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--s-3);
  padding: var(--s-2) 2px 0;
}
.page-head .ph-t {
  font-size: var(--fs-26);
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-cjk-title);
  line-height: 1.15;
}
.page-head .ph-s { margin-top: 4px; font-size: var(--fs-12); color: var(--txt-2); }

/* ------------------------------ 底栏 ------------------------------ */
#tabbar {
  position: fixed;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  z-index: var(--z-tabbar);
  display: flex;
  align-items: stretch;
  width: 100%;
  max-width: var(--app-max);
  height: calc(var(--tabbar-h) + var(--safe-b));
  padding: 0 calc(2px + var(--safe-r)) var(--safe-b) calc(2px + var(--safe-l));
  background: var(--bg-0);                        /* 老 WebView 兜底 */
  background: color-mix(in srgb, var(--bg-0) 76%, transparent);
  -webkit-backdrop-filter: var(--surface-blur);
  backdrop-filter: var(--surface-blur);
  border-top: 1px solid var(--line-1);
}
#tabbar::before {                                 /* 顶缘极光渐隐 */
  content: "";
  position: absolute;
  left: 8%; right: 8%; top: -1px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--aurora-teal-line), var(--aurora-violet-line), transparent);
  opacity: .55;
  pointer-events: none;
}
.tabbtn {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  position: relative;
  color: var(--txt-2);
  font-size: 10.5px;
  font-weight: var(--fw-medium);
  letter-spacing: .04em;
  line-height: 1;
  -webkit-tap-highlight-color: transparent;
  transition: color var(--dur-1) var(--ease-out);
}
.tabbtn .tb-ico { display: inline-flex; align-items: center; justify-content: center; height: 22px; }
.tabbtn .tb-ico svg { width: 21px; height: 21px; }
.tb-txt { transform: translateY(0); transition: transform var(--dur-2) var(--ease-out); }
.tabbtn:active .tb-ico { transform: scale(.9); }
.tabbtn .tb-ico { transition: transform var(--dur-2) var(--ease-spring); }
.tabbtn.active { color: var(--brand); }
.tabbtn.active .tb-ico { filter: drop-shadow(0 0 7px var(--brand-glow)); }
.tabbtn.active .tb-ico svg { stroke-width: 2; }
.tabbtn.active::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 26px;
  height: 3px;
  border-radius: 0 0 3px 3px;
  background: linear-gradient(90deg, var(--brand-2), var(--brand-hi));
  box-shadow: 0 0 14px var(--brand-glow);
}
/* 管理 tab 的红点（有待办时由 JS 加 .has-dot） */
.tabbtn .tb-dot {
  position: absolute;
  top: 9px; left: 50%;
  margin-left: 8px;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--danger);
  box-shadow: 0 0 8px var(--danger);
  display: none;
}
.tabbtn.has-dot .tb-dot { display: block; }

/* ------------------------------ 滚动锁 ------------------------------ */
body.is-locked {
  position: fixed;
  left: 0; right: 0;
  width: 100%;
  overflow: hidden;
  touch-action: none;
}

/* ------------------------------ 排版基线 ------------------------------ */
.title-xl {
  font-size: var(--fs-26);
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-cjk-title);
  line-height: var(--lh-2);
}
.title-lg { font-size: var(--fs-20); font-weight: var(--fw-semibold); letter-spacing: .02em; line-height: var(--lh-2); }
.title-md { font-size: var(--fs-17); font-weight: var(--fw-semibold); letter-spacing: .02em; line-height: var(--lh-2); }
.title-sm { font-size: var(--fs-15); font-weight: var(--fw-semibold); letter-spacing: .01em; line-height: var(--lh-2); }
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--fs-11);
  font-weight: var(--fw-medium);
  letter-spacing: var(--ls-label);
  color: var(--txt-2);
  text-transform: uppercase;
}
.body { font-size: var(--fs-15); line-height: var(--lh-4); color: var(--txt-1); }
.caption { font-size: var(--fs-12); line-height: var(--lh-3); color: var(--txt-2); }
.hint { font-size: var(--fs-11); line-height: var(--lh-3); color: var(--txt-3); }
.num {
  font-family: var(--font-num);
  font-variant-numeric: tabular-nums lining-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
  letter-spacing: var(--ls-num);
}
.strong { color: var(--txt-0); font-weight: var(--fw-semibold); }
.gold { color: var(--brand-text); }
.teal { color: var(--aurora-teal); }
.violet { color: var(--aurora-violet); }
.up { color: var(--data-up); }
.down { color: var(--data-down); }
.muted { color: var(--txt-1); }
.dim { color: var(--txt-2); }
.faint { color: var(--txt-3); }
.nowrap { white-space: nowrap; }
.ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.center { text-align: center; }
.right { text-align: right; }

/* 布局工具（只做排列，不做视觉） */
.row { display: flex; align-items: center; gap: var(--s-2); }
.row-between { display: flex; align-items: center; justify-content: space-between; gap: var(--s-2); }
.row-top { display: flex; align-items: flex-start; gap: var(--s-2); }
.col { display: flex; flex-direction: column; gap: var(--s-2); }
.wrap { flex-wrap: wrap; }
.flex-1 { flex: 1; min-width: 0; }
.gap-1 { gap: var(--s-1); } .gap-2 { gap: var(--s-2); } .gap-3 { gap: var(--s-3); } .gap-4 { gap: var(--s-4); }
.mt1 { margin-top: var(--s-1); } .mt2 { margin-top: var(--s-2); } .mt3 { margin-top: var(--s-3); } .mt4 { margin-top: var(--s-4); }
.mb2 { margin-bottom: var(--s-2); } .mb3 { margin-bottom: var(--s-3); }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* 图标（icons.js 生成的 <svg class="ico"> 默认尺寸；按钮内由按钮覆盖） */
.ico { width: 20px; height: 20px; flex: none; }
.ico--sm { width: 16px; height: 16px; }
.ico--lg { width: 24px; height: 24px; }

/* ------------------------------ 大屏 / 桌面机框 ------------------------------ */
@media (min-width: 640px) {
  body {
    background:
      radial-gradient(60% 60% at 50% 0%, rgba(43, 217, 196, .05), transparent 70%),
      radial-gradient(50% 50% at 84% 30%, rgba(140, 124, 255, .06), transparent 70%),
      var(--bg-0);
  }
  #app {
    box-shadow: 0 0 0 1px var(--line-1), var(--sh-4);
    background: color-mix(in srgb, var(--bg-0) 55%, transparent);
  }
  #topbar { border-radius: 0; }
}

/* ------------------------------ noscript ------------------------------ */
.noscript {
  padding: 40px 24px;
  text-align: center;
  color: var(--txt-1);
  font-size: var(--fs-15);
  line-height: var(--lh-4);
}


/* ===========================================================================
   16. QA 修复（v3.1.2，Lead/QA 基线：对比度 / 触控 / lite 降级 / 底栏遮挡感）
   ========================================================================== */
/* ① 浅色下底部 tab 选中态不能用填充金当文字（#E8A317 on white = 2.02:1）；
      统一用 --brand-text（深色=#FFC94D / 浅色=#965F00），两主题都达 AA */
.tabbtn.active { color: var(--brand-text); }

/* ② 顶栏触控目标 ≥44（QA：brand 91×35、头像 34×34） */
.brand { min-height: var(--tap-min); }
.avatar-btn { width: var(--tap-min); height: var(--tap-min); }
.avatar-btn.guest { background-size: 100% 100%, 20px 20px; }

/* ③ 页面内小控件提升到 ≥ --tap-min(44px) 热区（2026-11-11 P2 收口：原 36/34/38px 仍被 QA 判小）；
      #views 提高选择器优先级，确保能覆盖 builder 的页面级 CSS。全部为真实元素尺寸，不用伪元素叠热区。 */
#views .date-btn { width: var(--tap-min); min-width: var(--tap-min); height: var(--tap-min); min-height: var(--tap-min); }
#views .chip { min-height: var(--tap-min); }
#views .anchor-chip { min-height: var(--tap-min); }
#views .card-link { min-height: var(--tap-min); }
#views .btn--sm { min-height: var(--tap-min); }
#views .tabbtn { min-height: var(--tap-min); }

/* ④ lite 降级：所有 backdrop-filter 一律关掉（含顶栏/底栏/玻璃卡/弹层/Toast），
      QA 实测 lite 下 backdrop-filter 数量必须下降；同时把无限动画再压一档 */
html[data-perf="lite"] #topbar,
html[data-perf="lite"] #tabbar,
html[data-perf="lite"] .card--glass,
html[data-perf="lite"] .card.glass,
html[data-perf="lite"] .sheet,
html[data-perf="lite"] .toast {
  -webkit-backdrop-filter: none !important;
          backdrop-filter: none !important;
}
html[data-perf="lite"] #topbar,
html[data-perf="lite"] #tabbar { background: var(--bg-1); }
html[data-perf="lite"] .sheet { background: var(--bg-0); }
html[data-perf="lite"] .toast { background: var(--bg-1); }
html[data-perf="lite"] .aurora__orb,
html[data-perf="lite"] .aurora__core,
html[data-perf="lite"] .dot--pulse,
html[data-perf="lite"] .live-dot,
html[data-perf="lite"] .task-step i.now { animation: none !important; }
html[data-perf="lite"] .noise { display: none; }

/* ⑤ 底栏「压住内容」的观感修复：
      a) tabbar 抬到 94% 不透明，避免滚动内容从玻璃下透出来；
      b) tabbar 上方加 18px 渐隐带，内容「溶进」底栏而不是被硬切；
      c) 页面底部留白已为 tabbar + 36px（QA 实测：滚到底最后内容距 tabbar 36px，无真实遮挡） */
#tabbar { background: color-mix(in srgb, var(--bg-0) 94%, transparent); }
#tabbar::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 100%;
  height: 18px;
  background: linear-gradient(180deg, transparent, var(--bg-0));
  opacity: .92;
  pointer-events: none;
}
body:has(.view-report) #views,
body:has(.view-match) #views,
body:has(.view-editor) #views { padding-bottom: calc(var(--safe-b) + 104px); }

/* ⑥ 吸顶筛选/锚点条必须不透明：否则滚动内容会从半透明条下透出（误看成「被盖住」）。
      用 #views 提高优先级，覆盖 builder 页面级 CSS；底部保留 10px 渐隐，内容自然「溶入」。 */
#views .filterbar,
#views .anchor-bar {
  background: var(--bg-0);
  box-shadow: 0 10px 16px -12px rgba(0, 0, 0, .55);
}
#views .filterbar::after,
#views .anchor-bar::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -10px;
  height: 10px;
  background: linear-gradient(180deg, var(--bg-0), transparent);
  pointer-events: none;
}

/* ===========================================================================
   17. QA P2 触控收口（2026-11-11）—— 交互元素真实 rect ≥ 44×44
   ---------------------------------------------------------------------------
   判定口径：qa-v3.mjs 用元素自身 getBoundingClientRect()（宽、高都要 ≥44），
   所以这里只放大真实元素/内边距，**不用 ::before/::after 假热区**。
   视觉策略：仅放大热区（图标/字号不变），用负 margin 收紧的 star / 关闭按钮
   保持原卡片观感；分段控制器整体变高 8~14px，仍在合理触控规范内。
   ========================================================================== */
/* 顶栏筛选图标 / 日期切换 / 关注星标 / 引导条关闭 */
#views .filter-icon { width: var(--tap-min); height: var(--tap-min); }
#views .date-btn { width: var(--tap-min); height: var(--tap-min); }
#views .date-today { min-height: var(--tap-min); }
#views .mc-star { width: var(--tap-min); height: var(--tap-min); margin-top: -13px; margin-bottom: -13px; margin-right: -22px; }
#views .fav-onboard .icon-btn { width: var(--tap-min); height: var(--tap-min); }

/* 可折叠分组头（role=button 的整行热区） */
#views .group-head[role="button"] { min-height: var(--tap-min); }

/* 按钮族：统一 ≥44 高；纯图标按钮同时保证 ≥44 宽 */
#views .btn { min-height: var(--tap-min); }
#views .btn--sm,
#views .btn--xs { min-height: var(--tap-min); min-width: var(--tap-min); }
#views .btn--icon { width: var(--tap-min); min-width: var(--tap-min); min-height: var(--tap-min); }
#views .profile-actions .btn { min-height: var(--tap-min); }
#views .shop-hero-actions .btn { min-height: var(--tap-min); }
#views .install-actions .btn--icon,
#views .follow-matches .btn--icon { width: var(--tap-min); min-width: var(--tap-min); min-height: var(--tap-min); }

/* 分段控制器（阅读档位 / 登录注册 / 主题）：按钮本身 ≥44×44（单字档位「小/大」只有 29 宽） */
#views .seg > button { height: var(--tap-min); min-width: var(--tap-min); }
#views .set-ctl .seg > button { height: var(--tap-min); padding: 0 10px; }
#views .auth-seg > button { height: var(--tap-min); min-height: var(--tap-min); }

/* 管理台：卡片头文字链 / 任务行小按钮 / 工具条导航 */
#views .ad-link { min-height: var(--tap-min); }
#views .ad-nav button { min-height: var(--tap-min); }
#views .task-actions button { min-height: var(--tap-min); }

/* 记录页搜索框 */
#views .hist-search .input { min-height: var(--tap-min); }

/* 行内文字链（协议 / 忘记密码 / 立即注册）：真实行盒 44，垂直居中不挤行距 */
#views .linkbtn {
  display: inline-flex;
  align-items: center;
  min-height: var(--tap-min);
  vertical-align: middle;
}