/**
 * /style.css
 * app.sysvoo.com 手机统一入口样式
 */
:root{
    --app-bg:#f2f6fc;
    --app-card:#fff;
    --app-text:#10203a;
    --app-muted:#77859a;
    --app-line:#dfe6f1;
    --app-blue:#356ff3;
    --app-green:#168650
}
*{box-sizing:border-box}
html{
    min-height:100%;
    background:var(--app-bg);
    -webkit-text-size-adjust:100%
}
body{
    min-height:100vh;
    min-height:100dvh;
    margin:0;
    padding:
        max(16px,env(safe-area-inset-top))
        max(14px,env(safe-area-inset-right))
        max(20px,env(safe-area-inset-bottom))
        max(14px,env(safe-area-inset-left));
    background:
        radial-gradient(
            circle at top right,
            rgba(53,111,243,.14),
            transparent 33%
        ),
        var(--app-bg);
    color:var(--app-text);
    font-family:
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        "Microsoft YaHei",
        sans-serif
}
button,a{-webkit-tap-highlight-color:transparent}
.launch-shell{
    display:grid;
    width:min(520px,100%);
    min-height:calc(100dvh - 48px);
    margin:0 auto;
    align-content:center;
    gap:12px
}
.launch-brand-card,
.launch-footer-card{
    border:1px solid var(--app-line);
    background:var(--app-card);
    box-shadow:0 16px 50px rgba(30,52,90,.08)
}
.launch-brand-card{
    padding:24px 20px 20px;
    border-radius:24px
}
.launch-topline{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px
}
.launch-brand{
    color:var(--app-blue);
    font-size:10px;
    font-weight:900;
    letter-spacing:.15em
}
.launch-version{
    padding:5px 8px;
    border-radius:999px;
    background:#f4f7fc;
    color:#8090a7;
    font-size:9px;
    font-weight:800
}
.launch-logo{
    display:grid;
    width:64px;
    height:64px;
    margin:28px auto 16px;
    place-items:center;
    border-radius:19px;
    background:linear-gradient(145deg,#2f67ec,#5a8afa);
    color:#fff;
    box-shadow:0 12px 30px rgba(53,111,243,.28);
    font-size:31px;
    font-weight:950
}
h1{
    margin:0;
    text-align:center;
    font-size:25px;
    letter-spacing:-.02em
}
.launch-subtitle{
    margin:7px 0 0;
    color:var(--app-muted);
    text-align:center;
    font-size:12px
}
.launch-progress{
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:11px;
    align-items:center;
    margin-top:24px;
    padding:13px;
    border-radius:15px;
    background:#f7f9fd
}
.launch-spinner{
    width:28px;
    height:28px;
    border:3px solid #dce6fb;
    border-top-color:var(--app-blue);
    border-radius:50%;
    animation:app-spin .8s linear infinite
}
.launch-progress div{
    display:grid;
    gap:3px
}
.launch-progress strong{font-size:12px}
.launch-progress small{
    color:var(--app-muted);
    font-size:9px;
    line-height:1.55
}
.launch-primary{
    display:flex;
    min-height:48px;
    margin-top:13px;
    align-items:center;
    justify-content:center;
    border-radius:13px;
    background:var(--app-blue);
    color:#fff;
    text-decoration:none;
    box-shadow:0 10px 24px rgba(53,111,243,.22);
    font-size:13px;
    font-weight:900
}
.launch-primary:active{transform:translateY(1px)}
.launch-security{
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:8px;
    align-items:start;
    margin-top:14px;
    padding-top:14px;
    border-top:1px solid #edf1f6
}
.launch-security>span{
    display:grid;
    width:22px;
    height:22px;
    place-items:center;
    border-radius:50%;
    background:#eaf8f0;
    color:var(--app-green);
    font-size:11px;
    font-weight:900
}
.launch-security p{
    margin:0;
    color:#718096;
    font-size:9px;
    line-height:1.65
}
.launch-security strong{color:#4a5c77}
.launch-error{
    margin-top:22px;
    padding:13px;
    border:1px solid #f1c6c3;
    border-radius:12px;
    background:#fff4f3;
    color:#a63831;
    font-size:11px;
    line-height:1.65
}
.launch-footer-card{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    overflow:hidden;
    border-radius:18px
}
.launch-footer-card div{
    display:grid;
    min-width:0;
    gap:3px;
    padding:12px 9px;
    text-align:center
}
.launch-footer-card div+div{
    border-left:1px solid #edf1f6
}
.launch-footer-card span{
    color:#8a96a9;
    font-size:8px
}
.launch-footer-card strong{
    overflow:hidden;
    color:#52627b;
    font-size:8px;
    text-overflow:ellipsis;
    white-space:nowrap
}
@keyframes app-spin{
    to{transform:rotate(360deg)}
}
@media(max-width:390px){
    body{
        padding-left:10px;
        padding-right:10px
    }
    .launch-brand-card{
        padding:20px 16px 17px;
        border-radius:20px
    }
    .launch-footer-card{
        grid-template-columns:1fr
    }
    .launch-footer-card div+div{
        border-top:1px solid #edf1f6;
        border-left:0
    }
    .launch-footer-card div{
        grid-template-columns:auto minmax(0,1fr);
        text-align:left
    }
    .launch-footer-card strong{
        text-align:right
    }
}