:root { --bg:#f4f6f9; --card:#fff; --text:#1c2430; --muted:#66707f; --line:#e3e7ee; --primary:#1f6feb; --danger:#c0392b;
        --warn-bg:#fff6e0; --warn:#9a6700; --ok:#1a7f37; --bad-bg:#ffecec; --dup-bg:#f0e7ff; }
* { box-sizing:border-box; }
body { margin:0; font:14px/1.45 -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; background:var(--bg); color:var(--text); }
.hidden { display:none !important; }
.screen { max-width:1280px; margin:0 auto; padding:16px; }
header { display:flex; justify-content:space-between; align-items:center; margin:6px 0 14px; }
h1 { font-size:22px; margin:0; } h2 { font-size:16px; margin:0 0 12px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:16px; margin-bottom:16px; }
.login { max-width:380px; margin:12vh auto; } .login label { display:block; margin:12px 0; }
.login input { width:100%; }
input, select, button { font:inherit; }
input[type=text], input:not([type]), input[type=password], input[type=date], select { padding:7px 9px; border:1px solid #cfd6e0; border-radius:6px; background:#fff; }
button { padding:7px 12px; border:1px solid #cfd6e0; border-radius:6px; background:#fff; cursor:pointer; }
button:hover { background:#f3f5f8; }
button.primary { background:var(--primary); border-color:var(--primary); color:#fff; } button.primary:hover { background:#1a5fd0; }
button.link { border:none; background:none; color:var(--primary); padding:2px 4px; } button.link.danger { color:var(--danger); }
button:disabled { opacity:.5; cursor:not-allowed; }
.muted { color:var(--muted); } .error { color:var(--danger); min-height:1.2em; }
.right { display:flex; gap:8px; align-items:center; }
.row-between { display:flex; justify-content:space-between; align-items:center; }
.row-end { display:flex; justify-content:flex-end; gap:8px; margin-top:12px; }
.dropzone { position:relative; border:2px dashed #b9c3d1; border-radius:10px; padding:26px; text-align:center; background:#fafbfd; }
.dropzone.over { border-color:var(--primary); background:#eef4ff; }
.dropzone input { position:absolute; inset:0; opacity:0; cursor:pointer; width:100%; height:100%; }
.dropzone p { margin:4px 0; }
.progress { list-style:none; padding:0; margin:10px 0 0; }
.progress li { padding:8px 10px; border-top:1px solid var(--line); display:flex; gap:10px; align-items:flex-start; flex-wrap:wrap; }
.progress li .status { color:var(--muted); }
.progress li.ok .status { color:var(--ok); } .progress li.warn .status { color:var(--warn); } .progress li.bad .status { color:var(--danger); }
.progress li .detail { flex-basis:100%; color:var(--muted); font-size:13px; white-space:pre-line; }
.table { width:100%; border-collapse:collapse; }
.table th, .table td { padding:7px 8px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
.table th { font-weight:600; color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.03em; background:#fafbfd; position:sticky; top:0; }
.table .num, .table td.num { text-align:right; font-variant-numeric:tabular-nums; }
.tablewrap { max-height:62vh; overflow:auto; border:1px solid var(--line); border-radius:8px; }
.tx td[contenteditable] { cursor:text; border-radius:4px; }
.tx td[contenteditable]:hover { background:#f3f6fb; } .tx td[contenteditable]:focus { outline:2px solid var(--primary); background:#fff; }
.tx tr.review { background:var(--warn-bg); } .tx tr.dup { background:var(--dup-bg); } .tx tr.excluded td { color:var(--muted); }
.tx tr.excluded td.amt { text-decoration:line-through; }
.tx td.desc { max-width:420px; word-break:break-word; }
.chip { display:inline-block; font-size:11px; padding:1px 7px; border-radius:10px; background:#e9edf3; color:#3b4656; margin:1px 2px 1px 0; white-space:nowrap; }
.chip.warn { background:#ffe9b3; color:var(--warn); } .chip.bad { background:var(--bad-bg); color:var(--danger); }
.chip.dup { background:#e3d4ff; color:#5b2ea6; } .chip.ok { background:#dcf5e3; color:var(--ok); } .chip.info { background:#dbe9ff; color:#1b4d9c; }
.conf { font-variant-numeric:tabular-nums; } .conf.low { color:var(--danger); font-weight:600; } .conf.mid { color:var(--warn); }
.filters { display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:10px; }
.filters input#fQ { min-width:200px; }
.chk { display:inline-flex; align-items:center; gap:5px; }
.notices { display:flex; flex-direction:column; gap:6px; margin-bottom:8px; }
.notice { padding:8px 10px; border-radius:6px; background:var(--warn-bg); color:var(--warn); font-size:13px; }
.notice.bad { background:var(--bad-bg); color:var(--danger); } .notice.info { background:#e8f0fe; color:#1b4d9c; }
.totals { display:flex; gap:26px; align-items:flex-end; margin:14px 0 8px; flex-wrap:wrap; }
.totals > div { display:flex; flex-direction:column; } .totals span, .totals strong { font-variant-numeric:tabular-nums; }
.totals .big strong { font-size:26px; color:var(--ok); }
.exports { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.footer { text-align:center; font-size:12px; }
.modal { position:fixed; inset:0; background:rgba(20,28,40,.45); display:flex; align-items:center; justify-content:center; z-index:20; }
.modal .card { width:420px; max-width:92vw; } .modal label { display:block; margin:10px 0; } .modal input, .modal select { width:100%; }
.toast { position:fixed; bottom:20px; left:50%; transform:translateX(-50%); background:#1c2430; color:#fff; padding:10px 16px; border-radius:8px; z-index:30; }
select.bankSel { padding:4px 6px; max-width:150px; }
.ok { color:var(--ok); } .bad { color:var(--danger); }
@media (max-width:800px) { .tx td.desc { max-width:200px; } .totals { gap:14px; } }
.modal .card.wide { width:760px; }
.modal h3 { font-size:14px; margin:16px 0 8px; }
.modal .card.wide .filters input, .modal .card.wide .filters select { width:auto; }
