html {
    --name: 5;
    --main_bg_color: url(./src/assets/小厨师和小蛋糕.png);
    --main_text_color: #eeeeee;
    --gradient: linear-gradient(120deg, #bd34fe, #e0321b 30%, #41d1ff 60%);
    --purple_text_color: #747bff;
    --text_bg_color: #00000040;
    --item_bg_color: #00000038;
    --item_hover_color: #33333338;
    --item_left_title_color: #ffffff;
    --item_left_text_color: #ffffff;
    --footer_text_color: #ffffff;
    --left_tag_item: rgb(27 42 57 / 20%);
    --card_filter: 15px;
    --back_filter: 0px;
    --back_filter_color: #00000030;
    --fill:#ffffff;
}

body {
    height: 100%;
    min-height: 100vh;
    width: 100%;
    position: relative;
    margin: 0;
    font-family: "b",  "a", sans-serif;
    background: var(--main_bg_color);
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
    background-position: center;
    background-attachment: fixed;
    transition: background 0.5s ease;
    color: var(--main_text_color);
}

.app-div {
    position: relative;
    width: 100%;
    margin: 0 auto;
    transition: transform 0.5s ease;
    padding: 20px;
    padding-top: 64px;
    max-width: 1450px;
    height: calc(100vh - 90px); /* 应用区域高度减去导航栏高度 */
    position: relative;
    display: flex;
    flex-direction: row;
    transition: padding-top 0.5s ease;
}

@media (max-width: 800px) {
    html {
        --main_bg_color: url(./src/assets/芙桃.png);
    }
    .app-div {
        padding-top: 152px;
        height: calc(100vh - 152px); /* 应用区域高度减去导航栏高度 */
    }
}