/* ============================================================
   生成物 —— 由 apps/web-site/lib/tokens.mjs 从设计正本派生，请勿手改。
   唯一颜色真源：04-设计正本与原型/设计正本/tokens.css
   本文件不持有任何独立色值；改色请改正源后重新构建。

   唯一变换：正源的 dark 段需要脚本写 attribute 才会命中，而官网是零
   脚本站点（WEB-03），故重挂到系统深色偏好的媒体查询之下，落实
   WEB-28「主题只跟随系统」。
   ============================================================ */
/* ============================================================
   Atween Overseas — 色彩系统
   派生自国内设计正本 `Atween-V13/04-设计正本与原型/国内/设计正本/tokens.css`（V12 色彩系统）。
   创始人 2026-08-12 裁定：「主体色板由产品主体色系决定」——本文件不发明新色，
   只承接同一品牌北极星，并把 CJK 字体栈换成拉丁栈（海外首发英文）。

   来源：品牌 logo（四瓣双场 + 之间白核）为视觉北极星，
   App 的功能色由其降彩度派生；场色温体系沿用并锚定到品牌色。
   规则：① 强调色「珍惜地用」——大面积是深场/纸，强调色只在「之间/此刻/在乎」的时刻点亮。
        ② 场色温随「此刻的分量」整体偏移，不是装饰。
        ③ 双盲：你的场是真实饱和的，对方递来的是「译过的波」——更柔、更克制。

   与国内正本的差异（逐条登记，便于日后对齐）：
   - 字体栈：Noto Serif SC / Noto Sans SC → 拉丁衬线 / 拉丁无衬线；Jost 拉丁字标保留不变。
   - 未继承 App 专有装置：--c1-*（中央按钮）、--light-core-*/--light-well-*/--light-aurora-*
     （App 光核与场晕）——官网无此表面，不搬运。
     ⚠️ [data-field="*"] 场色温**必须继承**：官网危机页用 fieldTone: crisis
     （crisis.njk front-matter → body[data-field="crisis"]），2026-08-12 首版误剪后由
     tokens.test.mjs 断言抓出并补回。
   - 其余色值与动效预算与国内正本逐字一致，不得单方漂移。
   ============================================================ */

:root{
  /* ---- 品牌身份 · 双场（高饱和，仅用于品牌时刻：图标/官网英雄/空状态微光） ---- */
  --brand-cyan-hi:   #C6F9F2;   /* 瓣首高光 */
  --brand-cyan:      #40CFCE;   /* 青·主体（你这片场） */
  --brand-cyan-deep: #1C9DBA;   /* 青·沉底 */
  --brand-warm-hi:   #FFD79B;   /* 瓣首琥珀 */
  --brand-warm:      #F0793F;   /* 橙·主体（对方那片场） */
  --brand-warm-deep: #DB2C14;   /* 橙·赤红沉底 */
  --brand-core:      #EFE9E4;   /* 之间·白核 */

  /* ---- 深蓝场（品牌底 / 夜的根） ---- */
  --field-1: #1D3349;
  --field-2: #112134;
  --field-3: #0A131F;
  --field-4: #070B12;

  /* Emil/Apple interaction budget: fast acknowledgement, calm navigation. */
  --motion-fast: 140ms;
  --motion-ui: 220ms;
  --motion-sheet: 300ms;
  --ease-out: cubic-bezier(.23,1,.32,1);
  --ease-in-out: cubic-bezier(.77,0,.175,1);
  --ease-drawer: cubic-bezier(.32,.72,0,1);
}

/* ============ 浅色（昼） ============ */
:root{
  /* 白底清新：灰只属于容器与描边，画布永远纯白。 */
  --bg:   #FFFFFF;
  --sf:   #F4F6F7;
  --sf2:  #EBEEEF;
  --well: #F4F6F7;

  --ink:  #1B1F21;
  --ink2: #4C5457;
  --ink3: #6B7376;   /* 最淡正文仅落在满足 >= 4.5:1 的背景角色上 */
  --line: #E2E6E8;

  --surface: #FFFFFF;
  --surface-dim: #F4F6F7;
  --surface-bright: #FFFFFF;
  --surface-container-low: #F4F6F7;
  --surface-container: #F4F6F7;
  --surface-container-high: #EBEEEF;
  --outline: #E2E6E8;
  --outline-variant: #E2E6E8;
  --focus-ring: rgba(0,145,158,.22);
  --scrim: rgba(27,31,33,.20);

  /* 功能强调（品牌色降彩度派生） */
  --ac:    #00919E;   /* 青·图形 */
  --warm:  #E4611F;   /* 暖·图形 */
  --danger:#B3261E;   /* 危机 / 不可逆 */
  --ac-text:     #00747F;  /* 青·小字；--ac 不作为小字色 */
  --warm-text:   #B4491A;  /* 暖·小字；--warm 不作为小字色 */
  --danger-text: #A9251D;
  --primary-container: #D8F2F4;
  --on-primary-container: #083A43;
  --secondary-container: #FDEBE4;
  --on-secondary-container: #542416;
  --on-primary: #FFFFFF;

  --glow: rgba(0,145,158,.035);
  --shadow:    0 1px 2px rgba(18,24,28,.06), 0 8px 22px -16px rgba(18,24,28,.18);
  --shadow-lg: 0 2px 5px rgba(18,24,28,.06), 0 20px 52px -28px rgba(18,24,28,.22);
}

/* ============ 场色温 · 随「此刻的分量」整体偏移 ============
   叠在基础主题之上：warm/wistful 仅微调氛围；heavy 压沉；
   deep 进入近黑靛；crisis 转中性冷灰（去暖、降饱和——绝不渲染情绪）。
   官网只用到 crisis（危机页），其余保留以与国内正本对齐、不单方漂移。 */
[data-field="warm"]{ --field-tint: radial-gradient(130% 60% at 50% 0%,   rgba(255,150,90,.05),  transparent 62%); }
[data-field="wistful"]{ --field-tint: radial-gradient(130% 72% at 50% 100%, rgba(95,120,175,.07),  transparent 64%); }
[data-field="heavy"]{ --field-tint: rgba(36,38,58,.10); }
:root [data-field="warm"], :root [data-field="wistful"], :root [data-field="heavy"]{ --field-tint:none; }
[data-field="deep"]{
  --bg:#0C0A16; --ink:#D2D5E2; --ink2:#9AA0B4; --ink3:#6B7186;
  --line:rgba(210,215,235,.12); --well:rgba(255,255,255,.04); --glow:rgba(120,110,200,.10);
  --field-tint:none;
}
[data-field="crisis"]{
  --bg:#161B26; --ink:#DCDEE2; --ink2:#AEB2BC; --ink3:#888D99;
  --ac:#8A8FA0; --warm:#6B7280; --danger:#9B4A3A;
  --ac-text:#8A8FA0; --warm-text:#6B7280; --danger-text:#9B4A3A;
  --line:rgba(220,222,226,.12); --well:rgba(255,255,255,.04); --glow:rgba(160,165,175,.08);
  --field-tint:none;
}

/* ============ 字体 · 海外拉丁栈 ============
   国内正本用 Noto Serif SC / Noto Sans SC 承载中文；海外首发英文，改拉丁栈。
   `--lat` 的 Jost 是品牌拉丁字标，两地一致，不得替换。
   ⚠️ CSP `font-src 'self'`：自定义字体必须自托管，不得引 CDN。
      字体文件落地前，栈内的系统回退face 生效，站点仍可正常渲染。 */
:root{
  --serif: 'Newsreader', Georgia, 'Times New Roman', serif;   /* 「说的话」「在乎」「标题」——衬线承载人味 */
  --sans:  'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --lat:   'Jost', var(--sans);              /* 拉丁字标 / 标签（品牌，与国内一致） */
}

@media (prefers-color-scheme: dark){
:root{
  --bg:   #15122A;
  --sf:   rgba(255,255,255,.05);
  --sf2:  #0C121D;
  --well: rgba(255,255,255,.05);

  /* 裁定 11「深墨阶冷灰蓝系」：夜场底 #15122A，墨 #ECE8F6 / 次 #CFC7E4 / 弱 #8E86B4。 */
  --ink:  #ECE8F6;
  --ink2: #CFC7E4;
  --ink3: #8E86B4;
  --line: rgba(174,183,197,.12);
  --surface: #15122A;
  --surface-container: rgba(255,255,255,.055);
  --surface-container-high: rgba(255,255,255,.085);
  --outline: rgba(174,183,197,.18);
  --focus-ring: rgba(63,200,220,.28);

  --ac:    #3FC8DC;   /* 冷·你的场 —— 自 brand-cyan */
  --warm:  #FF8A5E;   /* 暖·对方 —— 自 brand-warm-hi/主体之间 */
  --danger:#E2604A;
  --ac-text:     var(--ac);
  --warm-text:   var(--warm);
  --danger-text: var(--danger);

  --glow: rgba(120,110,200,.14);
  --shadow:    0 30px 70px -34px rgba(0,0,0,.7), 0 4px 14px -6px rgba(0,0,0,.5);
  --shadow-lg: 0 60px 120px -50px rgba(0,0,0,.8), 0 12px 30px -14px rgba(0,0,0,.6);
}
}
