input[type=search],textarea {
    width: 100%;
    max-width: 480px;
    padding: 11px 12px;
    border: 1px solid #b7c2d4;
    border-radius: 7px;
    font: inherit;
    background: #fff;
}

.bank-filters > label:first-child { margin-top: 0; }
.bank-filter-row { display: flex; align-items: end; flex-wrap: wrap; gap: 12px; margin-top: 16px; }
.bank-filter-dropdown { position: relative; min-width: 180px; }
.bank-filter-dropdown > summary { list-style: none; border: 1px solid #b7c2d4; border-radius: 7px; background: #fff; padding: 10px 12px; cursor: pointer; font-weight: 700; }
.bank-filter-dropdown > summary::-webkit-details-marker { display: none; }
.bank-filter-dropdown > summary::after { content: "▾"; float: right; margin-left: 18px; }
.bank-filter-dropdown[open] > summary::after { content: "▴"; }
.bank-filter-dropdown [data-filter-count] { color: var(--primary); font-size: .85rem; margin-left: 5px; }
.bank-filter-panel { position: absolute; z-index: 20; top: calc(100% + 6px); left: 0; width: min(420px, calc(100vw - 40px)); padding: 10px; background: #fff; border: 1px solid #b7c2d4; border-radius: 9px; box-shadow: 0 12px 32px #17203326; }
.bank-filter-panel-compact { width: min(240px, calc(100vw - 40px)); }
.bank-filter-panel input[type=search] { max-width: none; }
.bank-filter-actions { display: flex; gap: 8px; margin: 8px 0; }
.bank-filter-actions .button { flex: 1; padding: 7px 10px; }
.bank-filter-options { max-height: 260px; overflow: auto; border-top: 1px solid var(--line); }
.bank-filter-options label { display: block; margin: 0; padding: 8px 5px; font-weight: 500; }
.bank-filter-options label[hidden] { display: none; }
.bank-filter-options label:hover { background: #f2f5fb; }
.bank-filter-options input { margin-right: 7px; }
.bank-active-filters { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 14px; }
.bank-filter-tag { padding: 4px 9px; border-radius: 999px; background: #e8edf7; font-size: .85rem; }
.bank-result-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-top: 15px; padding-top: 14px; border-top: 1px solid var(--line); }
.bank-result-bar .button { padding: 7px 11px; }
.bank-limit-message { color: var(--bad); font-weight: 650; }
.bank-thumbnail { display: block; width: 160px; height: auto; border: 1px solid var(--line); border-radius: 5px; background: #fff; }
.bank-preview-trigger { display: grid; gap: 5px; padding: 0; border: 0; background: transparent; color: var(--primary); font-size: .85rem; text-align: center; }
.bank-preview-trigger:hover { background: transparent; color: var(--primary-dark); }
.bank-preview-trigger:focus-visible { outline: 3px solid #64748b; outline-offset: 3px; }
.bank-preview-trigger.no-image { display: inline-block; padding: 8px 12px; border: 1px solid var(--line); background: #f3f6fb; }
.bank-table tr[hidden] { display: none; }
.bank-preview-modal { width: min(960px, calc(100% - 24px)); max-height: calc(100vh - 24px); padding: 0; border: 0; border-radius: 14px; box-shadow: 0 24px 80px #0f172a55; }
.bank-preview-modal::backdrop { background: #0f172a99; }
.bank-preview-header { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--line); background: #fff; }
.bank-preview-header > div { display: grid; gap: 2px; }
.bank-preview-header strong { font-size: 1.1rem; }
.bank-preview-header-actions { display: flex !important; grid-auto-flow: column; align-items: center; gap: 10px !important; }
.bank-preview-selected-summary { white-space: nowrap; padding: 7px 11px; border-radius: 999px; background: #e8edf7; color: var(--primary-dark); font-weight: 700; }
.bank-preview-selected-summary strong { font-size: inherit; }
.bank-preview-close { min-width: 44px; min-height: 44px; padding: 6px; border-radius: 50%; background: #e6ebf5; color: var(--ink); font-size: 1.35rem; }
.bank-preview-body { padding: 18px; overflow: auto; }
.bank-preview-image { display: block; max-width: 100%; max-height: 66vh; margin: 0 auto 16px; border: 1px solid var(--line); border-radius: 7px; background: #fff; }
.bank-preview-image[hidden], [data-preview-no-image][hidden] { display: none; }
.bank-preview-meta { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 8px; margin: 0; }
.bank-preview-meta > div { min-width: 0; padding: 10px; border-radius: 8px; background: #f3f6fb; }
.bank-preview-meta dt { color: var(--muted); font-size: .8rem; font-weight: 700; }
.bank-preview-meta dd { margin: 3px 0 0; overflow-wrap: anywhere; }
.bank-preview-footer { position: sticky; bottom: 0; display: grid; grid-template-columns: 1fr auto 1fr; gap: 10px; padding: 12px 16px; border-top: 1px solid var(--line); background: #fff; }
.bank-preview-footer [data-preview-previous] { justify-self: start; }
.bank-preview-footer [data-preview-next] { justify-self: end; }
.bank-preview-footer button:disabled { cursor: not-allowed; opacity: .45; }
.bank-preview-footer button[hidden] { display: none; }
body:has(.bank-preview-modal[open]) { overflow: hidden; }

@media (max-width: 700px) {
    .bank-filter-dropdown { width: 100%; }
    .bank-filter-panel { position: fixed; top: 15%; left: 20px; right: 20px; width: auto; max-height: 70vh; }
    .bank-result-bar { align-items: stretch; }
    .bank-result-bar .button { width: 100%; }
    .bank-preview-modal { width: 100%; max-width: none; max-height: 96vh; margin: auto 0 0; border-radius: 14px 14px 0 0; }
    .bank-preview-header { align-items: flex-start; }
    .bank-preview-header-actions { gap: 6px !important; }
    .bank-preview-selected-summary { padding: 6px 9px; font-size: .9rem; }
    .bank-preview-body { padding: 12px; }
    .bank-preview-meta { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .bank-preview-footer { grid-template-columns: 1fr 1fr; }
    .bank-preview-footer [data-preview-select] { grid-column: 1 / -1; grid-row: 1; }
}