.gr-stage{position:fixed;inset:0;z-index:200;overflow:hidden;cursor:pointer;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;color:#fff;font-family:Inter,Noto Sans JP,Noto Sans,sans-serif;letter-spacing:.01em;background:radial-gradient(ellipse at 50% 60%,#1a1a18 0,#0a0a0a 60%,#000 100%);--r-c:#c8ff00;--r-glow:rgba(200,255,0,.55);--r-soft:rgba(200,255,0,.18);--r-faint:rgba(200,255,0,.04)}.gr-stage *,.gr-stage :after,.gr-stage :before{box-sizing:border-box}.gr-stage.gr-rarity-n{--r-c:#d0d0d0;--r-glow:hsla(0,0%,82%,.4);--r-soft:hsla(0,0%,82%,.13);--r-faint:hsla(0,0%,82%,.03)}.gr-stage.gr-rarity-r{--r-c:#5ab9ff;--r-glow:rgba(90,185,255,.5);--r-soft:rgba(90,185,255,.16);--r-faint:rgba(90,185,255,.04)}.gr-stage.gr-rarity-sr{--r-c:#c084fc;--r-glow:rgba(192,132,252,.55);--r-soft:rgba(192,132,252,.18);--r-faint:rgba(192,132,252,.05)}.gr-stage.gr-rarity-ssr{--r-c:#c8ff00;--r-glow:rgba(200,255,0,.6);--r-soft:rgba(200,255,0,.2);--r-faint:rgba(200,255,0,.05)}.gr-stage.gr-rarity-ur{--r-c:#ff3b66;--r-glow:rgba(255,59,102,.6);--r-soft:rgba(255,59,102,.2);--r-faint:rgba(255,59,102,.06)}.gr-stage.gr-rarity-secret{--r-c:#ffe27a;--r-glow:rgba(255,226,122,.55);--r-soft:rgba(255,226,122,.18);--r-faint:rgba(255,226,122,.05)}.gr-stage:before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 30% 20%,var(--r-faint) 0,transparent 30%),radial-gradient(circle at 70% 80%,var(--r-faint) 0,transparent 35%);pointer-events:none}.gr-glass{position:absolute;top:38%;width:80px;height:130px;transform-origin:bottom center;z-index:10;color:hsla(0,0%,100%,.85);opacity:0}.gr-glass svg{display:block;width:100%;height:100%}.gr-glass.left{left:-90px}.gr-glass.right{right:-90px;transform:scaleX(-1)}.gr-stage[data-phase=pulling] .gr-glass.left{animation:gr-glass-left 1.3s cubic-bezier(.5,0,.2,1) forwards}.gr-stage[data-phase=pulling] .gr-glass.right{animation:gr-glass-right 1.3s cubic-bezier(.5,0,.2,1) forwards}@keyframes gr-glass-left{0%{transform:translateX(0) rotate(-25deg);opacity:0}10%{opacity:1}62%{transform:translateX(calc(50vw - 5px)) rotate(8deg);opacity:1}72%{transform:translateX(calc(50vw - 15px)) rotate(2deg);opacity:1}to{transform:translateX(calc(50vw + 25px)) rotate(-10deg);opacity:0}}@keyframes gr-glass-right{0%{transform:scaleX(-1) translateX(0) rotate(-25deg);opacity:0}10%{opacity:1}62%{transform:scaleX(-1) translateX(calc(50vw - 5px)) rotate(8deg);opacity:1}72%{transform:scaleX(-1) translateX(calc(50vw - 15px)) rotate(2deg);opacity:1}to{transform:scaleX(-1) translateX(calc(50vw + 25px)) rotate(-10deg);opacity:0}}.gr-flash{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);width:6px;height:6px;border-radius:50%;background:#fff;z-index:20;opacity:0}.gr-stage[data-phase=pulling] .gr-flash{animation:gr-flash .7s ease-out .78s forwards}@keyframes gr-flash{0%{transform:translate(-50%,-50%) scale(0);opacity:0}18%{transform:translate(-50%,-50%) scale(120);opacity:1;box-shadow:0 0 80px 40px hsla(0,0%,100%,.55)}60%{transform:translate(-50%,-50%) scale(200);opacity:0;box-shadow:0 0 0 0 transparent}to{opacity:0}}.gr-ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:40px;height:40px;border:1.5px solid var(--r-c);border-radius:50%;z-index:15;opacity:0}.gr-ring.r2{border-color:var(--r-glow)}.gr-ring.r3{border-color:hsla(0,0%,100%,.3)}.gr-stage[data-phase=pulling] .gr-ring{animation:gr-ring 1s ease-out .78s forwards}.gr-stage[data-phase=pulling] .gr-ring.r2{animation-delay:.88s}.gr-stage[data-phase=pulling] .gr-ring.r3{animation-delay:.98s}@keyframes gr-ring{0%{transform:translate(-50%,-50%) scale(.2);opacity:1}to{transform:translate(-50%,-50%) scale(8);opacity:0}}.gr-bubble{position:absolute;top:50%;left:50%;width:4px;height:4px;border-radius:50%;background:var(--r-c);box-shadow:0 0 8px var(--r-c);z-index:25;opacity:0}.gr-stage[data-phase=pulling] .gr-bubble{animation:gr-bubble 1.4s ease-out .8s forwards}@keyframes gr-bubble{0%{transform:translate(-50%,-50%) scale(0);opacity:0}15%{transform:translate(var(--bx),var(--by)) scale(1.2);opacity:1}to{transform:translate(var(--bx),calc(var(--by) - 80px)) scale(.4);opacity:0}}.gr-card{position:absolute;top:50%;left:50%;width:240px;height:360px;transform:translate(-50%,-50%);transform-origin:center;z-index:30;perspective:1200px;opacity:0}.gr-stage[data-phase=cardBack] .gr-card{animation:gr-card-in .5s ease-out forwards,gr-card-hover 2.2s ease-in-out .5s infinite}.gr-stage[data-phase=revealed] .gr-card{opacity:1;transform:translate(-50%,calc(-50% - 4px))}@keyframes gr-card-in{0%{transform:translate(-50%,calc(-50% + 30px)) scale(0);opacity:0}60%{transform:translate(-50%,-50%) scale(1.06);opacity:1}to{transform:translate(-50%,-50%) scale(1);opacity:1}}@keyframes gr-card-hover{0%,to{transform:translate(-50%,-50%)}50%{transform:translate(-50%,calc(-50% - 8px))}}.gr-card-inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;transform:rotateY(180deg)}.gr-stage[data-phase=revealed] .gr-card-inner{animation:gr-flip .85s cubic-bezier(.5,.05,.3,1) forwards}@keyframes gr-flip{0%{transform:rotateY(180deg)}to{transform:rotateY(0deg)}}.gr-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:14px;overflow:hidden}.gr-back{background:linear-gradient(135deg,#1a1a1a,#0a0a0a);border:1px solid hsla(0,0%,100%,.08);display:flex;align-items:center;justify-content:center;transform:rotateY(180deg)}.gr-back:before{content:"";position:absolute;inset:12px;border:1px solid var(--r-soft);border-radius:6px;pointer-events:none}.gr-back-mark{font-weight:900;font-size:22px;letter-spacing:.05em;color:var(--r-c);text-align:center;line-height:1.1;text-shadow:0 0 18px var(--r-glow)}.gr-back-sub{position:absolute;bottom:24px;left:0;right:0;text-align:center;font-size:9px;letter-spacing:.4em;color:hsla(0,0%,100%,.45)}.gr-front{background:#000;color:#fff;box-shadow:0 0 0 1px var(--r-glow),0 0 24px var(--r-soft)}.gr-front-art,.gr-front-placeholder{position:absolute;inset:0}.gr-front-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:18px;text-align:center;background:linear-gradient(180deg,#050505,#0c0c0c)}.gr-front-placeholder b{font-weight:900;font-size:20px;letter-spacing:.2em;color:var(--r-c)}.gr-front-placeholder span{font-family:Noto Sans JP,Noto Sans,sans-serif;font-size:13px;font-weight:700;line-height:1.4;color:hsla(0,0%,100%,.8)}.gr-front:before{z-index:1;background:radial-gradient(circle at 50% 0,var(--r-soft) 0,transparent 35%),radial-gradient(circle at 50% 100%,var(--r-faint) 0,transparent 35%);mix-blend-mode:screen;opacity:.6}.gr-front:after,.gr-front:before{content:"";position:absolute;inset:0;pointer-events:none}.gr-front:after{z-index:2;background:linear-gradient(115deg,transparent 30%,hsla(0,0%,100%,.18) 48%,var(--r-soft) 52%,transparent 70%);background-size:250% 100%;background-position:100% 0;opacity:0}.gr-stage.gr-rarity-n .gr-front:after,.gr-stage.gr-rarity-r .gr-front:after{display:none}.gr-stage[data-phase=revealed] .gr-front:after{animation:gr-sheen 1.4s ease-out .7s forwards}@keyframes gr-sheen{0%{background-position:100% 0;opacity:0}10%{opacity:1}to{background-position:-100% 0;opacity:0}}.gr-corner{position:absolute;top:10px;left:10px;right:10px;justify-content:space-between;z-index:3;pointer-events:none}.gr-corner,.gr-pips{display:flex;align-items:center}.gr-pips{gap:4px;background:rgba(0,0,0,.55);padding:5px 7px;border-radius:999px;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);box-shadow:0 2px 8px rgba(0,0,0,.4)}.gr-pips i{width:5px;height:5px;border-radius:50%;background:var(--r-c);box-shadow:0 0 4px var(--r-glow)}.gr-stage.gr-rarity-secret .gr-pips i,.gr-stage.gr-rarity-ssr .gr-pips i,.gr-stage.gr-rarity-ur .gr-pips i{box-shadow:0 0 6px var(--r-c),0 0 12px var(--r-glow)}.gr-rarity-label{font-size:9px;font-weight:800;letter-spacing:.3em;color:hsla(0,0%,100%,.75);background:rgba(0,0,0,.55);padding:3px 6px;border-radius:2px;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.gr-stage.gr-rarity-secret .gr-rarity-label{box-shadow:inset 0 0 0 1px rgba(255,226,122,.55)}.gr-burst{z-index:22;pointer-events:none}.gr-burst,.gr-burst-wash{position:absolute;inset:0}.gr-burst-wash{background:radial-gradient(ellipse at center,var(--r-soft) 0,var(--r-faint) 40%,transparent 70%);opacity:0}.gr-stage.gr-rarity-secret .gr-burst-wash,.gr-stage.gr-rarity-ssr .gr-burst-wash,.gr-stage.gr-rarity-ur .gr-burst-wash{background:radial-gradient(ellipse at center,var(--r-c) 0,var(--r-soft) 20%,var(--r-faint) 50%,transparent 75%)}.gr-burst-ring{position:absolute;top:50%;left:50%;width:80px;height:80px;border-radius:50%;border:1.5px solid var(--r-c);transform:translate(-50%,-50%) scale(0);opacity:0;box-shadow:0 0 30px var(--r-glow),inset 0 0 20px var(--r-soft)}.gr-burst-ring.r2{border-color:var(--r-glow)}.gr-burst-ring.r3{border-color:hsla(0,0%,100%,.4)}.gr-stage[data-phase=revealed] .gr-burst-wash{animation:gr-burst-wash 1.6s ease-out .35s forwards}.gr-stage[data-phase=revealed] .gr-burst-ring{animation:gr-burst-ring 1.2s cubic-bezier(.2,.7,.3,1) .35s forwards}.gr-stage[data-phase=revealed] .gr-burst-ring.r2{animation-delay:.53s}.gr-stage[data-phase=revealed] .gr-burst-ring.r3{animation-delay:.71s}@keyframes gr-burst-wash{0%{opacity:0}20%{opacity:.9}60%{opacity:.5}to{opacity:0}}@keyframes gr-burst-ring{0%{transform:translate(-50%,-50%) scale(.1);opacity:0}20%{opacity:1}to{transform:translate(-50%,-50%) scale(6);opacity:0}}.gr-spark{position:absolute;top:50%;left:50%;width:3px;height:3px;background:var(--r-c);border-radius:50%;box-shadow:0 0 6px var(--r-c);z-index:32;opacity:0}.gr-stage[data-phase=revealed] .gr-spark{animation:gr-spark 1.6s ease-out .6s forwards}@keyframes gr-spark{0%{transform:translate(-50%,-50%) scale(0);opacity:0}20%{transform:translate(var(--sx),var(--sy)) scale(.5);opacity:0}45%{transform:translate(var(--sx),var(--sy)) scale(1.5);opacity:1}to{transform:translate(var(--sx),var(--sy)) scale(.8);opacity:0}}.gr-vignette{inset:0;background:radial-gradient(ellipse at center,transparent 40%,rgba(0,0,0,.6) 100%);z-index:40}.gr-open-hint,.gr-vignette{position:absolute;pointer-events:none}.gr-open-hint{bottom:calc(70px + env(safe-area-inset-bottom));left:0;right:0;text-align:center;font-size:11px;letter-spacing:.45em;color:hsla(0,0%,100%,.6);z-index:60;opacity:0;transition:opacity .4s ease}.gr-stage[data-phase=cardBack] .gr-open-hint{opacity:1;animation:gr-open-pulse 1.4s ease-in-out infinite}@keyframes gr-open-pulse{0%,to{opacity:.6}50%{opacity:1}}.gr-title{position:absolute;top:calc(50% + 190px);left:24px;right:24px;text-align:center;font-family:Noto Sans JP,Noto Sans,sans-serif;font-size:13px;font-weight:700;line-height:1.4;color:hsla(0,0%,100%,.85);z-index:60;opacity:0;transform:translateY(6px);transition:opacity .4s ease .9s,transform .4s ease .9s;pointer-events:none}.gr-title small{display:block;margin-top:4px;font-size:10px;font-weight:500;letter-spacing:.1em;color:hsla(0,0%,100%,.5)}.gr-stage[data-phase=revealed] .gr-title{opacity:1;transform:translateY(0)}.gr-actions{position:absolute;bottom:calc(56px + env(safe-area-inset-bottom));left:0;right:0;display:flex;justify-content:center;gap:12px;z-index:60;opacity:0;transform:translateY(8px);transition:opacity .4s ease 1.1s,transform .4s ease 1.1s;pointer-events:none}.gr-stage[data-phase=revealed] .gr-actions{opacity:1;transform:translateY(0);pointer-events:auto}.gr-btn{font-size:12px;font-weight:700;letter-spacing:.25em;padding:13px 28px;border-radius:2px;cursor:pointer;border:1px solid var(--r-c);background:var(--r-c);color:#0a0a0a;box-shadow:0 0 24px var(--r-glow)}.gr-btn:active{filter:brightness(1.1)}.gr-skip{position:absolute;top:calc(20px + env(safe-area-inset-top));right:20px;z-index:70;font-size:11px;font-weight:700;letter-spacing:.2em;padding:8px 14px;border-radius:999px;border:1px solid hsla(0,0%,100%,.18);background:hsla(0,0%,100%,.08);color:hsla(0,0%,100%,.75);cursor:pointer;transition:opacity .3s ease}.gr-stage[data-phase=revealed] .gr-skip{opacity:0;pointer-events:none}@media (max-height:700px){.gr-card{width:200px;height:300px}.gr-title{top:calc(50% + 160px)}.gr-open-hint{bottom:calc(44px + env(safe-area-inset-bottom))}.gr-actions{bottom:calc(28px + env(safe-area-inset-bottom))}}@media (prefers-reduced-motion:reduce){.gr-stage *,.gr-stage :after,.gr-stage :before{animation-duration:.01s!important;animation-delay:0s!important;transition-delay:0s!important}}