/* Shared character illustration presentation for the V3 companion pages. */
#codex-full-body-card[hidden] { display: none !important; }
.cov-full-body-stage { display: grid; place-items: center; min-height: 560px; padding: 24px; box-sizing: border-box; background: radial-gradient(ellipse at center, rgba(78,147,186,.13), transparent 65%); }
#codex-full-body-img { display: block; width: 100%; height: 520px; object-fit: contain; object-position: center; filter: drop-shadow(0 0 24px rgba(93,175,216,.2)); }
.hm-character-hero .hm-hero-art { background-image: var(--hm-hero-art); background-size: contain; background-repeat: no-repeat; background-position: center; transform: none; opacity: .9; filter: drop-shadow(0 0 24px color-mix(in srgb, var(--hm-level-color) 25%, transparent)); }
.hm-character-levelup .hm-levelup-content { padding-right: 40%; min-height: 490px; }
.hm-character-levelup .hm-levelup-art { inset: 0 0 0 auto; width: 45%; object-fit: contain; object-position: center; opacity: .95; mask-image: none; filter: drop-shadow(0 0 24px rgba(255,215,124,.2)); }
.pa-favorite-hero { position: relative; z-index: 2; width: 100%; box-sizing: border-box; display: grid; justify-items: center; gap: 6px; align-self: stretch; padding: 12px; }
.pa-favorite-hero a { display: block; width: 100%; height: 230px; }
.pa-favorite-art { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 0 20px rgba(89,195,234,.25)); }
.pa-favorite-hero label { color: #b9dbe8; font-size: .75rem; }
.pa-favorite-hero select { width: 100%; min-height: 36px; color: #edf5fa; background: #091420; border: 1px solid #426079; border-radius: 3px; padding: 6px; }
.pa-favorite-hero select:focus-visible { outline: 2px solid #79def3; outline-offset: 3px; }
@media (max-width: 760px) {
    .hm-character-levelup .hm-levelup-content { padding-right: 24px; padding-top: 230px; }
    .hm-character-levelup .hm-levelup-art { inset: 0 0 auto; width: 100%; height: 220px; }
    .pa-favorite-hero { flex-basis: 100%; width: 100%; box-sizing: border-box; }
    .pa-favorite-hero a { height: 220px; }
    .pa-favorite-hero select { max-width: 260px; }
    .cov-full-body-stage { min-height: 390px; padding: 12px; }
    #codex-full-body-img { height: 370px; }
}
@media (max-width: 800px) {
    .pa-header-aside:has(.pa-favorite-hero) { display: grid; justify-items: center; width: 100%; }
}