.confetti-container{position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:9999;overflow:hidden;animation:confettiFadeIn .3s ease-in}@keyframes confettiFadeIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.confetti-container:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at center,rgba(255,255,255,.1) 0%,transparent 70%);pointer-events:none;z-index:1}@media (max-width: 768px){.confetti-container{transform:scale(.8)}}.confetti-container canvas{position:absolute!important;top:0!important;left:0!important;z-index:10000!important}.ruleta-container{display:flex;flex-direction:column;align-items:center;gap:1rem}.controls-section{display:flex;align-items:center;gap:2rem;justify-content:center;flex-wrap:wrap}.ruleta-wrapper{position:relative;width:500px;height:500px;margin:1rem auto;display:flex;align-items:center;justify-content:center}.ruleta-svg{width:100%;height:100%;transition:transform 3s cubic-bezier(.17,.67,.12,.99);filter:drop-shadow(0 0 20px rgba(0,0,0,.3))}.ruleta-svg.spinning{transition:transform 3s cubic-bezier(.17,.67,.12,.99)}.pointer-container{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:10}.segment-path{transition:all .3s ease}.segment-path:hover{filter:brightness(1.1)}.segment-text{font-family:Arial,sans-serif;font-size:16px;font-weight:700;fill:#fff;text-shadow:1px 1px 2px rgba(0,0,0,.8);pointer-events:none;-webkit-user-select:none;user-select:none}.pointer{transform-origin:250px 37px;animation:pulse 2s infinite}.girar-btn{background:linear-gradient(45deg,#ff6b6b,#ff8e8e);color:#fff;border:none;padding:.8rem 1.5rem;font-size:1.1rem;font-weight:700;border-radius:50px;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #ff6b6b66;text-transform:uppercase;letter-spacing:1px}.girar-btn:hover:not(.disabled){transform:translateY(-2px);box-shadow:0 6px 20px #ff6b6b99;background:linear-gradient(45deg,#ff5252,#ff7979)}.girar-btn:active:not(.disabled){transform:translateY(0);box-shadow:0 2px 10px #ff6b6b66}.girar-btn.disabled{opacity:.6;cursor:not-allowed;background:linear-gradient(45deg,#bdc3c7,#95a5a6);box-shadow:none}.resultado{background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:1.5rem;border-radius:20px;box-shadow:0 10px 30px #0003;animation:slideInUp .5s ease-out;max-width:400px;text-align:center}.resultado h2{color:#2c3e50;margin-bottom:1rem;font-size:1.5rem}.resultado p{color:#34495e;font-size:1.1rem;line-height:1.5}.resultado strong{color:#e74c3c;font-size:1.2rem}@keyframes slideInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.spins-counter{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;padding:1rem;box-shadow:0 4px 15px #667eea4d;border:2px solid rgba(255,255,255,.2);min-width:200px}.spins-info{display:flex;align-items:center;justify-content:space-between;gap:1.5rem}.spins-left{display:flex;flex-direction:column;align-items:center;text-align:center}.spins-number{font-size:2rem;font-weight:700;color:#fff;text-shadow:2px 2px 4px rgba(0,0,0,.3);line-height:1}.spins-label{font-size:.8rem;color:#ffffffe6;font-weight:600;margin-top:.3rem;text-shadow:1px 1px 2px rgba(0,0,0,.3)}.spins-progress{flex:1;display:flex;flex-direction:column;gap:.5rem}.progress-bar{width:100%;height:6px;background:#fff3;border-radius:3px;overflow:hidden;box-shadow:inset 0 1px 3px #0003}.progress-fill{height:100%;background:linear-gradient(90deg,#ff6b6b,#ff8e8e);border-radius:4px;transition:width .3s ease;box-shadow:0 1px 3px #ff6b6b66}.progress-text{font-size:.7rem;color:#fffc;text-align:center;font-weight:500}.girar-btn.no-spins{background:linear-gradient(45deg,#bdc3c7,#95a5a6);cursor:not-allowed;box-shadow:none;opacity:.6}.girar-btn.no-spins:hover{transform:none;box-shadow:none;background:linear-gradient(45deg,#bdc3c7,#95a5a6)}@media (min-width: 1024px) and (max-width: 1366px){.ruleta-container{gap:.8rem}.ruleta-wrapper{width:650px;height:650px;margin:.5rem auto}.controls-section{gap:1.5rem}.spins-counter{padding:.8rem;min-width:180px}.spins-info{gap:1rem}.spins-number{font-size:1.8rem}.spins-label{font-size:.75rem}.girar-btn{padding:.7rem 1.2rem;font-size:1rem}.segment-text{font-size:14px}}@media (max-width: 768px){.ruleta-wrapper{width:500px;height:500px}.segment-text{font-size:12px}.App-header h1{font-size:2rem}.controls-section{flex-direction:column;gap:1rem}.girar-btn{padding:.8rem 1.5rem;font-size:1rem}.spins-counter{padding:1rem;min-width:250px}.spins-info{flex-direction:column;gap:1rem;text-align:center}.spins-number{font-size:2rem}.spins-label{font-size:.8rem}.progress-text{font-size:.7rem}}@media (max-width: 480px){.ruleta-wrapper{width:250px;height:250px}.segment-text{font-size:10px}}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000c;display:flex;justify-content:center;align-items:center;z-index:1000;animation:fadeIn .3s ease-out}.modal-content{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:20px;padding:2rem;max-width:500px;width:90%;box-shadow:0 20px 40px #0000004d;animation:slideIn .3s ease-out;border:2px solid rgba(255,255,255,.2)}.modal-header{text-align:center;margin-bottom:2rem}.modal-header h2{color:#fff;font-size:1.8rem;margin:0;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.modal-form{display:flex;flex-direction:column;gap:1.5rem}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-group label{color:#fff;font-weight:600;font-size:1.1rem;text-shadow:1px 1px 2px rgba(0,0,0,.3)}.form-group input{padding:1rem;border:none;border-radius:10px;font-size:1.1rem;background:#ffffffe6;transition:all .3s ease;outline:none}.form-group input:focus{background:#fff;box-shadow:0 0 0 3px #ffffff4d;transform:translateY(-2px)}.form-group input.error{border:2px solid #ff6b6b;background:#ff6b6b1a}.error-message{color:#ff6b6b;font-size:.9rem;font-weight:600;text-shadow:1px 1px 2px rgba(0,0,0,.3)}.modal-actions{display:flex;justify-content:center}.btn-primary{background:linear-gradient(45deg,#ff6b6b,#ff8e8e);color:#fff;border:none;padding:1rem 2rem;border-radius:50px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #ff6b6b66;text-shadow:1px 1px 2px rgba(0,0,0,.3)}.btn-primary:hover{transform:translateY(-3px);box-shadow:0 6px 20px #ff6b6b99;background:linear-gradient(45deg,#ff5252,#ff7979)}.btn-primary:active{transform:translateY(-1px)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideIn{0%{opacity:0;transform:translateY(-50px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}@media (max-width: 600px){.modal-content{margin:1rem;padding:1.5rem}.modal-header h2{font-size:1.5rem}.form-group input{font-size:1rem;padding:.8rem}.btn-primary{padding:.8rem 1.5rem;font-size:1rem}}.App{text-align:center;min-height:100vh;display:flex;flex-direction:column}.App-header{background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:1rem 2rem;color:#fff;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.App-header h1{font-size:2.5rem;margin-bottom:.5rem;animation:pulse 2s infinite}.App-header p{font-size:1rem;opacity:.9}main{flex:1;display:flex;justify-content:center;align-items:center;padding:1rem}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}@media (min-width: 1024px) and (max-width: 1366px){.App-header{padding:.8rem 1.5rem}.App-header h1{font-size:2.2rem;margin-bottom:.3rem}.App-header p{font-size:.9rem}main{padding:.8rem}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Arial,sans-serif;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;color:#333}#root{min-height:100vh;display:flex;flex-direction:column}
