#woph-wardrobe{position:fixed;inset:0;margin:0;width:100%;height:100%;max-width:none;max-height:none;padding:0;border:0;background:#fff5de;color:#3e3c53;font-family:Fredoka,system-ui,sans-serif}.wardrobe-shell{max-width:1100px;margin:auto;padding:18px;box-sizing:border-box}.wardrobe-shell header{display:flex;align-items:center;gap:12px}.wardrobe-shell header h1{font-size:clamp(19px,4vw,28px);flex:1}.wardrobe-shell button{font-family:inherit;cursor:pointer;color:inherit;border:2px solid #e4d8c8;background:#fff;border-radius:22px;min-height:64px;padding:10px 14px;font-size:15px}.wardrobe-shell header button{width:64px;flex-shrink:0}.wardrobe-shell header svg{width:26px;height:26px}.wardrobe-coins{padding:14px 16px;border-radius:24px;background:#ffe4a1;white-space:nowrap;font-size:17px}.wardrobe-layout{display:grid;grid-template-columns:1fr 1fr;gap:24px}.wardrobe-pet model-viewer{display:block;width:100%;height:410px;background:radial-gradient(#fffdf4,#f7dfb1);border-radius:32px;--poster-color:transparent}.wardrobe-pet>p{text-align:center;font-size:14px}.wardrobe-styles{display:flex;gap:8px}.wardrobe-styles button{flex:1}.wardrobe-equipped{display:flex;flex-wrap:wrap;gap:8px}.wardrobe-equipped button{font-size:13px;min-height:48px}.wardrobe-shop nav{display:flex;gap:7px;overflow:auto;padding:12px 0}.wardrobe-shop nav button{flex-shrink:0;font-size:13px;min-height:54px}.wardrobe-shell button[aria-pressed=true]{border-color:#8267bd;background:#ede3ff}.wardrobe-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.wardrobe-item{display:flex;align-items:center;flex-direction:column;gap:8px;min-height:145px!important}.wardrobe-item small{border-radius:14px;background:#fff0c4;padding:6px 10px}.wardrobe-swatch{width:76px;height:64px;display:grid;place-items:center;background:#f7f2e9;border-radius:20px}.wardrobe-swatch svg{width:54px;height:54px}.wardrobe-status{min-height:40px;line-height:1.5;font-size:15px}.wardrobe-note{font:13px/1.5 Andika,system-ui,sans-serif;color:#716776}.wardrobe-confirm{position:sticky;bottom:10px;border:3px solid #b99be4;border-radius:24px;padding:14px;background:#fff;box-shadow:0 6px 20px #49385722}.wardrobe-confirm[hidden]{display:none}.wardrobe-confirm button{margin:4px;min-height:64px}.wardrobe-confirm [data-wardrobe=buy]{background:#7656b6;color:#fff}.wardrobe-shell button:active{transform:scale(.97)}.wardrobe-shell button:focus-visible{outline:3px solid #5678aa;outline-offset:2px}.wardrobe-home-button{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:80px;border:2px solid #ddc5f1;border-radius:26px;background:#f1e3ff;color:#4d3e70;padding:16px 20px;margin:18px 0;font:600 18px Fredoka,system-ui,sans-serif;gap:12px}.wardrobe-home-button small{font-size:14px}.wardrobe-earned{font-weight:700;color:#765124}@media(max-width:700px){.wardrobe-layout{grid-template-columns:1fr;gap:8px}.wardrobe-pet model-viewer{height:300px}.wardrobe-shell{padding:12px}.wardrobe-coins{font-size:14px;padding:12px}.wardrobe-shell header{gap:8px}.wardrobe-pet>p{margin:8px}.wardrobe-equipped{margin-top:8px}.wardrobe-shell header h1{font-size:21px}.wardrobe-styles button{min-height:64px}}@media(prefers-reduced-motion:reduce){.wardrobe-shell button:active{transform:none}}

.wardrobe-swatch{width:100%;height:108px;background:#fff6df}.wardrobe-swatch img{width:100%;height:100%;object-fit:contain;border-radius:18px}.wardrobe-shell button:disabled{opacity:.5;cursor:default;transform:none}.wardrobe-confirm small{display:block;line-height:1.5;margin-bottom:6px}
.wardrobe-item .wardrobe-swatch{height:112px;min-height:112px;max-height:112px;overflow:hidden;flex:none;display:flex;align-items:center;justify-content:center}.wardrobe-item .wardrobe-swatch img{display:block;width:100%;height:100px!important;min-height:0;max-height:100px!important;object-fit:contain;flex:none}.wardrobe-item{overflow:hidden;justify-content:flex-start}.wardrobe-item strong{line-height:1.3;min-height:20px}.wardrobe-item .wardrobe-swatch+strong{margin-top:4px}
.wardrobe-layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.wardrobe-pet,.wardrobe-shop{min-width:0}.wardrobe-styles button{min-width:0;white-space:normal}.wardrobe-items{min-width:0}.wardrobe-shell header h1{min-width:0}.wardrobe-shop nav{max-width:100%;box-sizing:border-box}.wardrobe-item{min-width:0}.wardrobe-item strong{overflow-wrap:anywhere}@media(max-width:700px){.wardrobe-layout{grid-template-columns:minmax(0,1fr)}.wardrobe-shell header h1{font-size:20px}.wardrobe-shell header button{width:56px;padding:10px}.wardrobe-styles{gap:6px}.wardrobe-styles button{font-size:14px}.wardrobe-coins{font-size:13px;padding:12px 10px}}
@media(max-width:700px){.wardrobe-confirm:not([hidden]){position:fixed;bottom:10px;left:10px;right:10px;z-index:8;box-shadow:0 -4px 28px #48315b30}.wardrobe-confirm p{margin:0 0 5px}.wardrobe-confirm button{min-height:60px}.wardrobe-shell:has(.wardrobe-confirm:not([hidden])){padding-bottom:180px}}
.pet-care{padding:16px;margin:14px 0;background:#fffaf0;border:2px solid #e8d7b9;border-radius:28px}.pet-name{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.pet-name h2{margin:0;flex:1;overflow-wrap:anywhere;font-size:24px}.pet-name button{font-size:14px;min-height:56px}.pet-name-form{margin:14px 0}.pet-name-form label{display:block;line-height:1.5}.pet-name-form input{box-sizing:border-box;width:100%;min-height:56px;border:2px solid #a58cc8;border-radius:16px;font:20px Andika,system-ui;padding:10px;margin:8px 0}.pet-name-form[hidden]{display:none}.pet-bubble{background:#eee5ff;color:#49376a;border-radius:22px;padding:14px;font:17px/1.5 Andika,system-ui}.pet-meters{display:grid;grid-template-columns:1fr 1fr;gap:14px}.pet-meters label{font-size:15px}.pet-meters span{display:block;font:14px Andika,system-ui}.pet-meters progress{display:block;width:100%;height:22px;accent-color:#519b73}.pet-care-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px}.pet-care-actions button{min-height:80px;font-size:15px;padding:10px 6px;background:#e8f4df;border-color:#b5d2a5}.pet-care-actions small{display:block;font:12px/1.5 Andika,system-ui;margin-top:6px}.pet-care-actions [data-care=rest]{background:#eee5ff;border-color:#c7b1e3}@media(max-width:370px){.pet-care-actions{grid-template-columns:1fr}.pet-name h2{font-size:22px}}
.pet-portrait{display:grid;place-items:center;overflow:hidden;border-radius:30px;background:#f8e5c5;min-height:380px}.wardrobe-shell .pet-sprite{display:block;width:260px;height:390px;max-width:100%;border:0;border-radius:24px;padding:0;background-color:transparent;background-repeat:no-repeat;background-size:200% 200%;background-position:0 0;transform-origin:50% 90%;cursor:pointer}@media(max-width:700px){.pet-portrait{min-height:340px}.wardrobe-shell .pet-sprite{width:226px;height:339px}}@media(prefers-reduced-motion:reduce){.pet-sprite.is-idle,.pet-sprite.is-eating,.pet-sprite.is-sleeping,.pet-sprite.pet-wave{animation:none}}
.wardrobe-shell[data-mode=pet]{max-width:600px}.wardrobe-shell[data-mode=pet] .wardrobe-layout{grid-template-columns:minmax(0,1fr)}.wardrobe-shell[data-mode=pet] .wardrobe-styles,.wardrobe-shell[data-mode=pet] .wardrobe-equipped,.wardrobe-shell[data-mode=pet] .wardrobe-pet>.wardrobe-note,.wardrobe-shell[data-mode=pet] .wardrobe-shop nav,.wardrobe-shell[data-mode=pet] .wardrobe-shop .wardrobe-items,.wardrobe-shell[data-mode=pet] .wardrobe-shop .wardrobe-status,.wardrobe-shell[data-mode=pet] .wardrobe-shop>.wardrobe-note{display:none}.wardrobe-mode{width:100%}

.wardrobe-shell .pet-sprite{position:relative;overflow:visible;isolation:isolate}.pet-sprite .pet-wearable{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:0!important;max-height:none!important;object-fit:contain;pointer-events:none;user-select:none;margin:0;border:0;border-radius:0}.wardrobe-shell[data-mode=pet] .wardrobe-equipped{display:flex}.wardrobe-equipped{margin-top:12px}.wardrobe-item .wardrobe-swatch{background:#fff3d9}.wardrobe-item[aria-pressed=true]{border-color:#8061b2}

.wardrobe-shell .pet-sprite{background-image:none!important}.pet-bare-body,.pet-face{position:absolute;inset:0;pointer-events:none;background-image:var(--pet-sheet);background-repeat:no-repeat;background-size:100% 100%;background-position:0 0;mask-repeat:no-repeat;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;-webkit-mask-size:100% 100%}.pet-bare-body{mask-image:var(--pet-base-mask);-webkit-mask-image:var(--pet-base-mask)}.pet-face{mask-image:var(--pet-head-mask);-webkit-mask-image:var(--pet-head-mask)}

.wardrobe-shell .pet-sprite:active{transform:none}.pet-sprite .pet-expression{position:absolute!important;inset:0;width:100%!important;height:100%!important;max-height:none!important;margin:0;object-fit:contain;pointer-events:none;opacity:0}.is-idle .pet-blink{animation:pet-eyelids 4.4s steps(1,end) infinite}.is-sleeping .pet-sleep,.is-eating .pet-eat-closed{opacity:1}.is-eating .pet-eat-open{animation:pet-mouth-frames .6s steps(1,end) infinite}.pet-sprite.pet-wave{animation:pet-greeting-light .6s ease-in-out}@keyframes pet-eyelids{0%,66%,73%,100%{opacity:0}68%,71%{opacity:1}}@keyframes pet-mouth-frames{0%,49%{opacity:0}50%,100%{opacity:1}}@keyframes pet-greeting-light{0%,100%{filter:brightness(1)}50%{filter:brightness(1.06)}}@media(prefers-reduced-motion:reduce){.pet-sprite.pet-wave,.pet-expression{animation:none!important}}

/* One registered 2:3 stage at every width; never clamp width while retaining an old height. */
.wardrobe-shell .pet-sprite{--pet-width:260px;width:min(var(--pet-width),100%);height:auto;aspect-ratio:2/3}
@media(max-width:700px){.wardrobe-shell .pet-sprite{--pet-width:226px}}

/* Care tools stay beside the target on a phone, rather than below a long report. */
.wardrobe-shell[data-mode=pet] .pet-portrait{position:relative;padding:12px 12px 112px;min-height:450px;isolation:isolate}
.pet-portrait::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(#102445cc,#152849b8);opacity:0;pointer-events:none;z-index:-1}
.pet-portrait[data-pet-sleeping=true]::before{opacity:1}
.pet-portrait[data-ambience=night]::before{animation:pet-nightfall .7s ease-out}
.pet-portrait[data-ambience=day]::before{animation:pet-daybreak .7s ease-out}
.pet-portrait[data-pet-sleeping=true] .pet-sprite{filter:brightness(.86) saturate(.86)}
.pet-night-moon{display:none;position:absolute;right:7%;top:7%;width:34px;height:34px;border-radius:50%;box-shadow:-9px 5px 0 0 #ffe7a0;pointer-events:none}
.pet-portrait[data-pet-sleeping=true] .pet-night-moon{display:block}
.wardrobe-shell .pet-action-dock{position:absolute;bottom:9px;left:10px;right:10px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;z-index:4;margin:0}
.wardrobe-shell .pet-action-dock button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-height:94px!important;padding:4px;border-radius:22px;background:#fff6e7f2;border:2px solid #e8c58b;touch-action:none;user-select:none;-webkit-user-select:none}
.wardrobe-shell .pet-action-dock button img{width:53px!important;height:53px!important;object-fit:contain;pointer-events:none;margin:0}
.wardrobe-shell .pet-action-dock button strong{font-size:15px;line-height:1.1}.wardrobe-shell .pet-action-dock button small{font-size:11px;line-height:1.2}
#woph-wardrobe[data-care-tool=brush] [data-care=brush],#woph-wardrobe[data-care-tool=carrot] [data-care=carrot]{border-color:#7970bc;background:#f3eaff}
.pet-dirt{position:absolute;pointer-events:none;transform:translate(-50%,-50%) rotate(var(--dirt-angle));border-radius:43% 55% 39% 54%;background:radial-gradient(ellipse at 38% 35%,#a7845a 15%,#806143bb 60%,#80614300 75%);transition:opacity .16s ease-out;box-shadow:8px -4px 0 -7px #8b6947,-8px 7px 0 -6px #9d7953}
.pet-mouth-target{display:none;position:absolute;left:42%;top:22%;width:38%;height:23%;box-sizing:border-box;border:3px dashed #ffd476;border-radius:50%;pointer-events:none;background:#fff9de18}
#woph-wardrobe[data-care-tool=carrot] .pet-mouth-target{display:block}
#woph-wardrobe[data-care-tool=brush] .pet-sprite{touch-action:none}
.pet-drag-ghost{position:fixed!important;width:100px!important;height:100px!important;object-fit:contain;transform:translate(-50%,-50%);pointer-events:none;z-index:100;filter:drop-shadow(0 5px 4px #2f283b44);user-select:none}
@keyframes pet-nightfall{from{opacity:0}to{opacity:1}}@keyframes pet-daybreak{from{opacity:1}to{opacity:0}}
@media(prefers-reduced-motion:reduce){.pet-portrait::before{animation:none!important}.pet-dirt{transition:none}}

.wardrobe-shell .pet-action-dock button{margin:0!important;box-sizing:border-box}.wardrobe-shell .pet-action-dock button img{max-width:none!important}
.wardrobe-shell[data-mode=pet] .pet-portrait{padding-bottom:124px}
.wardrobe-shell[data-mode=pet] .pet-action-dock button{height:102px;min-height:102px!important;padding:4px;gap:1px}
.wardrobe-shell[data-mode=pet] .pet-action-dock button img{width:53px!important;height:53px!important;margin:0}
