/**
 * Unified site theme — uses CSS variables from admin (theme_variables.html).
 */

body.light-page,
body.is-conventions,
body.is-archive-year,
body.is-library,
body.is-live,
body.is-live-page,
body.is-upload,
body.is-settings,
body.is-profile {
  background: var(--theme-bg) !important;
  color: var(--theme-ink);
}

body:has(.auth-wrap),
body:has(.auth-page),
body:has(.auth-card) {
  background: var(--theme-bg) !important;
}

.auth-wrap,
.auth-page,
.auth-card,
.card.auth-card {
  background: color-mix(in srgb, var(--theme-bg-paper) 78%, transparent) !important;
  border-color: var(--theme-color-border) !important;
}

.auth-title,
.auth-card h1,
.auth-card h2 {
  color: var(--theme-ink) !important;
}

.auth-btn,
.submit-btn,
button.auth-btn,
button.submit-btn {
  background: var(--theme-color) !important;
  border-color: var(--theme-color-border-strong) !important;
  color: var(--theme-on-theme) !important;
}

.auth-btn:hover,
.submit-btn:hover {
  background: var(--theme-color-hover) !important;
}

.auth-link,
.text-link,
.help-link {
  color: var(--theme-color) !important;
}

.auth-card input,
.auth-page input,
.inp,
.grid-form input,
.grid-form select,
.grid-form textarea {
  border-color: var(--theme-color-border) !important;
  color: var(--theme-ink) !important;
}

.brand-chip {
  color: var(--theme-color) !important;
  background: var(--theme-color-muted) !important;
  border-color: var(--theme-color-border) !important;
}

/* Desktop header scroll shell — mobile banner pages use site-theme-banners.css overrides */
@media (min-width: 1101px) {
  body.header-scrolled .header-shell {
    background: var(--theme-bg) !important;
    border-bottom: 1px solid var(--theme-color-border) !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18) !important;
  }

  html.header-scrolled .header-shell,
  html.header-scrolled #header-shell,
  body.header-scrolled #header-shell {
    border-bottom: 1px solid var(--theme-color-border) !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18) !important;
  }

  body:not(.header-scrolled) #header-shell,
  html:not(.header-scrolled) body:not(.header-scrolled) #header-shell {
    border-bottom: 1px solid transparent !important;
    box-shadow: none !important;
  }

  body.header-scrolled .header-fg,
  body.header-scrolled .nav-link {
    color: var(--theme-ink) !important;
  }
}

body.light-page .header-fg {
  color: var(--theme-ink) !important;
}

.nav-link::after {
  background: var(--theme-color) !important;
}

.icon-solid-brown {
  background: var(--theme-color) !important;
  background-color: var(--theme-color) !important;
}

.js-langfile:not(.lang-own),
a.js-langfile:not(.lang-own),
.midx-file-btn:not(.lang-own),
button.js-langfile:not(.lang-own) {
  background: var(--theme-icon-bg) !important;
  border: 1px solid var(--theme-color-border) !important;
  color: var(--theme-color) !important;
}

.js-langfile:not(.lang-own):hover,
.js-langfile:not(.lang-own):focus-visible,
a.js-langfile:not(.lang-own):hover,
.midx-file-btn:not(.lang-own):hover,
.midx-file-btn:not(.lang-own):focus-visible {
  background: var(--theme-icon-bg-hover) !important;
  border-color: var(--theme-color-border-strong) !important;
  color: var(--theme-color-dark) !important;
}

.js-langfile:not(.lang-own) svg,
.midx-file-btn:not(.lang-own) svg {
  color: var(--theme-color) !important;
}

.lang-own,
.js-langfile.lang-own,
.midx-file-btn.lang-own,
a.js-langfile.lang-own {
  background: var(--theme-color) !important;
  border-color: var(--theme-color-dark) !important;
  color: var(--theme-on-theme) !important;
}

.lang-own:hover,
.js-langfile.lang-own:hover,
.midx-file-btn.lang-own:hover {
  background: var(--theme-color-dark) !important;
  color: var(--theme-on-theme) !important;
}

.midx-wrap {
  --midx-bg: var(--theme-bg);
  --midx-paper: var(--theme-bg-paper);
  --midx-paper-2: var(--theme-bg-soft);
  --midx-line: var(--theme-color-border);
  --midx-line-strong: var(--theme-color-border-strong);
  --midx-text: var(--theme-ink);
  --midx-muted: color-mix(in srgb, var(--theme-ink) 65%, transparent);
  --midx-accent: var(--theme-color);
}

.midx-head-icon {
  color: var(--theme-color) !important;
}

.midx-seeall {
  color: var(--theme-color) !important;
}

.midx-arrow {
  border-color: var(--theme-color-border-strong) !important;
  color: var(--theme-color) !important;
}

.calendar-band,
.calendar-tail,
#calendar-section,
.cal-mobile-dark {
  background: var(--calendar-bg) !important;
  color: var(--theme-on-dark) !important;
}

#calendar-section .cal-title,
#calendar-section #cal-title,
#calendar-section .cal-head,
#calendar-section .cal-meta,
#calendar-section .cal-item-title,
#calendar-section .cal-item-meta,
#mob-day-title,
.cal-mobile-dark,
.cal-mobile-dark * {
  color: var(--theme-on-dark) !important;
}

#cal-grid button.is-selected {
  background: var(--theme-color) !important;
  border-color: var(--theme-color-dark) !important;
}

#cal-grid button.is-selected .day-num {
  color: var(--theme-on-theme) !important;
}

/* Calendar brown separator lines (when a day has files) */
#calendar-section .mob-sep--files,
#calendar-section .mob-item .mob-sep--files,
#desk-day-wrap .mob-sep--files,
#desk-day-wrap .compact-service .mob-sep--files,
#desk-day-wrap .mob-item .mob-sep--files,
#menu-global-search-results .mob-sep--files,
.calendar-band .mob-sep--files,
.mob-sep--files,
.menu-search-sep {
  background: var(--theme-sep-files) !important;
}

/* Now-playing highlight strip behind title in calendar list */
#calendar-section .calendar-service-now-playing .cal-item-title,
#calendar-section .calendar-service-now-playing .mob-title {
  background: var(--theme-sep-now-playing) !important;
}

/* Archive / library / conventions: playing title highlight */
[data-record].is-playing .title b,
.record.is-playing .title b {
  background: var(--theme-sep-now-playing) !important;
}

/* File icon outlines on calendar dark band */
#calendar-section .js-langfile:not(.lang-own),
#desk-day-wrap .js-langfile:not(.lang-own),
#mob-day-items .js-langfile:not(.lang-own),
.calendar-service-media-overlay .js-langfile:not(.lang-own),
.cal-mobile-dark .js-langfile:not(.lang-own) {
  background: transparent !important;
  border-color: color-mix(in srgb, var(--theme-color) 55%, transparent) !important;
  color: var(--theme-color) !important;
}

#calendar-section .js-langfile:not(.lang-own) .btn-label,
#calendar-section .js-langfile:not(.lang-own) > div:last-child,
#calendar-section .js-langfile:not(.lang-own) svg,
#desk-day-wrap .js-langfile:not(.lang-own) .btn-label,
#desk-day-wrap .js-langfile:not(.lang-own) > div:last-child,
#desk-day-wrap .js-langfile:not(.lang-own) svg,
#mob-day-items .js-langfile:not(.lang-own) .btn-label,
#mob-day-items .js-langfile:not(.lang-own) > div:last-child,
#mob-day-items .js-langfile:not(.lang-own) svg,
.calendar-service-media-overlay .js-langfile:not(.lang-own) .btn-label,
.calendar-service-media-overlay .js-langfile:not(.lang-own) > div:last-child,
.calendar-service-media-overlay .js-langfile:not(.lang-own) svg,
.cal-mobile-dark .js-langfile:not(.lang-own) .btn-label,
.cal-mobile-dark .js-langfile:not(.lang-own) > div:last-child,
.cal-mobile-dark .js-langfile:not(.lang-own) svg {
  color: var(--theme-color) !important;
  stroke: currentColor !important;
  opacity: 1 !important;
}

#calendar-section .js-langfile:not(.lang-own) svg path,
#desk-day-wrap .js-langfile:not(.lang-own) svg path,
#mob-day-items .js-langfile:not(.lang-own) svg path,
.calendar-service-media-overlay .js-langfile:not(.lang-own) svg path,
.cal-mobile-dark .js-langfile:not(.lang-own) svg path {
  stroke: currentColor !important;
  opacity: 1 !important;
}

#calendar-section .js-langfile.lang-own,
#desk-day-wrap .js-langfile.lang-own,
#mob-day-items .js-langfile.lang-own,
.calendar-service-media-overlay .js-langfile.lang-own,
.cal-mobile-dark .js-langfile.lang-own,
#calendar-section .js-langfile.lang-own,
#desk-day-wrap .js-langfile.lang-own,
#mob-day-items .js-langfile.lang-own,
.calendar-service-media-overlay .js-langfile.lang-own,
.cal-mobile-dark .js-langfile.lang-own {
  background: var(--theme-color) !important;
  border-color: var(--theme-color-dark) !important;
  color: var(--theme-on-theme) !important;
}

#calendar-section .js-langfile.lang-own .btn-label,
#calendar-section .js-langfile.lang-own svg,
#desk-day-wrap .js-langfile.lang-own .btn-label,
#desk-day-wrap .js-langfile.lang-own svg,
#mob-day-items .js-langfile.lang-own .btn-label,
#mob-day-items .js-langfile.lang-own svg,
.calendar-service-media-overlay .js-langfile.lang-own .btn-label,
.calendar-service-media-overlay .js-langfile.lang-own svg {
  color: var(--theme-on-theme) !important;
}

/* Calendar dark band: unavailable media (no URL in current language) — light/faded */
#calendar-section .js-langfile.opacity-35,
#calendar-section a.js-langfile[data-av="0"],
#desk-day-wrap .js-langfile.opacity-35,
#desk-day-wrap a.js-langfile[data-av="0"],
#mob-day-items .js-langfile.opacity-35,
#mob-day-items a.js-langfile[data-av="0"],
.calendar-service-media-overlay .js-langfile.opacity-35,
.calendar-service-media-overlay a.js-langfile[data-av="0"],
.cal-mobile-dark .js-langfile.opacity-35,
.cal-mobile-dark a.js-langfile[data-av="0"] {
  background: transparent !important;
  border-color: color-mix(in srgb, var(--theme-on-dark) 22%, transparent) !important;
  color: color-mix(in srgb, var(--theme-on-dark) 45%, transparent) !important;
  opacity: 0.55 !important;
}

#calendar-section .js-langfile.opacity-35 svg,
#calendar-section a.js-langfile[data-av="0"] svg,
#desk-day-wrap .js-langfile.opacity-35 svg,
#desk-day-wrap a.js-langfile[data-av="0"] svg,
#mob-day-items .js-langfile.opacity-35 svg,
#mob-day-items a.js-langfile[data-av="0"] svg,
.calendar-service-media-overlay .js-langfile.opacity-35 svg,
.calendar-service-media-overlay a.js-langfile[data-av="0"] svg {
  color: color-mix(in srgb, var(--theme-on-dark) 45%, transparent) !important;
  opacity: 0.55 !important;
}

#calendar-section .files-row::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--theme-color) 25%, transparent) !important;
}

.midx-rec-overlay {
  background: color-mix(in srgb, var(--theme-bg) 76%, transparent) !important;
}

.midx-rec-card.is-open .midx-rec-front {
  opacity: 0.52 !important;
}

.is-conventions,
.is-archive-year,
.is-library {
  --accent: var(--theme-color);
  --brandBrown: var(--theme-color);
  --ink2: var(--theme-ink);
}

input[type="range"].mp-spot-range,
input[type="range"].mp-range {
  accent-color: var(--theme-color) !important;
}

#player-shell .mp-title,
#player-shell [data-mp-title] {
  color: rgba(255, 255, 255, 0.96) !important;
}

#player-shell .mp-meta,
#player-shell [data-mp-subtitle] {
  color: rgba(255, 255, 255, 0.80) !important;
}

#global-player-holder {
  width: 100%;
  max-width: var(--player-shell-max, min(960px, calc(100vw - 48px)));
  margin-left: auto;
  margin-right: auto;
}

#global-player-holder:empty {
  display: none;
}

#player-shell.hidden {
  display: none !important;
  pointer-events: none !important;
}

/* Unified full in-page player width (live, menu, archive, library, conventions) */
:root {
  --player-shell-max: min(960px, calc(100vw - 48px));
}

#player-shell:not(.is-mini):not(.hidden),
body.mp-inline-embedded #player-shell:not(.is-mini) {
  width: 100% !important;
  max-width: var(--player-shell-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

#player-shell:not(.is-mini) .mp-card,
#player-shell:not(.is-mini) #media-player-root {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

#player-shell:not(.is-mini) .mp-media:has(video),
#player-shell:not(.is-mini) .mp-media:has(iframe) {
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: 16 / 9 !important;
  height: auto !important;
}

#player-shell:not(.is-mini) .mp-media:has(> audio):not(:has(video)) {
  aspect-ratio: auto !important;
  height: 110px !important;
  min-height: 110px !important;
  max-height: 110px !important;
}

#player-shell:not(.is-mini) .mp-media video,
#player-shell:not(.is-mini) .mp-media iframe {
  width: 100% !important;
  height: 100% !important;
}

#player-shell:not(.is-mini) .mp-media audio {
  width: 100% !important;
  height: 100% !important;
}

/* Menu home slot — full player top bar (title + close), same as archive */
body[data-calendar-base]:not(.mp-infs) #player-home-slot #player-shell:not(.is-mini):not(.mp-inline-split) .mp-top {
  display: flex !important;
  opacity: 1 !important;
  visibility: visible !important;
}

body[data-calendar-base]:not(.mp-infs) #player-home-slot #player-shell:not(.is-mini):not(.mp-inline-split) [data-mp-title],
body[data-calendar-base]:not(.mp-infs) #player-home-slot #player-shell:not(.is-mini):not(.mp-inline-split) [data-mp-close],
body[data-calendar-base]:not(.mp-infs) #player-home-slot #player-shell:not(.is-mini):not(.mp-inline-split) .mp-top-actions {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body[data-calendar-base]:not(.mp-infs) #player-home-slot #player-shell:not(.is-mini):not(.mp-inline-split) [data-mp-title] {
  display: block !important;
}

body[data-calendar-base] #player-home-slot #player-shell:not(.is-mini):not(.mp-inline-split) .mp-top {
  min-width: 0;
}

body[data-calendar-base] #player-home-slot #player-shell:not(.is-mini):not(.mp-inline-split) .mp-top > * {
  min-width: 0;
}

body[data-calendar-base] #player-home-slot #player-shell:not(.is-mini):not(.mp-inline-split) .mp-top .min-w-0 {
  flex: 1 1 auto;
  min-width: 0;
}

body[data-calendar-base] #player-home-slot #player-shell:not(.is-mini):not(.mp-inline-split) .mp-top-actions {
  flex: 0 0 auto;
}

/* Fullscreen: never show turn-off / close (all pages) */
body.mp-infs [data-mp-close],
body.mp-infs .mp-iconbtn[data-mp-close],
#player-shell:fullscreen [data-mp-close],
#player-shell:-webkit-full-screen [data-mp-close],
.mp-fswrap:fullscreen [data-mp-close],
.mp-fswrap:-webkit-full-screen [data-mp-close] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* Inline list player (archive / conventions / library) */
#player-home-slot,
#player-overlay-slot,
.player-inline-slot:not(.is-collapsed) {
  width: 100%;
  max-width: 100%;
  scroll-margin-top: calc(var(--header-offset, 76px) + 12px);
}

.player-inline-slot {
  width: 100%;
  margin: 8px 0 14px;
  scroll-margin-top: calc(var(--header-offset, 76px) + 12px);
}

/* Collapsed when mini — no tall blank gap in the list */
body.mp-inline-docked .player-inline-slot.is-collapsed {
  min-height: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
}

.player-inline-slot-sentinel {
  width: 100%;
  height: 1px;
  margin: 0;
  padding: 0;
  pointer-events: none;
  visibility: hidden;
  overflow: hidden;
}

[data-record].is-playing,
.record.is-playing {
  scroll-margin-top: calc(var(--header-offset, 76px) + 12px);
}

body.mp-inline-embedded #player-shell:not(.is-mini) {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  z-index: auto !important;
}

body.mp-inline-session #player-home-slot:not(:has(#player-shell)) {
  display: none;
}

/* Mobile mini player — unified (archive, menu, library) */
@media (max-width: 1100px) {
  /* Menu + non-split mini: whole bar fixed at bottom */
  #player-shell.is-mini.is-mini-controls-only:not(.mp-inline-split) {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: fixed !important;
    z-index: 80 !important;
    left: 12px !important;
    right: 12px !important;
    bottom: 12px !important;
    top: auto !important;
    width: auto !important;
    max-width: calc(100vw - 24px) !important;
    transform: none !important;
    pointer-events: none !important;
  }

  #player-shell.is-mini.is-mini-controls-only:not(.mp-inline-split) .mp-card,
  #player-shell.is-mini.is-mini-controls-only:not(.mp-inline-split) .mp-fab,
  #player-shell.is-mini.is-mini-controls-only:not(.mp-inline-split) button,
  #player-shell.is-mini.is-mini-controls-only:not(.mp-inline-split) [data-mp-controls] {
    pointer-events: auto !important;
  }

  #player-shell.is-mini.is-mini-controls-only:not(.mp-inline-split) .mp-controls,
  #player-shell.is-mini.is-mini-controls-only:not(.mp-inline-split) .mp-controls.hidden {
    opacity: 1 !important;
    pointer-events: auto !important;
    visibility: visible !important;
  }

  #player-shell.is-mini.is-mini-controls-only:not(.mp-inline-split) .mp-card {
    background: rgba(18, 18, 18, 0.96) !important;
  }

  body.mp-inline-docked #player-shell.is-mini {
    position: fixed !important;
    z-index: 80 !important;
  }

  body.mp-inline-docked #player-shell.is-mini {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    left: 12px !important;
    right: 12px !important;
    bottom: 12px !important;
    top: auto !important;
    width: auto !important;
    max-width: calc(100vw - 24px) !important;
    transform: none !important;
    pointer-events: none !important;
  }

  body.mp-inline-docked #player-shell.is-mini .mp-card,
  body.mp-inline-docked #player-shell.is-mini .mp-fab,
  body.mp-inline-docked #player-shell.is-mini button,
  body.mp-inline-docked #player-shell.is-mini [data-mp-controls] {
    pointer-events: auto !important;
  }

  .player-inline-video-fab {
    position: fixed;
    z-index: 100002;
    width: 56px;
    height: 56px;
    padding: 0;
    border: 0;
    background: transparent;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease;
    transform: translateY(6px);
  }

  .player-inline-video-fab.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
  }

  .player-inline-video-fab__ring {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.28);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.38);
    background: var(--theme-color, #57301c);
    position: relative;
  }

  .player-inline-video-fab__icon {
    display: block;
    width: 22px;
    height: 22px;
    color: rgba(255, 255, 255, 0.96);
    pointer-events: none;
    transition: transform 0.15s ease;
  }

  .player-inline-video-fab__ring.is-arrow-up .player-inline-video-fab__icon {
    transform: rotate(180deg);
  }

  /* Mobile split: video stays in list, controls float when scrolled away */
  #player-home-slot #player-shell.mp-static-video,
  .player-inline-slot #player-shell.mp-static-video,
  #player-home-slot #player-shell:not(.hidden),
  .player-inline-slot #player-shell:not(.hidden) {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  #player-home-slot .mp-media,
  .player-inline-slot .mp-media,
  #player-home-slot [data-live-media],
  .player-inline-slot [data-live-media],
  #player-shell.mp-static-video .mp-media,
  #player-shell.mp-static-video [data-live-media] {
    display: block !important;
    visibility: visible !important;
    width: 100% !important;
    min-height: 180px !important;
    aspect-ratio: 16 / 9 !important;
    height: auto !important;
    overflow: visible !important;
    position: relative !important;
    background: #000 !important;
  }

  #player-home-slot video,
  .player-inline-slot video,
  #player-shell.mp-static-video video,
  #player-home-slot #live-only-video,
  .player-inline-slot #live-only-video {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: 180px !important;
    aspect-ratio: 16 / 9 !important;
    object-fit: contain !important;
    background: #000 !important;
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
  }

  body.mp-inline-remote #player-shell.mp-inline-split {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    transform: none !important;
    z-index: auto !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  body.mp-inline-remote #player-shell.mp-inline-split .mp-media {
    min-height: 180px;
    aspect-ratio: 16 / 9;
  }

  body.mp-inline-remote #player-shell.mp-inline-split .mp-media video,
  body.mp-inline-remote #player-shell.mp-inline-split .mp-media iframe {
    display: block !important;
    visibility: visible !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9;
  }

  body.mp-inline-remote #player-shell.mp-inline-split .mp-top,
  body.mp-inline-remote #player-shell.mp-inline-split .mp-centerplay,
  body.mp-inline-remote #player-shell.mp-inline-split [data-mp-title],
  body.mp-inline-remote #player-shell.mp-inline-split [data-mp-subtitle] {
    display: none !important;
  }

  body.mp-inline-remote #player-shell.mp-inline-split .mp-media > .mp-overlay,
  body.mp-inline-remote #player-shell.mp-inline-split .live-only-player .mp-overlay {
    position: fixed !important;
    inset: auto 12px 12px 12px !important;
    top: auto !important;
    z-index: 80 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    pointer-events: none !important;
  }

  body.mp-inline-remote #player-shell.mp-inline-split .live-only-player .mp-media {
    min-height: 180px;
    aspect-ratio: 16 / 9;
    position: relative;
  }

  body.mp-inline-remote #player-shell.mp-inline-split .live-only-player video,
  body.mp-inline-remote #player-shell.mp-inline-split .live-only-player audio {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body.mp-inline-remote #player-shell.mp-inline-split .live-only-player .mp-controls,
  body.mp-inline-remote #player-shell.mp-inline-split .live-only-player .mp-controls.hidden {
    opacity: 1 !important;
    pointer-events: auto !important;
    visibility: visible !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
  }

  body.mp-inline-remote #player-shell.mp-inline-split .live-only-player .live-start-overlay {
    display: none !important;
  }

  body.mp-inline-remote #player-shell.mp-inline-split .live-only-player .mp-scrub {
    display: block !important;
  }

  body.mp-inline-remote #player-shell.mp-inline-split .mp-card {
    background: transparent !important;
    box-shadow: none !important;
  }

  body.mp-inline-remote #player-shell.mp-inline-split .mp-controls,
  body.mp-inline-remote #player-shell.mp-inline-split .mp-controls.hidden {
    opacity: 1 !important;
    pointer-events: auto !important;
    visibility: visible !important;
    display: flex !important;
    flex-direction: column !important;
    background: rgba(18, 18, 18, 0.96) !important;
    border-radius: 14px !important;
    padding: 8px 10px !important;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.38) !important;
  }

  body.mp-inline-remote #player-shell.mp-inline-split .mp-bottom.mp-only-mobile {
    display: flex !important;
  }

  body.mp-inline-embedded:not(.mp-inline-remote) #player-shell:not(.is-mini) {
    position: relative !important;
  }

  body.mp-inline-embedded:not(.mp-inline-remote) #player-shell .live-only-player .mp-media,
  body.mp-inline-embedded:not(.mp-inline-remote) #player-shell .mp-card .mp-media:has(video) {
    display: block !important;
    visibility: visible !important;
    aspect-ratio: 16 / 9 !important;
    min-height: 180px !important;
  }

  body.mp-inline-embedded:not(.mp-inline-remote) #player-shell .live-only-player video,
  body.mp-inline-embedded:not(.mp-inline-remote) #player-shell .mp-media video {
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* Arrow scroll target: player sits just under the header */
  body.mp-inline-session .player-inline-slot {
    scroll-margin-top: calc(var(--header-offset, 76px) + 8px);
  }

  /* Fullscreen — override split/static slot 16:9 box so video fills screen */
  body.mp-infs .player-inline-slot .mp-media,
  body.mp-infs #player-home-slot .mp-media,
  body.mp-infs #player-shell .mp-media,
  #player-shell:fullscreen .mp-media,
  #player-shell:-webkit-full-screen .mp-media,
  .mp-fswrap:fullscreen .mp-media,
  .mp-fswrap:-webkit-full-screen .mp-media {
    aspect-ratio: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    height: 100% !important;
    flex: 1 1 0 !important;
    overflow: hidden !important;
  }

  body.mp-infs .player-inline-slot video,
  body.mp-infs #player-home-slot video,
  body.mp-infs #player-shell video,
  #player-shell:fullscreen .mp-media video,
  #player-shell:-webkit-full-screen .mp-media video,
  .mp-fswrap:fullscreen .mp-media video,
  .mp-fswrap:-webkit-full-screen .mp-media video {
    aspect-ratio: auto !important;
    min-height: 0 !important;
    height: 100% !important;
    width: 100% !important;
    max-height: none !important;
    position: absolute !important;
    inset: 0 !important;
    object-fit: contain !important;
  }
}

@media (min-width: 1100px) {
  /* Desktop mini player: scale with viewport; anchor bottom-left */
  #player-shell.is-mini:not(.is-mini-controls-only):not(.mp-inline-split):not(.mp-mini-collapsed),
  body.mp-inline-docked #player-shell.is-mini:not(.is-mini-controls-only):not(.mp-mini-collapsed) {
    position: fixed !important;
    left: 12px !important;
    right: auto !important;
    bottom: 12px !important;
    top: auto !important;
    width: clamp(260px, 28vw, 400px) !important;
    max-width: calc(100vw - 24px) !important;
    transform: none !important;
  }

  /* Minimized circle: always bottom-left corner (not where wide mini was) */
  #player-shell.is-mini.mp-mini-collapsed {
    left: 12px !important;
    right: auto !important;
    bottom: 12px !important;
    top: auto !important;
    width: 56px !important;
    height: 56px !important;
    max-width: 56px !important;
  }
}

/* Menu/home page docked mini player (survives PJAX via site-theme.css) */
body[data-calendar-base] #player-portal {
  pointer-events: none;
}

body[data-calendar-base] #player-portal > #player-shell {
  pointer-events: auto;
}

body[data-calendar-base] #player-shell.is-mini {
  position: fixed;
  right: 12px;
  bottom: 12px;
  width: min(520px, calc(100vw - 24px));
  z-index: 80;
}

body[data-calendar-base] #player-shell.is-mini .mp-card {
  max-width: none;
  width: 100%;
}

@media (min-width: 1101px) {
  body[data-calendar-base] #player-shell.is-mini {
    left: 12px;
    right: auto;
  }
}

@media (max-width: 1100px) {
  body[data-calendar-base] #player-shell.is-mini {
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    max-width: calc(100vw - 24px) !important;
    box-sizing: border-box;
    transform: none !important;
  }

  body[data-calendar-base] #player-shell.is-mini .mp-card,
  body[data-calendar-base] #player-shell.is-mini #media-player-root {
    width: 100% !important;
    max-width: 100% !important;
  }
}

body[data-calendar-base] #player-shell .mp-fab {
  display: none;
}

body[data-calendar-base] #player-shell.is-mini.mp-mini-collapsed {
  width: 56px;
  height: 56px;
}

body[data-calendar-base] #player-shell.is-mini.mp-mini-collapsed #media-player-root {
  display: none;
}

body[data-calendar-base] #player-shell.is-mini.mp-mini-collapsed .mp-fab {
  display: flex;
}

/* List pages: legacy left years rail is never used — hide always */
.archive-shell > .rail {
  display: none !important;
}

/* Below desktop width: single-column layout (covers 1100.01–1100.99 gap) */
@media (max-width: 1099px) {
  .archive-shell {
    grid-template-columns: 1fr !important;
  }
}

@media (min-width: 1100px) {
  .archive-shell {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

.tchip.active,
.mchip.active {
  background: var(--theme-color-muted) !important;
  border-color: var(--theme-color-border-strong) !important;
  color: var(--theme-color) !important;
}

body.light-page .popover,
.popover {
  background: color-mix(in srgb, var(--theme-bg) 96%, white) !important;
  border-color: var(--theme-color-border) !important;
  color: var(--theme-ink) !important;
}