html,body{touch-action:pan-x pan-y;overscroll-behavior:none;-webkit-text-size-adjust:100%;text-size-adjust:100%}
button,a,label{touch-action:manipulation}
#battle,#arena,#battle .skill,#battle #joystick,.control-node{touch-action:none}
.battle-types{display:inline-flex;gap:3px;align-items:center;flex-shrink:0}
.battle-types .type-icon{width:18px;height:18px;margin:0;padding:0}
.battle-types .type-icon img{width:100%;height:100%}
.skill-matchup{position:absolute;top:0;bottom:auto;left:50%;transform:translate(-50%,-20%);z-index:6;padding:3px 6px;border-radius:5px;background:#18222feb;border:1px solid #8193a533;color:#ccd5df;white-space:nowrap;font-size:10px;line-height:1.2;font-weight:650;pointer-events:none;box-shadow:0 2px 5px #0005}
.skill-matchup[hidden]{display:none}
.skill-matchup[data-tier=super]{color:#ffa88a;border-color:#bd72574d}
.skill-matchup[data-tier=good]{color:#efce85;border-color:#ab91464d}
.skill-matchup[data-tier=resist]{color:#9fbbe0}
.skill-matchup[data-tier=weak]{color:#b5a0cf}
.skill-matchup[data-tier=immune]{color:#a0a9b5}
@media(pointer:coarse){
 input,select,textarea{font-size:16px!important}
 #battle .battleTop>.health-card{transform:scale(.75);width:100%!important;margin-bottom:-12px}
 #battle .battleTop>#pHealth{transform-origin:top right;justify-self:end}
 #battle .battleTop>#eHealth{transform-origin:top left;justify-self:start}
 .skill-matchup{font-size:9px;padding:2px 5px}
}

.brand .brand-icon{width:32px;height:32px;object-fit:contain;flex:none;filter:drop-shadow(0 2px 3px #0005)}
.brand{letter-spacing:.4px}
.rank-chip small{font-size:.85em;opacity:.8;margin-left:3px}

.health-card .hp{position:relative}
.health-card .hp i.shield-bar{position:absolute;top:0;height:100%;background:#f5f7ff!important;border-left:1px solid #566278;border-radius:0;box-shadow:inset 0 1px #fff;transition:width .1s linear,left .1s linear}
.health-card .hp i.shield-bar[hidden]{display:none}
#battle .skill.cast-locked{filter:saturate(.25);background-color:#171b24!important}
#battle .skill.cast-locked .skill-face::after{content:'시전 중';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#080c14b8;color:#c4cad5;font-size:11px;z-index:5;border-radius:50%;pointer-events:none}

.skill-face{position:relative;isolation:isolate}.skill kbd,.move-card-top kbd{white-space:nowrap;word-break:keep-all;flex-shrink:0;font-size:9px;letter-spacing:0}.skill-face kbd{max-width:100%;padding-inline:3px}