/* ============================================================
   chaihailei-child · Design Tokens — Silent Spatial Editorial
   唯一变量真源。所有组件样式只引用这里的变量。
   ============================================================ */

:root {
	--header-h: 76px;
    /* ---------- 色彩 ---------- */
    --paper:       #FAF8F5;  /* 暖纸白＝2026-10-01 批次定稿值（原 Phase1 #F1EFEA 与定稿不符，L6 核对补齐） */
    --ivory:       #F8F7F3;
    --surface:     #FCFBF8;
    --ink:         #121212;
    --graphite:    #4B4A46;
    --muted:       #66635B;  /* R3-§3-B（2026-10-07）：原 #85827B 在暖纸底仅 3.62:1、方法编号带 #E7E6E3 上仅 3.07:1（均低于 AA 4.5），全站 28 个页面命中。改为 #66635B：纸底 5.66、编号带 4.81、ivory 5.60、surface 5.80 全部达标，仍明显弱于 graphite（8.7），三级层次不变。 */
    --line:        #CECCC5;
    --frame-bg:    #E7E4DE;
    --night:       #090909;
    --night-soft:  #151515;
    --warm-gray:   #AAA69D;
    --accent:      #121212;   /* 焦点环＝墨色。原品牌蓝 #0A48FF 与全站暖纸/墨色体系冲突，2026-09-26 换（仅用于 :focus-visible，无其他视觉影响） */
    --white:       #FFFFFF;

    /* 焦点环纪律：只出现在 :focus-visible（键盘可达性），不参与任何装饰 */

    /* ---------- 字体族 ---------- */
    --font-serif:  "Noto Serif SC", "Songti SC", "SimSun", serif;
    --font-sans:   "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
    --font-mono:   "SF Mono", "Roboto Mono", Consolas, monospace;

    /* ---------- 字号阶梯（1.25 ratio，桌面基准 16） ---------- */
    --fs-2xs: 0.694rem;   /* 11.1 */
    --fs-xs:  0.833rem;   /* 13.3 */
    --fs-sm:  0.9rem;     /* 14.4 */
    --fs-base: 1rem;      /* 16 */
    --fs-md:  1.2rem;     /* 19.2 */
    --fs-lg:  1.44rem;    /* 23 */
    --fs-xl:  1.728rem;   /* 27.6 */
    --fs-2xl: 2.074rem;   /* 33.2 */
    --fs-3xl: 2.488rem;   /* 39.8 */
    --fs-4xl: 2.986rem;   /* 47.8 */
    --fs-hero: clamp(2.2rem, 4.5vw, 4rem);

    /* 行高 */
    --lh-tight: 1.25;
    --lh-body:  1.9;
    --lh-meta:  1.6;

    /* 字距 */
    --ls-wide: 0.18em;
    --ls-caps: 0.08em;

    /* ---------- 间距（8 基准） ---------- */
    --sp-1: 0.5rem;
    --sp-2: 1rem;
    --sp-3: 1.5rem;
    --sp-4: 2rem;
    --sp-5: 3rem;
    --sp-6: 4rem;
    --sp-7: 6rem;
    --sp-8: 8rem;
    --sp-9: 12rem;

    /* ---------- 容器 ---------- */
    --w-wide:  1170px;   /* 2026-09-26：与页头/页脚同一网格（原 1440 与主题容器 1170 不对齐） */
    --w-prose: 720px;
    --w-media: 1080px;

    /* ---------- 网格 ---------- */
    --grid-d: repeat(12, 1fr);
    --grid-m: repeat(4, 1fr);
    --gutter: clamp(20px, 4vw, 48px);

    /* ---------- 边框 ---------- */
    --bd-1: 1px solid var(--line);

    /* ---------- 动效 ---------- */
    --t-fast:   150ms;
    --t-hover:  160ms;
    --t-nav:    240ms;
    --t-reveal: 520ms;
    --t-page:   400ms;
    --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
    --ease-io:  cubic-bezier(0.65, 0, 0.35, 1);

    /* ---------- 层级 ---------- */
    --z-header:  100;
    --z-overlay: 200;
    --z-menu:    300;
    --z-lightbox: 400;

    /* ---------- 图像比例 ---------- */
    --ar-house:  3 / 2;    /* 全站主比例：列表头图 / 正文图（2026-09-26 钦定） */
    --ar-wide:   16 / 9;
    --ar-photo:  4 / 3;
    --ar-portrait: 4 / 5;
    --ar-tall:   3 / 4;
    --ar-square: 1 / 1;

    /* ---------- 断点（供 JS 对照） ---------- */
    --bp-sm: 480px;
    --bp-md: 768px;
    --bp-lg: 1080px;
    --bp-xl: 1440px;
}

/* ---------- 暗色块（深色项目区 / dark gallery） ---------- */
.theme-dark {
    --paper:    var(--night);
    --ink:      #F0EEE9;
    /* R3-§3-C（2026-10-07）：补两档辅助色。此前只翻 --ink，--graphite/--muted 沿用浅底值，
       首页「主张」深色区实测 --graphite #4B4A46 on #090909 = 2.24:1（AA 需 4.5，字数 13px）。 */
    --graphite: #B5B0A6;   /* on #090909 = 9.22 */
    --muted:    #8F8B82;   /* on #090909 = 5.86 */
    --line:     #2A2A28;
    background: var(--night);
    color: var(--ink);
}

/* ---------- 全站暗色（B1）：主题 scheme 开关切到 <html.s-dark>，令牌整体翻转 ---------- */
html.s-dark,
html.site-s-dark {
    --paper:    var(--night);
    --ivory:    var(--night-soft);
    --surface:  var(--night-soft);
    --ink:      #F0EEE9;
    --graphite: #B5B0A6;
    --muted:    #8F8B82;
    --line:     #2A2A28;
    --frame-bg: #1B1B19;
    --accent:   #F0EEE9;  /* 焦点环暗色反转＝亮，保键盘可达性 */
}

/* ---------- 通用减弱动效 ---------- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}