.file-list { margin-top: 12px; display: flex; flex-direction: column; gap: 6px; max-height: 200px; overflow-y: auto; }
.file-item { display: flex; align-items: center; gap: 8px; padding: 6px 10px; background: #f7f8fa; border-radius: 6px; font-size: 13px; }
.file-item-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #1d2129; }
.file-item-size { color: #86909c; font-size: 12px; white-space: nowrap; }
.file-item-remove { color: #c9cdd4; cursor: pointer; font-size: 16px; line-height: 1; }
.file-item-remove:hover { color: #F53F3F; }

.wm-settings { display: flex; flex-direction: column; gap: 14px; }
.wm-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.wm-row > label { font-size: 13px; color: #4e5969; white-space: nowrap; min-width: 70px; }
.wm-mode-group { display: flex; gap: 6px; }
.wm-input { flex: 1; padding: 8px 10px !important; font-size: 13px; }
.wm-input-sm { width: 80px !important; padding: 6px 8px !important; font-size: 13px; text-align: center; }
.wm-color-input { width: 36px; height: 28px; padding: 2px; border: 1px solid #e5e6eb; border-radius: 4px; cursor: pointer; }
.wm-color-text { width: 80px; padding: 4px 8px; font-size: 13px; font-family: monospace; border: 1px solid #e5e6eb; border-radius: 4px; color: #1d2129; }
.wm-color-text:focus { border-color: #165DFF; outline: none; box-shadow: 0 0 0 2px rgba(22,93,255,0.15); }
.wm-position-group { display: flex; gap: 6px; flex-wrap: wrap; }
.wm-direction-group { display: flex; gap: 4px; flex-wrap: wrap; }
.wm-dir-btn { width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; border: 1px solid #e5e6eb; border-radius: 6px; background: #fff; font-size: 16px; cursor: pointer; transition: all 0.2s ease; padding: 0; color: #4e5969; }
.wm-dir-btn:hover { border-color: #bedaff; background: #f7f9ff; }
.wm-dir-btn.active { border-color: #165DFF; background: #f0f5ff; color: #165DFF; box-shadow: 0 0 0 2px rgba(22,93,255,0.15); }
.quality-slider-wrap { display: flex; align-items: center; gap: 8px; flex: 1; }
.quality-slider { flex: 1; accent-color: #165DFF; height: 4px; }
.quality-value { font-size: 13px; color: #165DFF; font-weight: 600; min-width: 36px; }

.wm-output-list { display: flex; flex-direction: column; gap: 10px; max-height: 500px; overflow-y: auto; }
.wm-item { border: 1px solid #e5e6eb; border-radius: 8px; padding: 12px; text-align: center; }
.wm-item canvas { max-width: 100%; display: block; margin: 0 auto; border-radius: 4px; }
.wm-item-name { font-size: 12px; color: #86909c; margin-top: 8px; }
.wm-dl { display: inline-block; margin-top: 6px; padding: 4px 12px; font-size: 12px; color: #165DFF; cursor: pointer; background: #f0f5ff; border: none; border-radius: 4px; }
.wm-dl:hover { background: #e0eaff; }

@media (max-width: 600px) { .wm-row { flex-direction: column; align-items: flex-start; } }