:root{
--edge:#62707b}

main.single{display:block;padding:40px 0 96px}
main.single .doc-head,main.single .doc-body,main.single>.updated{max-width:var(--measure)}
main.single .doc-body.full{max-width:none}
main.single .doc-body.full .prose,main.single .doc-body.full .updated{max-width:var(--measure)}

.lead,.prose p,.steps>li,.note p{overflow-wrap:anywhere}

.lead{font-size:1.125rem;line-height:1.6;color:var(--ink);margin-bottom:26px}
.lead strong{font-weight:700}

.gist p{color:var(--ink);font-size:.9375rem;line-height:1.6}
.gist p+p{margin-top:12px}
@media(min-width:561px){.gist td:first-child{width:38%}}

.cards{list-style:none;display:grid;
grid-template-columns:repeat(auto-fit,minmax(min(304px,100%),1fr));
gap:16px;padding:0;margin:0 0 56px}
.cards li{display:flex}
.cards a{flex:1;display:block;text-decoration:none;background:var(--plate);
border:1px solid var(--line);padding:20px 20px 22px;transition:.2s;
clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%)}
.cards a:hover{border-color:var(--edge);transform:translate(-2px,-2px)}
.cards h2{font:800 1.25rem var(--cond);font-stretch:condensed;text-transform:uppercase;
letter-spacing:.02em;color:var(--ink);line-height:1.1;margin-bottom:8px}
.cards a:hover h2{color:var(--arc)}
.cards p{color:var(--dim);font-size:.90625rem;line-height:1.55}
@media(prefers-reduced-motion:reduce){.cards a:hover{transform:none}}

.steps{list-style:none;counter-reset:step;padding:0;margin:0 0 26px}
.steps>li{counter-increment:step;position:relative;padding:0 0 20px 48px;line-height:1.7}
.steps>li:last-child{padding-bottom:0}
.steps>li:before{content:counter(step);position:absolute;left:0;top:1px;
width:30px;height:30px;display:flex;align-items:center;justify-content:center;
border:1px solid var(--arc);color:var(--arc);font:700 .875rem/1 var(--mono)}
.steps strong{color:var(--ink);font-weight:700}

.note{border:1px solid var(--edge);border-left:4px solid var(--arc);background:var(--plate);
padding:20px 26px;margin:0 0 26px;font-size:.9375rem;line-height:1.65}
.note b{display:block;color:var(--ink);font:700 .6875rem var(--read);letter-spacing:.24em;
text-transform:uppercase;margin-bottom:8px}
.note p{color:var(--dim);margin:0}
.note p+p{margin-top:12px}
.note p strong{color:var(--ink);font-weight:600}
.note.quiet{border-style:dashed;border-left-width:1px;border-left-color:var(--edge)}

.msg{display:block;border-left:2px solid var(--edge);background:var(--plate);
padding:12px 16px;margin:0 0 8px;color:var(--ink);font-size:.875rem;line-height:1.6}
.prose td .msg{margin:0}
.prose p.convention{font-size:.875rem;color:var(--dim);line-height:1.6;margin:0 0 20px}
.prose p.convention strong,.prose p.convention em{color:var(--ink)}

@media print{.cards a{background:#fff;border:1px solid #000;clip-path:none}
.note,.msg{background:#fff;border-color:#000}
.steps>li:before{border-color:#000;color:#000}}