/* Tale-World single player 3D profile — V18 SAFE
   This is additive only. The normal profile-v14 layout remains the fallback. */

.profile-identity.profile3d-ready-layout{
  align-items:center;
}
.profile3d-stage{
  position:relative;
  width:310px;
  height:360px;
  flex:0 0 310px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  margin-right:8px;
  isolation:isolate;
}
.profile3d-model{
  position:absolute;
  inset:0;
  z-index:3;
  overflow:hidden;
  border-radius:24px;
}
.profile3d-model canvas{
  display:block!important;
  width:100%!important;
  height:100%!important;
}
.profile3d-loader{
  position:absolute;
  inset:0;
  z-index:5;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:9px;
  color:rgba(222,231,243,.72);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.12em;
  pointer-events:none;
}
.profile3d-loader i{
  width:24px;
  height:24px;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.12);
  border-top-color:#e9bf5b;
  animation:tw-profile-spin .9s linear infinite;
}
@keyframes tw-profile-spin{to{transform:rotate(360deg)}}
.profile3d-fallback{
  position:absolute;
  inset:0;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:opacity .24s ease,visibility .24s ease;
}
.profile3d-fallback .profile-avatar-wrap{
  margin:0;
}
.profile3d-floor{
  position:absolute;
  left:15%;
  right:15%;
  bottom:18px;
  height:22px;
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(239,197,90,.24),rgba(72,116,177,.12) 45%,transparent 72%);
  filter:blur(7px);
  z-index:1;
}
.profile3d-stage.loaded .profile3d-loader{display:none}
.profile3d-stage.loaded .profile3d-fallback{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
.profile3d-stage.failed .profile3d-loader{display:none}
.profile3d-stage.failed .profile3d-fallback{
  opacity:1;
  visibility:visible;
}
.profile3d-stage.loaded .profile3d-rank{
  position:absolute;
  left:14px;
  top:14px;
  z-index:7;
  min-width:52px;
  height:38px;
  padding:0 13px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  border:1px solid rgba(233,191,91,.45);
  background:rgba(10,16,27,.8);
  color:#f6d679;
  font-weight:900;
  box-shadow:0 8px 25px rgba(0,0,0,.22);
}
.profile3d-note{
  color:rgba(197,210,229,.62);
  font-size:11px;
  margin-top:10px;
}
@media(max-width:900px){
  .profile3d-stage{display:none!important}
}