html,
body {
    margin: 0;
    font-size: 15px;
    font-family: "HarmonyOS Sans SC", "MiSans", "PingFang SC", "Microsoft YaHei", sans-serif;
    line-height: 1.6;
    color: var(--theme-color);
    background:
        radial-gradient(circle at 18% -8%, rgba(255, 194, 94, .18), transparent 32%),
        radial-gradient(circle at 82% 4%, rgba(60, 113, 255, .1), transparent 28%),
        linear-gradient(180deg, #f7f8fb 0%, var(--theme-background) 46%, #f4f6fa 100%);
    word-wrap: break-word;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(30, 118, 113, .08) 1.58%, rgba(0, 169, 159, .13) 100%),
        radial-gradient(circle at 16% 14%, rgba(0, 169, 159, .16), transparent 28%),
        radial-gradient(circle at 82% 8%, rgba(255, 255, 255, .72), transparent 26%);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    outline: none !important;
}

.headBg {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    opacity: .12;
    background-repeat: repeat-x;
    background-size: 100% auto;
    mix-blend-mode: soft-light;
}

form,
input,
textarea {
    border: 0;
    outline: 0;
}

input,
button,
textarea,
select {
    border: 0;
    outline: 0;
    resize: none;
}

a {
    color: inherit;
    text-decoration: inherit;
    cursor: pointer;
}

a:hover {
    color: var(--theme-theme);
}

[v-cloak] {
    display: none;
}

#app {
    position: relative;
    z-index: 9;
}

/* 前台视觉重构变量：只服务 index/news 前台模板，不改变业务数据和交互逻辑。 */
:root {
    --mx-theme: #1e7671;
    --mx-theme-strong: #00a99f;
    --mx-theme-soft: rgba(35, 123, 118, .1);
    --mx-theme-line: rgba(35, 123, 118, .12);
    --mx-page: #f3f8f7;
    --mx-card: rgba(255, 255, 255, .9);
    --mx-soft: rgba(35, 123, 118, .07);
    --mx-line: rgba(30, 118, 113, .1);
    --mx-text: #143432;
    --mx-muted: #6f8583;
    --mx-accent: #1e7671;
    --mx-orange: #ff7a1a;
    --mx-shadow: 0 18px 44px rgba(30, 118, 113, .1);
    --mx-radius: 18px;
}


/* 导航栏 */
.headerBox {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 72px;
    z-index: 99;
}

.headerKox {
    height: 72px;
}

.headerBox .bg {
    position: absolute;
    inset: 0;
    border-bottom: 1px solid rgba(30, 41, 59, .06);
    box-shadow: 0 10px 30px rgba(30, 41, 59, .06);
    background: rgba(255, 255, 255, .9);
    backdrop-filter: blur(16px);
    transition: opacity .2s;
}

.headerBox .box {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: auto;
    height: 100%;
    overflow: visible;
    width: 1200px;
}

.headerBox .box .logoBox {
    display: inline-flex;
    align-items: center;
    transition: opacity .2s;
}

.headerBox .box .logoBox .logo {
    height: 42px;
    border-radius: 12px;
}

.headerBox .box .logoBox .title {
    margin-left: 12px;
    color: var(--mx-text);
    font-size: 20px;
    font-weight: 900;
    letter-spacing: 0;
}

.headerBox .box .navs {
    display: inline-flex;
    align-items: center;
}

.headerBox .box .navs .iconfont {
    display: none;
}

.headerBox .box .navs .item,
.headerBox .box .navs a {
    padding: 7px 12px;
    margin-left: 10px;
    border-radius: 999px;
    color: #5e6a7e;
    background: rgba(255, 255, 255, .45);
    cursor: pointer;
    white-space: nowrap;
    transition: background-color .2s ease, color .2s ease, transform .2s ease;
}

.headerBox .box .navs .item:hover {
    background: rgba(37, 99, 255, .08);
    color: var(--theme-theme);
    transform: translateY(-1px);
}


.headerBox .box .search {
    position: relative;
    flex: 1;
    height: 44px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    max-width: 400px;
    margin: 0 15px 0 auto;
    background: #eef1f6;
    border: 1px solid rgba(30, 41, 59, .05);
}

.headerBox .box .search:after {
    display: none;
}

.headerBox .box .search input {
    position: relative;
    z-index: 9;
    flex: 1;
    height: 100%;
    border-radius: 54px;
    border: none;
    font-size: 15px;
    box-sizing: border-box;
    padding-left: 24px;
    color: var(--mx-text);
    background-color: transparent;
}

.headerBox .box .search .btn {
    position: relative;
    z-index: 9;
    width: 64px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.headerBox .box .search .btn .iconfont {
    font-size: 22px;
    font-weight: bold;
    color: var(--theme-theme);
}


/* 首页 */
.homeBox {
    width: 1200px;
    margin: 0 auto;
    min-height: calc(100vh - 180px);
    text-align: center;
    padding-top: 42px;
}

.homeBox .box {
    position: relative;
    z-index: 20;
    width: 720px;
    margin: auto;
}

.homeBox .logoBox {
    display: inline-flex;
    align-items: center;
}

.homeBox .logoBox .logo {
    height: 64px;
    margin: 0 8px;
    border-radius: 18px;
}

.homeBox .logoBox .title {
    margin: 0 8px;
    color: var(--mx-text);
    font-size: 32px;
    font-weight: 900;
    letter-spacing: 0;
}

.homeBox .subTitle {
    padding: 8px 0 4px;
    color: var(--mx-muted);
    opacity: 1;
}

.searchBox .search {
    position: relative;
    margin: auto;
    margin-top: 22px;
    background: rgba(255, 255, 255, .78);
    border: 1px solid rgba(30, 41, 59, .06);
    box-shadow: 0 14px 34px rgba(30, 41, 59, .08);
    width: 100%;
    height: 56px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    backdrop-filter: blur(14px);
}

.searchBox .search:focus-within {
    border-color: rgba(30, 118, 113, .24);
    box-shadow: 0 16px 38px rgba(30, 118, 113, .14);
}

.searchBox .search input {
    flex: 1;
    height: 100%;
    border-radius: 999px;
    border: none;
    font-size: 16px;
    box-sizing: border-box;
    padding-left: 24px;
    color: var(--mx-text);
    background-color: transparent;
}

.searchBox .search .btn {
    width: 64px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.searchBox .search .btn .iconfont {
    font-size: 24px;
    font-weight: bold;
    color: var(--theme-theme);
}

.footerBox {
    padding: 34px 15px 24px;
}


.footerBox .box {
    text-align: center;
    margin: auto;
    height: 100%;
    overflow: hidden;
    width: 1200px;
}

.footerBox .box p {
    color: var(--mx-muted);
    opacity: 1;
    padding: 4px 0;
}

.home {
    margin-top: 78px;
    text-align: left;
}

.home .block {
    border-radius: 12px;
    background-color: var(--theme-other_background);
    /*box-shadow: 0 4px 10px rgba(225, 225, 225, 0.3);*/
    margin-bottom: 20px;
    padding-top: 20px;
}

/*.home .block:last-child{*/
/*    margin-bottom: 0;*/
/*}*/

.home .nav {
    position: relative;
    font-size: 18px;
    font-weight: bold;
    color: var(--theme-color);
    padding: 0 20px 4px;
    display: flex;
    align-items: center;
}

.home .nav img {
    width: 24px;
    height: 24px;
    margin-right: 12px;
}

.home .content {
    min-height: 200px;
}


.home .content .list {
    display: flex;
    flex-wrap: wrap;
    padding: 0 0 10px 15px;
}

.home .content .list .item {
    position: relative;
    display: block;
    width: 130.8px;
    margin: 8px;
    border-radius: 8px 8px 0 0;
    overflow: hidden;
    text-align: center;
    padding: 2px 0;
    transition: all .5s;
}

.home .content .list .item:hover {
    transform: translateY(-5px);
}

.home .content .list .item p {
    margin-top: 10px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.home .content .list .item .img {
    position: relative;
    width: 100%;
    height: 192px;
    border-radius: 8px;
    overflow: hidden;
    background: #f5f5f5;
}

.home .content .list .item .img img {
    position: relative;
    z-index: 9;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home .content .list .item .img span {
    position: absolute;
    inset: 0;
    font-size: 12px;
    color: #ccc;
    display: flex;
    align-items: center;
    justify-content: center;
}

.home .content .list .item .img .titleLoading {
    font-size: 16px;
    padding: 0 3%;
    word-break: break-all;
}


.home.homeNO {
    display: flex;
    flex-wrap: wrap;
}

.home.homeNO .block {
    margin: 0 6px 12px;
    width: calc(20% - 12px);
}

.home.homeNO .content .list {
    padding: 10px;
}

.home.homeNO .content .list .item {
    width: 100%;
    margin: 0;
    border-radius: 0;
    text-align: left;
    max-width: 282px;
}

.home.homeNO .content .list .item p {
    margin-top: 0;
    padding: 4px 6px;
}

.home.homeNO .content .list .item:hover {
    transform: translateY(0);
}

.home.homeNO .content .list .item p span {
    color: #c4c7ce;
    margin-right: 6px;
}

.home.homeNO .content .list .item:nth-child(1) p span {
    color: #FE2D46;
}

.home.homeNO .content .list .item:nth-child(2) p span {
    color: #FF6600;
}

.home.homeNO .content .list .item:nth-child(3) p span {
    color: #FAA90E;
}

.homeRank {
    display: block;
    position: relative;
    z-index: 1;
    margin-top: 40px;
}

.homeRank .rankBlock {
    margin-bottom: 24px;
    padding: 22px;
    border: 1px solid rgba(30, 118, 113, .08);
    border-radius: 24px;
    color: var(--mx-text);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .92) 0%, rgba(247, 252, 251, .88) 100%),
        linear-gradient(180deg, rgba(30, 118, 113, .08) 0%, rgba(0, 169, 159, .08) 100%);
    box-shadow: 0 18px 46px rgba(30, 118, 113, .1);
    backdrop-filter: blur(12px);
}

.homeRank .rankHead {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 0 14px;
}

.homeRank .rankTitle {
    display: flex;
    align-items: center;
    min-width: 0;
    color: var(--mx-text);
    font-size: 20px;
    font-weight: 900;
}

.homeRank .rankTitle img {
    flex: none;
    width: 26px;
    height: 26px;
    margin-right: 9px;
    border-radius: 9px;
    object-fit: cover;
}

.homeRank .rankSub {
    flex: none;
    color: var(--mx-theme);
    font-size: 12px;
    padding: 6px 14px;
    border-radius: 999px;
    background: rgba(35, 123, 118, .08);
}

.homeRank .rankList {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 22px 20px;
}

.homeRank .rankItem {
    position: relative;
    display: block;
    min-width: 0;
    min-height: 0;
    padding: 0;
    border-radius: 18px;
    background: transparent;
    transition: transform .22s ease, color .22s ease;
}

.homeRank .rankItem:hover {
    color: var(--mx-text);
    background: transparent;
    transform: translateY(-4px);
}

.homeRank .rankPoster {
    position: relative;
    width: 100%;
    aspect-ratio: 3 / 4.15;
    border-radius: 14px;
    overflow: hidden;
    background:
        linear-gradient(145deg, rgba(30, 118, 113, .12), rgba(0, 169, 159, .1)),
        #e6f1ef;
    box-shadow: 0 12px 28px rgba(30, 118, 113, .12);
}

.homeRank .rankPoster img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform .35s ease;
}

.homeRank .rankItem:hover .rankPoster img {
    transform: scale(1.035);
}

.homeRank .posterText {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 8px;
    color: #667085;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
    text-align: center;
}

.homeRank .rankNo {
    position: absolute;
    left: 0;
    top: 0;
    min-width: 28px;
    height: 26px;
    padding: 0 6px;
    border-radius: 0 0 11px 0;
    color: #fff;
    background: rgba(30, 41, 59, .82);
    font-size: 12px;
    font-weight: 800;
    line-height: 24px;
    text-align: center;
}

.homeRank .rankItem:nth-child(1) .rankNo {
    background: #ff4d35;
}

.homeRank .rankItem:nth-child(2) .rankNo {
    background: #ff7a1a;
}

.homeRank .rankItem:nth-child(3) .rankNo {
    background: #f2b51d;
}

.homeRank .rankBadge {
    position: absolute;
    right: 7px;
    top: 7px;
    min-width: 28px;
    height: 20px;
    padding: 0 7px;
    border-radius: 999px;
    color: #fff;
    background: rgba(255, 77, 53, .92);
    font-size: 12px;
    font-weight: 700;
    line-height: 20px;
}

.homeRank .rankInfo {
    min-width: 0;
    padding-top: 9px;
}

.homeRank .rankName {
    overflow: hidden;
    color: var(--mx-text);
    font-size: 15px;
    font-weight: 900;
    line-height: 1.25;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.homeRank .rankMeta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    min-height: 0;
    margin-top: 7px;
}

.homeRank .hotPill,
.homeRank .scorePill {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    height: 21px;
    padding: 0 7px;
    border-radius: 999px;
    color: #1e7671;
    background: rgba(35, 123, 118, .1);
    border: 1px solid rgba(35, 123, 118, .07);
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}

.homeRank .hotPill::before {
    content: "\ebb1";
    margin-right: 4px;
    font-family: "iconfont";
    font-size: 12px;
    font-weight: normal;
}

.homeRank .scorePill {
    color: #d96b12;
    background: rgba(255, 122, 26, .1);
    border-color: rgba(255, 122, 26, .12);
}

.homeRank .rankDesc,
.homeRank .rankCast {
    overflow: hidden;
    color: var(--mx-muted);
    line-height: 1.35;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.homeRank .rankDesc {
    margin-top: 6px;
    font-size: 12px;
}

.homeRank .rankCast {
    display: none;
    margin-top: 2px;
    font-size: 12px;
}

.homeRank .rankBlockSimple {
    color: var(--theme-color);
    background: rgba(255, 255, 255, .9);
    box-shadow: var(--mx-shadow);
}

.homeRank .rankBlockSimple .rankList {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.homeRank .rankBlockSimple .rankTitle,
.homeRank .rankBlockSimple .rankName {
    color: var(--theme-color);
}

.homeRank .rankBlockSimple .rankSub,
.homeRank .rankBlockSimple .rankDate {
    color: #999;
}

.homeRank .rankList.simple {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px 14px;
}

.homeRank .rankItem.simple {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 8px;
    min-height: 0;
}

.homeRank .rankItem.simple:hover {
    color: var(--theme-theme);
    background: rgba(0, 0, 0, .04);
}

.homeRank .rankItem.simple .rankNo {
    position: static;
    flex: none;
    min-width: 22px;
    border-radius: 5px;
}

.homeRank .rankItem.simple .rankName {
    overflow: hidden;
    flex: 1;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.homeRank .rankDate {
    flex: none;
    font-size: 12px;
}


.el-dialog {
    background-color: var(--theme-other_background);
}

.layerBox .vname {
    font-size: 20px;
    font-weight: bold;
    text-align: center;
}

.layerBox .vbtn {
    background-color: var(--theme-theme);
    color: var(--theme-other_background);
    height: 40px;
    line-height: 40px;
    text-align: center;
    margin-top: 15px;
    border-radius: 8px;
    cursor: pointer;
}

.layerBox .el-textarea textarea {
    background-color: #f7f7f7;
    border-radius: 8px;
    width: 100%;
    height: 240px;
    margin: 15px auto 0;
    padding: 15px;
    box-sizing: border-box;
    box-shadow: none;
}

.layerBox .el-textarea__inner:focus {
    box-shadow: none;
}



.listBox {
    width: 1200px;
    margin: 8px auto 0;
    min-height: calc(100vh - 180px);
    display: flex;
    gap: 20px;
}

.listBox h3 {
    position: relative;
    padding: 22px 0 14px;
    color: var(--mx-text);
    font-size: 20px;
    font-weight: 900;
}

.listBox h3:after {
    content: none;
    position: absolute;
    bottom: 20px;
    left: 0;
    width: 4px;
    background-color: var(--theme-theme);
    height: 18px;
}

.listBox h3 span {
    color: var(--theme-theme);
}

.listBox .nav {
    position: relative;
    font-size: 17px;
    font-weight: 900;
    color: var(--theme-color);
    padding: 20px 2px 12px;
    display: flex;
    align-items: center;
}

.listBox .nav img {
    width: 22px;
    height: 22px;
    margin-right: 12px;
}

.listBox .left {
    width: 0;
    flex: 1;
    overflow: hidden;
}

.listBox .left .list {
    padding: 0;

}

.listBox .left .list .item {
    position: relative;
    display: block;
    padding: 18px 18px;
    border: 1px solid rgba(30, 41, 59, .06);
    border-radius: 18px;
    background: rgba(255, 255, 255, .88);
    box-shadow: 0 12px 30px rgba(30, 41, 59, .06);
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.listBox .left .list .item + .item {
    margin-top: 12px;
}

.listBox .left .list .item:hover {
    border-color: rgba(37, 99, 255, .16);
    box-shadow: 0 18px 38px rgba(30, 41, 59, .09);
    transform: translateY(-2px);
}

.listBox .left .list .item .title {
    display: block;
    color: var(--mx-text);
    font-size: 18px;
    font-weight: 900;
    line-height: 1.45;
    padding-bottom: 7px;
}

.listBox .left .list .item .title p {
    color: var(--theme-color);
}

.listBox .left .list .item .title p span {
    color: var(--theme-theme);
}

.listBox .left .list .item .btns {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}

.listBox .left .list .item .btns .btn {
    position: relative;
    margin-right: 0;
    min-height: 34px;
    padding: 0 13px;
    border-radius: 999px;
    background: #f1f4f9;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    color: #4f5f75;
    transition: background-color .2s ease, color .2s ease, transform .2s ease;
}

.listBox .left .list .item .btns .btn:hover {
    color: #fff;
    background: var(--theme-theme);
    transform: translateY(-1px);
}

.listBox .left .list .item .btns .btn .iconfont {
    font-size: 18px;
    margin-right: 5px;
}

.listBox .left .list .item .btns .btn .icon {
    width: 20px;
    margin-right: 5px;
    flex: none;
}

.listBox .left .list .item .type {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    color: var(--mx-muted);
    flex: none;
    padding-left: 0;
    margin-top: 8px;
    font-size: 14px;
}

.listBox .left .list .item .type::after {
    content: none;
}

.listBox .left .list .item .type span {
    display: inline-flex;
    align-items: center;
    margin-right: 0;
    padding: 4px 10px;
    border-radius: 999px;
    background: #f4f6fa;
    color: #667085;
}

.listBox .left .list .item .type span span {
    color: #FF3F3D;
}

.listBox .left .list .item .type.time::after {
    content: none;
}

.listBox .left .list .item .type.cate::after {
    content: none;
}


.listBox .right {
    width: 300px;
    margin-left: 0;
}

.listBox .box {
    border: 1px solid rgba(30, 41, 59, .06);
    border-radius: 20px;
    background: rgba(255, 255, 255, .88);
    box-shadow: var(--mx-shadow);
    min-height: calc(100% - 71px);
    padding: 18px;
}

.listBox .right .box {
    height: auto;
    min-height: auto;
}

.listBox .right .list .item {
    width: 100%;
    margin: 0;
    border-radius: 0;
    text-align: left;
}

.listBox .right .list .item p {
    margin-top: 0;
    padding: 8px 6px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.listBox .right .list .item:hover {
    transform: translateY(0);
    color: var(--theme-theme);
}

.listBox .right .list .item p span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    margin-right: 8px;
    border-radius: 8px;
    color: #8a94a6;
    background: #eef1f6;
    font-size: 12px;
    font-weight: 800;
}

.listBox .right .list .item:nth-child(1) p span {
    color: #FE2D46;
}

.listBox .right .list .item:nth-child(2) p span {
    color: #FF6600;
}

.listBox .right .list .item:nth-child(3) p span {
    color: #FAA90E;
}


.listBox .screen {
    width: 132px;
    margin-right: 0;
}

.listBox .screen .fixed {
    position: fixed;
    width: 132px;
    z-index: 9;
}

.listBox .screen .box {
    height: auto;
    padding: 10px;
}

.listBox .screen .box a {
    display: block;
    padding: 9px 12px;
    border-radius: 999px;
    border-bottom: 0;
    color: #5e6a7e;
    transition: background-color .2s ease, color .2s ease;
}

.listBox .screen .box a:last-child {
    border-bottom: none;
}

.listBox .screen .box a.active {
    font-weight: bold;
    color: #fff;
    background: var(--theme-theme);
}


.listBox .details {
    padding: 28px 32px;
    min-height: inherit;
}

.detailIntro {
    display: flex;
    align-items: center;
    gap: 24px;
    margin-bottom: 18px;
}

.detailMain {
    min-width: 0;
    flex: 1;
}

.detailPills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-start;
}

.detailPills span {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 12px;
    border-radius: 999px;
    color: #526075;
    background: #f2f5fa;
    font-size: 14px;
}

.details .pic {
    width: 150px;
    height: 205px;
    border-radius: 16px;
    background-color: var(--theme-background);
    flex: none;
    margin: 0;
    overflow: hidden;
    box-shadow: 0 14px 34px rgba(30, 41, 59, .14);
}

.details .pic img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


.details .title {
    text-align: left;
    font-size: 26px;
    font-weight: 900;
    line-height: 1.3;
    margin-bottom: 14px;
    color: var(--mx-text);
}

.details .cat {
    display: flex;
    align-items: flex-start;
    font-size: 15px;
    padding: 12px 0;
    border-top: 1px solid rgba(30, 41, 59, .06);
}

.details .cat .l {
    flex: none;
    width: 92px;
    color: var(--mx-muted);
    opacity: 1;
}

.details .cat .r {
    opacity: 1;
    flex: 1;
    width: 0;
}

.details .cat .r a {
    color: var(--theme-theme);
    word-wrap: break-word;
    word-break: normal;
}

.details .cat .r .icon {
    width: 20px;
    height: 20px;
    vertical-align: middle;
    margin-right: 8px;
}

.details .cat .r span {
    vertical-align: middle;
}

.details .btns {
    display: flex;
    gap: 12px;
    margin-top: 22px;
    justify-content: center;
}

.details .btns .btn {
    position: relative;
    min-width: 132px;
    height: 42px;
    line-height: 42px;
    border-radius: 999px;
    background-color: #f1f4f9;
    margin: 0;
    font-size: 14px;
    color: #526075;
    text-align: center;
    opacity: 1;
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease, transform .2s ease;
}

.details .btns .btn .iconfont {
    font-size: 18px;
    margin-right: 5px;
    vertical-align: middle;
}

.details .btns .btn:after {
    content: none;
}

.details .btns .btn.btnCol {
    background-color: var(--theme-theme);
    color: var(--theme-other_background);
}

.details .btns .btn:hover {
    background-color: var(--theme-theme);
    color: var(--theme-other_background);
    transform: translateY(-1px);
}

.searchDetail {
    display: none;
}




.page {
    display: flex;
    padding: 20px 0 15px;
    justify-content: center;
}

.el-pagination.is-background .btn-next.is-disabled,
.el-pagination.is-background .btn-next:disabled,
.el-pagination.is-background .btn-prev.is-disabled,
.el-pagination.is-background .btn-prev:disabled,
.el-pagination.is-background .el-pager li.is-disabled,
.el-pagination.is-background .el-pager li:disabled {
    background-color: var(--theme-other_background);
    color: var(--theme-color);
}

.el-pagination.is-background .btn-next.is-active,
.el-pagination.is-background .btn-prev.is-active,
.el-pagination.is-background .el-pager li.is-active {
    background-color: var(--theme-theme);
    color: var(--theme-other_background);
}

.el-pager li.is-active,
.el-pager li:hover {
    color: var(--theme-theme);
}


.searchList {
    display: none;
}

.loader {
    margin: auto;
    width: fit-content;
    font-weight: bold;
    font-family: monospace;
    font-size: 24px;
    background: radial-gradient(circle closest-side, var(--theme-theme) 94%, #0000) right/calc(200% - 1em) 100%;
    animation: l24 1s infinite alternate linear;
}

.loader::before {
    content: " 全网检索中，请稍等...";
    line-height: 1em;
    color: #0000;
    background: inherit;
    background-image: radial-gradient(circle closest-side, #fff 94%, var(--theme-theme));
    -webkit-background-clip: text;
    background-clip: text;
}

@keyframes l24 {
    100% {
        background-position: left
    }
}


.listBox .Ebox {
    border: 1px solid rgba(30, 41, 59, .06);
    border-radius: 20px;
    background: rgba(255, 255, 255, .88);
    box-shadow: var(--mx-shadow);
    padding: 18px;
    margin-bottom: 15px;
}

.listBox .left .Ebox .list .item:last-child {
    border-bottom: none;
}

.Qtips {
    text-align: center;
    font-size: 14px;
    color: #999;
}

.Qbtn {
    text-align: center;
    padding: 4px 0 12px;
}

.Qbtn .btn {
    display: inline-block;
    color: var(--mx-muted);
    cursor: pointer;
}



/*//相关资源*/
.listBox .details.samelistBox {
    padding: 18px;
}

.samelist {
    display: flex;
    flex-wrap: wrap;
}

.samelist .item {
    width: 50%;
    margin: 0;
    border-radius: 10px;
    text-align: left;
    padding: 3px;
}

.samelist .item p {
    margin-top: 0;
    padding: 4px 6px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.samelist .item:hover {
    transform: translateY(0);
    background: #f4f6fa;
}

.samelist .item p span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    margin-right: 8px;
    border-radius: 8px;
    color: #8a94a6;
    background: #eef1f6;
    font-size: 12px;
    font-weight: 800;
}

.samelist .item:nth-child(1) p span {
    color: #FE2D46;
}

.samelist .item:nth-child(2) p span {
    color: #FF6600;
}

.samelist .item:nth-child(3) p span {
    color: #FAA90E;
}


/*全网搜线路切换*/
.source-switch {
    display: flex;
    align-items: center;
    justify-content: space-between;
    white-space: nowrap;
    overflow-x: auto;
    margin: 6px 0 14px;
    padding: 12px 14px;
    border: 1px solid rgba(30, 41, 59, .06);
    border-radius: 18px;
    background: rgba(255, 255, 255, .78);
    box-shadow: 0 10px 28px rgba(30, 41, 59, .05);
}

.source-switch h3 {
    padding: 0;
    margin-right: 6px;
    font-size: 16px;
}

.switch-items {
    display: flex;
    gap: 8px;
    padding-top: 0;
}

.switch-items a {
    position: relative;
    padding: 8px 14px;
    border-radius: 999px;
    color: #637083;
    background: #f1f4f9;
    text-decoration: none;
    transition: all 0.3s;
}

.switch-items a:hover {
    color: var(--theme-theme);
}

.switch-items a.active {
    color: #fff;
    font-weight: bold;
    background: var(--theme-theme);
}

.switch-items a.active:after {
    content: none;
}

.vtips {
    font-size: 14px;
    color: #999;
    padding: 10px 0 0;
}

.vtips a {
    font-weight: bold;
    color: var(--theme-theme);
}

.btns2 {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    height: 34px;
    line-height: 34px;
    color: var(--theme-other_background);
    background-color: var(--theme-theme);
    font-size: 14px;
    width: 106px;
    cursor: pointer;
    position: absolute;
    bottom: 15px;
    right: 18px;
}

.dialogUrlBox {
    width: 450px;
    border-radius: 22px;
}

.dialogUrlBox .el-dialog {
    border-radius: 22px;
}

.dialogUrlBox .dialogUrl {
    min-height: 100px;
}

.dialogUrlBox .dialogUrl .title {
    font-size: 21px;
    font-weight: 900;
    text-align: center;
    color: #000;
}

.dialogUrlBox .dialogUrl .title span {
    color: var(--theme-theme);
}

.dialogUrlBox .dialogUrl .tips {
    margin-top: 12px;
    color: #666;
    font-size: 14px;
    text-align: center;
}

.dialogUrlBox .dialogUrl .qrcode {
    margin: 24px auto 0;
    width: 200px;
    height: 200px;
    border: 1.5px solid #e5e8ef;
    border-radius: 18px;
}

.dialogUrlBox .dialogUrl .qrcode canvas {
    width: 100%;
    height: 100%;
    padding: 10px;
}

.dialogUrlBox .dialogUrl .nav {
    margin-top: 15px;
    font-size: 15px;
}

.dialogUrlBox .dialogUrl .nav .item {
    color: #333;
    text-align: center;
    margin-top: 5px;
}

.dialogUrlBox .dialogUrl .nav .item .t {
    font-weight: 600;
}

.dialogUrlBox .dialogUrl .nav .item a {
    color: var(--theme-theme);
}

.dialogUrlBox .dialogUrl .statement {
    margin-top: 24px;
    padding-top: 15px;
    text-align: left;
    font-size: 14px;
    border-top: 1px dashed #e6e6e6;
}

.dialogUrlBox .dialogUrl .statement .content {
    margin-bottom: 8px;
    color: #666;
    line-height: 1.6;
}

.dialogUrlBox .dialogUrl .statement .content p {
    text-align: justify;
    margin-top: 5px;
}

.dialogUrlBox .el-icon {
    font-size: 20px;
}




@font-face {
    font-family: "iconfont";
    /* Project id 4485496 */
    src: url('//at.alicdn.com/t/c/font_4485496_re46ysj9vba.woff2?t=1725422453573') format('woff2'),
        url('//at.alicdn.com/t/c/font_4485496_re46ysj9vba.woff?t=1725422453573') format('woff'),
        url('//at.alicdn.com/t/c/font_4485496_re46ysj9vba.ttf?t=1725422453573') format('truetype');
}

.iconfont {
    font-family: "iconfont" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-shijian_o:before {
    content: "\ebb1";
}

.icon-laiyuan1:before {
    content: "\e619";
}

.icon-laiyuan:before {
    content: "\e651";
}

.icon-yun_o:before {
    content: "\ebb3";
}

.icon-fenxiang1:before {
    content: "\e626";
}

.icon-fangwen:before {
    content: "\e6d5";
}

.icon-xiala:before {
    content: "\e65b";
}

.icon-caidan:before {
    content: "\e65d";
}

.icon-UC:before {
    content: "\e7cb";
}

.icon-xunlei:before {
    content: "\ea50";
}

.icon-baiduwangpan:before {
    content: "\e698";
}

.icon-aliyunpan:before {
    content: "\e615";
}

.icon-fenlei:before {
    content: "\e65f";
}

.icon-tiaozhuan:before {
    content: "\e658";
}

.icon--lianjie:before {
    content: "\e606";
}

.icon-fenxiang:before {
    content: "\e65c";
}

.icon-fuzhi:before {
    content: "\e60f";
}

.icon-date:before {
    content: "\e611";
}

.icon-kuake:before {
    content: "\e67d";
}

.icon-sousuo:before {
    content: "\e623";
}

/* App 原型落地覆盖层：低饱和青绿色、紧凑工具型资源搜索界面。 */
:root {
    --app-page: #f5f7f8;
    --app-card: rgba(255, 255, 255, .94);
    --app-text: #17242c;
    --app-muted: #8a969d;
    --app-soft: #eef3f2;
    --app-line: rgba(23, 36, 44, .08);
    --app-brand: #1e7671;
    --app-brand-dark: #155f5b;
    --app-warn: #d99a3d;
    --app-danger: #1e7671;
    --app-shadow: 0 8px 22px rgba(34, 57, 70, .08);
    --app-radius: 8px;
}

html,
body {
    color: var(--app-text);
    background:
        radial-gradient(circle at 14% -8%, rgba(30, 118, 113, .10), transparent 28%),
        radial-gradient(circle at 90% 0%, rgba(217, 154, 61, .10), transparent 24%),
        linear-gradient(145deg, var(--app-page) 0%, #eef3f2 100%);
}

body::before {
    opacity: .28;
    background:
        linear-gradient(rgba(30, 118, 113, .05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(30, 118, 113, .05) 1px, transparent 1px);
    background-size: 28px 28px;
}

.headerBox .bg {
    border-bottom: 1px solid var(--app-line);
    box-shadow: 0 8px 18px rgba(34, 57, 70, .06);
}

.headerBox .box .search,
.searchBox .search {
    border-color: rgba(23, 36, 44, .06);
    border-radius: 14px;
    background: rgba(255, 255, 255, .9);
    box-shadow: var(--app-shadow);
}

.headerBox .box .search input,
.searchBox .search input {
    color: var(--app-text);
    font-weight: 800;
}

.searchBox .search .btn .iconfont,
.headerBox .box .search .btn .iconfont {
    color: var(--app-brand);
}

.appHome {
    padding-top: 28px;
}

.appHero {
    max-width: 720px;
}

.appBrand .logo {
    box-shadow: none;
}

.appHome .subTitle {
    color: var(--app-muted);
}

.homeStats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 12px;
}

.homeStats .statCard {
    display: grid;
    gap: 6px;
    padding: 13px 12px;
    border: 1px solid var(--app-line);
    border-radius: var(--app-radius);
    text-align: left;
    background: var(--app-card);
    box-shadow: var(--app-shadow);
}

.homeStats .statCard span {
    color: #52636d;
    font-size: 12px;
    font-weight: 850;
}

.homeStats .statCard b {
    color: var(--app-brand-dark);
    font-size: 24px;
    line-height: 1;
}

.homeStats .statCard small {
    color: var(--app-muted);
    font-size: 10px;
    font-weight: 800;
}

.homeRank .rankBlock {
    border-color: var(--app-line);
    border-radius: var(--app-radius);
    background: var(--app-card);
    box-shadow: var(--app-shadow);
    backdrop-filter: none;
}

.homeRank .rankTitle {
    color: var(--app-text);
    font-size: 18px;
}

.homeRank .rankSub {
    color: var(--app-muted);
    background: rgba(30, 118, 113, .08);
}

.homeRank .rankList {
    gap: 16px 14px;
}

.homeRank .rankPoster {
    border-radius: var(--app-radius);
    box-shadow: 0 8px 14px rgba(32, 62, 88, .10);
}

.homeRank .rankItem:hover {
    transform: translateY(-1px);
}

.homeRank .rankName {
    color: var(--app-text);
    font-size: 14px;
}

.homeRank .hotPill,
.homeRank .scorePill {
    color: var(--app-brand-dark);
    background: rgba(30, 118, 113, .10);
    border-color: rgba(30, 118, 113, .08);
}

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

.appListBox .screen,
.appListBox .right {
    display: none;
}

.appListBox .left {
    max-width: 880px;
    margin: 0 auto;
}

.appListBox .left > h3,
.appListBox .Qbtn {
    display: none;
}

.appSourceSwitch {
    padding: 6px;
    margin: 4px 0 10px;
    border-color: var(--app-line);
    border-radius: 14px;
    background: rgba(230, 241, 246, .86);
    box-shadow: none;
}

.appSourceSwitch .switch-items {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.appSourceSwitch .switch-items a {
    display: grid;
    place-items: center;
    min-height: 38px;
    border-radius: 10px;
    background: transparent;
    color: #748695;
    font-weight: 1000;
}

.appSourceSwitch .switch-items a.active {
    color: #fff;
    background: var(--app-brand);
    box-shadow: 0 8px 16px rgba(30, 118, 113, .16);
}

.resultHeader {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 4px 0 10px;
    padding: 0 2px;
}

.resultHeader strong {
    display: block;
    color: var(--app-text);
    font-size: 22px;
    line-height: 1.2;
}

.resultHeader span {
    display: block;
    margin-top: 4px;
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 800;
}

.researchBtn {
    flex: 0 0 auto;
    color: var(--app-brand-dark);
    font-size: 12px;
    font-weight: 950;
}

.resultFilterBar {
    display: grid;
    gap: 9px;
    margin-bottom: 10px;
    padding: 12px;
    border: 1px solid var(--app-line);
    border-radius: var(--app-radius);
    background: var(--app-card);
    box-shadow: var(--app-shadow);
}

.filterTitle {
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 900;
}

.filterTabs {
    display: flex;
    gap: 7px;
    overflow-x: auto;
    padding-bottom: 1px;
}

.filterTabs::-webkit-scrollbar {
    display: none;
}

.filterTabs a {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 34px;
    padding: 0 11px;
    border-radius: 999px;
    color: #637584;
    background: rgba(255, 255, 255, .78);
    font-size: 12px;
    font-weight: 1000;
    white-space: nowrap;
}

.filterTabs a.active {
    color: var(--app-brand-dark);
    background: rgba(30, 118, 113, .12);
}

.panMark {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: rgba(99, 117, 132, .32);
}

.filterTabs a.active .panMark {
    background: var(--app-brand);
}

.listBox .left .box,
.listBox .Ebox {
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.appResultList {
    display: grid;
    gap: 9px;
}

.listBox .left .list .item.appResultItem {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 9px;
    padding: 12px;
    border-color: var(--app-line);
    border-radius: var(--app-radius);
    background: var(--app-card);
    box-shadow: var(--app-shadow);
}

.listBox .left .list .item.appResultItem:hover {
    border-color: rgba(30, 118, 113, .14);
    box-shadow: 0 10px 24px rgba(34, 57, 70, .10);
    transform: translateY(-1px);
}

.resultPanIcon {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 11px;
    color: var(--app-brand-dark);
    background: rgba(30, 118, 113, .09);
    font-size: 12px;
    font-weight: 1000;
}

.resultPanIcon img {
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.resultContent {
    display: grid;
    gap: 7px;
    min-width: 0;
}

.resultTop {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.listBox .left .list .item.appResultItem .title {
    min-width: 0;
    padding: 0;
    color: var(--app-text);
    font-size: 15px;
    line-height: 1.45;
    font-weight: 1000;
}

.source-badge {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    height: 23px;
    padding: 0 8px;
    border-radius: 999px;
    color: #fff;
    background: var(--app-brand);
    font-size: 11px;
    font-weight: 1000;
}

.resultMetaLine {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.resultMetaLine span {
    overflow: hidden;
    max-width: 100%;
    padding: 5px 7px;
    border-radius: 9px;
    color: #607181;
    background: rgba(237, 245, 249, .82);
    font-size: 10px;
    font-weight: 900;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.listBox .left .list .item.appResultItem .btns {
    justify-content: flex-end;
    gap: 7px;
    margin-top: 0;
}

.listBox .left .list .item.appResultItem .btns .btn {
    min-height: 30px;
    padding: 0 11px;
    border-radius: 999px;
    font-size: 12px;
}

.listBox .left .list .item.appResultItem .btns .btnPrimary,
.listBox .left .list .item.appResultItem .btns .btn:hover {
    color: #fff;
    background: var(--app-brand);
}

.sourceLinkStatus {
    margin-top: 0;
    padding: 5px 9px;
    font-size: 11px;
}

.sourceLinkStatus em {
    max-width: 260px;
}

.webLoading {
    display: flex;
    align-items: center;
    min-height: 54px;
    border: 1px dashed rgba(30, 118, 113, .24);
    border-radius: var(--app-radius);
    background: rgba(255, 255, 255, .72);
}

.request-card {
    margin-top: 10px;
}

.appDetailBox .left {
    max-width: 880px;
    margin: 0 auto;
}

.detailHeader {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 4px 0 10px;
}

.detailHeader .backBtn {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    color: var(--app-brand-dark);
    background: rgba(255, 255, 255, .82);
    box-shadow: var(--app-shadow);
    font-size: 24px;
    line-height: 1;
}

.detailHeader strong {
    display: block;
    color: var(--app-text);
    font-size: 20px;
    line-height: 1.2;
}

.detailHeader span {
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 800;
}

.appDetailCard {
    border-color: var(--app-line);
    border-radius: var(--app-radius);
    background: var(--app-card);
    box-shadow: var(--app-shadow);
}

.appDetailCard .detailIntro {
    margin-bottom: 8px;
}

.appDetailCard .detailPills {
    justify-content: flex-start;
}

.appDetailCard .detailPills span {
    min-height: 25px;
    font-size: 12px;
}

.appDetailCard .cat {
    padding: 10px 0;
    border-top-color: var(--app-line);
}

.appDetailCard .cat .l {
    color: var(--app-muted);
    font-size: 13px;
    font-weight: 850;
}

.appDetailCard .cat .r {
    color: #2b4152;
    font-size: 14px;
    font-weight: 800;
    word-break: break-word;
}

.appDetailCard .btns .btn {
    border-radius: var(--app-radius);
}

.samelistBox {
    border-color: var(--app-line);
    border-radius: var(--app-radius);
    background: var(--app-card);
    box-shadow: var(--app-shadow);
}

/* 原型同步补丁：统一前台为移动 App 式资源检索界面，避免旧筛选和旧搜索条干扰。 */
:root {
    --app-page: #f4f7f6;
    --app-ink: #17242c;
    --app-sub: #667881;
    --app-faint: #94a3a9;
    --app-surface: rgba(255, 255, 255, .94);
    --app-surface-strong: #ffffff;
    --app-border: rgba(25, 59, 67, .08);
    --app-primary: #1e7671;
    --app-primary-2: #00a99f;
    --app-blue: #1e7671;
    --app-gold: #2a8f89;
    --app-red: #1e7671;
    --app-shadow-2: 0 14px 36px rgba(27, 68, 75, .10);
    --app-radius-sm: 8px;
    --app-radius-md: 14px;
    --app-radius-lg: 22px;
}

body {
    background:
        radial-gradient(circle at 16% -6%, rgba(0, 169, 159, .16), transparent 28%),
        radial-gradient(circle at 86% 2%, rgba(217, 154, 61, .14), transparent 24%),
        linear-gradient(145deg, #f7faf9 0%, #eef5f3 58%, #f7f3eb 100%);
}

body::before {
    opacity: .22;
    background:
        linear-gradient(rgba(30, 118, 113, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(30, 118, 113, .055) 1px, transparent 1px);
    background-size: 30px 30px;
}

.headBg {
    display: none;
}

.headerBox {
    height: 68px;
}

.headerKox {
    height: 68px;
}

.headerBox .bg {
    background: rgba(250, 253, 252, .86);
    border-bottom-color: rgba(25, 59, 67, .07);
    box-shadow: 0 10px 28px rgba(27, 68, 75, .07);
}

.headerBox .box {
    width: min(1180px, calc(100% - 32px));
}

.headerBox .box .logoBox .logo {
    height: 38px;
    border-radius: 10px;
}

.headerBox .box .logoBox .title {
    color: var(--app-ink);
    font-size: 19px;
    font-weight: 1000;
}

.headerBox .box .search {
    height: 42px;
    max-width: 390px;
    border-radius: 999px;
    background: rgba(238, 244, 243, .92);
    box-shadow: none;
}

.headerBox .box .search input {
    padding-left: 18px;
    font-size: 14px;
}

.headerBox .box .search .btn {
    width: 52px;
    height: 42px;
}

.headerBox .box .navs .item,
.headerBox .box .navs a {
    color: #5f7078;
    background: rgba(255, 255, 255, .72);
    border: 1px solid rgba(25, 59, 67, .06);
    font-size: 13px;
    font-weight: 900;
}

.headerBox .box .navs .item:hover,
.headerBox .box .navs a:hover {
    color: var(--app-primary);
    background: rgba(30, 118, 113, .08);
}

.homeBox,
.listBox {
    width: min(1180px, calc(100% - 32px));
}

.appHome {
    padding-top: 22px;
}

.appHero {
    width: min(680px, 100%);
    padding: 24px;
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius-lg);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .96), rgba(246, 251, 250, .90)),
        linear-gradient(135deg, rgba(30, 118, 113, .10), rgba(217, 154, 61, .08));
    box-shadow: var(--app-shadow-2);
}

.appBrand .logo {
    height: 54px;
    border-radius: 14px;
}

.appBrand .title {
    color: var(--app-ink);
    font-size: 28px;
    font-weight: 1000;
}

.appHome .subTitle {
    color: var(--app-sub);
    font-size: 14px;
    font-weight: 850;
}

.searchBox .search {
    height: 52px;
    border-radius: 999px;
    background: rgba(239, 245, 244, .96);
    border-color: rgba(25, 59, 67, .06);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8);
}

.searchBox .search:focus-within {
    border-color: rgba(30, 118, 113, .32);
    box-shadow: 0 12px 30px rgba(30, 118, 113, .12);
}

.searchBox .search input {
    color: var(--app-ink);
    font-weight: 900;
    font-size: 15px;
}

.searchBox .search .btn {
    width: 58px;
    height: 52px;
    margin-right: 4px;
    border-radius: 16px;
    color: #fff;
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
}

.homeStats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 12px;
}

.homeStats .statCard {
    min-height: 86px;
    padding: 14px 15px;
    border-radius: var(--app-radius-md);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .92), rgba(239, 247, 246, .86));
    box-shadow: none;
}

.homeStats .statCard b {
    color: var(--app-primary);
    font-size: 28px;
    font-weight: 1000;
}

.homeRank {
    margin-top: 24px;
}

.homeRank .rankBlock {
    padding: 18px;
    border-radius: var(--app-radius-lg);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .95), rgba(244, 250, 249, .92)),
        linear-gradient(135deg, rgba(30, 118, 113, .06), rgba(217, 154, 61, .06));
    box-shadow: var(--app-shadow-2);
}

.homeRank .rankHead {
    padding-bottom: 14px;
}

.homeRank .rankTitle {
    color: var(--app-ink);
    font-size: 19px;
}

.homeRank .rankSub {
    color: var(--app-primary);
    background: rgba(30, 118, 113, .08);
    font-weight: 900;
}

.homeRank .rankList {
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 18px 14px;
}

.homeRank .rankItem {
    border-radius: var(--app-radius-sm);
}

.homeRank .rankPoster {
    border-radius: var(--app-radius-sm);
    box-shadow: 0 10px 22px rgba(27, 68, 75, .12);
}

.homeRank .rankNo {
    border-radius: 0 0 9px 0;
    background: rgba(23, 36, 44, .82);
}

.homeRank .rankName {
    color: var(--app-ink);
    font-size: 14px;
    font-weight: 1000;
}

.homeRank .rankDesc {
    color: var(--app-sub);
}

.homeRank .hotPill,
.homeRank .scorePill {
    color: var(--app-primary);
    background: rgba(30, 118, 113, .10);
    border-color: rgba(30, 118, 113, .10);
}

.homeRank .scorePill {
    color: #a66516;
    background: rgba(217, 154, 61, .12);
    border-color: rgba(217, 154, 61, .15);
}

.homeRank .rankBlockSimple {
    display: none;
}

.appListBox,
.appDetailBox {
    margin-top: 18px;
}

.appListBox .left,
.appDetailBox .left {
    max-width: 820px;
    overflow: visible;
}

.appListBox .left > .box {
    margin-top: 0;
}

.appSourceSwitch {
    margin-bottom: 12px;
    border-radius: var(--app-radius-md);
    background: rgba(233, 243, 242, .92);
}

.appSourceSwitch .switch-items a {
    border-radius: 10px;
}

.appSourceSwitch .switch-items a.active {
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
}

.resultHeader {
    margin: 4px 0 12px;
    padding: 0 2px;
}

.resultHeader strong {
    color: var(--app-ink);
    font-size: 24px;
    font-weight: 1000;
}

.resultHeader span,
.filterTitle {
    color: var(--app-sub);
}

.researchBtn {
    padding: 8px 12px;
    border-radius: 999px;
    color: var(--app-primary);
    background: rgba(255, 255, 255, .82);
    border: 1px solid var(--app-border);
}

.resultFilterBar {
    padding: 12px;
    border-radius: var(--app-radius-md);
    background: var(--app-surface);
}

.filterTabs a {
    background: rgba(239, 245, 244, .88);
    color: #5f7078;
}

.filterTabs a.active {
    color: #fff;
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
}

.filterTabs a.active .panMark {
    background: #fff;
}

.listBox .left .list .item.appResultItem {
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 12px;
    padding: 14px;
    border-radius: var(--app-radius-md);
    background: var(--app-surface);
}

.resultPanIcon {
    width: 46px;
    height: 46px;
    border-radius: 14px;
    color: var(--app-primary);
    background: rgba(30, 118, 113, .10);
}

.resultPanIcon .iconfont {
    font-size: 24px;
}

.listBox .left .list .item.appResultItem .title {
    color: var(--app-ink);
    font-size: 16px;
}

.source-badge {
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
}

.resultMetaLine span {
    color: #5f7078;
    background: rgba(239, 245, 244, .95);
}

.listBox .left .list .item.appResultItem .btns .btn {
    background: rgba(239, 245, 244, .95);
    color: #536871;
    font-weight: 900;
}

.listBox .left .list .item.appResultItem .btns .btnPrimary,
.listBox .left .list .item.appResultItem .btns .btn:hover {
    color: #fff;
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
}

.webLoading {
    display: flex;
    gap: 12px;
    justify-content: center;
    padding: 18px;
    min-height: 88px;
    color: var(--app-sub);
    font-size: 13px;
    font-weight: 900;
}

.webLoading .loader {
    margin: 0;
    font-size: 18px;
}

.webLoading p {
    color: var(--app-sub);
}

.request-card,
.emptyRequestCard {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px;
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius-md);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .94), rgba(246, 250, 249, .90));
    box-shadow: var(--app-shadow-2);
}

.request-card strong {
    display: block;
    color: var(--app-ink);
    font-size: 16px;
    font-weight: 1000;
}

.request-card span {
    display: block;
    margin-top: 4px;
    color: var(--app-sub);
    font-size: 13px;
    font-weight: 850;
}

.emptyActions {
    display: flex;
    gap: 8px;
    flex: 0 0 auto;
}

.soft-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 0 13px;
    border: 1px solid var(--app-border);
    border-radius: 999px;
    color: var(--app-primary);
    background: rgba(255, 255, 255, .82);
    cursor: pointer;
    font-size: 13px;
    font-weight: 1000;
}

.soft-btn.primary {
    color: #fff;
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
}

.detailHeader {
    margin: 0 0 12px;
}

.detailHeader .backBtn {
    color: var(--app-primary);
}

.appDetailCard {
    padding: 24px 26px;
    border-radius: var(--app-radius-lg);
}

.appDetailCard .detailIntro {
    padding-bottom: 8px;
}

.appDetailCard .details .title,
.appDetailCard .title,
.details .title {
    color: var(--app-ink);
}

.appDetailCard .cat .l {
    width: 92px;
}

.diskIcon {
    display: inline-flex;
    margin-right: 8px;
    color: var(--app-primary);
    font-size: 20px;
    vertical-align: middle;
}

.appDetailCard .btns {
    justify-content: flex-end;
}

.appDetailCard .btns .btn {
    border-radius: 999px;
    font-weight: 950;
}

.appDetailCard .btns .btn.btnCol {
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
}

.samelistNav {
    color: var(--app-ink);
}

.samelistBox {
    border-radius: var(--app-radius-md);
}

.samelist .item:hover {
    background: rgba(30, 118, 113, .07);
}

.layerBox .vname {
    color: var(--app-ink);
}

.layerBox .vbtn {
    border-radius: 999px;
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
}

.dialogUrlBox .el-dialog {
    border-radius: var(--app-radius-lg);
}

/* 第二轮原型贴合：把真实模板拉近 ui-prototype 的 App 画板结构。 */
.appShell {
    min-height: 100vh;
}

.appShell .footerBox {
    opacity: .82;
}

.appShellHome .headerBox {
    position: sticky;
}

.heroFeature {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin: 18px 0 14px;
    padding: 22px 22px;
    overflow: hidden;
    border-radius: 24px;
    text-align: left;
    color: #fff;
    background:
        radial-gradient(circle at 86% 18%, rgba(255, 255, 255, .22), transparent 26%),
        linear-gradient(135deg, #1e7671 0%, #129b93 58%, #00a99f 100%);
    box-shadow: 0 18px 42px rgba(30, 118, 113, .18);
}

.heroFeature::after {
    content: "";
    position: absolute;
    right: -36px;
    bottom: -54px;
    width: 160px;
    height: 160px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .13);
}

.heroCopy {
    position: relative;
    z-index: 1;
    min-width: 0;
}

.heroCopy h2 {
    margin: 0;
    font-size: 28px;
    line-height: 1.14;
    font-weight: 1000;
    letter-spacing: 0;
}

.heroCopy p {
    max-width: 390px;
    margin-top: 8px;
    color: rgba(255, 255, 255, .84);
    font-size: 14px;
    font-weight: 850;
}

.heroArt {
    position: relative;
    z-index: 1;
    flex: 0 0 154px;
    width: 154px;
    height: 120px;
}

.heroArt svg {
    width: 100%;
    height: 100%;
    display: block;
}

.heroArt circle,
.heroArt rect {
    fill: rgba(255, 255, 255, .22);
}

.heroArt path {
    fill: none;
    stroke: rgba(255, 255, 255, .34);
    stroke-width: 12;
    stroke-linecap: round;
}

.heroArt .tick {
    stroke: #fff;
    stroke-width: 8;
    stroke-linejoin: round;
}

.utilityGrid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 10px;
}

.utilityCard {
    display: block;
    min-width: 0;
    padding: 15px 16px;
    border: 0;
    border-radius: 18px;
    text-align: left;
    color: #fff;
    cursor: pointer;
    background: linear-gradient(135deg, #1e7671 0%, #00a99f 100%);
    box-shadow: 0 12px 28px rgba(30, 118, 113, .16);
}

.utilityCard.feedbackCard {
    background: linear-gradient(135deg, #246f6b 0%, #3fb8b0 100%);
    box-shadow: 0 12px 28px rgba(30, 118, 113, .14);
}

.utilityCard strong,
.utilityCard span {
    display: block;
}

.utilityCard strong {
    font-size: 17px;
    font-weight: 1000;
}

.utilityCard span {
    margin-top: 4px;
    color: rgba(255, 255, 255, .82);
    font-size: 12px;
    font-weight: 850;
}

.utilityCard:hover {
    color: #fff;
    transform: translateY(-1px);
}

.appShellHome .appHero {
    background: transparent;
    border: 0;
    box-shadow: none;
    padding: 0;
}

.appShellHome .appBrand {
    justify-content: center;
}

.appShellHome .homeRank .rankBlock {
    border: 0;
    background: rgba(255, 255, 255, .86);
}

.appShellHome .homeRank .rankHead {
    padding-bottom: 16px;
}

.appShellHome .homeRank .rankTitle::before {
    content: "";
    width: 8px;
    height: 8px;
    margin-right: 9px;
    border-radius: 50%;
    background: var(--app-primary);
    box-shadow: 0 0 0 6px rgba(30, 118, 113, .10);
}

.resultBoard {
    margin-bottom: 12px;
    padding: 16px;
    border: 1px solid rgba(25, 59, 67, .08);
    border-radius: 22px;
    background: rgba(255, 255, 255, .88);
    box-shadow: 0 16px 34px rgba(27, 68, 75, .09);
}

.resultBoard .resultHeader {
    margin: 0 0 14px;
}

.resultBoard .resultFilterBar {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.appShellList .appSourceSwitch {
    max-width: 360px;
}

.appShellList .listBox .left .list .item.appResultItem {
    border: 0;
    background: rgba(255, 255, 255, .90);
    box-shadow: 0 14px 32px rgba(27, 68, 75, .08);
}

.appShellList .listBox .left .list .item.appResultItem::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    border: 1px solid rgba(25, 59, 67, .07);
    pointer-events: none;
}

.appShellList .resultPanIcon {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    color: var(--app-primary);
    background: #f0f7ff;
}

.appShellList .webResultItem .resultPanIcon {
    color: var(--app-primary);
    background: #f2f8f6;
}

.appShellList .resultPanIcon .iconfont {
    font-size: 19px;
}

.appShellList .webResultItem .source-badge {
    background: linear-gradient(135deg, #2f6fba, #00a99f);
}

.appShellDetail .detailHeader {
    padding: 0 2px;
}

.appShellDetail .appDetailCard {
    position: relative;
    overflow: hidden;
    border: 0;
    background: rgba(255, 255, 255, .90);
    box-shadow: 0 18px 42px rgba(27, 68, 75, .10);
}

.appShellDetail .appDetailCard::before {
    content: "";
    position: absolute;
    inset: 0;
    height: 5px;
    background: linear-gradient(90deg, #1e7671, #00a99f, #ffb44d);
}

.appShellDetail .detailIntro {
    position: relative;
    margin-bottom: 14px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(25, 59, 67, .08);
}

.appShellDetail .detailPills span:not(.source-badge) {
    color: #5f7078;
    background: rgba(239, 245, 244, .95);
}

.appShellDetail .statusBox {
    border-radius: 18px;
}

.appShellDetail .samelistNav {
    padding-top: 22px;
}

.appShellDetail .samelistBox {
    border: 0;
    background: rgba(255, 255, 255, .86);
}

/* 第三轮微调：热播榜单 Tab 化，并按截图打磨搜索列表页。 */
.appShellHome .homeBox {
    width: min(720px, calc(100% - 32px));
}

.appShellHome .homeRank {
    width: min(720px, 100%);
    margin-left: auto;
    margin-right: auto;
}

.rankTabsBlock {
    padding: 20px;
}

.rankTabs {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: -2px 0 18px;
    overflow-x: auto;
    padding-bottom: 2px;
}

.rankTabs::-webkit-scrollbar {
    display: none;
}

.rankTab {
    appearance: none;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    padding: 0 16px;
    border: 0;
    border-radius: 999px;
    color: #7a8991;
    background: rgba(239, 245, 244, .92);
    cursor: pointer;
    font-size: 14px;
    font-weight: 1000;
    transition: color .18s ease, background-color .18s ease, transform .18s ease;
}

.rankTab img {
    width: 18px;
    height: 18px;
    border-radius: 6px;
    object-fit: cover;
}

.rankTab.active {
    color: #fff;
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
    box-shadow: 0 10px 20px rgba(30, 118, 113, .16);
}

.rankTab:hover {
    transform: translateY(-1px);
}

.rankPanel {
    min-height: 260px;
}

.appShellHome .homeRank .rankList {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px 14px;
}

.appShellList .appSearchTop {
    display: block;
    padding-top: 4px;
}

.appShellList .searchList .searchAssist {
    z-index: 240;
}

.appShellList .searchList .search {
    height: 58px;
    margin-top: 0;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 16px 34px rgba(27, 68, 75, .12);
}

.appShellList .searchList .search input {
    padding-left: 22px;
    font-size: 15px;
}

.appShellList .searchList .search .btn {
    width: 96px;
    height: 48px;
    margin-right: 5px;
    border-radius: 18px;
    color: #fff;
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
}

.appShellList .searchList .search .btn::after {
    content: "搜索";
    margin-left: 5px;
    color: #fff;
    font-size: 14px;
    font-weight: 1000;
}

.appShellHome .searchBox .search .btn::after {
    content: "搜索";
    margin-left: 5px;
    color: #fff;
    font-size: 14px;
    font-weight: 1000;
}

.appShellHome .searchBox .search .btn {
    width: 96px;
    height: 48px;
    margin-right: 5px;
    border-radius: 18px;
}

.appShellHome .searchBox .search .btn .iconfont {
    color: #fff;
    font-size: 18px;
}

.appShellList .searchList .search .btn .iconfont {
    color: #fff;
    font-size: 18px;
}

.appShellList .appListBox {
    width: min(1150px, calc(100% - 32px));
    margin-top: 0;
}

.appShellList .appListBox .left {
    max-width: none;
}

.appShellList .resultBoard {
    padding: 18px 24px 20px;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
}

.appShellList .resultHeader {
    margin-top: 20px;
    margin-bottom: 12px;
}

.appShellList .resultHeader strong {
    color: #6d7c85;
    font-size: 14px;
    font-weight: 850;
}

.appShellList .resultHeader span {
    display: inline;
    margin-left: 2px;
    color: var(--app-primary);
    font-size: 14px;
}

.appShellList .researchBtn {
    color: #88969d;
    background: transparent;
    border: 0;
}

.resultCountLine {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 22px 0 18px;
    color: #7a8991;
    font-size: 14px;
    font-weight: 850;
}

.resultCountLine b {
    color: var(--app-primary);
    font-weight: 1000;
}

.appShellList .appSourceSwitch {
    max-width: none;
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    margin: 0 0 14px;
    padding: 0;
    border: 0;
    background: transparent;
}

.sourceLabel,
.appShellList .filterTitle {
    color: #152331;
    font-size: 15px;
    font-weight: 1000;
}

.appShellList .switch-items {
    display: inline-flex;
    width: auto;
    padding: 4px;
    border: 1px solid rgba(25, 59, 67, .08);
    border-radius: 999px;
    background: #fff;
}

.appShellList .appSourceSwitch .switch-items a {
    min-width: 72px;
    min-height: 34px;
    padding: 0 18px;
    border-radius: 999px;
    color: #6f7f87;
    background: transparent;
    box-shadow: none;
}

.appShellList .appSourceSwitch .switch-items a.active {
    color: #17242c;
    background: #f4f7f6;
    box-shadow: inset 0 0 0 1px rgba(25, 59, 67, .04);
}

.appShellList .resultFilterBar {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    padding: 0;
    border: 0;
    background: transparent;
}

.appShellList .filterTabs {
    gap: 10px;
}

.appShellList .filterTabs a {
    min-height: 34px;
    padding: 0 18px;
    color: #56656d;
    background: #fff;
    border: 1px solid rgba(25, 59, 67, .08);
}

.appShellList .filterTabs a.active {
    color: #17242c;
    background: #f4f7f6;
    box-shadow: inset 0 0 0 1px rgba(25, 59, 67, .04);
}

.appShellList .panMark {
    display: none;
}

.appShellList .appResultList {
    gap: 14px;
}

.appShellList .listBox .left .list .item.appResultItem {
    grid-template-columns: 34px minmax(0, 1fr);
    align-items: center;
    min-height: 100px;
    padding: 20px 24px;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(27, 68, 75, .06);
}

.appShellList .resultContent {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px 24px;
}

.appShellList .resultTop {
    grid-column: 1 / 2;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.appShellList .listBox .left .list .item.appResultItem .title {
    font-size: 17px;
    line-height: 1.5;
}

.appShellList .source-badge {
    margin-left: 10px;
    height: 24px;
    color: var(--app-primary);
    background: rgba(30, 118, 113, .08);
    border: 1px solid rgba(30, 118, 113, .08);
}

.appShellList .resultMetaLine {
    grid-column: 1 / 2;
    gap: 8px;
}

.appShellList .resultMetaLine span {
    padding: 0 8px;
    height: 24px;
    line-height: 24px;
    border-radius: 999px;
    color: #6f7f87;
    background: #eef6f4;
}

.appShellList .resultMetaLine span:nth-child(2) {
    color: var(--app-primary);
    background: #e9f7f2;
}

.appShellList .sourceLinkStatus {
    grid-column: 1 / 2;
    width: fit-content;
}

.appShellList .listBox .left .list .item.appResultItem .btns {
    grid-column: 2 / 3;
    grid-row: 1 / 4;
    justify-content: flex-end;
    gap: 14px;
    margin: 0;
}

.appShellList .listBox .left .list .item.appResultItem .btns .btn {
    min-width: 102px;
    min-height: 44px;
    padding: 0 18px;
    border: 1px solid rgba(30, 118, 113, .20);
    color: var(--app-primary);
    background: #fff;
    font-size: 14px;
}

.appShellList .listBox .left .list .item.appResultItem .btns .btn:hover,
.appShellList .listBox .left .list .item.appResultItem .btns .btnPrimary {
    color: #fff;
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
    border-color: transparent;
}

.appShellList .listBox .left .list .item.appResultItem:not(.webResultItem) .btns .btn:nth-child(3),
.appShellList .listBox .left .list .item.webResultItem .btns .btn {
    color: #fff;
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
    border-color: transparent;
    box-shadow: 0 10px 20px rgba(30, 118, 113, .18);
}

/* 第四轮前台视觉收敛：浅蓝白影视资源工具界面，只覆盖展示层，不改变业务交互。 */
:root {
    --app-page: #f5f8ff;
    --app-page-2: #edf5ff;
    --app-ink: #10243f;
    --app-sub: #66758a;
    --app-faint: #97a7bb;
    --app-surface: rgba(255, 255, 255, .94);
    --app-surface-strong: #ffffff;
    --app-border: rgba(64, 116, 190, .12);
    --app-primary: #2f6fff;
    --app-primary-2: #37b7ff;
    --app-primary-soft: rgba(47, 111, 255, .09);
    --app-cyan-soft: rgba(55, 183, 255, .10);
    --app-orange: #ff8a1c;
    --app-orange-2: #ffe79e;
    --app-purple: #895cfa;
    --app-purple-2: #5cbefa;
    --app-shadow-2: 0 20px 48px rgba(47, 99, 172, .12);
    --app-shadow-soft: 0 10px 28px rgba(47, 99, 172, .08);
    --app-radius-sm: 8px;
    --app-radius-md: 14px;
    --app-radius-lg: 22px;
    --app-home-width: 720px;
    --app-wide-width: 1150px;
}

html,
body {
    color: var(--app-ink);
    background:
        radial-gradient(circle at 12% -8%, rgba(55, 183, 255, .20), transparent 32%),
        radial-gradient(circle at 86% 0%, rgba(47, 111, 255, .12), transparent 26%),
        linear-gradient(180deg, #fbfdff 0%, var(--app-page) 42%, var(--app-page-2) 100%);
}

body::before {
    opacity: .52;
    background:
        linear-gradient(rgba(47, 111, 255, .045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(47, 111, 255, .045) 1px, transparent 1px);
    background-size: 28px 28px;
}

.headBg {
    display: none;
}

.appShell {
    min-height: 100vh;
}

.headerBox .bg {
    border-bottom: 1px solid rgba(47, 111, 255, .08);
    background: rgba(255, 255, 255, .86);
    box-shadow: 0 10px 30px rgba(47, 99, 172, .07);
    backdrop-filter: blur(18px);
}

.headerBox .box {
    width: min(var(--app-wide-width), calc(100% - 32px));
}

.headerBox .box .logoBox .title {
    color: var(--app-ink);
}

.headerBox .box .search {
    background: rgba(241, 247, 255, .92);
    border: 1px solid rgba(47, 111, 255, .08);
}

.headerBox .box .search:focus-within {
    background: #fff;
    border-color: rgba(47, 111, 255, .22);
    box-shadow: 0 12px 28px rgba(47, 111, 255, .10);
}

.headerBox .box .navs .item,
.headerBox .box .navs a {
    color: #60718a;
    border-color: rgba(47, 111, 255, .10);
    background: rgba(255, 255, 255, .78);
}

.headerBox .box .navs .item:hover,
.headerBox .box .navs a:hover {
    color: var(--app-primary);
    background: var(--app-primary-soft);
}

.homeBox,
.listBox,
.appShellDetail .appDetailBox {
    width: min(var(--app-wide-width), calc(100% - 32px));
}

.appShellHome .homeBox {
    width: min(var(--app-home-width), calc(100% - 32px));
    padding-top: 18px;
}

.appShellHome .appHero {
    position: relative;
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.appShellHome .appBrand {
    justify-content: center;
    margin-top: 2px;
}

.appShellHome .appBrand .logo {
    height: 52px;
    border-radius: 14px;
    box-shadow: 0 10px 24px rgba(47, 111, 255, .12);
}

.appShellHome .appBrand .title {
    color: var(--app-ink);
    font-size: 29px;
    letter-spacing: 0;
}

.appShellHome .subTitle {
    margin-top: 8px;
    color: var(--app-sub);
    font-size: 14px;
    font-weight: 800;
}

.appShellHome .searchAssist,
.appShellList .searchAssist {
    z-index: 420;
}

.appShellHome .searchBox .search,
.appShellList .searchList .search {
    height: 58px;
    margin-top: 18px;
    border: 1px solid rgba(47, 111, 255, .10);
    border-radius: 999px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 18px 42px rgba(47, 99, 172, .10);
}

.appShellHome .searchBox .search:focus-within,
.appShellList .searchList .search:focus-within {
    border-color: rgba(47, 111, 255, .30);
    box-shadow: 0 18px 42px rgba(47, 111, 255, .16);
}

.appShellHome .searchBox .search input,
.appShellList .searchList .search input {
    color: var(--app-ink);
    font-size: 15px;
    font-weight: 900;
}

.appShellHome .searchBox .search input::placeholder,
.appShellList .searchList .search input::placeholder,
.headerBox .box .search input::placeholder {
    color: #9aaabe;
}

.appShellHome .searchBox .search .btn,
.appShellList .searchList .search .btn {
    width: 94px;
    height: 48px;
    margin-right: 5px;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
    box-shadow: 0 10px 22px rgba(47, 111, 255, .22);
}

.appShellHome .searchBox .search .btn:hover,
.appShellList .searchList .search .btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 26px rgba(47, 111, 255, .28);
}

.homeStats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 14px;
}

.homeStats .statCard {
    position: relative;
    min-height: 96px;
    overflow: hidden;
    padding: 16px 17px;
    border: 1px solid rgba(47, 111, 255, .09);
    border-radius: 20px;
    background: linear-gradient(145deg, rgba(255, 255, 255, .96), rgba(241, 247, 255, .90));
    box-shadow: var(--app-shadow-soft);
}

.homeStats .statCard::before {
    content: "";
    position: absolute;
    inset: auto 14px 12px 14px;
    height: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--app-primary), var(--app-primary-2), rgba(47, 111, 255, .14));
    background-size: 180% 100%;
    animation: appStatFlow 2.4s linear infinite;
}

.homeStats .statCard span {
    color: var(--app-sub);
    font-size: 12px;
    font-weight: 900;
}

.homeStats .statCard b {
    position: relative;
    display: block;
    margin-top: 4px;
    color: var(--app-primary);
    font-size: 32px;
    line-height: 1.05;
    font-weight: 1000;
    letter-spacing: 0;
}

.homeStats .statCard b::after {
    content: "";
    display: inline-block;
    width: 4px;
    height: .9em;
    margin-left: 3px;
    border-radius: 999px;
    background: rgba(47, 111, 255, .48);
    vertical-align: -2px;
    animation: appCursorBlink 1.1s steps(2, start) infinite;
}

.homeStats .statCard small {
    display: block;
    margin-top: 6px;
    color: #8190a5;
    font-size: 11px;
    font-weight: 800;
}

.utilityGrid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 12px;
}

.utilityCard {
    position: relative;
    overflow: hidden;
    min-height: 92px;
    padding: 17px;
    border-radius: 20px;
    text-align: left;
    color: #fff;
    box-shadow: 0 16px 36px rgba(47, 99, 172, .12);
}

.utilityCard::after {
    content: "";
    position: absolute;
    right: -26px;
    bottom: -34px;
    width: 96px;
    height: 96px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .26);
}

.utilityCard strong,
.utilityCard span {
    position: relative;
    z-index: 1;
}

.utilityCard strong {
    display: block;
    font-size: 17px;
    line-height: 1.25;
    font-weight: 1000;
}

.utilityCard span {
    display: block;
    margin-top: 7px;
    color: rgba(255, 255, 255, .86);
    font-size: 12px;
    font-weight: 850;
}

.utilityCard:hover {
    transform: translateY(-2px);
}

.utilityCard.demandCard {
    background: linear-gradient(137.29deg, var(--app-orange), var(--app-orange-2));
    color: #fff;
}

.utilityCard.feedbackCard {
    background: linear-gradient(100.73deg, var(--app-purple), var(--app-purple-2));
}

.appShellHome .homeRank {
    width: 100%;
    margin: 14px auto 0;
}

.appShellHome .homeRank .rankBlock {
    overflow: hidden;
    border: 1px solid rgba(47, 111, 255, .10);
    border-radius: 24px;
    background: rgba(255, 255, 255, .94);
    box-shadow: var(--app-shadow-2);
}

.appShellHome .homeRank .rankBlock + .rankBlock {
    margin-top: 16px;
}

.appShellHome .homeRank .rankHead {
    padding-bottom: 14px;
}

.appShellHome .homeRank .rankTitle {
    color: var(--app-ink);
    font-size: 18px;
}

.appShellHome .homeRank .rankTitle::before {
    background: var(--app-primary);
    box-shadow: 0 0 0 6px rgba(47, 111, 255, .10);
}

.appShellHome .homeRank .rankSub {
    color: var(--app-sub);
}

.rankTabsBlock {
    padding: 18px;
}

.rankTabs {
    gap: 8px;
    margin: -2px 0 17px;
    padding: 2px 0 4px;
}

.rankTab {
    min-height: 36px;
    padding: 0 15px;
    color: #6d7d92;
    background: #f1f6ff;
    border: 1px solid rgba(47, 111, 255, .08);
}

.rankTab.active {
    color: #fff;
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
    box-shadow: 0 12px 22px rgba(47, 111, 255, .18);
}

.appShellHome .homeRank .rankList {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px 14px;
}

.appShellHome .homeRank .rankItem {
    min-width: 0;
}

.appShellHome .homeRank .rankPoster {
    overflow: hidden;
    border-radius: 14px;
    background: linear-gradient(145deg, #dbe9ff, #f6f9ff);
    box-shadow: 0 10px 22px rgba(47, 99, 172, .12);
}

.appShellHome .homeRank .rankNo {
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
    box-shadow: 0 8px 16px rgba(47, 111, 255, .18);
}

.appShellHome .homeRank .rankBadge {
    background: rgba(255, 88, 67, .94);
}

.appShellHome .homeRank .rankName {
    color: var(--app-ink);
    font-weight: 1000;
}

.appShellHome .homeRank .rankMeta {
    gap: 5px;
}

.appShellHome .homeRank .hotPill,
.appShellHome .homeRank .scorePill {
    color: var(--app-primary);
    background: var(--app-primary-soft);
    border: 1px solid rgba(47, 111, 255, .08);
}

.appShellHome .homeRank .rankDesc,
.appShellHome .homeRank .rankCast {
    color: var(--app-sub);
}

.homeRank .rankList.simple {
    gap: 8px;
}

.homeRank .rankItem.simple {
    border: 1px solid rgba(47, 111, 255, .08);
    background: #f7faff;
}

.homeRank .rankItem.simple:hover {
    background: #eef5ff;
}

.homeRank .rankItem.simple .rankNo {
    background: rgba(47, 111, 255, .10);
    color: var(--app-primary);
    box-shadow: none;
}

.appShellList .appSearchTop {
    position: relative;
    z-index: 80;
    width: min(var(--app-home-width), calc(100% - 32px));
    margin: 0 auto 18px;
    padding-top: 8px;
}

.appShellList .searchList .search {
    margin-top: 0;
}

.appShellList .appListBox,
.appShellDetail .appDetailBox {
    width: min(var(--app-wide-width), calc(100% - 32px));
    margin-top: 0;
}

.appShellList .screen {
    display: none;
}

.appShellList .appListBox .left,
.appShellDetail .appDetailBox .left {
    max-width: none;
}

.appShellList .right,
.appShellDetail .right {
    width: 260px;
}

.appShellList .resultBoard {
    padding: 18px 20px;
    border: 1px solid rgba(47, 111, 255, .10);
    border-radius: 22px;
    background: rgba(255, 255, 255, .94);
    box-shadow: var(--app-shadow-soft);
}

.resultCountLine {
    margin: 18px 2px 16px;
    color: var(--app-sub);
}

.resultCountLine b {
    color: var(--app-primary);
}

.appShellList .researchBtn {
    color: var(--app-primary);
}

.appShellList .switch-items,
.appShellList .filterTabs a {
    border-color: rgba(47, 111, 255, .10);
    background: #f7faff;
}

.appShellList .appSourceSwitch .switch-items a.active,
.appShellList .filterTabs a.active {
    color: #fff;
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
    box-shadow: 0 8px 18px rgba(47, 111, 255, .16);
}

.appShellList .listBox .left .list .item.appResultItem {
    border: 1px solid rgba(47, 111, 255, .09);
    background: rgba(255, 255, 255, .95);
    box-shadow: var(--app-shadow-soft);
}

.appShellList .listBox .left .list .item.appResultItem::before {
    display: none;
}

.appShellList .listBox .left .list .item.appResultItem:hover {
    transform: translateY(-1px);
    border-color: rgba(47, 111, 255, .18);
    box-shadow: 0 18px 42px rgba(47, 99, 172, .13);
}

.appShellList .resultPanIcon,
.appShellList .webResultItem .resultPanIcon {
    color: var(--app-primary);
    background: var(--app-primary-soft);
}

.appShellList .source-badge {
    color: var(--app-primary);
    background: var(--app-primary-soft);
    border-color: rgba(47, 111, 255, .10);
}

.source-badge.panBadge-0 {
    color: #2f6fff;
    background: rgba(47, 111, 255, .10);
    border-color: rgba(47, 111, 255, .14);
}

.source-badge.panBadge-1 {
    color: #7b55e7;
    background: rgba(123, 85, 231, .10);
    border-color: rgba(123, 85, 231, .16);
}

.source-badge.panBadge-2 {
    color: #1d84ff;
    background: rgba(29, 132, 255, .10);
    border-color: rgba(29, 132, 255, .16);
}

.source-badge.panBadge-3 {
    color: #ff7a1a;
    background: rgba(255, 122, 26, .12);
    border-color: rgba(255, 122, 26, .18);
}

.source-badge.panBadge-4 {
    color: #20a66a;
    background: rgba(32, 166, 106, .11);
    border-color: rgba(32, 166, 106, .17);
}

.appShellList .webResultItem .source-badge {
    color: #fff;
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
}

.appShellList .resultMetaLine span {
    color: #6a7b91;
    background: #f1f6ff;
}

.appShellList .resultMetaLine span:nth-child(2) {
    color: var(--app-primary);
    background: var(--app-primary-soft);
}

.appShellList .listBox .left .list .item.appResultItem .btns .btn {
    color: var(--app-primary);
    border-color: rgba(47, 111, 255, .20);
}

.appShellList .listBox .left .list .item.appResultItem .btns .btn:hover,
.appShellList .listBox .left .list .item.appResultItem .btns .btnPrimary,
.appShellList .listBox .left .list .item.appResultItem:not(.webResultItem) .btns .btn:nth-child(3),
.appShellList .listBox .left .list .item.webResultItem .btns .btn {
    color: #fff;
    border-color: transparent;
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
    box-shadow: 0 10px 22px rgba(47, 111, 255, .20);
}

.appShellDetail .detailHeader {
    width: min(760px, 100%);
    margin: 0 auto 14px;
    color: var(--app-ink);
}

.appShellDetail .appDetailBox {
    justify-content: center;
}

.appShellDetail .detailHeader {
    display: flex;
    align-items: center;
    min-height: 50px;
    padding: 8px;
    border: 1px solid rgba(47, 111, 255, .10);
    border-radius: 18px;
    background: rgba(255, 255, 255, .82);
    box-shadow: var(--app-shadow-soft);
}

.appShellDetail .detailHeader .backBtn {
    flex: none;
    width: 38px;
    height: 38px;
    border-radius: 14px;
    color: var(--app-primary);
    background: rgba(47, 111, 255, .09);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    line-height: 1;
    font-weight: 900;
    transition: transform .18s ease, background-color .18s ease;
}

.appShellDetail .detailHeader .backBtn:hover {
    transform: translateX(-2px);
    background: rgba(47, 111, 255, .14);
}

.appShellDetail .detailHeader > div {
    min-width: 0;
}

.appShellDetail .detailHeader strong {
    display: block;
    font-size: 17px;
    line-height: 1.2;
}

.appShellDetail .detailHeader span {
    display: block;
    margin-top: 3px;
    color: #8190a5;
    font-size: 12px;
    font-weight: 800;
}

.appShellDetail .right {
    display: none;
}

.appShellDetail .appDetailCard,
.appShellDetail .samelistBox {
    width: min(760px, 100%);
    margin-left: auto;
    margin-right: auto;
    border: 1px solid rgba(47, 111, 255, .10);
    background: rgba(255, 255, 255, .95);
    box-shadow: var(--app-shadow-2);
}

.appShellDetail .appDetailCard::before {
    display: none;
}

.appShellDetail .detailPills span:not(.source-badge),
.appShellDetail .appDetailCard .cat .r,
.appShellDetail .appDetailCard .cat .l {
    color: var(--app-sub);
}

.appShellDetail .appDetailCard .title,
.appShellDetail .detailHeader strong {
    color: var(--app-ink);
}

.appShellDetail .diskIcon {
    color: var(--app-primary);
}

.appShellDetail .samelistNav {
    width: min(760px, 100%);
    margin-left: auto;
    margin-right: auto;
    color: var(--app-ink);
}

.appShellList .right .nav,
.appShellDetail .right .nav {
    border: 1px solid rgba(47, 111, 255, .10);
    border-radius: 18px 18px 0 0;
    color: var(--app-ink);
    background: linear-gradient(145deg, #ffffff, #f3f8ff);
    box-shadow: var(--app-shadow-soft);
}

.appShellList .right .box,
.appShellDetail .right .box {
    border: 1px solid rgba(47, 111, 255, .10);
    border-top: 0;
    border-radius: 0 0 18px 18px;
    background: rgba(255, 255, 255, .94);
    box-shadow: var(--app-shadow-soft);
}

.appShellList .right .list .item,
.appShellDetail .right .list .item,
.appShellDetail .samelist .item {
    color: #586a83;
}

.appShellList .right .list .item:hover,
.appShellDetail .right .list .item:hover,
.appShellDetail .samelist .item:hover {
    color: var(--app-primary);
    background: rgba(47, 111, 255, .07);
}

.appShellList .right .list .item p span,
.appShellDetail .right .list .item p span,
.appShellDetail .samelist .item p span {
    color: var(--app-primary);
    background: rgba(47, 111, 255, .10);
}

.appShellList .right .list .item:nth-child(1) p span,
.appShellDetail .right .list .item:nth-child(1) p span,
.appShellDetail .samelist .item:nth-child(1) p span {
    color: #fff;
    background: linear-gradient(135deg, #ff715c, #ff9f43);
}

.appShellList .right .list .item:nth-child(2) p span,
.appShellDetail .right .list .item:nth-child(2) p span,
.appShellDetail .samelist .item:nth-child(2) p span {
    color: #fff;
    background: linear-gradient(135deg, #7c8ba0, #b8c4d6);
}

.appShellList .right .list .item:nth-child(3) p span,
.appShellDetail .right .list .item:nth-child(3) p span,
.appShellDetail .samelist .item:nth-child(3) p span {
    color: #fff;
    background: linear-gradient(135deg, #f0a020, #ffd076);
}

.request-card,
.emptyRequestCard {
    border: 1px solid rgba(47, 111, 255, .10);
    background: rgba(255, 255, 255, .94);
    box-shadow: var(--app-shadow-soft);
}

.request-card strong {
    color: var(--app-ink);
}

.request-card span {
    color: var(--app-sub);
}

.soft-btn {
    color: var(--app-primary);
    border-color: rgba(47, 111, 255, .16);
    background: #f4f8ff;
}

.soft-btn.primary,
.layerBox .vbtn,
.details .btns .btn.btnCol,
.details .btns .btn:hover {
    color: #fff;
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
}

.details .btns .btn {
    color: var(--app-primary);
    border: 1px solid rgba(47, 111, 255, .14);
    background: #f5f8ff;
}

.dialogUrlBox .el-dialog,
.el-dialog {
    border-radius: 20px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 24px 64px rgba(47, 99, 172, .18);
}

.dialogUrlBox .dialogUrl .title,
.layerBox .vname {
    color: var(--app-ink);
}

.dialogUrlBox .dialogUrl .title span,
.dialogUrlBox .dialogUrl .nav .item a {
    color: var(--app-primary);
}

.dialogUrlBox .dialogUrl .statement {
    border-color: rgba(47, 111, 255, .10);
    background: #f5f8ff;
}

/* 第五轮反馈修复：搜索范围、分页、切换强调、详情减重和移动端卡片。 */
.searchScope {
    flex: none;
    display: inline-flex;
    align-items: center;
    height: calc(100% - 14px);
    margin-left: 8px;
    padding: 4px;
    border-radius: 999px;
    background: #eef5ff;
    border: 1px solid rgba(47, 111, 255, .09);
}

.searchScope button {
    flex: none;
    min-width: 52px;
    height: 32px;
    padding: 0 12px;
    border: 0;
    border-radius: 999px;
    color: #718199;
    font-size: 13px;
    font-weight: 1000;
    background: transparent;
    cursor: pointer;
    transition: color .18s ease, background-color .18s ease, box-shadow .18s ease;
}

.searchScope button.active {
    color: #fff;
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
    box-shadow: 0 8px 16px rgba(47, 111, 255, .18);
}

.homeStats .statCard b::after {
    display: none;
}

.searchAssist .hotSearch {
    position: relative;
    z-index: 1;
}

.searchAssist .search {
    position: relative;
    z-index: 30;
    overflow: visible;
}

.searchAssist .searchHistoryPanel {
    z-index: 5000;
}

.appShellList .appSourceSwitch {
    grid-template-columns: 96px minmax(0, 1fr);
    padding: 14px;
    border: 1px solid rgba(47, 111, 255, .10);
    border-radius: 18px;
    background: linear-gradient(145deg, #fff, #f4f8ff);
}

.appShellList .appSourceSwitch .switch-items {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: min(360px, 100%);
    justify-self: start;
    padding: 5px;
    background: #edf4ff;
}

.appShellList .appSourceSwitch .switch-items a {
    justify-content: center;
    min-height: 40px;
    font-size: 14px;
    font-weight: 1000;
}

.appShellList .appSourceSwitch .switch-items a:not(.active) {
    color: #6a7b91;
}

.appShellList .appSourceSwitch .switch-items a:nth-child(2):not(.active)::after {
    content: "可试";
    margin-left: 6px;
    padding: 1px 6px;
    border-radius: 999px;
    color: var(--app-primary);
    background: rgba(47, 111, 255, .10);
    font-size: 11px;
    font-weight: 1000;
}

.el-pagination.is-background .btn-next,
.el-pagination.is-background .btn-prev,
.el-pagination.is-background .el-pager li {
    min-width: 34px;
    height: 34px;
    line-height: 34px;
    border: 1px solid rgba(47, 111, 255, .10);
    border-radius: 10px;
    color: #60718a;
    background: #f5f8ff;
    box-shadow: none;
}

.el-pagination.is-background button,
.el-pagination.is-background .el-pager li.number,
.el-pagination.is-background .el-pager li.more {
    color: #60718a;
    background-color: #f5f8ff;
}

.el-pagination.is-background button:hover,
.el-pagination.is-background .el-pager li.number:hover,
.el-pagination.is-background .el-pager li.more:hover {
    color: var(--app-primary);
    background-color: rgba(47, 111, 255, .08);
}

.el-pagination .el-icon {
    color: inherit;
}

.el-pagination.is-background .btn-next.is-disabled,
.el-pagination.is-background .btn-next:disabled,
.el-pagination.is-background .btn-prev.is-disabled,
.el-pagination.is-background .btn-prev:disabled,
.el-pagination.is-background .el-pager li.is-disabled,
.el-pagination.is-background .el-pager li:disabled {
    color: #a9b6c6;
    background: #f6f9ff;
}

.el-pagination.is-background .btn-next.is-active,
.el-pagination.is-background .btn-prev.is-active,
.el-pagination.is-background .el-pager li.is-active,
.el-pager li.is-active,
.el-pager li:hover {
    color: #fff;
    border-color: transparent;
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
}

.el-pagination.is-background .el-pager li.is-active:hover {
    color: #fff;
}

.appShellDetail .detailHeader {
    gap: 10px;
    margin-bottom: 10px;
}

.appShellDetail .detailHeader .backBtn {
    width: 34px;
    height: 34px;
    color: var(--app-primary);
    background: rgba(47, 111, 255, .08);
}

.appShellDetail .detailHeader strong {
    font-size: 18px;
}

.appShellDetail .detailHeader span {
    display: none;
}

.appShellDetail .appDetailCard {
    padding: 22px;
}

.appShellDetail .appDetailCard::before {
    display: none;
}

.appShellDetail .detailIntro {
    margin-bottom: 8px;
    padding-bottom: 12px;
}

.appShellDetail .appDetailCard .title {
    font-size: 21px;
    line-height: 1.45;
}

.appShellDetail .detailPills {
    gap: 8px;
    margin-top: 10px;
}

.appShellDetail .detailPills span {
    min-height: 26px;
    padding: 0 10px;
    border-radius: 999px;
}

.appShellDetail .appDetailCard .cat {
    min-height: 44px;
    padding: 10px 0;
}

.appShellDetail .statusBox {
    margin: 10px 0 4px;
}

.appShellDetail .linkStatusBox.statusBox {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px 14px;
    min-height: 0;
    padding: 12px 14px;
    border-radius: 16px;
}

.appShellDetail .linkStatusBox.statusBox::before,
.appShellDetail .linkStatusBox.statusBox::after {
    display: none;
}

.appShellDetail .linkStatusBox.statusBox .statusMain {
    min-height: 0;
    font-size: 14px;
    line-height: 1.3;
}

.appShellDetail .linkStatusBox.statusBox .statusDot {
    display: inline-flex;
}

.appShellDetail .linkStatusBox.statusBox .statusText {
    grid-column: 1 / 2;
    margin-top: 0;
    font-size: 12px;
    line-height: 1.45;
}

.appShellDetail .linkStatusBox.statusBox .invalidBtn {
    grid-column: 2 / 3;
    grid-row: 1 / 3;
    align-self: center;
    margin-top: 0;
    min-height: 34px;
    padding: 0 14px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

.appShellDetail .detailHeader span {
    display: block;
}

.appShellDetail .appDetailCard .btns {
    margin-top: 16px;
}

@keyframes appStatFlow {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 180% 50%;
    }
}

@keyframes appCursorBlink {
    0%,
    48% {
        opacity: 1;
    }
    49%,
    100% {
        opacity: .12;
    }
}
.noticeOverlay {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(15, 23, 42, 0.34);
    backdrop-filter: blur(12px);
}

.noticePopup {
    position: relative;
    width: min(500px, 100%);
    overflow: hidden;
    border: 1px solid rgba(125, 166, 255, 0.22);
    border-radius: 30px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.94) 0%, rgba(245, 250, 255, 0.98) 100%),
        linear-gradient(135deg, rgba(77, 139, 255, 0.16), rgba(0, 169, 159, 0.12));
    box-shadow: 0 28px 70px rgba(35, 86, 152, 0.24);
    animation: noticePopIn .22s ease-out;
}

.noticePopupHalo {
    position: absolute;
    top: -120px;
    right: -90px;
    width: 240px;
    height: 240px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0, 169, 159, 0.22) 0%, rgba(40, 124, 255, 0.08) 48%, rgba(255,255,255,0) 70%);
    pointer-events: none;
}

.noticeClose {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 2;
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 50%;
    color: #64748b;
    background: rgba(255, 255, 255, 0.86);
    box-shadow: 0 10px 24px rgba(87, 112, 148, 0.18);
    cursor: pointer;
}

.noticePopupImage {
    margin: 18px 0;
    aspect-ratio: 16 / 8;
    overflow: hidden;
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(60, 130, 246, 0.14), rgba(0, 169, 159, 0.14));
}

.noticePopupImage img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.noticePopupBody {
    position: relative;
    z-index: 1;
    padding: 26px;
}

.noticePopupTop {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
}

.noticePopupIcon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 18px;
    color: #fff;
    font-size: 20px;
    font-weight: 800;
    background: linear-gradient(135deg, #287cff 0%, #00a99f 100%);
    box-shadow: 0 14px 30px rgba(40, 124, 255, 0.24);
}

.noticePopupBadge,
.noticeMeta span {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 700;
    color: #1d70d6;
    background: rgba(69, 132, 255, 0.11);
}

.noticePopup h2 {
    margin: 8px 0 0;
    color: #111827;
    font-size: 24px;
    line-height: 1.25;
    letter-spacing: 0;
}

.noticePopup p {
    margin: 0;
    color: #64748b;
    font-size: 15px;
    line-height: 1.8;
}

.noticePopupActions {
    display: flex;
    gap: 12px;
    margin-top: 22px;
}

.noticeGhostBtn,
.noticePrimaryBtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    flex: 1;
    border: 0;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
}

.noticeGhostBtn {
    color: #607086;
    background: #eef4fb;
}

.noticePrimaryBtn {
    color: #fff;
    background: linear-gradient(135deg, #287cff 0%, #00a99f 100%);
    box-shadow: 0 12px 28px rgba(40, 124, 255, 0.24);
    text-decoration: none;
}

.noticePage {
    width: min(920px, calc(100% - 32px));
    margin: 24px auto 56px;
}

.noticeHeader {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
    color: #64748b;
    font-size: 14px;
}

.noticeBack {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    padding: 0 16px;
    border-radius: 999px;
    color: #1d70d6;
    background: rgba(255, 255, 255, 0.82);
    box-shadow: 0 10px 24px rgba(77, 124, 176, 0.12);
}

.noticeDetailCard {
    overflow: hidden;
    border-radius: 30px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 24px 60px rgba(36, 94, 160, 0.14);
}

.noticeDetailBody {
    padding: 34px;
}

.noticeMeta {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.noticeDetailBody h1 {
    margin: 0;
    color: #0f172a;
    font-size: 30px;
    line-height: 1.28;
    letter-spacing: 0;
}

.noticeSummary {
    margin: 14px 0 24px;
    color: #64748b;
    font-size: 16px;
    line-height: 1.8;
}

.noticeContent {
    color: #26354a;
    font-size: 16px;
    line-height: 1.9;
}

.noticeContent img {
    max-width: 100%;
    border-radius: 18px;
}

@keyframes noticePopIn {
    from {
        opacity: 0;
        transform: translateY(18px) scale(0.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* 首页统计和全网搜索等待态微调：压缩信息密度，减少视觉噪音。 */
.appShellHome .homeStats {
    max-width: none;
    margin: 12px auto 0;
    gap: 10px;
}

.appShellHome .homeStats .statCard {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 8px;
    min-height: 54px;
    padding: 11px 14px;
    border-radius: 18px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .68), rgba(244, 249, 255, .48)),
        linear-gradient(135deg, rgba(47, 111, 255, .08), rgba(0, 169, 159, .06));
    backdrop-filter: blur(14px);
    box-shadow: 0 12px 30px rgba(47, 99, 172, .08);
}

.appShellHome .homeStats .statCard::before {
    inset: auto 14px 8px 14px;
    height: 2px;
    opacity: .42;
}

.appShellHome .homeStats .statCard span {
    color: #516176;
    font-size: 13px;
    letter-spacing: 0;
}

.appShellHome .homeStats .statCard b {
    display: inline;
    margin-top: 0;
    color: #1d70d6;
    font-size: 24px;
    line-height: 1;
}

.appShellHome .homeStats .statCard b::after {
    display: none;
}

.appShellHome .homeStats .statCard small {
    display: inline;
    margin-top: 0;
    font-size: 12px;
    color: #8a98aa;
}

.appShellHome .utilityGrid {
    max-width: none;
    margin: 10px auto 0;
}

.appShellHome .utilityCard {
    min-height: 78px;
    padding: 14px 16px;
    border-radius: 18px;
}

.appShellHome .utilityCard strong {
    font-size: 16px;
}

.appShellHome .utilityCard span {
    margin-top: 5px;
}

.appShellHome .utilityCard.groupCard {
    background: linear-gradient(135deg, #287cff 0%, #00a99f 100%);
}

.webLoading {
    position: relative;
    display: block;
    min-height: 88px;
    margin: 14px 0;
    padding: 20px 22px;
    overflow: hidden;
    border: 1px solid rgba(47, 111, 255, .12);
    border-radius: 22px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .94), rgba(244, 249, 255, .90)),
        linear-gradient(90deg, rgba(47, 111, 255, .08), rgba(0, 169, 159, .06));
    box-shadow: 0 14px 34px rgba(47, 99, 172, .10);
}

.webLoading::before {
    content: "";
    position: absolute;
    left: 22px;
    right: 22px;
    bottom: 18px;
    height: 8px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(47, 111, 255, .10);
}

.webLoading::after {
    content: "";
    position: absolute;
    left: 22px;
    bottom: 18px;
    width: 42%;
    height: 8px;
    border-radius: 999px;
    background: linear-gradient(90deg, #287cff 0%, #00a99f 100%);
    box-shadow: 0 0 18px rgba(40, 124, 255, .24);
    animation: webLoadingBar 1.35s ease-in-out infinite;
}

.webLoading .loader {
    display: none;
}

.webLoading p {
    position: relative;
    margin: 0;
    padding-left: 14px;
    color: #42526a;
    font-size: 14px;
    font-weight: 900;
    line-height: 1.5;
}

.webLoading p::before {
    content: "";
    position: absolute;
    left: 0;
    top: .55em;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #00a99f;
    box-shadow: 0 0 0 6px rgba(0, 169, 159, .12);
}

@keyframes webLoadingBar {
    0% {
        transform: translateX(0);
        width: 18%;
    }
    50% {
        width: 52%;
    }
    100% {
        transform: translateX(calc(100% + 44px));
        width: 18%;
    }
}