/* Five detailed costume cutouts with the member's own photo, shared by profile and map. */
.person-marker.premium-avatar .torso{width:63px!important;height:92px!important;margin-top:-6px!important;background:none;box-shadow:none;transform-origin:50% 12%}
.premium-avatar .silhouette-body{display:block;width:63px!important;height:92px!important}
.premium-avatar .silhouette-body svg{display:block;width:100%;height:100%;overflow:hidden}
.premium-avatar .head{position:relative;z-index:1}
body #profileForm .character-stage:has(.premium-avatar){height:330px;padding:20px 0;background:radial-gradient(ellipse at 50% 88%,#b8d19e77 0 12%,transparent 34%),linear-gradient(145deg,#faf5ea,#fdfbf7 55%,#fbf8ef);border:1px solid #f1e2c1}
body #profileForm .character-preview.premium-avatar{transform:scale(1.9);transform-origin:center}
#silhouetteChoices .silhouette-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#silhouetteChoices .silhouette-option{min-height:224px;padding:16px 6px 12px;border-radius:20px;background:linear-gradient(155deg,#fff,#fdfaf5)}
#silhouetteChoices .silhouette-option[aria-pressed=true]{border-color:#5fc176;background:linear-gradient(150deg,#fdfbf7,#f9f2e4);box-shadow:0 0 0 1px #5fc176,0 6px 16px #38914d1a}
#silhouetteChoices .silhouette-label{font-size:13px;font-weight:750}
.silhouette-mini.premium-avatar{width:100%;min-height:180px}
.silhouette-mini.premium-avatar .head{width:53px;height:53px;font-size:35px}
.silhouette-mini.premium-avatar .torso,.silhouette-mini.premium-avatar .silhouette-body{width:80px!important;height:116px!important}
#profileForm .wardrobe{grid-template-columns:1fr}
#profileForm .wardrobe>[hidden]{display:none!important}
.dance-picker{margin:22px 0;padding-top:10px;border-top:1px solid var(--line)}
.dance-picker h3{font-size:18px}.dance-picker p{font-size:12px}
.dance-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.dance-card{min-width:0;padding:12px 4px;border:2px solid #f8f1e2;border-radius:16px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:12px;color:var(--ink)}
.dance-card[aria-pressed=true]{border-color:#48b862;background:#fdfaf5;box-shadow:0 0 0 1px #48b862}
.dance-card>span:last-child{font-size:11px;line-height:1.4;font-weight:700;text-align:center}
.dance-mini{pointer-events:none;min-height:120px;width:100%;filter:none}
.dance-mini .head{width:37px;height:37px;font-size:25px}
.dance-mini.premium-avatar .torso,.dance-mini.premium-avatar .silhouette-body{width:51px!important;height:74px!important}
.dance-mini:not(.premium-avatar) .torso{width:42px;height:49px}
.dance-mini:not(.premium-avatar) .silhouette-body{width:42px;height:49px}
/* Each distinct move completes once per three-second loop. */
.person-marker.dance-idle:not(.moving)[data-dance=groove] .head,.person-marker.dance-idle:not(.moving)[data-dance=groove] .torso{animation:avatar-groove 3s ease-in-out infinite}
.person-marker.dance-idle:not(.moving)[data-dance=arms] .head,.person-marker.dance-idle:not(.moving)[data-dance=arms] .torso{animation:avatar-bounce 3s ease-in-out infinite}
.person-marker.dance-idle:not(.moving)[data-dance=arms] .costume-arm-left{animation:avatar-arm-left 3s ease-in-out infinite}
.person-marker.dance-idle:not(.moving)[data-dance=arms] .costume-arm-right{animation:avatar-arm-right 3s ease-in-out infinite}
.person-marker.dance-idle:not(.moving)[data-dance=arms] .arms:before,.person-marker.dance-idle:not(.moving)[data-dance=arms] .arms:after{animation:dance-arms 3s ease-in-out infinite alternate}
.person-marker.dance-idle:not(.moving)[data-dance=spin] .head,.person-marker.dance-idle:not(.moving)[data-dance=spin] .torso{animation:avatar-spin 3s ease-in-out infinite;backface-visibility:visible}
@keyframes avatar-groove{0%,65%,100%{transform:translate(0,0) rotate(0)}15%,45%{transform:translate(-3px,-2px) rotate(-7deg)}30%,55%{transform:translate(3px,-1px) rotate(7deg)}}
@keyframes avatar-bounce{0%,60%,100%{transform:translateY(0)}20%,40%{transform:translateY(-3px)}30%,50%{transform:translateY(0)}}
@keyframes avatar-arm-left{0%,65%,100%{transform:rotate(0)}20%,45%{transform:rotate(35deg)}30%,55%{transform:rotate(12deg)}}
@keyframes avatar-arm-right{0%,65%,100%{transform:rotate(0)}20%,45%{transform:rotate(-35deg)}30%,55%{transform:rotate(-12deg)}}
@keyframes avatar-spin{0%,15%{transform:rotateY(0deg) translateY(0)}50%{transform:rotateY(180deg) translateY(-3px)}80%,100%{transform:rotateY(360deg) translateY(0)}}
@media(prefers-reduced-motion:reduce){.person-marker .head,.person-marker .torso,.person-marker .costume-arm,.person-marker .arms:before,.person-marker .arms:after{animation:none!important}}

/* Keep all preview loops paused while the app is in the background. */
.touchyou-paused .person-marker *{animation-play-state:paused!important}
@media(max-width:360px){#silhouetteChoices .silhouette-option{min-height:210px;padding:12px 4px}.silhouette-mini.premium-avatar .torso,.silhouette-mini.premium-avatar .silhouette-body{width:72px!important;height:105px!important}#silhouetteChoices .silhouette-label{font-size:12px}}