:root { --ink:#1d1d1f; --muted:#6e6e73; --line:#e5e5ea; --accent:#7a1f3d; --bg:#fbfaf8; }
* { box-sizing:border-box; }
body { margin:0; font:16px/1.5 -apple-system, Helvetica, Arial, sans-serif; color:var(--ink); background:var(--bg); }
header { display:flex; align-items:center; justify-content:space-between; padding:14px 24px; border-bottom:1px solid var(--line); background:#fff; }
.brand { font-weight:700; font-size:22px; color:var(--accent); text-decoration:none; letter-spacing:.5px; }
nav a { margin-left:18px; color:var(--ink); text-decoration:none; }
main { max-width:1100px; margin:0 auto; padding:24px 16px; }
h1 { font-size:26px; margin:0 0 16px; }
table { width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--line); }
th, td { text-align:left; padding:10px 12px; border-bottom:1px solid var(--line); vertical-align:top; }
th { font-size:13px; text-transform:uppercase; color:var(--muted); }
.scroll { overflow-x:auto; }
.pill { padding:2px 10px; border-radius:12px; font-size:13px; background:#eee; }
.b-easy .pill { background:#d8f3dc; } .b-doable .pill { background:#fff3c4; } .b-far .pill { background:#f1e0e4; }
.new { background:var(--accent); color:#fff; font-size:11px; padding:1px 6px; border-radius:4px; margin-left:6px; }
.actions a, .actions form { margin-right:10px; }
.inline { display:inline; }
.toolbar { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:18px; }
.filters { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:18px; }
input, select, button, .button { font:inherit; padding:8px 12px; border:1px solid var(--line); border-radius:6px; background:#fff; }
button, .button { background:var(--accent); color:#fff; border-color:var(--accent); cursor:pointer; text-decoration:none; }
button.small { padding:4px 10px; font-size:13px; }
button.danger { background:#fff; color:var(--accent); }
.flash { background:#e8f0fe; padding:10px 14px; border-radius:6px; }
.empty { color:var(--muted); padding:40px 0; text-align:center; }
.error { color:#b00020; }
.checklist { list-style:none; padding:0; columns:2; }
body.login { display:grid; place-items:center; min-height:100vh; }
.card { background:#fff; padding:32px; border:1px solid var(--line); border-radius:10px; display:grid; gap:12px; width:320px; }
@media (max-width:600px) { .checklist { columns:1; } header { flex-direction:column; gap:8px; } }
