/* ============================================================
   法犀 · Design Tokens v1.0   （唯一真源 / Single Source of Truth）
   ------------------------------------------------------------
   文件：assets/tokens.css
   原则：
     1. 只放"变量"，不放"选择器样式"（组件样式在 components.css）
     2. 全站禁止裸 hex / 裸间距值，一律引用 Token
     3. 向后兼容：保留 site.css 旧变量名作为别名，迁移期零视觉回归
   品牌：法犀（母品牌 / 平台） → 小犀（产品级 AI 助手 IP）
   日期：2026-09-11
   ============================================================ */

/* ============================================================
   0. 调色板 —— 已锁定 V3（Sir 2026-09-11 裁决）
   ------------------------------------------------------------
   深空蓝 #0B2447 · 炽焰橙 #E85D3A · 极光金 #D4A843
   （旧版调色板已废弃，如需回滚见 git 历史；为避免残留扫描误报，此处不再列旧色值）
   ============================================================ */
:root {
    /* —— 原始色阶（Primitive）—— */
    --c-ink-950: #06152B;
    --c-ink-900: #0B2447;
    --c-ink-700: #1A3A66;
    --c-accent-600: #E85D3A;
    --c-accent-400: #F0805C;
    --c-accent-700: #C94A2A;
    --c-gold-600: #D4A843;
    --c-gold-400: #E8C97A;
    --c-gold-700: #B8922E;

    /* —— 中性 / 背景 —— */
    --c-bg: #FAF8F4;
    --c-surface: #FFFFFF;
    --c-surface-warm: #F4F1EA;
    --c-text: #0A1628;
    --c-text-2: #3D4F66;
    --c-text-3: #5F7189;   /* 4.70:1 on 暖白（原 #7288A0 3.45:1 不合规） */
}

/* ============================================================
   1. 语义色（Semantic）—— 组件只允许使用这一层
   ============================================================ */
:root {
    --ink: var(--c-ink-900);
    --ink-soft: var(--c-ink-700);
    --ink-deep: var(--c-ink-950);
    --accent: var(--c-accent-600);
    --accent-soft: var(--c-accent-400);
    --accent-deep: var(--c-accent-700);
    --gold: var(--c-gold-600);
    --gold-soft: var(--c-gold-400);
    --gold-deep: var(--c-gold-700);

    /* —— 文本层专用色（WCAG AA 正文级 ≥4.5:1，仅用于文字，不用于填充/描边） —— */
    --accent-text: #C0462A;             /* 橙文本 on 暖白 4.77:1 */
    --gold-text: #8A6D14;               /* 金文本 on 暖白 4.63:1 */
    --text-3-aa: #5A6B82;               /* 三级文字 on 暖白 5.13:1 */

    --bg: var(--c-bg);
    --surface: var(--c-surface);
    --surface-warm: var(--c-surface-warm);
    --text: var(--c-text);
    --text-2: var(--c-text-2);
    --text-3: var(--c-text-3);

    /* 描边 */
    --line: rgba(11, 36, 71, 0.08);
    --line-strong: rgba(11, 36, 71, 0.14);
    --line-focus: var(--accent);

    /* 状态色（语义固定，不随调色板变） */
    --success: #2A9D5A;
    --success-bg: rgba(42, 157, 90, 0.10);
    --warning: #F59E0B;
    --warning-bg: rgba(245, 158, 11, 0.10);
    --danger: #D9534A;
    --danger-bg: rgba(217, 83, 74, 0.10);
    --info: #3B82F6;
    --info-bg: rgba(59, 130, 246, 0.10);

    /* 玻璃 / 外壳 */
    --nav-bg: rgba(250, 248, 244, 0.72);
    --shell-bg: rgba(11, 36, 71, 0.035);
    --inner-hi: inset 0 1px 1px rgba(255, 255, 255, 0.9);
}

[data-theme="dark"] {
    --bg: #070D1A;
    --surface: #0D1628;
    --surface-warm: #111C33;
    --text: #E9EEF6;
    --text-2: #A5B6CC;
    --text-3: #8A9BB0;      /* 暗底 6.84:1（原 #66788F 4.30:1） */
    --line: rgba(233, 238, 246, 0.09);
    --line-strong: rgba(233, 238, 246, 0.16);
    --nav-bg: rgba(7, 13, 26, 0.68);
    --shell-bg: rgba(233, 238, 246, 0.045);
    --inner-hi: inset 0 1px 1px rgba(255, 255, 255, 0.06);
}

/* ============================================================
   2. 字号阶梯（Type Scale）—— 1.25 近似模数
   ============================================================ */
:root {
    --fs-2xs: 11px;   /* 极微：角标、次要脚注（下限） */
    --fs-xs:  12px;   /* 微：辅助说明、时间戳 */
    --fs-sm:  13px;   /* 小：UI 标签、次要按钮 */
    --fs-base: 15.5px;/* 基准：正文 */
    --fs-md:  16px;   /* 中：强调正文 */
    --fs-lg:  18px;   /* 大：卡片标题 */
    --fs-xl:  20px;   /* 加大：区块子标题 */
    --fs-2xl: 24px;   /* 二级标题 */
    --fs-3xl: 30px;   /* 一级标题 */
    --fs-4xl: 36px;   /* 主标题 */
    --fs-hero: clamp(2.5rem, 5.4vw, 4.3rem); /* 首屏主标题 */

    --lh-tight: 1.25;
    --lh-snug: 1.45;
    --lh-base: 1.75;   /* 正文（中文阅读优化） */
    --lh-loose: 1.9;

    --fw-4: 400;
    --fw-5: 500;
    --fw-6: 600;
    --fw-7: 700;
    --fw-8: 800;
}

/* ============================================================
   3. 间距（Spacing）—— 4px 基准网格
   ============================================================ */
:root {
    --sp-1: 4px;
    --sp-2: 8px;
    --sp-3: 12px;
    --sp-4: 16px;
    --sp-5: 20px;
    --sp-6: 24px;
    --sp-7: 32px;
    --sp-8: 40px;
    --sp-9: 48px;
    --sp-10: 64px;
    --sp-11: 80px;

    /* 版心 */
    --wrap: 1200px;
    --wrap-wide: 1360px;
    --gutter: 2rem;
}

/* ============================================================
   4. 圆角（Radius）
   ============================================================ */
:root {
    --radius-xs: 4px;
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 24px;
    --radius-2xl: 32px;
    --radius-full: 999px;

    /* 兼容 site.css 旧命名（值不变，避免回归） */
    --r-xl: 2rem;      /* 32px → 等于 --radius-2xl */
    --r-lg: 1.5rem;    /* 24px → 等于 --radius-xl */
    --r-md: 1.125rem;  /* 18px */
}

/* ============================================================
   5. 阴影与层级（Elevation）
   ============================================================ */
:root {
    --sh-1: 0 1px 2px rgba(11, 36, 71, 0.04);
    --sh-2: 0 2px 8px rgba(11, 36, 71, 0.06);
    --sh-3: 0 12px 32px -12px rgba(11, 36, 71, 0.18);
    --sh-4: 0 24px 60px -24px rgba(11, 36, 71, 0.25);
    --sh-5: 0 40px 90px -32px rgba(11, 36, 71, 0.35);
    --shadow-float: var(--sh-4);
    --shadow-lift: var(--sh-5);

    /* z-index 体系（唯一标准） */
    --z-base: 1;
    --z-sticky: 50;
    --z-nav: 100;
    --z-drawer: 200;
    --z-modal: 260;
    --z-toast: 300;
}

[data-theme="dark"] {
    --sh-1: 0 1px 2px rgba(0, 0, 0, 0.3);
    --sh-2: 0 2px 8px rgba(0, 0, 0, 0.4);
    --sh-3: 0 12px 32px -12px rgba(0, 0, 0, 0.5);
    --sh-4: 0 24px 60px -24px rgba(0, 0, 0, 0.6);
    --sh-5: 0 40px 90px -32px rgba(0, 0, 0, 0.7);
}

/* ============================================================
   6. 动效（Motion）
   ============================================================ */
:root {
    --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
    --ease-spring: cubic-bezier(0.32, 0.72, 0, 1);
    --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);

    --dur-instant: 100ms;
    --dur-fast: 150ms;   /* 悬停/反馈 */
    --dur-base: 300ms;   /* 入场/过渡 */
    --dur-slow: 500ms;   /* 主题切换/大位移 */

    /* 触控目标下限（WCAG 2.5.5） */
    --tap-min: 44px;
}

/* ============================================================
   7. 字体族
   ============================================================ */
:root {
    --font-display: 'Noto Sans SC', -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
    --font-serif: 'Noto Serif SC', 'Noto Sans SC', 'Songti SC', serif;
    --font-body: 'Noto Sans SC', -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
    --font-mono: 'SFMono-Regular', Consolas, monospace;
}

/* ============================================================
   8. 断点（仅供文档参考，CSS 媒体查询无法使用变量）
   ------------------------------------------------------------
   sm  ≥ 640px   移动横屏
   md  ≥ 768px   平板
   lg  ≥ 1024px  桌面
   xl  ≥ 1280px  宽屏
   ============================================================ */

/* ============================================================
   补齐：components.css 引用的别名（text-1 / lh-normal / accent-bg）
   ============================================================ */
:root {
    --text-1: var(--c-text);
    --lh-normal: var(--lh-base);
    --accent-bg: rgba(232, 93, 58, 0.10);

    /* —— 历史别名补全（V3 单一真源指向，消除悬空变量） —— */
    --navy: var(--ink);                 /* 旧深蓝 → ink-900 */
    --brand: var(--accent);             /* 旧品牌橙 → 炽焰橙 */
    --brand-bg: rgba(232, 93, 58, 0.10);/* 旧品牌浅底 → accent 10% */
    --teal: var(--gold);                /* 历史误名（实为金） → 极光金 */
    --warn: var(--gold);                /* 中风险级（历史为金） → 极光金 */
    --card: var(--surface);             /* 卡片底 → surface */
    --bg-soft: var(--surface-warm);     /* 柔和底 → surface-warm */
    --blue: var(--info);                /* 信息蓝 → info */
}
[data-theme="dark"] {
    --accent-bg: rgba(232, 93, 58, 0.16);
    /* 文本色暗底提亮（保证 >=4.5:1） */
    --accent-text: #F0805C;   /* on #070D1A 7.35:1 */
    --gold-text: #E8C97A;     /* on #070D1A 12.08:1 */
    --text-3-aa: #8A9BB0;
}
