/* ============================================================
   tokens.css — Dreamanual --dt-* token 体系
   基于 Arco 风格 + Tailwind v4 色板
   与 dreamanual.com/tools 完全一致
   ============================================================ */

:root {
    --dt-bg: #f8fafc;
    --dt-raised: #FFFFFF;
    --dt-overlay: #FFFFFF;
    --dt-inset: #f1f5f9;
    --dt-fill2: #f1f5f9;
    --dt-brand: oklch(0.488 0.243 264.376);
    --dt-brand-lt: oklch(0.546 0.245 262.881);
    --dt-brand-bg: oklch(0.424 0.199 265.638);
    --dt-brand-sec: oklch(0.623 0.214 259.815);
    --dt-brand-acc: oklch(0.809 0.105 251.813);
    --dt-brand-surf: oklch(0.932 0.032 255.585);
    --dt-interact: oklch(0.623 0.214 259.815);
    --dt-interact-lt: oklch(0.707 0.165 254.624);
    --dt-interact-bg: oklch(0.546 0.245 262.881);
    --dt-interact-sec: oklch(0.809 0.105 251.813);
    --dt-interact-acc: oklch(0.932 0.032 255.585);
    --dt-interact-surf: oklch(0.970 0.014 254.604);
    --dt-text1: #0f172a;
    --dt-text2: #475569;
    --dt-text3: #64748b;
    --dt-text4: #94a3b8;
    --dt-text5: #cbd5e1;
    --dt-text-inv: #FFFFFF;
    --dt-border: #e2e8f0;
    --dt-border-str: #cbd5e1;
    --dt-card-border: #e2e8f0;
    --dt-error: #ef4444;
    --dt-warning: #f97316;      /* orange-500 */
    --dt-amber: #f59e0b;        /* amber-500 — 评分/进度条中间档（记得/复习巩固） */
    --dt-amber-bg: #fffbeb;     /* amber-50 */
    --dt-amber-text: #d97706;   /* amber-600 */
    --dt-success: #16a34a;      /* green-500 */
    --dt-info: #0284c7;
    --dt-error-bg: #fee2e2;
    --dt-warning-bg: #ffedd5;
    --dt-success-bg: #dcfce7;
    --dt-info-bg: #e0f2fe;
    /* 语义色边框（浅色下为语义色浅阶，暗色下自适应） */
    --dt-success-border: #bbf7d0;
    --dt-warning-border: #fed7aa;
    --dt-error-border: #fca5a5;
    --dt-tooltip-bg: #1e293b;
    --dt-focus: oklch(0.546 0.245 262.881);
    --dt-focus-light: oklch(0.623 0.214 259.815 / 0.10);
    --dt-interact-a04: oklch(0.623 0.214 259.815 / 0.04);
    --dt-interact-a06: oklch(0.623 0.214 259.815 / 0.06);
    --dt-interact-a12: oklch(0.623 0.214 259.815 / 0.12);
    --dt-interact-a20: oklch(0.623 0.214 259.815 / 0.20);

    --font-base: 'Inter', 'Noto Sans SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'PingFang SC', 'Microsoft YaHei', sans-serif;
    --font-mono: 'JetBrains Mono', 'SF Mono', Monaco, monospace;
    --font-en: 'Inter', -apple-system, sans-serif;

    /* ---- 字号档位（8 档，全部偶数） ---- */
    --fs-xs: 10px;   /* 日历/趋势角标（最小可用） */
    --fs-sm: 12px;   /* 元信息/辅助说明/标签 */
    --fs-md: 14px;   /* 正文/按钮（基准） */
    --fs-lg: 16px;   /* 次级标题/正文强调 */
    --fs-xl: 20px;   /* 卡片主标题/次级大数 */
    --fs-2xl: 24px;  /* 弹窗标题/大数字 */
    --fs-3xl: 28px;  /* 今日移动数字/展示级词 */
    --fs-4xl: 36px;  /* 展示级（专注模式/总览大数） */

    /* ---- 字重 ---- */
    --fw-normal: 400;
    --fw-medium: 500;
    --fw-semibold: 600;
    --fw-bold: 700;

    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --shadow-sm: 0 1px 2px rgba(0,0,0,0.04);
    --shadow-md: 0 2px 8px rgba(0,0,0,0.08);
    --shadow-lg: 0 8px 24px rgba(0,0,0,0.12);

    /* ---- 容器间距（区块 / Tab 之间的 gap） ---- */
    --gap-section: 24px;   /* 主内容区 / Tab / 统计页区块间距 */
    --gap-block: 20px;     /* 首页网格 / 中等密度区块间距 */
    --gap-card: 16px;      /* 设置页 / 词库卡片 / 默认卡片间距 */
    --gap-tight: 12px;     /* 统计网格 / 紧凑区块间距 */

    /* ---- 卡片内边距（统一为偶数 px） ---- */
    --pad-card-lg: 24px;   /* 大卡片 / 弹窗 / 概览卡垂直 */
    --pad-card-md: 20px;   /* 标准卡片垂直（最常用） */
    --pad-card-sm: 16px;   /* 紧凑卡片 / 迷你卡垂直 */
    --pad-card-xs: 12px;   /* 列表项 / 词条卡垂直 */
    --pad-x-lg: 28px;      /* 概览卡 / 大卡片水平 */
    --pad-x-md: 24px;      /* 标准卡片水平 */
    --pad-x-sm: 20px;      /* 紧凑卡片水平 */
    --pad-x-xs: 14px;      /* 列表项水平 */
}
