:root{--bg:#f4f2ee;--fg:#1c1b19;--mut:#77736b;--line:#dcd8d0;--acc:#9a5b2e;color-scheme:light}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#121211;--fg:#e9e6df;--mut:#8f8a80;--line:#2b2a27;--acc:#d49a6a;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#121211;--fg:#e9e6df;--mut:#8f8a80;--line:#2b2a27;--acc:#d49a6a;color-scheme:dark}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:17px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit}
.wrap{max-width:1180px;margin:0 auto;padding:0 16px}
header.top{display:flex;justify-content:space-between;align-items:baseline;padding:28px 0 0}
.logo{font:600 15px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;text-decoration:none}
.top nav a{color:var(--mut);text-decoration:none;font-size:15px}
.top nav a:hover{color:var(--fg)}
h1,h2{font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;font-weight:500;letter-spacing:-.01em}
.hero{padding:72px 0 40px;max-width:40em}
.hero h1{font-size:clamp(34px,6vw,56px);line-height:1.08;margin:0 0 18px}
.hero p{color:var(--mut);margin:0;font-size:19px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,500px),1fr));gap:48px 32px;padding:24px 0 80px}
.card{text-decoration:none;display:block}
.card img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;display:block;background:var(--line);transition:opacity .2s}
.card:hover img{opacity:.88}
.card h2{font-size:28px;margin:16px 0 2px}
.meta{color:var(--mut);font-size:15px}
.series-head{padding:64px 0 16px;max-width:38em}
.series-head h1{font-size:clamp(36px,6vw,60px);line-height:1.05;margin:0 0 10px}
.intro{max-width:38em;padding-bottom:40px}
.intro p{margin:0 0 1em;font-size:19px}
.story{display:flex;flex-direction:column;gap:72px;padding:24px 0 96px}
figure{margin:0 auto;width:100%}
figure img{display:block;width:100%;height:auto;background:var(--line)}
figcaption{display:flex;flex-wrap:wrap;gap:4px 16px;justify-content:space-between;margin-top:12px;font-size:16px}
figcaption .x{color:var(--mut);font-size:13px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
body{overflow-wrap:anywhere}
.next{border-top:1px solid var(--line);padding:40px 0 24px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.next a{text-decoration:none}
.next a:hover span{color:var(--acc)}
.next small{display:block;color:var(--mut);font-size:14px}
.next span{font-family:"Iowan Old Style",Palatino,Georgia,serif;font-size:26px}
footer{border-top:1px solid var(--line);color:var(--mut);font-size:14px;padding:24px 0 40px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}
@media (max-width:640px){.story{gap:48px}.hero{padding:48px 0 24px}.series-head{padding:40px 0 8px}}