/* Kelsey shared styles. Court exhibit: solid rules, full-width bands, square corners. */
:root {
  --ground: #FFFFFF;
  --text: #0A0A0A;
  --muted: #3D4451;
  --rule: #0A0A0A;
  --band: #0B1A2E;
  --on-band: #FFFFFF;
  --on-band-muted: #C9D2DF;
  --link-on-band: #9DB8FF;
  --cobalt: #0038FF;
  --on-cobalt: #FFFFFF;
  --surface: #F2F4F7;
  --mark: #0B1A2E;
  --sans: "Geist", "Helvetica Neue", Arial, sans-serif;
  --mono: "Geist Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ground: #0A0F1A; --text: #F5F7FA; --muted: #B4BCC8; --rule: #F5F7FA;
    --band: #111C30; --on-band: #F5F7FA; --on-band-muted: #C9D2DF; --link-on-band: #7A93FF;
    --cobalt: #7A93FF; --on-cobalt: #0A0F1A; --surface: #151E2E; --mark: #F5F7FA;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --ground: #0A0F1A; --text: #F5F7FA; --muted: #B4BCC8; --rule: #F5F7FA;
  --band: #111C30; --on-band: #F5F7FA; --on-band-muted: #C9D2DF; --link-on-band: #7A93FF;
  --cobalt: #7A93FF; --on-cobalt: #0A0F1A; --surface: #151E2E; --mark: #F5F7FA;
  color-scheme: dark;
}

* { box-sizing: border-box; }
body { margin: 0; background: var(--ground); color: var(--text); font-family: var(--sans); font-size: 17px; line-height: 1.55; }
img, svg { max-width: 100%; }
p { margin: 0; }
a { color: var(--cobalt); text-underline-offset: 3px; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 3px solid var(--cobalt); outline-offset: 3px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.wrap { max-width: 1160px; margin: 0 auto; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }

h1, h2, h3 { font-family: var(--sans); font-weight: 700; letter-spacing: -0.035em; line-height: 1.04; margin: 0; text-wrap: balance; }
h1 { font-size: 40px; }
h2 { font-size: 32px; letter-spacing: -0.025em; margin-bottom: 28px; }
h3 { font-size: 20px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.15; }
@media (min-width: 860px) { h1 { font-size: 64px; } h2 { font-size: 44px; } }
@media (min-width: 1100px) { h1 { font-size: 72px; } }
.cite, .cn, .date, .n, .addr, .win-name { font-family: var(--mono); }
.cite { font-size: 14px; color: var(--muted); overflow-wrap: anywhere; }

/* Header */
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 10; background: var(--ground); }
header.site { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 5; background: var(--ground); border-bottom: 2px solid var(--rule); }
.bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-block: 12px; }
.brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--text); }
.brand svg { width: 32px; height: 32px; flex: none; }
.brand-name { font-weight: 800; letter-spacing: -0.03em; font-size: 26px; line-height: 1; }
.mark .top { fill: var(--mark); }
.mark .low { fill: #FF5A1F; }
.mark .arm { stroke: var(--mark); }
nav a.link { color: var(--text); text-decoration: none; font-weight: 600; font-size: 16px; padding-block: 6px; border-bottom: 3px solid transparent; }
nav a.link:hover { border-bottom-color: var(--cobalt); }
nav a.link[aria-current="page"] { border-bottom-color: var(--cobalt); }
nav.desk { display: none; align-items: center; gap: 28px; }
@media (min-width: 900px) { nav.desk { display: flex; } details.menu { display: none; } }
details.menu { position: static; }
details.menu summary { list-style: none; cursor: pointer; font-weight: 700; font-size: 16px; border: 2px solid var(--rule); padding: 8px 16px; min-height: 44px; display: inline-flex; align-items: center; }
details.menu summary::-webkit-details-marker { display: none; }
details.menu[open] summary { background: var(--text); color: var(--ground); }
details.menu nav { position: absolute; left: 0; right: 0; top: 100%; background: var(--ground); border-bottom: 2px solid var(--rule); padding: 8px 16px 20px; display: flex; flex-direction: column; align-items: stretch; gap: 0; }
details.menu nav a.link { padding: 14px 0; border-bottom: 1px solid var(--rule); font-size: 18px; }
details.menu nav .btn { margin-top: 16px; }

/* Buttons */
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 22px; background: var(--cobalt); color: var(--on-cobalt); border: 2px solid var(--cobalt); font-family: var(--sans); font-weight: 700; font-size: 16px; text-decoration: none; cursor: pointer; line-height: 1.2; }
.btn:hover { background: transparent; color: var(--cobalt); }
.btn2 { display: inline-flex; align-items: center; min-height: 48px; padding: 12px 22px; background: transparent; color: var(--text); border: 2px solid var(--rule); font-family: var(--sans); font-weight: 700; font-size: 16px; cursor: pointer; }
.btn2:hover { background: var(--text); color: var(--ground); }
.navy .btn { background: var(--on-band); color: var(--band); border-color: var(--on-band); }
.navy .btn:hover { background: transparent; color: var(--on-band); }
.navy .btn2 { color: var(--on-band); border-color: var(--on-band); }
.textlink { font-weight: 600; }

/* Bands */
.band { padding: 56px 0; border-top: 2px solid var(--rule); }
header.site + main > .band:first-child { border-top: 0; }
@media (min-width: 860px) { .band { padding: 88px 0; } }
.band.navy { background: var(--band); color: var(--on-band); --text: var(--on-band); --muted: var(--on-band-muted); --rule: var(--on-band); --cobalt: var(--link-on-band); }
.band.navy h1, .band.navy h2, .band.navy h3 { color: var(--on-band); }
.band.head { padding: 48px 0 56px; }
.band.head h1 { max-width: 16ch; }
.band.head .lede { margin-top: 24px; max-width: 46rem; }
.band.flush { padding: 0; border-top: 2px solid var(--rule); }
.band.flush > .wrap { padding-top: 0; }
.lede { font-size: 20px; line-height: 1.45; color: var(--text); }
.after { margin-top: 28px; }

/* 12-column grid */
.grid { display: grid; grid-template-columns: 1fr; gap: 24px 32px; }
@media (min-width: 860px) {
  .grid { grid-template-columns: repeat(12, 1fr); }
  .c-4 { grid-column: span 4; } .c-5 { grid-column: span 5; } .c-6 { grid-column: span 6; } .c-7 { grid-column: span 7; } .c-8 { grid-column: span 8; }
}

/* Hero */
.hero h1 { max-width: 15ch; }
.hero-copy { margin-top: 28px; align-items: start; }
.actions { display: flex; flex-wrap: wrap; gap: 16px 24px; align-items: center; }
@media (min-width: 860px) { .actions { justify-content: flex-end; } }

/* Product window */
.win { margin: 40px 0 0; border: 2px solid var(--rule); background: var(--surface); }
.band.flush .win { margin: 40px 0 56px; }
.win-bar { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 8px 14px; border-bottom: 2px solid var(--rule); background: var(--ground); }
.win-name { font-size: 14px; font-weight: 500; }
.win img { display: block; width: 100%; height: auto; }

/* Q&A with citations */
.qa-q { font-weight: 700; font-size: 22px; line-height: 1.25; letter-spacing: -0.015em; border-left: 6px solid var(--cobalt); padding-left: 16px; }
.qa-a { margin-top: 24px; display: grid; gap: 14px; font-size: 18px; }
.cn { font-size: 0.78em; font-weight: 500; text-decoration: none; position: relative; top: -0.4em; white-space: nowrap; padding: 0 1px; }
.cn:hover { text-decoration: underline; }
.srcs { list-style: none; margin: 28px 0 0; padding: 0; border-top: 2px solid var(--rule); }
.srcs li { display: grid; grid-template-columns: 2.2em 1fr; gap: 8px; padding: 12px 0; border-bottom: 1px solid var(--rule); font-size: 16px; }
.srcs .n { color: var(--cobalt); font-weight: 500; font-size: 15px; }
.srcs a { font-family: var(--mono); font-size: 14px; white-space: nowrap; }
.srcs li:target { background: color-mix(in srgb, var(--cobalt) 18%, transparent); }

/* Label passage */
.doc { margin: 0; border: 2px solid var(--rule); padding: 20px; background: transparent; }
.doc figcaption { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 14px; padding-bottom: 12px; border-bottom: 1px solid var(--rule); }
.doc-text { font-size: 17px; line-height: 1.6; }
.doc-text mark { background: #0038FF; color: #FFFFFF; padding: 1px 3px; }
:root[data-theme="dark"] .doc-text mark { background: #7A93FF; color: #0A0F1A; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .doc-text mark { background: #7A93FF; color: #0A0F1A; } }

/* Timeline */
.tl { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; border-top: 6px solid var(--rule); }
@media (min-width: 860px) { .tl { grid-template-columns: repeat(3, 1fr); gap: 0 32px; } }
.tl li { padding: 20px 0 28px; display: grid; gap: 8px; align-content: start; border-bottom: 1px solid var(--rule); }
@media (min-width: 860px) { .tl li { border-bottom: 0; } }
.dtype { font-weight: 700; font-size: 17px; }
.date { font-size: 34px; font-weight: 500; letter-spacing: -0.03em; line-height: 1.1; }
@media (min-width: 860px) { .date { font-size: 38px; } }
.tl .what { font-size: 18px; }

/* Use cases */
.uses { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; border-top: 2px solid var(--rule); }
@media (min-width: 860px) { .uses { grid-template-columns: 1fr 1fr; gap: 0 48px; } }
.uses li { padding: 24px 0 28px; border-bottom: 2px solid var(--rule); display: grid; gap: 12px; align-content: start; }
.uq { font-size: 18px; }
.ub { color: var(--muted); }
.ub .arrow { font-weight: 700; color: var(--text); }
.band.navy .ub { color: var(--on-band-muted); }

/* Built on */
.stat { display: grid; gap: 10px; align-content: start; }
.stat .num { font-size: 56px; font-weight: 800; letter-spacing: -0.04em; line-height: 1; }
@media (min-width: 860px) { .stat .num { font-size: 72px; } }
.fam { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; border-top: 2px solid var(--rule); }
@media (min-width: 560px) { .fam { grid-template-columns: 1fr 1fr; column-gap: 32px; } }
.fam li { padding: 12px 0; border-bottom: 1px solid var(--rule); font-weight: 600; }

/* Checks (how it works) */
.checks { list-style: none; margin: 0; padding: 0; display: grid; border-top: 2px solid var(--rule); }
@media (min-width: 860px) { .checks { grid-template-columns: 1fr 1fr 1fr; gap: 0 32px; } }
.checks li { display: grid; gap: 8px; padding: 20px 0 24px; border-bottom: 1px solid var(--rule); align-content: start; }
.checks .n, .task h3 .n { color: var(--cobalt); font-size: 15px; font-weight: 500; }

/* Question tasks */
.task { border-top: 6px solid var(--rule); padding: 20px 0 36px; display: grid; gap: 16px; }
@media (min-width: 860px) { .task { grid-template-columns: 4fr 8fr; gap: 32px; } }
.task h3 { font-size: 26px; display: flex; flex-direction: column; gap: 8px; }
.qs { list-style: none; margin: 0; padding: 0; display: grid; }
.qs li { display: grid; gap: 6px; padding: 16px 0; border-bottom: 1px solid var(--rule); }
.qs li:first-child { padding-top: 0; }
.qs .q { font-weight: 600; font-size: 19px; line-height: 1.35; }
.qs .back .k { font-weight: 700; }
.qs .who { font-size: 15px; font-weight: 600; color: var(--muted); }
.note-box { border: 2px solid var(--rule); padding: 20px; font-weight: 600; }
.band .c-7 p + p { margin-top: 14px; }

/* Sources table */
.table-wrap { margin: 0; }
.src-table { width: 100%; border-collapse: collapse; font-size: 16px; }
.src-table th, .src-table td { text-align: left; vertical-align: top; padding: 14px 16px 14px 0; border-bottom: 1px solid var(--rule); }
.src-table thead th { border-bottom: 2px solid var(--rule); font-weight: 700; padding-top: 0; }
.src-table tbody th { font-weight: 700; width: 18%; }
.src-table .ds, .src-table .cov { font-family: var(--mono); font-size: 14px; }
.band.flush .table-wrap { padding: 8px 0 56px; }
@media (max-width: 639px) {
  .src-table, .src-table tbody, .src-table tr, .src-table th, .src-table td { display: block; width: auto; }
  .src-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .src-table tr { border: 2px solid var(--rule); margin-bottom: 16px; padding: 14px 16px; }
  .src-table tbody th { width: auto; font-size: 19px; padding: 0 0 8px; border: 0; }
  .src-table td { padding: 8px 0; border: 0; }
  .src-table td::before { content: attr(data-label); display: block; font-family: var(--mono); font-size: 12px; color: var(--muted); margin-bottom: 2px; }
  .src-table td:empty { display: none; }
}
.plain { font-size: 20px; }

/* About, access */
.prose p + p { margin-top: 16px; }
.statement { font-size: 28px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.2; max-width: 28em; }
@media (min-width: 860px) { .statement { font-size: 40px; } }
.ask { margin: 0 0 20px; padding-left: 22px; }
.ask li { margin-bottom: 6px; font-size: 18px; }
.ask li::marker { color: var(--cobalt); }
.warn { margin-bottom: 14px; padding: 12px 16px; border: 2px solid var(--rule); }
.mail-wrap { border-top: 6px solid var(--rule); padding-top: 20px; align-self: start; }
.mail .addr { font-size: 22px; font-weight: 500; overflow-wrap: anywhere; }
@media (min-width: 560px) { .mail .addr { font-size: 28px; } }
.mail-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
.mail-status { min-height: 1.5em; margin-top: 12px; font-family: var(--mono); font-size: 14px; color: var(--muted); }
.cta { align-items: center; }
.cta h2 { margin: 0; }
@media (min-width: 860px) { .ctabtn { text-align: right; } }

/* Footer */
footer.site { border-top: 2px solid var(--rule); padding: 32px 0 40px; font-size: 15px; color: var(--muted); }
footer.site .wrap { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 24px; }
footer.site .fname { font-weight: 800; color: var(--text); }
footer.site ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 24px; }
footer.site a { color: var(--text); font-weight: 600; }
@media (max-width: 639px) {
  .win { overflow: hidden; }
  .win img { width: 165%; max-width: none; }
}

/* Depth and the shrinking header */
:root { --shadow-1: 0 1px 2px rgba(10,15,26,.06), 0 4px 12px rgba(10,15,26,.06); --shadow-2: 0 2px 4px rgba(10,15,26,.06), 0 12px 32px rgba(10,15,26,.10), 0 32px 64px -16px rgba(10,15,26,.14); --shadow-btn: 0 1px 2px rgba(0,30,140,.25), 0 6px 16px -4px rgba(0,56,255,.35); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --shadow-1: 0 1px 2px rgba(0,0,0,.5), 0 6px 16px rgba(0,0,0,.35); --shadow-2: 0 2px 6px rgba(0,0,0,.5), 0 16px 40px rgba(0,0,0,.45); --shadow-btn: 0 6px 18px -4px rgba(122,147,255,.35); } }
:root[data-theme="dark"] { --shadow-1: 0 1px 2px rgba(0,0,0,.5), 0 6px 16px rgba(0,0,0,.35); --shadow-2: 0 2px 6px rgba(0,0,0,.5), 0 16px 40px rgba(0,0,0,.45); --shadow-btn: 0 6px 18px -4px rgba(122,147,255,.35); }
header.site { border-bottom: 1px solid transparent; background: color-mix(in srgb, var(--ground) 86%, transparent); -webkit-backdrop-filter: saturate(180%) blur(14px); backdrop-filter: saturate(180%) blur(14px); }
header.site .bar { padding-block: 20px; }
header.site .brand svg { width: 36px; height: 36px; }
header.site .brand-name { font-size: 28px; }
header.site.is-compact { border-bottom-color: color-mix(in srgb, var(--rule) 18%, transparent); box-shadow: 0 1px 0 color-mix(in srgb, var(--rule) 6%, transparent), 0 10px 30px -12px rgba(10,15,26,.18); }
header.site.is-compact .bar { padding-block: 8px; }
header.site.is-compact .brand svg { width: 26px; height: 26px; }
header.site.is-compact .brand-name { font-size: 22px; }
.win { border-width: 1px; box-shadow: var(--shadow-2); }
.doc { box-shadow: var(--shadow-1); background: var(--ground); }
.band.navy .doc { background: color-mix(in srgb, var(--on-band) 4%, transparent); box-shadow: 0 16px 40px rgba(0,0,0,.35); }
.btn { box-shadow: var(--shadow-btn); }
.btn:hover { transform: translateY(-1px); }
details.menu nav { box-shadow: var(--shadow-2); }
@media (prefers-reduced-motion: no-preference) {
  header.site, header.site .bar, header.site .brand svg, header.site .brand-name { transition: padding .25s ease, width .25s ease, height .25s ease, font-size .25s ease, box-shadow .25s ease, border-color .25s ease; }
  .btn { transition: transform .15s ease, background-color .15s ease, color .15s ease, box-shadow .15s ease; }
}

/* ===== Self-hosted fonts (Geist, Geist Mono; latin subset, variable) ===== */
@font-face { font-family: "Geist"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("/fonts/geist-latin-wght-normal.woff2") format("woff2"); }
@font-face { font-family: "Geist Mono"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("/fonts/geist-mono-latin-wght-normal.woff2") format("woff2"); }

/* ===== Skip link, crumbs ===== */
.skip { position: absolute; left: 16px; top: -80px; z-index: 20; background: var(--text); color: var(--ground); padding: 12px 18px; font-weight: 700; text-decoration: none; }
.skip:focus { top: 8px; }
main:focus { outline: none; }
.crumbs { margin-bottom: 22px; font-size: 15px; }
.crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 0; }
.crumbs li + li::before { content: "/"; margin: 0 10px; color: var(--muted); }
.crumbs a { color: var(--muted); text-decoration: none; font-weight: 600; }
.crumbs a:hover { text-decoration: underline; color: var(--text); }
.crumbs [aria-current] { color: var(--text); font-weight: 600; }

/* ===== Content pages ===== */
.band.head.doc h1 { max-width: 22ch; font-size: 38px; }
@media (min-width: 860px) { .band.head.doc h1 { font-size: 56px; } }
.band.head.art h1 { max-width: 26ch; font-size: 36px; }
@media (min-width: 860px) { .band.head.art h1 { font-size: 48px; } }
.byline { margin-top: 20px; font-family: var(--mono); font-size: 14px; color: var(--muted); }
.band.body { padding: 40px 0 72px; }
@media (min-width: 860px) { .band.body { padding: 56px 0 96px; } }
.doc-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; }
@media (min-width: 1040px) { .doc-layout.has-toc { grid-template-columns: 210px minmax(0, 1fr); gap: 56px; } }
.toc { font-size: 15px; }
.toc h2 { font-size: 13px; font-family: var(--mono); letter-spacing: .04em; text-transform: uppercase; color: var(--muted); font-weight: 500; margin: 0 0 12px; }
.toc ol { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--rule); }
.toc li { border-bottom: 1px solid var(--rule); }
.toc a { display: block; padding: 9px 0; color: var(--text); text-decoration: none; font-weight: 600; line-height: 1.3; }
.toc a:hover { color: var(--cobalt); }
@media (min-width: 1040px) { .toc { position: sticky; top: 92px; align-self: start; } }
@media (max-width: 1039px) { .toc ol { columns: 1; } }

.prose { min-width: 0; }
.prose > h2 { font-size: 28px; letter-spacing: -0.025em; margin: 56px 0 18px; padding-top: 22px; border-top: 6px solid var(--rule); scroll-margin-top: 90px; }
.prose > h2:first-child { margin-top: 0; }
@media (min-width: 860px) { .prose > h2 { font-size: 34px; } }
.prose h3 { font-size: 22px; margin: 32px 0 10px; scroll-margin-top: 90px; }
.prose > p, .prose > ul, .prose > ol, .prose > blockquote, .prose > .qa, .prose > .cta-row, .prose > .actions-row { max-width: 46rem; }
.prose p { margin: 0 0 16px; }
.prose ul, .prose ol { margin: 0 0 18px; padding-left: 22px; }
.prose li { margin-bottom: 8px; }
.prose li::marker { color: var(--cobalt); }
.prose code { font-family: var(--mono); font-size: .88em; background: var(--surface); padding: 1px 5px; }
.prose a { font-weight: 500; }
.prose .cta-row { margin: 28px 0 0; }
.prose .cta-row a.btn { color: var(--on-cobalt); text-decoration: none; }
.prose .cta-row a.btn:hover { color: var(--cobalt); }
.actions-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin: 0 0 20px; }
.copy-status { font-family: var(--mono); font-size: 14px; color: var(--muted); min-height: 1.5em; }

/* Question blocks */
.qa { margin: 28px 0 36px; }
.qa blockquote { margin: 0; font-weight: 700; font-size: 21px; line-height: 1.3; letter-spacing: -0.015em; border-left: 6px solid var(--cobalt); padding: 2px 0 2px 16px; }
.qa blockquote p { margin: 0; }
.qa .back { margin: 14px 0 0 22px; color: var(--text); }
.qa .back .k { font-weight: 700; }
.prose blockquote.quote { margin: 20px 0 24px; padding: 14px 18px; border-left: 4px solid var(--rule); background: var(--surface); max-width: 46rem; }
.prose blockquote.quote p { margin: 0; }

/* Footnote refs and notes */
.fn { font-family: var(--mono); font-size: .75em; font-weight: 500; line-height: 0; vertical-align: super; white-space: nowrap; }
.fn a { text-decoration: none; padding: 0 1px; }
.fn a:hover { text-decoration: underline; }
.notes { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--rule); counter-reset: note; max-width: 56rem; }
.notes li { counter-increment: note; display: grid; grid-template-columns: 2.6em 1fr; gap: 8px; padding: 12px 0; border-bottom: 1px solid var(--rule); font-size: 15px; margin: 0; overflow-wrap: anywhere; }
.notes li::before { content: "[" counter(note) "]"; font-family: var(--mono); color: var(--cobalt); font-size: 14px; }
.notes li:target { background: color-mix(in srgb, var(--cobalt) 18%, transparent); }
.notes a { font-family: var(--mono); font-size: 13px; overflow-wrap: anywhere; }

/* Tables */
.tw { margin: 24px 0 32px; overflow-x: auto; }
.tw:focus-visible { outline: 3px solid var(--cobalt); outline-offset: 3px; }
table.data { width: 100%; border-collapse: collapse; font-size: 16px; }
table.data th, table.data td { text-align: left; vertical-align: top; padding: 12px 16px 12px 0; border-bottom: 1px solid var(--rule); }
table.data thead th { border-bottom: 2px solid var(--rule); font-weight: 700; white-space: nowrap; }
table.data td:first-child { font-weight: 600; }
table.chron td:first-child { font-family: var(--mono); font-size: 14px; font-weight: 500; white-space: nowrap; }
table.chron td:nth-child(3) { white-space: nowrap; }
.dt { display: inline-block; font-family: var(--mono); font-size: 12px; font-weight: 500; text-transform: uppercase; letter-spacing: .03em; padding: 3px 8px; border: 1px solid var(--rule); }
.dt-approved { background: var(--text); color: var(--ground); }
.dt-submitted { border-style: dashed; }
@media (max-width: 719px) {
  table.data, table.data tbody, table.data tr, table.data th, table.data td { display: block; width: auto; }
  table.data thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  table.data tr { border: 2px solid var(--rule); margin-bottom: 14px; padding: 12px 14px; }
  table.data td { border: 0; padding: 6px 0; }
  table.data td::before { content: attr(data-label); display: block; font-family: var(--mono); font-size: 12px; color: var(--muted); margin-bottom: 2px; font-weight: 400; }
  table.chron td:first-child { white-space: normal; }
}

/* Screens */
figure.shot { margin: 28px 0 36px; border: 1px solid var(--rule); background: var(--surface); box-shadow: var(--shadow-2); overflow-x: auto; max-width: 100%; }
figure.shot:focus-visible { outline: 3px solid var(--cobalt); outline-offset: 3px; }
figure.shot img { display: block; width: 100%; height: auto; }
figure.shot.narrow { max-width: 460px; }
@media (max-width: 719px) { figure.shot.wide img { min-width: 760px; } }
figcaption.cap { margin: 12px 0 0; font-size: 15px; color: var(--muted); max-width: 46rem; }
.fig { margin: 0; }
.fig figure.shot { margin: 0; }
.band.navy figure.shot { border-color: color-mix(in srgb, var(--on-band) 30%, transparent); }
.band.navy figcaption.cap { color: var(--on-band-muted); }

/* Home */
.hero-sub { margin-top: 16px; max-width: 46rem; color: var(--muted); font-size: 17px; }
.hero-shot { margin-top: 40px; }
.hero-shot figure.shot { margin: 0; }
.split { align-items: start; }
.split h2 { margin-bottom: 18px; }
.split .copy p + p { margin-top: 14px; }
.split .copy .textlink { display: inline-block; margin-top: 18px; }
.split .fig + .fig { margin-top: 28px; }
.graph-band .copy p { max-width: 46rem; }
.graph-cap { margin-top: 18px; max-width: 54rem; font-size: 15px; color: var(--on-band-muted); }
.graph-fallback { color: var(--on-band-muted); }
.graph-mount { margin-top: 32px; }
.srcl { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--rule); }
.srcl li { padding: 12px 0; border-bottom: 1px solid var(--rule); font-weight: 500; }
.pillrow { display: flex; flex-wrap: wrap; gap: 14px 28px; align-items: center; margin-top: 8px; }
.uses .who { font-family: var(--mono); font-size: 13px; text-transform: uppercase; letter-spacing: .03em; color: var(--muted); font-weight: 500; }
.band.navy .uses .who { color: var(--on-band-muted); }
.uses h3 { font-size: 20px; }
.mailline { font-family: var(--mono); font-size: 22px; font-weight: 500; overflow-wrap: anywhere; }

/* Glossary */
.azn { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 36px; padding: 0; list-style: none; }
.azn a { display: inline-flex; min-width: 40px; min-height: 40px; align-items: center; justify-content: center; border: 1px solid var(--rule); text-decoration: none; font-family: var(--mono); font-weight: 500; color: var(--text); }
.azn a:hover { background: var(--text); color: var(--ground); }
.gl-letter { margin-bottom: 8px; }
.gl-letter > h2 { font-size: 40px; margin: 40px 0 8px; border-top: 6px solid var(--rule); padding-top: 14px; scroll-margin-top: 90px; }
dl.gl { margin: 0; }
dl.gl dt { font-weight: 700; font-size: 20px; letter-spacing: -0.015em; margin-top: 22px; scroll-margin-top: 90px; }
dl.gl dd { margin: 6px 0 0; max-width: 46rem; }
dl.gl dd p { margin: 0 0 12px; }

/* FAQ */
.faq-item { border-top: 2px solid var(--rule); padding: 24px 0 28px; display: grid; gap: 14px; }
@media (min-width: 860px) { .faq-item { grid-template-columns: 4fr 8fr; gap: 40px; } }
.faq-item h2 { font-size: 22px; letter-spacing: -0.02em; line-height: 1.2; margin: 0; scroll-margin-top: 90px; }
.faq-a { max-width: 46rem; }
.faq-a p { margin: 0 0 14px; }
.faq-a ul { margin: 0 0 14px; padding-left: 22px; }
.faq-a li { margin-bottom: 6px; }

/* Analyses cards */
.acards { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 0; border-top: 2px solid var(--rule); }
.acards li { padding: 22px 0 24px; border-bottom: 1px solid var(--rule); max-width: 50rem; }
.acards h3 { font-size: 24px; margin: 0 0 8px; }
.acards h3 a { color: var(--text); text-decoration: none; }
.acards h3 a:hover { color: var(--cobalt); text-decoration: underline; }
.acards p { margin: 0; color: var(--muted); }
.art-graph { margin: 8px 0 40px; border: 1px solid var(--rule); padding: 20px; }

/* Footer */
footer.site { padding: 48px 0 40px; }
footer.site .wrap { display: block; }
.fcols { display: grid; grid-template-columns: 1fr 1fr; gap: 32px 24px; padding-bottom: 36px; border-bottom: 1px solid var(--rule); }
@media (min-width: 860px) { .fcols { grid-template-columns: repeat(5, 1fr); } .fcols.fc4 { grid-template-columns: repeat(4, 1fr); } }
.fcols h2 { font-size: 13px; font-family: var(--mono); font-weight: 500; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); margin: 0 0 12px; line-height: 1.3; }
.fcols h2 a { color: var(--muted); text-decoration: none; font-weight: 500; }
.fcols h2 a:hover { text-decoration: underline; color: var(--text); }
.fcols ul { display: block; list-style: none; margin: 0; padding: 0; }
.fcols li { margin-bottom: 8px; }
.fcols li a { color: var(--text); text-decoration: none; font-weight: 600; font-size: 15px; line-height: 1.35; }
.fcols li a:hover { text-decoration: underline; }
.fbottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 18px 32px; padding-top: 24px; }
.fbottom p { margin: 0 0 4px; }
.fbottom .fsmall { font-size: 13px; }
.fbottom .fsmall a { color: var(--muted); font-weight: 500; }
.fbottom .fmail { font-weight: 600; }

.grid > * { min-width: 0; }