.compress-page{max-width:70rem;margin:0 auto;padding:var(--space-8) var(--space-4) var(--space-12);display:grid;gap:var(--space-8)}.compress-page__workspace{display:grid;gap:var(--space-4)}.compress-page__workspace h2,.tool-body-copy h2,.tool-body-copy p{margin:0}.tool-body-copy{display:grid;gap:var(--space-3)}.tool-body-copy p{color:var(--color-text-secondary)}.compress-tool,.single-image-tool{border:1px solid var(--color-border);border-radius:var(--radius-panel);background:var(--color-surface);padding:var(--space-4);display:grid;gap:var(--space-4)}.compress-tool input[type=file],.single-image-tool input[type=file]{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.dropzone{border:2px dashed var(--color-border-strong);border-radius:var(--radius-card);background:var(--color-surface-raised);padding:var(--space-6);text-align:center;display:grid;gap:var(--space-2);justify-items:center;transition:background-color var(--motion-duration-fast) var(--motion-ease-standard),border-color var(--motion-duration-fast) var(--motion-ease-standard)}.dropzone--dragging{border-color:var(--color-primary);background:var(--color-primary-subtle)}.dropzone p{margin:0;color:var(--color-text-secondary)}.dropzone__browse{display:inline-flex;align-items:center;justify-content:center;min-height:44px;border:1px solid var(--color-primary-border);border-radius:var(--radius-pill);background:var(--color-surface);color:var(--color-primary-hover);padding:var(--space-2) var(--space-4);font:inherit;font-size:var(--font-size-label);font-weight:600;cursor:pointer}.compress-tool__status p,.single-image-tool__status p{margin:0;min-height:1.5rem;color:var(--color-text-secondary);font-size:var(--font-size-label);font-weight:600;display:inline-flex;align-items:center;gap:var(--space-2)}.compress-tool__error,.single-image-tool__error{margin:0;color:var(--color-error);font-size:var(--font-size-label);font-weight:600}.compress-tool__empty{margin:0;color:var(--color-text-secondary)}.compress-tool__list{display:grid;gap:var(--space-4)}.compress-card{border:1px solid var(--color-border);border-radius:var(--radius-card);background:var(--color-surface-raised);padding:var(--space-3);display:grid;gap:var(--space-3)}.compress-card__header{display:grid;grid-template-columns:auto 1fr auto;gap:var(--space-3);align-items:start}.compress-card__preview{margin:0;width:96px;height:96px;border-radius:var(--radius-input);overflow:hidden;border:1px solid var(--color-border);background:#fff}.compress-card__preview img{width:100%;height:100%;object-fit:cover;display:block}.compress-card__meta{display:grid;gap:var(--space-1)}.compress-card__meta h3,.compress-card__meta p{margin:0}.compress-card__meta h3{font-size:var(--font-size-body);overflow-wrap:anywhere}.compress-card__meta p{color:var(--color-text-secondary);font-size:var(--font-size-caption)}.compress-card__remove{min-height:44px;border:1px solid var(--color-error);border-radius:var(--radius-pill);background:#fff;color:var(--color-error);font:inherit;font-size:var(--font-size-caption);font-weight:600;padding:0 var(--space-3);cursor:pointer}.compress-card__table-wrap{overflow-x:auto}.compress-card__table{width:100%;border-collapse:collapse;min-width:36rem}.compress-card__table th,.compress-card__table td{text-align:left;border-top:1px solid var(--color-border);padding:var(--space-2);vertical-align:top;font-size:var(--font-size-caption)}.compress-card__table th{color:var(--color-text-primary)}.compress-card__download{min-height:44px;border:1px solid transparent;border-radius:var(--radius-pill);background:var(--color-primary);color:#fff;font:inherit;font-size:var(--font-size-caption);font-weight:600;padding:0 var(--space-3);cursor:pointer}.compress-card__download:disabled{opacity:.55;cursor:not-allowed}.compress-card__format-error,.compress-card__item-error{margin:var(--space-1) 0 0;color:var(--color-error);font-size:var(--font-size-micro)}.single-image-tool__result{display:grid;gap:var(--space-3)}.single-image-tool__preview{margin:0;border:1px solid var(--color-border);border-radius:var(--radius-card);overflow:hidden;background:var(--color-surface-raised)}.single-image-tool__preview img{width:100%;max-height:min(70vh,28rem);object-fit:contain;display:block}.single-image-tool__stats{margin:0;display:grid;gap:var(--space-2);grid-template-columns:repeat(auto-fit,minmax(10rem,1fr))}.single-image-tool__stats div{border:1px solid var(--color-border);border-radius:var(--radius-input);padding:var(--space-2);background:var(--color-surface-raised)}.single-image-tool__stats dt{font-size:var(--font-size-micro);color:var(--color-text-secondary);margin:0}.single-image-tool__stats dd{margin:var(--space-1) 0 0;font-size:var(--font-size-label);color:var(--color-text-primary);font-weight:700}.single-image-tool__summary{margin:0;color:var(--color-text-secondary)}.single-image-tool__download{min-height:44px;border:1px solid transparent;border-radius:var(--radius-card);background:var(--color-primary);color:#fff;font:inherit;font-size:var(--font-size-label);font-weight:600;padding:var(--space-2) var(--space-4);cursor:pointer;width:fit-content}.single-image-tool__download:disabled{opacity:.55;cursor:not-allowed}.spinner{width:1rem;height:1rem;border-radius:50%;border:2px solid rgb(255 255 255 / 45%);border-top-color:currentColor;animation:spin .7s linear infinite}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:48rem){.compress-card__header{grid-template-columns:1fr}.compress-card__remove{width:fit-content}}@keyframes spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.spinner{animation:none}}