#appTransition,#singerTransition{position:fixed;inset:0;z-index:100000;background:#151b22;color:#eaf0f4;display:grid;place-items:center;padding:24px;outline:0;font-family:system-ui,sans-serif;box-sizing:border-box}
#appTransition[hidden],#singerTransition[hidden]{display:none!important}
.transition-card{width:min(440px,100%);text-align:center}
.coin-perspective{display:inline-block;width:88px;height:88px;perspective:440px}
.goblin-coin{position:relative;display:block;width:100%;height:100%;transform-style:preserve-3d;animation:goblin-turn 2.4s linear infinite}
.goblin-coin img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.coin-front{transform:rotateY(0deg)}.coin-back{transform:rotateY(180deg)}
#transitionLabel,.transition-label{font-size:18px;line-height:1.55;margin:22px 0 12px}
#transitionDetail,.transition-detail{color:#b8c7cf;font-size:13px}
.transition-card progress{width:100%;height:16px;accent-color:#cee780}
body.transition-open{overflow:hidden}body.transition-open>header,body.transition-open>main{visibility:hidden}
@keyframes goblin-turn{from{transform:rotateY(0)}to{transform:rotateY(360deg)}}
@media(prefers-reduced-motion:reduce){.goblin-coin{animation:none;transform:none}.coin-back{display:none}}