.planet-menu { --letter-hover-color: #242423; }
.member-dialog {
  grid-template-columns: minmax(0, 1fr);
  background: transparent; background-attachment: initial;
  --story-diameter: min(96vw, 96dvh);
  grid-template-rows: minmax(0, 1fr);
}
.member-dialog::backdrop {
  cursor: auto;
  background: #24242326;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.member-story-circle {
  position: relative; flex-shrink: 0;
  width: var(--story-diameter); height: var(--story-diameter);
  border-radius: 50%; background: #FEE19F;
  display: grid; place-items: center; overflow: hidden;
}
.member-story-circle .member-story {
  width: 74%; height: 68%; padding: 0 16px 24px;
  color: #242423;
  line-height: 1.6;
}
.member-story-circle .member-story p { margin-bottom: 18px; }
.member-story-circle #member-story-title { color: #56B8E8; }
.member-story-circle .member-close { top: max(4%, calc((var(--story-diameter) - 100dvh) / 2 + 16px)); right: calc(50% - 24px); }
.member-story-circle .member-scroll { bottom: max(4%, calc((var(--story-diameter) - 100dvh) / 2 + 16px)); }
@media (max-width: 820px) {
  .member-story-circle .member-story { width: 74%; padding: 0 8px 24px; }
}

/* Preserve the left-to-right lettering animation; only its hover color changes. */
:root body .member-story[data-legal-document="true"] a,
:root body .member-story[data-legal-document="true"] a .letter-wipe {
  --letter-hover-color:var(--circle-orange,#ffb812)!important;
}
