:root {
  --night: #0B0705; --text: rgba(242,229,222,.87);
  --text2: rgba(242,229,222,.62); --text3: rgba(242,229,222,.48);
  --oki: #E07052;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
  background: var(--night); color: var(--text);
  font-family: "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN", sans-serif;
  line-height: 2; padding: 64px 24px 80px;
  -webkit-font-smoothing: antialiased;
}
.wrap { max-width: 680px; margin: 0 auto; }
.topbar { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
a.home { color: var(--text3); text-decoration: none; font-size: .85rem; letter-spacing: .08em; }
a.home:hover { color: var(--oki); }
nav.langs { font-size: .82rem; }
nav.langs a { margin-left: 12px; color: var(--text3); text-decoration: none; }
nav.langs a:hover { color: var(--oki); }
nav.langs a[aria-current="true"] { color: var(--oki); }
h1 { font-size: 1.7rem; font-weight: 500; letter-spacing: .1em; margin: 28px 0 4px; }
.date { color: var(--text3); font-size: .85rem; margin-bottom: 8px; }
.lead { color: var(--text2); }
h2 { font-size: 1.05rem; font-weight: 600; letter-spacing: .06em; margin: 36px 0 8px; color: var(--text); }
p, li { color: var(--text2); font-size: .95rem; }
ul { padding-left: 1.3em; margin-top: 4px; }
a { color: var(--oki); text-decoration: none; }
strong { color: var(--text); font-weight: 600; }
