@font-face{font-family:Inter Tight;src:url('fonts/inter-tight-latin.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
:root{--paper:#ebebeb;--ink:#0a0b0d;--soft:#55565a;--muted:#55565a;--line:#caccce;--accent:#31515c;--warm:#e2e7e8;--sans:'Inter Tight',system-ui,sans-serif}
*{box-sizing:border-box}html{background:var(--paper);scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.6 var(--sans);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}button{font-family:inherit}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.inner-header{position:sticky;top:16px;z-index:30;display:flex;align-items:center;gap:24px;width:min(1040px,calc(100% - 40px));height:64px;padding:0 20px;margin:16px auto 0;border:1px solid #ffffffa6;border-radius:18px;background:rgba(245,245,245,.94);backdrop-filter:blur(16px);box-shadow:0 8px 32px #00000008}.inner-header .jp{font:750 28px/1 var(--sans);letter-spacing:-2px;margin-right:auto}.inner-header .back{font-size:13px;font-weight:500}.site-language-picker{position:relative;flex:none}.site-language-picker summary{width:38px;height:38px;display:grid;place-items:center;cursor:pointer;list-style:none;border:1px solid #0002;border-radius:10px}.site-language-picker summary::-webkit-details-marker{display:none}.site-language-picker summary svg{width:18px;height:18px}.site-language-picker nav{position:absolute;right:0;top:calc(100% + 12px);padding:6px;border:1px solid var(--line);border-radius:10px;background:#fff;box-shadow:0 8px 24px #0002}.site-language-picker:not([open]) nav{display:none}.site-language-picker nav a{display:block;padding:10px 16px;border-radius:5px;font:500 12px/1.5 var(--sans)}.site-language-picker nav a:hover,.site-language-picker nav a[aria-current=true]{background:var(--accent);color:#fff}
.archive-page .intro{width:min(1120px,calc(100% - 80px));margin:auto;padding:64px 0 40px}.archive-page .eyebrow{font-size:11px;letter-spacing:.13em;color:var(--accent);text-transform:uppercase;margin:0 0 22px}.archive-page h1{margin:0;font:550 clamp(48px,7.5vw,96px)/1.02 var(--sans);letter-spacing:-.065em}.archive-page .intro>p:last-child{font-size:21px;line-height:1.5;font-weight:350;color:var(--soft);max-width:680px;margin:26px 0 0}.archive-page main{width:min(1120px,calc(100% - 80px));margin:0 auto 64px;display:grid;gap:24px}.publication{display:grid;grid-template-columns:36px minmax(0,1fr) 210px;gap:28px;align-items:center;padding:34px;background:#fff;border:1px solid #d9dddf;border-radius:22px}.number{align-self:start;color:var(--accent);font-size:12px;letter-spacing:.1em}.publication .copy{min-width:0}.copy small{display:block;font-size:11px;letter-spacing:.1em;color:var(--soft);text-transform:uppercase;margin-bottom:14px}.copy h2{font:500 clamp(32px,4vw,46px)/1.1 var(--sans);letter-spacing:-.05em;margin:0}.copy p{font-size:18px;font-weight:350;line-height:1.6;color:var(--soft);max-width:540px;margin:20px 0 24px}.actions{display:flex;flex-wrap:wrap;gap:12px}.actions a{display:inline-flex;align-items:center;justify-content:center;min-height:46px;border:1px solid #c8cdcf;border-radius:11px;padding:12px 17px;font-size:14px;font-weight:550}.actions a:first-child{background:var(--accent);color:#fff;border-color:var(--accent)}.actions a:hover{opacity:.85}.publication .cover{width:100%;max-width:210px;justify-self:end;box-shadow:0 12px 28px #0a0b0d20;filter:grayscale(1);border-radius:3px}.archive-page footer{width:min(1120px,calc(100% - 80px));margin:auto;padding:24px 0 32px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;font-size:12px;color:var(--soft)}
/* Magazine controls share the website identity; magazine pages retain their artwork. */
body.reader-page{--paper:#ebebeb;--warm:#e2e7e8;--accent:#31515c;background:#ebebeb;font-family:var(--sans)}body.reader-page .inner-header{position:relative;top:auto}body.reader-page header.hero{width:min(1120px,calc(100% - 80px));margin:0 auto;min-height:0;padding:56px 0;grid-template-columns:minmax(0,1fr) 260px;gap:64px;background:transparent;color:var(--ink);border-bottom:0}body.reader-page .hero .eyebrow{color:var(--accent);font:500 11px/1.5 var(--sans);letter-spacing:.12em}body.reader-page .hero h1{font:550 clamp(48px,7vw,86px)/1.02 var(--sans);letter-spacing:-.06em}body.reader-page .hero .intro{font:350 21px/1.55 var(--sans);color:var(--soft);margin-top:24px}body.reader-page .hero .cover{box-shadow:0 14px 32px #0a0b0d24;border-radius:4px}body.reader-page .actions{gap:10px}body.reader-page .button{font:550 14px/1.4 var(--sans);text-transform:none;letter-spacing:0;border-radius:11px;min-height:48px;padding:12px 16px;color:var(--ink);border-color:#bcc4c8}body.reader-page .button.primary{background:var(--accent);border-color:var(--accent);color:#fff}body.reader-page .guide{width:min(1120px,calc(100% - 80px));margin:0 auto 32px;padding:28px 32px;border:0;background:#f7f8f8;border-radius:18px}body.reader-page .guide h2{font:500 28px/1.2 var(--sans);letter-spacing:-.035em}body.reader-page .guide p{font:400 16px/1.6 var(--sans);color:var(--soft)}body.reader-page .toolbar{background:rgba(235,235,235,.97);border-color:var(--line);gap:8px;padding:10px;color:var(--ink)}body.reader-page .toolbar a,body.reader-page .toolbar button{border:1px solid #c2c9cc;border-radius:9px;background:#fff;color:var(--ink);font:550 13px/1 var(--sans);min-height:42px}body.reader-page #counter{font-family:var(--sans);color:var(--soft)}body.reader-page .reader{background:transparent}body.reader-page .page-head{font-family:var(--sans)}body.reader-page .toc-card{background:#f5f6f6;border-radius:20px}body.reader-page .toc h2{font:500 30px/1.1 var(--sans)}body.reader-page .toc-close{border-radius:9px;background:var(--accent)}body.reader-page .toc-list{border-color:var(--line);background:var(--line);gap:1px}body.reader-page .toc-list a{background:#fff;font-family:var(--sans)}body.reader-page .toc-list a:hover{background:#e5ecee}body.reader-page .toc-list b{color:var(--accent)}body.reader-page .page-translation{background:#f3f6f6;color:var(--ink);border-color:var(--accent)}body.reader-page .page-translation>span{color:var(--accent)}body.reader-page .page-translation h2,body.reader-page .page-translation p{font-family:var(--sans)}body.reader-page footer{background:#31515c;color:#fff;border:0;padding:36px 22px 46px;font-family:var(--sans)}body.reader-page footer strong{font:500 28px/1.2 var(--sans)}body.reader-page footer a{color:#fff;text-decoration:underline;text-underline-offset:4px}
@media(max-width:760px){.inner-header{width:calc(100% - 32px);height:58px;top:12px;margin-top:12px;padding:0 16px;border-radius:16px;gap:16px}.inner-header .back{font-size:12px}.archive-page .intro{width:calc(100% - 44px);padding:38px 0 30px}.archive-page .eyebrow{font-size:10px;letter-spacing:.09em;margin-bottom:18px}.archive-page h1{font-size:clamp(42px,11.5vw,62px)}.archive-page .intro>p:last-child{font-size:18px;margin-top:20px}.archive-page main{width:calc(100% - 32px);gap:20px;margin-bottom:38px}.publication{position:relative;grid-template-columns:1fr 82px;gap:20px;padding:24px 20px;border-radius:18px;align-items:start}.publication .number{position:absolute;right:20px;top:18px;font-size:10px}.publication .copy{grid-column:1/-1;grid-row:2}.publication .cover{grid-column:1;grid-row:1;width:100px;max-width:100%;justify-self:start}.publication .copy small{font-size:10px;line-height:1.5;margin-bottom:10px}.publication .copy h2{font-size:34px}.publication .copy p{font-size:17px;margin:16px 0 20px}.publication .actions{gap:10px;flex-wrap:wrap}.publication .actions a{font-size:13px;min-height:46px;padding:11px 14px}.archive-page footer{width:calc(100% - 44px);font-size:11px;flex-wrap:wrap}body.reader-page header.hero{width:calc(100% - 44px);grid-template-columns:1fr;gap:28px;padding:36px 0}body.reader-page .hero .cover{order:0;grid-row:2;width:160px;justify-self:center}body.reader-page .hero h1{font-size:clamp(46px,12vw,64px)}body.reader-page .hero .intro{font-size:18px;line-height:1.55}body.reader-page .actions{display:flex;flex-wrap:wrap}body.reader-page .button{font-size:13px}body.reader-page .guide{width:calc(100% - 32px);padding:24px 20px;margin-bottom:24px}body.reader-page .guide h2{font-size:25px}body.reader-page .toolbar{gap:4px;padding:8px 6px;justify-content:space-between}body.reader-page .toolbar a,body.reader-page .toolbar button{font-size:11px;padding:0 7px}body.reader-page #counter{min-width:48px;font-size:10px}body.reader-page .page-translation{border-left-color:#f3f6f6;border-right-color:#f3f6f6}body.reader-page .toc-card{padding:20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Let cover height follow intrinsic aspect ratio, not the HTML height attribute. */
.publication .cover,body.reader-page .hero .cover{height:auto;min-height:0;object-fit:contain;align-self:start}
/* Compact archive cards with a proportionate cover beside the title. */
[data-smart-header]{transition:transform .22s ease}
@media(max-width:760px){
 .inner-header[data-smart-header]{height:52px;top:8px;margin-top:8px;padding:0 14px;border-radius:14px}
 .inner-header[data-smart-header].header-away{transform:translateY(calc(-100% - 20px));pointer-events:none}
 .archive-page .intro{padding-top:32px}
 .archive-page .publication{grid-template-columns:84px minmax(0,1fr);grid-template-rows:auto auto auto auto;gap:10px 18px;padding:22px 20px}
 .archive-page .publication .number{display:none}
 .archive-page .publication .cover{grid-column:1;grid-row:1/3;width:84px;height:auto;align-self:start}
 .archive-page .publication .copy{display:contents}
 .archive-page .publication .copy small{grid-column:2;grid-row:1;align-self:end;margin:0;font-size:10px;line-height:1.5}
 .archive-page .publication .copy h2{grid-column:2;grid-row:2;align-self:start;font-size:30px;line-height:1.1;margin:0}
 .archive-page .publication .copy p{grid-column:1/-1;grid-row:3;margin:8px 0 6px;font-size:16px;line-height:1.55}
 .archive-page .publication .actions{grid-column:1/-1;grid-row:4;gap:10px}
 .archive-page .publication .actions a{font-size:13px}
}
@media(prefers-reduced-motion:reduce){[data-smart-header]{transition:none}}

/* Shared two-tone personal monogram. */
.jp{color:#0a0b0d}.jp .jp-accent{color:#31515c}