@import url(https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap);body{-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}:root{--bg-primary:#0a0a0a;--bg-secondary:#111;--bg-card:#1a1a1a;--bg-card-hover:#222;--accent:#8b5cf6;--accent-hover:#7c3aed;--accent-glow:rgba(139,92,246,.3);--text-primary:#f5f5f5;--text-secondary:#a3a3a3;--text-muted:#666;--border:#2a2a2a;--radius:12px;--radius-lg:20px;--transition:0.3s cubic-bezier(0.4,0,0.2,1);--navbar-bg:hsla(0,0%,4%,.8);--shadow-card:0 2px 16px rgba(0,0,0,.4)}[data-theme=light]{--bg-primary:#f8f8fc;--bg-secondary:#f0eff8;--bg-card:#fff;--bg-card-hover:#f3f2fb;--accent:#7c3aed;--accent-hover:#6d28d9;--accent-glow:rgba(124,58,237,.2);--text-primary:#0f0f1a;--text-secondary:#4b4b6a;--text-muted:#88a;--border:#e0dff0;--navbar-bg:rgba(248,248,252,.85);--shadow-card:0 2px 16px rgba(100,80,200,.08)}[data-theme=light] body{background-color:#0a0a0a;background-color:var(--bg-primary);color:#f5f5f5;color:var(--text-primary)}[data-theme=light] .navbar{background:hsla(0,0%,4%,.8);background:var(--navbar-bg);border-bottom-color:#2a2a2a;border-bottom-color:var(--border)}[data-theme=light] .hero-orb-1{background:radial-gradient(circle,rgba(124,58,237,.2) 0,rgba(124,58,237,.06) 50%,transparent 70%)}[data-theme=light] .hero-orb-2{background:radial-gradient(circle,rgba(167,139,250,.15) 0,transparent 65%)}[data-theme=light] .hero-orb-3{background:radial-gradient(circle,rgba(244,114,182,.12) 0,transparent 65%)}[data-theme=light] .create-preview-panel,[data-theme=light] .gallery-card,[data-theme=light] .gift-reason-card,[data-theme=light] .preview-empty,[data-theme=light] .step-card{box-shadow:0 2px 16px rgba(0,0,0,.4);box-shadow:var(--shadow-card)}[data-theme=light] .prompt-input-wrap input{background:#fff;color:#f5f5f5;color:var(--text-primary)}.App,.footer,.gallery-card,.gift-reason-card,.navbar,.preview-empty,.prompt-input-wrap input,.step-card,body{transition:background-color .3s ease,color .3s ease,border-color .3s ease}body{-webkit-font-smoothing:antialiased;background-color:#0a0a0a;background-color:var(--bg-primary);color:#f5f5f5;color:var(--text-primary);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.6}.App{display:flex;flex-direction:column;min-height:100vh}.navbar{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:hsla(0,0%,4%,.8);background:var(--navbar-bg,hsla(0,0%,4%,.8));border-bottom:1px solid #2a2a2a;border-bottom:1px solid var(--border);justify-content:space-between;left:0;padding:1rem 2rem;position:fixed;right:0;top:0;z-index:100}.navbar,.navbar-right{align-items:center;display:flex}.navbar-right{gap:1.5rem}.theme-toggle{align-items:center;background:#1a1a1a;background:var(--bg-card);border:1px solid #2a2a2a;border:1px solid var(--border);border-radius:50%;color:#a3a3a3;color:var(--text-secondary);cursor:pointer;display:flex;flex-shrink:0;height:36px;justify-content:center;transition:background .3s cubic-bezier(.4,0,.2,1),color .3s cubic-bezier(.4,0,.2,1),border-color .3s cubic-bezier(.4,0,.2,1),-webkit-transform .2s ease;transition:background .3s cubic-bezier(.4,0,.2,1),color .3s cubic-bezier(.4,0,.2,1),border-color .3s cubic-bezier(.4,0,.2,1),transform .2s ease;transition:background .3s cubic-bezier(.4,0,.2,1),color .3s cubic-bezier(.4,0,.2,1),border-color .3s cubic-bezier(.4,0,.2,1),transform .2s ease,-webkit-transform .2s ease;transition:background var(--transition),color var(--transition),border-color var(--transition),-webkit-transform .2s ease;transition:background var(--transition),color var(--transition),border-color var(--transition),transform .2s ease;transition:background var(--transition),color var(--transition),border-color var(--transition),transform .2s ease,-webkit-transform .2s ease;width:36px}.theme-toggle:hover{background:#222;background:var(--bg-card-hover);border-color:#8b5cf6;border-color:var(--accent);color:#8b5cf6;color:var(--accent);-webkit-transform:rotate(20deg) scale(1.08);transform:rotate(20deg) scale(1.08)}.navbar-logo{-webkit-text-fill-color:transparent;background:linear-gradient(135deg,#8b5cf6,#c084fc);background:linear-gradient(135deg,var(--accent),#c084fc);-webkit-background-clip:text;background-clip:text;font-size:1.5rem;font-weight:800}.navbar-links{display:flex;gap:2rem;list-style:none}.navbar-links a{color:#a3a3a3;color:var(--text-secondary);font-size:.9rem;font-weight:500;text-decoration:none;transition:color .3s cubic-bezier(.4,0,.2,1);transition:color var(--transition)}.navbar-links a:hover{color:#8b5cf6;color:var(--accent)}.hero{overflow:hidden;padding:10rem 2rem 4rem;position:relative;text-align:center}@-webkit-keyframes orbFloat1{0%,to{opacity:.55;-webkit-transform:translate(-50%) scale(1);transform:translate(-50%) scale(1)}33%{opacity:.7;-webkit-transform:translate(-60%,-8%) scale(1.12);transform:translate(-60%,-8%) scale(1.12)}66%{opacity:.5;-webkit-transform:translate(-42%,6%) scale(.92);transform:translate(-42%,6%) scale(.92)}}@keyframes orbFloat1{0%,to{opacity:.55;-webkit-transform:translate(-50%) scale(1);transform:translate(-50%) scale(1)}33%{opacity:.7;-webkit-transform:translate(-60%,-8%) scale(1.12);transform:translate(-60%,-8%) scale(1.12)}66%{opacity:.5;-webkit-transform:translate(-42%,6%) scale(.92);transform:translate(-42%,6%) scale(.92)}}@-webkit-keyframes orbFloat2{0%,to{opacity:.3;-webkit-transform:translate(0) scale(1);transform:translate(0) scale(1)}40%{opacity:.45;-webkit-transform:translate(8%,-12%) scale(1.18);transform:translate(8%,-12%) scale(1.18)}75%{opacity:.25;-webkit-transform:translate(-5%,8%) scale(.88);transform:translate(-5%,8%) scale(.88)}}@keyframes orbFloat2{0%,to{opacity:.3;-webkit-transform:translate(0) scale(1);transform:translate(0) scale(1)}40%{opacity:.45;-webkit-transform:translate(8%,-12%) scale(1.18);transform:translate(8%,-12%) scale(1.18)}75%{opacity:.25;-webkit-transform:translate(-5%,8%) scale(.88);transform:translate(-5%,8%) scale(.88)}}@-webkit-keyframes orbFloat3{0%,to{opacity:.2;-webkit-transform:translate(0) scale(1);transform:translate(0) scale(1)}30%{opacity:.35;-webkit-transform:translate(-10%,10%) scale(1.1);transform:translate(-10%,10%) scale(1.1)}65%{opacity:.18;-webkit-transform:translate(6%,-5%) scale(.95);transform:translate(6%,-5%) scale(.95)}}@keyframes orbFloat3{0%,to{opacity:.2;-webkit-transform:translate(0) scale(1);transform:translate(0) scale(1)}30%{opacity:.35;-webkit-transform:translate(-10%,10%) scale(1.1);transform:translate(-10%,10%) scale(1.1)}65%{opacity:.18;-webkit-transform:translate(6%,-5%) scale(.95);transform:translate(6%,-5%) scale(.95)}}.hero-orb{border-radius:50%;-webkit-filter:blur(60px);filter:blur(60px);pointer-events:none;position:absolute;z-index:0}.hero-orb-1{-webkit-animation:orbFloat1 12s ease-in-out infinite;animation:orbFloat1 12s ease-in-out infinite;background:radial-gradient(circle,rgba(139,92,246,.45) 0,rgba(139,92,246,.1) 50%,transparent 70%);height:700px;left:50%;top:-20%;width:700px}.hero-orb-2{-webkit-animation:orbFloat2 16s ease-in-out infinite;animation:orbFloat2 16s ease-in-out infinite;background:radial-gradient(circle,rgba(192,132,252,.3) 0,transparent 65%);height:420px;left:15%;top:10%;width:420px}.hero-orb-3{-webkit-animation:orbFloat3 20s ease-in-out infinite;animation:orbFloat3 20s ease-in-out infinite;background:radial-gradient(circle,rgba(244,114,182,.2) 0,transparent 65%);height:360px;right:10%;top:5%;width:360px}.hero h1{font-size:clamp(2.5rem,6vw,5rem);font-weight:900;line-height:1.1;margin-bottom:1.5rem;position:relative;z-index:1}.hero h1 .gradient-text{-webkit-text-fill-color:transparent;background:linear-gradient(135deg,#8b5cf6,#c084fc,#f472b6);background:linear-gradient(135deg,var(--accent),#c084fc,#f472b6);-webkit-background-clip:text;background-clip:text}.hero p{color:#a3a3a3;color:var(--text-secondary);font-size:clamp(1rem,2vw,1.25rem);margin:0 auto 2rem;max-width:600px}.hero p,.hero-badge{position:relative;z-index:1}.hero-badge{align-items:center;background:rgba(139,92,246,.1);border:1px solid rgba(139,92,246,.3);border-radius:999px;color:#c084fc;display:inline-flex;font-size:.85rem;font-weight:500;gap:.5rem;margin-bottom:1.5rem;padding:.4rem 1rem}.hero-products{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center;position:relative;z-index:1}.hero-product-badge{background:#1a1a1a;background:var(--bg-card);border:1px solid #2a2a2a;border:1px solid var(--border);border-radius:999px;display:flex;font-size:.9rem;font-weight:500;gap:.4rem;padding:.5rem 1.2rem}.gift-banner,.hero-product-badge{align-items:center;color:#a3a3a3;color:var(--text-secondary)}.gift-banner{background:linear-gradient(135deg,rgba(251,191,36,.08),rgba(251,146,60,.08));border:1px solid rgba(251,191,36,.25);border-radius:999px;display:inline-flex;font-size:.95rem;gap:.6rem;margin-top:1.5rem;padding:.6rem 1.4rem;position:relative;z-index:1}.gift-banner strong{color:#fbbf24}.gift-icon{font-size:1.1rem}.gift-section{background:linear-gradient(180deg,transparent,rgba(139,92,246,.04),transparent);border-bottom:1px solid #2a2a2a;border-bottom:1px solid var(--border);border-top:1px solid #2a2a2a;border-top:1px solid var(--border);padding:6rem 2rem}.gift-section-inner{margin:0 auto;max-width:1100px;text-align:center}.gift-section-label{align-items:center;background:rgba(251,191,36,.08);border:1px solid rgba(251,191,36,.2);border-radius:999px;color:#fbbf24;display:inline-flex;font-size:.85rem;font-weight:600;gap:.4rem;letter-spacing:.02em;margin-bottom:1.5rem;padding:.4rem 1rem}.gift-reasons{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(4,1fr);margin:3rem 0}@media (max-width:900px){.gift-reasons{grid-template-columns:repeat(2,1fr)}}@media (max-width:540px){.gift-reasons{grid-template-columns:1fr}}.gift-reason-card{background:#1a1a1a;background:var(--bg-card);border:1px solid #2a2a2a;border:1px solid var(--border);border-radius:20px;border-radius:var(--radius-lg);padding:2rem 1.5rem;transition:border-color .3s cubic-bezier(.4,0,.2,1),-webkit-transform .3s cubic-bezier(.4,0,.2,1);transition:border-color .3s cubic-bezier(.4,0,.2,1),transform .3s cubic-bezier(.4,0,.2,1);transition:border-color .3s cubic-bezier(.4,0,.2,1),transform .3s cubic-bezier(.4,0,.2,1),-webkit-transform .3s cubic-bezier(.4,0,.2,1);transition:border-color var(--transition),-webkit-transform var(--transition);transition:border-color var(--transition),transform var(--transition);transition:border-color var(--transition),transform var(--transition),-webkit-transform var(--transition)}.gift-reason-card:hover{border-color:#fbbf24;-webkit-transform:translateY(-4px);transform:translateY(-4px)}.gift-reason-icon{font-size:2rem;margin-bottom:.75rem}.gift-reason-card h4{color:#f5f5f5;color:var(--text-primary);font-size:1rem;font-weight:700;margin-bottom:.5rem}.gift-reason-card p{color:#a3a3a3;color:var(--text-secondary);font-size:.875rem;line-height:1.6}.gift-cta-btn{align-items:center;background:linear-gradient(135deg,#f59e0b,#f97316);border:none;border-radius:999px;box-shadow:0 4px 20px rgba(245,158,11,.3);color:#fff;cursor:pointer;display:inline-flex;font-size:1.05rem;font-weight:700;gap:.5rem;padding:1rem 2.5rem;text-decoration:none;transition:all .3s cubic-bezier(.4,0,.2,1);transition:all var(--transition)}.gift-cta-btn:hover{box-shadow:0 8px 30px rgba(245,158,11,.5);-webkit-transform:translateY(-2px);transform:translateY(-2px)}.trending-prompts{align-items:center;-webkit-animation:fadeInUp .5s ease both;animation:fadeInUp .5s ease both;display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;margin:-1rem auto 1.5rem;max-width:900px;padding:0 2rem}.trending-label{color:#666;color:var(--text-muted,#888);flex-shrink:0;font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.trending-chips{align-items:center;display:flex;flex-wrap:wrap;gap:.5rem}.trending-chip{align-items:center;background:rgba(168,85,247,.1);border:1px solid rgba(168,85,247,.25);border-radius:999px;color:#f5f5f5;color:var(--text-primary,#e5e7eb);cursor:pointer;display:inline-flex;font-size:.75rem;gap:.35rem;max-width:220px;padding:.3rem .7rem;transition:background .2s,border-color .2s,-webkit-transform .15s;transition:background .2s,border-color .2s,transform .15s;transition:background .2s,border-color .2s,transform .15s,-webkit-transform .15s;white-space:nowrap}.trending-chip:hover{background:rgba(168,85,247,.22);border-color:rgba(168,85,247,.5);-webkit-transform:translateY(-1px);transform:translateY(-1px)}.trending-chip-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.trending-chip-count{color:#a855f7;color:var(--accent-purple,#a855f7);flex-shrink:0;font-size:.65rem;font-weight:700}.create-section{grid-gap:3rem;align-items:start;display:grid;gap:3rem;grid-template-columns:1fr 1fr;margin:0 auto;max-width:1200px;padding:4rem 2rem 6rem}.create-left{display:flex;flex-direction:column;gap:1.5rem}.create-title{font-size:2rem;font-weight:800}.create-subtitle{color:#a3a3a3;color:var(--text-secondary);margin-top:-1rem}.create-actions{display:flex;flex-direction:column;gap:1.25rem}.dalle-badge{align-items:center;color:#666;color:var(--text-muted);display:inline-flex;font-size:.72rem;gap:.4rem;letter-spacing:.03em;margin-top:.5rem;opacity:.7;transition:opacity .3s cubic-bezier(.4,0,.2,1);transition:opacity var(--transition)}.dalle-badge:hover{opacity:1}.dalle-badge-dot{background:#8b5cf6;background:var(--accent);border-radius:50%;flex-shrink:0;height:6px;opacity:.8;width:6px}.create-right{background:#1a1a1a;background:var(--bg-card);border:1px solid #2a2a2a;border:1px solid var(--border);border-radius:20px;border-radius:var(--radius-lg);justify-content:center;min-height:520px;overflow:hidden;position:-webkit-sticky;position:sticky;top:5rem}.create-right,.preview-empty{align-items:center;display:flex}.preview-empty{flex-direction:column;gap:.75rem;padding:3rem;text-align:center}.preview-empty-icon{font-size:3rem;opacity:.4}.preview-empty p{color:#a3a3a3;color:var(--text-secondary);font-size:1rem;font-weight:500}.preview-empty span{color:#666;color:var(--text-muted);font-size:.85rem}.mockup-results-inline{margin-top:.5rem}.mockup-results-inline h4{color:#a3a3a3;color:var(--text-secondary);font-size:1rem;font-weight:600;margin-bottom:1rem}@media (max-width:860px){.create-section{grid-template-columns:1fr}.create-right{min-height:400px;position:static}}.prompt-section{margin:0;max-width:100%;padding:0;position:relative}.prompt-form{background:#1a1a1a;background:var(--bg-card);border:1px solid #2a2a2a;border:1px solid var(--border);border-radius:20px;border-radius:var(--radius-lg);display:flex;gap:.75rem;padding:.5rem;transition:border-color .3s cubic-bezier(.4,0,.2,1),box-shadow .3s cubic-bezier(.4,0,.2,1);transition:border-color var(--transition),box-shadow var(--transition)}.prompt-form:focus-within{border-color:#8b5cf6;border-color:var(--accent);box-shadow:0 0 0 4px rgba(139,92,246,.3);box-shadow:0 0 0 4px var(--accent-glow)}.prompt-input{background:transparent;border:none;color:#f5f5f5;color:var(--text-primary);flex:1 1;font-family:inherit;font-size:1rem;outline:none;padding:1rem 1.25rem}.prompt-input::-webkit-input-placeholder{color:#666;color:var(--text-muted)}.prompt-input::placeholder{color:#666;color:var(--text-muted)}@-webkit-keyframes promptHighlight{0%{border-color:#8b5cf6;border-color:var(--accent);box-shadow:0 0 0 0 rgba(139,92,246,.8)}40%{border-color:#8b5cf6;border-color:var(--accent);box-shadow:0 0 0 8px rgba(139,92,246,.4)}to{border-color:#8b5cf6;border-color:var(--accent);box-shadow:0 0 0 4px rgba(139,92,246,0)}}@keyframes promptHighlight{0%{border-color:#8b5cf6;border-color:var(--accent);box-shadow:0 0 0 0 rgba(139,92,246,.8)}40%{border-color:#8b5cf6;border-color:var(--accent);box-shadow:0 0 0 8px rgba(139,92,246,.4)}to{border-color:#8b5cf6;border-color:var(--accent);box-shadow:0 0 0 4px rgba(139,92,246,0)}}.prompt-input--highlighted{-webkit-animation:none;animation:none}.prompt-form:has(.prompt-input--highlighted){-webkit-animation:promptHighlight 1.2s cubic-bezier(.4,0,.2,1) forwards;animation:promptHighlight 1.2s cubic-bezier(.4,0,.2,1) forwards;border-color:#8b5cf6;border-color:var(--accent)}.surprise-btn{background:transparent;border:none;border-radius:12px;border-radius:var(--radius);cursor:pointer;flex-shrink:0;font-size:1.25rem;line-height:1;margin-left:.25rem;opacity:.7;padding:.5rem .65rem;transition:opacity .2s,-webkit-transform .2s cubic-bezier(.34,1.56,.64,1);transition:transform .2s cubic-bezier(.34,1.56,.64,1),opacity .2s;transition:transform .2s cubic-bezier(.34,1.56,.64,1),opacity .2s,-webkit-transform .2s cubic-bezier(.34,1.56,.64,1)}.surprise-btn:hover{opacity:1;-webkit-transform:scale(1.2) rotate(20deg);transform:scale(1.2) rotate(20deg)}.surprise-btn:active{-webkit-transform:scale(.92) rotate(-10deg);transform:scale(.92) rotate(-10deg)}.surprise-btn:disabled{cursor:not-allowed;opacity:.3;-webkit-transform:none;transform:none}@-webkit-keyframes surprisePop{0%{-webkit-transform:scale(1) rotate(0deg);transform:scale(1) rotate(0deg)}30%{-webkit-transform:scale(1.4) rotate(25deg);transform:scale(1.4) rotate(25deg)}60%{-webkit-transform:scale(.9) rotate(-10deg);transform:scale(.9) rotate(-10deg)}to{-webkit-transform:scale(1) rotate(0deg);transform:scale(1) rotate(0deg)}}@keyframes surprisePop{0%{-webkit-transform:scale(1) rotate(0deg);transform:scale(1) rotate(0deg)}30%{-webkit-transform:scale(1.4) rotate(25deg);transform:scale(1.4) rotate(25deg)}60%{-webkit-transform:scale(.9) rotate(-10deg);transform:scale(.9) rotate(-10deg)}to{-webkit-transform:scale(1) rotate(0deg);transform:scale(1) rotate(0deg)}}.surprise-btn.surprise-pulse{-webkit-animation:surprisePop .5s cubic-bezier(.34,1.56,.64,1) forwards;animation:surprisePop .5s cubic-bezier(.34,1.56,.64,1) forwards}.prompt-submit{background:linear-gradient(135deg,#8b5cf6,#7c3aed);background:linear-gradient(135deg,var(--accent),var(--accent-hover));border:none;border-radius:12px;border-radius:var(--radius);color:#fff;cursor:pointer;font-family:inherit;font-size:1rem;font-weight:600;padding:1rem 2rem;transition:box-shadow .3s cubic-bezier(.4,0,.2,1),-webkit-transform .3s cubic-bezier(.4,0,.2,1);transition:transform .3s cubic-bezier(.4,0,.2,1),box-shadow .3s cubic-bezier(.4,0,.2,1);transition:transform .3s cubic-bezier(.4,0,.2,1),box-shadow .3s cubic-bezier(.4,0,.2,1),-webkit-transform .3s cubic-bezier(.4,0,.2,1);transition:box-shadow var(--transition),-webkit-transform var(--transition);transition:transform var(--transition),box-shadow var(--transition);transition:transform var(--transition),box-shadow var(--transition),-webkit-transform var(--transition);white-space:nowrap}.prompt-submit:hover{box-shadow:0 4px 20px rgba(139,92,246,.3);box-shadow:0 4px 20px var(--accent-glow);-webkit-transform:translateY(-1px);transform:translateY(-1px)}.prompt-submit:disabled{cursor:not-allowed;opacity:.6;-webkit-transform:none;transform:none}.prompt-history-dropdown{-webkit-animation:historyFadeIn .15s ease;animation:historyFadeIn .15s ease;background:#1a1a1a;background:var(--bg-card);border:1px solid #2a2a2a;border:1px solid var(--border);border-radius:12px;border-radius:var(--radius);box-shadow:0 8px 32px rgba(0,0,0,.4);left:0;overflow:hidden;position:absolute;right:0;top:calc(100% + 6px);z-index:200}@-webkit-keyframes historyFadeIn{0%{opacity:0;-webkit-transform:translateY(-4px);transform:translateY(-4px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes historyFadeIn{0%{opacity:0;-webkit-transform:translateY(-4px);transform:translateY(-4px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}.prompt-history-header{align-items:center;border-bottom:1px solid #2a2a2a;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;padding:.5rem .9rem}.prompt-history-label{font-weight:600;letter-spacing:.05em;text-transform:uppercase}.prompt-history-clear,.prompt-history-label{color:#666;color:var(--text-muted);font-size:.75rem}.prompt-history-clear{background:none;border:none;border-radius:4px;cursor:pointer;font-family:inherit;padding:.1rem .4rem;transition:color .3s cubic-bezier(.4,0,.2,1),background .3s cubic-bezier(.4,0,.2,1);transition:color var(--transition),background var(--transition)}.prompt-history-clear:hover{background:rgba(139,92,246,.3);background:var(--accent-glow);color:#8b5cf6;color:var(--accent)}.prompt-history-list{list-style:none;margin:0;max-height:240px;overflow-y:auto;padding:.3rem 0}.prompt-history-item{align-items:center;background:none;border:none;color:#a3a3a3;color:var(--text-secondary);cursor:pointer;display:flex;font-family:inherit;font-size:.88rem;gap:.65rem;padding:.6rem .9rem;text-align:left;transition:background .3s cubic-bezier(.4,0,.2,1),color .3s cubic-bezier(.4,0,.2,1);transition:background var(--transition),color var(--transition);width:100%}.prompt-history-item:hover{background:#222;background:var(--bg-card-hover);color:#f5f5f5;color:var(--text-primary)}.history-icon{color:#666;color:var(--text-muted);flex-shrink:0;font-size:.75rem;font-style:normal}.history-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.prompt-chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.75rem}.prompt-chip{align-items:center;background:#1a1a1a;background:var(--bg-card);border:1px solid #2a2a2a;border:1px solid var(--border);border-radius:999px;color:#a3a3a3;color:var(--text-secondary);cursor:pointer;display:inline-flex;font-family:inherit;font-size:.82rem;font-weight:500;gap:.3rem;padding:.35rem .9rem;transition:all .3s cubic-bezier(.4,0,.2,1);transition:all var(--transition);white-space:nowrap}.prompt-chip:hover:not(:disabled){background:rgba(139,92,246,.08);border-color:#8b5cf6;border-color:var(--accent);color:#f5f5f5;color:var(--text-primary);-webkit-transform:translateY(-1px);transform:translateY(-1px)}.prompt-chip.active{background:rgba(139,92,246,.12);border-color:#8b5cf6;border-color:var(--accent);color:#8b5cf6;color:var(--accent)}.prompt-chip:disabled{cursor:not-allowed;opacity:.5}.preview-section{margin:4rem auto;max-width:1000px;padding:0 2rem}.product-tabs{gap:.5rem;justify-content:center}.tab-btn{background:#1a1a1a;background:var(--bg-card);border:1px solid #2a2a2a;border:1px solid var(--border);border-radius:999px;color:#a3a3a3;color:var(--text-secondary);font-size:.95rem;font-weight:500;padding:.75rem 2rem;transition:all var(--transition)}.tab-btn:hover:not(.active){border-color:#8b5cf6;border-color:var(--accent);color:#f5f5f5;color:var(--text-primary)}.phone-mockup-container{align-items:center;display:flex;flex-direction:column;gap:2rem}.phone-svg-wrapper{-webkit-filter:drop-shadow(0 24px 48px rgba(0,0,0,.7)) drop-shadow(0 4px 12px rgba(0,0,0,.5));filter:drop-shadow(0 24px 48px rgba(0,0,0,.7)) drop-shadow(0 4px 12px rgba(0,0,0,.5));max-width:100%;transition:-webkit-transform .3s ease;transition:transform .3s ease;transition:transform .3s ease,-webkit-transform .3s ease;width:260px}.phone-svg-wrapper:hover{-webkit-transform:translateY(-4px) scale(1.02);transform:translateY(-4px) scale(1.02)}.phone-svg{display:block;height:auto;width:100%}.phone-frame{background:#1a1a1a;border:3px solid #333;border-radius:40px;box-shadow:0 0 0 2px #1a1a1a,0 20px 60px rgba(0,0,0,.5),inset 0 0 0 2px #2a2a2a;height:560px;overflow:hidden;padding:12px;position:relative;width:280px}.phone-notch{background:#1a1a1a;border-radius:0 0 16px 16px;height:28px;left:50%;position:absolute;top:8px;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:100px;z-index:2}.phone-screen{background:#0a0a0a;border-radius:28px;height:100%;overflow:hidden;width:100%}.phone-screen img{height:100%;object-fit:cover;width:100%}.tshirt-viewer-container{align-items:center;display:flex;flex-direction:column;gap:2rem}.tshirt-canvas{background:#111;background:var(--bg-secondary);border:1px solid #2a2a2a;border:1px solid var(--border);border-radius:20px;border-radius:var(--radius-lg);height:500px;overflow:hidden;width:100%}.drag-hint{color:#666;color:var(--text-muted);font-size:.85rem}.order-btn{align-items:center;background:linear-gradient(135deg,#8b5cf6,#7c3aed);background:linear-gradient(135deg,var(--accent),#7c3aed);border:none;border-radius:999px;color:#fff;cursor:pointer;display:inline-flex;font-family:inherit;font-size:1.1rem;font-weight:600;gap:.5rem;padding:1rem 2.5rem;transition:all .3s cubic-bezier(.4,0,.2,1);transition:all var(--transition)}.order-btn:hover{box-shadow:0 8px 30px rgba(139,92,246,.3);box-shadow:0 8px 30px var(--accent-glow);-webkit-transform:translateY(-2px);transform:translateY(-2px)}.order-btn:disabled{cursor:not-allowed;opacity:.5;-webkit-transform:none;transform:none}.mockup-results{margin:2rem auto;max-width:1000px;padding:0 2rem}.mockup-results h3{font-size:1.5rem;margin-bottom:1.5rem;text-align:center}.mockup-grid{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.mockup-grid img{border:1px solid #2a2a2a;border:1px solid var(--border);border-radius:12px;border-radius:var(--radius);transition:-webkit-transform .3s cubic-bezier(.4,0,.2,1);transition:transform .3s cubic-bezier(.4,0,.2,1);transition:transform .3s cubic-bezier(.4,0,.2,1),-webkit-transform .3s cubic-bezier(.4,0,.2,1);transition:-webkit-transform var(--transition);transition:transform var(--transition);transition:transform var(--transition),-webkit-transform var(--transition);width:100%}.mockup-grid img:hover{-webkit-transform:scale(1.02);transform:scale(1.02)}.visit-store-btn{background:transparent;border:2px solid #8b5cf6;border:2px solid var(--accent);border-radius:999px;color:#8b5cf6;color:var(--accent);cursor:pointer;display:block;font-family:inherit;font-size:1rem;font-weight:600;margin:2rem auto 0;padding:1rem 3rem;transition:all .3s cubic-bezier(.4,0,.2,1);transition:all var(--transition)}.visit-store-btn:hover{background:#8b5cf6;background:var(--accent);color:#fff}.how-it-works{margin:0 auto;max-width:1100px;padding:6rem 2rem}.steps-grid{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(4,1fr);margin-top:3rem}@media (max-width:900px){.steps-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:600px){.steps-grid{grid-template-columns:1fr}}.step-card{background:#1a1a1a;background:var(--bg-card);border:1px solid #2a2a2a;border:1px solid var(--border);border-radius:20px;border-radius:var(--radius-lg);padding:2rem;position:relative;transition:border-color .3s cubic-bezier(.4,0,.2,1),-webkit-transform .3s cubic-bezier(.4,0,.2,1);transition:border-color .3s cubic-bezier(.4,0,.2,1),transform .3s cubic-bezier(.4,0,.2,1);transition:border-color .3s cubic-bezier(.4,0,.2,1),transform .3s cubic-bezier(.4,0,.2,1),-webkit-transform .3s cubic-bezier(.4,0,.2,1);transition:border-color var(--transition),-webkit-transform var(--transition);transition:border-color var(--transition),transform var(--transition);transition:border-color var(--transition),transform var(--transition),-webkit-transform var(--transition)}.step-card:hover{border-color:#8b5cf6;border-color:var(--accent);-webkit-transform:translateY(-4px);transform:translateY(-4px)}.step-number{color:#8b5cf6;color:var(--accent);font-size:.75rem;font-weight:700;letter-spacing:.1em;margin-bottom:.75rem}.step-icon{font-size:2rem;margin-bottom:1rem}.step-title{color:#f5f5f5;color:var(--text-primary);font-size:1.1rem;font-weight:700;margin-bottom:.5rem}.step-desc{color:#a3a3a3;color:var(--text-secondary);font-size:.9rem;line-height:1.6}.gallery-section{margin:0 auto;max-width:1200px;padding:6rem 2rem}.section-title{font-size:clamp(1.8rem,4vw,2.5rem);font-weight:800;margin-bottom:1rem;text-align:center}.section-subtitle{color:#a3a3a3;color:var(--text-secondary);font-size:1.1rem;margin-bottom:3rem;text-align:center}.gallery-grid{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(3,1fr)}@media (max-width:900px){.gallery-grid{grid-template-columns:repeat(2,1fr)}}.gallery-item{aspect-ratio:1;border:1px solid #2a2a2a;border:1px solid var(--border);border-radius:12px;border-radius:var(--radius);cursor:pointer;transition:box-shadow .3s cubic-bezier(.4,0,.2,1),-webkit-transform .3s cubic-bezier(.4,0,.2,1);transition:transform .3s cubic-bezier(.4,0,.2,1),box-shadow .3s cubic-bezier(.4,0,.2,1);transition:transform .3s cubic-bezier(.4,0,.2,1),box-shadow .3s cubic-bezier(.4,0,.2,1),-webkit-transform .3s cubic-bezier(.4,0,.2,1);transition:box-shadow var(--transition),-webkit-transform var(--transition);transition:transform var(--transition),box-shadow var(--transition);transition:transform var(--transition),box-shadow var(--transition),-webkit-transform var(--transition)}.gallery-item:hover{box-shadow:0 12px 40px rgba(0,0,0,.4);-webkit-transform:translateY(-4px);transform:translateY(-4px)}.gallery-item img{height:100%;object-fit:cover;transition:-webkit-transform .3s cubic-bezier(.4,0,.2,1);transition:transform .3s cubic-bezier(.4,0,.2,1);transition:transform .3s cubic-bezier(.4,0,.2,1),-webkit-transform .3s cubic-bezier(.4,0,.2,1);transition:-webkit-transform var(--transition);transition:transform var(--transition);transition:transform var(--transition),-webkit-transform var(--transition);width:100%}.gallery-item:hover img{-webkit-transform:scale(1.05);transform:scale(1.05)}.prog-img-container{display:block;height:100%;width:100%}.prog-img-skeleton{border-radius:0}.gallery-item-overlay{background:linear-gradient(transparent,rgba(0,0,0,.88));bottom:0;display:flex;flex-direction:column;gap:.5rem;left:0;opacity:0;padding:1.25rem;position:absolute;right:0;transition:opacity .3s cubic-bezier(.4,0,.2,1);transition:opacity var(--transition)}.gallery-item:hover .gallery-item-overlay{opacity:1}.gallery-item-overlay p{color:#fff;font-size:.85rem;font-weight:500;line-height:1.3}.gallery-use-btn{align-items:center;align-self:flex-start;background:#8b5cf6;background:var(--accent);border-radius:999px;color:#fff;display:inline-flex;font-size:.78rem;font-weight:600;gap:.3rem;padding:.3rem .75rem;transition:background .3s cubic-bezier(.4,0,.2,1);transition:background var(--transition)}.gallery-item:hover .gallery-use-btn{background:#7c3aed;background:var(--accent-hover)}.gallery-item-date{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:rgba(0,0,0,.6);border-radius:999px;color:hsla(0,0%,100%,.7);font-size:.7rem;padding:.2rem .5rem;position:absolute;right:.6rem;top:.6rem}.gallery-header{align-items:flex-end;display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;margin-bottom:2rem}.gallery-header .section-subtitle,.gallery-header .section-title{margin-bottom:.25rem;text-align:left}.gallery-stats{font-size:.85em;opacity:.7}.gallery-stats strong{color:#a78bfa;font-weight:600}.gallery-sort{display:flex;flex-shrink:0;gap:.5rem}.sort-btn{background:#1a1a1a;background:var(--bg-card);border:1px solid #2a2a2a;border:1px solid var(--border);border-radius:999px;color:#a3a3a3;color:var(--text-secondary);cursor:pointer;font-family:inherit;font-size:.85rem;font-weight:500;padding:.5rem 1.1rem;transition:all .3s cubic-bezier(.4,0,.2,1);transition:all var(--transition)}.sort-btn.active{background:#8b5cf6;background:var(--accent);color:#fff}.sort-btn.active,.sort-btn:hover:not(.active){border-color:#8b5cf6;border-color:var(--accent)}.sort-btn:hover:not(.active){color:#f5f5f5;color:var(--text-primary)}.like-btn{align-items:center;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:rgba(0,0,0,.6);border:1px solid hsla(0,0%,100%,.15);border-radius:999px;bottom:.65rem;color:#fff;cursor:pointer;display:flex;font-family:inherit;font-size:.8rem;font-weight:600;gap:.25rem;line-height:1;padding:.3rem .65rem;position:absolute;right:.65rem;transition:all .3s cubic-bezier(.4,0,.2,1);transition:all var(--transition);z-index:2}.like-btn:hover{background:rgba(0,0,0,.85);-webkit-transform:scale(1.08);transform:scale(1.08)}.like-btn.liked{background:rgba(239,68,68,.25);border-color:rgba(239,68,68,.4)}.gallery-loading{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(3,1fr)}.gallery-skeleton{aspect-ratio:1;border-radius:12px;border-radius:var(--radius);overflow:hidden;position:relative}.gallery-skeleton:after{background:hsla(0,0%,100%,.06);border-radius:6px;bottom:12px;content:"";height:14px;left:12px;position:absolute;right:12px}.gallery-load-more{margin-top:2.5rem}.gallery-load-more,.load-more-btn{display:flex;justify-content:center}.load-more-btn{align-items:center;background:transparent;border:1.5px solid #2a2a2a;border:1.5px solid var(--border);border-radius:2rem;color:#a3a3a3;color:var(--text-secondary);cursor:pointer;font-size:.95rem;gap:.5rem;min-width:200px;padding:.75rem 2.5rem;transition:all .2s ease}.load-more-btn:hover:not(:disabled){background:rgba(139,92,246,.06);border-color:var(--primary);color:var(--primary)}.load-more-btn:disabled{cursor:default;opacity:.7}.load-more-spinner{align-items:center;display:flex;gap:5px}.spinner-dot{-webkit-animation:dotPulse 1.2s ease-in-out infinite;animation:dotPulse 1.2s ease-in-out infinite;background:#a3a3a3;background:var(--text-secondary);border-radius:50%;height:7px;width:7px}.spinner-dot:nth-child(2){-webkit-animation-delay:.2s;animation-delay:.2s}.spinner-dot:nth-child(3){-webkit-animation-delay:.4s;animation-delay:.4s}@-webkit-keyframes dotPulse{0%,80%,to{opacity:.5;-webkit-transform:scale(.7);transform:scale(.7)}40%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes dotPulse{0%,80%,to{opacity:.5;-webkit-transform:scale(.7);transform:scale(.7)}40%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}.gallery-end-msg{color:#666;color:var(--text-muted,var(--text-secondary));font-size:.9rem;margin-top:2rem;opacity:.6;text-align:center}.design-modal-backdrop{align-items:center;-webkit-animation:modal-fade-in .2s ease;animation:modal-fade-in .2s ease;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:rgba(0,0,0,.85);display:flex;inset:0;justify-content:center;padding:1rem;position:fixed;z-index:1000}@-webkit-keyframes modal-fade-in{0%{opacity:0}to{opacity:1}}@keyframes modal-fade-in{0%{opacity:0}to{opacity:1}}.design-modal{-webkit-animation:modal-slide-up .25s cubic-bezier(.34,1.56,.64,1);animation:modal-slide-up .25s cubic-bezier(.34,1.56,.64,1);background:#111;background:var(--bg-secondary,#1a1a2e);border:1px solid #2a2a2a;border:1px solid var(--border,hsla(0,0%,100%,.1));border-radius:20px;box-shadow:0 24px 80px rgba(0,0,0,.6),0 0 0 1px rgba(139,92,246,.2);max-height:90vh;max-width:900px;overflow:hidden;position:relative;width:100%}@-webkit-keyframes modal-slide-up{0%{opacity:0;-webkit-transform:scale(.92) translateY(20px);transform:scale(.92) translateY(20px)}to{opacity:1;-webkit-transform:scale(1) translateY(0);transform:scale(1) translateY(0)}}@keyframes modal-slide-up{0%{opacity:0;-webkit-transform:scale(.92) translateY(20px);transform:scale(.92) translateY(20px)}to{opacity:1;-webkit-transform:scale(1) translateY(0);transform:scale(1) translateY(0)}}.design-modal-close{align-items:center;background:rgba(0,0,0,.5);border:1px solid hsla(0,0%,100%,.15);border-radius:50%;color:#fff;cursor:pointer;display:flex;font-size:.85rem;height:36px;justify-content:center;position:absolute;right:1rem;top:1rem;transition:background .2s,-webkit-transform .15s;transition:background .2s,transform .15s;transition:background .2s,transform .15s,-webkit-transform .15s;width:36px;z-index:10}.design-modal-close:hover{background:rgba(139,92,246,.5);-webkit-transform:scale(1.1);transform:scale(1.1)}.design-modal-content{display:grid;grid-template-columns:1fr 1fr;max-height:90vh;min-height:420px}.design-modal-image-wrap{align-items:center;background:#0d0d1a;border-radius:20px 0 0 20px;display:flex;justify-content:center;overflow:hidden}.design-modal-image{display:block;height:100%;max-height:90vh;object-fit:cover;width:100%}.design-modal-info{display:flex;flex-direction:column;gap:1rem;overflow-y:auto;padding:2rem}.design-modal-meta{align-items:center;display:flex;flex-wrap:wrap;gap:.75rem}.design-modal-date{background:hsla(0,0%,100%,.06);border-radius:20px;font-size:.8rem;padding:.3rem .7rem}.design-modal-date,.design-modal-prompt-label{color:#a3a3a3;color:var(--text-secondary,#9ca3af)}.design-modal-prompt-label{font-size:.75rem;letter-spacing:.1em;margin:0;text-transform:uppercase}.design-modal-prompt{color:#f5f5f5;color:var(--text-primary,#fff);flex:1 1;font-size:1.1rem;font-style:italic;line-height:1.6;margin:0}.design-modal-stats{align-items:center;display:flex;gap:1rem}.design-modal-likes{color:#a3a3a3;color:var(--text-secondary,#9ca3af);font-size:.9rem}.design-modal-actions{display:flex;flex-direction:column;gap:.75rem;margin-top:auto}.design-modal-use-btn{background:linear-gradient(135deg,#8b5cf6,#6366f1);border:none;border-radius:12px;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;padding:.85rem 1.5rem;transition:opacity .2s,-webkit-transform .15s;transition:opacity .2s,transform .15s;transition:opacity .2s,transform .15s,-webkit-transform .15s;width:100%}.design-modal-use-btn:hover{opacity:.9;-webkit-transform:translateY(-1px);transform:translateY(-1px)}.design-modal-like-btn{background:hsla(0,0%,100%,.07);border:1px solid hsla(0,0%,100%,.12);border-radius:12px;color:#fff;cursor:pointer;font-size:.95rem;padding:.75rem 1.5rem;transition:background .2s;width:100%}.design-modal-like-btn:hover:not(:disabled){background:rgba(239,68,68,.2);border-color:rgba(239,68,68,.4)}.design-modal-like-btn:disabled{cursor:default;opacity:.4}.design-modal-hint{color:#a3a3a3;color:var(--text-secondary,#9ca3af);font-size:.75rem;margin:0;opacity:.5;text-align:center}.design-modal-hint kbd{background:hsla(0,0%,100%,.1);border-radius:4px;font-family:monospace;font-size:.75rem;padding:1px 5px}@media (max-width:640px){.design-modal-content{grid-template-columns:1fr;grid-template-rows:auto 1fr}.design-modal-image-wrap{border-radius:20px 20px 0 0;max-height:260px}.design-modal-info{padding:1.25rem}}.variant-strip-row{align-items:center;background:#111;background:var(--bg-secondary);border-bottom:1px solid #2a2a2a;border-bottom:1px solid var(--border);display:flex;gap:0}.variant-strip-row .variant-strip{border-bottom:none;flex:1 1}.variant-strip{background:#111;background:var(--bg-secondary);border-bottom:1px solid #2a2a2a;border-bottom:1px solid var(--border);display:flex;gap:.6rem;overflow-x:auto;padding:.75rem}.regenerate-btn{align-items:center;background:transparent;border:1.5px solid #2a2a2a;border:1.5px solid var(--border);border-radius:999px;color:#666;color:var(--text-muted);cursor:pointer;display:inline-flex;flex-shrink:0;font-family:inherit;font-size:.8rem;font-weight:500;gap:.4rem;margin-right:.75rem;padding:.5rem 1rem;transition:all .3s cubic-bezier(.4,0,.2,1);transition:all var(--transition);white-space:nowrap}.regenerate-btn:hover{background:rgba(139,92,246,.08);border-color:#8b5cf6;border-color:var(--accent);box-shadow:0 0 0 2px rgba(139,92,246,.3);box-shadow:0 0 0 2px var(--accent-glow);color:#8b5cf6;color:var(--accent)}.regenerate-btn:active{-webkit-transform:scale(.96);transform:scale(.96)}.share-btn{align-items:center;background:transparent;border:1.5px solid #2a2a2a;border:1.5px solid var(--border);border-radius:999px;color:#666;color:var(--text-muted);cursor:pointer;display:inline-flex;flex-shrink:0;font-family:inherit;font-size:.8rem;font-weight:500;gap:.4rem;margin-right:.75rem;padding:.5rem 1rem;transition:all .3s cubic-bezier(.4,0,.2,1);transition:all var(--transition);white-space:nowrap}.share-btn:hover{background:rgba(16,185,129,.08);border-color:#10b981;box-shadow:0 0 0 2px rgba(16,185,129,.2);color:#10b981}.share-btn:active{-webkit-transform:scale(.96);transform:scale(.96)}.share-btn.share-copied{background:rgba(16,185,129,.12);border-color:#10b981;color:#10b981}.download-btn{align-items:center;background:transparent;border:1.5px solid #2a2a2a;border:1.5px solid var(--border);border-radius:999px;color:#666;color:var(--text-muted);cursor:pointer;display:inline-flex;flex-shrink:0;font-family:inherit;font-size:.8rem;font-weight:500;gap:.4rem;padding:.5rem 1rem;transition:all .3s cubic-bezier(.4,0,.2,1);transition:all var(--transition);white-space:nowrap}.download-btn:hover:not(:disabled){background:rgba(139,92,246,.3);background:var(--accent-glow);border-color:#8b5cf6;border-color:var(--accent);box-shadow:0 0 0 2px rgba(139,92,246,.2);color:#8b5cf6;color:var(--accent)}.download-btn:active:not(:disabled){-webkit-transform:scale(.96);transform:scale(.96)}.download-btn.download-busy{cursor:default;opacity:.6}.variant-thumb{align-items:center;background:none;border:2px solid #2a2a2a;border:2px solid var(--border);border-radius:12px;border-radius:var(--radius);cursor:pointer;display:flex;flex-direction:column;flex-shrink:0;font-family:inherit;gap:.35rem;padding:.3rem;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1);transition:all var(--transition)}.variant-thumb[data-tooltip]:before{background:rgba(20,20,30,.95);border:1px solid rgba(139,92,246,.35);border-radius:6px;bottom:calc(100% + 8px);box-shadow:0 4px 16px rgba(0,0,0,.4);color:#fff;content:attr(data-tooltip);font-size:.72rem;font-weight:600;padding:.3rem .65rem;white-space:nowrap}.variant-thumb[data-tooltip]:after,.variant-thumb[data-tooltip]:before{left:50%;opacity:0;pointer-events:none;position:absolute;-webkit-transform:translateX(-50%) translateY(4px);transform:translateX(-50%) translateY(4px);transition:opacity .18s ease,-webkit-transform .18s ease;transition:opacity .18s ease,transform .18s ease;transition:opacity .18s ease,transform .18s ease,-webkit-transform .18s ease;z-index:100}.variant-thumb[data-tooltip]:after{border:5px solid transparent;border-top-color:rgba(20,20,30,.95);bottom:calc(100% + 2px);content:""}.variant-thumb[data-tooltip]:hover:after,.variant-thumb[data-tooltip]:hover:before{opacity:1;-webkit-transform:translateX(-50%) translateY(0);transform:translateX(-50%) translateY(0)}.variant-thumb img{border-radius:6px;display:block;height:72px;object-fit:cover;width:72px}.variant-thumb span{color:#666;color:var(--text-muted);font-size:.7rem;font-weight:500;white-space:nowrap}.variant-thumb.active{border-color:#8b5cf6;border-color:var(--accent);box-shadow:0 0 0 2px rgba(139,92,246,.3);box-shadow:0 0 0 2px var(--accent-glow)}.variant-thumb.active span{color:#8b5cf6;color:var(--accent)}.variant-thumb:hover:not(.active){border-color:#666;border-color:var(--text-muted)}.variant-preview-wrap{opacity:1;transition:opacity .2s ease}.variant-preview-wrap.variant-fading{opacity:0}.generating-state{align-items:center;display:flex;flex-direction:column;padding:1rem;text-align:center;width:100%}.skeleton-phone-wrapper{align-items:center;display:flex;justify-content:center;position:relative;width:220px}.skeleton-phone-svg{display:block;-webkit-filter:drop-shadow(0 20px 40px rgba(0,0,0,.7));filter:drop-shadow(0 20px 40px rgba(0,0,0,.7));height:auto;width:100%}@-webkit-keyframes sk-pulse{0%,to{opacity:.55}50%{opacity:.85}}@keyframes sk-pulse{0%,to{opacity:.55}50%{opacity:.85}}.sk-pulse-1{-webkit-animation:sk-pulse 2s ease-in-out infinite;animation:sk-pulse 2s ease-in-out infinite}.sk-pulse-2{-webkit-animation:sk-pulse 2s ease-in-out .3s infinite;animation:sk-pulse 2s ease-in-out .3s infinite}.sk-pulse-3{-webkit-animation:sk-pulse 2s ease-in-out .6s infinite;animation:sk-pulse 2s ease-in-out .6s infinite}@-webkit-keyframes sk-glow-pulse{0%,to{opacity:.4}50%{opacity:1}}@keyframes sk-glow-pulse{0%,to{opacity:.4}50%{opacity:1}}.sk-glow-ring{-webkit-animation:sk-glow-pulse 2s ease-in-out infinite;animation:sk-glow-pulse 2s ease-in-out infinite}.skeleton-phone-overlay{align-items:center;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:rgba(0,0,0,.55);border:1px solid hsla(0,0%,100%,.07);border-radius:16px;display:flex;flex-direction:column;gap:.6rem;left:50%;padding:1rem .75rem;pointer-events:none;position:absolute;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:85%}.generating-icon{-webkit-animation:pulse-icon 1s ease-in-out infinite alternate;animation:pulse-icon 1s ease-in-out infinite alternate;font-size:1.8rem}@-webkit-keyframes pulse-icon{0%{opacity:.8;-webkit-transform:scale(1);transform:scale(1)}to{opacity:1;-webkit-transform:scale(1.15);transform:scale(1.15)}}@keyframes pulse-icon{0%{opacity:.8;-webkit-transform:scale(1);transform:scale(1)}to{opacity:1;-webkit-transform:scale(1.15);transform:scale(1.15)}}.generating-prompt{color:#8b5cf6;color:var(--accent);font-size:.75rem;font-style:italic;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.generating-step{color:#a3a3a3;color:var(--text-secondary);font-size:.78rem;min-height:1.4em;transition:opacity .3s ease,-webkit-transform .3s ease;transition:opacity .3s ease,transform .3s ease;transition:opacity .3s ease,transform .3s ease,-webkit-transform .3s ease}.step-visible{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}.step-hidden{opacity:0;-webkit-transform:translateY(4px);transform:translateY(4px)}.generating-progress-track{background:#2a2a2a;background:var(--border);border-radius:999px;height:3px;max-width:160px;overflow:hidden;width:100%}.generating-progress-fill{background:linear-gradient(90deg,#8b5cf6,#c084fc);background:linear-gradient(90deg,var(--accent),#c084fc);border-radius:999px;height:100%;transition:width .1s linear}.generating-dots{display:flex;gap:.4rem}.generating-dot{background:#2a2a2a;background:var(--border);border-radius:50%;height:7px;transition:background .4s;width:7px}.generating-dot.active{background:#8b5cf6;background:var(--accent)}.mockup-generating-overlay{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:hsla(0,0%,4%,.82);border-radius:20px;border-radius:var(--radius-lg);display:flex;inset:0;justify-content:center;position:absolute;z-index:10}.mockup-generating-inner{align-items:center;display:flex;flex-direction:column;gap:1rem;padding:2.5rem 2rem;text-align:center}.mockup-spinner{-webkit-animation:spin .9s linear infinite;animation:spin .9s linear infinite;border:3px solid #2a2a2a;border-top-color:#8b5cf6;border:3px solid var(--border);border-radius:50%;border-top-color:var(--accent);flex-shrink:0;height:52px;width:52px}.mockup-generating-title{color:#f5f5f5;color:var(--text-primary);font-size:1.1rem;font-weight:700}.mockup-generating-sub{color:#a3a3a3;color:var(--text-secondary);font-size:.88rem;margin-top:-.5rem}.mockup-generating-steps{align-items:center;display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin-top:.25rem}.mockup-step{background:#1a1a1a;background:var(--bg-card);border:1px solid #2a2a2a;border:1px solid var(--border);border-radius:999px;color:#666;color:var(--text-muted);font-size:.78rem;font-weight:500;padding:.3rem .75rem}.mockup-step.active{background:rgba(139,92,246,.1);border-color:#8b5cf6;border-color:var(--accent);box-shadow:0 0 0 2px rgba(139,92,246,.3);box-shadow:0 0 0 2px var(--accent-glow);color:#8b5cf6;color:var(--accent)}.mockup-step-divider{color:#666;color:var(--text-muted);font-size:.8rem}.error-container{display:flex;justify-content:center;padding:2rem}.error-text{background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.3);border-radius:12px;border-radius:var(--radius);color:#f87171;font-size:.95rem;padding:1rem 2rem}.loading-container{align-items:center;display:flex;flex-direction:column;gap:1.5rem;padding:4rem 2rem}.spinner{-webkit-animation:spin .8s linear infinite;animation:spin .8s linear infinite;border:3px solid #2a2a2a;border-top-color:#8b5cf6;border:3px solid var(--border);border-radius:50%;border-top-color:var(--accent);height:48px;width:48px}.loading-text{color:#a3a3a3;color:var(--text-secondary);font-size:1rem}.loading-subtext{color:#666;color:var(--text-muted);font-size:.85rem}.skeleton{-webkit-animation:shimmer 1.5s infinite;animation:shimmer 1.5s infinite;background:linear-gradient(90deg,#1a1a1a 25%,#222 50%,#1a1a1a 75%);background:linear-gradient(90deg,var(--bg-card) 25%,var(--bg-card-hover) 50%,var(--bg-card) 75%);border-radius:12px;border-radius:var(--radius)}.footer{border-top:1px solid #2a2a2a;border-top:1px solid var(--border);color:#666;color:var(--text-muted);font-size:.85rem;margin-top:auto;padding:3rem 2rem 2rem}.footer-inner{align-items:flex-start;display:flex;flex-wrap:wrap;gap:2rem;justify-content:space-between;margin:0 auto 2rem;max-width:960px}.footer-brand{display:flex;flex-direction:column;gap:.4rem}.footer-logo{color:var(--text);font-size:1.1rem;font-weight:700;letter-spacing:-.01em}.footer-tagline{color:#666;color:var(--text-muted);font-size:.82rem;line-height:1.5;margin:0;max-width:260px}.footer-links{align-items:center;display:flex;flex-wrap:wrap;gap:1.25rem}.footer-link{align-items:center;color:#666;color:var(--text-muted);display:inline-flex;font-size:.85rem;gap:.4rem;text-decoration:none;transition:color .2s ease}.footer-link:hover{color:#8b5cf6;color:var(--accent)}.footer-icon{flex-shrink:0;height:16px;width:16px}.footer-bottom{align-items:center;border-top:1px solid #2a2a2a;border-top:1px solid var(--border);display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;margin:0 auto;max-width:960px;padding-top:1.5rem;text-align:center}.footer-bottom p{margin:0}.footer-made{font-size:.8rem}.footer a{color:#8b5cf6;color:var(--accent);text-decoration:none}.footer a:hover{text-decoration:underline}@media (max-width:640px){.navbar{padding:.875rem 1.25rem}.navbar-logo{font-size:1.2rem}.navbar-links{gap:.75rem}.navbar-links a{font-size:.82rem}.hero{padding:7rem 1.25rem 2.5rem}.hero-badge{font-size:.78rem;padding:.35rem .85rem}.hero-products{gap:.5rem}.hero-product-badge{font-size:.8rem;padding:.4rem .9rem}.gift-banner{font-size:.85rem;padding:.5rem 1rem}.create-section{gap:2rem;padding:2.5rem 1.25rem 4rem}.create-title{font-size:1.6rem}.create-right{min-height:360px}.prompt-form{flex-direction:column;gap:.5rem}.prompt-submit{justify-content:center;width:100%}.prompt-chips{gap:.4rem}.prompt-chip{font-size:.78rem;padding:.3rem .7rem}.variant-strip{-webkit-overflow-scrolling:touch;overflow-x:auto;padding-bottom:.5rem;scrollbar-width:none}.variant-strip::-webkit-scrollbar{display:none}.variant-strip-row{flex-wrap:nowrap;overflow:hidden}.regenerate-btn,.share-btn{margin-right:.5rem}.download-btn,.regenerate-btn,.share-btn{font-size:.75rem;padding:.45rem .75rem}.phone-svg-wrapper{width:190px}.tshirt-canvas{height:320px}.gift-section,.how-it-works{padding:4rem 1.25rem}.gift-section-label{font-size:.78rem}.gallery-section{padding:4rem 1.25rem}.gallery-grid,.gallery-loading{gap:.75rem;grid-template-columns:repeat(2,1fr)}.gallery-header{align-items:flex-start;flex-direction:column;gap:.75rem}.gallery-sort{align-self:flex-start}.sort-btn{font-size:.8rem;padding:.4rem .9rem}.product-tabs{flex-wrap:wrap;gap:.4rem}.error-text{font-size:.88rem;padding:.75rem 1rem}.mockup-grid{grid-template-columns:1fr}.footer{font-size:.8rem;padding:2rem 1.25rem 1.5rem}.footer-inner{align-items:flex-start;flex-direction:column;gap:1.5rem;margin-bottom:1.5rem}.footer-bottom{flex-direction:column;gap:.5rem;text-align:center}.skeleton-phone-wrapper{width:180px}.section-title{font-size:clamp(1.5rem,5vw,2rem)}.section-subtitle{font-size:.95rem;margin-bottom:2rem}}@media (max-width:400px){.navbar-links{gap:.5rem}.navbar-links a{font-size:.78rem}.gallery-grid{gap:.75rem}.gallery-grid,.gallery-loading{grid-template-columns:1fr}.hero-products{align-items:center;flex-direction:column}.create-title{font-size:1.4rem}}.fade-in{-webkit-animation:fadeIn .6s ease-out;animation:fadeIn .6s ease-out}@-webkit-keyframes fadeIn{0%{opacity:0;-webkit-transform:translateY(20px);transform:translateY(20px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0;-webkit-transform:translateY(20px);transform:translateY(20px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}.settings-bar{background:#1a1a1a;background:var(--bg-card);border-radius:16px;flex-wrap:wrap;gap:2rem;margin-bottom:2rem;padding:1rem 2rem}.settings-bar,.settings-group{align-items:center;display:flex}.settings-group{gap:1rem}.settings-group label{color:#666;color:var(--text-muted);font-size:.9rem;font-weight:600}.toggle-buttons{display:flex;gap:.5rem}.toggle-btn{background:transparent;border:2px solid #2a2a2a;border:2px solid var(--border);border-radius:8px;color:#666;color:var(--text-muted);cursor:pointer;font-family:inherit;font-weight:600;padding:.5rem 1rem;transition:all .3s}.toggle-btn:hover{color:#8b5cf6;color:var(--accent)}.toggle-btn.active,.toggle-btn:hover{border-color:#8b5cf6;border-color:var(--accent)}.toggle-btn.active{background:#8b5cf6;background:var(--accent);color:#fff}.model-select{background:var(--bg);border:2px solid #2a2a2a;border:2px solid var(--border);border-radius:8px;color:var(--text);cursor:pointer;font-family:inherit;font-weight:600;min-width:200px;padding:.5rem 1rem}.model-select:focus{border-color:#8b5cf6;border-color:var(--accent);outline:none}body[data-ui-mode=simple] .advanced-only,body[data-ui-mode=simple] .gift-section,body[data-ui-mode=simple] .how-it-works,body[data-ui-mode=simple] .regenerate-btn,body[data-ui-mode=simple] .variant-strip{display:none!important}.phone-controls{background:#1a1a1a;background:var(--bg-card);border:2px solid #2a2a2a;border:2px solid var(--border);border-radius:16px;gap:1rem;margin-bottom:1.5rem;padding:1.5rem}.control-group,.phone-controls{display:flex;flex-direction:column}.control-group{gap:.5rem}.control-group label{align-items:center;color:#666;color:var(--text-muted);display:flex;font-size:.9rem;font-weight:600;gap:.5rem}.position-slider,.zoom-slider{-webkit-appearance:none;background:var(--bg);border-radius:4px;cursor:pointer;height:8px;outline:none;width:100%}.position-slider::-webkit-slider-thumb,.zoom-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:#8b5cf6;background:var(--accent);border-radius:50%;cursor:pointer;height:20px;-webkit-transition:all .2s;transition:all .2s;width:20px}.position-slider::-webkit-slider-thumb:hover,.zoom-slider::-webkit-slider-thumb:hover{background:#7c3aed;background:var(--accent-hover);-webkit-transform:scale(1.1);transform:scale(1.1)}.position-slider::-moz-range-thumb,.zoom-slider::-moz-range-thumb{background:#8b5cf6;background:var(--accent);border:none;border-radius:50%;cursor:pointer;height:20px;-moz-transition:all .2s;transition:all .2s;width:20px}.position-slider::-moz-range-thumb:hover,.zoom-slider::-moz-range-thumb:hover{background:#7c3aed;background:var(--accent-hover);transform:scale(1.1)}.reset-btn{background:transparent;border:2px solid #2a2a2a;border:2px solid var(--border);border-radius:8px;color:#666;color:var(--text-muted);cursor:pointer;font-family:inherit;font-weight:600;margin-top:.5rem;padding:.75rem 1.5rem;transition:all .3s}.reset-btn:hover{background:#8b5cf6;background:var(--accent);border-color:#8b5cf6;border-color:var(--accent);color:#fff}.phone-svg-wrapper{user-select:none;-webkit-user-select:none;-moz-user-select:none}@media (max-width:768px){.phone-controls{gap:.75rem;padding:1rem}.control-group label{font-size:.85rem}}.tshirt-viewer-container{position:relative}.shirt-color-picker{background:#1a1a1a;background:var(--bg-card);border:2px solid #2a2a2a;border:2px solid var(--border);border-radius:16px;margin-bottom:1.5rem;padding:1.5rem}.color-chip{position:relative;transition:all .3s cubic-bezier(.4,0,.2,1)}.color-chip:hover{box-shadow:0 4px 12px rgba(0,0,0,.3)!important;-webkit-transform:scale(1.1);transform:scale(1.1)}.color-chip.active{-webkit-transform:scale(1.05);transform:scale(1.05)}.tshirt-canvas{box-shadow:0 20px 60px rgba(0,0,0,.3),inset 0 0 0 1px hsla(0,0%,100%,.1);transition:box-shadow .3s}.tshirt-canvas:hover{box-shadow:0 25px 70px rgba(0,0,0,.4),inset 0 0 0 1px hsla(0,0%,100%,.15)}.phone-svg-wrapper{-webkit-filter:drop-shadow(0 25px 50px rgba(0,0,0,.25));filter:drop-shadow(0 25px 50px rgba(0,0,0,.25));transition:-webkit-filter .3s;transition:filter .3s;transition:filter .3s,-webkit-filter .3s}.phone-svg-wrapper:hover{-webkit-filter:drop-shadow(0 30px 60px rgba(0,0,0,.35));filter:drop-shadow(0 30px 60px rgba(0,0,0,.35))}.phone-controls{box-shadow:0 4px 12px rgba(0,0,0,.1),0 0 0 1px rgba(139,92,246,.1);transition:all .3s}.phone-controls:hover{box-shadow:0 6px 16px rgba(0,0,0,.15),0 0 0 2px rgba(139,92,246,.2)}.product-tabs{background:#1a1a1a;background:var(--bg-card);border:2px solid #2a2a2a;border:2px solid var(--border);border-radius:16px;display:flex;gap:1rem;margin-bottom:2rem;padding:.5rem;position:relative}.product-tabs:before{background:linear-gradient(90deg,transparent,#8b5cf6,transparent);background:linear-gradient(90deg,transparent,var(--accent),transparent);content:"";height:2px;left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .3s}.product-tabs:hover:before{opacity:1}.tab-btn{background:transparent;border:2px solid transparent;border-radius:12px;color:#666;color:var(--text-muted);cursor:pointer;flex:1 1;font-family:inherit;font-size:1rem;font-weight:600;overflow:hidden;padding:1rem 1.5rem;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1)}.tab-btn:before{background:linear-gradient(90deg,transparent,rgba(139,92,246,.1),transparent);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s;width:100%}.tab-btn:hover:before{left:100%}.tab-btn:hover{background:rgba(139,92,246,.05);color:#8b5cf6;color:var(--accent)}.tab-btn.active,.tab-btn:hover{border-color:#8b5cf6;border-color:var(--accent);-webkit-transform:translateY(-2px);transform:translateY(-2px)}.tab-btn.active{background:#8b5cf6;background:var(--accent);box-shadow:0 8px 24px rgba(139,92,246,.3),0 0 0 4px rgba(139,92,246,.1);color:#fff}.drag-hint{align-items:center;-webkit-animation:pulse-hint 3s ease-in-out infinite;animation:pulse-hint 3s ease-in-out infinite;background:#1a1a1a;background:var(--bg-card);border:1px solid #2a2a2a;border:1px solid var(--border);border-radius:12px;display:flex;font-size:.9rem;gap:.5rem;justify-content:center;padding:.75rem 1.5rem}@-webkit-keyframes pulse-hint{0%,to{opacity:.6;-webkit-transform:scale(1);transform:scale(1)}50%{opacity:1;-webkit-transform:scale(1.02);transform:scale(1.02)}}@keyframes pulse-hint{0%,to{opacity:.6;-webkit-transform:scale(1);transform:scale(1)}50%{opacity:1;-webkit-transform:scale(1.02);transform:scale(1.02)}}.gallery-item{border:2px solid #2a2a2a;border:2px solid var(--border);overflow:hidden;position:relative;transition:all .4s cubic-bezier(.4,0,.2,1)}.gallery-item:before{background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.1),transparent);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .6s;width:100%;z-index:2}.gallery-item:hover:before{left:100%}.gallery-item:hover{box-shadow:0 20px 40px rgba(0,0,0,.3),0 0 0 2px #8b5cf6;box-shadow:0 20px 40px rgba(0,0,0,.3),0 0 0 2px var(--accent);-webkit-transform:translateY(-8px) scale(1.02);transform:translateY(-8px) scale(1.02)}.skeleton{-webkit-animation:shimmer 2s infinite;animation:shimmer 2s infinite;background:linear-gradient(90deg,#1a1a1a,rgba(139,92,246,.1) 50%,#1a1a1a);background:linear-gradient(90deg,var(--bg-card) 0,rgba(139,92,246,.1) 50%,var(--bg-card) 100%);background-size:200% 100%;overflow:hidden;position:relative}.real-products-container{min-height:400px}.real-products-grid{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin-top:2rem}.mockup-card{background:#1a1a1a;background:var(--bg-card);border:2px solid #2a2a2a;border:2px solid var(--border);border-radius:16px;padding:1.5rem;transition:all .3s}.mockup-card:hover{border-color:#8b5cf6;border-color:var(--accent);box-shadow:0 8px 24px rgba(139,92,246,.2);-webkit-transform:translateY(-4px);transform:translateY(-4px)}.mockup-title{color:var(--text);font-size:1.25rem;font-weight:700;margin-bottom:1rem}.mockup-images{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin-bottom:1.5rem}.mockup-image{border:1px solid #2a2a2a;border:1px solid var(--border);border-radius:12px;height:auto;transition:-webkit-transform .3s;transition:transform .3s;transition:transform .3s,-webkit-transform .3s;width:100%}.mockup-image:hover{-webkit-transform:scale(1.05);transform:scale(1.05)}.mockup-placeholder{background:var(--bg);border-radius:12px;color:#666;color:var(--text-muted);font-size:.9rem;padding:3rem 1rem;text-align:center}.order-mockup-btn{background:#8b5cf6;background:var(--accent);border:none;border-radius:12px;color:#fff;cursor:pointer;font-family:inherit;font-size:1rem;font-weight:700;padding:1rem;transition:all .3s;width:100%}.order-mockup-btn:hover{background:#7c3aed;background:var(--accent-hover);box-shadow:0 4px 12px rgba(139,92,246,.3);-webkit-transform:translateY(-2px);transform:translateY(-2px)}@media (max-width:768px){.real-products-grid{gap:1.5rem}.mockup-images,.real-products-grid{grid-template-columns:1fr}}.real-products-container{margin:0 auto;max-width:1400px;padding:2rem}.real-products-empty,.real-products-error,.real-products-loading{align-items:center;display:flex;justify-content:center;min-height:500px}.empty-state{max-width:500px;text-align:center}.empty-icon{font-size:4rem;margin-bottom:1rem}.empty-state h3{color:var(--text);font-size:1.5rem;margin-bottom:.5rem}.empty-state p{color:var(--text-muted);margin-bottom:2rem}.empty-preview{gap:1rem}.empty-preview,.preview-box{display:flex;justify-content:center}.preview-box{align-items:center;background:var(--bg-card);border:2px dashed var(--border);border-radius:12px;font-size:2rem;height:80px;opacity:.5;width:80px}.loading-content{text-align:center}.loading-spinner{-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;border-top:4px solid var(--border);border:4px solid var(--border);border-radius:50%;border-top-color:var(--accent);height:60px;margin:0 auto 2rem;width:60px}.loading-content h3{color:var(--text);font-size:1.5rem;margin-bottom:.5rem}.loading-content p{color:var(--text-muted);margin-bottom:2rem}.loading-steps{display:flex;gap:1.5rem;justify-content:center;margin-bottom:1rem}.loading-steps .step{background:var(--bg-card);border:1px solid var(--border);border-radius:8px;color:var(--text-muted);font-size:.9rem;padding:.5rem 1rem}.loading-time{color:var(--text-muted);font-size:.85rem;font-style:italic}.products-header{margin-bottom:3rem;text-align:center}.products-header h2{color:var(--text);font-size:2rem;font-weight:800;margin-bottom:.5rem}.products-header p{color:var(--text-muted);font-size:1.1rem}.products-grid{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));margin-bottom:3rem}.product-card{background:var(--bg-card);border:2px solid var(--border);border-radius:16px;display:flex;flex-direction:column;overflow:hidden;transition:all .3s cubic-bezier(.4,0,.2,1)}.product-card:hover{border-color:var(--accent);box-shadow:0 12px 40px rgba(139,92,246,.15);-webkit-transform:translateY(-4px);transform:translateY(-4px)}.product-image-container{aspect-ratio:1;background:#f5f5f5;overflow:hidden;position:relative;width:100%}.product-main-image{cursor:pointer;height:100%;object-fit:contain;transition:-webkit-transform .3s;transition:transform .3s;transition:transform .3s,-webkit-transform .3s;width:100%}.product-card:hover .product-main-image{-webkit-transform:scale(1.05);transform:scale(1.05)}.image-counter{background:rgba(0,0,0,.7);border-radius:20px;bottom:1rem;color:#fff;font-size:.85rem;font-weight:600;padding:.25rem .75rem;position:absolute;right:1rem}.product-thumbnails{grid-gap:.5rem;background:var(--bg);border-top:1px solid var(--border);display:grid;gap:.5rem;grid-template-columns:repeat(6,1fr);padding:1rem}.thumbnail{aspect-ratio:1;background:#f5f5f5;border:2px solid var(--border);border-radius:8px;cursor:pointer;overflow:hidden;padding:0;transition:all .2s}.thumbnail img{height:100%;object-fit:cover;width:100%}.thumbnail:hover{border-color:var(--accent);-webkit-transform:scale(1.05);transform:scale(1.05)}.thumbnail.active{border-color:var(--accent);border-width:3px;box-shadow:0 0 0 2px rgba(139,92,246,.2)}.thumbnail.more{align-items:center;background:var(--bg-card);color:var(--text-muted);display:flex;font-weight:700;justify-content:center}.product-info{flex:1 1;padding:1.5rem}.product-name{color:var(--text);font-size:1.25rem;font-weight:700;margin-bottom:.5rem}.product-type{color:var(--text-muted);font-size:.9rem;letter-spacing:.5px;margin-bottom:1rem;text-transform:uppercase}.product-meta{align-items:center;display:flex;gap:1rem}.mockup-count{background:var(--bg);border-radius:20px;color:var(--text-muted);font-size:.9rem;padding:.25rem .75rem}.product-actions{display:flex;gap:.75rem;padding:0 1.5rem 1.5rem}.btn-primary,.btn-secondary{border:none;border-radius:10px;cursor:pointer;flex:1 1;font-family:inherit;font-size:1rem;font-weight:700;padding:.875rem 1rem;transition:all .3s}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover:not(:disabled){background:var(--accent-hover);box-shadow:0 4px 12px rgba(139,92,246,.3);-webkit-transform:translateY(-2px);transform:translateY(-2px)}.btn-primary:disabled{cursor:not-allowed;opacity:.6}.btn-secondary{background:transparent;border:2px solid var(--border);color:var(--text-muted)}.btn-secondary:hover{background:rgba(139,92,246,.05);border-color:var(--accent);color:var(--accent)}.publish-error{background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.3);border-radius:8px;color:#ef4444;font-size:.9rem;margin:0 1.5rem 1.5rem;padding:.75rem 1.5rem}.products-footer{background:var(--bg-card);border:2px solid var(--border);border-radius:16px;padding:2rem;text-align:center}.footer-stats{display:flex;flex-wrap:wrap;gap:2rem;justify-content:center;margin-bottom:1rem}.footer-stats span{color:var(--text);font-weight:600}.footer-note{color:var(--text-muted);font-size:.9rem}.error-content{text-align:center}.error-icon{font-size:4rem;margin-bottom:1rem}.error-content h3{color:#ef4444;font-size:1.5rem;margin-bottom:.5rem}.error-content p{color:var(--text-muted);margin-bottom:2rem}.btn-retry{background:var(--accent);border:none;border-radius:10px;color:#fff;cursor:pointer;font-family:inherit;font-size:1rem;font-weight:700;padding:.875rem 2rem;transition:all .3s}.btn-retry:hover{background:var(--accent-hover);box-shadow:0 4px 12px rgba(139,92,246,.3);-webkit-transform:translateY(-2px);transform:translateY(-2px)}.skeleton-img{aspect-ratio:1;width:100%}.skeleton-img,.skeleton-text{-webkit-animation:shimmer 2s infinite;animation:shimmer 2s infinite;background:linear-gradient(90deg,var(--bg-card) 0,rgba(139,92,246,.1) 50%,var(--bg-card) 100%);background-size:200% 100%}.skeleton-text{height:20px;margin-top:1rem}@-webkit-keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@media (max-width:768px){.products-grid{gap:1.5rem;grid-template-columns:1fr}.products-header h2{font-size:1.5rem}.product-thumbnails{grid-template-columns:repeat(4,1fr)}.footer-stats{gap:.5rem}.footer-stats,.product-actions{flex-direction:column}}
/*# sourceMappingURL=main.9598ba8a.css.map*/