.backdrop{background:radial-gradient(circle at 50% 20%,#3a175e 0%,#14264b 31%,#080d19 73%);animation:atmosphere 9s ease-in-out infinite alternate}
.backdrop:before{content:"";position:absolute;inset:-20%;background:conic-gradient(from 0deg at 50% 45%,transparent 0 12%,#6e3cff15 18%,transparent 25% 43%,#13e8ff18 49%,transparent 57% 72%,#ff3f9c10 79%,transparent 87%);filter:blur(30px);animation:aurora 25s linear infinite}
.backdrop:after{background-image:radial-gradient(#83eaff75 1px,transparent 2px),linear-gradient(#ffffff06 1px,transparent 1px),linear-gradient(90deg,#ffffff06 1px,transparent 1px);background-size:95px 95px,40px 40px,40px 40px;mask-image:linear-gradient(to bottom,#0009,#000 45%,transparent)}
@keyframes atmosphere{to{background:radial-gradient(circle at 50% 28%,#173c68 0%,#24204c 31%,#080d19 73%)}}@keyframes aurora{to{transform:rotate(360deg)}}
.brand-icon{background:linear-gradient(135deg,#17dbed33,#a278ff33);box-shadow:0 0 25px #5ee9f270,inset 0 0 15px #5ee9f240;animation:brandPulse 2s ease-in-out infinite alternate}@keyframes brandPulse{to{box-shadow:0 0 38px #bb74ffbb,inset 0 0 25px #5ee9f270;border-color:#b687ff;color:#fff}}
.brand strong{filter:drop-shadow(0 0 12px #4eeaff80)}.card{backdrop-filter:blur(12px);box-shadow:0 12px 30px #0005,inset 0 1px #ffffff1f}.board-bezel{background:linear-gradient(145deg,#314364,#111c34 42%,#253259);border-color:#9b7cf2;box-shadow:0 0 0 1px #59edff66,0 0 25px #66e9ff7a,0 0 95px #844dff72,0 30px 70px #000c;animation:bezelGlow 3s ease-in-out infinite alternate}.board-bezel:before{border:2px solid #67edff99;box-shadow:inset 0 0 20px #6aeaff55,0 0 25px #61dcff77}.board-bezel:after{content:"";position:absolute;inset:18px;pointer-events:none;background:repeating-linear-gradient(to bottom,#ffffff05 0px,#ffffff05 1px,transparent 2px,transparent 5px);mix-blend-mode:screen;border-radius:2px}@keyframes bezelGlow{to{box-shadow:0 0 0 1px #fe6ecb77,0 0 34px #da6bff9c,0 0 105px #3fcfff77,0 30px 70px #000c}}.board-bezel.detonate{animation:detonate .4s ease-out}@keyframes detonate{0%{filter:brightness(3);box-shadow:0 0 35px #fff,0 0 160px #fff,0 0 300px #ec73ff}30%{filter:brightness(1.8)}100%{filter:brightness(1)}}
.large-number{color:#fff;text-shadow:0 0 15px #6ce7ff99,0 0 35px #4dbbff66}.level-track div{box-shadow:0 0 15px #6eeeff}.primary-button{background:linear-gradient(100deg,#53eafa,#b586ff 53%,#fa73ca);box-shadow:0 0 18px #5de8ff99,0 0 45px #bd75ff7a;color:#071423}.primary-button:hover{background:linear-gradient(100deg,#9bfaff,#e1aaff 55%,#ffa9dd);box-shadow:0 0 35px #99eaff,0 0 70px #ce7bff}.toast{z-index:5;top:33%;font-size:38px;color:#fff;text-shadow:0 0 8px #fff,0 0 24px #54f4ff,0 0 50px #c175ff;letter-spacing:3px}.toast.show{animation:superToast 1.15s cubic-bezier(.16,1,.3,1)}@keyframes superToast{0%{opacity:0;transform:translate(-50%,20px) scale(.25) rotate(-8deg)}12%{opacity:1;transform:translate(-50%,0) scale(1.24) rotate(3deg)}26%{transform:translate(-50%,0) scale(.96) rotate(0)}72%{opacity:1;transform:translate(-50%,-9px) scale(1)}100%{opacity:0;transform:translate(-50%,-40px) scale(1.1)}}.board-footer i{animation:statusPulse 1.1s ease-in-out infinite alternate}@keyframes statusPulse{to{box-shadow:0 0 20px #5beed9;transform:scale(1.5)}}
@media(max-width:850px){.board-bezel:after{inset:9px}}@media(prefers-reduced-motion:reduce){.backdrop,.backdrop:before,.brand-icon,.board-bezel,.board-footer i{animation:none}}
.board-bezel.landed{animation:landingSnap .15s ease-out}@keyframes landingSnap{0%{transform:translate(0,0)}15%{transform:translate(-2px,3px)}42%{transform:translate(2px,-1px)}70%{transform:translate(-1px,0)}100%{transform:translate(0,0)}}
.board-bezel.detonate,.board-bezel.detonate.landed{animation:detonate .4s ease-out}
@media(prefers-reduced-motion:reduce){.board-bezel.landed,.board-bezel.detonate,.board-bezel.detonate.landed{animation:none}}
.board-bezel.delta-surge,.board-bezel.delta-surge.detonate{animation:deltaSurge .68s ease-out}
@keyframes deltaSurge{0%{filter:brightness(4);box-shadow:0 0 40px #fff,0 0 170px #79faff,0 0 300px #ffe591}28%{filter:brightness(1.9);box-shadow:0 0 30px #fff,0 0 115px #77f7ff,0 0 200px #ffe591}100%{filter:brightness(1)}}
.delta-hint-callout{position:fixed;z-index:85;left:max(12px,calc(50% - 585px));bottom:12px;width:min(480px,calc(100vw - 24px));height:245px;pointer-events:none;opacity:0}
.delta-hint-callout[hidden]{display:none}
.delta-hint-callout.show{animation:deltaSlideIn 1.7s cubic-bezier(.2,.8,.2,1) both}
.delta-hint-callout img{position:absolute;left:0;bottom:-20px;width:175px;height:265px;object-fit:contain;object-position:center top;filter:drop-shadow(0 0 24px #71f2ff)}
.delta-hint-callout strong{position:absolute;left:145px;bottom:95px;max-width:320px;padding:15px 20px;border:3px solid #d6fcff;border-radius:22px 22px 22px 4px;background:linear-gradient(115deg,#10264bf2,#3a2469f2);box-shadow:0 0 0 5px #66e9ff44,0 0 35px #76efffcc;color:#fff;font:900 clamp(20px,2.5vw,31px) 'Barlow Condensed','DM Sans',sans-serif;white-space:nowrap;text-shadow:0 0 15px #7bfaff}
@keyframes deltaSlideIn{0%{opacity:0;transform:translateX(-110%) scale(.92)}15%{opacity:1;transform:translateX(2%) scale(1.05)}23%,75%{opacity:1;transform:translateX(0) scale(1)}100%{opacity:0;transform:translateX(-12%) scale(.98)}}
@media(max-width:700px){.delta-hint-callout{height:180px;bottom:5px}.delta-hint-callout img{height:185px;width:125px;bottom:-15px}.delta-hint-callout strong{left:104px;bottom:70px;max-width:calc(100vw - 128px);padding:9px 11px;font-size:18px;white-space:normal}}
@media(prefers-reduced-motion:reduce){.board-bezel.delta-surge,.board-bezel.delta-surge.detonate{animation:none}.delta-hint-callout.show{animation:none;opacity:1}}