.mobile-select-trigger, .mobile-select-error, .mobile-select-dialog:not([open]) { display: none; }

@media screen and (max-width: 767.98px) {
    .form-select.mobile-select-source { display: none; }
    .form-select.mobile-select-trigger {
        display: block;
        min-height: 44px;
        text-align: left;
        white-space: normal;
        overflow-wrap: anywhere;
    }
    .mobile-select-trigger:disabled { background-color: #e9ecef; }
    .mobile-select-trigger[aria-invalid="true"] { border-color: #a12630; }
    .mobile-select-error {
        display: block;
        margin: .25rem 0 0;
        color: #a12630;
        font-size: .875rem;
    }

    .mobile-select-dialog[open] {
        position: fixed;
        inset: auto 0 var(--mobile-select-bottom, 0px);
        display: flex;
        flex-direction: column;
        gap: .65rem;
        box-sizing: border-box;
        width: 100%;
        max-width: none;
        max-height: min(82vh, calc(var(--mobile-select-viewport, 100dvh) - 1rem));
        margin: 0;
        padding: 1rem 1rem calc(1rem + env(safe-area-inset-bottom, 0px));
        overflow: hidden;
        border: 0;
        border-radius: 1.1rem 1.1rem 0 0;
        color: var(--ink);
        background: #fff;
    }
    .mobile-select-dialog::backdrop { background: #102c2a80; }
    .workspace-page:has(.mobile-select-dialog[open]) { overflow: hidden; }
    .mobile-select-heading {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: .75rem;
    }
    .mobile-select-heading h2 {
        margin: 0;
        font-size: 1.18rem;
        font-weight: 800;
        overflow-wrap: anywhere;
    }
    .mobile-select-heading form, .mobile-select-dialog input { flex-shrink: 0; }
    .mobile-select-heading button, .mobile-select-dialog input { min-height: 44px; }
    .mobile-select-dialog input { font-size: 16px; }
    .mobile-select-options { min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
    .mobile-select-group h3 {
        margin: .7rem 0 .25rem;
        padding-inline: .65rem;
        font-size: .86rem;
        font-weight: 800;
        overflow-wrap: anywhere;
    }
    .mobile-select-option {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: .6rem;
        width: 100%;
        min-height: 44px;
        padding: .55rem .65rem;
        border: 0;
        border-bottom: 1px solid #dce8e7;
        color: inherit;
        background: #fff;
        text-align: left;
        overflow-wrap: anywhere;
    }
    .mobile-select-option[aria-pressed="true"] {
        border-radius: .5rem;
        background: #dcefeb;
        font-weight: 750;
    }
    .mobile-select-option:focus-visible { outline-offset: -3px; }
    .mobile-select-option:disabled { opacity: .6; }
    .mobile-select-empty { margin: 0; }
}