*,.tools-navbar{box-sizing:border-box;margin:0}*{padding:0}.card-crop{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;background-color:#f5f7fa;min-height:100vh;width:100%}.tools-navbar{width:100%;display:flex;align-items:center;background:#fff;padding:0 30px;border-bottom:1px solid #e6e8eb;box-shadow:0 2px 4px rgba(0,0,0,.05);height:45px;max-width:none;min-width:100vw}.tools-navbar .menu-title{flex:1;max-width:none}.example-demo-info .example-demo-left,.menu-title ul{align-items:center;display:flex}.menu-title ul{list-style:none;margin:0 auto;padding:0 20px;max-width:1400px}.menu-title ul li{margin-right:7px}.menu-title ul li:last-child{color:#1772F6}.tools-navbar .tools-api-btn{color:#3A8DF8;font-size:14px;margin-left:8px;font-weight:600}.tools-navbar .tools-api-btn:hover{color:#1772F6}.crop-container{max-width:1400px;margin:0 auto;padding:0}.crop-content-area{display:flex;flex-wrap:wrap;justify-content:space-between;min-height:calc(100vh - 120px);height:calc(100vh - 120px);padding:20px}.crop-example-section{width:26%;background:#fff;border-radius:12px;padding:20px;box-shadow:0 4px 12px rgba(0,0,0,.08);height:100%;overflow:hidden;display:flex;flex-direction:column;gap:20px}.example-demo-info{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.example-demo-info .example-demo-title{font-weight:600;color:#333;font-size:16px}.example-demo-info .example-demo-text{font-weight:400;color:#999;font-size:14px;margin-left:8px}.example-demo-info .example-demo-right{transform:rotate(-90deg);transition:all .2s linear;cursor:pointer;padding:5px}.example-demo-info .example-demo-right.collapsed{transform:rotate(90deg)}.example-demo-info .example-demo-right i{color:#999}.example-demo-bottom{position:relative;opacity:1;max-height:1000px;max-width:300px;overflow:hidden;transition:all .3s ease}.example-demo-bottom.hidden{opacity:0;max-height:0;margin-top:0;margin-bottom:0}.example-demo-bottom .swiper-wrapper{align-items:center}.example-demo-bottom .example-demo-item{padding:4px;cursor:pointer;transition:all .2s ease}.example-demo-bottom .example-demo-item:hover{transform:translateY(-4px)}#demoBottom .swiper-slide:nth-child(1){width:60px}#demoBottom .swiper-slide:nth-child(2),#demoBottom .swiper-slide:nth-child(3){width:110px}.example-demo-item .example-demo-img{position:relative;height:80px;margin:0 auto;display:flex;justify-content:center;align-items:center}.example-demo-item .example-demo-img img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:5px}.example-demo-bottom .example-demo-prev{left:0}.example-demo-bottom .example-demo-next{right:0}.example-demo-bottom .example-demo-next,.example-demo-bottom .example-demo-prev{position:absolute;top:50%;transform:translateY(-50%);display:inline-flex;justify-content:center;align-items:center;width:30px;height:30px;border-radius:50%;background-color:rgba(255,255,255,.7);box-shadow:0 2px 5px rgba(0,0,0,.2);transition:all .3s ease;cursor:pointer;z-index:99}.example-demo-bottom .example-demo-next i,.example-demo-bottom .example-demo-prev i{color:rgba(153,153,153,.7);font-size:16px;font-weight:600;transition:all .3s ease}.example-demo-bottom .example-demo-next:hover,.example-demo-bottom .example-demo-prev:hover{background-color:#fff;box-shadow:0 2px 5px rgba(0,0,0,.3)}.example-demo-bottom .example-demo-next:hover i,.example-demo-bottom .example-demo-prev:hover i{color:#999}.example-history{border-top:1px solid #e6e8eb;padding-top:20px;flex:1;display:flex;flex-direction:column;overflow:hidden}.example-history-info{display:flex;align-items:center}.example-history-info .example-history-title{font-weight:600;color:#333;font-size:16px}.example-history-info .example-history-text{font-weight:400;color:#999;font-size:14px;margin-left:10px}.example-history-content{flex:1;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:10px}.file-upload-area{width:100%;font-size:16px;cursor:pointer;margin:15px 0 25px}.file-upload-area .crop-upload-btn{width:100%;height:48px;display:flex;justify-content:center;align-items:center;border:1px dashed #d1d5db;overflow:hidden;background-color:#fafbfc;transition:all .3s ease}.file-upload-area .crop-upload-btn:hover{border:1px dashed #1772F6;background-color:#f8faff}.file-upload-area i{color:#1772F6;font-size:20px}.file-upload-area .crop-upload-text{display:flex;align-items:center}.file-upload-area .crop-upload-text p{font-size:16px;color:#1772F6}.file-upload-area .crop-upload-text span{font-size:16px;color:#7aacf8}.example-history-content .no-files-history{text-align:center}.no-files-history i{font-size:36px;color:#999}.no-files-history p{font-size:14px;margin-top:8px;color:#6b7280}.history-item-img{width:120px;height:55px;flex-shrink:0;display:flex;align-items:center;overflow:hidden;background-color:#f7f7f7;border-radius:4px}.example-history-content.has-history .no-files-history{display:none}.history-item{display:flex;align-items:center;padding:10px;border:1px solid #f0f0f0;border-radius:8px;background-color:#fff;position:relative;transition:background-color .2s ease,border-color .2s ease;cursor:default;gap:15px}.history-item:hover{background-color:#f9f9f9;border-color:#e0e0e0}.history-images-scroll-container{display:flex;flex-direction:column;align-items:center;overflow-y:auto;overflow-x:hidden;gap:8px;width:100%;height:100%;scrollbar-width:thin;scrollbar-color:#ccc #f0f0f0}.history-images-scroll-container::-webkit-scrollbar{height:5px}.history-images-scroll-container::-webkit-scrollbar-track{background:0 0}.history-images-scroll-container::-webkit-scrollbar-thumb{background:#ccc;border-radius:10px}.history-images-scroll-container::-webkit-scrollbar-thumb:hover{background:#aaa}.history-images-scroll-container img{height:100%;width:auto;object-fit:contain;border-radius:2px;flex-shrink:0}.history-item-img .history-no-images{display:flex;align-items:center;justify-content:center;width:100%;height:100%;color:#b2b2b2}.history-item-img .history-no-images i{font-size:24px}.history-item-info{flex-grow:1;overflow:hidden;margin-right:16px}.history-item-info .title{font-size:14px;color:#333;margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;width:100%}.history-item-info .time{font-size:12px;color:#999;margin:0}.history-item-delete{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:20px;height:20px;cursor:pointer;visibility:hidden;opacity:0;transition:opacity .2s ease,visibility .2s ease}.history-item:hover .history-item-delete{visibility:visible;opacity:1}.example-history-content{overflow-y:auto;padding-right:5px}.operate{display:flex;flex-direction:column;justify-content:center;padding:10px 30px;font-size:14px}.operate .btn{display:flex;flex:1;align-items:center;justify-content:center;max-width:100px;height:35px;overflow-y:hidden;background-color:#3E8FF8;border:none;border-radius:10px;transition:all .3s;cursor:pointer;color:#fff}.crop-preview-section,.crop-upload-section{border-radius:12px;box-shadow:0 4px 12px rgba(0,0,0,.08)}.operate .operate-bottom,.operate .operate-top{width:100%;display:flex;align-items:center;justify-content:space-between}.operate .operate-top{height:20px;line-height:20px}.operate .operate-bottom{padding-top:10px;height:50px;scrollbar-width:none}.history-item .history-item-checkbox{display:none}.multi-select-mode .history-item .history-item-checkbox{display:flex;align-items:center}.multi-select-mode .history-item{cursor:pointer}.multi-select-mode .history-item.selected{background-color:#f0f7ff;border-color:#1772f6}.crop-upload-section{position:relative;width:41%;background:#fff;padding:20px;height:100%;display:flex;flex-direction:column;justify-content:space-between;gap:20px}.crop-upload-content{position:relative;flex:1;cursor:pointer;aspect-ratio:1;border:2px dashed #d1d5db;border-radius:12px;overflow:hidden;background-color:#fafbfc;transition:all .3s ease}.crop-upload-content:hover{border:2px dashed #1772F6;background-color:#f8faff}.crop-upload-content .crop-upload-prompt{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:20px;cursor:pointer;transition:all .3s ease}.crop-upload-content .crop-upload-prompt img{width:70px;height:70px;margin-bottom:12px;opacity:.6;flex-shrink:0;object-fit:contain}.crop-upload-content .crop-upload-prompt p{font-weight:600;color:#374151;font-size:16px;margin-bottom:10px}.crop-upload-content .crop-upload-prompt span{color:#6b7280;font-size:12px;display:inline-block;width:280px;text-align:center;line-height:1.6}.file-name-header{padding:8px 15px;background-color:#f7f7f7;text-align:center;font-size:14px;color:#333;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:all .3s ease}.crop-upload-content.uploaded{border:1px solid #e6e8eb;display:flex;flex-direction:column;gap:15px}.uploaded-files{flex:1;display:flex;align-items:center;justify-content:center;height:60%;width:100%}.file-item{display:flex;justify-content:center;align-items:center;position:relative;width:80%;height:auto}.preview-image{width:100%;height:auto;object-fit:contain;display:block;padding:6px;border:1px solid #16aaff}.file-icon{height:120px;display:flex;align-items:center;justify-content:center;background:#f8fafc;font-size:48px;color:#1772F6}.file-info{padding:12px;background:#fff}.file-name{font-size:14px;font-weight:500;color:#333;margin-bottom:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.4}.file-size{font-size:12px;color:#6b7280}.delete-btn{position:absolute;top:8px;right:8px;width:24px;height:24px;border:none;background:rgba(23,114,246,.8);color:#fff;border-radius:50%;cursor:pointer;font-size:16px;line-height:1;display:flex;align-items:center;justify-content:center;transition:all .3s ease;box-shadow:0 2px 8px rgba(0,0,0,.1)}.delete-btn:hover{background:rgba(23,114,246);transform:scale(1.1)}.crop-upload-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:15px;border-top:1px solid #e6e8eb}.reupload-btn{min-width:140px;height:40px;padding:0 20px;border:1px dashed #3E8FF8;color:#3E8FF8;border-radius:8px;cursor:pointer;font-size:14px;font-weight:500;transition:all .3s ease;display:flex;align-items:center;justify-content:center;gap:8px}.reupload-btn:hover{background:#3E8FF8;color:#fff}.reupload-btn i{font-size:16px}.crop-img-controls{display:flex;align-items:center;justify-content:center;gap:10px}.crop-img-controls img{display:inline-block;width:20px;height:20px;cursor:pointer;transition:all .2s ease}.crop-img-controls img:hover{transform:scale(1.2)}.crop-preview-section{width:30%;background:#fff;padding-bottom:20px;height:100%;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between}.crop-preview-section .crop-result-header{display:flex;background:#f8fafc;border-bottom:1px solid #e6e8eb}.crop-preview-section .crop-result-tab{flex:1;padding:16px;font-weight:600;color:#6b7280;cursor:pointer;transition:all .3s ease;border-bottom:3px solid transparent;margin:0;text-align:center}.crop-result-tab.active{color:#1772f6;background:#fff;border-bottom-color:#1772f6}.crop-preview-section .crop-result-content{flex:1;padding:20px;overflow-y:auto;min-height:0}.crop-result-content .crop-result-prompt{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#6b7280;min-height:200px}.crop-result-content .crop-result-prompt img{display:inline-block;width:80px;height:80px;margin-bottom:16px;opacity:.6}.crop-result-content .crop-result-prompt p{font-size:14px;line-height:1.5}.crop-result-content #jsonDisplay{display:none}.result-count{margin:0 0 15px;font-size:14px;color:#333;font-weight:500;padding-left:5px;border-left:3px solid #1E9FFF}.result-images-grid{display:flex;flex-direction:column;gap:15px;justify-content:space-between;align-items:center}.result-image-item{flex:1;border:1px solid #e6e6e6;border-radius:4px;padding:5px;background-color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.05);overflow:hidden;transition:transform .2s ease,box-shadow .2s ease;cursor:pointer}.result-image-item:hover{transform:translateY(-3px);box-shadow:0 4px 12px rgba(0,0,0,.1)}.result-image-item img{width:100%;height:auto;display:block;border-radius:2px;object-fit:contain}.crop-result-prompt .layui-icon-face-cry{color:#999;margin-bottom:15px}#jsonResult{background-color:#282c34;color:#abb2bf;padding:20px;border-radius:8px;font-family:SFMono-Regular,Consolas,'Liberation Mono',Menlo,Courier,monospace;font-size:14px;line-height:1.6;text-align:left;white-space:pre-wrap;word-break:break-all;min-height:100px;box-shadow:inset 0 2px 4px rgba(0,0,0,.2)}#toast,.toast{text-align:center}#jsonResult .json-key{color:#e06c75}#jsonResult .json-string{color:#98c379}#jsonResult .json-number{color:#d19a66}#jsonResult .json-boolean{color:#56b6c2}#jsonResult .json-null{color:#c678dd}.crop-download-btn{display:inline-flex;justify-content:center;align-items:center;margin:0 auto;min-width:135px;width:135px;height:43px;padding:0 20px;background-color:#3E8FF8;border-radius:10px;cursor:pointer;transition:all .3s linear}.cs-main-btn,.toast{transition:all .3s ease;display:flex;font-weight:500}.crop-download-btn:hover{background-color:#1772F6}.crop-download-btn em{color:#fff}.crop-download-btn p{color:#fff;margin-left:5px}.customer-service-float{position:fixed;right:24px;bottom:27%;z-index:999;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;animation:fadeInUp .5s ease-out}.cs-main-btn{align-items:center;gap:8px;background:linear-gradient(135deg,#1772f6,#4f9cf9);color:#fff;padding:12px 16px;border-radius:25px;cursor:pointer;box-shadow:0 4px 16px rgba(23,114,246,.4);border:none;font-size:14px;min-width:120px;justify-content:center;animation:pulse 3s infinite}.cs-main-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(23,114,246,.5);background:linear-gradient(135deg,#1563d6,#3b82f6);animation:none}.cs-main-btn:active{transform:translateY(-1px)}.cs-main-btn img{width:20px;height:20px;filter:brightness(0) invert(1)}.cs-main-btn span{color:#fff;font-weight:500;letter-spacing:.5px}@keyframes fadeInUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,100%{box-shadow:0 4px 16px rgba(23,114,246,.4)}50%{box-shadow:0 4px 16px rgba(23,114,246,.6),0 0 0 8px rgba(23,114,246,.1)}}.toast{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) translateY(-100px);background:#fff;border:2px solid #1772f6;color:#333;padding:40px 50px;border-radius:12px;box-shadow:0 8px 32px rgba(0,0,0,.1);z-index:10000;opacity:0;max-width:90%;flex-direction:column;align-items:center;justify-content:center;gap:16px;letter-spacing:.5px;font-size:16px}.toast.show{transform:translate(-50%,-50%) translateY(0);opacity:1}.toast-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.55);z-index:9999;display:none;transition:opacity .3s ease;opacity:0}.toast-button,.toast-confirm-btn{font-size:14px;font-weight:500;transition:all .2s ease;outline:0}.toast-overlay.show{display:block;opacity:1}.toast-spinner{display:inline-block;width:20px;height:20px;border:2px solid rgba(23,114,246,.3);border-top:2px solid #1772F6;border-radius:50%;animation:toast-spin 1s linear infinite;margin-right:10px}.toast-text{vertical-align:middle;display:inline-block}@keyframes toast-spin{to{transform:rotate(360deg)}}.toast-confirm-btn{background:#1772f6;border:none;color:#fff;padding:8px 16px;border-radius:6px;cursor:pointer}.toast-confirm-btn:hover{background:#005eea;transform:translateY(-1px)}.toast-confirm-btn:active{transform:translateY(0)}.toast-text-container{display:flex;align-items:center;gap:12px}.toast-buttons{display:flex;justify-content:center;gap:12px;margin-top:20px;width:100%}.toast-button{padding:8px 24px;border:1px solid transparent;border-radius:6px;cursor:pointer}.toast-cancel-button{background-color:#f0f2f5;color:#555;border-color:#dcdfe6}.toast-cancel-button:hover{background-color:#e4e7ed;border-color:#c8cdd4}.toast-confirm-button{background:#1772f6;color:#fff;border:none}.toast-confirm-button:hover{background:#0e56c2;transform:translateY(-1px)}.toast-confirm-button:active{transform:translateY(0)}#toast{padding:20px;min-width:280px}@media (max-width:1200px){.crop-content-area{flex-direction:column;height:auto;min-height:auto;gap:20px}.crop-example-section,.crop-preview-section,.crop-upload-section{width:100%;height:auto}.uploaded-files{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}}@media (max-width:768px){.example-history,.example-history-content,.tools-navbar{display:none}.crop-content-area{padding:15px;gap:15px}.crop-example-section,.crop-preview-section,.crop-upload-section{padding:15px;border-radius:8px}.uploaded-files{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}.file-item{border-radius:6px}.file-icon{height:100px}.file-info{padding:10px}.file-name{font-size:13px}.file-size{font-size:11px}.operate{display:none!important}.crop-upload-content .crop-upload-prompt img{width:50px;height:50px;margin-bottom:8px}.crop-upload-content .crop-upload-prompt p{font-size:14px;margin-bottom:8px}.crop-upload-content .crop-upload-prompt span{font-size:11px;width:250px}.reupload-btn{padding:12px;font-size:13px}.cs-main-btn{padding:10px 14px;font-size:13px;min-width:100px}.cs-main-btn img{width:18px;height:18px}}@media (max-width:480px){.tools-navbar{padding:0 15px;height:40px}.menu-title ul{padding:0 10px}.crop-content-area{padding:10px}.uploaded-files{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px}.file-icon{height:80px;font-size:32px}.file-info{padding:8px}.file-name{font-size:12px}.file-size{font-size:10px}.delete-btn{width:20px;height:20px;top:6px;right:6px;font-size:14px}}