:root{
  --ink:#1c1a17; --soft:#6b6558; --line:#e8e3da; --bg:#fffefb; --accent:#6cabc1; --accent-deep:#41788e;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Newsreader',Georgia,serif;background:var(--bg);color:var(--ink);line-height:1.65;font-size:19px}
.wrap{max-width:680px;margin:0 auto;padding:0 24px}
header{padding:44px 0 0}
nav{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:12px}
.logo{font-size:21px;font-weight:600;letter-spacing:-.01em;text-decoration:none;color:var(--ink)}
.nav-links{display:flex;gap:24px;flex-wrap:wrap;font-family:'Inter',sans-serif;font-size:13.5px;letter-spacing:.01em}
.nav-links a{text-decoration:none;color:var(--soft)}
.nav-links a:hover,.nav-links a.active{color:var(--accent-deep)}
main{padding-bottom:24px}
.kicker{font-family:'Inter',sans-serif;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-deep);margin-bottom:28px}
.page-head{padding:72px 0 40px}
.page-head h1{font-size:40px;font-weight:400;letter-spacing:-.015em;line-height:1.2}
.page-head .meta{font-family:'Inter',sans-serif;font-size:13px;color:var(--soft);margin-top:14px}
.post-hero{width:100%;max-height:420px;object-fit:cover;border-radius:6px;margin-bottom:8px}
.prose{padding-bottom:56px}
.prose h2{font-size:29px;font-weight:500;letter-spacing:-.01em;margin:48px 0 16px}
.prose h3{font-size:24px;font-weight:500;margin:40px 0 14px}
.prose h4{font-size:20px;font-weight:600;margin:32px 0 12px}
.prose p{margin-bottom:22px}
.prose a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:1.5px;text-underline-offset:4px}
.prose a:hover{color:var(--accent-deep)}
.prose ul,.prose ol{margin:0 0 22px 26px}
.prose li{margin-bottom:8px}
.prose blockquote{border-left:3px solid var(--accent);padding:4px 0 4px 24px;margin:28px 0;color:var(--soft);font-style:italic}
.prose figure{margin:32px 0}
.prose img{max-width:100%;height:auto;border-radius:4px}
.prose figure a{display:block;cursor:zoom-in}
.prose figure a img{transition:opacity .15s}
.prose figure a:hover img{opacity:.88}
.prose figcaption{font-family:'Inter',sans-serif;font-size:13px;color:var(--soft);margin-top:10px}
.prose hr{border:none;border-top:1px solid var(--line);margin:44px 0}
.prose audio{width:100%;margin:8px 0 22px}
.prose .aligncenter{text-align:center}
.prose .alignright{float:right;margin:0 0 20px 28px;max-width:45%}
.prose .alignleft{float:left;margin:0 28px 20px 0;max-width:45%}
.prose iframe{max-width:100%}
.prose center iframe{max-width:100%}
.prose .wp-block-columns{display:flex;gap:20px;flex-wrap:wrap}
.prose .wp-block-column{flex:1 1 240px;min-width:0}
.prose .wp-block-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;list-style:none;margin:32px 0}
.prose .wp-block-gallery figure{margin:0}
.prose .wp-block-gallery figure a{display:block;line-height:0}
.prose .wp-block-gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:50% 18%;display:block}
.prose .wp-block-separator{border:none;border-top:1px solid var(--line);margin:44px auto;width:120px}
.tweet-card{border:1px solid var(--line);border-radius:8px;padding:20px 24px;margin:28px 0;font-family:'Inter',sans-serif;font-size:15px}
.tweet-card a{color:var(--accent-deep);text-decoration:none;font-weight:500}
.video-frame{position:relative;padding-top:56.25%;margin:28px 0;border-radius:6px;overflow:hidden}
.video-frame iframe{position:absolute;inset:0;width:100%;height:100%}
.hero{padding:88px 0 64px;border-bottom:1px solid var(--line)}
.hero img{width:132px;height:132px;object-fit:cover;border-radius:50%;margin-bottom:32px}
.hero h1{font-size:44px;font-weight:400;letter-spacing:-.015em;line-height:1.18;margin-bottom:24px}
.hero h1 em{font-style:italic;color:var(--accent)}
.hero p{font-size:21px;color:var(--soft);max-width:56ch}
.hero p a,.now-item a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:4px}
.hero p a:hover,.now-item a:hover{text-decoration-color:var(--accent)}
section.home{padding:56px 0;border-bottom:1px solid var(--line)}
section.home:last-of-type{border-bottom:none}
.now-item{display:flex;gap:16px;margin-bottom:22px}
.now-item .dot{color:var(--accent);flex-shrink:0;line-height:1.65}
.post-row{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:15px 0;border-bottom:1px solid var(--line);text-decoration:none}
.post-row:last-of-type{border-bottom:none}
.post-row .t{font-size:21px;color:var(--ink);font-style:italic}
.post-row:hover .t{color:var(--accent-deep)}
.post-row .d{font-family:'Inter',sans-serif;font-size:12.5px;color:var(--soft);white-space:nowrap}
.all{display:inline-block;margin-top:20px;font-family:'Inter',sans-serif;font-size:13.5px;color:var(--accent-deep);text-decoration:none}
.news p{color:var(--soft);margin-bottom:24px;max-width:54ch}
.frame{border:1px solid var(--line);border-radius:4px;overflow:hidden;max-width:480px;background:#fff}
.filter{font-family:'Inter',sans-serif;font-size:15px;width:100%;padding:12px 16px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink);margin-bottom:28px}
.filter:focus{outline:none;border-color:var(--accent)}
.post-nav{border-top:1px solid var(--line);padding:36px 0 8px;font-family:'Inter',sans-serif;font-size:14px}
.post-nav a{color:var(--accent-deep);text-decoration:none}
.subscribe-nudge{border:1px solid var(--line);border-radius:8px;padding:28px;margin:20px 0 56px}
.subscribe-nudge .kicker{margin-bottom:12px}
.subscribe-nudge p{color:var(--soft);font-size:17px;margin-bottom:18px}
footer{border-top:1px solid var(--line);padding:36px 0 60px;font-family:'Inter',sans-serif;font-size:13px;color:var(--soft)}
.foot-row{display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px}
footer a{color:var(--soft);text-decoration:none;margin-right:0;margin-left:18px}
footer a:first-child{margin-left:0}
footer a:hover{color:var(--accent-deep)}
@media(max-width:560px){
  .hero h1{font-size:34px}
  .page-head h1{font-size:31px}
  .post-row{flex-direction:column;gap:4px}
  .prose .alignright,.prose .alignleft{float:none;margin:20px 0;max-width:100%}
}
