/* Light, reflection and touch. Clothes keep their existing scale and colours. */
body{background:radial-gradient(ellipse at 8% 12%,#f4eaf3 0,transparent 38%),radial-gradient(ellipse at 96% 36%,#f8f0e7 0,transparent 36%),#fcf9f6;background-attachment:fixed}
header{background:#fffdfbea;border-bottom-color:#eadfe7;position:relative}
header::after{content:"";position:absolute;width:72px;height:1px;bottom:-1px;background:linear-gradient(90deg,transparent,#ae7d9e,transparent)}
button,a{-webkit-tap-highlight-color:transparent}
.choices button,.primary,.secondary,.back{transition:background .22s ease,border-color .22s ease,box-shadow .22s ease,transform .22s ease}
.choices button{background:#fffdfc;border-color:#e3d5df;border-radius:13px;box-shadow:0 2px 8px #51223f03}
.choices button[aria-pressed="true"]{background:linear-gradient(120deg,#51223f,#753a65);border-color:#71375f;box-shadow:0 5px 14px #51223f16}
.choices button[aria-pressed="true"]::after{top:9px;right:10px;color:#f8e7f3}
.choices button:active,.primary:active,.secondary:active,.back:active{transform:scale(.98)}
@media(hover:hover){.choices button:not([aria-pressed="true"]):hover{border-color:#b98aa9;background:#fbf4fa;box-shadow:0 5px 15px #51223f0b;transform:translateY(-2px)}.primary:not(:disabled):hover{box-shadow:0 7px 22px #753a6535;transform:translateY(-2px)}}
.progress{gap:8px}.progress span{position:relative;border-bottom-color:#e9dfe6;transition:color .25s,border-color .25s}
.progress .active{border-color:#834b74}.progress .active::after{content:"";position:absolute;width:5px;height:5px;border-radius:50%;bottom:-3px;left:calc(50% - 2px);background:#834b74;box-shadow:0 0 0 4px #f5eaf1}
#welcome{padding-top:24px;isolation:isolate}
.welcome-new{font-size:9px;letter-spacing:1.7px;background:#fff9fdea;border-color:#e2cddc;box-shadow:0 3px 16px #a4659309;padding:8px 14px}
.welcome-portal{width:236px;height:267px;margin:25px auto 27px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:49% 49% 43% 43%;border:1px solid #c9abc2;background:linear-gradient(135deg,#fffdfc 5%,#f0e5f1 35%,#fffaf3 57%,#f4e6f0 82%,#fffdfc);box-shadow:inset 0 0 0 5px #fffaf8b3,inset 0 0 0 6px #dbc4d54d,0 18px 50px #84567513;overflow:visible}
.welcome-portal::before{content:"";position:absolute;inset:9px;border-radius:inherit;border:1px solid #fffdfde6;pointer-events:none}
.welcome-portal::after{content:"";position:absolute;inset:2px;border-radius:inherit;background:linear-gradient(115deg,transparent 20%,#ffffff00 37%,#ffffffa6 48%,transparent 61%);pointer-events:none;opacity:.65}
#welcome .welcome-magic{height:34px;gap:13px;background:none;margin:0 0 12px;z-index:1;color:#a27898}
#welcome .welcome-magic span{font-size:14px;transform:none}#welcome .welcome-magic span:nth-child(2){font-size:25px;color:#734b6a}
#welcome .welcome-portal h1{font:400 52px/.98 Georgia,serif;letter-spacing:-1.7px;margin:0;z-index:1;color:#51223f}
#welcome .welcome-portal h1 em{color:#986a8e}
.portal-caption{font:9px/1.4 Arial,sans-serif;letter-spacing:2.1px;color:#7f6477;margin-top:18px;z-index:1}
.portal-star{position:absolute;color:#aa7a9c;line-height:1;pointer-events:none}
.portal-star.one{left:-24px;top:50px;font-size:22px}.portal-star.two{right:-22px;top:118px;font-size:16px}.portal-star.three{right:5px;top:24px;font-size:10px}.portal-star.four{left:7px;bottom:25px;font-size:10px}
.welcome-card{border-radius:19px;border-color:#e6d8e2;background:linear-gradient(135deg,#fffdfd,#f9f2f7);padding:21px 22px;box-shadow:0 8px 30px #51223f05}
.welcome-card h2{font-size:18px;margin-bottom:18px}.welcome-card ol{counter-reset:welcome;gap:13px}
.welcome-card li{counter-increment:welcome;font-size:12px;letter-spacing:.65px;line-height:1.5}
.welcome-card li>span{display:none}.welcome-card li::before{content:"0" counter(welcome);display:grid;place-items:center;width:28px;height:28px;flex-shrink:0;border:1px solid #dec9d9;border-radius:50%;font:11px Georgia,serif;color:#8e5c7f;background:#fffafc}
.welcome-card li:nth-child(1){--step-color:#75446c}.welcome-card li:nth-child(2){--step-color:#9a536e}.welcome-card li:nth-child(3){--step-color:#89662f}.welcome-card li:nth-child(4){--step-color:#4e765f}
.welcome-card li::before{width:30px;height:30px;background:var(--step-color);border-color:var(--step-color);color:#fff;font-size:12px;font-weight:700;box-shadow:0 3px 8px #51223f16}
.welcome-start{margin-top:20px;min-height:55px;border-radius:13px;animation:none;letter-spacing:1px;font-size:14px;background:linear-gradient(115deg,#51223f,#854a74);box-shadow:0 6px 20px #753a6526}
.welcome-signature{font:italic 14px/1.5 Georgia,serif;color:#8c7184;margin-top:17px}
.choices button[data-value="Me surpreenda"]{isolation:isolate;overflow:hidden}
[data-choice="colorPreference"] button.wide{font-size:14px}
[data-choice="colorPreference"] button:not(.wide){display:flex;align-items:center;gap:8px;padding-left:12px;font-size:14px}
[data-choice="colorPreference"] button:not(.wide)::before{content:"";display:block;flex-shrink:0;width:23px;height:13px;border-radius:20px;border:1px solid #a6889b40;background:var(--swatch);box-shadow:0 0 0 2px #ffffff40}
[data-value="Cores Claras"]{--swatch:linear-gradient(90deg,#f6e9d4 0 33%,#e6d3e7 33% 66%,#cddde8 66%)}
[data-value="Cores Escuras"]{--swatch:linear-gradient(90deg,#2b2631 0 33%,#3c4053 33% 66%,#614553 66%)}
[data-value="Cores Neutras"]{--swatch:linear-gradient(90deg,#e8decc 0 33%,#b4a394 33% 66%,#5f5556 66%)}
[data-value="Cores Vivas"]{--swatch:linear-gradient(90deg,#c7586e 0 33%,#b18bdb 33% 66%,#d8b44e 66%)}
.magic-preview{margin:16px 0 7px;padding:14px 15px;border:1px solid #e6d6e2;border-radius:13px;background:linear-gradient(110deg,#fffdfb,#f5edf5);color:#735267}
.magic-preview-label{display:block;font:italic 15px Georgia,serif;margin-bottom:9px}
.magic-preview-values{display:flex;flex-wrap:wrap;gap:6px}.magic-preview-values span{font-size:11px;line-height:1.5;padding:4px 9px;border-radius:20px;background:#ffffffc9;border:1px solid #eadfe7;color:#775367}
.summary{background:linear-gradient(140deg,#f7edf5,#f0e7f1 65%,#f9f1e8);border:1px solid #dfc9dc;border-top:3px solid #986a8e;box-shadow:0 8px 30px #75486509;border-radius:17px}
.summary-tile{background:#fffdfcf2;border:1px solid #eee3eb;border-radius:11px;box-shadow:0 2px 8px #70446303}
.summary-label{letter-spacing:.45px;font-size:11px}.summary-label::before{content:"";display:inline-block;width:4px;height:4px;background:#ba8bae;border-radius:50%;margin:0 7px 2px 0}
.summary-direction{color:#a67b99}.review-help{background:transparent;border:0;padding:6px 12px 12px;font-size:12px;color:#82717c}
.magic-wait{padding:25px 20px 20px;margin:20px 0 0;border:1px solid #e0cadb;border-radius:18px;background:linear-gradient(135deg,#fffafc,#f2e8f4,#fcf6ee);text-align:center;overflow:hidden}
.magic-wait[hidden]{display:none}.magic-wait-mirror{position:relative;display:grid;place-items:center;width:66px;height:84px;border-radius:50% 50% 42% 42%;border:1px solid #bb91ae;margin:0 auto 16px;background:linear-gradient(130deg,#fffdfb,#e7d4ea,#fff6eb);box-shadow:inset 0 0 0 4px #fffcfa99,0 0 24px #d0abc83d}
.magic-wait-mirror::after{content:"✦";position:absolute;right:-10px;top:7px;color:#a87899;font-size:17px}.magic-wait-mirror svg{width:32px;height:32px;stroke:#855375;fill:none;stroke-width:1.2}
.magic-wait h2{font:23px Georgia,serif;color:#67415c;margin:0 0 9px}.magic-wait p{font-size:12px;line-height:1.6;color:#846b7d;margin:0 auto;max-width:270px}
.magic-wait-mirror{width:56px;height:70px;margin-bottom:14px}
.magic-wardrobe{width:220px;max-width:100%;overflow:hidden;margin:18px auto 0;mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.magic-wardrobe-track{display:flex;width:max-content}
.magic-wardrobe-group{display:flex;gap:12px;padding-right:12px}
.magic-garment{display:grid;place-items:center;width:44px;height:46px;border:1px solid #d6bacf;border-radius:12px;color:#805273;background:#fffafdf0;flex-shrink:0}
.magic-garment:nth-child(4n+2){color:#a05f77;background:#fff5f9}.magic-garment:nth-child(4n+3){color:#8a713e;background:#fffaf0}.magic-garment:nth-child(4n+4){color:#597864;background:#f6faf5}
.magic-garment svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
#generate[aria-busy="true"]{box-shadow:none;background:#76516c;opacity:1}
#ideas .look{border-color:#e0ceda;box-shadow:0 5px 15px #51223f07}#ideas .look .text{background:linear-gradient(115deg,#fffdfb,#fdf9fd)}
.magic-spark{position:absolute;pointer-events:none;font-size:14px;line-height:1;color:#d4a9c9;z-index:3}
@media(prefers-reduced-motion:no-preference){
 .welcome-portal::after{background-size:280% 100%;animation:mirror-reflection 6.5s ease-in-out infinite}.welcome-portal::before{animation:mirror-aura 6.5s ease-in-out infinite}.portal-star{animation:star-breathe 4s ease-in-out infinite}.portal-star.one,.portal-star.two{animation:star-drift 5s ease-in-out infinite}.portal-star.two,.portal-star.four{animation-delay:1.5s}
 .welcome-start::after{animation:welcome-shine 6s ease-in-out infinite}
 .magic-wait-mirror{animation:mirror-breathe 2.8s ease-in-out infinite}.magic-wardrobe-track{animation:wardrobe-flow 5.8s linear infinite}
 @keyframes wardrobe-flow{to{transform:translateX(-50%)}}
 @keyframes mirror-reflection{0%,12%{background-position:150% 0;opacity:.2}45%,60%{opacity:.9}88%,100%{background-position:-50% 0;opacity:.2}}
 @keyframes mirror-aura{0%,100%{box-shadow:0 0 0 0 #b88cad00}50%{box-shadow:0 0 19px 3px #b88cad24}}
 @keyframes star-drift{0%,100%{opacity:.45;transform:translateY(2px) rotate(-7deg) scale(.9)}50%{opacity:1;transform:translateY(-6px) rotate(8deg) scale(1.08)}}
 @keyframes star-breathe{0%,100%{opacity:.35;transform:scale(.85)}50%{opacity:1;transform:scale(1.08)}}
 @keyframes mirror-breathe{0%,100%{box-shadow:inset 0 0 0 4px #fffcfa99,0 0 15px #d0abc82b}50%{box-shadow:inset 0 0 0 4px #fffcfa99,0 0 32px #c295b957}}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(max-width:380px){.welcome-portal{width:211px;height:239px;margin-top:23px;margin-bottom:24px}#welcome .welcome-portal h1{font-size:47px}.welcome-card{padding:19px 15px}.welcome-card li{font-size:11px;letter-spacing:.4px}[data-choice="colorPreference"] button:not(.wide){font-size:13px;gap:6px;padding-left:10px}[data-choice="colorPreference"] button:not(.wide)::before{width:19px}.portal-caption{font-size:8px}}
