:root {
  --paper: #f7f3eb;
  --ink: #2a2418;
  --muted: #7a7264;
  --line: #d8d0c2;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: #f7f3eb; color: #2a2418; }
body {
  font-family: Georgia, ui-serif, "Times New Roman", serif;
  line-height: 1.6;
}
.page { max-width: 44rem; margin: 0 auto; padding: 3rem 1.5rem 4rem; }
.masthead h1 { font-weight: 500; letter-spacing: 0.01em; margin: 0; }
.subtitle { color: #7a7264; margin: 0.35rem 0 0; }
code, pre { font-family: ui-monospace, Menlo, Consolas, monospace; }
.token.comment,
.token.prolog,
.token.doctype,
.token.cdata { color: #8a8274; }
.token.punctuation { color: #7a7264; }
.token.property,
.token.tag,
.token.boolean,
.token.number,
.token.constant,
.token.symbol { color: #8b4a3a; }
.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin { color: #5a6b3a; }
.token.operator,
.token.entity,
.token.url { color: #6b5a3a; }
.token.atrule,
.token.attr-value,
.token.keyword { color: #3d5a6b; }
.token.function,
.token.class-name { color: #8b4a52; }
.token.regex,
.token.important,
.token.variable { color: #8b6b3a; }
.back { font-size: 0.95rem; }
.back a { color: #7a7264; text-decoration: none; border-bottom: 1px solid #d8d0c2; }
.meta { color: #7a7264; font-size: 0.95rem; }
.tag { color: #7a7264; text-decoration: none; border-bottom: 1px solid #c8c0b2; margin-left: 0.6rem; }
.body pre { background: #efe8dc; padding: 0.9rem 1rem; overflow-x: auto; }
.body img { max-width: 100%; height: auto; }
.tags { display: flex; flex-wrap: wrap; gap: 0.9rem; border-bottom: 1px solid #d8d0c2; padding-bottom: 0.8rem; margin: 1.8rem 0 1.6rem; }
.tags a { color: #7a7264; text-decoration: none; }
.tags a.is-active { color: #2a2418; border-bottom: 1px solid #2a2418; }
.month h2 { font-size: 0.85rem; color: #9a9284; font-weight: 500; margin: 1.4rem 0 0.4rem; }
.entry { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding: 0.25rem 0; }
.entry[hidden], .month[hidden] { display: none; }
.entry > a { color: #2a2418; text-decoration: none; }
.entry > a:hover { border-bottom: 1px solid #2a2418; }
.entry-tags { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.55rem; flex-shrink: 0; }
.entry-tags a { color: #9a9284; font-size: 0.85rem; text-decoration: none; }
.entry-tags a:hover { color: #2a2418; border-bottom: 1px solid #2a2418; }
#empty-tags { color: #7a7264; }
.friends {
  margin-top: 3.2rem;
  padding-top: 1rem;
  border-top: 1px solid #d8d0c2;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.85rem;
  font-size: 0.85rem;
}
.friends-label { color: #9a9284; }
.friends a {
  color: #7a7264;
  text-decoration: none;
  border-bottom: 1px solid #c8c0b2;
}
.friends a:hover {
  color: #2a2418;
  border-bottom-color: #2a2418;
}
