
:root { --fg:#1d1d1f; --muted:#6b6b70; --line:#e3e3e8; --bg:#fafafa; --accent:#1f4fd1; --warn:#a15c00; --bad:#b3261e; --good:#1b7a3a; }
* { box-sizing: border-box; }
body { margin:0; font: 15px/1.45 system-ui, -apple-system, Segoe UI, sans-serif; color:var(--fg); background:var(--bg); }
header { background:#fff; border-bottom:1px solid var(--line); padding:10px 20px; display:flex; gap:18px; align-items:center; flex-wrap:wrap; }
header .brand { font-weight:700; margin-right:8px; }
header nav a { color:var(--fg); text-decoration:none; margin-right:14px; }
header nav a.owner { color:var(--accent); }
header form { margin-left:auto; }
main { padding:20px; max-width:1200px; }
h1 { font-size:22px; margin:0 0 14px; }
h2 { font-size:17px; margin:22px 0 8px; }
table { border-collapse:collapse; width:100%; background:#fff; }
th, td { text-align:left; padding:6px 8px; border-bottom:1px solid var(--line); vertical-align:top; }
th { font-weight:600; color:var(--muted); font-size:13px; }
td.num, th.num { text-align:right; font-variant-numeric: tabular-nums; }
.muted { color:var(--muted); }
.warn { color:var(--warn); }
.bad { color:var(--bad); }
.good { color:var(--good); }
.card { background:#fff; border:1px solid var(--line); border-radius:6px; padding:14px 16px; margin:12px 0; }
.tag { display:inline-block; font-size:12px; padding:1px 7px; border-radius:10px; background:#eef; color:#334; }
.tag.new { background:#e6f4ea; color:var(--good); }
.tag.changed { background:#fff4e5; color:var(--warn); }
.tag.held { background:#f3f3f3; color:var(--muted); }
.flash { padding:10px 14px; border-radius:6px; margin:10px 0; background:#eef3ff; }
.flash.error { background:#fdecea; color:var(--bad); }
form.inline { display:inline; }
label { display:block; margin:8px 0 2px; font-size:13px; color:var(--muted); }
input[type=text], input[type=email], input[type=date], input[type=number], select, textarea { font:inherit; padding:6px 8px; border:1px solid #c9c9cf; border-radius:4px; width:100%; max-width:520px; }
textarea { min-height:90px; }
button { font:inherit; padding:6px 12px; border-radius:4px; border:1px solid #c9c9cf; background:#fff; cursor:pointer; }
button.primary { background:var(--accent); color:#fff; border-color:var(--accent); }
button.danger { color:var(--bad); }
pre.wrap { white-space:pre-wrap; margin:0; font:inherit; }
.grid2 { display:grid; grid-template-columns: 1fr 1fr; gap:16px; }
