/* tokens.css - 设计令牌唯一源（Apple 旅行毛玻璃全站统一） */
/* 只放 CSS 变量。材质/组件类在 materials.css（head 中本文件先加载）。 */
/* 依据规格 docs/specs/2026-08-06-apple-travel-glass-unification-design.md §3 */

:root {
  /* ---- 浅色色彩 §3.1 ---- */
  --page-bg: #F8FCFF;
  --surface-base: #FFFFFF;
  --surface-raised: #F5F5F7;
  --surface-inset: #FFFFFF;
  --text-primary: #1D1D1F;
  --text-secondary: #6E6E73;
  --text-muted: #86868B;
  --action-primary: #0071E3;
  --on-action-primary: #FFFFFF;
  --on-danger: #FFFFFF;
  --link-primary: #0066CC;
  --accent-sky: #0A84FF;
  --status-success: #1F7A4F;
  --status-warning: #B25000;
  --status-danger: #D70015;
  --hairline: rgba(0, 0, 0, .08);

  /* 弱化灰控件面 §4.3（浅色） */
  --surface-muted: rgba(245, 245, 247, .88);
  --surface-muted-hover: rgba(232, 232, 237, .96);
  --surface-muted-active: rgba(218, 218, 222, .96);

  /* ---- 字体 §3.3 ---- */
  --font-sans: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB",
               "Noto Sans SC", "Microsoft YaHei", sans-serif;

  /* ---- 圆角 §3.4 ---- */
  --radius-badge: 7px;
  --radius-icon: 9px;
  --radius-chip: 10px;
  --radius-control: 12px;
  --radius-button: 14px;
  --radius-card: 16px;
  --radius-shell: 18px;
  --radius-modal: 20px;

  /* ---- 间距 §3.5（4px 网格） ---- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;

  /* ---- 阴影 §3.5 ---- */
  --shadow-optical: 0 8px 24px rgba(31, 55, 92, .10);
  --shadow-optical-hover: 0 12px 30px rgba(31, 55, 92, .15);
  --shadow-live: 0 12px 34px rgba(31, 55, 92, .14);
  --shadow-modal: 0 24px 64px rgba(0, 0, 0, .22);
  --focus-ring: 0 0 0 3px rgba(0, 113, 227, .24);
  --ring-error: 0 0 0 3px rgba(215, 0, 21, .16);
  --shadow-primary-hover: 0 6px 16px rgba(0, 113, 227, .28);
  --shadow-danger-hover: 0 6px 16px rgba(215, 0, 21, .24);

  /* ---- 动效 §3.4 ---- */
  --duration-press: 120ms;
  --duration-ui: 180ms;
  --duration-modal: 260ms;
  --ease-out: cubic-bezier(.2, 0, 0, 1);
  --ease-standard: cubic-bezier(.4, 0, .2, 1);
  --press-scale: .98;
}

/* 深色模式全部深色令牌固定在 html.dark 作用域（共享 CSS 不再出现裸 dark 选择器） */
html.dark {
  --page-bg: #050A0E;
  --surface-base: #1D1D1F;
  --surface-raised: #2C2C2E;
  --surface-inset: #38383A;
  --text-primary: #F5F5F7;
  --text-secondary: #A1A1A6;
  --text-muted: #86868B;
  --action-primary: #0071E3;
  --on-action-primary: #FFFFFF;
  --on-danger: #1D1D1F;
  --link-primary: #2997FF;
  --accent-sky: #64D2FF;
  --status-success: #30D158;
  --status-warning: #FF9F0A;
  --status-danger: #FF453A;
  --hairline: rgba(255, 255, 255, .10);

  /* 弱化灰控件 §4.3（深色） */
  --surface-muted: rgba(44, 44, 46, .88);
  --surface-muted-hover: rgba(58, 58, 60, .96);
  --surface-muted-active: rgba(72, 72, 74, .96);

  /* 阴影 §3.5（深色） */
  --shadow-optical: 0 10px 28px rgba(0, 0, 0, .32);
  --shadow-optical-hover: 0 14px 34px rgba(0, 0, 0, .42);
  --shadow-live: 0 16px 40px rgba(0, 0, 0, .42);
  --shadow-modal: 0 24px 64px rgba(0, 0, 0, .58);
  --focus-ring: 0 0 0 3px rgba(41, 151, 255, .32);
  --ring-error: 0 0 0 3px rgba(255, 69, 58, .22);

  /* Primary 按键 hover 阴影两模式同值（§4.3）；仅 Danger hover 深色单独 */
  --shadow-danger-hover: 0 6px 16px rgba(255, 69, 58, .26);
}

/* HTML 根级默认字体（组件类继承）；body 本身在 foundation 中声明。 */
html {
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}