.app{background-color:var(--bg);min-height:100vh;color:var(--text);flex-direction:column;display:flex;overflow-x:hidden}.navbar{z-index:100;-webkit-backdrop-filter:blur(16px);background-color:#1e1f22d9;align-items:center;height:58px;display:flex;position:sticky;top:0}.navbar-container{justify-content:space-between;align-items:center;width:100%;max-width:1100px;margin:0 auto;padding:0 24px;display:flex}.navbar-logo{letter-spacing:-.5px;cursor:pointer;align-items:center;font-size:20px;font-weight:700;display:flex}.logo-brand{color:var(--text)}.logo-dot{color:var(--accent)}.logo-app{color:var(--text-secondary);margin-left:2px;font-size:18px;font-weight:400}.navbar-menu{align-items:center;gap:28px;display:flex}.nav-link{color:var(--text-secondary);transition:color var(--transition);padding:4px 0;font-size:14px;font-weight:500;position:relative}.nav-link:hover,.nav-link.active{color:var(--text)}.nav-link.active:after{content:"";background-color:var(--accent);border-radius:1px;width:100%;height:2px;position:absolute;bottom:-4px;left:0}.navbar-actions{align-items:center;gap:16px;display:flex}.btn-nav-text{color:var(--text);transition:color var(--transition);padding:8px 16px;font-size:14px;font-weight:600}.btn-nav-text:hover{color:var(--accent)}.btn-nav-accent{background-color:var(--accent);color:#fff;border-radius:var(--radius);transition:background-color var(--transition), transform var(--transition);padding:10px 20px;font-size:13px;font-weight:600}.btn-nav-accent:hover{background-color:var(--accent-hover)}.btn-nav-accent:active{transform:scale(.97)}.main-content{flex-direction:column;flex:1;gap:24px;width:100%;max-width:900px;margin:0 auto;padding:24px 24px 40px;display:flex}.hero{text-align:center;flex-direction:column;gap:8px;max-width:680px;margin:0 auto;display:flex}.hero-title{color:var(--text);letter-spacing:-.8px;font-size:42px;font-weight:700;line-height:1.2}.hero-description{color:var(--text-secondary);font-size:15px;line-height:1.6}.workspace-container{width:100%;max-width:820px;margin:0 auto;position:relative}.dropzone-container{border:2px dashed var(--bg-hover);border-radius:var(--radius-lg);width:100%;min-height:280px;transition:background-color var(--transition), border-color var(--transition);background-color:#0000;justify-content:center;align-items:center;display:flex;position:relative}.dropzone-container:hover{background-color:#8b5cf605}.dropzone-container.dragging{background-color:var(--accent-dim)}.hidden-file-input{display:none}.dropzone-empty-state{cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:12px;width:100%;height:100%;padding:48px 24px;display:flex}.dropzone-trigger-wrapper{margin-bottom:4px}.btn-choose-images{background-color:var(--accent);color:#fff;border-radius:var(--radius);transition:background-color var(--transition), transform var(--transition);align-items:center;gap:8px;padding:12px 24px;font-size:14px;font-weight:600;display:flex}.btn-choose-images:hover{background-color:var(--accent-hover)}.btn-choose-images:active{transform:scale(.98)}.dropzone-text-primary{color:var(--text);font-size:15px;font-weight:600}.dropzone-text-secondary{color:var(--text-secondary);opacity:.7;font-size:13px}.batch-action-indicator{background-color:var(--bg-elevated);color:var(--text-secondary);border-radius:var(--radius-sm);letter-spacing:.5px;text-transform:uppercase;align-items:center;gap:6px;padding:6px 12px;font-size:11px;font-weight:600;display:flex;position:absolute;bottom:20px;right:24px}.dropzone-container.dropzone-with-items{min-height:84px;transition:all var(--transition);background-color:#1e1f2266;border-style:dashed;border-width:1.5px;border-color:var(--bg-hover)!important;outline:none!important}.dropzone-container,.dropzone-container *,.dropzone-container:focus,.dropzone-container :focus,.dropzone-container:active,.dropzone-container :active{outline:none!important}.dropzone-container.dropzone-with-items:hover{background-color:#8b5cf60a;border-color:var(--bg-hover)!important}.dropzone-container.dropzone-with-items .dropzone-empty-state{flex-flow:wrap;justify-content:space-between;align-items:center;gap:16px;padding:12px 20px}.dropzone-container.dropzone-with-items .dropzone-text-primary{color:var(--text-secondary);margin:0;font-size:13px;font-weight:500}.dropzone-container.dropzone-with-items .dropzone-text-secondary{display:none}.dropzone-container.dropzone-with-items .btn-choose-images{box-shadow:none;border-radius:var(--radius-sm);padding:8px 16px;font-size:13px}.dropzone-container.dropzone-with-items .batch-action-indicator{border-radius:var(--radius-sm);background-color:var(--bg-hover);margin:0;padding:5px 10px;position:static}.workspace-card{background-color:var(--bg-card);border-radius:var(--radius);width:100%;box-shadow:none;justify-content:space-between;align-items:center;gap:14px;padding:12px 16px;display:flex}.workspace-card-left{flex:1;align-items:center;gap:8px;min-width:0;display:flex}.workspace-card-thumbnail{object-fit:cover;background-color:var(--bg-elevated);border-radius:8px;width:48px;height:48px}.workspace-card-thumbnail-fallback{background-color:var(--bg-elevated);width:48px;height:48px;color:var(--text-secondary);border-radius:8px;justify-content:center;align-items:center;display:flex}.workspace-card-info{flex-direction:column;gap:1px;min-width:0;display:flex}.workspace-card-filename{color:var(--text);white-space:nowrap;text-overflow:ellipsis;max-width:320px;font-size:14px;font-weight:600;overflow:hidden}.workspace-card-filesize{color:var(--text-muted);font-size:12px}.workspace-card-right{align-items:center;gap:8px;display:flex}.compact-scale-toggle{background-color:var(--bg-elevated);border-radius:var(--radius-sm);padding:2px;display:flex}.scale-toggle-btn{color:var(--text-secondary);transition:all var(--transition);cursor:pointer;white-space:nowrap;letter-spacing:.2px;background:0 0;border:none;border-radius:4px;padding:4px 6px;font-size:10px;font-weight:700}.scale-toggle-btn.active{background-color:var(--accent);color:#fff}.btn-compact{border-radius:var(--radius-sm);transition:background-color var(--transition), transform var(--transition);cursor:pointer;align-items:center;gap:6px;padding:6px 12px;font-size:12px;font-weight:600;display:flex}.btn-compact:active{transform:scale(.98)}.btn-compact-primary{background-color:var(--accent);color:#fff}.btn-compact-primary:hover{background-color:var(--accent-hover)}.btn-compact-success{color:#fff;background-color:#10b981}.btn-compact-success:hover{background-color:#059669}.btn-compact-secondary{background-color:var(--bg-elevated);color:var(--text-secondary)}.btn-compact-secondary:hover{background-color:var(--bg-hover)}.btn-compact-close{color:var(--text-muted);cursor:pointer;border-radius:var(--radius-sm);transition:color var(--transition), background-color var(--transition);background:0 0;border:none;justify-content:center;align-items:center;padding:6px;display:flex}.btn-compact-close:hover{color:var(--text);background-color:var(--bg-hover)}.compact-status{color:var(--text-secondary);align-items:center;gap:6px;font-size:13px;font-weight:600;display:flex}.compact-status.success{color:#10b981}.compact-status.failed{color:var(--accent)}.status-message{font-size:13px}.spinner-animate{color:var(--accent);animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.compact-error{color:var(--accent);background-color:var(--accent-dim);border-radius:var(--radius-sm);text-overflow:ellipsis;white-space:nowrap;align-items:center;gap:6px;max-width:180px;padding:6px 12px;font-size:12px;display:flex;overflow:hidden}.workspace-list{flex-direction:column;gap:8px;width:100%;margin-top:16px;margin-bottom:16px;display:flex}.workspace-list-actions{border-top:1px solid var(--bg-hover);justify-content:flex-end;align-items:center;gap:12px;margin-top:12px;margin-bottom:16px;padding-top:12px;display:flex}.btn-upscale-all{background-color:var(--accent);color:#fff;border-radius:var(--radius-sm);transition:background-color var(--transition), transform var(--transition);cursor:pointer;box-shadow:none;align-items:center;gap:8px;padding:10px 20px;font-size:13px;font-weight:600;display:flex}.btn-upscale-all:hover:not(:disabled){background-color:var(--accent-hover)}.btn-upscale-all:active:not(:disabled){transform:scale(.97)}.btn-upscale-all:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.btn-clear-all{background-color:var(--bg-elevated);border:1px solid var(--bg-hover);color:var(--text-secondary);border-radius:var(--radius-sm);transition:all var(--transition);cursor:pointer;padding:9px 18px;font-size:13px;font-weight:600}.btn-clear-all:hover:not(:disabled){background-color:var(--bg-hover);color:var(--text)}.btn-clear-all:active:not(:disabled){transform:scale(.97)}.btn-clear-all:disabled{opacity:.5;cursor:not-allowed}.spinner-animate-slow{color:var(--text-muted);animation:2s linear infinite spin}.other-tools-section{flex-direction:column;gap:16px;width:100%;max-width:680px;margin:0 auto;display:flex}.section-title{color:var(--text);letter-spacing:-.2px;font-size:15px;font-weight:600}.tools-grid{flex-direction:column;gap:10px;display:flex}.tool-card{background-color:var(--bg-card);border-radius:var(--radius);transition:background-color var(--transition), transform var(--transition);cursor:pointer;border:1px solid #0000;justify-content:space-between;align-items:center;gap:20px;padding:12px 18px;display:flex}.tool-card:hover{background-color:var(--bg-elevated);transform:translate(3px)}.tool-card-left{text-align:left;flex-direction:column;flex:1;gap:4px;display:flex}.tool-card-header{align-items:center;gap:8px;display:flex}.tool-card-title{color:var(--text);font-size:14px;font-weight:600}.tool-badge-accent{background-color:var(--accent-dim);color:var(--accent);border-radius:var(--radius-sm);text-transform:uppercase;letter-spacing:.5px;padding:2px 6px;font-size:9px;font-weight:700}.tool-card-desc{color:var(--text-secondary);font-size:12px;line-height:1.4}.tool-card-right{flex-shrink:0;justify-content:center;align-items:center;display:flex}.tool-card-arrow{color:var(--text-muted);transition:color var(--transition), transform var(--transition)}.tool-card:hover .tool-card-arrow{color:var(--text);transform:translate(2px)}.footer{border-top:1px solid var(--bg-card);width:100%;margin-top:auto;padding:28px 0}.footer-container{justify-content:center;width:100%;max-width:1100px;margin:0 auto;padding:0 24px;display:flex}.footer-text{color:var(--text-muted);font-size:13px}.btn-hamburger{border-radius:var(--radius-sm);width:38px;height:38px;color:var(--text);cursor:pointer;transition:background-color var(--transition);justify-content:center;align-items:center;display:none}.btn-hamburger:hover{background-color:var(--bg-hover)}.btn-close-menu{border-radius:var(--radius-sm);background-color:var(--bg-hover);width:36px;height:36px;color:var(--text);cursor:pointer;transition:background-color var(--transition);justify-content:center;align-items:center;display:flex}.btn-close-menu:hover{background-color:var(--bg-elevated)}.mobile-menu-overlay{background-color:var(--bg);z-index:1000;flex-direction:column;width:100vw;height:100vh;padding:16px 24px 32px;animation:.22s cubic-bezier(.16,1,.3,1) forwards slideDownMenu;display:flex;position:fixed;top:0;left:0}@keyframes slideDownMenu{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}.mobile-menu-header{justify-content:space-between;align-items:center;height:58px;margin-bottom:20px;display:flex}.mobile-menu-links{flex-direction:column;gap:12px;margin-bottom:24px;display:flex}.mobile-menu-link{border-radius:var(--radius);transition:background-color var(--transition);align-items:center;gap:16px;padding:12px 14px;display:flex}.mobile-menu-link:hover,.mobile-menu-link.active{background-color:var(--bg-card)}.menu-link-icon{border-radius:var(--radius-sm);background-color:var(--accent-dim);width:36px;height:36px;color:var(--accent);flex-shrink:0;justify-content:center;align-items:center;display:flex}.menu-link-details{flex-direction:column;gap:2px;display:flex}.menu-link-title{color:var(--text);font-size:14px;font-weight:600}.menu-link-desc{color:var(--text-secondary);font-size:11px;line-height:1.4}.mobile-menu-actions{align-items:center;gap:12px;width:100%;margin-top:auto;display:flex}.btn-mobile-signin{color:#1e1f22;border-radius:var(--radius-sm);text-align:center;transition:opacity var(--transition);background-color:#fff;flex:1;padding:12px 16px;font-size:13px;font-weight:700}.btn-mobile-signin:hover{opacity:.9}.btn-mobile-signup{background-color:var(--accent);color:#fff;border-radius:var(--radius-sm);text-align:center;transition:background-color var(--transition);white-space:nowrap;flex:1.4;padding:12px 16px;font-size:13px;font-weight:700}.btn-mobile-signup:hover{background-color:var(--accent-hover)}@media (width<=900px){.tools-grid{grid-template-columns:repeat(2,1fr)}.hero-title{font-size:36px}}@media (width<=768px){.navbar-menu,.navbar-actions{display:none!important}.btn-hamburger{display:flex}.navbar-container{padding:0 16px}.workspace-card{flex-direction:column;align-items:flex-start;gap:12px;padding:12px}.workspace-card-left{width:100%}.workspace-card-right{justify-content:flex-end;gap:8px;width:100%}.compact-scale-toggle{padding:2px}.scale-toggle-btn{padding:5px 10px;font-size:11px}.btn-compact{padding:6px 12px;font-size:12px}}@media (width<=680px){.main-content{gap:20px;padding:24px 16px 32px}.hero{gap:4px}.hero-title{letter-spacing:-.5px;font-size:26px}.hero-description{font-size:13px}.dropzone-container{min-height:180px}.dropzone-container.dropzone-with-items{min-height:80px}.dropzone-container.dropzone-with-items .dropzone-empty-state{flex-direction:row;justify-content:space-between;align-items:center;gap:8px;padding:10px 14px}.dropzone-container.dropzone-with-items .dropzone-text-primary{display:none}.dropzone-container.dropzone-with-items .btn-choose-images{padding:8px 12px;font-size:12px}.dropzone-container.dropzone-with-items .batch-action-indicator{padding:4px 8px;font-size:9px}.dropzone-empty-state{gap:8px;padding:24px 16px}.btn-choose-images{padding:10px 18px;font-size:13px}.dropzone-text-primary{font-size:14px}.dropzone-text-secondary{font-size:11px}.batch-action-indicator{padding:4px 8px;font-size:9px;bottom:12px;right:16px}.tools-grid{gap:8px}.tool-card{padding:12px}}.btn-bmc{color:#1a1500;border-radius:var(--radius-sm);transition:background var(--transition), transform var(--transition);white-space:nowrap;background:#fd0;border:none;align-items:center;gap:6px;padding:6px 14px;font-size:12px;font-weight:700;text-decoration:none;display:flex}.btn-bmc:hover{background:#f0d000}.btn-bmc:active{transform:scale(.97)}.bmc-icon{flex-shrink:0;width:16px;height:16px}.support-banner{background-color:var(--bg-card);border:1px solid var(--bg-hover);border-radius:var(--radius-sm);flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;margin-bottom:4px;padding:10px 16px;font-size:13px;display:flex}.support-banner-text{color:var(--text-secondary)}.support-banner-link{color:var(--accent);transition:color var(--transition);font-weight:600;text-decoration:none}.support-banner-link:hover{color:var(--accent-hover)}.seo-section{width:100%;max-width:820px;margin:0 auto 48px;padding:0 16px}.seo-grid{grid-template-columns:1fr 1fr;gap:12px;display:grid}.seo-card{background-color:var(--bg-card);border:1px solid var(--bg-hover);border-radius:var(--radius-sm);flex-direction:column;gap:8px;padding:16px 18px;display:flex}.seo-card-title{color:var(--text);margin:0;font-size:13px;font-weight:600}.seo-card-text{color:var(--text-secondary);margin:0;font-size:12px;line-height:1.65}@media (width<=600px){.seo-grid{grid-template-columns:1fr}}.ba-wrapper{flex-direction:column;align-items:center;gap:12px;width:100%;max-width:820px;margin:0 auto 48px;padding:0 16px;display:flex}.ba-heading{text-align:center;flex-direction:column;gap:4px;display:flex}.ba-title{color:var(--text);letter-spacing:-.01em;font-size:1.25rem;font-weight:700}.ba-subtitle{color:var(--text-muted);font-size:.82rem}.ba-container{border-radius:var(--radius-lg);cursor:ew-resize;-webkit-user-select:none;user-select:none;aspect-ratio:16/9;background:#111;border:1px solid #ffffff12;width:100%;position:relative;overflow:hidden}.ba-container.dragging{cursor:grabbing}.ba-img{object-fit:cover;pointer-events:none;width:100%;height:100%;display:block;position:absolute;inset:0}.ba-img-after{z-index:1}.ba-before-clip{z-index:2;position:absolute;top:0;bottom:0;left:0;overflow:hidden}.ba-before-clip .ba-img-before{width:var(--container-w,100%);object-fit:cover;pointer-events:none;height:100%;position:absolute;top:0;left:0}.ba-label{z-index:10;letter-spacing:.06em;text-transform:uppercase;border-radius:var(--radius-sm);pointer-events:none;padding:4px 10px;font-size:.7rem;font-weight:700;transition:opacity .2s;position:absolute;top:14px}.ba-label-before{color:#e5e7eb;background:#0000008c;border:1px solid #ffffff1f;left:14px}.ba-label-after{color:#fff;background:#8b5cf6bf;border:1px solid #8b5cf666;right:14px}.ba-divider{z-index:10;pointer-events:none;background:#ffffffe6;width:2px;position:absolute;top:0;bottom:0;transform:translate(-50%)}.ba-handle{pointer-events:none;background:#fff;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 1px 4px #00000059}.ba-handle svg{color:#374151}.ba-hint{color:var(--text-muted);letter-spacing:.04em;font-size:.75rem}:root{--bg:#1e1f22;--bg-card:#2b2d31;--bg-elevated:#313338;--bg-hover:#383a40;--accent:#8b5cf6;--accent-hover:#a78bfa;--accent-dim:#8b5cf61f;--text:#f3f4f6;--text-secondary:#a1a1aa;--text-muted:#74767f;--radius-sm:4px;--radius:7px;--radius-lg:10px;--transition:.18s ease}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{background:var(--bg);color:var(--text);min-height:100vh;font-family:Poppins,sans-serif;line-height:1.6}button{cursor:pointer;background:0 0;border:none;outline:none;font-family:inherit}input,select,textarea{border:none;outline:none;font-family:inherit}a{color:inherit;text-decoration:none}