/* ============================================================
   数尔科技官网 · 设计令牌（v7：明暗双主题，默认浅色；浅色整体加深 + 强化动感层次）
   🔴 2026-09-29 用户新增需求：明暗切换按钮，**默认浅色**（中性专业浅底），
      记住用户手动选择（localStorage），不跟随系统。
   🔴 架构：
        :root                 = 浅色（默认命中；无 JS / 无存储 / 首访都是浅色）
        html[data-theme=dark] = 深色覆盖（v5 深色科技风的值原样搬来，视觉零变化）
      非颜色令牌（圆角/间距/容器/字体/缓动）两主题共享，只在 :root 定义一份。
   🔴 切换链路：_head.php 内联脚本在**首屏 paint 前**读 localStorage 设 data-theme（防 FOUC）；
      main.js initTheme() 负责按钮点击切换 + 写回 localStorage + 同步 aria；图标显隐纯 CSS。
   🔴 单一真相源：颜色/圆角/间距/字体/阴影只在此定义，site.css 只引用不硬编码。
   🔴 v6 新增 7 个「表面令牌」（--grid-line/--nav-bg/--drawer-bg/--viz-bg/--viz-bar/
      --float-bg/--chip-bg），收敛原 site.css 里在浅底会失效的硬编码色（白网格线/深抽屉底等）。
   🔴 v7（2026-09-29 用户："浅色再深一点，体现深色的动感和层次感"）：仅调**浅色**分支——
      背景层级整体下压+拉大跨度（#fbfcfe→#edf1f8 起）、卡片玻璃提白浮起、辉光 glow 大幅
      加强让 .orb 发光球显形（动感）、阴影加重（层次）；因底色变暗，ink-3/acc-cyan 同步调深守 AA。
      **深色分支（html[data-theme=dark]）完全不动。**
   🔴 WCAG 2.1：浅色强调色整体调深（青 #0c6a86 等），文字/链接对浅底均达 AA（脚本 _contrast_v7.js 全绿）；
      深色沿用柔和冷白（防 halation）。关键对比见各主题注释。
   ============================================================ */

:root {
    /* 原生控件（滚动条/表单）随主题：浅色 */
    color-scheme: light;

    /* ========== 共享：非颜色令牌（两主题一致，只定义一次）========== */
    --r-sm: 10px;
    --r-card: 18px;
    --r-lg: 26px;
    --r-pill: 999px;
    --sp: 8px;
    --container: 1200px;
    --gutter: 24px;
    --font:
        'Noto Sans SC', 'Source Han Sans SC', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Microsoft YaHei',
        sans-serif;
    --font-num: 'DIN Alternate', 'Roboto Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
    --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
    --dur: 0.38s;

    /* ========== 浅色主题（默认）：中性专业浅底 ========== */
    /* 背景层级：v7 整体下压 + 拉大跨度（营造纵深层次，不再是“惨白一片”）*/
    --bg-0: #edf1f8; /* 页面底：浅石板蓝（比原 #fbfcfe 加深一档半）*/
    --bg-1: #e4eaf4; /* section 交替底 / 页脚 */
    --bg-2: #d8e1ee; /* 抬升面板 / 表头 / 数据带 */
    --bg-3: #cbd6e6; /* 更高抬升 / hover 底 */

    /* 玻璃拟态（v7：卡片提白到近纯白，在加深的浅底上明显浮起 = 层次感）*/
    --glass: rgba(255, 255, 255, 0.94);
    --glass-2: rgba(255, 255, 255, 0.99);
    --line: rgba(15, 23, 42, 0.13);
    --line-2: rgba(15, 23, 42, 0.22);

    /* 强调色：青→蓝→靛→紫（v7：背景加深后 acc-cyan 再调深守住 AA）*/
    --acc-cyan: #0c6a86; /* 文字/链接：bg-0 5.42 / bg-1 5.08 / bg-2 4.65，均 AA */
    --acc-blue: #0369a1;
    --acc-indigo: #4f46e5;
    --acc-violet: #7c3aed;
    /* 主渐变：品牌识别核心。浅底用深调，保证 .btn-primary 上的白字对比充足 */
    --grad: linear-gradient(120deg, #0e7490 0%, #4338ca 52%, #6d28d9 100%);
    --grad-soft: linear-gradient(
        120deg,
        rgba(8, 145, 178, 0.1),
        rgba(79, 70, 229, 0.1) 52%,
        rgba(124, 58, 237, 0.1)
    );
    /* 辉光（v7：大幅加强，让 .orb 发光球在浅底显形 = 动感；仍是柔化淡彩非霓虹）*/
    --glow-cyan: rgba(8, 145, 178, 0.3);
    --glow-indigo: rgba(79, 70, 229, 0.28);
    --glow-violet: rgba(124, 58, 237, 0.26);

    /* 文字：冷调 slate 阶（v7：ink-3 调深，因背景加深后原 #64748b 会跌破 AA）*/
    --ink-1: #0f172a; /* 主文字（标题）bg-0 15.76:1 */
    --ink-2: #475569; /* 次文字（正文/描述）bg-0 6.69:1 */
    --ink-3: #556377; /* 弱文字（时间/版权/元信息）bg-0 5.39 / bg-2 4.63，仍达 AA */
    --on-acc: #ffffff; /* 深强调底（渐变）上的白字 */

    /* 语义色 */
    --ok: #059669;
    --warn: #d97706;

    /* 阴影（v7：加重投影，卡片在加深底上浮起更强 = 层次/动感）*/
    --shadow-card: 0 10px 30px rgba(15, 23, 42, 0.13);
    --shadow-lift: 0 24px 56px rgba(15, 23, 42, 0.2);

    /* ---- v6 表面令牌（v7 随浅色加深微调；深色在下方覆盖）---- */
    --grid-line: rgba(15, 23, 42, 0.06); /* 背景网格线（略提，加深底上仍可见科技感）*/
    --nav-bg: rgba(255, 255, 255, 0.88); /* 吸顶导航底（毛玻璃，提白浮于内容之上）*/
    --drawer-bg: #ffffff; /* 移动抽屉底：实心，杜绝 hero 文字透穿 */
    --viz-bg: linear-gradient(160deg, #ffffff, #eaf0f8); /* Hero 仪表盘玻璃 */
    --viz-bar: rgba(15, 23, 42, 0.12); /* 仪表盘 KPI 占位条 */
    --float-bg: rgba(255, 255, 255, 0.95); /* 浮标底 */
    --chip-bg: rgba(15, 23, 42, 0.05); /* 标签 / 弱底 chip */
}

/* ============================================================
   深色主题（覆盖）：v5 深色科技风，颜色值原样保留，视觉零变化。
   仅覆盖**颜色类**令牌；圆角/间距/字体/缓动沿用 :root。
   ============================================================ */
html[data-theme='dark'] {
    color-scheme: dark;

    /* 背景层级：由深到浅 */
    --bg-0: #080b14;
    --bg-1: #0c111d;
    --bg-2: #111a2b;
    --bg-3: #18223a;

    /* 玻璃拟态 */
    --glass: rgba(255, 255, 255, 0.035);
    --glass-2: rgba(255, 255, 255, 0.06);
    --line: rgba(255, 255, 255, 0.08);
    --line-2: rgba(255, 255, 255, 0.15);

    /* 强调色：青→蓝→靛→紫（霓虹，深底高对比）*/
    --acc-cyan: #22d3ee; /* ≈10.9:1 */
    --acc-blue: #38bdf8;
    --acc-indigo: #6366f1;
    --acc-violet: #a855f7;
    --grad: linear-gradient(120deg, #22d3ee 0%, #6366f1 52%, #a855f7 100%);
    --grad-soft: linear-gradient(
        120deg,
        rgba(34, 211, 238, 0.14),
        rgba(99, 102, 241, 0.14) 52%,
        rgba(168, 85, 247, 0.14)
    );
    --glow-cyan: rgba(34, 211, 238, 0.4);
    --glow-indigo: rgba(99, 102, 241, 0.38);
    --glow-violet: rgba(168, 85, 247, 0.32);

    /* 文字：柔和冷白阶（防光晕）*/
    --ink-1: #eef2f8; /* ≈16:1 */
    --ink-2: #a7b2c4; /* ≈8.6:1 */
    --ink-3: #808da0; /* ≈5.9:1 */
    --on-acc: #04101a; /* 亮强调底上的深字 */

    --ok: #34d399;
    --warn: #fbbf24;

    --shadow-card: 0 8px 30px rgba(0, 0, 0, 0.35);
    --shadow-lift: 0 20px 55px rgba(0, 0, 0, 0.5);

    /* v6 表面令牌（深色值 = 原 site.css 硬编码值，行为不变）*/
    --grid-line: rgba(255, 255, 255, 0.028);
    --nav-bg: rgba(8, 11, 20, 0.72);
    --drawer-bg: #0c111d; /* 实心，杜绝透穿（顺带修 v5 移动抽屉半透明瑕疵）*/
    --viz-bg: linear-gradient(160deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.02));
    --viz-bar: rgba(255, 255, 255, 0.14);
    --float-bg: rgba(12, 17, 29, 0.85);
    --chip-bg: rgba(255, 255, 255, 0.04);
}
