: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: var(--orange-600);--primary-light: var(--orange-500);--primary-dark: var(--orange-700);--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: rgba(255, 255, 255, .8);--surface-glass: rgba(255, 255, 255, .6);--surface-elevated: rgba(255, 255, 255, .95);--surface-subtle: rgba(248, 250, 252, .8);--bg-primary: #fafafa;--bg-gradient: linear-gradient(180deg, #ffffff 0%, #fafafa 100%);--bg-subtle: radial-gradient(ellipse 80% 50% at 50% -20%, rgba(249, 115, 22, .03) 0%, transparent 100%);--bg-dots: radial-gradient(circle at 1px 1px, rgba(0,0,0,.15) 1px, transparent 0);--shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1);--shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, .25);--shadow-orange: 0 10px 25px -5px rgba(249, 115, 22, .25), 0 8px 10px -6px rgba(249, 115, 22, .1);--shadow-glow: 0 0 20px rgba(249, 115, 22, .15);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6;font-weight:400;color:var(--gray-800);--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:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);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:linear-gradient(135deg,var(--primary-light),var(--primary));color:#fff;box-shadow:var(--shadow-orange),var(--shadow-glow);border:1px solid rgba(255,255,255,.1)}.btn-primary:hover{background:linear-gradient(135deg,var(--primary),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 rgba(249,115,22,.2)}.btn-secondary:hover{background:var(--surface-elevated);color:var(--gray-800);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.btn-outline{background:#ffffff1a;color:var(--gray-700);border:2px solid rgba(249,115,22,.3);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 rgba(255,255,255,.2);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:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent)}.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-2xl);border-color:#f973164d}.card-elevated{background:var(--surface-elevated);box-shadow:var(--shadow-xl);border:1px solid rgba(249,115,22,.1)}.card-flat{background:var(--surface);box-shadow:var(--shadow-sm);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}.card-gradient{background:linear-gradient(135deg,#fffffff2,#fed7aa1a);border:1px solid rgba(249,115,22,.2)}.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 #f973161a;transform:translateY(-1px)}.form-input:hover{border-color:var(--gray-300)}.form-input-glass{background:var(--surface-glass);border:1px solid rgba(255,255,255,.2)}.form-input-glass:focus{background:var(--surface-elevated);border-color:#f9731680}.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,.nav-mobile-menu{display:block!important}.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){.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 #f9731666}70%{box-shadow:0 0 0 10px #f9731600}to{box-shadow:0 0 #f9731600}}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.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:linear-gradient(90deg,var(--gray-100) 25%,var(--gray-50) 50%,var(--gray-100) 75%);background-size:1000px 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)}*:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:var(--radius-sm)}html{scroll-behavior:smooth}::-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)}
