/* Second design pass: warmer page layering, clearer links, comfortable reading. */
:root { --bg:#ece8df; --muted:#6d7367; --olive:#53643f; --line:#d9dccf; --soft:#edf0e4; }
::selection { background:#dfe5ce; color:#263022; }
a { text-decoration-thickness:1px; }
select:focus-visible { outline:2px solid var(--olive); outline-offset:4px; }
.page { max-width:1020px; margin:36px auto; border-color:#dedbd0; border-radius:14px; box-shadow:0 5px 10px #423e2904,0 18px 50px #423e2909; }
.header { gap:30px; padding:23px 48px; }
.brand { font-size:32px; }
.header nav { gap:28px; }
.header nav a { padding:8px 0; font-size:14px; }
.search-trigger { min-height:38px; border-color:#bdc5b2; color:var(--olive); }
.search-trigger:hover { background:var(--soft); }
.search-trigger .search-label { font-size:12px; line-height:1.8; }
.intro { padding:34px max(48px,calc((100% - 820px)/2)) 32px; background:#f3f1e8; border-color:#e3e2d6; gap:25px; }
.eyebrow { font-size:11px; letter-spacing:3px; display:flex; align-items:center; gap:10px; }
.eyebrow:before { content:''; width:20px; height:1px; background:#81906a; }
.intro h1 { font-weight:600; font-size:34px; margin:8px 0; letter-spacing:1px; }
.intro p { color:#606958; }
.intro-aside { color:var(--muted); border-color:#cfd4c1; padding-left:23px; }
.intro-aside a { display:inline-block; margin-top:8px; font:12px/1.8 system-ui; }
.content { max-width:916px; padding:30px 48px 32px; margin:auto; }
.section-head { gap:15px; margin-bottom:5px; }
.section-head h2 { font-weight:600; }
.count { font:12px/1.5 system-ui; color:var(--muted); margin-left:10px; }
.filter { border-color:#c7cebc; }
.filter select { min-height:36px; font:12px/1.8 system-ui; }
.post { padding:26px 0 25px; display:block; position:relative; }
.post-title { font-weight:600; line-height:1.65; margin-bottom:8px; }
.post-title a { color:var(--olive); }
.post-title .arrow { color:#71835b; font-size:20px; }
.summary { color:#555f52; font-size:15px; line-height:1.95; max-width:650px; margin-bottom:13px; overflow-wrap:anywhere; }
.meta { flex-wrap:wrap; font-size:12px; gap:10px; letter-spacing:.15px; }
.meta .category { text-decoration-color:#a5b394; }
.cover { position:absolute; right:0; top:70px; width:116px; height:88px; border:1px solid #dce0d0; }
.post:has(.cover) .summary { padding-right:145px; max-width:100%; min-height:66px; }
.note { margin-top:12px; border:1px solid #e0e5d4; padding:19px 23px; border-radius:8px; }
.note p { font-weight:500; font-size:16px; }
.note a { font-size:13px; }
.note-label { font:11px/1.8 system-ui; letter-spacing:2px; margin-bottom:3px; }
footer { padding:20px 48px; font-size:12px; }
.article { max-width:680px; padding:10px 0 20px; }
.back { font-size:13px; }
.article h1 { font-weight:600; font-size:34px; line-height:1.6; margin:26px 0 12px; }
.article-deck { color:var(--muted); font-size:15px; line-height:1.9; margin:0 0 20px; }
.prose { font-size:16px; line-height:2; color:#3e483b; overflow-wrap:anywhere; }
.prose blockquote { padding:18px 24px; border-radius:0 6px 6px 0; }
.article-end { font-size:13px; gap:20px; }
.archive-row time { font-size:13px; }
.archive-row a { font-weight:500; text-decoration:underline; text-decoration-color:#b5c0a6; }
.dialog-head button { min-width:40px; min-height:40px; }
.search-result { padding:16px 4px; text-decoration:underline; }
.search-result:hover { background:var(--soft); }
.search-result small { margin-top:4px; }
.empty a { display:inline-block; margin-top:8px; }
@media(max-width:1080px) { .page { margin:24px; } }
@media(max-width:820px) {
  .header { padding:20px 30px; gap:20px; } .brand span { display:none; }
  .intro { padding:30px 38px; } .content { padding-left:38px; padding-right:38px; }
  .intro-aside { display:none; } .header nav { gap:22px; }
  footer { padding:20px 30px; } .footer-note { display:none; }
}
@media(max-width:600px) {
  body { background:var(--bg); } .page { margin:12px 10px; border:1px solid #dedbd0; border-radius:11px; box-shadow:0 8px 24px #423e2908; }
  .header { padding:19px 20px 14px; display:grid; grid-template-columns:1fr auto; gap:17px 12px; }
  .brand { font-size:28px; } .header nav { grid-row:2; grid-column:1/-1; margin:0; justify-content:space-between; border-top:1px solid var(--line); padding-top:5px; }
  .header nav a { padding:8px 15px; font-size:14px; }
  .search-trigger { padding:10px; width:auto; min-width:40px; min-height:40px; }
  .search-trigger .search-label,.search-trigger kbd { display:none; }
  .intro { padding:25px 22px 26px; } .intro h1 { font-size:clamp(23px,6.5vw,29px); letter-spacing:0; }
  .intro p { font-size:13px; line-height:1.9; } .eyebrow { font-size:10px; letter-spacing:2px; }
  .content { padding:24px 22px 27px; } .section-head { gap:10px; } .section-head h2 { font-size:18px; } .count { display:none; }
  .post { padding:25px 0; } .post-title { font-size:21px; } .summary { font-size:14px; } .meta { font-size:11px; gap:8px; }
  .cover { width:80px; height:78px; top:auto; bottom:24px; margin:0; }
  .post:has(.cover) .summary { padding-right:0; min-height:0; }
  .post:has(.cover) .meta { padding-right:90px; min-height:80px; align-content:start; padding-top:5px; }
  .note { padding:17px; align-items:flex-start; flex-direction:column; gap:12px; } .note p { font-size:15px; }
  footer { padding:19px 22px; gap:14px; font-size:11px; flex-wrap:wrap; } footer>span { flex-basis:100%; }
  .article { padding-top:3px; } .article h1 { font-size:28px; } .prose { font-size:15px; } .prose blockquote { padding:16px 18px; } .article-deck { font-size:14px; }
  .archive-row a { font-size:17px; } .article-end { font-size:12px; }
}
@media(prefers-reduced-motion:reduce) { .post-title .arrow { transition:none; } }