:root { color-scheme: light dark; }
body {
  margin: 0;
  font: 16px/1.6 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  background: Canvas;
  color: CanvasText;
}
main { max-width: 720px; margin: 0 auto; padding: 32px 20px 64px; }
h1 { font-size: 1.9em; line-height: 1.2; margin-bottom: 0.2em; }
h2 { font-size: 1.3em; margin-top: 2em; }
h3 { font-size: 1.05em; margin-bottom: 0.3em; }
.meta { opacity: 0.7; margin-top: 0; }
li { margin-bottom: 0.4em; }
a { color: #1a73e8; }
@media (prefers-color-scheme: dark) { a { color: #8ab4f8; } }
table { border-collapse: collapse; width: 100%; margin: 1em 0; }
th, td { text-align: left; vertical-align: top; padding: 8px 10px; border: 1px solid color-mix(in srgb, CanvasText 20%, transparent); }
th { background: color-mix(in srgb, CanvasText 6%, transparent); }
.note { padding: 10px 14px; border-left: 4px solid #1a73e8; background: color-mix(in srgb, #1a73e8 8%, transparent); }
.join { margin: 1.5em 0; padding: 16px 18px; border-radius: 10px; border: 1px solid color-mix(in srgb, CanvasText 20%, transparent); }
.join h2 { margin-top: 0; }
form.android-test { display: flex; gap: 8px; flex-wrap: wrap; }
form.android-test input { flex: 1 1 240px; font: inherit; padding: 8px 10px; border-radius: 8px;
  border: 1px solid color-mix(in srgb, CanvasText 30%, transparent); background: Canvas; color: CanvasText; }
form.android-test button { font: inherit; font-weight: 600; padding: 8px 16px; border-radius: 8px; border: 0;
  background: #F58A1F; color: #141008; cursor: pointer; }
form.android-test button:disabled { opacity: 0.6; cursor: default; }
.form-msg.ok { color: #1e8e3e; }
.form-msg.bad { color: #d93025; }
@media (prefers-color-scheme: dark) { .form-msg.ok { color: #4cd97b; } .form-msg.bad { color: #f28b82; } }
