/* yunji/css/tokens.css — 芸集 Design System Tokens */

:root {
  /* ══════════ Background & Surface ══════════ */
  --bg-page: #f6f3ed;
  --bg-card: rgba(255, 255, 255, 0.5);
  --bg-card-hover: rgba(255, 255, 255, 0.65);
  --bg-nav: rgba(246, 243, 237, 0.75);
  --bg-nav-pill: rgba(0, 0, 0, 0.03);
  --bg-nav-pill-hover: rgba(0, 0, 0, 0.04);
  --bg-chip: rgba(0, 0, 0, 0.025);

  /* ══════════ Text ══════════ */
  --text-title: #2a2520;
  --text-body: #807870;
  --text-sub: #a09888;
  --text-aux: #b0a898;
  --text-muted: #c0b8a8;
  --text-ghost: #d0c8b8;
  --text-footer: #d8d0c0;
  --text-nav: #999;
  --text-nav-hover: #4a4540;
  --text-feat: #908880;

  /* ══════════ Borders & Dividers ══════════ */
  --border-card: rgba(0, 0, 0, 0.04);
  --border-card-hover: rgba(0, 0, 0, 0.08);
  --border-chip: rgba(0, 0, 0, 0.06);
  --border-btn-outline: rgba(0, 0, 0, 0.1);
  --border-btn-outline-hover: rgba(0, 0, 0, 0.2);
  --border-divider: rgba(0, 0, 0, 0.06);
  --border-nav: rgba(0, 0, 0, 0.04);
  --border-feat: rgba(0, 0, 0, 0.05);

  /* ══════════ Project Theme Colors ══════════ */
  --c-photozen: #3aaa8a;
  --c-gongfu: #d07030;
  --c-nannaricher: #b08818;
  --c-fightinone: #b83535;
  --c-catchbiga: #1a8a50;
  --c-dingni: #b04070;
  --c-tripmap: #7a50a0;
  --c-transphone: #3070a0;
  --c-trainroute: #5a8418;
  --c-weatherzen: #1a8898;
  --c-compact: #a83050;
  --c-gospec: #5050a0;
  --c-tutou: #a07048;
  --c-covid: #4a7868;
  --c-ducheng: #8a5a3a;

  /* ══════════ Typography ══════════ */
  --ff-serif: 'Noto Serif SC', 'Source Han Serif SC', 'Songti SC', serif;
  --ff-sans: 'Inter', -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
  --fw-thin: 200;
  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;

  /* ══════════ Spacing ══════════ */
  --max-w: 980px;
  --section-pt: 120px;
  --section-px: 48px;
  --sect-head-mb: 64px;
  --proj-gap: 52px;
  --proj-mb: 100px;
  --feat-gap: 6px;
  --btn-gap: 10px;
  --bento-gap: 8px;
  --nav-h: 56px;
  --nav-px: 48px;

  /* ══════════ Radii ══════════ */
  --r-bento: 14px;
  --r-visual: 20px;
  --r-btn: 10px;
  --r-feat: 8px;
  --r-chip: 100px;
  --r-pill: 100px;

  /* ══════════ Shadows ══════════ */
  --shadow-card-hover: 0 16px 48px rgba(0, 0, 0, 0.05);
  --shadow-btn-hover: 0 4px 16px rgba(0, 0, 0, 0.1);

  /* ══════════ Animation ══════════ */
  --ease-spring: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-out: cubic-bezier(0.0, 0.0, 0.2, 1);
  --ease-in: cubic-bezier(0.4, 0.0, 1, 1);
  --dur-card: 0.35s;
  --dur-btn: 0.2s;
  --dur-reveal: 0.7s;
  --dur-stagger: 0.05s;

  /* ══════════ Z-Index Scale ══════════ */
  --z-base: 0;
  --z-card: 10;
  --z-nav: 200;
  --z-modal: 300;
}