*{box-sizing:border-box}body{margin:0;background:#f4f4f2;color:#242424;font:14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}header,main,footer{max-width:1200px;margin:auto}header{display:flex;align-items:center;gap:18px;padding:22px 20px;border-bottom:1px solid #ccc}h1{font-size:24px;margin:0;letter-spacing:-1px}.local{margin-left:auto;font-size:12px;color:#666}main{padding:18px 20px}button,select{font:inherit;border:1px solid #ccc;border-radius:4px;background:#fff;color:inherit;padding:7px 11px;cursor:pointer}button:hover:not(:disabled){background:#e9ede8}button:disabled{opacity:.38;cursor:default}button:focus-visible,select:focus-visible,canvas:focus-visible{outline:2px solid #416653;outline-offset:2px}.toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.tools{display:flex;margin-left:10px}.tools button{border-radius:0}.tools button:first-child{border-radius:4px 0 0 4px}.tools button:last-child{border-radius:0 4px 4px 0;margin-left:-1px}button[aria-pressed=true]{background:#e1e9e2;border-color:#718776}.primary{background:#294c3c;color:white;margin-left:auto;border-color:#294c3c}.statusbar{display:flex;justify-content:space-between;gap:10px;padding:12px 0;font-size:12px;color:#666}#workspace{min-height:420px;padding:26px;display:flex;justify-content:center;align-items:center;background:#e8e8e5;border:1px solid #ccc;overflow:auto}#workspace.dragover{outline:3px solid #416653}#empty{text-align:center;color:#777}#empty strong{font-size:19px;font-weight:500;color:#444}#empty p{margin:8px 0 18px}canvas{max-width:100%;height:auto;display:block;background:#fff;box-shadow:0 2px 14px #0002;touch-action:none;cursor:crosshair}canvas[hidden],[hidden]{display:none!important}.bottom{display:flex;justify-content:space-between;color:#666;font-size:12px;padding:12px 0}details{margin-top:12px;font-size:12px;color:#666}summary{cursor:pointer}details p{max-width:850px}footer{display:flex;justify-content:space-between;font-size:11px;color:#888;padding:16px 20px;border-top:1px solid #ddd}@media(max-width:650px){header{gap:10px;flex-wrap:wrap}.local{width:100%;margin-left:0}main{padding:12px}#workspace{padding:8px;min-height:300px}.tools{margin-left:0}.primary{margin-left:0}.bottom{flex-direction:column;gap:5px}.statusbar{flex-wrap:wrap}}
canvas{cursor:default}.pager{display:flex;align-items:center;gap:10px}.pager button{padding:2px 10px}dialog{width:min(820px,95vw);border:1px solid #bbb;border-radius:6px;padding:20px;background:#f9f9f7;color:#242424}dialog::backdrop{background:#0006}.dialogHead{display:flex;justify-content:space-between;align-items:center}.dialogHead h2{margin:0;font-size:20px}#pad{width:100%;height:auto;background:repeating-linear-gradient(0deg,#fff,#fff 39px,#eee 40px);box-shadow:none;border:1px solid #ccc;cursor:crosshair;touch-action:none}.signatureActions{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:15px}.hint,#signStatus{font-size:12px;color:#666}#workspace{align-items:flex-start}#empty{align-self:center}#status{align-self:center}#canvas{cursor:grab}.signatureActions label{font-size:12px}#signStatus{min-height:18px}

.tool-nav{display:flex;gap:4px;max-width:1200px;margin:0 auto;padding:12px 20px 0}.tool-nav a{color:#666;text-decoration:none;padding:7px 14px;border-bottom:2px solid transparent;font-size:13px}.tool-nav a[aria-current=page]{color:#294c3c;border-color:#294c3c;font-weight:600}.tool-nav a:hover{background:#e7ebe6}.tool-nav a:focus-visible{outline:2px solid #416653;outline-offset:2px}