/* XP & Level Calculator */
.xp-row { grid-template-columns: minmax(130px, 1fr) 130px 110px minmax(120px, 1.2fr) auto; align-items: center; }
.xp-row .xp-lvl { font: 700 1.05rem var(--font-serif); text-align: center; }
.xp-row .xp-lvl small { display: block; font: 600 .7rem var(--font-body); color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }
.xp-row .xp-prog { font-size: .8rem; color: var(--muted); }
.xp-row .xp-prog .progress { display: block; margin-bottom: .3rem; }
.xp-row .xp-prog { display: block; align-self: center; }
.xp-award { display: flex; gap: .6rem; align-items: flex-end; flex-wrap: wrap; margin-top: 1rem; padding-top: 1rem; border-top: 1px dashed var(--line); }
.xp-award .field { width: 160px; }
@media (max-width: 640px) {
  .xp-row { grid-template-columns: 1fr 1fr auto; }
  .xp-row .xp-name { grid-column: 1 / -1; }
  .xp-row .xp-prog { grid-column: 1 / -1; }
}