button:hover { cursor: pointer; }

em {
    font-style: italic;
    font-weight: bolder;
}

html {
    font-size: 62.5%;
    overflow-x: clip;
    scroll-behavior: smooth;
}

img { display: block; }

strong { font-weight: 600; }

svg { display: block; }




/*    ########  #######  ########  ##     ##  ######     */
/*    ##       ##     ## ##     ## ###   ### ##    ##    */
/*    ##       ##     ## ##     ## #### #### ##          */
/*    ######   ##     ## ########  ## ### ##  ######     */
/*    ##       ##     ## ##   ##   ##     ##       ##    */
/*    ##       ##     ## ##    ##  ##     ## ##    ##    */
/*    ##        #######  ##     ## ##     ##  ######     */


form {
    container: form / inline-size;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

    fieldset {
        display: flex;
        column-gap: 20px;
        row-gap: 10px;
    }

    label {
        align-items: center;
        display: flex;
        gap: 10px;
    }

    input[type="submit"]:hover { cursor: pointer; }

    input, select, textarea { width: 100%; }

    ::placeholder { opacity: .65; }

    @container form (max-width: 550px) {
        fieldset { flex-direction: column; }
        fieldset > * { width: 100% !important; }
    }