/*
  設計 token。取自設計稿 sportscoin_0804，但把設計稿裡三種互相衝突的橘
  （#ff681b / #ff6818 / #ff5a12）收斂成一組，並修掉兩處對比不足。

  頁尾掛著 AA 無障礙標章，所以底下每個顏色都實際算過對比（見註記的比值）：

  ⚠ 1. --orange (#ff681b) 對白底只有 2.90:1、對米底 2.74:1，不符 WCAG AA 內文的
       4.5:1，連大字／UI 元件的 3:1 都不到。因此拆成兩支：
         --orange       只用於框線、底線、色塊、裝飾（不承載文字）
         --orange-text  任何文字，以及任何要承載白字的表面（例如主要按鈕底色）
  ⚠ 2. 設計稿的輸入框框線 #e4cdb5 對白底只有 1.6:1，不符 WCAG 1.4.11 非文字對比
       所要求的 3:1（輸入框邊界屬於 UI 元件邊界）。改用 --field-line。

  兩處都與設計稿有可見色差，是刻意的。理由與計算見
  docs/superpowers/specs/2026-08-05-registrant-新版視覺改版-design.md
*/
:root {
	/* 品牌色 */
	--orange: #ff681b;        /* 裝飾用：白底 2.90:1 —— 不可承載文字 */
	--orange-text: #c04c08;   /* 文字／白字底色：白底 4.91:1、米底 4.65:1 */
	--orange-dark: #a53f05;   /* hover/active：白底 6.34:1 */
	--orange-soft: #fff3e7;   /* 淺橘底 */
	--brown: #3b2117;         /* 主要文字：米底 14.04:1 */
	--ink: #4a2414;           /* 次要標題：白底 13.52:1 */
	--muted: #6b4632;         /* 輔助文字：白底 8.24:1、米底 7.80:1 */
	--cream: #fff8eb;
	--line: #eadfd1;          /* 純裝飾分隔線，不是 UI 邊界，不受 1.4.11 規範 */
	--field-line: #a1835f;    /* 輸入框邊界：白底 3.54:1、米底 3.35:1 */

	/* 狀態色。錯誤訊息是最需要看清楚的文字，都對各自的底色算過 */
	--danger: #b3261e;        /* 於 --danger-bg 上 5.72:1 */
	--danger-bg: #fdecea;
	--warning-text: #7a4b00;  /* 於 --warning-bg 上 6.76:1 */
	--warning-bg: #fff4d6;
	--success-text: #1c6b3f;  /* 於 --success-bg 上 5.78:1 */
	--success-bg: #e6f5ec;

	/* 焦點框：沿用原政府外殼已通過無障礙稽核的藍色（白底 5.98:1），
	   不用設計稿的橘色柔和陰影——橘色對比不足，且與錯誤狀態的顏色語意打架 */
	--focus: #005fcc;

	/* 尺寸 */
	--shell-max: 1200px;
	--radius-sm: 10px;
	--radius: 16px;
	--radius-lg: 26px;
	--radius-pill: 999px;

	--shadow-sm: 0 4px 14px rgba(92, 52, 21, .08);
	--shadow: 0 12px 30px rgba(90, 50, 15, .12);

	/* 字級 */
	--fs-h1: clamp(28px, 3.4vw, 40px);
	--fs-h2: clamp(20px, 2.2vw, 26px);
	--fs-body: 16px;
	--fs-sm: 14px;
}