:root{--ink:#1d2733;--muted:#5d6b7a;--line:#d9e0e7;--bg:#f4f6f8;--card:#fff;--brand:#1f4e78;--brand2:#2f6ea5;
--ok:#1e7b34;--okbg:#e3f3e6;--warn:#8a5a00;--warnbg:#fff3d6;--bad:#a12a1a;--badbg:#fbe3df;--radius:8px}
*{box-sizing:border-box}
body{margin:0;font:14px/1.45 -apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg)}
a{color:var(--brand2);text-decoration:none}a:hover{text-decoration:underline}
header.top{background:var(--brand);color:#fff;display:flex;align-items:center;gap:18px;padding:0 16px;height:52px;position:sticky;top:0;z-index:20}
header.top .brand{font-weight:700;font-size:16px;white-space:nowrap}header.top .brand small{font-weight:400;opacity:.75;margin-left:6px}
header.top nav{display:flex;gap:4px;flex:1;overflow-x:auto}
header.top nav a{color:#dbe7f3;padding:6px 10px;border-radius:6px;white-space:nowrap}
header.top nav a.on,header.top nav a:hover{background:rgba(255,255,255,.14);color:#fff;text-decoration:none}
header.top .me{font-size:13px;white-space:nowrap;opacity:.9}header.top .me a{color:#fff;margin-left:10px}
main{max-width:1400px;margin:0 auto;padding:18px 16px 60px}
main.wide{max-width:none}
h1{font-size:21px;margin:0 0 14px}h2{font-size:16px;margin:22px 0 10px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;margin-bottom:14px}
.grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
.stat{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px;display:block;color:inherit}
.stat:hover{border-color:var(--brand2);text-decoration:none}
.stat b{display:block;font-size:26px;line-height:1.2}.stat span{color:var(--muted);font-size:13px}
.flash{padding:10px 14px;border-radius:var(--radius);margin-bottom:12px;border:1px solid}
.flash.ok{background:var(--okbg);border-color:#b7dcbf}.flash.error{background:var(--badbg);border-color:#efb7ad}.flash.info{background:#e8f1fa;border-color:#bcd4ea}
table.t{width:100%;border-collapse:collapse;background:var(--card);font-size:13px}
table.t th,table.t td{border-bottom:1px solid var(--line);padding:7px 8px;text-align:left;vertical-align:top}
table.t th{background:#eef2f6;font-weight:600;white-space:nowrap;position:sticky;top:0}
table.t td.n,table.t th.n{text-align:right;white-space:nowrap}
table.t tr:hover td{background:#fafcfe}
.scroll{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius)}
.pill{display:inline-block;padding:1px 8px;border-radius:20px;font-size:12px;white-space:nowrap;border:1px solid transparent}
.pill.ok{background:var(--okbg);color:var(--ok)}.pill.warn{background:var(--warnbg);color:var(--warn)}.pill.bad{background:var(--badbg);color:var(--bad)}
.pill.grey{background:#eceff2;color:var(--muted)}
.muted{color:var(--muted)}.small{font-size:12px}.right{text-align:right}.nowrap{white-space:nowrap}
form.inline{display:inline}
label{display:block;font-weight:600;font-size:13px;margin:8px 0 4px}
input[type=text],input[type=password],input[type=number],input[type=date],input:not([type]),select,textarea{
 width:100%;padding:7px 9px;border:1px solid #c3ccd5;border-radius:6px;font:inherit;background:#fff}
input:focus,select:focus,textarea:focus{outline:2px solid #9cc3e6;border-color:var(--brand2)}
.row{display:flex;gap:12px;flex-wrap:wrap}.row>*{flex:1;min-width:160px}
.btn{display:inline-block;padding:8px 14px;border-radius:6px;border:1px solid var(--brand2);background:var(--brand2);color:#fff;
 font:inherit;font-weight:600;cursor:pointer;white-space:nowrap}
.btn:hover{background:var(--brand);text-decoration:none}
.btn.light{background:#fff;color:var(--brand2)}.btn.light:hover{background:#eef4fa}
.btn.danger{background:#fff;color:var(--bad);border-color:#d99b91}.btn.go{background:var(--ok);border-color:var(--ok)}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:12px}
.login{max-width:360px;margin:9vh auto}
/* review screen */
.review{display:grid;grid-template-columns:minmax(320px,33%) minmax(0,1fr);gap:14px;align-items:start}
.review>div{min-width:0}
@media(max-width:1000px){.review{grid-template-columns:1fr}}
.viewer{position:sticky;top:62px;background:#2b3138;border-radius:var(--radius);overflow:hidden}
.viewer .bar{display:flex;gap:6px;padding:6px;background:#1f252b;flex-wrap:wrap}
.viewer .bar button{background:#3a424b;color:#fff;border:0;border-radius:5px;padding:5px 10px;cursor:pointer;font:inherit}
.viewer .bar button.on{background:var(--brand2)}
.viewer .pane{height:calc(100vh - 130px);overflow:auto;cursor:grab}
.viewer img{display:block;transform-origin:0 0;max-width:none}
.lines input{padding:4px 5px;font-size:13px;min-width:0}
.lines td{padding:4px 4px}
.lines .w-prod{min-width:170px}.lines .w-s{width:56px}.lines .w-m{width:78px}.lines .w-b{width:100px}
tr.flag td{background:#fff6f4}tr.flag td:first-child{box-shadow:inset 3px 0 0 var(--bad)}
tr.corr td:first-child{box-shadow:inset 3px 0 0 #d9a300}
tr.target td{background:#fff9db!important}
.totals{display:flex;gap:18px;flex-wrap:wrap;align-items:center}
.totals div{min-width:120px}.totals b{display:block;font-size:18px}
.cascade{display:grid;grid-template-columns:1fr 1fr 2fr;gap:12px}
@media(max-width:900px){.cascade{grid-template-columns:1fr}}
.cascade .col{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);min-height:240px;overflow:hidden}
.cascade .col h3{margin:0;padding:9px 12px;font-size:13px;background:#eef2f6;border-bottom:1px solid var(--line)}
.pick{display:block;padding:8px 12px;border-bottom:1px solid var(--line);cursor:pointer;color:inherit}
.pick:hover{background:#f3f7fb;text-decoration:none}.pick.on{background:#e3eefa;box-shadow:inset 3px 0 0 var(--brand2)}
.spin{display:inline-block;width:14px;height:14px;border:2px solid #b8c7d6;border-top-color:var(--brand2);border-radius:50%;animation:s 1s linear infinite;vertical-align:-2px}
@keyframes s{to{transform:rotate(360deg)}}
footer{color:var(--muted);font-size:12px;text-align:center;padding:20px}
fieldset{min-width:0}
input[type=file]{width:100%;padding:10px;border:1px dashed #9fb3c8;border-radius:6px;background:#f8fbfe}
@media(max-width:760px){
 header.top{flex-wrap:wrap;height:auto;padding:8px 10px;gap:6px}
 header.top nav{order:3;flex-basis:100%}
 header.top .me{font-size:12px;margin-left:auto}
 header.top .me>:not(a){display:none}
 main{padding:12px 10px 40px}
 .viewer .pane{height:60vh}
}
@media(max-width:760px){.row>*{flex-basis:100%}}