/*
 * Tronsoft Games v19.5.0
 * Canonical tile system for all public Game and TIFE portal title cards.
 */

:root{
  --tg-card-min:220px;
  --tg-card-gap:clamp(.75rem,1.25vw,1.1rem);
  --tg-card-radius:13px;
  --tg-cover-ratio:3 / 4;
}

/* All title-card grids */
.unified-icon-grid,
.portal-game-grid,
.portal-continue-grid,
.community-game-grid,
.tife-adventure-grid,
.ph-game-grid,
.tife-history-grid,
.creation-wishlist-grid{
  display:grid !important;
  grid-template-columns:repeat(
    auto-fill,
    minmax(min(100%,var(--tg-card-min)),1fr)
  ) !important;
  align-items:stretch !important;
  gap:var(--tg-card-gap) !important;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  box-sizing:border-box !important;
}

/* All title-card shells */
.unified-game-tile,
.portal-featured-game,
.portal-continue-game,
.community-game-card,
.library-image-card,
.tife-library-card,
.ph-game-tile,
.tife-history-tile,
.creation-wishlist-card{
  position:relative !important;
  display:flex !important;
  flex-direction:column !important;
  min-width:0 !important;
  height:100% !important;
  overflow:hidden !important;
  margin:0 !important;
  padding:0 !important;
  border:1px solid rgba(148,163,184,.22) !important;
  border-radius:var(--tg-card-radius) !important;
  background:
    linear-gradient(
      180deg,
      rgba(15,29,42,.98),
      rgba(7,18,28,.98)
    ) !important;
  box-shadow:0 9px 25px rgba(0,0,0,.23) !important;
  transform:none !important;
  box-sizing:border-box !important;
}

.unified-game-tile:hover,
.portal-featured-game:hover,
.portal-continue-game:hover,
.community-game-card:hover,
.library-image-card:hover,
.tife-library-card:hover,
.ph-game-tile:hover,
.tife-history-tile:hover,
.creation-wishlist-card:hover{
  transform:translateY(-2px) !important;
  border-color:rgba(74,174,255,.55) !important;
  box-shadow:
    0 14px 36px rgba(0,0,0,.32),
    0 0 0 1px rgba(74,174,255,.08) !important;
}

/* Remove old overlays that covered artwork. */
.unified-game-tile::before,
.unified-game-tile::after,
.portal-featured-game::before,
.portal-featured-game::after,
.portal-continue-game::before,
.portal-continue-game::after,
.community-game-card::before,
.community-game-card::after,
.library-image-card::before,
.library-image-card::after,
.tife-library-card::before,
.tife-library-card::after,
.ph-game-tile::before,
.ph-game-tile::after,
.tife-history-tile::before,
.tife-history-tile::after{
  pointer-events:none !important;
}

.unified-game-icon::after,
.portal-game-cover::after,
.portal-continue-cover::after,
.library-card-cover::after,
.ph-game-cover::after,
.tife-history-cover::after{
  display:none !important;
  content:none !important;
}

/* Canonical artwork regions */
.unified-game-icon,
.portal-game-cover,
.portal-continue-cover,
.library-card-cover,
.ph-game-cover,
.tife-history-cover{
  position:relative !important;
  display:block !important;
  flex:0 0 auto !important;
  width:100% !important;
  aspect-ratio:var(--tg-cover-ratio) !important;
  min-height:0 !important;
  max-height:320px !important;
  overflow:hidden !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:
    radial-gradient(
      circle at 50% 38%,
      rgba(45,102,143,.30),
      rgba(4,14,22,.98) 68%
    ) !important;
  box-shadow:none !important;
  text-decoration:none !important;
}

.unified-game-icon img,
.portal-game-cover img,
.portal-continue-cover img,
.library-card-cover img,
.ph-game-cover img,
.tife-history-cover img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  object-fit:cover !important;
  object-position:center !important;
  background:transparent !important;
  filter:none !important;
  transform:none !important;
}

.portal-game-cover img.portal-game-cover-fallback,
.ph-game-cover img.is-fallback,
.tife-history-cover img.is-fallback{
  object-fit:contain !important;
  padding:1.25rem !important;
  box-sizing:border-box !important;
  background:
    radial-gradient(
      circle at center,
      rgba(41,99,139,.34),
      rgba(4,14,22,.98) 72%
    ) !important;
}

.unified-icon-fallback,
.library-cover-fallback{
  display:grid !important;
  place-items:center !important;
  width:100% !important;
  height:100% !important;
  color:#dff3ff !important;
  font-size:clamp(2rem,5vw,3.5rem) !important;
  font-weight:900 !important;
  letter-spacing:.05em !important;
  background:
    linear-gradient(
      145deg,
      rgba(38,103,146,.44),
      rgba(7,22,34,.97)
    ) !important;
}

/* Never place a large black oval over artwork. */
.portal-game-cover > span{
  position:absolute !important;
  right:.5rem !important;
  bottom:.5rem !important;
  left:.5rem !important;
  width:auto !important;
  margin:0 !important;
  padding:.32rem .45rem !important;
  color:#cbd9e3 !important;
  font-size:.63rem !important;
  line-height:1.2 !important;
  text-align:center !important;
  border:1px solid rgba(148,163,184,.16) !important;
  border-radius:6px !important;
  background:rgba(1,8,13,.82) !important;
}

/* Card bodies */
.unified-game-meta,
.portal-featured-game-body,
.portal-continue-game-body,
.library-card-content,
.ph-game-meta,
.tife-history-meta{
  display:flex !important;
  flex:1 1 auto !important;
  flex-direction:column !important;
  min-width:0 !important;
  width:100% !important;
  padding:.85rem !important;
  box-sizing:border-box !important;
}

/* Titles */
.unified-game-meta h2,
.portal-featured-game-body h3,
.portal-continue-game-body h3,
.library-card-content h3,
.library-card-content > a > strong,
.ph-game-meta h2,
.tife-history-meta h2,
.creation-wishlist-card h2{
  display:-webkit-box !important;
  overflow:hidden !important;
  margin:0 0 .38rem !important;
  color:#f2f7fb !important;
  font-size:clamp(.94rem,1.15vw,1.1rem) !important;
  font-weight:820 !important;
  line-height:1.24 !important;
  text-wrap:balance !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:2 !important;
}

.unified-game-meta h2 a,
.portal-featured-game-body h3 a,
.portal-continue-game-body h3 a,
.library-card-content h3 a,
.library-card-content > a,
.ph-game-meta h2 a,
.tife-history-meta h2 a{
  color:inherit !important;
  text-decoration:none !important;
}

/* Descriptions and metadata */
.unified-game-meta > p,
.portal-featured-game-body > p,
.portal-continue-game-body > p,
.library-card-content > p,
.ph-game-meta > p,
.tife-history-meta > p,
.creation-wishlist-notes{
  display:-webkit-box !important;
  overflow:hidden !important;
  margin:.1rem 0 .68rem !important;
  color:#aebbc7 !important;
  font-size:.74rem !important;
  line-height:1.42 !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:3 !important;
}

/* Badges */
.unified-engine-badge,
.ph-engine-badge,
.ph-continue-badge,
.tife-history-engine,
.tife-history-continue{
  z-index:3 !important;
  display:inline-flex !important;
  align-items:center !important;
  min-height:23px !important;
  padding:.23rem .42rem !important;
  color:#fff !important;
  font-size:.58rem !important;
  font-weight:850 !important;
  letter-spacing:.045em !important;
  line-height:1 !important;
  text-transform:uppercase !important;
  border:1px solid rgba(255,255,255,.17) !important;
  border-radius:999px !important;
  box-shadow:0 3px 10px rgba(0,0,0,.28) !important;
}

/* Metrics */
.unified-game-metrics,
.ph-game-metrics,
.tife-history-metrics{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:.4rem !important;
  margin:auto 0 .65rem !important;
}

.unified-game-metric,
.ph-game-metric,
.tife-history-metric{
  display:flex !important;
  flex-direction:column !important;
  min-width:0 !important;
  padding:.42rem !important;
  border:1px solid rgba(148,163,184,.12) !important;
  border-radius:7px !important;
  background:rgba(255,255,255,.025) !important;
}

/* Actions stay at bottom */
.unified-tile-actions,
.card-actions,
.ph-tile-actions,
.tife-history-actions,
.tife-library-actions{
  display:flex !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:.4rem !important;
  width:100% !important;
  margin-top:auto !important;
  padding-top:.2rem !important;
}

.unified-tile-actions form,
.card-actions form,
.ph-tile-actions form,
.tife-history-actions form,
.tife-library-actions form{
  display:inline-flex !important;
  min-width:0 !important;
  margin:0 !important;
}

.unified-tile-actions > a,
.tile-favorite-button,
.tile-favorite-signin,
.card-actions .btn,
.ph-tile-actions .btn,
.tife-history-actions .btn,
.tife-library-actions .btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:33px !important;
  padding:.38rem .58rem !important;
  color:#dce9f2 !important;
  font-size:.66rem !important;
  font-weight:760 !important;
  line-height:1.1 !important;
  text-decoration:none !important;
  border:1px solid rgba(148,163,184,.22) !important;
  border-radius:7px !important;
  background:rgba(255,255,255,.035) !important;
  box-sizing:border-box !important;
}

/* Public creation Wishlist cards */
.creation-wishlist-card{
  padding:1rem !important;
}

.creation-wishlist-card-head{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:.5rem !important;
  margin-bottom:.5rem !important;
}

.creation-wishlist-card dl{
  margin-top:auto !important;
}

/* Responsive behavior */
@media(max-width:900px){
  :root{
    --tg-card-min:190px;
  }

  .unified-icon-grid,
  .portal-game-grid,
  .portal-continue-grid,
  .community-game-grid,
  .tife-adventure-grid,
  .ph-game-grid,
  .tife-history-grid{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}

@media(max-width:680px){
  .unified-icon-grid,
  .portal-game-grid,
  .portal-continue-grid,
  .community-game-grid,
  .tife-adventure-grid,
  .ph-game-grid,
  .tife-history-grid,
  .creation-wishlist-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  .unified-game-meta,
  .portal-featured-game-body,
  .portal-continue-game-body,
  .library-card-content,
  .ph-game-meta,
  .tife-history-meta{
    padding:.7rem !important;
  }

  .unified-game-metrics,
  .ph-game-metrics,
  .tife-history-metrics{
    grid-template-columns:1fr !important;
  }
}

@media(max-width:430px){
  .unified-icon-grid,
  .portal-game-grid,
  .portal-continue-grid,
  .community-game-grid,
  .tife-adventure-grid,
  .ph-game-grid,
  .tife-history-grid,
  .creation-wishlist-grid{
    grid-template-columns:1fr !important;
  }

  .unified-game-icon,
  .portal-game-cover,
  .portal-continue-cover,
  .library-card-cover,
  .ph-game-cover,
  .tife-history-cover{
    aspect-ratio:16 / 10 !important;
    max-height:260px !important;
  }
}
