/* ── screens.css ── สไตล์เฉพาะแต่ละหน้าจอ (battle / team / heal) ─────── */
#battle{background:#080b11f2;flex-direction:column}
#battle .wrap{width:100%;max-width:720px;display:flex;flex-direction:column;gap:6px}
.bfield{position:relative;height:212px;border-radius:8px;overflow:hidden;border:4px solid #6b5636;
 background:linear-gradient(#7ec0e8 0 50%,#8fce6a 50% 100%)}
.bfield.boss{background:linear-gradient(#2a2340 0 50%,#6a6a80 50% 100%);border-color:#a88fd0}
.bslot{position:absolute;width:116px;height:116px;image-rendering:pixelated;transition:transform .12s}
#eSprite{right:30px;top:12px}#pSprite{left:30px;bottom:8px}
.binfo{position:absolute;background:#f3ead6;color:#22262f;border:3px solid #4a3a22;border-radius:6px;
 padding:4px 7px;width:198px;font-size:10px;box-shadow:0 3px 0 #0004}
#eInfo{left:8px;top:8px}#pInfo{right:8px;bottom:8px}
.binfo .r1{display:flex;justify-content:space-between;font-weight:bold;font-size:12px}
.hpwrap{height:8px;background:#3a3a3a;border:2px solid #4a3a22;border-radius:4px;margin:3px 0;overflow:hidden}
.hpwrap i{display:block;height:100%;transition:width .35s}
#foeBalls{position:absolute;left:8px;top:52px;display:flex;gap:3px}
#foeBalls i{width:9px;height:9px;border-radius:50%;border:2px solid #241a10;background:#e04a4a;display:block}
#foeBalls i.ko{background:#4a5060}

#blog{height:64px;overflow:hidden;padding:6px 11px;font-size:12px;line-height:1.4}
#blog div{opacity:.5}#blog div:last-child{opacity:1;color:#ffe8b0}
.bmenu{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.bmenu button{padding:8px 3px;font-size:13px;line-height:1.25}
.bmenu button small{font-weight:normal;font-size:9px;opacity:.85}

/* ── แอนิเมชันการต่อสู้ ── */
.hit{animation:hit .34s}@keyframes hit{0%,100%{transform:translate(0)}25%{transform:translate(-9px,3px)}
 50%{transform:translate(7px,-3px);filter:brightness(2.5)}75%{transform:translate(-4px,0)}}
.lungeR{transform:translateX(32px) scale(1.06)}.lungeL{transform:translateX(-32px) scale(1.06)}
.glow{animation:gw .6s}@keyframes gw{0%,100%{filter:none}50%{filter:brightness(1.9) saturate(2)}}
.dmg{position:absolute;font-size:23px;font-weight:bold;-webkit-text-stroke:2px #2a0a06;
 animation:fly .95s forwards;pointer-events:none;z-index:5}
@keyframes fly{0%{opacity:0;transform:translateY(10px)}18%{opacity:1}100%{opacity:0;transform:translateY(-46px)}}
.shake{animation:shk .4s}@keyframes shk{0%,100%{transform:rotate(0)}30%{transform:rotate(-17deg)}70%{transform:rotate(17deg)}}

/* ── หน้าจอทีม ── */
#teamList{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:9px}

/* ── หน้าจอฟื้นพลัง (flash effect) ── */
.flash{animation:fl .7s}@keyframes fl{0%,100%{background:transparent}50%{background:#2f6a3a}}