@import"https://fonts.googleapis.com/css2?family=Quicksand:wght@400;500;600;700&family=Handjet:wght@400;500;600;700;800&family=Orbitron:wght@400;700;900&display=swap";.particles-background{position:fixed;width:100%;height:100%;top:0;left:0;z-index:-2;background:radial-gradient(ellipse at center,#053339 0%,#021619 70%,#000000 100%)}.particles-canvas{position:fixed;width:100%;height:100%;top:0;left:0;z-index:-1;pointer-events:none}.particles-background:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 20% 30%,rgba(0,245,160,.1) 0%,transparent 50%),radial-gradient(circle at 80% 70%,rgba(0,217,245,.08) 0%,transparent 50%),radial-gradient(circle at 40% 80%,rgba(0,168,245,.06) 0%,transparent 50%);animation:floatBackground 20s ease-in-out infinite}:root{--primary-gradient: linear-gradient(135deg, #00f5a0 0%, #00d9f5 100%);--secondary-gradient: linear-gradient(135deg, #00d9f5 0%, #00a8f5 100%);--accent-gradient: linear-gradient( 135deg, #00f5a0 0%, #00ff95 50%, #00d9f5 100% );--bg-primary: radial-gradient( ellipse at center, #053339 0%, #021619 70%, #000000 100% );--bg-secondary: radial-gradient(ellipse at top, #186a5e 0%, #053339 100%);--bg-glass: rgba(255, 255, 255, .08);--text-primary: #ffffff;--text-secondary: #c1e2dd;--text-accent: #00ffea;--text-glow: #00f5a0;--shadow-soft: 0 8px 32px rgba(0, 245, 160, .15);--shadow-medium: 0 15px 45px rgba(0, 217, 245, .25);--shadow-large: 0 25px 60px rgba(0, 168, 245, .35);--shadow-glow: 0 0 40px rgba(0, 245, 160, .5);--radius-sm: 12px;--radius-md: 20px;--radius-lg: 30px;--radius-xl: 50px;--transition-fast: .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: .6s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;margin:0;padding:0}body{margin:0;font-family:Quicksand,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--bg-primary);color:var(--text-primary);min-height:100vh;overflow-x:hidden;position:relative}#particles-js{position:fixed;width:100%;height:100%;top:0;left:0;z-index:-1;background:var(--bg-primary)}.result-modal{border:none;border-radius:var(--radius-lg);padding:3rem;background:rgba(255,255,255,.95);-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);border:1px solid rgba(0,245,160,.3);color:#053339;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);max-width:90vw;width:600px;max-height:90vh;overflow-y:auto;z-index:1000}.result-modal:before{content:"";position:absolute;top:0;left:0;right:0;height:6px;background:var(--primary-gradient)}.result-modal[open]{animation:modalEntrance .5s cubic-bezier(.34,1.56,.64,1)}@keyframes modalEntrance{0%{opacity:0;transform:translate(-50%,-50%) scale(.9)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}.result-modal::backdrop{background:rgba(0,0,0,.8);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.result-modal h2{font-family:Orbitron,monospace;margin:0 0 1rem;font-size:3.5rem;text-transform:uppercase;background:var(--primary-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-align:center}.result-modal progress{width:100%;height:2rem;margin:1.5rem 0;border-radius:var(--radius-xl);overflow:hidden;border:2px solid rgba(0,245,160,.3)}.result-modal progress::-webkit-progress-bar{background:rgba(0,0,0,.1);border-radius:var(--radius-xl)}.result-modal progress::-webkit-progress-value{background:var(--primary-gradient);border-radius:var(--radius-xl);transition:all 1s cubic-bezier(.34,1.56,.64,1)}.result-modal p{margin:1rem 0;font-size:1.3rem;text-align:center;font-weight:500}.result-modal p strong{color:#00a8f5;text-shadow:0 0 10px rgba(0,168,245,.3)}.result-modal form{text-align:center;margin-top:2rem}.result-modal button{margin-top:1rem;padding:1rem 2rem;border:none;border-radius:var(--radius-sm);background:var(--primary-gradient);color:#061e1a;font-size:1.2rem;font-weight:700;cursor:pointer;transition:all var(--transition-fast);position:relative;overflow:hidden}.result-modal button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .6s ease}.result-modal button:hover:before{left:100%}.result-modal button:hover{background:var(--accent-gradient);transform:translateY(-2px);box-shadow:0 8px 25px #00f5a066}#content{max-width:70rem;margin:3rem auto;padding:3rem;background:var(--bg-glass);-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);border:1px solid rgba(0,245,160,.2);border-radius:var(--radius-lg);box-shadow:var(--shadow-large);position:relative;overflow:hidden;animation:contentEntrance 1.2s cubic-bezier(.34,1.56,.64,1)}#content:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(0,245,160,.05),transparent);transition:left .8s ease}#content:hover:before{left:100%}@keyframes contentEntrance{0%{opacity:0;transform:translateY(50px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}h1{font-family:Orbitron,monospace;text-align:center;text-transform:uppercase;color:var(--text-primary);text-shadow:0 0 20px var(--text-glow),0 0 40px rgba(0,245,160,.5),0 0 60px rgba(0,217,245,.3);font-size:4.5rem;font-weight:900;margin:0 0 1rem;letter-spacing:.3rem;background:var(--primary-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:titlePulse 3s ease-in-out infinite;position:relative}@keyframes titlePulse{0%,to{text-shadow:0 0 20px var(--text-glow),0 0 40px rgba(0,245,160,.5),0 0 60px rgba(0,217,245,.3);transform:scale(1)}50%{text-shadow:0 0 30px var(--text-glow),0 0 60px rgba(0,245,160,.7),0 0 90px rgba(0,217,245,.5);transform:scale(1.02)}}h1 em{font-style:normal;background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:accentGlow 2s ease-in-out infinite alternate}@keyframes accentGlow{0%{text-shadow:0 0 10px #00ffea,0 0 20px rgba(0,255,234,.5)}to{text-shadow:0 0 20px #00ffea,0 0 40px rgba(0,255,234,.7),0 0 60px rgba(0,255,234,.4)}}header p{font-size:1.4rem;margin:0;text-align:center;color:var(--text-secondary);font-weight:500;letter-spacing:.05rem;text-shadow:0 0 10px rgba(193,226,221,.5)}#player{text-align:center;margin:3rem 0;padding:2rem;background:rgba(0,0,0,.3);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:var(--radius-md);border:1px solid rgba(0,245,160,.1);box-shadow:var(--shadow-soft);position:relative;overflow:hidden}#player:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--primary-gradient);animation:borderFlow 3s linear infinite}@keyframes borderFlow{0%{background-position:0% 50%}to{background-position:100% 50%}}#player h2{color:var(--text-accent);font-size:1.8rem;margin-bottom:1.5rem;text-shadow:0 0 15px rgba(0,255,234,.5);font-weight:600}#player p{display:flex;justify-content:center;align-items:center;gap:0}#player input{font:inherit;border:2px solid rgba(0,245,160,.3);background:rgba(25,47,43,.8);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:var(--radius-sm);border-top-right-radius:0;border-bottom-right-radius:0;padding:1rem 1.5rem;color:var(--text-primary);font-size:1.1rem;transition:all var(--transition-fast);min-width:300px}#player input:focus{outline:none;border-color:var(--text-accent);box-shadow:0 0 20px #00ffea4d;background:rgba(25,47,43,.9)}#player button{cursor:pointer;background:var(--primary-gradient);border:2px solid transparent;padding:1rem 2rem;color:#061e1a;border-top-right-radius:var(--radius-sm);border-bottom-right-radius:var(--radius-sm);font-weight:700;font-size:1.1rem;transition:all var(--transition-fast);position:relative;overflow:hidden}#player button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .6s ease}#player button:hover:before{left:100%}#player button:hover{background:var(--secondary-gradient);transform:translateY(-2px);box-shadow:var(--shadow-glow)}#challenges{max-width:60rem;margin:4rem auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2.5rem;perspective:1000px}.challenge{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2.5rem;background:rgba(255,255,255,.1);-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);border:1px solid rgba(0,245,160,.2);color:var(--text-primary);box-shadow:var(--shadow-medium);border-radius:var(--radius-lg);position:relative;overflow:hidden;transition:all var(--transition-slow);animation:challengeEntrance .8s cubic-bezier(.34,1.56,.64,1) forwards;opacity:0;transform:translateY(30px) rotateX(-10deg)}.challenge:nth-child(1){animation-delay:.1s}.challenge:nth-child(2){animation-delay:.2s}.challenge:nth-child(3){animation-delay:.3s}.challenge:nth-child(4){animation-delay:.4s}@keyframes challengeEntrance{to{opacity:1;transform:translateY(0) rotateX(0)}}.challenge:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--primary-gradient);transform:scaleX(0);transition:transform var(--transition-slow)}.challenge:hover:before{transform:scaleX(1)}.challenge:hover{transform:translateY(-10px) scale(1.02);box-shadow:var(--shadow-large);border-color:#00f5a066}.challenge button{margin-top:1.5rem;padding:1rem 2rem;border:none;border-radius:var(--radius-sm);background:var(--primary-gradient);color:#061e1a;font-size:1.2rem;font-weight:700;cursor:pointer;transition:all var(--transition-fast);position:relative;overflow:hidden;z-index:1}.challenge button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .6s ease}.challenge button:hover:before{left:100%}.challenge button:hover{background:var(--accent-gradient);transform:translateY(-3px);box-shadow:0 10px 30px #00f5a066}.challenge h2{font-size:1.6rem;letter-spacing:.1em;margin:0 0 1rem;text-align:center;text-transform:uppercase;color:var(--text-primary);font-weight:700;text-shadow:0 0 10px rgba(255,255,255,.5)}.challenge-time{border:2px solid rgba(0,245,160,.5);border-radius:var(--radius-sm);padding:.5rem 1rem;margin:1rem 0;background:rgba(0,0,0,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font-weight:600;color:var(--text-accent);text-shadow:0 0 10px rgba(0,255,234,.5)}.challenge .active{animation:challengePulse 2s ease-in-out infinite;border-color:#00f5a0cc;box-shadow:0 0 30px #00f5a066}@keyframes challengePulse{0%,to{box-shadow:0 0 30px #00f5a066;transform:scale(1)}50%{box-shadow:0 0 50px #00f5a0cc;transform:scale(1.02)}}::-webkit-scrollbar{width:12px}::-webkit-scrollbar-track{background:rgba(0,0,0,.2);border-radius:6px}::-webkit-scrollbar-thumb{background:var(--primary-gradient);border-radius:6px;border:2px solid rgba(0,0,0,.2)}::-webkit-scrollbar-thumb:hover{background:var(--accent-gradient)}@media (max-width: 768px){#content{margin:1rem;padding:2rem}h1{font-size:2.5rem}#challenges{grid-template-columns:1fr;gap:1.5rem}.challenge{padding:2rem}#player input{min-width:200px}.result-modal{padding:2rem;width:95vw}.result-modal h2{font-size:2.5rem}}@keyframes floatBackground{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}