/* ============================================================
   tokens.css — 水产虾类大全 · 唯一设计变量来源
   2026 视觉改版：白底 + 海军蓝 + 亮蓝强调（对齐 03-ui 视觉稿）
   ============================================================ */

:root {
  /* ---- 底色 / 表面 ---- */
  --bg: #ffffff;
  --bg-soft: #f4f9fe;
  --bg-card: #ffffff;
  --white: #ffffff;
  --surface: #e8f2fd;

  /* ---- 墨色 / 文字 ---- */
  --navy: #0f355e;
  --text-strong: #17293d;
  --text-body: #33475b;
  --muted: #5f7083;
  --on-dark: rgba(255, 255, 255, 0.78);
  --on-dark-soft: rgba(255, 255, 255, 0.55);

  /* ---- 强调色 ---- */
  --accent: #2f7fd4;
  --accent-deep: #2465ad;
  --accent-soft: #e8f2fd;
  --accent-2: #1f6fc0;

  /* ---- 壳色样本 ---- */
  --shell-green: #9fb8a6;
  --shell-green-deep: #5f7f72;
  --shell-red: #c4553e;
  --shell-brown: #6b4a3a;
  --shell-brown-deep: #3d2a20;
  --shell-pink: #e8d5c8;
  --shell-pink-deep: #b89a8b;

  /* ---- 线条 / 描边 ---- */
  --line: #dce7f2;
  --line-strong: #c3d4e6;
  --line-light: rgba(255, 255, 255, 0.16);
  --overlay-ink: rgba(15, 53, 94, 0.32);

  /* ---- 字体 ---- */
  --display: "Noto Sans SC", "Noto Sans CJK SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  --sans: "Noto Sans SC", "Noto Sans CJK SC", "PingFang SC", "Microsoft YaHei", sans-serif;

  /* ---- 字号阶 ---- */
  --fs-1: 10.5px;
  --fs-2: 11.5px;
  --fs-3: 12px;
  --fs-4: 12.5px;
  --fs-5: 13px;
  --fs-6: 14px;
  --fs-7: 15px;
  --fs-8: 16px;
  --fs-9: 17px;
  --fs-10: 18px;
  --fs-11: 20px;
  --fs-12: 22px;
  --fs-13: 24px;
  --fs-14: 26px;
  --fs-15: 30px;
  --fs-16: 34px;

  /* ---- 圆角 ---- */
  --r-1: 3px;
  --r-2: 4px;
  --r-3: 50%;
  --r-arch-sm: 4px;
  --r-arch: 4px;
  --r-pill: 4px;

  /* ---- 阴影 ---- */
  --shadow-card: 0 8px 24px rgba(15, 53, 94, 0.08);
  --shadow-hero: 0 24px 60px rgba(15, 53, 94, 0.16);

  /* ---- 布局 / 节奏 ---- */
  --shell: 1360px;
  --pad: clamp(20px, 4vw, 36px);
  --section-y: clamp(34px, 4vw, 48px);
  --gap: 18px;
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}