.vt-modal-backdrop {
  position: fixed; inset: 0; z-index: 1050;
  display: flex; align-items: flex-start; justify-content: center;
  padding: 4vh 1rem;
  overflow-y: auto;
  background: rgba(0, 0, 0, .45);
  outline: none;
}

.vt-modal-backdrop.vt-modal-top { z-index: 1060; }

body.vt-modal-open { overflow: hidden; }

body.vt-modal-open .vt-page-error { display: none !important; }

.vt-modal {
  width: 100%;
  background: var(--vt-surface);
  border: 1px solid var(--vt-border);
  border-radius: var(--vt-r);
  box-shadow: 0 18px 48px rgba(0, 0, 0, .28);
  display: flex; flex-direction: column;
  max-height: 92vh;
}
.vt-modal-head {
  display: flex; align-items: center; gap: .5rem;
  padding: .9rem 1.1rem;
  border-bottom: 1px solid var(--vt-border-soft);
}
.vt-modal-title { font-size: .95rem; font-weight: 650; margin: 0; }
.vt-modal-close {
  margin-left: auto;
  background: none; border: 0; cursor: pointer;
  color: var(--vt-text-mute); font-size: .95rem; line-height: 1;
  padding: .25rem .4rem;
}
.vt-modal-close:hover { color: var(--vt-text); }
.vt-modal-body { padding: 1.1rem; overflow-y: auto; }
.vt-modal-foot {
  padding: .85rem 1.1rem;
  border-top: 1px solid var(--vt-border-soft);
  display: flex; gap: .5rem; justify-content: flex-end;
}

.vt-model-row {
  width: 100%; display: flex; align-items: center; gap: .6rem;
  padding: .55rem .7rem; margin-bottom: .4rem; text-align: left;
  border: 1px solid var(--vt-border-soft); border-radius: var(--vt-r);
  background: var(--vt-surface); color: var(--vt-text); cursor: pointer;
}
.vt-model-row:hover { border-color: var(--vt-border); background: var(--vt-surface-alt, rgba(127,127,127,.04)); }
.vt-model-row-on { border-color: var(--vt-accent-ring); background: var(--vt-accent-soft); }
.vt-model-row-main { flex: 1; min-width: 0; }
.vt-model-row-name { font-size: .88rem; font-weight: 580; }

.vt-model-row-desc {
  font-size: .76rem; line-height: 1.4; margin-top: .15rem;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}
.vt-model-row-price {
  flex-shrink: 0; font-size: .82rem; font-weight: 560;
 
}

.vt-modal-error { padding-top: .5rem; padding-bottom: .5rem; margin-bottom: 1rem; display: flex; gap: .5rem; align-items: flex-start; font-size: .85rem; }

.vt-picker-search { margin-bottom: 1rem; }
.vt-picker-note { color: var(--vt-text-mute); padding-top: 1.5rem; padding-bottom: 1.5rem; text-align: center; }
.vt-picker-status { margin-left: .25rem; }
.vt-picker-code { color: var(--vt-text-mute); font-size: .72rem; font-variant-numeric: tabular-nums;
  font-family: var(--bs-font-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); }
.vt-picker-pager { margin-top: 1rem; }

.vt-confirm-text { margin: 0; white-space: pre-line; }

:where(.vt-modal) :where(input[type="search"]) { display: block; width: 100%; }
:where(.vt-modal) :where(input[type="search"], select) {
  padding: .375rem .75rem; font-size: .875rem; line-height: 1.5; color: var(--vt-text);
  background-color: var(--vt-surface); border: 1px solid var(--vt-border); border-radius: var(--vt-r);
}
:where(.vt-modal-error) {
  padding-left: 1rem; padding-right: 1rem; color: var(--vt-danger-text, var(--vt-danger));
  background-color: var(--vt-danger-soft); border: 1px solid var(--vt-danger-border); border-radius: var(--vt-r-sm);
}