import { useState, useEffect } from "react"; // ───────────────────────────────────────────── // YesStyle Color Palette (exact) // Primary pink: #F26B8A (coral-rose, all CTAs) // Pink light: #FDE8EE (hover bg, badges) // Pink mid: #F9C8D4 (borders, tags) // White: #FFFFFF // Background: #F7F7F7 (section bg) // Border: #E8E8E8 // Text dark: #333333 // Text mid: #666666 // Text light: #999999 // Red sale: #E53935 // Green stock: #2E9E5B // Black nav: #1A1A1A // ───────────────────────────────────────────── const C = { pink: "#F26B8A", pinkLight: "#FDE8EE", pinkMid: "#F9C8D4", pinkDark: "#D4527A", white: "#FFFFFF", bg: "#F7F7F7", bgCard: "#FFFFFF", border: "#E8E8E8", borderLight: "#F2F2F2", text: "#333333", textMid: "#666666", textLight: "#999999", red: "#E53935", green: "#2E9E5B", black: "#1A1A1A", blackSoft: "#2D2D2D", }; const FONT_BODY = "'Noto Sans', 'Helvetica Neue', Arial, sans-serif"; const FONT_DISPLAY = "'Playfair Display', Georgia, serif"; // ── DATA ───────────────────────────────────────────────────────────────────── const CATEGORIES = [ { id:"all", label:"All", emoji:"🌸" }, { id:"serum", label:"Serums", emoji:"💧" }, { id:"moisturizer", label:"Moisturizers", emoji:"🌿" }, { id:"cleanser", label:"Cleansers", emoji:"✨" }, { id:"sunscreen", label:"Sunscreen", emoji:"☀️" }, { id:"toner", label:"Toners", emoji:"🌊" }, { id:"mask", label:"Sheet Masks", emoji:"🎭" }, { id:"eye", label:"Eye Care", emoji:"👁️" }, ]; const BRANDS = ["COSRX","Laneige","Beauty of Joseon","Some By Mi","Innisfree","Klairs","MISSHA","Dr.Jart+","TonyMoly","Etude House"]; const PRODUCTS = [ { id:1, name:"Advanced Snail 96 Mucin Power Essence", brand:"COSRX", price:22.90, originalPrice:28.00, category:"serum", rating:4.9, reviews:2841, bestseller:true, new:false, img:"https://images.unsplash.com/photo-1620916566398-39f1143ab7be?w=500&q=80", description:"96% snail secretion filtrate deeply hydrates and repairs skin barrier, reducing scars and brightening complexion for glass-like skin.", tags:["Hydrating","Barrier Repair","Anti-Scar"] }, { id:2, name:"Water Sleeping Mask", brand:"Laneige", price:34.00, originalPrice:42.00, category:"mask", rating:4.8, reviews:1920, bestseller:true, new:false, img:"https://images.unsplash.com/photo-1556228453-efd6c1ff04f6?w=500&q=80", description:"Replenishes moisture overnight with MOISTURE WRAP™ technology and sleepscent fragrance for a dewy, plump complexion by morning.", tags:["Overnight","Hydrating","Brightening"] }, { id:3, name:"Glow Serum with Propolis", brand:"Beauty of Joseon", price:18.00, originalPrice:22.00, category:"serum", rating:4.9, reviews:3102, bestseller:true, new:false, img:"https://images.unsplash.com/photo-1617897903246-719242758050?w=500&q=80", description:"Traditional propolis extract combined with niacinamide for a luminous, glass-skin glow that fades hyperpigmentation and evens skin tone.", tags:["Brightening","Propolis","Glass Skin"] }, { id:4, name:"AHA-BHA-PHA 30 Days Miracle Toner", brand:"Some By Mi", price:19.50, originalPrice:24.00, category:"toner", rating:4.7, reviews:1654, bestseller:false, new:false, img:"https://images.unsplash.com/photo-1598440947619-2c35fc9aa908?w=500&q=80", description:"Triple acid formula visibly transforms skin in 30 days — diminishes acne, tightens pores, and smooths uneven texture gently.", tags:["Exfoliating","Acne-Care","Pore-Tightening"] }, { id:5, name:"Green Tea Seed Serum", brand:"Innisfree", price:24.00, originalPrice:30.00, category:"serum", rating:4.6, reviews:987, bestseller:false, new:true, img:"https://images.unsplash.com/photo-1570194065650-d99fb4bedf0a?w=500&q=80", description:"Jeju green tea seed extract delivers long-lasting moisture with antioxidant protection for a radiant, refreshed complexion all day.", tags:["Antioxidant","Lightweight","Jeju"] }, { id:6, name:"Supple Preparation Toner", brand:"Klairs", price:22.00, originalPrice:27.00, category:"toner", rating:4.8, reviews:1433, bestseller:true, new:false, img:"https://images.unsplash.com/photo-1590439471364-192aa70c0b53?w=500&q=80", description:"Alcohol-free, fragrance-free toner that preps skin with fermented ingredients for maximum absorption of subsequent skincare steps.", tags:["Sensitive","Calming","Fermented"] }, { id:7, name:"Time Revolution First Essence", brand:"MISSHA", price:38.00, originalPrice:48.00, category:"serum", rating:4.7, reviews:2210, bestseller:false, new:false, img:"https://images.unsplash.com/photo-1608248597279-f99d160bfcbc?w=500&q=80", description:"90% saccharomyces filtrate with fermented yeast creates velvety-smooth, visibly younger-looking skin from the very first drop.", tags:["Anti-Aging","Fermented","Velvety"] }, { id:8, name:"Cicapair Tiger Grass Cream", brand:"Dr.Jart+", price:48.00, originalPrice:58.00, category:"moisturizer", rating:4.8, reviews:1876, bestseller:true, new:false, img:"https://images.unsplash.com/photo-1601049405845-a02aa2b85b58?w=500&q=80", description:"Centella asiatica neutralizes redness and rebuilds skin's natural resilience — the ultimate recovery cream for sensitised skin.", tags:["Redness Relief","Repair","Cica"] }, { id:9, name:"Egg Pore Tightening Toner", brand:"TonyMoly", price:14.00, originalPrice:18.00, category:"toner", rating:4.5, reviews:763, bestseller:false, new:true, img:"https://images.unsplash.com/photo-1543071220-6ee5bf71a54e?w=500&q=80", description:"Egg white extract minimizes pore appearance and controls excess sebum for smooth, refined skin that stays matte all day.", tags:["Pore Care","Oil Control","Matte"] }, { id:10, name:"SoonJung 2x Barrier Cream", brand:"Etude House", price:16.00, originalPrice:20.00, category:"moisturizer", rating:4.7, reviews:1120, bestseller:false, new:false, img:"https://images.unsplash.com/photo-1505740420928-5e560c06d30e?w=500&q=80", description:"Panthenol-enriched formula soothes inflammation and fortifies sensitive skin's moisture barrier for lasting comfort and softness.", tags:["Sensitive","Barrier Repair","Panthenol"] }, { id:11, name:"Relief Sun: Rice + Probiotics SPF50+", brand:"Beauty of Joseon", price:16.00, originalPrice:20.00, category:"sunscreen", rating:4.9, reviews:4521, bestseller:true, new:false, img:"https://images.unsplash.com/photo-1571781926291-c477ebfd024b?w=500&q=80", description:"Rice extract + probiotics in a featherlight formula — Korea's most loved SPF50+ sunscreen that leaves zero white cast on all skin tones.", tags:["SPF50+","No White Cast","Lightweight"] }, { id:12, name:"Low pH Good Morning Gel Cleanser", brand:"COSRX", price:14.00, originalPrice:18.00, category:"cleanser", rating:4.8, reviews:3290, bestseller:true, new:false, img:"https://images.unsplash.com/photo-1556228578-8c89e6adf883?w=500&q=80", description:"Gentle low-pH BHA cleanser with tea-tree oil that unclogs pores and clears skin without stripping your natural moisture barrier.", tags:["Gentle","pH Balanced","BHA"] }, { id:13, name:"Ceramide Eye Cream", brand:"Klairs", price:28.00, originalPrice:34.00, category:"eye", rating:4.6, reviews:589, bestseller:false, new:true, img:"https://images.unsplash.com/photo-1616394584738-fc6e612e71b9?w=500&q=80", description:"Rich ceramide formula plumps fine lines and brightens dark circles around the delicate eye contour for a well-rested appearance.", tags:["Eye Care","Ceramide","Dark Circles"] }, { id:14, name:"Mugwort Pore Cleansing Foam", brand:"Some By Mi", price:12.00, originalPrice:15.00, category:"cleanser", rating:4.7, reviews:832, bestseller:false, new:true, img:"https://images.unsplash.com/photo-1619451334792-150fd785ee74?w=500&q=80", description:"Artemisia mugwort extract deep-cleanses pores while calming inflammation and redness in stressed, reactive skin.", tags:["Deep Cleanse","Calming","Mugwort"] }, { id:15, name:"Heartleaf Moisturizing Sun Cream", brand:"Beauty of Joseon", price:15.00, originalPrice:19.00, category:"sunscreen", rating:4.8, reviews:2103, bestseller:false, new:false, img:"https://images.unsplash.com/photo-1535585209827-a15fcdbc4c2d?w=500&q=80", description:"Houttuynia cordata-infused SPF50+ sunscreen calms and protects sensitive skin with a silky, pore-blurring matte finish.", tags:["SPF50+","Soothing","Heartleaf"] }, { id:16, name:"Green Tea & Hyaluronic Sleeping Mask", brand:"Innisfree", price:26.00, originalPrice:32.00, category:"mask", rating:4.6, reviews:674, bestseller:false, new:true, img:"https://images.unsplash.com/photo-1512290923902-8a9f81dc236c?w=500&q=80", description:"Volcanic water and hyaluronic acid deliver 72-hour continuous hydration overnight, waking up to plumped, glass-like glowing skin.", tags:["72H Hydration","Plumping","Green Tea"] }, ]; const HERO_SLIDES = [ { label:"SALE", pct:"UP TO 30% OFF", title:"Your Korean\nBeauty Ritual", sub:"Authentic K-beauty from the world's favourite brands, shipped from Vienna.", cta:"Shop Now", badge:"🌸 New Season Arrivals" }, { label:"BESTSELLERS", pct:"TOP PICKS", title:"Most Loved\nProducts", sub:"Discover what thousands of customers can't stop repurchasing every month.", cta:"Shop Bestsellers", badge:"⭐ Community Favourites" }, { label:"SUNSCREEN", pct:"SPF HEROES", title:"Glass Skin\nSun Protection", sub:"Zero white cast SPF50+ formulas trusted by millions across Europe.", cta:"Shop Sunscreen", badge:"☀️ Summer Must-Haves" }, ]; // ── ICONS ───────────────────────────────────────────────────────────────────── const Ico = { Search: ()=>, Cart: ({n})=> {n>0&&{n}} , Heart: ({on})=>, Star: ({on})=>, Close: ()=>, Plus: ()=>, Minus: ()=>, ChevR: ()=>, ChevL: ()=>, Truck: ()=>, Shield: ()=>, Check: ()=>, Gift: ()=>, ArrowR: ()=>, Filter: ()=>, User: ()=>, BigCheck: ()=>, }; const Stars = ({r})=>{[1,2,3,4,5].map(i=>)}; // ── MAIN APP ───────────────────────────────────────────────────────────────── export default function Skynzi() { const [page, setPage] = useState("home"); const [selProd, setSelProd] = useState(null); const [cart, setCart] = useState([]); const [wish, setWish] = useState([]); const [cartOpen, setCartOpen] = useState(false); const [slide, setSlide] = useState(0); const [cat, setCat] = useState("all"); const [brand, setBrand] = useState("All"); const [search, setSearch] = useState(""); const [searchOpen, setSearchOpen] = useState(false); const [form, setForm] = useState({ fname:"",lname:"",email:"",phone:"",addr:"",city:"",zip:"",country:"Austria",cname:"",cnum:"",exp:"",cvv:"" }); const [toast, setToast] = useState(null); useEffect(()=>{ const id=setInterval(()=>setSlide(s=>(s+1)%HERO_SLIDES.length),4500); return ()=>clearInterval(id); },[]); useEffect(()=>{ const lk=document.createElement("link"); lk.rel="stylesheet"; lk.href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700&family=Noto+Sans:wght@400;500;600&display=swap"; document.head.appendChild(lk); },[]); const notify = msg=>{setToast(msg);setTimeout(()=>setToast(null),2400);}; const go=(pg,p=null)=>{setPage(pg);if(p)setSelProd(p);window.scrollTo?.(0,0);}; const addCart=(prod,qty=1)=>{ setCart(c=>{const e=c.find(i=>i.id===prod.id);return e?c.map(i=>i.id===prod.id?{...i,qty:i.qty+qty}:i):[...c,{...prod,qty}];}); notify(`Added to cart!`); }; const removeCart=id=>setCart(c=>c.filter(i=>i.id!==id)); const chQty=(id,d)=>setCart(c=>c.map(i=>i.id===id?{...i,qty:Math.max(1,i.qty+d)}:i)); const toggleWish=id=>setWish(w=>w.includes(id)?w.filter(x=>x!==id):[...w,id]); const cartCount=cart.reduce((s,i)=>s+i.qty,0); const subtotal=cart.reduce((s,i)=>s+i.price*i.qty,0); const shipping=subtotal>=45?0:4.99; const total=subtotal+shipping; const filtered=PRODUCTS.filter(p=>{ const cOk=cat==="all"||p.category===cat; const bOk=brand==="All"||p.brand===brand; const sOk=!search||p.name.toLowerCase().includes(search.toLowerCase())||p.brand.toLowerCase().includes(search.toLowerCase()); return cOk&&bOk&&sOk; }); // ── BTN STYLES ───────────────────────────────────────────────────────────── const PinkBtn = ({children,onClick,full,outline,small,style:sx={}})=>{ const [hov,setHov]=useState(false); const base={display:"inline-flex",alignItems:"center",justifyContent:"center",gap:"6px",fontFamily:FONT_BODY,fontSize:small?"12px":"13px",fontWeight:600,cursor:"pointer",border:`1px solid ${C.pink}`,borderRadius:"2px",padding:small?"7px 16px":"11px 24px",transition:"all 0.18s",width:full?"100%":"auto",letterSpacing:"0.3px",...sx}; const col=outline ?{background:hov?C.pinkLight:"transparent",color:C.pink} :{background:hov?C.pinkDark:C.pink,color:"#fff"}; return ; }; // ── PRODUCT CARD ─────────────────────────────────────────────────────────── const Card=({prod})=>{ const [hov,setHov]=useState(false); const disc=prod.originalPrice?Math.round((1-prod.price/prod.originalPrice)*100):0; return(
setHov(true)} onMouseLeave={()=>setHov(false)}> {/* badges */}
{prod.bestseller&&BEST SELLER} {prod.new&&NEW} {disc>0&&-{disc}%}
{/* wishlist */} {/* image */}
go("product",prod)}> {prod.name}
{/* info */}
{prod.brand}
go("product",prod)}>{prod.name}
({prod.reviews.toLocaleString()})
€{prod.price.toFixed(2)} {prod.originalPrice&&€{prod.originalPrice.toFixed(2)}}
{e.stopPropagation();addCart(prod);}}>Add to Cart
); }; // ── CART DRAWER ─────────────────────────────────────────────────────────── const CartDrawer=()=>( <>
setCartOpen(false)}/>
Shopping Cart ({cartCount})
{/* shipping progress */} {cartCount>0&&
{shipping===0?"🎉 You qualify for FREE shipping!": `Add €${(45-subtotal).toFixed(2)} more for FREE shipping`}
}
{cart.length===0?(
🛒
Your cart is empty
{setCartOpen(false);go("shop");}}>Browse Products
):cart.map(item=>(
{item.name}
{item.brand}
{item.name}
{item.qty}
€{(item.price*item.qty).toFixed(2)}
))}
{cart.length>0&&(
Total €{total.toFixed(2)}
{setCartOpen(false);go("checkout");}}>Proceed to Checkout →
setCartOpen(false)}>Continue Shopping
)}
); // ── HEADER ───────────────────────────────────────────────────────────────── const Header=()=>( <> {/* Top strip - YesStyle style */}
🎉 FREE SHIPPING on orders over €45 · Authentic Korean Beauty · Ships from Vienna, Austria
{/* Main header row */}
{/* Logo */}
go("home")}> Skynzi
{/* Search bar - YesStyle-style wide search */}
setSearch(e.target.value)} onKeyDown={e=>{if(e.key==="Enter"){go("shop");}}} placeholder="Search for brands, products..." style={{width:"100%",height:"40px",border:`1.5px solid ${search?C.pink:C.border}`,borderRadius:"3px",padding:"0 14px 0 42px",fontSize:"13px",fontFamily:FONT_BODY,outline:"none",background:C.white,boxSizing:"border-box",color:C.text,transition:"border-color 0.2s"}}/> {search&&}
{/* Right actions */}
{}}> Account
{}}> Wishlist{wish.length>0&&` (${wish.length})`}
setCartOpen(true)}> 0?C.pink:C.textMid}}>Cart{cartCount>0&&` (${cartCount})`}
{/* Nav row - YesStyle style */}
{[ {label:"All Products", action:()=>{go("shop");setCat("all");}}, {label:"🌸 New Arrivals", action:()=>{go("shop");setCat("all");}}, {label:"Bestsellers", action:()=>{go("shop");}}, {label:"Serums", action:()=>{go("shop");setCat("serum");}}, {label:"Moisturizers", action:()=>{go("shop");setCat("moisturizer");}}, {label:"Cleansers", action:()=>{go("shop");setCat("cleanser");}}, {label:"Sunscreen", action:()=>{go("shop");setCat("sunscreen");}}, {label:"Sheet Masks", action:()=>{go("shop");setCat("mask");}}, {label:"🏷️ SALE", action:()=>go("shop")}, ].map((n,i)=>{ const [hov,setHov]=useState(false); return( setHov(true)} onMouseLeave={()=>setHov(false)} onClick={n.action}>{n.label} ); })}
); // ── HOME ───────────────────────────────────────────────────────────────── const HomePage=()=>{ const sl=HERO_SLIDES[slide]; const bestsellers=PRODUCTS.filter(p=>p.bestseller).slice(0,4); const newArr=PRODUCTS.filter(p=>p.new).slice(0,4); return( <> {/* HERO - YesStyle split-panel style */}
{/* Main hero panel */}
{sl.pct}

{sl.title}

{sl.sub}

go("shop")}>{sl.cta} → go("shop")}>View All Brands
{HERO_SLIDES.map((_,i)=>(
setSlide(i)}/> ))}
{/* Side panels - YesStyle promo tiles */}
{[ {bg:"linear-gradient(135deg,#E8F4F0,#D1EBE4)",label:"COSRX Snail Line",sub:"From €14.00",img:PRODUCTS[11].img}, {bg:"linear-gradient(135deg,#FEF6E4,#FDE8C0)",label:"Beauty of Joseon",sub:"Glow Serums",img:PRODUCTS[2].img}, {bg:"linear-gradient(135deg,#F0EEF8,#E4DFFF)",label:"SPF Heroes",sub:"Zero White Cast",img:PRODUCTS[10].img}, ].map((t,i)=>{ const [hov,setHov]=useState(false); return(
setHov(true)} onMouseLeave={()=>setHov(false)} onClick={()=>go("shop")}>
{t.label}
{t.sub}
); })}
{/* Category pills - YesStyle style */}
{CATEGORIES.filter(c=>c.id!=="all").map(c=>{ const [hov,setHov]=useState(false); const active=cat===c.id&&page==="shop"; return(
setHov(true)} onMouseLeave={()=>setHov(false)} onClick={()=>{go("shop");setCat(c.id);}}> {c.emoji} {c.label}
); })}
{/* Trust row */}
{[ {icon:, t:"Free Shipping €45+",s:"Tracked EU delivery"}, {icon:,t:"100% Authentic", s:"Genuine Korean brands"}, {icon:, t:"Gift Wrapping", s:"Available at checkout"}, {icon:, t:"30-Day Returns", s:"Hassle-free policy"}, ].map((x,i)=>(
{x.icon}
{x.t}
{x.s}
))}
{/* Bestsellers */}
⭐ Community Favourites

Bestsellers

go("shop")}>View All
{bestsellers.map(p=>)}
{/* Big banner - YesStyle pink promo style */}
Routine Builder

Build Your Perfect
10-Step Routine

Start with a gentle cleanser, layer on essences and serums, lock in moisture, and protect with SPF. Our curated Korean skincare journey makes it effortless.

go("shop")}>Shop the Routine go("shop")}>Learn More
{PRODUCTS.slice(0,4).map(p=>(
go("product",p)}> {p.name}
{p.brand}
€{p.price.toFixed(2)}
))}
{/* New Arrivals */}
🌸 Just Arrived

New Arrivals

go("shop")}>View All
{newArr.map(p=>)}
{/* Brands strip */}
Official Stockist

Shop by Brand

{BRANDS.map(b=>{ const [hov,setHov]=useState(false); return( ); })}
); }; // ── SHOP PAGE ───────────────────────────────────────────────────────────── const ShopPage=()=>( <>
go("home")}>Home / All Products

Korean Skincare

{filtered.length} products found
{/* Filters */}
Filter by Category
{CATEGORIES.map(c=>{ const a=cat===c.id; const [hov,setHov]=useState(false); return( ); })}
{/* Brand filter */}
Brand: {["All",...BRANDS].map(b=>{ const a=brand===b; const [hov,setHov]=useState(false); return( ); })}
{filtered.length===0 ?
No products found. {setCat("all");setBrand("All");}}>Clear filters
:
{filtered.map(p=>)}
}
); // ── PRODUCT DETAIL ──────────────────────────────────────────────────────── const ProductDetail=()=>{ const [qty,setQty]=useState(1); const [tab,setTab]=useState("desc"); const p=selProd; if(!p)return null; const disc=p.originalPrice?Math.round((1-p.price/p.originalPrice)*100):0; const related=PRODUCTS.filter(x=>x.category===p.category&&x.id!==p.id).slice(0,4); return( <>
go("home")}>Home / go("shop")}>Shop / {p.name.slice(0,40)}…
{/* Images */}
{p.name}
{[p.img,p.img,p.img].map((img,i)=>( ))}
{/* Info */}
{p.brand}

{p.name}

{p.rating} ({p.reviews.toLocaleString()} reviews)
{/* Price */}
€{p.price.toFixed(2)} {p.originalPrice&&€{p.originalPrice.toFixed(2)}} {disc>0&&-{disc}%}
{/* Tags */} {p.tags&&
{p.tags.map(t=>{t})}
} {/* Stock */}
In Stock — Ready to Ship
{/* Qty + Add */}
{qty}
addCart(p,qty)} style={{flex:1}}>Add to Cart — €{(p.price*qty).toFixed(2)}
toggleWish(p.id)}> {wish.includes(p.id)?"Saved to Wishlist":"Add to Wishlist"} {/* Perks */}
{[{i:,t:"Free shipping on orders over €45"},{i:,t:"100% Authentic — sourced direct from Korea"},{i:,t:"30-day easy returns"}].map((x,i)=>(
{x.i}{x.t}
))}
{/* Tabs */}
{["desc","ingr","how"].map((t,i)=>( ))}
{tab==="desc"&&

{p.description}

} {tab==="ingr"&&

Water, Glycerin, Niacinamide, Panthenol, Sodium Hyaluronate, Centella Asiatica Extract, Ceramide NP, Arginine, Adenosine, Carbomer, Camellia Sinensis Leaf Extract, Allantoin, Betaine, 1,2-Hexanediol, Phenoxyethanol.

} {tab==="how"&&
  1. Cleanse your face thoroughly.
  2. Apply to freshly cleansed, slightly damp skin.
  3. Gently pat until fully absorbed — do not rub.
  4. Follow with your moisturiser and SPF.
  5. Use morning and/or evening for best results.
}
{/* Related */} {related.length>0&&(

You May Also Like

go("shop")}>View All →
{related.map(p=>)}
)}
); }; // ── CHECKOUT ────────────────────────────────────────────────────────────── const CheckoutPage=()=>{ const [placed,setPlaced]=useState(false); const inp=(f,lbl,type="text",ph="")=>(
setForm(o=>({...o,[f]:e.target.value}))} style={{width:"100%",border:`1.5px solid ${C.border}`,borderRadius:"3px",padding:"11px 14px",fontSize:"13px",fontFamily:FONT_BODY,outline:"none",color:C.text,background:C.white,boxSizing:"border-box",transition:"border-color 0.2s"}} onFocus={e=>e.target.style.borderColor=C.pink} onBlur={e=>e.target.style.borderColor=C.border}/>
); if(placed) return(

Order Confirmed!

Thank you{form.fname?`, ${form.fname}`:""}! Your Korean skincare is being prepared.

Confirmation sent to {form.email||"your email"} · Delivery: 3–5 business days

{go("shop");}}>Continue Shopping →
); return( <>
go("home")}>Home / setCartOpen(true)}>Cart / Checkout

Checkout

{/* Steps indicator */}
{["1. Shipping","2. Payment","3. Review"].map((s,i)=>(
{s}
))}

Shipping Information

{inp("fname","First Name*","text","Jane")} {inp("lname","Last Name*","text","Doe")}
{inp("email","Email Address*","email","jane@email.com")} {inp("phone","Phone Number","tel","+43 660 000 0000")} {inp("addr","Street Address*","text","Kärntner Straße 12")}
{inp("city","City*","text","Vienna")} {inp("zip","Postal Code*","text","1010")}

Payment Details

{["💳 Visa","💳 Mastercard","🅿️ PayPal","🟣 Klarna"].map(m=>(
{m}
))}
{inp("cname","Cardholder Name*","text","Jane Doe")} {inp("cnum","Card Number*","text","4242 4242 4242 4242")}
{inp("exp","Expiry Date*","text","MM/YY")} {inp("cvv","CVV*","text","123")}
{ if(!form.fname||!form.email||!form.addr||!form.cnum){notify("Please fill in all required fields.");return;} setCart([]);setPlaced(true); }}>Place Order — €{total.toFixed(2)}
🔒 SSL secured · Your payment info is safe · Powered by Stripe
{/* Order summary */}

Order Summary ({cartCount} items)

{cart.map(item=>(
{item.qty}
{item.name.slice(0,38)}{item.name.length>38?"…":""}
{item.brand}
€{(item.price*item.qty).toFixed(2)}
))} {/* Promo code */}
Subtotal€{subtotal.toFixed(2)}
Shipping{shipping===0?"FREE":`€${shipping.toFixed(2)}`}
VAT (incl.)Included
Total€{total.toFixed(2)}
); }; // ── FOOTER ──────────────────────────────────────────────────────────────── const Footer=()=>(
Skynzi

Your European destination for authentic Korean beauty. Sourced directly from Korea's top brands, shipped from Vienna with love.

{["IG","FB","TT","YT"].map(s=>(
{s}
))}
{[ {h:"Shop",ls:["All Products","Bestsellers","New Arrivals","Serums","Moisturizers","Sunscreen","Toners","Sheet Masks"]}, {h:"Brands",ls:["COSRX","Laneige","Beauty of Joseon","Some By Mi","Innisfree","Klairs","MISSHA","Dr.Jart+"]}, {h:"Help",ls:["About Us","Contact","Shipping Info","Returns","FAQ","Track Order","Privacy Policy","Terms"]}, ].map(col=>(
{col.h}
{col.ls.map(l=>(
e.target.style.color=C.pink} onMouseLeave={e=>e.target.style.color="rgba(255,255,255,0.5)"} onClick={()=>go("shop")}>{l}
))}
))}
© 2025 Skynzi.com — Pinnacle Plus Zone e.U. · VAT: ATU81136959 · Vienna, Austria
{["VISA","Mastercard","PayPal","Klarna","SEPA"].map(m=>( {m} ))}
); // ── TOAST ────────────────────────────────────────────────────────────────── return (
{cartOpen&&} {toast&&(
✓ {toast}
)} {page==="home" &&} {page==="shop" &&} {page==="product" &&} {page==="checkout" &&}
); }