@charset "UTF-8";.capture-info-overlay{position:absolute;top:0;left:0;background:#fffffff2;padding:20px;border-radius:12px;box-shadow:0 4px 15px #00000026;z-index:40;pointer-events:none;font-family:sans-serif;color:#333;max-width:300px;transition:none!important}.capture-info-overlay h3{margin:0 0 15px;font-size:16px;color:var(--primary-color)}.capture-info-overlay ul{list-style:none;padding:0;margin:0}.capture-info-overlay ul li{display:flex;justify-content:space-between;margin-bottom:8px;font-size:13px;border-bottom:1px dashed #eee;padding-bottom:4px}.capture-info-overlay ul li .label{font-weight:700;color:#666}.capture-info-overlay ul li .value{color:#111}.left{flex:1.2;position:relative;display:flex;justify-content:center;align-items:center;height:calc(100vh - 100px);border-radius:16px;overflow:hidden}.left .back{position:absolute;left:0;top:0;margin:20px;display:flex;align-items:center;gap:10px;padding:10px 20px;background-color:#333c;color:#fff;border-radius:8px;cursor:pointer;z-index:50}.left .image-container{width:min(80%,640px);aspect-ratio:1;position:relative}.left .image-container .part{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;z-index:10}@media(max-width:768px){.left .image-container .part{left:50%;top:50%;transform:translate(-50%,-50%);height:80%;width:80%}}.left .image-container .logo-wrapper{position:absolute;inset:0;z-index:20;pointer-events:none;isolation:auto}.left .image-container .logo-wrapper .moveable-control-box{opacity:0}.left .image-container .logo-wrapper:hover .moveable-control-box{opacity:1}.left .image-container .logo-target{position:absolute;top:50%;left:50%;width:150px;pointer-events:auto;transform-origin:center center;cursor:grab;transition:none!important}.left .image-container .logo-target img{width:100%;display:block;pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;transition:none!important}.left .image-container .logo-target:active{cursor:grabbing}.left .image-container :deep(.moveable){pointer-events:auto!important}.left .refresh{position:absolute;right:20px;bottom:20px;width:50px;height:50px;background:#fff;border-radius:8px;display:flex;justify-content:center;align-items:center;cursor:pointer;z-index:50;box-shadow:0 2px 10px #0000001a}.left .refresh img{width:30px}.moveable-control-box,.moveable-control-box *{transition:none!important;pointer-events:auto!important}@media(max-width:1024px){.left{flex:1;height:calc(100vh - 150px);min-height:400px;border-radius:12px}.left .back{margin:15px;padding:8px 15px;font-size:14px}.left .image-container{width:min(85%,500px)}.left .refresh{right:15px;bottom:15px;width:45px;height:45px}.left .refresh img{width:25px}.capture-info-overlay{padding:15px;max-width:250px}.capture-info-overlay h3{font-size:14px;margin-bottom:10px}.capture-info-overlay ul li{font-size:12px}}@media(max-width:767px){.left{flex:none;width:100%;height:60vh;min-height:320px;max-height:450px;border-radius:10px}.left .back{margin:10px;padding:6px 12px;font-size:12px;gap:6px}.left .back svg{width:12px}.left .image-container{width:min(90%,400px)}.left .image-container .logo-target{width:100px}.left .refresh{right:10px;bottom:10px;width:40px;height:40px;border-radius:6px}.left .refresh img{width:22px}.capture-info-overlay{inset:auto 0 0;max-width:none;padding:10px 12px;border-radius:8px 8px 0 0}.capture-info-overlay h3{font-size:11px;margin-bottom:6px}.capture-info-overlay ul{display:flex;flex-wrap:wrap;gap:8px}.capture-info-overlay ul li{font-size:10px;margin-bottom:0;border-bottom:none;padding-bottom:0;flex:0 0 auto}}.right[data-v-2b342e7e]{flex:.8;display:flex;flex-direction:column}.info[data-v-2b342e7e]{display:flex;flex-direction:column;gap:20px}.section[data-v-2b342e7e]{padding:25px;background:#fff;border-radius:20px}.section .head[data-v-2b342e7e]{display:flex;justify-content:space-between;cursor:pointer;margin-bottom:0;padding-bottom:0;border-bottom:1px solid transparent}.section .content[data-v-2b342e7e]{max-height:0;overflow:hidden;opacity:0;transition:.3s}.section.open .head[data-v-2b342e7e]{margin-bottom:15px;padding-bottom:15px;border-color:#f5f5f5}.section.open .content[data-v-2b342e7e]{max-height:600px;opacity:1}.section.open .arrow-icon[data-v-2b342e7e]{transform:rotate(180deg)}.name-section .head[data-v-2b342e7e]{padding-bottom:15px;margin-bottom:15px;border-bottom:1px solid #f5f5f5}.name-section .content[data-v-2b342e7e]{max-height:100px;opacity:1}.part-type-tabs[data-v-2b342e7e]{display:flex;gap:15px;margin-bottom:15px}.part-type-tabs span[data-v-2b342e7e]{cursor:pointer;font-size:14px;color:#666}.part-type-tabs span.active[data-v-2b342e7e]{color:var(--primary-color);font-weight:700;text-decoration:underline}.part-grid[data-v-2b342e7e]{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.part-grid .part-item[data-v-2b342e7e]{cursor:pointer;text-align:center;position:relative}.part-grid .part-item img[data-v-2b342e7e]{width:100%;border-radius:8px;border:1px solid #eee}.part-grid .part-item .part-name[data-v-2b342e7e]{font-size:10px;margin-top:5px}.part-grid .part-item svg[data-v-2b342e7e]{opacity:0;position:absolute;right:-5px;top:-5px}.part-grid .part-item:hover img[data-v-2b342e7e],.part-grid .part-item.active img[data-v-2b342e7e]{border-color:var(--primary-color)}.part-grid .part-item.active .part-name[data-v-2b342e7e]{color:var(--primary-color)}.part-grid .part-item.active svg[data-v-2b342e7e]{opacity:1}.btn-upload[data-v-2b342e7e]{display:block;width:100%;padding:10px;background:#333;color:#fff;text-align:center;border-radius:8px;cursor:pointer;font-size:14px}.logo-controls[data-v-2b342e7e]{margin-top:15px}.logo-controls .control-row[data-v-2b342e7e]{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:12px}.logo-controls input[type=range][data-v-2b342e7e]{flex:1}.logo-controls .tips[data-v-2b342e7e]{font-size:12px;color:#999;margin-top:5px}.bg-content[data-v-2b342e7e]{display:flex;gap:10px;flex-wrap:wrap}.bg-color[data-v-2b342e7e]{width:40px;height:40px;border-radius:50%;cursor:pointer;box-shadow:0 2px 5px #0000001a}.bg-color.custom-picker[data-v-2b342e7e]{position:relative;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden}.bg-color.custom-picker input[data-v-2b342e7e]{position:absolute;width:150%;height:150%;opacity:0;cursor:pointer}.bg-color.img-upload[data-v-2b342e7e]{background:#eee;display:flex;align-items:center;justify-content:center;font-size:10px;color:#666}.buttons[data-v-2b342e7e]{margin-top:40px;display:flex;gap:20px}.buttons .btn[data-v-2b342e7e]{height:70px;border-radius:20px;display:flex;justify-content:center;align-items:center;gap:10px;font-size:18px;cursor:pointer}.buttons .btn.inquiry[data-v-2b342e7e]{width:35%;background:#fff;color:#333;border:1px solid #eee}.buttons .btn.inquiry img[data-v-2b342e7e]{width:23px}.buttons .btn.save[data-v-2b342e7e]{flex:1;background:#333;color:#fff}.buttons .btn.save img[data-v-2b342e7e]{width:23px}.blend-select[data-v-2b342e7e]{padding:5px;border-radius:4px;border:1px solid #ddd;font-size:12px}@media(max-width:1024px){.right[data-v-2b342e7e]{flex:1}.info[data-v-2b342e7e]{gap:15px}.section[data-v-2b342e7e]{padding:20px;border-radius:15px}.section .head .font-size-20-medium[data-v-2b342e7e]{font-size:18px}.section.open .content[data-v-2b342e7e]{max-height:500px}.part-type-tabs[data-v-2b342e7e]{gap:12px}.part-type-tabs span[data-v-2b342e7e]{font-size:13px}.part-grid[data-v-2b342e7e]{grid-template-columns:repeat(4,1fr);gap:8px}.part-grid .part-item .part-name[data-v-2b342e7e]{font-size:9px}.buttons[data-v-2b342e7e]{margin-top:25px;gap:15px}.buttons .btn[data-v-2b342e7e]{height:60px;border-radius:15px;font-size:16px}}@media(max-width:767px){.right[data-v-2b342e7e]{flex:none;width:100%}.info[data-v-2b342e7e]{gap:12px}.section[data-v-2b342e7e]{padding:15px;border-radius:12px}.section .head .font-size-20-medium[data-v-2b342e7e]{font-size:16px}.section.open .head[data-v-2b342e7e]{margin-bottom:12px;padding-bottom:12px}.section.open .content[data-v-2b342e7e]{max-height:450px}.name-section .head[data-v-2b342e7e]{flex-direction:column;gap:5px;align-items:flex-start}.name-section .name-head[data-v-2b342e7e]{font-size:14px}.name-section .name-sku[data-v-2b342e7e]{font-size:12px}.part-type-tabs[data-v-2b342e7e]{gap:8px;flex-wrap:wrap}.part-type-tabs span[data-v-2b342e7e]{font-size:12px;padding:4px 0}.part-grid[data-v-2b342e7e]{grid-template-columns:repeat(3,1fr);gap:8px}.part-grid .part-item img[data-v-2b342e7e]{border-radius:6px}.part-grid .part-item .part-name[data-v-2b342e7e]{font-size:9px;margin-top:3px}.part-grid .part-item svg[data-v-2b342e7e]{width:16px;height:16px;right:-3px;top:-3px}.btn-upload[data-v-2b342e7e]{padding:12px 10px;font-size:13px;border-radius:6px}.logo-controls[data-v-2b342e7e]{margin-top:12px}.logo-controls .control-row[data-v-2b342e7e]{flex-direction:column;align-items:flex-start;gap:5px}.logo-controls .control-row span[data-v-2b342e7e]{font-size:12px}.logo-controls .control-row input[type=range][data-v-2b342e7e]{width:100%}.logo-controls .tips[data-v-2b342e7e]{font-size:11px;margin-top:8px}.bg-content[data-v-2b342e7e]{gap:8px}.bg-color[data-v-2b342e7e]{width:35px;height:35px}.bg-color.img-upload[data-v-2b342e7e]{font-size:9px}.buttons[data-v-2b342e7e]{margin-top:20px;gap:10px}.buttons .btn[data-v-2b342e7e]{height:50px;border-radius:12px;font-size:14px;gap:8px}.buttons .btn.inquiry[data-v-2b342e7e]{width:40%}.buttons .btn.inquiry img[data-v-2b342e7e],.buttons .btn.save img[data-v-2b342e7e]{width:18px}}:root{--primary-color: #da291c;--text-main: #333333;--text-sub: #666666;--bg-white: #ffffff;--border-color: #f5f5f5;--transition-speed: .3s}body{margin:0;background-color:#f6f6f6;font-family:Helvetica Neue,Arial,sans-serif}*{box-sizing:border-box;transition:all var(--transition-speed) ease}a{text-decoration:none}.font-size-20-medium{font-weight:500;font-size:20px;color:var(--text-main)}.main-content{padding:50px 15px;margin:0 auto;width:min(100%,1520px);min-height:100vh;display:flex;justify-content:space-between;gap:40px}.state-container{height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px;color:#666}.state-container .loader{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid var(--primary-color);border-radius:50%;animation:spin 1s linear infinite}.state-container .error-icon{font-size:48px}.state-container .error-msg{color:var(--primary-color);font-weight:700}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(max-width:1024px){.main-content{padding:30px 15px;gap:25px}}@media(max-width:767px){.main-content{flex-direction:column;padding:15px 10px;gap:20px}}