.dress-stage {
    position: relative;
    width: min(80vw, 320px); height: min(80vw, 320px);
    margin: 1rem auto 1.5rem;
    border-radius: 24px; background: #fff7fd; border: 4px solid #ffe0f5;
    display: flex; align-items: center; justify-content: center;
    overflow: hidden;
}
.dress-base { font-size: min(42vw, 9.5rem); line-height: 1; }
.dress-acc { position: absolute; left: 50%; transform: translateX(-50%); line-height: 1; pointer-events: none; }
.dress-hat { font-size: min(22vw, 4.8rem); top: 2%; }
.dress-glasses { font-size: min(20vw, 4.2rem); top: 33%; }
.dress-neck { font-size: min(17vw, 3.6rem); bottom: 7%; }

.dress-controls { display: flex; flex-direction: column; gap: .6rem; margin-bottom: .5rem; }
.dress-row { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; justify-content: center; }
.dress-label { font-family: var(--kf); font-weight: 600; color: #6a4bbc; width: 110px; text-align: right; }
.dress-options { display: flex; gap: .4rem; flex-wrap: wrap; }
.dress-opt {
    font-size: 1.6rem; line-height: 1; width: 48px; height: 48px;
    border: 2px solid #e0d0ff; background: #f7f2ff; border-radius: 12px; cursor: pointer;
    display: flex; align-items: center; justify-content: center; padding: 0;
}
.dress-opt.active { background: #d0bcff; border-color: #9775fa; }
.dress-opt:active { transform: scale(.94); }

@media (max-width: 540px) {
    .dress-label { width: auto; text-align: center; flex-basis: 100%; }
}