#startScreen{background:radial-gradient(ellipse at 50% 45%,#4c1d95 0%,#2d1b6e 30%,#1e0340 60%,#0a0118 100%) !important;overflow:hidden;}
#startScreen::before{content:'';position:absolute;top:50%;left:50%;width:200vmax;height:200vmax;transform:translate(-50%,-50%);background:repeating-conic-gradient(from 0deg,rgba(168,85,247,0.04) 0deg 6deg,transparent 6deg 12deg);animation:cgSrays 80s linear infinite;pointer-events:none;}
@keyframes cgSrays{to{transform:translate(-50%,-50%) rotate(360deg);}}
#cgLevelBadge{display:inline-flex;align-items:center;gap:8px;background:rgba(124,58,237,0.25);border:1px solid rgba(167,139,250,0.4);border-radius:999px;padding:6px 20px;font-family:'Lilita One',cursive;font-size:0.8rem;color:#c4b5fd;letter-spacing:2px;margin-bottom:20px;backdrop-filter:blur(8px);animation:cgFadeUp 0.6s 0.1s both;}
#cgProgressBar{width:min(300px,68vw);height:3px;background:rgba(255,255,255,0.07);border-radius:999px;margin:20px auto 0;overflow:hidden;}
#cgProgressFill{height:100%;background:linear-gradient(90deg,#7c3aed,#a855f7,#c084fc);border-radius:999px;box-shadow:0 0 8px rgba(168,85,247,0.7);width:0%;transition:width 1.4s 0.4s cubic-bezier(0.4,0,0.2,1);}
@keyframes cgFadeUp{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:translateY(0);}}
.countdown-number{animation:cgCdPop 0.5s cubic-bezier(0.34,1.3,0.64,1) both;}
@keyframes cgCdPop{0%{transform:scale(1.9);opacity:0;filter:blur(8px);}55%{transform:scale(0.93);opacity:1;filter:blur(0);}100%{transform:scale(1);opacity:1;}}
.countdown-number.cgPop{animation:cgCdPop 0.5s cubic-bezier(0.34,1.3,0.64,1) forwards !important;}
@keyframes cgHudR{from{transform:translateX(50px);opacity:0;}to{transform:translateX(0);opacity:0.97;}}
@keyframes cgHudL{from{transform:translateX(-50px);opacity:0;}to{transform:translateX(0);opacity:0.97;}}
#levelIndicator{animation:cgHudR 0.6s 0.5s both;}
#scoreDisplay{animation:cgHudL 0.6s 0.5s both;}
@keyframes cgOverlayIn{from{transform:translateX(-50%) translateY(28px);opacity:0;}to{transform:translateX(-50%) translateY(0);opacity:1;}}
#overlay{animation:cgOverlayIn 0.55s 0.3s cubic-bezier(0.34,1.2,0.64,1) both;}
#cgFlash{position:fixed;inset:0;z-index:9998;pointer-events:none;opacity:0;}
@keyframes cgFlashC{0%{opacity:0;}18%{opacity:1;}100%{opacity:0;}}
@keyframes cgFlashW{0%{opacity:0;}18%{opacity:0.9;}100%{opacity:0;}}
#cgFlash.cgFc{background:radial-gradient(ellipse at center,rgba(34,197,94,0.2) 0%,transparent 72%);animation:cgFlashC 0.7s ease-out forwards;}
#cgFlash.cgFw{background:radial-gradient(ellipse at center,rgba(239,68,68,0.2) 0%,transparent 72%);animation:cgFlashW 0.55s ease-out forwards;}
#cgRipples{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:9997;}
@keyframes cgRingOut{0%{width:0;height:0;opacity:0.8;}100%{width:340px;height:340px;opacity:0;}}
.cg-ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border-radius:50%;border:2px solid rgba(34,197,94,0.55);animation:cgRingOut 0.95s ease-out forwards;}
.cg-ring:nth-child(2){animation-delay:0.18s;border-color:rgba(34,197,94,0.38);}
.cg-ring:nth-child(3){animation-delay:0.36s;border-color:rgba(34,197,94,0.22);}
#timer-circle-container{transition:box-shadow 0.9s ease,border-color 0.9s ease;}
#timer-progress-circle{transition:stroke 0.9s ease,filter 0.9s ease,stroke-dashoffset 1s linear !important;}
#timer-number{transition:color 0.9s ease,text-shadow 0.9s ease !important;}
#timer-progress-circle.cgTw{stroke:#f59e0b !important;filter:drop-shadow(0 0 8px rgba(245,158,11,0.8)) !important;}
#timer-progress-circle.cgTd{stroke:#ef4444 !important;filter:drop-shadow(0 0 12px rgba(239,68,68,0.9)) !important;}
#timer-number.cgTw{color:#fde68a !important;text-shadow:0 0 16px rgba(245,158,11,0.9) !important;}
#timer-number.cgTd{color:#fca5a5 !important;text-shadow:0 0 16px rgba(239,68,68,0.9) !important;}
#timer-circle-container.cgTw{box-shadow:0 0 24px rgba(245,158,11,0.5),0 4px 16px rgba(0,0,0,0.5) !important;border-color:rgba(245,158,11,0.4) !important;}
#timer-circle-container.cgTd{box-shadow:0 0 28px rgba(239,68,68,0.6),0 4px 16px rgba(0,0,0,0.5) !important;border-color:rgba(239,68,68,0.5) !important;}
@keyframes cgTPulse{0%,100%{transform:translate(-50%,-50%) scale(1);}50%{transform:translate(-50%,-50%) scale(1.18);}}
#timer-number.cgTd{animation:cgTPulse 0.48s ease-in-out infinite !important;}
@keyframes cgGiReveal{from{opacity:0;transform:translate(-50%,-44%);filter:blur(5px);}to{opacity:1;transform:translate(-50%,-50%);filter:blur(0);}}
#gameInfo.cgReveal{animation:cgGiReveal 0.5s cubic-bezier(0.34,1.15,0.64,1) forwards !important;}
@keyframes cgGiChild{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:translateY(0);}}
#gameInfo.cgReveal #gameName{animation:cgGiChild 0.4s 0.10s both !important;}
#gameInfo.cgReveal #gameCover{animation:cgGiChild 0.4s 0.20s both !important;}
#gameInfo.cgReveal #gameDetails{animation:cgGiChild 0.4s 0.30s both !important;}
#gameInfo.cgReveal #nextBtnWrap,#gameInfo.cgReveal #nextBtn{animation:cgGiChild 0.4s 0.42s both !important;}
@keyframes cgHbeat{0%,100%{transform:scale(1);filter:drop-shadow(0 0 6px rgba(236,72,153,0.5));}30%{transform:scale(1.22);filter:drop-shadow(0 0 14px rgba(236,72,153,1));}60%{transform:scale(1.06);filter:drop-shadow(0 0 9px rgba(236,72,153,0.7));}}
#lives.cgOne .life:not(.lost){animation:cgHbeat 1.1s ease-in-out infinite !important;}
@keyframes cgLifePop{0%{transform:scale(1.4) rotate(0deg);filter:grayscale(0) brightness(1.8);}40%{transform:scale(0.8) rotate(-12deg);filter:grayscale(0.5);}100%{transform:scale(0.85);filter:grayscale(1) brightness(0.4);opacity:0.4;}}
.life.cgLosing{animation:cgLifePop 0.55s ease-out forwards !important;}
@keyframes cgRnPop{0%{transform:scale(0.7);opacity:0.3;}65%{transform:scale(1.1);opacity:1;}100%{transform:scale(1);}}
@keyframes cgScPulse{0%{transform:scale(1);}45%{transform:scale(1.13);}100%{transform:scale(1);}}
#roundNumber.cgPop{animation:cgRnPop 0.38s cubic-bezier(0.34,1.56,0.64,1) forwards;}
#scoreDisplay.cgPulse{animation:cgScPulse 0.42s ease-out;}
@keyframes cgSburst{0%{transform:scale(1);}40%{transform:scale(1.75);filter:drop-shadow(0 0 22px #ff6b00) brightness(1.4);}70%{transform:scale(0.92);}100%{transform:scale(1);}}
#streakIndicator.cgMilestone #streakFlame{animation:cgSburst 0.65s ease-out forwards !important;}
#streakIndicator{position:relative;}
@keyframes cgMilFloat{0%{opacity:0;transform:translateX(-50%) translateY(0) scale(0.5);}30%{opacity:1;transform:translateX(-50%) translateY(-8px) scale(1.15);}100%{opacity:0;transform:translateX(-50%) translateY(-38px) scale(0.8);}}
#streakIndicator.cgMilestone::after{content:'🔥';position:absolute;top:-32px;left:50%;font-size:1.4rem;pointer-events:none;animation:cgMilFloat 0.9s ease-out forwards;}
#viewer::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 48%,rgba(0,0,0,0.38) 100%);z-index:1;pointer-events:none;}
#cgParticles{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden;}
.cgp{position:absolute;border-radius:50%;animation:cgpFloat linear infinite;}
@keyframes cgpFloat{from{transform:translateY(102vh) scale(0);opacity:0;}5%{opacity:1;}95%{opacity:0.35;}to{transform:translateY(-6vh) scale(1);opacity:0;}}

/* ============ PANORAMA LOADER ENHANCEMENTS ============ */
#panoramaLoader{position:fixed;inset:0;display:none;align-items:center;justify-content:center;z-index:1000003;background:linear-gradient(135deg,rgba(10,1,24,0.95) 0%,rgba(29,11,60,0.92) 100%);backdrop-filter:blur(8px);}
#panoramaLoader.show{display:flex;animation:plFadeIn 0.4s ease-out;}
@keyframes plFadeIn{from{opacity:0;}to{opacity:1;}}
.pl-card{width:100vw;height:100vh;padding:0;border-radius:0;text-align:center;color:#fff;background:transparent;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;position:relative;overflow:hidden;}
.pl-card::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 30%,rgba(168,85,247,0.08) 0%,transparent 70%);z-index:0;pointer-events:none;}
.pl-icon{display:inline-flex;align-items:center;justify-content:center;gap:10px;margin-bottom:10px;position:relative;z-index:1;animation:plIconPulse 2s ease-in-out infinite;}
@keyframes plIconPulse{0%,100%{transform:scale(1);filter:drop-shadow(0 0 8px rgba(168,85,247,0.3));}50%{transform:scale(1.1);filter:drop-shadow(0 0 20px rgba(168,85,247,0.6));}}
.pl-svg{width:28px;height:28px;filter:drop-shadow(0 0 12px rgba(168,85,247,0.5));}
.pl-badge{font-family:'Lilita One',cursive;font-size:0.85rem;color:#a855f7;border:1px solid rgba(167,139,250,0.4);padding:2px 8px;border-radius:999px;background:rgba(168,85,247,0.08);letter-spacing:1px;animation:plBadgeGlow 1.5s ease-in-out infinite;}
@keyframes plBadgeGlow{0%,100%{box-shadow:0 0 8px rgba(168,85,247,0.4);}50%{box-shadow:0 0 20px rgba(168,85,247,0.8);}}
.pl-title{font-family:'Lilita One',cursive;font-size:1.25rem;letter-spacing:1.2px;margin:6px 0 2px;text-shadow:0 0 8px rgba(168,85,247,0.3);position:relative;z-index:1;animation:plTitleSlide 0.6s cubic-bezier(0.34,1.2,0.64,1);}
@keyframes plTitleSlide{from{opacity:0;transform:translateY(-20px);}to{opacity:1;transform:translateY(0);}}
.pl-sub{font-size:0.95rem;opacity:0.85;color:#cfe9f8;margin:0 0 12px;position:relative;z-index:1;animation:plSubFade 0.6s 0.1s cubic-bezier(0.34,1.2,0.64,1) both;}
@keyframes plSubFade{from{opacity:0;}to{opacity:0.85;}}
.pl-spinner{width:42px;height:42px;border:3px solid rgba(167,139,250,0.25);border-top-color:#a855f7;border-radius:50%;margin:8px auto 6px;animation:plspin 1s linear infinite,plSpinnerGlow 2s ease-in-out infinite;filter:drop-shadow(0 0 8px rgba(168,85,247,0.6));position:relative;z-index:1;}
@keyframes plspin{to{transform:rotate(360deg);}}
@keyframes plSpinnerGlow{0%,100%{filter:drop-shadow(0 0 8px rgba(168,85,247,0.6));}50%{filter:drop-shadow(0 0 16px rgba(168,85,247,1));}}
.pl-progress{width:min(420px,80vw);height:6px;background:rgba(255,255,255,0.06);border:1px solid rgba(167,139,250,0.35);border-radius:999px;overflow:hidden;margin:14px auto 0;display:none;position:relative;z-index:1;box-shadow:0 0 12px rgba(168,85,247,0.2);}
.pl-bar{height:100%;width:0%;background:linear-gradient(90deg,#7c3aed,#a855f7,#c084fc);box-shadow:0 0 8px rgba(168,85,247,0.6),inset 0 2px 4px rgba(255,255,255,0.2);transition:width 0.2s ease;border-radius:999px;}

/* ============ ROUND RECAP ANIMATIONS ============ */
#roundSummaryScreen{animation:rsSlideUp 0.5s cubic-bezier(0.34,1.2,0.64,1);}
@keyframes rsSlideUp{from{opacity:0;transform:translateY(40px);}to{opacity:1;transform:translateY(0);}}
.round-summary-content{animation:rscFadeIn 0.6s 0.1s ease-out both;}
@keyframes rscFadeIn{from{opacity:0;filter:blur(8px);}to{opacity:1;filter:blur(0);}}
.round-summary-title{animation:rstSlide 0.5s 0.2s cubic-bezier(0.34,1.2,0.64,1) both;}
@keyframes rstSlide{from{opacity:0;transform:translateX(-30px);}to{opacity:1;transform:translateX(0);}}
.recap-game{animation:rgSlideIn 0.6s cubic-bezier(0.34,1.2,0.64,1) both;transform-origin:left;}
.recap-game:nth-child(1){animation-delay:0.3s;}
.recap-game:nth-child(2){animation-delay:0.4s;}
.recap-game:nth-child(3){animation-delay:0.5s;}
.recap-game:nth-child(4){animation-delay:0.6s;}
@keyframes rgSlideIn{from{opacity:0;transform:translateX(-40px);}to{opacity:1;transform:translateX(0);}}
.recap-game-name{animation:rgNamePop 0.5s 0.4s cubic-bezier(0.34,1.3,0.64,1) both;}
@keyframes rgNamePop{from{opacity:0;transform:scale(0.9);}to{opacity:1;transform:scale(1);}}
.recap-cover{animation:rcCoverFlip 0.6s cubic-bezier(0.68,-0.55,0.265,1.55) both;}
@keyframes rcCoverFlip{from{opacity:0;transform:rotateY(90deg) scale(0.8);}to{opacity:1;transform:rotateY(0) scale(1);}}
.recap-map{animation:rmMapReveal 0.8s 0.3s cubic-bezier(0.34,1.15,0.64,1) both;}
@keyframes rmMapReveal{from{opacity:0;filter:blur(10px);}to{opacity:1;filter:blur(0);}}
.recap-players{display:flex;flex-direction:column;gap:0.5rem;counter-reset:player-counter;}
.recap-player{animation:rpSlideUp 0.5s ease-out both;transform-origin:bottom;}
.recap-player:nth-child(1){animation-delay:0.6s;}
.recap-player:nth-child(2){animation-delay:0.7s;}
.recap-player:nth-child(3){animation-delay:0.8s;}
.recap-player:nth-child(4){animation-delay:0.9s;}
@keyframes rpSlideUp{from{opacity:0;transform:translateY(30px);}to{opacity:1;transform:translateY(0);}}
.recap-player:hover{transform:translateX(4px);box-shadow:0 0 20px rgba(168,85,247,0.4),inset 0 0 12px rgba(168,85,247,0.1);}
.recap-player-pts{animation:rppCountUp 0.8s 0.1s ease-out both;font-weight:800;}
@keyframes rppCountUp{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}
.recap-scores-total{animation:rstScroll 0.6s 0.8s ease-out both;}
@keyframes rstScroll{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}
.recap-score-item{animation:rsiReveal 0.5s ease-out both;}
.recap-score-item:nth-child(1){animation-delay:0.9s;}
.recap-score-item:nth-child(2){animation-delay:1s;}
.recap-score-item:nth-child(3){animation-delay:1.1s;}
.recap-score-item:nth-child(4){animation-delay:1.2s;}
@keyframes rsiReveal{from{opacity:0;transform:scale(0.8);}to{opacity:1;transform:scale(1);}}
.recap-score-item.is-me{animation:rsiMePulse 0.6s ease-out;}
@keyframes rsiMePulse{0%{transform:scale(1);}50%{transform:scale(1.08);}100%{transform:scale(1);}}
.next-round-btn{animation:nrbSlide 0.6s 1.2s cubic-bezier(0.34,1.2,0.64,1) both;}
@keyframes nrbSlide{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}

/* ============ ENDGAME RECAP ANIMATIONS ============ */
#endScreen{animation:esSlideUp 0.6s cubic-bezier(0.34,1.2,0.64,1);}
@keyframes esSlideUp{from{opacity:0;transform:translateY(50px);}to{opacity:1;transform:translateY(0);}}
.end-screen-content{animation:escFadeIn 0.6s 0.2s ease-out both;}
@keyframes escFadeIn{from{opacity:0;filter:blur(10px);}to{opacity:1;filter:blur(0);}}
.result-title{animation:rtSlide 0.6s 0.3s cubic-bezier(0.34,1.2,0.64,1) both;}
@keyframes rtSlide{from{opacity:0;transform:translateX(-40px);}to{opacity:1;transform:translateX(0);}}
.result-emoji{animation:reJump 0.6s 0.4s cubic-bezier(0.34,1.3,0.64,1) both;}
@keyframes reJump{0%{opacity:0;transform:scale(0) translateY(-30px);}60%{transform:scale(1.15);}100%{opacity:1;transform:scale(1) translateY(0);}}
.podium-row{animation:prPop 0.7s 0.5s cubic-bezier(0.34,1.3,0.64,1) both;}
@keyframes prPop{0%{opacity:0;transform:scale(0.5) translateY(30px);}60%{transform:scale(1.05);}100%{opacity:1;transform:scale(1) translateY(0);}}
.podium-base{animation:pbGrow 0.8s 0.55s ease-out both;}
@keyframes pbGrow{0%{opacity:0;transform:scaleY(0);}100%{opacity:1;transform:scaleY(1);}}
.podium-base.gold{animation:pbGoldShine 0.8s 0.55s ease-out both;}
@keyframes pbGoldShine{0%{opacity:0;transform:scaleY(0);box-shadow:none;}100%{opacity:1;transform:scaleY(1);box-shadow:0 0 20px rgba(251,191,36,0.6),inset 0 0 10px rgba(251,191,36,0.3);}}
.winner-crown{animation:wcSpin 1.2s 0.7s cubic-bezier(0.34,1.3,0.64,1) both;}
@keyframes wcSpin{0%{opacity:0;transform:scale(0) rotate(-45deg);}60%{transform:scale(1.2) rotate(10deg);}100%{opacity:1;transform:scale(1) rotate(0);}}
.player-card{animation:pcSlide 0.6s ease-out both;}
.podium-row .player-card:nth-child(1){animation-delay:0.6s;}
.podium-row .player-card:nth-child(2){animation-delay:0.65s;}
.podium-row .player-card:nth-child(3){animation-delay:0.7s;}
.other-players-row .player-card{animation-delay:calc(0.75s + 0.1s * var(--player-idx,0));}
@keyframes pcSlide{from{opacity:0;transform:translateY(40px);}to{opacity:1;transform:translateY(0);}}
.player-score{animation:psReveal 0.5s ease-out both;font-weight:800;}
.podium-row .player-card:nth-child(1) .player-score{animation-delay:0.75s;}
.podium-row .player-card:nth-child(2) .player-score{animation-delay:0.8s;}
.podium-row .player-card:nth-child(3) .player-score{animation-delay:0.85s;}
@keyframes psReveal{from{opacity:0;transform:scale(0.5);}to{opacity:1;transform:scale(1);}}
.player-card:hover{transform:translateY(-6px);box-shadow:0 12px 28px rgba(0,0,0,0.5),0 0 20px rgba(168,85,247,0.3);}
.action-buttons{animation:abSlide 0.6s 1s cubic-bezier(0.34,1.2,0.64,1) both;}
@keyframes abSlide{from{opacity:0;transform:translateY(30px);}to{opacity:1;transform:translateY(0);}}
.btn{transition:all 0.3s cubic-bezier(0.34,1.2,0.64,1);}
.btn:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(0,0,0,0.4),0 0 16px rgba(168,85,247,0.4);}
