/* =============================================================================
   Hover 主题「晶」样式（HOVER 自研）
   -----------------------------------------------------------------------------
   视觉语言 = api.hoverk.com / auto.hoverk.com 同源（令牌 1:1 取自 sub2api tokens.css）：
     - 颜色只承载状态语义，其余一律是"墨 + 软玻璃"；
     - 主按钮 = 哑光墨色（近乎平面、细颗粒、无高光带）；深色模式反转为珠光白；
     - 输入框 = 刻进玻璃的"凹陷井"，聚焦时从内部亮起 + 两角墨线；
     - 内容面板不做 backdrop 模糊（场景本身已柔和，滚动时模糊费帧），
       只有浮在内容之上的东西（导航、菜单、弹窗、提示）才用真实模糊。
   加载顺序：bootstrap.min.css → _.css（公共组件与图标字体）→ 本文件（最后收口）。
   本主题所有自有类名带 hv- 前缀；官方控制器脚本生成的标记（.pay / .sku / .order-item …）
   在文件末尾单独收口。断点：≤1279 收窄；≤1023 导航折叠进抽屉、单栏；≤767 手机（行变卡片）。
   ============================================================================= */

/* ---------- 令牌：浅色 ---------- */
:root {
  color-scheme: light;
  --hv-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Noto Sans SC', 'Helvetica Neue', Arial, sans-serif;
  /* 等宽字体都不带中文：中文字体排在泛型 monospace 之前，否则中文 Windows 会退回宋体（细、显小） */
  --hv-mono: 'JetBrains Mono', 'SF Mono', 'Cascadia Mono', Consolas, 'PingFang SC', 'Microsoft YaHei', 'Noto Sans SC', monospace;

  --hv-bg: #eef0f4;
  /* 同色的 rgb 三元组，给半透明遮罩用：rgba(var(--hv-bg-rgb), a)。color-mix 老内核（Safari <16.2 / Chrome <111）不认，
     带 var() 的声明解析期照样算合法、写在前面的兜底会被它覆盖，到计算值阶段整条失效，遮罩直接透明 */
  --hv-bg-rgb: 238, 240, 244;
  --hv-blob-1: rgba(197, 205, 222, 0.85);
  --hv-blob-2: rgba(228, 219, 208, 0.78);
  --hv-blob-3: rgba(204, 215, 229, 0.8);
  --hv-scene:
    radial-gradient(44% 38% at 10% 4%, var(--hv-blob-1), transparent 70%),
    radial-gradient(36% 34% at 94% 12%, var(--hv-blob-2), transparent 72%),
    radial-gradient(48% 42% at 74% 100%, var(--hv-blob-3), transparent 72%),
    radial-gradient(30% 30% at 24% 92%, var(--hv-blob-2), transparent 70%);
  --hv-grain: 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='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .6 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --hv-grain-opacity: 0.045;
  --hv-grain-blend: multiply;

  --hv-text: #1c2024;
  --hv-text-2: #585d66;
  --hv-text-3: #80858f;
  --hv-link: #0d63b8;
  --hv-line: rgba(28, 32, 36, 0.09);
  --hv-line-soft: rgba(28, 32, 36, 0.06);
  --hv-line-strong: rgba(28, 32, 36, 0.22);
  --hv-hover: rgba(28, 32, 36, 0.05);
  --hv-hover-strong: rgba(28, 32, 36, 0.085);
  --hv-focus-ring: rgba(28, 32, 36, 0.55);
  --hv-selection-bg: #1c2024;
  --hv-selection-fg: #ffffff;
  --hv-code-bg: rgba(28, 32, 36, 0.055);
  --hv-code-fg: #2b3037;
  --hv-brand-line-rgb: 28, 32, 36;

  --hv-success: #127b3c; --hv-success-strong: #1aa251; --hv-success-soft: rgba(26, 162, 81, 0.12); --hv-success-line: rgba(26, 162, 81, 0.28);
  --hv-error: #c4262c; --hv-error-strong: #e5484d; --hv-error-soft: rgba(206, 44, 49, 0.1); --hv-error-line: rgba(206, 44, 49, 0.26);
  --hv-warning: #8a5d0c; --hv-warning-strong: #e2a336; --hv-warning-soft: rgba(214, 158, 46, 0.16); --hv-warning-line: rgba(186, 135, 30, 0.3);
  --hv-info: #0d63b8; --hv-info-strong: #3b8fe3; --hv-info-soft: rgba(13, 116, 206, 0.1); --hv-info-line: rgba(13, 116, 206, 0.26);

  --hv-cta-fg: #f6f7f9;
  --hv-cta-hover: 1.2;
  --hv-th-bg: rgba(28, 32, 36, 0.028);
  --hv-row-hover: rgba(28, 32, 36, 0.03);
  --hv-pop-bg: rgba(255, 255, 255, 0.78);
  --hv-backdrop: rgba(18, 22, 30, 0.3);
  /* = 遮罩叠在 --hv-bg 上的颜色（30% rgb(18,22,30) 混 #eef0f4），预先算好：color-mix 在老内核（Safari <16.2 / Chrome <111）不认，
     整条 background 简写就在计算值阶段失效、body 变透明，遮罩后面露出白画布 */
  --hv-backdrop-solid: rgb(172, 175, 180);
  --hv-nav-active-fg: #f6f7f9;
  --hv-drawer-bg: rgba(248, 249, 251, 0.86);
  --hv-glass-border: rgba(255, 255, 255, 0.82);
  --hv-glass-hi: rgba(255, 255, 255, 0.9);
  --hv-nav-bg: rgba(255, 255, 255, 0.55);
  --hv-nav-shadow: inset 0 1px 0 var(--hv-glass-hi), 0 8px 24px -16px rgba(16, 20, 28, 0.3);
  --hv-round-bg: rgba(255, 255, 255, 0.64);
  --hv-round-bg-hover: #ffffff;
  --hv-front-sheen: rgba(255, 255, 255, 0.55);
  --hv-layer-bg: #ffffff;
  --hv-layer-bg-rgb: 255, 255, 255;
  --hv-thumb-ring: rgba(16, 20, 28, 0.08);

  --hv-rim: linear-gradient(140deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.55) 26%, rgba(128, 142, 170, 0.26) 58%, rgba(255, 255, 255, 0.92) 100%);
  --hv-panel-bg: linear-gradient(168deg, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0.58) 48%, rgba(255, 255, 255, 0.66) 100%);
  --hv-panel-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), inset 0 -22px 40px -30px rgba(72, 88, 124, 0.14), 0 1px 1px rgba(16, 20, 28, 0.03), 0 8px 16px -8px rgba(16, 20, 28, 0.07), 0 28px 48px -28px rgba(16, 20, 28, 0.2);
  --hv-stat-bg: linear-gradient(168deg, rgba(255, 255, 255, 0.84) 0%, rgba(255, 255, 255, 0.6) 100%);
  --hv-stat-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), inset 0 -18px 30px -24px rgba(72, 88, 124, 0.13), 0 1px 1px rgba(16, 20, 28, 0.03), 0 6px 12px -6px rgba(16, 20, 28, 0.07), 0 20px 36px -24px rgba(16, 20, 28, 0.18);
  --hv-well: linear-gradient(180deg, rgba(20, 26, 38, 0.062), rgba(20, 26, 38, 0.026));
  --hv-well-shadow: inset 0 1px 2px rgba(16, 20, 28, 0.12), inset 0 0 0 1px rgba(16, 20, 28, 0.035), 0 1px 0 rgba(255, 255, 255, 0.9);
  --hv-inset-bg: linear-gradient(180deg, rgba(20, 26, 38, 0.045), rgba(20, 26, 38, 0.02));
  --hv-inset-shadow: inset 0 1px 2px rgba(16, 20, 28, 0.09), inset 0 0 0 1px rgba(16, 20, 28, 0.03), 0 1px 0 rgba(255, 255, 255, 0.85);
  --hv-list-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(255, 255, 255, 0.56));
  --hv-list-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), 0 0 0 1px rgba(16, 20, 28, 0.055), 0 2px 5px -2px rgba(16, 20, 28, 0.08);
  --hv-chip-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.8));
  --hv-chip-bg-hover: linear-gradient(180deg, #ffffff, rgba(255, 255, 255, 0.94));
  --hv-chip-shadow: inset 0 1px 0 #ffffff, 0 0 0 1px rgba(16, 20, 28, 0.075), 0 1px 2px rgba(16, 20, 28, 0.07), 0 3px 6px -3px rgba(16, 20, 28, 0.12);
  --hv-chip-shadow-hover: inset 0 1px 0 #ffffff, 0 0 0 1px rgba(16, 20, 28, 0.13), 0 2px 4px rgba(16, 20, 28, 0.08), 0 6px 12px -6px rgba(16, 20, 28, 0.18);
  --hv-table-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.74), rgba(255, 255, 255, 0.58));
  --hv-table-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 0 0 1px rgba(16, 20, 28, 0.06), 0 2px 5px -2px rgba(16, 20, 28, 0.07);
  --hv-console-bg: linear-gradient(180deg, #14161b 0%, #0f1115 100%);
  --hv-console-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.55), inset 0 0 0 1px rgba(255, 255, 255, 0.05), 0 1px 0 rgba(255, 255, 255, 0.85);
  --hv-console-fg: #d5d9e0;
  --hv-pop-blur: blur(26px) saturate(160%);
  --hv-pop-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), 0 0 0 1px rgba(16, 20, 28, 0.07), 0 12px 28px -10px rgba(16, 20, 28, 0.26), 0 32px 60px -32px rgba(16, 20, 28, 0.34);
  --hv-dialog-bg: linear-gradient(168deg, rgba(255, 255, 255, 0.94), rgba(250, 251, 253, 0.88));
  --hv-dialog-shadow: inset 0 1px 0 #ffffff, 0 0 0 1px rgba(16, 20, 28, 0.06), 0 24px 48px -16px rgba(16, 20, 28, 0.34), 0 64px 120px -48px rgba(16, 20, 28, 0.46);

  /* 主卡片「晶」（登录卡） */
  --hv-card-aura: radial-gradient(36% 30% at 86% 92%, rgba(52, 64, 96, 0.32), transparent 72%), radial-gradient(30% 28% at 2% 0%, rgba(255, 255, 255, 1), transparent 70%), radial-gradient(24% 24% at 100% 4%, rgba(208, 190, 166, 0.42), transparent 72%);
  --hv-card-face: linear-gradient(168deg, rgba(255, 255, 255, 0.86) 0%, rgba(255, 255, 255, 0.58) 46%, rgba(255, 255, 255, 0.66) 100%);
  --hv-card-rim: linear-gradient(140deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.55) 26%, rgba(150, 162, 186, 0.3) 58%, rgba(255, 255, 255, 0.95) 100%);
  --hv-card-depth: inset 0 1px 0 rgba(255, 255, 255, 1), inset 1px 0 0 rgba(255, 255, 255, 0.55), inset 0 -1px 0 rgba(255, 255, 255, 0.55), inset 0 26px 44px -32px rgba(255, 255, 255, 0.95), inset 0 -26px 44px -30px rgba(72, 88, 124, 0.26);
  --hv-card-shadow: 0 1px 1px rgba(16, 20, 28, 0.03), 0 6px 12px -4px rgba(16, 20, 28, 0.06), 0 28px 56px -22px rgba(16, 20, 28, 0.22), 0 72px 120px -52px rgba(16, 20, 28, 0.36);

  /* 主按钮「墨」 */
  --hv-ink-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --hv-cta:
    var(--hv-ink-grain) 0 0 / 120px 120px padding-box,
    linear-gradient(112deg, rgba(255, 255, 255, 0.075) 0%, rgba(255, 255, 255, 0) 38%, rgba(255, 255, 255, 0) 62%, rgba(255, 255, 255, 0.035) 100%) padding-box,
    linear-gradient(180deg, #24272d 0%, #131518 100%) padding-box,
    linear-gradient(180deg, #4b5059 0%, #1a1c20 42%, #000000 100%) border-box;
  --hv-cta-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.09), 0 1px 1px rgba(10, 12, 16, 0.28), 0 3px 6px -2px rgba(10, 12, 16, 0.24), 0 10px 18px -12px rgba(10, 12, 16, 0.42);
  --hv-cta-shadow-hover: inset 0 1px 0 rgba(255, 255, 255, 0.09), 0 1px 1px rgba(10, 12, 16, 0.3), 0 6px 12px -2px rgba(10, 12, 16, 0.28), 0 22px 30px -18px rgba(10, 12, 16, 0.5);
  --hv-cta-shadow-press: inset 0 2px 4px rgba(0, 0, 0, 0.5), 0 1px 1px rgba(10, 12, 16, 0.28);

  /* 输入井 */
  --hv-field-h: 40px;
  --hv-field-radius: 12px;
  --hv-field-edge: linear-gradient(rgba(16, 20, 28, 0.035), rgba(16, 20, 28, 0.035));
  --hv-field-shadow: inset 0 1px 2px rgba(16, 20, 28, 0.12), 0 1px 0 rgba(255, 255, 255, 0.9);
  --hv-field-fill-hover: linear-gradient(180deg, rgba(20, 26, 38, 0.078), rgba(20, 26, 38, 0.036));
  --hv-field-fill-focus: linear-gradient(180deg, rgba(240, 242, 246, 0.94) 0%, rgba(255, 255, 255, 0.99) 58%, #ffffff 100%);
  --hv-field-shadow-focus: inset 0 2px 4px rgba(16, 20, 28, 0.11), inset 0 -1px 0 #ffffff, 0 0 0 4px rgba(255, 255, 255, 0.62), 0 0 18px 4px rgba(255, 255, 255, 0.55);
  --hv-field-edge-focus: linear-gradient(135deg, rgba(28, 32, 36, 0.68) 0%, rgba(28, 32, 36, 0.22) 36%, rgba(28, 32, 36, 0.14) 64%, rgba(28, 32, 36, 0.5) 100%);
  --hv-check-mark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  --hv-radio-dot: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='1.75' fill='white'/%3E%3C/svg%3E");
  --hv-check-on: linear-gradient(180deg, #2b2f36, #121417);
  --hv-check-on-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 1px 2px rgba(10, 12, 16, 0.3);
  --hv-select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23686d77' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  /* 蒙版只看透明度，深浅色共用；颜色由使用处的 currentColor 决定 */
  --hv-x-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E");
}

/* ---------- 令牌：深色 ---------- */
:root[data-theme="dark"] {
  color-scheme: dark;
  --hv-bg: #0c0e12;
  --hv-bg-rgb: 12, 14, 18;
  --hv-blob-1: rgba(56, 66, 96, 0.55);
  --hv-blob-2: rgba(86, 72, 60, 0.4);
  --hv-blob-3: rgba(44, 60, 82, 0.55);
  --hv-grain: 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='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .5 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --hv-grain-opacity: 0.07;
  --hv-grain-blend: screen;
  --hv-text: #f2f3f5;
  --hv-text-2: #b1b6c0;
  --hv-text-3: #7f858f;
  --hv-link: #70b8ff;
  --hv-line: rgba(255, 255, 255, 0.09);
  --hv-line-soft: rgba(255, 255, 255, 0.06);
  --hv-line-strong: rgba(255, 255, 255, 0.24);
  --hv-hover: rgba(255, 255, 255, 0.06);
  --hv-hover-strong: rgba(255, 255, 255, 0.1);
  --hv-focus-ring: rgba(255, 255, 255, 0.7);
  --hv-selection-bg: #f2f3f5;
  --hv-selection-fg: #101216;
  --hv-code-bg: rgba(255, 255, 255, 0.075);
  --hv-code-fg: #e3e5ea;
  --hv-brand-line-rgb: 242, 243, 245;
  --hv-success: #4cc38a; --hv-success-strong: #3dd68c; --hv-success-soft: rgba(61, 214, 140, 0.13); --hv-success-line: rgba(61, 214, 140, 0.3);
  --hv-error: #ff7b80; --hv-error-strong: #ff6369; --hv-error-soft: rgba(255, 99, 105, 0.14); --hv-error-line: rgba(255, 99, 105, 0.32);
  --hv-warning: #f1c262; --hv-warning-strong: #f5b83d; --hv-warning-soft: rgba(245, 184, 61, 0.13); --hv-warning-line: rgba(245, 184, 61, 0.3);
  --hv-info: #70b8ff; --hv-info-strong: #4aa3ff; --hv-info-soft: rgba(74, 163, 255, 0.14); --hv-info-line: rgba(74, 163, 255, 0.32);
  --hv-cta-fg: #14161a;
  --hv-cta-hover: 1.06;
  --hv-th-bg: rgba(255, 255, 255, 0.035);
  --hv-row-hover: rgba(255, 255, 255, 0.035);
  --hv-pop-bg: rgba(30, 33, 40, 0.78);
  --hv-backdrop: rgba(4, 5, 7, 0.55);
  --hv-backdrop-solid: rgb(8, 9, 12); /* 55% rgb(4,5,7) 混 #0c0e12 */
  --hv-nav-active-fg: #14161a;
  --hv-drawer-bg: rgba(18, 20, 25, 0.88);
  --hv-glass-border: rgba(255, 255, 255, 0.1);
  --hv-glass-hi: rgba(255, 255, 255, 0.07);
  --hv-nav-bg: rgba(26, 28, 34, 0.55);
  --hv-nav-shadow: inset 0 1px 0 var(--hv-glass-hi), 0 8px 24px -16px rgba(0, 0, 0, 0.6);
  --hv-round-bg: rgba(255, 255, 255, 0.06);
  --hv-round-bg-hover: #17191d;
  --hv-front-sheen: rgba(255, 255, 255, 0.12);
  --hv-layer-bg: #1e2128;
  --hv-layer-bg-rgb: 30, 33, 40;
  --hv-thumb-ring: rgba(255, 255, 255, 0.1);
  --hv-rim: linear-gradient(140deg, rgba(255, 255, 255, 0.34) 0%, rgba(255, 255, 255, 0.09) 26%, rgba(255, 255, 255, 0.03) 58%, rgba(255, 255, 255, 0.18) 100%);
  --hv-panel-bg: linear-gradient(168deg, rgba(50, 55, 66, 0.66) 0%, rgba(27, 30, 37, 0.6) 48%, rgba(21, 23, 28, 0.66) 100%);
  --hv-panel-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), inset 0 -22px 40px -30px rgba(0, 0, 0, 0.45), 0 1px 1px rgba(0, 0, 0, 0.3), 0 8px 16px -8px rgba(0, 0, 0, 0.4), 0 28px 48px -28px rgba(0, 0, 0, 0.7);
  --hv-stat-bg: linear-gradient(168deg, rgba(54, 59, 71, 0.7) 0%, rgba(25, 27, 33, 0.62) 100%);
  --hv-stat-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), inset 0 -18px 30px -24px rgba(0, 0, 0, 0.45), 0 1px 1px rgba(0, 0, 0, 0.3), 0 6px 12px -6px rgba(0, 0, 0, 0.4), 0 20px 36px -24px rgba(0, 0, 0, 0.7);
  --hv-well: linear-gradient(180deg, rgba(0, 0, 0, 0.42), rgba(0, 0, 0, 0.26));
  --hv-well-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.55), inset 0 0 0 1px rgba(255, 255, 255, 0.045), 0 1px 0 rgba(255, 255, 255, 0.06);
  --hv-inset-bg: linear-gradient(180deg, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.18));
  --hv-inset-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.5), inset 0 0 0 1px rgba(255, 255, 255, 0.04), 0 1px 0 rgba(255, 255, 255, 0.05);
  --hv-list-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.03));
  --hv-list-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 0 0 1px rgba(255, 255, 255, 0.06);
  --hv-chip-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.105), rgba(255, 255, 255, 0.055));
  --hv-chip-bg-hover: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.085));
  --hv-chip-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 0 0 1px rgba(255, 255, 255, 0.075), 0 1px 2px rgba(0, 0, 0, 0.3);
  --hv-chip-shadow-hover: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 0 0 1px rgba(255, 255, 255, 0.14), 0 2px 6px rgba(0, 0, 0, 0.4);
  --hv-table-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.025));
  --hv-table-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 0 0 1px rgba(255, 255, 255, 0.06);
  --hv-console-bg: linear-gradient(180deg, #08090b 0%, #050607 100%);
  --hv-console-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.8), inset 0 0 0 1px rgba(255, 255, 255, 0.06), 0 1px 0 rgba(255, 255, 255, 0.05);
  --hv-pop-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 0 0 1px rgba(255, 255, 255, 0.08), 0 12px 28px -10px rgba(0, 0, 0, 0.7), 0 32px 60px -32px rgba(0, 0, 0, 0.8);
  --hv-dialog-bg: linear-gradient(168deg, rgba(44, 48, 58, 0.94), rgba(24, 26, 32, 0.92));
  --hv-dialog-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 0 0 1px rgba(255, 255, 255, 0.08), 0 24px 48px -16px rgba(0, 0, 0, 0.7), 0 64px 120px -48px rgba(0, 0, 0, 0.9);
  --hv-card-aura: radial-gradient(38% 32% at 6% 0%, rgba(150, 170, 215, 0.3), transparent 72%), radial-gradient(30% 28% at 96% 96%, rgba(0, 0, 0, 0.7), transparent 72%), radial-gradient(22% 22% at 100% 2%, rgba(190, 160, 130, 0.16), transparent 72%);
  --hv-card-face: linear-gradient(168deg, rgba(58, 63, 75, 0.72) 0%, rgba(28, 31, 38, 0.62) 46%, rgba(20, 22, 27, 0.7) 100%);
  --hv-card-rim: linear-gradient(140deg, rgba(255, 255, 255, 0.42) 0%, rgba(255, 255, 255, 0.1) 26%, rgba(255, 255, 255, 0.03) 58%, rgba(255, 255, 255, 0.22) 100%);
  --hv-card-depth: inset 0 1px 0 rgba(255, 255, 255, 0.16), inset 1px 0 0 rgba(255, 255, 255, 0.05), inset 0 -1px 0 rgba(255, 255, 255, 0.05), inset 0 26px 44px -32px rgba(255, 255, 255, 0.1), inset 0 -26px 44px -30px rgba(0, 0, 0, 0.55);
  --hv-card-shadow: 0 1px 1px rgba(0, 0, 0, 0.3), 0 6px 12px -4px rgba(0, 0, 0, 0.35), 0 28px 56px -22px rgba(0, 0, 0, 0.6), 0 72px 120px -52px rgba(0, 0, 0, 0.85);
  --hv-ink-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .06 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --hv-cta:
    var(--hv-ink-grain) 0 0 / 120px 120px padding-box,
    linear-gradient(112deg, rgba(255, 255, 255, 0.35) 0%, rgba(255, 255, 255, 0) 40%) padding-box,
    linear-gradient(180deg, #f1f2f5 0%, #d4d7dd 100%) padding-box,
    linear-gradient(180deg, #ffffff 0%, #b9bdc6 100%) border-box;
  --hv-cta-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), 0 1px 1px rgba(0, 0, 0, 0.4), 0 4px 10px -4px rgba(0, 0, 0, 0.6);
  --hv-cta-shadow-hover: inset 0 1px 0 rgba(255, 255, 255, 0.8), 0 1px 1px rgba(0, 0, 0, 0.4), 0 6px 12px -2px rgba(0, 0, 0, 0.45), 0 22px 30px -18px rgba(0, 0, 0, 0.85);
  --hv-cta-shadow-press: inset 0 2px 4px rgba(0, 0, 0, 0.28);
  --hv-field-edge: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05));
  --hv-field-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.55), 0 1px 0 rgba(255, 255, 255, 0.06);
  --hv-field-fill-hover: linear-gradient(180deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.32));
  /* 必须不透明：井的底层（border-box）是 --hv-field-edge-focus 那道白色斜向渐变，填充一透光就整面泛出金属高光带 */
  --hv-field-fill-focus: linear-gradient(180deg, #0d0e11 0%, #131519 100%);
  --hv-field-shadow-focus: inset 0 2px 5px rgba(0, 0, 0, 0.7), 0 0 0 4px rgba(255, 255, 255, 0.045), 0 0 22px -2px rgba(255, 255, 255, 0.14);
  --hv-field-edge-focus: linear-gradient(135deg, rgba(255, 255, 255, 0.82) 0%, rgba(255, 255, 255, 0.26) 36%, rgba(255, 255, 255, 0.16) 64%, rgba(255, 255, 255, 0.6) 100%);
  --hv-check-mark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23121417' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  --hv-radio-dot: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='1.75' fill='%23121417'/%3E%3C/svg%3E");
  --hv-check-on: linear-gradient(180deg, #f6f7f9, #d5d8de);
  --hv-check-on-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
  --hv-select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a3a9b4' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

/* ---------- 令牌映射：公共组件（自选弹窗的搜索 / 表格 = --md-*，全屏加载环 = --chahuo-ring-*）
   不映射就落到它们写死的浅色兜底（#20242c 字、白卡、青绿 #25b09b），深色模式直接看不见。
   写在 :root 上随 data-theme 一起切换；用 [data-theme] 把优先级抬到与 _.css 里
   :root[data-theme=dark]{--chahuo-ring-overlay} 相同，靠加载顺序压过它（html 永远带 data-theme） ---------- */
:root[data-theme] {
  --md-primary: var(--hv-text);
  --md-primary-rgb: var(--hv-brand-line-rgb);
  --md-on-primary: var(--hv-cta-fg);
  --md-surface: var(--hv-layer-bg);
  --md-surface-2: var(--hv-layer-bg);
  --md-on-surface: var(--hv-text);
  --md-on-surface-med: var(--hv-text-2);
  --md-on-surface-dis: var(--hv-text-3);
  --md-outline: var(--hv-line-strong);
  --md-divider: var(--hv-line);
  --md-hover-overlay: var(--hv-hover);
  --md-selected-overlay: var(--hv-hover-strong);
  --chahuo-ring-color: var(--hv-text);
  --chahuo-ring-rgb: var(--hv-brand-line-rgb);
  --chahuo-ring-card: var(--hv-layer-bg);
  --chahuo-ring-overlay: rgba(var(--hv-bg-rgb), 0.45);
}

/* =============================================================================
   基础（收口 bootstrap / layui 的默认值）
   ============================================================================= */
html { scrollbar-gutter: stable; -webkit-text-size-adjust: 100%; }
@supports not (scrollbar-gutter: stable) { html { overflow-y: scroll; } }
html.hv-modal-open, html.hv-drawer-open { overflow: hidden; }
/* 滚动条槽（stable 预留的那一条）在遮罩之外，浏览器只拿画布的背景色（= body 背景传播上去的 --hv-bg）填它，
   弹窗 / 抽屉一开就是一道亮边。锁滚动期间把背景色换成「遮罩叠在底色上」的颜色，再用一层 no-repeat 的 --hv-bg
   图层铺满页面盒子，页面本身不变、只有槽位变暗。html 自身不能加背景：那样 body 背景不再传播，会盖住 z-index:-1 的场景层 */
html.hv-modal-open body.hv-theme, html.hv-drawer-open body.hv-theme {
  background: linear-gradient(var(--hv-bg), var(--hv-bg)) no-repeat var(--hv-backdrop-solid);
}
/* 登录 / 注册 / 找回是一屏卡片页，本来就不滚动：不预留槽位，免得右侧空出一条纯色。
   订单查询页平时也只有一屏（空态 / 查不到），同样不预留：场景的暖色光团贴着右缘，旁边那条画布纯色是一道硬边；
   查出长结果时滚动条出现，居中的窄栏只挪半个滚动条宽，正好发生在结果刷出来的那一刻，不显眼 */
html:has(> body.hv-auth-body), html:has(.hv-query-hero) { scrollbar-gutter: auto; }
*, *::before, *::after { box-sizing: border-box; }
body.hv-theme {
  margin: 0;
  min-height: 100vh;
  background: var(--hv-bg);
  color: var(--hv-text);
  font-family: var(--hv-font);
  font-size: 14px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
/* 场景：固定层上的软色团 + 细颗粒（内容面板不再模糊它） */
body.hv-theme::before, body.hv-theme::after { content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none; }
body.hv-theme::before { background: var(--hv-scene); }
body.hv-theme::after { background: var(--hv-grain) 0 0 / 160px 160px; opacity: var(--hv-grain-opacity); mix-blend-mode: var(--hv-grain-blend); }
.hv-theme ::selection { background: var(--hv-selection-bg); color: var(--hv-selection-fg); }
.hv-theme :focus-visible { outline: 2px solid var(--hv-focus-ring); outline-offset: 2px; }
/* 基础重置用 :where() 压到 0 优先级：只盖过 bootstrap / layui 的 a、a:hover、button 默认色，不压自己的组件色 */
:where(.hv-theme) a { color: inherit; text-decoration: none; }
:where(.hv-theme) a:hover, :where(.hv-theme) a:focus { color: inherit; text-decoration: none; }
.hv-theme img { max-width: 100%; }
:where(.hv-theme) button { font: inherit; color: inherit; cursor: pointer; }
.hv-theme h1, .hv-theme h2, .hv-theme h3, .hv-theme h4, .hv-theme p { margin: 0; }
.hv-theme .form-label { margin: 0; display: block; font-size: 12.5px; font-weight: 500; color: var(--hv-text-2); }
.hv-i { width: 1em; height: 1em; flex: none; display: inline-block; vertical-align: -0.15em; fill: none; }
.hv-link { color: var(--hv-link); font-weight: 600; }
.hv-link:hover { color: var(--hv-link); text-decoration: underline; text-underline-offset: 3px; }
.hv-text-3 { color: var(--hv-text-3); }
.hv-hint { font-size: 12px; line-height: 1.65; color: var(--hv-text-3); }
.hv-eyebrow { display: block; font-size: 12px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--hv-text-3); }
.hv-title-22 { margin: 0; font-size: 22px; font-weight: 700; line-height: 1.2; letter-spacing: -0.022em; }
.hv-display { margin: 0; font-size: clamp(30px, 4.6vw, 44px); font-weight: 800; line-height: 1.08; letter-spacing: -0.035em; }
.hv-spinner { display: inline-block; width: 16px; height: 16px; border-radius: 50%; border: 2px solid var(--hv-line-strong); border-top-color: var(--hv-text); animation: hv-spin 0.8s linear infinite; }
@keyframes hv-spin { to { transform: rotate(360deg); } }
@keyframes hv-breathe { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } }
#pjax-container { transition: opacity 0.18s ease; }
#pjax-container.is-pjax-loading { opacity: 0.68; pointer-events: none; }

/* ---------- 壳 ---------- */
.hv-frame { min-height: 100vh; display: flex; flex-direction: column; }
.hv-shell { width: min(1280px, calc(100% - 48px)); margin: 0 auto; }
.hv-shell--narrow { width: min(760px, calc(100% - 48px)); }
.hv-main { padding: 26px 0 56px; }

/* =============================================================================
   顶部悬浮胶囊导航（api / auto 同款）
   ============================================================================= */
.hv-band { position: sticky; top: 0; z-index: 60; padding: 14px 24px 0; }
/* 胶囊的玻璃底（底色 + 模糊）画在 ::before 上，不放在 .hv-nav 本身：带 backdrop-filter 的元素会成为后代的
   Backdrop Root，挂在导航里的语言 / 账号菜单就只能模糊导航自己，垂到导航下方的部分直接透出没模糊的页面字。
   ::before 以 z-index:-1 落在 .hv-band（sticky + z-index 已是层叠上下文）里，仍在导航内容之下 */
.hv-nav {
  position: relative;
  width: min(1280px, 100%); margin: 0 auto;
  display: flex; align-items: center; gap: 10px;
  height: 62px; padding: 10px 12px;
  border: 1px solid var(--hv-glass-border); border-radius: 999px;
  box-shadow: var(--hv-nav-shadow);
}
.hv-nav::before { content: ''; position: absolute; inset: -1px; z-index: -1; border-radius: inherit; pointer-events: none;
  background: var(--hv-nav-bg); -webkit-backdrop-filter: blur(18px) saturate(1.4); backdrop-filter: blur(18px) saturate(1.4); }
.hv-brand { display: inline-flex; align-items: center; gap: 10px; min-width: 0; padding-right: 6px; }
.hv-brand:hover, .hv-auth-brand:hover { color: inherit; }
.hv-brand__mark { width: 42px; height: 42px; border-radius: 12px; object-fit: cover; filter: drop-shadow(0 2px 4px rgba(16, 20, 28, 0.16)); }
.hv-brand__mark--sm { width: 36px; height: 36px; border-radius: 10px; }
.hv-brand__mark--lg { width: 52px; height: 52px; border-radius: 14px; filter: drop-shadow(0 3px 6px rgba(16, 20, 28, 0.16)); }
:root[data-theme="dark"] .hv-brand__mark { filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.45)); }
.hv-brand__word { display: inline-block; font-size: 16px; font-weight: 800; line-height: 1.1; letter-spacing: -0.04em; text-transform: uppercase; white-space: nowrap; }
.hv-brand__word--lg { font-size: 22px; }
.hv-brand__word::after { content: ''; display: block; width: 100%; min-width: 54px; height: 3px; margin-top: 5px; border-radius: 999px;
  background: linear-gradient(90deg, rgba(var(--hv-brand-line-rgb), 0.9) 0%, rgba(var(--hv-brand-line-rgb), 0.58) 38%, rgba(var(--hv-brand-line-rgb), 0.18) 74%, rgba(var(--hv-brand-line-rgb), 0) 100%); }
.hv-nav__links { display: flex; align-items: center; gap: 4px; margin-left: 6px; }
.hv-nav__link {
  display: inline-flex; align-items: center; gap: 7px; height: 40px; padding: 0 14px;
  border: 1px solid transparent; border-radius: 999px; background: transparent;
  color: var(--hv-text-2); font-size: 13.5px; font-weight: 500; white-space: nowrap;
  transition: background-color 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
}
.hv-nav__link .hv-i, .hv-nav__link i { font-size: 17px; }
.hv-nav__link:hover { background: var(--hv-hover); color: var(--hv-text); }
.hv-nav__link.is-active { background: var(--hv-chip-bg); box-shadow: var(--hv-chip-shadow); color: var(--hv-text); font-weight: 600; }
.hv-nav__tools { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.hv-nav__auth { display: contents; }
/* 汉堡只在 ≤1023 出现；带上父级是为了压过后面同优先级的 .hv-round-btn{display:inline-flex} */
.hv-nav__tools .hv-burger { display: none; }

/* =============================================================================
   按钮
   ============================================================================= */
.hv-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 42px; padding: 0 18px; border: 1px solid transparent; border-radius: 999px;
  font-size: 13.5px; font-weight: 600; letter-spacing: -0.005em; line-height: 1; white-space: nowrap; text-decoration: none;
  transition: background-color 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease, color 0.16s ease, filter 0.16s ease, opacity 0.16s ease, transform 0.12s ease, translate 0.16s ease;
}
.hv-btn .hv-i, .hv-btn i { font-size: 17px; }
.hv-btn:disabled { opacity: 0.42; box-shadow: none !important; filter: none !important; translate: none !important; cursor: not-allowed; }
/* 墨：主按钮 */
.hv-btn-ink { color: var(--hv-cta-fg); background: var(--hv-cta); box-shadow: var(--hv-cta-shadow); }
.hv-btn-ink:hover, .hv-btn-ink:focus { color: var(--hv-cta-fg); }
.hv-btn-ink:active { box-shadow: var(--hv-cta-shadow-press); translate: none; }
/* 玻璃芯片：次级按钮 */
.hv-btn-chip { color: var(--hv-text); background: var(--hv-chip-bg); box-shadow: var(--hv-chip-shadow); }
.hv-btn-chip:hover, .hv-btn-chip:focus { color: var(--hv-text); }
.hv-btn-chip:active { filter: brightness(0.97); }
.hv-btn-sm { height: 32px; padding: 0 12px; font-size: 12.5px; }
.hv-btn-sm .hv-i { font-size: 15px; }
.hv-btn-lg { height: 48px; padding: 0 24px; font-size: 14.5px; }
.hv-btn-hero { height: 54px; padding: 0 28px; font-size: 15.5px; letter-spacing: 0.06em; gap: 10px; }
.hv-i-arrow { opacity: 0.7; transition: transform 0.3s ease, opacity 0.3s ease; }
.hv-btn-block { width: 100%; }
/* 圆形图标按钮（导航右侧） */
.hv-round-btn { width: 42px; height: 42px; padding: 0; border-radius: 50%; border: 1px solid var(--hv-glass-border);
  background: var(--hv-round-bg); box-shadow: inset 0 1px 0 var(--hv-glass-hi); color: var(--hv-text-2);
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  transition: background-color 0.16s ease, color 0.16s ease, transform 0.12s ease; }
.hv-round-btn .hv-i { font-size: 18px; }
.hv-round-btn:hover { background: var(--hv-round-bg-hover); color: var(--hv-text); }
.hv-round-btn:active { transform: scale(0.96); }
.hv-i-sun { display: none; }
:root[data-theme="dark"] .hv-i-sun { display: inline-block; }
:root[data-theme="dark"] .hv-i-moon { display: none; }
/* 语言 / 用户芯片 */
.hv-chip-btn { height: 42px; padding: 0 14px 0 12px; border: 1px solid var(--hv-glass-border); border-radius: 999px;
  background: var(--hv-round-bg); box-shadow: inset 0 1px 0 var(--hv-glass-hi); color: var(--hv-text-2);
  display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 600; white-space: nowrap;
  transition: background-color 0.16s ease, color 0.16s ease; }
.hv-chip-btn .hv-i { font-size: 17px; }
.hv-chip-btn:hover, .hv-chip-btn:focus { background: var(--hv-round-bg-hover); color: var(--hv-text); }
.hv-chip-btn .hv-i-chev { font-size: 14px; opacity: 0.7; }
.hv-avatar { width: 30px; height: 30px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 1px var(--hv-line); }
.hv-user-chip { padding-left: 6px; }
.hv-user-chip__meta { display: flex; flex-direction: column; align-items: flex-start; line-height: 1.15; max-width: 160px; }
.hv-user-chip__name { font-size: 12.5px; font-weight: 650; color: var(--hv-text); max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.hv-user-chip__sub { font-size: 11px; font-weight: 500; color: var(--hv-text-3); font-variant-numeric: tabular-nums; }
/* 悬停反馈分两层：颜色 / 阴影不算动效，「减少动态效果」的用户也要有；只有位移（上浮、箭头右移）才跟着 no-preference */
@media (hover: hover) {
  .hv-btn-ink:hover:not(:disabled):not(:active) { filter: brightness(var(--hv-cta-hover)); box-shadow: var(--hv-cta-shadow-hover); }
  .hv-btn-chip:hover:not(:disabled) { background: var(--hv-chip-bg-hover); box-shadow: var(--hv-chip-shadow-hover); }
  .hv-btn-hero:hover .hv-i-arrow { opacity: 1; }
}
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .hv-btn-ink:hover:not(:disabled):not(:active) { translate: 0 -1px; }
  .hv-btn-hero:hover .hv-i-arrow { transform: translateX(4px); }
}

/* =============================================================================
   状态药丸 / 标签 / 徽章（含官方 badge-soft）
   ============================================================================= */
.hv-pill, .badge-soft {
  display: inline-flex; align-items: center; gap: 6px; padding: 2px 9px 2px 8px; border: 0; border-radius: 999px;
  font-size: 11.5px; font-weight: 600; line-height: 1.55; white-space: nowrap;
  background: var(--hv-hover); color: var(--hv-text-2);
}
.hv-pill::before, .badge-soft::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: 0.9; }
.hv-pill--success, .badge-soft-success { background: var(--hv-success-soft); color: var(--hv-success); }
.hv-pill--info, .badge-soft-primary { background: var(--hv-info-soft); color: var(--hv-info); }
.badge-soft-danger { background: var(--hv-error-soft); color: var(--hv-error); }
.hv-pill--muted, .badge-soft-muted { background: transparent; box-shadow: inset 0 0 0 1px var(--hv-line); color: var(--hv-text-3); }
.hv-pill--muted::before, .badge-soft-muted::before { opacity: 0.5; }
.hv-pill--plain::before { display: none; }
/* 分享按钮是芯片，不是状态 */
.badge-soft-info.shared-button { background: var(--hv-chip-bg); box-shadow: var(--hv-chip-shadow); color: var(--hv-text-2); cursor: pointer; padding: 2px 10px; }
.badge-soft-info.shared-button::before { display: none; }
.badge-soft-info.shared-button .hv-i { font-size: 13px; }
.badge-soft-info.shared-button:hover { color: var(--hv-text); }
/* 后台自定义标签色（tags[].color） */
.hv-tag { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 600; line-height: 1.55; white-space: nowrap;
  background: rgba(var(--hv-tag-rgb), 0.12); color: rgb(var(--hv-tag-rgb)); }
.hv-tag--red { --hv-tag-rgb: 206, 44, 49; } .hv-tag--orange { --hv-tag-rgb: 204, 78, 0; } .hv-tag--green { --hv-tag-rgb: 24, 121, 78; } .hv-tag--cyan { --hv-tag-rgb: 0, 111, 137; }
.hv-tag--blue { --hv-tag-rgb: 13, 116, 206; } .hv-tag--purple { --hv-tag-rgb: 126, 66, 175; } .hv-tag--pink { --hv-tag-rgb: 194, 41, 138; } .hv-tag--gray { --hv-tag-rgb: 85, 88, 96; }
/* 深色标签字 = 标签色混 45% 白；不认 color-mix 的老内核退回中性浅字（兜底只能靠 @supports 分开，原因见 --hv-bg-rgb） */
:root[data-theme="dark"] .hv-tag { background: rgba(var(--hv-tag-rgb), 0.22); color: var(--hv-text-2); }
@supports (color: color-mix(in srgb, red 50%, #fff)) {
  :root[data-theme="dark"] .hv-tag { color: color-mix(in srgb, rgb(var(--hv-tag-rgb)) 55%, #fff); }
}

/* =============================================================================
   输入井（含官方 .form-control）
   ============================================================================= */
.hv-field { display: grid; gap: 6px; }
.hv-well {
  --_fill: var(--hv-well); --_edge: var(--hv-field-edge);
  display: flex; align-items: center; gap: 10px; width: 100%; min-height: var(--hv-field-h); margin: 0; padding: 0 12px; min-width: 0;
  border: 1px solid transparent; border-radius: var(--hv-field-radius);
  background: var(--_fill) padding-box, var(--_edge) border-box;
  box-shadow: var(--hv-field-shadow);
  transition: background 0.2s ease, box-shadow 0.2s ease; cursor: text;
}
.hv-well > .hv-i { font-size: 17px; color: var(--hv-text-3); flex: none; transition: color 0.2s ease; }
.hv-well > input, .hv-well > .form-control, .hv-well > textarea {
  flex: 1 1 auto; width: auto; min-width: 0; height: calc(var(--hv-field-h) - 2px); padding: 0; margin: 0;
  border: 0; border-radius: 0; background: transparent; box-shadow: none; outline: none;
  font-size: 14px; line-height: 1.4; color: var(--hv-text);
}
.hv-well > input:focus, .hv-well > .form-control:focus { background: transparent; border: 0; box-shadow: none; outline: none; color: var(--hv-text); }
.hv-well input::placeholder { color: var(--hv-text-3); opacity: 0.85; }
.hv-well input[type=number] { -moz-appearance: textfield; }
.hv-well input::-webkit-outer-spin-button, .hv-well input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.hv-well input[type=search]::-webkit-search-cancel-button { -webkit-appearance: none; }
.hv-well:focus-within { --_fill: var(--hv-field-fill-focus); --_edge: var(--hv-field-edge-focus); box-shadow: var(--hv-field-shadow-focus); }
.hv-well:focus-within > .hv-i { color: var(--hv-text); }
@media (hover: hover) { .hv-well:hover:not(:focus-within) { --_fill: var(--hv-field-fill-hover); } }
.hv-well--lg { --hv-field-h: 44px; --hv-field-radius: 13px; padding: 0 14px; }
.hv-well--lg > input, .hv-well--lg > .form-control { font-size: 14.5px; }
.hv-well .hv-btn { flex: none; }
/* 井外的官方输入（控件 / 下拉 / 文本域 / 查单密码框）：整个控件本身就是一口井 */
.hv-theme .hv-form .form-control:not(.hv-well *):not(.hv-seg *), .hv-theme .password-form .form-control:not(.hv-well *) {
  display: block; width: 100%; min-height: var(--hv-field-h); padding: 8px 12px; margin: 0;
  border: 1px solid transparent; border-radius: var(--hv-field-radius);
  background: var(--hv-well) padding-box, var(--hv-field-edge) border-box;
  box-shadow: var(--hv-field-shadow); color: var(--hv-text); font-size: 14px; line-height: 1.4;
  transition: background 0.2s ease, box-shadow 0.2s ease;
}
.hv-theme .hv-form .form-control:not(.hv-well *):not(.hv-seg *):focus, .hv-theme .password-form .form-control:not(.hv-well *):focus {
  outline: none; background: var(--hv-field-fill-focus) padding-box, var(--hv-field-edge-focus) border-box; box-shadow: var(--hv-field-shadow-focus); color: var(--hv-text);
}
.hv-theme .hv-form .form-control::placeholder, .hv-theme .password-form .form-control::placeholder { color: var(--hv-text-3); opacity: 0.85; }
/* 下拉 = 井 + 箭头：选择器必须带上与上面井规则同样的两个 :not()，否则优先级低一截，箭头与右内边距被整块盖掉 */
.hv-theme .hv-form select.form-control:not(.hv-well *):not(.hv-seg *) { appearance: none; -webkit-appearance: none; padding-right: 34px;
  background: var(--hv-select-arrow) right 11px center / 14px 14px no-repeat padding-box, var(--hv-well) padding-box, var(--hv-field-edge) border-box; }
.hv-theme .hv-form select.form-control:not(.hv-well *):not(.hv-seg *):focus {
  background: var(--hv-select-arrow) right 11px center / 14px 14px no-repeat padding-box, var(--hv-field-fill-focus) padding-box, var(--hv-field-edge-focus) border-box; }
/* 还停在空选项（「请选择…」）时按占位色显示，别像已经填好的值；展开的选项仍是正文色。
   同样带上两个 :not()，优先级才压得过上面井的 :focus 规则（否则一获得焦点就变回正文色） */
.hv-theme .hv-form select.form-control:not(.hv-well *):not(.hv-seg *):has(option[value='']:checked) { color: var(--hv-text-3); }
.hv-theme .hv-form select.form-control option { color: var(--hv-text); }
.hv-theme .hv-form textarea.form-control { min-height: 96px; line-height: 1.6; resize: vertical; }
.hv-theme .hv-form input[type=hidden] { display: none; }
/* 官方控件的单选 / 多选（form-check） */
.hv-theme .hv-form .form-check { display: inline-flex; align-items: center; gap: 8px; min-height: 0; margin: 0 14px 0 0; padding: 0; font-size: 13.5px; color: var(--hv-text-2); }
/* 与登录页 .hv-check 同一配方（井 → 选中变墨 / 深色变珠光）。整块画在 background-image 层上：
   _.css 有 input{background-color:transparent!important}，任何靠 background-color 的选中态都会被抹成透明 */
.hv-theme .hv-form .form-check-input { appearance: none; -webkit-appearance: none; float: none; flex: none; margin: 0; width: 17px; height: 17px; border: 0; border-radius: 32%; cursor: pointer;
  background: var(--hv-check-mark) center / 0 0 no-repeat, var(--hv-well);
  box-shadow: inset 0 1px 2px rgba(16, 20, 28, 0.16), inset 0 0 0 1px rgba(16, 20, 28, 0.1);
  transition: background-size 0.16s cubic-bezier(0.3, 1.4, 0.5, 1); }
.hv-theme .hv-form .form-check-input[type=radio] { border-radius: 50%; background: var(--hv-radio-dot) center / 0 0 no-repeat, var(--hv-well); }
.hv-theme .hv-form .form-check-input:checked { background: var(--hv-check-mark) center / 62% 62% no-repeat, var(--hv-check-on); box-shadow: var(--hv-check-on-shadow); }
.hv-theme .hv-form .form-check-input[type=radio]:checked { background: var(--hv-radio-dot) center / 100% 100% no-repeat, var(--hv-check-on); }
.hv-theme .hv-form .form-check-input:focus-visible { outline: 2px solid var(--hv-focus-ring); outline-offset: 2px; }
.hv-theme .hv-form .form-check-label { margin: 0; color: inherit; cursor: pointer; }
.hv-widgets { display: contents; }
.hv-widgets > div { display: grid; gap: 6px; }
/* 复选：刻进玻璃的小井，选中变墨 */
.hv-check { display: inline-flex; align-items: center; gap: 9px; margin: 0; font-size: 13px; color: var(--hv-text-2); cursor: pointer; user-select: none; }
.hv-check input { appearance: none; -webkit-appearance: none; width: 17px; height: 17px; margin: 0; border: 0; border-radius: 32%; cursor: pointer;
  background: var(--hv-check-mark) center / 0 0 no-repeat, var(--hv-well);
  box-shadow: inset 0 1px 2px rgba(16, 20, 28, 0.16), inset 0 0 0 1px rgba(16, 20, 28, 0.1);
  transition: background-size 0.16s cubic-bezier(0.3, 1.4, 0.5, 1); }
/* 深色未选中：井与深色面板几乎同色，控件的边界全靠 1px 亮环（对面板约 3:1）。环排在阴影列表最前，内阴影不再把上沿压暗；
   底下再铺一层极淡的亮色（铺满的内阴影——_.css 把 input 的 background-color 钉成透明），一眼看得出「这里有个框」 */
:root[data-theme="dark"] .hv-check input:not(:checked), :root[data-theme="dark"] .hv-theme .hv-form .form-check-input:not(:checked) { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.36), inset 0 1px 3px rgba(0, 0, 0, 0.45), inset 0 0 0 9px rgba(255, 255, 255, 0.04); }
.hv-check input:checked { background: var(--hv-check-mark) center / 62% 62% no-repeat, var(--hv-check-on); box-shadow: var(--hv-check-on-shadow); }
/* 眼睛 */
/* 36px 点击区（图标仍是 17px）；负右外边距把多出来的部分吃进井的内边距，图标位置几乎不动 */
.hv-eye { border: 0; background: transparent; color: var(--hv-text-3); display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; margin-right: -8px; padding: 0; border-radius: 10px; flex: none; }
.hv-eye:hover { color: var(--hv-text); background: var(--hv-hover); }
.hv-eye .hv-i { font-size: 17px; }
.hv-i-eye-off { display: none; }
.hv-eye[aria-pressed="true"] .hv-i-eye-on { display: none; }
.hv-eye[aria-pressed="true"] .hv-i-eye-off { display: inline-block; }
/* 分段：内凹胶囊里的圆芯片（购买数量步进器 = 官方 .qty-group）。
   只占内容宽度：.hv-field 是 grid，子项默认 stretch 满行，所以要 justify-self:start 把它收回来 */
.hv-theme .hv-seg { --_seg-btn: 34px; --_seg-num: 52px;
  display: inline-grid; grid-template-columns: var(--_seg-btn) var(--_seg-num) var(--_seg-btn); align-items: center; justify-self: start; gap: 0; width: auto; padding: 3px; border-radius: 999px; flex-wrap: nowrap;
  background: var(--hv-inset-bg); box-shadow: var(--hv-inset-shadow); transition: background 0.2s ease, box-shadow 0.2s ease; }
.hv-theme .hv-seg:focus-within { background: var(--hv-field-fill-focus); box-shadow: var(--hv-field-shadow-focus); }
.hv-theme .hv-seg > .hv-seg__btn { width: var(--_seg-btn); height: var(--_seg-btn); margin: 0; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--hv-text-2); display: inline-flex; align-items: center; justify-content: center; transition: background-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease; }
.hv-theme .hv-seg > .hv-seg__btn .hv-i { font-size: 15px; }
.hv-theme .hv-seg > .hv-seg__btn:hover { background: var(--hv-chip-bg); box-shadow: var(--hv-chip-shadow); color: var(--hv-text); }
.hv-theme .hv-seg > .form-control { flex: none; width: 100%; min-height: var(--_seg-btn); height: var(--_seg-btn); padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; text-align: center; font-size: 15px; font-weight: 650; font-variant-numeric: tabular-nums; color: var(--hv-text); }
.hv-theme .hv-seg > .form-control:focus { background: transparent; box-shadow: none; outline: none; }
.hv-theme .hv-seg > .form-control::-webkit-outer-spin-button, .hv-theme .hv-seg > .form-control::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.hv-theme .hv-seg > .form-control[type=number] { -moz-appearance: textfield; }
/* 图形验证码（井 + 官方 .captcha-img）。外层不能再挂 bootstrap .input-group：它会把井的右侧圆角削成直角。
   井占满整行、验证码图贴右，与上面「发送验证码」那一行同一条右边线 */
.hv-theme .hv-captcha { display: flex; flex-wrap: nowrap; align-items: center; gap: 8px; width: 100%; min-width: 0; }
.hv-theme .hv-captcha > .hv-well { flex: 1 1 auto; min-width: 0; }
.hv-theme .hv-captcha > .input-group-append { flex: none; display: inline-flex; }
/* 验证码图本身是透明底黑字，深色模式下也保持白底才读得清 */
.hv-theme .hv-captcha .captcha-img { height: var(--hv-field-h); width: auto; max-width: 132px; padding: 4px 6px; margin: 0; border: 0; border-radius: var(--hv-field-radius); cursor: pointer;
  background: #ffffff; box-shadow: var(--hv-chip-shadow); object-fit: contain; line-height: 1; }
.hv-theme .hv-captcha .captcha-img:hover { box-shadow: var(--hv-chip-shadow-hover); }
:root[data-theme="dark"] .hv-captcha .captcha-img { background: #f4f5f7; box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.12), 0 2px 6px rgba(0, 0, 0, 0.4); }
.hv-theme .hv-captcha .hv-well--lg + .input-group-append .captcha-img { height: 44px; border-radius: 13px; }
/* 发送验证码行 */
.hv-captcha-row { display: flex; gap: 8px; min-width: 0; }
.hv-captcha-row > .hv-well { flex: 1 1 auto; min-width: 0; }
.hv-captcha-row > .hv-btn { flex: none; height: 44px; padding: 0 16px; font-size: 13px; }
.hv-captcha-row > .hv-btn:disabled { opacity: 0.55; }

/* =============================================================================
   面板（内容层，不模糊）/ 井盘 / 菜单 / 抽屉 / 弹窗 / 提示
   ============================================================================= */
.hv-panel {
  position: relative; border: 1px solid transparent; border-radius: 22px;
  background: var(--hv-panel-bg) padding-box, var(--hv-rim) border-box;
  box-shadow: var(--hv-panel-shadow);
}
.hv-panel__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; padding: 20px 22px 16px; border-bottom: 1px solid var(--hv-line-soft); }
.hv-panel__head--plain { border-bottom: 0; padding-bottom: 6px; }
.hv-panel__body { padding: 18px 22px 22px; }
.hv-panel__body--tight { padding: 12px; }
.hv-head-copy { display: grid; gap: 4px; min-width: 0; }
.hv-head-copy .hv-title-22 { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.hv-count { font-size: 12.5px; font-weight: 500; color: var(--hv-text-3); letter-spacing: 0; font-variant-numeric: tabular-nums; }
.hv-inset { border-radius: 16px; padding: 14px 16px; background: var(--hv-inset-bg); box-shadow: var(--hv-inset-shadow); }
.hv-empty { padding: 38px 16px; text-align: center; color: var(--hv-text-3); font-size: 13px; }
.hv-tree-feedback { padding: 18px 12px; font-size: 13px; color: var(--hv-text-3); }

/* 菜单（浮层：真实模糊） */
.hv-menu { position: relative; }
.hv-menu__pop {
  position: absolute; right: 0; top: calc(100% + 8px); z-index: 70; min-width: 200px; padding: 5px;
  border: 1px solid transparent; border-radius: 16px;
  background: linear-gradient(var(--hv-pop-bg), var(--hv-pop-bg)) padding-box, var(--hv-rim) border-box;
  box-shadow: var(--hv-pop-shadow);
  -webkit-backdrop-filter: var(--hv-pop-blur); backdrop-filter: var(--hv-pop-blur);
  opacity: 0; transform: translateY(-4px) scale(0.98); pointer-events: none; transform-origin: top right;
  transition: opacity 0.16s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.16s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.hv-menu__pop--user { min-width: 220px; }
.hv-menu.is-open .hv-menu__pop { opacity: 1; transform: none; pointer-events: auto; }
.hv-menu__item { display: flex; align-items: center; gap: 10px; width: 100%; height: 36px; padding: 0 11px; border: 0; border-radius: 11px; font-size: 13px; font-weight: 500; color: var(--hv-text-2); text-decoration: none; background: transparent; text-align: left; white-space: nowrap; }
.hv-menu__item .hv-i { font-size: 16px; }
.hv-menu__item:hover { background: var(--hv-hover); color: var(--hv-text); }
.hv-menu__item.active { background: var(--hv-hover); color: var(--hv-text); font-weight: 650; }
.hv-menu__item.active::after { content: '\2713'; margin-left: auto; font-size: 12px; color: var(--hv-text-2); }
.hv-menu__item--danger { color: var(--hv-error); }
.hv-menu__item--danger:hover { background: var(--hv-error-soft); color: var(--hv-error); }
.hv-menu__sep { height: 1px; margin: 5px 6px; background: var(--hv-line-soft); }

/* 抽屉（≤1023：导航折叠进浮层） */
.hv-drawer-scrim { position: fixed; inset: 0; z-index: 80; background: var(--hv-backdrop); -webkit-backdrop-filter: blur(8px) saturate(120%); backdrop-filter: blur(8px) saturate(120%); opacity: 0; pointer-events: none; transition: opacity 0.25s ease; }
.hv-drawer {
  position: fixed; z-index: 81; top: calc(10px + env(safe-area-inset-top)); bottom: calc(10px + env(safe-area-inset-bottom)); left: 10px; width: min(300px, 86vw);
  display: flex; flex-direction: column; gap: 2px; padding: 14px 12px;
  border: 1px solid transparent; border-radius: 22px;
  background: linear-gradient(var(--hv-drawer-bg), var(--hv-drawer-bg)) padding-box, var(--hv-rim) border-box;
  box-shadow: var(--hv-dialog-shadow);
  -webkit-backdrop-filter: var(--hv-pop-blur); backdrop-filter: var(--hv-pop-blur);
  transform: translateX(calc(-100% - 24px)); visibility: hidden; overflow-y: auto;
  transition: transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1), visibility 0s linear 0.3s;
}
html.hv-drawer-open .hv-drawer { transform: none; visibility: visible; transition-delay: 0s; }
html.hv-drawer-open .hv-drawer-scrim { opacity: 1; pointer-events: auto; }
/* 矮屏（登录后项目多）让抽屉滚动，而不是把每一行从 40px 压扁 */
.hv-drawer > * { flex-shrink: 0; }
.hv-drawer__head { display: flex; align-items: center; justify-content: space-between; padding: 4px 4px 12px; }
.hv-drawer__group { padding: 12px 11px 6px; font-size: 11.5px; font-weight: 650; letter-spacing: 0.06em; color: var(--hv-text-3); }
.hv-drawer__link { display: flex; align-items: center; gap: 10px; width: 100%; height: 40px; padding: 0 12px; border: 0; border-radius: 11px; background: transparent; font: inherit; font-size: 14px; font-weight: 500; color: var(--hv-text-2); text-align: left; text-decoration: none; white-space: nowrap; }
.hv-drawer__link .hv-i, .hv-drawer__link i { font-size: 18px; }
.hv-drawer__link:hover { background: var(--hv-hover); color: var(--hv-text); }
/* 当前语言：与桌面语言菜单同款（浅底 + ✓） */
.hv-drawer__link.active { background: var(--hv-hover); color: var(--hv-text); font-weight: 650; }
.hv-drawer__link.active::after { content: '\2713'; margin-left: auto; font-size: 12px; color: var(--hv-text-2); }
.hv-drawer__link.is-active { background: var(--hv-cta); box-shadow: var(--hv-cta-shadow); color: var(--hv-nav-active-fg); }
.hv-drawer__link--danger { color: var(--hv-error); }
.hv-drawer__link--danger:hover { background: var(--hv-error-soft); color: var(--hv-error); }
/* 账号区的链接与上面导航同一节奏（行间 2px）；未登录时的两颗按钮之间仍留 8px */
.hv-drawer__foot { margin-top: auto; padding-top: 10px; border-top: 1px solid var(--hv-line); display: grid; gap: 2px; }
.hv-drawer__foot > .hv-btn + .hv-btn { margin-top: 6px; }
/* 手机上看不到顶栏的账号芯片：抽屉账号区顶部补一行「头像 + 用户名 + 余额」 */
.hv-drawer__me { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 4px 12px 10px; }
.hv-drawer__me .hv-avatar { width: 34px; height: 34px; flex: none; }
.hv-drawer__me .hv-user-chip__meta { max-width: none; min-width: 0; }
.hv-drawer__me .hv-user-chip__name { font-size: 14px; }
.hv-drawer__me .hv-user-chip__sub { font-size: 12px; }

/* 弹窗（公告） */
.hv-dialog-wrap { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; padding: 16px;
  background: var(--hv-backdrop); -webkit-backdrop-filter: blur(8px) saturate(120%); backdrop-filter: blur(8px) saturate(120%);
  opacity: 0; transition: opacity 0.2s ease; }
.hv-dialog-wrap[hidden] { display: none; }
.hv-dialog-wrap.is-open { opacity: 1; }
.hv-dialog {
  width: min(680px, 100%); max-height: min(86vh, 760px); display: flex; flex-direction: column;
  border: 1px solid transparent; border-radius: 24px;
  background: var(--hv-dialog-bg) padding-box, var(--hv-rim) border-box;
  box-shadow: var(--hv-dialog-shadow);
  transform: translateY(10px) scale(0.97); transition: transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.hv-dialog-wrap.is-open .hv-dialog { transform: none; }
.hv-dialog__head { display: flex; align-items: center; justify-content: space-between; padding: 20px 22px 14px; border-bottom: 1px solid var(--hv-line-soft); }
.hv-dialog__title { margin: 0; font-size: 16px; font-weight: 650; letter-spacing: -0.01em; display: flex; align-items: center; gap: 8px; }
.hv-dialog__title .hv-i { font-size: 18px; color: var(--hv-text-2); }
.hv-dialog__close { width: 32px; height: 32px; border: 0; border-radius: 10px; background: transparent; color: var(--hv-text-3); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.hv-dialog__close:hover { background: var(--hv-hover); color: var(--hv-text); }
.hv-dialog__close .hv-i { font-size: 18px; }
.hv-dialog__body { padding: 18px 22px; overflow: auto; }
.hv-dialog__foot { display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding: 12px 22px 18px; border-top: 1px solid var(--hv-line-soft); flex-wrap: wrap; }
.hv-dialog__tip { width: 100%; text-align: right; font-size: 12px; color: var(--hv-text-3); }

/* 灯箱 */
.hv-lightbox { position: fixed; inset: 0; z-index: 95; display: grid; place-items: center; padding: 24px; background: rgba(18, 22, 28, 0.92); opacity: 0; transition: opacity 0.22s ease; cursor: zoom-out; }
.hv-lightbox[hidden] { display: none; }
.hv-lightbox.is-open { opacity: 1; }
.hv-lightbox img { max-width: min(88vw, 1280px); max-height: min(82vh, 860px); border-radius: 22px; box-shadow: 0 40px 80px -30px rgba(0, 0, 0, 0.8); }

/* =============================================================================
   店面首页
   ============================================================================= */
.hv-shop { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 20px; align-items: start; }
.hv-side { position: sticky; top: 96px; }
.hv-side .hv-panel__head { padding: 18px 20px 12px; }
.hv-side__body { padding: 10px 10px 12px; max-height: calc(100vh - 220px); overflow-y: auto; }
/* 分类行 = api 侧栏导航行：40px 圆角 12，激活 = 墨色胶囊；子级按 --hv-depth 缩进 */
.hv-cat { display: flex; align-items: center; gap: 10px; width: 100%; height: 40px; margin: 0 0 2px; padding: 0 10px 0 calc(10px + var(--hv-depth, 0) * 16px);
  border: 1px solid transparent; border-radius: 12px; background: transparent; color: var(--hv-text-2);
  font-size: 13.5px; font-weight: 500; line-height: 1.3; text-align: left; white-space: nowrap;
  transition: background-color 0.16s ease, color 0.16s ease, box-shadow 0.16s ease; }
.hv-cat:hover { background: var(--hv-hover); color: var(--hv-text); }
.hv-cat.is-active { background: var(--hv-cta); box-shadow: var(--hv-cta-shadow); color: var(--hv-nav-active-fg); font-weight: 600; }
.hv-cat__icon { width: 24px; height: 24px; border-radius: 50%; flex: none; object-fit: cover; background: var(--hv-hover); box-shadow: 0 0 0 1px var(--hv-line-soft); }
.hv-cat__all { width: 24px; height: 24px; border-radius: 50%; flex: none; display: inline-flex; align-items: center; justify-content: center; background: var(--hv-well); box-shadow: var(--hv-well-shadow); color: var(--hv-text-2); }
.hv-cat__all .hv-i { font-size: 13px; }
.hv-cat.is-active .hv-cat__all { background: rgba(255, 255, 255, 0.14); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); color: inherit; }
:root[data-theme="dark"] .hv-cat.is-active .hv-cat__all { background: rgba(0, 0, 0, 0.1); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.12); }
.hv-cat__name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hv-cat__count { font-size: 11.5px; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--hv-text-3); min-width: 22px; height: 20px; padding: 0 7px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; background: var(--hv-hover); }
.hv-cat.is-active .hv-cat__count { background: rgba(255, 255, 255, 0.16); color: inherit; }
:root[data-theme="dark"] .hv-cat.is-active .hv-cat__count { background: rgba(0, 0, 0, 0.12); }
.hv-cat__toggle { width: 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--hv-hover); color: var(--hv-text-3); transition: transform 0.2s ease; }
.hv-cat__toggle .hv-i { font-size: 13px; }
.hv-cat__toggle.is-expanded { transform: rotate(90deg); }
.hv-cat-sep { height: 1px; margin: 6px 10px 10px; background: var(--hv-line-soft); }

.hv-catalog .hv-panel__head { padding: 18px 22px 14px; }
.hv-catalog__tools { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; min-width: 0; }
.hv-search { width: 340px; max-width: 100%; margin: 0; }
.hv-search__well { padding-right: 5px; }
.hv-search__well .hv-btn { height: 30px; padding: 0 12px; }
.hv-quickcats { display: none; }

/* 商品列表：表格材质容器 + 网格行（手机变卡片） */
.hv-plist { position: relative; border-radius: 16px; background: var(--hv-table-bg); box-shadow: var(--hv-table-shadow); overflow: hidden; min-height: var(--hv-table-stable-height, 0); }
.hv-plist__head, .hv-prow { display: grid; grid-template-columns: minmax(0, 1fr) 132px 84px 104px; align-items: center; gap: 12px; }
.hv-plist--sold .hv-plist__head, .hv-plist--sold .hv-prow { grid-template-columns: minmax(0, 1fr) 132px 84px 72px 104px; }
.hv-plist__head { padding: 9px 16px; background: var(--hv-th-bg); border-bottom: 1px solid var(--hv-line); font-size: 12px; font-weight: 600; color: var(--hv-text-3); }
.hv-plist__head > span:not(:first-child), .hv-prow__price, .hv-prow__stock, .hv-prow__sold { text-align: right; }
.hv-prow { padding: 11px 16px; border-bottom: 1px solid var(--hv-line-soft); transition: background-color 0.12s ease; }
.hv-prow:last-child { border-bottom: 0; }
@media (hover: hover) { .hv-prow:hover { background: var(--hv-row-hover); } }
.hv-prow__main { display: flex; align-items: center; gap: 12px; min-width: 0; color: inherit; text-decoration: none; }
.hv-prow__main:hover { color: inherit; }
.hv-prow__thumb { width: 46px; height: 46px; border-radius: 12px; object-fit: cover; flex: none; background: var(--hv-hover); box-shadow: 0 0 0 1px var(--hv-thumb-ring); }
.hv-prow__copy { display: grid; gap: 5px; min-width: 0; }
.hv-prow__name { font-size: 14px; font-weight: 650; letter-spacing: -0.005em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hv-prow__tags { display: flex; flex-wrap: wrap; gap: 5px; }
.hv-prow__price { display: grid; gap: 3px; justify-items: end; }
.hv-amt { font-size: 15px; font-weight: 650; letter-spacing: -0.01em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.hv-amt small { font-size: 11px; font-weight: 600; color: var(--hv-text-3); margin-right: 1px; }
.hv-member { font-size: 11.5px; font-weight: 500; color: var(--hv-text-3); font-variant-numeric: tabular-nums; white-space: nowrap; }
.hv-prow__stock, .hv-prow__sold { font-size: 13px; color: var(--hv-text-2); font-variant-numeric: tabular-nums; }
.hv-prow__action { display: flex; justify-content: flex-end; }
.hv-prow__foot { display: none; }
.hv-prow.is-soldout .hv-prow__thumb { opacity: 0.55; filter: grayscale(1); }
.hv-prow.is-soldout .hv-prow__name { color: var(--hv-text-3); }
.hv-prow.is-soldout .hv-prow__main { cursor: default; }
/* 加载遮罩：钉住高度 + 淡出内容 */
.hv-table-loading { position: absolute; inset: 0; z-index: 2; display: none; align-items: center; justify-content: center; gap: 10px; font-size: 13px; color: var(--hv-text-2);
  background: rgba(var(--hv-bg-rgb), 0.55); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.hv-table-wrap.is-loading .hv-table-loading { display: flex; }
/* 首屏骨架（商品行 / 分类行）：与横滑分类胶囊的骨架同一语言 —— --hv-hover-strong 呼吸块；缩略图 / 分类图标用自身的底色一起呼吸 */
.hv-skel { display: block; height: 12px; border-radius: 999px; background: var(--hv-hover-strong); animation: hv-breathe 1.4s ease-in-out infinite; }
.hv-skel--name { width: min(56%, 260px); height: 14px; }
.hv-skel--tag { width: 64px; height: 18px; }
.hv-skel--num { width: 48px; }
.hv-skel--btn { width: 72px; height: 32px; }
.hv-prow--skel, .hv-cat--skel { pointer-events: none; }
.hv-prow--skel .hv-prow__copy { flex: 1 1 auto; }
.hv-prow--skel .hv-prow__thumb, .hv-cat--skel .hv-cat__icon { animation: hv-breathe 1.4s ease-in-out infinite; }
.hv-prow--skel:nth-child(3n+2) .hv-skel--name { width: min(40%, 190px); }
.hv-prow--skel:nth-child(3n) .hv-skel--name { width: min(68%, 320px); }
.hv-prow--skel .hv-prow__stock .hv-skel, .hv-prow--skel .hv-prow__sold .hv-skel { margin-left: auto; }
.hv-cat--skel .hv-skel--name { width: auto; flex: 0 1 62%; }
.hv-cat--skel:nth-child(2n) .hv-skel--name { flex-basis: 44%; }
.hv-table-wrap.is-loading .item-list, .hv-table-wrap.is-loading .hv-plist__head { opacity: 0.32; pointer-events: none; }
/* 大屏加大一号（手机端卡片 ≤767 保持原尺寸，不走这里）：
   分类行 40→46px / 15px 字 / 28px 图标（侧栏只在 ≥1024 出现）；
   商品行只加大半号（店主看过 56px / 15.5px 那版觉得偏大）：缩略图 46→52、名称 14→15px、价格 15→16px、购买按钮 32→34px */
@media (min-width: 1024px) {
  .hv-side__body { padding: 12px 12px 14px; }
  .hv-cat { height: 46px; gap: 12px; margin-bottom: 3px; padding: 0 12px 0 calc(12px + var(--hv-depth, 0) * 18px); border-radius: 13px; font-size: 15px; }
  .hv-cat__icon, .hv-cat__all { width: 28px; height: 28px; }
  .hv-cat__all .hv-i { font-size: 14.5px; }
  .hv-cat__count { min-width: 24px; height: 22px; padding: 0 8px; font-size: 12px; }
  .hv-cat__toggle { width: 26px; height: 26px; }
  .hv-cat-sep { margin: 8px 12px 12px; }
}
@media (min-width: 768px) {
  .hv-plist__head, .hv-prow { grid-template-columns: minmax(0, 1fr) 136px 88px 108px; gap: 13px; }
  .hv-plist--sold .hv-plist__head, .hv-plist--sold .hv-prow { grid-template-columns: minmax(0, 1fr) 136px 88px 76px 108px; }
  .hv-plist__head { padding: 10px 18px; font-size: 12.5px; }
  .hv-prow { padding: 12px 18px; }
  .hv-prow__main { gap: 13px; }
  .hv-prow__thumb { width: 52px; height: 52px; border-radius: 13px; }
  .hv-prow__copy { gap: 6px; }
  .hv-prow__name { font-size: 15px; }
  .hv-prow__price .hv-amt { font-size: 16px; }
  .hv-prow__price .hv-amt small { font-size: 11.5px; }
  .hv-prow__stock, .hv-prow__sold { font-size: 13.5px; }
  .hv-prow__action .hv-btn-sm { height: 34px; padding: 0 14px; font-size: 12.5px; }
}

/* =============================================================================
   商品页
   ============================================================================= */
.hv-item { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 24px; padding: 22px; align-items: start; }
.hv-item > * { min-width: 0; }
.hv-cover { position: sticky; top: 96px; border-radius: 18px; overflow: hidden; background: var(--hv-inset-bg); box-shadow: var(--hv-inset-shadow); aspect-ratio: 4 / 3; }
.hv-cover__trigger { display: block; width: 100%; height: 100%; padding: 0; border: 0; background: transparent; cursor: zoom-in; }
.hv-cover__trigger:focus-visible { outline-offset: -3px; }
.hv-cover .item-cover { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1); }
.hv-cover:hover .item-cover { transform: scale(1.02); }
/* 叠在商品图上的芯片不跟主题走（底下是照片不是玻璃面）：两种主题都用固定的深色半透明底 + 白字 */
.hv-cover__zoom { position: absolute; right: 14px; bottom: 14px; pointer-events: none; }
.hv-cover__zoom.hv-btn-chip { background: rgba(16, 18, 22, 0.56); color: #ffffff; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.16), 0 2px 8px rgba(0, 0, 0, 0.25);
  -webkit-backdrop-filter: blur(12px) saturate(140%); backdrop-filter: blur(12px) saturate(140%); }
.hv-buy { display: grid; gap: 16px; align-content: start; }
.hv-buy__head { display: grid; gap: 6px; }
.hv-buy__title { margin: 0; font-size: 25px; font-weight: 700; line-height: 1.2; letter-spacing: -0.022em; }
.hv-buy__badges { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
/* 价格：官方 item.js 填入 <span class="unit">¥</span>129 */
.hv-price .price { display: flex; align-items: baseline; gap: 4px; min-height: 42px; font-size: 40px; font-weight: 700; line-height: 1; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.hv-price .price .unit { font-size: 18px; font-weight: 600; color: var(--hv-text-2); letter-spacing: 0; }
.hv-price .price .icon-spin { font-size: 16px; color: var(--hv-text-3); }
.hv-theme .hv-form { display: grid; gap: 16px; }
.hv-theme .hv-form.vstack { flex-direction: column; }
/* 宝贝类型 / SKU 药丸（官方 .sku-list .sku .badge-money） */
.sku-list { display: flex; flex-wrap: wrap; gap: 14px 8px; padding-top: 8px; overflow: visible; isolation: isolate; }
.sku { position: relative; display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 14px; border-radius: 999px;
  background: var(--hv-chip-bg); box-shadow: var(--hv-chip-shadow); color: var(--hv-text-2); font-size: 13px; font-weight: 600; text-decoration: none; white-space: nowrap;
  transition: background 0.16s ease, box-shadow 0.16s ease, color 0.16s ease; }
.sku:hover { color: var(--hv-text); background: var(--hv-chip-bg-hover); box-shadow: var(--hv-chip-shadow-hover); }
.sku.is-primary { background: var(--hv-cta); box-shadow: var(--hv-cta-shadow); color: var(--hv-cta-fg); }
.sku.is-primary:hover { color: var(--hv-cta-fg); }
.badge-money { position: absolute; top: -12px; right: -8px; z-index: 5; display: inline-flex; align-items: center; min-height: 20px; padding: 0 8px; border-radius: 999px;
  background: var(--hv-chip-bg-hover); box-shadow: var(--hv-chip-shadow); color: var(--hv-text); font-size: 10.5px; font-weight: 700; line-height: 1; white-space: nowrap; pointer-events: none; font-variant-numeric: tabular-nums; }
.sku.is-primary .badge-money { color: var(--hv-text); }
/* 深色的芯片底是半透明白，价签浮在珠光选中药丸上时会和它混成一片白：换成不透明的深色底 */
:root[data-theme="dark"] .badge-money { background: linear-gradient(180deg, #30343c, #23262d); box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.12), 0 2px 6px rgba(0, 0, 0, 0.45); color: #f2f3f5; }
/* 自选账号按钮 */
.hv-theme .optional-card { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 40px; padding: 0 14px; border: 0; border-radius: 12px;
  background: var(--hv-chip-bg); box-shadow: var(--hv-chip-shadow); color: var(--hv-text); font-size: 13.5px; font-weight: 600; }
.hv-theme .optional-card:hover { background: var(--hv-chip-bg-hover); box-shadow: var(--hv-chip-shadow-hover); }
.hv-theme .optional-card .text-primary { color: var(--hv-link) !important; }
/* 批发表（官方注入在数量后面） */
.hv-theme .wholesale-table { width: 100%; margin: 0; border-collapse: separate; border-spacing: 0; border-radius: 14px; overflow: hidden; background: var(--hv-inset-bg); box-shadow: var(--hv-inset-shadow); color: var(--hv-text); font-size: 13px; }
.hv-theme .wholesale-table th, .hv-theme .wholesale-table td { padding: 9px 14px; border: 0; border-bottom: 1px solid var(--hv-line-soft); background: transparent; color: inherit; }
.hv-theme .wholesale-table th { font-size: 12px; font-weight: 600; color: var(--hv-text-3); }
.hv-theme .wholesale-table tr:last-child td { border-bottom: 0; }
/* 付款区（官方 .cash-pay） */
.hv-theme .cash-pay { display: grid; gap: 14px; padding-top: 4px; }
.hv-login-required { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 16px; border-radius: 16px; background: var(--hv-inset-bg); box-shadow: var(--hv-inset-shadow); }
.hv-login-required__copy { display: grid; gap: 4px; min-width: 0; }
.hv-login-required__copy strong { font-size: 13.5px; font-weight: 650; }
.hv-login-required__copy span { font-size: 12.5px; color: var(--hv-text-2); line-height: 1.5; }
/* 支付方式瓦片（官方 .pay-list .pay，选中态由 Item.js 维护） */
.hv-theme .pay-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
/* 2 / 4 个支付方式（登录后多出「余额」就是 4 个）按 3 列会排成 2+空位 / 3+1：改成两列，排满不留空格。
   手机上本来就是两列（≤379 单列），不再覆盖 */
@media (min-width: 768px) {
  .hv-theme .pay-list:has(> .pay:last-child:is(:nth-child(2), :nth-child(4))) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.hv-theme .pay-list .pay { position: relative; display: flex; align-items: center; gap: 10px; height: 48px; padding: 0 40px 0 12px; border: 1px solid transparent; border-radius: 14px; cursor: pointer; text-decoration: none; overflow: hidden;
  background: var(--hv-chip-bg) padding-box, linear-gradient(rgba(16, 20, 28, 0.075), rgba(16, 20, 28, 0.075)) border-box; box-shadow: 0 1px 2px rgba(16, 20, 28, 0.06);
  font-size: 13px; font-weight: 600; color: var(--hv-text-2); transition: box-shadow 0.16s ease, color 0.16s ease, background 0.16s ease; }
:root[data-theme="dark"] .pay-list .pay { background: var(--hv-chip-bg) padding-box, linear-gradient(rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.08)) border-box; }
.hv-theme .pay-list .pay:hover { color: var(--hv-text); }
/* 悬停与 SKU 药丸同一反馈：底色提亮 + 边线加深 + 阴影 */
@media (hover: hover) {
  .hv-theme .pay-list .pay:not(.is-on):hover { background: var(--hv-chip-bg-hover) padding-box, linear-gradient(rgba(16, 20, 28, 0.14), rgba(16, 20, 28, 0.14)) border-box; box-shadow: var(--hv-chip-shadow-hover); }
  :root[data-theme="dark"] .hv-theme .pay-list .pay:not(.is-on):hover { background: var(--hv-chip-bg-hover) padding-box, linear-gradient(rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.16)) border-box; }
}
.hv-theme .pay-list .pay img { width: 24px; height: 24px; border-radius: 50%; object-fit: contain; flex: none; }
.hv-theme .pay-list .pay span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hv-theme .pay-list .pay::after { content: ''; position: absolute; right: 12px; top: 50%; width: 16px; height: 16px; margin-top: -8px; border-radius: 50%;
  background: var(--hv-well); box-shadow: var(--hv-well-shadow); transition: background 0.16s ease, box-shadow 0.16s ease; }
.hv-theme .pay-list .pay.is-on { color: var(--hv-text); background: var(--hv-chip-bg-hover) padding-box, var(--hv-field-edge-focus) border-box; box-shadow: var(--hv-chip-shadow-hover); }
/* 深色的芯片底半透明，边线那层斜向白渐变会透满整块瓦片（金属高光带）：垫一层不透明底，渐变只留在 1px 边上。
   垫底要比面板亮（面板在这里约 rgb(60,62,65)）：选中必须是最亮的状态（选中 > 悬停 > 静止），垫暗了悬停的邻居反而更像被选中 */
:root[data-theme="dark"] .hv-theme .pay-list .pay.is-on { background: var(--hv-chip-bg-hover) padding-box, linear-gradient(#4f5259, #4f5259) padding-box, var(--hv-field-edge-focus) border-box; }
.hv-theme .pay-list .pay.is-on::after { background: var(--hv-check-mark) center / 62% 62% no-repeat, var(--hv-cta); box-shadow: var(--hv-cta-shadow); }
.hv-trust { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 12px; color: var(--hv-text-3); }
.hv-trust span { display: inline-flex; align-items: center; gap: 5px; }
.hv-trust .hv-i { font-size: 14px; }
.hv-details { margin-top: 20px; }

/* 富文本（宝贝详情 / 公告 = .hv-desc；官方脚本插入的发货留言 = 查单页 .order-item .mt-3、购买成功弹窗 .acg-secret__note-body）：
   layui 重置把 p/ul/li 的边距归零、去掉了列表点，这里按阅读排版补回来。
   官方容器直接写进选择器（包在 :where() 里，优先级与 .hv-desc 一样），插进页面的第一帧就是这套排版：
   运行时再补类名的话，layer 已经按未排版的内容定好高度并居中，排版一变弹窗就偏、滚动区高度也不对。
   字号全部用 em 跟随容器：公告 / 发货留言 14px，宝贝详情放大到 16px（手机 15px），标题 / 代码 / 表格按比例一起变。
   容器本身那条要压过 treasure.js 运行时注入的 .acg-secret__note-body{font-size:13px}（注入在本表之后），所以带 .hv-theme */
.hv-desc, .hv-theme .acg-secret__note-body, .hv-theme .order-item .mt-3 { font-size: 14px; line-height: 1.8; color: var(--hv-text-2); overflow-wrap: anywhere; }
.hv-desc--item { font-size: 16px; line-height: 1.8; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) > :first-child { margin-top: 0; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) > :last-child { margin-bottom: 0; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) p { margin: 0 0 0.9em; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) :is(strong, b) { color: var(--hv-text); font-weight: 650; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) em { font-style: italic; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) del { color: var(--hv-text-3); }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) :is(ul, ol) { margin: 0 0 0.9em; padding-left: 1.6em; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) ul { list-style: disc; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) ol { list-style: decimal; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) ul ul { list-style: circle; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) ul ul ul { list-style: square; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) li { margin: 0.3em 0; list-style: inherit; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) li > p { margin-bottom: 0.3em; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) li > :is(ul, ol) { margin: 0.3em 0 0; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) li.task-list-item { list-style: none; margin-left: -1.4em; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) li.task-list-item input { margin-right: 6px; accent-color: var(--hv-text); }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) a { color: var(--hv-link); font-weight: 600; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) a:hover { color: var(--hv-link); text-decoration: underline; text-underline-offset: 3px; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) :is(h1, h2, h3, h4, h5, h6) { color: var(--hv-text); line-height: 1.35; margin: 1.1em 0 0.5em; font-weight: 700; letter-spacing: -0.01em; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) h1 { font-size: 1.45em; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) h2 { font-size: 1.25em; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) h3 { font-size: 1.1em; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) :is(h4, h5, h6) { font-size: 1em; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) code { font-family: var(--hv-mono); font-size: 0.86em; padding: 0.12em 0.42em; border-radius: 6px; background: var(--hv-code-bg); color: var(--hv-code-fg); }
/* 标题里的代码 = 作者拿来做「高亮标题」（后台编辑器预览里它是标题字号的胶囊）：跟随标题的字号、字重与字体，只保留底色。
   手机上会折行：clone 让每一行各带完整的内边距与圆角（默认 slice 会把断口切成两截没有边的碎片），keep-all 不把「质保」这类词拆开 */
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) :is(h1, h2, h3, h4, h5, h6) code { font-family: inherit; font-size: 0.94em; font-weight: inherit; padding: 0.14em 0.5em; border-radius: 0.42em; color: inherit;
  -webkit-box-decoration-break: clone; box-decoration-break: clone; word-break: keep-all; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) pre { margin: 0 0 0.9em; padding: 12px 14px; border-radius: 12px; background: var(--hv-code-bg); overflow: auto; }
/* 代码块里的 code 跟随 pre 的字号（bootstrap 的 pre 已是 .875em，再乘 .86em 会小到 10–12px） */
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) pre code { padding: 0; background: transparent; font-size: inherit; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) blockquote { margin: 0 0 0.9em; padding: 10px 14px; border-radius: 12px; background: var(--hv-hover); border-left: 3px solid var(--hv-line-strong); }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) blockquote > :last-child { margin-bottom: 0; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) img { max-width: 100%; height: auto; border-radius: 12px; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) hr { border: 0; height: 1px; background: var(--hv-line); margin: 1.1em 0; }
/* 表格铺满正文宽度（display:block 的表格内框会缩成内容宽，表头线和斑马纹停在半路）；手机上才改成可横滑的块 */
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) table { display: table; width: 100%; max-width: 100%; border-collapse: collapse; font-size: 0.92em; margin: 0 0 0.9em; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) :is(th, td) { padding: 0.55em 0.8em; border-bottom: 1px solid var(--hv-line-soft); text-align: left; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) th { color: var(--hv-text); font-weight: 650; }
:is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) tr:nth-child(2n) td { background: var(--hv-hover); }
/* 铺得下就铺满、放不下只在表内横滑：外框改成可横滑的块，块里的表格网格由一枚空 caption 撑到正文宽——表格不窄于 caption 的最小宽度，
   caption 宽 100cqi = 表格自身的内容宽，所以放得下的表铺满（表头线、斑马纹到头），放不下的按内容宽横滑，不撑破正文。
   单元格按词断行：继承来的 anywhere 会把每格的最小宽度压成一个字符，自动布局就把价格、时长这类短列挤成「¥1 / 9.9」；
   break-word 不降低最小宽度，短值保持整词、长句列照常换行；表头按词不拆（keep-all：「价格（人民币）」可在括号处换行，
   不会因为整行不折而把最后一个字切在滚动边上）。不认容器单位的老内核维持上面的整宽表格 */
@supports (width: 1cqi) {
  :is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) table { display: block; overflow-x: auto; container-type: inline-size; }
  :is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) table::before { content: ""; display: table-caption; width: 100cqi; height: 0; }
  :is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) :is(th, td) { overflow-wrap: break-word; }
  :is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) th { word-break: keep-all; }
}

/* =============================================================================
   订单查询
   ============================================================================= */
.hv-query-hero { padding: 18px 0 22px; display: grid; gap: 10px; }
.hv-query-hero p { margin: 0; color: var(--hv-text-2); font-size: 14.5px; }
/* 英雄输入井：radius 18，聚焦时墨线顺时针"画"出来（conic mask） */
@property --hv-sweep { syntax: '<number>'; inherits: false; initial-value: 0; }
.hv-hero-well { --hv-field-h: 56px; --hv-field-radius: 18px; position: relative; padding: 0 8px 0 16px; gap: 12px; isolation: isolate; }
.hv-hero-well > input, .hv-hero-well > .form-control { font-size: 16px; }
.hv-hero-well > .hv-i { font-size: 20px; }
.hv-hero-well .hv-btn { height: 40px; }
.hv-hero-well::after { --hv-sweep: 0; content: ''; position: absolute; inset: -1px; padding: 1px; border-radius: inherit; pointer-events: none;
  background: var(--hv-field-edge-focus);
  -webkit-mask: conic-gradient(from 268deg, #000 calc(var(--hv-sweep) * 1%), transparent calc(var(--hv-sweep) * 1%)), linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: source-in, xor;
  mask: conic-gradient(from 268deg, #000 calc(var(--hv-sweep) * 1%), transparent calc(var(--hv-sweep) * 1%)), linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: intersect, exclude;
  opacity: 0; transition: opacity 0.25s ease, --hv-sweep 0s linear 0.25s; }
.hv-hero-well:focus-within::after { --hv-sweep: 100; opacity: 1; transition: opacity 0.12s ease, --hv-sweep 0.7s cubic-bezier(0.35, 0.1, 0.2, 1); }
.hv-hero-well:focus-within { --_edge: var(--hv-field-edge); }
.hv-results-label { margin: 24px 0 10px; }
.hv-query-help { margin-top: 22px; display: grid; gap: 6px; }
.hv-query-help strong { font-size: 13px; font-weight: 650; }
.hv-empty-state { margin-top: 22px; padding: 38px 20px; display: grid; justify-items: center; gap: 8px; text-align: center; }
.hv-empty-state > .hv-i { width: 56px; height: 56px; padding: 14px; border-radius: 50%; background: var(--hv-well); box-shadow: var(--hv-well-shadow); color: var(--hv-text-3); margin-bottom: 4px; }
.hv-empty-state > .hv-spinner { width: 22px; height: 22px; margin-bottom: 8px; }
.hv-empty-state h3 { font-size: 15px; font-weight: 650; letter-spacing: -0.01em; }
.hv-empty-state p { font-size: 13px; line-height: 1.65; color: var(--hv-text-2); max-width: 420px; }
/* 订单卡（官方 query.js 生成） */
.hv-theme .order-list { display: grid; gap: 14px; }
.hv-theme .order-item { padding: 16px 18px; display: grid; gap: 14px; border-radius: 16px; background: var(--hv-list-bg); box-shadow: var(--hv-list-shadow); }
.hv-theme .order-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.hv-theme .order-left { display: grid; gap: 8px; flex: 1 1 200px; min-width: 0; }
.hv-theme .order-basic { display: grid; gap: 4px; font-size: 12.5px; color: var(--hv-text-2); }
.hv-theme .order-no { font-family: var(--hv-mono); font-size: 13px; color: var(--hv-text); letter-spacing: 0.03em; }
.hv-theme .status-badge { display: inline-flex; align-items: center; gap: 6px; padding: 2px 9px 2px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 600; line-height: 1.55; background: var(--hv-warning-soft); color: var(--hv-warning); }
.hv-theme .status-badge i { font-size: 12px; }
.hv-theme .status-badge.status-paid, .hv-theme .status-badge.status-shipped { background: var(--hv-success-soft); color: var(--hv-success); }
.hv-theme .order-right { flex: none; }
.hv-theme .order-amount { display: grid; justify-items: end; gap: 2px; text-align: right; }
.hv-theme .amount-label { font-size: 11.5px; color: var(--hv-text-3); }
.hv-theme .amount-value { font-size: 21px; font-weight: 650; letter-spacing: -0.01em; font-variant-numeric: tabular-nums; }
/* inline-flex 的基线取自首个子项（16px 图标的底边），整段值会比「支付方式：」高出几像素；改为居中对齐 */
.hv-theme .payment-method { display: inline-flex; align-items: center; gap: 5px; vertical-align: middle; }
.hv-theme .payment-icon { width: 16px; height: 16px; border-radius: 50%; object-fit: contain; }
.hv-theme .goods-section { display: flex; align-items: center; gap: 12px; padding-top: 12px; border-top: 1px solid var(--hv-line-soft); }
.hv-theme .goods-thumb { flex: none; }
.hv-theme .goods-image { width: 48px; height: 48px; border-radius: 12px; object-fit: cover; box-shadow: 0 0 0 1px var(--hv-thumb-ring); }
.hv-theme .goods-details { display: grid; gap: 6px; min-width: 0; }
.hv-theme .goods-name { margin: 0; font-size: 14px; font-weight: 650; }
.hv-theme .goods-meta { display: flex; flex-wrap: wrap; gap: 5px; }
.hv-theme .a-badge, .hv-theme .shipment-badge { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 600; line-height: 1.55; background: var(--hv-hover); color: var(--hv-text-2); }
.hv-theme .a-badge-success, .hv-theme .shipment-paid { background: var(--hv-success-soft); color: var(--hv-success); }
.hv-theme .a-badge-primary { background: var(--hv-info-soft); color: var(--hv-info); }
.hv-theme .a-badge-warning, .hv-theme .shipment-waiting { background: var(--hv-warning-soft); color: var(--hv-warning); }
.hv-theme .card-section { display: grid; gap: 10px; padding-top: 12px; border-top: 1px solid var(--hv-line-soft); }
.hv-theme .card-section .card-header { padding: 0; border: 0; background: transparent; }
.hv-theme .shipment-content { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-size: 13px !important; font-weight: 650; }
.hv-theme .shipment-title i { margin-right: 6px; color: var(--hv-text-2); }
.hv-theme .password-form .input-group { display: flex; flex-wrap: nowrap; align-items: center; gap: 8px; width: 100%; }
.hv-theme .password-form .form-control { flex: 1 1 auto; width: auto; min-width: 0; }
/* 官方标记套着 bootstrap .input-group：它按「首 / 末子项」削掉相邻两侧的圆角并把按钮左移 1px 拼接。
   这里两者之间有 8px 间隔、各自完整，得用 !important 压过它那串多重 :not() 选择器 */
.hv-theme .password-form .input-group > .form-control { border-radius: var(--hv-field-radius) !important; }
.hv-theme .password-form .input-group > .view-card-btn { border-radius: 999px !important; margin-left: 0 !important; }
.hv-theme .password-form .view-card-btn { flex: none; display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 40px; padding: 0 14px; border: 1px solid transparent; border-radius: 999px;
  background: var(--hv-chip-bg); box-shadow: var(--hv-chip-shadow); color: var(--hv-text); font-size: 13px; font-weight: 600; }
.hv-theme .password-form .view-card-btn:hover, .hv-theme .password-form .view-card-btn:focus { background: var(--hv-chip-bg-hover); box-shadow: var(--hv-chip-shadow-hover); color: var(--hv-text); }
.hv-theme .password-form .view-card-btn i { margin: 0 !important; font-size: 14px; }
.hv-theme .card-loading { font-size: 13px; color: var(--hv-text-3); }
.hv-theme .card-loading .loading-content { display: inline-flex; align-items: center; gap: 8px; }
/* 卡密：控制台材质（两种主题都是深色） */
.hv-theme .card-display { padding: 14px 16px; border-radius: 16px; background: var(--hv-console-bg); box-shadow: var(--hv-console-shadow); color: var(--hv-console-fg);
  font-family: var(--hv-mono); font-size: 12.5px; line-height: 1.65; white-space: pre-wrap; word-break: break-all; font-variant-ligatures: none; user-select: text; }
/* 发货留言：排版与宝贝详情 / 公告同一套（见上面富文本，14px 基准）；这里只收掉官方 .mt-3 的外边距 */
.hv-theme .order-item .mt-3 { margin-top: 0 !important; }
/* 卡密复制（Header.js 注入在控制台块下方） */
.hv-secret-actions { display: flex; justify-content: flex-end; margin-top: 8px; }
/* 查不到订单时，结果卡已经给出同一句提示，下面的帮助块先收起（官方 query.js 用行内 display 切换 .no-results） */
.no-results:not([style*="none"]) ~ .hv-query-help { display: none; }

/* =============================================================================
   登录 / 注册 / 找回（晶：主卡片 + 光晕）
   ============================================================================= */
.hv-auth-body { display: block; }
.hv-auth-stage { position: relative; min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto 1fr auto; align-items: center; justify-items: center; gap: 22px; padding: 26px 16px 32px; }
.hv-auth-theme { position: absolute; top: 18px; right: 18px; }
.hv-auth-brand { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.hv-auth-col { position: relative; width: min(448px, 100%); max-width: 100%; min-width: 0; display: grid; gap: 18px; align-self: start; }
.hv-auth-col::before { content: ''; position: absolute; inset: -44px -48px 8px; z-index: -1; background: var(--hv-card-aura); filter: blur(30px); pointer-events: none; }
/* 高屏（平板竖屏 / 桌面）把卡片放到视觉中心略偏上，不再顶在上方、下面空一大片；手机仍贴顶，给软键盘留位置 */
@media (min-width: 768px) and (min-height: 760px) {
  .hv-auth-col { align-self: center; margin-top: -6vh; }
}
.hv-auth-card {
  position: relative; isolation: isolate; overflow: clip; min-width: 0; padding: 34px 34px 28px; border: 1px solid transparent; border-radius: 32px;
  background: var(--hv-card-face) padding-box, var(--hv-card-rim) border-box;
  box-shadow: var(--hv-card-depth), var(--hv-card-shadow);
  -webkit-backdrop-filter: blur(34px) saturate(1.7); backdrop-filter: blur(34px) saturate(1.7);
  animation: hv-card-in 0.25s cubic-bezier(0.2, 0.8, 0.2, 1) both;
}
.hv-auth-card::before { content: ''; position: absolute; inset: 0; z-index: -1; background: var(--hv-grain) 0 0 / 160px 160px; opacity: var(--hv-grain-opacity); mix-blend-mode: var(--hv-grain-blend); pointer-events: none; }
.hv-auth-card::after { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: 0;
  background: linear-gradient(106deg, transparent 40%, var(--hv-front-sheen) 50%, transparent 60%) 130% 0 / 200% 100% no-repeat;
  animation: hv-sheen 1.6s cubic-bezier(0.2, 0.7, 0.2, 1) 0.5s 1 both; }
@keyframes hv-card-in { from { opacity: 0; transform: translateY(10px) scale(0.99); } to { opacity: 1; transform: none; } }
@keyframes hv-sheen { 0% { background-position: 130% 0; opacity: 0; } 12% { opacity: 1; } 100% { background-position: -30% 0; opacity: 0; } }
.hv-auth-head { display: grid; gap: 6px; margin-bottom: 22px; }
.hv-auth-head h1 { margin: 0; font-size: 24px; font-weight: 800; letter-spacing: -0.03em; line-height: 1.25; }
.hv-auth-head p { margin: 0; font-size: 13.5px; line-height: 1.6; color: var(--hv-text-2); }
.hv-auth-form { display: grid; gap: 14px; }
.hv-auth-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.hv-auth-row .hv-link { font-size: 13px; }
.hv-auth-submit { margin-top: 4px; }
/* 通行密钥登录（次级玻璃芯片，紧跟主按钮）：等待设备验证时不按「停用」变灰，只让钥匙图标轻轻呼吸 */
.hv-auth-submit + .hv-auth-passkey { margin-top: -4px; }
/* 登录页表单前的内联脚本已判定支持通行密钥（html.hv-webauthn）：首帧就占位显示，不等 login.js 去掉 hidden
   （!important 是为了压过 bootstrap 的 [hidden]{display:none!important}） */
html.hv-webauthn #passkey-login[hidden] { display: inline-flex !important; }
.hv-auth-passkey.is-busy:disabled { opacity: 0.72; cursor: progress; }
@media (prefers-reduced-motion: no-preference) {
  .hv-auth-passkey.is-busy .hv-i { animation: hv-passkey-pulse 1s ease-in-out infinite; }
}
@keyframes hv-passkey-pulse { 50% { opacity: 0.35; } }
.hv-auth-divider { display: flex; align-items: center; gap: 12px; margin: 18px 0 14px; font-size: 11.5px; font-weight: 600; letter-spacing: 0.08em; color: var(--hv-text-3); }
.hv-auth-divider::before, .hv-auth-divider::after { content: ''; flex: 1; height: 1px; background: var(--hv-line); }
/* 带上父级：单类名压不过基础重置 .hv-theme p{margin:0}，与主按钮之间的 18px 会被吃掉 */
.hv-auth-card .hv-auth-foot { margin: 18px 0 0; text-align: center; font-size: 13px; color: var(--hv-text-2); }
.hv-auth-copy { font-size: 12.5px; color: var(--hv-text-3); text-align: center; align-self: end; }

/* ---------- 页脚 ---------- */
.hv-footer { margin-top: auto; padding: 24px 0 28px; text-align: center; font-size: 12.5px; color: var(--hv-text-3); display: flex; justify-content: center; align-items: center; gap: 8px; flex-wrap: wrap; }

/* =============================================================================
   官方浮层皮肤：layer（购买成功弹窗 / 自选弹窗 / 提示）
   ============================================================================= */
/* 店面的 _.css 给 layer 标题 / 按钮 / 页面层写了一批不带作用域的 !important（42px 标题 + 灰色光晕、28px 按钮、
   青绿 / 橙色按钮字、60% 白玻璃页面层），不同样加 !important 这里的皮肤就不生效；每条只加在被它压住的属性上 */
.hv-theme .layui-layer { border-radius: 20px !important; background: var(--hv-layer-bg); color: var(--hv-text); box-shadow: var(--hv-dialog-shadow) !important; overflow: hidden; }
/* 页面层（购买成功的卡密弹窗等）：实色层面，不做半透明玻璃——深色下白玻璃上的白字根本读不出 */
.hv-theme .layui-layer.layui-layer-page { background: var(--hv-layer-bg) !important; -webkit-backdrop-filter: none; backdrop-filter: none; }
.hv-theme .layui-layer-title { height: 52px !important; line-height: 52px !important; padding: 0 52px 0 20px; border-bottom: 1px solid var(--hv-line-soft) !important; background: transparent; box-shadow: none;
  color: var(--hv-text); font-size: 14.5px !important; font-weight: 650; }
.hv-theme .layui-layer-content { color: var(--hv-text); }
.hv-theme .layui-layer-page .layui-layer-content { color: var(--hv-text); }
.hv-theme .layui-layer-dialog .layui-layer-content { font-weight: 500; }
/* 关闭钮在 52px 标题栏里垂直居中；买家侧弹窗不需要最小化 / 最大化 */
.hv-theme .layui-layer-setwin { top: 18px !important; right: 18px; }
.hv-theme .layui-layer-setwin .layui-layer-close { color: var(--hv-text-2); }
/* × 用 SVG 蒙版画（与主题 #hv-x 同一路径，颜色跟 currentColor）：layui 的 × 是图标字体里的码位 U+1006，字体用到才下载，
   慢网 / 加载失败时会露出系统字体里的「ဆ」；独立版 layer 的 × 则是雪碧图，同样换掉。close2（圆底浮在角上的那种）不动 */
.hv-theme .layui-layer-setwin .layui-layer-close1 { position: relative; font-size: 0; background: none; }
.hv-theme .layui-layer-setwin .layui-layer-close1::before { content: ""; display: block; width: 16px; height: 16px; margin: 0 auto; background: currentColor;
  -webkit-mask: var(--hv-x-mask) center / contain no-repeat; mask: var(--hv-x-mask) center / contain no-repeat; }
/* 点击区 40×40（字形仍是 16px）：手机上整屏的自选弹窗里它是右上角唯一的关闭钮，16px 的盒子连 24px 的最低线都不够 */
.hv-theme .layui-layer-setwin .layui-layer-close1::after { content: ""; position: absolute; top: 50%; left: 50%; width: 40px; height: 40px; margin: -20px 0 0 -20px; border-radius: 50%; }
.hv-theme .layui-layer-setwin .layui-layer-min, .hv-theme .layui-layer-setwin .layui-layer-max { display: none; }
/* 短消息（分享链接已复制等）：与后台同款墨色小片，深色下是珠光 */
/* layer.msg 也带 .layui-layer-dialog：vendor 的 min-width 240 / 16px 内边距收回成与后台一样的小片（带图标的 msg 留着左侧图标位） */
.hv-theme .layui-layer.layui-layer-msg { min-width: 0; border: 0; border-radius: 12px !important; background: var(--hv-text) !important; color: var(--hv-bg); box-shadow: 0 12px 28px -10px rgba(16, 20, 28, 0.5) !important; }
.hv-theme .layui-layer-msg .layui-layer-content { color: inherit; font-weight: 500; }
.hv-theme .layui-layer-msg .layui-layer-content:not(.layui-layer-padding) { padding: 10px 16px; }
.hv-theme .layui-layer-btn { padding: 0 20px 16px; border-top: 0; background: transparent; box-shadow: none; text-align: right; }
.hv-theme .layui-layer-btn a { height: 38px !important; line-height: 36px !important; margin: 6px 0 0 8px !important; padding: 0 16px !important; border: 1px solid transparent; border-radius: 999px; font-size: 13px; font-weight: 600;
  background: var(--hv-chip-bg); box-shadow: var(--hv-chip-shadow); color: var(--hv-text) !important; }
.hv-theme .layui-layer-btn .layui-layer-btn0 { background: var(--hv-cta); box-shadow: var(--hv-cta-shadow); color: var(--hv-cta-fg) !important; border-color: transparent; }
/* 按钮里的图标跟随按钮字色（官方给「保存 / 取消」图标挂了 .text-success / .text-warning） */
.hv-theme .layui-layer-btn a i { color: inherit !important; --fa-primary-color: currentColor; --fa-secondary-color: currentColor; }
/* 输入层（layer.prompt，如分享链接手动复制）：内容区放一口井 */
.hv-theme .layui-layer-prompt .layui-layer-content { padding: 18px 20px 4px; }
.hv-theme .layui-layer-prompt .layui-layer-input { display: block; width: min(360px, calc(100vw - 88px)); height: var(--hv-field-h); margin: 0; padding: 0 12px; border: 1px solid transparent; border-radius: var(--hv-field-radius); outline: none;
  background: var(--hv-well) padding-box, var(--hv-field-edge) border-box; box-shadow: var(--hv-field-shadow); color: var(--hv-text); font-size: 13.5px; line-height: normal; }
.hv-theme .layui-layer-prompt .layui-layer-input:focus { background: var(--hv-field-fill-focus) padding-box, var(--hv-field-edge-focus) border-box; box-shadow: var(--hv-field-shadow-focus); }
.hv-theme .layui-layer-shade { background-color: rgba(18, 22, 30, 0.9) !important; }
.hv-theme .acg-secret__code { background: var(--hv-console-bg); box-shadow: var(--hv-console-shadow); color: var(--hv-console-fg); border: 0; border-radius: 14px; }
.hv-theme .acg-secret__btn { border-radius: 999px; background: var(--hv-chip-bg); box-shadow: var(--hv-chip-shadow); border: 1px solid transparent; font-weight: 600; }
.hv-theme .acg-secret__btn:hover { background: var(--hv-chip-bg-hover); box-shadow: var(--hv-chip-shadow-hover); border-color: transparent; }
.hv-theme .acg-secret__note { border-radius: 12px; background: var(--hv-hover); border-left: 3px solid var(--hv-line-strong); }
/* 购买成功弹窗整体封顶在视口内、内容在层内滚动，标题和 × 始终在屏上：treasure.js 传的高度是 'auto'，layer 只在高度为 '' 时才按 maxHeight 封顶，
   多张卡密 / 长使用说明会把整层撑得比屏幕还高（fixed 定位，滚页面也够不着两端）。layer 建层时先量高再居中，封顶后量到的就是封顶高度，照样居中；
   100px = 52px 标题栏 + 上下各留 24px。子项不许被压扁：卡密块自带 overflow（弹性最小高度按 0 算），不钉住会先被挤没 */
.hv-theme .acg-secret { max-height: calc(100vh - 100px); max-height: calc(100svh - 100px); overflow-y: auto; overscroll-behavior: contain; }
.hv-theme .acg-secret > * { flex-shrink: 0; }
/* component.popup（自选卡密弹窗等）——白皮肤，与 Tokyo 同一套结构，只换令牌 */
.hv-theme .component-popup { border-radius: 24px !important; border: 0 !important; background: var(--hv-layer-bg) !important; box-shadow: var(--hv-dialog-shadow) !important; }
/* 宽度按 UA 判断（桌面 UA 固定 620px）：窄窗口里限宽，layer 按渲染后的外宽居中，所以打开时就能落在屏内。
   手机 UA 是 100%×100% 的整屏面板：不限宽、也不要圆角。layer 建层时行内写的是「width:100%」（无空格），
   之后 jQuery 改写行内样式会变成「width: 100%」，两种写法都要认 */
.hv-theme .component-popup:not([style*="width:100%"]):not([style*="width: 100%"]) { max-width: calc(100% - 24px) !important; }
.hv-theme .component-popup:is([style*="width:100%"], [style*="width: 100%"]) { border-radius: 0 !important; }
.hv-theme .component-popup .layui-layer-content { background: transparent; }
.hv-theme .component-popup .layui-layer-title { border-bottom: 1px solid var(--hv-line-soft) !important; background: transparent !important; color: var(--hv-text) !important; font-size: 14.5px !important; font-weight: 650 !important; }
.hv-theme .component-popup .layui-layer-btn { border-top: 1px solid var(--hv-line-soft) !important; background: transparent; }
.hv-theme .component-popup .mcy-card { padding: 16px; border: 0; border-radius: 18px; background: var(--hv-inset-bg); box-shadow: var(--hv-inset-shadow); }
/* 搜索条 = 店面搜索同款（胶囊井 + 井内墨色查询钮）。component.css 给 .table-search 的外观全是 !important（后台 MUI 用），这里只能同样加。
   胶囊里只放一行：component.css 的 flex-wrap:wrap 要收掉，输入框从 0 起分剩余宽度（能缩到 0），窄屏（≤360）查询钮才不会折到井底把胶囊撑成一团 */
.hv-theme .component-popup .hex-query-form, .hv-theme .component-popup .table-search { display: flex !important; flex-wrap: nowrap; align-items: center; gap: 6px; margin: 0 0 14px !important; padding: 4px !important; border: 1px solid transparent !important; border-radius: 999px !important;
  background: var(--hv-well) padding-box, var(--hv-field-edge) border-box !important; box-shadow: var(--hv-field-shadow) !important; transition: background 0.2s ease, box-shadow 0.2s ease; }
/* 它同时是 .layui-form-item，那条 :after 清浮动在 flex 里会变成第三个子项，胶囊右端多出一个 6px 的 gap，查询钮离右缘比上下远 */
.hv-theme .component-popup .hex-query-form::after, .hv-theme .component-popup .table-search::after { display: none; }
.hv-theme .component-popup .table-search:focus-within { background: var(--hv-field-fill-focus) padding-box, var(--hv-field-edge-focus) border-box !important; box-shadow: var(--hv-field-shadow-focus) !important; }
/* MUI 浮动标签在井里当占位文字用：不浮起、不带底色，输入了内容才隐去 */
.hv-theme .component-popup .table-search .mui-sf > .mui-sf__label,
.hv-theme .component-popup .table-search .mui-sf:focus-within > .mui-sf__label,
.hv-theme .component-popup .table-search .mui-sf:has(input:not(:placeholder-shown)) > .mui-sf__label { top: 50%; left: 12px; padding: 0; background: transparent; color: var(--hv-text-3); font-size: 13px; font-weight: 400; transform: translateY(-50%); }
.hv-theme .component-popup .table-search .mui-sf:has(input:not(:placeholder-shown)) > .mui-sf__label { opacity: 0; }
/* left:0 收掉 layui ≤450px 给 .layui-form-item .layui-input-inline 的 left:-3px（胶囊里的输入框整体左移，右端多空 3px） */
.hv-theme .component-popup .hex-query-form .layui-input-inline, .hv-theme .component-popup .table-search .layui-input-inline { float: none !important; display: flex; align-items: center; left: 0; margin: 0 !important; width: auto !important; padding-top: 0 !important; }
.hv-theme .component-popup .hex-query-form .layui-input-inline:first-child, .hv-theme .component-popup .table-search .layui-input-inline:first-child { flex: 1 1 0; min-width: 0; }
.hv-theme .component-popup .hex-query-form .layui-input, .hv-theme .component-popup .table-search .layui-input { height: 34px !important; min-height: 34px; padding: 0 12px !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: var(--hv-text); font-size: 13px; box-shadow: none !important; }
.hv-theme .component-popup .hex-query-form .queryBtn, .hv-theme .component-popup .hex-query-form .query-button, .hv-theme .component-popup .table-search .queryBtn, .hv-theme .component-popup .table-search .query-button {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 34px !important; min-height: 34px !important; padding: 0 14px !important; border: 1px solid transparent !important; border-radius: 999px !important;
  background: var(--hv-cta) !important; box-shadow: var(--hv-cta-shadow) !important; color: var(--hv-cta-fg) !important; font-size: 13px !important; font-weight: 600; }
.hv-theme .component-popup .bootstrap-table { color: var(--hv-text); }
.hv-theme .component-popup .bootstrap-table .fixed-table-toolbar { margin: 0; }
.hv-theme .component-popup .bootstrap-table .fixed-table-toolbar::after { display: none; }
.hv-theme .component-popup .bootstrap-table .fixed-table-container { overflow: hidden; border: 0; border-radius: 14px; background: var(--hv-table-bg); box-shadow: var(--hv-table-shadow); }
.hv-theme .component-popup .bootstrap-table .fixed-table-container .table { border-collapse: separate; border-spacing: 0; background: transparent; color: var(--hv-text); margin: 0; }
.hv-theme .component-popup .bootstrap-table .fixed-table-container .table thead th { background: var(--hv-th-bg); color: var(--hv-text-3); font-size: 12px !important; font-weight: 600; border-color: var(--hv-line) !important; }
.hv-theme .component-popup .bootstrap-table .fixed-table-container .table thead th .th-inner { padding: 10px 14px; }
.hv-theme .component-popup .bootstrap-table .fixed-table-container .table tbody tr { font-size: 13px !important; color: var(--hv-text); }
.hv-theme .component-popup .bootstrap-table .fixed-table-container .table tbody tr:hover { background: var(--hv-row-hover); }
.hv-theme .component-popup .bootstrap-table .fixed-table-container .table tbody tr.selected td { background: var(--hv-hover); }
.hv-theme .component-popup .bootstrap-table .fixed-table-container .table td { padding: 12px 14px; border-color: var(--hv-line-soft) !important; background: transparent; color: var(--hv-text); font-size: 13px !important; line-height: 1.5; }
.hv-theme .component-popup .bootstrap-table .fixed-table-container .table .bs-checkbox { width: 48px; text-align: center; }
.hv-theme .component-popup .bootstrap-table .fixed-table-container .table .bs-checkbox input[type="radio"], .hv-theme .component-popup .bootstrap-table .fixed-table-container .table .bs-checkbox input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--hv-text); cursor: pointer; }
.hv-theme .component-popup .bootstrap-table .fixed-table-container .table tbody tr.no-records-found td { padding: 26px 14px; color: var(--hv-text-3); }
.hv-theme .component-popup .bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading { background: rgba(var(--hv-layer-bg-rgb), 0.82); }
.hv-theme .component-popup .bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .loading-text { color: var(--hv-text-2); }
.hv-theme .component-popup .bootstrap-table .a-badge-primary { min-height: 26px; padding: 0 10px; border-radius: 999px; background: var(--hv-info-soft); color: var(--hv-info); font-size: 12px; font-weight: 600; box-shadow: none; }
.hv-theme .component-popup .bootstrap-table .fixed-table-pagination { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 2px 0; flex-wrap: wrap; }
.hv-theme .component-popup .bootstrap-table .fixed-table-pagination::after { display: none; }
.hv-theme .component-popup .bootstrap-table .fixed-table-pagination > .pagination-detail, .hv-theme .component-popup .bootstrap-table .fixed-table-pagination > .pagination { float: none !important; margin: 0 !important; }
.hv-theme .component-popup .bootstrap-table .fixed-table-pagination > .pagination-detail { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; color: var(--hv-text-3); font-size: 12.5px; }
.hv-theme .component-popup .bootstrap-table .fixed-table-pagination > .pagination-detail .page-list .btn-group .btn { min-height: 30px; padding: 0 12px; border: 0; border-radius: 10px !important; background: var(--hv-chip-bg); box-shadow: var(--hv-chip-shadow); color: var(--hv-text); font-size: 12.5px; }
.hv-theme .component-popup .bootstrap-table .fixed-table-pagination > .pagination-detail .page-list .btn-group .dropdown-menu { border-radius: 12px; border: 0; background: var(--hv-layer-bg); box-shadow: var(--hv-pop-shadow); color: var(--hv-text); }
.hv-theme .component-popup .bootstrap-table .fixed-table-pagination > .pagination ul.pagination { display: flex; gap: 4px; margin: 0; }
.hv-theme .component-popup .bootstrap-table .fixed-table-pagination > .pagination ul.pagination .page-item .page-link { min-width: 30px; height: 30px; padding: 0 9px; border: 0; border-radius: 10px; background: transparent; color: var(--hv-text-2); font-size: 12.5px; line-height: 30px; box-shadow: none; }
.hv-theme .component-popup .bootstrap-table .fixed-table-pagination > .pagination ul.pagination .page-item.active .page-link { background: var(--hv-cta); box-shadow: var(--hv-cta-shadow); color: var(--hv-cta-fg); }
.hv-theme .component-popup .bootstrap-table .fixed-table-pagination > .pagination ul.pagination .page-item.disabled .page-link { opacity: 0.38; }

/* =============================================================================
   官方提示皮肤：toastr（message.success / error / warning / info）
   与后台同一套：玻璃卡片 + 墨色字，语义色只留在左侧 20px 小图标上。
   位置在悬浮导航下方（右缘与导航胶囊对齐；手机居中），永远不压住导航。
   图标 / 底色 / 边线画成同一组背景层；_.css 的类型图标是 background-image !important，只能同样加
   ============================================================================= */
.hv-theme #toast-container.toast-top-right { top: 88px; right: max(24px, calc((100% - 1280px) / 2)); }
.hv-theme #toast-container > div { width: auto; min-width: 240px; max-width: min(380px, calc(100vw - 32px)); margin: 0 0 8px; padding: 12px 16px 12px 44px; opacity: 1;
  border: 1px solid transparent; border-radius: 14px; background-color: transparent;
  background-repeat: no-repeat; background-position: 14px center, 0 0, 0 0; background-size: 20px 20px, auto, auto;
  background-origin: padding-box, padding-box, border-box; background-clip: padding-box, padding-box, border-box;
  box-shadow: var(--hv-pop-shadow); -webkit-backdrop-filter: var(--hv-pop-blur); backdrop-filter: var(--hv-pop-blur);
  color: var(--hv-text); font-size: 13.5px; font-weight: 500; line-height: 1.45; }
.hv-theme #toast-container > div:hover { box-shadow: var(--hv-pop-shadow); }
.hv-theme #toast-container > .toast, .hv-theme #toast-container > .toast-info { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='%233b82f6'/%3E%3Cpath d='M12 10.8v6.6' stroke='white' stroke-width='2.3' stroke-linecap='round'/%3E%3Ccircle cx='12' cy='7' r='1.35' fill='white'/%3E%3C/svg%3E"), var(--hv-dialog-bg), var(--hv-rim) !important; }
.hv-theme #toast-container > .toast-success { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='%2322a95b'/%3E%3Cpath d='M6.6 12.5l3.2 3.2L17 7.9' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"), var(--hv-dialog-bg), var(--hv-rim) !important; }
.hv-theme #toast-container > .toast-error { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='%23e5484d'/%3E%3Cpath d='M8.3 8.3l7.4 7.4M15.7 8.3l-7.4 7.4' stroke='white' stroke-width='2.3' stroke-linecap='round'/%3E%3C/svg%3E"), var(--hv-dialog-bg), var(--hv-rim) !important; }
.hv-theme #toast-container > .toast-warning { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='%23f0a81e'/%3E%3Cpath d='M12 6.6v7.2' stroke='white' stroke-width='2.4' stroke-linecap='round'/%3E%3Ccircle cx='12' cy='17.2' r='1.35' fill='white'/%3E%3C/svg%3E"), var(--hv-dialog-bg), var(--hv-rim) !important; }
.hv-theme #toast-container .toast-title { font-weight: 700; }
.hv-theme #toast-container .toast-message a, .hv-theme #toast-container .toast-message label { color: inherit; }
.hv-theme #toast-container .toast-progress { height: 2px; background: var(--hv-text); opacity: 0.2; }

/* =============================================================================
   响应式
   ============================================================================= */
@media (max-width: 1279.98px) {
  .hv-shell { width: calc(100% - 40px); }
  .hv-band { padding: 12px 20px 0; }
  .hv-shop { grid-template-columns: 272px minmax(0, 1fr); gap: 16px; }
  .hv-search { width: 300px; }
  .hv-theme #toast-container.toast-top-right { right: 20px; }
}
@media (max-width: 1023.98px) {
  .hv-nav__links, .hv-nav__tools .hv-nav__desktop, .hv-nav__tools .hv-nav__auth { display: none; }
  .hv-nav__tools .hv-burger { display: inline-flex; }
  .hv-shop { grid-template-columns: minmax(0, 1fr); }
  .hv-side { display: none; }
  .hv-catalog { min-width: 0; }
  .hv-catalog .hv-panel__head { flex-direction: column; align-items: stretch; }
  .hv-catalog__tools { align-items: stretch; }
  .hv-search { width: 100%; }
  .hv-quickcats { display: flex; align-items: center; gap: 8px; min-width: 0; position: relative; }
  .hv-quickcats__scroller { flex: 1 1 auto; min-width: 0; }
  .hv-quickcats__filter { flex: none; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
    background: var(--hv-chip-bg); box-shadow: var(--hv-chip-shadow); color: var(--hv-text-2); transition: background 0.16s ease, box-shadow 0.16s ease, color 0.16s ease; }
  .hv-quickcats__filter .hv-i { font-size: 16px; }
  .hv-quickcats__filter:hover { background: var(--hv-chip-bg-hover); box-shadow: var(--hv-chip-shadow-hover); color: var(--hv-text); }
  .hv-quickcats__filter[aria-expanded="true"] { background: var(--hv-cta); box-shadow: var(--hv-cta-shadow); color: var(--hv-nav-active-fg); }
  /* 左右 16px 内边距 + 负外边距 = 胶囊可以滑进两侧渐隐区；scroll-padding 让吸附点落在内容线上（首项与搜索框左对齐，不被渐隐吃掉）。
     上下内边距要容得下胶囊阴影和 2+2px 的焦点环（横向滚动会把纵向也裁掉），再用负外边距抵回，行高不变；
     底部按墨色选中胶囊的阴影全长留 16px（0 10px 18px -12px 一直淡到胶囊下 16px），留少了阴影在半路被齐刷刷切成一条横线 */
  .hv-quickcats__scroller { display: flex; gap: 6px; overflow-x: auto; scroll-snap-type: x proximity; scroll-padding-inline: 16px; scrollbar-width: none; padding: 4px 16px 16px; margin: -2px 0 -14px -16px;
    -webkit-mask: linear-gradient(90deg, transparent, #000 16px, #000 calc(100% - 16px), transparent); mask: linear-gradient(90deg, transparent, #000 16px, #000 calc(100% - 16px), transparent); }
  .hv-quickcats__scroller::-webkit-scrollbar { display: none; }
  .hv-quickcats.is-empty { display: none; }
  .hv-quickcat { flex: none; scroll-snap-align: start; display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 13px; border: 0; border-radius: 999px; max-width: 14em; white-space: nowrap;
    font-size: 12.5px; font-weight: 600; color: var(--hv-text-2); background: var(--hv-chip-bg); box-shadow: var(--hv-chip-shadow); transition: background 0.16s ease, color 0.16s ease; }
  .hv-quickcat .hv-i { font-size: 14px; }
  .hv-quickcat img { width: 18px; height: 18px; border-radius: 50%; object-fit: cover; }
  .hv-quickcat__label { overflow: hidden; text-overflow: ellipsis; }
  .hv-quickcat.is-active { background: var(--hv-cta); box-shadow: var(--hv-cta-shadow); color: var(--hv-nav-active-fg); }
  .hv-quickcats__skeleton { display: flex; gap: 6px; }
  .hv-quickcats__skeleton i { display: block; height: 34px; width: 72px; border-radius: 999px; background: var(--hv-hover-strong); animation: hv-breathe 1.4s ease-in-out infinite; }
  .hv-quickcats__skeleton i:nth-child(2) { width: 56px; } .hv-quickcats__skeleton i:nth-child(3) { width: 88px; } .hv-quickcats__skeleton i:nth-child(4) { width: 64px; }
  .hv-item { grid-template-columns: minmax(0, 1fr); }
  /* 单栏时封面占满列宽，横屏手机 / 平板上一屏全是图：按视口高度封顶，object-fit 居中裁切。
     宽度要写死 100%：否则 max-height 会经 aspect-ratio 反推把宽度也缩掉，图变成靠左的小块 */
  .hv-cover { position: relative; top: auto; width: 100%; max-height: min(60vh, 520px); }
}
@media (max-width: 767.98px) {
  .hv-shell, .hv-shell--narrow { width: calc(100% - 32px); }
  /* 导航胶囊与下面的面板共用 16px 边距（同一条左右边线） */
  .hv-band { padding: 10px 16px 0; }
  .hv-nav { height: 56px; padding: 7px 8px 7px 10px; gap: 6px; }
  .hv-brand__mark { width: 38px; height: 38px; }
  .hv-brand__word { font-size: 15px; }
  .hv-round-btn, .hv-chip-btn { height: 40px; }
  .hv-round-btn { width: 40px; }
  .hv-main { padding: 18px 0 44px; }
  .hv-panel { border-radius: 20px; }
  .hv-panel__head, .hv-catalog .hv-panel__head { padding: 16px 16px 12px; }
  .hv-panel__body { padding: 14px 16px 16px; }
  .hv-panel__body--tight { padding: 10px; }
  /* 行变卡片：卡片是 .item-list 的子项，间距要挂在 .item-list 上；
     列间距 10px 让底部的价格 / 库存与「购买」之间永远留缝（窄屏会换行而不是贴上去）；
     末张卡片也要补回 1px 边（桌面「末行去底线」那条规则优先级更高） */
  .hv-plist { background: transparent; box-shadow: none; border-radius: 0; overflow: visible; }
  .hv-plist .item-list { display: grid; gap: 10px; }
  .hv-plist__head { display: none; }
  .hv-prow, .hv-prow:last-child, .hv-plist--sold .hv-prow { display: flex; flex-wrap: wrap; gap: 0 10px; padding: 12px; border: 1px solid transparent; border-radius: 16px; background: var(--hv-stat-bg) padding-box, var(--hv-rim) border-box; box-shadow: var(--hv-stat-shadow); }
  .hv-prow__main { flex: 1 1 100%; padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid var(--hv-line-soft); }
  .hv-prow__thumb { width: 56px; height: 56px; }
  .hv-prow__name { white-space: normal; }
  .hv-prow__price, .hv-prow__stock, .hv-prow__sold { display: none; }
  /* 基准宽 0：「购买」永远和价格同一行，放不下时是价格区自己换行（而不是把按钮挤到下一行） */
  .hv-prow__foot { display: flex; flex: 1 1 0; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; min-width: 0; }
  .hv-prow__foot .hv-amt { font-size: 17px; }
  .hv-prow__meta { font-size: 12px; color: var(--hv-text-3); font-variant-numeric: tabular-nums; }
  .hv-prow__action { margin-left: auto; align-self: center; }
  /* 卡片列表很长，居中的加载提示会落到屏幕外；切分类 / 搜索的入口都在列表顶上，提示贴顶就一定看得见 */
  .hv-table-loading { border-radius: 16px; align-items: flex-start; padding-top: 56px; }
  /* 商品页 */
  .hv-item { padding: 14px; gap: 16px; }
  .hv-cover { aspect-ratio: 1 / 1; border-radius: 16px; }
  .hv-buy__title { font-size: 21px; }
  .hv-price .price { font-size: 34px; }
  .hv-theme .pay-list { grid-template-columns: 1fr 1fr; }
  /* 单数个支付方式时最后一个独占整行，不留半行空位 */
  .hv-theme .pay-list .pay:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .hv-theme .hv-seg { --_seg-btn: 40px; --_seg-num: 56px; }
  /* 触控目标：单选 / 多选整行 40px 高（label 撑开），分享芯片外观不变、点击区向四周扩到约 40px */
  .hv-theme .hv-form .form-check { min-height: 40px; margin-right: 18px; }
  .hv-theme .hv-form .form-check-label { padding: 10px 0; }
  .badge-soft-info.shared-button { position: relative; }
  .badge-soft-info.shared-button::after { content: ''; position: absolute; inset: -9px -6px; }
  .hv-login-required { flex-direction: column; align-items: stretch; }
  .hv-details { margin-top: 16px; }
  .hv-desc--item { font-size: 15px; }
  /* 列多（≥5 列）的表手机上挤不下：单元格不折行、整表横滑（否则每格挤成一两个字一行）。放得下时照样铺满正文——靠上面 @supports 里的
     caption；不认容器单位的老内核里横滑块缩成内容宽，列少的表因此保持 display:table */
  :is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) table:has(tr > :nth-child(5)) { display: block; overflow-x: auto; }
  :is(.hv-desc, :where(.acg-secret__note-body, .order-item .mt-3)) table:has(tr > :nth-child(5)) :is(th, td) { white-space: nowrap; }
  /* 订单查询 */
  .hv-query-hero { padding: 10px 0 14px; }
  .hv-hero-well { --hv-field-h: 52px; }
  .hv-hero-well .hv-btn { height: 38px; padding: 0 14px; }
  .hv-theme .order-item { padding: 14px; }
  .hv-theme .password-form .input-group { flex-wrap: wrap; }
  .hv-theme .password-form .form-control { flex: 1 1 100%; }
  .hv-theme .password-form .view-card-btn { width: 100%; }
  /* 登录 */
  .hv-auth-stage { padding: 18px 12px 24px; gap: 18px; }
  .hv-auth-theme { top: 12px; right: 12px; }
  .hv-auth-col::before { inset: -24px -12px 40px; }
  .hv-auth-card { padding: 26px 20px 22px; border-radius: 28px; }
  .hv-captcha-row { flex-wrap: wrap; }
  .hv-captcha-row > .hv-btn { width: 100%; }
  /* 弹窗 */
  .hv-dialog { border-radius: 22px; max-height: calc(100vh - 32px); }
  .hv-dialog__head, .hv-dialog__body, .hv-dialog__foot { padding-left: 16px; padding-right: 16px; }
  .hv-dialog__foot { flex-direction: column; align-items: stretch; }
  .hv-dialog__foot .hv-btn-ink { order: -1; }
  .hv-dialog__tip { text-align: center; }
  .hv-footer { padding: 18px 0 24px; }
  /* 提示：导航下方居中，左右与页面同一 16px 边距 */
  .hv-theme #toast-container.toast-top-right { top: 76px; left: 16px; right: 16px; display: flex; flex-direction: column; align-items: center; }
  .hv-theme #toast-container > div { max-width: 100%; }
}
@media (max-width: 379.98px) {
  .hv-brand__word { display: none; }
  .hv-btn-hero { font-size: 15px; letter-spacing: 0.02em; padding: 0 20px; }
  .hv-theme .pay-list { grid-template-columns: 1fr; }
  .hv-hero-well .hv-btn span { display: none; }
  .hv-hero-well .hv-btn { padding: 0 12px; }
  .hv-search__well .hv-btn { padding: 0 10px; }
}
/* =============================================================================
   底部分类抽屉（≤1023px；桌面端用左侧面板，打开它的「筛选分类」钮在 .hv-quickcats 里，随它一起隐藏）
   ============================================================================= */
@media (max-width: 1023.98px) {
  .hv-sheet-wrap { position: fixed; inset: 0; z-index: 85; display: flex; align-items: flex-end; justify-content: center;
    background: var(--hv-backdrop); -webkit-backdrop-filter: blur(8px) saturate(120%); backdrop-filter: blur(8px) saturate(120%);
    opacity: 0; transition: opacity 0.22s ease; }
  .hv-sheet-wrap[hidden] { display: none; }
  .hv-sheet-wrap.is-open { opacity: 1; }
  .hv-sheet {
    width: min(640px, 100%); max-height: min(80vh, 720px); display: flex; flex-direction: column;
    padding: 0 16px calc(16px + env(safe-area-inset-bottom)); border: 1px solid transparent; border-bottom: 0; border-radius: 24px 24px 0 0;
    /* 不再自带 backdrop-filter：外层遮罩已经模糊了页面，而且它是本面板的 Backdrop Root，面板自己的模糊只会再糊一遍遮罩 */
    background: var(--hv-dialog-bg) padding-box, var(--hv-rim) border-box;
    box-shadow: var(--hv-dialog-shadow);
    transform: translateY(100%); transition: transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1);
  }
  .hv-sheet-wrap.is-open .hv-sheet { transform: none; }
  .hv-sheet.is-dragging { transition: none; }
  .hv-sheet__grip { display: flex; justify-content: center; padding: 10px 0 4px; cursor: grab; touch-action: none; user-select: none; }
  .hv-sheet__handle { width: 36px; height: 5px; border-radius: 999px; background: var(--hv-line-strong); }
  .hv-sheet__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 4px 0 12px; }
  .hv-sheet__title { margin: 0; font-size: 18px; font-weight: 700; letter-spacing: -0.02em; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
  .hv-sheet__search { margin-bottom: 12px; }
  /* 四周留 4px 装下瓦片的焦点环（滚动容器会裁掉溢出的部分），负外边距抵回，瓦片宽度与位置不变 */
  .hv-sheet__body { overflow-y: auto; overscroll-behavior: contain; padding: 4px; margin: -4px -4px 0; -webkit-overflow-scrolling: touch; }
  .hv-sheet__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 8px; }
  .hv-sheet__grid--all { grid-template-columns: 1fr; }
  .hv-sheet__group { padding: 10px 4px 6px; font-size: 11.5px; font-weight: 650; letter-spacing: 0.06em; color: var(--hv-text-3); }
  .hv-sheet__tile { display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 8px 12px 8px 10px; border: 0; border-radius: 14px; text-align: left;
    background: var(--hv-chip-bg); box-shadow: var(--hv-chip-shadow); color: var(--hv-text-2); font-size: 13.5px; font-weight: 500; min-width: 0;
    transition: background 0.16s ease, box-shadow 0.16s ease, color 0.16s ease; }
  .hv-sheet__tile:hover { background: var(--hv-chip-bg-hover); box-shadow: var(--hv-chip-shadow-hover); color: var(--hv-text); }
  .hv-sheet__tile.is-active { background: var(--hv-cta); box-shadow: var(--hv-cta-shadow); color: var(--hv-nav-active-fg); font-weight: 600; }
  .hv-sheet__tile-icon { width: 28px; height: 28px; border-radius: 50%; flex: none; object-fit: cover; background: var(--hv-hover); box-shadow: 0 0 0 1px var(--hv-line-soft); }
  .hv-sheet__tile-icon--all { display: inline-flex; align-items: center; justify-content: center; background: var(--hv-well); box-shadow: var(--hv-well-shadow); color: var(--hv-text-2); }
  .hv-sheet__tile-icon--all .hv-i { font-size: 14px; }
  .hv-sheet__tile.is-active .hv-sheet__tile-icon--all { background: rgba(255, 255, 255, 0.14); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); color: inherit; }
  :root[data-theme="dark"] .hv-sheet__tile.is-active .hv-sheet__tile-icon--all { background: rgba(0, 0, 0, 0.1); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.12); }
  .hv-sheet__tile-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .hv-sheet__tile-count { flex: none; font-size: 11.5px; font-weight: 600; font-variant-numeric: tabular-nums; min-width: 22px; height: 20px; padding: 0 7px; border-radius: 999px;
    display: inline-flex; align-items: center; justify-content: center; background: var(--hv-hover); color: var(--hv-text-3); }
  .hv-sheet__tile.is-active .hv-sheet__tile-count { background: rgba(255, 255, 255, 0.16); color: inherit; }
  :root[data-theme="dark"] .hv-sheet__tile.is-active .hv-sheet__tile-count { background: rgba(0, 0, 0, 0.12); }
  .hv-sheet__tile.is-hidden, .hv-sheet__grid.is-hidden, .hv-sheet__group.is-hidden { display: none; }
  .hv-sheet__empty { padding: 28px 8px; text-align: center; font-size: 13px; color: var(--hv-text-3); }
}
@media (max-width: 379.98px) {
  .hv-sheet__grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .hv-theme *, .hv-theme *::before, .hv-theme *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
  /* 旋转的加载圈是状态指示，停住就像卡死了：保留，只放慢（骨架呼吸停在实色即可）。
     .chahuo-ring::after = 登录 / 注册 / 立即购买时 util.post 的全屏加载环，_.css 在减弱动效下本来就保留它，别被上面的通配压停 */
  .hv-theme .hv-spinner, .hv-theme .chahuo-ring::after { animation-duration: 1.6s !important; animation-iteration-count: infinite !important; }
}

/* =============================================================================
   Auto 发卡 · 订单查询页的发货等待面板（挂载点 Index/Query.html，驱动 Assets/Delivery.js）
   -----------------------------------------------------------------------------
   本块独立追加在文件末尾，不改上面任何一条规则（与其他批次合并时互不重叠）。
   墨滴移植自 auto.hoverk.com 的进度墨团（Auto-System public/index.html「墨滴」+ assets/site.css + redeem.js）：
   同一个粘性滤镜（模糊 7 → alpha 22 / -10 → atop）、4 颗公转卫星、慢呼吸的主墨团、WAAPI 滴落 + 抖动。
   这里是「不定进度」版：主墨团大小按阶段走（确认 .86 → 生成 .93 → 完成 1），中心写状态字（--hv-bg 写在墨上），
   下方三段轨「支付 · 生成 · 完成」。颜色只走令牌：墨 = --hv-text（深色模式自动成珠光白）、
   完成 = --hv-success、转人工 = --hv-warning（琥珀，不用报警红）、待付款（中性）= --hv-text-2。
   根上的状态：data-state = confirm | unpaid | mint | slow | hold | help | done（help = 同 hold 的画面，文案不说「已通知」）；
   .is-compact = 收起墨滴只留文字；.is-reveal = 完成时墨滴收进下方订单卡；.is-paused = 页面隐藏 / 滚出视口，动画暂停。
   ============================================================================= */
.hv-dl {
  --_tone: var(--hv-text); --_done: var(--hv-text); --_mark: var(--_tone); --_s: 0.86; --_ink-size: 200px;
  margin-top: 20px; padding: 14px 18px 22px;
  animation: hv-dl-in 0.3s cubic-bezier(0.2, 0.8, 0.2, 1) both;
}
.hv-dl[data-state="mint"], .hv-dl[data-state="slow"] { --_s: 0.93; }
/* 转人工：墨换成中性灰、照常流动（系统仍在重试 / 等站长），只有轨上的当前节点用琥珀提示 */
.hv-dl:is([data-state="hold"], [data-state="help"]) { --_s: 0.9; --_tone: var(--hv-text-2); --_mark: var(--hv-warning); }
.hv-dl[data-state="unpaid"] { --_tone: var(--hv-text-2); }
.hv-dl[data-state="done"] { --_s: 1; --_tone: var(--hv-success); --_done: var(--hv-success); }
.hv-dl__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 32px; }
.hv-dl__refresh.is-busy .hv-i { animation: hv-spin 0.8s linear infinite; }
/* 墨滴区：收起（待付款 / 完成）时整行高度过渡到 0；只在收起时裁切，平时不挡墨滴的模糊边和节点光圈 */
.hv-dl__stage { display: grid; grid-template-rows: 1fr; transition: grid-template-rows 0.42s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.3s ease; }
.hv-dl__clip { min-height: 0; }
.hv-dl__stage-body { display: grid; justify-items: center; gap: 12px; padding: 6px 0 2px; }
.hv-dl.is-compact .hv-dl__stage { grid-template-rows: 0fr; opacity: 0; visibility: hidden; transition: grid-template-rows 0.42s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.3s ease, visibility 0s linear 0.42s; }
.hv-dl.is-compact .hv-dl__clip { overflow: hidden; }
/* 墨滴本体（236 视框缩放到 200 / 160px） */
.hv-dl__ink { position: relative; width: var(--_ink-size); height: var(--_ink-size); transition: transform 0.42s cubic-bezier(0.55, 0, 0.75, 0.2), opacity 0.3s ease 0.12s; }
/* 完成（Delivery.js 先转绿 0.3 秒再挂 .is-reveal）：墨滴收缩下沉、三段轨淡出（0.3 秒）→ 墨滴区再折叠（0.3 秒），
   先后错开，墨滴不会被折叠中的区域裁掉；✓ 圆章随折叠弹出（延迟见状态文字一节） */
.hv-dl.is-reveal .hv-dl__ink { transform: translateY(14%) scale(0.2); opacity: 0; transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.22s ease 0.08s; }
.hv-dl.is-reveal .hv-dl__rail { opacity: 0; transition: opacity 0.2s ease; }
.hv-dl.is-reveal .hv-dl__stage { transition: grid-template-rows 0.3s cubic-bezier(0.2, 0.8, 0.2, 1) 0.24s, opacity 0.12s ease 0.42s, visibility 0s linear 0.54s; }
.hv-dl__svg { display: block; width: 100%; height: 100%; overflow: visible; }
.hv-dl__shadow { fill: var(--_tone); opacity: 0.12; filter: blur(7px); transform-box: fill-box; transform-origin: center; animation: hv-dl-shadow 4.4s ease-in-out infinite; transition: fill 0.45s ease; }
.hv-dl__fill { fill: var(--_tone); transition: fill 0.45s ease; }
/* 主墨团：外层随阶段长大（过渡），中层滴落时抖动（WAAPI），内层慢呼吸 */
.hv-dl__scale { transform-box: fill-box; transform-origin: center; transform: scale(var(--_s)); transition: transform 1s cubic-bezier(0.2, 0.9, 0.25, 1); }
.hv-dl__wobble { transform-box: fill-box; transform-origin: center; }
.hv-dl__core { transform-box: fill-box; transform-origin: center; animation: hv-dl-breathe 4.4s ease-in-out infinite; }
/* 卫星墨珠：绕中心公转（周期各不相同），臂长来回伸缩，所以时而汇入、时而分离 */
.hv-dl__orb { transform-box: view-box; transform-origin: 118px 118px; animation: hv-dl-rot var(--_T, 12s) linear var(--_d, 0s) infinite; }
.hv-dl__arm { transform: translate(118px, 118px) translateX(var(--_r1, 30px)); animation: hv-dl-arm var(--_T2, 7s) ease-in-out var(--_d2, 0s) infinite alternate; }
.hv-dl__orb--1 { --_T: 13s; --_a: 0deg; --_d: 0s; --_T2: 7.4s; --_r1: 30px; --_r2: 84px; --_d2: 0s; }
.hv-dl__orb--2 { --_T: 17s; --_a: 120deg; --_d: -5s; --_T2: 9.1s; --_r1: 26px; --_r2: 78px; --_d2: -3s; }
.hv-dl__orb--3 { --_T: 11s; --_a: 230deg; --_d: -8s; --_T2: 6.3s; --_r1: 34px; --_r2: 88px; --_d2: -1.5s; }
.hv-dl__orb--4 { --_T: 21s; --_a: 300deg; --_d: -2s; --_T2: 5.2s; --_r1: 22px; --_r2: 70px; --_d2: -4s; }
.hv-dl__drop { opacity: 0; transform-box: fill-box; transform-origin: center; }
/* 墨上的状态字：页面底色写在墨上（浅色 = 黑墨浅字，深色 = 珠光白深字）；完成时多一个 ✓（不只靠绿色表达） */
.hv-dl__center { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: 3px; color: var(--hv-bg); text-align: center; pointer-events: none; transition: opacity 0.2s ease; }
.hv-dl__word { font-size: 18px; font-weight: 750; letter-spacing: 0.06em; line-height: 1.2; white-space: nowrap; }
/* 英文等拼音文字的状态字（Delivery.js 加 .is-long）：单行小号字，随墨滴大小（200 px → 13 px，160 px → 10.4 px）；
   译文太长时 Delivery.js 再按实际宽度缩小（--_fit），保证主墨团最小时（支付确认中 0.86）也整个落在墨上 */
.hv-dl__word.is-long { font-size: max(8px, calc(var(--_ink-size) * 0.065 * var(--_fit, 1))); letter-spacing: 0; }
.hv-dl__mark { display: none; width: 22px; height: 22px; }
.hv-dl[data-state="done"] .hv-dl__mark { display: block; }
.hv-dl.is-reveal .hv-dl__center { opacity: 0; }
/* 三段轨：支付 · 生成 · 完成 */
.hv-dl__rail { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: min(312px, 100%); }
.hv-dl__step { position: relative; display: grid; justify-items: center; gap: 6px; font-size: 12px; font-weight: 600; line-height: 1.3; color: var(--hv-text-3); transition: color 0.3s ease; }
.hv-dl__step + .hv-dl__step::before { content: ''; position: absolute; top: 8px; left: calc(-50% + 16px); right: calc(50% + 16px); height: 2px; border-radius: 2px; background: var(--hv-line-strong); transition: background-color 0.45s ease; }
.hv-dl__step:is([data-step-state="done"], [data-step-state="current"], [data-step-state="hold"])::before { background: var(--_done); }
.hv-dl__step[data-step-state="done"] { color: var(--hv-text-2); }
.hv-dl__step:is([data-step-state="current"], [data-step-state="hold"]) { color: var(--hv-text); }
.hv-dl__node { position: relative; width: 18px; height: 18px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: var(--hv-bg);
  box-shadow: inset 0 0 0 1.5px var(--hv-line-strong); transition: background-color 0.45s ease, box-shadow 0.45s ease; }
.hv-dl__node .hv-i { width: 11px; height: 11px; opacity: 0; transition: opacity 0.2s ease; }
.hv-dl__node::before { content: ''; position: absolute; width: 6px; height: 6px; border-radius: 50%; background: var(--hv-bg); opacity: 0; }
.hv-dl__node::after { content: ''; position: absolute; inset: -4px; border-radius: 50%; box-shadow: 0 0 0 1.5px var(--_mark); opacity: 0; }
.hv-dl__step[data-step-state="done"] > .hv-dl__node { background: var(--_done); box-shadow: none; }
.hv-dl__step[data-step-state="done"] > .hv-dl__node .hv-i { opacity: 1; }
.hv-dl__step:is([data-step-state="current"], [data-step-state="hold"]) > .hv-dl__node { background: var(--_mark); box-shadow: none; }
.hv-dl__step:is([data-step-state="current"], [data-step-state="hold"]) > .hv-dl__node::before { opacity: 1; }
.hv-dl__step:is([data-step-state="current"], [data-step-state="hold"]) > .hv-dl__node::after { animation: hv-dl-halo 1.8s ease-out infinite; }
/* 状态文字（role=status）：展开时居中在轨下方；收起时上面多一枚圆章（待付款 = 时钟，完成 = ✓） */
.hv-dl__status { display: grid; justify-items: center; gap: 4px; margin-top: 14px; text-align: center; }
.hv-dl.is-compact .hv-dl__status { margin-top: 4px; }
.hv-dl__badge { display: none; width: 40px; height: 40px; margin-bottom: 6px; border-radius: 50%; align-items: center; justify-content: center; background: var(--hv-hover-strong); color: var(--hv-text-2); }
.hv-dl__badge .hv-i { display: none; width: 20px; height: 20px; }
.hv-dl.is-compact .hv-dl__badge { display: inline-flex; animation: hv-dl-pop 0.36s cubic-bezier(0.2, 0.9, 0.3, 1.3) both; }
.hv-dl.is-reveal .hv-dl__badge { animation-delay: 0.3s; }
.hv-dl[data-state="unpaid"] .hv-dl__badge-wait, .hv-dl[data-state="done"] .hv-dl__badge-done { display: block; }
.hv-dl[data-state="done"] .hv-dl__badge { background: var(--hv-success-soft); color: var(--hv-success); }
.hv-dl__title { font-size: 15.5px; font-weight: 650; letter-spacing: -0.01em; line-height: 1.4; color: var(--hv-text); text-wrap: balance; }
/* 「刷新」藏起来时 Delivery.js 把焦点暂放到标题上（tabindex=-1，不可交互）：不画焦点环 */
.hv-dl__title:focus { outline: none; }
/* 中文说明只在标点处折行（keep-all：手机上不把「未付款」「显示」拆成两行）；没有标点的超长一段照样会断开（break-word） */
.hv-dl__detail { max-width: 440px; font-size: 13px; line-height: 1.65; color: var(--hv-text-2); text-wrap: balance; word-break: keep-all; overflow-wrap: break-word; }
.hv-dl__ref { display: block; margin-top: 2px; color: var(--hv-text-3); }
.hv-dl__no { font-family: var(--hv-mono); font-size: 12.5px; letter-spacing: 0.03em; color: var(--hv-text); }
/* 页面隐藏 / 墨滴滚出视口：动画全部暂停（Delivery.js 同时停掉轮询和滴落） */
.hv-dl.is-paused :is(.hv-dl__orb, .hv-dl__arm, .hv-dl__core, .hv-dl__shadow), .hv-dl.is-paused .hv-dl__node::after { animation-play-state: paused; }
/* Delivery.js 让官方 query.js 重新查一次时：旧订单卡留着、不闪「正在查询」，结果一到直接换成新卡
   （官方脚本用行内 display 切换这两块，只能用 !important 压住；类名只在那一次查询期间挂在 .hv-shell 上） */
.hv-dl-requery .order-results { display: block !important; }
.hv-dl-requery .loading-state { display: none !important; }
@keyframes hv-dl-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes hv-dl-shadow { 0%, 100% { transform: scale(1); opacity: 0.12; } 50% { transform: scale(0.92); opacity: 0.08; } }
@keyframes hv-dl-breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.045); } }
@keyframes hv-dl-rot { from { transform: rotate(var(--_a, 0deg)); } to { transform: rotate(calc(var(--_a, 0deg) + 360deg)); } }
@keyframes hv-dl-arm { from { transform: translate(118px, 118px) translateX(var(--_r1, 30px)); } to { transform: translate(118px, 118px) translateX(var(--_r2, 84px)); } }
@keyframes hv-dl-halo { 0% { opacity: 0.55; transform: scale(0.8); } 100% { opacity: 0; transform: scale(1.5); } }
@keyframes hv-dl-pop { from { opacity: 0; transform: scale(0.6); } to { opacity: 1; transform: none; } }
@keyframes hv-dl-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.55; } }
@media (max-width: 767.98px) {
  .hv-dl { --_ink-size: 160px; margin-top: 16px; padding: 12px 14px 18px; }
  .hv-dl__word { font-size: 15px; }
  .hv-dl__mark { width: 18px; height: 18px; }
  .hv-dl__rail { width: min(280px, 100%); }
  .hv-dl__title { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) {
  /* 静态墨滴：卫星停在主墨团里（与 Auto 同款），不公转、不呼吸、不滴落（Delivery.js 也不播 WAAPI），节点不扩散光圈 */
  .hv-dl__orb, .hv-dl__arm, .hv-dl__core, .hv-dl__shadow, .hv-dl__node::after { animation: none !important; }
  /* 进行中只让状态字轻轻明暗呼吸，表示「还在进行」。上面全局的减弱动效规则把动画压成 0.01ms，这里按加载圈的先例单独放开 */
  .hv-theme .hv-dl:is([data-state="confirm"], [data-state="mint"], [data-state="slow"], [data-state="hold"], [data-state="help"]) .hv-dl__word { animation: hv-dl-pulse 2.4s ease-in-out infinite !important; }
  .hv-theme .hv-dl.is-paused .hv-dl__word { animation-play-state: paused !important; }
  /* 「刷新」查询中的转圈同理（与 .hv-spinner 一样只放慢）：被压停的话，按了刷新、状态没变时什么反馈都没有 */
  .hv-theme .hv-dl__refresh.is-busy .hv-i { animation-duration: 1.6s !important; animation-iteration-count: infinite !important; }
}