:root{--sofa-bg-primary:#fff;--sofa-bg-secondary:#f8fafc;--sofa-bg-tertiary:#f1f5f9;--sofa-bg-card:#fff;--sofa-bg-hover:#f1f5f9;--sofa-text-primary:#0f172a;--sofa-text-secondary:#475569;--sofa-text-muted:#64748b;--sofa-text-accent:#00d4aa;--sofa-border:#e2e8f0;--sofa-border-light:#f1f5f9;--sofa-green:#00d4aa;--sofa-red:#ff4757;--sofa-orange:#ffa726;--sofa-blue:#3b82f6;--sofa-yellow:gold;--sofa-gradient-primary:linear-gradient(135deg,#00d4aa 0%,#00a085 100%);--sofa-gradient-card:linear-gradient(145deg,#fff 0%,#f8fafc 100%);--sofa-shadow:0 4px 20px #0000001a;--sofa-shadow-hover:0 8px 30px #00000026;--sofa-radius:12px;--sofa-radius-sm:8px;--sofa-radius-lg:16px}.dark{--sofa-bg-primary:#0f1419;--sofa-bg-secondary:#1a1f29;--sofa-bg-tertiary:#242b38;--sofa-bg-card:#1e252f;--sofa-bg-hover:#2a3441;--sofa-text-primary:#fff;--sofa-text-secondary:#b8c5d1;--sofa-text-muted:#8a9ba8;--sofa-text-accent:#00d4aa;--sofa-border:#2a3441;--sofa-border-light:#3a4553;--sofa-green:#00d4aa;--sofa-red:#ff4757;--sofa-orange:#ffa726;--sofa-blue:#3b82f6;--sofa-yellow:gold;--sofa-gradient-primary:linear-gradient(135deg,#00d4aa 0%,#00a085 100%);--sofa-gradient-card:linear-gradient(145deg,#1e252f 0%,#242b38 100%);--sofa-shadow:0 4px 20px #0000004d;--sofa-shadow-hover:0 8px 30px #0006}.sofa-theme{background:var(--sofa-bg-primary);color:var(--sofa-text-primary);width:100%;min-height:100vh;transition:background-color .3s,color .3s;position:relative;overflow-x:hidden}.sofa-card{background:var(--sofa-bg-card);border:1px solid var(--sofa-border);border-radius:var(--sofa-radius);box-shadow:var(--sofa-shadow);transition:all .3s cubic-bezier(.4,0,.2,1)}.sofa-card:hover{background:var(--sofa-bg-hover);box-shadow:var(--sofa-shadow-hover);transform:translateY(-2px)}.sofa-card-gradient{background:var(--sofa-gradient-card);border:1px solid var(--sofa-border);border-radius:var(--sofa-radius);box-shadow:var(--sofa-shadow)}.sofa-match-card{background:var(--sofa-bg-card);border:1px solid var(--sofa-border);border-radius:var(--sofa-radius);padding:20px;transition:all .3s;position:relative;overflow:hidden}.sofa-match-card:before{content:"";background:var(--sofa-gradient-primary);opacity:0;height:3px;transition:opacity .3s;position:absolute;top:0;left:0;right:0}.sofa-match-card:hover:before{opacity:1}.sofa-match-card:hover{background:var(--sofa-bg-hover);border-color:var(--sofa-border-light);box-shadow:var(--sofa-shadow-hover);transform:translateY(-4px)}.sofa-table{background:var(--sofa-bg-card);border-radius:var(--sofa-radius);box-shadow:var(--sofa-shadow);overflow:hidden}.sofa-table thead{background:var(--sofa-bg-tertiary)}.sofa-table th{color:var(--sofa-text-secondary);text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--sofa-border);padding:16px 20px;font-size:.875rem;font-weight:600}.sofa-table td{border-bottom:1px solid var(--sofa-border);color:var(--sofa-text-primary);padding:16px 20px}.sofa-table tbody tr:hover{background:var(--sofa-bg-hover)}.sofa-table tbody tr:last-child td{border-bottom:none}.sofa-btn{background:var(--sofa-gradient-primary);color:#fff;border-radius:var(--sofa-radius-sm);cursor:pointer;text-transform:uppercase;letter-spacing:.5px;border:none;padding:12px 24px;font-size:.875rem;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.sofa-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #00d4aa4d}.sofa-btn-secondary{background:var(--sofa-bg-tertiary);color:var(--sofa-text-primary);border:1px solid var(--sofa-border)}.sofa-btn-secondary:hover{background:var(--sofa-bg-hover);border-color:var(--sofa-border-light)}.sofa-stat-card{background:var(--sofa-gradient-card);border:1px solid var(--sofa-border);border-radius:var(--sofa-radius);text-align:center;padding:24px;position:relative;overflow:hidden}.sofa-stat-card:before{content:"";background:var(--sofa-gradient-primary);height:2px;position:absolute;top:0;left:0;right:0}.sofa-stat-number{color:var(--sofa-text-accent);margin-bottom:8px;font-size:2.5rem;font-weight:700;line-height:1}.sofa-stat-label{color:var(--sofa-text-secondary);text-transform:uppercase;letter-spacing:.5px;font-size:.875rem;font-weight:500}.sofa-nav{background:var(--sofa-bg-secondary);border-bottom:1px solid var(--sofa-border);-webkit-backdrop-filter:blur(20px);padding:16px 0;transition:all .3s}.sofa-theme-toggle{border-radius:var(--sofa-radius-sm);background:var(--sofa-bg-hover);border:1px solid var(--sofa-border);width:40px;height:40px;color:var(--sofa-text-secondary);cursor:pointer;justify-content:center;align-items:center;transition:all .3s;display:flex}.sofa-theme-toggle:hover{background:var(--sofa-bg-tertiary);color:var(--sofa-text-accent);transform:scale(1.05)}.sofa-nav-item{color:var(--sofa-text-secondary);border-radius:var(--sofa-radius-sm);padding:12px 20px;font-weight:500;text-decoration:none;transition:all .2s cubic-bezier(.4,0,.2,1);position:relative}.sofa-nav-item:after{content:"";background:var(--sofa-text-accent);width:0;height:2px;transition:all .3s cubic-bezier(.4,0,.2,1);position:absolute;bottom:-2px;left:50%;transform:translate(-50%)}.sofa-nav-item:hover,.sofa-nav-item.active{color:var(--sofa-text-accent);background:#00d4aa1a}.sofa-nav-item:hover:after,.sofa-nav-item.active:after{width:80%}.sofa-score{color:var(--sofa-text-primary);text-align:center;background:var(--sofa-bg-tertiary);border-radius:var(--sofa-radius-sm);border:1px solid var(--sofa-border);padding:16px;font-size:2rem;font-weight:700}.sofa-score-live{color:var(--sofa-text-accent);animation:2s infinite pulse}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.sofa-team{align-items:center;gap:12px;display:flex}.sofa-team-logo{background:var(--sofa-bg-tertiary);border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:1.2rem;display:flex}.sofa-team-name{color:var(--sofa-text-primary);font-weight:600}.sofa-badge{text-transform:uppercase;letter-spacing:.5px;border-radius:20px;padding:4px 12px;font-size:.75rem;font-weight:600}.sofa-badge-live{color:var(--sofa-red);border:1px solid var(--sofa-red);background:#ff475733}.sofa-badge-completed{color:var(--sofa-green);border:1px solid var(--sofa-green);background:#00d4aa33}.sofa-badge-scheduled{color:var(--sofa-text-secondary);border:1px solid var(--sofa-border);background:#b8c5d133}@media (max-width:768px){.sofa-theme{width:100%;position:relative}.sofa-card{border-radius:var(--sofa-radius-sm);box-sizing:border-box;max-width:100%;margin:8px}.sofa-match-card{box-sizing:border-box;max-width:100%;padding:16px}.sofa-stat-number{font-size:2rem}.sofa-table{border-radius:var(--sofa-radius);box-shadow:var(--sofa-shadow);background:var(--sofa-bg-card)}.sofa-table th,.sofa-table td{white-space:nowrap;min-width:fit-content;padding:8px 12px}.sofa-nav{padding:12px 0}.sofa-nav .max-w-7xl{padding:0 16px}.sofa-team-name{text-overflow:ellipsis;white-space:nowrap;max-width:120px;overflow:hidden}}@media (max-width:480px){.sofa-theme{-webkit-overflow-scrolling:touch}.sofa-nav-item{padding:8px 12px;font-size:.875rem}.sofa-stat-card{padding:16px}.sofa-stat-number{font-size:1.75rem}.sofa-match-card{min-height:auto;padding:16px}.sofa-team{gap:8px}.sofa-team-name{max-width:120px;font-size:.875rem;line-height:1.2}.sofa-mobile-menu{width:100vw;max-width:320px}body.mobile-menu-open{width:100%;position:fixed;overflow:hidden}}.sofa-user-menu{background:var(--sofa-bg-card);border:1px solid var(--sofa-border);border-radius:var(--sofa-radius);box-shadow:0 10px 40px #0006}.sofa-mobile-menu{background:var(--sofa-bg-card);border-right:1px solid var(--sofa-border);box-shadow:4px 0 20px #0000004d}.sofa-mobile-menu-overlay{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#00000080}@keyframes slideInLeft{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes slideOutLeft{0%{transform:translate(0)}to{transform:translate(-100%)}}.mobile-menu-enter{animation:.3s ease-out slideInLeft}.mobile-menu-exit{animation:.3s ease-out slideOutLeft}.sofa-fab{background:var(--sofa-text-accent);transition:all .3s;box-shadow:0 8px 25px #00d4aa4d}.sofa-fab:hover{background:var(--sofa-green);transform:translateY(-2px);box-shadow:0 12px 35px #00d4aa66}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--sofa-bg-secondary)}::-webkit-scrollbar-thumb{background:var(--sofa-bg-tertiary);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--sofa-border-light)}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}.scrollbar-hide::-webkit-scrollbar{display:none}html,body{box-sizing:border-box;width:100%;position:relative}@media (max-width:640px){.container,.max-w-7xl,.max-w-6xl,.max-w-5xl,.max-w-4xl{width:100%!important;max-width:100%!important;padding-left:1rem!important;padding-right:1rem!important}.sofa-table{background:var(--sofa-bg-card);border-radius:var(--sofa-radius);box-shadow:var(--sofa-shadow)}.hero-section{width:100%;max-width:100%;padding-left:1rem;padding-right:1rem}.sofa-card,.sofa-match-card,.sofa-stat-card{width:100%;max-width:100%;margin-left:0;margin-right:0}}.safe-area-pb{padding-bottom:env(safe-area-inset-bottom)}.bottom-nav-item{transition:all .2s ease-in-out;position:relative}.bottom-nav-item.active{transform:translateY(-2px)}.bottom-nav-item.active:before{content:"";background:var(--sofa-green);border-radius:2px;width:32px;height:4px;position:absolute;top:-2px;left:50%;transform:translate(-50%)}.mobile-header{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2}.bottom-menu-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}@media (max-width:768px){.sofa-theme{padding-bottom:0}.main-content{padding-bottom:80px}}@supports (padding-bottom:env(safe-area-inset-bottom)){.safe-area-pb{padding-bottom:calc(8px + env(safe-area-inset-bottom))}}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:.5s ease-out fadeIn}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.slide-up{animation:.4s ease-out slideUp}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.scale-in{animation:.3s ease-out scaleIn}@keyframes shimmer{0%{background-position:-200px 0}to{background-position:calc(200px + 100%) 0}}.loading-shimmer{background:linear-gradient(90deg,var(--sofa-bg-secondary)25%,var(--sofa-bg-tertiary)50%,var(--sofa-bg-secondary)75%);background-size:200px 100%;animation:1.5s infinite shimmer}.hover-lift{transition:all .2s cubic-bezier(.4,0,.2,1)}.hover-lift:hover{transform:translateY(-2px);box-shadow:0 8px 25px #00000026}.hover-scale{transition:transform .2s cubic-bezier(.4,0,.2,1)}.hover-scale:hover{transform:scale(1.02)}.focus-ring{transition:all .2s cubic-bezier(.4,0,.2,1)}.focus-ring:focus{outline:2px solid var(--sofa-text-accent);outline-offset:2px;box-shadow:0 0 0 4px #00d4aa1a}.sofa-btn:before{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.sofa-btn:hover:before{left:100%}.sofa-btn:active{transform:translateY(1px)}.sofa-table tbody tr{transition:all .2s cubic-bezier(.4,0,.2,1)}.sofa-table tbody tr:hover{background:var(--sofa-bg-hover);transform:translate(2px);box-shadow:2px 0 4px #00000014}.stagger-item{opacity:0;animation:.5s ease-out forwards fadeInUp;transform:translateY(20px)}.stagger-item:first-child{animation-delay:.1s}.stagger-item:nth-child(2){animation-delay:.2s}.stagger-item:nth-child(3){animation-delay:.3s}.stagger-item:nth-child(4){animation-delay:.4s}.stagger-item:nth-child(5){animation-delay:.5s}@keyframes fadeInUp{to{opacity:1;transform:translateY(0)}}.sofa-btn:focus,.sofa-nav-item:focus,button:focus,select:focus,input:focus{outline:2px solid var(--sofa-text-accent);outline-offset:2px;box-shadow:0 0 0 4px #00d4aa1a}.loading-pulse{animation:2s cubic-bezier(.4,0,.6,1) infinite pulse}*{transition:background-color .3s,color .3s,border-color .3s}@media (max-width:768px){.hover-lift:active,.hover-scale:active{transform:scale(.98)}.sofa-card:active{transform:translateY(1px)}.sofa-btn,.sofa-nav-item,button{min-width:44px;min-height:44px}}
