.wardrobe-view{text-align:center;padding:0 8px}.wardrobe-view h2{font-size:38px;margin:0 0 12px}.wardrobe-cabinet{position:relative;perspective:1000px;padding:14px 18px 15px;border:12px solid #8eab36;border-top-width:19px;border-bottom-width:18px;border-radius:14px;background:linear-gradient(#e9e7c5,#f1e5c8);box-shadow:inset 0 3px 12px #42542b22,0 7px 0 #5c7426,0 10px 25px #283c2122;overflow:hidden}.wardrobe-costumes{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}.wardrobe-costume{position:relative;border:0;background:transparent;padding:5px;min-width:0;height:235px;display:flex;align-items:center;justify-content:center;border-radius:20px;transition:background-color .2s,transform .2s}.wardrobe-costume img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 3px #343f2f22);pointer-events:none}.wardrobe-costume b{position:absolute;bottom:2px;right:0;font-size:22px;width:33px;height:33px;border-radius:50%;background:#fbf1c9ed;display:grid;place-items:center;box-shadow:0 2px 3px #344b2e25}.wardrobe-costume[aria-pressed=true]{background:color-mix(in srgb,var(--costume-color),transparent 85%);outline:2px solid var(--costume-color)}.wardrobe-costume:hover{transform:translateY(-3px);background:#ffffff66}.wardrobe-costume:focus-visible{outline:3px solid #47785b;outline-offset:1px}.wardrobe-door{position:absolute;top:-3px;bottom:-3px;width:50.5%;background:linear-gradient(105deg,#a7c648,#8cab32);border:2px solid #6f8c27;border-radius:6px;box-shadow:inset 2px 2px 0 #c9df7566;pointer-events:none;transform-style:preserve-3d;backface-visibility:hidden}.wardrobe-door:after{content:'';position:absolute;top:49%;width:10px;height:39px;background:linear-gradient(90deg,#b8b79e,#f1eac7,#a9a88e);border-radius:4px;box-shadow:1px 1px 3px #35441d77}.wardrobe-door-left{left:0;transform-origin:left center;animation:wardrobe-open-left .7s ease-in-out both}.wardrobe-door-left:after{right:16px}.wardrobe-door-right{right:0;transform-origin:right center;animation:wardrobe-open-right .7s ease-in-out both}.wardrobe-door-right:after{left:16px}.wardrobe-plain{border:1px solid #d0d8bf;border-radius:17px;padding:6px 20px;margin:18px auto 0;background:#edf0dc;display:flex;align-items:center;justify-content:center;gap:14px;min-width:130px;height:62px;color:#4d7b63}.wardrobe-plain img{height:52px;width:38px;object-fit:contain;pointer-events:none}.wardrobe-plain span{font-size:26px}.wardrobe-plain[aria-pressed=true]{border-color:#749a68;box-shadow:0 0 0 2px #c6dbb0}
@keyframes wardrobe-open-left{from{transform:rotateY(0)}to{transform:rotateY(-112deg);opacity:.2}}@keyframes wardrobe-open-right{from{transform:rotateY(0)}to{transform:rotateY(112deg);opacity:.2}}@keyframes costume-dress-spark{from{opacity:.8;transform:translate(-50%,-50%) scale(.4)}to{opacity:0;transform:translate(-50%,-75%) scale(1.6)}}
@media(max-width:700px){.wardrobe-costumes{grid-template-columns:repeat(3,minmax(0,1fr));gap:3px}.wardrobe-costume{height:170px}.wardrobe-cabinet{padding:8px;border-width:9px}.wardrobe-plain{height:53px;margin-top:12px}.wardrobe-view h2{font-size:28px;margin-bottom:6px}.wardrobe-costume b{font-size:18px;width:27px;height:27px}}
@media(max-height:570px){.wardrobe-costume{height:145px}.wardrobe-view h2{margin:0 0 5px;font-size:26px}.wardrobe-plain{height:47px;margin-top:10px}.wardrobe-plain img{height:38px}}
@media(prefers-reduced-motion:reduce){.wardrobe-door{animation:none;display:none}.wardrobe-costume{transition:none}.wardrobe-costume:hover{transform:none}}