body {
        margin: 0;
        padding: 0;
        font-family: Arial, sans-serif;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100vh;
        background: linear-gradient(135deg, #BB63E6, #7265E3 );
        color: #fff;
        text-align: center;
    }

    .container {
        max-width: 600px;
        padding: 20px;
        margin: 20px;
        border-radius: 8px;
        background: rgba(0, 0, 0, 0.6);
        box-shadow: 0 8px 15px rgba(0, 0, 0, 0.3);
    }

    h1 {
        font-size: 1.5em;
        margin-bottom: 20px;
    }

    p {
        font-size: 1.2em;
        margin-bottom: 20px;
    }

    .btn {
        background-color: rgba(0, 0, 0, 0.6);
        text-decoration: none;
        padding: 10px 20px;
        border: 2px solid #fff;
        color: #fff;
        font-size: 1em;
        border-radius: 25px;
        transition: all 0.3s ease;
    }

    .btn:hover {
        background: #fff;
        color: #764ba2;
    }

    .button-list {
        display: inline-flex; /* Контейнер будет по ширине содержимого */
        align-items: stretch; /* Все кнопки растягиваются по ширине контейнера */
        flex-direction: column; /* Вертикальное расположение */
        gap: 20px; /* Отступы между кнопками */
        max-width: 300px; /* Ограничение ширины списка */
    }

    [ng\:cloak],[ng-cloak],.ng-cloak{display:none !important}