:root{--orange-50: #fff7ed;--orange-100: #ffedd5;--orange-200: #fed7aa;--orange-300: #fdba74;--orange-400: #fb923c;--orange-500: #f97316;--orange-600: #ea580c;--orange-700: #c2410c;--orange-800: #9a3412;--orange-900: #7c2d12;--primary: #FF6B35;--primary-light: #FF8C5A;--primary-dark: #E55A2B;--secondary: #64748b;--accent: #0ea5e9;--gray-50: #f8fafc;--gray-100: #f1f5f9;--gray-200: #e2e8f0;--gray-300: #cbd5e1;--gray-400: #94a3b8;--gray-500: #64748b;--gray-600: #475569;--gray-700: #334155;--gray-800: #1e293b;--gray-900: #0f172a;--red-50: #fef2f2;--red-100: #fee2e2;--red-200: #fecaca;--red-300: #fca5a5;--red-400: #f87171;--red-500: #ef4444;--red-600: #dc2626;--red-700: #b91c1c;--red-800: #991b1b;--red-900: #7f1d1d;--surface: #ffffff;--surface-glass: #f8f9fa;--surface-elevated: #ffffff;--surface-subtle: #f8fafc;--bg-primary: #fafafa;--bg-subtle: #fff7ed;--shadow-xs: 0 1px 2px 0 #e0e0e0;--shadow-sm: 0 1px 3px 0 #d0d0d0, 0 1px 2px -1px #d0d0d0;--shadow-md: 0 4px 6px -1px #d0d0d0, 0 2px 4px -2px #d0d0d0;--shadow-lg: 0 10px 15px -3px #d0d0d0, 0 4px 6px -4px #d0d0d0;--shadow-xl: 0 20px 25px -5px #d0d0d0, 0 8px 10px -6px #d0d0d0;--shadow-2xl: 0 25px 50px -12px #c0c0c0;--shadow-orange: 0 10px 25px -5px #ffd4c0, 0 8px 10px -6px #ffe0d0;--shadow-glow: 0 0 20px #ffd4c0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6;font-weight:400;color:var(--gray-800);--heading-font: "Space Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--space-20: 5rem;--radius-xs: .125rem;--radius-sm: .25rem;--radius-md: .375rem;--radius-lg: .5rem;--radius-xl: .75rem;--radius-2xl: 1rem;--radius-3xl: 1.5rem;--radius-full: 9999px;--duration-150: .15s;--duration-200: .2s;--duration-300: .3s;--duration-500: .5s;--duration-700: .7s;--ease-out: cubic-bezier(0, 0, .2, 1);--ease-in: cubic-bezier(.4, 0, 1, 1);--ease-in-out: cubic-bezier(.4, 0, .2, 1);--ease-bounce: cubic-bezier(.68, -.55, .265, 1.55);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{margin:0;padding:0;min-height:100vh;background:var(--bg-primary);position:relative}body:before{content:"";position:fixed;inset:0;background:var(--bg-subtle);pointer-events:none;z-index:-1;opacity:.6}#root{min-height:100vh;position:relative}.container{max-width:1200px;margin:0 auto;padding:0 20px}.btn{display:inline-flex;align-items:center;justify-content:center;padding:var(--space-3) var(--space-6);border:none;border-radius:var(--radius-xl);font-family:inherit;font-size:.875rem;font-weight:600;cursor:pointer;transition:all var(--duration-200) var(--ease-out);text-decoration:none;outline:none;position:relative;overflow:hidden;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:#f0f0f0;transition:left var(--duration-700) var(--ease-out)}.btn:hover:before{left:100%}.btn:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.btn:active{transform:scale(.98)}.btn-primary{background:var(--primary);color:#fff;box-shadow:var(--shadow-orange),var(--shadow-glow);border:1px solid #e0e0e0}.btn-primary:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-xl),var(--shadow-glow)}.btn-secondary{background:var(--surface-glass);color:var(--gray-700);box-shadow:var(--shadow-md);border:1px solid #ffd4c0}.btn-secondary:hover{background:var(--surface-elevated);color:var(--gray-800);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.btn-outline{background:#f5f5f5;color:var(--gray-700);border:2px solid #ffb899;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.btn-outline:hover{background:var(--surface-glass);color:var(--primary);border-color:var(--primary);transform:translateY(-2px)}.btn-ghost{background:transparent;color:var(--gray-600);border:none;-webkit-backdrop-filter:none;backdrop-filter:none}.btn-ghost:hover{background:var(--surface-glass);color:var(--primary)}.card{background:var(--surface-glass);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-radius:var(--radius-3xl);padding:var(--space-8);box-shadow:var(--shadow-lg);border:1px solid #e5e5e5;transition:all var(--duration-300) var(--ease-out);position:relative;overflow:hidden}.card:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:#ccc}.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-2xl);border-color:#ffb899}.card-elevated{background:var(--surface-elevated);box-shadow:var(--shadow-xl);border:1px solid #ffe0d0}.card-flat{background:var(--surface);box-shadow:var(--shadow-sm);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}.card-gradient{background:var(--surface-elevated);border:1px solid #ffd4c0}.form-group{margin-bottom:var(--space-5)}.form-label{display:block;margin-bottom:var(--space-2);font-weight:600;color:var(--gray-700);font-size:.875rem;letter-spacing:.025em}.form-input{width:100%;padding:var(--space-4) var(--space-4);border:2px solid var(--gray-200);border-radius:var(--radius-xl);font-family:inherit;font-size:1rem;transition:all var(--duration-200) var(--ease-out);background:var(--surface);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.form-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #ffe0d0;transform:translateY(-1px)}.form-input:hover{border-color:var(--gray-300)}.form-input-glass{background:var(--surface-glass);border:1px solid #e5e5e5}.form-input-glass:focus{background:var(--surface-elevated);border-color:#ff8c5a}.text-center{text-align:center}.text-orange{color:var(--orange-dark)}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.grid{display:grid;gap:20px}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}@media (max-width: 768px){.grid-2,.grid-3{grid-template-columns:1fr}.container{padding:0 16px}.nav-desktop{display:none!important}.nav-mobile-toggle{display:block!important}.nav-mobile-menu{display:block!important;overflow:hidden;transition:max-height var(--duration-300) var(--ease-out),opacity var(--duration-300) var(--ease-out),padding-top var(--duration-300) var(--ease-out),padding-bottom var(--duration-300) var(--ease-out),margin-top var(--duration-300) var(--ease-out),border-top-width var(--duration-300) var(--ease-out)}.nav-mobile-menu-closed{max-height:0;opacity:0;padding-top:0;padding-bottom:0;margin-top:0;border-top:1px solid transparent}.nav-mobile-menu-open{max-height:500px;opacity:1;padding-top:16px;padding-bottom:16px;margin-top:16px;border-top:1px solid var(--gray-200)}.nav-logo{font-size:1.25rem!important}.user-name{display:none!important}.account-grid{grid-template-columns:1fr!important;grid-template-areas:"user" "scores" "charts"!important}.card{padding:var(--space-6)}h1{font-size:1.75rem!important}h2{font-size:1.5rem!important}h3{font-size:1.25rem!important}.pick-options{grid-template-columns:1fr!important;gap:var(--space-3)!important}.save-picks-container{max-width:100%!important;left:var(--space-4)!important;right:var(--space-4)!important;transform:none!important}.games-list-with-save{padding-bottom:140px!important}}@media (min-width: 769px){.nav-mobile-menu{display:none!important}.save-picks-container{max-width:400px!important;left:50%!important;right:auto!important;transform:translate(-50%)!important}.games-list-with-save{padding-bottom:160px!important}}@media (max-width: 480px){.container{padding:0 12px}.btn{padding:var(--space-3) var(--space-4);font-size:.875rem}.card{padding:var(--space-4);border-radius:var(--radius-2xl)}h1{font-size:1.5rem!important}h2{font-size:1.25rem!important}h3,.nav-logo{font-size:1.1rem!important}main{padding:var(--space-4) 0!important}.matchweek-selector{gap:var(--space-2)!important;padding:var(--space-3)!important}.matchweek-subtitle{display:none!important}.pick-options{grid-template-columns:1fr!important;gap:var(--space-2)!important}.game-metadata{grid-template-columns:1fr 1fr!important;gap:var(--space-3)!important}.final-score{font-size:1.5rem!important}.save-picks-container{bottom:var(--space-3)!important;right:var(--space-3)!important;left:var(--space-3)!important;transform:none!important}.games-list-with-save{padding-bottom:120px!important}.leaderboard-entry{gap:var(--space-2)!important}.rank-badge{width:36px!important;height:36px!important;font-size:.95rem!important}.username-display{font-size:.95rem!important}.user-badge{display:none!important}.rank-label{font-size:.65rem!important}.account-total-points{font-size:2.5rem!important}.account-header-title{font-size:1.75rem!important}.account-stats-card{font-size:2rem!important}.picks-info-grid{grid-template-columns:1fr!important}.picks-filter-buttons{flex-direction:column!important;width:100%!important}.picks-filter-button{width:100%!important;justify-content:center!important}.account-chart-container{height:250px!important}.account-chart-container>div{height:250px!important}}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideIn{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes bounce{0%,20%,53%,80%,to{transform:translateZ(0)}40%,43%{transform:translate3d(0,-10px,0)}70%{transform:translate3d(0,-5px,0)}90%{transform:translate3d(0,-2px,0)}}@keyframes pulse{0%{box-shadow:0 0 #ff8c5a}70%{box-shadow:0 0 0 10px transparent}to{box-shadow:0 0 0 0 transparent}}.animate-fade-in{animation:fadeIn var(--duration-500) var(--ease-out) forwards}.animate-slide-in{animation:slideIn var(--duration-300) var(--ease-out) forwards}.animate-scale-in{animation:scaleIn var(--duration-300) var(--ease-bounce) forwards}.animate-bounce{animation:bounce 1s infinite}.animate-pulse{animation:pulse 2s infinite}.skeleton{background:var(--gray-100);animation:shimmer 2s infinite;border-radius:var(--radius-lg)}.loading-spinner{width:20px;height:20px;border:2px solid var(--gray-200);border-top:2px solid var(--primary);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.interactive{cursor:pointer;transition:all var(--duration-200) var(--ease-out)}.interactive:hover{transform:translateY(-2px)}.interactive:active{transform:translateY(0) scale(.98)}.games-list{display:flex;flex-direction:column;gap:var(--space-6)}.game-card{display:flex;flex-direction:column;gap:var(--space-5)}.game-card__section{display:flex;flex-direction:column;gap:var(--space-4)}.game-card__pick-grid{display:grid;grid-template-columns:1fr .85fr 1fr;gap:var(--space-3);width:100%}.game-card__score{font-size:1.5rem;font-weight:800;color:var(--primary);background:linear-gradient(135deg,var(--orange-50),rgba(255,237,213,.8));padding:var(--space-3) var(--space-4);border-radius:var(--radius-2xl);border:1px solid rgba(251,146,60,.2);display:flex;align-items:center;justify-content:center;gap:var(--space-2)}.game-card__meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--space-4);background:var(--surface-subtle);padding:var(--space-4);border-radius:var(--radius-xl);box-shadow:inset 0 0 0 1px #94a3b826}.game-card__meta-item{display:flex;flex-direction:column;gap:4px}.game-card__meta-label{font-size:.75rem;color:var(--gray-500);font-weight:600;letter-spacing:.05em;text-transform:uppercase}.game-card__meta-value{font-size:.9rem;font-weight:600;color:var(--gray-800)}.game-card__meta-hint{font-size:.75rem;color:var(--gray-500)}.game-card__lock{font-size:.75rem;color:var(--gray-500);text-align:center;font-weight:600}@media (max-width: 640px){.game-card__score{font-size:1.25rem}}*:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:var(--radius-sm)}html{scroll-behavior:smooth}h1,h2,h3,h4,h5,h6{font-family:var(--heading-font)}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--gray-100);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:var(--radius-full);transition:background var(--duration-200) var(--ease-out)}::-webkit-scrollbar-thumb:hover{background:var(--primary)}