.icon_To1dV {
    width: var(--sp-size-150);
    height: var(--sp-size-150);
    color: var(--sp-color-text-primary);
    pointer-events: none;
    position: absolute;
    left: 12px;
    top: 11px;
}

.grow-wrap_k-kKr {
    /* easy way to plop the elements on top of each other and have them both sized based on the tallest one's height */
    display: grid;
    flex: 1 1 auto;
    min-width: 0;
}
.grow-wrap_k-kKr::after {
    /* Note the weird space! Needed to preventy jumpy behavior */
    content: attr(data-prompt) ' ';

    /* This is how textarea text behaves */
    white-space: pre-wrap;

    /* Hidden from view, clicks, and screen readers */
    visibility: hidden;
}
.grow-wrap_k-kKr > .textarea_ta25- {
    /* You could leave this, but after a user resizes, then it ruins the auto sizing */
    resize: none;

    /* Firefox shows scrollbar on growth, you can hide like this. */
    overflow: hidden;
}
.grow-wrap_k-kKr > .textarea_ta25-,
.grow-wrap_k-kKr::after {
    font: var(--sp-typography-ui-base-font);
    background: transparent;
    border: none;
    padding: var(--sp-spacing-200) 0 var(--sp-spacing-200) 28px;

    /* Same style as editor paragraph */
    font-size: 16px;
    line-height: 24px;

    /* Place on top of each other */
    grid-area: 1 / 1 / 2 / 2;
}

.textarea_ta25-:-moz-placeholder-shown {
    color: var(--sp-color-text-secondary);
}

.textarea_ta25-:placeholder-shown {
    color: var(--sp-color-text-secondary);
}
