:root {
  /* Primitive：以下皆為完整寫死的漸層定義，設計稿給的原始值，無法再拆解出更底層的色彩變數 */
  --gradient-body: linear-gradient(180deg, #000000 28.2%, #1A1A1A 100%);
  --gradient-login-panel: linear-gradient(0deg, #000000 99%, rgba(84, 165, 39, 0.8) 100%);
  --gradient-appDownload-bg: linear-gradient(180deg, #1F1F1F 0%, #000000 100%);
  --gradient-appDownload-border: linear-gradient(90deg, #091A00 0%, #256600 50%, #091A00 100%);
  --gradient-menu-bg: linear-gradient(180deg, #000000 0%, #0B0B0B 70%, #171717 100%);
  --gradient-balance-bg: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);

  /*會員中心*/
  --gradient-member-center-page:
    radial-gradient(circle at 23% 0, rgba(74, 148, 29, 0.28), transparent 29%),
    linear-gradient(180deg, #071006 0%, #000000 31%);
  --gradient-member-center-header: linear-gradient(
    0deg,
    rgba(0, 0, 0, 0) 0%,
    rgba(22, 22, 22, 0.2) 49%,
    rgba(30, 30, 30, 0.5) 100%
  );
  --gradient-member-center-summary-divider: linear-gradient(
    180deg,
    transparent 0%,
    rgba(123, 240, 55, 0.24) 50%,
    transparent 100%
  );
  --gradient-member-center-progress:
    radial-gradient(circle 20px at 92% 50%, rgba(132, 255, 61, 1) 0%, rgba(132, 255, 61, 0) 100%),
    linear-gradient(90deg, rgba(32, 61, 15, 1) 40%, rgba(208, 255, 0, 1) 100%);
  --gradient-member-center-progress-track: linear-gradient(
    90deg,
    rgba(37, 42, 34, 1) 0%,
    rgba(24, 31, 20, 1) 100%
  );
  --gradient-member-center-progress-dot-1: radial-gradient(
    circle,
    rgba(229, 255, 61, 1) 0%,
    rgba(229, 255, 61, 0) 100%
  );
  --gradient-member-center-progress-dot-2:
    radial-gradient(circle, rgba(132, 255, 61, 1) 0%, rgba(132, 255, 61, 0) 100%),
    radial-gradient(circle, rgba(225, 240, 0, 1) 0%, rgba(255, 255, 255, 0.3) 100%);
  --gradient-member-center-progress-endcap:
    radial-gradient(circle at 98% 46%, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%),
    linear-gradient(-90deg, rgba(208, 255, 0, 1) 0%, rgba(208, 255, 0, 0) 46%);
  --gradient-member-center-icon-frame: radial-gradient(
    circle at 50% 44%,
    #18340c 0%,
    #071006 59%,
    #0b0b0b 100%
  );
  --gradient-member-center-help-menu: #171717;

  /*任務中心*/
  --gradient-task-center-page: linear-gradient(180deg, #071006 0%, #000 24%, #000 100%);
  --gradient-task-center-hero: linear-gradient(
    180deg,
    rgba(17, 39, 10, 0.96) 0%,
    rgba(0, 0, 0, 0.96) 100%
  );
  --gradient-task-center-hero-extension: linear-gradient(#000, #000);
  --gradient-task-center-progress-track: linear-gradient(180deg, #1c2918 0%, #10150f 100%);
  --gradient-task-center-progress-fill: linear-gradient(
    90deg,
    #386d1a 0%,
    #d0ff00 74%,
    #f4ff85 100%
  );
  --gradient-task-center-active-tab-glow: radial-gradient(
    ellipse at 50% 0%,
    rgba(132, 255, 61, 0.3) 0%,
    rgba(132, 255, 61, 0) 72%
  );

  /*簽到活動 V3*/
  --gradient-sign-in-summary-divider: linear-gradient(
    180deg,
    rgba(123, 240, 55, 0) 0%,
    #7BF037 50%,
    rgba(123, 240, 55, 0) 100%
  );
  --gradient-sign-in-waiting:
    radial-gradient(ellipse at 50% 72%, rgba(26, 92, 47, 0.42) 0%, transparent 48%),
    linear-gradient(180deg, #000000 0%, #020a06 100%);
  --gradient-sign-in-progress: linear-gradient(90deg, #3f681b 0%, #ecff78 76%, #ffffff 100%);
  --gradient-sign-in-action: linear-gradient(180deg, #fff8c9 0%, #ffd943 48%, #b98706 100%);
  --gradient-sign-in-action-disabled: linear-gradient(
    180deg,
    #f4f4f4 0%,
    #5d5d5d 45%,
    #202020 100%
  );
  --gradient-sign-in-resign: linear-gradient(180deg, #728a4a 0%, #1c2813 100%);
  --gradient-sign-in-coin: radial-gradient(circle at 35% 30%, #fff39b 0%, #b97803 64%, #593300 100%);
  --gradient-sign-in-modal-header: linear-gradient(180deg, #162312 0%, #080b07 100%);

  --gradient-primary-500: #cadfff;

  --gradient-background-500: radial-gradient(
    87.23% 87.23% at 50% 12.77%,
    rgba(60, 132, 217, 0.45) 0%,
    rgba(19, 49, 84, 0.45) 100%
  );
  --gradient-background-600: #a6cfff;
  --gradient-background-700: radial-gradient(
    96.76% 96.76% at 50% 3.24%,
    #1f53a0 0%,
    #1764ab 30.5%,
    #0c1429 100%
  );
  --gradient-background-800: linear-gradient(180deg, #cbe2ffe5 0%, #cbe2ffe5 100%);
  --gradient-background-900: linear-gradient(180deg, #83c8fb 0%, #0d47dc 41%, #1122a0 100%);

  --gradient-button-200: linear-gradient(180deg, #f5f5f5 21.08%, #bababa 100%);
  --gradient-button-500: linear-gradient(180deg, #f98323 27%, #d14605 100%);
  --gradient-button-600: linear-gradient(0deg, #3b55de 0%, #186cd0 97%);

  --gradient-border-400: linear-gradient(180deg, #b2c6d8 0%, #69ffff 100%);
  --gradient-border-500: linear-gradient(270deg, #263557 0%, #3b4d71 100%);
  --gradient-border-600: linear-gradient(180deg, #63ffff 0%, #d6d6d6 100%);

  /* Semantic：VIP 老虎半身裁切底部淡出遮罩（mask-image 用），露出卡片底色
     模擬陰影淡出效果，不是生硬的裁切線 */
  --gradient-fade-mask: linear-gradient(to bottom, #000 75%, transparent 100%);

  --gradient-linear-500: linear-gradient(
    to right,
    rgba(105, 253, 254, 0) 0%,
    rgba(105, 253, 254, 0.23) 19%,
    rgb(105, 253, 254) 50%,
    rgba(105, 253, 254, 0) 100%
  );

  .dark-theme {
    /* Primitive：以下同樣是完整寫死的漸層定義 */
    --gradient-primary-500: radial-gradient(96.76% 96.76% at 50% 3.24%, #202d4d 21%, #0c1429 100%);

    --gradient-background-500: radial-gradient(
      87.23% 87.23% at 50% 12.77%,
      rgba(60, 132, 217, 0.45) 0%,
      rgba(19, 49, 84, 0.45) 100%
    );
    --gradient-background-600: radial-gradient(
      96.76% 96.76% at 50% 3.24%,
      #202d4d 21%,
      #0c1429 100%
    );
    --gradient-background-700: radial-gradient(
      96.76% 96.76% at 50% 3.24%,
      #1f53a0 0%,
      #1764ab 30.5%,
      #0c1429 100%
    );
    --gradient-background-800: linear-gradient(90deg, rgba(3, 3, 3, 0.3) 0%, rgba(51, 66, 107, 0.6) 100%);

    --gradient-button-200: linear-gradient(180deg, #191e43 43.34%, #0e101e 69.28%, #191b2c 98.59%);
    --gradient-button-500: radial-gradient(
      103.07% 103.07% at 50% 22.13%,
      #0cb6cd 0%,
      #435b99 50%,
      #192458 100%
    );
    --gradient-button-600: linear-gradient(180deg, #b2c6d8 -37.18%, #69ffff 100%);

    --gradient-border-400: linear-gradient(180deg, #b2c6d8 0%, #69ffff 100%);
    --gradient-border-500: linear-gradient(270deg, #263557 0%, #3b4d71 100%);
    --gradient-border-600: linear-gradient(180deg, #63ffff 0%, #d6d6d6 100%);

    --gradient-linear-500: linear-gradient(
      to right,
      rgba(105, 253, 254, 0) 0%,
      rgba(105, 253, 254, 0.23) 19%,
      rgb(105, 253, 254) 50%,
      rgba(105, 253, 254, 0) 100%
    );

    /* 全部遊戲列表頁 PageTitle 背景 */
    --gradient-linear-600: linear-gradient(
      0deg,
      rgba(161, 161, 161, 0.1) 0%,
      rgba(94, 90, 90, 0.2) 79%,
      rgba(119, 119, 119, 1) 100%
    );

    /* Semantic：骨架屏 shimmer 掃光效果（引用 theme.css 的 Semantic 色票，不可跳過 Semantic 層直接引用 Component 色票） */
    --gradient-shimmer: linear-gradient(
      90deg,
      var(--color-surface-card-fill) 0%,
      var(--color-surface-card-hover) 50%,
      var(--color-surface-card-fill) 100%
    );

    /* Component：大廳遊戲讀取骨架卡片背景 */
    --gradient-skeleton-bg: var(--gradient-shimmer);

    /* Component：全螢幕載入畫面 logo 遮罩掃光效果 */
    --gradient-loading-shine: linear-gradient(
      45deg,
      rgba(255, 255, 255, 0) 40%,
      var(--color-shine-highlight),
      rgba(255, 255, 255, 0) 60%
    );
  }
}
