/* ============================================================
   Protime AI — Core Design Tokens
   来源：设计体系 protime/colors_and_type.css，两处本地修改已就地标注。
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Instrument+Serif:ital@0;1&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  /* ---------- 品牌红（Logo 色）---------- */
  --crimson-50:  #fff1f1;
  --crimson-100: #ffdede;
  --crimson-200: #ffc2c2;
  --crimson-300: #ff9797;
  --crimson-400: #f85a5a;
  --crimson-500: #e52828;
  --crimson-600: #c81414;
  --crimson-700: #be0101;
  --crimson-800: #8f0404;
  --crimson-900: #600606;
  --crimson-950: #380202;

  /* ---------- 中性色（暖调）---------- */
  --ink-0:   #ffffff;
  --ink-50:  #faf8f7;
  --ink-100: #f1eeec;
  --ink-200: #e3ddd9;
  --ink-300: #c9c1bc;
  --ink-400: #948a84;
  --ink-500: #6b625d;
  --ink-600: #4b433e;
  --ink-700: #332d2a;
  --ink-800: #201c1a;
  --ink-900: #121010;
  --ink-950: #0a0908;

  --ember-500: #ff6a1f;
  --ember-400: #ff8a4c;

  /* ---------- 信号色 ---------- */
  --success-600: #117a4a;
  --success-100: #d6f0e1;
  --warn-600:    #b86e00;
  --warn-100:    #fde8c3;
  --danger-600:  #a6191f;
  --danger-100:  #fbdcdc;
  --info-600:    #1f4fa6;
  --info-100:    #d8e4fb;

  /* ---------- 语义 token ---------- */
  --bg:            var(--ink-50);
  --bg-elevated:   var(--ink-0);
  --bg-sunken:     var(--ink-100);
  --fg:            var(--ink-900);
  --fg-muted:      var(--ink-500);
  --fg-subtle:     var(--ink-400);
  --border:        var(--ink-200);
  --border-strong: var(--ink-300);

  /* ---------- 字体 ----------
     本地修改 1：设计体系原始字体栈只有 Inter / Instrument Serif / JetBrains Mono，
     三者都没有中文字形。补上苹方 / 微软雅黑 / Noto Sans SC，
     让中文按品牌规范渲染，而不是掉到系统默认字体。 */
  --font-cjk: "PingFang SC", "Microsoft YaHei", "Noto Sans SC", "Source Han Sans SC";
  --font-sans:  'Inter', ui-sans-serif, system-ui, -apple-system, var(--font-cjk), sans-serif;
  --font-serif: 'Instrument Serif', 'Iowan Old Style', Georgia, var(--font-cjk), serif;
  --font-mono:  'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, var(--font-cjk), monospace;

  --fs-xs: 12px;  --fs-sm: 14px;  --fs-base: 16px; --fs-md: 18px;
  --fs-lg: 22px;  --fs-xl: 28px;  --fs-2xl: 36px;  --fs-3xl: 48px;

  --lh-tight: 1.05; --lh-snug: 1.2; --lh-normal: 1.5; --lh-loose: 1.7;
  /* 中文正文行高按品牌规范单列一档，比英文更松 */
  --lh-cjk: 1.8;

  --tracking-tight: -0.03em; --tracking-snug: -0.015em;
  --tracking-wide: 0.04em;   --tracking-caps: 0.08em;

  --fw-regular: 400; --fw-medium: 500; --fw-semi: 600; --fw-bold: 700;

  /* ---------- 间距 ---------- */
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 20px; --space-6: 24px; --space-8: 32px; --space-10: 40px;
  --space-12: 48px; --space-16: 64px; --space-20: 80px;

  /* ---------- 圆角（品牌要求近直角）---------- */
  --radius-none: 0; --radius-xs: 2px; --radius-sm: 4px;

  /* ---------- 阴影（克制，不做重投影）---------- */
  --shadow-xs: 0 1px 2px rgba(18, 16, 16, 0.04);
  --shadow-sm: 0 1px 2px rgba(18, 16, 16, 0.06), 0 1px 3px rgba(18, 16, 16, 0.04);
  --shadow-md: 0 4px 8px rgba(18, 16, 16, 0.05), 0 2px 4px rgba(18, 16, 16, 0.04);

  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 160ms;
  --dur-base: 240ms;

  /* ---------- 本地修改 2：主色 ----------
     设计稿把主色从品牌红改为 ember 橙，红色只保留给 P0 与人工介入信号位。
     这是该稿的刻意选择，不是笔误。 */
  --brand:        #ff6a1f;
  --brand-strong: #c14b0b;
  --brand-deep:   #9a3c08;
  --brand-soft:   #ffe8da;
  --brand-tint:   #fff3ec;
  --shadow-focus: 0 0 0 3px rgba(255, 106, 31, 0.28);
}

/* ============================================================
   RESET & BASE
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--bg);
  color: var(--ink-800);
  font-family: var(--font-sans);
  font-size: var(--fs-base);
  line-height: var(--lh-normal);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

a { color: var(--brand-strong); text-decoration: none; transition: color var(--dur-fast) var(--ease-out); }
a:hover { color: var(--brand-deep); }

::selection { background: var(--brand); color: #fff; }

img, svg { display: block; max-width: 100%; }

:focus-visible { outline: none; box-shadow: var(--shadow-focus); border-radius: var(--radius-xs); }

/* ============================================================
   语义字型角色
   ============================================================ */
.t-h1 {
  font-size: clamp(34px, 4.2vw, 46px);
  line-height: var(--lh-tight);
  letter-spacing: var(--tracking-tight);
  font-weight: var(--fw-bold);
  margin: 0;
}
.t-h2 {
  font-size: clamp(26px, 3vw, 32px);
  line-height: var(--lh-snug);
  letter-spacing: var(--tracking-snug);
  font-weight: var(--fw-bold);
  margin: 0;
}
.t-eyebrow {
  font-size: var(--fs-xs);
  font-weight: var(--fw-semi);
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
  color: var(--brand-strong);
}
.t-serif {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: var(--fw-regular);
}
.t-mono { font-family: var(--font-mono); }
