/* ==========================
   Player Info Desktop Fix
   Возраст / Рост / Вес / Позиция
========================== */

.player-info {
    position: relative;
    z-index: 20;
    margin-top: -54px;
    padding: 0 0 36px;
    background: #f7f8fa;
}

.player-info .site-container {
    position: relative;
    z-index: 20;
}

.player-info__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    align-items: stretch;

    background: #fff;
    border: 1px solid #ededed;
    border-radius: 18px;
    box-shadow: 0 16px 45px rgba(0,0,0,.06);

    overflow: hidden;
}

.player-info__item {
    position: relative;

    min-height: 88px;
    padding: 22px 28px 20px 84px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
}

.player-info__item:not(:last-child)::after {
    content: "";
    position: absolute;
    right: 0;
    top: 22px;
    width: 1px;
    height: 44px;
    background: #e6e6e6;
}

.player-info__item span {
    display: block;
    margin: 0 0 8px;

    font-size: 13px;
    line-height: 1;
    font-weight: 800;
    color: #777;
}

.player-info__item strong {
    display: block;

    font-size: 24px;
    line-height: 1.1;
    font-weight: 900;
    text-transform: uppercase;

    color: #111;
}

/* Иконки */

.player-info__item::before {
    content: "";
    position: absolute;
    left: 34px;
    top: 50%;
    transform: translateY(-50%);

    width: 32px;
    height: 32px;

    background-color: #ff5a00;

    -webkit-mask: var(--info-icon) center / contain no-repeat;
    mask: var(--info-icon) center / contain no-repeat;
}

/* 1. Возраст — календарь */
.player-info__item:nth-child(1) {
    --info-icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 2h2v3H7V2zm8 0h2v3h-2V2zM5 4h14c1.1 0 2 .9 2 2v14c0 1.1-.9 2-2 2H5c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2zm0 7v9h14v-9H5zm0-2h14V6H5v3zm2 4h3v3H7v-3zm5 0h3v3h-3v-3zm5 0h2v3h-2v-3zm-10 5h3v2H7v-2zm5 0h3v2h-3v-2z'/%3E%3C/svg%3E");
}

/* 2. Рост — стрелки */
.player-info__item:nth-child(2) {
    --info-icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11 3L6 8h3v8H6l5 5V3zm2 0v18l5-5h-3V8h3l-5-5z'/%3E%3C/svg%3E");
}

/* 3. Вес — сумка/вес */
.player-info__item:nth-child(3) {
    --info-icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 6c0-2.2 1.8-4 4-4s4 1.8 4 4h2c1 0 1.8.7 2 1.7l2 12c.2 1.2-.8 2.3-2 2.3H4c-1.2 0-2.2-1.1-2-2.3l2-12C4.2 6.7 5 6 6 6h2zm2 0h4c0-1.1-.9-2-2-2s-2 .9-2 2zm2 4c-2.2 0-4 1.8-4 4h2c0-1.1.9-2 2-2s2 .9 2 2h2c0-2.2-1.8-4-4-4z'/%3E%3C/svg%3E");
}

/* 4. Позиция — майка игрока */
.player-info__item:nth-child(4) {
    --info-icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 3l2 3h4l2-3 5 3-2 5-2-1v11H7V10l-2 1-2-5 5-3zm2.7 5L12 6.2 13.3 8h1.6l1.3-2.1-1.2-.7L14.5 6h-5l-.5-.8-1.2.7L9.1 8h1.6z'/%3E%3C/svg%3E");
}





.player-hero {
    position: relative;
    padding: 0px 0 0px;
    background: #f7f8fa;
    overflow: hidden;
}

.player-hero__inner {
    position: relative;
    min-height: 560px;
    display: grid;
    grid-template-columns: 48% 52%;
    align-items: center;
}

/* Контент в левом верхнем углу */
.player-hero__content {
    position: absolute;
    top: 40px;
    left: 0;
    z-index: 5;
    max-width: 560px;
}

.player-hero__back {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 34px;
    color: #ff5a00;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    transition: .2s ease;
}

.player-hero__back:hover {
    color: #e64a00;
    transform: translateX(-3px);
}

.player-hero__name {
    margin: 0;
    font-size: clamp(64px, 6vw, 92px);
    line-height: .9;
    font-weight: 900;
    text-transform: uppercase;
    color: #111;
}

.player-hero__nickname {
    margin-top: 14px;
    font-size: 22px;
    font-weight: 600;
    color: #ff5a00;
}

.player-hero__city {
    margin-top: 8px;
    font-size: 17px;
    color: #666;
}

/* Правая часть */
.player-hero__media {
    position: absolute;
    right: 0;
    top: 0;
    width: 58%;
    height: 100%;
    z-index: 1;
}

.player-hero__bg {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            90deg,
            #f7f8fa 0%,
            rgba(247,248,250,0.75) 25%,
            rgba(247,248,250,0) 55%
        ),
        url("/assets/img/player-hero-bg.jpg") center right / cover no-repeat;
}

.player-hero__media img,
.player-hero__img {
    position: absolute;
    right: 40%;
    bottom: 0;
    max-height: 560px;
    max-width: 58%;
    object-fit: contain;
    z-index: 2;
}


















/* Пока оставляем старую статистику, дальше переделаем */
/* ==========================
   Статистика игрока
========================== */

.player-hero__stats {
    display: flex;
    align-items: flex-start;
    gap: 55px;
    margin-top: 38px;
}

.player-hero__stat {
    position: relative;
}

.player-hero__stat:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 4px;
    right: -28px;
    width: 1px;
    height: 62px;
    background: #d7d7d7;
}

.player-hero__stat-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
}

.player-hero__stat-icon {
    font-size: 22px;
    line-height: 1;
}

.player-hero__stat-header span {
    margin: 0;
    font-size: 18px;
    color: #666;
    font-weight: 500;
}

.player-hero__stat strong {
    display: block;
    font-size: 36px;
    line-height: 1;
    font-weight: 900;
text-align: center;
    color: #111;
}

.player-hero__stat:first-child strong {
    color: #ff5a00;
}









/* ==========================
   Кнопка написать и вызвать
========================== */

.player-hero__buttons {
    display: flex;
    gap: 18px;
    margin-top: 42px;
}

.player-hero__buttons .btn {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;

    min-width: 280px;
    height: 58px;
    padding: 0 30px;

    border-radius: 10px;

    font-size: 15px;
    font-weight: 700;
    letter-spacing: .3px;
    text-transform: uppercase;

    text-decoration: none;
}

/* Иконка слева */

.player-hero__buttons .btn::before {
    position: absolute;
    left: 22px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 18px;
}

.player-hero__buttons .btn-orange::before {
    content: "⚡";
}

.player-hero__buttons .btn-light::before {
    content: "💬";
}

.btn-orange {
    background: #ff5a00;
    color: #fff;
    border: none;
}

.btn-orange:hover {
    background: #e74f00;
}

.btn-light {
    background: #fff;
    color: #222;
    border: 1px solid #dcdcdc;
}

.btn-light:hover {
    background: #f7f7f7;
}





/* ==========================
   Player Hero Mobile
========================== */

@media (max-width: 768px) {

    .player-hero {
        padding: 0 0 28px;
        background: #f7f8fa;
        overflow: hidden;
    }

    .player-hero .site-container {
        padding-left: 0;
        padding-right: 0;
    }

    .player-hero__inner {
        display: flex;
        flex-direction: column;
        min-height: auto;
    }

    /* Верхняя карточка с фоном и игроком */
    .player-hero__media {
        order: -1;
        position: relative;
        width: 100%;
        height: 405px;
        right: auto;
        top: auto;
        margin: 0;
        overflow: hidden;
        background: #f7f8fa;
    }

    .player-hero__bg {
        position: absolute;
        inset: 0;
        border-radius: 0;
        background:
            linear-gradient(
                180deg,
                rgba(255,255,255,0) 0%,
                rgba(255,255,255,0.08) 42%,
                rgba(247,248,250,0.72) 78%,
                #f7f8fa 100%
            ),
            linear-gradient(
                90deg,
                rgba(255,255,255,0.65) 0%,
                rgba(255,255,255,0.18) 38%,
                rgba(255,255,255,0) 100%
            ),
            url("/assets/img/player-hero-bg.jpg") center top / cover no-repeat;
        z-index: 1;
    }

    .player-hero__media img,
    .player-hero__img {
        position: absolute;
        right: 50%;
        bottom: 6px;
        transform: translateX(50%);
        max-height: 350px;
        max-width: 86%;
        object-fit: contain;
        z-index: 2;
    }

    /* Контент поверх изображения */
    .player-hero__content {
        position: relative;
        width: 100%;
        max-width: none;
        top: auto;
        left: auto;
        padding: 0 22px;
        z-index: 5;
    }

    .player-hero__back {
        position: absolute;
        top: -330px;
        left: 22px;
        z-index: 6;
        margin: 0;
        color: #fff;
        font-size: 13px;
        font-weight: 700;
        text-shadow: 0 2px 12px rgba(0,0,0,.45);
    }

    .player-hero__name {
        position: absolute;
        left: 22px;
        right: 22px;
        top: -132px;
        z-index: 6;

        margin: 0;
        font-size: 52px;
        line-height: .86;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: -2px;
        font-style: italic;
        color: #111;

        text-shadow:
            0 3px 0 rgba(255,255,255,.95),
            0 14px 30px rgba(0,0,0,.18);
    }

    .player-hero__nickname {
        position: absolute;
        left: 22px;
        right: 22px;
        top: -62px;
        z-index: 7;

        margin: 0;
        font-size: 34px;
        line-height: .9;
        font-weight: 900;
        font-style: italic;
        text-transform: uppercase;
        color: #ff5a00;

        text-shadow:
            0 2px 0 rgba(255,255,255,.95),
            0 8px 18px rgba(255,90,0,.22);
    }

    .player-hero__city {
        margin-top: 0;
        font-size: 14px;
        color: #555;
    }

    /* Статистика под городом */
    .player-hero__stats {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 0;
        margin-top: 14px;
        padding: 16px 0;
        background: #fff;
        border: 1px solid #ededed;
        border-radius: 18px;
        box-shadow: 0 12px 35px rgba(0,0,0,.06);
    }

    .player-hero__stat {
        position: relative;
        text-align: center;
    }

    .player-hero__stat:not(:last-child)::after {
        content: "";
        position: absolute;
        right: 0;
        top: 6px;
        width: 1px;
        height: 46px;
        background: #e5e5e5;
        display: block;
    }

    .player-hero__stat-header {
        justify-content: center;
        gap: 6px;
        margin-bottom: 8px;
    }

    .player-hero__stat-icon {
        font-size: 16px;
    }

    .player-hero__stat-header span {
        font-size: 10px;
        line-height: 1;
        text-transform: uppercase;
        color: #777;
    }

    .player-hero__stat strong {
        font-size: 22px;
        line-height: 1;
        font-weight: 900;
        text-align: center;
    }

    /* Кнопки */
    .player-hero__buttons {
        flex-direction: column;
        gap: 12px;
        margin-top: 18px;
    }

    .player-hero__buttons .btn {
        width: 100%;
        min-width: auto;
        height: 54px;
    }
}







@media (max-width: 480px) {

    .player-hero__media {
        height: 385px;
    }

    .player-hero__media img,
    .player-hero__img {
        max-height: 330px;
        max-width: 92%;
    }

    .player-hero__back {
        top: -315px;
    }

    .player-hero__name {
        top: -128px;
        font-size: 46px;
        letter-spacing: -1.5px;
    }

    .player-hero__nickname {
        top: -63px;
        font-size: 30px;
    }
}






/* ==========================
   Информация об игроке
   Возраст / Рост / Вес / Позиция
========================== */

.player-info {
    padding: 0 0 36px;
    background: #f7f8fa;
}

.player-info__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    align-items: stretch;

    background: #fff;
    border: 1px solid #ededed;
    border-radius: 18px;
    box-shadow: 0 14px 40px rgba(0,0,0,.05);

    overflow: hidden;
}

.player-info__item {
    position: relative;

    min-height: 92px;
    padding: 24px 30px 22px 86px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    background: #fff;
}

.player-info__item:not(:last-child)::after {
    content: "";
    position: absolute;
    right: 0;
    top: 24px;
    width: 1px;
    height: 44px;
    background: #e5e5e5;
}

.player-info__item span {
    display: block;
    margin: 0 0 8px;

    font-size: 14px;
    line-height: 1;
    font-weight: 700;
    color: #777;
}

.player-info__item strong {
    display: block;

    font-size: 24px;
    line-height: 1.1;
    font-weight: 900;
    color: #111;
    text-transform: uppercase;
}










/* ==========================
   Player Hero Mobile — новый вид
========================== */

@media (max-width: 768px) {

    .player-hero {
        padding: 0 0 28px;
        background: #f7f8fa;
        overflow: hidden;
    }

    .player-hero .site-container {
        padding-left: 0;
        padding-right: 0;
        max-width: none;
        width: 100%;
    }

    .player-hero__inner {
        display: flex;
        flex-direction: column;
        min-height: auto;
        width: 100%;
    }

    /* Фон и персонаж на всю ширину экрана */
    .player-hero__media {
        order: -1;
        position: relative;
        width: 100%;
        height: 330px;
        right: auto;
        top: auto;
        margin: 0;
        overflow: hidden;
        background: #f7f8fa;
    }

    /* Убираем общий градиент с фонового изображения */
    .player-hero__bg {
        position: absolute;
        inset: 0;
        border-radius: 0;
        background: url("/assets/img/player-hero-bg.jpg") center top / cover no-repeat;
        z-index: 1;
    }

    .player-hero__media img,
    .player-hero__img {
        position: absolute;
        right: 33%;
        bottom: 0;
        transform: translateX(50%);
        max-height: 340px;
        max-width: 92%;
        object-fit: contain;
        z-index: 2;
    }

    .player-hero__content {
        position: relative;
        width: 100%;
        max-width: none;
        top: auto;
        left: auto;
        padding: 0 22px;
        z-index: 5;
    }

    /* Фон только под именем и никнеймом */
    .player-hero__content::before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: -145px;
        height: 146px;
        z-index: 4;
        pointer-events: none;

        background: linear-gradient(
            0deg,
            rgba(247,248,250,1) 0%,
            rgba(247,248,250,0.92) 28%,
            rgba(247,248,250,0.65) 58%,
            rgba(247,248,250,0) 100%
        );
    }

    .player-hero__back {
        position: absolute;
        top: -285px;
        left: 22px;
        z-index: 8;
        margin: 0;
        color: #fff;
        font-size: 13px;
        font-weight: 700;
        text-shadow: 0 2px 12px rgba(0,0,0,.45);
    }

    .player-hero__name {
        position: absolute;
        left: 22px;
        right: 22px;
        top: -118px;
        z-index: 7;

        margin: 0;
        font-size: 44px;
        line-height: .86;
        font-weight: 900;
        font-style: italic;
        letter-spacing: -2px;
        text-transform: uppercase;
        color: #111;

        text-shadow:
            0 2px 0 rgba(255,255,255,.95),
            0 10px 25px rgba(0,0,0,.16);
    }

    .player-hero__nickname {
        position: absolute;
        left: 22px;
        right: 22px;
        top: -64px;
        z-index: 7;

        margin: 0;
        font-size: 28px;
        line-height: .9;
        font-weight: 900;
        font-style: italic;
        text-transform: uppercase;
        color: #ff5a00;

        text-shadow:
            0 2px 0 rgba(255,255,255,.95),
            0 8px 18px rgba(255,90,0,.2);
    }

    .player-hero__city {
        margin-top: 10px;
        font-size: 14px;
        color: #555;
    }

    .player-hero__stats {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 0;
        margin-top: 14px;
        padding: 15px 0;
        background: #fff;
        border: 1px solid #ededed;
        border-radius: 18px;
        box-shadow: 0 12px 35px rgba(0,0,0,.06);
    }

    .player-hero__stat {
        position: relative;
        text-align: center;
    }

    .player-hero__stat:not(:last-child)::after {
        content: "";
        position: absolute;
        right: 0;
        top: 6px;
        width: 1px;
        height: 44px;
        background: #e5e5e5;
        display: block;
    }

    .player-hero__stat-header {
        justify-content: center;
        gap: 5px;
        margin-bottom: 7px;
    }

    .player-hero__stat-icon {
        font-size: 15px;
    }

    .player-hero__stat-header span {
        font-size: 9px;
        line-height: 1;
        text-transform: uppercase;
        color: #777;
    }

    .player-hero__stat strong {
        font-size: 21px;
        line-height: 1;
        font-weight: 900;
        text-align: center;
    }

    .player-hero__buttons {
        flex-direction: column;
        gap: 12px;
        margin-top: 18px;
    }

    .player-hero__buttons .btn {
        width: 100%;
        min-width: auto;
        height: 54px;
    }
}





/* ==========================
   Player Info Mobile
   Рост / Вес / Возраст / Позиция
========================== */

@media (max-width: 768px) {

    .player-info {
        padding: 0 16px 28px;
        background: #f7f8fa;
    }

    .player-info .site-container {
        padding-left: 0;
        padding-right: 0;
        max-width: none;
        width: 100%;
    }

    .player-info__grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 0;

        background: #fff;
        border: 1px solid #eeeeee;
        border-radius: 22px;
        overflow: hidden;

        box-shadow: 0 14px 40px rgba(0, 0, 0, .06);
    }

    .player-info__item {
        position: relative;
        min-height: 106px;

        display: flex;
        flex-direction: column;
        justify-content: center;

        padding: 22px 16px 20px 68px;

        background: transparent;
        border: none;
        border-radius: 0;
        box-shadow: none;
    }

    /* порядок как на макете:
       1 строка: Рост / Вес
       2 строка: Возраст / Позиция
    */

    .player-info__item:nth-child(1) {
        order: 3;
    }

    .player-info__item:nth-child(2) {
        order: 1;
    }

    .player-info__item:nth-child(3) {
        order: 2;
    }

    .player-info__item:nth-child(4) {
        order: 4;
    }

    /* вертикальная линия между колонками */

    .player-info__item:nth-child(3),
    .player-info__item:nth-child(4) {
        border-left: 1px solid #eeeeee;
    }

    /* горизонтальная линия между строками */

    .player-info__item:nth-child(1),
    .player-info__item:nth-child(4) {
        border-top: 1px solid #eeeeee;
    }

    .player-info__item span {
        display: block;
        margin: 0 0 8px;

        font-size: 12px;
        line-height: 1;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: .4px;

        color: #777;
    }

    .player-info__item strong {
        display: block;

        font-size: 24px;
        line-height: 1.1;
        font-weight: 900;
        text-transform: uppercase;

        color: #111;
    }

/* Иконки характеристик игрока */

.player-info__item::before {
    content: "";
    position: absolute;
    left: 22px;
    top: 50%;
    transform: translateY(-50%);

    width: 34px;
    height: 34px;

    background-color: #ff5a00;

    -webkit-mask: var(--info-icon) center / contain no-repeat;
    mask: var(--info-icon) center / contain no-repeat;
}

/* Возраст — календарь */
.player-info__item:nth-child(1) {
    --info-icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 2h2v3H7V2zm8 0h2v3h-2V2zM4 5h16c1.1 0 2 .9 2 2v13c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V7c0-1.1.9-2 2-2zm0 6v9h16v-9H4zm0-2h16V7H4v2zm3 4h3v3H7v-3zm5 0h3v3h-3v-3zm5 0h2v3h-2v-3zm-10 5h3v2H7v-2zm5 0h3v2h-3v-2z'/%3E%3C/svg%3E");
}

/* Рост — стрелки вверх/вниз */
.player-info__item:nth-child(2) {
    --info-icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 2l5 5h-3v10h3l-5 5-5-5h3V7H7l5-5zM4 4h3v2H4v12h3v2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2zm16 0c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2h-3v-2h3V6h-3V4h3z'/%3E%3C/svg%3E");
}

/* Вес — весы */
.player-info__item:nth-child(3) {
    --info-icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 6c0-2.2 1.8-4 4-4s4 1.8 4 4h2.2c1 0 1.8.7 2 1.7l1.7 12c.2 1.2-.8 2.3-2 2.3H4.1c-1.2 0-2.2-1.1-2-2.3l1.7-12c.2-1 1-1.7 2-1.7H8zm2 0h4c0-1.1-.9-2-2-2s-2 .9-2 2zm2 4c-2.2 0-4 1.8-4 4h2c0-1.1.9-2 2-2s2 .9 2 2h2c0-2.2-1.8-4-4-4z'/%3E%3C/svg%3E");
}

/* Позиция — мини баскетбольное поле */
.player-info__item:nth-child(4) {
    --info-icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 3h18c1.1 0 2 .9 2 2v14c0 1.1-.9 2-2 2H3c-1.1 0-2-.9-2-2V5c0-1.1.9-2 2-2zm0 2v14h18V5H3zm9 0h2v14h-2V5zM5 8h5v8H5V8zm2 2v4h3v-4H7zm9-2h3v8h-3v-2h1v-4h-1V8z'/%3E%3C/svg%3E");
}





}



/* ==========================
   Player Hero Mobile — Рост вес возраст позиция
========================== */

@media (max-width: 390px) {

    .player-info {
        padding-left: 14px;
        padding-right: 14px;
    }

    .player-info__item {
        min-height: 96px;
        padding: 18px 12px 18px 58px;
    }

    .player-info__item::before {
        left: 18px;
    }

    .player-info__item span {
        font-size: 10px;
    }

    .player-info__item strong {
        font-size: 22px;
    }
}







/* ==========================
   Последние игры
========================== */

    .player-games {
        padding: 0 16px 32px;
        background: #f7f8fa;
    }

.player-games__card {
    background: #fff;
    border: 1px solid #ededed;
    border-radius: 24px;
    box-shadow: 0 16px 45px rgba(0,0,0,.05);
    overflow: hidden;
}

.player-games__title {
    margin: 0;
    padding: 32px 36px 18px;
    font-size: 34px;
    line-height: 1;
    font-weight: 900;
    text-transform: uppercase;
    color: #111;
}

.player-games__list {
    padding: 0 36px;
}

.player-games__row {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) 150px 90px 130px;
    align-items: center;
    gap: 24px;
    min-height: 92px;
    border-bottom: 1px solid #ededed;
}

.player-games__row:nth-child(n+4) {
    display: none;
}

.player-games__card.is-open .player-games__row {
    display: grid;
}

.player-games__card.is-open .player-games__list {
    max-height: 460px;
    overflow-y: auto;
    padding-right: 24px;
}

.player-games__list::-webkit-scrollbar {
    width: 6px;
}

.player-games__list::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 10px;
}

.player-games__list::-webkit-scrollbar-thumb {
    background: #d0d0d0;
    border-radius: 10px;
}

.player-games__player {
    display: inline-flex;
    align-items: center;
    gap: 18px;
    color: #111;
    font-size: 22px;
    font-weight: 800;
    text-decoration: none;
}

.player-games__player:hover span {
    color: #ff5a00;
}

    .player-games__player img {
        width: 34px;
        height: 34px;
        flex: 0 0 34px;
        border-radius: 50%;
        object-fit: cover;
    }

    .player-games__player span {
        display: block;
        min-width: 0;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }


.player-games__result {
    font-size: 20px;
    font-weight: 800;
}

.player-games__result--win {
    color: #19a83a;
}

.player-games__result--loss {
    color: #f04444;
}

.player-games__score {
    font-size: 22px;
    font-weight: 900;
    color: #111;
}

.player-games__date {
    font-size: 18px;
    color: #7a7f8a;
    text-align: right;
}

.player-games__more {
    width: 220px;
    height: 58px;
    margin: 26px auto 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;

    background: #fff;
    border: 1px solid #ff5a00;
    border-radius: 14px;

    color: #ff5a00;
    font-size: 18px;
    font-weight: 900;
    text-transform: uppercase;
    cursor: pointer;

    transition: .2s ease;
}

.player-games__more:hover {
    background: #ff5a00;
    color: #fff;
    transform: translateY(-2px);
}

/* Mobile */

@media (max-width: 768px) {

    .player-games {
        padding: 0 16px 32px;
    }

    .player-games .site-container {
        width: 100%;
        max-width: none;
        padding-left: 0;
        padding-right: 0;
    }

    .player-games__card {
        width: 100%;
        box-sizing: border-box;
        border-radius: 22px;
    }

    .player-games__title {
        padding: 22px 18px 10px;
        font-size: 22px;
        line-height: 1;
    }


    .player-games__list {
        padding: 0 14px;
    }



    .player-games__row {
        grid-template-columns: minmax(92px, 1fr) 54px 38px 42px 54px;
        gap: 5px;
    }

    .player-games__rating-change {
        grid-column: auto;
        grid-row: auto;
        font-size: 11px;
        font-weight: 900;
        text-align: center;
        white-space: nowrap;
    }


    .player-games__player {
        grid-column: auto;
        grid-row: auto;

        display: flex;
        align-items: center;
        gap: 8px;

        min-width: 0;

        font-size: 16px;
        font-weight: 800;
        color: #111;
        text-decoration: none;
    }

    .player-games__player img {
        width: 46px;
        height: 46px;
    }

    .player-games__result {
        grid-column: auto;
        grid-row: auto;

        font-size: 11px;
        font-weight: 900;
        text-align: center;
        white-space: nowrap;
    }

    .player-games__score {
        grid-column: auto;
        grid-row: auto;

        padding-left: 0;
        font-size: 13px;
        font-weight: 900;
        text-align: center;
        white-space: nowrap;
    }

    .player-games__date {
        grid-column: auto;
        grid-row: auto;

        font-size: 10px;
        color: #7a7f8a;
        text-align: right;
        white-space: nowrap;
    }

    .player-games__card.is-open .player-games__list {
        max-height: 460px;
        overflow-y: auto;
        padding-right: 12px;
    }

    .player-games__more {
        width: calc(100% - 28px);
        height: 50px;
        margin: 18px auto 18px;
        font-size: 14px;
    }

    .player-games__card.is-open .player-games__list {
        max-height: 370px;
        overflow-y: auto;
        padding-right: 10px;
    }
}






@media (max-width: 390px) {

    .player-games {
        padding-left: 14px;
        padding-right: 14px;
    }

    .player-games__list {
        padding: 0 12px;
    }

    .player-games__row {
        grid-template-columns: minmax(96px, 1fr) 54px 42px 54px;
        gap: 5px;
    }

    .player-games__player {
        font-size: 16px;
    }

    .player-games__player img {
        width: 32px;
        height: 32px;
        flex-basis: 32px;
    }

    .player-games__result {
        font-size: 10px;
    }

    .player-games__score {
        font-size: 12px;
    }

    .player-games__date {
        font-size: 9px;
    }
}




@media (max-width: 768px) {

    .player-info {
        margin-top: 0;
        padding: 0 16px 28px;
    }

    .player-info__item::before {
        left: 22px;
        width: 32px;
        height: 32px;
    }

}









/* ==========================
   Последние игры — рейтинг +/-
========================== */

.player-games__row {
    grid-template-columns: minmax(160px, 1fr) 30px 50px 70px 100px;
}

.player-games__rating-change {
    font-size: 16px;
    font-weight: 900;
    text-align: center;
    white-space: nowrap;
}

.player-games__rating-change--plus {
    color: #19a83a;
}

.player-games__rating-change--minus {
    color: #f04444;
}
