:root{--color-pink: #e91e8c;--color-pink-dark: #c01577;--color-orange: #f26522;--color-yellow: #f5c800;--color-blue: #2196c4;--color-dark: #1a1a1a;--color-grey: #666666;--color-light: #f7f7f7;--color-border: #e0e0e0;--color-card-tint: #fff0f8;--color-card-border: #f7c0e0;--font-family: "Open Sans", sans-serif;--max-width: 1200px;--radius-md: 12px;--radius-lg: 20px;--shadow-sm: 0 2px 8px rgba(233, 30, 140, .08);--shadow-md: 0 4px 20px rgba(233, 30, 140, .12);--ease-out-quint: cubic-bezier(.22, 1, .36, 1);--ease-out-expo: cubic-bezier(.16, 1, .3, 1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}[hidden]{display:none!important}html{font-size:16px;-webkit-font-smoothing:antialiased}body{font-family:var(--font-family);background:var(--color-light);color:var(--color-dark);line-height:1.6;min-height:100vh;display:flex;flex-direction:column}.container{width:100%;max-width:var(--max-width);margin:0 auto;padding:0 24px}.site-header{background:#fff;border-bottom:1px solid var(--color-border);padding:20px 0}.header-inner{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.site-logo{height:44px;width:auto;flex-shrink:0}.header-divider{width:1px;height:32px;background:var(--color-border);flex-shrink:0}.header-title{font-size:1.25rem;font-weight:700;color:var(--color-dark)}.hero{padding:48px 0 32px;text-align:center}.hero-tagline{font-size:1.125rem;color:var(--color-grey);font-weight:400;max-width:520px;margin:0 auto}.drop-zone-wrapper{padding:0 0 40px}.drop-zone{position:relative;border:2.5px dashed var(--color-pink);border-radius:var(--radius-lg);background:#fff;padding:56px 32px;text-align:center;cursor:pointer;transition:background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s var(--ease-out-quint)}.drop-zone:hover{background:var(--color-card-tint);box-shadow:var(--shadow-sm)}.drop-zone.drag-over{background:var(--color-card-tint);border-color:var(--color-pink-dark);box-shadow:var(--shadow-md);transform:scale(1.01)}.drop-zone input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.drop-icon{display:block;margin:0 auto 16px;color:var(--color-pink);opacity:.85}.drop-title{font-size:1.25rem;font-weight:700;color:var(--color-dark);margin-bottom:6px}.drop-subtitle{font-size:.9rem;color:var(--color-grey)}.drop-subtitle strong{color:var(--color-pink);font-weight:600}.download-all-bar{margin-bottom:32px;display:flex;justify-content:flex-end}.btn-download-all{display:inline-flex;align-items:center;gap:8px;background:var(--color-pink);color:#fff;font-family:var(--font-family);font-size:.9375rem;font-weight:700;padding:12px 24px;border:none;border-radius:8px;cursor:pointer;transition:background .15s ease,transform .12s ease}.btn-download-all:hover{background:var(--color-pink-dark);transform:translateY(-1px)}.btn-download-all:active{transform:translateY(0)}.results-section{padding:0 0 48px}.results-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;list-style:none}.result-card{background:var(--color-card-tint);border:1px solid var(--color-card-border);border-radius:var(--radius-md);overflow:hidden;box-shadow:var(--shadow-sm);transition:box-shadow .18s ease,transform .18s ease;display:flex;flex-direction:column}.result-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.result-card.error{background:#fff5f5;border-color:#ffd0d0}.card-thumb-wrapper{position:relative;display:block;width:100%;overflow:hidden}.card-thumb{width:100%;aspect-ratio:16 / 9;object-fit:cover;background:#f0f0f0;display:block}.card-body{padding:16px;flex:1;display:flex;flex-direction:column;gap:8px}.card-filename{font-size:.875rem;font-weight:600;color:var(--color-dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card-size{font-size:1.0625rem;font-weight:700;color:var(--color-pink)}.card-dims,.card-quality{font-size:.8125rem;color:var(--color-grey)}.card-progress{font-size:.875rem;color:var(--color-grey);font-style:italic;padding:20px 16px;text-align:center}.progress-bar-track{height:4px;background:var(--color-border);border-radius:2px;overflow:hidden;margin-top:4px}.progress-bar-fill{height:100%;width:35%;background:linear-gradient(90deg,var(--color-pink),var(--color-orange));border-radius:2px;animation:progress-slide 1.1s var(--ease-out-quint) infinite}@keyframes progress-slide{0%{transform:translate(-100%)}to{transform:translate(calc(100% / .35))}}.card-error{font-size:.875rem;color:#c0392b;padding:20px 16px}.card-footer{padding:0 16px 16px}.btn-download{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;background:var(--color-pink);color:#fff;font-family:var(--font-family);font-size:.875rem;font-weight:700;padding:10px 16px;border:none;border-radius:8px;cursor:pointer;text-decoration:none;transition:background .15s ease}.btn-download:hover{background:var(--color-pink-dark);transform:translateY(-1px)}.btn-download:active{transform:scale(.97);transition-duration:.12s}@keyframes card-enter{0%{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.result-card.is-entering{animation:card-enter .42s var(--ease-out-quint) both}@keyframes content-reveal{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.result-card.is-revealing .card-thumb,.result-card.is-revealing .card-body,.result-card.is-revealing .card-footer{animation:content-reveal .3s var(--ease-out-quint) both}@keyframes size-pop{0%{transform:scale(1)}50%{transform:scale(1.06)}to{transform:scale(1)}}.card-size.is-popping{animation:size-pop .35s var(--ease-out-quint) both}.card-thumb-wrapper{position:relative;display:block}.success-badge{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(1);pointer-events:none;z-index:2;width:48px;height:48px;filter:drop-shadow(0 2px 6px rgba(26,26,26,.3))}@keyframes badge-in{0%{opacity:0;transform:translate(-50%,-50%) scale(.6)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes badge-out{0%{opacity:1}to{opacity:0}}.success-badge.is-entering{animation:badge-in .25s var(--ease-out-expo) both}.success-badge.is-leaving{animation:badge-out .3s ease both}.success-badge-circle{fill:#fff}.success-badge-check{fill:none;stroke:var(--color-pink);stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}@keyframes check-draw{0%{stroke-dashoffset:1}to{stroke-dashoffset:0}}.success-badge.is-entering .success-badge-check{animation:check-draw .45s var(--ease-out-expo) 80ms both}.btn-download .label-default{display:inline}.btn-download .label-saved,.btn-download.is-saved .label-default{display:none}.btn-download.is-saved .label-saved{display:inline}.main-content{flex:1;padding-top:0}.site-footer{background:#fff;border-top:1px solid var(--color-border);padding:20px 0;text-align:center}.footer-privacy{font-size:.875rem;color:var(--color-grey);display:flex;align-items:center;justify-content:center;gap:8px}.footer-privacy svg{flex-shrink:0;color:var(--color-pink)}@media (prefers-reduced-motion: reduce){.result-card.is-entering,.result-card.is-revealing .card-thumb,.result-card.is-revealing .card-body,.result-card.is-revealing .card-footer,.card-size.is-popping,.success-badge.is-entering,.success-badge.is-leaving,.success-badge.is-entering .success-badge-check,.progress-bar-fill{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.drop-zone.drag-over,.btn-download:hover,.btn-download:active{transform:none}}@media (max-width: 600px){.drop-zone{padding:40px 20px}.drop-title{font-size:1.125rem}.hero{padding:32px 0 24px}.results-grid{grid-template-columns:1fr}}