/* Keep the complete game board inside a desktop or projector viewport. */
@media (min-width: 761px) {
  html,
  body {
    height: 100%;
    overflow: hidden;
  }

  .game-shell {
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    gap: clamp(7px, 1.2vh, 14px);
    height: 100dvh;
    min-height: 0;
    padding: clamp(8px, 1.6vh, 18px) clamp(12px, 3vw, 46px);
  }

  .topbar,
  .scoreboard {
    margin-bottom: 0;
  }

  .team {
    min-height: clamp(54px, 7.5vh, 78px);
    padding-block: 8px;
  }

  .board,
  .column {
    min-height: 0;
  }

  .column {
    grid-template-rows: minmax(42px, 0.85fr) repeat(5, minmax(38px, 1fr));
    gap: clamp(5px, 0.8vh, 10px);
  }

  .value-card {
    min-height: 0;
    font-size: clamp(1.35rem, 4vh, 2.7rem);
  }
}

.task-media {
  position: relative;
}

.task-media.loading::after {
  content: "Loading…";
  position: absolute;
  color: #405074;
  font-size: 1.1rem;
  font-weight: 900;
}

.task-media img {
  position: relative;
  z-index: 1;
  transition: opacity 0.12s ease;
}

.task-media.loading img {
  opacity: 0;
}
