@font-face{font-family:"Mashup Pica"; src:url("/f/MashupPica-Regular.woff2?v=e73805e184") format("woff2"); font-display:swap}
@font-face{font-family:"Mashup Drafting"; src:url("/f/MashupDrafting-Regular.woff2?v=bc64bec730") format("woff2"); font-display:swap}
@font-face{font-family:"Mashup Sterling"; src:url("/f/MashupSterling-Regular.woff2?v=fd05774a22") format("woff2"); font-display:swap}
:root{--bg:#fff; --ink:#111; --dim:#5f5f5f; --line:#d9d9d9; --link:#1d38c0; --accent:#2340d8; --accent2:#ff4a3d}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0; background:var(--bg); color:var(--ink);
  font:18px/1.6 "Mashup Pica","Courier New",monospace}
a{color:var(--link)}
.wrap{max-width:860px; margin:0 auto; padding:clamp(1.5rem,5vw,4rem) 16px 4rem}
h1{font-weight:400; font-size:clamp(2.3rem,9vw,4.2rem); line-height:1.05; margin:0 0 1.6rem}
h2{font-weight:400; font-size:clamp(2.2rem,8vw,3.2rem); line-height:1.1; margin:0 0 .2rem}
h3{font-weight:400; font-size:1.1rem; text-transform:uppercase; letter-spacing:.06em; margin:1.6rem 0 .4rem}
p{margin:0 0 1rem}
ul{margin:0 0 1rem; padding-left:1.3rem}
li{margin:0 0 .5rem}
/* rules: a typed line of underscores in Mashup Pica (Jason 2026-10-24), cut off at the column edge */
.rule{font-family:"Mashup Pica",monospace; white-space:nowrap; overflow:hidden; line-height:1;
  margin:2.4rem 0 2.6rem; user-select:none}
.meta{color:var(--dim); font-size:.9rem; margin:0 0 1.2rem}
.sample{font-size:1.35rem; line-height:1.45; margin:0 0 1rem}
.charset{font-size:1.15rem; line-height:1.6; margin:0 0 1.2rem; padding:.7rem .9rem;
  border:1px solid var(--line); border-radius:6px; overflow-wrap:anywhere}
.charset span{display:block}
.note{color:var(--dim); font-size:.9rem; margin-top:-.6rem}
figure{margin:1.4rem 0}
figure img{display:block; max-width:100%; height:auto}
figure.machine img{width:100%; max-width:520px; margin:0 auto}
figcaption{color:var(--dim); font-size:.9rem; margin-top:.4rem}
.photos{display:grid; grid-template-columns:3fr 2fr; gap:1.2rem; align-items:center}
.photos figure{margin:0}
@media (max-width:560px){ .photos{grid-template-columns:1fr} }
figure.source img{border:1px solid var(--line)}
.dl{display:inline-block; font-size:1.1rem; margin-top:.4rem}
.soon{display:inline-block; border:1px solid var(--ink); padding:.1rem .5rem; font-size:.9rem}
/* each font's section is set in that font; Mashup Pica fills any character it lacks */
.drafting{font-family:"Mashup Drafting","Mashup Pica",monospace}
.sterling{font-family:"Mashup Sterling","Mashup Pica",monospace}
footer{margin-top:3.5rem; text-align:center; font-size:.95rem}