#toast-container {
    position: fixed;
    top: 0; /* Прижимаем к самому верху */
    left: 50%;
    transform: translateX(-50%);
    z-index: 10000;
    display: flex;
    flex-direction: column;
    align-items: center;
    pointer-events: none; /* Чтобы уведомление не мешало кликать под ним */
}

.toast {
    background: rgba(34, 34, 34, 0.95);
    color: #fff;
    padding: 15px 40px;
    margin-top: 10px;
    border-radius: 0 0 10px 10px; /* Скругление только снизу */
    border-bottom: 3px solid #00e676;
    box-shadow: 0 5px 20px rgba(0,0,0,0.6);
    font-family: 'Segoe UI', Arial, sans-serif;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    
    /* Анимация: вылет сверху вниз и уход обратно */
    animation: slideDown 0.4s cubic-bezier(0.18, 0.89, 0.32, 1.28), 
               slideUp 0.5s 2.5s forwards;
}

@keyframes slideDown {
    from { transform: translateY(-100%); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

@keyframes slideUp {
    from { transform: translateY(0); opacity: 1; }
    to { transform: translateY(-120%); opacity: 0; }
}
body { margin: 0; overflow: hidden; background: #050505; color: #fff; font-family: sans-serif; touch-action: none; }
        canvas { display: block; }
        #overlay, #skin-menu, #death-screen { position: fixed; inset: 0; background: rgba(0,0,0,0.95); display: flex; flex-direction: column; align-items: center; justify-content: center; z-index: 1000; }
        #death-screen { display: none; background: rgba(60, 0, 0, 0.9); z-index: 1100; }
        #skin-menu { display: none; overflow-y: auto; padding: 50px; }
        .skin-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 20px; width: 80%; }
        .skin-item { cursor: pointer; border: 3px solid transparent; transition: 0.2s; border-radius: 50%; overflow: hidden; width: 100px; height: 100px; }
        .skin-item:hover { border-color: #00e676; transform: scale(1.1); }
        .skin-item img { width: 100%; height: 100%; object-fit: cover; }
        #ui-top-left { position: fixed; top: 15px; left: 15px; z-index: 10; width: 250px; }
        #ui-top-right { position: fixed; top: 15px; right: 15px; background: rgba(0,0,0,0.5); padding: 10px; border-radius: 5px; width: 180px; font-size: 14px; z-index: 10; }
        #minimap-box { position: fixed; bottom: 15px; right: 15px; width: 180px; height: 180px; background: rgba(0,0,0,0.7); border: 2px solid #444; pointer-events: none; }
        .btn { padding: 12px 40px; font-size: 20px; background: #00e676; border: 0; border-radius: 50px; cursor: pointer; font-weight: bold; margin: 10px; width: 300px; text-align: center; color: #000; text-decoration: none; display: block; }
        .btn-skin { background: #2196f3; color: #fff; }
        .btn-load { background: #ff9800; color: #fff; }
        .btn-res { background: #ffeb3b; color: #000; }
        .ad-btn { pointer-events: auto; color: #ffeb3b; cursor: pointer; font-size: 14px; display: block; margin-top: 5px; text-decoration: underline; background: rgba(255,255,255,0.1); padding: 5px; border-radius: 4px; }
        .save-btn { pointer-events: auto; color: #fff; cursor: pointer; font-size: 14px; display: block; margin-top: 5px; background: #2196f3; padding: 5px; border-radius: 4px; border: none; width: 100%; text-align: left; }
        .leader-item { display: flex; justify-content: space-between; margin: 2px 0; font-family: monospace; }
		/* Стили для окна информации */
#info-menu { 
    display: none; 
    position: fixed; 
    inset: 0; 
    background: rgba(0,0,0,0.95); 
    z-index: 1200; 
    padding: 40px; 
    overflow-y: auto; 
    flex-direction: column; 
    align-items: center; 
}
.info-content { 
    max-width: 600px; 
    text-align: left; 
    line-height: 1.6; 
    font-size: 18px; 
}
.info-content h2 { color: #00e676; text-align: center; }
.info-content ul { padding-left: 20px; }
.btn-info { background: #9c27b0; color: #fff; } /* Фиолетовая кнопка */
		.modal { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.8); z-index: 3000; align-items: center; justify-content: center; }
.modal-content { background: #222; padding: 30px; border-radius: 15px; width: 320px; text-align: center; }
.modal-content input { width: 100%; padding: 10px; margin: 10px 0; background: #333; border: 1px solid #444; color: white; border-radius: 5px; box-sizing: border-box; }
.btn-auth { background: #444; color: white; border: none; padding: 8px 15px; border-radius: 5px; cursor: pointer; margin-left: 5px; }
.btn-auth:hover { background: #666; }
		.modal-content div { width: 100%; } /* Чтобы обертка инпута не схлопывалась */
.modal-content input { padding-right: 40px !important; } /* Место для глаза */
    /* Анимация мигания для админской кнопки */
    @keyframes blink-gold {
        0% { box-shadow: 0 0 5px #ffeb3b; background: #f44336; }
        50% { box-shadow: 0 0 20px #ffeb3b; background: #ff9800; }
        100% { box-shadow: 0 0 5px #ffeb3b; background: #f44336; }
    }
    .new-msg { animation: blink-gold 1.5s infinite; border: 2px solid #ffeb3b !important; }
.modal-overlay {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0,0,0,0.8); display: flex; justify-content: center; align-items: center; z-index: 2000;
}
.modal-card {
    background: #222; padding: 30px; border-radius: 15px; border: 2px solid #00e676;
    text-align: center; color: white; min-width: 300px; box-shadow: 0 0 20px rgba(0,230,118,0.3);
}
.confirm-buttons { display: flex; gap: 15px; justify-content: center; margin-top: 20px; }
.btn-primary { background: #00e676; border: none; padding: 10px 25px; border-radius: 5px; cursor: pointer; color: #000; font-weight: bold; }
.btn-secondary { background: #555; border: none; padding: 10px 25px; border-radius: 5px; cursor: pointer; color: #fff; }
.btn-primary:hover { background: #00ff81; }