/* The wardrobe shares the portrait shell and its installed-iOS safe areas. */
.collection-switch{display:flex;gap:4px;padding:3px 12px;border-bottom:1px solid #373850;background:#131828;flex:none}
.collection-switch button{display:flex;align-items:center;justify-content:center;gap:8px;flex:1;min-height:36px;color:var(--muted);font-size:11px;border-radius:4px}
.collection-switch button svg{width:16px;height:16px}
.collection-switch button.active{background:#c2b0f618;color:var(--lav)}
.ritual-outlets{display:flex;gap:1px;flex-wrap:wrap;justify-content:flex-end}
.ritual-outlets .text-btn{font-size:10px;padding:7px}
.collection-screen .topbar{height:52px;min-height:52px;padding:4px 12px}
.collection-screen .brand{font-size:21px}.collection-screen .brand small{font-size:9px}
.wardrobe-scroll{display:flex;flex-direction:column;overflow:hidden;background:#111524}
.wardrobe-stage{flex:1;min-height:0;position:relative;isolation:isolate;overflow:hidden;background:#343747;border-bottom:2px solid #c2b0f650;z-index:3;box-shadow:0 9px 18px #080b1b66}
.wardrobe-backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 67%;image-rendering:pixelated;z-index:-3;pointer-events:none}
.wardrobe-stage-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,#10142690,transparent 35%,#10142630 85%,#10142675);pointer-events:none}
.wardrobe-stage-title{position:absolute;left:20px;top:17px;z-index:2;pointer-events:none;text-shadow:0 1px 5px #111424}
.wardrobe-stage-title .eyebrow{font-size:8px;color:#fff0d6;letter-spacing:.11em}
.wardrobe-stage h1{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.wardrobe-status{position:absolute;right:14px;top:18px;max-width:135px;padding:6px 8px;background:#111424dc;color:var(--teal);font:8px/1.4 monospace;border:1px solid #9dd5bf50;z-index:4;text-align:center;border-radius:3px}
.wardrobe-doll{position:absolute;left:50%;bottom:-1%;transform:translateX(-50%);height:92%;max-height:calc(min(100vw,480px) * 2);aspect-ratio:2/3;pointer-events:none;z-index:1}
.wardrobe-doll img,.wardrobe-doll svg{position:absolute;image-rendering:pixelated;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-select:none}
.doll-body{inset:0;width:100%;height:100%;z-index:1}
.doll-hat{z-index:2;left:50%;transform:translateX(-50%);width:66%;top:-4%;height:18%}
.doll-hat.hat-straw{width:50%;top:-9%;height:23%}
.doll-hat.hat-blossom{width:12%;height:11%;top:14%;left:63%;transform:rotate(8deg)}
.doll-prop{z-index:3;left:59%;top:27%;width:23%;height:18%}
.doll-prop.prop-peach{width:17%;height:12%;left:60%;top:32.5%}
.doll-prop.prop-lantern{width:24%;height:32%;left:59%;top:44%}
.doll-shadow{position:absolute;bottom:4%;left:50%;width:24%;height:5%;transform:translateX(-50%);background:#18172b65;clip-path:polygon(15% 0,85% 0,85% 20%,100% 20%,100% 80%,85% 80%,85% 100%,15% 100%,15% 80%,0 80%,0 20%,15% 20%)}
.wardrobe-expand{position:absolute;inset:0;width:100%;padding:0;z-index:2;text-align:left}
.wardrobe-expand-label{position:absolute;left:13px;bottom:12px;display:flex;align-items:center;gap:6px;min-height:36px;padding:7px 10px;background:#111424df;border:1px solid #c2b0f670;border-radius:3px;font-size:9px;color:#e7dcfa}
.wardrobe-expand-label svg{width:13px;height:13px}
.wardrobe-expand:focus-visible{outline-offset:-4px}
.wardrobe-workbench{height:152px;flex:none;overflow-y:auto;overscroll-behavior:contain;padding:0 12px 10px;scroll-padding-top:44px;scrollbar-width:thin;scrollbar-color:#494158 transparent}
.wardrobe-intro{display:none}
.wardrobe-intro small{font:8px/1.5 monospace;color:var(--muted)}
.wardrobe-categories{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin-bottom:6px;padding:2px;background:#0c101f;border:1px solid #373850;border-radius:5px;position:sticky;top:0;z-index:4;box-shadow:0 5px 10px #111524}
.wardrobe-categories button{min-height:32px;font-size:10px;color:var(--muted);padding:5px 3px;border-radius:3px}
.wardrobe-categories button.active{background:#3b334f;color:#e2d0ff;box-shadow:inset 0 -2px #ac95db}
.wardrobe-rack{display:grid;grid-auto-flow:column;grid-auto-columns:94px;gap:7px;margin-bottom:12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#75668d #151a2b;padding:1px 1px 6px}
.wardrobe-piece{min-width:0;padding:0 0 5px;text-align:left;border:1px solid #3b3d55;border-radius:4px;background:#1a2032;overflow:hidden;scroll-snap-align:start}
.wardrobe-piece.selected{border-color:var(--lav);box-shadow:0 0 0 1px #c2b0f640}
.wardrobe-thumb{height:50px;display:flex;position:relative;align-items:center;justify-content:center;background:repeating-linear-gradient(135deg,transparent 0 8px,#c2b0f604 8px 9px),#23283d;overflow:hidden;margin-bottom:5px}
.wardrobe-thumb>img{height:95%;width:90%;object-fit:contain;image-rendering:pixelated}
.wardrobe-thumb.outfit>img{height:116%;width:100%;transform:translateY(4%)}
.wardrobe-thumb.hat>img,.wardrobe-thumb.prop>img{height:85%;width:85%}
.wardrobe-thumb.scene>img{height:100%;width:100%;object-fit:cover;object-position:center 65%}
.wardrobe-thumb>svg{width:27px;height:27px;color:#bba4dd80}
.piece-check{position:absolute;right:5px;bottom:5px;display:flex;align-items:center;justify-content:center;width:18px;height:18px;background:#181b2eed;color:var(--lav);border:1px solid #c2b0f680;border-radius:2px}
.piece-check svg{width:11px;height:11px}
.piece-lock{position:absolute;right:5px;top:5px;display:flex;align-items:center;justify-content:center;width:17px;height:17px;background:#111424e0;color:var(--gold);border:1px solid #e9c98a50;border-radius:2px}.piece-lock svg{width:10px;height:10px}
.piece-name{display:block;font:11px/1.3 Georgia,serif;padding:0 7px;min-height:26px;color:#dfdaeb}
.piece-cost{display:block;font:8px/1.5 monospace;color:var(--gold);padding:3px 8px 0}
.wardrobe-piece.owned .piece-cost{color:var(--teal)}
.wardrobe-detail{border-top:1px solid #49405e;border-bottom:1px solid #34384f;padding:15px 0 5px}
.wardrobe-detail-top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.wardrobe-detail h2{font:23px/1.2 Georgia,serif}
.wardrobe-detail-top>span{font:9px/1.4 monospace;color:var(--gold);white-space:nowrap}
.wardrobe-detail>p{font:12px/1.65 Georgia,serif;color:var(--muted);margin:8px 0 13px}
.wardrobe-detail .pixel-btn{font-size:12px;min-height:45px;padding:12px;width:100%}
.wardrobe-detail .pixel-btn:disabled{opacity:.7}
.wardrobe-shortfall{display:block;font:9px/1.5 monospace;color:var(--gold);margin:9px 0 2px;text-align:center}
.wardrobe-word{display:flex;align-items:center;gap:10px;min-height:51px;margin-top:4px;color:var(--lav)}
.wardrobe-word>span:first-child{font:20px/1.5 serif}
.wardrobe-word>span:nth-child(2){font-size:10px;color:var(--muted);flex:1}
.wardrobe-word .icon-btn{min-width:38px;min-height:38px}
.wardrobe-word svg{width:16px;height:16px}
.wardrobe-help{font-size:10px;color:var(--muted);line-height:1.8;margin:16px 0 6px}
.wardrobe-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:0}
.wardrobe-bottom .text-btn{font-size:10px;padding:8px 0}
.wardrobe-storage{font-size:11px;color:var(--rose);margin:8px 0}
.wardrobe-purchase{flex:none;display:flex;align-items:center;gap:12px;min-height:61px;padding:6px 17px;background:#191c30;border-top:1px solid #5b4e73;box-shadow:0 -4px 18px #080b1b60;z-index:4}
.wardrobe-purchase>div{flex:1;min-width:0}.wardrobe-purchase>div>span{display:block;font:15px/1.2 Georgia,serif}.wardrobe-purchase small{display:block;font:8px/1.5 monospace;color:var(--muted);margin-top:4px}
.wardrobe-purchase .pixel-btn{width:auto;min-width:155px;min-height:44px;font-size:11px;gap:6px;padding:11px 12px}.wardrobe-purchase .pixel-btn svg{width:16px;height:16px}.wardrobe-purchase .pixel-btn:disabled{opacity:.65}
@media(max-width:370px){.wardrobe-stage-title{left:16px}.wardrobe-status{right:12px;max-width:105px;font-size:7px}.wardrobe-categories button{font-size:9px}.wardrobe-rack{gap:7px}}
@media(max-height:700px){.wardrobe-workbench{height:138px}.wardrobe-thumb{height:42px}.wardrobe-stage-title{top:11px}.wardrobe-status{top:11px}.wardrobe-purchase{min-height:57px;padding-top:5px;padding-bottom:5px}}
.large-text .wardrobe-workbench{height:180px}.large-text .wardrobe-categories button{font-size:12px}.large-text .piece-name{font-size:14px}.large-text .wardrobe-detail>p{font-size:14px}

.wardrobe-doll svg{overflow:hidden;stroke:none;fill:none}

/* The full-height view always uses owned, equipped layers. */
.modal-sheet[data-modal-type="wardrobe-art"]{height:100%;max-height:none;border:0;border-radius:0;padding-top:calc(var(--ios-top-inset,env(safe-area-inset-top,0px)) + var(--ios-blur-clearance,0px));background:#111524}
.modal-sheet[data-modal-type="wardrobe-art"] .modal-grip{display:none}
.modal-sheet[data-modal-type="wardrobe-art"] .modal-head{min-height:54px;padding:6px 14px 6px 20px}
.modal-sheet[data-modal-type="wardrobe-art"] .modal-head h2{font-size:19px}
.modal-sheet[data-modal-type="wardrobe-art"] .modal-body{flex:1;display:flex;padding:0;overflow:hidden}
.wardrobe-portrait{position:relative;flex:1;min-height:0;isolation:isolate;overflow:hidden;background:#343747}
.wardrobe-portrait-caption{position:absolute;inset:auto 0 0;z-index:4;pointer-events:none;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:20px 16px 12px;background:linear-gradient(transparent,#111424b0);text-shadow:0 1px 4px #111424}
.wardrobe-portrait-caption span{font:16px/1.3 Georgia,serif}.wardrobe-portrait-caption small{font:8px/1.5 monospace;color:#eee0fc;text-align:right}