:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#17202a;background:#f4f6f8;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:#f4f6f8}main{max-width:980px;margin:0 auto;padding:22px 18px 70px}h1{font-size:1.55rem;line-height:1.2;margin:0 0 10px}h2{font-size:1.15rem;margin:18px 0 10px}p{line-height:1.5}.retention{font-size:.8rem;color:#5d6874;margin-top:22px}.panel{background:white;border:1px solid #dce1e5;border-radius:14px;padding:16px;margin:14px 0;box-shadow:0 2px 6px #00000008}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.row>*{flex:1 1 auto}label{display:block;font-size:.88rem;font-weight:600;margin:10px 0 5px}input,select,button,textarea{font:inherit}input[type=text],input[type=password],input[type=file],textarea,select{width:100%;border:1px solid #bbc4cd;border-radius:8px;padding:11px;background:#fff}button,.button{border:0;border-radius:9px;background:#1c3f60;color:#fff;padding:12px 16px;font-weight:650;cursor:pointer;min-height:44px}button.secondary{background:#e8edf2;color:#17202a}button:disabled{opacity:.5;cursor:default}.message{min-height:1.4em;color:#415364;font-size:.92rem}.error{color:#a22}.toolbar{position:sticky;top:0;background:#f4f6f8ed;backdrop-filter:blur(8px);z-index:3;padding:9px 0}.pages{display:flex;flex-direction:column;gap:18px}.page{position:relative;background:white;box-shadow:0 3px 14px #0002;margin:auto;max-width:100%;touch-action:none}.page canvas{display:block;max-width:100%;height:auto}.overlay{position:absolute;inset:0;touch-action:none}.box{position:absolute;border:2px dashed #1d5c8b;background:#dceefa55;border-radius:3px;min-width:35px;min-height:24px;display:flex;align-items:center;justify-content:center;text-align:center;color:#173e5a;font-size:12px;overflow:hidden;touch-action:none}.box.signature{border-color:#357447;background:#e5f4e7aa;color:#174322;cursor:pointer;touch-action:manipulation}.box.signature.active{border-style:solid;outline:3px solid #e58d1f;outline-offset:2px}.box.signature:focus-visible{outline:3px solid #e58d1f;outline-offset:2px}.signature-pad:focus-visible{outline:3px solid #e58d1f;outline-offset:2px}.box.date{border-color:#8b6e20;background:#fbf0c7aa;color:#503d0c}.box.selected{outline:2px solid #e58d1f}.box input{width:100%;height:100%;padding:1px 3px;border:0;background:transparent;font-size:inherit}.tools{display:flex;gap:8px;flex-wrap:wrap}.tools button{flex:1 1 110px}.signature-pad{display:block;width:100%;height:180px;background:#fff;border:1px solid #98a3ad;border-radius:8px;touch-action:none}.muted{color:#5d6874;font-size:.88rem}.output{word-break:break-all}.hide{display:none!important}@media(max-width:600px){main{padding:17px 12px 56px}.panel{padding:13px}.page{width:100%}.toolbar button{padding:10px}.signature-pad{height:160px}}

.box.missing{border-color:#b42318!important;background:#fee4e2!important;outline:3px solid #b42318!important;color:#7a271a!important}.submit-message{margin:7px 0 0;min-height:1.35em;color:#a22;font-size:.92rem;font-weight:600}.missing-consent{outline:2px solid #b42318;border-radius:5px;padding:5px}

.signed-pages{margin-top:14px}.signed-pages .page{width:100%;touch-action:auto}.button{display:inline-block;text-decoration:none;text-align:center}

/* Signer boxes must honor PDF geometry; global touch targets would cover adjacent labels on compact forms. */.box.text,.box.date{min-width:0;min-height:0}

/* Phone-first signer: docked text entry and native zoom. */
.box{border:1.5px solid #8aa2b4;background:rgba(235,244,250,.58);border-radius:2px;min-width:0;min-height:0;font-size:11px;color:#243746;}
.box.signature{border:2px solid #39764a;background:rgba(231,245,233,.94);color:#174322;}
.box.date{border:1.5px solid #907431;background:rgba(251,245,225,.9);color:#503d0c;min-width:0;min-height:0;}
.box.field-active{outline:2px solid #1c6ca1;outline-offset:2px;background:#eef7fc;} .box.field-active.text{background:rgba(225,242,253,.9)}
.zoom-backdrop{position:fixed;inset:0;background:rgba(20,30,40,.58);z-index:29;touch-action:none;}
.field-nav{position:fixed;z-index:40;left:12px;right:12px;bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px;background:#fff;border:1px solid #dce1e5;border-radius:12px;box-shadow:0 4px 18px #0003;}
.field-nav.hide,.zoom-backdrop.hide{display:none!important}.field-nav button{min-height:44px;padding:9px 12px;flex:0 0 auto;white-space:nowrap}.field-nav span{font-size:.8rem;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1;text-align:center;color:#243746}.zoom-viewport{position:fixed;left:0;right:0;top:120px;bottom:72px;overflow:hidden;background:#fff;z-index:35;touch-action:pan-x pan-y;box-shadow:0 8px 28px #0004}.zoom-viewport.hide{display:none!important}.zoom-viewport .page.zoomed{position:absolute;left:13px;top:0;margin:0;max-width:none;transform-origin:top left;transform:translate(var(--zoom-x),var(--zoom-y)) scale(var(--zoom-scale));transition:transform .22s ease;box-shadow:none;isolation:isolate;touch-action:pan-x pan-y;}
body.zoom-open{overflow:hidden}.box:focus-within,.box:focus{outline:2px solid #1c6ca1;outline-offset:2px}
@media(max-width:600px){.field-nav{bottom:10px}.field-nav button{font-size:.85rem;padding:8px 10px}.zoom-viewport{top:120px;bottom:72px}}

/* Phone-first signer: docked text entry and native zoom. */
.box{border:1.5px solid #8aa2b4;background:rgba(235,244,250,.58);border-radius:2px;min-width:0;min-height:0;font-size:11px;color:#243746;}
.box.signature{border:2px solid #39764a;background:rgba(231,245,233,.94);color:#174322;}
.box.date{border:1.5px solid #907431;background:rgba(251,245,225,.9);color:#503d0c;min-width:0;min-height:0;}
.box.field-active{outline:2px solid #1c6ca1;outline-offset:2px;background:#eef7fc;} .box.field-active.text{background:rgba(225,242,253,.9)}
.zoom-backdrop{position:fixed;inset:0;background:rgba(20,30,40,.58);z-index:29;touch-action:none;}
.field-nav{position:fixed;z-index:40;left:12px;right:12px;bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px;background:#fff;border:1px solid #dce1e5;border-radius:12px;box-shadow:0 4px 18px #0003;}
.field-nav.hide,.zoom-backdrop.hide{display:none!important}.field-nav button{min-height:44px;padding:9px 12px;flex:0 0 auto;white-space:nowrap}.field-nav span{font-size:.8rem;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1;text-align:center;color:#243746}.zoom-viewport{position:fixed;left:0;right:0;top:120px;bottom:72px;overflow:hidden;background:#fff;z-index:35;touch-action:pan-x pan-y;box-shadow:0 8px 28px #0004}.zoom-viewport.hide{display:none!important}.zoom-viewport .page.zoomed{position:absolute;left:13px;top:0;margin:0;max-width:none;transform-origin:top left;transform:translate(var(--zoom-x),var(--zoom-y)) scale(var(--zoom-scale));transition:transform .22s ease;box-shadow:none;isolation:isolate;touch-action:pan-x pan-y;}
body.zoom-open{overflow:hidden}.box:focus-within,.box:focus{outline:2px solid #1c6ca1;outline-offset:2px}
@media(max-width:600px){.field-nav{bottom:10px}.field-nav button{font-size:.85rem;padding:8px 10px}.zoom-viewport{top:120px;bottom:72px}}

body.zoom-open .toolbar{z-index:5}

.zoom-viewport .box input{font-size:16px;padding:1px 4px}.zoom-viewport .box.field-active{background:#e5f3fc}

.overlay{pointer-events:none}.box,.box input{pointer-events:auto}

.field-nav{left:8px;right:8px;bottom:8px;padding:10px;display:flex;flex-direction:column;align-items:stretch;gap:8px;z-index:40}.field-editor label{display:block;margin:0 0 4px;font-size:.85rem;color:#334;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.field-editor input{width:100%;min-height:48px;padding:10px 12px;border:1px solid #8093a3;border-radius:8px;font-size:18px;background:#fff;color:#17202a}.field-editor input:disabled{background:#f0f2f4;color:#64717d}.field-controls{display:flex;gap:8px;align-items:center}.field-controls button{flex:0 0 auto}.field-controls span{flex:1;text-align:center;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.8rem}.box .field-value{display:block;width:100%;height:100%;overflow:hidden;text-align:left;padding:1px 3px;font-size:inherit;line-height:1.15;color:#111;white-space:nowrap}.zoom-backdrop,.zoom-viewport{display:none!important}

/* Allow browser-native pinch zoom on the static PDF preview. */
.page{touch-action:pan-x pan-y pinch-zoom!important}
.page canvas{touch-action:pan-x pan-y pinch-zoom!important}
.overlay{touch-action:pan-x pan-y pinch-zoom!important}
.box.text,.box.text .field-value{touch-action:pan-x pan-y pinch-zoom!important}
.box.signature,.box.date{touch-action:manipulation!important}
/* Legacy rules kept inert. */
/* .page{touch-action:pan-x pan-y pinch-zoom}
.page canvas{touch-action:pan-x pan-y pinch-zoom}
.overlay{touch-action:pan-x pan-y pinch-zoom}
.box.text{touch-action:pan-x pan-y pinch-zoom}
.box.signature,.box.date{touch-action:manipulation}
.page{overscroll-behavior:contain}
.field-editor label{font-size:1rem;font-weight:700;line-height:1.25} */

/* Review-first field detection and generous boxes on the sender page. */
.box{font-size:12px;line-height:1.15;padding:2px;background:rgba(229,241,250,.86);border:2px solid #326a92;white-space:normal;word-break:break-word;cursor:pointer}
.box.date{background:rgba(255,246,213,.94);border-color:#97721a}
.box.signature{background:rgba(229,245,231,.96);border-color:#39764a}
.box.selected{outline:3px solid #e58d1f;z-index:2}
.review{margin:16px 0;padding:12px;border:1px solid #c7d3dd;border-radius:10px;background:#f8fafb}
.field-list{display:flex;flex-direction:column;gap:6px;max-height:260px;overflow:auto}
.field-row{text-align:left;width:100%;font-size:.88rem;overflow-wrap:anywhere;min-height:44px;padding:9px 11px}
.field-row.chosen{outline:3px solid #e58d1f}
@media(max-width:600px){.review{padding:10px}.field-row{font-size:.82rem}}
