.tongvh-steam-six-wrap {
  width: 100%;
  margin: 0 auto;
}

.tongvh-steam-six-shell {
  max-width: var(--tongvh-max-width, 1200px);
  margin: 0 auto;
  padding: 22px 24px 28px;
  background: linear-gradient(180deg, #142033 0%, #101b2b 55%, #0e1827 100%);
  box-shadow:
    inset 0 12px 26px rgba(255,255,255,.035),
    inset 0 -14px 30px rgba(0,0,0,.42),
    0 1px 0 rgba(255,255,255,.03);
  position: relative;
  overflow: visible;
}

.tongvh-steam-six-heading {
  margin-bottom: 18px;
  line-height: 1.35;
  font-size: 18px;
  color: #b8c6d1;
}

.tongvh-heading-title {
  color: #66c0f4;
  font-weight: 700;
  margin-right: 3px;
}

.tongvh-heading-desc { color: #c7d5e0; }

.tongvh-steam-six-grid { display: grid; gap: 16px; }
.tongvh-row-large { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 28px; }
.tongvh-row-small { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.tongvh-game-card {
  display: block;
  position: relative;
  text-decoration: none;
  color: inherit;
  overflow: visible;
}

.tongvh-game-media {
  width: 100%;
  border: 1px solid rgba(84, 133, 183, 0.18);
  background: #1b2838;
  overflow: hidden;
}

.tongvh-size-large .tongvh-game-media { aspect-ratio: 2.35 / 1; }
.tongvh-size-small .tongvh-game-media { aspect-ratio: 2.05 / 1; }

.tongvh-game-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .25s ease;
}

.tongvh-game-card:hover .tongvh-game-media img { transform: scale(1.02); }

.tongvh-game-placeholder {
  width: 100%;
  height: 100%;
  min-height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #7e8b97;
  background: linear-gradient(180deg, #213548 0%, #152332 100%);
}

.tongvh-game-meta { padding-top: 6px; }
.tongvh-game-title { color: #ffffff; font-size: 15px; line-height: 1.3; }
.tongvh-size-large .tongvh-game-title { font-size: 20px; }
.tongvh-size-large .tongvh-game-price { font-size: 18px; }
.tongvh-game-price { color: #acdbf5; font-size: 14px; line-height: 1.2; }

.tongvh-game-popup {
  position: absolute;
  top: -6px;
  left: calc(100% + 12px);
  width: 320px;
  background: linear-gradient(180deg, #c9d5df 0%, #b5c2cd 100%);
  color: #1c252d;
  box-shadow: 0 12px 35px rgba(0,0,0,.45);
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity .18s ease, transform .18s ease, visibility 0s linear .24s;
  pointer-events: none;
  z-index: 30;
}

.tongvh-game-card.is-hovered .tongvh-game-popup,
.tongvh-game-card:hover .tongvh-game-popup,
.tongvh-game-card:focus-within .tongvh-game-popup {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition-delay: 0s;
}

.tongvh-popup-left .tongvh-game-popup { left: auto; right: calc(100% + 12px); }
.tongvh-popup-inner { padding: 14px; }
.tongvh-popup-title { font-size: 28px; line-height: 1.15; color: #263645; margin-bottom: 6px; }
.tongvh-popup-date { font-size: 13px; color: #4c5b66; margin-bottom: 10px; }
.tongvh-popup-video-wrap { width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: #000; margin-bottom: 12px; }
.tongvh-popup-video { display: block; width: 100%; height: 100%; object-fit: cover; }
.tongvh-popup-desc { font-size: 13px; line-height: 1.45; color: #2d3d49; }
.tongvh-popup-desc p { margin: 0 0 8px; }
.tongvh-popup-desc p:last-child { margin-bottom: 0; }

.tongvh-steam-six-empty {
  padding: 16px 18px;
  background: #152335;
  color: #c7d5e0;
  border-left: 4px solid #66c0f4;
}

@media (max-width: 1024px) {
  .tongvh-row-small { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
  .tongvh-steam-six-shell { padding: 18px; }
  .tongvh-row-large, .tongvh-row-small {
    grid-template-columns: 1fr;
    gap: 14px;
    margin-bottom: 18px;
  }
  .tongvh-game-popup { display: none; }
  .tongvh-size-large .tongvh-game-title, .tongvh-game-title { font-size: 16px; }
}