/* Asset picker measurements: v61 phone at 390 x 844 / DPR 1, root 17.625px.
   Card styling uses recorded computed values; zoomed rectangle sizes are not
   treated as a 390px layout measurement.
   v65 adds desktop five-column cards and the empty upload form measurements.
   Inspiration card states and responsive column breakpoints need comparison. */
.modal.ral-modal,
.modal.ral-upload-modal {
  --ral-bg: #1b1c21;
  --ral-control: #1c1e22;
  --ral-text: #f5fbff;
  --ral-muted: #8c99a0;
  --ral-cyan: #00cae0;
  --ral-border: rgba(255,255,255,.15);
  display: flex;
  flex-direction: column;
  width: 44rem;
  max-width: calc(100vw - 2rem);
  height: 36rem;
  max-height: calc(100dvh - 4rem);
  min-width: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--ral-border);
  border-radius: .875rem;
  background: var(--ral-bg);
  color: var(--ral-text);
  box-shadow: 0 1.25rem 3rem rgba(0,0,0,.5);
  font-size: 1rem;
  line-height: 1.5;
}
.modal.ral-modal[hidden],
.modal.ral-upload-modal[hidden] { display: none !important; }
.modal.ral-modal *,
.modal.ral-upload-modal * { box-sizing: border-box; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-header,
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-upload-header {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: space-between;
  padding: .875rem 1rem;
  border-bottom: 1px solid var(--ral-border);
}
.modal.ral-modal .ral-header :is(h2,h3) {
  margin: 0;
  color: var(--ral-text);
  font-size: .9375rem;
  font-weight: 700;
  line-height: 1.5;
}
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-close {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--ral-muted);
  font: 1.25rem Arial, sans-serif;
  cursor: pointer;
}
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-toolbar {
  display: flex;
  flex: none;
  flex-direction: column;
  gap: .5rem;
  min-width: 0;
  padding: .75rem 1rem;
  border-bottom: 1px solid var(--ral-border);
}
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-source-tabs { display: flex; gap: .375rem; min-width: 0; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-source-tab {
  flex: 1 1 0;
  min-width: 0;
  height: 2rem;
  margin: 0;
  padding: 0;
  border: 1px solid var(--ral-border);
  border-radius: .5rem;
  background: var(--ral-control);
  color: var(--ral-text);
  font: 500 .8125rem Arial, sans-serif;
  cursor: pointer;
}
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-source-tab.active,
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-source-tab[aria-selected="true"] {
  border-color: var(--ral-cyan);
  background: var(--ral-cyan);
  color: #fff;
}
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-toolbar-row { display: flex; align-items: center; gap: .5rem; min-width: 0; }
#asset-library-modal #asset-library-inspiration-hint {
  display: block;
  flex: none;
  margin: 0;
  padding: 0;
  color: #8c99a0;
  font-size: .6875rem;
  font-weight: 400;
  line-height: 1.4;
  opacity: .9;
}
/* Source changes hide structural rows as well as buttons. These selectors
   protect native hidden behavior from the modal's explicit display rules. */
#asset-library-modal [hidden] { display: none !important; }
#asset-library-modal:has(#asset-library-inspiration-hint:not([hidden])) .ral-card { transition: .15s; }
.modal.ral-modal .ral-search,
.modal.ral-upload-modal .ral-input {
  display: block;
  flex: 1 1 0;
  width: 100%;
  min-width: 0;
  height: 2rem;
  margin: 0;
  padding: 0 .625rem;
  border: 1px solid var(--ral-border);
  border-radius: .375rem;
  outline: 0;
  background: var(--ral-control);
  color: var(--ral-text);
  font: .8125rem Arial, sans-serif;
}
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-search::placeholder,
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-input::placeholder,
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-textarea::placeholder { color: var(--ral-muted); opacity: 1; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-upload-btn,
.modal.ral-modal #asset-library-upload.ral-upload-btn {
  flex: none;
  height: 2rem;
  margin: 0;
  padding: 0 .75rem;
  border: 1px dashed rgba(255,255,255,.2);
  border-radius: .375rem;
  background: var(--ral-control);
  color: var(--ral-text);
  font: .75rem Arial, sans-serif;
  white-space: nowrap;
  cursor: pointer;
}
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-tabs { display: flex; align-items: center; gap: .375rem; min-width: 0; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-tab,
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-radio {
  flex: none;
  height: 1.75rem;
  margin: 0;
  padding: 0 .75rem;
  border: 1px solid var(--ral-border);
  border-radius: .875rem;
  background: var(--ral-control);
  color: var(--ral-text);
  font: .75rem Arial, sans-serif;
  white-space: nowrap;
  cursor: pointer;
}
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-tab.active,
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-tab[aria-selected="true"],
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-radio.active,
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-radio[aria-pressed="true"] {
  border-color: var(--ral-cyan);
  background: var(--ral-cyan);
  color: #fff;
}
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-select-all-row {
  display: inline-flex;
  flex: none;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: .3125rem;
  margin: 0 0 0 auto;
  padding: 0;
  color: var(--ral-muted);
  font-size: .6875rem;
  line-height: 1.5;
  white-space: nowrap;
  cursor: pointer;
}
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-select-all-row input { flex: none; width: .875rem; height: .875rem; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; accent-color: var(--ral-cyan); }
.modal.ral-modal .ral-info {
  display: flex;
  flex: none;
  align-items: center;
  gap: .375rem;
  margin: .5rem 0 0;
  padding: .3rem .55rem;
  border: 1px solid rgba(245,158,11,.25);
  border-radius: .4rem;
  background: linear-gradient(135deg,rgba(245,158,11,.12),rgba(234,88,12,.06));
  color: rgba(253,224,171,.92);
  font-size: .6875rem;
  line-height: 1.4;
}
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-info-dot { flex: none; width: .375rem; height: .375rem; border-radius: 50%; background: rgba(251,191,36,.95); }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-body { flex: 1 1 0; min-height: 0; min-width: 0; padding: .75rem 1rem; overflow: auto; overscroll-behavior: contain; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: .625rem; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
  border: 2px solid transparent;
  border-radius: .5rem;
  background: var(--ral-control);
  color: var(--ral-text);
  text-align: left;
  cursor: pointer;
}
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-card.selected,
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-card[aria-pressed="true"] { border-color: var(--ral-cyan); transform: translateY(-2px); }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-card-img { position: relative; display: block; width: 100%; aspect-ratio: 1; overflow: hidden; background: rgba(0,0,0,.3); }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-card-img > :is(img,video) { display: block; width: 100%; height: 100%; object-fit: cover; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-card-role {
  position: absolute;
  top: .25rem;
  left: .25rem;
  padding: .0625rem .3125rem;
  border-radius: .1875rem;
  color: #fff;
  font-size: .625rem;
  font-weight: 500;
  line-height: 1.5;
}
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-card-role.type-scene,
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-card-role[data-role="scene"] { background: rgba(34,197,94,.85); }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-card-role[data-role="prop"] { background: rgba(249,115,22,.85); }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-card-role[data-role="character"] { background: rgba(99,102,241,.85); }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-checkmark {
  position: absolute;
  top: .25rem;
  right: .25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.125rem;
  height: 1.125rem;
  border: 1px solid rgba(255,255,255,.5);
  border-radius: 50%;
  background: rgba(0,0,0,.45);
  color: #fff;
}
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-checkmark.checked,
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-card.selected .ral-checkmark { border-color: var(--ral-cyan); background: var(--ral-cyan); }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-checkmark svg { display: block; width: 10px; height: 10px; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-card-actions {
  position: absolute;
  left: .25rem;
  bottom: .25rem;
  display: flex;
  align-items: center;
  gap: .375rem;
  padding: .375rem;
  border: 1px solid #1e1f25;
  border-radius: 999px;
  background: rgba(27,28,33,.95);
  opacity: 0;
  pointer-events: none;
}
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-card:hover .ral-card-actions,
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-card:focus-within .ral-card-actions { opacity: 1; pointer-events: auto; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-pin,
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-delete {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 50%;
  background: rgba(255,255,255,.05);
  font: .625rem / 1 Arial, sans-serif;
  cursor: pointer;
}
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-pin { color: rgba(255,255,255,.7); }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-delete { color: #fca5a5; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-pin svg { width: 12px; height: 12px; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-delete svg { width: 11px; height: 11px; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-card-meta { padding: .375rem .5rem; border-top: 1px solid var(--ral-border); background: rgba(255,255,255,.1); }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-card-name { display: block; overflow: hidden; color: var(--ral-text); font-size: .75rem; font-weight: 700; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-load-state { padding: 1rem 0; color: var(--ral-muted); font-size: .75rem; line-height: 1.5; text-align: center; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .5rem; padding: 3rem 1rem; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-empty-icon { font-size: 2.25rem; line-height: 1.5; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-empty-title { color: var(--ral-text); font-size: .9375rem; font-weight: 500; line-height: 1.5; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-footer { display: flex; flex: none; align-items: center; justify-content: space-between; padding: .75rem 1rem; border-top: 1px solid var(--ral-border); background: var(--ral-control); }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-footer-left { display: flex; align-items: center; gap: .625rem; min-width: 0; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-count { color: var(--ral-muted); font-size: .75rem; line-height: 1.5; white-space: nowrap; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-footer-actions { display: flex; gap: .5rem; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-btn,
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-cancel,
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-confirm {
  height: 2rem;
  margin: 0;
  padding: 0 1rem;
  border: 1px solid var(--ral-border);
  border-radius: .375rem;
  background: transparent;
  color: var(--ral-text);
  font: .8125rem Arial, sans-serif;
  white-space: nowrap;
  cursor: pointer;
}
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-confirm,
.modal.ral-modal #asset-library-confirm.ral-confirm { border-color: var(--ral-cyan); background: var(--ral-cyan); color: #fff; font: .8125rem Arial, sans-serif; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-confirm:disabled { opacity: .5; cursor: not-allowed; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-download { display: flex; align-items: center; justify-content: center; flex: none; width: 1.75rem; height: 1.75rem; margin: 0; padding: 0; border: 1px solid rgba(0,202,224,.35); border-radius: .375rem; background: rgba(0,202,224,.1); color: var(--ral-cyan); cursor: pointer; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-download svg { display: block; width: 15px; height: 15px; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-search:focus,
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-input:focus,
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-textarea:focus { border-color: var(--ral-cyan); }
.modal.ral-modal button:focus-visible,
.modal.ral-upload-modal button:focus-visible,
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-card:focus-visible { outline: 2px solid var(--ral-cyan); outline-offset: 2px; }

/* Nested upload keeps the picker selection intact until its own save succeeds. */
.modal.ral-upload-modal { width: 30rem; height: auto; border-radius: .625rem; box-shadow: 0 .625rem 1.875rem rgba(0,0,0,.5); }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-upload-header { padding: .75rem 1rem; }
.modal.ral-upload-modal .ral-upload-header :is(h2,h3,h4) { margin: 0; color: var(--ral-text); font-size: .875rem; font-weight: 700; line-height: 1.5; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-upload-content { display: flex; flex-direction: column; gap: .375rem; min-height: 0; min-width: 0; padding: .875rem 1rem; overflow-y: auto; overscroll-behavior: contain; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-upload-picker { margin: .25rem 0 .5rem; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-file-area { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .45rem; width: 100%; min-height: 0; margin: 0; padding: 1.25rem 1rem; border: 1px dashed rgba(255,255,255,.2); border-radius: .5rem; background: var(--ral-control); color: var(--ral-text); font-size: 1rem; line-height: 1.5; text-align: center; cursor: pointer; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-file-icon { display: grid; flex: none; place-items: center; width: 2.25rem; height: 2.25rem; background: rgba(0,202,224,.14); color: var(--ral-cyan); }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-file-icon svg { display: block; width: 22px; height: 22px; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-file-tip { color: var(--ral-text); font-size: .8125rem; line-height: 1.5; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-file-hint { margin-top: .1875rem; color: var(--ral-muted); font-size: .6875rem; line-height: 1.5; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-preview { display: flex; flex-direction: column; gap: .5rem; padding: .5rem; border: 1px solid var(--ral-border); border-radius: .5rem; background: var(--ral-control); }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-preview > img { display: block; width: 100%; height: 12rem; max-height: 12rem; border-radius: .375rem; background: rgba(0,0,0,.3); object-fit: contain; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-upload-meta { display: flex; align-items: center; gap: .5rem; min-width: 0; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-file-name { flex: 1 1 0; min-width: 0; overflow: hidden; color: var(--ral-muted); font-size: .75rem; line-height: 1.5; text-overflow: ellipsis; white-space: nowrap; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-reselect { flex: none; height: 1.625rem; margin: 0; padding: 0 .625rem; border: 1px solid var(--ral-border); border-radius: .3125rem; background: transparent; color: var(--ral-text); font: .6875rem Arial, sans-serif; cursor: pointer; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-form-row { display: flex; flex-direction: column; gap: .375rem; min-width: 0; }
.modal.ral-upload-modal .ral-label { display: block; margin: .25rem 0 0; padding: 0; color: var(--ral-muted); font-size: .75rem; line-height: 1.5; }
.modal.ral-upload-modal .ral-input { flex: none; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-radio-group { display: flex; gap: .375rem; margin: 0 0 .25rem; padding: 0; border: 0; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-radio input { position: absolute; width: 1px; height: 1px; opacity: 0; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-radio:has(input:checked) { border-color: var(--ral-cyan); background: var(--ral-cyan); color: #fff; }
.modal.ral-upload-modal .ral-textarea { display: block; width: 100%; min-height: 4rem; height: 4rem; max-height: 7rem; margin: 0; padding: .5rem .625rem; resize: vertical; overflow: auto; border: 1px solid var(--ral-border); border-radius: .375rem; outline: 0; background: var(--ral-control); color: var(--ral-text); font: .8125rem / 1.45 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","HarmonyOS Sans","Microsoft YaHei",sans-serif; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-upload-footer { display: flex; flex: none; justify-content: flex-end; gap: .5rem; padding: .625rem 1rem .875rem; border-top: 1px solid var(--ral-border); }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-upload-status { color: #fca5a5; font-size: .75rem; line-height: 1.5; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-upload-status:empty,
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-runtime-status:empty { display: none; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-runtime-status { flex: none; padding: .25rem 1rem; color: #fca5a5; font-size: .6875rem; line-height: 1.4; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-thumbnail-state { display: grid; height: 100%; place-items: center; color: var(--ral-muted); font-size: .75rem; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-card[aria-disabled="true"] { cursor: default; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-file-tip,
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-file-hint { display: block; }
:is(.modal.ral-modal,.modal.ral-upload-modal) .ral-pin.pinned { color: #fbbf24; }

@media (max-width: 600px) {
  :is(.modal.ral-modal,.modal.ral-upload-modal) .ral-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 360px) {
  :is(.modal.ral-modal,.modal.ral-upload-modal) .ral-tabs { flex-wrap: wrap; }
  :is(.modal.ral-modal,.modal.ral-upload-modal) .ral-select-all-row { margin-left: auto; }
}

/* Reference delete confirmation, measured at 1280 x 720, root 17.625px.
   This is a separate confirmation over the asset picker, not an upload form. */
#asset-delete-modal.modal.ral-delete-modal {
  display: flex;
  flex-direction: column;
  width: 32.5rem;
  max-width: calc(100vw - 2rem);
  height: auto;
  max-height: calc(100dvh - 2rem);
  min-width: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 1rem;
  background: linear-gradient(135deg,#1e1f25 0%,#1b1c21 100%);
  box-shadow: 0 .5rem 1.5rem rgba(0,0,0,.2),0 0 0 .0625rem rgba(0,202,224,.1);
  color: #8c99a0;
  font: 400 1rem / 1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","HarmonyOS Sans","Microsoft YaHei",sans-serif;
  transition: background-color .25s,color .2s,border-color .25s,box-shadow .25s;
}
#asset-delete-modal.modal.ral-delete-modal[hidden] { display: none !important; }
#asset-delete-modal.modal.ral-delete-modal * { box-sizing: border-box; }
#modal-backdrop:has(~ #asset-delete-modal.modal.ral-delete-modal:not([hidden])) {
  background: rgba(15,15,18,.85);
  backdrop-filter: blur(.5rem);
  -webkit-backdrop-filter: blur(.5rem);
  transition: background-color .25s,color .2s,border-color .25s,box-shadow .25s;
}
#asset-delete-modal.modal.ral-delete-modal .ral-delete-header {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: space-between;
  margin: 0;
  padding: 1.5rem 1.75rem 1.25rem;
  border-bottom: 1px solid rgba(0,202,224,.1);
}
#asset-delete-modal.modal.ral-delete-modal #asset-delete-title {
  margin: 0;
  padding: 0;
  background: linear-gradient(135deg,#f5fbff 0%,#00cae0 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: #f5fbff;
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.4;
}
#asset-delete-modal.modal.ral-delete-modal .ral-close {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: .5rem;
  background: rgba(0,202,224,.1);
  color: #8c99a0;
  font: 400 .875rem / normal Arial,sans-serif;
  transition: .3s;
  cursor: pointer;
}
#asset-delete-modal.modal.ral-delete-modal .ral-close svg { display: block; width: 1.125rem; height: 1.125rem; }
#asset-delete-modal.modal.ral-delete-modal .ral-delete-body {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 7.5rem;
  margin: 0;
  padding: 2rem 2.25rem;
  overflow-y: auto;
  overscroll-behavior: contain;
}
#asset-delete-modal.modal.ral-delete-modal #asset-delete-message {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 0;
  padding: 0;
  color: #8c99a0;
  font-size: .9375rem;
  font-weight: 400;
  line-height: 1.8;
  text-align: center;
  transition: .3s;
}
#asset-delete-modal.modal.ral-delete-modal .ral-delete-status {
  width: 100%;
  margin: .5rem 0 0;
  padding: 0;
  color: #fca5a5;
  font-size: .75rem;
  line-height: 1.5;
}
#asset-delete-modal.modal.ral-delete-modal .ral-delete-status:empty { display: none; }
#asset-delete-modal.modal.ral-delete-modal .ral-delete-footer {
  display: flex;
  flex: none;
  align-items: center;
  gap: .75rem;
  margin: 0;
  padding: 1.25rem 1.75rem 1.5rem;
  border-top: 1px solid rgba(0,202,224,.1);
}
#asset-delete-modal.modal.ral-delete-modal .ral-delete-footer button {
  display: flex;
  flex: 1 1 0;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  min-width: 0;
  height: 50.4375px;
  margin: 0;
  padding: .75rem 1.5rem;
  overflow: hidden;
  border: 1px solid rgba(0,202,224,.2);
  border-radius: .625rem;
  background: #1b1c21;
  color: #8c99a0;
  font: 500 .875rem / normal Arial,sans-serif;
  transition: .3s cubic-bezier(.4,0,.2,1);
  cursor: pointer;
}
#asset-delete-modal.modal.ral-delete-modal .ral-delete-footer .ral-confirm {
  border-color: #00cae0;
  background: linear-gradient(135deg,#00cae0 0%,rgba(0,202,224,.8) 100%);
  color: #0f0f12;
  font-weight: 600;
}
#asset-delete-modal.modal.ral-delete-modal button:focus-visible { outline: 2px solid #00cae0; outline-offset: 2px; }
#asset-delete-modal.modal.ral-delete-modal button:disabled { opacity: .5; cursor: not-allowed; }

/* The verified phone state is 390 x 844. Other breakpoint widths still need
   reference comparison; this does not establish their acceptance. */
@media (max-width: 600px) {
  #asset-delete-modal.modal.ral-delete-modal {
    width: calc(100vw - 3.75rem);
    max-width: 100%;
  }
  #asset-delete-modal.modal.ral-delete-modal .ral-delete-header { padding: 1.25rem 1.25rem 1rem; }
  #asset-delete-modal.modal.ral-delete-modal #asset-delete-title { font-size: 1.125rem; }
  #asset-delete-modal.modal.ral-delete-modal .ral-close { width: 2.25rem; height: 2.25rem; }
  #asset-delete-modal.modal.ral-delete-modal .ral-delete-body { flex: 1 1 auto; padding: 1.25rem; }
  #asset-delete-modal.modal.ral-delete-modal .ral-delete-footer { flex-direction: column; align-items: stretch; padding: 1rem 1.25rem 1.25rem; }
  #asset-delete-modal.modal.ral-delete-modal .ral-delete-footer button { flex: none; width: 100%; }
}