/* GriGsi VMCR — split part 7/10 — shell-top/bus prev-prog, mobile landscape mix FS, framing guides, shot-size figure. Part of website/css/vmcr.css, cut in original order (2026-09-23); load all 10 vmcr-*.css files together in order, never reorder. */
/*
 * Mix FS is dark chrome. Beat body.ios-theme.vmcr-page ink/muted !important
 * so labels, meta, and inputs stay readable on #0c121c / #000.
 */
body.ios-theme.vmcr-page.vmcr-mix-fs,
body.ios-theme.vmcr-page.vmcr-mix-fs .vmcr-wrap,
body.ios-theme.vmcr-page.vmcr-mix-fs .vmcr-wrap :is(h1, h2, h3, h4, p, li, label, strong, small, td, th) {
  color: #e2e8f0 !important;
}

body.ios-theme.vmcr-page.vmcr-mix-fs .vmcr-wrap a:not(.vmcr-btn):not(.btn-nav) {
  color: #93c5fd !important;
  -webkit-text-fill-color: #93c5fd !important;
}

body.ios-theme.vmcr-page.vmcr-mix-fs .vmcr-lead,
body.ios-theme.vmcr-page.vmcr-mix-fs .vmcr-meta-line,
body.ios-theme.vmcr-page.vmcr-mix-fs .vmcr-note,
body.ios-theme.vmcr-page.vmcr-mix-fs .vmcr-pip-hint,
body.ios-theme.vmcr-page.vmcr-mix-fs .vmcr-field label,
body.ios-theme.vmcr-page.vmcr-mix-fs .vmcr-preview span,
body.ios-theme.vmcr-page.vmcr-mix-fs .vmcr-status:not(.is-error):not(.is-ok),
body.ios-theme.vmcr-page.vmcr-mix-fs .vmcr-monitor__src,
body.ios-theme.vmcr-page.vmcr-mix-fs .vmcr-panel-head__hint {
  color: #94a3b8 !important;
}

body.ios-theme.vmcr-page.vmcr-mix-fs .vmcr-monitor__tag,
body.ios-theme.vmcr-page.vmcr-mix-fs .vmcr-panel-head h2,
body.ios-theme.vmcr-page.vmcr-mix-fs .vmcr-ov-plates__title,
body.ios-theme.vmcr-page.vmcr-mix-fs .vmcr-media-item__name,
body.ios-theme.vmcr-page.vmcr-mix-fs .vmcr-plate-item__name,
body.ios-theme.vmcr-page.vmcr-mix-fs .vmcr-strip-btn,
body.ios-theme.vmcr-page.vmcr-mix-fs .vmcr-chip {
  color: #e2e8f0 !important;
}

body.ios-theme.vmcr-page.vmcr-mix-fs :is(input, select, textarea):not([type="checkbox"]):not([type="radio"]):not([type="range"]) {
  background: rgba(15, 23, 42, 0.85) !important;
  color: #e2e8f0 !important;
  -webkit-text-fill-color: #e2e8f0 !important;
  border: 1px solid rgba(148, 163, 184, 0.4) !important;
}

body.ios-theme.vmcr-page.vmcr-mix-fs :is(input, textarea)::placeholder {
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
}

body.vmcr-dir-page.vmcr-mix-fs .grigsi-top-bar,
body.vmcr-dir-page.vmcr-mix-fs .grigsi-top-bar-spacer,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-dir-bar,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-desk-row,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-tools,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-hotkeys {
  display: none !important;
}

/* shell-top stays as a tiny Start/Stop Show chip (see .vmcr-shell-top rules above) */

body.vmcr-dir-page.vmcr-mix-fs .vmcr-wrap--director {
  position: fixed;
  inset: 0;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  padding-left: env(safe-area-inset-left, 0px);
  padding-right: env(safe-area-inset-right, 0px);
  height: 100%;
  height: 100dvh;
  max-height: 100dvh;
  display: flex;
  flex-direction: column;
  gap: 0;
  box-sizing: border-box;
  overflow: hidden;
  background: #000;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-monitors {
  flex: 1 1 auto;
  min-height: 0;
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 2px;
  margin: 0;
  padding: 0;
  padding-top: env(safe-area-inset-top, 0px);
  background: #000;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-monitors > .vmcr-monitor:nth-child(2) {
  order: 0;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-monitor {
  position: relative;
  min-height: 0;
  display: flex;
  flex-direction: column;
  margin: 0;
  border-radius: 0;
  overflow: hidden;
  background: #000;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-monitor__head {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 3;
  padding: 4px 8px;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.55), transparent);
  pointer-events: none;
  color: #e2e8f0;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-monitor__tag,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-monitor__src {
  color: #e2e8f0 !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-monitor__src {
  color: #94a3b8 !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-preview span {
  color: #94a3b8 !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-preview-mon,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-program {
  flex: 1 1 auto;
  min-height: 0 !important;
  height: 100%;
  max-height: none;
  aspect-ratio: auto !important;
  border-radius: 0 !important;
  border: 0 !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-controls--bar {
  flex: 0 0 auto;
  margin: 0;
  padding: 3px 4px;
  border-radius: 0;
  border: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  position: relative;
  z-index: 70;
  box-shadow: none;
  background: rgba(12, 18, 28, 0.96);
  flex-wrap: nowrap;
  overflow-x: auto;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-controls--bar .vmcr-btn {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.22);
  background: rgba(255, 255, 255, 0.1);
  min-height: 28px;
  padding: 3px 7px;
  font-size: 0.68rem;
  flex: 0 0 auto;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-bus-toggle {
  border-color: rgba(255, 255, 255, 0.28);
  background: rgba(0, 0, 0, 0.35);
  flex: 0 0 auto !important;
  align-self: center;
  overflow: hidden;
  border-radius: 8px;
}

/* Bus Prev|Prog + OV: compact fixed box — active only changes fill */
body.vmcr-dir-page.vmcr-mix-fs .vmcr-bus-btn {
  color: rgba(255, 255, 255, 0.7) !important;
  background: transparent !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 2.45rem !important;
  max-width: none !important;
  min-height: 26px !important;
  height: 26px !important;
  padding: 0 6px !important;
  font-size: 0.62rem !important;
  line-height: 1 !important;
  transform: none !important;
  box-shadow: none !important;
  border: 0 !important;
  white-space: nowrap;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-ov-toggle .vmcr-bus-btn {
  min-width: 2.15rem !important;
  padding: 0 5px !important;
  font-size: 0.58rem !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-bus-btn.is-active {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  transform: none !important;
  box-shadow: none !important;
}

body.vmcr-dir-page.vmcr-mix-fs #vmcr-bus-preview.is-active {
  background: linear-gradient(180deg, #4a8fd4 0%, #2f5f8a 100%) !important;
  color: #fff !important;
}

body.vmcr-dir-page.vmcr-mix-fs #vmcr-bus-program.is-active {
  background: linear-gradient(180deg, #f0b35a 0%, #c45f12 100%) !important;
  color: #fff !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-ov-toggle #vmcr-ov-pvw.is-active {
  background: linear-gradient(180deg, #4a8fd4 0%, #2f5f8a 100%) !important;
  color: #fff !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-ov-toggle #vmcr-ov-both.is-active {
  background: linear-gradient(180deg, #e5484d 0%, #a11f24 100%) !important;
  color: #fff !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.16);
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-status--bar {
  color: rgba(255, 255, 255, 0.75);
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-status--bar.is-ok {
  color: #8fd6b0;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-status--bar.is-error {
  color: #ffb4a8;
}

body.vmcr-dir-page.vmcr-mix-fs #vmcr-take-btn,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-btn--take {
  background: linear-gradient(180deg, #2f5f8a 0%, #1e4060 100%);
  border-color: rgba(30, 64, 96, 0.55);
  min-width: 5.75rem !important;
  padding-left: 1.25rem !important;
  padding-right: 1.25rem !important;
  font-weight: 780;
  letter-spacing: 0.02em;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
}

body.vmcr-dir-page.vmcr-mix-fs #vmcr-voice-toggle,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-btn--voice {
  min-width: 1.7rem !important;
  width: 1.7rem !important;
  padding: 0 !important;
  font-size: 0.7rem !important;
  font-weight: 800 !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-pip-controls {
  flex: 0 0 auto;
  margin: 0;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.18);
  color: #fff;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-pip-label,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-pip-size {
  color: rgba(255, 255, 255, 0.8);
}

/*
 * Mix FS layout canon (desktop + mobile landscape):
 *   [ Preview | Program ]
 *   [ transport bar ]
 *   [ Action 3/5 | Prepare 2/5 ]
 *     Action: cams in 3 columns (2×3) + Media | Overlay under cams
 *     Prepare: Media | Overlay panels side-by-side
 * Never use the old 8-column cam+button strip in mix FS.
 */
body.vmcr-dir-page.vmcr-mix-fs .vmcr-workbench {
  flex: 0 0 auto;
  margin: 0;
  max-height: min(42vh, 360px);
  overflow: auto;
  padding: 4px 6px max(6px, env(safe-area-inset-bottom, 0px));
  background: #0c121c;
  display: grid !important;
  grid-template-columns: minmax(0, 2.45fr) minmax(0, 0.34fr) minmax(10.25rem, 0.88fr) minmax(10.25rem, 0.88fr);
  gap: 6px;
  align-items: stretch;
  z-index: auto;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-aux-panel {
  padding: 4px 5px !important;
  overflow: auto;
}
body.vmcr-dir-page.vmcr-mix-fs .vmcr-aux-panel .vmcr-panel-head__hint {
  display: none;
}
body.vmcr-dir-page.vmcr-mix-fs .vmcr-aux-btn {
  padding: 4px 5px;
}
body.vmcr-dir-page.vmcr-mix-fs .vmcr-aux-menu {
  background: rgba(12, 18, 28, 0.96);
  border-color: rgba(255, 255, 255, 0.16);
  color: #fff;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-aux-send {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.14);
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-aux-send__title,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-aux-menu__field {
  color: rgba(255, 255, 255, 0.7);
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-workbench > .vmcr-card {
  overflow: hidden !important;
  min-height: 0;
  height: 100%;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-action-panel {
  margin: 0 !important;
  padding: 6px 8px !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, 0.04) !important;
  box-shadow: none !important;
  min-height: 0;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-action-panel .vmcr-panel-head {
  display: flex !important;
  flex: 0 0 auto;
  margin-bottom: 6px;
  gap: 6px 8px;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-action-panel .vmcr-panel-head h2 {
  color: #fff !important;
  font-size: 0.9rem;
  margin: 0;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-source-strip {
  display: flex !important;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  overflow: visible;
  overscroll-behavior: auto;
  touch-action: pan-y;
  grid-template-columns: none !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-source-strip .vmcr-previews--row {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-auto-rows: auto;
  gap: 8px;
  flex: 1 1 auto;
  min-height: 0;
  align-items: start;
  height: auto;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-action-extras {
  display: none !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-action-extras .vmcr-strip-btn,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-strip-btn {
  display: flex !important;
  min-height: 44px !important;
  padding: 8px 10px !important;
  border-radius: 12px !important;
  align-items: center;
  justify-content: flex-start;
  color: #fff !important;
  border: 1px solid transparent !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-action-extras .vmcr-strip-btn--media {
  background: linear-gradient(145deg, #3a7eb8 0%, #2f5f8a 48%, #1e4060 100%) !important;
  box-shadow:
    0 10px 24px rgba(30, 64, 96, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-action-extras .vmcr-strip-btn--bg {
  background: linear-gradient(145deg, #3f9a6a 0%, #2e7d55 48%, #1c5a3c 100%) !important;
  box-shadow:
    0 10px 24px rgba(28, 90, 60, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-action-extras .vmcr-strip-btn--overlay {
  background: linear-gradient(145deg, #d4893a 0%, #c45f12 48%, #8a3f08 100%) !important;
  box-shadow:
    0 10px 24px rgba(138, 63, 8, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-action-extras .vmcr-strip-btn strong,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-action-extras .vmcr-strip-btn span {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-action-extras .vmcr-strip-btn .vmcr-preview__state {
  color: rgba(255, 255, 255, 0.82) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.82) !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-preview {
  min-height: 0 !important;
  height: auto !important;
  overflow: hidden;
  background: #000;
  align-self: stretch;
  display: flex !important;
  flex-direction: column;
  grid-template-rows: none !important;
  border-radius: 8px;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-preview video {
  max-height: none;
  width: 100%;
  height: auto !important;
  min-height: 0;
  aspect-ratio: 16 / 9 !important;
  flex: 0 0 auto;
  object-fit: cover;
  object-position: center;
  background: #000;
  display: block !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-source-strip,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-previews,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-previews--row {
  flex: 1 1 auto !important;
  min-height: 0;
  height: 100%;
  align-items: stretch !important;
  align-content: stretch;
  grid-auto-rows: 1fr;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-preview {
  height: 100% !important;
  min-height: 0 !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-workbench > .vmcr-media-panel,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-workbench > .vmcr-overlay-panel {
  display: flex !important;
  flex-direction: column;
  margin: 0 !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 10px !important;
  color: #fff !important;
  min-height: 0;
  height: 100%;
  max-height: none;
  overflow: auto;
  overscroll-behavior: auto;
  touch-action: pan-y;
  padding: 6px 8px !important;
  align-self: stretch;
  box-shadow: none !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-workbench .vmcr-bg-panel {
  display: none !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-workbench .vmcr-slot-btns,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-workbench .vmcr-bg-col {
  flex: 0 0 auto;
  min-height: 0;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-workbench .vmcr-slot-row {
  flex: 0 0 auto;
  min-height: 34px;
  grid-template-columns: auto minmax(0, 1fr) max-content;
  gap: 5px;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-workbench .vmcr-slot-z {
  display: none !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-workbench .vmcr-slot-live-go {
  width: auto !important;
  min-width: 3.2rem;
  padding: 4px 8px;
  white-space: nowrap;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-bg-btn {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.18);
  color: #fff;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-bg-btn span {
  color: rgba(255, 255, 255, 0.65);
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-bg-btn.is-on {
  background: rgba(46, 125, 90, 0.35);
  border-color: rgba(120, 220, 170, 0.55);
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-slot-btn {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.18);
  color: #fff;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-slot-edit,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-slot-cue,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-slot-play {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.2);
  color: rgba(255, 255, 255, 0.85);
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-slot-play {
  background: rgba(46, 125, 90, 0.35);
  border-color: rgba(120, 220, 170, 0.4);
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-slot-btn span {
  color: rgba(255, 255, 255, 0.65);
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-slot-btn.is-active {
  background: rgba(46, 125, 90, 0.35);
  border-color: rgba(120, 220, 170, 0.55);
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-slot-btn.is-open {
  background: rgba(90, 130, 190, 0.35);
  border-color: rgba(160, 200, 255, 0.55);
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-ov-preset.vmcr-slot-menu {
  background: rgba(12, 18, 28, 0.95);
  border-color: rgba(255, 255, 255, 0.16);
  color: #fff;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-bg-menu__panel {
  background: rgba(12, 18, 28, 0.96);
  border-color: rgba(255, 255, 255, 0.16);
  color: #fff;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-asset-menu .vmcr-bg-menu__preview-wrap {
  box-shadow: 0 8px 16px rgba(12, 18, 28, 0.95);
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-asset-menu .vmcr-bg-menu__actions,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-asset-menu .vmcr-bg-fit {
  background: rgba(12, 18, 28, 0.98);
  border-top-color: rgba(255, 255, 255, 0.12);
  box-shadow: 0 -8px 16px rgba(12, 18, 28, 0.9);
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-asset-menu .vmcr-bg-fit {
  box-shadow: none;
  border-top: 0;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-asset-menu .vmcr-btn--ghost,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-bg-menu .vmcr-btn--ghost {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.22);
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-asset-menu .vmcr-asset-fit__btn.is-active,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-bg-menu .vmcr-bg-fit__btn.is-active {
  background: rgba(90, 150, 220, 0.4) !important;
  border-color: rgba(160, 200, 255, 0.55) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-slot-pop__panel {
  background: rgba(12, 18, 28, 0.96);
  border-color: rgba(255, 255, 255, 0.16);
  color: #fff;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-bg-menu__panel .vmcr-lead,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-bg-menu__panel .vmcr-meta-line,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-bg-fit__label {
  color: rgba(255, 255, 255, 0.72) !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-bg-fit__btn.is-active {
  background: rgba(255, 255, 255, 0.14);
  border-color: rgba(255, 255, 255, 0.35);
  color: #fff;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-sheet-close {
  display: none !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-overlay-panel .vmcr-field {
  margin-bottom: 4px;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-overlay-panel .vmcr-field label {
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: 0.7rem;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-overlay-panel .vmcr-field input {
  padding: 5px 8px;
  /* Never below 16px — smaller triggers iOS/Android's auto-zoom-on-focus. */
  font-size: 16px;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-ov-plates__title {
  color: #fff !important;
  font-size: 0.8rem;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-media-list,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-plate-list {
  max-height: none;
  overflow: visible;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-media-item,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-plate-item {
  background: rgba(255, 255, 255, 0.06);
  color: #e2e8f0 !important;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-meta-line {
  color: rgba(255, 255, 255, 0.65) !important;
  font-size: 0.72rem;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-btn--mix-fs {
  display: inline-flex !important;
  background: linear-gradient(145deg, #7b5fb8 0%, #3d2860 52%, #2a1b45 100%) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  border-color: rgba(166, 147, 239, 0.55) !important;
  box-shadow:
    0 0 0 1px rgba(166, 147, 239, 0.35),
    0 8px 18px rgba(61, 40, 96, 0.45),
    inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-workbench .vmcr-lead,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-ov-plates__lead,
body.vmcr-dir-page.vmcr-mix-fs .vmcr-panel-head__hint {
  display: none;
}

body.vmcr-dir-page.vmcr-mix-fs .vmcr-media-panel .vmcr-media-preview {
  max-height: 64px;
}

/* Mobile landscape mix FS — same sections as desktop FS; only denser sizing */
@media (max-width: 900px) and (orientation: landscape) {
  body.vmcr-dir-page.vmcr-mix-fs .vmcr-wrap--director {
    padding-left: env(safe-area-inset-left, 0px);
    padding-right: env(safe-area-inset-right, 0px);
  }

  body.vmcr-dir-page.vmcr-mix-fs .vmcr-monitors {
    flex: 1 1 auto;
    min-height: 0;
    gap: 2px;
    padding-top: env(safe-area-inset-top, 0px);
  }

  body.vmcr-dir-page.vmcr-mix-fs .vmcr-preview-mon,
  body.vmcr-dir-page.vmcr-mix-fs .vmcr-program {
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
  }

  body.vmcr-dir-page.vmcr-mix-fs .vmcr-controls--bar {
    padding: 2px 4px;
    gap: 3px;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* Keep bar buttons compact, but do not override fixed bus-btn box */
  body.vmcr-dir-page.vmcr-mix-fs .vmcr-controls--bar > .vmcr-btn {
    min-height: 26px;
    padding: 2px 6px;
    font-size: 0.62rem;
  }

  body.vmcr-dir-page.vmcr-mix-fs #vmcr-take-btn,
  body.vmcr-dir-page.vmcr-mix-fs .vmcr-btn--take {
    min-width: 5.25rem !important;
    padding-left: 1.1rem !important;
    padding-right: 1.1rem !important;
  }

  body.vmcr-dir-page.vmcr-mix-fs #vmcr-voice-toggle,
  body.vmcr-dir-page.vmcr-mix-fs .vmcr-btn--voice {
    min-width: 1.55rem !important;
    width: 1.55rem !important;
  }

  body.vmcr-dir-page.vmcr-mix-fs .vmcr-workbench {
    display: grid !important;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.4fr) minmax(0, 1.2fr) minmax(0, 1.2fr) !important;
    gap: 4px;
    max-height: min(46vh, 300px);
    overflow: auto;
    padding: 3px 4px max(4px, env(safe-area-inset-bottom, 0px));
  }

  body.vmcr-dir-page.vmcr-mix-fs .vmcr-action-panel {
    padding: 4px 6px !important;
  }

  body.vmcr-dir-page.vmcr-mix-fs .vmcr-action-panel .vmcr-panel-head {
    display: flex !important;
  }

  body.vmcr-dir-page.vmcr-mix-fs .vmcr-workbench > .vmcr-card {
    height: 100%;
    align-self: stretch;
  }

  body.vmcr-dir-page.vmcr-mix-fs .vmcr-source-strip {
    display: block !important;
    grid-template-columns: none !important;
  }

  body.vmcr-dir-page.vmcr-mix-fs .vmcr-source-strip .vmcr-previews--row {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 3px;
  }

  body.vmcr-dir-page.vmcr-mix-fs .vmcr-action-extras {
    display: none !important;
  }

  body.vmcr-dir-page.vmcr-mix-fs .vmcr-preview video {
    max-height: none;
    min-height: 88px;
    display: block !important;
  }

  body.vmcr-dir-page.vmcr-mix-fs .vmcr-sky-idle {
    display: block;
  }

  body.vmcr-dir-page.vmcr-mix-fs .vmcr-preview strong {
    font-size: 0.62rem !important;
  }

  body.vmcr-dir-page.vmcr-mix-fs .vmcr-preview span,
  body.vmcr-dir-page.vmcr-mix-fs .vmcr-preview__state {
    font-size: 0.5rem !important;
  }

  body.vmcr-dir-page.vmcr-mix-fs .vmcr-workbench .vmcr-media-panel,
  body.vmcr-dir-page.vmcr-mix-fs .vmcr-workbench .vmcr-overlay-panel {
    display: flex !important;
    padding: 4px 6px !important;
  }

  body.vmcr-dir-page.vmcr-mix-fs .vmcr-sheet-close {
    display: none !important;
  }

  body.vmcr-dir-page.vmcr-mix-fs .vmcr-btn--mix-fs {
    display: inline-flex !important;
  }

  body.vmcr-dir-page.vmcr-mix-fs .vmcr-frame-guide-wrap {
    flex: 0 0 auto;
  }
}

@media (max-width: 900px) and (orientation: portrait) {
  .vmcr-btn--mix-fs {
    display: none !important;
  }
}

/* ——— Framing guides (Director + Camera) ——— */
.vmcr-frame-guide-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  z-index: 80;
}

.vmcr-action-comms-wrap {
  gap: 0.35rem;
}

.vmcr-frame-guide-menu {
  position: fixed;
  left: 0;
  top: 0;
  bottom: auto;
  z-index: 20050;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  gap: 6px;
  padding: 8px;
  border-radius: 12px;
  border: 1px solid rgba(47, 95, 138, 0.28);
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 12px 36px rgba(26, 36, 51, 0.28);
  min-width: min(300px, calc(100vw - 16px));
  max-width: min(420px, calc(100vw - 16px));
  overflow-x: hidden;
  overflow-y: auto;
  pointer-events: auto;
  touch-action: manipulation;
}

.vmcr-frame-guide-menu__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
}

.vmcr-frame-guide-menu__lab {
  flex: 0 0 auto;
  min-width: 2.6rem;
  font-size: 0.68rem;
  font-weight: 750;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(26, 36, 51, 0.62);
}

.vmcr-frame-guide-menu__hint {
  margin: 0 0 2px;
  font-size: 0.68rem;
  font-weight: 650;
  color: rgba(26, 36, 51, 0.62);
}

.vmcr-frame-guide-menu__panel[hidden] {
  display: none !important;
}

.vmcr-frame-guide-menu__row--ok {
  justify-content: flex-end;
  margin-top: 2px;
}

.vmcr-frame-guide-menu[hidden] {
  display: none !important;
}

.vmcr-frame-guide-menu__btn {
  appearance: none;
  border: 1px solid rgba(47, 95, 138, 0.28);
  background: rgba(255, 255, 255, 0.9);
  color: var(--vmcr-ink, #1a2433);
  font: inherit;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  padding: 8px 10px;
  min-height: 36px;
  border-radius: 999px;
  cursor: pointer;
  white-space: nowrap;
  pointer-events: auto;
  touch-action: manipulation;
  -webkit-user-select: none;
  user-select: none;
}

.vmcr-frame-guide-menu__btn:hover,
.vmcr-frame-guide-menu__btn:focus-visible {
  border-color: rgba(61, 40, 96, 0.45);
  outline: none;
}

.vmcr-frame-guide-menu__btn.is-active {
  background: linear-gradient(145deg, #7b5fb8 0%, #3d2860 55%, #2a1b45 100%);
  color: #fff !important;
  border-color: rgba(61, 40, 96, 0.55);
}

.vmcr-frame-guide-menu__btn--off {
  opacity: 0.85;
}

#vmcr-action-frame-btn.is-active,
#vmcr-cam-frame-btn.is-active {
  background: linear-gradient(145deg, #7b5fb8 0%, #3d2860 55%, #2a1b45 100%) !important;
  color: #fff !important;
  border-color: rgba(61, 40, 96, 0.55) !important;
}

.vmcr-frame-guide {
  position: absolute;
  inset: 0;
  z-index: 12;
  pointer-events: none;
  overflow: hidden;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
}

.vmcr-frame-guide[hidden] {
  display: none !important;
}

/* Shot-size figure (крупност) — same overlay on Director cam tiles and phone picture. */
.vmcr-preview > .vmcr-frame-guide {
  top: 0;
  left: 0;
  right: 0;
  bottom: auto;
  height: auto;
  aspect-ratio: 16 / 9;
  z-index: 12;
}

.vmcr-frame-guide__figure {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.vmcr-frame-guide__solo,
.vmcr-frame-guide__duo {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  height: 100%;
  width: 25.7%;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  justify-content: center;
  transform: translateX(-50%);
  pointer-events: none;
}

.vmcr-frame-guide__figure[data-shot="mcu"] .vmcr-frame-guide__solo {
  width: 56.25%;
}
.vmcr-frame-guide__figure[data-shot="elbows"] .vmcr-frame-guide__solo,
.vmcr-frame-guide__figure[data-shot="twoelbows"] .vmcr-frame-guide__duo {
  width: 46%;
}
.vmcr-frame-guide__figure[data-shot="hands"] .vmcr-frame-guide__solo,
.vmcr-frame-guide__figure[data-shot="twohands"] .vmcr-frame-guide__duo {
  width: 38%;
}
.vmcr-frame-guide__figure[data-shot="knees"] .vmcr-frame-guide__solo,
.vmcr-frame-guide__figure[data-shot="twoknees"] .vmcr-frame-guide__duo {
  width: 31.2%;
}
.vmcr-frame-guide__figure[data-shot="full"] .vmcr-frame-guide__solo,
.vmcr-frame-guide__figure[data-shot="twofull"] .vmcr-frame-guide__duo,
.vmcr-frame-guide__figure[data-shot="two"] .vmcr-frame-guide__duo {
  width: 25.7%;
}
.vmcr-frame-guide__figure.is-duo .vmcr-frame-guide__duo,
.vmcr-frame-guide__figure[data-shot^="two"] .vmcr-frame-guide__duo {
  width: min(72%, calc(25.7% * 2.15));
}
.vmcr-frame-guide__figure[data-shot="twoelbows"] .vmcr-frame-guide__duo {
  width: min(78%, 72%);
}
.vmcr-frame-guide__figure[data-shot="twohands"] .vmcr-frame-guide__duo {
  width: min(70%, 64%);
}

.vmcr-frame-guide__solo[aria-hidden="true"],
.vmcr-frame-guide__duo[aria-hidden="true"] {
  display: none !important;
}

.vmcr-frame-guide__figure[data-look="left"] .vmcr-frame-guide__solo,
.vmcr-frame-guide__figure[data-look="left"] .vmcr-frame-guide__duo {
  left: 30%;
}

.vmcr-frame-guide__figure[data-look="right"] .vmcr-frame-guide__solo,
.vmcr-frame-guide__figure[data-look="right"] .vmcr-frame-guide__duo {
  left: 70%;
}

.vmcr-frame-guide__duo {
  gap: 8%;
}

.vmcr-frame-guide__duo-person {
  height: 100%;
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  align-items: stretch;
  justify-content: center;
}

.vmcr-frame-guide__fig {
  display: none;
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  opacity: 0.5;
  filter: drop-shadow(0 0 1px #000) drop-shadow(0 1px 3px rgba(0, 0, 0, 0.75));
}

.vmcr-frame-guide__fig--front {
  display: block;
}

.vmcr-frame-guide__figure[data-look="left"] .vmcr-frame-guide__fig--front,
.vmcr-frame-guide__figure[data-look="right"] .vmcr-frame-guide__fig--front {
  display: none;
}

.vmcr-frame-guide__figure[data-look="left"] .vmcr-frame-guide__fig--threeq,
.vmcr-frame-guide__figure[data-look="left"] .vmcr-frame-guide__fig--side,
.vmcr-frame-guide__figure[data-look="right"] .vmcr-frame-guide__fig--threeq,
.vmcr-frame-guide__figure[data-look="right"] .vmcr-frame-guide__fig--side {
  display: block;
}

.vmcr-frame-guide__figure[data-look="right"] .vmcr-frame-guide__fig--threeq,
.vmcr-frame-guide__figure[data-look="right"] .vmcr-frame-guide__fig--side {
  transform: scaleX(-1);
}

/**
 * The figure photo — traced from the owner's reference art, gold line-art
 * on a transparent PNG — is cropped to shot size by cropping from the top:
 * a taller `height` zooms the same photo in, like a tighter camera shot.
 * Percentages are 100 / (fraction of the photo visible at that shot).
 */
.vmcr-frame-guide__fig-img {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: auto;
  height: 100%;
  max-width: none;
  pointer-events: none;
  user-select: none;
}

.vmcr-frame-guide__figure[data-shot="mcu"] .vmcr-frame-guide__fig-img {
  height: 294%;
}
.vmcr-frame-guide__figure[data-shot="elbows"] .vmcr-frame-guide__fig-img,
.vmcr-frame-guide__figure[data-shot="twoelbows"] .vmcr-frame-guide__fig-img {
  height: 217%;
}
.vmcr-frame-guide__figure[data-shot="hands"] .vmcr-frame-guide__fig-img,
.vmcr-frame-guide__figure[data-shot="twohands"] .vmcr-frame-guide__fig-img {
  height: 172%;
}
.vmcr-frame-guide__figure[data-shot="knees"] .vmcr-frame-guide__fig-img,
.vmcr-frame-guide__figure[data-shot="twoknees"] .vmcr-frame-guide__fig-img {
  height: 135%;
}
.vmcr-frame-guide__figure[data-shot="full"] .vmcr-frame-guide__fig-img,
.vmcr-frame-guide__figure[data-shot="twofull"] .vmcr-frame-guide__fig-img,
.vmcr-frame-guide__figure[data-shot="two"] .vmcr-frame-guide__fig-img {
  height: 100%;
}

.vmcr-frame-guide__size {
  position: absolute;
  left: 8px;
  bottom: 8px;
  z-index: 2;
  padding: 3px 8px;
  border-radius: 6px;
  background: rgba(0, 0, 0, 0.62);
  color: #ffe27a;
  font-size: 0.68rem;
  font-weight: 750;
  letter-spacing: 0.03em;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.7);
  pointer-events: none;
}

@keyframes vmcr-shot-pop {
  0% { opacity: 0.12; }
  100% { opacity: 1; }
}

.vmcr-frame-guide.is-shot-pop .vmcr-frame-guide__figure {
  animation: vmcr-shot-pop 0.4s ease-out;
}

.vmcr-cam-picture .vmcr-frame-guide {
  z-index: 12;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
}

.vmcr-cam-picture .vmcr-cam-chrome {
  z-index: 14;
}

.vmcr-frame-guide__headroom {
  position: absolute;
  left: 4%;
  right: 4%;
  top: 6%;
  height: 0;
  border-top: 1px dashed rgba(255, 255, 255, 0.55);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.25);
}

.vmcr-frame-guide__thirds {
  display: none;
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.vmcr-frame-guide__thirds i {
  position: absolute;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.vmcr-frame-guide__thirds i:nth-child(1),
.vmcr-frame-guide__thirds i:nth-child(2) {
  top: 0;
  bottom: 0;
  width: 0;
  border-left: 1px solid rgba(255, 220, 80, 0.78);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.28);
}

.vmcr-frame-guide__thirds i:nth-child(1) { left: 33.333%; }
.vmcr-frame-guide__thirds i:nth-child(2) { left: 66.666%; }

.vmcr-frame-guide__thirds i:nth-child(3),
.vmcr-frame-guide__thirds i:nth-child(4) {
  left: 0;
  right: 0;
  height: 0;
  border-top: 1px solid rgba(255, 220, 80, 0.78);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.28);
}

.vmcr-frame-guide__thirds i:nth-child(3) { top: 33.333%; }
.vmcr-frame-guide__thirds i:nth-child(4) { top: 66.666%; }

.vmcr-frame-guide[data-frame="grid"] .vmcr-frame-guide__thirds {
  display: block;
}

.vmcr-frame-guide[data-frame="grid"] .vmcr-frame-guide__headroom,
.vmcr-frame-guide[data-frame="grid"] .vmcr-frame-guide__cut,
.vmcr-frame-guide[data-frame="grid"] .vmcr-frame-guide__look,
.vmcr-frame-guide[data-frame="grid"] .vmcr-frame-guide__look-tag {
  display: none;
}

.vmcr-action-frame-wrap {
  margin-left: auto;
}

.vmcr-action-panel > .vmcr-panel-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
}

#vmcr-action-frame-btn.is-active {
  background: linear-gradient(145deg, #7b5fb8 0%, #3d2860 55%, #2a1b45 100%) !important;
  color: #fff !important;
  border-color: rgba(61, 40, 96, 0.55) !important;
}

.vmcr-frame-guide__cut {
  position: absolute;
  left: 3%;
  right: 3%;
  height: 0;
  border-top: 2px solid rgba(255, 198, 75, 0.92);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.35);
}

.vmcr-frame-guide__look {
  position: absolute;
  top: 8%;
  bottom: 8%;
  width: 0;
  border-left: 2px solid rgba(166, 147, 239, 0.9);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.3);
}

.vmcr-frame-guide__look--left {
  left: 34%;
}

.vmcr-frame-guide__look--right {
  left: 66%;
}

.vmcr-frame-guide__look-tag {
  position: absolute;
  top: 9%;
  font-size: 0.62rem;
  font-weight: 750;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.92);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.75);
  white-space: nowrap;
}

.vmcr-frame-guide__look-tag--left {
  left: 34%;
  transform: translateX(6px);
}

.vmcr-frame-guide__look-tag--right {
  left: 66%;
  transform: translateX(calc(-100% - 6px));
}

.vmcr-frame-guide__label {
  position: absolute;
  left: 8px;
  bottom: 8px;
  padding: 4px 8px;
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.55);
  color: #fff;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}