/* The header never derives a color or title from an unopened reward. */
#game #rewardOverlay .summonRevealScene{--glow:#e4d8b7;background:radial-gradient(ellipse at 50% 0,#365049,#10221f 65%);display:flex;flex-direction:column;overflow:hidden;max-height:100%;padding:16px;isolation:isolate}
#rewardOverlay .summonRevealScene h2{color:#e4d8b7;font-size:25px;text-shadow:none}
#rewardOverlay .summonRevealScene header{flex:none;padding:4px 10px 8px}
.summonRevealCards{min-height:0;overflow:auto;overscroll-behavior:contain;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;padding:4px;scrollbar-width:thin;align-content:start}
.summonRevealCards.single{grid-template-columns:180px;justify-content:center}.summonResultCard{min-width:0;min-height:148px;border:1px solid #718272;border-radius:7px;overflow:hidden;background:#182f28}
.summonFace{--reveal-color:#c4d2c6;display:flex;align-items:center;justify-content:center;flex-direction:column;height:100%;gap:4px;padding:7px 4px;box-sizing:border-box;border:1px solid var(--reveal-color);border-radius:6px;background:radial-gradient(ellipse at 50% 40%,#41504466,#13251f);color:var(--reveal-color)}
.summonFace .transformPortrait,.summonFace .artIcon{display:block;flex:none;width:65px;height:65px;margin:2px auto;border:0}.summonFace b{font-size:12px;line-height:1.35;overflow-wrap:anywhere;max-width:100%}.summonFace small{font-size:11px}.summonFace>span:not(.transformPortrait){font-size:10px;color:#d0d7c6}
#rewardOverlay .sealed{border-color:#caba87;background:#142a24;box-shadow:inset 0 0 12px #ebdba633}#rewardOverlay .sealed>button{position:relative;width:100%;height:100%;min-height:148px;display:block;border:0;padding:0;background:#142a24;color:#e4d8b7;cursor:pointer}
#rewardOverlay .summonRevealScene .sealed>button:disabled{opacity:1;cursor:wait}#rewardOverlay .sealed>button:not(:disabled):hover,#rewardOverlay .sealed>button:focus-visible{outline:2px solid #f3dea0;outline-offset:-3px;filter:brightness(1.12)}
.summonBackArt{position:absolute;inset:0;display:block;overflow:hidden;background:radial-gradient(ellipse,#75623b55,#10271e 75%);pointer-events:none}.summonBackArt.document{--back-image:url('./assets/summon-back-ordinary-vnext.webp')}.summonBackArt.mystic{--back-image:url('./assets/summon-back-sealed-vnext.webp');background:radial-gradient(ellipse,#d1bc7244,#112720 78%)}.summonBackArt::before{content:"";position:absolute;inset:0;background:var(--back-image) center/cover no-repeat;opacity:.25}.summonBackArt img{position:relative;display:block;width:100%;height:100%;object-fit:contain;user-select:none}
#rewardOverlay .summonRevealScene footer{flex:none;flex-wrap:wrap;margin-top:8px;gap:6px}#rewardOverlay .summonRevealScene footer button{min-height:38px;min-width:0;flex:1;padding:7px;font-size:12px}#rewardOverlay .summonRevealScene button:disabled{opacity:.4;cursor:default}
#rewardOverlay .summonRevealStatus{flex:none;font-size:12px;color:#ecdfb6;min-height:18px}#rewardOverlay .summonRevealHint{flex:none;font-size:11px;color:#d5d1bd;margin-top:7px}#rewardOverlay .summonReceiptNote{flex:none;font-size:10px;color:#acb8a9}
.summonMysteryStage{position:absolute;inset:42px 8px 8px;z-index:4;background:radial-gradient(ellipse at 50% 42%,#354941,#081c18 70%);border:1px solid #938970;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:16px;overflow:auto;box-sizing:border-box}.summonMysteryStage[hidden]{display:none!important}
#rewardOverlay .summonMysteryStage h3{font:23px/1.4 var(--font-display);color:#e4d8b7;margin:0}.summonMysteryStage h3:focus{outline:none}.mysteryEyebrow{letter-spacing:.16em}.summonCarousel{width:230px;height:230px;position:relative;perspective:600px;margin:8px 0;flex:none}
.summonOrbitCard{position:absolute;left:50%;top:50%;width:106px;height:152px;margin-left:-53px;margin-top:-76px;border:3px solid var(--orbit-color);border-radius:8px;background:#1a342b;box-shadow:0 0 13px color-mix(in srgb,var(--orbit-color) 45%,transparent),0 5px 20px #0007;display:flex;flex-direction:column;justify-content:center;align-items:center;animation:sealedOrbit .85s linear infinite;animation-delay:calc(var(--orbit)*-.28333s);backface-visibility:hidden}
.summonOrbitCard .transformPortrait,.summonOrbitCard .artIcon{width:90px;height:90px;display:block}.summonOrbitCard b{font-size:13px;color:var(--orbit-color)}.reducedSeal{position:relative;width:130px;height:195px;flex:none;border:1px solid #caba87;border-radius:7px;overflow:hidden}
.summonMysteryStage.revealed{border-color:var(--reveal-color);box-shadow:inset 0 0 50px #e3ceb010}.summonMysteryStage.revealed h3{color:var(--reveal-color)!important}.summonSpotlight{width:185px;height:245px;flex:none;animation:sealOpen .55s ease-out both;box-shadow:0 0 28px color-mix(in srgb,var(--reveal-color),transparent 65%);border-radius:8px}
.summonSpotlight .transformPortrait,.summonSpotlight .artIcon{width:130px;height:130px}.summonSpotlight .summonFace b{font-size:18px}.summonSpotlight .summonFace small{font-size:14px}.revealStageActions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
@keyframes sealedOrbit{0%{transform:translateX(0) scale(1);z-index:3;opacity:1}33%{transform:translateX(88px) scale(.65) rotateY(-40deg);z-index:1;opacity:.5}66%{transform:translateX(-88px) scale(.65) rotateY(40deg);z-index:1;opacity:.5}100%{transform:translateX(0) scale(1);z-index:3;opacity:1}}
@keyframes sealOpen{0%{transform:scale(.7) rotateY(80deg);opacity:.3}70%{transform:scale(1.05) rotateY(0);opacity:1}100%{transform:scale(1)}}
@media(max-width:520px){#game #rewardOverlay .summonRevealScene{padding:12px 8px}.summonRevealCards{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.summonResultCard,#rewardOverlay .sealed>button{min-height:115px}.summonFace{display:grid;grid-template-columns:46px minmax(0,1fr);gap:4px;text-align:left;padding:6px}.summonFace .transformPortrait,.summonFace .artIcon{width:46px;height:46px;grid-column:1;grid-row:1/4;margin:auto}.summonFace small,.summonFace b,.summonFace>span:not(.transformPortrait){grid-column:2}.summonFace small{grid-row:1}.summonFace b{grid-row:2;font-size:11px}.summonSpotlight .summonFace,.single .summonFace{display:flex;text-align:center}.single .summonResultCard{min-height:215px}.single .summonFace .transformPortrait,.single .summonFace .artIcon{width:110px;height:110px}.summonSpotlight .summonFace .transformPortrait,.summonSpotlight .summonFace .artIcon{width:130px;height:130px}.summonSpotlight .summonFace b{font-size:18px}.summonMysteryStage{padding:10px}#rewardOverlay .summonRevealScene h2{font-size:21px}}
@media(max-height:580px){.summonMysteryStage{gap:4px}.summonSpotlight{height:170px;width:145px}.summonSpotlight .summonFace .transformPortrait,.summonSpotlight .summonFace .artIcon{width:80px;height:80px}.summonCarousel{height:170px;margin:0}#rewardOverlay .summonMysteryStage h3{font-size:18px}}
@media(prefers-reduced-motion:reduce){.summonOrbitCard,.summonSpotlight{animation:none!important}}
[data-quality=low] .summonOrbitCard,[data-quality=low] .summonSpotlight{animation:none!important}
/* Ordinary cards retain their sequential two-sided turn before high-grade seals. */
.summonResultCard{position:relative;perspective:700px}.summonFlipBack{position:relative;min-height:148px;height:100%;border-radius:6px;overflow:hidden;background:#132c22;box-sizing:border-box}.ordinaryOpening .summonFlipBack{position:absolute;inset:0;z-index:1;animation:ordinaryBack .52s ease-in-out both;backface-visibility:hidden;pointer-events:none}.ordinaryOpening .summonFace{animation:ordinaryFace .52s ease-in-out both;backface-visibility:hidden}
@keyframes ordinaryBack{0%{transform:rotateY(0);visibility:visible}49%{transform:rotateY(90deg);visibility:visible}50%,100%{transform:rotateY(90deg);visibility:hidden}}
@keyframes ordinaryFace{0%,49%{transform:rotateY(-90deg);opacity:0}50%{transform:rotateY(-90deg);opacity:1}100%{transform:rotateY(0);opacity:1}}
@media(max-width:520px){.summonFlipBack{min-height:115px}.single .summonFlipBack{min-height:215px}}
@media(prefers-reduced-motion:reduce){.ordinaryOpening .summonFace{animation:none!important}.ordinaryOpening .summonFlipBack{display:none}}
[data-quality=low] .ordinaryOpening .summonFace{animation:none!important}[data-quality=low] .ordinaryOpening .summonFlipBack{display:none}

.summonFace .summonAutoApplied{display:block;grid-column:1/-1;font-size:10px;font-style:normal;font-weight:700;color:#b8f7c6;text-align:center;line-height:1.35}.summonSpotlight .summonAutoApplied{font-size:12px}