*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

:root{
  --bg:#0F0E13;--surface:#161520;--surface-2:#1E1D2A;--surface-3:#262535;
  --border:#2A2938;--border-2:#38364C;
  --text:#EAE8F2;--text-2:#8E8AA3;--text-3:#514E64;
  --accent:#F59E0B;--accent-2:#FCD34D;--accent-dim:rgba(245,158,11,.11);
  --success:#34D399;--success-bg:rgba(52,211,153,.1);
  --warn:#FB923C;--warn-bg:rgba(251,146,60,.1);
  --danger:#F87171;--danger-bg:rgba(248,113,113,.1);
  --r-sm:4px;--r:7px;--r-lg:12px;--r-xl:18px;--r-2xl:24px;--r-pill:999px;
  --sh-sm:0 1px 4px rgba(0,0,0,.5);--sh:0 4px 16px rgba(0,0,0,.6);
  --sh-lg:0 16px 48px rgba(0,0,0,.8),0 4px 16px rgba(0,0,0,.4);
  --sh-amber:0 8px 28px rgba(245,158,11,.2);
  --topbar-h:50px;--sidebar-w:258px;
  --ease:cubic-bezier(.4,0,.2,1);--t:.18s
}
[data-theme="light"]{
  --bg:#F5F4F1;--surface:#FAFAF8;--surface-2:#EEECEA;--surface-3:#E4E2DE;
  --border:#D8D5CE;--border-2:#C4C0B8;
  --text:#1B1916;--text-2:#6B6660;--text-3:#9C9890;
  --accent:#D97706;--accent-2:#F59E0B;--accent-dim:rgba(217,119,6,.1);
  --success:#059669;--success-bg:rgba(5,150,105,.1);
  --warn:#C2410C;--warn-bg:rgba(194,65,12,.1);
  --danger:#DC2626;--danger-bg:rgba(220,38,38,.1);
  --sh-sm:0 1px 3px rgba(0,0,0,.08);--sh:0 4px 16px rgba(0,0,0,.1);
  --sh-lg:0 16px 48px rgba(0,0,0,.15),0 4px 16px rgba(0,0,0,.08);
  --sh-amber:0 8px 28px rgba(217,119,6,.14)
}

html{color-scheme:dark}
[data-theme="light"] html{color-scheme:light}

body{
  font-family:'Outfit',sans-serif;background:var(--bg);color:var(--text);
  font-size:13.5px;line-height:1.5;height:100vh;overflow:hidden;
  -webkit-font-smoothing:antialiased
}

.topbar{
  height:var(--topbar-h);display:flex;align-items:center;padding:0 16px;gap:6px;
  background:var(--surface);border-bottom:1px solid var(--border);
  position:relative;z-index:100;flex-shrink:0
}
.brand{
  display:flex;align-items:center;gap:9px;font-size:15px;font-weight:700;
  color:var(--text);letter-spacing:-.5px;padding-right:16px;
  border-right:1px solid var(--border);margin-right:4px;user-select:none;flex-shrink:0
}
.brand-icon{
  width:27px;height:27px;
  background:linear-gradient(135deg,var(--accent) 0%,var(--accent-2) 100%);
  border-radius:7px;display:flex;align-items:center;justify-content:center;
  box-shadow:0 2px 10px rgba(245,158,11,.38);flex-shrink:0
}
.brand-icon svg{color:#000}
.topbar-tag{
  font-size:11.5px;color:var(--text-3);
  font-family:'JetBrains Mono',monospace;letter-spacing:0;padding:0 6px
}
.v-sep{width:1px;height:20px;background:var(--border);flex-shrink:0;margin:0 4px}
.topbar-right{margin-left:auto;display:flex;align-items:center;gap:6px}

.status-pill{
  display:inline-flex;align-items:center;gap:6px;padding:4px 10px;
  border-radius:var(--r-pill);font-size:11.5px;font-weight:500;
  border:1px solid var(--border);background:var(--surface-2);color:var(--text-3);
  transition:var(--t) var(--ease)
}
.status-pill .dot{width:5px;height:5px;border-radius:50%;background:var(--text-3);flex-shrink:0}
.status-pill.busy{color:var(--accent);border-color:rgba(245,158,11,.25);background:var(--accent-dim)}
.status-pill.busy .dot{background:var(--accent);animation:pulse 1s infinite}
.status-pill.ok{color:var(--success);border-color:rgba(52,211,153,.25);background:var(--success-bg)}
.status-pill.ok .dot{background:var(--success);animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.25}}

.workspace{display:flex;height:calc(100vh - var(--topbar-h));overflow:hidden}

.sidebar{
  width:var(--sidebar-w);flex-shrink:0;display:flex;flex-direction:column;
  background:var(--surface);border-right:1px solid var(--border);
  transition:width .25s var(--ease);overflow:hidden
}
.sidebar.collapsed{width:52px}
.sidebar-head{
  height:42px;display:flex;align-items:center;justify-content:space-between;
  padding:0 14px;border-bottom:1px solid var(--border);flex-shrink:0
}
.sidebar-heading-txt{display:flex;align-items:center;gap:8px;overflow:hidden}
.sidebar-title{
  font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1.2px;
  color:var(--text-3);white-space:nowrap;transition:opacity .2s;overflow:hidden
}
.sidebar.collapsed .sidebar-title{opacity:0;width:0}
.sidebar-badge{
  font-family:'JetBrains Mono',monospace;font-size:10px;
  padding:2px 7px;border-radius:var(--r-pill);
  background:var(--surface-2);border:1px solid var(--border);color:var(--text-3);
  white-space:nowrap;transition:opacity .2s;flex-shrink:0
}
.sidebar.collapsed .sidebar-badge{opacity:0;width:0;padding:0;border:none}
.sidebar-body{flex:1;overflow-y:auto;padding:12px}
.sidebar-body::-webkit-scrollbar{width:3px}
.sidebar-body::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}
.lib-actions{display:flex;gap:5px;margin-bottom:10px}
.sidebar.collapsed .lib-actions{flex-direction:column}
.sidebar.collapsed .lib-actions .btn-ghost span{display:none}

.drop-zone{
  border:1.5px dashed var(--border-2);border-radius:var(--r-lg);padding:16px 10px;
  text-align:center;cursor:pointer;transition:var(--t) var(--ease);background:var(--surface-2)
}
.drop-zone:hover,.drop-zone.dragover{border-color:var(--accent);background:var(--accent-dim)}
.drop-zone.dragover{box-shadow:0 0 0 3px rgba(245,158,11,.14)}
.dz-icon{
  width:30px;height:30px;margin:0 auto 7px;background:var(--surface-3);
  border:1px solid var(--border);border-radius:var(--r);
  display:flex;align-items:center;justify-content:center;color:var(--text-3);
  transition:var(--t) var(--ease)
}
.drop-zone:hover .dz-icon,.drop-zone.dragover .dz-icon{
  background:var(--accent-dim);border-color:rgba(245,158,11,.4);color:var(--accent)
}
.dz-label{font-size:12px;font-weight:600;color:var(--text-2)}
.dz-sub{font-size:10.5px;color:var(--text-3);margin-top:2px}

.progress-wrap{margin:8px 0}
.progress-bar{height:2px;background:var(--surface-3);border-radius:2px;overflow:hidden}
.progress-fill{
  height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-2));
  width:0%;transition:width .2s ease;border-radius:2px
}
.progress-label{
  font-size:10px;color:var(--text-3);margin-top:4px;
  font-family:'JetBrains Mono',monospace;text-align:center
}

.thumb-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:10px}
.sidebar.collapsed .thumb-grid,.sidebar.collapsed .drop-zone,.sidebar.collapsed .lib-drop-wrap{display:none}
.thumb{
  aspect-ratio:1;border-radius:var(--r);overflow:hidden;position:relative;
  cursor:pointer;border:1px solid var(--border);background:var(--surface-2);
  transition:var(--t) var(--ease)
}
.thumb:hover{border-color:var(--accent)}
.thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s ease}
.thumb:hover img{transform:scale(1.09)}
.thumb-del{
  position:absolute;top:4px;right:4px;width:16px;height:16px;
  background:rgba(0,0,0,.75);color:var(--danger);border-radius:4px;
  display:none;align-items:center;justify-content:center;font-size:8px;font-weight:900;
  cursor:pointer;z-index:3;backdrop-filter:blur(4px);transition:var(--t) var(--ease)
}
.thumb:hover .thumb-del{display:flex}
.thumb-del:hover{background:var(--danger);color:#fff}

.main{flex:1;display:flex;flex-direction:column;overflow:hidden;background:var(--bg)}
.main-body{flex:1;overflow-y:auto;padding:24px 28px}
.main-body::-webkit-scrollbar{width:5px}
.main-body::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}

.section-label{
  font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1.2px;
  color:var(--text-3);margin-bottom:10px
}

.controls-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px}
.ctrl-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:14px 16px}

.query-row{display:flex;gap:12px;align-items:flex-start;margin-bottom:16px}
.query-drop-wrap{flex:0 0 120px}
.query-img-wrap{flex:0 0 120px;position:relative}
#queryPreviewImg{
  width:120px;height:120px;object-fit:contain;border-radius:var(--r-lg);
  border:1px solid var(--border);background:var(--surface-2);
  display:block;cursor:zoom-in;transition:var(--t) var(--ease)
}
#queryPreviewImg:hover{border-color:var(--accent)}
.query-drop-replace{
  position:absolute;bottom:6px;left:50%;transform:translateX(-50%);
  font-size:9.5px;font-weight:600;color:var(--text-3);
  background:rgba(0,0,0,.7);padding:3px 8px;border-radius:var(--r-pill);
  white-space:nowrap;opacity:0;transition:opacity .15s;pointer-events:none;
  backdrop-filter:blur(4px)
}
.query-img-wrap:hover .query-drop-replace{opacity:1}
.query-meta{flex:1;padding-top:2px}
.query-filename{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--text-2);margin-bottom:6px;word-break:break-all}
.query-size{font-size:11px;color:var(--text-3);margin-bottom:8px}

.queue-section{margin-bottom:14px}
.queue-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.queue-count-lbl{font-size:11px;font-weight:600;color:var(--text-3);text-transform:uppercase;letter-spacing:.8px}
.queue-list{display:flex;flex-direction:column;gap:4px}
.queue-item{
  display:flex;align-items:center;gap:8px;background:var(--surface);
  border:1px solid var(--border);border-radius:var(--r);padding:6px 8px;
  animation:slideIn .16s ease
}
@keyframes slideIn{from{opacity:0;transform:translateX(-6px)}to{opacity:1;transform:none}}
.queue-item-img{width:28px;height:28px;border-radius:5px;object-fit:cover;border:1px solid var(--border);flex-shrink:0}
.queue-item-name{flex:1;color:var(--text-2);font-family:'JetBrains Mono',monospace;font-size:9.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.field-label{
  display:block;font-size:10.5px;font-weight:700;text-transform:uppercase;
  letter-spacing:.8px;color:var(--text-3);margin-bottom:7px
}
.id-row{display:flex;gap:6px}
.id-row input{flex:1}
input[type="text"]{
  width:100%;padding:8px 12px;background:var(--surface-2);
  border:1px solid var(--border);border-radius:var(--r);color:var(--text);
  font-size:13px;font-family:'JetBrains Mono',monospace;
  transition:var(--t) var(--ease);-webkit-appearance:none
}
input[type="text"]:focus{
  outline:none;border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(245,158,11,.14);background:var(--surface-3)
}
input[type="text"]::placeholder{color:var(--text-3);font-family:'Outfit',sans-serif}
.field-hint{font-size:11px;color:var(--text-3);margin-top:5px}
.field-error{font-size:11px;color:var(--danger);margin-top:5px;font-weight:600}

.slider-row{display:flex;align-items:center;gap:12px}
input[type="range"]{
  flex:1;-webkit-appearance:none;height:3px;
  background:linear-gradient(to right,var(--accent) var(--pct,70%),var(--surface-3) var(--pct,70%));
  border-radius:2px;outline:none;border:none;cursor:pointer
}
input[type="range"]::-webkit-slider-thumb{
  -webkit-appearance:none;width:15px;height:15px;border-radius:50%;
  background:var(--accent);border:2.5px solid var(--surface);
  box-shadow:0 2px 8px rgba(245,158,11,.5);cursor:pointer;transition:transform .15s
}
input[type="range"]::-webkit-slider-thumb:hover{transform:scale(1.2)}
.slider-val{
  font-family:'JetBrains Mono',monospace;font-size:12px;font-weight:600;color:var(--accent);
  background:var(--accent-dim);padding:3px 10px;border-radius:var(--r-pill);
  border:1px solid rgba(245,158,11,.2);min-width:48px;text-align:center
}

.btn{
  display:inline-flex;align-items:center;gap:7px;padding:8px 16px;
  border-radius:var(--r);font-size:13px;font-weight:600;font-family:'Outfit',sans-serif;
  cursor:pointer;border:1px solid transparent;transition:var(--t) var(--ease);
  line-height:1;white-space:nowrap;user-select:none
}
.btn:disabled{opacity:.35;cursor:not-allowed}
.btn-primary{background:var(--accent);color:#000;box-shadow:var(--sh-amber)}
.btn-primary:not(:disabled):hover{background:var(--accent-2);transform:translateY(-1px);box-shadow:0 12px 36px rgba(245,158,11,.3)}
.btn-primary:not(:disabled):active{transform:translateY(0)}
.btn-ghost{background:var(--surface-2);color:var(--text-2);border-color:var(--border)}
.btn-ghost:not(:disabled):hover{background:var(--surface-3);color:var(--text);border-color:var(--border-2)}
.btn-success{background:var(--success);color:#000}
.btn-success:not(:disabled):hover{opacity:.88;transform:translateY(-1px)}
.btn-danger{background:var(--danger);color:#fff}
.btn-danger:not(:disabled):hover{opacity:.88;transform:translateY(-1px)}
.btn-sm{padding:5px 12px;font-size:12px}
.btn-xs{padding:3px 9px;font-size:11px}
.btn-icon{
  padding:6px;background:transparent;border:none;color:var(--text-3);cursor:pointer;
  border-radius:var(--r);transition:var(--t) var(--ease);display:flex;align-items:center
}
.btn-icon:hover{background:var(--surface-2);color:var(--text)}
.w-full{width:100%;justify-content:center}

.find-action{margin-bottom:22px}
.find-btn{width:100%;padding:12px 20px;font-size:14px;letter-spacing:.2px}
.divider{border:none;border-top:1px solid var(--border);margin:20px 0}

.results-empty{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-height:200px;color:var(--text-3);text-align:center;gap:12px;
  border:1.5px dashed var(--border);border-radius:var(--r-xl);padding:48px 24px;
  animation:fadeUp .3s ease
}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.results-empty-icon{
  width:52px;height:52px;background:var(--surface-2);border:1px solid var(--border);
  border-radius:16px;display:flex;align-items:center;justify-content:center;color:var(--text-3)
}
.results-empty p{font-size:13px;color:var(--text-3);max-width:240px;line-height:1.6}
.hint-row{display:flex;gap:6px;align-items:center}
.kbd{
  display:inline-flex;padding:2px 7px;background:var(--surface-3);
  border:1px solid var(--border-2);border-radius:5px;
  font-size:10px;font-family:'JetBrains Mono',monospace;color:var(--text-2)
}

.compare-panel{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);
  padding:16px;animation:fadeUp .25s ease
}
.compare-inner{display:grid;grid-template-columns:160px 1fr;gap:16px}
.cmp-img-wrap{display:flex;flex-direction:column;gap:6px}
.cmp-img{
  width:100%;aspect-ratio:1;object-fit:contain;border-radius:var(--r-lg);
  border:1px solid var(--border);background:var(--surface-2);
  cursor:zoom-in;display:block;transition:var(--t) var(--ease)
}
.cmp-img:hover{border-color:var(--accent)}
.cmp-label{font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.9px;color:var(--text-3)}
.cmp-filename{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--text-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmp-size{font-size:10px;color:var(--text-3)}
.match-results{display:flex;flex-direction:column;gap:10px}
.match-results-header{display:flex;align-items:center;justify-content:space-between}
.match-results-title{font-size:13px;font-weight:700;color:var(--text)}
.matches-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(122px,1fr));gap:7px}
.match-card{
  border:1.5px solid var(--border);border-radius:var(--r-lg);overflow:hidden;
  cursor:pointer;transition:var(--t) var(--ease);background:var(--surface-2);position:relative
}
.match-card:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:var(--sh-amber)}
.match-card.selected{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim)}
.match-card-img{width:100%;aspect-ratio:1;object-fit:cover;display:block}
.match-card-body{padding:6px 8px 8px}
.match-card-name{font-size:9px;color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:'JetBrains Mono',monospace;margin-bottom:5px}
.match-card-check{
  position:absolute;top:6px;right:6px;width:17px;height:17px;
  border-radius:50%;border:2px solid rgba(255,255,255,.5);
  background:rgba(0,0,0,.4);backdrop-filter:blur(4px);transition:var(--t) var(--ease)
}
.match-card.selected .match-card-check{background:var(--accent);border-color:transparent}
.match-card.selected .match-card-check::after{
  content:'';position:absolute;top:1.5px;left:4px;width:5px;height:8px;
  border:2px solid #000;border-top:none;border-left:none;transform:rotate(45deg)
}
.rename-preview{
  display:flex;align-items:center;gap:8px;padding:8px 12px;
  background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r);
  flex-wrap:wrap;margin-top:10px
}
.rename-from{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--text-3)}
.rename-arrow{color:var(--accent);font-weight:700;font-size:13px}
.rename-to{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--accent);font-weight:700}

.badge{
  display:inline-flex;align-items:center;padding:2px 7px;border-radius:var(--r-pill);
  font-size:10px;font-weight:700;font-family:'JetBrains Mono',monospace
}
.badge-high{background:var(--success-bg);color:var(--success)}
.badge-medium{background:var(--warn-bg);color:var(--warn)}
.badge-low{background:var(--danger-bg);color:var(--danger)}
.badge-success{background:var(--success-bg);color:var(--success)}
.badge-error{background:var(--danger-bg);color:var(--danger)}
.score-ring-wrap{display:flex;align-items:center;gap:8px}

.log-backdrop{
  display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);
  z-index:200;backdrop-filter:blur(5px)
}
.log-backdrop.active{display:block;animation:fadeIn .2s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.log-drawer{
  position:fixed;top:0;right:0;width:440px;height:100vh;
  background:var(--surface);border-left:1px solid var(--border);
  z-index:201;display:flex;flex-direction:column;
  transform:translateX(100%);transition:transform .28s var(--ease);
  box-shadow:-8px 0 40px rgba(0,0,0,.5)
}
.log-drawer.open{transform:translateX(0)}
.log-drawer-head{
  height:50px;display:flex;align-items:center;justify-content:space-between;
  padding:0 16px;border-bottom:1px solid var(--border);flex-shrink:0
}
.log-drawer-title{font-size:14px;font-weight:700;color:var(--text)}
.log-drawer-actions{display:flex;gap:4px}
.log-drawer-body{flex:1;overflow-y:auto}
.log-drawer-body::-webkit-scrollbar{width:3px}
.log-drawer-body::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}
.log-table{width:100%;border-collapse:collapse;font-size:11.5px}
.log-table thead{position:sticky;top:0;z-index:1}
.log-table thead tr{background:var(--surface-2)}
.log-table th{
  padding:8px 12px;text-align:left;font-size:9.5px;font-weight:700;
  text-transform:uppercase;letter-spacing:.8px;color:var(--text-3);
  border-bottom:1px solid var(--border)
}
.log-table td{padding:8px 12px;border-bottom:1px solid var(--border);color:var(--text-2);vertical-align:middle}
.log-table td.mono{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--text)}
.log-table tr:hover td{background:var(--surface-2)}
.log-empty{padding:52px 24px;text-align:center;color:var(--text-3);font-size:13px;line-height:1.6}
.log-empty-icon{width:44px;height:44px;margin:0 auto 12px;background:var(--surface-2);border:1px solid var(--border);border-radius:12px;display:flex;align-items:center;justify-content:center;color:var(--text-3)}

.overlay{
  display:none;position:fixed;inset:0;background:rgba(0,0,0,.75);
  z-index:500;align-items:center;justify-content:center;
  backdrop-filter:blur(10px);padding:20px
}
.overlay.active{display:flex;animation:fadeIn .2s ease}
.modal{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-2xl);
  box-shadow:var(--sh-lg);animation:scaleIn .22s cubic-bezier(.34,1.56,.64,1);
  max-width:96vw;max-height:90vh;display:flex;flex-direction:column;overflow:hidden
}
@keyframes scaleIn{from{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}
.modal-head{
  padding:20px 22px 16px;border-bottom:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;flex-shrink:0
}
.modal-title{font-size:16px;font-weight:700;color:var(--text)}
.modal-body{padding:20px 22px;overflow-y:auto;flex:1}
.modal-foot{
  padding:14px 22px;border-top:1px solid var(--border);
  display:flex;justify-content:flex-end;gap:8px;flex-shrink:0;
  background:var(--surface-2)
}
.cmp-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:16px}
.cmp-full-img{
  width:100%;max-height:220px;object-fit:contain;border-radius:var(--r-lg);
  border:1px solid var(--border);background:var(--surface-2);display:block;margin-bottom:10px
}
.cmp-sec-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--text-3);margin-bottom:8px}
.cmp-meta{display:flex;flex-direction:column;gap:5px}
.cmp-meta-row{display:flex;gap:8px;font-size:11px}
.cmp-meta-row span:first-child{color:var(--text-3);width:52px;flex-shrink:0}
.cmp-meta-row span:last-child{color:var(--text);font-family:'JetBrains Mono',monospace;font-size:10px}

.folder-pick-box{
  border:1.5px dashed var(--border-2);border-radius:var(--r-lg);padding:22px;
  text-align:center;cursor:pointer;background:var(--surface-2);
  transition:var(--t) var(--ease);margin-bottom:14px
}
.folder-pick-box:hover{border-color:var(--accent);background:var(--accent-dim)}
.folder-pick-box.selected{border-style:solid;border-color:var(--success);background:var(--success-bg)}
.folder-pick-icon{
  width:42px;height:42px;margin:0 auto 10px;background:var(--surface-3);
  border:1px solid var(--border);border-radius:12px;
  display:flex;align-items:center;justify-content:center;color:var(--text-3);
  transition:var(--t) var(--ease)
}
.folder-pick-box:hover .folder-pick-icon{background:var(--accent-dim);border-color:rgba(245,158,11,.4);color:var(--accent)}
.folder-selected-icon{background:var(--success-bg)!important;border-color:var(--success)!important;color:var(--success)!important}
.folder-pick-name{font-size:13px;font-weight:600;color:var(--text);margin-bottom:3px;font-family:'JetBrains Mono',monospace}
.folder-pick-sub{font-size:12px;color:var(--text-3)}
.folder-pick-box.selected .folder-pick-sub{color:var(--success)}
.save-status-box{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-lg);padding:12px}
.save-status-row{
  display:flex;align-items:center;justify-content:space-between;
  padding:6px 0;border-bottom:1px solid var(--border);font-size:11px
}
.save-status-row:last-child{border-bottom:none}
.save-status-file{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--text)}
.save-status-state{display:flex;align-items:center;gap:5px}
.notice{
  display:flex;align-items:flex-start;gap:8px;padding:10px 12px;
  border-radius:var(--r);font-size:12px;margin-bottom:14px;line-height:1.5
}
.notice-info{background:var(--accent-dim);color:var(--accent);border:1px solid rgba(245,158,11,.2)}
.notice-warn{background:var(--warn-bg);color:var(--warn);border:1px solid rgba(251,146,60,.2)}

#lightbox{
  display:none;position:fixed;inset:0;background:rgba(0,0,0,.94);
  z-index:2000;align-items:center;justify-content:center;
  cursor:zoom-out;backdrop-filter:blur(14px)
}
#lightbox.active{display:flex;animation:fadeIn .18s ease}
#lightboxImg{
  max-width:88vw;max-height:86vh;border-radius:var(--r-xl);
  box-shadow:0 32px 80px rgba(0,0,0,.9);
  animation:scaleIn .2s cubic-bezier(.34,1.56,.64,1)
}
#lightboxName{
  position:fixed;bottom:24px;left:50%;transform:translateX(-50%);
  background:rgba(0,0,0,.7);color:#fff;font-size:11px;
  font-family:'JetBrains Mono',monospace;padding:6px 16px;
  border-radius:var(--r-pill);backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.1)
}

#toastContainer{
  position:fixed;bottom:20px;left:50%;transform:translateX(-50%);
  display:flex;flex-direction:column;gap:7px;
  z-index:9999;pointer-events:none;align-items:center
}
.toast{
  display:flex;align-items:center;gap:9px;padding:10px 16px;
  border-radius:var(--r-lg);font-size:13px;font-weight:500;
  box-shadow:var(--sh-lg);pointer-events:all;
  animation:toastIn .22s cubic-bezier(.34,1.56,.64,1);
  border:1px solid transparent;max-width:380px;backdrop-filter:blur(20px)
}
@keyframes toastIn{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}
.toast-out{animation:toastOut .2s ease forwards}
@keyframes toastOut{to{opacity:0;transform:translateY(6px) scale(.96)}}
.toast-success{background:rgba(52,211,153,.12);color:var(--success);border-color:rgba(52,211,153,.22)}
.toast-error{background:rgba(248,113,113,.12);color:var(--danger);border-color:rgba(248,113,113,.22)}
.toast-warn{background:rgba(251,146,60,.12);color:var(--warn);border-color:rgba(251,146,60,.22)}
.toast-info{background:rgba(245,158,11,.1);color:var(--accent);border-color:rgba(245,158,11,.2)}

.theme-btn{
  display:flex;align-items:center;gap:6px;padding:5px 10px;border-radius:var(--r-pill);
  background:var(--surface-2);border:1px solid var(--border);cursor:pointer;
  font-size:11.5px;color:var(--text-3);font-family:'Outfit',sans-serif;font-weight:500;
  transition:var(--t) var(--ease);user-select:none
}
.theme-btn:hover{border-color:var(--border-2);color:var(--text-2)}

.hidden{display:none!important}
.spinning{animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.mt-2{margin-top:10px}
.no-match-panel{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);
  padding:20px;animation:fadeUp .25s ease
}

.find-action-row{display:flex;gap:8px}
.find-action-row .find-btn{flex:1}
.batch-run-btn{
  flex:0 0 auto;padding:12px 18px;font-size:14px;
  background:var(--surface-2);color:var(--text-2);border:1px solid var(--border);
  border-radius:var(--r);font-weight:600;font-family:'Outfit',sans-serif;
  cursor:pointer;display:flex;align-items:center;gap:7px;
  transition:var(--t) var(--ease);white-space:nowrap;line-height:1
}
.batch-run-btn:not(:disabled):hover{background:var(--surface-3);color:var(--text);border-color:var(--border-2)}
.batch-run-btn:disabled{opacity:.35;cursor:not-allowed}
.batch-run-btn.active{
  background:linear-gradient(135deg,rgba(245,158,11,.15),rgba(245,158,11,.05));
  color:var(--accent);border-color:rgba(245,158,11,.35)
}
.batch-overlay{
  display:none;position:fixed;inset:0;background:rgba(0,0,0,.82);
  z-index:600;backdrop-filter:blur(12px);flex-direction:column
}
.batch-overlay.active{display:flex;animation:fadeIn .2s ease}
.batch-shell{
  display:flex;flex-direction:column;height:100vh;
  max-width:1100px;margin:0 auto;width:100%;padding:0
}
.batch-head{
  height:56px;display:flex;align-items:center;justify-content:space-between;
  padding:0 24px;border-bottom:1px solid var(--border);
  background:var(--surface);flex-shrink:0
}
.batch-head-left{display:flex;align-items:center;gap:12px}
.batch-head-title{font-size:15px;font-weight:700;color:var(--text)}
.batch-progress-wrap{flex:1;max-width:300px;display:flex;flex-direction:column;gap:4px}
.batch-progress-bar{height:3px;background:var(--surface-3);border-radius:2px;overflow:hidden}
.batch-progress-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-2));width:0%;transition:width .15s ease;border-radius:2px}
.batch-progress-lbl{font-size:10px;color:var(--text-3);font-family:'JetBrains Mono',monospace}
.batch-head-right{display:flex;align-items:center;gap:8px}
.batch-summary-bar{
  display:flex;align-items:center;gap:16px;padding:10px 24px;
  background:var(--surface-2);border-bottom:1px solid var(--border);
  flex-shrink:0;flex-wrap:wrap
}
.batch-stat{display:flex;align-items:center;gap:6px;font-size:11.5px}
.batch-stat-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.batch-stat-num{font-weight:700;font-family:'JetBrains Mono',monospace}
.batch-stat-lbl{color:var(--text-3)}
.batch-controls{
  display:flex;align-items:center;gap:8px;padding:10px 24px;
  background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0
}
.batch-select-all{display:flex;align-items:center;gap:7px;cursor:pointer;user-select:none;font-size:12px;color:var(--text-2)}
.batch-select-all input[type=checkbox]{width:14px;height:14px;accent-color:var(--accent);cursor:pointer}
.batch-filter{display:flex;gap:4px;margin-left:auto}
.batch-filter-btn{
  padding:4px 10px;border-radius:var(--r-pill);font-size:11px;font-weight:600;
  cursor:pointer;border:1px solid var(--border);background:var(--surface-2);
  color:var(--text-3);transition:var(--t) var(--ease)
}
.batch-filter-btn.active{background:var(--accent-dim);border-color:rgba(245,158,11,.35);color:var(--accent)}
.batch-body{flex:1;overflow-y:auto;background:var(--bg)}
.batch-body::-webkit-scrollbar{width:5px}
.batch-body::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}
.batch-table{width:100%;border-collapse:collapse}
.batch-table thead{position:sticky;top:0;z-index:5}
.batch-table thead tr{background:var(--surface-2)}
.batch-table th{
  padding:9px 14px;text-align:left;font-size:9.5px;font-weight:700;
  text-transform:uppercase;letter-spacing:.8px;color:var(--text-3);
  border-bottom:1px solid var(--border)
}
.batch-table th:first-child{width:38px;text-align:center}
.batch-row{border-bottom:1px solid var(--border);transition:background .1s}
.batch-row:hover td{background:var(--surface)}
.batch-row.no-match td{opacity:.6}
.batch-row.no-match:hover td{background:rgba(248,113,113,.04)}
.batch-row.selected td{background:rgba(245,158,11,.04)}
.batch-table td{padding:10px 14px;vertical-align:middle}
.batch-table td:first-child{text-align:center;width:38px}
.batch-cb{width:14px;height:14px;accent-color:var(--accent);cursor:pointer}
.batch-thumb-cell{display:flex;align-items:center;gap:8px}
.batch-thumb{
  width:44px;height:44px;border-radius:var(--r);object-fit:cover;
  border:1px solid var(--border);background:var(--surface-2);flex-shrink:0;cursor:zoom-in
}
.batch-thumb:hover{border-color:var(--accent)}
.batch-fname{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--text-2);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:130px}
.batch-arrow{color:var(--accent);font-size:18px;font-weight:700;padding:0 4px;flex-shrink:0}
.batch-no-match-tag{
  font-size:10px;font-weight:700;color:var(--danger);
  background:var(--danger-bg);padding:3px 8px;border-radius:var(--r-pill);
  border:1px solid rgba(248,113,113,.2);white-space:nowrap
}
.batch-id-input{
  width:100%;padding:6px 10px;background:var(--surface-2);
  border:1px solid var(--border);border-radius:var(--r);color:var(--text);
  font-size:11px;font-family:'JetBrains Mono',monospace;
  transition:var(--t) var(--ease);min-width:130px
}
.batch-id-input:focus{
  outline:none;border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(245,158,11,.12);background:var(--surface-3)
}
.batch-id-input:disabled{opacity:.4;cursor:not-allowed}
.batch-status-icon{display:flex;align-items:center;gap:5px;font-size:11px;white-space:nowrap}
.batch-foot{
  padding:14px 24px;border-top:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;
  background:var(--surface);flex-shrink:0;gap:12px;flex-wrap:wrap
}
.batch-foot-left{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-3)}
.batch-foot-right{display:flex;align-items:center;gap:8px}

.resize-section{
  margin-top:16px;padding-top:14px;border-top:1px solid var(--border)
}
.resize-opts{
  display:flex;flex-wrap:wrap;gap:6px;margin-top:8px
}
.resize-opt{
  padding:5px 13px;border-radius:var(--r-pill);font-size:12px;font-weight:600;
  border:1.5px solid var(--border);background:var(--surface-2);color:var(--text-2);
  cursor:pointer;transition:var(--t) var(--ease);user-select:none;line-height:1.4
}
.resize-opt:hover{border-color:var(--border-2);color:var(--text);background:var(--surface-3)}
.resize-opt.active{
  border-color:var(--accent);background:var(--accent-dim);color:var(--accent)
}
.resize-custom-row{
  display:flex;align-items:center;gap:9px;margin-top:10px;
  padding:10px 12px;background:var(--surface-2);border:1px solid var(--border);
  border-radius:var(--r);animation:fadeUp .15s ease
}
.resize-custom-row input[type="number"]{
  width:80px;padding:6px 10px;background:var(--surface-3);
  border:1px solid var(--border);border-radius:var(--r);color:var(--text);
  font-size:13px;font-family:'JetBrains Mono',monospace;
  transition:var(--t) var(--ease);-webkit-appearance:none
}
.resize-custom-row input[type="number"]:focus{
  outline:none;border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(245,158,11,.14)
}
.resize-hint{
  font-size:10.5px;color:var(--text-3);margin-top:8px;
  display:flex;align-items:center;gap:5px;line-height:1.5
}

@media(max-width:880px){:root{--sidebar-w:200px}}
@media(max-width:640px){
  body{overflow:auto}
  .workspace{flex-direction:column;height:auto}
  .sidebar{width:100%!important;height:auto;border-right:none;border-bottom:1px solid var(--border)}
  .main-body{padding:16px}
  .controls-row{grid-template-columns:1fr}
  .compare-inner{grid-template-columns:1fr}
  .cmp-grid{grid-template-columns:1fr}
  .log-drawer{width:100vw}
}

/* Footer */
:root { --footer-h: 38px; }
.workspace { height: calc(100vh - var(--topbar-h) - var(--footer-h)) !important; }
.app-footer {
  height: var(--footer-h); display: flex; align-items: center;
  justify-content: space-between; padding: 0 18px;
  background: var(--surface); border-top: 1px solid var(--border);
  flex-shrink: 0; z-index: 90; gap: 12px;
}
.footer-left, .footer-right { display: flex; align-items: center; gap: 14px; flex-shrink: 0; }
.footer-copy { font-size: 11px; color: var(--text-3); font-family: 'JetBrains Mono', monospace; user-select: none; }
.footer-copy strong { color: var(--text-2); font-weight: 500; }
.footer-version {
  font-size: 10.5px; font-family: 'JetBrains Mono', monospace;
  background: var(--accent-dim); color: var(--accent);
  border: 1px solid rgba(245,158,11,.18); border-radius: var(--r-pill);
  padding: 1px 8px; font-weight: 600;
}
.footer-link {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 11px; color: var(--text-3); text-decoration: none;
  font-family: 'JetBrains Mono', monospace; transition: color var(--t) var(--ease);
}
.footer-link:hover { color: var(--accent); }
.footer-sep { width: 1px; height: 14px; background: var(--border); flex-shrink: 0; }