:root {
    background-color: #f5f6f7
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box
}

html,body {
    width: 100%;
    height: 100%
}

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

ul,ol {
    list-style: none
}

button,input,textarea {
    font: inherit;
    border: none;
    outline: none;
    background: none
}

img {
    max-width: 100%;
    height: auto;
    display: block
}

.status-indicator[data-v-7c1b1ac7] {
    position: relative;
    padding-left: 20px
}

.status-indicator[data-v-7c1b1ac7]:before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
    height: 8px;
    border-radius: 50%;
    animation: blink 1.5s infinite
}

.available[data-v-7c1b1ac7]:before {
    background-color: #4caf50
}

.unavailable[data-v-7c1b1ac7]:before {
    background-color: #f44336
}

.modal-overlay[data-v-7c1b1ac7] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    pointer-events: auto;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px)
}

.modal-content[data-v-7c1b1ac7] {
    position: relative;
    background-color: #fff;
    border-radius: 12px;
    padding: 16px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    box-shadow: 0 4px 20px #00000026;
    text-align: center;
    z-index: 1001
}

.modal-close[data-v-7c1b1ac7] {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #0000001a;
    border: none;
    color: #666;
    font-size: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: all .2s ease
}

.modal-close[data-v-7c1b1ac7]:hover {
    background: #0003;
    color: #333
}

.modal-icon[data-v-7c1b1ac7] {
    margin-bottom: 8px;
    color: #4caf50;
    background-color: #4caf501a;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center
}

.modal-message[data-v-7c1b1ac7] {
    font-size: 16px;
    color: #333;
    word-wrap: break-word;
    word-break: break-all;
    white-space: normal;
    overflow-wrap: break-word
}

.modal-fade-enter-active[data-v-7c1b1ac7],.modal-fade-leave-active[data-v-7c1b1ac7] {
    transition: opacity .3s ease,transform .4s cubic-bezier(.175,.885,.32,1.275)
}

.modal-fade-enter-from[data-v-7c1b1ac7],.modal-fade-leave-to[data-v-7c1b1ac7] {
    opacity: 0;
    transform: scale(.6)
}

.modal-fade-enter-to[data-v-7c1b1ac7],.modal-fade-leave-from[data-v-7c1b1ac7] {
    opacity: 1;
    transform: scale(1)
}

.header-wrapper[data-v-525c7380] {
    width: 100%
}

.header[data-v-525c7380] {
    height: 70px;
    margin: 0 auto
}

.container[data-v-525c7380] {
    max-width: 1200px;
    min-width: auto;
    margin: 0 auto;
    width: 100%
}

.row[data-v-525c7380] {
    display: grid;
    grid-template-columns: repeat(12,1fr);
    gap: 20px
}

.sidebar[data-v-525c7380] {
    width: 240px
}

.main-content[data-v-525c7380] {
    min-height: 600px
}

.footer[data-v-525c7380] {
    height: 200px
}

@media screen and (max-width: 1366px) {
    .container[data-v-525c7380] {
        max-width:1140px
    }
}

@media screen and (max-width: 1200px) {
    .container[data-v-525c7380] {
        max-width:960px
    }
}

@media screen and (max-width: 768px) {
    .container[data-v-525c7380] {
        max-width:100%;
        padding: 0 10px
    }

    .row[data-v-525c7380] {
        gap: 15px
    }

    .sidebar[data-v-525c7380] {
        width: 100%
    }
}

@media screen and (max-width: 480px) {
    .container[data-v-525c7380] {
        padding:0 20px
    }

    .row[data-v-525c7380] {
        gap: 10px
    }

    .header[data-v-525c7380] {
        height: 50px
    }

    .main-content[data-v-525c7380] {
        min-height: 400px
    }

    .footer[data-v-525c7380] {
        height: 150px
    }
}

.loading-indicator[data-v-525c7380] {
    display: flex;
    align-items: center;
    background-color: #ffffffe6;
    border-radius: 20px;
    padding: 5px 12px;
    animation: fadeIn-525c7380 .3s ease-in-out
}

@keyframes fadeIn-525c7380 {
    0% {
        opacity: 0;
        transform: translateY(-10px)
    }

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

.loading-spinner-small[data-v-525c7380] {
    width: 18px;
    height: 18px;
    border: 2px solid rgba(0,0,0,.1);
    border-radius: 50%;
    border-top-color: #3498db;
    animation: spin-525c7380 1s ease-in-out infinite;
    margin-right: 8px
}

.loading-text-small[data-v-525c7380] {
    font-size: 14px;
    color: #555;
    white-space: nowrap
}

@keyframes spin-525c7380 {
    to {
        transform: rotate(360deg)
    }
}

@media screen and (max-width: 768px) {
    .loading-indicator[data-v-525c7380] {
        padding:4px 10px
    }

    .loading-spinner-small[data-v-525c7380] {
        width: 16px;
        height: 16px;
        margin-right: 6px
    }

    .loading-text-small[data-v-525c7380] {
        font-size: 12px
    }
}

.account-list-enter-active[data-v-525c7380],.account-list-leave-active[data-v-525c7380] {
    transition: all .5s ease
}

.account-list-enter-from[data-v-525c7380] {
    opacity: 0;
    transform: translateY(30px)
}

.account-list-leave-to[data-v-525c7380] {
    opacity: 0;
    transform: translateY(-30px)
}

.account-item[data-v-525c7380] {
    transition: all .5s ease
}

@keyframes pulse-525c7380 {
    0% {
        opacity: .6
    }

    50% {
        opacity: 1
    }

    to {
        opacity: .6
    }
}

.loading .account-item[data-v-525c7380] {
    animation: pulse-525c7380 1.5s infinite
}

.account-warning[data-v-525c7380] {
    text-align: left;
    color: #333
}

.warning-title[data-v-525c7380] {
    font-weight: 700;
    margin-bottom: 10px;
    color: #e74c3c;
    font-size: 16px
}

.warning-list[data-v-525c7380] {
    list-style-type: none;
    padding: 0;
    margin: 0
}

.warning-list li[data-v-525c7380] {
    margin-bottom: 8px;
    line-height: 1.5;
    padding-left: 18px;
    position: relative
}

.warning-list li[data-v-525c7380]:before {
    content: "•";
    position: absolute;
    left: 0;
    color: #e74c3c
}

.warning-highlight[data-v-525c7380] {
    color: #e74c3c;
    font-weight: 700
}

.ios-install-prompt[data-v-525c7380] {
    animation: none
}

.modal-overlay[data-v-525c7380] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #0009;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px)
}

.modal-container[data-v-525c7380] {
    width: 92%;
    max-width: 360px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 12px 32px #0003;
    animation: bounceIn-525c7380 .5s cubic-bezier(.215,.61,.355,1)
}

@keyframes bounceIn-525c7380 {
    0% {
        opacity: 0;
        transform: scale(.8)
    }

    60% {
        opacity: 1;
        transform: scale(1.03)
    }

    to {
        transform: scale(1)
    }
}

.modal-content[data-v-525c7380] {
    background-color: #fff;
    padding: 24px;
    border-radius: 16px
}

.modal-header[data-v-525c7380] {
    display: flex;
    align-items: center;
    margin-bottom: 16px
}

.modal-icon[data-v-525c7380] {
    margin-right: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 48px;
    height: 48px;
    background-color: #3b82f61a;
    border-radius: 12px
}

.modal-title[data-v-525c7380] {
    color: #1e293b;
    font-weight: 600;
    margin: 0
}

.modal-description[data-v-525c7380] {
    font-size: 15px;
    line-height: 1.5
}

.install-image-container[data-v-525c7380] {
    margin: 20px 0;
    display: flex;
    justify-content: center
}

.install-image[data-v-525c7380] {
    width: 100%;
    max-width: 280px
}

.image-placeholder[data-v-525c7380] {
    border-radius: 12px;
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    padding: 12px;
    display: flex;
    flex-direction: column;
    align-items: center
}

.safari-ui[data-v-525c7380] {
    width: 100%;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    overflow: hidden;
    background-color: #fff;
    margin-bottom: 12px
}

.safari-address-bar[data-v-525c7380] {
    background-color: #f1f5f9;
    border-bottom: 1px solid #e2e8f0;
    padding: 6px 12px;
    display: flex;
    align-items: center;
    justify-content: center
}

.safari-content[data-v-525c7380] {
    padding: 16px;
    text-align: center;
    font-weight: 500;
    color: #1e293b
}

.safari-toolbar[data-v-525c7380] {
    background-color: #f1f5f9;
    border-top: 1px solid #e2e8f0;
    padding: 6px 12px;
    display: flex;
    align-items: center;
    justify-content: center
}

.action-arrow[data-v-525c7380] {
    margin: 8px 0;
    animation: bounce-525c7380 2s infinite
}

@keyframes bounce-525c7380 {
    0%,20%,50%,80%,to {
        transform: translateY(0)
    }

    40% {
        transform: translateY(-10px)
    }

    60% {
        transform: translateY(-5px)
    }
}

.action-menu[data-v-525c7380] {
    background-color: #fff;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    width: 85%;
    padding: 8px;
    box-shadow: 0 4px 12px #0000001a
}

.action-item[data-v-525c7380] {
    display: flex;
    align-items: center;
    padding: 8px;
    background-color: #f8fafc;
    border-radius: 6px;
    font-size: 14px;
    color: #334155
}

.action-item span[data-v-525c7380]:first-child {
    margin-right: 8px
}

.steps-container[data-v-525c7380] {
    background-color: #f8fafc;
    border-radius: 12px;
    padding: 16px;
    border: 1px solid #e2e8f0
}

.steps-title[data-v-525c7380] {
    font-size: 15px;
    margin-bottom: 12px
}

.steps-list[data-v-525c7380] {
    list-style: none;
    padding: 0;
    margin: 0
}

.step-item[data-v-525c7380] {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
    font-size: 14px
}

.step-item[data-v-525c7380]:last-child {
    margin-bottom: 0
}

.step-icon[data-v-525c7380] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #3b82f61a;
    border-radius: 50%;
    margin-right: 12px;
    flex-shrink: 0
}

.step-text[data-v-525c7380] {
    color: #334155;
    line-height: 1.4
}

.modal-actions[data-v-525c7380] {
    display: flex;
    justify-content: space-between;
    margin-top: 24px
}

.action-button[data-v-525c7380] {
    padding: 10px 18px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all .2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 120px
}

.action-button.cancel[data-v-525c7380] {
    background-color: #f1f5f9;
    color: #475569;
    border: 1px solid #e2e8f0
}

.action-button.confirm[data-v-525c7380] {
    background-color: #3b82f6;
    color: #fff
}

.action-button[data-v-525c7380]:hover {
    transform: translateY(-2px);
    box-shadow: 0 2px 8px #0000001a
}

.action-button[data-v-525c7380]:active {
    transform: translateY(0)
}

.modal-fade-enter-active[data-v-525c7380],.modal-fade-leave-active[data-v-525c7380] {
    transition: all .3s ease
}

.modal-fade-enter-from[data-v-525c7380] {
    opacity: 0
}

.modal-fade-enter-to[data-v-525c7380],.modal-fade-leave-from[data-v-525c7380] {
    opacity: 1
}

.modal-fade-leave-to[data-v-525c7380] {
    opacity: 0
}

@media screen and (max-width: 480px) {
    .modal-container[data-v-525c7380] {
        width:95%;
        max-width: 340px
    }

    .modal-content[data-v-525c7380] {
        padding: 20px
    }

    .steps-container[data-v-525c7380] {
        padding: 12px
    }

    .action-button[data-v-525c7380] {
        min-width: 110px;
        padding: 8px 14px
    }
}

*,:before,:after {
    --un-rotate: 0;
    --un-rotate-x: 0;
    --un-rotate-y: 0;
    --un-rotate-z: 0;
    --un-scale-x: 1;
    --un-scale-y: 1;
    --un-scale-z: 1;
    --un-skew-x: 0;
    --un-skew-y: 0;
    --un-translate-x: 0;
    --un-translate-y: 0;
    --un-translate-z: 0;
    --un-pan-x: ;
    --un-pan-y: ;
    --un-pinch-zoom: ;
    --un-scroll-snap-strictness: proximity;
    --un-ordinal: ;
    --un-slashed-zero: ;
    --un-numeric-figure: ;
    --un-numeric-spacing: ;
    --un-numeric-fraction: ;
    --un-border-spacing-x: 0;
    --un-border-spacing-y: 0;
    --un-ring-offset-shadow: 0 0 rgb(0 0 0 / 0);
    --un-ring-shadow: 0 0 rgb(0 0 0 / 0);
    --un-shadow-inset: ;
    --un-shadow: 0 0 rgb(0 0 0 / 0);
    --un-ring-inset: ;
    --un-ring-offset-width: 0px;
    --un-ring-offset-color: #fff;
    --un-ring-width: 0px;
    --un-ring-color: rgb(147 197 253 / .5);
    --un-blur: ;
    --un-brightness: ;
    --un-contrast: ;
    --un-drop-shadow: ;
    --un-grayscale: ;
    --un-hue-rotate: ;
    --un-invert: ;
    --un-saturate: ;
    --un-sepia: ;
    --un-backdrop-blur: ;
    --un-backdrop-brightness: ;
    --un-backdrop-contrast: ;
    --un-backdrop-grayscale: ;
    --un-backdrop-hue-rotate: ;
    --un-backdrop-invert: ;
    --un-backdrop-opacity: ;
    --un-backdrop-saturate: ;
    --un-backdrop-sepia:
}

::backdrop {
    --un-rotate: 0;
    --un-rotate-x: 0;
    --un-rotate-y: 0;
    --un-rotate-z: 0;
    --un-scale-x: 1;
    --un-scale-y: 1;
    --un-scale-z: 1;
    --un-skew-x: 0;
    --un-skew-y: 0;
    --un-translate-x: 0;
    --un-translate-y: 0;
    --un-translate-z: 0;
    --un-pan-x: ;
    --un-pan-y: ;
    --un-pinch-zoom: ;
    --un-scroll-snap-strictness: proximity;
    --un-ordinal: ;
    --un-slashed-zero: ;
    --un-numeric-figure: ;
    --un-numeric-spacing: ;
    --un-numeric-fraction: ;
    --un-border-spacing-x: 0;
    --un-border-spacing-y: 0;
    --un-ring-offset-shadow: 0 0 rgb(0 0 0 / 0);
    --un-ring-shadow: 0 0 rgb(0 0 0 / 0);
    --un-shadow-inset: ;
    --un-shadow: 0 0 rgb(0 0 0 / 0);
    --un-ring-inset: ;
    --un-ring-offset-width: 0px;
    --un-ring-offset-color: #fff;
    --un-ring-width: 0px;
    --un-ring-color: rgb(147 197 253 / .5);
    --un-blur: ;
    --un-brightness: ;
    --un-contrast: ;
    --un-drop-shadow: ;
    --un-grayscale: ;
    --un-hue-rotate: ;
    --un-invert: ;
    --un-saturate: ;
    --un-sepia: ;
    --un-backdrop-blur: ;
    --un-backdrop-brightness: ;
    --un-backdrop-contrast: ;
    --un-backdrop-grayscale: ;
    --un-backdrop-hue-rotate: ;
    --un-backdrop-invert: ;
    --un-backdrop-opacity: ;
    --un-backdrop-saturate: ;
    --un-backdrop-sepia:
}

.i-carbon-add-alt {
    --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 32 32' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M16 4c6.6 0 12 5.4 12 12s-5.4 12-12 12S4 22.6 4 16S9.4 4 16 4m0-2C8.3 2 2 8.3 2 16s6.3 14 14 14s14-6.3 14-14S23.7 2 16 2'/%3E%3Cpath fill='currentColor' d='M24 15h-7V8h-2v7H8v2h7v7h2v-7h7z'/%3E%3C/svg%3E");
    -webkit-mask: var(--un-icon) no-repeat;
    mask: var(--un-icon) no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    background-color: currentColor;
    color: inherit;
    width: 1.2em;
    height: 1.2em
}

.i-carbon-application-mobile {
    --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 32 32' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M23 7h4v4h-4zm0 6h4v4h-4zm-6-6h4v4h-4zm0 6h4v4h-4z'/%3E%3Ccircle cx='14.5' cy='24.5' r='1.5' fill='currentColor'/%3E%3Cpath fill='currentColor' d='M21 30H8a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h13v2H8v24h13v-8h2v8a2 2 0 0 1-2 2'/%3E%3C/svg%3E");
    -webkit-mask: var(--un-icon) no-repeat;
    mask: var(--un-icon) no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    background-color: currentColor;
    color: inherit;
    width: 1.2em;
    height: 1.2em
}

.i-carbon-arrow-down {
    --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 32 32' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M24.59 16.59L17 24.17V4h-2v20.17l-7.59-7.58L6 18l10 10l10-10z'/%3E%3C/svg%3E");
    -webkit-mask: var(--un-icon) no-repeat;
    mask: var(--un-icon) no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    background-color: currentColor;
    color: inherit;
    width: 1.2em;
    height: 1.2em
}

.i-carbon-checkmark {
    --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 32 32' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='m13 24l-9-9l1.414-1.414L13 21.171L26.586 7.586L28 9z'/%3E%3C/svg%3E");
    -webkit-mask: var(--un-icon) no-repeat;
    mask: var(--un-icon) no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    background-color: currentColor;
    color: inherit;
    width: 1.2em;
    height: 1.2em
}

.i-carbon-close {
    --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 32 32' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M17.414 16L24 9.414L22.586 8L16 14.586L9.414 8L8 9.414L14.586 16L8 22.586L9.414 24L16 17.414L22.586 24L24 22.586z'/%3E%3C/svg%3E");
    -webkit-mask: var(--un-icon) no-repeat;
    mask: var(--un-icon) no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    background-color: currentColor;
    color: inherit;
    width: 1.2em;
    height: 1.2em
}

.i-carbon-globe {
    --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 32 32' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M14 4a7 7 0 1 1-7 7a7 7 0 0 1 7-7m0-2a9 9 0 1 0 9 9a9 9 0 0 0-9-9'/%3E%3Cpath fill='currentColor' d='M28 11a13.96 13.96 0 0 0-4.105-9.895L22.48 2.52a11.994 11.994 0 0 1-16.924 17l-.038-.038l-1.414 1.414A13.96 13.96 0 0 0 14 25v3h-4v2h10v-2h-4v-3.16A14.01 14.01 0 0 0 28 11'/%3E%3C/svg%3E");
    -webkit-mask: var(--un-icon) no-repeat;
    mask: var(--un-icon) no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    background-color: currentColor;
    color: inherit;
    width: 1.2em;
    height: 1.2em
}

.i-carbon-information {
    --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 32 32' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M17 22v-8h-4v2h2v6h-3v2h8v-2zM16 8a1.5 1.5 0 1 0 1.5 1.5A1.5 1.5 0 0 0 16 8'/%3E%3Cpath fill='currentColor' d='M16 30a14 14 0 1 1 14-14a14 14 0 0 1-14 14m0-26a12 12 0 1 0 12 12A12 12 0 0 0 16 4'/%3E%3C/svg%3E");
    -webkit-mask: var(--un-icon) no-repeat;
    mask: var(--un-icon) no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    background-color: currentColor;
    color: inherit;
    width: 1.2em;
    height: 1.2em
}

.i-carbon-rocket {
    --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 32 32' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='m7.288 23.292l7.997-7.997l1.414 1.414l-7.997 7.997z'/%3E%3Cpath fill='currentColor' d='M17 30a1 1 0 0 1-.37-.07a1 1 0 0 1-.62-.79l-1-7l2-.28l.75 5.27L21 24.52V17a1 1 0 0 1 .29-.71l4.07-4.07A8.94 8.94 0 0 0 28 5.86V4h-1.86a8.94 8.94 0 0 0-6.36 2.64l-4.07 4.07A1 1 0 0 1 15 11H7.48l-2.61 3.26l5.27.75l-.28 2l-7-1a1 1 0 0 1-.79-.62a1 1 0 0 1 .15-1l4-5A1 1 0 0 1 7 9h7.59l3.77-3.78A10.92 10.92 0 0 1 26.14 2H28a2 2 0 0 1 2 2v1.86a10.92 10.92 0 0 1-3.22 7.78L23 17.41V25a1 1 0 0 1-.38.78l-5 4A1 1 0 0 1 17 30'/%3E%3C/svg%3E");
    -webkit-mask: var(--un-icon) no-repeat;
    mask: var(--un-icon) no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    background-color: currentColor;
    color: inherit;
    width: 1.2em;
    height: 1.2em
}

.i-carbon-share {
    --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 32 32' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M23 20a5 5 0 0 0-3.89 1.89l-7.31-4.57a4.46 4.46 0 0 0 0-2.64l7.31-4.57A5 5 0 1 0 18 7a4.8 4.8 0 0 0 .2 1.32l-7.31 4.57a5 5 0 1 0 0 6.22l7.31 4.57A4.8 4.8 0 0 0 18 25a5 5 0 1 0 5-5m0-16a3 3 0 1 1-3 3a3 3 0 0 1 3-3M7 19a3 3 0 1 1 3-3a3 3 0 0 1-3 3m16 9a3 3 0 1 1 3-3a3 3 0 0 1-3 3'/%3E%3C/svg%3E");
    -webkit-mask: var(--un-icon) no-repeat;
    mask: var(--un-icon) no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    background-color: currentColor;
    color: inherit;
    width: 1.2em;
    height: 1.2em
}

.i-mi-share {
    --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M11.293 2.293a1 1 0 0 1 1.414 0l3 3a1 1 0 0 1-1.414 1.414L13 5.414V15a1 1 0 1 1-2 0V5.414L9.707 6.707a1 1 0 0 1-1.414-1.414zM4 11a2 2 0 0 1 2-2h2a1 1 0 0 1 0 2H6v9h12v-9h-2a1 1 0 1 1 0-2h2a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2z'/%3E%3C/svg%3E");
    -webkit-mask: var(--un-icon) no-repeat;
    mask: var(--un-icon) no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    background-color: currentColor;
    color: inherit;
    width: 1.2em;
    height: 1.2em
}

.container {
    width: 100%
}

.f-between {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.text-xs {
    font-size: 14px;
    line-height: 22px;
    font-weight: 300;
    font-family: PingFang SC,-apple-system,BlinkMacSystemFont,Microsoft YaHei,sans-serif
}

.shadow-button {
    --un-shadow: 0 2px 8px -2px var(--un-shadow-color, rgba(0, 0, 0, .12));
    box-shadow: var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)
}

.hover\:shadow-button-hover:hover {
    --un-shadow: 0 4px 12px -3px var(--un-shadow-color, rgba(0, 0, 0, .18));
    box-shadow: var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)
}

@media (min-width: 320px) {
    .container {
        max-width:320px
    }

    .xs\:text-m-base {
        font-size: 16px;
        line-height: 24px;
        font-family: PingFang SC,-apple-system,BlinkMacSystemFont,Microsoft YaHei,sans-serif
    }

    .xs\:text-m-body {
        font-size: 16px;
        line-height: 24px;
        font-weight: 400;
        line-height: 1.5;
        font-family: PingFang SC,-apple-system,BlinkMacSystemFont,Microsoft YaHei,sans-serif
    }

    .xs\:text-m-h2 {
        font-size: 24px;
        line-height: 32px;
        font-weight: 500;
        letter-spacing: -.025em;
        font-family: PingFang SC,-apple-system,BlinkMacSystemFont,Microsoft YaHei,sans-serif
    }

    .xs\:text-m-h3 {
        font-size: 20px;
        line-height: 28px;
        font-weight: 500;
        font-family: PingFang SC,-apple-system,BlinkMacSystemFont,Microsoft YaHei,sans-serif
    }

    .xs\:text-m-h4 {
        font-size: 16px;
        line-height: 24px;
        font-weight: 500;
        font-family: PingFang SC,-apple-system,BlinkMacSystemFont,Microsoft YaHei,sans-serif
    }
}

@media (min-width: 480px) {
    .container {
        max-width:480px
    }
}

@media (min-width: 768px) {
    .container {
        max-width:768px
    }

    .md\:text-body {
        font-size: 18px;
        line-height: 26px;
        font-weight: 400;
        line-height: 1.5;
        font-family: PingFang SC,-apple-system,BlinkMacSystemFont,Microsoft YaHei,sans-serif
    }

    .md\:text-h1 {
        font-size: 40px;
        line-height: 48px;
        font-weight: 600;
        letter-spacing: -.05em;
        font-family: PingFang SC,-apple-system,BlinkMacSystemFont,Microsoft YaHei,sans-serif
    }

    .md\:text-h3 {
        font-size: 24px;
        line-height: 32px;
        font-weight: 500;
        font-family: PingFang SC,-apple-system,BlinkMacSystemFont,Microsoft YaHei,sans-serif
    }
}

@media (min-width: 1200px) {
    .container {
        max-width:1200px
    }
}

@media (min-width: 1366px) {
    .container {
        max-width:1366px
    }
}

@media (min-width: 1536px) {
    .container {
        max-width:1536px
    }
}

.absolute {
    position: absolute
}

.fixed {
    position: fixed
}

.relative {
    position: relative
}

.grid {
    display: grid
}

.m-0 {
    margin: 0
}

.mx-1 {
    margin-left: .25rem;
    margin-right: .25rem
}

.mb-1 {
    margin-bottom: .25rem
}

.mb-2 {
    margin-bottom: .5rem
}

.mb-2\.5 {
    margin-bottom: .625rem
}

.mb-4 {
    margin-bottom: 1rem
}

.mr-1 {
    margin-right: .25rem
}

.mr-2 {
    margin-right: .5rem
}

.ms {
    margin-inline-start:1rem}

.mt-1 {
    margin-top: .25rem
}

.mt-2 {
    margin-top: .5rem
}

.mt-3 {
    margin-top: .75rem
}

.mt-4 {
    margin-top: 1rem
}

.inline-block {
    display: inline-block
}

.hidden {
    display: none
}

.h3 {
    height: .75rem
}

.h4 {
    height: 1rem
}

.w-full {
    width: 100%
}

.flex {
    display: flex
}

.flex-shrink {
    flex-shrink: 1
}

.flex-col {
    flex-direction: column
}

.flex-wrap {
    flex-wrap: wrap
}

.transform {
    transform: translate(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotate(var(--un-rotate-z)) skew(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z))
}

.cursor-pointer {
    cursor: pointer
}

.list-none {
    list-style-type: none
}

.items-center {
    align-items: center
}

.gap-3 {
    gap: .75rem
}

.space-y-2>:not([hidden])~:not([hidden]) {
    --un-space-y-reverse: 0;
    margin-top: calc(.5rem * calc(1 - var(--un-space-y-reverse)));
    margin-bottom: calc(.5rem * var(--un-space-y-reverse))
}

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

.border {
    border-width: 1px
}

.border-gray-200 {
    --un-border-opacity: 1;
    border-color: rgb(229 231 235 / var(--un-border-opacity))
}

.rounded-18px {
    border-radius: 18px
}

.rounded-lg {
    border-radius: .5rem
}

.bg-\#2196F3 {
    --un-bg-opacity: 1;
    background-color: rgb(33 150 243 / var(--un-bg-opacity))
}

.bg-\#4CAF50 {
    --un-bg-opacity: 1;
    background-color: rgb(76 175 80 / var(--un-bg-opacity))
}

.bg-\#fff {
    --un-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--un-bg-opacity))
}

.bg-gray-50 {
    --un-bg-opacity: 1;
    background-color: rgb(249 250 251 / var(--un-bg-opacity))
}

.hover\:bg-\#0b7dda:hover {
    --un-bg-opacity: 1;
    background-color: rgb(11 125 218 / var(--un-bg-opacity))
}

.hover\:bg-\#45a049:hover {
    --un-bg-opacity: 1;
    background-color: rgb(69 160 73 / var(--un-bg-opacity))
}

.p-0 {
    padding: 0
}

.p-3 {
    padding: .75rem
}

.p-5 {
    padding: 1.25rem
}

.px-5 {
    padding-left: 1.25rem;
    padding-right: 1.25rem
}

.text-left {
    text-align: left
}

.align-middle {
    vertical-align: middle
}

.text-20px {
    font-size: 20px
}

.text-24px {
    font-size: 24px
}

.text-32px {
    font-size: 32px
}

.text-sm {
    font-size: 16px;
    line-height: 24px
}

.text-\#2c3e50 {
    --un-text-opacity: 1;
    color: rgb(44 62 80 / var(--un-text-opacity))
}

.text-\#2c3f51 {
    --un-text-opacity: 1;
    color: rgb(44 63 81 / var(--un-text-opacity))
}

.text-\#2c502c {
    --un-text-opacity: 1;
    color: rgb(44 80 44 / var(--un-text-opacity))
}

.text-\#3742fa {
    --un-text-opacity: 1;
    color: rgb(55 66 250 / var(--un-text-opacity))
}

.text-\#4c3ce7 {
    --un-text-opacity: 1;
    color: rgb(76 60 231 / var(--un-text-opacity))
}

.text-\#502c50 {
    --un-text-opacity: 1;
    color: rgb(80 44 80 / var(--un-text-opacity))
}

.text-\#503e2c {
    --un-text-opacity: 1;
    color: rgb(80 62 44 / var(--un-text-opacity))
}

.text-\#512c3f {
    --un-text-opacity: 1;
    color: rgb(81 44 63 / var(--un-text-opacity))
}

.text-\#a13ce7 {
    --un-text-opacity: 1;
    color: rgb(161 60 231 / var(--un-text-opacity))
}

.text-\#e74c3c {
    --un-text-opacity: 1;
    color: rgb(231 76 60 / var(--un-text-opacity))
}

.text-\#ff4757 {
    --un-text-opacity: 1;
    color: rgb(255 71 87 / var(--un-text-opacity))
}

.text-\#ff48b3 {
    --un-text-opacity: 1;
    color: rgb(255 72 179 / var(--un-text-opacity))
}

.text-blue-500 {
    --un-text-opacity: 1;
    color: rgb(59 130 246 / var(--un-text-opacity))
}

.text-gray-500 {
    --un-text-opacity: 1;
    color: rgb(107 114 128 / var(--un-text-opacity))
}

.text-gray-600 {
    --un-text-opacity: 1;
    color: rgb(75 85 99 / var(--un-text-opacity))
}

.text-gray-700 {
    --un-text-opacity: 1;
    color: rgb(55 65 81 / var(--un-text-opacity))
}

.text-gray-800 {
    --un-text-opacity: 1;
    color: rgb(31 41 55 / var(--un-text-opacity))
}

.text-red-500 {
    --un-text-opacity: 1;
    color: rgb(239 68 68 / var(--un-text-opacity))
}

.text-white {
    --un-text-opacity: 1;
    color: rgb(255 255 255 / var(--un-text-opacity))
}

.font-500,.font-medium {
    font-weight: 500
}

.font-bold {
    font-weight: 700
}

.font-semibold {
    font-weight: 600
}

.leading-normal {
    line-height: 1.5
}

.font-pingfang {
    font-family: PingFang SC,-apple-system,BlinkMacSystemFont,Microsoft YaHei,sans-serif
}

.backdrop-filter {
    -webkit-backdrop-filter: var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);
    backdrop-filter: var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia)
}

.transition {
    transition-property: color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: .15s
}

.transition-all {
    transition-property: all;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: .15s
}

.duration-300 {
    transition-duration: .3s
}

.ease,.ease-in-out {
    transition-timing-function: cubic-bezier(.4,0,.2,1)
}

@media (min-width: 320px) {
    .xs\:mt-1 {
        margin-top:.25rem
    }

    .xs\:mt-5 {
        margin-top: 1.25rem
    }

    .xs\:h-45px {
        height: 45px
    }

    .xs\:max-w-300px {
        max-width: 300px
    }

    .xs\:w-45px {
        width: 45px
    }

    .xs\:w-full {
        width: 100%
    }

    .xs\:flex-col {
        flex-direction: column
    }

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

    .xs\:bg-\#fff0 {
        --un-bg-opacity: 0;
        background-color: rgb(255 255 255 / var(--un-bg-opacity))
    }

    .xs\:py-0\.5 {
        padding-top: .125rem;
        padding-bottom: .125rem
    }

    .xs\:pb-5 {
        padding-bottom: 1.25rem
    }

    .xs\:pr-0 {
        padding-right: 0
    }

    .xs\:text-13px {
        font-size: 13px
    }

    .xs\:text-14px {
        font-size: 14px
    }

    .xs\:text-15px {
        font-size: 15px
    }

    .xs\:text-28px {
        font-size: 28px
    }
}

@media (min-width: 768px) {
    .md\:mt-10 {
        margin-top:2.5rem
    }

    .md\:mt-4 {
        margin-top: 1rem
    }

    .md\:h-80px {
        height: 80px
    }

    .md\:max-w-500px {
        max-width: 500px
    }

    .md\:w-1\/3 {
        width: 33.3333333333%
    }

    .md\:w-80px {
        width: 80px
    }

    .md\:flex-row {
        flex-direction: row
    }

    .md\:items-center {
        align-items: center
    }

    .md\:bg-\#fff0 {
        --un-bg-opacity: 0;
        background-color: rgb(255 255 255 / var(--un-bg-opacity))
    }

    .md\:py-1 {
        padding-top: .25rem;
        padding-bottom: .25rem
    }

    .md\:pb-5 {
        padding-bottom: 1.25rem
    }

    .md\:pr-5 {
        padding-right: 1.25rem
    }

    .md\:text-16px {
        font-size: 16px
    }

    .md\:text-18px {
        font-size: 18px
    }

    .md\:text-20px {
        font-size: 20px
    }

    .md\:text-48px {
        font-size: 48px
    }

    .md\:text-base {
        font-size: 18px;
        line-height: 26px
    }
}