/* latin-ext */
@font-face {
  font-family: 'Roboto Serif';
  font-style: normal;
  font-weight: 300 500;
  font-stretch: 75%;
  font-display: swap;
  src: url(/assets/fonts/RobotoSerif-CondensedLatinExt.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto Serif';
  font-style: normal;
  font-weight: 300 500;
  font-stretch: 75%;
  font-display: swap;
  src: url(/assets/fonts/RobotoSerif-CondensedLatin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(/assets/fonts/Newsreader-VariableLatinExt.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(/assets/fonts/Newsreader-Variable.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{font-family:Switzer;src:url('/assets/fonts/Switzer-Variable.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:Switzer;src:url('/assets/fonts/Switzer-VariableItalic.woff2') format('woff2');font-style:italic;font-weight:100 900;font-display:swap}
:root{--pink:#f7969e;--ink:#171314;--white:#fffdfc;--muted:#784a52;--line:#17131424;--gutter:clamp(24px,4.4vw,80px);--ease:cubic-bezier(.22,.75,.15,1);--ui:12px;color-scheme:light}
* ,*::before,*::after{box-sizing:border-box}
html{background:var(--pink);-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;min-height:100svh;display:grid;grid-template-rows:auto 1fr auto;background:var(--pink);color:var(--ink);font:420 14px/1.5 Switzer,Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
img,svg,canvas{display:block;max-width:100%}
::selection{background:var(--ink);color:var(--pink)}
:focus-visible{outline:1px solid currentColor;outline-offset:6px}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.skip-link{position:fixed;z-index:100;top:12px;left:24px;transform:translateY(-180%);padding:12px 18px;background:var(--ink);color:var(--pink)}
.skip-link:focus{transform:none}
/* One header, one baseline. The empty slot is the punched page selection. */
.top{position:relative;z-index:10;display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:24px var(--gutter);view-transition-name:site-header}
.home{display:inline-flex;align-items:baseline;gap:11px;flex-shrink:0}
.home svg{width:23px;height:29px;align-self:center}
.brand-type{font-size:17px;font-weight:680;line-height:24px;letter-spacing:-.055em}
.tags{display:flex;align-items:baseline;gap:20px;font-size:var(--ui);font-weight:480;line-height:16px}
.tags a{position:relative;display:grid;place-items:center;width:52px;height:48px;isolation:isolate}
.tags a::before{content:'';position:absolute;width:34px;height:34px;border:1px solid var(--ink);border-radius:50%;opacity:0;transform:scale(.84);transition:opacity 180ms,transform 260ms var(--ease)}
@media(hover:hover){.tags a:not([aria-current]):hover::before{opacity:.22;transform:scale(1)}}
.tags a:focus-visible::before{opacity:.4;transform:scale(1)}
@property --cut{syntax:'<length>';inherits:false;initial-value:0px}
.nav-word{display:block;line-height:16px;--cut:0px;mask-image:radial-gradient(circle at center,transparent var(--cut),#000 calc(var(--cut) + .6px));-webkit-mask-image:radial-gradient(circle at center,transparent var(--cut),#000 calc(var(--cut) + .6px))}
.nav-hole{position:absolute;width:31px;height:31px;border-radius:50%;background:#dd808c;box-shadow:inset 0 1px 1.5px #5d30392b;opacity:0;transform:scale(.1);transition:transform 210ms cubic-bezier(.55,0,.15,1),opacity 110ms}
.tags a[aria-current] .nav-word{visibility:hidden}
.tags a[aria-current] .nav-hole,.tags a.is-cutting .nav-hole{opacity:1;transform:scale(1)}
.tags a[aria-current]::before{display:none}
/* Sparse, useful footer. No duplicated rows of captions. */
.foot{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));align-items:baseline;gap:16px;padding:24px var(--gutter) 28px;font-size:var(--ui);font-weight:450;line-height:16px}
.foot p{margin:0}
.foot__id{grid-column:1/4}
.foot__mail{grid-column:4/8;justify-self:start}
.foot__legal{grid-column:9/12;display:flex;gap:20px;justify-self:end}
.foot__copy{grid-column:12/13;text-align:right}
.foot a{transition:opacity 180ms}
.foot a:hover{opacity:.55}
/* Artwork, not a replacement type treatment. */
.page-home{height:100svh;min-height:540px;overflow:hidden}
.home-stage{display:flex;align-items:center;min-height:0;padding:0 var(--gutter) 4vh 13.5vw}
.signature{position:relative;display:block;width:min(65vw,106svh,1060px);max-width:100%;margin:0;padding:0;border:0;background:none;color:var(--white)}
.signature:focus-visible{outline-offset:12px}
.sig{position:relative;display:block;aspect-ratio:2045/1022}
.sig>img{width:100%;height:auto;visibility:hidden}
.sig>canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.sig.is-done>img{visibility:visible}.sig.is-done>canvas{visibility:hidden}
.coming-soon{position:absolute;left:83%;top:68%;white-space:nowrap;color:#b95e6d;font-size:10px;line-height:16px;pointer-events:none}
/* The book owns the work page. Its controls follow one quiet horizontal axis. */
.page-work{height:100svh;min-height:620px;overflow-x:clip}
.stage{position:relative;display:grid;grid-template-columns:minmax(0,1fr);place-items:center;min-width:0;min-height:0;overflow:visible;user-select:none;-webkit-user-select:none}
.paper-magazine{position:relative;flex-shrink:0;cursor:grab;overflow:visible;touch-action:none;user-select:none;-webkit-user-select:none}
.paper-magazine:active{cursor:grabbing}
.paper-magazine .stf__block{touch-action:none}
.paper-magazine .paper-page{position:absolute;background:#f4f2ef;overflow:hidden}
.paper-page img{display:block;width:100%;height:100%;object-fit:fill;pointer-events:none;user-select:none;-webkit-user-select:none}
.paper-page::before,.paper-page::after{display:none!important;content:none!important}
.paper-backing{background:#f1efe9!important}.paper-backing img{display:none!important}
.stf__outerShadow,.stf__innerShadow,.stf__hardShadow,.stf__hardInnerShadow{display:none!important}
.stage[data-page='1'][data-orientation='landscape'] .paper-magazine{transform:translateX(-25%)}
.pager{position:relative;z-index:2;display:grid;grid-template-columns:48px auto auto 48px;align-items:baseline;justify-content:center;gap:20px;font-size:var(--ui);line-height:16px}
.pager button{appearance:none;border:0;background:none;min-width:48px;min-height:48px;padding:16px 0;font-size:17px;line-height:16px;transition:opacity 160ms}
.pager button:hover{opacity:.5}.pager button:disabled{opacity:.2;cursor:default}
.counter{font-variant-numeric:tabular-nums;min-width:11ch;text-align:center}
.drag-hint{color:var(--muted);font-size:11px}
.page-work.is-reading .top,.page-work.is-reading .foot{visibility:hidden}
/* About: an off-centre name and two contacts. */
.about-page{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));align-content:start;column-gap:16px;padding:clamp(64px,14vh,156px) var(--gutter) clamp(80px,15vh,160px)}
.about-page__intro{grid-column:2/13}
.about-page__discipline{margin:0 0 26px;font-size:var(--ui);line-height:16px}
.about-page h1{display:flex;align-items:baseline;gap:clamp(24px,4vw,64px);margin:0;font-size:clamp(64px,8.8vw,142px);font-weight:740;letter-spacing:-.07em;line-height:.98}
.about-page h1 svg{width:clamp(38px,5vw,80px);height:auto;align-self:center;flex-shrink:0;color:var(--white);transform:rotate(-7deg)}
.about-page__details{grid-column:2/12;display:grid;grid-template-columns:1.6fr 1fr;gap:32px;align-items:baseline;margin-top:clamp(64px,12vh,140px)}
.about-page__details>a{display:inline-flex;gap:22px;align-items:baseline;justify-self:start;font-size:clamp(16px,1.6vw,24px);line-height:1.5;letter-spacing:-.03em;white-space:nowrap}
.about-page__details a span{display:inline-block;transition:transform 220ms var(--ease)}
.about-page__details a:hover span{transform:translate(3px,-3px)}
.legal{width:min(100%,1160px);margin-inline:auto;padding:clamp(48px,8vh,100px) var(--gutter) 100px}
.legal h1{margin:0 0 64px;font-size:clamp(38px,5vw,72px);font-weight:650;letter-spacing:-.05em;line-height:1.05}
.legal__row{display:grid;grid-template-columns:1fr 2.4fr;gap:24px;padding:24px 0;border-top:1px solid var(--line)}
.legal h2{margin:4px 0 0;font-size:var(--ui);font-weight:500;line-height:16px}
.legal__row>div{max-width:62ch;font-size:15px;line-height:1.75}
.legal p,.legal address{margin:0 0 1em;font-style:normal}.legal strong{font-weight:650}.legal a{text-decoration:underline;text-underline-offset:3px}
.todo{background:var(--white);padding:0 .25em}
.quiet{display:grid;place-items:center;padding:var(--gutter);min-height:60svh}.quiet h1{font-size:14px;font-weight:450}.quiet a{text-decoration:underline}
/* Short document entrances also work in browsers without view transitions. */
.about-page{animation:about-enter 420ms var(--ease) both}
.work .stage{animation:paper-enter 280ms ease-out both}
@keyframes about-enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes paper-enter{from{opacity:0}to{opacity:1}}
@media(max-width:760px){
 :root{--gutter:22px;--ui:11px}
 .top{padding-block:14px;gap:12px}
 .home{gap:8px}.home svg{width:21px;height:26px}.brand-type{font-size:14px}
 .tags{gap:4px}.tags a{width:44px;height:48px}
 .nav-hole{width:28px;height:28px}
 .foot{grid-template-columns:1fr auto;column-gap:16px;row-gap:12px;padding-top:18px;padding-bottom:22px}
 .foot__id{grid-column:1;grid-row:2;color:var(--muted)}
 .foot__mail{grid-column:1;grid-row:1}
 .foot__legal{grid-column:2;grid-row:1;gap:14px}
 .foot__copy{grid-column:2;grid-row:2}
 .home-stage{padding:0 6vw 5vh 5vw}.signature{width:90vw}.coming-soon{font-size:9px}
 .page-work{min-height:600px}
 .pager{gap:12px;grid-template-columns:44px auto 44px}
 .pager button{min-width:44px}.drag-hint{display:none}
 .pager [data-next]{grid-column:3;grid-row:1}
 .about-page{grid-template-columns:repeat(6,minmax(0,1fr));padding-top:12vh;padding-bottom:90px;column-gap:12px}
 .about-page__intro{grid-column:1/7}
 .about-page h1{font-size:clamp(46px,12vw,84px);gap:20px;letter-spacing:-.065em}
 .about-page h1 svg{width:36px}
 .about-page__discipline{margin-bottom:24px}
 .about-page__details{grid-column:1/7;grid-template-columns:minmax(0,1fr) auto;gap:18px;margin-top:72px}
 .about-page__details>a{font-size:clamp(12px,3.4vw,18px);gap:12px}
 .legal__row{grid-template-columns:1fr;gap:12px}
 .legal__row>div{font-size:14px}
}
@media(max-width:359px){
 :root{--gutter:18px;--ui:10px}
 .brand-type{font-size:13px}.home{gap:6px}.tags{gap:0}.tags a{width:42px}
 .foot__legal{gap:10px}.about-page h1{font-size:45px;gap:14px}.about-page h1 svg{width:30px}
}
@media(max-height:600px){
 .page-home{height:auto;min-height:100svh}.home-stage{min-height:280px}
 .page-work{height:auto;min-height:100svh}
}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
 ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
}
.home-stage{min-width:0}
/* A cut-out reads against the pink stock, rather than as a filled button. */
.nav-hole{background:var(--white);box-shadow:inset 0 .8px 1px #7c394d3d}



/* Large editorial title; chapter names come from the magazine itself. */
/* Cover stays centred while held, then the opening spread settles smoothly. */
.stage[data-page='1'][data-orientation='landscape'] .paper-magazine{transform:translateX(var(--cover-offset,0%))}
.paper-magazine{transform:translateX(var(--cover-offset,0%));transition:transform 360ms var(--ease)}
.pager{grid-template-columns:44px auto minmax(100px,200px) 44px;gap:22px}
.pager button{border-radius:50%;border:1px solid transparent;min-width:44px;min-height:44px;padding:13px 0;transition:border-color 180ms,background 180ms}
.pager button:hover:not(:disabled){opacity:1;border-color:var(--ink)}
.pager button:active:not(:disabled){background:var(--white)}
.pager [data-prev]{grid-column:1;grid-row:1}.pager [data-next]{grid-column:4;grid-row:1}
.counter{min-width:10ch;font-weight:570;font-size:12px}
.page-position{grid-column:3;grid-row:1;appearance:none;-webkit-appearance:none;width:100%;height:44px;padding:0;margin:0;background:transparent;cursor:pointer;touch-action:pan-x}
.page-position::-webkit-slider-runnable-track{height:1px;background:var(--ink)}
.page-position::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:12px;height:12px;border:0;border-radius:50%;background:var(--white);margin-top:-5.5px;box-shadow:0 0 0 4px var(--pink)}
.page-position::-moz-range-track{height:1px;background:var(--ink)}
.page-position::-moz-range-thumb{width:12px;height:12px;border:0;border-radius:50%;background:var(--white);box-shadow:0 0 0 4px var(--pink)}
[hidden]{display:none!important}
/* A separate reading surface: full-size pages, native scrolling and zoom. */
.page-work.is-reading .stage{display:block;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;touch-action:pan-x pan-y pinch-zoom;user-select:auto;-webkit-user-select:auto}
.reading-stream{position:relative;min-height:100%;padding:12px 0 32px}
.reading-stream figure{width:min(calc(100% - 48px),1000px);margin:0 auto 32px}
.reading-stream img{width:100%;height:auto;display:block;background:var(--white)}
.reading-stream figcaption{padding-top:8px;font-size:11px;line-height:16px;font-variant-numeric:tabular-nums;color:var(--muted)}
.reading-stream.is-enlarged{width:max(100%,1448px)}
.reading-stream.is-enlarged figure{width:1400px}
.page-work.is-reading .pager{grid-template-columns:44px auto minmax(100px,200px) auto 44px}
.pager .reader-zoom{grid-column:4;grid-row:1;border-radius:0;padding-inline:12px;font-size:11px;line-height:16px;white-space:nowrap}
.page-work.is-reading .pager [data-next]{grid-column:5}
/* A real tool is cropped by the viewport, with its die aligned to the word. */
/* Names and links share the deliberately marked stock of the placeholders. */
.legal .legal-mark,.legal a,.legal .todo{background:var(--white);padding:.05em .26em;box-decoration-break:clone;-webkit-box-decoration-break:clone;text-decoration:none}
.legal a{font-weight:520;overflow-wrap:anywhere;transition:font-weight 180ms,color 180ms}
.legal a:hover,.legal a:focus-visible{font-weight:750}
.legal a:focus-visible{outline-offset:3px}
@media(max-width:760px){
 .pager{grid-template-columns:40px auto minmax(64px,1fr) 40px;gap:12px}
 .pager button{min-width:40px}.counter{font-size:11px}
 .reading-stream figure{width:100%;margin-bottom:24px}
 .reading-stream.is-enlarged{width:190%}.reading-stream.is-enlarged figure{width:100%}
 .page-work.is-reading .pager{grid-template-columns:36px auto 1fr auto 36px;gap:6px}
 .page-work.is-reading .pager button{min-width:36px}.pager .reader-zoom{font-size:10px;padding-inline:3px}
}
@media(prefers-reduced-motion:reduce){.paper-magazine{transition:none}.punch-overlay{display:none}}
/* Title remains left; chapter and reading controls remain right. */
@media(max-width:760px){
}
/* Reserve the full page height before lazy-loaded pixels arrive. */
.reading-stream img{aspect-ratio:1400/1980;object-fit:contain}
.page-work.is-reading .stage{overflow-anchor:none}
/* The circular punch zone matches the existing menu outline. No rectangular
   overlay may cut across the tool. Both photo layers overlap in the jaw gap,
   so the metal body remains continuous before, during and after contact. */
.tags a::before{z-index:3;pointer-events:none}
.nav-word{position:relative;z-index:2}
.nav-hole{z-index:-3}
.page-work.is-reading .magazine-title br{display:none}
.reading-page{position:relative;width:100%;aspect-ratio:1400/1980;background:var(--white)}
.reading-page img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.page-work.is-reading .stage{place-items:normal}
.reading-stream{width:100%;justify-self:stretch}
/* The actual woven label stock, with its punched menu row. */
.tags{position:relative;isolation:isolate;padding:6px 10px;gap:16px;line-height:20px;transform-origin:12px 5px}
.tags a{width:66px;height:56px;font-size:14px}
.tags a::before{width:48px;height:48px}
.tags .nav-word{line-height:20px}
.tags.is-punching{transform:none!important;animation:none!important;transition:none!important}
.tags.has-stock{background:transparent}
.tags a{z-index:2;isolation:auto;font-weight:680;letter-spacing:-.025em}
.tags.has-stock .nav-hole{display:none}
.nav-stock{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;overflow:hidden}
/* Two parts of the same photograph: no swapped pose and no crossfade. */
.punch-overlay{position:fixed;inset:0;overflow:hidden;pointer-events:none}
.punch-rear{z-index:0}.punch-front{z-index:100}
.punch-tool{position:absolute;opacity:0;will-change:transform,opacity}
.punch-upper,.punch-lower{position:absolute;inset:0;background:url('/assets/img/punch-sprite-v1.webp') left top/200% 100% no-repeat;will-change:transform}
.punch-upper{clip-path:polygon(0 0,30% 0,30% 69%,25% 71%,16% 74%,16% 78%,8% 78%,8% 74%,0 74%)}
.punch-lower{clip-path:polygon(evenodd,0 0,100% 0,100% 100%,0 100%,0 0,30% 0,30% 69%,25% 71%,16% 74%,16% 78%,8% 78%,8% 74%,0 74%,0 0)}
/* Work: title beside the canvas, not a tall row pushing it down. */
.work{display:grid;position:relative;grid-template-columns:minmax(0,26fr) minmax(0,74fr);grid-template-rows:44px minmax(0,1fr) 44px;column-gap:24px;row-gap:8px;min-width:0;min-height:0;padding:8px var(--gutter) 0}
.magazine-info{display:contents}
.magazine-title{grid-column:1;grid-row:1/3;align-self:start;font-size:clamp(44px,6vw,110px);font-weight:780;letter-spacing:-.075em;line-height:.85;max-width:100%;z-index:2}
.magazine-tools{grid-column:2;grid-row:1;display:flex;align-items:baseline;justify-content:flex-end;gap:28px;min-width:0;line-height:20px}
.magazine-tools [data-chapter]{font-size:clamp(16px,1.55vw,23px);font-weight:680;letter-spacing:-.035em;line-height:20px;white-space:nowrap}
.magazine-tools [data-chapter]:empty{display:none}
.reading-toggle{appearance:none;border:0;background:none;padding:0;min-height:32px;font-size:var(--ui);font-weight:550;line-height:20px;white-space:nowrap}
.page-work:not(.is-reading) .stage{grid-column:2;grid-row:2;align-items:start;justify-items:center;padding-top:8px}
.page-work:not(.is-reading) .pager{grid-column:2;grid-row:3}
.page-work.is-reading .work{position:fixed;inset:0;z-index:40;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;gap:12px;padding:18px 24px 8px;background:var(--pink)}
.page-work.is-reading .magazine-info{display:flex;align-items:baseline;justify-content:space-between;gap:24px}
.page-work.is-reading .magazine-title{font-size:20px;line-height:24px;letter-spacing:-.05em;flex-shrink:0}
.page-work.is-reading .magazine-tools{gap:24px}
.page-work.is-reading [data-chapter]{font-size:14px;line-height:20px}
.page-work.is-reading .stage{grid-column:1;grid-row:2}
.page-work.is-reading .pager{grid-column:1;grid-row:3}
@media(max-width:760px){
 .tags{padding:4px 6px;gap:4px}.tags a{width:50px;height:50px;font-size:12px}.tags a::before{width:42px;height:42px}
 .work{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) 44px;gap:6px;padding:4px 12px 0}
 .magazine-info{display:grid;grid-column:1;grid-row:1;grid-template-columns:1fr;gap:6px;padding-inline:10px}
 .magazine-title{grid-column:1;grid-row:1;font-size:clamp(40px,11.5vw,52px);line-height:.95;white-space:nowrap}
 .magazine-title br{display:none}
 .magazine-tools{grid-column:1;grid-row:2;gap:20px;min-height:28px;align-items:baseline}
 .magazine-tools [data-chapter]{font-size:15px;line-height:20px;white-space:normal}
 .reading-toggle{min-height:28px;line-height:20px}
 .page-work:not(.is-reading) .stage{grid-column:1;grid-row:2;padding-top:4px}
 .page-work:not(.is-reading) .pager{grid-column:1;grid-row:3}
 .page-work.is-reading .work{padding:12px 12px 4px}
 .page-work.is-reading .magazine-info{padding:0;gap:12px}
 .page-work.is-reading .magazine-title{font-size:18px}
 .page-work.is-reading .magazine-tools{gap:12px;min-height:28px}
 .page-work.is-reading [data-chapter]{font-size:11px;line-height:16px}
}
@media(max-width:359px){.top{gap:8px}.tags{gap:2px;padding-inline:4px}}
@media(max-height:600px){.work{grid-template-rows:44px minmax(280px,1fr) 44px}}
@media(prefers-reduced-motion:reduce){.punch-overlay{display:none}}

/* Original PDF text stays selectable, including the small image captions. */
.reader-source{font-size:12px;line-height:20px;text-decoration:underline;text-underline-offset:3px}

.reading-stream figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:20px}

.reference-links small{display:block;font:450 11px/16px Switzer,Arial,sans-serif;color:var(--muted)}
.legal-draft{max-width:60ch;margin:-36px 0 48px;font-size:13px;line-height:1.6}
.legal .legal-note{font-size:12px;line-height:1.65;color:var(--muted)}
.about-page__details{grid-template-columns:1.6fr auto auto}
@media(max-width:760px){.about-page__details{grid-template-columns:1fr;gap:24px}.legal-draft{margin-top:-32px}}
/* Sources remain visible next to the page they describe, independently of prose. */
.reference-links{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:4px 16px;font:500 11px/16px Switzer,Arial,sans-serif}
.reference-links li{min-width:0}.reference-links a{overflow-wrap:anywhere}
.source-label{display:block;font:500 10px/16px Switzer,Arial,sans-serif;color:var(--muted);margin-bottom:4px}
.external-link .link-arrow{display:inline-block;margin-left:.25em;font-family:Switzer,Arial,sans-serif;font-size:.85em;transition:transform 180ms var(--ease)}
@media(hover:hover){.external-link:hover .link-arrow{transform:translate(1.5px,-1.5px)}}
@media(prefers-reduced-motion:reduce){.external-link .link-arrow{transition:none}}
/* Sources belong exclusively to the reading surface. */
.work{grid-template-rows:44px minmax(0,1fr) 44px}
.page-work:not(.is-reading) .pager{grid-row:3}
@media(max-width:760px){.work{grid-template-rows:auto minmax(0,1fr) 44px}}
/* Compact consent, outside document flow. No dialog and no footer shift. */
.privacy-notice{position:fixed;right:var(--gutter);bottom:calc(var(--footer-height,76px) + 10px);z-index:90;width:min(268px,calc(100% - 24px));padding:6px 10px;background:var(--white);color:var(--ink);font:430 10px/15px Switzer,Arial,sans-serif;box-shadow:none}
.privacy-notice p{margin:0}.privacy-notice a{text-decoration:underline;text-underline-offset:2px;white-space:nowrap}
.privacy-notice-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:0}
.privacy-notice button{appearance:none;border:0;background:none;padding:3px 0;min-height:26px;color:inherit;font:550 10px/15px Switzer,Arial,sans-serif;text-decoration:underline;text-underline-offset:2px}
.page-work .privacy-notice{bottom:calc(var(--footer-height,76px) + 58px)}
.page-work.is-reading .privacy-notice{bottom:58px}
.privacy-inline-choice{font:450 12px/1.5 Switzer,Arial,sans-serif}
.privacy-inline-choice button,.contact-reveal{appearance:none;border:0;background:var(--white);color:inherit;padding:.05em .26em;font:inherit;cursor:pointer}
.privacy-inline-choice button{margin:0 16px 8px 0;text-decoration:underline;text-underline-offset:3px}
.legal .contact-reveal:hover,.legal .contact-reveal:focus-visible{font-weight:750}
@media(max-width:760px){.privacy-notice{right:12px;width:min(268px,calc(100% - 24px))}}

/* Paired artwork stays a single paper surface, including on small screens. */
.paper-single{position:absolute;inset:0}
.paper-pair{position:absolute;inset:0;display:flex;align-items:flex-start}
.paper-magazine .paper-page.is-paired{background:transparent}
.paper-page .paper-pair img{width:50%;height:auto;aspect-ratio:760/1075;object-fit:contain}
.reading-page.is-spread{aspect-ratio:2800/1980;display:flex}
.reading-page.is-spread img{position:static;inset:auto;width:50%;height:100%;aspect-ratio:1400/1980;object-fit:contain}
.reading-text{margin-top:8px;color:var(--ink);white-space:normal}
.reading-text summary{font:550 12px/24px Switzer,Arial,sans-serif;cursor:pointer;width:fit-content}
.reader-information{max-width:680px;padding:16px 0 28px}
.reader-prose{font-family:'Roboto Serif',Georgia,serif;font-stretch:75%;font-weight:330;font-optical-sizing:auto;font-size:clamp(18px,1.5vw,21px);line-height:1.42;letter-spacing:0}
.reader-prose p{margin:0 0 1em;white-space:normal;user-select:text}
.reader-heading{font:700 clamp(20px,2vw,28px)/1.1 Switzer,Arial,sans-serif;letter-spacing:-.035em;margin:0 0 20px}
.reading-text a{font-family:Switzer,Arial,sans-serif;font-size:12px;font-weight:550;line-height:1.5;text-decoration:none;overflow-wrap:anywhere}
.reading-text .reference-links{margin:20px 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px 22px}
.reading-text .reference-links:first-child{margin-top:0}
@media(max-width:760px){.reader-information{padding:14px 4px 22px}.reader-prose{font-size:19px}}
.paper-single img{object-fit:contain;object-position:top center}
.reader-prose a{font-size:.82em;line-height:inherit}
.reader-prose .external-link{white-space:nowrap}
/* One quiet, left-to-right marker for editorial and utility links. */
.legal a,.reading-text a,.about-page__details>a,.foot a,.quiet a{
 background:linear-gradient(var(--white),var(--white)) left center/0% 100% no-repeat;
 box-decoration-break:clone;-webkit-box-decoration-break:clone;
 transition:background-size 360ms cubic-bezier(.22,1,.36,1),color 180ms;
 text-decoration:none;
}
.reading-text a{padding:.05em .2em}
.legal a:focus-visible,.reading-text a:focus-visible,.about-page__details>a:focus-visible,.foot a:focus-visible,.quiet a:focus-visible{
 background-size:100% 100%;outline:1px solid currentColor;outline-offset:3px;
}
@media(hover:hover){
 .legal a:hover,.reading-text a:hover,.about-page__details>a:hover,.foot a:hover,.quiet a:hover{background-size:100% 100%;opacity:1}
}
@media(hover:none){
 .legal a,.reading-text a{background-size:100% 100%}
 .about-page__details>a:active,.foot a:active,.quiet a:active{background-size:100% 100%}
}
@media(prefers-reduced-motion:reduce){
 .legal a,.reading-text a,.about-page__details>a,.foot a,.quiet a{transition:none}
}

/* A small pinned note; only its grip moves it, leaving the choices untouched. */
.privacy-notice{transform:rotate(-.65deg);transform-origin:90% 10%;box-shadow:0 2px 5px #34171b12}
.privacy-notice::before{content:'';position:absolute;top:-4px;left:42%;width:32px;height:8px;background:#fff9;transform:rotate(3deg);pointer-events:none}
.privacy-notice p{padding-right:16px;white-space:nowrap}
.privacy-notice .privacy-note-grip{position:absolute;right:1px;top:0;width:22px;min-height:22px;padding:0;text-decoration:none;color:#70464b;cursor:grab;touch-action:none;user-select:none;font-size:15px;line-height:22px}
.privacy-note-grip:focus-visible{outline:1px solid currentColor;outline-offset:1px}
.privacy-notice[data-moved]{right:auto!important;bottom:auto!important;transform:none}
.privacy-notice.is-dragging{box-shadow:0 5px 12px #34171b20}
.privacy-notice.is-dragging .privacy-note-grip{cursor:grabbing}
@media(prefers-reduced-motion:reduce){.privacy-notice{transform:none}}

/* The tape is the handle; keep the note below the desktop paper. */
.privacy-notice p{padding-right:0}
.privacy-notice .privacy-note-grip{left:calc(42% - 2px);right:auto;top:-10px;width:36px;min-height:24px;font-size:0;background:transparent}
.privacy-note-grip::after{content:'';position:absolute;left:10px;top:10px;width:14px;height:1px;background:currentColor;opacity:0;transition:opacity 180ms}
.privacy-notice:hover .privacy-note-grip::after,.privacy-note-grip:focus-visible::after{opacity:.28}
@media(min-width:761px){
 .page-work:not(.is-reading) .work{grid-template-columns:minmax(0,26fr) minmax(0,74fr)}
 .page-work:not(.is-reading) .stage{justify-items:center;margin-top:-24px;padding-top:0}
 .page-work:not(.is-reading) .privacy-notice{bottom:calc(var(--footer-height,76px) + 10px)}
}



/* Each page has its own starting position; a visitor's choice takes priority. */
.page-work .privacy-notice{left:var(--gutter);right:auto;bottom:calc(var(--footer-height,76px) + 10px)}
.page-work.is-reading .privacy-notice{bottom:58px}
.page-about .privacy-notice{top:132px;bottom:auto}
@media(max-width:760px){
 .page-work .privacy-notice{left:12px;bottom:calc(var(--footer-height,76px) + 58px)}
 .page-work.is-reading .privacy-notice{bottom:58px}
 .page-about .privacy-notice{top:104px}
}
@media(min-width:761px){
 .page-work:not(.is-reading) .magazine-tools{display:contents}
 .page-work:not(.is-reading) .magazine-tools [data-chapter]{grid-column:2;grid-row:1;align-self:start;justify-self:end}
 .page-work:not(.is-reading) .reading-toggle{position:absolute;left:var(--gutter);top:calc(clamp(74.8px,10.2vw,187px) + 22px);z-index:3}
}

.reader-context{margin-top:26px}
.reader-context h3{margin:0 0 12px;font:650 12px/18px Switzer,Arial,sans-serif}
.reader-context ul{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.reader-context li{min-width:0}
.reader-context p{margin:5px 0 0;font:430 12px/1.5 Switzer,Arial,sans-serif;max-width:56ch;color:var(--muted)}
.internal-reference .link-arrow{display:inline-block;margin-left:.25em;font-family:Switzer,Arial,sans-serif;font-size:.85em;transition:transform 180ms var(--ease)}
@media(hover:hover){.internal-reference:hover .link-arrow{transform:translateX(2px)}}
@media(prefers-reduced-motion:reduce){.internal-reference .link-arrow{transition:none}}
/* Legal information stays marked; hover adds weight only. */
.legal a{background:var(--white);background-size:auto;font-weight:520;transition:font-weight 180ms}
.legal a:hover,.legal a:focus-visible{background:var(--white);font-weight:750}
.legal .external-link:hover .link-arrow{transform:none}
.legal a[href="https://fabric8.biz/"]{display:inline-block;white-space:nowrap}

/* A short cue explains the reading surface; the progress rail remains quiet. */
.reader-scroll{position:fixed;right:12px;top:38%;z-index:45;display:flex;align-items:center;flex-direction:column;gap:16px;width:44px;padding:16px 8px 12px;border:0;background:var(--white);font:650 12px/1 Switzer,Arial,sans-serif;color:var(--ink);opacity:1;transition:opacity 300ms,background-color 300ms}
.reader-scroll-word{writing-mode:vertical-rl;transition:opacity 300ms}
.reader-scroll-track{position:relative;width:2px;height:100px;background:#21191a29}
.reader-scroll-track i{position:absolute;inset:0;background:var(--ink);transform:scaleY(var(--reader-progress,.035));transform-origin:top}
.reader-scroll-track::after{content:"";position:absolute;left:-2px;top:0;width:6px;height:20px;background:var(--ink);animation:reader-travel 2s cubic-bezier(.4,0,.2,1) 6}
.reader-scroll-arrow{font-size:28px;line-height:1;animation:reader-nudge 2s cubic-bezier(.4,0,.2,1) 6}
.reader-scroll.is-used{background:transparent;opacity:.6}
.reader-scroll.is-used .reader-scroll-word{opacity:1}
.reader-scroll.is-used .reader-scroll-arrow{animation:none}
.reader-scroll.is-used .reader-scroll-track::after{display:none}
.reader-scroll:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.reader-scroll:disabled{cursor:default;opacity:.25}
@keyframes reader-nudge{0%,100%{transform:translateY(0)}55%{transform:translateY(8px)}}
@keyframes reader-travel{0%{opacity:0;transform:translateY(0)}15%{opacity:1}80%{opacity:1}100%{opacity:0;transform:translateY(80px)}}
.stage.is-loading::after,.reading-page.is-loading::after{content:'';position:absolute;bottom:0;left:0;width:100%;height:2px;background:linear-gradient(90deg,transparent 0%,#21191a55 50%,transparent 100%);background-size:200% 100%;animation:paper-loading 1.4s ease-in-out infinite;pointer-events:none}
.stage.is-loading::after{left:25%;width:50%;bottom:10px}
@keyframes paper-loading{from{background-position:200% 0}to{background-position:-100% 0}}
.reading-page img{opacity:0;transition:opacity 260ms ease-out}
.reading-page img.is-ready{opacity:1}
.reading-page.has-error::after{display:none}
.reading-error{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:20px;background:var(--white);font:450 12px/1.5 Switzer,Arial,sans-serif;text-align:center}
.reading-error p,.magazine-error p{margin:0}
.reading-error button,.magazine-error button{border:0;padding:8px 0;background:none;text-decoration:underline;text-underline-offset:3px;font:600 12px/1.5 Switzer,Arial,sans-serif}
.magazine-error{text-align:center;align-self:center;font:450 13px/1.5 Switzer,Arial,sans-serif}
/* The missing zero is a punched opening; one paper disc leaves the surface. */
.notfound{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:center;gap:7vw;padding:7vh 8vw 12vh;overflow:hidden}
.notfound-mark{display:flex;align-items:center;justify-content:center;gap:.065em;position:relative;isolation:isolate;appearance:none;border:0;padding:0;background:none;color:var(--ink);font:780 clamp(130px,21vw,340px)/.8 Switzer,Arial,sans-serif;letter-spacing:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
.notfound-mark>span:not(.notfound-hole){display:block;flex:none;width:.59em;text-align:center}
.notfound-mark:focus-visible{outline:1px solid var(--ink);outline-offset:18px}
.notfound-hole{display:block;position:relative;flex:none;width:.61em;height:.61em;margin-top:.07em;border-radius:50%;background:var(--white)}
.notfound-hole i{position:absolute;inset:0;border-radius:inherit;background:var(--pink,#f7969e);box-shadow:inset 0 0 0 1px #21191a20;pointer-events:none;transform-origin:75% 100%;animation:paper-punch 1450ms cubic-bezier(.3,0,.2,1) both}
.notfound-mark.is-replaying .notfound-hole i{animation:none}
@keyframes paper-punch{0%,14%{opacity:1;transform:translate3d(0,0,0) rotate(0)}22%{opacity:1;transform:translate3d(0,3px,0) rotate(-4deg)}43%{opacity:1;transform:translate3d(-.025em,.08em,0) rotate(14deg)}78%,100%{opacity:0;transform:translate3d(.12em,.8em,0) rotate(75deg)}}
.notfound-copy{position:relative;z-index:1}
.notfound-copy .micro{margin:0 0 22px;letter-spacing:.06em}
.notfound-copy h1{font:730 clamp(32px,3.6vw,58px)/1.05 Switzer,Arial,sans-serif;letter-spacing:-.02em;word-spacing:.04em;margin:0 0 22px}
.notfound-copy>p:not(.micro){font-size:13px;line-height:1.55;margin:0;max-width:28ch}
.notfound-links{display:flex;gap:12px 24px;flex-wrap:wrap;margin-top:32px;font:550 12px/1.5 Switzer,Arial,sans-serif}
.notfound-links a{padding:.12em .25em;background:linear-gradient(var(--white),var(--white)) left center/0% 100% no-repeat;transition:background-size 360ms var(--ease);white-space:nowrap}
.notfound-links a:hover,.notfound-links a:focus-visible{background-size:100% 100%}
@media(max-width:760px){
 .reader-scroll{right:0;top:36%;gap:12px;width:32px;padding:12px 5px 10px;font-size:11px}.reader-scroll-track{height:100px}.reader-scroll-arrow{font-size:24px}
 .notfound{grid-template-columns:1fr;align-content:center;gap:52px;padding:7vh 9vw 10vh}
 .notfound-mark{font-size:clamp(120px,40vw,250px);justify-content:flex-start}
 .notfound-copy h1{font-size:clamp(32px,9.5vw,44px)}.notfound-copy h1 br{display:none}
}
@media(prefers-reduced-motion:reduce){.reader-scroll-arrow,.stage.is-loading::after,.reading-page.is-loading::after,.notfound-hole i{animation:none}.notfound-hole i{opacity:0}.reading-page img,.reader-scroll-word{transition:none}}

@media(prefers-reduced-motion:reduce){.reader-scroll-track::after{animation:none;display:none}.reader-scroll{transition:none}}

/* Keep the same raster surface after drawing; no canvas/image hand-off. */
.sig.is-canvas-ready.is-done>img{visibility:hidden}
.sig.is-canvas-ready.is-done>canvas{visibility:visible}
.home svg:not(.is-signet-ready){opacity:0}
.notfound-copy>p:not(.micro){font:420 clamp(18px,1.65vw,24px)/1.4 Newsreader,Georgia,serif;max-width:27ch}
.notfound-copy .micro{letter-spacing:0;font-weight:600}
.reading-stream{animation:reader-arrive 520ms cubic-bezier(.22,1,.36,1) both}
.reader-scroll:not([hidden]):not(.is-used){animation:reader-cue-enter 520ms 180ms cubic-bezier(.22,1,.36,1) both}
.reader-scroll-track i{transition:transform 100ms linear}
@keyframes reader-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes reader-cue-enter{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:translateX(0)}}
@media(prefers-reduced-motion:reduce){
 .home svg:not(.is-signet-ready){opacity:1}
 .reading-stream,.reader-scroll:not([hidden]):not(.is-used){animation:none}
 .reader-scroll-track i{transition:none}
}