/* =================== 设计 Tokens =================== */
:root {
  /* Color */
  --color-primary:    #F3D7CA;   /* 雾霭粉 */
  --color-accent:     #C9A86A;   /* 香槟金 */
  --color-military:   #5B6E5C;   /* 橄榄军绿 */
  --color-text-1:     #2B2522;   /* 文字主色 */
  --color-text-2:     #8C7E76;   /* 文字次色 */
  --color-text-3:     #B5A89E;   /* 文字第三色 */
  --color-bg:         #FBF7F2;   /* 米白主背景 */
  --color-bg-2:       #FFFFFF;   /* 卡片背景 */
  --color-warn:       #C8385C;
  --color-border:     #EFE2D6;   /* 卡片描边 */
  --color-overlay:    rgba(45,30,20,.55);
  --color-overlay-2:  rgba(45,30,20,.25);

  /* Gradient */
  --gradient-banner:  linear-gradient(180deg, #F8E0D2 0%, #F3D7CA 60%, #EBC9B9 100%);
  --gradient-banner-2:linear-gradient(180deg, #FBF7F2 0%, #F8E8DB 100%);

  /* Typography */
  --font-serif: "Songti SC", "Source Han Serif SC", "Noto Serif SC", serif;
  --font-sans: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", sans-serif;

  --fs-10: 10px; --fs-11: 11px; --fs-12: 12px; --fs-13: 13px;
  --fs-14: 14px; --fs-15: 15px; --fs-16: 16px; --fs-18: 18px;
  --fs-20: 20px; --fs-22: 22px; --fs-24: 24px; --fs-28: 28px;
  --fs-32: 32px; --fs-36: 36px;

  /* Spacing */
  --sp-4: 4px; --sp-8: 8px; --sp-12: 12px; --sp-16: 16px;
  --sp-20: 20px; --sp-24: 24px; --sp-32: 32px; --sp-40: 40px;

  /* Radius */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-pill: 999px;

  /* Shadow */
  --shadow-card:  0 2px 8px rgba(45,30,20,.06);
  --shadow-card-2:0 4px 16px rgba(45,30,20,.08);
  --shadow-cta:   0 -2px 12px rgba(45,30,20,.08);
  --shadow-frame: 0 16px 48px rgba(45,30,20,.18);

  /* Layout */
  --device-width: 375px;
  --device-height: 812px;
  --tabbar-height: 56px;
  --statusbar-height: 44px;
  --navbar-height: 44px;
}

/* Utility */
.serif { font-family: var(--font-serif); }
.text-1 { color: var(--color-text-1); }
.text-2 { color: var(--color-text-2); }
.text-3 { color: var(--color-text-3); }
.text-accent { color: var(--color-accent); }
.text-military { color: var(--color-military); }
.tracking { letter-spacing: 2px; }
.tracking-lg { letter-spacing: 4px; }

/* Reset */
* { box-sizing: border-box; margin: 0; padding: 0; }
img { display: block; max-width: 100%; }
button { font-family: inherit; cursor: pointer; }
ul { list-style: none; }
a { color: inherit; text-decoration: none; }

html, body {
  font-family: var(--font-sans);
  color: var(--color-text-1);
  font-size: var(--fs-14);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
