@import"https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&family=Rajdhani:wght@300;500;700&display=swap";html,body,#root{width:100%;height:100%;overflow:hidden}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{margin:0;padding:0;box-sizing:border-box}:root{--bg-dark: #0a0a0f;--bg-gradient-1: #1a1a2e;--bg-gradient-2: #16213e;--accent-cyan: #00fff5;--accent-pink: #ff00ff;--accent-purple: #7b2cbf;--text-light: #e0e0e0;--glass-bg: rgba(255, 255, 255, .05);--glass-border: rgba(255, 255, 255, .1)}body{font-family:Rajdhani,sans-serif;background:var(--bg-dark);overflow:hidden}.app{width:100vw;height:100vh;position:relative;overflow:hidden}.background-gradient{position:absolute;inset:0;background:radial-gradient(ellipse at 20% 20%,rgba(123,44,191,.15) 0%,transparent 50%),radial-gradient(ellipse at 80% 80%,rgba(0,255,245,.1) 0%,transparent 50%),radial-gradient(ellipse at 50% 50%,rgba(255,0,255,.05) 0%,transparent 70%),linear-gradient(180deg,var(--bg-dark) 0%,var(--bg-gradient-1) 50%,var(--bg-gradient-2) 100%);animation:backgroundPulse 8s ease-in-out infinite}@keyframes backgroundPulse{0%,to{opacity:1}50%{opacity:.8}}.shapes-container{position:absolute;inset:0;pointer-events:none}.shape{position:absolute;cursor:pointer;pointer-events:auto;transition:transform .2s ease;animation:float var(--float-duration, 3s) ease-in-out infinite,fadeIn .5s ease-out;filter:drop-shadow(0 0 10px var(--shape-color))}.shape:hover{transform:scale(1.15) rotate(10deg);filter:drop-shadow(0 0 20px var(--shape-color)) brightness(1.2);z-index:100}.shape.destroying{animation:destroy .4s ease-out forwards}@keyframes float{0%,to{transform:translateY(0) rotate(var(--rotation, 0deg))}50%{transform:translateY(-15px) rotate(calc(var(--rotation, 0deg) + 5deg))}}@keyframes fadeIn{0%{opacity:0;transform:scale(0) rotate(0)}to{opacity:1;transform:scale(1) rotate(var(--rotation, 0deg))}}@keyframes destroy{0%{transform:scale(1);opacity:1}50%{transform:scale(1.3);opacity:.8}to{transform:scale(0);opacity:0}}.shape.circle{border-radius:50%;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.4),var(--shape-color) 60%)}.shape.square{border-radius:8px;background:linear-gradient(135deg,rgba(255,255,255,.3),var(--shape-color) 50%);transform:rotate(var(--rotation, 0deg))}.shape.triangle{width:0!important;height:0!important;background:transparent!important;border-left:calc(var(--size, 50px) / 2) solid transparent;border-right:calc(var(--size, 50px) / 2) solid transparent;border-bottom:calc(var(--size, 50px) * .866) solid var(--shape-color);filter:drop-shadow(0 0 10px var(--shape-color))}.shape.triangle{--size: 60px}.shape.diamond{background:linear-gradient(135deg,rgba(255,255,255,.4) 0%,var(--shape-color) 50%,rgba(0,0,0,.2) 100%);transform:rotate(45deg);border-radius:4px}.shape.hexagon{background:var(--shape-color);clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%)}.shape.hexagon:before{content:"";position:absolute;inset:3px;background:linear-gradient(135deg,rgba(255,255,255,.3),transparent 60%);clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%)}.shape.star,.shape.pentagon{background:transparent}.shape-svg{width:100%;height:100%;filter:drop-shadow(0 0 5px var(--shape-color))}.particles{position:absolute;inset:0;pointer-events:none}.particle{position:absolute;width:8px;height:8px;border-radius:50%;top:50%;left:50%;animation:particleExplode .4s ease-out forwards}@keyframes particleExplode{0%{transform:translate(-50%,-50%) rotate(var(--angle)) translateY(0);opacity:1}to{transform:translate(-50%,-50%) rotate(var(--angle)) translateY(-80px);opacity:0}}.ui-overlay{position:fixed;inset:0;pointer-events:none;z-index:1000}.counter-container{position:absolute;top:30px;left:50%;transform:translate(-50%);pointer-events:auto}.counter-glow{position:absolute;inset:-10px;background:radial-gradient(ellipse,var(--accent-cyan) 0%,transparent 70%);opacity:.3;filter:blur(15px);animation:counterGlow 2s ease-in-out infinite}@keyframes counterGlow{0%,to{opacity:.3;transform:scale(1)}50%{opacity:.5;transform:scale(1.1)}}.counter{position:relative;background:var(--glass-bg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:20px;padding:15px 40px;display:flex;flex-direction:column;align-items:center;gap:5px;box-shadow:0 0 30px #00fff533,inset 0 0 30px #ffffff0d}.counter-label{font-family:Orbitron,sans-serif;font-size:12px;font-weight:400;color:var(--accent-cyan);letter-spacing:4px;text-transform:uppercase}.counter-value{font-family:Orbitron,sans-serif;font-size:56px;font-weight:900;background:linear-gradient(135deg,var(--accent-cyan),var(--accent-pink));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:0 0 30px rgba(0,255,245,.5);line-height:1}.controls{position:absolute;bottom:30px;left:50%;transform:translate(-50%);display:flex;gap:15px;pointer-events:auto}.control-btn{font-family:Rajdhani,sans-serif;font-size:16px;font-weight:700;padding:12px 24px;border:1px solid var(--glass-border);border-radius:12px;background:var(--glass-bg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);color:var(--text-light);cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:1px}.control-btn:hover{background:#ffffff1a;border-color:var(--accent-cyan);box-shadow:0 0 20px #00fff54d;transform:translateY(-2px)}.control-btn.active{border-color:var(--accent-pink);box-shadow:0 0 20px #ff00ff4d}.control-btn.add-btn:hover{border-color:#4ecdc4;box-shadow:0 0 20px #4ecdc466}.control-btn.clear-btn:hover{border-color:#ff6b6b;box-shadow:0 0 20px #ff6b6b66}.instructions{position:absolute;bottom:100px;left:50%;transform:translate(-50%);pointer-events:none}.instructions p{font-family:Rajdhani,sans-serif;font-size:18px;font-weight:300;color:#ffffff80;text-transform:uppercase;letter-spacing:3px;animation:instructionPulse 3s ease-in-out infinite}@keyframes instructionPulse{0%,to{opacity:.5}50%{opacity:.8}}@media(max-width:768px){.counter-value{font-size:42px}.controls{flex-direction:column;gap:10px}.control-btn{padding:10px 20px;font-size:14px}.instructions p{font-size:14px}}