.portrait{position:relative;border-radius:12px;-o-object-fit:cover;object-fit:cover;box-shadow:-3px 2px 8px #0009,-2px 8px 12px #0003,-2px 2px #000c}.portrait-standard{height:120px;width:120px}.portrait-dialogue{cursor:pointer;transition-property:all;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1);animation-duration:.15s;animation-timing-function:cubic-bezier(.4,0,.2,1);will-change:width,height,transform;transform-origin:left center}.portrait-dialogue-expanded{height:280px;width:300px;max-width:100%;transform:translateZ(0)}.portrait-dialogue-collapsed{height:160px;width:160px}@media (min-width: 768px){.portrait-dialogue-collapsed{height:140px;width:140px}}.portrait-dialogue-collapsed{transform:translateZ(0)}.portrait-status{z-index:10;cursor:pointer;transition-property:all;transition-duration:.3s;transition-timing-function:cubic-bezier(.4,0,.2,1);animation-duration:.3s;animation-timing-function:cubic-bezier(.4,0,.2,1);box-shadow:-3px 2px 8px #0009,-2px 8px 12px #0003,-2px 2px #000c}.portrait-status-expanded-view{height:4rem;width:4rem}.portrait-status-expanded{height:12rem;width:12rem;flex-shrink:0}.portrait-combat{height:4rem;width:4rem;flex-shrink:0}.image-skeleton{position:relative;border-radius:.375rem;background:radial-gradient(120% 120% at 100% 0%,hsl(var(--golden) / .05),transparent 40%),radial-gradient(120% 120% at 0% 100%,hsl(var(--golden) / .04),transparent 35%),linear-gradient(135deg,#0c0c0e,#121216,#0c0c0e);background-size:100% 100%,100% 100%,300% 300%;animation:imageColorShift 10s ease-in-out infinite;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff0a,inset 0 0 0 2px hsl(var(--golden) / .05)}.image-skeleton:before{content:"";position:absolute;top:-40%;right:-40%;bottom:-40%;left:-40%;background:linear-gradient(60deg,transparent 45%,hsl(var(--golden) / .14) 50%,transparent 55%);transform:translate(-100%);animation:imageShimmer 2.2s cubic-bezier(.4,0,.2,1) infinite;pointer-events:none}.image-skeleton:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:radial-gradient(50% 80% at 50% 100%,rgba(0,0,0,.6),transparent 70%),repeating-linear-gradient(0deg,rgba(255,255,255,.02),rgba(255,255,255,.02) 2px,transparent 2px,transparent 4px);mix-blend-mode:normal;pointer-events:none}.portrait-skeleton{position:relative;border-radius:.375rem;background:radial-gradient(120% 120% at 100% 0%,hsl(var(--golden) / .05),transparent 40%),radial-gradient(120% 120% at 0% 100%,hsl(var(--golden) / .04),transparent 35%),linear-gradient(135deg,#0c0c0e,#121216,#0c0c0e);background-size:100% 100%,100% 100%,300% 300%;animation:imageColorShift 10s ease-in-out infinite;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff0a,inset 0 0 0 2px hsl(var(--golden) / .05)}.portrait-skeleton:before{content:"";position:absolute;top:-40%;right:-40%;bottom:-40%;left:-40%;background:linear-gradient(60deg,transparent 45%,hsl(var(--golden) / .14) 50%,transparent 55%);transform:translate(-100%);animation:imageShimmer 2.2s cubic-bezier(.4,0,.2,1) infinite;pointer-events:none}.portrait-skeleton:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:radial-gradient(50% 80% at 50% 100%,rgba(0,0,0,.6),transparent 70%),repeating-linear-gradient(0deg,rgba(255,255,255,.02),rgba(255,255,255,.02) 2px,transparent 2px,transparent 4px);mix-blend-mode:normal;pointer-events:none}@keyframes imageShimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes imageColorShift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}@keyframes portraitShimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes portraitColorShift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}