:root{--color-bg-primary: #0a0f0a;--color-bg-secondary: #121812;--color-bg-tertiary: #161d16;--color-surface: rgba(255, 255, 255, .04);--color-surface-hover: rgba(255, 255, 255, .08);--color-surface-glass: rgba(255, 255, 255, .02);--color-card-bg: rgba(22, 29, 22, .8);--color-accent-primary: #8da88b;--color-accent-secondary: #b7d9b7;--color-accent-highlight: #d1e7d0;--color-accent-gradient: linear-gradient(135deg, #8da88b 0%, #b7d9b7 100%);--color-success: #b7d9b7;--color-warning: #eab308;--color-error: #f43f5e;--color-text-primary: #fcfdfc;--color-text-secondary: #a3b8a2;--color-text-tertiary: #6a826a;--color-border: rgba(255, 255, 255, .08);--color-border-hover: rgba(255, 255, 255, .15);--shadow-sm: 0 4px 12px rgba(0, 0, 0, .3);--shadow-md: 0 12px 32px rgba(0, 0, 0, .5);--shadow-lg: 0 24px 64px rgba(0, 0, 0, .6);--shadow-glow: 0 0 40px rgba(141, 168, 139, .15);--glass-bg: rgba(10, 15, 10, .7);--glass-border: rgba(255, 255, 255, .06);--glass-blur: blur(32px);--spacing-xs: .5rem;--spacing-sm: 1rem;--spacing-md: 1.5rem;--spacing-lg: 2rem;--spacing-xl: 3rem;--spacing-2xl: 5rem;--spacing-3xl: 8rem;--radius-sm: .6rem;--radius-md: .9rem;--radius-lg: 1.25rem;--radius-xl: 2rem;--radius-full: 9999px;--transition-base: .35s cubic-bezier(.4, 0, .2, 1);--transition-fast: .15s cubic-bezier(.4, 0, .2, 1)}.light-mode{--color-bg-primary: #f4f7f4;--color-bg-secondary: #ffffff;--color-bg-tertiary: #e9eee9;--color-surface: rgba(0, 0, 0, .03);--color-surface-hover: rgba(0, 0, 0, .05);--color-surface-glass: rgba(255, 255, 255, .4);--color-card-bg: rgba(255, 255, 255, .9);--color-accent-primary: #4a634a;--color-accent-secondary: #5c7a5a;--color-accent-highlight: #8da88b;--color-accent-gradient: linear-gradient(135deg, #4a634a 0%, #5c7a5a 100%);--color-text-primary: #121812;--color-text-secondary: #3d4f3d;--color-text-tertiary: #5c705c;--color-border: rgba(0, 0, 0, .08);--color-border-hover: rgba(0, 0, 0, .12);--shadow-sm: 0 4px 12px rgba(0, 0, 0, .04);--shadow-md: 0 12px 32px rgba(0, 0, 0, .08);--shadow-lg: 0 24px 64px rgba(0, 0, 0, .1);--shadow-glow: 0 0 40px rgba(74, 99, 74, .08);--glass-bg: rgba(255, 255, 255, .85);--glass-border: rgba(0, 0, 0, .05)}.light-mode .hero h1{background:linear-gradient(135deg,var(--color-text-primary) 0%,var(--color-text-secondary) 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important}.light-mode .nav-link{color:var(--color-text-secondary)!important;font-weight:600}.light-mode .nav-link:hover,.light-mode .nav-link.active{color:var(--color-accent-primary)!important}.light-mode .badge-new{background:#4a634a0f!important;color:var(--color-accent-primary)!important;border-color:#4a634a26!important}.light-mode .hero p{color:var(--color-text-secondary)!important;opacity:.9}.light-mode .blob{opacity:.4;background:radial-gradient(circle,rgba(74,99,74,.08) 0%,transparent 70%)}.light-mode .upload-zone{border-color:#0000001a;background:#ffffff80}.light-mode .upload-zone:hover{border-color:var(--color-accent-primary);background:#fffc}.light-mode .preset-btn{background:var(--color-bg-secondary);border-color:var(--color-border);color:var(--color-text-secondary)}.light-mode .preset-btn:hover{border-color:var(--color-accent-highlight);background:var(--color-bg-primary)}.light-mode .preset-btn.active{background:var(--color-accent-primary);color:#fff;border-color:var(--color-accent-primary)}.light-mode .preset-btn.active .preset-label,.light-mode .preset-btn.active .preset-size{color:#fff}.light-mode .input-group input{background:#fff;border-color:var(--color-border)}.light-mode .image-card{background:#fff;border-color:var(--color-border);box-shadow:var(--shadow-sm)}.light-mode .btn-secondary{background:var(--color-bg-tertiary);color:var(--color-text-primary);border:1px solid var(--color-border)}.light-mode .btn-secondary:hover{background:var(--color-bg-secondary)}.light-mode .footer-logo img,.light-mode .app-logo img{filter:brightness(.8) contrast(1.2);opacity:.9}.light-mode .footer-logo:hover img,.light-mode .app-logo:hover img{opacity:1;filter:brightness(.6) contrast(1.4)}.light-mode .footer-links a{color:var(--color-text-secondary)}.light-mode .footer-links a:hover{color:var(--color-accent-primary)}.light-mode .copyright{color:var(--color-text-tertiary);opacity:.8}.light-mode .progress-bar{background:var(--color-bg-tertiary);box-shadow:inset 0 2px 4px #0000000f;border-color:#0000000d}.light-mode .progress-fill{box-shadow:0 0 20px #4a634a40}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:var(--color-bg-primary);color:var(--color-text-primary);line-height:1.6;min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased;transition:background var(--transition-base),color var(--transition-base)}.bg-blobs{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;overflow:hidden}.blob{position:absolute;width:600px;height:600px;background:radial-gradient(circle,rgba(141,168,139,.08) 0%,transparent 70%);filter:blur(40px);border-radius:50%;animation:blobFloat 25s ease-in-out infinite alternate}@media (min-width: 1024px){.blob{filter:blur(80px)}}.blob-1{top:-10%;right:-10%}.blob-2{bottom:-20%;left:-10%;animation-delay:-5s;background:radial-gradient(circle,rgba(183,217,183,.05) 0%,transparent 70%)}@keyframes blobFloat{0%{transform:translate(0) scale(1)}to{transform:translate(-50px,50px) scale(1.1)}}.nav-container{padding:var(--spacing-sm) var(--spacing-lg);background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border-bottom:1px solid var(--glass-border);position:fixed;top:0;left:0;right:0;z-index:1000;box-shadow:var(--shadow-sm);transition:all var(--transition-base)}@media (max-width: 768px){.nav-container{min-height:80px;display:flex;align-items:center}}.nav-container.scrolled{padding:var(--spacing-xs) var(--spacing-lg);box-shadow:var(--shadow-md)}.nav-content{max-width:1400px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-lg)}.nav-actions{display:flex;align-items:center;gap:var(--spacing-lg)}.reveal{opacity:0;transform:translateY(20px);transition:transform .8s cubic-bezier(.2,.8,.2,1),opacity .8s ease-out;will-change:transform,opacity}.reveal.active{opacity:1;transform:translateY(0)}.reveal-up{opacity:0;transform:translateY(30px);transition:transform 1s cubic-bezier(.2,.8,.2,1),opacity 1s ease-out;will-change:transform,opacity}.reveal-up.active{opacity:1;transform:translateY(0)}@media (max-width: 768px){.reveal,.reveal-up{transform:translateY(10px)}}.reveal-delayed{opacity:0;transform:scale(.95);transition:all .8s cubic-bezier(.2,.8,.2,1) .2s}.reveal-delayed.active{opacity:1;transform:scale(1)}.atf-container{min-height:90vh;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:120px var(--spacing-lg) 0;gap:var(--spacing-2xl);max-width:1200px;margin:0 auto}.hero{text-align:center;max-width:800px;padding:0 var(--spacing-lg)}.app-logo{display:flex;align-items:center;gap:var(--spacing-sm);text-decoration:none;color:var(--color-text-primary)!important;font-weight:800;font-size:1.25rem;letter-spacing:-.02em}.app-logo img{height:52px;width:52px;object-fit:contain;transition:var(--transition-base)}.app-logo:hover img{transform:scale(1.05)}.nav-links{display:flex;gap:var(--spacing-xl)}.nav-link{color:var(--color-text-secondary)!important;text-decoration:none;font-size:.95rem;font-weight:600;transition:all var(--transition-fast)}.nav-link:hover{color:var(--color-accent-primary)!important}.theme-toggle-btn{background:var(--color-surface);border:1px solid var(--color-border);color:var(--color-text-primary);width:42px;height:42px;border-radius:var(--radius-md);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast);font-size:1.2rem}.theme-toggle-btn:hover{background:#eef2ee;border-color:var(--color-accent-primary);transform:translateY(-2px);box-shadow:var(--shadow-sm)}.light-mode .atf-container{background-image:radial-gradient(at 0% 0%,rgba(74,99,74,.03) 0,transparent 50%),radial-gradient(at 100% 100%,rgba(74,99,74,.03) 0,transparent 50%)}.light-mode .upload-container{background:#ffffffb3;border:1px solid rgba(0,0,0,.05)}.hero{text-align:center;max-width:900px;margin:0 auto}.badge-new{display:inline-flex;padding:.4rem 1rem;background:#8da88b1a;border:1px solid rgba(141,168,139,.2);border-radius:var(--radius-full);color:var(--color-accent-primary);font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;margin-bottom:var(--spacing-lg)}.hero h1{font-size:clamp(2.2rem,6vw,3.8rem);line-height:1;font-weight:900;letter-spacing:-.05em;margin-bottom:var(--spacing-sm);background:linear-gradient(135deg,#fff,#8da88b);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.hero p{font-size:clamp(1rem,2.5vw,1.25rem);color:var(--color-text-secondary);max-width:500px;margin-left:auto;margin-right:auto;opacity:.9}.upload-container{width:100%;max-width:650px;padding:var(--spacing-lg);background:var(--color-card-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);position:relative;z-index:10}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.upload-zone{border:2px dashed rgba(255,255,255,.1);border-radius:var(--radius-lg);padding:var(--spacing-lg);transition:all var(--transition-base);background:#ffffff03;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:220px}.upload-zone:hover,.upload-zone.drag-over{border-color:var(--color-accent-primary);background:#8da88b0d;transform:scale(.995)}.upload-content{display:flex;flex-direction:column;align-items:center;text-align:center;max-width:450px;width:100%}#hero-cta{margin-top:15px;margin-bottom:var(--spacing-lg)}.upload-content h2{margin-top:var(--spacing-sm)}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--spacing-lg);max-width:1200px;margin:var(--spacing-3xl) auto;padding:0 var(--spacing-lg);scroll-margin-top:120px}.feature-card{position:relative;padding:var(--spacing-xl);background:var(--color-surface-glass);border:1px solid var(--color-border);border-radius:var(--radius-lg);transition:all var(--transition-base);overflow:hidden;display:flex;flex-direction:column;gap:var(--spacing-sm)}.feature-card:hover{background:var(--color-surface-hover);border-color:var(--color-accent-primary);transform:translateY(-10px) scale(1.02);box-shadow:0 20px 40px #0006,var(--shadow-glow)}.feature-card:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at top right,rgba(141,168,139,.05),transparent 60%);pointer-events:none}.feature-badge{position:absolute;top:1rem;right:1rem;background:var(--color-accent-gradient);color:var(--color-bg-primary);padding:.2rem .6rem;border-radius:var(--radius-sm);font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em}.feature-card .icon{font-size:2.5rem;margin-bottom:var(--spacing-sm);display:block;filter:drop-shadow(0 4px 8px rgba(0,0,0,.2))}.feature-card h3{font-size:1.4rem;font-weight:700;margin-bottom:.2rem;color:var(--color-text-primary)}.feature-card p{color:var(--color-text-tertiary);font-size:.95rem;line-height:1.5}.trust-bar{text-align:center;padding:var(--spacing-2xl) 0;border-top:1px solid var(--glass-border);max-width:1400px;margin:0 auto}.trust-title{font-size:.8rem;text-transform:uppercase;letter-spacing:.2em;color:var(--color-text-tertiary);margin-bottom:var(--spacing-xl)}.trust-metrics{display:flex;justify-content:center;gap:var(--spacing-3xl);flex-wrap:wrap}.metric-item{display:flex;flex-direction:column;align-items:center}.metric-value{font-size:2.5rem;font-weight:800;color:var(--color-text-primary)}.metric-label{font-size:.85rem;color:var(--color-text-tertiary)}footer{padding:var(--spacing-2xl) var(--spacing-lg);background:var(--color-bg-secondary);border-top:1px solid var(--glass-border);position:relative;overflow:hidden}footer .nav-content{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xl);text-align:center}@media (min-width: 1024px){footer .nav-content{flex-direction:row;justify-content:space-between;align-items:flex-start;text-align:left}}.footer-logo{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs)}@media (min-width: 1024px){.footer-logo{align-items:flex-start}}.footer-logo img{height:48px;width:auto;object-fit:contain;opacity:.8;transition:var(--transition-base)}.footer-logo:hover img{opacity:1}.cookie-banner{display:none;position:fixed;bottom:20px;left:20px;right:20px;background:var(--color-bg-secondary);border:1px solid var(--color-border);padding:var(--spacing-lg);box-shadow:var(--shadow-lg);z-index:10000;border-radius:var(--radius-lg);font-family:inherit;color:var(--color-text-primary);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);max-width:1200px;margin:0 auto;animation:fadeInUp .5s ease-out}.cookie-content{display:flex;flex-direction:column;gap:var(--spacing-md)}@media (min-width: 768px){.cookie-content{flex-direction:row;align-items:center;justify-content:space-between}.cookie-text{max-width:65%}.cookie-actions{flex-shrink:0}}.cookie-text h3{margin:0 0 var(--spacing-xs) 0;font-size:1.1rem;font-weight:700;color:var(--color-text-primary)}.cookie-text p{margin:0;font-size:.9rem;color:var(--color-text-secondary);line-height:1.5}.cookie-text a{color:var(--color-accent-primary);text-decoration:none;font-weight:600;transition:color .2s}.cookie-text a:hover{color:var(--color-accent-highlight);text-decoration:underline}.cookie-actions{display:flex;gap:var(--spacing-sm);flex-wrap:wrap;justify-content:flex-end}.cookie-actions .btn{padding:.6rem 1.2rem;font-size:.9rem;min-width:120px}.footer-logo .tagline{font-size:.9rem;color:var(--color-text-tertiary);font-weight:500}.footer-links{display:flex;gap:var(--spacing-xl);flex-wrap:wrap;justify-content:center}.footer-links a{color:var(--color-text-secondary);text-decoration:none;font-size:.95rem;font-weight:600;transition:var(--transition-fast);white-space:nowrap}.footer-links a:hover{color:var(--color-accent-primary)}.copyright{color:var(--color-text-tertiary);font-size:.85rem;line-height:1.6;max-width:400px;opacity:.6}@media (min-width: 1024px){.copyright{text-align:right}}.hidden{display:none!important}@media (max-width: 768px){.nav-container{padding:var(--spacing-xs) var(--spacing-md)}.nav-actions{display:flex!important;align-items:center;gap:var(--spacing-sm);margin-left:auto}.nav-links{display:none!important}.theme-toggle-btn{width:38px;height:38px;font-size:1.1rem}.app-logo img{height:42px;width:42px}.app-logo span{font-size:1.05rem}.hero{padding-top:0}.hero h1{font-size:2.1rem;margin-bottom:.5rem}.badge-new{margin-bottom:.75rem}.hero p{font-size:1rem;margin-bottom:0}.atf-container{min-height:auto;padding-top:150px;padding-bottom:var(--spacing-xl);gap:var(--spacing-lg)}.upload-container{padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-lg);margin:0 var(--spacing-md)}.upload-zone{min-height:160px;padding:var(--spacing-md)}.upload-content h2{font-size:1.2rem;margin-top:0}.upload-content p{font-size:.9rem}.feature-card{padding:var(--spacing-lg)}.feature-card .icon{font-size:2rem}.feature-card h3{font-size:1.2rem}.trust-metrics{gap:var(--spacing-xl)}.metric-value{font-size:1.8rem}.metric-item{flex:1 1 100px}.controls-card{padding:var(--spacing-md);display:flex;flex-direction:column;align-items:center;width:100%!important;text-align:center}.flex-header{flex-direction:column;align-items:center;text-align:center;gap:.75rem;margin-bottom:var(--spacing-lg)}.settings-badge{margin-left:0;font-size:.7rem;padding:.3rem .8rem}.preset-buttons{grid-template-columns:repeat(2,1fr);gap:var(--spacing-sm);width:100%}.custom-size{display:flex!important;flex-direction:column!important;gap:var(--spacing-md)!important;padding:var(--spacing-lg)!important;background:var(--color-surface)!important;border-radius:var(--radius-lg)!important;width:100%!important;align-items:stretch!important}.custom-size .input-group{width:100%!important}.custom-size .input-group label{font-size:.75rem!important;font-weight:700!important;color:var(--color-text-tertiary)!important;margin-bottom:.5rem!important;text-transform:uppercase!important;letter-spacing:.05em!important;text-align:center!important}.custom-size .input-group input{width:100%!important;font-size:1.5rem!important;font-weight:800!important;padding:.8rem!important;background:var(--color-bg-secondary)!important;border:2px solid var(--color-border)!important;border-radius:var(--radius-md)!important;height:60px!important;text-align:center!important;color:var(--color-text-primary)!important;transition:all .2s ease!important}.custom-size .input-group input:focus{border-color:var(--color-accent-primary)!important;background:var(--color-surface-hover)!important}.lock-aspect{padding:0!important;margin:-5px 0!important;display:flex!important;justify-content:center!important;z-index:2}.aspect-lock-btn{width:42px!important;height:42px!important;background:var(--color-bg-secondary)!important;border:2px solid var(--color-border)!important;box-shadow:0 4px 10px #0000004d!important}.quality-control{padding:var(--spacing-md);margin:var(--spacing-lg) 0;width:100%}#process-btn{width:100%!important;max-width:340px!important;min-height:75px;margin:2rem 0!important;display:flex!important;justify-content:center!important;align-items:center!important;align-self:center!important;font-size:1.4rem;border-radius:var(--radius-lg);float:none!important}}.btn{padding:.8rem 2rem;border-radius:var(--radius-lg);font-weight:700;cursor:pointer;transition:all var(--transition-base);display:inline-flex;align-items:center;justify-content:center;gap:.6rem;border:none;text-decoration:none}.btn-large{padding:1.25rem 3.5rem;font-size:1.4rem;font-weight:800;letter-spacing:-.01em}.btn-primary{background:var(--color-accent-gradient);color:var(--color-bg-primary);box-shadow:var(--shadow-glow)}#process-btn{margin:2rem auto 0;display:flex;justify-content:center;align-items:center;width:fit-content;min-width:280px;padding:1.2rem 2.5rem;font-size:1.2rem;box-shadow:0 0 40px #8da88b40;background:linear-gradient(135deg,#b7d9b7,#8da88b)}#process-btn:hover{transform:scale(1.05) translateY(-2px);box-shadow:0 10px 50px #8da88b66}.btn-primary:hover{transform:scale(1.05);box-shadow:0 0 50px #8da88b4d}.btn-secondary{background:var(--color-surface);color:#fff}.btn-outline{background:transparent;border:1px solid var(--color-border);color:var(--color-text-secondary)}.flex-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-md)}.flex-header h3{font-size:1.5rem;font-weight:800}.settings-footer-hint{margin-top:var(--spacing-lg);font-size:.75rem;color:var(--color-text-tertiary);text-align:center;font-weight:600;letter-spacing:.05em;opacity:.6;text-transform:uppercase}.preset-buttons{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem;margin:1rem 0}.preset-btn{background:var(--color-surface);border:1px solid var(--color-border);padding:.6rem .8rem;border-radius:var(--radius-md);color:var(--color-text-primary);text-align:left;cursor:pointer;transition:all .2s}.preset-btn:hover{border-color:var(--color-accent-primary);background:var(--color-surface-hover)}.preset-btn.active{background:var(--color-accent-primary);color:#fff}.preset-btn .preset-label{display:block;font-weight:700;font-size:.85rem}.preset-btn .preset-size{font-size:.7rem;opacity:.5}.custom-size{display:grid;grid-template-columns:1fr auto 1fr;gap:.5rem;align-items:center;margin:1rem 0;padding:.75rem;background:var(--color-surface);border-radius:var(--radius-md);border:1px solid var(--color-border)}.lock-aspect{display:flex;align-items:center;padding-top:1.8rem}.aspect-lock-btn{background:transparent;border:1px solid var(--color-border);color:var(--color-text-tertiary);width:40px;height:40px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.aspect-lock-btn.active{background:var(--color-accent-primary);color:#fff;border-color:var(--color-accent-primary)}.input-group label{display:block;margin-bottom:.8rem;font-size:.8rem;text-transform:uppercase;letter-spacing:.15em;color:var(--color-text-tertiary);font-weight:700}.input-group input{width:100%;background:var(--color-bg-tertiary);border:1px solid var(--color-border);color:var(--color-text-primary);padding:.6rem;border-radius:var(--radius-md);font-size:1rem;font-weight:800;transition:all .2s;text-align:center}.input-group input:focus{border-color:var(--color-accent-primary);background:var(--color-surface-hover);outline:none}.quality-control{margin:1rem 0;padding:1rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg)}.quality-control label{display:flex;justify-content:space-between;align-items:center;margin-bottom:.8rem;font-size:.65rem;font-weight:800;color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.1em}#quality-value{color:var(--color-accent-primary);font-size:1.4rem;font-weight:900}.slider-container{width:100%}input[type=range]#quality-slider{width:100%;height:18px;background:var(--color-bg-tertiary);border-radius:var(--radius-full);-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;outline:none;border:1px solid var(--color-border);background-size:30px 30px;background-image:linear-gradient(135deg,rgba(255,255,255,.05) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.05) 50%,rgba(255,255,255,.05) 75%,transparent 75%,transparent);animation:progressStripes 2s linear infinite}input[type=range]#quality-slider::-webkit-slider-thumb{-webkit-appearance:none;width:32px;height:32px;background:var(--color-accent-primary);border-radius:50%;border:5px solid var(--color-bg-primary);box-shadow:0 0 30px #8da88b99;transition:all .2s cubic-bezier(.175,.885,.32,1.275);margin-top:-1px}input[type=range]#quality-slider::-webkit-slider-thumb:hover{transform:scale(1.2);background:var(--color-accent-highlight);box-shadow:0 0 35px #8da88bb3}.editor-workspace{width:100%;max-width:1440px;margin:0 auto;padding:var(--spacing-2xl) var(--spacing-lg);display:flex;flex-direction:column;gap:var(--spacing-2xl);scroll-margin-top:100px}@media (min-width: 1024px){.editor-workspace{display:grid;grid-template-columns:380px 1fr;gap:var(--spacing-xl);align-items:start;padding-top:var(--spacing-xl)}.controls-section{position:sticky;top:100px;order:1;padding:0!important;display:block!important}.gallery-section{order:2;margin-top:0!important;padding:0!important;border-top:none!important}.controls-card{margin-top:0!important;max-width:100%!important;overflow:visible;display:flex;flex-direction:column;box-shadow:var(--shadow-md);background:var(--color-bg-secondary);border:1px solid var(--color-border);padding:1.25rem}.gallery-header{text-align:left!important;align-items:flex-start!important;margin-bottom:2rem!important;padding-top:5px}.gallery-header h3{font-size:1.75rem!important;margin-bottom:.5rem;line-height:1.1}.flex-header{margin-bottom:1.25rem}.flex-header h3{font-size:1.75rem!important;line-height:1.1;margin-bottom:0}.gallery-actions{width:100%;justify-content:flex-start}#process-btn{margin-top:1rem;width:100%;padding:1rem;font-size:1.1rem}}.controls-section{width:100%;display:flex;justify-content:center}.controls-card{padding:var(--spacing-lg);background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-xl);width:100%;max-width:650px;box-shadow:var(--shadow-md)}.gallery-section{width:100%}.gallery-header{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-lg);margin-bottom:var(--spacing-2xl);text-align:center}.gallery-header h3{font-size:1.8rem;font-weight:800;letter-spacing:-.02em}.gallery-actions{display:flex;gap:var(--spacing-md)}.image-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem}.image-card{background:var(--color-bg-secondary);border-radius:var(--radius-xl);overflow:hidden;border:1px solid var(--color-border);transition:all .3s ease;display:flex;flex-direction:column}.image-card:hover{transform:translateY(-8px);border-color:var(--color-accent-primary);box-shadow:var(--shadow-lg)}.image-preview-wrapper{position:relative;width:100%;padding-top:66.67%;background:var(--color-bg-primary);overflow:hidden}.image-preview-wrapper img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}.image-info{padding:var(--spacing-md);flex-grow:1}.image-savings{margin-bottom:var(--spacing-md)}.savings-tag{display:inline-flex;align-items:center;gap:.5rem;padding:.4rem .8rem;border-radius:var(--radius-md);font-size:.85rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.savings-positive{background:#10b98126;color:#10b981;border:1px solid rgba(16,185,129,.3);box-shadow:0 0 15px #10b9811a}.savings-negative{background:#f43f5e26;color:#f43f5e;border:1px solid rgba(244,63,94,.3);box-shadow:0 0 15px #f43f5e1a}.image-comparison{position:relative;border-radius:var(--radius-lg);overflow:hidden;background:var(--color-bg-primary);--slider-position: 50%;border:1px solid var(--color-border);max-height:70vh;cursor:grab}.image-comparison.panning{cursor:grabbing}.image-comparison.sliding{cursor:ew-resize}.comparison-images{position:relative;width:100%;padding-top:66.67%;pointer-events:none}.image-comparison:after{content:"";position:absolute;top:0;bottom:0;left:var(--slider-position);width:2px;background:#fff;box-shadow:0 0 10px #00000080;pointer-events:none;z-index:10;transition:left .1s ease-out}.dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000d9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;padding:var(--spacing-md);z-index:2000;overflow-y:auto;opacity:0;pointer-events:none;transition:.3s}.dialog-overlay.active{opacity:1;pointer-events:all}body:has(.dialog-overlay.active){overflow:hidden}.dialog{background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:1.5rem;width:95%;max-width:600px;position:relative}@media (min-width: 768px){.dialog{padding:2.5rem;width:90%}}.dialog-large{max-width:1000px}.close-btn{position:absolute;top:1.5rem;right:1.5rem;font-size:2rem;background:none;border:none;color:var(--color-text-tertiary);cursor:pointer}.progress-bar{background:var(--color-bg-tertiary);border-radius:var(--radius-full);height:14px;overflow:hidden;margin:1.5rem 0 .5rem;border:1px solid var(--color-border);position:relative;box-shadow:inset 0 2px 4px #0000001a}.progress-fill{height:100%;background:var(--color-accent-gradient);width:0%;position:relative;transition:width var(--transition-base);box-shadow:0 0 20px #8da88b66;border-radius:var(--radius-full)}.progress-fill:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background-image:linear-gradient(135deg,rgba(255,255,255,.2) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.2) 50%,rgba(255,255,255,.2) 75%,transparent 75%,transparent);background-size:30px 30px;animation:progressStripes 1s linear infinite;opacity:.8}.progress-fill:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);animation:progressShine 3s ease-in-out infinite}@keyframes progressStripes{0%{background-position:0 0}to{background-position:30px 0}}@keyframes progressShine{0%{left:-100%}50%,to{left:100%}}.progress-text{text-align:center;font-size:1rem;font-weight:800;color:var(--color-accent-primary);margin-top:.5rem}.format-control{margin-bottom:var(--spacing-md)}.format-options{display:flex;gap:var(--spacing-md);margin-top:var(--spacing-xs);background:#0003;padding:var(--spacing-xs);border-radius:var(--radius-sm);border:1px solid var(--color-border)}.light-mode .format-options{background:#ffffff80}.radio-label{display:flex;align-items:center;gap:var(--spacing-xs);cursor:pointer;font-size:.9rem;color:var(--color-text-secondary);padding:4px 8px;border-radius:4px;transition:all .2s ease}.radio-label:hover{color:var(--color-text-primary);background:#ffffff0d}.light-mode .radio-label:hover{background:#0000000d}.radio-label input[type=radio]{accent-color:var(--color-accent-primary);width:1rem;height:1rem}
