/**
 * 全站设计令牌 — 工作台 / 公开站共用
 * 断点统一：640（手机） / 1024（平板） / 1025+（PC）
 */
:root {
  /* 品牌色 */
  --wb-green-deep: #143d28;
  --wb-green-dark: #1a4d2e;
  --wb-green-mid: #2d7a4e;
  --wb-green-soft: #e8f4ec;
  --wb-gold: #c9962a;
  --wb-gold-light: #e8c46a;
  --wb-danger: #c0392b;
  --wb-warning: #e65100;
  --wb-muted: #6b7c72;
  --wb-text: #1a2e22;
  --wb-text-secondary: #5a6b62;
  --wb-border: #e4ebe6;
  --wb-surface: #ffffff;
  --wb-bg: #f4f7f5;

  /* 间距 */
  --wb-space-xs: 4px;
  --wb-space-sm: 8px;
  --wb-space-md: 16px;
  --wb-space-lg: 24px;
  --wb-space-xl: 32px;

  /* 圆角 */
  --wb-radius-sm: 8px;
  --wb-radius-md: 12px;
  --wb-radius-lg: 16px;
  --wb-radius-xl: 20px;

  /* 阴影 */
  --wb-shadow-sm: 0 2px 8px rgba(20, 61, 40, 0.06);
  --wb-shadow-md: 0 4px 16px rgba(20, 61, 40, 0.1);
  --wb-shadow-lg: 0 8px 28px rgba(20, 61, 40, 0.14);

  /* 字号 */
  --wb-font-xs: 11px;
  --wb-font-sm: 13px;
  --wb-font-md: 15px;
  --wb-font-lg: 18px;
  --wb-font-xl: 22px;

  /* 布局 */
  --wb-layout-max: min(1600px, 100%);
  --wb-touch-min: 44px;
  --wb-z-drawer: 1000;
  --wb-z-toast: 1200;
  --wb-z-modal: 1100;

  /* 断点（供 JS 读取，CSS 用 @media） */
  --wb-bp-mobile: 640px;
  --wb-bp-tablet: 1024px;

  /* 兼容旧变量 */
  --green: var(--wb-green-mid);
  --p2-green-dark: var(--wb-green-dark);
  --p2-green-mid: var(--wb-green-mid);
}

@media (max-width: 640px) {
  :root {
    --wb-page-pad: 12px;
    --wb-safe-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  }
}

@media (min-width: 641px) and (max-width: 1024px) {
  :root {
    --wb-page-pad: 16px;
  }
}

@media (min-width: 1025px) {
  :root {
    --wb-page-pad: 20px;
  }
}