/* ZBills — theme tokens for the shared app pages (pad.css reads only these variables). */
@import url("https://fonts.googleapis.com/css2?family=Instrument+Sans:wght@400;500;600&display=swap");

:root{
  --pad-bg:#ffffff;
  --pad-surface:#ffffff;
  --pad-ink:#0a0a0a;
  --pad-ink-dim:#6f6f6f;
  --pad-rule:rgba(10,10,10,.12);
  --pad-accent:#1f7a4d;
  --pad-accent-ink:#ffffff;
  --pad-good:#1f7a4d;
  --pad-bad:#b3583f;
  --pad-font:"Instrument Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
  --pad-font-display:"Instrument Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
  --pad-mono:"SFMono-Regular",ui-monospace,Menlo,Consolas,monospace;
  --pad-radius:0px;
  --pad-max-width:1176px;

  /* site palette, for the header/footer markup below */
  --green:#1f7a4d; --green-deep:#0f3d27; --mint:#a6e9c0; --muted:#8b8b8b; --line:rgba(10,10,10,.12);
}

/* the home page's 14px pixel grid, without its canvas */
html body, html body.pad-body{
  background-color:var(--pad-bg);
  background-image:linear-gradient(#fafafa 1px,transparent 1px),linear-gradient(90deg,#fafafa 1px,transparent 1px);
  background-size:14px 14px;
  font-family:var(--pad-font);
  color:var(--pad-ink);
  -webkit-font-smoothing:antialiased;
}

/* header + footer from _chrome.html */
.masthead{display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:24px; padding:16px clamp(28px,3vw,60px); border-bottom:1px solid var(--line);}
.masthead p{margin:0; font-family:var(--pad-mono); font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; display:flex; flex-wrap:wrap; gap:6px 18px; align-items:center; color:var(--pad-ink);}
.masthead .mh-l{justify-self:start;}
.masthead .mh-r{justify-self:end; justify-content:flex-end;}
.masthead .mh-c{justify-self:center; display:flex;}
.masthead .mh-c img{display:block; width:30px; height:30px;}
.masthead a{color:inherit; text-decoration:none; transition:color .15s;}
.masthead p a:hover{color:var(--green);}
.masthead .mh-chain{color:var(--muted);}
@media(max-width:680px){
  .masthead{grid-template-columns:1fr auto; gap:14px 16px;}
  .masthead .mh-c{order:-1; grid-column:1 / -1; justify-self:center;}
  .masthead .mh-chain{display:none;}
}
.padfoot{margin-top:calc(14px*6); padding:calc(14px*3) clamp(28px,3vw,60px) calc(14px*4); border-top:1px solid var(--line); display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px 24px; font-family:var(--pad-mono); font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted);}
.padfoot a{color:var(--pad-ink); text-decoration:none;}
.padfoot a:hover{color:var(--green);}
.padfoot .pf-links{display:flex; flex-wrap:wrap; gap:6px 18px;}