/* Catalogue IDs use dedicated raster atlas cells. Rarity frames supplement
   textual rarity labels, and each sheet handles loading errors independently. */
.hq-art{--hq-art-frame:#778e78;display:inline-block!important;position:relative;flex:none;width:var(--hq-art-size,44px);height:var(--hq-art-size,44px);min-width:var(--hq-art-size,44px);vertical-align:middle;overflow:hidden;border:1px solid var(--hq-art-frame);border-radius:8px;background:#08251f;box-shadow:inset 0 0 0 1px #fff1;isolation:isolate;line-height:0;margin:0!important}
.hq-art .hq-art-face{display:block!important;position:absolute;inset:0;width:100%;height:100%;border:0;padding:0;margin:0!important;border-radius:inherit;pointer-events:none}
.hq-art-atlas{background-repeat:no-repeat;background-size:400% 400%;background-color:#08251f}
.hq-art .hq-art-direct{object-fit:contain;background:#08251f}
.hq-art-fallback{display:none!important;position:absolute;inset:0;place-items:center;color:var(--hq-art-frame);pointer-events:none}
.hq-art-fallback>.icon{width:65%!important;height:65%!important}
.hq-art-rarity-uncommon{--hq-art-frame:#78be95}.hq-art-rarity-rare{--hq-art-frame:#8abcf2}.hq-art-rarity-epic{--hq-art-frame:#b698ee}.hq-art-rarity-legendary{--hq-art-frame:#f1c86d}.hq-art-rarity-ultra{--hq-art-frame:#ed9cd4}.hq-art-rarity-cosmic{--hq-art-frame:#d6c5ff}
.hq-art-tier-white{--hq-art-frame:#e9e7dc}.hq-art-tier-blue{--hq-art-frame:#7eb5f0}.hq-art-tier-gold{--hq-art-frame:#efc663}.hq-art-tier-red{--hq-art-frame:#ee8b85}.hq-art-tier-locked{--hq-art-frame:#6b8178;filter:grayscale(.85);opacity:.6}
.hq-art[data-art-status=missing]>.hq-art-face,.hq-art.hq-art-missing>.hq-art-face{display:none!important}
.hq-art[data-art-status=missing]>.hq-art-fallback,.hq-art.hq-art-missing>.hq-art-fallback{display:grid!important}
.item-emblem:has(>.hq-art),.item-detail-symbol:has(>.hq-art),.market-emblem:has(>.hq-art),.slot-symbol:has(>.hq-art),.honor-emblem:has(>.hq-art),.guild-item-emblem:has(>.hq-art){width:auto;height:auto;padding:0;background:transparent;border:0;overflow:visible}
.item-emblem>.hq-art,.item-detail-symbol>.hq-art,.market-emblem>.hq-art{--hq-art-size:48px}
.slot-symbol>.hq-art,.equip-slot>.hq-art{--hq-art-size:34px}
.honor-emblem>.hq-art{--hq-art-size:56px}
.ui-bag-tile>.hq-art{--hq-art-size:42px;position:relative;inset:auto;margin-bottom:8px!important}.dossier-medal>.hq-art{--hq-art-size:52px;border-radius:50%;position:relative;inset:auto}
.overflow-emblem>.hq-art,.guild-item-emblem>.hq-art{--hq-art-size:34px}
@media(max-width:640px){.slot-symbol>.hq-art,.equip-slot>.hq-art{--hq-art-size:30px}.item-emblem>.hq-art,.market-emblem>.hq-art{--hq-art-size:44px}.honor-emblem>.hq-art{--hq-art-size:48px}.dossier-medal>.hq-art{--hq-art-size:42px}}
.recipe-icon:has(>.hq-art){padding:0!important;border:0;background:transparent}.recipe-icon>.hq-art{--hq-art-size:44px}
.hq-encounter-loot-icon:has(>.hq-art){border:0;background:transparent}.hq-encounter-loot-icon>.hq-art{--hq-art-size:34px}
.set-pieces .hq-art,.build-pieces .hq-art,.trade-pick .hq-art,.offer-item .hq-art{--hq-art-size:30px}
.dossier-item-icon>.hq-art{--hq-art-size:36px}.dossier-item-inspect>.hq-art{--hq-art-size:72px}
/* The legacy milestone check mark uses a direct-span selector; the picture
   needs its full square instead of that small counter's 19px height. */
.dossier-medal>.hq-art{width:var(--hq-art-size);height:var(--hq-art-size)}