/* ============================================
   小头盔 xiaotoukui - 基础样式 · 清爽海洋风
   精细化 CSS reset + 全局设计令牌
   ============================================ */

:root {
    /* 品牌主色 - 海洋蓝青（渐变自深海军蓝到碧潮青） */
    --hc-primary: #7C3AED;          /* 主色 cyan-700，链接/强调 */
    --hc-primary-dark: #6D28D9;     /* 深色 cyan-800 */
    --hc-deep: #2D1B4E;             /* 深海墨蓝，暗色表面用 */
    --hc-primary-light: #A78BFA;    /* 浅潮 sky-300（=阶300，历史名保留） */
    --hc-primary-50: #F5F3FF;       /* 极浅海洋底 */
    --hc-primary-100: #EDE9FE;      /* 浅海洋底 */
    /* 阶梯补全（2026-09-09 令牌化：common/index/buy 历次改版沉淀的硬编码收编，
       值=原字面量逐一分毫不差——漂移色先入册再等设计收敛，勿直接改值） */
    --hc-primary-150: #E9D5FF;
    --hc-primary-200: #C4B5FD;
    --hc-primary-400: #8B5CF6;
    --hc-primary-500: #A855F7;
    --hc-primary-800: #5B21B6;
    --hc-pink: #EC4899;             /* 碧潮粉（品牌渐变伙伴色，独立用时引它） */

    /* 品牌渐变（按钮/标题/主视觉） */
    --hc-grad: linear-gradient(135deg, #7C3AED 0%, #EC4899 100%);      /* 深海 → 碧潮 */
    --hc-grad-hover: linear-gradient(135deg, #6D28D9 0%, #DB2777 100%);
    --hc-grad-deep: linear-gradient(135deg, #2D1B4E 0%, #4C1D95 55%, #831843 100%);

    /* 辅助色 */
    --hc-accent: #F97316;           /* 日落橙（热销/点缀） */
    --hc-success: #0D9488;          /* 潮汐青绿（自动发货状态） */
    --hc-warning: #D97706;          /* 琥珀（人工处理状态） */
    --hc-danger: #E11D48;           /* 珊瑚红（错误/价格） */
    --hc-price: #E11D48;            /* 价格专用 */

    /* 状态色阶（订单状态/提示底色；红色系与 --hc-danger 的珊瑚红不同 hue，是既有页面语义） */
    --hc-danger-50: #FFF1F2;
    --hc-danger-100: #FEE2E2;
    --hc-danger-300: #FDA4AF;
    --hc-danger-400: #EF4444;
    --hc-danger-600: #DC2626;
    --hc-danger-700: #B91C1C;
    --hc-danger-800: #9F1239;
    --hc-warning-50: #FFF7ED;
    --hc-warning-bright: #F59E0B;
    --hc-warning-700: #B45309;

    /* 第三方品牌色（OAuth 按钮/支付图标底）——不是本站主题色，换肤不动它们 */
    --hc-oauth-facebook: #1877F2;
    --hc-oauth-google: #4285F4;
    /* 支付通道品牌色（页脚通道胶囊圆点，2026-09-18 页脚精细化） */
    --hc-pay-stripe: #7A73FF;
    --hc-pay-alipay: #3D9BFF;
    --hc-pay-wechat: #2BD176;
    --hc-pay-card: #FFB020;

    /* 中性色（带海洋调） */
    --hc-bg: #FAFAFB;               /* 页面背景（呼吸感海雾白） */
    --hc-bg-alt: #F4F2F8;           /* 次背景 */
    --hc-scroll-track: #EFEBFA;     /* 滚动条轨道（2026-10-12 滚动条品牌化：原吃 bg-alt 在暗色近黑） */
    --hc-surface: #FFFFFF;
    --hc-on-brand: #FFFFFF;         /* 彩色底上的文字/图标（暗色模式下不随 surface 翻转！） */
    --hc-surface-2: #FAFAFC;        /* 近白底漂移变体（待设计收敛，收敛后删） */
    --hc-surface-3: #FCFBFF;
    --hc-bg-2: #F6F4FB;
    --hc-bg-3: #FAFCFD;
    --hc-border: #ECEAF2;           /* 边框 */
    --hc-line-2: #EDE7FB;           /* 紫调边框漂移变体（border 专用，同上待收敛） */
    --hc-line-3: #F1EDF9;
    --hc-line-4: #F0EDF8;
    --hc-line-5: #E5E0F5;
    --hc-line-6: #D6CBEA;
    --hc-line-7: #D8CCF7;
    --hc-text: #1E1B2E;             /* 主文字（深海墨） */
    --hc-text-secondary: #5B5772;   /* 次文字 */
    --hc-text-secondary-2: #6B6480; /* 次文字漂移变体 */
    --hc-text-muted: #9D98AD;       /* 弱文字 */
    --hc-text-muted-2: #B6B1C7;     /* 弱文字漂移变体 */

    /* 令牌化二期（暗色模式前置，2026-09-09）：残余单次字面量全部入册，值=原字面量。
       渐变停靠点也走令牌（ticker/totalrow/newbie 三组），暗色块统一覆盖。 */
    --hc-line-8: #DCCFF5;
    --hc-line-9: #F3EEFF;
    --hc-line-10: #E6DFF9;
    --hc-line-11: #D8C8F2;
    --hc-line-12: #DCD3F5;
    --hc-line-13: #F5F1FA;
    --hc-line-14: #CFC6E4;
    --hc-line-15: #DDD6FE;
    --hc-line-16: #E4DBF9;
    --hc-line-17: #E6DDF9;
    --hc-line-18: #D6CDEF;
    --hc-line-neutral: #E5E5E5;
    --hc-bg-4: #F1EEFA;
    --hc-bg-5: #F1F0F3;
    --hc-bg-6: #E8E8EA;
    --hc-surface-4: #F9F7FF;
                                       暗色不用这组令牌——base.css 暗色块有整套玻璃覆盖 */
    --hc-totalrow-1: #F8F5FF;
    --hc-totalrow-2: #FDFBFF;
    --hc-newbie-1: #FAF8FF;
    --hc-newbie-2: #F5F0FF;
    --hc-danger-bg: #FEF2F2;
    --hc-danger-line: #FECACA;
    --hc-success-bg: #E1F5EE;
    --hc-success-bg-2: #E6F7F4;
    --hc-info-bg: #E0F2FE;
    --hc-info: #0EA5E9;
    --hc-success-bright: #10B981;
    --hc-success-700: #0F766E;
    --hc-success-800: #0F6E56;
    --hc-warning-300: #FDBA74;
    --hc-warning-800: #9A3412;
    --hc-warning-900: #854F0B;
    --hc-warning-200: #FED7AA;      /* 状态框边框（errors 提示条等，2026-09-15 暗色批次收编） */
    --hc-gold-50: #FFFBEB;          /* 金卡底（会员条/优惠券 amber 族漂移收编，2026-09-15） */
    --hc-gold-100: #FEF3C7;
    --hc-gold-200: #FDE68A;         /* 金卡边框（黑金徽章文字处的同值字面量有意保留——彩色底不翻转） */
    --hc-gold-700: #A16207;
    --hc-gold-800: #92400E;
    --hc-danger-900: #BE123C;
    --hc-primary-text: #534AB7;
    --hc-pink-400: #F472B6;
    --hc-accent-400: #FF6A3D;
    --hc-oauth-facebook-hover: #166FE5;
    --hc-text-muted-3: #6B7280;
    --hc-text-faint: #C9C4D6;
    --hc-typing-dot: #B9AEE8;
    --hc-chat-av-1: #7C8BA8;
    --hc-chat-av-2: #5B6B88;

    /* 阴影（蓝调、分层、更柔） */
    --hc-shadow-sm: 0 1px 2px 0 rgba(30, 27, 46, 0.05);
    --hc-shadow: 0 1px 3px 0 rgba(30, 27, 46, 0.08), 0 1px 2px 0 rgba(30, 27, 46, 0.04);
    --hc-shadow-md: 0 4px 12px -2px rgba(30, 27, 46, 0.08), 0 2px 4px -1px rgba(30, 27, 46, 0.04);
    --hc-shadow-lg: 0 14px 32px -8px rgba(30, 27, 46, 0.14), 0 4px 8px -3px rgba(30, 27, 46, 0.05);
    --hc-shadow-primary: 0 4px 14px -2px rgba(124, 58, 237, 0.35);

    /* 圆角（更通透的大圆角） */
    --hc-radius-sm: 8px;
    --hc-radius: 12px;
    --hc-radius-lg: 16px;
    --hc-radius-xl: 20px;
    --hc-radius-full: 9999px;

    /* 过渡 */
    --hc-transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    --hc-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

em, i { font-style: normal; }
li { list-style: none; }

img {
    border: 0;
    vertical-align: middle;
    max-width: 100%;
}

button { cursor: pointer; }

a {
    color: var(--hc-primary);
    text-decoration: none;
    transition: var(--hc-transition);
}

a:hover {
    color: var(--hc-primary-dark);
    text-decoration: none;
}

button, input {
    font-family: inherit;
    border: 0;
}

/* 2026-09-17 审计修复 S5：原全局 button,input{outline:none} 连键盘焦点环一并抹掉
   （Tab 导航无任何视觉指示）。改为只在"非键盘焦点"（:not(:focus-visible)，即鼠标
   点击）时去轮廓；键盘焦点统一给 2px 主色环——--hc-primary 亮暗双主题各自定义
   （暗色块提亮为 #8B5CF6），双主题对比度均安全 */
button:focus:not(:focus-visible),
input:focus:not(:focus-visible) {
    outline: none;
}

:focus-visible {
    outline: 2px solid var(--hc-primary);
    outline-offset: 2px;
}

/* Inter：拉丁/数字品牌字体（与 App 端一致，variable 单文件全字重）。
   仅拉丁码位生效（unicode-range），中文继续走系统字体栈——零中文字体成本。
   swap 异步换入不阻塞首屏；自托管不依赖 Google CDN（国内不可达）。 */
@font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("../fonts/InterVariable-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
                   U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
                   U+2212, U+2215, U+FEFF, U+FFFD;
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background-color: var(--hc-bg);
    /* 海雾层：右上角一抹极浅的潮光，让白底不呆板 */
    background-image:
        radial-gradient(900px 320px at 85% -60px, rgba(196, 181, 253, 0.10), transparent 65%),
        radial-gradient(700px 260px at 0% 160px, rgba(236, 72, 153, 0.05), transparent 60%);
    background-repeat: no-repeat;
    color: var(--hc-text);
    font: 14px/1.65 "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
          "HarmonyOS Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
    text-rendering: optimizeLegibility;
}

/* 价格/数字统一等宽数字，表格感更精细 */
.hc-num,
.hc-buy-total-price,
.hc-goods-price,
.hc-goods-mini-price,
.hc-news-price,
.hc-hot-chip-price,
.hc-search-item-price {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
}

h1, h2, h3, h4, h5, h6 { letter-spacing: -0.3px; }

/* 旧 .hide/.none 工具类已删（views 零引用，bootstrap 自带 d-none） */

/* 选中文本颜色 */
::selection {
    background: var(--hc-primary-100);
    color: var(--hc-primary-dark);
}

/* 滚动条 - 品牌紫系（2026-10-12 重设计：原轨道吃 --hc-bg-alt，暗色 #1A1628
   读作纯黑。轨道改专属令牌 --hc-scroll-track——暗色深紫罗兰、亮色薄雾薰衣草；
   滑块改「悬浮胶囊」：两侧 2px 透明内缩 + 全圆角，thumb 离轨道四边留呼吸。
   Firefox 走 scrollbar-color 同口径（thumb 紫阶/轨道同令牌） */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--hc-scroll-track); }
::-webkit-scrollbar-thumb {
    background: var(--hc-primary-200);
    border-radius: 8px;
    border: 2px solid transparent;
    background-clip: padding-box;
}
::-webkit-scrollbar-thumb:hover { background-color: var(--hc-primary-light); }
html { scrollbar-color: var(--hc-primary-200) var(--hc-scroll-track); }

/* 旧 .text-truncate-2 工具类已删（views 零引用） */

/* 全局减少动效偏好 */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

/* ============================================
   动效基座 · 进场编排 + 骨架屏
   hc-motion 由 JS 添加：脚本不跑则完全不隐藏（无 JS 安全）
   ============================================ */

/* 滚动进场：下移淡入（克制版） */
html.hc-motion [data-reveal] {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity 0.6s var(--hc-ease-out), transform 0.6s var(--hc-ease-out);
    transition-delay: var(--reveal-d, 0ms);
}

html.hc-motion [data-reveal].revealed {
    opacity: 1;
    transform: none;
}

/* 回场轻落（2026-10-11 向上滚动补动画）：已进场元素完全离屏后回退到「自上
   轻落」起始态——与向上滚动回看的进入方向（视口上缘）一致。transition 的
   时长/delay 由目标态规则决定，故时长收敛挂在 .hc-seen.revealed（离过屏的
   回场）而非起始态；商品卡的 40ms 同排 stagger 仍由 index.css 的
   #goodsTabContent 规则（含 id 特异性更高）保留，依次落下；页脚等 --reveal-d
   延迟在此清零（回看不等待）。reduced-motion 由上方全局
   transition-duration:0.01ms 兜底自动失效 */
html.hc-motion [data-reveal].hc-seen:not(.revealed) {
    transform: translateY(-12px);
}

html.hc-motion [data-reveal].hc-seen.revealed {
    transition-duration: 0.32s;
    transition-delay: 0ms;
}

/* 骨架屏（AJAX 面板加载态） */
.hc-skel {
    position: relative;
    overflow: hidden;
    background: var(--hc-primary-100);
    border-radius: 10px;
}

.hc-skel::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(100deg, transparent 32%, rgba(255, 255, 255, 0.8) 50%, transparent 68%);
    transform: translateX(-100%);
    animation: hc-skel 1.25s ease-in-out infinite;
}

@keyframes hc-skel {
    to { transform: translateX(100%); }
}

/* 面板骨架布局（模仿购买面板形） */
.hc-skel-panel {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px;
    background: var(--hc-surface);
    border: 1px solid var(--hc-border);
    border-radius: var(--hc-radius-lg);
}

.hc-skel-panel .hc-skel-head {
    display: flex;
    gap: 12px;
    align-items: center;
}

/* 通用上浮进场关键帧（hero 编排复用） */
@keyframes hc-rise {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: none; }
}

/* 打勾描画（订单成功态） */
@keyframes hc-draw {
    to { stroke-dashoffset: 0; }
}

/* 空状态 emoji 轻浮动（_empty_state 组件挂 hc-emoji-bob；与首页 hc-float 同呼吸语言，
   空列表页不再死气沉沉。inline-block 供 transform 生效——个别页面自带 display:block
   覆盖亦兼容；reduced-motion 基座自动降级为静止） */
.hc-emoji-bob { display:inline-block; animation:hc-emoji-bob 3.2s ease-in-out infinite; }
@keyframes hc-emoji-bob {
    0%, 100% { transform:translateY(0); }
    50%      { transform:translateY(-7px); }
}

/* ============================================
   潮汐主按钮 .hc-btn-tide
   全站下单/支付按钮统一动效：渐变底 + 内高光 + 光泽扫过 + 悬浮上移 + 按压反馈。
   组件类只负责尺寸/排版（如 .hc-buy-submit 的宽度字号），视觉与动效全在这里。
   ============================================ */
.hc-btn-tide {
    position: relative;
    overflow: hidden;
    border: none;
    color: #fff;
    font-weight: 700;
    letter-spacing: 1px;
    background: var(--hc-grad);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), var(--hc-shadow-primary);
    transition: transform 0.15s, box-shadow 0.25s, opacity 0.2s;
    -webkit-tap-highlight-color: transparent;
    text-decoration: none;
}

/* 光泽层：hover 从左扫到右 */
.hc-btn-tide::after {
    content: "";
    position: absolute;
    top: 0;
    left: -80%;
    width: 50%;
    height: 100%;
    background: linear-gradient(105deg, transparent, rgba(255, 255, 255, 0.35), transparent);
    transform: skewX(-20deg);
    transition: left 0.6s ease;
    pointer-events: none;
}

.hc-btn-tide:hover {
    color: #fff;
    transform: translateY(-1px);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), 0 10px 24px -6px rgba(124, 58, 237, 0.55);
    text-decoration: none;
}

.hc-btn-tide:hover::after { left: 130%; }

.hc-btn-tide:active { transform: scale(0.985); }

.hc-btn-tide:focus-visible {
    outline: none;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), 0 0 0 3px rgba(124, 58, 237, 0.35);
}

.hc-btn-tide:disabled,
.hc-btn-tide[disabled] {
    opacity: 0.55;
    cursor: not-allowed;
    transform: none;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.hc-btn-tide:disabled::after { display: none; }

/* ============================================
   暗色主题 · 深海夜潮（2026-09-09，令牌体系验收战）
   机制：html[data-theme="dark"]——由 _header 头部 FOUC 脚本按
   localStorage('hc_theme_v2') ?? 后台配置（防白闪；2026-10-07 键升 v2、优先级见 _header）；
   导航切换按钮改属性，全站只此一块，组件层零改动。
   ============================================ */
html[data-theme="dark"] {
    color-scheme: dark;

    /* 品牌紫在暗底上提亮一档（对比度），hover 走更亮而非更深 */
    --hc-primary: #8B5CF6;
    --hc-primary-dark: #A78BFA;
    --hc-primary-light: #C4B5FD;
    --hc-primary-50: #2A2144;        /* 浅底阶全部翻成暗紫表面 */
    --hc-primary-100: #312653;
    --hc-primary-150: #3A2D66;
    --hc-primary-200: #453678;
    --hc-primary-400: #A78BFA;
    --hc-primary-500: #A855F7;
    --hc-primary-800: #C4B5FD;       /* 深紫文字在暗底不可读 → 反转为亮 */
    --hc-primary-text: #A78BFA;
    --hc-deep: #1F1540;

    /* 状态色：可读性优先（文本色提亮、底色压成暗色表面） */
    --hc-danger: #FB7185;
    --hc-price: #FB7185;
    --hc-danger-50: #3A1D2B;
    --hc-danger-100: #452232;
    --hc-danger-300: #7A3B4C;
    --hc-danger-400: #F87171;
    --hc-danger-600: #EF4444;
    --hc-danger-700: #F87171;
    --hc-danger-800: #FDA4AF;
    --hc-danger-900: #9F1239;
    --hc-danger-bg: #3A1D2B;
    --hc-danger-line: #5C2B3A;
    --hc-warning: #F59E0B;
    --hc-warning-50: #3A2A14;
    --hc-warning-300: #8A5A24;
    --hc-warning-bright: #FBBF24;
    --hc-warning-700: #FDBA74;
    --hc-warning-800: #FDBA74;
    --hc-warning-900: #FCD34D;
    --hc-warning-200: #6E4A18;      /* 状态框边框压暗 */
    --hc-gold-50: #33270D;          /* 金卡族翻转：浅金底 → 暗金表面，深金文字 → 亮金 */
    --hc-gold-100: #3E3012;
    --hc-gold-200: #6B521C;
    --hc-gold-700: #FCD34D;
    --hc-gold-800: #FDE68A;
    --hc-success: #2DD4BF;
    --hc-success-bg: #12352F;
    --hc-success-bg-2: #12352F;
    --hc-success-bright: #34D399;
    --hc-success-700: #5EEAD4;
    --hc-success-800: #99F6E4;
    --hc-info: #38BDF8;
    --hc-info-bg: #0E2C40;

    /* 深海墨底：页面/表面/边框/文字全族翻转 */
    --hc-bg: #14101F;
    --hc-bg-alt: #1A1628;
    --hc-scroll-track: #221C3E;     /* 深紫罗兰轨道（非黑，随品牌紫阶） */
    --hc-bg-2: #1C172C;
    --hc-bg-3: #181424;
    --hc-bg-4: #262040;
    --hc-bg-5: #262232;
    --hc-bg-6: #2C2937;
    --hc-surface: #1E1930;
    --hc-surface-2: #1B162C;
    --hc-surface-3: #201B34;
    --hc-surface-4: #292246;
    --hc-border: #2E2848;
    --hc-line-2: #2C2645;
    --hc-line-3: #2A2440;
    --hc-line-4: #2A2440;
    --hc-line-5: #332C52;
    --hc-line-6: #3A335C;
    --hc-line-7: #383058;
    --hc-line-8: #3B3360;
    --hc-line-9: #2D2747;
    --hc-line-10: #332C52;
    --hc-line-11: #3E3564;
    --hc-line-12: #37305A;
    --hc-line-13: #2B2543;
    --hc-line-14: #413A68;
    --hc-line-15: #3E3672;
    --hc-line-16: #332B55;
    --hc-line-17: #342D57;
    --hc-line-18: #3C3563;
    --hc-line-neutral: #36323F;
    --hc-text: #ECE8F8;
    --hc-text-secondary: #B3ADCB;
    --hc-text-secondary-2: #A8A2C2;
    --hc-text-muted: #807A9C;
    --hc-text-muted-2: #6C6688;
    --hc-text-muted-3: #8D8998;
    --hc-text-faint: #7A7492;

    /* 渐变停靠点：浅色带 → 暗紫带 */
    --hc-totalrow-1: #251D4A;
    --hc-totalrow-2: #1D1640;
    --hc-newbie-1: #262047;
    --hc-newbie-2: #211C3D;

    /* 阴影：蓝调淡影 → 黑基调重影（暗色下阴影要敢重） */
    --hc-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.35);
    --hc-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.45), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
    --hc-shadow-md: 0 4px 12px -2px rgba(0, 0, 0, 0.45), 0 2px 4px -1px rgba(0, 0, 0, 0.3);
    --hc-shadow-lg: 0 14px 32px -8px rgba(0, 0, 0, 0.55), 0 4px 8px -3px rgba(0, 0, 0, 0.35);

    /* 不翻转：--hc-on-brand（彩色底上的白字）、--hc-grad 渐变族、
       --hc-oauth-*（第三方品牌色）、--hc-pink/-400、--hc-accent/-400、
       --hc-chat-av-1/2、--hc-typing-dot（灰蓝/浅紫在暗底同样成立） */
}

/* bootstrap 5.1 无 data-bs-theme（5.3+ 才有）：手工覆盖站点实际用到的组件面 */
html[data-theme="dark"] .modal-content { background: var(--hc-surface); border: 1px solid var(--hc-border); }
html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .modal-footer { border-color: var(--hc-border); }
html[data-theme="dark"] .btn-close { filter: invert(1) grayscale(100%) brightness(160%); }
html[data-theme="dark"] .form-control {
    background: var(--hc-bg);
    border-color: var(--hc-border);
    color: var(--hc-text);
}
html[data-theme="dark"] .form-control::placeholder { color: var(--hc-text-muted); }
html[data-theme="dark"] .dropdown-menu {
    background: var(--hc-surface);
    border: 1px solid var(--hc-border);
    box-shadow: var(--hc-shadow-lg);
}
html[data-theme="dark"] .dropdown-item { color: var(--hc-text-secondary); }
html[data-theme="dark"] .dropdown-item:hover, html[data-theme="dark"] .dropdown-item:focus {
    background: var(--hc-bg-4);
    color: var(--hc-text);
}
html[data-theme="dark"] .dropdown-item.active { background: var(--hc-primary); color: var(--hc-on-brand); }

/* 顶部桅杆毛玻璃：光=白雾玻璃，暗=紫夜渐层玻璃（4d70ee1 暗色上线时漏网的白条，
   2026-09-15 次要页面批次抓出——所有页面共用，非次要页专用。
   2026-10-08 桅杆重设计四版（用户「看不出变化」）：三版 @property 微振幅是环境光级
   肉眼难辨；四版加主角——极光横幔：超宽多段渐变线性匀速横扫，首尾同色无缝循环，
   颜色旅程一眼可见；纵向渐层与辉光巡游保留为底层结构。
   同日 v5 换色（用户三连否决焦糖棕「跟网站不匹配/不好看/不喜欢」，全站是紫夜色系）：
   龟壳暖调整体退役，极光横幔结构保留、配色回到品牌紫粉渐变族——顶栏从此与
   全站同色相。@property 不支持的老浏览器回落静态渐层 */
@property --hc-mast-glow-x { syntax: '<percentage>'; inherits: false; initial-value: 30%; }
@property --hc-mast-top { syntax: '<color>'; inherits: false; initial-value: rgba(44, 34, 74, 0.95); }
html[data-theme="dark"] .hc-masthead {
    background:
        linear-gradient(90deg,
            rgba(124, 58, 237, 0.34) 0%,
            rgba(167, 139, 250, 0.30) 25%,
            rgba(240, 171, 252, 0.26) 50%,
            rgba(236, 72, 153, 0.30) 75%,
            rgba(124, 58, 237, 0.34) 100%),
        radial-gradient(52% 90% at var(--hc-mast-glow-x) -12%, rgba(167, 139, 250, 0.16), transparent 68%),
        linear-gradient(180deg,
            var(--hc-mast-top) 0%,
            rgba(34, 26, 56, 0.93) 48%,
            rgba(24, 18, 36, 0.94) 100%);
    background-size:300% 100%, 100% 100%, 100% 100%;
    backdrop-filter:saturate(170%) blur(18px);
    -webkit-backdrop-filter:saturate(170%) blur(18px);
    box-shadow: 0 6px 24px -18px rgba(0, 0, 0, 0.55);
    animation:
        hc-mast-aurora 14s linear infinite,
        hc-mast-glow 12s ease-in-out infinite alternate,
        hc-mast-tone 10s ease-in-out infinite alternate;
}
/* 极光横幔：只动第一层（300% 超宽画布 0→200% 全程横扫，循环首尾同色无跳变；
   其余两层 position 钉 0 不参与 */
@keyframes hc-mast-aurora {
    from { background-position: 0% 0%, 0% 0%, 0% 0%; }
    to   { background-position: 200% 0%, 0% 0%, 0% 0%; }
}
/* 辉光巡游：浅紫光斑从左上缓移到右上再折返 */
@keyframes hc-mast-glow {
    from { --hc-mast-glow-x: 22%; }
    to   { --hc-mast-glow-x: 78%; }
}
/* 壳色涨落：上缘在深靛紫与亮紫之间深浅呼吸（振幅保持肉眼可辨档） */
@keyframes hc-mast-tone {
    from { --hc-mast-top: rgba(44, 34, 74, 0.95); }
    to   { --hc-mast-top: rgba(64, 50, 104, 0.95); }
}
/* 减动效：颜色巡游停摆，回落静态紫夜渐层（海平线流光沿用既有无守卫行为）；
   冠沿跑马灯同守卫（2026-10-08 起与桅杆共享动画） */
@media (prefers-reduced-motion: reduce) {
    html[data-theme="dark"] .hc-masthead,
    }
html[data-theme="dark"] body.hc-scrolled .hc-masthead {
    box-shadow: 0 10px 30px -16px rgba(0, 0, 0, 0.65);
}

/* 结算页信任条对勾（inline fill 深绿）与杂项主题向 SVG：CSS fill 优先级高于呈现属性 */
html[data-theme="dark"] .hc-bill-trust-item svg path { fill: var(--hc-success-700); }

/* 主题切换按钮：日月双图标由属性切换显隐（默认无 data-theme = 亮色）。
   2026-09-09 用户拍板：切换按钮隐藏（暗色模式本身保留——FOUC 脚本仍按
   localStorage/系统偏好生效，恢复入口=删下面这条 display:none） */
.hc-theme-toggle { display: none !important; }
.hc-theme-toggle svg { display: none; }
html:not([data-theme="dark"]) .hc-theme-toggle .hc-theme-moon { display: block; }
html[data-theme="dark"] .hc-theme-toggle .hc-theme-sun { display: block; }


/* ============================================
   全页氛围光（2026-10-05 终版：挂 body 上，用户纠正自 main-container）
   光晕+纸感噪点铺满视口，混合模式轻染内容不遮挡；80s 慢漂；
   浓度为中性视觉核验可见档（白底 multiply 26/20/16%，黑底 screen 22/16/12%）
   ============================================ */
body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        radial-gradient(42% 55% at 18% 22%, rgba(124, 58, 237, 0.22), transparent 70%),
        radial-gradient(38% 48% at 82% 30%, rgba(77, 190, 255, 0.16), transparent 70%),
        radial-gradient(46% 56% at 55% 88%, rgba(236, 72, 153, 0.13), transparent 72%),
        url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='240'%20height='240'%3E%3Cfilter%20id='n'%3E%3CfeTurbulence%20type='fractalNoise'%20baseFrequency='0.9'%20numOctaves='2'/%3E%3CfeColorMatrix%20type='saturate'%20values='0'/%3E%3C/filter%3E%3Crect%20width='240'%20height='240'%20filter='url(%23n)'%20opacity='0.04'/%3E%3C/svg%3E");
    background-size: auto, auto, auto, 240px 240px;
}
html[data-theme="dark"] body::before {
    background:
        radial-gradient(42% 55% at 18% 22%, rgba(139, 92, 246, 0.20), transparent 70%),
        radial-gradient(38% 48% at 82% 30%, rgba(77, 227, 255, 0.15), transparent 70%),
        radial-gradient(46% 56% at 55% 88%, rgba(236, 72, 153, 0.10), transparent 72%),
        url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='240'%20height='240'%3E%3Cfilter%20id='n'%3E%3CfeTurbulence%20type='fractalNoise'%20baseFrequency='0.9'%20numOctaves='2'/%3E%3CfeColorMatrix%20type='saturate'%20values='0'/%3E%3C/filter%3E%3Crect%20width='240'%20height='240'%20filter='url(%23n)'%20opacity='0.05'/%3E%3C/svg%3E");
    background-size: auto, auto, auto, 240px 240px;
}
/* 2026-10-06 性能回收：撤 mix-blend-mode 与 90s 动画（每帧全页重合成的元凶），静态底层零帧成本 */

/* 光标系统已退役（2026-10-06 用户拍板恢复默认鼠标）；hc-cursor.js 保留备查、无引用 */