
:root {
  color-scheme: light dark;
  --bg:#fbfbf8;
  --ink:#090a0a;
  --muted:#5f676e;
  --faint:#838b93;
  --line:#deded8;
  --line-strong:#bebfb7;
  --panel:#f4f4ef;
  --panel-2:#ecece4;
  --code:#080b0d;
  --code-ink:#eaf4f2;
  --accent:#0c7880;
  --accent-2:#b88a1d;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0;
  min-width:320px;
  background:
    linear-gradient(90deg, rgba(9,10,10,.035) 1px, transparent 1px) 0 0 / 48px 48px,
    linear-gradient(180deg, rgba(9,10,10,.025) 1px, transparent 1px) 0 0 / 48px 48px,
    var(--bg);
  color:var(--ink);
  font:16px/1.65 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
a { color:inherit; text-decoration:none; }
a:hover { text-decoration:underline; text-underline-offset:4px; }
code, pre { font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
button, input, select {
  font:inherit;
}
button {
  appearance:none;
  border:0;
  cursor:pointer;
}
button:disabled {
  cursor:not-allowed;
  opacity:.6;
}
input, select {
  width:100%;
  min-height:44px;
  border:1px solid var(--line-strong);
  background:var(--bg);
  color:var(--ink);
  padding:10px 12px;
  outline:none;
}
textarea {
  width:100%;
  min-height:112px;
  border:1px solid var(--line-strong);
  background:var(--code);
  color:var(--code-ink);
  padding:14px;
  resize:vertical;
  outline:none;
  font:13px/1.55 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
input:focus,
select:focus {
  border-color:var(--accent);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent);
}
.secret-box {
  margin-top:14px;
  overflow-wrap:anywhere;
}
.topbar {
  position:sticky;
  top:0;
  z-index:10;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  height:64px;
  padding:0 clamp(20px,5vw,72px);
  border-bottom:1px solid var(--line);
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(14px);
}
.wordmark {
  display:flex;
  align-items:center;
  gap:9px;
  color:#111;
  font:650 15px/1.1 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing:0;
  white-space:nowrap;
}
.wordmark-mark {
  display:inline-grid;
  place-items:center;
  width:25px;
  height:25px;
  border:1px solid var(--line-strong);
  color:var(--accent);
  font:700 17px/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.brand {
  color:#111;
  font-weight:700;
  white-space:nowrap;
}
.topnav { display:flex; align-items:center; gap:22px; color:var(--muted); font-size:14px; }
.topbar > a:not(.brand) {
  color:var(--muted);
  font-size:14px;
}
main { max-width:1180px; margin:0 auto; padding:0 clamp(20px,5vw,72px); }
.page {
  max-width:none;
  padding:0;
}
.page > .hero,
.page > .auth-hero,
.page > .account-hero,
.page > .docs-shell,
.page > .auth-shell,
.page > .account-shell {
  max-width:1180px;
  margin:0 auto;
  padding-left:clamp(20px,5vw,72px);
  padding-right:clamp(20px,5vw,72px);
}
.hero {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,380px);
  gap:64px;
  align-items:end;
  padding:108px 0 58px;
}
.auth-hero,
.account-hero {
  padding-top:70px;
  padding-bottom:32px;
  border-bottom:1px solid var(--line);
}
.auth-hero h1,
.account-hero h1 {
  max-width:760px;
  font-size:clamp(34px,4vw,54px);
  line-height:1.08;
}
.eyebrow {
  margin:0 0 12px;
  color:var(--faint);
  font:12px/1.3 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  text-transform:uppercase;
  letter-spacing:.13em;
}
.label {
  margin:0 0 14px;
  color:var(--faint);
  font:12px/1.3 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  text-transform:uppercase;
  letter-spacing:.13em;
}
h1, h2, h3, p { margin:0; }
h1 {
  max-width:850px;
  font-size:clamp(40px,6vw,76px);
  line-height:1;
  letter-spacing:-.01em;
  font-weight:780;
}
h2 {
  max-width:760px;
  font-size:clamp(24px,2.5vw,34px);
  line-height:1.16;
  letter-spacing:-.012em;
  font-weight:720;
}
p { color:var(--muted); max-width:760px; }
.lede { margin-top:22px; color:#31373c; font-size:18px; line-height:1.55; }
.auth-hero .lede,
.account-hero .lede {
  max-width:680px;
  font-size:17px;
}
.hero-links { display:flex; flex-wrap:wrap; gap:18px; margin-top:32px; color:#111; font-size:14px; }
.hero-links a {
  border:1px solid var(--line-strong);
  background:rgba(255,255,255,.46);
  padding:8px 10px;
}
.hero-links a:first-child {
  border-color:var(--ink);
  background:var(--ink);
  color:var(--bg);
}
.hero-test {
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr);
  gap:1px;
  margin-top:30px;
  border:1px solid var(--line-strong);
  background:var(--line);
}
.hero-test > div {
  min-width:0;
  padding:18px;
  background:rgba(255,255,255,.58);
}
.hero-test-grid {
  display:grid;
  grid-template-columns:minmax(130px,1.15fr) minmax(110px,.75fr) minmax(110px,.75fr) auto;
  gap:10px;
  align-items:end;
}
.hero-test label span {
  display:block;
  margin-bottom:6px;
  color:var(--faint);
  font:11px/1.25 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.hero-test button#hero-run-demo {
  min-height:44px;
  padding:10px 14px;
  background:var(--ink);
  color:var(--bg);
  font-weight:700;
  white-space:nowrap;
}
.hero-test .small-note {
  margin-top:12px;
  font-size:13px;
}
.hero-test-result {
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:9px;
  min-height:178px;
}
.hero-test-result span {
  color:var(--faint);
  font:11px/1.25 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  text-transform:uppercase;
  letter-spacing:.1em;
}
.hero-test-result strong {
  color:var(--ink);
  font:760 24px/1.1 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.hero-test-result p,
.hero-test-result dd,
.hero-test-result dt {
  font-size:13px;
  line-height:1.4;
}
.hero-test-result dl {
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:1px;
  margin:4px 0 0;
  background:var(--line);
  border:1px solid var(--line);
}
.hero-test-result dl div {
  min-width:0;
  padding:9px;
  background:var(--bg);
}
.hero-test-result dt {
  color:var(--faint);
  font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.hero-test-result dd {
  margin:2px 0 0;
  color:var(--ink);
  overflow-wrap:anywhere;
}
.hero-test-result pre {
  max-height:94px;
  overflow:auto;
  margin:4px 0 0;
  padding:10px;
  background:var(--code);
  color:var(--code-ink);
  font-size:11px;
  line-height:1.45;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}
.guard-clause-box {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px 10px;
  margin-top:4px;
  padding:10px;
  border:1px solid var(--line);
  border-radius:10px;
  background:rgba(255,255,255,.62);
}
.guard-clause-box strong {
  display:block;
  color:var(--ink);
  font:700 13px/1.2 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.guard-clause-box p {
  margin:3px 0 0;
  font-size:12px;
}
.guard-clause-box button {
  min-height:32px;
  align-self:start;
  padding:7px 10px;
  border:1px solid var(--ink);
  border-radius:8px;
  background:var(--ink);
  color:var(--bg);
  font-weight:700;
  cursor:pointer;
}
.guard-clause-box pre {
  grid-column:1 / -1;
  max-height:132px;
  margin:0;
}
.hero-result-actions {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:2px;
}
.hero-result-actions a {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:7px 10px;
  border:1px solid var(--line-strong);
  border-radius:8px;
  color:var(--ink);
  font-size:13px;
  font-weight:650;
}
.hero-result-actions a:first-child {
  background:var(--ink);
  border-color:var(--ink);
  color:var(--bg);
}
.hero-test-result.stop strong { color:#b62222; }
.hero-test-result.caution strong { color:#a26f00; }
.hero-test-result.ready strong { color:var(--accent); }
.link-button {
  appearance:none;
  border:0;
  padding:0;
  background:transparent;
  color:var(--accent);
  font:inherit;
  text-decoration:underline;
  text-underline-offset:3px;
}
.contract-panel {
  border:1px solid var(--line);
  background:var(--panel);
  padding:20px;
}
.terminal-panel {
  background:
    linear-gradient(180deg, rgba(12,120,128,.08), transparent 38%),
    var(--code);
  border-color:#1d2a2d;
  color:var(--code-ink);
  box-shadow:0 18px 54px rgba(8,11,13,.16);
}
.terminal-panel dt,
.terminal-panel dd,
.terminal-panel .panel-title {
  color:var(--code-ink);
}
.terminal-panel dl div {
  border-color:rgba(234,244,242,.14);
}
.mini-terminal {
  margin:18px 0 0;
  padding:14px;
  border:1px solid rgba(234,244,242,.16);
  background:rgba(255,255,255,.04);
  color:var(--code-ink);
  font-size:12px;
  line-height:1.7;
  overflow:auto;
}
.signal-strip {
  max-width:1180px;
  margin:0 auto 18px;
  padding:0 clamp(20px,5vw,72px);
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.signal-strip div {
  min-width:0;
  padding:18px 18px 18px 0;
  border-right:1px solid var(--line);
}
.signal-strip div:last-child { border-right:0; }
.signal-strip span {
  display:block;
  color:var(--accent);
  font:12px/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  margin-bottom:9px;
}
.signal-strip strong {
  display:block;
  color:var(--ink);
  font-size:15px;
}
.signal-strip p {
  margin-top:4px;
  font-size:13px;
  line-height:1.42;
}
.panel-title { color:var(--faint); font:12px/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; text-transform:uppercase; letter-spacing:.14em; margin-bottom:12px; }
dl { margin:0; }
dl div { display:grid; grid-template-columns:1fr auto; gap:16px; padding:10px 0; border-top:1px solid var(--line); }
dt { color:var(--muted); }
dd { margin:0; font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color:#111; }
.docs-shell {
  display:grid;
  grid-template-columns:190px minmax(0,1fr);
  gap:56px;
  border-top:1px solid var(--line);
}
.auth-shell {
  display:grid;
  grid-template-columns:minmax(0,520px) minmax(280px,1fr);
  gap:22px;
  align-items:start;
  padding-top:28px;
  padding-bottom:78px;
}
.auth-shell-wide {
  grid-template-columns:repeat(3, minmax(0, 1fr));
}
.auth-card,
.auth-side,
.settings-card {
  min-width:0;
  border:1px solid var(--line);
  background:rgba(244,244,239,.92);
  padding:22px;
}
.auth-card-primary {
  background:var(--bg);
  border-color:var(--line-strong);
}
.auth-side {
  display:grid;
  gap:16px;
}
.auth-side-wide {
  grid-column:1 / -1;
  background:transparent;
}
.section-heading {
  display:flex;
  align-items:baseline;
  gap:10px;
  margin-bottom:14px;
}
.section-heading span {
  color:var(--faint);
  font:12px/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.section-heading h2 {
  margin:0;
  font-size:20px;
  line-height:1.2;
  letter-spacing:0;
}
.stacked-form {
  display:grid;
  gap:14px;
  margin-top:14px;
}
.form-field {
  display:grid;
  gap:7px;
  color:var(--muted);
  font-size:14px;
}
.form-field span {
  color:var(--ink);
  font-weight:650;
}
.checkbox-line {
  display:grid;
  grid-template-columns:18px minmax(0,1fr);
  gap:10px;
  align-items:start;
  color:var(--muted);
  font-size:14px;
  line-height:1.45;
}
.checkbox-line input {
  width:18px;
  min-height:18px;
  margin-top:2px;
}
.primary-button,
.secondary-button,
.danger-button,
.ghost-button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  width:max-content;
  max-width:100%;
  padding:0 15px;
  border:1px solid var(--line-strong);
  background:var(--ink);
  color:var(--bg);
  font-weight:700;
  font-size:14px;
  line-height:1;
}
.secondary-button {
  background:var(--bg);
  color:var(--ink);
}
.danger-button {
  min-height:34px;
  padding:0 11px;
  border-color:#c2410c;
  background:#c2410c;
  color:#fff;
}
.ghost-button {
  background:transparent;
  color:var(--muted);
}
.button-row {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:16px;
}
.button-row form,
.inline-form {
  margin:0;
}
.form-alert {
  max-width:680px;
  margin-top:22px;
  border:1px solid #c2410c;
  background:color-mix(in srgb, #c2410c 10%, var(--bg));
  color:var(--ink);
  padding:12px 14px;
  font-size:14px;
}
.small-note {
  margin-top:14px;
  color:var(--muted);
  font-size:14px;
  line-height:1.5;
}
.try-shell {
  display:grid;
  grid-template-columns:minmax(0, 1.4fr) minmax(280px, .6fr);
  gap:32px;
  padding:40px 0 84px;
}
.try-card,
.try-side {
  border:1px solid var(--line);
  background:rgba(255,255,255,.56);
}
.try-card { padding:28px; }
.try-side { padding:28px; align-self:start; }
.try-input-row label {
  display:block;
  margin-bottom:8px;
  color:var(--ink);
  font-weight:650;
}
.try-form-row {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
}
.try-action-row {
  grid-template-columns:1fr minmax(120px,.7fr) 1fr;
}
.try-form-row button {
  min-width:96px;
  min-height:44px;
  padding:0 18px;
  background:var(--ink);
  color:var(--bg);
}
.try-result {
  margin-top:28px;
  padding-top:26px;
  border-top:1px solid var(--line);
}
.try-result-grid {
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:1px;
  margin:20px 0;
  background:var(--line);
  border:1px solid var(--line);
}
.try-result-grid div {
  min-width:0;
  background:var(--panel);
  padding:14px;
}
.try-result-grid dt {
  color:var(--faint);
  font:12px/1.3 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.try-result-grid dd {
  margin:5px 0 0;
  overflow-wrap:anywhere;
  color:var(--ink);
}
.verdict-stop { color:#9a251d; }
.verdict-caution { color:#946200; }
.verdict-ready { color:var(--accent); }
.compact-code {
  max-height:260px;
  overflow:auto;
  font-size:12px;
}
.try-api-box {
  margin-top:22px;
  padding-top:18px;
  border-top:1px solid var(--line);
}
.try-api-box .code-sample {
  margin-top:10px;
}
.try-api-box .small-note {
  margin-top:10px;
}
.try-cta-list {
  display:grid;
  gap:10px;
  margin-top:22px;
}
.try-cta-list a {
  border:1px solid var(--line-strong);
  padding:10px 12px;
  background:var(--panel);
}
.fineprint {
  margin-top:14px;
  color:var(--faint);
  font-size:12px;
  line-height:1.5;
}
.text-link-strong {
  color:var(--ink);
  font-weight:700;
  border-bottom:1px solid var(--line-strong);
}
.clean-list {
  margin:0;
  padding-left:20px;
  color:var(--muted);
}
.clean-list li + li {
  margin-top:8px;
}
.account-shell {
  display:grid;
  grid-template-columns:220px minmax(0,1fr);
  gap:28px;
  align-items:start;
  padding-top:28px;
  padding-bottom:78px;
}
.account-nav {
  position:sticky;
  top:88px;
  display:grid;
  gap:10px;
  color:var(--muted);
  font-size:14px;
}
.account-nav a,
.account-nav button {
  justify-self:start;
}
.settings-grid {
  min-width:0;
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:18px;
}
.settings-card {
  display:grid;
  align-content:start;
  gap:12px;
  box-shadow:0 1px 0 rgba(9,10,10,.04);
}
.settings-card-wide {
  grid-column:1 / -1;
}
.settings-kv {
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
}
.settings-kv div {
  display:grid;
  gap:6px;
  min-width:0;
  padding:12px;
  background:var(--bg);
  border:0;
}
.settings-kv dt {
  color:var(--faint);
  font-size:12px;
  line-height:1.2;
}
.settings-kv dd {
  min-width:0;
  overflow-wrap:anywhere;
  font-size:13px;
}
.table-wrap {
  width:100%;
  overflow-x:auto;
  border:1px solid var(--line);
  background:var(--bg);
}
.account-table {
  width:100%;
  min-width:860px;
  border-collapse:collapse;
  font-size:13px;
  line-height:1.35;
}
.account-table th,
.account-table td {
  padding:11px 12px;
  border-bottom:1px solid var(--line);
  text-align:left;
  vertical-align:middle;
}
.account-table th {
  color:var(--faint);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:700;
}
.account-table td {
  color:var(--muted);
}
.account-table code {
  color:var(--ink);
  overflow-wrap:anywhere;
}
.status-pill {
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:0 8px;
  border:1px solid var(--line-strong);
  color:var(--ink);
  font:11px/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  white-space:nowrap;
}
.settings-banner {
  grid-column:1 / -1;
  display:grid;
  gap:6px;
  border:1px solid var(--line-strong);
  background:linear-gradient(90deg, rgba(12,120,128,.1), rgba(184,138,29,.08));
  padding:16px;
}
.settings-banner strong {
  color:var(--ink);
}
.settings-banner p {
  font-size:14px;
  line-height:1.48;
}
.toc {
  position:sticky;
  top:88px;
  align-self:start;
  display:grid;
  gap:9px;
  padding:34px 0;
  color:var(--muted);
  font-size:14px;
}
.toc a { padding:4px 0; }
.doc { min-width:0; }
.doc-section {
  padding:54px 0;
  border-bottom:1px solid var(--line);
}
.doc-section p + p { margin-top:16px; }
.endpoint-block {
  display:grid;
  gap:1px;
  margin-top:24px;
  border:1px solid var(--line);
  background:var(--line);
}
.endpoint-block > div {
  background:var(--bg);
  padding:18px;
}
.endpoint-block code { color:#111; font-size:13px; overflow-wrap:anywhere; }
.endpoint-block p { margin-top:8px; }
.split {
  display:grid;
  grid-template-columns:minmax(0,.78fr) minmax(400px,1fr);
  gap:38px;
  align-items:start;
}
.code-sample {
  overflow:auto;
  margin:0;
  padding:20px;
  border:1px solid #1f2937;
  background:var(--code);
  color:var(--code-ink);
  font-size:13px;
  line-height:1.58;
}
.reason-grid {
  display:grid;
  gap:1px;
  margin-top:26px;
  border:1px solid var(--line);
  background:var(--line);
}
.reason-grid div {
  display:grid;
  grid-template-columns:270px minmax(0,1fr);
  gap:18px;
  padding:16px;
  background:var(--bg);
}
.reason-grid code { color:#111; font-size:12px; overflow-wrap:anywhere; }
.reason-grid span { color:var(--muted); }
.resolved-proof-grid {
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:1px;
  margin-top:26px;
  border:1px solid var(--line);
  background:var(--line);
}
.resolved-proof-card {
  min-width:0;
  display:grid;
  align-content:start;
  gap:10px;
  min-height:190px;
  padding:18px;
  background:var(--bg);
}
.resolved-proof-card span {
  color:var(--accent);
  font:12px/1.3 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.resolved-proof-card h3 {
  max-width:100%;
  color:var(--ink);
  font-size:18px;
  line-height:1.25;
  overflow-wrap:anywhere;
}
.resolved-proof-card p {
  font-size:14px;
  line-height:1.5;
}
.resolved-proof-card a {
  justify-self:start;
  margin-top:auto;
  color:var(--ink);
  font-weight:700;
  border-bottom:1px solid var(--line-strong);
}
.evidence-summary-panel {
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);
  gap:24px;
  margin-top:24px;
  padding:22px;
  border:1px solid var(--line-strong);
  background:
    linear-gradient(90deg, rgba(12,120,128,.08), transparent 52%),
    rgba(255,255,255,.42);
}
.evidence-summary-panel h3 {
  max-width:560px;
  margin-bottom:10px;
  color:var(--ink);
  font-size:22px;
  line-height:1.22;
}
.evidence-summary-panel p {
  font-size:15px;
}
.evidence-summary-panel .small-note {
  grid-column:1 / -1;
  margin-top:0;
}
.evidence-summary-grid {
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:1px;
  margin:0;
  background:var(--line);
  border:1px solid var(--line);
}
.evidence-summary-grid div {
  min-height:84px;
  padding:14px;
  background:var(--bg);
}
.evidence-summary-grid dt {
  color:var(--faint);
  font:11px/1.25 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.evidence-summary-grid dd {
  margin:8px 0 0;
  color:var(--ink);
  font:700 26px/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.access-note { background:linear-gradient(90deg, transparent, var(--panel), transparent); }
.footer {
  max-width:1180px;
  margin:0 auto;
  padding:30px clamp(20px,5vw,72px) 56px;
  display:flex;
  flex-wrap:wrap;
  gap:18px;
  color:var(--muted);
  font-size:14px;
}
.footer span { color:#111; font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }

.metric-grid {
  max-width:1180px;
  margin:0 auto 24px;
  padding:0 clamp(20px,5vw,72px);
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:1px;
}
.metric-grid > div {
  min-width:0;
  border:1px solid var(--line);
  background:var(--panel);
  padding:18px;
}
.metric-grid span {
  display:block;
  color:var(--faint);
  font:11px/1.35 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  text-transform:uppercase;
  letter-spacing:.12em;
}
.metric-grid strong {
  display:block;
  margin-top:8px;
  color:var(--ink);
  font:720 30px/1 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg:#090a0a;
    --ink:#f5f7f8;
    --muted:#a1a8b0;
    --faint:#717b85;
    --line:#242a31;
    --line-strong:#3a444e;
    --panel:#0e1111;
    --panel-2:#121615;
    --code:#05070a;
    --code-ink:#eef6f8;
    --accent:#76e7f2;
  }
  .topbar { background:rgba(9,10,12,.86); }
  .brand, .wordmark, h1, h2, .hero-links, dd, .endpoint-block code, .reason-grid code, .metric-grid strong, .footer span { color:#f5f7f8; }
  .lede { color:#d3d9df; }
  input { background:#0b0e12; }
  .auth-card,
  .auth-side,
  .settings-card,
  .try-card,
  .try-side { background:rgba(14,17,17,.94); }
  .auth-card-primary,
  .settings-kv div,
  .endpoint-block > div,
  .reason-grid div,
  .resolved-proof-card,
  .try-result-grid div,
  .try-cta-list a { background:var(--bg); }
  .hero-links a { background:rgba(255,255,255,.04); }
  .hero-links a:first-child { background:var(--ink); color:var(--bg); }
}
@media (max-width: 920px) {
  .topbar { position:relative; height:auto; padding-top:18px; padding-bottom:18px; align-items:flex-start; }
  .topnav { flex-wrap:wrap; justify-content:flex-end; gap:12px 18px; }
  .hero, .docs-shell, .split, .auth-shell, .auth-shell-wide, .account-shell, .try-shell { grid-template-columns:1fr; gap:28px; }
  .hero { padding:58px 0 48px; }
  .hero-test { grid-template-columns:1fr; }
  .hero-test-grid { grid-template-columns:repeat(3, minmax(0,1fr)); }
  .hero-test button#hero-run-demo { grid-column:1 / -1; }
  .signal-strip, .metric-grid { grid-template-columns:repeat(2, minmax(0,1fr)); }
  .signal-strip div:nth-child(2) { border-right:0; }
  .toc { position:relative; top:auto; display:flex; flex-wrap:wrap; border-bottom:1px solid var(--line); padding:18px 0; }
  .account-nav { position:relative; top:auto; display:flex; flex-wrap:wrap; border-bottom:1px solid var(--line); padding-bottom:18px; }
  .settings-grid { grid-template-columns:1fr; }
  .settings-kv { grid-template-columns:repeat(2, minmax(0,1fr)); }
  .auth-side-wide { grid-column:auto; }
  .evidence-summary-panel { grid-template-columns:1fr; }
}
@media (max-width: 560px) {
  .topbar { display:grid; gap:16px; }
  .topnav { justify-content:flex-start; }
  main { padding:0 16px; }
  h1 { font-size:34px; line-height:1.08; }
  h2 { font-size:24px; line-height:1.18; }
  .lede { font-size:16px; }
  .contract-panel { padding:16px; }
  .doc-section { padding:42px 0; }
  .auth-hero, .account-hero { padding-top:42px; padding-bottom:24px; }
  .page > .hero,
  .page > .auth-hero,
  .page > .account-hero,
  .page > .docs-shell,
  .page > .auth-shell,
  .page > .account-shell { padding-left:16px; padding-right:16px; }
  .auth-card, .auth-side, .settings-card { padding:16px; }
  .settings-kv { grid-template-columns:1fr; }
  .signal-strip, .metric-grid { grid-template-columns:1fr; }
  .signal-strip div { border-right:0; border-bottom:1px solid var(--line); padding-right:0; }
  .signal-strip div:last-child { border-bottom:0; }
  .primary-button, .secondary-button, .ghost-button { width:100%; }
  .button-row form { width:100%; }
  .account-table { min-width:760px; }
  .reason-grid div { grid-template-columns:1fr; gap:8px; }
  .resolved-proof-grid { grid-template-columns:1fr; }
  .resolved-proof-card { min-height:0; }
  .evidence-summary-grid { grid-template-columns:1fr; }
  .try-form-row { grid-template-columns:1fr; }
  .try-action-row { grid-template-columns:1fr; }
  .try-result-grid { grid-template-columns:1fr; }
  .split { gap:20px; }
  .code-sample { font-size:11px; padding:14px; }
}

@media (max-width: 380px) {
  h1 { font-size:31px; }
  h2 { font-size:22px; }
  .label { font-size:11px; letter-spacing:.1em; }
  .hero-links { gap:12px; }
  .hero-test-grid { grid-template-columns:1fr; }
  .hero-test-result dl { grid-template-columns:1fr; }
}
