/* Components of this guide. Colours, surfaces and radii come from the Content UI Kit tokens (--mcui-*, content-ui-kit/README.md);
   each fallback after the comma keeps the look on pages without the kit tokens. Game colours are named --wow-*. */
.blog-wrapper { --wow-epic: oklch(0.62 0.2 305); --wow-heroic: oklch(0.7 0.13 245); --wow-mythic: oklch(0.66 0.2 305); --wow-normal: oklch(0.74 0.17 145); }
.blog-wrapper :is(h2, h3)[id] { scroll-margin-block-start: 7rem; }
.kx-answer { margin-block: 1.5rem; padding: 1rem 1.25rem; border: 1px solid var(--mcui-line, rgb(175 181 207 / .12)); border-radius: var(--mcui-radius, 8px); background: var(--mcui-reference, #202436); }
.kx-answer > p:first-child { margin: 0 0 0.5rem; font-weight: 700; color: var(--mcui-ink, #eff0f5); }
.blog-wrapper .kx-answer ul { margin: 0; }
.kx-table { overflow-x: auto; }
.kx-table td { font-variant-numeric: tabular-nums; }
.kx-item { display: flex; align-items: center; gap: 0.6rem; }
.blog-wrapper img.kx-icon { flex: none; inline-size: 2rem; block-size: 2rem; border: 1px solid var(--mcui-line-strong, rgb(175 181 207 / .24)); border-radius: var(--mcui-radius-sm, 4px); }
.kx-epic { font-weight: 700; color: var(--wow-epic); }
.kx-sub { display: block; font-size: 0.8125rem; line-height: 1.4; color: var(--mcui-muted, #afb5cf); }
.kx-normal { color: var(--wow-normal); font-weight: 700; }
.kx-heroic { color: var(--wow-heroic); font-weight: 700; }
.kx-mythic { color: var(--wow-mythic); font-weight: 700; }
.kx-note { color: var(--mcui-muted, #afb5cf); font-size: 0.875rem; }
@media (max-width: 639.98px) {
  .blog-wrapper .kx-loot thead { display: none; }
  .blog-wrapper .kx-loot tr { display: block; padding-block: 0.75rem; border-block-end: 1px solid var(--mcui-row-line, rgb(175 181 207 / .07)); }
  .blog-wrapper .kx-loot td { display: block; padding: 0.15rem 0; border: 0; }
  .blog-wrapper .kx-loot td[data-label]::before { content: attr(data-label) ": "; font-weight: 700; color: var(--mcui-muted, #afb5cf); }
}