/* ==========================================================================
   Wildsforge update posts (/updates/): extras on top of guide.css.
   Needs /assets/site.css and /assets/guide.css loaded first.
   ========================================================================== */

/* Version and date strip under the standfirst */
.patch-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin: 14px 0 0;
  padding: 0;
  list-style: none;
  font-size: 14px;
}
.patch-facts li { display: flex; gap: 6px; }
.patch-facts strong { color: var(--muted); font-weight: 600; }

/* "New" / "Changed" / "Fixed" pills in tables and lists */
.tag {
  display: inline-block;
  padding: 1px 8px;
  border-radius: 999px;
  background: var(--logo-bg);
  color: var(--accent);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.6;
  white-space: nowrap;
}
.tag--changed { background: var(--surface-2); color: var(--warn); }
.tag--fixed { background: var(--surface-2); color: var(--muted); }

/*
 * Image placeholders: a dashed frame saying which screenshot goes here.
 * Swap each one for a real <picture> before publishing; scripts/seo-audit.js
 * fails any page that still contains "photo--placeholder".
 */
.photo--placeholder,
.card__media--placeholder {
  display: grid;
  place-content: center;
  gap: 4px;
  padding: 16px;
  border: 2px dashed var(--border);
  background: var(--surface-2);
  box-shadow: none;
  color: var(--muted);
  font-size: 14px;
  text-align: center;
}
.photo--placeholder::after { display: none; }
.photo--placeholder strong,
.card__media--placeholder strong { color: var(--warn); font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; }
.card__media--placeholder { border-width: 0 0 2px; font-size: 13px; }

/* Patch history list on the hub */
.patch-list td:first-child { white-space: nowrap; font-weight: 600; }