@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap";
:root{--bg-primary:#09090f;--bg-secondary:#0f0f1a;--bg-card:#ffffff0a;--bg-card-hover:#ffffff12;--border:#ffffff14;--border-accent:#8b5cf666;--text-primary:#f1f0ff;--text-secondary:#a09abd;--text-muted:#6b6483;--accent:#8b5cf6;--accent-light:#a78bfa;--accent-glow:#8b5cf640;--success:#10b981;--success-bg:#10b9811a;--warning:#f59e0b;--danger:#ef4444;--danger-bg:#ef44441a;--gradient:linear-gradient(135deg,#8b5cf6 0%,#6366f1 50%,#3b82f6 100%);--gradient-subtle:linear-gradient(135deg,#8b5cf626 0%,#6366f114 100%);--radius:12px;--radius-lg:20px;--shadow:0 4px 24px #0006;--shadow-accent:0 0 40px #8b5cf633}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;min-height:100vh;font-family:Inter,sans-serif;line-height:1.6}.app-shell{flex-direction:column;min-height:100vh;display:flex}.header{z-index:50;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid var(--border);background:#09090fd9;justify-content:space-between;align-items:center;height:64px;padding:0 2rem;display:flex;position:sticky;top:0}.header-logo{background:var(--gradient);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;align-items:center;gap:10px;font-size:1.1rem;font-weight:700;display:flex}.header-logo svg{color:var(--accent)}.header-badge{background:var(--accent-glow);border:1px solid var(--border-accent);color:var(--accent-light);letter-spacing:.05em;border-radius:20px;padding:3px 8px;font-size:.65rem;font-weight:600}.main-content{flex:1;width:100%;max-width:1400px;margin:0 auto;padding:2.5rem 2rem}.steps-bar{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);align-items:center;gap:0;margin-bottom:2.5rem;padding:1rem 1.5rem;display:flex;overflow:hidden}.step-item{cursor:default;flex:1;align-items:center;gap:10px;display:flex;position:relative}.step-item:not(:last-child):after{content:"";background:var(--border);width:1px;height:32px;position:absolute;top:50%;right:0;transform:translateY(-50%)}.step-num{border:2px solid var(--border);width:32px;height:32px;color:var(--text-muted);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:.8rem;font-weight:700;transition:all .3s;display:flex}.step-item.active .step-num{background:var(--gradient);color:#fff;box-shadow:0 0 16px var(--accent-glow);border-color:#0000}.step-item.done .step-num{background:var(--success-bg);border-color:var(--success);color:var(--success)}.step-label{color:var(--text-muted);font-size:.82rem;font-weight:500;transition:color .3s}.step-item.active .step-label,.step-item.done .step-label{color:var(--text-primary)}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:2rem;transition:border-color .3s,box-shadow .3s}.card:hover{border-color:#ffffff1f}.card-accent{border-color:var(--border-accent);box-shadow:var(--shadow-accent);background:var(--gradient-subtle)}.section-title{color:var(--text-primary);margin-bottom:.4rem;font-size:1.35rem;font-weight:700}.section-desc{color:var(--text-secondary);margin-bottom:1.5rem;font-size:.88rem}.upload-zone{border:2px dashed var(--border);border-radius:var(--radius-lg);text-align:center;cursor:pointer;background:var(--gradient-subtle);padding:3rem 2rem;transition:all .3s;position:relative;overflow:hidden}.upload-zone:before{content:"";opacity:0;background:radial-gradient(#8b5cf61a 0%,#0000 70%);transition:opacity .3s;position:absolute;inset:0}.upload-zone:hover:before,.upload-zone.dragging:before{opacity:1}.upload-zone:hover,.upload-zone.dragging{border-color:var(--accent);box-shadow:0 0 30px var(--accent-glow);transform:translateY(-2px)}.upload-zone.dragging{background:#8b5cf614}.upload-icon{background:var(--accent-glow);width:64px;height:64px;color:var(--accent);border-radius:50%;justify-content:center;align-items:center;margin:0 auto 1.25rem;transition:transform .3s;display:flex}.upload-zone:hover .upload-icon{transform:scale(1.1)}.upload-title{margin-bottom:.4rem;font-size:1.1rem;font-weight:600}.upload-sub{color:var(--text-muted);font-size:.82rem}.upload-btn-area{flex-wrap:wrap;justify-content:center;gap:1rem;margin-top:1.5rem;display:flex}.thumb-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:1rem;margin-top:1.5rem;display:grid}.thumb-item{border-radius:var(--radius);border:2px solid var(--border);background:var(--bg-secondary);aspect-ratio:3/4;cursor:pointer;transition:all .2s;position:relative;overflow:hidden}.thumb-item:hover{border-color:var(--accent);transform:scale(1.02)}.thumb-item.sample-badge:after{content:"SAMPLE";background:var(--gradient);color:#fff;letter-spacing:.06em;border-radius:4px;padding:2px 6px;font-size:.6rem;font-weight:700;position:absolute;top:6px;left:6px}.thumb-item img{object-fit:cover;width:100%;height:100%}.thumb-remove{color:#fff;cursor:pointer;opacity:0;background:#ef4444d9;border:none;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-size:.75rem;transition:opacity .2s;display:flex;position:absolute;top:6px;right:6px}.thumb-item:hover .thumb-remove{opacity:1}.thumb-num{color:var(--text-secondary);background:#09090fcc;border-radius:4px;padding:2px 6px;font-size:.65rem;font-weight:600;position:absolute;bottom:6px;left:6px}.btn{cursor:pointer;white-space:nowrap;border:none;border-radius:10px;align-items:center;gap:8px;padding:.6rem 1.4rem;font-family:Inter,sans-serif;font-size:.875rem;font-weight:600;transition:all .2s;display:inline-flex}.btn-primary{background:var(--gradient);color:#fff;box-shadow:0 4px 16px #8b5cf659}.btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 24px #8b5cf680}.btn-secondary{background:var(--bg-card);color:var(--text-primary);border:1px solid var(--border)}.btn-secondary:hover:not(:disabled){background:var(--bg-card-hover);border-color:var(--accent);color:var(--accent-light)}.btn-ghost{color:var(--text-secondary);background:0 0;border:1px solid #0000}.btn-ghost:hover:not(:disabled){background:var(--bg-card);color:var(--text-primary);border-color:var(--border)}.btn-danger{background:var(--danger-bg);color:var(--danger);border:1px solid #ef44444d}.btn-danger:hover:not(:disabled){background:#ef444433}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none!important}.btn-sm{padding:.4rem .9rem;font-size:.8rem}.btn-lg{border-radius:12px;padding:.8rem 2rem;font-size:.95rem}.columns-area{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);flex-wrap:wrap;gap:.65rem;min-height:60px;padding:1rem;display:flex}.col-chip{background:var(--accent-glow);border:1px solid var(--border-accent);color:var(--accent-light);cursor:grab;-webkit-user-select:none;user-select:none;border-radius:20px;align-items:center;gap:6px;padding:6px 12px;font-size:.82rem;font-weight:500;transition:all .2s;animation:.2s chipIn;display:flex}@keyframes chipIn{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}.col-chip:hover{background:#8b5cf633;transform:translateY(-1px)}.col-chip-x{cursor:pointer;width:16px;height:16px;color:var(--danger);background:#ef444433;border:none;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:.7rem;transition:background .2s;display:flex}.col-chip-x:hover{background:#ef444466}.add-col-row{gap:.6rem;margin-top:1rem;display:flex}.col-input{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-primary);border-radius:10px;outline:none;flex:1;padding:.6rem 1rem;font-family:Inter,sans-serif;font-size:.875rem;transition:border-color .2s}.col-input:focus{border-color:var(--accent)}.col-input::placeholder{color:var(--text-muted)}.ai-badge{border:1px solid var(--border-accent);color:var(--accent-light);letter-spacing:.04em;background:linear-gradient(135deg,#8b5cf633,#6366f133);border-radius:12px;align-items:center;gap:5px;margin-bottom:.75rem;padding:3px 10px;font-size:.72rem;font-weight:600;display:inline-flex}.table-wrapper{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--bg-secondary);max-height:65vh;overflow:auto;box-shadow:0 4px 20px #0003}table{border-collapse:collapse;width:100%;font-size:.875rem}thead{z-index:10;position:sticky;top:0}thead th{background:var(--bg-card);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);text-align:left;color:var(--text-primary);letter-spacing:.05em;text-transform:uppercase;border-bottom:2px solid var(--border);white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;padding:1rem;font-size:.8rem;font-weight:700;transition:color .2s}thead th:hover{color:var(--accent-light)}thead th.sorted{color:var(--accent)}tbody tr{border-bottom:1px solid var(--border);transition:background .15s}tbody tr:nth-child(2n){background:#ffffff05}tbody tr:hover{border-color:var(--border-accent);background:#8b5cf614}tbody tr:last-child{border-bottom:none}tbody td{padding:0}.cell-inner{align-items:center;min-height:48px;padding:.8rem 1rem;display:flex}.cell-input{color:#fff;resize:none;cursor:text;background:0 0;border:none;outline:none;width:100%;min-height:48px;padding:.75rem 1rem;font-family:Inter,sans-serif;font-size:.95rem;font-weight:400;transition:all .2s}.cell-input:focus{box-shadow:inset 0 0 0 1px var(--accent);background:#8b5cf61f;border-radius:6px}.row-num{color:var(--text-muted);text-align:center;border-right:1px solid var(--border);-webkit-user-select:none;user-select:none;width:40px;padding:.6rem .75rem;font-size:.7rem;font-weight:600}.delete-row-btn{opacity:0;cursor:pointer;color:var(--danger);background:0 0;border:none;padding:0 .5rem;font-size:.9rem;transition:opacity .2s}tbody tr:hover .delete-row-btn{opacity:1}.table-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:1rem;display:flex}.table-stats{color:var(--text-muted);font-size:.82rem}.table-stats strong{color:var(--text-primary);font-weight:600}.toolbar-actions{align-items:center;gap:.5rem;display:flex}.progress-bar-wrap{background:var(--border);border-radius:2px;height:4px;margin-top:.75rem;overflow:hidden}.progress-bar-fill{background:var(--gradient);border-radius:2px;height:100%;transition:width .4s}.spinner{border:2px solid var(--border-accent);border-top-color:var(--accent);border-radius:50%;flex-shrink:0;width:20px;height:20px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.status-row{border-radius:var(--radius);color:var(--text-secondary);background:var(--bg-card);border:1px solid var(--border);align-items:center;gap:.75rem;margin-top:.75rem;padding:.75rem 1rem;font-size:.85rem;font-weight:500;display:flex}.status-row.success{background:var(--success-bg);color:var(--success);border-color:#10b9814d}.status-row.error{background:var(--danger-bg);color:var(--danger);border-color:#ef44444d}.alert{border-radius:var(--radius);border:1px solid;align-items:flex-start;gap:.65rem;padding:.85rem 1rem;font-size:.85rem;display:flex}.alert-info{color:#a5b4fc;background:#6366f114;border-color:#6366f140}.alert-warn{color:#fcd34d;background:#f59e0b14;border-color:#f59e0b40}.empty-state{text-align:center;color:var(--text-muted);padding:3rem}.empty-state svg{opacity:.4;margin:0 auto 1rem}.fade-in{animation:.4s fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.slide-up{animation:.3s slideUp}@keyframes slideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}hr.divider{border:none;border-top:1px solid var(--border);margin:1.5rem 0}.tag{border-radius:6px;align-items:center;gap:4px;padding:2px 8px;font-size:.72rem;font-weight:600;display:inline-flex}.tag-purple{background:var(--accent-glow);color:var(--accent-light);border:1px solid var(--border-accent)}.grid-2{grid-template-columns:1fr 1fr;gap:1.5rem;display:grid}@media (max-width:768px){.grid-2{grid-template-columns:1fr}.main-content{padding:1.5rem 1rem}.steps-bar{gap:0;padding:.75rem 1rem}.step-label{display:none}}.modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100;background:#000c;justify-content:center;align-items:center;padding:2rem;animation:.3s fadeIn;display:flex;position:fixed;inset:0}.modal-content{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-lg);width:100%;max-width:500px;box-shadow:var(--shadow-accent);padding:2.5rem;animation:.3s slideUp;position:relative}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.premium-nav{-webkit-backdrop-filter:blur(16px)saturate(200%);z-index:1000;background:#0d0d16a6;border:1px solid #ffffff14;border-radius:20px;justify-content:space-between;align-items:center;width:calc(100% - 2rem);max-width:1000px;height:64px;padding:0 1.5rem;display:flex;position:fixed;top:1.5rem;left:50%;transform:translate(-50%);box-shadow:0 10px 40px -10px #00000080,inset 0 1px 1px #ffffff0f}.nav-logo-link{align-items:center;gap:.75rem;transition:transform .3s cubic-bezier(.34,1.56,.64,1);display:flex;text-decoration:none!important}.nav-logo-link:hover{transform:scale(1.02)}.nav-logo-icon{background:linear-gradient(135deg,#8b5cf6 0%,#6366f1 100%);border-radius:10px;justify-content:center;align-items:center;width:36px;height:36px;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 15px #8b5cf666,inset 0 0 10px #fff3}.nav-logo-icon:after{content:"";background:linear-gradient(45deg,#0000 45%,#ffffff1a 50%,#0000 55%);width:200%;height:200%;animation:3s infinite shine;position:absolute;top:-50%;left:-50%}@keyframes shine{0%{transform:translate(-30%,-30%)rotate(0)}to{transform:translate(30%,30%)rotate(0)}}.nav-logo-text{letter-spacing:-.04em;color:#fff;background:linear-gradient(#fff 0%,#cbd5e1 100%);-webkit-text-fill-color:transparent;-webkit-user-select:none;user-select:none;-webkit-background-clip:text;font-size:1.35rem;font-weight:800}.nav-back-home{text-transform:uppercase;letter-spacing:.1em;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:14px;align-items:center;gap:.6rem;padding:.6rem 1.4rem;font-size:.75rem;font-weight:700;transition:all .4s cubic-bezier(.23,1,.32,1);display:flex;position:relative;overflow:hidden;color:#fff!important;text-decoration:none!important}.nav-back-home:before{content:"";background:linear-gradient(90deg,#0000,#ffffff0d,#0000);transition:transform .5s;position:absolute;inset:0;transform:translate(-100%)}.nav-back-home:hover{background:#ffffff1a;border-color:#8b5cf699;transform:translateY(-2px);box-shadow:0 5px 20px #0006}.nav-back-home:hover:before{transform:translate(100%)}.nav-arrow{color:#8b5cf6;filter:drop-shadow(0 0 5px #8b5cf680);transition:all .3s}.nav-back-home:hover .nav-arrow{color:#fff;transform:translate(-5px)scale(1.1)}@media (max-width:640px){.premium-nav{width:calc(100% - 1.5rem);padding:0 1rem;top:1rem}.nav-logo-text{font-size:1.15rem}.nav-back-home span{display:none}.nav-back-home{border-radius:50%;padding:.7rem}}