/* Security note: the kit article template, plus the reader action in the first screen and one scrolling command block. */
/* a two-sentence headline: a wider measure and a capped size keep the lede and the action in the first screen at desktop width */
article.note-page h1 { font-size: clamp(2.5rem, 4.4vw, 4rem); max-width: 22ch; }
article.note-page .note-dateline { color: var(--wp-muted); font: 400 var(--wp-text-meta)/1.4 var(--wp-font-body); margin: calc(-1 * var(--wp-2)) 0 var(--wp-8); }
/* the one action a reader must take, at lede size beside a Rust edge; not the kit Limit label, which sets its bold lead in small mono caps */
article.note-page .note-action { border-left: 4px solid var(--wp-rust); margin: var(--wp-8) 0 0; max-width: 36em; padding: var(--wp-1) 0 var(--wp-1) var(--wp-4); }
article.note-page .note-action p { margin: 0; }
article.note-page .note-action strong { font: 600 var(--wp-text-lede)/1.35 var(--wp-font-body); }
/* at desktop width the action takes the empty column beside the headline; the reading order is unchanged */
@media (min-width: 64rem) {
  article.note-page .results-intro { column-gap: var(--wp-16); display: grid; grid-template-columns: minmax(0, 44rem) minmax(15rem, 1fr); max-width: none; }
  article.note-page .results-intro > * { grid-column: 1; }
  article.note-page .results-intro > .note-action { align-self: start; grid-column: 2; grid-row: 2 / span 4; margin-top: var(--wp-2); }
}
article.note-page .note-leads li + li, article.note-page .note-steps li + li { margin-top: var(--wp-3); }
article.note-page .note-nobreak { white-space: nowrap; }
/* commands stay whole: a long line scrolls inside the frame, so a wrap is never read as a second command */
article.note-page .check-block { font-size: .875rem; white-space: pre; overflow-x: auto; overscroll-behavior-x: contain; }
article.note-page .check-block:focus-visible { outline: 3px solid var(--cn-color-amber); outline-offset: 3px; }
article.note-page .method-note + .method-note { border-top: 0; margin-top: var(--wp-3); padding-top: 0; }
article.note-page .note-credit { color: var(--wp-muted); font-size: var(--wp-text-meta); margin-top: var(--wp-8); }