
:root{
  --paper:#f6f6f2;
  --ink:#111;
  --muted:#4d4d49;
  --line:#1a1a18;
  --red:#a34632;
  --sage:#d8ddd6;
  --type:"American Typewriter","Courier New",Courier,monospace;
  --shell:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;color:var(--ink);font-family:var(--type);line-height:1.45;
  background:
    repeating-linear-gradient(0deg,rgba(0,0,0,.018) 0 1px,transparent 1px 4px),
    radial-gradient(circle at 20% 30%,rgba(0,0,0,.045) 0 .8px,transparent 1.5px),
    radial-gradient(circle at 70% 65%,rgba(0,0,0,.03) 0 .8px,transparent 1.4px),
    var(--paper);
  background-size:auto,19px 17px,31px 29px,auto;
}
a{color:inherit;text-decoration:none}
.shell{width:min(calc(100% - 52px),var(--shell));margin:0 auto}
.skip{position:absolute;left:-999px}.skip:focus{left:10px;top:10px;background:#fff;padding:8px;z-index:100}

.site-header{padding:20px 0 30px;border-top:4px double var(--ink);border-bottom:2px solid var(--ink)}
.masthead-wrap{position:relative}
.top-nav{display:flex;justify-content:flex-end;gap:28px;font-weight:700;font-size:.85rem;margin-bottom:14px}
.top-nav a:hover{text-decoration:underline;text-underline-offset:3px}
.masthead{
  font-weight:900;font-size:clamp(3.2rem,8vw,7.7rem);line-height:.72;letter-spacing:-.085em;
  display:flex;flex-direction:column;align-items:flex-start;transform:rotate(-.15deg);
  text-shadow:1px 0 rgba(0,0,0,.35),-1px 1px rgba(0,0,0,.14),2px 1px rgba(0,0,0,.08)
}
.masthead span:nth-child(1){margin-left:4%}
.masthead span:nth-child(2){margin-left:7%}
.strap{font-size:1.05rem;margin:28px 0 0 7%;max-width:720px}
.note-card,.paper-note{
  position:absolute;background:#eeeeea;padding:18px 22px;box-shadow:0 8px 16px rgba(0,0,0,.12);
  transform:rotate(2.5deg);font-size:1.15rem;line-height:1.35
}
.note-card{right:1.5%;top:72px}
.note-card:before,.paper-note:before{
  content:"";position:absolute;width:72%;height:18px;left:14%;top:-9px;background:rgba(208,194,164,.62);transform:rotate(2deg)
}
.note-card span,.paper-note span{display:block;width:80px;border-top:2px solid var(--ink);margin-top:8px;transform:rotate(-4deg)}

.latest{display:grid;grid-template-columns:1fr 1.08fr;gap:42px;padding:28px 0 36px;border-bottom:1px solid var(--line)}
.latest-image{position:relative;min-height:480px}
.latest-image img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.78) contrast(1.03)}
.paper-note{left:7%;top:8%;font-size:1.35rem;transform:rotate(-3deg)}
.latest-copy{display:flex;flex-direction:column;justify-content:center;padding:18px 4px}
.latest-label{color:var(--red);font-weight:900;font-size:1.5rem;margin-bottom:10px}
.latest h1{font-size:clamp(3rem,6vw,6rem);line-height:.95;letter-spacing:-.07em;margin:0;font-weight:900}
.latest-copy p{font-size:1.06rem;max-width:570px;margin:24px 0}
.read-button{align-self:flex-start;background:var(--ink);color:#fff;padding:14px 20px;border-radius:4px;font-size:1rem}
.read-button:hover{transform:translateY(-1px)}

.section-links{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}
.section-links article{padding:28px 15px 32px;border-right:1px solid #a7a7a2}
.section-links article:first-child{padding-left:0}
.section-links article:last-child{border-right:0;padding-right:0}
.section-links img{width:100%;aspect-ratio:1.15/1;object-fit:cover;display:block;filter:saturate(.72) contrast(1.04)}
.section-links h2{font-size:1.9rem;letter-spacing:-.05em;margin:15px 0 8px}
.section-links p{font-size:.9rem;min-height:82px;margin:0 0 18px;color:#30302d}
.section-links a{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}

.coming{
  background:var(--sage);display:grid;grid-template-columns:1.8fr repeat(3,1fr);gap:0;
  margin-top:0;padding:24px 30px 30px;position:relative;border-bottom:1px solid var(--line)
}
.coming>div{padding:14px 26px;border-right:1px solid rgba(0,0,0,.55);position:relative}
.coming>div:first-child{padding-left:0}.coming>div:last-child{border-right:0}
.quote{display:flex;gap:24px;align-items:center}
.flower{font-size:4rem;line-height:1}
.quote p{font-size:1rem;margin:0}
.coming-item{text-align:center;padding-top:44px!important}
.sticker{
  position:absolute;top:-8px;left:50%;transform:translateX(-50%) rotate(-5deg);
  background:#ecece7;padding:7px 13px;box-shadow:0 4px 8px rgba(0,0,0,.12);
  font-size:.78rem;line-height:1.15;white-space:nowrap
}
.icon{font-size:2.2rem;margin-bottom:8px}
.coming-item p{margin:0;font-size:.78rem}
footer{padding:18px 0 22px}
.footer-line{display:flex;align-items:center;gap:20px;font-size:.66rem;font-weight:900;letter-spacing:.05em}
.footer-line .rule{height:1px;background:var(--ink);flex:1}
.footer-line a{white-space:nowrap}

@media(max-width:850px){
  .top-nav{justify-content:flex-start;flex-wrap:wrap;gap:16px}
  .note-card{position:relative;right:auto;top:auto;display:inline-block;margin:26px 0 0 7%}
  .latest{grid-template-columns:1fr}
  .latest-image{min-height:380px}
  .section-links{grid-template-columns:repeat(2,1fr)}
  .section-links article:nth-child(2){border-right:0}
  .section-links article:first-child,.section-links article{padding:22px 14px}
  .coming{grid-template-columns:1fr 1fr}
  .coming>div{border-bottom:1px solid rgba(0,0,0,.45)}
}
@media(max-width:560px){
  .shell{width:min(calc(100% - 28px),var(--shell))}
  .masthead{font-size:clamp(3rem,17vw,5.2rem)}
  .strap{margin-left:4%;font-size:.9rem}
  .note-card{margin-left:4%}
  .latest{padding-top:20px}
  .latest-image{min-height:310px}
  .paper-note{font-size:1rem}
  .latest h1{font-size:clamp(2.8rem,15vw,4.5rem)}
  .section-links{grid-template-columns:1fr}
  .section-links article{border-right:0;border-bottom:1px solid #aaa}
  .section-links p{min-height:auto}
  .coming{grid-template-columns:1fr}
  .coming>div{border-right:0}
  .footer-line{align-items:flex-start;flex-direction:column}
  .footer-line .rule{display:none}
}

.coming-item:last-child .icon{
  color:#000;
  font-weight:900;
}

.compact-header{padding-bottom:18px}
.compact-masthead{font-size:clamp(2.4rem,5vw,4.8rem);line-height:.75;margin-top:4px}
.compact-masthead span:nth-child(1){margin-left:0}
.compact-masthead span:nth-child(2){margin-left:3%}
.article-shell{width:min(calc(100% - 42px),820px);margin:0 auto;padding:58px 0 74px}
.article-meta{font-size:.72rem;font-weight:900;letter-spacing:.12em;margin-bottom:20px}
.article-header h1{margin:0;font-size:clamp(3rem,7vw,6.4rem);line-height:.95;letter-spacing:-.065em;font-weight:900}
.article-standfirst{margin:26px 0 0;font-size:1.15rem;line-height:1.55;color:var(--muted);max-width:700px}
.article-rule{height:4px;background:var(--ink);margin:18px 0 42px}
.article-copy{width:min(100%,690px);margin:0 auto;font-family:Georgia,"Times New Roman",serif;font-size:1.12rem;line-height:1.78}
.article-copy p{margin:0 0 1.5em}
.article-copy .punchline{font-family:var(--type);font-size:1.38rem;font-weight:900;margin:2em 0}
.article-copy .argument-chain{font-family:var(--type);font-size:1.08rem;font-weight:700;line-height:1.65;padding:18px 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);margin:2.4em 0}
.question-run{font-family:var(--type);font-weight:900;font-size:1.12rem;line-height:1.25;margin:2.2em 0}
.question-run p{margin:.4em 0}
.article-copy .big-question{font-family:var(--type);font-weight:900;font-size:1.38rem;line-height:1.35;margin:1.35em 0}
.article-footer{margin-top:54px;padding-top:18px;border-top:2px solid var(--ink);display:flex;justify-content:space-between;gap:20px;font-weight:900}
.archive-main{padding:58px 0 86px}
.archive-heading{max-width:850px;margin-bottom:42px}
.archive-heading h1{margin:0;font-size:clamp(3.4rem,7vw,6.8rem);line-height:.92;letter-spacing:-.07em}
.archive-card{border-top:2px solid var(--ink);border-bottom:1px solid var(--ink);padding:24px 0 30px;max-width:900px}
.archive-date{font-size:.7rem;font-weight:900;letter-spacing:.1em}
.archive-card h2{margin:18px 0 12px;font-size:clamp(1.8rem,4vw,3.2rem);line-height:1.05;letter-spacing:-.05em}
.archive-card p{max-width:690px;color:var(--muted)}
.archive-read{display:inline-block;margin-top:8px;text-decoration:underline;text-underline-offset:5px}
@media(max-width:560px){.article-shell{width:min(calc(100% - 28px),820px);padding-top:38px}.article-copy{font-size:1.05rem}.article-footer{flex-direction:column}}
