/* 小豐・婚禮光影 v1 設計 token（淺色喜帖風）
   對比值為實算 WCAG 2.x，詳見 v1-design-spec.md §3 */
:root{
  /* 色彩：網站本體（淺色） */
  --c-bg:#FBF8F3;          /* 頁面底色：象牙紙 */
  --c-surface:#FFFFFF;     /* 卡片、輸入框、面板 */
  --c-surface-2:#F4EEE5;   /* 次要底：分組、摘要、segmented 底 */
  --c-line:#E6DDD0;        /* 裝飾分隔線（非必要辨識） */
  --c-line-strong:#958574; /* 輸入框/選項外框（UI 元件 ≥3:1） */
  --c-ink:#2B2622;         /* 主要文字 */
  --c-ink-2:#5C534A;       /* 次要文字、標籤 */
  --c-ink-3:#736859;       /* 提示、計數、placeholder 以外的小字 */
  --c-placeholder:#736859; /* placeholder：與 ink-3 同色，白底 5.45:1 */
  --c-accent:#8A6A3E;      /* 香檳金：主要按鈕底、選取框、進度 */
  --c-accent-hover:#765A33;
  --c-accent-soft:#F3E8D6; /* 選取狀態底 */
  --c-accent-ink:#6E5230;  /* accent-soft 上的文字 */
  --c-on-accent:#FFFFFF;
  --c-focus:#7A4E8C;       /* 焦點框（紫灰，與金色區隔） */
  --c-rose:#B45149;        /* 「更多」視窗強調字（沿用 v9） */
  --c-ok-bg:#E9F3EC;  --c-ok-ink:#2F6B45;
  --c-warn-bg:#FBF0DE;--c-warn-ink:#87510F;
  --c-danger:#A8322D;
  --c-scrim:rgba(43,38,34,.48);
  /* 色彩：只在預覽框 */
  --c-preview-bg:#0B0B10;
  --c-preview-ink:#F8F4EB;

  /* 字型（UI 只用 v9 已內建的兩套，不額外載入） */
  --f-sans:'Noto Sans TC','Noto Sans CJK TC',system-ui,sans-serif;
  --f-serif:'Noto Serif TC','Noto Serif CJK TC',serif;
  --f-script:'Great Vibes',cursive;

  /* 字級（手機 / 電腦相同，標題在電腦放大） */
  --fs-display:26px;  /* 步驟標題（電腦 28） */
  --fs-title:20px;    /* 視窗標題 */
  --fs-h3:16px;       /* 區塊標題 */
  --fs-body:16px;     /* 內文、輸入框（≥16 避免 iOS 自動放大） */
  --fs-label:14px;    /* 欄位標籤、按鈕 */
  --fs-small:13px;    /* 提示、說明 */
  --fs-micro:12px;    /* 英文小標、版本號 */
  --lh-tight:1.3; --lh-body:1.6;

  /* 間距（4 的倍數） */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:20px; --s-6:24px; --s-8:32px; --s-10:40px; --s-12:48px;
  /* 圓角 */
  --r-sm:8px; --r-md:12px; --r-lg:16px; --r-xl:20px; --r-pill:999px;
  /* 陰影（暖色、很淡） */
  --sh-1:0 1px 2px rgba(60,45,30,.06),0 1px 1px rgba(60,45,30,.04);
  --sh-2:0 4px 16px rgba(60,45,30,.08),0 1px 3px rgba(60,45,30,.06);
  --sh-3:0 16px 48px rgba(43,30,20,.18),0 4px 12px rgba(43,30,20,.08);
  --sh-preview:0 10px 30px rgba(20,14,10,.22);
  /* 尺寸 */
  --tap:44px;        /* 最小點擊區 */
  --ctl-h:48px;      /* 輸入框、主要按鈕 */
  --topbar-h:56px;   /* 手機；電腦 64 */
  --stepper-h:52px;
  --navbar-h:68px;   /* 手機底部上一步/下一步列（不含 safe-area） */
  --panel-w:480px;   /* 電腦右側步驟欄（1024–1279 為 440） */
  /* 動畫（只動 transform / opacity） */
  --ease-out:cubic-bezier(.2,.8,.2,1);
  --t-press:80ms; --t-fast:160ms; --t-base:220ms; --t-sheet:280ms;
}
@media (min-width:1024px){ :root{ --fs-display:28px; --topbar-h:64px; } }
@media (min-width:1024px) and (max-width:1279px){ :root{ --panel-w:440px; } }
