:root { --fg:#1b1d21; --muted:#5b616b; --bg:#fbfbfc; --line:#e3e5e8; --accent:#2f5bea; --warn:#9a3b00; }
@media (prefers-color-scheme: dark) { :root { --fg:#e9eaec; --muted:#a3a8b0; --bg:#131418; --line:#2a2d33; --accent:#7d9bff; --warn:#ffb27a; } }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin:0; font:16px/1.55 system-ui, -apple-system, sans-serif; color:var(--fg); background:var(--bg); }
header { display:flex; flex-wrap:wrap; gap:.75rem 1.5rem; align-items:center; justify-content:space-between; padding:1rem; border-bottom:1px solid var(--line); }
header nav { display:flex; gap:1rem; flex-wrap:wrap; }
a { color:var(--accent); }
.brand { font-weight:600; text-decoration:none; color:var(--fg); }
main { max-width:40rem; margin:0 auto; padding:1.5rem 1rem 4rem; }
.lede { font-size:1.1rem; color:var(--muted); }
table { border-collapse:collapse; width:100%; }
th, td { text-align:left; padding:.5rem; border-bottom:1px solid var(--line); }
form { display:grid; gap:.6rem; margin:1rem 0; }
input { font:inherit; padding:.6rem; border:1px solid var(--line); border-radius:6px; background:transparent; color:inherit; }
button, .button { font:inherit; padding:.6rem 1rem; border:0; border-radius:6px; background:var(--accent); color:#fff; cursor:pointer; text-decoration:none; display:inline-block; justify-self:start; }
pre { white-space:pre-wrap; word-break:break-all; padding:.75rem; border:1px solid var(--line); border-radius:6px; }
.warn { color:var(--warn); font-weight:600; }
code { font-size:.92em; }
footer { max-width:40rem; margin:0 auto; padding:1rem; border-top:1px solid var(--line); color:var(--muted); font-size:.9rem; display:flex; flex-wrap:wrap; justify-content:space-between; gap:.5rem; }
footer nav { display:flex; gap:1rem; }
.draft { background:var(--warn); color:var(--bg); padding:.5rem .75rem; border-radius:6px; font-weight:600; }
.muted { color:var(--muted); font-size:.9rem; }
button.secondary { background: transparent; color: var(--fg); border: 1px solid var(--line); }
.actions { display: flex; gap: .6rem; }