.wardrobe-modal,.wardrobe-confirm{box-sizing:border-box;color:#efddba;background:linear-gradient(135deg,#292530,#171920);border:1px solid #ad8950;border-radius:16px;box-shadow:0 22px 90px #000b;font-family:system-ui,sans-serif;padding:0}.wardrobe-modal{width:min(840px,calc(100vw - 32px));max-height:90dvh;overflow:auto}.wardrobe-modal::backdrop,.wardrobe-confirm::backdrop{background:#090b14b8}.wardrobe-modal header{display:flex;align-items:center;justify-content:space-between;padding:18px 24px;border-bottom:1px solid #ad895044}.wardrobe-modal h2{font-size:23px;margin:0}.wardrobe-modal button,.wardrobe-confirm button{color:inherit;background:#382d35;border:1px solid #8d7352;border-radius:9px;min-height:44px;cursor:pointer;padding:9px 16px;font:600 15px system-ui}.wardrobe-modal button:hover,.wardrobe-modal button[aria-pressed=true]{border-color:#e6be75;background:#65503e}.wardrobe-modal button:disabled,.wardrobe-confirm button:disabled{opacity:.5;cursor:wait}.wardrobe-body{display:grid;grid-template-columns:40% 1fr;gap:28px;padding:22px}.wardrobe-preview{min-width:0;display:flex;flex-direction:column;justify-content:center}.wardrobe-mirror{background:radial-gradient(ellipse at 50% 35%,#62506444,transparent 68%);border:1px solid #c29d572a;border-radius:45% 45% 12px 12px;overflow:hidden}.wardrobe-mirror canvas{display:block;width:100%;height:auto;max-height:420px;object-fit:contain}.wardrobe-turn{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:12px}.wardrobe-turn span{min-width:70px;text-align:center;font-size:13px}.wardrobe-options{min-width:0;display:flex;flex-direction:column;gap:16px}.wardrobe-options nav{display:flex;gap:8px;flex-wrap:wrap}.wardrobe-items{display:grid;gap:8px}.wardrobe-item{display:flex;justify-content:space-between;gap:12px;align-items:center;text-align:left}.wardrobe-item small{font-size:11px;font-weight:400;white-space:nowrap;color:#c2b39c}.wardrobe-colors{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.wardrobe-colors button{padding:0;background:var(--hair-color);height:36px;min-height:36px;border:2px solid #665748;box-shadow:inset 0 0 0 3px #0003}.wardrobe-colors button[aria-pressed=true]{background:var(--hair-color);outline:2px solid #efd9a9;outline-offset:2px}.wardrobe-options footer{margin-top:auto;display:flex;justify-content:space-between;gap:12px;align-items:center}.wardrobe-options footer strong{font-size:16px}.wardrobe-status{font-size:13px;min-height:20px;margin:0;color:#cbbfa9}.wardrobe-confirm{width:min(430px,calc(100vw - 32px));padding:26px;max-height:70dvh}.wardrobe-confirm p{font-size:17px;line-height:1.6;margin-top:0}.wardrobe-confirm>div{display:flex;gap:12px}.wardrobe-confirm [role=status]{font-size:13px;margin:12px 0 0}.shop-world-hit{position:absolute;pointer-events:auto;opacity:0;border:0;padding:0;background:none;cursor:pointer}.asset-editor-active .shop-world-hit{pointer-events:none}
@media(max-width:600px){.wardrobe-modal{width:calc(100vw - 20px);max-height:90dvh}.wardrobe-modal header{padding:10px 14px}.wardrobe-modal h2{font-size:19px}.wardrobe-body{grid-template-columns:1fr;gap:14px;padding:14px}.wardrobe-preview{display:grid;grid-template-columns:1fr auto;align-items:center;gap:12px}.wardrobe-mirror{width:120px;justify-self:center}.wardrobe-mirror canvas{height:165px;width:120px}.wardrobe-turn{display:grid;gap:4px;margin:0}.wardrobe-turn span{grid-row:2}.wardrobe-options{gap:12px}.wardrobe-items{gap:6px}.wardrobe-modal button{font-size:14px}.wardrobe-item small{font-size:10px}.wardrobe-options footer strong{font-size:14px}}
@media(max-height:460px) and (min-width:601px){.wardrobe-body{grid-template-columns:30% 1fr;padding:12px;gap:15px}.wardrobe-mirror canvas{height:210px}.wardrobe-modal header{padding:8px 16px}.wardrobe-options{gap:8px}.wardrobe-item{min-height:36px!important;padding:6px 10px!important}}

.wardrobe-filter{display:flex;gap:8px}.wardrobe-filter button{font-size:12px;min-height:34px;padding:6px 12px;background:transparent}

.wardrobe-selection{display:flex;flex-direction:column;gap:14px;min-height:0;overflow:auto;padding:3px;scrollbar-color:#bb9258 #211e28;scrollbar-width:thin}.wardrobe-colors[hidden]{display:none}.wardrobe-item{flex-shrink:0}.wardrobe-filter{flex-shrink:0}.wardrobe-options nav,.wardrobe-options footer{flex-shrink:0}
@media(max-width:600px){.wardrobe-modal[open]{display:flex;flex-direction:column;height:90dvh;overflow:hidden}.wardrobe-modal header{flex-shrink:0}.wardrobe-body{flex:1;min-height:0;grid-template-rows:128px minmax(0,1fr);overflow:hidden;gap:10px}.wardrobe-preview{min-height:0}.wardrobe-mirror{width:98px}.wardrobe-mirror canvas{height:128px;width:98px}.wardrobe-options{min-height:0;gap:8px}.wardrobe-selection{flex:1}.wardrobe-status:empty{display:none}.wardrobe-options footer{margin-top:0}.wardrobe-colors{flex-shrink:0}.wardrobe-options nav button{min-height:36px}.wardrobe-item{min-height:42px!important}.wardrobe-filter button{min-height:30px}.wardrobe-colors button{min-height:32px;height:32px}}
@media(max-height:460px) and (max-width:600px){.wardrobe-body{grid-template-columns:minmax(105px,30%) minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:12px;padding:10px}.wardrobe-preview{display:flex;gap:0;min-height:0}.wardrobe-mirror{width:100px}.wardrobe-mirror canvas{width:100px;height:145px}.wardrobe-turn{display:flex;gap:5px;margin-top:4px}.wardrobe-turn span{min-width:45px;font-size:11px}.wardrobe-turn button{padding:5px 9px;min-width:32px}.wardrobe-options{gap:6px}.wardrobe-options nav{gap:5px}.wardrobe-options nav button{min-height:34px;padding:5px 10px}.wardrobe-filter button{min-height:30px}.wardrobe-options footer strong{font-size:13px}.wardrobe-options footer{gap:6px}.wardrobe-status{font-size:11px;min-height:14px}.wardrobe-modal header{padding:6px 14px}.wardrobe-modal h2{font-size:18px}.wardrobe-modal header button{min-height:36px}}

.wardrobe-item small{white-space:normal;max-width:110px;text-align:right;line-height:1.25}

.wardrobe-items[hidden],.wardrobe-filter[hidden]{display:none}.wardrobe-colors button{height:44px;min-height:44px}

.wardrobe-colors button:hover{background:var(--hair-color)}

/* Whole costumes: artwork is the main content of every card. */
.wardrobe-modal[data-shop=clothing]{width:min(1060px,calc(100vw - 32px));height:min(790px,90dvh);overflow:hidden}
.wardrobe-modal[data-shop=clothing][open]{display:flex;flex-direction:column}
.wardrobe-modal[data-shop=clothing] header{flex-shrink:0}
.wardrobe-modal[data-shop=clothing] .wardrobe-body{flex:1;min-height:0;grid-template-columns:minmax(220px,.8fr) minmax(0,1.2fr);gap:24px;overflow:hidden}
.wardrobe-modal[data-shop=clothing] .wardrobe-options{min-height:0}
.wardrobe-modal[data-shop=clothing] .wardrobe-selection{flex:1;overscroll-behavior:contain}
.wardrobe-modal[data-shop=clothing] .wardrobe-items{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.wardrobe-modal .outfit-card{position:relative;display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;gap:5px;min-width:0;padding:10px 12px 12px;text-align:left;overflow:hidden;background:radial-gradient(ellipse at 50% 36%,#594b5544,transparent 74%),#22212a;border-color:#766146;transition:background-color .15s,border-color .15s}
.wardrobe-modal .outfit-card[aria-pressed=true]{background:radial-gradient(ellipse at 50% 36%,#ad845033,transparent 74%),#332a2d;box-shadow:inset 0 0 0 1px #ddb676}
.wardrobe-modal .outfit-card[aria-pressed=true]::after{content:'✓';position:absolute;top:10px;right:10px;border-radius:50%;width:23px;height:23px;background:#d2ad6c;color:#201b21;text-align:center;line-height:23px}
.outfit-card img{display:block;width:100%;height:190px;object-fit:contain;filter:drop-shadow(0 5px 8px #0005);pointer-events:none}
.outfit-card .outfit-name{font-size:14px;line-height:1.3;color:#f2e3c7}
.outfit-card .outfit-description{font-size:11px;font-weight:400;line-height:1.4;color:#baad9e;min-height:30px}
.wardrobe-modal .outfit-card small{text-align:left;max-width:none;white-space:normal;margin-top:auto;color:#dbbe8c;font-size:11px}
.wardrobe-modal[data-shop=clothing] .wardrobe-mirror{border-radius:42% 42% 16px 16px;background:radial-gradient(ellipse at 50% 45%,#725a6c40,transparent 72%),#1d1d2699}
.wardrobe-modal[data-shop=clothing] .wardrobe-mirror canvas{max-height:none}
.wardrobe-modal button:focus-visible{outline:2px solid #eed8a5;outline-offset:2px}
@media(max-width:600px){
 .wardrobe-modal[data-shop=clothing]{width:calc(100vw - 16px);height:92dvh;max-height:92dvh}
 .wardrobe-modal[data-shop=clothing] .wardrobe-body{grid-template-columns:1fr;grid-template-rows:clamp(140px,25dvh,205px) minmax(0,1fr);padding:10px;gap:8px}
 .wardrobe-modal[data-shop=clothing] .wardrobe-preview{display:grid;grid-template-columns:1fr auto;gap:10px}
 .wardrobe-modal[data-shop=clothing] .wardrobe-mirror{width:calc(clamp(140px,25dvh,205px)*.8)}
 .wardrobe-modal[data-shop=clothing] .wardrobe-mirror canvas{width:100%;height:clamp(140px,25dvh,205px)}
 .wardrobe-modal[data-shop=clothing] .wardrobe-items{gap:8px}
 .wardrobe-modal .outfit-card{padding:8px;gap:4px}
 .outfit-card img{height:135px}
 .outfit-card .outfit-name{font-size:12px}
 .outfit-card .outfit-description{font-size:10px;min-height:28px}
 .wardrobe-modal[data-shop=clothing] footer strong{font-size:13px}
}
@media(max-height:460px){
 .wardrobe-modal[data-shop=clothing] .wardrobe-body{grid-template-columns:minmax(100px,30%) minmax(0,1fr);grid-template-rows:minmax(0,1fr);padding:8px;gap:10px}
 .wardrobe-modal[data-shop=clothing] .wardrobe-preview{display:flex;min-height:0;gap:0}
 .wardrobe-modal[data-shop=clothing] .wardrobe-mirror{width:108px}
 .wardrobe-modal[data-shop=clothing] .wardrobe-mirror canvas{width:108px;height:145px}
 .wardrobe-modal[data-shop=clothing] .wardrobe-turn{display:flex;margin-top:4px;gap:5px}
 .wardrobe-modal[data-shop=clothing] .wardrobe-items{gap:6px}
 .wardrobe-modal .outfit-card{padding:6px}
 .outfit-card img{height:110px}
 .outfit-card .outfit-description{min-height:0}
}

@media(max-width:600px) and (min-height:461px){
  .wardrobe-body{--wardrobe-preview-height:clamp(150px,28dvh,236px);grid-template-rows:var(--wardrobe-preview-height) minmax(0,1fr)}
  .wardrobe-mirror{width:calc(var(--wardrobe-preview-height)*.8)}
  .wardrobe-mirror canvas{height:var(--wardrobe-preview-height);width:calc(var(--wardrobe-preview-height)*.8)}
}