*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;line-height:1.6;color:#1a202c;background:#f8fafc;font-size:16px}#app{min-height:100vh;position:relative}.header{background:linear-gradient(-180deg,#f53d2d,#f63);color:#fff;padding:3rem 0;text-align:center;position:relative;overflow:hidden}.header:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grain" width="100" height="100" patternUnits="userSpaceOnUse"><circle cx="20" cy="20" r="1" fill="white" opacity="0.1"/><circle cx="80" cy="80" r="1" fill="white" opacity="0.1"/><circle cx="40" cy="70" r="1" fill="white" opacity="0.1"/></pattern></defs><rect width="100" height="100" fill="url(%23grain)"/></svg>');opacity:.1}.header-content{display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;gap:1rem;max-width:70rem;margin:0 auto;padding:0 1rem;position:relative;z-index:1}.logo{height:90px;width:auto;border-radius:12px;object-fit:contain;background:#ffffffe6;padding:8px;box-shadow:0 4px 20px #0000001a;transition:all .3s ease}.logo:hover{background:#fffffff2;box-shadow:0 6px 25px #00000026}.header h1{font-size:2.25rem;font-weight:700;margin-bottom:.75rem;position:relative;z-index:1}.header-subtitle{opacity:.95;font-size:1.25rem;font-weight:600;margin-bottom:.5rem;position:relative;z-index:1}.header-description{opacity:.85;font-size:1rem;font-weight:400;position:relative;z-index:1;line-height:1.5}.notice-section{margin-top:1.5rem;display:flex;flex-direction:column;gap:.75rem;max-width:600px;width:100%}.notice-item{display:flex;align-items:center;gap:.75rem;background:#fff3ed;border:1.5px solid #ee4d2d;box-shadow:0 2px 8px #ee4d2d14;padding:1rem 1.25rem;border-radius:14px;margin-bottom:.5rem}.notice-icon{width:22px;height:22px;color:#ee4d2d;flex-shrink:0}.notice-item span{color:#b91c1c;font-size:1rem;font-weight:600;line-height:1.5}.main{max-width:70rem;margin:0 auto;padding:2rem 1rem;position:relative;z-index:2}.search-section,.results-section{background:#fff;border-radius:16px;box-shadow:0 4px 20px #00000014;padding:2rem;margin-bottom:1.5rem;border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.search-section h2,.results-section h2{color:#1a202c;margin-bottom:1.5rem;font-size:1.375rem;font-weight:600}.search-form{display:grid;gap:1rem;grid-template-columns:1fr 1fr 1fr auto;align-items:end}.search-input{padding:1rem 1.25rem;border:2px solid #e2e8f0;border-radius:12px;font-size:1rem;transition:all .2s ease;background:#f8fafc;color:#1a202c}.search-input:focus{outline:none;border-color:#ee4d2d;background:#fff;box-shadow:0 0 0 3px #ee4d2d1a}.btn{padding:1rem 1.5rem;border:none;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;text-align:center;white-space:nowrap}.btn-primary{background:#ee4d2d;color:#fff;box-shadow:0 4px 12px #ee4d2d4d}.btn-primary:hover{box-shadow:0 6px 20px #ee4d2d66}.btn-secondary{background:#6b7280;color:#fff}.btn-secondary:hover{background:#4b5563}.order-list{display:grid;gap:1.5rem}.order-card{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:1.5rem;transition:transform .2s}.order-card:hover{box-shadow:0 4px 12px #0000001a}.order-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid #e2e8f0}.order-header h3{color:#2d3748;font-size:1.25rem}.status{padding:.25rem .75rem;border-radius:20px;font-size:.875rem;font-weight:600}.status-pending{background:#fee2e2;color:#ee4d2d}.status-processing{background:#fef3c7;color:#d97706}.status-completed{background:#dbeafe;color:#136}.status-failed{background:#fee2e2;color:#d0011b}.order-details p{margin-bottom:.5rem}.order-details strong{color:#4a5568}.esim-info{background:#edf2f7;padding:1rem;border-radius:6px;margin-top:1rem}.order-actions{margin-top:1rem;padding-top:1rem;border-top:1px solid #e2e8f0}.exchange-card{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:2rem}.exchange-details,.vendor-selection{margin:1.5rem 0}.vendor-selection label{display:block;margin-bottom:.5rem;color:#4a5568;font-weight:600}.form-select{width:100%;padding:.75rem;border:2px solid #e2e8f0;border-radius:8px;font-size:1rem;background:#fff}.exchange-actions{margin-top:1.5rem;display:flex;gap:1rem}.loading{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:1000}.spinner{width:50px;height:50px;border:4px solid #f3f3f3;border-top:4px solid #EE4D2D;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading p{color:#fff;font-size:1.1rem}.message{position:fixed;top:20px;right:20px;padding:1rem 1.5rem;border-radius:8px;font-weight:600;transform:translate(500px);transition:transform .3s;z-index:1001}.message.show{transform:translate(0)}.message-success{background:#dbeafe;color:#136;border:1px solid #93c5fd}.message-error{background:#fee2e2;color:#d0011b;border:1px solid #fca5a5}.message-info{background:#fef2f2;color:#ee4d2d;border:1px solid #fecaca}.no-results{text-align:center;color:#718096;font-style:italic;padding:2rem}.order-card-modern{background:#fff;border-radius:16px;box-shadow:0 4px 20px #00000014;overflow:hidden;border:1px solid #f1f5f9}.order-header-modern{background:linear-gradient(135deg,#f8fafc,#f1f5f9);padding:1.5rem;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #e2e8f0}.order-number{display:flex;flex-direction:column;gap:.25rem}.order-label{font-size:.875rem;color:#64748b;font-weight:500}.order-value{font-size:1.125rem;color:#1e293b;font-weight:700;font-family:SF Mono,Monaco,Consolas,monospace}.order-status .status-badge{padding:.5rem 1rem;border-radius:20px;font-size:.875rem;font-weight:600;text-transform:uppercase;letter-spacing:.025em}.status-pending{background:linear-gradient(135deg,#ee4d2d,#d0011b);color:#fff;box-shadow:0 2px 8px #ee4d2d4d}.status-completed{background:linear-gradient(135deg,#136,#0a2447);color:#fff;box-shadow:0 2px 8px #1133664d}.status-failed{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;box-shadow:0 2px 8px #ef44444d}.status-partial{background:linear-gradient(135deg,#ee4d2d,#d0011b);color:#fff;box-shadow:0 2px 8px #ee4d2d4d}.order-info-grid{padding:1.5rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem;background:#fafbfc;border-bottom:1px solid #e2e8f0}.info-item{display:flex;flex-direction:column;gap:.25rem}.info-label{font-size:.875rem;color:#64748b;font-weight:500}.info-value{font-size:1rem;color:#1e293b;font-weight:600}.products-section{padding:1.5rem}.section-title{font-size:1.125rem;color:#1e293b;font-weight:600;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.section-title:before{content:"";width:4px;height:20px;background:linear-gradient(135deg,#ee4d2d,#d0011b);border-radius:2px}.products-list{display:flex;flex-direction:column;gap:.75rem}.product-item-modern{background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:1rem;transition:all .2s ease}.product-item-modern:hover{box-shadow:0 4px 12px #0000001a}.product-main{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:.5rem}.product-info{flex:1;display:flex;flex-direction:column;gap:.25rem}.product-meta{display:flex;align-items:center;gap:.5rem;flex-shrink:0}.product-name{font-size:1rem;color:#1e293b;font-weight:600;flex:1;line-height:1.4}.product-quantity{font-size:.875rem;color:#64748b;font-weight:500;background:#e2e8f0;padding:.25rem .5rem;border-radius:6px}.product-pricing{display:flex;justify-content:space-between;align-items:center}.unit-price{font-size:.875rem;color:#64748b}.subtotal{font-size:1rem;color:#1e293b;font-weight:600}.exchange-status{font-size:.875rem;padding:.25rem .5rem;border-radius:4px;font-weight:500;text-transform:uppercase;letter-spacing:.025em}.exchange-status.success{background:#dcfce7;color:#166534}.exchange-status.failed{background:#fef2f2;color:#dc2626}.exchange-status.skipped{background:#fef3c7;color:#d97706}.manual-note{font-size:.75rem;color:#d97706;font-style:italic}.order-summary{padding:1.5rem;border-top:1px solid #e2e8f0}.total-amount{display:flex;justify-content:space-between;align-items:center}.total-label{font-size:1.125rem;color:#64748b;font-weight:600}.total-value{font-size:1.5rem;color:#1e293b;font-weight:700}.action-section{padding:1.5rem;background:#fff;text-align:center}.receipt-info{margin-bottom:1.5rem;padding:1.5rem;background:#f8fafc;border-radius:12px;border:1px solid #e2e8f0;text-align:left}.receipt-form{display:grid;gap:1rem}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-group label{font-weight:600;color:#374151;font-size:.875rem}.form-input{padding:.75rem;border:1px solid #d1d5db;border-radius:8px;font-size:1rem;transition:border-color .2s ease;background:#fff}.form-input:focus{outline:none;border-color:#ee4d2d;box-shadow:0 0 0 3px #ee4d2d1a}.checkbox-label{display:flex;align-items:center;gap:.5rem;cursor:pointer;-webkit-user-select:none;user-select:none}.checkbox-input{width:18px;height:18px;accent-color:#EE4D2D;cursor:pointer}.checkbox-text{font-size:1rem;color:#374151;font-weight:500}.receipt-fields.disabled{opacity:.5;pointer-events:none}.receipt-fields.disabled .form-input{background-color:#f3f4f6;color:#9ca3af;cursor:not-allowed}.receipt-fields.disabled label{color:#9ca3af}.exchange-btn{background:#ee4d2d;color:#fff;border:none;padding:1rem 2rem;border-radius:12px;font-size:1.125rem;font-weight:600;cursor:pointer;transition:all .3s ease;display:inline-flex;align-items:center;gap:.5rem;box-shadow:0 4px 16px #ee4d2d4d}.exchange-btn:hover{box-shadow:0 8px 24px #ee4d2d66}.exchange-icon{width:20px;height:20px}@media (max-width: 1024px){.search-form{grid-template-columns:1fr;gap:.75rem}}@media (max-width: 768px){.header{padding:2rem 0}.header-content{flex-direction:column;text-align:center;gap:1rem}.header-text{text-align:center}.header h1{font-size:1.875rem;margin-bottom:.5rem}.header-subtitle{font-size:1.125rem;margin-bottom:.25rem}.header-description{font-size:.875rem;line-height:1.4}.notice-section{margin-top:1rem;gap:.5rem}.notice-item{padding:.75rem;gap:.5rem}.notice-item span{font-size:.8rem}.main{padding:1rem .75rem}.search-section,.results-section{padding:1.5rem;margin-bottom:1rem}.order-header-modern{flex-direction:column;align-items:flex-start;gap:1rem;padding:1rem}.order-info-grid{grid-template-columns:1fr;padding:1rem}.products-section{padding:1rem}.product-main{flex-direction:column;gap:.5rem;align-items:flex-start}.product-meta{align-self:flex-end}.product-quantity{align-self:flex-start}.order-summary,.action-section{padding:1rem}.total-amount{flex-direction:column;gap:.5rem;text-align:center}.exchange-btn{width:100%;justify-content:center}.receipt-info{padding:1rem;margin-bottom:1rem}.receipt-form{gap:.75rem}.exchange-result-section{padding:1rem}.summary-stats{flex-direction:column;gap:.5rem}.item-header{flex-direction:column;align-items:flex-start;gap:.5rem}.item-name,.item-option{min-width:auto;width:100%}}
