/* ============================================================
   tokens.css — Design tokens (CSS custom properties only)
   ============================================================ */

:root {
  --bg: #FAF8F5;
  --bg-soft: #F4F1EA;
  --bg-card: #FFFFFF;
  --ink: #2C2C2C;
  --ink-soft: #5B5B5B;
  --ink-muted: #8A8579;
  --line: #E6E1D6;
  --line-soft: #EFEAE0;
  --accent: #2D5F4E;        /* 深墨綠 */
  --accent-deep: #234C3E;
  --accent-soft: #E7EFE9;
  --accent-tint: #F1F6F1;
  --warm: #C97A3A;
  --radius-sm: 8px;
  --radius-md: 10px;
  --radius-lg: 12px;
  --shadow-sm: 0 1px 2px rgba(44,44,44,.04), 0 1px 1px rgba(44,44,44,.03);
  --shadow-md: 0 6px 18px -10px rgba(44,44,44,.16), 0 2px 6px -2px rgba(44,44,44,.05);
  --shadow-lg: 0 18px 40px -22px rgba(44,44,44,.22), 0 4px 10px -4px rgba(44,44,44,.06);
  --container: 1200px;
  --gutter: clamp(16px, 4vw, 40px);
  --tap: 44px; /* min tap target */
  --header-h: 60px;
}

@media (min-width: 481px)  { :root { --header-h: 64px; } }
@media (min-width: 1025px) { :root { --header-h: 68px; } }