/* ============================================================
   base.css — reset + variables + body
   ============================================================ */

:root {
  --bg:        #121018;
  --panel:    #1e1a28;
  --panel-2:  #2a2438;
  --border:   #3d3550;
  --text:     #e6e0f0;
  --muted:    #8c7fb0;
  --accent:   #c4a35a;

  /* 元素 / レアリティカラー (= テンプレート由来、 他派生で利用) */
  --garuda:    #5ecf8a;
  --ifrit:     #e76060;
  --leviathan: #56ccf2;
  --tiamat:    #bb86fc;

  /* MCH 5 派閥 (= SPEC-003、 MyCryptoSurvivor 本体はこちらを使う) */
  --seiryu:    #5ecf8a;   /* 青龍 / 東 / 木 */
  --suzaku:    #e76060;   /* 朱雀 / 南 / 火 */
  --byakko:    #d4d4dc;   /* 白虎 / 西 / 金 */
  --genbu:     #56ccf2;   /* 玄武 / 北 / 水 */
  --kouryu:    #f0c14b;   /* 黄龍 / 中央 / 土 */

  /* VS HUD (= SPEC-005、 SPEC-004 から HP のみに圧縮) */
  --hp:        #e76060;   /* 体力 = 赤 */
  --xp:        #f0c14b;   /* 経験値 = 黄 */
  /* legacy: SPEC-004 由来、 後続 SPEC で再利用候補のため残置 */
  --temp:      #56ccf2;
  --food:      #5ecf8a;

  --rarity-n:  #aaa;
  --rarity-r:  #56ccf2;
  --rarity-sr: #bb86fc;
  --rarity-ssr: #ffd700;

  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.6);
}

*, *::before, *::after { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  /* SPEC-010: モバイル battle 描画範囲 fix。 viewport を厳密にロックするため html/body の高さを揃え、 overflow を抑止。 */
  height: 100%;
  overflow: hidden;
  background: var(--bg);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN",
               "Hiragino Sans", "Yu Gothic", Meiryo, sans-serif;
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
  overscroll-behavior: none;
}

img { max-width: 100%; display: block; }

button {
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}

a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }

.hidden { display: none !important; }

.text-truncate {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.text-clamp-2 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}