/* Keep progress away from the exercise so the player can watch the animation. */
.training-progress{top:98px;left:50%;transform:translateX(-50%);width:280px;max-width:calc(100vw - 24px);padding:12px 16px;pointer-events:none;font-size:13px}
.training-progress .bar{margin:8px 0 6px}
.training-progress small{display:block;font-size:11px;color:#afbaa1}
@media(max-width:760px){.training-progress{top:66px;bottom:auto;width:264px;padding:8px 12px;font-size:12px}.training-progress small{font-size:10px}}
@media(max-height:620px) and (max-width:760px){
  .training-progress{padding:6px 10px}.training-progress small{display:none}
  #game-shell:has(#world:is([data-scene="headquarters"],[data-scene="training-yard"])) .player-card{width:184px;padding:8px}
  #game-shell:has(#world:is([data-scene="headquarters"],[data-scene="training-yard"])) .player-card :is(.portrait,.status-label,.player-heading small,.signal,.xp-label,.bar.xp){display:none}
  #game-shell:has(#world:is([data-scene="headquarters"],[data-scene="training-yard"])) .player-heading h2{margin:0;font-size:14px}
  #game-shell:has(#world:is([data-scene="headquarters"],[data-scene="training-yard"])) .hp-label{margin:4px 0;line-height:1.3}
  #game-shell:has(#world:is([data-scene="headquarters"],[data-scene="training-yard"])) .vitals{margin-top:6px;padding-top:4px}
  #game-shell:has(#world:is([data-scene="headquarters"],[data-scene="training-yard"])) .vitals label{font-size:10px;line-height:1.3}
  #game-shell:has(#world:is([data-scene="headquarters"],[data-scene="training-yard"])) .vitals strong{font-size:12px;margin-top:2px}
  #game-shell:has(#world:is([data-scene="headquarters"],[data-scene="training-yard"])) .buff-list:not(:empty){margin-top:5px;padding-top:4px;max-height:60px;overflow:auto}
  #game-shell:has(#world:is([data-scene="headquarters"],[data-scene="training-yard"])) .buff-chip{padding:4px;font-size:11px}
  #game-shell:has(#world:is([data-scene="headquarters"],[data-scene="training-yard"])) .buff-chip>span{display:none}
  #game-shell:has(#world:is([data-scene="headquarters"],[data-scene="training-yard"])) .buff-chip>div{display:flex;align-items:center;justify-content:space-between;gap:4px;width:100%}
  #game-shell:has(#world:is([data-scene="headquarters"],[data-scene="training-yard"])) .buff-chip b{font-size:10px;line-height:1.3}
  #game-shell:has(#world:is([data-scene="headquarters"],[data-scene="training-yard"])) .buff-chip small{font-size:0;line-height:1;margin:0}
}
