:root{--bg:#f4f6f9;--card:#fff;--ink:#1f2937;--muted:#6b7280;--line:#d9dee7;--brand:#0f4c81;--brand2:#17324d;--ok:#16865a;--danger:#b42318}
*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--ink)}
a{color:inherit;text-decoration:none}.topbar{height:64px;background:linear-gradient(90deg,var(--brand2),var(--brand));color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 24px;position:sticky;top:0;z-index:20}.brand{font-size:18px;font-weight:700}.nav{display:flex;gap:8px;flex-wrap:wrap}.nav a{padding:9px 12px;border-radius:8px;color:#eaf2f8}.nav a:hover,.nav a.active{background:rgba(255,255,255,.14)}
.container{max-width:1380px;margin:24px auto;padding:0 18px}.grid{display:grid;grid-template-columns:1fr 1.08fr;gap:22px;align-items:start}.card{background:var(--card);border:1px solid #e7eaf0;border-radius:14px;box-shadow:0 5px 20px rgba(15,23,42,.06)}.card-h{padding:18px 20px;border-bottom:1px solid #edf0f4;display:flex;align-items:center;justify-content:space-between}.card-b{padding:20px}.title{font-size:22px;margin:0}.sub{color:var(--muted);font-size:13px;margin-top:4px}
.row{display:grid;grid-template-columns:repeat(12,1fr);gap:12px}.col-12{grid-column:span 12}.col-8{grid-column:span 8}.col-6{grid-column:span 6}.col-4{grid-column:span 4}.col-3{grid-column:span 3}.col-2{grid-column:span 2}.field{margin-bottom:13px}.field label{display:block;font-size:12px;font-weight:700;color:#4b5563;margin-bottom:6px}.input,select,textarea{width:100%;border:1px solid #cfd6df;border-radius:8px;padding:10px 11px;background:#fff;font:inherit;color:#111827}.input:focus,select:focus,textarea:focus{outline:2px solid #cfe5f7;border-color:#6aa6d1}textarea{min-height:74px;resize:vertical}.btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:9px;padding:10px 14px;font-weight:700;cursor:pointer;background:#e9eef5;color:#233142}.btn-primary{background:var(--brand);color:#fff}.btn-ok{background:var(--ok);color:#fff}.btn-danger{background:#fee4e2;color:var(--danger)}.btn-sm{padding:7px 9px;font-size:12px}.actions{display:flex;gap:8px;flex-wrap:wrap}.flash{padding:12px 14px;border-radius:9px;margin-bottom:16px;background:#e9f7ef;color:#11633f}.warn{background:#fff3cd;color:#725b00}
.table{width:100%;border-collapse:collapse}.table th,.table td{border-bottom:1px solid #edf0f4;padding:11px;text-align:left;font-size:13px}.table th{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:#64748b;background:#fafbfc}.right{text-align:right!important}.muted{color:var(--muted)}
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:20px}.login{width:min(430px,100%)}
.preview-shell{background:#dfe4ea;padding:18px;border-radius:12px;overflow:auto}.paper{width:210mm;min-height:297mm;background:#fff;margin:auto;padding:15mm 14mm;box-shadow:0 4px 20px rgba(0,0,0,.12);font-family:Arial,Helvetica,sans-serif;color:#111;font-size:11px}.paper h1{text-align:center;font-size:27px;margin:4px 0 14px;font-family:Georgia,serif}.supplier-name{font-size:24px;font-weight:700}.supplier-meta{line-height:1.55;margin-top:5px}.doc-head{display:grid;grid-template-columns:1fr 1.05fr;gap:25px;margin-top:20px}.doc-meta{display:grid;grid-template-columns:105px 1fr;row-gap:10px;font-size:12px}.buyer{font-size:11px;line-height:1.45}.paper-table{width:100%;border-collapse:collapse;margin-top:18px}.paper-table th,.paper-table td{border:1px solid #222;padding:7px 5px;vertical-align:top}.paper-table th{font-size:10px;background:#fafafa}.paper-table td{font-size:10px}.total-row{font-weight:bold}.bank{margin-top:10px;line-height:1.45;font-size:10px}.signature{margin-top:44px;margin-left:auto;width:45%;text-align:center;border-top:1px solid #333;padding-top:6px}.small-note{margin-top:18px;font-size:9px;color:#444;line-height:1.45}
.item-card{border:1px solid #e3e7ed;border-radius:10px;padding:12px;margin-bottom:10px;background:#fbfcfe}.kpi{display:flex;gap:12px;flex-wrap:wrap;margin:14px 0}.kpi span{background:#eef5fb;border-radius:999px;padding:8px 11px;font-size:12px;font-weight:700}
@media(max-width:1000px){.grid{grid-template-columns:1fr}.preview-shell{display:none}.col-8,.col-6,.col-4,.col-3,.col-2{grid-column:span 12}.topbar{height:auto;padding:14px 16px;gap:12px;align-items:flex-start;flex-direction:column}}
@media print{body{background:#fff}.no-print,.topbar{display:none!important}.container{margin:0;padding:0;max-width:none}.card{box-shadow:none;border:0}.card-h{display:none}.card-b{padding:0}.preview-shell{padding:0;background:#fff}.paper{box-shadow:none;margin:0;width:210mm;min-height:297mm;padding:12mm 13mm}.grid{display:block}.form-side{display:none!important}@page{size:A4;margin:0}}

/* ===== V2.1 helpers ===== */
.sep{border:0;border-top:1px solid #edf0f4;margin:20px 0}.help{font-size:11px;color:var(--muted);margin-top:5px;line-height:1.35}.top-gap{margin-top:14px}.badge{display:inline-flex;align-items:center;border-radius:999px;padding:3px 8px;font-size:11px;font-weight:700;vertical-align:middle}.badge-ok{background:#dff5e9;color:#11633f}.badge-info{background:#e6f1fb;color:#155b8f}.badge-warn{background:#fff1c7;color:#7a5b00}.badge-muted{background:#eceff3;color:#5d6775}.review-alert{margin:16px 20px 0;padding:12px 14px;border-radius:10px;background:#fff4d7;color:#725b00}.status-box{display:grid;gap:10px;padding:14px;border:1px solid #e5eaf0;border-radius:10px;background:#fbfcfe;margin-bottom:16px}.review-message{padding:10px;background:#fff7dc;border-radius:8px}.copy-row{display:flex;gap:8px;align-items:center}.copy-row .input{flex:1}.inline-form{display:flex;gap:8px;align-items:end;flex-wrap:wrap}.compact-label{font-size:11px;font-weight:700;color:#64748b}.days-input{width:90px!important}

/* ===== V2.1 document layout - closer to source PDF ===== */
.document-paper{padding:22mm 13mm 13mm;font-family:Arial,Helvetica,sans-serif;font-size:10.5px;color:#111}
.doc-top{position:relative;min-height:49mm;padding-top:4mm}
.doc-top h1{font-family:Georgia,'Times New Roman',serif;font-size:30px;line-height:1;font-weight:700;text-align:right;margin:9mm 13mm 0 0;color:#262626}
.document-paper .supplier-name{font-size:26px;line-height:1.08;font-weight:700;letter-spacing:.1px}
.document-paper .supplier-meta{font-size:10.1px;line-height:1.5;max-width:64%;margin-top:10px}
.original-head{grid-template-columns:1fr 1.08fr;gap:26px;margin-top:14px;min-height:60mm}
.original-meta{grid-template-columns:124px 1fr;row-gap:16px;font-size:12px;align-content:start;padding-top:8px;padding-left:16mm}
.original-meta strong{font-family:'Trebuchet MS',Arial,sans-serif;font-size:12px;font-weight:700}
.original-buyer{font-size:10.8px;line-height:1.42;padding-top:5px}
.buyer-tax{position:relative;border-bottom:0;padding-bottom:11px;margin-top:4px}
.buyer-tax::after{content:'';position:absolute;left:0;right:0;bottom:0;height:7px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='7' viewBox='0 0 120 7'%3E%3Cpath d='M0 4 Q 3 1 6 4 T 12 4 T 18 4 T 24 4 T 30 4 T 36 4 T 42 4 T 48 4 T 54 4 T 60 4 T 66 4 T 72 4 T 78 4 T 84 4 T 90 4 T 96 4 T 102 4 T 108 4 T 114 4 T 120 4' stroke='%23707070' fill='none' stroke-width='1'/%3E%3C/svg%3E");background-repeat:repeat-x;background-position:left bottom;background-size:120px 7px}
.consignee-title{margin-top:10px;font-size:12px}.consignee-value{margin-top:18px;font-size:11px}

.original-frame{border:1.1px solid #2f2f2f;min-height:139mm;display:flex;flex-direction:column;margin-top:6.5mm}
.shipment-table{width:100%;border-collapse:collapse;table-layout:fixed}
.shipment-table th,.shipment-table td{border-right:1px solid #2f2f2f;border-bottom:1px solid #2f2f2f;padding:4px 6px;text-align:left;font-size:10.1px;height:7.5mm}
.shipment-table th{font-family:'Trebuchet MS',Arial,sans-serif;font-size:11px;font-weight:700}
.shipment-table th:last-child,.shipment-table td:last-child{border-right:0}
.shipment-table th:nth-child(1){width:20%}.shipment-table th:nth-child(2){width:17%}.shipment-table th:nth-child(3){width:23%}.shipment-table th:nth-child(4){width:16%}.shipment-table th:nth-child(5){width:24%}
.shipment-table tbody td:first-child{text-align:center}
.frame-content{flex:1;display:flex;flex-direction:column;padding:0 7px 0 6px}
.items-original{width:100%;border-collapse:collapse;table-layout:fixed;margin-top:2px}
.items-original th,.items-original td{border:0;padding:5px 3px;vertical-align:top;font-size:10.5px}
.items-original th{text-align:left;font-family:'Trebuchet MS',Arial,sans-serif;font-size:10.8px;font-weight:700}
.items-original td.item-content{text-align:center;font-size:11px;line-height:1.28}
.items-original tbody td{padding-top:14px;padding-bottom:8px}
.secondary-amount{margin-top:4px;font-size:10.4px}
.bank-hs-row{display:grid;grid-template-columns:1.28fr .72fr;gap:18px;margin-top:18px}
.original-bank{font-size:9.55px;line-height:1.34;margin:0}.original-bank strong{font-weight:700}
.hs-block{font-size:10px;padding-top:4px}.hs-block>div{margin-bottom:4px}
.original-notes{font-size:9px;margin-top:9px}
.frame-spacer{flex:1;min-height:32mm}
.bottom-total{align-self:flex-end;min-width:46%;display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;border-top:1px solid #2f2f2f;padding:6px 6px 2px 12px;margin-top:10px}
.bottom-total-label{font-family:'Trebuchet MS',Arial,sans-serif;font-size:12.5px;font-weight:700;white-space:nowrap}
.bottom-total-values{text-align:right}
.bottom-total-values strong{display:block;font-size:13.8px;line-height:1.1;font-weight:700}
.secondary-total{margin-top:3px;font-size:10.4px;line-height:1.1}

.signature-zone{position:relative;width:58%;margin-left:auto;margin-top:10px;min-height:28mm;text-align:center}
.signature-stack{min-height:24mm;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:3mm;padding:0 0 2mm}
.stamp-img{max-height:17mm;max-width:58mm;object-fit:contain;opacity:.85}
.sign-img{max-height:16mm;max-width:64mm;object-fit:contain}
.supplier-sign-line{border-top:1px solid #2f2f2f;padding-top:5px;font-size:14.5px;line-height:1.1;margin-top:4px}
.mini-paper{min-height:250mm}

/* ===== public review ===== */
.public-body{background:#eef2f6;color:#1f2937}.public-top{position:sticky;top:0;z-index:30;background:#153f65;color:#fff;min-height:64px;padding:11px 22px;display:flex;align-items:center;justify-content:space-between;gap:16px;box-shadow:0 2px 10px rgba(0,0,0,.12)}.public-top>div:first-child>strong{font-size:18px}.public-top>div:first-child>div{font-size:12px;opacity:.8;margin-top:2px}.public-tabs{display:flex;gap:8px;flex-wrap:wrap}.public-tabs a,.public-tabs button{border:0;background:rgba(255,255,255,.12);color:#fff;padding:9px 12px;border-radius:8px;font:inherit;cursor:pointer}.public-tabs a.active{background:#fff;color:#153f65;font-weight:700}.public-wrap{max-width:1180px;margin:20px auto;padding:0 16px 40px}.public-doc-shell{overflow:auto;padding:16px;background:#dfe4ea;border-radius:14px}.public-card{background:#fff;border:1px solid #e1e6ec;border-radius:14px;padding:18px 20px;margin:0 0 16px;box-shadow:0 5px 20px rgba(15,23,42,.05)}.public-card h1,.public-card h2,.public-card h3{margin-top:0}.notice-danger{background:#fff0ef;border-color:#ffc7c2;color:#8d271f}.notice-ok{background:#eaf8f0;border-color:#bce7ce;color:#14643f}.review-action-card{margin-top:18px}.review-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.review-form{border:1px solid #e0e6ed;border-radius:12px;padding:16px}.revision-form{background:#fbfcfe}.checkline{display:flex;gap:8px;align-items:flex-start;font-size:12px;line-height:1.35;margin:12px 0 15px}.checkline input{margin-top:2px}

@media(max-width:800px){.public-top{align-items:flex-start;flex-direction:column}.review-grid{grid-template-columns:1fr}.public-doc-shell{padding:6px}.document-paper{transform-origin:top left}.copy-row{flex-direction:column;align-items:stretch}.original-head{grid-template-columns:1fr 1fr}.signature-zone{width:100%}}
@media print{.public-body{background:#fff}.public-wrap{max-width:none;margin:0;padding:0}.public-doc-shell{padding:0;background:#fff;border-radius:0;overflow:visible}.public-card{display:none!important}.document-paper{box-shadow:none;margin:0;width:210mm;min-height:297mm;padding:19mm 13mm 12mm}.signature-zone{break-inside:avoid}.original-frame{break-inside:avoid}}

/* ===== V2.2 unit price precision ===== */
.item-price-row .price{font-variant-numeric:tabular-nums}.item-row-actions{display:flex;justify-content:flex-end;margin-top:-3px;margin-bottom:6px}.price-decimals{min-width:92px}.item-price-row .col-4 .price{font-size:16px;padding-left:14px;padding-right:14px}