﻿.game-toast-zone {
    position: fixed;
    top: 22px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 99999;
    width: min(560px, calc(100vw - 28px));
    display: grid;
    gap: 12px;
    pointer-events: none;
}

.game-toast {
    --accent: #39b8ff;
    --accent-soft: rgba(57, 184, 255, .22);
    --accent-line: rgba(57, 184, 255, .55);
    --accent-glow: rgba(57, 184, 255, .28);
    position: relative;
    overflow: hidden;
    min-height: 78px;
    padding: 14px 16px 14px 14px;
    display: grid;
    grid-template-columns: 50px 1fr auto;
    gap: 13px;
    align-items: center;
    border-radius: 22px;
    color: #eef7ff;
    background: linear-gradient(120deg, rgba(255,255,255,.13), transparent 34%), radial-gradient(circle at 18% 0%, var(--accent-soft), transparent 42%), rgba(14, 22, 33, .94);
    border: 1px solid var(--accent-line);
    box-shadow: 0 22px 70px rgba(0,0,0,.48), 0 0 34px var(--accent-glow), inset 0 1px 0 rgba(255,255,255,.14);
    backdrop-filter: blur(18px);
    pointer-events: auto;
    animation: gameToastIn .55s cubic-bezier(.2, 1.2, .25, 1) both;
}

    .game-toast.success {
        --accent: #00f5a0;
        --accent-soft: rgba(0, 245, 160, .22);
        --accent-line: rgba(0, 245, 160, .55);
        --accent-glow: rgba(0, 245, 160, .28);
    }

    .game-toast.error {
        --accent: #ff477e;
        --accent-soft: rgba(255, 71, 126, .22);
        --accent-line: rgba(255, 71, 126, .55);
        --accent-glow: rgba(255, 71, 126, .28);
    }

    .game-toast.info {
        --accent: #39b8ff;
    }

    .game-toast.warning {
        --accent: #ffd166;
        --accent-soft: rgba(255, 209, 102, .22);
        --accent-line: rgba(255, 209, 102, .55);
        --accent-glow: rgba(255, 209, 102, .28);
    }

    .game-toast.leaving {
        animation: gameToastOut .35s ease forwards;
    }

    .game-toast::before {
        content: "";
        position: absolute;
        inset: 0;
        background: repeating-linear-gradient( 135deg, rgba(255,255,255,.065) 0 1px, transparent 1px 9px );
        opacity: .35;
        pointer-events: none;
    }

    .game-toast::after {
        content: "";
        position: absolute;
        left: 18px;
        right: 18px;
        bottom: 0;
        height: 3px;
        border-radius: 99px;
        background: linear-gradient(90deg, transparent, var(--accent), #ffd166, transparent);
        animation: gameToastTimer var(--duration, 3000ms) linear forwards;
        transform-origin: left;
    }

.game-toast-icon {
    width: 50px;
    height: 50px;
    display: grid;
    place-items: center;
    border-radius: 18px;
    color: #061015;
    font-size: 22px;
    font-weight: 900;
    background: linear-gradient(145deg, #ffffff, var(--accent));
    box-shadow: 0 0 28px var(--accent-glow), inset 0 2px 0 rgba(255,255,255,.75);
    transform: rotate(-3deg);
}

.game-toast-title {
    margin: 0 0 4px;
    font-size: 14px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--accent);
}

.game-toast-message {
    margin: 0;
    color: #dce9f7;
    line-height: 1.45;
    font-size: 14px;
}

    .game-toast-message b,
    .game-toast-message strong {
        color: #fff;
    }

    .game-toast-message em {
        color: #ffd166;
        font-style: normal;
    }

    .game-toast-message a {
        color: var(--accent);
        font-weight: 800;
        text-decoration: none;
    }

.game-toast-close {
    position: relative;
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 12px;
    color: white;
    cursor: pointer;
    font-size: 20px;
    background: rgba(255,255,255,.09);
}

    .game-toast-close:hover {
        background: rgba(255,255,255,.16);
    }

@keyframes gameToastIn {
    from {
        opacity: 0;
        transform: translateY(-28px) scale(.92);
        filter: blur(8px);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
        filter: blur(0);
    }
}

@keyframes gameToastOut {
    to {
        opacity: 0;
        transform: translateY(-18px) scale(.96);
        filter: blur(7px);
    }
}

@keyframes gameToastTimer {
    from {
        transform: scaleX(1);
    }

    to {
        transform: scaleX(0);
    }
}
.game-toast,
.game-toast * {
    color-scheme: dark !important;
}

.game-toast {
    background: linear-gradient(120deg, rgba(255,255,255,.13), transparent 34%), radial-gradient(circle at 18% 0%, var(--accent-soft), transparent 42%), rgba(14, 22, 33, .98) !important;
    color: #eef7ff !important;
}

    .game-toast .game-toast-message,
    .game-toast .game-toast-message *,
    .game-toast .game-toast-title {
        color: #eaf4ff !important;
    }

    .game-toast .game-toast-title {
        color: var(--accent) !important;
    }

    .game-toast .game-toast-message a {
        color: var(--accent) !important;
    }

    .game-toast .game-toast-message b,
    .game-toast .game-toast-message strong {
        color: #ffffff !important;
    }

    .game-toast .game-toast-message em {
        color: #ffd166 !important;
    }