:root{--ink:#16191d;--soft:#4a5158;--mute:#7a8189;--rule:#d8dcdf;--lt:#eef0f2;--bg:#f6f7f8;--card:#fff;
 --accent:#1f5f8b;--accent-lt:#e8f0f6;--ok:#2e7d4f;--ok-lt:#eef5f0;--warn:#a86a0c;--warn-lt:#fdf6ec;--bad:#b03a2e;--bad-lt:#fcf0ef}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
a{color:var(--accent);text-decoration:none} a:hover{text-decoration:underline}
header.top{background:#16191d;color:#fff;padding:0 20px;display:flex;align-items:center;gap:22px;height:52px}
header.top .brand{font-weight:700;letter-spacing:.02em}
header.top nav{display:flex;gap:16px;flex:1;overflow-x:auto;white-space:nowrap}
header.top nav a{color:#c9d1d9;font-size:14px} header.top nav a.on{color:#fff;font-weight:600}
header.top form button{background:none;border:0;color:#9aa4ae;font-size:13px;cursor:pointer}
main{max-width:1080px;margin:0 auto;padding:22px 20px 60px}
h1{font-size:24px;margin:4px 0 2px} h2{font-size:17px;margin:26px 0 10px} .sub{color:var(--soft);margin:0 0 18px}
.eyebrow{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);font-weight:600}
.card{background:var(--card);border:1px solid var(--rule);border-radius:10px;padding:18px 20px;margin-bottom:16px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.stat .n{font-size:26px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1}
.stat .l{font-size:12px;color:var(--soft)} .stat.bad .n{color:var(--bad)} .stat.ok .n{color:var(--ok)}
.bar{height:12px;border-radius:6px;background:var(--lt);overflow:hidden;display:flex;margin:14px 0 6px}
.bar i{display:block;height:100%} .bar i.r{background:#8fb3cc} .bar i.o{background:var(--accent)} .bar.over i.o{background:var(--bad)}
.legend{font-size:12px;color:var(--soft);display:flex;gap:14px;flex-wrap:wrap} .legend b{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;vertical-align:-1px}
.act{display:flex;align-items:center;gap:14px;padding:12px 0;border-top:1px solid var(--lt)} .act:first-child{border-top:0}
.act .when{width:92px;flex:none;text-align:center;border-radius:8px;padding:6px 4px;background:var(--lt)}
.act .when .d{font-weight:700;font-size:15px} .act .when .in{font-size:11px;color:var(--soft)}
.act.soon .when{background:var(--warn-lt)} .act.today .when{background:var(--accent);color:#fff} .act.today .when .in{color:#dbe7f0}
.act.late .when{background:var(--bad-lt)} .act .what{flex:1} .act .what b{display:block} .act .what span{font-size:13px;color:var(--soft)}
.btn{display:inline-block;border:1px solid var(--accent);background:var(--accent);color:#fff;border-radius:7px;padding:7px 14px;font-size:14px;font-weight:600;cursor:pointer;text-decoration:none}
.btn:hover{text-decoration:none;filter:brightness(1.08)} .btn.ghost{background:#fff;color:var(--accent)} .btn.small{padding:4px 10px;font-size:13px}
.btn.danger{background:#fff;color:var(--bad);border-color:#e3b5b0}
.note{border-radius:8px;padding:10px 14px;font-size:14px;margin:10px 0} .note.ok{background:var(--ok-lt);border-left:4px solid var(--ok)}
.note.bad{background:var(--bad-lt);border-left:4px solid var(--bad)} .note.warn{background:var(--warn-lt);border-left:4px solid var(--warn)} .note.info{background:var(--accent-lt);border-left:4px solid var(--accent)}
table{width:100%;border-collapse:collapse;font-size:14px} th{text-align:left;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute);font-weight:600;border-bottom:1px solid var(--rule);padding:6px 8px}
td{padding:7px 8px;border-bottom:1px solid var(--lt);vertical-align:top} td.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.pill{display:inline-block;border-radius:999px;padding:1px 9px;font-size:12px;font-weight:600;background:var(--lt);color:var(--soft)}
.pill.paid{background:var(--ok-lt);color:var(--ok)} .pill.sent{background:var(--accent-lt);color:var(--accent)} .pill.late{background:var(--bad-lt);color:var(--bad)}
.pill.fixed,.pill.done{background:var(--ok-lt);color:var(--ok)} .pill.open,.pill.found{background:var(--warn-lt);color:var(--warn)} .pill.down{background:var(--bad-lt);color:var(--bad)}
form.inline{display:inline} label{font-size:12px;color:var(--soft);display:block;margin-bottom:3px}
input,select,textarea{font:inherit;border:1px solid var(--rule);border-radius:7px;padding:7px 9px;background:#fff;width:100%}
.row{display:grid;grid-template-columns:140px 110px 1fr 140px 120px;gap:10px;align-items:end}
.quick{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.docs{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px}
.doc{border:1px solid var(--rule);border-radius:10px;overflow:hidden;background:#fff}
.doc .h{padding:10px 14px;border-bottom:1px solid var(--rule)} .doc .h b{display:block} .doc .h span{font-size:12px;color:var(--soft);word-break:break-all}
.doc iframe{width:100%;height:880px;border:0;background:#fff}
.subject{font-family:ui-monospace,Menlo,monospace;font-size:13px;background:var(--lt);border-radius:6px;padding:6px 9px;user-select:all;display:block}
.muted{color:var(--mute)} .small{font-size:13px}
@media (max-width:720px){.row{grid-template-columns:1fr 1fr}.row .what{grid-column:1/-1} header.top{gap:12px;padding:0 12px} main{padding:16px 14px 50px}}
.pill.part{background:var(--accent-lt);color:var(--accent)}
.linkbtn{background:none;border:0;padding:0 0 0 6px;font:inherit;color:var(--accent);text-decoration:underline;cursor:pointer}