*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--primary: #1e293b;--primary-light: #334155;--accent: #3b82f6;--accent-hover: #2563eb;--accent-light: #dbeafe;--success: #10b981;--success-light: #d1fae5;--warning: #f59e0b;--warning-light: #fef3c7;--danger: #ef4444;--danger-light: #fee2e2;--bg: #f1f5f9;--card-bg: #ffffff;--sidebar-bg: #1e293b;--sidebar-text: #cbd5e1;--sidebar-active: #3b82f6;--text: #1e293b;--text-secondary: #64748b;--border: #e2e8f0;--radius: 12px;--radius-sm: 8px;--shadow: 0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.06);--shadow-lg: 0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1);--sidebar-width: 260px;--transition: .2s ease}body{font-family:Inter,system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased}.layout{display:flex;min-height:100vh}.mobile-header{display:none;position:fixed;top:0;left:0;right:0;height:56px;background:var(--primary);color:#fff;align-items:center;padding:0 1rem;z-index:100;gap:.75rem}.mobile-title{font-size:1.1rem;font-weight:700;flex:1}.sidebar{width:var(--sidebar-width);background:var(--sidebar-bg);color:var(--sidebar-text);position:fixed;top:0;left:0;bottom:0;display:flex;flex-direction:column;z-index:90;overflow-y:auto}.sidebar-header{padding:1.5rem;border-bottom:1px solid rgba(255,255,255,.08)}.sidebar-header h2{font-size:1.25rem;font-weight:800;color:#fff}.role-selector{padding:1rem 1.5rem;border-bottom:1px solid rgba(255,255,255,.08)}.role-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:var(--sidebar-text);margin-bottom:.5rem;display:block}.role-buttons{display:flex;flex-direction:column;gap:.25rem}.role-btn{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;border:none;background:transparent;color:var(--sidebar-text);border-radius:var(--radius-sm);cursor:pointer;font-size:.85rem;transition:var(--transition)}.role-btn:hover{background:#ffffff14}.role-btn.active{background:var(--accent);color:#fff}.sidebar-nav{padding:.75rem;flex:1;display:flex;flex-direction:column;gap:.15rem}.nav-link{display:flex;align-items:center;gap:.75rem;padding:.65rem .75rem;border-radius:var(--radius-sm);color:var(--sidebar-text);text-decoration:none;font-size:.9rem;transition:var(--transition)}.nav-link:hover{background:#ffffff14;color:#fff}.nav-link.active{background:var(--accent);color:#fff;font-weight:600}.sidebar-overlay{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:80}.main-content{flex:1;margin-left:var(--sidebar-width);padding:2rem;min-height:100vh}.page{max-width:1200px;margin:0 auto}.page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem;flex-wrap:wrap;gap:1rem}.page-header h2{font-size:1.5rem;font-weight:700;color:var(--text)}.filter-bar{display:flex;gap:.75rem;margin-bottom:1.5rem;flex-wrap:wrap}.filter-bar select{padding:.5rem 1rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:#fff;font-size:.9rem;color:var(--text);min-width:200px}.btn{display:inline-flex;align-items:center;gap:.4rem;padding:.6rem 1.2rem;border:none;border-radius:var(--radius-sm);font-size:.9rem;font-weight:600;cursor:pointer;transition:var(--transition);text-decoration:none}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover)}.btn-secondary{background:var(--border);color:var(--text)}.btn-secondary:hover{background:#cbd5e1}.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover{background:#dc2626}.btn-success{background:var(--success);color:#fff}.btn-success:hover{background:#059669}.btn-ghost{background:transparent;color:var(--text-secondary);padding:.4rem .6rem}.btn-ghost:hover{background:var(--bg);color:var(--text)}.btn-sm{padding:.35rem .7rem;font-size:.8rem}.icon-btn{display:inline-flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:.25rem;color:inherit;border-radius:4px}.icon-btn:hover{background:#0000000d}.text-danger{color:var(--danger)!important}.text-muted{color:var(--text-secondary)}.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1rem}.card{background:var(--card-bg);border-radius:var(--radius);padding:1.25rem;box-shadow:var(--shadow);border:1px solid var(--border);transition:var(--transition)}.card:hover{box-shadow:var(--shadow-lg);transform:translateY(-1px)}.card-header-row{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}.card-logo{width:48px;height:48px;border-radius:var(--radius-sm);object-fit:cover;border:1px solid var(--border)}.card-title{font-size:1.05rem;font-weight:700;color:var(--text);margin-bottom:.25rem}.card-details{display:grid;grid-template-columns:1fr 1fr;gap:.35rem;font-size:.85rem;color:var(--text-secondary);margin-bottom:1rem}.card-details p{line-height:1.5}.card-details strong{color:var(--text)}.card-actions{display:flex;gap:.25rem;border-top:1px solid var(--border);padding-top:.75rem}.badge{display:inline-flex;align-items:center;padding:.15rem .6rem;border-radius:20px;font-size:.75rem;font-weight:600}.badge-active{background:var(--success-light);color:#065f46}.badge-inactive{background:var(--danger-light);color:#991b1b}.badge-finished{background:var(--border);color:var(--text-secondary)}.badge-cancelled{background:var(--danger-light);color:#991b1b}.badge-warning{background:var(--warning-light);color:#92400e}.badge-pending{background:var(--border);color:var(--text-secondary)}.badge-in_progress{background:var(--warning-light);color:#92400e}.badge-completed{background:var(--success-light);color:#065f46}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 2rem;color:var(--text-secondary);gap:1rem}.empty-state p{font-size:1rem}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:200;padding:1rem;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-content{background:#fff;border-radius:var(--radius);width:100%;max-width:480px;max-height:90vh;overflow-y:auto;box-shadow:var(--shadow-lg)}.modal-wide{max-width:720px}.modal-extra-wide{max-width:1100px}.modal-sm{max-width:380px}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 1.5rem;border-bottom:1px solid var(--border)}.modal-header h3{font-size:1.1rem;font-weight:700}.modal-body{padding:1.5rem}.modal-footer{display:flex;justify-content:flex-end;gap:.75rem;padding-top:1.5rem;margin-top:1rem;border-top:1px solid var(--border)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.form-stack{display:flex;flex-direction:column;gap:1rem}.form-group{display:flex;flex-direction:column;gap:.35rem}.form-group.full-width{grid-column:1 / -1}.form-group label{font-size:.8rem;font-weight:600;color:var(--text-secondary)}.form-group input,.form-group select,.form-group textarea{padding:.6rem .75rem;border:1px solid var(--border);border-radius:var(--radius-sm);font-size:.9rem;color:var(--text);background:#fff;transition:var(--transition)}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}.form-group textarea{resize:vertical;font-family:inherit}.checkbox-label{display:flex;align-items:center;gap:.5rem;font-size:.9rem;cursor:pointer}.checkbox-label input[type=checkbox]{width:18px;height:18px;accent-color:var(--accent)}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem}.section-header h4{font-size:.95rem;font-weight:700}.court-row{display:grid;grid-template-columns:1fr 1.5fr 1.5fr auto;gap:.5rem;margin-bottom:.5rem;align-items:center}.court-row input{padding:.5rem .6rem;border:1px solid var(--border);border-radius:var(--radius-sm);font-size:.85rem}.table-wrapper{overflow-x:auto}.data-table{width:100%;border-collapse:collapse;font-size:.85rem}.data-table th{background:var(--bg);padding:.65rem .75rem;text-align:left;font-weight:700;color:var(--text-secondary);font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;border-bottom:2px solid var(--border)}.data-table td{padding:.6rem .75rem;border-bottom:1px solid var(--border);vertical-align:middle}.data-table tbody tr:hover{background:var(--bg)}.text-center,.standings-table th,.standings-table td{text-align:center}.standings-table .team-cell{text-align:left}.standings-table .rank{font-weight:800;color:var(--accent)}.standings-table .points-cell{color:var(--accent);font-size:1rem}.standings-table .top-row{background:var(--accent-light)}.standings-legend{margin-top:1rem;font-size:.8rem;color:var(--text-secondary);line-height:1.8}.player-photo{width:36px;height:36px;border-radius:50%;object-fit:cover}.player-photo-placeholder{width:36px;height:36px;border-radius:50%;background:var(--border)}.player-photo-sm{width:28px;height:28px;border-radius:50%;object-fit:cover}.player-photo-placeholder-sm{width:28px;height:28px;border-radius:50%;background:var(--border)}.detail-logo{width:80px;height:80px;border-radius:var(--radius);object-fit:cover;margin-bottom:1rem}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;font-size:.9rem}.rules-text{margin-top:.5rem;padding:1rem;background:var(--bg);border-radius:var(--radius-sm);font-size:.9rem;white-space:pre-wrap}.courts-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.75rem;margin-top:.5rem}.court-card{padding:.75rem;background:var(--bg);border-radius:var(--radius-sm)}.court-name{font-weight:700;margin-bottom:.25rem}.court-address{font-size:.85rem;color:var(--text-secondary);display:flex;align-items:center;gap:.25rem}.court-map-link{font-size:.8rem;color:var(--accent);text-decoration:none;margin-top:.25rem;display:inline-block}.court-map-link:hover{text-decoration:underline}.results-list{display:flex;flex-direction:column;gap:1rem}.result-card{background:var(--card-bg);border-radius:var(--radius);padding:1.25rem;box-shadow:var(--shadow);border:1px solid var(--border)}.result-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;flex-wrap:wrap;gap:.5rem}.result-teams{display:flex;align-items:center;gap:.75rem}.team-name{font-weight:700;font-size:1rem}.vs-label{color:var(--text-secondary);font-size:.85rem}.sets-grid{display:flex;flex-direction:column;gap:.35rem;margin-bottom:1rem}.sets-header,.sets-row{display:grid;grid-template-columns:140px repeat(auto-fill,70px) 60px;gap:.5rem;align-items:center}.set-label{text-align:center;font-size:.75rem;font-weight:700;color:var(--text-secondary);text-transform:uppercase}.total-label{color:var(--accent)}.team-label{font-size:.85rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.score-input{width:60px;padding:.4rem;text-align:center;border:1px solid var(--border);border-radius:var(--radius-sm);font-size:.9rem;font-weight:700}.score-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}.score-input:disabled{background:var(--bg);color:var(--text)}.set-total{text-align:center;font-weight:800;font-size:1.1rem;color:var(--accent)}.result-footer{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.75rem;border-top:1px solid var(--border);padding-top:1rem}.payment-checks{display:flex;gap:1.5rem;flex-wrap:wrap}.attendance-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.attendance-team{background:var(--card-bg);border-radius:var(--radius);padding:1.25rem;box-shadow:var(--shadow);border:1px solid var(--border)}.attendance-team-name{font-size:1.05rem;font-weight:700;margin-bottom:1rem;padding-bottom:.75rem;border-bottom:2px solid var(--accent)}.attendance-list{display:flex;flex-direction:column;gap:.5rem}.attendance-item{display:flex;align-items:center;justify-content:space-between;padding:.5rem .75rem;border-radius:var(--radius-sm);transition:var(--transition)}.attendance-item.present{background:var(--success-light)}.attendance-item.absent{background:var(--bg)}.attendance-player{display:flex;align-items:center;gap:.5rem;font-size:.9rem}.attendance-summary{margin-top:1rem;padding-top:.75rem;border-top:1px solid var(--border);font-size:.85rem;font-weight:600;color:var(--text-secondary)}.role-selector-mobile{position:relative}.role-btn-sm{display:flex;align-items:center;gap:.35rem;padding:.35rem .6rem;background:#ffffff26;border:none;border-radius:var(--radius-sm);color:#fff;font-size:.8rem;cursor:pointer}.role-dropdown{position:absolute;top:100%;right:0;margin-top:.5rem;background:#fff;border-radius:var(--radius-sm);box-shadow:var(--shadow-lg);overflow:hidden;z-index:110;min-width:150px}.role-option{display:flex;align-items:center;gap:.5rem;width:100%;padding:.6rem 1rem;border:none;background:none;color:var(--text);font-size:.85rem;cursor:pointer;text-align:left}.role-option:hover{background:var(--bg)}.role-option.active{background:var(--accent-light);color:var(--accent);font-weight:600}@media (max-width: 768px){.mobile-header{display:flex}.sidebar{transform:translate(-100%);transition:transform .3s ease}.sidebar.open{transform:translate(0)}.sidebar.open~.sidebar-overlay{display:block}.main-content{margin-left:0;padding:1rem;padding-top:calc(56px + 1rem)}.card-grid,.form-grid,.attendance-grid,.court-row,.detail-grid{grid-template-columns:1fr}.sets-header,.sets-row{grid-template-columns:100px repeat(auto-fill,55px) 45px;gap:.3rem}.score-input{width:48px}.filter-bar{flex-direction:column}.filter-bar select{min-width:100%}.result-teams{flex-direction:column;gap:.25rem;text-align:center}.payment-checks{flex-direction:column;gap:.5rem}}@media (max-width: 480px){.page-header{flex-direction:column;align-items:flex-start}.page-header .btn{width:100%;justify-content:center}}.toast{position:fixed;bottom:1.5rem;right:1.5rem;display:flex;align-items:center;gap:.75rem;padding:.875rem 1.25rem;border-radius:.75rem;box-shadow:0 10px 25px #00000026,0 4px 10px #0000001a;z-index:9999;transform:translateY(1rem);opacity:0;transition:all .3s ease;max-width:400px}.toast-visible{transform:translateY(0);opacity:1}.toast-success{background:var(--success-light);border:1px solid var(--success);color:#065f46}.toast-error{background:var(--danger-light);border:1px solid var(--danger);color:#991b1b}.toast-icon{display:flex;flex-shrink:0}.toast-success .toast-icon{color:var(--success)}.toast-error .toast-icon{color:var(--danger)}.toast-message{font-size:.875rem;font-weight:500;flex:1}.toast-close{background:none;border:none;cursor:pointer;opacity:.5;padding:.25rem;border-radius:.25rem;display:flex;transition:opacity .2s;color:inherit}.toast-close:hover{opacity:1}.login-page{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#fff;padding:0}.login-top{width:100%;min-height:260px;background:linear-gradient(135deg,#1a1a2e,#16213e,#0f3460);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.login-top:before{content:"⚽";position:absolute;left:-20px;top:15%;font-size:7rem;opacity:.12;filter:drop-shadow(0 10px 30px rgba(0,0,0,.3));transform:rotate(-20deg)}.login-top:after{content:"🏀";position:absolute;right:-15px;bottom:5%;font-size:6.5rem;opacity:.12;filter:drop-shadow(0 10px 30px rgba(0,0,0,.3));transform:rotate(15deg)}.login-top-decoration{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none}.login-top-decoration:before{content:"🏐";position:absolute;left:12%;bottom:-15px;font-size:5.5rem;opacity:.09;filter:drop-shadow(0 8px 24px rgba(0,0,0,.25));transform:rotate(25deg)}.login-top-decoration:after{content:"🎾";position:absolute;right:10%;top:-10px;font-size:5rem;opacity:.09;filter:drop-shadow(0 8px 24px rgba(0,0,0,.25));transform:rotate(-12deg)}.login-brand{text-align:center;color:#fff;position:relative;z-index:2}.login-brand h1{font-size:2.2rem;font-weight:800;letter-spacing:-.03em;text-shadow:0 3px 12px rgba(0,0,0,.2)}.login-brand p{font-size:.85rem;opacity:.85;margin-top:.25rem;font-weight:400}.login-top-bg-extra{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden}.login-top-bg-extra:before{content:"🏈";position:absolute;left:45%;top:-20px;font-size:4.5rem;opacity:.07;transform:rotate(35deg);filter:drop-shadow(0 8px 20px rgba(0,0,0,.2))}.login-top-bg-extra:after{content:"⚾";position:absolute;left:60%;bottom:10px;font-size:4rem;opacity:.07;transform:rotate(-20deg);filter:drop-shadow(0 8px 20px rgba(0,0,0,.2))}.login-brand-desktop,.login-bg-balls,.login-bg-balls-extra{display:none}.login-card{background:#fff;border-radius:28px 28px 0 0;padding:2.5rem 2rem 2rem;width:100%;max-width:480px;margin-top:-28px;position:relative;z-index:2;box-shadow:0 -8px 30px #00000014;flex:1;border-top:3px solid transparent;border-image:linear-gradient(90deg,#1e88e5,#43cea2) 1}.login-header{text-align:center;margin-bottom:2rem}.login-header .login-icon{width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,#1e88e5,#43cea2);display:flex;align-items:center;justify-content:center;margin:0 auto 1rem;font-size:1.5rem;box-shadow:0 4px 14px #1e88e54d}.login-header h1{font-size:1.5rem;font-weight:700;color:var(--text);letter-spacing:-.02em}.login-header p{color:var(--text-secondary);font-size:.85rem;font-weight:400;margin-top:.35rem}.login-form{display:flex;flex-direction:column;gap:1.25rem}.login-form .form-group{position:relative;background:var(--bg);border-radius:12px;padding:.6rem 1rem .5rem;border:1px solid var(--border);transition:var(--transition)}.login-form .form-group:focus-within{border-color:var(--accent);box-shadow:none;background:#fff}.login-form .form-group label{font-size:.7rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.04em;display:block;margin-bottom:.15rem}.login-form .form-group input{border:none;border-radius:0;padding:.3rem 0;font-size:1rem;background:transparent;width:100%;color:var(--text)}.login-form .form-group input:focus{outline:none;box-shadow:none;border:none;border-color:transparent}.login-error{background:var(--danger-light);color:#991b1b;padding:.75rem 1rem;border-radius:12px;font-size:.85rem;border:1px solid var(--danger)}.login-btn{width:100%;padding:.9rem;font-size:1rem;font-weight:600;margin-top:.75rem;justify-content:center;border-radius:50px;letter-spacing:-.01em;background:linear-gradient(135deg,#1e88e5,#43cea2);border:none;color:#fff;box-shadow:0 4px 14px #1e88e559;transition:all .2s ease}.login-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 20px #1e88e573}.login-btn:disabled{opacity:.7;cursor:not-allowed}.login-divider{height:1px;background:linear-gradient(90deg,transparent,var(--border),transparent);margin:.5rem 0}@media (min-width: 769px){.login-page{justify-content:center;align-items:center;background:linear-gradient(135deg,#0a2540,#1565a8 35%,#1a85d4,#29a8e8 85%,#d6f0ff);padding:2rem;position:relative;overflow:hidden}.login-page:before{content:"";position:absolute;left:-80px;top:-60px;width:350px;height:350px;background:linear-gradient(135deg,#2c3e50b3,#1e88e54d);clip-path:polygon(0 0,100% 0,60% 100%,0 80%);z-index:0}.login-page:after{content:"";position:absolute;right:-50px;bottom:-80px;width:400px;height:400px;background:linear-gradient(135deg,#1e88e566,#2c3e5033);clip-path:polygon(40% 0,100% 20%,100% 100%,0 100%);z-index:0}.login-top{display:none}.login-card{border-radius:20px;margin-top:0;max-width:400px;flex:unset;box-shadow:0 25px 60px #0000004d,0 8px 20px #00000026;padding:2.5rem;position:relative;z-index:2;border-top:3px solid transparent;border-image:linear-gradient(90deg,#1e88e5,#43cea2) 1;border-image-slice:1}.login-brand-desktop{display:block;text-align:center;color:#fff;margin-bottom:1.5rem;position:relative;z-index:2}.login-brand-desktop h1{font-size:2.4rem;font-weight:800;letter-spacing:-.03em;text-shadow:0 3px 12px rgba(0,0,0,.3)}.login-brand-desktop p{font-size:.9rem;opacity:.7;margin-top:.25rem}}@media (min-width: 769px){.login-top-bg-extra{display:block;position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:1}.login-page .login-top-bg-extra:before{content:"";position:absolute;left:10%;top:20%;width:200px;height:200px;background:#ffffff05;clip-path:polygon(50% 0%,100% 38%,82% 100%,18% 100%,0% 38%)}.login-page .login-top-bg-extra:after{content:"";position:absolute;right:15%;top:15%;width:120px;height:120px;background:#ffffff08;clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%)}}@media (min-width: 769px){.login-page .login-brand-desktop:before{content:"⚽";position:absolute;left:-320px;top:-60px;font-size:10rem;opacity:.2;transform:rotate(-15deg);filter:drop-shadow(0 12px 30px rgba(0,0,0,.5))}.login-page .login-brand-desktop:after{content:"🏀";position:absolute;right:-320px;top:0;font-size:9rem;opacity:.2;transform:rotate(20deg);filter:drop-shadow(0 12px 30px rgba(0,0,0,.5))}.login-card:before{content:"🏐";position:absolute;left:-240px;bottom:-40px;font-size:8rem;opacity:.18;transform:rotate(25deg);filter:drop-shadow(0 10px 25px rgba(0,0,0,.4));z-index:-1}.login-card:after{content:"🎾";position:absolute;right:-220px;bottom:10px;font-size:7rem;opacity:.18;transform:rotate(-10deg);filter:drop-shadow(0 10px 25px rgba(0,0,0,.4));z-index:-1}.login-top-bg-extra{display:block;position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:1}.login-page .login-top-bg-extra:before{content:"🏈";position:absolute;left:5%;top:12%;font-size:7rem;opacity:.15;transform:rotate(30deg);filter:drop-shadow(0 8px 20px rgba(0,0,0,.4))}.login-page .login-top-bg-extra:after{content:"⚾";position:absolute;right:6%;top:10%;font-size:6.5rem;opacity:.15;transform:rotate(-15deg);filter:drop-shadow(0 8px 20px rgba(0,0,0,.4))}.login-bg-balls{display:block;position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0}.login-bg-balls:before{content:"🏓";position:absolute;left:8%;bottom:15%;font-size:6rem;opacity:.15;transform:rotate(20deg);filter:drop-shadow(0 8px 20px rgba(0,0,0,.4))}.login-bg-balls:after{content:"🥊";position:absolute;right:8%;bottom:18%;font-size:6.5rem;opacity:.15;transform:rotate(-25deg);filter:drop-shadow(0 8px 20px rgba(0,0,0,.4))}.login-bg-balls-extra{display:block;position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0}.login-bg-balls-extra:before{content:"🏆";position:absolute;left:18%;top:60%;font-size:5.5rem;opacity:.12;transform:rotate(10deg);filter:drop-shadow(0 8px 20px rgba(0,0,0,.4))}.login-bg-balls-extra:after{content:"🎯";position:absolute;right:18%;top:65%;font-size:5rem;opacity:.12;transform:rotate(-8deg);filter:drop-shadow(0 8px 20px rgba(0,0,0,.4))}}