#app.hoverable .ui-text[data-v-350cebca] .card:hover,
#app.hoverable .ui-text[data-v-350cebca] .status:hover {
    text-decoration: none
}

#app.hoverable .ui-text[data-v-350cebca] .card:active,
#app.hoverable .ui-text[data-v-350cebca] .status:active {
    opacity: .5
}

.ui-text[data-v-350cebca] {
    display: block
}

.ui-text[data-v-350cebca] .card,
.ui-text[data-v-350cebca] .status {
    text-decoration: underline;
    display: inline-block
}

.ui-text[data-v-350cebca] .card:active,
.ui-text[data-v-350cebca] .status:active {
    text-decoration: none
}

.ui-stat[data-v-65a810ba] {
    display: inline-block;
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    font-size: 4rem;
    line-height: .9em
}

.ui-stat.size-80[data-v-65a810ba] {
    font-size: 6.4rem;
    line-height: .9em;
    width: 104px;
    height: 104px
}

.ui-stat.life[data-v-65a810ba] {
    padding-bottom: 4px
}

.ui-stat.armor[data-v-65a810ba] {
    padding-bottom: 8px
}

.ui-stat.attack[data-v-65a810ba] {
    transform: scale(1.1)
}

.ui-stat.poison[data-v-65a810ba],
.ui-stat.strength[data-v-65a810ba],
.ui-stat.weakness[data-v-65a810ba] {
    color: #363850
}

.ui-stat.poison .value[data-v-65a810ba],
.ui-stat.strength .value[data-v-65a810ba],
.ui-stat.weakness .value[data-v-65a810ba] {
    position: absolute;
    left: 25%;
    top: 25%;
    right: 25%;
    bottom: 25%;
    transform: translate(60%, 60%);
    background-color: #fff;
    border-radius: 50%;
    box-shadow: 0 0 8px rgba(0, 0, 0, .25);
    text-shadow: -1px -1px #fff, -1px 1px #fff, 1px -1px #fff, 1px 1px #fff
}

.ui-stat.poison .icon[data-v-65a810ba],
.ui-stat.strength .icon[data-v-65a810ba],
.ui-stat.weakness .icon[data-v-65a810ba] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.ui-stat.poison .icon[data-v-65a810ba] {
    transform: scaleX(-1)
}

.ui-stat .icon[data-v-65a810ba] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: 50% no-repeat;
    background-size: contain
}

.ui-stat .no-icon[data-v-65a810ba] {
    position: absolute;
    left: 4px;
    top: 4px;
    right: 4px;
    bottom: 4px;
    background: #d22a2a;
    border-radius: 50%
}

.card[data-v-f4a9f46a] {
    width: 228px;
    height: 318px;
    box-shadow: -4px 4px 4px 4px rgba(0, 0, 0, .5);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    color: #363850;
    font-size: 2.6rem;
    line-height: .9em;
    line-height: 20px
}

.card.card-shield .illustration[data-v-f4a9f46a],
.card.card-weapon .illustration[data-v-f4a9f46a] {
    top: 56px
}

.card.card-weapon .durability .dot[data-v-f4a9f46a] {
    background-color: #f69e21
}

.card.card-shield .durability .dot[data-v-f4a9f46a] {
    background-color: #646f9e
}

.card.card-scroll .bg[data-v-f4a9f46a] {
    top: -40px;
    left: -25px;
    right: -25px
}

.card.card-scroll .illustration[data-v-f4a9f46a] {
    top: -28px;
    left: calc(50% - 8px)
}

.card.card-scroll .name[data-v-f4a9f46a] {
    bottom: 142px;
    height: 56px;
    padding: 0 16px
}

.card.card-scroll .description[data-v-f4a9f46a] {
    height: 130px
}

.card .bg[data-v-f4a9f46a] {
    position: absolute;
    left: -1px;
    top: -1px;
    right: -1px;
    bottom: -1px;
    background: 50% no-repeat;
    background-size: 100% 100%;
    pointer-events: none
}

.card .durability[data-v-f4a9f46a] {
    position: absolute;
    left: 0;
    right: 0;
    top: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row
}

.card .durability .dot[data-v-f4a9f46a] {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 3px solid #fbf1e0
}

.card .illustration[data-v-f4a9f46a] {
    position: absolute;
    left: 50%;
    top: 48px;
    transform: translateX(-50%)
}

.card .illustration .img[data-v-f4a9f46a] {
    width: 114px;
    height: 114px;
    background: 50% no-repeat;
    background-size: contain
}

.card .name[data-v-f4a9f46a] {
    bottom: 110px;
    height: 40px;
    padding: 0 8px;
    font-size: 3.2rem;
    line-height: .9em
}

.card .description[data-v-f4a9f46a],
.card .name[data-v-f4a9f46a] {
    position: absolute;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    line-height: 20px
}

.card .description[data-v-f4a9f46a] {
    bottom: 8px;
    padding: 0 24px;
    height: 120px
}

.card .value[data-v-f4a9f46a] {
    position: absolute;
    left: -28px;
    top: -28px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    color: #fff;
    font-size: 6.4rem;
    line-height: .9em
}

.ui-close-hint[data-v-5d2150af] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 40px;
    font-size: 2rem;
    line-height: .9em;
    color: #fff;
    opacity: 0;
    text-align: center;
    opacity: .1;
    -webkit-animation: hint-data-v-5d2150af 3s linear infinite alternate;
    animation: hint-data-v-5d2150af 3s linear infinite alternate
}

@-webkit-keyframes hint-data-v-5d2150af {
    0% {
        opacity: .1
    }
    to {
        opacity: .3
    }
}

@keyframes hint-data-v-5d2150af {
    0% {
        opacity: .1
    }
    to {
        opacity: .3
    }
}

.popup-card[data-v-8a31cc62] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    color: #e0bb86;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    text-align: center
}

.popup-card .content[data-v-8a31cc62] {
    max-width: 360px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    transform: translateY(-24px)
}

.popup-card .content>.name[data-v-8a31cc62] {
    width: 100%;
    font-size: 4rem;
    line-height: .9em;
    text-align: center;
    line-height: .8em
}

.popup-card .content>.rarity[data-v-8a31cc62] {
    margin: 0 0 8px 0;
    opacity: 1;
    color: #d1b995;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    font-size: 2rem;
    line-height: .9em
}

.popup-card .content>.rarity .icon[data-v-8a31cc62] {
    display: inline-block;
    width: 8px;
    height: 8px;
    margin: 0 12px 0 0;
    box-shadow: 0 0 0 3px #d1b995;
    transform: rotate(45deg) translate(-1px, -1px)
}

.popup-card .content>.rarity.common .icon[data-v-8a31cc62] {
    background-color: #292a3c
}

.popup-card .content>.rarity.rare .icon[data-v-8a31cc62] {
    background-color: #047bd0
}

.popup-card .content>.rarity.legendary .icon[data-v-8a31cc62] {
    background-color: #b400ff
}

.popup-card .content .card-wrap[data-v-8a31cc62] {
    margin: 72px 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    transform: scale(1.5)
}

.popup-card .content .example[data-v-8a31cc62] {
    width: 100%;
    margin: -12px 0 16px 0;
    text-align: center;
    font-size: 2rem;
    line-height: .9em;
    line-height: 1em;
    opacity: .5
}

.popup-card .content .description[data-v-8a31cc62] {
    width: 100%;
    margin: 0 0 16px 0;
    font-size: 2.4rem;
    line-height: .9em;
    text-align: center
}

.popup-card .content .description[data-v-8a31cc62]:last-child {
    margin: 0
}

.popup-card .content .description[data-v-8a31cc62] .ui-score {
    transform: translateY(1px)
}

.popup-card .content .buttons[data-v-8a31cc62] {
    padding: 16px 0 0 0
}

.popup-card .content .deactivate-warning[data-v-8a31cc62] {
    margin: 16px 0 0 0;
    opacity: .5;
    font-size: 2rem;
    line-height: .9em
}

.popup-game-menu[data-v-10a1129b] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row
}

.popup-game-menu .bg[data-v-10a1129b],
.popup-game-menu[data-v-10a1129b] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.popup-game-menu .content[data-v-10a1129b] {
    max-width: 340px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    transform: translateY(-48px);
    text-align: center;
    color: #fff
}

.popup-game-menu .content .title[data-v-10a1129b] {
    margin: 0 0 80px 0;
    font-size: 8rem;
    line-height: .9em
}

.popup-game-menu .content .separator[data-v-10a1129b] {
    width: 100%;
    margin: 16px 0
}

.popup-game-menu .content .link[data-v-10a1129b] {
    display: inline-block;
    height: 48px;
    padding: 0 24px;
    margin: 4px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    color: #fff;
    font-size: 4rem;
    line-height: .9em
}

.popup-game-menu .content .link[data-v-10a1129b]:hover {
    opacity: .5
}

.ui-slider[data-v-1b4e27f2] {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row
}

.ui-slider .button[data-v-1b4e27f2] {
    height: 100%;
    width: 40px;
    height: 32px;
    font-size: 3.2rem;
    line-height: .9em;
    line-height: 32px;
    text-align: center
}

.ui-slider .button[data-v-1b4e27f2]:active {
    transform: translateY(2px)
}

.ui-slider .bars[data-v-1b4e27f2] {
    height: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: row;
    padding-top: 2px
}

.ui-slider .bars.musics .bar[data-v-1b4e27f2]:first-child {
    transform: translateY(-1px) rotate(-2deg)
}

.ui-slider .bars.musics .bar[data-v-1b4e27f2]:nth-child(2) {
    transform: translateY(1px) rotate(-2deg)
}

.ui-slider .bars.musics .bar[data-v-1b4e27f2]:nth-child(3) {
    transform: translateY(1px) rotate(-5deg)
}

.ui-slider .bars.musics .bar[data-v-1b4e27f2]:nth-child(4) {
    transform: translateY(1px) rotate(6deg)
}

.ui-slider .bars.musics .bar[data-v-1b4e27f2]:nth-child(5) {
    transform: translateY(0) rotate(0deg)
}

.ui-slider .bars.musics .bar[data-v-1b4e27f2]:nth-child(6) {
    transform: translateY(-1px) rotate(-3deg)
}

.ui-slider .bars.musics .bar[data-v-1b4e27f2]:nth-child(7),
.ui-slider .bars.musics .bar[data-v-1b4e27f2]:nth-child(8),
.ui-slider .bars.musics .bar[data-v-1b4e27f2]:nth-child(9) {
    transform: translateY(1px) rotate(6deg)
}

.ui-slider .bars.musics .bar[data-v-1b4e27f2]:nth-child(10) {
    transform: translateY(1px) rotate(-2deg)
}

.ui-slider .bars.musics .bar[data-v-1b4e27f2]:nth-child(11) {
    transform: translateY(1px) rotate(4deg)
}

.ui-slider .bars.musics .bar[data-v-1b4e27f2]:nth-child(12) {
    transform: translateY(-1px) rotate(5deg)
}

.ui-slider .bars.musics .bar[data-v-1b4e27f2]:nth-child(13) {
    transform: translateY(1px) rotate(2deg)
}

.ui-slider .bars.musics .bar[data-v-1b4e27f2]:nth-child(14) {
    transform: translateY(0) rotate(-5deg)
}

.ui-slider .bars.musics .bar[data-v-1b4e27f2]:nth-child(15) {
    transform: translateY(1px) rotate(-1deg)
}

.ui-slider .bars.musics .bar[data-v-1b4e27f2]:nth-child(16) {
    transform: translateY(-1px) rotate(5deg)
}

.ui-slider .bars.musics .bar[data-v-1b4e27f2]:nth-child(17) {
    transform: translateY(0) rotate(-5deg)
}

.ui-slider .bars.musics .bar[data-v-1b4e27f2]:nth-child(18),
.ui-slider .bars.musics .bar[data-v-1b4e27f2]:nth-child(19) {
    transform: translateY(1px) rotate(-4deg)
}

.ui-slider .bars.musics .bar[data-v-1b4e27f2]:nth-child(20) {
    transform: translateY(-1px) rotate(-4deg)
}

.ui-slider .bars.sounds .bar[data-v-1b4e27f2]:first-child {
    transform: translateY(0) rotate(6deg)
}

.ui-slider .bars.sounds .bar[data-v-1b4e27f2]:nth-child(2) {
    transform: translateY(-1px) rotate(-1deg)
}

.ui-slider .bars.sounds .bar[data-v-1b4e27f2]:nth-child(3) {
    transform: translateY(1px) rotate(6deg)
}

.ui-slider .bars.sounds .bar[data-v-1b4e27f2]:nth-child(4) {
    transform: translateY(-1px) rotate(-6deg)
}

.ui-slider .bars.sounds .bar[data-v-1b4e27f2]:nth-child(5) {
    transform: translateY(0) rotate(2deg)
}

.ui-slider .bars.sounds .bar[data-v-1b4e27f2]:nth-child(6) {
    transform: translateY(-1px) rotate(3deg)
}

.ui-slider .bars.sounds .bar[data-v-1b4e27f2]:nth-child(7) {
    transform: translateY(1px) rotate(-3deg)
}

.ui-slider .bars.sounds .bar[data-v-1b4e27f2]:nth-child(8) {
    transform: translateY(1px) rotate(0deg)
}

.ui-slider .bars.sounds .bar[data-v-1b4e27f2]:nth-child(9) {
    transform: translateY(1px) rotate(-4deg)
}

.ui-slider .bars.sounds .bar[data-v-1b4e27f2]:nth-child(10) {
    transform: translateY(0) rotate(-1deg)
}

.ui-slider .bars.sounds .bar[data-v-1b4e27f2]:nth-child(11) {
    transform: translateY(1px) rotate(0deg)
}

.ui-slider .bars.sounds .bar[data-v-1b4e27f2]:nth-child(12) {
    transform: translateY(-1px) rotate(0deg)
}

.ui-slider .bars.sounds .bar[data-v-1b4e27f2]:nth-child(13) {
    transform: translateY(0) rotate(5deg)
}

.ui-slider .bars.sounds .bar[data-v-1b4e27f2]:nth-child(14) {
    transform: translateY(1px) rotate(1deg)
}

.ui-slider .bars.sounds .bar[data-v-1b4e27f2]:nth-child(15) {
    transform: translateY(0) rotate(-4deg)
}

.ui-slider .bars.sounds .bar[data-v-1b4e27f2]:nth-child(16) {
    transform: translateY(1px) rotate(0deg)
}

.ui-slider .bars.sounds .bar[data-v-1b4e27f2]:nth-child(17) {
    transform: translateY(-1px) rotate(3deg)
}

.ui-slider .bars.sounds .bar[data-v-1b4e27f2]:nth-child(18) {
    transform: translateY(1px) rotate(0deg)
}

.ui-slider .bars.sounds .bar[data-v-1b4e27f2]:nth-child(19) {
    transform: translateY(1px) rotate(-6deg)
}

.ui-slider .bars.sounds .bar[data-v-1b4e27f2]:nth-child(20) {
    transform: translateY(-1px) rotate(3deg)
}

.ui-slider .bars .bar[data-v-1b4e27f2] {
    width: 12px;
    height: 100%;
    font-size: 4rem;
    line-height: .9em;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    opacity: .25
}

.ui-slider .bars .bar.full[data-v-1b4e27f2] {
    opacity: 1
}

.ui-slider .bars-over[data-v-1b4e27f2] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.ui-switch[data-v-429f6217] {
    height: 100%
}

.ui-switch .arrow[data-v-429f6217],
.ui-switch[data-v-429f6217] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row
}

.ui-switch .arrow[data-v-429f6217] {
    width: 32px;
    height: 32px;
    font-size: 5rem;
    line-height: .9em;
    margin: 0 16px 0 0
}

.ui-switch .arrow[data-v-429f6217]:last-child {
    margin: 0 0 0 16px
}

.ui-switch .arrow.disabled[data-v-429f6217] {
    opacity: .25
}

.ui-switch .arrow.disabled[data-v-429f6217]:active {
    transform: none
}

.ui-switch .arrow[data-v-429f6217]:active {
    transform: translateY(2px)
}

.ui-switch .arrow[data-v-429f6217] svg {
    width: 20px;
    height: 20px
}

.ui-switch .text[data-v-429f6217] {
    width: 80px;
    text-align: center;
    font-size: 3.2rem;
    line-height: .9em;
    line-height: 1em;
    text-transform: capitalize
}

.ui-button[data-v-03b5981e] {
    display: inline-block;
    color: #331b04;
    font-size: 4rem;
    line-height: .9em;
    line-height: .7em
}

.ui-button:hover .shadow[data-v-03b5981e] {
    opacity: .5
}

.ui-button:hover .ui-button-content[data-v-03b5981e] {
    transform: translate(1px, -2px)
}

.ui-button:active .shadow[data-v-03b5981e] {
    opacity: .5
}

.ui-button:active .ui-button-content[data-v-03b5981e] {
    transform: translate(-2px, 4px)
}

.ui-button.inactive[data-v-03b5981e] {
    opacity: .5;
    transform: none
}

.ui-button.inactive:hover .shadow[data-v-03b5981e] {
    opacity: .25
}

.ui-button.inactive:hover .ui-button-content[data-v-03b5981e] {
    transform: translate(-2px, 4px)
}

.ui-button.inactive:active .shadow[data-v-03b5981e] {
    opacity: .25
}

.ui-button.inactive .ui-button-content[data-v-03b5981e],
.ui-button.inactive:active .ui-button-content[data-v-03b5981e] {
    transform: translate(-2px, 4px)
}

.ui-button .shadow[data-v-03b5981e] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    transform: translate(-4px, 6px);
    background: 50% no-repeat;
    background-size: 100% 100%;
    filter: brightness(0);
    opacity: .5
}

.ui-button .ui-button-content[data-v-03b5981e] {
    width: 211px;
    height: 95px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    padding: 24px 32px;
    background: 50% no-repeat;
    background-size: 100% 100%
}

.popup-settings[data-v-553e8e70] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row
}

.popup-settings .settings-bg[data-v-553e8e70],
.popup-settings[data-v-553e8e70] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.popup-settings .settings-content[data-v-553e8e70] {
    height: 100%;
    width: 100%;
    max-height: 550px;
    width: 400px;
    padding: 0 32px 32px 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    color: #fff;
    transition: .25s cubic-bezier(.165, .84, .44, 1)
}

.popup-settings .settings-content .title[data-v-553e8e70] {
    margin: 0 0 16px 0;
    font-size: 8rem;
    line-height: .9em;
    line-height: 1em;
    text-align: center
}

.popup-settings .settings-content .items[data-v-553e8e70] {
    width: 100%;
    margin: 24px 0;
    padding: 24px 0
}

.popup-settings .settings-content .items .item[data-v-553e8e70] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    height: 56px;
    line-height: 56px;
    font-size: 3.2rem;
    line-height: .9em
}

.popup-settings .settings-content .items .item .label[data-v-553e8e70] {
    width: 35%
}

.popup-settings .settings-content .items .item .value[data-v-553e8e70] {
    width: 65%;
    height: 100%;
    text-align: right;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-direction: row
}

.popup-settings .settings-content .items .item .value[data-v-553e8e70] .ui-slider {
    margin-right: -8px
}

.popup-settings .settings-content .actions[data-v-553e8e70] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row
}

.popup-settings .settings-content .actions .action[data-v-553e8e70] {
    width: 88px;
    margin: 0 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center
}

.popup-settings .settings-content .actions .action.credits .icon[data-v-553e8e70] {
    background-position: -32px -32px
}

.popup-settings .settings-content .actions .action.reset .icon[data-v-553e8e70] {
    background-position: -64px -32px
}

.popup-settings .settings-content .actions .action .icon[data-v-553e8e70] {
    width: 32px;
    height: 32px;
    background: 0 0 no-repeat;
    background-size: 192px auto;
    margin: 0 0 8px 0
}

.popup-settings .settings-content .actions .action .text[data-v-553e8e70] {
    width: 100%
}

.popup-settings .reset-button[data-v-553e8e70] {
    position: absolute;
    left: 48px;
    bottom: 32px;
    color: #fff;
    opacity: .5
}

.popup-settings .reset-button[data-v-553e8e70]:hover {
    opacity: 1
}

.popup-credits[data-v-c9c2ed3c] {
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    text-align: center
}

.popup-credits .bg[data-v-c9c2ed3c],
.popup-credits[data-v-c9c2ed3c] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.popup-credits .content[data-v-c9c2ed3c] {
    width: calc(100% - 32px);
    max-width: 1100px;
    border-radius: 16px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    transform: translateY(-24px);
    background-color: #fff;
    color: #363850;
    box-shadow: -4px 6px rgba(0, 0, 0, .25)
}

.popup-credits .content .title[data-v-c9c2ed3c] {
    font-size: 8rem;
    line-height: .9em;
    background-color: #363850;
    color: #fff;
    transform: translateY(-50%);
    padding: 24px 48px;
    border-radius: 16px
}

.popup-credits .content .credits[data-v-c9c2ed3c] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    padding: 0 0 64px 0
}

.popup-credits .content .credits .credit[data-v-c9c2ed3c] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    margin: 0 64px;
    font-size: 4rem;
    line-height: .9em
}

.popup-credits .content .credits .credit .portrait[data-v-c9c2ed3c] {
    margin: 0 0 16px 0;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    background: 50% no-repeat;
    background-size: contain
}

.popup-credits .content .credits .credit .name[data-v-c9c2ed3c] {
    width: 100%;
    margin: 0 0 0 0
}

.popup-credits .content .credits .credit .role[data-v-c9c2ed3c] {
    width: 100%;
    margin: 0 0 16px 0;
    color: #aaa
}

.popup-credits .content .credits .credit .website[data-v-c9c2ed3c] {
    width: 100%;
    margin: 0 0 8px 0;
    font-size: 3.2rem;
    line-height: .9em
}

.popup-credits .content .credits .credit .website a[data-v-c9c2ed3c] {
    color: #363850;
    text-decoration: underline
}

.popup-credits .content .credits .credit .website a[data-v-c9c2ed3c]:hover {
    text-decoration: none
}

.popup-credits .content .buttons[data-v-c9c2ed3c] {
    position: absolute;
    top: calc(100% + 32px)
}

.popup-end-game[data-v-7ae32ce5] {
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    text-align: center
}

.popup-end-game .bg[data-v-7ae32ce5],
.popup-end-game[data-v-7ae32ce5] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.popup-end-game .content[data-v-7ae32ce5] {
    width: calc(100% - 32px);
    max-width: 400px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    transform: translateY(-24px);
    font-size: 4rem;
    line-height: .9em
}

.popup-end-game .content .title[data-v-7ae32ce5] {
    margin: 0 0 80px 0;
    font-size: 8rem;
    line-height: .9em;
    line-height: 1em;
    text-align: center
}

.popup-end-game .content .rows[data-v-7ae32ce5] {
    width: 100%;
    margin: 0 0 80px 0
}

.popup-end-game .content .rows .row[data-v-7ae32ce5] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    margin: 0 0 16px 0
}

.popup-end-game .content .rows .row[data-v-7ae32ce5]:last-child {
    margin: 0
}

.popup-end-game .content .rows .row .label[data-v-7ae32ce5] {
    width: 75%;
    text-align: left
}

.popup-end-game .content .rows .row .value[data-v-7ae32ce5] {
    width: 25%;
    text-align: right
}

.popup-end-game .content .score[data-v-7ae32ce5] {
    margin: 0 0 80px 0
}

.popup-end-game .content .score .label[data-v-7ae32ce5] {
    width: 100%
}

.popup-end-game .content .score .value[data-v-7ae32ce5] {
    width: 100%;
    font-size: 8rem;
    line-height: .9em
}

.popup-end-game .content .buttons[data-v-7ae32ce5] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row
}

.popup-end-game .content .buttons[data-v-7ae32ce5] .ui-button {
    margin: 0 16px
}

.portrait[data-v-6b5436b3] {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    font-size: 4rem;
    line-height: .9em;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background-color: #ffefd9
}

.portrait[data-v-6b5436b3]:after {
    content: "";
    position: absolute;
    left: -1px;
    top: -1px;
    right: -1px;
    bottom: -1px;
    border: 4px solid #363850;
    border-radius: 50%
}

.portrait.fish .illustration .img[data-v-6b5436b3] {
    background-position: 80% 8px;
    background-size: 200px auto
}

.portrait.carrot .illustration .img[data-v-6b5436b3] {
    background-position: 65% -48px;
    background-size: 180px auto
}

.portrait.barrel .illustration .img[data-v-6b5436b3] {
    background-position: 60% 8px;
    background-size: 250px auto
}

.portrait.spider .illustration .img[data-v-6b5436b3] {
    background-position: 45% -28px;
    background-size: 250px auto
}

.portrait.wolf .illustration .img[data-v-6b5436b3] {
    background-position: 100% -20px;
    background-size: 350px auto
}

.portrait .illustration[data-v-6b5436b3] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    border-radius: 50%;
    overflow: hidden;
    overflow-x: hidden
}

.portrait .illustration .img[data-v-6b5436b3] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: top no-repeat;
    background-size: 150% auto
}

.popup-unlock[data-v-27008d20] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    color: #fff;
    text-align: center;
    font-size: 4rem;
    line-height: .9em
}

.popup-unlock.unusable .content .power-wrap[data-v-27008d20] .power .mana {
    display: none
}

.popup-unlock .content[data-v-27008d20] {
    height: 100%;
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

.popup-unlock .content .title[data-v-27008d20] {
    position: absolute;
    left: 0;
    right: 0;
    top: 64px;
    font-size: 8rem;
    line-height: .9em;
    text-align: center;
    line-height: .8em;
    transition: .25s cubic-bezier(.165, .84, .44, 1)
}

.popup-unlock .content .title.title-enter[data-v-27008d20] {
    transform: translateY(40px);
    opacity: 0
}

.popup-unlock .content .element[data-v-27008d20] {
    width: 100%;
    transition: .25s cubic-bezier(.895, .03, .685, .22)
}

.popup-unlock .content .element.element-enter[data-v-27008d20] {
    transform: scale(2);
    opacity: 0
}

.popup-unlock .content .element .element-name[data-v-27008d20] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: calc(100% + 8px);
    font-size: 6.4rem;
    line-height: .9em;
    width: 100%;
    text-align: center;
    transition: .25s cubic-bezier(.165, .84, .44, 1)
}

.popup-unlock .content .element .element-name.element-name-enter[data-v-27008d20] {
    transform: translateY(40px);
    opacity: 0
}

.popup-unlock .content .element .card-wrap[data-v-27008d20] {
    margin: 80px 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    transform: scale(2)
}

.popup-unlock .content .element .element-description[data-v-27008d20] {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 8px);
    width: 100%;
    text-align: center;
    transition: .25s cubic-bezier(.165, .84, .44, 1)
}

.popup-unlock .content .element .element-description.element-description-enter[data-v-27008d20] {
    transform: translateY(-40px);
    opacity: 0
}

.popup-unlock .content .element .element-description[data-v-27008d20]:last-child {
    margin: 0
}

.popup-reset[data-v-7803e1a0] {
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    text-align: center
}

.popup-reset .bg[data-v-7803e1a0],
.popup-reset[data-v-7803e1a0] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.popup-reset .content[data-v-7803e1a0] {
    width: calc(100% - 64px);
    max-width: 600px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    transform: translateY(-24px)
}

.popup-reset .content .title[data-v-7803e1a0] {
    margin: 0 0 80px 0;
    font-size: 8rem;
    line-height: .9em;
    line-height: .7em
}

.popup-reset .content p[data-v-7803e1a0] {
    margin: 0 0 16px 0;
    font-size: 3.2rem;
    line-height: .9em
}

.popup-reset .content p.red[data-v-7803e1a0] {
    color: #d22a2a
}

.popup[data-v-dbcf2cac] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row
}

.popup.popup-enter-active .popup-content[data-v-dbcf2cac],
.popup.popup-enter-active[data-v-dbcf2cac] {
    transition: opacity .2s cubic-bezier(.165, .84, .44, 1)
}

.popup.popup-enter .popup-content[data-v-dbcf2cac] {
    opacity: 0
}

.popup.end-game.popup-enter-active[data-v-dbcf2cac] {
    transition: transform 1s cubic-bezier(.165, .84, .44, 1), opacity .5s cubic-bezier(.165, .84, .44, 1)
}

.popup.end-game.popup-enter-active .popup-content[data-v-dbcf2cac] {
    transition: .5s cubic-bezier(.165, .84, .44, 1) .5s
}

.popup.end-game.popup-enter[data-v-dbcf2cac] {
    opacity: 0
}

.popup.end-game.popup-enter .popup-content[data-v-dbcf2cac] {
    opacity: 0;
    transform: scale(1.1)
}

.popup .popup-bg[data-v-dbcf2cac] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, .9)
}

.popup .popup-content[data-v-dbcf2cac] {
    width: 100%;
    height: 100%
}

.popup .close[data-v-dbcf2cac] {
    position: absolute;
    top: 32px;
    right: 32px;
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    font-size: 8rem;
    line-height: .9em;
    color: #fff;
    transition: .15s cubic-bezier(.165, .84, .44, 1)
}

.popup .close[data-v-dbcf2cac]:hover {
    transform: scale(1.1)
}

.popup .close[data-v-dbcf2cac]:active {
    transform: scale(.9)
}

.tuto[data-v-3c03b276] {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    transition: opacity .5s cubic-bezier(.165, .84, .44, 1)
}

.tuto.tuto-enter[data-v-3c03b276],
.tuto.tuto-leave-to[data-v-3c03b276] {
    opacity: 0
}

.tuto.tuto-enter .boss[data-v-3c03b276],
.tuto.tuto-leave-to .boss[data-v-3c03b276] {
    transform: translateX(64px);
    opacity: 0
}

.tuto.tuto-enter .boss .bubble-wrap[data-v-3c03b276],
.tuto.tuto-leave-to .boss .bubble-wrap[data-v-3c03b276] {
    opacity: 0;
    transform: translate(64px, 32px) scale(.9) rotate(-2deg)
}

.tuto.tuto-enter-active .boss .bubble-wrap[data-v-3c03b276] {
    transition: .25s cubic-bezier(.175, .885, .32, 1.275) .5s
}

.tuto .bg[data-v-3c03b276] {
    background-color: rgba(0, 0, 0, .8)
}

.tuto .bg[data-v-3c03b276],
.tuto .highlight[data-v-3c03b276] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.tuto .highlight .hole[data-v-3c03b276] {
    position: absolute;
    box-shadow: 0 0 0 9999px rgba(0, 0, 0, .8);
    transition: .5s cubic-bezier(.165, .84, .44, 1);
    border-radius: 8px
}

.tuto .boss[data-v-3c03b276] {
    position: absolute;
    right: -32px;
    bottom: -8px;
    z-index: 1;
    transition: .25s cubic-bezier(.165, .84, .44, 1)
}

.tuto .boss .illustration[data-v-3c03b276] {
    width: 469.99999999999994px;
    height: 826.3636363636363px;
    background-size: contain
}

.tuto .boss .bubble-wrap[data-v-3c03b276] {
    position: absolute;
    right: 440px;
    top: -180px;
    width: 916.6666666666666px;
    min-height: 284.6666666666667px;
    transition: .25s cubic-bezier(.175, .885, .32, 1.275);
    transform-origin: bottom right
}

.tuto .boss .bubble-wrap.bubble-enter[data-v-3c03b276] {
    transform: translate(64px, 32px) scale(.9) rotate(-2deg);
    opacity: 0
}

.tuto .boss .bubble-wrap.bubble-leave-to[data-v-3c03b276] {
    transform: translate(-32px, -16px) scale(1) rotate(2deg);
    opacity: 0
}

.tuto .boss .bubble-wrap .bubble[data-v-3c03b276] {
    background: top no-repeat;
    background-size: 100% 100%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    color: #363850;
    font-size: 4rem;
    line-height: .9em;
    line-height: .8em
}

.tuto .boss .bubble-wrap .bubble .name[data-v-3c03b276] {
    position: absolute;
    left: 80px;
    top: -20px;
    width: 197px;
    height: 42px;
    font-size: 4rem;
    line-height: .9em;
    background: 50% no-repeat;
    background-size: contain
}

.tuto .boss .bubble-wrap .bubble .text[data-v-3c03b276] {
    padding: 40px 32px 148px 32px
}

.tuto .boss .bubble-wrap .next-button[data-v-3c03b276] {
    position: absolute;
    right: 0;
    top: 40%;
    background-color: #fff;
    color: #363850;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    border-radius: 50%;
    -webkit-animation: next-button-data-v-3c03b276 .5s cubic-bezier(.445, .05, .55, .95) infinite alternate;
    animation: next-button-data-v-3c03b276 .5s cubic-bezier(.445, .05, .55, .95) infinite alternate
}

.tuto .skip[data-v-3c03b276] {
    position: absolute;
    left: 32px;
    top: 40px;
    height: 40px;
    padding: 0 16px;
    font-size: 4rem;
    line-height: .9em;
    line-height: 40px;
    color: #fff;
    opacity: .75
}

.tuto .skip[data-v-3c03b276]:hover {
    opacity: 1
}

@-webkit-keyframes next-button-data-v-3c03b276 {
    0% {
        transform: scale(1)
    }
    to {
        transform: scale(1.1)
    }
}

@keyframes next-button-data-v-3c03b276 {
    0% {
        transform: scale(1)
    }
    to {
        transform: scale(1.1)
    }
}

.status-info[data-v-6652aef8] {
    position: absolute;
    right: 0;
    top: 0;
    color: #fff;
    width: 100%;
    transition: .25s cubic-bezier(.175, .885, .32, 1.275)
}

.status-info:hover .close[data-v-6652aef8] {
    transform: scale(1.2)
}

.status-info:active .close[data-v-6652aef8] {
    transform: scale(.9)
}

.status-info.panning[data-v-6652aef8] {
    transition: none
}

.status-info.status-info-enter[data-v-6652aef8],
.status-info.status-info-leave-to[data-v-6652aef8] {
    transform: translateX(20%);
    opacity: 0
}

.status-info .content[data-v-6652aef8] {
    padding: 40px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    text-align: left
}

.status-info .content .bg[data-v-6652aef8] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-size: 100% 100%;
    border-radius: 4px
}

.status-info .content .name[data-v-6652aef8] {
    position: absolute;
    left: 50%;
    bottom: calc(100% - 20px);
    transform: translateX(-50%);
    background-size: 100% 100%;
    width: 196.5px;
    height: 42px;
    color: #363850;
    text-align: center;
    font-size: 4rem;
    line-height: .9em;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row
}

.status-info .content .text[data-v-6652aef8] {
    font-size: 4rem;
    line-height: .9em
}

.status-info .content .text p[data-v-6652aef8] {
    margin: 0 0 12px 0
}

.status-info .content .text p[data-v-6652aef8]:last-child {
    margin: 0
}

.status-info .content .text .description[data-v-6652aef8] {
    font-size: 2.8rem;
    line-height: .9em
}

.status-info .content .text .description+.description[data-v-6652aef8] {
    opacity: .5
}

.status-info .content .close[data-v-6652aef8] {
    position: absolute;
    right: 20px;
    top: 20px;
    width: 32px;
    height: 32px;
    font-size: 6.4rem;
    transition: .15s cubic-bezier(.165, .84, .44, 1)
}

.loading-screen[data-v-2faa9509],
.status-info .content .close[data-v-6652aef8] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    line-height: .9em
}

.loading-screen[data-v-2faa9509] {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: #363850;
    color: #e0bb86;
    font-size: 3.2rem;
    text-align: center
}

.loading-screen .bars[data-v-2faa9509] {
    display: inline-block;
    height: 8px;
    width: 192px;
    background-color: #1b1c28;
    overflow: hidden;
    overflow-x: hidden
}

.loading-screen .bars .progress[data-v-2faa9509] {
    height: 100%;
    width: 100%;
    background: #e0bb86;
    transition: transform 25s cubic-bezier(.25, .46, .45, .94)
}

* {
    margin: 0;
    padding: 0;
    position: relative;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAeCAMAAAAfOR5kAAAA9lBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////8tLUf////t7e/8/PyTk6GHh5bp6ezS0th6eotpaXxISF86OlL4+Pnw8PLDw8uenqqbm6iXl6SOjpyLi5mBgZF8fIxzc4VuboBjY3ZbW29NTWNAQFcyMkvW1tzLy9LJydC7u8O5ucKwsLqhoayQkJ5+fo5WVmtERFs2Nk/UTwHVAAAAKXRSTlMApqzSzhnbwLainmwiEQj89/LjupqXkoF4aDQvHgwF7ZGQil5OQTknFPb+HgMAAAEnSURBVCjPZZLnWsIwGIUDLUv2VkTc4zvp0jIEwYHinvd/M6ZNS9ry/sv7nDzJyRfGLtr5Y7ZBOQsgX0nqHTjmGHomobuY0SNHoxTXBVhEPw4auzGdwi0R/b2ifhLVB7ghweoDtWIsPSefa2Bb6TZMkljAYSQ9pYBvoKP0F4VcAUeB3sKC1twDLak78iYq3xzItEURHgzoe+s6CpdDEz6NS4rxxJHti/SCEt5GQaUVS2ishbk6j3PbfnY40iyPO88Mfc/hU+uxAkyvx0vwXLnMea9UETcRaW88S38PqmJ6YZ3fMfBOHm/oSl3ExJ1gH4Yry2tSl+sQnKYxIw8DwUwzzWqqzM4w8vWnPyKF7tUamgaKiW80Wk0NIDtgMXIQaCWWoKIj1w8X/433Qy1ntxi5AAAAAElFTkSuQmCC) 0 0, auto
}

html {
    font-size: 62.5%
}

body,
html {
    line-height: .9em
}

body {
    font-family: DK-Hand, sans-serif;
    font-size: 2.6rem;
    font-weight: 400;
    color: #363850;
    font-display: block;
    overflow: hidden;
    overflow-x: hidden
}

#app,
.app-content,
body,
html {
    height: 100%;
    width: 100%
}

strong {
    font-weight: 400
}

.__bar-is-vertical {
    cursor: inherit !important
}

body {
    background-color: #111;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row
}

#app {
    width: 1920px;
    height: 1080px;
    overflow: hidden;
    overflow-x: hidden;
    box-shadow: 0 0 0 3px #fff
}

#app.low .app-content.has-popup .popups .popup,
#app.low .app-content.has-popup .router-view,
#app.low .app-content.has-popup .tuto {
    filter: none
}

#app .app-content.has-popup:after {
    display: none
}

#app .app-content.has-popup .popups .popup,
#app .app-content.has-popup .router-view,
#app .app-content.has-popup .tuto {
    filter: blur(8px)
}

#app .app-content.has-popup .popups .popup:last-child {
    filter: none
}

#app .app-content .router-view.route-enter-active,
#app .app-content .router-view.route-leave-active {
    transition: .15s cubic-bezier(.165, .84, .44, 1)
}

#app .app-content .router-view.route-enter,
#app .app-content .router-view.route-leave-to {
    opacity: 0
}

#app .app-content>.popups {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1
}

#app .app-content>.status-infos {
    position: absolute;
    right: 48px;
    top: 48px;
    width: 420px;
    z-index: 1
}

#app .app-content>.status-infos .status-info:first-child {
    top: 16px;
    right: 16px
}

#app .app-content>.status-infos .status-info:nth-child(2) {
    top: 32px;
    right: 32px
}

#app .app-content>.status-infos .status-info:nth-child(3) {
    top: 48px;
    right: 48px
}

#app .app-content>.status-infos .status-info:nth-child(4) {
    top: 64px;
    right: 64px
}

#app .app-content>.status-infos .status-info:nth-child(5) {
    top: 80px;
    right: 80px
}

#app .app-content>.status-infos .status-info:nth-child(6) {
    top: 96px;
    right: 96px
}

#app .app-content>.status-infos .status-info:nth-child(7) {
    top: 112px;
    right: 112px
}

#app .app-content>.status-infos .status-info:nth-child(8) {
    top: 128px;
    right: 128px
}

#app .app-content>.status-infos .status-info:nth-child(9) {
    top: 144px;
    right: 144px
}

#app .app-content>.status-infos .status-info:nth-child(10) {
    top: 160px;
    right: 160px
}

#app .menu-button {
    position: absolute;
    right: 0;
    top: 0;
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    color: #fff;
    opacity: .5
}

#app .menu-button:hover {
    opacity: 1
}

#app .menu-button:before {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: 150px;
    height: 150px;
    background: linear-gradient(45deg, transparent 50%, rgba(0, 0, 0, .5));
    pointer-events: none
}

#app .menu-button svg {
    width: 32px;
    height: 32px
}

.loading {
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: #363850;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    color: #e0bb86;
    font-family: sans-serif;
    font-weight: 900;
    font-size: 2rem
}

.brower-alert,
.loading {
    position: absolute;
    line-height: .9em
}

.brower-alert {
    left: 50%;
    top: 32px;
    background-color: rgba(210, 42, 42, .85);
    transform: translateX(-50%);
    font-size: 2.6rem;
    padding: 16px 24px;
    border-radius: 8px;
    color: #fff
}

.home[data-v-dbff28ee] {
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    font-size: 4rem;
    line-height: .9em
}

.home .bg[data-v-dbff28ee] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-size: cover
}

.home .hint[data-v-dbff28ee] {
    position: absolute;
    right: 32px;
    bottom: 32px;
    color: #fff;
    transition: .1s cubic-bezier(.165, .84, .44, 1)
}

.home .hint[data-v-dbff28ee]:hover {
    color: #363850
}

.home .hint .letter[data-v-dbff28ee] {
    margin: 0 8px 0 0
}

.home .home-content[data-v-dbff28ee] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    pointer-events: none
}

.home .home-content .character[data-v-dbff28ee] {
    position: absolute;
    left: -32px;
    bottom: -32px;
    transition: transform .1s
}

.home .home-content .character.fish[data-v-dbff28ee] {
    left: -64px;
    height: calc(100% + 64px)
}

.home .home-content .character.barrel[data-v-dbff28ee] {
    left: 11%;
    height: 60%
}

.home .home-content .character.spider[data-v-dbff28ee] {
    left: 44%;
    height: 60%
}

.home .logo[data-v-dbff28ee] {
    position: absolute;
    right: 32px;
    top: 64px;
    width: 612px;
    height: 448px;
    background: 50% no-repeat;
    background-size: contain
}

.home .buttons[data-v-dbff28ee] {
    position: absolute;
    right: 130px;
    top: 70%;
    transform: translateY(-50%)
}

.home .buttons .button[data-v-dbff28ee] {
    margin: 0 0 16px 0
}

.home .buttons .button:hover .button-content[data-v-dbff28ee] {
    transform: scale(1.02)
}

.home .buttons .button:active .button-content[data-v-dbff28ee] {
    transform: scale(.98)
}

.home .buttons .button .button-content[data-v-dbff28ee] {
    width: 100%;
    height: 100%;
    width: 380px;
    height: 78px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    color: #fff;
    transition: .05s cubic-bezier(.165, .84, .44, 1)
}

.heroes[data-v-550b4400] {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    color: #fff;
    background-color: #43333c
}

.heroes .bg[data-v-550b4400] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: top no-repeat;
    background-size: 1920px 1080px
}

.heroes .boss[data-v-550b4400] {
    position: absolute;
    right: -32px;
    bottom: -8px;
    z-index: 1;
    transition: .25s cubic-bezier(.165, .84, .44, 1)
}

.heroes .boss.boss-enter[data-v-550b4400] {
    transform: translateX(64px);
    opacity: 0
}

.heroes .boss.boss-enter .bubble-wrap[data-v-550b4400] {
    transform: translate(64px, 32px) scale(.9);
    opacity: 0
}

.heroes .boss .illustration[data-v-550b4400] {
    width: 469.99999999999994px;
    height: 826.3636363636363px;
    background-size: contain
}

.heroes .boss .bubble-wrap[data-v-550b4400] {
    position: absolute;
    right: 440px;
    bottom: 760px;
    width: 808.8235294117648px;
    height: 251.1764705882353px;
    transition: .25s cubic-bezier(.175, .885, .32, 1.275) .15s
}

.heroes .boss .bubble-wrap .bubble[data-v-550b4400] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-size: contain;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    padding: 16px 32px 128px 32px;
    color: #363850;
    font-size: 5rem;
    line-height: .9em;
    line-height: .8em;
    -webkit-animation: bubble-data-v-550b4400 10s cubic-bezier(.445, .05, .55, .95) infinite alternate;
    animation: bubble-data-v-550b4400 10s cubic-bezier(.445, .05, .55, .95) infinite alternate
}

.heroes .boss .bubble-wrap .bubble .name[data-v-550b4400] {
    position: absolute;
    left: 80px;
    top: -20px;
    width: 197px;
    height: 42px;
    font-size: 4rem;
    line-height: .9em;
    background: 50% no-repeat;
    background-size: contain
}

.heroes .portraits[data-v-550b4400] {
    position: absolute;
    left: 64px;
    top: 50%;
    transform: translateY(-50%);
    width: 120px
}

.heroes .portraits .portrait-wrap[data-v-550b4400] {
    margin: 0 0 24px 0;
    transition: .1s cubic-bezier(.165, .84, .44, 1)
}

.heroes .portraits .portrait-wrap.portrait-enter[data-v-550b4400] {
    transform: translateX(-16px);
    opacity: 0
}

.heroes .portraits .portrait-wrap.portrait-enter-active[data-v-550b4400] {
    transition: .25s cubic-bezier(.175, .885, .32, 1.275)
}

.heroes .portraits .portrait-wrap.portrait-enter-active[data-v-550b4400]:first-child {
    transition-delay: .8s
}

.heroes .portraits .portrait-wrap.portrait-enter-active[data-v-550b4400]:nth-child(2) {
    transition-delay: .9s
}

.heroes .portraits .portrait-wrap.portrait-enter-active[data-v-550b4400]:nth-child(3) {
    transition-delay: 1s
}

.heroes .portraits .portrait-wrap.portrait-enter-active[data-v-550b4400]:nth-child(4) {
    transition-delay: 1.1s
}

.heroes .portraits .portrait-wrap.portrait-enter-active[data-v-550b4400]:nth-child(5) {
    transition-delay: 1.2s
}

.heroes .portraits .portrait-wrap[data-v-550b4400]:last-child {
    margin: 0
}

.heroes .portraits .portrait-wrap.locked[data-v-550b4400] .portrait .illustration .img {
    filter: grayscale(100%) contrast(0) brightness(.35)
}

.heroes .portraits .portrait-wrap[data-v-550b4400]:hover {
    transform: scale(1.05)
}

.heroes .portraits .portrait-wrap.selected[data-v-550b4400] {
    transform: scale(1.1)
}

.heroes .portraits .portrait-wrap.selected[data-v-550b4400] .portrait:after {
    border-color: #ffefd9
}

.heroes .character[data-v-550b4400] {
    position: absolute;
    left: 400px;
    top: 280px;
    width: 464px;
    height: 464px;
    transform-origin: bottom center;
    transition: .15s cubic-bezier(.165, .84, .44, 1)
}

.heroes .character.character-leave-to[data-v-550b4400] {
    transform: translateX(-24px);
    opacity: 0
}

.heroes .character.character-enter[data-v-550b4400] {
    transform: translateX(24px);
    opacity: 0
}

.heroes .character.fish .illustration .img[data-v-550b4400] {
    width: 344px;
    height: 366px
}

.heroes .character.carrot .illustration .img[data-v-550b4400] {
    width: 294px;
    height: 492px
}

.heroes .character.barrel .illustration .img[data-v-550b4400] {
    width: 389px;
    height: 366px
}

.heroes .character.spider .illustration .img[data-v-550b4400] {
    width: 308px;
    height: 472px
}

.heroes .character.wolf .illustration .img[data-v-550b4400] {
    width: 480px;
    height: 459px;
    transform: translate(-72%, 16px)
}

.heroes .character.locked .illustration .img[data-v-550b4400] {
    filter: grayscale(100%) contrast(0) brightness(.35)
}

.heroes .character .shadow[data-v-550b4400] {
    position: absolute;
    left: 10%;
    right: 10%;
    bottom: -12px;
    height: 48px;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, .25)
}

.heroes .character .illustration[data-v-550b4400] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    flex-direction: row
}

.heroes .character .illustration .img[data-v-550b4400] {
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 100%;
    height: 100%;
    background: bottom no-repeat;
    background-size: contain
}

.heroes .infos[data-v-550b4400] {
    position: absolute;
    left: 940px;
    top: 320px;
    width: 350px;
    height: 550px;
    transition: .25s cubic-bezier(.165, .84, .44, 1);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column
}

.heroes .infos.infos-enter-active[data-v-550b4400] {
    transition-delay: .15s
}

.heroes .infos.infos-enter[data-v-550b4400] {
    transform: translateX(-24px);
    opacity: 0
}

.heroes .infos.infos-leave-to[data-v-550b4400] {
    transform: translateX(24px);
    opacity: 0
}

.heroes .infos .bg[data-v-550b4400] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-size: 100% 100%
}

.heroes .infos .infos-content[data-v-550b4400] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    padding: 56px 32px 64px 32px
}

.heroes .infos .infos-content .locked-infos[data-v-550b4400] {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    font-size: 3.2rem;
    line-height: .9em;
    text-align: center;
    padding: 16px
}

.heroes .infos .infos-content .name[data-v-550b4400] {
    position: absolute;
    left: 50%;
    bottom: calc(100% - 24px);
    width: 196.5px;
    height: 42px;
    background-size: contain;
    transform: translateX(-50%);
    font-size: 4rem;
    line-height: .9em;
    color: #363850;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row
}

.heroes .infos .infos-content .stats[data-v-550b4400] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    margin: 0 0 24px 0
}

.heroes .infos .infos-content .stats[data-v-550b4400] .ui-stat {
    margin: 0 8px
}

.heroes .infos .infos-content .text[data-v-550b4400] {
    text-align: center;
    margin: 0 0 24px 0;
    font-size: 3rem;
    line-height: .9em
}

.heroes .infos .infos-content .features[data-v-550b4400] {
    margin-left: 32px
}

.heroes .infos .infos-content .features li[data-v-550b4400] {
    margin: 0 0 12px 0
}

.heroes .infos .infos-content .features li[data-v-550b4400]:last-child {
    margin: 0
}

.heroes .buttons[data-v-550b4400] {
    left: 400px;
    top: 840px;
    width: 464px
}

.heroes .back[data-v-550b4400],
.heroes .buttons[data-v-550b4400] {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row
}

.heroes .back[data-v-550b4400] {
    left: 16px;
    top: 16px;
    width: 80px;
    height: 80px;
    font-size: 8rem;
    line-height: .9em;
    background-color: #fff;
    color: #363850;
    border-radius: 50%;
    padding-bottom: 6px;
    transition: .1s cubic-bezier(.165, .84, .44, 1)
}

.heroes .back[data-v-550b4400]:hover {
    transform: scale(1.2)
}

.heroes .back[data-v-550b4400]:active {
    transform: scale(1)
}

@-webkit-keyframes bubble-data-v-550b4400 {
    0% {
        transform: translate(-4px, -4px)
    }
    to {
        transform: translate(8px, 8px)
    }
}

@keyframes bubble-data-v-550b4400 {
    0% {
        transform: translate(-4px, -4px)
    }
    to {
        transform: translate(8px, 8px)
    }
}

.background[data-v-57196060] {
    position: absolute;
    left: -8px;
    top: -8px;
    right: -8px;
    bottom: -8px
}

.background.winter-day .background-content .layer.dark[data-v-57196060] {
    background-color: #363850
}

.background.winter-night .background-content .layer.dark[data-v-57196060] {
    background-color: #291b3e
}

.background.dolmen-day .background-content .layer.dark[data-v-57196060] {
    background-color: #1e2430
}

.background.dolmen-night .background-content .layer.dark[data-v-57196060] {
    background-color: #081226
}

.background.autumn-day .background-content .layer.dark[data-v-57196060] {
    background-color: #371a28
}

.background.autumn-night .background-content .layer.dark[data-v-57196060] {
    background-color: #0d0825
}

.background.temple-day .background-content .layer.dark[data-v-57196060] {
    background-color: #211d13
}

.background .background-content.winter[data-v-57196060] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.background .background-content.winter .layer[data-v-57196060] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: 0 100% repeat-x;
    background-size: auto 100%
}

.background .background-content.winter .layer.dark[data-v-57196060] {
    top: auto;
    height: 398px
}

.background .background-content.winter .layer.pikes[data-v-57196060] {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    flex-direction: row;
    bottom: 548px;
    transform: translateX(-400px)
}

.background .background-content.winter .layer.pikes img[data-v-57196060] {
    width: 521px;
    height: 407px
}

.background .background-content.winter .layer.pikes img.flip[data-v-57196060] {
    transform: scaleX(-1)
}

.background .background-content.winter .layer.mountains[data-v-57196060] {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    flex-direction: row;
    bottom: 433px
}

.background .background-content.winter .layer.mountains img[data-v-57196060] {
    width: 1535.2px;
    height: 382.4px
}

.background .background-content.winter .layer.forests[data-v-57196060] {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    flex-direction: row;
    bottom: 403px
}

.background .background-content.winter .layer.forests img[data-v-57196060] {
    width: 748.8px;
    height: 227.2px
}

.background .background-content.winter .layer.hills[data-v-57196060] {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    flex-direction: row;
    bottom: 420px
}

.background .background-content.winter .layer.hills img[data-v-57196060] {
    width: 1536px;
    height: 465.6px
}

.background .background-content.winter .layer.clouds[data-v-57196060] {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    flex-direction: row;
    bottom: 820px
}

.background .background-content.winter .layer.clouds img[data-v-57196060] {
    height: 0;
    margin: 0 200px
}

.background .background-content.winter .layer.clouds img.flip[data-v-57196060] {
    transform: scaleX(-1)
}

.background .background-content.winter .layer.clouds img.img-1[data-v-57196060] {
    height: 42px
}

.background .background-content.winter .layer.clouds img.img-2[data-v-57196060] {
    height: 45px
}

.background .background-content.winter .layer.clouds img.img-3[data-v-57196060] {
    height: 69px
}

.background .background-content.winter .layer.ground[data-v-57196060] {
    background-size: auto 131px;
    bottom: 348px
}

.background .background-content.dolmen[data-v-57196060] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.background .background-content.dolmen .layer[data-v-57196060] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: 0 100% repeat-x;
    background-size: auto 100%
}

.background .background-content.dolmen .layer.dark[data-v-57196060] {
    top: auto;
    height: 398px
}

.background .background-content.dolmen .layer.hills[data-v-57196060] {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    flex-direction: row;
    bottom: 420px
}

.background .background-content.dolmen .layer.hills.back[data-v-57196060] {
    transform: scale(1) translateX(-200px);
    flex-direction: row-reverse
}

.background .background-content.dolmen .layer.hills.front[data-v-57196060] {
    opacity: 1;
    transform: translateX(-200px)
}

.background .background-content.dolmen .layer.hills img[data-v-57196060] {
    height: 0
}

.background .background-content.dolmen .layer.hills img.hill-1[data-v-57196060] {
    height: 478px
}

.background .background-content.dolmen .layer.hills img.hill-2[data-v-57196060] {
    height: 461px
}

.background .background-content.dolmen .layer.hills img.hill-3[data-v-57196060] {
    height: 387px
}

.background .background-content.dolmen .layer.hills img.hill-4[data-v-57196060] {
    height: 104px
}

.background .background-content.dolmen .layer.plants[data-v-57196060] {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    flex-direction: row;
    bottom: 420px
}

.background .background-content.dolmen .layer.plants img[data-v-57196060] {
    height: 0;
    margin: 0 200px
}

.background .background-content.dolmen .layer.plants img.flip[data-v-57196060] {
    transform: scaleX(-1)
}

.background .background-content.dolmen .layer.plants img.img-1[data-v-57196060] {
    height: 518px
}

.background .background-content.dolmen .layer.plants img.img-2[data-v-57196060] {
    height: 505px
}

.background .background-content.dolmen .layer.plants img.img-3[data-v-57196060] {
    height: 518px
}

.background .background-content.dolmen .layer.clouds[data-v-57196060] {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    flex-direction: row;
    bottom: 820px
}

.background .background-content.dolmen .layer.clouds img[data-v-57196060] {
    height: 0;
    margin: 0 200px
}

.background .background-content.dolmen .layer.clouds img.flip[data-v-57196060] {
    transform: scaleX(-1)
}

.background .background-content.dolmen .layer.clouds img.img-1[data-v-57196060] {
    height: 42px
}

.background .background-content.dolmen .layer.clouds img.img-2[data-v-57196060] {
    height: 45px
}

.background .background-content.dolmen .layer.clouds img.img-3[data-v-57196060] {
    height: 69px
}

.background .background-content.dolmen .layer.ground[data-v-57196060] {
    background-size: auto 131px;
    bottom: 348px
}

.background .background-content.autumn[data-v-57196060] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.background .background-content.autumn .layer[data-v-57196060] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: 0 100% repeat-x;
    background-size: auto 100%
}

.background .background-content.autumn .layer.dark[data-v-57196060] {
    top: auto;
    height: 380px
}

.background .background-content.autumn .layer.hills[data-v-57196060] {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    flex-direction: row;
    bottom: 510px
}

.background .background-content.autumn .layer.hills img[data-v-57196060] {
    height: 0
}

.background .background-content.autumn .layer.hills img.flip[data-v-57196060] {
    transform: scaleX(-1)
}

.background .background-content.autumn .layer.hills img.img-1[data-v-57196060] {
    height: 107px
}

.background .background-content.autumn .layer.hills img.img-2[data-v-57196060] {
    height: 149px
}

.background .background-content.autumn .layer.plants[data-v-57196060] {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    flex-direction: row;
    bottom: 402px;
    transform: scale(1) translateX(-300px)
}

.background .background-content.autumn .layer.plants img[data-v-57196060] {
    height: 0;
    margin: 0 200px
}

.background .background-content.autumn .layer.plants img.flip[data-v-57196060] {
    transform: scaleX(-1)
}

.background .background-content.autumn .layer.plants img.img-1[data-v-57196060] {
    height: 502px
}

.background .background-content.autumn .layer.plants img.img-2[data-v-57196060] {
    height: 500px
}

.background .background-content.autumn .layer.forests[data-v-57196060] {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    flex-direction: row;
    bottom: 440px;
    transform: scale(1) translateX(-500px)
}

.background .background-content.autumn .layer.forests img[data-v-57196060] {
    height: 0;
    margin: 0 200px
}

.background .background-content.autumn .layer.forests img.flip[data-v-57196060] {
    transform: scaleX(-1)
}

.background .background-content.autumn .layer.forests img.img-1[data-v-57196060] {
    height: 354px
}

.background .background-content.autumn .layer.statues[data-v-57196060] {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    flex-direction: row;
    bottom: 440px
}

.background .background-content.autumn .layer.statues img[data-v-57196060] {
    height: 0;
    margin: 0 200px
}

.background .background-content.autumn .layer.statues img.flip[data-v-57196060] {
    transform: scaleX(-1)
}

.background .background-content.autumn .layer.statues img.img-1[data-v-57196060] {
    height: 85px
}

.background .background-content.autumn .layer.statues img.img-2[data-v-57196060] {
    height: 207px
}

.background .background-content.autumn .layer.houses[data-v-57196060] {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    flex-direction: row;
    bottom: 425px;
    transform: scale(1) translateX(-250px)
}

.background .background-content.autumn .layer.houses img[data-v-57196060] {
    height: 0;
    margin: 0 200px
}

.background .background-content.autumn .layer.houses img.flip[data-v-57196060] {
    transform: scaleX(-1)
}

.background .background-content.autumn .layer.houses img.img-1[data-v-57196060] {
    height: 322px
}

.background .background-content.autumn .layer.houses img.img-2[data-v-57196060] {
    height: 305px
}

.background .background-content.autumn .layer.clouds[data-v-57196060] {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    flex-direction: row;
    bottom: 830px
}

.background .background-content.autumn .layer.clouds img[data-v-57196060] {
    height: 0;
    margin: 0 200px
}

.background .background-content.autumn .layer.clouds img.flip[data-v-57196060] {
    transform: scaleX(-1)
}

.background .background-content.autumn .layer.clouds img.img-1[data-v-57196060] {
    height: 90px
}

.background .background-content.autumn .layer.clouds img.img-2[data-v-57196060] {
    height: 64px
}

.background .background-content.autumn .layer.ground[data-v-57196060] {
    background-size: auto 285px;
    bottom: 330px
}

.background .background-content.autumn .layer.plain[data-v-57196060] {
    background-size: auto 120px;
    bottom: 430px
}

.background .background-content.temple[data-v-57196060] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.background .background-content.temple .layer[data-v-57196060] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: 0 100% repeat-x;
    background-size: auto 100%
}

.background .background-content.temple .layer.dark[data-v-57196060] {
    top: auto;
    height: 380px
}

.background .background-content.temple .layer.ground[data-v-57196060] {
    background-size: auto 183px;
    bottom: 330px
}

.background .background-content.temple .layer.columns[data-v-57196060] {
    background-size: auto 539px;
    bottom: 458px
}

.background .background-content.temple .layer.roof[data-v-57196060] {
    background-size: auto 66px;
    bottom: 967px
}

.background.autumn-night .background-content.autumn .layer.statues img.img-1[data-v-57196060] {
    height: 128px
}

.dropzone[data-v-afc09c9a] {
    width: 232px;
    height: 232px;
    transition: .42s linear .06s;
    z-index: 100;
    pointer-events: none
}

.dropzone .droppable[data-v-afc09c9a] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.dropzone .droppable.drop-activated .hint[data-v-afc09c9a] {
    opacity: .75
}

.dropzone .droppable .hint[data-v-afc09c9a] {
    position: absolute;
    left: 8px;
    right: 8px;
    bottom: 8px;
    top: 8px;
    border-radius: 50%;
    opacity: .5;
    background-color: hsla(0, 0%, 100%, .75);
    box-shadow: 0 0 40px 20px #fff, inset 0 0 40px 20px #fff
}

@-webkit-keyframes arrow-down-data-v-afc09c9a {
    0% {
        transform: translateY(-16px)
    }
    to {
        transform: translateY(0)
    }
}

@keyframes arrow-down-data-v-afc09c9a {
    0% {
        transform: translateY(-16px)
    }
    to {
        transform: translateY(0)
    }
}

.ui-tooltip[data-v-4de03229] {
    position: absolute;
    width: 280px;
    background: 50% no-repeat;
    background-size: 100% 100%;
    padding: 24px;
    color: #fff;
    text-align: center;
    z-index: 10;
    font-size: 2.8rem;
    line-height: .9em;
    visibility: hidden;
    transform: translateX(-50%)
}

.ui-tooltip.top[data-v-4de03229] {
    left: 50%;
    bottom: calc(100% + 4px)
}

.ui-tooltip.right[data-v-4de03229] {
    left: calc(100% + 8px);
    top: 50%;
    transform: translateY(-50%)
}

.ui-tooltip.right[data-v-4de03229]:before {
    display: none
}

.ui-tooltip.bottom[data-v-4de03229] {
    left: 50%;
    top: calc(100% + 40px)
}

.ui-tooltip.bottom[data-v-4de03229]:before {
    display: none
}

.ui-tooltip.has-title[data-v-4de03229] {
    padding-top: 32px
}

.ui-tooltip[data-v-4de03229]:hover {
    visibility: visible !important;
    display: block !important
}

.ui-tooltip[data-v-4de03229]:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 16px;
    bottom: -16px;
    width: 100%
}

.ui-tooltip .title[data-v-4de03229] {
    position: absolute;
    bottom: 100%;
    left: 50%;
    padding: 8px;
    min-width: 70%;
    background: 50% no-repeat;
    background-size: 100% 100%;
    border-radius: 4px;
    color: #363850;
    font-size: 3.2rem;
    line-height: .9em;
    line-height: .7em;
    box-shadow: 0 2px 2px rgba(0, 0, 0, .5);
    transform: translate(-50%, 50%)
}

.equipment[data-v-5c5dc0e6] {
    width: 72px;
    height: 72px
}

.equipment[data-v-5c5dc0e6]:before {
    content: "";
    position: absolute;
    left: 10px;
    top: 10px;
    right: 10px;
    bottom: 10px;
    background-color: #222;
    border-radius: 4px;
    transform: rotate(45deg);
    border: 3px solid #fff
}

.equipment .equipment-content[data-v-5c5dc0e6] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.equipment .equipment-content[data-v-5c5dc0e6]:hover .ui-tooltip {
    visibility: visible
}

.equipment .equipment-content.equipment-enter-active[data-v-5c5dc0e6] {
    transition: .4s cubic-bezier(.165, .84, .44, 1)
}

.equipment .equipment-content.equipment-leave-active[data-v-5c5dc0e6] {
    transition: .4s cubic-bezier(.895, .03, .685, .22)
}

.equipment .equipment-content.equipment-enter[data-v-5c5dc0e6] {
    transform: translateY(-50%) scale(1.5);
    opacity: 0
}

.equipment .equipment-content.equipment-leave-to[data-v-5c5dc0e6] {
    transform: translateY(100%) scale(.8);
    opacity: 0
}

.equipment .equipment-content .illustration[data-v-5c5dc0e6] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.equipment .equipment-content .illustration .img[data-v-5c5dc0e6] {
    position: absolute;
    left: 4px;
    top: 4px;
    right: 4px;
    bottom: 4px;
    background: 50% no-repeat;
    background-size: contain
}

.equipment .equipment-content .durability[data-v-5c5dc0e6] {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 8px);
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row
}

.equipment .equipment-content .durability .dot[data-v-5c5dc0e6] {
    width: 12px;
    height: 12px;
    margin: 0 2px;
    border-radius: 50%;
    background-color: #fff;
    transition: .25s cubic-bezier(.165, .84, .44, 1)
}

.equipment .equipment-content .durability .dot.durability-enter[data-v-5c5dc0e6] {
    transform: translateY(-24px)
}

.equipment .equipment-content .durability .dot.durability-leave-to[data-v-5c5dc0e6] {
    transform: translateY(24px);
    opacity: 0
}

.ui-status[data-v-58336d35] {
    display: inline-block;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    font-size: 2.8rem;
    line-height: .9em
}

.ui-status[data-v-58336d35]:hover .ui-tooltip {
    visibility: visible
}

.ui-status.poison .icon[data-v-58336d35] {
    transform: scaleX(-1)
}

.ui-status .icon[data-v-58336d35] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: 50% no-repeat;
    background-size: contain
}

.ui-status .value[data-v-58336d35] {
    position: absolute;
    right: -2px;
    bottom: -6px;
    color: #363850;
    text-shadow: -1px -1px #fff, -1px 1px #fff, 1px -1px #fff, 1px 1px #fff
}

.board-card[data-slug=fish] .board-card-content .sprite.idle .img[data-v-383c2d15] {
    width: 216px;
    height: 230px;
    background-size: 216px 230px
}

.board-card[data-slug=fish] .board-card-content .sprite.attack .img[data-v-383c2d15] {
    width: 343px;
    height: 283px;
    background-size: 343px 283px
}

.board-card[data-slug=fish] .board-card-content .sprite.hit .img[data-v-383c2d15] {
    width: 219px;
    height: 292px;
    background-size: 219px 292px
}

.board-card[data-slug=carrot] .hearts[data-v-383c2d15] {
    bottom: calc(100% + 140px)
}

.board-card[data-slug=carrot] .board-card-content .sprite.idle .img[data-v-383c2d15] {
    width: 200px;
    height: 334px;
    background-size: 200px 334px
}

.board-card[data-slug=carrot] .board-card-content .sprite.attack .img[data-v-383c2d15] {
    width: 304px;
    height: 381px;
    background-size: 304px 381px
}

.board-card[data-slug=carrot] .board-card-content .sprite.hit .img[data-v-383c2d15] {
    width: 288px;
    height: 310px;
    background-size: 288px 310px
}

.board-card[data-slug=barrel] .board-card-content .sprite.idle .img[data-v-383c2d15] {
    width: 245px;
    height: 230px;
    background-size: 245px 230px
}

.board-card[data-slug=barrel] .board-card-content .sprite.attack .img[data-v-383c2d15] {
    width: 266px;
    height: 246px;
    background-size: 266px 246px
}

.board-card[data-slug=barrel] .board-card-content .sprite.hit .img[data-v-383c2d15] {
    width: 258px;
    height: 221px;
    background-size: 258px 221px
}

.board-card[data-slug=spider] .hearts[data-v-383c2d15] {
    bottom: calc(100% + 120px)
}

.board-card[data-slug=spider] .board-card-content .sprite.idle .img[data-v-383c2d15] {
    width: 209px;
    height: 321px;
    background-size: 209px 321px
}

.board-card[data-slug=spider] .board-card-content .sprite.attack .img[data-v-383c2d15] {
    width: 347px;
    height: 307px;
    background-size: 347px 307px
}

.board-card[data-slug=spider] .board-card-content .sprite.hit .img[data-v-383c2d15] {
    width: 305px;
    height: 323px;
    background-size: 305px 323px
}

.board-card[data-slug=wolf] .hearts[data-v-383c2d15] {
    bottom: calc(100% + 120px)
}

.board-card[data-slug=wolf] .board-card-content .sprite.idle .img[data-v-383c2d15] {
    width: 349px;
    height: 334px;
    background-size: 349px 334px;
    transform: translate(-70%, 16px)
}

.board-card[data-slug=wolf] .board-card-content .sprite.attack .img[data-v-383c2d15] {
    width: 373px;
    height: 407px;
    background-size: 373px 407px;
    transform: translate(-60%, 16px)
}

.board-card[data-slug=wolf] .board-card-content .sprite.hit .img[data-v-383c2d15] {
    width: 366px;
    height: 290px;
    background-size: 366px 290px;
    transform: translate(-70%, 16px)
}

.board-card[data-slug=tentacle] .hearts[data-v-383c2d15] {
    bottom: calc(100% + 170px)
}

.board-card[data-slug=tentacle] .board-card-content .sprite.idle .img[data-v-383c2d15] {
    width: 222px;
    height: 373px;
    background-size: 222px 373px
}

.board-card[data-slug=tentacle] .board-card-content .sprite.attack .img[data-v-383c2d15] {
    width: 281px;
    height: 325px;
    background-size: 281px 325px
}

.board-card[data-slug=tentacle] .board-card-content .sprite.hit .img[data-v-383c2d15] {
    width: 287px;
    height: 278px;
    background-size: 287px 278px;
    transform: translate(-15%)
}

.board-card[data-slug=tongue] .board-card-content .sprite.idle .img[data-v-383c2d15] {
    width: 186px;
    height: 215px;
    background-size: 186px 215px
}

.board-card[data-slug=tongue] .board-card-content .sprite.attack .img[data-v-383c2d15] {
    width: 262px;
    height: 261px;
    background-size: 262px 261px
}

.board-card[data-slug=tongue] .board-card-content .sprite.hit .img[data-v-383c2d15] {
    width: 193px;
    height: 216px;
    background-size: 193px 216px;
    transform: translate(-25%)
}

.board-card[data-slug=gargoyle] .hearts[data-v-383c2d15] {
    bottom: calc(100% - 8px)
}

.board-card[data-slug=gargoyle] .board-card-content .sprite.idle .img[data-v-383c2d15] {
    width: 207px;
    height: 163px;
    background-size: 207px 163px
}

.board-card[data-slug=gargoyle] .board-card-content .sprite.attack .img[data-v-383c2d15] {
    width: 289px;
    height: 202px;
    background-size: 289px 202px;
    transform: translate(-50%, -80px)
}

.board-card[data-slug=gargoyle] .board-card-content .sprite.hit .img[data-v-383c2d15] {
    width: 202px;
    height: 178px;
    background-size: 202px 178px;
    transform: translate(-10%)
}

.board-card[data-slug=leaf] .board-card-content .sprite.idle .img[data-v-383c2d15] {
    width: 189px;
    height: 253px;
    background-size: 189px 253px
}

.board-card[data-slug=leaf] .board-card-content .sprite.attack .img[data-v-383c2d15] {
    width: 458px;
    height: 201px;
    background-size: 458px 201px;
    transform: translate(-50%, -60px)
}

.board-card[data-slug=leaf] .board-card-content .sprite.hit .img[data-v-383c2d15] {
    width: 296px;
    height: 271px;
    background-size: 296px 271px;
    transform: translate(-35%)
}

.board-card[data-slug=eyes] .board-card-content .sprite.idle .img[data-v-383c2d15] {
    width: 306px;
    height: 267px;
    background-size: 306px 267px
}

.board-card[data-slug=eyes] .board-card-content .sprite.attack .img[data-v-383c2d15] {
    width: 285px;
    height: 293px;
    background-size: 285px 293px
}

.board-card[data-slug=eyes] .board-card-content .sprite.hit .img[data-v-383c2d15] {
    width: 311px;
    height: 278px;
    background-size: 311px 278px;
    transform: translate(-10%)
}

.board-card[data-slug=fire] .hearts[data-v-383c2d15] {
    bottom: calc(100% + 140px)
}

.board-card[data-slug=fire] .board-card-content .sprite[data-v-383c2d15] {
    bottom: 0
}

.board-card[data-slug=fire] .board-card-content .sprite.idle .img[data-v-383c2d15] {
    width: 321px;
    height: 319px;
    background-size: 321px 319px
}

.board-card[data-slug=fire] .board-card-content .sprite.attack .img[data-v-383c2d15] {
    width: 370px;
    height: 353px;
    background-size: 370px 353px
}

.board-card[data-slug=fire] .board-card-content .sprite.hit .img[data-v-383c2d15] {
    width: 273px;
    height: 307px;
    background-size: 273px 307px;
    transform: translate(-30%)
}

.board-card[data-slug=pigeon] .hearts[data-v-383c2d15] {
    bottom: calc(100% + 120px)
}

.board-card[data-slug=pigeon] .board-card-content .sprite[data-v-383c2d15] {
    bottom: 0
}

.board-card[data-slug=pigeon] .board-card-content .sprite.idle .img[data-v-383c2d15] {
    width: 405px;
    height: 300px;
    background-size: 405px 300px;
    transform: translate(-45%, -24px)
}

.board-card[data-slug=pigeon] .board-card-content .sprite.attack .img[data-v-383c2d15] {
    width: 435px;
    height: 452px;
    background-size: 435px 452px;
    transform: translate(-50%, -40px)
}

.board-card[data-slug=pigeon] .board-card-content .sprite.hit .img[data-v-383c2d15] {
    width: 385px;
    height: 292px;
    background-size: 385px 292px;
    transform: translate(-30%, -24px)
}

.board-card[data-slug=vampire] .hearts[data-v-383c2d15] {
    bottom: calc(100% + 90px)
}

.board-card[data-slug=vampire] .board-card-content .sprite[data-v-383c2d15] {
    bottom: 0
}

.board-card[data-slug=vampire] .board-card-content .sprite.idle .img[data-v-383c2d15] {
    width: 283px;
    height: 296px;
    background-size: 283px 296px;
    transform: translate(-58%)
}

.board-card[data-slug=vampire] .board-card-content .sprite.attack .img[data-v-383c2d15] {
    width: 417px;
    height: 272px;
    background-size: 417px 272px;
    transform: translate(-50%, -40px)
}

.board-card[data-slug=vampire] .board-card-content .sprite.hit .img[data-v-383c2d15] {
    width: 247px;
    height: 282px;
    background-size: 247px 282px;
    transform: translate(-30%)
}

.board-card[data-slug=king] .board-card-content .sprite[data-v-383c2d15] {
    bottom: 0
}

.board-card[data-slug=king] .board-card-content .sprite.idle .img[data-v-383c2d15] {
    width: 229px;
    height: 224px;
    background-size: 229px 224px;
    transform: translate(-45%, -20px)
}

.board-card[data-slug=king] .board-card-content .sprite.attack .img[data-v-383c2d15] {
    width: 328px;
    height: 369px;
    background-size: 328px 369px;
    transform: translate(-50%)
}

.board-card[data-slug=king] .board-card-content .sprite.hit .img[data-v-383c2d15] {
    width: 255px;
    height: 268px;
    background-size: 255px 268px;
    transform: translate(-30%, -20px)
}

.board-card[data-slug=dragon] .hearts[data-v-383c2d15] {
    bottom: calc(100% + 90px)
}

.board-card[data-slug=dragon] .board-card-content .sprite[data-v-383c2d15] {
    bottom: 0
}

.board-card[data-slug=dragon] .board-card-content .sprite.idle .img[data-v-383c2d15] {
    width: 400px;
    height: 260px;
    background-size: 400px 260px;
    transform: translate(-45%)
}

.board-card[data-slug=dragon] .board-card-content .sprite.attack .img[data-v-383c2d15] {
    width: 387px;
    height: 272px;
    background-size: 387px 272px;
    transform: translate(-50%, -40px)
}

.board-card[data-slug=dragon] .board-card-content .sprite.hit .img[data-v-383c2d15] {
    width: 188px;
    height: 345px;
    background-size: 188px 345px;
    transform: translate(-30%, 20px)
}

.board-card[data-v-383c2d15] {
    width: 232px;
    height: 232px
}

.board-card .board-card-content[data-v-383c2d15] {
    width: 100%;
    height: 100%
}

.board-card .board-card-content.character.idle .sprite[data-v-383c2d15] {
    -webkit-animation: sprite-idle-data-v-383c2d15 .5s cubic-bezier(.445, .05, .55, .95) .2s infinite alternate;
    animation: sprite-idle-data-v-383c2d15 .5s cubic-bezier(.445, .05, .55, .95) .2s infinite alternate
}

.board-card .board-card-content.character.move .shadow[data-v-383c2d15] {
    -webkit-animation: shadow-move-data-v-383c2d15 .6s linear;
    animation: shadow-move-data-v-383c2d15 .6s linear
}

.board-card .board-card-content.character.move .sprite[data-v-383c2d15] {
    -webkit-animation: sprite-move-data-v-383c2d15 .6s linear;
    animation: sprite-move-data-v-383c2d15 .6s linear
}

.board-card .board-card-content.character.hit-right .sprite[data-v-383c2d15],
.board-card .board-card-content.character.pushing .sprite[data-v-383c2d15] {
    -webkit-animation: sprite-hit-right-data-v-383c2d15 1s cubic-bezier(.165, .84, .44, 1);
    animation: sprite-hit-right-data-v-383c2d15 1s cubic-bezier(.165, .84, .44, 1)
}

.board-card .board-card-content.character.hit-left .sprite[data-v-383c2d15] {
    -webkit-animation: sprite-hit-left-data-v-383c2d15 1s cubic-bezier(.165, .84, .44, 1);
    animation: sprite-hit-left-data-v-383c2d15 1s cubic-bezier(.165, .84, .44, 1)
}

.board-card .board-card-content.character.attack-right .shadow[data-v-383c2d15] {
    -webkit-animation: shadow-attack-right-data-v-383c2d15 1s linear;
    animation: shadow-attack-right-data-v-383c2d15 1s linear
}

.board-card .board-card-content.character.attack-right .sprite[data-v-383c2d15] {
    -webkit-animation: sprite-attack-right-data-v-383c2d15 1s linear;
    animation: sprite-attack-right-data-v-383c2d15 1s linear
}

.board-card .board-card-content.character.attack-left .shadow[data-v-383c2d15] {
    -webkit-animation: shadow-attack-left-data-v-383c2d15 1s linear;
    animation: shadow-attack-left-data-v-383c2d15 1s linear
}

.board-card .board-card-content.character.attack-left .sprite[data-v-383c2d15] {
    -webkit-animation: sprite-attack-left-data-v-383c2d15 1s linear;
    animation: sprite-attack-left-data-v-383c2d15 1s linear
}

.board-card .board-card-content.object.gold .sprite .img[data-v-383c2d15] {
    width: 92.8px;
    height: 92.8px
}

.board-card .board-card-content.object.item .sprite .img[data-v-383c2d15] {
    width: 105.45454545454544px;
    height: 105.45454545454544px
}

.board-card .board-card-content.object.trap .shadow[data-v-383c2d15] {
    display: none
}

.board-card .board-card-content.object.trap .sprite[data-v-383c2d15] {
    -webkit-animation: none;
    animation: none;
    transform: translateY(22px)
}

.board-card .board-card-content.object .shadow[data-v-383c2d15] {
    width: 116px;
    left: calc(50% - 58px);
    -webkit-animation: shadow-floating-data-v-383c2d15 2s cubic-bezier(.445, .05, .55, .95) infinite alternate;
    animation: shadow-floating-data-v-383c2d15 2s cubic-bezier(.445, .05, .55, .95) infinite alternate
}

.board-card .board-card-content.object .sprite[data-v-383c2d15] {
    bottom: 40px;
    -webkit-animation: sprite-floating-data-v-383c2d15 2s cubic-bezier(.445, .05, .55, .95) infinite alternate;
    animation: sprite-floating-data-v-383c2d15 2s cubic-bezier(.445, .05, .55, .95) infinite alternate
}

.board-card .board-card-content.object .sprite .img[data-v-383c2d15] {
    width: 116px;
    height: 116px;
    background-size: contain
}

.board-card .board-card-content .shadow[data-v-383c2d15] {
    position: absolute;
    width: 166px;
    height: 24px;
    left: calc(50% - 83px);
    bottom: 14px;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, .25)
}

.board-card .board-card-content .sprite[data-v-383c2d15] {
    position: absolute;
    width: 100%;
    height: 232px;
    left: 0;
    bottom: 20px;
    transform-origin: center bottom
}

.board-card .board-card-content .sprite .img[data-v-383c2d15] {
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 100%;
    height: 100%;
    background: bottom no-repeat;
    background-size: contain
}

.board-card .board-card-content .sprite .img[data-v-383c2d15]:hover .ui-tooltip {
    visibility: visible
}

.board-card .hearts[data-v-383c2d15] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: calc(100% + 48px);
    width: 100%
}

.board-card .hearts.down[data-v-383c2d15] {
    bottom: 80%
}

.board-card .hearts .hearts-content[data-v-383c2d15] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    flex-wrap: wrap
}

.board-card .hearts .hearts-content[data-v-383c2d15] .ui-stat {
    width: 24px;
    height: 24px;
    margin: 2px;
    background: 50% no-repeat;
    background-size: contain
}

.board-card .hearts .hearts-content[data-v-383c2d15] .ui-stat .value {
    display: none
}

.board-card .hearts .hearts-content[data-v-383c2d15] .ui-stat.empty {
    filter: brightness(0);
    opacity: .25
}

.board-card .hearts .crown[data-v-383c2d15] {
    position: absolute;
    left: 50%;
    bottom: calc(100% + 32px);
    transform: translateX(-50%);
    height: 57px;
    width: 47px;
    z-index: 1
}

.board-card .hearts .crown>.img[data-v-383c2d15] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: 50% no-repeat;
    background-size: contain;
    -webkit-animation: crown-data-v-383c2d15 2s cubic-bezier(.445, .05, .55, .95) infinite alternate;
    animation: crown-data-v-383c2d15 2s cubic-bezier(.445, .05, .55, .95) infinite alternate
}

.board-card .hearts .crown[data-v-383c2d15]:hover .ui-tooltip {
    visibility: visible
}

.board-card .hearts .stat-variations[data-v-383c2d15] {
    position: absolute;
    left: calc(50% - 20px);
    bottom: calc(100% + 40px);
    height: 40px;
    width: 40px;
    pointer-events: none
}

.board-card .hearts .stat-variations .stat-variation[data-v-383c2d15] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    border-radius: 4px;
    text-align: center;
    color: #fff;
    background-color: #d22a2a
}

.board-card .hearts .stat-variations .stat-variation.stat-variation-enter-active[data-v-383c2d15] {
    transition: .5s cubic-bezier(.165, .84, .44, 1)
}

.board-card .hearts .stat-variations .stat-variation.stat-variation-enter[data-v-383c2d15] {
    transform: translateY(32px) scale(.8);
    opacity: 0
}

.board-card .hearts .stat-variations .stat-variation.stat-variation-leave-active[data-v-383c2d15] {
    transition: .15s cubic-bezier(.165, .84, .44, 1)
}

.board-card .hearts .stat-variations .stat-variation.stat-variation-leave-to[data-v-383c2d15] {
    transform: translateY(-16px) scale(.8);
    opacity: 0
}

.board-card .hearts .list-status[data-v-383c2d15] {
    position: absolute;
    left: 50%;
    bottom: 48px;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    color: #fff;
    text-align: center
}

.board-card .hearts .list-status[data-v-383c2d15] .ui-status {
    margin: 0 8px
}

.board-card .hearts .list-status[data-v-383c2d15] .ui-status:first-child {
    margin-left: 0
}

.board-card .hearts .list-status[data-v-383c2d15] .ui-status:last-child {
    margin-right: 0
}

.board-card .values[data-v-383c2d15] {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% - 8px);
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    color: #fff;
    text-align: center
}

.board-card .values[data-v-383c2d15] .ui-stat {
    margin: 0 8px
}

.board-card .durability[data-v-383c2d15] {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 72px);
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row
}

.board-card .durability .dot[data-v-383c2d15] {
    width: 12px;
    height: 12px;
    margin: 0 2px;
    border-radius: 50%;
    background-color: #fff
}

.board-card .equipments[data-v-383c2d15] {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 72px);
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row
}

.board-card .equipments[data-v-383c2d15] .equipment {
    margin: 0 4px
}

.board-card[data-v-383c2d15] .main-tooltip {
    position: absolute;
    bottom: -8px;
    visibility: visible
}

.board-card[data-v-383c2d15] .main-tooltip:before {
    height: 64px;
    bottom: -64px
}

.board-card .hit-animation[data-v-383c2d15] {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 772px;
    height: 700px;
    background-size: 3860px auto;
    -webkit-animation: anim-data-v-383c2d15 .4s steps(5) forwards;
    animation: anim-data-v-383c2d15 .4s steps(5) forwards
}

@-webkit-keyframes crown-data-v-383c2d15 {
    0% {
        transform: translate(0)
    }
    to {
        transform: translateY(-8px)
    }
}

@keyframes crown-data-v-383c2d15 {
    0% {
        transform: translate(0)
    }
    to {
        transform: translateY(-8px)
    }
}

@-webkit-keyframes anim-data-v-383c2d15 {
    0% {
        background-position: 0 top;
        visibility: visible
    }
    99% {
        visibility: visible
    }
    to {
        visibility: hidden;
        background-position: -3860px top
    }
}

@keyframes anim-data-v-383c2d15 {
    0% {
        background-position: 0 top;
        visibility: visible
    }
    99% {
        visibility: visible
    }
    to {
        visibility: hidden;
        background-position: -3860px top
    }
}

@-webkit-keyframes sprite-floating-data-v-383c2d15 {
    0% {
        transform: translateY(0)
    }
    to {
        transform: translateY(-8px)
    }
}

@keyframes sprite-floating-data-v-383c2d15 {
    0% {
        transform: translateY(0)
    }
    to {
        transform: translateY(-8px)
    }
}

@-webkit-keyframes shadow-floating-data-v-383c2d15 {
    0% {
        transform: scale(1)
    }
    to {
        transform: scale(.9)
    }
}

@keyframes shadow-floating-data-v-383c2d15 {
    0% {
        transform: scale(1)
    }
    to {
        transform: scale(.9)
    }
}

@-webkit-keyframes sprite-idle-data-v-383c2d15 {
    0% {
        transform: scaleY(1)
    }
    to {
        transform: scaleY(.95)
    }
}

@keyframes sprite-idle-data-v-383c2d15 {
    0% {
        transform: scaleY(1)
    }
    to {
        transform: scaleY(.95)
    }
}

@-webkit-keyframes sprite-move-data-v-383c2d15 {
    0% {
        transform: translateY(0) scaleY(1)
    }
    10% {
        transform: translateY(0) scaleY(.7)
    }
    15% {
        transform: translateY(-20px) scaleY(1)
    }
    20% {
        transform: translateY(-40px) scaleY(1.3)
    }
    48%,
    52% {
        transform: translateY(-80px) scaleY(1.3)
    }
    80% {
        transform: translateY(0) scaleY(1)
    }
    90% {
        transform: translateY(2px) scaleY(.9)
    }
    to {
        transform: translateY(0) scaleY(1)
    }
}

@keyframes sprite-move-data-v-383c2d15 {
    0% {
        transform: translateY(0) scaleY(1)
    }
    10% {
        transform: translateY(0) scaleY(.7)
    }
    15% {
        transform: translateY(-20px) scaleY(1)
    }
    20% {
        transform: translateY(-40px) scaleY(1.3)
    }
    48%,
    52% {
        transform: translateY(-80px) scaleY(1.3)
    }
    80% {
        transform: translateY(0) scaleY(1)
    }
    90% {
        transform: translateY(2px) scaleY(.9)
    }
    to {
        transform: translateY(0) scaleY(1)
    }
}

@-webkit-keyframes shadow-move-data-v-383c2d15 {
    0% {
        transform: scale(1)
    }
    10% {
        transform: scale(1.1)
    }
    15% {
        transform: scale(.85)
    }
    20% {
        transform: scale(.75)
    }
    48%,
    52% {
        transform: scale(.5)
    }
    80% {
        transform: scale(1)
    }
    90% {
        transform: scale(1)
    }
    to {
        transform: scale(1)
    }
}

@keyframes shadow-move-data-v-383c2d15 {
    0% {
        transform: scale(1)
    }
    10% {
        transform: scale(1.1)
    }
    15% {
        transform: scale(.85)
    }
    20% {
        transform: scale(.75)
    }
    48%,
    52% {
        transform: scale(.5)
    }
    80% {
        transform: scale(1)
    }
    90% {
        transform: scale(1)
    }
    to {
        transform: scale(1)
    }
}

@-webkit-keyframes shadow-attack-right-data-v-383c2d15 {
    0% {
        transform: translateX(0)
    }
    10% {
        transform: translateX(101px) scale(.75)
    }
    90% {
        transform: translateX(116px) scale(.75)
    }
    to {
        transform: translateX(0)
    }
}

@keyframes shadow-attack-right-data-v-383c2d15 {
    0% {
        transform: translateX(0)
    }
    10% {
        transform: translateX(101px) scale(.75)
    }
    90% {
        transform: translateX(116px) scale(.75)
    }
    to {
        transform: translateX(0)
    }
}

@-webkit-keyframes sprite-attack-right-data-v-383c2d15 {
    0% {
        transform: translateX(0)
    }
    10% {
        transform: translateX(101px) translateY(-8px) scale(1.1)
    }
    90% {
        transform: translateX(116px) translateY(-4px) scale(1.1)
    }
    to {
        transform: translateX(0)
    }
}

@keyframes sprite-attack-right-data-v-383c2d15 {
    0% {
        transform: translateX(0)
    }
    10% {
        transform: translateX(101px) translateY(-8px) scale(1.1)
    }
    90% {
        transform: translateX(116px) translateY(-4px) scale(1.1)
    }
    to {
        transform: translateX(0)
    }
}

@-webkit-keyframes shadow-attack-left-data-v-383c2d15 {
    0% {
        transform: translateX(0)
    }
    10% {
        transform: translateX(-101px) scale(.75)
    }
    90% {
        transform: translateX(-116px) scale(.75)
    }
    to {
        transform: translateX(0)
    }
}

@keyframes shadow-attack-left-data-v-383c2d15 {
    0% {
        transform: translateX(0)
    }
    10% {
        transform: translateX(-101px) scale(.75)
    }
    90% {
        transform: translateX(-116px) scale(.75)
    }
    to {
        transform: translateX(0)
    }
}

@-webkit-keyframes sprite-attack-left-data-v-383c2d15 {
    0% {
        transform: translateX(0)
    }
    10% {
        transform: translateX(-101px) translateY(-8px) scale(1.1)
    }
    90% {
        transform: translateX(-116px) translateY(-4px) scale(1.1)
    }
    to {
        transform: translateX(0)
    }
}

@keyframes sprite-attack-left-data-v-383c2d15 {
    0% {
        transform: translateX(0)
    }
    10% {
        transform: translateX(-101px) translateY(-8px) scale(1.1)
    }
    90% {
        transform: translateX(-116px) translateY(-4px) scale(1.1)
    }
    to {
        transform: translateX(0)
    }
}

@-webkit-keyframes sprite-hit-left-data-v-383c2d15 {
    0% {
        transform: translateX(0)
    }
    to {
        transform: translateX(-16px)
    }
}

@keyframes sprite-hit-left-data-v-383c2d15 {
    0% {
        transform: translateX(0)
    }
    to {
        transform: translateX(-16px)
    }
}

@-webkit-keyframes sprite-hit-right-data-v-383c2d15 {
    0% {
        transform: translateX(0)
    }
    to {
        transform: translateX(16px)
    }
}

@keyframes sprite-hit-right-data-v-383c2d15 {
    0% {
        transform: translateX(0)
    }
    to {
        transform: translateX(16px)
    }
}

.board[data-v-335984bc] {
    height: 232px;
    width: 1624px
}

.board .board-content[data-v-335984bc] {
    width: 4872px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row
}

.board .board-content .dropzone[data-v-335984bc] {
    position: absolute;
    left: 0;
    bottom: 0
}

.board .board-content .dropzone[data-position="0"][data-v-335984bc] {
    transform: translateX(0)
}

.board .board-content .dropzone[data-position="1"][data-v-335984bc] {
    transform: translateX(232px)
}

.board .board-content .dropzone[data-position="2"][data-v-335984bc] {
    transform: translateX(464px)
}

.board .board-content .dropzone[data-position="3"][data-v-335984bc] {
    transform: translateX(696px)
}

.board .board-content .dropzone[data-position="4"][data-v-335984bc] {
    transform: translateX(928px)
}

.board .board-content .dropzone[data-position="5"][data-v-335984bc] {
    transform: translateX(1160px)
}

.board .board-content .dropzone[data-position="6"][data-v-335984bc] {
    transform: translateX(1392px)
}

.board .board-content .dropzone[data-position="7"][data-v-335984bc] {
    transform: translateX(1624px)
}

.board .board-content .dropzone[data-position="8"][data-v-335984bc] {
    transform: translateX(1856px)
}

.board .board-content .dropzone[data-position="9"][data-v-335984bc] {
    transform: translateX(2088px)
}

.board .board-content .dropzone[data-position="10"][data-v-335984bc] {
    transform: translateX(2320px)
}

.board .board-content .dropzone[data-position="11"][data-v-335984bc] {
    transform: translateX(2552px)
}

.board .board-content .dropzone[data-position="12"][data-v-335984bc] {
    transform: translateX(2784px)
}

.board .board-content .dropzone[data-position="13"][data-v-335984bc] {
    transform: translateX(3016px)
}

.board .board-content .dropzone[data-position="14"][data-v-335984bc] {
    transform: translateX(3248px)
}

.board .board-content .dropzone[data-position="15"][data-v-335984bc] {
    transform: translateX(3480px)
}

.board .board-content .dropzone[data-position="16"][data-v-335984bc] {
    transform: translateX(3712px)
}

.board .board-content .dropzone[data-position="17"][data-v-335984bc] {
    transform: translateX(3944px)
}

.board .board-content .dropzone[data-position="18"][data-v-335984bc] {
    transform: translateX(4176px)
}

.board .board-content .dropzone[data-position="19"][data-v-335984bc] {
    transform: translateX(4408px)
}

.board .board-content .dropzone[data-position="20"][data-v-335984bc] {
    transform: translateX(4640px)
}

.board .board-content .dropzone[data-position="21"][data-v-335984bc] {
    transform: translateX(4872px)
}

.board .board-content .dropzone[data-position="22"][data-v-335984bc] {
    transform: translateX(5104px)
}

.board .board-content .dropzone[data-position="23"][data-v-335984bc] {
    transform: translateX(5336px)
}

.board .board-content .dropzone[data-position="24"][data-v-335984bc] {
    transform: translateX(5568px)
}

.board .board-content .dropzone[data-position="25"][data-v-335984bc] {
    transform: translateX(5800px)
}

.board .board-content .dropzone[data-position="26"][data-v-335984bc] {
    transform: translateX(6032px)
}

.board .board-content .dropzone[data-position="27"][data-v-335984bc] {
    transform: translateX(6264px)
}

.board .board-content .dropzone[data-position="28"][data-v-335984bc] {
    transform: translateX(6496px)
}

.board .board-content .dropzone[data-position="29"][data-v-335984bc] {
    transform: translateX(6728px)
}

.board .board-content .dropzone[data-position="30"][data-v-335984bc] {
    transform: translateX(6960px)
}

.board .board-content .board-card[data-v-335984bc] {
    position: absolute;
    left: 0;
    bottom: 0;
    transition: .42s linear .06s
}

.board .board-content .board-card[data-v-335984bc]:hover {
    z-index: 1
}

.board .board-content .board-card[data-position="0"][data-v-335984bc] {
    transform: translateX(0)
}

.board .board-content .board-card[data-position="1"][data-v-335984bc] {
    transform: translateX(232px)
}

.board .board-content .board-card[data-position="2"][data-v-335984bc] {
    transform: translateX(464px)
}

.board .board-content .board-card[data-position="3"][data-v-335984bc] {
    transform: translateX(696px)
}

.board .board-content .board-card[data-position="4"][data-v-335984bc] {
    transform: translateX(928px)
}

.board .board-content .board-card[data-position="5"][data-v-335984bc] {
    transform: translateX(1160px)
}

.board .board-content .board-card[data-position="6"][data-v-335984bc] {
    transform: translateX(1392px)
}

.board .board-content .board-card[data-position="7"][data-v-335984bc] {
    transform: translateX(1624px)
}

.board .board-content .board-card[data-position="8"][data-v-335984bc] {
    transform: translateX(1856px)
}

.board .board-content .board-card[data-position="9"][data-v-335984bc] {
    transform: translateX(2088px)
}

.board .board-content .board-card[data-position="10"][data-v-335984bc] {
    transform: translateX(2320px)
}

.board .board-content .board-card[data-position="11"][data-v-335984bc] {
    transform: translateX(2552px)
}

.board .board-content .board-card[data-position="12"][data-v-335984bc] {
    transform: translateX(2784px)
}

.board .board-content .board-card[data-position="13"][data-v-335984bc] {
    transform: translateX(3016px)
}

.board .board-content .board-card[data-position="14"][data-v-335984bc] {
    transform: translateX(3248px)
}

.board .board-content .board-card[data-position="15"][data-v-335984bc] {
    transform: translateX(3480px)
}

.board .board-content .board-card[data-position="16"][data-v-335984bc] {
    transform: translateX(3712px)
}

.board .board-content .board-card[data-position="17"][data-v-335984bc] {
    transform: translateX(3944px)
}

.board .board-content .board-card[data-position="18"][data-v-335984bc] {
    transform: translateX(4176px)
}

.board .board-content .board-card[data-position="19"][data-v-335984bc] {
    transform: translateX(4408px)
}

.board .board-content .board-card[data-position="20"][data-v-335984bc] {
    transform: translateX(4640px)
}

.board .board-content .board-card[data-position="21"][data-v-335984bc] {
    transform: translateX(4872px)
}

.board .board-content .board-card[data-position="22"][data-v-335984bc] {
    transform: translateX(5104px)
}

.board .board-content .board-card[data-position="23"][data-v-335984bc] {
    transform: translateX(5336px)
}

.board .board-content .board-card[data-position="24"][data-v-335984bc] {
    transform: translateX(5568px)
}

.board .board-content .board-card[data-position="25"][data-v-335984bc] {
    transform: translateX(5800px)
}

.board .board-content .board-card[data-position="26"][data-v-335984bc] {
    transform: translateX(6032px)
}

.board .board-content .board-card[data-position="27"][data-v-335984bc] {
    transform: translateX(6264px)
}

.board .board-content .board-card[data-position="28"][data-v-335984bc] {
    transform: translateX(6496px)
}

.board .board-content .board-card[data-position="29"][data-v-335984bc] {
    transform: translateX(6728px)
}

.board .board-content .board-card[data-position="30"][data-v-335984bc] {
    transform: translateX(6960px)
}

.board .board-content .board-card.board-content-enter-active[data-v-335984bc] .board-card .board-card-content {
    transition: .25s cubic-bezier(.165, .84, .44, 1)
}

.board .board-content .board-card.board-content-enter[data-v-335984bc] .board-card .board-card-content {
    transform: scale(1.25);
    opacity: 0
}

.board .board-content .board-card.board-content-leave-active[data-v-335984bc] .board-card .board-card-content {
    transition: .15s cubic-bezier(.165, .84, .44, 1) .15s
}

.board .board-content .board-card.board-content-leave-to[data-v-335984bc] .board-card .board-card-content {
    transform: scale(.75);
    opacity: 0
}

.board .board-content .board-card.attack-left[data-v-335984bc],
.board .board-content .board-card.attack-right[data-v-335984bc] {
    z-index: 1
}

.board .board-content .board-card.pushing[data-v-335984bc] {
    transition: .5s cubic-bezier(.165, .84, .44, 1)
}

.ui-gold[data-v-d446c034] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-direction: row
}

.ui-gold.reverse[data-v-d446c034] {
    flex-direction: row-reverse
}

.ui-gold.reverse .icon[data-v-d446c034] {
    margin: 0 8px 0 0
}

.ui-gold .icon[data-v-d446c034] {
    width: 24px;
    height: 40px;
    margin: 0 0 0 8px;
    background: 50% no-repeat;
    background-size: contain
}

.hand[data-v-829c9d66] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -96px;
    width: 100%;
    height: 318px/2;
    align-items: center
}

.hand .cards[data-v-829c9d66],
.hand[data-v-829c9d66] {
    display: flex;
    justify-content: center;
    flex-direction: row
}

.hand .cards[data-v-829c9d66] {
    height: 100%;
    align-items: flex-end;
    padding: 0 32px
}

.hand .cards[data-count="3"] .card-wrap:first-child .card-wrap-content[data-v-829c9d66] {
    transform: scale(.6) rotate(-5deg) translateY(8px)
}

.hand .cards[data-count="3"] .card-wrap:nth-child(2) .card-wrap-content[data-v-829c9d66] {
    transform: scale(.6) rotate(0)
}

.hand .cards[data-count="3"] .card-wrap:nth-child(3) .card-wrap-content[data-v-829c9d66] {
    transform: scale(.6) rotate(5deg) translateY(8px)
}

.hand .cards[data-count="4"] .card-wrap:first-child .card-wrap-content[data-v-829c9d66] {
    transform: scale(.6) rotate(-8deg) translateY(32px)
}

.hand .cards[data-count="4"] .card-wrap:nth-child(2) .card-wrap-content[data-v-829c9d66] {
    transform: scale(.6) rotate(-2deg) translateY(8px)
}

.hand .cards[data-count="4"] .card-wrap:nth-child(3) .card-wrap-content[data-v-829c9d66] {
    transform: scale(.6) rotate(2deg) translateY(8px)
}

.hand .cards[data-count="4"] .card-wrap:nth-child(4) .card-wrap-content[data-v-829c9d66] {
    transform: scale(.6) rotate(8deg) translateY(32px)
}

.hand .cards[data-count="5"] .card-wrap:first-child .card-wrap-content[data-v-829c9d66] {
    transform: scale(.6) rotate(-10deg) translateY(32px)
}

.hand .cards[data-count="5"] .card-wrap:nth-child(2) .card-wrap-content[data-v-829c9d66] {
    transform: scale(.6) rotate(-5deg) translateY(8px)
}

.hand .cards[data-count="5"] .card-wrap:nth-child(3) .card-wrap-content[data-v-829c9d66] {
    transform: scale(.6) rotate(0deg)
}

.hand .cards[data-count="5"] .card-wrap:nth-child(4) .card-wrap-content[data-v-829c9d66] {
    transform: scale(.6) rotate(5deg) translateY(8px)
}

.hand .cards[data-count="5"] .card-wrap:nth-child(5) .card-wrap-content[data-v-829c9d66] {
    transform: scale(.6) rotate(10deg) translateY(32px)
}

.hand .cards[data-count="6"] .card-wrap:first-child .card-wrap-content[data-v-829c9d66] {
    transform: scale(.6) rotate(-10deg) translateY(32px)
}

.hand .cards[data-count="6"] .card-wrap:nth-child(2) .card-wrap-content[data-v-829c9d66] {
    transform: scale(.6) rotate(-5deg) translateY(12px)
}

.hand .cards[data-count="6"] .card-wrap:nth-child(3) .card-wrap-content[data-v-829c9d66] {
    transform: scale(.6) rotate(-2deg) translateY(4px)
}

.hand .cards[data-count="6"] .card-wrap:nth-child(4) .card-wrap-content[data-v-829c9d66] {
    transform: scale(.6) rotate(2deg) translateY(4px)
}

.hand .cards[data-count="6"] .card-wrap:nth-child(5) .card-wrap-content[data-v-829c9d66] {
    transform: scale(.6) rotate(5deg) translateY(12px)
}

.hand .cards[data-count="6"] .card-wrap:nth-child(6) .card-wrap-content[data-v-829c9d66] {
    transform: scale(.6) rotate(10deg) translateY(32px)
}

.hand .cards[data-count] .card-wrap[data-v-829c9d66] {
    margin: 0 -56px;
    pointer-events: none
}

.hand .cards[data-count] .card-wrap.cards-enter[data-v-829c9d66] {
    opacity: 0;
    transform: translateY(-150px)
}

.hand .cards[data-count] .card-wrap.cards-enter-active[data-v-829c9d66] {
    transition: .3s cubic-bezier(.165, .84, .44, 1)
}

.hand .cards[data-count] .card-wrap.cards-enter-active[data-v-829c9d66]:first-child {
    transition-delay: .05s
}

.hand .cards[data-count] .card-wrap.cards-enter-active[data-v-829c9d66]:nth-child(2) {
    transition-delay: .1s
}

.hand .cards[data-count] .card-wrap.cards-enter-active[data-v-829c9d66]:nth-child(3) {
    transition-delay: .15s
}

.hand .cards[data-count] .card-wrap.cards-enter-active[data-v-829c9d66]:nth-child(4) {
    transition-delay: .2s
}

.hand .cards[data-count] .card-wrap.cards-enter-active[data-v-829c9d66]:nth-child(5) {
    transition-delay: .25s
}

.hand .cards[data-count] .card-wrap.cards-enter-active[data-v-829c9d66]:nth-child(6) {
    transition-delay: .3s
}

.hand .cards[data-count] .card-wrap[data-v-829c9d66]:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: 64px
}

.hand .cards[data-count] .card-wrap .card-wrap-content[data-v-829c9d66] {
    transition: .15s cubic-bezier(.165, .84, .44, 1);
    transform: scale(.6);
    pointer-events: all
}

.hand .cards[data-count] .card-wrap .card-wrap-content[data-v-829c9d66]:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: 32px
}

.hand .cards[data-count] .card-wrap .card-wrap-content[data-v-829c9d66]:hover {
    transform: translateY(-112px) scale(1);
    z-index: 2
}

.hand .cards[data-count] .card-wrap .card-wrap-content.dragging[data-v-829c9d66] {
    transition: none
}

.hand .cards[data-count] .card-wrap .card-wrap-content.moving[data-v-829c9d66] {
    z-index: 3
}

.hand .cards[data-count] .card-wrap .card-wrap-content.dropping[data-v-829c9d66] {
    transition: .25s cubic-bezier(.165, .84, .44, 1)
}

.hand[data-v-829c9d66] .reroll-button {
    position: absolute;
    left: calc(50% + 380px);
    bottom: 120px;
    transform: scale(.8)
}

.hand[data-v-829c9d66] .reroll-button.expansive {
    color: #d22a2a
}

.hand[data-v-829c9d66] .reroll-button .text {
    margin: 0 16px 0 0
}

.hand[data-v-829c9d66] .reroll-button .ui-gold .icon {
    margin-left: 4px
}

.talisman[data-v-62531b3d] {
    width: 120px;
    height: 120px
}

.talisman .illustration[data-v-62531b3d] {
    background: 50% no-repeat;
    background-size: contain
}

.shop[data-v-59f1f2fe],
.talisman .illustration[data-v-62531b3d] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.shop.shop-enter-active[data-v-59f1f2fe] {
    transition: 2s cubic-bezier(.165, .84, .44, 1) .5s
}

.shop.shop-enter-active .merchant[data-v-59f1f2fe] {
    transition: .35s cubic-bezier(.165, .84, .44, 1) .5s
}

.shop.shop-enter-active .bubble[data-v-59f1f2fe] {
    transition: .25s cubic-bezier(.175, .885, .32, 1.275) .8s
}

.shop.shop-enter-active .content .shadow[data-v-59f1f2fe],
.shop.shop-enter-active .content[data-v-59f1f2fe] {
    transition: .25s cubic-bezier(.165, .84, .44, 1)
}

.shop.shop-enter-active .content .buttons[data-v-59f1f2fe] {
    transition: .25s cubic-bezier(.165, .84, .44, 1) 1.5s
}

.shop.shop-enter-active .poster[data-v-59f1f2fe],
.shop.shop-enter-active .sign-wrap[data-v-59f1f2fe] {
    transition: .25s cubic-bezier(.165, .84, .44, 1)
}

.shop.shop-enter .bg[data-v-59f1f2fe] {
    opacity: 0;
    transform: scale(1.05)
}

.shop.shop-enter .foreground[data-v-59f1f2fe] {
    transform: scale(1.5)
}

.shop.shop-enter .merchant[data-v-59f1f2fe] {
    transform: translate(50%);
    opacity: 0
}

.shop.shop-enter .bubble[data-v-59f1f2fe] {
    opacity: 0;
    transform: translate(48px, 32px) scale(.9)
}

.shop.shop-enter .content[data-v-59f1f2fe] {
    transform: translateY(24px);
    opacity: 0
}

.shop.shop-enter .content .shadow[data-v-59f1f2fe] {
    opacity: 0
}

.shop.shop-enter .content .buttons[data-v-59f1f2fe] {
    transform: translateY(16px);
    opacity: 0
}

.shop.shop-enter .sign-wrap[data-v-59f1f2fe] {
    transform: translateX(-40px);
    opacity: 0
}

.shop.shop-enter .poster[data-v-59f1f2fe] {
    transform: translateY(-40px);
    opacity: 0
}

.shop.shop-leave-active[data-v-59f1f2fe] {
    transition: .5s cubic-bezier(.165, .84, .44, 1)
}

.shop.shop-leave-to[data-v-59f1f2fe] {
    opacity: 0
}

.shop>.bg[data-v-59f1f2fe] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: bottom no-repeat;
    background-size: cover;
    transition: .5s cubic-bezier(.165, .84, .44, 1)
}

.shop>.bg .shadows[data-v-59f1f2fe] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: bottom 165px left 80px no-repeat;
    background-size: 1008.9099999999999px 149.20499999999998px
}

.shop>.foreground[data-v-59f1f2fe] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: bottom no-repeat;
    background-size: cover;
    transition: .5s cubic-bezier(.165, .84, .44, 1) .25s;
    pointer-events: none
}

.shop .poster[data-v-59f1f2fe] {
    position: absolute;
    left: 380px;
    bottom: 760px;
    width: 187.6px;
    height: 229.2px;
    perspective: 1000px
}

.shop .poster .scotch[data-v-59f1f2fe] {
    position: absolute;
    left: 50%;
    top: 0;
    width: 67.33333333333333px;
    height: 18.666666666666668px;
    background-size: contain;
    transform: translateX(-50%)
}

.shop .poster .poster-content[data-v-59f1f2fe] {
    width: 100%;
    height: 100%;
    transform-origin: center 8px;
    transition: .15s cubic-bezier(.165, .84, .44, 1)
}

.shop .poster .poster-content .shadow[data-v-59f1f2fe] {
    filter: brightness(0);
    opacity: .5;
    transform: translate(0);
    transition: .15s cubic-bezier(.165, .84, .44, 1)
}

.shop .poster .poster-content .bg[data-v-59f1f2fe],
.shop .poster .poster-content .shadow[data-v-59f1f2fe] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-size: contain
}

.shop .poster .poster-content .price[data-v-59f1f2fe] {
    position: absolute;
    left: 50%;
    bottom: 42px;
    transform: translateX(-50%);
    font-size: 4rem;
    line-height: .9em;
    color: #fff
}

.shop .sign-wrap[data-v-59f1f2fe] {
    position: absolute;
    left: 70px;
    bottom: 338px;
    width: 200px;
    height: 315.83333333333337px;
    perspective: 1000px
}

.shop .sign-wrap[data-v-59f1f2fe]:hover .ui-tooltip {
    visibility: visible;
    bottom: calc(100% + 16px)
}

.shop .sign-wrap .sign[data-v-59f1f2fe] {
    width: 100%;
    height: 100%;
    transform-origin: bottom center;
    transition: .15s cubic-bezier(.165, .84, .44, 1)
}

.shop .sign-wrap .sign[data-v-59f1f2fe]:hover {
    transform: scale(1) rotateX(-10deg)
}

.shop .sign-wrap .sign[data-v-59f1f2fe]:active {
    transform: scale(1) rotateX(10deg)
}

.shop .sign-wrap .sign .bg[data-v-59f1f2fe] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-size: contain
}

.shop .sign-wrap .sign .sign-content[data-v-59f1f2fe] {
    position: absolute;
    left: 8px;
    right: 16px;
    top: 14px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-size: 4.8rem;
    line-height: .9em;
    color: #792e3a
}

.shop .sign-wrap .sign .sign-content .price.expansive[data-v-59f1f2fe] {
    color: #d22a2a;
    text-shadow: -1px -1px #fff, -1px 1px #fff, 1px 1px #fff, 1px -1px #fff
}

.shop .merchant[data-v-59f1f2fe] {
    position: absolute;
    right: 0;
    bottom: 64px;
    width: 1095px;
    height: 878px;
    transform: translate(25%)
}

.shop .merchant .shadow[data-v-59f1f2fe] {
    position: absolute;
    left: 25%;
    right: 20%;
    bottom: 0;
    height: 80px;
    background-color: #bc6055;
    border-radius: 50%
}

.shop .merchant .illustration[data-v-59f1f2fe] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: 50% no-repeat;
    background-size: contain;
    transform-origin: bottom center;
    -webkit-animation: sprite-idle-data-v-59f1f2fe 3s cubic-bezier(.445, .05, .55, .95) .2s infinite alternate;
    animation: sprite-idle-data-v-59f1f2fe 3s cubic-bezier(.445, .05, .55, .95) .2s infinite alternate
}

.shop .bubble[data-v-59f1f2fe] {
    position: absolute;
    right: 450px;
    bottom: 659px;
    color: #fff;
    width: 650px;
    height: 256px;
    padding: 0 48px 80px 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row
}

.shop .bubble .bg[data-v-59f1f2fe] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-size: contain
}

.shop .bubble .bg .speach[data-v-59f1f2fe] {
    position: absolute;
    left: calc(100% - 160px);
    top: calc(100% - 24px);
    transform: rotate(10deg)
}

.shop .bubble .bg .speach>svg[data-v-59f1f2fe] {
    width: 150px;
    height: 80px
}

.shop .bubble[data-v-59f1f2fe]:after {
    content: ""
}

.shop .bubble .text[data-v-59f1f2fe] {
    font-size: 4rem;
    line-height: .9em;
    width: 600px;
    text-align: center
}

.shop .content[data-v-59f1f2fe] {
    position: absolute;
    left: 80px;
    bottom: 120px;
    width: 1014px;
    height: 400px;
    color: #fff
}

.shop .content .table[data-v-59f1f2fe] {
    width: 1014px;
    height: 336px
}

.shop .content .table .bg[data-v-59f1f2fe] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-size: contain
}

.shop .content .table .choices[data-v-59f1f2fe] {
    position: absolute;
    left: 200px;
    top: -64px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    width: 700px;
    height: 140px
}

.shop .content .table .choices .choice[data-v-59f1f2fe] {
    position: absolute;
    width: 140px;
    height: 160px;
    margin-left: -70px;
    font-size: 4rem;
    line-height: .9em
}

.shop .content .table .choices .choice.p1[data-v-59f1f2fe] {
    left: 20%
}

.shop .content .table .choices .choice.p2[data-v-59f1f2fe] {
    left: 50%
}

.shop .content .table .choices .choice.p3[data-v-59f1f2fe] {
    left: 80%
}

.shop .content .table .choices .choice.choice-enter-active[data-v-59f1f2fe] {
    transition: .25s cubic-bezier(.165, .84, .44, 1) .25s
}

.shop .content .table .choices .choice.choice-enter-active.p1[data-v-59f1f2fe] {
    transition-delay: .1s
}

.shop .content .table .choices .choice.choice-enter-active.p2[data-v-59f1f2fe] {
    transition-delay: .2s
}

.shop .content .table .choices .choice.choice-enter-active.p3[data-v-59f1f2fe] {
    transition-delay: .3s
}

.shop .content .table .choices .choice.choice-enter[data-v-59f1f2fe] {
    transform: translateY(-40px);
    opacity: 0
}

.shop .content .table .choices .choice.choice-leave-active[data-v-59f1f2fe] {
    transition: .15s cubic-bezier(.165, .84, .44, 1)
}

.shop .content .table .choices .choice.choice-leave-to[data-v-59f1f2fe] {
    transform: translateY(40px);
    opacity: 0
}

.shop .content .table .choices .choice[data-v-59f1f2fe]:hover .ui-tooltip {
    visibility: visible
}

.shop .content .table .choices .choice.expansive .price[data-v-59f1f2fe] {
    color: #d22a2a;
    text-shadow: -1px -1px #fff, -1px 1px #fff, 1px 1px #fff, 1px -1px #fff
}

.shop .content .table .choices .choice[data-v-59f1f2fe] .ui-tooltip {
    bottom: calc(100% + 56px)
}

.shop .content .table .choices .choice[data-v-59f1f2fe] .ui-tooltip:before {
    height: 96px;
    bottom: -96px
}

.shop .content .table .choices .choice .price[data-v-59f1f2fe] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: calc(100% - 8px);
    height: 32px;
    margin: 0 0 16px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row
}

.shop .content .table .choices .choice .talisman-wrap[data-v-59f1f2fe] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    transform-origin: bottom center;
    transition: .1s cubic-bezier(.165, .84, .44, 1)
}

.shop .content .table .choices .choice .talisman-wrap[data-v-59f1f2fe]:hover {
    transform: scale(1.05)
}

.shop .content .table .choices .choice .talisman-wrap[data-v-59f1f2fe]:active {
    transform: scale(1)
}

.shop .content .table .choices .choice .talisman-wrap[data-v-59f1f2fe] .talisman {
    -webkit-animation: sprite-floating-data-v-59f1f2fe 2s cubic-bezier(.445, .05, .55, .95) infinite alternate;
    animation: sprite-floating-data-v-59f1f2fe 2s cubic-bezier(.445, .05, .55, .95) infinite alternate
}

.shop .content .table .choices .choice .talisman-wrap .shadow[data-v-59f1f2fe] {
    position: absolute;
    left: 16px;
    right: 16px;
    bottom: 4px;
    height: 24px;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, .2);
    -webkit-animation: shadow-floating-data-v-59f1f2fe 2s cubic-bezier(.445, .05, .55, .95) infinite alternate;
    animation: shadow-floating-data-v-59f1f2fe 2s cubic-bezier(.445, .05, .55, .95) infinite alternate
}

.shop .content .buttons[data-v-59f1f2fe] {
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    transform: translateY(-48px)
}

.shop .content .buttons[data-v-59f1f2fe] .ui-button {
    margin: 0 8px
}

@-webkit-keyframes sprite-floating-data-v-59f1f2fe {
    0% {
        transform: translateY(0)
    }
    to {
        transform: translateY(-8px)
    }
}

@keyframes sprite-floating-data-v-59f1f2fe {
    0% {
        transform: translateY(0)
    }
    to {
        transform: translateY(-8px)
    }
}

@-webkit-keyframes shadow-floating-data-v-59f1f2fe {
    0% {
        transform: scale(1)
    }
    to {
        transform: scale(.8)
    }
}

@keyframes shadow-floating-data-v-59f1f2fe {
    0% {
        transform: scale(1)
    }
    to {
        transform: scale(.8)
    }
}

@-webkit-keyframes sprite-idle-data-v-59f1f2fe {
    0% {
        transform: scaleY(1)
    }
    to {
        transform: scaleY(.98)
    }
}

@keyframes sprite-idle-data-v-59f1f2fe {
    0% {
        transform: scaleY(1)
    }
    to {
        transform: scaleY(.98)
    }
}

.game[data-v-361c887e] {
    height: 100%;
    background-color: #363850
}

.game[data-v-361c887e]:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 4px;
    background-color: #363850
}

.game.shaking[data-v-361c887e] {
    -webkit-animation: shake-data-v-361c887e .15s ease-in-out infinite;
    animation: shake-data-v-361c887e .15s ease-in-out infinite
}

.game .game-content[data-v-361c887e] {
    height: 100%;
    transition: .5s cubic-bezier(.445, .05, .55, .95)
}

.game .game-content[data-room="0"][data-v-361c887e] {
    transform: translateX(0)
}

.game .game-content[data-room="1"][data-v-361c887e] {
    transform: translateX(-1624px)
}

.game .game-content[data-room="2"][data-v-361c887e] {
    transform: translateX(-3248px)
}

.game .game-content[data-room="3"][data-v-361c887e] {
    transform: translateX(-4872px)
}

.game .board[data-v-361c887e] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 370px
}

.game .start-turn-button[data-v-361c887e] {
    position: absolute;
    right: 40px;
    bottom: 40px;
    width: 179px;
    height: 179px;
    border-radius: 50%;
    font-size: 6.4rem;
    line-height: .9em;
    text-align: center;
    color: #363850;
    text-transform: uppercase;
    transition: transform .1s cubic-bezier(.165, .84, .44, 1)
}

.game .start-turn-button[data-v-361c887e]:hover {
    transform: translateY(-4px)
}

.game .start-turn-button:hover .button[data-v-361c887e] {
    background-position: 0 100%
}

.game .start-turn-button:hover .shadow[data-v-361c887e] {
    transform: translate(-6px, 8px)
}

.game .start-turn-button[data-v-361c887e]:active {
    transform: translateY(4px)
}

.game .start-turn-button:active .shadow[data-v-361c887e] {
    transform: translate(-2px, 2px)
}

.game .start-turn-button .button[data-v-361c887e],
.game .start-turn-button .shadow[data-v-361c887e] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: 0 0 no-repeat;
    background-size: 179px 358px
}

.game .start-turn-button .shadow[data-v-361c887e] {
    transform: translate(-4px, 4px);
    transition: transform .1s cubic-bezier(.165, .84, .44, 1);
    filter: brightness(0)
}

.game .start-turn-button .text[data-v-361c887e] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row
}

.game .hero-infos[data-v-361c887e] {
    position: absolute;
    left: 24px;
    bottom: 24px;
    font-size: 4rem;
    line-height: .9em;
    color: #fff
}

.game .talismans[data-v-361c887e] {
    position: absolute;
    left: 50%;
    top: 8px;
    padding: 16px 24px;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: row;
    background-color: rgba(0, 0, 0, .35);
    border-radius: 8px;
    transform: translateX(-50%)
}

.game .talismans .talisman-wrap[data-v-361c887e] {
    margin: 0 24px 0 0
}

.game .talismans .talisman-wrap[data-v-361c887e]:last-child {
    margin: 0
}

.game .talismans .talisman-wrap[data-v-361c887e]:hover .ui-tooltip {
    visibility: visible
}

.game .talismans .talisman-wrap[data-v-361c887e]:hover .talisman {
    opacity: 1;
    transform: scale(1.1)
}

.game .talismans .talisman-wrap[data-v-361c887e] .talisman {
    width: 40px;
    height: 40px;
    transition: transform .15s cubic-bezier(.165, .84, .44, 1)
}

.game .talismans .talisman-wrap .count[data-v-361c887e] {
    position: absolute;
    right: -8px;
    bottom: -8px;
    width: 24px;
    height: 24px;
    background-color: #fff;
    border-radius: 50%;
    color: #363850;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row
}

.game .overlay[data-v-361c887e] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 3
}

.game .overlay.opacity-leave-active[data-v-361c887e] {
    transition: .5s cubic-bezier(.165, .84, .44, 1)
}

.game .overlay.opacity-leave-to[data-v-361c887e] {
    opacity: 0
}

.game .overlay.dark[data-v-361c887e] {
    background-color: #363850
}

@-webkit-keyframes shake-data-v-361c887e {
    0%,
    to {
        transform: translateX(0)
    }
    10% {
        transform: translateX(-4px)
    }
    20% {
        transform: translateX(2px)
    }
    30% {
        transform: translateX(-4px)
    }
    40% {
        transform: translateX(5px)
    }
    50% {
        transform: translateX(-4px)
    }
    60% {
        transform: translateX(3px)
    }
    70% {
        transform: translateX(-5px)
    }
    80% {
        transform: translateX(3px)
    }
    90% {
        transform: translateX(-4px)
    }
}

@keyframes shake-data-v-361c887e {
    0%,
    to {
        transform: translateX(0)
    }
    10% {
        transform: translateX(-4px)
    }
    20% {
        transform: translateX(2px)
    }
    30% {
        transform: translateX(-4px)
    }
    40% {
        transform: translateX(5px)
    }
    50% {
        transform: translateX(-4px)
    }
    60% {
        transform: translateX(3px)
    }
    70% {
        transform: translateX(-5px)
    }
    80% {
        transform: translateX(3px)
    }
    90% {
        transform: translateX(-4px)
    }
}