:root{--ink:#1d2c27;--muted:#687670;--paper:#fbfcf9;--line:#dce4dc;--green:#236d4f;--lime:#dff4b4;--red:#a14236;--red-bg:#fbe9e6;--gold:#a97615;--gold-bg:#fff4d8}*{box-sizing:border-box}body{margin:0;background:#f1f4ef;color:var(--ink);font:15px/1.45 Inter,ui-sans-serif,system-ui,sans-serif}main{max-width:1160px;margin:auto;padding:54px 28px 72px}header{display:flex;justify-content:space-between;align-items:end;margin-bottom:36px}h1,h2,p{margin:0}h1{font-size:38px;letter-spacing:-1.6px}h2{font-size:21px;letter-spacing:-.45px}header p:not(.eyebrow){color:var(--muted);margin-top:6px}.eyebrow,.label{font-size:11px;letter-spacing:1.25px;font-weight:750;color:#547064}.compare,.fetch{background:var(--ink);color:white;border:0;border-radius:7px;font-weight:700;cursor:pointer}.compare{padding:13px 17px}.compare span{font-size:21px;margin-left:8px}.header-actions{display:flex;gap:9px;align-items:center}.settings-button{padding:11px 14px;background:#fff;border:1px solid var(--line);border-radius:7px;font:inherit;font-weight:700;cursor:pointer;color:var(--ink)}.settings-panel{margin:-15px 0 24px;padding:21px 24px;background:#eaf2ec;border:1px solid #cbdccf;border-radius:11px;display:grid;grid-template-columns:1fr 1.5fr;gap:25px}.settings-panel p:not(.eyebrow){color:var(--muted);font-size:13px;margin-top:6px}.settings-panel form{display:grid;grid-template-columns:1fr 1fr;gap:10px}.settings-panel label{font-size:12px;font-weight:700;color:#476055}.settings-panel input{display:block;width:100%;margin-top:4px;padding:9px;border:1px solid #c5d4c9;border-radius:6px;background:white;font:inherit}.settings-panel .fetch{height:39px;align-self:end}.workspace{display:grid;grid-template-columns:1fr 1fr;gap:20px}.document-card,#results{background:var(--paper);border:1px solid var(--line);border-radius:12px;box-shadow:0 3px 12px #25342c0b}.document-card{padding:25px}.card-heading{display:flex;gap:13px;align-items:center;margin-bottom:24px}.icon{border-radius:7px;padding:8px 7px;font-size:11px;font-weight:800}.po{background:var(--lime);color:#315c32}.invoice{background:#d8ebf7;color:#27617d}.label{margin-bottom:2px}.load-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}.upload,.mail-button{min-height:90px;padding:15px;text-align:left;border-radius:8px;background:white;font:inherit;font-weight:700;cursor:pointer}.upload{border:1px dashed #9eb9ab;color:var(--green)}.upload input{display:none}.mail-button{border:1px solid var(--line);color:var(--ink)}small{display:block;color:var(--muted);font-size:11px;font-weight:500;margin-top:5px}.email-form{display:none;grid-template-columns:1.4fr 1fr auto;gap:7px;margin-top:11px}.email-form.show{display:grid}.email-form input{min-width:0;padding:9px;border:1px solid var(--line);border-radius:6px;font:inherit}.fetch{padding:0 12px}.document-state{border-top:1px solid var(--line);margin-top:20px;padding-top:16px;color:var(--muted);display:flex;gap:8px;align-items:center;font-size:13px}.empty-dot{width:8px;height:8px;border-radius:50%;background:#b9c4be}.loaded .empty-dot{background:#3eaf74}.loaded{color:var(--ink)}#results{margin-top:28px;padding:25px}.results-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:19px}#summary{font-weight:700;color:var(--green)}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;min-width:790px}th{text-align:left;background:#f0f4ef;color:#607068;font-size:11px;letter-spacing:.8px;text-transform:uppercase;padding:11px}td{padding:13px 11px;border-top:1px solid var(--line)}.badge{padding:4px 8px;border-radius:50px;font-size:12px;font-weight:700}.match{background:#e2f4e6;color:#28754c}.mismatch,.missing,.extra{background:var(--red-bg);color:var(--red)}.missing,.extra{background:var(--gold-bg);color:var(--gold)}#notice{min-height:22px;margin:18px 2px;color:var(--red);font-weight:600}@media(max-width:720px){main{padding:30px 16px}header{display:block}.header-actions{margin-top:20px}.compare{margin-top:0;width:100%}.workspace{grid-template-columns:1fr}.load-options{grid-template-columns:1fr}.email-form.show,.settings-panel,.settings-panel form{grid-template-columns:1fr}.fetch{height:40px}}