.screen {
  position: absolute; inset: 0; padding: 2.5cqw 4cqw; display: flex; flex-direction: column; align-items: flex-start;
  gap: 1.6cqw; overflow: auto; background: rgb(11 11 26 / 0.88);
}
.screen-title {
  margin: 0; font: 400 4.5cqw/1 var(--font-title); letter-spacing: 0.04em; color: var(--yellow);
  text-shadow: 0.3cqw 0.3cqw 0 var(--red-deep), 0.6cqw 0.6cqw 0 var(--blue);
}
.screen-buttons { display: flex; gap: 2cqw; flex-wrap: wrap; }
.screen-button {
  padding: 0.3cqw 2cqw; font-size: 3cqw; line-height: 1.1; letter-spacing: 0.05em;
  background: rgb(11 11 26 / 0.85); color: var(--paper); border: 0.3cqw solid var(--blue); border-radius: 0.6cqw;
}
.screen button[aria-current='true'], .screen button:focus-visible {
  background: var(--yellow); color: var(--ink); border-color: var(--paper); box-shadow: var(--glow);
}
.screen button:focus-visible { outline: 0.3cqw solid var(--red-deep); outline-offset: 0.2cqw; }

.setup-list, .scene-grid { list-style: none; margin: 0; padding: 0; display: grid; }
.setup-list { gap: 0.8cqw; width: min(100%, 62cqw); }
.setup-row {
  width: 100%; display: flex; justify-content: space-between; gap: 2cqw; padding: 0.3cqw 1.6cqw; text-align: left;
  font-size: 3cqw; line-height: 1.1; letter-spacing: 0.05em;
  background: rgb(11 11 26 / 0.85); color: var(--paper); border: 0.3cqw solid var(--blue); border-radius: 0.6cqw;
}

.scene-grid { grid-template-columns: repeat(2, 22cqw); gap: 1.4cqw 2cqw; }
.scene-tile {
  width: 100%; padding: 0.4cqw; display: flex; flex-direction: column; gap: 0.4cqw; text-align: left;
  background: rgb(11 11 26 / 0.85); color: var(--paper); border: 0.3cqw solid var(--blue); border-radius: 0.6cqw;
}
.scene-tile img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; background: #000; }
.scene-caption { font-size: 1.9cqw; line-height: 1.05; letter-spacing: 0.04em; }

.scene-video { width: min(100%, 60cqw); aspect-ratio: 16 / 9; background: #000; border: 0.3cqw solid var(--paper); }
.scene-video:focus-visible { outline: 0.4cqw solid var(--yellow); }

.unavailable-message {
  margin: 0; max-width: 56cqw; padding: 1.6cqw 2.4cqw; font-size: 4cqw; line-height: 1.15; color: var(--yellow);
  background: #000; border: 0.3cqw solid var(--yellow);
}

@media (orientation: portrait) and (max-width: 600px) {
  .screen { padding: 2.5cqw 3cqw; gap: 1.2cqw; }
  .screen-title { font-size: 6.5cqw; }
  .screen-button, .setup-row { font-size: 3.9cqw; padding-block: 0.1cqw; }
  .setup-list { width: 100%; gap: 0.6cqw; }
  .scene-grid { grid-template-columns: repeat(2, 1fr); width: 100%; gap: 1.2cqw 2cqw; }
  .scene-tile { padding: 0.3cqw; gap: 0.2cqw; }
  .scene-caption { font-size: 3cqw; }
  .scene-video { width: 100%; }
  .unavailable-message { max-width: none; font-size: 5.4cqw; }
}