/* Writing (/blog): reading surfaces inside the die world. Base tokens and chrome come from /assets/die.css */
main{display:block}
.bhero{padding:clamp(108px,14vh,150px) 0 clamp(36px,5vw,64px);position:relative}
.crumbs{display:flex;flex-wrap:wrap;gap:10px;color:var(--dim);margin-bottom:clamp(22px,3vw,36px)}
.crumbs a{color:var(--mut);transition:color .2s}
.crumbs a:hover{color:var(--cu-2)}
.crumbs [aria-current]{color:var(--txt)}
.ptitle{font:900 clamp(3.6rem,13vw,11rem)/.86 var(--display);font-stretch:125%;letter-spacing:-.025em;text-transform:uppercase;display:flex;flex-wrap:wrap;column-gap:.2em;margin:0 0 clamp(22px,3vw,36px);color:var(--txt)}
.ptitle .l{display:block;white-space:nowrap}
.ptitle.sm{font-size:clamp(2.6rem,6.4vw,5.6rem);line-height:.98;text-transform:none;font-stretch:118%;letter-spacing:-.03em;display:block}
.ptitle em,.ptitle.sm em{font-style:normal;color:var(--cu)}
.gl .ptitle[data-fig]{color:transparent}
.thero .ptitle{font-size:clamp(3rem,10vw,8.6rem)}
.marking{display:flex;justify-content:space-between;align-items:center;gap:14px 24px;flex-wrap:wrap;border-top:1px solid var(--line-2);padding-top:14px;margin-bottom:18px}
.marking .live{color:var(--au)}
.tcount{color:var(--mut)}
.dek{font:500 clamp(18px,1.6vw,22px)/1.5 var(--body);color:var(--mut);max-width:44ch;text-wrap:pretty}
.tdek{max-width:56ch}
.cta{display:flex;flex-wrap:wrap;gap:10px}
.btn.sm{height:42px;padding:0 16px;font-size:14px}
.btn svg{width:14px;height:14px}

/* hero row */
.hrow{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) minmax(0,.9fr)}
.hrow>.blk{padding:clamp(22px,2.4vw,32px)}
.hdek{display:flex;flex-direction:column;justify-content:space-between;gap:28px}
.hauthor{display:grid;grid-template-columns:64px 1fr;gap:12px 16px;align-content:start}
.hauthor img{width:64px;height:64px;object-fit:cover;filter:grayscale(.2) contrast(1.05)}
.hauthor b{display:block;font:700 18px var(--display);font-stretch:110%}
.hauthor span{color:var(--dim);font-size:13.5px}
.hauthor p{grid-column:1/-1;color:var(--mut);font-size:15px}
.hauthor .more{grid-column:1/-1}
.tele{display:grid;align-content:space-between;margin:0}
.tele .r{display:grid;grid-template-columns:1fr auto;align-items:end;gap:10px;padding:12px 0;border-bottom:1px dashed var(--line-3)}
.tele .r:first-child{padding-top:0}
.tele dt{color:var(--mut);font-size:14px;line-height:1.3}
.tele dd{font:800 clamp(28px,2.6vw,38px)/1 var(--display);font-stretch:112%;font-variant-numeric:tabular-nums;text-align:right}
.tele dd small{font-size:max(.5em,14px);color:var(--cu);margin-left:2px}
.nfrow{grid-template-columns:minmax(0,1fr);max-width:720px}

/* sections */
.bsec{padding:clamp(80px,10vw,136px) 0 0}
.tsec{padding-top:clamp(12px,2vw,24px)}

/* topic map: the nine topics as die blocks, one column per layer */
.tmap{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;background:var(--line-2);border:1px solid var(--line-2);position:relative}
.tm-col{display:flex;flex-direction:column;gap:1px;background:var(--line-2)}
.tm-h{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:var(--si);border-bottom:2px solid var(--lc)}
.tm-h .mono{color:var(--dim)}
.tm-b{flex:1;display:flex;flex-direction:column;gap:10px;padding:18px 16px 18px;min-height:250px;background:var(--si-2);transition:background .3s}
a.tm-b:hover{background:var(--si-3)}
.tm-n{font:800 34px/1 var(--display)!important;font-stretch:118%!important;letter-spacing:-.02em!important;color:var(--lc)}
.tm-b h3{font:700 19px/1.15 var(--display);font-stretch:110%}
.tm-b p{color:var(--mut);font-size:14px;line-height:1.5}
.tm-go{display:inline-flex;align-items:center;gap:8px;color:var(--lc)}
.tm-b.is-empty{background:var(--si)}
.tm-b.is-empty .tm-n,.tm-b.is-empty .tm-go{color:var(--ghost)}
.tm-b.is-empty h3{color:var(--mut)}
.tm-b.is-empty p{color:var(--dim)}
.gl-ready .tmap,.gl-ready .tm-col{background:transparent;gap:0}
.gl-ready .tmap{border:0;outline:1px solid var(--line-2)}
.gl-ready .tm-b,.gl-ready .tm-h{box-shadow:inset -1px -1px 0 var(--line-2)}
.gl-ready .tmap .tm-b{background:rgba(8,14,16,.28)}
.gl-ready .tmap a.tm-b:hover{background:rgba(var(--lc-rgb),.07)}
.gl-ready .tmap .tm-b.is-empty{background:rgba(8,14,16,.6)}
.tm-b p,.tm-b h3{text-shadow:0 0 6px var(--si),0 0 2px var(--si)}

/* latest */
.lgrid{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
.feat{display:flex;flex-direction:column;gap:16px;padding:clamp(24px,3vw,40px);min-height:360px;transition:background .3s}
.feat:hover{background:var(--si-3)}
.feat-meta{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center}
.feat-meta .mono{color:var(--dim)}
.feat h3{font:800 clamp(2rem,3.6vw,3.3rem)/1.02 var(--display);font-stretch:116%;letter-spacing:-.025em;max-width:16ch;text-wrap:balance}
.feat p{color:var(--mut);max-width:52ch;font-size:17px}
.go{margin-top:auto;display:inline-flex;align-items:center;gap:8px;color:var(--cu)}
.feat:hover .go{color:var(--cu-2)}
.recent{display:grid;gap:1px;background:var(--line-2)}
.mini{display:flex;flex-direction:column;gap:10px;padding:22px 24px;transition:background .3s}
.mini:hover{background:var(--si-3)}
.mini h4{font:700 19px/1.25 var(--display);font-stretch:108%;text-wrap:balance}
.mini .mono{color:var(--dim)}
.kind{color:var(--au);border:1px solid var(--line-3);padding:3px 7px}

/* archive */
.tools{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;margin-bottom:26px}
.search{display:flex;align-items:center;gap:10px;height:44px;padding:0 10px 0 14px;border:1px solid var(--line-2);background:var(--si);color:var(--dim);min-width:min(320px,100%);transition:border-color .25s}
.search:focus-within{border-color:var(--cu)}
.search input{flex:1;min-width:0;outline:0;font-size:15px;color:var(--txt)}
.search input::placeholder{color:var(--dim)}
.search input::-webkit-search-cancel-button{filter:invert(1) opacity(.5)}
.rows{border-top:1px solid var(--line-3)}
.mhead{display:flex;align-items:center;gap:14px;padding:26px 0 8px;color:var(--dim)}
.mhead span:first-child{color:var(--txt)}
.mhead i{flex:1;height:1px;background:var(--line-2)}
.row{position:relative;display:grid;grid-template-columns:96px minmax(0,1fr) 28px;gap:24px;padding:24px 0;border-bottom:1px solid var(--line-2);align-items:start;transition:background .3s}
.row::before{content:"";position:absolute;left:0;top:-1px;height:2px;width:0;background:var(--lc);transition:width .5s var(--ease)}
.row:hover::before{width:100%}
.row:hover{background:linear-gradient(90deg,rgba(var(--lc-rgb),.06),transparent 75%)}
.row-date{display:grid;gap:2px;color:var(--dim)}
.row-date b{font:800 34px/1 var(--display);font-stretch:118%;color:var(--txt);letter-spacing:-.02em}
.row-meta{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;margin-bottom:10px}
.row-meta .mono{color:var(--dim)}
.row h3{font:700 clamp(1.25rem,2vw,1.6rem)/1.18 var(--display);font-stretch:110%;letter-spacing:-.01em;margin-bottom:6px;text-wrap:balance;transition:color .25s}
.row:hover h3{color:var(--lc)}
.row p{color:var(--mut);max-width:70ch;font-size:15.5px}
.tags{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:10px;color:var(--dim);text-transform:none;letter-spacing:.02em}
.arrow{color:var(--dim);transition:color .25s,transform .35s var(--ease)}
.arrow svg{width:16px;height:16px}
.row:hover .arrow{color:var(--lc);transform:translate(3px,-3px)}
.empty{padding:40px 0;color:var(--dim)}
.more-btn{margin-top:22px;height:46px;padding:0 18px;border:1px solid var(--line-3);color:var(--mut);transition:border-color .25s,color .25s}
.more-btn:hover{border-color:var(--cu);color:var(--txt)}

/* topic pages */
.others{margin-top:clamp(40px,5vw,64px);display:grid;gap:14px}
.others>.mono{color:var(--dim)}
.ochips{display:flex;flex-wrap:wrap;gap:8px}
.ochip{display:inline-flex;align-items:center;height:40px;padding:0 14px;border:1px solid var(--line-2);background:var(--si);transition:border-color .25s,background .25s}
.ochip:hover{border-color:var(--lc);background:rgba(var(--lc-rgb),.08)}

/* subscribe band */
.band{padding:clamp(80px,10vw,136px) 0 clamp(64px,8vw,104px)}
.band-in{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
.band-in .blk{padding:clamp(24px,3vw,40px)}
.band-k{color:var(--au);display:block;margin-bottom:12px}
.band h2{font:800 clamp(1.9rem,3.6vw,3.1rem)/1.02 var(--display);font-stretch:116%;letter-spacing:-.025em;margin-bottom:12px}
.band p{color:var(--mut);max-width:48ch}
.band-cta{display:flex;flex-direction:column;justify-content:center;gap:10px}
.band-cta .btn{justify-content:center}

/* subscribe page */
.sgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
.scard{padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.sic{display:inline-flex;color:var(--cu)}
.sic svg{width:.8em;height:.8em}
.scard h2{display:flex;align-items:center;gap:14px;font:800 clamp(1.6rem,2.6vw,2.2rem)/1.05 var(--display);font-stretch:114%}
.scard p{color:var(--mut)}
.feedbox{display:flex;align-items:stretch;width:100%;border:1px solid var(--line-3);background:var(--si)}
.feedbox code{flex:1;min-width:0;padding:12px 14px;font:500 13px var(--mono);color:var(--txt);overflow:auto;white-space:nowrap}
.feedbox .btn{height:auto}
.sl{color:var(--dim)}
.rbtns{display:flex;flex-wrap:wrap;gap:8px}
.what summary{cursor:pointer;color:var(--mut)}
.what{align-self:stretch}
.what p{margin-top:8px;font-size:15px}
.slatest{width:100%;display:grid;gap:12px;margin-top:8px}

/* post */
.is-post .prog{background:var(--lc,var(--cu))}
.phead{padding-top:clamp(108px,14vh,150px);padding-bottom:clamp(32px,4vw,52px);max-width:1080px;margin-left:auto;margin-right:auto}
.pmeta{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin-bottom:22px}
.pmeta a:hover .lchip{opacity:.8}
.phead h1{font:800 clamp(2.4rem,5.6vw,4.8rem)/1 var(--display);font-stretch:116%;letter-spacing:-.03em;text-wrap:balance;max-width:20ch;margin-bottom:22px}
.phead .dek{max-width:58ch;margin-bottom:30px}
.byline{display:flex;align-items:center;gap:14px;padding-top:18px;border-top:1px solid var(--line-2);flex-wrap:wrap}
.byline img{width:44px;height:44px;object-fit:cover}
.byline b{display:block;font:700 16px var(--display);font-stretch:108%}
.byline span{color:var(--dim)}
.share{margin-left:auto;display:flex;gap:6px}
.sbtn{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line-2);color:var(--mut);background:var(--si);transition:border-color .25s,color .25s}
.sbtn:hover{border-color:var(--lc,var(--cu));color:var(--txt)}
.pgrid{display:grid;grid-template-columns:220px minmax(0,1fr);gap:clamp(32px,5vw,72px);max-width:1080px;margin:0 auto;padding-bottom:20px;min-width:0}
.pbody,.prose{min-width:0;max-width:100%}
.prose{overflow-wrap:break-word}
.prose pre,.prose pre *,.prose table,.prose th,.prose td{overflow-wrap:normal;word-break:normal}
.prose th,.prose td{text-align:left;-webkit-hyphens:auto;hyphens:auto}
.side{position:sticky;top:100px;align-self:start;display:grid;gap:26px;padding-left:22px}
.trace{position:absolute;left:0;top:4px;bottom:4px;width:2px;background:var(--line-2)}
.trace i{position:absolute;left:0;top:0;width:2px;height:0;background:var(--lc)}
.trace::after{content:"";position:absolute;left:-3px;top:var(--t,0%);width:8px;height:8px;background:var(--lc);transform:translateY(-4px)}
.toc .mono,.sshare .mono{display:block;color:var(--dim);margin-bottom:10px}
.toc ol{list-style:none;display:grid;gap:2px}
.toc a{display:flex;gap:10px;padding:5px 0;font-size:14px;line-height:1.35;color:var(--mut);transition:color .2s}
.toc a::before{content:"";flex:none;width:7px;height:7px;margin-top:.45em;border:1px solid var(--line-3);transition:background .25s,border-color .25s}
.toc a:hover,.toc a.on{color:var(--txt)}
.toc a.on::before{background:var(--lc);border-color:var(--lc)}
.sprog{color:var(--dim)}
.sprog b{color:var(--lc);font-weight:500}
.sshare div{display:flex;gap:6px}
.mtoc{display:none;border:1px solid var(--line-2);background:var(--si);margin-bottom:28px}
.mtoc summary{padding:14px 16px;cursor:pointer;display:flex;justify-content:space-between;color:var(--txt)}
.mtoc summary span{color:var(--dim)}
.mtoc ol{padding:0 16px 14px 34px;display:grid;gap:8px;color:var(--mut)}

.prose{font:400 18.5px/1.75 var(--body);color:#d6e0dd;max-width:68ch}
.prose>*+*{margin-top:1.15em}
.prose h2{font:800 clamp(1.6rem,2.6vw,2.1rem)/1.12 var(--display);font-stretch:112%;letter-spacing:-.02em;color:var(--txt);margin-top:2.2em;scroll-margin-top:96px;display:flex;align-items:baseline;gap:14px;text-wrap:balance}
.prose h2::before{content:"";flex:none;width:12px;height:12px;background:var(--lc);transform:translateY(-.1em)}
.prose h3{font:700 1.25rem/1.25 var(--display);font-stretch:108%;color:var(--txt);margin-top:1.8em}
.prose .hlink{margin-left:auto;font:500 14px var(--mono);color:var(--dim);opacity:0;transition:opacity .2s}
.prose h2:hover .hlink{opacity:1}
.prose a:not(.hlink){color:var(--txt);text-decoration:underline;text-decoration-color:var(--cu);text-underline-offset:4px;text-decoration-thickness:1.5px;transition:color .2s}
.prose a:not(.hlink):hover{color:var(--cu-2)}
.prose strong{color:var(--txt);font-weight:600}
.prose ul,.prose ol{padding-left:0;list-style:none;display:grid;gap:.55em}
.prose ul>li{position:relative;padding-left:26px}
.prose ul>li::before{content:"";position:absolute;left:4px;top:.72em;width:7px;height:7px;background:var(--lc)}
.prose ol{counter-reset:o}
.prose ol>li{position:relative;padding-left:36px;counter-increment:o}
.prose ol>li::before{content:counter(o,decimal-leading-zero);position:absolute;left:0;top:.2em;font:500 13px var(--mono);color:var(--lc)}
.prose blockquote{margin:1.8em 0;padding:22px 0 4px;border-top:1px solid var(--lc)}
.prose blockquote p{font:600 clamp(1.3rem,2.2vw,1.65rem)/1.35 var(--display);font-stretch:106%;color:var(--txt);letter-spacing:-.01em}
.prose code{font:500 .86em var(--mono);background:var(--si-3);border:1px solid var(--line-2);padding:1px 6px}
.prose pre{background:#050a0b;border:1px solid var(--line-2);padding:18px 20px;overflow:auto;font:400 14px/1.6 var(--mono)}
.prose pre code{background:none;border:0;padding:0}
.prose hr{border:0;height:2px;background:var(--spec-seg);margin:2.6em 0;opacity:.7}
.prose img{max-width:100%;height:auto;border:1px solid var(--line-2)}
.prose figure.shot{margin:2em 0}
.prose figure.shot img{display:block;width:100%;height:auto;background:var(--si-2)}
.prose figure.shot.phone{max-width:340px}
.prose figure.shot figcaption{margin-top:10px;font:400 14.5px/1.55 var(--body);color:var(--mut);text-align:start;-webkit-hyphens:manual;hyphens:manual}
.tbl{overflow-x:auto;border:1px solid var(--line-2);background-color:var(--si);background-image:linear-gradient(90deg,var(--si) 40%,transparent),linear-gradient(270deg,var(--si) 40%,transparent),radial-gradient(farthest-side at 0 50%,rgba(255,255,255,.14),transparent),radial-gradient(farthest-side at 100% 50%,rgba(255,255,255,.14),transparent);background-position:left,right,left,right;background-size:32px 100%,32px 100%,12px 100%,12px 100%;background-repeat:no-repeat;background-attachment:local,local,scroll,scroll}
.prose table{width:100%;border-collapse:collapse;font-size:15.5px;line-height:1.5}
.prose th{text-align:left;font:500 11.5px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--lc);padding:12px 16px;border-bottom:1px solid var(--line-3);background:var(--si-2)}
.prose td{padding:12px 16px;border-top:1px solid var(--line);vertical-align:top}
.prose tr:hover td{background:rgba(var(--lc-rgb),.04)}
.tldr{border:1px solid var(--line-2);background:var(--si-2);padding:22px 24px 24px;position:relative}
.tldr::before{content:"";position:absolute;left:-1px;right:-1px;top:-1px;height:2px;background:var(--lc)}
.tldr>.mono{display:block;color:var(--lc);margin-bottom:14px}
.tldr ol{gap:.7em}
.tldr li{font-size:16.5px;line-height:1.55;color:var(--txt)}
.callout{border:1px solid var(--line-2);background:var(--si-2);padding:18px 20px;position:relative}
.callout::before{content:"";position:absolute;left:-1px;right:-1px;top:-1px;height:2px;background:var(--L-ai)}
.callout.tip::before{background:var(--L-data)}
.callout.warn::before{background:var(--cu)}
.callout>.mono{display:block;margin-bottom:8px;color:var(--L-ai)}
.callout.tip>.mono{color:var(--L-data)}
.callout.warn>.mono{color:var(--cu)}
.callout p{font-size:16.5px;line-height:1.6;color:var(--txt)}

.pend{margin-top:clamp(48px,6vw,72px);display:grid;gap:28px;max-width:68ch}
.ptags{display:flex;flex-wrap:wrap;gap:8px 14px;text-transform:none;letter-spacing:.02em}
.ptags a{color:var(--mut);border:1px solid var(--line-2);padding:5px 10px;transition:border-color .2s,color .2s}
.ptags a:hover{border-color:var(--lc);color:var(--txt)}
.endshare{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding:18px 0;border-block:1px solid var(--line-2);color:var(--mut)}
.endshare div{display:flex;gap:6px}
.author .blk{display:grid;grid-template-columns:64px 1fr;gap:18px;padding:22px}
.author img{width:64px;height:64px;object-fit:cover}
.author .mono{color:var(--dim)}
.author b{display:block;font:700 20px var(--display);font-stretch:110%;margin:4px 0 6px}
.author p{color:var(--mut);font-size:15.5px}
.alinks{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:12px}
.pn{grid-template-columns:1fr 1fr}
.pn .blk{display:grid;gap:8px;padding:20px 22px;transition:background .25s}
.pn a.blk:hover{background:var(--si-3)}
.pn .mono{display:inline-flex;align-items:center;gap:8px;color:var(--lc)}
.pn b{font:700 17px/1.3 var(--display);font-stretch:106%}
.pn .next{text-align:right}
.pn .next .mono{justify-content:flex-end}
.pn-empty{background:var(--si)!important}
.related{padding-top:clamp(72px,9vw,120px)}
.rgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (min-width:1061px){.rgrid:has(>:nth-child(4):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}}
.rcard{display:flex;flex-direction:column;gap:12px;padding:24px;min-height:250px;transition:background .3s}
.rcard:hover{background:var(--si-3)}
.rcard h3{font:700 20px/1.2 var(--display);font-stretch:108%;text-wrap:balance}
.rcard p{color:var(--mut);font-size:15px}
.wall{display:flex;justify-content:space-between;align-items:center;margin-top:-1px;padding:20px 24px;border:1px solid var(--line-2);background:var(--si);font:700 18px var(--display);font-stretch:110%;transition:background .25s,color .25s}
.wall .mono{display:inline-flex;align-items:center;gap:8px;color:var(--cu-2)}
.wall:hover{background:var(--cu);color:var(--cu-ink)}
.wall:hover .mono{color:var(--cu-ink)}

/* footer extras */
.fsoc{display:flex;gap:8px;margin-top:18px}
.fsoc a{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line-2);color:var(--mut);transition:border-color .2s,color .2s}
.fsoc a:hover{border-color:var(--cu);color:var(--txt)}
.ftopics .lchip{text-transform:none;letter-spacing:0;font:500 15px var(--body);color:var(--mut)}
.ftopics a:hover .lchip{color:var(--txt)}
.sfoot .spec-rule{margin-top:44px;opacity:.8}
.sfoot .fbar{margin-top:0}

/* 404 */
.is-404 .bhero{min-height:100svh;display:flex;align-items:center}
.is-404 .bhero>.wrap{width:100%}

@media (max-width:1060px){
  .hrow{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .hrow .hdek{grid-column:1/-1}
  .tmap{grid-template-columns:repeat(3,minmax(0,1fr))}
  /* AI (3 topics) spans two rows so 5 lines fill 3 or 2 columns with no empty cell */
  .tmap>.tm-col:first-child{grid-row:span 2}
  .pgrid{grid-template-columns:1fr}
  .side{display:none}
  .mtoc{display:block}
  .rgrid{grid-template-columns:1fr 1fr}
  .rgrid>:last-child:nth-child(odd){grid-column:1/-1}
}
@media (max-width:760px){
  .ptitle{flex-direction:column;font-size:clamp(2.6rem,16vw,6rem)}
  .thero .ptitle{font-size:clamp(2.6rem,15vw,5rem)}
  .hrow,.lgrid,.band-in,.sgrid,.rgrid,.pn{grid-template-columns:1fr}
  .tmap{grid-template-columns:1fr 1fr}
  .tm-col{min-width:0}
  .tm-h{gap:8px;padding:12px 10px}
  .tm-h .lchip{min-width:0;overflow-wrap:break-word}
  .tm-b{min-width:0;padding:16px 12px}
  .tm-b h3,.tm-b p{overflow-wrap:break-word}
  .hrow>.blk{min-width:0}
  .hauthor{grid-template-columns:48px minmax(0,1fr)}
  .hauthor img{width:48px;height:48px}
  .tele .r{min-width:0}
  .tele dt{overflow-wrap:break-word}
  .ptitle .l{max-width:100%}
  .row{grid-template-columns:64px minmax(0,1fr);gap:14px}
  .row-date b{font-size:26px}
  .arrow{display:none}
  .tools{flex-direction:column;flex-wrap:nowrap;align-items:stretch}
  .search{min-width:0}
  .prose{font-size:17.5px}
  .prose table{font-size:14.5px}
  .prose th{padding:10px 12px;font-size:10.5px;letter-spacing:.04em}
  .prose td{padding:10px 12px}
  .byline .share{margin-left:0;width:100%}
  .pn .next{text-align:left}
  .pn .next .mono{justify-content:flex-start}
  .feat{min-height:0}
  .marking{flex-wrap:nowrap;align-items:stretch}
  .marking .live{display:flex;white-space:normal;max-width:100%}
}
@media (max-width:420px){
  .tmap{grid-template-columns:1fr}
  .prose th,.prose td{padding:9px 10px}
  .tm-h{padding:12px 16px}
  .tm-b{padding:18px 16px}
  .hrow>.blk{padding:22px 18px}
  .hdek{gap:22px}
  .cta .btn{max-width:100%;white-space:normal}
  .phead h1{font-size:clamp(2rem,10vw,2.8rem);overflow-wrap:break-word}
  .feedbox{min-width:0}
  .byline{gap:10px}
}

.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---- case studies (/work) ---- */
.is-work .wmeta{display:flex;flex-wrap:wrap;gap:8px 28px;margin-top:18px;color:var(--mut);font-size:13px}
.is-work .wmeta b{color:var(--lc);font-weight:500;margin-right:8px;text-transform:uppercase;letter-spacing:.06em}
.wfacts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin-top:28px;border:1px solid var(--line-2);background:var(--line-2)}
.wfact{background:var(--si-2);padding:18px 20px 20px;position:relative;min-width:0}
.wfact::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--lc)}
.wfact b{display:block;font-family:var(--display);font-size:clamp(26px,3.2vw,40px);line-height:1;color:var(--txt);letter-spacing:-.01em}
.wfact span{display:block;margin-top:10px;color:var(--mut);font-size:12px;line-height:1.45}
.wstack{border:1px solid var(--line-2);background:var(--si-2);padding:18px 20px;margin-bottom:28px}
.wstack>.mono{display:block;color:var(--lc);margin-bottom:12px}
.wstack ul{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.wstack li{border:1px solid var(--line-3);padding:5px 10px;font-size:13px;color:var(--txt)}
@media (max-width:760px){.wfacts{grid-template-columns:repeat(2,minmax(0,1fr))}.wfact{padding:14px 14px 16px}}