@layer base {
    ._sectionSurface_33ovi_2 {
        background: linear-gradient(180deg,#935a2b,#6f4420);
        box-shadow: -3px 0 1px #00000059 inset,3px 0 1px #00000059 inset,0 4px 1px #ffffff26 inset,0 -3px 1px #00000059 inset;
        border: 1px solid #511e00;
        border-radius: 40px;
        padding: 10px
    }
}

@layer base {
    ._overlay_14p9q_2 {
        position: fixed;
        inset: 0;
        z-index: 100
    }

    ._modalContainer_14p9q_8 {
        width: 100%;
        position: fixed;
        inset: 0;
        padding: var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left);
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        z-index: 102
    }

    ._modalInner_14p9q_20 {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        max-width: 320px;
        max-height: calc(var(--safe-area-height) - var(--header-total) - var(--navigation-total) - 70px)
    }

    ._modal_14p9q_8 {
        display: flex;
        flex-direction: column;
        gap: 6px;
        width: 100%;
        overflow: auto;
        padding: 13px
    }

    ._innerTitle_14p9q_40 {
        color: #fff;
        -webkit-text-stroke: .7px #331b01;
        font-size: 1.5rem
    }
}

@layer base {
    ._animatedTitle_n35xy_2 {
        font-size: 1.5rem;
        font-weight: 700;
        color: #fff;
        -webkit-text-stroke-color: #331b01;
        -webkit-text-stroke-width: 1px
    }
}

@layer base {
    ._contentSurface_1twig_2 {
        background: #432710;
        box-shadow: 0 -1.5px #a17346 inset,1.5px 0 #a17346 inset,-1.5px 0 #a17346 inset,0 1.5px #6b4521 inset;
        padding: 3px;
        display: flex;
        flex-direction: column;
        gap: 1px
    }
}

@layer base {
    ._lightSurface_19nqc_2 {
        background: #fbe6be;
        box-shadow: 0 2px #ffffffbf inset,-1px 0 #00000059 inset,1px 0 #00000059 inset,0 -1px #00000059 inset;
        color: #4b2c13
    }
}

@keyframes _button-spin_1lzw9_1 {
    to {
        transform: rotate(360deg)
    }
}

@layer base {
    ._baseButton_1lzw9_8 {
        cursor: pointer;
        border-radius: 9999px;
        padding: 10px;
        font-weight: 700;
        font-size: 18px;
        line-height: 18px;
        width: fit-content;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 4px;
        position: relative;
        border-width: .7px;
        border-style: solid;
        paint-order: stroke fill;
        text-shadow: 0px 1px 1px #00000059;
        -webkit-text-stroke-width: .7px;
        -webkit-user-select: none;
        user-select: none
    }

    ._baseButton_1lzw9_8:disabled {
        pointer-events: none;
        opacity: .9;
        filter: grayscale(.6)
    }

    ._content_1lzw9_39 {
        display: contents
    }

    ._hidden_1lzw9_43 {
        visibility: hidden
    }

    ._spinner_1lzw9_47 {
        position: absolute;
        display: inline-block;
        width: 18px;
        height: 18px;
        border-radius: 50%;
        border: 2px solid currentColor;
        border-top-color: transparent;
        animation: _button-spin_1lzw9_1 .7s linear infinite
    }

    ._blueButton_1lzw9_58 {
        background: linear-gradient(180deg,#6cc3f1,#3c6bbd);
        border-color: #012142;
        box-shadow: 0 3px 1px 1px #bfe9ff inset,0 2px 1px 1px #8ccef0 inset,0 -3px 1px 1px #8fc9e966 inset,0 -2px 1px 1px #29497f inset,0 1px 2px #00000073;
        color: #d9edff;
        -webkit-text-stroke-color: #003a73
    }

    ._redButton_1lzw9_72 {
        background: linear-gradient(180deg,#f16c6c,#a73030);
        border-color: #420101;
        box-shadow: 0 3px 1px 1px #ffbfbf inset,0 2px 1px 1px #f08c8c inset,0 -3px 1px 1px #e98f8f66 inset,0 -2px 1px 1px #7f2929 inset,0 1px 2px #00000073;
        color: #ffd9d9;
        -webkit-text-stroke-color: #730000
    }

    ._greenButton_1lzw9_86 {
        background: linear-gradient(180deg,#5bdf5b,#15812e);
        border-color: #00450a;
        box-shadow: 0 3px 1px 1px #9bff9f inset,0 2px 1px 1px #8cf08e inset,0 -3px 1px 1px #8fe99b66 inset,0 -2px 1px 1px #1d672d inset,0 1px 2px #00000073;
        color: #cdffd2;
        -webkit-text-stroke-color: #007313
    }

    ._yellowButton_1lzw9_100 {
        background: linear-gradient(180deg,#ffbd42,#e59a0f);
        border-color: #453100;
        box-shadow: 0 3px 1px 1px #ffefb2 inset,0 2px 1px 1px #ffe57b inset,0 -3px 1px 1px #ffe9ab66 inset,0 -2px 1px 1px #a88010 inset,0 1px 2px #00000073;
        color: #fffdcd;
        -webkit-text-stroke-color: #735a00
    }
}

@layer base {
    ._content_1t72g_2 {
        border-radius: 22px
    }

    ._content_1t72g_2 ._description_1t72g_5 {
        padding: 12px;
        border-radius: 18px;
        text-align: center
    }

    ._buttons_1t72g_12 {
        display: flex;
        gap: 6px
    }

    ._button_1t72g_12 {
        flex: 1
    }
}

:root {
    --header-height: 90px;
    --header-padding: var(--safe-top);
    --header-total: calc(var(--header-height) + var(--header-padding))
}

@layer base {
    ._header_d3zjh_8 {
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        z-index: 20;
        padding-top: var(--header-padding);
        --padding-x: 10px;
        padding-left: calc(var(--safe-left) + var(--padding-x));
        padding-right: calc(var(--safe-right) + var(--padding-x))
    }

    ._header_d3zjh_8 ._content_d3zjh_20 {
        position: relative;
        height: var(--header-height);
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 15px
    }
}

@layer base {
    ._profile_zeotl_2 {
        pointer-events: auto;
        width: 200px;
        aspect-ratio: 2.18;
        background-image: url(/assets/profile-bg-DqeYGAgg.svg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        display: flex;
        align-items: center;
        gap: 2px
    }

    ._avatar_zeotl_15 {
        position: relative;
        display: flex;
        flex-direction: column
    }

    ._avatarBorder_zeotl_21 {
        width: 68px;
        height: 68px;
        border-radius: 50%;
        background: linear-gradient(180deg,#eed074,#a5602c);
        border: 1px solid #401e08;
        box-shadow: 4px 0 1px -2px #00000040,0 2px #ffefd1 inset,0 -2px #7a451c inset;
        padding: 5px
    }

    ._avatarInner_zeotl_34 {
        border: none;
        cursor: pointer;
        display: block;
        width: 100%;
        height: 100%;
        border-radius: 50%;
        background: linear-gradient(180deg,#9e6025,#feeea1);
        box-shadow: 0 -1px #ffffffa6 inset,0 1px #00000040 inset;
        padding: 3px;
        overflow: hidden
    }

    ._avatarImage_zeotl_49 {
        width: 100%;
        height: 100%;
        border-radius: 50%;
        object-fit: cover
    }

    ._level_zeotl_56 {
        align-self: center;
        width: 37px;
        height: 21px;
        border-radius: 14px;
        background: #ac6b33;
        box-shadow: 0 .5px #ffefd1 inset,0 -.5px #0000008c inset;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: -12px;
        padding: 3px
    }

    ._levelInner_zeotl_72 {
        width: 100%;
        height: 100%;
        border-radius: 40px;
        background: #000000b3;
        border-top: 1px solid transparent;
        box-shadow: 0 4px 2px #00000040 inset,0 -1px #fff3b5 inset;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #fff;
        font-weight: 700;
        font-size: 14px
    }

    ._balances_zeotl_89 {
        display: flex;
        flex-direction: column;
        gap: 4px
    }

    ._balanceRow_zeotl_95 {
        width: 124px;
        height: 22px;
        border-radius: 17px;
        background: #0009;
        box-shadow: 0 -2px #b0703d inset,2px 0 #b0703d inset,-2px 0 #b0703d inset,0 2px #593313 inset,0 2px 2px 2px #00000059 inset;
        display: flex;
        align-items: center;
        gap: 4px;
        padding-inline:4px}

    ._balanceIcon_zeotl_113 {
        width: 19px;
        height: 19px;
        flex-shrink: 0
    }

    ._honeyValue_zeotl_119 {
        font-family: BalsamiqSans,sans-serif;
        font-weight: 700;
        font-size: 17px;
        color: #f7d048
    }

    ._moneyValue_zeotl_126 {
        font-family: BalsamiqSans,sans-serif;
        font-weight: 700;
        font-size: 17px;
        color: #6cc872
    }
}

@layer base {
    ._container_1ofct_2 {
        padding: 2px;
        display: flex;
        border-radius: 9999px;
        width: fit-content;
        max-width: 200px;
        height: 30px
    }

    ._optionsContainer_1ofct_14 {
        position: relative;
        display: flex;
        overflow: hidden;
        border-radius: 9999px
    }

    ._options_1ofct_14 {
        display: grid;
        grid-template-columns: repeat(2,minmax(0,1fr));
        z-index: 1
    }

    ._option_1ofct_14 {
        background: transparent;
        border: none;
        cursor: pointer;
        padding: 6px 8px;
        color: #fbe6be;
        font-size: 18px;
        line-height: 18px;
        font-weight: 700;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        text-align: center;
        min-width: 0;
        position: relative;
        z-index: 1;
        transition: color .2s ease
    }

    ._selected_1ofct_49 {
        color: #4b2c13
    }

    ._thumb_1ofct_53 {
        position: absolute;
        top: 0;
        height: 100%;
        width: 50%;
        border-radius: 9999px;
        z-index: 0
    }
}

@layer base {
    ._items_6kr2v_2 {
        display: flex;
        flex-direction: column;
        gap: 5px
    }

    ._contentSurface_6kr2v_8 {
        border-radius: 9999px;
        width: 100%
    }

    ._lightSurface_6kr2v_13 {
        border-radius: 9999px
    }

    ._item_6kr2v_2 {
        all: unset;
        box-sizing: border-box;
        width: 100%;
        text-align: center;
        cursor: pointer;
        padding: 10px 12px;
        font-size: 20px;
        font-weight: 700
    }

    ._itemRow_6kr2v_28 {
        box-sizing: border-box;
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 8px 12px;
        font-size: 20px;
        font-weight: 700
    }

    ._langIcon_6kr2v_39 {
        width: 27px;
        height: 27px;
        background: #ccc;
        flex-shrink: 0;
        border-radius: 9999px;
        overflow: hidden;
        border: 1px solid #432710
    }

    ._langIcon_6kr2v_39 image {
        width: 100%;
        height: 100%;
        object-fit: cover
    }
}

@layer base {
    ._darkSurface_1wa9t_2 {
        background: #5a391c;
        box-shadow: 0 2px #8a582d inset,-1px 0 #00000059 inset,1px 0 #00000059 inset,0 -1px #00000059 inset;
        color: #fbe6be
    }
}

@layer base {
    ._blueSectionSurface_1ftni_2 {
        background: linear-gradient(180deg,#278789,#206f66);
        border: 1px solid #123f3f;
        box-shadow: -3px 0 1px #00000059 inset,3px 0 1px #00000059 inset,0 4px 1px #ffffff26 inset,0 -3px 1px #00000059 inset;
        padding: 16px;
        border-radius: 40px
    }

    ._blueSurface_1ftni_14 {
        background: #0c2836;
        box-shadow: 0 -1.5px #32a39b inset,1.5px 0 #32a39b inset,-1.5px 0 #32a39b inset,0 1.5px #114647 inset;
        color: #befbe8;
        padding: 8px;
        border-radius: 23px
    }

    ._blueSurfaceContent_1ftni_26 {
        background: #0000004d;
        border-top: 1px solid #0a2929;
        box-shadow: 0 4px 2px #00000040 inset,0 -1.5px #207475 inset;
        padding: 4px;
        border-radius: 9999px
    }
}

@layer base {
    ._wrapper_hm5zc_2 {
        display: flex;
        flex-direction: row;
        width: 100%;
        height: 40px;
        flex-shrink: 0;
        gap: 1px;
        border-radius: 9999px;
        overflow: hidden
    }

    ._item_hm5zc_13 {
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 5px
    }

    ._startItem_hm5zc_20 {
        border-radius: 9999px 5px 5px 9999px
    }

    ._endItem_hm5zc_24 {
        border-radius: 5px 9999px 9999px 5px
    }

    ._button_hm5zc_28 {
        cursor: pointer;
        flex: 1;
        flex-shrink: 0;
        -webkit-user-select: none;
        user-select: none;
        background: none;
        border: none;
        padding: 8px;
        display: flex;
        align-items: center;
        justify-content: center
    }

    ._button_hm5zc_28:disabled {
        opacity: .5;
        pointer-events: none
    }

    ._state_hm5zc_46 {
        flex: 1;
        padding: 8px;
        font-weight: 700;
        font-size: 14px;
        line-height: 1
    }

    ._mirrored_hm5zc_54 {
        transform: scaleX(-1)
    }

    ._blueWrapper_hm5zc_58 {
        padding: 3px;
        border-radius: 9999px
    }

    ._blueItem_hm5zc_63 {
        background: #bef9fb;
        box-shadow: 0 1px #ffffffbf inset,-1px 0 #00000059 inset,1px 0 #00000059 inset,0 -1px #00000059 inset;
        color: #0c2836;
        --icon-fill: #227873;
        --icon-stroke: #0c2836
    }
}

@layer base {
    ._grid_p2d93_2 {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 5px
    }

    ._contentSurface_p2d93_8 {
        border-radius: 9999px;
        width: 100%
    }

    ._contentSurface_p2d93_8._active_p2d93_12>* {
        background-color: #f8eb86
    }

    ._item_p2d93_17 {
        all: unset;
        box-sizing: border-box;
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        gap: 8px;
        cursor: pointer;
        padding: 8px 12px;
        font-size: 15px;
        font-weight: 700
    }

    ._langIcon_p2d93_31 {
        width: 27px;
        height: 27px;
        flex-shrink: 0;
        border-radius: 9999px;
        overflow: hidden;
        border: 1px solid #432710
    }

    ._langIcon_p2d93_31 image {
        width: 100%;
        height: 100%;
        object-fit: cover
    }

    ._itemActive_p2d93_46 {
        color: #4b2c13
    }
}

@layer base {
    ._settings_l64oc_2 {
        width: 80px;
        height: 50px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: url(/assets/settings-bg-DpYu_HcN.svg) center / contain no-repeat;
        border: none;
        cursor: pointer;
        padding: 0
    }

    ._bars_l64oc_14 {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 5px
    }

    ._bar_l64oc_14 {
        display: block;
        width: 32px;
        height: 7px;
        border-radius: 5px;
        background-color: #563417;
        background-image: linear-gradient(180deg,#ebcb71,#aa6831);
        box-shadow: 0 1px 1px #00000073,0 1px #ffefd1 inset,0 -1px #0000008c inset
    }
}

@layer base {
    ._glassSurface_1avhi_2 {
        background: #ffffff1a;
        -webkit-backdrop-filter: blur(4px);
        backdrop-filter: blur(4px);
        box-shadow: 0 2px 1px #ffffff40 inset,0 4px 4px #00000073
    }

    ._glassSurfaceContent_1avhi_10 {
        background: #06060666;
        box-shadow: 0 1px 4px 1px #00000040 inset
    }
}

:root {
    --navigation-height: 74px;
    --navigation-padding: var(--safe-bottom);
    --navigation-total: calc(var(--navigation-height) + var(--navigation-padding));
    --navigation-z-index: 50;
    --navigation-content-z-index: calc(var(--navigation-z-index) + 1);
    --navigation-overlay-z-index: calc(var(--navigation-z-index) + 2);
    --tutorial-z-index: 60
}

@layer base {
    ._navigation_eklrp_17 {
        position: absolute;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: var(--navigation-z-index);
        max-width: 500px;
        padding-left: var(--safe-left);
        padding-right: var(--safe-right);
        margin: auto;
        display: flex;
        align-items: flex-end;
        justify-content: space-evenly;
        overflow: hidden
    }

    ._bar_eklrp_33 {
        width: 54px;
        border-radius: 27px 27px 0 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        padding-bottom: var(--navigation-padding);
        cursor: pointer
    }

    ._safeContent_eklrp_44 {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 64px;
        margin-top: -10px
    }

    ._icon_eklrp_54 {
        width: 40px;
        height: 40px;
        margin-bottom: -6px
    }

    ._label_eklrp_60 {
        font-size: 15px;
        font-weight: 700;
        text-align: center;
        text-shadow: 0px 2px 2px #0000008c;
        line-height: 1;
        color: #fff
    }

    ._active_eklrp_69 ._label_eklrp_60 {
        color: #ffbd42
    }

    @keyframes _navHighlightPulse_eklrp_1 {
        0%,to {
            transform: scale(1)
        }

        50% {
            transform: scale(1.18)
        }
    }

    ._highlighted_eklrp_84 ._icon_eklrp_54 {
        animation: _navHighlightPulse_eklrp_1 1s ease-in-out infinite;
        filter: drop-shadow(0 0 5px #ffbd42)
    }

    ._menuOverlay_eklrp_89 {
        position: absolute;
        right: 0;
        bottom: calc(var(--navigation-total) + 16px);
        z-index: var(--navigation-overlay-z-index);
        padding-bottom: 8px;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: 8px;
        overflow: hidden;
        pointer-events: none
    }

    ._hidden_eklrp_104 {
        display: none
    }

    ._menuOverlay_eklrp_89>* {
        pointer-events: auto
    }

    ._menuBar_eklrp_112 {
        height: 54px;
        width: 94px;
        border-radius: 27px 0 0 27px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        padding-right: 20px;
        padding-left: 20px;
        cursor: pointer
    }

    ._menuBarContent_eklrp_125 {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 54px;
        height: 100%;
        margin-left: -10px;
        transition: transform .15s ease-out
    }

    ._menuBarContent_eklrp_125:active {
        transform: scale(.95)
    }
}

@layer base {
    ._container_15lir_2 {
        display: flex
    }

    ._dark_15lir_6 {
        padding: 4px;
        border-radius: 9999px
    }

    ._yellow_15lir_11 {
        padding-block:6px;border-radius: 22px;
        background: none;
        box-shadow: none
    }

    ._tabsContainer_15lir_18 {
        position: relative;
        flex: 1;
        display: flex
    }

    :where(._dark_15lir_6) ._tabsContainer_15lir_18 {
        overflow: hidden;
        border-radius: 9999px
    }

    :where(._yellow_15lir_11) ._tabsContainer_15lir_18 {
        overflow: visible;
        border-radius: 10px;
        background: #815b3a;
        border: 1px solid #321700;
        box-shadow: 0 1px 2px 2px #00000059 inset
    }

    ._tabs_15lir_18 {
        display: flex;
        width: 100%;
        flex: 1;
        gap: 0
    }

    ._tab_15lir_18 {
        flex: 1;
        background: transparent;
        border: none;
        cursor: pointer;
        font-weight: 700;
        position: relative;
        z-index: 1
    }

    :where(._dark_15lir_6) ._tab_15lir_18 {
        padding: 8px 12px;
        color: #fff;
        -webkit-text-stroke: .7px #331b01;
        font-size: 18px;
        line-height: 18px
    }

    :where(._yellow_15lir_11) ._tab_15lir_18 {
        padding: 5px 10px;
        color: #fff1d3;
        text-shadow: 0px 1px 2px #00000073;
        font-size: 17px;
        line-height: 14px;
        white-space: pre-line;
        text-align: center
    }

    :where(._yellow_15lir_11) ._tabActive_15lir_76 {
        z-index: 2
    }

    ._thumb_15lir_80 {
        position: absolute;
        z-index: 0
    }

    :where(._dark_15lir_6) ._thumb_15lir_80 {
        top: 0;
        height: 100%;
        border-radius: 9999px
    }

    :where(._yellow_15lir_11) ._thumb_15lir_80 {
        top: -7px;
        bottom: -7px;
        height: auto;
        border-radius: 13px;
        background: linear-gradient(180deg,#fdba06,#f69d06);
        border: 1px solid #563b00;
        box-shadow: -2px 0 #00000059 inset,2px 0 #00000059 inset,0 -3px #00000059 inset,0 2px #ffffffbf inset,0 1px 3px #0000008c
    }
}

@layer base {
    ._container_13fek_2 {
        width: 100%;
        min-height: 35px;
        height: 35px;
        background: #0000004d;
        border-top: 1px solid #472715;
        box-shadow: 0 4px 2px #00000040 inset,0 -1.5px #8a582d inset;
        border-radius: 9999px;
        outline: none;
        display: flex;
        align-items: center;
        padding: 0 0 0 14px;
        box-sizing: border-box;
        overflow: hidden
    }

    ._container_13fek_2._error_13fek_19 {
        outline: 2px solid #af4242
    }

    ._inputWrapper_13fek_24 {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 4px;
        flex: 1;
        height: 100%
    }

    ._inputWrapper_13fek_24 ._input_13fek_24 {
        background: transparent;
        border: none;
        outline: none;
        color: #fbe6be;
        font-size: 18px;
        line-height: 18px;
        font-weight: 700;
        text-align: center;
        padding: 0;
        min-width: 20px;
        field-sizing: content;
        align-self: stretch
    }

    ._inputWrapper_13fek_24 ._input_13fek_24::placeholder {
        color: #fbe6be66
    }

    ._inputWrapper_13fek_24 ._input_13fek_24::-webkit-outer-spin-button,._inputWrapper_13fek_24 ._input_13fek_24::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0
    }

    ._inputWrapper_13fek_24 ._prefix_13fek_57 {
        color: #fbe6be;
        font-size: 18px;
        line-height: 18px;
        font-weight: 700
    }

    ._iconButton_13fek_65 {
        margin: 0 3px;
        padding: 1px;
        cursor: pointer;
        border-radius: 9999px;
        background: radial-gradient(circle,#0000 0% 50%,#fbe6be 50% 100%);
        box-shadow: 0 2px #ffffffbf inset,-1px 0 #00000059 inset,1px 0 #00000059 inset,0 -1px #00000059 inset
    }

    ._iconButton_13fek_65 ._icon_13fek_65 {
        width: 28px;
        color: #fbe6be
    }
}

@layer base {
    ._periodTabs_8vgym_2 button {
        padding-left: 6px;
        padding-right: 6px
    }
}

@layer base {
    ._button_12eef_2 {
        flex-shrink: 0;
        width: 35px;
        height: 35px;
        border-radius: 12px;
        background: #956338;
        border: 1px solid #362211;
        box-shadow: -2px 0 #00000059 inset,2px 0 #00000059 inset,0 -2px #00000059 inset,0 2px #bf8756 inset;
        color: #fff;
        -webkit-text-stroke: .7px #2b0d02;
        font-size: 30px;
        line-height: 1;
        font-weight: 700;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center
    }

    ._button_12eef_2:disabled {
        pointer-events: none;
        opacity: .6
    }
}

@layer base {
    ._slider_1k1jv_2 {
        -webkit-appearance: none;
        appearance: none;
        background: transparent;
        cursor: pointer;
        flex: 1;
        min-width: 0;
        --thumb-width: 29px;
        --thumb-height: 30px;
        --track-height: 13px;
        --progress: 1%;
        --fill: #f1a90f;
        --track: #653b14;
        width: 100%;
        padding: calc(var(--thumb-height) / 2) 0;
        height: var(--track-height)
    }

    ._slider_1k1jv_2::-webkit-slider-runnable-track {
        border-radius: 999px;
        height: var(--track-height);
        border: 1px solid #281400;
        background: linear-gradient(to right,var(--fill) 0%,var(--fill) var(--progress),var(--track) var(--progress),var(--track) 100%);
        box-shadow: 0 1px #ffffff40 inset,0 -1px #00000040 inset,0 1px 3px 1px #00000073 inset
    }

    ._slider_1k1jv_2::-moz-range-track {
        border-radius: 999px;
        height: var(--track-height);
        border: 1px solid #281400;
        background: var(--track);
        box-shadow: 0 1px #ffffff40 inset,0 -1px #00000040 inset,0 1px 3px 1px #00000073 inset
    }

    ._slider_1k1jv_2::-moz-range-progress {
        border-radius: 999px;
        height: var(--track-height);
        border: 1px solid #281400;
        background: var(--fill)
    }

    ._slider_1k1jv_2::-webkit-slider-thumb {
        -webkit-appearance: none;
        appearance: none;
        box-sizing: border-box;
        width: var(--thumb-width);
        height: var(--thumb-height);
        margin-top: calc((var(--track-height) / 2) - (var(--thumb-height) / 2));
        border: 0;
        border-radius: 0;
        box-shadow: none;
        background-color: transparent;
        background-image: url("data:image/svg+xml,%3csvg%20width='29'%20height='30'%20viewBox='0%200%2029%2030'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3c!--%20No%20SVG%20filters%20—%20iOS%20paints%20filter%20regions%20as%20a%20square%20behind%20CSS%20background-images.%20--%3e%3cpath%20d='M12.5%201.1547C13.7376%200.440169%2015.2624%200.440169%2016.5%201.1547L25.0574%206.0953C26.295%206.80983%2027.0574%208.13034%2027.0574%209.5594V19.4406C27.0574%2020.8697%2026.295%2022.1902%2025.0574%2022.9047L16.5%2027.8453C15.2624%2028.5598%2013.7376%2028.5598%2012.5%2027.8453L3.94263%2022.9047C2.70503%2022.1902%201.94263%2020.8697%201.94263%2019.4406V9.5594C1.94263%208.13034%202.70503%206.80983%203.94263%206.0953L12.5%201.1547Z'%20fill='url(%23paint0_honeycomb_thumb)'%20/%3e%3cpath%20d='M12.5%201.1547C13.7376%200.440169%2015.2624%200.440169%2016.5%201.1547L25.0574%206.0953C26.295%206.80983%2027.0574%208.13034%2027.0574%209.5594V19.4406C27.0574%2020.8697%2026.295%2022.1902%2025.0574%2022.9047L16.5%2027.8453C15.2624%2028.5598%2013.7376%2028.5598%2012.5%2027.8453L3.94263%2022.9047C2.70503%2022.1902%201.94263%2020.8697%201.94263%2019.4406V9.5594C1.94263%208.13034%202.70503%206.80983%203.94263%206.0953L12.5%201.1547Z'%20stroke='%235D4000'%20stroke-width='1.5'%20stroke-linejoin='round'%20/%3e%3cpath%20d='M14.0182%204.26493C14.3182%204.09996%2014.6818%204.09996%2014.9818%204.26493L23.0751%208.71508C23.3947%208.89081%2023.5933%209.22661%2023.5933%209.59134V18.4087C23.5933%2018.7734%2023.3947%2019.1092%2023.0751%2019.2849L14.9818%2023.7351C14.6818%2023.9%2014.3182%2023.9%2014.0182%2023.7351L5.92491%2019.2849C5.60531%2019.1092%205.40673%2018.7734%205.40673%2018.4087V9.59134C5.40673%209.22661%205.60531%208.89081%205.92491%208.71508L14.0182%204.26493Z'%20fill='%23FFD476'%20/%3e%3cpath%20d='M14.0182%204.26493C14.3182%204.09996%2014.6818%204.09996%2014.9818%204.26493L23.0751%208.71508C23.3947%208.89081%2023.5933%209.22661%2023.5933%209.59134V18.4087C23.5933%2018.7734%2023.3947%2019.1092%2023.0751%2019.2849L14.9818%2023.7351C14.6818%2023.9%2014.3182%2023.9%2014.0182%2023.7351L5.92491%2019.2849C5.60531%2019.1092%205.40673%2018.7734%205.40673%2018.4087V9.59134C5.40673%209.22661%205.60531%208.89081%205.92491%208.71508L14.0182%204.26493Z'%20fill='url(%23paint1_honeycomb_thumb)'%20/%3e%3cdefs%3e%3clinearGradient%20id='paint0_honeycomb_thumb'%20x1='14.5'%20y1='0'%20x2='14.5'%20y2='29'%20gradientUnits='userSpaceOnUse'%20%3e%3cstop%20stop-color='%23FFB921'%20/%3e%3cstop%20offset='1'%20stop-color='%23E59D00'%20/%3e%3c/linearGradient%3e%3clinearGradient%20id='paint1_honeycomb_thumb'%20x1='14.5'%20y1='4'%20x2='14.5'%20y2='24'%20gradientUnits='userSpaceOnUse'%20%3e%3cstop%20stop-color='%23D79300'%20/%3e%3cstop%20offset='1'%20stop-color='%23FFC13A'%20/%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e");
        background-position: center;
        background-size: 100% 100%;
        background-repeat: no-repeat;
        filter: drop-shadow(0 1px 1px #00000073);
        transition: transform .1s ease
    }

    ._slider_1k1jv_2::-moz-range-thumb {
        box-sizing: border-box;
        width: var(--thumb-width);
        height: var(--thumb-height);
        border: 0;
        border-radius: 0;
        box-shadow: none;
        background-color: transparent;
        background-image: url("data:image/svg+xml,%3csvg%20width='29'%20height='30'%20viewBox='0%200%2029%2030'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3c!--%20No%20SVG%20filters%20—%20iOS%20paints%20filter%20regions%20as%20a%20square%20behind%20CSS%20background-images.%20--%3e%3cpath%20d='M12.5%201.1547C13.7376%200.440169%2015.2624%200.440169%2016.5%201.1547L25.0574%206.0953C26.295%206.80983%2027.0574%208.13034%2027.0574%209.5594V19.4406C27.0574%2020.8697%2026.295%2022.1902%2025.0574%2022.9047L16.5%2027.8453C15.2624%2028.5598%2013.7376%2028.5598%2012.5%2027.8453L3.94263%2022.9047C2.70503%2022.1902%201.94263%2020.8697%201.94263%2019.4406V9.5594C1.94263%208.13034%202.70503%206.80983%203.94263%206.0953L12.5%201.1547Z'%20fill='url(%23paint0_honeycomb_thumb)'%20/%3e%3cpath%20d='M12.5%201.1547C13.7376%200.440169%2015.2624%200.440169%2016.5%201.1547L25.0574%206.0953C26.295%206.80983%2027.0574%208.13034%2027.0574%209.5594V19.4406C27.0574%2020.8697%2026.295%2022.1902%2025.0574%2022.9047L16.5%2027.8453C15.2624%2028.5598%2013.7376%2028.5598%2012.5%2027.8453L3.94263%2022.9047C2.70503%2022.1902%201.94263%2020.8697%201.94263%2019.4406V9.5594C1.94263%208.13034%202.70503%206.80983%203.94263%206.0953L12.5%201.1547Z'%20stroke='%235D4000'%20stroke-width='1.5'%20stroke-linejoin='round'%20/%3e%3cpath%20d='M14.0182%204.26493C14.3182%204.09996%2014.6818%204.09996%2014.9818%204.26493L23.0751%208.71508C23.3947%208.89081%2023.5933%209.22661%2023.5933%209.59134V18.4087C23.5933%2018.7734%2023.3947%2019.1092%2023.0751%2019.2849L14.9818%2023.7351C14.6818%2023.9%2014.3182%2023.9%2014.0182%2023.7351L5.92491%2019.2849C5.60531%2019.1092%205.40673%2018.7734%205.40673%2018.4087V9.59134C5.40673%209.22661%205.60531%208.89081%205.92491%208.71508L14.0182%204.26493Z'%20fill='%23FFD476'%20/%3e%3cpath%20d='M14.0182%204.26493C14.3182%204.09996%2014.6818%204.09996%2014.9818%204.26493L23.0751%208.71508C23.3947%208.89081%2023.5933%209.22661%2023.5933%209.59134V18.4087C23.5933%2018.7734%2023.3947%2019.1092%2023.0751%2019.2849L14.9818%2023.7351C14.6818%2023.9%2014.3182%2023.9%2014.0182%2023.7351L5.92491%2019.2849C5.60531%2019.1092%205.40673%2018.7734%205.40673%2018.4087V9.59134C5.40673%209.22661%205.60531%208.89081%205.92491%208.71508L14.0182%204.26493Z'%20fill='url(%23paint1_honeycomb_thumb)'%20/%3e%3cdefs%3e%3clinearGradient%20id='paint0_honeycomb_thumb'%20x1='14.5'%20y1='0'%20x2='14.5'%20y2='29'%20gradientUnits='userSpaceOnUse'%20%3e%3cstop%20stop-color='%23FFB921'%20/%3e%3cstop%20offset='1'%20stop-color='%23E59D00'%20/%3e%3c/linearGradient%3e%3clinearGradient%20id='paint1_honeycomb_thumb'%20x1='14.5'%20y1='4'%20x2='14.5'%20y2='24'%20gradientUnits='userSpaceOnUse'%20%3e%3cstop%20stop-color='%23D79300'%20/%3e%3cstop%20offset='1'%20stop-color='%23FFC13A'%20/%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e");
        background-position: center;
        background-size: 100% 100%;
        background-repeat: no-repeat;
        filter: drop-shadow(0 1px 1px #00000073);
        transition: transform .1s ease
    }

    ._slider_1k1jv_2:active::-webkit-slider-thumb,._slider_1k1jv_2._dragging_1k1jv_99::-webkit-slider-thumb {
        transform: scale(1.08)
    }

    ._slider_1k1jv_2:active::-moz-range-thumb,._slider_1k1jv_2._dragging_1k1jv_99::-moz-range-thumb {
        transform: scale(1.08)
    }
}

@layer base {
    ._label_12360_2 {
        text-align: center;
        font-weight: 700;
        font-size: 16px;
        line-height: 17px;
        color: #4b2c13
    }

    ._field_12360_10 {
        border-radius: 17px;
        padding: 8px 5px;
        display: flex;
        gap: 6px;
        background: #5a391c;
        box-shadow: 0 2px #8a582d inset,-2px 0 #00000059 inset,2px 0 #00000059 inset,0 -2px #00000059 inset,0 1px 3px #0000008c
    }

    ._panel_12360_24 {
        border-radius: 17px;
        padding: 8px;
        display: flex;
        flex-direction: column;
        background: #5a391c;
        box-shadow: 0 2px #8a582d inset,-2px 0 #00000059 inset,2px 0 #00000059 inset,0 -2px #00000059 inset,0 1px 3px #0000008c
    }

    ._panelTitle_12360_39 {
        text-align: center;
        font-weight: 700;
        font-size: 15px;
        line-height: 18px;
        color: #fbe6be;
        text-shadow: 0px 2px 2px #00000040;
        margin-bottom: 2px
    }

    ._pill_12360_49 {
        flex: 1;
        min-width: 0;
        background: #956338;
        border-radius: 12px;
        padding: 5px;
        display: flex;
        align-items: center;
        gap: 8px;
        font-weight: 700;
        border: 1px solid #362211;
        box-shadow: -2px 0 #00000059 inset,2px 0 #00000059 inset,0 -2px #00000059 inset,0 2px #bf8756 inset
    }

    ._pillLabel_12360_67 {
        font-size: 13px;
        line-height: 16px
    }

    ._pillValue_12360_72 {
        font-size: 18px;
        line-height: 18px;
        white-space: nowrap;
        color: #fbe6be
    }

    ._cashColor_12360_79 {
        color: #99cf54;
        -webkit-text-stroke: 2px #00000080;
        paint-order: stroke fill;
        text-shadow: 0px 1px 2px #00000040
    }

    ._honeyColor_12360_86 {
        color: #fedf2b;
        -webkit-text-stroke: 2px #00000080;
        paint-order: stroke fill;
        text-shadow: 0px 1px 2px #00000040
    }

    ._usdtColor_12360_93 {
        color: #62b994;
        -webkit-text-stroke: 2px #00000080;
        paint-order: stroke fill;
        text-shadow: 0px 1px 2px #00000040
    }

    ._arrowIcon_12360_100 {
        color: #facaa1;
        width: 23px;
        height: auto;
        filter: drop-shadow(0px 1px 2px #00000040);
        position: relative
    }

    ._dropIcon_12360_108 {
        width: 22px;
        height: 22px;
        flex-shrink: 0
    }

    ._arrowButton_12360_114 {
        flex-shrink: 0;
        width: 35px;
        height: auto;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 12px;
        background: #956338;
        border: 1px solid #362211;
        box-shadow: -2px 0 #00000059 inset,2px 0 #00000059 inset,0 -2px #00000059 inset,0 2px #bf8756 inset;
        cursor: pointer
    }

    ._arrowButton_12360_114:disabled {
        pointer-events: none;
        opacity: .4
    }

    ._carouselViewport_12360_138 {
        flex: 1;
        min-width: 0;
        height: 72px;
        overflow: hidden;
        position: relative
    }

    ._carouselSlide_12360_146 {
        position: absolute;
        inset: 0;
        display: flex;
        align-items: center;
        gap: 6px;
        width: 100%
    }

    ._beeFrame_12360_155 {
        flex-shrink: 0;
        width: 46px;
        height: 60px;
        border-radius: 8px;
        background: #0000004d;
        border-top: 1px solid #472715;
        box-shadow: 0 4px 2px #00000040 inset,0 -1.5px #8a582d inset
    }

    ._inputBox_12360_168 {
        width: 100%;
        padding: 6px 12px;
        border-top: 1px solid #472715;
        background: #0000004d;
        border-radius: 8px;
        box-shadow: 0 4px 2px #00000040 inset,0 -1.5px #8a582d inset;
        color: #fbe6be;
        font-size: 15px;
        line-height: 18px;
        font-weight: 700;
        text-align: center
    }

    ._countInput_12360_185 {
        flex-shrink: 0;
        width: 58px;
        min-height: 35px;
        border-radius: 10px!important;
        padding: 8px 10px!important;
        background: #653b14!important;
        border: 1px solid #281400;
        box-shadow: 0 1px 3px 1px #00000073 inset
    }

    ._amountInput_12360_196 {
        flex: 1;
        min-width: 0;
        width: auto;
        min-height: 42px;
        height: 42px;
        border-radius: 16px!important;
        padding: 0 12px!important;
        background: #3f2814!important;
        border-top: none!important;
        box-shadow: 0 3px 2px #00000040 inset!important
    }

    ._amountInput_12360_196:focus-within {
        outline: 2px solid #00c4ff;
        outline-offset: 0
    }

    ._rateRow_12360_214 {
        display: flex;
        align-items: flex-end;
        justify-content: center;
        color: #fbe6be;
        font-weight: 700;
        font-size: 15px;
        line-height: 18px
    }

    ._hiveScene_12360_224 {
        position: relative;
        width: 97px;
        height: 107px;
        flex-shrink: 0
    }

    ._hiveBase_12360_231 {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: contain;
        -webkit-user-select: none;
        user-select: none;
        pointer-events: none
    }

    ._hiveBees_12360_241 {
        position: absolute;
        left: 50%;
        top: 42%;
        width: 78%;
        transform: translate(-50%,-50%);
        object-fit: contain;
        -webkit-user-select: none;
        user-select: none;
        pointer-events: none
    }

    ._profitSlider_12360_252 {
        width: 95%;
        align-self: center;
        --track: #3f2814
    }

    ._profitSlider_12360_252::-webkit-slider-runnable-track,._profitSlider_12360_252::-moz-range-track {
        box-shadow: 0 1px #ffffff40 inset,0 -1px #00000040 inset
    }

    ._profitPillLabel_12360_265 {
        color: #fff;
        font-size: 15px;
        text-shadow: 0px 2px 2px #00000040
    }
}

@layer base {
    ._inner_1ifis_6 {
        width: calc(100% - 48px)!important;
        max-width: 320px!important;
        max-height: calc(var(--safe-area-height) - 112px)!important;
        min-height: 0;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain
    }

    ._modal_1ifis_7 {
        position: relative;
        background: none;
        border: none;
        box-shadow: none;
        border-radius: 0;
        padding: 0;
        gap: 0;
        overflow: visible
    }

    ._unit_1ifis_29 {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%
    }

    ._title_1ifis_36 {
        display: block;
        width: 80%;
        max-width: 320px;
        height: auto;
        margin-bottom: -5px;
        position: relative;
        z-index: 1;
        flex-shrink: 0;
        -webkit-user-select: none;
        user-select: none;
        pointer-events: none
    }

    ._body_1ifis_49 {
        z-index: 2;
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 8px;
        padding: 16px 10px 12px;
        border-radius: 25px;
        background: linear-gradient(180deg,#fedb96,#f3c364);
        border: 1px solid #5c3d00;
        box-shadow: -3px 0 1px #00000059 inset,3px 0 1px #00000059 inset,0 4px 1px #ffffffbf inset,0 -3px 1px #00000059 inset
    }

    ._tabPanels_1ifis_66 {
        display: grid;
        width: 100%
    }

    ._tabPanel_1ifis_66 {
        grid-area: 1 / 1;
        min-width: 0
    }

    ._tabPanelInactive_1ifis_76 {
        visibility: hidden;
        pointer-events: none
    }
}

@layer base {
    ._button_1rwo3_2 {
        position: absolute;
        right: calc(var(--safe-left) + var(--padding-x, .7rem));
        top: calc(var(--header-total));
        z-index: 10;
        width: 4.75rem;
        aspect-ratio: 148 / 132;
        padding: 0;
        margin: 0;
        border: none;
        background: transparent url(/assets/calculator-Cx8rb-02.webp) center / contain no-repeat;
        cursor: pointer;
        filter: drop-shadow(0px 3px 2px #00000059)
    }
}

@layer base {
    ._modalContainer_1o4e7_2 {
        width: 100%;
        position: fixed;
        left: 0;
        right: 0;
        margin: 0 auto;
        z-index: var(--tutorial-z-index);
        max-width: 600px;
        padding: 0 calc(var(--safe-right) + 10px) 0 calc(var(--safe-left) + 10px)
    }

    ._modalContainerTop_1o4e7_14 {
        top: calc(var(--header-total) + 26px)
    }

    ._modalContainerBottom_1o4e7_18 {
        bottom: calc(var(--navigation-total) + 26px)
    }

    ._modalContainerCenter_1o4e7_22 {
        top: 50%;
        transform: translateY(-50%)
    }

    ._modalInner_1o4e7_27 {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        max-height: calc(var(--safe-area-height) - var(--header-total) - var(--navigation-total) - 70px);
        font-size: 18px;
        line-height: 18px;
        font-weight: 700;
        color: #4c2d1c;
        text-align: center
    }

    ._tutorialSurface_1o4e7_41 {
        border-radius: 15px;
        padding: 25px 10px 14px;
        background: #ffefd1cc;
        border: 1px solid #4c2d1c;
        box-shadow: 0 3px #ffffffbf inset,-3px 0 #00000059 inset,3px 0 #00000059 inset,0 -3px #00000059 inset;
        -webkit-backdrop-filter: blur(9px);
        backdrop-filter: blur(9px);
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center
    }

    ._tutorialStepTitle_1o4e7_57 {
        position: absolute;
        top: -10px;
        left: 0;
        right: 0;
        margin: 0 auto;
        width: fit-content;
        text-align: center;
        font-size: 17px;
        line-height: 17px;
        font-weight: 700;
        color: #713515;
        background: #fbb542;
        border: 1px solid #4c2d1c;
        border-radius: 10px;
        padding: 4px 13px 3px;
        box-shadow: 0 2px #ffffff59 inset,-2px 0 #00000059 inset,2px 0 #00000059 inset,0 -2px #00000059 inset
    }

    ._closeButton_1o4e7_79 {
        position: absolute;
        top: -5px;
        right: -5px;
        width: 25px;
        height: 25px;
        box-sizing: border-box;
        display: grid;
        place-items: center;
        background: #fb4242;
        border: 1px solid #4c2d1c;
        border-radius: 30px;
        box-shadow: 0 2px #ffffff59 inset,-2px 0 #00000059 inset,2px 0 #00000059 inset,0 -2px #00000059 inset;
        cursor: pointer;
        padding: 0
    }

    ._closeIcon_1o4e7_100 {
        display: block;
        width: 16px;
        height: 16px;
        pointer-events: none
    }

    ._modalTitle_1o4e7_106 {
        font-size: 18px;
        line-height: 18px;
        font-weight: 700;
        color: #4c2d1c;
        text-align: center;
        margin-bottom: 6px
    }

    ._content_1o4e7_115 {
        font-size: 18px;
        line-height: 18px;
        font-weight: 700;
        color: #4c2d1c;
        text-align: center
    }

    ._buttons_1o4e7_122 {
        display: flex;
        gap: 10px;
        align-items: center;
        margin-top: 8px;
        justify-content: center;
        width: 100%
    }

    ._modalButton_1o4e7_130 {
        width: 100%;
        paint-order: stroke fill;
        -webkit-text-stroke: 2px #003a73;
        text-shadow: 0px 1px 1px rgba(0,0,0,.35)
    }
}

@layer base {
    ._anchor_1btor_2 {
        position: fixed;
        z-index: calc(var(--tutorial-z-index) - 1);
        pointer-events: none;
        transform: translate(-68%,-22%);
        animation: _tutorialMergeSwipe_1btor_1 2s ease-in-out infinite
    }

    ._hand_1btor_11 {
        display: block;
        width: var(--hand-size);
        height: auto;
        transform-origin: 68% 22%
    }

    @keyframes _tutorialMergeSwipe_1btor_1 {
        0%,18% {
            transform: translate(-68%,-22%)
        }

        45%,55% {
            transform: translate(calc(-68% + var(--travel-x)),calc(-22% + var(--travel-y)))
        }

        82%,to {
            transform: translate(-68%,-22%)
        }
    }
}

@layer base {
    ._root_1vb21_2 {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        width: 100%;
        margin: 10px 0 4px
    }

    ._item_1vb21_11 {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 8px
    }

    ._menuIconBg_1vb21_18 {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 54px;
        height: 45px;
        border-radius: 30px 30px 4px 4px;
        border: 1px solid #0000004d;
        box-shadow: 0 1px #ffffff80 inset;
        background: #0000001a;
        -webkit-backdrop-filter: blur(4px);
        backdrop-filter: blur(4px);
        box-shadow: 0 2px 1px #ffffff40 inset
    }

    ._tasksIconBg_1vb21_36 {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 74px;
        height: 55px;
        border-radius: 30px 4px 4px 30px;
        border: 1px solid #0000004d;
        box-shadow: 0 1px #ffffff80 inset;
        background: #0000001a;
        -webkit-backdrop-filter: blur(4px);
        backdrop-filter: blur(4px);
        box-shadow: 0 2px 1px #ffffff40 inset
    }

    ._menuIcon_1vb21_18 {
        width: 42px;
        height: auto;
        display: block;
        top: 3px;
        position: relative
    }

    ._tasksIcon_1vb21_36 {
        width: 49px;
        height: auto;
        display: block;
        position: relative;
        top: 5px;
        left: 2px
    }

    ._arrow_1vb21_72 {
        width: 32px;
        height: auto;
        flex-shrink: 0;
        margin-top: -14px
    }

    ._label_1vb21_79 {
        position: relative;
        top: -6px;
        font-size: 15px;
        line-height: 18px;
        font-weight: 700;
        color: #fff;
        text-align: center;
        paint-order: stroke fill;
        -webkit-text-stroke: 2px #331b01;
        text-shadow: 0px 1px 2px 0px #0000008c
    }
}

@layer base {
    ._stage_130aw_6 {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        height: 101%;
        aspect-ratio: 1800 / 1845;
        pointer-events: none;
        z-index: -1;
        background: linear-gradient(180deg,#6acef7,#8cd5ed 23.25%,#9ebf3e 30%)
    }

    ._cloudTrack_130aw_26 {
        position: absolute;
        inset: 0;
        animation-name: _cloudDrift_130aw_1;
        animation-timing-function: linear;
        animation-iteration-count: infinite
    }

    ._cloud_130aw_26 {
        position: absolute;
        display: block;
        height: auto
    }

    @keyframes _cloudDrift_130aw_1 {
        0% {
            transform: translate(var(--from))
        }

        to {
            transform: translate(var(--to))
        }
    }

    @media(prefers-reduced-motion:reduce) {
        ._cloudTrack_130aw_26 {
            animation-name: none
        }
    }

    ._cloudTrackStatic_130aw_60 {
        animation-name: none
    }

    ._cloudTrackPaused_130aw_66 {
        animation-play-state: paused
    }

    ._background_130aw_72 {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        display: block
    }
}

@layer base {
    ._rootLayout_1kcti_2 {
        position: relative;
        height: 100%;
        width: 100%;
        overflow: hidden
    }

    ._rootLayout_1kcti_2 ._main_1kcti_9 {
        height: 100%;
        overflow-y: auto;
        overflow-x: hidden;
        overscroll-behavior: none;
        --padding-x: 16px;
        padding: calc(var(--header-total) + var(--padding-x)) var(--safe-right) calc(var(--navigation-total) + var(--padding-x)) var(--safe-left)
    }
}

@layer base {
    ._modal_q1564_2 {
        position: relative;
        background: none;
        border: none;
        box-shadow: none;
        border-radius: 0;
        padding: 0;
        gap: 0;
        overflow: visible
    }

    ._frame_q1564_13 {
        position: relative;
        width: 100%;
        line-height: 0;
        container-type: inline-size
    }

    ._content_q1564_20 {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%
    }

    ._disclaimer_q1564_27 {
        padding-inline:8px;text-align: center;
        color: #fff;
        font-size: 19px;
        font-weight: 700;
        line-height: 20px;
        -webkit-text-stroke: 1px #000;
        text-shadow: 0 1px 2px #00000080
    }

    ._frameImg_q1564_38 {
        display: block;
        width: 100%;
        height: auto;
        -webkit-user-select: none;
        user-select: none;
        pointer-events: none
    }

    ._timer_q1564_46 {
        position: absolute;
        top: -5%;
        left: 50%;
        transform: translate(-50%);
        z-index: 2;
        width: max-content;
        max-width: 90%;
        padding: .35em .85em;
        border-radius: 7px;
        background: #00000080;
        color: #fff;
        font-size: clamp(16px,3.6cqi,.85rem);
        font-weight: 400;
        line-height: 16px;
        white-space: nowrap;
        text-shadow: 0 1px 2px #00000073;
        border: 1px solid #ffffff;
        box-shadow: 0 0 3px 2px #00000040 inset;
        font-variant-numeric: tabular-nums
    }

    ._headlines_q1564_68 {
        position: absolute;
        top: 11.5%;
        left: 15%;
        right: 15%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: .1em;
        text-align: center;
        text-transform: uppercase;
        -webkit-text-stroke: .5px #3a1208;
        container-type: inline-size
    }

    ._depositHeadline_q1564_84 {
        color: #fff;
        font-size: clamp(22px,7.2cqi,1.75rem);
        font-weight: 400;
        line-height: 20px;
        letter-spacing: 0px;
        font-family: RubikOne;
        -webkit-text-stroke: 1px #560000;
        text-shadow: 0 1px 2px #000000bf
    }

    ._bonusHeadline_q1564_95 {
        max-width: 100%;
        color: #fbb542;
        font-size: clamp(17px,6.2cqi,22px);
        font-weight: 400;
        line-height: 1.1;
        letter-spacing: 0px;
        font-family: RubikOne;
        white-space: nowrap;
        -webkit-text-stroke: 1px #560000;
        text-shadow: 0 1px 2px #000000bf
    }

    ._columnLabel_q1564_109 {
        position: absolute;
        z-index: 2;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        text-transform: uppercase;
        color: #fff;
        font-size: clamp(.5rem,2.5cqi,.65rem);
        font-weight: 700;
        line-height: 1;
        white-space: nowrap;
        -webkit-text-stroke: .4px #2a1508
    }

    ._depositLabel_q1564_126 {
        left: 20.5%;
        width: 23.5%;
        top: 46.5%;
        font-family: RubikOne;
        font-size: clamp(11px,7.5cqi,13px);
        font-weight: 400;
        line-height: 11px;
        letter-spacing: 0px;
        -webkit-text-stroke: 1px #2a1508;
        text-shadow: 0 1px 2px #000000bf
    }

    ._rewardLabel_q1564_140 {
        left: 54%;
        width: 20.5%;
        top: 42.5%;
        font-family: RubikOne;
        font-size: clamp(11px,7.5cqi,13px);
        font-weight: 400;
        line-height: 11px;
        letter-spacing: 0px;
        -webkit-text-stroke: 1px #2a1508;
        text-shadow: 0 1px 2px #000000bf
    }

    ._columnValue_q1564_153 {
        position: absolute;
        z-index: 2;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: .15em;
        color: #fff;
        font-size: clamp(1.2rem,7.5cqi,1.9rem);
        font-weight: 800;
        line-height: 1;
        -webkit-text-stroke: .5px #2a1508
    }

    ._depositValue_q1564_167 {
        left: 22%;
        width: 23.5%;
        top: 58%;
        font-family: RubikOne;
        font-size: clamp(28px,7.5cqi,1.9rem);
        font-weight: 400;
        line-height: 20px;
        letter-spacing: 0px;
        -webkit-text-stroke: 1px #361800;
        text-shadow: 0 1px 2px #000000bf
    }

    ._rewardValue_q1564_180 {
        left: 54%;
        width: 20.5%;
        top: 55.5%;
        height: 13.5%;
        flex-direction: column
    }

    ._rewardAmount_q1564_188 {
        font-family: RubikOne;
        font-size: clamp(20px,7.5cqi,1.5rem);
        font-weight: 400;
        line-height: 18px;
        letter-spacing: 0px;
        -webkit-text-stroke: 1px #361800;
        color: #99cf54;
        text-shadow: 0 1px 2px #000000bf;
        bottom: 10px;
        position: relative
    }

    ._cashIcon_q1564_201 {
        width: clamp(39px,14.5cqi,44px);
        height: auto;
        flex-shrink: 0
    }

    ._buyButton_q1564_211 {
        position: absolute;
        left: 27%;
        top: 79%;
        width: 46.1%!important;
        height: 14.7%!important;
        padding-block:0;font-size: clamp(22px,5cqi,1.25rem);
        font-weight: 700;
        line-height: 18px;
        border-radius: 17px!important;
        text-shadow: 0 1px 1px #00000059;
        -webkit-text-stroke: .7px #007313
    }
}

@layer base {
    ._button_l76op_2 {
        position: absolute;
        left: calc(var(--safe-right) + var(--padding-x, .7rem));
        top: calc(var(--header-total));
        z-index: 10;
        width: 4.75rem;
        aspect-ratio: 680 / 611;
        padding: 0;
        margin: 0;
        border: 2px solid #ffb283;
        border-radius: 13px;
        box-sizing: border-box;
        overflow: hidden;
        background-color: #fb7c32;
        background-image: url(/assets/bonus-btn-CQ1bw13Q.webp);
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
        cursor: pointer
    }

    ._timer_l76op_25 {
        position: absolute;
        left: 50%;
        bottom: .2rem;
        transform: translate(-50%);
        width: max-content;
        max-width: calc(100% - .25rem);
        color: #fff;
        font-size: 13px;
        font-weight: 700;
        line-height: 1;
        text-align: center;
        white-space: nowrap;
        font-variant-numeric: tabular-nums;
        -webkit-text-stroke: 1px #8f2f09
    }
}

@layer base {
    ._modal_5uftk_6 {
        overflow: visible
    }

    ._body_5uftk_10 {
        display: flex;
        flex-direction: column;
        gap: 8px;
        overflow: visible
    }

    ._sectionLabel_5uftk_18 {
        text-align: center;
        font-weight: 700;
        font-size: 16px;
        line-height: 17px;
        color: #fbe6be;
        text-shadow: 0px 2px 2px #00000040
    }

    ._hiveScene_5uftk_27 {
        position: relative;
        width: 97px;
        height: 107px;
        flex-shrink: 0
    }

    ._hiveBase_5uftk_34 {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: contain;
        -webkit-user-select: none;
        user-select: none;
        pointer-events: none
    }

    ._hiveBees_5uftk_44 {
        position: absolute;
        left: 50%;
        top: 42%;
        width: 78%;
        transform: translate(-50%,-50%);
        object-fit: contain;
        -webkit-user-select: none;
        user-select: none;
        pointer-events: none
    }

    ._oldPrice_5uftk_55 {
        position: relative;
        display: inline-block
    }

    ._oldPrice_5uftk_55:after {
        content: "";
        position: absolute;
        left: -2%;
        right: -2%;
        top: 50%;
        height: 3px;
        background: #e53935;
        border-radius: 2px;
        transform: translateY(-50%) rotate(20deg);
        pointer-events: none
    }

    ._periodTabs_5uftk_73>div {
        background: #4f3016
    }

    ._lightSurface_5uftk_77 {
        padding: 10px
    }

    ._contentSurface_5uftk_80 {
        border-radius: 27px
    }

    ._title_5uftk_84 {
        font-size: 20px;
        line-height: 18px;
        font-weight: 700;
        color: #4b2c13
    }

    ._productivityValue_5uftk_91 {
        color: #f8eb86;
        font-size: 15px
    }

    ._productivityInputBox_5uftk_96 {
        padding: 2px 12px
    }
}

@layer base {
    ._modal_q2fnu_2 {
        overflow: visible
    }

    ._body_q2fnu_6 {
        display: flex;
        flex-direction: column;
        gap: 8px;
        overflow: visible
    }

    ._sectionLabel_q2fnu_13 {
        text-align: center;
        font-weight: 700;
        font-size: 16px;
        line-height: 17px;
        color: #fbe6be;
        text-shadow: 0px 2px 2px #00000040
    }

    ._oldPrice_q2fnu_22 {
        position: relative;
        display: inline-block
    }

    ._oldPrice_q2fnu_22:after {
        content: "";
        position: absolute;
        left: -2%;
        right: -2%;
        top: 50%;
        height: 3px;
        background: #e53935;
        border-radius: 2px;
        transform: translateY(-50%) rotate(20deg);
        pointer-events: none
    }

    ._periodTabs_q2fnu_40>div {
        background: #4f3016
    }

    ._lightSurface_q2fnu_44 {
        padding: 10px
    }

    ._contentSurface_q2fnu_48 {
        border-radius: 27px
    }

    ._title_q2fnu_52 {
        font-size: 20px;
        line-height: 18px;
        font-weight: 700;
        color: #4b2c13;
        text-align: center
    }

    ._beeColumn_q2fnu_60 {
        position: relative;
        min-width: 101px;
        display: flex;
        align-items: center
    }

    ._beePreviewImg_q2fnu_67 {
        display: block;
        width: 104px;
        height: auto;
        object-fit: contain;
        pointer-events: none
    }

    ._selectLevel_q2fnu_75 {
        font-size: 12px;
        line-height: 15px;
        font-weight: 700;
        color: #fff;
        text-align: center;
        white-space: nowrap;
        position: absolute;
        bottom: 19%;
        left: 50%;
        transform: translate(-50%);
        -webkit-text-stroke: 2px #000;
        paint-order: stroke fill;
        text-shadow: -1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000
    }

    ._statsColumn_q2fnu_95 {
        flex: 1;
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: 8px
    }

    ._statPanel_q2fnu_103 {
        flex: 1;
        justify-content: center
    }

    ._topRow_q2fnu_108 {
        display: flex;
        align-items: stretch;
        gap: 10px;
        width: 100%
    }

    ._levelValue_q2fnu_115 {
        font-size: 18px;
        font-weight: 700;
        line-height: 18px
    }

    ._levelSuffix_q2fnu_121 {
        font-size: 15px;
        font-weight: 700;
        line-height: 18px
    }

    ._productivityValue_q2fnu_127 {
        color: #f8eb86;
        font-size: 15px
    }

    ._productivityInputBox_q2fnu_132 {
        padding: 2px 12px
    }

    ._priceInputBox_q2fnu_136 {
        padding: 4px 12px
    }

    ._stepper_q2fnu_140 {
        --level-color: #007bff;
        position: absolute;
        bottom: 0;
        left: -3px;
        display: flex;
        align-items: center;
        width: calc(100% + 6px)
    }

    ._stepper_q2fnu_140[data-level="10"] {
        --level-color: #007bff
    }

    ._stepper_q2fnu_140[data-level="11"] {
        --level-color: #202eaa
    }

    ._stepper_q2fnu_140[data-level="12"] {
        --level-color: #431999
    }

    ._stepper_q2fnu_140[data-level="13"] {
        --level-color: #b500ff
    }

    ._stepper_q2fnu_140[data-level="14"] {
        --level-color: #d805d5
    }

    ._stepper_q2fnu_140[data-level="15"] {
        --level-color: #d80086
    }

    ._stepperButton_q2fnu_174 {
        position: absolute;
        flex-shrink: 0;
        width: 28px;
        height: 28px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #fff;
        background: color-mix(in srgb,var(--level-color) 58%,#000);
        border: 1px solid #00000080;
        box-shadow: 1px 0 2px #00000059;
        cursor: pointer
    }

    ._stepperButton_q2fnu_174:disabled {
        pointer-events: none;
        background: color-mix(in srgb,var(--level-color) 38%,#000);
        border-color: #0006;
        box-shadow: none
    }

    ._stepperButton_q2fnu_174:disabled ._stepperArrow_q2fnu_195 {
        opacity: .35
    }

    ._stepperButtonLeft_q2fnu_201 {
        left: -1px
    }

    ._stepperButtonRight_q2fnu_205 {
        right: -1px
    }

    ._stepperArrow_q2fnu_195 {
        width: 15px;
        height: 15px;
        color: #fff;
        overflow: visible
    }

    ._stepperValue_q2fnu_216 {
        display: flex;
        align-items: baseline;
        justify-content: center;
        color: #fff;
        font-weight: 700;
        text-shadow: 0 1px 2px rgb(0 0 0 / 40%);
        white-space: nowrap;
        margin: 0 auto;
        width: calc(100% - 6px);
        padding: 2px 8px 1.5px;
        border-radius: 10px;
        border: 1px solid #000000b2;
        background: var(--level-color);
        box-shadow: 0 -2px 1px #0006 inset,0 2px .5px #ffffff80 inset
    }

    ._note_q2fnu_235 {
        font-size: 12px;
        line-height: 14px;
        font-weight: 700;
        color: #fbe6be;
        text-align: center;
        text-shadow: 0px 2px 2px #00000040
    }
}

@layer base {
    ._overlay_1vkek_2 {
        cursor: pointer;
        z-index: 100;
        background: 0 0;
        border: none;
        padding: 0;
        position: fixed;
        inset: 0
    }

    ._modalContainer_1vkek_2 {
        width: 100%;
        top: var(--header-total);
        bottom: calc(var(--navigation-total) - 16px);
        z-index: 102;
        flex-direction: column;
        align-items: center;
        display: flex;
        position: fixed;
        left: 0;
        right: 0;
        overflow-y: auto
    }

    ._backdropClose_1vkek_2 {
        cursor: pointer;
        z-index: 0;
        background: 0 0;
        border: none;
        width: 100%;
        height: 100%;
        padding: 0;
        position: absolute;
        inset: 0
    }

    ._container_1vkek_2 {
        flex-direction: column;
        align-items: center;
        width: 100%;
        padding: 4px 0 12px;
        display: flex;
        overflow-y: auto
    }

    ._button_1vkek_2 {
        paint-order: stroke fill;
        -webkit-text-stroke: 2px #003a73;
        text-shadow: 0 1px 1px #00000059;
        width: 100%
    }

    ._rewardCard_1vkek_2 {
        z-index: 1;
        background: #fff6;
        border: 1px solid #fff9;
        border-radius: 28px;
        justify-content: center;
        align-items: center;
        gap: 8px;
        width: 217px;
        height: 48px;
        display: flex
    }

    ._rewardItem_1vkek_2 {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        display: flex
    }

    ._moneyText_1vkek_2 {
        -webkit-text-stroke: 2px #000;
        paint-order: stroke fill;
        letter-spacing: 0;
        text-align: center;
        color: #6cc872;
        margin-top: -5px;
        font-size: 14px;
        font-style: normal;
        font-weight: 700;
        line-height: 14px
    }

    ._regularText_1vkek_2 {
        color: #fff;
        -webkit-text-stroke: 2px #000;
        paint-order: stroke fill;
        margin-top: -5px;
        font-size: 14px;
        font-style: normal;
        font-weight: 700;
        line-height: 14px
    }

    ._rewardIcon_1vkek_2 {
        object-fit: contain;
        width: 39px;
        height: auto
    }

    ._rewardIconModal_1vkek_2 {
        object-fit: contain;
        width: 62px;
        height: auto
    }

    ._moneyIconModal_1vkek_2 {
        object-fit: contain;
        width: 46px!important;
        height: 46px!important
    }

    ._regularTextModal_1vkek_2 {
        color: #4b2c13;
        -webkit-text-stroke: 0;
        font-size: 18px;
        font-style: normal;
        font-weight: 700;
        line-height: 18px
    }

    ._rewardItemModal_1vkek_2 {
        justify-content: space-between;
        gap: 8px
    }

    ._moneyTextModal_1vkek_2 {
        margin-top: 2px;
        font-size: 18px;
        line-height: 18px
    }

    ._badgeItem_1vkek_2 {
        z-index: 2;
        background: var(--badge-item-bg);
        border: 1px solid var(--badge-item-border);
        border-radius: 50px;
        width: 60px;
        height: 60px;
        padding: 5px
    }

    ._smallerBadgeItem_1vkek_2 {
        --badge-font-size: 25px;
        width: 50px;
        height: 50px
    }

    ._smallerBadgeItem_1vkek_2>div>div {
        padding: 0
    }

    ._twoDigits_1vkek_2 {
        --badge-font-size: 24px
    }

    ._threeDigits_1vkek_2 {
        --badge-font-size: 16px;
        letter-spacing: -.5px
    }

    ._smallerBadgeItem_1vkek_2._twoDigits_1vkek_2 {
        --badge-font-size: 20px
    }

    ._smallerBadgeItem_1vkek_2._threeDigits_1vkek_2 {
        --badge-font-size: 13px
    }

    ._numberBudgeWrapper_1vkek_2 {
        z-index: 2;
        border-radius: 50px;
        position: relative
    }

    ._badgeNumberBGWrapper_1vkek_2 {
        background: var(--badge-wrapper-bg);
        border-radius: 50px;
        padding: 5px;
        box-shadow: inset 0 -1px #ffffffa6,inset 0 1px #00000040
    }

    ._badgeNumberBG_1vkek_2 {
        background: var(--badge-inner-bg);
        border-radius: 60px;
        padding: 5px 3px;
        box-shadow: inset 0 1px 3px #0000008c,inset 0 -1px 3px #0000008c,inset -1px 0 3px #0000008c,inset 1px 0 3px #0000008c
    }

    ._badgeNumber_1vkek_2 {
        font-size: var(--badge-font-size,30px);
        text-align: center;
        background: var(--badge-text-bg);
        -webkit-text-fill-color: transparent;
        -webkit-background-clip: text;
        background-clip: text;
        padding: 5px 2px;
        font-weight: 700;
        line-height: 18px
    }

    ._gold_1vkek_2 {
        --badge-item-bg: linear-gradient(180deg, #eed074 0%, #a5602c 100%);
        --badge-item-border: #401e08;
        --badge-wrapper-bg: linear-gradient(180deg, #9e6025 0%, #feeea1 100%);
        --badge-inner-bg: #3f2a19;
        --badge-text-bg: linear-gradient(180deg, #ffe8a7 0%, #d8955d 100%)
    }

    ._silver_1vkek_2 {
        --badge-item-bg: linear-gradient(180deg, #efefef 0%, #aeaeae 100%);
        --badge-item-border: #333;
        --badge-wrapper-bg: linear-gradient(180deg, #a2a2a2 0%, #fff 100%);
        --badge-inner-bg: #393939;
        --badge-text-bg: linear-gradient(180deg, #fff 0%, #949494 100%)
    }

    ._content_1vkek_2 {
        border-radius: 22px
    }

    ._description_1vkek_2 {
        text-align: center;
        border-radius: 18px;
        padding: 10px 8px;
        font-size: 20px;
        font-weight: 700;
        line-height: 18px
    }

    ._modalInner_1vkek_2 {
        z-index: 1;
        width: 100%;
        max-width: 320px;
        max-height: calc(var(--safe-area-height) - var(--header-total) - var(--navigation-total));
        flex-direction: column;
        align-items: center;
        display: flex;
        position: relative
    }

    ._greenDoneCheckmarkIcon_1vkek_2 {
        position: absolute;
        bottom: -3px;
        left: calc(50% - 10px)
    }
}

._modal_948rz_1 {
    border: 3px solid transparent;
    background: url(/assets/wooden_texture-Dm1U4lzt.svg) center/cover no-repeat padding-box,linear-gradient(180deg,#ebcc72,#a5602c) border-box
}

._title_948rz_10 {
    background: linear-gradient(180deg,#ffe9ad,#c8943e);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    filter: drop-shadow(1px 0 0 #45270f) drop-shadow(-1px 0 0 #45270f) drop-shadow(0 1px 0 #45270f) drop-shadow(0 -1px 0 #45270f)
}

._amount_948rz_20 {
    background: linear-gradient(180deg,#77a560,#0e3322)
}

._amountValue_948rz_24 {
    background: linear-gradient(180deg,#43f664,#27ab30);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent
}

._amountFrame_948rz_31 {
    background: linear-gradient(180deg,#dcbd8f,#87664a)
}

@layer properties {
    @supports (((-webkit-hyphens: none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))) {
        *,:before,:after,::backdrop {
            --tw-translate-x:0;
            --tw-translate-y: 0;
            --tw-translate-z: 0;
            --tw-scale-x: 1;
            --tw-scale-y: 1;
            --tw-scale-z: 1;
            --tw-rotate-x: initial;
            --tw-rotate-y: initial;
            --tw-rotate-z: initial;
            --tw-skew-x: initial;
            --tw-skew-y: initial;
            --tw-space-x-reverse: 0;
            --tw-border-style: solid;
            --tw-leading: initial;
            --tw-font-weight: initial;
            --tw-ordinal: initial;
            --tw-slashed-zero: initial;
            --tw-numeric-figure: initial;
            --tw-numeric-spacing: initial;
            --tw-numeric-fraction: initial;
            --tw-shadow: 0 0 #0000;
            --tw-shadow-color: initial;
            --tw-shadow-alpha: 100%;
            --tw-inset-shadow: 0 0 #0000;
            --tw-inset-shadow-color: initial;
            --tw-inset-shadow-alpha: 100%;
            --tw-ring-color: initial;
            --tw-ring-shadow: 0 0 #0000;
            --tw-inset-ring-color: initial;
            --tw-inset-ring-shadow: 0 0 #0000;
            --tw-ring-inset: initial;
            --tw-ring-offset-width: 0px;
            --tw-ring-offset-color: #fff;
            --tw-ring-offset-shadow: 0 0 #0000;
            --tw-outline-style: solid;
            --tw-blur: initial;
            --tw-brightness: initial;
            --tw-contrast: initial;
            --tw-grayscale: initial;
            --tw-hue-rotate: initial;
            --tw-invert: initial;
            --tw-opacity: initial;
            --tw-saturate: initial;
            --tw-sepia: initial;
            --tw-drop-shadow: initial;
            --tw-drop-shadow-color: initial;
            --tw-drop-shadow-alpha: 100%;
            --tw-drop-shadow-size: initial;
            --tw-ease: initial;
            --tw-text-shadow-color: initial;
            --tw-text-shadow-alpha: 100%
        }
    }
}

@layer theme {
    :root,:host {
        --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
        --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
        --color-gray-900: oklch(21% .034 264.665);
        --color-black: #000;
        --color-white: #fff;
        --spacing: .25rem;
        --text-sm: .875rem;
        --text-sm--line-height: calc(1.25 / .875);
        --text-base: 1rem;
        --text-base--line-height: 1.5 ;
        --text-lg: 1.125rem;
        --text-lg--line-height: calc(1.75 / 1.125);
        --text-xl: 1.25rem;
        --text-xl--line-height: calc(1.75 / 1.25);
        --text-2xl: 1.5rem;
        --text-2xl--line-height: calc(2 / 1.5);
        --text-3xl: 1.875rem;
        --text-3xl--line-height: 1.2 ;
        --font-weight-bold: 700;
        --leading-tight: 1.25;
        --leading-snug: 1.375;
        --radius-sm: .25rem;
        --radius-xl: .75rem;
        --radius-2xl: 1rem;
        --radius-3xl: 1.5rem;
        --radius-4xl: 2rem;
        --ease-out: cubic-bezier(0, 0, .2, 1);
        --animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;
        --default-transition-duration: .15s;
        --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
        --default-font-family: var(--font-sans);
        --default-mono-font-family: var(--font-mono)
    }
}

@layer base {
    *,:after,:before,::backdrop {
        box-sizing: border-box;
        border: 0 solid;
        margin: 0;
        padding: 0
    }

    ::file-selector-button {
        box-sizing: border-box;
        border: 0 solid;
        margin: 0;
        padding: 0
    }

    html,:host {
        -webkit-text-size-adjust:100%;
        tab-size: 4;
        line-height: 1.5;
        font-family: var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
        font-feature-settings: var(--default-font-feature-settings,normal);
        font-variation-settings: var(--default-font-variation-settings,normal);
        -webkit-tap-highlight-color: transparent
    }

    hr {
        height: 0;
        color: inherit;
        border-top-width: 1px
    }

    abbr:where([title]) {
        -webkit-text-decoration:underline dotted;
        text-decoration: underline dotted
    }

    h1,h2,h3,h4,h5,h6 {
        font-size: inherit;
        font-weight: inherit
    }

    a {
        color: inherit;
        -webkit-text-decoration: inherit;
        text-decoration: inherit
    }

    b,strong {
        font-weight: bolder
    }

    code,kbd,samp,pre {
        font-family: var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
        font-feature-settings: var(--default-mono-font-feature-settings,normal);
        font-variation-settings: var(--default-mono-font-variation-settings,normal);
        font-size: 1em
    }

    small {
        font-size: 80%
    }

    sub,sup {
        vertical-align: baseline;
        font-size: 75%;
        line-height: 0;
        position: relative
    }

    sub {
        bottom: -.25em
    }

    sup {
        top: -.5em
    }

    table {
        text-indent: 0;
        border-color: inherit;
        border-collapse: collapse
    }

    :-moz-focusring {
        outline: auto
    }

    progress {
        vertical-align: baseline
    }

    summary {
        display: list-item
    }

    ol,ul,menu {
        list-style: none
    }

    img,svg,video,canvas,audio,iframe,embed,object {
        display: block
    }

    img,video {
        max-width: 100%;
        height: auto
    }

    button,input,select,optgroup,textarea {
        font: inherit;
        font-feature-settings: inherit;
        font-variation-settings: inherit;
        letter-spacing: inherit;
        color: inherit;
        opacity: 1;
        background-color: #0000;
        border-radius: 0
    }

    ::file-selector-button {
        font: inherit;
        font-feature-settings: inherit;
        font-variation-settings: inherit;
        letter-spacing: inherit;
        color: inherit;
        opacity: 1;
        background-color: #0000;
        border-radius: 0
    }

    :where(select:is([multiple],[size])) optgroup {
        font-weight:bolder
    }

    :where(select:is([multiple],[size])) optgroup option {
        padding-inline-start:20px
    }

    ::file-selector-button {
        margin-inline-end:4px}

    ::placeholder {
        opacity: 1
    }

    @supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size:1px) {
        ::placeholder {
            color:currentColor
        }

        @supports (color: color-mix(in lab,red,red)) {
            ::placeholder {
                color:color-mix(in oklab,currentcolor 50%,transparent)
            }
        }
    }

    textarea {
        resize: vertical
    }

    ::-webkit-search-decoration {
        -webkit-appearance: none
    }

    ::-webkit-date-and-time-value {
        min-height: 1lh;
        text-align: inherit
    }

    ::-webkit-datetime-edit {
        display: inline-flex
    }

    ::-webkit-datetime-edit-fields-wrapper {
        padding: 0
    }

    ::-webkit-datetime-edit {
        padding-block:0}

    ::-webkit-datetime-edit-year-field {
        padding-block:0}

    ::-webkit-datetime-edit-month-field {
        padding-block:0}

    ::-webkit-datetime-edit-day-field {
        padding-block:0}

    ::-webkit-datetime-edit-hour-field {
        padding-block:0}

    ::-webkit-datetime-edit-minute-field {
        padding-block:0}

    ::-webkit-datetime-edit-second-field {
        padding-block:0}

    ::-webkit-datetime-edit-millisecond-field {
        padding-block:0}

    ::-webkit-datetime-edit-meridiem-field {
        padding-block:0}

    ::-webkit-calendar-picker-indicator {
        line-height: 1
    }

    :-moz-ui-invalid {
        box-shadow: none
    }

    button,input:where([type=button],[type=reset],[type=submit]) {
        appearance:button
    }

    ::file-selector-button {
        appearance: button
    }

    ::-webkit-inner-spin-button {
        height: auto
    }

    ::-webkit-outer-spin-button {
        height: auto
    }

    [hidden]:where(:not([hidden=until-found])) {
        display:none!important
    }
}

@layer components;@layer utilities {
    .pointer-events-auto {
        pointer-events: auto
    }

    .pointer-events-none {
        pointer-events: none
    }

    .collapse {
        visibility: collapse
    }

    .invisible {
        visibility: hidden
    }

    .visible {
        visibility: visible
    }

    .absolute-center {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%)
    }

    .absolute-center-horizontal {
        position: absolute;
        left: 50%;
        transform: translate(-50%)
    }

    .absolute {
        position: absolute
    }

    .fixed {
        position: fixed
    }

    .relative {
        position: relative
    }

    .sticky {
        position: sticky
    }

    .inset-0 {
        inset: calc(var(--spacing) * 0)
    }

    .inset-\[3\.5\%\] {
        inset: 3.5%
    }

    .inset-x-0 {
        inset-inline: calc(var(--spacing) * 0)
    }

    .start {
        inset-inline-start: var(--spacing)
    }

    .end {
        inset-inline-end: var(--spacing)
    }

    .-top-1 {
        top: calc(var(--spacing) * -1)
    }

    .top-0 {
        top: calc(var(--spacing) * 0)
    }

    .top-1\/2 {
        top: 50%
    }

    .top-\[-3px\] {
        top: -3px
    }

    .-right-1 {
        right: calc(var(--spacing) * -1)
    }

    .-right-3 {
        right: calc(var(--spacing) * -3)
    }

    .-right-\[35px\] {
        right: -35px
    }

    .right-1 {
        right: calc(var(--spacing) * 1)
    }

    .right-\[-2\.5\%\] {
        right: -2.5%
    }

    .right-\[-2px\] {
        right: -2px
    }

    .right-full {
        right: 100%
    }

    .-bottom-\[10px\] {
        bottom: -10px
    }

    .bottom-0 {
        bottom: calc(var(--spacing) * 0)
    }

    .bottom-1 {
        bottom: calc(var(--spacing) * 1)
    }

    .bottom-\[7vh\] {
        bottom: 7vh
    }

    .bottom-\[10px\] {
        bottom: 10px
    }

    .bottom-\[16vh\] {
        bottom: 16vh
    }

    .bottom-\[var\(--promo-tablet-bottom\)\] {
        bottom: var(--promo-tablet-bottom)
    }

    .bottom-full {
        bottom: 100%
    }

    .-left-\[2px\] {
        left: -2px
    }

    .-left-\[35px\] {
        left: -35px
    }

    .left-1\/2 {
        left: 50%
    }

    .left-\[-2\.5\%\] {
        left: -2.5%
    }

    .left-\[-2px\] {
        left: -2px
    }

    .isolate {
        isolation: isolate
    }

    .z-0 {
        z-index: 0
    }

    .z-1 {
        z-index: 1
    }

    .z-9 {
        z-index: 9
    }

    .z-10 {
        z-index: 10
    }

    .z-20 {
        z-index: 20
    }

    .z-\[1\] {
        z-index: 1
    }

    .z-\[4\] {
        z-index: 4
    }

    .z-\[8\] {
        z-index: 8
    }

    .z-\[9\] {
        z-index: 9
    }

    .z-\[110\] {
        z-index: 110
    }

    .z-\[120\] {
        z-index: 120
    }

    .col-start-1 {
        grid-column-start: 1
    }

    .row-start-1 {
        grid-row-start: 1
    }

    .container {
        width: 100%
    }

    @media(min-width: 40rem) {
        .container {
            max-width:40rem
        }
    }

    @media(min-width: 48rem) {
        .container {
            max-width:48rem
        }
    }

    @media(min-width: 64rem) {
        .container {
            max-width:64rem
        }
    }

    @media(min-width: 80rem) {
        .container {
            max-width:80rem
        }
    }

    @media(min-width: 96rem) {
        .container {
            max-width:96rem
        }
    }

    .m-auto {
        margin: auto
    }

    .mx-auto {
        margin-inline:auto}

    .my-1 {
        margin-block:calc(var(--spacing) * 1)}

    .my-2 {
        margin-block: calc(var(--spacing) * 2)
    }

    .-mt-3 {
        margin-top: calc(var(--spacing) * -3)
    }

    .mt-1 {
        margin-top: calc(var(--spacing) * 1)
    }

    .mt-2 {
        margin-top: calc(var(--spacing) * 2)
    }

    .mt-4 {
        margin-top: calc(var(--spacing) * 4)
    }

    .mt-5 {
        margin-top: calc(var(--spacing) * 5)
    }

    .-mr-\[25px\] {
        margin-right: -25px
    }

    .mr-1 {
        margin-right: calc(var(--spacing) * 1)
    }

    .mb-0\.5 {
        margin-bottom: calc(var(--spacing) * .5)
    }

    .mb-1 {
        margin-bottom: calc(var(--spacing) * 1)
    }

    .mb-1\.5 {
        margin-bottom: calc(var(--spacing) * 1.5)
    }

    .mb-2 {
        margin-bottom: calc(var(--spacing) * 2)
    }

    .mb-4 {
        margin-bottom: calc(var(--spacing) * 4)
    }

    .mb-5 {
        margin-bottom: calc(var(--spacing) * 5)
    }

    .mb-12 {
        margin-bottom: calc(var(--spacing) * 12)
    }

    .mb-\[-15px\] {
        margin-bottom: -15px
    }

    .-ml-\[25px\] {
        margin-left: -25px
    }

    .ml-1 {
        margin-left: calc(var(--spacing) * 1)
    }

    .ml-3 {
        margin-left: calc(var(--spacing) * 3)
    }

    .block {
        display: block
    }

    .contents {
        display: contents
    }

    .flex {
        display: flex
    }

    .grid {
        display: grid
    }

    .hidden {
        display: none
    }

    .inline {
        display: inline
    }

    .inline-block {
        display: inline-block
    }

    .inline-flex {
        display: inline-flex
    }

    .aspect-square {
        aspect-ratio: 1
    }

    .size-fit {
        width: fit-content;
        height: fit-content
    }

    .size-full {
        width: 100%;
        height: 100%
    }

    .h-2\.5 {
        height: calc(var(--spacing) * 2.5)
    }

    .h-2\/7 {
        height: 28.5714%
    }

    .h-2\/9 {
        height: 22.2222%
    }

    .h-4 {
        height: calc(var(--spacing) * 4)
    }

    .h-4\.5 {
        height: calc(var(--spacing) * 4.5)
    }

    .h-4\/7 {
        height: 57.1429%
    }

    .h-5 {
        height: calc(var(--spacing) * 5)
    }

    .h-5\.5 {
        height: calc(var(--spacing) * 5.5)
    }

    .h-5\/7 {
        height: 71.4286%
    }

    .h-6 {
        height: calc(var(--spacing) * 6)
    }

    .h-7 {
        height: calc(var(--spacing) * 7)
    }

    .h-7\.5 {
        height: calc(var(--spacing) * 7.5)
    }

    .h-8 {
        height: calc(var(--spacing) * 8)
    }

    .h-8\.5 {
        height: calc(var(--spacing) * 8.5)
    }

    .h-10 {
        height: calc(var(--spacing) * 10)
    }

    .h-12 {
        height: calc(var(--spacing) * 12)
    }

    .h-20 {
        height: calc(var(--spacing) * 20)
    }

    .h-42 {
        height: calc(var(--spacing) * 42)
    }

    .h-\[4\.5rem\] {
        height: 4.5rem
    }

    .h-\[26px\] {
        height: 26px
    }

    .h-\[39px\] {
        height: 39px
    }

    .h-\[47px\] {
        height: 47px
    }

    .h-\[50px\] {
        height: 50px
    }

    .h-\[53px\] {
        height: 53px
    }

    .h-\[65px\] {
        height: 65px
    }

    .h-\[94\%\] {
        height: 94%
    }

    .h-\[100px\] {
        height: 100px
    }

    .h-\[calc\(100\%\+15px\)\] {
        height: calc(100% + 15px)
    }

    .h-auto {
        height: auto
    }

    .h-fit {
        height: fit-content
    }

    .h-full {
        height: 100%
    }

    .max-h-2\/7 {
        max-height: 28.5714%
    }

    .max-h-2\/9 {
        max-height: 22.2222%
    }

    .max-h-\[92\%\] {
        max-height: 92%
    }

    .max-h-none {
        max-height: none
    }

    .min-h-0 {
        min-height: calc(var(--spacing) * 0)
    }

    .min-h-10 {
        min-height: calc(var(--spacing) * 10)
    }

    .w-2\.5 {
        width: calc(var(--spacing) * 2.5)
    }

    .w-2\/5 {
        width: 40%
    }

    .w-3\/4 {
        width: 75%
    }

    .w-4 {
        width: calc(var(--spacing) * 4)
    }

    .w-4\/5 {
        width: 80%
    }

    .w-5 {
        width: calc(var(--spacing) * 5)
    }

    .w-5\/7 {
        width: 71.4286%
    }

    .w-6 {
        width: calc(var(--spacing) * 6)
    }

    .w-7 {
        width: calc(var(--spacing) * 7)
    }

    .w-8 {
        width: calc(var(--spacing) * 8)
    }

    .w-9\/10 {
        width: 90%
    }

    .w-10 {
        width: calc(var(--spacing) * 10)
    }

    .w-11 {
        width: calc(var(--spacing) * 11)
    }

    .w-11\/12 {
        width: 91.6667%
    }

    .w-12 {
        width: calc(var(--spacing) * 12)
    }

    .w-16 {
        width: calc(var(--spacing) * 16)
    }

    .w-24 {
        width: calc(var(--spacing) * 24)
    }

    .w-28 {
        width: calc(var(--spacing) * 28)
    }

    .w-40 {
        width: calc(var(--spacing) * 40)
    }

    .w-\[26px\] {
        width: 26px
    }

    .w-\[27px\] {
        width: 27px
    }

    .w-\[34px\] {
        width: 34px
    }

    .w-\[39px\] {
        width: 39px
    }

    .w-\[47px\] {
        width: 47px
    }

    .w-\[50px\] {
        width: 50px
    }

    .w-\[51px\] {
        width: 51px
    }

    .w-\[80\%\] {
        width: 80%
    }

    .w-\[85\%\] {
        width: 85%
    }

    .w-\[85vw\] {
        width: 85vw
    }

    .w-\[90\%\] {
        width: 90%
    }

    .w-\[92\%\] {
        width: 92%
    }

    .w-\[100px\] {
        width: 100px
    }

    .w-\[135px\] {
        width: 135px
    }

    .w-\[180px\] {
        width: 180px
    }

    .w-\[290px\] {
        width: 290px
    }

    .w-\[300px\] {
        width: 300px
    }

    .w-auto {
        width: auto
    }

    .w-full {
        width: 100%
    }

    .max-w-67\.5 {
        max-width: calc(var(--spacing) * 67.5)
    }

    .max-w-85\! {
        max-width: calc(var(--spacing) * 85)!important
    }

    .max-w-90 {
        max-width: calc(var(--spacing) * 90)
    }

    .max-w-96 {
        max-width: calc(var(--spacing) * 96)
    }

    .max-w-\[200px\] {
        max-width: 200px
    }

    .max-w-\[min\(80vw\,600px\)\] {
        max-width: min(80vw,600px)
    }

    .max-w-full {
        max-width: 100%
    }

    .max-w-none {
        max-width: none
    }

    .min-w-0 {
        min-width: calc(var(--spacing) * 0)
    }

    .flex-1 {
        flex: 1
    }

    .shrink {
        flex-shrink: 1
    }

    .shrink-0 {
        flex-shrink: 0
    }

    .grow {
        flex-grow: 1
    }

    .-translate-x-1\/2 {
        --tw-translate-x: -50% ;
        translate: var(--tw-translate-x) var(--tw-translate-y)
    }

    .translate-x-3\/4 {
        --tw-translate-x: 75% ;
        translate: var(--tw-translate-x) var(--tw-translate-y)
    }

    .-translate-y-1\/2 {
        --tw-translate-y: -50% ;
        translate: var(--tw-translate-x) var(--tw-translate-y)
    }

    .-translate-y-1\/4 {
        --tw-translate-y: -25% ;
        translate: var(--tw-translate-x) var(--tw-translate-y)
    }

    .scale-110 {
        --tw-scale-x: 110%;
        --tw-scale-y: 110%;
        --tw-scale-z: 110%;
        scale: var(--tw-scale-x) var(--tw-scale-y)
    }

    .scale-115 {
        --tw-scale-x: 115%;
        --tw-scale-y: 115%;
        --tw-scale-z: 115%;
        scale: var(--tw-scale-x) var(--tw-scale-y)
    }

    .-scale-x-100 {
        --tw-scale-x: -100% ;
        scale: var(--tw-scale-x) var(--tw-scale-y)
    }

    .scale-\[var\(--promo-tablet-scale\)\] {
        scale: var(--promo-tablet-scale)
    }

    .rotate-180 {
        rotate: 180deg
    }

    .transform {
        transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)
    }

    .animate-pulse {
        animation: var(--animate-pulse)
    }

    .cursor-pointer {
        cursor: pointer
    }

    .touch-none {
        touch-action: none
    }

    .resize {
        resize: both
    }

    .grid-cols-2 {
        grid-template-columns: repeat(2,minmax(0,1fr))
    }

    .grid-cols-4 {
        grid-template-columns: repeat(4,minmax(0,1fr))
    }

    .flex-col {
        flex-direction: column
    }

    .flex-row {
        flex-direction: row
    }

    .flex-row-reverse {
        flex-direction: row-reverse
    }

    .flex-wrap {
        flex-wrap: wrap
    }

    .content-start {
        align-content: flex-start
    }

    .items-baseline {
        align-items: baseline
    }

    .items-center {
        align-items: center
    }

    .items-end {
        align-items: flex-end
    }

    .items-start {
        align-items: flex-start
    }

    .items-stretch {
        align-items: stretch
    }

    .justify-between {
        justify-content: space-between
    }

    .justify-center {
        justify-content: center
    }

    .justify-start {
        justify-content: flex-start
    }

    .gap-0 {
        gap: calc(var(--spacing) * 0)
    }

    .gap-1 {
        gap: calc(var(--spacing) * 1)
    }

    .gap-1\.5 {
        gap: calc(var(--spacing) * 1.5)
    }

    .gap-2 {
        gap: calc(var(--spacing) * 2)
    }

    .gap-2\.5 {
        gap: calc(var(--spacing) * 2.5)
    }

    .gap-3 {
        gap: calc(var(--spacing) * 3)
    }

    .gap-4 {
        gap: calc(var(--spacing) * 4)
    }

    .gap-4\.5 {
        gap: calc(var(--spacing) * 4.5)
    }

    .gap-x-1 {
        column-gap: calc(var(--spacing) * 1)
    }

    .gap-x-2 {
        column-gap: calc(var(--spacing) * 2)
    }

    .gap-x-2\.5 {
        column-gap: calc(var(--spacing) * 2.5)
    }

    .gap-x-3 {
        column-gap: calc(var(--spacing) * 3)
    }

    :where(.space-x-2>:not(:last-child)) {
        --tw-space-x-reverse: 0;
        margin-inline-start:calc(calc(var(--spacing) * 2) * var(--tw-space-x-reverse));margin-inline-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-x-reverse)))
    }

    .gap-y-1 {
        row-gap: calc(var(--spacing) * 1)
    }

    .gap-y-1\.5 {
        row-gap: calc(var(--spacing) * 1.5)
    }

    .gap-y-2 {
        row-gap: calc(var(--spacing) * 2)
    }

    .gap-y-2\.5 {
        row-gap: calc(var(--spacing) * 2.5)
    }

    .gap-y-4 {
        row-gap: calc(var(--spacing) * 4)
    }

    .self-baseline {
        align-self: baseline
    }

    .self-center {
        align-self: center
    }

    .self-end {
        align-self: flex-end
    }

    .self-start {
        align-self: flex-start
    }

    .truncate {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden
    }

    .overflow-hidden {
        overflow: hidden
    }

    .overflow-visible {
        overflow: visible
    }

    .overflow-x-hidden {
        overflow-x: hidden
    }

    .overflow-y-auto {
        overflow-y: auto
    }

    .overflow-y-scroll {
        overflow-y: scroll
    }

    .overscroll-none {
        overscroll-behavior: none
    }

    .rounded {
        border-radius: .25rem
    }

    .rounded-2xl {
        border-radius: var(--radius-2xl)
    }

    .rounded-3xl {
        border-radius: var(--radius-3xl)
    }

    .rounded-4xl {
        border-radius: var(--radius-4xl)
    }

    .rounded-\[1\.5rem\] {
        border-radius: 1.5rem
    }

    .rounded-\[2rem\] {
        border-radius: 2rem
    }

    .rounded-\[18px\] {
        border-radius: 18px
    }

    .rounded-\[22px\] {
        border-radius: 22px
    }

    .rounded-\[32px\] {
        border-radius: 32px
    }

    .rounded-\[40px\] {
        border-radius: 40px
    }

    .rounded-\[50px\] {
        border-radius: 50px
    }

    .rounded-full {
        border-radius: 3.40282e38px
    }

    .rounded-none {
        border-radius: 0
    }

    .rounded-xl {
        border-radius: var(--radius-xl)
    }

    .rounded-t-2xl {
        border-top-left-radius: var(--radius-2xl);
        border-top-right-radius: var(--radius-2xl)
    }

    .rounded-t-\[1\.5rem\] {
        border-top-left-radius: 1.5rem;
        border-top-right-radius: 1.5rem
    }

    .rounded-t-sm {
        border-top-left-radius: var(--radius-sm);
        border-top-right-radius: var(--radius-sm)
    }

    .rounded-b-2xl {
        border-bottom-right-radius: var(--radius-2xl);
        border-bottom-left-radius: var(--radius-2xl)
    }

    .rounded-b-\[1\.5rem\] {
        border-bottom-right-radius: 1.5rem;
        border-bottom-left-radius: 1.5rem
    }

    .rounded-b-sm {
        border-bottom-right-radius: var(--radius-sm);
        border-bottom-left-radius: var(--radius-sm)
    }

    .border {
        border-style: var(--tw-border-style);
        border-width: 1px
    }

    .border-0 {
        border-style: var(--tw-border-style);
        border-width: 0
    }

    .bg-\[\#4f3016\] {
        background-color: #4f3016
    }

    .bg-black\/70 {
        background-color: #000000b3
    }

    @supports (color: color-mix(in lab,red,red)) {
        .bg-black\/70 {
            background-color:color-mix(in oklab,var(--color-black) 70%,transparent)
        }
    }

    .bg-gray-900\/50 {
        background-color: #10182880
    }

    @supports (color: color-mix(in lab,red,red)) {
        .bg-gray-900\/50 {
            background-color:color-mix(in oklab,var(--color-gray-900) 50%,transparent)
        }
    }

    .bg-transparent {
        background-color: #0000
    }

    .bg-none {
        background-image: none
    }

    .object-contain {
        object-fit: contain
    }

    .p-0 {
        padding: calc(var(--spacing) * 0)
    }

    .p-0\.5 {
        padding: calc(var(--spacing) * .5)
    }

    .p-1 {
        padding: calc(var(--spacing) * 1)
    }

    .p-1\.5 {
        padding: calc(var(--spacing) * 1.5)
    }

    .p-2 {
        padding: calc(var(--spacing) * 2)
    }

    .p-2\.5 {
        padding: calc(var(--spacing) * 2.5)
    }

    .p-3 {
        padding: calc(var(--spacing) * 3)
    }

    .p-4 {
        padding: calc(var(--spacing) * 4)
    }

    .p-5 {
        padding: calc(var(--spacing) * 5)
    }

    .p-\[2\.5px\] {
        padding: 2.5px
    }

    .p-px {
        padding: 1px
    }

    .px-0\.5 {
        padding-inline: calc(var(--spacing) * .5)
    }

    .px-1 {
        padding-inline:calc(var(--spacing) * 1)}

    .px-2 {
        padding-inline: calc(var(--spacing) * 2)
    }

    .px-2\.5 {
        padding-inline: calc(var(--spacing) * 2.5)
    }

    .px-3 {
        padding-inline:calc(var(--spacing) * 3)}

    .px-4 {
        padding-inline: calc(var(--spacing) * 4)
    }

    .px-5 {
        padding-inline:calc(var(--spacing) * 5)}

    .px-6 {
        padding-inline: calc(var(--spacing) * 6)
    }

    .px-8 {
        padding-inline:calc(var(--spacing) * 8)}

    .py-0 {
        padding-block: calc(var(--spacing) * 0)
    }

    .py-0\.5 {
        padding-block: calc(var(--spacing) * .5)
    }

    .py-1 {
        padding-block:calc(var(--spacing) * 1)}

    .py-1\.5 {
        padding-block: calc(var(--spacing) * 1.5)
    }

    .py-2 {
        padding-block:calc(var(--spacing) * 2)}

    .py-2\.5 {
        padding-block: calc(var(--spacing) * 2.5)
    }

    .py-3 {
        padding-block:calc(var(--spacing) * 3)}

    .py-4 {
        padding-block: calc(var(--spacing) * 4)
    }

    .py-5 {
        padding-block:calc(var(--spacing) * 5)}

    .py-\[20px\] {
        padding-block: 20px
    }

    .pt-5 {
        padding-top: calc(var(--spacing) * 5)
    }

    .pr-0 {
        padding-right: calc(var(--spacing) * 0)
    }

    .pr-1 {
        padding-right: calc(var(--spacing) * 1)
    }

    .pr-1\.5 {
        padding-right: calc(var(--spacing) * 1.5)
    }

    .pr-2\.5 {
        padding-right: calc(var(--spacing) * 2.5)
    }

    .pr-3 {
        padding-right: calc(var(--spacing) * 3)
    }

    .pr-4 {
        padding-right: calc(var(--spacing) * 4)
    }

    .pr-10 {
        padding-right: calc(var(--spacing) * 10)
    }

    .pr-\[25px\] {
        padding-right: 25px
    }

    .pb-2 {
        padding-bottom: calc(var(--spacing) * 2)
    }

    .pb-6 {
        padding-bottom: calc(var(--spacing) * 6)
    }

    .pb-12 {
        padding-bottom: calc(var(--spacing) * 12)
    }

    .pl-2 {
        padding-left: calc(var(--spacing) * 2)
    }

    .pl-2\.5 {
        padding-left: calc(var(--spacing) * 2.5)
    }

    .pl-3 {
        padding-left: calc(var(--spacing) * 3)
    }

    .pl-4 {
        padding-left: calc(var(--spacing) * 4)
    }

    .pl-5 {
        padding-left: calc(var(--spacing) * 5)
    }

    .pl-10 {
        padding-left: calc(var(--spacing) * 10)
    }

    .pl-\[25px\] {
        padding-left: 25px
    }

    .text-center {
        text-align: center
    }

    .text-2xl {
        font-size: var(--text-2xl);
        line-height: var(--tw-leading,var(--text-2xl--line-height))
    }

    .text-3xl {
        font-size: var(--text-3xl);
        line-height: var(--tw-leading,var(--text-3xl--line-height))
    }

    .text-base {
        font-size: var(--text-base);
        line-height: var(--tw-leading,var(--text-base--line-height))
    }

    .text-lg {
        font-size: var(--text-lg);
        line-height: var(--tw-leading,var(--text-lg--line-height))
    }

    .text-sm {
        font-size: var(--text-sm);
        line-height: var(--tw-leading,var(--text-sm--line-height))
    }

    .text-xl {
        font-size: var(--text-xl);
        line-height: var(--tw-leading,var(--text-xl--line-height))
    }

    .text-\[1\.5rem\] {
        font-size: 1.5rem
    }

    .text-\[3rem\] {
        font-size: 3rem
    }

    .text-\[13px\] {
        font-size: 13px
    }

    .text-\[15px\] {
        font-size: 15px
    }

    .text-\[16px\] {
        font-size: 16px
    }

    .text-\[17px\] {
        font-size: 17px
    }

    .text-\[18px\] {
        font-size: 18px
    }

    .text-\[20px\] {
        font-size: 20px
    }

    .text-\[22px\] {
        font-size: 22px
    }

    .text-\[24px\] {
        font-size: 24px
    }

    .text-\[26px\] {
        font-size: 26px
    }

    .leading-4 {
        --tw-leading: calc(var(--spacing) * 4);
        line-height: calc(var(--spacing) * 4)
    }

    .leading-4\.5 {
        --tw-leading: calc(var(--spacing) * 4.5);
        line-height: calc(var(--spacing) * 4.5)
    }

    .leading-\[18px\] {
        --tw-leading: 18px;
        line-height: 18px
    }

    .leading-none {
        --tw-leading: 1;
        line-height: 1
    }

    .leading-snug {
        --tw-leading: var(--leading-snug);
        line-height: var(--leading-snug)
    }

    .leading-tight {
        --tw-leading: var(--leading-tight);
        line-height: var(--leading-tight)
    }

    .font-bold {
        --tw-font-weight: var(--font-weight-bold);
        font-weight: var(--font-weight-bold)
    }

    .text-nowrap {
        text-wrap: nowrap
    }

    .break-all {
        word-break: break-all
    }

    .whitespace-nowrap {
        white-space: nowrap
    }

    .text-\[\#4B2C13\] {
        color: #4b2c13
    }

    .text-\[\#6CC872\] {
        color: #6cc872
    }

    .text-\[\#6b7280\] {
        color: #6b7280
    }

    .text-\[\#83552E\] {
        color: #83552e
    }

    .text-\[\#BEFBE8\] {
        color: #befbe8
    }

    .text-\[\#FBE6BE\],.text-\[\#fbe6be\] {
        color: #fbe6be
    }

    .text-white {
        color: var(--color-white)
    }

    .capitalize {
        text-transform: capitalize
    }

    .uppercase {
        text-transform: uppercase
    }

    .tabular-nums {
        --tw-numeric-spacing: tabular-nums;
        font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)
    }

    .opacity-30 {
        opacity: .3
    }

    .opacity-90 {
        opacity: .9
    }

    .shadow {
        --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);
        box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)
    }

    .shadow-none {
        --tw-shadow: 0 0 #0000;
        box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)
    }

    .ring {
        --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);
        box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)
    }

    .outline {
        outline-style: var(--tw-outline-style);
        outline-width: 1px
    }

    .outline-2 {
        outline-style: var(--tw-outline-style);
        outline-width: 2px
    }

    .filter {
        filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)
    }

    .transition {
        transition-property: color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;
        transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
        transition-duration: var(--tw-duration,var(--default-transition-duration))
    }

    .ease-out {
        --tw-ease: var(--ease-out);
        transition-timing-function: var(--ease-out)
    }

    .select-none {
        -webkit-user-select: none;
        user-select: none
    }

    .select-text\! {
        -webkit-user-select: text!important;
        user-select: text!important
    }

    .text-shadow-lg\/30 {
        --tw-text-shadow-alpha: 30%;
        text-shadow: 0px 1px 2px var(--tw-text-shadow-color,oklab(0% 0 0/.3)),0px 3px 2px var(--tw-text-shadow-color,oklab(0% 0 0/.3)),0px 4px 8px var(--tw-text-shadow-color,oklab(0% 0 0/.3))
    }

    @media(min-width: 40rem) {
        .sm\:h-6\.5 {
            height:calc(var(--spacing) * 6.5)
        }

        .sm\:h-8\.5 {
            height: calc(var(--spacing) * 8.5)
        }
    }
}

@font-face {
    font-family: BalsamiqSans;
    src: url(/assets/BalsamiqSans-Regular-DVyQNgs_.ttf)format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: BalsamiqSans;
    src: url(/assets/BalsamiqSans-Italic-BMrxEMWk.ttf)format("truetype");
    font-weight: 400;
    font-style: italic;
    font-display: swap
}

@font-face {
    font-family: BalsamiqSans;
    src: url(/assets/BalsamiqSans-Bold-DkpCQlIl.ttf)format("truetype");
    font-weight: 700;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: BalsamiqSans;
    src: url(/assets/BalsamiqSans-BoldItalic-D10E0CmO.ttf)format("truetype");
    font-weight: 700;
    font-style: italic;
    font-display: swap
}

@font-face {
    font-family: RubikOne;
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    src: url(/assets/RubikOne-Regular-07cuPJ67.ttf)format("truetype")
}

:root {
    --safe-area-height: var(--tg-viewport-stable-height,100dvh);
    --safe-area-width: var(--tg-viewport-width,100dvw);
    --safe-area-top: var(--tg-viewport-safe-area-inset-top,0px);
    --safe-content-top: var(--tg-viewport-content-safe-area-inset-top,0px);
    --safe-top: calc(var(--safe-area-top) + var(--safe-content-top));
    --safe-area-right: var(--tg-viewport-safe-area-inset-right,0px);
    --safe-content-right: var(--tg-viewport-content-safe-area-inset-right,0px);
    --safe-right: calc(var(--safe-area-right) + var(--safe-content-right));
    --safe-area-bottom: var(--tg-viewport-safe-area-inset-bottom,0px);
    --safe-content-bottom: var(--tg-viewport-content-safe-area-inset-bottom,0px);
    --safe-bottom: calc(var(--safe-area-bottom) + var(--safe-content-bottom));
    --safe-area-left: var(--tg-viewport-safe-area-inset-left,0px);
    --safe-content-left: var(--tg-viewport-content-safe-area-inset-left,0px);
    --safe-left: calc(var(--safe-area-left) + var(--safe-content-left))
}

html {
    background: #9ebf3e
}

html,body {
    height: 100dvh;
    width: var(--safe-area-width);
    font-family: BalsamiqSans,sans-serif;
    overflow: hidden
}

:not(button):not(input):not(textarea) {
    -webkit-user-select: none;
    user-select: none
}

#root {
    width: 100%;
    max-width: 600px;
    height: 100%;
    margin: auto;
    position: relative;
    overflow: hidden
}

.texture-placeholder {
    background-image: repeating-conic-gradient(#8b00ff88 0% 25%,#0000 0% 50%);
    background-size: 10px 10px
}

.highlight-rim,.highlight-rim--light {
    border: 2px solid #432710;
    box-shadow: 0 0 0 1px #a17346
}

.highlight-rim--light {
    border-width: 1px
}

button:focus-visible {
    outline: none
}

@property --tw-translate-x {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-translate-y {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-translate-z {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-scale-x {
    syntax: "*";
    inherits: false;
    initial-value: 1
}

@property --tw-scale-y {
    syntax: "*";
    inherits: false;
    initial-value: 1
}

@property --tw-scale-z {
    syntax: "*";
    inherits: false;
    initial-value: 1
}

@property --tw-rotate-x {
    syntax: "*";
    inherits: false
}

@property --tw-rotate-y {
    syntax: "*";
    inherits: false
}

@property --tw-rotate-z {
    syntax: "*";
    inherits: false
}

@property --tw-skew-x {
    syntax: "*";
    inherits: false
}

@property --tw-skew-y {
    syntax: "*";
    inherits: false
}

@property --tw-space-x-reverse {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-border-style {
    syntax: "*";
    inherits: false;
    initial-value: solid
}

@property --tw-leading {
    syntax: "*";
    inherits: false
}

@property --tw-font-weight {
    syntax: "*";
    inherits: false
}

@property --tw-ordinal {
    syntax: "*";
    inherits: false
}

@property --tw-slashed-zero {
    syntax: "*";
    inherits: false
}

@property --tw-numeric-figure {
    syntax: "*";
    inherits: false
}

@property --tw-numeric-spacing {
    syntax: "*";
    inherits: false
}

@property --tw-numeric-fraction {
    syntax: "*";
    inherits: false
}

@property --tw-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-shadow-color {
    syntax: "*";
    inherits: false
}

@property --tw-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%
}

@property --tw-inset-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-inset-shadow-color {
    syntax: "*";
    inherits: false
}

@property --tw-inset-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%
}

@property --tw-ring-color {
    syntax: "*";
    inherits: false
}

@property --tw-ring-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-inset-ring-color {
    syntax: "*";
    inherits: false
}

@property --tw-inset-ring-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-ring-inset {
    syntax: "*";
    inherits: false
}

@property --tw-ring-offset-width {
    syntax: "<length>";
    inherits: false;
    initial-value: 0
}

@property --tw-ring-offset-color {
    syntax: "*";
    inherits: false;
    initial-value: #fff
}

@property --tw-ring-offset-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-outline-style {
    syntax: "*";
    inherits: false;
    initial-value: solid
}

@property --tw-blur {
    syntax: "*";
    inherits: false
}

@property --tw-brightness {
    syntax: "*";
    inherits: false
}

@property --tw-contrast {
    syntax: "*";
    inherits: false
}

@property --tw-grayscale {
    syntax: "*";
    inherits: false
}

@property --tw-hue-rotate {
    syntax: "*";
    inherits: false
}

@property --tw-invert {
    syntax: "*";
    inherits: false
}

@property --tw-opacity {
    syntax: "*";
    inherits: false
}

@property --tw-saturate {
    syntax: "*";
    inherits: false
}

@property --tw-sepia {
    syntax: "*";
    inherits: false
}

@property --tw-drop-shadow {
    syntax: "*";
    inherits: false
}

@property --tw-drop-shadow-color {
    syntax: "*";
    inherits: false
}

@property --tw-drop-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%
}

@property --tw-drop-shadow-size {
    syntax: "*";
    inherits: false
}

@property --tw-ease {
    syntax: "*";
    inherits: false
}

@property --tw-text-shadow-color {
    syntax: "*";
    inherits: false
}

@property --tw-text-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%
}

@keyframes pulse {
    50% {
        opacity: .5
    }
}