:root { color-scheme: light dark; }
body { margin: 0; font: 16px/1.55 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; background: Canvas; color: CanvasText; }
main { box-sizing: border-box; max-width: 860px; margin: 0 auto; padding: 24px 16px 48px; overflow-wrap: anywhere; }
h1 { font-size: 1.6rem; line-height: 1.25; }
h2 { font-size: 1.2rem; margin-top: 2rem; }
blockquote { margin: 1rem 0; padding: 0.75rem 1rem; border-left: 4px solid #2764e8; background: rgba(39, 100, 232, 0.08); }
pre { overflow-x: auto; padding: 0.75rem 1rem; background: rgba(127, 127, 127, 0.12); border-radius: 8px; font-size: 0.85rem; line-height: 1.45; }
a { color: #2764e8; }
@media (prefers-color-scheme: dark) { a { color: #8ab4ff; } }
table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; margin: 1rem 0; font-size: 0.9rem; line-height: 1.4; }
th, td { border: 1px solid rgba(127, 127, 127, 0.35); padding: 0.35rem 0.55rem; text-align: left; vertical-align: top; }
th { background: rgba(127, 127, 127, 0.12); }
code { overflow-wrap: anywhere; }

/* Phone: the notch and the home indicator stay clear of the text; table cells keep a readable width and the table scrolls inside its own box. */
main { padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); padding-bottom: max(48px, env(safe-area-inset-bottom, 0px)); }
th, td { min-width: 112px; vertical-align: top; }
table { -webkit-overflow-scrolling: touch; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
main > p > a:only-of-type, main > p:last-of-type a { display: inline-block; padding: 11px 6px; }