/*
 * Playing Home is a measured, in-flow sequence: artwork, transport,
 * editorial navigation, then the shared footer. Idle and all other pages keep
 * their existing layout and geometry.
 */
body.home-approved-direction.tvc-public-shell.home-listening[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) {
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: 100% !important;
  height: auto !important;
  min-height: 100dvh !important;
  padding-top: var(--home-frame-nav, var(--tvc-nav-height)) !important;
  padding-bottom: 0 !important;
  overflow: visible !important;
}

body.home-approved-direction.tvc-public-shell.home-listening[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-viewport {
  box-sizing: border-box !important;
  flex: 0 0 var(--home-flow-content-height) !important;
  order: 1 !important;
  width: 100% !important;
  height: var(--home-flow-content-height) !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 0 !important;
  overflow: clip !important;
}

body.home-approved-direction.tvc-public-shell.home-listening[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-track {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: visible !important;
}

body.home-approved-direction.tvc-public-shell.home-listening[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 {
  box-sizing: border-box !important;
  flex: 0 0 var(--home-flow-idle-canvas-height) !important;
  width: 100% !important;
  height: var(--home-flow-idle-canvas-height) !important;
  min-height: 0 !important;
  grid-template-rows: var(--home-flow-idle-rows) !important;
  grid-template-columns: var(--home-flow-idle-columns) !important;
  padding: var(--home-flow-idle-padding) !important;
}

body.home-approved-direction.tvc-public-shell.home-listening[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-start-controls {
  margin: var(--home-flow-idle-heading-margin) !important;
}

body.home-approved-direction.tvc-public-shell.home-listening[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-mosaic {
  --home-gallery-measure: var(--home-flow-gallery-measure) !important;
  width: var(--home-flow-gallery-measure) !important;
  height: var(--home-flow-gallery-height) !important;
}

body.home-approved-direction.tvc-public-shell.home-listening[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 {
  box-sizing: border-box !important;
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  z-index: 1 !important;
  flex: 0 0 auto !important;
  order: 2 !important;
  width: 100% !important;
  margin: 12px 0 0 !important;
  box-shadow: none !important;
}

body.home-approved-direction.tvc-public-shell.home-listening[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-bottom-nav {
  box-sizing: border-box !important;
  position: relative !important;
  align-self: flex-start !important;
  inset: auto !important;
  flex: 0 0 var(--home-flow-editorial-height) !important;
  order: 3 !important;
  width: var(--home-flow-editorial-width) !important;
  height: var(--home-flow-editorial-height) !important;
  min-height: 0 !important;
  margin: var(--home-flow-editorial-gap) auto 0 !important;
  margin-left: var(--home-flow-editorial-left) !important;
  margin-right: 0 !important;
}

body.home-approved-direction.tvc-public-shell.home-listening[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-bottom-nav :is(
  .home-approved-descriptor,
  #home-about-open
) {
  top: 0 !important;
}

body.home-approved-direction.tvc-public-shell.home-listening[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-footer {
  display: grid !important;
  position: relative !important;
  inset: auto !important;
  flex: 0 0 auto !important;
  order: 4 !important;
  align-self: stretch !important;
  margin: var(--home-flow-footer-gap) 0 0 !important;
  pointer-events: auto;
}

/* Home is also a reset action, even when it is the current canonical page.
   Keep the shared menu's appearance; override only its disabled hit target. */
body.tvc-public-shell[data-tvc-canonical-page="/"] .tvc-menu-primary .menu-link[data-public-tab="home"][aria-current="page"] {
  pointer-events: auto;
  cursor: pointer;
}