/* Steadystate-specific composition. Foundation and skin live in /ds/. */
html { scroll-behavior: smooth; }
.ds-page { margin-inline: auto; }
.ds-header { position: static; }
.ds-hero { min-height: 33rem; align-content: center; }
.ds-hero__actions .ds-button { text-decoration: none; }
.ds-section__title { max-width: 28ch; }
.pattern-list { display: grid; gap: clamp(24px,4vw,48px); }
.pattern { border-top: 1px solid var(--ink); padding-top: 24px; }
.pattern h3 { font-size: var(--step-1); margin-bottom: 12px; }
.pattern p { color: var(--muted); max-width: var(--measure-narrow); }
.fit-grid { display: grid; gap: clamp(24px,4vw,48px); }
.fit-grid > div { border-top: 1px solid var(--ink); padding-top: 24px; }
.fit-grid h3 { font-size: var(--step-1); margin-bottom: 12px; }
.fit-grid li + li { margin-top: 12px; }
.placeholder-note { font-family: var(--font-mono); font-size: var(--step--1); color: var(--muted); border-left: 3px solid var(--accent); padding-left: 16px; }
.section-link { margin-top: 24px; }
/* The moment: an excerpt of the weekly report, set as a page. Binary status is its mark. */
.report-moment { margin: var(--space-7) 0 0; max-width: 46rem; border-top: 2px solid var(--ink); border-bottom: 1px solid var(--ink); padding-block: var(--space-5); font-variant-numeric: tabular-nums; }
.report-moment__head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-2) var(--space-5); align-items: baseline; padding-bottom: var(--space-4); border-bottom: 1px solid var(--line); }
.report-moment__title { font-family: var(--font-display); font-size: var(--step-1); font-weight: 600; margin: 0; }
.report-moment__meta, .report-moment__label { font-family: var(--font-mono); font-size: var(--step--1); color: var(--muted); margin: 0; }
.report-moment__rows { list-style: none; margin: 0; padding: 0; }
.report-moment__row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-1) var(--space-5); padding-block: var(--space-4); border-bottom: 1px solid var(--line); }
.report-moment__item { font-weight: 600; }
.report-moment__status { font-family: var(--font-mono); font-size: var(--step-0); font-weight: 600; display: inline-flex; align-items: center; gap: var(--space-2); justify-self: end; align-self: start; line-height: 1.6; }
.report-moment__status::before { content: ""; width: 12px; height: 12px; background: currentColor; box-sizing: border-box; }
.report-moment__status--green { color: var(--accent); }
/* Red is a hollow square, so the mark itself reads without the word and under color-vision deficiency. */
.report-moment__status--red { color: var(--ink); }
.report-moment__status--red::before { background: transparent; border: 2px solid currentColor; }
.report-moment__note { grid-column: 1 / -1; color: var(--muted); max-width: 60ch; }
.report-moment__decision { margin: var(--space-4) 0 0; display: grid; gap: var(--space-1); }
.report-moment__caption { margin-top: var(--space-5); font-size: var(--step--1); color: var(--muted); }
@media (min-width: 760px) { .report-moment__row { grid-template-columns: minmax(0, 16rem) 6rem minmax(0, 1fr); } .report-moment__status { justify-self: start; } .report-moment__note { grid-column: auto; } }
.contact-form { max-width: 36rem; }
.contact-form .ds-field { margin-bottom: 24px; }
.contact-form .ds-input { width: 100%; }
.form-note { font-size: var(--step--1); color: var(--muted); }
.form-error { border-left: 3px solid var(--accent); padding-left: 16px; color: var(--ink); }
.honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ds-footer { border-top: 1px solid var(--line); padding-block: 64px; }
.ds-footer__brand { font-weight: 600; }
@media (min-width: 760px) { .pattern-list { grid-template-columns: repeat(3,minmax(0,1fr)); } .fit-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 639px) { .ds-nav ul { gap: 0 12px; } }

/* Draft placeholders stay in the markup for the build check but never render. */
[hidden] { display: none !important; }