/* System-state components (S075): the draft-preview banner
 * (`web/templates/states/preview_banner.html`, included by `post.html`) and the "scheduled"
 * eyebrow label (`web/templates/states/scheduled.html`). `errors/500.html` (S041) styles
 * through `app.css`'s base typography alone and stays unstyled here; `errors/429.html`
 * loads this file too (S077f review round 2, minor) for `.rate-limit-example` below, and
 * `pages/docs.html` (S077h review round 1, minor) reuses that same class for its two
 * `<pre><code>` blocks: no stylesheet reachable from `docs.html` declared a `pre` rule
 * either, so both blocks rendered with UA defaults and gained a horizontal scrollbar on a
 * 360px viewport — the identical defect this class was already built to fix. */

.preview-banner {
  display: flex;
  gap: var(--space-3);
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: var(--space-8);
  padding: var(--space-3) var(--space-5);
  border: 1px solid var(--accent);
  border-radius: var(--radius-m);
  font-size: var(--size-ui-dense);
}

.preview-banner-label {
  font-family: var(--mono);
  font-size: var(--size-mono);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: var(--accent);
}

.preview-banner-note {
  color: var(--text-2);
}

.preview-banner-edit {
  margin-left: auto;
}

.state-eyebrow {
  font-family: var(--mono);
  font-size: var(--size-mono);
  color: var(--text-2);
}

/* Bordered `<pre>` treatment for a code/response example block (S077f review round 2,
 * minor): the mockup draws the 429 header excerpt as a bordered card
 * (`mockups/Auth States.dc.html:124-125`, `border:1px solid var(--line);border-radius:4px;
 * padding:12px 14px;font-size:12px;line-height:1.6;color:var(--text-2);overflow:auto`);
 * no stylesheet reachable from `errors/429.html` declared a `pre` rule, so the block
 * rendered with UA defaults — no border, no padding, `--text` at the UA mono size, and no
 * scroll containment for a long `Retry-After` line on a narrow viewport. Reused unchanged
 * by `pages/docs.html`'s two example blocks (S077h review round 1, minor): same defect,
 * same fix, no mockup of its own to match. */
.rate-limit-example {
  margin: 0;
  padding: var(--space-3) 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius-s);
  font-family: var(--mono);
  font-size: var(--size-mono);
  line-height: 1.6;
  color: var(--text-2);
  overflow: auto;
}