/* Show the new compositions intact; only compact face views use landmark crops. */
.hero-panel:before{content:'';position:absolute;inset:-30px;background:var(--hero-backdrop) center/cover;filter:blur(28px);opacity:.28}
.hero-panel>.hero-art{object-fit:contain;object-position:center center}
.hero-vignette{background:linear-gradient(0deg,#0a1417f5 0%,#0b151770 25%,transparent 57%),linear-gradient(90deg,#0b141633,transparent 45%)}
.portrait-card>.art{object-fit:contain;object-position:center center}
.detail-art>.art{object-fit:contain;object-position:center top}
.commander-panel>.art{object-fit:contain;object-position:center top}
.battle-slot>.art,.hand-card>.art{object-position:var(--face-x,50%) var(--face-y,20%)}
.avatar{position:relative}
.avatar>.art,.deck-slot>.art,.squad-mini>.art{position:absolute;left:50%;top:50%;width:calc(100% * var(--face-zoom,2.5));height:auto;max-width:none;object-fit:initial;transform:translate(calc(-1 * var(--face-x,50%)),calc(-1 * var(--face-y,20%)));border-radius:0}
.deck-slot>.art{width:calc(100% * var(--face-zoom,2.5) * .8);transform:translate(calc(-1 * var(--face-x,50%)),min(calc(-1 * var(--face-y,20%)),-42px))}
.squad-mini>.art{width:calc(100% * var(--face-zoom,2.5) * .6)}
.encounter-cover>.art{position:absolute;width:200%;height:auto;max-width:none;left:50%;top:50%;transform:translate(calc(-1 * var(--face-x,50%)),calc(-1 * var(--face-y,20%)))}
@media(max-width:780px){.commander-panel>.art{width:90px;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,20%)}.hero-panel{min-height:590px}.portrait-card>.art{object-fit:contain}}
@media(max-width:390px){.hero-panel{min-height:535px}}