@import"https://fonts.googleapis.com/css2?family=Oregano:ital@0;1&display=swap";@import"https://fonts.googleapis.com/css2?family=Yuji+Mai&display=swap";body{padding:0;margin:0;width:100vw;height:100vh}:root{font-family:Oregano,serif;font-size:4vw}button,input,textarea{font-size:.75rem}#controls{display:flex;margin:.5em;flex-direction:column}.across{display:flex;flex-direction:row;gap:.25em;justify-content:space-evenly}.across>input{flex-grow:1}label{display:flex;flex-direction:row;align-items:center;gap:.15em}#controls .separator{height:.5em}svg{width:100vw;height:100vh;background-color:#000}path{fill:none;stroke:#00bfbf;stroke-width:.5;stroke-linecap:round;stroke-linejoin:round}#handwriting{--t: replace-me;--total-length: replace-me;--total-position: calc(var(--t)*var(--total-length))}#handwriting>path{--offset: replace-me;--length: replace-me;--position: clamp(-.0001, var(--total-position) - var(--offset), var(--length)) ;stroke-dasharray:0,calc(var(--length) + 1),calc(var(--length) + 1),0;stroke-dashoffset:calc(0 - var(--position))}#debugInfo{position:fixed;left:1em;bottom:1em;color:#2be2c1;text-shadow:white .1em 0em .1em,white -.1em 0em .1em,white 0em .1em .1em,white 0em -.1em .1em;font-family:Yuji Mai,monospace}