/*!
 * Liquid Glass —— CSS 层
 * 移植自 stormaref/LiquidGlassSkill (MIT)。折射层见 glass.js
 *
 * 四条铁律（来自该 skill，每条都是踩过坑的）：
 *   1. 玻璃必须有背景可透 —— 先做极光底，去掉所有玻璃时页面应该"不均匀"
 *   2. 玻璃本身无色 —— 色相只从背后透进来，染在 tint 上就会发浑
 *   3. 玻璃面板的子元素不再画自己的面 —— 否则盖住折射，效果全没
 *   4. 折射是渐进增强，且无法特性检测 —— Safari 会解析 url() 但什么都不画
 */

/* ── 主题无关 token ───────────────────────────────── */
:root {
  --glass-radius: 14px;
  --glass-radius-lg: 20px;
  --glass-radius-full: 9999px;
  --glass-duration: 200ms;
  --glass-ease: cubic-bezier(.16, 1, .3, 1);
  --brand: #ff6a00;
  --brand-ink: #d95400;
}

/* ── 浅色（默认）───────────────────────────────────── */
:root, html[data-theme='light'] {
  color-scheme: light;

  /* tint：白 → 70%灰，6% 透明。刻意无色 */
  --glass-tint-top: rgba(255, 255, 255, .06);
  --glass-tint-bottom: rgba(179, 179, 179, .06);
  --glass-tint-top-hover: rgba(255, 255, 255, .13);
  --glass-tint-bottom-hover: rgba(179, 179, 179, .11);

  /* rim：三道内阴影 = 抛光边缘 */
  --glass-rim-top: rgba(255, 255, 255, .62);
  --glass-rim-hairline: rgba(255, 255, 255, .14);
  --glass-rim-bottom: rgba(255, 255, 255, .07);

  --glass-border: rgba(30, 33, 45, .10);
  --glass-shadow: 0 10px 30px rgba(30, 33, 45, .09);

  --glass-menu-surface: #f7f8fa;
  --glass-menu-shadow: 0 14px 36px rgba(20, 22, 30, .13), 0 4px 10px rgba(20, 22, 30, .06);

  /* 面板洗色：数据密集界面文字必须稳住，所以玻璃上再压一层半透明白
     （对应 skill 里的 menu/modal 层思路 —— 透明度换可读性） */
  --glass-panel-frost: rgba(255, 255, 255, .66);
  --glass-panel-frost-hover: rgba(255, 255, 255, .80);
  --glass-modal-frost: rgba(255, 255, 255, .90);

  --glass-page-bg: #eef0f6;
  --ink: #16181f;
  --ink-2: #3f4553;
  --muted: #767e8e;
  --hairline: rgba(30, 33, 45, .09);
  --dy: #17181a;
  --xhs: #ff2442;

  /* 极光底：调低一档，别抢卡片 */
  --mesh-a: rgba(255, 122, 26, .085);
  --mesh-b: rgba(236, 72, 153, .065);
  --mesh-c: rgba(79, 70, 229, .070);
  --mesh-d: rgba(6, 182, 212, .055);
}

/* ── 深色 ─────────────────────────────────────────── */
html[data-theme='dark'] {
  color-scheme: dark;

  --glass-tint-top: rgba(255, 255, 255, .06);
  --glass-tint-bottom: rgba(179, 179, 179, .06);
  --glass-tint-top-hover: rgba(255, 255, 255, .13);
  --glass-tint-bottom-hover: rgba(179, 179, 179, .11);

  --glass-rim-top: rgba(255, 255, 255, .46);
  --glass-rim-hairline: rgba(255, 255, 255, .09);
  --glass-rim-bottom: rgba(255, 255, 255, .05);

  --glass-border: rgba(255, 255, 255, .09);
  --glass-shadow: 0 18px 44px rgba(0, 0, 0, .42);

  --glass-menu-surface: #17171c;
  --glass-menu-shadow: 0 18px 44px rgba(0, 0, 0, .58), 0 4px 12px rgba(0, 0, 0, .36);

  --glass-panel-frost: rgba(30, 31, 38, .70);
  --glass-panel-frost-hover: rgba(38, 39, 47, .82);
  --glass-modal-frost: rgba(26, 27, 33, .92);

  --glass-page-bg: #0d0d12;
  --ink: #f0f1f5;
  --ink-2: #b4bac6;
  --muted: #838a99;
  --hairline: rgba(255, 255, 255, .09);
  --dy: #2a2b30;
  --xhs: #ff3b57;

  --mesh-a: rgba(255, 122, 26, .13);
  --mesh-b: rgba(236, 72, 153, .10);
  --mesh-c: rgba(99, 102, 241, .12);
  --mesh-d: rgba(6, 182, 212, .09);
}

/* ── 基础 ─────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

html {
  /* 手机端等比例缩放的核心：根字号跟随视口 */
  font-size: clamp(13px, 3.85vw, 17px);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro SC", "PingFang SC",
               "HarmonyOS Sans SC", "Inter", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  font-size: .88rem;
  line-height: 1.5;
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

svg { fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
img, svg { max-width: 100%; }

/* ═══ 极光底 —— 这不是装饰，是配方的一部分 ═══
   去掉所有玻璃时，页面必须是"不均匀、有色"的。
   否则玻璃后面没东西可透，只会渲染成一个灰盒子。 */
.liquid-glass-backdrop {
  position: relative;
  isolation: isolate;
  background: var(--glass-page-bg);
  color: var(--ink);
}

.liquid-glass-backdrop::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(38rem 30rem at 18% 12%, var(--mesh-a), transparent 62%),
    radial-gradient(32rem 28rem at 78% 26%, var(--mesh-b), transparent 64%),
    radial-gradient(40rem 34rem at 62% 78%, var(--mesh-c), transparent 64%),
    radial-gradient(34rem 30rem at 12% 88%, var(--mesh-d), transparent 66%);
}

/* ── 玻璃：面板层（配 glass.js 的折射）───────────── */
.liquid-glass {
  position: relative;
  border: 1px solid var(--glass-border);
  border-radius: var(--glass-radius);
  /* 洗色层压在 tint 之上：保住玻璃质感的同时让文字稳住 */
  background:
    linear-gradient(180deg, var(--glass-panel-frost), var(--glass-panel-frost)),
    linear-gradient(180deg, var(--glass-tint-top), var(--glass-tint-bottom));
  box-shadow:
    0 1px 2px rgba(20, 22, 30, .06),
    var(--glass-shadow),
    inset 0 1px 0 var(--glass-rim-top),
    inset 0 0 0 1px var(--glass-rim-hairline),
    inset 0 -1px 0 var(--glass-rim-bottom);
  /* 非 Chromium / 未启用折射时的兜底磨砂 */
  backdrop-filter: blur(18px) saturate(170%);
  -webkit-backdrop-filter: blur(18px) saturate(170%);
}

/* 顶栏要更实一点，滚动时文字不能糊 */
.topbar.liquid-glass {
  background:
    linear-gradient(180deg, var(--glass-panel-frost-hover), var(--glass-panel-frost-hover)),
    linear-gradient(180deg, var(--glass-tint-top), var(--glass-tint-bottom));
}

.liquid-glass--hover {
  transition: transform var(--glass-duration) var(--glass-ease),
              box-shadow var(--glass-duration) var(--glass-ease),
              background var(--glass-duration) var(--glass-ease),
              border-color var(--glass-duration) var(--glass-ease);
}
@media (hover: hover) {
  .liquid-glass--hover:hover {
    background:
      linear-gradient(180deg, var(--glass-panel-frost-hover), var(--glass-panel-frost-hover)),
      linear-gradient(180deg, var(--glass-tint-top), var(--glass-tint-bottom));
    border-color: rgba(255, 122, 26, .30);
    transform: translateY(-2px);
    box-shadow:
      0 2px 5px rgba(20, 22, 30, .07),
      0 18px 40px rgba(20, 22, 30, .16),
      inset 0 1px 0 var(--glass-rim-top),
      inset 0 0 0 1px var(--glass-rim-hairline),
      inset 0 -1px 0 var(--glass-rim-bottom);
  }
}

/* ── 玻璃：小片层（无折射）────────────────────────
   折射按元素尺寸烘焙画布，芯片这类"成打成打出现又很小"的东西不值当 */
.liquid-glass-chip {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .22rem .6rem;
  border: 1px solid var(--glass-border);
  border-radius: var(--glass-radius-full);
  background: linear-gradient(180deg, var(--glass-tint-top), var(--glass-tint-bottom));
  box-shadow: inset 0 1px 0 var(--glass-rim-top);
  backdrop-filter: blur(6px) saturate(125%);
  -webkit-backdrop-filter: blur(6px) saturate(125%);
}

/* ── 玻璃：菜单层（重模糊 + 洗色，保证文字可读）──── */
.liquid-glass-menu {
  background: rgba(247, 248, 250, .68);
  border: 1px solid var(--glass-border);
  border-radius: var(--glass-radius);
  box-shadow: var(--glass-menu-shadow), inset 0 1px 0 var(--glass-rim-top);
  backdrop-filter: blur(22px) saturate(150%);
  -webkit-backdrop-filter: blur(22px) saturate(150%);
}
html[data-theme='dark'] .liquid-glass-menu { background: rgba(23, 23, 28, .72); }

/* ═══ 顶栏 ═══ */
.topbar {
  position: sticky; top: 0; z-index: 30;
  border-radius: 0; border-left: none; border-right: none; border-top: none;
  padding-top: env(safe-area-inset-top);
}

.topbar-inner {
  max-width: 88rem; margin: 0 auto;
  padding: .62rem 1rem;
  display: flex; flex-wrap: wrap; align-items: center; gap: .55rem .9rem;
}

.brand { display: flex; align-items: center; gap: .5rem; margin-right: auto; }
.brand-mark {
  width: 1.6rem; height: 1.6rem; border-radius: .48rem; flex: 0 0 auto;
  background: linear-gradient(145deg, #ff8a2b, var(--brand) 55%, #e04f00);
  box-shadow: 0 4px 12px rgba(255, 106, 0, .38), inset 0 1px 0 rgba(255, 255, 255, .5);
  display: grid; place-items: center;
}
.brand-mark svg { width: .95rem; height: .95rem; color: #fff; stroke-width: 2.1; }
.brand-text { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }
.brand h1 { font-size: 1.02rem; font-weight: 700; margin: 0; letter-spacing: -.015em; white-space: nowrap; }
.brand-slogan {
  margin: 0; font-size: .7rem; line-height: 1.25; color: var(--muted);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/* 副标题用品牌色点一下重点，避免整行灰扑扑 */
.brand-slogan strong { color: var(--brand-ink); font-weight: 650; }
html[data-theme='dark'] .brand-slogan strong { color: #ff9b52; }
.brand-count { font-size: .76rem; color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }

/* 窄屏：副标题不换行会被挤没，改成隐藏；超窄屏连计数一起隐藏 */
@media (max-width: 46rem) { .brand-slogan { display: none; } }

.search { position: relative; display: flex; align-items: center; }
.search svg { position: absolute; left: .6rem; width: .95rem; height: .95rem; color: var(--muted); }
.search input {
  width: 15rem; max-width: 46vw;
  padding: .46rem .8rem .46rem 1.95rem;
  border: 1px solid var(--glass-border); border-radius: var(--glass-radius-full);
  background: linear-gradient(180deg, var(--glass-tint-top), var(--glass-tint-bottom));
  box-shadow: inset 0 1px 0 var(--glass-rim-top);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  color: var(--ink); font: inherit; font-size: .82rem; outline: none;
  transition: border-color .16s, box-shadow .16s;
}
.search input::placeholder { color: var(--muted); }
.search input:focus { border-color: rgba(255, 122, 26, .5); box-shadow: 0 0 0 3px rgba(255, 122, 26, .16); }
.search input::-webkit-search-cancel-button { -webkit-appearance: none; }

/* ═══ 达人分类 Tab ═══ */
.cats {
  max-width: 88rem; margin: 0 auto; padding: 1rem 1rem 0;
  display: grid; gap: .6rem;
  grid-template-columns: repeat(auto-fit, minmax(min(11rem, 100%), 1fr));
}

.cat {
  text-align: left; cursor: pointer; font: inherit; color: inherit;
  padding: .72rem .85rem;
  display: flex; flex-direction: column; gap: .1rem;
  -webkit-tap-highlight-color: transparent;
}
.cat-title { font-size: .9rem; font-weight: 650; letter-spacing: -.01em; display: flex; align-items: center; gap: .34rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cat-sub { font-size: .72rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.cat-dot { width: .4rem; height: .4rem; border-radius: 50%; background: currentColor; opacity: .4; flex: 0 0 auto; }

/* 铁律 2：品牌面板只覆盖 tint，rim / border / 折射都不动 */
.cat.on {
  background: linear-gradient(155deg, rgba(255, 138, 43, .93), rgba(224, 79, 0, .87));
  border-color: rgba(255, 122, 26, .55);
  color: #fff;
  box-shadow:
    0 12px 30px rgba(224, 79, 0, .32),
    inset 0 1px 0 rgba(255, 255, 255, .42),
    inset 0 0 0 1px rgba(255, 255, 255, .14),
    inset 0 -1px 0 rgba(255, 255, 255, .08);
}
.cat.on .cat-sub { color: rgba(255, 255, 255, .84); }
.cat.on .cat-dot { opacity: 1; }

/* ═══ 高级筛选 ═══ */
.filters { max-width: 88rem; margin: .6rem auto 0; padding: 0 1rem; }
.filters-panel { padding: .8rem .9rem .9rem; }

.filters-head {
  display: flex; align-items: center; gap: .5rem; width: 100%;
  background: none; border: none; padding: 0; cursor: pointer;
  font: inherit; color: var(--ink);
}
.filters-head .fl-title { font-size: .84rem; font-weight: 650; display: flex; align-items: center; gap: .35rem; }
.filters-head svg { width: 1rem; height: 1rem; }
.filters-head .chev { margin-left: auto; transition: transform .22s var(--glass-ease); color: var(--muted); }
.filters.open .chev { transform: rotate(180deg); }

.filters-body { display: none; margin-top: .75rem; }
.filters.open .filters-body { display: block; }

.frow { display: flex; align-items: flex-start; gap: .7rem; padding: .42rem 0; }
.frow[hidden] { display: none; }
.frow + .frow { border-top: 1px solid var(--hairline); }
.flabel { flex: 0 0 auto; min-width: 4.6rem; font-size: .78rem; color: var(--muted);
           padding-top: .28rem; white-space: nowrap; }

.opts {
  display: flex; flex-wrap: wrap; gap: .3rem;
  flex: 1 1 auto; min-width: 0;
}
.opts > * { flex: 0 0 auto; }        /* 不许被压缩 */

/* 单行折叠时右侧的「更多 +N」 */
/* 尺寸与 .opt 完全一致，否则和 chip 对不齐 */
.frow-expand {
  flex: 0 0 auto; margin: 0;
  font: inherit; font-size: .78rem; line-height: 1;
  cursor: pointer;
  padding: .4rem .68rem; border-radius: var(--glass-radius-full);
  border: 1px dashed var(--glass-border); color: var(--brand-ink);
  background: rgba(255, 122, 26, .07); white-space: nowrap;
  transition: all .16s var(--glass-ease);
}
.frow-expand:hover { background: rgba(255, 122, 26, .14); border-style: solid; }
.frow-expand[hidden] { display: none; }
.frow.open .frow-expand { border-style: solid; }

.opt {
  font: inherit; font-size: .78rem; line-height: 1; cursor: pointer;
  padding: .4rem .68rem; border-radius: var(--glass-radius-full);
  border: 1px solid var(--glass-border);
  background: linear-gradient(180deg, var(--glass-tint-top), var(--glass-tint-bottom));
  box-shadow: inset 0 1px 0 var(--glass-rim-top);
  backdrop-filter: blur(6px) saturate(125%);
  -webkit-backdrop-filter: blur(6px) saturate(125%);
  color: var(--ink-2); white-space: nowrap;
  transition: all .16s var(--glass-ease);
  -webkit-tap-highlight-color: transparent;
}
.opt:hover { color: var(--ink); transform: translateY(-1px); }
.opt.on {
  background: linear-gradient(155deg, rgba(255, 138, 43, .95), rgba(224, 79, 0, .9));
  border-color: rgba(255, 122, 26, .5);
  color: #fff;
  box-shadow: 0 6px 16px rgba(224, 79, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .4);
}
.opt-n { opacity: .5; font-size: .92em; margin-left: .15rem; font-variant-numeric: tabular-nums; }

.fselect {
  font: inherit; font-size: .79rem; padding: .4rem 1.75rem .4rem .72rem;
  border-radius: var(--glass-radius-full);
  border: 1px solid var(--glass-border); color: var(--ink-2);
  background-color: transparent;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237b8291' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right .5rem center; background-size: .85rem;
  appearance: none; cursor: pointer;
}
.fselect option { background: var(--glass-menu-surface); color: var(--ink); }

.filters-foot {
  display: flex; align-items: center; gap: .6rem; margin-top: .7rem;
  padding-top: .7rem; border-top: 1px solid var(--hairline);
}
.fcount { font-size: .78rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.btn-reset {
  margin-left: auto; font: inherit; font-size: .78rem; cursor: pointer;
  padding: .42rem .95rem; border-radius: var(--glass-radius-full);
  border: 1px solid var(--glass-border); color: var(--ink-2);
  background: linear-gradient(180deg, var(--glass-tint-top), var(--glass-tint-bottom));
  box-shadow: inset 0 1px 0 var(--glass-rim-top);
}
.btn-reset:hover { color: var(--brand-ink); border-color: rgba(255, 122, 26, .4); }

/* ═══ 主体 ═══ */
main { max-width: 88rem; margin: 0 auto; padding: 1rem 1rem 3rem; }
@media (min-width: 40rem) { main { padding: 1.2rem 1.2rem 4rem; } }

.grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(19rem, 100%), 1fr));
  gap: 1rem;
}
@media (min-width: 40rem) { .grid { gap: 1.15rem; } }

/* ═══ 卡片 ═══ */
.card {
  padding: 1.15rem 1.2rem 1rem;
  display: flex; flex-direction: column;
  overflow: hidden;              /* 让子元素不撑破圆角 */
}

.card-head { display: flex; gap: .78rem; align-items: flex-start; }

.avatar {
  position: relative; flex: 0 0 auto;
  width: 4.2rem; height: 4.2rem; border-radius: 50%;
  background: rgba(140, 146, 160, .16);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .5), 0 2px 8px rgba(30, 33, 45, .10);
  overflow: hidden;
}
.avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.avatar .avatar-fallback {
  position: absolute; inset: 0; margin: auto; width: 55%; height: 55%;
  color: rgba(140, 146, 160, .55); stroke-width: 1.5;
}
.avatar img.ok + .avatar-fallback { display: none; }
.avatar img.bad { display: none; }

.ident { min-width: 0; flex: 1 1 auto; }
.name {
  display: block; font-size: 1.1rem; font-weight: 700; letter-spacing: -.02em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* 徽章是不透明"内容"，不是玻璃子面板（铁律 3 针对的是面板/分区） */
.badges { display: flex; flex-wrap: wrap; gap: .26rem; margin-top: .34rem; }
.badge {
  font-size: .67rem; line-height: 1; padding: .27rem .5rem;
  border-radius: .32rem; font-weight: 600; white-space: nowrap;
}
/* 平台徽章：用平台自己的品牌色 */
.badge.platform {
  background: linear-gradient(135deg, #4c6fff, #7b5cff);   /* 抖音：蓝紫 */
  color: #fff; box-shadow: 0 2px 6px rgba(76, 111, 255, .30);
}
.badge.platform.xhs {
  background: linear-gradient(135deg, #ff4d6a, #ff2442);   /* 小红书：红 */
  color: #fff; box-shadow: 0 2px 6px rgba(255, 36, 66, .28);
}
/* 独家：签约状态，用翠绿区分于橙色的高折扣 */
.badge.exclusive {
  background: linear-gradient(135deg, #10b981, #059669);
  color: #fff; box-shadow: 0 2px 6px rgba(5, 150, 105, .28);
}
.badge.discount {
  background: linear-gradient(155deg, #ff8a2b, var(--brand));
  color: #fff; box-shadow: 0 2px 6px rgba(224, 79, 0, .28);
}
.badge.type { background: rgba(140, 146, 160, .16); color: var(--ink-2); font-weight: 500; }

.region { display: flex; align-items: center; gap: .22rem; margin-top: .4rem; color: var(--muted); font-size: .77rem; }
.region svg { width: .82rem; height: .82rem; flex: 0 0 auto; }

.stats {
  display: flex; align-items: center; gap: 1.15rem;
  margin-top: .85rem; padding: .62rem 0;
  border-top: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline);
}
.stat { display: flex; align-items: baseline; gap: .3rem; }
.stat b { font-size: 1.12rem; font-weight: 700; letter-spacing: -.025em; font-variant-numeric: tabular-nums; }
.stat span { font-size: .75rem; color: var(--muted); }
.stat + .stat { position: relative; }
.stat + .stat::before {
  content: ""; position: absolute; left: -.58rem; top: .12rem; bottom: .12rem;
  width: 1px; background: var(--hairline);
}
.stat .female-val { color: var(--brand-ink); }
html[data-theme='dark'] .stat .female-val { color: #ff9b52; }

.audience { margin-top: .6rem; font-size: .77rem; color: var(--muted); line-height: 1.45; }

.prices { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .3rem; margin-top: .75rem; }
.price { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }
.plabel { font-size: .71rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.plabel .ps { display: none; }          /* 短标签默认隐藏，密集档才用 */
.price b { font-size: 1.01rem; font-weight: 700; letter-spacing: -.025em; font-variant-numeric: tabular-nums; }

/* 私单报价是自由文本字段，有人会写整段说明把卡片撑爆 —— 统一截断 */
.private b {
  font-size: 1.01rem; font-weight: 700; letter-spacing: -.02em;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
  overflow: hidden; overflow-wrap: anywhere;
}
.audience span {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
@media (hover: hover) { .private b:hover, .audience span:hover { -webkit-line-clamp: 20; } }

.private { margin-top: .6rem; margin-bottom: .85rem; display: flex; flex-direction: column; gap: .1rem; }
.private b { font-size: 1.01rem; font-weight: 700; letter-spacing: -.02em; }

.card-foot {
  display: flex; align-items: center; justify-content: space-between; gap: .6rem;
  margin-top: auto; padding-top: .7rem; border-top: 1px solid var(--hairline);
}
.tags { display: flex; flex-wrap: wrap; gap: .26rem; min-width: 0; }
.tag { font-size: .69rem; padding: .24rem .48rem; border-radius: .3rem;
       background: rgba(140, 146, 160, .16); color: var(--ink-2); }

.home-link {
  display: inline-flex; align-items: center; gap: .26rem; flex: 0 0 auto;
  font-size: .79rem; font-weight: 650; color: var(--brand-ink);
  text-decoration: none; white-space: nowrap;
  padding: .3rem .58rem; border-radius: .45rem;
  transition: background .16s;
}
html[data-theme='dark'] .home-link { color: #ff9b52; }
.home-link svg { width: .92rem; height: .92rem; }
.home-link:hover { background: rgba(255, 122, 26, .13); }
.home-link[hidden] { display: none; }

/* ═══ 骨架 / 空态 ═══ */
.skeleton-wrap { display: contents; }
.sk {
  border-radius: var(--glass-radius); min-height: 15rem;
  position: relative; overflow: hidden;
  background: linear-gradient(180deg, var(--glass-tint-top), var(--glass-tint-bottom));
  border: 1px solid var(--glass-border);
  box-shadow: var(--glass-shadow), inset 0 1px 0 var(--glass-rim-top);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.sk::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .5), transparent);
  transform: translateX(-100%); animation: shimmer 1.4s infinite;
}
html[data-theme='dark'] .sk::after {
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .07), transparent);
}
@keyframes shimmer { to { transform: translateX(100%); } }

.empty { text-align: center; padding: 4rem 1rem; color: var(--muted); }
.empty p { margin: 0 0 .9rem; }

.btn-ghost {
  font: inherit; font-size: .84rem; padding: .5rem 1.1rem; cursor: pointer;
  border-radius: var(--glass-radius-full); border: 1px solid var(--glass-border);
  color: var(--ink-2);
  background: linear-gradient(180deg, var(--glass-tint-top), var(--glass-tint-bottom));
  box-shadow: inset 0 1px 0 var(--glass-rim-top);
}
.btn-ghost:hover { color: var(--brand-ink); border-color: rgba(255, 122, 26, .4); }

.more { display: flex; justify-content: center; margin-top: 1.4rem; }
.more[hidden] { display: none; }

.foot {
  max-width: 88rem; margin: 0 auto;
  padding: 1rem 1rem calc(1.6rem + env(safe-area-inset-bottom));
  display: flex; justify-content: space-between; gap: 1rem;
  color: var(--muted); font-size: .75rem;
}

/* 主题切换 */
.theme-btn {
  width: 2rem; height: 2rem; flex: 0 0 auto; display: grid; place-items: center;
  border-radius: 50%; cursor: pointer; color: var(--ink-2);
  border: 1px solid var(--glass-border);
  background: linear-gradient(180deg, var(--glass-tint-top), var(--glass-tint-bottom));
  box-shadow: inset 0 1px 0 var(--glass-rim-top);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.theme-btn svg { width: 1rem; height: 1rem; }
.theme-btn .ic-moon { display: none; }
html[data-theme='dark'] .theme-btn .ic-sun { display: none; }
html[data-theme='dark'] .theme-btn .ic-moon { display: block; }

/* ═══ 移动端 ═══ */
@media (max-width: 30rem) {
  .topbar-inner { padding: .6rem .75rem; gap: .45rem; }
  .brand-count { display: none; }
  .search { flex: 1 1 auto; }
  .search input { width: 100%; max-width: none; }
  .cats { padding: .8rem .75rem 0; grid-template-columns: 1fr 1fr; gap: .45rem; }
  .cat { padding: .6rem .7rem; }
  .cat-title { font-size: .84rem; }
  .filters { padding: 0 .75rem; }
  .flabel { flex: 0 0 3.4rem; }
  main { padding: .85rem .75rem 3rem; }
  .grid { gap: .7rem; }
  .card { padding: .9rem .85rem .8rem; }
  .avatar { width: 3.5rem; height: 3.5rem; }
  .name { font-size: 1.04rem; }
  .price b { font-size: .95rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .liquid-glass--hover:hover { transform: none; }
}

/* 不支持毛玻璃的引擎：改成接近不透明的面板，保证可读性 */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .liquid-glass, .sk { background: rgba(255, 255, 255, .94); }
  html[data-theme='dark'] .liquid-glass,
  html[data-theme='dark'] .sk { background: rgba(22, 22, 27, .94); }
}

/* ═══════════════════════════════════════════════════════
   密度档位：舒适 / 紧凑 / 密集
   目标 —— 1440×900 一屏能看到多少张卡，就靠这三个档
   ═══════════════════════════════════════════════════════ */

/* ── 紧凑 ── */
html[data-density='compact'] .cats { padding-top: .7rem; }
html[data-density='compact'] .cat { padding: .5rem .65rem; }
html[data-density='compact'] .cat-title { font-size: .85rem; }
html[data-density='compact'] .cat-sub { font-size: .68rem; }
html[data-density='compact'] main { padding-top: .8rem; }
html[data-density='compact'] .grid {
  grid-template-columns: repeat(auto-fill, minmax(min(15.5rem, 100%), 1fr));
  gap: .85rem;
}
html[data-density='compact'] .card { padding: .9rem .95rem .8rem; }
html[data-density='compact'] .card-head { gap: .7rem; }
html[data-density='compact'] .card .avatar { width: 3.2rem; height: 3.2rem; }
html[data-density='compact'] .card .name { font-size: 1rem; }
html[data-density='compact'] .card .badge { font-size: .62rem; padding: .22rem .42rem; }
html[data-density='compact'] .card .region { margin-top: .28rem; font-size: .72rem; }
html[data-density='compact'] .card .region svg { width: .74rem; height: .74rem; }

/* 关键：把「粉丝/女粉」和「受众画像」并成一行 */
html[data-density='compact'] .metrics {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: .12rem .75rem;
  margin-top: .7rem; padding: .55rem 0;
  border-top: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline);
}
html[data-density='compact'] .stats {
  margin: 0; padding: 0; border: none; gap: .85rem;
}
html[data-density='compact'] .stat b { font-size: .96rem; }
html[data-density='compact'] .stat span { font-size: .7rem; }
html[data-density='compact'] .stat + .stat::before { display: none; }
html[data-density='compact'] .audience { margin: 0; font-size: .7rem; }
html[data-density='compact'] .private b { -webkit-line-clamp: 2; }
html[data-density='compact'] .audience span { -webkit-line-clamp: 1; }

html[data-density='compact'] .prices { margin-top: .68rem; gap: .24rem; }
html[data-density='compact'] .plabel { font-size: .66rem; }
html[data-density='compact'] .price b { font-size: .92rem; }
html[data-density='compact'] .private { margin-top: .55rem; margin-bottom: .62rem; }
html[data-density='compact'] .private b { font-size: .92rem; }
html[data-density='compact'] .card-foot { padding-top: .62rem; }
html[data-density='compact'] .card .attrs { margin-top: .34rem; gap: .24rem; }
html[data-density='compact'] .card .tag { font-size: .64rem; padding: .2rem .4rem; }
html[data-density='compact'] .card .home-link { font-size: .75rem; padding: .24rem .5rem; }

/* ── 密集 ── */
html[data-density='dense'] .cats { padding-top: .55rem; }
html[data-density='dense'] .cat { padding: .42rem .6rem; }
html[data-density='dense'] .cat-title { font-size: .8rem; }
html[data-density='dense'] .cat-sub { display: none; }
html[data-density='dense'] .filters-head .fl-title { font-size: .78rem; }
html[data-density='dense'] main { padding-top: .6rem; }
html[data-density='dense'] .grid {
  grid-template-columns: repeat(auto-fill, minmax(min(13.5rem, 100%), 1fr));
  gap: .72rem;
}
html[data-density='dense'] .card { padding: .72rem .76rem .62rem; }
html[data-density='dense'] .card-head { gap: .55rem; }
html[data-density='dense'] .card .avatar { width: 2.6rem; height: 2.6rem; }
html[data-density='dense'] .card .name { font-size: .88rem; }
html[data-density='dense'] .card .badges { margin-top: .2rem; gap: .18rem; flex-wrap: nowrap; overflow: hidden; }
html[data-density='dense'] .card .badge { font-size: .56rem; padding: .16rem .34rem; border-radius: .24rem; }
html[data-density='dense'] .card .badge.type:nth-of-type(n+4) { display: none; }
html[data-density='dense'] .card .region { margin-top: .16rem; font-size: .66rem; }
html[data-density='dense'] .card .region svg { width: .66rem; height: .66rem; }

/* 指标行强制一行：粉丝/女粉 + 画像，画像超长就省略 */
html[data-density='dense'] .metrics {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: .16rem .6rem;
  margin-top: .55rem; padding: .45rem 0;
  border-top: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline);
}
html[data-density='dense'] .stats { margin: 0; padding: 0; border: none; gap: .65rem; flex: 0 0 auto; }
html[data-density='dense'] .stat b { font-size: .86rem; }
html[data-density='dense'] .stat span { font-size: .64rem; }
html[data-density='dense'] .stat + .stat::before { display: none; }
html[data-density='dense'] .audience { margin: 0; font-size: .64rem; flex: 1 1 100%; min-width: 0; }
html[data-density='dense'] .audience span {
  display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  -webkit-line-clamp: unset;
}

/* 报价强制一行内联；用短标签才放得下三个 */
html[data-density='dense'] .prices {
  display: flex; flex-wrap: wrap; gap: .24rem .65rem; margin-top: .55rem;
}
html[data-density='dense'] .price {
  flex: 0 0 auto; flex-direction: row; align-items: baseline; gap: .2rem;
}
html[data-density='dense'] .price b { font-size: .84rem; white-space: nowrap; }
html[data-density='dense'] .plabel { font-size: .62rem; }
html[data-density='dense'] .plabel .pl { display: none; }
html[data-density='dense'] .plabel .ps { display: inline; }

html[data-density='dense'] .private {
  flex-direction: row; align-items: baseline; gap: .3rem;
  margin-top: .45rem; margin-bottom: .55rem;
}
/* 标签不许被压缩，值去承担截断 */
html[data-density='dense'] .private .plabel { flex: 0 0 auto; }
html[data-density='dense'] .private b { flex: 1 1 auto; min-width: 0; }
html[data-density='dense'] .cloth .plabel { flex: 0 0 auto; }
html[data-density='dense'] .cloth b { flex: 1 1 auto; min-width: 0; }
html[data-density='dense'] .private b { font-size: .84rem; -webkit-line-clamp: 1; }

/* 密集档换用短标签，一行塞得下三个报价 */
html[data-density='dense'] .plabel .pl { display: none; }
html[data-density='dense'] .plabel .ps { display: inline; }
html[data-density='dense'] .card-foot { padding-top: .5rem; }
html[data-density='dense'] .card .attrs { margin-top: .28rem; gap: .2rem; }
html[data-density='dense'] .card .attr { font-size: .62rem; padding: .19rem .36rem .19rem .28rem; }
html[data-density='dense'] .card .attr svg { width: .62rem; height: .62rem; }
html[data-density='dense'] .card .home-link { font-size: .7rem; padding: .18rem .4rem; margin-left: auto; }
html[data-density='dense'] .card .tags { gap: .18rem; }
html[data-density='dense'] .card .tag { font-size: .6rem; padding: .16rem .34rem; }
html[data-density='dense'] .foot { padding-top: .7rem; font-size: .7rem; }

/* 密集档把顶部也收一收，把纵向空间让给卡片 */
html[data-density='dense'] .topbar-inner { padding: .45rem 1rem; }
html[data-density='dense'] .cats { padding-top: .5rem; gap: .4rem; }
html[data-density='dense'] .cat { padding: .38rem .55rem; }
html[data-density='dense'] .filters { margin-top: .4rem; }
html[data-density='dense'] .filters-panel { padding: .5rem .7rem; }

/* 服装置品报价：与私单报价同款 */
.cloth { margin-top: .45rem; display: flex; flex-direction: column; gap: .1rem; }
.cloth[hidden] { display: none; }
.cloth b {
  font-size: 1.01rem; font-weight: 700; letter-spacing: -.02em;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; overflow-wrap: anywhere;
}
html[data-density='compact'] .cloth { margin-top: .35rem; }
html[data-density='compact'] .cloth b { font-size: .92rem; -webkit-line-clamp: 1; }
html[data-density='dense'] .cloth { flex-direction: row; align-items: baseline; gap: .25rem; margin-top: .24rem; }
html[data-density='dense'] .cloth b { font-size: .84rem; -webkit-line-clamp: 1; }

/* 报价项数量随平台变（抖音 3 项 / 小红书 2 项），列数由 JS 设 inline style */
.prices .price b { overflow: hidden; text-overflow: ellipsis; }

/* 卡片可点击 */
.card { cursor: pointer; }
.card:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }

/* ═══════════════════════════════════════════════════════
   详情弹层
   ═══════════════════════════════════════════════════════ */
.detail-scrim {
  position: fixed; inset: 0; z-index: 60;
  display: flex; align-items: center; justify-content: center;
  padding: 1.2rem;
  background: rgba(18, 20, 28, .48);
  backdrop-filter: blur(6px) saturate(120%);
  -webkit-backdrop-filter: blur(6px) saturate(120%);
  animation: fadeIn .18s ease-out;
}
.detail-scrim[hidden] { display: none; }
@keyframes fadeIn { from { opacity: 0; } }

.detail {
  position: relative;
  width: min(34rem, 100%);
  max-height: min(46rem, 88vh);
  overflow: auto;
  overscroll-behavior: contain;
  border-radius: var(--glass-radius-lg);
  padding: 1.15rem 1.2rem 1.3rem;
  /* modal 层：弹层浮在任意内容之上，正文必须不依赖背后的东西可读，
     所以用高不透明度的霜层盖住 tint —— 透明度换可读性 */
  background:
    linear-gradient(180deg, var(--glass-modal-frost), var(--glass-modal-frost)),
    linear-gradient(180deg, var(--glass-tint-top), var(--glass-tint-bottom));
  box-shadow:
    0 24px 70px rgba(16, 18, 26, .34),
    inset 0 1px 0 var(--glass-rim-top),
    inset 0 0 0 1px var(--glass-rim-hairline),
    inset 0 -1px 0 var(--glass-rim-bottom);
  animation: popIn .22s var(--glass-ease);
}
@keyframes popIn { from { opacity: 0; transform: translateY(8px) scale(.985); } }

.detail-close {
  position: absolute; top: .7rem; right: .7rem;
  width: 2rem; height: 2rem; display: grid; place-items: center;
  border-radius: 50%; cursor: pointer; color: var(--ink-2);
  border: 1px solid var(--glass-border);
  background: linear-gradient(180deg, var(--glass-tint-top), var(--glass-tint-bottom));
  box-shadow: inset 0 1px 0 var(--glass-rim-top);
}
.detail-close svg { width: .95rem; height: .95rem; }
.detail-close:hover { color: var(--ink); }

.d-loading { padding: 3rem 0; text-align: center; color: var(--muted); font-size: .85rem; }

.d-head { display: flex; gap: .85rem; align-items: flex-start; padding-right: 2rem; }
.d-avatar { width: 3.6rem; height: 3.6rem; }
.d-ident { min-width: 0; }
.d-ident h2 { margin: 0 0 .34rem; font-size: 1.22rem; font-weight: 700; letter-spacing: -.025em; }
.d-ident .badges { margin-top: 0; }

.d-stats {
  display: grid; grid-template-columns: 1fr 1fr; gap: .45rem .9rem;
  margin-top: .95rem; padding: .75rem 0;
  border-top: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline);
}
.d-stats > div { display: flex; align-items: baseline; gap: .35rem; font-size: .8rem; color: var(--muted); }
.d-stats b { font-size: 1.15rem; font-weight: 700; color: var(--ink); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.d-stats .d-wide { grid-column: 1 / -1; color: var(--muted); font-size: .78rem; }

.d-section { margin-top: 1rem; }
.d-section h3 { margin: 0 0 .5rem; font-size: .78rem; font-weight: 650; color: var(--muted); letter-spacing: .01em; }

.d-prices { display: grid; grid-template-columns: repeat(auto-fit, minmax(7rem, 1fr)); gap: .5rem; }
.d-price {
  padding: .5rem .62rem; border-radius: .6rem;
  background: rgba(140, 146, 160, .11);
  display: flex; flex-direction: column; gap: .08rem;
}
.d-price span { font-size: .7rem; color: var(--muted); }
.d-price b { font-size: 1rem; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
/* 私单/服装是长文本，用通栏框 */
.d-prices--wide { grid-template-columns: 1fr; }
.d-price-long { font-size: .86rem; font-weight: 600; line-height: 1.55; letter-spacing: 0;
                white-space: pre-wrap; overflow-wrap: anywhere; }

.d-row { display: flex; gap: .8rem; padding: .38rem 0; font-size: .82rem; align-items: baseline; }
.d-row + .d-row { border-top: 1px solid var(--hairline); }
.d-label { flex: 0 0 5rem; color: var(--muted); font-size: .78rem; }
.d-value { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }

.d-bio { margin: 0; font-size: .84rem; line-height: 1.6; white-space: pre-wrap;
         padding: .6rem .7rem; border-radius: .6rem; background: rgba(140, 146, 160, .11); }
.d-section .tags { margin-top: 0; }

.d-link {
  display: inline-flex; align-items: center; margin-top: 1.1rem;
  font-size: .84rem; font-weight: 650; color: var(--brand-ink); text-decoration: none;
  padding: .5rem .95rem; border-radius: var(--glass-radius-full);
  border: 1px solid rgba(255, 122, 26, .35); background: rgba(255, 122, 26, .1);
}
html[data-theme='dark'] .d-link { color: #ff9b52; }
.d-link:hover { background: rgba(255, 122, 26, .18); }

@media (max-width: 30rem) {
  .detail-scrim { padding: .7rem; align-items: flex-end; }
  .detail { width: 100%; max-height: 88vh; padding: 1rem 1rem 1.4rem; border-radius: var(--glass-radius-lg); }
  .d-label { flex: 0 0 4.2rem; }
}

/* ═══════════════════════════════════════════════════════
   极简档：一行一个 + 列对齐
   用 display:contents 把卡片内部拍平成网格列，
   所有行的「头像/昵称/徽章/粉丝/女粉/报价/链接」都在同一竖线上
   ═══════════════════════════════════════════════════════ */
html[data-density='minimal'] .cats { padding-top: .5rem; gap: .4rem; }
html[data-density='minimal'] .cat { padding: .36rem .55rem; }
html[data-density='minimal'] .cat-title { font-size: .78rem; }
html[data-density='minimal'] .cat-sub { display: none; }
html[data-density='minimal'] .topbar-inner { padding: .45rem 1rem; }
html[data-density='minimal'] .filters { margin-top: .4rem; }
html[data-density='minimal'] .filters-panel { padding: .45rem .7rem; }
html[data-density='minimal'] main { padding-top: .55rem; }

html[data-density='minimal'] .grid {
  grid-template-columns: 1fr;      /* 一行一个 */
  gap: .42rem;
}

html[data-density='minimal'] .card {
  display: grid;
  grid-template-columns:
    2.1rem                     /* 头像  */
    minmax(0, 11rem)           /* 昵称  */
    8.5rem                     /* 徽章  */
    5.6rem                     /* 粉丝  */
    4.6rem                     /* 女粉  */
    minmax(0, 1fr)             /* 报价  */
    auto;                      /* 链接  */
  align-items: center;
  gap: .5rem 1rem;
  padding: .58rem .9rem;
  border-radius: 10px;
}
/* 拍平：让头部的头像/昵称/徽章各自成为一列 */
html[data-density='minimal'] .card-head,
html[data-density='minimal'] .ident { display: contents; }

html[data-density='minimal'] .card .avatar { width: 2.4rem; height: 2.4rem; }

html[data-density='minimal'] .card .name {
  font-size: .85rem; min-width: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
html[data-density='minimal'] .card .badges {
  margin: 0; gap: .2rem; flex-wrap: nowrap; overflow: hidden;
}
html[data-density='minimal'] .card .badge { font-size: .54rem; padding: .13rem .34rem; border-radius: .22rem; }
html[data-density='minimal'] .card .badge.type { display: none; }
html[data-density='minimal'] .card .region { display: none; }

/* 粉丝 / 女粉 各自一列 */
html[data-density='minimal'] .metrics,
html[data-density='minimal'] .stats { display: contents; }
html[data-density='minimal'] .stat { min-width: 0; gap: .24rem; }
html[data-density='minimal'] .stat b { font-size: .84rem; white-space: nowrap; }
html[data-density='minimal'] .stat span { font-size: .62rem; color: var(--muted); }
html[data-density='minimal'] .audience { display: none; }

/* 报价固定三列，跨行对齐 */
html[data-density='minimal'] .prices {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .2rem .7rem; margin: 0;
}
html[data-density='minimal'] .price {
  flex-direction: row; align-items: baseline; gap: .22rem; min-width: 0;
}
html[data-density='minimal'] .plabel { font-size: .62rem; }
html[data-density='minimal'] .price b { font-size: .83rem; white-space: nowrap; }

html[data-density='minimal'] .private,
html[data-density='minimal'] .cloth { display: none; }

html[data-density='minimal'] .card-foot {
  margin: 0; padding: 0; border: none; gap: .3rem; justify-self: end;
}
html[data-density='minimal'] .card .tags { display: none; }
html[data-density='minimal'] .card .home-link { font-size: .68rem; padding: .18rem .4rem; }
html[data-density='minimal'] .card .home-link span { display: none; }   /* 只留图标 */

/* 表头行：跟着列对齐 */
html[data-density='minimal'] .listhead {
  display: grid;
  grid-template-columns:
    2.1rem minmax(0, 11rem) 8.5rem 5.6rem 4.6rem minmax(0, 1fr) auto;
  gap: .5rem; padding: 0 .7rem .3rem;
  font-size: .68rem; color: var(--muted);
}
html[data-density='minimal'] .listhead span:nth-child(1) { grid-column: 2; }

/* 窄屏：极简档退回两列信息，避免挤成一团 */
@media (max-width: 46rem) {
  html[data-density='minimal'] .card {
    grid-template-columns: 2.1rem minmax(0, 1fr) 5.6rem auto;
  }
  html[data-density='minimal'] .badges,
  html[data-density='minimal'] .stat:nth-child(2) { display: none; }
  html[data-density='minimal'] .prices { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html[data-density='minimal'] .listhead { display: none; }
}
}

/* 密度按钮带文字标签，一眼看出当前是哪档 */
.theme-btn--wide {
  width: auto; height: 2rem; padding: 0 .6rem 0 .5rem; gap: .3rem;
  border-radius: var(--glass-radius-full);
  display: inline-flex; align-items: center;
}
.theme-btn--wide span { font-size: .74rem; font-weight: 600; white-space: nowrap; }

/* 无限滚动哨兵：不可见，只用来触发加载 */
#scrollSentinel { height: 1px; width: 100%; }
#scrollSentinel[hidden] { display: none; }

/* ═══════════════════════════════════════════════════════
   询单购物车
   ═══════════════════════════════════════════════════════ */

/* 卡片右上角 ＋ */
.card-add {
  position: absolute; top: .5rem; right: .5rem; z-index: 2;
  width: 1.55rem; height: 1.55rem; display: grid; place-items: center;
  border-radius: 50%; cursor: pointer; color: var(--ink-2);
  border: 1px solid var(--glass-border);
  background: rgba(255, 255, 255, .8);
  box-shadow: 0 1px 4px rgba(20, 22, 30, .10);
  opacity: 0; transform: scale(.85);
  transition: opacity .16s, transform .16s, background .16s, color .16s;
  -webkit-tap-highlight-color: transparent;
}
html[data-theme='dark'] .card-add { background: rgba(40, 41, 48, .85); }
.card-add svg { width: .85rem; height: .85rem; stroke-width: 2.4; }
.card:hover .card-add, .card:focus-within .card-add { opacity: 1; transform: scale(1); }
.card-add:hover { background: var(--brand); border-color: var(--brand); color: #fff; }
.card-add.on {
  opacity: 1; transform: scale(1);
  background: linear-gradient(135deg, #10b981, #059669);
  border-color: #059669; color: #fff;
}
.card-add.on svg { stroke-width: 3; }
/* 触屏没有 hover，＋ 常驻 */
@media (hover: none) { .card-add { opacity: 1; transform: scale(1); } }

/* 右下角悬浮按钮 */
.cart-fab {
  position: fixed; z-index: 40;
  right: calc(1rem + env(safe-area-inset-right));
  bottom: calc(1rem + env(safe-area-inset-bottom));
  width: 3.1rem; height: 3.1rem; border-radius: 50%;
  display: grid; place-items: center; cursor: pointer;
  color: var(--ink);
  border-radius: var(--glass-radius-full);
  transition: transform .18s var(--glass-ease), box-shadow .18s;
}
.cart-fab:hover { transform: translateY(-2px) scale(1.04); }
.cart-fab svg { width: 1.35rem; height: 1.35rem; stroke-width: 1.8; }
.cart-count {
  position: absolute; top: -.15rem; right: -.15rem;
  min-width: 1.35rem; height: 1.35rem; padding: 0 .32rem;
  border-radius: 99px; display: grid; place-items: center;
  font-size: .7rem; font-weight: 700; font-variant-numeric: tabular-nums;
  background: linear-gradient(135deg, #ff8a2b, var(--brand));
  color: #fff; box-shadow: 0 2px 8px rgba(224, 79, 0, .4);
  transform: scale(0); transition: transform .2s var(--glass-ease);
}
.cart-count.show { transform: scale(1); }
.cart-fab.bump { animation: cartBump .4s var(--glass-ease); }
@keyframes cartBump { 0%,100% { transform: scale(1); } 35% { transform: scale(1.14); } }

/* 抽屉 */
.cart-scrim {
  position: fixed; inset: 0; z-index: 70;
  display: flex; justify-content: flex-end;
  background: rgba(18, 20, 28, .48);
  backdrop-filter: blur(6px) saturate(120%);
  -webkit-backdrop-filter: blur(6px) saturate(120%);
  animation: fadeIn .18s ease-out;
}
.cart-scrim[hidden] { display: none; }
.cart {
  width: min(26rem, 100%); height: 100%;
  border-radius: 0; border-top: none; border-right: none; border-bottom: none;
  display: flex; flex-direction: column;
  padding: 1rem 1rem calc(1rem + env(safe-area-inset-bottom));
  background:
    linear-gradient(180deg, var(--glass-modal-frost), var(--glass-modal-frost)),
    linear-gradient(180deg, var(--glass-tint-top), var(--glass-tint-bottom));
  animation: slideIn .24s var(--glass-ease);
}
@keyframes slideIn { from { transform: translateX(24px); opacity: 0; } }

.cart-head { display: flex; align-items: center; gap: .5rem; padding-right: 2.2rem; }
.cart-head h2 { margin: 0; font-size: 1rem; font-weight: 700; letter-spacing: -.02em; }
.cart-n { color: var(--muted); font-weight: 500; font-size: .82rem; }
.cart-x { position: absolute; top: .7rem; right: .7rem; }

.cart-list {
  flex: 1 1 auto; overflow: auto; overscroll-behavior: contain;
  margin: .8rem -.2rem 0; padding: 0 .2rem;
}
.cart-empty { padding: 3rem 1rem; text-align: center; color: var(--muted); font-size: .84rem; }

.cart-item {
  display: flex; align-items: center; gap: .55rem;
  padding: .5rem 0; border-bottom: 1px solid var(--hairline);
}
.cart-item .ci-av {
  width: 2.1rem; height: 2.1rem; border-radius: 50%; flex: 0 0 auto;
  object-fit: cover; background: rgba(140, 146, 160, .16);
}
.cart-item .ci-main { flex: 1 1 auto; min-width: 0; }
.cart-item .ci-name {
  font-size: .85rem; font-weight: 650;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cart-item .ci-meta { font-size: .7rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cart-item .ci-del {
  flex: 0 0 auto; width: 1.6rem; height: 1.6rem; display: grid; place-items: center;
  border-radius: 50%; cursor: pointer; color: var(--muted);
  border: 1px solid transparent; background: none;
}
.cart-item .ci-del:hover { color: #e5484d; border-color: rgba(229, 72, 77, .3); background: rgba(229, 72, 77, .08); }
.cart-item .ci-del svg { width: .85rem; height: .85rem; stroke-width: 2.2; }

.cart-foot {
  display: flex; gap: .55rem; padding-top: .85rem; margin-top: .3rem;
  border-top: 1px solid var(--hairline);
}
.cart-copy {
  flex: 1 1 auto; display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
  font: inherit; font-size: .86rem; font-weight: 650; cursor: pointer;
  padding: .62rem 1rem; border-radius: var(--glass-radius-full);
  border: 1px solid rgba(255, 122, 26, .5); color: #fff;
  background: linear-gradient(135deg, #ff8a2b, var(--brand));
  box-shadow: 0 6px 18px rgba(224, 79, 0, .30), inset 0 1px 0 rgba(255, 255, 255, .35);
  transition: transform .16s var(--glass-ease), filter .16s;
}
.cart-copy svg { width: .95rem; height: .95rem; }
.cart-copy:hover { transform: translateY(-1px); filter: brightness(1.05); }
.cart-copy:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.cart-copy.done { background: linear-gradient(135deg, #10b981, #059669); border-color: #059669; box-shadow: 0 6px 18px rgba(5, 150, 105, .3); }

/* 详情弹层右上角的 ＋ */
.detail-add {
  position: absolute; top: .7rem; right: 2.7rem;
  width: 2rem; height: 2rem; display: grid; place-items: center;
  border-radius: 50%; cursor: pointer; color: var(--ink-2);
  border: 1px solid var(--glass-border);
  background: linear-gradient(180deg, var(--glass-tint-top), var(--glass-tint-bottom));
  box-shadow: inset 0 1px 0 var(--glass-rim-top);
}
.detail-add svg { width: .95rem; height: .95rem; stroke-width: 2.2; }
.detail-add:hover { color: var(--brand-ink); border-color: rgba(255, 122, 26, .45); }
.detail-add.on {
  background: linear-gradient(135deg, #10b981, #059669);
  border-color: #059669; color: #fff;
}

/* ═══ 属性标签：橱窗挂车 / 护肤（只有「是」才显示）═══ */
.attrs { display: flex; flex-wrap: wrap; gap: .26rem; min-width: 0; margin-top: .38rem; }
.attrs:empty { display: none; }
/* 极简档是网格列：空的也必须占位，否则后面的链接会串列 */
html[data-density='minimal'] .card .attrs:empty { display: flex; }
.attr {
  display: inline-flex; align-items: center; gap: .18rem;
  font-size: .69rem; line-height: 1; padding: .24rem .42rem .24rem .34rem;
  border-radius: .3rem;
  background: rgba(16, 185, 129, .13); color: #047857;
  border: 1px solid rgba(16, 185, 129, .22);
  white-space: nowrap;
}
html[data-theme='dark'] .attr { background: rgba(16, 185, 129, .18); color: #6ee7b7; border-color: rgba(16, 185, 129, .3); }
.attr svg { width: .68rem; height: .68rem; stroke-width: 3; }
.d-attrs { display: flex; flex-wrap: wrap; gap: .3rem; }

/* 底栏：账号类型 + 主页（属性已单独成行） */
.card-foot .tags { flex: 1 1 auto; }

/* ── 极简档：属性单占一列，整行继续对齐 ── */
html[data-density='minimal'] .card {
  grid-template-columns:
    2.4rem                 /* 头像 */
    minmax(0, 10.5rem)     /* 昵称 */
    11rem                  /* 徽章（含 🉑橱/车 🉑护肤） */
    5.4rem                 /* 粉丝 */
    4.4rem                 /* 女粉 */
    minmax(0, 1fr)         /* 报价 */
    auto;                  /* 链接 */
}
html[data-density='minimal'] .card-foot { display: contents; }
/* 极简档是网格：用 order 把挪进头部的属性放回第 7 列。
   ⚠ .card-head / .ident / .metrics / .stats / .card-foot 都是 display:contents，
     它们不产生盒子，order 必须设在真正的网格子元素上（.avatar/.stat/.home-link…） */
html[data-density='minimal'] .card .avatar    { order: 1; }
html[data-density='minimal'] .card .name      { order: 2; }
html[data-density='minimal'] .card .badges    { order: 3; }
html[data-density='minimal'] .card .stat      { order: 4; }
html[data-density='minimal'] .card .region    { order: 5; }
html[data-density='minimal'] .card .prices    { order: 6; }
html[data-density='minimal'] .card .attrs {
  order: 7; margin-top: 0; flex-wrap: nowrap; overflow: hidden;
}
html[data-density='minimal'] .card .tags      { order: 8; display: none; }
html[data-density='minimal'] .card .home-link { order: 9; }
html[data-density='minimal'] .card .attr { font-size: .6rem; padding: .16rem .32rem .16rem .26rem; }
html[data-density='minimal'] .card .attr svg { width: .6rem; height: .6rem; }
html[data-density='minimal'] .listhead {
  grid-template-columns:
    2.4rem minmax(0, 10.5rem) 11rem 5.4rem 4.4rem minmax(0, 1fr) auto;
}
html[data-density='minimal'] .listhead span:nth-child(1) { grid-column: 2; }
/* 表头文案列顺序：达人 标签 粉丝 女粉 报价 属性 链接 */

/* ═══ 限时超低底价：流光徽章（入库 7 天内）═══ */
.badge.flash {
  position: relative;
  color: #fff;
  background: linear-gradient(100deg, #ff3b30 0%, #ff8a2b 28%, #ffd166 50%, #ff8a2b 72%, #ff3b30 100%);
  background-size: 260% 100%;
  animation: flashSweep 2.8s linear infinite;
  box-shadow: 0 2px 10px rgba(255, 59, 48, .38), inset 0 1px 0 rgba(255, 255, 255, .45);
  padding: .27rem .52rem;
}
@keyframes flashSweep { from { background-position: 130% 0; } to { background-position: -130% 0; } }
.badge.flash .fs { display: none; }

/* 密集 / 极简：用短版本，否则一行放不下 */
html[data-density='dense'] .badge.flash .fl,
html[data-density='minimal'] .card .badge.flash .fl { display: none; }
html[data-density='dense'] .badge.flash .fs,
html[data-density='minimal'] .card .badge.flash .fs { display: inline; }
html[data-density='dense'] .badge.flash { padding: .16rem .34rem; }

/* 尊重「减少动态效果」偏好 */
@media (prefers-reduced-motion: reduce) {
  .badge.flash { animation: none; background: linear-gradient(100deg, #ff3b30, #ff8a2b); }
}

/* ═══ 合作条件徽章（橱窗挂车 / 护肤）—— 文字版，要看得清 ═══ */
.badge.attr {
  padding: .27rem .42rem;
  font-size: .65rem;
  background: rgba(16, 185, 129, .14);
  color: #047857;
  border: 1px solid rgba(16, 185, 129, .3);
  font-weight: 600;
}
html[data-theme='dark'] .badge.attr {
  background: rgba(16, 185, 129, .2); color: #6ee7b7; border-color: rgba(16, 185, 129, .38);
}

/* ═══ 筛选面板标题行：左=折叠按钮，右=排序 ═══ */
.filters-head { display: flex; align-items: center; gap: .7rem; }
.filters-toggle {
  display: flex; align-items: center; gap: .5rem;
  flex: 1 1 auto; min-width: 0;
  background: none; border: none; padding: 0; cursor: pointer;
  font: inherit; color: var(--ink); text-align: left;
}
.filters-toggle .fl-title { font-size: .84rem; font-weight: 650; display: flex; align-items: center; gap: .35rem; white-space: nowrap; }
.filters-toggle svg { width: 1rem; height: 1rem; }
.filters-toggle .chev { margin-left: auto; transition: transform .22s var(--glass-ease); color: var(--muted); }
.filters.open .filters-toggle .chev { transform: rotate(180deg); }
.filters-head .fcount { font-size: .78rem; color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }

/* 排序：做成一眼能看出「可以点」的按钮态 */
.sort-wrap {
  display: flex; align-items: center; gap: .38rem; flex: 0 0 auto;
  padding: .3rem .55rem .3rem .62rem;
  border-radius: var(--glass-radius-full);
  border: 1px solid rgba(255, 122, 26, .35);
  background: linear-gradient(180deg, rgba(255, 122, 26, .10), rgba(255, 122, 26, .05));
  box-shadow: inset 0 1px 0 var(--glass-rim-top), 0 1px 3px rgba(20, 22, 30, .05);
  cursor: pointer;
  transition: border-color .16s, background .16s, box-shadow .16s;
}
.sort-wrap:hover {
  border-color: rgba(255, 122, 26, .6);
  background: linear-gradient(180deg, rgba(255, 122, 26, .16), rgba(255, 122, 26, .09));
}
.sort-ic { width: .95rem; height: .95rem; color: var(--brand-ink); stroke-width: 2; flex: 0 0 auto; }
html[data-theme='dark'] .sort-ic { color: #ff9b52; }
.sort-label { font-size: .76rem; font-weight: 650; color: var(--brand-ink); white-space: nowrap; }
html[data-theme='dark'] .sort-label { color: #ff9b52; }
.sort-wrap .fselect {
  font-size: .8rem; font-weight: 650; color: var(--ink);
  border: none; background-color: transparent;
  padding: .1rem 1.35rem .1rem .1rem;
}
.sort-wrap .fselect:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; border-radius: .3rem; }

@media (max-width: 30rem) {
  .sort-label { display: none; }
  .filters-head { gap: .4rem; }
}

/* ═══ 空状态 ═══ */
.empty { text-align: center; padding: 3.5rem 1rem 4rem; color: var(--muted); }
.empty-ic { width: 2.6rem; height: 2.6rem; color: rgba(140, 146, 160, .45); stroke-width: 1.4; margin-bottom: .7rem; }
.empty-title { margin: 0 0 .35rem; font-size: 1rem; font-weight: 650; color: var(--ink-2); }
.empty-sub { margin: 0 0 1rem; font-size: .82rem; }
.empty-active {
  display: flex; flex-wrap: wrap; gap: .3rem; justify-content: center;
  align-items: center; margin-bottom: 1.2rem;
}
.empty-active[hidden] { display: none; }
.empty-active .ea-label { font-size: .74rem; color: var(--muted); margin-right: .1rem; }
.empty-btn { font-size: .86rem; padding: .58rem 1.3rem; }
.empty.is-error .empty-ic { color: rgba(229, 72, 77, .5); }
.empty.is-error .empty-title { color: #e5484d; }
html[data-theme='dark'] .empty.is-error .empty-title { color: #ff6b6f; }

/* ═══ 悬浮购物车：悬停展开「加入全部筛选结果」 ═══ */
.cart-dock {
  position: fixed; z-index: 40;
  right: calc(1rem + env(safe-area-inset-right));
  bottom: calc(1rem + env(safe-area-inset-bottom));
  /* ⚠ 这个盒子必须只包住购物车按钮本身。
     如果按钮参与布局，它占的那块空白也会算进 :hover 范围，
     鼠标移到按钮上方的空白处就会误触发。 */
  display: block;
  line-height: 0;
}
/* fab 原来自己 fixed，现在由 dock 定位 */
.cart-dock .cart-fab { position: static; right: auto; bottom: auto; }

.cart-addall {
  /* 绝对定位浮在上方：脱离布局，不撑大 dock 的悬停区 */
  position: absolute;
  right: 0;
  bottom: calc(100% + .55rem);
  display: inline-flex; align-items: center; gap: .35rem;
  font: inherit; font-size: .78rem; font-weight: 650; white-space: nowrap;
  padding: .5rem .85rem; border-radius: var(--glass-radius-full);
  cursor: pointer; color: #fff;
  border: 1px solid rgba(255, 122, 26, .5);
  background: linear-gradient(135deg, #ff8a2b, var(--brand));
  box-shadow: 0 8px 22px rgba(224, 79, 0, .34), inset 0 1px 0 rgba(255, 255, 255, .35);
  opacity: 0; transform: translateY(6px) scale(.96); pointer-events: none;
  transition: opacity .18s var(--glass-ease), transform .18s var(--glass-ease);
}
.cart-addall svg { width: .9rem; height: .9rem; stroke-width: 2.6; }
.cart-addall[hidden] { display: none; }
/* 显示由 JS 的悬停意图控制（见 app.js）：
   只在真正悬停购物车时出现，但从购物车移到按钮途中的短暂离开不会立刻收起。 */
.cart-dock.show .cart-addall,
.cart-dock:focus-within .cart-addall { opacity: 1; transform: none; pointer-events: auto; }
.cart-addall:hover { filter: brightness(1.06); }
.cart-addall.done { background: linear-gradient(135deg, #10b981, #059669); border-color: #059669; }

/* 触屏没有 hover：不常驻（会挡住「重置」），改用购物车面板里的按钮 */

/* ═══ 自定义排序下拉（原生 select 的下拉列表改不了样式，只能自己做）═══ */
.sort-wrap { position: relative; }
.sort-btn {
  display: inline-flex; align-items: center; gap: .3rem;
  font: inherit; font-size: .8rem; font-weight: 650; color: var(--ink);
  background: none; border: none; padding: .1rem .1rem .1rem .15rem;
  cursor: pointer; white-space: nowrap;
}
.sort-caret { width: .9rem; height: .9rem; color: var(--brand-ink); transition: transform .2s var(--glass-ease); }
html[data-theme='dark'] .sort-caret { color: #ff9b52; }
.sort-wrap.open .sort-caret { transform: rotate(180deg); }

.sort-menu {
  /* 挂在 body 下 + fixed 定位：脱离 .filters-panel 的层叠上下文 */
  position: fixed; z-index: 9999;
  min-width: 11rem; margin: 0; padding: .35rem; list-style: none;
  border-radius: var(--glass-radius);
  border: 1px solid var(--glass-border);
  background: #fff;
  box-shadow: 0 16px 40px rgba(20, 22, 30, .18), 0 3px 8px rgba(20, 22, 30, .08),
              0 0 0 .5px rgba(20, 22, 30, .06);
  /* ⚠ 不要在这里用 backdrop-filter：父级 .filters-panel 已有
     backdrop-filter: url(#lg-6)，嵌套会导致本元素只画文字、不画背景 */
  animation: sortIn .16s var(--glass-ease);
}
html[data-theme='dark'] .sort-menu {
  background: #21222a;
  box-shadow: 0 16px 40px rgba(0, 0, 0, .5), 0 0 0 .5px rgba(255, 255, 255, .08);
}
.sort-menu[hidden] { display: none; }
@keyframes sortIn { from { opacity: 0; transform: translateY(-4px); } }

.sort-menu li {
  display: flex; align-items: center; gap: .45rem;
  padding: .52rem .6rem; border-radius: .5rem;
  font-size: .82rem; color: var(--ink-2); cursor: pointer;
  transition: background .14s, color .14s;
}
.sort-menu li:hover { background: rgba(255, 122, 26, .10); color: var(--ink); }
.sort-menu li[aria-selected="true"] {
  color: var(--brand-ink); font-weight: 650;
  background: rgba(255, 122, 26, .12);
}
html[data-theme='dark'] .sort-menu li[aria-selected="true"] { color: #ff9b52; }
.sort-menu .tick { width: .9rem; height: .9rem; stroke-width: 2.6; opacity: 0; flex: 0 0 auto; }
.sort-menu li[aria-selected="true"] .tick { opacity: 1; }

/* ═══ 购物车面板内的「加入当前筛选前 30 位」（触屏也能用）═══ */
.cart-quick { padding: .1rem .1rem .6rem; }
.cart-quick[hidden] { display: none; }
.cart-quick-btn {
  display: flex; align-items: center; justify-content: center; gap: .4rem;
  width: 100%; font: inherit; font-size: .84rem; font-weight: 650;
  padding: .68rem 1rem; border-radius: var(--glass-radius-full);
  cursor: pointer; color: #fff;
  border: 1px solid rgba(255, 122, 26, .5);
  background: linear-gradient(135deg, #ff8a2b, var(--brand));
  box-shadow: 0 6px 18px rgba(224, 79, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .35);
  transition: filter .16s, transform .16s;
}
.cart-quick-btn:hover { filter: brightness(1.06); }
.cart-quick-btn:active { transform: scale(.985); }
.cart-quick-btn svg { width: .95rem; height: .95rem; stroke-width: 2.6; }
.cart-quick-btn.done { background: linear-gradient(135deg, #10b981, #059669); border-color: #059669; }
.cart-quick-btn:disabled { opacity: .55; cursor: default; }

/* chip 上的数量角标已去掉；若将来恢复，用这个样式 */
.opt-n {
  margin-left: .3rem; font-size: .68rem; opacity: .55;
  font-variant-numeric: tabular-nums;
}

/* ═══ 链接查询面板 ═══ */
.lookup-scrim {
  position: fixed; inset: 0; z-index: 120;
  display: flex; align-items: flex-start; justify-content: center;
  padding: 6vh 1rem 2rem;
  background: rgba(16, 17, 22, .42);
  backdrop-filter: blur(3px);
  animation: fadeIn .16s var(--glass-ease);
}
.lookup-scrim[hidden] { display: none; }
@keyframes fadeIn { from { opacity: 0; } }

.lookup {
  width: min(46rem, 100%); max-height: 84vh; overflow: auto;
  border-radius: var(--glass-radius);
  border: 1px solid var(--glass-border);
  background: #fff; box-shadow: 0 24px 64px rgba(20, 22, 30, .3);
  padding: 1.1rem 1.2rem 1.3rem;
  animation: popIn .18s var(--glass-ease);
}
html[data-theme='dark'] .lookup { background: #21222a; box-shadow: 0 24px 64px rgba(0,0,0,.6); }
@keyframes popIn { from { opacity: 0; transform: translateY(-8px) scale(.99); } }

.lookup-head { display: flex; align-items: center; gap: .5rem; }
.lookup-head h2 { margin: 0; font-size: 1rem; font-weight: 700; display: flex; align-items: center; gap: .4rem; flex: 1 1 auto; }
.lookup-head svg { width: 1.05rem; height: 1.05rem; stroke-width: 2; color: var(--brand-ink); }
html[data-theme='dark'] .lookup-head svg { color: #ff9b52; }
.lookup-hint { margin: .5rem 0 .8rem; font-size: .78rem; color: var(--muted); }

.lookup-form { display: flex; gap: .5rem; align-items: stretch; }
.lookup-form textarea {
  flex: 1 1 auto; min-width: 0; resize: vertical;
  font: inherit; font-size: .84rem; line-height: 1.45;
  padding: .6rem .75rem; border-radius: var(--glass-radius-sm, .7rem);
  border: 1px solid var(--glass-border); background: var(--field-bg, rgba(127,127,127,.06));
  color: var(--ink);
}
.lookup-form textarea:focus { outline: 2px solid var(--brand); outline-offset: 1px; }
.lookup-go {
  flex: 0 0 auto; font: inherit; font-size: .86rem; font-weight: 650;
  padding: .6rem 1.3rem; border-radius: var(--glass-radius-full); cursor: pointer;
  border: 1px solid rgba(255,122,26,.5); color: #fff;
  background: linear-gradient(135deg, #ff8a2b, var(--brand));
  box-shadow: 0 6px 16px rgba(224,79,0,.26), inset 0 1px 0 rgba(255,255,255,.35);
}
.lookup-go:hover { filter: brightness(1.06); }
.lookup-go:disabled { opacity: .55; cursor: default; }

.lookup-body { margin-top: 1rem; }
.lookup-body:empty { display: none; }

.lk-msg { font-size: .86rem; color: var(--muted); padding: .8rem 0; }
.lk-msg.err { color: #e5484d; }
.lk-state {
  display: inline-flex; align-items: center; gap: .35rem;
  font-size: .76rem; font-weight: 650; padding: .3rem .6rem;
  border-radius: var(--glass-radius-full); margin-bottom: .7rem;
}
.lk-state.hit { background: rgba(16,185,129,.14); color: #047857; }
.lk-state.miss { background: rgba(255,138,43,.16); color: #b45309; }
html[data-theme='dark'] .lk-state.hit { color: #6ee7b7; }
html[data-theme='dark'] .lk-state.miss { color: #ffb066; }
.lk-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(19rem,100%), 1fr)); gap: 1rem; }
.lk-note { margin-top: .9rem; font-size: .8rem; color: var(--muted); line-height: 1.6; }
.lk-note b { color: var(--ink-2); }

/* ═══ 外部查询结果（未入库）—— 刻意区别于库内卡片 ═══ */
.lk-ext {
  border: 1px dashed rgba(255, 138, 43, .55);
  background: rgba(255, 138, 43, .06);
  border-radius: var(--glass-radius-sm, .8rem);
  padding: .85rem .95rem;
}
.lk-ext-head { display: flex; align-items: center; gap: .7rem; }
.lk-ext-av {
  flex: 0 0 auto; width: 3.2rem; height: 3.2rem; border-radius: 50%;
  overflow: hidden; background: rgba(127,127,127,.14); display: block;
}
.lk-ext-av img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lk-ext-id { display: flex; flex-direction: column; gap: .12rem; min-width: 0; }
.lk-ext-id strong { font-size: .98rem; font-weight: 700; }
.lk-ext-meta { font-size: .76rem; color: var(--muted); }
.lk-ext-desc {
  margin: .7rem 0 0; font-size: .78rem; line-height: 1.6; color: var(--ink-2);
  white-space: pre-wrap; word-break: break-word;
}
.lk-ext-stats { display: flex; gap: .9rem; margin-top: .6rem; font-size: .76rem; color: var(--muted); }
.lk-ext-link {
  display: inline-block; margin-top: .8rem; font-size: .8rem; font-weight: 650;
  color: var(--brand-ink); text-decoration: none;
}
html[data-theme='dark'] .lk-ext-link { color: #ff9b52; }
.lk-ext-link:hover { text-decoration: underline; }

/* ═══ 查询中的加载态 ═══ */
.lk-loading { display: flex; align-items: center; gap: .5rem; color: var(--ink-2); }
.lk-sub { margin-top: .1rem; font-size: .76rem; }
.lk-spin {
  flex: 0 0 auto; width: .95rem; height: .95rem; border-radius: 50%;
  border: 2px solid rgba(255, 122, 26, .25);
  border-top-color: var(--brand);
  animation: lkSpin .7s linear infinite;
}
@keyframes lkSpin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .lk-spin { animation-duration: 2s; } }

/* 库外标记 + 外部结果的「加入询单」 */
.ci-ext {
  display: inline-block; margin-left: .35rem; vertical-align: middle;
  font-size: .62rem; font-weight: 650; padding: .1rem .3rem;
  border-radius: .28rem; color: #b45309;
  background: rgba(255, 138, 43, .18); border: 1px solid rgba(255, 138, 43, .35);
}
html[data-theme='dark'] .ci-ext { color: #ffb066; }

.lk-ext-bar { display: flex; align-items: center; gap: .9rem; margin-top: .85rem; }
.lk-ext-add {
  font: inherit; font-size: .8rem; font-weight: 650; cursor: pointer;
  padding: .5rem 1rem; border-radius: var(--glass-radius-full); color: #fff;
  border: 1px solid rgba(255, 122, 26, .5);
  background: linear-gradient(135deg, #ff8a2b, var(--brand));
  box-shadow: 0 5px 14px rgba(224, 79, 0, .24), inset 0 1px 0 rgba(255, 255, 255, .35);
}
.lk-ext-add:hover { filter: brightness(1.06); }
.lk-ext-add.on { background: linear-gradient(135deg, #10b981, #059669); border-color: #059669; box-shadow: none; }

/* ═══ 外部结果的富化字段 ═══ */
.lk-ext-price { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .85rem; }
.lk-ext-p {
  display: inline-flex; align-items: baseline; gap: .4rem;
  padding: .42rem .7rem; border-radius: .55rem;
  background: rgba(16, 185, 129, .13); border: 1px solid rgba(16, 185, 129, .3);
}
.lk-ext-p i { font-style: normal; font-size: .72rem; color: #047857; }
.lk-ext-p b { font-size: .92rem; color: #047857; font-variant-numeric: tabular-nums; }
html[data-theme='dark'] .lk-ext-p i, html[data-theme='dark'] .lk-ext-p b { color: #6ee7b7; }
.lk-ext-noprice { margin: .8rem 0 0; font-size: .78rem; color: var(--muted); }

.lk-ext-kvs {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(10.5rem, 1fr));
  gap: .3rem .9rem; margin-top: .8rem;
}
.lk-ext-kv { display: flex; align-items: baseline; gap: .4rem; font-size: .78rem; min-width: 0; }
.lk-ext-kv span { color: var(--muted); flex: 0 0 auto; }
.lk-ext-kv b { color: var(--ink-2); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lk-ext-wide { grid-column: 1 / -1; }
.lk-ext-wide b { white-space: normal; }

/* ═══ 登录页 / 成员管理 ═══ */
.auth-scrim {
  position: fixed; inset: 0; z-index: 200;
  display: flex; align-items: center; justify-content: center; padding: 1rem;
  background: var(--bg, #f4f5f8);
}
html[data-theme='dark'] .auth-scrim { background: #14151a; }
.auth-scrim[hidden] { display: none; }

.auth, .mgmt {
  width: min(26rem, 100%);
  border-radius: var(--glass-radius); padding: 1.6rem 1.5rem 1.4rem;
  border: 1px solid var(--glass-border); background: #fff;
  box-shadow: 0 24px 64px rgba(20, 22, 30, .16);
  text-align: center;
}
html[data-theme='dark'] .auth, html[data-theme='dark'] .mgmt { background: #21222a; box-shadow: 0 24px 64px rgba(0,0,0,.5); }
.auth-mark {
  display: inline-flex; align-items: center; justify-content: center;
  width: 3rem; height: 3rem; border-radius: 1rem; margin-bottom: .9rem;
  background: linear-gradient(135deg, #ff8a2b, var(--brand));
  box-shadow: 0 8px 20px rgba(224, 79, 0, .3);
}
.auth-mark svg { width: 1.5rem; height: 1.5rem; color: #fff; stroke-width: 2; }
.auth h2 { margin: 0 0 .3rem; font-size: 1.14rem; font-weight: 700; }
.auth-sub { margin: 0 0 1.3rem; font-size: .82rem; color: var(--muted); }
.auth-form { display: flex; flex-direction: column; gap: .55rem; text-align: left; }
.auth-form input, .mgmt-add input {
  font: inherit; font-size: .88rem; padding: .68rem .8rem;
  border-radius: .7rem; border: 1px solid var(--glass-border);
  background: var(--field-bg, rgba(127,127,127,.06)); color: var(--ink);
}
.auth-form input:focus, .mgmt-add input:focus { outline: 2px solid var(--brand); outline-offset: 1px; }
.auth-go {
  font: inherit; font-size: .9rem; font-weight: 650; cursor: pointer;
  padding: .72rem 1rem; border-radius: var(--glass-radius-full); color: #fff;
  border: 1px solid rgba(255,122,26,.5);
  background: linear-gradient(135deg, #ff8a2b, var(--brand));
  box-shadow: 0 6px 16px rgba(224,79,0,.26), inset 0 1px 0 rgba(255,255,255,.35);
}
.auth-go:hover { filter: brightness(1.06); }
.auth-go:disabled { opacity: .55; cursor: default; }
.auth-err { margin: .1rem 0 0; font-size: .78rem; color: #e5484d; min-height: 1.1em; }
.auth-err:empty { display: none; }

/* 成员管理 */
.mgmt { width: min(44rem, 100%); text-align: left; }
.mgmt-add { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin: .9rem 0 .2rem; }
.mgmt-add input[type='text'] { flex: 1 1 8rem; min-width: 0; }
.mgmt-add input[type='password'] { flex: 1 1 8rem; min-width: 0; }
.mgmt-add input[type='number'] { width: 4.6rem; flex: 0 0 auto; }
.mg-admin { display: inline-flex; align-items: center; gap: .3rem; font-size: .8rem; color: var(--ink-2); white-space: nowrap; }
.mgmt-add .auth-go { flex: 0 0 auto; padding: .55rem 1.1rem; font-size: .84rem; }
.mgmt-list { margin-top: .9rem; display: flex; flex-direction: column; gap: .4rem; }
.mg-row {
  display: flex; align-items: center; gap: .6rem;
  padding: .6rem .75rem; border-radius: .7rem;
  border: 1px solid var(--glass-border); background: rgba(127,127,127,.04);
}
.mg-row .mg-name { font-weight: 650; font-size: .88rem; flex: 0 0 auto; }
.mg-row .mg-tag {
  font-size: .66rem; font-weight: 650; padding: .1rem .34rem; border-radius: .28rem;
  background: rgba(255,122,26,.16); color: var(--brand-ink);
}
html[data-theme='dark'] .mg-row .mg-tag { color: #ffb066; }
.mg-row .mg-meta { font-size: .76rem; color: var(--muted); flex: 1 1 auto; }
.mg-row .mg-act {
  font: inherit; font-size: .76rem; cursor: pointer; padding: .32rem .6rem;
  border-radius: var(--glass-radius-full); border: 1px solid var(--glass-border);
  background: transparent; color: var(--ink-2); white-space: nowrap;
}
.mg-row .mg-act:hover { border-color: var(--brand); color: var(--brand-ink); }
.mg-row .mg-act.danger:hover { border-color: #e5484d; color: #e5484d; }

/* 顶栏账号区 */
.me-box { display: flex; align-items: center; gap: .45rem; flex: 0 0 auto; }
.me-name { font-size: .78rem; font-weight: 650; white-space: nowrap; }
.me-quota {
  font-size: .68rem; font-weight: 650; padding: .16rem .42rem; border-radius: var(--glass-radius-full);
  background: rgba(16,185,129,.16); color: #047857; white-space: nowrap;
}
.me-quota.low { background: rgba(255,138,43,.18); color: #b45309; }
.me-quota.zero { background: rgba(229,72,77,.16); color: #e5484d; }
html[data-theme='dark'] .me-quota { color: #6ee7b7; }
html[data-theme='dark'] .me-quota.low { color: #ffb066; }
html[data-theme='dark'] .me-quota.zero { color: #ff7a7f; }

/* 登录页：手机号验证码 */
.auth-or { display: flex; align-items: center; gap: .6rem; margin: .95rem 0 .8rem; color: var(--muted); font-size: .74rem; }
.auth-or::before, .auth-or::after { content: ''; flex: 1 1 auto; height: 1px; background: var(--glass-border); }
.auth-sms { display: flex; gap: .5rem; }
.auth-sms input { flex: 1 1 auto; min-width: 0; }
.auth-code {
  flex: 0 0 auto; font: inherit; font-size: .8rem; font-weight: 650; cursor: pointer;
  padding: .68rem .8rem; border-radius: .7rem; white-space: nowrap;
  border: 1px solid rgba(255,122,26,.5); color: var(--brand-ink); background: rgba(255,122,26,.08);
}
html[data-theme='dark'] .auth-code { color: #ff9b52; }
.auth-code:hover { background: rgba(255,122,26,.16); }
.auth-code:disabled { opacity: .55; cursor: default; }

/* 成员管理：状态标记与汇总 */
.mg-row .mg-tag.auto { background: rgba(76,111,255,.16); color: #3b5bdb; }
.mg-row .mg-tag.off { background: rgba(229,72,77,.16); color: #e5484d; }
html[data-theme='dark'] .mg-row .mg-tag.auto { color: #8aa4ff; }
.mg-sum { margin: .7rem 0 0; font-size: .78rem; color: var(--muted); }
.mg-sum.warn { color: #e5484d; font-weight: 650; }

/* 刷新按钮：转起来 */
@keyframes spinOnce { to { transform: rotate(360deg); } }
.theme-btn.spin svg { animation: spinOnce .8s linear infinite; }

/* ═══ 扩展菜单 ═══ */
.more-menu {
  position: fixed; z-index: 9999;
  min-width: 11.5rem; padding: .35rem;
  border-radius: var(--glass-radius);
  border: 1px solid var(--glass-border);
  background: #fff;
  box-shadow: 0 16px 40px rgba(20, 22, 30, .2), 0 0 0 .5px rgba(20, 22, 30, .06);
  animation: sortIn .16s var(--glass-ease);
}
html[data-theme='dark'] .more-menu {
  background: #21222a;
  box-shadow: 0 16px 40px rgba(0, 0, 0, .5), 0 0 0 .5px rgba(255, 255, 255, .08);
}
.more-menu[hidden] { display: none; }

.mm-head {
  display: flex; align-items: center; justify-content: space-between; gap: .5rem;
  padding: .45rem .6rem .5rem; margin-bottom: .25rem;
  border-bottom: 1px solid var(--glass-border);
}
.mm-user { font-size: .8rem; font-weight: 700; color: var(--ink); }
.mm-quota {
  font-size: .68rem; font-weight: 650; padding: .14rem .4rem;
  border-radius: var(--glass-radius-full);
  background: rgba(16,185,129,.16); color: #047857; white-space: nowrap;
}
.mm-quota.low { background: rgba(255,138,43,.18); color: #b45309; }
.mm-quota.zero { background: rgba(229,72,77,.16); color: #e5484d; }
html[data-theme='dark'] .mm-quota { color: #6ee7b7; }
html[data-theme='dark'] .mm-quota.low { color: #ffb066; }
html[data-theme='dark'] .mm-quota.zero { color: #ff7a7f; }
.mm-quota:empty { display: none; }

.mm-item {
  display: flex; align-items: center; gap: .55rem; width: 100%;
  font: inherit; font-size: .84rem; text-align: left; cursor: pointer;
  padding: .6rem .6rem; border: 0; border-radius: .5rem;
  background: transparent; color: var(--ink-2);
  transition: background .14s, color .14s;
}
.mm-item svg { width: .95rem; height: .95rem; stroke-width: 2; flex: 0 0 auto; color: var(--muted); }
.mm-item:hover { background: rgba(255,122,26,.1); color: var(--ink); }
.mm-item:hover svg { color: var(--brand-ink); }
.mm-item[hidden] { display: none; }
.mm-item.mm-danger:hover { background: rgba(229,72,77,.1); color: #e5484d; }
.mm-item.mm-danger:hover svg { color: #e5484d; }
.mm-sep { height: 1px; margin: .3rem .35rem; background: var(--glass-border); }
.mm-sep:has(+ .mm-item[hidden]) { display: none; }

/* ═══ 修顶栏按钮被压扁 ═══
   原来 .theme-btn 的固定 width:2rem 把 --wide 的 width:auto 吃掉了，
   带文字的按钮被压成 30×30，文字挤没了。这里强制按内容撑开。 */
.theme-btn--wide {
  flex: 0 0 auto;
  width: auto !important;
  min-width: 0;
  padding: 0 .6rem 0 .5rem;
  white-space: nowrap;
}
.theme-btn--wide svg { flex: 0 0 auto; }
.theme-btn--wide span { flex: 0 0 auto; display: inline; }

/* 窄屏：顶栏按钮文字藏起来，只留图标（这次是真的按预期隐藏，不是被压扁） */
@media (max-width: 26rem) {
  .theme-btn--wide span { display: none; }
  .theme-btn--wide { padding: 0; width: 2rem !important; justify-content: center; }
}

/* ═══ 移动端顶栏：压成两行 ═══
   原来品牌区（图标+标题+副标题）太宽，把搜索框挤到第二行，
   再赶上按钮又占一行，顶栏就吃掉 85px。这里把副标题收起来。 */
@media (max-width: 34rem) {
  .brand-slogan { display: none; }
  .brand { margin-right: 0; flex: 0 1 auto; min-width: 0; }
  .brand h1 { font-size: .95rem; overflow: hidden; text-overflow: ellipsis; }
  .topbar-inner { gap: .4rem; padding: .5rem .7rem; }
  .search { flex: 1 1 6rem; min-width: 0; }
  .search input { width: 100%; max-width: none; }
}

/* ═══ 移动端品牌：用短标题，让顶栏收成一行 ═══
   完整标题「人间美事达人报价库」占 215px，把主题按钮挤到了第二行。 */
.bt-short { display: none; }
@media (max-width: 34rem) {
  .bt-full { display: none; }
  .bt-short { display: inline; }
}