@font-face { font-family: "Source Sans 3"; font-style: normal; font-display: swap; font-weight: 400; src: url("fonts/source-sans-3-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-style: normal; font-display: swap; font-weight: 600; src: url("fonts/source-sans-3-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-style: normal; font-display: swap; font-weight: 700; src: url("fonts/source-sans-3-latin-700-normal.woff2") format("woff2"); }

:root {
  color-scheme: light;
  --ink: #13213c;
  --muted: #536179;
  --accent: #2459d3;
  --surface: #f4f7fc;
  --line: #d8e0ee;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }

body {
  margin: 0;
  color: var(--ink);
  background: #fff;
  font: 17px/1.65 "Source Sans 3", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

header, main, footer {
  width: min(760px, calc(100% - 40px));
  margin-inline: auto;
}

header { padding: 72px 0 36px; }
main { padding-bottom: 48px; }
footer { padding: 24px 0 48px; color: var(--muted); border-top: 1px solid var(--line); }

.eyebrow {
  margin: 0;
  color: var(--accent);
  font-size: .78rem;
  font-weight: 750;
  letter-spacing: .12em;
  text-transform: uppercase;
}

h1 { margin: .25rem 0 .5rem; font-size: clamp(2.25rem, 8vw, 4.5rem); line-height: 1.03; letter-spacing: -.04em; }
h2 { margin-top: 0; font-size: 1.35rem; }
.lede { max-width: 650px; color: var(--muted); font-size: 1.15rem; }

section {
  margin: 20px 0;
  padding: 24px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
}

section p:last-child, section ol:last-child { margin-bottom: 0; }
code { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
pre { overflow-x: auto; padding: 16px; color: #f7f9ff; background: var(--ink); border-radius: 9px; }
nav { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
a { color: var(--accent); font-weight: 650; }

.brand { display: flex; align-items: center; gap: .75rem; margin-bottom: 2rem; font-weight: 750; letter-spacing: -.01em; }
.brand img { border-radius: .8rem; box-shadow: 0 10px 25px rgb(37 89 211 / .18); }
.trust-map { margin: 20px 0; padding: 24px; border: 1px solid var(--line); border-radius: 14px; }
.trust-map figcaption { margin-bottom: 1rem; }
.trust-map figcaption span { color: var(--muted); font-size: .92rem; }
.trust-grid { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: stretch; gap: .65rem; }
.trust-node { display: flex; min-width: 0; flex-direction: column; justify-content: center; padding: 1rem; border: 1px solid #bfdbfe; border-radius: .75rem; background: #eff6ff; }
.trust-node span { margin-top: .25rem; color: var(--muted); font-size: .82rem; line-height: 1.4; }
.trust-arrow { align-self: center; color: var(--accent); font-size: 1.3rem; }
.tool-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .8rem; }
.tool-card { display: flex; flex-direction: column; padding: 1rem; border: 1px solid var(--line); border-radius: .75rem; background: #fff; text-decoration: none; }
.tool-card span { margin-top: .35rem; color: var(--muted); font-size: .88rem; font-weight: 400; line-height: 1.45; }
.tool-card:hover { border-color: var(--accent); }

.verifier-panel { border-color: #bfdbfe; background: #eff6ff; }
.file-picker { display: grid; gap: .45rem; margin: 1rem 0; font-weight: 700; }
.file-picker input, .file-picker textarea { width: 100%; padding: .8rem; border: 1px solid #94a3b8; border-radius: .6rem; background: #fff; font: inherit; font-weight: 400; }
button { border: 0; border-radius: .6rem; padding: .75rem 1rem; background: #1d4ed8; color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
button:disabled { cursor: wait; opacity: .55; }
.download-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1rem; }
.local-only { margin-top: 1rem; color: #334155; font-size: .9rem; }
.verification-result { border-width: 2px; }
.verification-result.pending { border-color: #93c5fd; }
.verification-result.valid { border-color: #86efac; background: #f0fdf4; }
.verification-result.invalid { border-color: #fca5a5; background: #fef2f2; }
.verification-result dl { display: grid; grid-template-columns: minmax(9rem, 1fr) 3fr; gap: .45rem 1rem; }
.verification-result dt { font-weight: 700; }
.verification-result dd { margin: 0; overflow-wrap: anywhere; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .85rem; }
.verification-result li { margin: .35rem 0; }

@media (max-width: 520px) {
  header { padding-top: 48px; }
  section { padding: 20px; }
  .verification-result dl { grid-template-columns: 1fr; }
  .verification-result dd { margin-bottom: .5rem; }
}

@media (max-width: 760px) {
  .trust-grid, .tool-grid { grid-template-columns: 1fr; }
  .trust-arrow { transform: rotate(90deg); }
}

@media print {
  body { color: #000; background: #fff; }
  section, .trust-map, .trust-node, .tool-card { break-inside: avoid; box-shadow: none; }
}