/* ═══════════ v2 角色 tab：肌肉火仔（character-stats.js） ═══════════ */
body.v2[data-v2] .char-sheet-wrap { padding: 0; margin: 0; background: none; border: 0; box-shadow: none; }
.v2-char { display: flex; flex-direction: column; gap: 14px; color: #16131d; font-family: "Noto Sans HK", system-ui, sans-serif; padding-bottom: 12px; }
.v2-char__head { display: flex; align-items: center; justify-content: space-between; margin: 0 4px; }
.v2-char__title { margin: 0; font-size: 34px; font-weight: 900; line-height: 1.1; }
.v2-char__hl { background: #ffd23f; padding: 0 6px; }
.v2-char__lv { padding: 5px 12px; font-size: 14px; font-weight: 700; background: #fffdf7; border: 2.5px solid #16131d; border-radius: 999px; box-shadow: 3px 3px 0 #16131d; }

.v2-char__stage {
  position: relative; height: 372px; overflow: hidden; background: #ffd23f;
  border: 2.5px solid #16131d; border-radius: 12px; box-shadow: 5px 5px 0 #16131d;
}
.v2-char__viewlbl { position: absolute; left: 12px; top: 12px; font-weight: 700; z-index: 2; }
.v2-char__seg {
  position: absolute; right: 10px; top: 8px; z-index: 3; display: flex; overflow: hidden;
  background: #fffdf7; border: 2.5px solid #16131d; border-radius: 999px; box-shadow: 3px 3px 0 #16131d;
}
.v2-char__seg button { height: 34px; padding: 0 13px; font: 900 13px/1 "Noto Sans HK", sans-serif; color: #16131d; background: #fffdf7; border: 0; cursor: pointer; }
.v2-char__seg button + button { border-left: 2.5px solid #16131d; }
.v2-char__seg button[aria-pressed="true"] { background: #16131d; color: #fffdf7; }
.v2-char__shadow {
  position: absolute; left: 50%; bottom: 58px; width: 150px; height: 18px; margin-left: -110px; border-radius: 50%; opacity: .35;
  background-image: repeating-conic-gradient(#16131d 0 25%, transparent 0 50%); background-size: 4px 4px;
}
.v2-char__me {
  position: absolute; left: 50%; top: 36px; width: 230px; height: 336px; margin-left: -150px;
  padding: 0; border: 0; background: none; cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.v2-char__bob { position: absolute; inset: 0; display: block; animation: v2bob 1.6s steps(4) infinite; }
.v2-char__turn { position: absolute; inset: 0; display: block; }
.v2-turnA { animation: v2turnA .4s steps(6); }
.v2-turnB { animation: v2turnB .4s steps(6); }
@keyframes v2turnA { 0% { transform: scaleX(1); } 50% { transform: scaleX(0); } 100% { transform: scaleX(1); } }
@keyframes v2turnB { 0% { transform: scaleX(1); } 50% { transform: scaleX(0); } 100% { transform: scaleX(1); } }

.v2-char__mini {
  position: absolute; right: 10px; bottom: 10px; z-index: 2; width: 78px; height: 122px; padding: 2px 0 0; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; color: #16131d;
  background: #fffdf7; border: 2.5px solid #16131d; border-radius: 10px; box-shadow: 3px 3px 0 #16131d;
}
.v2-char__minibox { position: relative; display: block; width: 70px; height: 102px; }
.v2-char__mini .v2-mono { font-size: 10px; font-weight: 700; }

.v2-char__stamp {
  position: absolute; left: 14px; bottom: 16px; z-index: 3; padding: 6px 12px; font-size: 18px; font-weight: 900;
  color: #e0341a; border: 3px solid #e0341a; border-radius: 8px; background: rgba(255, 253, 247, .85);
  animation: fcStamp .5s cubic-bezier(.2, 1.2, .4, 1) .45s both;
}

/* 火仔分層 sprite（畫框 450×657，2 格 boil） */
.v2-bl { position: absolute; inset: 0; display: block; background-repeat: no-repeat; image-rendering: pixelated; background-position-x: 0; animation: v2bx .5s steps(2) infinite; }
@keyframes v2bx { to { background-position-x: 200%; } }
.v2-bl--front { background-image: url(./images/v2/char-body-front.png); background-size: 200% 1600%; }
.v2-bl--back { background-image: url(./images/v2/char-body-back.png); background-size: 200% 1600%; }
.v2-bl--arms { background-image: url(./images/v2/char-arms.png); background-size: 200% 400%; }
.v2-bl--legs { background-image: url(./images/v2/char-legs.png); background-size: 200% 400%; }
.v2-bl--lats { background-image: url(./images/v2/char-lats.png); background-size: 200% 400%; }
.v2-bl--tip { background-image: url(./images/v2/char-tip.png); background-size: 400% 400%; animation: v2b4 .6s steps(4) infinite; }
.v2-bl--sleep { background-image: url(./images/v2/char-sleep.png); background-size: 200% 100%; }
@keyframes v2b4 { to { background-position-x: 133.333%; } }
.v2-bl--grow { transform-origin: 50% 70%; animation: v2bx .5s steps(2) infinite, v2grow .6s cubic-bezier(.3, 1.5, .5, 1) .5s; }
@keyframes v2grow { 0% { transform: scale(1); } 30% { transform: scale(1.14, .9); } 55% { transform: scale(.94, 1.08); } 100% { transform: scale(1); } }

/* 六部位 */
.v2-char__stats { display: flex; flex-direction: column; gap: 10px; }
.v2-char__row {
  display: flex; align-items: center; gap: 10px; width: 100%; padding: 2px 0; text-align: left; color: #16131d;
  background: none; border: 0; cursor: pointer; font-family: inherit; animation: fcUp .45s cubic-bezier(.2, 1.3, .4, 1) both;
}
.v2-char__rowlbl { width: 50px; display: flex; flex-direction: column; flex-shrink: 0; }
.v2-char__rowlbl b { font-size: 17px; font-weight: 900; }
.v2-char__rowlbl span { font-size: 12px; font-weight: 700; }
.v2-char__rowbar { flex: 1; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.v2-char__bar { display: block; height: 22px; overflow: hidden; background: #fffdf7; border: 2.5px solid #16131d; border-radius: 7px; box-shadow: 3px 3px 0 #16131d; }
.v2-char__fill { display: block; height: 100%; border-right: 2.5px solid #16131d; transition: width .5s cubic-bezier(.3, 1.4, .5, 1); }
.v2-char__hint { display: flex; justify-content: space-between; gap: 8px; font-size: 10px; }
.v2-char__hint span { color: #5e5566; }
.v2-char__note { margin: 4px 4px 0; font-size: 11px; line-height: 1.6; color: #5e5566; }

.v2-char--quiet .v2-char__row, .v2-char--quiet .fc-kw > span { animation: none; }
.v2-char--quiet .v2-bl--grow { animation: v2bx .5s steps(2) infinite; }

@media (prefers-reduced-motion: reduce) {
  .v2-char *, .v2-char__bob { animation: none !important; transition: none !important; }
}
body.v2[data-v2] .panel--character { background: none; min-height: 0; }
body.v2[data-v2] #panelCharacter { color: #16131d; }