:root {
  color-scheme: light;
  --paper: #d5d1cd;
  --ink: #37382f;
  --text: #5b5a54;
  --muted: #6d6c65;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--text);
  font-family: "Courier New", Courier, "Liberation Mono", monospace;
  font-size: 14px;
  line-height: 1.24;
  letter-spacing: -.025em;
  -webkit-font-smoothing: antialiased;
}
main { max-width: 760px; margin: 0 auto; padding: 0 24px 40px; }
.intro { min-height: 390px; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; padding: 76px 16px 84px; }
.intro h1, .intro p { max-width: 500px; font-family: "Times New Roman", "Songti SC", SimSun, serif; font-size: 20px; line-height: 1.15; letter-spacing: -.025em; text-transform: uppercase; font-weight: 400; color: var(--ink); }
.intro h1 { margin: 0; }
.intro p { margin: 12px 0 0; }
section { margin: 0 0 32px; }
h2 { margin: 0 0 20px; font-size: 11px; line-height: 1.2; font-weight: 400; color: var(--muted); letter-spacing: -.03em; }
.entries { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 42px; }
.entry { min-width: 0; overflow-wrap: break-word; }
h3 { margin: 0 0 3px; color: var(--ink); font: inherit; font-weight: 700; }
p { margin: 0; }
a { color: inherit; text-decoration: underline; text-decoration-color: #8c8b80; text-underline-offset: 2px; }
h3 a { position: relative; text-decoration-thickness: 1px; }
h3 a::before { content: "> "; position: absolute; right: 100%; padding-right: 3px; color: #62667c; opacity: 0; }
h3 a:hover::before, h3 a:focus-visible::before { opacity: 1; }
a:hover { color: var(--ink); text-decoration-color: currentColor; }
a:focus-visible { outline: 1px solid var(--ink); outline-offset: 3px; }
strong { font-weight: 400; }
footer { margin-top: 36px; font-size: 11px; color: var(--muted); }
::selection { background: #b9b6cb; color: var(--ink); }
@media (max-width: 600px) {
  main { padding: 0 20px 28px; }
  .intro { padding-right: 0; padding-left: 0; }
  .entries { column-gap: 28px; }
}
@media (max-width: 480px) {
  .intro { min-height: 300px; padding-top: 64px; padding-bottom: 64px; }
  .intro h1, .intro p { font-size: 18px; max-width: 330px; }
  .entries { grid-template-columns: 1fr; row-gap: 20px; }
  section { margin-bottom: 28px; }
}
