@charset "UTF-8";

@font-face {
    font-family: 思源宋体;
    src: url(./SourceHanSerifCN-Regular-1e60cc2e.ttf) format("truetype")
}

@font-face {
    font-family: LXGW;
    src: url(./LXGWWenKai-Regular-9375313a.ttf) format("truetype")
}

@font-face {
    font-family: WebgalUI;
    src: url(./OPPOSans-R-ea925359.ttf) format("truetype")
}

.StartButton {
    animation: StartButton_blink 4s infinite
}

@keyframes StartButton_blink {
    0% {
        text-shadow: 0 0 15px rgba(0, 0, 0, .65)
    }

    50% {
        text-shadow: 0 0 15px rgba(255, 255, 255, .5)
    }

    to {
        text-shadow: 0 0 15px rgba(0, 0, 0, .65)
    }
}

a {
    transition: color 1s
}

a:link,
a:visited,
a:hover,
a:active {
    color: #434343
}

svg {
    stroke: rgb(245, 130, 149);
}

svg>* {
    stroke: rgb(245, 130, 149);
}

body {
    background-color: #000;
    font-size: 16px;
    margin: 0;
    font-family: WebgalUI, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow: hidden;
    -webkit-user-select: none;
    user-select: none
}

code {
    font-family: source-code-pro, Menlo, Monaco, Consolas, Courier New, monospace
}

#root {
    width: 2560px;
    height: 1440px;
    overflow: hidden;
    font-size: 160%
}

::-webkit-scrollbar {
    width: 12px
}

::-webkit-scrollbar-track {
    box-shadow: 0 0 10px #fff3;
    -webkit-box-shadow: 0 0 10px rgba(255, 255, 255, .2);
    background: rgba(255, 255, 255, .2);
    border-radius: 10px
}

::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: rgba(255, 255, 255, .5);
    box-shadow: 0 0 10px #00000026;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .15)
}

#ebg {
    height: 100vh;
    width: 100vw;
    filter: blur(50px);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0
}

.App {
    height: 100%;
    width: 100%;
    background: #fbf9eb;
    overflow: hidden;
    perspective: 0;
    -webkit-overflow-scrolling: auto
}

#pixiCanvas {
    z-index: 5
}

._MainStage_main_9enex_1 {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
    opacity: 1;
    overflow: hidden
}

._MainStage_main_container_9enex_10 {
    width: 100%;
    height: 100%;
    position: absolute;
    overflow: hidden
}

._MainStage_bgContainer_9enex_17 {
    top: 0;
    position: absolute;
    background-size: cover;
    width: 100%;
    height: 100%;
    z-index: 1;
    animation: _MainStage_showBgSoftly_9enex_1 1s forwards ease-in-out
}

._MainStage_bgContainer_Settled_9enex_27 {
    top: 0;
    position: absolute;
    background-size: cover;
    width: 100%;
    height: 100%;
    animation: _MainStage_showBgSoftly_9enex_1 1ms forwards;
    z-index: 1
}

._MainStage_oldBgContainer_9enex_37 {
    background-size: cover;
    top: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 0;
    animation: _MainStage_oldBgFadeout_9enex_1 3s forwards
}

._MainStage_oldBgContainer_Settled_9enex_47 {
    background-size: cover;
    top: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0
}

@keyframes _MainStage_showBgSoftly_9enex_1 {
    0% {
        opacity: .15
    }

    to {
        opacity: 1
    }
}

@keyframes _MainStage_oldBgFadeout_9enex_1 {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

._pixiContainer_9enex_72 {
    position: absolute;
    z-index: 5
}

._chooseContainer_9enex_77 {
    z-index: 8
}

._TextBox_EventHandler_1aepe_2 {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 6;
    top: 0
}

._TextBox_Container_1aepe_10 {
    position: absolute;
    z-index: 6;
    bottom: 0;
    width: 100%;
    animation: _showSoftly_1aepe_1 .7s ease-out forwards
}

._TextBox_main_1aepe_18 {
    z-index: 3;
    position: absolute;
    right: 25px;
    min-height: 330px;
    max-height: 330px;
    background-blend-mode: darken;
    border-radius: 165px 20px 20px 165px;
    bottom: 20px;
    left: 275px;
    font-weight: 700;
    color: #fff;
    padding: 1em 50px 70px 200px;
    box-sizing: border-box;
    display: flex;
    flex-flow: column;
    align-items: flex-start;
    letter-spacing: .2em;
    transition: left .33s
}

._TextBox_main_miniavatarOff_1aepe_39 {
    left: 25px
}

._TextBox_Background_1aepe_43 {
    z-index: 2;
    background: #fbf9eb
}

@keyframes _showSoftly_1aepe_1 {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

._TextBox_textElement_start_1aepe_56 {
    position: relative;
    animation: _TextDelayShow_1aepe_1 1s ease-out forwards;
    opacity: 0;
    display: inline-flex;
    align-content: space-between
}

._outer_1aepe_64 {
    position: absolute;
    left: 0;
    top: 0;
    white-space: nowrap;
    background-image: linear-gradient(#0B346E 0%, #141423 100%);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    z-index: 2;
    display: inline-block;
    vertical-align: middle
}

._inner_1aepe_78 {
    white-space: nowrap;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-text-stroke: .1em rgb(255, 255, 255);
    z-index: 1;
    display: inline-block;
    vertical-align: middle
}

._zhanwei_1aepe_89 {
    color: transparent;
    white-space: nowrap;
    display: inline-block;
    vertical-align: baseline;
    position: relative
}

._TextBox_textElement_Settled_1aepe_97 {
    position: relative;
    opacity: 1;
    display: inline-flex;
    align-content: space-between
}

._TextBox_showName_1aepe_104 {
    font-size: 85%;
    padding: 0 2em;
    position: absolute;
    left: 150px;
    top: -68px;
    height: 80px;
    line-height: 68px;
    border-radius: 40px;
    z-index: 3;
    border: 4px solid rgba(255, 255, 255, 0)
}

._TextBox_ShowName_Background_1aepe_117 {
    z-index: 2;
    background: rgb(11, 52, 110);
    border: 4px solid rgba(255, 255, 255, .75);
    box-shadow: 3px 3px 10px #64646480
}

@keyframes _TextDelayShow_1aepe_1 {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

._miniAvatarContainer_1aepe_132 {
    position: absolute;
    height: 450px;
    width: 450px;
    bottom: 0;
    left: -250px;
    border-radius: 100% 0 0 100%;
    overflow: hidden
}

._miniAvatarImg_1aepe_142 {
    max-height: 100%;
    max-width: 100%;
    position: absolute;
    bottom: 0;
    filter: drop-shadow(15px 0 3px rgba(0, 0, 0, .5))
}

._nameContainer_1aepe_150 {
    position: absolute;
    left: 2em;
    top: -3.5em
}

._outerName_1aepe_156 {
    position: absolute;
    left: 0;
    top: 0;
    background: linear-gradient(150deg, rgb(255, 255, 255) 0%, rgb(255, 255, 255) 35%, rgb(165, 212, 228) 100%);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    z-index: 2
}

._innerName_1aepe_167 {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1
}

._text_1aepe_174 {
    overflow: hidden
}

._Choose_Main_1kza1_1 {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    z-index: 13;
    background: rgba(0, 0, 0, .05)
}

._Choose_item_1kza1_13 {
    font-family: WebgalUI, serif;
    cursor: pointer;
    min-width: 50%;
    padding: .25em 1em;
    font-size: 265%;
    color: #8e354a;
    text-align: center;
    border-radius: 4px;
    border: 3px solid rgba(0, 0, 0, 0);
    box-shadow: 0 0 25px #00000040;
    background: rgba(255, 255, 255, .65);
    margin: .25em 0;
    transition: background-color .5s, border .5s, font-weight .5s, box-shadow .5s
}

._Choose_item_1kza1_13:hover {
    background: rgba(255, 255, 255, .9);
    box-shadow: 0 0 25px #00000059;
    border: 3px solid #8E354A
}

._Choose_item_disabled_1kza1_34 {
    font-family: WebgalUI, serif;
    cursor: not-allowed;
    min-width: 50%;
    padding: .25em 1em;
    font-size: 265%;
    color: #8e354a80;
    text-align: center;
    border-radius: 4px;
    border: 3px solid rgba(0, 0, 0, 0);
    box-shadow: 0 0 25px #00000040;
    background: rgba(255, 255, 255, .5);
    margin: .25em 0;
    transition: background-color .5s, border .5s, font-weight .5s, box-shadow .5s
}

._Choose_item_outer_1kza1_50 {
    color: #000;
    min-width: 50%
}

._Choose_Main_4xkm5_1 {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    z-index: 13;
    background: rgba(0, 0, 0, .05)
}

._Choose_item_4xkm5_13 {
    cursor: pointer;
    min-width: 50%;
    padding: .25em 1em;
    font-size: 265%;
    color: #fd91a4;
    text-align: center;
    border-radius: 4px;
    border: 3px solid rgba(0, 0, 0, 0);
    box-shadow: 0 0 25px #00000040;
    background: rgba(255, 255, 255, .65);
    margin: .25em 0;
    transition: background-color .5s, border .5s, font-weight .5s, box-shadow .5s
}

._glabalDialog_container_inner_4xkm5_28 {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-flow: column;
    background: #fbf9eb00;
    padding: 1em 5em 1.5em
}

._glabalDialog_container_4xkm5_28 {
    color: #fd91a4;
    width: 100%;
    border-top: 4px solid;
    border-bottom: 4px solid;
    border-image: linear-gradient(to right, rgba(0, 92, 175, 0) 0%, rgba(253, 145, 164, .5) 33%, rgba(253, 145, 164, .85) 50%, rgba(253, 145, 164, .5) 66%, rgba(0, 92, 175, 0) 100%);
}

._title_4xkm5_47 {
    font-size: 300%;
    letter-spacing: .05em;
    text-shadow: 0 0 10px rgba(255, 255, 255, .5)
}

._Choose_item_4xkm5_13:hover {
    background: rgba(255, 255, 255, .9);
    box-shadow: 0 0 25px #00000059;
    border: 3px solid #fd91a4
}

._button_4xkm5_59 {
    font-size: 200%;
    padding: .15em 1em;
    margin: .2em 1em;
    cursor: pointer;
    transition: background-color .33s, color .33s, font-weight .33s, transform .33s;
    text-shadow: 0 0 10px rgb(255, 255, 255);
    border-radius: 5px
}

._button_4xkm5_59:hover {
    font-weight: 700;
    color: #fd91a4;
    transform: scale(1.1);
    text-shadow: 0 0 15px rgba(0, 0, 0, 0);
    background: rgba(255, 255, 255, .85)
}

._FullScreenPerform_main_7er8a_2 {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0
}

._FullScreenPerform_element_7er8a_9 {
    position: absolute;
    display: none;
    width: 100%;
    height: 100%;
    z-index: 11
}

._fullScreen_video_7er8a_17 {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    z-index: 11
}

@keyframes _slideIn_7er8a_80 {
    0% {
        transform: translate(-100%);
        opacity: 0
    }

    to {
        transform: translate(0);
        opacity: 1
    }
}

@keyframes _typing_7er8a_86 {
    0% {
        width: 0;
        height: 0
    }

    to {
        width: 100%;
        height: auto;
        border-right: 1px solid
    }
}

@keyframes _blinkCursor_7er8a_1 {
    50% {
        border-color: transparent
    }
}

@keyframes _pixelateAnimation_7er8a_1 {
    0% {
        filter: none;
        opacity: 0
    }

    50% {
        filter: blur(5px)
    }

    to {
        filter: none;
        opacity: 1
    }
}

@keyframes _revealAnimation_7er8a_101 {
    0% {
        opacity: 0;
        clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%)
    }

    to {
        opacity: 1;
        clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%)
    }
}

._fadeIn_7er8a_74 {
    opacity: 0;
    animation: _intro_showSoftly_7er8a_1 1.5s ease-out forwards;
    font-family: 思源宋体, serif
}

._slideIn_7er8a_80 {
    opacity: 0;
    animation: _slideIn_7er8a_80 1.5s forwards;
    font-family: 思源宋体, serif
}

._typingEffect_7er8a_86 {
    display: block;
    overflow: hidden;
    white-space: pre-line;
    width: 0;
    animation: _typing_7er8a_86 1.5s forwards, _blinkCursor_7er8a_1 1s infinite 1.5s;
    font-family: 思源宋体, serif
}

._pixelateEffect_7er8a_95 {
    opacity: 0;
    animation: _pixelateAnimation_7er8a_1 3s forwards;
    font-family: 思源宋体, serif
}

._revealAnimation_7er8a_101 {
    opacity: 0;
    animation: _revealAnimation_7er8a_101 3s forwards;
    font-family: 思源宋体, serif
}

@keyframes _intro_showSoftly_7er8a_1 {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

._videoContainer_7er8a_115 {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    z-index: 11;
    background: rgb(0, 0, 0)
}

._main_rdjpk_1 {
    position: absolute;
    bottom: 20px;
    z-index: 9;
    display: flex;
    flex-flow: row;
    justify-content: center;
    align-items: center;
    height: 70px;
    right: 20px;
    border-radius: 35px;
    padding: .15em 1.75em;
    font-size: 80%
}

._button_rdjpk_16 {
    position: relative;
    top: 2px;
    padding: 0;
    filter: drop-shadow(1px 1px 5px rgb(0, 0, 0))
}

._button_text_rdjpk_23 {
    position: relative;
    bottom: 8px;
    color: #fd91a4;
    text-shadow: 1px 1px 5px rgb(255, 255, 255);
    padding-left: 3px
}

._button_on_rdjpk_31 {
    height: 100%;
    display: inline-block;
    font-size: 150%;
    padding: .25em .3em 0 .15em;
    transition: background-color .5s;
    background: rgba(255, 255, 255, .3);
    border-radius: 4px;
    margin: 0 .1em
}

._singleButton_rdjpk_42 {
    height: 100%;
    display: inline-block;
    color: #fd91a4;
    font-size: 150%;
    padding: .3em .3em 0 .15em;
    transition: background-color .5s;
    cursor: pointer;
    border-radius: 4px;
    margin: 0 .1em;
    position: relative
}

._singleButton_rdjpk_42:hover,
._singleButton_active_rdjpk_55 {
    background-color: #ffffff4d
}

._fastSlPreview_rdjpk_59 {
    position: absolute;
    top: -250px;
    right: 0;
    background: rgba(251, 249, 235, 0.9);
    width: 900px;
    height: 230px;
    color: #fd91a4;
    border-radius: 5px;
    display: none;
    animation: _fastSlEnter_rdjpk_1 .33s;
    transition: opacity .33s
}

._fastsave_rdjpk_73:hover ._fastSPreview_rdjpk_73,
._fastload_rdjpk_77:hover ._fastLPreview_rdjpk_77 {
    display: block
}

@keyframes _fastSlEnter_rdjpk_1 {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

._slPreviewMain_rdjpk_89 {
    padding: .5em;
    display: flex;
    box-sizing: border-box;
    height: 100%;
    width: 100%
}

._imgContainer_rdjpk_97 {
    display: flex;
    overflow: hidden;
    border-radius: 5px;
    flex-shrink: 0;
    height: 100%
}

._textContainer_rdjpk_105 {
    overflow: hidden;
    padding: 0 0 0 .5em
}

._TextBox_EventHandler_449dq_2 {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 6;
    top: 0
}

._TextBox_main_449dq_10 {
    font-family: 思源宋体, serif;
    font-style: italic;
    position: absolute;
    z-index: 6;
    width: 100%;
    height: 12%;
    background-color: #fbf9eb;
    bottom: 0;
    color: #fff;
    box-sizing: border-box;
    overflow: hidden;
    display: flex;
    flex-flow: column;
    align-items: center;
    animation: _showSoftly_449dq_1 .7s ease-out forwards;
    letter-spacing: .2em;
    justify-content: center
}

@keyframes _showSoftly_449dq_1 {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

._TextBox_textElement_449dq_38 {
    opacity: 0;
    animation: _showSoftly_449dq_1 1s forwards
}

._TextBox_textElement_start_449dq_43 {
    animation: _TextDelayShow_449dq_1 .7s ease-out forwards;
    opacity: 0
}

._TextBox_textElement_Settled_449dq_48 {
    opacity: 1
}

._TextBox_showName_449dq_52 {
    font-size: 85%;
    border-bottom: 2px solid rgba(255, 255, 255, .3);
    min-width: 50%;
    padding: 0 .2em .2em .3em;
    margin: 0 0 .2em
}

@keyframes _TextDelayShow_449dq_1 {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

._miniAvatarContainer_449dq_68 {
    position: absolute;
    height: 80%;
    width: 17%;
    bottom: 0;
    left: .5em
}

._miniAvatarImg_449dq_76 {
    max-height: 100%;
    max-width: 100%;
    position: absolute;
    bottom: 0
}

._Backlog_main_zwyao_2 {
    font-family: 思源宋体, serif;
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
    background: rgba(0, 0, 0, .7);
    padding: 2em 0;
    animation: _backlog_soft_in_zwyao_1 .7s ease-out forwards;
    box-sizing: border-box
}

._Backlog_main_out_zwyao_15 {
    font-family: 思源宋体, serif;
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
    background: rgba(0, 0, 0, .7);
    padding: 2em 0;
    animation: _backlog_soft_out_zwyao_1 .7s ease-out forwards;
    box-sizing: border-box
}

._Backlog_main_out_IndexHide_zwyao_28 {
    z-index: -10
}

._Backlog_main_DisableScroll_zwyao_32 {
    overflow: hidden !important
}

._backlog_top_zwyao_36 {
    padding: 0 0 0 1em;
    display: flex;
    height: 10%
}

._backlog_top_icon_zwyao_42 {
    padding: .6em .6em 0;
    border-radius: 1000px;
    transform: translateY(-13px);
    cursor: pointer
}

._backlog_top_icon_zwyao_42:hover {
    background: rgba(255, 255, 255, .25);
    animation: _backlog_icon_softin_zwyao_1 .25s ease-out forwards
}

@keyframes _backlog_icon_softin_zwyao_1 {
    0% {
        background: rgba(255, 255, 255, 0)
    }

    to {
        background: rgba(255, 255, 255, .25)
    }
}

._backlog_title_zwyao_62 {
    height: 100%;
    line-height: 100%;
    font-size: 360%;
    font-weight: 700;
    color: transparent;
    background: linear-gradient(150deg, rgb(255, 255, 255) 0%, rgb(255, 255, 255) 35%, rgb(165, 212, 228) 100%);
    -webkit-background-clip: text
}

._backlog_content_zwyao_72 {
    position: absolute;
    height: 80%;
    padding: 1em 10em;
    overflow: auto;
    display: flex;
    flex-flow: column-reverse;
    font-weight: 400;
    width: 100%;
    box-sizing: border-box
}

._backlog_item_zwyao_84 {
    display: flex;
    color: #fff;
    font-size: 165%;
    opacity: 0;
    animation: _backlog_item_in_zwyao_1 .5s ease-out forwards;
    margin: 1.25em 0 0;
    width: 100%
}

._backlog_item_out_zwyao_94 {
    display: flex;
    color: #fff;
    font-size: 165%;
    opacity: 0;
    animation: _backlog_item_out_zwyao_94 .5s ease-out forwards;
    margin: 1.25em 0 0;
    width: 100%
}

._backlog_func_area_zwyao_104 {
    display: flex;
    flex-flow: row;
    align-items: flex-start;
    width: 30%;
    max-width: 30%;
    min-width: 30%
}

._backlog_item_content_name_zwyao_113 {
    font-weight: 700;
    color: transparent;
    background: linear-gradient(150deg, rgb(255, 255, 255) 0%, rgb(255, 255, 255) 35%, rgb(165, 212, 228) 100%);
    -webkit-background-clip: text;
    margin: 0 0 0 auto;
    overflow-wrap: break-word;
    box-sizing: border-box;
    border-radius: 7px;
    padding: .2em .5em;
    font-size: 115%;
    width: 50%;
    text-align: left;
    letter-spacing: .1em
}

._backlog_item_content_zwyao_113 {
    font-size: 115%;
    width: 82.5%;
    box-sizing: border-box;
    padding: .2em 0 0 1em;
    letter-spacing: .05em
}

._backlog_item_button_list_zwyao_137 {
    display: flex;
    flex-flow: row;
    align-items: flex-start;
    margin: .35em 0 0
}

._backlog_item_button_element_zwyao_144 {
    cursor: pointer;
    padding: .01em .75em 0;
    margin: 0 0 0 .5em;
    background: rgba(255, 255, 255, .075);
    border-radius: 7px;
    display: flex
}

._backlog_item_button_element_zwyao_144:hover {
    background: rgba(255, 255, 255, .25)
}

._backlog_item_content_text_zwyao_157 {
    box-sizing: border-box
}

@keyframes _backlog_soft_in_zwyao_1 {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes _backlog_soft_out_zwyao_1 {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

@keyframes _backlog_item_in_zwyao_1 {
    0% {
        opacity: 0;
        transform: scale(1.05) translate(-15px, 10px) rotateX(-5deg) rotateY(-5deg)
    }

    to {
        opacity: 1;
        transform: scale(1) translate(0)
    }
}

@keyframes _backlog_item_out_zwyao_94 {
    0% {
        opacity: 1;
        transform: scale(1) translate(0)
    }

    to {
        opacity: 0;
        transform: scale(1.05) translate(-15px, 10px) rotateX(-5deg) rotateY(-5deg);
        background-color: #fff3
    }
}

._introContainer_119k8_1 {
    box-sizing: border-box;
    position: absolute;
    z-index: 11;
    width: 100%;
    height: 100%;
    color: #fff;
    display: none
}

._GlobalDialog_main_101j8_2 {
    height: 100%;
    width: 100%;
    position: absolute;
    z-index: 20;
    background: rgba(15, 37, 64, .39);
    color: #fff;
    opacity: .5;
    animation: _showGlobalDialog_101j8_1 .33s forwards;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: 思源宋体, serif
}

._glabalDialog_container_inner_101j8_17 {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-flow: column;
    background: #fd91a475;
    padding: 1em 5em 1.5em
}

._glabalDialog_container_101j8_17 {
    height: 20%;
    width: 100%;
    border-top: 4px solid;
    border-bottom: 4px solid;
    border-image: linear-gradient(to right, rgba(255, 255, 255, .05) 0%, rgba(255, 255, 255, .85) 33%, rgb(255, 255, 255) 50%, rgba(255, 255, 255, .85) 66%, rgba(255, 255, 255, .05) 100%) 1
}

._title_101j8_36 {
    font-size: 300%;
    text-shadow: 0 0 10px rgba(255, 255, 255, .5)
}

._button_list_101j8_41 {
    display: flex;
    margin: auto 0 0
}

._button_101j8_41 {
    font-size: 200%;
    padding: .15em 1em;
    margin: .2em 1em;
    cursor: pointer;
    transition: background-color .33s, color .33s, font-weight .33s, transform .33s;
    text-shadow: 0 0 10px rgb(255, 255, 255);
    border-radius: 5px
}

._button_101j8_41:hover {
    font-weight: 700;
    color: #fd91a4;
    transform: scale(1.1);
    text-shadow: 0 0 15px rgba(0, 0, 0, 0);
    background: rgba(255, 255, 255, .85)
}

@keyframes _showGlobalDialog_101j8_1 {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

._Save_Load_main_a3o8b_2 {
    height: 90%;
    width: 100%;
    position: absolute;
    cursor: default
}

._Save_Load_top_a3o8b_9 {
    height: 10%;
    width: 100%;
    display: flex;
    animation: _Elements_in_a3o8b_1 ease-out 1s forwards;
    justify-content: center
}

._Save_Load_title_a3o8b_17 {
    font-family: 思源宋体, serif;
    letter-spacing: .1em;
    width: auto;
    font-size: 500%;
    min-width: 350px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    left: 20px;
    top: 0;
    z-index: -1;
    opacity: .2;
    transform: translateY(-10px)
}

._Save_title_text_a3o8b_35 {
    font-weight: 700;
    color: transparent;
    background: linear-gradient(135deg, #77428D 0%, #B28FCE 100%);
    text-shadow: 2px 2px 15px rgba(255, 255, 255, .5);
    -webkit-background-clip: text
}

._Load_title_text_a3o8b_43 {
    font-weight: 700;
    color: transparent;
    background: linear-gradient(135deg, #fd91a4 0%, #f8c3cc 100%);
    text-shadow: 2px 2px 15px rgba(255, 255, 255, .5);
    -webkit-background-clip: text
}

._Save_Load_top_buttonList_a3o8b_51 {
    height: 100%;
    display: flex
}

._Save_Load_top_button_a3o8b_51 {
    cursor: pointer;
    font-size: 200%;
    width: 2.05em;
    text-align: center;
    color: #00000080;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    border-bottom: 4px solid rgba(0, 0, 0, 0);
    transition: background-color .7s, border-bottom-width .7s
}

._Save_Load_top_button_text_a3o8b_69 {
    text-align: center;
    width: 100%;
    padding: 0 0 3px;
    border-left: 2px solid rgba(0, 0, 0, .1)
}

._Save_Load_top_button_a3o8b_51:first-child>div {
    border-left: 2px solid rgba(0, 0, 0, 0)
}

._Save_Load_top_button_on_a3o8b_80 {
    font-weight: 700;
    border-bottom: 4px solid #77428D;
    color: #77428d;
    background-color: #77428d0d
}

._Save_Load_top_button_a3o8b_51:hover {
    color: #77428d;
    font-weight: 700;
    border-bottom: 4px solid #77428D
}

._Load_top_button_on_a3o8b_93 {
    font-weight: 700;
    border-bottom: 5px solid #fd91a4;
    color: #fd91a4;
    background-color: #fd91a41a
}

._Load_top_button_a3o8b_93:hover {
    color: #fd91a4;
    font-weight: 700;
    border-bottom: 5px solid #fd91a4
}

._Save_Load_content_a3o8b_106 {
    height: 90%;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-items: center
}

._Save_Load_content_element_a3o8b_115 {
    background: #fd91a475;
    overflow: hidden;
    width: 17.5%;
    height: 45%;
    animation: _Elements_in_a3o8b_1 1s ease-out forwards, _Elements_in_transform_a3o8b_1 1s ease-out;
    opacity: 0;
    border-radius: 4px;
    transition: transform .25s, box-shadow .25s;
    cursor: pointer
}

._Save_Load_content_element_a3o8b_115:hover {
    transform: scale(1.05) translate(-.2em, -.2em)
}

._Save_Load_content_element_top_a3o8b_131 {
    font-family: 思源宋体, serif;
    width: 100%;
    height: 12%;
    display: flex
}

._Save_Load_content_element_top_index_a3o8b_138 {
    color: #fff;
    text-align: center;
    font-size: 155%;
    height: 100%;
    width: 20%;
    background-color: #fd91a4
}

._Load_content_elememt_top_index_a3o8b_147 {
    background-color: #fbf9eb
}

._Save_Load_content_element_top_date_a3o8b_151 {
    padding: .425em 0 0 .5em;
    background-color: #fd91a4;
    color: #fff;
    font-size: 115%;
    height: 100%;
    width: 80%;
    font-family: WebgalUI, serif;
    letter-spacing: .1em
}

._Load_content_element_top_date_a3o8b_162 {
    background-color: #fbf9eb
}

._Save_Load_content_text_a3o8b_166 {
    font-family: WebgalUI, sans-serif;
    letter-spacing: .05em;
    color: #ffffff;
    background: #fd91a4;
    font-size: 120%;
    height: 40%;
    width: 100%;
    display: flex;
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start
}

._Save_Load_content_text_padding_a3o8b_180 {
    padding: .2em .75em
}

._Save_Load_content_speaker_a3o8b_184 {
    box-sizing: border-box;
    font-weight: 700;
    color: #77428d;
    padding: .35em .8em .25em;
    width: 100%;
    border-bottom: 1px solid rgba(0, 0, 0, .1)
}

._Load_content_speaker_a3o8b_193 {
    color: #ffffff
}

._Load_content_text_a3o8b_197 {
    background-color: #fd91a4bf
}

._Save_Load_content_miniRen_a3o8b_201 {
    width: 100%;
    height: 48%;
    position: relative;
    background-size: cover
}

._Save_Load_content_miniRen_bg_a3o8b_208 {
    background-size: cover;
    height: 100%;
    width: 100%;
    background-position: center
}

._Save_Load_content_miniRen_figure_a3o8b_215 {
    height: 100%;
    max-height: 100%;
    max-width: 100%;
    position: absolute;
    bottom: 0
}

._Save_Load_content_miniRen_figLeft_a3o8b_223 {
    bottom: 0;
    left: 0
}

._Save_Load_content_miniRen_figRight_a3o8b_228 {
    bottom: 0;
    right: 0
}

@keyframes _Elements_in_a3o8b_1 {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes _Elements_in_transform_a3o8b_1 {
    0% {
        transform: scale(1.05) translate(-25px, -20px) rotateY(15deg) rotateX(-15deg)
    }

    to {
        transform: scale(1) translate(0)
    }
}

._tag_yghix_2 {
    position: absolute;
    top: 2.5%;
    left: 2.5%;
    color: #fff;
    z-index: 10;
    padding: 10px 10px 5px;
    border-radius: 100px;
    transition: background-color .33s
}

._tag_yghix_2:hover {
    background-color: #ffffff80
}

._container_yghix_17 {
    color: #fff;
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-flow: column;
    background-color: #000000b3;
    z-index: 9;
    padding: 7em 5em 5em 10em;
    opacity: 0;
    animation: _showContainer_yghix_1 1s forwards;
    transition: background-color .33s
}

._singleButton_yghix_33 {
    padding: .5em 0
}

._button_text_yghix_37 {
    font-family: 思源宋体, serif;
    font-size: 250%;
    letter-spacing: .07em;
    transition: text-shadow .33s
}

._button_text_yghix_37:hover {
    text-shadow: 0 0 15px rgb(255, 255, 255)
}

@keyframes _showContainer_yghix_1 {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

._devPanelMain_11x6i_1 {
    font-size: 150%;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 35%;
    background: rgba(255, 255, 255, .75);
    z-index: 99;
    overflow: auto
}

._devPanelOpener_11x6i_13 {
    position: absolute;
    right: 5px;
    top: 5px;
    background: rgba(255, 255, 255, .75);
    z-index: 100;
    padding: 3px 7px;
    border-radius: 4px;
    cursor: pointer
}

._extra_hq9dj_2 {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 14;
    background: #fbf9eb;
    padding: 2em;
    box-sizing: border-box
}

._extra_top_hq9dj_14 {
    padding: 0;
    display: flex;
    height: 10%
}

._extra_top_icon_hq9dj_20 {
    padding: .6em .6em 0;
    border-radius: 1000px;
    transform: translateY(-13px);
    cursor: pointer
}

._extra_top_icon_hq9dj_20:hover {
    background: rgba(255, 255, 255, .25);
    animation: _extra_icon_softin_hq9dj_1 .25s ease-out forwards
}

@keyframes _extra_icon_softin_hq9dj_1 {
    0% {
        background: rgba(255, 255, 255, 0);
    }

    to {
        background: rgba(255, 255, 255, 0);
    }
}

._extra_title_hq9dj_40 {
    font-family: 思源宋体, serif;
    height: 100%;
    line-height: 100%;
    font-size: 325%;
    font-weight: 700;
    color: #fd91a4;
    background: none;
    -webkit-background-clip: text
}

._mainContainer_hq9dj_51 {
    box-sizing: border-box;
    padding: 0 2em;
    display: flex;
    height: 92%;
    flex-flow: column
}

._bgmContainer_hq9dj_59 {
    left: 50px;
    right: 50px;
    bottom: 30px;
    position: absolute;
    overflow: auto;
    box-sizing: border-box;
    display: flex;
    flex-flow: column-reverse;
    align-content: center;
    background: rgba(253, 145, 164, 0.95);
    padding: 1em 2em;
    border-radius: 4px;
    transition: max-height .5s;
    z-index: 2
}

._bgmListContainer_hq9dj_76 {
    z-index: 2;
    bottom: 0;
    width: 100%;
    box-sizing: border-box;
    display: flex;
    flex: 1;
    flex-flow: row;
    justify-content: flex-start;
    align-items: flex-start;
    margin: 0 0 15px;
    flex-wrap: wrap;
    overflow: auto
}

._bgmPlayerMain_hq9dj_91 {
    display: flex
}

._bgmControlButton_hq9dj_95 {
    padding: .6em 1.2em .2em;
    margin: 0 5px;
    box-sizing: border-box;
    border-radius: 4px;
    border: 1px solid rgba(255, 255, 255, .5);
    cursor: pointer;
    transition: background-color .33s, color .33s;
    flex-shrink: 0
}

._bgmControlButton_hq9dj_95:hover {
    box-shadow: 0 0 10px 5px #ffffff59
}

._bgmName_hq9dj_110 {
    color: #fffc;
    font-family: 思源宋体, serif;
    font-size: 155%;
    margin: 5px 5px 0 15px;
    overflow: hidden
}

._bgmElement_hq9dj_118 {
    font-family: 思源宋体, serif;
    padding: .5em 1em;
    overflow: hidden;
    background-color: #0000001a;
    border-radius: 5px;
    color: #fff;
    font-size: 125%;
    margin: .5em 1em .5em .5em;
    transition: background-color 1s, color 1s;
    opacity: 1;
    cursor: pointer;
    width: 28%;
    flex-shrink: 0
}

@keyframes _bgmElement_In_hq9dj_1 {
    0% {
        opacity: .95
    }

    to {
        opacity: 1
    }
}

._bgmElement_hq9dj_118:hover {
    background-color: #ffffffa6;
    color: #666;
    transition: background-color .5s, color .5s
}

._bgmElement_active_hq9dj_148 {
    background-color: #ffffffd9 !important;
    color: #666
}

._cgMain_hq9dj_153 {
    width: 100%;
    height: 88%
}

._cgContainer_hq9dj_158 {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
    height: 90%;
    box-sizing: border-box;
    padding: 4em 0 0 2em
}

._cgElement_hq9dj_170 {
    width: 22.5%;
    height: 37.5%;
    background-color: #ffffffbf;
    box-shadow: 0 0 15px 5px #00000059;
    box-sizing: border-box;
    padding: .75em;
    opacity: 0;
    margin: 1em;
    animation-delay: .1s;
    z-index: 1;
    position: relative;
    cursor: pointer
}

._cgShowDiv_hq9dj_185 {
    height: 8%;
    width: 100%;
    display: flex;
    flex-flow: row;
    justify-content: center;
    align-items: flex-end
}

._cgShowDivWarpper_hq9dj_194 {
    display: flex;
    flex-flow: row;
    justify-content: center;
    align-items: flex-end;
    border-radius: 7px;
    padding: 12px 15px
}

._cgNav_hq9dj_203 {
    font-size: 170%;
    background-color: #ffffff80;
    color: #666;
    padding: .12em 1em;
    margin: 0 .25em;
    text-align: center;
    cursor: pointer;
    transition: background-color .5s, color .5s, font-weight .5s;
    border-radius: 7px
}

._cgNav_hq9dj_203:first-child {
    margin-left: 0
}

._cgNav_hq9dj_203:last-child {
    margin-right: 0
}

._cgNav_active_hq9dj_223 {
    background-color: #ffffffb3 !important;
    color: #fd91a4
}

._cgNav_hq9dj_203:hover {
    color: #fd91a4;
    background-color: #fff9
}

._showFullContainer_hq9dj_233 {
    z-index: 13;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .1);
    display: flex;
    justify-content: center;
    align-items: center
}

._showFullCgMain_hq9dj_246 {
    cursor: pointer;
    width: 80%;
    height: 80%;
    box-sizing: border-box;
    padding: 2em;
    background: rgba(255, 255, 255, .95);
    animation: _fullCgIn_hq9dj_1 .5s ease-out forwards;
    opacity: 0
}

@keyframes _fullCgIn_hq9dj_1 {
    0% {
        opacity: 0;
        transform: scale(1.05) translate(-25px, -50px) rotateX(-10deg) rotateY(10deg)
    }

    to {
        opacity: 1;
        transform: scale(1) translateZ(0)
    }
}

@keyframes cg_softIn_-5 {
    0% {
        opacity: 0;
        transform: scale(1.15) translate(-50px, -125px) rotateX(-25deg) rotateY(25deg)
    }

    to {
        opacity: 1;
        transform: scale(1) translateZ(0)rotate(-5deg)
    }
}

@keyframes cg_softIn_-4 {
    0% {
        opacity: 0;
        transform: scale(1.15) translate(-50px, -125px) rotateX(-25deg) rotateY(25deg)
    }

    to {
        opacity: 1;
        transform: scale(1) translateZ(0)rotate(-4deg)
    }
}

@keyframes cg_softIn_-3 {
    0% {
        opacity: 0;
        transform: scale(1.15) translate(-50px, -125px) rotateX(-25deg) rotateY(25deg)
    }

    to {
        opacity: 1;
        transform: scale(1) translateZ(0)rotate(-3deg)
    }
}

@keyframes cg_softIn_-2 {
    0% {
        opacity: 0;
        transform: scale(1.15) translate(-50px, -125px) rotateX(-25deg) rotateY(25deg)
    }

    to {
        opacity: 1;
        transform: scale(1) translateZ(0)rotate(-2deg)
    }
}

@keyframes cg_softIn_-1 {
    0% {
        opacity: 0;
        transform: scale(1.15) translate(-50px, -125px) rotateX(-25deg) rotateY(25deg)
    }

    to {
        opacity: 1;
        transform: scale(1) translateZ(0)rotate(-1deg)
    }
}

@keyframes cg_softIn_0 {
    0% {
        opacity: 0;
        transform: scale(1.15) translate(-50px, -125px) rotateX(-25deg) rotateY(25deg)
    }

    to {
        opacity: 1;
        transform: scale(1) translateZ(0)rotate(0)
    }
}

@keyframes cg_softIn_1 {
    0% {
        opacity: 0;
        transform: scale(1.15) translate(-50px, -125px) rotateX(-25deg) rotateY(25deg)
    }

    to {
        opacity: 1;
        transform: scale(1) translateZ(0)rotate(1deg)
    }
}

@keyframes cg_softIn_2 {
    0% {
        opacity: 0;
        transform: scale(1.15) translate(-50px, -125px) rotateX(-25deg) rotateY(25deg)
    }

    to {
        opacity: 1;
        transform: scale(1) translateZ(0)rotate(2deg)
    }
}

@keyframes cg_softIn_3 {
    0% {
        opacity: 0;
        transform: scale(1.15) translate(-50px, -125px) rotateX(-25deg) rotateY(25deg)
    }

    to {
        opacity: 1;
        transform: scale(1) translateZ(0)rotate(3deg)
    }
}

@keyframes cg_softIn_4 {
    0% {
        opacity: 0;
        transform: scale(1.15) translate(-50px, -125px) rotateX(-25deg) rotateY(25deg)
    }

    to {
        opacity: 1;
        transform: scale(1) translateZ(0)rotate(4deg)
    }
}

@keyframes cg_softIn_5 {
    0% {
        opacity: 0;
        transform: scale(1.15) translate(-50px, -125px) rotateX(-25deg) rotateY(25deg)
    }

    to {
        opacity: 1;
        transform: scale(1) translateZ(0)rotate(5deg)
    }
}

._Logo_main_1bne2_1 {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    animation: _change-img-anim_1bne2_1 5s forwards;
    background-size: cover;
    z-index: 14
}

@keyframes _change-img-anim_1bne2_1 {
    0% {
        opacity: 0
    }

    35% {
        opacity: 1
    }

    65% {
        opacity: 1
    }

    99% {
        opacity: 0
    }

    to {
        opacity: 0;
        display: none
    }
}

._Logo_Back_1bne2_32 {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    opacity: 1;
    bottom: 0;
    background-size: cover;
    z-index: 14;
    background: #fbf9eb
}

._animationActive_1bne2_46 {
    animation: _fadeout_1bne2_1 5s forwards
}

@keyframes _fadeout_1bne2_1 {
    0% {
        opacity: 1
    }

    99% {
        opacity: 0
    }

    to {
        opacity: 0;
        display: none
    }
}

._Menu_main_1a7i6_1 {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 16;
    animation: _Menu_ShowSoftly_1a7i6_1 .5s forwards;
    background: #fbf9eb
}

._Menu_TagContent_1a7i6_10 {
    width: 100%;
    height: 90%
}

@keyframes _Menu_ShowSoftly_1a7i6_1 {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

._MenuPanel_main_1c9ky_1 {
    width: 100%;
    height: 10%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 55px
}

._MenuPanel_button_1c9ky_10 {
    padding: .25em 15px 0;
    margin-right: 15px;
    display: flex;
    justify-content: center;
    font-size: 200%;
    text-align: center;
    border-radius: 6px;
    min-width: 12.5%;
    cursor: pointer;
    color: #7b90a9;
    background: rgba(0, 0, 0, 0);
    overflow: hidden;
    transition: text-shadow .7s, background-color .7s
}

._MenuPanel_button_1c9ky_10:last-child {
    margin-right: 0
}

._MenuPanel_button_1c9ky_10:hover {
    background-color: #f5f6f726
}

._MenuPanel_button_1c9ky_10:last-child {
    border-right: none
}

._MenuPanel_button_icon_1c9ky_38 {
    transform: translateY(.125em);
    padding: 0 .15em 0 0;
    margin: 0 .15em 0 0
}

._MenuPanel_button_hl_1c9ky_44 {
    background-color: #f5f6f759 !important
}

._Options_main_ili7y_2 {
    position: absolute;
    cursor: default;
    height: 90%;
    width: 100%
}

._Options_top_ili7y_9 {
    height: 15%;
    width: 100%;
    display: flex;
    align-items: flex-start
}

._Options_title_ili7y_16 {
    font-family: 思源宋体, serif;
    letter-spacing: .1em;
    font-size: 225%;
    margin: .5em 0;
    padding: .2em 2em .2em 1.1em;
    box-sizing: border-box
}

._Option_title_text_ili7y_25 {
    font-size: 165%;
    font-weight: 700;
    color: transparent;
    background: linear-gradient(to left, #fd91a4, rgb(253, 145, 164));
    -webkit-background-clip: text;
    animation: _Elements_in_ili7y_1 ease-out .7s forwards
}

._Option_title_text_shadow_ili7y_34 {
    position: absolute;
    color: #0000;
    -webkit-text-stroke: 3px rgb(0, 0, 0);
    z-index: -1
}

._Option_title_text_ts_ili7y_41 {
    position: absolute;
    color: #0000;
    text-shadow: .04em .04em rgba(253, 145, 164, .9), .05em .05em rgba(253, 145, 164, .9), .06em .06em rgba(253, 145, 164, .9), .07em .07em rgba(253, 145, 164, .9);
    z-index: -1
}

._Options_main_content_ili7y_48 {
    display: flex;
    flex: 1;
    padding: 0 0 0 3em;
    overflow: auto
}

._Options_main_content_half_ili7y_55 {
    width: 95%;
    display: flex;
    flex-flow: row;
    align-items: flex-start;
    align-content: flex-start;
    flex-wrap: wrap;
    padding: 0 1em;
    position: relative
}

._About_title_text_ili7y_66 {
    margin: .2em 1em;
    padding: .2em;
    position: absolute;
    top: 10px;
    right: 10px;
    animation: _Elements_in_ili7y_1 ease-out .7s forwards;
    cursor: pointer
}

._About_text_ili7y_76 {
    font-weight: 700;
    color: transparent;
    background: linear-gradient(to left, rgba(253, 145, 164, .65), rgba(253, 145, 164, .65));
    -webkit-background-clip: text;
    font-size: 135%;
    text-decoration: underline
}

@keyframes _Elements_in_ili7y_1 {
    0% {
        opacity: 0;
        transform: scale(1.03) translate(-25px, -20px)
    }

    to {
        opacity: 1;
        transform: scale(1) translate(0)
    }
}

._Options_page_container_ili7y_95 {
    height: 85%;
    display: flex;
    padding: 1em 3.75em
}

._Options_button_list_ili7y_101 {
    animation: _Elements_in_ili7y_1 ease-out .7s forwards
}

._Options_page_button_ili7y_105 {
    font-family: 思源宋体, serif;
    font-size: 300%;
    font-weight: 700;
    color: transparent;
    background: linear-gradient(to left, #fd91a4, rgb(253, 145, 164));
    opacity: .35;
    -webkit-background-clip: text;
    transition: color .33s, background-image .33s, opacity .33s;
    cursor: pointer
}

._Options_page_button_active_ili7y_117 {
    background-image: linear-gradient(to left, #fd91a4, rgb(253, 145, 164));
    -webkit-background-clip: text;
    opacity: 1
}

._Options_page_button_ili7y_105:hover {
    opacity: 1
}

._NormalOption_ogzuv_1 {
    margin: .2em 1em;
    padding: .2em;
    display: flex;
    flex-flow: column;
    align-items: flex-start;
    animation: _Elements_in_ogzuv_1 ease-out .7s forwards
}

._NormalOption_title_ogzuv_10 {
    color: transparent;
    background: linear-gradient(to left, #000000, rgb(0, 0, 0));
    -webkit-background-clip: text;
    font-size: 200%;
    padding: .15em .5em .15em .1em;
    font-weight: 700
}

._NormalOption_title_bef_ogzuv_19 {
    font-weight: 700;
    font-size: 200%;
    content: attr(data-text);
    position: absolute;
    -webkit-text-stroke: 3px rgb(0, 0, 0);
    z-index: -1;
    padding: .15em .5em .15em .1em
}

._NormalOption_title_sd_ogzuv_29 {
    font-weight: 700;
    color: #0000;
    font-size: 200%;
    position: absolute;
    z-index: -1;
    padding: .15em .5em .15em .1em;
    text-shadow: .04em .04em rgba(253, 145, 164, .9), .05em .05em rgba(253, 145, 164, .9), .06em .06em rgba(253, 145, 164, .9), .07em .07em rgba(253, 145, 164, .9), .08em .08em rgba(253, 145, 164, .9), .09em .09em rgba(253, 145, 164, .9), .1em .1em rgba(253, 145, 164, .9)
}

._NormalOption_buttonList_ogzuv_39 {
    padding: .5em 0;
    display: flex
}

@keyframes _Elements_in_ogzuv_1 {
    0% {
        opacity: 0;
        transform: scale(1.03) translate(-25px, -20px)
    }

    to {
        opacity: 1;
        transform: scale(1) translate(0)
    }
}

._NormalButton_1qk3b_1 {
    font-size: 150%;
    box-sizing: border-box;
    padding: .2em 1em;
    background-color: #fbf9eb;
    margin: 0 .4em 0 0;
    color: #000000;
    cursor: pointer;
    border-bottom: 2px solid transparent
}

._NormalButton_1qk3b_1:hover {
    border-bottom: 2px solid rgba(253, 145, 164, .9);
    color: #fd91a4;
    font-weight: 700
}

._NormalButtonChecked_1qk3b_18 {
    background-color: rgba(251, 249, 235, 0.9);
    border-bottom: 2px solid rgba(253, 145, 164, .9);
    color: #fd91a4;
    font-weight: 700
}

._backButton_qbk37_1 {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
    background: rgba(0, 0, 0, .1);
    border-radius: 4px;
    cursor: pointer
}

._backButton_qbk37_1:hover {
    background: rgba(0, 0, 0, .2)
}

._about_qbk37_16 {
    padding: 10px 0 0
}

._icon_qbk37_20 {
    display: inline-flex
}

._title_qbk37_24 {
    color: transparent;
    background: linear-gradient(to left, #227D51, rgb(81, 110, 65));
    -webkit-background-clip: text;
    font-size: 200%;
    padding: .15em .5em .15em .1em;
    font-weight: 700;
    margin-top: 20px
}

._text_qbk37_34 {
    color: #516e41;
    padding: 0 0 0 10px;
    font-size: 135%
}

._text_qbk37_34 a {
    color: #516e41
}

._contributor_qbk37_43 {
    padding: 0 10px 0 0
}

input[type=range] {
    -webkit-appearance: none;
    width: 500px;
    height: 50px;
    background: transparent;
    font-size: 100%
}

input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none
}

input[type=range]:focus {
    outline: none
}

input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    height: 375%;
    width: 7.2%;
    border-radius: 5em;
    background: #ffffff;
    cursor: pointer;
    margin-top: -14px;
    box-shadow: 0 0 5px #00000080
}

input[type=range]::-webkit-slider-runnable-track {
    width: 100%;
    height: 20%;
    cursor: pointer;
    box-shadow: 1px 1px 7px #0000004d;
    background: rgba(253, 145, 164, .9);
    border-radius: 2em
}

input[type=range]:focus::-webkit-slider-runnable-track {
    background: rgba(253, 145, 164, .9)
}

input[type=range]::-moz-range-thumb {
    height: 36px;
    width: 7.2%;
    border-radius: 5em;
    background: #ffffff;
    cursor: pointer;
    box-shadow: 0 0 5px #00000080
}

input[type=range]::-moz-range-track {
    width: 100%;
    height: 20%;
    cursor: pointer;
    box-shadow: 1px 1px 7px #0000004d;
    background: rgba(253, 145, 164, .9);
    border-radius: 2em
}

.Option_WebGAL_slider {
    position: relative
}

.bubble {
    position: absolute;
    bottom: calc(100% + 10px);
    transform: translate(-50%);
    background: rgba(0, 0, 0, .85);
    color: #fff;
    padding: 6px 12px;
    border-radius: 6px;
    font-weight: 700;
    white-space: nowrap;
    pointer-events: none;
    opacity: 0;
    animation: bubbleFadeIn .2s ease-out forwards
}

.bubble:after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%);
    border-width: 6px;
    border-style: solid;
    border-color: rgba(0, 0, 0, .85) transparent transparent transparent
}

@keyframes bubbleFadeIn {
    0% {
        opacity: 0;
        transform: translate(-50%) translateY(4px)
    }

    to {
        opacity: 1;
        transform: translate(-50%) translateY(0)
    }
}

._textPreviewMain_nolr3_1 {
    z-index: 1;
    padding: 1em;
    min-height: 480px;
    width: 100%
}

._textbox_nolr3_8 {
    width: 100%;
    height: 100%;
    position: relative
}

._panic_overlay_main_1ysz4_1 {
    margin: 0;
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: #fff;
    z-index: 256
}

._yoozle_blue_1r48o_1 {
    color: #4285f4
}

._yoozle_red_1r48o_5 {
    color: #db4437
}

._yoozle_yellow_1r48o_9 {
    color: #f4b400
}

._yoozle_green_1r48o_13 {
    color: #0f9d58
}

._yoozle_e_rotate_1r48o_17 {
    display: inline-block;
    transform: rotate(-12deg)
}

._yoozle_container_1r48o_22 {
    display: flex;
    flex-direction: column;
    height: 100%
}

._yoozle_title_1r48o_28 {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 80px;
    font-family: arial, sans-serif;
    font-size: 90px
}

._yoozle_search_1r48o_37 {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px 10px
}

._yoozle_search_bar_1r48o_44 {
    width: 40%;
    line-height: 32px;
    font-family: arial, sans-serif;
    font-size: 18px
}

._yoozle_search_buttons_1r48o_51 {
    padding-top: 13px
}

._yoozle_button_1r48o_55 {
    background-color: #f8f9fa;
    border: 1px solid #f8f9fa;
    border-radius: 4px;
    color: #3c4043;
    font-family: arial, sans-serif;
    font-size: 14px;
    margin: 11px 4px;
    padding: 0 16px;
    line-height: 27px;
    height: 36px;
    min-width: 54px;
    text-align: center;
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none
}

._yoozle_button_1r48o_55:hover {
    box-shadow: 0 1px 1px #0000001a;
    border: 1px solid #dadce0;
    color: #202124
}

._yoozle_button_1r48o_55:focus {
    border: 1px solid #4285f4;
    outline: none
}

._Title_main_1p5oo_1 {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 13
}

._Title_buttonList_1p5oo_8 {
    display: flex;
    position: absolute;
    left: 0;
    min-width: 25%;
    height: 100%;
    justify-content: center;
    align-items: flex-start;
    flex-flow: column;
    transition: background .75s;
    padding-left: 120px
}

._Title_button_1p5oo_8 {
    font-weight: 700;
    text-align: center;
    flex: 0 1 auto;
    cursor: pointer;
    padding: 1em 2em;
    margin: 20px 0;
    transition: all .33s;
    background: rgba(255, 255, 255, .15);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    border-radius: 4px;
    transform: skew(-10deg);
    background: linear-gradient(to right, rgba(0, 0, 0, .3), rgba(0, 0, 0, .1))
}

._Title_button_1p5oo_8:hover {
    text-shadow: 0 0 10px rgb(255, 255, 255);
    padding: 1em 6em 1em 3em
}

._Title_button_text_1p5oo_41 {
    font-size: 165%;
    color: #fbfbfb;
    padding: 0 .5em;
    letter-spacing: .2em
}

._Title_backup_background_1p5oo_48 {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 13;
    background: #fbf9eb
}

._Title_button_disabled_1p5oo_56 {
    cursor: not-allowed !important;
    opacity: .5
}

._trans_8uz61_2 {
    height: 100%;
    width: 100%;
    background: #fbf9eb;
    position: absolute;
    z-index: 20
}

._langWrapper_8uz61_10 {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    flex-flow: column
}

._lang_8uz61_10 {
    width: 100%;
    text-align: center;
    font-family: 思源宋体, serif;
    color: transparent;
    font-size: 300%;
    background: linear-gradient(150deg, rgb(255, 255, 255) 0%, rgb(255, 255, 255) 75%, #f8c3cc 100%);
    -webkit-background-clip: text
}

._langSelect_8uz61_29 {
    display: flex;
    gap: 50px;
    padding: 50px
}

._langSelectButton_8uz61_35 {
    font-family: 思源宋体, serif;
    cursor: pointer;
    font-size: 200%;
    color: #fff;
    border-radius: 4px;
    border: 1px solid rgba(255, 255, 255, .8);
    padding: 10px 50px;
    transition: color .33s, background-color .33s
}

._langSelectButton_8uz61_35:hover {
    background: white;
    color: #f8c3cc
}

@keyframes centerIn {
    0% {
        opacity: 0;
        transform: scale(1)
    }

    to {
        opacity: 1;
        transform: scale(1)
    }
}

@keyframes upIn {
    0% {
        opacity: 0;
        transform: scale(1) translateY(3%)
    }

    to {
        opacity: 1;
        transform: scale(1) translate(0)
    }
}

@keyframes leftIn {
    0% {
        opacity: 0;
        transform: scale(1) translate(-3%)
    }

    to {
        opacity: 1;
        transform: scale(1) translate(0)
    }
}

@keyframes rightIn {
    0% {
        opacity: 0;
        transform: scale(1) translate(3%)
    }

    to {
        opacity: 1;
        transform: scale(1) translate(0)
    }
}

@keyframes bg_down {
    0% {
        opacity: 0;
        transform: scale(1.1) translateY(-3%)
    }

    to {
        opacity: 1;
        transform: scale(1) translate(0)
    }
}

@keyframes bg_softIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes hideBG {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

@keyframes shake {
    0% {
        transform: translate(0)
    }

    25% {
        transform: translate(-2%)
    }

    75% {
        transform: translate(2%)
    }

    to {
        transform: translate(0)
    }
}

@keyframes moveBaF {
    0% {
        transform: scale(1)
    }

    50% {
        transform: scale(1.1)
    }

    to {
        transform: scale(1)
    }
}

@keyframes showSoftly {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes elementFadeIn {
    0% {
        transform: translate(-15px, -20px) scale(1.03);
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes controlButtonHover {
    0% {
        background-color: #0000;
        box-shadow: none
    }

    to {
        background-color: #ffffff40;
        box-shadow: 5px 5px 15px #000000a6
    }
}

@keyframes controlButtonHoverBack {}

@keyframes TitleButtonOnChoose {
    0% {
        transform: scale(1)
    }

    to {
        transform: scale(1.1)
    }
}

@keyframes TitleButtonNoneChoose {
    0% {
        transform: scale(1.1)
    }
}

@keyframes TitleModelHover {
    0% {
        background-color: #00000059
    }

    to {
        background-color: #000000a6
    }
}

@keyframes TitleModelNoneHover {
    0% {
        background-color: #000000a6
    }

    to {
        background-color: #00000059
    }
}

@keyframes bg_focusLeft {
    0% {
        transform: scale(1) translate(0);
        filter: blur(0)
    }

    to {
        transform: scale(1.15) translate(5%);
        filter: blur(1px)
    }
}

@keyframes bg_focusRight {
    0% {
        transform: scale(1) translate(0);
        filter: blur(0)
    }

    to {
        transform: scale(1.15) translate(-5%);
        filter: blur(1px)
    }
}

@keyframes bg_LtoR {
    0% {
        transform: scale(1.15) translate(5%);
        filter: blur(1px)
    }

    to {
        transform: scale(1.15) translate(-5%);
        filter: blur(1px)
    }
}

@keyframes bg_RtoL {
    0% {
        transform: scale(1.15) translate(-5%);
        filter: blur(1px)
    }

    to {
        transform: scale(1.15) translate(5%);
        filter: blur(1px)
    }
}

@keyframes bg_LtoC {
    0% {
        transform: scale(1.15) translate(5%);
        filter: blur(1px)
    }

    to {
        transform: scale(1) translate(0);
        filter: blur(0)
    }
}

@keyframes bg_RtoC {
    0% {
        transform: scale(1.15) translate(-5%);
        filter: blur(1px)
    }

    to {
        transform: scale(1) translate(0);
        filter: blur(0)
    }
}

@keyframes bg_focus {
    0% {
        transform: scale(1) translate(0);
        filter: blur(0)
    }

    to {
        transform: scale(1.15);
        filter: blur(1px)
    }
}

@keyframes bg_LtoF {
    0% {
        transform: scale(1.15) translate(5%);
        filter: blur(1px)
    }

    to {
        transform: scale(1.15);
        filter: blur(1px)
    }
}

@keyframes bg_RtoF {
    0% {
        transform: scale(1.15) translate(-5%);
        filter: blur(1px)
    }

    to {
        transform: scale(1.15);
        filter: blur(1px)
    }
}

@keyframes bg_FtoL {
    0% {
        transform: scale(1.15);
        filter: blur(1px)
    }

    to {
        transform: scale(1.15) translate(5%);
        filter: blur(1px)
    }
}

@keyframes bg_FtoR {
    0% {
        transform: scale(1.15);
        filter: blur(1px)
    }

    to {
        transform: scale(1.15) translate(-5%);
        filter: blur(1px)
    }
}

@keyframes bg_FtoC {
    0% {
        transform: scale(1.15);
        filter: blur(1px)
    }

    to {
        transform: scale(1) translate(0);
        filter: blur(0)
    }
}

*,
*:before,
*:after {
    box-sizing: border-box
}

body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd {
    margin: 0
}

ul[role=list],
ol[role=list] {
    list-style: none
}

html:focus-within {
    scroll-behavior: smooth
}

body {
    min-height: 100vh;
    text-rendering: optimizeSpeed;
    line-height: 1.5
}

a:not([class]) {
    text-decoration-skip-ink: auto
}

img,
picture {
    max-width: 100%;
    display: block
}

input,
button,
textarea,
select {
    font: inherit
}

@media (prefers-reduced-motion:reduce) {
    html:focus-within {
        scroll-behavior: auto
    }

    *,
    *:before,
    *:after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important
    }
}