body[data-surface=home] .home-card-grid {
  gap: 12px;
  padding: 8px 6px 16px;
  scroll-padding-inline: 6px;
}
.world-tile {
  flex: 0 0 clamp(154px, 12vw, 178px);
  width: clamp(154px, 12vw, 178px);
  height: clamp(194px, 16vw, 224px);
  max-width: none;
  border-color: #ffffff35;
  border-radius: 5px;
  background: #101217;
  box-shadow: 0 8px 22px #0006, inset 0 0 0 1px #ffffff08;
  transition: border-color .24s ease, box-shadow .24s ease, transform .3s ease;
}
.world-tile::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(135deg, #ffffff1e, transparent 26% 70%, #ffffff0b);
  mix-blend-mode: screen;
}
.world-tile::after {
  z-index: 0;
  background: linear-gradient(180deg, #05070b80 0%, transparent 28%, transparent 48%, #05070ba6 72%, #05070bfa 100%);
}
.world-tile img {
  z-index: -1;
  filter: saturate(.93) contrast(1.04);
  object-position: center;
  transition: transform .6s cubic-bezier(.22,1,.36,1), filter .3s ease;
}
.world-tile:hover img,
.world-tile.is-selected img,
.world-tile:focus-visible img {
  filter: saturate(1.08) contrast(1.04);
  transform: scale(1.055);
}
.world-tile:hover,
.world-tile:focus-visible {
  border-color: #ffe1a6;
  box-shadow: 0 13px 30px #0009, 0 0 0 1px #ffd46d40;
  transform: translateY(-3px);
}
.world-tile.is-selected {
  border-color: #ffd56d;
  box-shadow: 0 13px 30px #0009, 0 0 0 1px #ffd56d6b, 0 0 20px #ffd56d20;
  transform: translateY(-3px);
}
.world-tile-status,
.world-tile-genre {
  position: absolute;
  z-index: 2;
  top: 10px;
  display: inline-flex;
  align-items: center;
  min-height: 19px;
  padding: 3px 6px;
  border-radius: 3px;
  font: 700 7px/1.1 Consolas, monospace;
  letter-spacing: 0;
  white-space: nowrap;
  text-shadow: none;
}
.world-tile-status {
  left: 9px;
}
.world-tile-status.is-live {
  color: #caffdf;
  background: #103825ee;
  border: 1px solid #7de9a58c;
  box-shadow: 0 0 13px #4ae58a29;
}
.world-tile-genre {
  right: 9px;
  max-width: calc(100% - 58px);
  overflow: hidden;
  text-overflow: ellipsis;
  color: #f7f0e4;
  background: #0b0d11dd;
  border: 1px solid #ffffff66;
}
.world-tile-title {
  z-index: 2;
  left: 11px;
  right: 9px;
  bottom: 27px;
  font: 850 16px/1.05 var(--display-font);
  letter-spacing: 0;
  text-shadow: 0 2px 10px #000, 0 1px 3px #000;
  overflow-wrap: break-word;
}
.world-tile-focus {
  z-index: 2;
  left: 11px;
  bottom: 9px;
  min-height: 13px;
  font: 700 6px/1 Consolas, monospace;
  letter-spacing: .7px;
  color: #ffe3a6;
  opacity: .8;
}
.world-tile:not(.is-selected) .world-tile-focus {
  opacity: 0;
}
@media (max-width: 760px) {
  .world-tile {
    flex-basis: 148px;
    width: 148px;
    height: 192px;
  }
  .world-tile-title { font-size: 14px; }
}
@media (max-height: 820px) and (min-width: 761px) {
  .world-tile {
    height: 184px;
    flex-basis: 148px;
    width: 148px;
  }
  .world-tile-title { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  .world-tile,
  .world-tile img { transition: none; }
}