.footer{display:flex;justify-content:center}*{margin:0;box-sizing:border-box}.navbar{width:100%;display:block;flex-shrink:0}.navbar-content{display:flex;align-items:center;padding:1rem;background-color:#1b1818}.navbar-left{display:flex;align-items:center}.navbar-right{display:flex;align-items:center;margin-left:auto;text-align:center}.logo{color:#fff;font-size:1.5rem;font-weight:700;text-decoration:none;cursor:pointer}.nav-links,.nav-links-authenticated,.nav-links-unauthenticated{list-style:none;display:flex;padding:0;margin:0}.nav-links-unauthenticated{background-color:#4f46e5;justify-content:center;border-radius:.3rem;color:#fff;padding-left:.5rem;padding-right:.5rem}li{color:#fff;margin-left:1rem;padding:0;text-align:center}a{color:#fff;text-decoration:none;font-size:1rem}a:hover{text-decoration:underline;transition:.1s}img{width:2rem;height:2rem;border-radius:2rem;margin:0;padding:0}.profile-wrapper{position:relative;display:inline-block}.profile-menu{position:absolute;top:100%;right:0;background:#222;border-radius:8px;box-shadow:.5rem #00000026;list-style:none;padding:0;margin:0;min-width:2rem;display:none;z-index:1000}.profile-wrapper:hover .profile-menu{display:block}.profile-menu li{padding:0;cursor:pointer}.profile-menu li:hover{background:#222}li{cursor:pointer}h1,h2,h3,p{color:#fff}.home-page{display:flex;justify-content:center;flex-direction:column;align-items:center}.spinner{width:50px;height:50px;border:5px solid rgba(0,0,0,.1);border-top:5px solid #abb2b7;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spinner-container{display:flex;justify-content:center;align-items:center;height:100%}.container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:auto}.icon{font-size:"48px";color:#fc0}.text{margin-top:"10px";font-size:"16px";color:"#333",}.card{width:200px;border-radius:.5rem;overflow:hidden;box-shadow:0 4px 8px #01010133;font-family:Arial,sans-serif}.imageContainer{padding:16px;display:flex;justify-content:center;align-items:center}.detailsContainer{padding:0;margin:0}.name{font-size:24px;margin:0;color:#4f46e5}.details{font-size:16px;color:#666;margin-top:8px}a{text-decoration:none;color:#f5f5f5;outline:0;cursor:auto}th,td{text-align:left}td{padding-bottom:.5rem}p{color:#fff}label{color:#fff;padding:.5rem}.filter-row{display:flex;align-items:center;gap:.5rem;width:100%}.filter-row label{white-space:nowrap}.filter-row input{flex:1;min-width:0}#peripheral-name{display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:24px;background:#1e1e1e;border:1px solid #333;width:50%;max-width:600px;color:#fff}#peripheral-type{width:100%;border-radius:24px;border:1px solid #333;background:#1e1e1e;color:#fff;font-size:15px;font-family:inherit;appearance:none;-webkit-appearance:none;-moz-appearance:none;cursor:pointer;transition:.2s ease}.filter-row:after{content:"▾";position:absolute;right:16px;top:50%;transform:translateY(-50%);color:#4f46e5;pointer-events:none;font-size:14px}.filter-row select:hover{border-color:#555}.filter-row select:focus{outline:none;border-color:#4f46e5;box-shadow:0 0 0 2px #10a37f33}.profile{width:100%;background-color:#1b1818;min-width:100%}.profile-header{display:block;justify-content:"center";align-items:"center"}.edit-btn{text-decoration:none;color:#007bff;font-weight:700}.profile img{width:100%;border-radius:50%;width:2rem;height:2rem;box-shadow:0 0 8px #0000001a}.tabs{justify-content:center;display:flex;padding:1rem;margin-bottom:1rem}.tab{padding:1rem;cursor:pointer;font-weight:500;border-bottom:.2rem solid transparent;transition:.3s}.tab:hover{color:#4f46e5}.tab.active{border-bottom-color:#4f46e5;color:#4f46e5}.tab-content{display:none;padding:1rem 0}.tab-content.active{display:block}.profile-peripherals{display:flex;flex-wrap:wrap;justify-content:space-between;background-color:#4f46e5;border-radius:5rem;padding:0}.profile-peripheral{display:flex;justify-content:center;flex-direction:column;padding:.5rem 1rem}.profile-peripheral select{text-align:center;width:fit-content;max-width:90%}.profile-peripheral option{background-color:#000}.players-page{align-items:center;justify-content:center;display:flex;flex-direction:column;flex-wrap:nowrap;padding:0;margin:0}.players-flex-Box{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:flex-start;align-items:flex-start;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;padding:.5rem}.player-card{width:10rem;border-radius:.5rem;overflow:hidden;box-shadow:0 4px 8px #01010133;font-family:Arial,sans-serif}.imageContainer{display:flex}.profileImage{width:75%;height:75%;border-radius:3rem}.chat-input{display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:24px;background:#1e1e1e;border:1px solid #333;width:50%;max-width:600px}.chat-input input{flex:1;resize:none;border:none;outline:none;background:transparent;color:#fff;font-size:16px;font-family:inherit;line-height:1}.chat-input input::placeholder{color:#888}.send-btn{border:none;outline:none;width:25px;height:25px;border-radius:50%;background:#4f46e5;color:#fff;font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.2s ease}.send-btn:hover{background:#8781eb}.auth-container{text-align:center;justify-content:center}.auth-container div{padding:1rem;display:flex;flex-direction:column;align-items:center;justify-content:center}h1{font-size:2rem}.login-button{display:flex;align-items:center;justify-content:center;width:260px;padding:12px 16px;border-radius:8px;color:#fff;font-size:1.1rem;font-weight:700;text-decoration:none;transition:.2s ease}.login-button img{width:24px;height:24px;filter:invert(100%)}.discord{background:#5865f2}.discord:hover{background:#4752c4}.steam{background:#171a21}.steam:hover{background:#0d0f14}.app-wrapper{display:flex;flex-direction:column;min-height:100vh;flex:1 1 auto;min-width:0}a button{cursor:pointer}.container{flex:1;display:flex;flex-direction:row;min-height:0}.cell-outside{flex:10%;height:100%}.cell-middle{flex:80%;height:100%;overflow:hidden}html,body,#root{height:100%;margin:0;padding:0}body{display:flex;flex-direction:column;background-color:#1b1818}#root{display:flex;flex-direction:column}body{font-family:Noto Sans,sans-serif;font-optical-sizing:auto;font-style:normal;font-variation-settings:"width" 100;margin:0;padding:0}.grid-container{display:grid;grid-template-rows:auto 1fr auto;grid-template-areas:"navbar" "main" "footer";width:100%}