* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  padding: max(24px, env(safe-area-inset-top)) 20px 64px;
  background: #0b0d10;
  color: #e8eaed;
  font: 17px/1.6 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
main { max-width: 680px; margin: 0 auto; }
nav { display: flex; gap: 14px; margin-bottom: 28px; font-size: 15px; }
nav a, a { color: #6fd3cf; }
nav [aria-current] { color: #e8eaed; text-decoration: none; font-weight: 600; }
h1 { margin: 0 0 4px; font-size: clamp(28px, 6vw, 38px); line-height: 1.15; }
h2 { margin: 40px 0 8px; font-size: 21px; line-height: 1.25; }
h3 { margin: 24px 0 4px; font-size: 17px; }
p, ul { margin: 0 0 14px; }
ul { padding-left: 22px; }
li { margin-bottom: 6px; }
.dated { color: #9aa0a6; font-size: 15px; margin-bottom: 28px; }
.short {
  padding: 16px 18px;
  border-radius: 14px;
  background: #151a1f;
  border: 1px solid #232a31;
}
.short p:last-child, .short ul:last-child { margin-bottom: 0; }
table { width: 100%; border-collapse: collapse; margin: 0 0 14px; font-size: 15px; }
th, td { text-align: left; vertical-align: top; padding: 8px 10px 8px 0; border-bottom: 1px solid #232a31; }
th { color: #9aa0a6; font-weight: 600; }
.scroll { overflow-x: auto; }
@media (prefers-color-scheme: light) {
  body { background: #fff; color: #1b1d20; }
  nav a, a { color: #0b7a76; }
  nav [aria-current] { color: #1b1d20; }
  .short { background: #f4f6f7; border-color: #e1e5e8; }
  th, td { border-color: #e1e5e8; }
  .dated, th { color: #5f6368; }
}
