/* Penco palette, same tokens as kevinjoo.com and multitap.trade */
:root{
  --penco-paper:#F4F1EA;
  --penco-paper-raised:#FAF8F3;
  --penco-border:#DED9CE;
  --penco-ink-primary:#1C1C1C;
  --penco-ink-secondary:#5A5A5A;
  --penco-ink-muted:#8C8C8C;
  --penco-aqua:#1F7F86;
  --penco-teal-cover:#1E6E73;
  --radius:6px;
  --space-xs:0.5rem;
  --space-sm:1rem;
  --space-md:1.5rem;
  --space-lg:2rem;
  --space-xl:3rem;
}
*{margin:0;padding:0;box-sizing:border-box}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  background-color:var(--penco-paper);
  color:var(--penco-ink-primary);
  line-height:1.6;
  padding:var(--space-md);
}
.container{max-width:800px;margin:0 auto}

header{
  margin-bottom:var(--space-md);
  padding-bottom:var(--space-sm);
  border-bottom:1px solid var(--penco-border);
  font-weight:500;
}
header a{color:var(--penco-ink-primary)}
header a:hover{color:var(--penco-aqua);text-decoration:none}

h1{font-size:2rem;margin-bottom:var(--space-md);font-weight:600}
h2{font-size:1.25rem;margin-bottom:var(--space-sm);margin-top:var(--space-lg);font-weight:600}
p{margin-bottom:var(--space-sm)}
ul{margin:0 0 var(--space-sm) 1.25rem}
li{margin-bottom:var(--space-xs)}

a{color:var(--penco-teal-cover);text-decoration:none}
a:hover{text-decoration:underline}
/* grow the tap target on very short links without shifting the line */
p a{padding:.3em .4em;margin:-.3em -.4em}
a:focus-visible{outline:2px solid var(--penco-aqua);outline-offset:2px;border-radius:2px}

footer{
  margin-top:var(--space-xl);
  padding-top:var(--space-sm);
  border-top:1px solid var(--penco-border);
  color:var(--penco-ink-secondary);
  font-size:0.875rem;
}
footer a{color:var(--penco-ink-secondary);text-decoration:underline}
footer a:hover{color:var(--penco-teal-cover)}
footer p{margin-bottom:var(--space-xs)}
