/* Blockpin site layer, brand "Benchmark": pale mint survey paper, ink-outlined white cards, forest green and safety yellow,
   Gabarito headings, Atkinson Hyperlegible text and mono. Load after ledger.css. Nav and footer (.cs-*) are safe on any page;
   the theme only applies to <body class="sa">. No external requests, no script. */
:root {
  --a-orange: #FFD23F; --a-orange-deep: #E8B800; --a-cream: #EEF4F0; --a-paper: #FFFFFF; --a-ink: #10231A; --a-ink-2: #3F5248;
  --a-line: #C9DACF; --a-ok: #1f7a45; --a-ok-bg: #d9f0dd; --a-warn: #a35a00; --a-warn-bg: #ffe3b8; --a-bad: #b3261e; --a-bad-bg: #ffd9d2;
  --a-unk: #5d584c; --a-unk-bg: #ebe4d3;
  --a-sans: 'Atkinson Hyperlegible Next', system-ui, sans-serif; --a-mono: 'Atkinson Hyperlegible Mono', ui-monospace, Menlo, monospace; --a-display: 'Gabarito', 'Atkinson Hyperlegible Next', system-ui, sans-serif; --a-green: #1C6B43;
}

/* ---------- shared nav ---------- */
.cs-nav { background: var(--a-orange); color: var(--a-ink); font: 500 16px/1.3 var(--a-sans); display: block; padding: 0; margin: 0; gap: 0; }
.cs-in { max-width: 1120px; margin: 0 auto; padding: 0 32px; }
.cs-nav .cs-in { display: flex; align-items: center; gap: 24px; min-height: 76px; flex-wrap: wrap; }
.cs-brand { display: flex; align-items: center; gap: 10px; font: 800 21px/1 var(--a-sans); letter-spacing: -.02em; text-decoration: none; color: var(--a-ink); }
.cs-brand svg { width: 34px; height: 30px; flex: none; }
.cs-nav ul { display: flex; align-items: center; gap: 22px; list-style: none; margin: 0 0 0 auto; padding: 0; max-width: none; }
.cs-nav li { margin: 0; }
.cs-nav ul a { text-decoration: none; color: var(--a-ink); }
.cs-nav ul a:hover, .cs-nav ul a[aria-current="page"] { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 5px; }
.cs-nav .cs-hire { background: var(--a-ink); color: var(--a-cream); padding: 10px 18px; border-radius: 999px; font-weight: 600; text-decoration: none !important; white-space: nowrap; }
.cs-nav a:focus-visible, .cs-foot a:focus-visible { outline: 3px solid var(--a-ink); outline-offset: 3px; border-radius: 8px; }

/* ---------- shared footer ---------- */
.cs-foot { background: var(--a-ink); color: var(--a-cream); padding: 40px 0 48px; margin-top: 72px; font: 400 15.5px/1.55 var(--a-sans); }
.cs-foot .cs-in { display: grid; gap: 14px; }
.cs-foot p { margin: 0; max-width: 66ch; color: #d8ccb2; overflow-wrap: break-word; }
.cs-foot a { color: var(--a-cream); }
.cs-foot ul { display: flex; flex-wrap: wrap; gap: 8px 22px; list-style: none; padding: 0; margin: 0; font-weight: 600; max-width: none; }
.cs-foot ul a { text-decoration: none; }
.cs-foot ul a:hover { text-decoration: underline; }
.cs-foot .cs-order { color: var(--a-cream); font-weight: 600; font-size: 17px; }
.cs-foot .cs-agents { font: 400 13.5px/1.7 var(--a-mono); color: #b5a988; }
.cs-foot .cs-note { font-size: 14px; color: #b5a988; }

@media (max-width: 760px) {
  .cs-in { padding: 0 16px; }
  .cs-nav .cs-in { min-height: 0; padding-top: 12px; padding-bottom: 10px; gap: 8px 12px; }
  .cs-nav nav, .cs-nav ul { display: contents; }
  .cs-brand { order: 0; }
  .cs-nav li { order: 3; font-size: 15.5px; }
  .cs-nav li.cs-hire-li { order: 1; margin-left: auto; }
  .cs-nav .cs-in::after { content: ""; order: 2; flex-basis: 100%; height: 0; }
  .cs-nav .cs-in { gap: 6px 18px; }
  .cs-nav .cs-hire { padding: 8px 16px; font-size: 15px; }
  .cs-brand { min-height: 38px; }
  .cs-foot { margin-top: 56px; }
}

/* ---------- theme A for builder pages ---------- */
html:has(body.sa) { background: var(--a-cream); }
body.sa { background: var(--a-cream); color: var(--a-ink); font: 400 17px/1.55 var(--a-sans); }
body.sa .cs-hero { background: var(--a-orange); padding: 30px 0 44px; display: block; }
body.sa .cs-hero .cs-in { display: grid; gap: 10px; }
body.sa .cs-hero h1 { font: 800 clamp(34px, 5.4vw, 54px)/1.03 var(--a-sans); letter-spacing: -.035em; margin: 0; max-width: 22ch; text-wrap: balance; overflow-wrap: break-word; }
body.sa .cs-hero .byline { font: 400 14px/1.5 var(--a-mono); color: var(--a-ink); max-width: 90ch; }
body.sa .cs-hero .cs-intro { font-size: 19px; line-height: 1.45; max-width: 60ch; margin: 4px 0 0; }
.cs-tag { justify-self: start; display: inline-block; font: 600 12px/1 var(--a-mono); letter-spacing: .08em; text-transform: uppercase; border: 2px solid var(--a-ink); border-radius: 999px; padding: 5px 10px; background: var(--a-cream); }
body.sa .wrap { max-width: 1120px; padding-top: 28px; padding-bottom: 0; gap: 18px; }
body.sa .wrap.narrow { max-width: 920px; }
body.sa .wrap > header { display: none; }
body.sa .panel { background: var(--a-paper); border: 2px solid var(--a-ink); border-radius: 20px; box-shadow: none; padding: 24px 26px; }
body.sa h2 { font: 800 28px/1.12 var(--a-sans); letter-spacing: -.025em; }
body.sa h3 { font: 700 20px/1.2 var(--a-sans); letter-spacing: -.015em; }
body.sa .lead { font-size: 19px; line-height: 1.5; }
body.sa .small { color: var(--a-ink-2); }
body.sa p, body.sa li { overflow-wrap: break-word; }
body.sa code { background: rgba(17,17,14,.06); }
body.sa .kv dt { color: var(--a-ink-2); }
body.sa th { color: var(--a-ink-2); }
body.sa th, body.sa td { border-top-color: var(--a-line); }
body.sa .tile { background: var(--a-cream); border: 1.5px solid var(--a-line); }
body.sa .holds { color: var(--a-ok); } body.sa .partly { color: var(--a-warn); } body.sa .no { color: var(--a-bad); }
body.sa b.k.holds, body.sa b.k.partly, body.sa b.k.no { display: inline-block; white-space: nowrap; border-radius: 999px; padding: 3px 10px; font: 700 12px/1.3 var(--a-mono); letter-spacing: .04em; text-transform: uppercase; }
body.sa b.k.holds { background: var(--a-ok-bg); } body.sa b.k.partly { background: var(--a-warn-bg); } body.sa b.k.no { background: var(--a-bad-bg); }
body.sa .v b.k { justify-self: start; }
body.sa details { border-top: 1.5px dashed var(--a-line); padding-top: 10px; }
body.sa summary { font-weight: 700; }
body.sa .wrap > .cs-agentnote { font-size: 14px; color: var(--a-ink-2); }

/* ---------- components ---------- */
.badge { display: inline-block; font: 700 13.5px/1.3 var(--a-sans); padding: 4px 11px; border-radius: 999px; white-space: nowrap; }
.badge.ok { background: var(--a-ok-bg); color: var(--a-ok); }
.badge.warn { background: var(--a-warn-bg); color: var(--a-warn); }
.badge.bad { background: var(--a-bad-bg); color: var(--a-bad); }
.badge.unk { background: var(--a-unk-bg); color: var(--a-unk); }
.badge.ink { background: var(--a-ink); color: var(--a-cream); }

.stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.stat { background: var(--a-paper); border: 2px solid var(--a-ink); border-radius: 20px; padding: 18px 20px; display: grid; gap: 6px; align-content: start; min-width: 0; }
.stat b { font: 500 34px/1.05 var(--a-mono); letter-spacing: -.03em; overflow-wrap: break-word; }
.stat b small { font-size: 18px; letter-spacing: 0; }
.stat span { color: var(--a-ink-2); font-size: 15px; line-height: 1.4; }
.stat.dark { background: var(--a-ink); color: var(--a-cream); }
.stat.dark span { color: #d8ccb2; }
.stats.lift { margin-top: -54px; position: relative; }

.sec { display: grid; gap: 16px; padding-top: 24px; min-width: 0; }
.sec-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px 16px; flex-wrap: wrap; }
.sec-head h2 { margin: 0; }
.sec-head p { color: var(--a-ink-2); margin: 0; max-width: 60ch; }
.grid3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }

.card { background: var(--a-paper); border: 1.5px solid var(--a-line); border-radius: 20px; padding: 20px 22px; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.card.ol { border: 2px solid var(--a-ink); }
.card .top { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 14.5px; color: var(--a-ink-2); }
.card h3 { margin: 0; font: 700 20px/1.22 var(--a-sans); letter-spacing: -.015em; overflow-wrap: break-word; }
.card h3 a { text-decoration: none; }
.card h3 a:hover { text-decoration: underline; }
.card p { margin: 0; font-size: 16px; line-height: 1.45; color: var(--a-ink-2); max-width: none; }
.card .foot { margin-top: auto; padding-top: 12px; border-top: 1.5px dashed var(--a-line); display: flex; justify-content: space-between; align-items: center; gap: 6px 12px; flex-wrap: wrap; }
.card .foot .links { display: flex; gap: 14px; flex-wrap: wrap; font-size: 15px; font-weight: 600; }
.amt { font: 500 16px var(--a-mono); white-space: nowrap; }
.card.hl { background: var(--a-orange); border-color: var(--a-ink); }
.card.hl p, .card.hl .top, .card.hl li { color: var(--a-ink); }
.card ul { margin: 0; padding-left: 20px; display: grid; gap: 4px; font-size: 15.5px; color: var(--a-ink-2); }
.card.hl ul { color: var(--a-ink); }
.card .lbl { font: 600 11.5px var(--a-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--a-ink-2); }
.card.hl .lbl { color: var(--a-ink); }

.price-card .cost { font: 500 30px/1 var(--a-mono); letter-spacing: -.02em; margin-top: 4px; overflow-wrap: break-word; }
.price-card .cost small { display: block; margin-top: 8px; font: 400 14.5px/1.4 var(--a-sans); color: var(--a-ink-2); letter-spacing: 0; }
.card.hl .cost small { color: var(--a-ink); }
.price-card .rep { font: 400 14.5px/1.4 var(--a-sans); color: var(--a-ink-2); }
.card.hl .rep { color: var(--a-ink); }

.steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; counter-reset: st; border: 2px solid var(--a-ink); border-radius: 20px; overflow: hidden; background: var(--a-paper); padding: 0; list-style: none; margin: 0; max-width: none; }
.steps li { padding: 20px 22px; counter-increment: st; display: grid; gap: 4px; align-content: start; border-left: 2px solid var(--a-ink); min-width: 0; }
.steps li:first-child { border-left: 0; }
.steps li::before { content: counter(st); font: 500 15px/1 var(--a-mono); width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: var(--a-orange); border: 2px solid var(--a-ink); margin-bottom: 6px; }
.steps b { font-size: 17.5px; line-height: 1.25; }
.steps span { color: var(--a-ink-2); font-size: 15px; line-height: 1.45; }

.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 22px; border-radius: 999px; font: 700 16.5px var(--a-sans); text-decoration: none; border: 2px solid var(--a-ink); color: var(--a-ink); background: transparent; }
.btn.primary { background: var(--a-ink); color: var(--a-cream); }
.btns { display: flex; gap: 12px; flex-wrap: wrap; }

.cta { background: var(--a-orange); border: 2px solid var(--a-ink); border-radius: 20px; padding: 24px 26px; display: flex; align-items: center; justify-content: space-between; gap: 14px 24px; flex-wrap: wrap; }
.cta h2 { margin: 0; font-size: 26px; }
.cta p { margin: 4px 0 0; max-width: 52ch; }

/* report template */
.verdict { background: var(--a-ink); color: var(--a-cream); border-radius: 22px; padding: 26px 28px; display: grid; gap: 18px; }
.verdict .vh { display: flex; gap: 10px 16px; align-items: center; flex-wrap: wrap; }
.verdict .say { font: 700 clamp(22px, 3vw, 28px)/1.25 var(--a-sans); letter-spacing: -.02em; margin: 0; max-width: 46ch; }
.verdict .nums { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.verdict .nums div { border: 1.5px solid #4a463c; border-radius: 14px; padding: 12px 14px; display: grid; gap: 4px; min-width: 0; }
.verdict .nums b { font: 500 26px/1.1 var(--a-mono); letter-spacing: -.02em; color: var(--a-cream); overflow-wrap: break-word; }
.verdict .nums span { font-size: 14.5px; color: #d8ccb2; line-height: 1.35; }
.verdict .paid { display: flex; gap: 6px 16px; flex-wrap: wrap; align-items: center; border-top: 1.5px dashed #4a463c; padding-top: 14px; font-size: 15.5px; color: #d8ccb2; }
.verdict .paid b { color: var(--a-cream); font: 500 16px var(--a-mono); }
.verdict a { color: var(--a-cream); font-weight: 600; }
.bar { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 5px; width: 100%; max-width: 360px; }
.bar i { height: 12px; border-radius: 4px; background: var(--a-unk-bg); }
.bar i.ok { background: #3fbf6f; } .bar i.partly { background: #f2a33a; } .bar i.bad { background: #e2483d; } .bar i.unk { background: #9b9482; }
.verdict .bar { max-width: 420px; }
.verdict .bar i { height: 14px; }

.claims { display: grid; gap: 14px; counter-reset: cl; }
.claim { background: var(--a-paper); border: 1.5px solid var(--a-line); border-radius: 18px; padding: 18px 20px; display: grid; gap: 8px; min-width: 0; }
.claim.c-bad { border-color: var(--a-bad); } .claim.c-partly { border-color: #e7b46a; }
.claim .ch { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px 14px; flex-wrap: wrap; }
.claim .n { font: 500 13px var(--a-mono); color: var(--a-ink-2); }
.claim h3 { font: 700 18.5px/1.3 var(--a-sans); margin: 0; letter-spacing: -.01em; overflow-wrap: break-word; }
.claim p { margin: 0; color: var(--a-ink-2); font-size: 16px; line-height: 1.5; max-width: 80ch; }
.claim details { border-top: 1.5px dashed var(--a-line); padding-top: 8px; margin-top: 2px; }
.claim details summary { font-size: 14.5px; }
.claim details > div { padding-top: 8px; display: grid; gap: 6px; font-size: 14.5px; }

.fold { background: var(--a-paper); border: 1.5px solid var(--a-line) !important; border-radius: 18px; padding: 0 !important; overflow: hidden; }
.fold > summary { padding: 16px 20px; font: 700 18px/1.3 var(--a-sans); cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.fold > summary::-webkit-details-marker { display: none; }
.fold > summary::after { content: "+"; font: 500 22px/1 var(--a-mono); }
.fold[open] > summary::after { content: "–"; }
.fold > summary small { display: block; font: 400 14px/1.4 var(--a-sans); color: var(--a-ink-2); }
.fold > .in { padding: 4px 20px 20px; display: grid; gap: 12px; min-width: 0; }
.fold .tw { overflow-x: auto; }
.pinned { font: 400 13px/1.6 var(--a-mono); color: var(--a-ink-2); overflow-wrap: anywhere; }

.list-plain { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; max-width: none; }
.list-plain > li { background: var(--a-paper); border: 1.5px solid var(--a-line); border-radius: 16px; padding: 14px 18px; }

@media (max-width: 900px) {
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  body.sa { font-size: 16.5px; }
  body.sa .cs-hero { padding: 22px 0 34px; }
  body.sa .cs-hero h1 { font-size: 36px; }
  body.sa .cs-hero .cs-intro { font-size: 17.5px; }
  body.sa .cs-hero .byline { font-size: 13px; }
  body.sa .wrap { padding-top: 20px; }
  body.sa .panel { padding: 18px 16px; border-radius: 18px; }
  body.sa h2 { font-size: 25px; }
  .stats, .grid3, .grid2 { grid-template-columns: 1fr; }
  .stats { gap: 10px; }
  .stats.lift { margin-top: -40px; }
  .stat { grid-template-columns: auto 1fr; align-items: center; gap: 14px; padding: 14px 16px; }
  .stat b { font-size: 26px; }
  .stat span { font-size: 14.5px; }
  .card { padding: 18px; }
  .steps { grid-template-columns: 1fr; }
  .steps li { border-left: 0; border-top: 2px solid var(--a-ink); }
  .steps li:first-child { border-top: 0; }
  .verdict { padding: 20px 18px; }
  .verdict .nums { grid-template-columns: 1fr; }
  .verdict .nums div { grid-template-columns: auto 1fr; align-items: baseline; gap: 10px; }
  .verdict .nums b { font-size: 22px; }
  .cta { padding: 20px 18px; }
  .cta .btn { flex: 1 1 auto; }
  .claim { padding: 16px; }
  .fold > summary { padding: 14px 16px; }
  .fold > .in { padding: 2px 16px 16px; }
}

/* alignment: hero text lines up with the reading column; short linked hashes in tables stay whole */
body.sa .wrap { padding-left: 32px; padding-right: 32px; }
.cs-hero .cs-in.narrow { max-width: 920px; }
body.sa td a code { word-break: normal; overflow-wrap: break-word; }
@media (max-width: 760px) { body.sa .wrap { padding-left: 16px; padding-right: 16px; } }
.cs-nav + .wrap { padding-top: 28px; }
.claims, .claim, .fold > .in, .verdict { grid-template-columns: minmax(0, 1fr); }
.claim p, .claim h3, .fold li, .fold p { overflow-wrap: anywhere; }
.claim details, .claim details > div { min-width: 0; grid-template-columns: minmax(0, 1fr); }

/* ---------- copyable hashes ----------
   Outside links (Etherscan, X) do not open from claus.si/c/ pages, so every tx link also shows the full hash
   as selectable text: one click selects all of it. Wraps anywhere so it never widens a card or table at 390 px. */
code.tx { font: 400 12.5px/1.5 var(--a-mono); background: rgba(17,17,14,.06); border-radius: 6px; padding: 1px 6px;
  user-select: all; -webkit-user-select: all; cursor: text; overflow-wrap: anywhere; word-break: break-all; color: var(--a-ink); }
td code.tx, .txline code.tx { display: inline-block; max-width: 100%; margin-top: 3px; }
.verdict code.tx, .stat.dark code.tx { background: rgba(255,242,216,.12); color: var(--a-cream); }
.txline { margin: 0; display: grid; gap: 2px; font-size: 13.5px; color: var(--a-ink-2); min-width: 0; }
.txline .lbl { font: 600 11.5px var(--a-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--a-ink-2); }

/* ---------- on-chain reviews ---------- */
.review { background: var(--a-paper); border: 2px solid var(--a-ink); border-radius: 20px; padding: 18px 22px; display: grid; gap: 8px; min-width: 0; }
.review > h3, .review > h2 { margin: 0; font: 700 21px/1.25 var(--a-sans); letter-spacing: -.015em; }
.review > p { margin: 0; font-size: 15.5px; line-height: 1.45; color: var(--a-ink-2); }
.review ul { list-style: none; margin: 4px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; max-width: none; }
.review li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 14px; align-items: start; border-top: 1.5px dashed var(--a-line); padding-top: 12px; min-width: 0; font-size: 15px; line-height: 1.45; color: var(--a-ink-2); }
.review li b { color: var(--a-ink); }
.review li > div { display: grid; gap: 6px; min-width: 0; }
.review li p { margin: 0; }
.review .score { width: 52px; height: 52px; border-radius: 50%; background: var(--a-ok-bg); border: 2px solid var(--a-ink);
  display: grid; place-items: center; font: 500 18px/1 var(--a-mono); color: var(--a-ok); }
.review .links { margin: 0; display: flex; gap: 6px 14px; flex-wrap: wrap; font-size: 15px; font-weight: 600; }
@media (max-width: 900px) { .review ul { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 760px) { .review { padding: 16px; } .review li { grid-template-columns: minmax(0, 1fr); gap: 8px; } .review .score { width: 44px; height: 44px; font-size: 16px; } }

/* ---------- Benchmark brand overrides (v4) ---------- */
.cs-nav { background: var(--a-cream); border-bottom: 1.5px solid var(--a-line); }
.cs-brand { font-family: var(--a-display); }
.cs-brand svg { width: 38px; height: 38px; }
.cs-nav .cs-hire { background: var(--a-green); color: #fff; }
body.sa .cs-hero { background: var(--a-cream) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='520' height='300' viewBox='0 0 520 300'><g fill='none' stroke='%231C6B43' stroke-opacity='.12' stroke-width='1.4'><path d='M360 30c80 8 140 60 132 130s-80 122-168 114-148-62-140-130 88-122 176-114z'/><path d='M365 70c55 6 98 44 92 95s-56 86-118 80-106-44-100-94 64-86 126-81z'/><path d='M370 108c33 4 58 28 55 58s-34 52-72 48-62-27-59-56 38-53 76-50z'/></g></svg>") no-repeat right 0 top 0; }
body.sa h1, body.sa h2, body.sa h3 { font-family: var(--a-display); }
.card.hl, .cta { background: var(--a-orange); }
.btn.primary { background: var(--a-green); color: #fff; }