:root {
    --panel-bg: rgba(0, 0, 0, 0.90);
    --panel-hover: rgba(25, 25, 25, 0.92);

    --text-main: #eee;
    --text-secondary: #aaa;

    --border: rgba(255, 255, 255, 0.15);

    --radius: 12px;
    --blur: 6px;
}


/* Общие настройки */

* {
    box-sizing: border-box;
}

body {
    margin: 0;

    background-image: url("/background.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;

    color: var(--text-main);

    font-family: Arial, sans-serif;

    text-align: center;
}


/* Общая кнопка "Главное меню" */

.home-button {
    position: fixed;

    top: 20px;
    left: 20px;

    padding: 10px 16px;

    background: var(--panel-bg);
    color: var(--text-main);

    text-decoration: none;

    border-radius: 8px;

    backdrop-filter: blur(var(--blur));
    -webkit-backdrop-filter: blur(var(--blur));

    transition:
        background 0.2s,
        transform 0.2s;
}

.home-button:hover {
    background: var(--panel-hover);

    transform: translateY(-1px);
}


/* Общий подвал */

footer {
    margin-top: 50px;
    padding: 20px;

    color: #555;

    font-size: 14px;

    text-align: center;

    user-select: none;
}


/* Мобильная версия */

@media (max-width: 700px) {

    body {
        padding: 0 10px;
    }

    h1 {
        font-size: 30px;
    }

    h2 {
        font-size: 22px;
    }

    button {
        max-width: 90%;
    }

    input {
        max-width: 95%;
    }

    select {
        max-width: 95%;
    }

    .home-button {
        top: 10px;
        left: 10px;

        padding: 8px 12px;

        font-size: 14px;
    }

    footer {
        margin-top: 30px;
    }

}