/* S3 original Blender footage. Receipt photo follows the rendered card's four corners. */
#rare-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1;pointer-events:none}
.opening-dialog>.skip-sound{position:absolute;top:10px;left:10px;z-index:20;padding:9px 12px;background:#091323d9;color:#dbc493;border:1px solid #c8aa7166;font-size:11px}.opening-dialog>.skip-sound[hidden]{display:none}
.film-face{position:absolute;left:0;top:0;width:1px;height:1px;transform-origin:0 0;pointer-events:none;backface-visibility:visible}
.film-face img{display:block;width:100%;height:100%;object-fit:fill}
.rare-stage .rare-heading{top:4%;left:4%;right:4%;width:auto;bottom:auto;display:block;z-index:3}
.rare-heading h2{font-size:clamp(19px,2vw,27px);margin:0;letter-spacing:.05em;text-shadow:0 2px 8px #000,0 0 18px #000}
.rare-heading .eyebrow{display:none}.rare-stage .rare-identity{bottom:3%;left:5%;right:5%;width:auto;animation:none;z-index:3;text-shadow:0 2px 8px #000,0 0 12px #000}
.rare-identity h3{font-size:25px;display:inline;margin:0 8px}.rare-identity p{display:inline;font-size:13px}.rare-identity small{margin-top:3px}
.rare-identity #rare-grade{position:static;display:inline;transform:none;clip-path:none;background:none;border:0;padding:0;font-size:21px!important}
.rare-stage .rare-hint{bottom:.8%;font-size:9px;margin:0;opacity:.7}.rare-stage .skip-opening{z-index:5}
.rare-stage[data-video=unavailable]:before{content:'영상 재생 실패 · 획득 카드는 정상 저장됐습니다';position:absolute;top:15%;left:4%;right:4%;text-align:center;font-size:12px;color:#e3c28c}
.rare-stage[data-video=unavailable] .film-face,.rare-stage[data-video=reduced] .film-face{filter:drop-shadow(0 0 20px var(--rare-light))}
.result-card[data-rarity=F]{--grade-halo:#a6bdcc}.result-card[data-rarity=E]{--grade-halo:#70b2ef}.result-card[data-rarity=D]{--grade-halo:#4edbd0}.result-card[data-rarity=C]{--grade-halo:#93df80}.result-card[data-rarity=B]{--grade-halo:#b69cff}.result-card[data-rarity=A]{--grade-halo:#e39ad4}.result-card[data-rarity=S]{--grade-halo:#ffb96b}.result-card[data-rarity=SS]{--grade-halo:#d4f1ff}.result-card[data-rarity=SSS]{--grade-halo:#ffdf80}
.result-cards:not(.item-results){gap:17px}.result-card{overflow:visible;isolation:isolate}
.result-turn{position:relative;aspect-ratio:3/4;width:100%;perspective:900px}
.result-back,.result-front{position:absolute;inset:0;width:100%;height:100%;backface-visibility:hidden;-webkit-backface-visibility:hidden;transform-origin:center}
.result-card .result-back{object-fit:fill;transform:rotateY(180deg);filter:drop-shadow(0 0 13px var(--grade-halo))}
.result-front>img{width:100%;height:100%;object-fit:cover;display:block}
.result-card:before{content:'';position:absolute;inset:0;z-index:-1;box-shadow:0 0 20px var(--grade-halo);opacity:.3;pointer-events:none}
.reveal-backs .result-front{animation:result-front-flip .85s var(--reveal-delay) both cubic-bezier(.4,0,.2,1)}
.reveal-backs .result-back{animation:result-back-flip .85s var(--reveal-delay) both cubic-bezier(.4,0,.2,1)}
.reveal-backs .result-copy{animation:result-name-in .3s calc(var(--reveal-delay) + .6s) both}
.result-card[data-rarity=SSS]:before{box-shadow:0 0 30px 5px var(--grade-halo)}
.result-card .new-label{bottom:auto!important;top:10px!important}.item-results .result-card{overflow:hidden}.item-results .result-card:before{display:none}
@keyframes result-front-flip{from{transform:rotateY(-180deg)}to{transform:rotateY(0)}}
@keyframes result-back-flip{from{transform:rotateY(0)}to{transform:rotateY(180deg)}}
@keyframes result-name-in{from{opacity:0}to{opacity:1}}
@media(max-width:600px){.rare-stage{height:min(760px,88dvh,calc((100vw - 44px)*1.9));min-height:0}.rare-stage .rare-heading{top:8%;left:2%;right:2%}.rare-heading h2{font-size:20px}.rare-stage .rare-identity{bottom:4%}.rare-identity h3{font-size:21px}.rare-identity p{font-size:11px}.rare-stage .rare-hint{font-size:8px}.result-cards:not(.item-results){gap:9px}.result-card .result-grade{left:3px;top:3px;padding:2px 4px;font-size:12px!important}.result-card .new-label{font-size:7px!important;top:3px!important;right:2px}}
@media(max-height:550px) and (min-width:601px){.rare-stage .rare-heading{top:4%;left:1%;width:28%}.rare-stage .rare-identity{bottom:35%;width:25%;right:1%;left:auto}.rare-identity h3,.rare-identity p{display:block}}
@media(prefers-reduced-motion:reduce){.result-back{display:none}.result-front{transform:none;animation:none!important}.result-copy{animation:none!important}}