._modal_jbcjf_1 {
  position: fixed;
  inset: 0;
  margin: auto;
  padding: 0;
  background: var(--section-bg);
  border: var(--border-hairline) solid var(--section-border-faint);
  border-radius: var(--radius-default);
  width: calc(100% - 2rem);
  max-height: 90vh;
  overflow: hidden;
  color: var(--text-primary);

  /* Flex layout is on the base selector (not gated by [open]) so that
   * `flex-direction: column` doesn't snap back to `row` the instant the
   * close transition starts — `display: flex` is held for 200ms by the
   * `allow-discrete` transition, but `flex-direction` is not in the
   * transition list and would otherwise switch instantly, briefly
   * rearranging header/body/footer horizontally and expanding the
   * modal's height. */
  display: flex;
  flex-direction: column;

  opacity: 1;
  transform: scale(1) translateY(0);
  transition:
    opacity 200ms ease,
    transform 200ms ease,
    overlay 200ms ease allow-discrete,
    display 200ms ease allow-discrete;

  @starting-style {
    opacity: 0;
    transform: scale(0.97) translateY(8px);
  }
}

._modal_jbcjf_1:not([open]) {
  opacity: 0;
  transform: scale(0.97) translateY(8px);
}

._modal_jbcjf_1::backdrop {
  background-color: var(--modal-backdrop);
  opacity: 1;
  transition:
    opacity 200ms ease,
    overlay 200ms ease allow-discrete,
    display 200ms ease allow-discrete;

  @starting-style {
    opacity: 0;
  }
}

._modal_jbcjf_1:not([open])::backdrop {
  opacity: 0;
}

._modal_jbcjf_1._chromeless_jbcjf_60 {
  background: transparent;
  border: none;
  box-shadow: none;
  border-radius: 0;
  max-width: 100vw;
  max-height: 100vh;
  width: auto;
  height: auto;
  overflow: visible;
}

._modal_jbcjf_1._sm_jbcjf_72 {
  max-width: 30rem;
  min-width: min(30rem, calc(100vw - 2rem));
}
._modal_jbcjf_1._md_jbcjf_76 {
  max-width: 48rem;
}
._modal_jbcjf_1._lg_jbcjf_79 {
  max-width: 64rem;
}

._header_jbcjf_83 {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: var(--space-sm);
  /* Right padding reserves the absolute close button's slot so any
   * titleActions never collide with it. */
  padding: var(--space-xl) var(--space-3xl) var(--space-lg) var(--space-xl);
  flex-shrink: 0;
}

/* Pinned top-right, just left of the absolute close button, so it never
 * collides with it regardless of how far the title wraps on a narrow
 * viewport. Height matches the close button so the icon centers against
 * it. `.headerWithActions` reserves the right padding for this cluster. */
._titleActions_jbcjf_99 {
  position: absolute;
  top: 1rem;
  right: calc(1rem + 2.25rem + var(--space-2xs));
  height: 2.25rem;
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
}

/* Extra right padding when a titleActions cluster is present, so the
 * wrapping title clears both the pinned refresh and close buttons. No
 * spacing token matches the combined cluster width, so this is a
 * deliberate layout reservation. */
._headerWithActions_jbcjf_98 {
  padding-right: 5.25rem; /* deliberate display literal */
}

/* Icon button sized to match the title's cap-height (~1rem at the
 * 1.375rem font-size) so it visually belongs next to the heading,
 * rather than dominating it. */
._titleActionButton_jbcjf_120 {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: var(--radius-default);
  background: transparent;
  border: var(--border-hairline) solid var(--section-border-faint);
  color: rgb(from var(--text-h) r g b / 0.75);
  font-size: var(--font-size-xs);
  cursor: pointer;
  transition:
    background-color 160ms ease,
    border-color 160ms ease,
    color 160ms ease;
}

._titleActionButton_jbcjf_120:hover:not(:disabled) {
  background: rgb(from var(--text-accent) r g b / 0.1);
  border-color: var(--text-accent);
  color: var(--text-accent);
}

._titleActionButton_jbcjf_120:focus-visible {
  outline: var(--border-emphasis) solid var(--text-accent);
  outline-offset: var(--border-hairline);
}

._titleActionButton_jbcjf_120:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

._titleActionButtonIcon_jbcjf_155 {
  width: 0.85rem;
  height: 0.85rem;
}

@keyframes _titleActionSpin_jbcjf_1 {
  to {
    transform: rotate(360deg);
  }
}

._titleActionButtonSpin_jbcjf_166 ._titleActionButtonIcon_jbcjf_155 {
  animation: _titleActionSpin_jbcjf_1 0.9s linear infinite;
}

._title_jbcjf_99 {
  font-family: var(--font);
  font-size: 1.375rem; /* deliberate display literal */
  font-weight: var(--weight-medium);
  color: var(--text-h);
  text-transform: uppercase;
  letter-spacing: var(--tracking-caps);
  text-align: left;
  margin: 0;
  /* Allow the title to wrap/shrink instead of pushing into the pinned
   * titleActions + close cluster. */
  min-width: 0;
}

._title_jbcjf_99::after {
  content: '';
  display: block;
  width: 48px;
  height: 2px;
  background-color: var(--text-accent);
  margin: var(--space-md) 0 0;
}

._closeButton_jbcjf_193 {
  position: absolute;
  top: 1rem;
  right: 1rem;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-h);
  background: transparent;
  border: none;
  cursor: pointer;
  font-size: var(--font-size-sm);
  transition: background-color 0.18s ease, color 0.18s ease;
}

._closeButton_jbcjf_193:hover {
  background-color: rgb(from var(--text-h) r g b / 0.06);
  color: var(--text-accent);
}

._closeButton_jbcjf_193:focus-visible {
  outline: var(--border-emphasis) solid var(--text-accent);
  outline-offset: var(--border-emphasis);
}

._closeButton_jbcjf_193:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

._content_jbcjf_226 {
  padding: 0;
  overflow-y: auto;
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

._contentChromeless_jbcjf_235 {
  overflow: visible;
  cursor: zoom-out;
}

._body_jbcjf_240 {
  padding: 0 var(--space-xl) var(--space-xl);
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}

._footer_jbcjf_247 {
  padding: var(--space-lg) var(--space-xl);
  border-top: var(--border-hairline) solid var(--section-border-faint);
  flex-shrink: 0;
  display: flex;
  gap: var(--space-sm);
}

._footerStart_jbcjf_255 {
  justify-content: flex-start;
}

._footerCenter_jbcjf_259 {
  justify-content: center;
}

._footerEnd_jbcjf_263 {
  justify-content: flex-end;
}

._footerSpaceBetween_jbcjf_267 {
  justify-content: space-between;
}

@media (max-width: 599.98px) /* BP_MOBILE */ {
  ._header_jbcjf_83 {
    padding: var(--space-xl) var(--space-lg) var(--space-lg);
  }

  /* Keep the cluster reservation at mobile — the base shorthand above
   * would otherwise shrink the right padding back under the close +
   * refresh buttons. */
  ._headerWithActions_jbcjf_98 {
    padding-right: 5.25rem; /* deliberate display literal */
  }

  ._body_jbcjf_240 {
    padding: 0 var(--space-lg) var(--space-xl);
  }

  ._title_jbcjf_99 {
    font-size: var(--font-size-base);
    letter-spacing: var(--tracking-caps);
  }
}

@media (prefers-reduced-motion: reduce) {
  ._modal_jbcjf_1,
  ._modal_jbcjf_1::backdrop {
    transition-duration: 0.01ms;
  }
}