.games{background-color:#1b3a4b}.games-container{grid-gap:16px;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));grid-auto-flow:dense;grid-auto-flow:dense;padding:20px;display:grid}.page-loader{z-index:9999;background:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.spinner{border:4px solid #fff;border-top-color:#0000;border-radius:50%;width:45px;height:45px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.card{text-align:center;cursor:pointer;aspect-ratio:1;background-color:#284758;border-radius:16px;width:100%;min-width:100px;min-height:100px;position:relative;overflow:hidden;box-shadow:0 4px 12px #00000040}.card img{object-fit:cover;cursor:pointer;border-radius:15px;width:100%;height:100%}.card p{color:#fff;margin-top:5px;font-size:12px}.card.large.center{grid-area:1/5/span 3/span 3}.card.large.right{grid-area:1/12/span 3/span 3}.featured img{object-fit:cover;border-radius:20px;width:100%;max-height:280px;margin:20px}.card{transition:transform .3s,box-shadow .3s,border .3s}.overlay{color:#fff;opacity:0;text-align:center;background:linear-gradient(#0000,#0006);justify-content:center;align-items:flex-end;font-size:20px;transition:all;display:flex;position:absolute;inset:0;transform:translateY(100%)}.overlay p{text-align:center;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;justify-content:center;align-items:center;width:100%;margin-bottom:8px;font-size:15px;font-weight:600;line-height:1.1;display:-webkit-box;overflow:hidden}.card{transition:transform .3s,box-shadow .3s;display:flex;position:relative}.card:hover .overlay{opacity:1;transform:translateY(0)}.card:hover{z-index:1000;border:3px solid #fff;transform:scale(1.03)translateY(-5px);box-shadow:0 8px 20px #0000004d}.page-wrapper{flex-direction:column;min-height:100vh;display:flex}.f-line{background-color:#eee;height:1px;margin:0 auto 24px}.footer{text-align:center;color:#e0e0e0;background:0 0;padding:20px 10px;font-size:14px}.footer-links{margin-bottom:8px}.footer-links a{color:#e0e0e0;margin:0 12px;text-decoration:none;transition:all .2s}.footer-copy{opacity:.7;font-size:13px}@media (max-width:1650px){.games-container{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:12px;padding:15px}.card{min-width:100px;min-height:100px}.card p{font-size:11px}.card.large.center{grid-area:1/4/span 3/span 3}.card.large.right{grid-area:1/10/span 3/span 3}}@media (max-width:1500px){.games-container{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:12px;padding:15px}.card{min-width:100px;min-height:100px}.card p{font-size:11px}.featured img{max-height:200px;margin:15px}.card.large.center{grid-area:1/5/span 3/span 3}.card.large.right{grid-area:2/2/span 3/span 3}}@media (max-width:1024px){.games-container{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px;padding:15px}.card{min-width:130px;min-height:130px}.card p{font-size:11px}.featured img{max-height:200px;margin:15px}.card.large.center{grid-area:1/2/span 3/span 3}.card.large.right{grid-area:4/5/span 3/span 3}}@media (max-width:998px){.games-container{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:12px;padding:15px}.card{min-width:90px;min-height:90px}.card p{font-size:11px}.featured img{max-height:200px;margin:15px}.card.large.center{grid-area:1/2/span 3/span 3}.card.large.right{grid-area:4/5/span 3/span 3}}@media (max-width:768px){.games-container{grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:16px;padding:10px}.card{border-radius:12px;min-width:90px;min-height:90px}.card img{border-radius:12px}.card p{font-size:10px}.featured img{max-height:160px;margin:10px}.overlay{padding:6px;font-size:11px}.card.large.center{grid-area:1/2/span 3/span 3}.card.large.right{grid-area:4/5/span 3/span 3}}@media (max-width:540px){.games-container{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:16px;padding:10px}.card{border-radius:12px;min-width:100px;min-height:100px}.card img{border-radius:12px}.card p{font-size:10px}.featured img{max-height:160px;margin:10px}.overlay{padding:6px;font-size:11px}.card.large.center{grid-area:1/1/span 2/span 2}.card.large.right{grid-area:3/2/span 2/span 2}}@media (max-width:480px){.games-container{grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:16px;padding:10px}.card{border-radius:12px;min-width:90px;min-height:90px}.card img{border-radius:12px}.card p{font-size:10px}.featured img{max-height:160px;margin:10px}.overlay{padding:6px;font-size:11px}.card.large.center{grid-area:1/1/span 2/span 2}.card.large.right{grid-area:3/2/span 2/span 2}}