:root{--cream:#f7f5ed;--ink:#111;--lime:#d6ff00;--pink:#ff4da0;--muted:#6a6a67}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:'DM Sans',Arial,sans-serif}button,select,textarea{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}.wrap{width:min(1370px,calc(100% - 100px));margin:auto}.site-header{height:90px;display:flex;align-items:center;justify-content:space-between;gap:30px;position:relative;z-index:5}.brand{font-family:Anton,Impact,sans-serif;font-size:25px;line-height:.88;letter-spacing:-.8px;display:inline-flex;flex-direction:column}.brand span{display:block}.brand sup{font-family:Arial;font-size:9px;vertical-align:top;margin-left:2px}.desktop-nav{display:flex;gap:36px;font-size:13px;font-weight:700}.desktop-nav a:hover{color:#e60076}.header-actions{display:flex;align-items:center;gap:12px}.header-search{font-size:30px;line-height:1;margin-right:8px}.pill{border-radius:50px;padding:13px 22px;font-size:12px;font-weight:800;border:1px solid #d6d4cc;display:inline-flex;align-items:center;justify-content:center}.pill.lime{background:var(--lime);border-color:var(--lime)}.pill.subtle{background:transparent}.menu-toggle{display:none;background:none;border:0;font-size:27px}.hero{position:relative;overflow:hidden;min-height:660px}.hero-art{position:absolute;inset:0 0 0 auto;width:100%;height:100%;background:url('assets/hero-collage.webp') no-repeat right center;background-size:auto 100%;pointer-events:none}.hero-inner{position:relative;z-index:1;padding:52px 0 65px}.hero-copy{width:min(670px,58%)}h1,h2{font-family:Anton,Impact,'Arial Narrow',sans-serif;font-weight:400;letter-spacing:-1px}h1{font-size:clamp(64px,7.2vw,115px);line-height:.98;margin:0 0 24px;letter-spacing:-2.5px}h1 em{font-style:normal;color:var(--pink)}.hero-copy>p{font-size:18px;line-height:1.4;margin:0 0 20px}.generator{border:1px solid #c9c9c3;background:rgba(255,255,255,.94);border-radius:11px;box-shadow:0 6px 20px #00000008;overflow:hidden;max-width:670px}.prompt-row{display:flex;align-items:center;padding:13px;gap:12px}.sparkle{font-size:25px;padding-left:8px}.prompt-row textarea{border:0;outline:0;background:none;resize:vertical;min-height:54px;max-height:130px;flex:1;padding:15px 0;font-size:14px;min-width:0}.generate-btn{background:var(--lime);border:0;border-radius:9px;padding:18px 24px;font-weight:800;white-space:nowrap}.generate-btn span{margin-left:18px;font-size:19px}.generator-options{border-top:1px solid #e5e5e1;padding:10px 14px;display:flex;gap:12px;flex-wrap:wrap}.option{border:0;background:#f3f3f0;border-radius:9px;padding:10px 12px;font-size:12px;font-weight:800}.option select{border:0;background:transparent;max-width:115px;font-size:12px;cursor:pointer}.advanced{border-top:1px solid #eee;padding:12px 20px;font-size:12px}.advanced select{margin-left:8px}.try-these{margin-top:25px}.try-these>span{font-size:10px;font-weight:800;display:block;margin-bottom:10px}.chips{display:flex;flex-wrap:wrap;gap:8px}.chips button{border:1px solid #deddd6;background:transparent;border-radius:30px;padding:10px 14px;font-size:11px}.chips button:hover{background:var(--lime)}.styles-section{background:#111;color:white;padding:38px 0 52px;position:relative}.styles-section:before{content:'';position:absolute;top:-13px;left:0;right:0;height:17px;background:#111;clip-path:polygon(0 55%,4% 15%,8% 55%,12% 23%,16% 65%,21% 30%,26% 60%,31% 16%,37% 55%,43% 25%,50% 65%,56% 25%,61% 55%,67% 15%,73% 60%,79% 20%,84% 55%,91% 10%,96% 60%,100% 35%,100% 100%,0 100%)}.section-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}.section-head h2{font-size:clamp(30px,3.1vw,46px);line-height:1.1;margin:0}.style-head{justify-content:flex-start}.style-head p{font-size:13px;line-height:1.5;margin:0 0 0 10px}.style-head>a{margin-left:auto;font-size:12px}.style-grid{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:13px}.style-card{min-width:0;border:0;color:#fff;background:none;padding:0;text-align:center;font-size:12px}.style-card img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:5px;margin-bottom:9px}.style-card:hover img,.collection-card:hover img,.trending-card:hover img{transform:translateY(-4px)}.style-card img,.collection-card img,.trending-card img{transition:transform .2s}.collections-section,.trending-section{padding-top:54px}.underline-lime,.underline-pink{position:relative}.underline-lime:after,.underline-pink:after{content:'';position:absolute;bottom:-8px;left:0;width:70%;height:5px;background:var(--lime);transform:rotate(-1deg)}.underline-pink:after{background:var(--pink);width:55%}.outline-link{border:1px solid #d5d3ca;border-radius:50px;padding:11px 16px;font-size:12px;white-space:nowrap}.collection-grid,.trending-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}.collection-card,.trending-card{min-width:0}.collection-card img,.trending-card img{width:100%;display:block;object-fit:cover;border-radius:5px}.collection-card img{aspect-ratio:4/5}.collection-meta{display:flex;align-items:center;justify-content:space-between;gap:5px;padding-top:10px}.collection-meta strong{font-size:13px}.collection-meta small{font-size:10px;display:block;color:#5b5b57;margin-top:4px}.round-arrow{background:#111;color:white;border-radius:50%;width:26px;height:26px;display:grid;place-items:center;flex:none}.trending-section{padding-bottom:70px}.trending-actions{display:flex;gap:10px}.trending-actions select{border:1px solid #d5d3ca;background:transparent;border-radius:40px;padding:9px 14px;font-size:12px}.trending-card img{aspect-ratio:3/4}.trending-meta{display:flex;align-items:center;justify-content:space-between;gap:6px;padding-top:10px;font-size:10px}.creator{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.avatar{background:#111;color:white;display:inline-grid;place-items:center;border-radius:50%;width:18px;height:18px;margin-right:4px}.like{border:0;background:none;font-size:11px;white-space:nowrap}.like.active{color:#e90075}.bottom-cta{background:#111;color:#fff;padding:65px 0;text-align:center}.bottom-cta h2{font-size:clamp(52px,8vw,110px);line-height:1;margin:0}.bottom-cta h2 span{color:var(--pink)}.bottom-cta p{margin:15px 0 25px}footer{padding-top:28px;padding-bottom:28px;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:12px;color:#555}footer .brand{color:#111;font-size:20px}.toast{position:fixed;bottom:24px;right:24px;background:#111;color:#fff;padding:15px 20px;border-radius:10px;max-width:380px;box-shadow:0 8px 25px #0003;z-index:20;display:none}.toast.show{display:block}@media(max-width:1100px){.wrap{width:min(100% - 50px,1370px)}.hero-art{opacity:.75;background-position:calc(100% + 190px) center}.hero-copy{width:65%}.style-grid{grid-template-columns:repeat(5,1fr)}.collection-grid,.trending-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:700px){.wrap{width:calc(100% - 32px)}.site-header{height:70px}.brand{font-size:22px}.desktop-nav,.header-actions{display:none}.menu-toggle{display:block}.site-header.open .desktop-nav{display:flex;position:absolute;top:65px;left:0;right:0;background:var(--cream);padding:20px;flex-direction:column;gap:20px;box-shadow:0 12px 20px #0002}.hero{min-height:0}.hero-art{position:relative;display:block;height:240px;width:100%;background-size:auto 340px;background-position:right center;opacity:1;order:2}.hero-inner{padding:30px 0 45px}.hero-copy{width:100%}h1{font-size:clamp(53px,12.5vw,85px);letter-spacing:-1px}.hero-copy>p{font-size:15px}.prompt-row{flex-wrap:wrap}.prompt-row textarea{flex-basis:calc(100% - 60px)}.generate-btn{width:100%}.hero{display:flex;flex-direction:column}.hero-inner{order:1}.try-these{margin-top:20px}.style-head{flex-wrap:wrap}.style-head p{margin:0}.style-head>a{margin-left:0}.style-grid{grid-template-columns:repeat(3,1fr)}.collection-grid,.trending-grid{grid-template-columns:repeat(2,1fr);gap:12px}.section-head h2{font-size:32px}.section-head{align-items:flex-start}.outline-link{font-size:10px;padding:9px}.trending-actions select{max-width:100px}.collections-section,.trending-section{padding-top:40px}footer{flex-wrap:wrap}.chips button{padding:9px 11px}}


/* v2: centered, contained collage and punchier editorial typography */
:root{--lime:#d6ff00;--pink:#ff4da0}
h1,h2,.brand{font-family:'Barlow Condensed',Impact,'Arial Narrow',sans-serif;font-weight:900;letter-spacing:-.025em}
h1{font-size:clamp(70px,7.5vw,120px);line-height:.83;letter-spacing:-.045em;transform:skew(-3deg);transform-origin:left center;margin-bottom:33px}
h1 em{font-weight:900;font-style:italic;display:inline-block;transform:skew(-3deg)}
.section-head h2{font-size:clamp(39px,3.9vw,60px);font-weight:900;font-style:italic;transform:skew(-3deg);line-height:.95}
.brand{font-style:italic;font-size:28px;line-height:.78}
.hero{min-height:695px}
.hero-art{width:min(67vw,990px);height:590px;top:22px;right:max(10px,calc((100vw - 1460px)/2));bottom:auto;left:auto;background-image:url('assets/hero-collage-v2.webp');background-size:contain;background-position:center center;opacity:1}
.hero-inner{padding-top:68px;padding-bottom:88px}
.hero-copy{width:min(690px,57%)}
.hero-copy>p{font-size:19px;font-weight:500}
.pill,.outline-link,.generate-btn,.chips button,.option,.trending-actions select{font-weight:800;min-height:43px}
.pill{padding:13px 26px;font-size:13px;gap:12px}
.pill.lime,.generate-btn{color:#101010!important;background:var(--lime);border-color:var(--lime)}
.generate-btn{padding:18px 31px;font-size:15px;min-width:165px}
.generator-options{gap:12px;padding:12px 16px}
.option{display:inline-flex;align-items:center;gap:9px;border:1px solid #d9d8d0;background:#f2f1ed;padding:11px 15px;font-size:13px;min-width:125px}
.option select{font-size:13px;font-weight:800;max-width:140px;color:#111;cursor:pointer}
.option.more{min-width:145px;justify-content:center}
.chips{gap:11px 12px}.chips button{padding:12px 18px;font-size:12px;min-height:43px;border-color:#c9c8c1;background:#fbfaf5}
.outline-link,.trending-actions select{padding:12px 21px;font-size:13px;background:#fbfaf5;border:1.5px solid #c5c3bb}
.trending-actions{gap:13px;flex-wrap:wrap}.trending-actions select{min-width:125px}
.style-head h2{font-style:italic}.style-head p{font-size:14px}.style-head>a{font-size:13px;font-weight:800}
.underline-lime:after,.underline-pink:after{height:6px;bottom:-12px;transform:rotate(-1.4deg);width:83%}
.bottom-cta{padding:48px 0 52px;overflow:hidden}
.footer-feature{display:flex;align-items:center;justify-content:center;gap:clamp(40px,7vw,110px);text-align:left}
.footer-feature-art{display:flex;align-items:center;min-width:0;gap:0;transform:rotate(-5deg)}
.footer-feature-art img{width:clamp(130px,15vw,215px);height:clamp(170px,20vw,285px);object-fit:cover;border:9px solid #f7f5ed;box-shadow:8px 12px 0 #0008;transform:rotate(-7deg)}
.footer-feature-art img+img{margin-left:-38px;transform:translateY(24px) rotate(12deg)}
.footer-feature-copy{max-width:480px}.footer-feature-copy .eyebrow{font-size:12px;font-weight:900;letter-spacing:.14em;color:var(--lime)}
.bottom-cta h2{font-size:clamp(70px,8vw,120px);line-height:.77;font-style:italic;transform:skew(-4deg);margin:17px 0 24px}
.bottom-cta h2 em{color:var(--pink);font-style:italic}.bottom-cta p{font-size:15px;line-height:1.5;margin:0 0 24px}
@media(max-width:1200px){.hero-art{right:-70px;width:70vw;top:50px;height:540px}.hero-copy{width:60%}.hero{min-height:670px}}
@media(max-width:850px){.hero-art{right:-95px;width:70vw;top:75px;height:450px;opacity:.9}.hero-copy{width:66%}h1{font-size:clamp(58px,8.2vw,84px)}.footer-feature{gap:35px}}
@media(max-width:700px){.hero{min-height:0}.hero-inner{padding:30px 0 38px}.hero-copy{width:100%}h1{font-size:clamp(57px,12vw,82px);margin-bottom:25px}.hero-art{position:relative;order:2;right:auto;top:auto;width:100%;height:290px;background-size:contain;background-position:center;opacity:1;margin:-10px auto 8px}.generator-options{gap:8px}.option{min-width:0;flex:1 1 140px}.option select{max-width:100px}.chips{gap:8px}.chips button{padding:10px 13px}.section-head h2{font-size:36px}.footer-feature{flex-direction:column;gap:45px;text-align:center}.footer-feature-art img{width:140px;height:185px}.footer-feature-copy{text-align:center}.bottom-cta h2{font-size:82px}.trending-actions{justify-content:flex-end}}
@media(max-width:410px){.hero-art{height:230px}.section-head{gap:10px}.outline-link,.trending-actions select{padding:10px 12px;font-size:11px}.section-head h2{font-size:31px}}

/* V3 refinement */
.brand{display:inline-flex;align-items:center;flex:none;line-height:1}
.brand-logo{width:118px;height:auto;display:block;object-fit:contain}
.hero{overflow:hidden}
.hero-inner{padding-top:70px;padding-bottom:85px}
.hero-copy{width:min(760px,59%)}
.hero-art{width:min(73vw,1130px);height:650px;top:0;right:max(-45px,calc((100vw - 1550px)/2));background-size:contain;background-position:center}
h1{font-family:'Barlow Condensed',Impact,sans-serif;font-style:italic;font-weight:900;transform:skew(-6deg);letter-spacing:-.035em;line-height:.83;font-size:clamp(72px,7.6vw,120px)}
h1 em{font-style:italic;transform:none}
.section-head h2,.bottom-cta h2{font-family:'Barlow Condensed',Impact,sans-serif;font-style:italic;font-weight:900;transform:skew(-6deg)}
.generator{max-width:none;width:min(800px,100%)}
.generator-options{flex-wrap:nowrap;gap:12px}
.option{flex:1 1 auto;white-space:nowrap;justify-content:center;min-width:0;padding:12px 16px}
.option select{max-width:none;min-width:72px;font-weight:800}
.option.more{flex:1 1 auto;min-width:145px}
.chips{gap:12px}.chips button{padding:12px 20px;white-space:nowrap}
.pill,.generate-btn,.outline-link,.option,.chips button,.trending-actions select{font-weight:800}
.footer-links{display:flex;align-items:center;gap:22px;flex-wrap:wrap;font-size:13px;font-weight:800;color:#111}
.footer-links a:hover{color:#e90075}
.mobile-header-sticker{display:none}
@media(min-width:1350px){.hero-copy{width:min(780px,59%)}.hero-art{width:min(70vw,1160px);right:max(0px,calc((100vw - 1570px)/2))}}
@media(min-width:701px) and (max-width:1120px){.hero-art{width:68vw;height:580px;right:-90px;top:45px}.hero-copy{width:64%}.generator-options{gap:7px}.option{padding:10px 8px;font-size:11px}.option select{font-size:11px}.option.more{min-width:110px}}
@media(max-width:700px){
 .site-header{height:95px;align-items:center;gap:8px;overflow:visible}
 .brand-logo{width:112px}
 .mobile-header-sticker{display:flex;align-items:center;justify-content:center;margin-left:auto;gap:5px;transform:rotate(-9deg);color:#111;background:var(--lime);padding:7px 10px;border:2px solid #111;box-shadow:3px 3px 0 #111}
 .mobile-header-sticker span:first-child{font-family:'Barlow Condensed',Impact,sans-serif;font-size:19px;line-height:.8;font-style:italic;font-weight:900}
 .mobile-header-star{font-size:20px}
 .menu-toggle{margin-left:15px;font-size:28px}
 .hero-inner{padding-top:18px;padding-bottom:24px}
 .hero-copy{width:100%}
 h1{font-size:clamp(59px,12.4vw,87px);transform:skew(-5deg);margin:0 0 23px}
 .hero-copy>p{font-size:16px;line-height:1.45}
 .generator{width:100%}
 .generator-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:10px}
 .option{min-width:0;justify-content:space-between;white-space:normal;padding:12px 10px;font-size:12px}
 .option select{min-width:0;max-width:100px;font-size:12px}
 .option.more{grid-column:1/-1;min-width:0}
 .hero-art{height:330px;width:100%;margin:0 auto 4px;background-position:center;background-size:contain}
 .chips{gap:10px}.chips button{white-space:normal;padding:11px 14px}
 .site-footer{display:flex;flex-direction:column;align-items:flex-start;gap:22px}
 .footer-links{gap:13px 20px}
}
@media(max-width:390px){.mobile-header-sticker{padding:5px 7px}.mobile-header-sticker span:first-child{font-size:16px}.hero-art{height:265px}h1{font-size:clamp(51px,12.3vw,64px)}}

/* V4: rotated editorial typography, responsive prompt chips, mobile poster accent */
.hero-copy h1{transform:rotate(-3deg);transform-origin:18% 50%;font-style:italic;position:relative;z-index:1}
.section-head h2{transform:rotate(-2deg);transform-origin:left center}
.bottom-cta h2{transform:rotate(-3deg);transform-origin:center center}
.hero-heading-row{position:relative}
.mobile-mini-poster{display:none}
/* Let the generator suggestions use the full content width on desktop. */
@media(min-width:701px){
 .hero-copy{width:min(810px,65%)}
 .hero-art{z-index:0}
 .try-these{width:min(1060px,calc(100vw - 130px));position:relative;z-index:2}
 .chips{display:flex;flex-wrap:nowrap;gap:10px}
 .chips button{flex:0 0 auto;padding:12px 16px;font-size:11px}
}
@media(min-width:701px) and (max-width:1200px){
 .try-these{width:min(1000px,calc(100vw - 60px))}
 .chips{flex-wrap:wrap}
}
@media(max-width:700px){
 .hero-heading-row{display:flex;align-items:center;gap:6px;min-height:185px}
 .hero-heading-row h1{flex:1 1 auto;min-width:0;font-size:clamp(47px,11.3vw,76px);line-height:.84;transform:rotate(-3deg);margin:0 0 15px}
 .mobile-mini-poster{display:block;flex:0 0 23%;max-width:110px;transform:rotate(9deg);margin-right:5px;filter:drop-shadow(5px 7px 0 rgba(0,0,0,.15))}
 .mobile-mini-poster img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;border:5px solid #fff9e9}
 .try-these{text-align:center;margin:23px auto 0}
 .chips{justify-content:center;gap:9px 8px}
 .chips button{font-size:11px;padding:11px 12px}
 .hero-art{width:100%;max-width:540px;align-self:center;margin:0 auto 8px;background-position:center center;background-size:contain}
 .section-head h2{transform:rotate(-2deg)}
}
@media(max-width:390px){
 .hero-heading-row{min-height:160px}
 .hero-heading-row h1{font-size:clamp(44px,11vw,53px)}
 .mobile-mini-poster{flex-basis:22%}
}

/* V5: mobile balance and stronger brand presence */
@media(max-width:700px){
 .site-header{height:104px}
 .brand-logo{width:145px;max-width:100%;height:auto}
 .mobile-header-sticker{margin-left:auto}
 .menu-toggle{margin-left:10px}
 .hero-heading-row{min-height:205px;gap:3px}
 .hero-heading-row h1{font-size:clamp(48px,11.4vw,79px);flex:1 1 70%;line-height:.86}
 .mobile-mini-poster{flex:0 0 28%;max-width:145px;margin-right:8px;transform:rotate(8deg)}
 .mobile-mini-poster img{border-width:6px}
 .hero-art{box-sizing:border-box;width:92%;max-width:510px;height:auto;aspect-ratio: 3 / 2;position:relative;left:auto;right:auto;top:auto;transform:none;margin:18px auto 12px;background-position:center center;background-size:contain}
}
@media(max-width:390px){
 .brand-logo{width:132px}
 .mobile-header-sticker{padding:5px 6px}
 .menu-toggle{margin-left:6px}
 .hero-heading-row{min-height:185px}
 .hero-heading-row h1{font-size:clamp(42px,11vw,54px)}
 .mobile-mini-poster{flex-basis:27%;margin-right:5px}
 .hero-art{width:94%}
}
