:root{--bg:#f8fafc;--surface:#fff;--surface-2:#f1f5f9;--border:#e2e8f0;--text-primary:#0f172a;--text-secondary:#64748b;--text-muted:#94a3b8;--purple:#9b30d9;--blue:#2176ff;--gradient:linear-gradient(135deg, #9b30d9, #2176ff);--success:#22c55e;--warning:#f5a623;--danger:#e8362a}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{background:var(--bg);height:100%;color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.card{background:var(--surface);border:1px solid var(--border);border-radius:20px;padding:24px;box-shadow:0 2px 16px #0000000f}.btn-primary{background:var(--gradient);color:#fff;cursor:pointer;white-space:nowrap;border:none;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:12px 28px;font-size:15px;font-weight:600;line-height:1;text-decoration:none;transition:opacity .15s,transform .1s;display:inline-flex}.btn-primary:hover{opacity:.92;transform:translateY(-1px)}.btn-primary:active{opacity:1;transform:translateY(0)}.btn-primary:disabled{opacity:.55;cursor:not-allowed;transform:none}.btn-ghost{color:var(--text-secondary);border:1px solid var(--border);cursor:pointer;white-space:nowrap;background:0 0;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:12px 24px;font-size:15px;font-weight:500;line-height:1;text-decoration:none;transition:background .15s,color .15s;display:inline-flex}.btn-ghost:hover{background:var(--surface-2);color:var(--text-primary)}.field-label{color:var(--text-primary);margin-bottom:6px;font-size:14px;font-weight:600;display:block}.field-input{background:var(--surface);border:1.5px solid var(--border);width:100%;color:var(--text-primary);border-radius:10px;outline:none;padding:11px 14px;font-family:inherit;font-size:15px;transition:border-color .15s,box-shadow .15s}.field-input:focus{border-color:var(--purple);box-shadow:0 0 0 3px #9b30d91f}.field-input::placeholder{color:var(--text-muted)}.field-input.error{border-color:var(--danger);box-shadow:0 0 0 3px #e8362a1a}select.field-input{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2394A3B8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;padding-right:40px}textarea.field-input{resize:vertical;min-height:80px;line-height:1.5}.select-card{cursor:pointer;border:2px solid var(--border);background:var(--surface);border-radius:16px;transition:border-color .15s,box-shadow .15s,transform .1s;position:relative;overflow:hidden}.select-card:hover{border-color:#c084fc;transform:translateY(-1px);box-shadow:0 4px 20px #9b30d91a}.select-card.active{border-color:var(--purple);box-shadow:0 4px 20px #9b30d933}.select-card .checkmark{background:var(--gradient);opacity:0;z-index:1;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;transition:opacity .15s,transform .15s;display:flex;position:absolute;top:10px;right:10px;transform:scale(.6)}.select-card.active .checkmark{opacity:1;transform:scale(1)}.progress-bar{background:var(--border);border-radius:2px;width:100%;height:4px;overflow:hidden}.progress-fill{background:var(--gradient);border-radius:2px;height:100%;transition:width .4s cubic-bezier(.4,0,.2,1)}@keyframes stepIn{0%{opacity:0;transform:translate(24px)}to{opacity:1;transform:translate(0)}}@keyframes stepInBack{0%{opacity:0;transform:translate(-24px)}to{opacity:1;transform:translate(0)}}.step-enter{animation:.28s cubic-bezier(.4,0,.2,1) both stepIn}.step-enter-back{animation:.28s cubic-bezier(.4,0,.2,1) both stepInBack}.error-text{color:var(--danger);margin-top:4px;font-size:12px}.status-chip{text-transform:uppercase;letter-spacing:.3px;border-radius:100px;align-items:center;gap:6px;padding:4px 12px;font-size:12px;font-weight:600;display:inline-flex}.status-chip.new{color:var(--purple);background:#9b30d91a}.status-chip.in-progress{color:#b45309;background:#f5a6231f}.status-chip.delivered{color:#15803d;background:#22c55e1a}.chip{background:var(--surface-2);border:1px solid var(--border);color:var(--text-secondary);white-space:nowrap;border-radius:100px;align-items:center;gap:4px;padding:3px 10px;font-size:12px;display:inline-flex}.toggle-wrapper{cursor:pointer;align-items:center;gap:12px;display:flex}.toggle-track{background:var(--border);border-radius:100px;flex-shrink:0;width:44px;height:24px;transition:background .2s;position:relative}.toggle-track.on{background:var(--purple)}.toggle-thumb{background:#fff;border-radius:50%;width:18px;height:18px;transition:transform .2s;position:absolute;top:3px;left:3px;box-shadow:0 1px 4px #0003}.toggle-track.on .toggle-thumb{transform:translate(20px)}.keyword-chip{color:var(--purple);background:#9b30d914;border-radius:4px;padding:2px 8px;font-size:11px;font-weight:500;display:inline-block}::-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)}.float-field{margin-bottom:0;position:relative}.float-field input,.float-field textarea,.float-field select{border:1.5px solid var(--border);width:100%;color:var(--text-primary);background:#fff;border-radius:14px;outline:none;padding:22px 16px 8px;font-family:inherit;font-size:15px;line-height:1.5;transition:border-color .2s,box-shadow .2s}.float-field textarea{resize:none;min-height:100px}.float-field select{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2394A3B8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-position:right 14px center;background-repeat:no-repeat;padding-right:40px}.float-field input:focus,.float-field textarea:focus,.float-field select:focus{border-color:var(--purple);box-shadow:0 0 0 4px #9b30d91a,0 2px 12px #9b30d914}.float-field label{color:var(--text-muted);pointer-events:none;white-space:nowrap;text-overflow:ellipsis;max-width:calc(100% - 32px);font-size:15px;font-weight:500;transition:top .18s cubic-bezier(.4,0,.2,1),font-size .18s,color .18s,transform .18s;position:absolute;top:50%;left:16px;overflow:hidden;transform:translateY(-50%)}.float-field.textarea-field label{top:20px;transform:none}.float-field.has-value label,.float-field.focused label{color:var(--purple);text-transform:uppercase;letter-spacing:.05em;font-size:11px;font-weight:700;top:10px;transform:none}.float-field.textarea-field.has-value label,.float-field.textarea-field.focused label{top:8px}.float-field:after{content:"";background:var(--gradient);pointer-events:none;border-radius:0 0 14px 14px;width:0;height:2px;transition:width .3s cubic-bezier(.4,0,.2,1),left .3s cubic-bezier(.4,0,.2,1);position:absolute;bottom:1px;left:50%}.float-field.focused:after{width:calc(100% - 4px);left:2px}.char-count{color:var(--text-muted);text-align:right;margin-top:4px;font-size:11px}.color-swatch{cursor:pointer;border:3px solid #0000;border-radius:50%;flex-shrink:0;width:40px;height:40px;transition:transform .15s,box-shadow .15s,border-color .15s}.color-swatch:hover{transform:scale(1.15);box-shadow:0 4px 12px #0003}.color-swatch.active{border-color:#0f172a;box-shadow:0 0 0 3px #9b30d94d}.harmony-card{border:2px solid var(--border);cursor:pointer;background:#fff;border-radius:16px;padding:16px;transition:border-color .15s,box-shadow .15s,transform .1s}.harmony-card:hover{border-color:#c084fc;transform:translateY(-1px)}.harmony-card.active{border-color:var(--purple);box-shadow:0 0 0 4px #9b30d91a}.mini-preview{border:1px solid var(--border);border-radius:12px;overflow:hidden}.style-carousel{scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:16px;padding:8px 4px 16px;display:flex;overflow-x:auto}.style-carousel::-webkit-scrollbar{display:none}.carousel-card{scroll-snap-align:start;border:2.5px solid var(--border);cursor:pointer;background:#fff;border-radius:16px;flex-shrink:0;width:240px;transition:border-color .15s,box-shadow .15s,transform .12s;overflow:hidden}.carousel-card:hover{border-color:#c084fc;transform:translateY(-2px);box-shadow:0 8px 24px #9b30d91f}.carousel-card.active{border-color:var(--purple);box-shadow:0 0 0 4px #9b30d91f}.carousel-card img{object-fit:cover;width:100%;height:160px;display:block}.carousel-card .card-img-placeholder{justify-content:center;align-items:center;width:100%;height:160px;display:flex}.style-notes-panel{background:#9b30d90a;border:1.5px solid #9b30d933;border-radius:16px;margin-top:16px;padding:20px;animation:.2s both stepIn}
