/* Embedded modules share the app's navigation shell.
   The parent owns the global back action and demo account selector.
   Local tabs, task controls and dialog close buttons stay in the module. */

html.experience-embedded :is(
  .world-header,
  .crew-external,
  .local-brand,
  .join-header,
  .join-story,
  .external-header,
  .external-footer,
  .shop-header,
  .shop-hero,
  .collection-strip,
  .brand-note,
  .shop-footer,
  .studio-brand,
  .studio-sidebar > .workspace-label,
  .studio-sidebar > .sidebar-bottom,
  .studio-ecosystem-strip,
  .ws-header,
  .ws-footer,
  .ws-context-row
) {
  display: none !important;
}

html.experience-embedded [data-role-switch] {
  display: none !important;
}

/* World begins with its content; its photo-story close control is untouched. */
html.experience-embedded .creator-world {
  padding-top: 4px;
}

html.experience-embedded .world-directory,
html.experience-embedded .world-empty {
  padding-top: 26px;
}

/* Crew keeps its own section tabs, shortlist and workspace controls. */
html.experience-embedded .crew-shell > .workspace-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  min-height: 0;
  padding: 10px;
}

html.experience-embedded .crew-shell > .workspace-bar .crew-tabs {
  flex: 1 1 160px;
  width: auto;
  min-width: 0;
  justify-content: stretch;
}

html.experience-embedded .crew-shell > .workspace-bar .crew-tabs button {
  flex: 1 1 0;
  min-width: 0;
  padding: 9px 12px;
}

html.experience-embedded .crew-shell > .workspace-bar .workspace-actions {
  flex: 1 1 135px;
  justify-content: flex-end;
  margin-left: auto;
  gap: 12px;
}

html.experience-embedded .crew-shell > .role-row {
  gap: 0;
  margin: 0;
  padding: 0;
}

html.experience-embedded .crew-shell > .role-row > p {
  display: none;
}

/* Music retains internal destinations; its global cross-module bar is removed. */
html.experience-embedded .music-workspace-links > [data-open-module] {
  display: none;
}

html.experience-embedded .music-workspace-bar {
  width: calc(100% - 30px);
  margin: 12px auto 0;
  padding: 0;
  gap: 0;
}

html.experience-embedded .music-workspace-links {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  width: 100%;
  min-width: 0;
  font-size: 9px;
}

html.experience-embedded .music-workspace-links > a:not([hidden]):not([data-open-module]) {
  display: inline-flex;
  align-items: center;
  min-height: 35px;
  padding: 10px 13px;
  border-radius: 999px;
  background: #f7f2f507;
  line-height: 1.4;
}

html.experience-embedded .music-workspace-links > [hidden] {
  display: none !important;
}

/* Shop's remaining bar is a bag control, not a second page header. */
html.experience-embedded .embedded-storebar {
  position: static;
  min-height: 48px;
  margin: 4px 10px 0;
  padding: 8px 12px;
  border-radius: 22px;
  background: transparent;
  color: #302d33;
}

html.experience-embedded .embedded-storebar h1 {
  display: none;
}

html.experience-embedded .embedded-storebar [data-store-world] {
  margin: 0;
  font-size: 9px;
  color: #756d79;
}

html.experience-embedded .embedded-storebar .bag-trigger {
  border-color: #302d3320;
  background: #ffffff80;
}

/* Studio's section navigation becomes a horizontal control within the page. */
html.experience-embedded .studio-sidebar {
  position: sticky;
  top: 0;
  left: auto;
  z-index: 20;
  display: block;
  width: 100%;
  height: auto;
  min-width: 0;
  margin: 0;
  padding: 10px 12px 5px;
  border: 0;
  border-radius: 0 0 23px 23px;
  background: #302d33;
}

html.experience-embedded .studio-navigation {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 6px;
  width: 100%;
  min-width: 0;
  padding: 3px 0 7px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
  scrollbar-color: #89748e55 transparent;
}

html.experience-embedded .studio-navigation button {
  flex: 0 0 auto;
  gap: 7px;
  min-height: 36px;
  padding: 10px 13px;
  border-radius: 999px;
  font-size: 10px;
  line-height: 1.4;
  scroll-snap-align: start;
}

html.experience-embedded .studio-navigation button svg {
  width: 14px;
  height: 14px;
}

html.experience-embedded .studio-main {
  width: 100%;
  max-width: none;
  min-width: 0;
  margin: 0;
  padding: 0 14px;
}

/* This compact card identifies the active model and keeps the profile action. */
html.experience-embedded .studio-topbar {
  height: auto;
  min-height: 62px;
  gap: 12px;
  margin: 11px 0 0;
  padding: 14px 12px;
  border: 0;
  border-radius: 24px;
  background: #f7f2f504;
}

html.experience-embedded .studio-topbar .creator-identity {
  flex: 1 1 auto;
  min-width: 0;
  gap: 9px;
}

html.experience-embedded .studio-topbar .creator-identity strong {
  max-width: 100%;
  font-size: 10px;
}

html.experience-embedded .studio-topbar .creator-identity > img {
  width: 32px;
  height: 32px;
}

html.experience-embedded .studio-topbar .topbar-right {
  flex: 0 0 auto;
  gap: 0;
}

html.experience-embedded .studio-topbar [data-world-switch] {
  display: none;
}

html.experience-embedded .studio-topbar .fan-profile-link {
  min-height: 34px;
  padding: 10px;
  gap: 7px;
  font-size: 8px;
  line-height: 1.4;
  white-space: nowrap;
}

@media (max-width: 350px) {
  html.experience-embedded .studio-main {
    padding-inline: 11px;
  }

  html.experience-embedded .studio-topbar {
    gap: 9px;
    padding-inline: 10px;
  }

  html.experience-embedded .studio-topbar .creator-identity strong {
    font-size: 9px;
  }
}