/* Existing standby URL, with an optional media layout. */
#standby-media[hidden], #media-enable-audio[hidden] { display: none; }
#standby-media { position: absolute; left: 192px; top: 112px; width: 1536px; height: 906px; background: #020912; border: 2px solid #7578ff; border-radius: 10px; overflow: hidden; z-index: 5; }
.media-heading { height: 42px; display: flex; align-items: center; justify-content: space-between; padding: 0 18px; color: #b5a0ff; font: 18px sans-serif; }
#media-title { max-width: 80%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
#media-surface { position: absolute; inset: 42px 0 0; }
#media-surface > img, #media-surface > video, #media-surface > iframe { width: 100%; height: 100%; object-fit: contain; border: 0; }
#media-message { position: absolute; inset: 45% 20px auto; text-align: center; color: white; font: 25px sans-serif; background: #020912dd; }
#media-message:empty { display: none; }
#media-enable-audio { position: absolute; bottom: 16px; right: 16px; padding: 12px 24px; background: #242955; color: white; border: 1px solid #b5a0ff; border-radius: 6px; cursor: pointer; font: 20px sans-serif; }
body.media-window.screen-standby #entries { left: 1400px; top: 468px; width: 480px; height: 400px; padding: 20px; border: 1px solid var(--line); }
body.media-window.screen-standby #entry-cards { height: 310px; grid-template-columns: 1fr; gap: 10px; }
body.media-fullscreen #standby-media { inset: 0; width: 1920px; height: 1080px; border: 0; border-radius: 0; z-index: 20; }
body.media-fullscreen .media-heading { display: none; }
body.media-fullscreen #media-surface { inset: 0; }

html, body { width: 100%; height: 100%; background: #020912; }
#stage { transform-origin: top left; }

/* Two separate screens share one URL; the original match standby keeps its layout. */
#long-standby[hidden] { display: none; }
#long-standby { position: absolute; inset: 0; background: #020912; }
.long-standby-header { position: absolute; inset: 0 0 auto; height: 84px; display: flex; align-items: center; gap: 28px; padding: 12px 40px; border-bottom: 2px solid #7578ff; font-size: 28px; }
.long-standby-header img { width: 150px; height: 60px; object-fit: contain; }
.long-standby-header b { margin-left: auto; font-size: 20px; color: #b5a0ff; letter-spacing: .15em; }
.long-standby-footer { position: absolute; bottom: 18px; width: 100%; text-align: center; font-size: 20px; color: #b5a0ff; }
body:is(.media-window, .media-fullscreen) :is(#header, #main, #entries, #tips, #sponsors) { display: none; }
body.media-fullscreen :is(.long-standby-header, .long-standby-footer) { display: none; }
