:root{
  --navy:#003E55;--navy-deep:#002C3D;--navy-2:#0B4F69;
  --coral:#F2546A;--coral-btn:#D63A55;--coral-ink:#B42A43;--coral-light:#FF8496;
  --cream:#FBF3E4;--paper:#FFFBF3;--tan:#F7D9A8;--tan-2:#EFC98C;--brown:#7A4A2A;
  --ink:#003E55;--ink-2:#3D4F57;
  --display:"Titan One","Arial Rounded MT Bold","Trebuchet MS",sans-serif;
  --serif:"Fraunces",ui-serif,Georgia,serif;
  --sans:"Figtree",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --shadow:6px 6px 0 var(--navy);
  --r:16px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background-color:var(--cream);color:var(--ink);font:400 17px/1.6 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden;
  /* faint newsprint grain */
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .47 0 0 0 0 .29 0 0 0 0 .16 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}
h1,h2,h3{font-family:var(--serif);font-variation-settings:"SOFT" 100;line-height:1.08;letter-spacing:-.015em;margin:0;text-wrap:balance}
p{text-wrap:pretty}
a{color:var(--coral-ink);text-underline-offset:3px;text-decoration-thickness:2px}
a:hover{color:var(--navy)}
:focus-visible{outline:3px solid var(--navy);outline-offset:3px;border-radius:6px}
img{max-width:100%;height:auto}
.wrap{width:100%;max-width:1140px;margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-999px;top:8px;background:var(--navy);color:var(--cream);padding:8px 14px;border-radius:8px;z-index:20;font-weight:800}
.skip:focus{left:8px;color:var(--cream)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ticker */
.ticker{background:var(--navy);color:var(--cream);font:400 .82rem/1 var(--display);letter-spacing:.08em;text-transform:uppercase;overflow:hidden;white-space:nowrap;border-bottom:3px solid var(--coral)}
.ticker-track{display:inline-flex;padding:9px 0;animation:tick 40s linear infinite}
.ticker-track span{padding:0 14px}
.ticker-track span:nth-child(even){color:var(--coral-light)}
@keyframes tick{to{transform:translateX(-50%)}}

/* header */
.top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--navy)}
.brand img{width:48px;height:48px;transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
.brand:hover img{transform:rotate(-10deg) scale(1.06)}
.wordmark{font:400 1.35rem/1 var(--display);color:var(--coral);text-shadow:2px 2px 0 var(--navy);letter-spacing:.01em}
.top nav a{font-weight:800;font-size:.95rem;color:var(--navy);text-decoration:none;border:2px solid var(--navy);border-radius:999px;padding:7px 14px;display:inline-block;background:var(--paper);box-shadow:2px 2px 0 var(--navy);transition:transform .1s,box-shadow .1s}
.top nav a:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--navy)}

/* hero */
.hero{display:grid;gap:8px;padding:8px 20px 56px;align-items:center}
.hero-art{position:relative;display:grid;place-items:center;justify-self:center;width:min(300px,78vw);aspect-ratio:1;margin-top:4px}
.hero-art::before{content:"";position:absolute;inset:-14%;border-radius:50%;
  background:repeating-conic-gradient(from var(--rays),var(--tan) 0 7.5deg,transparent 7.5deg 15deg);
  -webkit-mask:radial-gradient(closest-side,#000 45%,transparent 100%);mask:radial-gradient(closest-side,#000 45%,transparent 100%);
  animation:spin 90s linear infinite;opacity:.9}
.hero-art img{position:relative;width:78%;height:auto;filter:drop-shadow(0 10px 0 rgba(0,62,85,.12));animation:bob 5s ease-in-out infinite}
/* rotate the gradient, not the box, so the rays never widen the page */
@property --rays{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes spin{to{--rays:360deg}}
@keyframes bob{50%{transform:translateY(-6px) rotate(-1.5deg)}}
/* mobile: tucked into the bottom-left corner, clear of the badge */
.stamp{position:absolute;left:-8%;bottom:-4%;width:74px;height:74px;border-radius:50%;background:var(--coral-btn);color:#fff;display:grid;place-items:center;text-align:center;font:400 .68rem/1.05 var(--display);text-transform:uppercase;letter-spacing:.04em;transform:rotate(-12deg);box-shadow:0 0 0 3px var(--cream),0 0 0 5px var(--coral-btn),4px 6px 0 5px rgba(0,62,85,.18)}
.stamp b{display:block;font-weight:400;font-size:1.18rem;letter-spacing:0}
.kicker{display:inline-block;margin:0;background:var(--navy);color:var(--cream);font-weight:800;font-size:.9rem;line-height:1.35;padding:7px 14px 7px 12px;border-radius:10px;position:relative}
.kicker::before{content:"★";color:var(--coral-light);margin-right:7px}
.hero h1{font-size:clamp(2.45rem,10.5vw,4.6rem);font-weight:900;margin:16px 0 16px;max-width:13ch}
.hero h1 .pop{font:400 1.02em/1 var(--display);color:var(--coral);text-shadow:.045em .05em 0 var(--navy);letter-spacing:.005em;white-space:nowrap;display:inline-block;transform:rotate(-2deg)}
.lede{font-size:clamp(1.06rem,2.8vw,1.22rem);color:var(--ink-2);max-width:38rem;margin:0 0 26px}
.towns{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:22px 0 0}
.towns li{background:var(--tan);color:var(--navy);font-weight:800;font-size:.86rem;padding:5px 12px;border-radius:999px;border:2px solid var(--navy)}
.towns li::before{content:"📍";margin-right:5px;font-size:.8em}

/* form (order-ticket style) */
.signup{background:var(--paper);border:2.5px solid var(--navy);border-radius:var(--r);padding:20px 18px 16px;box-shadow:var(--shadow);max-width:560px;position:relative}
.signup::before{content:"";position:absolute;left:14px;right:14px;top:8px;border-top:2px dashed rgba(0,62,85,.22)}
.signup label{display:block;font:800 1.02rem/1.35 var(--sans);margin:4px 0 10px;color:var(--navy)}
.row{display:flex;flex-direction:column;gap:10px}
.signup input[type=email]{width:100%;font:inherit;font-size:1.05rem;padding:13px 16px;border:2px solid var(--navy);border-radius:12px;background:#fff;color:var(--navy);min-height:54px}
.signup input[type=email]::placeholder{color:#6E7F86}
.signup input[type=email]:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 4px rgba(242,84,106,.35)}
.signup input[aria-invalid=true]{border-color:var(--coral-btn);background:#FFF3F4}
.btn{font:400 1.12rem/1 var(--display);letter-spacing:.02em;border:2px solid var(--navy);border-radius:12px;padding:15px 24px;min-height:54px;background:var(--coral-btn);color:#fff;cursor:pointer;box-shadow:4px 4px 0 var(--navy);transition:transform .08s,box-shadow .08s,background .15s;white-space:nowrap}
.btn:hover{background:#C42F4A}
.btn:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--navy)}
.btn:focus-visible{outline-offset:4px}
.btn[disabled]{opacity:.75;cursor:progress}
.fine{font-size:.86rem;color:var(--ink-2);margin:12px 2px 0}
.status{margin:12px 2px 0;font-weight:700;min-height:0}
.status:empty{display:none}
.status.ok{background:#E6F4EA;color:#17532A;border:2px solid #2E7D46;border-radius:10px;padding:12px 14px}
.status.ok::before{content:"✓ ";font-weight:800}
.status.err{color:var(--coral-ink)}
.signup.done .row,.signup.done .fine{display:none}
.hp{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}
@media (min-width:560px){.row{flex-direction:row}.signup input[type=email]{flex:1}}

/* dividers */
.checker{height:18px;background:repeating-conic-gradient(var(--coral) 0 25%,var(--cream) 0 50%) 0 0/18px 18px;border-block:2px solid var(--navy)}
.checker.navy{background-image:repeating-conic-gradient(var(--navy) 0 25%,var(--cream) 0 50%);border-color:var(--navy)}

/* sections */
section{padding:64px 0}
.eyebrow{display:inline-block;font:400 .82rem/1 var(--display);letter-spacing:.12em;text-transform:uppercase;color:var(--coral-ink);margin:0 0 14px}
h2{font-size:clamp(2rem,6.4vw,3rem);font-weight:900;margin-bottom:12px;max-width:20ch}
.sub{color:var(--ink-2);font-size:1.08rem;max-width:40rem;margin:0}

/* menu */
.menu{margin:34px 0 0;background:var(--paper);border:2.5px solid var(--navy);border-radius:22px;padding:10px;box-shadow:var(--shadow)}
.menu-in{border:2px solid var(--coral);border-radius:14px;padding:22px 18px 8px;outline:2px solid var(--coral);outline-offset:-8px}
.menu-title{font:400 1.05rem/1 var(--display);letter-spacing:.18em;text-transform:uppercase;text-align:center;color:var(--navy);margin:2px 0 18px}
.menu-title span{color:var(--coral)}
.reasons{display:grid;gap:4px 40px;list-style:none;padding:0;margin:0;counter-reset:r}
.reasons li{counter-increment:r;padding:14px 6px 16px;border-top:2px dotted rgba(0,62,85,.25)}
.reasons li:first-child{border-top:0}
.reasons h3{display:flex;align-items:baseline;gap:10px;font-size:1.35rem;font-weight:800;margin-bottom:6px}
.reasons h3::after{content:"";flex:1;border-bottom:3px dotted var(--tan-2);transform:translateY(-5px);min-width:20px}
.reasons .head{display:flex;align-items:baseline;gap:10px}
.reasons .head h3{flex:1;margin:0}
.reasons .no{font:400 .78rem/1 var(--display);color:var(--coral-ink);letter-spacing:.06em;white-space:nowrap}
.reasons p{margin:6px 0 0;color:var(--ink-2)}
@media (min-width:760px){.reasons{grid-template-columns:1fr 1fr}.reasons li:nth-child(2){border-top:0}.menu-in{padding:28px 30px 12px}}

/* headlines band */
.band{background:var(--navy);color:var(--cream);position:relative;overflow:hidden;
  background-image:radial-gradient(rgba(255,255,255,.07) 1.4px,transparent 1.6px);background-size:14px 14px}
.band .eyebrow{color:var(--coral-light)}
.band h2{color:var(--cream)}
.band .sub{color:#D3DEE2}
.clips{display:grid;gap:22px;list-style:none;padding:0;margin:36px 0 0}
.clip{background:var(--paper);color:var(--navy);border-radius:4px;padding:22px 20px 20px;position:relative;box-shadow:0 14px 24px -14px rgba(0,0,0,.55);transform:rotate(-1deg);transition:transform .25s cubic-bezier(.3,1.5,.5,1)}
.clip:nth-child(2n){transform:rotate(.9deg)}
.clip:nth-child(3){transform:rotate(.4deg)}
.clip:hover{transform:rotate(0) translateY(-3px)}
.clip::before{content:"";position:absolute;top:-11px;left:50%;width:84px;height:22px;margin-left:-42px;background:rgba(247,217,168,.85);transform:rotate(-3deg);box-shadow:0 1px 2px rgba(0,0,0,.15)}
.clip::after{content:"";position:absolute;right:0;bottom:0;width:90px;height:70px;background:radial-gradient(rgba(242,84,106,.28) 1.3px,transparent 1.6px) 0 0/8px 8px;-webkit-mask:linear-gradient(135deg,transparent 30%,#000);mask:linear-gradient(135deg,transparent 30%,#000);pointer-events:none}
.dateline{display:block;font:400 .74rem/1 var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--coral-ink);margin-bottom:10px;padding-bottom:10px;border-bottom:1.5px solid rgba(0,62,85,.18)}
.clip p{margin:0;font:800 1.32rem/1.25 var(--serif);font-variation-settings:"SOFT" 100;position:relative}
@media (min-width:760px){.clips{grid-template-columns:1fr 1fr;gap:30px 28px}}
.more{margin:40px 0 0}
.more a{display:inline-flex;align-items:center;gap:8px;font:400 1.02rem/1 var(--display);letter-spacing:.03em;color:var(--navy);background:var(--tan);text-decoration:none;padding:14px 20px;border-radius:12px;border:2px solid var(--cream);box-shadow:4px 4px 0 var(--coral)}
.more a:hover{background:var(--cream);color:var(--navy)}
.more a:focus-visible{outline-color:var(--cream)}

/* how it works */
.steps{display:grid;gap:18px;list-style:none;padding:0;margin:34px 0 0;counter-reset:s}
.steps li{counter-increment:s;background:var(--paper);border:2.5px solid var(--navy);border-radius:var(--r);padding:20px 20px 20px 84px;position:relative;box-shadow:4px 4px 0 var(--navy)}
.steps li::before{content:counter(s);position:absolute;left:18px;top:18px;width:48px;height:48px;border-radius:50%;background:var(--coral-btn);color:#fff;border:2.5px solid var(--navy);display:grid;place-items:center;font:400 1.4rem/1 var(--display)}
.steps h3{font-size:1.3rem;font-weight:800;margin-bottom:4px}
.steps p{margin:0;color:var(--ink-2)}
@media (min-width:860px){.steps{grid-template-columns:repeat(3,1fr)}.steps li{padding:76px 22px 22px}.steps li::before{top:18px;left:20px}}
.voice{margin-top:64px;display:grid;gap:26px;align-items:center}
.bubble{position:relative;background:var(--paper);border:2.5px solid var(--navy);border-radius:28px;padding:28px 24px;box-shadow:var(--shadow);margin:0}
.bubble::after{content:"";position:absolute;left:46px;bottom:-22px;width:34px;height:34px;background:var(--paper);border-right:2.5px solid var(--navy);border-bottom:2.5px solid var(--navy);transform:rotate(45deg) scale(.8)}
.quote{font:700 clamp(1.45rem,4.6vw,2.15rem)/1.25 var(--serif);font-style:italic;font-variation-settings:"SOFT" 100;margin:0;color:var(--navy)}
.quote::before{content:"“";font:400 3.2em/0 var(--display);color:var(--coral);vertical-align:-.42em;margin-right:4px}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;list-style:none;padding:0;margin:0}
.facts li{background:var(--tan);border:2.5px solid var(--navy);border-radius:14px;padding:14px 8px;text-align:center}
.facts strong{display:block;font:400 1.4rem/1.1 var(--display);color:var(--navy)}
.facts span{font-size:.86rem;font-weight:600;color:var(--navy)}
.fence{height:64px;margin-top:40px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='64' viewBox='0 0 40 64'%3E%3Cpath d='M0 24h40v7H0zM0 46h40v7H0z' fill='%23EFC98C' stroke='%23003E55' stroke-width='2'/%3E%3Cpath d='M9 64V12l11-10 11 10v52z' fill='%23FFFBF3' stroke='%23003E55' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") repeat-x left bottom/40px 64px}
@media (min-width:860px){.voice{grid-template-columns:1.5fr 1fr}}

/* final CTA */
.final{background:var(--coral);position:relative;overflow:hidden;padding:72px 0 80px}
.final::before{content:"";position:absolute;left:50%;top:50%;width:1600px;height:1600px;margin:-800px 0 0 -800px;background:repeating-conic-gradient(from 0deg,rgba(255,255,255,.12) 0 6deg,transparent 6deg 12deg)}
.final .wrap{position:relative}
.final-card{position:relative;background:var(--paper);border:3px solid var(--navy);border-radius:26px;padding:34px 22px 26px;box-shadow:8px 8px 0 var(--navy);max-width:760px;margin:0 auto}
.final-card .badge{position:absolute;width:112px;height:112px;right:-8px;top:-58px;transform:rotate(10deg)}
.final-card h2{max-width:16ch;padding-right:58px}
.final-card .sub{margin-bottom:22px;color:var(--ink-2)}
.final .signup{box-shadow:none;border-width:2px;max-width:none;background:var(--cream)}
.final .signup::before{display:none}
@media (min-width:760px){.final-card{padding:44px 44px 34px}.final-card .badge{width:150px;height:150px;right:-40px;top:-70px}}

/* footer */
footer{background:var(--navy);color:#D3DEE2;font-size:.94rem;padding:40px 0 48px}
footer .wrap{display:grid;gap:22px;align-items:start}
.foot-brand{display:flex;align-items:center;gap:14px}
.foot-brand img{width:76px;height:76px;border-radius:50%;background:var(--cream);padding:3px;flex:none}
.foot-brand .wordmark{font-size:1.5rem;text-shadow:2px 2px 0 #000c}
.foot-brand p{margin:4px 0 0;color:#D3DEE2}
footer a{color:var(--coral-light)}
footer a:hover{color:var(--cream)}
footer :focus-visible{outline-color:var(--cream)}
footer nav{display:flex;gap:20px;flex-wrap:wrap;font-weight:800}
footer address{font-style:normal}
.legal{display:grid;gap:4px}
.legal p{margin:0}
@media (min-width:860px){footer .wrap{grid-template-columns:1.4fr 1fr 1fr}}

/* desktop hero */
@media (min-width:900px){
  .top{padding:20px 20px 8px}
  .brand img{width:56px;height:56px}
  .wordmark{font-size:1.6rem}
  .hero{grid-template-columns:1.12fr .88fr;gap:40px;padding:28px 20px 84px}
  .hero-art{order:2;width:min(470px,100%);margin:0}
  .hero-copy{order:1}
  .stamp{width:104px;height:104px;font-size:.9rem;left:2%;top:46%;bottom:auto}
  .stamp b{font-size:1.7rem}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .ticker-track{transform:none}
}

/* ===================== Reader side: shared bits ===================== */
.top nav a[aria-current=page]{background:var(--tan)}
.btn-link{display:inline-flex;align-items:center;gap:8px;font:400 1.02rem/1 var(--display);letter-spacing:.03em;color:#fff;background:var(--coral-btn);text-decoration:none;padding:14px 20px;border-radius:12px;border:2px solid var(--navy);box-shadow:4px 4px 0 var(--navy);transition:transform .08s,box-shadow .08s}
.btn-link:hover{color:#fff;background:#C42F4A}
.btn-link:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--navy)}

/* ===================== /issues ===================== */
.archive-hero{display:grid;gap:26px;padding:22px 20px 52px;align-items:end}
.archive-hero h1{font-size:clamp(2.6rem,11vw,4.6rem);font-weight:900;margin:0 0 14px}
.archive-hero .lede{margin:0}
.archive-hero.is-empty{padding-bottom:30px}
@media (min-width:900px){.archive-hero:not(.is-empty){grid-template-columns:1.1fr .9fr;gap:48px;padding:36px 20px 64px}}

.lead-story{position:relative;background:var(--paper);border:2.5px solid var(--navy);border-radius:6px;padding:26px 22px 28px;box-shadow:var(--shadow)}
.lead-story::before{content:"";position:absolute;inset:7px;border:1.5px solid rgba(0,62,85,.2);border-radius:3px;pointer-events:none}
.lead-flag{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin:0 0 16px;padding-bottom:12px;border-bottom:3px double var(--navy);font:400 .78rem/1.2 var(--display);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2)}
.lead-flag span{background:var(--coral-btn);color:#fff;padding:6px 10px 5px;border-radius:6px;transform:rotate(-2deg)}
.lead-story h2{font-size:clamp(1.9rem,6.4vw,3.2rem);max-width:22ch;margin:0 0 12px}
.lead-story h2 a,.issue-row h3 a{color:var(--navy);text-decoration:none;background:linear-gradient(var(--coral),var(--coral)) 0 100%/0 3px no-repeat;transition:background-size .25s}
.lead-story h2 a:hover,.issue-row h3 a:hover{background-size:100% 3px}
.lead-story .dek{font:italic 400 clamp(1.08rem,2.8vw,1.3rem)/1.45 var(--serif);color:var(--ink-2);max-width:44rem;margin:0}
.read-on{margin:22px 0 0}
@media (min-width:760px){.lead-story{padding:34px 40px 36px}}

.list-h{font-size:clamp(1.5rem,4.6vw,2rem);margin:56px 0 6px}
.issue-list{list-style:none;padding:0;margin:0;display:grid}
.issue-row{border-top:2px dotted rgba(0,62,85,.3);padding:20px 0 22px}
.issue-row:last-child{border-bottom:2px dotted rgba(0,62,85,.3)}
.issue-row .dateline{border:0;padding:0;margin-bottom:8px}
.issue-row h3{font-size:clamp(1.3rem,3.6vw,1.6rem);font-weight:800;margin:0 0 6px}
.issue-row p{margin:0;color:var(--ink-2);max-width:46rem}
.pin{margin-left:8px;color:var(--navy)}

/* empty state */
.cooking{padding:30px 0 72px;background:radial-gradient(circle at 50% 0,rgba(247,217,168,.55),transparent 60%)}
.cooking-card{position:relative;max-width:640px;margin:110px auto 0;text-align:center;background:var(--paper);border:3px solid var(--navy);border-radius:26px;padding:104px 20px 26px;box-shadow:8px 8px 0 var(--navy)}
.cooking-art{position:absolute;left:50%;top:-104px;width:200px;height:200px;margin-left:-100px}
.cooking-art img{width:100%;height:auto;animation:bob 5s ease-in-out infinite}
.steam{position:absolute;left:50%;top:-6px;width:90px;margin-left:-45px;display:flex;justify-content:space-between}
.steam i{display:block;width:10px;height:34px;border-radius:10px;border-left:4px solid rgba(0,62,85,.28);animation:steam 2.6s ease-in-out infinite;opacity:0}
.steam i:nth-child(2){animation-delay:.8s;height:42px}
.steam i:nth-child(3){animation-delay:1.6s}
@keyframes steam{0%{transform:translateY(12px) scaleY(.6);opacity:0}40%{opacity:1}100%{transform:translateY(-16px) skewX(-12deg);opacity:0}}
.ticket-no{display:inline-block;font:400 .74rem/1 var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--coral-ink);margin:0 0 12px;padding:7px 12px;border:2px dashed rgba(180,42,67,.45);border-radius:8px}
.cooking-card h2{font-size:clamp(2.1rem,8vw,3.2rem);max-width:none;margin:0 0 12px}
.cooking-card .sub{margin:0 auto 24px;max-width:34rem}
.cooking-card .signup{text-align:left;margin:0 auto;box-shadow:4px 4px 0 var(--navy);background:var(--cream)}
.cooking-back{margin:20px 0 0;font-weight:700}
@media (min-width:760px){.cooking-card{padding:110px 44px 32px}}

/* ===================== /issues/<slug> ===================== */
.reader{max-width:860px;padding-top:6px;padding-bottom:64px}
.crumbs{margin:6px 0 14px;font-weight:800}
.crumbs a{color:var(--navy);text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.crumbs-end{margin-top:28px}
.plug{margin:0 0 22px;padding:12px 16px;background:var(--tan);border:2px solid var(--navy);border-radius:12px;font-size:.95rem;line-height:1.45;color:var(--navy)}
.plug a{font-weight:800;color:var(--coral-ink);white-space:nowrap}
.plug a::after{content:" →"}

.sheet{position:relative;background:var(--paper);border:2.5px solid var(--navy);border-radius:6px;box-shadow:var(--shadow);padding:22px 18px 30px}
.sheet::before{content:"";position:absolute;inset:7px;border:1.5px solid rgba(0,62,85,.18);border-radius:3px;pointer-events:none}
.issue-head{text-align:center;padding-bottom:22px;margin-bottom:28px;border-bottom:3px double var(--navy)}
.masthead{display:flex;flex-direction:column;align-items:center;gap:6px;padding:6px 0 12px;border-bottom:1.5px solid var(--navy)}
.mast-name{font:400 clamp(1.7rem,7vw,2.5rem)/1 var(--display);color:var(--coral);text-shadow:2px 2px 0 var(--navy);letter-spacing:.01em}
.mast-tag{font:400 .72rem/1 var(--display);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2)}
.issue-dateline{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 12px;margin:0 0 22px;padding:9px 0;border-bottom:1.5px solid var(--navy);font:400 .76rem/1.3 var(--display);letter-spacing:.12em;text-transform:uppercase;color:var(--navy)}
.issue-dateline .sep{color:var(--coral)}
.issue-head h1{font-size:clamp(2.1rem,8.4vw,3.6rem);font-weight:900;margin:0 auto 14px;max-width:20ch}
.issue-head .dek{font:italic 400 clamp(1.1rem,3vw,1.32rem)/1.45 var(--serif);color:var(--ink-2);margin:0 auto;max-width:36rem}
.share{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;margin:20px 0 0}
.share-k{font:400 .74rem/1 var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);margin-right:2px}
.share a,.share button{font:800 .86rem/1 var(--sans);color:var(--navy);text-decoration:none;border:2px solid var(--navy);border-radius:999px;padding:7px 12px;background:#fff;cursor:pointer;box-shadow:2px 2px 0 var(--navy)}
.share a:hover,.share button:hover{background:var(--tan);color:var(--navy)}
@media (min-width:760px){.sheet{padding:30px 56px 40px}}

/* article typography */
.prose{max-width:40rem;margin:0 auto;font-size:1.08rem;line-height:1.72;color:#1F3640;overflow-wrap:break-word}
.prose>*:first-child{margin-top:0}
.prose>p:first-child::first-letter{float:left;font:900 3.6em/.82 var(--serif);font-variation-settings:"SOFT" 100;color:var(--coral);text-shadow:2px 2px 0 var(--navy);margin:.06em .1em 0 0}
.prose p{margin:0 0 1.1em}
.prose h2{font-size:clamp(1.55rem,4.8vw,2.05rem);font-weight:900;max-width:none;margin:2.1em 0 .6em;padding-top:.7em;border-top:3px solid var(--navy);position:relative}
.prose h2::before{content:"";position:absolute;left:0;top:-3px;width:64px;height:3px;background:var(--coral)}
.prose h3{font-size:clamp(1.22rem,3.4vw,1.42rem);font-weight:800;margin:1.7em 0 .45em}
.prose h4,.prose h5,.prose h6{font:400 .9rem/1.3 var(--display);letter-spacing:.08em;text-transform:uppercase;color:var(--coral-ink);margin:1.6em 0 .5em}
.prose strong,.prose b{color:var(--navy);font-weight:800}
.prose a{color:var(--coral-ink);font-weight:600;text-decoration-thickness:1.5px;text-decoration-color:rgba(180,42,67,.45)}
.prose a:hover{color:var(--navy);text-decoration-color:currentColor}
.prose ul,.prose ol{margin:0 0 1.2em;padding-left:1.5em}
.prose li{margin:.4em 0;padding-left:.2em}
.prose ul{list-style:none;padding-left:1.4em}
.prose ul>li{position:relative}
.prose ul>li::before{content:"★";position:absolute;left:-1.25em;top:.12em;font-size:.78em;color:var(--coral)}
.prose ol>li::marker{font:400 .95em var(--display);color:var(--coral-ink)}
.prose li>ul,.prose li>ol{margin:.3em 0 .4em}
.prose blockquote{margin:1.6em 0;padding:16px 20px 16px 22px;background:#fff;border:2px solid var(--navy);border-left:8px solid var(--coral);border-radius:12px;font:italic 400 1.14em/1.55 var(--serif);color:var(--navy);box-shadow:3px 3px 0 var(--navy)}
.prose blockquote p:last-child{margin-bottom:0}
.prose hr{border:0;height:auto;margin:2.2em 0;text-align:center;overflow:visible}
.prose hr::before{content:"★  ★  ★";white-space:pre;font:400 .9rem/1 var(--display);letter-spacing:.3em;color:var(--coral)}
.prose img{display:block;max-width:100%;height:auto;margin:1.4em auto;border:2.5px solid var(--navy);border-radius:10px;box-shadow:4px 4px 0 var(--navy);background:var(--cream)}
.prose figure{margin:1.6em 0}
.prose figcaption{font-size:.88rem;color:var(--ink-2);text-align:center;margin-top:-.6em}
.prose code{font:600 .9em/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--cream);border:1px solid rgba(0,62,85,.2);border-radius:5px;padding:.08em .35em}
.prose pre{overflow-x:auto;background:var(--navy);color:var(--cream);border-radius:12px;padding:16px 18px;font-size:.9rem}
.prose pre code{background:none;border:0;padding:0;color:inherit}
.prose mark{background:var(--tan);color:var(--navy);padding:0 .15em}
.table-scroll{overflow-x:auto;margin:1.5em 0;border:2.5px solid var(--navy);border-radius:12px;box-shadow:4px 4px 0 var(--navy);background:#fff}
.prose table{border-collapse:collapse;width:100%;font-size:.95rem;line-height:1.45}
.prose caption{caption-side:top;text-align:left;padding:10px 14px;font-weight:800}
.prose th,.prose td{padding:10px 14px;text-align:left;vertical-align:top;border-bottom:1.5px solid rgba(0,62,85,.15)}
.prose th{background:var(--navy);color:var(--cream);font:400 .8rem/1.3 var(--display);letter-spacing:.08em;text-transform:uppercase}
.prose tr:last-child td{border-bottom:0}
.prose tbody tr:nth-child(even) td{background:var(--paper)}
.end-mark{text-align:center;margin:34px 0 0;padding-top:20px;border-top:3px double var(--navy);font:400 .9rem/1 var(--display);letter-spacing:.3em;color:var(--coral)}

.pager{display:grid;gap:14px;margin:30px 0 0}
.pager a{display:grid;gap:6px;padding:16px 18px;background:var(--paper);border:2.5px solid var(--navy);border-radius:14px;box-shadow:4px 4px 0 var(--navy);text-decoration:none;color:var(--navy);transition:transform .1s,box-shadow .1s}
.pager a:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--navy);color:var(--navy)}
.pager-k{font:400 .76rem/1 var(--display);letter-spacing:.12em;text-transform:uppercase;color:var(--coral-ink)}
.pager-t{font:800 1.12rem/1.3 var(--serif);font-variation-settings:"SOFT" 100}
.pager-newer{text-align:right}
@media (min-width:700px){.pager{grid-template-columns:1fr 1fr}}

/* ===================== Note pages (thanks, 404) ===================== */
body.page-note{min-height:100vh;display:flex;flex-direction:column}
body.page-note main{flex:1;display:grid;place-items:center;padding:40px 0 64px}
body.page-thanks main{padding:40px 20px 56px}
.note-card{position:relative;max-width:34rem;width:100%;margin:90px auto 0;text-align:center;background:var(--paper);border:3px solid var(--navy);border-radius:26px;padding:96px 24px 30px;box-shadow:8px 8px 0 var(--navy)}
.note-card img{position:absolute;left:50%;top:-92px;width:180px;height:180px;margin-left:-90px;animation:tip 1.2s cubic-bezier(.3,1.6,.5,1) both}
@keyframes tip{from{transform:translateY(16px) rotate(-8deg);opacity:0}}
.note-card .eyebrow{margin-bottom:12px;color:var(--coral-ink)}
.note-card h1{font-size:clamp(2rem,7vw,2.6rem);font-weight:900;margin:0 0 14px}
.note-card p{margin:0 0 14px;color:var(--ink-2)}
.note-card .links{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:24px 0 0}
.note-card .links a{font:400 1rem/1 var(--display);letter-spacing:.02em;text-decoration:none;padding:14px 18px;border-radius:12px;border:2px solid var(--navy);box-shadow:4px 4px 0 var(--navy);color:var(--navy);background:var(--tan)}
.note-card .links a.primary{background:var(--coral-btn);color:#fff}
.note-card .links a:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--navy)}
/* a "---" right before a section heading already separates it; skip the heading rule */
.prose hr+h2{border-top:0;padding-top:0;margin-top:0}
.prose hr+h2::before{display:none}
@media (max-width:559px){.issue-dateline{flex-direction:column;align-items:center}.issue-dateline .sep{display:none}}