:root{color-scheme:light;--white:#fff;--ink:#34495b;--blue:#5bcefa;--pink:#f5a9b8;--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#aac8e2;color:var(--white);-webkit-tap-highlight-color:transparent}
button{font:inherit}
main{position:relative;width:100%;height:100%;height:100svh;min-height:240px;isolation:isolate}
.signature-wrap{position:absolute;left:50%;top:48%;width:min(80vw,1000px);transform:translate(-50%,-50%);filter:drop-shadow(0 2px 9px rgba(39,74,118,.09));user-select:none;border:0;padding:0;background:transparent;color:var(--white);border-radius:22px;cursor:pointer;touch-action:manipulation;appearance:none;-webkit-appearance:none}
.signature-wrap svg{width:100%;height:auto;overflow:visible;display:block}
.signature-wrap .pen-stroke{fill:none;stroke:#fff;stroke-linecap:round;stroke-linejoin:round}
.signature-wrap:focus{outline:none}
.signature-wrap:focus-visible{outline:none;filter:drop-shadow(0 0 7px rgba(255,255,255,.6)) drop-shadow(0 2px 9px rgba(39,74,118,.12))}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.noscript-name{position:absolute;inset:30% 0 auto;margin:0;text-align:center;font:italic 15vw Georgia,serif}
@media(max-width:600px){.signature-wrap{width:92vw;top:47%}}
@media(max-height:480px) and (orientation:landscape){.signature-wrap{width:min(65vw,660px);top:45%}}