.wardrobe-scene{position:absolute;inset:0;overflow:hidden;color:#f4e6c5;background:#0a111b;font-family:Georgia,'Songti SC','STSong',serif;isolation:isolate;text-shadow:0 2px 6px #02070c}
.wardrobe-scene *{box-sizing:border-box}.wardrobe-scene button{font:inherit;color:inherit;cursor:pointer}.wardrobe-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;image-rendering:pixelated;z-index:-1}.wardrobe-header{position:absolute;inset:5% 5.5% auto;display:flex;gap:24px;align-items:flex-start}.wardrobe-header p{font-size:9px;letter-spacing:3px;margin:0 0 12px;color:#c8b58e}.wardrobe-header h2{font-size:30px;font-weight:400;letter-spacing:9px;margin:0 0 10px}.wardrobe-header>div>span{font-size:10px;letter-spacing:3px;color:#c5c1ae}.wardrobe-school{margin-left:auto;display:flex;align-items:center;gap:12px;text-align:right}.wardrobe-school img{height:51px;width:48px;object-fit:contain;image-rendering:pixelated}.wardrobe-school>span{font-size:10px;letter-spacing:3px}.wardrobe-school strong{display:block;font-weight:400;font-size:22px;margin-top:9px;color:#e9ce93}.wardrobe-school small{font-size:10px;letter-spacing:1px}.wardrobe-close{border:0;background:none;font-size:27px!important;line-height:1;padding:3px 0 0 15px}.wardrobe-caption{position:absolute;left:7%;top:31%;width:24%;max-width:270px}.wardrobe-caption>p:first-child{font-size:9px;letter-spacing:5px;color:#cfb47c;margin:0 0 23px}.wardrobe-caption h3{font-size:clamp(28px,3.1vw,44px);font-weight:400;letter-spacing:5px;margin:0 0 22px;color:#f6e2ae;line-height:1.45}.wardrobe-caption>span{font-size:12px;letter-spacing:3px;color:#d3c6aa}.wardrobe-poem{font-size:12px;line-height:2.3;color:#d0c5b2;max-width:220px;margin:23px 0}.wardrobe-caption>small{font-size:10px;letter-spacing:1px;color:#b8c6ce}.wardrobe-actor{position:absolute;height:53%;aspect-ratio:6/7;bottom:23.9%;left:50%;transform:translateX(-50%);pointer-events:none}.wardrobe-person{display:block;width:100%;height:100%;image-rendering:pixelated}.wardrobe-change{position:absolute;width:42%;height:40%;left:29%;bottom:32%;opacity:.8;image-rendering:pixelated;display:none}.wardrobe-scene[data-changing=true] .wardrobe-change{display:block}.wardrobe-arrow{position:absolute;top:48%;border:0;background:none;font-size:42px!important;line-height:1;padding:8px 15px;opacity:.65}.wardrobe-arrow:hover,.wardrobe-arrow:focus-visible{opacity:1}.wardrobe-prev{left:31%}.wardrobe-next{right:31%}.wardrobe-robes{position:absolute;right:5.5%;top:28%;width:23%;display:grid;grid-template-columns:1fr 1fr;gap:20px 12px}.wardrobe-robes button{position:relative;display:flex;flex-direction:column;align-items:center;gap:5px;border:0;background:none;padding:0 0 7px;opacity:.55;transition:opacity .2s,transform .2s;text-shadow:0 2px 3px #000}.wardrobe-robes button[aria-pressed=true]{opacity:1;transform:translateY(-3px)}.wardrobe-robes button:hover,.wardrobe-robes button:focus-visible{opacity:1}.wardrobe-robes button[aria-pressed=true]::after{content:'';position:absolute;bottom:-5px;left:calc(50% - 3px);width:6px;height:6px;background:#f2d69b;transform:rotate(45deg)}.wardrobe-robes img{height:clamp(65px,12vh,125px);width:90%;object-fit:contain;image-rendering:pixelated}.wardrobe-robes span{font-size:12px;letter-spacing:2px}.wardrobe-robes small{font-size:9px;letter-spacing:1px;color:#cbb997}.wardrobe-confirmation{position:absolute;bottom:8%;left:27%;right:27%;text-align:center}.wardrobe-feedback{font-size:11px;line-height:1.7;min-height:19px;margin:0 0 11px;color:#d6c7a6}.wardrobe-confirm{padding:10px 26px;min-width:225px;border:12px solid transparent;border-image:url('assets/v4/ui/status-frame.png') 30 fill stretch;background:#090d13c0;font-size:13px!important;letter-spacing:2px}.wardrobe-confirm:disabled{opacity:.48;cursor:default}.wardrobe-confirm:hover:not(:disabled),.wardrobe-confirm:focus-visible{color:#fff3c9;transform:translateY(-2px)}.wardrobe-footer{position:absolute;left:6%;right:6%;bottom:3%;display:flex;align-items:center;justify-content:space-between;gap:18px}.wardrobe-footer button{padding:5px 0;border:0;background:none;font-size:11px;letter-spacing:2px}.wardrobe-footer button span{margin-left:12px}.wardrobe-footer p{font-size:9px;color:#b0a38c;letter-spacing:1px}.wardrobe-scene button:focus-visible{outline:1px solid #f6dda8;outline-offset:4px}.wardrobe-scene[data-reduced=true] *{transition:none}
@media(max-width:800px){.wardrobe-header h2{font-size:25px}.wardrobe-header p{font-size:7px;letter-spacing:2px}.wardrobe-caption{left:5.5%;width:22%}.wardrobe-caption h3{font-size:33px;letter-spacing:5px}.wardrobe-caption>span{font-size:10px;letter-spacing:1px}.wardrobe-poem{font-size:10px;line-height:2}.wardrobe-robes{right:4%;width:24%;gap:15px 8px}.wardrobe-robes span{font-size:10px;letter-spacing:1px}.wardrobe-robes small{font-size:8px}.wardrobe-confirmation{left:25%;right:25%;bottom:8.5%}.wardrobe-feedback{font-size:10px}.wardrobe-footer p{display:none}.wardrobe-confirm{min-width:190px;font-size:11px!important;padding:7px 16px}}
@media(max-width:560px) and (max-aspect-ratio:1/1){.wardrobe-background{object-position:50% center}.wardrobe-header{inset:4% 6% auto;gap:12px}.wardrobe-header h2{font-size:25px;letter-spacing:6px;margin-bottom:6px}.wardrobe-header p{font-size:6px;letter-spacing:1.4px;margin-bottom:9px}.wardrobe-header>div>span{font-size:8px;letter-spacing:1px}.wardrobe-school img{display:none}.wardrobe-school>span{font-size:8px;letter-spacing:1px}.wardrobe-school strong{font-size:20px}.wardrobe-close{padding-left:5px}.wardrobe-caption{left:5%;right:5%;width:90%;max-width:none;top:18%;text-align:center}.wardrobe-caption>p:first-child{font-size:7px;letter-spacing:3px;margin-bottom:8px}.wardrobe-caption h3{font-size:32px;letter-spacing:8px;margin-bottom:9px}.wardrobe-caption>span{font-size:9px;letter-spacing:2px}.wardrobe-poem,.wardrobe-caption>small{display:none}.wardrobe-actor{height:36%;bottom:34%;left:50%}.wardrobe-arrow{top:44%;font-size:35px!important}.wardrobe-prev{left:11%}.wardrobe-next{right:11%}.wardrobe-robes{left:6%;right:6%;top:auto;bottom:19%;width:auto;grid-template-columns:repeat(4,1fr);gap:4px}.wardrobe-robes img{height:62px}.wardrobe-robes span{font-size:9px;letter-spacing:0}.wardrobe-robes small{font-size:7px}.wardrobe-robes button{gap:4px}.wardrobe-confirmation{bottom:7%;left:6%;right:6%}.wardrobe-feedback{font-size:9px;line-height:1.8;max-width:280px;margin:0 auto 8px;min-height:16px}.wardrobe-confirm{font-size:11px!important;min-width:220px;padding:8px 20px;border-width:10px}.wardrobe-footer{bottom:2.5%;left:6%;right:6%;gap:8px}.wardrobe-footer button{font-size:10px;letter-spacing:1px}.wardrobe-footer button span{margin-left:5px}}
@media(max-height:580px) and (min-aspect-ratio:1/1){.wardrobe-header{top:4%}.wardrobe-header p{font-size:6px;margin-bottom:6px}.wardrobe-header h2{font-size:22px;margin-bottom:5px;letter-spacing:5px}.wardrobe-header>div>span{font-size:8px;letter-spacing:1px}.wardrobe-school img{height:36px}.wardrobe-school strong{font-size:19px;margin-top:5px}.wardrobe-caption{top:29%;width:22%}.wardrobe-caption>p:first-child{margin-bottom:10px;font-size:7px}.wardrobe-caption h3{font-size:30px;margin-bottom:12px}.wardrobe-caption>span{font-size:9px}.wardrobe-poem{font-size:9px;margin:12px 0;line-height:1.9}.wardrobe-caption>small{font-size:8px}.wardrobe-actor{height:55%;bottom:23%}.wardrobe-robes{top:27%;gap:11px 6px}.wardrobe-robes img{height:65px}.wardrobe-robes span{font-size:9px}.wardrobe-robes small{font-size:7px}.wardrobe-confirmation{bottom:6%}.wardrobe-feedback{font-size:8px;min-height:14px;margin-bottom:4px}.wardrobe-confirm{border-width:8px;font-size:10px!important;padding:4px 14px;min-width:180px}.wardrobe-footer{bottom:1.5%}.wardrobe-footer button{font-size:8px}.wardrobe-footer p{display:none}}

/* Preserve the scene while making purchase state and navigation readable. */
.wardrobe-caption>p:first-child{font-size:11px;letter-spacing:2px}
.wardrobe-caption>span,.wardrobe-poem{font-size:13px}
.wardrobe-caption>small,.wardrobe-robes small,.wardrobe-feedback{font-size:12px}
.wardrobe-robes button{opacity:.78}.wardrobe-robes button[aria-pressed=true]{opacity:1}
.wardrobe-confirm:disabled{opacity:.72}
.wardrobe-footer button{font-size:13px;min-height:44px}
.wardrobe-close{min-width:44px;min-height:44px}
@media(max-width:560px) and (max-aspect-ratio:1/1){.wardrobe-caption>p:first-child{font-size:10px;letter-spacing:1px}.wardrobe-caption>span{font-size:11px}.wardrobe-robes{bottom:20%}.wardrobe-robes span{font-size:11px}.wardrobe-robes small{font-size:10px}.wardrobe-feedback{font-size:12px;line-height:1.6;max-width:320px}.wardrobe-confirmation{bottom:6.5%}.wardrobe-footer button{font-size:12px;letter-spacing:0}.wardrobe-close{padding:0;min-width:32px}.wardrobe-school>span{font-size:10px}}
@media(max-height:580px) and (min-aspect-ratio:1/1){.wardrobe-caption>p:first-child,.wardrobe-caption>small,.wardrobe-robes small{font-size:10px}.wardrobe-caption>span,.wardrobe-poem{font-size:11px}.wardrobe-feedback{font-size:11px;max-width:420px;margin-inline:auto}.wardrobe-footer button{font-size:11px;min-height:30px}.wardrobe-confirmation{left:24%;right:24%;bottom:7%}}

/* Bleed the generated backdrop slightly beyond the viewport edge. */
.wardrobe-background{transform:scale(1.004)}
