/* Keep the existing four half-width tiles; split the first row 2:1. */
.portal-grid-kyr { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.portal-grid-kyr > .portal-tile { grid-column: span 3; }
.portal-grid-kyr > .portal-tile-wide { grid-column: span 4; grid-template-columns: minmax(0, 55%) minmax(0, 1fr); }
.portal-grid-kyr > .portal-tile-kyr { grid-column: span 2; grid-template-columns: minmax(0, 1fr); gap: .5rem; }
.portal-tile-kyr .sprite-shell { min-height: 11.5rem; }
.portal-tile-kyr .sprite-image { max-width: 100%; max-height: 11.5rem; object-fit: contain; }
body[data-theme="candy-rot"] .portal-tile-kyr { --channel-container-image: url("../img/containers/candy-rot/container-01-cutout.png"); --channel-pip: #f6e68f; background-size: 100% 100%; }
body[data-theme="candy-rot"] .portal-tile-kyr:hover, body[data-theme="candy-rot"] .portal-tile-kyr:focus-visible { background-size: 100% 100%; }
body[data-theme="candy-rot"] .portal-tile-kyr .sprite-image { inset: 0; margin: auto; object-position: center; }
/* Match the source monochrome artwork on the light dead-signal tile. */
body[data-theme="dead-signal"] .portal-tile-kyr .sprite-dead { filter: none; }
@media (max-width: 760px) {
  .portal-grid-kyr { grid-template-columns: 1fr; }
  .portal-grid-kyr > .portal-tile, .portal-grid-kyr > .portal-tile-wide, .portal-grid-kyr > .portal-tile-kyr { grid-column: auto; grid-template-columns: 1fr; }
}



/* Artwork-led homepage tiles. */
.portal-grid-kyr > .portal-tile-wide,
.portal-grid-kyr > .portal-tile-kyr {
  height: 21rem;
  min-height: 0;
  grid-template-columns: minmax(0, 1fr);
  display: block;
  padding: 1rem;
}
.portal-grid-kyr > .portal-tile-wide .tile-copy,
.portal-grid-kyr > .portal-tile-kyr .tile-copy {
  position: absolute;
  top: 1.1rem;
  left: 1.2rem;
  right: 1.2rem;
  padding: 0;
}
.portal-grid-kyr > .portal-tile-wide .tile-copy p,
.portal-grid-kyr > .portal-tile-kyr .tile-copy p { display: none; }
.portal-grid-kyr > .portal-tile-wide .sprite-shell,
.portal-grid-kyr > .portal-tile-kyr .sprite-shell {
  position: absolute;
  inset: 4.2rem .7rem .45rem;
  min-height: 0;
  overflow: visible;
}
.portal-grid-kyr > .portal-tile-wide .sprite-shell::before,
.portal-grid-kyr > .portal-tile-wide .sprite-shell::after,
.portal-grid-kyr > .portal-tile-kyr .sprite-shell::before,
.portal-grid-kyr > .portal-tile-kyr .sprite-shell::after { display: none !important; }
body[data-theme] .portal-grid-kyr > .portal-tile-wide .sprite-image,
body[data-theme] .portal-grid-kyr > .portal-tile-kyr .sprite-image {
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  margin: auto;
  object-fit: contain;
  object-position: center;
}
body[data-theme] .portal-grid-kyr > .portal-tile-wide .sprite-image { width: calc(100% + 5px); height: calc(100% + 5px); }
@media(max-width:760px){
  .portal-grid-kyr > .portal-tile-wide {height:21rem;}
  .portal-grid-kyr > .portal-tile-kyr {height:24rem;}
}

/* The approved artwork sizes remain; descriptions sit over the artwork. */
.portal-grid-kyr > .portal-tile:not(.portal-tile-wide):not(.portal-tile-kyr) {
  height: 21rem;
  min-height: 0;
  display: block;
}
.portal-grid-kyr > .portal-tile:not(.portal-tile-wide):not(.portal-tile-kyr) .tile-copy {
  position: absolute;
  top: 1.1rem;
  left: 1.2rem;
  right: 1.2rem;
  padding: 0;
}
.portal-grid-kyr > .portal-tile:not(.portal-tile-wide):not(.portal-tile-kyr) .sprite-shell {
  position: absolute;
  inset: 4.2rem .7rem .45rem;
  min-height: 0;
}
body[data-theme] .portal-grid-kyr > .portal-tile:not(.portal-tile-wide):not(.portal-tile-kyr) .sprite-image {
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: 17rem;
  max-height: 15rem;
  margin: auto;
  object-fit: contain;
  object-position: center;
}
.portal-grid-kyr > .portal-tile .sprite-shell::after { display: none !important; }
.portal-grid-kyr > .portal-tile .tile-description {
  position: absolute;
  z-index: 3;
  inset: 4.2rem 1.25rem .7rem;
  margin: 0;
  padding: .9rem 1rem;
  background: transparent;
  color: #111;
  border: 0;
  border-radius: 0;
  font-size: .82rem;
  line-height: 1.5;
  letter-spacing: 0;
  backdrop-filter: none;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-weight: 600;
  text-shadow: 0 0 4px #fff, 0 0 10px #fff;
  opacity: 0;
  transform: translateY(.45rem);
  transition: opacity 180ms ease, transform 180ms ease;
  pointer-events: none;
}
body[data-theme="candy-rot"] .portal-grid-kyr > .portal-tile .tile-description {
  background: transparent;
  color: #f4e5cf;
  border: 0;
  text-shadow: 0 0 4px #14101d, 0 0 10px #14101d;
}
.portal-grid-kyr > .portal-tile:focus-visible .tile-description { opacity: 1; transform: translateY(0); }
@media (hover:hover) {
  .portal-grid-kyr > .portal-tile:hover .tile-description { opacity: 1; transform: translateY(0); }
}
@media (hover:none) {
  .portal-grid-kyr > .portal-tile .tile-description { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion:reduce) {
  .portal-grid-kyr > .portal-tile .tile-description { transition: none; transform: none; }
}

/* Centered titles form a consistent header above each illustration. */
.portal-grid-kyr > .portal-tile .tile-copy {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: .3rem;
}
.portal-grid-kyr > .portal-tile .tile-copy h2 {
  order: 0;
  margin: 0;
  font-size: 1.3rem;
  line-height: 1.2;
  letter-spacing: .16em;
}
.portal-grid-kyr > .portal-tile .tile-channel {order:1; font-size:.57rem; letter-spacing:.18em; opacity:.7;}
.portal-grid-kyr > .portal-tile[data-section="kyr"] .tile-copy h2 {font-size:1.05rem; letter-spacing:.025em; white-space:nowrap;}
.portal-grid-kyr > .portal-tile .sprite-shell {transition:opacity 180ms ease;}
.portal-grid-kyr > .portal-tile:focus-visible .sprite-shell {opacity:.3;}
@media(hover:hover){.portal-grid-kyr > .portal-tile:hover .sprite-shell {opacity:.3;}}
@media(hover:none){.portal-grid-kyr > .portal-tile .sprite-shell {opacity:.3;}}
@media(prefers-reduced-motion:reduce){.portal-grid-kyr > .portal-tile .sprite-shell {transition:none;}}
