/* The site's frame around a published run log (added by site/trim-report.py): masthead, type and
   colours from site.css, mapped onto the report's own variables. */
@font-face { font-family: "Bricolage"; src: url("/fonts/bricolage.woff2") format("woff2"); font-weight: 600 800; font-display: swap; }
@font-face { font-family: "Atkinson"; src: url("/fonts/atkinson.woff2") format("woff2"); font-weight: 400 700; font-display: swap; }
@font-face { font-family: "Atkinson"; src: url("/fonts/atkinson-italic.woff2") format("woff2"); font-style: italic; font-weight: 400; font-display: swap; }
:root { --bg: #f1f3f6; --fg: #18202e; --mute: #5b6473; --line: #d3d9e1; --card: #fbfcfd; --bad: #b42a1f; --ok: #2f6b4f; --warn: #8a6400; --kz-link: #1f4fa3; --kz-pencil: #b42a1f; }
@media (prefers-color-scheme: dark) {
  :root { --bg: #12161d; --fg: #e5e9ef; --mute: #9aa3b1; --line: #2e3542; --card: #1a1f28; --bad: #ff8a7a; --ok: #7cc4a0; --warn: #e0b44f; --kz-link: #8fb4ff; --kz-pencil: #ff8a7a; }
}
body { font-family: "Atkinson", system-ui, sans-serif; }
h1, h2, h3, summary { font-family: "Bricolage", "Atkinson", sans-serif; }
h1 { letter-spacing: -0.02em; }
a { color: var(--kz-link); text-underline-offset: 0.18em; }
:focus-visible { outline: 3px solid var(--kz-link); outline-offset: 2px; }
.kz-top { max-width: 980px; margin: 0 auto; padding: 20px 16px 0; display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; justify-content: space-between; }
.kz-mark { font-family: "Bricolage", sans-serif; font-weight: 800; font-size: 1.4rem; letter-spacing: -0.03em; color: var(--fg); text-decoration: none; }
.kz-mark span { color: var(--kz-pencil); }
.kz-top nav { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 0.95rem; }
.kz-top nav a { color: var(--fg); text-decoration: none; border-bottom: 3px solid transparent; }
.kz-top nav a:hover { text-decoration: underline; }
.kz-top nav a.kz-cta { font-weight: 700; border-bottom: 3px solid #f3da4b; }
main { padding-top: 20px; }
.provenance { margin: 0 0 20px; padding: 10px 14px; border: 1px solid; border-radius: 4px; font-size: .92rem; background: var(--card); border-color: var(--line) !important; border-left: 4px solid var(--fg) !important; }
/* Screenshot thumbnails (site/publish-report.sh): shown whole, never cropped by the box; desktop
   captures (img.wide) in a wider, landscape column. */
.shot img { height: auto; max-height: none; object-fit: contain; }
.shot img.wide { width: 220px; }
.moments li:has(img.wide), .steps li:has(img.wide) { grid-template-columns: 220px 1fr; }
@media (max-width: 560px) {
  .shot img.wide { width: 140px; }
  .moments li:has(img.wide), .steps li:has(img.wide) { grid-template-columns: 140px 1fr; }
}
.provenance .kz-links { display: block; margin-top: 6px; }
.moments li > div, .steps li > div { min-width: 0; }
.where code { overflow-wrap: anywhere; }
@media (min-width: 561px) { .where code { white-space: nowrap; } }
@media (max-width: 560px) { .kz-top nav { width: 100%; justify-content: space-between; gap: 4px 10px; font-size: 0.92rem; } }
