body,html{background:#050510 0 0/200% 200%;width:100%;height:100%;margin:0;padding:0;animation:20s infinite bgPulse;overflow:hidden}@keyframes bgPulse{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}canvas{display:block}#join-screen,#game-over{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:1000;background:#05050ae6;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;font-family:Courier New,Courier,monospace;animation:.5s ease-out forwards fadeIn;display:flex;position:absolute;top:0;left:0}@keyframes fadeIn{0%{opacity:0;transform:scale(1.05)}to{opacity:1;transform:scale(1)}}#join-screen h1,#game-over h1{color:#fff;text-shadow:0 0 10px #f0a,0 0 20px #f0a,0 0 40px #f0a,0 0 80px #f0a;letter-spacing:4px;margin-bottom:.5rem;font-size:5rem}#join-screen p{color:#00e5ff;text-shadow:0 0 10px #00e5ff80;letter-spacing:2px;margin-bottom:2rem;font-size:1.5rem}.color-options{background:#ffffff08;border:1px solid #ffffff1a;border-radius:20px;grid-template-columns:repeat(4,1fr);place-items:center;gap:1.5rem;margin-bottom:3rem;padding:1.5rem 2.5rem;display:grid;box-shadow:inset 0 0 20px #00000080}.color-btn{cursor:pointer;border:3px solid #0000;border-radius:50%;width:50px;height:50px;transition:all .3s cubic-bezier(.175,.885,.32,1.275);box-shadow:0 0 15px #00000080}.color-btn:hover{transform:scale(1.15)}.color-btn.selected{z-index:2;border-color:#fff;transform:scale(1.3);box-shadow:0 0 25px,0 0 50px}.custom-color-wrapper{width:50px;height:50px;position:relative}.custom-color-wrapper .custom-btn{position:absolute;top:0;left:0}#custom-color{opacity:0;cursor:pointer;z-index:3;width:100%;height:100%;position:absolute;top:0;left:0}#join-btn,#game-over button{color:#39ff14;cursor:pointer;text-shadow:0 0 10px #39ff14;text-transform:uppercase;letter-spacing:2px;background:0 0;border:2px solid #39ff14;border-radius:8px;padding:1.2rem 4rem;font-size:1.8rem;font-weight:700;transition:all .3s;box-shadow:0 0 15px #39ff1433,inset 0 0 15px #39ff1433}#game-over button{color:#00e5ff;text-shadow:0 0 10px #00e5ff;border-color:#00e5ff;box-shadow:0 0 15px #00e5ff33,inset 0 0 15px #00e5ff33}#join-btn:hover{color:#000;background:#39ff14;transform:translateY(-2px);box-shadow:0 0 40px #39ff14,inset 0 0 20px #39ff14}#game-over button:hover{color:#000;background:#00e5ff;transform:translateY(-2px);box-shadow:0 0 40px #00e5ff,inset 0 0 20px #00e5ff}#leaderboard{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);color:#fff;z-index:100;pointer-events:none;background:#0a0a14b3;border:1px solid #00e5ff4d;border-radius:12px;width:250px;padding:1rem;font-family:Courier New,Courier,monospace;position:absolute;top:20px;right:20px;box-shadow:0 0 15px #00000080}#leaderboard h2{color:#00e5ff;text-shadow:0 0 5px #00e5ff;text-align:center;letter-spacing:2px;border-bottom:1px solid #00e5ff4d;margin:0 0 10px;padding-bottom:5px;font-size:1.2rem}#leaderboard ul{margin:0;padding:0;list-style:none}#leaderboard li{justify-content:space-between;align-items:center;margin-bottom:8px;font-size:.9rem;display:flex}#leaderboard li:last-child{margin-bottom:0}#leaderboard .rank{color:#ffffff80;width:25px}#leaderboard .swatch{border-radius:50%;width:12px;height:12px;margin-right:10px}#leaderboard .id{text-overflow:ellipsis;white-space:nowrap;flex-grow:1;overflow:hidden}#leaderboard .score{color:#39ff14;text-shadow:0 0 5px #39ff14;font-weight:700}.toast-message{color:#fff;z-index:9999;cursor:pointer;background:#ff00aae6;border-radius:8px;padding:10px 20px;font-family:Courier New,Courier,monospace;font-size:1.1rem;font-weight:700;transition:opacity .3s;animation:.3s ease-out slideUp;position:fixed;bottom:20px;left:50%;transform:translate(-50%)translateY(0);box-shadow:0 0 15px #ff00aa80}@keyframes slideUp{0%{opacity:0;transform:translate(-50%)translateY(50px)}to{opacity:1;transform:translate(-50%)translateY(0)}}@media (width<=768px){#join-screen h1,#game-over h1{letter-spacing:2px;text-align:center;font-size:2.5rem}#join-screen p{font-size:1.2rem}.color-options{gap:1rem;max-width:90vw;padding:1rem}.color-btn,.custom-color-wrapper{width:40px;height:40px}#join-btn,#game-over button{padding:1rem 2.5rem;font-size:1.2rem}}