/* ==========================================================================
   PWP 养老生存服 — 设计令牌 (Design Tokens)
   风格：浅色为主，黑/红点缀，淡绿/蓝辅助，简约高级
   ========================================================================== */

:root{
  /* ---- 中性色（基底：浅色） ---- */
  --c-bg:            #f7f8f6;   /* 页面底色，带一点点暖绿的米白 */
  --c-surface:       #ffffff;   /* 卡片面 */
  --c-surface-2:     #f2f4f1;   /* 次级面 */
  --c-border:        #e4e7e2;   /* 描边 */
  --c-border-strong: #d3d8d1;

  /* ---- 文字 ---- */
  --c-text:          #16181a;   /* 主文字：近黑 */
  --c-text-2:        #5b6266;   /* 次级文字 */
  --c-text-3:        #8d9499;   /* 弱文字/占位 */

  /* ---- 点缀色 ---- */
  --c-accent:        #c8102e;   /* 主点缀：克制的正红 */
  --c-accent-soft:   #fdecef;
  --c-ink:           #101214;   /* 黑 */
  --c-ink-soft:      #f0f1f2;

  /* ---- 辅助色 ---- */
  --c-green:         #3f9d6a;   /* 淡绿：在线/正常 */
  --c-green-soft:    #e8f5ee;
  --c-blue:          #3b7ea1;   /* 淡蓝：信息 */
  --c-blue-soft:     #e9f2f7;
  --c-amber:         #d99a2b;   /* 警告 */
  --c-amber-soft:    #fdf3e2;

  /* ---- 圆角 ---- */
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-xl: 28px;

  /* ---- 阴影（克制的浮起感） ---- */
  --sh-1: 0 1px 2px rgba(16,18,20,.04), 0 2px 8px rgba(16,18,20,.04);
  --sh-2: 0 2px 6px rgba(16,18,20,.05), 0 10px 26px rgba(16,18,20,.07);
  --sh-3: 0 6px 18px rgba(16,18,20,.07), 0 22px 50px rgba(16,18,20,.10);

  /* ---- 字体 ---- */
  --font-sans: "PingFang SC","Microsoft YaHei","Hiragino Sans GB","Source Han Sans SC",
               "Noto Sans CJK SC","WenQuanYi Micro Hei",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-mono: "JetBrains Mono","Cascadia Code","SF Mono",Consolas,"Liberation Mono",monospace;

  /* ---- 布局 ---- */
  --page-max: 1180px;
  --nav-h: 64px;

  /* ---- 特效层（由特效引擎写入，默认全透明） ---- */
  --fx-a: transparent;
  --fx-b: transparent;
  --fx-c: transparent;

  /* 主题模式：light | dark（dark 由特效或用户切换） */
  --c-bg-rgb: 247,248,246;
}

/* ---------------- 深色模式（用户可切换 / 部分特效自带） ---------------- */
html[data-theme="dark"]{
  --c-bg:            #0e1113;
  --c-surface:       #16191c;
  --c-surface-2:     #1d2226;
  --c-border:        #2a3035;
  --c-border-strong: #394147;

  --c-text:          #f0f2f0;
  --c-text-2:        #a8b0b4;
  --c-text-3:        #737c81;

  --c-accent-soft:   #33141a;
  --c-ink:           #f5f6f5;
  --c-ink-soft:      #21262a;

  --c-green-soft:    #12291e;
  --c-blue-soft:     #12242e;
  --c-amber-soft:    #2e2412;

  --sh-1: 0 1px 2px rgba(0,0,0,.4), 0 2px 8px rgba(0,0,0,.3);
  --sh-2: 0 2px 6px rgba(0,0,0,.45), 0 10px 26px rgba(0,0,0,.45);
  --sh-3: 0 6px 18px rgba(0,0,0,.5), 0 22px 50px rgba(0,0,0,.55);

  --c-bg-rgb: 14,17,19;
}