.mf-callback-dialog:not([open]) { display: none; }
.mf-callback-dialog[open] {
    box-sizing: border-box;
    width: min(37rem, calc(100% - 2rem));
    max-width: none;
    max-height: calc(100vh - 2rem);
    max-height: calc(100dvh - 2rem);
    margin: auto;
    padding: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 1px solid #c6d2c9;
    border-radius: 1rem;
    background: #fffef9;
    color: #173a32;
    text-align: left;
    box-shadow: 0 1.2rem 4rem rgb(12 35 28 / 26%);
}
.mf-callback-dialog::backdrop { background: rgb(10 28 24 / 64%); }
.mf-callback-dialog .mf-callback-inner { padding: clamp(1.1rem, 4vw, 2rem); }
.mf-callback-dialog .mf-callback-head { display: flex; gap: 1rem; align-items: flex-start; justify-content: space-between; }
.mf-callback-dialog .mf-callback-title { margin: 0; font: 500 clamp(1.8rem, 4vw, 2.6rem)/1.1 Georgia, serif; color: #173a32; }
.mf-callback-dialog .mf-callback-intro { margin: .65rem 0 1.3rem; line-height: 1.45; color: #43594e; }
.mf-callback-dialog .mf-callback-close {
    display: grid;
    place-items: center;
    flex: none;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid #aebdb3;
    border-radius: 50%;
    background: transparent;
    color: #173a32;
    font: 400 1.8rem/1 sans-serif;
    cursor: pointer;
}
.mf-callback-dialog .mf-callback-close:hover { background: #edf3e9; }
.mf-callback-dialog .mf-callback-close:focus-visible { outline: 3px solid #34745b; outline-offset: 2px; }