@import"https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400&family=Inter:wght@300;400;500&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;font-weight:300;background:#faf9f7;color:#2a2a2a;-webkit-font-smoothing:antialiased}.app{max-width:880px;margin:0 auto;padding:2.5rem 1.5rem 4rem}header{text-align:center;margin-bottom:1rem;padding-bottom:1.5rem;border-bottom:1px solid #e8e4df}header .brand{font-family:Cormorant Garamond,Georgia,serif;font-size:3rem;font-weight:600;letter-spacing:.12em;font-variant:all-small-caps;color:#1a1a1a;margin-bottom:.25rem}header .tagline{font-family:Cormorant Garamond,Georgia,serif;font-size:1.05rem;font-weight:300;font-style:italic;color:#888;letter-spacing:.04em}.hero{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;margin-bottom:2rem}.hero-image img{width:100%;border-radius:4px;object-fit:cover;aspect-ratio:4/5;box-shadow:0 4px 20px #00000014}.steps{display:flex;justify-content:center;gap:0;margin-bottom:2.5rem;padding:1.25rem 0}.step{display:flex;align-items:center;gap:.5rem;color:#bbb;font-size:.8rem;font-weight:400;letter-spacing:.06em;text-transform:uppercase;transition:color .3s}.step.active{color:#1a1a1a}.step.completed{color:#888}.step-number{width:26px;height:26px;border-radius:50%;border:1.5px solid currentColor;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:500;flex-shrink:0}.step.active .step-number{background:#1a1a1a;color:#faf9f7;border-color:#1a1a1a}.step.completed .step-number{background:#c5bfb6;color:#faf9f7;border-color:#c5bfb6}.step-connector{width:40px;height:1px;background:#ddd;margin:0 .75rem;flex-shrink:0}.prompt-input{margin-bottom:2.5rem}.prompt-input label{display:block;font-family:Cormorant Garamond,serif;font-size:1.15rem;font-weight:400;margin-bottom:.75rem;color:#444}.prompt-row{display:flex;gap:.75rem}.prompt-row textarea{flex:1;padding:1rem 1.25rem;border:1px solid #d5d0c8;border-radius:4px;font-size:.95rem;font-family:Inter,sans-serif;font-weight:300;background:#fff;color:#2a2a2a;resize:none;min-height:56px;line-height:1.5;transition:border-color .2s}.prompt-row textarea:focus{outline:none;border-color:#1a1a1a}.prompt-row textarea::placeholder{color:#b5b0a8;font-style:italic}button,.btn{padding:.85rem 2rem;background:#1a1a1a;color:#faf9f7;border:none;border-radius:3px;font-family:Inter,sans-serif;font-size:.85rem;font-weight:400;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:background .2s,opacity .2s}button:hover:not(:disabled){background:#333}button:disabled{opacity:.35;cursor:not-allowed}.error{background:#fdf6f3;color:#9a3412;padding:.75rem 1.25rem;border-radius:4px;margin-bottom:2rem;border:1px solid #f5d5c8;font-size:.9rem}.section-title{font-family:Cormorant Garamond,serif;font-size:1.3rem;font-weight:400;color:#2a2a2a;margin-bottom:1rem;text-align:center}.generated-artwork,.clothing-preview{margin-bottom:2.5rem;text-align:center}.generated-artwork h2,.clothing-preview h2,.clothing-selector h2{font-family:Cormorant Garamond,serif;font-size:1.3rem;font-weight:400;margin-bottom:1.25rem;color:#2a2a2a}.generated-artwork img,.clothing-preview img{max-width:100%;border-radius:4px;box-shadow:0 4px 20px #00000014;margin-bottom:1.25rem}.clothing-selector{margin-bottom:2.5rem}.template-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem}.template-card{display:flex;flex-direction:column;align-items:center;padding:.6rem;background:#fff;border:1.5px solid #e8e4df;border-radius:4px;cursor:pointer;font-size:.8rem;color:#555;font-weight:400;transition:border-color .2s,box-shadow .2s}.template-card img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:2px;margin-bottom:.5rem}.template-name{text-align:center;line-height:1.3;letter-spacing:.02em}.template-card:hover{border-color:#1a1a1a;background:#fff;box-shadow:0 2px 12px #0000000f}.template-card.selected{border-color:#1a1a1a;background:#faf8f5;box-shadow:0 0 0 2px #1a1a1a26}.preview-action{margin-bottom:2.5rem;display:flex;flex-direction:column;gap:.75rem}.preview-action label{font-family:Cormorant Garamond,serif;font-weight:400;font-size:1.1rem;color:#444}.preview-action textarea{width:100%;padding:1rem 1.25rem;border:1px solid #d5d0c8;border-radius:4px;font-size:.9rem;font-family:Inter,sans-serif;font-weight:300;resize:vertical;color:#2a2a2a;background:#fff;transition:border-color .2s}.preview-action textarea:focus{outline:none;border-color:#1a1a1a}.preview-action textarea::placeholder{color:#b5b0a8;font-style:italic}.preview-action button{align-self:center}.conversation-history{margin-bottom:2rem}.conversation-round{margin-bottom:2rem;text-align:center}.round-instruction{background:#f5f3ef;color:#555;padding:.5rem 1.25rem;border-radius:20px;display:inline-block;font-size:.85rem;font-style:italic;margin-bottom:1rem}.round-image{max-width:100%;border-radius:4px;box-shadow:0 4px 20px #00000014}.order-action{text-align:center;margin-bottom:2.5rem}.btn-order{padding:1rem 3rem;background:#1a1a1a;font-size:.9rem;letter-spacing:.12em}.btn-order:hover:not(:disabled){background:#333}.order-confirmation{text-align:center;background:#f5f3ef;border:1px solid #e8e4df;border-radius:4px;padding:2.5rem 2rem;margin-bottom:2.5rem}.order-confirmation h2{font-family:Cormorant Garamond,serif;font-size:1.5rem;font-weight:400;margin-bottom:.75rem;color:#2a2a2a}.order-confirmation p{color:#555;font-size:.95rem;margin-bottom:.5rem}.order-detail{font-style:italic;color:#888;font-size:.85rem}.loading-card{background:#fff;border:1px solid #e8e4df;border-radius:4px;padding:3rem 2rem;display:flex;flex-direction:column;align-items:center;gap:.75rem}.spinner{width:36px;height:36px;border:2px solid #e8e4df;border-top-color:#1a1a1a;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-text{font-family:Cormorant Garamond,serif;color:#2a2a2a;font-weight:400;font-size:1.1rem}.loading-detail{color:#999;font-size:.8rem;max-width:340px;text-align:center;line-height:1.5}.loading-elapsed{color:#bbb;font-size:.75rem;font-variant-numeric:tabular-nums}@media (max-width: 600px){.prompt-row{flex-direction:column}.app{padding:1.5rem 1rem 3rem}header .brand{font-size:2.2rem}.steps{gap:0}.step-connector{width:20px}.step{font-size:.7rem}.template-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.hero{gap:.75rem}}