/* ── Modal (shared) ── */
.modal-overlay { position:fixed;inset:0;background:rgba(0,0,0,.82);z-index:300;display:none;align-items:center;justify-content:center; }
.modal-overlay.open { display:flex; }
.modal { background:var(--surface);border-radius:14px;width:min(94vw,880px);max-height:90vh;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.6);border:1px solid var(--border); }
.modal-header { padding:14px 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;flex-shrink:0; }
.modal-title { font-size:14px;font-weight:700;flex:1; }
.modal-body { flex:1;overflow:hidden;padding:14px;display:flex;gap:14px;min-height:0; }
.modal-footer { padding:10px 18px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:8px;flex-shrink:0; }

/* ── Exclusion Zone Modal ── */
.excl-canvas-area { flex:1;display:flex;align-items:center;justify-content:center;background:#080810;border-radius:8px;border:1px solid var(--border);overflow:hidden;cursor:crosshair;position:relative;min-height:320px; }
.excl-canvas-area canvas { display:block;max-width:100%;max-height:100%; }
.excl-hint { position:absolute;bottom:8px;left:50%;transform:translateX(-50%);font-size:10px;color:rgba(255,255,255,.35);pointer-events:none;white-space:nowrap; }
.excl-sidebar { width:220px;flex-shrink:0;display:flex;flex-direction:column;gap:6px; }
.excl-sidebar-title { font-size:10px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.5px; }

/* ── Inline preset section (always visible) ── */
.excl-presets-inline { max-height:175px;overflow-y:auto;display:flex;flex-direction:column;gap:6px;padding-bottom:6px;border-bottom:1px solid var(--border); }
.excl-zones-head { font-size:10px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.4px;padding:2px 0 0; }

/* ── Preset panel ── */
.excl-preset-group { display:flex;flex-direction:column;gap:5px; }
.excl-preset-group-label { font-size:9px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.4px;padding:0 2px; }
.excl-preset-chips { display:flex;flex-wrap:wrap;gap:4px; }
.excl-preset-chip { border:1px solid var(--border);background:var(--surface2);color:var(--text);font-size:9px;padding:3px 8px;border-radius:5px;cursor:pointer;transition:background .15s,border-color .15s;white-space:nowrap; }
.excl-preset-chip:hover { background:rgba(99,102,241,.2);border-color:var(--accent);color:var(--accent); }
.excl-preset-chip.active { background:var(--accent);border-color:var(--accent);color:#fff; }
.excl-preset-chip.active:hover { background:var(--accent-hover);border-color:var(--accent-hover); }
.excl-user-preset-row { display:flex;align-items:center;gap:4px; }
.excl-empty { color:var(--text2);font-size:10px;text-align:center;padding:20px 8px;line-height:1.7;border:1px dashed var(--border);border-radius:6px; }
.excl-item { display:flex;align-items:center;gap:6px;padding:5px 8px;background:var(--surface2);border-radius:6px;font-size:10px; }
.excl-color-dot { width:9px;height:9px;border-radius:2px;flex-shrink:0; }
.excl-item-label { flex:1;color:var(--text);font-family:monospace;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.excl-del-btn { background:none;border:none;color:var(--text2);cursor:pointer;font-size:13px;padding:0 3px;border-radius:3px;line-height:1; }
.excl-del-btn:hover { color:var(--red);background:rgba(239,68,68,.15); }

/* ── img-comparison-slider (拖动对比 tab) ── */
.slider-wrap-outer { width:100%; }
.ui-compare-slider {
  --divider-width: 2px;
  --divider-color: var(--accent);
  --divider-shadow: 0 0 8px rgba(99,102,241,0.45);
  --default-handle-color: var(--accent);
  --default-handle-shadow: 0 2px 14px rgba(99,102,241,0.55);
  display: block;
  max-width: 100%;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0,0,0,.35);
}
.slider-label {
  position: absolute;
  top: 10px;
  background: rgba(0,0,0,.68);
  backdrop-filter: blur(4px);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 9px;
  border-radius: 4px;
  pointer-events: none;
  letter-spacing: .3px;
}
.slider-label-left  { left:  10px; }
.slider-label-right { right: 10px; }
.slider-hint { text-align:center;font-size:10px;color:var(--text3);margin-top:9px; }

/* ── Toast ── */
.toast-container { position:fixed;bottom:48px;left:50%;transform:translateX(-50%);z-index:500;display:flex;flex-direction:column;gap:6px;align-items:center;pointer-events:none; }
.toast { background:rgba(26,29,39,.96);border:1px solid var(--border);color:var(--text);padding:8px 16px;border-radius:8px;font-size:12px;box-shadow:0 8px 24px rgba(0,0,0,.4);animation:toastIn .2s ease-out;backdrop-filter:blur(8px); }
