:root {
  color-scheme: light;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
  background: #faf9f6;
  color: #353532;
}
* { box-sizing: border-box; }
body { margin: 0; }
main {
  width: min(100% - 48px, 540px);
  margin: 116px auto 64px;
  font-size: 16px;
  line-height: 1.65;
  letter-spacing: -0.015em;
}
header { margin-bottom: 36px; }
h1 {
  margin: 0 0 5px;
  font-size: 19px;
  line-height: 1.4;
  font-weight: 600;
  letter-spacing: -0.035em;
  color: #252523;
}
p { margin: 0 0 22px; }
.updated { margin: 0; font-size: 14px; color: #777771; letter-spacing: -0.01em; }
a {
  color: inherit;
  text-decoration-color: #bcbcb5;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
  transition: color 150ms ease, text-decoration-color 150ms ease;
}
a:hover { color: #000; text-decoration-color: #353532; }
a:focus-visible { outline: 2px solid #777771; outline-offset: 5px; border-radius: 1px; }
footer { margin-top: 64px; color: #777771; font-size: 13px; letter-spacing: 0; }
footer p { margin: 0; }
#hong-kong-time { font-variant-numeric: tabular-nums; }
@media (max-width: 600px) {
  main { margin-top: 64px; margin-bottom: 40px; }
  header { margin-bottom: 32px; }
  footer { margin-top: 48px; }
}
@media (prefers-reduced-motion: reduce) { a { transition: none; } }