:root {
  --stage-width: 1366px; /* fallback only - stage.js's initStage() overwrites this at boot with
    whichever of 1024 (4:3) / 1366 (16:9) physics.js auto-detected for this device */
  --stage-height: 768px;
  --color-bg-outside-stage: #000;
  --color-bg-stage: #1a1a2e;
  --color-rotate-hint-bg: #16213e;
  --color-rotate-hint-text: #f1f1f1;
  --color-player-idle: #4ecdc4;
  --color-player-run: #2ea8a0;
  --color-player-jump: #1a7d76;
  --color-platform: #8d6e63;
  --color-monster: #e94560;
  --color-battery-fill: #4ecdc4;
  --color-battery-empty: rgba(0, 0, 0, 0.3);
  --color-battery-border: #f1f1f1;
  --color-bubble-trigger: #fb8500;
  --color-bubble-coin: #ffd60a;
  --color-bubble-item: #9b5de5;
  --color-bubble-answer: #4361ee;
  --color-radar-bg: #051014;
  --color-radar-line: rgba(59, 238, 226, 0.35);
  --color-radar-sweep: rgba(59, 238, 226, 0.4);
  --color-radar-glow: #3beee2;
  --color-quiz-panel-bg: rgba(59, 238, 226, 0.16); /* 題目/選項合併面板的半透明底色，跟 --color-radar-glow 同色系 */
  --color-gate-panel-light: #3a4658;
  --color-gate-panel-dark: #1c2532;
  --color-gate-lock: #e63946;

  /* 科技機械風設計 token（工程規格書 12.2）：深色底、發光陰影、金屬感漸層 */
  --color-bg-deep: #0b1220;
  --color-bg-panel: #131c2e;
  --glow-soft: 0 0 12px currentColor;
  --glow-strong: 0 0 24px currentColor, 0 0 6px #fff;
  --metal-gradient: linear-gradient(145deg, #3a4658, #1c2532);
  --font-ui: 'Chakra Petch', 'Noto Sans TC', sans-serif;

  /*
   * 每一關的代表色（themeColor）已經是 levels.json 的資料欄位，不在這裡重複寫死
   * --level1-accent ~ --level5-accent 這 5 個值，避免同一份顏色資料要同時改 JSON 又改 CSS。
   * 實際做法：level-scene.js 進場時讀 levelConfig.themeColor，寫入這個 --level-accent
   * 變數（見 core/scene-manager.js 呼叫的 level-scene.js mount()），CSS 元件一律吃
   * var(--level-accent, 預設色) 這個變數，換關卡顏色只需要改 levels.json。
   */
  --level-accent: var(--color-monster);
  --color-item-glow: #4dfcea; /* 問號泡泡專用：亮藍綠色科技感，跟原本 --color-bubble-item 的紫色分開 */
  --color-gate-hint: #e056fd; /* 傳送門提示箭頭：跟傳送門美術素材同色系的粉紫色 */
}
