/* Game selection and catalog density. Hero geometry lives in character-stage.css. */
.hero-cycle-controls { display: flex; align-items: center; color: #91a5c3; }
.hero-cycle-buttons { display: flex; align-items: center; }
.hero-cycle-buttons button { display: grid; place-items: center; border: 1px solid #758caa38; border-radius: 4px; background: transparent; color: #a7bbd9; cursor: pointer; transition: background .2s, border-color .2s; }
.hero-cycle-buttons button:hover { background: #4389ff24; border-color: #71a5f7; color: white; }
.hero-cycle-buttons .icon { width: 14px; height: 14px; }
#hero-game-count { color: #9cafca; font-variant-numeric: tabular-nums; white-space: nowrap; }
.lineup-quick-nav {
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr));
  grid-template-rows: repeat(2, auto);
  gap: 0 16px; padding: 15px 0 19px;
  border-top: 1px solid #7999c724;
}
.hero-game-choice {
  display: flex; align-items: center; gap: 12px; position: relative;
  padding: 11px 7px 11px 12px; border-radius: 4px; text-align: left;
  min-width: 0; min-height: 62px; color: #899cba; background: transparent; border: 0; cursor: pointer; font: inherit;
  transition: background .2s, color .2s;
}
.hero-game-choice::before { content: ''; position: absolute; left: 0; top: 13px; bottom: 13px; width: 2px; background: transparent; }
.hero-game-choice > img { width: 40px; height: 40px; object-fit: cover; border-radius: 3px; opacity: .55; filter: saturate(.4); transition: opacity .2s, filter .2s; }
.hero-game-choice > span { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.hero-game-choice small { color: #627b9e; font-size: 8px; line-height: 1; font-variant-numeric: tabular-nums; }
.lineup-quick-nav .hero-game-choice strong { font-size: 11px; font-weight: 600; line-height: 1.45; }
.hero-game-choice:hover { color: #e0edff; background: #6a93cc0b; }
.hero-game-choice[aria-pressed="true"] { background: linear-gradient(90deg,#498dfd1b,transparent); color: #e2edff; }
.hero-game-choice[aria-pressed="true"]::before { background: #589aff; }
.hero-game-choice[aria-pressed="true"] small { color: #84b4ff; }
.hero-game-choice[aria-pressed="true"] > img, .hero-game-choice:hover > img { opacity: 1; filter: saturate(.85); }
.hero-game-choice:focus-visible, .hero-cycle-buttons button:focus-visible { outline: 2px solid #76aaff; outline-offset: 3px; }
/* Keep every row on the same left edge, including the last row. */
.lineup-home .catalog-section { padding-bottom: 64px; }
.lineup-home .catalog-heading { align-items: center; gap: 24px; margin-bottom: 28px; }
.catalog-controls { display: flex; align-items: center; gap: 18px; min-width: 0; }
.lineup-home .catalog-controls .search-field { width: 280px; }
.catalog-controls .sort-field { flex: none; }
.lineup-home .lineup-card-title { min-height: 94px; padding-block: 17px; }
.lineup-home .game-grid {
  --catalog-columns: 4; --catalog-gap: 24px;
  display: flex; flex-wrap: wrap; justify-content: flex-start; gap: var(--catalog-gap);
}
.lineup-home .lineup-card { flex: 0 0 calc((100% - (var(--catalog-columns) - 1) * var(--catalog-gap)) / var(--catalog-columns)); min-width: 0; }
.lineup-card-price { font-weight: 700; font-size: 13px; color: #b6d0f6; font-variant-numeric: tabular-nums; }
@media (min-width:1280px) {
  .lineup-home .game-grid { --catalog-columns: 6; --catalog-gap: 20px; }
  .lineup-card-title { padding-inline: 16px; }
  .lineup-card h3 { white-space: normal; min-height: 40px; font-size: 13px; }
  .lineup-card-contact { padding-inline: 16px; font-size: 10px; }
}
@media (max-width:1190px) { .lineup-home .game-grid { --catalog-gap: 19px; } }
@media (max-width:1000px) {
  .lineup-home .game-grid { --catalog-columns: 3; }
  .lineup-home .catalog-heading { flex-direction: column; align-items: flex-start; gap: 20px; }
  .catalog-controls { width: 100%; justify-content: space-between; }
  .lineup-home .catalog-controls .search-field { width: min(380px, 100%); }
}
@media (min-width:761px) and (max-width:1000px) {
  .lineup-quick-nav { gap: 2px 8px; }
  .hero-game-choice { gap: 8px; padding-left: 9px; }
  .hero-game-choice > img { width: 31px; height: 35px; flex: none; }
  .lineup-quick-nav .hero-game-choice strong { font-size: 10px; }
}
@media (max-width:760px) {
  .lineup-card-price { font-size: 12px; }
  .lineup-home .catalog-section { padding-bottom: 44px; }
  .lineup-quick-nav {
    grid-template-columns: repeat(6, 154px);
    gap: 4px 12px; padding-block: 16px;
    overflow-x: auto; scrollbar-width: thin; scrollbar-color: #486a9b #212936;
    overscroll-behavior-x: contain;
  }
  .lineup-home .game-grid { --catalog-columns: 2; --catalog-gap: 18px; }
  .hero-game-choice { min-height: 58px; padding: 9px; gap: 9px; }
  .hero-game-choice > img { width: 34px; height: 34px; flex: none; }
  .lineup-quick-nav .hero-game-choice strong { font-size: 10px; }
}
@media (max-width:450px) { .lineup-home .game-grid { --catalog-gap: 13px; } .lineup-card-price { font-size: 11px; } }
@media (max-width:600px) {
  .catalog-controls { flex-wrap: wrap; gap: 14px; }
  .lineup-home .catalog-controls .search-field { width: 100%; }
  .catalog-controls .sort-field { margin-left: auto; }
}
@media (prefers-reduced-motion:reduce) {
  .hero-game-choice, .hero-game-choice > img, .hero-cycle-buttons button { transition: none; }
}