*, html, body   {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

/* Отключение выделения текста */
* {
  -webkit-touch-callout: none; /* для iOS Safari */
  -webkit-user-select: none;   /* Chrome, Safari, Opera */
  -khtml-user-select: none;    /* старый Konqueror */
  -moz-user-select: none;      /* Firefox */
  -ms-user-select: none;       /* IE/Edge */
  user-select: none;           /* стандарт */
}

/* Дополнительно для кнопок и интерактивных элементов можно отключить внешнее выделение при нажатии */
.openAdminModal, .dwn, button {
  -webkit-tap-highlight-color: transparent; /* отключить подсветку при тапе на мобильных */
  outline: none;  /* убрать контур фокуса (если нужно) */
}

main    {
    margin-top: 25px;
}

button  {
    margin-top: 20px;
}

.music__box {
    width: 90%;
    height: auto;
    max-height: 100vh; /* максимальная высота как высота окна */
    margin: 0 auto;
    padding: 12px 5px;
    border-radius: 25px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: #ccbbbb;
    overflow-y: auto;  /* вертикальный скролл при переполнении */
}

.music__container   {
    width: 95%;
    height: 40px;
    border-radius: 50px;
    background: #fefefe;
    padding: 35px 5px;
    padding-left: 17px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.music__container:not(:first-child) {
    margin-top: 10px;
}

.left   {
    display: flex;
    width: auto;
    justify-content: left;
    align-items: center;
}

.left > .music__dsc {
    margin-left: 10px;
}

.player {
    font-size: 26px;
    margin-left: 15px;
    cursor: pointer;
    display: flex;
    align-items: center;
}

.player > img   {
    width: 38px;
    height: 38px;
    background-color: #fff;
    border-radius: 100%;
    padding: 1px 5px;
}
.music__dsc > .name {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 2px;
    font-family: "Roboto";
    cursor: default;
}

.music__dsc > .author {
    font-size: 10px;
    margin-top: 10px;
    cursor: default;
}

.music__add {
    width: 100px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #19f0;
}

.music__add > .dwn {
    color: black;
    cursor: pointer;
    transition: opacity 0.5s ease;
    margin-right: 15px;
}

.music__add > .time {
    width: 150px;
    font-family: "Roboto";
    cursor: default;
    letter-spacing: 0.1px;
    margin-right: 15px;
    text-overflow: ellipsis
}

@media(max-width: 768px)    {
    .music__box {
    width: 95%;
}
}

@media(max-width: 425px) {
    .music__box {
    width: 100%;
    border-radius: 0px;
    }
    .music__container   {
        width: 90%;
        margin: 0 auto;
    }

    .music__add > .dwn  {
        margin-right: 150px;
    }

    main    {
    margin-top: 0px;
    }
}

@media(max-width: 375px)    {
    .music__box {
    width: 100%;
    border-radius: 0px;
    }
    .music__container   {
        width: 95%;
        margin: 0 auto;
    }
    main    {
        margin-top: 0px;
    }
    .left   {
        width: 200px;
    }
}  
