.nav-worlds { position: relative; }
.nav-worlds > summary { display: flex; align-items: center; gap: 6px; min-height: 44px; cursor: pointer; list-style: none; white-space: nowrap; }
.nav-worlds > summary::-webkit-details-marker { display: none; }
.nav-worlds > summary .icon { width: 16px; height: 16px; transition: transform .32s cubic-bezier(.22, 1, .36, 1); }
.nav-worlds[open] > summary { color: var(--brand-blue); }
.nav-worlds[open] > summary .icon { transform: rotate(180deg); }
.nav-worlds-list { position: absolute; top: calc(100% + 12px); right: 0; z-index: 30; width: 390px; max-width: calc(100vw - 48px); max-height: 65dvh; overflow-y: auto; margin: 0; padding: 8px; list-style: none; background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--brand-blue); border-radius: 12px; box-shadow: 0 16px 48px #061c4326; }
.nav-worlds-list li + li { border-top: 1px solid var(--line); }
.nav-worlds-list a { display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 12px; border-radius: 6px; font-size: 13px; line-height: 1.5; white-space: normal; }
.nav-worlds-list a > span:first-child { color: var(--brand-blue); font-size: 11px; font-weight: 800; flex: none; }
.nav-worlds-list a:hover, .nav-worlds-list a:focus-visible { background: var(--soft); color: var(--brand-blue); }
.nav-worlds-list a:focus-visible { outline-offset: -2px; }
.nav-worlds > summary { transition: color .2s ease; }
.nav-worlds-list a { transition: background-color .18s ease, color .18s ease; }
/* Keep native disclosure semantics while allowing the closing frame to finish. */
@supports (transition-behavior: allow-discrete) {
  .nav-worlds::details-content {
    transition: content-visibility .32s allow-discrete;
  }
  .nav-worlds-list {
    opacity: 0;
    transform: translateY(-8px) scale(.985);
    transform-origin: top right;
    transition: opacity .22s ease, transform .32s cubic-bezier(.22, 1, .36, 1);
  }
  .nav-worlds[open] .nav-worlds-list { opacity: 1; transform: translateY(0) scale(1); }
  .nav-worlds:not([open]) .nav-worlds-list { pointer-events: none; }
  @starting-style {
    .nav-worlds[open] .nav-worlds-list { opacity: 0; transform: translateY(-8px) scale(.985); }
  }
}
@media (max-width: 700px) {
  .nav-worlds { width: 100%; border-bottom: 1px solid var(--line); }
  .nav-worlds > summary { padding-block: 14px; justify-content: space-between; }
  .nav-worlds-list { position: static; width: 100%; max-width: none; max-height: 42dvh; margin-bottom: 12px; box-shadow: none; background: var(--soft); border-top-width: 1px; }
  .nav-worlds-list a { padding: 10px 8px; font-size: 12px; }
  @supports (interpolate-size: allow-keywords) {
    .nav-worlds::details-content {
      interpolate-size: allow-keywords;
      block-size: 0;
      overflow: clip;
      transition: block-size .32s cubic-bezier(.22, 1, .36, 1), content-visibility .32s allow-discrete;
    }
    .nav-worlds[open]::details-content { block-size: auto; }
  }
}
@media (prefers-reduced-motion: reduce) {
  .nav-worlds::details-content, .nav-worlds > summary, .nav-worlds > summary .icon,
  .nav-worlds-list, .nav-worlds-list a { transition: none; }
}
