PageSourceSearch

https://www.magicstyle.ai/_next/static/chunks/app/page-f506fc0a3a775578.js

js magicstyle.ai collected 2026-10-05 15:38:25 UTC 33,506 bytes, 1 lines download raw bytes

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[593],{61:(e,t,a)=>{Promise.resolve().then(a.bind(a,4951))},4951:(e,t,a)=>{"use strict";a.r(t),a.d(t,{default:()=>V});var s=a(5155),r=a(2115),i=a(1978),l=a(6766),o=a(6874),n=a.n(o),c=a(4416),m=a(4783),d=a(7213),h=a(381),u=a(4835),x=a(495);let p=[{id:"celebrities",name:"Celebrities",images:[{before:"/images/categories/celeb-before-1.webp",after:"/images/categories/celeb-after-1.webp",title:"Celebrities Reimagined in Ghibli Style",description:"Transform your favorite celebrities into magical Ghibli characters"}]},{id:"memes",name:"Memes",images:[{before:"/images/categories/meme-before-1.webp",after:"/images/categories/meme-after-1.webp",title:"Meme Magic",description:"Give your favorite memes a Ghibli style twist"}]},{id:"family",name:"Family Photos",images:[{before:"/images/categories/family-before-1.webp",after:"/images/categories/family-after-1.webp",title:"Family Memories",description:"Turn precious family moments into timeless Ghibli art"}]},{id:"pets",name:"Pets",images:[{before:"/images/categories/pet-before-1.webp",after:"/images/categories/pet-after-1.webp",title:"Magical Pet Portraits",description:"Turn your pets into Ghibli style characters in seconds"}]},{id:"yourself",name:"Yourself",images:[{before:"/images/categories/self-before1.webp",after:"/images/categories/self-after-1.webp",title:"Your Ghibli Avatar",description:"See yourself in the magical world of Ghibli style"}]}];function f(){let[e,t]=(0,r.useState)(p[0]),[a,l]=(0,r.useState)(0),o=e.images[a];return(0,s.jsx)("section",{id:"Transform-Any-Photo",className:"py-16 md:py-24",children:(0,s.jsxs)("div",{className:"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8",children:[(0,s.jsxs)("div",{className:"text-center mb-12",children:[(0,s.jsx)("h2",{className:"hero-text text-3xl md:text-4xl font-bold text-foreground mb-4",children:"Transform Any Photo"}),(0,s.jsx)("p",{className:"text-lg text-foreground/80",children:"Choose a category and see the magic happen"})]}),(0,s.jsx)("div",{className:"flex flex-wrap justify-center gap-4 mb-12",children:p.map(a=>(0,s.jsx)("button",{onClick:()=>{t(a),l(0)},className:"px-6 py-3 rounded-full text-lg font-medium transition-all ".concat(e.id===a.id?"bg-[#333333] text-white":"bg-white border-2 border-foreground
1/10 hover:border-primary/50 text-foreground"),children:a.name},a.id))}),(0,s.jsxs)("div",{className:"grid grid-cols-1 lg:grid-cols-2 gap-12 items-center",children:[(0,s.jsxs)(i.P.div,{initial:{opacity:0,x:-20},animate:{opacity:1,x:0},transition:{duration:.5},className:"relative",children:[(0,s.jsx)("div",{className:"relative rounded-2xl overflow-hidden",children:(0,s.jsx)(x.EW,{itemOne:(0,s.jsx)(x.D4,{src:o.before,alt:"Before transformation"}),itemTwo:(0,s.jsx)(x.D4,{src:o.after,alt:"After transformation"}),style:{height:"400px",borderRadius:"1rem"},className:"w-full"})}),(0,s.jsx)("div",{className:"absolute -bottom-4 -right-4 bg-primary/10 w-full h-full rounded-2xl -z-10"})]},"".concat(e.id,"-").concat(a)),(0,s.jsxs)(i.P.div,{initial:{opacity:0,x:20},animate:{opacity:1,x:0},transition:{duration:.5},className:"text-left",children:[(0,s.jsx)("h3",{className:"hero-text text-2xl md:text-3xl font-bold text-foreground mb-4",children:o.title}),(0,s.jsx)("p",{className:"text-lg text-foreground/80 mb-8",children:o.description}),(0,s.jsx)("button",{onClick:()=>window.location.href="/dashboard",className:"px-6 py-3 text-white font-medium text-lg rounded-full bg-primary hover:bg-[#333333] transition-colors",children:"Transform Your Photo"})]},"".concat(e.id,"-").concat(a,"-content"))]})]})})}let g=["/images/gallery/1.webp","/images/gallery/2.webp","/images/gallery/3.webp","/images/gallery/4.webp","/images/gallery/5.webp","/images/gallery/6.webp","/images/gallery/7.webp","/images/gallery/8.webp","/images/gallery/9.webp","/images/gallery/10.webp"],b=["/images/gallery/11.webp","/images/gallery/12.webp","/images/gallery/13.webp","/images/gallery/14.webp","/images/gallery/15.webp","/images/gallery/16.webp","/images/gallery/17.webp","/images/gallery/18.webp","/images/gallery/19.webp","/images/gallery/20.webp","/images/gallery/21.webp"];function y(){let e=(0,r.useRef)(null),t=(0,r.useRef)(null);return(0,r.useEffect)(()=>{let a,s,r=e.current,i=t.current;if(!r||!i)return;let l=0,o=0,n=0,c=0,m=e=>{n||(n=e);let t=e-n;n=e,(l-=.005*t)<=-100&&(l=0),r.style.transform="translateX(".concat(l,"%)"),a=requestAnimationFrame(m)},d=e=>{c||(c=e);let t=e-c;c=e,(o+=.004*t)>=0&&(o=-100),i.style.transform="translateX(".concat(o,"%)"),s=requestAnimationFrame(d)};return a=requestAnimationFrame(m),s=requestAnimationFrame(d),()=>{cancelAnimationFrame(a),cancelAnimationFrame(s)}},[]),(0,s.jsxs)("section",{className:"py-16 overflow-hidden bg-[#f0f0ec]",children:[(0,s.jsx)("div",{className:"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 mb-12",children:(0,s.jsxs)("div",{className:"text-center mb-12",children:[(0,s.jsx)("h2",{className:"hero-text text-3xl md:text-4xl font-bold text-foreground mb-4",children:"Endless Possibilities"}),(0,s.jsx)("p",{className:"text-lg text-foreground/80",children:"See what others have created with our Ghibli style transformation"})]})}),(0,s.jsxs)("div",{id:"gallery-container",className:"w-full relative",children:[(0,s.jsx)("div",{className:"absolute left-0 top-0 bottom-0 w-32 bg-gradient-to-r from-[#f0f0ec] to-transparent z-10"}),(0,s.jsx)("div",{className:"flex gap-4 mb-8",style:{width:"300%"},ref:e,children:[...g,...g,...g].map((e,t)=>(0,s.jsx)("div",{className:"relative w-[300px] h-[400px] rounded-2xl overflow-hidden flex-shrink-0",children:(0,s.jsx)(l.default,{src:e,alt:"Gallery image ".concat(t+1),fill:!0,className:"object-cover"})},t))}),(0,s.jsx)("div",{className:"flex gap-4",style:{width:"300%"},ref:t,children:[...b,...b,...b].map((e,t)=>(0,s.jsx)("div",{className:"relative w-[300px] h-[400px] rounded-2xl overflow-hidden flex-shrink-0",children:(0,s.jsx)(l.default,{src:e,alt:"Gallery image ".concat(t+9),fill:!0,className:"object-cover"})},t))}),(0,s.jsx)("div",{className:"absolute right-0 top-0 bottom-0 w-32 bg-gradient-to-l from-[#f0f0ec] to-transparent z-10"})]})]})}let w=[{number:"01",title:"Upload Your Photo",description:"Start by uploading a high quality image of yourself or any subject you'd like to transform. Our AI works best with clear, well lit photos that capture every detail. Support for portraits, landscapes, pets, and more!",image:{src:"/images/HowItWorks/HowItWorks-step1.webp",alt:"Original photo example"}}
1,{number:"02",title:"Choose Your Style",description:"Choose the style you want your image to be restyled in, for now, the default is a magical Ghibli style, already selected for you. More unique styles are coming soon! Once you're ready, just hit the Restyle Image button and watch your photo transform with a touch of AI magic.",image:{src:"/images/HowItWorks/HowItWorks-step2.webp",alt:"Ghibli style example"}},{number:"03",title:"AI Magic Transformation",description:"Watch as our advanced AI transforms your photo in real-time. The process carefully analyzes your image, applying Ghibli style characteristics while preserving the essence and emotions of the original photo.",image:{src:"/images/HowItWorks/HowItWorks-step3.webp",alt:"AI transformation example"}},{number:"04",title:"Download & Share",description:"Get your transformed masterpiece in high resolution. Perfect for social media, prints, or keeping as a magical memory. Each image is carefully optimized for quality while maintaining the distinctive Ghibli charm.",image:{src:"/images/HowItWorks/HowItWorks-step4.webp",alt:"Final result example"}}];function v(){return(0,s.jsx)("section",{id:"how-it-works",className:"py-24 bg-[#f0f0ec]",children:(0,s.jsxs)("div",{className:"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8",children:[(0,s.jsxs)("div",{className:"text-center mb-16",children:[(0,s.jsx)(i.P.h2,{initial:{opacity:0,y:20},whileInView:{opacity:1,y:0},viewport:{once:!0},className:"hero-text text-3xl md:text-4xl font-bold text-foreground mb-4",children:"How It Works"}),(0,s.jsx)("p",{className:"text-lg text-foreground/80",children:"Transform your photos into Ghibli masterpieces in four simple steps"})]}),(0,s.jsx)("div",{className:"space-y-16 md:space-y-24",children:w.map((e,t)=>(0,s.jsxs)(i.P.div,{initial:{opacity:0,y:40},whileInView:{opacity:1,y:0},viewport:{once:!0},transition:{delay:.2*t},className:"flex flex-col ".concat(t%2==0?"md:flex-row":"md:flex-row-reverse"," \n                gap-8 md:gap-12 items-center"),children:[(0,s.jsx)("div",{className:"flex-1 relative w-full",children:(0,s.jsxs)(i.P.div,{className:"bg-white rounded-2xl p-6 sm:p-8 shadow-md relative overflow-hidden",whileHover:{boxShadow:"0 10px 30px rgba(0, 0, 0, 0.1)"},transition:{duration:.3},children:[(0,s.jsx)("div",{className:"absolute inset-0 bg-gradient-to-br from-white to-gray-50 z-0"}),(0,s.jsx)("div",{className:"absolute -top-6 -right-6 w-12 h-12 bg-primary/10 rounded-full blur-xl"}),(0,s.jsx)("div",{className:"absolute bottom-0 left-0 w-24 h-24 bg-primary/5 rounded-full blur-xl"}),(0,s.jsxs)("div",{className:"flex items-start gap-4 sm:gap-6 relative z-10",children:[(0,s.jsx)("div",{className:"hidden sm:flex items-center justify-center h-12 sm:h-16 w-12 sm:w-16 rounded-full bg-gradient-to-br from-primary/10 to-primary/20 flex-shrink-0",children:(0,s.jsx)("span",{className:"text-3xl sm:text-4xl font-bold bg-clip-text text-transparent bg-gradient-to-br from-primary to-primary/70",children:e.number})}),(0,s.jsxs)("div",{className:"flex-1",children:[(0,s.jsxs)("div",{className:"flex items-center mb-2 sm:mb-0",children:[(0,s.jsx)("span",{className:"sm:hidden flex items-center justify-center h-8 w-8 rounded-full bg-gradient-to-br from-primary/10 to-primary/20 flex-shrink-0 mr-2",children:(0,s.jsx)("span",{className:"text-lg font-bold bg-clip-text text-transparent bg-gradient-to-br from-primary to-primary/70",children:e.number})}),(0,s.jsx)("h3",{className:"text-xl sm:text-2xl font-semibold mb-2 sm:mb-4 bg-clip-text text-transparent bg-gradient-to-r from-foreground to-foreground/90",children:e.title})]}),(0,s.jsx)("p",{className:"text-foreground/70 text-base sm:text-lg leading-relaxed",children:e.description})]})]}),(0,s.jsx)("div",{className:"absolute bottom-0 left-0 right-0 h-1 bg-gradient-to-r from-primary/20 via-primary/10 to-transparent"})]})}),(0,s.jsx)("div",{className:"flex-1 w-full",children:(0,s.jsx)(i.P.div,{initial:{opacity:0,scale:.8},whileInView:{opacity:1,scale:1},viewport:{once:!0},className:"relative aspect-[4/3] rounded-2xl overflow-hidden",children:(0,s.jsx)(l.default,{src:e.image.src,alt:e.image.alt,fill:!0,className:"object-cover",sizes:"(max-width: 768px) 100vw, 50vw",priority:0===t})})})]},e.number))}),(0,s.jsx)(i.P.div,{initial:{opacity:0,y:20},whileInView:{opacity:1,y:0},viewport:{once:!0},className:"mt-16 md:mt-24 text-center",children:(0,s.jsx)("button",{onClick:()=>window.location.href="/dashboard/create",className:"px-6 py-3 text-white font-medium text-lg rounded-full bg-primary hover:bg-[#333333] transition-colors shadow-md",children:"Transform Your Photo Now"})})]})})}var j=a(2987),N=a(7712),k=a(4616);let A=[{question:"How does the Ghibli style transformation work?",answer:"Our AI technology analyzes your photo and applies the distinctive Studio Ghibli art style while preserving the original essence of your image. The process uses advanced machine learning models trained on thousands of Ghibli artwork samples to create authentic transformations."},{question:"What types of photos work best?",answer:"Clear, well-lit photos work best for transformation. We support all types of images including portraits, landscapes, pets, and group photos. For optimal results, we recommend using high-resolution images without heavy filters or effects."},{question:"How long does the transformation process take?",answer:"The processing time depends on the quality of the image you upload.\n\nIf the image is of low quality or small size, the process will be faster, but the final result may 
1not be as great.\n\nIf the image is of high quality and large size, the process may take longer, but the results will be much better."},{question:"Do you offer bulk processing for multiple images?",answer:"At this moment, you can only upload and restyle one image at a time. After you've processed one image, you can upload and transform another."},{question:"Can I use the transformed images commercially?",answer:"You can use transformed images commercially if you purchase credits. With the 3 free credits you receive upon signing up, you can try 3 images, but these will come with a watermark. Once you buy credits, the images will be high-quality, no watermark, and available for commercial use."},{question:"What if I'm not satisfied with the results?",answer:"We offer a 14-day money-back guarantee on all our plans. If you're not completely satisfied with the transformations, our support team will help you optimize the results or process a full refund."},{question:"How do credits work?",answer:"Credits are required for each image transformation. Typically, 1 credit equals 1 image. You can track your credits and usage in your account."},{question:"How do I report an issue or request support?",answer:"Our 24/7 customer support team is here to help! You can contact us anytime via email at [email protected] or visit our support page for FAQs and troubleshooting."},{question:"Can I share my images directly to social media?",answer:"Yes! Once your images are transformed, you can share them instantly to your favorite social media platforms like Instagram, Facebook, and X (Twitter) with 
1just a click."}];function C(){let[e,t]=(0,r.useState)(null);return(0,s.jsx)("section",{className:"py-24 bg-[#f0f0ec]",children:(0,s.jsxs)("div",{className:"max-w-4xl mx-auto px-4 sm:px-6 lg:px-8",children:[(0,s.jsxs)("div",{className:"text-center mb-16",children:[(0,s.jsx)(i.P.h2,{initial:{opacity:0,y:20},whileInView:{opacity:1,y:0},viewport:{once:!0},className:"hero-text text-3xl md:text-4xl font-bold text-foreground mb-4",children:"Frequently Asked Questions"}),(0,s.jsx)("p",{className:"text-lg text-foreground/80",children:"Everything you need to know about our Ghibli transformation service"})]}),(0,s.jsx)("div",{className:"space-y-4",children:A.map((a,r)=>(0,s.jsxs)(i.P.div,{initial:{opacity:0,y:20},whileInView:{opacity:1,y:0},viewport:{once:!0},transition:{delay:.1*r},className:"bg-white rounded-2xl overflow-hidden relative",children:[(0,s.jsxs)("button",{onClick:()=>t(e===r?null:r),className:"w-full text-left p-6 pr-12 flex items-center justify-between",children:[(0,s.jsx)("span",{className:"font-medium text-lg text-foreground",children:a.question}),(0,s.jsx)("span",{className:"absolute right-6 top-6 text-primary",children:e===r?(0,s.jsx)(N.A,{className:"h-5 w-5"}):(0,s.jsx)(k.A,{className:"h-5 w-5"})})]}),(0,s.jsx)("div",{className:"overflow-hidden transition-all duration-300 ease-in-out ".concat(e===r?"max-h-96":"max-h-0"),children:(0,s.jsx)("div",{className:"p-6 pt-0 text-foreground/80",children:a.answer.split("\n\n").map((e,t)=>(0,s.jsx)("p",{className:t>0?"mt-4":"",children:e},t))})}),(0,s.jsx)("div",{className:"absolute -bottom-4 -right-4 w-full h-full bg-primary/10 rounded-2xl -z-10"})]},r))}),(0,s.jsx)(i.P.div,{initial:{opacity:0}
1,whileInView:{opacity:1},viewport:{once:!0},className:"mt-16 text-center",children:(0,s.jsxs)("p",{className:"text-lg text-foreground/80",children:["Still have questions?"," ",(0,s.jsx)("button",{className:"text-primary hover:underline font-medium",children:"Contact our support team"})]})})]})})}let I=[{name:"Sarah",role:"Parent",avatar:"https://images.unsplash.com/photo-1438761681033-6461ffad8d80?w=400&h=400&fit=crop",content:"My kids absolutely love generating Ghibli-style images! They get excited every time. It's like having an infinite magical art gallery at their fingertips."},{name:"Marcus",role:"Art Teacher",avatar:"https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?w=400&h=400&fit=crop",content:"This keeps both my 5th and 8th-grade students engaged! They love seeing their artwork transformed into Ghibli style. It's a fantastic tool for teaching animation art history."},{name:"Nina",role:"Digital Artist",avatar:"https://images.unsplash.com/photo-1544005313-94ddf0286df2?w=400&h=400&fit=crop",content:"The variety of Ghibli transformations you can create is incredible. The AI perfectly captures that magical Ghibli essence while keeping the original character intact."},{name:"Thomas",role:"Parent",avatar:"https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=400&h=400&fit=crop",content:"Perfect for birthday parties and creative sessions. Each kid gets their own unique Ghibli portrait. They love comparing their magical transformations."},{name:"Emma",role:"Illustrator",avatar:"https://images.unsplash.com/photo-1494790108377-be9c29b29330?w=400&h=400&fit=crop",content:"This tool is amazing! I use it almost daily for inspiration. The way it captures the Ghibli art style is incredibly accurate and inspiring."},{name:"Alex",role:"Photography Studio Owner",avatar:"https://images.unsplash.com/photo-1500648767791-00dcc994a43e?w=400&h=400&fit=crop",content:"Our clients love the option to transform their professional photos into Ghibli art. It's become a unique selling point for our studio."},{name:"Sophie",role:"Elementary Teacher",avatar:"https://images.unsplash.com/photo-1534528741775-53994a69daeb?w=400&h=400&fit=crop",content:"The seasonal themes are wonderful. We love creating holiday-themed Ghibli transformations. Makes every classroom celebration more magical."},{name:"James",role:"Parent & Tech Enthusiast",avatar:"https://images.unsplash.com/photo-1506794778202-cad84cf45f1d?w=400&h=400&fit=crop",content:"Best investment for my kids' creativity. Hours of screen time well spent creating magical Ghibli art. They're proud to display their masterpieces."}],S=(e,t)=>{let a=Array.from({length:t},()=>[]);return e.forEach((e,s)=>{a[s%t].push(e)}),a};function P(){let e=(0,r.useRef)([,,,,].fill(null)),t=(0,r.useRef)([]),a=[.05,.06,.07,.055],o=(0,r.useRef)([,,,,].fill(0)),n=(0,r.useRef)([,,,,].fill(0));(0,r.useEffect)(()=>{let s=r=>{e.current.forEach((e,t)=>{if(!e)return;n.current[t]||(n.current[t]=r);let s=r-n.current[t];n.current[t]=r,o.current[t]-=a[t]*s/32,o.current[t]<=-100&&(o.current[t]=0),e.style.transform="translateY(".concat(o.current[t],"%)")}),t.current[0]=requestAnimationFrame(s)};return t.current[0]=requestAnimationFrame(s),()=>{t.current[0]&&cancelAnimationFrame(t.current[0])}},[]);let c=S(I,4);return(0,s.jsx)("section",{className:"py-24 bg-[#f0f0ec]",children:(0,s.jsxs)("div",{className:"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8",children:[(0,s.jsxs)("div",{className:"text-center mb-16",children:[(0,s.jsx)(i.P.h2,{initial:{opacity:0,y:20},whileInView:{opacity:1,y:0},viewport:{once:!0},className:"hero-text text-3xl md:text-4xl font-bold text-foreground mb-4",children:"Transform Your World into Ghibli Magic"}),(0,s.jsx)("p",{className:"text-lg text-foreground/80",children:"Join our growing community of dreamers and creators"})]}),(0,s.jsx)("div",{className:"relative max-w-6xl mx-auto",children:(0,s.jsxs)("div",{className:"relative h-[600px] overflow-hidden",children:[(0,s.jsx)("div",{className:"absolute top-0 left-0 right-0 h-48 bg-gradient-to-b from-[#f0f0ec] via-[#f0f0ec]/95 to-transparent z-10 pointer-events-none"}),(0,s.jsx)("div",{className:"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 h-full",children:c.map((t,a)=>(0,s.jsx)("div",{ref:t=>e.current[a]=t,className:"space-y-4 will-change-transform",children:[...t,...t].map((e,t)=>(0,s.jsxs)("div",{className:"bg-white rounded-2xl p-6 relative",children:[(0,s.jsxs)("div",{className:"flex items-center gap-4",children:[(0,s.jsx)("div",{className:"relative w-12 h-12 rounded-full overflow-hidden",children:(0,s.jsx)(l.default,{src:e.avatar,alt:e.name,fill:!0,className:"object-cover"})}),(0,s.jsxs)("div",{children:[(0,s.jsx)("h3",{className:"font-medium text-foreground",children:e.name}
1),(0,s.jsx)("p",{className:"text-sm text-foreground/60",children:e.role})]})]}),(0,s.jsx)("p",{className:"mt-4 text-foreground/80",children:e.content}),(0,s.jsx)("div",{className:"absolute -bottom-4 -right-4 w-full h-full bg-primary/10 rounded-2xl -z-10"})]},"".concat(e.name,"-").concat(t)))},a))}),(0,s.jsx)("div",{className:"absolute bottom-0 left-0 right-0 h-48 bg-gradient-to-t from-[#f0f0ec] via-[#f0f0ec]/95 to-transparent z-10 pointer-events-none"})]})}),(0,s.jsx)(i.P.div,{initial:{opacity:0},whileInView:{opacity:1},viewport:{once:!0},className:"mt-16 text-center",children:(0,s.jsx)("button",{onClick:()=>window.location.href="/dashboard",className:"px-6 py-3 text-white font-medium text-lg rounded-full bg-primary hover:bg-[#333333] transition-colors",children:"Start Your Magical Journey"})})]})})}var G=a(5922),T=a(690),q=a(5040),E=a(7434),z=a(3274),F=a(8436),M=a(8668),R=a(5695),W=a(1586),_=a(5560);function H(e){var t,a,i;let{onShowAuth:o}=e,{user:c,signOut:m}=(0,z.A)(),{credits:x,loading:p}=(0,M.I)(),[f,g]=(0,r.useState)(!1),b=(0,r.useRef)(null),y=(0,R.useRouter)();(0,r.useEffect)(()=>{let e=e=>{b.current&&!b.current.contains(e.target)&&g(!1)};return document.addEventListener("mousedown",e),()=>document.removeEventListener("mousedown",e)},[]);let w=async()=>{await m(),g(!1),y.push("/"),setTimeout(()=>{o()},100)};return(0,s.jsxs)("div",{className:"relative",ref:b,children:[(0,s.jsxs)("button",{onClick:()=>g(!f),className:"flex items-center gap-2 px-4 py-2 rounded-full bg-accent hover:bg-accent/80 transition-colors",children:[(null==c?void 0:null===(t=c.user_metadata)||void 0===t?void 0:t.avatar_url)&&(0,s.jsx)(l.default,{src:c.user_metadata.avatar_url,alt:"Profile",width:24,height:24,className:"rounded-full"}),(0,s.jsx)("span",{children:(null==c?void 0:null===(a=c.user_metadata)||void 0===a?void 0:a.full_name)||(null==c?void 0:c.email)})]}),f&&(0,s.jsx)("div",{className:"absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-background border border-border",children:(0,s.jsxs)("div",{className:"py-2",children:[(0,s.jsxs)("div",{className:"px-4 py-3 border-b border-border",children:[(0,s.jsx)("p",{className:"text-sm font-medium",children:null==c?void 0:null===(i=c.user_metadata)||void 0===i?void 0:i.full_name}),(0,s.jsx)("p",{className:"text-xs text-muted-foreground truncate",children:null==c?void 0:c.email})]}),(0,s.jsxs)("div",{className:"flex items-center px-4 py-3 border-b border-border",children:[(0,s.jsx)("div",{className:"h-6 w-6 rounded-full bg-amber-100 flex items-center justify-center mr-2",children:(0,s.jsxs)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"currentColor",className:"h-3.5 w-3.5 text-amber-600",children:[(0,s.jsx)("path",{d:"M10.464 8.746c.227-.18.497-.311.786-.394v2.795a2.252 2.252 0 01-.786-.393c-.394-.313-.546-.681-.546-1.004 0-.323.152-.691.546-1.004zM12.75 15.662v-2.824c.347.085.664.228.921.421.427.32.579.686.579.991 0 .305-.152.671-.579.991a2.534 2.534 0 01-.921.42z"}),(0,s.jsx)("path",{fillRule:"evenodd",d:"M12 2.25c-5.385 0-9.75 4.365-9.75 9.75s4.365 9.75 9.75 9.75 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25zM12.75 6a.75.75 0 00-1.5 0v.816a3.836 3.836 0 00-1.72.756c-.712.566-1.112 1.35-1.112 2.178 0 .829.4 1.612 1.113 2.178.502.4 1.102.647 1.719.756v2.978a2.536 2.536 0 01-.921-.421l-.879-.66a.75.75 0 00-.9 1.2l.879.66c.533.4 1.169.645 1.821.75V18a.75.75 0 001.5 0v-.81a4.124 4.124 0 001.821-.749c.745-.559 1.179-1.344 1.179-2.191 0-.847-.434-1.632-1.179-2.191a4.122 4.122 0 00-1.821-.75V8.354c.29.082.559.213.786.393l.415.33a.75.75 0 00.933-1.175l-.415-.330a3.836 3.836 0 00-1.719-.755V6z",clipRule:"evenodd"})]})}),(0,s.jsxs)("div",{children:[(0,s.jsx)("span",{className:"text-sm",children:"Available Credits: "}),p?(0,s.jsx)("span",{className:"inline-block w-4 h-4 bg-muted animate-pulse rounded-md"}):(0,s.jsx)("span",{className:"font-medium",children:x})]})]}),(0,s.jsxs)("div",{className:"py-2",children:[(0,s.jsxs)(n(),{href:"/dashboard/create",className:"flex items-center gap-2 px-4 py-2 text-sm hover:bg-accent transition-colors",onClick:()=>g(!1),children:[(0,s.jsx)(T.A,{className:"w-4 h-4"}),"Create"]}),(0,s.jsxs)(n(),{href:"/dashboard/gallery",className:"flex items-center gap-2 px-4 py-2 text-sm hover:bg-accent transition-colors",onClick:()=>g(!1),children:[(0,s.jsx)(d.A,{className:"w-4 h-4"}),"Gallery"]}),(0,s.jsxs)(n(),{href:"/dashboard/credits",className:"flex items-center gap-2 px-4 py-2 text-sm hover:bg-accent transition-colors",onClick:()=>g(!1),children:[(0,s.jsx)(W.A,{className:"w-4 h-4"}),"Get Credits"]}),(0,s.jsxs)(n(),{href:"/dashboard/settings",className:"flex items-center gap-2 px-4 py-2 text-sm hover:bg-accent transition-colors",onClick:()=>g(!1),children:[(0,s.jsx)(h.A,{className:"w-4 h-4"}),"Settings"]}),(0,s.jsxs)(n(),{href:"/support",className:"flex items-center gap-2 px-4 py-2 text-sm hover:bg-accent transition-colors",onClick:()=>g(!1),children:[(0,s.jsx)(_.A,{className:"w-4 h-4"}),"Support"]}),(0,s.jsxs)("button",{onClick:w,className:"w-full flex items-center gap-2 px-4 py-2 text-sm text-red-500 hover:bg-accent transition-colors",children:[(0,s.jsx)(u.A,{className:"w-4 h-4"}),"Log out"]})]})]})})]})}var O=a(7009);function V(){let{user:e,signInWithGoogle:t,signOut:a}=(0,z.A)(),[o,x]=(0,r.useState)(!1),[p,g]=(0,r.useState)(!1),[b,w]=(0,r.useState)("login"),[N,k]=(0,r.useState)(!0);(0,r.useEffect)(()=>{k(!1)},[e]);let A=e=>{let t=document.getElementById(e);t&&t.scrollIntoView({behavior:"smooth"}),x(!1)};return N?(0,s.jsx)(O.x,{}):(0,s.jsxs)("div",{className:"min-h-screen bg-background",children:[(0,s.jsxs)("header",{className:"fixed top-0 left-0 right-0 bg-background z-50 border-b border-foreground
1/10",children:[(0,s.jsx)("div",{className:"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8",children:(0,s.jsxs)("div",{className:"h-20 md:h-24 flex items-center justify-between",children:[(0,s.jsx)("div",{className:"flex-shrink-0",children:(0,s.jsx)(l.default,{src:"/images/logo.svg",alt:"Ghibli Magic Style",width:320,height:80,className:"h-20 w-auto"})}),(0,s.jsxs)("nav",{className:"hidden md:flex items-center justify-center space-x-12 lg:space-x-16 flex-1 max-w-2xl mx-auto",children:[(0,s.jsxs)(n(),{href:"/dashboard/create",className:"nav-link text-lg whitespace-nowrap flex items-center gap-2",children:[(0,s.jsx)(T.A,{className:"h-5 w-5"}),"Add photo"]}),(0,s.jsxs)("button",{onClick:()=>A("how-it-works"),className:"nav-link text-lg whitespace-nowrap flex items-center gap-2",children:[(0,s.jsx)(q.A,{className:"h-5 w-5"}),"How It Works"]}),(0,s.jsxs)("button",{onClick:()=>A("pricing"),className:"nav-link text-lg whitespace-nowrap flex items-center gap-2",children:[(0,s.jsx)(E.A,{className:"h-5 w-5"}),"Pricing"]})]}),(0,s.jsx)("div",{className:"hidden md:flex items-center justify-end space-x-6 lg:space-x-8 flex-shrink-0",children:e?(0,s.jsx)(H,{onShowAuth:()=>{w("login"),g(!0)}}):(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)("button",{onClick:()=>{w("signup"),g(!0)},className:"text-base font-medium hover:text-primary transition-colors",children:"Sign Up"}),(0,s.jsx)("button",{onClick:()=>{w("login"),g(!0)},className:"px-6 py-2 rounded-full bg-primary text-white hover:bg-primary/90 transition-colors",children:"Login"})]})}),(0,s.jsx)("button",{className:"md:hidden p-2",onClick:()=>x(!o),"aria-label":"Toggle menu",children:o?(0,s.jsx)(c.A,{className:"h-6 w-6"}):(0,s.jsx)(m.A,{className:"h-6 w-6"})})]})}),o&&(0,s.jsx)("div",{className:"md:hidden absolute top-full left-0 right-0 bg-background border-b border-foreground
1/10",children:(0,s.jsxs)("nav",{className:"px-4 py-4 space-y-4",children:[(0,s.jsxs)(n(),{href:"/dashboard/create",className:"nav-link block w-full text-left py-2 flex items-center",onClick:()=>x(!1),children:[(0,s.jsx)(T.A,{className:"h-5 w-5 mr-2"}),"Add photo"]}),(0,s.jsxs)("button",{onClick:()=>A("how-it-works"),className:"nav-link block w-full text-left py-2 flex items-center",children:[(0,s.jsx)(q.A,{className:"h-5 w-5 mr-2"}),"How It Works"]}),(0,s.jsxs)("button",{onClick:()=>A("pricing"),className:"nav-link block w-full text-left py-2 flex items-center",children:[(0,s.jsx)(E.A,{className:"h-5 w-5 mr-2"}),"Pricing"]}),e?(0,s.jsxs)("div",{className:"pt-2 border-t border-foreground/10",children:[(0,s.jsxs)(n(),{href:"/dashboard/gallery",className:"nav-link block w-full text-left py-2 flex items-center",onClick:()=>x(!1),children:[(0,s.jsx)(d.A,{className:"h-5 w-5 mr-2"}),"My Gallery"]}),(0,s.jsxs)(n(),{href:"/dashboard/settings",className:"nav-link block w-full text-left py-2 flex items-center",onClick:()=>x(!1),children:[(0,s.jsx)(h.A,{className:"h-5 w-5 mr-2"}),"Settings"]}),(0,s.jsxs)("button",{onClick:()=>{a(),x(!1)},className:"nav-link block w-full text-left py-2 flex items-center text-red-500",children:[(0,s.jsx)(u.A,{className:"h-5 w-5 mr-2"}),"Sign Out"]})]}):(0,s.jsxs)("div",{className:"pt-4 mt-2 border-t border-foreground
1/10 flex flex-col gap-3",children:[(0,s.jsx)("button",{onClick:()=>{w("signup"),g(!0),x(!1)},className:"text-base font-medium hover:text-primary transition-colors py-2",children:"Sign Up"}),(0,s.jsx)("button",{onClick:()=>{w("login"),g(!0),x(!1)},className:"px-6 py-2.5 rounded-full bg-primary text-white hover:bg-primary/90 transition-colors font-medium",children:"Login"})]})]})})]}),(0,s.jsx)("section",{className:"pt-32 md:pt-40 pb-16 sm:pb-20",children:(0,s.jsx)("div",{className:"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8",children:(0,s.jsxs)("div",{className:"grid grid-cols-1 lg:grid-cols-2 gap-12 items-center",children:[(0,s.jsxs)("div",{children:[(0,s.jsx)(i.P.h1,{initial:{opacity:0,y:20},animate:{opacity:1,y:0},className:"hero-text font-bold tracking-tight text-foreground",children:"Studio Ghibli Filter: Transform your pictures into Ghibli style art in seconds"}),(0,s.jsx)("p",{className:"mt-6 text-xl text-foreground/80",children:"→ Upload → Restyle → Experience the Magic"}),(0,s.jsxs)("div",{className:"mt-8 flex flex-col sm:flex-row gap-4",children:[(0,s.jsx)(n(),{href:"/dashboard",className:"btn-primary rounded-full bg-primary hover:bg-[#333333] transition-colors",children:"Try for Free"}),(0,s.jsx)("button",{onClick:()=>A("Transform-Any-Photo"),className:"btn-demo bg-[#333333] hover:bg-primary transition-colors",children:"Learn More"})]})]}),(0,s.jsx)("div",{className:"relative mt-8 lg:mt-0",children:(0,s.jsxs)("div",{className:"relative",children:[(0,s.jsx)(l.default,{src:"/images/before-after.webp",alt:"Before and After Transformation",width:600,height:800,className:"rounded-2xl w-full",priority:!0}),(0,s.jsx)("div",{className:"absolute -bottom-4 -right-4 bg-primary/10 w-full h-full rounded-2xl -z-10"})]})})]})})}),(0,s.jsx)(f,{}),(0,s.jsx)(y,{}),(0,s.jsx)(v,{}),(0,s.jsx)(j.A,{}),(0,s.jsx)(C,{}),(0,s.jsx)(P,{}),(0,s.jsx)(G.A,{}),(0,s.jsx)(F.U,{isOpen:p,onClose:()=>g(!1),initialView:b})]})}},7009:(e,t,a)=>{"use strict";a.d(t,{x:()=>r});var s=a(5155);function r(){return(0,s.jsx)("div",{className:"fixed inset-0 bg-background flex items-center justify-center",children:(0,s.jsx)("div",{className:"animate-spin rounded-full h-8 w-8 border-t-2 border-b-2 border-primary"})})}},8668:(e,t,a)=>{"use strict";
1a.d(t,{CreditsProvider:()=>u,I:()=>h});var s=a(5155),r=a(2115),i=a(3274),l=a(5168),o=a(8543);let n=async()=>{},c=async()=>!1,m=async()=>!1,d=(0,r.createContext)({credits:0,loading:!0,refreshCredits:n,decrementCredits:c,error:null,hasSufficientCredits:()=>!1,useCredit:m}),h=()=>(0,r.useContext)(d);function u(e){let{children:t}=e,{user:a}=(0,i.A)(),[n,c]=(0,r.useState)(0),[m,h]=(0,r.useState)(!0),[u,x]=(0,r.useState)(null),p=(0,r.useRef)(0),f=(0,r.useRef)(!0),g=(0,r.useRef)(!1),b=(0,r.useCallback)(async function(){let e=arguments.length>0&&void 0!==arguments[0]&&arguments[0];if(!a){c(0),h(!1);return}let t=Date.now();if((e||!(t-p.current<5e3))&&!g.current){g.current=!0;try{h(!0);let e=(0,l.S)(),{data:s,error:r}=await e.from("profiles").select("credits").eq("id",a.id).single();if(r)throw r;f.current&&(c((null==s?void 0:s.credits)||0),p.current=t)}catch(e){console.error("Error fetching credits:",e),f.current&&x("Failed to load credits")}finally{f.current&&h(!1),g.current=!1}}},[a]),y=(0,r.useCallback)(async()=>{await b(!0)},[b]),w=(0,r.useCallback)(async function(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:1;if(!a)return!1;try{h(!0);let t=(0,l.S)(),{data:s,error:r}=await t.rpc("decrement_credits",{p_amount:e,p_user_id:a.id});if(r)return console.error("Error decrementing credits:",r),x("Failed to use credits"),!1;if(!0===s)return await b(),!0;return!1}catch(e){return console.error("Error decrementing credits:",e),x("Failed to use credits"),!1}finally{h(!1)}},[a,b]),v=(0,r.useCallback)(function(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:1;return n>=e},[n]),j=(0,r.useCallback)(async function(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:1;return a?v(e)?await w(e):(o.oR.error("Not enough credits. You need at least ".concat(e," credit(s).")),!1):(o.oR.error("Please sign in to use credits"),!1)},[a,v,w]);return(0,r.useEffect)(()=>(f.current=!0,b(),()=>{f.current=!1}),[b]),(0,r.useEffect)(()=>{a&&(b(),"success"===new URL(window.location.href).searchParams.get("purchase")&&(setTimeout(()=>{b()},2e3),window.history.replaceState({},"",window.location.pathname)))},[a]),(0,s.jsx)(d.Provider,{value:{credits:n,loading:m,refreshCredits:y,decrementCredits:w,error:u,hasSufficientCredits:v,useCredit:j},children:t})}}},e=>{var t=t=>e(e.s=t);e.O(0,[167,277,543,212,733,922,987,441,684,358],()=>t(61)),_N_E=e.O()}]);

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.