:root{--tomato-600:#d92a1c;--tomato-50:#fdecea;--ink-900:#1b1413;--pen-600:#2a45c8;--color-bg:#fff;--color-surface:#f5f4f4;--color-line:#e7e3e2;--color-text:var(--ink-900);--color-text-2:#463c3a;--color-text-3:#716663;--color-accent:var(--tomato-600);--color-accent-soft:var(--tomato-50);--color-mark:var(--pen-600);--color-btn:var(--tomato-600);--color-on-btn:#fff;--font-display:"Young Serif",Georgia,serif;--font-text:"Familjen Grotesk",system-ui,sans-serif;--font-reading:"Literata",Georgia,serif;--font-mono:ui-monospace,"SF Mono",Menlo,monospace;--font-hand:"Reenie Beanie",cursive;--type-display:400 clamp(60px,12vw,176px)/.92 var(--font-display);--type-post-title:400 clamp(36px,5.6vw,64px)/1.04 var(--font-display);--type-lead:italic 400 clamp(21px,2.4vw,28px)/1.3 var(--font-reading);--type-heading:400 30px/1.15 var(--font-display);--type-title:400 23px/1.2 var(--font-display);--type-body:400 18px/1.65 var(--font-reading);--type-reading:400 20px/1.7 var(--font-reading);--type-meta:500 16px/1.4 var(--font-text);--type-hand:400 32px/.9 var(--font-hand);--track-display:-.02em;--measure:660px;--wide:1200px;--gutter:clamp(20px,3.6vw,56px);--space-section:clamp(56px,8vw,120px);--radius-sm:4px;--radius-md:10px;--radius-phone:30px;--radius-full:999px;--ease:cubic-bezier(.34,1.42,.5,1);--dur-fast:.16s;--dur-base:.52s;--shadow-phone:0 24px 40px -18px rgba(40,10,5,.4)}*{box-sizing:border-box;margin:0}html{-webkit-text-size-adjust:100%}body{background:var(--color-bg);color:var(--color-text);font:var(--type-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px;border-radius:4px}.wrap{max-width:var(--wide);margin:0 auto;padding-inline:var(--gutter)}.lnk,.prose a{text-decoration:underline;text-decoration-color:var(--color-accent);text-decoration-thickness:2px;text-underline-offset:3px}.btn{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 20px;border-radius:var(--radius-full);background:var(--color-btn);color:var(--color-on-btn);font:var(--type-meta);font-weight:600;transition:transform var(--dur-fast) ease-out}.btn:active{transform:scale(.96)}.hand{font:var(--type-hand);color:var(--color-mark)}.nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:72px;font:var(--type-meta);color:var(--color-text-2)}.nav .brand{font:400 22px/1 var(--font-display);color:var(--color-text)}.nav>span{display:flex;gap:24px;align-items:center}.nav>span:last-child{justify-content:flex-end}.nav a[aria-current]{color:var(--color-text)}.nav-m{display:none}@media(max-width:560px){.nav{grid-template-columns:auto 1fr;height:60px}.nav>span:first-child{display:none}.nav>span:last-child{gap:16px}.nav-m{display:inline}.nav .btn{height:38px;padding:0 14px}}.hero{text-align:center;padding-top:clamp(20px,3vw,48px)}.hero h1{font:var(--type-display);letter-spacing:var(--track-display)}.lead{font:var(--type-lead);color:var(--color-text-2);margin-top:14px}.under{position:relative;white-space:nowrap}.under svg{position:absolute;left:-2%;bottom:-.32em;width:104%;height:.5em;fill:none;stroke:var(--color-mark);stroke-width:2.6;stroke-linecap:round;overflow:visible}.under svg path{vector-effect:non-scaling-stroke}.spread{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,5fr) minmax(0,3fr);gap:40px;align-items:start;padding-top:clamp(36px,5vw,72px)}.copy{color:var(--color-text-2);padding-top:40px}.copy p+p{margin-top:14px}.shelf{display:flex;align-items:flex-end;justify-content:center;gap:5px;--bh:clamp(300px,33vw,430px);--cw:calc(var(--bh)*.66);--sw:clamp(34px,4.2vw,54px);height:var(--bh);position:relative;margin-top:24px}.shelf:after{content:"";position:absolute;left:-4%;right:-4%;top:100%;height:14px;border-top:3px solid var(--color-text);background:linear-gradient(180deg,rgba(27,20,19,.13),transparent)}.bk{position:relative;flex:none;width:var(--sw);height:var(--h,100%);border:0;padding:0;overflow:hidden;cursor:pointer;background:var(--ac);color:var(--ao);border-radius:3px 3px 0 0;box-shadow:inset 0 0 0 1px #00000024;transition:width var(--dur-base) cubic-bezier(.3,1.1,.4,1),height var(--dur-base) cubic-bezier(.3,1.1,.4,1),transform var(--dur-fast) ease-out}.bk:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.2),transparent 14%,transparent 84%,rgba(0,0,0,.14));pointer-events:none}.bk:not(.on):hover,.bk.peek:not(.on){transform:translateY(-12px)}.bk.on{width:var(--cw);height:100%;cursor:default}.bk.on:after{background:linear-gradient(90deg,rgba(0,0,0,.22) 0,rgba(0,0,0,.05) 3%,rgba(255,255,255,.14) 4.5%,transparent 7%)}.bk-spine{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:16px 0 12px;transition:opacity var(--dur-fast)}.bk-spine b{writing-mode:vertical-rl;font:400 clamp(17px,1.9vw,22px)/1 var(--font-display);white-space:nowrap}.bk-spine img{width:62%;border-radius:22%}.bk.on .bk-spine{opacity:0}.bk-cover{position:absolute;left:0;top:0;width:var(--cw);height:100%;opacity:0;transition:opacity var(--dur-base);text-align:left;padding:calc(var(--cw)*.09) calc(var(--cw)*.09) 0 calc(var(--cw)*.12)}.bk.on .bk-cover{opacity:1}.bk-cover small{display:block;font:500 calc(var(--cw)*.055)/1.2 var(--font-text)}.bk-cover b{display:block;font:400 calc(var(--cw)*.158)/.98 var(--font-display);letter-spacing:-.02em;margin-top:calc(var(--cw)*.05)}.bk-cover em{display:block;font:italic 400 calc(var(--cw)*.062)/1.3 var(--font-reading);margin-top:calc(var(--cw)*.035);opacity:.9}.bk-cover .ph{position:absolute;left:21%;width:62%;top:55%;aspect-ratio:9/19.5;border-radius:calc(var(--cw)*.1);background:#000 center top/cover no-repeat;box-shadow:0 0 0 5px #0c0c10,var(--shadow-phone)}.bk-cover .big{position:absolute;left:24%;width:52%;bottom:14%;border-radius:6%}.a-rapchat{--ac:#ffffff;--ao:#0c0c10}.a-mh{--ac:#0a0f2e;--ao:#ffffff}.a-mangia{--ac:#ffd43b;--ao:#17130a}.a-alltails{--ac:#6c63f5;--ao:#ffffff}.a-pipedream{--ac:#2d2d2d;--ao:#f5f0e6}.work{padding-top:28px}.work h2,.posts h2{font:var(--type-heading);margin-bottom:8px}.item{display:grid;grid-template-columns:40px minmax(0,1fr);gap:2px 14px;width:100%;text-align:left;border-top:1px solid var(--color-line);padding:14px 0}.item img{width:40px;grid-row:1/3;align-self:center;border-radius:22.5%;box-shadow:inset 0 0 0 1px #00000014}.item b{font:var(--type-title);font-weight:400;transition:color var(--dur-fast)}.item span{font:400 16px/1.35 var(--font-text);color:var(--color-text-2)}.item.on b,.item:hover b{color:var(--color-accent)}.posts{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:64px;padding-block:var(--space-section) 72px;align-items:start}.feat{display:block;position:relative}.feat strong{display:block;font:var(--type-post-title);font-size:clamp(34px,4.6vw,60px);letter-spacing:var(--track-display);text-wrap:balance;font-weight:400;transition:color var(--dur-fast)}.feat:hover strong{color:var(--color-accent)}.feat span{display:block;font:var(--type-meta);color:var(--color-text-3);margin-top:14px}.line{display:flex;align-items:baseline;gap:10px;padding:13px 0}.line strong{font:var(--type-title);font-weight:400;font-size:21px;transition:color var(--dur-fast)}.line:hover strong{color:var(--color-accent)}.line i{flex:1;min-width:16px;border-bottom:2px dotted #b9afac;transform:translateY(-4px)}.line span{font:var(--type-meta);color:var(--color-text-3);white-space:nowrap}.all{display:inline-block;margin-top:14px;font:var(--type-meta)}.page{max-width:var(--measure);margin:0 auto;padding-block:56px 72px}.page h1{font:var(--type-post-title);letter-spacing:var(--track-display);margin-bottom:24px}@media(max-width:900px){.spread{grid-template-columns:1fr;gap:0}.shelfwrap{order:-1}.shelf{--bh:clamp(300px,58vw,400px);--sw:clamp(34px,7.4vw,50px)}.copy,.work{max-width:620px;margin-inline:auto;width:100%}.copy{padding-top:36px}.work{padding-top:40px}.posts{grid-template-columns:1fr;gap:28px}}.post{max-width:var(--measure);margin:0 auto;padding-block:56px 72px}.post-head{text-align:center}.meta{font:var(--type-meta);color:var(--color-text-3)}.post h1{font:var(--type-post-title);letter-spacing:var(--track-display);margin:14px 0 16px;text-wrap:balance}.dek{font:var(--type-lead);color:var(--color-text-2);text-wrap:pretty}.by{display:flex;align-items:center;justify-content:center;gap:12px;font:var(--type-meta);margin:28px 0 36px}.by img{width:40px;height:40px;border-radius:50%;object-fit:cover}.toc{margin:0 0 36px;font:var(--type-meta)}.toc summary{cursor:pointer;color:var(--color-text-2)}.toc ol{padding:12px 0 0 22px}.toc li{margin:6px 0}.prose{font:var(--type-reading)}.prose>*+*{margin-top:1.1em}.prose h2{font:var(--type-heading);letter-spacing:var(--track-display);margin-top:1.8em;scroll-margin-top:24px}.prose h3{font:600 21px/1.3 var(--font-text);margin-top:1.6em}.prose ul,.prose ol{padding-left:1.3em}.prose li+li,.prose li>ul{margin-top:.5em}.prose b,.prose strong{font-weight:600}.prose code{font:500 .8em var(--font-mono);background:var(--color-surface);padding:.15em .4em;border-radius:var(--radius-sm);overflow-wrap:anywhere}.prose figure{margin-block:2em}.prose img{display:block;width:100%;height:auto;border-radius:var(--radius-md)}.prose figure.shot img{box-shadow:0 0 0 1px var(--color-line)}.prose figcaption{font:var(--type-meta);color:var(--color-text-3);text-align:center;margin-top:10px}.prose .tw{overflow-x:auto}.prose table{border-collapse:collapse;font:400 15px/1.45 var(--font-text);width:100%;min-width:480px}.prose th,.prose td{text-align:left;vertical-align:top;padding:9px 12px 9px 0;border-bottom:1px solid var(--color-line)}.prose th{color:var(--color-text-3);font-weight:600}@media(max-width:600px){.prose{font-size:18.5px}.prose figure{margin-inline:calc(var(--gutter)*-1)}.prose img{border-radius:0}}.subscribe{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;padding-top:28px;margin-top:48px;border-top:1px solid var(--color-line);font:var(--type-title)}.subscribe div{display:flex;align-items:center;gap:20px;font:var(--type-meta)}.foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 24px;padding:28px 0 36px;border-top:1px solid var(--color-line);font:var(--type-meta);color:var(--color-text-2)}.foot span:last-child{display:flex;flex-wrap:wrap;gap:8px 20px}.foot a:hover{color:var(--color-text)}@media(prefers-reduced-motion:reduce){*{transition-duration:.01ms!important}}
