:root {
  /* Primitive：實測自舊站頂部列／底部導覽列（devtools computed background-image），命名不帶站台代碼 */
  --gradient-TealBar: linear-gradient(90deg, #0289a1 0%, #4aa9a2 50%, #0289a1 100%);
  /* Primitive：實測自舊站左側分類 Tab 選中態（devtools computed background-image） */
  --gradient-TabActive: linear-gradient(177deg, #92caa3 2.42%, #0289a1 97.84%);
  /* Primitive：實測自舊站登入／註冊彈窗卡片背景（devtools computed background-image） */
  --gradient-Cream: linear-gradient(180deg, #fffaeb 0%, #f5efe0 100%);
  /* Primitive：實測自 WalletCenter 頁「資金回收」按鈕（devtools computed background-image） */
  --gradient-NavyRadial: radial-gradient(96.76% 96.76% at 50% 3.24%, #202d4d 21%, #0c1429 100%);
  /* Primitive：實測自 WithdrawAccountManagement 頁新增銀行帳戶表單「送出」按鈕
     （devtools computed background-image 第二層，第一層是白色 40% 疊色，見 theme.css 的
     --color-ButtonDisabledOverlay，disabled 態才會疊上去，這裡只記錄底下的漸層本身） */
  --gradient-TealRadial: radial-gradient(120.46% 87.5% at 27.5% -15%, #4aa9a2 39.98%, #0289a1 100%);

  .dark-theme {
    /* Semantic：沿用既有共用元件命名（table/modal 皆吃 --gradient-primary-500） */
    --gradient-primary-500: var(--gradient-TealBar);
    /* 補齊三層架構：頂部列／底部導覽共用同一條漸層，原本 Component 直接引用 Primitive */
    --gradient-brand-bar: var(--gradient-TealBar);
    --gradient-card: var(--gradient-Cream);

    /* Component：頂部列／底部導覽（分類 Tab 選中態直接用 --gradient-TabActive，
       它在 :root 就宣告了，.dark-theme 是 :root 的子選擇器可以直接繼承，不用在這裡重複宣告） */
    --gradient-header: var(--gradient-brand-bar);
    --gradient-navbar: var(--gradient-brand-bar);
    --gradient-ModalCard: var(--gradient-card);
    /* Component：會員中心圖示底色／設定語系彈窗 header 與按鈕共用的品牌強調漸層，
       引用 Semantic 層 --gradient-primary-500（不直接引用 Primitive），避免
       Component 樣式檔跳層直接吃 Semantic 命名的變數 */
    --gradient-AccentSurface: var(--gradient-primary-500);
    /* Semantic + Component：會員中心「登出」按鈕，實測跟分類 Tab 選中態同一條漸層（--gradient-TabActive），沿用不新增 Primitive */
    --gradient-surface-cta: var(--gradient-TabActive);
    --gradient-CtaButton: var(--gradient-surface-cta);
    /* Component：變更密碼頁卡片背景，實測跟登入／註冊彈窗卡片同一條奶油漸層，沿用 --gradient-card 不另開 Semantic */
    --gradient-ChangePasswordCard: var(--gradient-card);
    /* Component：投注記錄頁篩選表單／結果列表卡片背景，實測跟變更密碼頁同一條奶油漸層，沿用 --gradient-card 不另開 Semantic */
    --gradient-BetRecordCard: var(--gradient-card);
    /* Component：個人資訊頁「送出／取消」按鈕，實測跟頂部列／底部導覽同一條橫向漸層（--gradient-brand-bar），沿用 Semantic 不另開 Primitive */
    --gradient-MemberInfoCancelButton: var(--gradient-brand-bar);
    /* Semantic + Component：WalletCenter 頁「資金回收」按鈕 */
    --gradient-accent-wallet-recovery: var(--gradient-NavyRadial);
    --gradient-WalletRecoveryButton: var(--gradient-accent-wallet-recovery);
    /* Semantic + Component：WithdrawAccountManagement 頁新增銀行帳戶表單「送出」按鈕 */
    --gradient-accent-form-submit: var(--gradient-TealRadial);
    --gradient-WithdrawAccountSubmitButton: var(--gradient-accent-form-submit);
    /* Component：同表單「取消」按鈕與清單頁「新增銀行帳戶」按鈕，實測跟頂部列／底部導覽同一條橫向漸層，沿用既有 Semantic 不新開 */
    --gradient-WithdrawAccountCancelButton: var(--gradient-brand-bar);
    --gradient-WithdrawAccountAddButton: var(--gradient-primary-500);
    /* Component：站內信「新信件」／「詳情」彈窗卡片背景，實測跟登入／註冊彈窗卡片同一條奶油漸層，沿用 --gradient-card 不另開 Semantic */
    --gradient-SiteMailModalCard: var(--gradient-card);
    /* Component：站內信彈窗內所有按鈕（送出／取消／刪除／關閉），實測皆為同一條頂部列橫向漸層，
       不分按鈕語意（連 Vuetify 的 red/white 色票 class 視覺上也被蓋成同一條），沿用既有 Semantic 不新開 */
    --gradient-SiteMailButton: var(--gradient-brand-bar);
    /* Component：OnlineServices 頁客服卡片背景，實測自 https://m.rong99.net/#/OnlineServices
       的 `.services-link`（devtools computed background-color #FFFAEB），跟登入／註冊彈窗卡片同一條
       奶油漸層起始色，沿用既有 --gradient-card 不另開 Semantic */
    --gradient-OnlineServiceCard: var(--gradient-card);
    /* Component：OnlineServices 頁「JOIN NOW」按鈕，實測視覺跟頂部列／底部導覽同一條品牌橫向漸層
       （舊站該按鈕實際 CSS 是 `background:none!important`，視覺色塊來源不明，故取視覺上一致的品牌漸層
       還原，比照 --gradient-MemberInfoCancelButton／--gradient-WithdrawAccountCancelButton 的沿用方式），
       不另開 Primitive */
    --gradient-OnlineServiceButton: var(--gradient-brand-bar);
  }
}