:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}*{margin:0;padding:0;box-sizing:border-box}body{overflow-x:hidden;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-50px)}to{opacity:1;transform:translate(0)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.animate-fadeInUp{animation:fadeInUp .6s ease-out forwards}.animate-slideInLeft{animation:slideInLeft .6s ease-out forwards}.app-container{min-height:100vh;width:100vw;background:linear-gradient(135deg,#667eea,#764ba2,#f093fb);padding:0;position:relative;overflow:auto}.bg-orb{position:fixed;border-radius:50%;filter:blur(60px);z-index:0}.bg-orb-1{top:10%;left:5%;width:300px;height:300px;background:#ffffff1a;animation:pulse 8s infinite ease-in-out}.bg-orb-2{bottom:10%;right:5%;width:400px;height:400px;background:#ffffff1a;filter:blur(80px);animation:pulse 10s infinite ease-in-out}.content-wrapper{max-width:100%;width:100%;padding:40px 60px;position:relative;z-index:1}.header-card,.search-card,.products-card,.form-card{background:#fffffff2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;padding:35px 50px;margin-bottom:40px;box-shadow:0 20px 60px #00000026;border:1px solid rgba(255,255,255,.3)}.header-content{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:20px}.main-title{font-size:42px;font-weight:800;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin:0 0 10px;display:flex;align-items:center;gap:15px}.title-icon{color:#667eea}.subtitle{color:#64748b;margin:0;font-size:16px}.header-actions{display:flex;gap:20px;align-items:center}.product-count-badge{padding:12px 24px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:16px;color:#fff;font-weight:700;display:flex;align-items:center;gap:8px}.chart-btn{padding:12px 24px;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;border-radius:16px;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:8px;font-size:15px}.search-wrapper{display:flex;gap:15px;align-items:center;flex-wrap:wrap}.search-input-wrapper{position:relative;flex:1 1 300px}.search-icon{position:absolute;left:20px;top:50%;transform:translateY(-50%);color:#94a3b8}.search-input{width:100%;padding:18px 20px 18px 60px;font-size:17px;border:2px solid #e2e8f0;border-radius:16px;outline:none;background:#fff;font-weight:500}.search-btn{padding:18px 40px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:16px;font-size:17px;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:10px;box-shadow:0 10px 25px #667eea66}.products-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px;flex-wrap:wrap;gap:20px}.section-title{font-size:28px;font-weight:800;color:#1e293b;margin:0;display:flex;align-items:center;gap:12px}.section-icon{color:#667eea}.pagination-controls{display:flex;align-items:center;gap:15px}.pagination-btn{padding:12px 24px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;cursor:pointer;display:flex;align-items:center;gap:8px;font-weight:700;font-size:15px}.pagination-btn.disabled{background:#e2e8f0;color:#94a3b8;cursor:not-allowed;box-shadow:none}.page-indicator{padding:12px 28px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;font-weight:800;color:#fff;font-size:16px}.products-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:25px}.product-card{background:linear-gradient(135deg,#fff,#f8fafc);border:2px solid #e2e8f0;border-radius:20px;padding:28px;cursor:pointer;position:relative;overflow:hidden}.rating-badge{position:absolute;top:15px;right:15px;background:linear-gradient(135deg,#fbbf24,#f59e0b);padding:8px 16px;border-radius:12px;display:flex;align-items:center;gap:6px;color:#fff;font-weight:700;font-size:14px}.product-icon-wrapper{width:60px;height:60px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:16px;display:flex;align-items:center;justify-content:center;margin-bottom:20px}.product-title{font-size:22px;font-weight:800;color:#1e293b;margin-bottom:12px;line-height:1.3}.product-description{color:#64748b;font-size:15px;margin-bottom:20px;line-height:1.6;height:45px;overflow:hidden}.product-price{display:flex;align-items:center;gap:8px;margin-bottom:18px}.price-icon{color:#10b981}.price-value{font-size:32px;font-weight:900;background:linear-gradient(135deg,#10b981,#059669);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.product-id{font-size:13px;color:#94a3b8;font-family:monospace;padding:12px;background:#f1f5f9;border-radius:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.form-sections{display:grid;grid-template-columns:1fr 1fr;gap:40px}.form-card.transparent-bg{opacity:.5;pointer-events:none}.form-card.updating{background:#fff9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.form-title{font-size:26px;font-weight:800;color:#1e293b;margin-bottom:25px;display:flex;align-items:center;gap:12px}.form-icon-wrapper{width:45px;height:45px;border-radius:12px;display:flex;align-items:center;justify-content:center}.green-gradient{background:linear-gradient(135deg,#10b981,#059669)}.purple-gradient{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}.form-inputs{display:flex;flex-direction:column;gap:15px;margin-bottom:25px}.form-input{padding:16px 20px;font-size:16px;border:2px solid #e2e8f0;border-radius:14px;outline:none;font-weight:500}.input-with-icon{position:relative}.input-icon{position:absolute;left:18px;top:50%;transform:translateY(-50%);color:#94a3b8}.form-input.with-icon{padding-left:50px}.submit-btn{width:100%;padding:18px;color:#fff;border:none;border-radius:14px;font-size:17px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px}.green-btn{background:linear-gradient(135deg,#10b981,#059669);box-shadow:0 10px 25px #10b98166}.purple-btn{background:linear-gradient(135deg,#8b5cf6,#7c3aed);box-shadow:0 10px 25px #8b5cf666}.submit-btn:disabled{opacity:.6;cursor:not-allowed}.card-hover{transition:all .4s cubic-bezier(.4,0,.2,1)}.card-hover:hover{transform:translateY(-10px) scale(1.02);box-shadow:0 25px 50px -12px #00000040}.btn-hover{transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.btn-hover:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:#fff3;transition:left .5s}.btn-hover:hover:before{left:100%}.btn-hover:hover{transform:translateY(-2px);box-shadow:0 20px 25px -5px #0003}.btn-hover:disabled:hover{transform:none}.input-focus{transition:all .3s ease}.input-focus:focus{border-color:#667eea;transform:translateY(-2px);box-shadow:0 10px 20px -5px #6366f14d}.loading-shimmer{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:1000px 100%;animation:shimmer 2s infinite}.product-skeleton{height:320px;border-radius:20px}.modal-overlay{position:fixed;inset:0;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease;padding:20px}.modal-content{background:#fff;border-radius:24px;padding:40px;max-width:900px;width:100%;max-height:90vh;overflow-y:auto;box-shadow:0 25px 80px #0000004d;animation:fadeInUp .4s ease}.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px;padding-bottom:20px;border-bottom:2px solid #e2e8f0}.modal-title{font-size:32px;font-weight:800;color:#1e293b;display:flex;align-items:center;gap:12px}.modal-close{background:#db1956;border:none;width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s}.modal-close:hover{background:#e2e8f0;transform:rotate(90deg)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-bottom:40px}.stat-card{background:linear-gradient(135deg,#f8fafc,#fff);border:2px solid #e2e8f0;border-radius:16px;padding:20px;display:flex;align-items:center;gap:15px;transition:all .3s}.stat-card:hover{transform:translateY(-5px);box-shadow:0 15px 30px #0000001a}.stat-icon{width:56px;height:56px;border-radius:14px;display:flex;align-items:center;justify-content:center;color:#fff}.blue-gradient{background:linear-gradient(135deg,#667eea,#764ba2)}.yellow-gradient{background:linear-gradient(135deg,#fbbf24,#f59e0b)}.orange-gradient{background:linear-gradient(135deg,#f97316,#ea580c)}.stat-info{flex:1}.stat-label{font-size:13px;color:#64748b;font-weight:600;margin-bottom:4px}.stat-value{font-size:28px;font-weight:900;color:#1e293b}.chart-container{background:#f8fafc;border-radius:16px;padding:25px}.chart-title{font-size:20px;font-weight:800;color:#1e293b;margin-bottom:20px}.bar-chart{display:flex;flex-direction:column;gap:15px}.bar-item{display:flex;flex-direction:column;gap:8px}.bar-label{font-size:14px;font-weight:600;color:#475569}.bar-wrapper{background:#e2e8f0;border-radius:8px;height:40px;overflow:hidden;position:relative}.bar-fill{height:100%;display:flex;align-items:center;justify-content:flex-end;padding:0 15px;border-radius:8px;transition:width .8s cubic-bezier(.4,0,.2,1);min-width:60px}.bar-value{color:#fff;font-weight:800;font-size:16px}.metadata-btn{width:100%;padding:12px;margin-top:15px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;font-size:14px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:all .3s}.metadata-btn:hover{transform:translateY(-2px);box-shadow:0 10px 20px #667eea66}.validation-error{background:linear-gradient(135deg,#fee2e2,#fecaca);border:2px solid #f87171;border-radius:12px;padding:12px 16px;margin-bottom:20px;color:#dc2626;font-weight:600;font-size:14px;display:flex;align-items:center;gap:10px;animation:fadeInUp .3s ease}.metadata-examples{background:linear-gradient(135deg,#eff6ff,#dbeafe);border:2px solid #93c5fd;border-radius:12px;padding:15px;margin-bottom:20px}.example-title{font-weight:700;color:#1e40af;margin-bottom:10px;font-size:14px}.examples-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;font-size:13px;color:#1e40af}.examples-grid span{display:flex;align-items:center;gap:6px;font-weight:600}.no-products{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;gap:15px}.no-products p{font-size:18px;color:#64748b;font-weight:600}.metadata-modal{max-width:700px}.product-info-section{background:linear-gradient(135deg,#f8fafc,#fff);border:2px solid #e2e8f0;border-radius:16px;padding:25px;margin-bottom:25px}.product-modal-title{font-size:24px;font-weight:800;color:#1e293b;margin-bottom:10px}.product-modal-desc{color:#64748b;font-size:15px;line-height:1.6;margin-bottom:15px}.product-modal-details{display:flex;gap:12px}.detail-badge{padding:8px 16px;border-radius:10px;font-weight:700;font-size:14px;display:flex;align-items:center;gap:6px}.price-badge-modal{background:linear-gradient(135deg,#10b981,#059669);color:#fff}.rating-badge-modal{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#fff}.metadata-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:15px;margin-bottom:30px}.metadata-stat-card{background:linear-gradient(135deg,#fff,#f8fafc);border:2px solid #e2e8f0;border-radius:14px;padding:20px;display:flex;align-items:center;gap:15px;animation:fadeInUp .4s ease forwards;transition:all .3s}.metadata-stat-card:hover{transform:translateY(-5px);box-shadow:0 15px 30px #0000001a}.metadata-stat-icon{width:50px;height:50px;border-radius:12px;display:flex;align-items:center;justify-content:center}.metadata-stat-info{flex:1}.metadata-stat-label{font-size:13px;color:#64748b;font-weight:600;margin-bottom:4px}.metadata-stat-value{font-size:20px;font-weight:900;color:#1e293b}.pie-chart-container{background:#f8fafc;border-radius:16px;padding:25px}.pie-chart{display:grid;grid-template-columns:repeat(2,1fr);gap:15px;margin-top:20px}.pie-segment{padding:20px;border-radius:14px;color:#fff;text-align:center;animation:fadeInUp .5s ease forwards;transition:all .3s;cursor:pointer}.pie-segment:hover{transform:scale(1.05);box-shadow:0 15px 30px #0003}.pie-label{font-size:14px;font-weight:700;margin-bottom:8px;opacity:.9}.pie-value{font-size:22px;font-weight:900}@media(max-width:768px){.metadata-stats,.pie-chart,.examples-grid{grid-template-columns:1fr}}.pagination-info-bottom{margin-top:25px;padding-top:20px;border-top:2px solid #e2e8f0;text-align:center;color:#64748b;font-weight:600;font-size:15px}.no-products{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 20px;gap:20px}.empty-bag-container{position:relative;width:200px;height:200px;display:flex;align-items:center;justify-content:center}.shopping-bag{position:relative;animation:bagShake 2s ease-in-out infinite}.shopping-bag svg{filter:drop-shadow(0 10px 20px rgba(0,0,0,.1))}.particle{position:absolute;width:8px;height:8px;border-radius:50%;opacity:0;animation:fall 2s ease-in-out infinite}.particle:nth-child(1){top:30%;left:45%;background:linear-gradient(135deg,#667eea,#764ba2);animation-delay:0s}.particle:nth-child(2){top:30%;left:55%;background:linear-gradient(135deg,#f093fb,#f5576c);animation-delay:.3s}.particle:nth-child(3){top:30%;left:50%;background:linear-gradient(135deg,#4facfe,#00f2fe);animation-delay:.6s}.particle:nth-child(4){top:30%;left:40%;background:linear-gradient(135deg,#43e97b,#38f9d7);animation-delay:.9s}.particle:nth-child(5){top:30%;left:60%;background:linear-gradient(135deg,#fa709a,#fee140);animation-delay:1.2s}@keyframes bagShake{0%,to{transform:rotate(50deg);border-radius:20px}25%{transform:rotate(-5deg) translateY(-5px)}75%{transform:rotate(5deg) translateY(-5px)}}@keyframes fall{0%{opacity:1;transform:translateY(0) scale(1)}50%{opacity:0}to{opacity:0;transform:translateY(100px) scale(.3)}}.empty-message{text-align:center}.empty-title{font-size:28px;font-weight:800;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:10px;animation:fadeInUp .6s ease}.empty-subtitle{color:#64748b;font-size:16px;font-weight:500;animation:fadeInUp .8s ease}.empty-suggestions{margin-top:25px;padding:20px;background:linear-gradient(135deg,#f0f4ff,#fef0ff);border-radius:16px;border:2px dashed #cbd5e1;animation:fadeInUp 1s ease}.empty-suggestions p{font-size:14px;color:#475569;font-weight:600;margin-bottom:10px}.suggestion-tags{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.suggestion-tag{padding:8px 16px;background:#fff;border-radius:20px;font-size:13px;font-weight:600;color:#667eea;cursor:pointer;transition:all .3s;border:2px solid #e0e7ff}.suggestion-tag:hover{transform:translateY(-2px);background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-color:#667eea;box-shadow:0 5px 15px #667eea4d}@media(max-width:1024px){.form-sections{grid-template-columns:1fr}.products-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}}@media(max-width:768px){.content-wrapper{padding:20px}.header-content{flex-direction:column;align-items:flex-start}.main-title{font-size:32px}.products-header{flex-direction:column;align-items:flex-start}.stats-grid{grid-template-columns:1fr}}
