.App{font-family:sans-serif;margin:auto;max-width:100%;min-height:100vh;padding:1rem;position:relative}.App:before{background-attachment:fixed;background-image:url(/static/media/image4.81f89017168949a1c215.png);background-position:50%;background-repeat:no-repeat;background-size:cover;content:"";height:100%;left:0;opacity:.55;position:fixed;top:0;width:100%;z-index:-1}body{background:#000;margin:0;padding:0}.wipe-container{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1a;border:2px dashed #ffffff4d;border-radius:12px;display:flex;justify-content:center;margin:.5rem auto;min-height:200px;overflow:hidden;position:relative}.wipe-container:before{color:#ffffffb3;content:"请选择图片开始对比";font-size:16px;font-weight:500;left:50%;pointer-events:none;position:absolute;text-align:center;top:50%;transform:translate(-50%,-50%);z-index:1}.wipe-container.has-image{-webkit-backdrop-filter:none;backdrop-filter:none;background:#0000;border:none}.wipe-container.has-image:before{display:none}.wipe-wrapper{height:100%;position:relative;width:100%}.wipe-wrapper img{display:block;height:100%;left:0;object-fit:contain;pointer-events:none;position:absolute;top:0;-webkit-user-select:none;user-select:none;width:100%}.wipe-slider{display:none}.wipe-divider{align-items:center;background:#fff;border-radius:2px;box-shadow:0 0 4px #0008;cursor:ew-resize;display:flex;height:100%;justify-content:center;position:absolute;top:0;transition:background .2s;width:4px;z-index:10}.wipe-divider:hover{background:#7cdaff}.drag-icon{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#0009;border-radius:16px;color:#fff;display:flex;font-size:20px;gap:4px;opacity:.8;padding:8px 12px;position:absolute;transition:opacity .3s ease}.wipe-divider:hover .drag-icon{opacity:1}.drag-icon span{font-weight:700}.image-labels{bottom:10px;height:30px;left:0;pointer-events:none;position:absolute;right:0;z-index:5}.label-left,.label-right{bottom:0;color:#fff;font-size:14px;font-weight:500;position:absolute;text-shadow:2px 2px 4px #000c}.label-left,.label-right{top:0}.header{align-items:baseline;display:flex;gap:1rem;justify-content:center;margin-bottom:1.5rem}.App h2{font-weight:600}.App h2,.App h4{color:#fff;margin:0;text-align:center}.App h4{font-weight:400;opacity:.8}.App h4 a{color:#fff;opacity:.8;text-decoration:none;transition:opacity .3s ease}.App h4 a:hover{opacity:1;text-decoration:underline}.controls{align-items:center;display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;margin-bottom:1rem;margin-top:1rem}.file-input{background:linear-gradient(45deg,#667eea,#764ba2);border-radius:8px;box-shadow:0 4px 15px #667eea66;color:#fff;cursor:pointer;display:inline-block;font-size:14px;font-weight:500;padding:12px 24px;position:relative;transition:all .3s ease}.file-input:hover{box-shadow:0 6px 20px #667eea99;transform:translateY(-2px)}.file-input input[type=file]{left:-9999px;opacity:0;position:absolute}.lut-select{background:#fff;border:2px solid #e1e5e9;border-radius:8px;box-shadow:0 2px 8px #0000001a;color:#333;cursor:pointer;font-size:14px;min-width:200px;padding:12px 16px;transition:all .3s ease}.lut-select:hover{border-color:#667eea;box-shadow:0 4px 12px #667eea33}.lut-select:focus{border-color:#667eea;box-shadow:0 0 0 3px #667eea1a;outline:none}.default-images{margin-top:1rem;text-align:center}.default-images h3{color:#fff;font-size:18px;font-weight:500;margin-bottom:.5rem;opacity:.9}.image-carousel{align-items:center;display:flex;justify-content:center;margin:10px 0}.carousel-btn{background:none;border:none;color:#fff;cursor:pointer;font-size:2rem;padding:0 10px;transition:opacity .2s;-webkit-user-select:none;user-select:none}.carousel-btn:disabled{cursor:not-allowed;opacity:.3}.image-grid{display:flex;gap:12px;transition:transform .4s cubic-bezier(.4,0,.2,1);will-change:transform}.image-card,.image-card span{display:none}.image-card-img{background:#fff;border-radius:8px;box-shadow:0 2px 8px #00000014;cursor:pointer;height:110px;margin:0;object-fit:cover;transition:box-shadow .2s;width:110px}.image-card-img:hover{box-shadow:0 4px 16px #667eea2e}.carousel-dots{display:flex;gap:8px;justify-content:center;margin-top:1rem}.dot{background:#ffffff4d;border:none;border-radius:50%;cursor:pointer;height:10px;transition:all .3s ease;width:10px}.dot.active{background:#667eea;transform:scale(1.2)}.dot:hover{background:#667eeab3}.image-strip{display:flex;flex-direction:row;gap:12px}
/*# sourceMappingURL=main.e1e3660a.css.map*/