/* Migrated by tools/migrate_design_css.py from the approved 2026-08-23 public UI. */
.section-tabs,
.games-section-nav {
    display: inline-flex;
    width: fit-content;
    max-width: 100%;
    flex-wrap: wrap;
    gap: 0;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
}

.section-tabs a,
.games-section-nav a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-xs);
    min-height: 2.75rem;
    padding: var(--space-sm) var(--space-md);
    color: var(--color-ink);
    background: var(--color-paper);
    border: 1px solid var(--arvr-rule);
    margin-left: -1px;
    font-family: var(--arvr-mono);
    font-size: var(--arvr-nav-size);
    font-weight: 500;
    letter-spacing: var(--arvr-tracking);
    text-transform: uppercase;
    text-decoration: none;
    line-height: 1;
    white-space: nowrap;
    position: relative;
    transition: background var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);
}

.section-tabs a:first-child,
.games-section-nav a:first-child {
    margin-left: 0;
}

.section-tabs a i,
.games-section-nav a i {
    display: inline-flex;
    align-items: center;
    font-size: var(--font-size-sm);
    line-height: 1;
}

.section-tabs a:hover,
.games-section-nav a:hover {
    background: var(--color-surface-strong);
    color: var(--color-ink);
    z-index: 1;
}

.section-tabs a:is(.is-active, [aria-current="page"]),
.games-section-nav a:is(.is-active, [aria-current="page"]) {
    background: var(--color-ink);
    color: var(--color-on-dark);
    border-color: var(--color-ink);
    z-index: 2;
}

.game-detail > .container > .games-section-nav,
.game-review-page > .container > .games-section-nav {
    margin: 0 0 var(--space-lg);
}

:is(.section-tabs-dock, .game-detail-tabs-dock, .game-review-tabs-dock) {
    display: flex;
    width: fit-content;
    max-width: 100%;
    margin-top: 0;
    margin-bottom: -1px;
    position: relative;
    z-index: 2;
}

:is(.section-tabs-dock, .game-detail-tabs-dock, .game-review-tabs-dock) :is(.games-section-nav, .section-tabs) {
    margin: 0;
    padding: 0;
}

:is(.section-tabs-dock, .game-detail-tabs-dock, .game-review-tabs-dock) :is(.games-section-nav, .section-tabs) a {
    border-radius: 0;
}

.game-detail-tabs-dock ~ .game-detail-shell .game-detail-main {
    border-top-left-radius: 0;
}

.games-subsection-hero { padding-block: clamp(var(--space-xl), 7vw, var(--space-3xl)); color: var(--color-on-dark); background: linear-gradient(125deg, var(--color-games-hero-start), var(--color-games-hero-middle) 62%, var(--color-games-hero-end)); }

.games-subsection-hero h1 { max-width: 18ch; margin: 0; font-size: clamp(var(--font-size-3xl), 6vw, var(--font-size-4xl)); font-weight: var(--font-weight-black); letter-spacing: var(--letter-spacing-tight); line-height: var(--line-height-tight); }

.games-subsection-hero p:not(.eyebrow) { max-width: 48rem; margin: var(--space-md) 0 0; color: var(--color-on-dark-muted); font-size: var(--font-size-lg); }

.games-subsection-hero .games-section-nav { border-color: color-mix(in srgb, var(--color-paper) 18%, transparent); background: color-mix(in srgb, var(--color-paper) 8%, transparent); }

.games-subsection-hero .games-section-nav a { color: var(--color-on-dark-muted); }

.games-subsection-hero .games-section-nav a.is-active { color: var(--color-dark); background: var(--color-paper); }

.games-subsection-layout { display: grid; gap: var(--space-xl); padding-block: var(--space-xl) var(--space-3xl); }

.games-inline-filters { display: grid; grid-template-columns: minmax(13rem, 1.4fr) minmax(12rem, 1.2fr) minmax(10.5rem, 0.9fr) auto auto; align-items: end; gap: var(--space-md); }
.games-inline-filters .games-search, .games-inline-filters .game-lookup { padding: 0; border: 0; background: transparent; }
.games-inline-filters .game-lookup { align-self: stretch; }

.game-reviews-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-md); }

.game-review-card { overflow: hidden; min-width: 0; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-paper); transition: border-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast); }

.game-review-card:hover { border-color: var(--color-card-border-hover); box-shadow: var(--shadow-card); transform: translateY(-2px); }

.game-review-card__media { position: relative; display: block; overflow: hidden; aspect-ratio: 16 / 9; background: linear-gradient(145deg, var(--color-placeholder-start), var(--color-placeholder-end)); }

.game-review-card__media img { width: 100%; height: 100%; object-fit: cover; }

.game-review-card__media > span { display: grid; width: 100%; height: 100%; place-items: center; color: var(--color-placeholder); font-size: var(--font-size-4xl); }

.game-review-card__media > strong { position: absolute; right: .75rem; bottom: .75rem; display: inline-flex; align-items: baseline; gap: var(--space-xs); padding: var(--space-sm) var(--space-sm); border-radius: var(--radius-md); color: var(--color-on-dark); background: color-mix(in srgb, var(--color-ink) 90%, transparent); font-size: var(--font-size-xl); line-height: var(--line-height-tight); }

.game-review-card__media > strong small { font-size: var(--font-size-xs); }

.game-review-card__body { display: grid; min-height: 14rem; grid-template-rows: auto auto 1fr auto; gap: var(--space-sm); padding: var(--space-md); }

.game-review-card__subject { color: var(--color-accent); font-size: var(--font-size-xs); font-weight: var(--font-weight-black); letter-spacing: var(--letter-spacing-wide); text-transform: uppercase; }

.game-review-card h2 { margin: 0; font-size: var(--font-size-xl); font-weight: var(--font-weight-black); line-height: var(--line-height-tight); }

.game-review-card h2 a { text-decoration: none; }

.game-review-card__body > p { margin: 0; color: var(--color-muted); font-size: var(--font-size-sm); }

.game-review-card footer { display: flex; align-items: center; justify-content: space-between; gap: var(--space-sm); color: var(--color-muted); font-size: var(--font-size-xs); }

.game-review-card footer span { display: inline-flex; min-width: 0; align-items: center; gap: var(--space-sm); }

.games-calendar-layout { display: grid; grid-template-columns: minmax(15rem, 18rem) minmax(0, 1fr); align-items: start; gap: var(--space-xl); padding-top: var(--space-xl); }

.release-calendar-results { min-width: 0; }

.release-timeline { display: grid; gap: var(--space-2xl); position: relative; }

.release-month { display: grid; grid-template-columns: minmax(9rem, 12rem) minmax(0, 1fr); gap: var(--space-xl); align-items: start; position: relative; }

.release-month__header { position: sticky; top: calc(var(--arvr-header-height, var(--arvr-anchor-offset)) + var(--space-md)); z-index: var(--ds-primitive-z-content); align-self: start; display: flex; flex-direction: column; gap: var(--space-xs); padding-top: var(--space-2xs); }

.release-month__title { margin: 0; font-family: var(--font-sans); font-size: var(--font-size-xl); font-weight: var(--font-weight-black); line-height: var(--line-height-tight); color: var(--color-ink); letter-spacing: var(--letter-spacing-tight); }

.release-month__count { display: inline-flex; align-items: center; align-self: flex-start; justify-content: center; min-width: 1.5rem; height: 1.35rem; padding: 0 var(--space-xs); border-radius: var(--ds-primitive-radius-full); background: var(--color-surface-strong); color: var(--color-muted); font-size: var(--font-size-xs); font-weight: var(--font-weight-bold); }

.release-month__grid { display: grid; gap: var(--space-md); min-width: 0; }

.release-card { display: grid; min-width: 0; grid-template-columns: clamp(9.5rem, 18vw, 12.5rem) minmax(0, 1fr) auto; align-items: center; gap: var(--space-lg); padding: var(--space-md); border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-paper); text-decoration: none; color: inherit; cursor: pointer; transition: border-color var(--duration-fast) ease, box-shadow var(--duration-fast) ease; position: relative; }
.release-card:hover { border-color: var(--color-border-strong); box-shadow: var(--shadow-sm); color: inherit; }

.release-card__cover { display: block; position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: var(--radius-sm); overflow: hidden; background: var(--color-surface-strong); flex-shrink: 0; }
.release-card__cover img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--duration-medium) ease; }
.release-card:hover .release-card__cover img { transform: scale(1.04); }

.release-card__placeholder { display: grid; width: 100%; height: 100%; place-items: center; color: var(--color-muted); font-size: var(--font-size-3xl); background: var(--color-surface); }

.release-card__body { display: flex; flex-direction: column; gap: var(--space-xs); min-width: 0; }

.release-card__meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-xs) var(--space-sm); }

.release-card__date,
.release-card__date-badge { display: inline-flex; align-items: center; gap: var(--space-xs); padding: 0; background: transparent; border: none; color: var(--color-ink); font-family: var(--arvr-mono); font-size: var(--font-size-xs); font-weight: var(--font-weight-bold); letter-spacing: var(--letter-spacing-wide); line-height: var(--line-height-tight); }
.release-card__date i,
.release-card__date-badge i { color: var(--color-accent); font-size: var(--font-size-xs); }

.release-card__badge-postponed { display: inline-flex; align-items: center; gap: var(--space-xs); padding: var(--space-2xs) var(--space-sm); border-radius: var(--radius-sm); background: var(--color-surface-strong); border: 1px solid var(--arvr-rule); color: var(--color-muted); font-family: var(--arvr-mono); font-size: var(--font-size-xs); font-weight: var(--font-weight-medium); line-height: var(--line-height-tight); }
.release-card__badge-postponed i { font-size: var(--font-size-xs); }

.release-card__title { margin: 0; min-height: 0; color: var(--color-ink); transition: color var(--duration-fast) ease; }
.release-card__title a { text-decoration: none; color: inherit; transition: color var(--duration-fast) ease; }
.release-card:hover .release-card__title,
.release-card__title a:hover { color: var(--color-accent); }
.release-card:hover .release-card__action { background: var(--color-accent); color: var(--color-on-dark); transform: scale(1.08); }

.game-detail__reviews { margin-top: clamp(var(--space-xl), 6vw, var(--space-3xl)); padding-top: var(--space-xl); border-top: 1px solid var(--color-border); }

.game-detail__reviews > header { display: flex; align-items: end; justify-content: space-between; gap: var(--space-md); margin-bottom: var(--space-md); }

.game-detail__reviews h2 { margin: 0; font-size: clamp(var(--font-size-3xl), 4vw, var(--font-size-4xl)); font-weight: var(--font-weight-black); }

.game-review-summary { display: inline-flex; align-items: stretch; min-height: var(--button-height); height: var(--button-height); border: 1px solid var(--color-border); border-radius: 0; background: var(--color-surface); line-height: 1; overflow: hidden; flex-shrink: 0; }
.game-review-summary__score { display: inline-flex; align-items: center; gap: var(--space-xs); padding: 0 var(--space-sm); background: var(--color-ink) !important; color: var(--color-paper) !important; }
.game-review-summary__score .bi { font-size: var(--font-size-xs); color: var(--color-accent); }
.game-review-summary__score strong { font-family: var(--arvr-mono); font-size: var(--font-size-md); font-weight: 800; line-height: 1; color: var(--color-paper) !important; }
.game-review-summary__score small { font-family: var(--arvr-mono); font-size: var(--arvr-micro); color: var(--color-paper) !important; opacity: .85; line-height: 1; }
.game-review-summary__meta { display: flex; flex-direction: column; justify-content: center; padding: 0 var(--space-sm); gap: var(--space-2xs); border-left: 1px solid var(--color-border); }
.game-review-summary__label { font-family: var(--arvr-mono); font-size: var(--arvr-micro); font-weight: 700; letter-spacing: var(--arvr-tracking); text-transform: uppercase; color: var(--color-muted); line-height: 1; }
.game-review-summary__count { font-family: var(--arvr-mono); font-size: var(--font-size-xs); font-weight: 700; color: var(--color-ink); line-height: 1; }

.game-detail__review-actions { display: flex; flex-wrap: wrap; gap: var(--space-md); margin-top: var(--space-md); }

html[data-theme="arvr_theme"] body.ds-page--article .game-review-signal { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-sm) var(--space-md); width: 100%; }
.game-review-signal .article-header__signal-lead { display: inline-flex; flex-wrap: wrap; align-items: center; gap: var(--space-xs); min-width: 0; }
.game-review-signal .eyebrow { margin: 0; line-height: 1; display: inline-flex; align-items: center; }
.game-review-signal__sep { color: var(--color-muted); font-family: var(--arvr-mono); font-size: var(--arvr-micro); line-height: 1; user-select: none; margin: 0 var(--space-xs); }
.game-review-signal__game { display: inline-flex; align-items: center; gap: var(--space-xs); font-size: var(--font-size-sm); font-weight: 700; line-height: 1; color: var(--color-ink); text-decoration: none; }
.game-review-signal__game:hover { text-decoration: underline; color: var(--color-ink); }
.game-review-signal__game .bi { font-size: var(--font-size-sm); color: var(--color-ink); }

.game-review-header-badge { display: inline-flex; align-items: stretch; margin-left: auto; border: 1px solid var(--color-ink); border-radius: 0; background: transparent; font-family: var(--arvr-mono); line-height: 1; overflow: hidden; flex-shrink: 0; }
.game-review-header-badge__label { display: inline-flex; align-items: center; padding: var(--space-xs) var(--space-sm); color: var(--color-muted); font-size: var(--arvr-micro); font-weight: 700; letter-spacing: var(--arvr-tracking); text-transform: uppercase; border-right: 1px solid var(--arvr-rule); background: var(--color-bg); line-height: 1; }
.game-review-header-badge__score { display: inline-flex; align-items: center; gap: var(--space-xs); padding: var(--space-xs) var(--space-sm); background: var(--color-ink) !important; color: var(--color-paper) !important; line-height: 1; }
.game-review-header-badge__score strong { font-size: var(--font-size-sm); font-weight: 800; color: var(--color-paper) !important; line-height: 1; }
.game-review-header-badge__score small { font-size: var(--arvr-micro); color: var(--color-paper) !important; opacity: .85; line-height: 1; }

.game-review-score { display: inline-flex; align-items: baseline; gap: var(--space-xs); color: var(--color-paper) !important; padding: var(--space-xs) var(--space-sm); border-radius: 0; background: var(--color-ink); font-family: var(--arvr-mono); }
.game-review-score strong { font-size: var(--font-size-xl); line-height: var(--line-height-tight); font-weight: var(--font-weight-bold); color: var(--color-paper) !important; }
.game-review-score small { font-size: var(--font-size-xs); opacity: .8; color: var(--color-paper) !important; }
.game-review-score--large { margin-bottom: var(--space-md); padding: var(--space-sm) var(--space-md); }
.game-review-score--large strong { font-size: var(--font-size-4xl); color: var(--color-paper) !important; }
.game-review-score--xs { padding: var(--space-xs) var(--space-xs); }
.game-review-score--xs strong { font-size: var(--font-size-sm); color: var(--color-paper) !important; }
.game-review-score--xs small { font-size: var(--font-size-xs); color: var(--color-paper) !important; }

.game-review-tabs-dock { margin-bottom: var(--space-lg); }

.sidebar-verdict-card .sidebar-card__header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-md); }
.sidebar-verdict__header-title { display: inline-flex; align-items: center; gap: var(--space-xs); }
.sidebar-verdict__header-title .bi { font-size: var(--font-size-md); color: var(--color-ink); }
.sidebar-verdict__header-title h2 { margin: 0; font-size: var(--font-size-md); font-weight: var(--font-weight-bold); color: var(--color-ink); }
.sidebar-verdict__featured-pill { display: inline-flex; align-items: center; padding: var(--space-xs) var(--space-sm); font-family: var(--arvr-mono); font-size: var(--arvr-micro); font-weight: 700; text-transform: uppercase; letter-spacing: var(--arvr-tracking); background: var(--color-ink); color: var(--color-paper) !important; }

.sidebar-verdict { display: grid; gap: var(--space-md); }
.sidebar-verdict__hero { display: grid; gap: var(--space-sm); padding: var(--space-md); background: var(--color-ink); color: var(--color-paper); border: 1px solid var(--color-ink); }
.sidebar-verdict__score-row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-md); }
.sidebar-verdict__score-main { display: inline-flex; align-items: baseline; gap: var(--space-xs); }
.sidebar-verdict__big-score { font-family: var(--arvr-mono); font-size: clamp(var(--font-size-3xl), 5vw, var(--font-size-4xl)); font-weight: 900; line-height: 1; color: var(--color-paper) !important; letter-spacing: -0.04em; }
.sidebar-verdict__max-score { font-family: var(--arvr-mono); font-size: var(--font-size-md); font-weight: 700; color: var(--color-paper) !important; opacity: .6; line-height: 1; }
.sidebar-verdict__score-meta { display: grid; justify-items: end; gap: var(--space-xs); }
.sidebar-verdict__badge { display: inline-flex; align-items: center; padding: var(--space-xs) var(--space-sm); font-family: var(--arvr-mono); font-size: var(--font-size-xs); font-weight: 800; text-transform: uppercase; letter-spacing: var(--arvr-tracking); background: var(--color-paper); color: var(--color-ink) !important; line-height: 1; }
.sidebar-verdict__scale { font-family: var(--arvr-mono); font-size: var(--arvr-micro); text-transform: uppercase; color: var(--color-paper); opacity: .6; letter-spacing: var(--arvr-tracking); line-height: 1; }
.sidebar-verdict__meter { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: var(--space-xs); width: 100%; height: var(--space-xs); padding-top: var(--space-xs); }
.sidebar-verdict__meter-tick { display: block; height: 100%; background: var(--color-paper); opacity: .25; }
.sidebar-verdict__meter-tick.is-filled { opacity: 1; background: var(--color-paper); }
.sidebar-verdict__quote { display: grid; gap: var(--space-xs); padding: var(--space-md); background: var(--color-surface); border: 1px solid var(--arvr-rule); border-left: 3px solid var(--color-ink); }
.sidebar-verdict__quote-header { display: flex; align-items: center; gap: var(--space-xs); color: var(--color-muted); font-family: var(--arvr-mono); font-size: var(--arvr-micro); font-weight: 700; text-transform: uppercase; letter-spacing: var(--arvr-tracking); }
.sidebar-verdict__quote-header .bi { color: var(--color-ink); font-size: var(--font-size-sm); }
.sidebar-verdict__text { margin: 0; font-size: var(--font-size-sm); line-height: var(--line-height-relaxed); color: var(--color-ink); font-style: italic; }
.sidebar-verdict__footer { display: flex; align-items: center; justify-content: space-between; gap: var(--space-sm); padding-top: var(--space-xs); font-size: var(--arvr-micro); font-family: var(--arvr-mono); color: var(--color-muted); text-transform: uppercase; letter-spacing: var(--arvr-tracking); }
.sidebar-verdict__author { display: inline-flex; align-items: center; gap: var(--space-xs); }
.sidebar-verdict__author strong { color: var(--color-ink); }

.sidebar-game { display: grid; gap: var(--space-md); }
.sidebar-game__media { display: block; overflow: hidden; }
.sidebar-game__thumb { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.sidebar-game__body { display: grid; gap: var(--space-sm); }
.sidebar-game__title { margin: 0; font-size: var(--font-size-lg); line-height: var(--line-height-tight); }
.sidebar-game__title a { color: var(--color-ink); text-decoration: none; }
.sidebar-game__title a:hover { text-decoration: underline; }
.sidebar-game__chips { display: flex; flex-wrap: wrap; gap: var(--space-xs); }
.sidebar-game__desc { margin: 0; font-size: var(--font-size-sm); line-height: var(--line-height-body); color: var(--color-muted); }

.sidebar-story__meta { display: flex; align-items: center; gap: var(--space-sm); margin-top: var(--space-xs); }

.game-lookup { position: relative; }

.game-lookup__results { position: absolute; z-index: 20; top: calc(100% - .25rem); right: 0; left: 0; overflow-y: auto; max-height: 20rem; padding: var(--space-sm); border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: var(--color-paper); box-shadow: var(--shadow-modal); }

.game-lookup__results button { display: grid; width: 100%; grid-template-columns: 5rem minmax(0, 1fr); align-items: center; gap: var(--space-md); padding: var(--space-sm); border: 0; border-radius: var(--radius-sm); color: var(--color-ink); background: transparent; text-align: left; cursor: pointer; }

.game-lookup__results button:hover, .game-lookup__results button[aria-selected="true"] { background: var(--color-surface); }

.game-lookup__results img { width: 5rem; aspect-ratio: 16 / 9; border-radius: var(--radius-sm); object-fit: cover; }

.game-lookup__results button span { display: grid; gap: var(--space-xs); min-width: 0; }

.game-lookup__results button small, .game-lookup__results > p, .game-lookup__selection { color: var(--color-muted); font-size: var(--font-size-xs); }

.game-lookup__results > p { margin: 0; padding: var(--space-md); }

.game-lookup__selection { margin: var(--space-sm) 0 0; }

@media (max-width: 1024px) {
.games-inline-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.game-reviews-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.release-month { grid-template-columns: 1fr; gap: var(--space-md); }
.release-month__header { position: static; flex-direction: row; align-items: baseline; justify-content: space-between; padding-bottom: var(--space-xs); border-bottom: 1px solid var(--color-border); }
}

@media (max-width: 768px) {
.games-section-nav { width: 100%; }
.games-section-nav a { flex: 1 1 auto; justify-content: center; }
.games-subsection-hero h1 { overflow-wrap: anywhere; }
.games-inline-filters, .games-calendar-layout { grid-template-columns: 1fr; }
.game-reviews-grid { grid-template-columns: 1fr; }
.release-card { grid-template-columns: 7.5rem minmax(0, 1fr); padding: var(--space-xs); }
.release-card__action { display: none; }
.game-detail__reviews > header { align-items: start; flex-direction: column; }
}

@media (max-width: 480px) {
.games-section-nav { display: grid; grid-template-columns: 1fr; }
.release-card { grid-template-columns: 1fr; padding: 0; overflow: hidden; }
.release-card__cover { width: 100%; aspect-ratio: 16 / 9; border-radius: 0; }
.release-card__body { padding: var(--space-sm); }
.game-review-card footer { align-items: start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
.games-section-nav a, .game-review-card { transition: none; }
.game-review-card:hover { transform: none; }
}

.games-page { min-height: 70vh; padding-bottom: var(--space-3xl); background: var(--color-surface); }

.games-hero { color: var(--color-paper); background: linear-gradient(125deg, var(--color-ink) 0%, var(--color-dark-soft) 62%, var(--color-highlight-strong) 100%); }

.games-hero__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--space-xl); padding-block: clamp(var(--space-xl), 7vw, var(--space-3xl)); }

.games-hero__inner > div { min-width: 0; }

.games-hero h1 { max-width: 18ch; margin: 0; font-size: clamp(var(--font-size-3xl), 6vw, var(--font-size-4xl)); font-weight: var(--font-weight-black); letter-spacing: var(--letter-spacing-tight); line-height: var(--line-height-tight); }

.games-hero p:not(.eyebrow) { max-width: 45rem; margin: var(--space-md) 0 0; color: var(--color-field-border); font-size: clamp(var(--font-size-md), 2vw, var(--font-size-xl)); }

.games-hero .eyebrow { color: var(--color-field-border); }

.games-hero__mark { display: grid; flex: 0 0 auto; width: clamp(5rem, 12vw, 10rem); aspect-ratio: 1; place-items: center; border: 1px solid color-mix(in srgb, var(--color-paper) 16%, transparent); border-radius: 50%; background: color-mix(in srgb, var(--color-paper) 7%, transparent); color: var(--color-paper); font-size: clamp(var(--font-size-3xl), 6vw, var(--font-size-4xl)); }

.games-layout { display: grid; grid-template-columns: minmax(15rem, 18rem) minmax(0, 1fr); align-items: start; gap: var(--space-xl); padding-top: var(--space-xl); }

.games-filters { position: sticky; top: calc(var(--arvr-header-height, var(--arvr-anchor-offset)) + var(--space-md)); z-index: var(--ds-primitive-z-content); display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-paper); box-shadow: var(--shadow-sm); }

.games-drawer-header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-sm); padding: var(--space-sm) var(--space-md); border-bottom: 1px solid var(--color-border); background: var(--color-paper); flex-shrink: 0; }
.games-filters__header-title { display: inline-flex; align-items: center; gap: var(--space-sm); font-size: var(--font-size-md); font-weight: var(--font-weight-black); color: var(--color-ink); }
.games-filters__header-title .bi-sliders { color: var(--color-accent); font-size: var(--font-size-md); }
.games-filters__header-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 1.25rem; height: 1.25rem; padding: 0 var(--space-xs); border-radius: var(--ds-primitive-radius-full); background: var(--color-dark); color: var(--color-on-dark); font-size: var(--font-size-xs); font-weight: var(--font-weight-black); animation: badgeScalePop var(--duration-fast) var(--easing-standard); }
.games-filters__header-actions { display: inline-flex; align-items: center; gap: var(--space-xs); }
.games-filters__reset-top { display: inline-flex; align-items: center; gap: var(--space-xs); padding: var(--space-xs) var(--space-sm); border-radius: var(--radius-sm); color: var(--color-muted); font-size: var(--font-size-xs); font-weight: var(--font-weight-bold); text-decoration: none; transition: color var(--duration-fast) ease, background-color var(--duration-fast) ease, transform var(--duration-fast) ease; }
.games-filters__reset-top:hover { color: var(--color-destructive); background: var(--color-destructive-soft); transform: translateY(-1px); }
.games-filters__reset-top .bi { font-size: var(--font-size-xs); transition: transform var(--duration-normal) var(--easing-standard); }
.games-filters__reset-top:hover .bi { transform: rotate(-180deg); }

.games-drawer-body { flex: 1 1 auto; overflow-y: auto; -webkit-overflow-scrolling: touch; }
@supports not selector(::-webkit-scrollbar) {
    .games-drawer-body { scrollbar-width: thin; scrollbar-color: var(--color-border) transparent; }
}
.games-drawer-body::-webkit-scrollbar { width: .35rem; }
.games-drawer-body::-webkit-scrollbar-track { background: transparent; }
.games-drawer-body::-webkit-scrollbar-thumb { background: var(--color-border); border-radius: var(--ds-primitive-radius-full); }
.games-drawer-body::-webkit-scrollbar-thumb:hover { background: var(--color-muted); }
.games-drawer-body::-webkit-scrollbar-button { display: none; width: 0; height: 0; }

.games-search { display: grid; gap: var(--space-xs); padding: var(--space-md); border-bottom: 1px solid var(--color-border); background: var(--color-paper); }
.games-search label { font-size: var(--font-size-xs); font-weight: var(--font-weight-bold); text-transform: uppercase; letter-spacing: var(--letter-spacing-wide); color: var(--color-muted); }
.games-search__field { position: relative; display: flex; align-items: center; }
.games-search__field .bi-search { position: absolute; left: var(--space-sm); color: var(--color-muted); font-size: var(--font-size-sm); pointer-events: none; transition: color var(--duration-fast) ease; }
.games-search input { width: 100%; min-height: 2.6rem; padding: var(--space-xs) 2.2rem var(--space-xs) 2.2rem; border: 1px solid var(--color-field-border); border-radius: var(--radius-sm); background: var(--color-surface); color: var(--color-ink); font-size: var(--font-size-sm); transition: border-color var(--duration-fast) ease, background-color var(--duration-fast) ease, box-shadow var(--duration-fast) ease; }
.games-search input:hover { border-color: var(--color-card-border-hover); }
.games-search input:focus { border-color: var(--color-accent); background: var(--color-paper); outline: none; box-shadow: var(--shadow-focus); }
.games-search__field:focus-within .bi-search { color: var(--color-accent); }
.games-search__clear { position: absolute; right: var(--space-xs); display: grid; place-items: center; width: 1.75rem; height: 1.75rem; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--color-muted); cursor: pointer; transition: color var(--duration-fast) ease, transform var(--duration-fast) ease; }
.games-search__clear:hover { color: var(--color-ink); transform: scale(1.15); }

.games-filter { border-bottom: 1px solid var(--color-border); transition: background-color var(--duration-fast) ease; }
.games-filter:last-child { border-bottom: 0; }
.games-filter summary { display: flex; min-height: 3rem; align-items: center; justify-content: space-between; gap: var(--space-sm); padding: var(--space-sm) var(--space-md); font-size: var(--font-size-sm); font-weight: var(--font-weight-black); color: var(--color-ink); cursor: pointer; list-style: none; user-select: none; transition: background-color var(--duration-fast) ease, color var(--duration-fast) ease; }
.games-filter summary::-webkit-details-marker { display: none; }
.games-filter summary:hover { background: var(--color-surface-strong); }
.games-filter summary:focus-visible { outline: 2px solid var(--color-accent); outline-offset: -2px; }
.games-filter__summary-label { flex: 1 1 auto; font-size: var(--font-size-sm); font-weight: var(--font-weight-black); letter-spacing: var(--letter-spacing-tight); }
.games-filter__summary-meta { display: inline-flex; align-items: center; gap: var(--space-xs); }
.games-filter__group-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 1.15rem; height: 1.15rem; padding: 0 var(--space-xs); border-radius: var(--ds-primitive-radius-full); background: var(--color-accent); color: var(--color-on-dark); font-size: var(--font-size-xs); font-weight: var(--font-weight-black); animation: badgeScalePop var(--duration-fast) var(--easing-standard); }
.games-filter summary .bi-chevron-down { display: inline-block; font-size: var(--font-size-xs); color: var(--color-muted); transition: transform var(--duration-normal) var(--easing-standard), color var(--duration-fast) ease; }
.games-filter summary:hover .bi-chevron-down { color: var(--color-ink); }
.games-filter[open] summary .bi-chevron-down { transform: rotate(180deg); }

.games-filter__content, .games-filter > div { display: grid; gap: var(--space-xs); padding: 0 var(--space-sm) var(--space-sm); }
.games-filter[open] > .games-filter__content, .games-filter[open] > div { animation: gamesFilterSlideDown var(--duration-fast) var(--easing-standard); }
.games-filter__content::-webkit-scrollbar, .games-filter > div::-webkit-scrollbar { width: .35rem; height: .35rem; }
.games-filter__content::-webkit-scrollbar-track, .games-filter > div::-webkit-scrollbar-track { background: transparent; }
.games-filter__content::-webkit-scrollbar-thumb, .games-filter > div::-webkit-scrollbar-thumb { background: var(--color-border); border-radius: var(--ds-primitive-radius-full); }
.games-filter__content::-webkit-scrollbar-thumb:hover, .games-filter > div::-webkit-scrollbar-thumb:hover { background: var(--color-muted); }
.games-filter__content::-webkit-scrollbar-button, .games-filter > div::-webkit-scrollbar-button { display: none; width: 0; height: 0; }

.games-filter label, .games-filter__option { display: flex; min-height: 2.25rem; align-items: center; gap: var(--space-sm); padding: var(--space-xs) var(--space-sm); border: 1px solid transparent; border-radius: var(--radius-sm); color: var(--color-ink); font-size: var(--font-size-sm); cursor: pointer; user-select: none; transition: background-color var(--duration-fast) ease, border-color var(--duration-fast) ease, color var(--duration-fast) ease, transform var(--duration-fast) ease; }
.games-filter label:hover, .games-filter__option:hover { background: var(--color-surface-strong); color: var(--color-ink); transform: translateX(2px); }
.games-filter label:has(input:checked), .games-filter__option:has(input:checked) { background: var(--color-accent-soft); border-color: color-mix(in srgb, var(--color-accent) 20%, transparent); color: var(--color-ink); font-weight: var(--font-weight-bold); }

.games-filter input[type="checkbox"] { appearance: none; -webkit-appearance: none; width: 1.15rem; height: 1.15rem; border: 1px solid var(--color-field-border); border-radius: var(--radius-sm); background: var(--color-paper); display: inline-grid; place-content: center; margin: 0; flex-shrink: 0; cursor: pointer; transition: border-color var(--duration-fast) ease, background-color var(--duration-fast) ease, transform var(--duration-fast) ease, box-shadow var(--duration-fast) ease; }
.games-filter input[type="checkbox"]:hover { border-color: var(--color-accent); }
.games-filter input[type="checkbox"]:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 2px; }
.games-filter input[type="checkbox"]:active { transform: scale(0.9); }
.games-filter input[type="checkbox"]:checked { background-color: var(--color-accent); border-color: var(--color-accent); transform: scale(1.05); }
.games-filter input[type="checkbox"]:checked::after { content: ""; width: .45rem; height: .25rem; border-left: 2px solid var(--color-paper); border-bottom: 2px solid var(--color-paper); transform: rotate(-45deg) translate(.02rem, -.03rem); }

.games-filter input[type="radio"] { appearance: none; -webkit-appearance: none; width: 1.15rem; height: 1.15rem; border: 1px solid var(--color-field-border); border-radius: var(--ds-primitive-radius-full); background: var(--color-paper); display: inline-grid; place-content: center; margin: 0; flex-shrink: 0; cursor: pointer; transition: border-color var(--duration-fast) ease, background-color var(--duration-fast) ease, transform var(--duration-fast) ease, box-shadow var(--duration-fast) ease; }
.games-filter input[type="radio"]:hover { border-color: var(--color-accent); }
.games-filter input[type="radio"]:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 2px; }
.games-filter input[type="radio"]:active { transform: scale(0.9); }
.games-filter input[type="radio"]:checked { border-color: var(--color-accent); background-color: var(--color-paper); }
.games-filter input[type="radio"]:checked::after { content: ""; width: .5rem; height: .5rem; border-radius: var(--ds-primitive-radius-full); background-color: var(--color-accent); }

.games-filter__option-name { flex: 1 1 auto; line-height: var(--line-height-ui); }
.games-filter label small, .games-filter__option-count { display: inline-flex; align-items: center; justify-content: center; min-width: 1.35rem; height: 1.2rem; padding: 0 var(--space-xs); margin-left: auto; border-radius: var(--ds-primitive-radius-full); background: var(--color-surface-strong); color: var(--color-muted); font-size: var(--font-size-xs); font-weight: var(--font-weight-medium); transition: background-color var(--duration-fast) ease, color var(--duration-fast) ease; }
.games-filter label:hover small, .games-filter__option:hover .games-filter__option-count { background: var(--color-border); color: var(--color-ink); }
.games-filter label:has(input:checked) small, .games-filter__option:has(input:checked) .games-filter__option-count { background: var(--color-paper); color: var(--color-accent); font-weight: var(--font-weight-bold); }

.games-filter p, .games-filter__empty { margin: var(--space-xs) 0; color: var(--color-muted); font-size: var(--font-size-sm); padding: var(--space-xs) var(--space-sm); }

.games-filter__actions { display: grid; gap: var(--space-sm); padding: var(--space-md); text-align: center; flex-shrink: 0; }
.games-filter-apply-btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-sm); transition: transform var(--duration-fast) ease, background-color var(--duration-fast) ease; }
.games-filter-apply-btn:hover { transform: translateY(-1px); }
.games-filter-reset-btn { display: inline-flex; align-items: center; justify-content: center; transition: transform var(--duration-fast) ease, background-color var(--duration-fast) ease; }
.games-filter-reset-btn:hover { transform: translateY(-1px); }

.is-hidden { display: none !important; }

@keyframes gamesFilterSlideDown { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }
@keyframes badgeScalePop { 0% { transform: scale(0.8); } 60% { transform: scale(1.15); } 100% { transform: scale(1); } }

.games-results { min-width: 0; }

.games-results.htmx-request { opacity: .55; }

.games-quick-chips { margin-bottom: var(--space-md); overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.games-quick-chips::-webkit-scrollbar { display: none; }
.games-quick-chips__track { display: flex; align-items: center; gap: var(--space-sm); padding-bottom: var(--space-xs); white-space: nowrap; }
.games-chip { display: inline-flex; min-height: 2.35rem; align-items: center; gap: var(--space-xs); padding: var(--space-xs) var(--space-md); border: 1px solid var(--color-border); border-radius: var(--ds-primitive-radius-full); background: var(--color-paper); color: var(--color-ink); font-size: var(--font-size-xs); font-weight: var(--font-weight-bold); text-decoration: none; transition: color var(--transition-fast), border-color var(--transition-fast), background var(--transition-fast), transform var(--transition-fast); }
.games-chip:hover, .games-chip:focus-visible { border-color: var(--color-accent); color: var(--color-accent); background: var(--color-surface); }
.games-chip.is-active { border-color: var(--color-dark); background: var(--color-dark); color: var(--color-on-dark); }

.games-results__header { display: flex; min-height: 3.4rem; align-items: center; justify-content: space-between; gap: var(--space-sm); margin-bottom: var(--space-md); flex-wrap: wrap; }
.games-results__header p { margin: 0; color: var(--color-muted); }
.games-results__header p strong { color: var(--color-ink); }
.games-results__ordering-wrap { display: flex; align-items: center; gap: var(--space-sm); }
.games-results__ordering-wrap label { font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); color: var(--color-ink); white-space: nowrap; }
.games-results__ordering-wrap select { min-height: 2.6rem; padding: var(--space-sm) var(--space-xl) var(--space-sm) var(--space-sm); border: 1px solid var(--color-field-border); border-radius: var(--radius-sm); background: var(--color-paper); font-size: var(--font-size-sm); }

.games-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-md); }

.game-card { display: flex; flex-direction: column; height: 100%; overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-paper); transition: border-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast); }
.game-card:hover { border-color: var(--color-field-border); box-shadow: var(--shadow-card); transform: translateY(-2px); }

.game-card__media { position: relative; display: block; overflow: hidden; aspect-ratio: 16 / 9; width: 100%; background: linear-gradient(145deg, var(--color-surface-strong), var(--color-border)); }
.game-card__media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform var(--duration-slow) ease; }
.game-card:hover .game-card__media img { transform: scale(1.02); }
.game-card__placeholder, .game-detail__cover > span { display: grid; width: 100%; height: 100%; place-items: center; color: var(--color-highlight); font-size: var(--font-size-4xl); }

.game-card__badge-discount { position: absolute; top: var(--space-sm); left: var(--space-sm); display: inline-flex; align-items: center; padding: var(--space-xs) var(--space-sm); border: 1px solid var(--color-paper); background: var(--color-ink); color: var(--color-on-dark); font-family: var(--arvr-mono); font-size: var(--font-size-xs); font-weight: var(--font-weight-black); letter-spacing: var(--letter-spacing-wide); line-height: var(--line-height-tight); box-shadow: none; z-index: var(--ds-primitive-z-content); }
.game-card__badge-rating { position: absolute; top: var(--space-sm); right: var(--space-sm); display: inline-flex; align-items: center; gap: var(--space-xs); padding: var(--space-xs) var(--space-sm); border: 1px solid var(--color-ink); background: var(--color-paper); color: var(--color-ink); font-family: var(--arvr-mono); font-size: var(--font-size-xs); font-weight: var(--font-weight-black); letter-spacing: var(--letter-spacing-wide); line-height: var(--line-height-tight); box-shadow: none; z-index: var(--ds-primitive-z-content); }
.game-card__badge-rating .bi-star-fill { font-size: var(--font-size-xs); color: var(--color-ink); }
.game-badge-discount { display: inline-flex; align-items: center; padding: var(--space-xs) var(--space-sm); border: 1px solid var(--color-paper); background: var(--color-dark); color: var(--color-on-dark); font-family: var(--arvr-mono); font-size: var(--font-size-xs); font-weight: var(--font-weight-black); letter-spacing: var(--letter-spacing-wide); }

.game-card__body { display: flex; flex-direction: column; flex-grow: 1; padding: var(--space-md); gap: var(--space-sm); }
.game-card__tags { display: flex; flex-wrap: wrap; gap: var(--space-xs) var(--space-sm); align-items: center; }
.game-card__tag { display: inline-flex; align-items: center; padding: var(--space-xs) var(--space-sm); font-family: var(--arvr-mono); font-size: var(--arvr-micro); font-weight: var(--font-weight-bold); letter-spacing: var(--arvr-tracking); text-transform: uppercase; line-height: var(--line-height-tight); white-space: nowrap; }
.game-card__tag.is-platform { background: var(--color-ink); color: var(--color-on-dark); border: 1px solid var(--color-ink); }
.game-card__tag.is-genre { background: var(--color-surface-strong); color: var(--color-ink); border: 1px solid var(--arvr-rule); }

.game-card__platforms, .game-detail__chips { display: flex; flex-wrap: wrap; gap: var(--space-sm); }
.game-card__platforms span, .game-detail__chips span { padding: var(--space-xs) var(--space-sm); border-radius: var(--ds-primitive-radius-full); color: var(--color-highlight-strong); background: var(--color-surface); font-size: var(--font-size-xs); font-weight: var(--font-weight-bold); }

.game-card h2, .game-card__title { margin: 0; font-size: var(--font-size-lg); font-weight: var(--font-weight-black); line-height: var(--line-height-tight); min-height: 2.5em; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.game-card h2 a, .game-card__title a { text-decoration: none; color: inherit; }
.game-card h2 a:hover, .game-card__title a:hover { color: var(--color-accent); }
.game-card__summary, .game-card__body > p { margin: 0; color: var(--color-muted); font-size: var(--font-size-sm); line-height: 1.45; min-height: 4.35em; display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

.game-card__footer { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: var(--space-sm); padding-top: var(--space-sm); border-top: 1px solid var(--color-border); }
.game-card__meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-xs) var(--space-sm); min-width: 0; }
.game-card__date { color: var(--color-muted); font-size: var(--font-size-xs); font-weight: var(--font-weight-bold); }
.game-card__pricing { display: inline-flex; align-items: baseline; gap: var(--space-xs); font-size: var(--font-size-xs); }
.game-card__store { color: var(--color-muted); font-size: var(--font-size-xs); text-transform: uppercase; letter-spacing: var(--letter-spacing-wide); }
.game-card__price { font-weight: var(--font-weight-black); color: var(--color-ink); }
.game-card__price.is-free { color: var(--color-accent); }
.game-card__price.is-discounted { color: var(--color-ink); }
.game-card__price.is-unavailable { color: var(--color-muted); }
.game-card__price-original { color: var(--color-muted); font-size: var(--font-size-xs); text-decoration: line-through; }
.game-card__action { display: grid; flex-shrink: 0; width: 2.4rem; height: 2.4rem; place-items: center; border-radius: 50%; color: var(--color-paper); background: var(--color-dark); text-decoration: none; transition: background var(--transition-fast), transform var(--transition-fast); }
.game-card__action:hover, .game-card__action:focus-visible { background: var(--color-accent); transform: scale(1.08); }

.games-showcase { display: flex; flex-direction: column; gap: var(--space-md); margin-bottom: var(--space-xl); }

.game-showcase-hero { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: var(--space-lg); overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-paper); box-shadow: var(--shadow-card); transition: border-color var(--transition-fast), box-shadow var(--transition-fast); }

.game-showcase-hero:hover { border-color: var(--color-field-border); box-shadow: var(--shadow-card); }

.game-showcase-hero__media { position: relative; display: block; overflow: hidden; aspect-ratio: 16 / 9; width: 100%; background: linear-gradient(145deg, var(--color-surface-strong), var(--color-border)); }

.game-showcase-hero__media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform var(--duration-slow) ease; }

.game-showcase-hero:hover .game-showcase-hero__media img { transform: scale(1.02); }

.game-showcase-hero__content { display: flex; flex-direction: column; padding: var(--space-lg); gap: var(--space-sm); min-width: 0; }

.game-showcase-hero__header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-xs) var(--space-sm); }

.game-showcase-hero__eyebrow { display: inline-flex; align-items: center; gap: var(--space-xs); font-size: var(--font-size-xs); font-weight: var(--font-weight-black); text-transform: uppercase; letter-spacing: var(--letter-spacing-wide); color: var(--color-accent); }

.game-showcase-hero__title { margin: 0; font-size: clamp(var(--font-size-xl), 2.5vw, var(--font-size-2xl)); font-weight: var(--font-weight-black); line-height: var(--line-height-tight); }

.game-showcase-hero__title a { text-decoration: none; color: inherit; }

.game-showcase-hero__title a:hover { color: var(--color-accent); }

.game-showcase-hero__summary { margin: 0; color: var(--color-muted); font-size: var(--font-size-sm); line-height: 1.55; display: -webkit-box; -webkit-line-clamp: 4; line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }

.game-showcase-hero__footer { margin-top: auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-md); padding-top: var(--space-md); border-top: 1px solid var(--color-border); }

.game-showcase-hero__meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-xs) var(--space-sm); min-width: 0; }

.game-showcase-hero__cta { display: inline-flex; align-items: center; gap: var(--space-xs); padding: var(--space-xs) var(--space-md); border-radius: var(--radius-sm); font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); text-decoration: none; white-space: nowrap; color: var(--color-on-dark); background: var(--color-dark); transition: background var(--transition-fast), transform var(--transition-fast); }

.game-showcase-hero__cta:hover { background: var(--color-accent); transform: translateX(2px); }

.games-showcase__strip { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--space-sm); }

.game-mini-card { display: flex; flex-direction: column; height: 100%; min-width: 0; overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-paper); scroll-snap-align: start; transition: border-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast); }

.game-mini-card:hover { border-color: var(--color-field-border); box-shadow: var(--shadow-card); transform: translateY(-2px); }

.game-mini-card__media { position: relative; display: block; overflow: hidden; aspect-ratio: 16 / 9; width: 100%; background: linear-gradient(145deg, var(--color-surface-strong), var(--color-border)); }

.game-mini-card__media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform var(--duration-slow) ease; }

.game-mini-card:hover .game-mini-card__media img { transform: scale(1.02); }

.game-mini-card__body { display: flex; flex-direction: column; flex-grow: 1; padding: var(--space-sm); gap: var(--space-xs); min-width: 0; }

.game-mini-card__tags { display: flex; align-items: center; gap: var(--space-xs); }

.game-mini-card__title { margin: 0; font-family: var(--font-sans); font-size: var(--font-size-xs); font-weight: var(--font-weight-bold); line-height: 1.35; min-height: 2.7em; text-transform: none; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

.game-mini-card__title a { text-decoration: none; color: inherit; }

.game-mini-card__title a:hover { color: var(--color-accent); }

.game-mini-card__footer { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: var(--space-xs); padding-top: var(--space-sm); border-top: 1px solid var(--color-border); }

.game-mini-card__action { display: grid; flex-shrink: 0; width: 1.75rem; height: 1.75rem; place-items: center; border-radius: 50%; color: var(--color-paper); background: var(--color-dark); font-size: var(--font-size-xs); text-decoration: none; margin-left: auto; transition: background var(--transition-fast); }

.game-mini-card__action:hover { background: var(--color-accent); }

.games-results__section-divider { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-md); margin: var(--space-xl) 0 var(--space-md); padding-bottom: var(--space-xs); border-bottom: 2px solid var(--color-ink); }

.games-results__section-title { margin: 0; font-size: var(--font-size-lg); font-weight: var(--font-weight-black); text-transform: uppercase; letter-spacing: var(--letter-spacing-wide); color: var(--color-ink); }

.games-results__section-count { font-size: var(--font-size-xs); font-weight: var(--font-weight-bold); color: var(--color-muted); }

@media (max-width: 61.99rem) {
    .game-showcase-hero { grid-template-columns: 1fr; }
    .game-showcase-hero__content { padding: var(--space-md); }
    .game-showcase-hero__footer { flex-direction: column; align-items: stretch; gap: var(--space-sm); }
    .game-showcase-hero__cta { justify-content: center; width: 100%; }
    .games-showcase__strip { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(10.5rem, 12rem); overflow-x: auto; scroll-snap-type: x mandatory; gap: var(--space-sm); padding-bottom: var(--space-xs); -webkit-overflow-scrolling: touch; }
}

.games-pagination { display: flex; align-items: center; justify-content: center; gap: var(--space-md); margin-top: var(--space-xl); }

.games-pagination a { display: inline-flex; min-height: 2.75rem; align-items: center; gap: var(--space-sm); padding: var(--space-sm) var(--space-md); border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: var(--color-paper); color: var(--color-accent); font-weight: var(--font-weight-bold); text-decoration: none; }

.games-pagination span { color: var(--color-muted); font-size: var(--font-size-sm); }

.game-detail { padding-bottom: var(--space-3xl); }

.game-detail__hero { display: grid; grid-template-columns: minmax(18rem, .8fr) minmax(0, 1.2fr); align-items: center; gap: clamp(var(--space-xl), 5vw, var(--space-3xl)); padding: clamp(var(--space-xl), 6vw, var(--space-3xl)) 0; }

.game-detail__copy h1 { margin: 0; font-size: clamp(var(--font-size-4xl), 7vw, var(--font-size-4xl)); font-weight: var(--font-weight-black); letter-spacing: var(--letter-spacing-tight); line-height: var(--line-height-tight); }

.game-detail__original { margin: var(--space-md) 0 0; color: var(--color-muted); font-weight: var(--font-weight-bold); }

.game-detail__summary { margin: var(--space-lg) 0; color: var(--color-highlight-strong); font-size: var(--font-size-lg); }

.game-detail__cover { overflow: hidden; aspect-ratio: 16 / 9; border-radius: var(--radius-lg); background: var(--color-surface-strong); box-shadow: var(--shadow-modal); }

.game-detail__cover img { display: block; width: 100%; height: 100%; object-fit: cover; }

.game-detail__layout { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(18rem, .7fr); align-items: start; gap: clamp(var(--space-xl), 5vw, var(--space-3xl)); padding-top: var(--space-xl); border-top: 1px solid var(--color-border); }

.game-detail__description { max-width: 72ch; font-size: var(--font-size-md); }

.game-detail__description h2, .game-facts h2 { margin: 0 0 var(--space-md); font-weight: var(--font-weight-black); }

.game-detail__description img { max-width: 100%; height: auto; }

.game-facts { display: grid; gap: var(--space-md); }

.game-facts section { padding: var(--space-md); border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); }

.game-facts h2 { font-size: var(--font-size-lg); }

.game-fact { display: flex; flex-wrap: wrap; gap: var(--space-sm) var(--space-sm); padding: var(--space-sm) 0; border-top: 1px solid var(--color-border); }

.game-fact span { color: var(--color-muted); font-size: var(--font-size-sm); }

.game-store {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-md);
    padding: var(--space-md) 0;
    border-top: 1px solid var(--arvr-rule);
}

.game-store:first-of-type {
    border-top: 0;
    padding-top: var(--space-xs);
}

.game-store__content {
    display: flex;
    flex-direction: column;
    gap: var(--space-2xs);
    min-width: 0;
}

.game-store__name {
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-bold);
    color: var(--color-ink);
    line-height: var(--line-height-snug);
}

.game-store .button,
.game-store__action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-xs);
    white-space: nowrap;
    flex-shrink: 0;
}

@media (max-width: 1199.98px) {
.games-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 61.99rem) {
.games-layout { grid-template-columns: 1fr; }
}

@media (max-width: 767.98px) {
.games-hero__inner { display: block; }
.games-hero h1 { max-width: 100%; overflow-wrap: anywhere; }
.games-hero__mark { display: none; }
.games-grid { grid-template-columns: 1fr; }
.games-results__header { flex-wrap: wrap; }
.games-results__header p { flex: 1 0 100%; }
.game-detail__hero, .game-detail__layout { grid-template-columns: 1fr; }
.game-detail__cover { grid-row: 1; }
.games-pagination { flex-wrap: wrap; }
}

@media (prefers-reduced-motion: reduce) {
.game-card, .game-card__media img, .games-filter summary .bi, .games-chip, .games-filters, .games-drawer-backdrop, .games-filter label, .games-filter input[type="checkbox"], .games-filters__header-badge, .games-filter__group-badge { transition: none; animation: none; }
.game-card:hover, .game-card__action:hover, .games-chip:hover, .games-filter label:hover, .games-filter__option:hover { transform: none; }
}

.games-filter-toggle { display: none; min-height: 44px; align-items: center; justify-content: center; gap: var(--space-sm); padding: var(--space-sm) var(--space-md); border: 1px solid var(--color-border); border-radius: var(--radius-md); color: var(--color-ink); background: var(--color-paper); font-weight: var(--font-weight-bold); cursor: pointer; }

.games-filter-toggle span { padding: var(--space-xs) var(--space-sm); border-radius: var(--ds-primitive-radius-full); color: var(--color-accent); background: var(--color-accent-soft); font-size: var(--font-size-xs); }

.games-filter-toggle__badge { display: inline-flex; align-items: center; justify-content: center; min-width: 1.35rem; height: 1.35rem; padding: 0 var(--space-xs); border-radius: var(--ds-primitive-radius-full); background: var(--color-dark); color: var(--color-on-dark); font-size: var(--font-size-xs); font-weight: var(--font-weight-black); }

.games-drawer-backdrop { position: fixed; inset: 0; background: color-mix(in srgb, var(--color-dark) 65%, transparent); backdrop-filter: blur(2px); z-index: var(--ds-primitive-z-sticky); opacity: 0; visibility: hidden; transition: opacity var(--duration-medium) ease, visibility var(--duration-medium) ease; }
.games-drawer-backdrop.is-open { opacity: 1; visibility: visible; }
body.games-drawer-open { overflow: hidden; }

.game-store__offer {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-xs) var(--space-sm);
}

.game-store .game-store__discount-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 2px var(--space-xs);
    border-radius: var(--radius-xs);
    background: var(--color-dark);
    color: var(--color-on-dark) !important;
    font-family: var(--arvr-mono);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-black);
    line-height: 1;
}

.game-store__price-original {
    color: var(--color-muted);
    font-size: var(--font-size-sm);
    text-decoration: line-through;
    line-height: 1;
}

.game-store__price {
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-bold);
    color: var(--color-ink);
    line-height: 1;
}

.game-store__price.is-free {
    color: var(--color-accent);
}

.game-store__price.is-discounted {
    color: var(--color-ink);
    font-weight: var(--font-weight-black);
    font-size: var(--font-size-lg);
}

.game-store__price.is-stale,
.game-store__price.is-unavailable {
    color: var(--color-muted);
    font-weight: var(--font-weight-regular);
}


.game-detail-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(20rem, 24rem);
    align-items: start;
    gap: var(--space-lg);
    padding-bottom: var(--space-3xl);
}

.game-detail-main { min-width: 0; overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-paper); box-shadow: var(--shadow-sm); }

.game-detail-header {
    padding: clamp(var(--space-md), 3vw, var(--space-xl)) clamp(var(--space-md), 3vw, var(--space-xl)) var(--space-sm);
}

.game-detail-header__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-sm);
    margin-bottom: var(--space-xs);
}

.game-detail-header__badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-xs);
}

.game-card__badge {
    padding: var(--space-xs) var(--space-sm);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    font-family: var(--arvr-mono);
    font-size: var(--arvr-micro);
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
    letter-spacing: var(--letter-spacing-wide);
    color: var(--color-ink);
    background: var(--color-surface);
}

.game-card__badge.is-warning {
    border-color: var(--color-primary);
    color: var(--color-primary-strong);
    background: var(--color-surface);
}

.game-detail__title {
    max-width: 24ch;
    margin: var(--space-xs) 0;
    font-size: clamp(var(--font-size-2xl), 4vw, var(--font-size-4xl));
    font-weight: var(--font-weight-black);
    letter-spacing: var(--letter-spacing-tight);
    line-height: var(--line-height-tight);
}

.game-detail__original {
    margin: 0 0 var(--space-sm);
    color: var(--color-muted);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
}

.game-detail__chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-xs) var(--space-sm);
    margin-top: var(--space-md);
    margin-bottom: var(--space-sm);
}

.game-media-viewer {
    margin: 0 clamp(var(--space-md), 3vw, var(--space-xl)) var(--space-lg);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    overflow: hidden;
    background: var(--color-paper);
    box-shadow: var(--shadow-sm);
}

.game-media-viewer__main {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    background: var(--color-surface-strong);
    overflow: hidden;
}

.game-media-viewer__img,
.game-media-viewer__video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transform: scale(1);
    transition: opacity var(--duration-normal) var(--ds-primitive-motion-easing-standard),
                transform var(--duration-normal) var(--ds-primitive-motion-easing-standard),
                filter var(--duration-normal) var(--ds-primitive-motion-easing-standard);
}

.game-media-viewer__img.is-switching {
    opacity: 0.35;
    transform: scale(0.99);
    filter: blur(4px);
}

.game-media-viewer__zoom-btn {
    position: absolute;
    top: var(--space-sm);
    right: var(--space-sm);
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: var(--space-xs);
    padding: var(--space-xs) var(--space-sm);
    border: 1px solid var(--color-paper);
    border-radius: var(--radius-sm);
    background: color-mix(in srgb, var(--color-ink) 85%, transparent);
    backdrop-filter: blur(4px);
    color: var(--color-on-dark);
    font-family: var(--arvr-mono);
    font-size: var(--arvr-micro);
    font-weight: var(--font-weight-bold);
    cursor: pointer;
    transition: transform var(--duration-fast) ease, background var(--duration-fast) ease;
}

.game-media-viewer__zoom-btn:hover {
    background: var(--color-ink);
    transform: scale(1.04);
}

.game-media-viewer__caption-bar {
    position: absolute;
    bottom: 0;
    inset-inline: 0;
    padding: var(--space-md) var(--space-md) var(--space-xs);
    background: linear-gradient(to top, color-mix(in srgb, var(--color-ink) 80%, transparent) 0%, transparent 100%);
    color: var(--color-on-dark);
    font-size: var(--font-size-xs);
    pointer-events: none;
}

.game-media-viewer__caption {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: var(--line-height-normal);
    transition: opacity var(--duration-fast) ease, transform var(--duration-fast) ease;
}

.game-media-viewer__caption.is-updating {
    opacity: 0;
    transform: translateY(4px);
}

.game-media-strip {
    display: flex;
    gap: var(--space-xs);
    padding: var(--space-sm);
    background: var(--color-dark);
    border-top: 1px solid var(--color-border);
    overflow-x: auto;
    scrollbar-width: thin;
    scrollbar-color: color-mix(in srgb, var(--color-paper) 35%, transparent) transparent;
    scroll-behavior: smooth;
}

.game-media-strip::-webkit-scrollbar {
    width: .35rem;
    height: .35rem;
}

.game-media-strip::-webkit-scrollbar-track {
    background: transparent;
}

.game-media-strip::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--color-paper) 35%, transparent);
    border-radius: var(--ds-primitive-radius-full);
}

.game-media-strip::-webkit-scrollbar-thumb:hover {
    background: color-mix(in srgb, var(--color-paper) 70%, transparent);
}

.game-media-strip::-webkit-scrollbar-button {
    display: none;
    width: 0;
    height: 0;
}

.game-media-strip__item {
    flex: 0 0 clamp(5.5rem, 12vw, 8rem);
    aspect-ratio: 16 / 9;
    position: relative;
    padding: 0;
    border: 2px solid transparent;
    border-radius: var(--radius-xs);
    overflow: hidden;
    cursor: pointer;
    background: var(--color-dark-soft);
    opacity: 0.65;
    transform: translateZ(0);
    transition: opacity var(--duration-fast) ease,
                transform var(--duration-fast) var(--ds-primitive-motion-easing-standard),
                border-color var(--duration-fast) ease;
}

.game-media-strip__item:hover {
    opacity: 0.9;
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--color-paper) 45%, transparent);
}

.game-media-strip__item.is-active {
    opacity: 1;
    transform: translateY(-2px);
    border-color: var(--color-paper);
}

.game-media-strip__item:active {
    transform: translateY(-1px) scale(0.97);
}

.game-media-strip__item:focus-visible {
    outline: 2px solid var(--color-ring);
    outline-offset: 2px;
}

.game-media-strip__item:focus:not(:focus-visible) {
    outline: none;
}

.game-media-strip__item::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: var(--space-xs);
    background: linear-gradient(90deg, var(--color-primary), var(--color-highlight));
    transform: scaleX(0);
    transform-origin: center;
    transition: transform var(--duration-normal) var(--ds-primitive-motion-easing-standard);
    z-index: 2;
    pointer-events: none;
}

.game-media-strip__item.is-active::after {
    transform: scaleX(1);
}

.game-media-strip__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transform: scale(1);
    transition: transform var(--duration-normal) var(--ds-primitive-motion-easing-standard);
    pointer-events: none;
}

.game-media-strip__item:hover img {
    transform: scale(1.08);
}

.game-media-strip__item.is-active img {
    transform: scale(1.02);
}

.game-media-strip__play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 2rem;
    height: 2rem;
    border-radius: var(--ds-primitive-radius-full);
    background: color-mix(in srgb, var(--color-ink) 80%, transparent);
    backdrop-filter: blur(4px);
    border: 1px solid color-mix(in srgb, var(--color-paper) 60%, transparent);
    color: var(--color-paper);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-md);
    transition: transform var(--duration-fast) var(--ds-primitive-motion-easing-standard),
                background var(--duration-fast) ease,
                border-color var(--duration-fast) ease;
    z-index: 1;
    pointer-events: none;
}

.game-media-strip__item:hover .game-media-strip__play {
    transform: translate(-50%, -50%) scale(1.15);
    background: var(--color-primary);
    border-color: var(--color-primary);
}

.game-media-strip__badge {
    position: absolute;
    top: var(--space-xs);
    left: var(--space-xs);
    z-index: 1;
    padding: 2px var(--space-xs);
    border-radius: var(--radius-xs);
    background: color-mix(in srgb, var(--color-ink) 85%, transparent);
    color: var(--color-on-dark);
    font-family: var(--arvr-mono);
    font-size: 9px;
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
}

.game-detail__summary {
    padding: 0 clamp(var(--space-md), 3vw, var(--space-xl)) var(--space-lg);
    margin: 0;
    font-size: var(--font-size-md);
    line-height: var(--line-height-relaxed);
    color: var(--color-ink);
}

.game-detail-section {
    padding: clamp(var(--space-md), 3vw, var(--space-xl));
    border-top: 1px solid var(--color-border);
}

.game-detail-section__heading {
    margin-bottom: var(--space-xl);
}

.game-detail-prose .article-body {
    max-width: none;
}

.game-detail-prose .article-body > :first-child {
    margin-top: 0 !important;
}

.game-detail-prose .article-body h3 {
    margin-top: var(--space-xl);
    margin-bottom: var(--space-sm);
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-black);
    letter-spacing: var(--letter-spacing-tight);
    line-height: var(--line-height-tight);
    color: var(--color-ink);
}

.game-detail-prose .article-body h4 {
    margin-top: var(--space-lg);
    margin-bottom: var(--space-xs);
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--letter-spacing-normal);
    line-height: var(--line-height-tight);
    color: var(--color-ink);
}

.game-detail-prose .article-body p {
    margin-top: 0;
    margin-bottom: var(--space-md);
    font-size: var(--font-size-md);
    line-height: var(--line-height-relaxed);
    color: var(--color-ink);
    max-width: 72ch;
}

.game-detail-prose .article-body ul,
.game-detail-prose .article-body ol {
    margin-top: 0;
    margin-bottom: var(--space-lg);
    padding-left: var(--space-xl);
    max-width: 72ch;
}

.game-detail-prose .article-body li {
    margin-bottom: var(--space-xs);
    line-height: var(--line-height-relaxed);
}

.game-detail-prose .article-body li > p {
    margin-bottom: 0;
}

.game-lightbox {
    position: fixed;
    inset: 0;
    z-index: var(--ds-primitive-z-modal);
    background: color-mix(in srgb, var(--color-dark) 94%, transparent);
    backdrop-filter: blur(8px);
    display: none;
}

.game-lightbox.is-open {
    display: flex;
}

.game-lightbox__dialog {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    padding: var(--space-md);
    box-sizing: border-box;
}

.game-lightbox__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-md);
    padding-bottom: var(--space-sm);
    border-bottom: 1px solid color-mix(in srgb, var(--color-paper) 20%, transparent);
    color: var(--color-on-dark);
}

.game-lightbox__counter {
    font-family: var(--arvr-mono);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--letter-spacing-wide);
}

.game-lightbox__title {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.game-lightbox__close {
    width: 2.25rem;
    height: 2.25rem;
    display: grid;
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--color-paper) 30%, transparent);
    border-radius: var(--radius-sm);
    background: color-mix(in srgb, var(--color-ink) 60%, transparent);
    color: var(--color-on-dark);
    cursor: pointer;
    transition: background var(--duration-fast) ease;
}

.game-lightbox__close:hover {
    background: var(--color-paper);
    color: var(--color-ink);
}

.game-lightbox__content {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-md);
    position: relative;
    overflow: hidden;
    padding-block: var(--space-sm);
}

.game-lightbox__media-wrap {
    flex: 1 1 auto;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.game-lightbox__img {
    max-width: 100%;
    max-height: calc(100vh - 10rem);
    object-fit: contain;
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-modal);
}

.game-lightbox__nav {
    flex: 0 0 2.75rem;
    width: 2.75rem;
    height: 2.75rem;
    display: grid;
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--color-paper) 30%, transparent);
    border-radius: var(--radius-sm);
    background: color-mix(in srgb, var(--color-ink) 70%, transparent);
    color: var(--color-on-dark);
    font-size: var(--font-size-lg);
    cursor: pointer;
    transition: background var(--duration-fast) ease, transform var(--duration-fast) ease;
}

.game-lightbox__nav:hover {
    background: var(--color-paper);
    color: var(--color-ink);
    transform: scale(1.05);
}

.game-lightbox__footer {
    padding-top: var(--space-sm);
    text-align: center;
    color: var(--color-on-dark);
    font-size: var(--font-size-xs);
    opacity: 0.85;
}

body.lightbox-locked {
    overflow: hidden;
}

.game-detail-aside { display: grid; align-content: start; gap: var(--space-md); position: sticky; top: calc(var(--arvr-header-height, var(--arvr-anchor-offset)) + var(--space-md)); z-index: var(--ds-primitive-z-content); }

.game-aside-card { padding: var(--space-lg); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-paper); box-shadow: var(--shadow-sm); }

.game-aside-card h2 { margin: 0 0 var(--space-md); font-size: var(--font-size-lg); font-weight: var(--font-weight-black); }

.game-aside-card dl { display: grid; gap: var(--space-md); margin: 0; }

.game-aside-card dl > div { display: grid; grid-template-columns: minmax(6rem, .7fr) minmax(0, 1fr); gap: var(--space-sm); padding-bottom: var(--space-md); border-bottom: 1px solid var(--color-border); }

.game-aside-card dt { color: var(--color-muted); font-size: var(--font-size-xs); font-weight: var(--font-weight-bold); }

.game-aside-card dd { margin: 0; font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); overflow-wrap: anywhere; }

.game-aside-card dd small { display: block; margin-top: var(--space-xs); color: var(--color-primary); }

.game-aside-link { display: inline-flex; align-items: center; gap: var(--space-sm); margin-top: var(--space-md); color: var(--color-accent); font-weight: var(--font-weight-bold); }

.game-aside-card--rating > p { margin: 0; color: var(--color-muted); font-size: var(--font-size-xs); font-weight: var(--font-weight-bold); text-transform: uppercase; }

.game-aside-card--rating > strong { display: block; margin: var(--space-xs) 0; font-size: var(--font-size-4xl); line-height: var(--line-height-tight); }

.game-aside-card--rating > span { color: var(--color-muted); font-size: var(--font-size-xs); }

.game-aside-card--rating hr { margin: var(--space-md) 0; border: 0; border-top: 1px solid var(--color-border); }

.game-aside-card--rating form { display: grid; gap: var(--space-sm); margin-top: var(--space-md); }

.game-aside-card--rating form > div { display: grid; grid-template-columns: 4.5rem 1fr; gap: var(--space-sm); }

.game-aside-card--rating select { min-height: 44px; border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: var(--color-paper); }

.game-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-md); }

.game-gallery__item { margin: 0; min-width: 0; }

.game-gallery__item.is-featured { grid-column: 1 / -1; }

.game-gallery img, .game-gallery video { display: block; width: 100%; aspect-ratio: 16 / 9; border-radius: var(--radius-md); object-fit: cover; background: var(--color-dark); }

.game-gallery figcaption { margin-top: var(--space-sm); color: var(--color-muted); font-size: var(--font-size-xs); }

.game-spec-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr));
    gap: var(--space-md);
}

.game-platform-card {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-lg);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    border: 1px solid var(--arvr-rule);
}

.game-platform-card__header {
    display: flex;
    align-items: center;
    gap: var(--space-md);
}

.game-platform-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: var(--radius-sm);
    background: var(--color-ink);
    color: var(--color-paper);
    font-size: var(--font-size-xl);
    flex-shrink: 0;
}

.game-platform-card__info {
    min-width: 0;
}

.game-platform-card__title {
    margin: 0;
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-black);
    color: var(--color-ink);
}

.game-platform-card__runtime {
    margin: var(--space-2xs) 0 0;
    color: var(--color-muted);
    font-size: var(--font-size-xs);
    display: flex;
    align-items: center;
    gap: var(--space-xs);
    flex-wrap: wrap;
}

.game-platform-card__mr-badge {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2xs);
    padding: var(--space-2xs) var(--space-xs);
    border-radius: var(--radius-xs);
    background: var(--color-surface-strong);
    color: var(--color-ink);
    font-family: var(--arvr-mono);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
}

.game-platform-card__details {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    padding-top: var(--space-sm);
    border-top: 1px solid var(--arvr-rule);
}

.game-platform-card__row {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    flex-wrap: wrap;
}

.game-platform-card__label {
    font-family: var(--arvr-mono);
    font-size: var(--font-size-xs);
    color: var(--color-muted);
    font-weight: var(--font-weight-bold);
    min-width: 6.5rem;
}

.game-platform-card__tags {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-xs);
}

.game-requirements {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr));
    gap: var(--space-lg);
    margin-top: var(--space-xl);
}

.game-requirements-card {
    padding: var(--space-lg);
    border: 1px solid var(--arvr-rule);
    border-radius: var(--radius-md);
    background: var(--color-paper);
}

.game-requirements-card__header {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    margin-bottom: var(--space-md);
    padding-bottom: var(--space-sm);
    border-bottom: 1px solid var(--arvr-rule);
}

.game-requirements-card__header i {
    font-size: var(--font-size-lg);
    color: var(--color-ink);
}

.game-requirements-card__header h3 {
    margin: 0;
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-bold);
    color: var(--color-ink);
}

.game-requirements-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    margin: 0;
    padding: 0;
}

.game-requirements-list__row {
    display: grid;
    grid-template-columns: minmax(6.5rem, 8.5rem) 1fr;
    gap: var(--space-sm);
    padding: var(--space-2xs) 0;
    border-bottom: 1px dashed var(--arvr-rule);
}

.game-requirements-list__row:last-child {
    border-bottom: 0;
}

.game-requirements-list dt {
    margin: 0;
    font-family: var(--arvr-mono);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-bold);
    color: var(--color-muted);
    text-transform: uppercase;
    letter-spacing: var(--letter-spacing-wide);
    align-self: baseline;
}

.game-requirements-list dd {
    margin: 0;
    font-size: var(--font-size-sm);
    color: var(--color-ink);
    line-height: var(--line-height-tight);
    align-self: baseline;
}

.game-accessibility { margin-top: var(--space-lg); padding: var(--space-lg); border-radius: var(--radius-md); background: var(--color-accent-soft); }

.game-accessibility h3 { margin-top: 0; }

.game-accessibility ul { display: grid; gap: var(--space-sm); margin: 0; padding: 0; list-style: none; }

.game-accessibility li { display: flex; gap: var(--space-sm); align-items: flex-start; }

.game-similar-section {
    position: relative;
}

.game-similar-swiper {
    overflow: hidden;
    padding: var(--space-xs) 0;
}

.game-similar-swiper .swiper-wrapper,
.arvr-content-rail--games .swiper-wrapper {
    align-items: stretch;
}

.game-similar-swiper .swiper-slide,
.arvr-content-rail--games .swiper-slide {
    height: auto;
    display: flex;
}

.game-rail-card {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}

.game-rail-card__link {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    flex: 1 1 auto;
    text-decoration: none;
    color: inherit;
    padding: var(--space-xs);
    border-radius: var(--radius-sm);
    transition: background-color var(--duration-fast) ease;
}

.game-rail-card__link:hover {
    background: var(--color-bg);
    color: var(--color-ink);
}

.game-rail-card__media {
    position: relative;
    aspect-ratio: 16 / 9;
    background: var(--color-dark);
    overflow: hidden;
    border-radius: var(--radius-xs);
    flex-shrink: 0;
}

.game-rail-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform var(--duration-fast) ease;
}

.game-rail-card__link:hover .game-rail-card__media img {
    transform: scale(1.03);
}

.game-rail-card__badges {
    position: absolute;
    top: var(--space-xs);
    left: var(--space-xs);
    display: flex;
    align-items: center;
    gap: var(--space-2xs);
    z-index: 2;
    pointer-events: none;
}

.game-rail-card__badges .game-card__badge-discount,
.game-rail-card__badges .game-badge-discount,
.game-detail-header__badges .game-card__badge-discount,
.game-detail-header__badges .game-badge-discount {
    position: static;
    top: auto;
    left: auto;
}

.game-rail-card__copy {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    padding: var(--space-sm) 0 0;
}

.game-rail-card__platforms {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2xs);
    margin-bottom: var(--space-2xs);
}

.game-rail-card__title {
    margin: 0 0 var(--space-xs);
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-bold);
    color: var(--color-ink);
    line-height: var(--line-height-snug);
    min-height: calc(var(--font-size-md) * var(--line-height-snug) * 2);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.game-rail-card__price-row {
    margin-top: auto;
    display: flex;
    align-items: baseline;
    gap: var(--space-xs);
    padding-top: var(--space-2xs);
}

.game-rail-card__price-main {
    font-family: var(--font-sans);
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-black);
    color: var(--color-ink);
    line-height: var(--line-height-none);
    letter-spacing: var(--letter-spacing-tight);
}

.game-rail-card__price-old {
    font-size: var(--font-size-xs);
    color: var(--color-muted);
    text-decoration: line-through;
}

.game-rail-card__price-unspecified {
    font-family: var(--arvr-mono);
    font-size: var(--font-size-xs);
    color: var(--color-muted);
    text-transform: uppercase;
}

.game-detail-crosslinks {
    margin-top: var(--space-2xl);
    padding-top: var(--space-xl);
    border-top: 1px solid var(--arvr-rule);
}

.review-report { margin-top: var(--space-lg); border: 1px solid var(--arvr-rule); border-radius: 0; background: var(--color-surface); }

.review-report summary { display: flex; align-items: center; gap: var(--space-sm); padding: var(--space-md); color: var(--color-muted); font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); cursor: pointer; user-select: none; }

.review-report summary:hover { color: var(--color-ink); }

.review-report form { display: grid; gap: var(--space-sm); padding: 0 var(--space-md) var(--space-md); }

.review-report textarea { width: 100%; min-height: 6rem; padding: var(--space-sm); border: 1px solid var(--arvr-rule); border-radius: 0; background: var(--color-paper); color: var(--color-ink); font-family: var(--font-sans); font-size: var(--font-size-sm); resize: vertical; }

.review-sidebar-link { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-xs) var(--space-sm); padding: var(--space-md) 0; border-bottom: 1px solid var(--color-border); color: var(--color-ink); text-decoration: none; }

.review-sidebar-link span { grid-column: 1 / -1; color: var(--color-muted); font-size: var(--font-size-xs); text-transform: uppercase; }

.review-sidebar-link strong { font-size: var(--font-size-xs); line-height: var(--line-height-ui); }

.review-sidebar-link small { color: var(--color-primary); font-weight: var(--font-weight-black); }

.review-author-page { padding-bottom: var(--space-3xl); }

.review-author-hero { display: grid; grid-template-columns: 7rem minmax(0, 1fr); align-items: center; gap: var(--space-lg); max-width: 60rem; margin: var(--space-xl) 0 var(--space-2xl); padding: var(--space-xl); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-paper); }

.review-author-hero img, .review-author-hero > span { width: 7rem; height: 7rem; border-radius: 50%; object-fit: cover; }

.review-author-hero > span { display: grid; place-items: center; color: var(--color-on-dark); background: var(--color-dark); font-size: var(--font-size-3xl); font-weight: var(--font-weight-black); }

.review-author-hero h1, .review-author-hero p { margin: 0; }

.review-author-hero h1 { font-size: clamp(var(--font-size-3xl), 5vw, var(--font-size-4xl)); letter-spacing: var(--letter-spacing-tight); }

.review-author-hero p { max-width: 56ch; margin-top: var(--space-sm); color: var(--color-muted); }

.review-author-hero small { display: block; margin-top: var(--space-md); font-weight: var(--font-weight-bold); }

.game-reviews-heading { display: flex; align-items: end; justify-content: space-between; gap: var(--space-lg); margin-bottom: var(--space-lg); }

.game-reviews-heading > div:first-child > p:last-child { max-width: 38rem; margin: var(--space-sm) 0 0; color: var(--color-muted); }

.game-reviews-heading__aside { display: flex; flex: 0 0 auto; align-items: center; gap: var(--space-md); }

.game-reviews-nav { display: flex; gap: var(--space-sm); }

.game-reviews-nav button { display: grid; width: var(--button-height); height: var(--button-height); place-items: center; border: 1px solid var(--color-border); border-radius: 0; color: var(--color-ink); background: var(--color-paper); cursor: pointer; transition: color var(--duration-fast) ease, border-color var(--duration-fast) ease, background var(--duration-fast) ease; }

.game-reviews-nav button:hover, .game-reviews-nav button:focus-visible { border-color: var(--color-dark); color: var(--color-on-dark); background: var(--color-dark); }

.game-reviews-nav button.swiper-button-disabled { opacity: .35; cursor: default; }

.game-reviews-swiper { overflow: hidden; padding-bottom: var(--space-xl); }

.game-reviews-swiper .swiper-slide { height: auto; }

.game-review-slide-card { display: grid; min-height: 20rem; height: 100%; grid-template-columns: 8.5rem minmax(0, 1fr); overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-paper); box-shadow: var(--shadow-sm); }

.game-review-slide-card__score { display: grid; align-content: center; justify-items: center; color: var(--color-on-dark); background: radial-gradient(circle at 50% 20%, color-mix(in srgb, var(--color-accent) 38%, transparent), transparent 45%), var(--color-dark); }

.game-review-slide-card__score strong { font-size: clamp(var(--font-size-4xl), 8vw, var(--font-size-4xl)); font-weight: var(--font-weight-black); letter-spacing: var(--letter-spacing-tight); line-height: var(--line-height-tight); }

.game-review-slide-card__score span { margin-top: var(--space-sm); color: var(--color-on-dark-muted); font-size: var(--font-size-xs); font-weight: var(--font-weight-bold); text-transform: uppercase; }

.game-review-slide-card__content { display: grid; min-width: 0; grid-template-rows: auto auto 1fr auto; gap: var(--space-md); padding: clamp(var(--space-lg), 4vw, var(--space-xl)); }

.game-review-slide-card__meta { display: flex; justify-content: space-between; gap: var(--space-md); color: var(--color-muted); font-size: var(--font-size-xs); font-weight: var(--font-weight-bold); text-transform: uppercase; }

.game-review-slide-card__meta span { color: var(--color-accent); }

.game-review-slide-card__meta .bi { margin-right: var(--space-sm); }

.game-review-slide-card h3 { max-width: 24ch; margin: 0; font-size: clamp(var(--font-size-2xl), 3vw, var(--font-size-3xl)); font-weight: var(--font-weight-black); letter-spacing: var(--letter-spacing-tight); line-height: var(--line-height-tight); }

.game-review-slide-card h3 a { color: inherit; text-decoration: none; }

.game-review-slide-card blockquote { margin: 0; color: var(--color-muted); font-size: clamp(var(--font-size-md), 1.8vw, var(--font-size-lg)); line-height: var(--line-height-body); }

.game-review-slide-card footer { display: flex; align-items: center; justify-content: space-between; gap: var(--space-md); padding-top: var(--space-md); border-top: 1px solid var(--color-border); }

.game-review-slide-card__author { display: flex; min-width: 0; align-items: center; gap: var(--space-sm); color: var(--color-ink); text-decoration: none; }

.game-review-slide-card__author img, .game-review-slide-card__author > span { width: 42px; height: 42px; flex: 0 0 42px; border-radius: 50%; object-fit: cover; }

.game-review-slide-card__author > span { display: grid; place-items: center; color: var(--color-on-dark); background: var(--color-dark); font-weight: var(--font-weight-black); }

.game-review-slide-card__author strong { overflow: hidden; font-size: var(--font-size-sm); text-overflow: ellipsis; white-space: nowrap; }

.game-review-slide-card__link { display: inline-flex; align-items: center; gap: var(--space-sm); color: var(--color-accent); font-size: var(--font-size-xs); font-weight: var(--font-weight-black); text-decoration: none; }

.game-reviews-pagination { bottom: 0 !important; }

.game-reviews-pagination .swiper-pagination-bullet { width: .55rem; height: .55rem; background: var(--color-muted); opacity: .25; }

.game-reviews-pagination .swiper-pagination-bullet-active { width: 1.7rem; border-radius: var(--ds-primitive-radius-full); background: var(--color-accent); opacity: 1; }

.game-rating-form, .game-rating-complete { position: relative; display: grid; gap: var(--space-sm); margin-top: var(--space-lg); padding-top: var(--space-md); border-top: 1px solid var(--color-border); }

.game-rating-form fieldset { margin: 0; padding: 0; border: 0; }

.game-rating-form legend, .game-rating-complete > span { margin-bottom: var(--space-sm); color: var(--color-ink); font-size: var(--font-size-sm); font-weight: var(--font-weight-black); }

.game-rating-stars { display: flex; align-items: center; gap: var(--space-xs); }

.game-rating-stars label { position: relative; display: grid; width: 44px; height: 44px; place-items: center; border-radius: var(--radius-md); color: var(--color-border); cursor: pointer; }

.game-rating-stars label:hover { background: var(--color-accent-soft); }

.game-rating-stars label i { font-size: var(--font-size-2xl); transition: color var(--duration-fast) ease, transform var(--duration-fast) ease; }

.game-rating-stars label.is-active i { color: var(--color-primary); transform: scale(1.08); }

.game-rating-stars input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }

.game-rating-stars label:has(input:focus-visible) { outline: 3px solid var(--color-accent); outline-offset: 2px; }

.game-rating-form > button { width: 100%; }

.game-rating-form > small, .game-rating-complete small { color: var(--color-muted); font-size: var(--font-size-xs); line-height: var(--line-height-ui); }

.game-rating-stars.is-readonly i { color: var(--color-border); font-size: var(--font-size-2xl); }

.game-rating-stars.is-readonly i.is-active { color: var(--color-primary); }

.game-rating-complete > strong { font-size: var(--font-size-md); }

.game-rating-login { display: flex; align-items: center; gap: var(--space-md); margin-top: var(--space-lg); padding: var(--space-md); border-radius: var(--radius-md); color: var(--color-ink); background: var(--color-surface); text-decoration: none; }

.game-rating-login > .bi { color: var(--color-accent); font-size: var(--font-size-xl); }

.game-rating-login span { display: grid; gap: var(--space-xs); }

.game-rating-login small { color: var(--color-muted); font-size: var(--font-size-xs); }

.game-rating-tooltip { position: absolute; z-index: 5; right: 0; bottom: calc(100% + .5rem); display: flex; max-width: 18rem; align-items: center; gap: var(--space-sm); padding: var(--space-sm) var(--space-md); border-radius: var(--radius-md); opacity: 0; pointer-events: none; transform: translateY(.35rem); transition: opacity var(--duration-fast) ease, transform var(--duration-fast) ease; font-size: var(--font-size-xs); font-weight: var(--font-weight-bold); }

.game-rating-tooltip.is-visible { opacity: 1; transform: translateY(0); }

.game-rating-tooltip.is-success { border: 1px solid var(--color-border); color: var(--color-success); background: var(--color-highlight-soft); box-shadow: var(--shadow-card); }

.game-rating-tooltip.is-error { border: 1px solid var(--color-border); color: var(--color-primary-strong); background: var(--color-surface); box-shadow: var(--shadow-card); }



@media (max-width: 74rem) {
.game-detail-shell { grid-template-columns: minmax(0, 1fr) minmax(17rem, 20rem); }
.game-detail-aside { position: static; }
}

@media (max-width: 61.99rem) {
.games-filter-toggle { display: inline-flex; margin-bottom: var(--space-md); }
.games-layout, .games-calendar-layout { display: block; }
.games-drawer-header { display: flex; align-items: center; justify-content: space-between; padding: var(--space-md); border-bottom: 1px solid var(--color-border); background: var(--color-paper); }
.games-drawer-header h3 { margin: 0; font-size: var(--font-size-lg); font-weight: var(--font-weight-black); }
.games-drawer-close { display: grid; width: 2.25rem; height: 2.25rem; place-items: center; border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: var(--color-surface); color: var(--color-ink); font-size: var(--font-size-md); cursor: pointer; }
.games-filters { position: fixed; inset: auto 0 0 0; max-height: 88vh; z-index: var(--ds-primitive-z-modal); border-radius: var(--radius-lg) var(--radius-lg) 0 0; box-shadow: var(--shadow-modal); transform: translateY(105%); transition: transform var(--duration-medium) ease; display: flex; flex-direction: column; background: var(--color-paper); margin: 0; border: 0; }
.games-filters.is-open { transform: translateY(0); }
.games-drawer-body { overflow-y: auto; -webkit-overflow-scrolling: touch; flex: 1 1 auto; }
.games-filter__actions { position: sticky; bottom: 0; z-index: var(--ds-primitive-z-content); background: var(--color-paper); border-top: 1px solid var(--color-border); padding: var(--space-md); box-shadow: var(--shadow-sm); grid-template-columns: 1fr auto; align-items: center; }
.games-filter-apply-btn { width: 100%; }
.game-detail-shell { grid-template-columns: 1fr; }
.game-detail-aside { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 62rem) {
.games-drawer-backdrop, .games-drawer-close { display: none !important; }
.games-filters { position: sticky; top: calc(var(--arvr-header-height, var(--arvr-anchor-offset)) + var(--space-md)); transform: none; max-height: calc(100dvh - var(--arvr-header-height, var(--arvr-anchor-offset)) - var(--space-xl)); overflow: hidden; display: flex; flex-direction: column; z-index: var(--ds-primitive-z-content); }
}

@media (max-width: 47.99rem) {
.game-detail-main { border-inline: 0; border-radius: var(--radius-lg); }
.game-detail-aside, .game-gallery, .game-spec-grid, .game-requirements, .game-similar-grid { grid-template-columns: 1fr; }
.game-gallery__item.is-featured { grid-column: auto; }
.game-detail-hero__copy, .game-detail-section { padding: var(--space-md); }
.game-detail-hero__copy h1 { font-size: clamp(var(--font-size-3xl), 12vw, var(--font-size-4xl)); overflow-wrap: anywhere; }
.review-author-hero { grid-template-columns: 4.5rem minmax(0, 1fr); padding: var(--space-md); }
.review-author-hero img, .review-author-hero > span { width: 4.5rem; height: 4.5rem; }
.game-reviews-heading { align-items: start; flex-direction: column; gap: var(--space-md); }
.game-reviews-heading__aside { width: 100%; justify-content: space-between; flex-wrap: wrap; gap: var(--space-sm); }
.game-review-slide-card { grid-template-columns: 1fr; }
.game-review-slide-card__score { min-height: 7.5rem; }
.game-review-slide-card__score strong { font-size: var(--font-size-4xl); }
.game-review-slide-card footer { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
.game-reviews-nav button, .game-rating-stars label i, .game-rating-tooltip,
.game-media-strip__item, .game-media-strip__item img, .game-media-strip__item::after,
.game-media-viewer__img, .game-media-viewer__caption, .game-media-strip__play {
    transition: none !important;
    transform: none !important;
    filter: none !important;
}
}

.games-hero,
.games-subsection-hero,
.catalog-hero,
.catalog-hero--howto,
.events-hero,
.category-hero {
    padding-block: 0;
    border-bottom: 1px solid var(--page-intro-border-color);
    color: var(--page-intro-foreground);
    background: var(--page-intro-surface);
}

.games-hero__inner,
.games-subsection-hero > .container,
.catalog-hero__inner,
.events-hero__inner {
    min-height: 0;
    padding-block: var(--page-intro-padding-block);
}

.games-hero h1,
.games-subsection-hero h1,
.catalog-hero h1,
.events-hero h1 {
    max-width: 28ch;
    margin: 0;
    color: var(--page-intro-foreground);
    font-size: var(--page-intro-title-size);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--page-intro-title-spacing);
    line-height: var(--line-height-tight);
    text-wrap: balance;
}

.games-hero p:not(.eyebrow),
.games-subsection-hero p:not(.eyebrow),
.catalog-hero p:not(.eyebrow),
.events-hero p:not(.eyebrow) {
    max-width: 68ch;
    margin-top: var(--page-intro-summary-gap);
    color: var(--page-intro-summary-color);
    font-size: var(--page-intro-summary-size);
    line-height: var(--line-height-body);
}

.games-hero .eyebrow,
.games-subsection-hero .eyebrow,
.catalog-hero .eyebrow,
.events-hero .eyebrow {
    color: var(--page-intro-signal-color);
}

.games-hero__mark,
.catalog-hero__inner > span {
    display: none;
}

.games-hero .games-section-nav,
.games-subsection-hero .games-section-nav {
    border-color: var(--color-border);
    background: var(--color-surface);
}

.games-hero .games-section-nav a,
.games-subsection-hero .games-section-nav a {
    color: var(--color-muted);
}

.games-hero .games-section-nav a:hover,
.games-hero .games-section-nav a:focus-visible,
.games-subsection-hero .games-section-nav a:hover,
.games-subsection-hero .games-section-nav a:focus-visible {
    color: var(--page-intro-foreground);
    background: var(--page-intro-surface);
}

.games-hero .games-section-nav a.is-active,
.games-subsection-hero .games-section-nav a.is-active {
    color: var(--color-on-dark);
    background: var(--color-dark);
}

.game-detail__hero,
.detail-hero,
.event-detail__hero {
    align-items: start;
    gap: var(--page-intro-media-gap);
    padding-block: var(--page-intro-padding-block);
}

.game-detail__copy h1,
.detail-hero h1,
.event-detail__hero h1,
.company-hero h1,
.club-hero h1,
.branch-hero h1 {
    margin-bottom: var(--space-sm);
    color: var(--page-intro-foreground);
    font-size: var(--page-intro-title-size);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--page-intro-title-spacing);
    line-height: var(--line-height-tight);
    text-wrap: balance;
}

.game-detail__summary,
.detail-hero > div > p:not(.eyebrow),
.event-detail__hero p:not(.eyebrow),
.company-hero__content > p,
.club-hero p {
    margin-block: var(--space-md) var(--space-md);
    color: var(--page-intro-summary-color);
    font-size: var(--page-intro-summary-size);
    line-height: var(--line-height-body);
}

.game-detail__cover,
.detail-hero > img,
.event-detail__hero > img {
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
}

@media (max-width: 61.99rem) {
.game-detail__hero,
    .detail-hero,
    .event-detail__hero,
    .branch-hero {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 47.99rem) {
.game-detail__hero,
    .detail-hero,
    .event-detail__hero {
        gap: var(--space-lg);
    }
}