:root {
  color-scheme: light;
  background: #faf9f6;
  color: #292925;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
  line-height: 1.6;
}
* { box-sizing: border-box; }
body { max-width: 736px; margin: 0 auto; padding: 64px 28px 32px; }
a { color: #345a78; text-decoration-thickness: 1px; text-underline-offset: .15em; }
a:visited { color: #65516d; }
a:hover { color: #203f57; }
a:focus-visible { outline: 2px solid #345a78; outline-offset: 4px; }
.skip { position: absolute; top: -60px; }
.skip:focus { top: 0; }
.site-header { margin-bottom: 40px; }
.wordmark { font-size: 18px; }
.intro { margin-bottom: 42px; }
h1 { font-size: 32px; line-height: 1.2; margin: 0 0 20px; }
.intro p { margin: 0; max-width: 60ch; }
#writing > h2 { font-family: Arial, Helvetica, sans-serif; font-size: 15px; font-weight: 600; margin: 0 0 24px; }
.entry { margin-bottom: 30px; }
.entry h3 { font-size: 22px; font-weight: 400; line-height: 1.35; margin: 0 0 4px; }
.entry time, .eyebrow, .back, footer { font-family: Arial, Helvetica, sans-serif; font-size: 13px; color: #6b6a62; }
.entry time { display: block; margin-bottom: 8px; }
.entry p { margin: 0; font-size: 17px; line-height: 1.6; }
.article header { margin: 28px 0 32px; }
.article h1 { font-size: 34px; margin: 10px 0 0; text-wrap: pretty; }
.prose { overflow-wrap: anywhere; }
.prose p, .prose ul, .prose ol { margin-top: 0; margin-bottom: 1.25em; }
.prose h2 { font-size: 25px; line-height: 1.3; margin: 1.6em 0 .65em; }
.prose h3 { font-size: 21px; line-height: 1.3; margin-top: 1.5em; }
.prose img { display: block; max-width: 100%; width: auto; height: auto; max-height: 75vh; max-height: 75svh; object-fit: contain; margin: 24px auto; }
.prose > p:first-child img { max-height: 60vh; max-height: 60svh; }
.prose pre { overflow: auto; background: #eeede7; padding: 18px; font-size: 13px; line-height: 1.6; }
.prose code { font-size: .85em; }
.prose table { display: block; overflow: auto; border-collapse: collapse; font-family: Arial, Helvetica, sans-serif; font-size: 14px; margin: 24px 0; }
.prose td, .prose th { padding: 9px 12px; border-bottom: 1px solid #dcd9cf; text-align: left; }
.prose blockquote { margin-left: 0; padding-left: 20px; border-left: 2px solid #ccc7b8; color: #626159; }
.end { display: block; margin-top: 44px; }
footer { border-top: 1px solid #dedcd4; margin-top: 48px; padding-top: 20px; display: flex; justify-content: space-between; gap: 20px; }
footer div { display: flex; flex-wrap: wrap; gap: 18px; }
@media (max-width: 480px) {
  body { padding: 36px 22px 28px; }
  .intro { margin-bottom: 34px; }
  h1 { font-size: 30px; }
  .entry { margin-bottom: 28px; }
  .entry h3 { font-size: 21px; }
  .article h1 { font-size: 30px; }
  footer { flex-direction: column; gap: 12px; }
}
