@import url('./v4.css');
.buddy-portrait{display:inline-block;position:relative;width:100%;aspect-ratio:1;background-size:300% 200%;background-repeat:no-repeat;vertical-align:middle;filter:drop-shadow(0 8px 7px #81784c1c)}
.buddy-card{flex-direction:column;gap:0;padding:9px 9px 14px;text-align:center;background:linear-gradient(145deg,#fff9ed,#e9efdb);overflow:hidden;border-radius:16px}.buddy-card.active{background:linear-gradient(145deg,#fff6dd,#e5edcb)}.buddy-card>.buddy-portrait{width:min(100%,148px);flex-shrink:0}.buddy-card strong{font-size:14px}.buddy-card small{font-size:10px}.buddy-card.active::after{font-size:8px;z-index:1}.party-grid{gap:12px}.party-links{display:flex;align-items:center;gap:16px}.party-links .text-button{font-size:11px;color:#768953}.pet-stage{height:242px;background:radial-gradient(ellipse at center,#f8edd0 0%,#f0f1df 45%,transparent 72%)}.pet-stage>.buddy-portrait{width:245px;height:245px}.portrait-gallery-link{display:block;margin:-8px auto 14px;font-size:10px}.portrait-accessory{position:absolute;bottom:5px;left:50%;transform:translateX(-50%);background:#fff9ebd9;border:1px solid #c4cfab;padding:3px 7px;border-radius:20px;font-size:8px;font-style:normal;white-space:nowrap}.reward-art>.buddy-portrait{width:160px}.evolution-art>div{width:155px;height:155px}.evolution-art .buddy-portrait{width:100%;height:100%}.expression-happy{animation:portrait-bounce .7s ease-in-out}.pet-stage.sleep .buddy-portrait{filter:drop-shadow(0 8px 7px #81784c1c) brightness(.94)}
.gallery-dialog{width:min(860px,calc(100vw - 30px));max-width:860px;padding:30px;border-radius:22px;background:#f8f8ed;max-height:92vh;overflow:auto}.gallery-dialog h2{margin:10px 0 18px;text-align:left;font-size:25px}.gallery-picks{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}.gallery-picks button,.gallery-forms button,.gallery-controls button{border:1px solid #d4dbc4;border-radius:9px;background:#edf0e1;padding:10px 12px;color:#657c57;font:inherit;font-size:12px;cursor:pointer}.gallery-picks [aria-pressed=true],.gallery-forms [aria-pressed=true]{background:#dce6c8;border-color:#9dad78;color:#506a43}.gallery-forms{display:flex;justify-content:center;gap:8px;margin:18px 0}.gallery-forms button{min-width:80px}.gallery-art{display:grid;grid-template-columns:1fr 1fr;gap:14px}.gallery-illustration,.gallery-model{position:relative;min-width:0;aspect-ratio:1;border-radius:16px;overflow:hidden;background:radial-gradient(ellipse at center,#fff9ea,#eeebd8);border:1px solid #e4e1c9}.gallery-illustration{display:grid;place-items:center}.gallery-illustration .buddy-portrait{width:100%}.gallery-caption{position:absolute;top:14px;left:14px;color:#839070;font-size:10px;letter-spacing:.7px;z-index:1}.gallery-model canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}.gallery-controls{display:flex;gap:6px;position:absolute;bottom:12px;left:50%;transform:translateX(-50%);white-space:nowrap}.gallery-controls button{background:#fffbeddb;padding:7px 11px;font-size:10px}.gallery-note{font-size:11px!important;color:#97a183;line-height:1.8;margin:18px 0 0!important}.gallery-dialog .dialog-close{z-index:2}.gallery-dialog::backdrop{background:#1c302acc;backdrop-filter:blur(4px)}
@keyframes portrait-bounce{50%{transform:translateY(-7px) rotate(-3deg)}}
@media(max-width:900px){.party-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.buddy-card>.buddy-portrait{width:130px}.gallery-dialog{padding:24px}.gallery-art{gap:10px}}
@media(max-width:560px){.party-grid{gap:8px}.buddy-card{padding:5px 5px 11px;min-height:155px;border-radius:12px}.buddy-card>.buddy-portrait{width:100%}.buddy-card small{font-size:8px;line-height:1.4}.buddy-card strong{font-size:11px}.party-heading{align-items:flex-start;gap:8px}.party-heading>.eyebrow{max-width:140px;line-height:1.7}.party-links{gap:7px;flex-direction:column;align-items:flex-end}.party-links .text-button{font-size:10px}.gallery-dialog{width:calc(100vw - 20px);padding:20px 16px}.gallery-dialog h2{font-size:20px}.gallery-picks{gap:4px}.gallery-picks button{padding:8px 0;font-size:10px}.gallery-art{grid-template-columns:1fr}.gallery-illustration{aspect-ratio:1.5}.gallery-illustration .buddy-portrait{width:68%}.gallery-model{aspect-ratio:1.1}.gallery-caption{top:10px;left:10px}.gallery-forms{margin:13px 0}.gallery-note{font-size:10px!important}.pet-stage{height:240px}}
@media(prefers-reduced-motion:reduce){.expression-happy{animation:none}}

#gallery-portrait{width:100%;height:100%;display:grid;place-items:center}.gallery-illustration .buddy-portrait{max-width:100%}@media(max-width:560px){.gallery-illustration .buddy-portrait{width:68%}}
.gallery-illustration .art-loading{opacity:0}

/* Keep the portrait square and centered within the experience card at every width. */
.companion-panel{min-width:0}
.companion-panel .pet-stage{width:100%;min-width:0;height:auto;aspect-ratio:1;padding:12px;display:grid;place-items:center;margin:8px 0 0;box-sizing:border-box}
.companion-panel .pet-stage>.buddy-portrait{display:block;width:100%;max-width:100%;min-width:0;height:auto;aspect-ratio:1;margin:0;animation:none}
.companion-panel .portrait-gallery-link{margin:4px auto 14px;max-width:100%;line-height:1.7}

/* Fit each complete alpha silhouette, including details outside its old atlas cell. */
.buddy-portrait{background:none;clip-path:none}
.buddy-portrait>.portrait-art,.pet-stage .buddy-portrait>.portrait-art,.evolution-art .buddy-portrait>.portrait-art{display:block;width:100%;height:100%;animation:none;transform:none;filter:none}
.portrait-loading>.portrait-art{visibility:hidden}
.portrait-loading::before,.portrait-unavailable::before{position:absolute;inset:0;display:grid;place-items:center;content:'立绘加载中…';color:#94a080;font-size:10px}
.portrait-unavailable::before{content:'立绘暂时无法加载，请刷新页面'}
.pet-stage::after{display:none}
