.fieldwrapper {
    position: relative;
}

.fieldwrapper label {
    position: absolute;
    font-size: 1em;
    left: 2ch;
    padding: 0;
    margin: 0;
    color: #666;
}

.fieldwrapper input:focus ~ label,
.fieldwrapper input:not(:placeholder-shown) ~ label,
.fieldwrapper textarea:focus ~ label,
.fieldwrapper textarea:not(:placeholder-shown) ~ label {
    left: auto;
    right: 1ch;
    top: -.4em;
    font-size: .8em;
}

input, textarea {
    width: 100%;
    border: none;
}

input:invalid, textarea:invalid {
    box-shadow: 0 0 .2em #f00;
}

input:valid, textarea:valid {
    box-shadow: 0 0 .2em #0f0;
}

input, img#captcha {
    height: 2em;
}

textarea {
    height: var(--textarea-height);
}