@import "https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&family=Outfit:wght@400;600;700;800;900&display=swap";:root{--color-primary:#0f5132;--color-primary-light:#198754;--color-primary-glow:#19875466;--color-secondary:#f6c23e;--color-secondary-dark:#f6993f;--color-secondary-glow:#f6c23e80;--color-accent:#36b9cc;--color-bg-base:#f8f9fa;--color-bg-card:#ffffffb3;--color-text-main:#2b2b2b;--color-text-muted:#6b7280;--color-border:#ffffff80;--color-border-card:#0000000a;--shadow-sm:0 4px 15px #00000008;--shadow-md:0 10px 30px #0000000f, 0 2px 8px #00000005;--shadow-lg:0 25px 50px #00000014, 0 10px 20px #0000000a;--shadow-glow:0 0 25px var(--color-secondary-glow);--shadow-glow-primary:0 0 25px var(--color-primary-glow);--radius-xl:28px;--radius-lg:20px;--radius-md:14px;--radius-pill:999px}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--color-bg-base);color:var(--color-text-main);-webkit-font-smoothing:antialiased;background-color:#fcfcfd;background-image:radial-gradient(circle at 15% 10%,#d2f4eacc 0%,#0000 40%),radial-gradient(circle at 85% 20%,#fef3c7cc 0%,#0000 40%),radial-gradient(circle at 50% 90%,#e0f2fecc 0%,#0000 50%),none;background-position:0 0,0 0,0 0,0 0;background-repeat:repeat,repeat,repeat,repeat;background-size:auto,auto,auto,auto;background-attachment:fixed;background-origin:padding-box,padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box,border-box;min-height:100vh;font-family:Plus Jakarta Sans,sans-serif;line-height:1.6}h1,h2,h3,h4,h5,h6{letter-spacing:-.03em;color:var(--color-primary);font-family:Outfit,sans-serif;font-weight:800}a{color:var(--color-primary-light);font-weight:600;text-decoration:none;transition:all .3s}a:hover{color:var(--color-primary)}.glass-panel{background:var(--color-bg-card);-webkit-backdrop-filter:blur(24px);border:1px solid var(--color-border);box-shadow:inset 0 0 0 1px var(--color-border-card), var(--shadow-md);border-radius:var(--radius-xl);padding:2.5rem;transition:transform .4s cubic-bezier(.175,.885,.32,1.275),box-shadow .4s,border-color .4s;position:relative;overflow:hidden}.glass-panel:before{content:"";pointer-events:none;background:linear-gradient(#fff6 0%,#fff0 20%);height:100%;position:absolute;top:0;left:0;right:0}.glass-panel:hover{box-shadow:inset 0 0 0 1px #1987541a, var(--shadow-lg);transform:translateY(-4px)}.form-group{margin-bottom:1.5rem;position:relative}.form-label{color:var(--color-primary);margin-bottom:.6rem;font-size:.95rem;font-weight:700;display:block}.form-input{border-radius:var(--radius-md);width:100%;color:var(--color-text-main);background:#fffffff2;border:2px solid #0000000f;padding:1rem 1.4rem;font-family:inherit;font-size:1.05rem;transition:all .3s cubic-bezier(.25,.8,.25,1);box-shadow:inset 0 2px 4px #00000005}.form-input:focus{border-color:var(--color-primary-light);background:#fff;outline:none;box-shadow:0 0 0 4px #19875426,inset 0 2px 4px #00000003}.form-input::placeholder{color:#adb5bd;font-weight:500}.btn{border-radius:var(--radius-pill);cursor:pointer;z-index:1;border:none;justify-content:center;align-items:center;gap:.7rem;padding:1rem 2rem;font-family:Outfit,sans-serif;font-size:1.05rem;font-weight:800;transition:all .4s cubic-bezier(.175,.885,.32,1.275);display:inline-flex;position:relative;overflow:hidden}.btn:after{content:"";z-index:-1;background:linear-gradient(90deg,#fff0 0%,#ffffff4d 50%,#fff0 100%);width:50%;height:100%;transition:all .6s;position:absolute;top:0;left:-100%;transform:skew(-25deg)}.btn:hover:after{left:150%}.btn-primary{background:linear-gradient(135deg, var(--color-primary-light), var(--color-primary));color:#fff;box-shadow:0 8px 20px #1987544d,inset 0 2px #fff3}.btn-primary:hover{transform:translateY(-4px)scale(1.02);box-shadow:0 12px 25px #19875466,inset 0 2px #fff3}.btn-secondary{color:var(--color-primary);background:#ffffffe6;border:2px solid #1987541a;box-shadow:0 4px 10px #0000000d}.btn-secondary:hover{border-color:var(--color-primary-light);background:#fff;transform:translateY(-3px);box-shadow:0 8px 20px #19875426}.btn-accent{background:linear-gradient(135deg, var(--color-secondary), var(--color-secondary-dark));color:#5c3800;box-shadow:var(--shadow-glow), inset 0 2px 0 #fff6}.btn-accent:hover{transform:translateY(-4px)scale(1.02);box-shadow:0 15px 35px #f6c23e99,inset 0 2px #fff6}.btn-massive{width:100%;max-width:450px;padding:1.4rem 3rem;font-size:1.3rem;animation:3s infinite alternate pulse-glow}@keyframes pulse-glow{0%{box-shadow:0 8px 25px #f6c23e80}to{box-shadow:0 15px 45px #f6c23ecc}}.app-container{flex-direction:column;max-width:1280px;min-height:100vh;margin:0 auto;padding:2rem;display:flex}.navbar{-webkit-backdrop-filter:blur(20px);border-radius:var(--radius-pill);box-shadow:var(--shadow-sm);z-index:100;background:#ffffffb3;border:1px solid #fffc;justify-content:space-between;align-items:center;margin-bottom:3rem;padding:1rem 2rem;transition:box-shadow .3s;display:flex;position:sticky;top:1.5rem}.navbar:hover{box-shadow:var(--shadow-md)}.brand{letter-spacing:-.05em;color:var(--color-primary);text-shadow:0 2px 10px #0000000d;align-items:center;gap:.6rem;font-size:1.8rem;font-weight:900;display:flex}.brand-icon{color:var(--color-secondary);filter:drop-shadow(0 4px 8px #f6c23e99)}.status-box{border-radius:var(--radius-md);align-items:center;gap:.8rem;margin-bottom:1.5rem;padding:1rem 1.2rem;font-size:.95rem;font-weight:700;animation:.4s cubic-bezier(.175,.885,.32,1.275) slide-down;display:flex}.status-error{color:#d62828;background:#fff0f0;border:1px solid #ffcaca}.status-success{color:#166534;background:#f0fdf4;border:1px solid #bbf7d0}@keyframes slide-down{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.quinielas-grid{grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:2rem;margin-top:2rem;display:grid}.quiniela-card{background:linear-gradient(145deg,#ffffffe6 0%,#fff9 100%);flex-direction:column;justify-content:space-between;padding:2rem;display:flex}.offline-banner{color:#fff;text-align:center;z-index:1000;background:linear-gradient(90deg,#d62828,#9b2226);justify-content:center;align-items:center;gap:.6rem;padding:.8rem;font-size:1rem;font-weight:800;display:flex;position:fixed;top:0;left:0;right:0;box-shadow:0 4px 20px #d6282866}.empty-state-premium{text-align:center;border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);background:radial-gradient(circle,#ffffffe6 0%,#fff6 100%);border:1px solid #ffffffb3;flex-direction:column;justify-content:center;align-items:center;margin-top:2rem;padding:5rem 2rem;display:flex}.modal-overlay{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:1100;background:#0f513226;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}@media screen and (width<=768px){body{background:radial-gradient(circle at 50% 10%, #e0f2fe 0%, #f0fdf4 40%, var(--color-bg-base) 100%)}.app-container{padding:1rem}.navbar{border-radius:var(--radius-lg);flex-direction:column;gap:1rem;margin-bottom:2rem;padding:1rem;position:static}.navbar .brand{font-size:1.6rem}.navbar div{flex-wrap:wrap;justify-content:center;width:100%;gap:.8rem!important}.navbar .btn{padding:.6rem 1rem!important;font-size:.9rem!important}.glass-panel{border-radius:var(--radius-lg);padding:1.5rem}.quinielas-grid{grid-template-columns:1fr;gap:1.5rem}h1{font-size:2.2rem!important}h2{font-size:1.8rem!important}.btn-massive{padding:1.2rem 2rem;font-size:1.1rem}input[style*="width: 3.2rem"]{width:2.4rem!important;height:2.6rem!important;font-size:1.3rem!important}}