:root{--bg:#f7f3ec;--fg:#22201c;--muted:#6b645a;--soft:#4a453e;--rule:#ddd5c7;--accent:#7a3a1d;--quote:#efe8dc}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#171512;--fg:#ece7de;--muted:#a39b8e;--soft:#cfc8bb;--rule:#343027;--accent:#d88a5f;--quote:#221f1a}}
:root[data-theme="dark"]{--bg:#171512;--fg:#ece7de;--muted:#a39b8e;--soft:#cfc8bb;--rule:#343027;--accent:#d88a5f;--quote:#221f1a}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:400 19px/1.65 "Newsreader",Georgia,serif;-webkit-font-smoothing:antialiased}
a{color:var(--accent);text-underline-offset:3px}
.wrap{max-width:960px;margin:0 auto;padding:0 24px}
.meta{font:500 12px/1.4 "Inter",system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
header.site{padding-top:40px}
.top{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between}
.mast{border-top:3px solid var(--fg);border-bottom:1px solid var(--fg);padding:22px 0;margin-top:18px;display:flex;flex-wrap:wrap;gap:16px;align-items:baseline;justify-content:space-between}
.brand{text-decoration:none;color:var(--fg)}
.brand .name{font:500 64px/.95 "Newsreader",Georgia,serif;letter-spacing:-.02em;margin:0}
nav{display:flex;flex-wrap:wrap;gap:6px 24px;font:500 15px "Inter",system-ui,sans-serif}
nav a{color:var(--fg);text-decoration:none;padding-bottom:3px}
nav a[aria-current="page"]{border-bottom:2px solid var(--accent)}
main{padding:40px 0 72px}
.sec-head{padding-bottom:22px}
.sec-head h1{font:500 48px/1.1 "Newsreader",Georgia,serif;margin:8px 0 8px;letter-spacing:-.01em}
.sec-head p{margin:0;font-size:19px;color:var(--soft)}
.post-list{list-style:none;margin:0;padding:0}
.post-list li{display:grid;grid-template-columns:64px minmax(0,1fr) 170px;gap:20px;align-items:baseline;padding:20px 0;border-top:1px solid var(--rule)}
.post-list li:last-child{border-bottom:1px solid var(--rule)}
.num{font-size:26px;color:var(--accent)}
.post-list h2{font:500 28px/1.2 "Newsreader",Georgia,serif;margin:0 0 6px}
.post-list h2 a{color:var(--fg);text-decoration:none}
.post-list p{margin:0;font-size:17px;line-height:1.55;color:var(--soft)}
.post-list .info{font:500 13px "Inter",system-ui,sans-serif;color:var(--muted);text-align:right}
article{max-width:680px}
article h1{font:500 46px/1.1 "Newsreader",Georgia,serif;letter-spacing:-.01em;margin:8px 0 28px}
article time{font:500 12px "Inter",system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
article p,article li{font-size:19px}
article blockquote{margin:28px 0;padding:18px 24px;background:var(--quote);border-left:3px solid var(--accent);font-style:italic}
article img{max-width:100%;height:auto}
.back{display:inline-block;margin-top:40px;font:600 15px "Inter",system-ui,sans-serif}
.values{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.values span{font:600 12px "Inter",system-ui,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);border:1px solid var(--rule);padding:8px 14px}
.poeme{line-height:2}
.poeme p.stanza{margin:0;line-height:2}
.poeme p.stanza br{line-height:2}
.poeme p.indent{padding-left:3.5em;line-height:4}
.poeme p.sig{margin-top:2em;font-style:italic}
.contact{margin-top:48px;padding-top:28px;border-top:1px solid var(--rule)}
.contact h2{font:500 28px "Newsreader",Georgia,serif;margin:0 0 16px}
.contact form{display:flex;flex-direction:column;gap:16px;max-width:560px}
.contact label{display:flex;flex-direction:column;gap:6px;font:500 14px "Inter",system-ui,sans-serif;color:var(--muted)}
.contact input,.contact textarea{font:400 17px "Newsreader",Georgia,serif;color:var(--fg);background:var(--quote);border:1px solid var(--rule);padding:10px 12px;border-radius:2px}
.contact button{align-self:flex-start;font:600 14px "Inter",system-ui,sans-serif;background:var(--accent);color:var(--bg);border:0;padding:12px 22px;cursor:pointer;border-radius:2px}
.hp{display:none}
footer{border-top:1px solid var(--rule);padding:28px 0;text-align:center;font:500 14px "Inter",system-ui,sans-serif;color:var(--muted)}
@media (max-width:720px){
.post-list li{grid-template-columns:1fr;gap:6px}
.post-list .info{text-align:left}
.num{font-size:20px}
.brand .name{font-size:44px}
.sec-head h1{font-size:36px}
article h1{font-size:34px}
}
