/* ============================================================
   Dantiaリワード — デザイントークン
   すべての色・文字・余白・角丸はここで定義し、app.css から参照する。
   ============================================================ */
body.member {
  /* --- Color: brand */
  --c-navy-700: #0F2D4E;   /* 主色。CTA・見出し・アクティブ */
  --c-navy-600: #163A63;   /* 主色ホバー */
  --c-navy-100: #E7EDF5;   /* 選択状態・支払対象バッジ地 */
  --c-green-600: #137A57;  /* 承認テキスト */
  --c-green-500: #1F9D72;  /* アクセント・リンク・承認ドット */
  --c-green-100: #E6F5EF;  /* 承認バッジ地 */

  /* --- Color: ink */
  --c-ink: #14213A;        /* 本文 */
  --c-ink-60: #5B6B80;     /* 補足・ラベル */
  --c-ink-40: #8A97A8;     /* キャプション・非活性 */
  --c-ink-25: #B0BAC7;     /* 区切り記号・矢印 */

  /* --- Color: surface */
  --c-bg: #F5F6F8;         /* 画面背景 */
  --c-surface: #FFFFFF;    /* カード */
  --c-surface-2: #F0F2F5;  /* タグ地・行ホバー */
  --c-border: #E6E9EE;     /* 罫線 */
  --c-border-strong: #CBD3DE; /* 入力枠・アウトラインボタン */
  --c-divider: #F0F2F5;    /* リスト内の区切り */

  /* --- Color: status（状態表示にのみ使用。訴求には使わない） */
  --c-st-pending-bg: #EEF1F5;  --c-st-pending-fg: #4A5A70;
  --c-st-approved-bg: #E6F5EF; --c-st-approved-fg: #137A57;
  --c-st-rejected-bg: #FBEDEB; --c-st-rejected-fg: #A8423A; --c-st-rejected-line: #F3D9D6; --c-st-rejected-tint: #FFF9F8;
  --c-st-attention-bg: #FDF3E1; --c-st-attention-fg: #8F5E0E; --c-st-attention-line: #F0D9A8;
  --c-st-payable-bg: #E7EDF5;  --c-st-payable-fg: #0F2D4E;
  --c-st-paid-bg: #F0F2F5;     --c-st-paid-fg: #6B7A8F;

  /* --- Typography */
  --f-sans: system-ui, -apple-system, BlinkMacSystemFont, 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', sans-serif;
  --f-num: system-ui, -apple-system, BlinkMacSystemFont, 'Hiragino Sans', sans-serif; /* 金額・日付・件数 */
  --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-26: 26px;
  --fs-amt-sm: 15px; --fs-amt: 18px; --fs-amt-lg: 24px; --fs-amt-xl: 32px;
  --lh-tight: 1.35; --lh-body: 1.6; --lh-loose: 1.75;

  /* --- Spacing（4の倍数） */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px;
  --page-x: 20px;          /* 画面左右余白（モバイル） */
  --content-max: 1120px;   /* PCコンテンツ幅 */

  /* --- Radius */
  --r-sm: 6px;   /* タグ */
  --r-md: 10px;  /* 小ボタン・ナビ項目 */
  --r-lg: 12px;  /* ボタン・入力 */
  --r-xl: 16px;  /* カード */
  --r-2xl: 20px; /* サマリーパネル */
  --r-pill: 999px;

  /* --- Elevation（原則フラット。ネイビーパネルのみ） */
  --sh-navy: 0 8px 24px -12px rgba(15, 45, 78, .45);
  --sh-seg: 0 1px 2px rgba(0, 0, 0, .06);
  --focus-ring: 0 0 0 3px rgba(15, 45, 78, .12);

  /* --- Controls */
  --h-btn: 52px; --h-btn-sm: 40px; --h-btn-xs: 32px; --h-input: 52px; --h-tabbar: 84px; --h-topbar: 64px;

  /* --- Safe area（埋込時に app.js が上書き） */
  --safe-top: env(safe-area-inset-top, 0px); --safe-bottom: env(safe-area-inset-bottom, 0px);
}