body {
    font-family: 'Segoe UI', sans-serif;
    background-color: #36393f;
    color: #fff;
    padding: 20px;
}
h1, h2 {
    text-align: center;
    color: #7289da;
}
form {
    max-width: 600px;
    margin: auto;
}
input, select {
    width: 100%;
    padding: 8px;
    margin: 8px 0;
    background: #2f3136;
    border: none;
    border-radius: 4px;
    color: white;
}
input {
    /* Because Im stupid and don't know how to make them equal ^ */
    width: 97.3%;
}
button {
    padding: 10px;
    background: #7289da;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    margin-top: 10px;
    margin-right: 10px;
}
.remove {
    background: #ff4c4c;
}
.json-preview {
    background: #202225;
    color: white;
    padding: 10px;
    margin-top: 20px;
    border-radius: 4px;
    font-family: monospace;
    white-space: pre-wrap;
}
.option, .choice {
    border: 1px solid #7289da;
    border-radius: 4px;
    padding: 10px;
    margin-top: 10px;
}