
:root { --ink:#2b2118; --paper:#faf6ef; --accent:#7a4a1f; --rule:#d9cdb8; --card:#f3ecdf; }
* { box-sizing: border-box; }
body { font-family: Georgia,'Times New Roman',serif; color:var(--ink); background:var(--paper); margin:0; line-height:1.65; }
header.site { background:var(--accent); color:#f6ead8; padding:12px 20px 0; }
header.site .brand { font-size:1.35rem; margin:0 0 8px; }
header.site .brand a { color:#f6ead8; text-decoration:none; }
nav.main { display:flex; flex-wrap:wrap; gap:2px; }
nav.main a { color:#f0dfc4; text-decoration:none; padding:7px 12px; font-size:.9rem; border-radius:6px 6px 0 0; }
nav.main a:hover { background:#8f5c2c; }
nav.main a.cur { background:var(--paper); color:var(--accent); font-weight:bold; }
main { max-width:880px; margin:0 auto; padding:24px 20px 60px; }
h1,h2,h3,h4 { color:var(--accent); line-height:1.25; }
h1 { border-bottom:2px solid var(--rule); padding-bottom:.3em; }
a { color:#8a5a2b; }
blockquote { border-left:4px solid var(--rule); margin:1em 0; padding:.3em 1em; font-style:italic; background:var(--card); }
table { border-collapse:collapse; width:100%; margin:1em 0; font-size:.95rem; }
th,td { border:1px solid var(--rule); padding:6px 9px; text-align:left; vertical-align:top; }
th { background:#efe6d4; }
img { max-width:100%; height:auto; border-radius:4px; }
hr { border:none; border-top:1px solid var(--rule); margin:2em 0; }
footer { max-width:880px; margin:0 auto; padding:0 20px 40px; font-size:.8rem; color:#8b7a60; }
li { margin:.2em 0; }
.flag-yes { color:#2e6b2e; font-weight:bold; } .flag-no { color:#a33; }
.badges { margin:.2em 0 1.2em; }
.badge { display:inline-block; background:var(--card); border:1px solid var(--rule); border-radius:12px;
  padding:2px 11px; font-size:.78rem; margin-right:6px; color:#6b573c; }
.badge.status-cooked { background:#e4ecdd; border-color:#b9cbaa; color:#3c5a2e; }
.badge.status-project { background:#f2e2cf; border-color:#dbc09a; color:#7a5218; }
.badge.status-posted { background:#e3e8ee; border-color:#b6c3d2; color:#33506b; }
.tiles { display:flex; gap:14px; flex-wrap:wrap; margin:1.5em 0; }
.tile { flex:1 1 200px; background:var(--card); border:1px solid var(--rule); border-radius:8px; padding:18px 16px; }
.tile .big { font-size:2.7rem; font-weight:bold; color:var(--accent); line-height:1; }
.tile .lbl { font-weight:bold; margin-top:.35em; }
.tile .sub { font-size:.85rem; color:#7d6b52; margin-top:.3em; }
.bar { display:flex; gap:2px; margin:1.2em 0 1.6em; min-height:52px; }
.bar .seg { display:flex; flex-direction:column; justify-content:center; padding:6px 8px; font-size:.78rem;
  color:#fff; border-radius:4px; min-width:58px; }
.bar .seg b { font-size:1.05rem; }
.seg.s1 { background:#5e3a17; } .seg.s2 { background:#7a4a1f; } .seg.s3 { background:#96602e; } .seg.s4 { background:#b07c45; }
#q { width:100%; max-width:420px; font-size:1rem; padding:8px 12px; border:1px solid var(--rule);
  border-radius:6px; background:#fff; font-family:inherit; margin:0 0 1em; }
.rlist { list-style:none; padding:0; column-count:2; column-gap:28px; }
@media (max-width:640px){ .rlist{column-count:1} .tiles{flex-direction:column} }
.rlist li { break-inside:avoid; margin:.25em 0; }
.rlist .m { font-size:.78rem; color:#8b7a60; }
.count { color:#8b7a60; font-size:.85rem; }

.portrait { float:right; max-width:260px; margin:0 0 14px 22px; border:1px solid var(--rule); border-radius:8px; box-shadow:2px 3px 8px rgba(90,60,20,.15); }
@media (max-width:640px){ .portrait { float:none; display:block; margin:0 auto 16px; } }
