/* Unsupported Software Finder: a vendor's product discontinuance notice. White bond, neutral black ink, a masthead on a 4px
   rule, a lifecycle strip on every row. Colour carries state only: brick for past vendor support, amber for ending soon. */
:root {
  --paper: #ffffff; --ink: #1d1d1b; --grey: #5f5f5a; --rule: #d9d9d4; --rule2: #a9a9a2; --tint: #f4f4f1;
  --past: #a3321f; --past-bg: #f7e6e2; --soon: #945f00; --soon-fill: #b27a12; --soon-bg: #f8ecd2;
  --display: "Roboto Slab", Georgia, serif; --body: "Be Vietnam Pro", system-ui, -apple-system, "Segoe UI", sans-serif; --mono: "Intel One Mono", ui-monospace, Menlo, monospace;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 400 16px/1.55 var(--body); text-rendering: geometricPrecision; }
a { color: var(--ink); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { text-decoration-thickness: 2px; }
.wrap { max-width: 1180px; margin: 0 auto; padding: 0 16px; }
code, .d, .n { font-family: var(--mono); font-variant-numeric: tabular-nums; }
code { font-size: .88em; overflow-wrap: anywhere; }
.d { font-size: .92em; letter-spacing: 0; }
.sub { color: var(--grey); font-size: 13px; }
.hint { color: var(--grey); font-size: 14px; }
h1, h2, h3 { font-family: var(--display); font-weight: 700; letter-spacing: -.01em; margin: 0; }
h1 { font-size: 40px; line-height: 1.12; }
h2 { font-size: 22px; line-height: 1.25; }
h3 { font-size: 17px; line-height: 1.3; }
[hidden] { display: none !important; }

/* header: the notice masthead rule */
.band { border-top: 4px solid var(--ink); border-bottom: 3px double var(--ink); background: var(--paper); }
header.site { display: flex; align-items: center; gap: 18px; min-height: 58px; }
.brand { display: flex; align-items: baseline; gap: 10px; text-decoration: none; white-space: nowrap; }
.brand .wm { font: 700 19px/1 var(--display); letter-spacing: -.01em; }
.brand .nb { font: 400 12px/1 var(--mono); color: var(--grey); }
header.site nav { margin-left: auto; display: flex; gap: 18px; align-items: center; overflow-x: auto; scrollbar-width: none; }
header.site nav::-webkit-scrollbar { display: none; }
header.site nav a { text-decoration: none; font-size: 14.5px; white-space: nowrap; padding: 4px 0; border-bottom: 2px solid transparent; }
header.site nav a:hover, header.site nav a[aria-current="page"] { border-bottom-color: var(--ink); }
#nav-auth { display: flex; gap: 18px; }

/* hero */
.hero { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 44px; padding: 40px 0 26px; align-items: start; }
.eyebrow { font: 500 12.5px/1.4 var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--grey); margin: 0 0 14px; }
.lede { font-size: 17.5px; line-height: 1.6; margin: 18px 0 0; max-width: 62ch; }
.lede + .lede { margin-top: 12px; }
.cta { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 22px 0 0; }
.cta .hint { margin-left: 0; flex-basis: 100%; }
.reads { list-style: none; margin: 26px 0 0; padding: 0; border-top: 2px solid var(--ink); counter-reset: r; }
.reads li { padding: 11px 0 11px 34px; border-bottom: 1px solid var(--rule); position: relative; font-size: 15px; }
.reads li::before { counter-increment: r; content: counter(r, decimal-leading-zero); position: absolute; left: 0; top: 12px; font: 500 13px/1.4 var(--mono); color: var(--grey); }
.reads li b { font-weight: 600; }
figure.person { margin: 0; }
figure.person img { display: block; width: 100%; height: 300px; object-fit: cover; object-position: 70% 40%; filter: grayscale(1) contrast(1.05); border-top: 1px solid var(--ink); }
figure.person figcaption { font-size: 15px; line-height: 1.5; margin: 10px 0 0; padding-top: 10px; border-top: 1px solid var(--rule); }

/* the first-screen specimen excerpt */
.specimen { border: 1px solid var(--ink); border-top-width: 4px; margin: 0 0 20px; background: var(--paper); }
.specimen .legend { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 8px 12px; border-bottom: 1px solid var(--rule); font: 500 12px/1.4 var(--mono); text-transform: uppercase; letter-spacing: .05em; color: var(--grey); }
.xrow { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; padding: 9px 12px; border-bottom: 1px solid var(--rule); }
.xrow .xm { font-size: 14.5px; min-width: 0; }
.xrow .xm b { font-weight: 600; display: block; }
.xrow .xs { font: 500 11.5px/1.3 var(--mono); text-transform: uppercase; letter-spacing: .05em; align-self: start; padding-top: 2px; text-align: right; white-space: nowrap; }
.xrow .xl { grid-column: 1 / -1; font-size: 13px; color: var(--grey); }
.xrow .tl.xtl { grid-column: 1 / -1; margin: 6px 0 2px; }
.xrow .tl.none { display: none; }
.specimen .cap { margin: 0; padding: 12px 12px 4px; font: 600 17px/1.4 var(--body); }
.specimen .cap .n { font-weight: 500; }
.specimen .capsub { margin: 0; padding: 0 12px 12px; font-size: 13.5px; color: var(--grey); }
.st-w { font: 500 11.5px/1.3 var(--mono); text-transform: uppercase; letter-spacing: .05em; }
.st-w.past { color: var(--past); }
.st-w.soon { color: var(--soon); }

/* buttons */
.btn { display: inline-flex; align-items: center; gap: 8px; font: 600 15px/1 var(--body); padding: 12px 18px; background: var(--ink); color: var(--paper); border: 1.5px solid var(--ink); border-radius: 0; cursor: pointer; text-decoration: none; }
.btn:hover { background: #3a3a37; border-color: #3a3a37; }
.btn.ghost { background: var(--paper); color: var(--ink); }
.btn.ghost:hover { background: var(--tint); }
.btn.small { font-size: 14px; padding: 9px 13px; }
.btn[aria-busy="true"] { opacity: .7; }
.plan-tag { font: 500 11px/1 var(--mono); text-transform: uppercase; letter-spacing: .05em; padding: 3px 5px; border: 1px solid currentColor; margin-left: 2px; }
.row { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

/* explain blocks */
.explain { padding: 30px 0 8px; }
.explain h2 { margin: 0 0 12px; }
.explain .wide { max-width: 78ch; }
.form { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 2px solid var(--ink); }
.form > div { padding: 16px 20px 18px 0; border-right: 1px solid var(--rule); margin-right: 20px; }
.form > div:last-child { border-right: 0; margin-right: 0; }
.form .k { font: 500 13px/1 var(--mono); color: var(--grey); }
.form h3 { margin: 8px 0 6px; }
.form p { margin: 0; font-size: 15px; }

/* the tool */
.tool { border: 1px solid var(--ink); border-top-width: 4px; margin: 26px 0 0; background: var(--paper); }
.tool .bar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; padding: 12px 14px; border-bottom: 1px solid var(--rule); }
.tool .bar .hint { color: var(--grey); font-size: 14px; flex: 1 1 420px; }
.tool .bar .hint code { color: var(--ink); }
.tool .spacer { flex: 1; }
.pre-q { margin: 0; padding: 14px 14px 12px; border-bottom: 1px solid var(--rule); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 22px; }
.pre-q p { margin: 0; font-size: 14.5px; line-height: 1.5; }
.pre-q p b { display: block; font: 600 13px/1.3 var(--mono); text-transform: uppercase; letter-spacing: .04em; margin-bottom: 4px; }
.paste { display: block; width: 100%; min-height: 190px; border: 0; border-bottom: 1px solid var(--rule); padding: 14px; font: 400 13.5px/1.55 var(--mono); color: var(--ink); background: var(--paper); resize: vertical; }
.paste:focus { outline: 2px solid var(--ink); outline-offset: -2px; }
.ticks { border: 0; margin: 0; padding: 12px 14px 14px; display: flex; flex-wrap: wrap; gap: 10px 22px; align-items: center; font-size: 14.5px; }
.ticks legend { font: 500 12.5px/1.4 var(--mono); text-transform: uppercase; letter-spacing: .05em; color: var(--grey); padding: 0; margin-bottom: 8px; float: left; width: 100%; }
.ticks label { display: inline-flex; gap: 7px; align-items: center; }
.ticks select, .ticks input[type="number"], .ticks input[type="date"] { font: 400 14px var(--mono); padding: 5px 6px; border: 1px solid var(--rule2); border-radius: 0; background: var(--paper); color: var(--ink); max-width: 100%; }
.ticks input[type="number"] { width: 5.5em; }
.ticks .grp-t { display: flex; flex-wrap: wrap; gap: 10px 22px; width: 100%; padding-top: 10px; border-top: 1px solid var(--rule); }
#actions { margin: 16px 0 0; }
#result { margin-top: 10px; }

/* the notice */
.notice-sheet { margin: 18px 0 0; }
.mast { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; border-top: 4px solid var(--ink); border-bottom: 1px solid var(--ink); padding: 14px 0 14px; }
.m-k { display: block; font: 500 12.5px/1.4 var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--grey); margin-bottom: 6px; }
.m-t { display: block; font: 700 25px/1.25 var(--display); }
.m-r { display: grid; grid-template-columns: auto auto; gap: 3px 14px; margin: 0; font-size: 13.5px; align-content: start; }
.m-r dt { color: var(--grey); text-align: right; }
.m-r dd { margin: 0; }
.schemes-l { margin: 10px 0 0; font-size: 14.5px; }
.schemes-l .k { font: 500 12.5px/1 var(--mono); text-transform: uppercase; letter-spacing: .05em; color: var(--grey); margin-right: 6px; }
.strip { display: grid; grid-template-columns: 1.4fr repeat(3, minmax(0, 1fr)); border-top: 2px solid var(--ink); border-bottom: 1px solid var(--rule); margin: 14px 0 0; }
.strip > div { padding: 12px 14px 12px 0; border-right: 1px solid var(--rule); margin-right: 14px; }
.strip > div:last-child { border-right: 0; margin-right: 0; }
.strip b.n { display: block; font: 500 30px/1.1 var(--mono); }
.strip span { display: block; font-size: 13.5px; line-height: 1.35; margin-top: 3px; }
.strip .x-past b.n { color: var(--past); }
.strip em.split { display: block; font-style: normal; font-size: 13px; color: var(--grey); margin-top: 4px; }
.strip em.split .d { display: inline; margin: 0; font-size: 13px; }
.strip .x-soon b.n { color: var(--soon); }
.strip-note { font-size: 14px; color: var(--grey); margin: 10px 0 0; max-width: 100ch; }
.notice { border-left: 3px solid var(--ink); padding: 6px 12px; margin: 12px 0 0; font-size: 14.5px; }
.notice.gate { background: var(--paper); border: 1px solid var(--ink); border-left-width: 3px; }
.legend-l { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 14px 0 0; font-size: 13px; color: var(--grey); }
.legend-l > span { display: inline-flex; align-items: center; gap: 7px; }
i.lg { display: inline-block; width: 22px; height: 8px; }
i.lg.now, i.lg.nx { width: 0; height: 14px; border-left: 1.5px solid var(--ink); }
i.lg.nx { border-left-style: dashed; }

/* lifecycle segments, shared by the strip and the legend */
.s-act { background: var(--ink); }
.s-sec { background: var(--paper); box-shadow: inset 0 0 0 1.5px var(--ink); }
.s-ext { background: repeating-linear-gradient(135deg, var(--ink) 0 1.5px, var(--paper) 1.5px 5px); box-shadow: inset 0 0 0 1px var(--ink); }
.s-past { background: var(--past); }
.s-soon { background: var(--soon-fill); }

/* groups of rows */
.grp { margin: 30px 0 0; }
.sec-head { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; flex-wrap: wrap; border-bottom: 2px solid var(--ink); padding-bottom: 7px; }
.folio { font: 400 13px/1.3 var(--mono); color: var(--grey); }
.g-past .sec-head h2 { color: var(--past); }
.g-before .sec-head h2, .g-window .sec-head h2 { color: var(--soon); }
.rows-head, ol.rows li.rec { display: grid; grid-template-columns: 34px minmax(0, 2.2fr) 60px minmax(0, 2.1fr) 128px 132px; gap: 0 14px; align-items: start; }
.rows-head { font: 500 11.5px/1.3 var(--mono); text-transform: uppercase; letter-spacing: .05em; color: var(--grey); padding: 8px 0 6px; border-bottom: 1px solid var(--rule2); }
.rows-head .axh { position: relative; }
.axis { position: relative; height: 26px; }
.axis-ph { display: none; }
.axis span { position: absolute; top: 12px; transform: translateX(-50%); font: 400 11px/1 var(--mono); letter-spacing: 0; text-transform: none; color: var(--grey); }
.axis .ax-now, .axis .ax-nx { top: 0; font-size: 10.5px; text-transform: uppercase; letter-spacing: .04em; color: var(--ink); }
ol.rows { list-style: none; margin: 0; padding: 0; }
ol.rows li.rec { padding: 11px 0; border-bottom: 1px solid var(--rule); cursor: pointer; }
ol.rows li.rec:hover { background: #fafaf8; }
.rec .no { font: 400 13px/1.5 var(--mono); color: var(--grey); padding-top: 1px; }
.rec .pn { min-width: 0; }
.rec .pn .id { font-weight: 600; font-size: 15px; overflow-wrap: anywhere; }
.rec .pn .ver { color: var(--ink); }
.rec .pn .rl { display: block; font-size: 13px; color: var(--grey); margin-top: 2px; overflow-wrap: anywhere; }
.rec .grp-n { font-family: var(--mono); font-size: 12px; margin-left: 4px; }
.rec .grp-n::before { content: "/ "; }
.rec .ins { font-size: 14px; text-align: right; padding-top: 1px; }
.tl { position: relative; height: 12px; margin-top: 6px; border-bottom: 1px solid var(--rule); }
.tl i { position: absolute; top: 2px; height: 8px; }
.tl .now { position: absolute; top: -6px; bottom: -6px; border-left: 1.5px solid var(--ink); }
.tl .nx { position: absolute; top: -6px; bottom: -6px; border-left: 1.5px dashed var(--ink); }
.tl .open { position: absolute; right: 0; top: -2px; font: 400 10.5px/1 var(--mono); color: var(--grey); background: var(--paper); padding-left: 4px; }
.tl.none { border-bottom: 0; }
.tl .evg { font: 400 11.5px/1 var(--mono); color: var(--grey); text-transform: uppercase; letter-spacing: .04em; }
.rec .end { font-size: 14px; }
.rec .stw { display: block; white-space: nowrap; font: 500 11px/1.3 var(--mono); text-transform: uppercase; letter-spacing: .05em; margin-top: 3px; color: var(--grey); }
.st-past .stw { color: var(--past); }
.st-window .stw, .st-before .stw { color: var(--soon); }
.st-past .end .d { color: var(--past); font-weight: 500; }
.fx { display: flex; flex-wrap: nowrap; gap: 4px; }
.fm { display: inline-flex; width: 26px; height: 22px; align-items: center; justify-content: center; font: 500 12px/1 var(--mono); border: 1.5px solid var(--ink); padding: 0 4px; }
.fm.info { border-style: dashed; border-width: 1px; }
.rec .why { grid-column: 2 / -1; margin: 12px 0 4px; border-top: 1px solid var(--rule); padding-top: 8px; cursor: auto; }
.why > div { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 12px; padding: 6px 0; border-bottom: 1px dotted var(--rule); font-size: 14.5px; }
.why > div:last-child { border-bottom: 0; }
.why .k { font: 500 12px/1.5 var(--mono); text-transform: uppercase; letter-spacing: .04em; color: var(--grey); }
.why dl.ls { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 2px 14px; margin: 0; }
.why dl.ls dt { color: var(--grey); }
.why dl.ls dd { margin: 0; }
.locked { color: var(--grey); }
.refs { display: block; }
details.cl { border-top: 1px solid var(--rule); }
details.cl:first-child { border-top: 0; }
details.cl summary { cursor: pointer; list-style: none; padding: 5px 0 5px 18px; position: relative; }
details.cl summary::-webkit-details-marker { display: none; }
details.cl summary::before { content: ""; position: absolute; left: 2px; top: 12px; border: 5px solid transparent; border-left-color: var(--ink); }
details.cl[open] summary::before { border-left-color: transparent; border-top-color: var(--ink); left: 0; top: 14px; }
details.cl summary .ref { font-family: var(--mono); font-size: 13px; font-weight: 500; margin-right: 6px; }
.clb { padding: 2px 0 10px 18px; }
span.q { background: none; }
p.q { padding: 2px 0 2px 12px; border-left: 2px solid var(--rule2); margin: 8px 0; font-size: 14px; line-height: 1.55; }
.k2 { font: 500 11.5px/1.3 var(--mono); text-transform: uppercase; letter-spacing: .05em; color: var(--grey); margin: 10px 0 0; }
.src { font-size: 13px; color: var(--grey); margin: 6px 0 0; }
details.pl summary { cursor: pointer; color: var(--grey); font-size: 13.5px; }
.pasted { display: block; font: 400 12.5px/1.5 var(--mono); margin-top: 6px; overflow-wrap: anywhere; }
.gap { color: var(--grey); }

/* findings */
.finds { margin: 34px 0 0; }
.finds > details { border-bottom: 1px solid var(--rule); }
.finds > details > summary { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: 12px; align-items: baseline; padding: 12px 0; cursor: pointer; list-style: none; }
.finds > details > summary::-webkit-details-marker { display: none; }
.finds > details > summary .fm { align-self: center; }
.fname { font: 700 17px/1.35 var(--display); }
.fwho { font: 400 13px/1.3 var(--mono); color: var(--grey); white-space: nowrap; }
.fbody { padding: 0 0 16px 52px; }
.fbody > * { max-width: none; }
.fbody > p { margin: 8px 0; font-size: 15px; }
.fbody .ask { border-left: 3px solid var(--ink); padding: 4px 0 4px 12px; }
.bygrp { color: var(--grey); font-size: 14px; }
.items { list-style: none; margin: 8px 0; padding: 0; border-top: 1px solid var(--rule); }
.items li { padding: 6px 0; border-bottom: 1px dotted var(--rule); font-size: 14.5px; }
.blocks { margin: 12px 0 0; border-top: 2px solid var(--ink); padding-top: 4px; }
.named { font-size: 14px; color: var(--grey); }

/* shares */
.shares { margin: 34px 0 0; }
.share-grid { margin-top: 8px; max-width: 760px; }
.srow { display: grid; grid-template-columns: minmax(0, 1fr) repeat(4, 84px); gap: 10px; padding: 6px 0; border-bottom: 1px solid var(--rule); font-size: 14.5px; }
.srow .c { text-align: right; font-family: var(--mono); font-size: 13.5px; }
.srow.head { font: 500 11.5px/1.3 var(--mono); text-transform: uppercase; letter-spacing: .05em; color: var(--grey); border-bottom-color: var(--rule2); }
.srow.head .c { font-size: 11.5px; }
.srow.tot { border-top: 2px solid var(--ink); border-bottom: 0; font-weight: 600; }

/* generated pages */
section.pg { padding: 0 0 20px; }
.crumb { margin-bottom: 10px; }
.crumb a { text-decoration: none; color: var(--grey); }
.crumb a:hover { color: var(--ink); }
.facts { display: grid; grid-template-columns: 220px minmax(0, 1fr); border-top: 2px solid var(--ink); margin: 20px 0 0; }
.facts > * { padding: 9px 0; border-bottom: 1px solid var(--rule); margin: 0; }
.facts dt { font: 500 12.5px/1.5 var(--mono); text-transform: uppercase; letter-spacing: .04em; color: var(--grey); padding-right: 14px; }
.facts dd { font-size: 15px; }
.idx { list-style: none; margin: 10px 0 0; padding: 0; columns: 2; column-gap: 34px; }
.idx li { padding: 5px 0; border-bottom: 1px solid var(--rule); break-inside: avoid; font-size: 15px; }
.idx li .hint { display: block; font-size: 13px; }
.ctrl { border-top: 1px solid var(--rule); padding: 12px 0; }
.ctrl .ch { display: flex; gap: 10px; flex-wrap: wrap; align-items: baseline; }
.ctrl .ch code { background: none; padding: 0; font-weight: 500; }
.ctrl .ttl { font-weight: 600; }
.ctrl .ev { font-size: 14px; }
.ctrl .ev > div { margin-top: 4px; }
.tablewrap { overflow-x: auto; margin: 12px 0 0; }
table.plain { border-collapse: collapse; width: 100%; font-size: 14px; }
table.plain th, table.plain td { text-align: left; padding: 6px 10px 6px 0; border-bottom: 1px solid var(--rule); vertical-align: top; }
table.plain th { font: 500 11.5px/1.3 var(--mono); text-transform: uppercase; letter-spacing: .05em; color: var(--grey); border-bottom: 2px solid var(--ink); }
table.plain td.c { font-family: var(--mono); font-size: 13px; white-space: nowrap; }
table.plain tr.past td.st { color: var(--past); }
table.plain tr.soon td.st { color: var(--soon); }
table.plain tr.past td.se { color: var(--past); font-weight: 500; }
table.plain tr.soon td.se { color: var(--soon); font-weight: 500; }
table.plain td.st { font: 500 11.5px/1.4 var(--mono); text-transform: uppercase; letter-spacing: .04em; }
.prose { max-width: 76ch; padding-bottom: 30px; }
.prose p { margin: 0 0 14px; }
.sort-note { font-size: 13.5px; color: var(--grey); }
table.plain th button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; text-transform: inherit; letter-spacing: inherit; }

/* pricing */
.pricing { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 4px solid var(--ink); margin: 10px 0 0; }
.pricing > div { padding: 18px 20px 20px 0; border-right: 1px solid var(--rule); margin-right: 20px; display: flex; flex-direction: column; }
.pricing > div:last-child { border-right: 0; margin-right: 0; }
.pricing .price { font: 700 34px/1.1 var(--display); margin: 10px 0 2px; }
.pricing .price small { font-size: 14px; margin-right: 4px; }
.pricing .per { color: var(--grey); font-size: 14px; }
.pricing ul { padding-left: 18px; margin: 14px 0 18px; font-size: 15px; flex: 1; }
.pricing ul li { margin: 0 0 6px; }
.pricing .btn { align-self: flex-start; }
h1.ph { font-size: 34px; }

/* list page, modal */
.list { border-top: 2px solid var(--ink); }
.list .item { display: flex; justify-content: space-between; gap: 14px; flex-wrap: wrap; padding: 12px 0; border-bottom: 1px solid var(--rule); text-decoration: none; }
.list .meta { font: 400 13px/1.4 var(--mono); color: var(--grey); }
.modal { position: fixed; inset: 0; background: rgba(29, 29, 27, .45); display: none; align-items: center; justify-content: center; z-index: 50; padding: 16px; }
.modal.open { display: flex; }
.modal .box { background: var(--paper); border-top: 4px solid var(--ink); padding: 20px; width: 100%; max-width: 440px; }
.modal .legend { font: 700 18px/1.2 var(--display); margin-bottom: 8px; }
.modal input { width: 100%; font: 400 15px var(--body); padding: 10px; border: 1px solid var(--rule2); border-radius: 0; }
.ok { color: var(--ink); }
.err { color: var(--past); }
input, select, textarea, button { font: inherit; }

footer.site { display: flex; flex-wrap: wrap; gap: 8px 18px; padding-top: 22px; padding-bottom: 36px; margin-top: 40px; border-top: 4px solid var(--ink); font-size: 13.5px; color: var(--grey); }
footer.site a { color: var(--grey); }
footer.site span:first-child { font: 700 14px/1.4 var(--display); color: var(--ink); }
footer.site span.fp { flex-basis: 100%; line-height: 1.55; max-width: 92ch; }

@media (max-width: 960px) {
  .hero { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .rows-head { display: none; }
  .axis-ph { display: block; margin: 6px 0 0 40px; border-bottom: 1px solid var(--rule2); }
  .axis-ph .axis { height: 20px; }
  .axis-ph .axis span { top: 4px; }
  ol.rows li.rec { grid-template-columns: 30px minmax(0, 1fr) auto; gap: 4px 10px; }
  .rec .no { grid-row: 1; }
  .rec .pn { grid-column: 2 / 4; }
  .rec .tl { grid-column: 2 / 4; margin: 8px 0 4px; }
  .rec .ins, .rec .end, .rec .fx { grid-column: 2 / 4; text-align: left; display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; font-size: 14px; }
  .rec .ins::before, .rec .end::before, .rec .fx::before { content: attr(data-label); font: 500 11px/1.4 var(--mono); text-transform: uppercase; letter-spacing: .05em; color: var(--grey); width: 104px; flex: none; }
  .rec .end .stw { display: inline; margin: 0; }
  .rec .end > .d { margin-right: 8px; }
  .rec .why { grid-column: 1 / -1; }
  .pre-q { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) {
  h1 { font-size: 30px; }
  .hero { padding-top: 18px; }
  h2 { font-size: 19px; }
  .lede { font-size: 16px; line-height: 1.5; }
  header.site { flex-wrap: wrap; gap: 0; padding-top: 6px; min-height: 0; }
  header.site .brand { width: 100%; padding-bottom: 6px; border-bottom: 1px solid var(--rule); }
  header.site .brand .wm { font-size: 17px; }
  header.site nav { margin-left: 0; width: 100%; gap: 16px; padding: 4px 0; }
  .brand .nb { display: none; }
  .form, .pricing { grid-template-columns: minmax(0, 1fr); }
  .form > div, .pricing > div { border-right: 0; margin-right: 0; padding-right: 0; border-bottom: 1px solid var(--rule); }
  .mast { grid-template-columns: minmax(0, 1fr); }
  .m-t { font-size: 21px; }
  .m-r { grid-template-columns: max-content minmax(0, 1fr); }
  .m-r dt { text-align: left; }
  .strip { grid-template-columns: minmax(0, 1fr); }
  .strip > div { border-right: 0; margin-right: 0; border-bottom: 1px solid var(--rule); padding: 10px 0; display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 0 12px; align-items: baseline; }
  .strip > div:last-child { border-bottom: 0; }
  .strip b.n { font-size: 24px; grid-row: 1 / 3; }
  .strip span, .strip em.split { margin-top: 0; }
  .why > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .fbody { padding-left: 0; }
  .finds > details > summary { grid-template-columns: 34px minmax(0, 1fr); }
  .fwho { grid-column: 2; white-space: normal; }
  .facts { grid-template-columns: 118px minmax(0, 1fr); }
  .facts dt { font-size: 11px; padding-right: 10px; }
  .idx { columns: 1; }
  .srow { grid-template-columns: minmax(0, 1fr) repeat(4, 50px); gap: 6px; font-size: 13.5px; }
  .ticks select, .ticks input[type="date"] { max-width: 60vw; }
  table.eoltab thead { display: none; }
  table.eoltab, table.eoltab tbody, table.eoltab tr, table.eoltab td { display: block; }
  table.eoltab tr { padding: 10px 0; border-bottom: 1px solid var(--rule); }
  table.eoltab td { border: 0; padding: 1px 0; }
  table.eoltab td:first-child { font-weight: 600; font-size: 15px; }
  table.eoltab td[data-label] { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 10px; white-space: normal; }
  table.eoltab td.lt { display: block; min-width: 0; width: auto; margin-top: 4px; }
  table.eoltab td[data-label]::before { content: attr(data-label); font: 500 11px/1.6 var(--mono); text-transform: uppercase; letter-spacing: .04em; color: var(--grey); }
  table.eoltab td.kd { display: none; }
}
@media print {
  .band, #actions, .tool, .cta, footer.site, .hero figure, #provenance { display: none !important; }
  .rec .why[hidden] { display: none !important; }
  body { font-size: 12px; }
}

/* the version table on a software page: the lifecycle strip in its own column */
table.plain th.lt, table.plain td.lt { width: 30%; min-width: 220px; }
table.plain th.lt .axis { height: 16px; }
table.plain th.lt .axis span { top: 2px; }
table.plain td.lt .tl { margin-top: 5px; }
table.eoltab td.kd { white-space: nowrap; }
@media (min-width: 721px) { table.eoltab td:first-child { white-space: nowrap; } }
table.plain th.lt { padding-left: 16px; }
table.plain th.lt .axis span:nth-child(even) { visibility: hidden; }
table.plain td.lt { padding-left: 16px; }
table.eoltab td.c { white-space: nowrap; }
pre.pasted { background: none !important; border-left: 2px solid var(--rule2); padding: 2px 0 2px 14px !important; }
