:root{color-scheme:dark;background:#0b111a;color:#e4ebf5;font:16px/1.75 system-ui,sans-serif}
body{margin:0}
main{max-width:44rem;margin:auto;padding:1.5rem clamp(1rem,4vw,2rem) 3rem}
nav{font-size:.95rem;margin-block:0 1.5rem}
a{color:#9ddfc0}
.meta{color:#b1c1d3;margin:0;font-size:.875rem}
h1{font-size:clamp(1.55rem,5vw,2.3rem);line-height:1.3;margin:.3rem 0 1rem}
img{display:block;max-width:100%;max-height:24rem;height:auto;object-fit:contain;border-radius:.5rem;margin-bottom:1.15rem}
.body{overflow-wrap:anywhere;margin-bottom:1.5rem}
.body p{white-space:pre-wrap;margin:0 0 .9em}

.journal-cover {
  box-sizing: border-box;
  width: 100%;
  aspect-ratio: 16 / 9;
  container-type: inline-size;
  display: grid;
  align-content: center;
  gap: 5%;
  padding: 8%;
  margin: 1rem 0;
  overflow: hidden;
  border: 1px solid #5a4530;
  border-radius: .75rem;
  color: #fff4df;
  background:
    linear-gradient(110deg, #111722 28%, #11172230),
    repeating-linear-gradient(0deg, transparent 0 23px, #edb45a30 24px 25px),
    repeating-linear-gradient(90deg, transparent 0 23px, #edb45a30 24px 25px),
    radial-gradient(ellipse at right bottom, #8a462c, #191e30 70%);
}
.journal-cover > span { color: #ffc475; font-size: clamp(.65rem, 3.5cqi, 1.4rem); font-weight: 700; }
.journal-cover > strong {
  color: inherit;
  font-size: clamp(.8rem, 7cqi, 3.5rem);
  line-height: 1.12;
  overflow-wrap: anywhere;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
.journal-cover {
  background: linear-gradient(90deg, #060d19a6, transparent 80%), url("/journal-cover.png") center / cover no-repeat #060d19;
}
.journal-cover > strong {
  max-width: 66%;
  font-size: clamp(.75rem, 5.5cqi, 3.2rem);
  text-shadow: 0 2px 6px #000;
}
.journal-cover.rebound { background-image: linear-gradient(90deg, #060d19a6, transparent 80%), url('/journal-rebound.png'); }.journal-cover.reserve { background-image: linear-gradient(90deg, #060d19a6, transparent 80%), url('/journal-reserve.png'); }
.journal-cover.reversal { background-image: linear-gradient(90deg, #060d19a6, transparent 80%), url('/journal-reversal.png'); }