.image-tool{padding:var(--space-5);border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);box-shadow:var(--shadow-sm)}.image-tool [hidden]{display:none}.image-tool__drop-zone{display:grid;min-block-size:13rem;place-items:center;padding:var(--space-5);border:2px dashed #9eb2d4;border-radius:var(--radius-md);background:var(--color-surface-muted);text-align:center;transition:border-color .18s ease,background-color .18s ease}.image-tool__drop-zone.is-dragging,.image-tool__drop-zone:focus-within{border-color:var(--color-primary);background:var(--color-primary-soft)}.image-tool__drop-zone p{margin:0 0 var(--space-3);color:var(--color-ink-muted)}.image-tool__input{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;clip-path:inset(50%)}.image-tool__details{display:grid;gap:var(--space-5);margin-top:var(--space-5)}.image-tool__preview{display:block;inline-size:min(100%,28rem);max-block-size:20rem;margin-inline:auto;border-radius:var(--radius-sm);object-fit:contain;background:var(--color-surface-muted)}.image-tool__meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3);margin:0}.image-tool__meta div{min-width:0;padding:var(--space-3);border-radius:var(--radius-sm);background:var(--color-surface-muted)}.image-tool__meta dt{color:var(--color-ink-muted);font-size:.78rem;font-weight:700}.image-tool__meta dd{margin:var(--space-1) 0 0;overflow-wrap:anywhere;font-weight:700}.image-tool__quality{display:grid;gap:var(--space-2)}.image-tool__quality input{inline-size:100%;accent-color:var(--color-primary)}.image-tool__quality p,.image-tool__status{margin:0;color:var(--color-ink-muted);font-size:.9rem}.image-tool__actions{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;margin-top:var(--space-5)}.image-tool__result{display:grid;gap:var(--space-3);margin-top:var(--space-5);padding:var(--space-4);border:1px solid #badcc2;border-radius:var(--radius-sm);background:#edf8ef}.image-tool__result[data-outcome=unchanged],.image-tool__result[data-outcome=larger]{border-color:#e6cb8d;background:#fff8e8}.image-tool__result>p{margin:0;font-weight:700}.image-tool__result-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(8rem,1fr));gap:var(--space-2);margin:0}.image-tool__result-stats div{padding:var(--space-2);border-radius:var(--radius-sm);background:#ffffffb3}.image-tool__result-stats dt{color:var(--color-ink-muted);font-size:.75rem;font-weight:700}.image-tool__result-stats dd{margin:var(--space-1) 0 0;font-weight:800}.image-tool__result-actions{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center}.image-tool__error{margin:var(--space-4) 0 0;padding:var(--space-3);border-radius:var(--radius-sm);color:#7a1f1f;background:var(--color-error-soft)}.image-tool__privacy{margin:var(--space-3) 0 0;color:var(--color-ink-muted);font-size:.88rem;line-height:1.5}@media(min-width:42rem){.image-tool__details{grid-template-columns:minmax(0,.9fr) minmax(16rem,1fr);align-items:start}}