/* Tally / Disclosure Desk. Plain CSS, no build step, no webfonts. */

:root{
  --bg:#0a0c0f;
  --panel:#0e1116;
  --panel2:#12161d;
  --line:#1b2029;
  --line2:#29313c;
  --fg:#e9edf2;
  --mut:#96a0ac;
  --dim:#5e6772;
  --ok:#5fd48a;
  --gap:#e0a13f;
  --bad:#ff7361;
  --mono:ui-monospace,"JetBrains Mono","SF Mono",SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Inter,Helvetica,Arial,sans-serif;
  color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}

body{
  margin:0;
  background:var(--bg);
  color:var(--fg);
  font:400 15.5px/1.6 var(--sans);
  -webkit-font-smoothing:antialiased;
}

.wrap{max-width:1120px;margin:0 auto;padding:0 24px}

a{color:var(--fg);text-decoration:underline;text-decoration-color:var(--line2);text-underline-offset:3px}
a:hover{text-decoration-color:var(--ok)}
:focus-visible{outline:2px solid var(--ok);outline-offset:2px}

h1,h2,h3{margin:0;font-weight:600;letter-spacing:-.02em}
h1{font-size:clamp(30px,4.4vw,46px);line-height:1.06;max-width:20ch}
h2{font-size:clamp(20px,2.4vw,25px);line-height:1.2}
h3{font-size:15px;letter-spacing:0}
p{margin:12px 0 0;color:var(--mut);max-width:70ch}
p.wide{max-width:82ch}
p.sweep-hd,p.key,p.out,.pay .ph{max-width:none}
strong{color:var(--fg);font-weight:600}
code,kbd{font-family:var(--mono);font-size:.9em}

.mono{font-family:var(--mono)}
.ok{color:var(--ok)}
.warn{color:var(--gap)}
.bad{color:var(--bad)}
.dim{color:var(--dim)}

/* ---------- masthead ---------- */

.top{border-bottom:1px solid var(--line);position:relative}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:16px;padding-bottom:16px;flex-wrap:wrap}
.brand{display:inline-flex;align-items:baseline;gap:11px;text-decoration:none;font-family:var(--mono)}
.brand .bn{font-weight:700;font-size:15px;letter-spacing:.2em;text-transform:uppercase}
.brand .bs{font-size:11.5px;color:var(--dim);letter-spacing:.09em}
.topnav{display:flex;gap:22px;font:500 12px/1 var(--mono);letter-spacing:.09em;text-transform:uppercase}
.topnav a{color:var(--mut);text-decoration:none}
.topnav a:hover,.topnav a[aria-current=page]{color:var(--ok)}

/* ---------- hero ---------- */

.hero{padding:56px 0 8px}
.kick{font:600 11px/1 var(--mono);letter-spacing:.26em;text-transform:uppercase;color:var(--ok);margin:0 0 20px}
.lede{font-size:18px;line-height:1.55;color:var(--mut);max-width:66ch;margin:20px 0 0}
.lede b{color:var(--fg);font-weight:600}

.facts{display:flex;flex-wrap:wrap;gap:0;margin:32px 0 0;border:1px solid var(--line);background:var(--panel)}
.facts div{padding:14px 20px 15px;border-right:1px solid var(--line);flex:1 1 150px}
.facts div:last-child{border-right:0}
.facts .n{font:700 26px/1 var(--mono);letter-spacing:-.03em}
.facts .l{display:block;margin-top:7px;font:500 10.5px/1.4 var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--dim)}

/* ---------- signature: the sweep strip ---------- */

.sweep{margin:38px 0 0;border:1px solid var(--line);background:var(--panel);padding:22px 22px 16px}
.sweep-hd{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;font:500 10.5px/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin:0 0 16px}
.bars{display:flex;align-items:flex-end;gap:3px;height:96px}
.bars b{
  display:block;flex:1 1 0;min-width:3px;height:100%;
  background:var(--ok);opacity:.82;border-radius:1px 1px 0 0;
}
.bars b.none{
  background:linear-gradient(to top,var(--gap) 0,var(--gap) 14px,transparent 14px);
  box-shadow:inset 0 0 0 1px rgba(224,161,63,.42);
  opacity:.9;
}
.bars b:hover{opacity:1;outline:1px solid var(--fg)}
.axis{display:flex;justify-content:space-between;border-top:1px solid var(--line2);margin-top:9px;padding-top:8px;font:500 10.5px/1.4 var(--mono);letter-spacing:.1em;color:var(--dim)}
.key{display:flex;flex-wrap:wrap;gap:20px;margin-top:14px;font:12px/1.5 var(--mono);color:var(--mut)}
.key i{display:inline-block;width:9px;height:9px;margin-right:7px;vertical-align:baseline}
.key i.a{background:var(--ok)}
.key i.b{background:transparent;box-shadow:inset 0 0 0 1px var(--gap);border-bottom:3px solid var(--gap)}

/* ---------- sections with a numbered rail ---------- */

.sec{border-top:1px solid var(--line);padding:46px 0 50px}
.sec-grid{display:grid;grid-template-columns:150px minmax(0,1fr);gap:0 34px}
.rail{position:sticky;top:20px;align-self:start;font:500 10.5px/1.7 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.rail b{display:block;color:var(--ok);font-weight:600}

/* ---------- data blocks ---------- */

.names{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(228px,1fr));
  gap:0;border:1px solid var(--line);border-bottom:0;margin-top:22px;
  font:12.5px/1.5 var(--mono);
}
.names span{
  padding:9px 12px;border-bottom:1px solid var(--line);
  display:flex;gap:9px;align-items:baseline;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.names span::before{content:"404";color:var(--gap);font-size:10px;letter-spacing:.06em;flex:none}

.card{border:1px solid var(--line);background:var(--panel);padding:20px 22px 22px;margin-top:18px}
.card h3{font-family:var(--mono);font-size:14px;letter-spacing:-.01em}
.card .tag{float:right;font:600 10px/1.9 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--bad)}
.card .tag.p{color:var(--gap)}
.card p{margin-top:10px;font-size:14.5px}

.cmd{
  display:block;margin-top:14px;background:#070a0d;border:1px solid var(--line2);
  padding:12px 13px;font:12.5px/1.7 var(--mono);color:var(--ok);
  white-space:pre-wrap;word-break:break-all;overflow-wrap:anywhere;
}
.cmd .p{color:var(--dim)}
.out{margin-top:8px;font:12px/1.6 var(--mono);color:var(--mut);white-space:pre-wrap;word-break:break-word}
.out b{color:var(--bad);font-weight:600}
.out b.g{color:var(--ok)}

.rows{margin-top:22px;border-top:1px solid var(--line)}
.row{display:grid;grid-template-columns:180px minmax(0,1fr);gap:4px 26px;padding:18px 0;border-bottom:1px solid var(--line);font:13px/1.7 var(--mono)}
.row .pj{color:var(--fg);font-weight:700;font-size:13.5px}
.row .pj small{display:block;margin-top:5px;font-weight:400;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.row .f{color:var(--mut)}
.row .f b{color:var(--fg);font-weight:600}
.row .k{display:inline-block;min-width:88px;color:var(--dim)}

.csv{overflow-x:auto;margin-top:20px;border:1px solid var(--line);background:var(--panel)}
.csv pre{margin:0;padding:16px 18px;font:12.5px/1.9 var(--mono);color:var(--mut)}
.csv pre b{color:var(--fg);font-weight:600}

.bul{list-style:none;margin:20px 0 0;padding:0;border-top:1px solid var(--line)}
.bul li{padding:12px 0 12px 20px;border-bottom:1px solid var(--line);position:relative;color:var(--mut);font-size:14.5px}
.bul li::before{content:"";position:absolute;left:0;top:19px;width:8px;height:1px;background:var(--ok)}
.bul li b{color:var(--fg)}

/* ---------- payment ---------- */

.pay{border:1px solid var(--line2);background:var(--panel);margin-top:22px}
.pay .ph{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:13px 18px;border-bottom:1px solid var(--line);font:600 10.5px/1.5 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.pay .ph em{font-style:normal;color:var(--ok)}
.pr{display:grid;grid-template-columns:112px minmax(0,1fr) auto;align-items:center;gap:12px;padding:13px 18px;border-bottom:1px solid var(--line)}
.pr:last-of-type{border-bottom:0}
.pr .k{font:600 11px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mut)}
.pr .v{font:13px/1.5 var(--mono);color:var(--fg);word-break:break-all;overflow-wrap:anywhere;-webkit-user-select:all;user-select:all}
.pr .v a{text-decoration-color:var(--line2)}
.cp{
  flex:none;background:transparent;color:var(--mut);border:1px solid var(--line2);
  font:600 10.5px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;
  padding:9px 12px;cursor:pointer;
}
.cp:hover{color:var(--fg);border-color:var(--fg)}
.cp[data-done]{color:var(--ok);border-color:var(--ok)}
.paynote{padding:14px 18px;border-top:1px solid var(--line);background:var(--panel2)}
.paynote p{margin:0;font-size:14px;max-width:78ch}

.btn{
  display:inline-block;background:var(--ok);color:#08120c;
  font:700 13px/1 var(--mono);letter-spacing:.06em;
  padding:14px 20px;text-decoration:none;border:1px solid var(--ok);
}
.btn:hover{background:#7ee0a2;border-color:#7ee0a2;text-decoration:none}
.btn.alt{background:transparent;color:var(--fg);border-color:var(--line2)}
.btn.alt:hover{background:transparent;border-color:var(--fg)}
.btnrow{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:26px}
.btnrow .px{font:600 12px/1.5 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}

/* ---------- form ---------- */

.inbox{margin-top:20px;max-width:520px}
.fr{margin-bottom:14px}
.inbox label{display:block;font:600 10.5px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--mut);margin-bottom:8px}
.inbox input,.inbox textarea{
  width:100%;display:block;background:#070a0d;border:1px solid var(--line2);color:var(--fg);
  font:14px/1.55 var(--mono);padding:12px 13px;border-radius:0;
}
.inbox textarea{min-height:104px;resize:vertical}
.inbox input:focus,.inbox textarea:focus{outline:none;border-color:var(--ok)}
.inbox ::placeholder{color:#4b535d;opacity:1}
.inbox button[type=submit]{
  background:var(--fg);color:#0a0c0f;border:1px solid var(--fg);
  font:700 13px/1 var(--mono);letter-spacing:.06em;padding:14px 22px;cursor:pointer;
}
.inbox button[type=submit]:hover{background:#fff;border-color:#fff}
.inbox button[disabled]{opacity:.5;cursor:default}
.thanks{
  margin-top:20px;max-width:520px;border:1px solid var(--ok);background:var(--panel);
  padding:18px 20px;
}
.thanks h3{font-family:var(--mono);color:var(--ok);font-size:13px;letter-spacing:.12em;text-transform:uppercase}
.thanks p{margin-top:10px;font-size:14.5px}
[hidden]{display:none !important}

/* ---------- footer ---------- */

footer{border-top:1px solid var(--line);padding:30px 0 64px;margin-top:8px}
footer .fnav{display:flex;flex-wrap:wrap;gap:20px;font:500 12px/1 var(--mono);letter-spacing:.09em;text-transform:uppercase;margin-bottom:18px}
footer .fnav a{color:var(--mut);text-decoration:none}
footer .fnav a:hover{color:var(--ok)}
footer p{font-size:13px;color:var(--dim);max-width:80ch;margin:0 0 8px}
footer p b{color:var(--mut);font-weight:400}

/* ---------- responsive ---------- */

@media (max-width:820px){
  .sec-grid{grid-template-columns:1fr;gap:14px}
  .rail{position:static}
  .row{grid-template-columns:1fr}
  .bars{height:70px;gap:2px}
}
@media (max-width:560px){
  body{font-size:15px}
  .wrap{padding:0 18px}
  .hero{padding-top:38px}
  .pr{grid-template-columns:1fr;align-items:start;gap:8px}
  .cp{justify-self:start}
  .facts div{flex:1 1 100%;border-right:0;border-bottom:1px solid var(--line)}
  .facts div:last-child{border-bottom:0}
}