/* TradeDocs AI */
:root{
  --ink:#14213d; --ink2:#3d4a63; --muted:#6b7590; --line:#dfe3ec; --bg:#f4f6fa; --card:#fff;
  --brand:#0f3d6e; --brand2:#174f8c; --accent:#e8892b; --ai:#6b4ce6; --ok:#1f8a4c; --warn:#b7791f; --err:#c0392b;
  --r:10px; --font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0}
body{font:14px/1.5 var(--font);color:var(--ink);background:var(--bg)}
a{color:var(--brand2)}
h1{font-size:22px;margin:0}
h2{font-size:16px;margin:0 0 12px}
h3{font-size:14px;margin:18px 0 8px;color:var(--ink2)}
code{background:#eef1f6;padding:1px 5px;border-radius:4px}
.muted{color:var(--muted)} .small{font-size:12px} .c{text-align:center} .r{text-align:right}

/* top bar */
.top{display:flex;align-items:center;gap:18px;background:var(--brand);color:#fff;padding:0 22px;height:58px;position:sticky;top:0;z-index:20}
.brand{color:#fff;text-decoration:none;font-weight:700;font-size:16px;display:flex;align-items:center;gap:8px;white-space:nowrap}
.logo{display:inline-grid;place-items:center;width:28px;height:28px;background:var(--accent);border-radius:7px;color:#fff;font-size:15px}
.top nav{display:flex;gap:2px;flex:1;overflow-x:auto}
.top nav a{color:#cfe0f5;text-decoration:none;padding:7px 11px;border-radius:7px;white-space:nowrap}
.top nav a:hover{background:rgba(255,255,255,.08);color:#fff}
.top nav a.on{background:rgba(255,255,255,.15);color:#fff}
.top nav a.ai{color:#ffd8ae} .top nav a.admin{margin-left:auto;color:#ffd8ae}
.who{display:flex;align-items:center;gap:10px;font-size:13px;white-space:nowrap}
.who form{margin:0} .who .link{color:#cfe0f5}
.wrap{max-width:1360px;margin:0 auto;padding:22px}
.narrow{max-width:760px;margin:0 auto;padding:40px 18px}
.foot{text-align:center;color:var(--muted);font-size:12px;padding:24px}

/* building blocks */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:20px;margin-bottom:18px;box-shadow:0 1px 2px rgba(20,33,61,.04)}
.narrowcard{max-width:560px}
.pagehead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:#fff;color:var(--ink);padding:8px 14px;border-radius:8px;font:inherit;font-weight:600;cursor:pointer;text-decoration:none;white-space:nowrap}
.btn:hover{border-color:#b9c2d3}
.btn.primary{background:var(--brand2);border-color:var(--brand2);color:#fff}
.btn.primary:hover{background:var(--brand)}
.btn.ai{background:#f1edff;border-color:#d8cffc;color:var(--ai)}
.btn.danger{background:var(--err);color:#fff;border-color:var(--err)}
.btn.big{padding:12px 18px;font-size:15px} .btn.small{padding:5px 10px;font-size:12px}
.btn.wide{width:100%;justify-content:center}
.btn:disabled{opacity:.5;cursor:not-allowed}
.link{background:none;border:0;padding:0;color:var(--brand2);cursor:pointer;font:inherit;text-decoration:underline}
.link.danger{color:var(--err)}
.flash{padding:11px 14px;border-radius:8px;margin-bottom:14px;border:1px solid}
.flash.ok{background:#eaf7ef;border-color:#bfe4cc;color:#155d34}
.flash.err{background:#fdeeee;border-color:#f3c4c0;color:#8e2219}
.flash.warn{background:#fff7e6;border-color:#f3d9a4;color:#7a5413}
.flash.info{background:#eef4fd;border-color:#c9dbf5;color:#1d4677}
.badge{display:inline-block;font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;background:#eef1f6;color:var(--ink2);text-decoration:none;vertical-align:middle}
.b-draft{background:#eef1f6} .b-ready{background:#e7f0fd;color:#1d4677} .b-shipped{background:#e9f7ef;color:#1f8a4c}
.b-closed{background:#fdeeee;color:#8e2219} .b-final{background:#e9f7ef;color:#1f8a4c} .b-ai{background:#f1edff;color:var(--ai)}
.b-signed{background:#fff3e4;color:#a85d12}

/* forms */
.fld{display:flex;flex-direction:column;gap:4px;margin-bottom:12px;min-width:0}
.fld>span{font-size:12px;font-weight:600;color:var(--ink2)}
input[type=text],input[type=email],input[type=password],input[type=number],input[type=date],input:not([type]),select,textarea{
  width:100%;border:1px solid var(--line);border-radius:7px;padding:8px 10px;font:inherit;background:#fff;color:var(--ink)}
input:focus,select:focus,textarea:focus{outline:2px solid #bcd3f2;border-color:var(--brand2)}
textarea{resize:vertical}
.radio{display:flex;gap:8px;align-items:center;margin:6px 0 12px;cursor:pointer}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.grid2,.grid3,.grid4{display:grid;gap:0 14px}
.grid2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid4{grid-template-columns:repeat(4,minmax(0,1fr))}
.grid2.cols{gap:18px;align-items:start}
.span2{grid-column:span 2}
fieldset.party{border:1px solid var(--line);border-radius:9px;padding:12px 14px 2px;margin:0 0 14px}
legend{font-weight:700;padding:0 6px;color:var(--brand)}
details{margin:8px 0} summary{cursor:pointer;color:var(--brand2);font-weight:600;margin-bottom:10px}
.formbar{display:flex;gap:12px;align-items:center;padding-top:14px;border-top:1px solid var(--line);margin-top:8px;position:sticky;bottom:0;background:#fff;padding-bottom:6px}
.search input{min-width:240px}

/* layout splits */
.split{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:18px;align-items:start}
.side{position:sticky;top:76px}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:4px 0 16px;flex-wrap:wrap}
.tabs button{border:0;background:none;padding:9px 12px;font:inherit;font-weight:600;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px}
.tabs button.on{color:var(--brand2);border-color:var(--brand2)}
.tab{display:none}.tab.on{display:block}
.line{border:1px solid var(--line);border-radius:9px;padding:10px 14px 0;margin-bottom:12px;background:#fbfcfe}
.line-h{display:flex;justify-content:space-between;margin-bottom:6px}
.totals-bar{background:#f1f5fb;border-radius:8px;padding:10px 14px;margin-top:12px}

/* lists */
table.list{width:100%;border-collapse:collapse}
table.list th{text-align:left;font-size:12px;color:var(--muted);font-weight:600;border-bottom:1px solid var(--line);padding:8px}
table.list td{border-bottom:1px solid #eef1f6;padding:9px 8px;vertical-align:top}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin-bottom:18px}
.stat{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:16px}
.stat b{display:block;font-size:26px;color:var(--brand)} .stat span{color:var(--muted);font-size:12px}
.doclist{list-style:none;margin:0 0 10px;padding:0}
.doclist li{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center;padding:8px 0;border-bottom:1px solid #eef1f6}
.doclist li>.small{flex-basis:100%}
.gen .grp{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:12px 0 4px;font-weight:700}
.chk{display:flex;gap:8px;align-items:center;padding:3px 0;cursor:pointer}
.gen .btn{margin-top:12px}
.docnav{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:16px}
.docnav a{padding:6px 12px;border-radius:999px;background:#fff;border:1px solid var(--line);text-decoration:none;color:var(--ink2);font-size:13px}
.docnav a.on{background:var(--brand2);border-color:var(--brand2);color:#fff}
.kv{display:grid;grid-template-columns:max-content 1fr;gap:6px 14px;margin:8px 0 12px}
.kv span{color:var(--muted)}
.ticks{padding-left:18px}.ticks li{margin:4px 0}
.warnticks li::marker{color:var(--warn)}

/* auth / install */
.auth{max-width:420px;margin:40px auto}
.auth h1{display:flex;gap:10px;align-items:center;margin-bottom:6px}
.install h1{display:flex;gap:10px;align-items:center;margin-bottom:20px}
.install h2{margin-top:22px}
.checks{list-style:none;padding:0;columns:2}
.checks li.ok{color:var(--ok)}.checks li.bad{color:var(--err);font-weight:600}.checks li.warn{color:var(--warn)}
.steps li{margin:6px 0}

/* AI import */
.ai-card h2{color:var(--ai)}
.drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;border:2px dashed #c8bff5;background:#faf8ff;border-radius:12px;padding:34px 20px;margin:14px 0 16px;cursor:pointer;text-align:center;position:relative}
.drop input{position:absolute;inset:0;opacity:0;cursor:pointer}
.drop.over,.drop.has{border-color:var(--ai);background:#f1edff}
.drop-t{font-weight:700;color:var(--ai);font-size:15px}
.drop-f{font-weight:600}
.overlay{position:fixed;inset:0;background:rgba(15,25,50,.55);display:none;place-items:center;z-index:100}
.overlay.on{display:grid}
.ov-box{background:#fff;border-radius:14px;padding:30px 40px;text-align:center;min-width:320px}
.spinner{width:44px;height:44px;border:4px solid #e6e0ff;border-top-color:var(--ai);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 14px}
@keyframes spin{to{transform:rotate(360deg)}}
.flag{display:flex;gap:14px;border:1px solid var(--line);border-left-width:4px;border-radius:8px;padding:12px 14px;margin-bottom:10px}
.flag p{margin:4px 0 0;color:var(--ink2)}
.flag .sev{font-size:11px;font-weight:800;min-width:60px}
.sev-high{border-left-color:var(--err);background:#fffafa}.sev-high .sev{color:var(--err)}
.sev-medium{border-left-color:var(--warn)}.sev-medium .sev{color:var(--warn)}
.sev-low{border-left-color:#8aa0c0}.sev-low .sev{color:#5a6f8f}
.permit{border-bottom:1px solid #eef1f6;padding:10px 0}
.permit p{margin:4px 0}
.p-required{background:#fdeeee;color:#8e2219}.p-likely_required{background:#fff3e4;color:#a85d12}.p-check{background:#e7f0fd;color:#1d4677}.p-not_required{background:#e9f7ef;color:#1f8a4c}
.lic-yes{color:var(--err)}.lic-possibly{color:var(--warn)}.lic-no{color:var(--ok)}

/* stamps */
.stamp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}
.stamp-card{border:1px solid var(--line);border-radius:9px;padding:10px;display:flex;flex-direction:column;gap:4px}
.checker{height:120px;display:grid;place-items:center;border-radius:6px;background:repeating-conic-gradient(#eef1f6 0 25%,#fff 0 50%) 0 0/16px 16px}
.checker img{max-width:100%;max-height:110px}
#sigPad{width:100%;max-width:560px;height:auto;aspect-ratio:560/200;border:1px dashed #9aa7bf;border-radius:8px;background:#fff;touch-action:none;cursor:crosshair;display:block;margin-bottom:10px}
.logo-prev{max-height:60px;vertical-align:middle}

/* document workspace */
.docwork{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:18px;align-items:start}
.docstage{overflow:auto;background:#d9dee8;border-radius:var(--r);padding:24px}
.docside{position:sticky;top:76px}
.palette{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:10px}
.pal{border:1px solid var(--line);border-radius:8px;padding:6px;cursor:grab;text-align:center;background:repeating-conic-gradient(#f3f5f9 0 25%,#fff 0 50%) 0 0/12px 12px}
.pal:hover{border-color:var(--brand2)}
.pal img{max-width:100%;height:56px;object-fit:contain;pointer-events:none}
.pal span{display:block;font-size:11px;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ======== A4 DOCUMENT ======== */
.doc-page{position:relative;width:210mm;min-height:297mm;margin:0 auto;background:#fff;color:#111;padding:14mm 13mm 16mm;font:9.2pt/1.38 "Helvetica Neue",Arial,sans-serif;box-shadow:0 4px 20px rgba(0,0,0,.18)}
.doc-page.dropping{outline:3px dashed var(--ai);outline-offset:-6px}
.doc-page .dh{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:2.5px solid #0f3d6e;padding-bottom:8px;margin-bottom:10px}
.dh-left{display:flex;flex-direction:column;gap:4px;max-width:55%}
.dh-logo{max-height:48px;max-width:170px;object-fit:contain;object-position:left}
.dh-co{font-weight:700;font-size:11pt;color:#0f3d6e}
.dh-addr{font-size:7.8pt;color:#333;line-height:1.35}
.dh-right{text-align:right}
.dh-title{font-size:15pt;font-weight:800;letter-spacing:.04em;color:#0f3d6e}
.dh-sub{font-size:8pt;color:#555;max-width:300px;margin-left:auto}
.dh-no{font-weight:700;margin-top:3px}
.dh-date{color:#333}
.copy-label{display:inline-block;margin-top:4px;border:1.5px solid #0f3d6e;color:#0f3d6e;font-weight:800;font-size:7.5pt;letter-spacing:.12em;padding:1px 8px}
.doc-page .grid{display:grid;border-top:1px solid #9aa6b8;border-left:1px solid #9aa6b8;margin-bottom:8px}
.doc-page .grid.g2{grid-template-columns:1fr 1fr}.doc-page .grid.g3{grid-template-columns:repeat(3,1fr)}.doc-page .grid.g4{grid-template-columns:repeat(4,1fr)}
.doc-page .cell{border-right:1px solid #9aa6b8;border-bottom:1px solid #9aa6b8;padding:4px 6px;min-height:30px;min-width:0;overflow-wrap:anywhere}
.doc-page .lbl{font-size:6.8pt;text-transform:uppercase;letter-spacing:.05em;color:#56627a;font-weight:700}
.doc-page .val{font-size:8.8pt}
table.goods{width:100%;border-collapse:collapse;margin:4px 0 8px;font-size:8.4pt}
table.goods th{background:#0f3d6e;color:#fff;font-size:7pt;text-transform:uppercase;letter-spacing:.04em;padding:5px 5px;text-align:left;-webkit-print-color-adjust:exact;print-color-adjust:exact}
table.goods td{border-bottom:1px solid #c9d0dc;padding:5px;vertical-align:top}
table.goods tfoot td{font-weight:800;border-top:1.5px solid #0f3d6e;border-bottom:0}
table.goods .r{text-align:right}table.goods .c{text-align:center}table.goods th.r{text-align:right}table.goods th.c{text-align:center}
table.goods .w{width:38%}
.doc-page .small{font-size:7.6pt}
.row2{display:grid;grid-template-columns:1fr 250px;gap:14px;margin:6px 0;align-items:start}
.row2 .bank{margin-top:6px;padding-top:6px;border-top:1px dashed #c9d0dc}
table.sum{width:100%;border-collapse:collapse;font-size:9pt}
table.sum td{padding:3px 6px;border-bottom:1px solid #e1e5ec}table.sum td:last-child{text-align:right;font-weight:600}
table.sum tr.grand td{background:#0f3d6e;color:#fff;font-weight:800;font-size:10pt;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.totline{font-weight:700;padding:6px;background:#f1f4f9;margin-bottom:8px;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.remarks{border:1px solid #c9d0dc;padding:5px 7px;margin:6px 0;font-size:8.4pt}
.decl{font-size:8pt;color:#222;margin:10px 0 8px;font-style:italic}
.signrow{display:grid;grid-template-columns:1fr 300px;gap:14px;align-items:stretch;margin-top:6px}
.signinfo{font-size:8.6pt;display:flex;flex-direction:column;gap:3px;justify-content:flex-end}
.signinfo .lbl{display:inline-block;min-width:80px}
.signzone,.certspace{border:1px dashed #9aa6b8;height:34mm;border-radius:3px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:3px}
.signzone span,.certspace span{font-size:6.8pt;color:#8a94a6;text-transform:uppercase;letter-spacing:.06em}
.certbox{margin-top:10px;border:1px solid #9aa6b8;padding:6px}
.certspace{height:30mm;margin-top:4px}
.stamp-layer{position:absolute;inset:0;pointer-events:none}
.placed{position:absolute;pointer-events:auto;user-select:none;touch-action:none;cursor:move;transform-origin:50% 50%}
.placed img{display:block;width:100%;height:auto;mix-blend-mode:multiply}
.placed .h-resize,.placed .h-rot,.placed .h-del{display:none;position:absolute;width:18px;height:18px;border-radius:50%;background:var(--brand2);color:#fff;font:bold 12px/18px sans-serif;text-align:center;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.placed .h-resize{right:-9px;bottom:-9px;cursor:nwse-resize}
.placed .h-rot{right:-9px;top:-9px;cursor:grab}
.placed .h-del{left:-9px;top:-9px;background:var(--err);cursor:pointer}
.docstage .placed:hover,.docstage .placed.sel{outline:1px dashed var(--brand2)}
.docstage .placed:hover .h-resize,.docstage .placed.sel .h-resize,.docstage .placed:hover .h-rot,.docstage .placed.sel .h-rot,.docstage .placed:hover .h-del,.docstage .placed.sel .h-del{display:block}

/* print */
.print-body{background:#d9dee8;padding:20px 0}
.print-body .doc-page{margin-bottom:20px}
.print-bar{max-width:210mm;margin:0 auto 14px;display:flex;gap:12px;align-items:center}
@page{size:A4;margin:0}
@media print{
  body,.print-body{background:#fff;padding:0}
  .no-print,.top,.foot,.docside,.pagehead,.docnav,.actions{display:none!important}
  .doc-page{box-shadow:none;margin:0;page-break-after:always;break-after:page}
  .doc-page:last-child{page-break-after:auto;break-after:auto}
  .signzone,.certspace{border-color:#c6ccd7}
  .signzone span,.certspace span{color:#b4bccb}
  .wrap{padding:0;max-width:none}
  .card{border:0;box-shadow:none;break-inside:avoid}
}

/* responsive */
@media (max-width:1100px){.split,.docwork{grid-template-columns:1fr}.side,.docside{position:static}}
@media (max-width:760px){
  .grid3,.grid4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid2:not(.cols){grid-template-columns:1fr}.grid2.cols{grid-template-columns:1fr}
  .top{flex-wrap:wrap;height:auto;padding:8px 12px}.top nav{order:3;flex-basis:100%}
  .wrap{padding:14px}.checks{columns:1}.docstage{padding:8px}
}

/* document editing & locking */
fieldset.plain{border:0;padding:0;margin:0;min-width:0}
.doc-content.editing{outline:2px dashed var(--ai);outline-offset:4px;cursor:text}
.doc-content.editing .cell:hover,.doc-content.editing td:hover{background:#faf8ff}
.doc-page.locked .placed{cursor:default}
.doc-page.locked .placed .h-resize,.doc-page.locked .placed .h-rot,.doc-page.locked .placed .h-del{display:none!important}
.doc-page.locked .placed:hover{outline:0!important}
@media print{.doc-content.editing{outline:0}}