.issue-cover {
  padding: clamp(28px, 4vw, 66px) 6% clamp(32px, 4vw, 64px);
  display: grid;
  grid-template-columns: .95fr 1.05fr;
  align-items: center;
  gap: 5%;
}
.cover-story { padding: 8px 0; }
.cover-story .cover-kicker, .plate-heading {
  font: 12px/1.5 "Microsoft YaHei", sans-serif;
  letter-spacing: .16em;
}
.cover-kicker span { color: #b18470; padding: 0 .5em; }
.cover-story h1 {
  font: 500 clamp(48px, 5.3vw, 88px)/1.15 "Songti SC", SimSun, serif;
  letter-spacing: -.055em;
  margin: .36em 0;
}
.cover-story h1 em { font-style: normal; color: #944433; }
.cover-story .cover-deck { font: 16px/1.9 "Songti SC", SimSun, serif; color: #55574b; }
.cover-source { margin-top: 22px; font-size: 14px; }
.cover-source summary { cursor: pointer; width: fit-content; border-bottom: 1px solid #a89c86; padding-bottom: 4px; }
.cover-source blockquote { margin: 14px 0 7px; font: 18px/1.6 "Songti SC", SimSun, serif; }
.cover-source a { text-decoration: underline; text-underline-offset: 4px; color: #715044; }
.cover-plate {
  position: relative; isolation: isolate; overflow: hidden;
  padding: clamp(18px, 2.4vw, 38px);
  background: #22352e; color: #fcf5e0;
}
.cover-plate::before {
  content: ""; position: absolute; inset: 0; z-index: -1; opacity: .13;
  background: url("assets/book-collage.png") center 45% / cover;
  filter: grayscale(1); mix-blend-mode: luminosity;
}
.plate-heading, .plate-foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.plate-heading { padding-bottom: 12px; border-bottom: 1px solid #aab29c69; color: #e0e1cb; }
.plate-figure {
  --group: clamp(43px, 4.3vw, 72px);
  --gap: 12px;
  position: relative;
  margin: clamp(22px, 3vw, 50px) auto;
  width: 70%; height: calc(2 * var(--group) + var(--gap));
}
.trigram { position: absolute; left: 0; top: 0; width: 72%; height: var(--group); display: grid; grid-template-rows: repeat(3, 1fr); gap: 20%; transition: transform .45s ease; }
.trigram i { background: currentColor; }
.trigram .broken { background: linear-gradient(to right, currentColor 43%, transparent 43% 57%, currentColor 57%); }
.trigram b { position: absolute; left: 109%; top: 50%; transform: translateY(-50%); white-space: nowrap; font: 13px "Songti SC",SimSun,serif; }
.trigram.fire { color: #f4b68c; }
.trigram.water { color: #b3d1c9; }
.water, .cover-plate.swapped .fire { transform: translateY(calc(var(--group) + var(--gap))); }
.cover-plate.swapped .water { transform: translateY(0); }
.plate-foot { border-top: 1px solid #aab29c69; padding-top: 14px; }
.plate-foot strong { display: block; font: 32px/1.25 "Songti SC",SimSun,serif; }
.plate-foot small { color: #e2e1ca; font-size: 12px; letter-spacing: .16em; }
.plate-foot button { border: 1px solid #d6d1b4; background: #f1ecd8; color: #293c32; padding: 10px 16px; font-size: 14px; }
.plate-foot button:hover { background: #fff9e7; }
.plate-foot button span { margin-right: 4px; }
@media (max-width: 720px) {
  .issue-cover { grid-template-columns: 1fr; padding: 22px 6% 28px; gap: 22px; }
  .cover-story h1 { font-size: 50px; }
  .cover-story .cover-deck { font-size: 15px; }
  .plate-figure { max-width: 300px; }
}
@media (prefers-reduced-motion: reduce) { .trigram { transition: none; } }