:root{--ink:#153b37;--green:#185c53;--mint:#d9efe7;--paper:#f6f3ea;--line:#d8d7cf;--rust:#c6623d;--white:#fff}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:#1c2927;font:15px/1.5 Inter,Segoe UI,Arial,sans-serif}.topbar{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100vw - 1180px)/2));border-bottom:1px solid var(--line);background:rgba(246,243,234,.92)}.brand{color:var(--ink);font-size:21px;font-weight:850;letter-spacing:.06em;text-decoration:none}.brand span{color:var(--rust)}.template-link{color:var(--green);font-weight:700}.page{max-width:1180px;margin:auto;padding:52px 24px 80px}.hero{display:grid;grid-template-columns:1.6fr .8fr;gap:42px;align-items:end;margin-bottom:40px}.eyebrow{font-size:12px;font-weight:800;letter-spacing:.18em;color:var(--rust)}h1{font-family:Georgia,serif;font-size:clamp(44px,6vw,76px);line-height:.98;margin:14px 0 20px;color:var(--ink);font-weight:500}h1 em{color:var(--rust);font-weight:500}.lead{max-width:650px;font-size:18px;color:#53605d}.hero-note{background:var(--ink);color:white;padding:28px;display:grid;gap:8px}.hero-note strong{font-size:12px;letter-spacing:.13em;color:#a9d8c9}.hero-note b{color:#e69b79;font-size:24px}.panel{background:var(--white);border:1px solid var(--line);padding:30px;margin-top:18px;box-shadow:0 7px 22px rgba(31,57,52,.04)}.section-heading{display:flex;gap:18px;align-items:flex-start;margin-bottom:25px}.section-heading>span{background:var(--mint);color:var(--green);font-weight:850;padding:5px 9px}.section-heading h2{margin:0;color:var(--ink);font:600 28px Georgia,serif}.section-heading p,.form-item p{margin:3px 0 0;color:#74807d}.upload-form{display:grid;grid-template-columns:1fr 1.6fr auto;gap:16px;align-items:end}label{display:grid;gap:7px;font-weight:700;color:#3b4c49}select,input[type=file]{width:100%;border:1px solid #bdc8c4;background:#fff;padding:11px 12px;min-height:45px;color:#243532}button{border:0;background:var(--rust);color:white;padding:13px 20px;min-height:45px;font-weight:800;cursor:pointer}button:hover{background:#a94e2f}.mapping-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-bottom:22px}.notice{background:#fff1d7;border-left:4px solid #d99520;padding:14px 18px;margin-bottom:18px}.errors{background:#fff2ef;color:#8a3823;padding:16px 16px 16px 38px;max-height:220px;overflow:auto}.success{background:#e5f4ec;color:#1e684d;padding:14px 18px}.table-wrap{overflow:auto;margin-top:18px;border:1px solid var(--line)}table{border-collapse:collapse;width:100%;min-width:760px}th,td{text-align:left;padding:11px 13px;border-bottom:1px solid #e5e5df}th{background:#edf3f0;color:var(--ink);font-size:12px;text-transform:uppercase;letter-spacing:.05em}.form-list{display:grid;grid-template-columns:1fr 1fr;gap:10px}.form-item{border:1px solid var(--line);display:grid;grid-template-columns:48px 1fr auto;gap:14px;align-items:center;padding:14px}.form-number{font:600 22px Georgia,serif;color:var(--rust)}.form-item h3{font-size:15px;margin:0;color:var(--ink)}.status{font-size:11px;font-weight:800;padding:5px 8px;max-width:190px;text-align:right}.ready{background:#dff2e8;color:#176244}.missing{background:#fff0e8;color:#9a482a}.neutral{background:#efefeb;color:#68716f}.export-box{margin-top:24px;padding:22px;background:#f1f6f3;border-left:4px solid var(--green);display:flex;align-items:center;justify-content:space-between;gap:24px}.export-box strong{font-size:18px;color:var(--ink)}.export-box p{margin:5px 0 0;color:#65716e;max-width:700px}.export-box form{flex:0 0 auto}.export-button{background:var(--green)}.export-button:hover{background:#104940}.export-disabled{color:#9a482a;font-weight:700}footer{text-align:center;padding:28px;color:#7c8583;border-top:1px solid var(--line)}@media(max-width:850px){.hero{grid-template-columns:1fr}.upload-form,.mapping-grid{grid-template-columns:1fr}.form-list{grid-template-columns:1fr}.form-item{grid-template-columns:42px 1fr}.status{grid-column:2;text-align:left;width:max-content}.export-box{align-items:flex-start;flex-direction:column}.page{padding-top:35px}}
/* Chế độ in/đối chiếu đơn sắc: giữ tương phản, bỏ toàn bộ màu thương hiệu. */
:root{--ink:#111;--green:#111;--mint:#eee;--paper:#fff;--line:#b8b8b8;--rust:#111;--white:#fff}
body{background:#fff;color:#111}.topbar{background:#fff;border-color:#111}.brand,.template-link,.section-heading h2,.form-item h3{color:#111}.brand span,.eyebrow,.form-number{color:#111}.hero-note{background:#111;color:#fff}.hero-note strong,.hero-note b{color:#fff}.panel{background:#fff;border-color:#b8b8b8;box-shadow:none}.section-heading>span,.status,.ready,.missing,.neutral{background:#eee;color:#111}.lead,.section-heading p,.form-item p,.export-box p{color:#555}button,.export-button,button:hover,.export-button:hover{background:#111;color:#fff}.notice,.success,.errors{background:#f2f2f2;color:#111;border-color:#111}.table-wrap{border-color:#111}th{background:#eee;color:#111}.export-box{background:#f2f2f2;border-color:#111}.export-disabled{color:#111}footer{color:#555;border-color:#111}