/* Blog-only additions. The main site's tokens.css, base.css and
   components.css do the heavy lifting; this file adds nothing they cover. */
.post-note {
  margin-block: var(--space-sm);
  font-size: var(--text-sm);
}
.post-hero {
  margin: 0 0 var(--space-xl);
}
.post-hero img {
  width: 100%;
  height: auto;
  border-radius: var(--radius-md);
}
.post-footer {
  margin-block-start: var(--space-2xl);
  padding-block-start: var(--space-lg);
  border-block-start: var(--border-width) solid var(--border);
}
.archive-year + .archive-year { margin-block-start: var(--space-xl); }
.archive-list { list-style: none; margin: 0; padding: 0; }
.archive-list__item {
  display: flex;
  gap: var(--space-md);
  align-items: baseline;
  padding-block: var(--space-2xs);
  border-block-end: var(--border-width) solid var(--border);
}
.archive-list__item time {
  flex: 0 0 auto;
  min-width: 6.5rem;
  color: var(--text-muted);
  font-size: var(--text-sm);
  font-variant-numeric: tabular-nums;
}
.archive-list__item a { text-decoration: none; }
.archive-list__item a:hover { text-decoration: underline; }
@media (max-width: 480px) {
  .archive-list__item { flex-direction: column; gap: 0; }
}