/* Desktop Home only. The gallery keeps its complete source/queue; this layer
   changes presentation, not records. Mobile and connected canvases opt out. */
@media (min-width: 701px) {
  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) {
    --tvc-player-height: clamp(72px, 7.4dvh, 80px);
  }

  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) {
    /* The wall follows the viewport width, never the available viewport height.
       Short landscape windows scroll naturally instead of collapsing the sleeves. */
    --home-gallery-width: min(93vw, 1760px) !important;
    --home-gallery-measure: var(--home-gallery-width) !important;
  }

  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) #home-canvas-home {
    padding-top: clamp(14px, 2.2dvh, 24px) !important;
    padding-bottom: 0 !important;
  }

  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) #home-canvas-home #home-start-controls {
    width: var(--home-gallery-width) !important;
    margin-bottom: clamp(12px, 2dvh, 22px) !important;
  }

  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) #home-canvas-home #home-start-copy {
    max-width: calc(100% - 94px - 112px) !important;
  }

  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) #home-canvas-home #home-mosaic-panel #home-mosaic {
    --sequence-gap: clamp(10px, 1.05vw, 16px);
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    grid-template-rows: repeat(2, auto) !important;
    width: var(--home-gallery-width) !important;
    height: auto !important;
    aspect-ratio: auto !important;
    gap: var(--sequence-gap) !important;
  }

  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) #home-canvas-home #home-mosaic-panel #home-mosaic > .home-tile {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
  }

  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) #home-canvas-home #home-mosaic-panel #home-mosaic > .home-tile:nth-child(n + 9) {
    display: none !important;
  }

  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread.home-listening:not(.tvc-player-minimized)[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) #home-player {
    height: var(--tvc-player-height) !important;
    min-height: var(--tvc-player-height) !important;
  }
}

/* Landscape phones use the same wide, four-across sleeve wall as desktop.
   Portrait phones remain wholly owned by the existing mobile composition. */
@media (max-width: 700px) and (orientation: landscape) {
  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) {
    --home-gallery-width: min(93vw, 1760px) !important;
    --home-gallery-measure: var(--home-gallery-width) !important;
  }

  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) #home-canvas-home {
    position: relative !important;
    padding-top: 14px !important;
    padding-bottom: 0 !important;
  }

  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) #home-canvas-home #home-start-controls {
    width: var(--home-gallery-width) !important;
    min-height: 76px !important;
    margin-bottom: 12px !important;
    transform: none !important;
    transform-origin: initial !important;
  }

  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) #home-canvas-home #home-start-controls #home-play {
    flex-basis: 64px !important;
    width: 64px !important;
    height: 64px !important;
  }

  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) #home-canvas-home #home-start-copy {
    max-width: calc(100% - 78px - 112px) !important;
    margin-left: 12px !important;
  }

  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) #home-canvas-home #home-start-copy #home-playlist-kicker {
    font-size: min(clamp(30px, 5.4vw, 58px), calc((var(--home-gallery-width) - 78px - 112px) / 9)) !important;
  }

  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) #home-canvas-home #home-mosaic-panel {
    width: var(--home-gallery-width) !important;
  }

  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) #home-canvas-home #home-mosaic-panel #home-mosaic {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    grid-template-rows: repeat(2, auto) !important;
    grid-auto-rows: auto !important;
    width: var(--home-gallery-width) !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    gap: clamp(6px, 1vw, 12px) !important;
  }

  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) #home-canvas-home #home-mosaic-panel #home-mosaic > .home-tile {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
  }

  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) #home-canvas-home #home-mosaic-panel #home-mosaic > .home-tile:nth-child(n + 9) {
    display: none !important;
  }

}

/* The chrome controller moves the marker to body. Match its real rendered
   parent, and reuse the controller's measured hero centre and gallery edge. */
@media (min-width: 701px), (max-width: 700px) and (orientation: landscape) {
  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) #home-canvas-home {
    padding-inline: 3.5vw !important;
  }

  html:not([data-tvc-editorial-active-page="/about"]) body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #home-panel-position[aria-label] {
    position: absolute !important;
    inset: var(--tvc-position-hero-top) var(--tvc-position-hero-right) auto auto !important;
    width: 62px !important;
    height: 2px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: translateY(-50%) !important;
  }

  html:not([data-tvc-editorial-active-page="/about"]) body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #home-panel-position[aria-label] :is(button, a) {
    flex: 0 0 31px !important;
    width: 31px !important;
    height: 2px !important;
  }

  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) #home-canvas-home .home-playlist-caption {
    display: grid !important;
    grid-template-columns: minmax(112px, 1fr) minmax(0, 3fr) 112px !important;
    align-items: center !important;
    align-self: stretch !important;
    gap: 12px !important;
    margin-top: 17px !important;
    padding-right: 0 !important;
  }

  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) #home-canvas-home .home-playlist-label {
    min-width: 0 !important;
    text-align: center !important;
    overflow-wrap: normal !important;
  }

  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) #home-canvas-home .home-canvas-bottom-nav {
    --tvc-lower-copy-offset: 0px !important;
    display: flex !important;
    grid-row: 3 !important;
    align-self: stretch !important;
    margin: 17px auto 0 !important;
    padding: 0 !important;
    border: 0 !important;
    pointer-events: none;
  }

  body.home-featured-direction.home-approved-direction.tvc-public-shell.tvc-editorial-spread[data-tvc-canonical-page="/"]:has(#page-home.active:not(.is-about-canvas):not(.is-curator-canvas)) #page-home.active:not(.is-about-canvas):not(.is-curator-canvas) #home-canvas-home .home-canvas-bottom-nav #home-about-open {
    position: static !important;
    top: auto !important;
    translate: none !important;
    padding-left: 12px !important;
    border-left: 1px solid var(--tvc-public-border, rgba(52, 37, 30, .2)) !important;
    pointer-events: auto;
  }
}
