.wardrobe-layer{align-items:flex-start;padding:0;overflow:auto;background:linear-gradient(#59c8f5,#e9fbff)}.wardrobe-layer .social-card{width:min(100%,520px);max-height:none;min-height:100dvh;overflow:visible;border-radius:0;padding:16px 14px 24px;background:linear-gradient(#f8fdff,#dff6ff);box-shadow:none}.wardrobe-head{display:flex;justify-content:space-between;align-items:center;gap:10px}.wardrobe-head h2{margin:0;text-align:left;font-size:24px}.fish-wallet{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;background:#fff4bc;border:2px solid #ffd15a;border-radius:999px;padding:8px 13px;font-weight:900;color:#815a00;box-shadow:0 3px #e1a936}.dress-stage{position:relative;min-height:285px;margin:12px 0 14px;border:4px solid white;border-radius:28px;overflow:hidden;background:linear-gradient(#85ddff 0 58%,#eafaff 58%);box-shadow:0 8px 0 #73b9dc,0 12px 25px #286b9433}.dress-stage:before{content:"";position:absolute;inset:auto -8% -22% -8%;height:53%;border-radius:50% 50% 0 0;background:linear-gradient(#fff,#ccefff);box-shadow:inset 0 9px 0 #ffffffaa}.dress-stage:after{content:"✦  ❄  ✦";position:absolute;left:0;right:0;top:13px;color:#fff;text-shadow:0 2px 5px #36a9e8;font-size:23px;letter-spacing:28px}.stage-label{position:absolute;left:0;right:0;bottom:8px;z-index:8;font-weight:900;color:#27729d}.penguin-avatar{--avatar-size:210px;position:relative;display:block;width:var(--avatar-size);height:var(--avatar-size);margin:4px auto;border-radius:25px;overflow:hidden;background:linear-gradient(#bdeeff,#f7fdff)}.dress-stage .penguin-avatar{--avatar-size:245px;position:absolute;z-index:3;left:50%;bottom:19px;transform:translateX(-50%);overflow:visible;background:transparent}.penguin-avatar.small{--avatar-size:46px;margin:0;border-radius:50%;overflow:hidden}.penguin-avatar.medium{--avatar-size:118px}.penguin-avatar>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:2;filter:drop-shadow(0 7px 5px #2765842f)}.avatar-bg{position:absolute;inset:0;z-index:0}.avatar-bg.aurora{background:linear-gradient(145deg,#73e8d1,#8979f7)}.avatar-bg.sunset{background:linear-gradient(#ffc59b,#f779a9)}.avatar-bg.gold{background:radial-gradient(circle,#fff7a7,#f3b92d)}.dress-stage .avatar-bg{inset:-60px -150px -45px;border-radius:28px}.avatar-item{position:absolute;z-index:4;pointer-events:none;filter:drop-shadow(0 3px 2px #24405c44)}.avatar-item.hat{left:28%;top:4%;width:44%;height:22%;border-radius:55% 55% 18% 18%;background:linear-gradient(145deg,#fff7,var(--item-color) 28% 74%,#0002);box-shadow:inset 0 -6px #0002}.avatar-item.hat:after{content:"";position:absolute;left:-12%;right:-12%;bottom:-8%;height:28%;border-radius:999px;background:var(--item-color);box-shadow:inset 0 3px #fff6}.avatar-item.beanie{top:2%;height:25%;border-radius:55% 55% 25% 25%}.avatar-item.beanie:before{content:"";position:absolute;width:22%;aspect-ratio:1;border-radius:50%;background:inherit;left:39%;top:-25%}.avatar-item.crown{left:28%;top:1%;width:44%;height:25%;background:linear-gradient(90deg,#ed9f16,#fff17b,#e6a113);clip-path:polygon(0 92%,0 30%,24% 60%,50% 0,76% 60%,100% 30%,100% 92%)}.avatar-item.scarf{left:24%;top:59%;width:52%;height:11%;border-radius:999px;background:linear-gradient(#fff6,var(--item-color) 38%);box-shadow:inset 0 -4px #0002}.avatar-item.scarf:after{content:"";position:absolute;width:18%;height:220%;right:8%;top:45%;border-radius:5px;background:inherit;transform:rotate(-8deg)}.avatar-item.glasses{left:22%;top:34%;width:56%;height:20%;border:calc(var(--avatar-size)*.025) solid #28394d;border-radius:999px}.avatar-item.glasses:after{content:"";position:absolute;left:44%;top:35%;width:14%;border-top:calc(var(--avatar-size)*.018) solid #28394d}.avatar-item.heart-glasses{border:0;background:linear-gradient(135deg,#ff7cab,#ee3f75);clip-path:polygon(3% 26%,13% 5%,30% 3%,44% 20%,50% 30%,56% 20%,70% 3%,87% 5%,97% 26%,93% 53%,52% 90%,48% 90%,7% 53%)}.avatar-item.ribbon{right:17%;top:20%;width:19%;height:15%;background:linear-gradient(135deg,#ff9abc,#ed3978);clip-path:polygon(0 0,50% 38%,100% 0,82% 100%,50% 62%,18% 100%)}.avatar-item.star{right:13%;top:17%;width:20%;aspect-ratio:1;background:linear-gradient(135deg,#fff69a,#ffbd24);clip-path:polygon(50% 0,62% 36%,100% 38%,69% 59%,79% 100%,50% 76%,21% 100%,31% 59%,0 38%,38% 36%)}.avatar-item.snow{right:10%;top:15%;font-size:calc(var(--avatar-size)*.21);color:#61cafa;text-shadow:0 2px white}.avatar-item.snow:before{content:"❄"}.preview-bounce{animation:previewBounce .28s ease}.preview-sparkle:after{content:"✦";position:absolute;z-index:7;right:12%;top:10%;font-size:32px;color:#fff179;animation:spark .45s ease}.wardrobe-tabs{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;position:sticky;top:0;z-index:20;padding:5px 0;background:#e8f9ff}.wardrobe-tabs button{border:2px solid #b9e2f5;border-radius:14px;padding:8px 2px;background:#fff;color:#27658d;font-weight:900;font-size:11px;box-shadow:0 3px #a8cfe1}.wardrobe-tabs button span{display:block;font-size:20px;margin-bottom:2px}.wardrobe-tabs button.active{border-color:#fff;background:#4aaef0;color:#fff;box-shadow:0 4px #2379b7}.wardrobe-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;padding:10px 0 14px}.wardrobe-item{position:relative;min-height:142px;border:3px solid #cdebf8;border-radius:18px;background:#fff;color:#205f8b;font-weight:900;padding:6px;box-shadow:0 5px #b8d9e8;overflow:hidden}.wardrobe-item.selected{border-color:#ffb622;background:#fff8d8;box-shadow:0 5px #e2a229}.wardrobe-item.locked{background:#f4fbff;border-color:#acd9ed;color:#315f7e}.item-art{height:82px;border-radius:13px;background:linear-gradient(#dff6ff,#fff);position:relative;overflow:hidden;margin-bottom:6px}.item-art .avatar-item{--avatar-size:150px;transform:scale(1.45);transform-origin:center}.item-art .hat,.item-art .beanie,.item-art .crown{left:24%;top:25%;width:52%;height:38%}.item-art .scarf{left:15%;top:40%;width:70%;height:18%}.item-art .glasses{left:15%;top:30%;width:70%;height:32%}.item-art .ribbon,.item-art .star{right:26%;top:18%;width:48%;height:54%}.item-art .snow{right:30%;top:8%;font-size:55px}.item-art .avatar-bg{inset:0}.none-art:before{content:"없음";position:absolute;inset:0;display:grid;place-items:center;color:#8aa9ba;font-size:14px}.lock-badge{position:absolute;z-index:8;right:7px;top:7px;background:#fff;border:2px solid #80b9d8;border-radius:50%;width:29px;height:29px;display:grid;place-items:center;font-size:15px}.item-name{display:block;font-size:12px;line-height:1.15}.item-state{display:block;font-size:10px;margin-top:5px;color:#5d8196}.selected .item-state{color:#9a6500}.wardrobe-actions{position:sticky;bottom:0;z-index:20;padding:5px 0 8px;background:linear-gradient(#e7f8ffdd,#e7f8ff 25%)}.wardrobe-note{font-size:11px;color:#527e98;margin:2px}.rank-list li{grid-template-columns:34px 48px 1fr auto}.game-avatar-wrap{position:relative;display:inline-block}.game-avatar-wrap>.avatar-item{transform:scale(.72);transform-origin:center}.unlock-toast{position:fixed;z-index:500;left:50%;top:15%;transform:translate(-50%,-20px);opacity:0;background:#fff6c7;border:3px solid #ffd252;border-radius:18px;padding:12px 18px;color:#785400;font-weight:900;transition:.25s}.unlock-toast.show{opacity:1;transform:translate(-50%,0)}.unlock-card .item-art{width:150px;height:120px;margin:10px auto}.unlock-card h2{color:#ef8b22}@keyframes previewBounce{50%{transform:translateX(-50%) translateY(-8px) scale(1.025)}}@keyframes spark{50%{transform:scale(1.5) rotate(25deg)}}
@media(max-width:350px){.wardrobe-layer .social-card{padding:10px 8px 20px}.dress-stage{min-height:235px}.dress-stage .penguin-avatar{--avatar-size:205px}.wardrobe-items{gap:6px}.wardrobe-item{min-height:125px}.item-art{height:68px}.wardrobe-tabs button{font-size:9px}.wardrobe-head h2{font-size:20px}.fish-wallet{font-size:12px;padding:7px 9px}}
@media(min-width:521px){.wardrobe-layer{padding:18px}.wardrobe-layer .social-card{min-height:auto;border-radius:30px;box-shadow:0 12px 0 #3194c466}.dress-stage{min-height:310px}}
.preview-bounce{animation:none}.preview-bounce .penguin-avatar{animation:previewBounce .28s ease}
.dress-stage .penguin-avatar>img{top:-9%;height:109%;mix-blend-mode:multiply}.stage-label{left:50%;right:auto;bottom:3px;transform:translateX(-50%);background:#ffffffd9;border-radius:999px;padding:2px 12px;white-space:nowrap}
.dress-stage .penguin-avatar>img{top:0;height:100%;mix-blend-mode:multiply;clip-path:polygon(50% 6%,31% 10%,21% 20%,16% 35%,5% 49%,11% 70%,25% 78%,27% 89%,38% 96%,50% 94%,62% 96%,73% 89%,75% 78%,89% 70%,95% 49%,84% 35%,79% 20%,69% 10%)}
.sprite{background-image:url('assets/wardrobe/accessory-atlas-v1.png')!important;background-size:400% 400%!important;background-repeat:no-repeat!important;background-color:transparent!important;clip-path:none!important;border:0!important;border-radius:0!important;box-shadow:none!important}.sprite:before,.sprite:after{content:none!important}.sprite-0{background-position:0 0!important}.sprite-1{background-position:33.333% 0!important}.sprite-2{background-position:66.666% 0!important}.sprite-3{background-position:100% 0!important}.sprite-4{background-position:0 33.333%!important}.sprite-5{background-position:33.333% 33.333%!important}.sprite-6{background-position:66.666% 33.333%!important}.sprite-7{background-position:100% 33.333%!important}.sprite-8{background-position:0 66.666%!important}.sprite-9{background-position:33.333% 66.666%!important}.sprite-10{background-position:66.666% 66.666%!important}.sprite-11{background-position:100% 66.666%!important}.sprite-12{background-position:0 100%!important}.sprite-13{background-position:33.333% 100%!important}.sprite-14{background-position:66.666% 100%!important}.sprite-15{background-position:100% 100%!important}.penguin-avatar .sprite.hat,.penguin-avatar .sprite.crown{left:18%;top:-1%;width:64%;height:37%}.penguin-avatar .sprite.scarf{left:18%;top:53%;width:64%;height:39%}.penguin-avatar .sprite.glasses{left:19%;top:31%;width:62%;height:25%}.penguin-avatar .sprite.ribbon{right:9%;top:13%;width:34%;height:30%}.penguin-avatar .sprite.star,.penguin-avatar .sprite.snow{right:5%;top:11%;width:38%;height:35%;font-size:0}.penguin-avatar .avatar-bg.sprite{inset:-60px -150px -45px;width:auto;height:auto}.item-art .sprite{position:absolute!important;inset:2px!important;width:calc(100% - 4px)!important;height:calc(100% - 4px)!important;transform:none!important}.wardrobe-item.rare{border-color:#d9b7ff;background:linear-gradient(145deg,#fff,#f2eaff)}.wardrobe-item.rare .item-art{background:radial-gradient(circle,#fff,#e7dcff)}.preview-lock-panel{margin:-5px 4px 10px;padding:9px 10px;border:2px solid #8fd3f3;border-radius:15px;background:#fff;text-align:left;color:#27658d}.preview-lock-panel b,.preview-lock-panel small{display:block}.preview-lock-panel small{font-size:11px;margin-top:3px}.preview-lock-panel button{float:right;margin-top:-31px;border:0;border-radius:10px;padding:7px;background:#4caef0;color:white;font-weight:900}
.sprite{background-size:404% 404%!important}.penguin-avatar .sprite.hat{left:7%;top:-3%;width:86%;height:43%}.penguin-avatar .sprite.crown{left:25%;top:1%;width:50%;height:29%}.penguin-avatar .sprite.scarf{left:27%;top:54%;width:46%;height:27%}.penguin-avatar .sprite.glasses{left:25%;top:32%;width:50%;height:21%}.penguin-avatar .sprite.ribbon{right:13%;top:15%;width:27%;height:25%}.penguin-avatar .sprite.star,.penguin-avatar .sprite.snow{right:2%;top:16%;width:25%;height:23%;font-size:0}.fancy-bg .penguin-avatar .sprite.star,.fancy-bg .penguin-avatar .sprite.snow{opacity:.72;transform:scale(.82)}.locked-apply:not([disabled]){display:none}.locked-apply[disabled]{opacity:.65;box-shadow:none}.preview-lock-panel button{float:none;margin:6px 0 0;width:auto}.dress-stage{isolation:isolate}.dress-stage .avatar-bg{z-index:0}.dress-stage .penguin-avatar>img{z-index:2}.dress-stage .sprite.scarf{z-index:3}.dress-stage .sprite.hat,.dress-stage .sprite.crown{z-index:4}.dress-stage .sprite.glasses{z-index:5}.dress-stage .sprite.ribbon,.dress-stage .sprite.star,.dress-stage .sprite.snow{z-index:6}
.penguin-avatar .sprite:not(.avatar-bg){clip-path:inset(11%)!important}
.penguin-avatar{--head-center-x:50%;--eye-center-x:50%;--neck-center-x:50%;--head-side-right:78%}.penguin-avatar .sprite.hat{left:calc(var(--head-center-x) - 37%);top:0;width:74%;height:38%}.penguin-avatar .sprite.crown{left:calc(var(--head-center-x) - 22.5%);top:2%;width:45%;height:26%}.penguin-avatar .sprite.glasses{left:calc(var(--eye-center-x) - 23%);top:34%;width:46%;height:19%}.penguin-avatar .sprite.ribbon{right:10%;top:18%;width:24%;height:22%}.penguin-avatar .sprite.star,.penguin-avatar .sprite.snow{right:1%;top:19%;width:22%;height:20%}.penguin-avatar .sprite.scarf-back,.penguin-avatar .sprite.scarf-front{left:calc(var(--neck-center-x) - 23%);width:46%;background-size:404% 404%!important}.penguin-avatar .sprite.scarf-back{top:50%;height:23%;z-index:1!important;clip-path:inset(10% 8% 47% 8%)!important}.penguin-avatar .sprite.scarf-front{top:51%;height:28%;z-index:3!important;clip-path:polygon(10% 34%,90% 34%,90% 59%,66% 59%,66% 96%,48% 96%,48% 59%,10% 59%)!important}.item-art .scarf-back{clip-path:none!important}.item-art .scarf-front{display:none}.dress-stage .sprite.scarf-back{z-index:1!important}.dress-stage .sprite.scarf-front{z-index:3!important}
.item-art .item-thumbnail.sprite{position:absolute!important;inset:2px!important;width:calc(100% - 4px)!important;height:calc(100% - 4px)!important;transform:none!important;clip-path:none!important;mask-image:none!important;-webkit-mask-image:none!important}
.penguin-avatar .sprite.headwear-back,.penguin-avatar .sprite.headwear-front{left:calc(var(--head-center-x) - 38%);top:-4%;width:76%;height:39%;clip-path:none!important;transform:none;transform-origin:50% 75%}
.penguin-avatar .sprite.headwear-back{z-index:1!important;-webkit-mask-image:linear-gradient(to bottom,#000 0 64%,transparent 82%);mask-image:linear-gradient(to bottom,#000 0 64%,transparent 82%)}
.penguin-avatar .sprite.headwear-front{z-index:4!important;-webkit-mask-image:linear-gradient(to bottom,transparent 47%,#000 60% 100%);mask-image:linear-gradient(to bottom,transparent 47%,#000 60% 100%)}
.penguin-avatar .sprite.crown.headwear-back,.penguin-avatar .sprite.crown.headwear-front{left:calc(var(--head-center-x) - 25%);top:0;width:50%;height:29%}
.penguin-avatar .sprite.crown.headwear-back{-webkit-mask-image:linear-gradient(to bottom,#000 0 72%,transparent 91%);mask-image:linear-gradient(to bottom,#000 0 72%,transparent 91%)}
.penguin-avatar .sprite.crown.headwear-front{-webkit-mask-image:linear-gradient(to bottom,transparent 58%,#000 74% 100%);mask-image:linear-gradient(to bottom,transparent 58%,#000 74% 100%)}
.penguin-avatar .sprite.scarf-back{z-index:1!important;clip-path:none!important;-webkit-mask-image:linear-gradient(to bottom,#000 5% 50%,transparent 69%);mask-image:linear-gradient(to bottom,#000 5% 50%,transparent 69%)}
.penguin-avatar .sprite.scarf-front{z-index:3!important;clip-path:polygon(8% 31%,92% 31%,92% 56%,66% 56%,66% 98%,48% 98%,48% 58%,8% 58%)!important;-webkit-mask-image:linear-gradient(to bottom,transparent 24%,#000 34% 100%);mask-image:linear-gradient(to bottom,transparent 24%,#000 34% 100%)}
.dress-stage .sprite.headwear-back{z-index:1!important}.dress-stage .sprite.headwear-front{z-index:4!important}
.dress-stage .penguin-avatar>img{inset:0 auto 0 18%;width:64%;height:100%;object-fit:fill;clip-path:none;mix-blend-mode:normal}
.penguin-avatar .sprite.headwear-back,.penguin-avatar .sprite.headwear-front{left:calc(var(--head-center-x) - 32%);width:64%;top:0;height:36%}
.penguin-avatar .sprite.crown.headwear-back,.penguin-avatar .sprite.crown.headwear-front{left:calc(var(--head-center-x) - 21%);width:42%;top:1%;height:25%}

/* Dress-room clipping boundary: only the outer stage clips. */
.dress-stage{overflow:hidden}
.dress-stage #avatarPreview,.dress-stage .penguin-avatar,.dress-stage .avatar-item{overflow:visible}
.dress-stage .penguin-avatar .sprite.glasses,.dress-stage .penguin-avatar .sprite.ribbon,.dress-stage .penguin-avatar .sprite.star,.dress-stage .penguin-avatar .sprite.snow{clip-path:none!important;-webkit-mask-image:none!important;mask-image:none!important;background-size:contain!important;background-position:center!important}
.dress-stage .penguin-avatar .sprite.glasses{left:calc(var(--eye-center-x) - 24%);top:30.5%;width:48%;height:20%}
.dress-stage .penguin-avatar .sprite.ribbon{right:11%;top:17%;width:23%;height:22%}
.dress-stage .penguin-avatar .sprite.star,.dress-stage .penguin-avatar .sprite.snow{right:6%;top:18%;width:19%;height:18%}

/* Card artwork uses the whole atlas cell with safe transparent breathing room. */
.item-art{padding:8px;overflow:hidden}
.item-art .item-thumbnail.sprite{inset:8px!important;width:calc(100% - 16px)!important;height:calc(100% - 16px)!important;background-size:contain!important;background-position:center!important;background-repeat:no-repeat!important;clip-path:none!important;-webkit-mask-image:none!important;mask-image:none!important}

/* Explicit wearable stack. */
.dress-stage .avatar-bg{z-index:0}
.dress-stage .headwear-back,.dress-stage .scarf-back{z-index:1!important}
.dress-stage .penguin-avatar>img{z-index:2}
.dress-stage .scarf-front{z-index:3!important}
.dress-stage .headwear-front{z-index:4!important}
.dress-stage .glasses{z-index:5!important}
.dress-stage .ribbon,.dress-stage .star,.dress-stage .snow{z-index:6!important}
.sprite-0{background-image:url('assets/wardrobe/items/item-0.png')!important;background-size:contain!important;background-position:center!important}
.sprite-1{background-image:url('assets/wardrobe/items/item-1.png')!important;background-size:contain!important;background-position:center!important}
.sprite-2{background-image:url('assets/wardrobe/items/item-2.png')!important;background-size:contain!important;background-position:center!important}
.sprite-3{background-image:url('assets/wardrobe/items/item-3.png')!important;background-size:contain!important;background-position:center!important}
.sprite-4{background-image:url('assets/wardrobe/items/item-4.png')!important;background-size:contain!important;background-position:center!important}
.sprite-5{background-image:url('assets/wardrobe/items/item-5.png')!important;background-size:contain!important;background-position:center!important}
.sprite-6{background-image:url('assets/wardrobe/items/item-6.png')!important;background-size:contain!important;background-position:center!important}
.sprite-7{background-image:url('assets/wardrobe/items/item-7.png')!important;background-size:contain!important;background-position:center!important}
.sprite-8{background-image:url('assets/wardrobe/items/item-8.png')!important;background-size:contain!important;background-position:center!important}
.sprite-9{background-image:url('assets/wardrobe/items/item-9.png')!important;background-size:contain!important;background-position:center!important}
.sprite-10{background-image:url('assets/wardrobe/items/item-10.png')!important;background-size:contain!important;background-position:center!important}
.sprite-11{background-image:url('assets/wardrobe/items/item-11.png')!important;background-size:contain!important;background-position:center!important}
.sprite-12{background-image:url('assets/wardrobe/items/item-12.png')!important;background-size:contain!important;background-position:center!important}
.sprite-13{background-image:url('assets/wardrobe/items/item-13.png')!important;background-size:contain!important;background-position:center!important}
.sprite-14{background-image:url('assets/wardrobe/items/item-14.png')!important;background-size:contain!important;background-position:center!important}
.item-art .item-thumbnail.sprite:not(.sprite-15),.dress-stage .penguin-avatar .sprite:not(.sprite-15){background-size:contain!important;background-position:center!important;background-repeat:no-repeat!important}

/* The saved outfit renderer is shared by the dress room and the home hero. */
#menu .official-hero>.penguin-avatar.home{--avatar-size:210px;position:relative;z-index:1;flex:0 0 auto;width:172px;height:210px;margin:0;overflow:visible;border-radius:0;background:transparent;transform:translateX(-30px)}
#menu .official-hero>.penguin-avatar.home>img{inset:0;width:100%;height:100%;object-fit:contain;object-position:center;mix-blend-mode:normal;border-radius:0;filter:drop-shadow(0 10px 8px #17648838)}
#menu .official-hero>.penguin-avatar.home>.avatar-bg{inset:0;border-radius:42%}
@media(max-height:740px){#menu .official-hero>.penguin-avatar.home{width:145px;height:174px;transform:translateX(-27px)}}
@media(max-width:350px){#menu .official-hero>.penguin-avatar.home{width:150px;transform:translateX(-27px)}}
