:root{font-family:Inter,Arial,sans-serif;color:#202c3d;background:#edf1f6}*{box-sizing:border-box}body{margin:0}.app{display:grid;grid-template-columns:390px minmax(0,1fr);min-height:100vh}.panel{background:#fff;padding:26px;box-shadow:3px 0 25px #18243b13;height:100vh;overflow:auto;position:sticky;top:0}.brand{width:180px;max-height:65px;object-fit:contain;object-position:left}.panel h1{font-size:24px;margin:12px 0 5px}.muted,small{color:#778296;line-height:1.6;font-size:12px}.tabs{display:flex;gap:8px;margin:22px 0}.tabs button,.actions button,.add,.toolbar button{border:0;border-radius:8px;padding:12px 14px;cursor:pointer;background:#f1f4f9;color:#26364a;font-weight:700}.tabs button.active,.actions button:first-child,.toolbar button{background:#e99a00;color:#fff}.tabs button{flex:1}.fields{display:grid;grid-template-columns:1fr 1fr;gap:11px}.fields label{font-size:11px;font-weight:700;color:#526073;display:flex;flex-direction:column;gap:5px}.fields label:has(textarea),.fields label:has(select),.fields label:nth-child(8),.fields label:nth-child(9){grid-column:span 2}input,textarea,select{font:inherit;font-size:12px;border:1px solid #dce2e9;padding:10px;border-radius:6px;width:100%;background:#fff;color:#1f2937}textarea{resize:vertical}.panel h2{font-size:16px;margin:25px 0 10px}.edit-item{border:1px solid #e1e6ed;border-radius:9px;padding:12px;margin:10px 0;background:#fafbfd}.edit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.edit-grid label{font-size:10px;color:#596477;font-weight:700}.edit-grid label:first-child{grid-column:span 3}.edit-grid label:nth-child(2){grid-column:span 3}.edit-grid input{margin-top:4px}.remove{border:0;color:#b23b3b;background:transparent;cursor:pointer;padding:8px 0}.add{width:100%;margin:4px 0 18px;border:1px dashed #d9a333;background:#fff8e8;color:#986800}.actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:18px 0}.actions button{font-size:12px}.preview-wrap{padding:30px;overflow:auto}.toolbar{max-width:850px;margin:0 auto 18px;display:flex;justify-content:space-between;align-items:center;color:#697586;font-size:13px}#paper{background:#fff;width:210mm;min-height:297mm;margin:auto;padding:0 17mm 13mm;box-shadow:0 15px 60px #1d2a3e20;position:relative;font-size:11px;display:flex;flex-direction:column}.accent{height:9px;background:linear-gradient(90deg,#152c47 0 70%,#f0a000 70%);margin:0 -17mm 30px}.doc-header{display:flex;justify-content:space-between;gap:22px}.logo{width:195px;height:60px;object-fit:contain;object-position:left}.company{font-size:15px;letter-spacing:1.5px;font-weight:900;color:#152c47;margin:6px 0}.sub{font-size:10px;color:#687588;line-height:1.7;white-space:pre-wrap}.doc-title{text-align:right;display:flex;flex-direction:column;gap:7px;min-width:190px}.doc-title div{font-size:28px;letter-spacing:1px;font-weight:900;color:#152c47}.doc-title span{color:#617085}.goldline{height:2px;background:#e8a01a;margin:27px 0}.parties{display:grid;grid-template-columns:1fr 1fr;gap:50px;margin-bottom:30px}.eyebrow{font-size:10px;letter-spacing:1.6px;font-weight:900;color:#d28a00;margin-bottom:12px}.parties strong{font-size:14px;display:block;margin-bottom:5px}.kv{display:flex;justify-content:space-between;gap:10px;margin:8px 0;font-size:10px}.kv span{color:#7a8797}.items{border-collapse:collapse;width:100%;table-layout:fixed}.items thead{background:#18304d;color:#fff}.items th{font-size:9px;letter-spacing:.3px;text-align:right;padding:12px 6px}.items th:nth-child(2){text-align:left;width:27%}.items th:first-child{width:5%;text-align:center}.items th:nth-child(3){width:7%}.items td{padding:13px 6px;text-align:right;border-bottom:1px solid #e9edf2;vertical-align:top;font-size:10px;overflow-wrap:anywhere}.items td:nth-child(2){text-align:left;font-weight:700}.items td:first-child{text-align:center}.items td small{display:block;font-size:9px;font-weight:400}.totals-area{display:grid;grid-template-columns:1fr 250px;gap:24px;margin-top:24px}.words{line-height:1.6;font-weight:700;max-width:280px}.words p{font-weight:400}.totals>div{display:flex;justify-content:space-between;gap:12px;margin:0;padding:8px 0;border-bottom:1px solid #e8edf1}.totals span{color:#697586}.totals .grand{background:#18304d;color:white;padding:14px;margin-top:8px;font-size:14px}.totals .grand span{color:white}.bottom{display:grid;grid-template-columns:1.2fr 1fr;gap:35px;margin-top:42px}.bank{line-height:1.8;font-size:10px;white-space:pre-line}.notes-label{margin-top:20px}.signature{text-align:center;align-self:end}.sign-space{height:75px}.signature strong{display:block;border-top:1px solid #aeb8c3;padding:12px}footer{margin-top:auto;padding-top:30px;border-top:1px solid #e8edf1;display:flex;justify-content:space-between;font-size:8px;letter-spacing:.5px;color:#8b95a2;gap:20px}@media(max-width:1150px){.app{grid-template-columns:340px minmax(0,1fr)}.preview-wrap{padding:15px}#paper{transform-origin:top left;transform:scale(.8);margin:0;width:210mm}.preview-wrap{overflow-x:auto}}@media(max-width:700px){.app{display:block}.panel{height:auto;position:static}.preview-wrap{padding:12px;overflow-x:auto}.toolbar{min-width:320px}#paper{transform:scale(.45);transform-origin:top left;margin:0 0 -160mm 0}.preview-wrap{min-height:520px}}@page{size:A4;margin:0}@media print{body{background:#fff}.app{display:block}.no-print{display:none!important}.preview-wrap{padding:0;overflow:visible}#paper{width:210mm;min-height:297mm;box-shadow:none;transform:none!important;margin:0;break-inside:avoid}.items tr{break-inside:avoid}footer{break-inside:avoid}}

.signature-space{height:100px}.signature .sign-role{font-size:9px;color:#687588;margin-top:3px}.signature strong{padding:9px 8px 0}

.suggestions{display:flex;flex-direction:column;gap:4px;margin-top:5px}.suggestion{display:flex;justify-content:space-between;gap:10px;text-align:left;background:#f5f7fb;color:#1b2942;border:1px solid #dce3ed;border-radius:6px;padding:7px 9px;cursor:pointer;font-size:12px}.suggestion:hover{background:#e8eef9}.suggestion b{white-space:nowrap;color:#8a642b}

.catalog-results{max-height:220px;overflow:auto;margin-bottom:12px}.catalog-entry{padding:7px 9px;border-bottom:1px solid #ddd;font-size:12px}.catalog-entry b{margin-right:12px}input[type=file]{max-width:100%}

/* A4 print-safe layout: exact 210 × 297 mm page, with content continuing
   onto additional A4 sheets instead of shrinking or being clipped. */
#paper{width:210mm;min-height:297mm;max-width:210mm;}
@page{size:210mm 297mm;margin:0}
@media print{
  html,body{width:210mm!important;margin:0!important;padding:0!important;background:white!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .app,.preview-wrap{display:block!important;width:210mm!important;max-width:210mm!important;min-height:0!important;height:auto!important;margin:0!important;padding:0!important;overflow:visible!important}
  #paper{display:block!important;box-sizing:border-box!important;width:210mm!important;max-width:210mm!important;min-height:297mm!important;height:auto!important;margin:0!important;padding:0 17mm 15mm!important;box-shadow:none!important;transform:none!important;overflow:visible!important;break-inside:auto!important;page-break-inside:auto!important}
  .accent{margin-top:0}
  .doc-header,.parties,.totals-area,.bottom,.signature,footer{break-inside:avoid;page-break-inside:avoid}
  .items{width:100%;border-collapse:collapse;break-inside:auto;page-break-inside:auto}
  .items thead{display:table-header-group}
  .items tbody{display:table-row-group}
  .items tr{break-inside:avoid;page-break-inside:avoid}
  .items td,.items th{overflow-wrap:anywhere}
  .totals-area,.bottom{break-before:auto}
  footer{margin-top:25mm}
  .no-print{display:none!important}
}
