:root { --ink:#1c2430; --muted:#6b7684; --line:#dfe3e8; --bg:#f5f6f8; --card:#fff; --accent:#1f5fbf; --bad:#b3261e; --good:#1b6e3c; }
* { box-sizing: border-box; }
body { margin:0; font:15px/1.45 system-ui, -apple-system, "Segoe UI", sans-serif; color:var(--ink); background:var(--bg); }
header { display:flex; align-items:center; gap:24px; padding:10px 24px; background:var(--card); border-bottom:1px solid var(--line); }
nav { display:flex; gap:18px; flex:1; }
nav a { color:var(--ink); text-decoration:none; } nav a:hover { color:var(--accent); }
.who { display:flex; gap:12px; align-items:center; color:var(--muted); margin:0; }
main { padding:20px 24px 60px; }
h1 { font-size:22px; margin:0 0 14px; } h2 { font-size:17px; margin:28px 0 8px; }
a { color:var(--accent); }
.card { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:18px; max-width:640px; display:grid; gap:12px; }
.narrow { max-width:360px; margin:8vh auto 0; }
label { display:grid; gap:4px; font-size:13px; color:var(--muted); }
input, select, button { font:inherit; padding:7px 9px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); max-width:100%; }
button { background:var(--accent); border-color:var(--accent); color:#fff; cursor:pointer; justify-self:start; }
button.link { background:none; border:0; color:var(--accent); padding:0; }
.hint { color:var(--muted); font-size:13px; margin:0; }
.alert, .ok { border-radius:8px; padding:12px 16px; margin:0 0 16px; max-width:900px; }
.alert { background:#fdecea; color:var(--bad); } .ok { background:#e8f5ec; color:var(--good); }
.alert ul { margin:6px 0 0; padding-left:20px; }
.stats { display:flex; flex-wrap:wrap; gap:8px 28px; margin:10px 0; } .stats dt { font-size:12px; } .stats dd { margin:0; font-size:22px; font-weight:600; }
.badge { background:var(--accent); color:#fff; border-radius:10px; padding:1px 7px; font-size:12px; }
table { border-collapse:collapse; background:var(--card); width:100%; }
th, td { padding:6px 10px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
thead th { font-size:12px; color:var(--muted); font-weight:600; white-space:nowrap; }
.num { text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
.plus { color:var(--good); }
.queue .purpose { font-size:13px; color:var(--muted); max-width:420px; overflow-wrap:anywhere; }
.queue form { display:grid; gap:6px; min-width:300px; } .queue .check { display:flex; gap:6px; align-items:center; }
.queue tr.done td { color:var(--good); background:#e8f5ec; }
.filter { display:flex; gap:12px; align-items:end; margin-bottom:14px; flex-wrap:wrap; }
.scroll { overflow-x:auto; border:1px solid var(--line); border-radius:8px; }
.report th:first-child { position:sticky; left:0; background:var(--card); min-width:280px; font-weight:400; }
.report .section th { background:#eef1f5; font-weight:600; }
.report .subtotal th, .report .subtotal td, .report .grand th, .report .grand td { font-weight:600; }
.report .grand th, .report .grand td { background:#eef1f5; }
.report .total { border-left:1px solid var(--line); font-weight:600; }
.filter label.check, .check { display:flex; gap:6px; align-items:center; }
.ops .purpose { font-size:13px; color:var(--muted); max-width:460px; overflow-wrap:anywhere; }
.ops td:nth-child(2) { max-width:260px; overflow-wrap:anywhere; }
form.inline { display:flex; gap:6px; margin:0 0 2px; } form.inline select { max-width:230px; } form.inline button { padding:7px 10px; }
td form { margin:0; }
tr.off td { color:var(--muted); background:#fafafa; }
.key { font-size:13px; max-width:300px; overflow-wrap:anywhere; }
.pager { display:flex; gap:16px; align-items:center; }
tr:target td { background:#fff8dc; }