#mob-actors { position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.mob-name { position:absolute; left:0; top:0; will-change:transform; min-width:80px; white-space:nowrap; color:white; font:calc(13px + var(--world-name-size))/calc(15px + var(--world-name-size)) Arial,sans-serif; text-align:center; text-shadow:1px 1px #000,-1px -1px #000; transform-origin:center bottom; }
.mob-name.mob-name-centered { transform-origin:center; }
.mob-name.dead { opacity:.55; }
.mob-name-text { display:block; }
.mob-health { display:block; width:42px; height:5px; margin:0 auto; background:#7d7d7d; }
.mob-health i { display:block; height:5px; background:#c81414; }
.mob-hit { position:absolute; left:0; top:0; will-change:transform; transform:translate(-50%,-100%); pointer-events:auto; cursor:crosshair; background:transparent; border:0; padding:0; border-radius:45%; touch-action:none; }
.mob-hit.selected { box-shadow:inset 0 -3px 0 #f5ce55; }
/* mob-ui.js moves the whole layer with the camera; its own layer, so a move never repaints the items. */
.ground-drops { position:absolute; left:0; top:0; width:0; height:0; will-change:transform; }
.ground-drop { position:absolute; left:0; top:0; pointer-events:auto; cursor:pointer; background:transparent; border:0; padding:0; width:36px; height:36px; transform-origin:center bottom; touch-action:none; }
/* No resting drop-shadow: a filter on every icon cost a world boss's few hundred items about half a phone's main thread
   each frame (Layerize over one effect node per icon). The hover glow below filters one icon at a time. */
.ground-drop img { width:36px; height:36px; object-fit:contain; }
.ground-drop span { position:absolute; left:50%; top:33px; transform:translateX(-50%); color:#ffdf72; font:11px/14px Arial,sans-serif; text-shadow:1px 1px #000,-1px -1px #000; white-space:nowrap; }
.ground-drop:hover img,.ground-drop:focus-visible img { filter:drop-shadow(0 0 4px #ffe9a2); }
.combat-damage { position:absolute; left:0; top:0; transform:translate(-50%,-100%); pointer-events:none; color:#fff2ac; font:bold 21px/24px Arial,sans-serif; text-shadow:1px 2px 0 #210f02,-1px -1px 0 #210f02; animation:combat-damage-rise 1.1s linear both; }
/* mob-ui.js places the number with the translate property; it rises 0.055 px/ms and fades out over its last 350 ms. The
   transform repeats ui-scale.css's .combat-damage rule, which this animation overrides while it runs. */
@keyframes combat-damage-rise {
  0% { transform:translate(-50%,-100%) scale(var(--hud-ui-scale,1)); opacity:1; }
  68.1818% { opacity:1; }
  100% { transform:translate(-50%,calc(-100% - 60.5px)) scale(var(--hud-ui-scale,1)); opacity:0; }
}
.combat-damage.received { color:#ff6158; }
.combat-damage.killing { font-size:25px; }

.combat-damage.restored-hp { color:#45ff68; }
.combat-damage.restored-mp { color:#63baff; }