:root { color-scheme: light dark; --ink: #1d1d1f; --ink-2: #6e6e73; --line: #d2d2d7; --bg: #f5f5f7; --card: #fff; --you: #e4572e; --warn: #fdeee9; }
@media (prefers-color-scheme: dark) { :root { --ink: #f5f5f7; --ink-2: #a1a1a6; --line: #3a3a3c; --bg: #000; --card: #1c1c1e; --warn: #3a1d14; } }
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink); font: 16px/1.5 -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif; }
.page { max-width: 640px; margin: 0 auto; padding: 32px 16px 48px; }
.origin { margin: 0 0 8px; color: var(--ink-2); font-size: 13px; letter-spacing: 0.02em; }
h1 { margin: 0 0 12px; font-size: 26px; line-height: 1.25; }
h2 { margin: 0 0 8px; font-size: 15px; }
.intro, .sub { color: var(--ink-2); }
.rows p { margin: 0 0 8px; }
.warnings p { margin: 0 0 8px; padding: 10px 12px; border-radius: 10px; background: var(--warn); }
.exact { margin: 16px 0; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--card); }
pre { margin: 0; white-space: pre-wrap; word-break: break-all; font: 12px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; }
.act { margin: 8px 0 12px; padding: 12px 22px; border: 0; border-radius: 999px; background: var(--you); color: #fff; font: inherit; font-weight: 600; }
.act[disabled] { opacity: 0.6; }
.back { color: var(--ink-2); }