:root {
  --bg: #f2eee3;
  --panel: #e9e4d7;
  --ink: #282c28;
  --muted: #64675d;
  --line: #cec9ba;
  --cyan: #465e52;
  --orange: #9b4939;
  --vermilion: #a84535;
  --gold: #826d3f;
}
body {
  background: var(--bg);
  background-image: url('/assets/img/ink-landscape.svg'), radial-gradient(ellipse at 80% 5%, #fffdf6b0, transparent 60%);
  background-repeat: no-repeat;
  background-size: 100% 790px, 100% 100%;
  background-position: center 120px, center;
}
body::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  opacity: .065;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='paper'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23645c45' filter='url(%23paper)' opacity='.6' d='M0 0h180v180H0z'/%3E%3C/svg%3E");
}
.nav { border-bottom-color: var(--line); height: 90px; }
.edition-bar { display: flex; justify-content: space-between; padding-top: 17px; color: var(--muted); font-size: 10px; letter-spacing: 1.8px; }
.edition-bar a { letter-spacing: .2px; color: var(--vermilion); }
.hero { padding-top: 70px; padding-bottom: 110px; gap: 65px; }
h1 { line-height: 1.13; letter-spacing: -1.8px; }
.hero-copy { position: relative; }
.hero-copy::before { content: ''; width: 45px; height: 3px; background: var(--ink); display: block; margin-bottom: 30px; clip-path: polygon(0 20%,90% 0,100% 55%,8% 100%); }
.button { background: #f2eee3aa; border-color: #8b8b79; }
.button:hover { background: #e4dfd1; }
.observatory { background: #f8f5ecde; border: 1px solid #b8b6a4; box-shadow: 8px 12px 0 #66654808, 0 20px 45px #292b2010; }
.instrument-top { color: #545d50; }
.instrument-top button { color: var(--ink); border-color: #aaa997; }
.plot-grid { stroke: #cfcebf; }
.plot-labels, .axis-label { fill: #6b6d60; }
.model-note { color: var(--muted); }
.research-index { background: #f2eee399; }
.section-heading { padding-top: 100px; }
.story { padding-block: 70px 95px; }
.story h3 { line-height: 1.22; }
.chapter { color: var(--vermilion); }
.finding { border-left-width: 1px; }
.finding strong { color: var(--ink); }
.science-figure { background: #1b201b; border: 8px solid #e6e0d2; outline: 1px solid #cbc5b5; box-shadow: 5px 8px 0 #655b4410; color: #e5ddc9; }
.science-figure .figure-label { color: #bac4b4; }
.science-figure figcaption { color: #bab9a7; }
.portrait { padding: 8px; border: 1px solid var(--line); background: #e9e3d5; align-self: start; transform: rotate(-1deg); }
.portrait img { filter: sepia(.15); }
.about h2 .chinese { color: var(--ink); }
.paper-row:hover { color: var(--vermilion); }
.footer-seal { opacity: .95; }
@media(max-width:1000px) { .hero { gap: 30px; } }
@media(max-width:740px) {
  body { background-size: auto 850px, 100% 100%; background-position: 30% 120px, center; }
  .nav { height: 76px; }
  .hero { padding-block: 40px 65px; gap: 36px; }
  .hero-copy::before { margin-bottom: 23px; }
  .story { padding-block: 40px 60px; }
  .section-heading { padding-top: 65px; }
}
.hero-copy { align-self: start; padding-top: 80px; }
@media(max-width:740px) { .hero-copy { padding-top: 0; } }