:root { --bg:#f6f7f8; --card:#fff; --text:#1c1c1c; --muted:#6b7280; --border:#d7dadc; --accent:#ff4500; --ok:#15803d; --err:#b91c1c; }
@media (prefers-color-scheme: dark) {
  :root { --bg:#0e1113; --card:#1a1d1f; --text:#e5e7eb; --muted:#9ca3af; --border:#343536; --ok:#4ade80; --err:#f87171; }
}
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--text); font:15px/1.5 system-ui, sans-serif; }
main { max-width:720px; margin:0 auto; padding:24px 16px; }
h1 { font-size:22px; margin:0 0 4px; }
h2 { font-size:16px; margin:0 0 12px; }
.intro { margin:0 0 16px; }
.card { background:var(--card); border:1px solid var(--border); border-radius:10px; padding:18px; margin-bottom:18px; }
label { display:block; font-weight:600; font-size:13px; margin:12px 0 4px; }
input[type=text], input[type=url], textarea {
  width:100%; padding:9px 10px; border:1px solid var(--border); border-radius:6px;
  background:var(--bg); color:var(--text); font:inherit;
}
textarea { min-height:160px; resize:vertical; }
.row { display:flex; gap:12px; flex-wrap:wrap; }
.row > * { flex:1 1 200px; }
.tabs, .filters { display:flex; gap:6px; margin-top:14px; }
.filters { margin:0 0 8px; }
.tabs button, .filters button { flex:1; padding:8px; border:1px solid var(--border); background:var(--bg); color:var(--text); border-radius:6px; cursor:pointer; font:inherit; }
.tabs button.active, .filters button.active { border-color:var(--accent); color:var(--accent); font-weight:600; }
.btn { padding:9px 18px; border:0; border-radius:999px; background:var(--accent); color:#fff; font:inherit; font-weight:600; cursor:pointer; text-decoration:none; display:inline-block; }
.btn.secondary { background:transparent; color:var(--text); border:1px solid var(--border); }
.btn.small { padding:4px 12px; font-size:13px; font-weight:500; }
.actions { display:flex; justify-content:flex-end; gap:10px; margin-top:16px; flex-wrap:wrap; }
.status { margin-top:10px; font-size:14px; min-height:1px; }
.status.ok { color:var(--ok); } .status.err { color:var(--err); }
.muted { color:var(--muted); }
.small { font-size:13px; }
.small ul { margin:0; padding-left:18px; }
.small li { margin-bottom:6px; }
.hidden { display:none !important; }
.drafts { list-style:none; padding:0; margin:0; }
.drafts li { padding:12px 0; border-bottom:1px solid var(--border); }
.drafts li:last-child { border-bottom:0; }
.draft-title { font-weight:600; overflow-wrap:anywhere; }
.draft-meta { font-size:13px; color:var(--muted); margin:2px 0 8px; }
.draft-actions { display:flex; gap:6px; flex-wrap:wrap; }
a { color:var(--accent); }
