.tool [hidden]{display:none!important}
.tool .i{width:1.5rem;height:1.5rem;flex:none}

/* inputs */
.tool input[type=password],.tool input[type=number]{width:100%;padding:.7rem .85rem;border:1px solid var(--border);border-radius:10px;background:var(--bg);color:var(--fg);font:14px/1.55 var(--mono);transition:border-color .15s,box-shadow .15s}
.tool input[type=password]:focus,.tool input[type=number]:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px var(--glow)}
.tool select{width:100%;max-width:100%}
.tool select:disabled{opacity:.6}
.tool label.check{display:flex;gap:.5rem;align-items:flex-start;margin:.6rem 0 .2rem;color:var(--fg)}
.tool label.check input{margin-top:.25rem;width:1rem;height:1rem;accent-color:var(--accent)}
.tool .hint,.tool .status{color:var(--muted);font-size:.85rem;margin:.6rem 0 0}
.tool .hint.is-bad{color:#ef4444}
.tool textarea#pref{min-height:0}
.tool button .i{width:1.1rem;height:1.1rem;vertical-align:-.2rem;margin-right:.35rem}
.tool button:disabled{opacity:.5;cursor:not-allowed;filter:none;transform:none}
.tool button.ghost{display:inline-flex;align-items:center;gap:.35rem;min-height:2.5rem;padding:.3rem .8rem;background:none;box-shadow:none;color:var(--muted);font-weight:600;font-size:.85rem;border:1px solid var(--border)}
.tool button.ghost:hover:not(:disabled){filter:none;color:var(--accent);border-color:var(--accent)}
.tool button.ghost .i{width:1rem;height:1rem;margin:0}

/* custom dropdown (lib/picker.js) */
.tool .pk{position:relative;min-width:0}
.tool .pk__btn{display:flex;align-items:center;gap:.6rem;width:100%;min-height:3rem;padding:.45rem .75rem .45rem .85rem;border:1px solid var(--border);border-radius:10px;background:var(--bg);color:var(--fg);box-shadow:none;font:inherit;font-weight:400;text-align:left;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.tool .pk__btn:hover:not(:disabled){filter:none;border-color:var(--accent)}
.tool .pk__btn:active{transform:none;box-shadow:none}
.tool .pk__btn:focus-visible,.tool .pk__btn[aria-expanded=true]{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px var(--glow)}
.tool .pk__btn:disabled{opacity:.55}
.tool .pk__val{display:flex;flex-direction:column;flex:1;min-width:0;line-height:1.3}
.tool .pk__val>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tool .pk__val__title{font-size:.9rem;font-weight:600}
.tool .pk__val__note,.tool .pk__val__meta{font-size:.75rem;color:var(--muted)}
.tool .pk__val__note.is-good{color:var(--accent)}
.tool .pk__val__note.is-warn{color:#ef4444}
.tool .pk__chev{flex:none;width:1.1rem;height:1.1rem;color:var(--muted);transition:transform .15s}
.tool .pk__btn[aria-expanded=true] .pk__chev{transform:rotate(180deg);color:var(--accent)}
.tool .pk__list{position:absolute;z-index:30;top:calc(100% + 6px);left:0;min-width:100%;width:max-content;max-width:min(30rem,calc(100vw - 2rem));max-height:18rem;overflow:auto;margin:0;padding:.3rem;list-style:none;border:1px solid var(--border);border-radius:12px;background:var(--card);box-shadow:0 12px 32px rgba(0,0,0,.22)}
.tool .pk--up .pk__list{top:auto;bottom:calc(100% + 6px)}
.tool .pk--right .pk__list{left:auto;right:0}
.tool .pk__opt{display:flex;align-items:flex-start;gap:.55rem;min-height:2.5rem;padding:.5rem .7rem .5rem .5rem;border-radius:8px;cursor:pointer}
.tool .pk__opt.is-active{background:var(--glow)}
.tool .pk__opt[aria-disabled=true]{opacity:.45;cursor:not-allowed}
.tool .pk__check{flex:none;width:1rem;height:1rem;margin-top:.15rem;color:var(--accent);visibility:hidden}
.tool .pk__opt[aria-selected=true] .pk__check{visibility:visible}
.tool .pk__body{display:flex;flex-direction:column;gap:.1rem;min-width:0;line-height:1.35}
.tool .pk__title{font-size:.9rem;font-weight:600}
.tool .pk__opt[aria-selected=true] .pk__title{color:var(--accent)}
.tool .pk__note{font-size:.78rem;color:var(--muted)}
.tool .pk__note.is-good{color:var(--accent)}
.tool .pk__note.is-warn{color:#ef4444}
.tool .pk__meta{font:.72rem var(--mono);color:var(--muted)}
@media(prefers-color-scheme:light){.tool .pk__note.is-warn,.tool .pk__val__note.is-warn{color:#b91c1c}}

/* steps */
.tool .step+.step{margin-top:1.6rem;padding-top:1.4rem;border-top:1px solid var(--border)}
.tool .step{scroll-margin-top:1rem}
.tool .step__head{display:flex;align-items:center;gap:.7rem;margin:0 0 .8rem;font-size:1.1rem;line-height:1.3}
.tool .step__no{display:grid;place-items:center;flex:none;width:1.9rem;height:1.9rem;border-radius:50%;border:1.5px solid var(--border);color:var(--muted);font:700 .9rem var(--mono);transition:background .2s,border-color .2s,color .2s}
.tool .step__title{min-width:0}
.tool .step__state{margin-left:auto;flex:none;padding:.1rem .6rem;border-radius:99px;font-size:.75rem;font-weight:600;color:var(--muted)}
.tool .step__state:empty{display:none}
.tool .step[data-state=next] .step__no,.tool .step[data-state=busy] .step__no{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.tool .step[data-state=next] .step__state,.tool .step[data-state=busy] .step__state{background:var(--glow);color:var(--accent)}
.tool .step[data-state=done] .step__no{border-color:var(--accent);color:var(--accent)}
.tool .step[data-state=done] .step__state{border:1px solid var(--border)}
.tool .step__lead{margin:-.3rem 0 .9rem;color:var(--muted);font-size:.9rem;max-width:44rem}
.tool .step__wait{margin:0;padding:.8rem 1rem;border:1px dashed var(--border);border-radius:10px;color:var(--muted);font-size:.85rem}
.tool .next{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.6rem 1rem;margin-top:1rem;padding:.7rem .7rem .7rem 1rem;border:1px solid var(--accent);border-radius:12px;background:var(--glow)}
.tool .next p{margin:0;flex:1 1 16rem;font-size:.9rem;font-weight:600}
.tool button.next__btn{color:var(--accent);border-color:var(--accent);background:var(--card)}
.tool .guide{margin-bottom:1rem;padding:.8rem 1rem;border-left:3px solid var(--accent);background:var(--glow);border-radius:0 10px 10px 0;font-size:.9rem}
.tool .guide p{margin:0}
.tool .guide ul{margin:.4rem 0 0;padding-left:1.2rem}
.tool .guide li+li{margin-top:.2rem}

/* wide screens: steps 1 and 2 side by side, everything else full width */
@media(min-width:1100px){
  .tool[data-tool=photo-picker]{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}
  .tool[data-tool=photo-picker]>*{grid-column:1/-1}
  .tool #s1{grid-column:1;padding-right:1.4rem}
  .tool #s2{grid-column:2;align-self:stretch;margin-top:0;padding:0 0 0 1.4rem;border-top:0;border-left:1px solid var(--border)}
}

/* inline help */
.tool .lab{display:flex;align-items:center;gap:.35rem;margin:.2rem 0 .4rem}
.tool .lab label{margin:0}
.tool button.help{display:grid;place-items:center;width:1.4rem;height:1.4rem;min-height:0;padding:0;border:1px solid var(--border);border-radius:50%;background:none;box-shadow:none;color:var(--muted);font:700 .75rem var(--mono);position:relative}
.tool button.help::after{content:"";position:absolute;inset:-.55rem}
.tool button.help:hover,.tool button.help[aria-expanded=true]{filter:none;color:var(--accent);border-color:var(--accent)}
.tool button.help:active{transform:none}
.tool .help__text{padding:.7rem .9rem;border:1px solid var(--border);border-radius:10px;background:var(--card);font-size:.85rem}
.tool .help__text p{margin:0}
.tool .help__text p+*,.tool .help__text ul+p{margin-top:.4rem}
.tool .help__text ul{margin:.3rem 0 0;padding-left:1.2rem}

/* key */
.tool .keybox{padding:1rem;border:1px solid var(--border);border-radius:12px;background:var(--bg)}
.tool .keybox__row{display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:.4rem 1rem}
.tool .keybox__row+.keybox__row{margin-top:.6rem}
.tool .keybox__field{min-width:0}
.tool .keybox__opts{display:flex;align-items:center;justify-content:space-between;gap:.6rem;flex-wrap:wrap;margin-top:.3rem}
.tool .keybox__opts label.check{margin:.4rem 0}

/* drop zone */
.tool .drop{position:relative;display:block;border:2px dashed var(--border);border-radius:var(--radius);background:var(--bg);transition:border-color .15s,background .15s}
.tool .drop:hover,.tool .drop.is-over{border-color:var(--accent);background:var(--glow)}
.tool .drop:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:3px}
.tool .drop.is-busy{opacity:.5;pointer-events:none}
.tool .drop input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;z-index:1}
.tool .drop__empty{display:flex;flex-direction:column;align-items:center;gap:.4rem;padding:2.2rem 1rem;text-align:center}
.tool .drop__icon{display:grid;place-items:center;width:3.4rem;height:3.4rem;border-radius:50%;background:var(--card);border:1px solid var(--border);color:var(--accent)}
.tool .drop__icon .i{width:1.6rem;height:1.6rem}
.tool .drop__text{display:flex;flex-direction:column;align-items:center;gap:.2rem}
.tool .drop__title{font-weight:700;font-size:1.05rem}
.tool .drop__sub{color:var(--muted);font-size:.85rem}
.tool .drop.is-compact{border-width:1px}
.tool .drop.is-compact .drop__empty{flex-direction:row;justify-content:center;gap:.8rem;padding:.8rem 1rem;text-align:left}
.tool .drop.is-compact .drop__text{align-items:flex-start}
.tool .drop.is-compact .drop__icon{width:2.4rem;height:2.4rem}
.tool .drop.is-compact .drop__icon .i{width:1.2rem;height:1.2rem}

/* setup */
.tool #files{margin-top:1rem}
.tool .fhead{display:flex;align-items:center;justify-content:space-between;gap:.8rem;margin-bottom:.8rem}
.tool .fsum{font-size:.85rem;color:var(--muted);font-weight:600}
.tool .adv{margin-top:.9rem;border:1px solid var(--border);border-radius:12px;background:var(--bg)}
.tool .adv summary{min-height:2.75rem;display:flex;align-items:center;padding:0 1rem;cursor:pointer;font-weight:700;font-size:.9rem}
.tool .adv summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:12px}
.tool .adv[open] summary{border-bottom:1px solid var(--border)}
.tool .adv>:not(summary){margin:1rem}
.tool .adv__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:.6rem 1rem}
.tool .adv__head{display:flex;align-items:end;justify-content:space-between;gap:.6rem}
.tool .adv__prices{border:0;padding:0;min-width:0}
.tool .adv__prices legend{padding:0;margin-bottom:.4rem;font-size:.85rem;font-weight:700;color:var(--fg)}
.tool .estimate{margin:.9rem 0 0;padding:.6rem .8rem;border-left:3px solid var(--accent);background:var(--glow);border-radius:0 8px 8px 0;font-size:.85rem}
.tool .estimate:empty{display:none}
.tool .prog{display:block;width:100%;height:.5rem;margin-top:.4rem;accent-color:var(--accent)}

/* results */
.tool .rbar{display:flex;flex-wrap:wrap;align-items:end;gap:.6rem 1rem}
.tool .rbar__ctl{min-width:9rem}
.tool .rbar__ctl label{margin-bottom:.25rem}
.tool .rbar__btns{display:flex;gap:.4rem;margin-left:auto;flex-wrap:wrap}
.tool .grid-p{list-style:none;margin:.8rem 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(14rem,1fr));gap:.8rem}
.tool .grid-more{grid-column:1/-1;display:flex;justify-content:center;padding:.4rem 0}
.tool .pc{display:flex;flex-direction:column;min-width:0;border:1px solid var(--border);border-radius:12px;background:var(--bg);overflow:hidden;transition:border-color .15s,box-shadow .15s}
.tool .pc.is-picked{border-color:var(--accent);box-shadow:0 0 0 2px var(--glow)}
.tool .pc__media{position:relative}
.tool button.pc__view{display:block;width:100%;aspect-ratio:3/2;min-height:0;padding:0;border:0;border-radius:0;background:var(--card);box-shadow:none;cursor:zoom-in}
.tool button.pc__view:hover{filter:none}
.tool button.pc__view:active{transform:none}
.tool button.pc__view:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.tool .pc__view img{display:block;width:100%;height:100%;object-fit:cover}
.tool label.pc__pick{position:absolute;top:.4rem;left:.4rem;margin:0;display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:8px;background:rgba(0,0,0,.55);cursor:pointer}
.tool label.pc__pick input{width:1.15rem;height:1.15rem;margin:0;accent-color:var(--accent);cursor:pointer}
.tool .pc__badge{position:absolute;top:.4rem;right:.4rem;display:flex;align-items:center;gap:.25rem;padding:.15rem .5rem;border-radius:99px;background:rgba(0,0,0,.65);color:#fff;font:600 .75rem var(--mono)}
.tool .pc__badge .i{width:.9rem;height:.9rem}
.tool .pc__body{display:flex;flex-direction:column;gap:.35rem;padding:.6rem .7rem .7rem;min-width:0}
.tool .pc__name{display:flex;gap:.5rem;align-items:baseline;min-width:0;font-size:.8rem}
.tool .pc__file{font-family:var(--mono);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.tool .pc__kind{flex:none;color:var(--muted);font:.7rem var(--mono)}
.tool .pc__reason{margin:0;font-size:.85rem;color:var(--fg)}
.tool .pc__reason:empty{display:none}
.tool .chips{display:flex;flex-wrap:wrap;gap:.3rem}
.tool .chip{padding:.05rem .5rem;border:1px solid var(--border);border-radius:99px;font-size:.75rem;color:var(--muted)}
.tool button.pc__more{align-self:flex-start;min-height:2.25rem;font-size:.8rem}

/* stars */
.stars{display:flex;align-items:center;gap:0}
.stars button.star{display:grid;place-items:center;width:2.25rem;height:2.25rem;min-height:0;padding:0;margin:0;border:0;border-radius:8px;background:none;box-shadow:none;color:var(--muted);cursor:pointer}
.stars button.star .i{width:1.25rem;height:1.25rem;margin:0}
.stars button.star.on{color:var(--accent-2)}
.stars button.star.on .i{fill:currentColor}
.stars button.star:hover{filter:none;background:var(--glow)}
.stars button.star:active{transform:none}
.stars button.star:focus-visible{outline:2px solid var(--accent);outline-offset:0}
.stars__ai{margin-left:.4rem;font:.7rem var(--mono);color:var(--muted)}

/* duplicates */
.tool .dups{list-style:none;margin:.2rem 0 0;padding:0;display:grid;gap:.5rem}
.tool .dup{display:flex;gap:.6rem;align-items:flex-start;padding-top:.5rem;border-top:1px dashed var(--border)}
.tool button.dup__view{flex:none;width:4.5rem;aspect-ratio:3/2;min-height:0;padding:0;border:1px solid var(--border);border-radius:6px;background:var(--card);box-shadow:none;overflow:hidden;cursor:zoom-in}
.tool button.dup__view:hover{filter:none;border-color:var(--accent)}
.tool button.dup__view img{display:block;width:100%;height:100%;object-fit:cover}
.tool .dup__info{display:flex;flex-direction:column;align-items:flex-start;gap:.2rem;min-width:0;font-size:.8rem}
.tool .dup__stars{color:var(--accent-2);letter-spacing:.05em}
.tool .dup__reason{color:var(--muted)}
.tool button.dup__best{min-height:2.25rem;font-size:.75rem}

/* export */
.tool .export{padding:1rem;border:1px solid var(--border);border-radius:12px;background:var(--bg)}

/* preview dialog */
.pv{width:min(94vw,64rem);height:min(92vh,56rem);padding:0;border:1px solid var(--border);border-radius:var(--radius);background:var(--card);color:var(--fg);box-shadow:0 20px 60px rgba(0,0,0,.35)}
.pv[open]{display:flex;flex-direction:column}
.pv::backdrop{background:rgba(0,0,0,.7)}
.pv__head,.pv__foot{display:flex;align-items:center;gap:.6rem;padding:.4rem .8rem}
.pv__head{justify-content:space-between;border-bottom:1px solid var(--border)}
.pv__foot{justify-content:center;border-top:1px solid var(--border)}
.pv__title{font:600 .85rem var(--mono);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pv__stage{flex:1;min-height:0;display:grid;place-items:center;padding:8px;background:var(--bg)}
.pv__stage img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.pv__reason{margin:0;padding:0 1rem .3rem;text-align:center;font-size:.85rem;min-height:1.3rem}
.pv__keys{margin:0;padding:0 1rem .6rem;text-align:center;font-size:.75rem;color:var(--muted)}
.pv button.icon-btn{display:grid;place-items:center;width:2.5rem;height:2.5rem;min-height:0;padding:0;border:0;border-radius:10px;background:none;box-shadow:none;color:var(--fg);cursor:pointer}
.pv button.icon-btn .i{width:1.2rem;height:1.2rem}
.pv button.icon-btn:hover:not(:disabled){background:var(--glow);color:var(--accent)}
.pv button.icon-btn:disabled{opacity:.3;cursor:not-allowed}
.pv button.icon-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.pv .i{width:1.25rem;height:1.25rem}
@media(max-width:480px){
  .pv{width:100vw;height:100dvh;max-width:none;max-height:none;border-radius:0}
  .pv__keys{display:none}
  .tool .grid-p{grid-template-columns:minmax(0,1fr)}
  .tool .rbar__btns{margin-left:0}
}