/* Center-cropped thumbnail tiles; full frames in upload and replay players. */
.row-thumb, .has-preview .row-thumb { height: 64px; background: #080e20; }
.row-thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
.preview-summary img { aspect-ratio: 16 / 9; height: auto; max-height: 260px; object-fit: cover; object-position: 50% 50%; background: #080e20; }
.active-job > img, .completion-strip img { object-fit: cover; object-position: 50% 50%; background: #080e20; }

.upload-player video {
    width: 100%; height: auto; aspect-ratio: var(--media-ratio, 16 / 9);
    max-height: min(680px, 70svh); object-fit: contain; background: #040812;
}
.variant-3 .upload-player video { max-height: min(680px, 70svh); }

.replay-workbench { align-items: stretch; }
.replay-workbench[data-orientation="portrait"] { grid-template-columns: minmax(0, .85fr) minmax(0, 1fr) minmax(180px, .65fr); }
.replay-workbench[data-orientation="square"] { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) minmax(180px, .65fr); }
.inspector-media { align-self: start; }
.inspector-media video, .inspector-media img {
    width: 100%; height: auto; aspect-ratio: var(--media-ratio, 16 / 9);
    max-height: min(720px, 72svh); object-fit: contain;
}
.replay-workbench:has(.desk-cube-panel[hidden]) { grid-template-columns: minmax(0, 1fr) minmax(180px, .3fr); }
.inspector-media video:fullscreen { width: 100%; height: 100%; max-height: none; aspect-ratio: auto; background: #000; }

@media (max-width: 1050px) {
    .replay-workbench[data-orientation="portrait"], .replay-workbench[data-orientation="square"] { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .replay-workbench:has(.desk-cube-panel[hidden]) { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
    .row-thumb, .has-preview .row-thumb { height: 52px; }
    .preview-summary img { max-height: 220px; }
    .replay-workbench, .replay-workbench[data-orientation] { grid-template-columns: minmax(0, 1fr); }
    .inspector-media { width: 100%; }
    .inspector-media video, .inspector-media img { height: auto; max-height: 68svh; }
    .replay-workbench .desk-cube-panel { min-height: 240px; }
    .replay-workbench #desk-cube { width: min(75%, 280px); margin-top: 20px; }
    .replay-numbers { grid-column: 1; }
}