body.layout-viet-green:not(.game-mode) #jadeStage main {
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  gap: clamp(2px, .5vw, 7px);
}

#jadeStage .jade-game-filter {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: clamp(2px, .55vw, 8px);
  flex: 0 0 auto;
  width: 100%;
  height: clamp(34px, calc(55px * var(--jade-ui-scale, 1)), 55px);
  min-width: 0;
  padding: 0 2px;
}

#jadeStage .jade-game-filter button {
  width: 100%;
  min-width: 0;
  height: 100%;
  margin: 0;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--filter-normal) center / 100% 100% no-repeat !important;
  box-shadow: none !important;
  cursor: pointer;
  touch-action: manipulation;
  transition: filter .16s ease, transform .16s ease;
}

@media (hover: hover) {
  #jadeStage .jade-game-filter button:hover:not([aria-pressed="true"]) {
    background-image: var(--filter-hover) !important;
    filter: drop-shadow(0 1px 4px #f8d875aa);
    transform: translateY(-2px);
  }
}

#jadeStage .jade-game-filter button[aria-pressed="true"] {
  background-image: var(--filter-selected) !important;
  filter: drop-shadow(0 1px 5px #ffd77cb0);
}

#jadeStage .jade-game-filter button:focus-visible {
  outline: 2px solid #fff5bc !important;
  outline-offset: 1px !important;
}

#jadeStage .jade-game-filter button[data-filter="game-bai"] { --filter-normal: url('/assets/images/lobby-filter/game-bai-normal.webp'); --filter-hover: url('/assets/images/lobby-filter/game-bai-hover.webp'); --filter-selected: url('/assets/images/lobby-filter/game-bai-selected.webp'); }
#jadeStage .jade-game-filter button[data-filter="quay-hu"] { --filter-normal: url('/assets/images/lobby-filter/quay-hu-normal.webp'); --filter-hover: url('/assets/images/lobby-filter/quay-hu-hover.webp'); --filter-selected: url('/assets/images/lobby-filter/quay-hu-selected.webp'); }
#jadeStage .jade-game-filter button[data-filter="ban-ca"] { --filter-normal: url('/assets/images/lobby-filter/ban-ca-normal.webp'); --filter-hover: url('/assets/images/lobby-filter/ban-ca-hover.webp'); --filter-selected: url('/assets/images/lobby-filter/ban-ca-selected.webp'); }
#jadeStage .jade-game-filter button[data-filter="danh-co"] { --filter-normal: url('/assets/images/lobby-filter/danh-co-normal.webp'); --filter-hover: url('/assets/images/lobby-filter/danh-co-hover.webp'); --filter-selected: url('/assets/images/lobby-filter/danh-co-selected.webp'); }
#jadeStage .jade-game-filter button[data-filter="the-thao"] { --filter-normal: url('/assets/images/lobby-filter/the-thao-normal.webp'); --filter-hover: url('/assets/images/lobby-filter/the-thao-hover.webp'); --filter-selected: url('/assets/images/lobby-filter/the-thao-selected.webp'); }
#jadeStage .jade-game-filter button[data-filter="live-casino"] { --filter-normal: url('/assets/images/lobby-filter/live-casino-normal.webp'); --filter-hover: url('/assets/images/lobby-filter/live-casino-hover.webp'); --filter-selected: url('/assets/images/lobby-filter/live-casino-selected.webp'); }
#jadeStage .jade-game-filter button[data-filter="khac"] { --filter-normal: url('/assets/images/lobby-filter/khac-normal.webp'); --filter-hover: url('/assets/images/lobby-filter/khac-hover.webp'); --filter-selected: url('/assets/images/lobby-filter/khac-selected.webp'); }

#jadeStage .jade-rail-viewport {
  flex: 1 1 auto;
  height: auto;
}

#jadeStage .game-grid .game-card[hidden],
#jadeStage .jade-filter-empty[hidden],
body.game-mode #jadeStage .jade-game-filter { display: none !important; }

#jadeStage .jade-filter-empty {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  margin: 0;
  color: #ffe7ae;
  font: 700 clamp(15px, 2vw, 22px)/1.2 Georgia, serif;
  text-shadow: 0 2px 5px #05271e;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  #jadeStage .jade-game-filter button { transition: none; }
}