.admin-post-content {
  display: grid;
  gap: 1.35rem;
  width: 100%;
  color: inherit;
}

.admin-post-content .admin-content-heading {
  margin: 1.5rem 0 .1rem;
  color: var(--text, #f4f7fb);
  line-height: 1.2;
  letter-spacing: -.025em;
}

.admin-post-content h2.admin-content-heading { font-size: clamp(1.55rem, 4vw, 2.25rem); }
.admin-post-content h3.admin-content-heading { font-size: clamp(1.3rem, 3vw, 1.75rem); }
.admin-post-content h4.admin-content-heading { font-size: clamp(1.1rem, 2.5vw, 1.35rem); }

.admin-content-section {
  position: relative;
  display: grid;
  gap: .45rem;
  margin: 2.5rem 0 .15rem;
  border-top: 1px solid rgb(140 255 193 / 18%);
  padding: 2rem 0 0;
  scroll-margin-top: 7rem;
}
.admin-content-section::before {
  position: absolute;
  top: -.28rem;
  left: 0;
  width: .52rem;
  height: .52rem;
  border: 2px solid #09110d;
  border-radius: 50%;
  background: #8cffc1;
  box-shadow: 0 0 0 4px rgb(140 255 193 / 10%);
  content: "";
}

/* The final challenge result should read as a compact conclusion, not as a
   second hero followed by another Flag card. */
.admin-content-section.is-flag-section {
  display: flex;
  align-items: center;
  gap: .45rem .75rem;
  margin: 2.5rem 0 .15rem;
  border: 0;
  border-bottom: 1px solid rgb(140 255 193 / 22%);
  border-radius: 0;
  background: transparent;
  padding: 0 0 .72rem;
}
.admin-content-section.is-flag-section::before { display: none; }
.admin-content-section.is-flag-section .admin-section-label {
  flex: 0 0 auto;
  border: 1px solid rgb(140 255 193 / 28%);
  border-radius: 999px;
  background: rgb(140 255 193 / 7%);
  padding: .27rem .52rem;
}
.admin-content-section.is-flag-section h2 {
  display: none;
}
.admin-content-section.is-flag-section p {
  flex-basis: 100%;
  margin: .1rem 0 0;
  font-size: .78rem;
}
.admin-section-label {
  color: #8cffc1;
  font: 750 .68rem/1.2 "JetBrains Mono", ui-monospace, monospace;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.admin-content-section h2 { margin: 0; color: var(--text, #f4f7fb); font-size: clamp(1.55rem, 4vw, 2.25rem); line-height: 1.15; letter-spacing: -.025em; }
.admin-content-section p { max-width: 48rem; margin: 0; color: #93a0b2; font-size: .9rem; line-height: 1.65; }

.admin-content-paragraph { display: grid; gap: .9rem; }
.admin-content-paragraph p { margin: 0; line-height: 1.85; }

.admin-content-quote {
  margin: .5rem 0;
  border-left: 3px solid #8cffc1;
  border-radius: 0 10px 10px 0;
  background: rgb(140 255 193 / 5%);
  padding: 1.2rem 1.35rem;
}

.admin-content-quote p { margin: 0; font-size: 1.04em; font-style: italic; line-height: 1.75; }
.admin-content-quote cite { display: block; margin-top: .75rem; color: #93a0b2; font-size: .82rem; font-style: normal; }

.admin-content-code { overflow: hidden; margin: .5rem 0; border: 1px solid rgb(255 255 255 / 10%); border-radius: 12px; background: #090e15; }
.admin-content-code figcaption {
  display: flex;
  min-height: 42px;
  align-items: center;
  gap: .7rem;
  border-bottom: 1px solid rgb(255 255 255 / 8%);
  background: #0d141e;
  padding: .55rem .75rem .55rem .9rem;
  color: #93a0b2;
  font-family: ui-monospace, monospace;
  font-size: .76rem;
}
.admin-content-code pre { overflow: auto; margin: 0; padding: 1.2rem; }
.admin-content-code code { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: .84rem; line-height: 1.7; }

.content-kind, .flag-kind { border: 1px solid rgb(140 255 193 / 30%); border-radius: 999px; background: rgb(140 255 193 / 7%); padding: .2rem .45rem; color: #8cffc1; font-size: .62rem; font-weight: 800; letter-spacing: .08em; }
.admin-content-caption { overflow: hidden; min-width: 0; text-overflow: ellipsis; white-space: nowrap; }
.admin-content-language { margin-left: auto; color: #647186; font-size: .62rem; text-transform: uppercase; }
.admin-copy-button {
  flex: 0 0 auto;
  min-height: 28px;
  border: 1px solid rgb(140 255 193 / 24%);
  border-radius: 7px;
  background: rgb(140 255 193 / 6%);
  padding: .3rem .58rem;
  color: #9cefc2;
  cursor: pointer;
  font: 750 .66rem/1 "JetBrains Mono", ui-monospace, monospace;
  transition: border-color .16s ease, background .16s ease, color .16s ease;
}
.admin-copy-button:hover { border-color: rgb(140 255 193 / 50%); background: rgb(140 255 193 / 11%); color: #c2ffdd; }
.admin-copy-button:disabled { cursor: wait; opacity: .72; }
.admin-copy-button[data-copy-state="success"] { border-color: rgb(103 231 164 / 55%); background: rgb(103 231 164 / 14%); color: #8cffc1; }
.admin-copy-button[data-copy-state="error"] { border-color: rgb(255 124 134 / 50%); background: rgb(255 124 134 / 10%); color: #ff9ca4; }

body .solve-body pre.has-copy-button { position: relative; }
body .solve-body pre > .legacy-code-copy {
  position: absolute;
  top: .68rem;
  right: .75rem;
  z-index: 4;
  min-height: 29px;
  border-color: rgb(148 163 184 / 22%);
  background: rgb(13 20 30 / 92%);
  color: #aab6c7;
  backdrop-filter: blur(10px);
}
body .solve-body pre > .legacy-code-copy:hover { border-color: rgb(140 255 193 / 48%); color: #baffd8; }
body .solve-body pre.code-block-initial.has-copy-button > code { padding-right: 6.25rem; }

.admin-content-image { margin: .5rem 0; }
.admin-content-image img { display: block; width: 100%; height: auto; border: 1px solid rgb(255 255 255 / 10%); border-radius: 12px; box-shadow: 0 18px 55px rgb(0 0 0 / 24%); }
.admin-content-image figcaption { margin-top: .65rem; color: #93a0b2; font-size: .78rem; line-height: 1.5; text-align: center; }

.admin-content-callout { border: 1px solid rgb(119 169 255 / 22%); border-radius: 12px; background: rgb(119 169 255 / 6%); padding: 1rem 1.15rem; }
.admin-content-callout strong { display: block; margin-bottom: .4rem; color: #9fc0ff; }
.admin-content-callout p { margin: 0; line-height: 1.7; }
.admin-content-callout.tone-success { border-color: rgb(103 231 164 / 23%); background: rgb(103 231 164 / 6%); }
.admin-content-callout.tone-success strong { color: #67e7a4; }
.admin-content-callout.tone-warning { border-color: rgb(255 199 106 / 25%); background: rgb(255 199 106 / 6%); }
.admin-content-callout.tone-warning strong { color: #ffc76a; }
.admin-content-callout.tone-danger { border-color: rgb(255 124 134 / 25%); background: rgb(255 124 134 / 6%); }
.admin-content-callout.tone-danger strong { color: #ff7c86; }

.admin-content-list { display: grid; gap: .65rem; margin: .2rem 0; padding-left: 1.4rem; }
.admin-content-list li { padding-left: .25rem; line-height: 1.65; }
.admin-content-list li::marker { color: #8cffc1; }

.admin-content-button { display: inline-flex; min-height: 42px; align-items: center; justify-content: center; border: 1px solid #8cffc1; border-radius: 9px; padding: .7rem 1rem; font-weight: 750; text-decoration: none; transition: transform .18s ease, background .18s ease; }
.admin-content-button:hover { transform: translateY(-1px); }
.admin-content-button.button-primary { background: #8cffc1; color: #06140d; }
.admin-content-button.button-secondary { background: transparent; color: #8cffc1; }

.admin-content-divider { width: 100%; height: 1px; margin: 1rem 0; border: 0; background: linear-gradient(90deg, transparent, rgb(140 255 193 / 45%), transparent); }

.admin-content-http,
.admin-content-terminal {
  overflow: hidden;
  margin: .5rem 0;
  border: 1px solid rgb(255 255 255 / 11%);
  border-radius: 13px;
  background: #080d14;
  box-shadow: 0 18px 55px rgb(0 0 0 / 18%);
}

.admin-http-exchange {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  overflow: hidden;
  margin: .5rem 0;
  border: 1px solid rgb(255 255 255 / 12%);
  border-radius: 14px;
  background: #080d14;
  box-shadow: 0 20px 60px rgb(0 0 0 / 22%);
}
.admin-http-exchange > .admin-content-http {
  min-width: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.admin-http-exchange > .admin-content-http-request {
  border-right: 1px solid rgb(255 255 255 / 10%);
}
.admin-http-exchange > .admin-content-http-request figcaption {
  background: rgb(140 255 193 / 4%);
}
.admin-http-exchange > .admin-content-http-response figcaption {
  background: rgb(119 169 255 / 5%);
}
.admin-http-exchange > .admin-content-http pre {
  min-height: 100%;
}

.admin-content-http figcaption,
.admin-content-terminal figcaption {
  display: flex;
  min-height: 42px;
  align-items: center;
  gap: .75rem;
  border-bottom: 1px solid rgb(255 255 255 / 8%);
  background: #0d141e;
  padding: .65rem .9rem;
  color: #a5b1c2;
  font: 700 .72rem "JetBrains Mono", ui-monospace, monospace;
}

.http-kind { border: 1px solid rgb(140 255 193 / 30%); border-radius: 999px; background: rgb(140 255 193 / 7%); padding: .2rem .45rem; color: #8cffc1; font-size: .62rem; letter-spacing: .08em; }
.admin-content-http-response .http-kind { border-color: rgb(119 169 255 / 32%); background: rgb(119 169 255 / 7%); color: #8fb7ff; }
.http-language, .terminal-shell { margin-left: auto; color: #647186; font-size: .62rem; text-transform: uppercase; }
.admin-content-http pre, .admin-content-terminal pre { overflow: auto; margin: 0; padding: 1.15rem; color: #cbd5e1; }
.admin-content-http code, .admin-content-terminal code { font: .79rem/1.72 "JetBrains Mono", ui-monospace, monospace; }

/* ChallengeStyles also targets every pre/code. Keep managed technical blocks identical to live preview. */
.solve-body .admin-content-http > pre,
.solve-body .admin-content-terminal > pre {
  overflow: auto;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 1.15rem;
  box-shadow: none;
}
.solve-body .admin-content-http > pre > code,
.solve-body .admin-content-terminal > pre > code {
  display: block;
  overflow: visible;
  min-width: 0;
  margin: 0;
  border: 0;
  background: transparent;
  padding: 0;
  color: #cbd5e1;
  font: .79rem/1.72 "JetBrains Mono", ui-monospace, monospace;
  white-space: pre;
}

/* Defensive parity: neutralize the legacy editor wrapper if an old cached script created it. */
.admin-content-http pre.code-editor,
.admin-content-terminal pre.code-editor {
  display: block;
  overflow: auto;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 1.15rem;
  box-shadow: none;
}
.admin-content-http pre.code-editor::before,
.admin-content-http pre.code-editor::after,
.admin-content-terminal pre.code-editor::before,
.admin-content-terminal pre.code-editor::after,
.admin-content-http pre.code-editor > .code-editor-gutter,
.admin-content-terminal pre.code-editor > .code-editor-gutter { display: none; }
.admin-content-http pre.code-editor > .code-editor-code,
.admin-content-terminal pre.code-editor > .code-editor-code {
  overflow: visible;
  padding: 0;
}
.admin-content-http pre.code-editor > .code-editor-code code,
.admin-content-terminal pre.code-editor > .code-editor-code code {
  min-width: 0;
  font: .79rem/1.72 "JetBrains Mono", ui-monospace, monospace;
  white-space: pre;
}

/* HTTP traffic should read as a message, not as a horizontally scrolling code
   editor. Wrapping keeps long cookies, form bodies and headers inside the card,
   while pan-y ensures a mobile swipe continues scrolling the page. */
.admin-content-http > pre,
.solve-body .admin-content-http > pre,
.admin-content-http pre.code-editor {
  overflow-x: hidden;
  overscroll-behavior-inline: contain;
  scrollbar-width: none;
  touch-action: pan-y pinch-zoom;
}
.admin-content-http > pre::-webkit-scrollbar,
.solve-body .admin-content-http > pre::-webkit-scrollbar,
.admin-content-http pre.code-editor::-webkit-scrollbar { display: none; }
.admin-content-http > pre > code,
.solve-body .admin-content-http > pre > code,
.admin-content-http pre.code-editor > .code-editor-code code {
  overflow-wrap: anywhere;
  white-space: pre-wrap;
  word-break: break-word;
}
.http-method { color: #8cffc1; font-weight: 800; }
.http-method.method-post, .http-method.method-put, .http-method.method-patch { color: #ffc76a; }
.http-method.method-delete { color: #ff8992; }
.http-method.method-options, .http-method.method-head { color: #c7a5ff; }
.http-target { color: #e6edf7; }
.http-protocol { color: #7f8da2; }
.http-status { font-weight: 800; }
.http-status.status-2xx { color: #67e7a4; }
.http-status.status-3xx { color: #77a9ff; }
.http-status.status-4xx, .http-status.status-5xx { color: #ff7c86; }
.http-header-name, .syntax-key { color: #77a9ff; }
.http-header-separator, .syntax-punctuation { color: #64748b; }
.http-header-value, .syntax-string { color: #d6b98c; }
.syntax-number { color: #c7a5ff; }
.syntax-literal { color: #ff8fa3; }
.syntax-tag { color: #8cffc1; }

.terminal-dots { display: inline-flex; gap: 5px; }
.terminal-dots i { width: 7px; height: 7px; border-radius: 50%; background: #ff6b75; }
.terminal-dots i:nth-child(2) { background: #ffc76a; }
.terminal-dots i:nth-child(3) { background: #67e7a4; }
.terminal-prompt { color: #67e7a4; user-select: none; }
.terminal-command { color: #eef5ff; }
.terminal-output { color: #9aa8ba; }

.admin-content-flag {
  position: relative;
  overflow: hidden;
  margin: .2rem 0 .5rem;
  border: 1px solid rgb(140 255 193 / 26%);
  border-left: 3px solid #67e7a4;
  border-radius: 12px;
  background: #080d14;
  box-shadow: 0 16px 42px rgb(0 0 0 / 20%);
}
.admin-content-flag figcaption {
  display: flex;
  min-height: 42px;
  align-items: center;
  gap: .75rem;
  border-bottom: 1px solid rgb(140 255 193 / 14%);
  background: #09130f;
  padding: .5rem .72rem .5rem .85rem;
  color: #a5b1c2;
  font: 700 .72rem "JetBrains Mono", ui-monospace, monospace;
}
.admin-content-flag .admin-copy-button { margin-left: auto; }
.admin-flag-value {
  display: flex;
  min-width: 0;
  min-height: 4.4rem;
  align-items: center;
  overflow: hidden;
  background: #080d14;
  padding: 1.05rem 1.2rem;
}
.admin-flag-value code {
  display: block;
  min-width: 0;
  width: 100%;
  color: #a8ffce;
  font: 760 clamp(.78rem, 1.15vw, .94rem)/1.65 "JetBrains Mono", ui-monospace, monospace;
  letter-spacing: -.015em;
  overflow-wrap: anywhere;
  text-shadow: 0 0 18px rgb(140 255 193 / 16%);
  user-select: all;
  white-space: pre-wrap;
  word-break: break-word;
}

.admin-content-table { margin: .5rem 0; }
.admin-content-table > figcaption { margin-bottom: .65rem; color: #93a0b2; font-size: .76rem; }
.admin-table-scroll { overflow-x: auto; border: 1px solid rgb(255 255 255 / 10%); border-radius: 12px; }
.admin-content-table table { width: 100%; border-collapse: collapse; font-size: .84rem; }
.admin-content-table th, .admin-content-table td { border-bottom: 1px solid rgb(255 255 255 / 8%); padding: .78rem .9rem; line-height: 1.5; text-align: left; vertical-align: top; }
.admin-content-table th { background: rgb(140 255 193 / 6%); color: #8cffc1; font: 750 .72rem "JetBrains Mono", ui-monospace, monospace; letter-spacing: .03em; text-transform: uppercase; }
.admin-content-table tbody tr:last-child td { border-bottom: 0; }
.admin-content-table tbody tr:hover { background: rgb(255 255 255 / 2.5%); }

@media (max-width: 640px) {
  .admin-post-content { gap: 1rem; }
  .admin-content-code pre { padding: .9rem; }
  .admin-content-quote { padding: 1rem; }
  .admin-content-http pre, .admin-content-terminal pre { padding: .9rem; }
  .admin-content-http figcaption, .admin-content-terminal figcaption { gap: .5rem; }
  .admin-content-http figcaption > span:nth-child(2),
  .admin-content-terminal figcaption > span:nth-child(2) {
    overflow: hidden;
    min-width: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .http-language, .terminal-shell { flex: 0 0 auto; }
  .admin-content-language { display: none; }
  .admin-content-code figcaption, .admin-content-flag figcaption { gap: .5rem; }
  .admin-content-flag figcaption { padding-left: .7rem; }
  .admin-content-section.is-flag-section { margin-top: 2rem; padding-bottom: .6rem; }
  .admin-flag-value { min-height: 3.5rem; padding: .85rem; }
  .admin-copy-button { min-height: 27px; padding-inline: .5rem; }
  body .solve-body pre > .legacy-code-copy { top: .58rem; right: .58rem; }
  .admin-content-http > pre,
  .solve-body .admin-content-http > pre { overflow: visible; }
}

@media (max-width: 900px) {
  .admin-http-exchange { grid-template-columns: minmax(0, 1fr); }
  .admin-http-exchange > .admin-content-http-request {
    border-right: 0;
    border-bottom: 1px solid rgb(255 255 255 / 10%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .admin-content-button, .admin-copy-button { transition: none; }
}