.wardrobe-layout{grid-template-columns:minmax(0,1.12fr) minmax(340px,1fr);gap:28px;align-items:start}
.fitting-room{position:sticky;top:96px;min-width:0;scroll-margin-top:94px;border:1px solid #ad916b50;border-radius:12px;overflow:hidden;background:#0b1520}
.fitting-stage{position:relative;isolation:isolate;aspect-ratio:1;overflow:hidden;background:radial-gradient(ellipse at 48% 36%,#2b455951,transparent 60%),linear-gradient(0deg,#0a1421 0%,#0a142135 45%,#0b1725b3),url('./magic-assets/castle-night.webp') center/cover}
.fitting-stage:before{content:'';position:absolute;inset:6% 13% 8%;border:1px solid #b9a07638;border-radius:48% 48% 2px 2px;background:linear-gradient(90deg,#08101a8a,transparent 30%,transparent 70%,#08101a8a);pointer-events:none}
.fitting-stage:after{content:'';position:absolute;left:11%;right:11%;height:8%;bottom:1%;border-radius:50%;border:1px solid #d5b67555;box-shadow:0 0 30px #d5b67515,inset 0 0 25px #d5b6750a;transform:perspective(100px) rotateX(20deg);z-index:-1}
.fitting-layers{position:absolute;inset:0 auto 0 50%;width:auto;height:100%;aspect-ratio:1;max-width:100%;transform:translateX(-50%);pointer-events:none}
.fitting-layers img{position:absolute;display:block;object-fit:fill;max-width:none;filter:drop-shadow(0 5px 9px #0005)}
.fitting-layers #wardrobe-portrait{left:8.5%;top:0;width:62.67%;height:94%;z-index:2}
.fitting-layers #fitting-wand{left:19.3%;top:13.9%;width:9.6%;height:27%;z-index:1;transform:rotate(-12deg);transform-origin:50% 85%}
.fitting-layers #fitting-companion{left:68%;top:48%;width:28%;height:42%;z-index:3}
.fitting-layers[data-companion=cat-crookshanks] #fitting-companion{left:67%;top:65%;width:29%;height:29%}
.fitting-layers[data-companion=phoenix-gold] #fitting-companion{left:62%;top:36%;width:37%;height:55.5%}
.fitting-layers[data-companion=none] #wardrobe-portrait{left:19%}
.fitting-layers[data-companion=none] #fitting-wand{left:29.8%}
.fitting-layers[data-pose=mounted] #wardrobe-portrait{left:3%;top:7%;width:94%;height:94%}
.fitting-layers[data-pose=mounted] #fitting-wand{left:30.5%;top:3.6%;width:6.5%;height:20%;transform:rotate(-18deg)}
.fitting-inscription{position:absolute;top:18px;left:20px;color:#ddc59b;font:10px Cinzel,serif;letter-spacing:.16em;z-index:4;writing-mode:vertical-rl}
.fitting-info{padding:20px 22px 22px;border-top:1px solid #ad916b36}
.fitting-title{display:flex;justify-content:space-between;gap:10px;align-items:center}.fitting-title h2{font-family:var(--serif);font-size:23px;margin:0}.fitting-title span{font-size:11px;color:var(--gold)}
.fitting-description{font-size:12px;color:#cad6de;line-height:1.8;margin:10px 0}
.fitting-status{font-size:11px;color:#a5bacb;min-height:18px;margin:4px 0}.fitting-stage[aria-busy=true] .fitting-layers{opacity:.55;transition:opacity .18s}
.fitting-lock{font-size:12px;line-height:1.7;color:#adbecc;margin:12px 0}
.fitting-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.fitting-actions .gold{flex:1;min-width:150px}.fitting-actions .text-button{font-size:13px}.fitting-secondary{display:flex;justify-content:space-between;gap:12px}.fitting-secondary .text-button{font-size:11px}
.gear-card[data-gear-slot=robe] .gear-art{object-fit:contain;object-position:center;height:260px;background:radial-gradient(ellipse at 50% 40%,#34465755,transparent 75%)}
.gear-card.trying{outline:2px solid #ddbd82;outline-offset:2px}.gear-preview[aria-pressed=true]:after{content:'✓';position:absolute;left:12px;top:12px;width:27px;height:27px;display:grid;place-items:center;border-radius:50%;background:#d5b675;color:#172333;font-size:16px}
.gear-copy .gear-story{display:block;width:100%;font-size:12px;margin-top:4px}.gear-copy p{min-height:0}.wardrobe-hint{line-height:1.8}
@media(min-width:901px){.fitting-room{top:90px}.fitting-stage{max-height:calc(100dvh - 335px);min-height:310px}.fitting-layers{width:auto;height:100%;aspect-ratio:1;max-width:100%;max-height:100%;inset:auto auto 0 50%;transform:translateX(-50%)} }
@media(max-width:1100px) and (min-width:901px){.wardrobe-layout{grid-template-columns:minmax(0,1fr) minmax(310px,1fr);gap:20px}.fitting-info{padding:15px}.gear-card[data-gear-slot=robe] .gear-art{height:220px}}
@media(max-width:900px){.wardrobe-layout{grid-template-columns:1fr;gap:20px}.fitting-room{position:relative;top:auto;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:center}.fitting-info{padding:24px;border-top:0;border-left:1px solid #ad916b36}.fitting-stage{width:100%;min-height:0}.fitting-title{display:block}.fitting-title span{display:block;margin-bottom:8px}.fitting-title h2{font-size:25px}.fitting-actions{gap:5px}.fitting-actions .gold{flex-basis:100%}.fitting-actions .text-button{flex:1}.fitting-description{font-size:13px}.gear-card[data-gear-slot=robe] .gear-art{height:300px}.fitting-inscription{left:12px;font-size:8px}}
@media(max-width:650px){.fitting-room{display:block}.fitting-stage{max-height:450px}.fitting-info{border-left:0;border-top:1px solid #ad916b36;padding:18px}.fitting-title{display:flex}.fitting-title h2{font-size:23px}.fitting-title span{margin:0}.fitting-description{font-size:12px}.fitting-actions .gold{flex-basis:auto}.fitting-actions .text-button{flex:0 0 auto}.gear-card[data-gear-slot=robe] .gear-art{height:225px}.fitting-lock{margin:8px 0}.fitting-inscription{top:16px}}
@media(prefers-reduced-motion:reduce){.fitting-stage[aria-busy=true] .fitting-layers{transition:none}}