.mv-entry { background: #183328; color: #f1f3f1; margin-left: auto; min-height: 44px; }
.mv-home-actions { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.mv-home-actions .mv-home-entry { margin: 0; background: #d5fa58; color: #14221b; }
.mv-help { color: #c1cec5; font-size: 13px; line-height: 1.5; }
.mv-help summary { cursor: pointer; width: fit-content; display: list-item; padding: 10px 0; }
.mv-help ol { margin: 0 0 12px; padding-left: 22px; max-width: 72ch; }
.mv-help li + li { margin-top: 6px; }
@media (max-width: 600px) {
  .gameday-heading:has(.mv-home-actions) { flex-direction: column; align-items: flex-start; gap: 16px; }
  .mv-home-actions { gap: 8px; }
}
.mv-dialog { box-sizing: border-box; width: calc(100vw - 32px); max-width: 1800px; height: calc(100dvh - 32px); max-height: none; padding: 20px; color: #f1f3f1; background: #14221b; border: 1px solid #40554a; border-radius: 12px; overflow: auto; }
.mv-dialog::backdrop { background: rgb(0 0 0 / 80%); }
.mv-workspace:fullscreen { box-sizing: border-box; width: 100%; height: 100%; padding: 20px; background: #14221b; color: #f1f3f1; overflow: auto; }
.mv-dialog button, .mv-dialog select, .mv-dialog summary { min-height: 44px; font: inherit; }
.mv-dialog button { padding: 8px 12px; border: 1px solid #40554a; border-radius: 6px; background: #24392d; color: #f1f3f1; cursor: pointer; white-space: nowrap; }
.mv-dialog button:hover { background: #334e3e; }
.mv-dialog button:active { background: #405f4c; }
.mv-dialog button:disabled, .mv-dialog select:disabled { opacity: .5; cursor: default; }
.mv-dialog :focus-visible { outline: 2px solid #d5fa58; outline-offset: 3px; }
.mv-header, .mv-actions, .mv-layout-controls, .mv-tile-head, .mv-controls, .mv-audio { display: flex; align-items: center; gap: 10px; }
.mv-header { justify-content: space-between; margin-bottom: 8px; }
.mv-header h2 { margin: 0; font-size: 26px; letter-spacing: -.025em; }
.mv-header p, .mv-footnote { color: #c1cec5; font-size: 13px; margin: 6px 0 0; }
.mv-close { color: #14221b !important; background: #d5fa58 !important; }
.mv-layout { margin: 0 0 8px; color: #c1cec5; font-size: 13px; }
.mv-layout summary { cursor: pointer; width: fit-content; padding-top: 10px; }
.mv-layout-controls { padding-bottom: 12px; flex-wrap: wrap; }
.mv-layout-controls label { display: flex; gap: 12px; align-items: center; }
.mv-dialog input[type=range] { accent-color: #d5fa58; height: 44px; cursor: pointer; padding: 0; border: 0; background: transparent; }
.mv-grid { --mv-left: 50%; --mv-top: 50%; position: relative; display: grid; grid-template-columns: minmax(0, calc(var(--mv-left) - 6px)) minmax(0, 1fr); grid-template-rows: minmax(0, calc(var(--mv-top) - 6px)) minmax(0, 1fr); height: calc(100dvh - 220px); min-height: 570px; gap: 12px; padding: 0; }
.mv-tile { min-width: 0; min-height: 0; background: #0a100d; border: 1px solid #40554a; border-radius: 8px; overflow: hidden; display: flex; flex-direction: column; }
.mv-tile.mv-audible { border-color: #d5fa58; }
.mv-tile-head { padding: 7px 10px; }
.mv-tile-head label { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0; font-size: 12px; white-space: nowrap; color: #c1cec5; }
.mv-dialog select { color-scheme: dark; background: #14221b; color: #f1f3f1; border: 1px solid #40554a; border-radius: 5px; padding: 7px; min-width: 0; max-width: 100%; text-overflow: ellipsis; }
.mv-tile-head select { flex: 1; width: 100%; font-weight: 600; font-size: 14px; }
.mv-screen { position: relative; flex: 1; min-height: 72px; background: #000; }
.mv-screen video { width: 100%; height: 100%; object-fit: contain; display: block; position: absolute; inset: 0; }
.mv-status { position: absolute; inset: 8px 12px auto; margin: 0; padding: 8px 10px; background: #14221b; color: #f1f3f1; font-size: 13px; pointer-events: none; }
.mv-controls { padding: 6px 8px; gap: 6px; flex-wrap: wrap; }
.mv-controls button, .mv-controls select { font-size: 12px; }
.mv-audio { gap: 6px; flex: 1 1 auto; }
.mv-audio input { width: 70px; min-width: 40px; }
.mv-controls > select { min-width: 140px; flex: 1; max-width: 190px; }
.mv-divider { position: absolute; z-index: 2; touch-action: none; border-radius: 5px; }
.mv-divider::after { content: ''; position: absolute; background: #6f8578; border-radius: 3px; }
.mv-divider-columns { left: calc(var(--mv-left) - 6px); top: 0; bottom: 0; width: 12px; cursor: col-resize; }
.mv-divider-columns::after { width: 3px; height: 30px; top: calc(50% - 15px); left: 4px; }
.mv-divider-rows { top: calc(var(--mv-top) - 6px); left: 0; right: 0; height: 12px; cursor: row-resize; }
.mv-divider-rows::after { height: 3px; width: 30px; left: calc(50% - 15px); top: 4px; }
.mv-divider:hover::after, .mv-divider:focus-visible::after { background: #d5fa58; }
.mv-footnote { margin-top: 12px; }
@media (max-width: 1000px) {
  .mv-dialog { width: 100vw; height: 100dvh; border-radius: 0; padding: 12px; }
  .mv-header { align-items: flex-start; gap: 8px; flex-wrap: wrap; }
  .mv-header h2 { font-size: 23px; }
  .mv-header p { max-width: 34ch; }
  .mv-grid { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; grid-auto-rows: 350px; height: auto; min-height: 0; padding: 0; }
  .mv-divider, .mv-layout { display: none; }
  .mv-tile-head label { gap: 5px; }
  .mv-controls > select { max-width: none; }
  .mv-audio { flex-basis: 100%; }
  .mv-audio input { flex: 1; }
}

.mv-preview-note { color: #d5fa58 !important; font-weight: 600; }
.mv-dialog { overscroll-behavior: contain; }
body:has(.mv-dialog[open]) { overflow: hidden; }

/* Fullscreen spends the entire viewport on the four videos. Chrome overlays,
   rather than shrinks, the picture and is shown only during interaction. */
.mv-exit-full { display: none; }
.mv-workspace:fullscreen { padding: 0; overflow: hidden; background: #000; }
.mv-workspace:fullscreen .mv-header,
.mv-workspace:fullscreen .mv-help,
.mv-workspace:fullscreen .mv-layout,
.mv-workspace:fullscreen .mv-footnote,
.mv-workspace:fullscreen .mv-tile-head { display: none; }
.mv-workspace:fullscreen .mv-grid {
  width: 100%; height: 100%; min-height: 0; gap: 0; padding: 0;
  grid-template-columns: minmax(0, var(--mv-left)) minmax(0, 1fr);
  grid-template-rows: minmax(0, var(--mv-top)) minmax(0, 1fr);
  grid-auto-rows: auto;
}
.mv-workspace:fullscreen .mv-tile { position: relative; border: 0; border-radius: 0; }
.mv-workspace:fullscreen .mv-screen { min-height: 0; }
.mv-workspace:fullscreen .mv-controls {
  position: absolute; z-index: 3; left: 0; right: 0; bottom: 0;
  background: rgb(10 16 13 / 94%); visibility: hidden; opacity: 0;
}
.mv-workspace:fullscreen .mv-exit-full {
  display: block; position: absolute; z-index: 5; top: 12px; right: 12px;
  visibility: hidden; opacity: 0;
}
.mv-workspace:fullscreen .mv-divider { display: block; visibility: hidden; }
.mv-workspace:fullscreen .mv-divider-columns { left: calc(var(--mv-left) - 6px); }
.mv-workspace:fullscreen .mv-divider-rows { top: calc(var(--mv-top) - 6px); }
.mv-workspace:fullscreen .mv-status { visibility: hidden; }
.mv-workspace:fullscreen:not(.mv-show-controls) { cursor: none; }
.mv-workspace:fullscreen.mv-show-controls .mv-controls,
.mv-workspace:fullscreen.mv-show-controls .mv-exit-full,
.mv-workspace:fullscreen.mv-show-controls .mv-divider,
.mv-workspace:fullscreen.mv-show-controls .mv-status { visibility: visible; opacity: 1; }
@media (max-width: 600px) {
  .mv-workspace:fullscreen .mv-controls { max-height: 100%; overflow-y: auto; }
  .mv-workspace:fullscreen .mv-audio { flex-wrap: wrap; }
}