/* Compact home: shared GameCard markup, denser rails, no autoplay. */
.home-page {
    padding-top: 138px;
}
.home-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}
.home-heading .eyebrow {
    color: var(--tone-969ca9);
    font-size: 8px;
    letter-spacing: 1.5px;
}
.home-heading h1 {
    margin-top: 10px;
    max-width: 290px;
    font-size: 24px;
    line-height: 1.2;
    letter-spacing: -.9px;
    font-weight: 650;
}
.home-heading h1 > span { color: var(--accent); }
.home-heading > .demo-label { display: none; }
.home-page .category-bar {
    margin: 18px 0;
    padding: 0;
    border: 0;
}
.home-page .category-pill {
    min-height: 42px;
    padding-inline: 13px;
}
.home-page .catalog-count { display: none; }
.game-showcase {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
    margin-bottom: 27px;
}
.game-showcase > .game-card--spotlight { display: none; }
.game-showcase .game-card {
    height: 190px;
    position: relative;
    border-radius: var(--radius);
    isolation: isolate;
}
.game-showcase .game-cover {
    height: 100%;
    aspect-ratio: auto;
}
.game-showcase .cover-gradient {
    background: linear-gradient(0deg, var(--tone-07090ef0), var(--tone-07090e10) 80%);
}
.game-showcase .card-details {
    pointer-events: none;
    position: absolute;
    bottom: 20px;
    left: 18px;
    right: 64px;
    margin: 0;
    display: block;
    z-index: 1;
}
.game-showcase .card-details a { pointer-events: auto; }
.game-showcase .card-details h3 {
    font-size: 27px;
    letter-spacing: -.8px;
    font-weight: 700;
}
.game-showcase .card-details > div > span {
    color: var(--tone-d3d6de);
    font-size: 11px;
    margin-top: 6px;
}
.game-showcase .card-rating { display: none; }
.game-showcase .quick-play {
    opacity: 1;
    transform: none;
    width: 44px;
    height: 44px;
    bottom: 20px;
    right: 17px;
    z-index: 2;
}
.game-showcase .card-favorite { z-index: 3; opacity: 1; }
.game-showcase .card-badge { top: 14px; left: 14px; }
.home-page .game-section { margin-bottom: 29px; }
.home-page .section-heading { gap: 12px; margin-bottom: 15px; }
.home-page .section-heading h2 { font-size: 18px; letter-spacing: -.5px; }
.home-page .section-heading p { font-size: 10px; line-height: 1.5; margin-top: 5px; }
.home-page .section-actions { flex-shrink: 0; gap: 14px; }
.home-page .carousel-track {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-flow: row;
    grid-auto-columns: auto;
    gap: 18px 12px;
    overflow: visible;
    scroll-snap-type: none;
    margin: 0;
    padding: 0;
}
.home-page .carousel-track > .game-card:nth-child(n+5) { display: none; }
.home-page .card-details { gap: 5px; margin-top: 9px; }
.home-page .card-details h3 { font-size: 12px; }
.home-page .card-details > div > span { font-size: 9px; }
.home-page .card-rating { font-size: 9px; }
.home-page .game-cover { border-radius: 12px; }
.home-page .card-badge { font-size: 8px; top: 7px; left: 7px; padding: 3px 5px; }
.home-page .game-card--featured .card-badge { top: 14px; left: 14px; font-size: 9px; }
.home-page .game-card--featured .card-details h3 { font-size: 27px; }
.home-page .game-card--featured .card-details > div > span { font-size: 11px; }
.home-page .quick-play { width: 44px; height: 44px; right: 5px; bottom: 4px; background: var(--tone-10151dbd); border: 1px solid var(--tone-ffffff28); }
.home-page .quick-play:hover { background: var(--accent); }
.home-page .game-card--featured .quick-play { right: 17px; bottom: 20px; background: var(--accent); }
.home-page .card-favorite { width: 44px; height: 44px; top: 0; right: 0; border: 0; background: radial-gradient(circle, var(--tone-0b0d12ac) 40%, transparent 44%); }
.home-page .card-favorite:hover { background: radial-gradient(circle, var(--tone-252c39) 40%, transparent 44%); }
.home-page .card-badge { max-width: calc(100% - 52px); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.resume-label {
    position: absolute;
    left: 10px;
    bottom: 10px;
    font-size: 9px;
    color:var(--text-primary);
    text-shadow: 0 1px 6px var(--shadow-color);
    pointer-events: none;
}
.discover-section { border-top: 1px solid var(--line); padding-top: 26px; }
.discover-section .eyebrow { font-size: 8px; color: var(--muted); margin-bottom: 9px; }
.discover-section .section-heading { align-items: center; }
.discover-section .section-heading > .text-link { display: none; }
.discover-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 21px 12px; }
/* Loading states reserve the cover box; no JavaScript means ordinary images. */
.game-cover.is-loading { overflow: hidden; }
.game-cover.is-loading::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(105deg, transparent 30%, var(--tone-ffffff09) 48%, transparent 67%);
    transform: translateX(-100%);
    animation: cover-shimmer 1.6s ease-in-out infinite;
    pointer-events: none;
    z-index: -1;
}
.game-cover.is-loading .cover-link img { opacity: 0; }
.game-cover .cover-link img { transition: opacity .2s, transform .3s; }
.image-unavailable {
    position: absolute;
    inset: 35% 10% auto;
    text-align: center;
    font-size: 10px;
    color: var(--muted);
    pointer-events: none;
}
.game-cover.has-image-error .cover-link img { visibility: hidden; }
@keyframes cover-shimmer { to { transform: translateX(100%); } }
@media (min-width: 700px) {
    .home-page { padding-top: 105px; }
    .home-heading h1 { max-width: none; font-size: 27px; }
    .home-heading > .demo-label { display: inline-block; flex-shrink: 0; }
    .home-page .category-bar { margin: 19px 0 21px; }
    .game-showcase { grid-template-columns: minmax(0, 2fr) repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 27px; }
    .game-showcase > .game-card--spotlight { display: block; }
    .game-showcase .game-card { height: 220px; }
    .game-showcase .card-details { left: 13px; right: 13px; bottom: 19px; }
    .game-showcase .game-card--spotlight .card-details h3 { font-size: 15px; letter-spacing: -.3px; }
    .game-showcase .game-card--spotlight .card-details > div > span { font-size: 9px; }
    .game-showcase .game-card--spotlight .quick-play { bottom: 67px; right: 10px; width: 36px; height: 36px; }
    .game-showcase .game-card--featured .card-details { right: 65px; left: 20px; }
    .home-page .section-heading h2 { font-size: 20px; }
    .home-page .section-heading p { font-size: 11px; }
    .home-page .carousel-track { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: calc((100% - 42px) / 4); gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 6px 2px 10px; margin: -6px -2px -10px; }
    .home-page .carousel-track > .game-card:nth-child(n+5) { display: block; }
    .home-page .card-details h3 { font-size: 12px; }
    .home-page .game-section { margin-bottom: 32px; }
    .home-page .carousel-controls .icon-button { width: 36px; height: 36px; }
    .discover-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px 14px; }
    .discover-section .section-heading > .text-link { display: inline-flex; }
    .discover-section { padding-top: 29px; }
}
@media (min-width: 1100px) {
    .home-heading h1 { font-size: 29px; }
    .game-showcase { gap: 16px; }
    .game-showcase .game-card { height: 260px; }
    .game-showcase .game-card--featured .card-details h3 { font-size: 34px; }
    .game-showcase .game-card--spotlight .card-details { bottom: 22px; left: 17px; }
    .game-showcase .game-card--spotlight .card-details h3 { font-size: 19px; }
    .game-showcase .game-card--spotlight .quick-play { bottom: 22px; right: 13px; opacity: 0; }
    .game-showcase .game-card--spotlight .card-details { right: 50px; }
    .game-showcase .game-card--spotlight:hover .quick-play, .game-showcase .game-card--spotlight:focus-within .quick-play { opacity: 1; }
    .home-page .carousel-track { grid-auto-columns: calc((100% - 64px) / 5); gap: 16px; }
    .home-page .game-section { margin-bottom: 33px; }
    .home-page .card-details h3 { font-size: 13px; }
    .home-page .card-details > div > span, .home-page .card-rating { font-size: 10px; }
    .home-page .quick-play { width: 36px; height: 36px; bottom: 9px; right: 9px; }
    .home-page .game-card--featured .quick-play { width: 44px; height: 44px; }
    .discover-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 25px 16px; }
    .home-page .game-card:hover { transform: translateY(-3px); }
}
@media (min-width: 1400px) {
    .home-page .carousel-track { grid-auto-columns: calc((100% - 80px) / 6); }
    .discover-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
@media (hover: none) {
    .home-page .quick-play { opacity: 1; transform: none; width: 44px; height: 44px; }
    .game-showcase .game-card--spotlight .quick-play { opacity: 1; bottom: 65px; }
}
@media (prefers-reduced-motion: reduce) {
    .game-cover.is-loading::after { animation: none; transform: none; background: var(--tone-ffffff04); }
}

.category-pill img{width:20px;height:20px;object-fit:contain;flex-shrink:0}

/* Favorites retain the existing game grid, card and navigation tokens. */
.desktop-nav a>svg,.mobile-nav a>svg{width:14px;height:14px;margin-right:6px;flex-shrink:0}
.mobile-nav a{position:relative;display:inline-flex;align-items:center;min-height:44px}
.mobile-nav a[aria-current=page]{color:var(--text-primary)}
.mobile-nav a[aria-current=page]:after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--accent)}
[data-favorite].is-favorite svg{fill:currentColor}
[data-favorite]{transition:color .2s,background .2s,transform .2s}
[data-favorite]:active{transform:scale(.92)}
.favorites-page .catalog-count{display:flex;align-items:center;gap:6px;color:var(--text-secondary)}
.favorites-page .catalog-heading{flex-wrap:wrap;gap:18px}
[data-saved-game]{min-width:0}
@media(min-width:1100px) and (max-width:1399px){.desktop-nav{gap:16px;margin-left:8px}.header-inner{gap:16px}.search{min-width:120px;width:190px}}