.icp-tool{--ink:#172033;--ink2:#4A5568;--muted:#6B7689;--line:#D9E0EA;--surface:#F6F8FB;--paper:#FFFFFF;--chk:#EDF1F6;--blue:#2F5BEA;--blue-d:#1F43C4;--blue-soft:#E8EEFE;--green:#0F8A62;--red:#C93636;
  font-family:"Instrument Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);line-height:1.6;font-size:17px;max-width:960px;margin:0 auto 48px;background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:clamp(18px,4vw,36px);box-sizing:border-box;-webkit-font-smoothing:antialiased}
.icp-tool *,.icp-tool *::before,.icp-tool *::after{box-sizing:border-box}
.icp-tool h2{font-family:"Bricolage Grotesque","Instrument Sans",system-ui,sans-serif;color:var(--ink);letter-spacing:-.015em;line-height:1.15;margin:0 0 .4em;font-size:clamp(1.5rem,3.4vw,2.2rem);font-weight:700;padding:0;border:0}
.icp-tool p{margin:0 0 1em}
.icp-head p{color:var(--ink2);max-width:62ch;margin-bottom:24px}
.icp-tool button,.icp-tool select{font:inherit;cursor:pointer;margin:0;text-transform:none;letter-spacing:normal;box-shadow:none;line-height:1.3}
.icp-tool button{border:0;background:none;color:inherit;padding:0;min-height:0;width:auto}
.icp-tool button:focus-visible,.icp-tool input:focus-visible,.icp-tool select:focus-visible,.icp-tool .icp-drop:focus-within{outline:3px solid var(--blue);outline-offset:2px}

.icp-drop{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px;min-height:220px;padding:32px 20px;border:2px dashed #B8C3D4;border-radius:16px;cursor:pointer;transition:border-color .15s,background-color .15s;margin:0;
  background-color:var(--surface);background-image:linear-gradient(45deg,var(--chk) 25%,transparent 25%),linear-gradient(-45deg,var(--chk) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--chk) 75%),linear-gradient(-45deg,transparent 75%,var(--chk) 75%);background-size:24px 24px;background-position:0 0,0 12px,12px -12px,-12px 0}
.icp-drop:hover,.icp-drop.is-over{border-color:var(--blue);background-color:var(--blue-soft)}
.icp-drop input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.icp-drop-icon{width:56px;height:56px;border-radius:14px;background:var(--paper);border:1px solid var(--line);display:grid;place-items:center;color:var(--blue)}
.icp-drop strong{font-size:1.15rem;font-weight:600}
.icp-pick{display:inline-block;background:var(--blue);color:#fff;padding:10px 20px;border-radius:999px;font-weight:600;font-size:.95rem}
.icp-drop small{color:var(--muted);font-size:.85rem;max-width:56ch}

.icp-settings{display:grid;gap:20px;margin-top:28px}
.icp-label{display:block;font-weight:600;font-size:.95rem;margin-bottom:10px}
.icp-formats{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px}
.icp-tool .icp-fmt{display:flex;flex-direction:column;align-items:flex-start;padding:11px 13px;border:1.5px solid var(--line);border-radius:12px;background:var(--paper);text-align:left;transition:border-color .12s,background-color .12s}
.icp-fmt b{font-family:"Bricolage Grotesque",system-ui,sans-serif;font-size:1.3rem;font-weight:700;line-height:1.1}
.icp-fmt span{font-size:.76rem;color:var(--muted)}
.icp-tool .icp-fmt:hover{border-color:#9FB0CB}
.icp-tool .icp-fmt[aria-checked="true"]{border-color:var(--blue);background:var(--blue-soft)}
.icp-fmt[aria-checked="true"] b{color:var(--blue-d)}
.icp-tool .icp-fmt:disabled{opacity:.4;cursor:not-allowed}
.icp-row{display:flex;flex-wrap:wrap;gap:20px 32px;align-items:flex-start}
.icp-field{flex:1 1 220px}
.icp-field[hidden]{display:none}
.icp-range{display:flex;align-items:center;gap:12px}
.icp-range input{flex:1;accent-color:var(--blue)}
.icp-range output{min-width:3.2em;font-weight:600;font-variant-numeric:tabular-nums}
.icp-tool .icp-input{width:100%;padding:10px 12px;border:1.5px solid var(--line);border-radius:10px;font:inherit;font-size:.95rem;color:var(--ink);background:var(--paper);height:auto}
.icp-color{display:flex;align-items:center;gap:10px}
.icp-tool .icp-color input{width:44px;height:40px;padding:2px;border:1.5px solid var(--line);border-radius:10px;background:var(--paper)}
.icp-check{display:flex;align-items:center;gap:8px;font-size:.95rem;margin-top:10px;cursor:pointer}
.icp-check input{width:18px;height:18px;accent-color:var(--blue)}
.icp-hint{font-size:.82rem;color:var(--muted);margin-top:6px}

.icp-list{list-style:none;margin:28px 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
.icp-tool .icp-item{display:grid;grid-template-columns:56px 1fr auto;gap:14px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:var(--paper);margin:0}
.icp-thumb{width:56px;height:56px;border-radius:10px;background:var(--chk);display:grid;place-items:center;overflow:hidden;font-size:.72rem;font-weight:600;color:var(--muted)}
.icp-thumb img{width:100%;height:100%;object-fit:cover;display:block;margin:0;max-width:none}
.icp-meta{min-width:0}
.icp-name{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.95rem}
.icp-sizes{font-size:.84rem;color:var(--muted);font-variant-numeric:tabular-nums}
.icp-save{font-weight:600}
.icp-save.is-down{color:var(--green)}
.icp-save.is-up{color:var(--ink2)}
.icp-err{color:var(--red);font-size:.84rem}
.icp-btns{display:flex;gap:6px;align-items:center}
.icp-tool .icp-dl{background:var(--blue);color:#fff;padding:9px 16px;border-radius:999px;font-weight:600;font-size:.88rem;white-space:nowrap}
.icp-tool .icp-dl:hover{background:var(--blue-d)}
.icp-tool .icp-dl[aria-disabled="true"]{background:#B9C4D8;pointer-events:none}
.icp-tool .icp-x{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:var(--muted)}
.icp-tool .icp-x:hover{background:var(--surface);color:var(--ink)}
.icp-spin{width:16px;height:16px;border:2.5px solid var(--blue-soft);border-top-color:var(--blue);border-radius:50%;animation:icpspin .8s linear infinite;display:inline-block;vertical-align:-3px;margin-right:6px}
@keyframes icpspin{to{transform:rotate(360deg)}}

.icp-actions{display:none;flex-wrap:wrap;gap:10px;justify-content:space-between;align-items:center;margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.icp-actions.is-on{display:flex}
.icp-total{font-size:.92rem;color:var(--ink2)}
.icp-total b{color:var(--green)}
.icp-tool .icp-zip{background:var(--ink);color:#fff;padding:11px 20px;border-radius:999px;font-weight:600;font-size:.92rem}
.icp-tool .icp-zip:hover{background:#2A3550}
.icp-tool .icp-clear{color:var(--ink2);padding:11px 14px;border-radius:999px;font-weight:500;font-size:.92rem}
.icp-tool .icp-clear:hover{background:var(--surface)}
.icp-privacy{display:flex;gap:8px;align-items:flex-start;margin-top:20px;font-size:.85rem;color:var(--muted)}
.icp-privacy svg{flex:none;margin-top:3px}

@media (max-width:560px){
  .icp-tool .icp-item{grid-template-columns:44px 1fr}
  .icp-thumb{width:44px;height:44px}
  .icp-btns{grid-column:1/-1;justify-content:flex-end}
}
@media (prefers-reduced-motion:reduce){.icp-tool *{transition:none!important}}