@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes zoomIn{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;background:0 0;color:#333;line-height:1.6;padding:20px}.container{max-width:700px;margin:0 auto}.tabs{display:flex;margin-bottom:30px}.tab-btn{flex:1;padding:12px 20px;background:0 0;border:0;border-bottom:3px solid transparent;cursor:pointer;font-size:24px;color:#666;transition:all .3s}.tab-btn.active{color:#333;font-weight:600}.tab-btn:hover{color:#333}.form-container{animation:fadeIn .3s}.form-content{padding:10px 0}.input-group,.input-row{margin-bottom:20px}.input-row{display:flex;gap:10px}.input-wrapper{position:relative;width:100%}.input-field{width:100%;padding:14px 40px 14px 16px;border:2px solid #ddd;border-radius:8px;font-size:15px;transition:border-color .3s;background:#fff}.input-field:focus{outline:0;border-color:#666}.input-field::placeholder{color:#999}.clear-btn{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:24px;height:24px;border:0;background:#ccc;color:#fff;border-radius:50%;font-size:18px;line-height:1;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;padding:0}.clear-btn:hover{background:#999;transform:translateY(-50%) scale(1.1)}.clear-btn:active{transform:translateY(-50%) scale(.95)}.flex-grow{flex:1}.select-field{padding:14px 16px;border:2px solid #ddd;border-radius:8px;font-size:15px;background:#fff;cursor:pointer;min-width:120px}.select-field:focus{outline:0;border-color:#666}.btn-primary{width:100%;padding:14px;background:#333;color:#fff;border:0;border-radius:8px;font-size:16px;font-weight:500;cursor:pointer;transition:background .3s,opacity .3s}.btn-primary:hover:not(:disabled){background:#555}.btn-primary:active:not(:disabled){transform:scale(.98)}.btn-primary.disabled,.btn-primary:disabled{background:#ccc;color:#999;cursor:not-allowed;opacity:.6}.btn-secondary{padding:10px 20px;background:0 0;color:#333;border:2px solid #ddd;border-radius:8px;font-size:14px;cursor:pointer;transition:all .3s;margin-bottom:20px}.btn-secondary:hover{border-color:#333}.loading{display:none;text-align:center;margin-top:20px;color:#666}.loading.show{display:flex;flex-direction:column;align-items:center}.spinner{width:40px;height:40px;border:8px solid #f3f3f3;border-top:8px solid #333;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:10px}.error-message{display:none;padding:20px;background:#f8f9fa;border-left:8px solid #6c757d;border-radius:8px;margin:20px auto 0;max-width:600px;text-align:center}.error-message.show,.result-container.show{display:block}.error-message-title{font-size:17px;font-weight:700;color:#333;margin-bottom:10px;display:flex;align-items:center;justify-content:center;gap:8px}.error-message-title::before{content:"●";color:#6c757d;font-size:20px}.error-message-text{font-size:14px;color:#666;line-height:1.6}.result-container{display:none;animation:fadeIn .3s;margin-top:30px;padding-top:20px}.package-tabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px;border-bottom:2px solid #e0e0e0}.package-tab{padding:12px 24px;background:0 0;border:0;border-bottom:3px solid transparent;cursor:pointer;font-size:15px;color:#666;transition:all .3s}.package-tab.active{color:#333;border-bottom-color:#333;font-weight:600}.package-tab:hover{color:#333}.section{background:#fff;border:2px solid #333;border-radius:8px;padding:30px 20px 20px;margin-bottom:20px;position:relative;margin-top:20px}.section-title{font-size:16px;font-weight:600;color:#333;position:absolute;top:-12px;left:20px;background:#fff;padding:0 10px;margin:0}.logistics-info{position:relative}.logistics-details-header,.logistics-left{display:flex;align-items:flex-start;overflow:hidden}.logistics-details-header{gap:10px;padding:10px;background:#f8f9fa;border-radius:8px;margin-bottom:15px;flex-wrap:wrap}.logistics-left{gap:12px;flex:1 1 auto;min-width:0;max-width:40%}.logistics-status-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px}.status-dot{width:12px;height:12px;border-radius:50%;display:inline-block}.status-dot.status-processing{background:#ff9800}.status-dot.status-delivery,.status-dot.status-picked,.status-dot.status-transit{background:#2196f3}.status-dot.status-delivered{background:#4caf50}.logistics-title-group{display:flex;flex-direction:column;gap:5px;flex:1;min-width:0;overflow:hidden}.logistics-number{font-size:16px;font-weight:600;color:#333;word-wrap:break-word;word-break:break-all;overflow-wrap:break-word;max-width:100%}.logistics-number span{margin-right:8px;word-wrap:break-word;word-break:break-all}.logistics-status-text{font-size:14px;color:#666;margin:0}.logistics-center{display:flex;align-items:center;gap:6px;flex:0 1 auto;justify-content:center;min-width:0;max-width:100%;overflow:hidden}.logistics-details-header.only-left .logistics-left{flex:1}.logistics-details-header.no-right .logistics-center{flex:1;justify-content:flex-end}.logistics-address-item,.logistics-arrow-wrapper{display:flex;flex-direction:column;gap:8px}.logistics-address-item p{margin:0;font-size:14px;color:#333}.logistics-address-item p.address-line{font-size:11px!important;color:#999!important;line-height:1.4;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.logistics-arrow-wrapper{align-items:center;gap:2px;margin:0 8px}.address-arrow{font-size:16px;color:#999}.carrier-name{font-size:10px!important;color:#999!important;white-space:nowrap;text-align:center;margin:0}.logistics-right{display:flex;flex-direction:column;gap:8px;flex:1 1 auto;align-items:flex-end;text-align:right;min-width:0;max-width:40%;overflow:hidden;word-wrap:break-word;word-break:break-word}.logistics-time-item{margin:0 0 8px;font-size:14px;color:#333;line-height:1.6}.logistics-time-item .event-time{display:block;font-weight:500}.logistics-event-detail{margin:0;font-size:13px;color:#666;line-height:1.6;word-wrap:break-word;word-break:break-word;overflow-wrap:break-word}.logistics-event-detail span{display:inline;word-wrap:break-word;word-break:break-word}.logistics-carrier-info{padding:12px 20px;background:#f0f0f0;border-radius:8px;margin-bottom:15px}.carrier-name{}.progress-bar{width:100%;height:6px;background:#e0e0e0;border-radius:3px;overflow:hidden}.progress-fill{height:100%;background:#4caf50;border-radius:3px;transition:width .3s}.delivery-date{margin:15px 0;padding:12px;background:#f0f8ff;border-left:8px solid #2196f3;border-radius:8px}.delivery-date strong{color:#2196f3}.logistics-summary{padding:16px 20px;border-bottom:1px solid #dedede}.summary-title{font-size:20px;font-weight:600;color:#000;line-height:1.4}.tracking-timeline{position:relative;padding-left:0;counter-reset:timeline-counter}.tracking-timeline::before{content:"";position:absolute;left:20px;top:0;bottom:0;width:2px;background:#e0e0e0}.tracking-event{position:relative;padding:8px 0 8px 30px;margin-left:20px;counter-increment:timeline-counter}.tracking-event::before{content:"";position:absolute;display:inline-block;left:-6px;top:12px;width:8px;height:8px;border:3px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.87);transform:rotate(45deg);background:#fff;line-height:0;z-index:2}.tracking-event.active::before{box-shadow:0 0 0 1px #212121;background:#212121}.tracking-event>div{padding:8px 0 8px 10px;display:flex}.tracking-event>div:hover{background-color:#f5f5f5}.event-date{width:170px;flex:0 0 auto;font-size:14px;color:#757575;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.event-content{flex:1;word-wrap:break-word;word-break:break-word;overflow-wrap:break-word;min-width:0}.event-location,.event-status{font-size:14px;color:#757575;margin:0;display:inline;word-wrap:break-word;word-break:break-word}.tracking-event.active .event-date,.tracking-event.active .event-location,.tracking-event.active .event-status{color:#212121;font-weight:500}.expand-btn{display:block;margin:20px auto 0;padding:10px 24px;background:#fff;border:1px solid #ddd;border-radius:8px;cursor:pointer;font-size:14px;color:#666;transition:all .3s}.expand-btn:hover{border-color:#333;color:#333;background:#f8f8f8}.hidden-events{margin-top:0;padding-top:0}.hidden-events::before{top:0}.order-info{display:flex;flex-direction:column;gap:15px}.product-item-wrapper{background:#fafafa;border-radius:8px;overflow:hidden;transition:all .3s ease}.product-item-wrapper.expanded{background:#f5f5f5}.product-item{display:flex;gap:10px;padding:10px;cursor:pointer;transition:background .2s}.product-image,.product-item:hover{background:#f0f0f0}.product-image{width:80px;height:80px;object-fit:cover;border-radius:8px}.product-details{flex:1}.product-name{font-size:14px;color:#333;margin-bottom:5px}.product-quantity{font-size:13px;color:#666}.product-price-container{display:flex;flex-direction:column;align-items:flex-end;gap:5px}.product-price{font-size:15px;font-weight:600;color:#333;text-align:right}.product-quantity-badge{font-size:13px;color:#666;text-align:right}.expand-icon{font-size:12px;color:#999;transition:transform .3s;margin-top:5px}.product-full-info{padding:15px;background:#fff;border-top:1px solid #e0e0e0}.product-info-grid{display:flex;flex-direction:column;gap:10px}.product-info-row{display:grid;gap:10px;padding:8px 0;border-bottom:1px solid #f5f5f5}.product-info-row,.product-info-row.full-width{grid-template-columns:140px 1fr}.info-label{font-size:13px;color:#666;font-weight:500}.info-value{font-size:13px;color:#333;word-break:break-word}@media (max-width:600px){body{padding:10px}.tab-btn{font-size:24px;padding:10px 15px}.input-row{flex-direction:column}.select-field{width:100%}.section{padding:15px}.product-item{gap:10px}.product-image{width:60px;height:60px;flex-shrink:0}.product-price-container{align-items:flex-end}.product-price{text-align:right;font-size:14px}.product-quantity-badge{font-size:12px}.product-name{font-size:13px;line-height:1.4}.product-info-row{grid-template-columns:100px 1fr;font-size:12px}.info-label,.info-value{font-size:12px}.logistics-details-header{display:grid!important;grid-template-columns:1fr 1fr;gap:8px;padding:10px;flex-wrap:nowrap}.logistics-left,.logistics-right{grid-column:1;grid-row:1;max-width:none;flex:none}.logistics-right{grid-column:2;align-items:flex-end;text-align:right}.logistics-event-detail{margin-top:2px}.logistics-center{grid-column:1/-1;grid-row:2;width:100%;max-width:none;justify-content:flex-start;padding:8px 0 0;border-top:1px solid #e0e0e0;margin-top:5px;flex:none}.logistics-number span{font-size:13px}.logistics-status-text{font-size:11px}.logistics-status-icon{width:30px;height:30px}.status-dot{width:10px;height:10px}.logistics-time-item{font-size:13px}.logistics-event-detail{font-size:12px}.logistics-address-item p.address-line{font-size:10px!important;max-width:100px}.carrier-name{font-size:9px!important}.logistics-summary{padding:12px 15px}.summary-title{font-size:16px}}.image-modal{display:none;position:fixed;z-index:9999;left:0;top:0;width:100%;height:100%;background-color:rgba(0,0,0,.9);align-items:center;justify-content:center;animation:fadeIn .3s}.image-modal-content{max-width:90%;max-height:90%;width:auto;height:auto;object-fit:contain;animation:zoomIn .3s;border-radius:8px;box-shadow:0 8px 20px rgba(0,0,0,.5);background:#fff;display:block;margin:auto;cursor:default}.image-modal-close{position:absolute;top:20px;right:40px;color:#fff;font-size:40px;font-weight:700;cursor:pointer;transition:all .3s;z-index:10000;user-select:none}.image-modal-close:focus,.image-modal-close:hover{color:#bbb;transform:scale(1.2)}.product-image{cursor:pointer;transition:transform .2s,box-shadow .2s}.product-image:hover{transform:scale(1.05);box-shadow:0 2px 8px rgba(0,0,0,.2)}@media (max-width:600px){.image-modal-content{max-width:95%;max-height:95%}.image-modal-close{top:10px;right:20px;font-size:30px}}.logistics-notice{margin:20px 0;padding:20px;background-color:#f8f9fa;border:1px solid #e3e6e8;border-radius:8px}.logistics-notice .notice-content{display:flex;align-items:flex-start;gap:12px}.logistics-notice .notice-content::before{content:"ℹ️";font-size:20px;flex-shrink:0}.logistics-notice p{margin:0;color:#5a6c7d;font-size:14px;line-height:1.6}@media (max-width:768px){.logistics-notice{padding:15px;margin:15px 0}.logistics-notice p{font-size:13px}}