html {
    font-size: calc(min(100vw, 540px)/10)
}

html, body, h1, h2, h3, h4, h5, h6, div, dl, dt, dd, ul, ol, li, p, blockquote, pre, hr, figure, table, caption, th, td, form, fieldset, legend, input, button, textarea, menu {
    margin: 0;
    padding: 0;
}

html,
body {
    min-height: 100%;
    background: #fff
}

body {
    font: 12px/1.14 Arial, "宋体";
    color: #333;
    -webkit-user-select: none;
    user-select: none
}
body, textarea, input, button, select, keygen, legend {
    font: .32rem / 1.14 arial, 宋体;
    color: #333;
    outline: 0;
}

button,
a {
    cursor: pointer
}
li {
    list-style: none;
}
img {
    vertical-align: top;
}
.app-detail {
    max-width: 11.04rem;
    margin: 0 auto;
    padding: .64rem .64rem 0;
    background: #fff;
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto;
    color: #1c1c1e;
    overflow: hidden;
}

.app-detail .eta {
    padding: .42667rem !important;
    margin: 0 -.64rem;
}
.eta {
    background-color: #eee;
    padding: .186667rem;
    color: #a9a9a9;
}
.eta>p {
    font-size: .266667rem;
    line-height: 1.5;
}
.eta>p:nth-of-type(2) {
    text-indent: .533333rem;
}
.eta>p {
    font-size: .266667rem;
    line-height: 1.5;
}

.app-header {
    padding: 0 0 .42667rem;
    border-bottom: .01333rem solid #e5e5e5
}

.app-basic-info {
    display: flex;
    gap: .42667rem;
    position: relative;
    height: 3.04rem
}

.app-icon {
    width: 3.04rem;
    height: 3.04rem;
    border-radius: .58667rem;
    box-shadow: 0 .05333rem .21333rem #0000001a;
    flex-shrink: 0;
    object-fit: cover
}

.app-title {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    position: relative;
    max-width: calc(100% - 3.46667rem)
}

.app-title h1 {
    font-size: .58667rem;
    font-weight: 600;
    line-height: 1.2;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%
}

.subtitle {
    color: #86868b;
    margin: 0;
    font-size: .4rem;
    line-height: 1.4;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%
}

.action-buttons {
    position: absolute;
    top: 2.08rem;
    left: 0;
    gap: .32rem;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
}
.action-buttons, .install-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.install-btn {
        background: #007aff;
    color: #fff;
    border: none;
    border-radius: .58667rem;
    padding: 0 .64rem;
    font-size: .4rem;
    font-weight: 600;
    height: .96rem;
    min-width: 1.92rem;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    letter-spacing: .05333rem;
    font-family: -apple-system, BlinkMacSystemFont, SF Pro Text, Helvetica Neue, sans-serif;
}


/* .install-btn:disabled {
    background: #f2f2f7;
    color: #8e8e93
} */

.install-btn.progress {
    background: #fff;
    color: #8e8e93;
    justify-content: start;
    padding: 0
}

.install-loader {
    position: relative;
    display: block;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    width: .96rem;
    height: .96rem
}

.install-loader-ring,
.install-loader-arc {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    border-radius: 50%
}

.install-loader-ring {
    border: .05333rem solid #e5e5ea
}

.install-loader-arc {
    border: .05333rem solid transparent;
    border-top-color: #0a84ff;
    -webkit-animation: install-loader-spin 9.9s linear infinite;
    animation: install-loader-spin 9.9s linear infinite
}

.install-loader-core {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: .32rem;
    height: .32rem;
    margin: -.16rem 0 0 -.16rem;
    border-radius: .08rem;
    background: #0a84ff
}

.install-countdown {
    font-size: .32rem;
    letter-spacing: 0
}

@-webkit-keyframes install-loader-spin {
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes install-loader-spin {
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

.ask-btn {
    width: .96rem;
    height: .96rem;
    padding: 0;
    background: none;
    border: none;
    color: #007aff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.ask-icon {
    width: .96rem;
    height: .96rem;
    background: url("./image/问号.png") center/contain no-repeat;
    background-size: contain;
    background-repeat: no-repeat;
}

.app-stats {
    display: flex;
    justify-content: space-between;
    margin: .42667rem -.21333rem 0;
    padding: 0 .21333rem
}

.stat-item {
    text-align: center;
    flex: 1;
    position: relative
}

.stat-item:not(:last-child):after {
    content: "";
    position: absolute;
    right: 0;
    top: 15%;
    width: .02667rem;
    height: 70%;
    background: #e5e5e5
}

.stat-desc {
    color: #a7a7a9;
    font-size: .32rem;
    margin-bottom: .10667rem
}

.stat-value {
    font-size: .53333rem;
    font-weight: 600;
    margin-bottom: .10667rem;
    color: #8e8e92
}

.stat-value .rank-i {
    font-size: .42667rem;
    vertical-align: top
}

.stat-label {
    color: #8f8f93;
    font-size: .34667rem
}

.enterprise-tips {
    font-size: .32rem;
    color: red;
    line-height: 1.5;
    margin: .42667rem 0 0
}

.enterprise-tips button {
    border: none;
    background: none;
    color: #007aff;
    font-size: .32rem;
    padding: 0;
    margin-left: .05rem
}

.app-description {
    margin-top: .93333rem;
    border-top: .02667rem solid #e5e5e5;
    border-bottom: .02667rem solid #e5e5e5;
    font-size: .4rem;
    line-height: 1.5;
    padding: .53333rem 0;
    color: #1c1c1e
}

.reviews-section {
    padding-top: .64rem;
    border-top: .02667rem solid #e5e5e5
}

.section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: .42667rem
}

.section-header h2,
.app-info h2 {
    font-size: .53333rem;
    font-weight: 600;
    margin: 0
}

.see-all {
    color: #007aff;
    text-decoration: none;
    font-size: .4rem
}

.rating-summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 0 .64rem
}

.rating {
    font-size: 1.70667rem;
    font-weight: 600;
    color: #1c1c1e
}

.rating-right {
    text-align: right
}

.rating-right .rating-stars {
    color: #1c1c1e;
    font-size: .66667rem;
    font-weight: 600;
    margin-bottom: .10667rem;
    letter-spacing: .05333rem;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", sans-serif
}

.rating-right .rating-count {
    color: #8e8e92;
    font-size: .4rem;
    letter-spacing: .02667rem;
    font-weight: 600
}

.review-title {
    font-size: .4rem;
    font-weight: 600;
    color: #1c1c1e;
    margin: 0 0 .42667rem
}

.review-item {
    background: #fff;
    padding: .42667rem;
    border-radius: .4rem;
    margin: 0 0 .32rem;
    box-shadow: 0 .16rem .32rem #00000038
}

.review-header {
    margin-bottom: .21333rem;
}
.review-header h4 {
    font-size: .4rem;
    font-weight: 600;
    margin: 0 0 .32rem;
    color: #1c1c1e
}

.review-meta {
    display: flex;
    align-items: center;
    gap: .21333rem
}

.review-stars {
    color: #1c1c1e;
    font-size: .4rem;
    letter-spacing: .05333rem
}

.review-date {
    color: #8e8e92;
    font-size: .4rem
}

.review-content {
    font-size: .4rem;
    line-height: 1.5;
    margin: 0;
    color: #8e8e92
}

.whats-new,
.app-info {
    padding-top: .64rem
}

.whats-new .version-info {
    display: flex;
    justify-content: space-between;
    margin-bottom: .42667rem
}

.whats-new .update-date,
.whats-new .version {
    color: #86868b;
    font-size: .4rem
}

.app-info h2 {
    margin: 0 0 .53333rem
}

.info-list {
    display: flex;
    flex-direction: column
}

.info-item {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    padding: .32rem 0;
    border-bottom: .02667rem solid #e5e5e5;
    font-size: .4rem;
    gap: .32rem
}

.info-item:last-child {
    border-bottom: none
}

.info-item .label {
    color: #86868b
}

.info-item .value {
    display: flex;
    align-items: center;
    text-align: right;
    color: #1c1c1e
}

.info-header {
    justify-content: space-between;
    width: 100%;
    display: flex;
    align-items: center
}

.expanded-content {
    display: none;
    padding-top: .32rem;
    color: #1c1c1e;
    font-size: .4rem;
    line-height: 1.5
}

.expandable.expanded {
    flex-wrap: wrap
}

.expandable.expanded .expanded-content {
    display: block;
    width: 100%
}

.privacy-icon {
    display: block;
    width: .53333rem;
    height: .53333rem;
    background: url("./image/隐私.png") center/contain no-repeat
}

.arrow-icon {
    display: inline-block;
    width: .53333rem;
    height: .53333rem;
    margin-left: .10667rem;
    background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='%238e8e93' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
    transition: transform .2s
}

.expanded .arrow-icon {
    transform: rotate(180deg)
}

.disclaimer {
    background: #eee;
    color: #a9a9a9;
    font-size: .32rem;
    line-height: 1.5;
    margin: 0 -.64rem;
    padding: .42667rem
}

.disclaimer p {
    margin: 0
}

.disclaimer p+p {
    text-indent: .53333rem
}

.bottom-actions {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: .85333rem
}

.action-btn {
    padding: .32rem 0;
    background: none;
    border: none;
    border-top: .02667rem solid #e5e5e5;
    color: #007aff;
    text-align: center;
    font-size: .4rem;
    cursor: pointer
}

.action-btn:first-child {
    border-top: none
}
.otherBrowser {
    padding-top: 2.2rem;
    background: #000000e6;
}
.otherBrowser .texts {
    line-height: 1rem;
    text-align: center;
    color: #fff;
    font-size: .42rem;
}
.otherBrowser .point-to-top {
    background-size: contain;
    width: 2rem;
    height: 2.8rem;
    position: absolute;
    top: .2rem;
    left: 4.9rem;
    z-index: 9;
}
.otherBrowser .point-to-bottom {
    background-size: contain;
    width: 2rem;
    height: 3rem;
    position: absolute;
    top: 7.3rem;
    left: 3.4rem;
    z-index: 9;
}
.otherBrowser .showBottom {
    width: 92%;
    position: fixed;
    left: 0;
    right: 0;
    margin: auto;
    top: 9.8rem;
}
.popup{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    background-color: #000000bf
}

.popup-img{
    width: 90%;
    max-width: 10.66667rem;
    border-radius: .26667rem
}

.popup-content{
    background: #fff;
    padding: .42667rem;
    border-radius: .21333rem;
    text-align: center
}

.popup-content button{
    margin-top: .32rem
}

.download-animation{
    text-align: center;
    color: #fff
}

.download-animation img{
    width: 2.66667rem;
    height: 2.66667rem
}

.popup.installationGuide{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    background-color: #000c;
    display: flex;
    justify-content: center;
    align-items: center
}
.browser-mask {
    position: fixed;
    inset: 0;
    z-index: 20;
    background: #000000e6
}

.browser-mask[hidden],
.modal-backdrop[hidden] {
    display: none
}

.browser-mask-inner {
    position: relative;
    width: 100%;
    max-width: 10rem;
    height: 100%;
    margin: 0 auto;
    padding-top: 2rem;
    background: transparent
}

.mask-text {
    line-height: 1rem;
    text-align: center;
    color: #fff;
    font-size: .42rem;
}

.mask-text li:nth-child(1),
.mask-text li:nth-child(3) {
    color: #ffc0a1;
    font-size: .48rem;
    margin-top: .6rem;
}

.point-to-top {
    position: absolute;
    z-index: 1;
    top: .12rem;
    left: .35rem;
    width: 1.76rem;
    height: 2.77333rem;
    object-fit: contain
}

.point-to-bottom {
    position: absolute;
    z-index: 1;
    left: .35rem;
    top: 5.2rem;
    width: .93333rem;
    height: 2.16rem;
    object-fit: contain
}

.show-bottom {
    position: absolute;
    z-index: 1;
    left: 0;
    right: 0;
    bottom: .32rem;
    width: 100%;
    height: auto;
    border-radius: .2rem
}

.mask-close {
    position: absolute;
    z-index: 4;
    right: .12rem;
    top: .12rem;
    border: none;
    background: none;
    color: #fff;
    font-size: .75rem;
    line-height: 1
}

.modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 30;
    background: #00000099;
    display: grid;
    place-items: center;
    padding: .64rem
}

.modal-card {
    position: relative;
    background: #fff;
    border-radius: .4rem;
    max-width: 8.4rem;
    width: 100%;
    padding: .64rem;
    box-shadow: 0 .42667rem 1rem #0004
}

.modal-close {
    position: absolute;
    right: .25rem;
    top: .15rem;
    border: 0;
    background: none;
    font-size: .6rem;
    color: #8e8e93
}

.modal-card h3 {
    margin: 0 0 .32rem;
    font-size: .53333rem
}

.modal-card p {
    font-size: .4rem;
    line-height: 1.6;
    margin: 0 0 .32rem
}

.modal-card .modal-ok {
    display: block;
    margin: .48rem auto 0;
    min-width: 3rem;
    padding: .24rem .48rem;
    border: 0;
    border-radius: .53rem;
    background: #007aff;
    color: #fff;
    font-size: .4rem
}

.trust-dialog-backdrop {
    background: #00000080;
    bottom: 0;
    left: 0;
    overflow: auto;
    padding: .42667rem;
    position: fixed;
    right: 0;
    top: 0;
    display: flex;
    justify-content: start;
}

.trust-dialog {
    display: block;
    max-width: calc(100vw - .64rem);
    padding: .32rem;
    border-radius: .10667rem;
    box-shadow: 0 .32rem .85333rem #0000000a, 0 .21333rem .53333rem #00000014
}

.trust-dialog .modal-close {
    display: none
}

.trust-dialog #modalContent {
    padding: 0
}

.trust-dialog-message {
    padding-top: .3rem;
    color: #606266;
    font: .37333rem/.64rem Arial, "宋体"
}

.trust-dialog-message span {
    color: red
}

.trust-dialog-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-top: .32rem
}

.trust-dialog-actions button {
    display: flex;
    align-items: center;
    justify-content: center;
    font: 500 .37333rem/.37333rem Arial, "宋体";
    padding: .21333rem .4rem;
    border-radius: .10667rem
}

.trust-cancel {
    color: #606266;
    background: #fff;
    border: 1px solid #dcdfe6;
    border-color: #dcdfe6
}

.trust-confirm {
    margin-left: .32rem;
    color: #fff;
    background: #409eff;
    border: 1px solid #409eff;
}

.trust-confirm:focus {
    outline: none;
    box-shadow: 0 0 0 .04rem #a0cfff
}

@media screen and (-ms-high-contrast:active),
(-ms-high-contrast:none) {
    button {
        font-family: Arial, "宋体"
    }
}

.go-to-trust{
    color: #017afe;
    float: right;
}

.suceess-button-tips.finished .contain {
    width: 90%;
}
.suceess-button-tips .contain {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: .2rem;
    width: 70%;
    text-align: center;
    padding: .8rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.suceess-button-tips .contain p {
    font-weight: bolder;
    font-size: 12px;
}
