/* CheerDI global layout — top-gap purge + full-screen tab shells (first paint) */
html, body {
  margin: 0 !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
  top: 0 !important;
  min-height: 100vh;
  min-height: 100dvh;
  height: 100%;
  width: 100%;
  box-sizing: border-box;
  background: #0b0f19 !important;
  background-color: #0b0f19 !important;
}

/* Hide legacy bulky headers; micro floating bar is allowed */
#top-nav-bar,
header.main-header,
nav.top-navigation,
.cheerdi-top-bar:not(.cheerdi-micro-bar),
.reels-top,
header.site-header,
header.app-header,
.legacy-top-nav {
  display: none !important;
  height: 0 !important;
  max-height: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
  margin: 0 !important;
  padding: 0 !important;
  visibility: hidden !important;
}

/* Ultra-compact floating micro top bar (28px) — overlay only, no layout gap */
nav.cheerdi-top-nav.cheerdi-micro-bar,
#cheerdiTopNav.cheerdi-micro-bar,
.micro-top-nav {
  position: fixed !important;
  top: 10px !important;
  right: 12px !important;
  left: auto !important;
  z-index: 10000 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  padding: 0 6px !important;
  margin: 0 !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  background: rgba(11, 15, 25, 0.75) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  visibility: visible !important;
  opacity: 1 !important;
  overflow: visible !important;
  pointer-events: auto !important;
}
html.cheerdi-embed nav.cheerdi-micro-bar,
html.cheerdi-embed #cheerdiTopNav.cheerdi-micro-bar {
  display: none !important;
}

.cheerdi-embed,
html.cheerdi-embed,
html.cheerdi-embed body,
#tab-content-frame,
.tab-frame,
iframe.cheerdi-tab-frame,
.cheerdi-tab-frame,
.cheerdi-embed,
.reels-shell,
.page-shell,
.wrap,
.feed-container,
.live-shell,
.live-page,
.avatar-community-container,
.msg-shell,
#messages-container,
.chat-viewport-wrapper,
#listPane,
.marketplace-wrap,
body.avatar-viewer {
  top: 0 !important;
  margin: 0 !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
  min-height: 100vh !important;
  min-height: 100dvh !important;
  height: 100vh !important;
  height: 100dvh !important;
  width: 100% !important;
  box-sizing: border-box;
}

/* Messages tab — never blank/dark inside iframe shell */
#messages-container,
.chat-viewport-wrapper,
.msg-shell {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: calc(100dvh - 65px) !important;
  min-height: calc(100dvh - 65px) !important;
  background: #0b0f19 !important;
}

/* Parent tab-shell frames only — embeds already sit inside a 65px-reserved iframe */
iframe.cheerdi-tab-frame,
.cheerdi-tab-frame,
#tab-content-frame,
.tab-frame {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  margin: 0 !important;
  margin-top: 0 !important;
  padding: 0 !important;
  padding-top: 0 !important;
  height: calc(100vh - 65px) !important;
  height: calc(100dvh - 65px) !important;
  max-height: calc(100dvh - 65px) !important;
  min-height: calc(100dvh - 65px) !important;
  width: 100% !important;
  border: 0 !important;
  overflow: hidden !important;
  background: #0b0f19 !important;
  background-color: #0b0f19 !important;
}
html.cheerdi-embed,
html.cheerdi-embed body,
.cheerdi-embed {
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background-color: #0b0f19 !important;
}

iframe.cheerdi-tab-frame[data-active="1"] {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  top: 0 !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
  height: calc(100vh - 65px) !important;
  height: calc(100dvh - 65px) !important;
  max-height: calc(100dvh - 65px) !important;
}

/* Bottom nav stays opaque above every tab — no page bleed underneath */
.cheerdi-bottom-nav,
nav.bottom-nav,
nav.cheerdi-bottom-nav {
  position: fixed !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 65px !important;
  background: #0b0f19 !important;
  background-color: #0b0f19 !important;
  opacity: 1 !important;
  z-index: 9999 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.avatar-community-container {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: 100vh !important;
  height: 100dvh !important;
}

.avatar-snap-card {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: 100% !important;
  min-height: 100% !important;
}

.reel,
.reel video,
.reel-thumb {
  width: 100%;
  height: 100vh;
  height: 100dvh;
  min-height: 100dvh;
  max-height: 100dvh;
  margin-top: 0 !important;
  padding-top: 0 !important;
  top: 0 !important;
  object-fit: cover;
  box-sizing: border-box;
}