@font-face{font-family:Signature Caveat;src:url(/fonts/signature/Caveat.ttf)format("truetype");font-style:normal;font-weight:400;font-display:block}@font-face{font-family:Signature Dancing Script;src:url(/fonts/signature/Dancing-Script.ttf)format("truetype");font-style:normal;font-weight:400;font-display:block}@font-face{font-family:Signature Great Vibes;src:url(/fonts/signature/Great-Vibes.ttf)format("truetype");font-style:normal;font-weight:400;font-display:block}.signature-tool{min-width:0;color:var(--ink)}.signature-modes{border:0;border-bottom:1px solid var(--line);flex-wrap:wrap;gap:16px;margin:0 0 18px;padding:0 0 14px;display:flex}.signature-modes legend{width:100%;margin-bottom:4px;font-size:14px;font-weight:720}.signature-modes label{min-height:44px;color:var(--ink);align-items:center;gap:7px;font-size:14px;font-weight:650;display:flex}.signature-modes input{accent-color:var(--accent)}.signature-board-section{border:1px solid var(--line);background:var(--paper);border-radius:10px;padding:18px}.signature-board-heading{justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:14px;display:flex}.signature-board-heading h2{margin:0;font-size:18px}.signature-board-heading p,.signature-hint,.signature-settings p,.signature-live{color:var(--muted);margin:6px 0 0;font-size:12px;line-height:1.6}.signature-board-size{color:var(--muted);white-space:nowrap;font-size:12px}.signature-board-frame{border:1px solid var(--control-border);background-color:#fff;background-image:linear-gradient(45deg,#edf1ed 25%,#0000 25%),linear-gradient(-45deg,#edf1ed 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#edf1ed 75%),linear-gradient(-45deg,#0000 75%,#edf1ed 75%);background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px;border-radius:6px;overflow:hidden}.signature-board-frame canvas{transform-origin:50%;touch-action:none;transition:transform .12s}#signature-board{aspect-ratio:1024/384;touch-action:none;cursor:crosshair;width:100%;max-width:1024px;height:auto}.signature-settings{border-bottom:1px solid var(--line);gap:16px;padding:20px 0;display:grid}.signature-text-panel{border:1px solid var(--line);background:var(--paper);border-radius:10px;gap:16px;padding:18px;display:grid}.signature-text-panel>label{color:#46564e;gap:7px;font-size:12px;font-weight:650;display:grid}.signature-text-panel input[type=text]{border:1px solid var(--control-border);min-height:44px;color:var(--ink);font:inherit;background:#fff;border-radius:5px;padding:8px 10px;font-size:14px;font-weight:400}.signature-font-picker{border:0;min-width:0;margin:0;padding:0}.signature-font-picker legend{color:#46564e;margin-bottom:8px;font-size:12px;font-weight:650}.signature-font-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;display:grid}.signature-font-card{border:1px solid var(--control-border);cursor:pointer;background:#fff;border-radius:6px;gap:4px;min-width:0;min-height:110px;padding:8px;display:grid;position:relative}.signature-font-card:has(input:checked){border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 22%, transparent)}.signature-font-card:has(input:checked):after{content:"✓";color:var(--accent);font-weight:800;position:absolute;top:5px;right:7px}.signature-font-card input{opacity:.01;width:1px;height:1px;position:absolute}.signature-font-card img{object-fit:contain;width:100%;height:56px}.signature-font-card-name{color:var(--ink);text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:700;overflow:hidden}.signature-font-card-meta{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:10px;overflow:hidden}.signature-font-card:focus-within{outline:3px solid var(--accent);outline-offset:2px}.signature-text-panel input[type=color]{border:1px solid var(--control-border);background:#fff;border-radius:5px;width:100%;min-height:44px;padding:4px}@media (width<=620px){.signature-font-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.signature-font-help{color:var(--muted);margin:-8px 0 0;font-size:12px;line-height:1.6}.signature-text-preview-wrap{color:var(--muted);gap:6px;font-size:12px;display:grid;overflow:hidden}#signature-text-preview{border:1px solid var(--control-border);background-color:#fff;background-image:linear-gradient(45deg,#edf1ed 25%,#0000 25%),linear-gradient(-45deg,#edf1ed 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#edf1ed 75%),linear-gradient(-45deg,#0000 75%,#edf1ed 75%);background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px;border-radius:6px;width:100%;height:auto}.signature-settings fieldset{border:0;min-width:0;margin:0;padding:0}.signature-settings legend{margin-bottom:12px;font-size:14px;font-weight:720}.signature-setting-grid{grid-template-columns:minmax(140px,.7fr) minmax(220px,1fr);gap:16px;display:grid}.signature-setting-grid label{color:#46564e;gap:7px;font-size:12px;font-weight:650;display:grid}.signature-setting-grid input[type=color],.signature-setting-grid input[type=range]{width:100%;min-height:44px}.signature-setting-grid input[type=color]{border:1px solid var(--control-border);background:#fff;border-radius:5px;padding:4px}.signature-setting-grid output{color:var(--accent);font-size:14px;font-weight:750}.signature-setting-grid input[type=range]{padding:0}.signature-edit-actions{flex-wrap:wrap;gap:10px;display:flex}.signature-edit-actions button,.signature-primary{border:1px solid var(--accent);cursor:pointer;border-radius:6px;min-height:44px;padding:0 14px;font-weight:700}.signature-secondary{border:1px solid var(--accent);min-height:44px;color:var(--accent);cursor:pointer;background:#fff;border-radius:6px;margin-top:10px;padding:0 12px;font-weight:700}.signature-edit-actions button{color:var(--accent);background:#fff}.signature-edit-actions button:disabled,.signature-primary:disabled{cursor:not-allowed;opacity:.55}.signature-result{margin-top:22px}.signature-primary{background:var(--accent);color:#fff;width:100%}.signature-error{color:#842b27;overflow-wrap:anywhere;background:#fff2f0;border-left:3px solid #a83731;margin:12px 0 0;padding:10px 12px;font-size:13px;line-height:1.5}.signature-tool button:focus-visible,.signature-tool input:focus-visible{outline:3px solid var(--accent);outline-offset:2px}@media (width<=560px){.signature-board-section{padding:14px}.signature-board-heading{flex-direction:column;align-items:flex-start;gap:4px}.signature-setting-grid{grid-template-columns:1fr}.signature-edit-actions{grid-template-columns:1fr 1fr;display:grid}.signature-edit-actions button{width:100%}}