/* ============================================================
   tokens.css — 用户端全站设计令牌（单一真相源）
   ------------------------------------------------------------
   P 体系收敛（2026-09-23 审查落地）：五页（index/direct/redeem/
   login/hub）各自维护 ~40 行调色板且已漂移（redeem 曾缺
   --primary-strong/--shadow-lg，暗色顶栏 hover 几不可见）。
   本文件收口全部颜色/阴影/圆角令牌；各页 :root 块删除，改为
   引用本文件（页面专属令牌仍可页面内追加）。

   优先级约定（与 topbar.js 主题三件套配合）：
   1) :root（浅色默认）  2) @media(prefers-color-scheme: dark)
   3) [data-theme="dark"] / [data-theme="light"]（手动切换，最高）
   手动块必须与 media 块值一致（data-theme 覆盖系统偏好）。
   值口径：与收敛前五页交集值逐一相同（零视觉变化迁移）。
   ============================================================ */

:root {
    /* 表面与背景 */
    --bg: #f5f7fa;
    --surface: #ffffff;
    --surface-2: #f8fafc;

    /* 品牌（靛蓝系） */
    --primary: #4f46e5;
    --primary-weak: #eef2ff;
    --primary-strong: #4338ca;

    /* 文字 */
    --text: #0f172a;
    --text-2: #64748b;
    --muted: #94a3b8;

    /* 边框 */
    --border: #e2e8f0;
    --border-strong: #cbd5e1;

    /* 语义色 */
    --success: #16a34a;  --success-bg: #dcfce7;
    --warning: #d97706;  --warning-bg: #fef3c7;
    --error:   #dc2626;  --error-bg:   #fee2e2;
    --amber: #f59e0b;

    /* Key 框（琥珀底） */
    --key-bg: #fffbeb;
    --key-fg: #92400e;
    --key-border: #fde68a;

    /* 圆角 */
    --radius: 16px;
    --radius-sm: 10px;

    /* 阴影（两档） */
    --shadow: 0 1px 3px rgba(15, 23, 42, .08), 0 1px 2px rgba(15, 23, 42, .04);
    --shadow-lg: 0 8px 30px rgba(15, 23, 42, .14), 0 2px 8px rgba(15, 23, 42, .08);
}

/* ---------- 跟随系统：暗色 ---------- */
@media (prefers-color-scheme: dark) {
    :root {
        --bg: #0b1120;
        --surface: #1e293b;
        --surface-2: #172033;

        --primary: #818cf8;
        --primary-weak: #312e81;
        --primary-strong: #a5b4fc;

        --text: #e2e8f0;
        --text-2: #94a3b8;
        --muted: #64748b;

        --border: #334155;
        --border-strong: #475569;

        --success: #22c55e;  --success-bg: #14532d;
        --warning: #fbbf24;  --warning-bg: #78350f;
        --error:   #f87171;  --error-bg:   #7f1d1d;
        --amber: #fbbf24;

        --key-bg: #422006;
        --key-fg: #fcd34d;
        --key-border: #713f12;

        --shadow: 0 1px 3px rgba(0, 0, 0, .4);
        --shadow-lg: 0 8px 30px rgba(0, 0, 0, .5), 0 2px 8px rgba(0, 0, 0, .35);
    }
}

/* ---------- 手动切换（topbar.js 写 data-theme，优先级最高） ---------- */
[data-theme="dark"] {
    --bg: #0b1120;
    --surface: #1e293b;
    --surface-2: #172033;

    --primary: #818cf8;
    --primary-weak: #312e81;
    --primary-strong: #a5b4fc;

    --text: #e2e8f0;
    --text-2: #94a3b8;
    --muted: #64748b;

    --border: #334155;
    --border-strong: #475569;

    --success: #22c55e;  --success-bg: #14532d;
    --warning: #fbbf24;  --warning-bg: #78350f;
    --error:   #f87171;  --error-bg:   #7f1d1d;
    --amber: #fbbf24;

    --key-bg: #422006;
    --key-fg: #fcd34d;
    --key-border: #713f12;

    --shadow: 0 1px 3px rgba(0, 0, 0, .4);
    --shadow-lg: 0 8px 30px rgba(0, 0, 0, .5), 0 2px 8px rgba(0, 0, 0, .35);
}

[data-theme="light"] {
    --bg: #f5f7fa;
    --surface: #ffffff;
    --surface-2: #f8fafc;

    --primary: #4f46e5;
    --primary-weak: #eef2ff;
    --primary-strong: #4338ca;

    --text: #0f172a;
    --text-2: #64748b;
    --muted: #94a3b8;

    --border: #e2e8f0;
    --border-strong: #cbd5e1;

    --success: #16a34a;  --success-bg: #dcfce7;
    --warning: #d97706;  --warning-bg: #fef3c7;
    --error:   #dc2626;  --error-bg:   #fee2e2;
    --amber: #f59e0b;

    --key-bg: #fffbeb;
    --key-fg: #92400e;
    --key-border: #fde68a;

    --shadow: 0 1px 3px rgba(15, 23, 42, .08), 0 1px 2px rgba(15, 23, 42, .04);
    --shadow-lg: 0 8px 30px rgba(15, 23, 42, .14), 0 2px 8px rgba(15, 23, 42, .08);
}