body { font-family: -apple-system, BlinkMacSystemFont, "Hiragino Sans", sans-serif; line-height: 1.7; color: #222; max-width: 720px; margin: 0 auto; padding: 24px 20px 64px; }
h1 { font-size: 1.6em; margin-bottom: 0.2em; }
h2 { font-size: 1.15em; margin-top: 2em; border-bottom: 1px solid #ddd; padding-bottom: 4px; }
a { color: #0a66d8; }
.site { font-size: 0.9em; color: #666; margin-bottom: 8px; }
.site a { color: inherit; text-decoration: none; }
.date { color: #666; font-size: 0.9em; }
.lang { margin: 16px 0 32px; }
hr { margin: 56px 0; border: none; border-top: 2px solid #ddd; }
footer { margin-top: 64px; padding-top: 16px; border-top: 1px solid #ddd; font-size: 0.85em; color: #666; }
footer a { color: inherit; margin-right: 12px; }
ul.apps { list-style: none; padding: 0; }
ul.apps li { margin: 12px 0; }
.faq { background: #f5f6f8; border-radius: 12px; padding: 14px 18px; margin: 14px 0; }
.faq h3 { display: flex; gap: 10px; align-items: flex-start; font-size: 1.05em; margin: 0; }
.faq .a { position: relative; margin-top: 10px; padding: 10px 0 0 34px; border-top: 1px solid #e2e4e8; }
.faq h3::before, .faq .a::before { flex: none; width: 24px; height: 24px; line-height: 24px; margin-top: 0.2em; border-radius: 50%; text-align: center; font-size: 0.8rem; font-weight: bold; color: #fff; }
.faq h3::before { content: "Q"; background: #0a66d8; }
.faq .a::before { content: "A"; background: #e8833a; position: absolute; left: 0; top: 10px; margin-top: 0.25em; }
.faq .a > :first-child { margin-top: 0; }
.faq .a > :last-child { margin-bottom: 0; }
.faq ol { padding-left: 1.4em; }
@media (prefers-color-scheme: dark) {
  body { background: #111; color: #ddd; }
  h2, hr, footer { border-color: #444; }
  a { color: #6af; }
  .site, .date, footer { color: #999; }
  .faq { background: #1d1e21; }
  .faq .a { border-color: #3a3b3f; }
}