/* CardPin 品牌設計變數（018）。官網（apps/auth-web）與後台（apps/admin-web）共用；兩站的 public/brand/ 是本目錄的副本，
   只改這裡，再以 `python3 tools/check_brand_sync.py --write` 同步（CI 檢查一致）。
   顏色來自品牌素材定案（docs/superpowers/specs/2026-10-13-brand-assets-design.md）；文字與背景的組合列在檔尾的 contrast-pairs，
   由 tools/check_contrast.py 驗證 WCAG 2.1 AA。字型路徑相對於本檔，所以副本與字型檔要放在同一個 brand/ 目錄。 */

@font-face {
  font-family: "Plus Jakarta Sans";
  src: url("fonts/plus-jakarta-sans-latin.woff2") format("woff2");
  font-weight: 500 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* 顏色 */
  --brand-navy-1: #153B86;
  --brand-navy-2: #0A2558;
  --brand: #1B6EF3;        /* 按鈕底色、圖示、裝飾。不作為淺底上的內文色（對比 4.28） */
  --brand-ink: #155AD0;    /* 連結文字、側欄選中文字 */
  --brand-soft: #E8F0FE;   /* 淡藍底：側欄選中、懸停 */
  --accent: #FF7A59;       /* 珊瑚：只作裝飾（落點、左邊線）；不作為白字的底色（對比 2.57） */
  --amber: #FFC857;        /* 琥珀：裝飾 */
  --bg: #F5F7FB;
  --surface: #FFFFFF;
  --text: #1D2433;
  --muted: #5B6475;
  --line: #D8DEE9;
  --danger: #C62828;
  --ok: #1E7A3C;
  --warn-bg: #FFF4E5;
  --warn-ink: #9A5B00;
  /* 狀態底色（後台的訊息、徽章、表格） */
  --danger-soft: #FDECEA;
  --ok-soft: #E7F5EC;
  --neutral-soft: #EEF0F4;
  --table-head: #EEF2F9;
  --pending-bg: #FFFAF0;
  /* 後台的種子卡片頁：匯入框、地圖底色、釘子 */
  --dropzone-line: #9DB8E8;
  --map-bg: #E9EEF6;
  --pin-draft: #F59E0B;
  --pin-unpublished: #8C95A6;
  --lightbox-bg: #111111;

  /* 字型：中文用各平台的系統黑體（不下載中文字型）；Plus Jakarta Sans 只含拉丁字元，用在字標與標題 */
  --font-zh: "PingFang TC", "Noto Sans TC", "Noto Sans CJK TC", "Microsoft JhengHei", sans-serif;
  --font-display: "Plus Jakarta Sans", var(--font-zh);
  --font-body: system-ui, -apple-system, "Segoe UI", var(--font-zh);
  --font-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;

  /* 字級（rem，隨瀏覽器字級縮放） */
  --fs-0: 0.875rem;
  --fs-1: 1rem;
  --fs-2: 1.125rem;
  --fs-3: 1.375rem;
  --fs-4: 1.75rem;
  --fs-5: 2.25rem;

  /* 圓角、陰影、間距 */
  --radius-sm: 8px;
  --radius: 12px;
  --radius-lg: 16px;
  --shadow-card: 0 2px 8px rgba(10, 37, 88, 0.06);
  --shadow-pop: 0 12px 32px rgba(10, 37, 88, 0.12);
  --shadow-paper: 0 6px 18px rgba(10, 37, 88, 0.1);
  --shadow-dialog: 0 12px 32px rgba(0, 0, 0, 0.25);
  --shadow-float: 0 4px 16px rgba(10, 37, 88, 0.25);
  --shadow-lightbox: 0 12px 32px rgba(0, 0, 0, 0.45);
  --shadow-pin: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.45));
  --backdrop: rgba(10, 37, 88, 0.45);
  --backdrop-dark: rgba(0, 0, 0, 0.75);
  --focus-ring: #8FBBFF;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 40px;
}

/* contrast-pairs
--text / --bg 4.5 內文
--text / --surface 4.5 卡片內文
--muted / --bg 4.5 次要文字
--muted / --surface 4.5 卡片次要文字
--brand-ink / --bg 4.5 連結
--brand-ink / --surface 4.5 卡片內連結
--brand-ink / --brand-soft 4.5 側欄選中、懸停
--brand-navy-2 / --bg 4.5 標題
--brand-navy-2 / --surface 4.5 卡片標題、後台頁首
--surface / --brand 4.5 按鈕與即將推出標示
--surface / --danger 4.5 危險按鈕
--danger / --surface 4.5 錯誤訊息
--ok / --surface 4.5 成功訊息
--warn-ink / --warn-bg 4.5 待審徽章
--danger / --danger-soft 4.5 錯誤訊息底色
--ok / --ok-soft 4.5 成功訊息底色
--muted / --neutral-soft 4.5 已取消、未發佈徽章
--muted / --table-head 4.5 表頭
--brand-navy-2 / --brand-soft 4.5 資訊訊息、徽章
--surface / --brand-navy-2 4.5 管理員徽章、復原提示
--text / --pending-bg 4.5 待審列
--brand / --surface 3 大字與圖示
*/
