/* SecondFirst 设计系统 · tokens v1.1（2026-10-20，Mei）
   这是颜色、字体、间距的唯一来源。站点把这个文件复制进自己的 public/，app 以后从这里映射到 --pagent-*。
   说明见同目录 system.md。改值先改这里，再同步出去。 */

/* 字体（全部 SIL OFL 1.1，来源和授权见 licenses.md）：
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link href="https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,500;1,6..72,400&family=IBM+Plex+Mono:wght@400;500&family=Noto+Serif+SC:wght@500;700&display=swap" rel="stylesheet"> */

:root {
  /* 纸和墨 */
  --sf-paper: #f4f0e8;      /* 底：第一联，暖白纸 */
  --sf-paper-2: #ebe5d8;    /* 第二联：复写下面那张，略深 */
  --sf-ink: #1c1b18;        /* 正文、标题：暖黑墨 */
  --sf-ink-2: #5e5a51;      /* 次要文字 */
  --sf-ink-3: #8d887c;      /* 标注、占位、不可用 */
  --sf-rule: #d3cbbb;       /* 发丝线、表格线 */
  --sf-carbon: #317374;     /* 复写青：唯一的强调色，取自 logo，值是「1st」的 ASCII 码。只用平涂，不渐变，不发光。
                               变量名还叫 carbon（复写），v1 是复写蓝 #2f3e9e，2026-10-20 换（Kai 选的 A） */
  --sf-carbon-soft: rgba(49, 115, 116, .12);
  --sf-alert: #a8402c;      /* 只用于出错。不是第二个强调色 */

  /* 字体 */
  --sf-serif: "Newsreader", "Noto Serif SC", "Songti SC", Georgia, serif;
  --sf-serif-zh: "Noto Serif SC", "Songti SC", "Newsreader", serif;
  --sf-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --sf-sans: -apple-system, BlinkMacSystemFont, "PingFang SC", "Noto Sans SC", "Helvetica Neue", sans-serif;

  /* 字号：1.25 左右的级差，标题再跳一级 */
  --sf-t-label: 11px;   /* mono 大写标签，字距 .08em */
  --sf-t-small: 13px;
  --sf-t-body: 16px;
  --sf-t-lead: 20px;
  --sf-t-h3: 26px;
  --sf-t-h2: 36px;
  --sf-t-h1: clamp(40px, 7vw, 88px);

  /* 间距：4 的倍数 */
  --sf-s1: 4px; --sf-s2: 8px; --sf-s3: 12px; --sf-s4: 16px;
  --sf-s5: 24px; --sf-s6: 32px; --sf-s7: 48px; --sf-s8: 64px; --sf-s9: 96px;

  /* 形状：纸是直角的。按钮最多 2px */
  --sf-radius: 2px;
  --sf-hair: 1px solid var(--sf-rule);
  /* 复写偏移：第二联相对第一联错开的距离。整个系统只有这一种“阴影” */
  --sf-copy-x: 3px;
  --sf-copy-y: 4px;

  --sf-ease: cubic-bezier(.2, .7, .2, 1);
}

/* 深色：不是把纸翻黑，是夜里的同一张桌子。复写青提亮，保持同一个色相 */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --sf-paper: #151513;
    --sf-paper-2: #1e1d1a;
    --sf-ink: #ece6da;
    --sf-ink-2: #aaa395;
    --sf-ink-3: #77726a;
    --sf-rule: #34322d;
    --sf-carbon: #7fb6b7;
    --sf-carbon-soft: rgba(127, 182, 183, .14);
    --sf-alert: #e07a62;
  }
}
:root[data-theme="dark"] {
  --sf-paper: #151513;
  --sf-paper-2: #1e1d1a;
  --sf-ink: #ece6da;
  --sf-ink-2: #aaa395;
  --sf-ink-3: #77726a;
  --sf-rule: #34322d;
  --sf-carbon: #7fb6b7;
  --sf-carbon-soft: rgba(127, 182, 183, .14);
  --sf-alert: #e07a62;
}