/* Theme styling only: Ghost Portal continues to own the forms and auth flow. */
#ghost-portal-root iframe[title='portal-popup'] {
  color-scheme: light;
  background: transparent;
}

/* The marker is set only on the same-origin reader popup, never Ghost Admin. */
html[data-revblock-reader] {
  --white: var(--revblock-reader-surface, #171720);
  --grey0: var(--revblock-reader-text, #e7e5ee);
  --grey1: var(--grey0);
  --grey2: var(--grey0);
  --grey3: var(--revblock-reader-muted, #aaa7b8);
  --grey4: var(--grey3);
  --grey5: var(--grey3);
  --grey6: var(--grey3);
  --grey7: var(--grey3);
  --grey8: var(--grey3);
  --grey9: var(--grey3);
  --grey10: var(--revblock-reader-line, #2d2b3b);
  --grey11: var(--grey10);
  --grey12: var(--grey10);
  --grey13: var(--revblock-reader-bg, #0d0d15);
  --grey14: var(--grey13);
  --red: var(--revblock-reader-pink, #f48fbd);
  --brandcolor: var(--revblock-reader-accent, #b995ff);
  background: transparent !important;
  color-scheme: light;
}
html[data-revblock-reader] body {
  background: transparent;
  color: var(--grey0);
  font-family: var(--revblock-reader-font, system-ui, sans-serif);
}
html[data-revblock-reader] :is(button, button span, input, select, textarea) {
  font-family: inherit;
}
html[data-revblock-reader] .gh-portal-popup-background {
  background: rgb(0 0 0 / 60%);
  backdrop-filter: blur(3px);
}
html[data-revblock-reader] .gh-portal-popup-container {
  border: 1px solid var(--revblock-reader-line, #2d2b3b);
  border-radius: 12px;
  box-shadow: 0 18px 60px rgb(0 0 0 / 25%);
}
html[data-revblock-reader] .gh-portal-input-label {
  font-family: var(--revblock-reader-mono, ui-monospace, monospace);
  font-size: 1.2rem;
  letter-spacing: 0.03em;
}
html[data-revblock-reader] .gh-portal-input {
  background: var(--revblock-reader-bg, #0d0d15);
  color: var(--grey0);
  border-color: var(--revblock-reader-line, #2d2b3b);
  border-radius: 6px;
  font-size: 16px;
}
html[data-revblock-reader] .gh-portal-input::placeholder {
  color: var(--grey3);
  opacity: 1;
}
html[data-revblock-reader] .gh-portal-input:focus {
  border-color: var(--brandcolor);
  box-shadow: 0 0 0 1px var(--brandcolor);
}
html[data-revblock-reader] .gh-portal-btn-primary {
  background: var(--brandcolor) !important;
  color: var(--revblock-reader-bg, #0d0d15);
  border-radius: 6px;
}
/* Portal sets publication-brand colours inline on these native controls. The
   blog uses a darker accent in light mode to retain readable contrast. */
html[data-revblock-reader] :is(.gh-portal-btn-link, .gh-portal-btn-inline, .gh-portal-btn-branded, .gh-portal-btn-list, .gh-portal-list-action) {
  color: var(--brandcolor) !important;
}
html[data-revblock-reader] .gh-portal-closeicon {
  color: var(--grey3) !important;
}
html[data-revblock-reader] .gh-portal-account-header svg {
  color: var(--brandcolor) !important;
}
html[data-revblock-reader] .gh-portal-loadingicon :is(path, rect) {
  fill: var(--revblock-reader-bg, #0d0d15);
}
html[data-revblock-reader] .gh-portal-loadingicon.dark :is(path, rect) {
  fill: var(--grey0);
}
html[data-revblock-reader] .gh-portal-powered a {
  background: var(--revblock-reader-surface, #171720);
  color: var(--grey3);
  border: 1px solid var(--revblock-reader-line, #2d2b3b);
}
html[data-revblock-reader] :focus-visible {
  outline: 2px solid var(--brandcolor);
  outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
  html[data-revblock-reader] .gh-portal-popup-container {
    animation-duration: 0.01ms;
  }
}
