/* LAB — design tokens（由 design-system/tokens/* 合并；单文件、零运行时依赖）
   变更：补 Noto Serif SC（PRD 4.1 / 6.3：中文 display 字体缺口），新增 --font-display-mix。 */

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500;700&family=Noto+Sans+SC:wght@400;500;700&family=Noto+Serif+SC:wght@500;600;700&family=Playfair+Display:wght@400;500;600;700&display=swap");

:root{
  /* ---- Brand core ---- */
  --ink:#1c1917;
  --on-primary:#faf8f5;
  --canvas:#faf8f5;
  --soft-cloud:#f0ebe3;

  /* ---- Text neutrals ---- */
  --charcoal:#3a3531;
  --ash:#57504a;
  --mute:#7d746c;
  --stone:#a89f97;

  /* ---- Lines ---- */
  --hairline:#d8d0c6;
  --hairline-soft:#e8e2d8;

  /* ---- Brass（唯一表达性 accent，每屏最多一次）---- */
  --brass:#c9a227;
  --brass-deep:#8f7318;

  /* ---- Semantic ---- */
  --urgent:#b4331f;
  --urgent-deep:#7a2114;
  --success:#2f6b4f;
  --success-bright:#4e9e73;
  --info:#1f6b70;
  --info-deep:#14494d;

  /* ---- Category accents（仅 chip / soft tile / editorial 时刻）---- */
  --accent-court:#35705a;
  --accent-court-soft:#cfe0d5;
  --accent-pour:#7a2f3f;
  --accent-pour-soft:#e8d3d8;
  --accent-brass-pale:#f2e4b8;
  --accent-night:#2b1f14;

  /* ---- v3 首页九宫格专用（2026-08-19 host 定案色系：复古墨绿 / 奶油白 / 哑光金，采样自海报）---- */
  --court:#1e3b2d;        /* 复古墨绿：画布 */
  --court-deep:#142921;   /* 画布渐层深端 */
  --v3-deep:#0a1f15;      /* 宣言格底（贴海报的深绿）*/
  --cream:#f2edda;        /* 奶油白：文字格底 / 画布上的文字 */
  --gold:#b3924f;         /* 哑光金：Members 格 / rule / 圆点 */
  --gold-deep:#987a49;    /* 哑光金深端（渐层 / 次要文字）*/
  --navy:#1f2c48;         /* 藏青：宣言格文字（host 2026-08-19 指定）*/

  /* ---- Semantic aliases ---- */
  --surface-page:var(--canvas);
  --surface-stage:var(--soft-cloud);
  --surface-ink:var(--ink);
  --text-primary:var(--ink);
  --text-body:var(--charcoal);
  --text-muted:var(--mute);
  --text-inverse:var(--on-primary);
  --text-inverse-muted:var(--stone);
  --border-hairline:var(--hairline);
  --border-hairline-soft:var(--hairline-soft);
  --accent:var(--brass);
  --accent-pressed:var(--brass-deep);
  --danger:var(--urgent);
  --danger-pressed:var(--urgent-deep);
  --positive:var(--success);
  --positive-inverse:var(--success-bright);
  --informational:var(--info);
  --informational-pressed:var(--info-deep);

  /* ---- Typography ---- */
  --font-display:"Playfair Display",Georgia,"Times New Roman",serif;
  --font-display-cjk:"Noto Serif SC",Georgia,serif;
  --font-display-mix:"Playfair Display","Noto Serif SC",Georgia,serif;
  --font-ui:"Inter","Noto Sans SC",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --font-cjk:"Noto Sans SC","Inter",system-ui,sans-serif;

  --weight-regular:400;
  --weight-medium:500;
  --weight-semibold:600;

  --type-display-size:96px;    --type-display-lh:0.9;
  --type-h-xl-size:32px;       --type-h-xl-lh:1.2;
  --type-h-lg-size:24px;       --type-h-lg-lh:1.2;
  --type-h-md-size:16px;       --type-h-md-lh:1.75;
  --type-body-size:16px;       --type-body-lh:1.5;
  --type-button-lg-size:24px;  --type-button-lg-lh:1.2;
  --type-button-md-size:16px;  --type-button-md-lh:1.5;
  --type-button-sm-size:14px;  --type-button-sm-lh:1.5;
  --type-link-size:16px;       --type-link-lh:1.75;
  --type-caption-md-size:14px; --type-caption-md-lh:1.5;
  --type-caption-sm-size:12px; --type-caption-sm-lh:1.5;
  --type-utility-size:9px;     --type-utility-lh:1.75;

  /* ---- Spacing ---- */
  --space-xxs:2px;
  --space-xs:4px;
  --space-sm:8px;
  --space-md:12px;
  --space-lg:18px;
  --space-xl:24px;
  --space-xxl:30px;
  --space-section:48px;

  --container-max:1440px;
  --gutter:24px;
  --gutter-wide:80px;
  --filter-rail:220px;

  /* ---- Radius（词汇只有 pill 与圆；容器一律 0）---- */
  --radius-none:0px;
  --radius-sm:18px;
  --radius-md:24px;
  --radius-lg:30px;
  --radius-full:9999px;

  /* ---- Elevation / motion ---- */
  --elevation-flat:none;
  --divider-hairline:1px solid var(--hairline);
  --divider-hairline-soft:1px solid var(--hairline-soft);
  --inset-line:inset 0 -1px 0 var(--hairline-soft);
  --focus-border:2px solid var(--ink);
  --focus-glove:0 0 0 12px var(--soft-cloud);

  --press-transform:scale(0.5);
  --press-opacity:0.5;
  --ease-standard:cubic-bezier(0.2,0,0,1);
  --duration-press:120ms;
}

/* ---- Base / reset ---- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--canvas);
  color:var(--ink);
  font-family:var(--font-ui);
  font-size:var(--type-body-size);
  line-height:var(--type-body-lh);
  font-weight:var(--weight-regular);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
h1,h2,h3,h4,h5,h6{margin:0;font-family:var(--font-display-mix);font-weight:var(--weight-medium);line-height:var(--type-h-lg-lh);color:var(--ink)}
p{margin:0;text-wrap:pretty}
a{color:var(--ink);text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px}
a:hover{color:var(--brass-deep)}
img,svg{display:block;max-width:100%}
button{font-family:inherit}
::selection{background:var(--brass);color:var(--ink)}

/* ---- CTA 悬停出球（design-system/lab-cta-hover-ball.html 版本 1）---- */
:root{
  --ball:var(--gold);                 /* 球色：跟站内九宫格的球点同色；要更亮的球黄改这里 */
  --ball-hole:rgba(120,96,20,.55);    /* 球孔 */
  --ripple:rgba(179,146,79,.55);      /* 涟漪：哑光金，奶油底与墨绿底上都看得见 */
  --ease-ball:cubic-bezier(.2,1.3,.4,1);
}