:root{--paper:#f6f2e8;--paper2:#ece6d6;--white:#fffdf7;--ink:#16191d;--ink2:#4a5058;--lime:#c8e25d;--lime2:#a9c93a;--red:#e0452f;--rule:#16191d;--soft:#d9d2bf;
--mono:'IBM Plex Mono',ui-monospace,Menlo,monospace;--sans:'IBM Plex Sans',system-ui,sans-serif;--disp:'Archivo','Arial Black',system-ui,sans-serif;--w:1200px}
*{box-sizing:border-box;border-radius:0!important}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.65 var(--sans);-webkit-font-smoothing:antialiased;
background-image:linear-gradient(var(--soft) 1px,transparent 1px);background-size:100% 32px;background-attachment:local}
body{background-image:none}
img{max-width:100%;display:block}
a{color:inherit}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.wrap{max-width:var(--w);margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:var(--ink);color:#fff;padding:8px;z-index:99}
h1,h2,h3{font-family:var(--disp);line-height:1.08;letter-spacing:-.01em;margin:0}
h1{font-weight:900;font-size:clamp(32px,6vw,64px)}
h2{font-weight:800;font-size:clamp(24px,3.4vw,36px)}
h3{font-weight:700;font-size:20px}

/* header */
.top{background:var(--paper);position:sticky;top:0;z-index:20}
.top__in{display:flex;align-items:center;gap:24px;min-height:64px;flex-wrap:wrap;padding-top:8px;padding-bottom:8px}
.brand img{height:31px;width:auto}
.mainnav{flex:0 0 100%;order:3;min-width:0;max-width:100%;overflow-x:auto;scrollbar-width:none}
.mainnav ul{list-style:none;margin:0;padding:0;display:flex;gap:4px;white-space:nowrap}
.mainnav a{display:flex;gap:8px;align-items:baseline;text-decoration:none;font:500 13px var(--sans);padding:8px 10px;border-bottom:2px solid transparent}
.mainnav a i{font:500 11px var(--mono);font-style:normal;color:var(--red)}
.mainnav a:hover,.mainnav a[aria-current]{border-color:var(--ink);background:var(--lime)}
.top__about{margin-left:auto;font:600 13px var(--mono);text-decoration:none;border:2px solid var(--ink);padding:6px 12px;background:var(--white)}
.top__about:hover{background:var(--ink);color:var(--paper)}
.tape{height:10px;background:repeating-linear-gradient(90deg,var(--ink) 0 14px,transparent 14px 20px);border-bottom:0;opacity:1}
@media(min-width:1100px){.mainnav{order:3;flex:0 0 100%;overflow:visible}.mainnav ul{flex-wrap:wrap}.top__in{gap:8px 24px}.top__about{margin-left:auto}}

/* hero */
.hero{border-bottom:2px solid var(--ink);background:var(--paper)}
.hero__in{display:grid;gap:40px;padding-top:48px;padding-bottom:64px}
.kicker{font:500 13px var(--mono);text-transform:uppercase;letter-spacing:.12em;color:var(--red);margin:0 0 16px}
.kicker a{text-decoration:none}
.hero h1{max-width:14ch}
.hero__lede{font-size:19px;max-width:52ch;margin:24px 0}
.hero__cta{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-block;background:var(--ink);color:var(--paper);font:600 15px var(--sans);padding:14px 22px;text-decoration:none;border:2px solid var(--ink);box-shadow:4px 4px 0 var(--lime2)}
.btn:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--lime2)}
.btn--ghost{background:transparent;color:var(--ink);box-shadow:none}
.btn--ghost:hover{background:var(--lime);box-shadow:none}
.hero__art{position:relative;min-height:420px;background:var(--paper2);border:2px solid var(--ink);overflow:hidden;
background-image:radial-gradient(var(--soft) 1.5px,transparent 1.6px);background-size:16px 16px}
.hero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.35}
.calc{position:absolute;left:6%;top:9%;width:min(48%,240px);background:var(--ink);padding:12px;box-shadow:8px 8px 0 var(--lime2);transform:rotate(-3deg)}
.calc__lcd{background:var(--lime);color:var(--ink);padding:8px 10px;text-align:right;font-family:var(--mono);margin-bottom:10px;min-height:68px}
.calc__lcd small{display:block;font-size:10px;letter-spacing:.1em;text-align:left}
.calc__lcd span{font-size:30px;font-weight:600;line-height:1.3}
.calc__keys{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.calc__keys i{font:500 15px var(--mono);font-style:normal;background:var(--paper);text-align:center;padding:7px 0;border-bottom:3px solid var(--soft)}
.calc__keys i.op{background:var(--red);color:#fff;border-color:#a9301f}
.rcpt{position:relative;background:var(--white);width:min(54%,270px);margin-left:auto;margin-top:7%;margin-right:5%;padding:22px 18px 28px;border:1px solid var(--ink);font-size:12px;transform:rotate(2.5deg);box-shadow:6px 6px 0 var(--ink);
-webkit-mask:none}
.rcpt::after{content:"";position:absolute;left:-1px;right:-1px;bottom:-9px;height:9px;background:conic-gradient(from -45deg at bottom,transparent 0,transparent 0) ,linear-gradient(135deg,var(--white) 50%,transparent 50%) 0 0/12px 9px,linear-gradient(225deg,var(--white) 50%,transparent 50%) 0 0/12px 9px;background-repeat:repeat-x;border:0}
.rcpt p{margin:0}
.rcpt__h{font-size:16px;font-weight:600;text-align:center;letter-spacing:.2em}
.rcpt__s{text-align:center;color:var(--ink2);margin-bottom:14px!important}
.rcpt__l{list-style:none;margin:0 0 12px;padding:12px 0;border-top:1px dashed var(--ink);border-bottom:1px dashed var(--ink)}
.rcpt__l li{display:flex;align-items:baseline;gap:6px;line-height:2}
.rcpt__l i{flex:1;border-bottom:1px dotted var(--ink2);transform:translateY(-3px)}
.rcpt__l b{font-weight:500}
.rcpt__t{display:flex;justify-content:space-between;font-weight:600;font-size:13px}
.rcpt__bar{height:34px;margin-top:14px!important;background:repeating-linear-gradient(90deg,var(--ink) 0 2px,transparent 2px 4px,var(--ink) 4px 5px,transparent 5px 9px,var(--ink) 9px 12px,transparent 12px 14px)}
.rcpt__note{text-align:center;margin-top:8px!important;color:var(--ink2);font-size:10px;text-transform:uppercase;letter-spacing:.1em}
.ticker{background:var(--lime);border-bottom:2px solid var(--ink)}
.ticker__in{display:flex;flex-wrap:wrap;gap:8px 32px;justify-content:space-between;padding-top:12px;padding-bottom:12px;font-size:13px;text-transform:uppercase;letter-spacing:.1em;font-weight:600}
.ticker__in span::before{content:"+ ";color:var(--red)}
@media(min-width:900px){.hero__in{grid-template-columns:1.05fr 1fr;align-items:center;padding-top:72px;padding-bottom:88px}.hero__art{min-height:520px}.rcpt{margin-top:20%}.calc{left:4%;top:6%}}

/* blocks */
.block{padding-top:72px;padding-bottom:72px}
.block__h{display:grid;gap:8px;margin-bottom:32px;max-width:60ch}
.block__h p{margin:0;color:var(--ink2)}
.cats{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.cat a{display:grid;grid-template-columns:44px 1fr;gap:4px 16px;padding:22px 0;border-bottom:1px solid var(--ink);text-decoration:none;position:relative}
.cat a:hover{background:var(--white)}
.cat__n{font-size:14px;color:var(--red);font-weight:600;grid-row:1}
.cat__img{display:none}
.cat__t{display:block;font:800 clamp(20px,2.4vw,28px)/1.15 var(--disp);margin-bottom:6px}
.cat__d{display:block;color:var(--ink2);font-size:15px;max-width:68ch}
.cat__c{grid-column:2;font-size:12px;text-transform:uppercase;letter-spacing:.08em;margin-top:4px}
.cat a:hover .cat__t{text-decoration:underline;text-decoration-thickness:3px;text-decoration-color:var(--lime2);text-underline-offset:5px}
@media(min-width:900px){.cat a{grid-template-columns:56px 1fr 140px;align-items:center;padding:26px 8px}.cat__c{grid-column:3;text-align:right;margin:0}}

.tapeblock{background:var(--white);border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}
.tapeblock__in{padding-top:64px;padding-bottom:72px}
.tapeblock--rel{border-bottom:0;margin-top:40px}
.lines{list-style:none;margin:0;padding:0;font-family:var(--mono)}
.line a{display:flex;align-items:baseline;gap:12px;padding:14px 8px;text-decoration:none;border-bottom:1px dashed var(--ink2)}
.line a:hover{background:var(--lime)}
.line__n{color:var(--red);font-weight:600;font-size:14px}
.line__t{font:600 17px/1.35 var(--sans);flex:0 1 auto;max-width:70%}
.line__lead{flex:1;border-bottom:2px dotted var(--ink2);transform:translateY(-4px);min-width:16px}
.line__m{font-size:13px;white-space:nowrap;color:var(--ink2)}
.line--pick a{background:var(--paper2);border-bottom:2px solid var(--ink)}
.stamp{display:inline-block;font:600 11px var(--mono);text-transform:uppercase;letter-spacing:.1em;color:var(--red);border:2px solid var(--red);padding:1px 6px;margin-left:8px;transform:rotate(-3deg);vertical-align:2px;white-space:nowrap}
@media(max-width:640px){.line a{flex-wrap:wrap}.line__t{max-width:calc(100% - 40px)}.line__lead{display:none}.line__m{margin-left:36px}}
.lines--big .line__t{max-width:none;flex:1}
.lines--big small{display:block;font:400 15px/1.5 var(--sans);color:var(--ink2);margin-top:6px;font-weight:400}
.lines--big .line a{align-items:flex-start;padding:22px 10px;border-bottom:1px solid var(--ink)}
.lines--big .line__t{font-size:clamp(18px,2vw,22px);font-family:var(--disp);font-weight:800}
.lines--big .line__m{text-align:right}
.lines--big{border-top:2px solid var(--ink)}

.steps{list-style:none;margin:0;padding:0;display:grid;gap:0;border:2px solid var(--ink);background:var(--white)}
.steps li{padding:24px;border-bottom:1px solid var(--ink)}
.steps li:last-child{border-bottom:0}
.steps b{display:inline-block;background:var(--ink);color:var(--lime);padding:2px 8px;font-size:13px;margin-bottom:12px}
.steps h3{margin-bottom:8px}.steps p{margin:0;color:var(--ink2);font-size:15px}
@media(min-width:900px){.steps{grid-template-columns:repeat(4,1fr)}.steps li{border-bottom:0;border-right:1px solid var(--ink)}.steps li:last-child{border-right:0}}

/* category head */
.chead{border-bottom:2px solid var(--ink);background:var(--paper)}
.chead__in{padding-top:28px;padding-bottom:56px}
.crumbs{font-size:12px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:32px;color:var(--ink2)}
.crumbs a{text-decoration:none;border-bottom:1px solid}
.crumbs span{margin:0 6px}
.chead__grid{display:grid;gap:32px}
.chead h1{font-size:clamp(32px,5vw,56px);max-width:18ch}
.chead__d{font-size:19px;max-width:56ch;margin:20px 0}
.chead__meta{display:inline-block;background:var(--ink);color:var(--lime);padding:4px 10px;font-size:13px;margin:0}
.chead__art{position:relative;background:var(--paper2);border:2px solid var(--ink);min-height:200px;overflow:hidden;box-shadow:6px 6px 0 var(--lime2)}
.chead__art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}
.chead__svg{width:100%;height:100%;padding:24px}
@media(min-width:900px){.chead__grid{grid-template-columns:1.4fr 1fr;align-items:center}.chead__art{min-height:280px}}
.othercats{margin-top:64px;padding-top:24px;border-top:2px solid var(--ink)}
.othercats h2{font-size:20px;margin-bottom:12px}
.othercats ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px}
.othercats a{display:block;border:2px solid var(--ink);padding:6px 12px;text-decoration:none;font-size:14px;background:var(--white)}
.othercats a:hover{background:var(--lime)}
.empty{padding:32px;border:2px dashed var(--ink)}

/* article */
.arthead{background:var(--paper);border-bottom:2px solid var(--ink)}
.arthead__in{padding-top:28px;padding-bottom:40px}
.arthead h1{font-size:clamp(30px,4.6vw,54px);max-width:24ch}
.artmeta{display:flex;flex-wrap:wrap;gap:8px 20px;margin:24px 0 0;font-size:13px;color:var(--ink2)}
.badge{background:var(--lime);color:var(--ink);padding:2px 8px;font-weight:600;border:1px solid var(--ink)}
.artgrid{display:grid;gap:32px;padding-top:40px;padding-bottom:24px}
.slip{background:var(--white);border:1px solid var(--ink);padding:20px;position:relative;box-shadow:5px 5px 0 var(--ink)}
.slip__h{margin:0 0 10px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;border-bottom:1px dashed var(--ink);padding-bottom:8px;color:var(--red)}
.slip__b{margin:0;font-size:15px;line-height:1.6}
.slip__f{margin:12px 0 0;border-top:1px dashed var(--ink);padding-top:8px;font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--ink2)}
.sidecats{margin-top:32px}
.sidecats h2{font-size:12px;text-transform:uppercase;letter-spacing:.12em;margin-bottom:8px;font-family:var(--mono);font-weight:600}
.sidecats ul{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.sidecats a{display:block;padding:8px 4px;font-size:14px;text-decoration:none;border-bottom:1px solid var(--soft)}
.sidecats a:hover,.sidecats a[aria-current]{background:var(--lime)}
@media(min-width:960px){.artgrid{grid-template-columns:300px minmax(0,1fr);gap:56px}.artside{order:0}.artside .slip{position:sticky;top:96px}.sidecats{display:none}}
@media(min-width:960px){.artside{position:relative}}
.artmain{min-width:0}
.prose{max-width:72ch;font-size:18px}
.prose p{margin:0 0 1.2em}
.prose h2{margin:2em 0 .6em;padding-top:.6em;border-top:2px solid var(--ink);font-size:clamp(24px,3vw,32px)}
.prose h3{margin:1.6em 0 .5em;font-size:21px}
.prose h3::before{content:"+ ";color:var(--red);font-family:var(--mono)}
.prose a{text-decoration-thickness:2px;text-decoration-color:var(--lime2);text-underline-offset:3px;font-weight:500}
.prose a:hover{background:var(--lime)}
.prose ul,.prose ol{padding-left:0;margin:0 0 1.4em;list-style:none}
.prose li{position:relative;padding:6px 0 6px 28px;border-bottom:1px dashed var(--soft)}
.prose ul>li::before{content:"";position:absolute;left:4px;top:.95em;width:10px;height:10px;background:var(--lime2);border:1px solid var(--ink)}
.prose ol{counter-reset:n}.prose ol>li{counter-increment:n}
.prose ol>li::before{content:counter(n,decimal-leading-zero);position:absolute;left:0;top:.5em;font:600 13px var(--mono);color:var(--red)}
.prose ol>li{padding-left:36px}
.prose blockquote{margin:1.6em 0;padding:18px 22px;background:var(--white);border:2px solid var(--ink);border-left:10px solid var(--lime2);font-size:19px}
.prose blockquote p{margin:0}
.prose table{width:100%;border-collapse:collapse;margin:1.6em 0;font:400 14px/1.45 var(--mono);background:var(--white);border:2px solid var(--ink);display:block;overflow-x:auto;max-width:100%}
.prose thead{background:var(--ink);color:var(--paper)}
.prose th{text-align:left;padding:10px 12px;font-weight:600;text-transform:uppercase;font-size:12px;letter-spacing:.08em;white-space:nowrap}
.prose td{padding:10px 12px;border-bottom:1px dashed var(--ink2);vertical-align:top;min-width:90px}
.prose tbody tr:nth-child(even){background:var(--paper)}
.prose tbody tr:hover{background:var(--lime)}
.prose tbody tr:last-child td{border-bottom:0;font-weight:600;border-top:2px solid var(--ink)}
.prose strong{font-weight:600;background:linear-gradient(transparent 62%,rgba(200,226,93,.6) 62%)}
.prose code{font-family:var(--mono);background:var(--paper2);padding:1px 5px;font-size:.9em}
.prose img{height:auto}
.faq{margin-top:56px;max-width:72ch;border:2px solid var(--ink);background:var(--white)}
.faq h2{padding:16px 22px;background:var(--ink);color:var(--lime);font-size:20px;font-family:var(--mono);text-transform:uppercase;letter-spacing:.1em}
.faq__i{padding:20px 22px;border-bottom:1px dashed var(--ink)}
.faq__i:last-child{border-bottom:0}
.faq__i h3{font-size:18px;margin-bottom:8px}
.faq__i p{margin:0;font-size:16px;color:var(--ink2)}

/* about, 404 */
.about{padding-top:48px;padding-bottom:72px}
.nf{padding-top:64px;padding-bottom:96px;max-width:720px}
.nf .rcpt{position:relative;width:260px;margin:0 0 32px;transform:rotate(-2deg)}
.nf h1{margin-bottom:16px}

/* footer */
.foot{background:var(--ink);color:var(--paper);margin-top:0}
.foot__in{display:grid;gap:40px;padding-top:56px;padding-bottom:56px}
.foot img{filter:invert(1) hue-rotate(180deg);}
.foot p{margin:12px 0 0;font-size:14px;color:#cfc9b8;max-width:42ch}
.foot h2{font:600 12px var(--mono);text-transform:uppercase;letter-spacing:.14em;color:var(--lime);margin-bottom:12px}
.foot ul{list-style:none;padding:0;margin:0}
.foot li a{display:block;padding:5px 0;text-decoration:none;font-size:15px;border-bottom:1px dotted #555}
.foot a:hover{color:var(--lime)}
.foot__rcpt p{margin:0 0 4px;font-size:12px;letter-spacing:.14em;color:#cfc9b8}
.foot__rcpt p:last-child{margin-top:12px}
@media(min-width:900px){.foot__in{grid-template-columns:1.2fr 1.4fr 1fr}}
@media (prefers-reduced-motion:no-preference){.btn,.line a,.cat a{transition:background .15s,transform .15s,box-shadow .15s}}

.hero__in>*,.chead__grid>*,.artgrid>*,.foot__in>*{min-width:0}
html,body{overflow-x:hidden}
@media(max-width:640px){.hero__art{min-height:380px}.calc{width:52%}.rcpt{width:58%;font-size:11px}.top__in{gap:8px 12px}}
