/* Search wrappers are transparent to the existing desktop grid. Cards are untouched. */
.psbt-library__primary,
.psbt-library__filters {
    display: contents;
}
.psbt-library__filter-toggle[hidden],
.psbt-library__filters[hidden] {
    display: none;
}
.psbt-library__filter-status {
    display: none;
}
/* Additive mobile layer after the legacy 560px / 900px grid rules.
 * Registration's separate 600px modal rules and all card rules remain unchanged. */
@media (max-width: 600px) {
    .psbt-library {
        width: 100%;
        min-width: 0;
        margin-block: .5rem 1rem;
        /* Top up a centered parent's gutter only when it is smaller than 16px.
         * Never add another 16px to an already padded theme container. */
        padding-inline: clamp(0px, calc(16px - (100vw - 100%) / 2), 16px);
    }
    .psbt-library__search {
        grid-template-columns: minmax(0, 1fr);
        gap: .6rem;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        margin-block: 0 .5rem;
    }
    .psbt-library__primary {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: end;
        gap: .5rem;
        min-width: 0;
        order: 0;
    }
    .psbt-library__primary label,
    .psbt-library__search label {
        min-width: 0;
        font-size: 14px;
    }
    .psbt-library__search input,
    .psbt-library__search select {
        min-width: 0;
        min-height: 44px;
        border-radius: 6px;
        font-size: 16px;
    }
    .psbt-library__filter-toggle:not([hidden]) {
        position: relative;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
        padding: .5rem;
        border-radius: 6px;
    }
    .psbt-library__filter-badge {
        position: absolute;
        top: -5px;
        right: -5px;
        display: grid;
        place-items: center;
        min-width: 20px;
        height: 20px;
        padding-inline: 3px;
        border-radius: 50%;
        background: #fff;
        color: #173e50;
        border: 1px solid #245c74;
        font-size: 12px;
    }
    .psbt-library__filters:not([hidden]) {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .5rem .75rem;
        padding: .75rem;
        border-radius: 6px;
        background: #f4f6f7;
    }
    .psbt-library__filters { order: 1; }
    .psbt-library__search .psbt-library__sort-field {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        align-items: center;
        gap: .75rem;
        order: 2;
    }
    .psbt-library__search > .psbt-library__actions {
        order: 3;
        gap: .5rem .75rem;
    }
    .psbt-library__search button,
    .psbt-library__actions > a,
    .psbt-library__pagination a,
    .psbt-library__pagination span,
    .psbt-library .psbt-add-track {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 44px;
        min-height: 44px;
        border-radius: 6px;
    }
    .psbt-library__filter-status {
        display: inline;
        font-size: 14px;
    }
    .psbt-library__index {
        flex-wrap: nowrap;
        min-width: 0;
        max-width: 100%;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        margin-block: .5rem;
        padding: 6px 12px 8px 6px;
        scrollbar-width: thin;
    }
    .psbt-library__index a,
    .psbt-library__index span {
        flex: 0 0 44px;
        min-width: 44px;
        min-height: 44px;
        border-radius: 6px;
    }
    .psbt-library__pagination {
        gap: .25rem;
        margin-block: 1rem;
    }
}

/* This page's theme heading remains accessible without occupying layout space, at all widths. */
body.psbt-accompaniment-page h2.page-open-title {
    position: absolute;
    width: 1px;
    height: 1px;
    min-width: 0;
    min-height: 0;
    padding: 0;
    margin: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}