:root{--upload-primary: #6366f1;--upload-primary-hover: #4f46e5;--upload-success: #10b981;--upload-warning: #f59e0b;--upload-gradient-primary: linear-gradient(135deg, #667eea 0%, #764ba2 100%);--upload-gradient-glass: linear-gradient(135deg, rgba(255,255,255,.1) 0%, rgba(255,255,255,.05) 100%);--upload-white: #ffffff;--upload-gray-50: #f8fafc;--upload-gray-100: #f1f5f9;--upload-gray-200: #e2e8f0;--upload-gray-300: #cbd5e1;--upload-gray-400: #94a3b8;--upload-gray-500: #64748b;--upload-gray-600: #475569;--upload-gray-700: #334155;--upload-gray-800: #1e293b;--upload-gray-900: #0f172a;--upload-space-2: 8px;--upload-space-3: 12px;--upload-space-4: 16px;--upload-space-5: 20px;--upload-space-6: 24px;--upload-space-8: 32px;--upload-space-10: 40px;--upload-space-12: 48px;--upload-space-16: 64px;--upload-radius: 8px;--upload-radius-lg: 16px;--upload-radius-xl: 20px;--upload-radius-full: 9999px;--upload-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px 0 rgba(0, 0, 0, .06);--upload-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--upload-shadow-md: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--upload-shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--upload-shadow-colored: 0 10px 25px -5px rgba(99, 102, 241, .3);--upload-transition: .2s cubic-bezier(.4, 0, .2, 1)}.file-upload-wrapper{position:relative;overflow:hidden}.file-upload-wrapper:before{display:none}.upload-mode-selector{display:flex;gap:var(--upload-space-4);margin-bottom:var(--upload-space-6)}.mode-option{flex:1;position:relative}.mode-option input[type=radio]{position:absolute;opacity:0;width:0;height:0}.mode-option label{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--upload-space-3);padding:var(--upload-space-4) var(--upload-space-6);min-width:120px;border:2px solid var(--upload-gray-200);border-radius:var(--upload-radius);background:var(--upload-white);cursor:pointer;transition:all var(--upload-transition);font-weight:500;font-size:1.1rem;color:var(--upload-gray-700);text-align:center}.mode-option label .mode-icon{opacity:.5;transition:opacity var(--upload-transition);flex-shrink:0;width:auto;height:25px}.mode-option label span{display:block}.mode-option label:hover{border-color:var(--upload-primary);background:var(--upload-gray-50);transform:translateY(-1px)}.mode-option input:checked+label{border-color:var(--upload-primary);background:#6366f11a;color:var(--upload-primary);font-weight:600}.mode-option input:checked+label .mode-icon{opacity:1}.mode-option label:hover .mode-icon{opacity:.7}.upload-zone{margin-bottom:var(--upload-space-6)}.upload-zone h3{font-size:1rem;font-weight:600;color:var(--upload-gray-800);margin-bottom:var(--upload-space-3)}.upload-dropzone{border:2px dashed var(--upload-gray-300);border-radius:var(--upload-radius-lg);padding:var(--upload-space-16);text-align:center;background:var(--upload-gray-50);transition:all var(--upload-transition);cursor:pointer;margin-bottom:var(--upload-space-6);position:relative;overflow:hidden}.upload-dropzone:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:var(--upload-gradient-primary);opacity:0;transform:rotate(45deg) scale(0);transition:var(--upload-transition);z-index:0}.upload-dropzone:hover:before,.upload-dropzone.drag-over:before{opacity:.05;transform:rotate(45deg) scale(1)}.upload-dropzone:hover,.upload-dropzone.drag-over{border-color:var(--upload-primary);background:#6366f10d;transform:translateY(-2px)}.dropzone-content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:var(--upload-space-4)}.upload-icon{font-size:3rem;margin-bottom:2px;filter:drop-shadow(0 4px 6px rgba(0,0,0,.1))}.upload-text{color:var(--upload-gray-700);line-height:1.6}.upload-text strong{font-size:1.125rem;color:var(--upload-gray-900);display:block;margin-bottom:var(--upload-space-2)}.upload-text .file-formats{font-size:.875rem;color:var(--upload-gray-500);margin-top:var(--upload-space-2)}.upload-button-container{margin:var(--upload-space-4) 0}.upload-browse-btn,.browse-link{display:inline-flex;align-items:center;gap:var(--upload-space-2);padding:var(--upload-space-4) var(--upload-space-6);background:var(--upload-gradient-primary);color:#fff;border:none;border-radius:var(--upload-radius);font-weight:600;font-size:.938rem;cursor:pointer;transition:all var(--upload-transition);box-shadow:var(--upload-shadow-colored)}.upload-browse-btn:hover,.browse-link:hover{transform:translateY(-2px);box-shadow:0 12px 28px -5px #6366f166}.upload-browse-btn .btn-icon{display:inline-flex;align-items:center}.browse-link{padding:0;background:none;box-shadow:none;color:var(--upload-primary);text-decoration:underline;font-weight:500}.browse-link:hover{color:var(--upload-primary-hover);transform:none;box-shadow:none}.upload-file-input{display:none}.sides-info{padding:var(--upload-space-4);background:#6366f11a;border:1px solid var(--upload-primary);border-radius:var(--upload-radius);color:var(--upload-gray-800);font-size:.875rem;margin-bottom:var(--upload-space-6);display:flex;align-items:center;gap:var(--upload-space-3)}.sides-info:before{content:"\2139\fe0f";font-size:1.25rem}.upload-preview-section{margin-top:var(--upload-space-6)}.preview-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--upload-space-6)}.preview-item{background:var(--upload-white);border:1px solid var(--upload-gray-200);border-radius:var(--upload-radius-lg);padding:var(--upload-space-4);box-shadow:var(--upload-shadow);transition:all var(--upload-transition)}.preview-item:hover{box-shadow:var(--upload-shadow-md);transform:translateY(-2px)}.preview-label{font-size:.875rem;font-weight:600;color:var(--upload-gray-700);margin-bottom:var(--upload-space-3);display:flex;align-items:center;gap:var(--upload-space-2)}.preview-label:before{content:"";width:8px;height:8px;border-radius:var(--upload-radius-full);background:var(--upload-success);box-shadow:0 0 0 2px #10b98133}.preview-image-container{position:relative;border-radius:var(--upload-radius);overflow:hidden;background:var(--upload-gray-50);aspect-ratio:1}.preview-image{width:100%;height:100%;object-fit:contain;display:block}.preview-actions{margin-top:var(--upload-space-3);display:flex;gap:var(--upload-space-2)}.preview-action-btn{flex:1;padding:var(--upload-space-2) var(--upload-space-3);border:1px solid var(--upload-gray-300);border-radius:var(--upload-radius);background:var(--upload-white);color:var(--upload-gray-700);font-size:.875rem;cursor:pointer;transition:all var(--upload-transition)}.preview-action-btn:hover{border-color:var(--upload-primary);color:var(--upload-primary);transform:translateY(-1px)}.upload-progress{margin-top:var(--upload-space-4);padding:var(--upload-space-4);background:var(--upload-gray-50);border-radius:var(--upload-radius);border:1px solid var(--upload-gray-200)}.progress-label{font-size:.875rem;color:var(--upload-gray-700);margin-bottom:var(--upload-space-2);display:flex;align-items:center;justify-content:space-between}.progress-percentage{font-weight:600;color:var(--upload-primary)}.progress-bar-container{height:8px;background:var(--upload-gray-200);border-radius:var(--upload-radius-full);overflow:hidden;position:relative}.progress-fill{height:100%;background:var(--upload-gradient-primary);border-radius:var(--upload-radius-full);transition:width var(--upload-transition);position:relative;overflow:hidden}.progress-fill:after{content:"";position:absolute;top:0;left:0;bottom:0;right:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);animation:shimmer 1.5s infinite}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.upload-errors{margin-top:var(--upload-space-4);padding:var(--upload-space-4);background:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:var(--upload-radius);color:#991b1b;font-size:.875rem;line-height:1.6}.upload-errors ul{margin:0;padding-left:var(--upload-space-5)}.upload-errors li{margin-bottom:var(--upload-space-2)}.upload-errors li:last-child{margin-bottom:0}.send-later-notice{padding:var(--upload-space-6) var(--upload-space-8);background:linear-gradient(135deg,#a855f71a,#ec48991a);border:2px solid transparent;border-radius:var(--upload-radius-lg);background-clip:padding-box;position:relative;color:#7c3aed;font-size:1.25rem;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:var(--upload-space-3);max-width:600px;margin:0 auto}.send-later-notice:before{content:"";display:block;width:32px;height:32px;flex-shrink:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='94.609' height='88.292' viewBox='0 0 94.609 88.292'%3E%3Cpath fill='%237c3aed' d='M79.521,58.471c.621-1.531,2.371-2.273,3.902-1.652s2.273,2.371,1.652,3.902c-3.324,8.203-9.047,15.18-16.289,20.059-7.043,4.742-15.52,7.512-24.637,7.512-2.191-.008-4.285-.16-6.453-.469-3.902-.73-2.969-6.414.895-5.934,1.895.27,3.656.375,5.562.402h.008c7.883,0,15.207-2.391,21.277-6.48,6.266-4.223,11.215-10.254,14.086-17.344l-.003.004ZM7.259,53.909c-.871-3.492-6.356-2.684-5.867,1.23.434,2.035,1.336,4.465,2.16,6.387,1.691,3.621,6.981,1.301,5.512-2.367-.734-1.715-1.324-3.445-1.809-5.25h.004ZM18.728,72.593c-1.023-.938-2.688-1-3.773-.164-1.555,1.164-1.609,3.363-.203,4.656,1.621,1.441,3.285,2.715,5.086,3.922,3.223,2.074,6.512-2.551,3.438-4.914-1.633-1.141-3.059-2.168-4.551-3.5h.004ZM41.15,17.07c0-1.656,1.344-3,3-3s3,1.344,3,3v27.074c0,1.184-.688,2.207-1.68,2.695l-17.168,9.91c-1.43.828-3.262.34-4.09-1.09-.828-1.43-.34-3.262,1.09-4.09l15.848-9.148v-25.351ZM74.595,37.832c-1.176-1.156-1.191-3.055-.035-4.23s3.055-1.191,4.23-.035l2.676,2.629c-1.559-7.344-5.227-13.906-10.344-19.023-6.902-6.902-16.441-11.172-26.973-11.172s-20.074,4.269-26.977,11.172c-6.902,6.902-11.172,16.441-11.172,26.973,0,1.656-1.344,3-3,3s-3-1.344-3-3c0-12.191,4.941-23.23,12.93-31.215C20.918,4.942,31.957,0,44.149,0s23.23,4.941,31.215,12.93c5.949,5.949,10.207,13.586,11.996,22.133l1.695-2.762c.867-1.41,2.715-1.852,4.125-.984,1.41.867,1.852,2.715.984,4.125l-6.27,10.195-.035.062-.012.016c-.527.855-1.477,1.43-2.555,1.43-.895,0-1.699-.395-2.25-1.016l-8.453-8.297h.004Z'/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;background-position:center}.send-later-notice:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:var(--upload-radius-lg);padding:2px;background:linear-gradient(135deg,#a855f7,#ec4899);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;pointer-events:none;z-index:-1}.send-later-notice p{max-width:280px}@media (max-width: 768px){.file-upload-wrapper{padding:var(--upload-space-6);margin:var(--upload-space-3) 0}.upload-mode-selector{flex-direction:column;gap:var(--upload-space-3)}.upload-dropzone{padding:var(--upload-space-12)}.upload-icon{font-size:2rem}.upload-text strong{font-size:1rem}.preview-grid{grid-template-columns:1fr}}.unified-feedback-toast .toast-content{display:flex;flex-direction:column;gap:1rem}.unified-feedback-toast .toast-message{font-size:14px;line-height:1.5}.unified-feedback-toast .toast-preview-container{display:flex;gap:.5rem;justify-content:center;align-items:center}.unified-feedback-toast .toast-upload-preview{max-width:80px;max-height:80px;border-radius:4px;border:1px solid rgba(255,255,255,.2);object-fit:contain}.unified-feedback-toast.toast-bar .toast-content{flex-direction:row;gap:1.5rem;align-items:center}.unified-feedback-toast.toast-bar .toast-preview-container{gap:.75rem}.unified-feedback-toast.toast-bar .toast-upload-preview{max-width:60px;max-height:60px}.upload-progress-header{margin-bottom:var(--upload-space-6);padding:var(--upload-space-4);background:var(--upload-gray-50);border-radius:var(--upload-radius-lg)}.progress-steps{display:flex;align-items:center;justify-content:center;gap:var(--upload-space-2)}.progress-step{display:flex;flex-direction:column;align-items:center;gap:var(--upload-space-2);transition:all var(--upload-transition)}.progress-step .step-icon{width:40px;height:40px;border-radius:var(--upload-radius-full);display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.938rem;background:var(--upload-white);border:2px solid var(--upload-gray-300);color:var(--upload-gray-500);transition:all var(--upload-transition)}.progress-step.active .step-icon{background:var(--upload-primary);border-color:var(--upload-primary);color:var(--upload-white);box-shadow:0 0 0 4px #6366f11a}.progress-step.complete .step-icon{background:var(--upload-success);border-color:var(--upload-success);color:var(--upload-white)}.progress-step .step-label{font-size:.813rem;font-weight:500;color:var(--upload-gray-600)}.progress-step.active .step-label{color:var(--upload-primary)}.progress-step.complete .step-label{color:var(--upload-success)}.progress-connector{width:60px;height:2px;background:var(--upload-gray-300);border-radius:1px;transition:background var(--upload-transition)}.progress-connector.complete{background:var(--upload-success)}.upload-preview-grid{display:grid;gap:var(--upload-space-6);margin-bottom:var(--upload-space-6)}.upload-preview-grid.one-side{grid-template-columns:1fr;max-width:400px;margin-left:auto;margin-right:auto}.upload-preview-grid.two-sides{grid-template-columns:repeat(2,1fr)}@media (max-width: 768px){.upload-preview-grid.two-sides{grid-template-columns:1fr}}.preview-card{background:var(--upload-white);border:2px solid var(--upload-gray-200);border-radius:var(--upload-radius-lg);overflow:hidden;transition:all var(--upload-transition)}.preview-card-header{display:flex;align-items:center;justify-content:space-between;padding:var(--upload-space-4);background:var(--upload-gray-50);border-bottom:1px solid var(--upload-gray-200)}.preview-label{font-weight:600;font-size:.938rem;color:var(--upload-gray-700)}.preview-remove-btn{width:32px;height:32px;border-radius:var(--upload-radius);border:1px solid var(--upload-gray-300);background:var(--upload-white);color:var(--upload-gray-600);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--upload-transition)}.preview-remove-btn:hover{background:#fee2e2;border-color:#fca5a5;color:#dc2626}.preview-card-image{position:relative;aspect-ratio:1;background:var(--upload-gray-100);display:flex;align-items:center;justify-content:center;overflow:hidden}.preview-card-image img{width:100%;height:100%;object-fit:contain}.preview-status{position:absolute;top:var(--upload-space-4);right:var(--upload-space-4);width:48px;height:48px;border-radius:var(--upload-radius-full);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.5rem;box-shadow:var(--upload-shadow-lg);transition:all var(--upload-transition)}.preview-status.uploading{background:var(--upload-primary);color:var(--upload-white)}.preview-status.success{background:var(--upload-success);color:var(--upload-white);animation:scaleIn .3s cubic-bezier(.175,.885,.32,1.275)}.preview-status.error{background:#ef4444;color:var(--upload-white)}@keyframes scaleIn{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.spinner{width:24px;height:24px;border:3px solid rgba(255,255,255,.3);border-top-color:var(--upload-white);border-radius:var(--upload-radius-full);animation:spin .8s linear infinite}.preview-card-footer{padding:var(--upload-space-4);border-top:1px solid var(--upload-gray-200)}.preview-filename{display:block;font-size:.875rem;color:var(--upload-gray-700);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:var(--upload-space-2)}.preview-progress-bar{height:4px;background:var(--upload-gray-200);border-radius:2px;overflow:hidden;margin-top:var(--upload-space-2)}.preview-progress-fill{height:100%;background:var(--upload-gradient-primary);border-radius:2px;transition:width .3s ease}.upload-zone-unified{margin-top:var(--upload-space-4)}.upload-side-indicator{text-align:center;margin-bottom:var(--upload-space-4)}.upload-step-label{display:inline-block;padding:var(--upload-space-2) var(--upload-space-5);background:var(--upload-gradient-primary);color:var(--upload-white);font-weight:600;font-size:.938rem;border-radius:var(--upload-radius-full);box-shadow:var(--upload-shadow-colored)}.upload-complete-message{text-align:center;padding:var(--upload-space-12);background:linear-gradient(135deg,#10b9810d,#0596690d);border:2px dashed var(--upload-success);border-radius:var(--upload-radius-xl)}.upload-complete-message svg{color:var(--upload-success);margin-bottom:var(--upload-space-4);animation:scaleIn .5s cubic-bezier(.175,.885,.32,1.275)}.upload-complete-message h3{font-size:1.5rem;font-weight:700;color:var(--upload-gray-900);margin:0 0 var(--upload-space-2) 0}.upload-complete-message p{font-size:1rem;color:var(--upload-gray-600);margin:0}.preview-thumbnail-large{margin-bottom:var(--upload-space-6);border-radius:var(--upload-radius-lg);overflow:hidden;background:var(--upload-gray-100);aspect-ratio:1;display:flex;align-items:center;justify-content:center;box-shadow:var(--upload-shadow-md)}.preview-thumbnail-large img{width:100%;height:100%;object-fit:contain}.uploaded-files-list{margin-bottom:var(--upload-space-4);display:flex;flex-direction:column;gap:var(--upload-space-3)}.dropzone-overlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#6366f10d;border:2px dashed var(--upload-primary);border-radius:var(--upload-radius);opacity:0;transition:opacity var(--upload-transition);pointer-events:none}.dropzone-overlay .upload-icon{color:var(--upload-primary);opacity:.7}.uploaded-file-item.drag-over .dropzone-overlay{opacity:1}.file-dropzone-hint{font-size:.813rem;color:var(--upload-gray-500);font-style:italic;margin:0 var(--upload-space-2)}.uploaded-file-item{display:flex;align-items:center;gap:var(--upload-space-4);padding:var(--upload-space-4);background:var(--upload-white);border:2px solid var(--upload-gray-200);border-radius:var(--upload-radius-lg);transition:all var(--upload-transition)}.uploaded-file-item:hover{border-color:var(--upload-gray-300);box-shadow:var(--upload-shadow-sm)}.uploaded-file-item.uploading{background:linear-gradient(135deg,#6366f105,#8b5cf605);border-color:var(--upload-primary)}.file-thumbnail{width:80px;height:80px;flex-shrink:0;border-radius:var(--upload-radius);overflow:hidden;background:var(--upload-gray-100);display:flex;align-items:center;justify-content:center}.file-thumbnail img{width:100%;height:100%;object-fit:contain}.file-info{flex:1;min-width:0}.file-header{display:flex;align-items:center;gap:var(--upload-space-2);margin-bottom:var(--upload-space-2)}.file-check{color:var(--upload-success);flex-shrink:0}.file-name{font-weight:600;font-size:.938rem;color:var(--upload-gray-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-meta{display:flex;flex-wrap:wrap;gap:var(--upload-space-3);font-size:.813rem;color:var(--upload-gray-600)}.file-side{font-weight:600}.file-status{color:var(--upload-success)}.file-progress-bar{position:relative;height:8px;background:var(--upload-gray-200);border-radius:4px;overflow:hidden;margin-top:var(--upload-space-2);width:100%}.file-progress-fill{display:block!important;position:absolute;top:0;left:0;height:100%;width:0%;background:linear-gradient(90deg,#6366f1,#8b5cf6);border-radius:4px;transition:width .3s cubic-bezier(.4,0,.2,1);overflow:hidden;z-index:1}.file-progress-text{margin-top:var(--upload-space-2);font-size:.875rem;font-weight:600;color:var(--upload-primary)}.file-remove-btn{flex-shrink:0;width:40px;height:40px;border-radius:var(--upload-radius);border:1px solid var(--upload-gray-300);background:var(--upload-white);color:var(--upload-gray-600);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--upload-transition)}.file-remove-btn:hover{background:#fee2e2;border-color:#fca5a5;color:#dc2626;transform:scale(1.05)}@media (max-width: 640px){.uploaded-file-item{flex-direction:column;text-align:center}.file-thumbnail{width:120px;height:120px}.file-header,.file-meta{justify-content:center}}.uploaded-file-item.empty{background:linear-gradient(135deg,#6366f108,#8b5cf608);border-style:dashed;border-color:var(--upload-gray-300);transition:all var(--upload-transition)}.uploaded-file-item.empty:hover{border-color:var(--upload-primary);background:linear-gradient(135deg,#6366f10d,#8b5cf60d)}.file-thumbnail.skeleton{background:var(--upload-gray-200);position:relative;overflow:hidden}.file-thumbnail.skeleton:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);animation:shimmer 2s infinite}@keyframes shimmer{0%{left:-100%}to{left:100%}}.skeleton-shape{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--upload-gray-300);position:relative}.skeleton-shape.circle-shape{border-radius:50%;aspect-ratio:1}.skeleton-shape.classic-shape{border-radius:20%}.skeleton-shape.longboard-shape{border-radius:40px}.skeleton-shape.longboard-mini{border-radius:30px}.skeleton-shape:after{content:"";width:30px;height:30px;background:var(--upload-gray-400);mask:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6C4.9 2 4 2.9 4 4V20C4 21.1 4.89 22 5.99 22H18C19.1 22 20 21.1 20 20V8L14 2Z"/><polyline points="14,2 14,8 20,8"/></svg>') center/contain no-repeat}.uploaded-file-item.empty{position:relative;display:flex;justify-content:space-between;align-items:center;padding:var(--upload-space-5)}.file-empty-left{display:flex;align-items:center;gap:var(--upload-space-4)}.file-empty-info{display:flex;flex-direction:column;gap:var(--upload-space-1);align-items:flex-start}.upload-row-label{font-size:1rem;font-weight:600;color:var(--upload-gray-900);margin:0}.file-formats-inline{font-size:.813rem;color:var(--upload-gray-500);text-align:left}.file-empty-right{display:flex;flex-direction:column;align-items:center;gap:var(--upload-space-2)}.file-upload-trigger{display:flex;align-items:center;justify-content:center;gap:var(--upload-space-2);padding:var(--upload-space-3) var(--upload-space-5);background:var(--upload-white);color:var(--upload-gray-700);border:2px solid var(--upload-gray-300);border-radius:var(--upload-radius);font-size:.938rem;font-weight:600;cursor:pointer;transition:all var(--upload-transition)}.file-upload-trigger:hover{background:var(--upload-gray-50);border-color:var(--upload-primary);color:var(--upload-primary)}.file-upload-trigger:active{transform:scale(.98)}.file-upload-trigger .upload-icon{width:24px;height:18px;flex-shrink:0}.file-actions{display:flex;gap:var(--upload-space-2);flex-shrink:0}.file-replace-btn{display:flex;align-items:center;gap:var(--upload-space-2);padding:var(--upload-space-2) var(--upload-space-3);background:var(--upload-white);color:var(--upload-primary);border:1px solid var(--upload-primary);border-radius:var(--upload-radius);font-weight:600;font-size:.875rem;cursor:pointer;transition:all var(--upload-transition)}.file-replace-btn:hover{background:var(--upload-primary);color:var(--upload-white);transform:translateY(-2px);box-shadow:var(--upload-shadow-sm)}.file-replace-btn svg{flex-shrink:0}.uploaded-file-item.success{animation:successPulse .5s ease}@keyframes successPulse{0%{transform:scale(1)}50%{transform:scale(1.02)}to{transform:scale(1)}}.file-progress-fill:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);animation:progressShimmer 1.5s infinite;z-index:2}@keyframes progressShimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.uploaded-files-list{transition:all var(--upload-transition)}.uploaded-file-item{animation:fadeInUp .3s ease}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.large-preview-area{margin-bottom:var(--upload-space-6);padding:var(--upload-space-6);background:var(--upload-white);border:2px solid var(--upload-gray-200);border-radius:var(--upload-radius-lg);animation:fadeInUp .4s ease}.preview-header{display:flex;justify-content:center;align-items:center;margin-bottom:var(--upload-space-4);padding-bottom:var(--upload-space-4);border-bottom:2px solid var(--upload-gray-200)}.preview-footer{display:flex;justify-content:center;align-items:center;margin-top:var(--upload-space-4);padding-top:var(--upload-space-4);border-top:2px solid var(--upload-gray-200)}.preview-title{font-size:1.25rem;font-weight:700;color:var(--upload-gray-900);margin:0}.preview-tabs{display:flex;gap:var(--upload-space-2);background:var(--upload-gray-100);padding:4px;border-radius:var(--upload-radius)}.preview-tab{padding:var(--upload-space-2) var(--upload-space-4);background:transparent;color:var(--upload-gray-600);border:none;border-radius:calc(var(--upload-radius) - 2px);font-weight:600;font-size:1.1rem;cursor:pointer;transition:all var(--upload-transition);white-space:nowrap}.preview-tab:hover{background:var(--upload-white);color:var(--upload-gray-900)}.preview-tab.active{background:var(--upload-white);color:var(--upload-primary);box-shadow:var(--upload-shadow-sm)}.large-preview-container{display:flex;justify-content:center;align-items:center;min-height:400px;padding:25px;background:var(--upload-gray-50);border-radius:var(--upload-radius);position:relative;overflow:hidden}.large-preview-image{max-width:100%;max-height:500px;height:auto;object-fit:contain;animation:fadeIn .5s ease;-webkit-user-select:none;user-select:none}.static-preview{display:block}.large-preview-skeleton{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;height:400px;position:relative;gap:var(--upload-space-4)}.large-preview-skeleton .skeleton-shape{width:300px;height:300px;background:var(--upload-gray-300);position:relative;overflow:hidden}.large-preview-skeleton .skeleton-shape:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);animation:shimmer 2s infinite}.skeleton-instructions{display:flex;flex-direction:column;align-items:center;gap:var(--upload-space-2);max-width:400px;text-align:center}.skeleton-title{font-size:2rem;font-weight:700;color:var(--upload-gray-900);margin:0}.skeleton-description{font-size:1.1rem;color:var(--upload-gray-600);font-weight:500;margin:0;line-height:1.5}.skeleton-formats{font-size:.875rem;color:var(--upload-gray-500);margin:0;padding-top:var(--upload-space-2);border-top:1px solid var(--upload-gray-200)}.preview-header-actions{display:flex;gap:var(--upload-space-2);margin-left:auto}.preview-action-btn{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border:1px solid var(--upload-gray-300);border-radius:var(--upload-radius);background:var(--upload-white);color:var(--upload-gray-700);cursor:pointer;transition:all var(--upload-transition)}.preview-action-btn:hover:not(:disabled){border-color:var(--upload-primary);color:var(--upload-primary);background:#6366f10d;transform:translateY(-1px)}.preview-action-btn:disabled{opacity:.4;cursor:not-allowed}.preview-action-btn:active:not(:disabled){transform:translateY(0)}.transformation-controls{margin-top:var(--upload-space-4);padding:var(--upload-space-4);background:var(--upload-gray-50);border:1px solid var(--upload-gray-200);border-radius:var(--upload-radius);display:flex;flex-direction:column;gap:var(--upload-space-3)}.transform-control-group{display:flex;flex-direction:column;gap:var(--upload-space-2)}.transform-label{display:flex;align-items:center;gap:var(--upload-space-2);font-size:.875rem;font-weight:600;color:var(--upload-gray-700)}.transform-label svg{flex-shrink:0}.transform-value{margin-left:auto;color:var(--upload-primary);font-variant-numeric:tabular-nums}.transform-slider{width:100%;height:6px;border-radius:3px;background:var(--upload-gray-200);outline:none;-webkit-appearance:none;appearance:none}.transform-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:var(--upload-gradient-primary);cursor:pointer;box-shadow:var(--upload-shadow-sm);transition:all var(--upload-transition)}.transform-slider::-webkit-slider-thumb:hover{transform:scale(1.1);box-shadow:var(--upload-shadow-colored)}.transform-slider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--upload-gradient-primary);cursor:pointer;border:none;box-shadow:var(--upload-shadow-sm);transition:all var(--upload-transition)}.transform-slider::-moz-range-thumb:hover{transform:scale(1.1);box-shadow:var(--upload-shadow-colored)}.transform-hint{font-size:.75rem;color:var(--upload-gray-500);font-style:italic;text-align:center;padding:var(--upload-space-2);background:var(--upload-white);border-radius:var(--upload-radius)}.overlay-toggles{display:flex;gap:var(--upload-space-4);justify-content:center;padding-top:var(--upload-space-2);border-top:1px solid var(--upload-gray-200)}.overlay-toggle{display:flex;align-items:center;gap:var(--upload-space-2);font-size:.875rem;font-weight:500;color:var(--upload-gray-700);cursor:pointer;-webkit-user-select:none;user-select:none}.overlay-checkbox{width:18px;height:18px;border:2px solid var(--upload-gray-300);border-radius:4px;cursor:pointer;transition:all var(--upload-transition);appearance:none;-webkit-appearance:none;background:var(--upload-white);position:relative}.overlay-checkbox:checked{background:var(--upload-primary);border-color:var(--upload-primary)}.overlay-checkbox:checked:after{content:"";position:absolute;top:2px;left:5px;width:4px;height:8px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.overlay-toggle:hover .overlay-checkbox:not(:checked){border-color:var(--upload-primary);background:#6366f10d}.large-preview-container.interactive{cursor:grab}.large-preview-container.interactive.dragging{cursor:grabbing}.preview-canvas-stack{position:relative;width:100%;min-height:400px;max-height:500px;height:500px;display:flex;align-items:center;justify-content:center}.mask-outline-layer{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none;z-index:2}.artwork-layer{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain;transform-origin:center center;will-change:transform;backface-visibility:hidden;-webkit-font-smoothing:subpixel-antialiased;-webkit-user-select:none;user-select:none;pointer-events:none;z-index:1}.final-preview-layer{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain;-webkit-user-select:none;user-select:none;pointer-events:none;z-index:3}.resolution-warning{position:absolute;bottom:var(--upload-space-4);left:50%;transform:translate(-50%);display:flex;align-items:center;gap:var(--upload-space-2);padding:var(--upload-space-3) var(--upload-space-4);background:#f59e0bf2;color:#fff;font-size:.813rem;font-weight:600;border-radius:var(--upload-radius);box-shadow:var(--upload-shadow-lg);max-width:90%;text-align:center;animation:slideUp .3s ease}.resolution-warning svg{flex-shrink:0}@keyframes slideUp{0%{opacity:0;transform:translate(-50%) translateY(10px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.background-picker-group{background:var(--upload-white);border:1px solid var(--upload-gray-200);border-radius:var(--upload-radius);padding:var(--upload-space-4)}.bg-picker-tabs{display:flex;gap:var(--upload-space-2);margin-top:var(--upload-space-3);margin-bottom:var(--upload-space-3);background:var(--upload-gray-100);padding:4px;border-radius:var(--upload-radius);position:relative}.bg-tab{flex:1;padding:var(--upload-space-2) var(--upload-space-3);background:transparent;border:none;border-radius:6px;font-size:.875rem;font-weight:600;color:var(--upload-gray-600);cursor:pointer;transition:all var(--upload-transition);position:relative;z-index:1}.bg-tab:hover{color:var(--upload-gray-900)}.bg-tab.active{background:var(--upload-white);color:var(--upload-primary);box-shadow:0 1px 3px #0000001a}.bg-tab-clear{width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:6px;color:var(--upload-gray-500);cursor:pointer;transition:all var(--upload-transition)}.bg-tab-clear:hover{background:#ef44441a;color:#ef4444}.bg-tab-content{display:none}.bg-tab-content.active{display:block}.color-swatches-compact{display:grid;grid-template-columns:repeat(auto-fill,minmax(32px,1fr));gap:var(--upload-space-2);padding:var(--upload-space-2);background:var(--upload-gray-50);border-radius:var(--upload-radius);margin-bottom:var(--upload-space-2)}.color-swatch-compact{width:32px;height:32px;border:2px solid transparent;border-radius:50%;cursor:pointer;transition:all var(--upload-transition);position:relative;overflow:visible;padding:0}.color-swatch-compact:hover{transform:scale(1.15);box-shadow:0 4px 12px #00000026;z-index:2}.color-swatch-compact.active{border-color:var(--upload-primary);border-width:3px;box-shadow:0 0 0 3px #6366f133}.color-swatch-compact.active:after{content:"";position:absolute;bottom:-2px;right:-2px;width:12px;height:12px;background:var(--upload-primary);border:2px solid white;border-radius:50%;box-shadow:0 2px 4px #0003}.color-swatch-compact.custom{background:var(--upload-white);border:2px dashed var(--upload-gray-300);display:flex;align-items:center;justify-content:center;color:var(--upload-gray-500)}.color-swatch-compact.custom:hover{border-color:var(--upload-primary);color:var(--upload-primary);background:#6366f10d}.color-input-hidden{display:none}.gradient-type-selector{margin-bottom:var(--upload-space-3)}.gradient-type-select{width:100%;padding:var(--upload-space-2) var(--upload-space-3);background:var(--upload-white);border:1px solid var(--upload-gray-300);border-radius:var(--upload-radius);font-size:.875rem;color:var(--upload-gray-700);cursor:pointer;transition:all var(--upload-transition)}.gradient-type-select:hover{border-color:var(--upload-primary)}.gradient-type-select:focus{outline:none;border-color:var(--upload-primary);box-shadow:0 0 0 3px #6366f11a}.gradient-preview-bar{margin-bottom:var(--upload-space-3);padding:var(--upload-space-3);background:var(--upload-gray-50);border-radius:var(--upload-radius)}.gradient-bar{height:48px;border-radius:var(--upload-radius);border:2px solid var(--upload-gray-200);box-shadow:inset 0 1px 3px #0000001a}.gradient-presets-compact{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--upload-space-2)}.gradient-preset-btn{height:40px;border:2px solid transparent;border-radius:var(--upload-radius);cursor:pointer;transition:all var(--upload-transition);position:relative;padding:0;overflow:hidden}.gradient-preset-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.gradient-preset-btn.active{border-color:var(--upload-primary);border-width:3px;box-shadow:0 0 0 3px #6366f133}.gradient-preset-btn.active:after{content:"\2713";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:24px;height:24px;background:var(--upload-white);color:var(--upload-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;box-shadow:0 2px 8px #0003}.template-help-section{margin-bottom:var(--upload-space-6);background:linear-gradient(135deg,#6366f10d,#8b5cf60d);border:2px solid var(--upload-primary);border-radius:var(--upload-radius-lg);overflow:hidden;transition:all var(--upload-transition)}.template-help-toggle{width:100%;display:flex;align-items:center;gap:var(--upload-space-3);padding:var(--upload-space-4);background:transparent;border:none;cursor:pointer;transition:all var(--upload-transition)}.template-help-toggle:hover{background:#6366f114}.help-icon{flex-shrink:0;color:var(--upload-primary)}.help-title{flex:1;font-size:1rem;font-weight:700;color:var(--upload-gray-900);text-align:left}.help-chevron{flex-shrink:0;color:var(--upload-primary);transition:transform var(--upload-transition)}.template-help-section.expanded .help-chevron{transform:rotate(180deg)}.template-help-section.expanded .template-help-content{max-height:800px}.help-description{padding:0 var(--upload-space-4) var(--upload-space-4);margin:0;font-size:.938rem;color:var(--upload-gray-700);line-height:1.6}.template-downloads{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--upload-space-3);padding:0 var(--upload-space-4) var(--upload-space-4)}.template-download-btn{display:flex;align-items:center;gap:var(--upload-space-3);padding:var(--upload-space-3);background:var(--upload-white);border:2px solid var(--upload-gray-300);border-radius:var(--upload-radius);text-decoration:none;color:var(--upload-gray-900);transition:all var(--upload-transition)}.template-download-btn:hover{border-color:var(--upload-primary);background:#6366f10d;transform:translateY(-2px);box-shadow:var(--upload-shadow-colored)}.template-info{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}.template-name{font-weight:700;font-size:.938rem;color:var(--upload-gray-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.template-specs{font-size:.75rem;color:var(--upload-gray-600);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.help-tips{padding:var(--upload-space-4);background:#fff9;border-top:1px solid rgba(99,102,241,.2)}.tips-title{margin:0 0 var(--upload-space-3);font-size:.938rem;font-weight:700;color:var(--upload-gray-900)}.tips-list{margin:0;padding-left:var(--upload-space-5);list-style:disc}.tips-list li{margin-bottom:var(--upload-space-2);font-size:.875rem;color:var(--upload-gray-700);line-height:1.6}.tips-list li:last-child{margin-bottom:0}.tips-list strong{color:var(--upload-gray-900);font-weight:700}.template-help-section{margin-top:var(--upload-space-6);background:linear-gradient(135deg,#6366f10d,#8b5cf60d);border:2px solid var(--upload-primary);border-radius:var(--upload-radius-lg);overflow:hidden;transition:all var(--upload-transition)}.template-help-header{width:100%;display:flex;align-items:center;justify-content:space-between;padding:var(--upload-space-4) var(--upload-space-5);background:transparent;border:none;cursor:pointer;transition:background var(--upload-transition)}.template-help-header:hover{background:#6366f10d}.template-help-title{display:flex;align-items:center;gap:var(--upload-space-3);font-size:1rem;font-weight:600;color:var(--upload-primary)}.template-help-title svg{flex-shrink:0}.template-help-arrow{flex-shrink:0;color:var(--upload-primary);transition:transform var(--upload-transition)}.template-help-section.expanded .template-help-arrow{transform:rotate(180deg)}.template-help-content{max-height:0;overflow:hidden;transition:max-height .4s cubic-bezier(.4,0,.2,1)}.template-help-section.expanded .template-help-content{max-height:1000px}.template-help-body{padding:0 var(--upload-space-5) var(--upload-space-5);display:flex;flex-direction:column;gap:var(--upload-space-5)}.template-downloads,.template-tips{display:flex;flex-direction:column}.template-downloads h4,.template-tips h4{margin:0 0 var(--upload-space-3);font-size:.938rem;font-weight:700;color:var(--upload-gray-900)}.template-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--upload-space-3)}.template-download-btn{display:flex;align-items:center;gap:var(--upload-space-3);padding:var(--upload-space-3);background:var(--upload-white);border:2px solid var(--upload-gray-300);border-radius:var(--upload-radius);text-decoration:none;color:inherit;transition:all var(--upload-transition)}.template-download-btn:hover{border-color:var(--upload-primary);background:#6366f10d;transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.template-download-btn svg{flex-shrink:0;color:var(--upload-primary)}.template-info{display:flex;flex-direction:column;gap:var(--upload-space-1)}.template-name{font-weight:600;font-size:.938rem;color:var(--upload-gray-900)}.template-specs{font-size:.813rem;color:var(--upload-gray-600)}.template-tips ul{margin:0;padding-left:var(--upload-space-5);list-style:disc}.template-tips li{margin-bottom:var(--upload-space-2);font-size:.875rem;color:var(--upload-gray-700);line-height:1.6}.template-tips li:last-child{margin-bottom:0}.template-tips strong{color:var(--upload-gray-900);font-weight:600}@media (max-width: 768px){.template-grid{grid-template-columns:1fr}.template-help-body{padding:0 var(--upload-space-4) var(--upload-space-4)}.file-empty-left{flex-direction:column;align-items:flex-start}}.preview-loading-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#0f172ad9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:10;border-radius:var(--upload-radius-lg);animation:fadeIn .2s ease}.preview-loading-content{display:flex;flex-direction:column;align-items:center;gap:var(--upload-space-4);padding:var(--upload-space-6);background:#ffffff1a;border-radius:var(--upload-radius);border:1px solid rgba(255,255,255,.2)}.preview-loading-spinner{width:48px;height:48px;border:4px solid rgba(255,255,255,.2);border-top-color:var(--upload-white);border-radius:50%;animation:spin .8s linear infinite}.preview-loading-text{color:var(--upload-white);font-size:14px;font-weight:500;text-align:center;max-width:250px;line-height:1.4}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}
/*# sourceMappingURL=/cdn/shop/t/15/assets/file-upload-styles.css.map */