@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&display=swap";:root{--bg-color:#0b0f19;--bg-header:#0b0f19d9;--bg-card:#161c2db3;--bg-button:#ffffff08;--bg-button-hover:#ffffff14;--border-button-hover:#fff3;--bg-input:#0a0e1799;--bg-modal:#111827;--border-color:#ffffff14;--border-glow:#6366f133;--text-primary:#f3f4f6;--text-secondary:#9ca3af;--text-muted:#6b7280;--accent:#6366f1;--accent-glow:#6366f166;--accent-gradient:linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);--accent-hover:#4f46e5;--success:#10b981;--success-glow:#10b98126;--success-text:#a7f3d0;--error:#ef4444;--error-glow:#ef444426;--error-text:#fca5a5;--warning:#f59e0b;--warning-glow:#f59e0b26;--warning-text:#fde68a;--font-family:"Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--transition-smooth:all .3s cubic-bezier(.4, 0, .2, 1)}[data-theme=light]{--bg-color:#f3f4f6;--bg-header:#ffffffd9;--bg-card:#ffffffe6;--bg-button:#00000008;--bg-button-hover:#0000000f;--border-button-hover:#0000001f;--bg-input:#fff;--bg-modal:#fff;--border-color:#00000014;--border-glow:#6366f11a;--text-primary:#111827;--text-secondary:#4b5563;--text-muted:#6b7280;--accent:#4f46e5;--accent-glow:#4f46e526;--accent-gradient:linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);--accent-hover:#4338ca;--success-glow:#10b9811a;--error-glow:#ef44441a;--warning-glow:#f59e0b1a;--success-text:#065f46;--warning-text:#92400e;--error-text:#991b1b}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);background-color:var(--bg-color);background-image:radial-gradient(at 0% 0%, var(--border-glow) 0, transparent 50%), radial-gradient(at 100% 100%, var(--border-glow) 0, transparent 50%);color:var(--text-primary);-webkit-font-smoothing:antialiased;min-height:100vh;line-height:1.5}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-color)}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#fff3}.container{max-width:1100px;margin:0 auto;padding:0 1.5rem}.app-header{background:var(--bg-header);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border-color);z-index:100;padding:1rem 0;position:sticky;top:0}.header-flex{justify-content:space-between;align-items:center;gap:1rem;display:flex}.logo-group{background:var(--accent-gradient);-webkit-text-fill-color:transparent;letter-spacing:-.025em;-webkit-background-clip:text;align-items:center;gap:.75rem;font-size:1.5rem;font-weight:800;display:flex}.logo-icon{background:var(--accent-gradient);-webkit-text-fill-color:white;width:2.25rem;height:2.25rem;box-shadow:0 4px 12px var(--accent-glow);border-radius:8px;justify-content:center;align-items:center;display:flex}.user-controls{align-items:center;gap:1rem;display:flex}.user-switcher{border:1px solid var(--border-color);color:var(--text-primary);font-family:var(--font-family);cursor:pointer;transition:var(--transition-smooth);background:#ffffff0d;border-radius:8px;outline:none;padding:.5rem 1rem;font-size:.875rem}.user-switcher:hover{border-color:var(--accent);background:#ffffff14}.user-switcher option{background-color:var(--bg-modal);color:var(--text-primary)}.glass-panel{background:var(--bg-card);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-color);transition:var(--transition-smooth);border-radius:16px;padding:1.5rem;box-shadow:0 10px 30px -10px #00000080}.glass-panel:hover{border-color:#ffffff1f}h1,h2,h3,h4{letter-spacing:-.02em;font-weight:700}.section-title{align-items:center;gap:.75rem;margin-bottom:1.5rem;font-size:1.75rem;display:flex}.btn{font-size:.95rem;font-weight:600;font-family:var(--font-family);cursor:pointer;transition:var(--transition-smooth);border:none;border-radius:8px;justify-content:center;align-items:center;gap:.5rem;padding:.625rem 1.25rem;display:inline-flex}.btn-primary{background:var(--accent-gradient);color:#fff;box-shadow:0 4px 14px var(--accent-glow)}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #6366f180}.btn-secondary{color:var(--text-primary);border:1px solid var(--border-color);background:#ffffff0f}.btn-secondary:hover:not(:disabled){background:#ffffff1a;border-color:#fff3}.btn-danger{color:#fca5a5;background:#ef444426;border:1px solid #ef44444d}.btn-danger:hover:not(:disabled){background:#ef444440;border-color:#ef4444}.btn:disabled{opacity:.5;cursor:not-allowed;box-shadow:none!important;transform:none!important}.form-group{margin-bottom:1.25rem}.form-label{color:var(--text-secondary);margin-bottom:.5rem;font-size:.875rem;font-weight:500;display:block}.form-input{background:var(--bg-input);border:1px solid var(--border-color);width:100%;color:var(--text-primary);font-family:var(--font-family);transition:var(--transition-smooth);border-radius:8px;outline:none;padding:.75rem 1rem;font-size:.95rem}.form-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #6366f133}.tabs-navigation{border-bottom:1px solid var(--border-color);gap:.5rem;margin-bottom:2rem;padding-bottom:1px;display:flex;overflow-x:auto}.tab-button{color:var(--text-secondary);font-family:var(--font-family);cursor:pointer;transition:var(--transition-smooth);white-space:nowrap;background:0 0;border:none;border-bottom:2px solid #0000;align-items:center;gap:.5rem;padding:.75rem 1.25rem;font-weight:600;display:flex}.tab-button:hover{color:var(--text-primary);border-bottom-color:#fff3}.tab-button.active{color:var(--accent);border-bottom-color:var(--accent)}.dashboard-grid{grid-template-columns:2fr 1fr;gap:2rem;display:grid}@media (width<=768px){.dashboard-grid{grid-template-columns:1fr}}.comp-list{flex-direction:column;gap:1rem;display:flex}.comp-card{border:1px solid var(--border-color);transition:var(--transition-smooth);cursor:pointer;background:#ffffff05;border-radius:12px;justify-content:space-between;align-items:center;padding:1.25rem;display:flex}.comp-card:hover{border-color:var(--accent);background:#ffffff0a;transform:translate(4px)}.comp-card.active{border-color:var(--accent);background:#6366f10d}.comp-badge{color:#a5b4fc;text-transform:uppercase;background:#6366f126;border-radius:6px;padding:.25rem .5rem;font-size:.75rem;font-weight:600}.fixtures-container{flex-direction:column;gap:1.25rem;display:flex}.fixture-card{border:1px solid var(--border-color);background:var(--bg-card);transition:var(--transition-smooth);border-radius:14px;position:relative;overflow:hidden}.fixture-card:hover{border-color:#ffffff26;box-shadow:0 4px 20px #0003}.fixture-header{border-bottom:1px solid var(--border-color);color:var(--text-secondary);background:#ffffff05;justify-content:space-between;align-items:center;padding:.75rem 1.25rem;font-size:.85rem;display:flex}.fixture-status{text-transform:uppercase;align-items:center;gap:.375rem;font-size:.75rem;font-weight:600;display:flex}.fixture-status.locked{color:var(--error)}.fixture-status.open{color:var(--success)}.fixture-status.completed{color:var(--text-muted)}.fixture-body{text-align:center;grid-template-columns:1.5fr 1fr 1.5fr;align-items:center;gap:1rem;padding:1.5rem 1.25rem;display:grid}@media (width<=576px){.fixture-body{grid-template-columns:1.2fr auto 1.2fr;gap:.5rem;padding:1rem .5rem}.team-emoji{font-size:1.75rem}.team-name{font-size:.85rem}.fixture-venue{display:none}}.team-box{flex-direction:column;align-items:center;gap:.5rem;display:flex}.team-emoji{font-size:2.5rem;display:block}.team-name{font-size:1.1rem;font-weight:700}.score-display{font-variant-numeric:tabular-nums;color:var(--text-primary);background:#8080801a;border-radius:8px;padding:.25rem 1rem;font-size:2rem;font-weight:800}.match-info-center{flex-direction:column;align-items:center;gap:.25rem;display:flex}.vs-badge{color:var(--text-secondary);background:#ffffff14;border-radius:6px;padding:.25rem .5rem;font-size:.8rem;font-weight:800}.fixture-venue{color:var(--text-muted);font-size:.75rem}.tipping-row{justify-content:center;gap:.75rem;padding:0 1.25rem 1.25rem;display:flex}@media (width<=576px){.tipping-row{flex-direction:row;gap:.5rem;padding:0 .75rem 1rem}.tip-button{text-align:center;border-radius:8px;justify-content:center;align-items:center;min-height:2.5rem;padding:.5rem .25rem;font-size:.75rem;display:flex}}.tip-button{background:var(--bg-button);border:1px solid var(--border-color);color:var(--text-secondary);font-family:var(--font-family);cursor:pointer;border-radius:10px;outline:none;flex:1;padding:.75rem 1rem;font-weight:600;transition:background-color .15s,border-color .15s,box-shadow .15s}.tip-button:hover:not(:disabled){background:var(--bg-button-hover);border-color:var(--border-button-hover);color:var(--text-primary)}.tip-button.active{background:var(--accent-gradient);border-color:var(--accent);box-shadow:0 4px 15px var(--accent-glow);font-weight:700;color:#fff!important}.tip-button:disabled{cursor:not-allowed;opacity:.7}.margin-container{border-top:1px dashed var(--border-color);justify-content:center;align-items:center;gap:.75rem;margin-top:.25rem;padding:1rem 1.25rem 1.25rem;display:flex}.margin-input{background:var(--bg-input);border:1px solid var(--border-color);width:70px;color:var(--text-primary);text-align:center;font-family:var(--font-family);border-radius:6px;outline:none;padding:.5rem;font-size:.95rem;font-weight:600}.margin-input:focus{border-color:var(--accent)}.other-tips-section{border-top:1px solid var(--border-color);background:#0000001f}.other-tips-toggle{width:100%;color:var(--text-secondary);font-family:var(--font-family);cursor:pointer;transition:var(--transition-smooth);background:0 0;border:none;justify-content:space-between;align-items:center;padding:.625rem 1.25rem;font-size:.8rem;font-weight:600;display:flex}.other-tips-toggle:hover{color:var(--text-primary);background:#ffffff05}.other-tips-content{padding:.75rem 1.25rem 1.25rem}.tips-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.75rem;display:grid}.user-tip-pill{border:1px solid var(--border-color);background:#ffffff08;border-radius:8px;flex-direction:column;gap:.125rem;padding:.5rem .75rem;font-size:.8rem;display:flex}.user-tip-pill.correct{background:#10b9810d;border-color:#10b98166}.user-tip-pill.incorrect{background:#ef44440d;border-color:#ef444466}.leaderboard-table{border-collapse:collapse;width:100%;margin-top:1rem}.leaderboard-table th,.leaderboard-table td{text-align:left;border-bottom:1px solid var(--border-color);padding:1rem .75rem}.leaderboard-table th{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;font-size:.85rem;font-weight:600}.leaderboard-table tr{transition:var(--transition-smooth)}.leaderboard-table tbody tr:hover{cursor:pointer;background:#ffffff05}.rank-badge{border-radius:50%;justify-content:center;align-items:center;width:1.75rem;height:1.75rem;font-size:.85rem;font-weight:800;display:inline-flex}.rank-badge.rank-1{color:#78350f;background:linear-gradient(135deg,#fbbf24 0%,#d97706 100%);box-shadow:0 0 10px #fbbf244d}.rank-badge.rank-2{color:#1e293b;background:linear-gradient(135deg,#e2e8f0 0%,#94a3b8 100%)}.rank-badge.rank-3{color:#fef3c7;background:linear-gradient(135deg,#b45309 0%,#78350f 100%)}.admin-grid{flex-direction:column;gap:2rem;display:flex}.upload-dropzone{text-align:center;cursor:pointer;transition:var(--transition-smooth);background:#ffffff03;border:2px dashed #ffffff26;border-radius:12px;padding:3rem}.upload-dropzone:hover{border-color:var(--accent);background:#6366f105}.admin-fixture-row{border-bottom:1px solid var(--border-color);grid-template-columns:2fr 1fr 1fr 1fr;align-items:center;gap:1rem;padding:1rem;display:grid}@media (width<=576px){.admin-fixture-row{grid-template-columns:1fr;gap:.5rem}}.admin-score-input{background:var(--bg-input);border:1px solid var(--border-color);width:100%;color:var(--text-primary);text-align:center;font-family:var(--font-family);border-radius:6px;padding:.5rem;font-weight:700}.modal-overlay{-webkit-backdrop-filter:blur(8px);z-index:200;background:#000000bf;justify-content:center;align-items:center;padding:1.5rem;display:flex;position:fixed;inset:0}.modal-content{background:var(--bg-modal);border:1px solid var(--border-color);border-radius:16px;width:100%;max-width:550px;max-height:85vh;overflow-y:auto;box-shadow:0 20px 50px #000c}.modal-header{border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;padding:1.25rem 1.5rem;display:flex}.modal-body{padding:1.5rem}.welcome-container{justify-content:center;align-items:center;min-height:calc(100vh - 120px);display:flex}.welcome-card{text-align:center;width:100%;max-width:480px}.welcome-hero{margin-bottom:2rem}.welcome-hero h1{background:var(--accent-gradient);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:.5rem;font-size:2.25rem}.welcome-tabs{background:#ffffff0a;border-radius:10px;margin-bottom:1.5rem;padding:.25rem;display:flex}.welcome-tab{color:var(--text-secondary);font-family:var(--font-family);cursor:pointer;transition:var(--transition-smooth);background:0 0;border:none;border-radius:8px;flex:1;padding:.5rem;font-weight:600}.welcome-tab.active{color:#fff;background:#ffffff14}.social-divider{text-align:center;color:var(--text-muted);align-items:center;width:100%;margin:1.25rem 0;font-size:.8rem;display:flex}.social-divider:before,.social-divider:after{content:"";border-bottom:1px solid var(--border-color);flex:1}.social-divider:not(:empty):before{margin-right:.75em}.social-divider:not(:empty):after{margin-left:.75em}.btn-google{color:#1f2937;background:#fff;border:1px solid #d1d5db;width:100%;margin-top:.5rem;font-weight:600;box-shadow:0 2px 4px #00000014}.btn-google:hover:not(:disabled){background:#f9fafb;border-color:#c0c4cc;transform:translateY(-1px);box-shadow:0 4px 8px #0000001f}.auth-link-container{justify-content:space-between;margin-top:1.25rem;font-size:.85rem;display:flex}.auth-link{color:var(--accent);cursor:pointer;transition:var(--transition-smooth);font-weight:500;text-decoration:none}.auth-link:hover{color:#8b5cf6;text-decoration:underline}.progress-card{border:1px solid var(--border-color);background:#ffffff05;border-radius:14px;margin-bottom:1.5rem;padding:1.25rem}.progress-header-row{justify-content:space-between;align-items:center;margin-bottom:.75rem;display:flex}.progress-label-text{font-size:.95rem;font-weight:700}.progress-stats-badge{color:var(--accent);background:#6366f11f;border-radius:6px;padding:.2rem .6rem;font-size:.9rem;font-weight:800}.progress-track{background:#ffffff0f;border-radius:4px;height:8px;margin-bottom:1rem;overflow:hidden}.progress-fill{background:var(--accent-gradient);border-radius:4px;height:100%;transition:width .4s cubic-bezier(.4,0,.2,1)}.progress-fill.completed{background:linear-gradient(135deg,#10b981 0%,#059669 100%)}.alert-banner{border-radius:8px;align-items:center;gap:.75rem;padding:.75rem 1rem;font-size:.875rem;display:flex}.alert-banner.alert-warning{background:var(--warning-glow);color:var(--warning-text);border:1px solid #f59e0b4d}.alert-banner.alert-success{background:var(--success-glow);color:var(--success-text);border:1px solid #10b9814d}.group-section{border:1px solid var(--border-color);background:#ffffff03;border-radius:16px;margin-bottom:2rem;padding:1.25rem}.group-section-header{border-bottom:1px solid var(--border-color);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.25rem;padding-bottom:.75rem;display:flex}.group-title-group{align-items:center;gap:.5rem;display:flex}.group-title-text{color:var(--text-primary);letter-spacing:-.01em;font-size:1.25rem;font-weight:800}.group-joker-status{align-items:center;gap:.5rem;display:flex}.joker-active-badge{background:var(--warning-glow);color:var(--warning);border:1px solid #f59e0b66;border-radius:6px;align-items:center;gap:.25rem;padding:.25rem .5rem;font-size:.75rem;font-weight:700;display:inline-flex}.round-scroll-container{scrollbar-width:thin;-webkit-overflow-scrolling:touch;gap:.5rem;width:100%;margin-bottom:1.5rem;padding:.5rem .25rem;display:flex;overflow-x:auto}.round-scroll-container::-webkit-scrollbar{height:4px}.round-scroll-container::-webkit-scrollbar-track{background:0 0}.round-scroll-container::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}.round-btn{font-family:var(--font-family);cursor:pointer;border:1px solid var(--border-color);border-radius:8px;outline:none;flex:none;padding:.5rem 1rem;font-size:.85rem;font-weight:600;transition:background-color .15s,border-color .15s,color .15s}.round-btn.completed{color:var(--text-muted);border-color:var(--border-color);background:#80808014}.round-btn.completed:hover{color:var(--text-secondary);background:#80808026}.round-btn.tipped{background:var(--success-glow);color:var(--success-text);border-color:#10b98140}.round-btn.tipped:hover{background:#10b9812e}.round-btn.pending{background:var(--warning-glow);color:var(--warning-text);border-color:#f59e0b40}.round-btn.pending:hover{background:#f59e0b2e}.round-btn.active{background:var(--accent-gradient);border-color:var(--accent);box-shadow:0 4px 12px var(--accent-glow);font-weight:700;color:#fff!important}