#personal-photo-controls[hidden],#zoom-image[hidden]{display:none}
.ghost-focus:has(.collage-board){aspect-ratio:2/3;padding:0;background:#eee9e1;cursor:zoom-in}
.collage-board{position:relative;width:100%;aspect-ratio:2/3;background:#eee9e1;isolation:isolate;overflow:hidden}
.collage-element{position:absolute;display:block}
.collage-element img{position:static;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 2px 3px #4b332414)}
#zoom-collage{max-width:480px;margin:auto;border-radius:10px}
#zoom-collage a{cursor:pointer;border-radius:8px}
#zoom-collage a:focus-visible{outline:2px solid #8e4b7f;outline-offset:2px}
@media(max-width:480px){.collage-element img{filter:drop-shadow(0 1px 2px #4b332414)}}
.looks .look .text{display:block;flex:0;padding:12px}
.looks .look .text p{display:none}
.looks .look h2{min-height:0;margin:0}
.looks .ghost-focus:has(.collage-board),.looks .collage-board{aspect-ratio:1/2}

.looks .look .text{padding:14px 12px;overflow:visible;height:auto;max-height:none}
.looks .look h2{font-family:Georgia,'Times New Roman',serif;font-size:clamp(16px,3.8vw,21px);font-weight:400;line-height:1.35;letter-spacing:.01em;color:#67485c;min-height:0;height:auto;max-height:none;overflow:visible;display:block;-webkit-line-clamp:unset;white-space:normal;overflow-wrap:break-word}
#test-remaining{display:table;margin:22px auto 6px;padding:9px 18px;border:1px solid #dfcbd8;border-radius:999px;background:#f1e8ed;color:var(--plum);font-size:15px;font-weight:600;letter-spacing:.015em}
#test-remaining:empty{display:none}
section[data-step="4"]>.back,#ideas>.back{width:90%;margin:12px auto 0;border:1px solid var(--plum);border-radius:8px;background:var(--plum);color:white;text-decoration:none;padding:12px 16px;min-height:46px;font-size:14px;line-height:1.4;text-align:center}
section[data-step="4"]>.back:hover,#ideas>.back:hover{background:#67334f}

section[data-step="2"]>.back,section[data-step="3"]>.back,#shop>.back{display:block;width:90%;margin:12px auto 0;border:1px solid var(--plum);border-radius:8px;background:var(--plum);color:white;text-decoration:none;padding:12px 16px;min-height:46px;font-size:14px;line-height:1.4;text-align:center}
section[data-step="2"]>.back:hover,section[data-step="3"]>.back:hover,#shop>.back:hover{background:#67334f}
section>.back[hidden]{display:none}

#complete{font-size:18px;font-weight:600;line-height:1.45;padding:18px 12px;min-height:62px;letter-spacing:.01em;box-shadow:0 5px 14px #51223f20}
#complete span{font-size:19px;white-space:nowrap}
#ideas>.back,section[data-step="4"]>.back,#shop>.back{background:var(--plum);border-color:var(--plum);color:white;font-size:14px;font-weight:500;opacity:1;filter:none}
@media(max-width:360px){#complete{font-size:16px}#complete span{font-size:17px}}

section[data-step="4"]>.back[data-go="1"]{width:100%;min-height:52px;font-size:16px;font-weight:600;margin-top:18px;box-shadow:0 3px 9px #51223f18}
#complete{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(110deg,#51223f,#783757,#51223f);box-shadow:0 4px 16px #78375735}
#complete::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;background:linear-gradient(110deg,transparent 35%,#ffffff26 49%,transparent 63%);transform:translateX(-130%)}
@media(prefers-reduced-motion:no-preference){#complete::after{animation:violeta-button-shine 4.8s ease-in-out infinite}@keyframes violeta-button-shine{0%,35%{transform:translateX(-130%)}65%,100%{transform:translateX(130%)}}}
@media(prefers-reduced-motion:reduce){#complete::after{transform:none;background:linear-gradient(110deg,transparent,#ffffff12,transparent)}}

/* Keep the outfits dominant; result controls remain comfortable to tap. */
#ideas .looks{gap:8px}
#ideas>h1{font-size:34px;line-height:1.12;margin-bottom:14px}
#ideas>.reference-piece{font-size:13px;margin:10px 0 18px}
#ideas .look .text{padding:11px 10px}
#ideas .look h2{font-size:17px;line-height:1.3}
#ideas #test-remaining{font-size:12px;padding:4px 10px;margin:14px auto 4px;font-weight:500}
#ideas #complete{min-height:48px;padding:11px 12px;margin-top:14px;font-size:15px;line-height:1.4;box-shadow:0 2px 8px #78375720}
#ideas #complete span{font-size:16px}
#ideas>.back,section[data-step="4"]:has(#ideas:not([hidden]))>.back[data-go="1"]{width:84%;max-width:360px;min-height:44px;padding:10px 12px;margin:10px auto 0;font-size:13px;font-weight:400;box-shadow:none}
@media(max-width:699px){#ideas .looks{margin-inline:-14px}#ideas .look{border-radius:10px}}
@media(min-width:700px){#ideas .looks{gap:14px}#ideas>h1{font-size:42px}#ideas .look h2{font-size:20px}}

#generate{position:relative;isolation:isolate;overflow:hidden;font-size:19px;font-weight:600;letter-spacing:.035em;line-height:1.4;padding:17px 16px;min-height:60px;background:linear-gradient(110deg,#51223f,#783757,#51223f);box-shadow:0 3px 13px #78375740}
#generate::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;background:linear-gradient(110deg,transparent 32%,#ffffff30 50%,transparent 68%);transform:translateX(-130%)}
@media(prefers-reduced-motion:no-preference){#generate:not(:disabled){animation:violeta-generate-glow 2.6s ease-in-out infinite}#generate:not(:disabled)::after{animation:violeta-button-shine 4s ease-in-out infinite}@keyframes violeta-generate-glow{0%,100%{box-shadow:0 3px 10px #78375735}50%{box-shadow:0 3px 22px #a4547a70}}}
#generate:disabled{animation:none}
#generate:disabled::after{display:none}
@media(prefers-reduced-motion:reduce){#generate::after{transform:none;background:linear-gradient(110deg,transparent,#ffffff15,transparent)}}
@media(max-width:360px){#generate{font-size:18px}}

#shop-products{margin-bottom:30px}