/* Painterly companion portraits with independent wardrobe and growth layers. */
.illustrated-companion{overflow:visible;filter:drop-shadow(0 8px 12px #4737631a)}
.illustrated-companion .pet-breathe{animation:none}
.illustrated-companion .portrait-frame{transition:stroke .25s ease}
.illustrated-companion.stage-4{filter:drop-shadow(0 0 10px #ecd49c80)}
.dex-card .dex-art{height:215px;min-height:215px;padding:5px;background:radial-gradient(ellipse,#ffffff,#f4eff9 74%);border-radius:22px;overflow:hidden}
.dex-card .dex-art>.pet-svg,.dex-card .dex-art .pet-silhouette,.dex-card .dex-art .pet-silhouette>.pet-svg{width:100%;height:100%;max-width:none}
.dex-chapter{font-size:12px;line-height:1.5;font-weight:700;color:#806899;margin:6px 0}
.dex-card p{line-height:1.55}
/* Keep only a high-contrast hint of a locked portrait; hide costume and stage decorations. */
.pet-silhouette:has(.illustrated-companion){filter:none!important;opacity:.48}
.pet-silhouette .illustrated-companion{filter:none;mix-blend-mode:multiply}
.pet-silhouette .illustrated-companion .portrait-frame{fill:#fff;stroke:none}
.pet-silhouette .companion-illustration{filter:grayscale(1) brightness(.51) contrast(100)}
.pet-silhouette .companion-wardrobe{display:none}
.pet-option .illustrated-companion{width:100%;height:145px}
/* The portrait reserves its real square height so XP can never sit beneath it. */
#petPortrait{display:block;width:min(100%,220px);height:auto;aspect-ratio:1;margin:8px auto 18px;position:relative;contain:layout paint;flex:none}
#petPortrait>.illustrated-companion{display:block;width:100%;max-width:100%;height:100%;overflow:hidden}
.pet-card .pet-progress{position:relative;clear:both;margin-top:0}
.pet-card .pet-progress>div:first-child{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 12px}
.pet-card #petNext{display:block;line-height:1.5;margin:8px 0 14px;overflow-wrap:anywhere}
.atelier-particle{transform-box:fill-box;transform-origin:center;animation:atelier-shimmer 4s ease-in-out infinite;animation-delay:var(--particle-delay,0s)}
.fashion-art .atelier-particle,.dex-art .atelier-particle{animation:none}
@keyframes atelier-shimmer{0%,100%{opacity:.7}50%{opacity:1}}
@media(prefers-reduced-motion:reduce){.atelier-particle{animation:none}}
.fashion-card{border-color:#e4d8ee}
.fashion-card .fashion-art{background:radial-gradient(ellipse at 50% 45%,#fffdf9 30%,#f1eaf8);height:180px}
.fashion-card.trying{box-shadow:0 0 0 2px #ac88d2,0 8px 24px #6b4c9320}
@media(max-width:640px){#petPortrait{width:min(100%,200px)}.fashion-card .fashion-art{height:160px}}
.boutique-art .illustrated-companion,.profile-art .illustrated-companion{width:min(100%,360px);height:auto;aspect-ratio:1}
.grammar-fighter-pet .illustrated-companion,.runner-solo-pet .illustrated-companion{filter:drop-shadow(0 6px 8px #24364a30)}
@media(max-width:640px){.dex-card .dex-art{height:170px;min-height:170px}.dex-chapter{font-size:11px}.pet-option .illustrated-companion{height:125px}}
@media(prefers-reduced-motion:reduce){.illustrated-companion .portrait-frame{transition:none}}

/* Detail medallions make the new accessory artwork visible beside its live fit. */
.fashion-card .fashion-art{display:grid;grid-template-columns:minmax(0,1fr) 68px;align-items:center;gap:4px;padding:22px 10px 8px}
.fashion-card .fashion-art>.pet-svg{min-width:0;width:100%;height:100%}
.fashion-detail{width:68px;height:76px;display:grid;place-items:center;padding:5px;border:1px solid #ddcba4;border-radius:20px;background:radial-gradient(circle at 35% 25%,#fffefa,#f5eedc);box-shadow:0 4px 10px #806e9414}
.fashion-detail .fashion-detail-svg{display:block;width:100%;height:100%;overflow:visible}
.fashion-detail .atelier-particle{animation:none}
@media(max-width:640px){.fashion-card .fashion-art{grid-template-columns:minmax(0,1fr) 50px;padding-inline:6px}.fashion-detail{width:50px;height:62px;padding:3px;border-radius:14px}}