/* ===============================================================
   overlays.css — drop target and the toast rail.
   =============================================================== */

.dropzone {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: grid;
  place-items: center;
  background: rgba(5, 7, 10, 0.82);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--t-mid);
}

.dropzone.is-open { opacity: 1; }

.dropzone__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 42px 62px;
  border: 1px dashed var(--holo-line);
  border-radius: var(--r);
  background: rgba(12, 17, 24, 0.7);
  box-shadow: 0 0 60px rgba(86, 224, 214, 0.12) inset;
}

.dropzone__inner strong {
  font-family: var(--display);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--holo);
}

.dropzone__inner span {
  color: var(--muted);
  font-size: 12px;
  letter-spacing: .1em;
  text-transform: uppercase;
}

/* ---------------------------------------------------------------
   Toasts — only used for things the tape cannot carry (rejections,
   decode failures in bulk).
   --------------------------------------------------------------- */
.toasts {
  position: fixed;
  right: var(--gutter);
  bottom: calc(var(--bar-h) + 14px);
  z-index: 50;
  display: flex;
  flex-direction: column;
  gap: 8px;
  pointer-events: none;
  max-width: min(340px, calc(100vw - 32px));
}

.toast {
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-left: 2px solid var(--holo);
  border-radius: var(--r-sm);
  background: rgba(12, 17, 24, 0.94);
  color: var(--text);
  font-size: 12px;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity var(--t-mid), transform var(--t-mid) var(--ease);
}

.toast.is-on { opacity: 1; transform: none; }
.toast.is-warn { border-left-color: var(--danger); }