.fp-topic-overlay {

  position: fixed;

  inset: 0;

  z-index: 200;

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 1rem;

  box-sizing: border-box;

}



.fp-topic-overlay[hidden] {

  display: none;

}



.fp-topic-overlay__backdrop {

  position: absolute;

  inset: 0;

  background: rgba(0, 0, 0, 0.82);

  backdrop-filter: blur(10px);

  -webkit-backdrop-filter: blur(10px);

}



.fp-topic-overlay__panel {

  position: relative;

  z-index: 1;

  box-sizing: border-box;

  width: min(100%, 750px);

  max-width: 750px;

  min-height: 0;

  max-height: calc(100dvh - 2rem);

  height: auto;

  margin: auto;

  overflow-y: auto;

  padding: 1.25rem 1.25rem 1.5rem;

  background: linear-gradient(

    135deg,

    rgba(8, 12, 8, 0.96) 0%,

    rgba(4, 8, 4, 0.98) 100%

  );

  border: 1px solid rgba(0, 255, 65, 0.35);

  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.65);

}



.fp-topic-overlay__header {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 1rem;

  min-height: 2.25rem;

  margin-bottom: 0;

}



.fp-topic-overlay__close {

  flex-shrink: 0;

  display: flex;

  align-items: center;

  justify-content: center;

  width: 2.25rem;

  height: 2.25rem;

  padding: 0;

  border: 1px solid rgba(0, 255, 65, 0.45);

  background: rgba(0, 0, 0, 0.85);

  color: #00ff41;

  font-size: 1.35rem;

  line-height: 1;

  cursor: pointer;

  transition: border-color 0.2s ease, color 0.2s ease, background 0.2s ease;

}



.fp-topic-overlay__close:hover {

  border-color: #39ff14;

  color: #fff;

  background: rgba(0, 255, 65, 0.12);

}



.fp-topic-overlay__title {

  margin: 0;

  padding-right: 0.5rem;

  flex: 1;

  min-width: 0;

}



.fp-topic-overlay__loader {

  display: flex;

  justify-content: center;

  padding: 2rem 0;

}



.fp-topic-overlay__loader[hidden] {

  display: none;

}



.fp-topic-overlay__body {

  padding-top: 1rem;

}

.fp-topic-overlay__body > h1:first-child {

  display: none;

}

.fp-topic-overlay__body .faq.fp-faq {

  margin-top: 1.25rem;

  text-align: left;

}

.fp-topic-overlay__footer {
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(0, 255, 65, 0.25);
  text-align: center;
}

.fp-topic-overlay__footer-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
}

.fp-topic-overlay__footer[hidden] {
  display: none;
}

.fp-content-action,
.fp-topic-overlay__full-page {
  display: inline-block;
  width: 100%;
  max-width: 20rem;
  padding: 0.75rem 1.5rem;
  border: 1px solid var(--terminal, #00ff41);
  background: transparent;
  color: var(--terminal-light, #39ff14);
  font-family: var(--font-display, "Share Tech Mono", monospace);
  font-size: 0.875rem;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  touch-action: manipulation;
  transition: border-color 0.2s ease, color 0.2s ease, background 0.2s ease, opacity 0.2s ease;
}

.fp-content-action:hover,
.fp-topic-overlay__full-page:hover {
  border-color: var(--terminal-light, #39ff14);
  color: #fff;
  background: rgba(0, 255, 65, 0.1);
}

.fp-content-action.fp-copy-busy,
.fp-content-action:disabled,
.fp-content-action[aria-disabled="true"] {
  opacity: 0.55;
  pointer-events: none;
  cursor: default;
}

.fp-content-action--done {
  border-color: rgba(57, 255, 20, 0.75);
  background: rgba(0, 40, 0, 0.35);
  color: #fff;
}

.fp-article-page-actions {
  margin-top: 1.75rem;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(0, 255, 65, 0.25);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
}

.fp-topic-overlay__full-page-fab-wrap {
  display: flex;
  justify-content: flex-end;
  position: sticky;
  bottom: 0.35rem;
  margin-top: 0.5rem;
  z-index: 2;
}

.fp-topic-overlay__full-page-fab-wrap[hidden] {
  display: none;
}

.fp-topic-overlay__full-page-fab {
  display: inline-block;
  width: fit-content;
  padding: 0.5rem 0.875rem;
  border: 1px solid var(--terminal, #00ff41);
  background: rgba(4, 8, 4, 0.92);
  color: var(--terminal-light, #39ff14);
  font-family: var(--font-display, "Share Tech Mono", monospace);
  font-size: 0.75rem;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
}



.fp-topic-overlay__spinner {

  width: 2rem;

  height: 2rem;

  border: 2px solid rgba(0, 255, 65, 0.25);

  border-top-color: #39ff14;

  border-radius: 50%;

  animation: fp-topic-spin 0.8s linear infinite;

}



@keyframes fp-topic-spin {

  to { transform: rotate(360deg); }

}



body.fp-topic-open {
  overflow: hidden;
}

body.fp-scroll-lock {
  position: fixed;
  width: 100%;
  overflow: hidden;
}

html.fp-topic-pending #main,
html.fp-topic-pending footer[role="contentinfo"] {
  visibility: hidden;
}



.prose-fp a {

  text-underline-offset: 2px;

}



.prose-fp h1,

.prose-fp h2,

.prose-fp h3,

.prose-fp h4 {

  font-family: var(--font-display, "Share Tech Mono", monospace);

  color: #fff;

  line-height: 1.25;

  margin-top: 1.25rem;

  margin-bottom: 0.65rem;

}



.prose-fp h2 {

  font-size: clamp(1.5rem, 2.5vw, 2rem);

  padding-bottom: 0.35em;

  border-bottom: 1px solid rgba(255, 255, 255, 0.12);

}



.prose-fp h3 {

  font-size: 1.15rem;

  color: var(--flash-green-bright, #7fff7f);

}



.prose-fp h4 {

  font-size: 1rem;

}



.prose-fp h1:first-child,

.prose-fp h2:first-child,

.prose-fp h3:first-child {

  margin-top: 0;

}



.prose-fp p {

  margin-top: 0.75rem;

  line-height: 1.65;

}



.prose-fp p:first-child {

  margin-top: 0;

}



.prose-fp blockquote {

  margin: 1rem 0;

  padding: 0.75rem 1rem;

  border-left: 3px solid rgba(255, 255, 255, 0.28);

  background: rgba(255, 255, 255, 0.06);

  color: rgba(255, 255, 255, 0.82);

}



.prose-fp pre,
.prose-fp .fp-code-block pre {

  margin: 0;

  padding: 0.85rem 1rem;

  overflow-x: auto;

  background: rgba(0, 0, 0, 0.55);

  border: 1px solid rgba(0, 255, 65, 0.25);

  color: #d7ffd7;

  font-family: "IBM Plex Mono", monospace;

  font-size: 0.9rem;

}



.prose-fp .fp-code-block {

  position: relative;

  margin: 1rem 0;

}



.prose-fp .fp-code-block pre code {

  padding: 0;

  background: transparent;

  border: none;

  font-size: inherit;

}



.prose-fp .fp-code-copy {

  position: absolute;

  top: 0.5rem;

  right: 0.5rem;

  z-index: 3;

  pointer-events: auto;

  touch-action: manipulation;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  width: 2rem;

  height: 2rem;

  padding: 0;

  border: 1px solid rgba(0, 255, 65, 0.35);

  border-radius: 4px;

  background: rgba(0, 0, 0, 0.65);

  color: rgba(255, 255, 255, 0.75);

  cursor: pointer;

  opacity: 0.85;

  transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease, opacity 0.15s ease;

}



.prose-fp .fp-code-copy:hover,
.prose-fp .fp-code-copy:focus-visible {

  border-color: rgba(57, 255, 20, 0.55);

  opacity: 1;

}



.prose-fp .fp-code-copy__icon {

  display: block;

  flex-shrink: 0;

}



.prose-fp .fp-code-copy__icon--check {

  display: none;

  color: #39ff14;

}



.prose-fp .fp-code-copy--done {
  pointer-events: none;
  border-color: rgba(57, 255, 20, 0.75);
  background: rgba(0, 40, 0, 0.75);
  animation: fp-code-copy-pulse 0.35s ease;
}

.prose-fp .fp-code-copy.fp-copy-busy {
  opacity: 0.55;
  pointer-events: none;
}

@media (max-width: 640px) {
  .prose-fp .fp-code-copy {
    width: 2.75rem;
    height: 2.75rem;
    top: 0.35rem;
    right: 0.35rem;
  }
}



.prose-fp .fp-code-copy--done .fp-code-copy__icon--copy {

  display: none;

}



.prose-fp .fp-code-copy--done .fp-code-copy__icon--check {

  display: block;

}



@keyframes fp-code-copy-pulse {

  0% {

    transform: scale(1);

  }

  50% {

    transform: scale(1.08);

  }

  100% {

    transform: scale(1);

  }

}



.prose-fp hr {

  margin: 1.25rem 0;

  border: 0;

  border-top: 1px solid rgba(0, 255, 65, 0.3);

}



.prose-fp figure {

  display: flex;

  flex-direction: column;

  align-items: center;

  width: 100%;

  margin: 1rem auto;

}



.prose-fp figure img,

.prose-fp img.fp-article-image {

  display: block;

  margin: 0 auto;

  width: auto;

  height: auto;

  max-width: min(100%, calc(100vw - 2.5rem));

  max-height: min(50dvh, 360px);

  object-fit: contain;

  object-position: center;

  border: 1px solid rgba(0, 255, 65, 0.25);

  border-radius: 8px;

}



@media (min-width: 640px) {

  .prose-fp figure img,

  .prose-fp img.fp-article-image {

    max-width: min(100%, 640px);

    max-height: min(55dvh, 480px);

  }

}



@media (min-width: 1024px) {

  .prose-fp figure img,

  .prose-fp img.fp-article-image {

    max-width: min(100%, 720px);

    max-height: min(60dvh, 560px);

  }

}



.prose-fp img:not(.fp-article-image) {

  max-width: 100%;

  height: auto;

}



.prose-fp figcaption {

  margin-top: 0.5rem;

  font-size: 0.875rem;

  color: rgba(255, 255, 255, 0.65);

  text-align: center;

}



.prose-fp ul,

.prose-fp ol {

  margin: 0.75rem 0 0.75rem 1.25rem;

  padding-left: 1rem;

}



.prose-fp li {

  margin-top: 0.35rem;

  line-height: 1.6;

}



.prose-fp strong {

  color: #fff;

  font-weight: 700;

}



.prose-fp em {

  font-style: italic;

}



.prose-fp u {

  text-underline-offset: 2px;

}



.prose-fp s {

  opacity: 0.75;

}



.prose-fp code {

  padding: 0.1rem 0.35rem;

  background: rgba(0, 0, 0, 0.45);

  border: 1px solid rgba(0, 255, 65, 0.2);

  font-family: "IBM Plex Mono", monospace;

  font-size: 0.9em;

}



.prose-fp .fp-align-center {

  text-align: center;

}



.prose-fp .fp-align-right {

  text-align: right;

}



.prose-fp .fp-align-justify {

  text-align: justify;

}