.celebration{position:fixed;inset:0;z-index:40;pointer-events:none;overflow:hidden;isolation:isolate;color:var(--celebration-color)}.celebrationRibbon{position:absolute;left:50%;top:7%;transform:translateX(-50%);display:grid;justify-items:center;gap:5px;min-width:290px;padding:13px 32px;background:linear-gradient(90deg,transparent,#122a3cef 17%,#244958f0 50%,#122a3cee 83%,transparent);text-shadow:0 3px #123047,0 0 17px #111b30;animation:rewardRibbon 3.2s ease both}.celebrationRibbon>span{font:31px 'Jua',sans-serif}.celebrationRibbon b{font:32px 'Jua',sans-serif}.celebrationRibbon small{font:12px 'Gowun Dodum',sans-serif;color:#e4e8d7;white-space:nowrap}.celebration.legendary .celebrationRibbon{animation-duration:4.5s}.celebrationOrbit{position:absolute;left:50%;top:48%;width:180px;height:180px;border:2px solid currentColor;box-shadow:0 0 25px color-mix(in srgb,var(--celebration-color) 30%,transparent),inset 0 0 25px color-mix(in srgb,var(--celebration-color) 20%,transparent);border-radius:50%;animation:rewardOrbit 1.3s ease-out both}.celebrationSparks{position:absolute;left:50%;top:48%;font:20px 'Jua',sans-serif;filter:drop-shadow(0 0 7px currentColor)}.celebrationSparks>i{position:absolute;font-style:normal;animation:rewardSpark 2.7s var(--delay) cubic-bezier(.1,.55,.3,1) both}.celebrationRays{position:absolute;left:50%;top:48%;opacity:0;animation:rewardRayFade 2s ease-out both}.celebrationRays>i{position:absolute;width:80px;height:60vh;transform-origin:50% 0;transform:translateX(-50%) rotate(var(--turn));background:linear-gradient(color-mix(in srgb,var(--celebration-color) 13%,transparent),transparent);clip-path:polygon(48% 0,52% 0,100% 100%,0 100%)}.celebration.quest .celebrationRibbon{top:17%;border-radius:22px;background:linear-gradient(#2e5a56f2,#183b43f2);border:1px solid #afd6acbb;box-shadow:0 5px #102c37}.celebration.quest .celebrationRibbon b{font-size:28px}.celebration.quest .celebrationOrbit{top:27%;width:90px;height:90px}.celebration.quest .celebrationSparks{top:27%}.celebration.quest .celebrationRays{display:none}.quietCelebration :is(.celebrationOrbit,.celebrationSparks,.celebrationRays){display:none}.quietCelebration .celebrationRibbon{animation:none}
.rarityCrest{display:inline-block;margin:0 0 10px;padding:7px 17px;border:1px solid var(--catch-color);border-radius:30px;color:var(--catch-color);background:color-mix(in srgb,var(--catch-color) 12%,#122338);font:15px 'Jua',sans-serif}.card.result.epic,.card.result.legendary{--catch-color:#c9a4ff;border-color:var(--catch-color);box-shadow:0 0 30px color-mix(in srgb,var(--catch-color) 22%,transparent),0 10px 30px #091527}.card.result.legendary{--catch-color:#ffe098}.card.result.epic .resultFish,.card.result.legendary .resultFish{background:radial-gradient(ellipse,color-mix(in srgb,var(--catch-color) 26%,transparent),transparent 68%);filter:drop-shadow(0 0 7px color-mix(in srgb,var(--catch-color) 30%,transparent))}.card.result.epic #modalTitle,.card.result.legendary #modalTitle{color:var(--catch-color)}
@keyframes rewardRibbon{0%{opacity:0;transform:translate(-50%,16px) scale(.9)}12%,78%{opacity:1;transform:translate(-50%,0) scale(1)}100%{opacity:0;transform:translate(-50%,-12px)}}@keyframes rewardOrbit{0%{opacity:.75;transform:translate(-50%,-50%) scale(.2)}100%{opacity:0;transform:translate(-50%,-50%) scale(3)}}@keyframes rewardSpark{0%{opacity:0;transform:translate(0,0) scale(.1)}10%{opacity:1}100%{opacity:0;transform:translate(var(--x),var(--y)) rotate(var(--rotation)) scale(.3)}}@keyframes rewardRayFade{20%{opacity:1}100%{opacity:0}}
@media(max-width:759px){.celebrationRibbon{top:3%;min-width:250px;padding:9px 20px}.celebrationRibbon b{font-size:26px}.celebrationRibbon>span{font-size:23px}.celebrationRibbon small{font-size:10px}.celebration.quest .celebrationRibbon{top:14%}.rarityCrest{font-size:13px;padding:5px 14px}}
@media(min-width:950px){.celebration:not(.quest) .celebrationRibbon{left:calc(50% + 300px);top:18%;min-width:260px;padding:16px 20px}.celebration:not(.quest) .celebrationRibbon b{font-size:27px}.celebration:not(.quest) .celebrationRibbon small{font-size:11px}}
@media(max-width:949px){.celebration:not(.quest) .celebrationRibbon{top:5px;display:flex;justify-content:center;gap:9px;height:40px;padding:5px 20px;min-width:270px}.celebration:not(.quest) .celebrationRibbon small{display:none}.celebration:not(.quest) .celebrationRibbon b{font-size:22px}.celebration:not(.quest) .celebrationRibbon>span{font-size:24px}}
