:root{--bg: #08080c;--panel: #101018;--line: rgba(255,255,255,.08);--neon-violet: #8b5cf6;--neon-cyan: #22e5ff;--neon-green: #39ff8f;--neon-red: #ff2d6d;--text: #f4f4f8;--text-dim: #7a7a8c;--pulse-duration: 1.7s;--pulse-color-dim: rgba(139,92,246,.45);--pulse-color-bright: rgba(139,92,246,1);--pulse-accent-color: rgba(34,229,255,.35);--bg-glow-1: rgba(139,92,246,.16);--bg-glow-2: rgba(34,229,255,.08);--content-max-width: clamp(460px, calc(340px + 30vw) , 1200px);--nav-bar-height: 60px;--nav-bar-clearance: 119px;--side-margin: calc((100vw - min(100vw, var(--content-max-width)))/2) ;--admin-top: var(--nav-bar-clearance)}@media (min-width: 500px){:root{--admin-top: 0px}}*{box-sizing:border-box}html,body,#root{min-height:100%}html{overflow-y:scroll;overflow-x:hidden}@property --bg-glow-1{syntax: "<color>"; inherits: true; initial-value: rgba(139,92,246,.16);}@property --bg-glow-2{syntax: "<color>"; inherits: true; initial-value: rgba(34,229,255,.08);}body{margin:0;background-color:var(--bg);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Cpath d='M9 7.5v3M7.5 9h3' stroke='%233a3a45' stroke-width='1' stroke-linecap='round'/%3E%3C/svg%3E"),radial-gradient(circle at 50% 0%,var(--bg-glow-1),transparent 45%),radial-gradient(circle at 80% 90%,var(--bg-glow-2),transparent 50%);background-repeat:repeat,no-repeat,no-repeat;background-size:18px 18px,auto,auto;background-position:0 0,center,center;transition:--bg-glow-1 .5s ease,--bg-glow-2 .5s ease;color:var(--text);font-family:Space Grotesk,sans-serif}.mono{font-family:JetBrains Mono,monospace}.app-shell{max-width:var(--content-max-width);margin:0 auto;padding:calc(var(--nav-bar-clearance) + 16px) 20px 24px;min-height:100vh;display:flex;flex-direction:column}.site-footer{margin-top:auto;padding-top:32px;text-align:center;max-height:100px;overflow:hidden;transition:opacity .8s ease,max-height .8s ease,padding-top .8s ease,transform .8s ease}.site-footer--collapsed{opacity:0;max-height:0;padding-top:0;transform:translateY(10px);pointer-events:none}.site-footer-links{display:flex;justify-content:center;flex-wrap:wrap;gap:4px;margin-bottom:10px}.footer-link{font-family:JetBrains Mono,monospace;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-dim);text-decoration:none;padding:6px 10px;border-radius:6px;transition:color .2s ease,background .2s ease}.footer-link:hover{color:var(--neon-cyan);background:#22e5ff14}.site-footer-copy{font-size:9px;color:var(--text-dim);opacity:.7}.panel{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:22px}.nav-bar{position:fixed;top:0;left:0;right:0;margin:0 auto;max-width:var(--content-max-width);padding:8px 20px;background:#08080cd9;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:4px;max-height:140px;overflow:hidden;z-index:55;transition:opacity .8s ease,max-height .8s ease,padding .8s ease,transform .8s ease}.nav-bar-links{display:flex;flex:1;min-width:0;flex-wrap:wrap;justify-content:center;align-items:center;gap:clamp(4px,1.5vw,28px)}.user-bar-name{display:inline-flex;align-items:center;gap:5px;font-family:JetBrains Mono,monospace;font-size:11px;font-weight:700;color:var(--text);padding:8px 6px 8px 4px;white-space:nowrap}.user-bar-streak{display:inline-flex;align-items:center;gap:2px;font-size:11px;font-weight:400;color:#ffd45e;white-space:nowrap}.nav-bar--collapsed{opacity:0;max-height:0;padding-top:0;padding-bottom:0;transform:translateY(-10px);pointer-events:none}.nav-link{display:inline-flex;align-items:center;justify-content:center;min-height:44px;box-sizing:border-box;font-family:JetBrains Mono,monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim);text-decoration:none;background:none;padding:0 10px;border-radius:8px;border:1px solid transparent;transition:color .2s ease,border-color .2s ease,background .2s ease}.nav-link:hover{color:var(--text);border-color:#8b5cf666;background:#8b5cf614}.nav-link.active{color:var(--neon-cyan);border-color:#22e5ff66;background:#22e5ff14}@media (max-width: 420px){.nav-link{padding:0 6px;font-size:10px;letter-spacing:.04em}.nav-bar-links{gap:3px}}h1,h2,h3{margin:0}h1,h2,h3,.hover-pop{display:inline-block;transition:transform .2s ease,filter .2s ease}h1:hover,h2:hover,h3:hover,.hover-pop:hover{transform:scale(1.045);filter:brightness(1.35)}.gradient-title{font-weight:700;background:linear-gradient(135deg,var(--neon-violet),var(--neon-cyan));-webkit-background-clip:text;background-clip:text;color:transparent}button{font-family:inherit;cursor:pointer}input{font-family:JetBrains Mono,monospace;background:#06060a;border:1px solid var(--line);border-radius:8px;padding:12px 14px;color:var(--text);font-size:14px;width:100%}input:focus{outline:none;border-color:var(--neon-violet)}.btn-primary{background:linear-gradient(135deg,var(--neon-violet),var(--neon-cyan));color:#08080c;font-weight:700;font-size:13px;letter-spacing:.05em;text-transform:uppercase;border:none;border-radius:10px;padding:14px 16px;width:100%;transition:transform .15s ease,box-shadow .2s ease}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 24px #8b5cf666}.btn-ghost{background:none;border:1px solid var(--line);color:var(--text-dim);border-radius:8px;padding:10px 14px;font-size:12px;transition:border-color .2s ease,color .2s ease}.btn-ghost:hover{border-color:var(--neon-cyan);color:var(--neon-cyan)}.spotlight{position:relative;z-index:0;overflow:hidden}.spotlight:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;background:radial-gradient(220px circle at var(--mx, 50%) var(--my, 50%),rgba(139,92,246,.16),transparent 70%);opacity:0;transition:opacity .35s ease;pointer-events:none}.spotlight:hover:before{opacity:1}.header-panel{overflow:hidden;max-height:220px;margin-bottom:20px;transition:opacity .8s ease,max-height .8s ease,margin-bottom .8s ease,padding-top .8s ease,padding-bottom .8s ease,transform .8s ease}.header-panel--collapsed{opacity:0;max-height:0;margin-bottom:0;padding-top:0;padding-bottom:0;transform:translateY(-12px);pointer-events:none}.bust-reveal-row{display:inline-block;position:relative;height:46px;min-width:260px}@keyframes bustedBounceIn{0%{transform:translate(-50%) scale(.3);opacity:0}55%{transform:translate(-50%) scale(1.08);opacity:1}75%{transform:translate(-50%) scale(.95)}to{transform:translate(-50%) scale(1);opacity:1}}.bust-busted{position:absolute;left:50%;top:0;font-weight:700;font-size:32px;line-height:1;color:var(--neon-red);white-space:nowrap;animation:bustedBounceIn .7s ease-out forwards}.bust-busted.settled{animation:none;transform:translate(-50%);transition:transform .9s cubic-bezier(.16,1,.3,1)}.bust-busted.settled.slid{transform:translate(calc(-100% - 5px))}@keyframes rarityInFromRight{0%{opacity:0;transform:translate(70px)}to{opacity:1;transform:translate(5px)}}.bust-rarity{position:absolute;left:50%;top:0;font-weight:700;font-size:32px;line-height:1;white-space:nowrap;animation:rarityInFromRight .9s cubic-bezier(.16,1,.3,1) forwards}.bust-rarity.instant{animation:none;opacity:1;transform:translate(5px)}@keyframes idlePulseGlow{0%,to{box-shadow:0 0 32px var(--pulse-color-dim);transform:scale(1)}50%{box-shadow:0 0 64px var(--pulse-color-bright),0 0 110px var(--pulse-accent-color);transform:scale(1.045)}}.push-btn{transition:transform .12s ease,box-shadow .25s ease,border-color .25s ease}.push-btn--playing{border:2px solid rgba(139,92,246,.6);box-shadow:0 0 30px #8b5cf666}.push-btn--dead{border:2px solid rgba(255,45,109,.5);box-shadow:0 0 35px #ff2d6d4d}.push-btn--idle-pulse{animation:idlePulseGlow var(--pulse-duration) ease-in-out infinite}.push-btn--playing:hover:not(:disabled){transform:scale(1.05);box-shadow:0 0 55px #8b5cf6bf;border-color:#8b5cf6f2}.push-btn--dead:hover:not(:disabled){box-shadow:0 0 55px #ff2d6db3;border-color:#ff2d6de6}.push-btn--playing:active:not(:disabled){transform:scale(.96)}@keyframes bustedSmolder{0%,to{box-shadow:0 0 28px #ff2d6d59;border-color:#ff2d6d73}50%{box-shadow:0 0 48px #ff2d6da6;border-color:#ff2d6db3}}.push-btn--busted-idle{animation:bustedSmolder 6s ease-in-out infinite}@keyframes buttonPoke{0%{transform:scale(1) rotate(0)}30%{transform:scale(.97) rotate(-1deg)}60%{transform:scale(1.01) rotate(.6deg)}to{transform:scale(1) rotate(0)}}.push-wrap--poke{animation:buttonPoke .22s ease-out}@keyframes particleBurst{0%{transform:translate(-50%,-50%) translate(var(--sx),var(--sy)) scale(1);opacity:1}to{transform:translate(-50%,-50%) translate(var(--dx),var(--dy)) scale(.15);opacity:0}}.particle-field{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.particle{position:absolute;top:50%;left:50%;width:9px;height:9px;border-radius:50%;pointer-events:none;animation:particleBurst var(--dur, .6s) ease-out forwards}.particle--debris{animation-timing-function:ease-in;border-radius:3px}@keyframes ringPulse{0%{transform:translate(-50%,-50%) scale(.82);opacity:.95}to{transform:translate(-50%,-50%) scale(1.6);opacity:0}}.pulse-ring{position:absolute;top:50%;left:50%;width:190px;height:190px;border-radius:50%;border:3px solid var(--ring-color, var(--neon-green));box-shadow:0 0 22px var(--ring-color, var(--neon-green));pointer-events:none;animation:ringPulse .6s ease-out forwards}@keyframes screenFlash{0%{opacity:.65}55%{opacity:.3}to{opacity:0}}.screen-flash{position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 50% 42%,rgba(255,255,255,.55),var(--neon-red) 38%,var(--neon-red) 100%);mix-blend-mode:screen;pointer-events:none;z-index:9999;animation:screenFlash .55s ease-out forwards}@keyframes screenShake{0%{transform:translate(0) rotate(0)}20%{transform:translate(calc(-1 * var(--shake-amount, 6px)),calc(var(--shake-amount, 6px) * .5)) rotate(-.6deg)}40%{transform:translate(var(--shake-amount, 6px),calc(-1 * var(--shake-amount, 6px) * .6)) rotate(.6deg)}60%{transform:translate(calc(-.6 * var(--shake-amount, 6px)),calc(.5 * var(--shake-amount, 6px))) rotate(-.35deg)}80%{transform:translate(calc(.35 * var(--shake-amount, 6px)),calc(-.35 * var(--shake-amount, 6px))) rotate(.15deg)}to{transform:translate(0) rotate(0)}}.screen-shake{animation:screenShake .5s ease-out}.crack-overlay{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;clip-path:circle(50%)}.crack-overlay path{fill:none;stroke:#fff3ea;stroke-width:1.3;stroke-linecap:round;filter:drop-shadow(0 0 2px rgba(255,60,60,.95)) drop-shadow(0 0 6px rgba(255,45,60,.65))}.push-btn-label{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;pointer-events:none;font-weight:700;font-size:16px;letter-spacing:.06em;text-transform:uppercase;color:var(--text);text-shadow:0 0 10px rgba(0,0,0,.9),0 0 3px rgba(0,0,0,.9);background:radial-gradient(circle,rgba(16,16,24,.75) 0%,rgba(16,16,24,.4) 45%,transparent 68%)}.badge-toast-stack{position:absolute;right:12px;display:flex;flex-direction:column;gap:10px;z-index:54;width:clamp(100px,calc(var(--side-margin) - 12px),120px)}@keyframes badgeSlideIn{0%{opacity:0;transform:translate(60px)}to{opacity:1;transform:translate(0)}}.badge-toast-banner{font-family:JetBrains Mono,monospace;font-size:clamp(7px,1.6vw,10px);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--neon-cyan);text-align:center;margin-bottom:2px;animation:badgeSlideIn .6s cubic-bezier(.16,1,.3,1) both}.badge-toast-banner.instant{animation:none;opacity:1;transform:translate(0)}.badge-toast{position:relative;display:flex;align-items:center;gap:6px;background:var(--panel);border:1px solid rgba(255,212,94,.5);border-radius:10px;--badge-toast-pad: clamp(4px, 1.5vw, 8px);padding:var(--badge-toast-pad);box-shadow:0 0 20px #ffd45e40;animation:badgeSlideIn .6s cubic-bezier(.16,1,.3,1) both;transition:transform .15s ease,box-shadow .15s ease}.badge-toast.instant{animation:none;opacity:1;transform:translate(0)}.badge-toast:hover{transform:scale(1.05);box-shadow:0 6px 20px #00000059,0 0 20px #ffd45e40}.badge-toast:hover .badge-toast-sub{color:var(--text)}.badge-toast-col{flex:1;min-width:0;display:flex;flex-direction:column;gap:0px}.badge-toast-pill-row{display:flex;justify-content:flex-end;align-items:flex-start}.badge-toast-icon{flex-shrink:0}.badge-toast-sub{font-family:JetBrains Mono,monospace;font-size:8px;color:var(--text-dim);text-transform:uppercase;letter-spacing:.03em;white-space:nowrap;transition:color .2s ease;line-height:1;margin-top:-3.5px;max-width:100%;overflow:hidden;text-overflow:ellipsis}.badge-card{position:relative;transition:transform .2s ease,box-shadow .2s ease}.badge-card:hover,.badge-card--expanded{transform:scale(1.05);box-shadow:0 6px 20px #00000059;z-index:1}.badge-rarity{display:inline-block;font-family:JetBrains Mono,monospace;font-size:7px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:2px 5px;border-radius:6px;line-height:1.4;color:var(--rarity-color, #9ca3af);border:1px solid var(--rarity-color, #9ca3af);background:#00000059;white-space:nowrap}.badge-rarity-corner{position:absolute;top:-8px;right:-8px}.badge-toast-stack .badge-rarity{font-size:6px;padding:1px 4px;line-height:1;position:relative;top:calc(-1 * (var(--badge-toast-pad) - 2px));right:calc(-1 * (var(--badge-toast-pad) - 2px) + .9px)}.badge-card-hint{max-height:0;opacity:0;margin-top:0;overflow:hidden;color:var(--text-dim);transition:max-height .3s ease,opacity .25s ease,margin-top .3s ease,color .2s ease}.badge-card:hover .badge-card-hint,.badge-card--expanded .badge-card-hint{max-height:60px;opacity:1;margin-top:4px;color:var(--text)}.leaderboard-row{transition:transform .15s ease,filter .15s ease,background .15s ease;cursor:default}.leaderboard-row:hover{transform:translate(4px);filter:brightness(1.2)}@keyframes pageEnter{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}.page-transition{animation:pageEnter .4s cubic-bezier(.16,1,.3,1)}