.landing-page{background-color:#252525;min-height:100vh;animation:.7s both landing-page-enter;overflow-x:hidden}.nav-bar{-webkit-backdrop-filter:blur(12px);z-index:100;background-color:#2525258a;border-bottom:1px solid #f5f0e81a;justify-content:space-between;align-items:center;height:78px;padding:0 24px;animation:.6s both landing-nav-enter;display:flex;position:fixed;top:0;left:0;right:0}.nav-logo{align-items:center;display:flex}.logo{border-radius:8px;width:116px;height:auto;display:block}.nav-auth{color:inherit;border:1px solid #f5f0e847;border-radius:999px;padding:.7rem 1rem;font-family:Verdana,sans-serif;font-size:14px;text-decoration:none;transition:background-color .18s,border-color .18s,transform .18s}.nav-auth:hover{background-color:#f5f0e81a;border-color:#f5f0e88c;transform:translateY(-1px)}.landing-hero{align-items:center;min-height:86vh;padding:7rem 6vw 4.5rem;display:flex;position:relative;overflow:hidden}.hero-demo-image{object-fit:cover;object-position:62% center;width:100%;height:100%;animation:.9s both landing-image-enter;position:absolute;inset:0}.hero-scrim{background:linear-gradient(90deg,#252525f2 0%,#252525c2 34%,#25252533 72%),linear-gradient(#25252500 64%,#252525bd 100%);position:absolute;inset:0}.hero-content{z-index:1;width:min(100%,560px);animation:.8s .12s both landing-content-enter;position:relative}.hero-kicker,.section-label{color:#f5f0e8ad;letter-spacing:0;text-transform:uppercase;font-family:Verdana,sans-serif;font-size:.78rem}.hero-title{color:#f5f0e8;letter-spacing:0;margin-top:.7rem;font-family:Verdana,sans-serif;font-size:clamp(3.2rem,11vw,7.4rem);line-height:.95}.hero-copy{color:#f5f0e8d6;width:min(100%,520px);margin-top:1.25rem;font-family:Verdana,sans-serif;font-size:clamp(1rem,1.65vw,1.24rem);line-height:1.7}.hero-action{color:#252525;background-color:#f5f0e8;border:1px solid #f5f0e8d1;border-radius:999px;justify-content:center;align-items:center;min-height:46px;margin-top:1.65rem;padding:0 1.25rem;font-family:Verdana,sans-serif;font-size:.95rem;text-decoration:none;transition:background-color .18s,transform .18s;display:inline-flex}.hero-action:hover{background-color:#f5f0e8db;transform:translateY(-1px)}.about-section{border-top:1px solid #f5f0e814;width:100%;padding:4.5rem 6vw 5.5rem}.about-container{grid-template-columns:minmax(0,1fr) minmax(260px,420px);align-items:end;gap:3rem;width:100%;max-width:1120px;margin:0 auto;display:grid}.about-copy{max-width:670px}.about-header{color:#f5f0e8;letter-spacing:0;margin-top:.55rem;font-family:Verdana,sans-serif;font-size:clamp(1.85rem,4vw,3.2rem);line-height:1.12}.about-info{text-align:left;color:#f5f0e8c2;width:100%;margin-top:1.2rem;font-family:Verdana,sans-serif;font-size:clamp(.98rem,1.45vw,1.12rem);line-height:1.85}.feature-rail{gap:1rem;display:grid}.feature-step{color:#f5f0e8;border-top:1px solid #f5f0e824;grid-template-columns:48px minmax(0,1fr);align-items:center;gap:1rem;padding:1rem 0;font-family:Verdana,sans-serif;display:grid}.feature-step:last-child{border-bottom:1px solid #f5f0e824}.feature-number{color:#f5f0e875;font-size:.8rem}.feature-step p{font-size:1.05rem}.landing-contact{justify-content:center;padding:0 1.25rem 2.5rem;display:flex}.contact-link{color:#f5f0e8ad;border-bottom:1px solid #f5f0e83d;padding-bottom:.25rem;font-family:Verdana,sans-serif;font-size:.9rem;line-height:1.4;text-decoration:none;transition:color .18s,border-color .18s}.contact-link:hover{color:#f5f0e8;border-color:#f5f0e8ad}@keyframes landing-page-enter{0%{opacity:0}to{opacity:1}}@keyframes landing-nav-enter{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}@keyframes landing-content-enter{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes landing-image-enter{0%{opacity:0;transform:scale(1.025)}to{opacity:1;transform:scale(1)}}@media (width<=768px){.nav-bar{height:70px;padding-inline:16px}.logo{width:104px}.nav-auth{padding-inline:.8rem;font-size:.82rem}.landing-hero{align-items:flex-end;min-height:84vh;padding:6.25rem 1.25rem 3rem}.hero-demo-image{object-position:68% center}.hero-scrim{background:linear-gradient(#2525252e 0%,#252525b8 52%,#252525f0 100%)}.about-section{padding:3.4rem 1.25rem 4.5rem}.about-container{grid-template-columns:1fr;gap:2.4rem}.landing-contact{padding-bottom:2rem}}@media (width<=360px){.hero-title{font-size:2.8rem}.hero-kicker,.section-label{font-size:.72rem}}@media (prefers-reduced-motion:reduce){.landing-page,.nav-bar,.hero-demo-image,.hero-content{animation:none}.nav-auth,.hero-action,.contact-link{transition:none}}.login-page{justify-content:center;align-items:center;min-height:100vh;padding:1rem;display:flex}.signup-page{justify-content:center;align-items:center;min-height:100vh;padding:1rem;display:flex}.clerk-card{background-color:#f5f0e8;width:min(100vw - 2rem,420px)}.onboarding-overlay{background-color:#252525;justify-content:center;align-items:center;width:100%;min-height:100vh;padding:1rem;display:flex}.onboarding-card{color:#1f1f1f;background-color:#f5f0e8;border-radius:16px;width:100%;max-width:420px;padding:2rem;box-shadow:0 20px 50px #00000059}.onboarding-card h2{text-align:center;margin-bottom:.75rem;font-size:1.5rem}.onboarding-card p{text-align:center;color:#555;margin-bottom:1.5rem;font-size:.95rem;line-height:1.5}.onboarding-card form{flex-direction:column;gap:.75rem;display:flex}.onboarding-card label{font-size:.9rem;font-weight:600}.onboarding-card input{border:1px solid #cfc7bb;border-radius:8px;outline:none;padding:.85rem 1rem;font-size:1rem}.onboarding-card input:focus{border-color:#8b6f47}.onboarding-card button{color:#f5f0e8;cursor:pointer;background-color:#252525;border:none;border-radius:8px;margin-top:.5rem;padding:.85rem 1rem;font-size:1rem;font-weight:600}.onboarding-card button:disabled{opacity:.7;cursor:not-allowed}.onboarding-error{color:#b91c1c;font-size:.85rem}.matchReport-overlay{background-color:#252525;justify-content:center;align-items:center;width:100%;min-height:100vh;padding:1rem;display:flex;position:relative}.matchReport-card{color:#000;background-color:#f5f0e8;border-radius:16px;width:100%;max-width:420px;padding:2rem;font-family:Verdana,sans-serif;box-shadow:0 20px 50px #00000059}.close-button{z-index:2;cursor:pointer;color:#000;background-color:#f5f0e8;border:none;border-radius:50%;width:40px;height:40px;font-size:large;position:fixed;top:1rem;right:1rem}.close-button.onError{margin:0}.matchReport-card h2{text-align:center;margin-top:1rem;margin-bottom:.75rem;font-size:1.5rem}.matchReport-card p{text-align:center;color:#555;margin-bottom:1.5rem;font-size:.95rem;line-height:1.5}.matchReport-card form{flex-direction:column;gap:.75rem;display:flex}.matchReport-card label{font-size:.9rem;font-weight:600}.matchReport-card input{border:1px solid #cfc7bb;border-radius:8px;outline:none;padding:.85rem 1rem;font-size:1rem}.matchReport-card input:focus{border-color:#8b6f47}.game-types{grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;display:grid}.game-types button{aspect-ratio:1;cursor:pointer;border:none;border-radius:8px;width:100%;height:auto;margin-right:0;padding:.35rem}.game-type-button.selected{background-color:#d3d3d3;border-color:#8f7a45}.game-types button:hover{background-color:#d3d3d3}.game-types button img{object-fit:contain;width:100%;height:100%;display:block}.match-result{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;display:grid}.won-button{color:#fff;cursor:pointer;background-color:green;border:none;border-radius:8px;width:100%;padding:.85rem 1rem;font-size:1rem}.won-button:hover{opacity:.75}.loss-button{color:#fff;cursor:pointer;background-color:red;border:none;border-radius:8px;width:100%;margin-left:0;padding:.85rem 1rem;font-size:1rem}.loss-button:hover{opacity:.75}.match-result-button.selected{opacity:.25}.confirm-button{color:#fff;cursor:pointer;background-color:#252525;border:none;border-radius:8px;margin-top:.5rem;padding:.85rem 1rem;font-size:1rem;font-weight:600}.confirm-button:hover{opacity:.75}.confirm-button:disabled{opacity:.7;cursor:not-allowed}.match-report-error{color:#b91c1c;font-size:.85rem}.match-report-success{color:green}label{color:#000;margin-bottom:.5rem;font-weight:600;display:block}@media (width<=360px){.matchReport-card{padding:1.35rem}.matchReport-card h2{font-size:1.3rem}}.pending-match-report-overlay{background-color:#252525;justify-content:center;align-items:center;width:100%;min-height:100vh;padding:1rem;display:flex}.pending-match-report-card{color:#000;background-color:#f5f0e8;border-radius:16px;width:100%;max-width:420px;padding:2rem;font-family:Verdana,sans-serif;box-shadow:0 20px 50px #00000059}.pending-match-report-card h2{text-align:center;margin-bottom:.75rem;font-size:1.5rem}.sender-username{text-align:center}.sender-profile-picture{object-fit:cover;border-radius:50%;width:75px;height:75px;display:block}.sender-info-container{text-align:center;justify-content:center;display:flex}.winner-username{margin-bottom:5px}.button-container{text-align:center;justify-content:center;gap:.75rem;display:flex}.button-container button{color:#fff;border:none;border-radius:45px;flex:1;padding:15px;font-size:large}.button-container button:hover{opacity:.5}.accept-button{background-color:green}.decline-button{background-color:red}@media (width<=360px){.pending-match-report-card{padding:1.35rem}.pending-match-report-card h2{font-size:1.3rem}}.menu-container{z-index:100;border-top:1px solid #ffffff1f;justify-content:center;padding:.75rem 1rem;display:flex;position:fixed;bottom:0;left:0;right:0}.menu-container a{color:inherit;text-align:center;border:1px solid #f5f0e8;flex:1;min-width:0;max-width:120px;margin-top:auto;padding:.75rem .7rem;font-family:Verdana;text-decoration:none}.menu-container a.active-menu-link{background-color:#f5f0e82e}@media (width<=360px){.menu-container{padding-inline:.6rem}.menu-container a{padding-inline:.35rem;font-size:.9rem}}.home-page{min-height:100vh;padding-bottom:90px}.home-loading-page{justify-content:center;align-items:center;padding-inline:1.5rem;display:flex}.home-loading-bar{background-color:#333;border:1px solid #f5f0e873;border-radius:999px;width:min(70vw,400px);height:16px;overflow:hidden}.home-loading-fill{border-radius:inherit;background-color:#f5f0e8;width:45%;height:100%;animation:1.1s ease-in-out infinite home-loading-slide}@keyframes home-loading-slide{0%{transform:translate(-120%)}to{transform:translate(240%)}}.rank-change-overlay{z-index:150;pointer-events:none;background:radial-gradient(circle,#f5f0e81c,#2525256b 42%,#252525d1);justify-content:center;align-items:center;padding:1.5rem;animation:2.6s both rank-overlay-fade;display:flex;position:fixed;inset:0}.rank-change-panel{text-align:center;background:linear-gradient(#ffffff0b 1px,#0000 1px) 0 0/100% 9px,#202020eb;border:1px solid #f5f0e857;border-radius:8px;flex-direction:column;align-items:center;width:min(78vw,310px);padding:1.35rem 1.25rem 1.2rem;font-family:Verdana,sans-serif;animation:2.2s both rank-panel-pop;display:flex;position:relative;overflow:hidden;box-shadow:0 24px 70px #0000007a}.rank-change-panel:before{content:"";background:linear-gradient(110deg,#0000,#f5f0e83d,#0000);animation:1.65s ease-out .18s both rank-panel-sweep;position:absolute;inset:0;transform:translate(-130%)}.rank-change-up .rank-change-panel{border-color:#75f7bd8c;box-shadow:0 0 28px #75f7bd2e,0 24px 70px #0000007a}.rank-change-down .rank-change-panel{border-color:#ff9b878c;box-shadow:0 0 28px #ff9b8729,0 24px 70px #0000007a}.rank-change-kicker,.rank-change-title,.rank-change-path,.rank-change-badge{z-index:1;position:relative}.rank-change-kicker{margin-bottom:.55rem;font-size:.82rem;font-weight:700}.rank-change-up .rank-change-kicker{color:#75f7bd}.rank-change-down .rank-change-kicker{color:#ff9b87}.rank-change-badge{width:126px;height:auto;margin-bottom:.55rem}.rank-change-up .rank-change-badge{filter:drop-shadow(0 0 18px #75f7bd57);animation:2.15s both rank-badge-lift}.rank-change-down .rank-change-badge{filter:drop-shadow(0 0 18px #ff9b8747);animation:2.15s both rank-badge-drop}.rank-change-title{color:#f5f0e8;margin-bottom:.35rem;font-size:1.55rem}.rank-change-path{color:#f5f0e8b8;font-size:.78rem}@keyframes rank-overlay-fade{0%{opacity:0}12%,82%{opacity:1}to{opacity:0}}@keyframes rank-panel-pop{0%{opacity:0;transform:translateY(16px)scale(.96)}18%,82%{opacity:1;transform:translateY(0)scale(1)}to{opacity:0;transform:translateY(-8px)scale(.98)}}@keyframes rank-panel-sweep{0%{transform:translate(-130%)}to{transform:translate(130%)}}@keyframes rank-badge-lift{0%{opacity:0;transform:translateY(18px)scale(.86)}24%{opacity:1;transform:translateY(-4px)scale(1.08)}48%,to{opacity:1;transform:translateY(0)scale(1)}}@keyframes rank-badge-drop{0%{opacity:0;transform:translateY(-16px)scale(1.06)}24%{opacity:1;transform:translateY(5px)scale(.96)}44%,to{opacity:1;transform:translateY(0)scale(1)}}@media (prefers-reduced-motion:reduce){.home-loading-fill,.rank-change-overlay,.rank-change-panel,.rank-change-panel:before,.rank-change-badge{animation:none}}.user-profile-pic{width:75px;height:auto;display:block}.user-username{text-align:center;margin-bottom:3px;font-family:Verdana}.container{flex-direction:column;justify-content:center;align-items:center;display:flex}.user-rank-image{width:120px;height:auto;margin-bottom:10px}.elo-bar{background-color:#333;border-radius:999px;width:100%;max-width:400px;height:16px;overflow:hidden}.elo-fill{background-color:#fff;border-radius:999px;height:100%}.elo-rating{margin-top:10px}.report-match{background-color:#f5f0e8;border:none;border-radius:999px;margin-top:75px;padding:30px 55px;font-family:Verdana;font-size:large}.report-match:hover{cursor:pointer;background-color:#f5f0e8cc}.matches-page{color:#f5f0e8;background:radial-gradient(circle at 0 0,#f5f0e81c,#0000 32rem),#252525;min-height:100vh;padding:1.5rem 1rem 6.5rem;font-family:Verdana,sans-serif}.matches-header{justify-content:center;align-items:center;width:100%;max-width:520px;min-height:94px;margin:0 auto;display:flex;position:relative}.matches-profile-pic{object-fit:cover;background-color:#f5f0e8;border:2px solid #f5f0e8bf;border-radius:50%;width:74px;height:74px;position:absolute;left:0}.matches-username{overflow-wrap:anywhere;text-align:center;width:min(68%,320px);font-size:clamp(1.8rem,9vw,2.8rem);font-weight:500;line-height:1.05}.match-history{width:100%;max-width:520px;margin:2.75rem auto 0}.match-history h2{color:#f5f0e8;text-align:center;align-items:center;gap:1rem;margin-bottom:1rem;font-size:clamp(1.35rem,6vw,2rem);font-weight:500;line-height:1.2;display:flex}.match-history h2:before,.match-history h2:after{content:"";background-color:#f5f0e88c;flex:1;height:1px}.match-list{flex-direction:column;gap:.7rem;display:flex}.match-row{background-color:#f5f0e80f;border:1px solid #f5f0e88c;border-radius:8px;grid-template-columns:minmax(74px,1fr) minmax(68px,.9fr) minmax(56px,.75fr) minmax(92px,1fr);align-items:center;gap:.7rem;min-height:64px;padding:.55rem .65rem;display:grid;box-shadow:0 14px 30px #00000029}.match-row-win{border-left:4px solid #5dd17b}.match-row-loss{border-left:4px solid #ff6961}.match-player,.match-opponent{align-items:center;min-width:0;display:flex}.match-player{gap:.45rem}.match-opponent{text-align:center;flex-direction:column;justify-self:end;gap:.18rem}.match-avatar{object-fit:cover;background-color:#f5f0e8;border:1px solid #f5f0e8bf;border-radius:50%;flex:0 0 38px;width:38px;height:38px}.match-opponent-avatar{flex-basis:32px;width:32px;height:32px}.match-game-type,.match-date{color:#f5f0e8c2;white-space:nowrap;font-size:.72rem;line-height:1}.match-elo-change,.match-result,.match-opponent-name{overflow-wrap:anywhere;min-width:0;font-size:clamp(.82rem,3.3vw,1rem);line-height:1.15}.match-elo-change,.match-result{text-align:center}.match-row-win .match-result,.match-row-win .match-elo-change{color:#83e69c}.match-row-loss .match-result,.match-row-loss .match-elo-change{color:#ff8b84}.match-opponent-name{color:#f5f0e8d6;max-width:100%;font-size:.7rem}.matches-empty-state,.matches-state{color:#f5f0e8;text-align:center;background-color:#f5f0e80f;border:1px solid #f5f0e866;border-radius:8px;width:min(100%,420px);margin:26vh auto 0;padding:1.25rem;font-family:Verdana,sans-serif}.matches-empty-state{margin-top:1rem}.matches-state-error{color:#ffb4ae;border-color:#ff696180}@media (width<=420px){.matches-page{padding-inline:.75rem}.matches-header{min-height:84px}.matches-profile-pic{width:62px;height:62px}.match-history{margin-top:2.1rem}.match-row{grid-template-columns:64px minmax(54px,.8fr) minmax(44px,.65fr) minmax(74px,.9fr);gap:.45rem;padding-inline:.5rem}.match-avatar{flex-basis:34px;width:34px;height:34px}.match-opponent-avatar{flex-basis:30px;width:30px;height:30px}.match-game-type,.match-date{font-size:.65rem}}body{color:#fff;background-color:#252525;margin:0}*{box-sizing:border-box;margin:0;padding:0}