:root{color-scheme:light dark;--bg:#fafaf8;--fg:#1c2425;--muted:#536366;--accent:#23616a;--panel:#f0f4f4;--border:#bdcdcf}
@media(prefers-color-scheme:dark){:root{--bg:#202321;--fg:#f1f1e9;--muted:#b7c3c4;--accent:#acd8da;--panel:#282e2d;--border:#566768}}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font:17px/1.6 Arial,sans-serif}
main{max-width:1040px;padding:32px 24px 48px;margin:auto}a{color:var(--accent)}h1{font-size:2rem;line-height:1.2;margin:22px 0 14px}
p{margin:10px 0 18px}.actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:20px 0 12px}
.button{font:inherit;display:inline-block;border:1px solid var(--accent);border-radius:5px;padding:9px 16px;background:var(--bg);color:var(--fg);text-decoration:none;cursor:pointer}
.button:hover,.button:focus-visible{background:var(--panel);outline:2px solid var(--accent);outline-offset:2px}
pre{background:var(--panel);border:1px solid var(--border);border-radius:5px;padding:22px;overflow:auto;tab-size:4;line-height:1.55;font-size:15px}
code{font-family:Consolas,'Courier New',monospace}pre code{font-size:inherit}.note{color:var(--muted);font-size:15px}#copy-status{min-height:1.6em}