/* Original pull-card scene. Grade color is supplied only by the locked result snapshot. */
dialog.pullCardRevealDialog{position:fixed;inset:0;width:100%;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;padding:0;border:0;border-radius:0;background:#080d16;color:#eceff4;overflow:auto;overscroll-behavior:contain;box-shadow:none;}
dialog.pullCardRevealDialog[open]{display:block;}
.pullCardRevealDialog::backdrop{background:#080d16;}
.pullCardRevealDialog *, .pullCardRevealDialog *:before,.pullCardRevealDialog *:after{box-sizing:border-box;}
.pullCardRevealDialog button{font:inherit;min-height:44px;border:1px solid #ffffff24;border-radius:5px;padding:10px 16px;color:#e9edf4;background:#ffffff08;cursor:pointer;font-size:12px;}
.pullCardRevealDialog button:disabled{opacity:.4;cursor:default;}
.pullCardRevealDialog button:focus-visible,.pullCardCard:focus-visible{outline:2px solid #e9edf4;outline-offset:4px;}
.pullCardHeader{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:84px;padding:20px max(24px,env(safe-area-inset-right)) 20px max(24px,env(safe-area-inset-left));border-bottom:1px solid #ffffff10;background:#080d16;}
.pullCardHeader>div>span{font-size:9px;letter-spacing:2px;color:#7d899e;}
.pullCardHeader h2{margin:7px 0 0;font-size:21px;line-height:1.4;}
.pullCardRevealDialog .pullCardClose{width:44px;height:44px;min-width:44px;padding:0;font-size:25px;border:0;background:transparent;}
.pullCardLayout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(270px,.9fr);width:min(1160px,100%);min-height:calc(100dvh - 84px);margin-inline:auto;align-items:start;}
.pullCardMain{min-width:0;padding:21px 24px 24px;background:radial-gradient(ellipse at 50% 48%,#ffffff05,transparent 63%);}
.pullCardStep{display:flex;justify-content:space-between;gap:16px;font-size:10px;letter-spacing:1px;color:#8a96aa;}
.pullCardStage{--pull-progress:0;position:relative;isolation:isolate;width:100%;max-width:640px;height:460px;margin:12px auto 0;overflow:hidden;}
.pullCardHalo{position:absolute;left:4%;right:4%;top:175px;height:270px;border-radius:50%;background:radial-gradient(ellipse,var(--preview-grade,#77808F),transparent 68%);opacity:calc(var(--pull-progress)*.65);transform:scale(calc(.72 + var(--pull-progress)*.28));filter:blur(26px);pointer-events:none;}
.pullCardWindow{position:absolute;inset:180px 0 0;z-index:2;overflow:hidden;pointer-events:none;}
.pullCardWindow:before{content:"";position:absolute;left:calc(50% - 102px);top:0;width:204px;height:3px;background:#02050a;box-shadow:0 1px 0 #ffffff18;z-index:4;pointer-events:none;}
.pullCardCard{position:absolute;left:50%;top:calc(-190px*(1 - var(--pull-progress)));width:190px;height:260px;transform:translateX(-50%);border:1px solid color-mix(in srgb,var(--preview-grade,#77808F) 30%,#aab4c4);border-radius:11px;background:#151c28;box-shadow:0 8px 24px #0008,0 0 calc(var(--pull-progress)*28px) color-mix(in srgb,var(--preview-grade,#77808F) 45%,transparent);touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab;pointer-events:auto;overflow:hidden;}
.pullCardCard:active{cursor:grabbing;}
.pullCardBack{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:28px 20px 24px;color:#c7d1df;background:repeating-linear-gradient(135deg,#ffffff02 0,#ffffff02 1px,transparent 1px,transparent 9px),#151c28;}
.pullCardBack:before{content:"";position:absolute;inset:11px;border:1px solid #a4afc337;border-radius:6px;pointer-events:none;}
.pullCardBack>span{font-size:11px;letter-spacing:3px;font-weight:700;}
.pullCardBack>svg{width:90px;height:90px;color:#b7c3d4;}
.pullCardBack>small{font-size:9px;letter-spacing:1px;color:#8d9bb1;}
.pullCardBack>i{position:absolute;left:30px;right:30px;top:12px;height:2px;background:var(--preview-grade,#77808F);opacity:var(--pull-progress);}
.pullCardFace{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:19px 14px;background:radial-gradient(ellipse at 50% 30%,color-mix(in srgb,var(--preview-grade,#77808F) 12%,transparent),transparent 72%),#141b26;visibility:hidden;}
.pullCardFace>img{display:block;width:100%;height:150px;object-fit:contain;background:transparent;}
.pullCardImagePending{display:flex;align-items:center;justify-content:center;width:100%;height:150px;font-size:50px;color:#8b98ad;}
.pullCardFaceGrade{font-size:11px;font-weight:700;color:var(--preview-grade,#77808F);}
.pullCardFace>strong{max-width:100%;font-size:11px;line-height:1.5;text-align:center;overflow-wrap:anywhere;}
.isRevealed .pullCardBack{visibility:hidden;}
.isRevealed .pullCardFace{visibility:visible;}
.isRevealed .pullCardCard{cursor:default;border-color:var(--preview-grade,#77808F);}
.pullCardChest{position:absolute;left:50%;top:-12px;transform:translateX(-50%);width:270px;height:190px;z-index:3;pointer-events:none;filter:drop-shadow(0 18px 15px #0008);}
.pullCardChest .numberedChest{display:block;width:100%;height:100%;padding:0;background:none;border:0;box-shadow:none;transform:none;}
.pullCardChest .numberedChestArt{width:100%;height:100%;}
.pullCardChest .numberedChestNumber{font-size:18px;}
.pullCardChest .numberedChestMark{display:none;}
.pullCardStatus{min-height:48px;margin-top:8px;color:#a9b4c4;font-size:12px;line-height:1.7;text-align:center;}
.pullCardStatus>strong{display:block;color:#eef2f8;font-size:15px;}
.pullCardStatus>span{display:block;}
.pullCardKeys{margin:4px 0 18px;color:#748198;font-size:10px;line-height:1.7;text-align:center;}
.pullCardActions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;}
.pullCardActions button{flex:1;min-width:130px;}
.pullCardRevealDialog .pullCardPrimary{background:#e5e9ef;color:#151b24;border-color:#e5e9ef;font-weight:700;}
.pullCardResults{min-width:0;padding:24px 20px;border-left:1px solid #ffffff10;background:#ffffff02;}
.pullCardResultsHead{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-bottom:15px;}
.pullCardResultsHead h3{margin:0;font-size:15px;}
.pullCardResultsHead>span{font-size:10px;color:#a3aec0;}
.pullCardResultList{display:grid;gap:8px;list-style:none;margin:0 0 16px;padding:0;max-height:380px;overflow:auto;scrollbar-width:thin;overscroll-behavior:contain;}
.pullResultRow{min-width:0;border:1px solid #ffffff0b;border-left:2px solid var(--preview-grade,#77808F);border-radius:5px;background:#ffffff03;overflow:hidden;}
.pullResultRow.isCurrent{border-color:#9ba9bf70;border-left-color:var(--preview-grade,#77808F);}
.pullCardRevealDialog .pullResultRow>button,.pullResultRow>div{display:flex;align-items:center;gap:10px;width:100%;min-height:70px;margin:0;padding:9px;border:0;border-radius:0;text-align:left;background:none;color:#c0cad9;}
.pullResultRow img,.pullResultPending{display:flex;align-items:center;justify-content:center;width:46px;height:46px;object-fit:contain;flex-shrink:0;font-size:25px;color:#61718a;}
.pullResultRow>button>span:not(.pullResultCheck),.pullResultRow>div>span:last-child{min-width:0;flex:1;}
.pullResultRow small{display:block;color:var(--preview-grade,#77808F);font-size:9px;line-height:1.5;}
.pullResultRow strong{display:block;margin-top:5px;font-size:11px;line-height:1.5;overflow-wrap:anywhere;}
.pullResultCheck{flex-shrink:0;font-size:13px;color:#c0cad9;}
.pullCardRevealDialog .pullCardAll{width:100%;}
.pullCardNote{margin:14px 0 0;color:#77859b;font-size:10px;line-height:1.8;}
.pullCardEmpty{padding:28px;}
@media(max-width:700px){
 dialog.pullCardRevealDialog{width:100%;height:100dvh;max-height:100dvh;margin:0;border-radius:0;}
 .pullCardHeader{padding:15px 17px;}
 .pullCardHeader h2{font-size:18px;}
 .pullCardLayout{grid-template-columns:1fr;}
 .pullCardMain{padding:18px 16px;}
 .pullCardStage{height:430px;}
 .pullCardWindow{inset:162px 0 0;}
 .pullCardCard{top:calc(-180px*(1 - var(--pull-progress)));width:180px;height:246px;}
 .pullCardChest{width:245px;height:170px;top:-10px;}
 .pullCardFace>img{height:140px;}
 .pullCardResults{border-left:0;border-top:1px solid #ffffff10;padding:20px 16px;}
 .pullCardResultList{max-height:260px;}
 .pullCardActions button{min-width:120px;}
}
@media(prefers-reduced-motion:reduce){
 .pullCardRevealDialog *{animation:none!important;transition:none!important;scroll-behavior:auto!important;}
 .pullCardHalo{filter:none;}
}