:root { color-scheme: light; }
* { box-sizing: border-box; }
html { background: #eaf1f6; }
body {
  margin: 0; color: #1d2b36; line-height: 1.6;
  font: 16px/1.6 system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}
main { max-width: 720px; margin: 0 auto; padding: 24px 16px 64px; }
.langs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 20px; }
.langs a {
  padding: 5px 12px; border-radius: 9px; background: rgba(255, 255, 255, 0.8);
  border: 1px solid rgba(29, 43, 54, 0.12); color: #1d2b36; text-decoration: none; font-size: 14px;
}
.langs a.on { background: #233646; color: #fff; border-color: #233646; }
.langs .back { margin-left: auto; }
article { display: none; background: #fff; border-radius: 16px; padding: 8px 24px 24px; box-shadow: 0 8px 30px rgba(20, 40, 60, 0.1); }
article.on { display: block; }
h1 { font-size: 26px; margin: 20px 0 4px; }
h2 { font-size: 17px; margin: 26px 0 6px; }
.date { color: #5d6b77; font-size: 13px; margin: 0 0 16px; }
ul { padding-left: 20px; }
li { margin-bottom: 8px; }
p { margin: 8px 0; }