/* Floating permanent skill XP, separate from temporary run-level experience. */
.xp-drops {
  position: absolute;
  top: 12px;
  right: 260px;
  width: 222px;
  height: min(210px, calc(100dvh - 240px));
  min-height: 100px;
  overflow: hidden;
  pointer-events: none;
  contain: layout paint style;
  font: 18px/1 'OSRS Plain', monospace;
  color: #fff;
  text-shadow: 1px 1px #000, -1px 0 #000, 0 -1px #000;
  -webkit-font-smoothing: none;
}
body:has(#boss-hud:not([hidden])) .xp-drops { top: 90px; }
.xp-drop {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  display: grid;
  grid-template-columns: repeat(2, max-content);
  justify-content: end;
  align-items: center;
  gap: 3px 13px;
  padding: 0;
  margin: 0;
  will-change: transform, opacity;
}
.xp-drop-skill {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
  height: 25px;
  white-space: nowrap;
}
.xp-drop-skill img { display: block; width: 25px; height: 25px; object-fit: contain; image-rendering: pixelated; }
.xp-drop-value { font: 18px/1 'OSRS Plain', monospace; color: #fff; font-variant-numeric: tabular-nums; }
.xp-drops .xp-drop-summary {
  grid-column: 1 / -1;
  justify-self: end;
  color: #ffff00;
  font: 12px/1 'OSRS Small', monospace;
  height: 11px;
}
@media (max-width: 900px) {
  .xp-drops { top: 185px; right: 260px; height: min(160px, calc(100dvh - 370px)); }
  body:has(#boss-hud:not([hidden])) .xp-drops { top: 218px; }
}
@media (max-width: 600px) {
  .xp-drops { top: 160px; right: 9px; width: 212px; height: min(150px, calc(100dvh - 350px)); }
  body:has(#boss-hud:not([hidden])) .xp-drops { top: 225px; height: min(150px, calc(100dvh - 400px)); }
  body:has(#boss-hud.has-olm:not([hidden])) .xp-drops {
    top: 350px;
    height: clamp(40px, calc(100dvh - 490px), 150px);
    min-height: 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .xp-drop { will-change: opacity; }
}