/* Light DOM integration for the ranking home page. */
#homepage-redesign[hidden] {
  display: none !important;
}
body.notmeter-homepage {
  margin: 0;
  background: #080c12;
}
body.notmeter-shared-shell {
  overflow-x: clip;
}
@view-transition {
  navigation: auto;
}
::view-transition {
  pointer-events: none;
}
::view-transition-group(root), ::view-transition-old(root), ::view-transition-new(root) {
  animation-duration: 1ms;
  animation-timing-function: step-end;
}
html[data-nm-shell-pending]::view-transition-group(root),
html[data-nm-shell-pending]::view-transition-old(root),
html[data-nm-shell-pending]::view-transition-new(root) {
  animation-play-state: paused;
}
@property --nm-rank-sweep {
  syntax: '<angle>';
  inherits: false;
  initial-value: 0deg;
}
body.notmeter-shared-shell #character-search-popover {
  position: static;
  overflow: visible;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--fg);
  font: 400 14px var(--sans);
}
body.notmeter-shared-shell #character-search-popover .character-search-popover-head {
  min-height: 0;
  flex-wrap: wrap;
  gap: 6px 12px;
  padding: 12px 20px 4px;
  border: 0;
  background: transparent;
}
body.notmeter-shared-shell #character-search-popover :is(.character-search-popover-head strong, .character-search-popover-head span, .character-search-group-head, .character-search-empty) {
  color: var(--fg-3);
  font-size: 11.5px;
  font-weight: 500;
}
body.notmeter-shared-shell #character-search-popover .character-search-popover-heading {
  flex-wrap: wrap;
  gap: 6px 12px;
}
body.notmeter-shared-shell #character-search-results {
  grid-template-columns: minmax(0, 1fr);
  gap: 2px;
  max-height: none;
  overflow: visible;
  padding: 6px 8px 12px;
}
body.notmeter-shared-shell #character-search-popover .character-search-group-head {
  padding: 4px 12px;
  border: 0;
  background: transparent;
}
body.notmeter-shared-shell #character-search-popover :is(.character-search-group-head strong, .character-search-group-head span) {
  color: inherit;
  font: inherit;
}
body.notmeter-shared-shell #character-search-popover .character-search-row {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px;
  min-height: 0;
  border: 0;
  border-radius: 9px;
  background: transparent;
}
body.notmeter-shared-shell #character-search-popover .character-search-row:is(:hover, :focus-within) {
  background: var(--panel-2);
}
body.notmeter-shared-shell #character-search-popover .character-search-open {
  grid-template-columns: 26px minmax(0, 1fr) auto;
  gap: 12px;
  min-height: 0;
  padding: 9px 0 9px 12px;
  color: var(--fg);
}
body.notmeter-shared-shell #character-search-popover .character-search-avatar {
  width: 26px;
  height: 26px;
  border: 0;
  border-radius: 7px;
  background: var(--accent-soft);
}
body.notmeter-shared-shell #character-search-popover :is(.character-search-meta, .character-search-job) {
  color: var(--fg-3);
  font-size: 12px;
}
body.notmeter-shared-shell #character-search-popover .character-search-job img {
  width: 20px;
  height: 20px;
}
body.notmeter-shared-shell #character-search-popover .character-search-cp span {
  color: var(--cp);
}
body.notmeter-shared-shell #character-search-popover :is(.character-search-action, .character-search-race-filters button) {
  border-color: var(--line);
  border-radius: 7px;
  background: var(--panel);
  color: var(--fg-2);
}
body.notmeter-shared-shell #character-search-popover .character-search-action:is(:hover, :focus-visible),
body.notmeter-shared-shell #character-search-popover .character-search-race-filters button[aria-pressed="true"] {
  border-color: var(--line-2);
  background: var(--panel-2);
  color: var(--fg);
}
body.notmeter-shared-shell #character-search-popover .character-favorite-button[aria-pressed="true"] {
  color: var(--gold);
}
@media (max-width: 420px) {
  body.notmeter-shared-shell #character-search-popover .character-search-open {
    grid-template-columns: 26px minmax(0, 1fr) 20px;
    gap: 8px;
  }
  body.notmeter-shared-shell #character-search-popover .character-search-job {
    overflow: hidden;
    white-space: nowrap;
  }
  body.notmeter-shared-shell #character-search-popover .character-search-job img { flex: none; }
}
body.notmeter-shared-shell #legal-consent:not([hidden]) {
  display: inline;
  margin-inline-start: .5em;
}

@media (min-width: 1900px) {
  body.notmeter-homepage .creator-banner,
  body.notmeter-homepage .sponsor-rail {
    width: min(300px, calc((100vw - 1296px) / 2 - 48px));
    height: auto;
    aspect-ratio: 1 / 2;
  }
  body.notmeter-homepage .creator-banner { right: calc(50% + 672px); }
  body.notmeter-homepage .sponsor-rail { left: calc(50% + 672px); }
  body.notmeter-homepage .sponsor-ad-link { width: 100%; height: auto; aspect-ratio: 1 / 2; }
  body.notmeter-homepage .sponsor-ad-link img { width: 100%; height: auto; }
}

#notmeter-site #homepage-redesign > [slot="ranking-discord"] { display: contents; }
#notmeter-site #homepage-redesign > [slot="ranking-discord"]::before { content: none; }
#homepage-redesign > #party-finder-guide[slot="party-finder"] { margin: 0; }

body#notmeter-site.notmeter-shared-shell .app-shell > :is(.topbar, #global-character-search, .page-footer) {
  display: none !important;
}

body.notmeter-shared-shell :is(.optimization-topbar, .guide-header, .legal-header),
body.notmeter-shared-shell .site-header :is(.brand, nav, #language) {
  display: none !important;
}
body.notmeter-shared-shell .site-header {
  height: auto;
  min-height: 0;
  display: flex;
  justify-content: flex-end;
  padding-block: 4px;
}
body.notmeter-shared-shell .site-header .header-actions {
  grid-column: auto;
  grid-row: auto;
}
body.notmeter-shared-shell .guide-sidebar {
  top: var(--nm-shell-height);
  height: calc(100dvh - var(--nm-shell-height));
}
body.notmeter-shared-shell .guide-option {
  scroll-margin-top: calc(var(--nm-shell-height) + 24px);
}
@media (max-width: 760px) {
  body.notmeter-shared-shell .guide-sidebar { height: auto; }
  body.notmeter-shared-shell .guide-option { scroll-margin-top: calc(var(--nm-shell-height) + 84px); }
}