/* Full transparent pennants: contain artwork, never crop character breakout. */
#pennantCollection{margin:28px 0 16px;padding:20px 8px;background:linear-gradient(145deg,#102e4a,#081423);border:1px solid #447297;border-radius:16px}
#pennantGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 8px}
.pennantTile{min-width:0;text-align:center}
.pennantTile>img{width:100%;height:auto;aspect-ratio:1/3;object-fit:contain;display:block}
.pennantTile>b{display:block;color:#d5eaff;font:11px 'Russo One',sans-serif;margin:8px 0;letter-spacing:.5px}
.pennantTile>button{width:100%;min-height:40px;border:1px solid #e8c25d;border-radius:24px;background:#07162d;color:#ffe9b0;font:11px 'Russo One',sans-serif;cursor:pointer}
.pennantTile.equipped>button{background:linear-gradient(#207ed0,#113b8a);border-color:#8adcff;color:white}
.pennantTile>button:disabled{color:#a0b3c4;border-color:#536475;cursor:default}
.pennantOdds{font-size:11px;color:#abc4db;margin:20px 5px 0;line-height:1.6}
#socSearch.pennantMatch{display:block;background-size:cover;background-position:center;overflow:hidden}
#socSearch.pennantMatch>.ring{display:none}
#socSearch.pennantMatch>h2{position:absolute;top:calc(env(safe-area-inset-top) + 24px);left:4%;right:4%;margin:0;text-align:center;font-size:clamp(19px,5.8vw,30px);text-shadow:0 2px 3px #082540,0 0 12px #1278be}
#socSearch.pennantMatch>.sub{position:absolute;top:calc(env(safe-area-inset-top) + 69px);left:0;right:0;text-align:center;color:#fff;text-shadow:0 1px 4px #000}
#socSearch.pennantMatch .plates,#mm.pennantMatch #mmVs{position:absolute;top:calc(env(safe-area-inset-top) + 108px);bottom:calc(env(safe-area-inset-bottom) + 62px);left:3%;right:3%;width:auto;height:auto;margin:0;display:flex;justify-content:space-between;align-items:center}
#socSearch.pennantMatch .mp,#mm.pennantMatch .mplate{position:relative;top:auto;bottom:auto;left:auto;right:auto;width:44%;height:min(100%,126vw);max-height:650px;border:0;border-radius:0;box-shadow:none;background:transparent;overflow:visible;transform:none;opacity:1}
#socSearch.pennantMatch .mp.foe{opacity:0;transition:opacity .35s}
#socSearch.pennantMatch.found .mp.foe{opacity:1;transform:none}
#mm.pennantMatch .mplate.you{order:0}#mm.pennantMatch .mplate.foe{order:2}
#mm.pennantMatch .mplate{opacity:0}#mm.pennantMatch.vs .mplate{opacity:1;transform:none}
#socSearch.pennantMatch .mp .pb,#mm.pennantMatch .mplate .pb{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
#socSearch.pennantMatch .mp .pshade,#mm.pennantMatch .mplate .pshade{display:none}
#socSearch.pennantMatch .mp .prow,#mm.pennantMatch .mplate .prow{position:absolute;top:9%;left:12%;right:12%;padding:4px 0 9px;display:flex;flex-direction:column;gap:6px;text-align:center;background:linear-gradient(transparent,#071b39d9 70%,transparent);border-radius:20px}
#socSearch.pennantMatch .mp .pportrait,#mm.pennantMatch .pportrait{width:clamp(38px,12vw,66px);height:clamp(38px,12vw,66px);border:2px solid #f2d174}
#socSearch.pennantMatch .mp .pname,#mm.pennantMatch .pname{font-size:clamp(14px,4.3vw,22px);line-height:1.15;overflow-wrap:anywhere;letter-spacing:0}
#socSearch.pennantMatch .mp .pbadges,#mm.pennantMatch .pbadges{display:flex;flex-direction:column;justify-content:center;gap:3px;margin-top:4px}
#socSearch.pennantMatch .mp .pbadges span,#mm.pennantMatch .pbadges span{font-size:10px;padding:3px 7px;white-space:nowrap}
#socSearch.pennantMatch .vs{width:22%;left:50%;top:48%;transform:translate(-50%,-50%);animation:none;z-index:2}
#socSearch.pennantMatch.found .vs{opacity:1;animation:none}
#mm.pennantMatch #mmVsMid{width:22%;top:48%;z-index:2}#mm.pennantMatch #mmVsImg{width:100%;animation:none;transform:none}#mm.pennantMatch.vs #mmVsImg{opacity:1}
#mm.pennantMatch #mmVsRing,#mm.pennantMatch #mmFound,#mm.pennantMatch #mmRing{display:none}
#mm.pennantMatch #mmTop{top:calc(env(safe-area-inset-top) + 24px);opacity:1}
#mm.pennantMatch #mmTitle{font-size:clamp(19px,5.8vw,30px);text-align:center}
#mm.pennantMatch #mmPoster{filter:none;animation:none;transform:none}
#mm.pennantMatch #mmShade{background:linear-gradient(#08182980,transparent 40%,#08182990)}
#mm.pennantMatch #mmBot{opacity:1;bottom:calc(env(safe-area-inset-bottom) + 33px);gap:4px}
#mm.pennantMatch #mmTip{display:none}
#socSearch.pennantMatch .cancel{left:50%;transform:translateX(-50%)}
@media(max-height:580px){#socSearch.pennantMatch .plates,#mm.pennantMatch #mmVs{top:80px;bottom:38px}.pennantMatch .pportrait{display:none!important}.pennantMatch .prow{top:12%!important}.pennantMatch .pbadges{flex-direction:row!important}.pennantMatch .mp,.pennantMatch .mplate{max-width:145px}#socSearch.pennantMatch .plates,#mm.pennantMatch #mmVs{justify-content:space-evenly}}
@media(prefers-reduced-motion:reduce){.pennantMatch *{animation:none!important;transition:none!important}}
#socSearch.pennantMatch .plates,#mm.pennantMatch #mmVs{align-items:flex-start}
#mm.pennantMatch #mmPosterName{color:white;font-size:11px;letter-spacing:3px;text-shadow:0 1px 4px #10253b}
#mm.pennantMatch #mmBot::before{content:'PREPARING ARENA';font:11px 'Russo One',sans-serif;color:white;letter-spacing:2px}
/* Win against legacy foe/you rules even when social.css loads after this sheet. */
#socSearch.pennantMatch .mp.you,#socSearch.pennantMatch .mp.foe{transform:none}
#socSearch.pennantMatch .mp.foe .prow{flex-direction:column;text-align:center}
#socSearch.pennantMatch .mp.foe .pbadges{justify-content:center}
#socSearch.pennantMatch .mp.foe .pportrait,#socSearch.pennantMatch .mp.you .pportrait{border-color:#f2d174}
#socSearch.pennantMatch.found::after{content:'PREPARING ARENA';position:absolute;bottom:calc(env(safe-area-inset-bottom) + 30px);left:0;right:0;text-align:center;color:white;font:12px 'Russo One',sans-serif;letter-spacing:2px;text-shadow:0 2px 4px #081829}