/* 01-tokens.css · 设计令牌（唯一允许出现色值的地方）
   所有其它 CSS 必须引用这里的变量，禁止硬编码颜色 */

:root {
  /* ---------- 品牌主色（粉） ---------- */
  --c-rose-50:  #FFF1F4;
  --c-rose-100: #FFE0E8;
  --c-rose-200: #FFC7D5;
  --c-rose-300: #FFA8BE;
  --c-rose-400: #FF8FAB;
  --c-rose-500: #F96E8F;
  --c-rose-600: #E14C74;
  --c-rose-700: #C33159;

  /* ---------- 奶油 / 暖白 ---------- */
  --c-cream-50:  #FFFBF7;
  --c-cream-100: #FFF4EC;
  --c-cream-200: #FDEBDD;
  --c-checkin-bg: #E7D8CB;
  --c-checkin-bg-deep: #C9B2A4;
  --c-checkin-surface: #FBF3EA;
  --c-checkin-tech-bg: #100A24;
  --c-checkin-tech-surface: rgba(35, 23, 66, 0.88);
  --c-checkin-tech-border: rgba(196, 165, 255, 0.24);
  --c-checkin-tech-text: #F7F0FF;
  --c-checkin-tech-muted: #C5B6DD;
  --c-checkin-tech-violet: #B99BFF;
  --c-checkin-tech-purple: #8B5CF6;
  --c-checkin-tech-pink: #F472B6;
  --c-checkin-tech-magenta: #E879F9;
  --c-checkin-tech-grid: rgba(205, 178, 255, 0.08);
  --c-checkin-tech-glow: rgba(186, 130, 255, 0.22);
  --c-checkin-tech-shadow: rgba(8, 4, 22, 0.3);
  --c-white:     #FFFFFF;

  /* ---------- 模块主题色（M01–M11） ---------- */
  --c-peach:     #FFB49A;
  --c-lilac:     #B9A7E8;
  --c-mint:      #8FD9C4;
  --c-coral:     #FF9E8E;
  --c-aqua:      #7FD4E0;
  --c-lemon:     #FFE07A;
  --c-sky:       #9EC9F0;
  --c-butter:    #FFD98E;
  --c-grape:     #C79BE0;
  --c-blueberry: #8FA8E8;

  /* 主题色软背景（低版本浏览器 color-mix 不可用时的兜底，= 18% 主题色 + 82% 奶油白） */
  --c-peach-soft:     #FFEEE6;
  --c-lilac-soft:     #F2ECF4;
  --c-mint-soft:      #EBF5EE;
  --c-coral-soft:     #FFEAE4;
  --c-aqua-soft:      #E8F4F3;
  --c-lemon-soft:     #FFF6E1;
  --c-sky-soft:       #EEF2F6;
  --c-butter-soft:    #FFF5E4;
  --c-grape-soft:     #F5EAF3;
  --c-blueberry-soft: #EBECF4;
  --c-rose-soft:      #FFECED;

  /* ---------- 中性色 ---------- */
  --c-ink-900: #3E2B33;
  --c-ink-700: #5C4450;
  --c-ink-500: #8A7280;
  --c-ink-300: #B7A6AE;
  --c-line:      #F2DFE4;
  --c-line-soft: rgba(233, 190, 202, 0.35);

  /* ---------- 语义色 ---------- */
  --c-success: #6BC79B;
  --c-warn:    #F0B96B;
  --c-danger:  #E17A8C;
  --c-info:    #8FA8E8;

  /* ---------- 背景（多层柔和光斑） ---------- */
  --bg-app:
    radial-gradient(circle at 12% 8%,  #FFE7DC 0%, transparent 46%),
    radial-gradient(circle at 88% 4%,  #FFF1D8 0%, transparent 42%),
    radial-gradient(circle at 50% 100%, #FFE7E6 0%, transparent 52%),
    linear-gradient(180deg, #FFFAF4 0%, #FFF3EB 100%);

  /* ---------- 表面 ---------- */
  --surface-1: #FFFFFF;
  --surface-2: #FFFBF7;
  --surface-3: rgba(255, 255, 255, 0.72);
  --surface-glass: rgba(255, 255, 255, 0.55);

  /* ---------- 阴影 ---------- */
  --shadow-xs:    0 1px 2px rgba(190, 120, 145, 0.08);
  --shadow-sm:    0 2px 8px rgba(190, 120, 145, 0.10);
  --shadow-md:    0 6px 20px rgba(190, 120, 145, 0.13);
  --shadow-lg:    0 14px 36px rgba(190, 120, 145, 0.16);
  --shadow-press: 0 1px 4px rgba(190, 120, 145, 0.20);
  --glow-rose:    0 0 0 6px rgba(249, 110, 143, 0.12);

  /* ---------- 圆角 ---------- */
  --radius-xs:  8px;
  --radius-sm:  12px;
  --radius-md:  16px;
  --radius-lg:  22px;
  --radius-xl:  28px;
  --radius-pill: 999px;

  /* ---------- 字体 ---------- */
  --font-sans:
    -apple-system, BlinkMacSystemFont, "PingFang SC", "HarmonyOS Sans SC",
    "Helvetica Neue", "Noto Sans SC", "Microsoft YaHei", "Source Han Sans SC",
    Roboto, "Segoe UI", sans-serif;
  --font-num: ui-rounded, "SF Pro Rounded", "PingFang SC", system-ui, sans-serif;
  --font-emoji: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif;

  /* ---------- 字号 ---------- */
  --fs-11: 0.6875rem;
  --fs-12: 0.75rem;
  --fs-13: 0.8125rem;
  --fs-14: 0.875rem;
  --fs-15: 0.9375rem;
  --fs-17: 1.0625rem;
  --fs-20: 1.25rem;
  --fs-24: 1.5rem;
  --fs-28: 1.75rem;
  --fs-34: 2.125rem;

  /* ---------- 行高 / 字重 ---------- */
  --lh-tight: 1.25;
  --lh-snug:  1.4;
  --lh-base:  1.6;
  --lh-loose: 1.8;
  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;

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

  /* ---------- 触控尺寸 ---------- */
  --tap-min: 44px;
  --btn-h: 48px;
  --btn-h-sm: 36px;
  --icon-btn: 44px;

  /* ---------- 容器 ---------- */
  --page-max: 520px;
  --page-pad: 16px;
  --topbar-h: 56px;

  /* ---------- 安全区 ---------- */
  --safe-top:    env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left:   env(safe-area-inset-left, 0px);
  --safe-right:  env(safe-area-inset-right, 0px);

  /* ---------- 层级 ---------- */
  --z-bg: 0;  --z-stage: 10;  --z-topbar: 20;  --z-fx: 40;
  --z-toast: 60;  --z-modal: 80;  --z-loading: 90;

  /* ---------- 动效 ---------- */
  --dur-instant: 90ms;
  --dur-fast:    160ms;
  --dur-base:    240ms;
  --dur-slow:    400ms;
  --dur-slower:  700ms;
  --ease-out:     cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out:  cubic-bezier(0.4, 0, 0.2, 1);
  --ease-spring:  cubic-bezier(0.34, 1.56, 0.64, 1);

  /* 兜底模块主题色（未显式设置时使用） */
  --module-color: var(--c-rose-300);
  --module-color-soft: var(--c-rose-soft);
}

/* ---------- 可选主题：夜间低饱和暗色（默认关闭，设置页可切） ---------- */
[data-theme="night"] {
  --bg-app:
    radial-gradient(circle at 15% 6%,  #2E2530 0%, transparent 46%),
    radial-gradient(circle at 85% 8%,  #2A2431 0%, transparent 44%),
    linear-gradient(180deg, #221C25 0%, #1B161E 100%);
  --surface-1: #2A222C;
  --surface-2: #332A36;
  --surface-3: rgba(58, 48, 60, 0.66);
  --surface-glass: rgba(58, 48, 60, 0.55);
  --c-cream-50: #2A222C;
  --c-cream-100: #332A36;
  --c-cream-200: #3A3040;
  --c-white: #332A36;
  --c-ink-900: #F6ECF0;
  --c-ink-700: #DCCFD6;
  --c-ink-500: #A5949D;
  --c-ink-300: #7A6C74;
  --c-line: #3E3341;
  --c-line-soft: rgba(120, 96, 110, 0.35);
  --c-rose-50: #362B34;
  --c-rose-100: #43333E;
  --c-rose-200: #5A4048;
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.28);
  --shadow-md: 0 6px 20px rgba(0, 0, 0, 0.32);
  --shadow-lg: 0 14px 36px rgba(0, 0, 0, 0.42);
}
