.file-dropzone {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 132px;
  padding: 20px;
  border: 1.5px dashed var(--line);
  border-radius: 10px;
  background: var(--surface);
  color: var(--ink);
  text-align: center;
  cursor: pointer;
  transition: border-color .15s, background .15s;
}
.file-dropzone:hover,
.file-dropzone.is-dragging,
.file-dropzone:focus-within { border-color: var(--action); background: color-mix(in srgb, var(--surface) 88%, var(--action)); }
.file-dropzone:focus-within { outline: 2px solid var(--action); outline-offset: 3px; }
.file-dropzone svg { color: var(--action); }
.file-dropzone strong { font-size: 13px; }
.file-dropzone span[data-file-name] { color: var(--muted); font-size: 11px; overflow-wrap: anywhere; }
.file-dropzone input[type=file] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }