/* ============================================================
   消費者端「設計 token」——只放配色/字體/圓角/陰影等變數。
   版面與元件樣式在 game.css，一律引用這裡的 var()，不寫死色值。
   之後要調整視覺風格（換色、換字、改亮暗）只動這一支檔案即可。
   目前主題：深色奇幻 RPG（手機直式）。
   ============================================================ */
:root {
  /* ---- 字體 ---- */
  --font-title: "Trajan Pro", "Noto Serif TC", "Microsoft JhengHei", serif;
  --font-base: "Microsoft JhengHei", "Noto Sans TC", system-ui, -apple-system, sans-serif;

  /* ---- 底層表面 ---- */
  --bg-0: #0b0913;      /* 最底 */
  --bg-1: #120e22;      /* app 容器背景 */
  --bg-2: #1a1430;      /* 區塊漸層用 */
  --panel: #191327;     /* 卡片/面板 */
  --panel-2: #221a3c;   /* 面板內次級塊 */
  --panel-3: #2a2148;   /* hover / active */
  --border: #33294f;
  --border-soft: #271f3d;

  /* ---- 文字 ---- */
  --text: #ece8ff;
  --text-dim: #a89fd0;
  --text-mute: #6f6790;

  /* ---- 品牌主色 ---- */
  --gold: #f4c84a;
  --gold-soft: #c9a63b;
  --accent: #a855f7;
  --accent-2: #7c3aed;

  /* ---- 狀態色 ---- */
  --danger: #ff5d73;
  --success: #38d39f;
  --info: #5a8bff;
  --warn: #f7b733;

  /* ---- 血條 / 魔王 / 弱點 ---- */
  --hp-from: #e0417a;
  --hp-to: #f7b733;
  --boss-aura: rgba(224, 65, 122, 0.35);
  --weakness: #ffd24a;

  /* ---- 稀有度 ---- */
  --rarity-common: #9aa0c3;
  --rarity-rare: #5a8bff;
  --rarity-legendary: #f4c84a;

  /* ---- 進度條 ---- */
  --bar-bg: #241d3c;
  --bar-preview: rgba(244, 200, 74, 0.35);

  /* ---- 形狀 ---- */
  --radius: 14px;
  --radius-sm: 10px;
  --radius-lg: 22px;
  --shadow: 0 8px 30px rgba(0, 0, 0, 0.45);
  --shadow-soft: 0 4px 16px rgba(0, 0, 0, 0.35);
  --glow-gold: 0 0 16px rgba(244, 200, 74, 0.5);
  --glow-accent: 0 0 18px rgba(168, 85, 247, 0.55);
  --glow-danger: 0 0 18px rgba(255, 93, 115, 0.55);

  /* ---- 版面 ---- */
  --app-max: 480px;

  /* ---- 主題漸層（可整組替換換風格） ---- */
  --grad-app: radial-gradient(120% 60% at 50% 0%, #1d1540 0%, var(--bg-1) 45%, var(--bg-0) 100%);
  --grad-gold: linear-gradient(135deg, #f7d774, #e0a92e);
  --grad-accent: linear-gradient(135deg, #a855f7, #6d28d9);
  --grad-hp: linear-gradient(90deg, var(--hp-from), var(--hp-to));
  --grad-danger: linear-gradient(135deg, #ff6b81, #c0304a);
}
