html,
body {
    margin: 0;
    font-size: 15px;
    font-family: v-sans, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", Segoe UI Symbol;
    line-height: 1.6;
    color: var(--theme-color);
    background-color: var(--theme-background);
    word-wrap: break-word;
}

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

.headBg {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    opacity: .3;
    background-repeat: repeat-x;
    background-size: 100% auto;
}

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;
}


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

.headerKox {
    height: 68px;
}

.headerBox .bg {
    position: absolute;
    inset: 0;
    box-shadow: 0 3px 5px rgba(214, 214, 214, .22);
    background-color: var(--theme-other_background);
    transition: 'opacity 0.2s';
}

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

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

.headerBox .box .logoBox .logo {
    height: 43px;
}

.headerBox .box .logoBox .title {
    margin-left: 18px;
    font-size: 20px;
    font-weight: bold;
}

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

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

.headerBox .box .navs .item,
.headerBox .box .navs a {
    padding: 4px 0;
    margin-left: 25px;
    cursor: pointer;
    white-space: nowrap;
}

.headerBox .box .navs .item:hover {
    color: var(--theme-theme);
}


.headerBox .box .search {
    position: relative;
    flex: 1;
    height: 40px;
    border-radius: 40px;
    display: flex;
    align-items: center;
    max-width: 400px;
    margin: 0 15px 0 auto;
    background-color: var(--theme-background);
}

.headerBox .box .search:after {
    content: "";
    position: absolute;
    inset: 0;
    box-shadow: 0 2px 4px var(--theme-theme);
    border-radius: 40px;
    border: 1px solid var(--theme-color);
    opacity: .05;
}

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

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

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


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

.homeBox .box {
    width: 680px;
    margin: auto;
}

.todayReco {
    width: 100%;
    margin: 14px auto 0;
    text-align: left;
    border-radius: 18px;
    background: var(--theme-other_background, #ffffff);
    background: color-mix(in srgb, var(--theme-other_background) 94%, transparent);
    border: 1px solid rgba(0, 0, 0, .06);
    box-shadow: 0 10px 24px rgba(0, 0, 0, .06);
    overflow: hidden;
}

.todayReco + .home {
    margin-top: 8px;
}

.todayReco .trHead {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px 10px;
}

.todayReco .trTitle {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .2px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.todayReco .trTitle::before {
    content: "";
    width: 18px;
    height: 18px;
    background: linear-gradient(135deg,
            color-mix(in srgb, var(--theme-theme) 82%, #60a5fa 18%),
            color-mix(in srgb, var(--theme-theme) 56%, #a78bfa 44%),
            color-mix(in srgb, var(--theme-theme) 72%, #22d3ee 28%));
    box-shadow: 0 12px 22px rgba(0, 0, 0, .12), 0 10px 20px color-mix(in srgb, var(--theme-theme) 18%, rgba(0, 0, 0, .10));
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27%23000%27%20fill-rule%3D%27evenodd%27%20d%3D%27M12%202a10%2010%200%201%201%200%2020a10%2010%200%200%201%200-20z%20M12%205a7%207%200%201%200%200%2014a7%207%200%200%200%200-14z%20M9.25%2013.5l2.55-6h.7l2.25%205.2l1.3-.75l-.8%201.5l.8%201.5l-1.3-.75l-2.25%205.2h-.7l-2.55-6z%27%20clip-rule%3D%27evenodd%27/%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
    mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27%23000%27%20fill-rule%3D%27evenodd%27%20d%3D%27M12%202a10%2010%200%201%201%200%2020a10%2010%200%200%201%200-20z%20M12%205a7%207%200%201%200%200%2014a7%207%200%200%200%200-14z%20M9.25%2013.5l2.55-6h.7l2.25%205.2l1.3-.75l-.8%201.5l.8%201.5l-1.3-.75l-2.25%205.2h-.7l-2.55-6z%27%20clip-rule%3D%27evenodd%27/%3E%3C/svg%3E");
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
}

.todayReco .trMarquee {
    position: relative;
    overflow: hidden;
    padding: 10px 8px 14px;
    mask-image: linear-gradient(to right, transparent 0, #000 24px, #000 calc(100% - 24px), transparent 100%);
    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 24px, #000 calc(100% - 24px), transparent 100%);
}

.todayReco .trTrack {
    display: flex;
    align-items: stretch;
    gap: 12px;
    width: max-content;
    animation: trScroll var(--tr-speed, 30s) linear infinite;
    will-change: transform;
}

.todayReco:hover .trTrack {
    animation-play-state: paused;
}

.todayReco .trItem {
    flex: 0 0 auto;
    width: 210px;
    border-radius: 14px;
    background-color: var(--theme-other_background, #ffffff);
    background:
        radial-gradient(220px 140px at 18% 0%, rgba(18, 90, 255, .18), rgba(0, 0, 0, 0) 70%),
        radial-gradient(240px 160px at 82% 10%, rgba(0, 200, 255, .12), rgba(0, 0, 0, 0) 72%),
        color-mix(in srgb, var(--theme-background) 92%, transparent);
    border: 1px solid rgba(0, 0, 0, .08);
    overflow: hidden;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    position: relative;
}

.todayReco .trItem:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, .10);
    border-color: rgba(0, 0, 0, .10);
}

.todayReco .trImg {
    position: relative;
    width: 100%;
    height: 124px;
    background: rgba(0, 0, 0, .04);
}

.todayReco .trImg::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(0, 0, 0, .0), rgba(0, 0, 0, .0) 55%, rgba(0, 0, 0, .22));
}

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

.todayReco .trBadges {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 2;
}

.todayReco .trBadge {
    --tr-badge-accent: rgba(0, 200, 255, .92);
    position: absolute;
    top: 10px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 4px 8px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .2px;
    color: rgba(255, 255, 255, .94);
    background: rgba(10, 12, 24, .38);
    border: 1px solid rgba(255, 255, 255, .14);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    text-shadow: 0 6px 16px rgba(0, 0, 0, .28);
    box-shadow: 0 8px 14px rgba(0, 0, 0, .10);
    max-width: calc(100% - 20px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.todayReco .trBadge::before {
    content: "";
    width: 2px;
    height: 12px;
    border-radius: 999px;
    background: var(--tr-badge-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--tr-badge-accent) 18%, transparent);
    flex: none;
}

.todayReco .trBadgeTop {
    --tr-badge-accent: rgba(255, 190, 90, .94);
    left: 10px;
}

.todayReco .trBadgeHot {
    --tr-badge-accent: rgba(255, 96, 96, .94);
    left: 10px;
    right: auto;
}

.todayReco .trBadgeEp {
    --tr-badge-accent: rgba(180, 190, 255, .94);
    right: 10px;
    left: auto;
    top: auto;
    bottom: 10px;
}

.todayReco .trTagRow {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: 2px;
    flex: none;
}

.todayReco .trChips {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    pointer-events: none;
    margin-top: 7px;
}

.todayReco .trChip2 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: 100%;
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 650;
    color: rgba(0, 0, 0, .66);
    background: rgba(0, 0, 0, .04);
    border: 1px solid rgba(0, 0, 0, .06);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-shadow: none;
}

.todayReco .trChipEp {
    color: rgba(0, 0, 0, .60);
}

.todayReco .trMeta {
    padding: 9px 12px 10px;
    background: var(--theme-other_background, #ffffff);
    background: color-mix(in srgb, var(--theme-other_background) 92%, transparent);
    border-top: 1px solid rgba(0, 0, 0, .06);
}

.todayReco .trCat {
    font-size: 12px;
    opacity: .58;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 2px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.todayReco .trChip {
    flex: none;
    font-size: 11px;
    font-weight: 800;
    padding: 3px 7px;
    border-radius: 999px;
    border: 1px solid rgba(0, 0, 0, .10);
    background: rgba(255, 255, 255, .60);
    color: rgba(0, 0, 0, .64);
}

html[data-theme="dark"] .todayReco .trChip {
    border-color: rgba(180, 190, 255, .14);
    background: rgba(10, 10, 26, .52);
    color: rgba(224, 224, 255, .74);
}

.todayReco .trName {
    font-size: 13px;
    font-weight: 750;
    line-height: 1.35;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.todayReco .trDesc {
    margin-top: 2px;
    font-size: 12px;
    line-height: 1.35;
    opacity: .62;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

html[data-theme="dark"] .hotHeroTab.active {
    color: rgba(255, 255, 255, .98);
    border-color: rgba(255, 255, 255, .28);
    background: linear-gradient(135deg, color-mix(in srgb, var(--theme-theme) 82%, #60a5fa 18%), color-mix(in srgb, var(--theme-theme) 72%, #a78bfa 28%));
    box-shadow: 0 20px 44px rgba(0, 0, 0, .44), 0 14px 34px color-mix(in srgb, var(--theme-theme) 26%, rgba(0, 0, 0, .22));
}

html[data-theme="dark"] .todayReco .trMeta {
    border-top-color: rgba(180, 190, 255, .10);
    background: color-mix(in srgb, var(--theme-other_background) 84%, rgba(10, 10, 26, .12));
}

html[data-theme="dark"] .todayReco .trChip2 {
    color: rgba(224, 224, 255, .78);
    background: rgba(180, 190, 255, .10);
    border-color: rgba(180, 190, 255, .14);
}

@keyframes trScroll {
    from {
        transform: translate3d(0, 0, 0);
    }
    to {
        transform: translate3d(-50%, 0, 0);
    }
}

@media (max-width: 768px) {
    .todayReco {
        width: calc(100% - 24px);
        margin: 10px auto 0;
        border-radius: 16px;
    }

    .todayReco .trMarquee {
        overflow-x: auto;
        overflow-y: hidden;
        padding: 10px 12px 14px;
        mask-image: none;
        -webkit-mask-image: none;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        overscroll-behavior-x: contain;
        touch-action: pan-x;
    }

    .todayReco .trMarquee::-webkit-scrollbar {
        display: none;
    }

    .todayReco .trTrack {
        animation: none;
        gap: 10px;
        padding-right: 12px;
    }

    .todayReco .trItem {
        width: clamp(148px, calc((100vw - 54px) / 2), 220px);
        scroll-snap-align: start;
    }

    .todayReco .trImg {
        height: 128px;
    }
}

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

.homeBox .logoBox .logo {
    height: 68px;
    margin: 0 8px;
}

.homeBox .logoBox .title {
    margin: 0 8px;
    font-size: 30px;
    font-weight: bold;
}

.homeBox .subTitle {
    padding: 10px 0 10px;
    opacity: .6;
}

.searchBox .search {
    position: relative;
    margin: auto;
    margin-top: 30px;
    background-color: var(--theme-other_background);
    box-shadow: 0 4px 10px rgba(225, 225, 225, 0.3);
    width: 100%;
    height: 54px;
    border-radius: 54px;
    display: flex;
    align-items: center;
}

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

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

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

.qVisuallyHidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

@media (min-width: 769px) {
    .homeBox.searchBox {
        margin-top: 10px;
        padding-top: 0;
        min-height: auto;
        padding-bottom: 22px;
    }

    .homeBox.searchBox .box {
        width: 100%;
    }

    .pcSearchGrid {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 340px;
        gap: 0;
        align-items: stretch;
        text-align: left;
        border-radius: 22px;
        padding: 22px;
        border: 1px solid color-mix(in srgb, var(--theme-other_background) 60%, rgba(0, 0, 0, .12));
        background: color-mix(in srgb, var(--theme-other_background) 92%, rgba(0, 0, 0, .04));
        box-shadow: 0 18px 50px rgba(0, 0, 0, .10);
        --pcAccent: color-mix(in srgb, var(--theme-theme) 72%, #8b5cf6 28%);
        --pcAccent2: color-mix(in srgb, var(--theme-theme) 66%, #60a5fa 34%);
    }

    .pcSearchMain {
        padding: 0 18px 0 0;
        border: none;
        background: transparent;
        box-shadow: none;
    }

    .pcSearchTop {
        display: flex;
        flex-direction: column;
        gap: 8px;
        padding-bottom: 12px;
    }

    .pcSearchBrand {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
    }

    .pcSearchTitle {
        margin: 0;
        font-size: 22px;
        font-weight: 800;
        letter-spacing: .2px;
        color: var(--theme-color);
        line-height: 1.2;
    }

    .pcSearchBadge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 32px;
        padding: 0 12px 0 10px;
        border-radius: 999px;
        font-size: 12px;
        font-weight: 900;
        letter-spacing: .2px;
        gap: 7px;
        color: color-mix(in srgb, var(--pcAccent) 82%, rgba(0, 0, 0, .22));
        background: linear-gradient(180deg, color-mix(in srgb, var(--pcAccent2) 16%, rgba(255, 255, 255, .78)), color-mix(in srgb, var(--pcAccent) 14%, rgba(255, 255, 255, .60)));
        border: 1px solid color-mix(in srgb, var(--pcAccent) 26%, rgba(0, 0, 0, .12));
        box-shadow: 0 16px 34px rgba(2, 10, 38, .08), inset 0 1px 0 rgba(255, 255, 255, .68);
        -webkit-backdrop-filter: blur(14px);
        backdrop-filter: blur(14px);
        user-select: none;
        white-space: nowrap;
        position: relative;
        overflow: hidden;
    }

    .pcSearchBadge::before {
        content: '';
        width: 14px;
        height: 14px;
        flex: 0 0 auto;
        background-color: currentColor;
        -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%27M12%202.2%20l7%203.8v6.2c0%205-3.2%209.1-7%2010.6C8.2%2021.3%205%2017.2%205%2012.2V6l7-3.8zm3.5%207.1-4.1%204.9-2.1-2.1-1.4%201.4%203.6%203.6%205.5-6.6-1.5-1.2z%27/%3E%3C/svg%3E");
        -webkit-mask-size: contain;
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-position: center;
        mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%27M12%202.2%20l7%203.8v6.2c0%205-3.2%209.1-7%2010.6C8.2%2021.3%205%2017.2%205%2012.2V6l7-3.8zm3.5%207.1-4.1%204.9-2.1-2.1-1.4%201.4%203.6%203.6%205.5-6.6-1.5-1.2z%27/%3E%3C/svg%3E");
        mask-size: contain;
        mask-repeat: no-repeat;
        mask-position: center;
        opacity: .92;
    }

    .pcSearchBadge::after {
        content: '';
        position: absolute;
        inset: 0;
        background: radial-gradient(120px 36px at 18% 20%, rgba(255, 255, 255, .34), transparent 62%);
        pointer-events: none;
        opacity: .60;
    }

    .pcSearchSub {
        font-size: 13px;
        line-height: 1.7;
        opacity: .78;
        color: var(--theme-color);
    }

    .pcSearchBarWrap {
        position: relative;
        margin-top: 8px;
    }

    .pcSearchBar {
        position: relative;
        height: 60px;
        display: flex;
        align-items: center;
        border-radius: 16px;
        padding: 0 16px 0 46px;
        border: 1px solid color-mix(in srgb, var(--pcAccent) 22%, rgba(0, 0, 0, .16));
        background: linear-gradient(180deg, color-mix(in srgb, var(--theme-other_background) 92%, rgba(255, 255, 255, .82)), color-mix(in srgb, var(--theme-other_background) 96%, rgba(0, 0, 0, .04)));
        box-shadow: 0 20px 48px rgba(2, 10, 38, .12), 0 10px 28px color-mix(in srgb, var(--pcAccent2) 16%, transparent);
        -webkit-backdrop-filter: blur(12px);
        backdrop-filter: blur(12px);
    }

    .pcSearchIcon {
        position: absolute;
        left: 16px;
        top: 50%;
        transform: translateY(-50%);
        font-size: 19px;
        color: color-mix(in srgb, var(--theme-color) 65%, rgba(255, 255, 255, .10));
        opacity: .9;
        pointer-events: none;
    }

    .pcSearchInput {
        flex: 1;
        height: 60px;
        border: none;
        outline: none;
        background: transparent;
        color: var(--theme-color);
        font-size: 16px;
        padding: 0 10px 0 0;
        box-sizing: border-box;
    }

    .pcSearchInput::placeholder {
        color: color-mix(in srgb, var(--theme-color) 50%, rgba(255, 255, 255, .10));
        opacity: .9;
    }

    .pcSearchBar:focus-within {
        border-color: color-mix(in srgb, var(--pcAccent) 52%, rgba(0, 0, 0, .10));
        box-shadow: 0 22px 52px rgba(2, 10, 38, .14), 0 0 0 3px color-mix(in srgb, var(--pcAccent) 22%, transparent);
    }

    .pcSearchClear {
        width: 34px;
        height: 34px;
        border-radius: 11px;
        border: 1px solid color-mix(in srgb, var(--theme-other_background) 55%, rgba(0, 0, 0, .18));
        background: color-mix(in srgb, var(--theme-other_background) 94%, rgba(0, 0, 0, .04));
        color: color-mix(in srgb, var(--theme-color) 70%, rgba(255, 255, 255, .10));
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        margin-right: 12px;
        user-select: none;
    }

    .pcSearchClear:hover {
        background: color-mix(in srgb, var(--theme-other_background) 86%, rgba(0, 0, 0, .08));
        border-color: color-mix(in srgb, var(--theme-theme) 24%, rgba(0, 0, 0, .18));
    }

    .pcSearchClear:active {
        transform: translateY(1px);
    }

    .pcSearchBtn {
        height: 48px;
        border: 1px solid color-mix(in srgb, var(--pcAccent) 40%, rgba(255, 255, 255, .22));
        border-radius: 14px;
        cursor: pointer;
        background: linear-gradient(180deg, color-mix(in srgb, var(--pcAccent2) 72%, rgba(255, 255, 255, .18)), color-mix(in srgb, var(--pcAccent) 90%, rgba(0, 0, 0, .14)));
        color: rgba(255, 255, 255, .96);
        font-size: 14px;
        font-weight: 800;
        letter-spacing: .3px;
        box-shadow: 0 14px 30px color-mix(in srgb, var(--pcAccent) 20%, rgba(0, 0, 0, .20)), inset 0 1px 0 rgba(255, 255, 255, .18);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        padding: 0 14px;
        min-width: 96px;
        position: relative;
        overflow: hidden;
    }

    .pcSearchBtn::before {
        content: '';
        position: absolute;
        inset: 0;
        background: linear-gradient(120deg, rgba(255, 255, 255, .38), rgba(255, 255, 255, 0) 55%);
        opacity: .22;
        pointer-events: none;
    }

    .pcSearchBtnIconSvg {
        width: 16px;
        height: 16px;
        display: block;
        opacity: .96;
    }

    .pcSearchBtnText {
        line-height: 1;
    }

    .pcSearchBtn:hover {
        filter: brightness(1.03) saturate(.95);
        box-shadow: 0 16px 40px color-mix(in srgb, var(--pcAccent) 22%, rgba(0, 0, 0, .18));
        transform: translateY(-1px);
    }

    .pcSearchBtn:active {
        transform: translateY(0);
        filter: brightness(.98);
    }

    .pcSearchBtn:focus-visible,
    .pcSearchClear:focus-visible,
    .pcHotTag:focus-visible,
    .pcPanelItem:focus-visible,
    .pcPanelDel:focus-visible,
    .pcPanelClearAll:focus-visible {
        outline: none;
        box-shadow: 0 0 0 3px color-mix(in srgb, var(--theme-theme) 34%, transparent);
    }

    .pcSearchPanel {
        position: absolute;
        left: 0;
        right: 0;
        top: calc(60px + 10px);
        border-radius: 14px;
        border: 1px solid color-mix(in srgb, var(--theme-other_background) 55%, rgba(0, 0, 0, .16));
        background: color-mix(in srgb, var(--theme-other_background) 96%, rgba(0, 0, 0, .04));
        box-shadow: 0 22px 60px rgba(0, 0, 0, .18);
        overflow: hidden;
        z-index: 50;
    }

    .pcPanelHead {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 10px 12px;
        border-bottom: 1px solid color-mix(in srgb, var(--theme-other_background) 55%, rgba(0, 0, 0, .12));
    }

    .pcPanelTitle {
        font-size: 12px;
        font-weight: 800;
        letter-spacing: .2px;
        color: color-mix(in srgb, var(--theme-color) 82%, rgba(255, 255, 255, .10));
        opacity: .9;
    }

    .pcPanelClearAll {
        border: 1px solid color-mix(in srgb, var(--theme-other_background) 55%, rgba(0, 0, 0, .16));
        background: transparent;
        color: color-mix(in srgb, var(--theme-color) 74%, rgba(255, 255, 255, .10));
        padding: 6px 10px;
        border-radius: 10px;
        cursor: pointer;
        font-size: 12px;
        font-weight: 700;
    }

    .pcPanelClearAll:hover {
        border-color: color-mix(in srgb, var(--theme-theme) 22%, rgba(0, 0, 0, .16));
        background: color-mix(in srgb, var(--theme-other_background) 90%, rgba(0, 0, 0, .06));
    }

    .pcPanelBody {
        max-height: 240px;
        overflow: auto;
        padding: 8px;
    }

    .pcPanelBody::-webkit-scrollbar {
        width: 8px;
    }

    .pcPanelBody::-webkit-scrollbar-thumb {
        background: color-mix(in srgb, var(--theme-color) 16%, transparent);
        border-radius: 999px;
    }

    .pcPanelItem {
        width: 100%;
        text-align: left;
        border: 1px solid transparent;
        background: transparent;
        color: var(--theme-color);
        padding: 10px 10px;
        border-radius: 12px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
    }

    .pcPanelItem:hover {
        background: color-mix(in srgb, var(--theme-other_background) 88%, rgba(0, 0, 0, .08));
    }

    .pcPanelItem.active {
        border-color: color-mix(in srgb, var(--theme-theme) 28%, rgba(0, 0, 0, .10));
        background: color-mix(in srgb, var(--theme-theme) 12%, color-mix(in srgb, var(--theme-other_background) 92%, rgba(0, 0, 0, .06)));
    }

    .pcPanelText {
        font-size: 13px;
        font-weight: 700;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .pcPanelActions {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        flex: 0 0 auto;
    }

    .pcPanelDel {
        border: 1px solid color-mix(in srgb, var(--theme-other_background) 55%, rgba(0, 0, 0, .16));
        background: transparent;
        color: color-mix(in srgb, var(--theme-color) 70%, rgba(255, 255, 255, .10));
        padding: 5px 8px;
        border-radius: 10px;
        cursor: pointer;
        font-size: 12px;
        font-weight: 700;
    }

    .pcPanelDel:hover {
        border-color: color-mix(in srgb, var(--theme-theme) 22%, rgba(0, 0, 0, .16));
        background: color-mix(in srgb, var(--theme-other_background) 90%, rgba(0, 0, 0, .06));
    }

    .pcPanelLoading,
    .pcPanelEmpty {
        padding: 14px 12px;
        font-size: 12px;
        opacity: .72;
        color: var(--theme-color);
    }

    .pcSearchSecondary {
        margin-top: 14px;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .pcHotRow {
        display: flex;
        gap: 12px;
        align-items: flex-start;
    }

    .pcHotLabel {
        flex: 0 0 auto;
        font-size: 12px;
        font-weight: 800;
        opacity: .86;
        color: var(--theme-color);
        padding-top: 6px;
        width: 60px;
    }

    .pcHotCloud {
        flex: 1;
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 8px;
    }

    .pcHotTag {
        border: 1px solid rgba(0, 0, 0, .08);
        background: color-mix(in srgb, var(--theme-other_background) 98%, rgba(0, 0, 0, .02));
        color: var(--theme-color);
        border-radius: 999px;
        padding: 10px 12px;
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        min-width: 0;
        box-sizing: border-box;
        transition: transform .12s ease, background .12s ease, border-color .12s ease, box-shadow .12s ease;
    }

    .pcHotTag:hover {
        border-color: color-mix(in srgb, var(--theme-theme) 20%, rgba(0, 0, 0, .18));
        background: color-mix(in srgb, var(--theme-other_background) 86%, rgba(0, 0, 0, .06));
        transform: translateY(-1px);
        box-shadow: 0 12px 26px rgba(0, 0, 0, .10);
    }

    .pcHotTag:active {
        transform: translateY(0);
    }

    .pcHotText {
        font-size: 12px;
        font-weight: 700;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        min-width: 0;
        max-width: 100%;
    }

    .pcHotHeat {
        flex: 0 0 auto;
        display: inline-flex;
        align-items: center;
        gap: 4px;
        font-size: 11px;
        font-weight: 900;
        color: rgba(255, 255, 255, .96);
        padding: 0 9px 0 7px;
        height: 22px;
        line-height: 22px;
        border-radius: 999px;
        background: linear-gradient(180deg, color-mix(in srgb, var(--theme-theme) 78%, #60a5fa 22%), color-mix(in srgb, var(--theme-theme) 92%, #0b1220 8%));
        border: 1px solid color-mix(in srgb, var(--theme-theme) 52%, rgba(255, 255, 255, .22));
        box-shadow: 0 10px 18px color-mix(in srgb, var(--theme-theme) 18%, rgba(0, 0, 0, .16)), inset 0 1px 0 rgba(255, 255, 255, .22);
    }

    .pcHotHeat::before {
        content: '';
        width: 12px;
        height: 12px;
        flex: 0 0 auto;
        background-color: currentColor;
        -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%27M13.5%202c.3%202.3-.7%204.4-2.3%205.8C9.7%209.3%209%2010.4%209%2012c0%202%201.6%203.5%203.6%203.5%202.4%200%204.4-2%204.4-4.7%200-1.7-.6-3.1-1.5-4.3%202.7%201.5%204.5%204.3%204.5%207.7%200%204.4-3.3%207.8-7.4%207.8C8.5%2022%205%2018.6%205%2014.3c0-3.5%202.3-6.2%204.7-8.4C11.5%204.4%2012.8%203.3%2013.5%202z%27/%3E%3C/svg%3E");
        -webkit-mask-size: contain;
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-position: center;
        mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%27M13.5%202c.3%202.3-.7%204.4-2.3%205.8C9.7%209.3%209%2010.4%209%2012c0%202%201.6%203.5%203.6%203.5%202.4%200%204.4-2%204.4-4.7%200-1.7-.6-3.1-1.5-4.3%202.7%201.5%204.5%204.3%204.5%207.7%200%204.4-3.3%207.8-7.4%207.8C8.5%2022%205%2018.6%205%2014.3c0-3.5%202.3-6.2%204.7-8.4C11.5%204.4%2012.8%203.3%2013.5%202z%27/%3E%3C/svg%3E");
        mask-size: contain;
        mask-repeat: no-repeat;
        mask-position: center;
        opacity: .9;
    }

    @media (min-width: 1400px) {
        .pcHotCloud {
            grid-template-columns: repeat(5, minmax(0, 1fr));
        }
    }

    .pcSearchHint {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 8px 10px;
        border-radius: 12px;
        border: 1px solid color-mix(in srgb, var(--theme-theme) 16%, rgba(0, 0, 0, .10));
        background: color-mix(in srgb, var(--theme-theme) 6%, var(--theme-other_background));
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .60);
        font-size: 12px;
        font-weight: 700;
        opacity: 1;
        color: color-mix(in srgb, var(--theme-color) 92%, rgba(0, 0, 0, .10));
        padding-left: 10px;
    }

    .pcSearchHint::before {
        content: '';
        width: 16px;
        height: 16px;
        flex: 0 0 auto;
        background-color: var(--theme-theme);
        -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%27M4%206a2%202%200%200%201%202-2h12a2%202%200%200%201%202%202v12a2%202%200%200%201-2%202H6a2%202%200%200%201-2-2V6zm2%200v12h12V6H6zm6%203h2v4h2l-4%204-4-4h2V9h2z%27/%3E%3C/svg%3E");
        -webkit-mask-size: contain;
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-position: center;
        mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%27M4%206a2%202%200%200%201%202-2h12a2%202%200%200%201%202%202v12a2%202%200%200%201-2%202H6a2%202%200%200%201-2-2V6zm2%200v12h12V6H6zm6%203h2v4h2l-4%204-4-4h2V9h2z%27/%3E%3C/svg%3E");
        mask-size: contain;
        mask-repeat: no-repeat;
        mask-position: center;
        opacity: .95;
    }

    .pcSearchSide {
        display: flex;
        flex-direction: column;
        gap: 12px;
        padding-left: 18px;
        border-left: 1px solid color-mix(in srgb, var(--theme-other_background) 55%, rgba(0, 0, 0, .12));
    }

    .pcInfoCard {
        border-radius: 16px;
        padding: 14px 14px 12px;
        border: 1px solid rgba(0, 0, 0, .08);
        background: color-mix(in srgb, var(--theme-other_background) 98%, rgba(0, 0, 0, .02));
        box-shadow: none;
        text-align: left;
        transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease, background .14s ease;
    }

    .pcInfoCard:hover {
        transform: translateY(-1px);
        border-color: color-mix(in srgb, var(--theme-theme) 22%, rgba(0, 0, 0, .16));
        box-shadow: 0 14px 40px rgba(0, 0, 0, .10);
    }

    .pcInfoHead {
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .pcInfoIcon {
        width: 30px;
        height: 30px;
        border-radius: 12px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: var(--theme-theme);
        background: color-mix(in srgb, var(--theme-theme) 14%, rgba(0, 0, 0, .06));
        border: 1px solid color-mix(in srgb, var(--theme-theme) 22%, rgba(0, 0, 0, .10));
        flex: 0 0 auto;
    }

    .pcInfoIcon svg {
        width: 16px;
        height: 16px;
        display: block;
    }

    .pcInfoTitle {
        font-size: 12px;
        font-weight: 800;
        opacity: .78;
        color: var(--theme-color);
    }

    .pcInfoValue {
        margin-top: 10px;
        font-size: 22px;
        font-weight: 900;
        letter-spacing: .3px;
        color: var(--theme-color);
        line-height: 1.1;
    }

    .pcInfoDesc {
        margin-top: 8px;
        font-size: 12px;
        line-height: 1.6;
        opacity: .72;
        color: var(--theme-color);
    }

html[data-theme="dark"] .pcSearchGrid {
    border-color: rgba(255, 255, 255, .10);
    background: rgba(255, 255, 255, .04);
    box-shadow: 0 18px 60px rgba(0, 0, 0, .34);
}

    html[data-theme="dark"] .pcSearchTitle {
        color: rgba(235, 238, 255, .94);
    }

    html[data-theme="dark"] .pcSearchSub {
        color: rgba(224, 224, 255, .72);
        opacity: 1;
    }

    html[data-theme="dark"] .pcSearchBadge {
        color: rgba(235, 238, 255, .92);
        background: color-mix(in srgb, var(--theme-theme) 14%, rgba(255, 255, 255, .10));
        border-color: rgba(255, 255, 255, .16);
        box-shadow: 0 16px 36px rgba(0, 0, 0, .36), inset 0 1px 0 rgba(255, 255, 255, .10);
    }

    html[data-theme="dark"] .pcSearchBadge::after {
        opacity: .22;
    }

    html[data-theme="dark"] .pcSearchBadge::before {
        opacity: .88;
    }

    html[data-theme="dark"] .pcSearchBar {
        border-color: rgba(255, 255, 255, .14);
        background: rgba(255, 255, 255, .06);
        box-shadow: 0 22px 60px rgba(0, 0, 0, .46), 0 0 0 1px rgba(255, 255, 255, .04) inset;
        -webkit-backdrop-filter: blur(14px);
        backdrop-filter: blur(14px);
    }

    html[data-theme="dark"] .pcSearchBar:focus-within {
        border-color: color-mix(in srgb, var(--theme-theme) 46%, rgba(255, 255, 255, .18));
        box-shadow: 0 26px 68px rgba(0, 0, 0, .56), 0 0 0 3px color-mix(in srgb, var(--theme-theme) 26%, transparent);
    }

    html[data-theme="dark"] .pcSearchIcon {
        color: rgba(224, 224, 255, .78);
        opacity: 1;
    }

    html[data-theme="dark"] .pcSearchInput {
        color: rgba(235, 238, 255, .94);
    }

    html[data-theme="dark"] .pcSearchInput::placeholder {
        color: rgba(224, 224, 255, .56);
        opacity: 1;
    }

    html[data-theme="dark"] .pcSearchClear {
        border-color: rgba(255, 255, 255, .14);
        background: rgba(255, 255, 255, .05);
        color: rgba(235, 238, 255, .90);
    }

    html[data-theme="dark"] .pcSearchClear:hover {
        border-color: rgba(255, 255, 255, .22);
        background: rgba(255, 255, 255, .08);
    }

    html[data-theme="dark"] .pcSearchBtn {
        border-color: rgba(255, 255, 255, .16);
        background: linear-gradient(180deg, color-mix(in srgb, var(--theme-theme) 16%, rgba(255, 255, 255, .12)), rgba(255, 255, 255, .04));
        box-shadow: 0 18px 48px rgba(0, 0, 0, .52), inset 0 1px 0 rgba(255, 255, 255, .10);
        color: rgba(235, 238, 255, .92);
    }

    html[data-theme="dark"] .pcSearchBtn:hover {
        filter: brightness(1.02) saturate(.86);
        box-shadow: 0 20px 52px rgba(0, 0, 0, .56), 0 0 0 3px color-mix(in srgb, var(--theme-theme) 18%, transparent);
    }

    html[data-theme="dark"] .pcSearchPanel {
        border-color: rgba(255, 255, 255, .12);
        background: rgba(14, 18, 40, .86);
        box-shadow: 0 24px 70px rgba(0, 0, 0, .64);
        -webkit-backdrop-filter: blur(16px);
        backdrop-filter: blur(16px);
    }

    html[data-theme="dark"] .pcPanelHead {
        border-bottom-color: rgba(255, 255, 255, .10);
    }

    html[data-theme="dark"] .pcPanelTitle {
        color: rgba(235, 238, 255, .86);
        opacity: 1;
    }

    html[data-theme="dark"] .pcPanelClearAll {
        border-color: rgba(255, 255, 255, .12);
        color: rgba(235, 238, 255, .74);
    }

    html[data-theme="dark"] .pcPanelClearAll:hover {
        border-color: rgba(255, 255, 255, .18);
        background: rgba(255, 255, 255, .06);
    }

    html[data-theme="dark"] .pcPanelItem {
        color: rgba(235, 238, 255, .90);
    }

    html[data-theme="dark"] .pcPanelItem:hover {
        background: rgba(255, 255, 255, .06);
    }

    html[data-theme="dark"] .pcPanelItem.active {
        border-color: rgba(255, 255, 255, .16);
        background: color-mix(in srgb, var(--theme-theme) 12%, rgba(255, 255, 255, .06));
    }

    html[data-theme="dark"] .pcSearchHint {
        border-color: rgba(255, 255, 255, .12);
        background: rgba(255, 255, 255, .05);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10);
        color: rgba(235, 238, 255, .82);
    }

    html[data-theme="dark"] .pcHotLabel {
        color: rgba(235, 238, 255, .86);
        opacity: 1;
    }

    html[data-theme="dark"] .pcHotTag {
        color: rgba(235, 238, 255, .86);
    }

    html[data-theme="dark"] .pcHotTag {
        border-color: rgba(255, 255, 255, .10);
        background: rgba(255, 255, 255, .04);
    }

    html[data-theme="dark"] .pcHotTag:hover {
        border-color: rgba(255, 255, 255, .16);
        background: rgba(255, 255, 255, .06);
        box-shadow: 0 14px 36px rgba(0, 0, 0, .36);
    }

    html[data-theme="dark"] .pcSearchSide {
        border-left-color: rgba(255, 255, 255, .10);
    }

    html[data-theme="dark"] .pcInfoCard {
        border-color: rgba(255, 255, 255, .10);
        background: rgba(255, 255, 255, .04);
    }

    html[data-theme="dark"] .pcInfoIcon {
        background: rgba(255, 255, 255, .06);
        border-color: rgba(255, 255, 255, .12);
        color: rgba(210, 220, 255, .92);
    }

    html[data-theme="dark"] .pcHotHeat {
        background: rgba(255, 255, 255, .06);
        border-color: rgba(255, 255, 255, .12);
        color: rgba(200, 210, 255, .92);
    }

    html[data-theme="light"] .pcHotHeat {
        color: color-mix(in srgb, var(--theme-theme) 78%, rgba(15, 18, 28, .22));
        background: linear-gradient(180deg, color-mix(in srgb, var(--theme-theme) 12%, rgba(0, 0, 0, .04)), color-mix(in srgb, var(--theme-theme) 16%, rgba(0, 0, 0, .08)));
        border-color: color-mix(in srgb, var(--theme-theme) 24%, rgba(0, 0, 0, .10));
        box-shadow: 0 10px 18px rgba(0, 0, 0, .08), inset 0 1px 0 rgba(255, 255, 255, .72);
    }

    .homeBox.searchBox + .home {
        margin-top: 18px;
    }

    @media (max-width: 1280px) {
        .pcSearchGrid {
            grid-template-columns: 1fr 320px;
        }
    }
}

.footerBox {
    padding: 30px 15px 20px;
}


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

.footerBox .box p {
    opacity: .78;
    padding: 4px 0;
}

.home {
    width: 100%;
    max-width: 1200px;
    margin: 78px auto 0;
    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 0;
}

.home .content .list .item {
    position: relative;
    display: block;
    width: 150px;
    margin: 8px;
    border-radius: 8px 8px 0 0;
    overflow: hidden;
    text-align: center;
    padding: 6px 0 10px;
    background-color: var(--theme-other_background);
    border: 1px solid rgba(0, 0, 0, .04);
    transition: transform .35s, box-shadow .35s, border-color .35s;
    will-change: transform;
}

@media (min-width: 769px) {
    .home .content .list {
        gap: 16px;
    }

    .home .content .list .item {
        margin: 0;
        width: calc((100% - 80px) / 6);
    }
}

.home .content .list .item:hover {
    transform: translateY(-5px);
    border-color: rgba(0, 0, 0, .08);
    box-shadow: 0 18px 38px rgba(0, 0, 0, .10);
}

.home .content .list .item:before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(120px 80px at 20% 0%, rgba(0, 0, 0, .06), transparent 70%),
        radial-gradient(140px 100px at 80% 0%, rgba(0, 0, 0, .04), transparent 75%);
    opacity: 0;
    transition: opacity .35s;
    pointer-events: none;
}

.home .content .list .item:hover:before {
    opacity: 1;
}

.home .content .list .item:after {
    content: '';
    position: absolute;
    top: -40%;
    left: -60%;
    width: 60%;
    height: 180%;
    transform: rotate(18deg) translateX(0);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .22), transparent);
    opacity: 0;
    pointer-events: none;
}

.home .content .list .item:hover:after {
    opacity: 1;
    animation: homeCardShine 900ms ease both;
}

.home .content .list .item .title {
    margin-top: 8px;
    padding: 0 6px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.home .content .list .item .updateTime {
    margin-top: 4px;
    padding: 0 6px;
    font-size: 12px;
    line-height: 1.25;
    opacity: .62;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.home .content .list .item .desc {
    margin-top: 4px;
    padding: 0 8px;
    font-size: 12px;
    line-height: 1.35;
    opacity: .72;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

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

.home .content .list .item .img:before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, .30), transparent 56%);
    opacity: 0;
    transition: opacity .35s;
    z-index: 10;
    pointer-events: none;
}

.home .content .list .item:hover .img:before {
    opacity: 1;
}

.home .content .list .item .img img {
    position: relative;
    z-index: 9;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1);
    transition: transform .45s ease, filter .45s ease;
}

.home .content .list .item:hover .img img {
    transform: scale(1.06);
    filter: saturate(1.06) contrast(1.02);
}

.home .content .list .item .img > span:not(.rank-badge) {
    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 .content .list .item .rank-badge {
    position: absolute;
    top: 6px;
    left: 6px;
    z-index: 20;
    padding: 3px 6px;
    font-size: 11px;
    line-height: 1;
    font-weight: 700;
    color: rgba(255, 255, 255, .94);
    border-radius: 6px;
    background: rgba(0, 0, 0, .45);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, .16);
    box-shadow: 0 10px 18px rgba(0, 0, 0, .18);
}

/* 热度角标 - 默认（桌面端） */
.home .content .list .item .cardHeat {
    position: absolute;
    top: 6px;
    right: 6px;
    left: auto;
    z-index: 20;
    padding: 3px 8px;
    font-size: 11px;
    line-height: 1;
    font-weight: 800;
    color: rgba(255, 255, 255, .96);
    border-radius: 6px;
    background: linear-gradient(135deg, rgba(0, 210, 220, .92), rgba(68, 129, 255, .92));
    border: 1px solid rgba(255, 255, 255, .18);
    box-shadow: 0 12px 22px rgba(0, 0, 0, .18);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    white-space: nowrap;
}
.home .content .list .item .cardHeat::before {
    content: '热度 ';
    font-weight: 400;
    opacity: 0.9;
    margin-right: 2px;
}

/* 底部标签 - 默认（桌面端） */
.home .content .list .item .cardChips {
    position: absolute;
    left: 6px;
    right: 6px;
    bottom: 6px;
    z-index: 20;
    display: flex;
    gap: 4px;
    align-items: center;
    justify-content: flex-start;
    pointer-events: none; /* 确保点击穿透到卡片链接 */
}

/* 
  视觉风格配置区 
  风格1：经典沉浸（当前默认）- 半透明黑底 + 描边，适合强调内容
  风格2：现代扁平 - 无描边，纯色块，更简洁
  风格3：霓虹光感 - 渐变边框 + 发光效果，科技感强
  
  切换方法：取消对应风格变量的注释即可
*/
:root {
    /* 默认：风格1 - 磨砂玻璃胶囊 */
    --chip-bg: rgba(0, 0, 0, 0.55);
    --chip-border: 1px solid rgba(255, 255, 255, 0.25);
    --chip-shadow: 0 4px 12px rgba(0, 0, 0, .15);
    --chip-radius: 20px;
    
    /* 风格2：现代扁平 (取消注释启用) */
    /*
    --chip-bg: rgba(20, 20, 20, 0.85);
    --chip-border: none;
    --chip-shadow: 0 2px 4px rgba(0,0,0,0.1);
    --chip-radius: 4px;
    */
    
    /* 风格3：霓虹光感 (取消注释启用) */
    /*
    --chip-bg: rgba(0, 0, 0, 0.8);
    --chip-border: 1px solid rgba(0, 210, 220, 0.5);
    --chip-shadow: 0 0 8px rgba(0, 210, 220, 0.3);
    --chip-radius: 12px;
    */
}

/* 视觉增强：半透明背景色块 + 留白 + 圆角 + 描边 */
.home .content .list .item .cardChip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: auto; 
    min-height: 24px; 
    padding: 6px 10px;
    border-radius: var(--chip-radius, 8px); /* 使用变量 */
    font-size: 11px;
    line-height: 1.2;
    font-weight: 600;
    color: rgba(255, 255, 255, .96);
    
    /* 背景：使用变量 */
    background: var(--chip-bg, rgba(0, 0, 0, 0.7));
    
    /* 描边：使用变量 */
    border: var(--chip-border, 1px solid rgba(255, 255, 255, 0.3));
    
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    box-shadow: var(--chip-shadow, 0 4px 8px rgba(0, 0, 0, .2)); /* 使用变量 */
    white-space: nowrap;
    text-shadow: 0 1px 2px rgba(0,0,0,0.5);
}

.home .content .list .item .cardChipTag {
    /* 标签特有样式 */
}

.home .content .list .item .cardChipEp {
    /* 集数特有样式 */
    font-weight: 700;
    margin-left: auto;
    /* 集数也可以稍微不同，例如背景色更深一点或边框更亮 */
    background: rgba(0, 0, 0, 0.75); 
    border-color: rgba(255, 255, 255, 0.5);
}

html[data-theme="light"] .home .content .list .item .cardChip {
    /* 浅色模式适配 */
    color: rgba(255, 255, 255, 1); /* 依然保持浅色字，因为背景是深色半透明 */
    /* 如果浅色模式下背景也要变浅？用户要求是“深色70%透明度”，通常为了压住图片背景，保持深色背景是最佳实践 */
    background: rgba(0, 0, 0, 0.65);
    border-color: rgba(255, 255, 255, 0.4);
}

/* 移动端适配 - 精致小卡片模式 */
@media (max-width: 768px) {
    /* 容器调整：改为三列布局，更紧凑 */
    .home .content .list .item {
        width: calc(33.333% - 6px);
        margin: 3px;
    }
    .home .content .list .item .img {
        height: 155px; /* 适当减小高度适配三列 */
        border-radius: 8px;
    }

    /* 隐藏描述，节省空间 */
    .home .content .list .item .desc {
        display: none;
    }

    /* 标题微调：更小更紧凑 */
    .home .content .list .item .title {
        font-size: 12px;
        margin-top: 6px;
        text-align: center; /* 居中对齐更像APP */
        padding: 0 2px;
    }

    .home .content .list .item .updateTime {
        margin-top: 3px;
        font-size: 10px;
        padding: 0 2px;
        text-align: center;
    }

    /* 顶部角标微调：极小化 */
    .home .content .list .item .rank-badge {
        font-size: 9px;
        padding: 1px 3px;
        top: 2px;
        left: 2px;
        border-radius: 3px;
        backdrop-filter: none;
        line-height: 1;
    }

    /* 热度角标：移动端隐藏 */
    .home .content .list .item .cardHeat {
        display: none;
    }

    /* 底部信息区重构：单行布局 (标签 + 集数) */
    .home .content .list .item .cardChips {
        flex-direction: row;
        flex-wrap: nowrap; /* 强制不换行 */
        justify-content: space-between; /* 两端对齐 */
        align-items: center;
        bottom: 2px;
        left: 2px;
        right: 2px;
        gap: 2px;
        padding: 0;
    }
    
    /* 通用Chip样式重置 */
    .home .content .list .item .cardChip {
        height: auto;
        min-height: 14px;
        font-size: 9px;
        padding: 1px 4px;
        border: none;
        box-shadow: none;
        backdrop-filter: none;
    }
    
    /* 标签：左侧，限制宽度防止挤占集数 */
    .home .content .list .item .cardChipTag {
        flex: 0 1 auto;
        order: 1;
        background: rgba(0, 0, 0, 0.5);
        border-radius: 4px;
        margin: 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 60%; /* 限制最大宽度 */
    }
    
    /* 集数：右侧，靠右对齐 */
    .home .content .list .item .cardChipEp {
        flex: 0 0 auto; /* 不缩放 */
        order: 2;
        margin: 0;
        margin-left: auto; /* 自动靠右 */
        background: rgba(0, 0, 0, 0.6);
        border-radius: 4px;
        font-weight: normal;
        width: auto;
        display: inline-flex;
        justify-content: center;
    }
}

/* 平板/横屏优化 (min-width: 769px) ? 不，用户说是“手机横屏/平板”
   我们可以加一个 media query
*/
@media (min-width: 480px) and (max-width: 768px) {
    /* 手机横屏 */
    .home .content .list .item .cardChip {
        font-size: 13px;
    }
}


.home .content .list .item .rank-badge[data-rank="1"] {
    background: linear-gradient(135deg, #f7d065, #f59f00);
    color: rgba(45, 24, 0, .88);
    border-color: rgba(255, 255, 255, .26);
}

.home .content .list .item .rank-badge[data-rank="2"] {
    background: linear-gradient(135deg, #e9eef8, #9fb0c6);
    color: rgba(18, 22, 30, .86);
    border-color: rgba(255, 255, 255, .22);
}

.home .content .list .item .rank-badge[data-rank="3"] {
    background: linear-gradient(135deg, #f0b27a, #a66b3a);
    color: rgba(30, 14, 0, .88);
    border-color: rgba(255, 255, 255, .20);
}

.home .content .list .item:hover .rank-badge {
    animation: homeBadgePop 420ms ease both;
}

@keyframes homeCardShine {
    from {
        transform: rotate(18deg) translateX(0);
    }
    to {
        transform: rotate(18deg) translateX(320%);
    }
}

@keyframes homeBadgePop {
    0% {
        transform: translateY(-2px) scale(.96);
    }
    60% {
        transform: translateY(0) scale(1.04);
    }
    100% {
        transform: translateY(0) scale(1);
    }
}


.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;
}


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

html[data-theme="dark"] .el-dialog {
    background-color: rgba(13, 13, 36, .92);
    border: 1px solid rgba(180, 190, 255, .12);
    box-shadow: 0 26px 56px rgba(0, 0, 0, .36);
}

html[data-theme="dark"] .el-dialog__title {
    color: rgba(224, 224, 255, .92);
}

html[data-theme="dark"] .el-dialog__body {
    color: rgba(224, 224, 255, .84);
}

html[data-theme="dark"] .el-dialog__headerbtn .el-dialog__close {
    color: rgba(224, 224, 255, .72);
}

html[data-theme="dark"] .el-dialog__headerbtn:hover .el-dialog__close {
    color: rgba(255, 255, 255, .92);
}

html[data-theme="dark"] .el-select-dropdown,
html[data-theme="dark"] .el-autocomplete-suggestion {
    background: rgba(13, 13, 36, .96);
    border-color: rgba(180, 190, 255, .12);
    box-shadow: 0 22px 48px rgba(0, 0, 0, .36);
}

html[data-theme="dark"] .el-select-dropdown__item,
html[data-theme="dark"] .el-autocomplete-suggestion li {
    color: rgba(224, 224, 255, .82);
}

html[data-theme="dark"] .el-select-dropdown__item.hover,
html[data-theme="dark"] .el-select-dropdown__item:hover,
html[data-theme="dark"] .el-autocomplete-suggestion li:hover {
    background: rgba(18, 90, 255, .14);
}

html[data-theme="dark"] .el-select-dropdown__item.selected {
    color: rgba(0, 200, 255, .92);
}

.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;
}

html[data-theme="dark"] .layerBox .el-textarea textarea {
    background-color: rgba(10, 10, 26, .62);
    border-color: rgba(180, 190, 255, .12);
    color: rgba(224, 224, 255, .92);
}

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

.ticketBox .el-form-item {
    margin-bottom: 12px;
}

.ticketBox .el-input__inner,
.ticketBox .el-textarea__inner {
    border-radius: 6px;
}

 .ticketBox .el-input__wrapper,
 .ticketBox .el-select__wrapper {
    border-radius: 6px;
    background: rgba(255, 255, 255, .86);
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .12) inset;
    transition: box-shadow 360ms ease, background-color 360ms ease, border-color 360ms ease, transform 360ms cubic-bezier(.2, .9, .2, 1);
 }

.ticketBox .el-input__wrapper.is-focus,
.ticketBox .el-select__wrapper.is-focused {
    box-shadow: 0 0 0 1px rgba(18, 90, 255, .42) inset, 0 0 0 3px rgba(18, 90, 255, .10);
}

.ticketBox .el-textarea__inner {
    background: rgba(255, 255, 255, .86);
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .12) inset;
    transition: box-shadow 360ms ease, background-color 360ms ease, border-color 360ms ease;
}

.ticketBox .el-textarea__inner:focus {
    box-shadow: 0 0 0 1px rgba(18, 90, 255, .42) inset, 0 0 0 3px rgba(18, 90, 255, .10);
}

html[data-theme="dark"] .ticketBox .el-input__wrapper,
html[data-theme="dark"] .ticketBox .el-select__wrapper,
html[data-theme="dark"] .ticketBox .el-textarea__inner {
    border-radius: 6px;
}

html[data-theme="dark"] .ticketBox .el-input__inner,
html[data-theme="dark"] .ticketBox .el-textarea__inner {
    background-color: rgba(10, 10, 26, .62);
    border-color: rgba(180, 190, 255, .12);
    color: rgba(224, 224, 255, .92);
}

html[data-theme="dark"] .ticketBox .el-input__inner::placeholder,
html[data-theme="dark"] .ticketBox .el-textarea__inner::placeholder {
    color: rgba(224, 224, 255, .56);
}

html[data-theme="dark"] .ticketBox .el-form-item__label {
    color: rgba(224, 224, 255, .78);
}

html[data-theme="dark"] .ticketBox .el-input__wrapper,
html[data-theme="dark"] .ticketBox .el-select__wrapper,
html[data-theme="dark"] .ticketBox .el-textarea__inner {
    background: rgba(10, 10, 26, .62);
    box-shadow: 0 0 0 1px rgba(180, 190, 255, .12) inset;
}

html[data-theme="dark"] .ticketBox .el-input__wrapper.is-focus,
html[data-theme="dark"] .ticketBox .el-select__wrapper.is-focused,
html[data-theme="dark"] .ticketBox .el-textarea__inner:focus {
    box-shadow: 0 0 0 1px rgba(0, 200, 255, .34) inset, 0 0 0 4px rgba(0, 200, 255, .12);
}

html[data-theme="dark"] .ticketBox .el-input__count,
html[data-theme="dark"] .ticketBox .el-input__count-inner {
    color: rgba(224, 224, 255, .62);
    background: rgba(0, 0, 0, 0);
}

.ticketBox .ticket-contact-row {
    display: flex;
    align-items: center;
}

.ticketBox.ticketModal {
    padding-top: 4px;
}

.ticketUnified {
    border-radius: 14px;
    background:
        radial-gradient(900px 240px at 18% 0%, rgba(18, 90, 255, .10), rgba(0, 0, 0, 0) 62%),
        radial-gradient(760px 220px at 82% 0%, rgba(0, 200, 255, .08), rgba(0, 0, 0, 0) 62%),
        rgba(255, 255, 255, .94);
    border: 1px solid rgba(0, 0, 0, .06);
    padding: 10px 12px 12px;
    box-shadow: 0 22px 56px rgba(0, 0, 0, .16);
}

html[data-theme="dark"] .ticketUnified {
    background:
        radial-gradient(900px 240px at 18% 0%, rgba(18, 90, 255, .18), rgba(0, 0, 0, 0) 62%),
        radial-gradient(760px 220px at 82% 0%, rgba(0, 200, 255, .14), rgba(0, 0, 0, 0) 62%),
        rgba(13, 13, 36, .62);
    border: 1px solid rgba(180, 190, 255, .12);
    box-shadow: 0 24px 62px rgba(0, 0, 0, .36);
}

.ticketUnified .ticket-main-tabs > .el-tabs__header {
    margin: 0 0 12px 0;
}

.ticketUnified .ticket-main-tabs > .el-tabs__header .el-tabs__nav-wrap::after {
    background-color: rgba(0, 0, 0, 0);
}

.ticketUnified .ticket-main-tabs > .el-tabs__header .el-tabs__nav-wrap {
    border-radius: 12px;
    overflow: hidden;
}

.ticketUnified .ticket-main-tabs > .el-tabs__header .el-tabs__nav-wrap {
    background: rgba(0, 0, 0, .03);
    border: 1px solid rgba(0, 0, 0, .06);
}

.ticketUnified .ticket-main-tabs > .el-tabs__header .el-tabs__item {
    color: rgba(0, 0, 0, .60);
}

.ticketUnified .ticket-main-tabs > .el-tabs__header .el-tabs__item:hover {
    color: rgba(0, 0, 0, .82);
    background: rgba(18, 90, 255, .06);
}

.ticketUnified .ticket-main-tabs > .el-tabs__header .el-tabs__item.is-active {
    color: rgba(0, 0, 0, .86);
    background: rgba(255, 255, 255, .92);
    border: 1px solid rgba(18, 90, 255, .18);
    box-shadow: 0 10px 22px rgba(0, 0, 0, .10);
}

.ticketUnified .ticket-main-tabs > .el-tabs__header .el-tabs__nav-scroll {
    padding: 4px;
}

.ticketUnified .ticket-main-tabs > .el-tabs__header .el-tabs__active-bar {
    display: none;
}

.ticketUnified .ticket-main-tabs > .el-tabs__header .el-tabs__item {
    height: 34px;
    line-height: 34px;
    padding: 0 14px;
    border-radius: 10px;
    font-weight: 800;
    letter-spacing: .2px;
}

html[data-theme="dark"] .ticketUnified .ticket-main-tabs > .el-tabs__header .el-tabs__nav-wrap {
    background: rgba(10, 10, 26, .52);
    border: 1px solid rgba(180, 190, 255, .12);
}

html[data-theme="dark"] .ticketUnified .ticket-main-tabs > .el-tabs__header .el-tabs__item {
    color: rgba(224, 224, 255, .78);
}

html[data-theme="dark"] .ticketUnified .ticket-main-tabs > .el-tabs__header .el-tabs__item:hover {
    color: rgba(255, 255, 255, .92);
    background: rgba(18, 90, 255, .10);
}

html[data-theme="dark"] .ticketUnified .ticket-main-tabs > .el-tabs__header .el-tabs__item.is-active {
    color: rgba(255, 255, 255, .96);
    background: linear-gradient(90deg, rgba(18, 90, 255, .46), rgba(0, 200, 255, .22));
    box-shadow: 0 12px 26px rgba(0, 0, 0, .22);
    border: 1px solid rgba(0, 200, 255, .18);
}

.ticketUnified .ticket-main-tabs {
    margin-top: -4px;
}

.ticketUnified .ticket-main-actions {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid rgba(0, 0, 0, .06);
}

html[data-theme="dark"] .ticketUnified .ticket-main-actions {
    border-top-color: rgba(180, 190, 255, .12);
}

.ticketUnified.is-submit .ticket-pane-submit {
    animation: ticketPaneInA .18s ease both;
}

.ticketUnified.is-query .ticket-pane-query {
    animation: ticketPaneInB .18s ease both;
}

@keyframes ticketPaneInA {
    from { opacity: .0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes ticketPaneInB {
    from { opacity: .0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

.ticketBox .ticket-modal-header {
    margin-bottom: 12px;
}

.ticketUnified .vname {
    font-size: 22px;
    font-weight: 900;
    letter-spacing: .3px;
    color: rgba(0, 0, 0, .76);
}

html[data-theme="dark"] .ticketUnified .vname {
    color: rgba(255, 255, 255, .92);
}

.ticketBox .ticket-sub {
    margin-top: 6px;
    font-size: 12px;
    color: #888;
    text-align: center;
}

html[data-theme="dark"] .ticketBox .ticket-sub {
    color: rgba(224, 224, 255, .70);
}

.ticketBox .ticket-actions {
    display: flex;
    gap: 10px;
    margin-top: 10px;
}

.ticketBox .ticket-actions .el-button {
    flex: 1;
    height: 40px;
}

.ticketBox .el-button--primary {
    background: linear-gradient(90deg, rgba(18, 90, 255, .96), rgba(0, 200, 255, .86));
    border-color: rgba(0, 0, 0, 0);
    color: rgba(255, 255, 255, .96);
    box-shadow: 0 14px 28px rgba(18, 90, 255, .16);
}

.ticketBox .el-button--primary:hover {
    box-shadow: 0 16px 34px rgba(0, 200, 255, .16);
}

html[data-theme="dark"] .ticketBox .el-button {
    background: rgba(180, 190, 255, .10);
    border-color: rgba(180, 190, 255, .16);
    color: rgba(224, 224, 255, .84);
}

html[data-theme="dark"] .ticketBox .el-button:hover {
    background: rgba(18, 90, 255, .14);
    border-color: rgba(0, 200, 255, .18);
    color: rgba(224, 224, 255, .92);
}

html[data-theme="dark"] .ticketBox .el-button--primary {
    background: linear-gradient(90deg, rgba(18, 90, 255, .96), rgba(0, 200, 255, .88));
    border-color: rgba(0, 0, 0, 0);
    color: rgba(255, 255, 255, .96);
    box-shadow: 0 14px 28px rgba(18, 90, 255, .18);
}

html[data-theme="dark"] .ticketBox .el-button--primary:hover {
    box-shadow: 0 16px 34px rgba(0, 200, 255, .18);
}

html[data-theme="dark"] .empty-actions {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

html[data-theme="dark"] .empty-hint {
    font-size: 13px;
    color: rgba(224, 224, 255, .72);
    margin-bottom: 12px;
}



.ticketBox .ticket-history-item {
    padding: 12px 12px;
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 12px;
    margin-bottom: 12px;
    background: rgba(255, 255, 255, .92);
    transition: background-color 360ms ease, border-color 360ms ease, box-shadow 360ms ease, transform 200ms cubic-bezier(.2, .9, .2, 1);
}

.ticketBox .ticket-history-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.ticketBox .ticket-history-title {
    font-weight: 800;
    letter-spacing: .2px;
    color: rgba(0, 0, 0, .78);
}

.ticketBox .ticket-history-actions {
    display: flex;
    gap: 8px;
    flex: none;
}

.ticketBox .ticket-history-scroll {
    margin-top: 10px;
}

.ticketBox .ticket-history-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.ticketBox .ticket-history-no {
    font-weight: 800;
    letter-spacing: .2px;
    word-break: break-all;
    font-size: 14px;
    color: rgba(0, 0, 0, .86);
}

.ticketBox .ticket-history-tags {
    display: flex;
    gap: 6px;
    align-items: center;
    flex: none;
}

.ticketBox .ticket-history-desc {
    margin-top: 8px;
    font-size: 13px;
    line-height: 1.45;
    color: rgba(0, 0, 0, .68);
    white-space: pre-wrap;
    word-break: break-word;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.ticketBox .ticket-history-divider {
    margin-top: 10px;
    height: 1px;
    background: rgba(0, 0, 0, .06);
}

.ticketBox .ticket-history-foot {
    margin-top: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.ticketBox .ticket-history-time {
    font-size: 12px;
    color: rgba(0, 0, 0, .48);
}

.ticketBox .ticket-history-link {
    font-size: 12px;
    font-weight: 700;
    color: var(--theme-theme);
    text-decoration: none;
}

.ticketBox .ticket-history-link:hover {
    text-decoration: none;
    color: color-mix(in srgb, var(--theme-theme) 86%, #000000);
}

.ticketBox .ticket-history-link:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(18, 90, 255, .18);
    border-radius: 6px;
}

.ticketBox .ticket-history-empty {
    margin-top: 10px;
    font-size: 12px;
    color: rgba(0, 0, 0, .52);
}

.ticketBox .ticket-history-item:hover {
    background: rgba(255, 255, 255, .98);
    border-color: rgba(18, 90, 255, .16);
    box-shadow: 0 12px 30px rgba(0, 0, 0, .10);
}

.ticketBox .ticket-history-item:active {
    transform: scale(.992);
}

.ticketBox .ticket-history-item:focus-within {
    border-color: rgba(18, 90, 255, .28);
    box-shadow: 0 0 0 3px rgba(18, 90, 255, .10), 0 12px 30px rgba(0, 0, 0, .10);
}

html[data-theme="dark"] .ticketBox .ticket-history-item {
    border-color: rgba(180, 190, 255, .12);
    background: rgba(10, 10, 26, .62);
}

html[data-theme="dark"] .ticketBox .ticket-history-title {
    color: rgba(224, 224, 255, .82);
}

html[data-theme="dark"] .ticketBox .ticket-history-no {
    color: rgba(255, 255, 255, .92);
}

html[data-theme="dark"] .ticketBox .ticket-history-desc {
    color: rgba(224, 224, 255, .74);
}

html[data-theme="dark"] .ticketBox .ticket-history-divider {
    background: rgba(180, 190, 255, .10);
}

html[data-theme="dark"] .ticketBox .ticket-history-time {
    color: rgba(224, 224, 255, .62);
}

html[data-theme="dark"] .ticketBox .ticket-history-link {
    color: rgba(0, 200, 255, .90);
}

html[data-theme="dark"] .ticketBox .ticket-history-link:focus-visible {
    box-shadow: 0 0 0 4px rgba(0, 200, 255, .14);
}

html[data-theme="dark"] .ticketBox .ticket-history-empty {
    color: rgba(224, 224, 255, .62);
}

html[data-theme="dark"] .ticketBox .ticket-history-item:hover {
    background: rgba(18, 90, 255, .10);
    border-color: rgba(0, 200, 255, .18);
    box-shadow: 0 16px 38px rgba(0, 0, 0, .26);
}

html[data-theme="dark"] .ticketBox .ticket-history-item:focus-within {
    border-color: rgba(0, 200, 255, .22);
    box-shadow: 0 0 0 4px rgba(0, 200, 255, .12), 0 16px 38px rgba(0, 0, 0, .26);
}

.ticketBox .ticket-result-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.ticketBox .ticket-result {
    margin-top: 14px;
    padding: 12px 12px;
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 12px;
    background:
        radial-gradient(520px 180px at 18% 0%, rgba(18, 90, 255, .10), rgba(0, 0, 0, 0) 62%),
        radial-gradient(460px 160px at 82% 0%, rgba(0, 200, 255, .08), rgba(0, 0, 0, 0) 62%),
        rgba(255, 255, 255, .92);
    box-shadow: 0 18px 44px rgba(0, 0, 0, .12);
}

html[data-theme="dark"] .ticketBox .ticket-result {
    border-color: rgba(180, 190, 255, .12);
    background:
        radial-gradient(520px 180px at 18% 0%, rgba(18, 90, 255, .18), rgba(0, 0, 0, 0) 62%),
        radial-gradient(460px 160px at 82% 0%, rgba(0, 200, 255, .14), rgba(0, 0, 0, 0) 62%),
        rgba(10, 10, 26, .62);
    box-shadow: 0 20px 52px rgba(0, 0, 0, .34);
}

.ticketBox .ticket-history-scroll {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-right: 6px;
}

.ticketBox .ticket-history-scroll .ticket-history-item {
    margin-bottom: 0;
}

@media screen and (max-width: 360px) {
    .ticketBox .ticket-history-item {
        padding: 10px 10px;
        border-radius: 10px;
    }

    .ticketBox .ticket-history-head {
        flex-direction: column;
        align-items: flex-start;
    }

    .ticketBox .ticket-history-tags {
        flex-wrap: wrap;
    }

    .ticketBox .ticket-history-foot {
        flex-wrap: wrap;
        justify-content: flex-start;
    }
}

.ticketBox .el-button:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(18, 90, 255, .16);
}

html[data-theme="dark"] .ticketBox .el-button:focus-visible {
    box-shadow: 0 0 0 4px rgba(0, 200, 255, .14);
}

.ticketBox .ticket-attach-list {
    margin-top: 10px;
}

.ticketBox .ticket-attach-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 8px;
    border-radius: 8px;
    background: rgba(0, 0, 0, .03);
    margin-top: 6px;
}

html[data-theme="dark"] .ticketBox .ticket-attach-item {
    background: rgba(180, 190, 255, .08);
}

.ticketBox .ticket-attach-name {
    max-width: 250px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ticketBox .ticket-tips {
    margin-top: 10px;
    font-size: 12px;
    color: #666;
}

html[data-theme="dark"] .ticketBox .ticket-tips {
    color: rgba(224, 224, 255, .62);
}

.homeTabMode {
    margin-top: 10px;
    position: relative;
    border-radius: 14px;
    background: var(--theme-other_background, #ffffff);
    background: color-mix(in srgb, var(--theme-other_background) 92%, transparent);
    border: 1px solid rgba(0, 0, 0, .06);
    box-shadow: 0 10px 24px rgba(0, 0, 0, .06);
    overflow: hidden;
}

.homeTabMode .htTabs {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 12px 14px;
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
    mask-image: linear-gradient(to right, transparent 0, #000 16px, #000 calc(100% - 16px), transparent 100%);
    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 16px, #000 calc(100% - 16px), transparent 100%);
    background: transparent;
    border: none;
    border-radius: 0;
    margin: 0;
    box-shadow: none;
}

html[data-theme="dark"] .homeTabMode .htTabs {
    background: transparent;
    border-color: transparent;
    box-shadow: none;
}

.homeTabMode .htTabs::-webkit-scrollbar {
    display: none;
}

.homeTabMode .htTabs::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 44px;
    height: 14px;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(0, 0, 0, .03), rgba(0, 0, 0, 0));
    opacity: .35;
}

html[data-theme="dark"] .homeTabMode {
    border-color: rgba(255, 255, 255, .10);
    background: color-mix(in srgb, var(--theme-other_background) 84%, rgba(10, 10, 26, .18));
    box-shadow: 0 18px 34px rgba(0, 0, 0, .38);
}

html[data-theme="dark"] .homeTabMode .htTabs::after {
    background: linear-gradient(180deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, 0));
    opacity: .18;
}

.homeTabMode .htTab {
    flex: 0 0 auto;
    padding: 8px 14px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 650;
    letter-spacing: .2px;
    color: rgba(15, 18, 28, .82);
    background: rgba(255, 255, 255, .92);
    border: 1px solid rgba(0, 0, 0, .08);
    box-shadow: 0 10px 18px rgba(0, 0, 0, .06);
    transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, color .18s ease, border-color .18s ease;
}

.homeTabMode .htTab:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 26px rgba(0, 0, 0, .10);
}

.homeTabMode .htTab.active {
    color: rgba(255, 255, 255, .96);
    border-color: rgba(255, 255, 255, .18);
    background: linear-gradient(135deg, color-mix(in srgb, var(--theme-theme) 92%, #000), color-mix(in srgb, var(--theme-theme) 52%, #7c5cff));
    box-shadow: 0 18px 34px color-mix(in srgb, var(--theme-theme) 22%, rgba(0, 0, 0, .22));
}

html[data-theme="dark"] .homeTabMode .htTab {
    color: rgba(255, 255, 255, .86);
    background: rgba(255, 255, 255, .06);
    border-color: rgba(255, 255, 255, .10);
    box-shadow: 0 12px 20px rgba(0, 0, 0, .28);
}

html[data-theme="dark"] .homeTabMode .htTab:hover {
    box-shadow: 0 16px 30px rgba(0, 0, 0, .36);
}

html[data-theme="dark"] .homeTabMode .htTab.active {
    color: rgba(255, 255, 255, .96);
    border-color: rgba(255, 255, 255, .16);
    background: linear-gradient(135deg, color-mix(in srgb, var(--theme-theme) 70%, #60a5fa 30%), color-mix(in srgb, var(--theme-theme) 66%, #a78bfa 34%));
    box-shadow: 0 18px 34px rgba(0, 0, 0, .32), 0 16px 30px color-mix(in srgb, var(--theme-theme) 20%, rgba(0, 0, 0, .22));
}

.homeTabMode .htBlock .nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.homeTabMode .htBlock {
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    border: none;
    margin: 0;
    padding-top: 4px;
}

.homeTabMode .htTitle {
    font-size: 18px;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.homeTabMode .htTitle::before {
    content: '';
    width: 20px;
    height: 20px;
    flex: none;
    background: linear-gradient(135deg,
            color-mix(in srgb, var(--theme-theme) 82%, #60a5fa 18%),
            color-mix(in srgb, var(--theme-theme) 56%, #a78bfa 44%),
            color-mix(in srgb, var(--theme-theme) 72%, #22d3ee 28%));
    box-shadow: 0 14px 26px rgba(0, 0, 0, .12), 0 10px 22px color-mix(in srgb, var(--theme-theme) 18%, rgba(0, 0, 0, .10));
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27%23000%27%20fill-rule%3D%27evenodd%27%20d%3D%27M12%202a10%2010%200%201%201%200%2020a10%2010%200%200%201%200-20z%20M12%205a7%207%200%201%200%200%2014a7%207%200%200%200%200-14z%20M10.2%208.5l6.2%203.6-6.2%203.6V8.5z%27%20clip-rule%3D%27evenodd%27/%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
    mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27%23000%27%20fill-rule%3D%27evenodd%27%20d%3D%27M12%202a10%2010%200%201%201%200%2020a10%2010%200%200%201%200-20z%20M12%205a7%207%200%201%200%200%2014a7%207%200%200%200%200-14z%20M10.2%208.5l6.2%203.6-6.2%203.6V8.5z%27%20clip-rule%3D%27evenodd%27/%3E%3C/svg%3E");
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
}

.homeTabMode .htTitle::after {
    content: none;
}

html[data-theme="dark"] .homeTabMode .htTitle::before {
    box-shadow: 0 18px 34px rgba(0, 0, 0, .34), 0 14px 30px color-mix(in srgb, var(--theme-theme) 18%, rgba(0, 0, 0, .24));
}

html[data-theme="dark"] .homeTabMode .htTitle::after {
    content: none;
}

.homeTabMode .htMore {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 650;
    line-height: 1;
    color: rgba(15, 18, 28, .74);
    background: rgba(0, 0, 0, .04);
    border: 1px solid rgba(0, 0, 0, .06);
}

.homeTabMode .htMore::after {
    content: '';
    width: 14px;
    height: 14px;
    background: currentColor;
    opacity: .86;
    transition: transform .18s ease, opacity .18s ease;
    mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27%23000%27%20d%3D%27M10.2%206.2%2015.8%2011.8c.1.1.2.3.2.5s-.1.4-.2.5l-5.6%205.6-1.4-1.4L13%2012%208.8%207.6%2010.2%206.2z%27/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27%23000%27%20d%3D%27M10.2%206.2%2015.8%2011.8c.1.1.2.3.2.5s-.1.4-.2.5l-5.6%205.6-1.4-1.4L13%2012%208.8%207.6%2010.2%206.2z%27/%3E%3C/svg%3E");
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-position: center;
    mask-size: contain;
    -webkit-mask-size: contain;
}

.homeTabMode .htMore:hover {
    color: var(--theme-theme);
    background: color-mix(in srgb, var(--theme-theme) 10%, rgba(0, 0, 0, .02));
    border-color: color-mix(in srgb, var(--theme-theme) 18%, rgba(0, 0, 0, .10));
}

.homeTabMode .htMore:hover::after {
    transform: translateX(1px);
    opacity: .92;
}

html[data-theme="dark"] .homeTabMode .htMore {
    color: rgba(255, 255, 255, .74);
    background: rgba(255, 255, 255, .06);
    border-color: rgba(255, 255, 255, .10);
}

html[data-theme="dark"] .homeTabMode .htMore:hover {
    color: rgba(255, 255, 255, .92);
    background: color-mix(in srgb, var(--theme-theme) 18%, rgba(255, 255, 255, .06));
    border-color: rgba(255, 255, 255, .14);
}

.htEmpty {
    padding: 28px 10px 26px;
    text-align: center;
    opacity: .72;
    display: flex;
    align-items: center;
    justify-content: center;
}

.htSkeletonList {
    pointer-events: none;
}

.htSkeletonList .item:hover {
    transform: none;
    box-shadow: none;
    border-color: rgba(0, 0, 0, .04);
}

.htSkeletonList .item:before,
.htSkeletonList .item:after {
    display: none;
}

.htSkeletonList .item .img:before {
    display: none;
}

.htSkeletonBlock {
    display: block;
    position: relative;
    overflow: hidden;
    background: linear-gradient(90deg, rgba(0, 0, 0, .06), rgba(0, 0, 0, .03), rgba(0, 0, 0, .06));
}

.htSkeletonBlock::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .45), transparent);
    transform: translateX(-70%);
    animation: htSkeletonShimmer 1150ms ease-in-out infinite;
}

.htSkeletonThumb {
    position: absolute;
    inset: 0;
    border-radius: 10px;
}

.home .content .list .item .img > .htSkeletonThumb {
    display: block;
    align-items: initial;
    justify-content: initial;
}

.htSkeletonLine {
    height: 12px;
    width: 78%;
    margin: 0 auto;
    border-radius: 999px;
}

.htSkeletonLineShort {
    height: 10px;
    width: 64%;
    margin-top: 2px;
    opacity: .9;
}

html[data-theme="dark"] .htSkeletonBlock {
    background: linear-gradient(90deg, rgba(180, 190, 255, .12), rgba(180, 190, 255, .06), rgba(180, 190, 255, .12));
}

html[data-theme="dark"] .htSkeletonBlock::after {
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .18), transparent);
}

@keyframes htSkeletonShimmer {
    0% { transform: translateX(-70%); }
    100% { transform: translateX(70%); }
}

.qLoadingSpinner {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 2px solid rgba(0, 0, 0, .10);
    border-top-color: var(--theme-theme);
    animation: qSpin .85s linear infinite;
}

html[data-theme="dark"] .qLoadingSpinner {
    border-color: rgba(180, 190, 255, .16);
    border-top-color: color-mix(in srgb, var(--theme-theme) 78%, #60a5fa 22%);
}

@keyframes qSpin {
    to { transform: rotate(360deg); }
}

.hotHero {
    width: 1200px;
    margin: 18px auto 0;
    padding: 16px 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    border-radius: 18px;
    position: sticky;
    top: 86px;
    z-index: 60;
    overflow: hidden;
    background:
        radial-gradient(420px 260px at 12% 0%, color-mix(in srgb, var(--theme-theme) 56%, #60a5fa 44%), rgba(0, 0, 0, 0) 70%),
        radial-gradient(460px 280px at 88% 12%, color-mix(in srgb, var(--theme-theme) 54%, #a78bfa 46%), rgba(0, 0, 0, 0) 72%),
        rgba(10, 14, 24, .62);
    border: 1px solid rgba(255, 255, 255, .10);
    box-shadow: 0 20px 40px rgba(0, 0, 0, .22);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.hotHero:before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(360px 220px at 20% 0%, color-mix(in srgb, var(--theme-theme) 44%, #22d3ee 56%), rgba(0, 0, 0, 0) 70%),
        radial-gradient(380px 240px at 78% 6%, rgba(255, 255, 255, .08), rgba(0, 0, 0, 0) 72%);
    opacity: .9;
    pointer-events: none;
}

.hotHeroLeft {
    min-width: 160px;
    position: relative;
    z-index: 1;
}

.hotHeroBack {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    border: 1px solid rgba(255, 255, 255, .12);
    background: rgba(255, 255, 255, .06);
    color: rgba(255, 255, 255, .86);
    box-shadow: 0 10px 18px rgba(0, 0, 0, .18);
    width: fit-content;
}

.hotHeroBack:before {
    content: '←';
    font-weight: 900;
    opacity: .92;
}

.hotHeroBack:hover {
    color: rgba(255, 255, 255, .96);
    background: rgba(255, 255, 255, .10);
    border-color: rgba(255, 255, 255, .16);
}

html[data-theme="light"] .hotHeroBack {
    color: rgba(15, 18, 28, .86);
    background: rgba(255, 255, 255, .92);
    border-color: rgba(0, 0, 0, .08);
    box-shadow: 0 10px 18px rgba(0, 0, 0, .06);
}

html[data-theme="light"] .hotHeroBack:hover {
    color: rgba(15, 18, 28, .96);
    background: rgba(255, 255, 255, .98);
    border-color: rgba(0, 0, 0, .12);
    box-shadow: 0 14px 26px rgba(0, 0, 0, .10);
}

.hotHeroTitle {
    font-size: 20px;
    font-weight: 900;
    letter-spacing: .2px;
    color: rgba(255, 255, 255, .94);
}

.hotHeroMeta {
    margin-top: 4px;
    font-size: 12px;
    color: rgba(255, 255, 255, .68);
}

html[data-theme="light"] .hotHero {
    background:
        radial-gradient(420px 260px at 12% 0%, color-mix(in srgb, var(--theme-theme) 24%, transparent), rgba(0, 0, 0, 0) 72%),
        radial-gradient(460px 280px at 88% 12%, color-mix(in srgb, var(--theme-theme) 18%, transparent), rgba(0, 0, 0, 0) 72%),
        rgba(255, 255, 255, .78);
    border-color: rgba(0, 0, 0, .08);
    box-shadow: 0 18px 34px rgba(0, 0, 0, .10);
}

html[data-theme="light"] .hotHeroTitle {
    color: rgba(15, 18, 28, .92);
}

html[data-theme="light"] .hotHeroMeta {
    color: rgba(15, 18, 28, .56);
}

html[data-theme="dark"] .hotHero {
    background:
        radial-gradient(420px 260px at 12% 0%, color-mix(in srgb, var(--theme-theme) 16%, transparent), rgba(0, 0, 0, 0) 70%),
        radial-gradient(460px 280px at 88% 12%, color-mix(in srgb, var(--theme-theme) 12%, transparent), rgba(0, 0, 0, 0) 72%),
        rgba(10, 14, 24, .72);
    border-color: rgba(255, 255, 255, .12);
    box-shadow: 0 20px 46px rgba(0, 0, 0, .30);
}

html[data-theme="dark"] .hotHeroTitle {
    color: rgba(235, 238, 255, .94);
}

html[data-theme="dark"] .hotHeroMeta {
    color: rgba(224, 224, 255, .68);
}

html[data-theme="dark"] .hotHeroBack {
    color: rgba(235, 238, 255, .90);
    background: rgba(255, 255, 255, .06);
    border-color: rgba(255, 255, 255, .14);
}

html[data-theme="dark"] .hotHeroBack:hover {
    color: rgba(255, 255, 255, .96);
    background: rgba(255, 255, 255, .10);
    border-color: rgba(255, 255, 255, .20);
}

html[data-theme="dark"] .hotHeroTab {
    color: rgba(235, 238, 255, .80);
    background: rgba(255, 255, 255, .06);
    border-color: rgba(255, 255, 255, .12);
}

html[data-theme="dark"] .hotHeroTab:hover {
    color: rgba(255, 255, 255, .92);
    background: rgba(255, 255, 255, .10);
    border-color: rgba(255, 255, 255, .18);
    box-shadow: 0 14px 26px rgba(0, 0, 0, .30);
}

html[data-theme="light"] .hotHeroTab {
    color: rgba(15, 18, 28, .72);
    background: rgba(255, 255, 255, .86);
    border-color: rgba(0, 0, 0, .08);
    box-shadow: 0 10px 18px rgba(0, 0, 0, .06);
}

html[data-theme="light"] .hotHeroTab:hover {
    color: rgba(15, 18, 28, .92);
    background: rgba(255, 255, 255, .94);
    border-color: rgba(0, 0, 0, .12);
    box-shadow: 0 14px 26px rgba(0, 0, 0, .10);
}

html[data-theme="light"] .hotHeroTab.active {
    color: rgba(255, 255, 255, .96);
    border-color: rgba(255, 255, 255, .20);
    background: linear-gradient(135deg, color-mix(in srgb, var(--theme-theme) 70%, #60a5fa 30%), color-mix(in srgb, var(--theme-theme) 66%, #a78bfa 34%));
    box-shadow: 0 18px 34px color-mix(in srgb, var(--theme-theme) 22%, rgba(0, 0, 0, .20));
}

.hotHeroTabs {
    flex: 1;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    overflow-x: auto;
    padding: 6px 6px;
    position: relative;
    z-index: 1;
    scrollbar-width: none;
    -ms-overflow-style: none;
    mask-image: linear-gradient(to right, transparent 0, #000 18px, #000 calc(100% - 18px), transparent 100%);
    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 18px, #000 calc(100% - 18px), transparent 100%);
}

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

.hotHeroTab {
    flex: 0 0 auto;
    padding: 8px 14px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    color: rgba(255, 255, 255, .80);
    background: rgba(255, 255, 255, .06);
    border: 1px solid rgba(255, 255, 255, .10);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    transition: transform .18s ease, background-color .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.hotHeroTab:hover {
    transform: translateY(-1px);
    color: rgba(255, 255, 255, .92);
    background: rgba(255, 255, 255, .10);
    border-color: rgba(255, 255, 255, .16);
    box-shadow: 0 14px 26px rgba(0, 0, 0, .24);
}

.hotHeroTab.active {
    color: rgba(255, 255, 255, .96);
    border-color: rgba(255, 255, 255, .16);
    background: linear-gradient(135deg, color-mix(in srgb, var(--theme-theme) 70%, #60a5fa 30%), color-mix(in srgb, var(--theme-theme) 66%, #a78bfa 34%));
    box-shadow: 0 18px 34px rgba(0, 0, 0, .30), 0 16px 30px color-mix(in srgb, var(--theme-theme) 20%, rgba(0, 0, 0, .22));
}

.hotMoreHome {
    width: 1200px;
    margin-top: 22px;
    margin-left: auto;
    margin-right: auto;
}

.hotMoreHome {
    scroll-margin-top: 110px;
}

.hotMoreHome .content .list {
    gap: 12px;
    justify-content: flex-start;
}

@media (min-width: 1100px) {
    .hotMoreHome .content .list {
        display: grid;
        grid-template-columns: repeat(6, minmax(0, 1fr));
        padding: 0 8px 14px;
    }

    .hotMoreHome .content .list .item {
        width: auto;
        margin: 0;
    }
}

.hotHeroTabs {
    scroll-margin-top: 110px;
}

@media (max-width: 768px) {
    .hotHero {
        width: calc(100% - 24px);
        margin: 12px auto 0;
        padding: 12px 12px;
        border-radius: 16px;
        top: 74px;
        gap: 12px;
    }

    .hotHeroTitle {
        font-size: 18px;
    }

    .hotHeroTabs {
        justify-content: flex-start;
        mask-image: none;
        -webkit-mask-image: none;
        padding: 6px 2px;
    }
}

.hotMoreBlock {
    padding-top: 0;
    border: 1px solid rgba(0, 0, 0, .06);
    box-shadow: 0 14px 30px rgba(0, 0, 0, .08);
}

html[data-theme="dark"] .hotMoreBlock {
    border-color: rgba(180, 190, 255, .10);
    box-shadow: 0 18px 36px rgba(0, 0, 0, .22);
}

.hotMoreBlock .nav {
    display: none;
}

html[data-theme="dark"] .hotMoreHome .content .list .item {
    background: rgba(13, 13, 36, .72);
    border-color: rgba(180, 190, 255, .10);
}

html[data-theme="dark"] .hotMoreHome .content .list .item:hover {
    border-color: rgba(180, 190, 255, .18);
    box-shadow: 0 18px 38px rgba(0, 0, 0, .26);
}

html[data-theme="dark"] .hotMoreHome .content .list .item:before {
    background:
        radial-gradient(140px 90px at 22% 0%, rgba(18, 90, 255, .14), rgba(0, 0, 0, 0) 72%),
        radial-gradient(160px 110px at 82% 0%, rgba(0, 200, 255, .10), rgba(0, 0, 0, 0) 76%);
}

html[data-theme="dark"] .hotMoreHome .content .list .item .img {
    background: rgba(255, 255, 255, .04);
}

.hotMorePager {
    padding: 16px 0 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.hotMoreNoMore {
    text-align: center;
    opacity: .68;
}

@media (max-width: 1250px) {
    .hotHero {
        width: calc(100% - 30px);
    }
    .hotMoreHome {
        width: calc(100% - 30px);
    }
}

@media (max-width: 768px) {
    .hotHero {
        margin: 14px auto 0;
        padding: 14px 12px;
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        overflow: visible;
    }
    .hotHeroLeft {
        min-width: 0;
        width: 100%;
    }
    .hotHeroBack {
        margin-bottom: 6px;
    }
    .hotHeroTabs {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: clamp(6px, 1.6vw, 10px);
        padding: 8px max(10px, env(safe-area-inset-left)) 2px max(10px, env(safe-area-inset-right));
        overflow: visible;
        mask-image: none;
        -webkit-mask-image: none;
    }
    .hotHeroTab {
        width: 100%;
        padding: 7px 0;
        text-align: center;
        white-space: nowrap;
        font-size: clamp(12px, 3.2vw, 14px);
        box-sizing: border-box;
    }
    .hotHeroTitle {
        font-size: 18px;
    }
    .hotMoreHome {
        margin-top: 16px;
        width: calc(100% - 20px);
    }
    .home.hotMoreHome .content .list {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: clamp(6px, 2vw, 10px);
        padding: 0 max(8px, env(safe-area-inset-left)) 12px max(8px, env(safe-area-inset-right));
        box-sizing: border-box;
    }
    .home.hotMoreHome .content .list .item {
        width: auto;
        margin: 0;
        min-width: 0;
    }
    .home.hotMoreHome .content .list .item .img {
        height: clamp(132px, 45vw, 156px);
    }

    .homeTabMode .htTabs {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: clamp(6px, 1.6vw, 10px);
        padding: 10px max(10px, env(safe-area-inset-left)) 12px max(10px, env(safe-area-inset-right));
        overflow: visible;
        mask-image: none;
        -webkit-mask-image: none;
    }
    .homeTabMode .htTabs::after {
        content: none;
    }
    .homeTabMode .htTab {
        width: 100%;
        padding: 7px 0;
        text-align: center;
        white-space: nowrap;
        font-size: clamp(12px, 3.2vw, 14px);
        box-sizing: border-box;
    }

    .home .homeTabMode .content .list {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: clamp(6px, 2vw, 10px);
        padding: 0 max(8px, env(safe-area-inset-left)) 12px max(8px, env(safe-area-inset-right));
        box-sizing: border-box;
    }

    .home .homeTabMode .content .list .item {
        width: auto;
        margin: 0;
        min-width: 0;
    }

    .home .homeTabMode .content .list .item .img {
        height: clamp(132px, 45vw, 156px);
    }
}

.ticketBox .ticket-no {
    color: var(--theme-theme);
    cursor: pointer;
    font-weight: 600;
}

.ticketBox .ticket-query-tabs {
    margin-top: 10px;
}

.ticketBox .ticket-query-tabs.el-tabs--card > .el-tabs__header {
    margin: 0 0 10px 0;
}

.ticketBox .ticket-query-tabs.el-tabs--card > .el-tabs__header .el-tabs__nav-wrap::after {
    background-color: rgba(0, 0, 0, 0);
}

.ticketBox .ticket-query-tabs.el-tabs--card > .el-tabs__header .el-tabs__nav-wrap {
    border-radius: 12px;
    overflow: hidden;
    background: rgba(0, 0, 0, .03);
    border: 1px solid rgba(0, 0, 0, .06);
}

.ticketBox .ticket-query-tabs.el-tabs--card > .el-tabs__header .el-tabs__nav-scroll {
    padding: 4px;
}

.ticketBox .ticket-query-tabs.el-tabs--card > .el-tabs__header .el-tabs__item {
    height: 32px;
    line-height: 32px;
    padding: 0 12px;
    border-radius: 10px;
    border: 1px solid rgba(0, 0, 0, 0);
}

.ticketBox .ticket-query-tabs.el-tabs--card > .el-tabs__header .el-tabs__item.is-active {
    border-color: rgba(18, 90, 255, .20);
}

.ticketBox .ticket-query-tabs.el-tabs--card > .el-tabs__header {
    border-bottom-color: rgba(0, 0, 0, .06);
}

.ticketBox .ticket-query-tabs.el-tabs--card > .el-tabs__header .el-tabs__item {
    color: rgba(0, 0, 0, .66);
    background: rgba(0, 0, 0, .03);
    border-color: rgba(0, 0, 0, .08);
    font-weight: 800;
}

.ticketBox .ticket-query-tabs.el-tabs--card > .el-tabs__header .el-tabs__item:hover {
    color: rgba(0, 0, 0, .82);
    background: rgba(18, 90, 255, .06);
    border-color: rgba(18, 90, 255, .14);
}

.ticketBox .ticket-query-tabs.el-tabs--card > .el-tabs__header .el-tabs__item.is-active {
    color: rgba(0, 0, 0, .86);
    background: rgba(255, 255, 255, .92);
    border-color: rgba(18, 90, 255, .20);
    box-shadow: 0 10px 22px rgba(0, 0, 0, .10);
}

html[data-theme="dark"] .ticketBox {
    color: rgba(224, 224, 255, .86);
}

html[data-theme="dark"] .ticketBox .ticket-query-tabs.el-tabs--card > .el-tabs__header {
    border-bottom-color: rgba(180, 190, 255, .14);
}

html[data-theme="dark"] .ticketBox .ticket-query-tabs.el-tabs--card > .el-tabs__header .el-tabs__nav-wrap {
    background: rgba(10, 10, 26, .52);
    border: 1px solid rgba(180, 190, 255, .12);
}

html[data-theme="dark"] .ticketBox .ticket-query-tabs.el-tabs--card > .el-tabs__header .el-tabs__item {
    color: rgba(224, 224, 255, .82);
    background: rgba(10, 10, 26, .56);
    border-color: rgba(180, 190, 255, .12);
}

html[data-theme="dark"] .ticketBox .ticket-query-tabs.el-tabs--card > .el-tabs__header .el-tabs__item.is-active {
    color: rgba(224, 224, 255, .92);
    background: linear-gradient(90deg, rgba(18, 90, 255, .18), rgba(0, 200, 255, .12));
    border-color: rgba(0, 200, 255, .22);
}

html[data-theme="dark"] .ticketBox .ticket-query-tabs .el-tabs__nav-wrap::after {
    background-color: rgba(180, 190, 255, .12);
}

html[data-theme="dark"] .ticketBox .el-tag {
    background: rgba(180, 190, 255, .10);
    border-color: rgba(180, 190, 255, .18);
    color: rgba(224, 224, 255, .86);
}

html[data-theme="dark"] .ticketBox .ticket-timeline-item .c {
    color: rgba(224, 224, 255, .92);
}

.ticketBox .ticket-tab-body {
    max-height: 58vh;
    overflow: auto;
    padding-right: 2px;
}

.ticketBox .ticket-history-scroll {
    max-height: 46vh;
    overflow: auto;
    padding-right: 6px;
}

.ticketBox .ticket-result-row {
    display: flex;
    margin-bottom: 8px;
    font-size: 13px;
}

.ticketBox .ticket-result-row .k {
    width: 70px;
    color: #666;
}

.ticketBox .ticket-result-row .v {
    flex: 1;
    color: #222;
    word-break: break-word;
}

html[data-theme="dark"] .ticketBox .ticket-result-row .k {
    color: rgba(224, 224, 255, .62);
}

html[data-theme="dark"] .ticketBox .ticket-result-row .v {
    color: rgba(224, 224, 255, .92);
}

.ticketBox .ticket-timeline {
    margin-top: 8px;
}

.ticketBox .ticket-timeline-item {
    padding: 8px 10px;
    border-radius: 10px;
    background: rgba(0, 0, 0, .03);
    margin-bottom: 8px;
}

.ticketBox .ticket-timeline-item .t {
    font-size: 12px;
    color: #666;
    margin-bottom: 4px;
}

html[data-theme="dark"] .ticketBox .ticket-timeline-item {
    background: rgba(180, 190, 255, .08);
}

html[data-theme="dark"] .ticketBox .ticket-timeline-item .t {
    color: rgba(224, 224, 255, .62);
}

.ticketBox .ticket-rate {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px dashed rgba(0, 0, 0, .12);
}

html[data-theme="dark"] .ticketBox .ticket-rate {
    border-top-color: rgba(180, 190, 255, .18);
}

.ticketBox .ticket-rate-title {
    font-weight: 600;
    margin-bottom: 8px;
}

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



.listBox {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    min-height: calc(100vh - 180px);
    display: block;
}

.listBox h3 {
    position: relative;
    font-size: 18px;
    font-weight: bold;
    color: var(--theme-color);
    padding: 16px 20px 6px;
    display: flex;
    align-items: center;
}

.listBox h3:after {
    display: none;
}

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

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

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

.listBox .left {
    width: 100%;
    overflow: visible;
}

.violation-panel {
    margin: 0 15px 12px;
    border-radius: 14px;
    background-color: var(--theme-other_background);
    border: 1px solid rgba(0, 0, 0, .06);
    box-shadow: 0 6px 18px rgba(0, 0, 0, .06);
    overflow: hidden;
}

html[data-theme="dark"] .violation-panel {
    background: rgba(10, 10, 26, .62);
    border-color: rgba(180, 190, 255, .12);
    box-shadow: 0 22px 48px rgba(0, 0, 0, .32);
}

.violation-hero {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    padding: 16px 16px 12px;
    background: linear-gradient(180deg, rgba(245, 108, 108, .12), rgba(245, 108, 108, 0));
}

html[data-theme="dark"] .violation-hero {
    background: linear-gradient(180deg, rgba(245, 108, 108, .14), rgba(245, 108, 108, 0)),
        radial-gradient(900px 420px at 30% 0%, rgba(18, 90, 255, .14), rgba(0, 0, 0, 0) 62%);
}

.violation-mark {
    width: 36px;
    height: 36px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: none;
    font-weight: 800;
    color: #F56C6C;
    background: rgba(245, 108, 108, .16);
}

.violation-head {
    flex: 1;
    min-width: 0;
}

.violation-title {
    font-size: 16px;
    font-weight: 800;
    letter-spacing: .2px;
}

html[data-theme="dark"] .violation-title {
    color: rgba(224, 224, 255, .92);
}

.violation-sub {
    margin-top: 2px;
    font-size: 13px;
    color: rgba(0, 0, 0, .60);
}

html[data-theme="dark"] .violation-sub {
    color: rgba(224, 224, 255, .72);
}

.violation-meta {
    margin-top: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.violation-pill {
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(0, 0, 0, .04);
    color: rgba(0, 0, 0, .68);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html[data-theme="dark"] .violation-pill {
    background: rgba(180, 190, 255, .10);
    color: rgba(224, 224, 255, .78);
    border: 1px solid rgba(180, 190, 255, .12);
}

.violation-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.violation-grid {
    padding: 0 16px 16px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.violation-body {
    padding-bottom: 10px;
}

.violation-more {
    padding: 0 16px 16px;
    display: flex;
    justify-content: center;
}

.violation-empty {
    margin: 0 16px 16px;
    padding: 10px 12px;
    border-radius: 12px;
    background: rgba(0, 0, 0, .03);
    color: rgba(0, 0, 0, .58);
    font-size: 13px;
}

html[data-theme="dark"] .violation-empty {
    background: rgba(180, 190, 255, .08);
    color: rgba(224, 224, 255, .72);
}

.violation-reco {
    margin: 0 16px 16px;
    padding: 12px;
    border-radius: 12px;
    background: rgba(0, 0, 0, .02);
    border: 1px dashed rgba(0, 0, 0, .12);
}

html[data-theme="dark"] .violation-reco {
    background: rgba(10, 10, 26, .48);
    border-color: rgba(180, 190, 255, .18);
}

.violation-reco-title {
    font-size: 13px;
    font-weight: 800;
    color: rgba(0, 0, 0, .78);
}

html[data-theme="dark"] .violation-reco-title {
    color: rgba(224, 224, 255, .86);
}

.violation-chip-list {
    margin-top: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.violation-chip {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    padding: 6px 10px;
    border-radius: 999px;
    border: 1px solid rgba(0, 0, 0, .10);
    background: rgba(255, 255, 255, .70);
    font-size: 12px;
    color: rgba(0, 0, 0, .72);
    transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html[data-theme="dark"] .violation-chip {
    border-color: rgba(180, 190, 255, .14);
    background: rgba(10, 10, 26, .62);
    color: rgba(224, 224, 255, .78);
}

.violation-chip:hover {
    transform: translateY(-1px);
    border-color: rgba(0, 0, 0, .16);
    box-shadow: 0 10px 18px rgba(0, 0, 0, .06);
    color: var(--theme-theme);
}

html[data-theme="dark"] .violation-chip:hover {
    border-color: rgba(0, 200, 255, .20);
    box-shadow: 0 16px 32px rgba(0, 0, 0, .22);
    color: rgba(0, 200, 255, .92);
}

.violation-reco-tip {
    margin-top: 10px;
    font-size: 12px;
    color: rgba(0, 0, 0, .56);
}

html[data-theme="dark"] .violation-reco-tip {
    color: rgba(224, 224, 255, .64);
}

.violation-card {
    position: relative;
    padding: 12px;
    border-radius: 12px;
    border: 1px solid rgba(0, 0, 0, .06);
    background: rgba(255, 255, 255, .70);
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

html[data-theme="dark"] .violation-card {
    border-color: rgba(180, 190, 255, .12);
    background: rgba(10, 10, 26, .62);
}

.violation-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 26px rgba(0, 0, 0, .08);
    border-color: rgba(0, 0, 0, .12);
}

html[data-theme="dark"] .violation-card:hover {
    box-shadow: 0 22px 48px rgba(0, 0, 0, .28);
    border-color: rgba(0, 200, 255, .16);
    background: rgba(18, 90, 255, .10);
}

.violation-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.violation-word {
    flex: 1;
    min-width: 0;
    font-size: 14px;
    font-weight: 800;
    color: rgba(0, 0, 0, .86);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html[data-theme="dark"] .violation-word {
    color: rgba(224, 224, 255, .92);
}

.violation-tag {
    flex: none;
    font-size: 12px;
    padding: 2px 10px;
    border-radius: 999px;
    border: 1px solid rgba(0, 0, 0, .10);
    color: rgba(0, 0, 0, .65);
    background: rgba(0, 0, 0, .04);
}

.violation-tag.is-danger {
    color: #F56C6C;
    border-color: rgba(245, 108, 108, .38);
    background: rgba(245, 108, 108, .12);
}

.violation-tag.is-normal {
    color: #E6A23C;
    border-color: rgba(230, 162, 60, .38);
    background: rgba(230, 162, 60, .12);
}

.violation-detail {
    margin-top: 8px;
    font-size: 12px;
    line-height: 1.6;
    color: rgba(0, 0, 0, .66);
    word-break: break-word;
}

html[data-theme="dark"] .violation-detail {
    color: rgba(224, 224, 255, .76);
}

.violation-path {
    margin-top: 8px;
    font-size: 12px;
    color: rgba(0, 0, 0, .46);
    word-break: break-all;
}

html[data-theme="dark"] .violation-path {
    color: rgba(224, 224, 255, .58);
}

.violation-tools {
    margin-top: 10px;
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    align-items: center;
}

.violation-card.violation-skeleton {
    overflow: hidden;
}

.violation-card.violation-skeleton .violation-word,
.violation-card.violation-skeleton .violation-detail,
.violation-card.violation-skeleton .violation-path,
.violation-card.violation-skeleton .violation-tag {
    color: transparent;
    background: rgba(0, 0, 0, .06);
    border-color: transparent;
    border-radius: 10px;
}

.violation-card.violation-skeleton .violation-word {
    height: 16px;
    width: 62%;
}

.violation-card.violation-skeleton .violation-tag {
    height: 16px;
    width: 68px;
}

.violation-card.violation-skeleton .violation-detail {
    height: 14px;
    width: 92%;
}

.violation-card.violation-skeleton .violation-path {
    height: 14px;
    width: 72%;
}

.violation-card.violation-skeleton::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .55), rgba(255, 255, 255, 0));
    transform: translateX(-100%);
    animation: violation-shimmer 1.1s ease-in-out infinite;
}

html[data-theme="dark"] .violation-card.violation-skeleton::after {
    background: linear-gradient(90deg, rgba(0, 0, 0, 0), rgba(180, 190, 255, .18), rgba(0, 0, 0, 0));
}

@keyframes violation-shimmer {
    100% {
        transform: translateX(100%);
    }
}

@media (min-width: 1100px) {
    .violation-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .violation-panel {
        margin: 0 0 12px;
    }
    .violation-hero {
        flex-direction: column;
    }
    .violation-actions {
        justify-content: flex-start;
    }
    .violation-grid {
        grid-template-columns: 1fr;
        padding: 0 12px 12px;
    }
}

.listBox .left .list {
    padding: 0 20px;

}

.listBox .left .list .item {
    position: relative;
    display: block;
    padding: 15px 0;
    border-bottom: 1px dashed color-mix(in srgb, var(--theme-theme) 18%, #e6e6e6 82%);
}

.listBox .left .list .item .title {
    font-size: 17px;
    font-weight: bold;
    padding-bottom: 4px;
    color: var(--theme-theme);
}

.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;
    margin-top: 10px;
}

.listBox .left .list .item .btns .btn {
    position: relative;
    margin-right: 35px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    font-weight: 500;
    color: var(--theme-color);
}

.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;
    color: #999;
    flex: none;
    padding-left: 25px;
    margin-top: 10px;
}

.listBox .left .list .item .type::after {
    content: "\e619";
    position: absolute;
    top: -3.4px;
    left: 0;
    font-family: 'iconfont';
    font-size: 20px;
}

.listBox .left .list .item .type span {
    margin-right: 35px;
}

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

.listBox .left .list .item .type.time::after {
    content: "\ebb1";
}

.listBox .left .list .item .type.cate::after {
    content: "\e65f";
}


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

.listBox .box {
    border-radius: 12px;
    background-color: var(--theme-other_background);
    border: 1px solid color-mix(in srgb, var(--theme-theme) 12%, rgba(0, 0, 0, .06));
    box-shadow: 0 12px 28px color-mix(in srgb, var(--theme-theme) 10%, rgba(0, 0, 0, .08));
    padding: 14px 0 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: 4px 6px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.listBox .right .list .item:hover {
    transform: translateY(0);
}

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

.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: 120px;
    margin-right: 20px;
}

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

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

.listBox .screen .box a {
    display: block;
    padding: 12px 0;
    border-bottom: 1px dashed #e6e6e6;
}

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

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


.listBox .details {
    padding: 40px 50px;
    min-height: inherit;
}

.details .pic {
    width: 160px;
    height: 212px;
    border-radius: 8px;
    background-color: var(--theme-background);
    margin: 0 auto 30px;
}

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


.details .title {
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 25px;
    color: var(--theme-theme);
}

.details .cat {
    display: flex;
    font-size: 15px;
    padding: 8px 0;
}

.details .cat .l {
    flex: none;
    width: 80px;
    opacity: .5;
}

.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;
    margin-top: 24px;
    justify-content: center;
}

.details .btns .btn {
    position: relative;
    width: 125px;
    height: 38px;
    line-height: 38px;
    border-radius: 38px;
    background-color: var(--theme-other_background);
    margin: 0 15px;
    font-size: 14px;
    color: var(--theme-color);
    text-align: center;
    opacity: .88;
    cursor: pointer;
}

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

.details .btns .btn:after {
    content: "";
    position: absolute;
    inset: 0;
    box-shadow: 0 2px 4px var(--theme-theme);
    border-radius: 38px;
    border: 1px solid var(--theme-color);
    opacity: .1;
}

.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);
}

.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-radius: 12px;
    background-color: var(--theme-other_background);
    border: 1px solid color-mix(in srgb, var(--theme-theme) 12%, rgba(0, 0, 0, .06));
    box-shadow: 0 12px 28px color-mix(in srgb, var(--theme-theme) 10%, rgba(0, 0, 0, .08));
    padding: 15px;
    margin-bottom: 15px;
}

.time-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: 12px;
    line-height: 1;
    color: rgba(0, 0, 0, .68);
    background: linear-gradient(90deg, color-mix(in srgb, var(--theme-theme) 14%, transparent), color-mix(in srgb, var(--theme-theme) 6%, transparent));
    border: 1px solid color-mix(in srgb, var(--theme-theme) 18%, rgba(0, 0, 0, 0));
}

html[data-theme="dark"] .time-pill {
    color: rgba(224, 224, 255, .86);
    background: linear-gradient(90deg, color-mix(in srgb, var(--theme-theme) 28%, rgba(0, 0, 0, 0)), color-mix(in srgb, var(--theme-theme) 14%, rgba(0, 0, 0, 0)));
    border-color: rgba(180, 190, 255, .18);
}

.quantum-panel {
    position: relative;
    overflow: hidden;
    border-radius: 14px;
    --q-accent-a: color-mix(in srgb, var(--theme-theme) 88%, #3b82f6 12%);
    --q-accent-b: color-mix(in srgb, var(--theme-theme) 70%, #a855f7 30%);
    --q-accent-c: color-mix(in srgb, var(--theme-theme) 55%, #c084fc 45%);
    background: color-mix(in srgb, var(--theme-other_background) 96%, rgba(0, 0, 0, .02));
    border: 1px solid rgba(0, 0, 0, .06);
    box-shadow: 0 8px 18px rgba(0, 0, 0, .05);
}

.quantum-panel:before,
.quantum-panel:after {
    content: "";
    position: absolute;
    pointer-events: none;
    opacity: 0;
    animation: none;
}

.quantum-panel:before {
    inset: 0;
}

.quantum-panel:after {
    inset: 0;
}

@keyframes quantumGrid {
    0% { background-position: 0 0, 0 0, 0 0, 0 0; }
    100% { background-position: 240px 180px, -180px -240px, 0 0, 0 0; }
}

@keyframes quantumAurora {
    0% { transform: rotate(-10deg) translate3d(-26px, -16px, 0) scale(1); }
    100% { transform: rotate(14deg) translate3d(28px, 18px, 0) scale(1.03); }
}

@keyframes quantumFlow {
    0% { transform: rotate(-6deg) translate3d(-12px, -6px, 0); }
    100% { transform: rotate(10deg) translate3d(18px, 10px, 0); }
}

.quantum-hero {
    position: relative;
    z-index: 1;
    padding: 12px 14px 10px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
        "title metrics"
        "ops ops"
        "chips chips";
    column-gap: 12px;
    row-gap: 8px;
    align-items: start;
}

.quantum-title {
    grid-area: title;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.quantum-title-row {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.q-logo {
    width: 22px;
    height: 22px;
    border-radius: 10px;
    background:
        radial-gradient(14px 12px at 30% 28%, rgba(255, 255, 255, .92), rgba(255, 255, 255, 0) 62%),
        linear-gradient(180deg, rgba(255, 255, 255, .86), rgba(255, 255, 255, .62));
    border: 1px solid rgba(0, 0, 0, .20);
    box-shadow: 0 14px 28px rgba(0, 0, 0, .12), inset 0 1px 0 rgba(255, 255, 255, .72);
    position: relative;
    flex: none;
    transform: translateZ(0);
    backface-visibility: hidden;
}

.q-logo::after {
    content: "";
    position: absolute;
    inset: -3px;
    border-radius: 12px;
    background: conic-gradient(from 180deg, color-mix(in srgb, var(--q-accent-c) 70%, rgba(0, 0, 0, 0)) 0%, color-mix(in srgb, var(--q-accent-c) 55%, rgba(0, 0, 0, 0)) 24%, color-mix(in srgb, var(--q-accent-b) 58%, rgba(0, 0, 0, 0)) 52%, color-mix(in srgb, var(--q-accent-a) 52%, rgba(0, 0, 0, 0)) 76%, color-mix(in srgb, var(--q-accent-c) 70%, rgba(0, 0, 0, 0)) 100%);
    -webkit-mask: radial-gradient(farthest-side, rgba(0, 0, 0, 0) calc(100% - 2px), rgba(0, 0, 0, 1) 0);
    mask: radial-gradient(farthest-side, rgba(0, 0, 0, 0) calc(100% - 2px), rgba(0, 0, 0, 1) 0);
    opacity: .84;
    filter: blur(.06px);
    animation: qLogoOrbit 3.4s linear infinite;
    will-change: transform;
    backface-visibility: hidden;
    pointer-events: none;
}

.q-logo::before {
    content: "";
    position: absolute;
    inset: 3px;
    border-radius: 8px;
    background:
        radial-gradient(10px 10px at 32% 30%, rgba(255, 255, 255, .76), rgba(255, 255, 255, 0) 58%),
        radial-gradient(12px 10px at 70% 78%, color-mix(in srgb, var(--q-accent-c) 26%, rgba(0, 0, 0, 0)), rgba(0, 0, 0, 0) 64%),
        linear-gradient(135deg, var(--q-accent-a), var(--q-accent-c));
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14);
    opacity: .96;
    pointer-events: none;
}

html[data-theme="dark"] .q-logo {
    background:
        radial-gradient(14px 12px at 30% 28%, rgba(255, 255, 255, .12), rgba(255, 255, 255, 0) 62%),
        linear-gradient(180deg, rgba(16, 18, 52, .92), rgba(8, 10, 28, .84));
    border-color: rgba(180, 190, 255, .18);
    box-shadow: 0 18px 36px rgba(0, 0, 0, .38), inset 0 1px 0 rgba(255, 255, 255, .10);
}

html[data-theme="dark"] .q-logo::before {
    background:
        radial-gradient(10px 10px at 32% 30%, rgba(255, 255, 255, .22), rgba(255, 255, 255, 0) 58%),
        radial-gradient(12px 10px at 70% 78%, color-mix(in srgb, var(--q-accent-c) 30%, rgba(0, 0, 0, 0)), rgba(0, 0, 0, 0) 64%),
        linear-gradient(135deg, color-mix(in srgb, var(--q-accent-a) 92%, rgba(0, 0, 0, 0)), color-mix(in srgb, var(--q-accent-c) 84%, rgba(0, 0, 0, 0)));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--q-accent-c) 14%, rgba(0, 0, 0, 0));
}

html[data-theme="dark"] .q-logo::after {
    opacity: .84;
    filter: blur(.12px);
}

html[data-theme="dark"] .quantum-panel {
    background: rgba(13, 13, 36, .74);
    border-color: rgba(180, 190, 255, .14);
    box-shadow: 0 18px 44px rgba(0, 0, 0, .30);
}

html[data-theme="dark"] .quantum-title-main {
    background: linear-gradient(90deg, rgba(234, 238, 255, .92), rgba(120, 190, 255, .86));
}

html[data-theme="dark"] .quantum-title-sub {
    color: rgba(224, 224, 255, .66);
}

html[data-theme="dark"] .quantum-metric {
    background: rgba(255, 255, 255, .06);
    border-color: rgba(180, 190, 255, .14);
}

html[data-theme="dark"] .quantum-metrics {
    background: rgba(255, 255, 255, .06);
    border-color: rgba(180, 190, 255, .14);
}

html[data-theme="dark"] .quantum-metric .k {
    color: rgba(224, 224, 255, .62);
}

html[data-theme="dark"] .quantum-metric .v {
    color: var(--q-metric-v);
}

html[data-theme="dark"] .quantum-chip {
    background: rgba(255, 255, 255, .06);
    border-color: rgba(180, 190, 255, .14);
    color: rgba(224, 224, 255, .82);
}

@keyframes qLogoOrbit {
    0% { transform: rotate(0deg) translateZ(0); }
    100% { transform: rotate(360deg) translateZ(0); }
}

.quantum-title-main {
    font-size: 18px;
    font-weight: 900;
    letter-spacing: .4px;
    background: linear-gradient(90deg, rgba(0, 0, 0, .88), var(--q-accent-b));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.quantum-title-sub {
    font-size: 12px;
    color: rgba(0, 0, 0, .56);
}

.q-badge {
    display: inline-flex;
    align-items: center;
    height: 18px;
    padding: 0 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .8px;
    color: color-mix(in srgb, var(--q-accent-a) 92%, rgba(0, 0, 0, 0));
    background: color-mix(in srgb, var(--q-accent-a) 10%, rgba(0, 0, 0, 0));
    border: 1px solid color-mix(in srgb, var(--q-accent-a) 18%, rgba(0, 0, 0, 0));
}

.quantum-metrics {
    grid-area: metrics;
    margin: 0;
    display: inline-flex;
    justify-content: flex-end;
    gap: 6px;
    align-items: center;
    padding: 4px 6px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .62);
    border: 1px solid rgba(0, 0, 0, .08);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.quantum-metric {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(0, 0, 0, .03);
    border: 1px solid rgba(0, 0, 0, .06);
    position: relative;
    white-space: nowrap;
    --q-metric-v: rgba(230, 162, 60, .96);
}

.quantum-metric::before {
    content: none;
}

.quantum-metric::after {
    content: none;
}

.quantum-metric.metric-hit::after {
    background: color-mix(in srgb, var(--q-accent-a) 78%, rgba(255, 255, 255, 0));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--q-accent-a) 16%, rgba(0, 0, 0, 0));
}

.quantum-metric.metric-hit {
    --q-metric-v: rgba(230, 162, 60, .96);
}

.quantum-metric.metric-time::after {
    background: color-mix(in srgb, var(--q-accent-b) 72%, rgba(255, 255, 255, 0));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--q-accent-b) 14%, rgba(0, 0, 0, 0));
}

.quantum-metric.metric-time {
    --q-metric-v: rgba(230, 162, 60, .96);
}

.quantum-metric.metric-progress::after {
    background: color-mix(in srgb, var(--q-accent-c) 64%, rgba(255, 255, 255, 0));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--q-accent-c) 14%, rgba(0, 0, 0, 0));
}

.quantum-metric.metric-progress {
    --q-metric-v: rgba(230, 162, 60, .96);
}

.quantum-metric.metric-last::after {
    background: color-mix(in srgb, var(--q-accent-b) 52%, rgba(255, 255, 255, 0));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--q-accent-b) 12%, rgba(0, 0, 0, 0));
}

.quantum-metric.metric-last {
    --q-metric-v: rgba(230, 162, 60, .96);
}

.quantum-metric .k {
    font-size: 11px;
    color: rgba(0, 0, 0, .56);
}

.quantum-metric .v {
    margin-top: 0;
    font-size: 12px;
    font-weight: 900;
    color: var(--q-metric-v);
}

.quantum-ops {
    grid-area: ops;
    margin: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: center;
}

.quantum-mode {
    display: inline-flex;
    background: rgba(255, 255, 255, .70);
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 999px;
    padding: 2px;
    gap: 2px;
    backdrop-filter: blur(10px);
}

.quantum-mode a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 52px;
    height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    font-size: 12px;
    color: rgba(0, 0, 0, .66);
    text-decoration: none;
    transition: all .2s ease;
}

.quantum-mode a.active {
    color: var(--theme-other_background);
    background: linear-gradient(90deg, var(--q-accent-a), var(--q-accent-c));
    box-shadow: 0 10px 24px color-mix(in srgb, var(--q-accent-b) 18%, rgba(0, 0, 0, 0));
}

.quantum-actions {
    display: inline-flex;
    justify-content: flex-end;
    gap: 6px;
    align-items: center;
    flex-wrap: nowrap;
    margin-left: auto;
    padding: 3px;
    border-radius: 999px;
    background: rgba(0, 0, 0, .03);
    border: 1px solid rgba(0, 0, 0, .08);
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
}

.quantum-actions::-webkit-scrollbar {
    display: none;
}

.quantum-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 30px;
    padding: 0 12px;
    border-radius: 999px;
    font-size: 12px;
    color: rgba(0, 0, 0, .72);
    background: rgba(255, 255, 255, .72);
    border: 1px solid rgba(0, 0, 0, .08);
    text-decoration: none;
    transition: all .2s ease;
    flex: 0 0 auto;
}

.quantum-action:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 18px rgba(0, 0, 0, .08);
}

.quantum-action.is-loading {
    position: relative;
    padding-left: 28px;
    pointer-events: none;
    opacity: .88;
}

.quantum-action.is-loading:before {
    content: "";
    position: absolute;
    left: 10px;
    top: 50%;
    width: 12px;
    height: 12px;
    margin-top: -6px;
    border-radius: 999px;
    border: 2px solid rgba(0, 0, 0, .20);
    border-top-color: rgba(0, 0, 0, .55);
    animation: q-action-spin .9s linear infinite;
}

.quantum-action.primary {
    color: var(--theme-other_background);
    background: linear-gradient(90deg, var(--q-accent-a), var(--q-accent-c));
    border-color: rgba(0, 0, 0, 0);
}

.quantum-action.active {
    color: var(--q-accent-a);
    background: color-mix(in srgb, var(--q-accent-a) 10%, rgba(0, 0, 0, 0));
    border-color: color-mix(in srgb, var(--q-accent-a) 26%, rgba(0, 0, 0, 0));
}

.quantum-action[data-kind="minor"] {
    background: rgba(255, 255, 255, .0);
    border-color: rgba(0, 0, 0, .0);
}

.quantum-action[data-kind="minor"]:hover {
    background: rgba(255, 255, 255, .72);
    border-color: rgba(0, 0, 0, .08);
    box-shadow: none;
    transform: none;
}

.quantum-action[data-kind="toggle"] {
    font-weight: 900;
}

@keyframes q-action-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.quantum-chips {
    grid-area: chips;
    margin: 0;
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 0;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
}

.quantum-chips::-webkit-scrollbar {
    display: none;
}

.quantum-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 9px;
    border-radius: 999px;
    background: rgba(0, 0, 0, .03);
    border: 1px solid rgba(0, 0, 0, .08);
    text-decoration: none;
    color: rgba(0, 0, 0, .72);
    transition: all .2s ease;
    position: relative;
    overflow: hidden;
    flex: 0 0 auto;
}

.quantum-chip .q-state {
    position: absolute;
    right: 8px;
    top: 7px;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: rgba(0, 0, 0, .28);
    box-shadow: 0 0 0 4px rgba(0, 0, 0, .04);
}

.quantum-chip .q-state.is-loading {
    background: rgba(0, 200, 255, .95);
    box-shadow: 0 0 0 4px rgba(0, 200, 255, .14);
    animation: qPulse 1.1s ease-in-out infinite;
}

.quantum-chip .q-state.is-done {
    background: rgba(0, 200, 120, .92);
    box-shadow: 0 0 0 4px rgba(0, 200, 120, .14);
}

.quantum-chip .q-state.is-error {
    background: rgba(255, 70, 70, .92);
    box-shadow: 0 0 0 4px rgba(255, 70, 70, .12);
}

@keyframes qPulse {
    0% { transform: scale(.92); opacity: .72; }
    50% { transform: scale(1.12); opacity: 1; }
    100% { transform: scale(.92); opacity: .72; }
}

.quantum-chip .icon {
    width: 16px;
    height: 16px;
}

.quantum-chip .name {
    font-size: 12px;
    font-weight: 800;
}

.quantum-chip .meta {
    font-size: 12px;
    color: rgba(0, 0, 0, .54);
    padding: 1px 8px;
    border-radius: 999px;
    background: rgba(0, 0, 0, .04);
}

.quantum-chip:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 26px rgba(0, 0, 0, .08);
}

.quantum-chip.active {
    border-color: rgba(0, 200, 255, .40);
    box-shadow: 0 18px 34px rgba(0, 200, 255, .12);
    background: linear-gradient(180deg, rgba(0, 200, 255, .14), rgba(255, 255, 255, .72));
}

.quantum-chip.is-loading {
    border-color: rgba(0, 200, 255, .28);
    background: linear-gradient(180deg, rgba(0, 200, 255, .10), rgba(255, 255, 255, .72));
}

.quantum-chip.is-error {
    border-color: rgba(255, 70, 70, .26);
    background: linear-gradient(180deg, rgba(255, 70, 70, .08), rgba(255, 255, 255, .72));
}

.quantum-stream {
    position: relative;
    z-index: 1;
    margin: 0 16px 10px;
    height: 42px;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid rgba(0, 0, 0, .06);
    background: rgba(255, 255, 255, .72);
    backdrop-filter: blur(10px);
}

.quantum-stream-bg {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, color-mix(in srgb, var(--q-accent-a) 12%, rgba(0, 0, 0, 0)), color-mix(in srgb, var(--q-accent-b) 10%, rgba(0, 0, 0, 0)), color-mix(in srgb, var(--q-accent-c) 10%, rgba(0, 0, 0, 0)));
    opacity: .85;
}

.quantum-stream-line {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 160px;
    left: -180px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .80), rgba(255, 255, 255, 0));
    filter: blur(1px);
    animation: quantumScan 2.1s ease-in-out infinite;
    opacity: .9;
}

@keyframes quantumScan {
    0% { transform: translateX(0); }
    100% { transform: translateX(calc(100% + 360px)); }
}

.quantum-stream-progress {
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 8px;
    height: 3px;
    border-radius: 999px;
    background: rgba(0, 0, 0, .06);
    overflow: hidden;
    z-index: 1;
}

.quantum-stream-progress .bar {
    height: 100%;
    width: 0%;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--q-accent-a), var(--q-accent-b), var(--q-accent-c));
    box-shadow: 0 10px 18px color-mix(in srgb, var(--q-accent-b) 14%, rgba(0, 0, 0, 0));
    transition: width .35s cubic-bezier(.22, .9, .18, 1);
}

.quantum-stream-text {
    position: relative;
    z-index: 1;
    height: 42px;
    display: flex;
    align-items: center;
    padding: 0 12px 2px;
    font-size: 13px;
    font-weight: 700;
    color: rgba(0, 0, 0, .68);
    gap: 8px;
}

.quantum-stream-text .q-icon {
    width: 18px;
    height: 18px;
    border-radius: 9px;
    background: radial-gradient(60% 60% at 35% 30%, rgba(255, 255, 255, .92), rgba(255, 255, 255, 0) 72%),
        linear-gradient(135deg, var(--q-accent-a), var(--q-accent-c));
    box-shadow: 0 14px 26px color-mix(in srgb, var(--q-accent-b) 18%, rgba(0, 0, 0, 0));
    position: relative;
    flex: none;
}

.quantum-stream-text .q-icon::after {
    content: "";
    position: absolute;
    inset: 4px;
    border-radius: 7px;
    border: 2px solid rgba(255, 255, 255, .55);
    border-left-color: rgba(255, 255, 255, 0);
    border-bottom-color: rgba(255, 255, 255, 0);
    animation: qSpin .95s linear infinite;
}

.quantum-stream-text .q-main {
    font-weight: 900;
    color: rgba(0, 0, 0, .78);
}

.quantum-stream-text .q-strong {
    font-weight: 1000;
    color: rgba(0, 0, 0, .84);
}

.quantum-stream-text .q-muted {
    color: rgba(0, 0, 0, .56);
    font-weight: 800;
}

.quantum-stream-text .q-sep {
    opacity: .55;
}

.quantum-groups {
    position: relative;
    z-index: 1;
    padding: 0 18px 18px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.quantum-group {
    border-radius: 16px;
    background: rgba(255, 255, 255, .74);
    border: 1px solid rgba(0, 0, 0, .08);
    overflow: hidden;
    backdrop-filter: blur(10px);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.quantum-group:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 34px rgba(0, 0, 0, .10);
    border-color: rgba(18, 90, 255, .14);
}

.quantum-group-head {
    padding: 12px 12px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid rgba(0, 0, 0, .06);
    background: linear-gradient(180deg, rgba(18, 90, 255, .06), rgba(255, 255, 255, 0));
}

.quantum-group-head .left {
    display: flex;
    gap: 10px;
    align-items: center;
    min-width: 0;
}

.quantum-group-head .q-left {
    display: flex;
    gap: 10px;
    align-items: center;
    min-width: 0;
}

.quantum-group-head .icon {
    width: 24px;
    height: 24px;
    flex: none;
}

.quantum-group-head .t {
    min-width: 0;
}

.quantum-group-head .name {
    font-weight: 900;
    color: rgba(0, 0, 0, .82);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.quantum-group-head .sub {
    margin-top: 2px;
    font-size: 12px;
    color: rgba(0, 0, 0, .54);
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

.quantum-group-head .sub .dot {
    opacity: .6;
}

.quantum-group-head .pill {
    display: inline-flex;
    align-items: center;
    height: 24px;
    padding: 0 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
    color: rgba(0, 0, 0, .70);
    background: rgba(0, 0, 0, .04);
}

.quantum-group-body {
    padding: 10px 12px 12px;
}

.quantum-skeleton-row {
    height: 12px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(0, 0, 0, .06), rgba(0, 0, 0, .02), rgba(0, 0, 0, .06));
    background-size: 200% 100%;
    animation: quantumShimmer 1.2s ease-in-out infinite;
    margin-bottom: 10px;
}

@keyframes quantumShimmer {
    0% { background-position: 0% 0%; }
    100% { background-position: -200% 0%; }
}

.quantum-empty {
    padding: 16px 12px;
    text-align: center;
    font-size: 13px;
    color: rgba(0, 0, 0, .60);
    border-radius: 12px;
    background: rgba(255, 255, 255, .78);
    border: 1px dashed rgba(0, 0, 0, .14);
}

.quantum-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    position: relative;
}

.quantum-item.q-sink-move {
    transition: transform .76s cubic-bezier(.18, .9, .18, 1), box-shadow .76s cubic-bezier(.18, .9, .18, 1), filter .76s cubic-bezier(.18, .9, .18, 1);
    box-shadow: 0 18px 46px rgba(0, 0, 0, .12);
    filter: drop-shadow(0 16px 22px rgba(18, 90, 255, .16));
    will-change: transform;
}

.quantum-item {
    isolation: isolate;
}

.quantum-item > * {
    position: relative;
    z-index: 1;
}

.quantum-item.q-sink-move::after {
    content: "";
    position: absolute;
    left: -10px;
    right: -10px;
    top: -12px;
    bottom: -18px;
    border-radius: 18px;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(60% 40% at 30% 10%, rgba(18, 90, 255, .16), rgba(18, 90, 255, 0) 70%),
        radial-gradient(70% 50% at 70% 30%, rgba(0, 200, 255, .10), rgba(0, 200, 255, 0) 72%),
        linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, .06) 55%, rgba(0, 0, 0, 0));
    opacity: .92;
    filter: blur(14px);
    transform: translateY(-16px);
}

.q-sink-enter-active,
.q-sink-leave-active {
    transition: opacity .28s ease, transform .28s ease;
}

.q-sink-enter-from,
.q-sink-leave-to {
    opacity: 0;
    transform: translateY(10px);
}

.q-sink-leave-active {
    position: absolute;
    left: 0;
    right: 0;
}

.quantum-item.is-valid.is-settle {
    animation: qSettleGood .62s cubic-bezier(.18, .9, .18, 1) both;
}

.quantum-item.is-invalid.is-sink-pending {
    border-color: rgba(255, 70, 70, .14);
    background: linear-gradient(180deg, rgba(255, 70, 70, .05), rgba(255, 255, 255, .78));
    filter: saturate(.92);
}

html[data-theme="dark"] .quantum-item.is-invalid.is-sink-pending {
    border-color: rgba(255, 120, 120, .18);
    background: linear-gradient(180deg, rgba(255, 90, 90, .08), rgba(13, 13, 36, .68));
}

.quantum-item.is-invalid.is-sink-pending::after {
    content: "";
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 8px;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(255, 70, 70, 0), rgba(255, 70, 70, .20), rgba(255, 170, 170, .12), rgba(255, 70, 70, 0));
    opacity: .85;
    filter: blur(.2px);
    animation: qSinkHint 1.05s ease-in-out infinite;
    pointer-events: none;
}

html[data-theme="dark"] .quantum-item.is-invalid.is-sink-pending::after {
    background: linear-gradient(90deg, rgba(255, 120, 120, 0), rgba(255, 120, 120, .22), rgba(255, 170, 170, .14), rgba(255, 120, 120, 0));
    opacity: .80;
}

.quantum-item.is-invalid.is-sink-ready {
    filter: saturate(.96);
}

@keyframes qSinkHint {
    0% { opacity: .35; transform: translate3d(0, 0, 0); }
    50% { opacity: .95; transform: translate3d(0, 1px, 0); }
    100% { opacity: .35; transform: translate3d(0, 0, 0); }
}

@keyframes qSettleGood {
    0% { box-shadow: 0 0 0 rgba(0, 0, 0, 0); filter: saturate(1.12); }
    55% { box-shadow: 0 18px 46px rgba(0, 200, 120, .14); filter: saturate(1.05); }
    100% { box-shadow: 0 0 0 rgba(0, 0, 0, 0); filter: saturate(1); }
}

.quantum-done {
    margin: 10px 18px 0;
    padding: 12px 14px;
    border-radius: 16px;
    border: 1px solid rgba(0, 0, 0, .08);
    background:
        radial-gradient(260px 120px at 18% 0%, color-mix(in srgb, var(--q-accent-a) 12%, rgba(0, 0, 0, 0)), rgba(0, 0, 0, 0) 70%),
        radial-gradient(280px 120px at 82% 0%, color-mix(in srgb, var(--q-accent-c) 10%, rgba(0, 0, 0, 0)), rgba(0, 0, 0, 0) 72%),
        rgba(255, 255, 255, .82);
    font-size: 12px;
    color: rgba(0, 0, 0, .62);
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    position: relative;
    overflow: visible;
    box-shadow: 0 12px 26px rgba(0, 0, 0, .08);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.quantum-done::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(260px 140px at 18% 0%, color-mix(in srgb, var(--q-accent-a) 16%, rgba(0, 0, 0, 0)), rgba(0, 0, 0, 0) 70%),
        radial-gradient(320px 160px at 82% 0%, color-mix(in srgb, var(--q-accent-c) 14%, rgba(0, 0, 0, 0)), rgba(0, 0, 0, 0) 72%),
        linear-gradient(180deg, rgba(255, 255, 255, .10), rgba(255, 255, 255, 0));
    opacity: .85;
    filter: blur(10px);
    border-radius: inherit;
    clip-path: inset(0 round 16px);
}

.quantum-done::after {
    content: "";
    position: absolute;
    left: 10px;
    right: 10px;
    top: 0;
    height: 1px;
    background: linear-gradient(90deg, rgba(0, 0, 0, 0), color-mix(in srgb, var(--q-accent-a) 26%, rgba(0, 0, 0, 0)), color-mix(in srgb, var(--q-accent-c) 24%, rgba(0, 0, 0, 0)), rgba(0, 0, 0, 0));
    opacity: .9;
    pointer-events: none;
    clip-path: inset(0 round 16px);
}

html[data-theme="dark"] .quantum-done {
    border-color: rgba(180, 190, 255, .14);
    background:
        radial-gradient(320px 160px at 18% 0%, color-mix(in srgb, var(--q-accent-a) 18%, rgba(0, 0, 0, 0)), rgba(0, 0, 0, 0) 70%),
        radial-gradient(340px 160px at 82% 0%, color-mix(in srgb, var(--q-accent-c) 12%, rgba(0, 0, 0, 0)), rgba(0, 0, 0, 0) 72%),
        rgba(13, 13, 36, .74);
    color: rgba(224, 224, 255, .72);
    box-shadow: 0 18px 44px rgba(0, 0, 0, .30);
}

.quantum-done .left {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 800;
    flex: 1 1 auto;
    min-width: 0;
}

.quantum-done .q-status {
    height: 26px;
    padding: 0 10px 0 9px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: none;
    font-weight: 1000;
    letter-spacing: .4px;
    color: rgba(0, 130, 70, .92);
    background:
        radial-gradient(18px 18px at 30% 30%, rgba(255, 255, 255, .86), rgba(255, 255, 255, 0) 70%),
        linear-gradient(180deg, rgba(0, 200, 120, .18), rgba(0, 200, 120, .10));
    border: 1px solid rgba(0, 200, 120, .22);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .48), 0 10px 22px rgba(0, 200, 120, .10);
    transition: transform .22s cubic-bezier(.2, .9, .2, 1), box-shadow .22s ease, background .22s ease, border-color .22s ease, color .22s ease;
    position: relative;
}

.quantum-done .q-status::before {
    content: "";
    width: 14px;
    height: 14px;
    border-radius: 999px;
    background-color: currentColor;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2714%27%20height%3D%2714%27%20viewBox%3D%270%200%2014%2014%27%3E%3Cpath%20d%3D%27M5.6%2010.2L2.9%207.5a.9.9%200%200%201%201.3-1.3l1.9%201.9L9.9%203.3a.9.9%200%201%201%201.3%201.3L6.9%2010.2a.9.9%200%200%201-1.3%200Z%27%20fill%3D%27%23000%27/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2714%27%20height%3D%2714%27%20viewBox%3D%270%200%2014%2014%27%3E%3Cpath%20d%3D%27M5.6%2010.2L2.9%207.5a.9.9%200%200%201%201.3-1.3l1.9%201.9L9.9%203.3a.9.9%200%201%201%201.3%201.3L6.9%2010.2a.9.9%200%200%201-1.3%200Z%27%20fill%3D%27%23000%27/%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: 14px 14px;
    mask-size: 14px 14px;
}

.quantum-done .q-status::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18);
    opacity: .9;
}

.quantum-done .q-status.is-checking {
    color: rgba(0, 130, 200, .92);
    background:
        radial-gradient(18px 18px at 30% 30%, rgba(255, 255, 255, .84), rgba(255, 255, 255, 0) 70%),
        linear-gradient(180deg, rgba(0, 200, 255, .18), rgba(0, 200, 255, .10));
    border-color: rgba(0, 200, 255, .22);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .46), 0 10px 22px rgba(0, 200, 255, .10);
}

.quantum-done .q-status.is-checking::before {
    background-image: none;
    border: 2px solid rgba(0, 200, 255, .28);
    border-top-color: rgba(0, 200, 255, .92);
    border-right-color: rgba(0, 200, 255, .92);
    animation: qSpin .86s linear infinite;
}

html[data-theme="dark"] .quantum-done .q-status {
    color: rgba(190, 255, 224, .88);
    background:
        radial-gradient(18px 18px at 30% 30%, rgba(255, 255, 255, .14), rgba(255, 255, 255, 0) 70%),
        rgba(0, 200, 120, .12);
    border-color: rgba(0, 200, 120, .22);
}

html[data-theme="dark"] .quantum-done .q-status::before {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2714%27%20height%3D%2714%27%20viewBox%3D%270%200%2014%2014%27%3E%3Cpath%20d%3D%27M5.6%2010.2L2.9%207.5a.9.9%200%200%201%201.3-1.3l1.9%201.9L9.9%203.3a.9.9%200%201%201%201.3%201.3L6.9%2010.2a.9.9%200%200%201-1.3%200Z%27%20fill%3D%27%2300ffc3%27/%3E%3C/svg%3E");
}

html[data-theme="dark"] .quantum-done .q-status.is-checking {
    color: rgba(180, 220, 255, .92);
    background:
        radial-gradient(18px 18px at 30% 30%, rgba(255, 255, 255, .14), rgba(255, 255, 255, 0) 70%),
        rgba(0, 200, 255, .12);
    border-color: rgba(0, 200, 255, .22);
}

.quantum-done .dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: rgba(0, 200, 120, .90);
    box-shadow: 0 0 0 4px rgba(0, 200, 120, .10);
    position: relative;
    flex: none;
}

.quantum-done .dot.is-checking {
    width: 16px;
    height: 16px;
    border-radius: 7px;
    background-color: rgba(0, 0, 0, 0);
    box-shadow: 0 0 0 6px rgba(0, 200, 255, .08);
}

.quantum-done .dot.is-checking::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 7px;
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2716%27%20height%3D%2716%27%20viewBox%3D%270%200%2016%2016%27%3E%3Cg%20fill%3D%27none%27%20stroke%3D%27%2300bfe8%27%20stroke-width%3D%271.6%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%271.8%27%20y%3D%276.3%27%20width%3D%276.6%27%20height%3D%275.0%27%20rx%3D%272.2%27%20transform%3D%27rotate(-35%205.1%208.8)%27/%3E%3Crect%20x%3D%277.0%27%20y%3D%274.7%27%20width%3D%276.6%27%20height%3D%275.0%27%20rx%3D%272.2%27%20transform%3D%27rotate(-35%2010.3%207.2)%27/%3E%3C/g%3E%3C/svg%3E");
    background-size: 16px 16px;
    background-repeat: no-repeat;
    background-position: center;
    filter: drop-shadow(0 0 10px rgba(0, 200, 255, .22));
    animation: qLinkHop .92s cubic-bezier(.2, .9, .2, 1) infinite;
}

@keyframes qLinkHop {
    0% { transform: translate3d(0, 0, 0) rotate(0deg); opacity: .88; }
    45% { transform: translate3d(0, -1px, 0) rotate(-4deg); opacity: 1; }
    100% { transform: translate3d(0, 0, 0) rotate(0deg); opacity: .88; }
}

.quantum-done .msg {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.quantum-done .msg .main {
    color: rgba(0, 0, 0, .76);
    font-weight: 900;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.quantum-done .msg .sub {
    color: rgba(0, 0, 0, .54);
    font-weight: 800;
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

html[data-theme="dark"] .quantum-done .msg .main {
    color: rgba(224, 224, 255, .92);
}

html[data-theme="dark"] .quantum-done .msg .sub {
    color: rgba(224, 224, 255, .64);
}

.quantum-done .right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 8px;
    margin-left: auto;
    flex: 0 0 auto;
    min-width: 0;
}

.quantum-done .right::-webkit-scrollbar {
    display: none;
}

.quantum-done .q-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 24px;
    padding: 0 10px;
    white-space: nowrap;
    border-radius: 999px;
    background:
        radial-gradient(16px 16px at 30% 35%, rgba(255, 255, 255, .66), rgba(255, 255, 255, 0) 70%),
        rgba(0, 0, 0, .04);
    border: 1px solid rgba(0, 0, 0, .08);
    color: rgba(0, 0, 0, .66);
    font-weight: 900;
    position: relative;
    transition: transform .18s cubic-bezier(.2, .9, .2, 1), background .18s ease, border-color .18s ease, box-shadow .18s ease;
}

html[data-theme="dark"] .quantum-done .q-pill {
    background:
        radial-gradient(16px 16px at 30% 35%, rgba(255, 255, 255, .12), rgba(255, 255, 255, 0) 70%),
        rgba(180, 190, 255, .10);
    border-color: rgba(180, 190, 255, .14);
    color: rgba(224, 224, 255, .82);
}

.quantum-done .q-pill::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: rgba(0, 0, 0, .28);
    box-shadow: 0 0 0 3px rgba(0, 0, 0, .04);
}

.quantum-done .q-pill::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .44);
    opacity: .85;
}

html[data-theme="dark"] .quantum-done .q-pill::after {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16);
    opacity: .75;
}

.quantum-done .q-pill:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 22px rgba(0, 0, 0, .08);
}

.quantum-done .q-pill.is-total {
    background-color: rgba(18, 90, 255, .08);
    border-color: rgba(18, 90, 255, .14);
    color: rgba(0, 0, 0, .74);
}

.quantum-done .q-pill.is-total::before {
    background: rgba(18, 90, 255, .92);
    box-shadow: 0 0 0 3px rgba(18, 90, 255, .10);
}

.quantum-done .q-pill.is-valid {
    background-color: rgba(0, 200, 120, .10);
    border-color: rgba(0, 200, 120, .18);
    color: rgba(0, 130, 70, .92);
}

.quantum-done .q-pill.is-valid::before {
    background: rgba(0, 200, 120, .92);
    box-shadow: 0 0 0 3px rgba(0, 200, 120, .10);
}

.quantum-done .q-pill.is-invalid {
    background-color: rgba(255, 70, 70, .10);
    border-color: rgba(255, 70, 70, .18);
    color: rgba(210, 40, 40, .92);
}

.quantum-done .q-pill.is-invalid::before {
    background: rgba(255, 70, 70, .92);
    box-shadow: 0 0 0 3px rgba(255, 70, 70, .10);
}

.quantum-done .q-pill.is-time {
    display: none;
    background-color: rgba(0, 200, 255, .10);
    border-color: rgba(0, 200, 255, .18);
    color: rgba(0, 130, 200, .92);
}

.quantum-done .q-pill.is-time::before {
    background: rgba(0, 200, 255, .92);
    box-shadow: 0 0 0 3px rgba(0, 200, 255, .10);
}

.quantum-item {
    position: relative;
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(0, 0, 0, .08);
    background: rgba(255, 255, 255, .78);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
        "title go"
        "meta go";
    gap: 6px 10px;
    align-items: center;
}

.quantum-item::before {
    content: "";
    position: absolute;
    left: 0;
    top: 10px;
    bottom: 10px;
    width: 3px;
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(18, 90, 255, .95), rgba(0, 200, 255, .88));
    opacity: .0;
    transition: opacity .18s ease;
}

.quantum-item.is-valid::before {
    opacity: .72;
    background: linear-gradient(180deg, rgba(0, 200, 120, .92), rgba(0, 255, 195, .72));
}

.quantum-item.is-invalid::before {
    opacity: .72;
    background: linear-gradient(180deg, rgba(255, 70, 70, .92), rgba(255, 170, 170, .72));
}

.quantum-item.is-checking::before {
    opacity: .62;
    background: linear-gradient(180deg, rgba(0, 200, 255, .92), rgba(18, 90, 255, .72));
}

.quantum-item.is-invalid {
    border-color: rgba(255, 70, 70, .16);
    background: linear-gradient(180deg, rgba(255, 70, 70, .06), rgba(255, 255, 255, .78));
}

.quantum-item.is-checking {
    border-color: rgba(0, 200, 255, .14);
    background: linear-gradient(180deg, rgba(0, 200, 255, .05), rgba(255, 255, 255, .78));
}

.quantum-item.is-valid {
    border-color: rgba(0, 200, 120, .14);
    background: linear-gradient(180deg, rgba(0, 200, 120, .05), rgba(255, 255, 255, .78));
}

.quantum-item:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 26px rgba(0, 0, 0, .10);
    border-color: rgba(18, 90, 255, .18);
}

.quantum-item.is-invalid:hover {
    border-color: rgba(255, 70, 70, .26);
}

.quantum-item.is-valid:hover {
    border-color: rgba(0, 200, 120, .22);
}

.quantum-item.is-checking:hover {
    border-color: rgba(0, 200, 255, .22);
}

.quantum-item:hover::before {
    opacity: .9;
}

.quantum-item .title {
    display: block;
    grid-area: title;
    padding-right: 0;
    padding-left: 18px;
    position: relative;
    text-decoration: none;
    color: rgba(0, 0, 0, .82);
    font-weight: 800;
    font-size: 13px;
    line-height: 1.35;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.quantum-item .title::before {
    content: "";
    position: absolute;
    left: 0;
    top: 3px;
    width: 12px;
    height: 12px;
    border-radius: 4px;
    background: linear-gradient(135deg, rgba(18, 90, 255, .98), rgba(0, 200, 255, .90));
    box-shadow: 0 10px 20px rgba(18, 90, 255, .16);
    opacity: .92;
}

.quantum-item.is-valid .title::before {
    background: linear-gradient(135deg, rgba(0, 200, 120, .96), rgba(0, 255, 195, .86));
    box-shadow: 0 10px 20px rgba(0, 200, 120, .14);
}

.quantum-item.is-invalid .title::before {
    background: linear-gradient(135deg, rgba(255, 70, 70, .96), rgba(255, 170, 170, .86));
    box-shadow: 0 10px 20px rgba(255, 70, 70, .14);
}

.quantum-item.is-checking .title::before {
    background: linear-gradient(135deg, rgba(0, 200, 255, .96), rgba(18, 90, 255, .86));
    box-shadow: 0 10px 20px rgba(0, 200, 255, .14);
}

.quantum-item .title.is-disabled {
    opacity: .55;
    color: rgba(0, 0, 0, .62);
}

.quantum-item .meta {
    grid-area: meta;
    margin-top: 0;
    display: flex;
    gap: 8px;
    align-items: center;
    color: rgba(0, 0, 0, .56);
    font-size: 12px;
    flex-wrap: wrap;
    row-gap: 6px;
}

.quantum-item .badge {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 8px;
    border-radius: 999px;
    background: rgba(0, 200, 255, .10);
    border: 1px solid rgba(0, 200, 255, .26);
    color: rgba(0, 0, 0, .68);
    font-weight: 800;
}

.quantum-item .badge::before {
    content: "+";
    opacity: .55;
    margin-right: 3px;
}

.pc-only {
    display: inline-flex !important;
}

.m-only {
    display: none !important;
}

.quantum-item .share-pill {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 8px;
    border-radius: 999px;
    border: 1px solid rgba(0, 0, 0, .10);
    color: rgba(0, 0, 0, .62);
    font-weight: 700;
    white-space: nowrap;
}

.quantum-item .share-pill.is-time {
    background: rgba(0, 0, 0, .04);
}

.quantum-item .share-pill.is-user {
    background: rgba(0, 0, 0, .04);
}

.quantum-item .share-info {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 8px;
    border-radius: 999px;
    background: rgba(18, 90, 255, .06);
    border: 1px solid rgba(18, 90, 255, .12);
    color: rgba(0, 0, 0, .62);
    font-weight: 700;
    gap: 4px;
}

.quantum-item .share-info > span {
    white-space: nowrap;
}

@media (max-width: 768px) {
    .pc-only {
        display: none !important;
    }

    .m-only {
        display: inline-flex !important;
    }
}

.quantum-item .meta .time {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 20px;
    padding: 0 8px;
    border-radius: 999px;
    background: rgba(0, 0, 0, .04);
    border: 1px solid rgba(0, 0, 0, .10);
    color: rgba(0, 0, 0, .62);
    font-weight: 800;
}

.quantum-item .meta .time::before {
    content: "";
    width: 12px;
    height: 12px;
    border-radius: 999px;
    border: 2px solid rgba(0, 0, 0, .26);
    border-top-color: rgba(0, 0, 0, .62);
    box-sizing: border-box;
    opacity: .85;
}

.quantum-item .source-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 20px;
    padding: 0 8px;
    border-radius: 999px;
    background: rgba(18, 90, 255, .08);
    border: 1px solid rgba(18, 90, 255, .16);
    color: rgba(0, 0, 0, .70);
    font-weight: 800;
}

.quantum-item .source-tag .icon {
    width: 14px;
    height: 14px;
}

.quantum-item .valid-tag {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 8px;
    border-radius: 999px;
    background: rgba(0, 0, 0, .04);
    border: 1px solid rgba(0, 0, 0, .10);
    color: rgba(0, 0, 0, .70);
    font-weight: 800;
    gap: 6px;
}

.quantum-item .valid-tag.is-valid {
    background: rgba(0, 200, 120, .10);
    border-color: rgba(0, 200, 120, .22);
    color: rgba(0, 130, 70, .92);
}

.quantum-item .valid-tag.is-valid::before {
    content: "✓";
    width: 14px;
    height: 14px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 1000;
    color: rgba(0, 130, 70, .98);
    background: rgba(0, 200, 120, .14);
    border: 1px solid rgba(0, 200, 120, .18);
}

.quantum-item .valid-tag.is-invalid {
    background: rgba(255, 70, 70, .10);
    border-color: rgba(255, 70, 70, .22);
    color: rgba(210, 40, 40, .92);
}

.quantum-item .valid-tag.is-invalid::before {
    content: "×";
    width: 14px;
    height: 14px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 1000;
    color: rgba(210, 40, 40, .98);
    background: rgba(255, 70, 70, .12);
    border: 1px solid rgba(255, 70, 70, .18);
}

.quantum-item .valid-tag.is-checking {
    background: rgba(0, 200, 255, .10);
    border-color: rgba(0, 200, 255, .22);
    color: rgba(0, 130, 200, .92);
    padding-right: 6px;
    gap: 6px;
}

.quantum-item .valid-tag.is-checking::before {
    content: "";
    width: 16px;
    height: 16px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2716%27%20height%3D%2716%27%20viewBox%3D%270%200%2016%2016%27%3E%3Cg%20fill%3D%27none%27%20stroke%3D%27%2300bfe8%27%20stroke-width%3D%271.6%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%271.8%27%20y%3D%276.3%27%20width%3D%276.6%27%20height%3D%275.0%27%20rx%3D%272.2%27%20transform%3D%27rotate(-35%205.1%208.8)%27/%3E%3Crect%20x%3D%277.0%27%20y%3D%274.7%27%20width%3D%276.6%27%20height%3D%275.0%27%20rx%3D%272.2%27%20transform%3D%27rotate(-35%2010.3%207.2)%27/%3E%3C/g%3E%3C/svg%3E");
    background-size: 16px 16px;
    background-repeat: no-repeat;
    background-position: center;
    filter: drop-shadow(0 0 10px rgba(0, 200, 255, .22));
    animation: qLinkHop .92s cubic-bezier(.2, .9, .2, 1) infinite;
}

.quantum-item .valid-tag.is-checking::after {
    content: "";
    width: 14px;
    height: 14px;
    border-radius: 999px;
    background:
        radial-gradient(circle at 30% 30%, rgba(255, 255, 255, .92), rgba(255, 255, 255, 0) 58%),
        linear-gradient(135deg, rgba(0, 200, 255, .88), rgba(18, 90, 255, .76));
    box-shadow: 0 0 0 4px rgba(0, 200, 255, .12), 0 10px 18px rgba(0, 0, 0, .10);
    animation: qLinkSpark .92s cubic-bezier(.2, .9, .2, 1) infinite;
}

@keyframes qLinkSpark {
    0% { transform: translate3d(0, 0, 0) scale(.92); opacity: .72; }
    45% { transform: translate3d(0, -1px, 0) scale(1); opacity: 1; }
    100% { transform: translate3d(0, 0, 0) scale(.92); opacity: .72; }
}

@keyframes qSpin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.quantum-item .go {
    grid-area: go;
    position: static;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    border-radius: 10px;
    text-decoration: none;
    color: var(--theme-theme, #133ab3);
    background: rgba(255, 255, 255, .82);
    border: 1px solid rgba(18, 90, 255, .22);
    font-weight: 800;
    font-size: 12px;
    white-space: nowrap;
    transition: transform .16s ease, box-shadow .16s ease, background-color .16s ease, color .16s ease, border-color .16s ease;
    box-shadow: 0 10px 18px rgba(0, 0, 0, .10);
}

.quantum-item .go::before {
    content: none;
}

.quantum-item .go::after {
    content: "→";
    margin-left: 6px;
    font-weight: 900;
    opacity: .9;
}

.quantum-item .go:hover {
    transform: translateY(-1px);
    background: var(--theme-theme, #133ab3);
    color: rgba(255, 255, 255, .96);
    border-color: rgba(18, 90, 255, .35);
    box-shadow: 0 16px 28px rgba(0, 0, 0, .16);
}

.quantum-item .go:active {
    transform: translateY(0px);
}

.quantum-item .go.is-disabled {
    background: rgba(0, 0, 0, .10);
    color: rgba(0, 0, 0, .50);
    cursor: not-allowed;
    box-shadow: none;
    filter: none;
}

.quantum-item .go.is-disabled::before {
    background: rgba(0, 0, 0, .08);
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .10);
    opacity: .85;
}

.quantum-empty-major {
    position: relative;
    z-index: 1;
    margin: 0 18px 14px;
    padding: 18px 14px 16px;
    border-radius: 16px;
    border: 1px dashed rgba(0, 0, 0, .14);
    background: rgba(255, 255, 255, .72);
    backdrop-filter: blur(10px);
    text-align: center;
}

.quantum-empty-major .illus {
    width: 54px;
    height: 54px;
    border-radius: 18px;
    margin: 0 auto 10px;
    background: radial-gradient(60% 60% at 35% 30%, rgba(255, 255, 255, .90), rgba(255, 255, 255, 0) 72%),
        linear-gradient(135deg, rgba(18, 90, 255, .18), rgba(0, 200, 255, .14), rgba(0, 255, 195, .10));
    border: 1px solid rgba(0, 0, 0, .06);
    box-shadow: 0 18px 36px rgba(18, 90, 255, .12);
    position: relative;
    overflow: hidden;
}

.quantum-empty-major .illus::after {
    content: "";
    position: absolute;
    inset: -40%;
    background: conic-gradient(from 180deg at 50% 50%, rgba(0, 255, 195, 0), rgba(0, 200, 255, .22), rgba(18, 90, 255, .26), rgba(0, 255, 195, .18), rgba(0, 255, 195, 0));
    filter: blur(16px);
    opacity: .55;
    animation: quantumFlow 10s linear infinite;
}

.quantum-empty-major.is-noresult .illus {
    background: radial-gradient(60% 60% at 35% 30%, rgba(255, 255, 255, .90), rgba(255, 255, 255, 0) 72%),
        linear-gradient(135deg, rgba(255, 210, 80, .16), rgba(0, 200, 255, .12), rgba(18, 90, 255, .12));
}

.quantum-empty-major .title {
    font-weight: 1000;
    color: rgba(0, 0, 0, .82);
    font-size: 16px;
}

.quantum-empty-major .sub {
    margin-top: 6px;
    color: rgba(0, 0, 0, .56);
    font-size: 13px;
}

.quantum-empty-major .actions {
    margin-top: 12px;
    display: flex;
    gap: 10px;
    justify-content: center;
    flex-wrap: wrap;
}

.quantum-empty-major .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 34px;
    padding: 0 14px;
    border-radius: 12px;
    background: rgba(255, 255, 255, .78);
    border: 1px solid rgba(0, 0, 0, .10);
    color: rgba(0, 0, 0, .72);
    text-decoration: none;
    font-weight: 800;
}

.quantum-empty-major .btn.primary {
    color: var(--theme-other_background);
    background: linear-gradient(90deg, rgba(18, 90, 255, .98), rgba(0, 200, 255, .92));
    border-color: rgba(0, 0, 0, 0);
}

.quantum-merge {
    position: relative;
    z-index: 1;
    padding: 0 18px 18px;
}

.quantum-merge-head {
    margin: 0 0 12px;
    padding: 10px 12px;
    border-radius: 14px;
    background: rgba(255, 255, 255, .70);
    border: 1px solid rgba(0, 0, 0, .06);
    backdrop-filter: blur(10px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.quantum-merge-head .t {
    font-weight: 900;
    color: rgba(0, 0, 0, .82);
}

.quantum-merge-head .s {
    font-size: 12px;
    color: rgba(0, 0, 0, .56);
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.quantum-merge-head .s a {
    text-decoration: none;
    color: rgba(0, 0, 0, .56);
    font-weight: 800;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid rgba(0, 0, 0, .08);
    background: rgba(255, 255, 255, .72);
}

.quantum-merge-head .s a.active {
    color: rgba(0, 0, 0, .82);
    border-color: rgba(18, 90, 255, .18);
    background: rgba(18, 90, 255, .08);
}

@media screen and (max-width: 1200px) {
    .quantum-metrics {
        gap: 6px;
    }
    .quantum-groups {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media screen and (max-width: 900px) {
    .quantum-hero {
        grid-template-columns: 1fr;
        grid-template-areas:
            "title"
            "metrics"
            "ops"
            "chips";
    }
    .quantum-metrics {
        justify-content: flex-start;
    }
    .quantum-ops {
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .quantum-groups {
        grid-template-columns: 1fr;
    }
}

@media screen and (max-width: 768px) {
    .quantum-panel:before,
    .quantum-panel:after,
    .quantum-stream-line,
    .quantum-skeleton-row {
        animation: none !important;
    }

    .quantum-panel,
    .quantum-metric,
    .quantum-stream,
    .quantum-group {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .quantum-merge {
        padding: 0 16px 16px;
    }

    .quantum-merge-head {
        border-radius: 16px;
        padding: 10px 12px;
        background: rgba(255, 255, 255, .62);
        border-color: rgba(0, 0, 0, .08);
        box-shadow: 0 14px 30px rgba(0, 0, 0, .10);
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .quantum-merge-head .t {
        letter-spacing: .4px;
    }

    .quantum-merge-head .s {
        padding: 4px;
        border-radius: 999px;
        background: rgba(0, 0, 0, .04);
        border: 1px solid rgba(0, 0, 0, .08);
        gap: 4px;
    }

    .quantum-merge-head .s a {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 54px;
        height: 28px;
        padding: 0 12px;
        border: 0;
        background: transparent;
        color: rgba(0, 0, 0, .62);
    }

    .quantum-merge-head .s a.active {
        color: var(--theme-other_background);
        background: linear-gradient(90deg, rgba(18, 90, 255, .98), rgba(0, 200, 255, .92));
        box-shadow: 0 10px 22px rgba(18, 90, 255, .18);
    }

    html[data-theme="dark"] .quantum-merge-head {
        background: linear-gradient(180deg, rgba(16, 18, 52, .84), rgba(8, 10, 28, .78));
        border-color: rgba(180, 190, 255, .16);
        box-shadow: 0 18px 44px rgba(0, 0, 0, .34), 0 18px 44px rgba(0, 200, 255, .08);
    }

    html[data-theme="dark"] .quantum-merge-head .t {
        color: rgba(234, 238, 255, .92);
    }

    html[data-theme="dark"] .quantum-merge-head .s {
        background: rgba(255, 255, 255, .06);
        border-color: rgba(0, 200, 255, .14);
    }

    html[data-theme="dark"] .quantum-merge-head .s a {
        color: rgba(224, 236, 255, .78);
    }

    html[data-theme="dark"] .quantum-merge-head .s a.active {
        color: rgba(255, 255, 255, .94);
        box-shadow: 0 12px 30px rgba(0, 200, 255, .14);
    }

    .quantum-hero {
        padding: 12px 12px 10px;
        row-gap: 10px;
    }

    .quantum-metrics {
        width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        justify-content: flex-start;
        scrollbar-width: none;
    }

    .quantum-metrics::-webkit-scrollbar {
        display: none;
    }

    .quantum-mode a,
    .quantum-action {
        height: 34px;
        font-size: 13px;
        padding: 0 14px;
    }

    .quantum-actions {
        width: 100%;
        justify-content: flex-start;
        padding: 4px;
        gap: 6px;
    }

    .quantum-chips {
        scroll-snap-type: x proximity;
        scroll-padding-left: 12px;
        scroll-padding-right: 12px;
    }

    .quantum-chip {
        scroll-snap-align: start;
    }

    .quantum-done {
        margin: 10px 16px 0;
        flex-wrap: wrap;
    }

    .quantum-done .right {
        width: 100%;
        justify-content: flex-start;
        flex-wrap: wrap;
        margin-left: 0;
    }

    .quantum-done .q-pill.is-time {
        display: inline-flex;
    }

    .quantum-done .msg .main {
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
        line-height: 1.4;
    }
}

@media screen and (max-width: 520px) {
    .quantum-item {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas:
            "title"
            "meta"
            "go";
    }
    .quantum-item .go {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .quantum-panel:before,
    .quantum-panel:after,
    .quantum-stream-line,
    .quantum-skeleton-row,
    .q-float-theme::before,
    .q-float-theme::after,
    .q-logo::after {
        animation: none !important;
    }

    .dialogUrlBox .el-loading-spinner::before {
        animation: none !important;
    }
}

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

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

.Qbtn {
    text-align: center;
    padding-top: 10px;
}

.Qbtn .btn {
    display: inline-block;
    color: #999999;
    cursor: pointer;
}



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

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

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

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

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

.samelist .item p span {
    color: #c4c7ce;
    margin-right: 6px;
}

.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;
    white-space: nowrap;
    overflow-x: auto;
}

.source-switch h3 {
    margin-right: 6px;
}

.source-guide {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    position: relative;
}

.source-guide-btn {
    appearance: none;
    border: 1px solid rgba(0, 0, 0, .10);
    background: color-mix(in srgb, var(--theme-other_background) 88%, rgba(0, 0, 0, .02));
    color: color-mix(in srgb, var(--theme-color) 72%, rgba(0, 0, 0, .18));
    height: 30px;
    padding: 0 12px;
    border-radius: 999px;
    font: inherit;
    font-size: 12px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: transform 160ms ease, background-color 160ms ease, border-color 160ms ease, color 160ms ease;
}

.source-guide-btn::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 999px;
    background: radial-gradient(circle at 30% 30%, #fff 0 35%, rgba(255, 255, 255, 0) 36%),
        radial-gradient(circle at 50% 50%, color-mix(in srgb, var(--theme-theme) 80%, #22d3ee 20%) 0 100%, rgba(0, 0, 0, 0) 101%);
    box-shadow: 0 0 0 3px rgba(18, 90, 255, .14);
}

.source-guide-btn:hover {
    transform: translateY(-1px);
    border-color: rgba(18, 90, 255, .18);
    color: color-mix(in srgb, var(--theme-theme) 70%, var(--theme-color));
}

.source-guide-btn:active {
    transform: translateY(0);
}

.source-guide-btn:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--theme-theme) 62%, rgba(255, 255, 255, .38));
    outline-offset: 2px;
}

.source-guide-panel {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    width: 320px;
    padding: 12px;
    border-radius: 14px;
    border: 1px solid rgba(0, 0, 0, .10);
    background: color-mix(in srgb, var(--theme-other_background) 94%, rgba(0, 0, 0, .02));
    box-shadow: 0 18px 44px rgba(0, 0, 0, .12);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    z-index: 200;
}

.source-guide-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.source-guide-head .t {
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: color-mix(in srgb, var(--theme-theme) 56%, var(--theme-color));
}

.source-guide-head .x {
    appearance: none;
    border: 0;
    background: transparent;
    font: inherit;
    font-size: 14px;
    cursor: pointer;
    color: color-mix(in srgb, var(--theme-color) 62%, rgba(0, 0, 0, .24));
}

.source-guide-body {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.source-guide-card {
    padding: 8px 10px;
    border-radius: 10px;
    background: rgba(0, 0, 0, .02);
}

.source-guide-card .k {
    font-size: 13px;
    font-weight: 600;
    color: color-mix(in srgb, var(--theme-theme) 70%, var(--theme-color));
}

.source-guide-card .d {
    margin-top: 2px;
    font-size: 12px;
    color: color-mix(in srgb, var(--theme-color) 78%, rgba(0, 0, 0, .20));
}

.source-guide-card .s {
    margin-top: 2px;
    font-size: 12px;
    color: color-mix(in srgb, var(--theme-color) 62%, rgba(0, 0, 0, .30));
}

.source-guide-tip {
    margin-top: 6px;
    font-size: 12px;
    color: color-mix(in srgb, var(--theme-theme) 70%, var(--theme-color));
}

.switch-items {
    display: flex;
    gap: 18px;
    padding-top: 16px;
}

.switch-items .switch-item {
    position: relative;
    appearance: none;
    border: 0;
    background: transparent;
    font: inherit;
    cursor: pointer;
    padding: 5px 0;
    text-decoration: none;
    transition: all 0.3s;
}

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

.switch-items .switch-item.active {
    color: var(--theme-theme);
    font-weight: bold;
}

.switch-items .switch-item:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--theme-theme) 62%, rgba(255, 255, 255, .38));
    outline-offset: 2px;
}

@media (min-width: 769px) {
    .source-switch {
        position: relative;
        z-index: 60;
        align-items: center;
        justify-content: flex-start;
        gap: 10px;
        padding: 6px 8px;
        flex-wrap: nowrap;
        white-space: nowrap;
        overflow: visible;
        border-radius: 999px;
        margin: 14px 20px 6px;
        background:
            linear-gradient(180deg,
                color-mix(in srgb, var(--theme-other_background) 86%, rgba(255, 255, 255, .55)),
                color-mix(in srgb, var(--theme-other_background) 92%, rgba(0, 0, 0, .02)));
        border: 1px solid rgba(0, 0, 0, .08);
        box-shadow: 0 10px 24px rgba(0, 0, 0, .06), inset 0 1px 0 rgba(255, 255, 255, .58);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
    }

    .source-switch::-webkit-scrollbar {
        display: none;
    }

    .source-switch.is-quantum {
        border-color: rgba(18, 90, 255, .16);
        box-shadow: 0 16px 44px rgba(18, 90, 255, .08), 0 14px 30px rgba(0, 0, 0, .06);
    }

    .source-switch.is-quantum::after {
        content: "";
        position: absolute;
        left: 22px;
        right: 22px;
        bottom: -10px;
        height: 12px;
        background: linear-gradient(90deg, rgba(18, 90, 255, .14), rgba(0, 0, 0, 0), rgba(88, 92, 255, .12));
        border-radius: 999px;
        filter: blur(12px);
        opacity: .30;
        pointer-events: none;
    }

    .source-switch h3 {
        padding: 0;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: .6px;
        color: color-mix(in srgb, var(--theme-theme) 56%, var(--theme-color));
        display: inline-flex;
        align-items: center;
        gap: 10px;
        height: 30px;
        padding-left: 12px;
    }

    .source-switch h3::before {
        content: "";
        width: 6px;
        height: 6px;
        border-radius: 999px;
        background: color-mix(in srgb, var(--theme-theme) 64%, rgba(0, 0, 0, .22));
        box-shadow: 0 0 0 3px rgba(0, 0, 0, .04);
    }

    .source-switch h3::after {
        content: "";
        width: 1px;
        height: 18px;
        margin-left: 10px;
        background: rgba(0, 0, 0, .10);
        border-radius: 999px;
        opacity: .9;
    }

    .switch-items {
        --switch-active: 0;
        position: relative;
        display: inline-grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: stretch;
        gap: 0;
        padding: 2px;
        border-radius: 999px;
        background: rgba(0, 0, 0, .03);
        border: 1px solid rgba(0, 0, 0, .08);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .62);
        contain: layout paint;
        -webkit-tap-highlight-color: transparent;
    }

    .switch-items::after {
        content: "";
        position: absolute;
        inset: 0;
        border-radius: inherit;
        pointer-events: none;
        opacity: .0;
    }

    .switch-items::before {
        content: "";
        position: absolute;
        top: 2px;
        bottom: 2px;
        left: 2px;
        width: calc((100% - 4px) / 2);
        border-radius: 999px;
        background: color-mix(in srgb, var(--theme-other_background) 62%, rgba(255, 255, 255, .92));
        border: 1px solid rgba(0, 0, 0, .08);
        box-shadow: 0 10px 22px rgba(0, 0, 0, .12), inset 0 1px 0 rgba(255, 255, 255, .56);
        transform: translate3d(calc(var(--switch-active) * 100%), 0, 0);
        transition: transform 260ms cubic-bezier(.2, .9, .2, 1), box-shadow 260ms ease;
        will-change: transform;
    }

    .switch-items .switch-item {
        z-index: 1;
        padding: 7px 12px;
        border-radius: 999px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        letter-spacing: .1px;
        font-weight: 700;
        color: color-mix(in srgb, var(--theme-color) 72%, rgba(0, 0, 0, .22));
        transition: color 180ms ease, transform 180ms ease;
        user-select: none;
    }

    .switch-items .switch-item::before {
        content: "";
        width: 7px;
        height: 7px;
        border-radius: 999px;
        background: rgba(0, 0, 0, .22);
        box-shadow: 0 0 0 1px rgba(0, 0, 0, .12) inset;
        transition: background-color 180ms ease, box-shadow 180ms ease;
    }

    .switch-items .switch-item.active::before {
        background: color-mix(in srgb, var(--theme-theme) 86%, #22d3ee 14%);
        box-shadow: 0 0 0 1px rgba(0, 0, 0, .08) inset, 0 0 0 6px color-mix(in srgb, var(--theme-theme) 12%, transparent);
    }

    .switch-items .switch-item:hover {
        color: color-mix(in srgb, var(--theme-color) 88%, rgba(18, 90, 255, .18));
    }

    .switch-items .switch-item.active {
        color: var(--theme-theme);
    }

    .switch-items .switch-item:active {
        transform: scale(.985);
    }

    @media (prefers-reduced-motion: reduce) {
        .switch-items::before {
            transition: none;
        }
        .switch-items .switch-item {
            transition: none;
        }
    }

    html[data-theme="dark"] .switch-items {
        background:
            radial-gradient(520px 260px at 30% 0%, rgba(18, 90, 255, .16), rgba(0, 0, 0, 0) 64%),
            radial-gradient(520px 260px at 80% 100%, rgba(0, 200, 255, .12), rgba(0, 0, 0, 0) 66%),
            rgba(255, 255, 255, .06);
        border-color: rgba(180, 190, 255, .18);
        box-shadow: 0 22px 48px rgba(0, 0, 0, .34), inset 0 1px 0 rgba(255, 255, 255, .06);
    }

    html[data-theme="dark"] .switch-items::before {
        background:
            linear-gradient(135deg,
                rgba(13, 13, 36, .80),
                rgba(13, 13, 36, .68));
        border-color: rgba(180, 190, 255, .14);
        box-shadow: 0 22px 46px rgba(0, 0, 0, .42), 0 0 0 1px rgba(180, 190, 255, .10) inset;
    }

    html[data-theme="dark"] .switch-items .switch-item {
        color: rgba(224, 224, 255, .76);
    }

    html[data-theme="dark"] .switch-items .switch-item:hover {
        color: rgba(224, 224, 255, .92);
    }

    html[data-theme="dark"] .source-switch {
        background:
            radial-gradient(900px 240px at 12% 0%, rgba(18, 90, 255, .18), rgba(0, 0, 0, 0) 62%),
            radial-gradient(760px 220px at 78% 100%, rgba(0, 200, 255, .14), rgba(0, 0, 0, 0) 66%),
            rgba(13, 13, 36, .42);
        border-color: rgba(180, 190, 255, .12);
        box-shadow: 0 22px 48px rgba(0, 0, 0, .30);
    }

}
}

.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: 6px;
    height: 30px;
    line-height: 30px;
    color: var(--theme-other_background);
    background-color: var(--theme-theme);
    font-size: 14px;
    width: 100px;
    cursor: pointer;
    position: absolute;
    bottom: 15px;
    right: 0;
}

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

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

.dialogUrlBox .el-loading-mask {
    border-radius: 16px;
    background:
        radial-gradient(520px 240px at 50% 0%, rgba(18, 90, 255, .18), rgba(0, 0, 0, 0) 70%),
        rgba(10, 12, 24, .68);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.dialogUrlBox .el-loading-spinner .circular {
    display: none;
}

.dialogUrlBox .el-loading-spinner {
    position: relative;
    transform: translateY(-6px);
}

.dialogUrlBox .el-loading-spinner::before {
    content: "";
    display: block;
    width: 54px;
    height: 54px;
    margin: 0 auto;
    border-radius: 999px;
    background: conic-gradient(from 180deg, rgba(0, 200, 255, 0), rgba(0, 200, 255, .92), rgba(18, 90, 255, .92), rgba(0, 255, 195, .80), rgba(0, 200, 255, 0));
    -webkit-mask: radial-gradient(farthest-side, rgba(0, 0, 0, 0) calc(100% - 5px), rgba(0, 0, 0, 1) 0);
    mask: radial-gradient(farthest-side, rgba(0, 0, 0, 0) calc(100% - 5px), rgba(0, 0, 0, 1) 0);
    box-shadow: 0 16px 34px rgba(0, 0, 0, .38), 0 0 26px rgba(0, 200, 255, .18);
    animation: qSpin 1.05s linear infinite;
}

.dialogUrlBox .el-loading-spinner::after {
    content: var(--q-load-stage, "转存中") "\A" var(--q-load-steps, "解析链接 → 请求网盘 → 生成跳转");
    display: block;
    margin-top: 12px;
    text-align: center;
    font-weight: 900;
    font-size: 12px;
    letter-spacing: 1.6px;
    white-space: pre;
    line-height: 1.45;
    color: rgba(234, 238, 255, .90);
    text-shadow: 0 0 18px rgba(0, 200, 255, .22);
}

.dialogUrlBox .el-loading-text {
    display: none;
}

.dialogUrlBox .dialogUrl .title {
    font-size: 20px;
    font-weight: bold;
    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 #e5e6e8;
    border-radius: 4px;
}

.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 .dialogUrl .nav .item a {
    word-break: break-all;
}

html[data-theme="dark"] .dialogUrlBox .dialogUrl .title {
    color: rgba(224, 224, 255, .92);
}

html[data-theme="dark"] .dialogUrlBox .dialogUrl .tips {
    color: rgba(224, 224, 255, .72);
}

html[data-theme="dark"] .dialogUrlBox .dialogUrl .nav .item {
    color: rgba(224, 224, 255, .82);
}

html[data-theme="dark"] .dialogUrlBox .dialogUrl .nav .item a {
    color: rgba(0, 200, 255, .92);
}

html[data-theme="dark"] .dialogUrlBox .dialogUrl .qrcode {
    border-color: rgba(180, 190, 255, .20);
    background: rgba(255, 255, 255, .04);
}

html[data-theme="dark"] .dialogUrlBox .dialogUrl .statement {
    border-top-color: rgba(180, 190, 255, .18);
}

html[data-theme="dark"] .dialogUrlBox .dialogUrl .statement .content {
    color: rgba(224, 224, 255, .70);
}

.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";
}

html[data-theme="dark"] {
    --theme-color: rgba(224, 224, 255, .92);
    --theme-background: #070714;
    --theme-other_background: #0d0d24;
    --theme-theme: #3b8bff;
}

html[data-theme="dark"] body {
    background-color: var(--theme-background);
}

.headBg {
    opacity: .55;
}

.headBg::before,
.headBg::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.headBg::before {
    background:
        radial-gradient(900px 460px at 22% 10%, rgba(18, 90, 255, .30), rgba(0, 0, 0, 0) 62%),
        radial-gradient(760px 520px at 82% 18%, rgba(88, 92, 255, .22), rgba(0, 0, 0, 0) 66%),
        radial-gradient(900px 600px at 50% 112%, rgba(0, 200, 255, .14), rgba(0, 0, 0, 0) 62%);
    mix-blend-mode: soft-light;
    filter: blur(0.4px);
    animation: qNebula 18s ease-in-out infinite alternate;
}

.headBg::after {
    opacity: .45;
    background-image:
        repeating-linear-gradient(90deg, rgba(0, 200, 255, .08) 0 1px, rgba(0, 0, 0, 0) 1px 28px),
        repeating-linear-gradient(0deg, rgba(18, 90, 255, .06) 0 1px, rgba(0, 0, 0, 0) 1px 28px),
        radial-gradient(1200px 520px at 50% 0%, rgba(255, 255, 255, .16), rgba(0, 0, 0, 0) 70%);
    mix-blend-mode: overlay;
    -webkit-mask-image: radial-gradient(70% 70% at 50% 25%, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0) 72%);
    mask-image: radial-gradient(70% 70% at 50% 25%, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0) 72%);
    animation: qGridFloat 22s linear infinite;
}

@keyframes qNebula {
    0% { transform: translate3d(-18px, -12px, 0) scale(1); }
    100% { transform: translate3d(22px, 16px, 0) scale(1.04); }
}

@keyframes qGridFloat {
    0% { background-position: 0 0, 0 0, 0 0; }
    100% { background-position: 360px 0, 0 280px, 0 0; }
}

.headerBox .bg {
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(0, 0, 0, .06);
}

html[data-theme="dark"] .headerBox .bg {
    box-shadow: 0 14px 30px rgba(0, 0, 0, .22);
    border-bottom: 1px solid rgba(180, 190, 255, .12);
    background:
        radial-gradient(900px 240px at 18% 0%, rgba(18, 90, 255, .22), rgba(0, 0, 0, 0) 62%),
        radial-gradient(760px 220px at 82% 0%, rgba(88, 92, 255, .18), rgba(0, 0, 0, 0) 62%),
        rgba(13, 13, 36, .86);
}

.q-theme-toggle {
    --qt-w: 84px;
    --qt-h: 34px;
    --qt-pad: 3px;
    --qt-knob: 28px;
    --qt-x: 0px;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    width: var(--qt-w);
    height: var(--qt-h);
    padding: var(--qt-pad);
    border-radius: 999px;
    border: 1px solid rgba(0, 0, 0, .12);
    background: linear-gradient(180deg, rgba(190, 224, 248, .78), rgba(248, 252, 255, .90));
    box-shadow: 0 12px 26px rgba(0, 0, 0, .14), inset 0 1px 0 rgba(255, 255, 255, .86), 0 0 0 1px rgba(255, 255, 255, .22) inset;
    position: relative;
    overflow: hidden;
    user-select: none;
    cursor: pointer;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    transition: transform 360ms cubic-bezier(.2, .9, .2, 1), box-shadow 360ms ease, border-color 360ms ease, background 360ms ease;
}

html[data-theme="light"] .q-theme-toggle {
    border-color: rgba(0, 0, 0, .10) !important;
    background: linear-gradient(180deg, rgba(176, 214, 242, .66), rgba(246, 251, 255, .92)) !important;
    box-shadow: 0 12px 26px rgba(0, 0, 0, .14), inset 0 1px 0 rgba(255, 255, 255, .86), 0 0 0 1px rgba(255, 255, 255, .22) inset !important;
}

html[data-theme="light"] .q-theme-toggle::before {
    opacity: .92 !important;
    background:
        radial-gradient(46px 26px at 30% 28%, rgba(255, 255, 255, .84), rgba(255, 255, 255, 0) 72%),
        radial-gradient(66px 40px at 78% 82%, rgba(33, 122, 255, .08), rgba(0, 0, 0, 0) 74%),
        linear-gradient(180deg, rgba(255, 255, 255, .16), rgba(0, 0, 0, 0)) !important;
}

html[data-theme="light"] .q-theme-toggle::after {
    opacity: .78 !important;
    filter: drop-shadow(0 1px 0 rgba(0, 0, 0, .06)) !important;
}

.q-theme-toggle::before {
    content: "";
    position: absolute;
    inset: 1px;
    border-radius: 999px;
    background:
        radial-gradient(42px 22px at 28% 24%, rgba(255, 255, 255, .86), rgba(255, 255, 255, 0) 70%),
        radial-gradient(58px 34px at 72% 78%, rgba(18, 90, 255, .10), rgba(0, 0, 0, 0) 72%),
        linear-gradient(180deg, rgba(255, 255, 255, .18), rgba(0, 0, 0, 0));
    pointer-events: none;
    opacity: .92;
    transition: opacity 360ms ease;
}

.q-theme-toggle::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 999px;
    background:
        radial-gradient(28px 18px at 22% 78%, rgba(255, 255, 255, .92), rgba(255, 255, 255, 0) 72%),
        radial-gradient(34px 20px at 44% 80%, rgba(255, 255, 255, .86), rgba(255, 255, 255, 0) 74%),
        radial-gradient(40px 22px at 70% 78%, rgba(255, 255, 255, .82), rgba(255, 255, 255, 0) 74%);
    pointer-events: none;
    opacity: .80;
    filter: drop-shadow(0 1px 0 rgba(0, 0, 0, .06));
    transition: opacity 360ms ease, transform 360ms cubic-bezier(.2, .9, .2, 1);
}

.q-theme-toggle:hover {
    transform: translateY(-1px);
    box-shadow: 0 16px 34px rgba(0, 0, 0, .16), inset 0 1px 0 rgba(255, 255, 255, .88);
}

.q-theme-toggle:active {
    transform: translateY(0) scale(.985);
}

.q-theme-toggle:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(18, 90, 255, .18), 0 16px 34px rgba(0, 0, 0, .16), inset 0 1px 0 rgba(255, 255, 255, .88);
}

.q-theme-toggle.is-dark {
    --qt-x: calc(var(--qt-w) - var(--qt-knob) - (var(--qt-pad) * 2));
    border-color: rgba(224, 236, 255, .26);
    background: linear-gradient(180deg, rgba(56, 70, 155, .96), rgba(8, 10, 28, .92));
    box-shadow: 0 18px 44px rgba(0, 0, 0, .36), inset 0 1px 0 rgba(255, 255, 255, .14), 0 0 0 1px rgba(0, 200, 255, .16) inset, 0 0 22px rgba(0, 200, 255, .10);
}

.q-theme-toggle.is-dark::before {
    opacity: 1;
    background:
        radial-gradient(44px 24px at 26% 22%, rgba(255, 255, 255, .22), rgba(255, 255, 255, 0) 70%),
        radial-gradient(70px 42px at 78% 82%, rgba(0, 200, 255, .18), rgba(0, 0, 0, 0) 74%),
        linear-gradient(180deg, rgba(255, 255, 255, .10), rgba(0, 0, 0, 0));
}

.q-theme-toggle.is-dark::after {
    background:
        radial-gradient(3px 3px at 18% 30%, rgba(255, 255, 255, .74), rgba(0, 0, 0, 0) 70%),
        radial-gradient(2px 2px at 24% 44%, rgba(255, 255, 255, .44), rgba(0, 0, 0, 0) 72%),
        radial-gradient(3px 3px at 32% 54%, rgba(255, 255, 255, .62), rgba(0, 0, 0, 0) 70%),
        radial-gradient(2px 2px at 48% 34%, rgba(255, 255, 255, .54), rgba(0, 0, 0, 0) 70%),
        radial-gradient(2px 2px at 56% 22%, rgba(0, 200, 255, .34), rgba(0, 0, 0, 0) 72%),
        radial-gradient(3px 3px at 66% 48%, rgba(255, 255, 255, .48), rgba(0, 0, 0, 0) 70%),
        radial-gradient(2px 2px at 78% 30%, rgba(255, 255, 255, .58), rgba(0, 0, 0, 0) 70%),
        linear-gradient(110deg, rgba(0, 200, 255, .0), rgba(0, 200, 255, .18), rgba(0, 200, 255, .0));
    opacity: .98;
    filter: drop-shadow(0 0 6px rgba(0, 200, 255, .10));
}

.q-theme-ico {
    position: absolute;
    left: var(--qt-pad);
    top: var(--qt-pad);
    width: var(--qt-knob);
    height: var(--qt-knob);
    border-radius: 999px;
    transform: translateX(var(--qt-x));
    background: radial-gradient(circle at 34% 30%, rgba(255, 255, 255, .96), rgba(255, 244, 206, .92) 42%, rgba(255, 210, 128, .86) 74%, rgba(255, 172, 86, .78));
    border: 1px solid rgba(0, 0, 0, .10);
    box-shadow: 0 12px 22px rgba(0, 0, 0, .16), inset 0 1px 0 rgba(255, 255, 255, .62);
    overflow: hidden;
    transition: transform 360ms cubic-bezier(.2, .9, .2, 1), background 360ms ease, border-color 360ms ease, box-shadow 360ms ease;
}

html[data-theme="light"] .q-theme-toggle .q-theme-ico {
    background: radial-gradient(circle at 34% 30%, rgba(255, 255, 255, .96), rgba(255, 249, 226, .92) 42%, rgba(252, 214, 150, .80) 76%, rgba(246, 176, 106, .62)) !important;
    border-color: rgba(0, 0, 0, .10) !important;
    box-shadow: 0 12px 22px rgba(0, 0, 0, .14), inset 0 1px 0 rgba(255, 255, 255, .62) !important;
}

html[data-theme="light"] .q-theme-toggle .q-theme-ico::before {
    opacity: .08 !important;
}

html[data-theme="light"] .q-theme-toggle .q-theme-ico::after {
    opacity: .98 !important;
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2728%27%20height%3D%2728%27%20viewBox%3D%270%200%2028%2028%27%3E%3Cg%20fill%3D%27none%27%20stroke%3D%27%23E6A63A%27%20stroke-linecap%3D%27round%27%20stroke-width%3D%271.45%27%20opacity%3D%270.86%27%3E%3Cpath%20d%3D%27M14%203.7v2.1M14%2022.2v2.1M3.7%2014h2.1M22.2%2014h2.1M6.4%206.4l1.4%201.4M20.2%2020.2l1.4%201.4M21.6%206.4l-1.4%201.4M7.8%2020.2l-1.4%201.4%27/%3E%3C/g%3E%3Ccircle%20cx%3D%2714%27%20cy%3D%2711.4%27%20r%3D%275.0%27%20fill%3D%27%23F4C96A%27%20opacity%3D%270.84%27/%3E%3Cpath%20d%3D%27M8.25%2018.5c0-2.2%201.78-3.98%203.98-3.98%201.18%200%202.26.5%202.96%201.34.4-.2.84-.3%201.3-.3%201.86%200%203.36%201.5%203.36%203.36s-1.5%203.36-3.36%203.36H12.23c-2.2%200-3.98-1.78-3.98-3.98Z%27%20fill%3D%27%23F8FBFF%27%20stroke%3D%27%23CFE1FF%27%20stroke-width%3D%271.0%27%20opacity%3D%270.94%27/%3E%3Cpath%20d%3D%27M11.25%2018.95h2.45a1.2%201.2%200%200%201%200%202.4h-2.45a1.2%201.2%200%200%201%200-2.4Z%27%20fill%3D%27%237FBFFF%27%20opacity%3D%270.44%27/%3E%3C/svg%3E") !important;
}

.q-theme-ico::before {
    content: "";
    position: absolute;
    inset: -10px;
    border-radius: 999px;
    background: radial-gradient(closest-side, rgba(255, 160, 40, .22), rgba(0, 0, 0, 0) 70%);
    opacity: .10;
    transform: scale(.92);
    transition: opacity 360ms ease, transform 360ms cubic-bezier(.2, .9, .2, 1);
}

.q-theme-ico::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 999px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 26px 26px;
    opacity: .98;
    transform: rotate(0deg) scale(1);
    transition: opacity 360ms ease, transform 360ms cubic-bezier(.2, .9, .2, 1);
    filter: drop-shadow(0 1px 0 rgba(0, 0, 0, .08)) drop-shadow(0 4px 10px rgba(0, 0, 0, .12));
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2728%27%20height%3D%2728%27%20viewBox%3D%270%200%2028%2028%27%3E%3Cg%20fill%3D%27none%27%20stroke%3D%27%23F2B24A%27%20stroke-linecap%3D%27round%27%20stroke-width%3D%271.55%27%20opacity%3D%270.92%27%3E%3Cpath%20d%3D%27M14%203.4v2.3M14%2022.3v2.3M3.4%2014h2.3M22.3%2014h2.3M6.25%206.25l1.55%201.55M20.2%2020.2l1.55%201.55M21.75%206.25l-1.55%201.55M7.8%2020.2l-1.55%201.55%27/%3E%3C/g%3E%3Ccircle%20cx%3D%2714%27%20cy%3D%2711.3%27%20r%3D%275.1%27%20fill%3D%27%23F6C463%27%20opacity%3D%270.88%27/%3E%3Cpath%20d%3D%27M8.2%2018.45c0-2.25%201.82-4.07%204.07-4.07%201.2%200%202.32.52%203.03%201.38.4-.2.86-.31%201.34-.31%201.9%200%203.44%201.54%203.44%203.44s-1.54%203.44-3.44%203.44H12.27c-2.25%200-4.07-1.82-4.07-4.07Z%27%20fill%3D%27%23F8FAFF%27%20stroke%3D%27%23CFE0FF%27%20stroke-width%3D%271.05%27%20opacity%3D%270.94%27/%3E%3Cpath%20d%3D%27M11.2%2018.9h2.4a1.2%201.2%200%200%201%200%202.4h-2.4a1.2%201.2%200%200%201%200-2.4Z%27%20fill%3D%27%2386CFFF%27%20opacity%3D%270.52%27/%3E%3C/svg%3E");
}

.q-theme-toggle.is-dark .q-theme-ico {
    background: radial-gradient(circle at 34% 30%, rgba(255, 255, 255, .96), rgba(224, 232, 255, .92) 42%, rgba(176, 192, 224, .86) 78%, rgba(130, 154, 190, .78));
    border-color: rgba(180, 190, 255, .22);
    box-shadow: 0 14px 26px rgba(0, 0, 0, .26), inset 0 1px 0 rgba(255, 255, 255, .18);
}

.q-theme-toggle.is-dark .q-theme-ico::before {
    inset: 0;
    opacity: .88;
    transform: scale(1);
    background:
        radial-gradient(10px 10px at 38% 44%, rgba(0, 0, 0, .14), rgba(0, 0, 0, 0) 70%),
        radial-gradient(8px 8px at 64% 56%, rgba(0, 0, 0, .10), rgba(0, 0, 0, 0) 72%),
        radial-gradient(6px 6px at 54% 32%, rgba(0, 0, 0, .08), rgba(0, 0, 0, 0) 72%),
        radial-gradient(closest-side at 30% 26%, rgba(255, 255, 255, .46), rgba(0, 0, 0, 0) 62%);
}

.q-theme-toggle.is-dark .q-theme-ico::after {
    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, .22)) drop-shadow(0 0 10px rgba(0, 200, 255, .10));
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2728%27%20height%3D%2728%27%20viewBox%3D%270%200%2028%2028%27%3E%3Cpath%20d%3D%27M18.8%2018.8a8.8%208.8%200%200%201-10.6-10.6%207.6%207.6%200%200%200%2010.6%2010.6Z%27%20fill%3D%27%23DDE8FF%27%20opacity%3D%270.92%27/%3E%3Cg%20opacity%3D%270.98%27%3E%3Ccircle%20cx%3D%2710.7%27%20cy%3D%2717.2%27%20r%3D%273.25%27%20fill%3D%27%23FFFFFF%27%20opacity%3D%270.96%27/%3E%3Cpath%20d%3D%27M9.2%2017.2h2.95a1.35%201.35%200%200%201%200%202.7H9.2a1.35%201.35%200%200%201%200-2.7Z%27%20fill%3D%27%235CCBFF%27%20opacity%3D%270.95%27/%3E%3Cpath%20d%3D%27M8.5%2015.85c.72-.95%201.78-1.46%203.12-1.46%201.25%200%202.38.5%203.1%201.46%27%20fill%3D%27none%27%20stroke%3D%27%23CFE0FF%27%20stroke-width%3D%271.25%27%20stroke-linecap%3D%27round%27%20opacity%3D%270.86%27/%3E%3Ccircle%20cx%3D%2722.1%27%20cy%3D%278.3%27%20r%3D%271.05%27%20fill%3D%27%23FFFFFF%27%20opacity%3D%270.62%27/%3E%3Ccircle%20cx%3D%2720.4%27%20cy%3D%276.8%27%20r%3D%270.7%27%20fill%3D%27%23BFEAFF%27%20opacity%3D%270.52%27/%3E%3C/g%3E%3C/svg%3E");
    transform: rotate(-8deg) scale(1);
}

.q-theme-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.headerBox .box .navs .q-theme-toggle {
    padding: var(--qt-pad);
}

.q-float-theme {
    display: none;
    position: fixed;
    right: 12px;
    bottom: 92px;
    z-index: 9997;
    width: 44px;
    height: 44px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .72);
    border: 1px solid rgba(0, 0, 0, .08);
    box-shadow: 0 12px 26px rgba(0, 0, 0, .14);
    align-items: center;
    justify-content: center;
    -webkit-tap-highlight-color: transparent;
    transform: translateZ(0);
    transition: transform .26s cubic-bezier(.2, .9, .2, 1), box-shadow .26s ease, border-color .26s ease, background-color .26s ease;
    user-select: none;
    text-decoration: none;
    cursor: pointer;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.q-float-theme::before {
    content: "";
    position: absolute;
    inset: 1px;
    border-radius: 999px;
    background:
        radial-gradient(26px 18px at 30% 26%, rgba(255, 255, 255, .92), rgba(255, 255, 255, 0) 70%),
        radial-gradient(22px 18px at 70% 78%, rgba(18, 90, 255, .10), rgba(0, 0, 0, 0) 75%);
    opacity: .92;
    pointer-events: none;
    transition: opacity .26s ease, transform .34s cubic-bezier(.2, .9, .2, 1);
}

.q-float-theme::after {
    content: "";
    position: absolute;
    inset: -10px;
    border-radius: 999px;
    background: radial-gradient(closest-side, rgba(18, 90, 255, .10), rgba(0, 0, 0, 0) 70%);
    opacity: .0;
    transform: scale(.94);
    pointer-events: none;
    transition: opacity .26s ease, transform .3s cubic-bezier(.2, .9, .2, 1);
}

html[data-theme="dark"] .q-float-theme {
    background:
        radial-gradient(360px 120px at 18% 0%, rgba(18, 90, 255, .24), rgba(0, 0, 0, 0) 60%),
        radial-gradient(360px 120px at 82% 0%, rgba(0, 200, 255, .18), rgba(0, 0, 0, 0) 60%),
        rgba(13, 13, 36, .78);
    border-color: rgba(180, 190, 255, .18);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 16px 34px rgba(0, 0, 0, .34), 0 18px 36px rgba(0, 200, 255, .10);
}

html[data-theme="dark"] .q-float-theme::before {
    background:
        radial-gradient(26px 18px at 30% 26%, rgba(255, 255, 255, .18), rgba(255, 255, 255, 0) 70%),
        radial-gradient(24px 20px at 70% 78%, rgba(0, 200, 255, .18), rgba(0, 0, 0, 0) 75%);
    opacity: .95;
    animation: qThemePulse 2.6s ease-in-out infinite;
}

html[data-theme="dark"] .q-float-theme::after {
    background: radial-gradient(closest-side, rgba(0, 200, 255, .18), rgba(0, 0, 0, 0) 70%);
    opacity: .32;
    transform: scale(.96);
    animation: qThemeHalo 2.8s ease-in-out infinite;
}

html[data-theme="dark"] .q-float-theme-ico {
    filter: drop-shadow(0 12px 22px rgba(0, 0, 0, .26)) drop-shadow(0 0 14px rgba(0, 200, 255, .12));
}

@keyframes qThemePulse {
    0% { opacity: .88; transform: translate3d(0, 0, 0) scale(1); }
    50% { opacity: 1; transform: translate3d(0, 0, 0) scale(1.012); }
    100% { opacity: .88; transform: translate3d(0, 0, 0) scale(1); }
}

@keyframes qThemeHalo {
    0% { opacity: .22; transform: translate3d(0, 0, 0) scale(.94); }
    50% { opacity: .44; transform: translate3d(0, 0, 0) scale(1.02); }
    100% { opacity: .22; transform: translate3d(0, 0, 0) scale(.94); }
}

.q-mobile-verifybar {
    display: none;
}

@media screen and (max-width: 768px) {
    .quantum-panel {
        padding-bottom: 92px;
    }

    .q-mobile-verifybar {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        position: fixed;
        left: 50%;
        transform: translateX(-50%);
        bottom: 14px;
        z-index: 9996;
        padding: 10px 12px;
        border-radius: 999px;
        background: rgba(255, 255, 255, .86);
        border: 1px solid rgba(0, 0, 0, .10);
        box-shadow: 0 18px 40px rgba(0, 0, 0, .14);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        white-space: nowrap;
        user-select: none;
    }

    .q-mobile-verifybar .m-pill {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        height: 26px;
        padding: 0 10px;
        border-radius: 999px;
        font-weight: 1000;
        font-size: 12px;
        letter-spacing: .2px;
        color: rgba(0, 0, 0, .82);
        background: rgba(0, 0, 0, .04);
        border: 1px solid rgba(0, 0, 0, .08);
    }

    .q-mobile-verifybar .m-pill::before {
        content: "";
        width: 8px;
        height: 8px;
        border-radius: 999px;
        background: rgba(0, 0, 0, .30);
        box-shadow: 0 0 0 3px rgba(0, 0, 0, .04);
        flex: none;
    }

    .q-mobile-verifybar .m-pill.is-total {
        background: rgba(18, 90, 255, .08);
        border-color: rgba(18, 90, 255, .16);
    }

    .q-mobile-verifybar .m-pill.is-total::before {
        background: rgba(18, 90, 255, .92);
        box-shadow: 0 0 0 3px rgba(18, 90, 255, .12);
    }

    .q-mobile-verifybar .m-pill.is-valid {
        background: rgba(0, 200, 120, .10);
        border-color: rgba(0, 200, 120, .18);
        color: rgba(0, 130, 70, .92);
    }

    .q-mobile-verifybar .m-pill.is-valid::before {
        background: rgba(0, 200, 120, .92);
        box-shadow: 0 0 0 3px rgba(0, 200, 120, .12);
    }

    .q-mobile-verifybar .m-pill.is-invalid {
        background: rgba(255, 70, 70, .10);
        border-color: rgba(255, 70, 70, .18);
        color: rgba(210, 40, 40, .92);
    }

    .q-mobile-verifybar .m-pill.is-invalid::before {
        background: rgba(255, 70, 70, .92);
        box-shadow: 0 0 0 3px rgba(255, 70, 70, .12);
    }

    html[data-theme="dark"] .q-mobile-verifybar {
        background: rgba(8, 10, 28, .84);
        border-color: rgba(220, 230, 255, .18);
        box-shadow: 0 22px 52px rgba(0, 0, 0, .40);
    }

    html[data-theme="dark"] .q-mobile-verifybar .m-pill {
        color: rgba(234, 238, 255, .94);
        background: rgba(255, 255, 255, .08);
        border-color: rgba(220, 230, 255, .18);
    }

    html[data-theme="dark"] .q-mobile-verifybar .m-pill::before {
        background: rgba(224, 236, 255, .82);
        box-shadow: 0 0 0 3px rgba(224, 236, 255, .10);
    }

    html[data-theme="dark"] .q-mobile-verifybar .m-pill.is-total {
        background: rgba(18, 90, 255, .18);
        border-color: rgba(0, 200, 255, .22);
    }

    html[data-theme="dark"] .q-mobile-verifybar .m-pill.is-valid {
        background: rgba(0, 190, 140, .18);
        border-color: rgba(0, 210, 150, .24);
        color: rgba(210, 252, 232, .96);
    }

    html[data-theme="dark"] .q-mobile-verifybar .m-pill.is-invalid {
        background: rgba(255, 90, 90, .16);
        border-color: rgba(255, 120, 120, .24);
        color: rgba(255, 222, 222, .94);
    }
}

.q-float-theme:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(0, 200, 255, .18), 0 12px 26px rgba(0, 0, 0, .14);
}

.q-float-theme:hover {
    transform: translateY(-1px);
    box-shadow: 0 16px 34px rgba(0, 0, 0, .16);
}

.q-float-theme:hover::after {
    opacity: .65;
    transform: scale(1.04);
    animation: none;
}

.q-float-theme:active {
    transform: translateY(0) scale(.94);
}

.q-float-theme:active::after {
    opacity: .85;
    transform: scale(1.06);
    animation: none;
}

.q-float-theme-ico {
    width: 22px;
    height: 22px;
    border-radius: 999px;
    display: inline-flex;
    position: relative;
    background: rgba(0, 0, 0, 0);
    border: 0;
    box-shadow: none;
    transition: transform .34s cubic-bezier(.2, .9, .2, 1), filter .34s ease;
    color: rgba(238, 160, 68, .92);
    filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .12)) drop-shadow(0 0 8px rgba(160, 210, 255, .14));
}

.q-float-theme:hover .q-float-theme-ico {
    filter: drop-shadow(0 14px 22px rgba(0, 0, 0, .18));
}

.q-float-theme:active .q-float-theme-ico {
    transform: rotate(10deg) scale(.94);
}

.q-float-theme-ico::before,
.q-float-theme-ico::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 999px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 24px 24px;
    transition: opacity .34s ease, transform .34s cubic-bezier(.2, .9, .2, 1), filter .34s ease;
}

.q-float-theme-ico::before {
    opacity: 1;
    transform: rotate(0deg) scale(1);
    filter: drop-shadow(0 1px 0 rgba(0, 0, 0, .12)) drop-shadow(0 4px 8px rgba(0, 0, 0, .16));
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cg%20fill%3D%27none%27%20stroke%3D%27currentColor%27%20stroke-linecap%3D%27round%27%20stroke-width%3D%271.55%27%20opacity%3D%270.96%27%3E%3Cpath%20d%3D%27M12%202.4v2.2M12%2019.4v2.2M2.4%2012h2.2M19.4%2012h2.2M4.6%204.6l1.55%201.55M17.85%2017.85l1.55%201.55M19.4%204.6l-1.55%201.55M6.15%2017.85l-1.55%201.55%27/%3E%3C/g%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2710.2%27%20r%3D%274.15%27%20fill%3D%27currentColor%27%20opacity%3D%270.92%27/%3E%3Cpath%20d%3D%27M5.6%2016.7c0-2.05%201.65-3.7%203.7-3.7%201.15%200%202.2.48%202.88%201.26.42-.2.86-.3%201.32-.3%201.7%200%203.08%201.38%203.08%203.08%200%201.7-1.38%203.08-3.08%203.08H9.3c-2.05%200-3.7-1.65-3.7-3.7Z%27%20fill%3D%27%23FFFFFF%27%20stroke%3D%27%23CFE2FF%27%20stroke-width%3D%271.05%27%20opacity%3D%270.95%27/%3E%3C/svg%3E");
}

.q-float-theme-ico::after {
    opacity: 0;
    transform: rotate(-42deg) scale(.72);
    filter: blur(.2px) drop-shadow(0 4px 10px rgba(0, 0, 0, .22)) drop-shadow(0 0 10px rgba(0, 200, 255, .12));
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M16.2%2016.6a7.8%207.8%200%200%201-9.3-9.3%206.8%206.8%200%200%200%209.3%209.3Z%27%20fill%3D%27currentColor%27%20opacity%3D%270.92%27/%3E%3Cg%20opacity%3D%270.98%27%3E%3Ccircle%20cx%3D%278.3%27%20cy%3D%2717.1%27%20r%3D%272.75%27%20fill%3D%27%23FFFFFF%27%20opacity%3D%270.96%27/%3E%3Cpath%20d%3D%27M7.1%2017.1h2.4a1.15%201.15%200%200%201%200%202.3h-2.4a1.15%201.15%200%200%201%200-2.3Z%27%20fill%3D%27%235CCBFF%27%20opacity%3D%270.95%27/%3E%3Cpath%20d%3D%27M6.55%2015.85c.6-.78%201.46-1.2%202.56-1.2s1.96.42%202.56%201.2%27%20fill%3D%27none%27%20stroke%3D%27%23CFE0FF%27%20stroke-width%3D%271.15%27%20stroke-linecap%3D%27round%27%20opacity%3D%270.86%27/%3E%3Ccircle%20cx%3D%2720.7%27%20cy%3D%278.1%27%20r%3D%271.0%27%20fill%3D%27%23FFFFFF%27%20opacity%3D%270.58%27/%3E%3Ccircle%20cx%3D%2719.1%27%20cy%3D%276.6%27%20r%3D%270.7%27%20fill%3D%27%23BFEAFF%27%20opacity%3D%270.48%27/%3E%3C/g%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
}

.q-float-theme-ico.is-dark {
    transform: rotate(-14deg) scale(.98);
    color: rgba(160, 210, 255, .92);
}

.q-float-theme-ico.is-dark::after {
    opacity: 1;
    transform: rotate(0deg) scale(1);
    filter: blur(0);
}

.q-float-theme-ico.is-dark::before {
    opacity: 0;
    transform: rotate(42deg) scale(.72);
}

@media screen and (max-width: 768px) {
    .q-float-theme {
        display: inline-flex;
    }
}

html.q-enter body {
    animation: qEnter .62s cubic-bezier(.2, .8, .2, 1) both;
}

@keyframes qEnter {
    0% { opacity: 0; transform: translate3d(0, 8px, 0); filter: blur(6px); }
    100% { opacity: 1; transform: translate3d(0, 0, 0); filter: blur(0); }
}

.q-transition {
    --q-trans-ms: 1200ms;
    --q-trans-fast-ms: 860ms;
    --q-trans-bar-ms: 720ms;
    --q-trans-bar-move-ms: 560ms;
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: radial-gradient(1100px 520px at 50% 0%, rgba(18, 90, 255, .28), rgba(0, 0, 0, .20) 70%);
    opacity: 0;
    pointer-events: none;
    transition: opacity .22s ease;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    overflow: hidden;
    will-change: opacity, transform;
    transform: translateZ(0);
    backface-visibility: hidden;
}

.q-transition.is-on {
    opacity: 1;
    pointer-events: all;
    transition: none;
    animation: qTransitionFade var(--q-trans-ms) cubic-bezier(.2, .9, .2, 1) both;
}

html[data-theme="dark"] .q-transition {
    background: radial-gradient(1100px 520px at 50% 0%, rgba(18, 90, 255, .26), rgba(0, 0, 0, .46) 70%);
}

.q-transition::before {
    content: "";
    position: absolute;
    inset: -20%;
    background:
        radial-gradient(900px 460px at 18% 18%, rgba(0, 200, 255, .22), rgba(0, 0, 0, 0) 62%),
        radial-gradient(820px 520px at 82% 12%, rgba(88, 92, 255, .20), rgba(0, 0, 0, 0) 66%),
        linear-gradient(180deg, rgba(255, 255, 255, .10), rgba(0, 0, 0, 0) 28%, rgba(0, 0, 0, 0) 72%, rgba(255, 255, 255, .08));
    opacity: 0;
    filter: blur(14px);
}

.q-transition::after {
    content: "量子跃迁";
    position: absolute;
    left: 50%;
    top: calc(50% - 44px);
    transform: translate(-50%, -50%);
    font-weight: 1000;
    letter-spacing: 6px;
    font-size: 13px;
    color: rgba(255, 255, 255, .0);
    text-shadow: 0 0 18px rgba(0, 200, 255, .0);
    opacity: 0;
}

.q-transition.is-on::before {
    opacity: 1;
    animation: qTGlow var(--q-trans-fast-ms) ease both;
}

.q-transition.is-on::after {
    opacity: 1;
    color: rgba(255, 255, 255, .88);
    text-shadow: 0 0 18px rgba(0, 200, 255, .28), 0 0 44px rgba(18, 90, 255, .22);
    animation: qTText var(--q-trans-fast-ms) ease both;
}

@keyframes qTransitionFade {
    0% { opacity: 0; transform: translate3d(0, 8px, 0) scale(.992); }
    4% { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
    92% { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
    100% { opacity: 0; transform: translate3d(0, -8px, 0) scale(1.006); }
}

@keyframes qTGlow {
    0% { transform: translate3d(0, 18px, 0) scale(1.05); opacity: 0; }
    55% { opacity: 1; }
    100% { transform: translate3d(0, 0, 0) scale(1); opacity: 1; }
}

@keyframes qTText {
    0% { transform: translate(-50%, -50%) scale(.96); opacity: 0; filter: blur(8px); }
    45% { opacity: 1; filter: blur(0); }
    65% { transform: translate(-50.2%, -50.3%) scale(1); }
    100% { transform: translate(-50%, -50%) scale(1); opacity: 1; }
}

html.q-leaving body {
    transition: opacity .18s ease;
    opacity: .96;
}

.q-transition .q-t-layer {
    position: absolute;
    inset: -10%;
    opacity: .0;
}

.q-transition.is-on .q-t-layer {
    opacity: 1;
}

.q-transition .q-t-grid {
    background-image:
        repeating-linear-gradient(90deg, rgba(0, 200, 255, .10) 0 1px, rgba(0, 0, 0, 0) 1px 22px),
        repeating-linear-gradient(0deg, rgba(18, 90, 255, .08) 0 1px, rgba(0, 0, 0, 0) 1px 22px),
        radial-gradient(1000px 520px at 50% 0%, rgba(18, 90, 255, .26), rgba(0, 0, 0, 0) 68%);
    filter: blur(.2px);
    animation: qTGrid var(--q-trans-fast-ms) ease both;
}

.q-transition .q-t-streaks {
    opacity: .0;
    background-image:
        linear-gradient(90deg, rgba(0, 0, 0, 0), rgba(255, 255, 255, .16), rgba(0, 0, 0, 0)),
        linear-gradient(90deg, rgba(0, 0, 0, 0), rgba(0, 200, 255, .22), rgba(0, 0, 0, 0)),
        linear-gradient(90deg, rgba(0, 0, 0, 0), rgba(18, 90, 255, .18), rgba(0, 0, 0, 0));
    background-repeat: repeat;
    background-size: 260px 2px, 340px 1px, 420px 1px;
    background-position: -420px 30%, -680px 55%, -920px 75%;
    transform: skewY(-8deg) scale(1.08);
    filter: blur(.35px) drop-shadow(0 0 18px rgba(0, 200, 255, .14));
    mix-blend-mode: screen;
    animation: qTStreaks var(--q-trans-ms) linear both;
}

.q-transition .q-t-particles {
    background:
        radial-gradient(circle at 18% 22%, rgba(255, 255, 255, .70), rgba(0, 0, 0, 0) 55%),
        radial-gradient(circle at 72% 18%, rgba(0, 200, 255, .62), rgba(0, 0, 0, 0) 55%),
        radial-gradient(circle at 58% 72%, rgba(88, 92, 255, .60), rgba(0, 0, 0, 0) 58%);
    filter: blur(0.8px);
    animation: qTParticles var(--q-trans-fast-ms) ease both;
}

.q-transition .q-t-wormhole {
    background:
        radial-gradient(circle at 50% 54%, rgba(0, 0, 0, 0) 0 28%, rgba(0, 200, 255, .16) 34%, rgba(18, 90, 255, .12) 46%, rgba(0, 0, 0, 0) 66%),
        conic-gradient(from 210deg at 50% 52%, rgba(0, 0, 0, 0), rgba(0, 200, 255, .18), rgba(18, 90, 255, .22), rgba(0, 0, 0, 0), rgba(0, 200, 255, .16));
    transform: translate3d(0, 0, 0);
    filter: blur(22px) saturate(1.18);
    mix-blend-mode: screen;
    animation: qTWormholeIn var(--q-trans-fast-ms) cubic-bezier(.2, .9, .2, 1) both, qTWormholeSpin var(--q-trans-ms) linear both;
}

.q-transition .q-t-wave {
    background: conic-gradient(from 200deg at 50% 50%, rgba(0, 0, 0, 0), rgba(18, 90, 255, .22), rgba(0, 200, 255, .16), rgba(0, 0, 0, 0));
    filter: blur(32px);
    animation: qTWave var(--q-trans-fast-ms) ease both;
}

.q-transition .q-t-hint {
    position: absolute;
    left: 50%;
    top: calc(50% - 28px);
    transform: translate(-50%, -50%);
    font-size: 13px;
    font-weight: 900;
    letter-spacing: 2px;
    color: rgba(255, 255, 255, .88);
    text-shadow: 0 0 18px rgba(0, 200, 255, .22);
    opacity: 0;
}

.q-transition.is-on .q-t-hint {
    opacity: 1;
    animation: qTPct var(--q-trans-fast-ms) ease both;
}

@media screen and (max-width: 768px) {
    .q-transition {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .q-transition .q-t-streaks,
    .q-transition .q-t-wormhole,
    .q-transition .q-t-wave {
        display: none;
    }

    .q-transition::before {
        filter: blur(10px);
    }

    .q-transition .q-t-bar {
        width: min(360px, 84vw);
    }
}

.q-transition .q-t-bar {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: min(520px, 82vw);
    height: 8px;
    border-radius: 999px;
    overflow: hidden;
    background: rgba(255, 255, 255, .14);
    border: 1px solid rgba(255, 255, 255, .12);
    opacity: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ticketModal {
    box-sizing: border-box;
}

@media screen and (max-width: 768px) {
    .el-dialog {
        width: 92vw !important;
        max-width: 92vw !important;
        margin: 7vh auto !important;
    }

    .ticketModal {
        width: 100%;
        max-height: 76vh;
        overflow: auto;
        padding: 0 4px;
    }

    .ticket-contact-row {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .ticket-contact-row .el-select {
        width: 100% !important;
    }

    .ticket-contact-input {
        margin-left: 0 !important;
    }

    .ticket-actions {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .ticket-actions .el-button {
        width: 100%;
    }

    .ticket-query-tabs .el-tabs__header {
        overflow-x: auto;
    }

    .ticket-history-scroll {
        max-height: 46vh;
        overflow: auto;
    }
}

.q-transition.is-on .q-t-bar {
    opacity: 1;
    animation: qTBar var(--q-trans-bar-ms) ease both;
}

.q-transition .q-t-bar .fill {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 0%;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(18, 90, 255, .86), rgba(0, 200, 255, .92));
    box-shadow: 0 0 18px rgba(0, 200, 255, .22);
}

.q-transition.is-on .q-t-bar .fill {
    animation: qTFill var(--q-trans-ms) cubic-bezier(.2, .9, .2, 1) both;
}

.q-transition .q-t-bar .bar {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    height: 100%;
    width: 32%;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(18, 90, 255, 0), rgba(18, 90, 255, .88), rgba(0, 200, 255, .86), rgba(18, 90, 255, 0));
    animation: qTBarMove var(--q-trans-bar-move-ms) ease-in-out infinite;
    mix-blend-mode: screen;
}

.q-transition .q-t-bar .q-t-pct {
    position: absolute;
    left: 50%;
    top: calc(100% + 10px);
    transform: translateX(-50%);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .8px;
    color: rgba(255, 255, 255, .86);
    text-shadow: 0 0 18px rgba(0, 200, 255, .20);
    opacity: 0;
}

.q-transition.is-on .q-t-bar .q-t-pct {
    opacity: 1;
    animation: qTPct var(--q-trans-fast-ms) ease both;
}

@keyframes qTGrid {
    0% { opacity: 0; transform: translate3d(0, 14px, 0) scale(1.02); }
    100% { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}

@keyframes qTFill {
    0% { width: 0%; }
    18% { width: 22%; }
    62% { width: 78%; }
    86% { width: 92%; }
    100% { width: 100%; }
}

@keyframes qTPct {
    0% { opacity: 0; transform: translateX(-50%) translateY(6px); filter: blur(6px); }
    100% { opacity: 1; transform: translateX(-50%) translateY(0); filter: blur(0); }
}

@keyframes qTStreaks {
    0% { opacity: 0; background-position: -820px 30%, -1080px 55%, -1320px 75%; }
    14% { opacity: 1; }
    86% { opacity: .9; }
    100% { opacity: 0; background-position: 1320px 30%, 1880px 55%, 2520px 75%; }
}

@keyframes qTParticles {
    0% { opacity: 0; transform: translate3d(0, -10px, 0) scale(.98); }
    100% { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}

@keyframes qTWormholeIn {
    0% { opacity: 0; transform: translate3d(0, 18px, 0) scale(.86) rotate(-12deg); }
    44% { opacity: 1; }
    100% { opacity: 1; transform: translate3d(0, 0, 0) scale(1.08) rotate(18deg); }
}

@keyframes qTWormholeSpin {
    0% { filter: blur(30px) saturate(1.1); }
    100% { transform: translate3d(0, 0, 0) rotate(240deg) scale(1.12); filter: blur(28px) saturate(1.25); }
}

@keyframes qTWave {
    0% { opacity: 0; transform: rotate(-8deg) scale(.92); }
    100% { opacity: 1; transform: rotate(10deg) scale(1.02); }
}

@keyframes qTBar {
    0% { opacity: 0; transform: translate(-50%, -50%) scaleX(.86); }
    100% { opacity: 1; transform: translate(-50%, -50%) scaleX(1); }
}

@keyframes qTBarMove {
    0% { transform: translateX(-60%); opacity: .65; }
    50% { opacity: 1; }
    100% { transform: translateX(160%); opacity: .65; }
}

.q-guard {
    position: fixed;
    left: 50%;
    top: 86px;
    transform: translateX(-50%) translateY(0) scale(1);
    z-index: 9998;
    width: min(820px, calc(100vw - 26px));
    border-radius: 16px;
    padding: 14px 14px 14px 16px;
    display: grid;
    grid-template-columns: 54px 1fr auto;
    gap: 12px;
    align-items: center;
    background: linear-gradient(180deg, rgba(255, 255, 255, .86), rgba(255, 255, 255, .70));
    border: 1px solid rgba(0, 0, 0, .10);
    box-shadow: 0 26px 56px rgba(0, 0, 0, .14);
    backdrop-filter: blur(14px);
    overflow: hidden;
}

.q-guard::before {
    content: "";
    position: absolute;
    inset: -2px;
    background: radial-gradient(520px 240px at 18% 0%, rgba(18, 90, 255, .22), rgba(0, 0, 0, 0) 66%),
        radial-gradient(520px 260px at 82% 0%, rgba(0, 200, 255, .18), rgba(0, 0, 0, 0) 66%);
    opacity: .9;
    pointer-events: none;
}

.q-guard > * {
    position: relative;
    z-index: 1;
}

.q-guard-enter-active,
.q-guard-leave-active {
    transition: opacity .22s ease, transform .22s cubic-bezier(.2, .9, .2, 1), filter .22s ease;
}

.q-guard-enter-from,
.q-guard-leave-to {
    opacity: 0;
    transform: translateX(-50%) translateY(-10px) scale(.985);
    filter: blur(10px);
}

.q-guard .q-guard-shield {
    width: 54px;
    height: 54px;
    border-radius: 18px;
    background:
        radial-gradient(circle at 30% 30%, rgba(255, 255, 255, .92), rgba(255, 255, 255, 0) 70%),
        linear-gradient(135deg, rgba(18, 90, 255, .84), rgba(0, 200, 255, .72));
    position: relative;
    overflow: hidden;
}

.q-guard .q-guard-shield::before {
    content: "";
    position: absolute;
    inset: -18px;
    background: conic-gradient(from 200deg at 50% 50%, rgba(0, 0, 0, 0), rgba(255, 255, 255, .70), rgba(0, 0, 0, 0));
    filter: blur(14px);
    opacity: .75;
    animation: qShield 1.2s linear infinite;
}

@keyframes qShield {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.q-guard .q-guard-body .t {
    font-weight: 900;
    letter-spacing: .4px;
    color: rgba(0, 0, 0, .84);
}

.q-guard .q-guard-body .s {
    margin-top: 2px;
    font-size: 12px;
    color: rgba(0, 0, 0, .54);
}

.q-guard .q-guard-actions {
    display: inline-flex;
    gap: 10px;
    align-items: center;
}

.q-guard .q-guard-btn {
    height: 30px;
    padding: 0 12px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 800;
    border: 1px solid rgba(0, 0, 0, .10);
    background: rgba(255, 255, 255, .70);
    transition: transform .18s ease, box-shadow .18s ease;
}

.q-guard .q-guard-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 20px rgba(0, 0, 0, .10);
}

.q-guard .q-guard-btn.primary {
    color: #fff;
    border-color: rgba(0, 0, 0, 0);
    background: linear-gradient(90deg, rgba(18, 90, 255, .96), rgba(0, 200, 255, .88));
}

html[data-theme="dark"] .q-guard {
    background: linear-gradient(180deg, rgba(12, 12, 30, .74), rgba(12, 12, 30, .62));
    border-color: rgba(180, 190, 255, .14);
    box-shadow: 0 28px 64px rgba(0, 0, 0, .34);
}

html[data-theme="dark"] .q-guard .q-guard-body .t {
    color: rgba(224, 224, 255, .92);
}

html[data-theme="dark"] .q-guard .q-guard-body .s {
    color: rgba(224, 224, 255, .62);
}

html[data-theme="dark"] .q-guard .q-guard-btn {
    border-color: rgba(180, 190, 255, .16);
    background: rgba(12, 12, 30, .64);
    color: rgba(224, 224, 255, .84);
}

html[data-theme="dark"] .q-logo {
    border-color: rgba(180, 190, 255, .18);
    box-shadow: 0 22px 46px rgba(0, 0, 0, .30), inset 0 1px 0 rgba(255, 255, 255, .10);
}

html[data-theme="dark"] .q-logo::after {
    opacity: .78;
    filter: drop-shadow(0 14px 22px rgba(0, 200, 255, .10));
}

.q-logo {
    width: 24px;
    height: 24px;
    border-radius: 9px;
    transform: rotate(45deg);
    background: linear-gradient(135deg, rgba(18, 90, 255, .94), rgba(0, 200, 255, .86));
    border: 1px solid color-mix(in srgb, var(--theme-theme) 28%, rgba(0, 0, 0, .12));
    position: relative;
    box-shadow: 0 16px 30px rgba(18, 90, 255, .20), inset 0 1px 0 rgba(255, 255, 255, .48);
}

.q-logo::before {
    content: "";
    position: absolute;
    inset: 5px;
    border-radius: 7px;
    background: radial-gradient(circle at 34% 30%, rgba(255, 255, 255, .92), rgba(255, 255, 255, 0) 72%);
    opacity: .95;
}

.q-logo::after {
    content: "";
    position: absolute;
    inset: -5px;
    border-radius: 14px;
    background: conic-gradient(from 210deg at 50% 50%, rgba(0, 0, 0, 0), rgba(18, 90, 255, .72), rgba(0, 200, 255, .60), rgba(168, 85, 247, .48), rgba(0, 0, 0, 0));
    -webkit-mask: radial-gradient(farthest-side, rgba(0, 0, 0, 0) calc(100% - 2px), rgba(0, 0, 0, 1) 0);
    mask: radial-gradient(farthest-side, rgba(0, 0, 0, 0) calc(100% - 2px), rgba(0, 0, 0, 1) 0);
    filter: drop-shadow(0 10px 18px rgba(18, 90, 255, .14));
    opacity: .88;
    animation: qCore 2.2s linear infinite;
}

@keyframes qCore {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

html[data-theme="dark"] .quantum-panel {
    border-color: rgba(180, 190, 255, .12);
    box-shadow: 0 26px 56px rgba(0, 0, 0, .26);
    background: radial-gradient(1000px 380px at 16% 0%, rgba(18, 90, 255, .18), rgba(0, 0, 0, 0) 56%),
        radial-gradient(900px 360px at 84% 8%, rgba(88, 92, 255, .14), rgba(0, 0, 0, 0) 60%),
        radial-gradient(900px 420px at 50% 115%, rgba(0, 200, 255, .10), rgba(0, 0, 0, 0) 62%),
        rgba(13, 13, 36, .82);
}

html[data-theme="dark"] .quantum-title-main {
    background: linear-gradient(90deg, rgba(224, 224, 255, .92), rgba(0, 200, 255, .78));
    -webkit-background-clip: text;
    background-clip: text;
}

html[data-theme="dark"] .quantum-title-sub {
    color: rgba(224, 224, 255, .74);
}

html[data-theme="dark"] .quantum-metric {
    background: rgba(10, 10, 26, .62);
    border-color: rgba(180, 190, 255, .12);
}

html[data-theme="dark"] .quantum-metric .k {
    color: rgba(224, 224, 255, .74);
}

html[data-theme="dark"] .quantum-metric .v {
    color: var(--q-metric-v);
}

html[data-theme="dark"] .quantum-mode,
html[data-theme="dark"] .quantum-action {
    background: rgba(10, 10, 26, .62);
    border-color: rgba(180, 190, 255, .12);
}

html[data-theme="dark"] .quantum-mode a {
    color: rgba(224, 224, 255, .78);
}

html[data-theme="dark"] .quantum-mode a.active {
    color: rgba(255, 255, 255, .94);
    box-shadow: 0 12px 30px rgba(0, 200, 255, .14);
}

html[data-theme="dark"] .quantum-action {
    color: rgba(224, 224, 255, .84);
}

html[data-theme="dark"] .quantum-actions {
    background: rgba(255, 255, 255, .06);
    border-color: rgba(180, 190, 255, .14);
}

html[data-theme="dark"] .quantum-action:hover {
    box-shadow: 0 14px 28px rgba(0, 0, 0, .26);
}

html[data-theme="dark"] .quantum-action.primary {
    color: rgba(255, 255, 255, .96);
}

html[data-theme="dark"] .quantum-action.is-loading:before {
    border-color: rgba(224, 224, 255, .22);
    border-top-color: rgba(224, 224, 255, .68);
}

html[data-theme="dark"] .quantum-action.active {
    color: rgba(0, 200, 255, .92);
    background: rgba(0, 200, 255, .12);
    border-color: rgba(0, 200, 255, .20);
}

html[data-theme="dark"] .q-badge {
    color: rgba(0, 200, 255, .92);
    background: rgba(0, 200, 255, .10);
    border-color: rgba(0, 200, 255, .16);
}

html[data-theme="dark"] .quantum-chip {
    background: rgba(255, 255, 255, .06);
    border-color: rgba(180, 190, 255, .14);
}

html[data-theme="dark"] .quantum-chip .name {
    color: rgba(224, 224, 255, .86);
}

html[data-theme="dark"] .quantum-chip .meta {
    color: rgba(224, 224, 255, .72);
}

html[data-theme="dark"] .quantum-item {
    border-color: rgba(180, 190, 255, .18);
    background: rgba(13, 13, 36, .78);
}

html[data-theme="dark"] .quantum-item.is-valid {
    border-color: rgba(0, 210, 150, .52);
}

html[data-theme="dark"] .quantum-item.is-invalid {
    border-color: rgba(255, 110, 110, .50);
}

html[data-theme="dark"] .quantum-item.is-checking {
    border-color: rgba(0, 200, 255, .42);
}

html[data-theme="dark"] .quantum-item .title {
    color: rgba(234, 238, 255, .98);
}

html[data-theme="dark"] .quantum-item .title.is-disabled {
    color: rgba(190, 198, 235, .88);
    opacity: .82;
}

html[data-theme="dark"] .quantum-item .meta {
    color: rgba(204, 212, 244, .86);
}

html[data-theme="dark"] .quantum-item .badge {
    background: rgba(0, 200, 255, .20);
    border-color: rgba(0, 200, 255, .42);
    color: rgba(224, 236, 255, .96);
}

html[data-theme="dark"] .quantum-item .share-info {
    background: rgba(18, 90, 255, .18);
    border-color: rgba(88, 120, 255, .38);
    color: rgba(226, 234, 255, .92);
}

html[data-theme="dark"] .quantum-item .share-pill {
    background: rgba(10, 14, 46, .96);
    border-color: rgba(140, 154, 255, .42);
    color: rgba(214, 224, 252, .92);
}

html[data-theme="dark"] .quantum-item .share-pill.is-time {
    background: rgba(10, 14, 46, .96);
    border-color: rgba(140, 154, 255, .42);
    color: rgba(214, 224, 252, .92);
}

html[data-theme="dark"] .quantum-item .go {
    background: rgba(10, 14, 46, .96);
    border-color: rgba(140, 154, 255, .42);
    color: rgba(214, 224, 252, .92);
}

html[data-theme="dark"] .quantum-item .go:hover {
    background: rgba(18, 90, 255, .82);
    border-color: rgba(88, 120, 255, .60);
    color: rgba(226, 234, 255, .96);
}

html[data-theme="dark"] .quantum-item .meta .time {
    background: rgba(6, 10, 40, .96);
    border-color: rgba(140, 154, 255, .42);
    color: rgba(214, 224, 252, .92);
}

html[data-theme="dark"] .quantum-item .meta .time::before {
    border-color: rgba(214, 224, 252, .58);
    border-top-color: rgba(255, 255, 255, .96);
}

html[data-theme="dark"] .quantum-item .source-tag {
    background: rgba(18, 90, 255, .30);
    border-color: rgba(88, 120, 255, .60);
    color: rgba(226, 234, 255, .96);
}

html[data-theme="dark"] .quantum-item .valid-tag {
    background: rgba(10, 14, 46, .96);
    border-color: rgba(140, 154, 255, .42);
    color: rgba(214, 224, 252, .92);
}

html[data-theme="dark"] .quantum-item .valid-tag.is-valid {
    background: rgba(0, 190, 140, .26);
    border-color: rgba(0, 210, 150, .56);
    color: rgba(210, 252, 232, .98);
}

html[data-theme="dark"] .quantum-item .valid-tag.is-valid::before {
    color: rgba(6, 40, 26, .96);
    background: rgba(210, 252, 232, .96);
    border-color: rgba(0, 210, 150, .40);
}

html[data-theme="dark"] .quantum-item .valid-tag.is-invalid {
    background: rgba(255, 90, 90, .24);
    border-color: rgba(255, 120, 120, .60);
    color: rgba(255, 222, 222, .96);
}

html[data-theme="dark"] .quantum-item .valid-tag.is-invalid::before {
    color: rgba(70, 12, 12, .96);
    background: rgba(255, 238, 238, .96);
    border-color: rgba(255, 120, 120, .60);
}

html[data-theme="dark"] .quantum-item .valid-tag.is-checking {
    background: rgba(0, 200, 255, .20);
    border-color: rgba(0, 200, 255, .46);
    color: rgba(214, 236, 255, .96);
}

html[data-theme="dark"] .quantum-item .go.is-disabled {
    background: rgba(6, 10, 32, .98);
    color: rgba(160, 170, 210, .80);
}

html[data-theme="dark"] .quantum-item .go.is-disabled::before {
    background: rgba(0, 0, 0, .36);
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .50);
    opacity: .85;
}

/* PC Search Module Styles - Added by User Request */
.searchBox {
    background-color: var(--theme-background);
}

.searchModule {
    width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.smMain {
    display: grid;
    grid-template-columns: 1fr;
    gap: 30px;
}

.smHeader {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 20px;
}

.smHeader .logoBox {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.smHeader .logo {
    height: 60px;
}

.smHeader .title {
    font-size: 32px;
    font-weight: bold;
    color: var(--theme-color);
    margin-left: 15px;
}

.smHeader .subTitle {
    font-size: 16px;
    color: #999;
    letter-spacing: 2px;
}

/* Search Input Box */
.smInputBox {
    position: relative;
    width: 800px;
    height: 48px;
    margin: 0 auto;
    border: 2px solid var(--theme-theme); 
    border-radius: 24px;
    display: flex;
    align-items: center;
    background: #fff;
    transition: all 0.3s;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
}

.smInputBox.focused {
    box-shadow: 0 4px 20px rgba(0,0,0,0.15);
}

.smIcon {
    font-size: 20px;
    color: #999;
    margin-left: 20px;
    margin-right: 10px;
}

.smInputBox input {
    flex: 1;
    height: 100%;
    font-size: 16px;
    color: #333;
    background: transparent;
    border: none;
    outline: none;
}

.smClear {
    font-size: 18px;
    color: #ccc;
    cursor: pointer;
    padding: 10px;
    transition: color 0.2s;
}

.smClear:hover {
    color: #999;
}

.smBtn {
    width: 80px;
    height: 44px; /* 48 - 4 border */
    margin-right: 2px;
    background: var(--theme-theme);
    color: #fff;
    border-radius: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 16px;
    font-weight: 500;
    transition: opacity 0.2s;
}

.smBtn:hover {
    opacity: 0.9;
}

.smBtn .iconfont {
    margin-right: 4px;
    font-size: 18px;
}

/* Dropdown */
.smDropdown {
    position: absolute;
    top: 54px;
    left: 0;
    right: 0;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.1);
    z-index: 100;
    overflow: hidden;
    padding: 10px 0;
    border: 1px solid #eee;
}

.smItem {
    padding: 10px 20px;
    cursor: pointer;
    display: flex;
    align-items: center;
    font-size: 15px;
    color: #333;
    text-align: left;
}

.smItem:hover {
    background-color: #f5f7fa;
    color: var(--theme-theme);
}

.smItem .iconfont {
    margin-right: 10px;
    color: #999;
}

/* History in Dropdown */
.smHistory {
    padding: 0 20px;
}

.smHHead {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
    color: #999;
    margin-bottom: 10px;
    margin-top: 10px;
}

.smHClear {
    cursor: pointer;
}

.smHClear:hover {
    color: var(--theme-theme);
}

.smHList {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.smHItem {
    padding: 4px 12px;
    background: #f0f2f5;
    border-radius: 16px;
    font-size: 13px;
    color: #666;
    cursor: pointer;
    display: flex;
    align-items: center;
}

.smHItem:hover {
    color: var(--theme-theme);
    background: #e6f7ff;
}

.smHItem .iconfont {
    font-size: 12px;
    margin-left: 6px;
    color: #ccc;
}

.smHItem .iconfont:hover {
    color: #ff4d4f;
}

/* Secondary Area */
.smSecondary {
    width: 800px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    gap: 30px;
}

.smSecTitle {
    font-size: 16px;
    font-weight: bold;
    color: var(--theme-color);
    margin-bottom: 15px;
    text-align: left;
    border-left: 4px solid var(--theme-theme);
    padding-left: 10px;
}

/* Hot Tags */
.smTagList {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.smTag {
    display: flex;
    align-items: center;
    padding: 6px 12px;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 4px;
    font-size: 14px;
    color: #555;
    cursor: pointer;
    transition: all 0.2s;
}

.smTag:hover {
    color: var(--theme-theme);
    border-color: var(--theme-theme);
    transform: translateY(-2px);
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

.smTagNum {
    display: inline-block;
    width: 18px;
    height: 18px;
    line-height: 18px;
    text-align: center;
    background: #eee;
    color: #999;
    font-size: 12px;
    border-radius: 4px;
    margin-right: 8px;
}

.smTag:nth-child(1) .smTagNum.top3 {
    background: #ff4d4f;
    color: #fff;
}

.smTag:nth-child(2) .smTagNum.top3 {
    background: #ff7a45;
    color: #fff;
}

.smTag:nth-child(3) .smTagNum.top3 {
    background: #ffa940;
    color: #fff;
}

.smTagHeat {
    font-size: 12px;
    color: #999;
    margin-left: 8px;
}

/* Filters */
.smFilterList {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.smFilterItem {
    padding: 8px 24px;
    background: #fff;
    border-radius: 20px;
    font-size: 15px;
    color: #333;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
    transition: all 0.2s;
    text-decoration: none;
}

.smFilterItem:hover {
    background: var(--theme-theme);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Responsive */
@media screen and (max-width: 1440px) {
    .searchModule {
        width: 100%;
        max-width: 1200px;
    }
}

@media screen and (max-width: 1280px) {
    .smInputBox, .smSecondary {
        width: 90%;
    }
}

.q-source-pan-hint {
    --q-pan-card-h: 52px;
    --q-pan-radius: 16px;
    --q-pan-gap: 12px;
    --q-pan-border: rgba(0, 0, 0, .12);
    --q-pan-bg: rgba(255, 255, 255, .65);
    --q-pan-text: rgba(0, 0, 0, .70);
    --q-pan-sub: rgba(0, 0, 0, .45);
    --q-pan-shadow: 0 10px 24px rgba(0, 0, 0, .10);
    --q-pan-hover-shadow: 0 14px 32px rgba(0, 0, 0, .12);
    --q-pan-glow: 0 18px 46px rgba(59, 139, 255, .28);
}

html[data-theme="dark"] .q-source-pan-hint {
    --q-pan-border: rgba(255, 255, 255, .12);
    --q-pan-bg: rgba(255, 255, 255, .06);
    --q-pan-text: rgba(255, 255, 255, .82);
    --q-pan-sub: rgba(255, 255, 255, .58);
    --q-pan-shadow: 0 14px 34px rgba(0, 0, 0, .45);
    --q-pan-hover-shadow: 0 18px 44px rgba(0, 0, 0, .55);
    --q-pan-glow: 0 24px 60px rgba(59, 139, 255, .24);
}

.q-source-pan-hint .q-pan-detect {
    margin-bottom: 8px;
    color: var(--q-pan-sub);
    font-weight: 600;
}

.q-source-pan-hint .q-pan-icons {
    display: flex;
    align-items: stretch;
    gap: var(--q-pan-gap);
    margin-top: 10px;
}

.q-source-pan-hint .q-pan-card {
    position: relative;
    flex: 1 1 0;
    min-width: 0;
    height: var(--q-pan-card-h);
    border-radius: var(--q-pan-radius);
    border: 1px solid var(--q-pan-border);
    background: var(--q-pan-bg);
    backdrop-filter: blur(12px);
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 0 14px;
    color: var(--q-pan-text);
    box-shadow: var(--q-pan-shadow);
    transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease, filter .18s ease;
    user-select: none;
}

.q-source-pan-hint .q-pan-card .iconfont {
    font-size: 20px;
    line-height: 1;
    transform: translateY(0.5px);
    color: var(--q-pan-text);
}

.q-source-pan-hint .q-pan-card .q-pan-name {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .2px;
    line-height: 1;
    color: var(--q-pan-text);
    display: inline-block;
    white-space: nowrap;
    writing-mode: horizontal-tb;
    text-orientation: mixed;
}

.q-source-pan-hint .q-pan-card.is-active {
    color: #fff !important;
    border-color: rgba(255, 255, 255, .18);
    box-shadow: var(--q-pan-hover-shadow), var(--q-pan-glow);
    transform: translateY(-1px);
}

.q-source-pan-hint .q-pan-card.is-active.is-quark {
    background: linear-gradient(135deg, #3a7afe, #7c3cff);
}

.q-source-pan-hint .q-pan-card.is-active.is-baidu {
    background: linear-gradient(135deg, #3a8bff, #12c2ff);
}

.q-source-pan-hint .q-pan-card.is-active.is-uc {
    background: linear-gradient(135deg, #ffb300, #ff6a00);
}

.q-source-pan-hint .q-pan-card.is-active .q-pan-name,
.q-source-pan-hint .q-pan-card.is-active .iconfont {
    color: #fff !important;
}

.q-source-pan-hint .q-pan-card:not(.is-active):hover {
    border-color: rgba(0, 0, 0, .20);
    color: rgba(0, 0, 0, .82);
    transform: translateY(-1px);
    box-shadow: var(--q-pan-hover-shadow);
}

html[data-theme="dark"] .q-source-pan-hint .q-pan-card:not(.is-active):hover {
    border-color: rgba(255, 255, 255, .22);
}

.q-source-pan-hint .q-pan-card::before {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    pointer-events: none;
    opacity: 0;
    transition: opacity .22s ease;
    background:
        radial-gradient(140px 80px at 18% 50%, rgba(255, 255, 255, .45), rgba(255, 255, 255, 0) 60%),
        radial-gradient(160px 90px at 82% 50%, rgba(59, 139, 255, .28), rgba(59, 139, 255, 0) 62%);
    filter: blur(10px);
}

.q-source-pan-hint .q-pan-card.is-active::before {
    opacity: 1;
    animation: q-pan-pulse 1.8s ease-in-out infinite;
}

.q-source-pan-hint .q-pan-card::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0;
    background: linear-gradient(120deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .26) 36%, rgba(255, 255, 255, 0) 72%);
    transform: translate3d(-140%, 0, 0) skewX(-18deg);
}

.q-source-pan-hint .q-pan-card:hover::after {
    opacity: .9;
    transform: translate3d(140%, 0, 0) skewX(-18deg);
    transition: transform 760ms cubic-bezier(.2, .85, .2, 1), opacity 220ms ease;
}

@keyframes q-pan-pulse {
    0%, 100% { filter: blur(10px); opacity: .85; }
    50% { filter: blur(14px); opacity: 1; }
}

.q-source-url .el-textarea__inner {
    min-height: 76px !important;
    border-radius: 12px;
}

.q-source-desc .el-textarea__inner {
    min-height: 92px !important;
    border-radius: 12px;
}