/* =====================================================================
   第9弾（係A）：いのち（♥）と ひらめき技
   ・メニューの自分の欄のチップ「いのち ♥×8」・ステータスの行・戦いのメンバーの札の ♥（のこり2以下は赤く光る）
   ・ひらめいた人の頭の上の 💡「ひらめいた！」・とくぎの一覧の見出し「ひらめき技」・記録の行（kind spark・lp）
   ===================================================================== */

/* ---- いのちのチップ（メニューの自分の欄） ---- */
.chip.lp-chip { gap: 2px; background: rgba(255, 134, 179, .14); border: 1px solid rgba(255, 134, 179, .35); color: #ffd3e3; }
.chip.lp-chip .lp-h { color: #ff6f9c; margin-left: 3px; }
.chip.lp-chip b { font-weight: 700; }
.chip.lp-chip small { margin-left: 4px; font-size: inherit; }
.chip.lp-chip.low { background: rgba(214, 40, 84, .42); border-color: rgba(255, 110, 150, .85); color: #fff; animation: lpGlow 1.6s ease-in-out infinite; }
.chip.lp-chip.low .lp-h { color: #fff; }
@keyframes lpGlow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255, 70, 120, .0), 0 0 6px rgba(255, 70, 120, .45); }
  50% { box-shadow: 0 0 0 2px rgba(255, 70, 120, .35), 0 0 14px rgba(255, 70, 120, .85); }
}

/* ---- ステータスの行 ---- */
.kv dd.lp-dd { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; }
.kv dd.lp-dd .lp-hearts { color: #ff6f9c; letter-spacing: .06em; font-size: calc(15px * var(--fs-k)); line-height: 1.2; overflow-wrap: anywhere; }
.kv dd.lp-dd.low .lp-hearts { color: #ff4f7e; text-shadow: 0 0 8px rgba(255, 70, 120, .8); }
.kv dd.lp-dd.low b { color: #ff8fae; }
.kv dd.lp-dd .lp-note { flex-basis: 100%; }

/* ---- 戦いのメンバーの札：HPの数字のとなりの ♥ ---- */
.b-meter .lpn { flex: none; font-size: var(--fs-min); font-weight: 700; line-height: 1.15; color: #ff9fbd; white-space: nowrap; font-variant-numeric: tabular-nums; }
.b-meter .lpn.low { color: #ff4f7e; text-shadow: 0 0 6px rgba(255, 70, 120, .9); animation: lpBlink 1.4s ease-in-out infinite; }
@keyframes lpBlink { 50% { opacity: .55; } }
.b-ally.mini .b-meter .lpn { font-size: calc(var(--fs-min) - 2px); }

/* ---- ひらめいた！（札の顔の上。画面の上の層に置いて、札に合わせる：ui/sparks.js の popSpark） ---- */
.b-ally.sparked { border-color: #ffe27a; box-shadow: 0 0 0 2px rgba(255, 226, 122, .55), 0 0 18px rgba(255, 226, 122, .55); }
.spark-pop {
  position: fixed; left: 0; top: 0; z-index: 45; /* 戦いの場より上・窓（.modal-back 50）より下 */
  display: grid; justify-items: center; gap: 0; padding: 3px 10px 4px; border-radius: 12px;
  background: #fff6c8; color: #4a3500; font-weight: 700; line-height: 1.2; white-space: nowrap; pointer-events: none;
  box-shadow: 0 2px 0 rgba(0, 0, 0, .35), 0 0 16px rgba(255, 220, 90, .85);
  animation: sparkIn .32s cubic-bezier(.2, 1.6, .5, 1) both, sparkOut .5s ease-in 2.3s forwards;
}
.spark-pop[hidden] { display: none; }
.spark-pop::after { content: ''; position: absolute; left: var(--tail, 22px); top: 100%; margin-left: -6px; border: 6px solid transparent; border-top-color: #fff6c8; }
.spark-pop.below::after { top: auto; bottom: 100%; border-top-color: transparent; border-bottom-color: #fff6c8; }
.spark-pop .sp-bulb { font-style: normal; font-size: 22px; line-height: 1; animation: sparkBulb .9s ease-in-out infinite; }
.spark-pop b { font-size: calc(14px * var(--fs-k)); }
.spark-pop small { font-size: var(--fs-min); color: #7a5a00; }
@keyframes sparkIn { from { opacity: 0; transform: translateY(8px) scale(.6); } to { opacity: 1; transform: none; } }
@keyframes sparkOut { to { opacity: 0; } }
@keyframes sparkBulb { 50% { filter: drop-shadow(0 0 6px rgba(255, 230, 90, 1)); transform: scale(1.12); } }

/* ---- とくぎの一覧：見出し「ひらめき技」 ---- */
.b-sk-head { grid-column: 1 / -1; margin: 6px 2px 0; display: flex; align-items: center; gap: 6px; font-size: var(--fs-min); font-weight: 700; color: #ffe27a; letter-spacing: .04em; }
.b-sk-head::after { content: ''; flex: 1; height: 1px; background: linear-gradient(90deg, rgba(255, 226, 122, .5), rgba(255, 226, 122, 0)); }
.b-opt.b-skill.spark { border-color: rgba(255, 226, 122, .45); }
.b-meta i.spk { color: #4a3500; background: #ffe27a; font-weight: 700; }

/* ---- ステータスの「ひらめき技」 ---- */
.spark-title .st-art { font-size: 18px; }
.skill-list.spark-list li { grid-template-columns: auto minmax(0, 1fr) auto; }
.spark-list li.learned .sl-sp { color: #ffe27a; font-family: inherit; font-weight: 700; white-space: nowrap; min-width: 4.5em; }
.spark-list .sl-body small.sp-desc { color: var(--faint); }
.spark-hint { margin-top: 6px; }

/* ---- 戦いの記録の行 ---- */
.b-ln.k-spark, .q-log .k-spark { color: #ffe9a0; }
.b-ln.k-spark .c, .q-log .k-spark .c { color: #ffe27a; font-weight: 700; }
.b-ln.k-lp .s, .q-log .k-lp .s { color: #ffb3c9; }
.b-ln.k-lp .k, .q-log .k-lp .k { color: #ff6f9c; }

@media (prefers-reduced-motion: reduce) {
  .chip.lp-chip.low, .b-meter .lpn.low, .spark-pop, .spark-pop .sp-bulb { animation: none; }
}
