/* Juju character studio: one large stage, independent collection/editor scrolling. */
#avatar-modal.wardrobe-page{background:#f4f1f8;padding:0;overflow:hidden}
.wardrobe-layout{max-width:1280px;height:100dvh;grid-template-columns:minmax(280px,.82fr) minmax(0,1.18fr);grid-template-rows:64px minmax(0,1fr) 46px 28px;gap:10px 28px;padding:18px 28px 20px;isolation:isolate}
.wardrobe-toolbar{grid-column:1/-1;grid-row:1;gap:10px;border-bottom:1px solid #ded8e8;padding-bottom:12px}
.wardrobe-toolbar h2{font-size:1.3rem;letter-spacing:-.03em;color:#39334e}
.wardrobe-toolbar button{color:#63547e;box-shadow:none;background:#fffdfa;border:1px solid #d8cfe4}
.wardrobe-toolbar #btn-face-picker{font-size:.85rem;min-height:44px;padding:10px 17px;border-radius:14px;background:#7764af;color:white;border:0}
.wardrobe-toolbar #btn-face-picker[aria-expanded=true]{background:#e6def3;color:#50426c}
.wardrobe-stage{grid-column:1;grid-row:2;min-width:0;overflow:hidden;align-self:stretch;border-radius:36px;background:radial-gradient(ellipse at 50% 43%,#fffdf8 0,#f1eaf7 66%,#e9e0f2 100%)}
.wardrobe-stage #evolution-avatar{height:100%;max-height:550px;width:100%;max-width:440px;filter:none;overflow:visible}
.avatar-halo{width:72%;max-width:350px;border:1px solid #fff;background:#ffffff4a;box-shadow:0 0 0 22px #ffffff1c;inset:auto}
#shop-wallet{grid-column:1;grid-row:3;align-self:center;justify-self:center;border:1px solid #e1d8eb;border-radius:20px;background:#fffaf5;padding:8px 20px;min-height:40px;font-size:.9rem}
#shop-message{grid-column:1;grid-row:4;align-self:center;color:#4b7661;font-size:.76rem;padding:0;line-height:1.2}
.wardrobe-inventory,.appearance-panel{grid-column:2;grid-row:2/5;min-height:0;min-width:0}
.wardrobe-inventory{display:grid;grid-template-rows:auto auto minmax(0,1fr);gap:10px}
.wardrobe-tabs{grid-column:auto;padding:4px;background:#e9e2f1;border:0;border-radius:17px;gap:4px}
.wardrobe-tabs button{background:transparent;border:0;box-shadow:none;color:#766788;padding:10px;font-size:.84rem;border-radius:13px}
.wardrobe-tabs button[aria-selected=true]{background:#fffdf8;color:#4e3e6d;box-shadow:0 2px 6px #47345f0d}
.slot-filters{grid-column:auto;gap:5px;padding:2px 0 7px;scrollbar-width:thin}
.slot-filters button{font-size:.72rem;min-height:40px;padding:8px 12px;border-radius:12px;background:transparent;border:1px solid transparent;color:#71647f}
.slot-filters button[aria-pressed=true]{background:#ded3ed;color:#4f3c70;border-color:#c1b0d8}
.wardrobe-collections{grid-column:auto;min-height:0;overflow:hidden}
.wardrobe-panel{padding:4px 4px 18px 0;scrollbar-gutter:stable;scrollbar-width:thin}
.wardrobe-panel .avatar-choices{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.wardrobe-panel .avatar-option{min-height:170px;background:#fffdf8;border:1px solid #e1d8e9;border-radius:21px;box-shadow:0 3px 8px #59467405;padding:14px 10px 12px;gap:8px;color:#554768;transition:border-color .16s,background .16s,transform .16s}
.wardrobe-panel .avatar-option:disabled{opacity:1;cursor:default;background:#faf7fc;color:#776b84}
.wardrobe-panel .avatar-option svg{width:100%;height:89px;filter:none;opacity:1}
.wardrobe-panel .avatar-option>span{font-size:.74rem;font-weight:700;line-height:1.25;min-height:2.5em;display:flex;align-items:center;justify-content:center}
.wardrobe-panel .avatar-option small{font-size:.73rem;color:#76628b}
.wardrobe-panel .avatar-option small.item-goal{font-size:.62rem;line-height:1.25;gap:5px}
.goal-progress{font-size:.6rem;letter-spacing:.04em;padding:3px 10px;background:#eae3f1;border-radius:9px}
.wardrobe-panel .avatar-option[aria-pressed=true]{border:2px solid #81b39d;background:#eff7f0;box-shadow:none}
@media(hover:hover){.wardrobe-panel .avatar-option:not(:disabled):hover{border-color:#9b83bd;background:#f4eefc;transform:translateY(-2px)}}
.appearance-panel{position:relative;display:flex;flex-direction:column;gap:12px;padding:22px;border:1px solid #e0d7e9;border-radius:27px;background:#fffdf8;overflow:hidden}
.appearance-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px}
.appearance-toolbar h3{font-size:1.15rem;margin:0;color:#453851}
.appearance-toolbar button{background:#e8e0f2;border:0;color:#564471;box-shadow:none;border-radius:12px;padding:8px 14px;font-size:.8rem}
.appearance-note{font-size:.76rem;color:#81728d;line-height:1.4;margin:0}
.appearance-tabs{display:flex;gap:5px;overflow-x:auto;flex-shrink:0;padding-bottom:8px;scrollbar-width:thin}
.appearance-tabs button{flex:none;background:#f5f0fa;color:#6b597f;border:1px solid transparent;border-radius:12px;padding:8px 12px;font-size:.74rem;box-shadow:none;min-height:44px}
.appearance-tabs button[aria-pressed=true]{background:#e7dcf4;border-color:#b5a0d3;color:#4c3868}
.appearance-options{overflow:auto;min-height:0;padding:2px 5px 12px;scrollbar-width:thin}
.appearance-options h4{font-size:.82rem;text-align:start;margin:5px 0 12px;color:#635471}
.appearance-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.appearance-choices button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-width:0;min-height:94px;margin:0;padding:12px 6px;background:#f8f4fb;border:2px solid transparent;border-radius:18px;box-shadow:none;color:#695577}
.appearance-choices button[aria-pressed=true]{border-color:#9076b3;background:#eee5f8}
.appearance-choices button>span:last-child{font-size:.72rem;line-height:1.25}
.appearance-choices svg{width:100%;height:90px}
.appearance-swatch{display:block;width:40px;height:40px;border-radius:50%;box-shadow:inset 0 -4px 0 #00000010,0 2px 0 #ffffff}
@media(max-width:700px){
 .wardrobe-layout{grid-template-columns:minmax(0,1fr);grid-template-rows:46px minmax(120px,29dvh) 32px 20px minmax(0,1fr);gap:5px;padding:max(8px,env(safe-area-inset-top)) 12px max(8px,env(safe-area-inset-bottom))}
 .wardrobe-toolbar{grid-column:1;grid-row:1;padding-bottom:5px;gap:6px}.wardrobe-toolbar h2{font-size:1rem}.wardrobe-toolbar #btn-face-picker{font-size:.73rem;padding:7px 10px;min-height:40px}.wardrobe-toolbar #btn-close-avatar{min-height:40px;min-width:40px}
 .wardrobe-stage{grid-column:1;grid-row:2;border-radius:25px}.wardrobe-stage #evolution-avatar{max-width:260px}.avatar-halo{max-width:180px;width:43%}
 #shop-wallet{grid-row:3;min-height:28px;padding:3px 15px;border-radius:12px}#shop-wallet .wallet-coin{font-size:.85rem}#shop-wallet .gem-icon{height:21px}
 #shop-message{grid-row:4;font-size:.65rem}
 .wardrobe-inventory,.appearance-panel{grid-column:1;grid-row:5;gap:4px}.wardrobe-tabs button{min-height:38px;padding:6px;font-size:.78rem}.slot-filters{padding-bottom:3px}.slot-filters button{min-height:38px;padding:6px 10px;font-size:.7rem}
 .wardrobe-panel{padding-top:2px}.wardrobe-panel .avatar-choices{gap:7px}.wardrobe-panel .avatar-option{min-height:145px;padding:9px 6px;border-radius:17px;gap:5px}.wardrobe-panel .avatar-option svg{height:65px}.wardrobe-panel .avatar-option>span{font-size:.68rem}.wardrobe-panel .avatar-option small.item-goal{font-size:.57rem}
 .appearance-panel{padding:12px;border-radius:20px;gap:6px}.appearance-toolbar h3{font-size:.95rem}.appearance-toolbar button{min-height:38px}.appearance-note{font-size:.68rem}.appearance-tabs{padding-bottom:4px}.appearance-tabs button{min-height:40px;font-size:.68rem;padding:6px 9px}.appearance-options h4{display:none}.appearance-choices{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.appearance-choices button{min-height:69px;padding:7px 3px;border-radius:12px;gap:5px}.appearance-choices button>span:last-child{font-size:.58rem}.appearance-choices svg{height:58px}.appearance-swatch{width:28px;height:28px}
}
@media(max-width:350px){.wardrobe-panel .avatar-choices{grid-template-columns:repeat(2,minmax(0,1fr))}.wardrobe-toolbar h2{font-size:.85rem}.appearance-note{display:none}}
@media(orientation:landscape) and (max-height:550px){
 .wardrobe-layout{grid-template-columns:minmax(170px,.7fr) minmax(0,1.3fr);grid-template-rows:42px minmax(0,1fr) 30px 20px;padding:7px 12px;gap:5px 14px}
 .wardrobe-toolbar{grid-column:1/-1;grid-row:1;padding:0}.wardrobe-toolbar h2{font-size:1rem}
 .wardrobe-stage{grid-column:1;grid-row:2}.wardrobe-stage #evolution-avatar{max-height:100%;max-width:100%}
 #shop-wallet{grid-column:1;grid-row:3;min-height:26px;padding:3px 10px}#shop-wallet .wallet-coin{font-size:.8rem}#shop-message{grid-column:1;grid-row:4;font-size:.62rem}
 .wardrobe-inventory,.appearance-panel{grid-column:2;grid-row:2/5;gap:4px}.wardrobe-tabs button{min-height:36px;padding:6px;font-size:.72rem}.slot-filters{grid-column:auto;padding:1px 0}.slot-filters button{min-height:35px;padding:5px 8px;font-size:.64rem}
 .wardrobe-panel .avatar-option{min-height:136px;padding:7px;gap:3px}.wardrobe-panel .avatar-option svg{height:56px}.wardrobe-panel .avatar-option>span{font-size:.65rem}.wardrobe-panel .avatar-choices{gap:6px}
 .appearance-panel{padding:10px}.appearance-toolbar h3{font-size:.9rem}.appearance-note{display:none}.appearance-tabs{padding:0}.appearance-tabs button{min-height:35px;font-size:.65rem;padding:5px 8px}.appearance-choices{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.appearance-choices button{min-height:64px;padding:5px}.appearance-choices svg{height:50px}.appearance-options h4{display:none}.appearance-swatch{width:26px;height:26px}
}
@media(prefers-reduced-motion:reduce){.wardrobe-panel .avatar-option{transition:none}}
