.games-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 18px 14px;
    padding-bottom: 44px;
}
.game-card {
    background: transparent;
    border: 0;
    border-radius: 0;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    cursor: pointer;
    overflow: hidden;
    min-width: 0;
}
.game-card:hover {
    transform: none;
    border-color: transparent;
    box-shadow: none;
}
.game-card.destacado { border-color: transparent; animation: none; }
@keyframes pulse-border {
    0%, 100% { box-shadow: 0 0 5px var(--color-neon-yellow); }
    50% { box-shadow: 0 0 20px var(--color-neon-yellow), 0 0 40px #FFE60044; }
}
.game-cover { position: relative; display: block; aspect-ratio: 1 / 1; overflow: hidden; background: #DDE1E6; border-radius: 8px; }
.game-cover img { width: 100%; height: 100%; object-fit: cover; }
.play-overlay {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    background: rgba(23,32,51,.42);
    color: white;
    font-family: var(--font-body);
    font-size: 1.1rem;
    opacity: 0;
    transition: opacity .2s ease;
}
.game-card:hover .play-overlay { opacity: 1; }
.game-card-body { padding: 8px 0 0; display: grid; gap: 4px; }
.game-card h3 { margin: 0; font-size: .98rem; line-height: 1.2; font-weight: 800; }
.game-card h3 a { color: var(--color-text); text-decoration: none; }
.game-card p { margin: 0; color: var(--color-text-muted); font-size: .88rem; font-weight: 600; }
.game-stats { display: flex; justify-content: flex-start; gap: 10px; color: var(--color-text-muted); font-family: var(--font-body); font-size: .85rem; font-weight: 700; }
.btn-card-play { display: none; }
.skeleton {
    min-height: 280px;
    border: 1px solid var(--color-border);
    background: linear-gradient(90deg, var(--color-surface), #E8EEF7, var(--color-surface));
    background-size: 220% 100%;
    animation: skeleton 1.1s linear infinite;
}
@keyframes skeleton { to { background-position: -220% 0; } }
@media (max-width: 1180px) { .games-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (max-width: 960px) { .games-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 720px) { .games-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 520px) { .games-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.home-page .games-grid {
    gap: 18px;
}
.home-page .game-card {
    position: relative;
    border-radius: 8px;
    background: #121827;
    box-shadow: 0 14px 28px rgba(0,0,0,.22);
}
.home-page .game-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 38px rgba(0,0,0,.32);
}
.home-page .game-cover {
    border-radius: 8px 8px 0 0;
    background: #1F2937;
}
.home-page .game-card-body {
    gap: 5px;
    padding: 10px 12px 12px;
}
.home-page .game-card h3 a {
    color: #FFFFFF;
}
.home-page .game-card p,
.home-page .game-stats {
    color: rgba(255,255,255,.72);
}
.home-page .game-card .category-badge {
    position: absolute;
    right: 8px;
    top: 8px;
    max-width: calc(100% - 16px);
    padding: 5px 8px;
    border-color: rgba(255,255,255,.22);
    background: rgba(12, 16, 29, .76);
    color: #FFFFFF;
    font-size: .74rem;
    backdrop-filter: blur(8px);
}
.home-page .featured-badge,
.home-page .achievement {
    width: fit-content;
    background: rgba(255,255,255,.08);
    border-color: rgba(255,255,255,.14);
    color: #FFFFFF;
}
.home-page .play-overlay {
    background: rgba(8, 12, 22, .58);
    font-weight: 950;
}
@media (max-width: 520px) {
    .home-page .game-card .category-badge {
        position: static;
        width: fit-content;
    }
}