
:root{--bg:#f5f7fa;--card:#fff;--ink:#1f2933;--muted:#616e7c;--line:#e4e7eb;--brand:#0b6bcb;
--ok:#1f7a4d;--okbg:#e3f6ec;--warn:#8a5a00;--warnbg:#fff4d6;--bad:#a61b1b;--badbg:#fde8e8;
--info:#1d4f91;--infobg:#e3eefc}
*{box-sizing:border-box}
body{margin:0;font:15px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg)}
a{color:var(--brand);text-decoration:none}a:hover{text-decoration:underline}
header{background:#102a43;color:#fff;padding:10px 16px}
header .row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px;max-width:1600px;margin:0 auto}
header .brand{font-weight:700;font-size:17px;color:#fff}
header nav a{color:#d9e2ec;margin-right:14px}header nav a.on{color:#fff;font-weight:600;border-bottom:2px solid #fff}
.sync{max-width:1600px;margin:6px auto 0;display:flex;flex-wrap:wrap;gap:6px;font-size:12.5px}
.sync span{background:#243b53;border-radius:12px;padding:2px 10px;color:#d9e2ec}
.sync span.stale{background:#7a2e0e;color:#fff}
main{max-width:1600px;margin:0 auto;padding:16px 0}
h1{font-size:21px;margin:4px 0 14px}h2{font-size:17px;margin:0 0 10px}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px 16px;margin-bottom:14px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:14px}
dl{display:grid;grid-template-columns:max-content 1fr;gap:4px 14px;margin:0}
dt{color:var(--muted)}dd{margin:0;word-break:break-word}
form.search{display:flex;gap:8px;flex-wrap:wrap}
input[type=text],input[type=search],select,input[type=number]{font:inherit;padding:8px 10px;border:1px solid #cbd2d9;border-radius:8px;background:#fff}
input[type=search]{flex:1;min-width:220px}
button,.btn{font:inherit;padding:8px 14px;border:0;border-radius:8px;background:var(--brand);color:#fff;cursor:pointer;display:inline-block}
.btn.sec{background:#e4e7eb;color:var(--ink)}
.hint{color:var(--muted);font-size:13px;margin:8px 0 0}
.tbl{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:14px}
th,td{padding:6px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{background:#f0f4f8;font-weight:600;white-space:nowrap}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
tr.today td{background:#fffbea}
.neg{color:var(--bad);font-weight:600}
.badge{display:inline-block;padding:1px 8px;border-radius:10px;font-size:12.5px;font-weight:600;white-space:nowrap}
.b-matched{background:var(--okbg);color:var(--ok)}.b-unmatched{background:var(--warnbg);color:var(--warn)}
.b-conflict{background:var(--badbg);color:var(--bad)}.b-dup{background:var(--infobg);color:var(--info)}
.b-muted{background:#eef2f7;color:var(--muted)}
.alert{border-radius:8px;padding:10px 12px;margin-bottom:14px}
.alert.warn{background:var(--warnbg);color:var(--warn)}.alert.bad{background:var(--badbg);color:var(--bad)}
.alert.info{background:var(--infobg);color:var(--info)}
.filters{display:flex;flex-wrap:wrap;gap:8px;align-items:end}
.filters label{display:flex;flex-direction:column;font-size:12.5px;color:var(--muted);gap:2px}
.pager{display:flex;gap:8px;align-items:center;margin-top:10px;flex-wrap:wrap}
.mono{font-family:ui-monospace,Consolas,monospace;font-size:13px}
ul.res{list-style:none;padding:0;margin:0}ul.res li{padding:8px 0;border-bottom:1px solid var(--line)}
.stats{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px}
.stats a{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:8px 12px;color:var(--muted);font-size:13px;min-width:120px}
.stats a:hover{border-color:var(--brand);text-decoration:none}
.stats b{display:block;font-size:20px;color:var(--ink)}
.filters label.grow{flex:1;min-width:240px}.filters label.grow input{width:100%}
table.list td{white-space:nowrap}table.list td.addr{white-space:normal;min-width:220px;max-width:340px}
td.old{color:var(--bad);font-weight:600}
.back{margin:0 0 6px;font-size:14px}
.alert.ok{background:var(--okbg);color:var(--ok)}
.btn.danger,button.danger{background:var(--bad)}
.tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.decl-form{border:1px solid var(--line);border-radius:8px;padding:10px 12px;margin-bottom:12px;background:#fafcff}
.decl-form h3{margin:0 0 4px;font-size:15px}.decl-form .filters{margin:8px 0}
label.block{display:flex;flex-direction:column;font-size:12.5px;color:var(--muted);gap:2px;margin-bottom:8px}
textarea{font:inherit;padding:8px 10px;border:1px solid #cbd2d9;border-radius:8px}
form.inline{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}form.inline input{padding:5px 8px;font-size:13px}
form.inline button{padding:5px 10px;font-size:13px}
details summary{cursor:pointer;color:var(--brand)}
table.decl td{font-size:13.5px}tr.voided td{color:var(--muted);text-decoration:line-through}
tr.voided td:last-child{text-decoration:none}
.filters label.check{flex-direction:row;align-items:center;gap:6px;font-size:14px;color:var(--ink)}
.send-box{border:2px solid var(--brand);border-radius:10px}
.send-box.real{border-color:var(--bad)}
.b-sent{background:var(--okbg);color:var(--ok)}.b-dry{background:var(--infobg);color:var(--info)}
.b-blocked{background:var(--badbg);color:var(--bad)}
td.chot{font-weight:700}
table.list td.wrap{white-space:normal;min-width:150px;max-width:260px}
header form.user{margin-left:auto;display:flex;align-items:center;gap:8px;color:#d9e2ec;font-size:14px}
header form.user button{padding:4px 10px;font-size:13px}
.card.login{max-width:380px;margin:40px auto}.card.login input{width:100%}
input[type=password]{font:inherit;padding:8px 10px;border:1px solid #cbd2d9;border-radius:8px;background:#fff}
footer{color:var(--muted);font-size:12px;text-align:center;padding:16px}
@media (max-width:600px){main{padding:10px}dl{grid-template-columns:1fr}dt{margin-top:6px}th,td{padding:5px 6px}}
