/* WInterface-only standalone shell
   Purpose: remove the surrounding page and open the preserved WInterface console directly in widescreen mode.
   No WInterface content, cards, media behavior, labels, or theme logic are changed here. */

html.winterface-standalone,
body.winterface-standalone {
  width: 100%;
  min-width: 0;
  min-height: 100%;
  margin: 0;
  overflow: hidden;
  background: #050816;
}

body.winterface-standalone {
  display: block;
}

body.winterface-standalone::before,
body.winterface-standalone::after {
  content: none !important;
}

body.winterface-standalone #main-content {
  min-height: 100dvh;
  margin: 0;
  padding: 0;
}

body.winterface-standalone .parallax-background {
  position: fixed;
  inset: 0;
  pointer-events: none;
}

body.winterface-standalone .winterface-standalone-audio {
  position: fixed;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

body.winterface-standalone .site-audio {
  position: static;
}

body.winterface-standalone .site-audio .sound-toggle,
body.winterface-standalone .site-audio #sound-status {
  display: none !important;
}

@media (min-width: 900px) {
  html.winterface-standalone,
  body.winterface-standalone,
  html.winterface-standalone.winterface-maximized,
  body.winterface-standalone.winterface-maximized {
    overflow: hidden !important;
    overscroll-behavior: none;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface,
  body.winterface-standalone .interface-section.is-winterface-maximized {
    position: fixed;
    inset: 0;
    z-index: 10000;
    max-width: none;
    width: 100vw;
    height: 100dvh;
    margin: 0;
    padding: clamp(0.55rem, 1vw, 0.9rem);
    overflow: hidden;
  }
}

@media (max-width: 899px) {
  body.winterface-standalone {
    overflow: auto;
  }

  body.winterface-standalone #main-content {
    min-height: auto;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface {
    margin-block: 0;
  }
}


/* =========================
   WInterface-only locked fullscreen shell + universal sound orb
   This standalone override prevents the original site restore cycle and keeps the console in its full-window layout.
========================= */

html.winterface-standalone,
html.winterface-standalone.winterface-maximized,
body.winterface-standalone,
body.winterface-standalone.winterface-maximized {
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 100%;
  overflow: hidden !important;
  overscroll-behavior: none;
}

body.winterface-standalone #main-content {
  width: 100vw;
  height: 100dvh;
  min-height: 100dvh;
  overflow: hidden;
}

body.winterface-standalone .interface-section.winterface-standalone-interface {
  position: fixed !important;
  inset: 0 !important;
  z-index: 10000;
  display: block;
  width: 100vw !important;
  height: 100dvh !important;
  max-width: none !important;
  margin: 0 !important;
  padding: clamp(0.55rem, 1vw, 0.9rem) !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 16% 12%, rgba(56, 189, 248, 0.22), transparent 36%),
    radial-gradient(circle at 84% 24%, rgba(139, 92, 246, 0.24), transparent 40%),
    radial-gradient(circle at 52% 92%, rgba(236, 72, 153, 0.16), transparent 42%),
    rgba(5, 8, 22, 0.96);
}

body.winterface-standalone .interface-section.winterface-standalone-interface::before {
  content: none !important;
}

body.winterface-standalone .interface-section.winterface-standalone-interface .interface-header {
  display: none !important;
}

body.winterface-standalone .interface-section.winterface-standalone-interface .interface-shell {
  display: flex !important;
  flex-direction: column;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: clamp(0.75rem, 1.05vw, 1.05rem) !important;
  border-radius: clamp(20px, 2vw, 30px);
  overflow: hidden !important;
}

body.winterface-standalone .interface-section.winterface-standalone-interface .interface-status-bar {
  flex: 0 0 auto;
  margin-bottom: clamp(0.62rem, 0.9vw, 0.9rem);
}

body.winterface-standalone .interface-section.winterface-standalone-interface .interface-grid {
  flex: 1 1 auto;
  min-height: 0 !important;
  height: auto !important;
  align-items: stretch;
  grid-template-columns: minmax(210px, 0.62fr) minmax(0, 1.58fr) minmax(250px, 0.82fr);
  gap: clamp(0.65rem, 0.85vw, 0.95rem);
  overflow: hidden !important;
}

body.winterface-standalone .interface-section.winterface-standalone-interface.interface-system-media-expanded .interface-grid {
  grid-template-columns: minmax(210px, 0.48fr) minmax(0, 2fr);
}

body.winterface-standalone .interface-section.winterface-standalone-interface .interface-rail,
body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core,
body.winterface-standalone .interface-section.winterface-standalone-interface .interface-side-panel {
  min-height: 0 !important;
  max-height: none !important;
  overflow: hidden !important;
}

body.winterface-standalone .interface-section.winterface-standalone-interface .interface-rail {
  grid-template-rows: auto minmax(0, 1fr);
}

body.winterface-standalone .interface-section.winterface-standalone-interface .interface-path-list {
  min-height: 0 !important;
  grid-template-rows: repeat(6, minmax(0, 1fr));
}

body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core {
  justify-content: flex-start;
  overflow: hidden !important;
}

body.winterface-standalone .interface-section.winterface-standalone-interface .interface-response[data-interface-response] {
  min-height: 0 !important;
}

body.winterface-standalone .interface-section.winterface-standalone-interface .interface-side-panel {
  grid-template-rows: minmax(7.25rem, auto) minmax(0, 1fr) minmax(4.5rem, auto);
}

body.winterface-standalone .interface-section.winterface-standalone-interface .interface-media-panel:not([hidden]) {
  min-height: 0 !important;
  overflow: visible;
}

body.winterface-standalone .interface-section.winterface-standalone-interface .interface-showcase-frame,
body.winterface-standalone .interface-section.winterface-standalone-interface .interface-video-frame {
  max-height: min(56vh, 620px);
}

body.winterface-standalone .interface-section.winterface-standalone-interface .interface-media-actions {
  transform: translateY(-6px);
}

body.winterface-standalone .interface-maximize-button.winterface-standalone-sound-toggle {
  display: inline-grid;
  place-items: center;
  color: #bae6fd;
  cursor: pointer;
  box-shadow:
    0 0 0 1px rgba(56, 189, 248, 0.65),
    0 0 22px rgba(56, 189, 248, 0.32),
    inset 0 0 16px rgba(56, 189, 248, 0.18);
}

body.winterface-standalone .interface-maximize-button.winterface-standalone-sound-toggle:hover,
body.winterface-standalone .interface-maximize-button.winterface-standalone-sound-toggle:focus-visible,
body.winterface-standalone .interface-maximize-button.winterface-standalone-sound-toggle.is-sound-on {
  transform: translateY(-1px) scale(1.03);
  color: #e0f2fe;
  box-shadow:
    0 0 0 1px rgba(56, 189, 248, 0.85),
    0 0 28px rgba(56, 189, 248, 0.44),
    inset 0 0 22px rgba(56, 189, 248, 0.24);
}

body.winterface-standalone .winterface-standalone-sound-icon {
  width: 1.15rem;
  height: 1.15rem;
  fill: currentColor;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body.winterface-standalone .winterface-standalone-sound-icon .winterface-standalone-wave,
body.winterface-standalone .winterface-standalone-sound-icon .winterface-standalone-slash {
  fill: none;
}

body.winterface-standalone .interface-maximize-button.winterface-standalone-sound-toggle.is-sound-on .winterface-standalone-slash {
  opacity: 0;
}

body.winterface-standalone .interface-maximize-button.winterface-standalone-sound-toggle:not(.is-sound-on) .winterface-standalone-wave {
  opacity: 0.28;
}

body.winterface-standalone .interface-maximize-button.winterface-standalone-sound-toggle:not(.is-sound-on) .winterface-standalone-slash {
  opacity: 1;
}

/* =========================
   Standalone mobile forced-landscape canvas
   Purpose: keep the standalone WInterface in its widescreen layout on phones/tablets while allowing scroll when the viewport is physically too small.
========================= */

@media (max-width: 899px) {
  html.winterface-standalone,
  html.winterface-standalone.winterface-maximized,
  body.winterface-standalone,
  body.winterface-standalone.winterface-maximized {
    width: auto !important;
    height: auto !important;
    min-width: 1280px !important;
    min-height: 720px !important;
    overflow: auto !important;
    overscroll-behavior: contain;
    touch-action: pan-x pan-y;
  }

  body.winterface-standalone #main-content {
    width: max(100vw, 1280px) !important;
    height: max(100dvh, 720px) !important;
    min-width: 1280px !important;
    min-height: 720px !important;
    overflow: visible !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface,
  body.winterface-standalone .interface-section.winterface-standalone-interface.is-winterface-maximized {
    position: absolute !important;
    inset: auto !important;
    top: 0 !important;
    left: 0 !important;
    width: max(100vw, 1280px) !important;
    height: max(100dvh, 720px) !important;
    min-width: 1280px !important;
    min-height: 720px !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0.65rem !important;
    overflow: hidden !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-shell {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-status-bar {
    flex: 0 0 auto;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-grid {
    flex: 1 1 auto;
    min-height: 0 !important;
    height: auto !important;
    grid-template-columns: minmax(210px, 0.62fr) minmax(0, 1.58fr) minmax(250px, 0.82fr) !important;
    overflow: hidden !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface.interface-system-media-expanded .interface-grid {
    grid-template-columns: minmax(210px, 0.48fr) minmax(0, 2fr) !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-rail,
  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core,
  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-side-panel {
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-showcase-frame,
  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-video-frame {
    max-height: min(52vh, 430px) !important;
  }
}

/* =========================
   Standalone phone viewport lock v2
   Purpose: prevent the original mobile responsive stack from activating on phone Chrome.
   The standalone build keeps the desktop/WF canvas intact and allows panning when the device is smaller.
========================= */

@media (max-width: 1180px) and (pointer: coarse) {
  html.winterface-standalone,
  html.winterface-standalone.winterface-maximized,
  body.winterface-standalone,
  body.winterface-standalone.winterface-maximized {
    width: 1440px !important;
    height: 820px !important;
    min-width: 1440px !important;
    min-height: 820px !important;
    max-width: none !important;
    max-height: none !important;
    overflow: auto !important;
    overscroll-behavior: contain !important;
    touch-action: pan-x pan-y !important;
  }

  body.winterface-standalone #main-content {
    width: 1440px !important;
    height: 820px !important;
    min-width: 1440px !important;
    min-height: 820px !important;
    max-width: none !important;
    max-height: none !important;
    overflow: visible !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface,
  body.winterface-standalone .interface-section.winterface-standalone-interface.is-winterface-maximized {
    position: absolute !important;
    inset: auto !important;
    top: 0 !important;
    left: 0 !important;
    width: 1440px !important;
    height: 820px !important;
    min-width: 1440px !important;
    min-height: 820px !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0.72rem !important;
    overflow: hidden !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-shell {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: none !important;
    padding: 0.92rem !important;
    border-radius: 30px !important;
    overflow: hidden !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-status-bar {
    display: grid !important;
    grid-template-columns: minmax(250px, 0.92fr) minmax(190px, 0.56fr) minmax(220px, 0.62fr) minmax(290px, 0.9fr) !important;
    align-items: center !important;
    justify-content: stretch !important;
    gap: 0.74rem !important;
    flex: 0 0 auto !important;
    min-height: 4.35rem !important;
    margin-bottom: 0.82rem !important;
    padding: 0.82rem 1rem !important;
    overflow: visible !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-status-bar > *,
  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-status-bar > span,
  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-system-toggle,
  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-theme-selector,
  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-theme-toggle {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    white-space: nowrap !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-theme-selector {
    order: initial !important;
    display: inline-flex !important;
    justify-self: stretch !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-theme-toggle,
  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-system-toggle,
  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-status-item {
    justify-content: center !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-theme-menu {
    right: 0 !important;
    left: auto !important;
    width: 22rem !important;
    transform-origin: top right !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-grid {
    display: grid !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
    grid-template-columns: minmax(220px, 0.62fr) minmax(0, 1.58fr) minmax(270px, 0.82fr) !important;
    gap: 0.9rem !important;
    align-items: stretch !important;
    overflow: hidden !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface.interface-system-media-expanded .interface-grid {
    grid-template-columns: minmax(220px, 0.48fr) minmax(0, 2fr) !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface.interface-system-media-expanded .interface-core {
    grid-column: auto !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface.interface-system-media-expanded .interface-side-panel {
    display: none !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-rail,
  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core,
  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-side-panel {
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-rail {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
    gap: 0.64rem !important;
    padding: 0.85rem !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-rail-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0.65rem !important;
    min-height: 2.25rem !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-set-controls {
    display: inline-flex !important;
    flex-wrap: nowrap !important;
    gap: 0.36rem !important;
    max-width: none !important;
    overflow: visible !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-path-list {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: repeat(6, minmax(0, 1fr)) !important;
    gap: 0.5rem !important;
    min-height: 0 !important;
    height: 100% !important;
    overflow: hidden !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-path {
    min-height: 0 !important;
    height: auto !important;
    padding: 0.58rem 0.68rem !important;
    gap: 0.72rem !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-path span {
    width: 1.62rem !important;
    height: 1.62rem !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    min-height: 0 !important;
    padding: clamp(1.25rem, 2vw, 2.1rem) !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-command {
    flex: 0 0 auto !important;
    width: min(100%, 42rem) !important;
    margin-inline: auto !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-response[data-interface-response] {
    min-height: 0 !important;
    flex: 0 1 auto !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-media-panel:not([hidden]) {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    margin-top: 1.2rem !important;
    margin-bottom: 0 !important;
    overflow: visible !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-video-frame,
  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-showcase-frame {
    max-height: 430px !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-media-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 0.72rem !important;
    transform: translateY(-6px) !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-playback-status,
  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-media-toggle {
    width: auto !important;
    min-height: 2.18rem !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-side-panel {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: minmax(7.25rem, auto) minmax(0, 1fr) minmax(4.5rem, auto) !important;
    gap: 0.9rem !important;
    min-height: 0 !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-output-card,
  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-output-card-soft,
  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-jump-link {
    min-height: 0 !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-maximize-button.winterface-standalone-sound-toggle {
    display: inline-grid !important;
  }
}

/* =========================
   Standalone phone scaled-canvas adjustment v3
   Purpose: use the preserved desktop/WF WInterface canvas on phone browsers, then scale that canvas to the mobile viewport instead of letting the original phone stack or an oversized adjustmented canvas clip the UI.
========================= */

@media (max-width: 1180px) and (pointer: coarse) {
  html.winterface-standalone,
  html.winterface-standalone.winterface-maximized,
  body.winterface-standalone,
  body.winterface-standalone.winterface-maximized {
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: none !important;
    max-height: none !important;
    overflow: auto !important;
    overscroll-behavior: contain !important;
    touch-action: pan-x pan-y !important;
    background: #050816 !important;
  }

  body.winterface-standalone #main-content {
    position: relative !important;
    width: var(--wi-standalone-scaled-w, 738px) !important;
    height: var(--wi-standalone-scaled-h, 415px) !important;
    min-width: var(--wi-standalone-scaled-w, 738px) !important;
    min-height: var(--wi-standalone-scaled-h, 415px) !important;
    max-width: none !important;
    max-height: none !important;
    overflow: visible !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface,
  body.winterface-standalone .interface-section.winterface-standalone-interface.is-winterface-maximized {
    position: absolute !important;
    inset: auto !important;
    top: 0 !important;
    left: 0 !important;
    width: var(--wi-standalone-canvas-w, 1366px) !important;
    height: var(--wi-standalone-canvas-h, 768px) !important;
    min-width: var(--wi-standalone-canvas-w, 1366px) !important;
    min-height: var(--wi-standalone-canvas-h, 768px) !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0.65rem !important;
    overflow: hidden !important;
    transform: scale(var(--wi-standalone-phone-scale, 0.54)) !important;
    transform-origin: top left !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-shell {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    overflow: hidden !important;
  }
}

/* =========================
   Standalone phone control alignment adjustment v4
   Scope: phone Chrome only. Preserve the scaled WInterface canvas while restoring the expected control alignment.
========================= */

@media (max-width: 1180px) and (pointer: coarse) {
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-status-bar {
    grid-template-columns: minmax(250px, 0.92fr) minmax(190px, 0.56fr) minmax(180px, 0.42fr) minmax(290px, 0.9fr) !important;
  }

  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-theme-selector {
    justify-self: end !important;
    justify-content: flex-end !important;
    width: max-content !important;
    min-width: max-content !important;
  }

  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-status-count {
    justify-self: start !important;
  }

  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-media-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 0.72rem !important;
    transform: translateY(-6px) !important;
  }

  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-playback-status {
    justify-self: start !important;
    width: min(100%, 22rem) !important;
  }

  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-media-mute {
    justify-self: center !important;
  }

  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-media-toggle {
    justify-self: end !important;
    width: min(100%, 22rem) !important;
  }
}

/* =========================
   Standalone phone top status right alignment adjustment v5
   Scope: phone Chrome only. Keep the preserved desktop/WF canvas and align the Style Matrix + connected-status pills to the right edge.
========================= */

@media (max-width: 1180px) and (pointer: coarse) {
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-status-bar {
    grid-template-columns: minmax(250px, 0.92fr) minmax(190px, 0.56fr) minmax(0, 1fr) max-content !important;
    column-gap: 0.72rem !important;
  }

  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-theme-selector {
    justify-self: end !important;
    align-self: center !important;
    margin-left: auto !important;
    margin-right: 0 !important;
  }

  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-status-count {
    justify-self: end !important;
    align-self: center !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* =========================
   Standalone phone status pill compact adjustment v6
   Scope: phone Chrome only. Tighten the first two top status pills without changing desktop or WInterface content.
========================= */

@media (max-width: 1180px) and (pointer: coarse) {
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-status-bar {
    grid-template-columns: max-content max-content minmax(0, 1fr) max-content !important;
    column-gap: 0.72rem !important;
  }

  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-system-toggle,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-status-mode {
    justify-self: start !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: max-content !important;
    padding-left: 0.78rem !important;
    padding-right: 0.78rem !important;
    gap: 0.42rem !important;
  }

  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-system-toggle span,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-status-mode span {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    white-space: nowrap !important;
  }

  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-status-mode .interface-status-orb {
    flex: 0 0 auto !important;
  }
}
/* WInterface standalone media controls: stable capsule and volume styling. */
html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked,
html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked,
html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-media-toggle {
  color: var(--text) !important;
  border-color: rgba(255, 255, 255, 0.13) !important;
  background:
    linear-gradient(145deg, rgba(30, 36, 58, 0.72), rgba(10, 12, 26, 0.52)),
    radial-gradient(circle at 18% 16%, rgba(255, 255, 255, 0.085), transparent 42%),
    radial-gradient(circle at 88% 88%, rgba(var(--style-matrix-orb-left-rgb), 0.075), transparent 50%),
    rgba(255, 255, 255, 0.032) !important;
  box-shadow:
    0 0 0 1px rgba(var(--style-matrix-orb-left-rgb), 0.038),
    0 14px 30px rgba(0, 0, 0, 0.28),
    0 0 18px rgba(var(--style-matrix-orb-left-rgb), 0.075),
    inset 0 0 0 1px rgba(255, 255, 255, 0.055),
    inset 0 0 26px rgba(255, 255, 255, 0.030) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  text-shadow: none !important;
}

html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked span[data-interface-media-status-text],
html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked span[data-interface-media-status-text],
html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-media-toggle,
html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-media-toggle span {
  color: var(--text) !important;
  font-family: "Space Grotesk", sans-serif !important;
  font-size: clamp(0.62rem, 0.78vw, 0.72rem) !important;
  font-weight: 650 !important;
  letter-spacing: clamp(0.045em, 0.14vw, 0.075em) !important;
  line-height: 1 !important;
  text-transform: none !important;
  text-shadow: none !important;
}

html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked::before,
html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked::before,
html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-media-toggle::before {
  background: linear-gradient(90deg, transparent, rgba(var(--style-matrix-orb-left-rgb), 0.18), rgba(var(--style-matrix-orb-right-rgb), 0.12), transparent) !important;
  opacity: 0.44 !important;
}

html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked::after,
html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked::after,
html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-media-toggle::after {
  border-color: rgba(255, 255, 255, 0.055) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.055),
    inset 0 -1px 0 rgba(var(--style-matrix-orb-left-rgb), 0.035) !important;
}

html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked:hover,
html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked:focus-visible,
html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked:hover,
html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked:focus-visible,
html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-media-toggle:hover,
html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-media-toggle:focus-visible {
  transform: translateY(-2px) !important;
  border-color: rgba(var(--style-matrix-orb-left-rgb), 0.36) !important;
  background:
    linear-gradient(145deg, rgba(30, 36, 58, 0.72), rgba(10, 12, 26, 0.52)),
    radial-gradient(circle at 18% 16%, rgba(255, 255, 255, 0.090), transparent 42%),
    radial-gradient(circle at 88% 88%, rgba(var(--style-matrix-orb-left-rgb), 0.105), transparent 50%),
    rgba(255, 255, 255, 0.032) !important;
  box-shadow:
    0 0 0 1px rgba(var(--style-matrix-orb-left-rgb), 0.050),
    0 16px 36px rgba(0, 0, 0, 0.30),
    0 0 24px rgba(var(--style-matrix-orb-left-rgb), 0.11),
    inset 0 0 0 1px rgba(255, 255, 255, 0.062),
    inset 0 0 28px rgba(255, 255, 255, 0.035) !important;
}

html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-playback-status .interface-playback-dot {
  width: 0.50rem !important;
  height: 0.50rem !important;
  background: #fb7185 !important;
  box-shadow:
    0 0 14px rgba(251, 113, 133, 0.78),
    0 0 24px rgba(244, 63, 94, 0.30) !important;
}

html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked.interface-playback-is-playing .interface-playback-dot {
  background: #ef4444 !important;
  transform: scale(1.08) !important;
  box-shadow:
    0 0 12px rgba(239, 68, 68, 0.92),
    0 0 28px rgba(239, 68, 68, 0.46),
    0 0 42px rgba(236, 72, 153, 0.22) !important;
}

html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked[aria-pressed="true"]:not(.interface-playback-is-playing) .interface-playback-dot,
html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked[aria-pressed="true"] .interface-playback-dot {
  background: #4ade80 !important;
  box-shadow:
    0 0 16px rgba(74, 222, 128, 0.82),
    0 0 30px rgba(34, 197, 94, 0.34) !important;
}

/* WInterface standalone volume control: theme-synced orb. */
html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-media-mute::before {
  background: radial-gradient(ellipse at center, rgba(var(--style-matrix-orb-left-rgb), 0.38), rgba(var(--style-matrix-orb-right-rgb), 0.20) 42%, transparent 72%) !important;
}

html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-media-mute-stick {
  background:
    linear-gradient(180deg, rgba(248, 250, 252, 0.20), transparent 22%),
    linear-gradient(180deg, rgba(var(--style-matrix-orb-left-rgb), 0.74), rgba(var(--style-matrix-orb-right-rgb), 0.36)) !important;
  border-color: rgba(var(--style-matrix-orb-left-rgb), 0.38) !important;
  box-shadow:
    inset 0 0 9px rgba(248, 250, 252, 0.08),
    0 0 17px rgba(var(--style-matrix-orb-left-rgb), 0.28) !important;
}

html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-media-mute-orb {
  border-color: rgba(var(--style-matrix-orb-left-rgb), 0.68) !important;
  background:
    radial-gradient(circle at 32% 24%, rgba(255, 255, 255, 0.32), transparent 20%),
    radial-gradient(circle at 46% 46%, rgba(var(--style-matrix-orb-left-rgb), 0.84), rgba(var(--style-matrix-orb-right-rgb), 0.54) 48%, rgba(8, 10, 22, 0.98) 100%) !important;
  box-shadow:
    inset 0 0 14px rgba(255, 255, 255, 0.11),
    inset 0 -10px 18px rgba(8, 10, 22, 0.58),
    0 0 18px rgba(var(--style-matrix-orb-left-rgb), 0.46),
    0 0 36px rgba(var(--style-matrix-orb-right-rgb), 0.24) !important;
}

html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-media-mute:hover .interface-media-mute-orb,
html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-media-mute:focus-visible .interface-media-mute-orb {
  border-color: rgba(var(--style-matrix-orb-right-rgb), 0.86) !important;
  box-shadow:
    inset 0 0 16px rgba(255, 255, 255, 0.13),
    inset 0 -10px 18px rgba(8, 10, 22, 0.52),
    0 0 24px rgba(var(--style-matrix-orb-left-rgb), 0.56),
    0 0 46px rgba(var(--style-matrix-orb-right-rgb), 0.28) !important;
}

@media (max-width: 1100px) and (min-width: 900px) {
  html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-playback-status span[data-interface-media-status-text],
  html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-media-toggle {
    font-size: clamp(0.58rem, 0.88vw, 0.68rem) !important;
    letter-spacing: 0.035em !important;
  }
}

@media (max-width: 720px) {
  html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-playback-status span[data-interface-media-status-text],
  html body.winterface-standalone .interface-section.winterface-standalone-interface .interface-core .interface-media-actions .interface-media-toggle {
    font-size: clamp(0.62rem, 2.65vw, 0.76rem) !important;
    letter-spacing: 0.07em !important;
  }
}
/* WInterface DEV media controls: persistent theme override. */
html body #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked,
html body #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked,
html body #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle {
  color: var(--text) !important;
  border-color: rgba(255, 255, 255, 0.13) !important;
  background:
    linear-gradient(145deg, rgba(30, 36, 58, 0.72), rgba(10, 12, 26, 0.52)),
    radial-gradient(circle at 18% 16%, rgba(255, 255, 255, 0.085), transparent 42%),
    radial-gradient(circle at 88% 88%, rgba(var(--style-matrix-orb-left-rgb), 0.075), transparent 50%),
    rgba(255, 255, 255, 0.032) !important;
  box-shadow:
    0 0 0 1px rgba(var(--style-matrix-orb-left-rgb), 0.038),
    0 14px 30px rgba(0, 0, 0, 0.28),
    0 0 18px rgba(var(--style-matrix-orb-left-rgb), 0.075),
    inset 0 0 0 1px rgba(255, 255, 255, 0.055),
    inset 0 0 26px rgba(255, 255, 255, 0.030) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  text-shadow: none !important;
}

html body #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked span[data-interface-media-status-text],
html body #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked span[data-interface-media-status-text],
html body #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle,
html body #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle span {
  color: var(--text) !important;
  font-family: "Space Grotesk", sans-serif !important;
  font-size: clamp(0.62rem, 0.78vw, 0.72rem) !important;
  font-weight: 650 !important;
  letter-spacing: clamp(0.045em, 0.14vw, 0.075em) !important;
  line-height: 1 !important;
  text-transform: none !important;
  text-shadow: none !important;
}

html body #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked::before,
html body #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked::before,
html body #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle::before {
  background: linear-gradient(90deg, transparent, rgba(var(--style-matrix-orb-left-rgb), 0.18), rgba(var(--style-matrix-orb-right-rgb), 0.12), transparent) !important;
  opacity: 0.44 !important;
}

html body #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked::after,
html body #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked::after,
html body #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle::after {
  border-color: rgba(255, 255, 255, 0.055) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.055),
    inset 0 -1px 0 rgba(var(--style-matrix-orb-left-rgb), 0.035) !important;
}

html body #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked:hover,
html body #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked:focus-visible,
html body #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked:hover,
html body #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked:focus-visible,
html body #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle:hover,
html body #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle:focus-visible {
  transform: translateY(-2px) !important;
  border-color: rgba(var(--style-matrix-orb-left-rgb), 0.36) !important;
  background:
    linear-gradient(145deg, rgba(30, 36, 58, 0.72), rgba(10, 12, 26, 0.52)),
    radial-gradient(circle at 18% 16%, rgba(255, 255, 255, 0.090), transparent 42%),
    radial-gradient(circle at 88% 88%, rgba(var(--style-matrix-orb-left-rgb), 0.105), transparent 50%),
    rgba(255, 255, 255, 0.032) !important;
  box-shadow:
    0 0 0 1px rgba(var(--style-matrix-orb-left-rgb), 0.050),
    0 16px 36px rgba(0, 0, 0, 0.30),
    0 0 24px rgba(var(--style-matrix-orb-left-rgb), 0.11),
    inset 0 0 0 1px rgba(255, 255, 255, 0.062),
    inset 0 0 28px rgba(255, 255, 255, 0.035) !important;
}

html body #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status .interface-playback-dot {
  width: 0.50rem !important;
  height: 0.50rem !important;
  background: #fb7185 !important;
  box-shadow:
    0 0 14px rgba(251, 113, 133, 0.78),
    0 0 24px rgba(244, 63, 94, 0.30) !important;
}

html body #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked.interface-playback-is-playing .interface-playback-dot {
  background: #ef4444 !important;
  transform: scale(1.08) !important;
  box-shadow:
    0 0 12px rgba(239, 68, 68, 0.92),
    0 0 28px rgba(239, 68, 68, 0.46),
    0 0 42px rgba(236, 72, 153, 0.22) !important;
}

html body #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked[aria-pressed="true"]:not(.interface-playback-is-playing) .interface-playback-dot,
html body #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked[aria-pressed="true"] .interface-playback-dot {
  background: #4ade80 !important;
  box-shadow:
    0 0 16px rgba(74, 222, 128, 0.82),
    0 0 30px rgba(34, 197, 94, 0.34) !important;
}

/* WInterface DEV volume control: persistent theme override. */
html body #winterface.interface-section .interface-media-mute::before {
  background: radial-gradient(ellipse at center, rgba(var(--style-matrix-orb-left-rgb), 0.38), rgba(var(--style-matrix-orb-right-rgb), 0.20) 42%, transparent 72%) !important;
}

html body #winterface.interface-section .interface-media-mute-stick {
  background:
    linear-gradient(180deg, rgba(248, 250, 252, 0.20), transparent 22%),
    linear-gradient(180deg, rgba(var(--style-matrix-orb-left-rgb), 0.74), rgba(var(--style-matrix-orb-right-rgb), 0.36)) !important;
  border-color: rgba(var(--style-matrix-orb-left-rgb), 0.38) !important;
  box-shadow:
    inset 0 0 9px rgba(248, 250, 252, 0.08),
    0 0 17px rgba(var(--style-matrix-orb-left-rgb), 0.28) !important;
}

html body #winterface.interface-section .interface-media-mute-orb {
  border-color: rgba(var(--style-matrix-orb-left-rgb), 0.68) !important;
  background:
    radial-gradient(circle at 32% 24%, rgba(255, 255, 255, 0.32), transparent 20%),
    radial-gradient(circle at 46% 46%, rgba(var(--style-matrix-orb-left-rgb), 0.84), rgba(var(--style-matrix-orb-right-rgb), 0.54) 48%, rgba(8, 10, 22, 0.98) 100%) !important;
  box-shadow:
    inset 0 0 14px rgba(255, 255, 255, 0.11),
    inset 0 -10px 18px rgba(8, 10, 22, 0.58),
    0 0 18px rgba(var(--style-matrix-orb-left-rgb), 0.46),
    0 0 36px rgba(var(--style-matrix-orb-right-rgb), 0.24) !important;
}

html body #winterface.interface-section .interface-media-mute:hover .interface-media-mute-orb,
html body #winterface.interface-section .interface-media-mute:focus-visible .interface-media-mute-orb {
  border-color: rgba(var(--style-matrix-orb-right-rgb), 0.86) !important;
  box-shadow:
    inset 0 0 16px rgba(255, 255, 255, 0.13),
    inset 0 -10px 18px rgba(8, 10, 22, 0.52),
    0 0 24px rgba(var(--style-matrix-orb-left-rgb), 0.56),
    0 0 46px rgba(var(--style-matrix-orb-right-rgb), 0.28) !important;
}


/* WInterface recorder orb: experimental screen-recording launcher. */
html body #winterface.interface-section .interface-recorder-toggle {
  --interface-recorder-accent: var(--wfo-active-bay-accent, var(--style-matrix-orb-left, #dc1e3a));
  --interface-recorder-accent-rgb: var(--wfo-active-bay-accent-rgb, var(--style-matrix-orb-left-rgb, 220, 30, 58));
  --interface-recorder-accent-soft-rgb: var(--style-matrix-orb-right-rgb, var(--interface-recorder-accent-rgb));
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 1.54rem;
  height: 1.54rem;
  margin-right: 0.36rem;
  padding: 0;
  border: 1px solid rgba(var(--interface-recorder-accent-rgb), 0.68);
  border-radius: 999px;
  background:
    radial-gradient(circle at 34% 28%, rgba(255, 255, 255, 0.18), transparent 30%),
    rgba(8, 10, 22, 0.86);
  box-shadow:
    inset 0 0 9px rgba(255, 255, 255, 0.08),
    0 0 10px rgba(var(--interface-recorder-accent-rgb), 0.32);
  cursor: pointer;
  transition: transform 0.18s ease, filter 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

html body #winterface.interface-section .interface-recorder-toggle:hover,
html body #winterface.interface-section .interface-recorder-toggle:focus-visible {
  transform: translateY(-1px) scale(1.08);
  border-color: rgba(var(--interface-recorder-accent-soft-rgb), 0.88);
  box-shadow:
    inset 0 0 10px rgba(255, 255, 255, 0.12),
    0 0 16px rgba(var(--interface-recorder-accent-rgb), 0.54),
    0 0 30px rgba(var(--interface-recorder-accent-soft-rgb), 0.22);
}

html body #winterface.interface-section .interface-recorder-toggle.is-recording {
  animation: interfaceRecorderPulse 1.08s ease-in-out infinite;
  border-color: rgba(var(--interface-recorder-accent-soft-rgb), 0.96);
}

html body #winterface.interface-section .interface-recorder-orb {
  width: 0.54rem;
  height: 0.54rem;
  border-radius: 999px;
  background: var(--interface-recorder-accent);
  box-shadow: 0 0 7px rgba(var(--interface-recorder-accent-rgb), 0.70);
}

html body #winterface.interface-section .interface-recorder-toggle.is-recording .interface-recorder-orb {
  background: var(--interface-recorder-accent);
  box-shadow:
    0 0 8px rgba(var(--interface-recorder-accent-rgb), 0.95),
    0 0 18px rgba(var(--interface-recorder-accent-soft-rgb), 0.72);
}


/* Recorder orb theme accents: keep the center dot visible in muted visual skins. */
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-recorder-toggle {
  --interface-recorder-accent: #64748b;
  --interface-recorder-accent-rgb: 100, 116, 139;
  --interface-recorder-accent-soft-rgb: 203, 213, 225;
}

html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-recorder-toggle {
  --interface-recorder-accent: #38bdf8;
  --interface-recorder-accent-rgb: 56, 189, 248;
  --interface-recorder-accent-soft-rgb: 125, 211, 252;
}

html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-recorder-toggle .interface-recorder-orb,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-recorder-toggle.is-recording .interface-recorder-orb {
  background:
    radial-gradient(circle at 34% 28%, rgba(255, 255, 255, 0.88), transparent 18%),
    radial-gradient(circle at 48% 50%, rgba(125, 211, 252, 0.96), rgba(56, 189, 248, 0.90) 48%, rgba(14, 116, 144, 0.92) 78%) !important;
  border-color: rgba(186, 230, 253, 0.82) !important;
  box-shadow:
    0 0 10px rgba(125, 211, 252, 0.86),
    0 0 24px rgba(56, 189, 248, 0.48),
    0 0 40px rgba(var(--wfo-active-bay-accent-rgb), 0.18) !important;
}

@keyframes interfaceRecorderPulse {
  0%, 100% {
    box-shadow:
      inset 0 0 10px rgba(255, 255, 255, 0.12),
      0 0 16px rgba(var(--interface-recorder-accent-rgb), 0.58),
      0 0 24px rgba(var(--interface-recorder-accent-soft-rgb), 0.32);
  }
  50% {
    box-shadow:
      inset 0 0 13px rgba(255, 255, 255, 0.18),
      0 0 30px rgba(var(--interface-recorder-accent-rgb), 0.95),
      0 0 46px rgba(var(--interface-recorder-accent-soft-rgb), 0.52);
  }
}

/* WInterface recorder panel: isolated browser capture controls. */
.interface-recorder-panel {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  padding: 5.7rem 1.35rem 1.35rem;
  background: rgba(3, 7, 18, 0.36);
  backdrop-filter: blur(8px);
}

.interface-recorder-panel-card {
  width: min(23rem, calc(100vw - 2rem));
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 1rem;
  background: linear-gradient(145deg, rgba(8, 13, 27, 0.96), rgba(13, 18, 34, 0.92));
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.48), inset 0 0 22px rgba(255, 255, 255, 0.04);
  color: rgba(248, 250, 252, 0.94);
  padding: 1rem;
}

.interface-recorder-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.55rem;
}

.interface-recorder-panel-header strong {
  font-family: var(--display-font);
  font-size: 0.82rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.interface-recorder-panel p {
  margin: 0 0 0.82rem;
  color: rgba(203, 213, 225, 0.82);
  font-size: 0.82rem;
  line-height: 1.45;
}

.interface-recorder-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.45rem;
  margin: 0 0 0.9rem;
}

.interface-recorder-tabs button {
  appearance: none;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  color: rgba(226, 232, 240, 0.90);
  cursor: pointer;
  padding: 0.5rem 0.62rem;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.interface-recorder-tabs button.is-active {
  border-color: rgba(255, 84, 104, 0.58);
  background: rgba(160, 18, 38, 0.54);
  color: #ffffff;
  box-shadow: 0 0 18px rgba(255, 45, 80, 0.20);
}

.interface-recorder-tabs button:hover,
.interface-recorder-tabs button:focus-visible {
  border-color: rgba(255, 150, 164, 0.82);
  box-shadow: 0 0 18px rgba(255, 45, 80, 0.26);
  outline: none;
}

.interface-recorder-panel label {
  display: flex;
  align-items: center;
  gap: 0.52rem;
  margin: 0.52rem 0;
  color: rgba(226, 232, 240, 0.90);
  font-size: 0.82rem;
}

.interface-recorder-panel input[type="checkbox"] {
  accent-color: #ef334f;
}

/* WInterface recorder trim panel: simple start/end trim controls. */
.interface-recorder-trim-panel {
  align-items: center;
  justify-content: center;
  padding: 1.35rem;
}

.interface-recorder-trim-card {
  width: min(46rem, calc(100vw - 2rem));
}

.interface-recorder-trim-card video {
  display: block;
  width: 100%;
  max-height: min(52vh, 27rem);
  margin: 0.75rem 0 0.85rem;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 0.8rem;
  background: #000;
  box-shadow: inset 0 0 18px rgba(255, 255, 255, 0.05), 0 18px 42px rgba(0, 0, 0, 0.36);
}

.interface-recorder-trim-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
  margin: 0.55rem 0 0.7rem;
}

.interface-recorder-trim-fields label {
  display: grid;
  gap: 0.35rem;
  margin: 0;
  color: rgba(226, 232, 240, 0.88);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.interface-recorder-trim-fields input {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 0.65rem;
  background: rgba(2, 6, 16, 0.62);
  color: rgba(248, 250, 252, 0.96);
  padding: 0.55rem 0.62rem;
  font: inherit;
  outline: none;
}

.interface-recorder-trim-fields input:focus-visible {
  border-color: rgba(255, 150, 164, 0.82);
  box-shadow: 0 0 18px rgba(255, 45, 80, 0.22);
}

.interface-recorder-trim-status {
  min-height: 1.25rem;
  color: rgba(203, 213, 225, 0.86);
  font-size: 0.78rem;
  line-height: 1.35;
}

.interface-recorder-actions button:disabled {
  cursor: wait;
  opacity: 0.62;
}

@media (max-width: 640px) {
  .interface-recorder-trim-fields {
    grid-template-columns: 1fr;
  }

  .interface-recorder-trim-card {
    max-height: calc(100vh - 2rem);
    overflow: auto;
  }
}



.interface-recorder-close,
.interface-recorder-actions button {
  appearance: none;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  color: rgba(248, 250, 252, 0.94);
  cursor: pointer;
}

.interface-recorder-close {
  width: 1.8rem;
  height: 1.8rem;
  font-size: 1.1rem;
  line-height: 1;
}

.interface-recorder-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.55rem;
  margin-top: 0.9rem;
}

.interface-recorder-actions button {
  padding: 0.48rem 0.78rem;
  font-size: 0.74rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.interface-recorder-actions button[data-interface-recorder-start] {
  border-color: rgba(255, 84, 104, 0.46);
  background: rgba(160, 18, 38, 0.52);
}

.interface-recorder-close:hover,
.interface-recorder-close:focus-visible,
.interface-recorder-actions button:hover,
.interface-recorder-actions button:focus-visible {
  border-color: rgba(255, 150, 164, 0.82);
  box-shadow: 0 0 18px rgba(255, 45, 80, 0.26);
}

/* Muted WInterface state: desaturate orb color without changing behavior. */
body.winterface-offline #winterface.interface-section .interface-status-orb,
body.winterface-offline #winterface.interface-section .interface-recorder-toggle,
body.winterface-offline #winterface.interface-section .interface-set-button::before,
body.winterface-offline #winterface.interface-section .interface-playback-dot,
body.winterface-offline #winterface.interface-section .interface-media-mute-orb,
body.winterface-offline #winterface.interface-section .interface-theme-toggle::before,
body.winterface-offline #winterface.interface-section .interface-theme-toggle::after {
  filter: grayscale(1) saturate(0.14) brightness(0.82) !important;
  opacity: 0.70 !important;
}


/* WInterface Solo v4.0 expanded/snap left-rail alignment adjustment.
   Scope: standalone Expanded/Snap media view only.
   Nudges the adjustmented left rail controls and media cards left so the seventh bay orb does not crowd the right rail edge. */
@media (min-width: 900px) {
  body.winterface-standalone .interface-section.winterface-standalone-interface.interface-system-media-expanded .interface-rail {
    overflow-x: hidden !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface.interface-system-media-expanded .interface-rail-header,
  body.winterface-standalone .interface-section.winterface-standalone-interface.interface-system-media-expanded .interface-path-list {
    transform: translateX(-0.52rem) !important;
    width: calc(100% - 0.52rem) !important;
    max-width: calc(100% - 0.52rem) !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface.interface-system-media-expanded .interface-path {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* WInterface Solo v4.0 expanded/snap compact bay label.
   Scope: standalone Expanded/Snap media view only when the seven-orb stack is active. */
@media (min-width: 900px) {
  body.winterface-standalone .interface-section.winterface-standalone-interface.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header > div:first-child {
    flex: 0 0 2.85rem !important;
    width: 2.85rem !important;
    max-width: 2.85rem !important;
    min-width: 2.85rem !important;
    text-align: left !important;
    transform: translateX(0.34rem) !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-label,
  body.winterface-standalone .interface-section.winterface-standalone-interface.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-subtitle {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
    line-height: 1.05 !important;
    text-transform: none !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-label {
    font-size: 0.60rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
    color: var(--interface-accent-text, var(--interface-accent, var(--cyan))) !important;
    text-shadow:
      0 0 9px rgba(var(--interface-accent-rgb, 56, 189, 248), 0.62),
      0 0 24px rgba(var(--interface-accent-rgb, 56, 189, 248), 0.22) !important;
  }

  body.winterface-standalone .interface-section.winterface-standalone-interface.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-subtitle {
    margin-top: 0.15rem !important;
    font-size: 0.58rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.01em !important;
    color: rgba(199, 210, 254, 0.76) !important;
    text-shadow: none !important;
  }
}

/* WInterface Solo v4.0 expanded/snap seven-orb header containment.
   Scope: only the compact expanded bay-label state used by the seven-orb stack. */
@media (min-width: 900px) {
  body.winterface-standalone .interface-section.winterface-standalone-interface.interface-system-media-expanded.interface-system-compact-bay-label .interface-set-controls {
    transform: translateX(-0.66rem) !important;
  }
}

/* WInterface Solo v4.0 command cursor + DW preadjustment theme-color sync.
   Keeps the blinking command-interface oval and DW:// preadjustment tied to the active Style Matrix theme color. */
html body #winterface.interface-section .interface-command-line .interface-cursor,
html body #winterface.interface-section[class*="interface-system-set-"] .interface-command-line .interface-cursor {
  background: var(--style-matrix-orb-left, var(--interface-accent, var(--cyan))) !important;
  box-shadow:
    0 0 12px rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.94),
    0 0 26px rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.46),
    0 0 44px rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.22) !important;
}

html body #winterface.interface-section .interface-command-line .interface-command-prefix,
html body #winterface.interface-section[class*="interface-system-set-"] .interface-command-line .interface-command-prefix {
  color: var(--style-matrix-orb-left, var(--interface-accent, var(--cyan))) !important;
  text-shadow:
    0 0 10px rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.82),
    0 0 22px rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.34) !important;
}

/* WInterface Solo v4.0 muted status accent tone-down.
   Scope: muted WInterface only. Keeps active theme hue, reduces brightness/glow for right-panel status accents. */
body.winterface-offline #winterface.interface-section .interface-side-panel .interface-output-label,
body.winterface-offline #winterface.interface-section[class*="interface-system-set-"] .interface-side-panel .interface-output-label {
  color: rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.50) !important;
  text-shadow:
    0 1px 2px rgba(0, 0, 0, 0.72),
    0 0 8px rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.22) !important;
}

body.winterface-offline #winterface.interface-section .interface-side-panel .interface-system-list li::before,
body.winterface-offline #winterface.interface-section[class*="interface-system-set-"] .interface-side-panel .interface-system-list li::before {
  background: rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.50) !important;
  box-shadow:
    0 0 7px rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.28),
    0 0 14px rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.12) !important;
}

/* === WInterface Solo v4.0 DEV Expanded Orb Row Clean Targeted Adjustment ===
   Scope: DEV page only, Expanded/Snap media view only.
   Keeps the root Solo page unchanged and shifts only the adjustmented seven-orb stack left. */
@media (min-width: 900px) {
  body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label:not(.is-winterface-maximized) .interface-rail-header .interface-set-controls {
    transform: translateX(-1.35rem) !important;
  }
}
/* === WInterface Solo v4.0 DEV Expanded Orb Row Clean Targeted Adjustment === */


/* === WInterface Solo v4.0 DEV WF Fullscreen Expanded Header Match ===
   Scope: DEV page only, WF fullscreen + Expanded/Snap media view only.
   Matches the regular Solo expanded header: BAY # on one line, subtitle below, and contained seven-orb row. */
@media (min-width: 900px) {
  body.winterface-dev-build #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label.is-winterface-maximized .interface-rail-header > div:first-child {
    flex: 0 0 3.95rem !important;
    width: 3.95rem !important;
    min-width: 3.95rem !important;
    max-width: 3.95rem !important;
    transform: none !important;
  }

  body.winterface-dev-build #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label.is-winterface-maximized .interface-rail-label,
  body.winterface-dev-build #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label.is-winterface-maximized .interface-rail-subtitle {
    width: auto !important;
    max-width: none !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
  }

  body.winterface-dev-build #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label.is-winterface-maximized .interface-rail-label {
    font-size: 0.60rem !important;
    line-height: 1.05 !important;
  }

  body.winterface-dev-build #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label.is-winterface-maximized .interface-rail-subtitle {
    margin-top: 0.16rem !important;
    font-size: 0.66rem !important;
    line-height: 1.08 !important;
  }

  body.winterface-dev-build #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label.is-winterface-maximized .interface-rail-header .interface-set-controls {
    position: relative !important;
    left: -2.30rem !important;
    transform: none !important;
  }
}
/* === WInterface Solo v4.0 DEV WF Fullscreen Expanded Header Match === */

/* === WInterface Solo v4.0 DEV WF Fullscreen Expanded Menu Containment Adjustment ===
   Scope: DEV page only, WF fullscreen + Expanded/Snap media view only.
   Keeps the menu cards inside the DEV fullscreen rail without changing the root Solo page. */
@media (min-width: 900px) {
  body.winterface-dev-build #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label.is-winterface-maximized .interface-path-list {
    transform: translateX(-0.70rem) !important;
    width: calc(100% - 1.72rem) !important;
    max-width: calc(100% - 1.72rem) !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  body.winterface-dev-build #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label.is-winterface-maximized .interface-path {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  body.winterface-dev-build #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label.is-winterface-maximized .interface-path:hover,
  body.winterface-dev-build #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label.is-winterface-maximized .interface-path:focus-visible,
  body.winterface-dev-build #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label.is-winterface-maximized .interface-path.is-active {
    transform: translateX(0) !important;
  }
}
/* === WInterface Solo v4.0 DEV WF Fullscreen Expanded Menu Containment Adjustment === */

/* === WInterface v4.0 Right Panel Live Systems Flex Dock ===
   Scope: right-side Live Systems card only.
   Keeps the heading/list top-aligned and lets the Bay / Back / Next controller
   settle at the bottom of the same card when extra vertical space exists.
   Includes standalone live and DEV page scopes. */
body.winterface-standalone #winterface .interface-side-panel .interface-output-card-soft,
body.winterface-dev-build #winterface .interface-side-panel .interface-output-card-soft {
  display: flex !important;
  flex-direction: column !important;
}

body.winterface-standalone #winterface .interface-side-panel .interface-output-card-soft .interface-output-label,
body.winterface-standalone #winterface .interface-side-panel .interface-output-card-soft .interface-system-list,
body.winterface-dev-build #winterface .interface-side-panel .interface-output-card-soft .interface-output-label,
body.winterface-dev-build #winterface .interface-side-panel .interface-output-card-soft .interface-system-list {
  flex: 0 0 auto !important;
}

body.winterface-standalone #winterface .interface-side-panel .interface-output-card-soft .interface-signal-pulse,
body.winterface-dev-build #winterface .interface-side-panel .interface-output-card-soft .interface-signal-pulse {
  flex: 0 0 auto !important;
  margin-top: auto !important;
}
/* === WInterface v4.0 Right Panel Live Systems Flex Dock === */

/* === WInterface v4.0 Tablet Fullscreen Expanded Card Nav Centering ===
   Scope: tablet/fullscreen-sized Expanded/Snap WInterface only.
   Shifts only the left rail card navigation stack slightly right so the cards sit
   more centered in the rail without resizing or touching orb/header controls. */
@media (min-width: 900px) and (max-width: 1700px) and (min-height: 760px) {
  body.winterface-standalone #winterface.interface-section.winterface-standalone-interface.interface-system-media-expanded.is-winterface-maximized .interface-path-list {
    transform: translateX(0.18rem) !important;
  }

  body.winterface-dev-build #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label.is-winterface-maximized .interface-path-list {
    transform: translateX(0.18rem) !important;
  }
}
/* === WInterface v4.0 Tablet Fullscreen Expanded Card Nav Centering === */

/* === WInterface v4.0 Command Bar Hide Toggle ===
   Scope: top-left WInterface status pill and command-row collapse only.
   Keeps the existing visual-style orb as its own button, adds a matching
   command-bar orb inside the right side of the same WInterface status oval,
   and hides/restores the command bar without disabling command logic. */
body.winterface-standalone #winterface .interface-system-status-pill,
body.winterface-dev-build #winterface .interface-system-status-pill {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.56rem !important;
  padding: 0.50rem 0.88rem !important;
  cursor: default !important;
  overflow: hidden !important;
}

body.winterface-standalone #winterface .interface-system-status-pill > [data-interface-system-status-text],
body.winterface-dev-build #winterface .interface-system-status-pill > [data-interface-system-status-text] {
  flex: 0 1 auto !important;
  min-width: 0 !important;
  white-space: nowrap !important;
}

body.winterface-standalone #winterface .interface-system-orb-toggle,
body.winterface-dev-build #winterface .interface-system-orb-toggle,
body.winterface-standalone #winterface .interface-commandbar-toggle,
body.winterface-dev-build #winterface .interface-commandbar-toggle {
  position: relative !important;
  z-index: 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 1.35rem !important;
  width: 1.35rem !important;
  height: 1.35rem !important;
  min-width: 1.35rem !important;
  min-height: 1.35rem !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: inherit !important;
  cursor: pointer !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

body.winterface-standalone #winterface .interface-system-orb-toggle i,
body.winterface-dev-build #winterface .interface-system-orb-toggle i,
body.winterface-standalone #winterface .interface-commandbar-toggle i,
body.winterface-dev-build #winterface .interface-commandbar-toggle i {
  position: relative !important;
  display: block !important;
  width: 0.62rem !important;
  height: 0.62rem !important;
  border-radius: 50% !important;
}

body.winterface-standalone #winterface .interface-commandbar-toggle i,
body.winterface-dev-build #winterface .interface-commandbar-toggle i {
  background: var(--style-matrix-orb-left, var(--interface-accent, var(--cyan))) !important;
  box-shadow:
    0 0 10px rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.90),
    0 0 24px rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.48),
    0 0 42px rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.22) !important;
}

body.winterface-standalone #winterface .interface-commandbar-toggle i::after,
body.winterface-dev-build #winterface .interface-commandbar-toggle i::after {
  background: radial-gradient(circle, rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.30), rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.12) 38%, transparent 70%) !important;
}

body.winterface-standalone #winterface .interface-system-orb-toggle:hover,
body.winterface-standalone #winterface .interface-system-orb-toggle:focus-visible,
body.winterface-standalone #winterface .interface-commandbar-toggle:hover,
body.winterface-standalone #winterface .interface-commandbar-toggle:focus-visible,
body.winterface-dev-build #winterface .interface-system-orb-toggle:hover,
body.winterface-dev-build #winterface .interface-system-orb-toggle:focus-visible,
body.winterface-dev-build #winterface .interface-commandbar-toggle:hover,
body.winterface-dev-build #winterface .interface-commandbar-toggle:focus-visible {
  outline: none !important;
  transform: translateY(-1px) !important;
}

body.winterface-commandbar-hidden #winterface .interface-commandbar-toggle i {
  background: #ef4444 !important;
  box-shadow:
    0 0 10px rgba(239, 68, 68, 0.88),
    0 0 22px rgba(239, 68, 68, 0.46),
    0 0 38px rgba(239, 68, 68, 0.22) !important;
}

body.winterface-commandbar-hidden #winterface .interface-commandbar-toggle i::after {
  background: radial-gradient(circle, rgba(239, 68, 68, 0.28), rgba(239, 68, 68, 0.10) 38%, transparent 70%) !important;
}

body.winterface-commandbar-hidden #winterface .interface-command-line {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

body.winterface-commandbar-hidden #winterface.interface-system-is-media .interface-media-frame-shell,
body.winterface-commandbar-hidden #winterface.interface-system-media-expanded .interface-media-frame-shell {
  aspect-ratio: 16 / 9 !important;
  overflow: visible !important;
}

body.winterface-commandbar-hidden #winterface.interface-system-is-media .interface-showcase-frame:not([hidden]),
body.winterface-commandbar-hidden #winterface.interface-system-is-media .interface-video-frame:not([hidden]),
body.winterface-commandbar-hidden #winterface.interface-system-media-expanded .interface-showcase-frame:not([hidden]),
body.winterface-commandbar-hidden #winterface.interface-system-media-expanded .interface-video-frame:not([hidden]) {
  position: absolute !important;
  inset: auto 0 0 0 !important;
  height: calc(100% + clamp(2.15rem, 2.6vw, 3.05rem)) !important;
  aspect-ratio: auto !important;
  max-height: none !important;
}

@media (min-width: 900px) {
  body.winterface-commandbar-hidden #winterface.interface-system-media-expanded.is-winterface-maximized .interface-media-frame-shell {
    aspect-ratio: 16 / 9 !important;
    max-height: min(56vh, 620px) !important;
    overflow: visible !important;
  }

  body.winterface-commandbar-hidden #winterface.interface-system-media-expanded.is-winterface-maximized .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden #winterface.interface-system-media-expanded.is-winterface-maximized .interface-video-frame:not([hidden]) {
    height: calc(100% + clamp(3.45rem, 3.8vw, 4.45rem)) !important;
    max-height: none !important;
  }
}
/* === WInterface v4.0 Command Bar Hide Toggle === */
/* === WInterface v4.0 Command Bar Hidden Expanded Width Fill ===
   Scope: command bar hidden + Expanded/Snap fullscreen only.
   Keeps the player left/bottom anchored and extends only its width to the right
   so the hidden-command-bar expanded view fills the center container cleanly. */
@media (min-width: 900px) {
  body.winterface-commandbar-hidden #winterface.interface-system-media-expanded.is-winterface-maximized .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden #winterface.interface-system-media-expanded.is-winterface-maximized .interface-video-frame:not([hidden]) {
    inset: auto auto 0 0 !important;
    width: calc(100% + clamp(12rem, 22vw, 24rem)) !important;
    max-width: none !important;
  }
}
/* === WInterface v4.0 Command Bar Hidden Expanded Width Fill === */


/* === WInterface v4.0 F11 Hidden Command-Bar Media Containment ===
   Scope: desktop Chrome/F11-sized WInterface with command bar hidden.
   Keeps the existing upward player-growth logic, but prevents the media frame
   from extending past the middle container horizontally. */
@media (min-width: 1200px) and (min-height: 700px) {
  body.winterface-commandbar-hidden #winterface.is-winterface-maximized.interface-system-is-media .interface-media-frame-shell,
  body.winterface-commandbar-hidden #winterface.is-winterface-maximized.interface-system-media-expanded .interface-media-frame-shell {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }

  body.winterface-commandbar-hidden #winterface.is-winterface-maximized.interface-system-is-media .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden #winterface.is-winterface-maximized.interface-system-is-media .interface-video-frame:not([hidden]),
  body.winterface-commandbar-hidden #winterface.is-winterface-maximized.interface-system-media-expanded .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden #winterface.is-winterface-maximized.interface-system-media-expanded .interface-video-frame:not([hidden]) {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
}
/* === WInterface v4.0 F11 Hidden Command-Bar Media Containment === */

/* === WInterface v4.0 F11 Expanded Card Nav Micro Shift ===
   Scope: desktop Chrome/F11-sized Expanded/Snap WInterface only.
   Shifts only the 01-06 card stack a little further left inside the existing left rail
   to prevent right-edge overflow without changing the rail, orb row, or media layout. */
@media (min-width: 1200px) and (min-height: 700px) {
  body.winterface-standalone #winterface.interface-section.winterface-standalone-interface.interface-system-media-expanded.is-winterface-maximized .interface-path-list,
  body.winterface-dev-build #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label.is-winterface-maximized .interface-path-list {
    transform: translateX(-0.52rem) !important;
  }
}
/* === WInterface v4.0 F11 Expanded Card Nav Micro Shift === */

/* === WInterface v4.0 Solid Black Page Background ===
   Scope: standalone WInterface page shell only.
   Sets the non-WInterface background behind the player to solid black while
   leaving WInterface panels, media controls, themes, content, and layout untouched. */
html,
body.winterface-standalone,
body.winterface-dev-build {
  background: #000 !important;
  background-color: #000 !important;
}

body.winterface-standalone::before,
body.winterface-dev-build::before,
body.winterface-standalone .parallax-background,
body.winterface-dev-build .parallax-background {
  display: none !important;
}
/* === WInterface v4.0 Solid Black Page Background === */

/* === WInterface v4.0 Solid Black Page Background Blue Chrome Slot Sync ===
   Reinforces the page-shell-only black background after Style Matrix theme swaps,
   including the Blue Chrome slot mapped to theme3. Does not change WInterface
   panels, media layout, cards, controls, or content. */
html.winterface-standalone,
html.winterface-maximized,
html[data-winterface-theme="code-green"],
html[data-winterface-theme="blue-chrome"],
html[data-winterface-theme="navy-sky-grey"],
html[data-winterface-theme="default"],
html[data-winterface-theme="code-green"] body.winterface-standalone,
html[data-winterface-theme="blue-chrome"] body.winterface-standalone,
html[data-winterface-theme="navy-sky-grey"] body.winterface-standalone,
html[data-winterface-theme="default"] body.winterface-standalone,
body.winterface-standalone,
body.winterface-dev-build,
body.winterface-standalone #main-content,
body.winterface-dev-build #main-content {
  background: #000 !important;
  background-color: #000 !important;
  background-image: none !important;
}

html[data-winterface-theme="code-green"] body.winterface-standalone::before,
html[data-winterface-theme="code-green"] body.winterface-standalone::after,
html[data-winterface-theme="code-green"] body.winterface-dev-build::before,
html[data-winterface-theme="code-green"] body.winterface-dev-build::after,
html[data-winterface-theme="code-green"] body.winterface-standalone .parallax-background,
html[data-winterface-theme="code-green"] body.winterface-dev-build .parallax-background,
body.winterface-standalone::before,
body.winterface-standalone::after,
body.winterface-dev-build::before,
body.winterface-dev-build::after,
body.winterface-standalone .parallax-background,
body.winterface-dev-build .parallax-background,
body.winterface-standalone .parallax-layer,
body.winterface-dev-build .parallax-layer {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  background: none !important;
  background-image: none !important;
}
/* === WInterface v4.0 Solid Black Page Background Code Green Sync === */

/* === WInterface v4.0 Main Index Code Green Edge Background Adjustment ===
   Scope: main standalone index page shell only.
   Removes the themed blue/purple edge wash around the WInterface shell in Code Green
   by forcing the adjustmented outer WInterface section background to solid black. */
body.winterface-standalone .interface-section.winterface-standalone-interface {
  background: #000 !important;
  background-color: #000 !important;
  background-image: none !important;
}
/* === WInterface v4.0 Main Index Code Green Edge Background Adjustment === */

/* === WInterface v4.0 Tablet Hide Controls Experiment ===
   Scope: standalone tablet/large-widescreen standard view only.
   Adds a small glass control below the media row that can collapse the middle
   media controls and let the video frame stretch downward into the open gap.
   Expanded/Snap view automatically restores the normal control layout in JS. */
body.winterface-standalone #winterface .interface-media-controls-toggle,
body.winterface-dev-build #winterface .interface-media-controls-toggle {
  display: none;
  justify-self: center;
  align-items: center;
  justify-content: center;
  min-width: clamp(7.8rem, 12vw, 10.5rem);
  min-height: clamp(1.55rem, 2.1vw, 1.9rem);
  padding: 0.34rem 1.05rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.13);
  color: var(--text);
  background:
    linear-gradient(145deg, rgba(30, 36, 58, 0.66), rgba(10, 12, 26, 0.50)),
    radial-gradient(circle at 18% 16%, rgba(255, 255, 255, 0.075), transparent 42%),
    radial-gradient(circle at 88% 88%, rgba(var(--style-matrix-orb-left-rgb), 0.075), transparent 50%),
    rgba(255, 255, 255, 0.030);
  box-shadow:
    0 0 0 1px rgba(var(--style-matrix-orb-left-rgb), 0.036),
    0 12px 26px rgba(0, 0, 0, 0.26),
    0 0 18px rgba(var(--style-matrix-orb-left-rgb), 0.075),
    inset 0 0 0 1px rgba(255, 255, 255, 0.052),
    inset 0 0 22px rgba(255, 255, 255, 0.028);
  font-family: "Space Grotesk", sans-serif;
  font-size: clamp(0.56rem, 0.72vw, 0.66rem);
  font-weight: 650;
  letter-spacing: clamp(0.045em, 0.13vw, 0.075em);
  line-height: 1;
  text-transform: none;
  text-shadow: none;
  cursor: pointer;
  opacity: 0;
  transform: translateY(-0.1rem) scale(0.985);
  transition:
    opacity 0.22s ease,
    transform 0.22s ease,
    border-color 0.22s ease,
    box-shadow 0.22s ease,
    background 0.22s ease;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

body.winterface-standalone #winterface .interface-media-controls-toggle:hover,
body.winterface-standalone #winterface .interface-media-controls-toggle:focus-visible,
body.winterface-dev-build #winterface .interface-media-controls-toggle:hover,
body.winterface-dev-build #winterface .interface-media-controls-toggle:focus-visible {
  border-color: rgba(var(--style-matrix-orb-left-rgb), 0.36);
  box-shadow:
    0 0 0 1px rgba(var(--style-matrix-orb-left-rgb), 0.070),
    0 14px 28px rgba(0, 0, 0, 0.30),
    0 0 22px rgba(var(--style-matrix-orb-left-rgb), 0.16),
    inset 0 0 0 1px rgba(255, 255, 255, 0.07),
    inset 0 0 24px rgba(255, 255, 255, 0.034);
  transform: translateY(-1.08rem) scale(1);
}

body.winterface-standalone #winterface .interface-media-actions,
body.winterface-dev-build #winterface .interface-media-actions,
body.winterface-standalone #winterface .interface-media-frame-shell,
body.winterface-dev-build #winterface .interface-media-frame-shell,
body.winterface-standalone #winterface .interface-showcase-frame,
body.winterface-dev-build #winterface .interface-showcase-frame,
body.winterface-standalone #winterface .interface-video-frame,
body.winterface-dev-build #winterface .interface-video-frame {
  transition:
    opacity 0.24s ease,
    transform 0.24s ease,
    max-height 0.30s ease,
    height 0.30s ease,
    aspect-ratio 0.30s ease;
}

@media (min-width: 900px) and (min-height: 660px) {
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
    display: inline-flex;
    opacity: 1;
    transform: translateY(-0.98rem) scale(1);
  }

  body.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-actions,
  body.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-actions {
    max-height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    opacity: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
    transform: translateY(-0.38rem) scale(0.985) !important;
  }

  body.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]),
  body.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]) {
    aspect-ratio: auto !important;
    height: min(57vh, calc(100dvh - clamp(16rem, 27vh, 22rem))) !important;
    max-height: min(57vh, 35rem) !important;
    min-height: clamp(22rem, 41vh, 29rem) !important;
  }
}

@media (max-width: 899px), (max-height: 659px) {
  body.winterface-media-controls-hidden.winterface-standalone,
  body.winterface-media-controls-hidden.winterface-dev-build {
    /* State may remain briefly during resize, but the feature stays visually inert. */
  }
}
/* === WInterface v4.0 Tablet Hide Controls Experiment === */
/* === WInterface v4.0 Tablet Hide Controls + Hidden Command Bar Correction ===
   Scope: intentionally left inert after rollback.
   The command-bar-hidden player rule should remain dominant when Hide Controls
   is also active, so the media frame keeps its bottom anchor and grows upward
   exactly like normal command-bar-hidden standard view. */
/* === WInterface v4.0 Tablet Hide Controls + Hidden Command Bar Correction === */


/* === WInterface v4.0 Tablet Hide Controls + Hidden Command Bar Upfill Match ===
   Scope: tablet/large-widescreen standard media view only.
   When Hide Controls is active and the command bar is hidden, preserve the good
   lower edge from normal Hide Controls view while extending the media frame upward
   into the space released by the hidden command bar. */
@media (min-width: 900px) and (min-height: 660px) {
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-frame-shell,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-frame-shell {
    aspect-ratio: auto !important;
    overflow: visible !important;
  }

  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]) {
    position: relative !important;
    inset: auto !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    aspect-ratio: auto !important;
    height: calc(min(57vh, calc(100dvh - clamp(16rem, 27vh, 22rem))) + clamp(3.15rem, 4vw, 4.1rem)) !important;
    max-height: none !important;
    min-height: calc(clamp(22rem, 41vh, 29rem) + clamp(3.15rem, 4vw, 4.1rem)) !important;
    transform: translateY(calc(-1 * clamp(3.15rem, 4vw, 4.1rem))) !important;
    box-sizing: border-box !important;
  }
}
/* === WInterface v4.0 Tablet Hide Controls + Hidden Command Bar Upfill Match === */

/* === WInterface v4.0 Tablet Hide Controls + Command Bar Button Visibility Adjustment ===
   Scope: tablet/large-widescreen standard media view only.
   Preserves the upfill-match2 media geometry while keeping the Show Controls
   button visible and accessible when the command bar and media controls are both hidden. */
@media (min-width: 900px) and (min-height: 660px) {
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-frame-shell,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-frame-shell {
    position: relative !important;
    z-index: 1 !important;
  }

  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
    display: inline-flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: relative !important;
    z-index: 20 !important;
    transform: translateY(-0.98rem) scale(1) !important;
  }
}
/* === WInterface v4.0 Tablet Hide Controls + Command Bar Button Visibility Adjustment === */

/* === WInterface v4.0 Tablet Hide Controls + Command Bar Button Clearance Adjustment ===
   Scope: tablet/large-widescreen standard media view only.
   Keeps the command-bar-hidden + Hide Controls upfill geometry while preventing
   the enlarged media frame from consuming the Show Controls button row. */
@media (min-width: 900px) and (min-height: 660px) {
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]) {
    margin-bottom: calc(-1 * clamp(3.15rem, 4vw, 4.1rem)) !important;
  }

  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
    margin-top: clamp(0.42rem, 0.8vw, 0.72rem) !important;
  }
}
/* === WInterface v4.0 Tablet Hide Controls + Command Bar Button Clearance Adjustment === */

/* === WInterface v4.0 Tablet Hide Controls Button Position Lock ===
   Keeps the Hide Controls / Show Controls oval in the same visual slot across
   eligible large-screen standard-view states. This preserves the accepted media
   frame geometry and only normalizes the button row positioning. */
@media (min-width: 900px) and (min-height: 660px) {
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    position: relative !important;
    z-index: 20 !important;
    transform: translateY(-0.98rem) scale(1) !important;
  }

  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible {
    transform: translateY(-0.98rem) scale(1) !important;
  }
}
/* === WInterface v4.0 Tablet Hide Controls Button Position Lock === */

/* === WInterface v4.0 Tablet Hide Controls Command-Bar Hidden No-Bounce Adjustment ===
   Scope: tablet/large-widescreen standard media view only.
   Preserves the accepted Hide Controls / Show Controls visual slot while removing
   the frame height/transform interpolation that made the oval bounce when the
   command bar was already hidden. */
@media (min-width: 900px) and (min-height: 660px) {
  body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
    position: relative !important;
    z-index: 24 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    transform: translateY(-0.98rem) scale(1) !important;
    transition:
      opacity 0.14s ease,
      border-color 0.14s ease,
      box-shadow 0.14s ease,
      background 0.14s ease !important;
    transform-origin: center center !important;
    backface-visibility: hidden !important;
    -webkit-backface-visibility: hidden !important;
  }

  body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active,
  body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active {
    transform: translateY(-0.98rem) scale(1) !important;
  }

  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-frame-shell,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-frame-shell,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]) {
    transition: opacity 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease !important;
  }
}
/* === WInterface v4.0 Tablet Hide Controls Command-Bar Hidden No-Bounce Adjustment === */

/* === WInterface v4.0 Tablet Hide Controls Command-Bar Show No-Bounce Adjustment ===
   Scope: tablet/large-widescreen standard media view only.
   When the command bar is hidden and Show Controls is clicked, temporarily
   suppress media-frame interpolation so the player does not bounce upward. */
@media (min-width: 900px) and (min-height: 660px) {
  body.winterface-media-controls-transition-lock.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-frame-shell,
  body.winterface-media-controls-transition-lock.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-frame-shell,
  body.winterface-media-controls-transition-lock.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-media-controls-transition-lock.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]),
  body.winterface-media-controls-transition-lock.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-media-controls-transition-lock.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]) {
    transition: none !important;
  }
}
/* === WInterface v4.0 Tablet Hide Controls Command-Bar Show No-Bounce Adjustment === */


/* === WInterface v4.0 Global Container-Safe Hide Controls Support ===
   Extends the accepted Hide Controls / Show Controls behavior beyond the original
   tablet/large-widescreen media query. The feature remains standard-view-only and
   is constrained to the middle media column so the media frame, controls, and
   toggle cannot escape their container on smaller or shorter screens. */
@media (max-width: 899px), (max-height: 659px) {
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-panel:not([hidden]),
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-panel:not([hidden]) {
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-frame-shell,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-frame-shell,
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]),
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]) {
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
    display: inline-flex !important;
    opacity: 1 !important;
    justify-self: center !important;
    align-self: center !important;
    max-width: min(92%, 10.5rem) !important;
    min-width: min(7.8rem, 86%) !important;
    min-height: clamp(1.45rem, 3.2vw, 1.82rem) !important;
    padding-inline: clamp(0.72rem, 2.6vw, 1.05rem) !important;
    transform: translateY(-0.72rem) scale(1) !important;
    margin: 0 !important;
    position: relative !important;
    z-index: 24 !important;
  }

  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active {
    transform: translateY(-0.72rem) scale(1) !important;
  }

  body.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-actions,
  body.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-actions {
    max-height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    opacity: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
    transform: translateY(-0.28rem) scale(0.99) !important;
  }

  body.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]),
  body.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]) {
    aspect-ratio: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: clamp(12rem, 48dvh, 31rem) !important;
    max-height: calc(100dvh - clamp(11rem, 30dvh, 18rem)) !important;
    min-height: min(clamp(11.5rem, 34dvh, 22rem), calc(100dvh - 12rem)) !important;
    box-sizing: border-box !important;
  }

  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-frame-shell,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-frame-shell {
    aspect-ratio: auto !important;
    overflow: visible !important;
  }

  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]) {
    position: relative !important;
    inset: auto !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    aspect-ratio: auto !important;
    height: min(calc(clamp(12rem, 48dvh, 31rem) + clamp(2.05rem, 5.2vw, 3.35rem)), calc(100dvh - clamp(8.8rem, 24dvh, 15.5rem))) !important;
    max-height: calc(100dvh - clamp(8.8rem, 24dvh, 15.5rem)) !important;
    min-height: min(calc(clamp(11.5rem, 34dvh, 22rem) + clamp(2.05rem, 5.2vw, 3.35rem)), calc(100dvh - 10rem)) !important;
    transform: translateY(calc(-1 * clamp(2.05rem, 5.2vw, 3.35rem))) !important;
    margin-bottom: calc(-1 * clamp(2.05rem, 5.2vw, 3.35rem)) !important;
    box-sizing: border-box !important;
  }

  body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
    transform: translateY(-0.72rem) scale(1) !important;
    transition:
      opacity 0.14s ease,
      border-color 0.14s ease,
      box-shadow 0.14s ease,
      background 0.14s ease !important;
    transform-origin: center center !important;
    backface-visibility: hidden !important;
    -webkit-backface-visibility: hidden !important;
  }

  body.winterface-media-controls-transition-lock.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-frame-shell,
  body.winterface-media-controls-transition-lock.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-frame-shell,
  body.winterface-media-controls-transition-lock.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-media-controls-transition-lock.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]),
  body.winterface-media-controls-transition-lock.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-media-controls-transition-lock.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]) {
    transition: none !important;
  }
}
/* === WInterface v4.0 Global Container-Safe Hide Controls Support === */


/* === WInterface v4.0 Global Hide Controls Screen-Fit Adjustment ===
   Adjustmentes two standard-view edge cases introduced by the global Hide Controls rule:
   1) On 1080p-style heights, the Hide Controls / Show Controls oval is clamped
      slightly upward so it cannot clip against the middle container bottom.
   2) On ultrawide layouts, hiding controls keeps the video from shrinking by
      lifting the restrictive 35rem cap and allowing the frame to downfill. */
@media (min-width: 900px) and (min-height: 660px) and (max-height: 920px) {
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
    transform: translateY(-1.34rem) scale(1) !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active {
    transform: translateY(-1.34rem) scale(1) !important;
  }
}

@media (min-width: 1600px) and (min-height: 800px) and (min-aspect-ratio: 19/10) {
  body.winterface-media-controls-hidden:not(.winterface-commandbar-hidden).winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-media-controls-hidden:not(.winterface-commandbar-hidden).winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]),
  body.winterface-media-controls-hidden:not(.winterface-commandbar-hidden).winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-media-controls-hidden:not(.winterface-commandbar-hidden).winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]) {
    aspect-ratio: auto !important;
    height: min(61dvh, calc(100dvh - clamp(15.5rem, 24vh, 21rem))) !important;
    max-height: min(61dvh, calc(100dvh - clamp(15.5rem, 24vh, 21rem))) !important;
    min-height: min(57dvh, calc(100dvh - clamp(17rem, 28vh, 23rem))) !important;
    box-sizing: border-box !important;
  }
}
/* === WInterface v4.0 Global Hide Controls Screen-Fit Adjustment === */

/* === WInterface v4.0 Hide Controls Screen-Fit Refinement ===
   Scope: standard media view only.
   1) Gives the Hide/Show Controls oval a slightly stronger upward clamp on
      shorter desktop-height layouts so it cannot clip the middle container.
   2) On ultrawide layouts with the command bar hidden but media controls still
      visible, preserves the large player feel while reserving clearance for the
      media-control row so the player cannot cover it. */
@media (min-width: 900px) and (min-height: 660px) and (max-height: 920px) {
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
    transform: translateY(-1.58rem) scale(1) !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active {
    transform: translateY(-1.58rem) scale(1) !important;
  }
}

@media (min-width: 1600px) and (min-height: 800px) and (min-aspect-ratio: 19/10) {
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]),
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]) {
    bottom: clamp(2.85rem, 3.55vw, 3.55rem) !important;
    height: calc(100% + clamp(3.45rem, 4.2vw, 4.35rem) - clamp(2.85rem, 3.55vw, 3.55rem)) !important;
    max-height: none !important;
    box-sizing: border-box !important;
  }
}
/* === WInterface v4.0 Hide Controls Screen-Fit Refinement === */

/* === WInterface v4.0 Hide Controls Screen-Fit Refinement 2 ===
   Targeted follow-up for the global Hide Controls support:
   1) Remove all hover/active vertical bounce from the Hide/Show Controls oval
      so the accepted adjustmented slot cannot clip on 1080p-height displays.
   2) On ultrawide command-bar-hidden standard view with media controls visible,
      preserve the prior player sizing and lift the controls/button into the
      available safe area instead of resizing the media frame. */
@media (min-width: 900px) and (min-height: 660px) {
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
    transition:
      opacity 0.14s ease,
      border-color 0.14s ease,
      box-shadow 0.14s ease,
      background 0.14s ease !important;
    transform-origin: center center !important;
    backface-visibility: hidden !important;
    -webkit-backface-visibility: hidden !important;
  }

  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active {
    transform: translateY(-0.98rem) scale(1) !important;
  }
}

@media (min-width: 900px) and (min-height: 660px) and (max-height: 920px) {
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active {
    transform: translateY(-1.58rem) scale(1) !important;
  }
}

@media (max-width: 899px), (max-height: 659px) {
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active {
    transform: translateY(-0.72rem) scale(1) !important;
  }
}

@media (min-width: 1600px) and (min-height: 800px) and (min-aspect-ratio: 19/10) {
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-actions,
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-actions {
    position: relative !important;
    z-index: 32 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    transform: translateY(calc(-1 * clamp(1.55rem, 1.85vw, 2.25rem))) !important;
  }

  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
    position: relative !important;
    z-index: 33 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    transform: translateY(calc(-1 * clamp(1.65rem, 1.95vw, 2.35rem))) scale(1) !important;
  }

  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active,
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active {
    transform: translateY(calc(-1 * clamp(1.65rem, 1.95vw, 2.35rem))) scale(1) !important;
  }
}
/* === WInterface v4.0 Hide Controls Screen-Fit Refinement 2 === */

/* === WInterface v4.0 Hide Controls All-State No-Bounce Lock ===
   Removes vertical hover/active/focus bounce from the Hide Controls / Show Controls
   oval in every standard-view configuration while preserving each mode's accepted
   adjustmented visual slot. */
body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
  --winterface-media-controls-toggle-transform: translateY(-0.98rem) scale(1);
  transform: var(--winterface-media-controls-toggle-transform) !important;
  transition:
    opacity 0.14s ease,
    border-color 0.14s ease,
    box-shadow 0.14s ease,
    background 0.14s ease !important;
}

body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
  --winterface-media-controls-toggle-transform: translateY(-0.72rem) scale(1);
}

@media (min-width: 900px) and (min-height: 660px) and (max-height: 920px) {
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
    --winterface-media-controls-toggle-transform: translateY(-1.58rem) scale(1);
  }
}

@media (max-width: 899px), (max-height: 659px) {
  body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
    --winterface-media-controls-toggle-transform: translateY(-0.72rem) scale(1);
  }
}

@media (min-width: 1600px) and (min-height: 800px) and (min-aspect-ratio: 19/10) {
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
    --winterface-media-controls-toggle-transform: translateY(calc(-1 * clamp(1.65rem, 1.95vw, 2.35rem))) scale(1);
  }
}

body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
body.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active,
body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
body.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active {
  transform: var(--winterface-media-controls-toggle-transform) !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
/* === WInterface v4.0 Hide Controls All-State No-Bounce Lock === */

/* === WInterface v4.0 Hide Controls Command-Bar Hidden Slot Lock ===
   Keeps the Hide Controls / Show Controls oval in the lower, safer command-bar-hidden
   slot by making the resting position match the preferred hover position. This removes
   the remaining visual jump without changing media geometry or normal command-bar-visible placement. */
body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
  --winterface-media-controls-toggle-transform: translateY(-0.72rem) scale(1);
  transform: var(--winterface-media-controls-toggle-transform) !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active,
body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active,
body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active,
body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active {
  transform: var(--winterface-media-controls-toggle-transform) !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
/* === WInterface v4.0 Hide Controls Command-Bar Hidden Slot Lock === */

/* === WInterface v4.0 Hide Controls Visible-State Slot Match ===
   Aligns the Hide Controls / Show Controls oval in the normal command-bar-visible,
   controls-visible standard media state with the accepted lower slot used when
   both the command bar and controls are hidden. This only changes the button slot. */
body.winterface-standalone:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
body.winterface-dev-build:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
  --winterface-media-controls-toggle-transform: translateY(-0.72rem) scale(1);
  transform: var(--winterface-media-controls-toggle-transform) !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

body.winterface-standalone:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
body.winterface-standalone:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
body.winterface-standalone:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active,
body.winterface-dev-build:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
body.winterface-dev-build:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
body.winterface-dev-build:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active {
  transform: var(--winterface-media-controls-toggle-transform) !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
/* === WInterface v4.0 Hide Controls Visible-State Slot Match === */

/* === WInterface v4.0 Hide Controls Show-State Slot Match ===
   Aligns the Show Controls oval in the command-bar-visible, controls-hidden
   standard media state with the accepted lower Show Controls slot used when
   both the command bar and controls are hidden. Hide Controls resting state
   remains governed by the visible-state slot rule above. */
body.winterface-media-controls-hidden:not(.winterface-commandbar-hidden).winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
body.winterface-media-controls-hidden:not(.winterface-commandbar-hidden).winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
  --winterface-media-controls-toggle-transform: translateY(-0.72rem) scale(1);
  transform: var(--winterface-media-controls-toggle-transform) !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

body.winterface-media-controls-hidden:not(.winterface-commandbar-hidden).winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
body.winterface-media-controls-hidden:not(.winterface-commandbar-hidden).winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
body.winterface-media-controls-hidden:not(.winterface-commandbar-hidden).winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active,
body.winterface-media-controls-hidden:not(.winterface-commandbar-hidden).winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
body.winterface-media-controls-hidden:not(.winterface-commandbar-hidden).winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
body.winterface-media-controls-hidden:not(.winterface-commandbar-hidden).winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active {
  transform: var(--winterface-media-controls-toggle-transform) !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
/* === WInterface v4.0 Hide Controls Show-State Slot Match === */


/* === WInterface v4.0 Command Bar Toggle No-Glitch Lock ===
   Scope: Hide/Show Command Bar rapid toggles only.
   Keeps the accepted media/control geometry intact while suppressing layout
   interpolation during repeated command-bar clicks. */
body.winterface-commandbar-toggle-lock #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-command-line,
body.winterface-commandbar-toggle-lock #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-frame-shell,
body.winterface-commandbar-toggle-lock #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
body.winterface-commandbar-toggle-lock #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]),
body.winterface-commandbar-toggle-lock #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-actions,
body.winterface-commandbar-toggle-lock #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
body.winterface-commandbar-toggle-lock #winterface.interface-system-media-expanded .interface-command-line,
body.winterface-commandbar-toggle-lock #winterface.interface-system-media-expanded .interface-media-frame-shell,
body.winterface-commandbar-toggle-lock #winterface.interface-system-media-expanded .interface-showcase-frame:not([hidden]),
body.winterface-commandbar-toggle-lock #winterface.interface-system-media-expanded .interface-video-frame:not([hidden]),
body.winterface-commandbar-toggle-lock #winterface.interface-system-media-expanded .interface-media-actions,
body.winterface-commandbar-toggle-lock #winterface.interface-system-media-expanded .interface-media-controls-toggle {
  transition: none !important;
}
/* === WInterface v4.0 Command Bar Toggle No-Glitch Lock === */

/* === WInterface v4.0 Ultrawide Command-Bar-Hidden Controls Lift ===
   Targeted adjustment for ultrawide/larger-wide standard view when the command bar is
   hidden and media controls remain visible. Preserves the accepted video frame
   size/position and lifts only the media controls plus Hide Controls oval into
   the middle container so they do not clip at the bottom edge. */
@media (min-width: 1600px) and (min-height: 760px) and (min-aspect-ratio: 19/10) {
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-actions,
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-actions {
    position: relative !important;
    z-index: 34 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    transform: translateY(calc(-1 * clamp(3.05rem, 2.55vw, 4.05rem))) !important;
  }

  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
    position: relative !important;
    z-index: 35 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    --winterface-media-controls-toggle-transform: translateY(calc(-1 * clamp(3.15rem, 2.65vw, 4.15rem))) scale(1);
    transform: var(--winterface-media-controls-toggle-transform) !important;
    transition:
      opacity 0.14s ease,
      border-color 0.14s ease,
      box-shadow 0.14s ease,
      background 0.14s ease !important;
  }

  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active,
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active {
    transform: var(--winterface-media-controls-toggle-transform) !important;
  }
}
/* === WInterface v4.0 Ultrawide Command-Bar-Hidden Controls Lift === */

/* === WInterface v4.0 Ultrawide Command-Bar-Hidden Controls-Hidden Downfill Match ===
   Targeted adjustment for ultrawide/larger-wide standard view when the command bar and
   media controls are both hidden. Matches the accepted video player height and
   bottom position from the command-bar-hidden + controls-visible state while
   preserving the Show Controls button slot and keeping the frame contained in
   the middle media container. */
@media (min-width: 1600px) and (min-height: 760px) and (min-aspect-ratio: 19/10) {
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-frame-shell,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-frame-shell {
    position: relative !important;
    z-index: 1 !important;
    aspect-ratio: 16 / 9 !important;
    overflow: visible !important;
  }

  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]) {
    position: absolute !important;
    inset: auto 0 0 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: calc(100% + clamp(2.15rem, 2.6vw, 3.05rem)) !important;
    max-height: none !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    margin: 0 !important;
    transform: none !important;
    box-sizing: border-box !important;
  }

  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
    position: relative !important;
    z-index: 35 !important;
  }
}
/* === WInterface v4.0 Ultrawide Command-Bar-Hidden Controls-Hidden Downfill Match === */

/* === WInterface v4.0 Ultrawide Controls-Hidden Bottom Clearance Adjustment ===
   Targeted follow-up for ultrawide/larger-wide standard view when the command
   bar and media controls are both hidden. Keeps the accepted upper frame
   geometry from the prior #2 state, but reserves a visible lower clearance so
   the Show Controls button is not clipped by the middle media container. */
@media (min-width: 1600px) and (min-height: 760px) and (min-aspect-ratio: 19/10) {
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]) {
    inset: auto 0 clamp(2.15rem, 1.75vw, 2.75rem) 0 !important;
    height: calc(100% + clamp(0.55rem, 0.85vw, 0.95rem)) !important;
  }

  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
    --winterface-media-controls-toggle-transform: translateY(calc(-1 * clamp(1.95rem, 1.35vw, 2.25rem))) scale(1);
    transform: var(--winterface-media-controls-toggle-transform) !important;
  }

  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active {
    transform: var(--winterface-media-controls-toggle-transform) !important;
  }
}
/* === WInterface v4.0 Ultrawide Controls-Hidden Bottom Clearance Adjustment === */

/* === WInterface v4.0 Ultrawide Controls-Hidden Button Centering Follow-up ===
   Targeted follow-up for ultrawide/larger-wide standard view when the command
   bar and media controls are both hidden. Leaves the video frame height and
   position untouched, and lifts only the Show Controls button into the center
   of the safe gap under the media frame. */
@media (min-width: 1600px) and (min-height: 760px) and (min-aspect-ratio: 19/10) {
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
    --winterface-media-controls-toggle-transform: translateY(calc(-1 * clamp(2.85rem, 2.05vw, 3.35rem))) scale(1);
    transform: var(--winterface-media-controls-toggle-transform) !important;
  }

  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-commandbar-hidden.winterface-media-controls-hidden.winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active {
    transform: var(--winterface-media-controls-toggle-transform) !important;
  }
}
/* === WInterface v4.0 Ultrawide Controls-Hidden Button Centering Follow-up === */

/* === WInterface v4.0 Ultrawide Item 3 Exact Bottom-Lane Match ===
   Targeted #3 adjustment for ultrawide/larger-wide standard view when the command bar
   and media controls are both visible. This copies the accepted #1 bottom-lane
   relationship, then applies a top-edge repair so the frame stays inside its
   intended background container without changing the accepted lower lane. */
@media (min-width: 1600px) and (min-height: 760px) and (min-aspect-ratio: 19/10) {
  body.winterface-standalone:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-standalone:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]),
  body.winterface-dev-build:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-dev-build:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]) {
    --winterface-item3-frame-top-repair: clamp(0.75rem, 0.65vw, 1.05rem);
    position: relative !important;
    bottom: clamp(2.85rem, 3.55vw, 3.55rem) !important;
    height: calc(100% + clamp(3.45rem, 4.2vw, 4.35rem) - clamp(2.85rem, 3.55vw, 3.55rem) - var(--winterface-item3-frame-top-repair)) !important;
    max-height: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    transform: translateY(var(--winterface-item3-frame-top-repair)) !important;
    box-sizing: border-box !important;
    z-index: 1 !important;
  }

  body.winterface-standalone:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-actions,
  body.winterface-dev-build:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-actions {
    position: relative !important;
    z-index: 34 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    transform: translateY(calc(-1 * clamp(3.05rem, 2.55vw, 4.05rem))) !important;
  }

  body.winterface-standalone:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle,
  body.winterface-dev-build:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle {
    position: relative !important;
    z-index: 35 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    --winterface-media-controls-toggle-transform: translateY(calc(-1 * clamp(3.15rem, 2.65vw, 4.15rem))) scale(1);
    transform: var(--winterface-media-controls-toggle-transform) !important;
  }

  body.winterface-standalone:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-standalone:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-standalone:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active,
  body.winterface-dev-build:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
  body.winterface-dev-build:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
  body.winterface-dev-build:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-controls-toggle:active {
    transform: var(--winterface-media-controls-toggle-transform) !important;
  }
}
/* === WInterface v4.0 Ultrawide Item 3 Exact Bottom-Lane Match === */

/* === WInterface v4.0 Ultrawide Item 3 Top Gap Final Tune ===
   Targeted follow-up for #3 only: command bar visible + controls visible on
   ultrawide/larger widescreen standard view. Keeps the accepted control-button
   lane and lower player/button relationship intact, then lowers only the player
   frame top so it clears the command bar cleanly. */
@media (min-width: 1600px) and (min-height: 760px) and (min-aspect-ratio: 19/10) {
  body.winterface-standalone:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-standalone:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]),
  body.winterface-dev-build:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-dev-build:not(.winterface-commandbar-hidden):not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]) {
    --winterface-item3-frame-top-repair: clamp(3.45rem, 2.15vw, 3.95rem);
    --winterface-item3-frame-bottom-clearance: clamp(3.15rem, 3.65vw, 3.85rem);
    position: relative !important;
    bottom: var(--winterface-item3-frame-bottom-clearance) !important;
    height: calc(100% + clamp(3.05rem, 3.75vw, 3.85rem) - var(--winterface-item3-frame-bottom-clearance) - var(--winterface-item3-frame-top-repair)) !important;
    max-height: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    transform: translateY(var(--winterface-item3-frame-top-repair)) !important;
    box-sizing: border-box !important;
    z-index: 1 !important;
  }
}
/* === WInterface v4.0 Ultrawide Item 3 Top Gap Final Tune === */


/* === WInterface v4.0 Ultrawide Item 4 Controls-Hidden Bottom Match ===
   Targeted #4 adjustment for ultrawide/larger-wide standard view when the command bar
   remains visible and media controls are hidden. The command bar, player top,
   player width, and Show Controls button slot remain unchanged. Only the lower
   player frame is allowed to downfill. This follow-up increases only the lower
   endpoint slightly farther so the Show Controls button sits more evenly
   between the player bottom and the WInterface container border. */
@media (min-width: 1600px) and (min-height: 760px) and (min-aspect-ratio: 19/10) {
  body.winterface-media-controls-hidden:not(.winterface-commandbar-hidden).winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-media-controls-hidden:not(.winterface-commandbar-hidden).winterface-standalone #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]),
  body.winterface-media-controls-hidden:not(.winterface-commandbar-hidden).winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-showcase-frame:not([hidden]),
  body.winterface-media-controls-hidden:not(.winterface-commandbar-hidden).winterface-dev-build #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-video-frame:not([hidden]) {
    --winterface-item4-bottom-downfill: clamp(4.70rem, 3.20vw, 5.60rem);
    aspect-ratio: auto !important;
    height: calc(min(61dvh, calc(100dvh - clamp(15.5rem, 24vh, 21rem))) + var(--winterface-item4-bottom-downfill)) !important;
    max-height: calc(min(61dvh, calc(100dvh - clamp(15.5rem, 24vh, 21rem))) + var(--winterface-item4-bottom-downfill)) !important;
    min-height: calc(min(57dvh, calc(100dvh - clamp(17rem, 28vh, 23rem))) + var(--winterface-item4-bottom-downfill)) !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    transform: none !important;
    box-sizing: border-box !important;
  }
}
/* === WInterface v4.0 Ultrawide Item 4 Controls-Hidden Bottom Match === */

/* === WInterface v4.0 Ultrawide Item 5 Expanded Visible-Nav Downfill ===
   Targeted #5 adjustment for ultrawide/larger-wide Expanded/Snap view with the
   navigation/command bar visible. Buttons, top navigation/status area, player
   top, and player width remain unchanged. Only the player frame bottom is
   extended downward toward the adjustmented media-control lane. This pass adds one final small downfill step while preserving the button lane. */
@media (min-width: 1600px) and (min-height: 760px) and (min-aspect-ratio: 19/10) {
  body.winterface-standalone:not(.winterface-commandbar-hidden) #winterface.interface-system-media-expanded.is-winterface-maximized .interface-showcase-frame:not([hidden]),
  body.winterface-standalone:not(.winterface-commandbar-hidden) #winterface.interface-system-media-expanded.is-winterface-maximized .interface-video-frame:not([hidden]),
  body.winterface-dev-build:not(.winterface-commandbar-hidden) #winterface.interface-system-media-expanded.is-winterface-maximized .interface-showcase-frame:not([hidden]),
  body.winterface-dev-build:not(.winterface-commandbar-hidden) #winterface.interface-system-media-expanded.is-winterface-maximized .interface-video-frame:not([hidden]) {
    aspect-ratio: auto !important;
    height: calc(min(56vh, 620px) + clamp(7.35rem, 5.95vw, 8.65rem)) !important;
    max-height: calc(min(56vh, 620px) + clamp(7.35rem, 5.95vw, 8.65rem)) !important;
    min-height: calc(min(56vh, 620px) + clamp(7.35rem, 5.95vw, 8.65rem)) !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    transform: none !important;
    box-sizing: border-box !important;
  }
}
/* === WInterface v4.0 Ultrawide Item 5 Expanded Visible-Nav Downfill === */

/* === WInterface v4.0 Ultrawide Item 6 Expanded Hidden-Nav Command Slot Fill ===
   Targeted #6 adjustment for ultrawide/larger-wide Expanded/Snap view with the
   navigation/command bar hidden. Preserves the accepted #5 bottom player/control
   lane exactly. Instead of moving or resizing the real player frame, this turns
   the already-reserved hidden command-line slot into a blank player-matched
   visual fill so the top edge occupies the prior command-bar area cleanly. */
@media (min-width: 1600px) and (min-height: 760px) and (min-aspect-ratio: 19/10) {
  body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-media-expanded.is-winterface-maximized .interface-command-line,
  body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-media-expanded.is-winterface-maximized .interface-command-line {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: none !important;
    color: transparent !important;
    background:
      linear-gradient(145deg, rgba(255,255,255,0.055), rgba(255,255,255,0.020)),
      radial-gradient(circle at top left, rgba(56,189,248,0.13), transparent 44%),
      rgba(5, 8, 22, 0.72) !important;
    border-color: rgba(56,189,248,0.24) !important;
    box-shadow:
      0 18px 42px rgba(0,0,0,0.26),
      0 0 28px rgba(56,189,248,0.09),
      inset 0 0 28px rgba(255,255,255,0.022) !important;
  }

  body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-media-expanded.is-winterface-maximized .interface-command-line .interface-command-prefix,
  body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-media-expanded.is-winterface-maximized .interface-command-line .interface-command-input,
  body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-media-expanded.is-winterface-maximized .interface-command-line .interface-cursor,
  body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-media-expanded.is-winterface-maximized .interface-command-line .interface-command-prefix,
  body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-media-expanded.is-winterface-maximized .interface-command-line .interface-command-input,
  body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-media-expanded.is-winterface-maximized .interface-command-line .interface-cursor {
    opacity: 0 !important;
    visibility: hidden !important;
  }

  body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-media-expanded.is-winterface-maximized .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-media-expanded.is-winterface-maximized .interface-video-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-media-expanded.is-winterface-maximized .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-media-expanded.is-winterface-maximized .interface-video-frame:not([hidden]) {
    margin-top: 0 !important;
    transform: none !important;
  }
}
/* === WInterface v4.0 Ultrawide Item 6 Expanded Hidden-Nav Command Slot Fill === */

/* === WInterface v4.0 Ultrawide Item 6 Hidden-Nav Micro Bottom Downfill ===
   Targeted #6 retry from the command-slot-fill build. Keeps the accepted top
   command-slot visual fill and preserves the media-control/button lane. This
   adds only a small bottom-edge extension to the active player frame so the
   player grows downward without shifting its top or moving the controls. */
@media (min-width: 1600px) and (min-height: 760px) and (min-aspect-ratio: 19/10) {
  body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-media-expanded.is-winterface-maximized .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-system-media-expanded.is-winterface-maximized .interface-video-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-media-expanded.is-winterface-maximized .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-system-media-expanded.is-winterface-maximized .interface-video-frame:not([hidden]) {
    --winterface-item6-bottom-micro: clamp(0.28rem, 0.32vw, 0.46rem);
    inset: auto 0 calc(-1 * var(--winterface-item6-bottom-micro)) 0 !important;
    height: calc(100% + clamp(3.45rem, 3.8vw, 4.45rem) + var(--winterface-item6-bottom-micro)) !important;
    max-height: none !important;
    min-height: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    transform: none !important;
    box-sizing: border-box !important;
  }
}
/* === WInterface v4.0 Ultrawide Item 6 Hidden-Nav Micro Bottom Downfill === */

/* === WInterface v4.0 Ultrawide Item 6 Hidden-Nav Bottom Gap + Lane Downshift ===
   Targeted follow-up for #6 only. Preserves the accepted hidden-nav top fill.
   In Expanded/Snap on ultrawide/larger screens, tightens the player-to-button gap
   another small step and moves the lower player/control lane farther downward
   toward the WInterface edge. This pass adds one more small gap increase and
   a larger downward lane shift from downshift5 while preserving the accepted player-to-button gap. */
@media (min-width: 1600px) and (min-height: 760px) and (min-aspect-ratio: 19/10) {
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-standalone #winterface.interface-system-media-expanded.is-winterface-maximized .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-standalone #winterface.interface-system-media-expanded.is-winterface-maximized .interface-video-frame:not([hidden]),
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-dev-build #winterface.interface-system-media-expanded.is-winterface-maximized .interface-showcase-frame:not([hidden]),
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-dev-build #winterface.interface-system-media-expanded.is-winterface-maximized .interface-video-frame:not([hidden]) {
    --winterface-item6-bottom-micro: clamp(7.35rem, 5.90vw, 8.25rem);
    inset: auto 0 calc(-1 * var(--winterface-item6-bottom-micro)) 0 !important;
    height: calc(100% + clamp(3.45rem, 3.8vw, 4.45rem) + var(--winterface-item6-bottom-micro)) !important;
    max-height: none !important;
    min-height: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    transform: none !important;
    box-sizing: border-box !important;
  }

  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-standalone #winterface.interface-system-media-expanded.is-winterface-maximized .interface-media-actions,
  body.winterface-commandbar-hidden:not(.winterface-media-controls-hidden).winterface-dev-build #winterface.interface-system-media-expanded.is-winterface-maximized .interface-media-actions {
    position: relative !important;
    z-index: 34 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    transform: translateY(clamp(6.58rem, 5.57vw, 7.45rem)) !important;
  }
}
/* === WInterface v4.0 Ultrawide Item 6 Hidden-Nav Bottom Gap + Lane Downshift === */

/* === WInterface v4.0 Ultrawide Large Text Readability ===
   Targeted typography-only enhancement for ultrawide/larger screens.
   Increases the text size in the left bay rail and right signal/system panels
   without changing panel dimensions, button sizes, spacing, media layout, or
   the accepted ultrawide player/control geometry. */
@media (min-width: 1600px) and (min-height: 760px) and (min-aspect-ratio: 19/10) {
  body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-rail-label,
  body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-rail-label {
    font-size: clamp(0.90rem, 0.62vw, 1.08rem) !important;
    line-height: 1.08 !important;
  }

  body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-rail-subtitle,
  body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-rail-subtitle {
    font-size: clamp(0.96rem, 0.66vw, 1.16rem) !important;
    line-height: 1.12 !important;
  }

  body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-path strong,
  body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-path strong {
    font-size: clamp(1.14rem, 0.82vw, 1.38rem) !important;
    line-height: 1.10 !important;
  }

  body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-path span,
  body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-path span {
    font-size: clamp(0.82rem, 0.58vw, 0.98rem) !important;
  }

  body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-output-label,
  body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-output-label {
    font-size: clamp(1.08rem, 0.82vw, 1.28rem) !important;
    line-height: 1.06 !important;
  }

  body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-output-card strong,
  body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-output-card strong {
    font-size: clamp(1.46rem, 1.10vw, 1.82rem) !important;
    line-height: 1.10 !important;
  }

  body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-system-list li,
  body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-system-list li {
    font-size: clamp(1.16rem, 0.86vw, 1.40rem) !important;
    line-height: 1.24 !important;
  }
}
/* === WInterface v4.0 Ultrawide Large Text Readability === */

/* === WInterface v4.0 Ultrawide Large Text Readability Stronger Pass ===
   Stronger typography-only pass for ultrawide/larger screens.
   Uses a viewport-height-tolerant ultrawide query plus higher-specificity selectors
   so the left rail and right panel text visibly increases without changing panel,
   button, card, media, or control geometry. */
@media (min-width: 1600px) and (min-aspect-ratio: 19/10) {
  html body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-rail .interface-rail-label,
  html body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-rail .interface-rail-label {
    font-size: clamp(1.08rem, 0.78vw, 1.34rem) !important;
    line-height: 1.04 !important;
  }

  html body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-rail .interface-rail-subtitle,
  html body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-rail .interface-rail-subtitle {
    font-size: clamp(1.08rem, 0.78vw, 1.34rem) !important;
    line-height: 1.10 !important;
  }

  html body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-rail .interface-path strong,
  html body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-rail .interface-path strong {
    font-size: clamp(1.34rem, 1.02vw, 1.72rem) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.012em !important;
  }

  html body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-rail .interface-path span,
  html body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-rail .interface-path span {
    font-size: clamp(0.94rem, 0.70vw, 1.14rem) !important;
    line-height: 1 !important;
  }

  html body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-output-card .interface-output-label,
  html body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-output-card .interface-output-label {
    font-size: clamp(1.22rem, 0.94vw, 1.54rem) !important;
    line-height: 1.06 !important;
    letter-spacing: 0.17em !important;
  }

  html body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-output-card strong,
  html body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-output-card strong {
    font-size: clamp(1.78rem, 1.34vw, 2.26rem) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.018em !important;
  }

  html body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-system-list li,
  html body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-system-list li {
    font-size: clamp(1.36rem, 1.02vw, 1.72rem) !important;
    line-height: 1.22 !important;
  }
}
/* === WInterface v4.0 Ultrawide Large Text Readability Stronger Pass === */

/* === WInterface v4.0 Ultrawide Right-Nav Controller Text Scale ===
   Targeted typography-only enhancement for ultrawide/larger screens.
   Increases the right-nav Bay / Back / Next controller text, controller readout,
   and lower launch/media button text to visually match the larger left/right panel
   typography. Does not change panel dimensions, media geometry, button positions,
   or accepted ultrawide player/control states. */
@media (min-width: 1600px) and (min-aspect-ratio: 19/10) {
  html body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-signal-pulse-chip,
  html body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-signal-pulse-chip {
    font-size: clamp(0.94rem, 0.70vw, 1.16rem) !important;
    line-height: 1.06 !important;
    letter-spacing: 0.08em !important;
  }

  html body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-signal-pulse-readout,
  html body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-signal-pulse-readout {
    font-size: clamp(0.98rem, 0.72vw, 1.18rem) !important;
    line-height: 1.10 !important;
    letter-spacing: 0.08em !important;
  }

  html body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-jump-link,
  html body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-jump-link {
    font-size: clamp(1.26rem, 0.96vw, 1.58rem) !important;
    line-height: 1.08 !important;
    letter-spacing: 0.01em !important;
  }
}
/* === WInterface v4.0 Ultrawide Right-Nav Controller Text Scale === */

/* === WInterface v4.0 Ultrawide Expanded/Snap Left-Nav Text Scale ===
   Typography-only enhancement for ultrawide/larger screens in Expanded/Snap view.
   Scales the left rail Bay heading/subtitle and card label text to match the
   accepted large-screen readability treatment from standard view. Does not
   change card/button dimensions, spacing, media geometry, or control states. */
@media (min-width: 1600px) and (min-aspect-ratio: 19/10) {
  html body.winterface-standalone #winterface.interface-system-media-expanded.is-winterface-maximized .interface-rail .interface-rail-label,
  html body.winterface-dev-build #winterface.interface-system-media-expanded.is-winterface-maximized .interface-rail .interface-rail-label {
    font-size: clamp(1.10rem, 0.82vw, 1.42rem) !important;
    line-height: 1.02 !important;
    letter-spacing: 0.06em !important;
  }

  html body.winterface-standalone #winterface.interface-system-media-expanded.is-winterface-maximized .interface-rail .interface-rail-subtitle,
  html body.winterface-dev-build #winterface.interface-system-media-expanded.is-winterface-maximized .interface-rail .interface-rail-subtitle {
    font-size: clamp(1.16rem, 0.86vw, 1.48rem) !important;
    line-height: 1.08 !important;
  }

  html body.winterface-standalone #winterface.interface-system-media-expanded.is-winterface-maximized .interface-rail .interface-path strong,
  html body.winterface-dev-build #winterface.interface-system-media-expanded.is-winterface-maximized .interface-rail .interface-path strong {
    font-size: clamp(1.38rem, 1.04vw, 1.78rem) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.012em !important;
  }

  html body.winterface-standalone #winterface.interface-system-media-expanded.is-winterface-maximized .interface-rail .interface-path span,
  html body.winterface-dev-build #winterface.interface-system-media-expanded.is-winterface-maximized .interface-rail .interface-path span {
    font-size: clamp(0.98rem, 0.72vw, 1.18rem) !important;
    line-height: 1 !important;
  }
}
/* === WInterface v4.0 Ultrawide Expanded/Snap Left-Nav Text Scale === */

/* === WInterface v4.0 Global Left Menu Centering Baseline ===
   Global containment rule for the left rail card stack.
   Centers each card within its rail and adds a small internal gutter so the
   cards do not sit flush against the rail edge across laptop, desktop,
   ultrawide, root, and DEV contexts. Existing specialized mode transforms can
   still offset the overall stack when those states intentionally require it. */
html body.winterface-standalone #winterface .interface-rail .interface-path-list,
html body.winterface-dev-build #winterface .interface-rail .interface-path-list {
  justify-items: center !important;
  box-sizing: border-box !important;
}

html body.winterface-standalone #winterface .interface-rail .interface-path,
html body.winterface-dev-build #winterface .interface-rail .interface-path {
  width: calc(100% - clamp(0.95rem, 1.25vw, 1.45rem)) !important;
  max-width: calc(100% - clamp(0.95rem, 1.25vw, 1.45rem)) !important;
  min-width: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}
/* === WInterface v4.0 Global Left Menu Centering Baseline === */

/* === WInterface v4.0 Expanded Left Rail Full Centering ===
   Scope: Expanded/Snap left rail containment across root and DEV.
   Centers the bay heading, orb row, and media card stack inside the rail so
   normal laptop Expanded/Snap view does not overflow left or right. Keeps
   player geometry, command bar behavior, and ultrawide media states unchanged. */
@media (min-width: 900px) {
  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail {
    justify-items: center !important;
    align-items: stretch !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-header,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-header {
    width: 100% !important;
    min-width: 0 !important;
    display: grid !important;
    grid-template-columns: auto minmax(0, auto) !important;
    justify-content: center !important;
    justify-items: center !important;
    align-items: center !important;
    gap: clamp(0.44rem, 0.72vw, 0.72rem) !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-header > div:first-child,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-header > div:first-child {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: clamp(3.75rem, 31%, 5.25rem) !important;
    justify-self: center !important;
    transform: none !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-header .interface-set-controls,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-header .interface-set-controls {
    flex: 0 1 auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    display: inline-flex !important;
    flex-wrap: nowrap !important;
    justify-content: center !important;
    align-items: center !important;
    justify-self: center !important;
    gap: clamp(0.20rem, 0.42vw, 0.34rem) !important;
    transform: none !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-header .interface-set-button,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-header .interface-set-button {
    flex: 0 0 auto !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-path-list,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-path-list {
    width: 100% !important;
    max-width: 100% !important;
    justify-items: center !important;
    box-sizing: border-box !important;
    margin-inline: auto !important;
  }
}
/* === WInterface v4.0 Expanded Left Rail Full Centering === */

/* === WInterface v4.0 Issue 3 Standard Desktop Hide Controls Clearance ===
   Clean standard-view clearance pass from the approved Issue #2 checkpoint.
   The Hide/Show Controls button keeps its existing size and visual styling.
   This only tightens the standard media stack spacing while controls are
   visible, so the Hide Controls button has enough vertical room at Chrome 100%.
   The Show Controls state is intentionally excluded to preserve its prior slot.
   Expanded/Snap and ultrawide/larger-wide states remain governed by their
   existing accepted rules. */
@media (min-width: 900px) and (max-width: 2199px) and (min-height: 620px) and (max-height: 1200px) {
  body.winterface-standalone:not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-panel:not([hidden]),
  body.winterface-dev-build:not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-panel:not([hidden]) {
    gap: clamp(0.34rem, 0.48vw, 0.54rem) !important;
  }

  body.winterface-standalone:not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-frame-shell,
  body.winterface-dev-build:not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-frame-shell {
    margin-bottom: -0.18rem !important;
  }

  body.winterface-standalone:not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-actions,
  body.winterface-dev-build:not(.winterface-media-controls-hidden) #winterface.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-actions {
    margin-bottom: -0.28rem !important;
  }
}
/* === WInterface v4.0 Issue 3 Standard Desktop Hide Controls Clearance === */

/* === WInterface v4.0 Issue #4 Expanded/Snap Center Volume Orb Laptop Containment v3 ===
   Balanced laptop/desktop containment pass for the center volume/mute orb in Expanded/Snap view. Slightly larger than v2 while preserving bottom glow containment.
   Uses viewport width/height targeting instead of aspect-ratio targeting because some Chrome 100% laptop
   windows report wider effective CSS ratios. Normal standard view and ultrawide/larger-screen rules remain untouched. */
@media (min-width: 900px) and (max-width: 2199px) and (min-height: 620px) and (max-height: 1200px) {
  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-actions,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-actions,
  html body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-actions,
  html body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-actions {
    overflow: visible !important;
    align-items: center !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute,
  html body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute,
  html body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute {
    width: 3.08rem !important;
    height: 3.08rem !important;
    transform: translateY(-0.14rem) scale(0.98) !important;
    transform-origin: center center !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute::before,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute::before,
  html body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute::before,
  html body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute::before {
    bottom: -0.03rem !important;
    width: 2.16rem !important;
    height: 0.40rem !important;
    filter: blur(1.45px) !important;
    opacity: 0.58 !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute-stick,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute-stick,
  html body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute-stick,
  html body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute-stick {
    bottom: 0.16rem !important;
    width: 0.34rem !important;
    height: 0.88rem !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute-orb,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute-orb,
  html body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute-orb,
  html body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute-orb {
    width: 2.20rem !important;
    height: 2.20rem !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute-orb::before,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute-orb::before,
  html body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute-orb::before,
  html body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute-orb::before {
    inset: -0.30rem !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute-orb::after,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute-orb::after,
  html body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute-orb::after,
  html body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute-orb::after {
    inset: 0.24rem !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute-icon,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute-icon,
  html body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute-icon,
  html body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute-icon {
    width: 0.98rem !important;
    height: 0.98rem !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute:hover,
  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute:focus-visible,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute:hover,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute:focus-visible,
  html body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute:hover,
  html body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute:focus-visible,
  html body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute:hover,
  html body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute:focus-visible {
    transform: translateY(-0.16rem) scale(1.0) !important;
  }
}
/* === WInterface v4.0 Issue #4 Expanded/Snap Center Volume Orb Laptop Containment v3 === */

/* === WInterface v4.0 Issue #5 Expanded/Snap Side Media Button Downshift ===
   Scope: Expanded/Snap view only on standard laptop/desktop screen ranges.
   Moves only the left Live Media/Auto-Play pill and right Expand/Collapse pill
   slightly downward. The center volume/mute orb remains governed by the accepted
   Issue #4 containment rules. Standard view and ultrawide/larger-screen geometry
   remain untouched. */
@media (min-width: 900px) and (max-width: 2199px) and (min-height: 620px) and (max-height: 1200px) {
  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-actions .interface-playback-status.is-autoplay-linked,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-actions .interface-playback-status.is-autoplay-linked,
  html body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-actions .interface-playback-status.is-autoplay-linked,
  html body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-actions .interface-playback-status.is-autoplay-linked,
  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-actions .interface-media-toggle,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-actions .interface-media-toggle,
  html body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-actions .interface-media-toggle,
  html body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-actions .interface-media-toggle {
    position: relative !important;
    top: 0.14rem !important;
  }
}
/* === WInterface v4.0 Issue #5 Expanded/Snap Side Media Button Downshift === */

/* === WInterface v4.0 Right Nav Controller Theme Border Sync ===
   Scope: right-nav Live Systems Back / Bay / Next controller frame only.
   Syncs the outer controller container border/glow to the active Style Matrix
   theme color while preserving existing controller layout, buttons, readout,
   bay-specific button colors, and desktop display adjustmentes. */
body.winterface-standalone #winterface .interface-side-panel .interface-signal-pulse,
body.winterface-dev-build #winterface .interface-side-panel .interface-signal-pulse {
  border-color: rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.72) !important;
  box-shadow:
    0 0 0 1px rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.16),
    0 14px 30px rgba(0, 0, 0, 0.17),
    0 0 24px rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.18),
    0 0 44px rgba(var(--style-matrix-orb-right-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.10),
    inset 0 0 20px rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.045) !important;
}

body.winterface-standalone #winterface .interface-side-panel .interface-signal-pulse::before,
body.winterface-dev-build #winterface .interface-side-panel .interface-signal-pulse::before {
  background: linear-gradient(
    90deg,
    transparent,
    rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.20),
    rgba(var(--style-matrix-orb-right-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.12),
    transparent
  ) !important;
  opacity: 0.46 !important;
}
/* === WInterface v4.0 Right Nav Controller Theme Border Sync === */

/* === WInterface v4.0 Right Nav Launch Button Theme Border Sync ===
   Scope: bottom-right launch/media action button in the right-nav side panel.
   Syncs only the button border/glow to the active Style Matrix theme color,
   preserving existing button size, text, layout, hover behavior, and controller logic. */
body.winterface-standalone #winterface .interface-side-panel .interface-jump-link,
body.winterface-dev-build #winterface .interface-side-panel .interface-jump-link {
  border-color: rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.72) !important;
  box-shadow:
    0 0 0 1px rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.14),
    0 12px 24px rgba(0, 0, 0, 0.18),
    0 0 20px rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.16),
    0 0 34px rgba(var(--style-matrix-orb-right-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.09),
    inset 0 0 18px rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.045) !important;
}

body.winterface-standalone #winterface .interface-side-panel .interface-jump-link::before,
body.winterface-dev-build #winterface .interface-side-panel .interface-jump-link::before {
  background: linear-gradient(
    90deg,
    transparent,
    rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.24),
    rgba(var(--style-matrix-orb-right-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.14),
    transparent
  ) !important;
  opacity: 0.50 !important;
}
/* === WInterface v4.0 Right Nav Launch Button Theme Border Sync === */

/* === WInterface v4.0 Media Control Button Theme Border Sync ===
   Scope: Live Media / Auto-Play, Hide/Show Controls, and Expand/Collapse
   WInterface buttons only. Syncs border color to the active Style Matrix
   theme color while preserving existing sizing, placement, backgrounds,
   shadows, typography, media behavior, and desktop adjustmentes. */
body.winterface-standalone #winterface .interface-media-actions .interface-playback-status,
body.winterface-dev-build #winterface .interface-media-actions .interface-playback-status,
body.winterface-standalone #winterface .interface-media-actions .interface-media-toggle,
body.winterface-dev-build #winterface .interface-media-actions .interface-media-toggle,
body.winterface-standalone #winterface .interface-media-controls-toggle,
body.winterface-dev-build #winterface .interface-media-controls-toggle {
  border-color: rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.72) !important;
}

body.winterface-standalone #winterface .interface-media-actions .interface-playback-status:hover,
body.winterface-standalone #winterface .interface-media-actions .interface-playback-status:focus-visible,
body.winterface-dev-build #winterface .interface-media-actions .interface-playback-status:hover,
body.winterface-dev-build #winterface .interface-media-actions .interface-playback-status:focus-visible,
body.winterface-standalone #winterface .interface-media-actions .interface-media-toggle:hover,
body.winterface-standalone #winterface .interface-media-actions .interface-media-toggle:focus-visible,
body.winterface-dev-build #winterface .interface-media-actions .interface-media-toggle:hover,
body.winterface-dev-build #winterface .interface-media-actions .interface-media-toggle:focus-visible,
body.winterface-standalone #winterface .interface-media-controls-toggle:hover,
body.winterface-standalone #winterface .interface-media-controls-toggle:focus-visible,
body.winterface-dev-build #winterface .interface-media-controls-toggle:hover,
body.winterface-dev-build #winterface .interface-media-controls-toggle:focus-visible {
  border-color: rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.86) !important;
}
/* === WInterface v4.0 Media Control Button Theme Border Sync === */

/* === WInterface v4.0 Media Control Button Theme Border Sync v2 ===
   Strengthens the theme-border treatment for Live Media / Auto-Play and
   Expand / Collapse WInterface by syncing their visible overlay border layer
   in addition to the base button border. No layout, sizing, or behavior changes. */
body.winterface-standalone #winterface .interface-media-actions .interface-playback-status,
body.winterface-dev-build #winterface .interface-media-actions .interface-playback-status,
body.winterface-standalone #winterface .interface-media-actions .interface-playback-status.is-autoplay-linked,
body.winterface-dev-build #winterface .interface-media-actions .interface-playback-status.is-autoplay-linked,
body.winterface-standalone #winterface .interface-media-actions .interface-playback-status.is-slideshow-linked,
body.winterface-dev-build #winterface .interface-media-actions .interface-playback-status.is-slideshow-linked,
body.winterface-standalone #winterface .interface-media-actions .interface-media-toggle,
body.winterface-dev-build #winterface .interface-media-actions .interface-media-toggle,
body.winterface-standalone #winterface .interface-media-controls-toggle,
body.winterface-dev-build #winterface .interface-media-controls-toggle {
  border-color: rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.72) !important;
}

body.winterface-standalone #winterface .interface-media-actions .interface-playback-status::after,
body.winterface-dev-build #winterface .interface-media-actions .interface-playback-status::after,
body.winterface-standalone #winterface .interface-media-actions .interface-playback-status.is-autoplay-linked::after,
body.winterface-dev-build #winterface .interface-media-actions .interface-playback-status.is-autoplay-linked::after,
body.winterface-standalone #winterface .interface-media-actions .interface-playback-status.is-slideshow-linked::after,
body.winterface-dev-build #winterface .interface-media-actions .interface-playback-status.is-slideshow-linked::after,
body.winterface-standalone #winterface .interface-media-actions .interface-media-toggle::after,
body.winterface-dev-build #winterface .interface-media-actions .interface-media-toggle::after {
  border-color: rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.46) !important;
  box-shadow:
    inset 0 1px 0 rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.16),
    inset 0 -1px 0 rgba(var(--style-matrix-orb-right-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.09) !important;
}

body.winterface-standalone #winterface .interface-media-actions .interface-playback-status:hover,
body.winterface-standalone #winterface .interface-media-actions .interface-playback-status:focus-visible,
body.winterface-dev-build #winterface .interface-media-actions .interface-playback-status:hover,
body.winterface-dev-build #winterface .interface-media-actions .interface-playback-status:focus-visible,
body.winterface-standalone #winterface .interface-media-actions .interface-media-toggle:hover,
body.winterface-standalone #winterface .interface-media-actions .interface-media-toggle:focus-visible,
body.winterface-dev-build #winterface .interface-media-actions .interface-media-toggle:hover,
body.winterface-dev-build #winterface .interface-media-actions .interface-media-toggle:focus-visible,
body.winterface-standalone #winterface .interface-media-controls-toggle:hover,
body.winterface-standalone #winterface .interface-media-controls-toggle:focus-visible,
body.winterface-dev-build #winterface .interface-media-controls-toggle:hover,
body.winterface-dev-build #winterface .interface-media-controls-toggle:focus-visible {
  border-color: rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.86) !important;
}

body.winterface-standalone #winterface .interface-media-actions .interface-playback-status:hover::after,
body.winterface-standalone #winterface .interface-media-actions .interface-playback-status:focus-visible::after,
body.winterface-dev-build #winterface .interface-media-actions .interface-playback-status:hover::after,
body.winterface-dev-build #winterface .interface-media-actions .interface-playback-status:focus-visible::after,
body.winterface-standalone #winterface .interface-media-actions .interface-media-toggle:hover::after,
body.winterface-standalone #winterface .interface-media-actions .interface-media-toggle:focus-visible::after,
body.winterface-dev-build #winterface .interface-media-actions .interface-media-toggle:hover::after,
body.winterface-dev-build #winterface .interface-media-actions .interface-media-toggle:focus-visible::after {
  border-color: rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.62) !important;
  box-shadow:
    inset 0 1px 0 rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.22),
    inset 0 -1px 0 rgba(var(--style-matrix-orb-right-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.12) !important;
}
/* === WInterface v4.0 Media Control Button Theme Border Sync v2 === */

/* === WInterface v4.0 Media Control Button Theme Border Sync v3 ===
   Adjustmentes the resting-state border for Live Media / Auto-Play and
   Expand / Collapse WInterface. Prior pass only became obvious on hover
   because a higher-specificity stable capsule rule in style.css kept the
   non-hover base/overlay borders neutral. Border/color only; no layout,
   sizing, spacing, transform, or behavior changes. */
html body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked,
html body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked,
html body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked,
html body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked,
html body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle,
html body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle,
html body.winterface-standalone #winterface.interface-section .interface-core .interface-media-controls-toggle,
html body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-controls-toggle {
  border-color: rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.72) !important;
  box-shadow:
    0 0 0 1px rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.16),
    0 14px 30px rgba(0, 0, 0, 0.28),
    0 0 18px rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.12),
    inset 0 0 0 1px rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.10),
    inset 0 0 26px rgba(255, 255, 255, 0.030) !important;
}

html body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked::after,
html body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked::after,
html body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked::after,
html body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked::after,
html body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle::after,
html body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle::after {
  border-color: rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.52) !important;
  box-shadow:
    inset 0 1px 0 rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.18),
    inset 0 -1px 0 rgba(var(--style-matrix-orb-right-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.12) !important;
}

html body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked:hover,
html body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked:focus-visible,
html body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked:hover,
html body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked:focus-visible,
html body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked:hover,
html body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked:focus-visible,
html body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked:hover,
html body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked:focus-visible,
html body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle:hover,
html body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle:focus-visible,
html body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle:hover,
html body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle:focus-visible,
html body.winterface-standalone #winterface.interface-section .interface-core .interface-media-controls-toggle:hover,
html body.winterface-standalone #winterface.interface-section .interface-core .interface-media-controls-toggle:focus-visible,
html body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-controls-toggle:hover,
html body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-controls-toggle:focus-visible {
  border-color: rgba(var(--style-matrix-orb-left-rgb, var(--interface-accent-rgb, 56, 189, 248)), 0.86) !important;
}
/* === WInterface v4.0 Media Control Button Theme Border Sync v3 === */

/* Solo v4.0 standard-view center mute orb containment.
   Scope: normal/standard media controls only. Keeps Expanded/Snap sizing governed by the accepted issue #4 rules. */
html body.winterface-standalone #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute,
html body.winterface-dev-build #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute {
  width: 3.52rem !important;
  height: 3.52rem !important;
  transform: translateY(0.04rem) !important;
}

html body.winterface-standalone #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute::before,
html body.winterface-dev-build #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute::before {
  bottom: -0.22rem !important;
  width: 2.58rem !important;
  height: 0.56rem !important;
}

html body.winterface-standalone #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute-stick,
html body.winterface-dev-build #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute-stick {
  bottom: 0.16rem !important;
  width: 0.42rem !important;
  height: 1.03rem !important;
}

html body.winterface-standalone #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute-orb,
html body.winterface-dev-build #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute-orb {
  width: 2.42rem !important;
  height: 2.42rem !important;
}

html body.winterface-standalone #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute-orb::before,
html body.winterface-dev-build #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute-orb::before {
  inset: -0.36rem !important;
}

html body.winterface-standalone #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute-orb::after,
html body.winterface-dev-build #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute-orb::after {
  inset: 0.28rem !important;
}

html body.winterface-standalone #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute-icon,
html body.winterface-dev-build #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute-icon {
  width: 1.06rem !important;
  height: 1.06rem !important;
}

html body.winterface-standalone #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute:hover,
html body.winterface-standalone #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute:focus-visible,
html body.winterface-dev-build #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute:hover,
html body.winterface-dev-build #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute:focus-visible {
  transform: translateY(-0.04rem) scale(1.03) !important;
}

/* === WInterface Solo v4.0 Ultrawide Expanded Bay Header Alignment ===
   Scope: danieldev.ink Expanded/Snap view only on ultrawide/larger-wide screens.
   Left-aligns the Bay title/subtitle block and right-aligns the seven-orb bay selector
   inside the rail header, matching the normal-view left/right header distribution.
   Applies generically to every bay; no card, media, right-panel, or JS changes. */
@media (min-width: 1600px) and (min-aspect-ratio: 19/10) {
  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-header,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-header {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    justify-content: stretch !important;
    justify-items: stretch !important;
    align-items: center !important;
    gap: clamp(0.55rem, 0.74vw, 0.95rem) !important;
    padding-left: clamp(0.48rem, 0.64vw, 0.85rem) !important;
    padding-right: clamp(0.58rem, 0.78vw, 1.05rem) !important;
    box-sizing: border-box !important;
    transform: none !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-header > div:first-child,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-header > div:first-child {
    justify-self: start !important;
    align-self: center !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    text-align: left !important;
    transform: none !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-label,
  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-subtitle,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-label,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-subtitle {
    text-align: left !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-header .interface-set-controls,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-header .interface-set-controls {
    justify-self: end !important;
    align-self: center !important;
    justify-content: flex-end !important;
    margin-left: auto !important;
    padding-right: clamp(0.16rem, 0.32vw, 0.44rem) !important;
    max-width: 100% !important;
    transform: none !important;
    box-sizing: border-box !important;
  }
}
/* === WInterface Solo v4.0 Ultrawide Expanded Bay Header Alignment === */

/* === WInterface Solo v4.0 Ultrawide Standard Bay Header Alignment ===
   Scope: danieldev.ink normal/unexpanded view only on ultrawide/larger-wide screens.
   Mirrors the accepted Expanded/Snap Bay header treatment so the Bay title/subtitle
   block stays left-aligned and the seven-orb bay selector sits right-aligned with
   a small containment gutter. Does not affect Expanded/Snap, laptop, card, media,
   right-panel, or JS behavior. */
@media (min-width: 1600px) and (min-aspect-ratio: 19/10) {
  html body.winterface-standalone #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-rail-header,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-rail-header {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    justify-content: stretch !important;
    justify-items: stretch !important;
    align-items: center !important;
    gap: clamp(0.55rem, 0.74vw, 0.95rem) !important;
    padding-left: clamp(0.48rem, 0.64vw, 0.85rem) !important;
    padding-right: clamp(0.58rem, 0.78vw, 1.05rem) !important;
    box-sizing: border-box !important;
    transform: none !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-rail-header > div:first-child,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-rail-header > div:first-child {
    justify-self: start !important;
    align-self: center !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    text-align: left !important;
    transform: none !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-rail-label,
  html body.winterface-standalone #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-rail-subtitle,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-rail-label,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-rail-subtitle {
    text-align: left !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-rail-header .interface-set-controls,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-rail-header .interface-set-controls {
    justify-self: end !important;
    align-self: center !important;
    justify-content: flex-end !important;
    margin-left: auto !important;
    padding-right: clamp(0.16rem, 0.32vw, 0.44rem) !important;
    max-width: 100% !important;
    transform: none !important;
    box-sizing: border-box !important;
  }
}
/* === WInterface Solo v4.0 Ultrawide Standard Bay Header Alignment === */


/* === WInterface Solo v4.0 Iron Steel Standalone Polish ===
   Default-theme-only overlay loaded after the standalone layer. Preserves all
   accepted layout/display adjustmentes while refining the prior default slot into an
   Iron Steel command-interface finish. */
html[data-winterface-theme="default"] body.winterface-standalone,
html[data-winterface-theme="default"] body.winterface-dev-build {
  background:
    radial-gradient(circle at 48% 12%, rgba(116, 234, 255, 0.095), transparent 34%),
    radial-gradient(circle at 82% 28%, rgba(214, 180, 109, 0.080), transparent 36%),
    radial-gradient(circle at 16% 80%, rgba(168, 50, 50, 0.045), transparent 32%),
    linear-gradient(135deg, #020304 0%, #06090d 38%, #0e1319 68%, #030506 100%) !important;
}

html[data-winterface-theme="default"] #winterface.interface-section {
  --interface-accent-rgb: 214, 180, 109 !important;
  --interface-accent: #d6b46d !important;
  --interface-accent-text: #f1cd84 !important;
  --interface-accent-soft: rgba(214, 180, 109, 0.10) !important;
  --interface-accent-border: rgba(214, 180, 109, 0.42) !important;
  --interface-accent-border-strong: rgba(116, 234, 255, 0.64) !important;
  --interface-accent-glow: rgba(116, 234, 255, 0.22) !important;
}

html[data-winterface-theme="default"] #winterface .interface-shell {
  border-color: rgba(116, 234, 255, 0.24) !important;
  background:
    linear-gradient(145deg, rgba(28, 34, 40, 0.92), rgba(5, 8, 12, 0.98) 44%, rgba(22, 18, 11, 0.82) 100%),
    rgba(5, 8, 12, 0.92) !important;
  box-shadow:
    inset 0 0 0 1px rgba(244, 247, 248, 0.030),
    inset 0 0 64px rgba(116, 234, 255, 0.030),
    0 26px 80px rgba(0, 0, 0, 0.62),
    0 0 42px rgba(214, 180, 109, 0.070) !important;
}

html[data-winterface-theme="default"] #winterface .interface-commandbar-toggle,
html[data-winterface-theme="default"] #winterface .interface-system-orb-toggle,
html[data-winterface-theme="default"] #winterface .interface-maximize-button,
html[data-winterface-theme="default"] #winterface .interface-media-mute {
  border-color: rgba(116, 234, 255, 0.36) !important;
  box-shadow:
    0 0 0 1px rgba(214, 180, 109, 0.10),
    0 0 18px rgba(116, 234, 255, 0.20),
    0 0 34px rgba(214, 180, 109, 0.08),
    inset 0 0 18px rgba(116, 234, 255, 0.055) !important;
}

html[data-winterface-theme="default"] #winterface .interface-media-mute-orb,
html[data-winterface-theme="default"] #winterface .interface-system-orb-toggle i,
html[data-winterface-theme="default"] #winterface .interface-status-orb {
  background:
    radial-gradient(circle at 34% 26%, rgba(244, 247, 248, 0.82), transparent 24%),
    radial-gradient(circle, rgba(116, 234, 255, 0.72), rgba(214, 180, 109, 0.28) 58%, rgba(5, 8, 12, 0.98) 100%) !important;
  border-color: rgba(116, 234, 255, 0.54) !important;
  box-shadow:
    inset 0 0 16px rgba(244, 247, 248, 0.13),
    0 0 18px rgba(116, 234, 255, 0.42),
    0 0 38px rgba(214, 180, 109, 0.14) !important;
}
/* === WInterface Solo v4.0 Iron Steel Standalone Polish === */

/* === WInterface Solo v4.0 Iron Steel Style Matrix Preview Adjustment ===
   Keeps the Iron Steel preview/orb colors locked to the new default palette
   even while Code Green, Blue Chrome, or Navy Sky Grey are currently selected.
   Visual-only CSS adjustment; no layout, content, media, JS, or behavior changes. */
:root {
  --matrix-slot-default-left: #d6b46d !important;
  --matrix-slot-default-right: #74eaff !important;
  --matrix-slot-default-left-rgb: 214, 180, 109 !important;
  --matrix-slot-default-right-rgb: 116, 234, 255 !important;
  --matrix-slot-default-preview: linear-gradient(90deg, #030506 0%, #1a222b 28%, #d6b46d 64%, #74eaff 100%) !important;
}

.interface-theme-option[data-interface-theme-option="default"],
body.winterface-dev-build .interface-theme-option[data-interface-theme-option="default"] {
  --theme-preview: linear-gradient(90deg, #030506 0%, #1a222b 28%, #d6b46d 64%, #74eaff 100%) !important;
  --theme-option-orb: #d6b46d !important;
  --theme-option-orb-2: #74eaff !important;
  --theme-option-orb-rgb: 214, 180, 109 !important;
  --theme-option-orb-2-rgb: 116, 234, 255 !important;
}
/* === WInterface Solo v4.0 Iron Steel Style Matrix Preview Adjustment === */


/* === WInterface Solo v4.0 Iron Steel Controller Consistency + Command Cyan Sync ===
   Scope: CSS-only visual correction.
   1) Keeps the right-nav Back / Bay / Next controller chips dark at rest across all bays,
      then lets their existing cyan / violet / red color logic activate on hover, focus, or active state.
   2) In Iron Steel, maps the DW:// command preadjustment and blinking command cursor to the arc-reactor cyan
      used by the menu orb secondary accent instead of the armor-gprior primary accent.
   No layout, content, JS, media, recorder, responsive geometry, or card data changes. */

/* Right-nav controller chips: neutral/dark rest state for every bay/card. */
html body #winterface.interface-section .interface-side-panel .interface-signal-pulse .interface-signal-pulse-chip:not(:hover):not(:focus-visible):not(.is-active),
html body #winterface.interface-section[class*="interface-system-set-"] .interface-side-panel .interface-signal-pulse .interface-signal-pulse-chip:not(:hover):not(:focus-visible):not(.is-active) {
  border-color: rgba(148, 163, 184, 0.24) !important;
  background:
    linear-gradient(180deg, rgba(32, 37, 48, 0.78), rgba(12, 16, 25, 0.91) 56%, rgba(5, 8, 16, 0.96)),
    radial-gradient(circle at 50% 0%, rgba(226, 232, 240, 0.12), transparent 64%),
    rgba(255, 255, 255, 0.028) !important;
  box-shadow:
    0 0 0 1px rgba(248, 250, 252, 0.032),
    0 0 14px rgba(15, 23, 42, 0.36),
    inset 0 1px 0 rgba(248, 250, 252, 0.13),
    inset 0 0 18px rgba(226, 232, 240, 0.035),
    inset 0 -9px 16px rgba(0, 0, 0, 0.28) !important;
  color: rgba(226, 232, 240, 0.92) !important;
  text-shadow:
    0 1px 2px rgba(0, 0, 0, 0.82),
    0 0 9px rgba(148, 163, 184, 0.18) !important;
}

html body #winterface.interface-section .interface-side-panel .interface-signal-pulse .interface-signal-pulse-chip:not(:hover):not(:focus-visible):not(.is-active)::after,
html body #winterface.interface-section[class*="interface-system-set-"] .interface-side-panel .interface-signal-pulse .interface-signal-pulse-chip:not(:hover):not(:focus-visible):not(.is-active)::after {
  background: rgba(148, 163, 184, 0.42) !important;
  box-shadow:
    0 0 8px rgba(148, 163, 184, 0.22),
    0 0 14px rgba(15, 23, 42, 0.28) !important;
}

/* Iron Steel command line: use the arc-reactor/menu-orb cyan for DW:// and the blinking cursor. */
html[data-winterface-theme=\"default\"] body #winterface.interface-section .interface-command-line .interface-cursor,
html[data-winterface-theme=\"default\"] body #winterface.interface-section[class*="interface-system-set-"] .interface-command-line .interface-cursor {
  background: var(--style-matrix-orb-right, #74eaff) !important;
  box-shadow:
    0 0 12px rgba(var(--style-matrix-orb-right-rgb, 116, 234, 255), 0.94),
    0 0 26px rgba(var(--style-matrix-orb-right-rgb, 116, 234, 255), 0.50),
    0 0 44px rgba(var(--style-matrix-orb-right-rgb, 116, 234, 255), 0.24) !important;
}

html[data-winterface-theme=\"default\"] body #winterface.interface-section .interface-command-line .interface-command-prefix,
html[data-winterface-theme=\"default\"] body #winterface.interface-section[class*="interface-system-set-"] .interface-command-line .interface-command-prefix {
  color: var(--style-matrix-orb-right, #74eaff) !important;
  text-shadow:
    0 0 10px rgba(var(--style-matrix-orb-right-rgb, 116, 234, 255), 0.82),
    0 0 22px rgba(var(--style-matrix-orb-right-rgb, 116, 234, 255), 0.38) !important;
}
/* === WInterface Solo v4.0 Iron Steel Controller Consistency + Command Cyan Sync === */


/* === WInterface Solo v4.0 Iron Steel Command Cyan Text Adjustment ===
   Scope: Iron Steel/default theme only.
   Forces DW:// text itself and the command cursor/light to arc-reactor cyan at rest.
   Removes the prior cyan background block behind DW:// while preserving command input and layout. */
html[data-winterface-theme="default"] body #winterface.interface-section .interface-command-line .interface-command-prefix,
html[data-winterface-theme="default"] body #winterface.interface-section[class*="interface-system-set-"] .interface-command-line .interface-command-prefix,
html[data-winterface-theme="default"] #winterface.interface-section .interface-command-line .interface-command-prefix,
html[data-winterface-theme="default"] #winterface.interface-section[class*="interface-system-set-"] .interface-command-line .interface-command-prefix {
  color: #74eaff !important;
  background: transparent !important;
  background-color: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  text-shadow:
    0 0 10px rgba(116, 234, 255, 0.86),
    0 0 22px rgba(116, 234, 255, 0.42),
    0 0 34px rgba(214, 180, 109, 0.12) !important;
}

html[data-winterface-theme="default"] body #winterface.interface-section .interface-command-line .interface-cursor,
html[data-winterface-theme="default"] body #winterface.interface-section[class*="interface-system-set-"] .interface-command-line .interface-cursor,
html[data-winterface-theme="default"] #winterface.interface-section .interface-command-line .interface-cursor,
html[data-winterface-theme="default"] #winterface.interface-section[class*="interface-system-set-"] .interface-command-line .interface-cursor {
  background: #74eaff !important;
  border-color: rgba(116, 234, 255, 0.74) !important;
  box-shadow:
    0 0 12px rgba(116, 234, 255, 0.96),
    0 0 26px rgba(116, 234, 255, 0.52),
    0 0 44px rgba(116, 234, 255, 0.26) !important;
}
/* === WInterface Solo v4.0 Iron Steel Command Cyan Text Adjustment === */

/* === WInterface Solo v4.0 Iron Steel Cyan Button Border Override ===
   Final CSS-layer override for Iron Steel/default media controls and right-nav Launch button.
   Border/color only; no layout or behavior changes. */
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-core .interface-media-controls-toggle,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-side-panel .interface-jump-link,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-controls-toggle,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-side-panel .interface-jump-link {
  border-color: rgba(116, 234, 255, 0.72) !important;
  box-shadow:
    0 0 0 1px rgba(116, 234, 255, 0.16),
    0 14px 30px rgba(0, 0, 0, 0.28),
    0 0 18px rgba(116, 234, 255, 0.12),
    inset 0 0 0 1px rgba(116, 234, 255, 0.10),
    inset 0 0 26px rgba(255, 255, 255, 0.030) !important;
}

html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status::after,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked::after,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked::after,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle::after,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-side-panel .interface-jump-link::before,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status::after,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-autoplay-linked::after,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status.is-slideshow-linked::after,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle::after,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-side-panel .interface-jump-link::before {
  border-color: rgba(116, 234, 255, 0.52) !important;
  box-shadow:
    inset 0 1px 0 rgba(116, 234, 255, 0.18),
    inset 0 -1px 0 rgba(214, 180, 109, 0.10) !important;
}

html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status:hover,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status:focus-visible,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle:hover,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle:focus-visible,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-core .interface-media-controls-toggle:hover,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-core .interface-media-controls-toggle:focus-visible,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-side-panel .interface-jump-link:hover,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-side-panel .interface-jump-link:focus-visible,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status:hover,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-playback-status:focus-visible,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle:hover,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-actions .interface-media-toggle:focus-visible,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-controls-toggle:hover,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-controls-toggle:focus-visible,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-side-panel .interface-jump-link:hover,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-side-panel .interface-jump-link:focus-visible {
  border-color: rgba(116, 234, 255, 0.88) !important;
}
/* === WInterface Solo v4.0 Iron Steel Cyan Button Border Override === */


/* === WInterface Solo v4.0 Iron Steel Chrome Button Border Final Override ===
   Scope: Iron Steel/default theme only.
   Purpose: Keep Hide/Show Controls and right-nav Launch/Play borders on the polished
   steel/chrome treatment after the prior cyan media-control override layer.
   Border/lighting only; no layout, sizing, spacing, media, JS, or content changes. */
html[data-winterface-theme="default"] {
  --iron-steel-chrome: #b9c7cf !important;
  --iron-steel-chrome-rgb: 185, 199, 207 !important;
}

html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-core .interface-media-controls-toggle,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-controls-toggle,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-side-panel .interface-jump-link,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-side-panel .interface-jump-link {
  border-color: rgba(var(--iron-steel-chrome-rgb), 0.78) !important;
  box-shadow:
    0 0 0 1px rgba(var(--iron-steel-chrome-rgb), 0.16),
    0 14px 30px rgba(0, 0, 0, 0.30),
    0 0 18px rgba(var(--iron-steel-chrome-rgb), 0.12),
    inset 0 0 0 1px rgba(255, 255, 255, 0.06),
    inset 0 0 26px rgba(var(--iron-steel-chrome-rgb), 0.04) !important;
}

html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-core .interface-media-controls-toggle::before,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-core .interface-media-controls-toggle::after,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-controls-toggle::before,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-controls-toggle::after,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-side-panel .interface-jump-link::before,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-side-panel .interface-jump-link::after,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-side-panel .interface-jump-link::before,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-side-panel .interface-jump-link::after {
  border-color: rgba(var(--iron-steel-chrome-rgb), 0.58) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.14),
    inset 0 -1px 0 rgba(var(--iron-steel-chrome-rgb), 0.11) !important;
}

html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-core .interface-media-controls-toggle:hover,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-core .interface-media-controls-toggle:focus-visible,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-controls-toggle:hover,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-core .interface-media-controls-toggle:focus-visible,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-side-panel .interface-jump-link:hover,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-side-panel .interface-jump-link:focus-visible,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-side-panel .interface-jump-link:hover,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-side-panel .interface-jump-link:focus-visible {
  border-color: rgba(var(--iron-steel-chrome-rgb), 0.94) !important;
  box-shadow:
    0 0 0 1px rgba(var(--iron-steel-chrome-rgb), 0.20),
    0 16px 32px rgba(0, 0, 0, 0.32),
    0 0 22px rgba(var(--iron-steel-chrome-rgb), 0.17),
    inset 0 0 0 1px rgba(255, 255, 255, 0.08),
    inset 0 0 28px rgba(var(--iron-steel-chrome-rgb), 0.055) !important;
}
/* === WInterface Solo v4.0 Iron Steel Chrome Button Border Final Override === */

/* === WInterface Solo v4.0 Iron Steel Status Oval Chrome Border Sync ===
   Scope: Iron Steel/default theme only.
   Adds the polished steel/chrome border treatment to the top status ovals for
   WInterface v4.0 Solo and 6 Connected. Border/lighting only; no layout changes. */
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-system-status-pill,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-status-count,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-system-status-pill,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-status-count {
  border-color: rgba(var(--iron-steel-chrome-rgb, 185, 199, 207), 0.78) !important;
  box-shadow:
    0 0 0 1px rgba(var(--iron-steel-chrome-rgb, 185, 199, 207), 0.16),
    0 12px 28px rgba(0, 0, 0, 0.28),
    0 0 18px rgba(var(--iron-steel-chrome-rgb, 185, 199, 207), 0.12),
    inset 0 0 0 1px rgba(255, 255, 255, 0.06),
    inset 0 0 24px rgba(var(--iron-steel-chrome-rgb, 185, 199, 207), 0.04) !important;
}

html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-system-status-pill::before,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-system-status-pill::after,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-status-count::before,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-status-count::after,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-system-status-pill::before,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-system-status-pill::after,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-status-count::before,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-status-count::after {
  border-color: rgba(var(--iron-steel-chrome-rgb, 185, 199, 207), 0.48) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.13),
    inset 0 -1px 0 rgba(var(--iron-steel-chrome-rgb, 185, 199, 207), 0.10) !important;
}
/* === WInterface Solo v4.0 Iron Steel Status Oval Chrome Border Sync === */

/* === WInterface Solo v4.0 Iron Steel Tablet + Mid-Large Readability Parity v2 ===
   Scope: tablet and mid-large non-ultrawide screens. This intentionally does not rely
   on pointer/coarse detection because some tablets report desktop-style pointer values.
   It broadens the accepted big-screen readability treatment without changing media
   player geometry, card dimensions, JS behavior, content, or phone/ultrawide rules. */
@media (min-width: 700px) and (max-width: 2200px) and (min-height: 620px) and (max-aspect-ratio: 17/10) {
  html body.winterface-standalone #winterface.interface-section,
  html body.winterface-dev-build #winterface.interface-section {
    --winterface-tablet-readability-scale: 1;
  }

  html body.winterface-standalone #winterface.interface-section .interface-status-bar,
  html body.winterface-dev-build #winterface.interface-section .interface-status-bar {
    font-size: clamp(1.02rem, 1.38vw, 1.26rem) !important;
  }

  html body.winterface-standalone #winterface.interface-section .interface-system-status-pill,
  html body.winterface-standalone #winterface.interface-section .interface-status-item,
  html body.winterface-dev-build #winterface.interface-section .interface-system-status-pill,
  html body.winterface-dev-build #winterface.interface-section .interface-status-item {
    font-size: clamp(0.96rem, 1.28vw, 1.18rem) !important;
    line-height: 1.08 !important;
    letter-spacing: 0.055em !important;
  }

  html body.winterface-standalone #winterface.interface-section .interface-style-toggle,
  html body.winterface-dev-build #winterface.interface-section .interface-style-toggle {
    font-size: clamp(0.98rem, 1.28vw, 1.18rem) !important;
    line-height: 1.08 !important;
  }

  html body.winterface-standalone #winterface.interface-section .interface-command-prefix,
  html body.winterface-standalone #winterface.interface-section .interface-command-input,
  html body.winterface-dev-build #winterface.interface-section .interface-command-prefix,
  html body.winterface-dev-build #winterface.interface-section .interface-command-input {
    font-size: clamp(1.12rem, 1.52vw, 1.40rem) !important;
    line-height: 1.12 !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media .interface-rail-header,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media .interface-rail-header {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    justify-content: stretch !important;
    justify-items: stretch !important;
    align-items: center !important;
    gap: clamp(0.56rem, 1.04vw, 0.98rem) !important;
    padding-left: clamp(0.50rem, 0.96vw, 0.86rem) !important;
    padding-right: clamp(0.64rem, 1.12vw, 1.08rem) !important;
    box-sizing: border-box !important;
    transform: none !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media .interface-rail-header > div:first-child,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media .interface-rail-header > div:first-child {
    justify-self: start !important;
    align-self: center !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    text-align: left !important;
    transform: none !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media .interface-rail .interface-rail-label,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media .interface-rail .interface-rail-label,
  html body.winterface-standalone #winterface.interface-system-media-expanded.is-winterface-maximized .interface-rail .interface-rail-label,
  html body.winterface-dev-build #winterface.interface-system-media-expanded.is-winterface-maximized .interface-rail .interface-rail-label {
    font-size: clamp(1.20rem, 1.68vw, 1.54rem) !important;
    line-height: 1.02 !important;
    text-align: left !important;
    letter-spacing: 0.06em !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media .interface-rail .interface-rail-subtitle,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media .interface-rail .interface-rail-subtitle,
  html body.winterface-standalone #winterface.interface-system-media-expanded.is-winterface-maximized .interface-rail .interface-rail-subtitle,
  html body.winterface-dev-build #winterface.interface-system-media-expanded.is-winterface-maximized .interface-rail .interface-rail-subtitle {
    font-size: clamp(1.22rem, 1.72vw, 1.58rem) !important;
    line-height: 1.06 !important;
    text-align: left !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media .interface-rail-header .interface-set-controls,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media .interface-rail-header .interface-set-controls {
    justify-self: end !important;
    align-self: center !important;
    justify-content: flex-end !important;
    margin-left: auto !important;
    padding-right: clamp(0.18rem, 0.50vw, 0.46rem) !important;
    max-width: 100% !important;
    transform: none !important;
    box-sizing: border-box !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media .interface-rail .interface-path strong,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media .interface-rail .interface-path strong,
  html body.winterface-standalone #winterface.interface-system-media-expanded.is-winterface-maximized .interface-rail .interface-path strong,
  html body.winterface-dev-build #winterface.interface-system-media-expanded.is-winterface-maximized .interface-rail .interface-path strong {
    font-size: clamp(1.48rem, 2.00vw, 1.92rem) !important;
    line-height: 1.06 !important;
    letter-spacing: -0.014em !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-is-media .interface-rail .interface-path span,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media .interface-rail .interface-path span,
  html body.winterface-standalone #winterface.interface-system-media-expanded.is-winterface-maximized .interface-rail .interface-path span,
  html body.winterface-dev-build #winterface.interface-system-media-expanded.is-winterface-maximized .interface-rail .interface-path span {
    font-size: clamp(1.02rem, 1.38vw, 1.26rem) !important;
    line-height: 1 !important;
  }

  html body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-output-card .interface-output-label,
  html body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-output-card .interface-output-label {
    font-size: clamp(1.28rem, 1.74vw, 1.66rem) !important;
    line-height: 1.06 !important;
    letter-spacing: 0.16em !important;
  }

  html body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-output-card strong,
  html body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-output-card strong {
    font-size: clamp(1.88rem, 2.48vw, 2.48rem) !important;
    line-height: 1.06 !important;
    letter-spacing: -0.02em !important;
  }

  html body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-system-list li,
  html body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-system-list li {
    font-size: clamp(1.40rem, 1.88vw, 1.82rem) !important;
    line-height: 1.20 !important;
  }

  html body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-signal-pulse-chip,
  html body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-signal-pulse-chip {
    font-size: clamp(1.02rem, 1.36vw, 1.26rem) !important;
    line-height: 1.06 !important;
    letter-spacing: 0.08em !important;
  }

  html body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-signal-pulse-readout,
  html body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-signal-pulse-readout {
    font-size: clamp(1.06rem, 1.38vw, 1.30rem) !important;
    line-height: 1.10 !important;
    letter-spacing: 0.08em !important;
  }

  html body.winterface-standalone #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-jump-link,
  html body.winterface-dev-build #winterface.interface-section:not(.interface-system-media-expanded) .interface-side-panel .interface-jump-link {
    font-size: clamp(1.36rem, 1.82vw, 1.76rem) !important;
    line-height: 1.08 !important;
    letter-spacing: 0.01em !important;
  }
}
/* === WInterface Solo v4.0 Iron Steel Tablet + Mid-Large Readability Parity v2 === */


/* === WInterface Solo v4.0 Iron Steel Galaxy/Tablet Readability Parity v3 ===
   Scope: Galaxy Tab S9 Ultra and general tablet-class Chrome viewports.
   This is intentionally stronger than v2 because tablets can enter the standalone
   phone-canvas path and then scale the 1366px WInterface canvas down. The typography
   lift is applied inside that tablet canvas without altering media geometry, card data,
   recorder logic, content, or ultrawide desktop rules. */
@media (pointer: coarse) and (min-width: 700px) and (min-height: 620px),
       (pointer: coarse) and (min-width: 620px) and (min-height: 700px) {
  html.winterface-standalone-tablet-canvas body.winterface-standalone #winterface.interface-section,
  body.winterface-standalone.winterface-standalone-tablet-canvas #winterface.interface-section,
  body.winterface-standalone.winterface-standalone-phone-canvas #winterface.interface-section,
  body.winterface-standalone #winterface.interface-section,
  body.winterface-dev-build #winterface.interface-section {
    --wi-tablet-readable-type-scale: 1.22;
  }

  html.winterface-standalone-tablet-canvas body.winterface-standalone .interface-section.winterface-standalone-interface .interface-status-bar,
  body.winterface-standalone.winterface-standalone-tablet-canvas .interface-section.winterface-standalone-interface .interface-status-bar,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-status-bar,
  body.winterface-standalone .interface-section.winterface-standalone-interface .interface-status-bar,
  body.winterface-dev-build #winterface.interface-section .interface-status-bar {
    font-size: clamp(1.18rem, 1.62vw, 1.42rem) !important;
    line-height: 1.08 !important;
  }

  html.winterface-standalone-tablet-canvas body.winterface-standalone .interface-section.winterface-standalone-interface .interface-system-status-pill,
  html.winterface-standalone-tablet-canvas body.winterface-standalone .interface-section.winterface-standalone-interface .interface-status-item,
  html.winterface-standalone-tablet-canvas body.winterface-standalone .interface-section.winterface-standalone-interface .interface-theme-toggle,
  body.winterface-standalone.winterface-standalone-tablet-canvas .interface-section.winterface-standalone-interface .interface-system-status-pill,
  body.winterface-standalone.winterface-standalone-tablet-canvas .interface-section.winterface-standalone-interface .interface-status-item,
  body.winterface-standalone.winterface-standalone-tablet-canvas .interface-section.winterface-standalone-interface .interface-theme-toggle,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-system-status-pill,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-status-item,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-theme-toggle,
  body.winterface-dev-build #winterface.interface-section .interface-system-status-pill,
  body.winterface-dev-build #winterface.interface-section .interface-status-item,
  body.winterface-dev-build #winterface.interface-section .interface-theme-toggle {
    font-size: clamp(1.08rem, 1.48vw, 1.32rem) !important;
    line-height: 1.08 !important;
    letter-spacing: 0.055em !important;
  }

  html.winterface-standalone-tablet-canvas body.winterface-standalone .interface-section.winterface-standalone-interface .interface-command-prefix,
  html.winterface-standalone-tablet-canvas body.winterface-standalone .interface-section.winterface-standalone-interface .interface-command-input,
  body.winterface-standalone.winterface-standalone-tablet-canvas .interface-section.winterface-standalone-interface .interface-command-prefix,
  body.winterface-standalone.winterface-standalone-tablet-canvas .interface-section.winterface-standalone-interface .interface-command-input,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-command-prefix,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-command-input,
  body.winterface-dev-build #winterface.interface-section .interface-command-prefix,
  body.winterface-dev-build #winterface.interface-section .interface-command-input {
    font-size: clamp(1.34rem, 1.86vw, 1.66rem) !important;
    line-height: 1.12 !important;
  }

  html.winterface-standalone-tablet-canvas body.winterface-standalone .interface-section.winterface-standalone-interface.interface-system-is-media .interface-rail-header,
  body.winterface-standalone.winterface-standalone-tablet-canvas .interface-section.winterface-standalone-interface.interface-system-is-media .interface-rail-header,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface.interface-system-is-media .interface-rail-header,
  body.winterface-dev-build #winterface.interface-section.interface-system-is-media .interface-rail-header {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    justify-content: stretch !important;
    justify-items: stretch !important;
    align-items: center !important;
    gap: clamp(0.58rem, 1.08vw, 1.02rem) !important;
    padding-left: clamp(0.52rem, 0.98vw, 0.90rem) !important;
    padding-right: clamp(0.70rem, 1.18vw, 1.12rem) !important;
    box-sizing: border-box !important;
    transform: none !important;
  }

  html.winterface-standalone-tablet-canvas body.winterface-standalone .interface-section.winterface-standalone-interface.interface-system-is-media .interface-rail-header > div:first-child,
  body.winterface-standalone.winterface-standalone-tablet-canvas .interface-section.winterface-standalone-interface.interface-system-is-media .interface-rail-header > div:first-child,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface.interface-system-is-media .interface-rail-header > div:first-child,
  body.winterface-dev-build #winterface.interface-section.interface-system-is-media .interface-rail-header > div:first-child {
    justify-self: start !important;
    text-align: left !important;
    min-width: 0 !important;
    transform: none !important;
  }

  html.winterface-standalone-tablet-canvas body.winterface-standalone .interface-section.winterface-standalone-interface.interface-system-is-media .interface-rail-header .interface-set-controls,
  body.winterface-standalone.winterface-standalone-tablet-canvas .interface-section.winterface-standalone-interface.interface-system-is-media .interface-rail-header .interface-set-controls,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface.interface-system-is-media .interface-rail-header .interface-set-controls,
  body.winterface-dev-build #winterface.interface-section.interface-system-is-media .interface-rail-header .interface-set-controls {
    justify-self: end !important;
    justify-content: flex-end !important;
    margin-left: auto !important;
    padding-right: clamp(0.20rem, 0.52vw, 0.50rem) !important;
    max-width: 100% !important;
    transform: none !important;
  }

  html.winterface-standalone-tablet-canvas body.winterface-standalone .interface-section.winterface-standalone-interface .interface-rail .interface-rail-label,
  body.winterface-standalone.winterface-standalone-tablet-canvas .interface-section.winterface-standalone-interface .interface-rail .interface-rail-label,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-rail .interface-rail-label,
  body.winterface-dev-build #winterface.interface-section .interface-rail .interface-rail-label {
    font-size: clamp(1.42rem, 2.04vw, 1.82rem) !important;
    line-height: 1.02 !important;
    letter-spacing: 0.06em !important;
    text-align: left !important;
  }

  html.winterface-standalone-tablet-canvas body.winterface-standalone .interface-section.winterface-standalone-interface .interface-rail .interface-rail-subtitle,
  body.winterface-standalone.winterface-standalone-tablet-canvas .interface-section.winterface-standalone-interface .interface-rail .interface-rail-subtitle,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-rail .interface-rail-subtitle,
  body.winterface-dev-build #winterface.interface-section .interface-rail .interface-rail-subtitle {
    font-size: clamp(1.44rem, 2.08vw, 1.86rem) !important;
    line-height: 1.06 !important;
    text-align: left !important;
  }

  html.winterface-standalone-tablet-canvas body.winterface-standalone .interface-section.winterface-standalone-interface .interface-rail .interface-path strong,
  body.winterface-standalone.winterface-standalone-tablet-canvas .interface-section.winterface-standalone-interface .interface-rail .interface-path strong,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-rail .interface-path strong,
  body.winterface-dev-build #winterface.interface-section .interface-rail .interface-path strong {
    font-size: clamp(1.78rem, 2.54vw, 2.30rem) !important;
    line-height: 1.06 !important;
    letter-spacing: -0.014em !important;
  }

  html.winterface-standalone-tablet-canvas body.winterface-standalone .interface-section.winterface-standalone-interface .interface-rail .interface-path span,
  body.winterface-standalone.winterface-standalone-tablet-canvas .interface-section.winterface-standalone-interface .interface-rail .interface-path span,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-rail .interface-path span,
  body.winterface-dev-build #winterface.interface-section .interface-rail .interface-path span {
    font-size: clamp(1.20rem, 1.70vw, 1.54rem) !important;
    line-height: 1 !important;
  }

  html.winterface-standalone-tablet-canvas body.winterface-standalone .interface-section.winterface-standalone-interface .interface-side-panel .interface-output-card .interface-output-label,
  body.winterface-standalone.winterface-standalone-tablet-canvas .interface-section.winterface-standalone-interface .interface-side-panel .interface-output-card .interface-output-label,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-side-panel .interface-output-card .interface-output-label,
  body.winterface-dev-build #winterface.interface-section .interface-side-panel .interface-output-card .interface-output-label {
    font-size: clamp(1.44rem, 2.02vw, 1.86rem) !important;
    line-height: 1.06 !important;
    letter-spacing: 0.15em !important;
  }

  html.winterface-standalone-tablet-canvas body.winterface-standalone .interface-section.winterface-standalone-interface .interface-side-panel .interface-output-card strong,
  body.winterface-standalone.winterface-standalone-tablet-canvas .interface-section.winterface-standalone-interface .interface-side-panel .interface-output-card strong,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-side-panel .interface-output-card strong,
  body.winterface-dev-build #winterface.interface-section .interface-side-panel .interface-output-card strong {
    font-size: clamp(2.10rem, 2.92vw, 2.78rem) !important;
    line-height: 1.04 !important;
  }

  html.winterface-standalone-tablet-canvas body.winterface-standalone .interface-section.winterface-standalone-interface .interface-side-panel .interface-system-list li,
  body.winterface-standalone.winterface-standalone-tablet-canvas .interface-section.winterface-standalone-interface .interface-side-panel .interface-system-list li,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-side-panel .interface-system-list li,
  html.winterface-standalone-tablet-canvas body.winterface-standalone .interface-section.winterface-standalone-interface .interface-side-panel .interface-signal-detail,
  body.winterface-standalone.winterface-standalone-tablet-canvas .interface-section.winterface-standalone-interface .interface-side-panel .interface-signal-detail,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-side-panel .interface-signal-detail,
  body.winterface-dev-build #winterface.interface-section .interface-side-panel .interface-system-list li,
  body.winterface-dev-build #winterface.interface-section .interface-side-panel .interface-signal-detail {
    font-size: clamp(1.50rem, 2.12vw, 2.02rem) !important;
    line-height: 1.18 !important;
  }

  html.winterface-standalone-tablet-canvas body.winterface-standalone .interface-section.winterface-standalone-interface .interface-side-panel .interface-signal-pulse-label,
  html.winterface-standalone-tablet-canvas body.winterface-standalone .interface-section.winterface-standalone-interface .interface-side-panel .interface-signal-pulse-chip,
  html.winterface-standalone-tablet-canvas body.winterface-standalone .interface-section.winterface-standalone-interface .interface-side-panel .interface-signal-pulse-readout,
  body.winterface-standalone.winterface-standalone-tablet-canvas .interface-section.winterface-standalone-interface .interface-side-panel .interface-signal-pulse-label,
  body.winterface-standalone.winterface-standalone-tablet-canvas .interface-section.winterface-standalone-interface .interface-side-panel .interface-signal-pulse-chip,
  body.winterface-standalone.winterface-standalone-tablet-canvas .interface-section.winterface-standalone-interface .interface-side-panel .interface-signal-pulse-readout,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-side-panel .interface-signal-pulse-label,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-side-panel .interface-signal-pulse-chip,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-side-panel .interface-signal-pulse-readout,
  body.winterface-dev-build #winterface.interface-section .interface-side-panel .interface-signal-pulse-label,
  body.winterface-dev-build #winterface.interface-section .interface-side-panel .interface-signal-pulse-chip,
  body.winterface-dev-build #winterface.interface-section .interface-side-panel .interface-signal-pulse-readout {
    font-size: clamp(1.18rem, 1.68vw, 1.48rem) !important;
    line-height: 1.10 !important;
  }

  html.winterface-standalone-tablet-canvas body.winterface-standalone .interface-section.winterface-standalone-interface .interface-side-panel .interface-jump-link,
  body.winterface-standalone.winterface-standalone-tablet-canvas .interface-section.winterface-standalone-interface .interface-side-panel .interface-jump-link,
  body.winterface-standalone.winterface-standalone-phone-canvas .interface-section.winterface-standalone-interface .interface-side-panel .interface-jump-link,
  body.winterface-dev-build #winterface.interface-section .interface-side-panel .interface-jump-link {
    font-size: clamp(1.48rem, 2.08vw, 1.94rem) !important;
    line-height: 1.08 !important;
  }
}
/* === WInterface Solo v4.0 Iron Steel Galaxy/Tablet Readability Parity v3 === */

/* === WInterface Solo v4.0 Iron Steel Galaxy Tablet Expanded Bay Label Left Align Adjustment ===
   Scope: tablet-class Expanded/Snap media view only. Keeps the seven-orb selector
   position intact while forcing the Bay title/subtitle text block to align left
   inside its own header column. No media geometry, JS, content, or desktop changes. */
@media (pointer: coarse) and (min-width: 700px) and (min-height: 620px),
       (pointer: coarse) and (min-width: 620px) and (min-height: 700px) {
  html.winterface-standalone-tablet-canvas body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-header > div:first-child,
  body.winterface-standalone.winterface-standalone-tablet-canvas #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-header > div:first-child,
  body.winterface-standalone.winterface-standalone-phone-canvas #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-header > div:first-child,
  body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-header > div:first-child,
  body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-header > div:first-child {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    justify-self: start !important;
    text-align: left !important;
    width: auto !important;
    min-width: clamp(4.85rem, 9.4vw, 7.2rem) !important;
    max-width: clamp(7.8rem, 15vw, 11rem) !important;
    transform: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  html.winterface-standalone-tablet-canvas body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-label,
  html.winterface-standalone-tablet-canvas body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-subtitle,
  body.winterface-standalone.winterface-standalone-tablet-canvas #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-label,
  body.winterface-standalone.winterface-standalone-tablet-canvas #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-subtitle,
  body.winterface-standalone.winterface-standalone-phone-canvas #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-label,
  body.winterface-standalone.winterface-standalone-phone-canvas #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-subtitle,
  body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-label,
  body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-subtitle,
  body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-label,
  body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-subtitle {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    text-align: left !important;
    align-self: flex-start !important;
    justify-self: start !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    transform: none !important;
  }
}
/* === WInterface Solo v4.0 Iron Steel Galaxy Tablet Expanded Bay Label Left Align Adjustment === */

/* === WInterface Solo v4.0 Iron Steel Tablet Keyboard Readability Lock ===
   Scope: tablet-class command-input focus only. Keeps the accepted Galaxy/tablet
   readability layer active while Chrome shrinks the visual viewport for the
   on-screen keyboard. This prevents the WInterface text from falling back to the
   smaller phone-canvas typography while preserving media geometry and layout. */
@media (pointer: coarse) and (min-width: 620px) {
  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone #winterface.interface-section,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock #winterface.interface-section {
    --wi-tablet-readable-type-scale: 1.22;
  }

  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone .interface-section.winterface-standalone-interface .interface-status-bar,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock .interface-section.winterface-standalone-interface .interface-status-bar {
    font-size: clamp(1.18rem, 1.62vw, 1.42rem) !important;
    line-height: 1.08 !important;
  }

  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone .interface-section.winterface-standalone-interface .interface-system-status-pill,
  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone .interface-section.winterface-standalone-interface .interface-status-item,
  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone .interface-section.winterface-standalone-interface .interface-theme-toggle,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock .interface-section.winterface-standalone-interface .interface-system-status-pill,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock .interface-section.winterface-standalone-interface .interface-status-item,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock .interface-section.winterface-standalone-interface .interface-theme-toggle {
    font-size: clamp(1.08rem, 1.48vw, 1.32rem) !important;
    line-height: 1.08 !important;
    letter-spacing: 0.055em !important;
  }

  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone .interface-section.winterface-standalone-interface .interface-command-prefix,
  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone .interface-section.winterface-standalone-interface .interface-command-input,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock .interface-section.winterface-standalone-interface .interface-command-prefix,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock .interface-section.winterface-standalone-interface .interface-command-input {
    font-size: clamp(1.34rem, 1.86vw, 1.66rem) !important;
    line-height: 1.12 !important;
  }

  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone .interface-section.winterface-standalone-interface.interface-system-is-media .interface-rail-header,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock .interface-section.winterface-standalone-interface.interface-system-is-media .interface-rail-header {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    justify-content: stretch !important;
    justify-items: stretch !important;
    align-items: center !important;
    gap: clamp(0.58rem, 1.08vw, 1.02rem) !important;
    padding-left: clamp(0.52rem, 0.98vw, 0.90rem) !important;
    padding-right: clamp(0.70rem, 1.18vw, 1.12rem) !important;
    box-sizing: border-box !important;
    transform: none !important;
  }

  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone .interface-section.winterface-standalone-interface.interface-system-is-media .interface-rail-header > div:first-child,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock .interface-section.winterface-standalone-interface.interface-system-is-media .interface-rail-header > div:first-child {
    justify-self: start !important;
    text-align: left !important;
    min-width: 0 !important;
    transform: none !important;
  }

  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone .interface-section.winterface-standalone-interface.interface-system-is-media .interface-rail-header .interface-set-controls,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock .interface-section.winterface-standalone-interface.interface-system-is-media .interface-rail-header .interface-set-controls {
    justify-self: end !important;
    justify-content: flex-end !important;
    margin-left: auto !important;
    padding-right: clamp(0.20rem, 0.52vw, 0.50rem) !important;
    max-width: 100% !important;
    transform: none !important;
  }

  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone .interface-section.winterface-standalone-interface .interface-rail .interface-rail-label,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock .interface-section.winterface-standalone-interface .interface-rail .interface-rail-label {
    font-size: clamp(1.42rem, 2.04vw, 1.82rem) !important;
    line-height: 1.02 !important;
    letter-spacing: 0.06em !important;
    text-align: left !important;
  }

  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone .interface-section.winterface-standalone-interface .interface-rail .interface-rail-subtitle,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock .interface-section.winterface-standalone-interface .interface-rail .interface-rail-subtitle {
    font-size: clamp(1.44rem, 2.08vw, 1.86rem) !important;
    line-height: 1.06 !important;
    text-align: left !important;
  }

  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone .interface-section.winterface-standalone-interface .interface-rail .interface-path strong,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock .interface-section.winterface-standalone-interface .interface-rail .interface-path strong {
    font-size: clamp(1.78rem, 2.54vw, 2.30rem) !important;
    line-height: 1.06 !important;
    letter-spacing: -0.014em !important;
  }

  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone .interface-section.winterface-standalone-interface .interface-rail .interface-path span,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock .interface-section.winterface-standalone-interface .interface-rail .interface-path span {
    font-size: clamp(1.20rem, 1.70vw, 1.54rem) !important;
    line-height: 1 !important;
  }

  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone .interface-section.winterface-standalone-interface .interface-side-panel .interface-output-card .interface-output-label,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock .interface-section.winterface-standalone-interface .interface-side-panel .interface-output-card .interface-output-label {
    font-size: clamp(1.44rem, 2.02vw, 1.86rem) !important;
    line-height: 1.06 !important;
    letter-spacing: 0.15em !important;
  }

  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone .interface-section.winterface-standalone-interface .interface-side-panel .interface-output-card strong,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock .interface-section.winterface-standalone-interface .interface-side-panel .interface-output-card strong {
    font-size: clamp(2.10rem, 2.92vw, 2.78rem) !important;
    line-height: 1.04 !important;
  }

  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone .interface-section.winterface-standalone-interface .interface-side-panel .interface-system-list li,
  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone .interface-section.winterface-standalone-interface .interface-side-panel .interface-signal-detail,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock .interface-section.winterface-standalone-interface .interface-side-panel .interface-system-list li,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock .interface-section.winterface-standalone-interface .interface-side-panel .interface-signal-detail {
    font-size: clamp(1.50rem, 2.12vw, 2.02rem) !important;
    line-height: 1.18 !important;
  }

  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone .interface-section.winterface-standalone-interface .interface-side-panel .interface-signal-pulse-label,
  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone .interface-section.winterface-standalone-interface .interface-side-panel .interface-signal-pulse-chip,
  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone .interface-section.winterface-standalone-interface .interface-side-panel .interface-signal-pulse-readout,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock .interface-section.winterface-standalone-interface .interface-side-panel .interface-signal-pulse-label,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock .interface-section.winterface-standalone-interface .interface-side-panel .interface-signal-pulse-chip,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock .interface-section.winterface-standalone-interface .interface-side-panel .interface-signal-pulse-readout {
    font-size: clamp(1.18rem, 1.68vw, 1.48rem) !important;
    line-height: 1.10 !important;
  }

  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone .interface-section.winterface-standalone-interface .interface-side-panel .interface-jump-link,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock .interface-section.winterface-standalone-interface .interface-side-panel .interface-jump-link {
    font-size: clamp(1.48rem, 2.08vw, 1.94rem) !important;
    line-height: 1.08 !important;
  }

  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-header > div:first-child,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-header > div:first-child {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    justify-self: start !important;
    text-align: left !important;
    width: auto !important;
    min-width: clamp(4.85rem, 9.4vw, 7.2rem) !important;
    max-width: clamp(7.8rem, 15vw, 11rem) !important;
    transform: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-label,
  html.winterface-standalone-tablet-keyboard-lock body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-subtitle,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-label,
  body.winterface-standalone.winterface-standalone-tablet-keyboard-lock #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-rail-subtitle {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    text-align: left !important;
    align-self: flex-start !important;
    justify-self: start !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    transform: none !important;
  }
}
/* === WInterface Solo v4.0 Iron Steel Tablet Keyboard Readability Lock === */


/* === WInterface Solo v4.0 Document Player Frame ===
   Lets Bay 7 PDF/DOCX/ePub cards use the same WInterface Media Player frame
   pattern as website cards without changing existing video, website, recorder,
   desktop, tablet, or ultrawide behavior. */
.interface-system .interface-video-frame.is-interface-file-frame {
  background:
    radial-gradient(circle at 18% 0%, rgba(68, 200, 255, 0.13), transparent 34%),
    linear-gradient(135deg, rgba(8, 17, 29, 0.98), rgba(11, 20, 32, 0.94));
  border-color: rgba(174, 184, 197, 0.58);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.04),
    0 0 28px rgba(68, 200, 255, 0.16),
    0 0 42px rgba(174, 184, 197, 0.10);
}

.interface-system .interface-video-frame.is-interface-file-frame iframe[data-interface-media-frame] {
  width: 100%;
  height: 100%;
  border: 0;
  background: #050a10;
}
/* === WInterface Solo v4.0 Document Player Frame === */
/* === WInterface Solo DEV badge === */
.dev-environment-banner {
  position: fixed;
  left: 50%;
  bottom: 1rem;
  z-index: 9999;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .55rem .9rem;
  border: 1px solid rgba(104, 232, 255, .48);
  border-radius: 999px;
  background: rgba(8, 13, 18, .78);
  color: rgba(232, 245, 255, .94);
  font-family: Inter, system-ui, sans-serif;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
  box-shadow: 0 0 24px rgba(104, 232, 255, .18);
  backdrop-filter: blur(16px);
}
.dev-environment-banner span {
  width: .45rem;
  height: .45rem;
  border-radius: 999px;
  background: var(--theme-accent, #68e8ff);
  box-shadow: 0 0 14px rgba(104, 232, 255, .9);
}
/* === WInterface Solo DEV badge === */

/* === WInterface v4.0 Iron Steel Right-Nav Controller Cyan Border Section ===
   Scope: default/Iron Steel theme only. Restores the right-nav Bay / Back / Next
   controller frame to the arc-reactor cyan treatment while preserving all layout,
   button logic, media behavior, and other theme styling. */
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-side-panel .interface-signal-pulse,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-side-panel .interface-signal-pulse {
  border-color: rgba(116, 234, 255, 0.78) !important;
  box-shadow:
    0 0 0 1px rgba(116, 234, 255, 0.18),
    0 14px 30px rgba(0, 0, 0, 0.26),
    0 0 24px rgba(116, 234, 255, 0.18),
    0 0 44px rgba(91, 190, 255, 0.10),
    inset 0 0 22px rgba(116, 234, 255, 0.055) !important;
}

html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-side-panel .interface-signal-pulse::before,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-side-panel .interface-signal-pulse::before {
  background: linear-gradient(
    90deg,
    transparent,
    rgba(116, 234, 255, 0.24),
    rgba(91, 190, 255, 0.14),
    transparent
  ) !important;
  opacity: 0.50 !important;
}
/* === WInterface v4.0 Iron Steel Right-Nav Controller Cyan Border Section === */


/* === WInterface Solo v4.0 Global Hide Controls Slot Authority ===
   Single adjustable placement authority for the Hide Controls oval in standard view.
   Scope: controls visible only, not Expanded/Snap view, command bar visible or hidden.
   This intentionally does not target the Show Controls state. Adjust only this variable
   to move the Hide Controls button in both normal standard-view command-bar states. */
:root {
  --winterface-standard-hide-controls-y: 0.15rem;
}

body.winterface-standalone:not(.winterface-media-controls-hidden) #winterface.interface-section.interface-system-is-media:not(.interface-media-controls-hidden):not(.interface-system-media-expanded) .interface-media-controls-toggle,
body.winterface-dev-build:not(.winterface-media-controls-hidden) #winterface.interface-section.interface-system-is-media:not(.interface-media-controls-hidden):not(.interface-system-media-expanded) .interface-media-controls-toggle {
  --winterface-media-controls-toggle-transform: translateY(var(--winterface-standard-hide-controls-y)) scale(1);
  transform: translateY(var(--winterface-standard-hide-controls-y)) scale(1) !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  position: relative !important;
  z-index: 35 !important;
}

body.winterface-standalone:not(.winterface-media-controls-hidden) #winterface.interface-section.interface-system-is-media:not(.interface-media-controls-hidden):not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
body.winterface-standalone:not(.winterface-media-controls-hidden) #winterface.interface-section.interface-system-is-media:not(.interface-media-controls-hidden):not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
body.winterface-standalone:not(.winterface-media-controls-hidden) #winterface.interface-section.interface-system-is-media:not(.interface-media-controls-hidden):not(.interface-system-media-expanded) .interface-media-controls-toggle:active,
body.winterface-dev-build:not(.winterface-media-controls-hidden) #winterface.interface-section.interface-system-is-media:not(.interface-media-controls-hidden):not(.interface-system-media-expanded) .interface-media-controls-toggle:hover,
body.winterface-dev-build:not(.winterface-media-controls-hidden) #winterface.interface-section.interface-system-is-media:not(.interface-media-controls-hidden):not(.interface-system-media-expanded) .interface-media-controls-toggle:focus-visible,
body.winterface-dev-build:not(.winterface-media-controls-hidden) #winterface.interface-section.interface-system-is-media:not(.interface-media-controls-hidden):not(.interface-system-media-expanded) .interface-media-controls-toggle:active {
  transform: translateY(var(--winterface-standard-hide-controls-y)) scale(1) !important;
}
/* === WInterface Solo v4.0 Global Hide Controls Slot Authority === */

/* === WInterface Solo v4.0 Global Media Mute Orb Y Authority ===
   Single adjustable vertical nudge for the Mute / Unmute Media audio orb.
   Scope: WInterface media mode in standard and Expanded/Snap view, command bar visible or hidden.
   Adjust only --winterface-media-mute-y-nudge to move the orb consistently in both media views. */
:root {
  --winterface-media-mute-y-nudge: 0.42rem;
  --winterface-standard-media-mute-base-y: 0.04rem;
  --winterface-expanded-media-mute-base-y: -0.14rem;
}

html body.winterface-standalone #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute,
html body.winterface-dev-build #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute,
html body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute,
html body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute {
  transform: translateY(calc(var(--winterface-standard-media-mute-base-y) + var(--winterface-media-mute-y-nudge))) !important;
}

html body.winterface-standalone #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute:hover,
html body.winterface-standalone #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute:focus-visible,
html body.winterface-dev-build #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute:hover,
html body.winterface-dev-build #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute:focus-visible,
html body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute:hover,
html body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute:focus-visible,
html body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute:hover,
html body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-media-mute:focus-visible {
  transform: translateY(calc(var(--winterface-standard-media-mute-base-y) + var(--winterface-media-mute-y-nudge) - 0.08rem)) scale(1.03) !important;
}

html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute,
html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute,
html body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute,
html body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute {
  transform: translateY(calc(var(--winterface-expanded-media-mute-base-y) + var(--winterface-media-mute-y-nudge))) scale(0.98) !important;
}

html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute:hover,
html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute:focus-visible,
html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute:hover,
html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute:focus-visible,
html body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute:hover,
html body.winterface-commandbar-hidden.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute:focus-visible,
html body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute:hover,
html body.winterface-commandbar-hidden.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded .interface-media-mute:focus-visible {
  transform: translateY(calc(var(--winterface-expanded-media-mute-base-y) + var(--winterface-media-mute-y-nudge) - 0.08rem)) scale(1.03) !important;
}
/* === WInterface Solo v4.0 Global Media Mute Orb Y Authority === */


/* === F11 Fullscreen Bay Header Layout ===
   Scope: browser fullscreen media header only. Keeps the Bay label/subtitle
   contained and aligns the bay-selector orb stack within the header. */
html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media .interface-rail-header {
  display: grid !important;
  grid-template-columns: 2.82rem minmax(0, 1fr) !important;
  align-items: center !important;
  justify-content: stretch !important;
  justify-items: stretch !important;
  column-gap: 0.28rem !important;
  padding-left: 0.68rem !important;
  padding-right: 0.34rem !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media .interface-rail-header > div:first-child {
  grid-column: 1 !important;
  justify-self: start !important;
  align-self: center !important;
  width: 2.82rem !important;
  min-width: 2.82rem !important;
  max-width: 2.82rem !important;
  text-align: left !important;
  transform: none !important;
  overflow: hidden !important;
  z-index: 1 !important;
}

html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media .interface-rail-label,
html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media .interface-rail-subtitle {
  display: block !important;
  width: auto !important;
  max-width: 2.82rem !important;
  text-align: left !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  transform: none !important;
}

html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media .interface-rail-label {
  font-size: 0.50rem !important;
  line-height: 0.88 !important;
  letter-spacing: 0.020em !important;
}

html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media .interface-rail-subtitle {
  margin-top: 0.08rem !important;
  font-size: 0.52rem !important;
  line-height: 0.90 !important;
  letter-spacing: 0.002em !important;
}

html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media .interface-rail-header .interface-set-controls {
  grid-column: 2 !important;
  justify-self: center !important;
  align-self: center !important;
  justify-content: center !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  width: auto !important;
  max-width: 100% !important;
  transform: none !important;
  overflow: visible !important;
  z-index: 2 !important;
}

html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media .interface-rail-header .interface-set-button {
  width: 1.03rem !important;
  min-width: 1.03rem !important;
  max-width: 1.03rem !important;
  height: 1.03rem !important;
  min-height: 1.03rem !important;
  max-height: 1.03rem !important;
  flex: 0 0 1.03rem !important;
  aspect-ratio: 1 / 1 !important;
  border-radius: 50% !important;
  box-sizing: border-box !important;
}

html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media .interface-rail-header .interface-set-button span {
  inset: 0.28rem !important;
  border-radius: 50% !important;
}

html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-rail-header .interface-set-controls {
  gap: 0.18rem !important;
  min-width: 0 !important;
}

html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header {
  grid-template-columns: 4.15rem minmax(0, 1fr) !important;
  column-gap: 0.20rem !important;
  padding-left: 0.62rem !important;
  padding-right: 0.22rem !important;
}

html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header > div:first-child {
  width: 4.15rem !important;
  min-width: 4.15rem !important;
  max-width: 4.15rem !important;
  justify-self: start !important;
  text-align: left !important;
  overflow: hidden !important;
}

html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-label,
html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-subtitle {
  max-width: 4.15rem !important;
  text-align: left !important;
}

html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-label {
  font-size: 0.74rem !important;
  line-height: 0.94 !important;
}

html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-subtitle {
  margin-top: 0.08rem !important;
  font-size: 0.82rem !important;
  line-height: 0.96 !important;
}

html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header .interface-set-controls {
  justify-self: center !important;
  justify-content: center !important;
  gap: 0.22rem !important;
  min-width: 0 !important;
  width: auto !important;
  max-width: 100% !important;
}

html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header .interface-set-button {
  width: 1.08rem !important;
  min-width: 1.08rem !important;
  max-width: 1.08rem !important;
  height: 1.08rem !important;
  min-height: 1.08rem !important;
  max-height: 1.08rem !important;
  flex-basis: 1.08rem !important;
}

html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header .interface-set-button span {
  inset: 0.29rem !important;
}
/* === F11 Fullscreen Bay Header Layout === */

/* === F11 Normal Bay Header Type Scale ===
   Scope: browser fullscreen normal media header only. Keeps the Bay label
   and subtitle scaled inside the title column without changing the orb stack. */
html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-rail-header > div:first-child {
  width: 3.10rem !important;
  min-width: 3.10rem !important;
  max-width: 3.10rem !important;
  justify-self: start !important;
  text-align: left !important;
  overflow: hidden !important;
}

html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-rail-label,
html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-rail-subtitle {
  max-width: 3.10rem !important;
  text-align: left !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  transform: none !important;
}

html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-rail-label {
  font-size: 0.76rem !important;
  line-height: 0.90 !important;
  letter-spacing: 0.008em !important;
}

html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media:not(.interface-system-media-expanded) .interface-rail-subtitle {
  margin-top: 0.06rem !important;
  font-size: 0.74rem !important;
  line-height: 0.92 !important;
  letter-spacing: 0 !important;
}
/* === F11 Normal Bay Header Type Scale === */


/* Blue Chrome visual layer. */
/* =========================
   WINTERFACE XAVIER BLUE CHROME THEME
   WInterface-only scope. No page-background theme wash.
   Palette reference: Xavier Blue #0C2340, Running Man Blue #0033A0,
   Cura Blue #6CACE4, Xavier Grey #9EA2A2, D'artagnan Grey #D1D1CE.
   Gold/yellow intentionally excluded.
========================= */

html[data-winterface-theme="blue-chrome"] #winterface.interface-section {
  --xu-blue: #0c2340;
  --xu-blue-dark: #061426;
  --xu-blue-deep: #020812;
  --xu-running-blue: #0033a0;
  --xu-running-blue-soft: rgba(0, 51, 160, 0.22);
  --xu-running-blue-glow: rgba(0, 51, 160, 0.44);
  --xu-cura-blue: #6cace4;
  --xu-cura-blue-soft: rgba(108, 172, 228, 0.20);
  --xu-cura-blue-glow: rgba(108, 172, 228, 0.48);
  --xu-grey: #9ea2a2;
  --xu-grey-soft: rgba(158, 162, 162, 0.22);
  --xu-dartagnan-grey: #d1d1ce;
  --xu-dartagnan-soft: rgba(209, 209, 206, 0.16);
  --xu-white-blue: #f3f8fc;
  --xu-text: #f6f9fc;
  --xu-muted: #c8d7e6;
  --xu-dim: #8fa1b5;
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section::before {
  background: linear-gradient(
    90deg,
    transparent,
    rgba(12, 35, 64, 0.72),
    rgba(0, 51, 160, 0.62),
    rgba(108, 172, 228, 0.44),
    rgba(158, 162, 162, 0.26),
    transparent
  );
  box-shadow:
    0 0 20px rgba(0, 51, 160, 0.22),
    0 0 38px rgba(108, 172, 228, 0.16);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-shell {
  isolation: isolate;
  border-color: rgba(108, 172, 228, 0.34);
  background:
    radial-gradient(circle at 10% 12%, rgba(0, 51, 160, 0.32), transparent 36%),
    radial-gradient(circle at 88% 16%, rgba(108, 172, 228, 0.20), transparent 38%),
    radial-gradient(circle at 48% 94%, rgba(158, 162, 162, 0.12), transparent 42%),
    linear-gradient(145deg, rgba(243, 248, 252, 0.070), rgba(243, 248, 252, 0.020)),
    linear-gradient(145deg, #07172c, #020812 74%);
  box-shadow:
    0 34px 110px rgba(0, 0, 0, 0.68),
    0 0 0 1px rgba(108, 172, 228, 0.10),
    0 0 76px rgba(0, 51, 160, 0.26),
    0 0 94px rgba(108, 172, 228, 0.12),
    inset 0 0 74px rgba(243, 248, 252, 0.035);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-shell::before {
  border-color: rgba(108, 172, 228, 0.28);
  box-shadow:
    inset 0 0 0 1px rgba(209, 209, 206, 0.08),
    inset 0 0 46px rgba(0, 51, 160, 0.07);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-shell::after {
  background-image:
    linear-gradient(rgba(108, 172, 228, 0.052) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 51, 160, 0.070) 1px, transparent 1px),
    linear-gradient(115deg, transparent 0 47%, rgba(209, 209, 206, 0.052) 48%, transparent 50% 100%),
    radial-gradient(circle at var(--pointer-x, 50%) var(--pointer-y, 50%), rgba(108, 172, 228, 0.18), transparent 30%);
  background-size: 42px 42px, 42px 42px, 170px 170px, auto;
  opacity: 0.74;
  mask-image: radial-gradient(circle at center, #000, transparent 86%);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-ambient {
  opacity: 0.94;
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-orbit {
  border-color: rgba(108, 172, 228, 0.21);
  box-shadow:
    inset 0 0 30px rgba(0, 51, 160, 0.09),
    0 0 38px rgba(0, 51, 160, 0.14),
    0 0 62px rgba(108, 172, 228, 0.10);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-orbit-one {
  border-top-color: rgba(108, 172, 228, 0.72);
  border-right-color: rgba(0, 51, 160, 0.58);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-orbit-two {
  border-bottom-color: rgba(209, 209, 206, 0.42);
  border-left-color: rgba(108, 172, 228, 0.46);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-scan {
  background: linear-gradient(
    180deg,
    transparent,
    rgba(0, 51, 160, 0.16),
    rgba(108, 172, 228, 0.12),
    rgba(209, 209, 206, 0.055),
    transparent
  );
  filter: blur(1.5px);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-status-bar,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-rail,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-core,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-side-panel {
  background:
    linear-gradient(145deg, rgba(7, 23, 44, 0.93), rgba(2, 8, 18, 0.80)),
    rgba(6, 20, 38, 0.86);
  border-color: rgba(108, 172, 228, 0.23);
  box-shadow:
    inset 0 0 34px rgba(243, 248, 252, 0.026),
    0 0 0 1px rgba(209, 209, 206, 0.020),
    0 18px 48px rgba(0, 0, 0, 0.34);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-core::before {
  background:
    radial-gradient(circle at 50% 18%, rgba(0, 51, 160, 0.25), transparent 40%),
    radial-gradient(circle at 86% 70%, rgba(108, 172, 228, 0.11), transparent 42%),
    linear-gradient(135deg, rgba(243, 248, 252, 0.034), transparent 50%);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-status-bar {
  color: var(--xu-white-blue);
  text-shadow: 0 0 12px rgba(108, 172, 228, 0.28);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-status-bar > span,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-status-bar > .interface-system-toggle {
  border-color: rgba(108, 172, 228, 0.24);
  background:
    linear-gradient(145deg, rgba(0, 51, 160, 0.115), rgba(108, 172, 228, 0.050)),
    rgba(243, 248, 252, 0.026);
  box-shadow:
    0 0 0 1px rgba(108, 172, 228, 0.035),
    0 0 18px rgba(0, 51, 160, 0.110),
    inset 0 0 16px rgba(108, 172, 228, 0.022);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-system-toggle i,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-status-bar > span:nth-child(1) i {
  background: var(--xu-cura-blue);
  box-shadow:
    0 0 10px rgba(108, 172, 228, 0.98),
    0 0 24px rgba(108, 172, 228, 0.58),
    0 0 44px rgba(0, 51, 160, 0.28);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-system-toggle i::after,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-status-bar > span:nth-child(1) i::after {
  background: radial-gradient(circle, rgba(108, 172, 228, 0.42), rgba(0, 51, 160, 0.14) 38%, transparent 70%);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-status-bar > span:nth-child(3) i {
  background: var(--xu-dartagnan-grey);
  box-shadow:
    0 0 10px rgba(209, 209, 206, 0.76),
    0 0 22px rgba(108, 172, 228, 0.34);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-rail-label,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-output-label,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-response .panel-label {
  color: var(--xu-cura-blue) !important;
  text-shadow:
    0 0 10px rgba(108, 172, 228, 0.58),
    0 0 22px rgba(108, 172, 228, 0.20);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-rail-subtitle,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-response p:not(.panel-label),
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-system-list li,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-showcase-caption p,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-signal-chip strong {
  color: var(--xu-muted) !important;
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-response h3,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-output-card strong,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-jump-link,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-path strong,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-showcase-caption strong {
  color: var(--xu-text);
}

/* Contextual bay colors: Active Pathways = Xavier Blue, Operational = Running Man Blue, Showcase = Cura Blue/Grey. */
html[data-winterface-theme="blue-chrome"] #winterface.interface-section.interface-system-set-primary,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-shell {
  --interface-accent: var(--xu-cura-blue);
  --interface-accent-rgb: 108, 172, 228;
  --interface-accent-text: #b8dcf7;
  --interface-accent-soft: rgba(108, 172, 228, 0.125);
  --interface-accent-border: rgba(108, 172, 228, 0.60);
  --interface-accent-border-strong: rgba(184, 220, 247, 0.76);
  --interface-accent-glow: rgba(108, 172, 228, 0.28);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section.interface-system-set-operations {
  --interface-accent: var(--xu-running-blue);
  --interface-accent-rgb: 0, 51, 160;
  --interface-accent-text: #8fb4ff;
  --interface-accent-soft: rgba(0, 51, 160, 0.140);
  --interface-accent-border: rgba(0, 51, 160, 0.64);
  --interface-accent-border-strong: rgba(143, 180, 255, 0.78);
  --interface-accent-glow: rgba(0, 51, 160, 0.32);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section.interface-system-set-media {
  --interface-accent: var(--xu-grey);
  --interface-accent-rgb: 158, 162, 162;
  --interface-accent-text: #d1d1ce;
  --interface-accent-soft: rgba(158, 162, 162, 0.120);
  --interface-accent-border: rgba(158, 162, 162, 0.55);
  --interface-accent-border-strong: rgba(209, 209, 206, 0.78);
  --interface-accent-glow: rgba(158, 162, 162, 0.22);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-path {
  border-color: rgba(var(--interface-accent-rgb), 0.24);
  background:
    linear-gradient(145deg, rgba(var(--interface-accent-rgb), 0.070), rgba(243, 248, 252, 0.028)),
    rgba(243, 248, 252, 0.026);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-path:hover,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-path:focus-visible,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-path.is-active {
  color: var(--xu-text);
  border-color: var(--interface-accent-border);
  background:
    linear-gradient(145deg, var(--interface-accent-soft), rgba(243, 248, 252, 0.045)),
    rgba(var(--interface-accent-rgb), 0.070);
  box-shadow:
    0 0 0 1px rgba(var(--interface-accent-rgb), 0.060),
    0 0 24px var(--interface-accent-glow),
    inset 0 0 24px rgba(var(--interface-accent-rgb), 0.040);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-path span {
  color: var(--interface-accent-text);
  background:
    radial-gradient(circle at 36% 28%, rgba(243, 248, 252, 0.26), transparent 25%),
    radial-gradient(circle at 50% 52%, rgba(var(--interface-accent-rgb), 0.25), rgba(var(--interface-accent-rgb), 0.075) 58%, rgba(12, 35, 64, 0.26) 100%);
  border-color: rgba(var(--interface-accent-rgb), 0.38);
  box-shadow:
    inset 0 0 14px rgba(var(--interface-accent-rgb), 0.10),
    0 0 18px rgba(var(--interface-accent-rgb), 0.14);
  text-shadow:
    0 1px 2px rgba(0, 0, 0, 0.68),
    0 0 10px rgba(var(--interface-accent-rgb), 0.54);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-path:hover span,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-path:focus-visible span,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-path.is-active span {
  color: #ffffff;
  border-color: var(--interface-accent-border-strong);
  background:
    radial-gradient(circle at 36% 28%, rgba(243, 248, 252, 0.34), transparent 25%),
    radial-gradient(circle at 50% 52%, rgba(var(--interface-accent-rgb), 0.34), rgba(var(--interface-accent-rgb), 0.13) 58%, rgba(12, 35, 64, 0.18) 100%);
  box-shadow:
    inset 0 0 16px rgba(var(--interface-accent-rgb), 0.18),
    0 0 22px rgba(var(--interface-accent-rgb), 0.28),
    0 0 40px rgba(var(--interface-accent-rgb), 0.14);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-output-card,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-video-frame,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-showcase-frame,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-command-line,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-signal-chip,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-playback-status,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-media-toggle,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-jump-link {
  border-color: rgba(108, 172, 228, 0.28);
  background:
    linear-gradient(145deg, rgba(108, 172, 228, 0.100), rgba(12, 35, 64, 0.20)),
    rgba(243, 248, 252, 0.040);
  box-shadow:
    0 0 0 1px rgba(108, 172, 228, 0.040),
    0 14px 34px rgba(0, 0, 0, 0.22),
    0 0 24px rgba(108, 172, 228, 0.10),
    inset 0 0 24px rgba(108, 172, 228, 0.040);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-command-line {
  border-color: rgba(108, 172, 228, 0.48) !important;
  background:
    linear-gradient(145deg, rgba(243, 248, 252, 0.080), rgba(243, 248, 252, 0.032)),
    radial-gradient(circle at left center, rgba(108, 172, 228, 0.13), transparent 42%),
    rgba(12, 35, 64, 0.56) !important;
  box-shadow:
    0 0 0 1px rgba(108, 172, 228, 0.090),
    0 0 26px rgba(108, 172, 228, 0.17),
    inset 0 0 28px rgba(108, 172, 228, 0.066) !important;
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-command-line::before,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-playback-status::before,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-media-toggle::before,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-jump-link::before {
  background: linear-gradient(90deg, transparent, rgba(108, 172, 228, 0.25), rgba(0, 51, 160, 0.15), rgba(209, 209, 206, 0.08), transparent) !important;
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-command-prefix,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-cursor,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-showcase-caption span {
  color: var(--xu-cura-blue) !important;
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-cursor {
  background: var(--xu-cura-blue) !important;
  box-shadow: 0 0 18px rgba(108, 172, 228, 0.72) !important;
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-system-list li::before {
  background: var(--xu-cura-blue) !important;
  box-shadow:
    0 0 10px rgba(108, 172, 228, 0.96),
    0 0 22px rgba(108, 172, 228, 0.56),
    0 0 38px rgba(0, 51, 160, 0.26) !important;
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-showcase-caption span {
  background:
    linear-gradient(145deg, rgba(12, 35, 64, 0.84), rgba(6, 20, 38, 0.62)),
    radial-gradient(circle at 12% 50%, rgba(108, 172, 228, 0.22), transparent 62%);
  border-color: rgba(108, 172, 228, 0.38);
  box-shadow:
    0 10px 24px rgba(0, 0, 0, 0.30),
    0 0 18px rgba(108, 172, 228, 0.13),
    inset 0 0 18px rgba(108, 172, 228, 0.050);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-media-frame-shell::before {
  background: linear-gradient(135deg, rgba(108, 172, 228, 0.32), rgba(0, 51, 160, 0.22), rgba(158, 162, 162, 0.12));
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-showcase-frame::after {
  background:
    linear-gradient(180deg, transparent 48%, rgba(12, 35, 64, 0.84)),
    linear-gradient(90deg, rgba(108, 172, 228, 0.16), transparent 28%, transparent 72%, rgba(158, 162, 162, 0.12));
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-signal-chip:nth-child(1) {
  border-color: rgba(108, 172, 228, 0.36);
  background:
    linear-gradient(145deg, rgba(108, 172, 228, 0.105), rgba(12, 35, 64, 0.070)),
    radial-gradient(circle at 50% 16%, rgba(108, 172, 228, 0.19), transparent 45%),
    rgba(243, 248, 252, 0.034);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-signal-chip:nth-child(2) {
  border-color: rgba(0, 51, 160, 0.42);
  background:
    linear-gradient(145deg, rgba(0, 51, 160, 0.145), rgba(108, 172, 228, 0.055)),
    radial-gradient(circle at 50% 16%, rgba(0, 51, 160, 0.22), transparent 45%),
    rgba(243, 248, 252, 0.034);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-signal-chip:nth-child(3) {
  border-color: rgba(158, 162, 162, 0.40);
  background:
    linear-gradient(145deg, rgba(158, 162, 162, 0.115), rgba(108, 172, 228, 0.055)),
    radial-gradient(circle at 50% 16%, rgba(209, 209, 206, 0.16), transparent 45%),
    rgba(243, 248, 252, 0.034);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-signal-chip:nth-child(1)::after {
  background:
    radial-gradient(circle at 34% 28%, rgba(243, 248, 252, 0.42), transparent 22%),
    radial-gradient(circle at 50% 52%, rgba(108, 172, 228, 0.56), rgba(108, 172, 228, 0.20) 43%, rgba(12, 35, 64, 0.68) 69%);
  border-color: rgba(184, 220, 247, 0.62);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-signal-chip:nth-child(2)::after {
  background:
    radial-gradient(circle at 34% 28%, rgba(243, 248, 252, 0.40), transparent 22%),
    radial-gradient(circle at 50% 52%, rgba(0, 51, 160, 0.62), rgba(0, 51, 160, 0.25) 43%, rgba(12, 35, 64, 0.70) 69%);
  border-color: rgba(143, 180, 255, 0.64);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-signal-chip:nth-child(3)::after {
  background:
    radial-gradient(circle at 34% 28%, rgba(255, 255, 255, 0.46), transparent 22%),
    radial-gradient(circle at 50% 52%, rgba(209, 209, 206, 0.54), rgba(158, 162, 162, 0.22) 43%, rgba(12, 35, 64, 0.68) 69%);
  border-color: rgba(209, 209, 206, 0.66);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-signal-chip:nth-child(1) span {
  color: #b8dcf7;
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-signal-chip:nth-child(2) span {
  color: #8fb4ff;
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-signal-chip:nth-child(3) span {
  color: #d1d1ce;
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-jump-link,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-media-toggle,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-playback-status {
  color: var(--xu-text) !important;
  border-color: rgba(108, 172, 228, 0.42) !important;
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-jump-link:hover,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-jump-link:focus-visible,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-media-toggle:hover,
html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-media-toggle:focus-visible {
  color: #ffffff !important;
  border-color: rgba(108, 172, 228, 0.70) !important;
  background:
    linear-gradient(145deg, rgba(108, 172, 228, 0.22), rgba(0, 51, 160, 0.16)),
    radial-gradient(circle at 18% 18%, rgba(108, 172, 228, 0.16), transparent 44%),
    rgba(243, 248, 252, 0.058) !important;
  box-shadow:
    0 0 0 1px rgba(108, 172, 228, 0.095),
    0 16px 38px rgba(0, 0, 0, 0.25),
    0 0 36px rgba(108, 172, 228, 0.24),
    0 0 54px rgba(0, 51, 160, 0.16),
    inset 0 0 30px rgba(108, 172, 228, 0.070) !important;
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-playback-dot {
  background: var(--xu-cura-blue);
  box-shadow:
    0 0 12px rgba(108, 172, 228, 0.92),
    0 0 28px rgba(108, 172, 228, 0.46),
    0 0 42px rgba(0, 51, 160, 0.24);
}

html[data-winterface-theme="blue-chrome"] body.winterface-offline #winterface.interface-section .interface-system-toggle i {
  background: var(--xu-grey);
  box-shadow:
    0 0 10px rgba(158, 162, 162, 0.78),
    0 0 22px rgba(158, 162, 162, 0.38);
}

html[data-winterface-theme="blue-chrome"] body.winterface-offline #winterface.interface-section .interface-system-toggle i::after {
  background: radial-gradient(circle, rgba(158, 162, 162, 0.28), rgba(108, 172, 228, 0.10) 38%, transparent 70%);
}

/* Fullscreen keeps the same clean Xavier system shell without affecting the page behind it. */
html[data-winterface-theme="blue-chrome"] #winterface.interface-section.is-winterface-maximized .interface-shell {
  background:
    radial-gradient(circle at 9% 11%, rgba(0, 51, 160, 0.34), transparent 38%),
    radial-gradient(circle at 91% 13%, rgba(108, 172, 228, 0.22), transparent 38%),
    radial-gradient(circle at 48% 95%, rgba(158, 162, 162, 0.14), transparent 44%),
    linear-gradient(145deg, rgba(243, 248, 252, 0.072), rgba(243, 248, 252, 0.022)),
    linear-gradient(145deg, #07172c, #020812 74%);
}

@media (max-width: 768px) {
  html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-shell {
    border-color: rgba(108, 172, 228, 0.30);
  }

  html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-status-bar,
  html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-rail,
  html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-core,
  html[data-winterface-theme="blue-chrome"] #winterface.interface-section .interface-side-panel {
    border-color: rgba(108, 172, 228, 0.20);
  }
}


/* Blue Chrome slot 03 skin layer. */
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section {
  --interface-accent: #6cace4 !important;
  --interface-accent-rgb: 108, 172, 228 !important;
  --interface-accent-text: #b8dcf7 !important;
  --interface-accent-soft: rgba(108, 172, 228, 0.14) !important;
  --interface-accent-border: rgba(108, 172, 228, 0.58) !important;
  --interface-accent-border-strong: rgba(184, 220, 247, 0.78) !important;
  --interface-accent-glow: rgba(108, 172, 228, 0.30) !important;
  --winterface-accent: #6cace4 !important;
  --winterface-accent-rgb: 108, 172, 228 !important;
  --winterface-accent-text: #b8dcf7 !important;
  --winterface-accent-soft: rgba(108, 172, 228, 0.14) !important;
  --winterface-accent-border: rgba(108, 172, 228, 0.58) !important;
  --winterface-accent-glow: rgba(108, 172, 228, 0.30) !important;
  color-scheme: dark !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section::before {
  background: linear-gradient(90deg, transparent, rgba(12, 35, 64, 0.72), rgba(0, 51, 160, 0.50), rgba(108, 172, 228, 0.36), transparent) !important;
  box-shadow: 0 0 28px rgba(108, 172, 228, 0.20), 0 0 52px rgba(0, 51, 160, 0.14) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-shell,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section.is-winterface-maximized .interface-shell {
  border-color: rgba(108, 172, 228, 0.36) !important;
  background:
    radial-gradient(circle at 9% 11%, rgba(0, 51, 160, 0.34), transparent 38%),
    radial-gradient(circle at 91% 13%, rgba(108, 172, 228, 0.22), transparent 38%),
    radial-gradient(circle at 48% 95%, rgba(158, 162, 162, 0.14), transparent 44%),
    linear-gradient(145deg, rgba(243, 248, 252, 0.072), rgba(243, 248, 252, 0.022)),
    linear-gradient(145deg, #07172c, #020812 74%) !important;
  box-shadow:
    0 34px 110px rgba(0, 0, 0, 0.68),
    0 0 0 1px rgba(108, 172, 228, 0.12),
    0 0 76px rgba(0, 51, 160, 0.25),
    0 0 94px rgba(108, 172, 228, 0.13),
    inset 0 0 74px rgba(243, 248, 252, 0.035) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-shell::before {
  border-color: rgba(108, 172, 228, 0.28) !important;
  box-shadow: inset 0 0 0 1px rgba(209, 209, 206, 0.08), inset 0 0 46px rgba(0, 51, 160, 0.07) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-shell::after {
  background-image:
    linear-gradient(rgba(108, 172, 228, 0.052) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 51, 160, 0.070) 1px, transparent 1px),
    linear-gradient(115deg, transparent 0 47%, rgba(209, 209, 206, 0.052) 48%, transparent 50% 100%),
    radial-gradient(circle at var(--pointer-x, 50%) var(--pointer-y, 50%), rgba(108, 172, 228, 0.18), transparent 30%) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-status-bar,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-rail,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-core,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-side-panel,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-output-card,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-output-card-soft,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-response,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-signal-pulse,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-signal-pulse-readout {
  border-color: rgba(108, 172, 228, 0.24) !important;
  background:
    linear-gradient(145deg, rgba(7, 23, 44, 0.93), rgba(2, 8, 18, 0.80)),
    rgba(6, 20, 38, 0.86) !important;
  box-shadow:
    inset 0 0 34px rgba(243, 248, 252, 0.026),
    0 0 0 1px rgba(209, 209, 206, 0.020),
    0 18px 48px rgba(0, 0, 0, 0.34),
    0 0 26px rgba(108, 172, 228, 0.075) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-status-bar > span,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-status-bar > .interface-system-toggle,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-theme-toggle,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-recorder-toggle,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-path,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-set-button,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-playback-status,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-media-toggle,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-media-controls-toggle,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-jump-link,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-signal-pulse-chip {
  border-color: rgba(108, 172, 228, 0.34) !important;
  background:
    linear-gradient(145deg, rgba(108, 172, 228, 0.095), rgba(12, 35, 64, 0.20)),
    rgba(243, 248, 252, 0.034) !important;
  color: #f6f9fc !important;
  box-shadow:
    0 0 0 1px rgba(108, 172, 228, 0.045),
    0 14px 34px rgba(0, 0, 0, 0.22),
    0 0 24px rgba(108, 172, 228, 0.10),
    inset 0 0 24px rgba(108, 172, 228, 0.040) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-status-bar > span:hover,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-status-bar > .interface-system-toggle:hover,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-theme-toggle:hover,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-recorder-toggle:hover,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-path:hover,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-path:focus-visible,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-path.is-active,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-set-button:hover,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-set-button:focus-visible,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-set-button.is-active,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-playback-status:hover,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-playback-status:focus-visible,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-media-toggle:hover,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-media-toggle:focus-visible,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-media-controls-toggle:hover,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-media-controls-toggle:focus-visible,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-jump-link:hover,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-jump-link:focus-visible,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-signal-pulse-chip:hover,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-signal-pulse-chip:focus-visible,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-signal-pulse-chip.is-active {
  border-color: rgba(108, 172, 228, 0.72) !important;
  background:
    linear-gradient(145deg, rgba(108, 172, 228, 0.22), rgba(0, 51, 160, 0.16)),
    radial-gradient(circle at 18% 18%, rgba(108, 172, 228, 0.16), transparent 44%),
    rgba(243, 248, 252, 0.058) !important;
  color: #ffffff !important;
  box-shadow:
    0 0 0 1px rgba(108, 172, 228, 0.10),
    0 16px 38px rgba(0, 0, 0, 0.25),
    0 0 36px rgba(108, 172, 228, 0.24),
    0 0 54px rgba(0, 51, 160, 0.16),
    inset 0 0 30px rgba(108, 172, 228, 0.070) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-command-line,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-showcase-frame,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-video-frame {
  border-color: rgba(108, 172, 228, 0.48) !important;
  background:
    linear-gradient(145deg, rgba(243, 248, 252, 0.080), rgba(243, 248, 252, 0.032)),
    radial-gradient(circle at left center, rgba(108, 172, 228, 0.13), transparent 42%),
    rgba(12, 35, 64, 0.56) !important;
  box-shadow:
    0 0 0 1px rgba(108, 172, 228, 0.090),
    0 0 26px rgba(108, 172, 228, 0.17),
    inset 0 0 28px rgba(108, 172, 228, 0.066) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-path span,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-set-button span,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-system-toggle i,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-status-bar > span i,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-playback-dot,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-system-list li::before,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-recorder-orb {
  background: #6cace4 !important;
  border-color: rgba(184, 220, 247, 0.76) !important;
  color: #ffffff !important;
  box-shadow:
    0 0 10px rgba(108, 172, 228, 0.98),
    0 0 24px rgba(108, 172, 228, 0.58),
    0 0 44px rgba(0, 51, 160, 0.28) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-set-button:not(.is-active) span,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-status-bar > span:nth-child(3) i {
  background: #9ea2a2 !important;
  box-shadow: 0 0 10px rgba(209, 209, 206, 0.64), 0 0 22px rgba(108, 172, 228, 0.24) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-rail-label,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-output-label,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-response .panel-label,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-command-prefix,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-showcase-caption span,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-signal-chip span,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-signal-pulse-label {
  color: #6cace4 !important;
  text-shadow: 0 0 10px rgba(108, 172, 228, 0.58), 0 0 22px rgba(108, 172, 228, 0.20) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-path strong,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-output-card strong,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-response h3,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-signal-chip strong,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-signal-pulse-readout,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-jump-link {
  color: #f6f9fc !important;
  text-shadow: 0 0 12px rgba(108, 172, 228, 0.20) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-rail-subtitle,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-response p:not(.panel-label),
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-system-list li,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-showcase-caption p {
  color: #c8d7e6 !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-signal-chip {
  border-color: rgba(108, 172, 228, 0.30) !important;
  background:
    linear-gradient(145deg, rgba(108, 172, 228, 0.095), rgba(12, 35, 64, 0.13)),
    rgba(243, 248, 252, 0.034) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-signal-chip::after {
  background:
    radial-gradient(circle at 34% 28%, rgba(243, 248, 252, 0.42), transparent 22%),
    radial-gradient(circle at 50% 52%, rgba(108, 172, 228, 0.56), rgba(108, 172, 228, 0.20) 43%, rgba(12, 35, 64, 0.68) 69%) !important;
  border-color: rgba(184, 220, 247, 0.62) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-playback-status.interface-playback-is-playing .interface-playback-dot,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-recorder-toggle.is-recording .interface-recorder-orb {
  background: #d1d1ce !important;
  box-shadow: 0 0 10px rgba(209, 209, 206, 0.88), 0 0 26px rgba(108, 172, 228, 0.42) !important;
}
/* === WInterface Solo EDU Blue Chrome Slot 03 Final Skin Lock === */

/* === WInterface Solo EDU Theme Consistency Lock ===
   Final visual-only overrides for Blue Chrome and Navy Sky Grey. Keeps the
   selected-bay orb sync global while preventing alternate theme color bleed. */
html[data-winterface-theme="blue-chrome"] #winterface.interface-section {
  --winterface-theme-accent: #6cace4;
  --winterface-theme-accent-rgb: 108, 172, 228;
  --winterface-theme-accent-2: #d1d1ce;
  --winterface-theme-accent-2-rgb: 209, 209, 206;
  --winterface-theme-panel: rgba(7, 23, 44, 0.88);
  --winterface-theme-panel-soft: rgba(12, 35, 64, 0.68);
  --winterface-theme-border: rgba(108, 172, 228, 0.36);
  --winterface-theme-border-strong: rgba(209, 209, 206, 0.62);
}

html[data-winterface-theme="navy-sky-grey"] #winterface.interface-section {
  --winterface-theme-accent: #7fcfff;
  --winterface-theme-accent-rgb: 127, 207, 255;
  --winterface-theme-accent-2: #92b4d1;
  --winterface-theme-accent-2-rgb: 146, 180, 209;
  --winterface-theme-panel: rgba(8, 18, 34, 0.90);
  --winterface-theme-panel-soft: rgba(18, 34, 56, 0.70);
  --winterface-theme-border: rgba(127, 207, 255, 0.34);
  --winterface-theme-border-strong: rgba(146, 180, 209, 0.58);
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-status-bar > span,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-status-bar > .interface-system-toggle,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-theme-toggle,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-recorder-toggle,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-status-bar > span,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-status-bar > .interface-system-toggle,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-theme-toggle,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-recorder-toggle {
  border-color: var(--winterface-theme-border) !important;
  background:
    linear-gradient(145deg, rgba(var(--winterface-theme-accent-rgb), 0.095), rgba(var(--winterface-theme-accent-2-rgb), 0.045)),
    var(--winterface-theme-panel) !important;
  box-shadow:
    0 0 0 1px rgba(var(--winterface-theme-accent-rgb), 0.050),
    0 14px 34px rgba(0, 0, 0, 0.24),
    0 0 24px rgba(var(--winterface-theme-accent-rgb), 0.10),
    inset 0 0 24px rgba(var(--winterface-theme-accent-2-rgb), 0.035) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-status-mode .interface-status-orb,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-status-count .interface-maximize-button .interface-status-orb,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-set-button.is-active span,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-status-mode .interface-status-orb,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-status-count .interface-maximize-button .interface-status-orb,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-set-button.is-active span {
  background: var(--wfo-active-bay-accent) !important;
  border-color: rgba(var(--wfo-active-bay-accent-rgb), 0.62) !important;
  box-shadow:
    0 0 14px rgba(var(--wfo-active-bay-accent-rgb), 0.82),
    0 0 30px rgba(var(--wfo-active-bay-accent-rgb), 0.34),
    0 0 46px rgba(var(--wfo-active-bay-accent-rgb), 0.16) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-status-mode,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-status-mode {
  border-color: rgba(var(--wfo-active-bay-accent-rgb), 0.34) !important;
  background:
    linear-gradient(145deg, rgba(var(--wfo-active-bay-accent-rgb), 0.080), rgba(var(--winterface-theme-accent-rgb), 0.040)),
    var(--winterface-theme-panel) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-status-mode::before,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-status-mode::before {
  border-color: rgba(var(--wfo-active-bay-accent-rgb), 0.36) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-set-button.is-active,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-set-button.is-active {
  border-color: rgba(var(--wfo-active-bay-accent-rgb), 0.62) !important;
  background: rgba(var(--wfo-active-bay-accent-rgb), 0.10) !important;
  box-shadow:
    0 0 0 1px rgba(var(--wfo-active-bay-accent-rgb), 0.070),
    0 0 22px rgba(var(--wfo-active-bay-accent-rgb), 0.24),
    inset 0 0 18px rgba(var(--wfo-active-bay-accent-rgb), 0.050) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-signal-pulse,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-jump-link {
  border-color: var(--winterface-theme-border-strong) !important;
  box-shadow:
    0 0 0 1px rgba(var(--winterface-theme-accent-2-rgb), 0.12),
    0 0 30px rgba(var(--winterface-theme-accent-rgb), 0.22),
    inset 0 0 28px rgba(var(--winterface-theme-accent-2-rgb), 0.070) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-jump-link:hover,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-jump-link:focus-visible {
  border-color: rgba(var(--winterface-theme-accent-2-rgb), 0.82) !important;
  box-shadow:
    0 0 0 1px rgba(var(--winterface-theme-accent-2-rgb), 0.16),
    0 0 34px rgba(var(--winterface-theme-accent-rgb), 0.30),
    inset 0 0 30px rgba(var(--winterface-theme-accent-2-rgb), 0.090) !important;
}

html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-shell,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section.is-winterface-maximized .interface-shell,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-status-bar,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-rail,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-core,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-side-panel,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-output-card,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-output-card-soft,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-response,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-signal-pulse,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-signal-pulse-readout {
  border-color: var(--winterface-theme-border) !important;
  background:
    linear-gradient(145deg, rgba(var(--winterface-theme-accent-rgb), 0.070), rgba(var(--winterface-theme-accent-2-rgb), 0.042)),
    radial-gradient(circle at 16% 12%, rgba(var(--winterface-theme-accent-rgb), 0.090), transparent 42%),
    var(--winterface-theme-panel-soft) !important;
  box-shadow:
    inset 0 0 34px rgba(248, 250, 252, 0.024),
    0 0 0 1px rgba(var(--winterface-theme-accent-rgb), 0.030),
    0 18px 48px rgba(0, 0, 0, 0.34),
    0 0 26px rgba(var(--winterface-theme-accent-rgb), 0.090) !important;
}

html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-rail-label,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-output-label,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-response .panel-label,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-command-prefix,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-showcase-caption span,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-signal-chip span,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-signal-pulse-label {
  color: var(--winterface-theme-accent) !important;
  text-shadow: 0 0 10px rgba(var(--winterface-theme-accent-rgb), 0.48), 0 0 22px rgba(var(--winterface-theme-accent-rgb), 0.18) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-recorder-toggle,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-recorder-toggle {
  border-color: rgba(var(--wfo-active-bay-accent-rgb), 0.62) !important;
  box-shadow:
    0 0 0 1px rgba(var(--wfo-active-bay-accent-rgb), 0.080),
    0 0 24px rgba(var(--wfo-active-bay-accent-rgb), 0.22),
    inset 0 0 18px rgba(var(--winterface-theme-accent-rgb), 0.060) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-recorder-orb,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-recorder-orb {
  background: var(--winterface-theme-accent) !important;
  border-color: rgba(var(--winterface-theme-accent-2-rgb), 0.66) !important;
  box-shadow:
    0 0 11px rgba(var(--winterface-theme-accent-rgb), 0.92),
    0 0 26px rgba(var(--winterface-theme-accent-rgb), 0.42),
    0 0 42px rgba(var(--wfo-active-bay-accent-rgb), 0.18) !important;
}
/* === WInterface Solo EDU Theme Consistency Lock === */
/* === WInterface Solo EDU Theme Detail Lock ===
   Targeted color consistency for Blue Chrome and Navy Sky Grey. */
html[data-winterface-theme="blue-chrome"] #winterface.interface-section {
  --winterface-blue-chrome-navy-border: rgba(12, 35, 64, 0.88);
  --winterface-blue-chrome-navy-border-soft: rgba(12, 35, 64, 0.66);
  --winterface-blue-chrome-silver-border: rgba(209, 209, 206, 0.76);
  --winterface-blue-chrome-silver-border-soft: rgba(209, 209, 206, 0.56);
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-system-status-pill,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-status-count {
  border-color: var(--winterface-blue-chrome-silver-border) !important;
  box-shadow:
    0 0 0 1px rgba(209, 209, 206, 0.16),
    0 14px 34px rgba(0, 0, 0, 0.25),
    0 0 26px rgba(209, 209, 206, 0.18),
    inset 0 0 24px rgba(209, 209, 206, 0.060) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-status-mode,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-theme-toggle {
  border-color: var(--winterface-blue-chrome-navy-border) !important;
  box-shadow:
    0 0 0 1px rgba(108, 172, 228, 0.07),
    0 14px 34px rgba(0, 0, 0, 0.25),
    0 0 22px rgba(12, 35, 64, 0.42),
    inset 0 0 22px rgba(12, 35, 64, 0.16) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-status-mode::before,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-theme-toggle::before {
  border-color: var(--winterface-blue-chrome-navy-border-soft) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-command-line {
  border-color: var(--winterface-blue-chrome-silver-border) !important;
  box-shadow:
    0 0 0 1px rgba(209, 209, 206, 0.12),
    0 0 24px rgba(209, 209, 206, 0.18),
    0 0 32px rgba(108, 172, 228, 0.14),
    inset 0 0 24px rgba(209, 209, 206, 0.075) !important;
}

html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-recorder-orb {
  background:
    radial-gradient(circle at 34% 28%, rgba(255, 255, 255, 0.88), transparent 18%),
    radial-gradient(circle at 48% 50%, rgba(125, 211, 252, 0.96), rgba(56, 189, 248, 0.90) 48%, rgba(14, 116, 144, 0.92) 78%) !important;
  border-color: rgba(186, 230, 253, 0.82) !important;
  box-shadow:
    0 0 10px rgba(125, 211, 252, 0.86),
    0 0 24px rgba(56, 189, 248, 0.48),
    0 0 40px rgba(var(--wfo-active-bay-accent-rgb), 0.18) !important;
}

html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-recorder-toggle {
  border-color: rgba(var(--wfo-active-bay-accent-rgb), 0.66) !important;
  box-shadow:
    0 0 0 1px rgba(var(--wfo-active-bay-accent-rgb), 0.10),
    0 0 24px rgba(var(--wfo-active-bay-accent-rgb), 0.24),
    inset 0 0 18px rgba(226, 232, 240, 0.060) !important;
}
/* === WInterface Solo EDU Theme Detail Lock === */


/* Navy Sky Grey recorder orb color. */
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-recorder-toggle {
  --interface-recorder-accent: #38bdf8 !important;
  --interface-recorder-accent-rgb: 56, 189, 248 !important;
  --interface-recorder-accent-soft-rgb: 125, 211, 252 !important;
}

html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-recorder-toggle .interface-recorder-orb,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-recorder-toggle.is-recording .interface-recorder-orb {
  background:
    radial-gradient(circle at 34% 28%, rgba(255, 255, 255, 0.88), transparent 18%),
    radial-gradient(circle at 48% 50%, rgba(125, 211, 252, 0.96), rgba(56, 189, 248, 0.90) 48%, rgba(14, 116, 144, 0.92) 78%) !important;
  border-color: rgba(186, 230, 253, 0.82) !important;
  box-shadow:
    0 0 10px rgba(125, 211, 252, 0.86),
    0 0 24px rgba(56, 189, 248, 0.48),
    0 0 40px rgba(var(--wfo-active-bay-accent-rgb), 0.18) !important;
}

/* === WInterface Solo EDU v4.0 Theme Border Detail Adjustment ===
   Scope: Code Green and Iron Steel visual border cleanup only.
   Keeps layout, content, recorder behavior, media routing, and JS logic unchanged. */
html[data-winterface-theme="code-green"] body #winterface.interface-section .interface-command-line,
html[data-winterface-theme="code-green"] #winterface.interface-section .interface-command-line {
  border-color: rgba(var(--style-matrix-orb-left-rgb, 0, 255, 102), 0.78) !important;
  box-shadow:
    0 0 0 1px rgba(var(--style-matrix-orb-left-rgb, 0, 255, 102), 0.14),
    0 14px 30px rgba(0, 0, 0, 0.30),
    0 0 18px rgba(var(--style-matrix-orb-left-rgb, 0, 255, 102), 0.14),
    inset 0 0 0 1px rgba(var(--style-matrix-orb-left-rgb, 0, 255, 102), 0.08),
    inset 0 0 24px rgba(var(--style-matrix-orb-left-rgb, 0, 255, 102), 0.04) !important;
}

html[data-winterface-theme="code-green"] body #winterface.interface-section .interface-status-bar > span,
html[data-winterface-theme="code-green"] body #winterface.interface-section .interface-status-bar > .interface-system-toggle,
html[data-winterface-theme="code-green"] body #winterface.interface-section .interface-status-bar .interface-status-mode,
html[data-winterface-theme="code-green"] body #winterface.interface-section .interface-theme-toggle,
html[data-winterface-theme="code-green"] body #winterface.interface-section .interface-status-bar .interface-status-count,
html[data-winterface-theme="code-green"] #winterface.interface-section .interface-status-bar > span,
html[data-winterface-theme="code-green"] #winterface.interface-section .interface-status-bar > .interface-system-toggle,
html[data-winterface-theme="code-green"] #winterface.interface-section .interface-status-bar .interface-status-mode,
html[data-winterface-theme="code-green"] #winterface.interface-section .interface-theme-toggle,
html[data-winterface-theme="code-green"] #winterface.interface-section .interface-status-bar .interface-status-count {
  border-color: rgba(var(--style-matrix-orb-left-rgb, 0, 255, 102), 0.78) !important;
  box-shadow:
    0 0 0 1px rgba(var(--style-matrix-orb-left-rgb, 0, 255, 102), 0.13),
    0 0 16px rgba(var(--style-matrix-orb-left-rgb, 0, 255, 102), 0.14),
    inset 0 0 0 1px rgba(var(--style-matrix-orb-left-rgb, 0, 255, 102), 0.055) !important;
}

html[data-winterface-theme="default"] body #winterface.interface-section .interface-command-line,
html[data-winterface-theme="default"] #winterface.interface-section .interface-command-line {
  border-color: rgba(var(--iron-steel-chrome-rgb, 185, 199, 207), 0.82) !important;
  box-shadow:
    0 0 0 1px rgba(var(--iron-steel-chrome-rgb, 185, 199, 207), 0.16),
    0 14px 30px rgba(0, 0, 0, 0.30),
    0 0 18px rgba(var(--iron-steel-chrome-rgb, 185, 199, 207), 0.13),
    inset 0 0 0 1px rgba(var(--iron-steel-chrome-rgb, 185, 199, 207), 0.09),
    inset 0 0 24px rgba(var(--iron-steel-chrome-rgb, 185, 199, 207), 0.04) !important;
}
/* === WInterface Solo EDU v4.0 Theme Border Detail Adjustment === */

/* === WInterface Solo EDU v4.0 Theme Slot Detail Tokens ===
   Centralized theme-slot border treatment for the four Style Matrix slots.
   This section intentionally mirrors the Iron Steel top-oval selector pattern
   so replaced themes can be updated through variables instead of scattered one-off selectors. */
html[data-winterface-theme="default"] #winterface.interface-section {
  --winterface-slot-top-primary-border: rgba(var(--iron-steel-chrome-rgb, 185, 199, 207), 0.82);
  --winterface-slot-top-secondary-border: rgba(var(--matrix-slot-default-left-rgb, 214, 180, 109), 0.86);
  --winterface-slot-command-border: rgba(var(--iron-steel-chrome-rgb, 185, 199, 207), 0.82);
  --winterface-slot-controls-border: rgba(var(--iron-steel-chrome-rgb, 185, 199, 207), 0.82);
  --winterface-slot-border-glow-rgb: var(--iron-steel-chrome-rgb, 185, 199, 207);
}

html[data-winterface-theme="code-green"] #winterface.interface-section {
  --winterface-slot-top-primary-border: rgba(var(--style-matrix-orb-left-rgb, 0, 255, 102), 0.78);
  --winterface-slot-top-secondary-border: rgba(var(--style-matrix-orb-left-rgb, 0, 255, 102), 0.78);
  --winterface-slot-command-border: rgba(var(--style-matrix-orb-left-rgb, 0, 255, 102), 0.82);
  --winterface-slot-controls-border: rgba(var(--style-matrix-orb-left-rgb, 0, 255, 102), 0.76);
  --winterface-slot-border-glow-rgb: var(--style-matrix-orb-left-rgb, 0, 255, 102);
}

html[data-winterface-theme="blue-chrome"] #winterface.interface-section {
  --winterface-slot-chrome-rgb: 209, 209, 206;
  --winterface-slot-navy-rgb: 12, 35, 64;
  --winterface-slot-top-primary-border: rgba(var(--winterface-slot-chrome-rgb), 0.88);
  --winterface-slot-top-secondary-border: rgba(var(--winterface-slot-navy-rgb), 0.88);
  --winterface-slot-command-border: rgba(var(--winterface-slot-chrome-rgb), 0.82);
  --winterface-slot-controls-border: rgba(var(--winterface-slot-chrome-rgb), 0.88);
  --winterface-slot-border-glow-rgb: var(--winterface-slot-chrome-rgb);
}

html[data-winterface-theme="navy-sky-grey"] #winterface.interface-section {
  --winterface-slot-top-primary-border: rgba(148, 163, 184, 0.74);
  --winterface-slot-top-secondary-border: rgba(56, 189, 248, 0.70);
  --winterface-slot-command-border: rgba(148, 163, 184, 0.64);
  --winterface-slot-controls-border: rgba(56, 189, 248, 0.62);
  --winterface-slot-border-glow-rgb: 56, 189, 248;
}

/* Primary top ovals: WInterface status and connected count. */
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-system-status-pill,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-status-count,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-system-status-pill,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-status-count,
html[data-winterface-theme="code-green"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-system-status-pill,
html[data-winterface-theme="code-green"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-status-count,
html[data-winterface-theme="code-green"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-system-status-pill,
html[data-winterface-theme="code-green"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-status-count,
html[data-winterface-theme="blue-chrome"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-system-status-pill,
html[data-winterface-theme="blue-chrome"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-status-count,
html[data-winterface-theme="blue-chrome"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-system-status-pill,
html[data-winterface-theme="blue-chrome"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-status-count,
html[data-winterface-theme="navy-sky-grey"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-system-status-pill,
html[data-winterface-theme="navy-sky-grey"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-status-count,
html[data-winterface-theme="navy-sky-grey"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-system-status-pill,
html[data-winterface-theme="navy-sky-grey"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-status-count {
  border: 1px solid var(--winterface-slot-top-primary-border) !important;
  box-shadow:
    0 0 0 1px rgba(var(--winterface-slot-border-glow-rgb), 0.16),
    0 12px 28px rgba(0, 0, 0, 0.28),
    0 0 18px rgba(var(--winterface-slot-border-glow-rgb), 0.14),
    inset 0 0 0 1px rgba(255, 255, 255, 0.06),
    inset 0 0 24px rgba(var(--winterface-slot-border-glow-rgb), 0.05) !important;
}

html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-system-status-pill::before,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-system-status-pill::after,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-status-count::before,
html[data-winterface-theme="default"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-status-count::after,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-system-status-pill::before,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-system-status-pill::after,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-status-count::before,
html[data-winterface-theme="default"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-status-count::after,
html[data-winterface-theme="code-green"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-system-status-pill::before,
html[data-winterface-theme="code-green"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-system-status-pill::after,
html[data-winterface-theme="code-green"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-status-count::before,
html[data-winterface-theme="code-green"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-status-count::after,
html[data-winterface-theme="code-green"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-system-status-pill::before,
html[data-winterface-theme="code-green"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-system-status-pill::after,
html[data-winterface-theme="code-green"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-status-count::before,
html[data-winterface-theme="code-green"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-status-count::after,
html[data-winterface-theme="blue-chrome"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-system-status-pill::before,
html[data-winterface-theme="blue-chrome"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-system-status-pill::after,
html[data-winterface-theme="blue-chrome"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-status-count::before,
html[data-winterface-theme="blue-chrome"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-status-count::after,
html[data-winterface-theme="blue-chrome"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-system-status-pill::before,
html[data-winterface-theme="blue-chrome"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-system-status-pill::after,
html[data-winterface-theme="blue-chrome"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-status-count::before,
html[data-winterface-theme="blue-chrome"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-status-count::after,
html[data-winterface-theme="navy-sky-grey"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-system-status-pill::before,
html[data-winterface-theme="navy-sky-grey"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-system-status-pill::after,
html[data-winterface-theme="navy-sky-grey"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-status-count::before,
html[data-winterface-theme="navy-sky-grey"] body.winterface-standalone #winterface.interface-section .interface-status-bar .interface-status-count::after,
html[data-winterface-theme="navy-sky-grey"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-system-status-pill::before,
html[data-winterface-theme="navy-sky-grey"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-system-status-pill::after,
html[data-winterface-theme="navy-sky-grey"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-status-count::before,
html[data-winterface-theme="navy-sky-grey"] body.winterface-dev-build #winterface.interface-section .interface-status-bar .interface-status-count::after {
  border-color: var(--winterface-slot-top-primary-border) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.13),
    inset 0 -1px 0 rgba(var(--winterface-slot-border-glow-rgb), 0.10) !important;
}

/* Secondary top ovals: Bay Active and Style Matrix. */
html[data-winterface-theme="default"] body #winterface.interface-section .interface-status-bar .interface-status-mode,
html[data-winterface-theme="default"] body #winterface.interface-section .interface-status-bar .interface-theme-toggle,
html[data-winterface-theme="code-green"] body #winterface.interface-section .interface-status-bar .interface-status-mode,
html[data-winterface-theme="code-green"] body #winterface.interface-section .interface-status-bar .interface-theme-toggle,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-status-bar .interface-status-mode,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-status-bar .interface-theme-toggle,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-status-bar .interface-status-mode,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-status-bar .interface-theme-toggle {
  border: 1px solid var(--winterface-slot-top-secondary-border) !important;
}

html[data-winterface-theme="default"] body #winterface.interface-section .interface-command-line,
html[data-winterface-theme="code-green"] body #winterface.interface-section .interface-command-line,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-command-line,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-command-line {
  border: 1px solid var(--winterface-slot-command-border) !important;
  box-shadow:
    0 0 0 1px rgba(var(--winterface-slot-border-glow-rgb), 0.14),
    0 0 22px rgba(var(--winterface-slot-border-glow-rgb), 0.14),
    inset 0 0 0 1px rgba(var(--winterface-slot-border-glow-rgb), 0.06) !important;
}

html[data-winterface-theme="default"] body #winterface.interface-section .interface-media-controls-toggle,
html[data-winterface-theme="default"] body #winterface.interface-section.interface-system-is-media .interface-media-controls-toggle,
html[data-winterface-theme="code-green"] body #winterface.interface-section .interface-media-controls-toggle,
html[data-winterface-theme="code-green"] body #winterface.interface-section.interface-system-is-media .interface-media-controls-toggle,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-media-controls-toggle,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section.interface-system-is-media .interface-media-controls-toggle,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section .interface-media-controls-toggle,
html[data-winterface-theme="navy-sky-grey"] body #winterface.interface-section.interface-system-is-media .interface-media-controls-toggle {
  border: 1px solid var(--winterface-slot-controls-border) !important;
  box-shadow:
    0 0 0 1px rgba(var(--winterface-slot-border-glow-rgb), 0.14),
    0 0 20px rgba(var(--winterface-slot-border-glow-rgb), 0.18),
    inset 0 0 18px rgba(var(--winterface-slot-border-glow-rgb), 0.07) !important;
}

html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-media-controls-toggle:hover,
html[data-winterface-theme="blue-chrome"] body #winterface.interface-section .interface-media-controls-toggle:focus-visible {
  border-color: rgba(232, 232, 228, 0.94) !important;
}

/* WInterface Style Matrix Slot Tokens
   The four Style Matrix slots are stable. Theme files and visible names can change,
   while the matrix colors and active theme accents stay tied to slots 01-04. */
:root {
  --matrix-slot-01-left: #d6b46d;
  --matrix-slot-01-right: #74eaff;
  --matrix-slot-01-left-rgb: 214, 180, 109;
  --matrix-slot-01-right-rgb: 116, 234, 255;
  --matrix-slot-01-preview: linear-gradient(90deg, #030506 0%, #1a222b 28%, #d6b46d 64%, #74eaff 100%);

  --matrix-slot-02-left: #00ff66;
  --matrix-slot-02-right: #9cffb8;
  --matrix-slot-02-left-rgb: 0, 255, 102;
  --matrix-slot-02-right-rgb: 156, 255, 184;
  --matrix-slot-02-preview: linear-gradient(90deg, #020603 0%, #00ff66 58%, #9cffb8 100%);

  --matrix-slot-03-left: #6cace4;
  --matrix-slot-03-right: #d1d1ce;
  --matrix-slot-03-left-rgb: 108, 172, 228;
  --matrix-slot-03-right-rgb: 209, 209, 206;
  --matrix-slot-03-preview: linear-gradient(90deg, #020812 0%, #0c2340 26%, #0033a0 52%, #6cace4 78%, #d1d1ce 100%);

  --matrix-slot-04-left: #7fcfff;
  --matrix-slot-04-right: #92b4d1;
  --matrix-slot-04-left-rgb: 127, 207, 255;
  --matrix-slot-04-right-rgb: 146, 180, 209;
  --matrix-slot-04-preview: linear-gradient(90deg, #06101e 0%, #132238 36%, #7fcfff 72%, #92b4d1 100%);

  --matrix-slot-default-left: var(--matrix-slot-01-left);
  --matrix-slot-default-right: var(--matrix-slot-01-right);
  --matrix-slot-default-left-rgb: var(--matrix-slot-01-left-rgb);
  --matrix-slot-default-right-rgb: var(--matrix-slot-01-right-rgb);
  --matrix-slot-default-preview: var(--matrix-slot-01-preview);
  --matrix-slot-code-green-left: var(--matrix-slot-02-left);
  --matrix-slot-code-green-right: var(--matrix-slot-02-right);
  --matrix-slot-code-green-left-rgb: var(--matrix-slot-02-left-rgb);
  --matrix-slot-code-green-right-rgb: var(--matrix-slot-02-right-rgb);
  --matrix-slot-code-green-preview: var(--matrix-slot-02-preview);
  --matrix-slot-blue-chrome-left: var(--matrix-slot-03-left);
  --matrix-slot-blue-chrome-right: var(--matrix-slot-03-right);
  --matrix-slot-blue-chrome-left-rgb: var(--matrix-slot-03-left-rgb);
  --matrix-slot-blue-chrome-right-rgb: var(--matrix-slot-03-right-rgb);
  --matrix-slot-blue-chrome-preview: var(--matrix-slot-03-preview);
  --matrix-slot-navy-sky-grey-left: var(--matrix-slot-04-left);
  --matrix-slot-navy-sky-grey-right: var(--matrix-slot-04-right);
  --matrix-slot-navy-sky-grey-left-rgb: var(--matrix-slot-04-left-rgb);
  --matrix-slot-navy-sky-grey-right-rgb: var(--matrix-slot-04-right-rgb);
  --matrix-slot-navy-sky-grey-preview: var(--matrix-slot-04-preview);
}

.interface-theme-option[data-interface-theme-index="01"] {
  --theme-preview: var(--matrix-slot-01-preview) !important;
  --theme-option-orb: var(--matrix-slot-01-left) !important;
  --theme-option-orb-2: var(--matrix-slot-01-right) !important;
  --theme-option-orb-rgb: var(--matrix-slot-01-left-rgb) !important;
  --theme-option-orb-2-rgb: var(--matrix-slot-01-right-rgb) !important;
}

.interface-theme-option[data-interface-theme-index="02"] {
  --theme-preview: var(--matrix-slot-02-preview) !important;
  --theme-option-orb: var(--matrix-slot-02-left) !important;
  --theme-option-orb-2: var(--matrix-slot-02-right) !important;
  --theme-option-orb-rgb: var(--matrix-slot-02-left-rgb) !important;
  --theme-option-orb-2-rgb: var(--matrix-slot-02-right-rgb) !important;
}

.interface-theme-option[data-interface-theme-index="03"] {
  --theme-preview: var(--matrix-slot-03-preview) !important;
  --theme-option-orb: var(--matrix-slot-03-left) !important;
  --theme-option-orb-2: var(--matrix-slot-03-right) !important;
  --theme-option-orb-rgb: var(--matrix-slot-03-left-rgb) !important;
  --theme-option-orb-2-rgb: var(--matrix-slot-03-right-rgb) !important;
}

.interface-theme-option[data-interface-theme-index="04"] {
  --theme-preview: var(--matrix-slot-04-preview) !important;
  --theme-option-orb: var(--matrix-slot-04-left) !important;
  --theme-option-orb-2: var(--matrix-slot-04-right) !important;
  --theme-option-orb-rgb: var(--matrix-slot-04-left-rgb) !important;
  --theme-option-orb-2-rgb: var(--matrix-slot-04-right-rgb) !important;
}

html[data-winterface-theme-slot="01"] {
  --style-matrix-orb-left: var(--matrix-slot-01-left) !important;
  --style-matrix-orb-right: var(--matrix-slot-01-right) !important;
  --style-matrix-orb-left-rgb: var(--matrix-slot-01-left-rgb) !important;
  --style-matrix-orb-right-rgb: var(--matrix-slot-01-right-rgb) !important;
}

html[data-winterface-theme-slot="02"] {
  --style-matrix-orb-left: var(--matrix-slot-02-left) !important;
  --style-matrix-orb-right: var(--matrix-slot-02-right) !important;
  --style-matrix-orb-left-rgb: var(--matrix-slot-02-left-rgb) !important;
  --style-matrix-orb-right-rgb: var(--matrix-slot-02-right-rgb) !important;
}

html[data-winterface-theme-slot="03"] {
  --style-matrix-orb-left: var(--matrix-slot-03-left) !important;
  --style-matrix-orb-right: var(--matrix-slot-03-right) !important;
  --style-matrix-orb-left-rgb: var(--matrix-slot-03-left-rgb) !important;
  --style-matrix-orb-right-rgb: var(--matrix-slot-03-right-rgb) !important;
}

html[data-winterface-theme-slot="04"] {
  --style-matrix-orb-left: var(--matrix-slot-04-left) !important;
  --style-matrix-orb-right: var(--matrix-slot-04-right) !important;
  --style-matrix-orb-left-rgb: var(--matrix-slot-04-left-rgb) !important;
  --style-matrix-orb-right-rgb: var(--matrix-slot-04-right-rgb) !important;
}
/* === WInterface Solo EDU Expanded Bay Orb Rail Final Balance ===
   Scope: desktop Expanded/Snap compact bay header only. Mirrors the accepted
   Solo final balance without changing orb size, states, title text, or standard view. */
@media (min-width: 900px) {
  html body.winterface-standalone #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header,
  html body.winterface-dev-build #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header,
  html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header,
  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header,
  html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header {
    display: grid !important;
    grid-template-columns: 2.28rem minmax(0, 1fr) !important;
    column-gap: 0.10rem !important;
    justify-content: stretch !important;
    justify-items: stretch !important;
    align-items: center !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header > div:first-child,
  html body.winterface-dev-build #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header > div:first-child,
  html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header > div:first-child,
  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header > div:first-child,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header > div:first-child,
  html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header > div:first-child {
    width: 2.28rem !important;
    min-width: 2.28rem !important;
    max-width: 2.28rem !important;
    justify-self: start !important;
    text-align: left !important;
    overflow: visible !important;
    transform: none !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-label,
  html body.winterface-standalone #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-subtitle,
  html body.winterface-dev-build #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-label,
  html body.winterface-dev-build #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-subtitle,
  html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-label,
  html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-subtitle,
  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-label,
  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-subtitle,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-label,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-subtitle,
  html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-label,
  html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-subtitle {
    max-width: 2.28rem !important;
    text-align: left !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  html body.winterface-standalone #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header .interface-set-controls,
  html body.winterface-dev-build #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header .interface-set-controls,
  html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header .interface-set-controls,
  html body.winterface-standalone #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header .interface-set-controls,
  html body.winterface-dev-build #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header .interface-set-controls,
  html body.winterface-browser-fullscreen #winterface.interface-section.interface-system-is-media.interface-system-media-expanded.interface-system-compact-bay-label .interface-rail-header .interface-set-controls {
    justify-self: start !important;
    justify-content: flex-start !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    transform: none !important;
    max-width: 100% !important;
  }
}
/* === WInterface Solo EDU Expanded Bay Orb Rail Final Balance === */