/* Shared by docs pages so returning to All guides also works without a reload. */
header[data-screen-label="Nav"] nav[aria-label="Main navigation"] { flex-wrap: wrap; }
header[data-screen-label="Nav"] nav[aria-label="Main navigation"] a { white-space: nowrap; }
.toc .experimental-badge {
  display: inline-block; margin-left: 6px; padding: 1px 4px;
  border: 1px solid #365873; border-radius: 2px; background: #142431; color: #9acbf0;
  font-family: 'IBM Plex Mono', monospace; font-size: 9px; font-weight: 400;
  line-height: 1.4; letter-spacing: .02em; vertical-align: middle;
}
.body .guide-heading { margin: 36px 0 14px; font-size: 25px; }
.guide-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.guide-card {
  display: flex; flex-direction: column; min-width: 0; padding: 22px;
  background: var(--color-surface); border: 1px solid var(--color-neutral-800);
  border-radius: 2px; text-decoration: none; color: var(--color-neutral-100);
}
.guide-card:hover { border-color: var(--color-neutral-500); color: var(--color-neutral-100); }
.guide-card:focus-visible { outline: 2px solid var(--color-neutral-200); outline-offset: 3px; }
.guide-card .guide-kind {
  font-family: 'IBM Plex Mono', monospace; font-size: 10px; line-height: 1.5;
  letter-spacing: .06em; text-transform: uppercase; color: var(--color-neutral-400);
}
.guide-card h3 { margin: 10px 0 8px; font-family: var(--font-heading); font-size: 27px; font-weight: 400; line-height: 1.15; }
.guide-card p { margin: 0 0 20px; font-size: 14px; line-height: 1.6; }
.guide-card .guide-open { display: flex; justify-content: space-between; gap: 12px; margin-top: auto; font-size: 12px; color: var(--color-neutral-200); }
/* Long DWARF paths and hashes must stay within the reference-table scroller. */
.trace-domain-table td code { white-space: normal; overflow-wrap: anywhere; }
@media (max-width: 720px) {
  /* Long guide titles must not collide with the edition label. */
  .doc-topline { flex-direction: column; align-items: flex-start; gap: 10px; }
  .doc-topline > span { min-width: 0; max-width: 100%; }
  .doc-topline > span:first-child > a { flex: 0 0 80px; }
  .doc-topline img { max-width: 100%; height: auto !important; }
  .doc-topline .crumbs { min-width: 0; overflow-wrap: anywhere; }
  .guide-grid { grid-template-columns: minmax(0, 1fr); }
  .guide-card { padding: 20px; }
  /* Keep register names and explanations readable inside the existing scroller. */
  .trace-domain-table { min-width: 560px; }
}