.journal-ledger {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) auto;
  gap: 22px;
  align-items: start;
  background: #efeee5;
  border: 1px solid #deded2;
  border-radius: 5px;
  padding: 24px 27px;
  margin: 0 0 26px;
}

.ledger-index { font: 12px monospace; color: var(--accent); padding-top: 4px; }
.journal-ledger .eyebrow { font-size: 8px; letter-spacing: 1.4px; margin-bottom: 9px; color: #8c8d7d; }
.journal-ledger h2 { font-size: 20px; letter-spacing: -.7px; margin: 0 0 8px; }
.journal-ledger p:not(.eyebrow) { font-size: 11px; line-height: 1.9; color: var(--muted); margin: 0; max-width: 560px; }
.journal-ledger .journal-order { font: 9px/1.8 monospace; color: #7d8174; text-align: right; padding-top: 7px; white-space: pre-line; }

@media (max-width: 680px) {
  .journal-ledger { grid-template-columns: 28px minmax(0, 1fr); gap: 13px; padding: 19px 17px; margin-bottom: 22px; }
  .journal-ledger h2 { font-size: 18px; }
  .journal-ledger p:not(.eyebrow) { font-size: 10px; }
  .journal-ledger .journal-order { grid-column: 2; text-align: left; padding: 0; font-size: 8px; }
}

.timeline-date { display: none; }
.journal-timeline {
  display: block;
  position: relative;
  max-width: 850px;
  margin: 0 auto;
  padding: 5px 0 0;
  counter-reset: diary;
}
.journal-timeline::before {
  content: '';
  position: absolute;
  left: 126px;
  top: 0;
  bottom: 28px;
  width: 1px;
  background: #d5d6c9;
}
.journal-timeline .post-card {
  counter-increment: diary;
  position: relative;
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr);
  column-gap: 45px;
  margin: 0;
  padding: 0 0 34px;
  min-height: 132px;
  border: 0;
}
.journal-timeline .post-card::before {
  content: '';
  position: absolute;
  left: 121px;
  top: 5px;
  width: 11px;
  height: 11px;
  border: 3px solid var(--paper);
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 1px #c6c8ba;
}
.journal-timeline .post-card::after {
  content: counter(diary, decimal-leading-zero);
  position: absolute;
  left: 108px;
  top: 27px;
  font: 8px monospace;
  color: #989b8d;
}
.journal-timeline .timeline-date {
  display: block;
  grid-column: 1;
  grid-row: 1 / span 4;
  color: #777b70;
  font: 11px/1.5 monospace;
  text-align: right;
  padding-top: 1px;
}
.journal-timeline .post-picture { display: none; }
.journal-timeline .post-meta {
  grid-column: 2;
  margin: 0 0 8px;
  align-self: start;
}
.journal-timeline .post-card h3 {
  grid-column: 2;
  font-size: 19px;
  line-height: 1.55;
  margin: 0 0 7px;
}
.journal-timeline .post-card > p {
  grid-column: 2;
  max-width: 590px;
  font-size: 12px;
  margin: 0 0 13px;
}
.journal-timeline .post-bottom {
  grid-column: 2;
  max-width: 590px;
  padding-top: 10px;
}
.journal-timeline .post-bottom > span:first-child { display: none; }

@media (max-width: 680px) {
  .journal-timeline { margin: 0; padding-top: 0; }
  .journal-timeline::before { left: 78px; bottom: 24px; }
  .journal-timeline .post-card { grid-template-columns: 59px minmax(0, 1fr); column-gap: 35px; padding-bottom: 28px; min-height: 120px; }
  .journal-timeline .post-card::before { left: 73px; width: 10px; height: 10px; }
  .journal-timeline .post-card::after { left: 61px; top: 26px; font-size: 7px; }
  .journal-timeline .timeline-date { font-size: 9px; }
  .journal-timeline .post-card h3 { font-size: 16px; }
  .journal-timeline .post-card > p { font-size: 11px; }
}

.article-body > * + * { margin-top: 16px; }
.article-body ul { padding-left: 1.3em; }
.article-body .article-image { margin: 24px 0; }
.article-body .article-image img { display: block; width: 100%; height: auto; border: 1px solid #deded2; border-radius: 4px; }
.article-body a { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }

.journal-controls{align-items:start;min-width:0}
.journal-controls .filters{flex:1;min-width:0;display:flex;flex-wrap:wrap;gap:8px;max-height:200px;overflow-y:auto;padding:3px}
.journal-controls .filter{min-height:44px;max-width:100%;overflow-wrap:anywhere;white-space:normal}
.journal-controls .journal-search{min-width:0}
.journal-ledger{border-radius:0;background:transparent;border-width:1px 0;padding:24px 0}
.journal-ledger p:not(.eyebrow){font-size:13px}
.journal-ledger .journal-order{font:12px/1.8 inherit;white-space:normal}
.journal-list-tools{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:0 0 24px;color:var(--muted);font-size:13px}
.journal-list-tools select{font:inherit;color:var(--ink);background:var(--paper);border:1px solid var(--line);min-height:44px;padding:8px 12px;margin-left:8px}
.journal-more{display:block;margin:12px auto 40px;min-height:44px}
.journal-more[hidden]{display:none}
.journal-timeline .post-card h3{word-break:keep-all;overflow-wrap:anywhere}
.journal-timeline .post-card>p{font-size:14px;line-height:1.85}
.journal-timeline .post-card::after{font-size:10px;left:98px;min-width:20px;text-align:right}
@media(max-width:680px){
 .journal-controls{display:flex;flex-direction:column;gap:16px}
 .journal-controls .filters,.journal-controls .journal-search{width:100%}
 .journal-ledger{grid-template-columns:24px minmax(0,1fr);padding:20px 0}
 .journal-timeline .post-card{grid-template-columns:1fr;padding-left:24px}
 .journal-timeline::before{left:4px}
 .journal-timeline .post-card::before{left:-1px;top:6px}
 .journal-timeline .post-card::after{display:none}
 .journal-timeline .timeline-date{grid-column:1;grid-row:auto;text-align:left;font-size:12px;margin-bottom:10px}
 .journal-timeline .post-meta,.journal-timeline .post-card h3,.journal-timeline .post-card>p,.journal-timeline .post-bottom{grid-column:1}
 .journal-timeline .post-card h3{font-size:18px}
}
