/* ============================================================
   LIANZAO V24 — design tokens
   Identity derived from the official logo: deep navy, cyan, signal green.
   Light and dark are two independent systems, not inverses.
   ============================================================ */

@font-face{
  font-family:"LZ Serif";
  src:url("../font/lz-serif-subset.woff2") format("woff2");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

:root{
  /* type */
  --font-ui: "MiSans", "Segoe UI Variable Text", "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei", system-ui, sans-serif;
  --font-display: "LZ Serif", "Noto Serif SC", "Source Han Serif SC", "Songti SC", "SimSun", "Segoe UI Variable Display", "Segoe UI", serif;
  --font-sans: "MiSans", "Segoe UI Variable Text", "Segoe UI", "PingFang SC", "Microsoft YaHei UI", "Microsoft YaHei", system-ui, sans-serif;
  --font-mono: "Cascadia Mono", "Consolas", "SFMono-Regular", ui-monospace, monospace;

  --step--1: 11px;
  --step-0: 17px;
  --step-1: 17px;
  --step-2: 20px;
  --step-3: 28px;
  --step-4: clamp(36px, 3.6vw, 48px);
  --step-5: clamp(44px, 5vw, 72px);
  --step-6: clamp(44px, 5vw, 72px);

  /* semantic type roles (see DESIGN_SYSTEM_V24.md §3) */
  --t-display: var(--step-5);
  --t-h2: var(--step-4);
  --t-h3: var(--step-2);
  --t-lead: var(--step-1);
  --t-body: var(--step-0);
  --t-small: 13px;
  --t-meta: 11px;
  --t-num: 11px;
  --measure-body: 68ch;
  --measure-lead: 44ch;

  /* space: 8px baseline (see §4) */
  --gutter: clamp(26px, 6.2vw, 112px);
  --section-y: clamp(76px, 8.6vw, 116px);
  --gutter-gap: 30px;
  --shell: 1680px;
  --col-gap: clamp(16px, 1.6vw, 28px);
  --s1: 8px;
  --s2: 16px;
  --s3: 24px;
  --s4: 40px;
  --s5: 64px;
  --s6: 96px;
  --s7: clamp(96px, 9vw, 152px);
  --s8: clamp(120px, 12vw, 200px);
  --section: clamp(76px, 7vw, 124px);
  --header-h: 76px;

  --radius: 3px;
  --ease: cubic-bezier(.22,.66,.16,1);
}

/* ---------- light: paper, ink, precision ---------- */
html[data-theme="light"]{
  color-scheme: light;
  --paper: #F5F5F1;
  --paper-raised: #FBFBF8;
  --paper-deep: #EAEBE5;
  --ink: #0C1216;
  --ink-2: #404B53;
  --ink-3: #616B72;
  --ink-inverse: #F7F9FA;
  --line: rgba(12,18,22,.13);
  --line-strong: rgba(12,18,22,.26);
  --line-inverse: rgba(255,255,255,.18);

  --accent: #0B49C6;      /* logo deep blue */
  --accent-ink: #0B3A9B;
  --signal: #00767F;      /* logo cyan, darkened for AA body text */
  --signal-bright: #00A6BC;
  --fresh: #4E7A00;       /* logo green, darkened for text */
  --fresh-bright: #7CC21E;

  --scene-a: #FCFCF9;
  --scene-b: #EDEFE9;
  --scene-c: #E3E8E6;

  --shadow: 0 24px 60px -34px rgba(16,26,34,.35);
  --grid-line: rgba(12,18,22,.055);
  --stage-hi: #FFFFFF;
  --stage-lo: rgba(255,255,255,.55);
  /* 反差色带：浅色主题用深一档纸色 + 深字，绝不反色 */
  --band-bg: #E4E6DF;
  --band-fg: #0C1216;
  --band-fg-2: #3B464E;
  --band-fg-3: #5A646B;
  --band-line: rgba(12,18,22,.14);
  --band-line-strong: rgba(12,18,22,.28);
}

/* ---------- dark: deep field, mineral, light ---------- */
html[data-theme="dark"]{
  color-scheme: dark;
  --paper: #05070A;
  --paper-raised: #0A0E14;
  --paper-deep: #030508;
  --ink: #EDF2F5;
  --ink-2: #A2B0BA;
  --ink-3: #74838E;
  --ink-inverse: #0A0E13;
  --line: rgba(255,255,255,.13);
  --line-strong: rgba(255,255,255,.28);
  --line-inverse: rgba(0,0,0,.3);

  --accent: #7FA6FF;
  --accent-ink: #A9C2FF;
  --signal: #5FD8E6;
  --signal-bright: #8DE9F2;
  --fresh: #A9E86A;
  --fresh-bright: #C4F48C;

  --scene-a: #070B12;
  --scene-b: #0A1120;
  --scene-c: #101A2C;

  --shadow: 0 34px 90px -40px rgba(0,0,0,.9);
  --grid-line: rgba(255,255,255,.04);
  --stage-hi: rgba(38,64,104,.34);
  --stage-lo: rgba(6,10,18,.55);
  /* 反差色带：深色主题用略亮一档的黑 + 浅字 */
  --band-bg: #0A0E14;
  --band-fg: #ECF0F3;
  --band-fg-2: #A0ADB6;
  --band-fg-3: #78868F;
  --band-line: rgba(255,255,255,.14);
  --band-line-strong: rgba(255,255,255,.30);
}