/* Koenig editor cards — Ghost content */
.gh-content .kg-width-wide {
  position: relative;
  width: min(100vw - 2rem, 72rem);
  left: 50%;
  transform: translateX(-50%);
}

.gh-content .kg-width-full {
  position: relative;
  width: 100vw;
  left: 50%;
  transform: translateX(-50%);
}

.gh-content figure {
  margin: var(--ds-space-8) 0;
}

.gh-content .kg-image-card,
.gh-content .kg-gallery-card {
  margin: var(--ds-space-8) 0;
}

.gh-content .kg-image-card figcaption,
.gh-content .kg-gallery-card figcaption {
  margin-top: var(--ds-space-2);
  padding: 0 var(--ds-space-1);
  font-size: 0.9rem;
  line-height: 1.45;
  color: var(--ds-color-muted);
  text-align: center;
}

.gh-content .kg-image-card figcaption a,
.gh-content .kg-gallery-card figcaption a {
  color: var(--ds-color-accent);
  text-decoration: none;
}

.gh-content .kg-gallery-container {
  margin: var(--ds-space-8) 0;
}

.gh-content .kg-gallery-row {
  display: flex;
  gap: var(--ds-space-2);
}

.gh-content .kg-gallery-image img {
  border-radius: var(--ds-radius-md);
}

.gh-content .kg-bookmark-card {
  display: flex;
  border: 1px solid var(--ds-color-border);
  border-radius: var(--ds-radius-md);
  overflow: hidden;
  background: var(--ds-surface-1);
  margin: var(--ds-space-8) 0;
  transition:
    border-color var(--ds-duration-fast) var(--ds-ease-standard),
    box-shadow var(--ds-duration-fast) var(--ds-ease-standard);
}

.gh-content .kg-bookmark-card:hover {
  border-color: var(--ds-color-border-strong);
  box-shadow: var(--ds-shadow-sm);
}

.gh-content .kg-bookmark-container {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: var(--ds-space-4);
  text-decoration: none;
  color: inherit;
}

.gh-content .kg-bookmark-content {
  display: flex;
  flex-direction: column;
  gap: var(--ds-space-2);
  flex: 1;
  min-width: 0;
}

.gh-content .kg-bookmark-author {
  font-weight: 600;
  color: var(--ds-color-fg);
}

.gh-content .kg-bookmark-publisher {
  font-size: 0.85rem;
  color: var(--ds-color-faint);
}

.gh-content .kg-bookmark-title {
  font-weight: 650;
  margin: 0 0 var(--ds-space-2);
}

.gh-content .kg-bookmark-description {
  margin: 0 0 var(--ds-space-3);
  font-size: 0.95rem;
  color: var(--ds-color-muted);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.gh-content .kg-bookmark-metadata {
  display: flex;
  align-items: center;
  gap: var(--ds-space-2);
  font-size: 0.85rem;
  color: var(--ds-color-faint);
  margin-top: auto;
}

.gh-content .kg-bookmark-icon {
  width: 1.25rem;
  height: 1.25rem;
  border-radius: var(--ds-radius-sm);
}

.gh-content .kg-bookmark-thumbnail img {
  width: 200px;
  height: 100%;
  min-height: 140px;
  object-fit: cover;
}

@media (max-width: 640px) {
  .gh-content .kg-bookmark-card {
    flex-direction: column;
  }

  .gh-content .kg-bookmark-thumbnail img {
    width: 100%;
    min-height: 200px;
  }
}

.gh-content .kg-toggle-card {
  border: 1px solid var(--ds-color-border);
  border-radius: var(--ds-radius-md);
  padding: var(--ds-space-4);
  background: var(--ds-surface-1);
  margin: var(--ds-space-8) 0;
}

.gh-content .kg-toggle-heading {
  font-weight: 650;
  cursor: pointer;
}

.gh-content .kg-callout-card {
  display: flex;
  gap: var(--ds-space-4);
  padding: var(--ds-space-4);
  border-radius: var(--ds-radius-md);
  border: 1px solid var(--ds-color-border);
  background: var(--ds-surface-2);
  margin: var(--ds-space-8) 0;
}

.gh-content .kg-callout-text {
  flex: 1;
  min-width: 0;
  font-size: 0.98rem;
  line-height: 1.55;
}

.gh-content .kg-callout-text > :first-child {
  margin-top: 0;
}

.gh-content .kg-callout-text > :last-child {
  margin-bottom: 0;
}

/* Koenig callout background variants (Ghost 5) */
.gh-content .kg-callout-card-grey {
  background: var(--ds-surface-2);
  border-color: var(--ds-color-border);
}

.gh-content .kg-callout-card-white {
  background: var(--ds-surface-1);
}

.gh-content .kg-callout-card-accent {
  background: var(--ds-color-accent-muted);
  border-color: color-mix(in srgb, var(--ds-color-accent) 40%, var(--ds-color-border));
}

.gh-content .kg-callout-card-blue {
  background: hsl(214 90% 94%);
  border-color: hsl(214 55% 78%);
}

.gh-content .kg-callout-card-green {
  background: hsl(152 45% 92%);
  border-color: hsl(152 40% 72%);
}

.gh-content .kg-callout-card-yellow {
  background: hsl(48 90% 92%);
  border-color: hsl(45 60% 70%);
}

.gh-content .kg-callout-card-red {
  background: color-mix(in srgb, var(--ds-color-danger-muted) 90%, var(--ds-surface-2));
  border-color: var(--ds-color-danger-border);
}

.gh-content .kg-callout-card-pink {
  background: hsl(330 80% 95%);
  border-color: hsl(330 45% 80%);
}

.gh-content .kg-callout-card-purple {
  background: hsl(270 60% 94%);
  border-color: hsl(270 40% 78%);
}

html[data-color-scheme="dark"] .gh-content .kg-callout-card-blue {
  background: hsl(214 35% 18%);
  border-color: hsl(214 35% 32%);
}

html[data-color-scheme="dark"] .gh-content .kg-callout-card-green {
  background: hsl(152 30% 16%);
  border-color: hsl(152 28% 32%);
}

html[data-color-scheme="dark"] .gh-content .kg-callout-card-yellow {
  background: hsl(45 40% 16%);
  border-color: hsl(45 35% 32%);
}

html[data-color-scheme="dark"] .gh-content .kg-callout-card-pink {
  background: hsl(330 35% 18%);
  border-color: hsl(330 30% 34%);
}

html[data-color-scheme="dark"] .gh-content .kg-callout-card-purple {
  background: hsl(270 35% 18%);
  border-color: hsl(270 30% 34%);
}

@media (prefers-color-scheme: dark) {
  html[data-color-scheme="system"] .gh-content .kg-callout-card-blue {
    background: hsl(214 35% 18%);
    border-color: hsl(214 35% 32%);
  }

  html[data-color-scheme="system"] .gh-content .kg-callout-card-green {
    background: hsl(152 30% 16%);
    border-color: hsl(152 28% 32%);
  }

  html[data-color-scheme="system"] .gh-content .kg-callout-card-yellow {
    background: hsl(45 40% 16%);
    border-color: hsl(45 35% 32%);
  }

  html[data-color-scheme="system"] .gh-content .kg-callout-card-pink {
    background: hsl(330 35% 18%);
    border-color: hsl(330 30% 34%);
  }

  html[data-color-scheme="system"] .gh-content .kg-callout-card-purple {
    background: hsl(270 35% 18%);
    border-color: hsl(270 30% 34%);
  }
}

.gh-content .kg-callout-emoji {
  font-size: 1.5rem;
  line-height: 1;
}

.gh-content .kg-video-container {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  margin: var(--ds-space-8) 0;
}

.gh-content .kg-video-container iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: var(--ds-radius-md);
}

.gh-content .kg-audio-card,
.gh-content .kg-file-card {
  border: 1px solid var(--ds-color-border);
  border-radius: var(--ds-radius-md);
  padding: var(--ds-space-4);
  background: var(--ds-surface-1);
  margin: var(--ds-space-8) 0;
}

.gh-content .kg-nft-card {
  border: 1px solid var(--ds-color-border);
  border-radius: var(--ds-radius-md);
  overflow: hidden;
  margin: var(--ds-space-8) 0;
}

.gh-content .kg-product-card {
  border: 1px solid var(--ds-color-border);
  border-radius: var(--ds-radius-md);
  padding: var(--ds-space-4);
  background: var(--ds-surface-1);
  margin: var(--ds-space-8) 0;
}

.gh-content .kg-header-card {
  padding: var(--ds-space-8);
  border-radius: var(--ds-radius-lg);
  background: var(--ds-surface-2);
  margin: var(--ds-space-10) 0;
}

.gh-content .kg-header-card h2 {
  margin-top: 0;
}

.gh-content pre.kg-code-card {
  margin: var(--ds-space-8) 0;
}

.gh-content .kg-blockquote-alt {
  font-size: 1.25rem;
  font-style: italic;
  color: var(--ds-color-muted);
  border-inline-start: 3px solid var(--ds-color-accent);
  padding-inline-start: var(--ds-space-4);
}

.gh-content .kg-signup-card {
  border: 1px solid var(--ds-color-border);
  border-radius: var(--ds-radius-lg);
  padding: var(--ds-space-8);
  background: linear-gradient(
    135deg,
    var(--ds-color-accent-muted),
    var(--ds-surface-1)
  );
  margin: var(--ds-space-10) 0;
}