:root { color-scheme: light dark; --bg:#f4f6f8; --card:#fff; --ink:#1b2530; --muted:#5b6875; --line:#cfd7df; --accent:#2a62d4; }
@media (prefers-color-scheme: dark) { :root { --bg:#12181e; --card:#1b232b; --ink:#e3e9ee; --muted:#9aa7b3; --line:#33404c; --accent:#7aa2ff; } }
body { margin:0; font:16px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif; background:var(--bg); color:var(--ink); }
header, main { max-width:900px; margin:0 auto; padding:16px; }
h1 { margin:8px 0 0; } #label { color:var(--muted); margin:4px 0 0; }
section { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:16px; margin-bottom:16px; }
h2 { margin:0 0 8px; font-size:18px; }
.hint { color:var(--muted); margin-top:0; }
.buttons { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
button { font:inherit; border:1px solid var(--line); background:var(--bg); color:var(--ink); border-radius:8px; padding:8px 12px; cursor:pointer; }
button:hover { border-color:var(--accent); }
button small { color:var(--muted); }
pre { background:var(--bg); border:1px solid var(--line); border-radius:8px; padding:12px; overflow-x:auto; font-size:13px; white-space:pre-wrap; word-break:break-word; }
code { font-size:.92em; }