/* ------------------------------ */
/* ------------------------------ */
/* SPACES */
.Spaces {
   position: relative;
   display: grid;
   grid-template-columns: calc(200px * var(--scale)) auto;
   gap: calc(20px * var(--scale));
   width: 100%;
   height: auto;
   overflow: visible;
   background-color: var(--background-c);
   border: calc(10px * var(--scale)) solid var(--background-c);
   border-radius: calc((var(--border-radius-2) * var(--scale)));
}

.Spaces .image {
   display: block;
   width: calc(200px * var(--scale));
   height: auto;
   aspect-ratio: 6 / 5;
   overflow: visible;
   padding: calc(0px * var(--scale));
}

.Spaces .info {
   display: flex;
   flex-direction: column;
   gap: 0px;
   width: 100%;
   height: auto;
   overflow: visible;
}

.Spaces .name {
   display: block;
   width: 100%;
   height: calc(66px * var(--scale));
   overflow: visible;
   color: var(--text-color-a);
   font-size: calc(var(--font-size-5) * var(--scale));
   font-weight: var(--font-weight-4);
   line-height: calc(66px * var(--scale));
}

.Spaces .by {
   display: flex;
   flex-direction: row;
   gap: calc(15px * var(--scale));
   width: 100%;
   height: calc(50px * var(--scale));
   overflow: visible;
}

.Spaces .by-image {
   display: flex;
   justify-content: center;
   align-items: center;
   height: calc(40px * var(--scale));
   aspect-ratio: 6 / 5;
   overflow: visible;
   border-radius: calc((var(--border-radius-2) * var(--scale)));
}

.Spaces .by-username {
   display: flex;
   justify-content: start;
   align-items: center;
   width: auto;
   height: calc(40px * var(--scale));
   color: var(--text-color-a);
   font-size: var(--font-size-3);
   font-weight: var(--font-weight-3);
}

.Spaces .details {
   display: flex;
   flex-direction: row;
   justify-content: start;
   align-items: center;
   width: 100%;
   height: calc(40px * var(--scale));
   padding-right: calc(30px * var(--scale));
   color: var(--text-color-a);
   font-size: calc(var(--font-size-3) * var(--scale));
   font-weight: var(--font-weight-2);
}

.Spaces .details .subscribers {
   margin-left: auto;
}