script to explore a shindanmaker.com shindan more quickly than manually entering names

shindan-explorer.js

$('#form').on('submit', function ( event ) {
    event.preventDefault()

    const input = $('.input-lg.shindanuser')[0]
    const name = input.value
    input.value = Math.random()
    const fd = new FormData($('#form')[0])

    const xhr = new XMLHttpRequest()
    xhr.open('POST', location)
    xhr.addEventListener('load', function(e) {
        let result = $('<div></div>')
        result.html(e.target.response)
        result = $('.result2', result)
        result.html(result.html().replace(/0\.\d{3,}/g, name))
        $('.shindanform')[0].after(result[0])

        // this is only so that Shindan remembers the name entered instead of the random number
        const dummyxhr = new XMLHttpRequest()
        dummyxhr.open('POST', location)
        const fd = new FormData($('#form')[0])
        dummyxhr.send(fd)

        tryToCSS(result)
        
    })
    xhr.send(fd)
    input.value = name
})

let cssDone = false
let css = document.createElement('style')
$('head').append(css)
let tryToCSS = (result) => {
    if (cssDone) return
    result = $(result)
    let d1 = $(document.createElement('div'))
    let d2 = $(document.createElement('div'))
    let d3 = $(document.createElement('div'))
    let copyCss = (dummy, p1, p2, factor = 1) => {
        $(dummy).css(p1, result.css(p2).replace(/\d+\.?\d*(?=[a-zA-Z])/g, px => px * factor))
    }
    copyCss(d1, 'border-top', 'border-bottom', 0.5)
    copyCss(d1, 'border-top-right-radius', 'border-bottom-left-radius', 0.5)
    copyCss(d1, 'border-top-left-radius', 'border-bottom-left-radius', 0.5)
    copyCss(d2, 'border-width', 'border-width', 0.5)
    copyCss(d2, 'padding', 'padding-top', 0.25)
    copyCss(d2, 'font-size', 'font-size', 0.5)
    d2.css('border-radius','unset')
    d2.css('margin-bottom','0')
    copyCss(d3, 'border-bottom-right-radius', 'border-bottom-left-radius', 0.5)
    copyCss(d3, 'border-bottom-left-radius', 'border-bottom-left-radius', 0.5)
    css.innerHTML = `
div.result2:nth-child(2) {
    ${d1.attr('style').replace(/; \b/g, '; \n    ')}
}
div.result2 {
    ${d2.attr('style').replace(/; \b/g, '; \n    ')}
}
div.result2:last-child {
    ${d3.attr('style').replace(/; \b/g, '; \n    ')}
}`
    cssDone = true
}