:root{--paper:#f6f0e4;--card:#fffaf0;--ink:#1d2320;--mute:#6b6a60;--rule:#d9cfba;--accent:#b8431f;--teal:#1f5c55;--r:14px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.55 "Avenir Next","Gill Sans","Trebuchet MS",system-ui,sans-serif;overflow-x:hidden}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
h1,h2,h3,.mark{font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif}
.top{border-bottom:1px solid var(--rule)}
.top .wrap{display:flex;justify-content:space-between;align-items:baseline;padding-top:14px;padding-bottom:14px;gap:12px}
.mark{margin:0;font-weight:700;font-size:1.15rem;display:flex;align-items:center;gap:8px}
.dot{width:12px;height:12px;border-radius:50%;background:var(--accent);box-shadow:8px 0 0 var(--teal),16px 0 0 var(--ink);margin-right:16px}
.aside{margin:0;color:var(--mute);font-size:.8rem}
.hero{padding:44px 0 28px;max-width:720px}
h1{font-size:clamp(2rem,6.4vw,3.6rem);line-height:1.05;margin:0 0 16px;letter-spacing:-.02em}
h1 em{color:var(--accent);font-style:italic}
.lede{font-size:1.1rem;color:#3b4139;margin:0 0 26px}
.ask label[for=handle]{display:block;font-weight:600;font-size:.85rem;margin-bottom:6px;text-transform:uppercase;letter-spacing:.06em}
.row{display:flex;gap:10px;flex-wrap:wrap}
input[type=text],#handle{flex:1 1 260px;min-width:0;font:inherit;padding:14px 16px;border:2px solid var(--ink);border-radius:var(--r);background:#fff;color:var(--ink)}
#handle:focus{outline:3px solid var(--teal);outline-offset:2px}
.go,.support{font:inherit;font-weight:700;background:var(--ink);color:var(--paper);border:0;border-radius:var(--r);padding:14px 22px;cursor:pointer;text-decoration:none;display:inline-block;text-align:center}
.go:hover{background:var(--accent)}
.win{border:0;padding:0;margin:16px 0 8px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.win legend{float:left;margin-right:10px;font-size:.85rem;color:var(--mute);padding:0}
.win label{cursor:pointer}
.win input{position:absolute;opacity:0}
.win span{display:inline-block;padding:6px 13px;border:1px solid var(--rule);border-radius:99px;font-size:.88rem;background:var(--card)}
.win input:checked+span{background:var(--teal);color:#fff;border-color:var(--teal)}
.win input:focus-visible+span{outline:3px solid var(--accent)}
.tiny{font-size:.78rem;color:var(--mute);margin:8px 0 0}
.progress{padding:8px 0 28px;max-width:720px}
.bar,.meter{height:8px;background:var(--rule);border-radius:9px;overflow:hidden}
.bar i,.meter i{display:block;height:100%;width:0;background:var(--accent);transition:width .25s}
.meter i{background:var(--teal)}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:32px;padding:8px 0 40px;align-items:start}
.feedhead{display:flex;gap:16px;align-items:baseline;flex-wrap:wrap;border-bottom:2px solid var(--ink);padding-bottom:10px}
.feedhead h2{margin:0 auto 0 0;font-size:1.5rem}
.chk{font-size:.85rem;color:var(--mute);cursor:pointer}
.posts{list-style:none;margin:0;padding:0}
.post{display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;padding:16px 0;border-bottom:1px solid var(--rule)}
.av{width:44px;height:44px;border-radius:50%;background:var(--rule);object-fit:cover}
.meta{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap;font-size:.9rem}
.meta b{font-weight:700}
.meta .h{color:var(--mute);overflow-wrap:anywhere}
.meta time{margin-left:auto;color:var(--accent);font-weight:600;font-size:.82rem;white-space:nowrap}
.rp{font-size:.78rem;color:var(--teal);font-weight:600;margin:0 0 2px}
.txt{margin:4px 0 0;white-space:pre-wrap;overflow-wrap:anywhere}
.txt a{color:var(--teal)}
.imgs{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:6px;margin-top:8px}
.imgs img{width:100%;max-height:300px;object-fit:cover;border-radius:10px;display:block}
.open{font-size:.78rem;color:var(--mute)}
.empty{padding:30px 0;color:var(--mute)}
.card{background:var(--card);border:1px solid var(--rule);border-radius:var(--r);padding:18px;margin-bottom:18px}
.side{position:sticky;top:16px}
.card h3{margin:0 0 8px;font-size:1.15rem}
.cover{margin:0 0 10px;font-size:.95rem}
.quiet{list-style:none;margin:10px 0 0;padding:0;max-height:260px;overflow:auto;font-size:.88rem}
.quiet li{padding:3px 0;overflow-wrap:anywhere}
.quiet a{color:var(--ink)}
summary{cursor:pointer;color:var(--teal);font-weight:600;font-size:.9rem;margin-top:12px}
.pay{background:var(--ink);color:var(--paper);border:0}
.pay p{font-size:.9rem;color:#d9d2c2;margin:0 0 12px}
.exports{display:flex;gap:8px;margin-bottom:12px}
.exports button{flex:1;font:inherit;font-weight:700;padding:9px;border-radius:10px;border:1px solid #5b625c;background:transparent;color:var(--paper);cursor:pointer}
.exports button:disabled{opacity:.4;cursor:not-allowed}
.exports button:not(:disabled){background:var(--paper);color:var(--ink)}
.support{background:var(--accent);width:100%}
.link{background:none;border:0;color:#b9b3a3;font:inherit;font-size:.8rem;text-decoration:underline;cursor:pointer;margin-top:8px;padding:0}
.pay.on .support,.pay.on .link{display:none}
.error{background:#fbe3da;border:1px solid var(--accent);padding:12px 16px;border-radius:var(--r);max-width:720px}
.how{max-width:640px;border-top:1px solid var(--rule);padding:28px 0 20px}
.how h2{margin:0 0 8px}
.foot{padding-bottom:30px;color:var(--mute);font-size:.8rem}
@media(max-width:860px){.layout{grid-template-columns:minmax(0,1fr)}.side{position:static;order:-1}.aside{display:none}}
@media(max-width:480px){.wrap{padding:0 16px}.go{width:100%}.hero{padding-top:28px}.post{grid-template-columns:36px minmax(0,1fr);gap:10px}.av{width:36px;height:36px}}
.more{display:block;margin:18px auto 0}.foot a{color:inherit}