html[data-theme="journal"] { background: #e9e7df; color: var(--ink); }
html[data-theme="journal"] body { background: #e9e7df; }
.journal-layout { padding-top: 20px; }
.journal-intro { padding: clamp(34px, 6vw, 68px) clamp(0px, 2vw, 28px) 46px; border-bottom: 2px solid var(--ink); }
.journal-kicker { max-width: 34ch; color: var(--orange); font-size: 10px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.journal-intro h2 { margin: 20px 0 18px; font: 700 clamp(68px, 13vw, 150px)/.78 var(--display); letter-spacing: -.085em; }
.journal-deck { margin: 0; color: var(--muted); font-size: 13px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.elevation-chart { display: block; width: 100%; max-width: 100%; min-height: 190px; margin-top: 40px; overflow: visible; }
.elevation-chart .line { fill: none; stroke: var(--ink); stroke-width: 2; vector-effect: non-scaling-stroke; }
.elevation-chart .area { fill: url(#mountainFade); }
.elevation-chart circle { fill: #e9e7df; stroke: var(--orange); stroke-width: 2; }
.elevation-chart text { fill: currentColor; font: 650 11px/1 "Avenir Next", sans-serif; }
.journal-days { position: relative; padding: 54px 0 0 clamp(42px, 6vw, 88px); }
.journal-days::before { content: ""; position: absolute; left: clamp(12px, 2vw, 27px); top: 60px; bottom: 20px; width: 1px; background: var(--line-strong); }
.journal-day { position: relative; padding: 0 0 52px; border-bottom: 1px solid var(--line); margin-bottom: 48px; }
.journal-day::before { content: ""; position: absolute; left: clamp(-76px, -5vw, -37px); top: 4px; width: 10px; height: 10px; border-radius: 50%; background: #e9e7df; border: 2px solid var(--ink); }
.journal-day.current::before { background: var(--orange); border-color: var(--orange); box-shadow: 0 0 0 6px rgba(223,90,47,.12); }
.journal-day h3 { max-width: 16ch; margin: 8px 0 15px; font: 700 clamp(34px, 6vw, 58px)/.94 var(--display); letter-spacing: -.05em; }
.day-number { color: var(--orange); font-size: 10px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.journal-day .day-copy { max-width: 58ch; margin: 0; font: 500 clamp(17px, 2vw, 20px)/1.65 var(--display); }
.journal-day .day-copy-en { font-family: "Avenir Next", Avenir, "Helvetica Neue", sans-serif; font-size: .78em; line-height: 1.7; }
.journal-day .route-link { margin-top: 4px; }
.journal-days .utility-section { margin-top: 0; }
@media (min-width: 900px) {
  .journal-layout { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: clamp(52px, 8vw, 116px); align-items: start; }
  .journal-intro { position: sticky; top: 0; min-height: 82vh; }
  .journal-intro h2 { font-size: clamp(84px, 9vw, 132px); }
}
@media (max-width: 680px) {
  .journal-layout { padding-top: 8px; }
  .journal-intro { padding-top: 36px; }
  .journal-intro h2 { font-size: clamp(70px, 24vw, 104px); }
  .elevation-chart { margin-top: 28px; min-height: 150px; }
  .journal-days { padding-top: 42px; }
  .journal-days::before { top: 48px; }
}