/* This game's own heroes (Axe, Pudge, Io: heroes.js, cmd/rogalicexport
   heroes.go) on the popup's screens. Hand-written: ui/ is the exporter's.
   Six hero cards instead of the minigame's three: narrower, so they fit
   the 1920-wide layout in one row. */
.HeroSelectScreen #HeroSelect .ChooseHeroButton { width: 236px !important; height: 540px !important; margin: 12px 8px !important; }

/* Their cards' backgrounds, as the others' (SurvivorsHero_<m_unHeroID>). */
.HeroSelectScreen #HeroSelect .ChooseHeroButton.SurvivorsHero_4 .ChooseHeroCustomBackground,
.HeroSelectScreen #HeroSelect .ChooseHeroButton.SurvivorsHero_5 .ChooseHeroCustomBackground,
.HeroSelectScreen #HeroSelect .ChooseHeroButton.SurvivorsHero_6 .ChooseHeroCustomBackground {
	background-image: var(--p-bgi, none), var(--p-bgg, none);
	background-size: var(--p-bgs, auto), 100% 100%, 100% 100%, 100% 100%;
	background-position: var(--p-bgp, 0% 0%), 0% 0%, 0% 0%, 0% 0%;
	background-repeat: var(--p-bgr, repeat), no-repeat, no-repeat, no-repeat;
}
.HeroSelectScreen #HeroSelect .ChooseHeroButton.SurvivorsHero_4 .ChooseHeroCustomBackground { --p-bgi: url("ui/img/materials/portraits_card/portrait_backgrounds/axe_psd.png"); }
.HeroSelectScreen #HeroSelect .ChooseHeroButton.SurvivorsHero_5 .ChooseHeroCustomBackground { --p-bgi: url("ui/img/materials/portraits_card/portrait_backgrounds/venomancer_psd.png"); }
.HeroSelectScreen #HeroSelect .ChooseHeroButton.SurvivorsHero_6 .ChooseHeroCustomBackground { --p-bgi: url("ui/img/materials/portraits_card/portrait_backgrounds/ancient_apparition_psd.png"); }
.HeroSelectScreen #HeroSelect .ChooseHeroButton.SurvivorsHero_4 #HeroModel,
.HeroSelectScreen #HeroSelect .ChooseHeroButton.SurvivorsHero_5 #HeroModel,
.HeroSelectScreen #HeroSelect .ChooseHeroButton.SurvivorsHero_6 #HeroModel { transform: translateX( 0px ) translateY( 0px ); }

/* The post-game hero, faded out below like the others'. */
.FinishedScreen.SurvivorsHeroID_4 #PostGameHeroModel,
.FinishedScreen.SurvivorsHeroID_5 #PostGameHeroModel,
.FinishedScreen.SurvivorsHeroID_6 #PostGameHeroModel {
	--p-ob: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, white 25%, white 55%, rgba(255, 255, 255, 0) 65%, rgba(255, 255, 255, 0) 100%);
	mask-image: var(--p-om, linear-gradient(#fff, #fff)), var(--p-ob, linear-gradient(#fff, #fff)), var(--p-clip, linear-gradient(#fff, #fff));
	mask-mode: alpha, luminance, alpha;
	mask-size: 100% 100%;
	mask-repeat: no-repeat;
	mask-composite: intersect;
}