/* PC 端页面样式 */

/* ==================================================================
 * 全站基础样式
 * ================================================================== */
body {
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Microsoft YaHei UI', 'Helvetica Neue', Helvetica, Arial, sans-serif;
            background-color: #f5f5f7; 
            min-width: 1124px; 
        }
::-webkit-scrollbar {
            width: 8px;
            height: 8px;
        }
::-webkit-scrollbar-track {
            background: #f8f8f8;
        }
::-webkit-scrollbar-thumb {
            background: #e0e0e0;
            border-radius: 5px;
        }
::-webkit-scrollbar-thumb:hover {
            background: #c7c7c7;
        }
@keyframes fadeIn {
            from { opacity: 0; transform: translateY(15px); }
            to { opacity: 1; transform: translateY(0); }
        }
.fade-in {
            animation: none !important;
        }
.reveal-ready .scroll-reveal {
            opacity: 0;
            transform: translateY(24px);
            transition: opacity 600ms ease-out, transform 600ms cubic-bezier(0.16, 1, 0.3, 1);
        }
.reveal-ready .scroll-reveal.is-visible {
            opacity: 1;
            transform: translateY(0);
        }
@media (prefers-reduced-motion: reduce) {
.reveal-ready .scroll-reveal {
                opacity: 1;
                transform: none;
                transition: none;
            }
}
.glassmorphism {
            background: rgba(255, 255, 255, 0.8);
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
        }
.dropdown-menu-shell {
            visibility: hidden;
            pointer-events: none;
            transition: visibility 0s linear 300ms;
        }
.group:hover .dropdown-menu-shell,
        .group:focus-within .dropdown-menu-shell {
            visibility: visible;
            pointer-events: auto;
            transition-delay: 0s;
        }
.dropdown-menu-content {
            opacity: 0;
            transform: translate3d(0, 8px, 0) scale(0.97);
            transform-origin: top center;
            transition:
                opacity 220ms ease-out,
                transform 300ms cubic-bezier(0.16, 1, 0.3, 1);
            will-change: opacity, transform;
        }
.group:hover .dropdown-menu-content,
        .group:focus-within .dropdown-menu-content {
            opacity: 1;
            transform: translate3d(0, 0, 0) scale(1);
        }
.app-list-item:not(:last-child) {
            border-bottom: 1px solid #f0f0f0;
        }
.horizontal-scroll {
            -ms-overflow-style: none;  
            scrollbar-width: none;  
        }
.horizontal-scroll::-webkit-scrollbar {
            display: none; 
        }
.pagination {
            display: flex;
            align-items: center;
            justify-content: center;
            flex-wrap: wrap;
            list-style: none; 
            margin: 0;
            padding: 0;
            gap: 8px; 
        }
.pagination li a,
        .pagination li span {
            display: flex;
            align-items: center;
            justify-content: center;
            min-width: 34px;
            height: 34px;
            padding: 0 9px;
            border: 1px solid var(--uc-border, #eef0f4);
            border-radius: var(--uc-radius, 6px);
            background-color: var(--uc-surface, #ffffff);
            color: var(--uc-text, #374151); 
            font-size: 13px;
            font-weight: 500;
            text-decoration: none;
            transition: background-color .15s ease, border-color .15s ease, color .15s ease;
            user-select: none;
        }
.pagination li a:hover {
            border-color: var(--uc-primary, #007AFF);
            background-color: var(--uc-primary-soft, #eaf3ff);
            color: var(--uc-primary-ink, #007AFF);
        }
.pagination li.active span {
            border-color: var(--uc-primary, #007AFF);
            background-color: var(--uc-primary, #007AFF);
            color: #ffffff; 
            font-weight: 700;
            cursor: default; 
        }
.pagination li.disabled span {
            border-color: var(--uc-border, #eef0f4);
            background-color: var(--uc-surface-2, #f9fafb);
            color: var(--uc-faint, #9ca3af); 
            cursor: not-allowed; 
        }
.pc-user-entry {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 36px;
            height: 36px;
            border-radius: 9999px;
            border: 1px solid var(--uc-border-strong, #e5e7eb);
            background: var(--uc-surface-3, #f3f4f6);
            color: var(--uc-muted, #6b7280);
            transition: color .25s ease, background-color .25s ease, border-color .25s ease;
        }
.pc-user-entry svg {
            width: 20px;
            height: 20px;
        }
.pc-user-entry:hover {
            border-color: var(--uc-primary-ring, rgba(37, 99, 235, .28));
            background: var(--uc-primary-soft, rgba(37, 99, 235, .1));
            color: var(--uc-primary, #2563eb);
        }
/* ==================================================================
 * 登录、注册、找回密码页
 * ================================================================== */
:where(body[data-page="auth"]) .ua-shell {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        
        min-height: calc(100vh - 72px);
        padding: 46px 32px;
        overflow: hidden;
    }
:where(body[data-page="auth"]) .ua-shell::before {
        content: "";
        position: absolute;
        inset: 0;
        background:
            radial-gradient(720px 340px at 6% -8%, var(--brand-soft-2), transparent 66%),
            radial-gradient(560px 300px at 97% 2%, color-mix(in srgb, var(--brand) 7%, transparent), transparent 68%);
        pointer-events: none;
    }
:where(body[data-page="auth"]) .ua-wrap {
        position: relative;
        width: 100%;
        max-width: 1040px;
    }
:where(body[data-page="auth"]) .ua-card {
        display: grid;
        grid-template-columns: 424px minmax(0, 1fr);
        overflow: hidden;
        border: 1px solid var(--uc-border-strong, #e5e7eb);
        border-radius: var(--uc-radius-lg, 10px);
        background: var(--uc-surface, #fff);
        box-shadow: 0 22px 50px -22px rgba(15, 23, 42, .22), 0 2px 10px -4px rgba(15, 23, 42, .06);
    }
:where(body[data-page="auth"]) .ua-brand {
        --ua-scene-scale: .75;
        position: relative;
        display: flex;
        flex-direction: column;
        padding: 30px 30px 24px;
        background: linear-gradient(158deg, var(--brand-light) -18%, var(--brand) 40%, var(--brand-dark) 108%);
        color: #fff;
        overflow: hidden;
    }
:where(body[data-page="auth"]) .ua-brand::before {
        content: "";
        position: absolute;
        top: -130px;
        right: -110px;
        width: 300px;
        height: 300px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(255, 255, 255, .24), rgba(255, 255, 255, 0) 64%);
    }
:where(body[data-page="auth"]) .ua-brand::after {
        content: "";
        position: absolute;
        bottom: -120px;
        left: -100px;
        width: 260px;
        height: 260px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(255, 255, 255, .14), rgba(255, 255, 255, 0) 66%);
    }
:where(body[data-page="auth"]) .ua-brand-top {
        position: relative;
        display: flex;
        align-items: center;
        gap: 12px;
    }
:where(body[data-page="auth"]) .ua-brand-logo {
        flex: 0 0 auto;
        width: 44px;
        height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 12px;
        background: rgba(255, 255, 255, .96);
        box-shadow: 0 8px 18px -6px rgba(8, 18, 40, .35);
        overflow: hidden; 
    }
:where(body[data-page="auth"]) .ua-brand-logo img {
        
        width: 46px;
        height: 46px;
        object-fit: contain;
    }
:where(body[data-page="auth"]) .ua-brand-name {
        font-size: 15px;
        font-weight: 700;
        letter-spacing: .01em;
    }
:where(body[data-page="auth"]) .ua-brand-slogan {
        margin-top: 3px;
        font-size: 12px;
        color: rgba(255, 255, 255, .74);
    }
:where(body[data-page="auth"]) .ua-brand-copys {
        position: relative;
        margin-top: 28px;
        transition: height .55s cubic-bezier(.22, 1, .36, 1) .08s;
    }
:where(body[data-page="auth"]) .ua-brand-copy {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        opacity: 0;
        visibility: hidden;
        transform: translateY(14px);
        transition:
            opacity .28s ease,
            transform .34s cubic-bezier(.4, 0, .2, 1),
            visibility 0s linear .36s;
    }
:where(body[data-page="auth"]) .ua-brand-copy.is-active {
        position: relative;
        opacity: 1;
        visibility: visible;
        transform: none;
        transition:
            opacity .44s ease .2s,
            transform .52s cubic-bezier(.22, 1, .36, 1) .2s,
            visibility 0s linear 0s;
    }
:where(body[data-page="auth"]) .ua-brand-copy.is-leaving {
        opacity: 0;
        transform: translateY(-12px);
    }
:where(body[data-page="auth"]) .ua-brand-copy.is-active.is-leaving {
        opacity: 1;
        visibility: visible;
        transform: none;
    }
:where(body[data-page="auth"]) .ua-brand-title {
        position: relative;
        font-size: 25px;
        line-height: 1.3;
        font-weight: 800;
        letter-spacing: .01em;
    }
:where(body[data-page="auth"]) .ua-brand-sub {
        position: relative;
        margin-top: 10px;
        font-size: 13px;
        line-height: 1.8;
        color: rgba(255, 255, 255, .82);
    }
:where(body[data-page="auth"]) .ua-brand-list {
        position: relative;
        list-style: none;
        margin: 22px 0 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 12px;
    }
:where(body[data-page="auth"]) .ua-brand-list li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        font-size: 13px;
        line-height: 1.6;
        color: rgba(255, 255, 255, .92);
    }
:where(body[data-page="auth"]) .ua-brand-list li svg {
        flex: 0 0 auto;
        width: 16px;
        height: 16px;
        margin-top: 2.5px;
        opacity: .92;
    }
:where(body[data-page="auth"]) .ua-brand-steps {
        position: relative;
        list-style: none;
        counter-reset: ua-step;
        margin: 22px 0 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 13px;
    }
:where(body[data-page="auth"]) .ua-brand-steps li {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        font-size: 13px;
        line-height: 1.6;
        color: rgba(255, 255, 255, .92);
    }
:where(body[data-page="auth"]) .ua-brand-steps li::before {
        counter-increment: ua-step;
        content: counter(ua-step);
        flex: 0 0 auto;
        width: 22px;
        height: 22px;
        margin-top: 1px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        border: 1px solid rgba(255, 255, 255, .42);
        background: rgba(255, 255, 255, .16);
        font-size: 12px;
        font-weight: 700;
    }
:where(body[data-page="auth"]) .ua-brand-steps b {
        font-weight: 700;
    }
:where(body[data-page="auth"]) .ua-brand-foot {
        position: relative;
        margin-top: auto;
        padding-top: 18px;
        font-size: 12px;
        letter-spacing: .02em;
        color: rgba(255, 255, 255, .6);
    }
:where(body[data-page="auth"]) .ua-scene-wrap {
        position: relative;
        margin-top: auto;
        padding-top: 20px;
        height: calc(374px * var(--ua-scene-scale, .75) + 20px);
        display: flex;
        align-items: flex-end;
        justify-content: center;
    }
:where(body[data-page="auth"]) .ua-scene-glow {
        position: absolute;
        left: 50%;
        bottom: -6%;
        width: 108%;
        height: 78%;
        transform: translateX(-50%);
        background: radial-gradient(closest-side, rgba(255, 255, 255, .2), rgba(255, 255, 255, 0));
        filter: blur(8px);
        pointer-events: none;
    }
:where(body[data-page="auth"]) .ua-scene {
        position: relative;
        width: 480px;
        height: 360px;
        flex: 0 0 auto;
        transform: scale(var(--ua-scene-scale, .75));
        transform-origin: bottom center;
        pointer-events: none;
        -webkit-user-select: none;
        user-select: none;
    }
:where(body[data-page="auth"]) .character {
        position: absolute;
        bottom: 0;
        transition: all .7s ease-in-out;
        transform-origin: bottom center;
        will-change: transform, height;
    }
:where(body[data-page="auth"]) .char-purple {
        left: 60px;
        width: 170px;
        height: 370px;
        background: #6C3FF5;
        border-radius: 10px 10px 0 0;
        z-index: 1;
        box-shadow: 0 32px 64px -28px rgba(3, 9, 26, .62);
    }
:where(body[data-page="auth"]) .char-black {
        left: 220px;
        width: 115px;
        height: 290px;
        background: #23252B;
        border-radius: 8px 8px 0 0;
        z-index: 2;
        box-shadow: 0 26px 52px -26px rgba(3, 9, 26, .62);
    }
:where(body[data-page="auth"]) .char-orange {
        left: 0;
        width: 230px;
        height: 190px;
        background: #FF9B6B;
        border-radius: 115px 115px 0 0;
        z-index: 3;
        box-shadow: 0 22px 44px -24px rgba(3, 9, 26, .55);
    }
:where(body[data-page="auth"]) .char-yellow {
        left: 290px;
        width: 135px;
        height: 215px;
        background: #E8D754;
        border-radius: 68px 68px 0 0;
        z-index: 4;
        box-shadow: 0 22px 44px -24px rgba(3, 9, 26, .55);
    }
:where(body[data-page="auth"]) .eyes {
        position: absolute;
        display: flex;
        transition: all .7s ease-in-out;
    }
:where(body[data-page="auth"]) .eyeball {
        border-radius: 50%;
        background: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: height .15s ease;
        overflow: hidden;
    }
:where(body[data-page="auth"]) .pupil {
        border-radius: 50%;
        background: #2D2D2D;
        transition: transform .1s ease-out;
    }
:where(body[data-page="auth"]) .bare-pupil {
        width: 12px;
        height: 12px;
        border-radius: 50%;
        background: #2D2D2D;
        transition: transform .7s ease-in-out;
    }
:where(body[data-page="auth"]) .yellow-mouth {
        position: absolute;
        width: 50px;
        height: 4px;
        background: #2D2D2D;
        border-radius: 2px;
        transition: all .7s ease-in-out;
    }
:where(body[data-page="auth"]) .orange-mouth {
        position: absolute;
        width: 28px;
        height: 14px;
        border: 3px solid #2D2D2D;
        border-top: none;
        border-radius: 0 0 14px 14px;
        opacity: 0;
        transition: all .7s ease-in-out;
    }
:where(body[data-page="auth"]) .orange-mouth.visible {
        opacity: 1;
    }
@keyframes ua-shake-head {
        0%, 100% { translate: 0 0; }
        10% { translate: -9px 0; }
        20% { translate: 7px 0; }
        30% { translate: -6px 0; }
        40% { translate: 5px 0; }
        50% { translate: -4px 0; }
        60% { translate: 3px 0; }
        70% { translate: -2px 0; }
        80% { translate: 1px 0; }
        90% { translate: -.5px 0; }
    }
:where(body[data-page="auth"]) .eyes.ua-shake-head, :where(body[data-page="auth"]) .yellow-mouth.ua-shake-head, :where(body[data-page="auth"]) .orange-mouth.ua-shake-head {
        animation: ua-shake-head .8s cubic-bezier(.36, .07, .19, .97) both;
    }
:where(body[data-page="auth"]) .ua-form {
        padding: 30px 40px 34px;
        background: var(--uc-surface, #fff);
    }
:where(body[data-page="auth"]) .ua-tabs {
        position: relative;
        display: flex;
        gap: 4px;
        padding: 4px;
        border-radius: 12px;
        background: var(--uc-surface-3, #f3f4f6);
    }
:where(body[data-page="auth"]) .ua-tabs-pill {
        position: absolute;
        top: 4px;
        bottom: 4px;
        left: 0;
        width: 0;
        border-radius: 9px;
        background: var(--uc-surface, #fff);
        pointer-events: none;
        transition:
            transform .5s cubic-bezier(.22, 1, .36, 1),
            width .5s cubic-bezier(.22, 1, .36, 1);
    }
:where(body[data-page="auth"]) .ua-tab {
        position: relative;
        z-index: 1;
        flex: 1 1 0;
        padding: 9px 6px;
        border: 0;
        border-radius: 9px;
        background: transparent;
        font-family: inherit;
        font-size: 13.5px;
        font-weight: 600;
        color: var(--uc-muted, #6b7280);
        cursor: pointer;
        transition: color .3s cubic-bezier(.22, 1, .36, 1);
    }
:where(body[data-page="auth"]) .ua-tab.is-active {
        color: var(--uc-primary, #2563eb);
    }
:where(body[data-page="auth"]) .ua-tab:hover {
        color: var(--uc-primary, #2563eb);
    }
:where(body[data-page="auth"]) .ua-tab:focus-visible {
        outline: 2px solid var(--uc-primary, #2563eb);
        outline-offset: 2px;
    }
:where(body[data-page="auth"]) .ua-panels {
        position: relative;
        margin-top: 24px;
        
        transition: height .55s cubic-bezier(.22, 1, .36, 1) .08s;
    }
:where(body[data-page="auth"]) .ua-panel {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        opacity: 0;
        visibility: hidden;
        transform: translateY(14px);
        
        transition:
            opacity .28s ease,
            transform .34s cubic-bezier(.4, 0, .2, 1),
            visibility 0s linear .36s;
    }
:where(body[data-page="auth"]) .ua-panel.is-active {
        position: relative;
        opacity: 1;
        visibility: visible;
        transform: none;
        
        transition:
            opacity .44s ease .2s,
            transform .52s cubic-bezier(.22, 1, .36, 1) .2s,
            visibility 0s linear 0s;
    }
:where(body[data-page="auth"]) .ua-panel.is-leaving {
        opacity: 0;
        transform: translateY(-12px);
    }
:where(body[data-page="auth"]) .ua-panel.is-active.is-leaving {
        opacity: 1;
        visibility: visible;
        transform: none;
    }
:where(body[data-page="auth"]) .ua-title {
        font-size: 22px;
        line-height: 1.35;
        font-weight: 800;
        color: var(--uc-text-strong, #111827);
        letter-spacing: .01em;
    }
:where(body[data-page="auth"]) .ua-sub {
        margin-top: 8px;
        font-size: 13px;
        line-height: 1.6;
        color: var(--uc-muted, #6b7280);
    }
:where(body[data-page="auth"]) .ua-sub a {
        color: var(--brand);
        font-weight: 600;
        text-decoration: none;
    }
:where(body[data-page="auth"]) .ua-sub a:hover {
        color: var(--brand-dark);
        text-decoration: underline;
    }
:where(body[data-page="auth"]) .ua-fields {
        margin-top: 22px;
        display: flex;
        flex-direction: column;
        gap: 15px;
    }
:where(body[data-page="auth"]) .ua-fields .uc-field + .uc-field {
        margin-top: 0;
    }
/* user_center.css 的 .uc-field 会覆盖 Tailwind 的 .hidden，这里显式兜底 */
:where(body[data-page="auth"]) .ua-login-captcha.hidden {
        display: none;
    }
:where(body[data-page="auth"]) .ua-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
    }
:where(body[data-page="auth"]) .ua-check {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 13px;
        line-height: 1.6;
        color: var(--uc-text, #374151);
        cursor: pointer;
        user-select: none;
    }
:where(body[data-page="auth"]) .ua-check input {
        width: 15px;
        height: 15px;
        margin: 0;
        accent-color: var(--uc-primary, #2563eb);
        cursor: pointer;
    }
:where(body[data-page="auth"]) .ua-check a {
        color: var(--brand);
        font-weight: 600;
        text-decoration: none;
    }
:where(body[data-page="auth"]) .ua-check a:hover {
        text-decoration: underline;
    }
:where(body[data-page="auth"]) .ua-link {
        font-size: 13px;
        font-weight: 600;
        color: var(--brand);
        text-decoration: none;
        white-space: nowrap;
    }
:where(body[data-page="auth"]) .ua-link:hover {
        color: var(--brand-dark);
        text-decoration: underline;
    }
:where(body[data-page="auth"]) .ua-code-row {
        display: flex;
        align-items: center;
        gap: 10px;
    }
:where(body[data-page="auth"]) .ua-code-row .uc-input {
        flex: 1 1 auto;
        min-width: 0;
    }
:where(body[data-page="auth"]) .ua-code-btn {
        flex: 0 0 auto;
    }
:where(body[data-page="auth"]) .ua-pwd {
        position: relative;
    }
:where(body[data-page="auth"]) .ua-pwd .uc-input {
        padding-right: 42px;
    }
:where(body[data-page="auth"]) .ua-pwd-toggle {
        position: absolute;
        right: 6px;
        top: 50%;
        transform: translateY(-50%);
        width: 30px;
        height: 30px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 0;
        border-radius: 7px;
        background: transparent;
        color: var(--uc-faint, #9ca3af);
        cursor: pointer;
        transition: background .15s ease, color .15s ease;
    }
:where(body[data-page="auth"]) .ua-pwd-toggle:hover {
        background: var(--uc-surface-3, #f3f4f6);
        color: var(--uc-text, #374151);
    }
:where(body[data-page="auth"]) .ua-pwd-toggle svg {
        width: 16px;
        height: 16px;
    }
:where(body[data-page="auth"]) .ua-pwd-toggle .ua-eye-off {
        display: none;
    }
:where(body[data-page="auth"]) .ua-pwd-toggle.is-visible .ua-eye-on {
        display: none;
    }
:where(body[data-page="auth"]) .ua-pwd-toggle.is-visible .ua-eye-off {
        display: block;
    }
:where(body[data-page="auth"]) .ua-error {
        font-size: 12.5px;
        line-height: 1.6;
        color: #dc2626;
    }
:where(body[data-page="auth"]) .uc-input.is-error {
        border-color: #dc2626;
    }
:where(body[data-page="auth"]) .uc-input.is-error:focus {
        border-color: #dc2626;
        box-shadow: 0 0 0 3px rgba(220, 38, 38, .15);
    }
:where(body[data-page="auth"]) .uc-field .ua-error:not(.hidden), :where(body[data-page="auth"]) .ua-check + .ua-error:not(.hidden) {
        margin-top: 7px;
    }
:where(body[data-page="auth"]) .ua-form-msg {
        font-size: 13px;
        line-height: 1.7;
        text-align: center;
        color: #dc2626;
    }
:where(body[data-page="auth"]) .ua-form-msg.is-success {
        color: #15803d;
    }
:where(body[data-page="auth"]) .ua-submit {
        width: 100%;
        padding: 12px 18px;
        font-size: 14px;
    }
:where(body[data-page="auth"]) .uc-btn:disabled {
        opacity: .6;
        cursor: not-allowed;
        pointer-events: none;
        box-shadow: none;
    }
:where(body[data-page="auth"]) .ua-spin {
        flex: 0 0 auto;
        width: 15px;
        height: 15px;
        border-radius: 50%;
        border: 2px solid rgba(255, 255, 255, .42);
        border-top-color: #fff;
        animation: ua-spin .7s linear infinite;
    }
@keyframes ua-spin {
        to {
            transform: rotate(360deg);
        }
    }
:where(body[data-page="auth"]) .ua-note {
        margin-top: 22px;
        display: flex;
        align-items: flex-start;
        gap: 8px;
        padding: 11px 13px;
        border: 1px solid var(--uc-border, #eef0f4);
        border-radius: var(--uc-radius, 6px);
        background: var(--uc-surface-2, #f9fafb);
        font-size: 12.5px;
        line-height: 1.7;
        color: var(--uc-muted, #6b7280);
    }
:where(body[data-page="auth"]) .ua-note svg {
        flex: 0 0 auto;
        width: 15px;
        height: 15px;
        margin-top: 2px;
        color: var(--uc-faint, #9ca3af);
    }
:where(body[data-page="auth"]) .ua-modal {
        position: fixed;
        inset: 0;
        z-index: 90;
        display: none;
        align-items: center;
        justify-content: center;
        padding: 24px;
        background: rgba(15, 23, 42, .52);
        -webkit-backdrop-filter: blur(3px);
        backdrop-filter: blur(3px);
    }
:where(body[data-page="auth"]) .ua-modal.is-open {
        display: flex;
    }
:where(body[data-page="auth"]) .ua-modal-panel {
        width: 100%;
        max-width: 432px;
        padding: 20px 22px 22px;
        border: 1px solid var(--uc-border, #eef0f4);
        border-radius: var(--uc-radius-lg, 10px);
        background: var(--uc-surface, #fff);
        box-shadow: 0 34px 80px -26px rgba(15, 23, 42, .45);
        animation: ua-pop .18s ease-out;
    }
@keyframes ua-pop {
        from {
            opacity: 0;
            transform: translateY(10px) scale(.985);
        }

        to {
            opacity: 1;
            transform: none;
        }
    }
:where(body[data-page="auth"]) .ua-modal-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding-bottom: 13px;
        border-bottom: 1px solid var(--uc-border, #eef0f4);
    }
:where(body[data-page="auth"]) .ua-modal-title {
        font-size: 15px;
        font-weight: 700;
        color: var(--uc-text-strong, #111827);
    }
:where(body[data-page="auth"]) .ua-modal-close {
        width: 30px;
        height: 30px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 0;
        border-radius: 7px;
        background: transparent;
        color: var(--uc-faint, #9ca3af);
        cursor: pointer;
        transition: background .15s ease, color .15s ease;
    }
:where(body[data-page="auth"]) .ua-modal-close:hover {
        background: var(--uc-surface-3, #f3f4f6);
        color: var(--uc-text, #374151);
    }
:where(body[data-page="auth"]) .ua-modal-close svg {
        width: 17px;
        height: 17px;
    }
:where(body[data-page="auth"]) .ua-modal-desc {
        margin-top: 14px;
        font-size: 13px;
        line-height: 1.7;
        color: var(--uc-muted, #6b7280);
    }
:where(body[data-page="auth"]) .ua-captcha-row {
        margin-top: 10px;
        display: flex;
        align-items: center;
        gap: 10px;
    }
:where(body[data-page="auth"]) .ua-captcha-row .uc-input {
        flex: 1 1 auto;
        min-width: 0;
    }
:where(body[data-page="auth"]) .ua-captcha-img {
        flex: 0 0 auto;
        height: 40px;
        width: auto;
        border: 1px solid var(--uc-border-strong, #e5e7eb);
        border-radius: var(--uc-radius, 6px);
        background: var(--uc-surface-2, #f9fafb);
        cursor: pointer;
    }
:where(body[data-page="auth"]) .ua-captcha-row + .ua-error {
        margin-top: 8px;
    }
:where(body[data-page="auth"]) .ua-modal-foot {
        margin-top: 20px;
        display: flex;
        justify-content: flex-end;
        gap: 10px;
    }
html[data-uc-theme="dark"] :where(body[data-page="auth"]) .ua-shell::before {
        opacity: .55;
    }
html[data-uc-theme="dark"] :where(body[data-page="auth"]) .ua-card {
        border-color: var(--uc-border);
        box-shadow: 0 26px 60px -24px rgba(0, 0, 0, .6);
    }
html[data-uc-theme="dark"] :where(body[data-page="auth"]) .ua-brand {
        background: linear-gradient(158deg,
            color-mix(in srgb, var(--uc-primary, #2563eb) 26%, #0d1524) -18%,
            color-mix(in srgb, var(--uc-primary, #2563eb) 17%, #0b1220) 46%,
            #080e19 108%);
        color: rgba(255, 255, 255, .9);
    }
html[data-uc-theme="dark"] :where(body[data-page="auth"]) .ua-brand::before {
        background: radial-gradient(circle, rgba(122, 162, 255, .12), rgba(122, 162, 255, 0) 64%);
    }
html[data-uc-theme="dark"] :where(body[data-page="auth"]) .ua-brand::after {
        background: radial-gradient(circle, rgba(122, 162, 255, .07), rgba(122, 162, 255, 0) 66%);
    }
html[data-uc-theme="dark"] :where(body[data-page="auth"]) .ua-brand-slogan { color: rgba(255, 255, 255, .6); }
html[data-uc-theme="dark"] :where(body[data-page="auth"]) .ua-brand-sub { color: rgba(255, 255, 255, .7); }
html[data-uc-theme="dark"] :where(body[data-page="auth"]) .ua-brand-list li, html[data-uc-theme="dark"] :where(body[data-page="auth"]) .ua-brand-steps li { color: rgba(255, 255, 255, .84); }
html[data-uc-theme="dark"] :where(body[data-page="auth"]) .ua-brand-steps li::before {
        border-color: rgba(255, 255, 255, .24);
        background: rgba(255, 255, 255, .07);
    }
html[data-uc-theme="dark"] :where(body[data-page="auth"]) .ua-brand-foot { color: rgba(255, 255, 255, .42); }
html[data-uc-theme="dark"] :where(body[data-page="auth"]) .ua-brand-logo {
        background: rgba(255, 255, 255, .9);
        box-shadow: 0 8px 18px -8px rgba(0, 0, 0, .6);
    }
html[data-uc-theme="dark"] :where(body[data-page="auth"]) .ua-scene-glow {
        background: radial-gradient(closest-side, rgba(122, 162, 255, .12), rgba(122, 162, 255, 0));
    }
html[data-uc-theme="dark"] :where(body[data-page="auth"]) .ua-spin {
        border-color: rgba(255, 255, 255, .35);
        border-top-color: #fff;
    }
html[data-uc-theme="dark"] :where(body[data-page="auth"]) .ua-tabs {
        background: var(--uc-surface-2);
    }
html[data-uc-theme="dark"] :where(body[data-page="auth"]) .ua-tabs-pill {
        background: var(--uc-surface-3);
    }
@media (prefers-reduced-motion: reduce) {
:where(body[data-page="auth"]) .ua-panel, :where(body[data-page="auth"]) .ua-brand-copy, :where(body[data-page="auth"]) .ua-tabs-pill, :where(body[data-page="auth"]) .ua-panels, :where(body[data-page="auth"]) .ua-brand-copys {
            transition: none !important;
        }
:where(body[data-page="auth"]) .character, :where(body[data-page="auth"]) .eyes, :where(body[data-page="auth"]) .pupil, :where(body[data-page="auth"]) .bare-pupil, :where(body[data-page="auth"]) .yellow-mouth, :where(body[data-page="auth"]) .orange-mouth {
            transition: none !important;
        }
}
/* ==================================================================
 * 论坛公共样式
 * ================================================================== */
:where(body[data-page^="forum-"]) .fh-wrap {
        max-width: 1280px;
        margin: 0 auto;
        padding: 28px 32px 56px;
    }
:where(body[data-page^="forum-"]) .fh-top {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 20px;
    }
:where(body[data-page^="forum-"]) .fh-brand {
        display: flex;
        align-items: center;
        gap: 12px;
        min-width: 0;
    }
:where(body[data-page^="forum-"]) .fh-brand-logo {
        width: 42px;
        height: 42px;
        border-radius: 5px;
        background: linear-gradient(135deg, var(--brand) 0%, var(--brand-dark) 100%);
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: 0 10px 22px var(--brand-shadow);
        flex-shrink: 0;
    }
:where(body[data-page^="forum-"]) .fh-brand-logo svg {
        width: 22px;
        height: 22px;
    }
:where(body[data-page^="forum-"]) .fh-brand-name {
        font-size: 20px;
        line-height: 1.2;
        font-weight: 800;
        letter-spacing: -0.01em;
        color: #0f172a;
    }
:where(body[data-page^="forum-"]) .fh-brand-stats {
        margin-top: 6px;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 4px 14px;
        font-size: 12px;
        color: #94a3b8;
    }
:where(body[data-page^="forum-"]) .fh-brand-stats b {
        margin-left: 4px;
        font-size: 13px;
        font-weight: 800;
        color: #334155;
    }
:where(body[data-page^="forum-"]) .fh-top-actions {
        display: flex;
        align-items: center;
        gap: 10px;
        flex-wrap: wrap;
    }
:where(body[data-page^="forum-"]) .fh-search {
        position: relative;
        display: flex;
        align-items: center;
    }
:where(body[data-page^="forum-"]) .fh-search > i, :where(body[data-page^="forum-"]) .fh-search > svg {
        position: absolute;
        left: 12px;
        top: 50%;
        transform: translateY(-50%);
        width: 16px;
        height: 16px;
        color: #94a3b8;
        pointer-events: none;
    }
:where(body[data-page^="forum-"]) .fh-search input {
        width: 208px;
        height: 38px;
        border-radius: 5px;
        border: 1px solid #e6e9ef;
        background: #fff;
        padding: 0 16px 0 36px;
        font-size: 13px;
        color: #0f172a;
        outline: none;
        transition: border-color 0.2s ease, box-shadow 0.2s ease;
    }
:where(body[data-page^="forum-"]) .fh-search input:focus {
        border-color: var(--brand-border);
        box-shadow: 0 0 0 3px var(--brand-soft);
    }
:where(body[data-page^="forum-"]) .fh-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        height: 38px;
        padding: 0 16px;
        border-radius: 5px;
        font-size: 13px;
        font-weight: 700;
        white-space: nowrap;
        transition: all 0.2s ease;
    }
:where(body[data-page^="forum-"]) .fh-btn-primary {
        background: linear-gradient(135deg, var(--brand) 0%, var(--brand-dark) 100%);
        color: #fff;
        box-shadow: 0 10px 22px var(--brand-shadow);
    }
:where(body[data-page^="forum-"]) .fh-btn-primary:hover {
        transform: translateY(-1px);
        box-shadow: 0 14px 26px var(--brand-shadow);
    }
:where(body[data-page^="forum-"]) .fh-btn-ghost {
        background: #f3f5f9;
        color: #475569;
    }
:where(body[data-page^="forum-"]) .fh-btn-ghost:hover {
        background: var(--brand-soft-3);
        color: var(--brand);
    }
:where(body[data-page^="forum-"]) .fh-chips {
        margin-top: 20px;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 8px;
    }
:where(body[data-page^="forum-"]) .fh-chip {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        height: 30px;
        padding: 0 13px;
        border-radius: 5px;
        border: 1px solid #e9edf3;
        background: #fff;
        color: #475569;
        font-size: 13px;
        font-weight: 600;
        transition: all 0.18s ease;
    }
:where(body[data-page^="forum-"]) .fh-chip:hover {
        border-color: var(--brand-border);
        background: var(--brand-soft-3);
        color: var(--brand);
    }
:where(body[data-page^="forum-"]) .fh-chip.is-active {
        border-color: var(--brand);
        background: var(--brand);
        color: #fff;
    }
:where(body[data-page^="forum-"]) .fh-chip em {
        font-style: normal;
        font-size: 11px;
        opacity: 0.6;
    }
:where(body[data-page^="forum-"]) .fh-chip-icon {
        width: 14px;
        height: 14px;
        flex-shrink: 0;
    }
:where(body[data-page^="forum-"]) .fh-chip.is-active .fh-chip-icon {
        color: #fff !important;
    }
:where(body[data-page^="forum-"]) .fh-layout {
        margin-top: 18px;
        display: grid;
        grid-template-columns: minmax(0, 1fr) 300px;
        gap: 24px;
        align-items: start;
    }
:where(body[data-page^="forum-"]) .fh-list {
        border-radius: 5px;
        border: 1px solid #eaedf2;
        background: #fff;
        overflow: hidden;
        box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
    }
:where(body[data-page^="forum-"]) .fh-list-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        padding: 13px 18px;
        border-bottom: 1px solid #eef2f7;
    }
:where(body[data-page^="forum-"]) .fh-list-count {
        font-size: 12px;
        font-weight: 600;
        color: #94a3b8;
    }
:where(body[data-page^="forum-"]) .fh-topic {
        display: flex;
        gap: 14px;
        padding: 15px 18px;
        border-bottom: 1px solid #f1f5f9;
        transition: background 0.18s ease;
    }
:where(body[data-page^="forum-"]) .fh-topic:last-child {
        border-bottom: 0;
    }
:where(body[data-page^="forum-"]) .fh-topic:hover {
        background: #f8fafd;
    }
:where(body[data-page^="forum-"]) .fh-topic-avatar {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        overflow: hidden;
        background: #eef2f7;
        color: var(--brand);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 14px;
        font-weight: 800;
        flex-shrink: 0;
    }
:where(body[data-page^="forum-"]) .fh-topic-avatar img {
        width: 40px;
        height: 40px;
        object-fit: cover;
        display: block;
    }
:where(body[data-page^="forum-"]) .fh-topic-main {
        flex: 1;
        min-width: 0;
    }
:where(body[data-page^="forum-"]) .fh-topic-title {
        display: block;
        font-size: 15px;
        line-height: 1.5;
        font-weight: 700;
        color: #1e293b;
        word-break: break-word;
        transition: color 0.18s ease;
    }
:where(body[data-page^="forum-"]) .fh-topic:hover .fh-topic-title {
        color: var(--brand);
    }
:where(body[data-page^="forum-"]) .fh-topic-title.is-top, :where(body[data-page^="forum-"]) .fh-topic:hover .fh-topic-title.is-top {
        color: var(--brand);
    }
:where(body[data-page^="forum-"]) .fh-topic-summary {
        display: -webkit-box;
        margin-top: 4px;
        font-size: 12.5px;
        line-height: 1.6;
        color: #94a3b8;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
:where(body[data-page^="forum-"]) .fh-topic-meta {
        margin-top: 8px;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 8px;
        font-size: 12px;
        color: #94a3b8;
    }
:where(body[data-page^="forum-"]) .fh-topic-tag {
        display: inline-flex;
        align-items: center;
        height: 20px;
        padding: 0 8px;
        border-radius: 5px;
        background: var(--brand-soft);
        color: var(--brand);
        font-size: 11px;
        font-weight: 700;
    }
:where(body[data-page^="forum-"]) .fh-topic-tag.is-top {
        background: #fee2e2;
        color: #dc2626;
    }
:where(body[data-page^="forum-"]) .fh-top-flag {
        display: inline-block;
        height: 18px;
        margin-left: 7px;
        padding: 0 6px;
        border-radius: 5px;
        background: #dc2626;
        color: #ffffff;
        font-size: 11px;
        font-weight: 700;
        line-height: 18px;
        vertical-align: middle;
        white-space: nowrap;
        letter-spacing: 0;
    }
:where(body[data-page^="forum-"]) .fh-topic-tag.is-hot {
        background: #ffedd5;
        color: #ea580c;
    }
:where(body[data-page^="forum-"]) .fh-topic-tag.is-plain {
        background: #f1f5f9;
        color: #64748b;
    }
:where(body[data-page^="forum-"]) .fh-topic-stats {
        margin-left: auto;
        display: flex;
        align-items: center;
        gap: 16px;
        flex-shrink: 0;
        font-size: 12px;
        color: #94a3b8;
    }
:where(body[data-page^="forum-"]) .fh-topic-stat {
        display: inline-flex;
        align-items: center;
        justify-content: flex-end;
        gap: 4px;
        min-width: 44px;
    }
:where(body[data-page^="forum-"]) .fh-topic-time {
        min-width: 64px;
        color: #b0b8c4;
    }
:where(body[data-page^="forum-"]) .fh-pagination {
        padding: 18px;
        border-top: 1px solid #f1f5f9;
    }
:where(body[data-page^="forum-"]) .fh-empty {
        padding: 56px 24px;
        text-align: center;
        font-size: 14px;
        color: #94a3b8;
    }
:where(body[data-page^="forum-"]) .fh-side {
        display: flex;
        flex-direction: column;
        gap: 18px;
    }
:where(body[data-page^="forum-"]) .fh-card {
        border-radius: 5px;
        border: 1px solid #eaedf2;
        background: #fff;
        overflow: hidden;
        box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
    }
:where(body[data-page^="forum-"]) .fh-card-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        padding: 13px 16px;
        border-bottom: 1px solid #f1f5f9;
    }
:where(body[data-page^="forum-"]) .fh-card-title {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        font-size: 14px;
        font-weight: 800;
        color: #0f172a;
    }
:where(body[data-page^="forum-"]) .fh-card-title i {
        color: var(--brand);
    }
:where(body[data-page^="forum-"]) .fh-card-more {
        font-size: 12px;
        font-weight: 700;
        color: var(--brand);
    }
:where(body[data-page^="forum-"]) .fh-card-body {
        padding: 8px 10px 12px;
    }
:where(body[data-page^="forum-"]) .fh-me {
        overflow: hidden;
    }
:where(body[data-page^="forum-"]) .fh-me-top {
        padding: 14px;
        background: linear-gradient(135deg, var(--brand-soft-3) 0%, var(--brand-soft) 100%);
        border-bottom: 1px solid #eef2f7;
    }
:where(body[data-page^="forum-"]) .fh-me-head {
        display: flex;
        align-items: center;
        gap: 10px;
    }
:where(body[data-page^="forum-"]) .fh-me-avatar {
        width: 42px;
        height: 42px;
        border-radius: 50%;
        overflow: hidden;
        background: #e2e8f0;
        color: var(--brand);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 15px;
        font-weight: 800;
        flex-shrink: 0;
        box-shadow: 0 0 0 2px #ffffff, 0 6px 16px rgba(15, 23, 42, 0.10);
    }
:where(body[data-page^="forum-"]) .fh-me-avatar img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }
:where(body[data-page^="forum-"]) .fh-me-info {
        min-width: 0;
        flex: 1;
    }
:where(body[data-page^="forum-"]) .fh-me-name-row {
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
        gap: 6px;
        min-width: 0;
        overflow: hidden;
    }
:where(body[data-page^="forum-"]) .fh-me-name {
        flex: 1 1 auto;
        min-width: 0;
        font-size: 14px;
        line-height: 1.35;
        font-weight: 800;
        color: #0f172a;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
:where(body[data-page^="forum-"]) .fh-me-badges {
        flex: 0 0 auto;
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        gap: 4px;
    }
:where(body[data-page^="forum-"]) .fh-me-badges .forum-user-badge {
        padding: 1px 5px;
        border-radius: 4px;
        font-size: 10px;
        line-height: 1.5;
        white-space: nowrap;
    }
:where(body[data-page^="forum-"]) .fh-me-uid {
        display: block;
        margin-top: 3px;
        font-size: 11px;
        color: #94a3b8;
    }
:where(body[data-page^="forum-"]) .fh-me-stats {
        display: grid;
        grid-template-columns: 1fr 1fr;
        padding: 13px 16px;
        border-bottom: 1px solid #f1f5f9;
    }
:where(body[data-page^="forum-"]) .fh-me-stat {
        display: block;
        text-align: center;
        color: inherit;
        transition: opacity 0.18s ease;
    }
:where(body[data-page^="forum-"]) .fh-me-stat:hover {
        opacity: 0.72;
    }
:where(body[data-page^="forum-"]) .fh-me-stat + .fh-me-stat {
        border-left: 1px solid #eef2f7;
    }
:where(body[data-page^="forum-"]) .fh-me-stat b {
        display: block;
        font-size: 19px;
        line-height: 1.1;
        font-weight: 800;
        letter-spacing: -0.02em;
        color: #0f172a;
    }
:where(body[data-page^="forum-"]) .fh-me-stat span {
        display: block;
        margin-top: 5px;
        font-size: 11px;
        font-weight: 700;
        color: #94a3b8;
    }
:where(body[data-page^="forum-"]) .fh-me-profile {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 5px;
        height: 34px;
        margin: 12px 16px 0;
        border-radius: 5px;
        background: var(--brand-soft-3);
        color: var(--brand);
        font-size: 12px;
        font-weight: 700;
        transition: all 0.18s ease;
    }
:where(body[data-page^="forum-"]) .fh-me-profile:hover {
        background: var(--brand);
        color: #fff;
    }
:where(body[data-page^="forum-"]) .fh-me-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
        padding: 12px 16px;
    }
:where(body[data-page^="forum-"]) .fh-me-actions a {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 5px;
        height: 34px;
        border-radius: 5px;
        background: #f3f5f9;
        color: #475569;
        font-size: 12px;
        font-weight: 700;
        transition: all 0.18s ease;
    }
:where(body[data-page^="forum-"]) .fh-me-actions a:hover {
        background: var(--brand-soft-3);
        color: var(--brand);
    }
:where(body[data-page^="forum-"]) .fh-login {
        padding: 18px 16px;
    }
:where(body[data-page^="forum-"]) .fh-login-title {
        font-size: 15px;
        font-weight: 800;
        color: #0f172a;
    }
:where(body[data-page^="forum-"]) .fh-login-sub {
        margin-top: 5px;
        font-size: 12px;
        line-height: 1.6;
        color: #94a3b8;
    }
:where(body[data-page^="forum-"]) .fh-login-actions {
        margin-top: 14px;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }
:where(body[data-page^="forum-"]) .fh-hot {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        padding: 9px 8px;
        border-radius: 5px;
        transition: background 0.18s ease;
    }
:where(body[data-page^="forum-"]) .fh-hot:hover {
        background: var(--brand-soft-3);
    }
:where(body[data-page^="forum-"]) .fh-hot-rank {
        width: 20px;
        height: 20px;
        margin-top: 1px;
        border-radius: 5px;
        background: #f1f5f9;
        color: #94a3b8;
        font-size: 11px;
        font-weight: 800;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }
:where(body[data-page^="forum-"]) .fh-hot:nth-child(1) .fh-hot-rank { background: #fee2e2; color: #dc2626; }
:where(body[data-page^="forum-"]) .fh-hot:nth-child(2) .fh-hot-rank { background: #ffedd5; color: #ea580c; }
:where(body[data-page^="forum-"]) .fh-hot:nth-child(3) .fh-hot-rank { background: #fef3c7; color: #d97706; }
:where(body[data-page^="forum-"]) .fh-hot-main {
        min-width: 0;
        flex: 1;
    }
:where(body[data-page^="forum-"]) .fh-hot-title {
        display: -webkit-box;
        font-size: 13px;
        line-height: 1.5;
        font-weight: 600;
        color: #334155;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
:where(body[data-page^="forum-"]) .fh-hot:hover .fh-hot-title {
        color: var(--brand);
    }
:where(body[data-page^="forum-"]) .fh-hot-meta {
        margin-top: 3px;
        font-size: 11px;
        color: #a5aebb;
    }
:where(body[data-page^="forum-"]) .fh-user {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 8px;
        border-radius: 5px;
        transition: background 0.18s ease;
    }
:where(body[data-page^="forum-"]) .fh-user:hover {
        background: var(--brand-soft-3);
    }
:where(body[data-page^="forum-"]) .fh-user-rank {
        width: 20px;
        text-align: center;
        font-size: 12px;
        font-weight: 800;
        color: #b0b8c4;
        flex-shrink: 0;
    }
:where(body[data-page^="forum-"]) .fh-user-avatar {
        width: 34px;
        height: 34px;
        border-radius: 50%;
        overflow: hidden;
        background: #eef2f7;
        color: var(--brand);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 13px;
        font-weight: 800;
        flex-shrink: 0;
    }
:where(body[data-page^="forum-"]) .fh-user-avatar img {
        width: 34px;
        height: 34px;
        object-fit: cover;
        display: block;
    }
:where(body[data-page^="forum-"]) .fh-user-main {
        min-width: 0;
        flex: 1;
    }
:where(body[data-page^="forum-"]) .fh-user-name {
        font-size: 13px;
        font-weight: 700;
        color: #334155;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
:where(body[data-page^="forum-"]) .fh-user-meta {
        margin-top: 2px;
        font-size: 11px;
        color: #a5aebb;
    }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-brand-name { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-brand-stats { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-brand-stats b { color: var(--uc-text); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-search input {
        background: var(--uc-surface-2);
        border-color: var(--uc-border-strong);
        color: var(--uc-text-strong);
    }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-search input:focus {
        border-color: color-mix(in srgb, var(--uc-primary) 55%, transparent);
        box-shadow: 0 0 0 3px color-mix(in srgb, var(--uc-primary) 14%, transparent);
    }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-search > i, html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-search > svg { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-btn-primary { background: linear-gradient(135deg, var(--uc-primary) 0%, var(--uc-primary-dark) 100%); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-btn-ghost { background: var(--uc-surface-2); color: var(--uc-text); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-btn-ghost:hover { background: var(--uc-primary-soft); color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-chip {
        background: var(--uc-surface);
        border-color: var(--uc-border-strong);
        color: var(--uc-text);
    }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-chip:hover {
        border-color: color-mix(in srgb, var(--uc-primary) 45%, transparent);
        background: var(--uc-surface-2);
        color: var(--uc-primary);
    }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-chip.is-active {
        background: var(--uc-primary);
        border-color: var(--uc-primary);
        color: #fff;
    }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-list {
        background: var(--uc-surface);
        border-color: color-mix(in srgb, var(--uc-border-strong) 60%, transparent);
    }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-list-head { border-bottom-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-list-count { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-topic { border-bottom-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-topic:hover { background: var(--uc-surface-2); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-topic-avatar { background: var(--uc-surface-3); color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-topic-title { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-topic-title.is-top { color: var(--brand); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-topic:hover .fh-topic-title { color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-topic-summary { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-topic-meta { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-topic-tag { background: var(--uc-primary-soft); color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-topic-tag.is-plain { background: var(--uc-surface-3); color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-topic-stats { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-topic-time { color: var(--uc-faint); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-pagination { border-top-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-empty { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-card {
        background: var(--uc-surface);
        border-color: color-mix(in srgb, var(--uc-border-strong) 60%, transparent);
    }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-card-head { border-bottom-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-card-title { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-me-top {
        background: linear-gradient(135deg, var(--uc-surface) 0%, var(--uc-surface-2) 100%);
        border-bottom-color: var(--uc-surface-3);
    }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-me-avatar {
        background: var(--uc-surface-3);
        color: var(--uc-primary);
        box-shadow: 0 0 0 2px var(--uc-surface), 0 6px 16px rgba(0, 0, 0, 0.35);
    }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-me-name { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-me-uid { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-me-stats { border-bottom-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-me-stat + .fh-me-stat { border-left-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-me-stat b { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-me-stat span { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-me-profile { background: var(--uc-surface-2); color: var(--uc-text); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-me-profile:hover { background: var(--uc-primary-soft); color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-me-actions a { background: var(--uc-surface-2); color: var(--uc-text); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-me-actions a:hover { background: var(--uc-primary-soft); color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-login-title { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-login-sub { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-hot:hover, html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-user:hover { background: var(--uc-surface-2); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-hot-rank { background: var(--uc-surface-3); color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-hot-title { color: var(--uc-text); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-hot:hover .fh-hot-title { color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-hot-meta { color: var(--uc-faint); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-user-rank { color: var(--uc-faint); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-user-avatar { background: var(--uc-surface-3); color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-user-name { color: var(--uc-text); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-user-meta { color: var(--uc-faint); }
:where(body[data-page^="forum-"]) .fh-main {
        display: flex;
        flex-direction: column;
        gap: 18px;
        min-width: 0;
    }
:where(body[data-page^="forum-"]) .fh-crumb {
        display: flex;
        align-items: center;
        gap: 8px;
        margin-bottom: 14px;
        font-size: 13px;
        color: #94a3b8;
    }
:where(body[data-page^="forum-"]) .fh-crumb a {
        color: #64748b;
        font-weight: 600;
        transition: color 0.18s ease;
    }
:where(body[data-page^="forum-"]) .fh-crumb a:hover {
        color: var(--brand);
    }
:where(body[data-page^="forum-"]) .fh-crumb-current {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
:where(body[data-page^="forum-"]) .fh-page-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        flex-wrap: wrap;
        padding: 16px 20px;
    }
:where(body[data-page^="forum-"]) .fh-page-head-main {
        display: flex;
        align-items: center;
        gap: 14px;
        min-width: 0;
    }
:where(body[data-page^="forum-"]) .fh-page-head-icon {
        width: 44px;
        height: 44px;
        border-radius: 5px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, var(--brand) 0%, var(--brand-dark) 100%);
        color: #fff;
        box-shadow: 0 10px 22px var(--brand-shadow);
        flex-shrink: 0;
    }
:where(body[data-page^="forum-"]) .fh-page-head-icon svg, :where(body[data-page^="forum-"]) .fh-page-head-icon i {
        width: 22px;
        height: 22px;
    }
:where(body[data-page^="forum-"]) .fh-page-head-title {
        margin: 0;
        font-size: 20px;
        line-height: 1.2;
        font-weight: 800;
        letter-spacing: -0.01em;
        color: #0f172a;
    }
:where(body[data-page^="forum-"]) .fh-page-head-sub {
        margin-top: 5px;
        font-size: 12.5px;
        line-height: 1.6;
        color: #94a3b8;
    }
:where(body[data-page^="forum-"]) .fh-page-head-actions {
        display: flex;
        align-items: center;
        gap: 10px;
        flex-wrap: wrap;
    }
:where(body[data-page^="forum-"]) .fh-btn-sm {
        height: 32px;
        padding: 0 13px;
        font-size: 12.5px;
    }
:where(body[data-page^="forum-"]) .fh-pill {
        display: inline-flex;
        align-items: center;
        height: 20px;
        padding: 0 8px;
        border-radius: 5px;
        background: #f1f5f9;
        color: #64748b;
        font-size: 11px;
        font-weight: 700;
    }
:where(body[data-page^="forum-"]) .fh-pill.is-unread {
        background: var(--brand-soft);
        color: var(--brand);
    }
:where(body[data-page^="forum-"]) .fh-search-form {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 200px auto;
        gap: 14px;
        align-items: end;
        padding: 16px 20px 20px;
    }
:where(body[data-page^="forum-"]) .fh-field {
        min-width: 0;
    }
:where(body[data-page^="forum-"]) .fh-field > label {
        display: block;
        margin-bottom: 8px;
        font-size: 12.5px;
        font-weight: 700;
        color: #475569;
    }
:where(body[data-page^="forum-"]) .fh-field-actions {
        display: flex;
        gap: 10px;
    }
:where(body[data-page^="forum-"]) .fh-search-block {
        position: relative;
        display: flex;
        align-items: center;
        width: 100%;
    }
:where(body[data-page^="forum-"]) .fh-search-block > i, :where(body[data-page^="forum-"]) .fh-search-block > svg {
        position: absolute;
        left: 12px;
        top: 50%;
        transform: translateY(-50%);
        width: 16px;
        height: 16px;
        color: #94a3b8;
        pointer-events: none;
    }
:where(body[data-page^="forum-"]) .fh-search-block input {
        width: 100%;
        height: 40px;
        border-radius: 5px;
        border: 1px solid #e6e9ef;
        background: #fff;
        padding: 0 16px 0 38px;
        font-size: 13.5px;
        color: #0f172a;
        outline: none;
        transition: border-color 0.2s ease, box-shadow 0.2s ease;
    }
:where(body[data-page^="forum-"]) .fh-search-block input:focus {
        border-color: var(--brand-border);
        box-shadow: 0 0 0 3px var(--brand-soft);
    }
:where(body[data-page^="forum-"]) .fh-select {
        width: 100%;
        height: 40px;
        border-radius: 5px;
        border: 1px solid #e6e9ef;
        background: #fff;
        padding: 0 12px;
        font-size: 13.5px;
        color: #0f172a;
        outline: none;
        transition: border-color 0.2s ease, box-shadow 0.2s ease;
    }
:where(body[data-page^="forum-"]) .fh-select:focus {
        border-color: var(--brand-border);
        box-shadow: 0 0 0 3px var(--brand-soft);
    }
@media (max-width: 900px) {
:where(body[data-page^="forum-"]) .fh-search-form {
            grid-template-columns: 1fr;
        }
}
:where(body[data-page^="forum-"]) .fh-notice {
        display: block;
        padding: 14px 18px;
        border-bottom: 1px solid #f1f5f9;
        transition: background 0.18s ease;
    }
:where(body[data-page^="forum-"]) .fh-notice:last-child {
        border-bottom: 0;
    }
:where(body[data-page^="forum-"]) .fh-notice:hover {
        background: #f8fafd;
    }
:where(body[data-page^="forum-"]) .fh-notice.is-static {
        cursor: default;
    }
:where(body[data-page^="forum-"]) .fh-notice.is-static:hover {
        background: transparent;
    }
:where(body[data-page^="forum-"]) .fh-notice.is-static.is-unread:hover {
        background: var(--brand-soft-3);
    }
:where(body[data-page^="forum-"]) .fh-notice.is-unread {
        background: var(--brand-soft-3);
    }
:where(body[data-page^="forum-"]) .fh-notice.is-unread:hover {
        background: var(--brand-soft);
    }
:where(body[data-page^="forum-"]) .fh-notice-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px 12px;
        flex-wrap: wrap;
    }
:where(body[data-page^="forum-"]) .fh-notice-who {
        display: flex;
        align-items: center;
        gap: 7px;
        min-width: 0;
        font-size: 12.5px;
        color: #64748b;
    }
:where(body[data-page^="forum-"]) .fh-notice-who b {
        font-weight: 700;
        color: #334155;
    }
:where(body[data-page^="forum-"]) .fh-notice-type {
        display: inline-flex;
        align-items: center;
        height: 20px;
        padding: 0 8px;
        border-radius: 5px;
        background: var(--brand-soft);
        color: var(--brand);
        font-size: 11px;
        font-weight: 700;
        flex-shrink: 0;
    }
:where(body[data-page^="forum-"]) .fh-notice-side {
        display: flex;
        align-items: center;
        gap: 8px;
        margin-left: auto;
        flex-shrink: 0;
    }
:where(body[data-page^="forum-"]) .fh-notice-time {
        font-size: 12px;
        color: #b0b8c4;
    }
:where(body[data-page^="forum-"]) .fh-notice-content {
        display: block;
        margin-top: 9px;
        padding-left: 11px;
        border-left: 3px solid #e6ebf2;
        font-size: 14px;
        line-height: 1.7;
        font-weight: 500;
        color: #1e293b;
        word-break: break-word;
        white-space: normal;
        overflow: visible;
    }
:where(body[data-page^="forum-"]) .fh-notice.is-unread .fh-notice-content {
        border-left-color: var(--brand-border);
    }
:where(body[data-page^="forum-"]) .fh-notice-source {
        display: flex;
        align-items: center;
        gap: 5px;
        margin-top: 9px;
        font-size: 12px;
        color: #94a3b8;
        transition: color 0.18s ease;
    }
:where(body[data-page^="forum-"]) .fh-notice-source svg, :where(body[data-page^="forum-"]) .fh-notice-source i {
        width: 13px;
        height: 13px;
        flex-shrink: 0;
    }
:where(body[data-page^="forum-"]) .fh-notice-source span {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
:where(body[data-page^="forum-"]) .fh-notice:hover .fh-notice-source {
        color: var(--brand);
    }
:where(body[data-page^="forum-"]) .fh-stats {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
:where(body[data-page^="forum-"]) .fh-stats-item {
        padding: 12px 14px;
        border-bottom: 1px solid #f1f5f9;
    }
:where(body[data-page^="forum-"]) .fh-stats-item:nth-child(odd) {
        border-right: 1px solid #f1f5f9;
    }
:where(body[data-page^="forum-"]) .fh-stats-item:nth-last-child(-n+2) {
        border-bottom: 0;
    }
:where(body[data-page^="forum-"]) .fh-stats-label {
        font-size: 11.5px;
        font-weight: 600;
        color: #94a3b8;
    }
:where(body[data-page^="forum-"]) .fh-stats-value {
        margin-top: 4px;
        font-size: 17px;
        line-height: 1.2;
        font-weight: 800;
        letter-spacing: -0.02em;
        color: #0f172a;
    }
:where(body[data-page^="forum-"]) .fh-flash {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        margin-bottom: 14px;
        padding: 12px 16px;
        border-radius: 5px;
        font-size: 13px;
        font-weight: 600;
        line-height: 1.6;
    }
:where(body[data-page^="forum-"]) .fh-flash.is-success {
        border: 1px solid #bbf7d0;
        background: #f0fdf4;
        color: #15803d;
    }
:where(body[data-page^="forum-"]) .fh-flash.is-error {
        border: 1px solid #fecaca;
        background: #fef2f2;
        color: #b91c1c;
    }
:where(body[data-page^="forum-"]) .fh-mini {
        display: block;
        padding: 9px 10px;
        border-radius: 5px;
        transition: background 0.18s ease;
    }
:where(body[data-page^="forum-"]) .fh-mini:hover {
        background: #f8fafd;
    }
:where(body[data-page^="forum-"]) .fh-mini-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
    }
:where(body[data-page^="forum-"]) .fh-mini-title {
        min-width: 0;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        font-size: 13px;
        font-weight: 700;
        color: #1e293b;
    }
:where(body[data-page^="forum-"]) .fh-mini-post {
        display: block;
        margin-top: 4px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        font-size: 12px;
        color: #94a3b8;
    }
:where(body[data-page^="forum-"]) .fh-mini-time {
        display: block;
        margin-top: 4px;
        font-size: 11.5px;
        color: #b0b8c4;
    }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-crumb { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-crumb a { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-crumb a:hover { color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-page-head-title { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-page-head-sub { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-page-head-icon {
        background: linear-gradient(135deg, var(--uc-primary) 0%, var(--uc-primary-dark) 100%);
        box-shadow: 0 10px 22px rgba(0, 0, 0, 0.35);
    }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-search-block input, html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-select {
        background: var(--uc-surface-2);
        border-color: var(--uc-border-strong);
        color: var(--uc-text);
    }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-search-block input:focus, html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-select:focus {
        border-color: var(--uc-primary);
        box-shadow: 0 0 0 3px var(--uc-primary-soft);
    }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-search-block > i, html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-search-block > svg { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-field > label { color: var(--uc-text); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-notice { border-bottom-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-notice:hover { background: var(--uc-surface-2); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-notice.is-unread { background: var(--uc-primary-soft); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-notice.is-unread:hover {
        background: color-mix(in srgb, var(--uc-primary) 16%, transparent);
    }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-notice.is-static:hover {
        background: transparent;
    }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-notice.is-static.is-unread:hover {
        background: var(--uc-primary-soft);
    }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-notice-who { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-notice-who b { color: var(--uc-text); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-notice-type { background: var(--uc-primary-soft); color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-notice-time { color: var(--uc-faint); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-notice-content {
        border-left-color: var(--uc-surface-3);
        color: var(--uc-text-strong);
    }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-notice.is-unread .fh-notice-content {
        border-left-color: color-mix(in srgb, var(--uc-primary) 45%, transparent);
    }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-notice-source { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-notice:hover .fh-notice-source { color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-stats-item { border-bottom-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-stats-item:nth-child(odd) { border-right-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-stats-label { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-stats-value { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-pill { background: var(--uc-surface-3); color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-pill.is-unread { background: var(--uc-primary-soft); color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-mini:hover { background: var(--uc-surface-2); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-mini-title { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-mini-post { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-mini-time { color: var(--uc-faint); }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-flash.is-success {
        border-color: #14532d;
        background: #0d2818;
        color: #4ade80;
    }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fh-flash.is-error {
        border-color: #7f1d1d;
        background: #2a1212;
        color: #f87171;
    }
/* ==================================================================
 * 论坛禁言提示
 * ================================================================== */
:where(body[data-page^="forum-"]) .fv-mute-notice {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        margin-bottom: 16px;
        padding: 13px 18px;
        border: 1px solid #fcd34d;
        border-radius: 5px;
        background: #fffbeb;
        color: #b45309;
        font-size: 13px;
        font-weight: 600;
        line-height: 1.65;
    }
:where(body[data-page^="forum-"]) .fv-mute-notice svg {
        width: 16px;
        height: 16px;
        flex: none;
        margin-top: 2px;
    }
html[data-uc-theme="dark"] :where(body[data-page^="forum-"]) .fv-mute-notice {
        border-color: #78350f;
        background: #2a1f0b;
        color: #fbbf24;
    }
/* ==================================================================
 * 论坛编辑页
 * ================================================================== */
:where(body[data-page="forum-edit"]) .fe-wrap {
        max-width: 1280px;
        margin: 0 auto;
        padding: 28px 32px 56px;
    }
:where(body[data-page="forum-edit"]) .fe-head {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 16px;
        flex-wrap: wrap;
        margin-bottom: 20px;
    }
:where(body[data-page="forum-edit"]) .fe-title {
        font-size: 24px;
        line-height: 1.3;
        font-weight: 800;
        letter-spacing: -0.01em;
        color: #0f172a;
    }
:where(body[data-page="forum-edit"]) .fe-sub {
        margin-top: 8px;
        font-size: 13px;
        color: #94a3b8;
    }
:where(body[data-page="forum-edit"]) .fe-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        height: 40px;
        padding: 0 18px;
        border-radius: 5px;
        border: 1px solid transparent;
        font-size: 13px;
        font-weight: 700;
        white-space: nowrap;
        cursor: pointer;
        transition: all 0.18s ease;
    }
:where(body[data-page="forum-edit"]) .fe-btn svg, :where(body[data-page="forum-edit"]) .fe-btn i {
        width: 15px;
        height: 15px;
    }
:where(body[data-page="forum-edit"]) .fe-btn-primary {
        background: linear-gradient(135deg, var(--brand) 0%, var(--brand-dark) 100%);
        color: #fff;
        box-shadow: 0 10px 22px var(--brand-shadow);
    }
:where(body[data-page="forum-edit"]) .fe-btn-primary:hover {
        transform: translateY(-1px);
        box-shadow: 0 14px 26px var(--brand-shadow);
    }
:where(body[data-page="forum-edit"]) .fe-btn-ghost {
        border-color: #e6e9ef;
        background: #fff;
        color: #475569;
    }
:where(body[data-page="forum-edit"]) .fe-btn-ghost:hover {
        border-color: var(--brand-border);
        background: var(--brand-soft-3);
        color: var(--brand);
    }
:where(body[data-page="forum-edit"]) .fe-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 400px;
        gap: 24px;
        align-items: start;
    }
:where(body[data-page="forum-edit"]) .fe-main {
        display: flex;
        flex-direction: column;
        gap: 16px;
        min-width: 0;
    }
:where(body[data-page="forum-edit"]) .fe-side {
        position: sticky;
        top: 88px;
    }
:where(body[data-page="forum-edit"]) .fe-card {
        border-radius: 5px;
        border: 1px solid #eaedf2;
        background: #fff;
        box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
    }
:where(body[data-page="forum-edit"]) .fe-card-body {
        padding: 24px 26px;
    }
:where(body[data-page="forum-edit"]) .fe-card-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        padding: 15px 20px;
        border-bottom: 1px solid #f1f5f9;
        font-size: 14px;
        font-weight: 800;
        color: #0f172a;
    }
:where(body[data-page="forum-edit"]) .fe-card-head-tip {
        font-size: 12px;
        font-weight: 500;
        color: #94a3b8;
    }
:where(body[data-page="forum-edit"]) .fe-flash {
        border-radius: 5px;
        border: 1px solid transparent;
        padding: 12px 16px;
        font-size: 13px;
        font-weight: 600;
    }
:where(body[data-page="forum-edit"]) .fe-flash.is-success {
        border-color: #bbf7d0;
        background: #f0fdf4;
        color: #15803d;
    }
:where(body[data-page="forum-edit"]) .fe-flash.is-error {
        border-color: #fecaca;
        background: #fef2f2;
        color: #dc2626;
    }
:where(body[data-page="forum-edit"]) .fe-meta {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px;
        margin-bottom: 20px;
    }
:where(body[data-page="forum-edit"]) .fe-pill {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        height: 26px;
        padding: 0 12px;
        border-radius: 5px;
        font-size: 12px;
        font-weight: 700;
        background: #f1f5f9;
        color: #64748b;
    }
:where(body[data-page="forum-edit"]) .fe-pill svg, :where(body[data-page="forum-edit"]) .fe-pill i {
        width: 13px;
        height: 13px;
    }
:where(body[data-page="forum-edit"]) .fe-pill.is-pending {
        background: #fff7ed;
        color: #ea580c;
    }
:where(body[data-page="forum-edit"]) .fe-pill.is-approved {
        background: #f0fdf4;
        color: #15803d;
    }
:where(body[data-page="forum-edit"]) .fe-pill.is-rejected {
        background: #fef2f2;
        color: #dc2626;
    }
:where(body[data-page="forum-edit"]) .fe-reject {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        margin-bottom: 20px;
        border-radius: 5px;
        border: 1px solid #fecaca;
        background: #fef2f2;
        padding: 12px 16px;
        font-size: 13px;
        line-height: 1.7;
        color: #dc2626;
    }
:where(body[data-page="forum-edit"]) .fe-reject svg, :where(body[data-page="forum-edit"]) .fe-reject i {
        flex-shrink: 0;
        width: 15px;
        height: 15px;
        margin-top: 3px;
    }
:where(body[data-page="forum-edit"]) .fe-field + .fe-field {
        margin-top: 22px;
    }
:where(body[data-page="forum-edit"]) .fe-field-head {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 12px;
    }
:where(body[data-page="forum-edit"]) .fe-label {
        font-size: 14px;
        font-weight: 700;
        color: #0f172a;
    }
:where(body[data-page="forum-edit"]) .fe-hint {
        font-size: 12px;
        color: #94a3b8;
    }
:where(body[data-page="forum-edit"]) .fe-input, :where(body[data-page="forum-edit"]) .fe-textarea {
        display: block;
        width: 100%;
        margin-top: 10px;
        border-radius: 5px;
        border: 1px solid #e6e9ef;
        background: #fff;
        color: #0f172a;
        font-size: 14px;
        outline: none;
        transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
    }
:where(body[data-page="forum-edit"]) .fe-input {
        height: 46px;
        padding: 0 14px;
    }
:where(body[data-page="forum-edit"]) .fe-textarea {
        padding: 14px 16px;
        min-height: 340px;
        line-height: 1.85;
        font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
        font-size: 13.5px;
        resize: vertical;
    }
:where(body[data-page="forum-edit"]) .fe-input::placeholder, :where(body[data-page="forum-edit"]) .fe-textarea::placeholder {
        color: #b6c0cc;
    }
:where(body[data-page="forum-edit"]) .fe-input:focus, :where(body[data-page="forum-edit"]) .fe-textarea:focus {
        border-color: var(--brand-border);
        box-shadow: 0 0 0 3px var(--brand-soft);
    }
:where(body[data-page="forum-edit"]) .fe-attach {
        border: 1px dashed #dbe2ea;
        border-radius: 5px;
        background: #fbfcfe;
        padding: 12px;
        transition: border-color .18s ease, background-color .18s ease;
    }
:where(body[data-page="forum-edit"]) .fe-attach.is-dragover {
        border-color: var(--brand-border);
        background: var(--brand-soft-3);
    }
:where(body[data-page="forum-edit"]) .fe-attach-list {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }
:where(body[data-page="forum-edit"]) .fe-attach-list:empty {
        display: none;
    }
:where(body[data-page="forum-edit"]) .fe-attach-progress {
        display: flex;
        flex-direction: column;
        gap: 8px;
        margin-bottom: 10px;
    }
:where(body[data-page="forum-edit"]) .fe-attach-progress[hidden] {
        display: none;
    }
:where(body[data-page="forum-edit"]) .fe-attach-progress:empty {
        display: none;
    }
:where(body[data-page="forum-edit"]) .fe-attach-item {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 9px 11px;
        border: 1px solid #e8edf4;
        border-radius: 5px;
        background: #fff;
    }
:where(body[data-page="forum-edit"]) .fe-attach-item.is-uploading {
        opacity: .7;
    }
:where(body[data-page="forum-edit"]) .fe-attach-badge {
        flex: 0 0 auto;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        border-radius: 5px;
        font-size: 10px;
        font-weight: 800;
        letter-spacing: .02em;
        text-transform: uppercase;
        color: #fff;
        background: linear-gradient(135deg, #64748b 0%, #475569 100%);
    }
:where(body[data-page="forum-edit"]) .fe-attach-badge.is-ipa {
        background: linear-gradient(135deg, var(--brand) 0%, var(--brand-dark) 100%);
    }
:where(body[data-page="forum-edit"]) .fe-attach-badge.is-zip {
        background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    }
:where(body[data-page="forum-edit"]) .fe-attach-main {
        flex: 1 1 auto;
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: 2px;
    }
:where(body[data-page="forum-edit"]) .fe-attach-name {
        font-size: 13px;
        font-weight: 600;
        color: #1f2937;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
:where(body[data-page="forum-edit"]) .fe-attach-meta {
        font-size: 11.5px;
        color: #94a3b8;
    }
:where(body[data-page="forum-edit"]) .fe-attach-price {
        flex: 0 0 auto;
        display: flex;
        align-items: center;
        gap: 6px;
    }
:where(body[data-page="forum-edit"]) .fe-attach-price-mode {
        height: 28px;
        padding: 0 6px;
        border: 1px solid #dbe3ee;
        border-radius: 5px;
        background: #fff;
        font-size: 12px;
        color: #475569;
    }
:where(body[data-page="forum-edit"]) .fe-attach-price-box {
        display: inline-flex;
        align-items: center;
        gap: 4px;
    }
:where(body[data-page="forum-edit"]) .fe-attach-price-box[hidden] {
        display: none;
    }
:where(body[data-page="forum-edit"]) .fe-attach-price-input {
        width: 72px;
        height: 28px;
        padding: 0 6px;
        border: 1px solid #dbe3ee;
        border-radius: 5px;
        background: #fff;
        font-size: 12px;
        color: #1f2937;
    }
:where(body[data-page="forum-edit"]) .fe-attach-price-unit {
        font-size: 11.5px;
        color: #94a3b8;
    }
:where(body[data-page="forum-edit"]) .fe-attach-remove {
        flex: 0 0 auto;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 28px;
        height: 28px;
        border-radius: 5px;
        border: 0;
        background: transparent;
        color: #94a3b8;
        cursor: pointer;
        transition: all .16s ease;
    }
:where(body[data-page="forum-edit"]) .fe-attach-remove:hover {
        background: #fef2f2;
        color: #dc2626;
    }
:where(body[data-page="forum-edit"]) .fe-attach-remove svg {
        width: 14px;
        height: 14px;
    }
:where(body[data-page="forum-edit"]) .fe-attach-add {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        width: 100%;
        height: 40px;
        margin-top: 10px;
        border: 1px solid #e2e8f0;
        border-radius: 5px;
        background: #fff;
        font-size: 13px;
        font-weight: 600;
        color: #475569;
        cursor: pointer;
        transition: all .18s ease;
    }
:where(body[data-page="forum-edit"]) .fe-attach-add:hover {
        border-color: var(--brand-border);
        background: var(--brand-soft-3);
        color: var(--brand);
    }
:where(body[data-page="forum-edit"]) .fe-attach-add svg {
        width: 15px;
        height: 15px;
    }
:where(body[data-page="forum-edit"]) .fe-attach-add[disabled] {
        cursor: not-allowed;
        opacity: .6;
    }
:where(body[data-page="forum-edit"]) .fe-attach-tip {
        margin-top: 8px;
        font-size: 11.5px;
        color: #94a3b8;
        text-align: center;
    }
:where(body[data-page="forum-edit"]) .fe-md-bar {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 6px 8px;
        margin-top: 10px;
        padding: 7px 12px;
        border-radius: 5px;
        border: 1px solid #eef1f5;
        background: #f8fafc;
    }
:where(body[data-page="forum-edit"]) .fe-md-tools {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 2px;
    }
:where(body[data-page="forum-edit"]) .fe-md-sep {
        width: 1px;
        height: 16px;
        margin: 0 5px;
        background: #e9edf3;
    }
:where(body[data-page="forum-edit"]) .fe-md-btn {
        position: relative;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 30px;
        height: 30px;
        border: 0;
        border-radius: 4px;
        background: transparent;
        color: #64748b;
        cursor: pointer;
        transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
    }
:where(body[data-page="forum-edit"]) .fe-md-btn svg, :where(body[data-page="forum-edit"]) .fe-md-btn i {
        width: 16px;
        height: 16px;
    }
:where(body[data-page="forum-edit"]) .fe-md-btn:hover {
        background: #fff;
        color: var(--brand);
        box-shadow: 0 1px 3px rgba(15, 23, 42, 0.12);
    }
:where(body[data-page="forum-edit"]) .fe-md-btn:focus-visible {
        outline: none;
        background: #fff;
        color: var(--brand);
        box-shadow: 0 0 0 3px var(--brand-soft);
    }
:where(body[data-page="forum-edit"]) .fe-md-btn:active {
        transform: translateY(1px);
    }
:where(body[data-page="forum-edit"]) .fe-md-btn::after {
        content: attr(data-md-name) "\A" attr(data-md-tip);
        position: absolute;
        left: 50%;
        bottom: calc(100% + 9px);
        transform: translate(-50%, 4px);
        padding: 6px 10px;
        border-radius: 5px;
        background: #0f172a;
        color: #e2e8f0;
        font-size: 11px;
        font-weight: 600;
        line-height: 1.55;
        text-align: center;
        white-space: pre;
        box-shadow: 0 8px 20px rgba(15, 23, 42, 0.18);
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.15s ease, transform 0.15s ease;
        z-index: 30;
    }
:where(body[data-page="forum-edit"]) .fe-md-btn::before {
        content: "";
        position: absolute;
        left: 50%;
        bottom: calc(100% + 5px);
        width: 8px;
        height: 8px;
        transform: translate(-50%, 4px) rotate(45deg);
        border-radius: 1px;
        background: #0f172a;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.15s ease, transform 0.15s ease;
        z-index: 30;
    }
:where(body[data-page="forum-edit"]) .fe-md-btn:hover::after, :where(body[data-page="forum-edit"]) .fe-md-btn:hover::before, :where(body[data-page="forum-edit"]) .fe-md-btn:focus-visible::after, :where(body[data-page="forum-edit"]) .fe-md-btn:focus-visible::before {
        opacity: 1;
    }
:where(body[data-page="forum-edit"]) .fe-md-btn:hover::after, :where(body[data-page="forum-edit"]) .fe-md-btn:focus-visible::after {
        transform: translate(-50%, 0);
    }
:where(body[data-page="forum-edit"]) .fe-md-btn:hover::before, :where(body[data-page="forum-edit"]) .fe-md-btn:focus-visible::before {
        transform: translate(-50%, 0) rotate(45deg);
    }
:where(body[data-page="forum-edit"]) .fe-chips {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 12px;
    }
:where(body[data-page="forum-edit"]) .fe-chip {
        position: relative;
        display: inline-flex;
        cursor: pointer;
    }
:where(body[data-page="forum-edit"]) .fe-chip input {
        position: absolute;
        width: 1px;
        height: 1px;
        opacity: 0;
        pointer-events: none;
    }
:where(body[data-page="forum-edit"]) .fe-chip-face {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        height: 34px;
        padding: 0 14px;
        border-radius: 5px;
        border: 1px solid #e6e9ef;
        background: #fff;
        color: #475569;
        font-size: 13px;
        font-weight: 600;
        transition: all 0.18s ease;
    }
:where(body[data-page="forum-edit"]) .fe-chip-face svg, :where(body[data-page="forum-edit"]) .fe-chip-face i {
        width: 15px;
        height: 15px;
        color: var(--fe-c, var(--brand));
        transition: color 0.18s ease;
    }
:where(body[data-page="forum-edit"]) .fe-chip:hover .fe-chip-face {
        border-color: var(--brand-border);
        color: var(--brand);
    }
:where(body[data-page="forum-edit"]) .fe-chip input:checked + .fe-chip-face {
        border-color: var(--brand);
        background: var(--brand);
        color: #fff;
        box-shadow: 0 8px 18px var(--brand-shadow);
    }
:where(body[data-page="forum-edit"]) .fe-chip input:checked + .fe-chip-face svg, :where(body[data-page="forum-edit"]) .fe-chip input:checked + .fe-chip-face i {
        color: #fff;
    }
:where(body[data-page="forum-edit"]) .fe-chip input:focus-visible + .fe-chip-face {
        box-shadow: 0 0 0 3px var(--brand-soft);
    }
:where(body[data-page="forum-edit"]) .fe-tags {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 12px;
    }
:where(body[data-page="forum-edit"]) .fe-tag {
        position: relative;
        display: inline-flex;
        cursor: pointer;
    }
:where(body[data-page="forum-edit"]) .fe-tag input {
        position: absolute;
        width: 1px;
        height: 1px;
        opacity: 0;
        pointer-events: none;
    }
:where(body[data-page="forum-edit"]) .fe-tag-face {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        height: 32px;
        padding: 0 13px;
        border-radius: 5px;
        border: 1px solid #e6e9ef;
        background: #fff;
        color: #475569;
        font-size: 13px;
        font-weight: 600;
        transition: all 0.18s ease;
    }
:where(body[data-page="forum-edit"]) .fe-tag-dot {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: var(--fe-tc, var(--brand));
        transition: background 0.18s ease;
    }
:where(body[data-page="forum-edit"]) .fe-tag:hover .fe-tag-face {
        border-color: var(--fe-tc, var(--brand-border));
        color: var(--fe-tc, var(--brand));
    }
:where(body[data-page="forum-edit"]) .fe-tag input:checked + .fe-tag-face {
        border-color: var(--fe-tc, var(--brand));
        background: color-mix(in srgb, var(--fe-tc, var(--brand)) 12%, transparent);
        color: var(--fe-tc, var(--brand));
    }
:where(body[data-page="forum-edit"]) .fe-tag input:focus-visible + .fe-tag-face {
        box-shadow: 0 0 0 3px var(--brand-soft);
    }
:where(body[data-page="forum-edit"]) .fe-tag.is-locked {
        opacity: 0.4;
        pointer-events: none;
    }
:where(body[data-page="forum-edit"]) .fe-tag-empty {
        font-size: 13px;
        color: #94a3b8;
    }
:where(body[data-page="forum-edit"]) .fe-count {
        font-weight: 700;
        color: var(--brand);
    }
:where(body[data-page="forum-edit"]) .fe-actions {
        margin-top: 26px;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 12px;
        flex-wrap: wrap;
    }
:where(body[data-page="forum-edit"]) .fe-preview-title {
        font-size: 18px;
        font-weight: 800;
        line-height: 1.45;
        color: #0f172a;
        word-break: break-word;
    }
:where(body[data-page="forum-edit"]) .fe-preview-title.is-empty {
        color: #b6c0cc;
        font-weight: 600;
    }
:where(body[data-page="forum-edit"]) .fe-preview-body {
        max-height: calc(100vh - 260px);
        overflow: auto;
        padding: 20px 22px;
    }
:where(body[data-page="forum-edit"]) .fe-preview-divider {
        height: 1px;
        margin: 16px 0;
        background: #f1f5f9;
    }
:where(body[data-page="forum-edit"]) .fe-preview-content {
        font-size: 14px;
        line-height: 1.8;
        color: #334155;
        word-break: break-word;
    }
:where(body[data-page="forum-edit"]) .fe-preview-content.is-empty {
        color: #b6c0cc;
        font-size: 13px;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-title { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-sub { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-card {
        border-color: var(--uc-border);
        background: var(--uc-surface);
        box-shadow: none;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-card-head {
        border-bottom-color: var(--uc-border);
        color: var(--uc-text-strong);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-card-head-tip { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-label { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-hint { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-input, html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-textarea {
        border-color: var(--uc-border-strong);
        background: var(--uc-surface-2);
        color: var(--uc-text);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-input::placeholder, html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-textarea::placeholder { color: var(--uc-faint); }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-input:focus, html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-textarea:focus {
        border-color: var(--uc-primary);
        box-shadow: 0 0 0 3px var(--uc-primary-ring);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-attach {
        border-color: var(--uc-border-strong);
        background: var(--uc-surface-2);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-attach.is-dragover {
        border-color: var(--uc-primary);
        background: var(--uc-primary-soft);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-attach-item {
        border-color: var(--uc-border);
        background: var(--uc-surface);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-attach-name {
        color: var(--uc-text-strong);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-attach-meta, html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-attach-tip {
        color: var(--uc-muted);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-attach-price-mode, html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-attach-price-input {
        border-color: var(--uc-border-strong);
        background: var(--uc-surface);
        color: var(--uc-text);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-attach-price-unit {
        color: var(--uc-muted);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-attach-remove {
        color: var(--uc-muted);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-attach-remove:hover {
        background: color-mix(in srgb, #ef4444 16%, var(--uc-surface));
        color: #f87171;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-attach-add {
        border-color: var(--uc-border-strong);
        background: var(--uc-surface);
        color: var(--uc-text);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-attach-add:hover {
        border-color: var(--uc-primary);
        background: var(--uc-primary-soft);
        color: var(--uc-primary-ink);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-chip-face, html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-tag-face {
        border-color: var(--uc-border-strong);
        background: var(--uc-surface-2);
        color: var(--uc-text);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-tag input:checked + .fe-tag-face {
        border-color: var(--fe-tc, var(--uc-primary));
        background: color-mix(in srgb, var(--fe-tc, var(--uc-primary)) 20%, transparent);
        color: var(--fe-tc, var(--uc-primary-ink));
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-btn-ghost {
        border-color: var(--uc-border-strong);
        background: var(--uc-surface-2);
        color: var(--uc-text);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-btn-ghost:hover {
        border-color: var(--uc-primary);
        color: var(--uc-primary);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-pill {
        background: var(--uc-surface-3);
        color: var(--uc-muted);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-pill.is-pending {
        background: var(--uc-amber-soft);
        color: var(--uc-amber);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-pill.is-approved {
        background: var(--uc-green-soft);
        color: var(--uc-green);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-pill.is-rejected {
        background: var(--uc-red-soft);
        color: var(--uc-red);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-reject {
        border-color: var(--uc-red-soft);
        background: var(--uc-red-soft);
        color: var(--uc-red);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-preview-title { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-preview-divider { background: var(--uc-border); }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-preview-content { color: var(--uc-text); }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-flash.is-success {
        border-color: var(--uc-green-soft);
        background: var(--uc-green-soft);
        color: var(--uc-green);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-flash.is-error {
        border-color: var(--uc-red-soft);
        background: var(--uc-red-soft);
        color: var(--uc-red);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-md-bar {
        border-color: var(--uc-border);
        background: var(--uc-surface-2);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-md-sep { background: var(--uc-border-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-md-btn { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-md-btn:hover {
        background: var(--uc-surface);
        color: var(--uc-primary);
        box-shadow: none;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-md-btn:focus-visible {
        background: var(--uc-surface);
        color: var(--uc-primary);
        box-shadow: 0 0 0 3px var(--uc-primary-ring);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-md-btn::after, html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-md-btn::before {
        background: var(--uc-surface-3);
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-edit"]) .fe-md-btn::after { color: var(--uc-text-strong); }
@media (max-width: 1180px) {
:where(body[data-page="forum-edit"]) .fe-layout { grid-template-columns: minmax(0, 1fr); }
:where(body[data-page="forum-edit"]) .fe-side { position: static; }
:where(body[data-page="forum-edit"]) .fe-preview-body { max-height: 420px; }
}
/* ==================================================================
 * 外链提示页
 * ================================================================== */
:where(body[data-page="forum-jump"]) .fj-card {
        padding: 24px;
    }
:where(body[data-page="forum-jump"]) .fj-alert {
        display: flex;
        align-items: flex-start;
        gap: 14px;
        padding: 16px 18px;
        border: 1px solid color-mix(in srgb, var(--uc-amber) 28%, transparent);
        border-radius: 5px;
        background: var(--uc-amber-soft);
    }
:where(body[data-page="forum-jump"]) .fj-alert.is-danger {
        border-color: color-mix(in srgb, var(--uc-red) 28%, transparent);
        background: var(--uc-red-soft);
    }
:where(body[data-page="forum-jump"]) .fj-alert-ico {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        border-radius: 5px;
        background: color-mix(in srgb, var(--uc-amber) 14%, transparent);
        color: var(--uc-amber);
        flex-shrink: 0;
    }
:where(body[data-page="forum-jump"]) .fj-alert.is-danger .fj-alert-ico {
        background: color-mix(in srgb, var(--uc-red) 14%, transparent);
        color: var(--uc-red);
    }
:where(body[data-page="forum-jump"]) .fj-alert-ico svg, :where(body[data-page="forum-jump"]) .fj-alert-ico i {
        width: 19px;
        height: 19px;
    }
:where(body[data-page="forum-jump"]) .fj-alert-main {
        min-width: 0;
    }
:where(body[data-page="forum-jump"]) .fj-alert-title {
        font-size: 15px;
        line-height: 1.4;
        font-weight: 800;
        color: var(--uc-text-strong);
    }
:where(body[data-page="forum-jump"]) .fj-alert-text {
        margin-top: 4px;
        font-size: 13px;
        line-height: 1.7;
        color: var(--uc-muted);
    }
:where(body[data-page="forum-jump"]) .fj-target {
        margin-top: 18px;
        padding: 18px;
        border: 1px solid var(--uc-border);
        border-radius: 5px;
        background: var(--uc-surface-2);
    }
:where(body[data-page="forum-jump"]) .fj-target-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
    }
:where(body[data-page="forum-jump"]) .fj-target-label {
        font-size: 11px;
        font-weight: 800;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: var(--uc-faint);
    }
:where(body[data-page="forum-jump"]) .fj-pill {
        display: inline-flex;
        align-items: center;
        height: 22px;
        padding: 0 8px;
        border-radius: 5px;
        background: var(--uc-surface-3);
        color: var(--uc-muted);
        font-size: 11px;
        font-weight: 800;
        letter-spacing: 0.04em;
        white-space: nowrap;
    }
:where(body[data-page="forum-jump"]) .fj-pill.is-warn {
        background: var(--uc-amber-soft);
        color: var(--uc-amber);
    }
:where(body[data-page="forum-jump"]) .fj-host {
        margin-top: 9px;
        font-size: 24px;
        line-height: 1.35;
        font-weight: 800;
        color: var(--uc-text-strong);
        word-break: break-word;
    }
:where(body[data-page="forum-jump"]) .fj-url-label {
        margin-top: 16px;
        font-size: 11px;
        font-weight: 800;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: var(--uc-faint);
    }
:where(body[data-page="forum-jump"]) .fj-url {
        margin-top: 8px;
        padding: 12px 14px;
        border: 1px solid var(--uc-border-strong);
        border-radius: 5px;
        background: var(--uc-surface);
        color: var(--uc-text);
        font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
        font-size: 12.5px;
        line-height: 1.75;
        word-break: break-all;
        overflow-wrap: anywhere;
    }
:where(body[data-page="forum-jump"]) .fj-actions {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 20px;
    }
:where(body[data-page="forum-jump"]) .fj-btn-lg {
        height: 42px;
        padding: 0 20px;
        font-size: 14px;
    }
:where(body[data-page="forum-jump"]) .fj-help-list {
        padding: 6px 18px 12px;
    }
:where(body[data-page="forum-jump"]) .fj-help-item {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        padding: 14px 0;
        border-top: 1px solid var(--uc-border);
    }
:where(body[data-page="forum-jump"]) .fj-help-item:first-child {
        padding-top: 8px;
        border-top: 0;
    }
:where(body[data-page="forum-jump"]) .fj-help-ico {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 32px;
        height: 32px;
        border-radius: 5px;
        background: var(--uc-primary-soft);
        color: var(--uc-primary);
        flex-shrink: 0;
    }
:where(body[data-page="forum-jump"]) .fj-help-ico svg, :where(body[data-page="forum-jump"]) .fj-help-ico i {
        width: 16px;
        height: 16px;
    }
:where(body[data-page="forum-jump"]) .fj-help-main {
        min-width: 0;
    }
:where(body[data-page="forum-jump"]) .fj-help-title {
        font-size: 13px;
        line-height: 1.5;
        font-weight: 800;
        color: var(--uc-text-strong);
    }
:where(body[data-page="forum-jump"]) .fj-help-text {
        margin-top: 3px;
        font-size: 12.5px;
        line-height: 1.65;
        color: var(--uc-muted);
    }
/* ==================================================================
 * 论坛发帖页
 * ================================================================== */
:where(body[data-page="forum-release"]) .fe-wrap {
        max-width: 1280px;
        margin: 0 auto;
        padding: 28px 32px 56px;
    }
:where(body[data-page="forum-release"]) .fe-head {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 16px;
        flex-wrap: wrap;
        margin-bottom: 20px;
    }
:where(body[data-page="forum-release"]) .fe-title {
        font-size: 24px;
        line-height: 1.3;
        font-weight: 800;
        letter-spacing: -0.01em;
        color: #0f172a;
    }
:where(body[data-page="forum-release"]) .fe-sub {
        margin-top: 8px;
        font-size: 13px;
        color: #94a3b8;
    }
:where(body[data-page="forum-release"]) .fe-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        height: 40px;
        padding: 0 18px;
        border-radius: 5px;
        border: 1px solid transparent;
        font-size: 13px;
        font-weight: 700;
        white-space: nowrap;
        cursor: pointer;
        transition: all 0.18s ease;
    }
:where(body[data-page="forum-release"]) .fe-btn svg, :where(body[data-page="forum-release"]) .fe-btn i {
        width: 15px;
        height: 15px;
    }
:where(body[data-page="forum-release"]) .fe-btn-primary {
        background: linear-gradient(135deg, var(--brand) 0%, var(--brand-dark) 100%);
        color: #fff;
        box-shadow: 0 10px 22px var(--brand-shadow);
    }
:where(body[data-page="forum-release"]) .fe-btn-primary:hover {
        transform: translateY(-1px);
        box-shadow: 0 14px 26px var(--brand-shadow);
    }
:where(body[data-page="forum-release"]) .fe-btn-ghost {
        border-color: #e6e9ef;
        background: #fff;
        color: #475569;
    }
:where(body[data-page="forum-release"]) .fe-btn-ghost:hover {
        border-color: var(--brand-border);
        background: var(--brand-soft-3);
        color: var(--brand);
    }
:where(body[data-page="forum-release"]) .fe-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 400px;
        gap: 24px;
        align-items: start;
    }
:where(body[data-page="forum-release"]) .fe-main {
        display: flex;
        flex-direction: column;
        gap: 16px;
        min-width: 0;
    }
:where(body[data-page="forum-release"]) .fe-side {
        position: sticky;
        top: 88px;
    }
:where(body[data-page="forum-release"]) .fe-card {
        border-radius: 5px;
        border: 1px solid #eaedf2;
        background: #fff;
        box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
    }
:where(body[data-page="forum-release"]) .fe-card-body {
        padding: 24px 26px;
    }
:where(body[data-page="forum-release"]) .fe-card-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        padding: 15px 20px;
        border-bottom: 1px solid #f1f5f9;
        font-size: 14px;
        font-weight: 800;
        color: #0f172a;
    }
:where(body[data-page="forum-release"]) .fe-card-head-tip {
        font-size: 12px;
        font-weight: 500;
        color: #94a3b8;
    }
:where(body[data-page="forum-release"]) .fe-flash {
        border-radius: 5px;
        border: 1px solid transparent;
        padding: 12px 16px;
        font-size: 13px;
        font-weight: 600;
    }
:where(body[data-page="forum-release"]) .fe-flash.is-success {
        border-color: #bbf7d0;
        background: #f0fdf4;
        color: #15803d;
    }
:where(body[data-page="forum-release"]) .fe-flash.is-error {
        border-color: #fecaca;
        background: #fef2f2;
        color: #dc2626;
    }
:where(body[data-page="forum-release"]) .fe-field + .fe-field {
        margin-top: 22px;
    }
:where(body[data-page="forum-release"]) .fe-field-head {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 12px;
    }
:where(body[data-page="forum-release"]) .fe-label {
        font-size: 14px;
        font-weight: 700;
        color: #0f172a;
    }
:where(body[data-page="forum-release"]) .fe-hint {
        font-size: 12px;
        color: #94a3b8;
    }
:where(body[data-page="forum-release"]) .fe-input, :where(body[data-page="forum-release"]) .fe-textarea {
        display: block;
        width: 100%;
        margin-top: 10px;
        border-radius: 5px;
        border: 1px solid #e6e9ef;
        background: #fff;
        color: #0f172a;
        font-size: 14px;
        outline: none;
        transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
    }
:where(body[data-page="forum-release"]) .fe-input {
        height: 46px;
        padding: 0 14px;
    }
:where(body[data-page="forum-release"]) .fe-textarea {
        padding: 14px 16px;
        min-height: 340px;
        line-height: 1.85;
        font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
        font-size: 13.5px;
        resize: vertical;
    }
:where(body[data-page="forum-release"]) .fe-input::placeholder, :where(body[data-page="forum-release"]) .fe-textarea::placeholder {
        color: #b6c0cc;
    }
:where(body[data-page="forum-release"]) .fe-input:focus, :where(body[data-page="forum-release"]) .fe-textarea:focus {
        border-color: var(--brand-border);
        box-shadow: 0 0 0 3px var(--brand-soft);
    }
:where(body[data-page="forum-release"]) .fe-attach {
        border: 1px dashed #dbe2ea;
        border-radius: 5px;
        background: #fbfcfe;
        padding: 12px;
        transition: border-color .18s ease, background-color .18s ease;
    }
:where(body[data-page="forum-release"]) .fe-attach.is-dragover {
        border-color: var(--brand-border);
        background: var(--brand-soft-3);
    }
:where(body[data-page="forum-release"]) .fe-attach-list {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }
:where(body[data-page="forum-release"]) .fe-attach-list:empty {
        display: none;
    }
:where(body[data-page="forum-release"]) .fe-attach-progress {
        display: flex;
        flex-direction: column;
        gap: 8px;
        margin-bottom: 10px;
    }
:where(body[data-page="forum-release"]) .fe-attach-progress[hidden] {
        display: none;
    }
:where(body[data-page="forum-release"]) .fe-attach-progress:empty {
        display: none;
    }
:where(body[data-page="forum-release"]) .fe-attach-item {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 9px 11px;
        border: 1px solid #e8edf4;
        border-radius: 5px;
        background: #fff;
    }
:where(body[data-page="forum-release"]) .fe-attach-item.is-uploading {
        opacity: .7;
    }
:where(body[data-page="forum-release"]) .fe-attach-badge {
        flex: 0 0 auto;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        border-radius: 5px;
        font-size: 10px;
        font-weight: 800;
        letter-spacing: .02em;
        text-transform: uppercase;
        color: #fff;
        background: linear-gradient(135deg, #64748b 0%, #475569 100%);
    }
:where(body[data-page="forum-release"]) .fe-attach-badge.is-ipa {
        background: linear-gradient(135deg, var(--brand) 0%, var(--brand-dark) 100%);
    }
:where(body[data-page="forum-release"]) .fe-attach-badge.is-zip {
        background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    }
:where(body[data-page="forum-release"]) .fe-attach-main {
        flex: 1 1 auto;
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: 2px;
    }
:where(body[data-page="forum-release"]) .fe-attach-name {
        font-size: 13px;
        font-weight: 600;
        color: #1f2937;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
:where(body[data-page="forum-release"]) .fe-attach-meta {
        font-size: 11.5px;
        color: #94a3b8;
    }
:where(body[data-page="forum-release"]) .fe-attach-price {
        flex: 0 0 auto;
        display: flex;
        align-items: center;
        gap: 6px;
    }
:where(body[data-page="forum-release"]) .fe-attach-price-mode {
        height: 28px;
        padding: 0 6px;
        border: 1px solid #dbe3ee;
        border-radius: 5px;
        background: #fff;
        font-size: 12px;
        color: #475569;
    }
:where(body[data-page="forum-release"]) .fe-attach-price-box {
        display: inline-flex;
        align-items: center;
        gap: 4px;
    }
:where(body[data-page="forum-release"]) .fe-attach-price-box[hidden] {
        display: none;
    }
:where(body[data-page="forum-release"]) .fe-attach-price-input {
        width: 72px;
        height: 28px;
        padding: 0 6px;
        border: 1px solid #dbe3ee;
        border-radius: 5px;
        background: #fff;
        font-size: 12px;
        color: #1f2937;
    }
:where(body[data-page="forum-release"]) .fe-attach-price-unit {
        font-size: 11.5px;
        color: #94a3b8;
    }
:where(body[data-page="forum-release"]) .fe-attach-remove {
        flex: 0 0 auto;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 28px;
        height: 28px;
        border-radius: 5px;
        border: 0;
        background: transparent;
        color: #94a3b8;
        cursor: pointer;
        transition: all .16s ease;
    }
:where(body[data-page="forum-release"]) .fe-attach-remove:hover {
        background: #fef2f2;
        color: #dc2626;
    }
:where(body[data-page="forum-release"]) .fe-attach-remove svg {
        width: 14px;
        height: 14px;
    }
:where(body[data-page="forum-release"]) .fe-attach-add {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        width: 100%;
        height: 40px;
        margin-top: 10px;
        border: 1px solid #e2e8f0;
        border-radius: 5px;
        background: #fff;
        font-size: 13px;
        font-weight: 600;
        color: #475569;
        cursor: pointer;
        transition: all .18s ease;
    }
:where(body[data-page="forum-release"]) .fe-attach-add:hover {
        border-color: var(--brand-border);
        background: var(--brand-soft-3);
        color: var(--brand);
    }
:where(body[data-page="forum-release"]) .fe-attach-add svg {
        width: 15px;
        height: 15px;
    }
:where(body[data-page="forum-release"]) .fe-attach-add[disabled] {
        cursor: not-allowed;
        opacity: .6;
    }
:where(body[data-page="forum-release"]) .fe-attach-tip {
        margin-top: 8px;
        font-size: 11.5px;
        color: #94a3b8;
        text-align: center;
    }
:where(body[data-page="forum-release"]) .fe-md-bar {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 6px 8px;
        margin-top: 10px;
        padding: 7px 12px;
        border-radius: 5px;
        border: 1px solid #eef1f5;
        background: #f8fafc;
    }
:where(body[data-page="forum-release"]) .fe-md-tools {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 2px;
    }
:where(body[data-page="forum-release"]) .fe-md-sep {
        width: 1px;
        height: 16px;
        margin: 0 5px;
        background: #e9edf3;
    }
:where(body[data-page="forum-release"]) .fe-md-btn {
        position: relative;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 30px;
        height: 30px;
        border: 0;
        border-radius: 4px;
        background: transparent;
        color: #64748b;
        cursor: pointer;
        transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
    }
:where(body[data-page="forum-release"]) .fe-md-btn svg, :where(body[data-page="forum-release"]) .fe-md-btn i {
        width: 16px;
        height: 16px;
    }
:where(body[data-page="forum-release"]) .fe-md-btn:hover {
        background: #fff;
        color: var(--brand);
        box-shadow: 0 1px 3px rgba(15, 23, 42, 0.12);
    }
:where(body[data-page="forum-release"]) .fe-md-btn:focus-visible {
        outline: none;
        background: #fff;
        color: var(--brand);
        box-shadow: 0 0 0 3px var(--brand-soft);
    }
:where(body[data-page="forum-release"]) .fe-md-btn:active {
        transform: translateY(1px);
    }
:where(body[data-page="forum-release"]) .fe-md-btn::after {
        content: attr(data-md-name) "\A" attr(data-md-tip);
        position: absolute;
        left: 50%;
        bottom: calc(100% + 9px);
        transform: translate(-50%, 4px);
        padding: 6px 10px;
        border-radius: 5px;
        background: #0f172a;
        color: #e2e8f0;
        font-size: 11px;
        font-weight: 600;
        line-height: 1.55;
        text-align: center;
        white-space: pre;
        box-shadow: 0 8px 20px rgba(15, 23, 42, 0.18);
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.15s ease, transform 0.15s ease;
        z-index: 30;
    }
:where(body[data-page="forum-release"]) .fe-md-btn::before {
        content: "";
        position: absolute;
        left: 50%;
        bottom: calc(100% + 5px);
        width: 8px;
        height: 8px;
        transform: translate(-50%, 4px) rotate(45deg);
        border-radius: 1px;
        background: #0f172a;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.15s ease, transform 0.15s ease;
        z-index: 30;
    }
:where(body[data-page="forum-release"]) .fe-md-btn:hover::after, :where(body[data-page="forum-release"]) .fe-md-btn:hover::before, :where(body[data-page="forum-release"]) .fe-md-btn:focus-visible::after, :where(body[data-page="forum-release"]) .fe-md-btn:focus-visible::before {
        opacity: 1;
    }
:where(body[data-page="forum-release"]) .fe-md-btn:hover::after, :where(body[data-page="forum-release"]) .fe-md-btn:focus-visible::after {
        transform: translate(-50%, 0);
    }
:where(body[data-page="forum-release"]) .fe-md-btn:hover::before, :where(body[data-page="forum-release"]) .fe-md-btn:focus-visible::before {
        transform: translate(-50%, 0) rotate(45deg);
    }
:where(body[data-page="forum-release"]) .fe-chips {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 12px;
    }
:where(body[data-page="forum-release"]) .fe-chip {
        position: relative;
        display: inline-flex;
        cursor: pointer;
    }
:where(body[data-page="forum-release"]) .fe-chip input {
        position: absolute;
        width: 1px;
        height: 1px;
        opacity: 0;
        pointer-events: none;
    }
:where(body[data-page="forum-release"]) .fe-chip-face {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        height: 34px;
        padding: 0 14px;
        border-radius: 5px;
        border: 1px solid #e6e9ef;
        background: #fff;
        color: #475569;
        font-size: 13px;
        font-weight: 600;
        transition: all 0.18s ease;
    }
:where(body[data-page="forum-release"]) .fe-chip-face svg, :where(body[data-page="forum-release"]) .fe-chip-face i {
        width: 15px;
        height: 15px;
        color: var(--fe-c, var(--brand));
        transition: color 0.18s ease;
    }
:where(body[data-page="forum-release"]) .fe-chip:hover .fe-chip-face {
        border-color: var(--brand-border);
        color: var(--brand);
    }
:where(body[data-page="forum-release"]) .fe-chip input:checked + .fe-chip-face {
        border-color: var(--brand);
        background: var(--brand);
        color: #fff;
        box-shadow: 0 8px 18px var(--brand-shadow);
    }
:where(body[data-page="forum-release"]) .fe-chip input:checked + .fe-chip-face svg, :where(body[data-page="forum-release"]) .fe-chip input:checked + .fe-chip-face i {
        color: #fff;
    }
:where(body[data-page="forum-release"]) .fe-chip input:focus-visible + .fe-chip-face {
        box-shadow: 0 0 0 3px var(--brand-soft);
    }
:where(body[data-page="forum-release"]) .fe-tags {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 12px;
    }
:where(body[data-page="forum-release"]) .fe-tag {
        position: relative;
        display: inline-flex;
        cursor: pointer;
    }
:where(body[data-page="forum-release"]) .fe-tag input {
        position: absolute;
        width: 1px;
        height: 1px;
        opacity: 0;
        pointer-events: none;
    }
:where(body[data-page="forum-release"]) .fe-tag-face {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        height: 32px;
        padding: 0 13px;
        border-radius: 5px;
        border: 1px solid #e6e9ef;
        background: #fff;
        color: #475569;
        font-size: 13px;
        font-weight: 600;
        transition: all 0.18s ease;
    }
:where(body[data-page="forum-release"]) .fe-tag-dot {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: var(--fe-tc, var(--brand));
        transition: background 0.18s ease;
    }
:where(body[data-page="forum-release"]) .fe-tag:hover .fe-tag-face {
        border-color: var(--fe-tc, var(--brand-border));
        color: var(--fe-tc, var(--brand));
    }
:where(body[data-page="forum-release"]) .fe-tag input:checked + .fe-tag-face {
        border-color: var(--fe-tc, var(--brand));
        background: color-mix(in srgb, var(--fe-tc, var(--brand)) 12%, transparent);
        color: var(--fe-tc, var(--brand));
    }
:where(body[data-page="forum-release"]) .fe-tag input:focus-visible + .fe-tag-face {
        box-shadow: 0 0 0 3px var(--brand-soft);
    }
:where(body[data-page="forum-release"]) .fe-tag.is-locked {
        opacity: 0.4;
        pointer-events: none;
    }
:where(body[data-page="forum-release"]) .fe-tag-empty {
        font-size: 13px;
        color: #94a3b8;
    }
:where(body[data-page="forum-release"]) .fe-count {
        font-weight: 700;
        color: var(--brand);
    }
:where(body[data-page="forum-release"]) .fe-actions {
        margin-top: 26px;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 12px;
        flex-wrap: wrap;
    }
:where(body[data-page="forum-release"]) .fe-preview-title {
        font-size: 18px;
        font-weight: 800;
        line-height: 1.45;
        color: #0f172a;
        word-break: break-word;
    }
:where(body[data-page="forum-release"]) .fe-preview-title.is-empty {
        color: #b6c0cc;
        font-weight: 600;
    }
:where(body[data-page="forum-release"]) .fe-preview-body {
        max-height: calc(100vh - 260px);
        overflow: auto;
        padding: 20px 22px;
    }
:where(body[data-page="forum-release"]) .fe-preview-divider {
        height: 1px;
        margin: 16px 0;
        background: #f1f5f9;
    }
:where(body[data-page="forum-release"]) .fe-preview-content {
        font-size: 14px;
        line-height: 1.8;
        color: #334155;
        word-break: break-word;
    }
:where(body[data-page="forum-release"]) .fe-preview-content.is-empty {
        color: #b6c0cc;
        font-size: 13px;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-title { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-sub { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-card {
        border-color: var(--uc-border);
        background: var(--uc-surface);
        box-shadow: none;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-card-head {
        border-bottom-color: var(--uc-border);
        color: var(--uc-text-strong);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-card-head-tip { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-label { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-hint { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-input, html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-textarea {
        border-color: var(--uc-border-strong);
        background: var(--uc-surface-2);
        color: var(--uc-text);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-input::placeholder, html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-textarea::placeholder { color: var(--uc-faint); }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-input:focus, html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-textarea:focus {
        border-color: var(--uc-primary);
        box-shadow: 0 0 0 3px var(--uc-primary-ring);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-attach {
        border-color: var(--uc-border-strong);
        background: var(--uc-surface-2);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-attach.is-dragover {
        border-color: var(--uc-primary);
        background: var(--uc-primary-soft);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-attach-item {
        border-color: var(--uc-border);
        background: var(--uc-surface);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-attach-name {
        color: var(--uc-text-strong);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-attach-meta, html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-attach-tip {
        color: var(--uc-muted);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-attach-price-mode, html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-attach-price-input {
        border-color: var(--uc-border-strong);
        background: var(--uc-surface);
        color: var(--uc-text);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-attach-price-unit {
        color: var(--uc-muted);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-attach-remove {
        color: var(--uc-muted);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-attach-remove:hover {
        background: color-mix(in srgb, #ef4444 16%, var(--uc-surface));
        color: #f87171;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-attach-add {
        border-color: var(--uc-border-strong);
        background: var(--uc-surface);
        color: var(--uc-text);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-attach-add:hover {
        border-color: var(--uc-primary);
        background: var(--uc-primary-soft);
        color: var(--uc-primary-ink);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-chip-face, html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-tag-face {
        border-color: var(--uc-border-strong);
        background: var(--uc-surface-2);
        color: var(--uc-text);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-tag input:checked + .fe-tag-face {
        border-color: var(--fe-tc, var(--uc-primary));
        background: color-mix(in srgb, var(--fe-tc, var(--uc-primary)) 20%, transparent);
        color: var(--fe-tc, var(--uc-primary-ink));
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-btn-ghost {
        border-color: var(--uc-border-strong);
        background: var(--uc-surface-2);
        color: var(--uc-text);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-btn-ghost:hover {
        border-color: var(--uc-primary);
        color: var(--uc-primary);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-preview-title { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-preview-divider { background: var(--uc-border); }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-preview-content { color: var(--uc-text); }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-flash.is-success {
        border-color: var(--uc-green-soft);
        background: var(--uc-green-soft);
        color: var(--uc-green);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-flash.is-error {
        border-color: var(--uc-red-soft);
        background: var(--uc-red-soft);
        color: var(--uc-red);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-md-bar {
        border-color: var(--uc-border);
        background: var(--uc-surface-2);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-md-sep { background: var(--uc-border-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-md-btn { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-md-btn:hover {
        background: var(--uc-surface);
        color: var(--uc-primary);
        box-shadow: none;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-md-btn:focus-visible {
        background: var(--uc-surface);
        color: var(--uc-primary);
        box-shadow: 0 0 0 3px var(--uc-primary-ring);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-md-btn::after, html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-md-btn::before {
        background: var(--uc-surface-3);
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-release"]) .fe-md-btn::after { color: var(--uc-text-strong); }
@media (max-width: 1180px) {
:where(body[data-page="forum-release"]) .fe-layout { grid-template-columns: minmax(0, 1fr); }
:where(body[data-page="forum-release"]) .fe-side { position: static; }
:where(body[data-page="forum-release"]) .fe-preview-body { max-height: 420px; }
}
/* ==================================================================
 * 论坛用户主页
 * ================================================================== */
:where(body[data-page="forum-user"]) .fp-shell {
        background: transparent;
    }
:where(body[data-page="forum-user"]) .fp-wrap {
        max-width: 1280px;
        margin: 0 auto;
        padding: 28px 32px 56px;
    }
:where(body[data-page="forum-user"]) .fp-card {
        border-radius: 5px;
        border: 1px solid #eaedf2;
        background: #fff;
        box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
        overflow: hidden;
    }
:where(body[data-page="forum-user"]) .fp-crumb {
        display: flex;
        align-items: center;
        gap: 8px;
        margin-bottom: 14px;
        font-size: 13px;
        color: #94a3b8;
    }
:where(body[data-page="forum-user"]) .fp-crumb a {
        color: #64748b;
        font-weight: 600;
        transition: color 0.18s ease;
    }
:where(body[data-page="forum-user"]) .fp-crumb a:hover {
        color: var(--brand);
    }
:where(body[data-page="forum-user"]) .fp-crumb-current {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
:where(body[data-page="forum-user"]) .fp-hero {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 16px;
        padding: 16px 20px;
    }
:where(body[data-page="forum-user"]) .fp-identity {
        display: flex;
        align-items: center;
        gap: 14px;
        flex: 1 1 auto;
        min-width: 0;
    }
:where(body[data-page="forum-user"]) .fp-avatar {
        width: 56px;
        height: 56px;
        border-radius: 50%;
        overflow: hidden;
        background: #eef2f7;
        color: var(--brand);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        font-weight: 800;
        flex-shrink: 0;
        box-shadow: 0 0 0 2px #ffffff, 0 6px 16px rgba(15, 23, 42, 0.10);
    }
:where(body[data-page="forum-user"]) .fp-avatar img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }
:where(body[data-page="forum-user"]) .fp-identity-main {
        flex: 1;
        min-width: 0;
    }
:where(body[data-page="forum-user"]) .fp-name-row {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 7px;
    }
:where(body[data-page="forum-user"]) .fp-name {
        margin: 0;
        font-size: 18px;
        line-height: 1.25;
        font-weight: 800;
        letter-spacing: -0.01em;
        color: #0f172a;
        word-break: break-word;
    }
:where(body[data-page="forum-user"]) .fp-badges {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 5px;
    }
:where(body[data-page="forum-user"]) .fp-badges .forum-user-badge {
        padding: 1px 6px;
        border-radius: 5px;
        font-size: 10px;
        font-weight: 700;
        line-height: 1.6;
    }
:where(body[data-page="forum-user"]) .fp-badges .fp-badge-strip {
        display: block;
        height: 18px;
        width: auto;
        max-width: 120px;
        object-fit: contain;
        border-radius: 3px;
    }
:where(body[data-page="forum-user"]) .fp-signature {
        margin-top: 5px;
        font-size: 13px;
        line-height: 1.6;
        color: #475569;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
:where(body[data-page="forum-user"]) .fp-signature.is-empty {
        color: #b0b8c4;
    }
:where(body[data-page="forum-user"]) .fp-meta {
        margin-top: 5px;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 4px 12px;
        font-size: 12px;
        color: #94a3b8;
    }
:where(body[data-page="forum-user"]) .fp-meta b {
        font-weight: 700;
        color: #64748b;
    }
:where(body[data-page="forum-user"]) .fp-hero-actions {
        display: flex;
        align-items: center;
        gap: 10px;
        flex-shrink: 0;
    }
:where(body[data-page="forum-user"]) .fp-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        height: 34px;
        padding: 0 14px;
        border-radius: 5px;
        font-size: 12.5px;
        font-weight: 700;
        white-space: nowrap;
        transition: all 0.2s ease;
    }
:where(body[data-page="forum-user"]) .fp-btn svg, :where(body[data-page="forum-user"]) .fp-btn i {
        width: 15px;
        height: 15px;
    }
:where(body[data-page="forum-user"]) .fp-btn-ghost {
        background: #f3f5f9;
        color: #475569;
    }
:where(body[data-page="forum-user"]) .fp-btn-ghost:hover {
        background: var(--brand-soft-3);
        color: var(--brand);
    }
:where(body[data-page="forum-user"]) .fp-layout {
        margin-top: 18px;
        display: grid;
        grid-template-columns: minmax(0, 1fr) 300px;
        gap: 24px;
        align-items: start;
    }
:where(body[data-page="forum-user"]) .fp-main, :where(body[data-page="forum-user"]) .fp-side {
        display: flex;
        flex-direction: column;
        gap: 18px;
        min-width: 0;
    }
:where(body[data-page="forum-user"]) .fp-card-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        padding: 12px 16px;
        border-bottom: 1px solid #eef2f7;
    }
:where(body[data-page="forum-user"]) .fp-card-title {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        font-size: 14px;
        font-weight: 800;
        color: #0f172a;
    }
:where(body[data-page="forum-user"]) .fp-card-title svg, :where(body[data-page="forum-user"]) .fp-card-title i {
        width: 15px;
        height: 15px;
        color: var(--brand);
    }
:where(body[data-page="forum-user"]) .fp-card-count {
        font-size: 12px;
        font-weight: 600;
        color: #94a3b8;
    }
:where(body[data-page="forum-user"]) .fp-tabs-card {
        scroll-margin-top: 84px;
    }
:where(body[data-page="forum-user"]) .fp-tabs-card .fv-tabs {
        position: relative;
        display: flex;
        width: fit-content;
        gap: 4px;
        padding: 4px;
        margin: 12px 16px 0;
        border-radius: 5px;
        background: #f2f4f8;
    }
:where(body[data-page="forum-user"]) .fp-tabs-card .fv-tabs-indicator {
        position: absolute;
        top: 4px;
        bottom: 4px;
        left: 0;
        width: 0;
        border-radius: 5px;
        background: #fff;
        box-shadow: 0 2px 6px rgba(15, 23, 42, 0.12);
        pointer-events: none;
        transition: transform 0.34s cubic-bezier(0.4, 0, 0.2, 1), width 0.34s cubic-bezier(0.4, 0, 0.2, 1);
    }
:where(body[data-page="forum-user"]) .fp-tabs-card .fv-tab {
        position: relative;
        z-index: 1;
        flex: 0 0 auto;
        min-width: 68px;
        height: 30px;
        padding: 0 18px;
        border-radius: 5px;
        color: #64748b;
        font-size: 12.5px;
        font-weight: 700;
        transition: color 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    }
:where(body[data-page="forum-user"]) .fp-tabs-card .fv-tab:hover {
        color: var(--brand);
    }
:where(body[data-page="forum-user"]) .fp-tabs-card .fv-tab.is-active {
        color: var(--brand);
        background: #fff;
        box-shadow: 0 2px 6px rgba(15, 23, 42, 0.10);
    }
:where(body[data-page="forum-user"]) .fp-tabs-card .fv-tabs.has-indicator .fv-tab.is-active {
        background: transparent;
        box-shadow: none;
    }
:where(body[data-page="forum-user"]) .fp-tabs-card .fv-panels {
        padding: 0;
    }
:where(body[data-page="forum-user"]) .fp-tabs-card .fv-panel {
        display: none;
    }
:where(body[data-page="forum-user"]) .fp-tabs-card .fv-panel.is-active {
        display: block;
    }
:where(body[data-page="forum-user"]) .fp-tabs-card .fv-panels.is-ready {
        position: relative;
        overflow: hidden;
        padding: 0;
        transition: height 340ms cubic-bezier(0.4, 0, 0.2, 1);
    }
:where(body[data-page="forum-user"]) .fp-tabs-card .fv-panels.is-ready .fv-panels-track {
        display: flex;
        align-items: flex-start;
        width: 100%;
        transition: transform 340ms cubic-bezier(0.4, 0, 0.2, 1);
        will-change: transform;
    }
:where(body[data-page="forum-user"]) .fp-tabs-card .fv-panels.is-ready .fv-panel {
        display: block;
        flex: 0 0 100%;
        min-width: 100%;
        box-sizing: border-box;
        padding: 0;
        
        visibility: hidden;
        transition: visibility 0s linear 340ms;
    }
:where(body[data-page="forum-user"]) .fp-tabs-card .fv-panels.is-ready .fv-panel.is-active {
        visibility: visible;
        transition: visibility 0s linear 0s;
    }
@media (prefers-reduced-motion: reduce) {
:where(body[data-page="forum-user"]) .fp-tabs-card .fv-panels.is-ready, :where(body[data-page="forum-user"]) .fp-tabs-card .fv-panels.is-ready .fv-panels-track, :where(body[data-page="forum-user"]) .fp-tabs-card .fv-panels.is-ready .fv-panel {
            transition: none;
        }
}
:where(body[data-page="forum-user"]) .fp-item {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        padding: 12px 16px;
        border-bottom: 1px solid #f1f5f9;
        transition: background 0.18s ease;
    }
:where(body[data-page="forum-user"]) .fp-item:last-child {
        border-bottom: 0;
    }
:where(body[data-page="forum-user"]) .fp-item:hover {
        background: #f8fafd;
    }
:where(body[data-page="forum-user"]) .fp-item-app {
        align-items: center;
    }
:where(body[data-page="forum-user"]) .fp-item-main {
        flex: 1;
        min-width: 0;
    }
:where(body[data-page="forum-user"]) .fp-item-title {
        display: block;
        font-size: 14px;
        line-height: 1.5;
        font-weight: 700;
        color: #1e293b;
        word-break: break-word;
        transition: color 0.18s ease;
    }
:where(body[data-page="forum-user"]) .fp-item:hover .fp-item-title {
        color: var(--brand);
    }
:where(body[data-page="forum-user"]) .fp-item-title.is-sub {
        font-size: 13.5px;
        font-weight: 600;
        color: #475569;
    }
:where(body[data-page="forum-user"]) .fp-comment-text {
        display: -webkit-box;
        font-size: 14px;
        line-height: 1.6;
        font-weight: 500;
        color: #1e293b;
        word-break: break-word;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        transition: color 0.18s ease;
    }
:where(body[data-page="forum-user"]) .fp-item:hover .fp-comment-text {
        color: var(--brand);
    }
:where(body[data-page="forum-user"]) .fp-comment-source {
        display: flex;
        align-items: center;
        gap: 5px;
        min-width: 0;
        margin-top: 6px;
        font-size: 12px;
        line-height: 1.5;
        color: #94a3b8;
    }
:where(body[data-page="forum-user"]) .fp-comment-source svg {
        flex: none;
        width: 12px;
        height: 12px;
        color: #cbd5e1;
    }
:where(body[data-page="forum-user"]) .fp-comment-post {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: #94a3b8;
    }
:where(body[data-page="forum-user"]) .fp-tag.is-pending {
        background: rgba(249, 115, 22, 0.12);
        color: #ea580c;
    }
:where(body[data-page="forum-user"]) .fp-item-summary {
        display: -webkit-box;
        margin-top: 3px;
        font-size: 12.5px;
        line-height: 1.6;
        color: #94a3b8;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
:where(body[data-page="forum-user"]) .fp-item-meta {
        margin-top: 6px;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 5px 9px;
        font-size: 11.5px;
        color: #94a3b8;
    }
:where(body[data-page="forum-user"]) .fp-item-stats {
        display: flex;
        align-items: center;
        gap: 14px;
        flex-shrink: 0;
        padding-top: 2px;
        font-size: 11.5px;
        color: #94a3b8;
    }
:where(body[data-page="forum-user"]) .fp-item-stat {
        display: inline-flex;
        align-items: center;
        justify-content: flex-end;
        gap: 4px;
        min-width: 36px;
    }
:where(body[data-page="forum-user"]) .fp-item-stat svg, :where(body[data-page="forum-user"]) .fp-item-stat i {
        width: 13px;
        height: 13px;
    }
:where(body[data-page="forum-user"]) .fp-item-arrow {
        width: 15px;
        height: 15px;
        flex-shrink: 0;
        color: #cbd5e1;
    }
:where(body[data-page="forum-user"]) .fp-tag {
        display: inline-flex;
        align-items: center;
        height: 18px;
        padding: 0 7px;
        border-radius: 5px;
        background: var(--brand-soft);
        color: var(--brand);
        font-size: 10.5px;
        font-weight: 700;
    }
:where(body[data-page="forum-user"]) .fp-tag.is-top {
        background: #fee2e2;
        color: #dc2626;
    }
:where(body[data-page="forum-user"]) .fp-tag.is-plain {
        background: #f1f5f9;
        color: #64748b;
    }
:where(body[data-page="forum-user"]) .fp-app-icon {
        width: 40px;
        height: 40px;
        flex-shrink: 0;
        border-radius: 10px;
        object-fit: cover;
        background: #eef2f7;
        border: 1px solid #eef2f7;
    }
:where(body[data-page="forum-user"]) .fp-app-version {
        margin-left: 6px;
        font-size: 11px;
        font-weight: 700;
        font-style: normal;
        color: #94a3b8;
    }
:where(body[data-page="forum-user"]) .fp-item-review {
        align-items: center;
        gap: 12px;
    }
:where(body[data-page="forum-user"]) .fp-review-app {
        display: block;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 14px;
        line-height: 1.5;
        font-weight: 700;
        color: #1e293b;
        transition: color 0.18s ease;
    }
:where(body[data-page="forum-user"]) .fp-item-review:hover .fp-review-app {
        color: var(--brand);
    }
:where(body[data-page="forum-user"]) .fp-review-score {
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 7px;
        flex: none;
        width: 106px;
        align-self: stretch;
        margin-left: 4px;
        padding-left: 16px;
        border-left: 1px solid #f1f5f9;
    }
:where(body[data-page="forum-user"]) .fp-stars {
        display: inline-flex;
        align-items: center;
        gap: 2px;
        line-height: 0;
    }
:where(body[data-page="forum-user"]) .fp-stars svg, :where(body[data-page="forum-user"]) .fp-stars i {
        width: 14px;
        height: 14px;
        stroke-width: 1.5;
    }
:where(body[data-page="forum-user"]) .fp-stars .is-on {
        color: #fbbf24;
        fill: currentColor;
    }
:where(body[data-page="forum-user"]) .fp-stars .is-off {
        color: #e3e9f1;
        fill: currentColor;
    }
:where(body[data-page="forum-user"]) .fp-review-score-num {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
        min-width: 44px;
        height: 26px;
        padding: 0 10px;
        border: 1px solid #e8edf5;
        border-radius: 9px;
        background: #f4f6fa;
        font-size: 17px;
        line-height: 1;
        font-weight: 800;
        letter-spacing: -0.02em;
        font-variant-numeric: tabular-nums;
        color: #64748b;
        transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
    }
:where(body[data-page="forum-user"]) .fp-review-score-num.is-high {
        color: #b45309;
        background: #fff7e8;
        border-color: #fbe7c4;
    }
:where(body[data-page="forum-user"]) .fp-review-score-num.is-mid {
        color: #64748b;
        background: #f4f6fa;
        border-color: #e8edf5;
    }
:where(body[data-page="forum-user"]) .fp-review-score-num.is-low {
        color: #b04a3f;
        background: #fdf5f4;
        border-color: #f7e2df;
    }
:where(body[data-page="forum-user"]) .fp-review-text {
        display: -webkit-box;
        margin-top: 5px;
        font-size: 13px;
        line-height: 1.6;
        color: #475569;
        word-break: break-word;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
:where(body[data-page="forum-user"]) .fp-review-text.is-empty {
        color: #b6c0cd;
        font-style: normal;
    }
:where(body[data-page="forum-user"]) .fp-review-device {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
:where(body[data-page="forum-user"]) .fp-item-review .fp-item-meta {
        gap: 4px;
    }
:where(body[data-page="forum-user"]) .fp-item-review .fp-item-meta > span + span::before {
        content: '·';
        margin-right: 6px;
        color: #cbd5e1;
    }
:where(body[data-page="forum-user"]) .fp-review-thumb {
        display: inline-flex;
        align-items: center;
        gap: 3px;
        color: #94a3b8;
    }
:where(body[data-page="forum-user"]) .fp-review-thumb svg, :where(body[data-page="forum-user"]) .fp-review-thumb i {
        width: 12px;
        height: 12px;
    }
:where(body[data-page="forum-user"]) .fp-stat-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
:where(body[data-page="forum-user"]) .fp-stat-cell {
        padding: 12px 14px;
        border-top: 1px solid #f1f5f9;
    }
:where(body[data-page="forum-user"]) .fp-stat-cell:nth-child(-n+2) {
        border-top: 0;
    }
:where(body[data-page="forum-user"]) .fp-stat-cell:nth-child(odd) {
        border-right: 1px solid #f1f5f9;
    }
:where(body[data-page="forum-user"]) .fp-stat-cell:last-child:nth-child(odd) {
        grid-column: span 2;
        border-right: 0;
    }
:where(body[data-page="forum-user"]) .fp-stat-cell b {
        display: block;
        font-size: 17px;
        line-height: 1.2;
        font-weight: 800;
        letter-spacing: -0.02em;
        color: #0f172a;
    }
:where(body[data-page="forum-user"]) .fp-stat-cell span {
        display: block;
        margin-top: 3px;
        font-size: 11.5px;
        font-weight: 600;
        color: #94a3b8;
    }
:where(body[data-page="forum-user"]) .fp-badge-row {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        padding: 11px 16px;
        border-bottom: 1px solid #f1f5f9;
    }
:where(body[data-page="forum-user"]) .fp-badge-row:last-child {
        border-bottom: 0;
    }
:where(body[data-page="forum-user"]) .fp-badge-icon {
        width: 30px;
        height: 30px;
        flex-shrink: 0;
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: var(--brand-soft);
        color: var(--brand);
    }
:where(body[data-page="forum-user"]) .fp-badge-icon svg, :where(body[data-page="forum-user"]) .fp-badge-icon i {
        width: 16px;
        height: 16px;
    }
:where(body[data-page="forum-user"]) .fp-badge-img {
        flex-shrink: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 74px;
        min-height: 30px;
    }
:where(body[data-page="forum-user"]) .fp-badge-img img {
        display: block;
        height: 26px;
        width: auto;
        max-width: 74px;
        object-fit: contain;
    }
:where(body[data-page="forum-user"]) .fp-badge-main {
        flex: 1;
        min-width: 0;
    }
:where(body[data-page="forum-user"]) .fp-badge-name {
        font-size: 13px;
        font-weight: 700;
        color: #1e293b;
    }
:where(body[data-page="forum-user"]) .fp-badge-desc {
        margin-top: 2px;
        font-size: 11.5px;
        color: #94a3b8;
    }
:where(body[data-page="forum-user"]) .fp-empty {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 8px;
        padding: 40px 20px;
        text-align: center;
        font-size: 12.5px;
        color: #94a3b8;
    }
:where(body[data-page="forum-user"]) .fp-empty svg, :where(body[data-page="forum-user"]) .fp-empty i {
        width: 28px;
        height: 28px;
        opacity: 0.55;
    }
:where(body[data-page="forum-user"]) .fp-pagination {
        padding: 14px 16px;
        border-top: 1px solid #f1f5f9;
    }
:where(body[data-page="forum-user"]) .fp-side .fp-pagination .pagination {
        gap: 6px;
    }
:where(body[data-page="forum-user"]) .fp-side .fp-pagination .pagination li a, :where(body[data-page="forum-user"]) .fp-side .fp-pagination .pagination li span {
        min-width: 28px;
        height: 28px;
        padding: 0 7px;
        font-size: 12px;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-card {
        background: var(--uc-surface);
        border-color: color-mix(in srgb, var(--uc-border-strong) 60%, transparent);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-crumb { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-crumb a { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-crumb a:hover { color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-avatar {
        background: var(--uc-surface-3);
        color: var(--uc-primary);
        box-shadow: 0 0 0 2px var(--uc-surface), 0 6px 16px rgba(0, 0, 0, 0.35);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-name { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-signature { color: var(--uc-text); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-signature.is-empty { color: var(--uc-faint); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-meta { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-meta b { color: var(--uc-text); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-btn-ghost { background: var(--uc-surface-2); color: var(--uc-text); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-btn-ghost:hover { background: var(--uc-primary-soft); color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-card-head { border-bottom-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-card-title { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-card-title svg, html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-card-title i { color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-card-count { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-tabs-card .fv-tabs { background: var(--uc-surface-2); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-tabs-card .fv-tabs-indicator {
        background: var(--uc-surface-3);
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.28);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-tabs-card .fv-tab { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-tabs-card .fv-tab:hover { color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-tabs-card .fv-tab.is-active {
        color: var(--uc-primary);
        background: var(--uc-surface-3);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-tabs-card .fv-tabs.has-indicator .fv-tab.is-active {
        background: transparent;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-item { border-bottom-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-item:hover { background: var(--uc-surface-2); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-item-title { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-item-title.is-sub { color: var(--uc-text); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-item:hover .fp-item-title { color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-item-summary { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-comment-text { color: var(--uc-text); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-item:hover .fp-comment-text { color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-comment-source, html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-comment-post { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-comment-source svg { color: var(--uc-faint); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-tag.is-pending {
        background: color-mix(in srgb, #f97316 20%, var(--uc-surface));
        color: #fb923c;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-item-meta, html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-item-stats { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-item-arrow { color: var(--uc-faint); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-tag { background: var(--uc-primary-soft); color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-tag.is-top { background: var(--uc-red-soft); color: var(--uc-red); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-review-app { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-item-review:hover .fp-review-app { color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-review-text { color: var(--uc-text); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-review-text.is-empty { color: var(--uc-faint); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-stars .is-off { color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-review-score { border-left-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-review-score-num {
        color: var(--uc-text);
        background: var(--uc-surface-2);
        border-color: var(--uc-surface-3);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-review-score-num.is-high {
        color: #fbbf24;
        background: rgba(251, 191, 36, 0.12);
        border-color: rgba(251, 191, 36, 0.26);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-review-score-num.is-low {
        color: #f87171;
        background: rgba(248, 113, 113, 0.12);
        border-color: rgba(248, 113, 113, 0.26);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-review-thumb { color: var(--uc-faint); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-item-review .fp-item-meta > span + span::before { color: var(--uc-faint); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-tag.is-plain { background: var(--uc-surface-3); color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-app-icon { background: var(--uc-surface-3); border-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-app-version { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-stat-cell { border-top-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-stat-cell:nth-child(odd) { border-right-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-stat-cell b { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-stat-cell span { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-badge-row { border-bottom-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-badge-icon { background: var(--uc-primary-soft); color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-badge-name { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-badge-desc { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-empty { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-user"]) .fp-pagination { border-top-color: var(--uc-surface-3); }
/* ==================================================================
 * 论坛帖子详情页
 * ================================================================== */
:where(body[data-page="forum-view"]) .fv-shell {
        background: transparent;
    }
:where(body[data-page="forum-view"]) .fv-wrap {
        max-width: 1280px;
        margin: 0 auto;
        padding: 24px 32px 56px;
    }
:where(body[data-page="forum-view"]) .fv-flash {
        margin-bottom: 16px;
        padding: 13px 18px;
        border-radius: 5px;
        border: 1px solid transparent;
        font-size: 13px;
        font-weight: 600;
    }
:where(body[data-page="forum-view"]) .fv-flash.is-success {
        border-color: #bbf7d0;
        background: #f0fdf4;
        color: #15803d;
    }
:where(body[data-page="forum-view"]) .fv-flash.is-error {
        border-color: #fecaca;
        background: #fef2f2;
        color: #dc2626;
    }
:where(body[data-page="forum-view"]) .fv-crumb {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        flex-wrap: wrap;
        margin-bottom: 16px;
    }
:where(body[data-page="forum-view"]) .fv-crumb-path {
        display: flex;
        align-items: center;
        gap: 8px;
        min-width: 0;
        font-size: 13px;
        color: #94a3b8;
    }
:where(body[data-page="forum-view"]) .fv-crumb-path a {
        color: #64748b;
        transition: color 0.18s ease;
    }
:where(body[data-page="forum-view"]) .fv-crumb-path a:hover {
        color: var(--brand);
    }
:where(body[data-page="forum-view"]) .fv-crumb-sep {
        color: #cbd5e1;
    }
:where(body[data-page="forum-view"]) .fv-crumb-current {
        max-width: 460px;
        color: #0f172a;
        font-weight: 600;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
:where(body[data-page="forum-view"]) .fv-card {
        border-radius: 5px;
        border: 1px solid #eaedf2;
        background: #fff;
        box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
    }
:where(body[data-page="forum-view"]) .fv-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 300px;
        gap: 24px;
        align-items: start;
    }
:where(body[data-page="forum-view"]) .fv-main, :where(body[data-page="forum-view"]) .fv-rail {
        display: flex;
        flex-direction: column;
        gap: 20px;
        min-width: 0;
    }
:where(body[data-page="forum-view"]) .fv-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        height: 34px;
        padding: 0 14px;
        border-radius: 5px;
        font-size: 13px;
        font-weight: 700;
        white-space: nowrap;
        transition: all 0.18s ease;
    }
:where(body[data-page="forum-view"]) .fv-btn svg, :where(body[data-page="forum-view"]) .fv-btn i {
        width: 15px;
        height: 15px;
    }
:where(body[data-page="forum-view"]) .fv-btn-ghost {
        border: 1px solid #e6e9ef;
        background: #fff;
        color: #475569;
    }
:where(body[data-page="forum-view"]) .fv-btn-ghost:hover {
        border-color: var(--brand-border);
        background: var(--brand-soft-3);
        color: var(--brand);
    }
:where(body[data-page="forum-view"]) .fv-btn-primary {
        background: linear-gradient(135deg, var(--brand) 0%, var(--brand-dark) 100%);
        color: #fff;
        box-shadow: 0 8px 18px var(--brand-shadow);
    }
:where(body[data-page="forum-view"]) .fv-btn-primary:hover {
        transform: translateY(-1px);
        box-shadow: 0 12px 24px var(--brand-shadow);
    }
:where(body[data-page="forum-view"]) .fv-btn-block {
        width: 100%;
    }
:where(body[data-page="forum-view"]) .fv-icon-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 34px;
        height: 34px;
        border-radius: 5px;
        border: 1px solid #fecaca;
        background: #fff5f5;
        color: #dc2626;
        transition: all 0.18s ease;
    }
:where(body[data-page="forum-view"]) .fv-icon-btn:hover {
        background: #fee2e2;
    }
:where(body[data-page="forum-view"]) .fv-icon-btn svg, :where(body[data-page="forum-view"]) .fv-icon-btn i {
        width: 16px;
        height: 16px;
    }
:where(body[data-page="forum-view"]) .fv-tag {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        padding: 3px 9px;
        border-radius: 5px;
        background: var(--brand-soft);
        color: var(--brand);
        font-size: 11px;
        font-weight: 700;
        line-height: 1.3;
        white-space: nowrap;
    }
:where(body[data-page="forum-view"]) .fv-tag.is-top {
        background: #fef2f2;
        color: #dc2626;
    }
:where(body[data-page="forum-view"]) .fv-tag.is-essence {
        background: #fffbeb;
        color: #d97706;
    }
:where(body[data-page="forum-view"]) .fv-tag.is-pending {
        background: #fff7ed;
        color: #ea580c;
    }
:where(body[data-page="forum-view"]) .fv-tag.is-plain {
        background: #f1f5f9;
        color: #64748b;
    }
:where(body[data-page="forum-view"]) .fv-post {
        padding: 26px 28px 22px;
    }
:where(body[data-page="forum-view"]) .fv-post-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        flex-wrap: wrap;
    }
:where(body[data-page="forum-view"]) .fv-post-head-actions {
        display: flex;
        align-items: center;
        gap: 8px;
        flex-shrink: 0;
        margin-left: auto;
    }
:where(body[data-page="forum-view"]) .fv-post-badges {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }
:where(body[data-page="forum-view"]) .fv-title {
        margin: 12px 0 0;
        font-size: 24px;
        line-height: 1.45;
        font-weight: 800;
        letter-spacing: -0.01em;
        color: #0f172a;
        word-break: break-word;
    }
:where(body[data-page="forum-view"]) .fv-post-meta {
        margin-top: 18px;
        padding-top: 16px;
        border-top: 1px solid #f1f5f9;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        flex-wrap: wrap;
    }
:where(body[data-page="forum-view"]) .fv-author {
        display: flex;
        align-items: center;
        gap: 12px;
        min-width: 0;
    }
:where(body[data-page="forum-view"]) .fv-avatar {
        width: 42px;
        height: 42px;
        border-radius: 50%;
        overflow: hidden;
        background: #eef2f7;
        color: var(--brand);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 15px;
        font-weight: 800;
        flex-shrink: 0;
    }
:where(body[data-page="forum-view"]) .fv-avatar img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }
:where(body[data-page="forum-view"]) .fv-author-main {
        min-width: 0;
    }
:where(body[data-page="forum-view"]) .fv-author-row {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 4px 8px;
        min-width: 0;
    }
:where(body[data-page="forum-view"]) .fv-author-name {
        font-size: 15px;
        font-weight: 800;
        color: #0f172a;
        transition: color 0.18s ease;
    }
:where(body[data-page="forum-view"]) .fv-author-name:hover {
        color: var(--brand);
    }
:where(body[data-page="forum-view"]) .fv-author-sub {
        margin-top: 4px;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 4px 10px;
        font-size: 12px;
        color: #94a3b8;
    }
:where(body[data-page="forum-view"]) .fv-author-sub .fv-tag {
        font-size: 10px;
        padding: 1px 6px;
    }
:where(body[data-page="forum-view"]) .fv-badges {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 5px;
    }
:where(body[data-page="forum-view"]) .fv-metrics {
        display: flex;
        align-items: center;
        gap: 8px;
    }
:where(body[data-page="forum-view"]) .fv-metric {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        height: 30px;
        padding: 0 11px;
        border-radius: 5px;
        background: #f7f9fc;
        color: #64748b;
        font-size: 12px;
        font-weight: 700;
    }
:where(body[data-page="forum-view"]) .fv-metric svg, :where(body[data-page="forum-view"]) .fv-metric i {
        width: 15px;
        height: 15px;
    }
:where(body[data-page="forum-view"]) .fv-content {
        margin-top: 20px;
        font-size: 15px;
        line-height: 1.95;
        color: #1f2937;
        word-break: break-word;
    }
:where(body[data-page="forum-view"]) .fv-attach {
        margin-top: 22px;
        border: 1px solid #eaedf2;
        border-radius: 5px;
        background: #fbfcfe;
        overflow: hidden;
    }
:where(body[data-page="forum-view"]) .fv-attach-head {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 12px 16px;
        border-bottom: 1px solid #eef1f6;
        font-size: 13px;
        font-weight: 700;
        color: #0f172a;
    }
:where(body[data-page="forum-view"]) .fv-attach-head svg {
        width: 15px;
        height: 15px;
        color: var(--brand);
    }
:where(body[data-page="forum-view"]) .fv-attach-count {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 20px;
        height: 18px;
        padding: 0 6px;
        border-radius: 9px;
        background: var(--brand-soft-2);
        color: var(--brand);
        font-size: 11px;
        font-weight: 700;
    }
:where(body[data-page="forum-view"]) .fv-attach-list {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        padding: 12px 16px;
    }
:where(body[data-page="forum-view"]) .fv-attach-item {
        display: flex;
        align-items: center;
        gap: 10px;
        min-width: 0;
        padding: 10px 12px;
        border: 1px solid #eef1f6;
        border-radius: 6px;
        background: #fff;
        color: inherit;
        transition: border-color .18s ease;
    }
:where(body[data-page="forum-view"]) .fv-attach-item:hover {
        border-color: #dbe3ee;
    }
:where(body[data-page="forum-view"]) .fv-attach-badge {
        flex: 0 0 auto;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        border-radius: 5px;
        font-size: 10.5px;
        font-weight: 800;
        letter-spacing: .02em;
        text-transform: uppercase;
        color: #fff;
        background: linear-gradient(135deg, #64748b 0%, #475569 100%);
    }
:where(body[data-page="forum-view"]) .fv-attach-badge.is-ipa {
        background: linear-gradient(135deg, var(--brand) 0%, var(--brand-dark) 100%);
    }
:where(body[data-page="forum-view"]) .fv-attach-badge.is-zip {
        background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    }
:where(body[data-page="forum-view"]) .fv-attach-main {
        flex: 1 1 auto;
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: 3px;
    }
:where(body[data-page="forum-view"]) .fv-attach-name {
        font-size: 13.5px;
        font-weight: 600;
        color: #1f2937;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
:where(body[data-page="forum-view"]) .fv-attach-meta {
        font-size: 12px;
        color: #94a3b8;
    }
:where(body[data-page="forum-view"]) .fv-attach-download {
        flex: 0 0 auto;
        display: inline-flex;
        align-items: center;
        gap: 5px;
        height: 30px;
        padding: 0 12px;
        border-radius: 5px;
        border: 1px solid #e2e8f0;
        background: #fff;
        font-size: 12px;
        font-weight: 600;
        font-family: inherit;
        color: #475569;
        text-decoration: none;
        cursor: pointer;
        appearance: none;
        transition: all .18s ease;
    }
:where(body[data-page="forum-view"]) .fv-attach-download:disabled {
        opacity: .6;
        cursor: default;
    }
:where(body[data-page="forum-view"]) .fv-attach-cost {
        font-style: normal;
        display: inline-flex;
        align-items: center;
        height: 18px;
        padding: 0 6px;
        border-radius: 9px;
        background: #fef3c7;
        color: #b45309;
        font-size: 11px;
        font-weight: 700;
    }
:where(body[data-page="forum-view"]) .fv-attach-owner-price {
        font-style: normal;
        color: #b45309;
        font-weight: 700;
    }
:where(body[data-page="forum-view"]) .fv-attach-owned {
        font-style: normal;
        display: inline-flex;
        align-items: center;
        height: 18px;
        padding: 0 6px;
        border-radius: 9px;
        background: #dcfce7;
        color: #15803d;
        font-size: 11px;
        font-weight: 700;
        vertical-align: 1px;
    }
:where(body[data-page="forum-view"]) .fv-attach-download:hover {
        border-color: var(--brand-border);
        background: var(--brand-soft-3);
        color: var(--brand);
    }
:where(body[data-page="forum-view"]) .fv-attach-download:focus-visible {
        outline: 2px solid var(--brand-border);
        outline-offset: 2px;
    }
:where(body[data-page="forum-view"]) .fv-attach-download svg {
        width: 13px;
        height: 13px;
    }
:where(body[data-page="forum-view"]) .fv-post-foot {
        margin-top: 22px;
        padding-top: 16px;
        border-top: 1px solid #f1f5f9;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        flex-wrap: wrap;
    }
:where(body[data-page="forum-view"]) .fv-post-tags {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }
:where(body[data-page="forum-view"]) .fv-post-tags:empty {
        display: none;
    }
:where(body[data-page="forum-view"]) .forum-like-btn {
        position: relative;
        display: inline-flex;
        align-items: center;
        gap: 6px;
        height: 34px;
        padding: 0 14px;
        border-radius: 5px;
        border: 1px solid #e6e9ef;
        background: #fff;
        color: #475569;
        font-size: 13px;
        font-weight: 700;
        overflow: visible;
        isolation: isolate;
        transform-origin: center;
        will-change: transform;
        transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
    }
:where(body[data-page="forum-view"]) .forum-like-btn:hover {
        border-color: var(--brand-border);
        background: var(--brand-soft-3);
        color: var(--brand);
    }
:where(body[data-page="forum-view"]) .forum-like-btn.liked {
        border-color: var(--brand-border);
        background: var(--brand-soft);
        color: var(--brand);
    }
:where(body[data-page="forum-view"]) .forum-like-btn .like-icon {
        width: 16px;
        height: 16px;
        margin-right: 0;
    }
:where(body[data-page="forum-view"]) .forum-like-btn.liked .like-icon {
        fill: currentColor;
    }
:where(body[data-page="forum-view"]) .forum-favorite-btn:hover, :where(body[data-page="forum-view"]) .forum-favorite-btn.liked {
        border-color: color-mix(in srgb, var(--uc-amber) 34%, transparent);
        background: var(--uc-amber-soft);
        color: var(--uc-amber);
    }
:where(body[data-page="forum-view"]) .forum-favorite-btn .forum-like-particle {
        background: var(--uc-amber);
    }
:where(body[data-page="forum-view"]) .forum-like-btn.is-bursting {
        animation: forumLikePop 600ms cubic-bezier(.2, 1.45, .35, 1) both;
    }
:where(body[data-page="forum-view"]) .forum-like-btn.is-bursting .like-icon {
        animation: forumLikeIconPop 600ms cubic-bezier(.2, 1.45, .35, 1) both;
    }
:where(body[data-page="forum-view"]) .forum-like-particles {
        position: absolute;
        left: 50%;
        top: 50%;
        width: 0;
        height: 0;
        pointer-events: none;
        z-index: 3;
    }
:where(body[data-page="forum-view"]) .forum-like-particle {
        position: absolute;
        width: 4px;
        height: 4px;
        border-radius: 50%;
        background: var(--brand);
        opacity: 0;
        transform: translate(-50%, -50%) translate(0, 0) scale(.55);
        animation: forumLikeParticle 600ms cubic-bezier(.2, .75, .25, 1) both;
    }
@keyframes forumLikePop {
        0% { transform: scale(1); }
        16% { transform: scale(.78); }
        42% { transform: scale(1.18); }
        63% { transform: scale(.94); }
        82% { transform: scale(1.04); }
        100% { transform: scale(1); }
    }
@keyframes forumLikeIconPop {
        0% { transform: scale(1); }
        22% { transform: scale(.82); }
        48% { transform: scale(1.2) rotate(-7deg); }
        70% { transform: scale(.96) rotate(2deg); }
        100% { transform: scale(1) rotate(0); }
    }
@keyframes forumLikeParticle {
        0% { opacity: 0; transform: translate(-50%, -50%) translate(0, 0) scale(.55); }
        18% { opacity: 1; }
        100% { opacity: 0; transform: translate(-50%, -50%) translate(var(--dx), var(--dy)) scale(.15); }
    }
:where(body[data-page="forum-view"]) .forum-like-count {
        position: relative;
        display: inline-block;
        min-width: 1ch;
        height: 1.15em;
        overflow: hidden;
        line-height: 1.15em;
        vertical-align: middle;
    }
:where(body[data-page="forum-view"]) .forum-like-count-sizer {
        display: block;
        visibility: hidden;
        min-width: 1ch;
        white-space: nowrap;
    }
:where(body[data-page="forum-view"]) .forum-like-count-number {
        position: absolute;
        inset: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        white-space: nowrap;
    }
:where(body[data-page="forum-view"]) .forum-like-count-number.is-old { transform: translateY(0); }
:where(body[data-page="forum-view"]) .forum-like-count-number.is-new { transform: translateY(100%); }
:where(body[data-page="forum-view"]) .forum-like-count-number.is-old.is-leaving-up { animation: forumCountOldUp 600ms cubic-bezier(.2, 1.35, .35, 1) both; }
:where(body[data-page="forum-view"]) .forum-like-count-number.is-new.is-entering-up { animation: forumCountNewUp 600ms cubic-bezier(.2, 1.35, .35, 1) both; }
:where(body[data-page="forum-view"]) .forum-like-count-number.is-old.is-leaving-down { animation: forumCountOldDown 600ms cubic-bezier(.2, 1.35, .35, 1) both; }
:where(body[data-page="forum-view"]) .forum-like-count-number.is-new.is-entering-down { animation: forumCountNewDown 600ms cubic-bezier(.2, 1.35, .35, 1) both; }
@keyframes forumCountOldUp { to { transform: translateY(-100%); opacity: .2; } }
@keyframes forumCountNewUp { from { transform: translateY(100%); } to { transform: translateY(0); } }
@keyframes forumCountOldDown { to { transform: translateY(100%); opacity: .2; } }
@keyframes forumCountNewDown { from { transform: translateY(-100%); } to { transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) {
:where(body[data-page="forum-view"]) .forum-like-btn.is-bursting, :where(body[data-page="forum-view"]) .forum-like-btn.is-bursting .like-icon, :where(body[data-page="forum-view"]) .forum-like-particle, :where(body[data-page="forum-view"]) .forum-like-count-number.is-old, :where(body[data-page="forum-view"]) .forum-like-count-number.is-new {
            animation: none;
        }
:where(body[data-page="forum-view"]) .fv-comment.is-sand-deleting, :where(body[data-page="forum-view"]) .fv-reply.is-sand-deleting {
            transition: none;
        }
:where(body[data-page="forum-view"]) .fv-panels.is-ready, :where(body[data-page="forum-view"]) .fv-panels.is-ready .fv-panels-track, :where(body[data-page="forum-view"]) .fv-panels.is-ready .fv-panel {
            transition: none;
        }
}
:where(body[data-page="forum-view"]) .fv-comments {
        --fv-line: #eff3f4;
        --fv-text: #0f1419;
        --fv-muted: #536471;
        --fv-ink: #0f1419;
        
        --fv-hl: color-mix(in srgb, var(--brand) 18%, transparent);
    }
:where(body[data-page="forum-view"]) .fv-comments-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 18px 24px;
        border-bottom: 1px solid var(--fv-line);
    }
:where(body[data-page="forum-view"]) .fv-comments-title {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 18px;
        font-weight: 800;
        line-height: 1.4;
        color: var(--fv-ink);
    }
:where(body[data-page="forum-view"]) .fv-comments-title svg, :where(body[data-page="forum-view"]) .fv-comments-title i {
        width: 20px;
        height: 20px;
        color: var(--fv-muted);
    }
:where(body[data-page="forum-view"]) .fv-comments-count {
        font-size: 13px;
        font-weight: 500;
        color: var(--fv-muted);
        white-space: nowrap;
    }
:where(body[data-page="forum-view"]) .fv-comments-body {
        padding: 0;
    }
:where(body[data-page="forum-view"]) .fv-comments-pagination {
        padding: 18px 24px;
    }
:where(body[data-page="forum-view"]) .fv-comments-pagination + #forum-comment-form-default + .fv-composer {
        margin-top: 0;
    }
:where(body[data-page="forum-view"]) .fv-comment {
        position: relative;
        padding: 16px 24px;
        border-bottom: 1px solid var(--fv-line);
        transition: background 0.15s ease;
    }
:where(body[data-page="forum-view"]) .fv-comment-row {
        display: flex;
        gap: 12px;
    }
:where(body[data-page="forum-view"]) .fv-comment:hover {
        background: rgba(15, 23, 42, 0.015);
    }
:where(body[data-page="forum-view"]) .fv-comment:target .fv-comment-row, :where(body[data-page="forum-view"]) .fv-reply:target .fv-reply-row, :where(body[data-page="forum-view"]) .fv-comment-row.fv-highlight, :where(body[data-page="forum-view"]) .fv-reply-row.fv-highlight {
        border-radius: 5px;
        margin: -6px -10px;
        padding: 6px 10px;
        animation: fvMentionFlash 0.45s ease-in-out 3;
    }
@keyframes fvMentionFlash {
        0%, 100% { background-color: transparent; }
        50% { background-color: var(--fv-hl); }
    }
@media (prefers-reduced-motion: reduce) {
:where(body[data-page="forum-view"]) .fv-comment:target .fv-comment-row, :where(body[data-page="forum-view"]) .fv-reply:target .fv-reply-row, :where(body[data-page="forum-view"]) .fv-comment-row.fv-highlight, :where(body[data-page="forum-view"]) .fv-reply-row.fv-highlight {
            animation: none;
            background-color: var(--fv-hl);
        }
}
:where(body[data-page="forum-view"]) .fv-comment, :where(body[data-page="forum-view"]) .fv-reply {
        scroll-margin-top: 96px;
    }
:where(body[data-page="forum-view"]) .fv-comment-avatar {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        object-fit: cover;
        flex-shrink: 0;
        background: #e1e8ed;
    }
:where(body[data-page="forum-view"]) .fv-comment-main {
        flex: 1 1 auto;
        min-width: 0;
    }
:where(body[data-page="forum-view"]) .fv-comment-top {
        display: flex;
        align-items: center;
        gap: 8px;
        min-height: 20px;
        margin-bottom: 2px;
    }
:where(body[data-page="forum-view"]) .fv-comment-ident {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 6px;
        flex: 1 1 auto;
        min-width: 0;
    }
:where(body[data-page="forum-view"]) .fv-comment-name {
        font-size: 15px;
        font-weight: 700;
        line-height: 20px;
        color: var(--fv-ink);
        transition: text-decoration 0.15s ease;
    }
:where(body[data-page="forum-view"]) .fv-comment-name:hover {
        text-decoration: underline;
    }
:where(body[data-page="forum-view"]) .fv-comment .fv-badges .forum-user-badge, :where(body[data-page="forum-view"]) .fv-reply .fv-badges .forum-user-badge {
        padding: 1px 6px;
        font-size: 10px;
        opacity: 0.85;
    }
:where(body[data-page="forum-view"]) .fv-comment-stamp {
        display: flex;
        align-items: center;
        gap: 4px;
        flex-shrink: 0;
    }
:where(body[data-page="forum-view"]) .fv-comment-time {
        font-size: 13px;
        font-weight: 400;
        color: var(--fv-muted);
        white-space: nowrap;
    }
:where(body[data-page="forum-view"]) .fv-comment-text {
        margin-top: 3px;
        font-size: 15px;
        line-height: 1.62;
        color: var(--fv-text);
        word-break: break-word;
        overflow-wrap: anywhere;
    }
:where(body[data-page="forum-view"]) .fv-comment-text p {
        margin: 0 0 0.55em;
    }
:where(body[data-page="forum-view"]) .fv-comment-text p:first-child {
        margin-top: 0;
    }
:where(body[data-page="forum-view"]) .fv-comment-text p:last-child {
        margin-bottom: 0;
    }
:where(body[data-page="forum-view"]) .fv-inline-mention {
        color: var(--brand);
        font-weight: 600;
        text-decoration: none;
        transition: text-decoration 0.15s ease;
    }
:where(body[data-page="forum-view"]) .fv-inline-mention:hover {
        text-decoration: underline;
    }
:where(body[data-page="forum-view"]) .fv-comment-text > .fv-inline-mention + p {
        display: inline;
    }
:where(body[data-page="forum-view"]) .fv-comment-actions {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 2px;
        margin-top: 6px;
        margin-right: -8px;
    }
:where(body[data-page="forum-view"]) .fv-comment-actions form {
        display: contents;
    }
:where(body[data-page="forum-view"]) .fv-comment-actions .fv-comment-stamp {
        margin-right: auto;
    }
:where(body[data-page="forum-view"]) .fv-comment-actions .forum-like-btn, :where(body[data-page="forum-view"]) .fv-comment-actions .fv-mini-btn {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        height: 30px;
        padding: 0 8px;
        border: 0;
        border-radius: 5px;
        background: transparent;
        color: var(--fv-muted);
        font-size: 13px;
        font-weight: 500;
        line-height: 1;
        cursor: pointer;
        transition: background 0.15s ease, color 0.15s ease;
    }
:where(body[data-page="forum-view"]) .fv-comment-actions .forum-like-btn:hover, :where(body[data-page="forum-view"]) .fv-comment-actions .fv-mini-btn:hover {
        background: color-mix(in srgb, var(--brand) 10%, transparent);
        color: var(--brand);
    }
:where(body[data-page="forum-view"]) .fv-comment-actions .forum-like-btn.liked {
        background: color-mix(in srgb, var(--brand) 9%, transparent);
        color: var(--brand);
    }
:where(body[data-page="forum-view"]) .fv-comment-actions .forum-like-btn.liked:hover {
        background: color-mix(in srgb, var(--brand) 15%, transparent);
    }
:where(body[data-page="forum-view"]) .fv-comment-actions .forum-like-btn.liked .like-icon {
        fill: currentColor;
    }
:where(body[data-page="forum-view"]) .fv-comment-actions .forum-like-btn .like-icon {
        width: 17px;
        height: 17px;
        margin-right: 0;
    }
:where(body[data-page="forum-view"]) .fv-comment-actions .fv-mini-btn svg, :where(body[data-page="forum-view"]) .fv-comment-actions .fv-mini-btn i {
        width: 17px;
        height: 17px;
    }
:where(body[data-page="forum-view"]) .fv-comment-actions .fv-mini-btn.is-danger {
        color: var(--fv-muted);
    }
:where(body[data-page="forum-view"]) .fv-comment-actions .fv-mini-btn.is-danger:hover {
        background: rgba(244, 33, 46, 0.1);
        color: #f4212e;
    }
:where(body[data-page="forum-view"]) .fv-comment-actions a.fv-mini-btn {
        padding: 0 12px;
        border: 1px solid #cfd9de;
        background: #fff;
        color: var(--fv-ink);
        font-weight: 600;
    }
:where(body[data-page="forum-view"]) .fv-mini-btn {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        height: 32px;
        padding: 0 12px;
        border: 1px solid #cfd9de;
        border-radius: 5px;
        background: #fff;
        color: #0f1419;
        font-size: 14px;
        font-weight: 700;
        cursor: pointer;
        transition: all 0.15s ease;
    }
:where(body[data-page="forum-view"]) .fv-mini-btn:hover {
        background: rgba(15, 20, 25, 0.1);
    }
:where(body[data-page="forum-view"]) .fv-composer .fv-mini-btn.hidden {
        display: none;
    }
:where(body[data-page="forum-view"]) .fv-comment.is-sand-deleting, :where(body[data-page="forum-view"]) .fv-reply.is-sand-deleting {
        pointer-events: none;
        z-index: 2;
        transform-origin: center bottom;
        will-change: height, transform, clip-path;
        
        border-bottom-color: transparent;
        transition: border-bottom-color 0.2s ease 0.45s;
    }
:where(body[data-page="forum-view"]) .forum-sand-layer {
        position: fixed;
        inset: 0;
        z-index: 2147483647;
        pointer-events: none;
        overflow: visible;
    }
:where(body[data-page="forum-view"]) .forum-sand-particle {
        position: absolute;
        display: block;
        opacity: 0;
        box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
        will-change: transform, opacity;
    }
:where(body[data-page="forum-view"]) .fv-replies {
        margin: 10px 0 0 52px;
        padding-left: 14px;
        border-left: 2px solid var(--fv-line);
    }
:where(body[data-page="forum-view"]) .fv-reply {
        padding: 10px 0;
    }
:where(body[data-page="forum-view"]) .fv-reply:first-child {
        padding-top: 0;
    }
:where(body[data-page="forum-view"]) .fv-reply:last-child {
        padding-bottom: 0;
    }
:where(body[data-page="forum-view"]) .fv-reply-row {
        display: flex;
        align-items: flex-start;
        gap: 10px;
    }
:where(body[data-page="forum-view"]) .fv-reply .fv-comment-avatar {
        width: 30px;
        height: 30px;
    }
:where(body[data-page="forum-view"]) .fv-reply .fv-comment-main {
        flex: 1 1 auto;
        min-width: 0;
    }
:where(body[data-page="forum-view"]) .fv-reply .fv-comment-top {
        gap: 6px;
    }
:where(body[data-page="forum-view"]) .fv-reply .fv-comment-ident {
        gap: 5px;
    }
:where(body[data-page="forum-view"]) .fv-reply .fv-comment-name {
        font-size: 14px;
        line-height: 19px;
    }
:where(body[data-page="forum-view"]) .fv-reply .fv-comment-time {
        font-size: 12px;
    }
:where(body[data-page="forum-view"]) .fv-reply .fv-comment-text {
        margin-top: 2px;
        font-size: 14px;
        line-height: 1.6;
    }
:where(body[data-page="forum-view"]) .fv-reply .fv-comment-actions {
        margin-top: 4px;
    }
:where(body[data-page="forum-view"]) .fv-reply .fv-comment-actions .forum-like-btn, :where(body[data-page="forum-view"]) .fv-reply .fv-comment-actions .fv-mini-btn {
        height: 26px;
        padding: 0 7px;
        font-size: 12px;
    }
:where(body[data-page="forum-view"]) .fv-reply .fv-comment-actions .forum-like-btn .like-icon, :where(body[data-page="forum-view"]) .fv-reply .fv-comment-actions .fv-mini-btn svg, :where(body[data-page="forum-view"]) .fv-reply .fv-comment-actions .fv-mini-btn i {
        width: 15px;
        height: 15px;
    }
:where(body[data-page="forum-view"]) .fv-empty {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 10px;
        padding: 50px 20px;
        text-align: center;
        font-size: 15px;
        color: var(--fv-muted);
    }
:where(body[data-page="forum-view"]) .fv-empty i, :where(body[data-page="forum-view"]) .fv-empty svg {
        width: 32px;
        height: 32px;
        color: #cfd9de;
    }
:where(body[data-page="forum-view"]) .fv-composer {
        box-sizing: border-box;
        margin: 18px 24px 24px;
        padding: 16px 18px;
        border-radius: 5px;
        border: 1px solid #eef2f7;
        background: #f8fafd;
    }
:where(body[data-page="forum-view"]) .fv-composer-reply {
        position: relative;
        margin: 8px 0 12px;
        padding: 14px 16px 14px 18px;
        border: 1px solid color-mix(in srgb, var(--brand) 22%, var(--fv-line));
        border-radius: 10px;
        background: color-mix(in srgb, var(--brand) 5%, #ffffff);
    }
:where(body[data-page="forum-view"]) .fv-composer-reply[hidden] {
        display: none;
    }
:where(body[data-page="forum-view"]) .fv-composer-reply::before {
        content: '';
        position: absolute;
        left: 0;
        top: 12px;
        bottom: 12px;
        width: 3px;
        border-radius: 0 3px 3px 0;
        background: var(--brand);
    }
:where(body[data-page="forum-view"]) .fv-composer-reply .fv-composer-title {
        font-size: 13px;
    }
:where(body[data-page="forum-view"]) .fv-composer-target {
        font-weight: 700;
        color: #475569;
    }
:where(body[data-page="forum-view"]) .fv-reply > .fv-composer-reply {
        margin-left: 40px;
    }
:where(body[data-page="forum-view"]) .fv-composer.is-reply-animating {
        overflow: hidden;
        transition: height 300ms cubic-bezier(0.33, 0, 0.2, 1),
                    padding 300ms cubic-bezier(0.33, 0, 0.2, 1),
                    margin 300ms cubic-bezier(0.33, 0, 0.2, 1),
                    border-width 300ms cubic-bezier(0.33, 0, 0.2, 1);
        will-change: height;
    }
:where(body[data-page="forum-view"]) .fv-composer.is-reply-collapsed {
        height: 0;
        overflow: hidden;
        padding-top: 0;
        padding-bottom: 0;
        margin-top: 0;
        margin-bottom: 0;
        border-top-width: 0;
        border-bottom-width: 0;
    }
@media (prefers-reduced-motion: reduce) {
:where(body[data-page="forum-view"]) .fv-composer.is-reply-animating {
            transition: none;
        }
}
:where(body[data-page="forum-view"]) .fv-composer-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
    }
:where(body[data-page="forum-view"]) .fv-composer-title {
        font-size: 14px;
        font-weight: 800;
        color: #0f172a;
    }
:where(body[data-page="forum-view"]) .fv-composer-hint {
        margin-top: 3px;
        font-size: 12px;
        color: #94a3b8;
    }
:where(body[data-page="forum-view"]) .fe-md-bar {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 6px 8px;
        margin-top: 10px;
        padding: 7px 12px;
        border-radius: 5px;
        border: 1px solid #eef1f5;
        background: #f8fafc;
    }
:where(body[data-page="forum-view"]) .fe-md-tools {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 2px;
    }
:where(body[data-page="forum-view"]) .fe-md-sep {
        width: 1px;
        height: 16px;
        margin: 0 5px;
        background: #e9edf3;
    }
:where(body[data-page="forum-view"]) .fe-md-btn {
        position: relative;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 30px;
        height: 30px;
        border: 0;
        border-radius: 4px;
        background: transparent;
        color: #64748b;
        cursor: pointer;
        transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
    }
:where(body[data-page="forum-view"]) .fe-md-btn svg, :where(body[data-page="forum-view"]) .fe-md-btn i {
        width: 16px;
        height: 16px;
    }
:where(body[data-page="forum-view"]) .fe-md-btn:hover {
        background: #fff;
        color: var(--brand);
        box-shadow: 0 1px 3px rgba(15, 23, 42, 0.12);
    }
:where(body[data-page="forum-view"]) .fe-md-btn:focus-visible {
        outline: none;
        background: #fff;
        color: var(--brand);
        box-shadow: 0 0 0 3px var(--brand-soft);
    }
:where(body[data-page="forum-view"]) .fe-md-btn:active {
        transform: translateY(1px);
    }
:where(body[data-page="forum-view"]) .fe-md-btn::after {
        content: attr(data-md-name) "\A" attr(data-md-tip);
        position: absolute;
        left: 50%;
        bottom: calc(100% + 9px);
        transform: translate(-50%, 4px);
        padding: 6px 10px;
        border-radius: 5px;
        background: #0f172a;
        color: #e2e8f0;
        font-size: 11px;
        font-weight: 600;
        line-height: 1.55;
        text-align: center;
        white-space: pre;
        box-shadow: 0 8px 20px rgba(15, 23, 42, 0.18);
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.15s ease, transform 0.15s ease;
        z-index: 30;
    }
:where(body[data-page="forum-view"]) .fe-md-btn::before {
        content: "";
        position: absolute;
        left: 50%;
        bottom: calc(100% + 5px);
        width: 8px;
        height: 8px;
        transform: translate(-50%, 4px) rotate(45deg);
        border-radius: 1px;
        background: #0f172a;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.15s ease, transform 0.15s ease;
        z-index: 30;
    }
:where(body[data-page="forum-view"]) .fe-md-btn:hover::after, :where(body[data-page="forum-view"]) .fe-md-btn:hover::before, :where(body[data-page="forum-view"]) .fe-md-btn:focus-visible::after, :where(body[data-page="forum-view"]) .fe-md-btn:focus-visible::before {
        opacity: 1;
    }
:where(body[data-page="forum-view"]) .fe-md-btn:hover::after, :where(body[data-page="forum-view"]) .fe-md-btn:focus-visible::after {
        transform: translate(-50%, 0);
    }
:where(body[data-page="forum-view"]) .fe-md-btn:hover::before, :where(body[data-page="forum-view"]) .fe-md-btn:focus-visible::before {
        transform: translate(-50%, 0) rotate(45deg);
    }
:where(body[data-page="forum-view"]) .fv-composer textarea {
        display: block;
        width: 100%;
        min-height: 110px;
        margin-top: 12px;
        padding: 12px 14px;
        border-radius: 5px;
        border: 1px solid #e6e9ef;
        background: #fff;
        font-size: 14px;
        line-height: 1.8;
        color: #0f172a;
        outline: none;
        resize: vertical;
        transition: border-color 0.18s ease, box-shadow 0.18s ease;
    }
:where(body[data-page="forum-view"]) .fv-composer textarea:focus {
        border-color: var(--brand-border);
        box-shadow: 0 0 0 3px var(--brand-soft);
    }
:where(body[data-page="forum-view"]) .fv-composer-foot {
        margin-top: 12px;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 10px;
    }
:where(body[data-page="forum-view"]) .fv-tip-trigger {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        height: 30px;
        padding: 0 11px;
        margin-right: auto;
        border: 1px solid #e6e9ef;
        border-radius: 5px;
        background: #fff;
        color: #475569;
        font-size: 13px;
        font-weight: 700;
        line-height: 1;
        cursor: pointer;
        transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
    }
:where(body[data-page="forum-view"]) .fv-tip-trigger svg, :where(body[data-page="forum-view"]) .fv-tip-trigger i {
        width: 15px;
        height: 15px;
        color: #eba90f;
    }
:where(body[data-page="forum-view"]) .fv-tip-trigger:hover {
        border-color: #f5cf7a;
        background: #fffdf7;
        color: #b45309;
    }
:where(body[data-page="forum-view"]) .fv-tip-trigger.is-active {
        border-color: #eba90f;
        background: #fff7e6;
        color: #b45309;
    }
:where(body[data-page="forum-view"]) .fv-tip-trigger.hidden {
        display: none;
    }
:where(body[data-page="forum-view"]) .fv-tip-dialog-meta {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding-bottom: 14px;
        border-bottom: 1px solid #f1f5f9;
        font-size: 13px;
        color: var(--fv-muted);
    }
:where(body[data-page="forum-view"]) .fv-tip-dialog-target {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
:where(body[data-page="forum-view"]) .fv-tip-dialog-target b {
        color: #0f172a;
        font-weight: 700;
    }
:where(body[data-page="forum-view"]) .fv-tip-dialog-balance {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        flex: none;
        padding: 4px 11px;
        border-radius: 999px;
        background: #f6f8fb;
        font-size: 12px;
        white-space: nowrap;
    }
:where(body[data-page="forum-view"]) .fv-tip-dialog-balance b {
        color: #b45309;
        font-size: 13px;
        font-weight: 800;
    }
:where(body[data-page="forum-view"]) .fv-tip-dialog-chips {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 10px;
        margin-top: 14px;
    }
:where(body[data-page="forum-view"]) .fv-tip-chip {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 42px;
        border: 1px solid #e9edf3;
        border-radius: 8px;
        background: #fbfcfe;
        color: #334155;
        font-size: 15px;
        font-weight: 700;
        font-family: inherit;
        line-height: 1;
        cursor: pointer;
        transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
    }
:where(body[data-page="forum-view"]) .fv-tip-chip:hover {
        border-color: #f5cf7a;
        background: #fffdf7;
        color: #b45309;
    }
:where(body[data-page="forum-view"]) .fv-tip-chip.is-active {
        border-color: #eba90f;
        background: #fff7e6;
        color: #b45309;
        box-shadow: 0 0 0 3px rgba(235, 169, 15, 0.14);
    }
:where(body[data-page="forum-view"]) .fv-tip-dialog-custom {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-top: 14px;
    }
:where(body[data-page="forum-view"]) .fv-tip-dialog-custom-label {
        flex: none;
        font-size: 13px;
        color: var(--fv-muted);
    }
:where(body[data-page="forum-view"]) .fv-tip-input {
        flex: 1;
        min-width: 0;
        height: 40px;
        padding: 0 12px;
        border: 1px solid #e9edf3;
        border-radius: 8px;
        background: #fbfcfe;
        color: #0f172a;
        font-size: 14px;
        font-weight: 600;
        font-family: inherit;
        text-align: center;
        outline: none;
        transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
    }
:where(body[data-page="forum-view"]) .fv-tip-input:focus {
        border-color: #eba90f;
        background: #fff;
        box-shadow: 0 0 0 3px rgba(235, 169, 15, 0.16);
    }
:where(body[data-page="forum-view"]) .fv-tip-dialog-unit {
        flex: none;
        font-size: 13px;
        color: var(--fv-muted);
    }
:where(body[data-page="forum-view"]) .fv-tip-badge {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        padding: 2px 7px;
        border-radius: 5px;
        background: #fff7e6;
        color: #b45309;
        font-size: 11px;
        font-weight: 700;
        line-height: 1.4;
        white-space: nowrap;
    }
:where(body[data-page="forum-view"]) .fv-tip-badge svg, :where(body[data-page="forum-view"]) .fv-tip-badge i {
        width: 12px;
        height: 12px;
    }
:where(body[data-page="forum-view"]) .fv-card-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 15px 18px;
        border-bottom: 1px solid #f1f5f9;
    }
:where(body[data-page="forum-view"]) .fv-card-title {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 14px;
        font-weight: 800;
        color: #0f172a;
    }
:where(body[data-page="forum-view"]) .fv-card-title svg, :where(body[data-page="forum-view"]) .fv-card-title i {
        width: 16px;
        height: 16px;
        color: var(--brand);
    }
:where(body[data-page="forum-view"]) .fv-card-count {
        font-size: 12px;
        font-weight: 600;
        color: #94a3b8;
    }
:where(body[data-page="forum-view"]) .fv-author-card {
        padding: 20px 18px;
        text-align: center;
    }
:where(body[data-page="forum-view"]) .fv-avatar-lg {
        width: 64px;
        height: 64px;
        border-radius: 50%;
        object-fit: cover;
        background: #eef2f7;
        display: block;
        margin: 0 auto;
    }
:where(body[data-page="forum-view"]) .fv-author-card-name {
        display: inline-block;
        margin-top: 12px;
        font-size: 16px;
        font-weight: 800;
        color: #0f172a;
        transition: color 0.18s ease;
    }
:where(body[data-page="forum-view"]) .fv-author-card-name:hover {
        color: var(--brand);
    }
:where(body[data-page="forum-view"]) .fv-author-card .fv-badges {
        justify-content: center;
        margin-top: 10px;
    }
:where(body[data-page="forum-view"]) .fv-author-card .forum-user-badge {
        padding: 2px 7px;
        font-size: 11px;
    }
:where(body[data-page="forum-view"]) .fv-author-stats {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        margin-top: 16px;
    }
:where(body[data-page="forum-view"]) .fv-author-stat {
        border-radius: 5px;
        border: 1px solid #eef2f7;
        background: #f8fafd;
        padding: 10px 8px;
    }
:where(body[data-page="forum-view"]) .fv-author-stat b {
        display: block;
        font-size: 17px;
        line-height: 1.2;
        font-weight: 800;
        color: #0f172a;
    }
:where(body[data-page="forum-view"]) .fv-author-stat span {
        display: block;
        margin-top: 3px;
        font-size: 11px;
        color: #94a3b8;
    }
:where(body[data-page="forum-view"]) .fv-author-reg {
        margin-top: 12px;
        font-size: 12px;
        color: #94a3b8;
    }
:where(body[data-page="forum-view"]) .fv-author-card .fv-btn {
        margin-top: 14px;
    }
:where(body[data-page="forum-view"]) .fv-tabs {
        position: relative;
        display: flex;
        gap: 4px;
        padding: 4px;
        margin: 14px 16px 0;
        border-radius: 5px;
        background: #f2f4f8;
    }
:where(body[data-page="forum-view"]) .fv-tabs-indicator {
        position: absolute;
        top: 4px;
        bottom: 4px;
        left: 0;
        width: 0;
        border-radius: 5px;
        background: #fff;
        box-shadow: 0 2px 6px rgba(15, 23, 42, 0.12);
        pointer-events: none;
        transition: transform 0.34s cubic-bezier(0.4, 0, 0.2, 1), width 0.34s cubic-bezier(0.4, 0, 0.2, 1);
    }
:where(body[data-page="forum-view"]) .fv-tab {
        position: relative;
        z-index: 1;
        flex: 1;
        height: 28px;
        border-radius: 5px;
        color: #64748b;
        font-size: 12px;
        font-weight: 700;
        transition: color 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    }
:where(body[data-page="forum-view"]) .fv-tab:hover {
        color: var(--brand);
    }
:where(body[data-page="forum-view"]) .fv-tab.is-active {
        color: var(--brand);
        background: #fff;
        box-shadow: 0 2px 6px rgba(15, 23, 42, 0.10);
    }
:where(body[data-page="forum-view"]) .fv-tabs.has-indicator .fv-tab.is-active {
        background: transparent;
        box-shadow: none;
    }
:where(body[data-page="forum-view"]) .fv-panels {
        padding: 6px 16px 14px;
    }
:where(body[data-page="forum-view"]) .fv-panel {
        display: none;
    }
:where(body[data-page="forum-view"]) .fv-panel.is-active {
        display: block;
    }
:where(body[data-page="forum-view"]) .fv-panels.is-ready {
        position: relative;
        overflow: hidden;
        padding: 0;
        transition: height 340ms cubic-bezier(0.4, 0, 0.2, 1);
    }
:where(body[data-page="forum-view"]) .fv-panels.is-ready .fv-panels-track {
        display: flex;
        align-items: flex-start;
        width: 100%;
        transition: transform 340ms cubic-bezier(0.4, 0, 0.2, 1);
        will-change: transform;
    }
:where(body[data-page="forum-view"]) .fv-panels.is-ready .fv-panel {
        display: block;
        flex: 0 0 100%;
        min-width: 100%;
        box-sizing: border-box;
        padding: 6px 16px 14px;
        
        visibility: hidden;
        transition: visibility 0s linear 340ms;
    }
:where(body[data-page="forum-view"]) .fv-panels.is-ready .fv-panel.is-active {
        visibility: visible;
        transition: visibility 0s linear 0s;
    }
:where(body[data-page="forum-view"]) .fv-item {
        display: block;
        padding: 10px 0;
        border-bottom: 1px solid #f4f7fa;
    }
:where(body[data-page="forum-view"]) .fv-item:last-child {
        border-bottom: 0;
    }
:where(body[data-page="forum-view"]) .fv-item-title {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        font-size: 13px;
        font-weight: 700;
        line-height: 1.5;
        color: #334155;
        transition: color 0.18s ease;
    }
:where(body[data-page="forum-view"]) .fv-item:hover .fv-item-title {
        color: var(--brand);
    }
:where(body[data-page="forum-view"]) .fv-item-meta {
        margin-top: 5px;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 4px 10px;
        font-size: 11px;
        color: #a5aebb;
    }
:where(body[data-page="forum-view"]) .fv-item-summary {
        margin-top: 4px;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        font-size: 12px;
        line-height: 1.6;
        color: #64748b;
    }
:where(body[data-page="forum-view"]) .fv-item-app {
        display: flex;
        align-items: center;
        gap: 10px;
    }
:where(body[data-page="forum-view"]) .fv-item-app img {
        width: 38px;
        height: 38px;
        border-radius: 9px;
        object-fit: cover;
        background: #eef2f7;
        flex-shrink: 0;
    }
:where(body[data-page="forum-view"]) .fv-item-app .fv-item-main {
        min-width: 0;
        flex: 1;
    }
:where(body[data-page="forum-view"]) .fv-item-app .fv-item-title {
        -webkit-line-clamp: 1;
    }
:where(body[data-page="forum-view"]) .fv-item-empty {
        padding: 18px 0;
        text-align: center;
        font-size: 12px;
        color: #a5aebb;
    }
:where(body[data-page="forum-view"]) .fv-related-list {
        padding: 6px 16px 14px;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-crumb-path { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-crumb-path a { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-crumb-path a:hover { color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-crumb-sep { color: var(--uc-faint); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-crumb-current { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-flash.is-success {
        border-color: color-mix(in srgb, #22c55e 40%, transparent);
        background: color-mix(in srgb, #22c55e 14%, var(--uc-surface));
        color: #4ade80;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-flash.is-error {
        border-color: color-mix(in srgb, #ef4444 40%, transparent);
        background: color-mix(in srgb, #ef4444 14%, var(--uc-surface));
        color: #f87171;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-card {
        background: var(--uc-surface);
        border-color: color-mix(in srgb, var(--uc-border-strong) 60%, transparent);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-btn-ghost {
        border-color: var(--uc-border-strong);
        background: var(--uc-surface-2);
        color: var(--uc-text);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-btn-ghost:hover {
        background: var(--uc-primary-soft);
        color: var(--uc-primary);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-btn-primary {
        background: linear-gradient(135deg, var(--uc-primary) 0%, var(--uc-primary-dark) 100%);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-icon-btn {
        border-color: color-mix(in srgb, #ef4444 38%, transparent);
        background: color-mix(in srgb, #ef4444 12%, var(--uc-surface));
        color: #f87171;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-icon-btn:hover {
        background: color-mix(in srgb, #ef4444 20%, var(--uc-surface));
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tag {
        background: var(--uc-primary-soft);
        color: var(--uc-primary);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tag.is-plain {
        background: var(--uc-surface-3);
        color: var(--uc-muted);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-title { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-post-meta { border-top-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-post-foot { border-top-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-attach {
        border-color: color-mix(in srgb, var(--uc-border-strong) 60%, transparent);
        background: var(--uc-surface-2);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-attach-head {
        border-bottom-color: var(--uc-border);
        color: var(--uc-text-strong);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-attach-head svg {
        color: var(--uc-primary);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-attach-count {
        background: var(--uc-primary-soft);
        color: var(--uc-primary-ink);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-attach-item {
        border-color: var(--uc-border);
        background: var(--uc-surface);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-attach-item:hover {
        border-color: var(--uc-border-strong);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-attach-name {
        color: var(--uc-text-strong);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-attach-meta {
        color: var(--uc-muted);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-attach-download {
        border-color: var(--uc-border-strong);
        background: var(--uc-surface);
        color: var(--uc-text);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-attach-download:hover {
        border-color: var(--uc-primary);
        background: var(--uc-primary-soft);
        color: var(--uc-primary-ink);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-attach-cost {
        background: rgba(245, 158, 11, .16);
        color: #fbbf24;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-attach-owner-price {
        color: #fbbf24;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-attach-owned {
        background: rgba(34, 197, 94, .18);
        color: #4ade80;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-avatar { background: var(--uc-surface-3); color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-author-name { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-author-name:hover { color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-author-sub { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-metric { background: var(--uc-surface-2); color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-content { color: var(--uc-text); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .forum-like-btn {
        border-color: var(--uc-border-strong);
        background: var(--uc-surface-2);
        color: var(--uc-text);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .forum-like-btn:hover {
        border-color: color-mix(in srgb, var(--uc-primary) 45%, transparent);
        background: var(--uc-surface-2);
        color: var(--uc-primary);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .forum-like-btn.liked, html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-comment .forum-like-btn.liked, html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-reply .forum-like-btn.liked {
        border-color: color-mix(in srgb, var(--uc-primary) 45%, transparent);
        background: var(--uc-primary-soft);
        color: var(--uc-primary);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .forum-favorite-btn:hover, html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .forum-favorite-btn.liked {
        border-color: color-mix(in srgb, var(--uc-amber) 45%, transparent);
        background: var(--uc-amber-soft);
        color: var(--uc-amber);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-comments {
        --fv-line: var(--uc-surface-3);
        --fv-text: var(--uc-text);
        --fv-muted: var(--uc-muted);
        --fv-ink: var(--uc-text-strong);
        --fv-hl: color-mix(in srgb, var(--uc-primary) 32%, transparent);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-comment-avatar {
        background: var(--uc-surface-3);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-comment:hover {
        background: rgba(255, 255, 255, 0.025);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-comment-actions .forum-like-btn:hover, html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-comment-actions .fv-mini-btn:hover {
        background: var(--uc-primary-soft);
        color: var(--uc-primary);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-comment-actions a.fv-mini-btn {
        border-color: var(--uc-border-strong);
        background: var(--uc-surface-2);
        color: var(--uc-text);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-mini-btn {
        border-color: var(--uc-border-strong);
        background: var(--uc-surface-2);
        color: var(--uc-text);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-mini-btn:hover {
        background: var(--uc-surface-3);
        color: var(--uc-primary);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-empty i, html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-empty svg {
        color: var(--uc-border-strong);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-composer { background: var(--uc-surface-2); border-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-composer-reply {
        border-color: color-mix(in srgb, var(--uc-primary) 32%, var(--uc-surface-3));
        background: color-mix(in srgb, var(--uc-primary) 8%, var(--uc-surface-2));
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-composer-reply::before {
        background: var(--uc-primary);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-composer-target { color: var(--uc-text); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-composer-title { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-composer-hint { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-composer textarea {
        border-color: var(--uc-border-strong);
        background: var(--uc-surface);
        color: var(--uc-text-strong);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-composer textarea:focus {
        border-color: color-mix(in srgb, var(--uc-primary) 55%, transparent);
        box-shadow: 0 0 0 3px color-mix(in srgb, var(--uc-primary) 14%, transparent);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fe-md-bar {
        border-color: var(--uc-border);
        background: var(--uc-surface-2);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fe-md-sep { background: var(--uc-border-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fe-md-btn { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fe-md-btn:hover {
        background: var(--uc-surface);
        color: var(--uc-primary);
        box-shadow: none;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fe-md-btn:focus-visible {
        background: var(--uc-surface);
        color: var(--uc-primary);
        box-shadow: 0 0 0 3px var(--uc-primary-ring);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fe-md-btn::after, html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fe-md-btn::before {
        background: var(--uc-surface-3);
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fe-md-btn::after { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tip-trigger {
        background: var(--uc-surface);
        border-color: var(--uc-border-strong);
        color: var(--uc-text);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tip-trigger:hover {
        border-color: #f5cf7a;
        color: #fbbf24;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tip-trigger.is-active {
        background: color-mix(in srgb, #f59e0b 18%, transparent);
        border-color: #f59e0b;
        color: #fbbf24;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tip-dialog-meta {
        border-bottom-color: var(--uc-border-strong);
        color: var(--uc-muted);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tip-dialog-target b { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tip-dialog-balance {
        background: var(--uc-surface-2);
        color: var(--uc-muted);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tip-dialog-balance b { color: #fbbf24; }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tip-chip {
        background: var(--uc-surface-2);
        border-color: var(--uc-border-strong);
        color: var(--uc-text);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tip-chip:hover {
        border-color: #f5cf7a;
        color: #fbbf24;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tip-chip.is-active {
        background: color-mix(in srgb, #f59e0b 18%, transparent);
        border-color: #f59e0b;
        color: #fbbf24;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tip-input {
        background: var(--uc-surface-2);
        border-color: var(--uc-border-strong);
        color: var(--uc-text-strong);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tip-input:focus {
        border-color: #f59e0b;
        box-shadow: 0 0 0 3px color-mix(in srgb, #f59e0b 18%, transparent);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tip-dialog-custom-label, html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tip-dialog-unit { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tip-badge {
        background: color-mix(in srgb, #f59e0b 18%, transparent);
        color: #fbbf24;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-card-head { border-bottom-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-card-title { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-card-title svg, html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-card-title i { color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-card-count { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-avatar-lg { background: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-author-card-name { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-author-card-name:hover { color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-author-stat { background: var(--uc-surface-2); border-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-author-stat b { color: var(--uc-text-strong); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-author-stat span { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-author-reg { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tabs { background: var(--uc-surface-2); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tabs-indicator {
        background: var(--uc-surface-3);
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.28);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tab { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tab.is-active {
        color: var(--uc-primary);
        background: var(--uc-surface-3);
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-tabs.has-indicator .fv-tab.is-active {
        background: transparent;
    }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-item { border-bottom-color: var(--uc-surface-3); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-item-title { color: var(--uc-text); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-item:hover .fv-item-title { color: var(--uc-primary); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-item-meta { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-item-summary { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-item-empty { color: var(--uc-muted); }
html[data-uc-theme="dark"] :where(body[data-page="forum-view"]) .fv-mini-btn.is-danger {
        border-color: color-mix(in srgb, #ef4444 38%, transparent);
        background: color-mix(in srgb, #ef4444 12%, var(--uc-surface));
        color: #f87171;
    }
@media (max-width: 1180px) {
:where(body[data-page="forum-view"]) .fv-layout {
            grid-template-columns: minmax(0, 1fr) 260px;
            gap: 18px;
        }
}
@media (max-width: 1024px) {
:where(body[data-page="forum-view"]) .fv-wrap {
            padding: 20px 20px 44px;
        }
:where(body[data-page="forum-view"]) .fv-layout {
            grid-template-columns: minmax(0, 1fr);
        }
}
/* ==================================================================
 * 高级搜索页
 * ================================================================== */
:where(body[data-page="advanced-search"]) .custom-input, :where(body[data-page="advanced-search"]) .custom-select {
        background-color: #f3f4f6;
        border: 1px solid transparent;
        transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
    }
:where(body[data-page="advanced-search"]) .custom-input:focus, :where(body[data-page="advanced-search"]) .custom-select:focus {
        background-color: #ffffff;
        border-color: var(--uc-primary, #3b82f6);
        box-shadow: 0 0 0 3px var(--uc-primary-ring, rgba(59, 130, 246, 0.15));
        outline: none;
    }
:where(body[data-page="advanced-search"]) .radio-pill-group {
        position: relative; 
        display: flex;
        background: #f3f4f6;
        padding: 3px;
        border-radius: 5px;
        width: fit-content;
    }
:where(body[data-page="advanced-search"]) .radio-pill-group input[type="radio"] {
        display: none;
    }
:where(body[data-page="advanced-search"]) .radio-pill-group label {
        position: relative; 
        z-index: 1;
        padding: 6px 12px;
        font-size: 13px;
        font-weight: 500;
        color: #4b5563;
        border-radius: 5px;
        cursor: pointer;
        transition: color 0.25s cubic-bezier(0.4, 0, 0.2, 1); 
        white-space: nowrap;
    }
:where(body[data-page="advanced-search"]) .radio-pill-group input[type="radio"]:checked + label {
        color: #111827;
    }
:where(body[data-page="advanced-search"]) .pill-selection-indicator {
        position: absolute;
        z-index: 0; 
        top: 3px;
        bottom: 3px;
        left: 0; 
        background-color: #ffffff;
        border-radius: 5px;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
        transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }
:where(body[data-page="advanced-search"]) .app-result-list img[src=""] {
        color: transparent;
        background-color: #f3f4f6;
    }
/* ==================================================================
 * 应用详情页
 * ================================================================== */
:where(body[data-page="app-detail"]) .detail-wrap { max-width: 1120px; margin: 0 auto; padding: 24px 32px 64px; }
:where(body[data-page="app-detail"]) .detail-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 16px; font-size: 13px; color: #6b7280; }
:where(body[data-page="app-detail"]) .detail-breadcrumb a { color: #6b7280; transition: color .2s; }
:where(body[data-page="app-detail"]) .detail-breadcrumb a:hover { color: var(--uc-primary, #007AFF); }
:where(body[data-page="app-detail"]) .detail-breadcrumb .sep { color: #c7c7cc; }
:where(body[data-page="app-detail"]) .detail-hero { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 24px; background: #fff; border: 1px solid #ececec; border-radius: 5px; }
:where(body[data-page="app-detail"]) .detail-hero-main { display: flex; align-items: center; gap: 20px; min-width: 0; }
:where(body[data-page="app-detail"]) .detail-app-icon img { width: 112px; height: 112px; border-radius: 25px; object-fit: cover; box-shadow: 0 6px 18px rgba(0,0,0,.12); }
:where(body[data-page="app-detail"]) .detail-title-line { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
:where(body[data-page="app-detail"]) .detail-title-line h1 { font-size: 28px; font-weight: 700; line-height: 1.2; }
:where(body[data-page="app-detail"]) .detail-cat-chip { display: inline-flex; align-items: center; padding: 2px 10px; border-radius: 5px; background: var(--uc-primary-soft, #eff6ff); color: var(--uc-primary, #2563eb); font-size: 12px; font-weight: 600; }
:where(body[data-page="app-detail"]) .detail-cat-chip:hover { background: color-mix(in srgb, var(--uc-primary, #2563eb) 18%, #fff); }
:where(body[data-page="app-detail"]) .detail-meta-line { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; margin-top: 14px; font-size: 13px; color: #6b7280; }
:where(body[data-page="app-detail"]) .detail-meta-line span { display: inline-flex; align-items: center; gap: 6px; }
:where(body[data-page="app-detail"]) .detail-meta-line strong { color: #111827; font-weight: 600; }
:where(body[data-page="app-detail"]) .detail-hero-actions { display: flex; flex-direction: column; gap: 10px; flex-shrink: 0; width: 220px; }
:where(body[data-page="app-detail"]) .detail-download-wrap { position: relative; width: 100%; display: flex; justify-content: center; }
:where(body[data-page="app-detail"]) .detail-primary-button { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-width: 150px; height: 46px; padding: 0 14px; border-radius: 5px; background: var(--uc-primary, #007AFF); color: #fff; font-family: inherit; font-size: 15px; font-weight: 600; border: none; cursor: pointer; overflow: hidden; transition: width .3s ease, border-radius .3s ease, background-color .3s ease, color .3s ease; }
:where(body[data-page="app-detail"]) .detail-primary-button:hover { background: var(--uc-primary-dark, #0069d9); }
:where(body[data-page="app-detail"]) .detail-primary-button:focus-visible { outline: 2px solid color-mix(in srgb, var(--uc-primary, #007AFF) 50%, #fff); outline-offset: 2px; }
:where(body[data-page="app-detail"]) .detail-download-icon { display: flex; align-items: center; justify-content: center; flex-shrink: 0; opacity: .95; }
:where(body[data-page="app-detail"]) .detail-download-icon svg { width: 18px; height: 18px; }
:where(body[data-page="app-detail"]) .detail-download-label { flex: 0 0 auto; text-align: center; letter-spacing: .2px; }
:where(body[data-page="app-detail"]) .detail-download-chevron { display: flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: rgba(255,255,255,.14); flex-shrink: 0; transition: transform .35s cubic-bezier(.16,1,.3,1), background .25s ease; }
:where(body[data-page="app-detail"]) .detail-download-chevron svg { width: 14px; height: 14px; }
:where(body[data-page="app-detail"]) .detail-download-wrap.is-open .detail-download-chevron { transform: rotate(180deg); background: rgba(255,255,255,.24); }
:where(body[data-page="app-detail"]) .detail-download-spinner { display: none; width: 18px; height: 18px; border: 2px solid rgba(255,255,255,.35); border-top-color: #fff; border-radius: 50%; animation: detail-download-spin .7s linear infinite; flex-shrink: 0; }
:where(body[data-page="app-detail"]) .detail-download-status { display: none; align-items: center; justify-content: center; gap: 6px; width: 100%; font-size: 14px; font-weight: 600; white-space: nowrap; }
:where(body[data-page="app-detail"]) .detail-download-status svg { width: 22px; height: 22px; }
:where(body[data-page="app-detail"]) .detail-download-status-text { display: none; }
:where(body[data-page="app-detail"]) .detail-primary-button.is-loading, :where(body[data-page="app-detail"]) .detail-primary-button.is-success { width: 46px; min-width: 46px; padding: 0; justify-content: center; border-radius: 50%; cursor: default; pointer-events: none; }
:where(body[data-page="app-detail"]) .detail-primary-button.is-loading .detail-download-icon, :where(body[data-page="app-detail"]) .detail-primary-button.is-loading .detail-download-label, :where(body[data-page="app-detail"]) .detail-primary-button.is-loading .detail-download-chevron, :where(body[data-page="app-detail"]) .detail-primary-button.is-success .detail-download-icon, :where(body[data-page="app-detail"]) .detail-primary-button.is-success .detail-download-label, :where(body[data-page="app-detail"]) .detail-primary-button.is-success .detail-download-chevron, :where(body[data-page="app-detail"]) .detail-primary-button.is-redirecting .detail-download-icon, :where(body[data-page="app-detail"]) .detail-primary-button.is-redirecting .detail-download-label, :where(body[data-page="app-detail"]) .detail-primary-button.is-redirecting .detail-download-chevron { display: none; }
:where(body[data-page="app-detail"]) .detail-primary-button.is-loading .detail-download-spinner { display: block; }
:where(body[data-page="app-detail"]) .detail-primary-button.is-success { background: #dcfce7; color: #16a34a; }
:where(body[data-page="app-detail"]) .detail-primary-button.is-success .detail-download-status { display: inline-flex; }
:where(body[data-page="app-detail"]) .detail-primary-button.is-redirecting { width: 100%; min-width: 46px; padding: 0 14px; justify-content: center; border-radius: 5px; background: #fde68a; color: #92400e; cursor: default; pointer-events: none; }
:where(body[data-page="app-detail"]) .detail-primary-button.is-redirecting .detail-download-status { display: inline-flex; }
:where(body[data-page="app-detail"]) .detail-primary-button.is-redirecting .detail-download-status svg { display: none; }
:where(body[data-page="app-detail"]) .detail-primary-button.is-redirecting .detail-download-status-text { display: inline; }
@keyframes detail-download-spin { to { transform: rotate(360deg); } }
:where(body[data-page="app-detail"]) .detail-download-menu { position: absolute; top: calc(100% + 8px); right: 0; z-index: 40; width: 300px; padding: 7px; background: #fff; border: 1px solid #e8eaee; border-radius: 10px; box-shadow: 0 20px 45px rgba(15,23,42,.16), 0 6px 14px rgba(15,23,42,.06); opacity: 0; visibility: hidden; transform: translate3d(0,-6px,0) scale(.97); transform-origin: top right; transition: opacity .28s ease, transform .34s cubic-bezier(.16,1,.3,1), visibility 0s linear .34s; pointer-events: none; }
:where(body[data-page="app-detail"]) .detail-download-menu::before { content: ""; position: absolute; top: -5px; right: 22px; width: 9px; height: 9px; background: #fff; border-left: 1px solid #e8eaee; border-top: 1px solid #e8eaee; transform: rotate(45deg); }
:where(body[data-page="app-detail"]) .detail-download-wrap.is-open .detail-download-menu { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; pointer-events: auto; }
:where(body[data-page="app-detail"]) .detail-download-menu-head { display: flex; align-items: center; justify-content: space-between; padding: 5px 9px 7px; font-size: 12px; font-weight: 600; color: #9ca3af; letter-spacing: .2px; }
:where(body[data-page="app-detail"]) .detail-download-menu-head span:last-child { font-weight: 500; color: #c0c5ce; }
:where(body[data-page="app-detail"]) .detail-download-option { position: relative; display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px; border: 0; border-radius: 7px; background: transparent; text-align: left; font-family: inherit; cursor: pointer; transition: background .24s ease, transform .24s ease; }
:where(body[data-page="app-detail"]) .detail-download-option + .detail-download-option { margin-top: 1px; }
:where(body[data-page="app-detail"]) .detail-download-option:hover { background: #f7f9fc; }
:where(body[data-page="app-detail"]) .detail-download-option.is-coin:hover { background: #f3fdf7; }
:where(body[data-page="app-detail"]) .detail-download-option.is-free:hover { background: #f2f9ff; }
:where(body[data-page="app-detail"]) .detail-download-option:active { transform: scale(.992); }
:where(body[data-page="app-detail"]) .detail-download-option:focus-visible { outline: 2px solid var(--uc-primary, #007AFF); outline-offset: 1px; }
:where(body[data-page="app-detail"]) .detail-download-option-icon { display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 9px; flex-shrink: 0; transition: transform .28s cubic-bezier(.16,1,.3,1); }
:where(body[data-page="app-detail"]) .detail-download-option:hover .detail-download-option-icon { transform: scale(1.06) rotate(-2deg); }
:where(body[data-page="app-detail"]) .detail-download-option.is-coin .detail-download-option-icon { background: #ecfdf5; color: #16a34a; }
:where(body[data-page="app-detail"]) .detail-download-option.is-free .detail-download-option-icon { background: #e8f4ff; color: #0088ff; }
:where(body[data-page="app-detail"]) .detail-download-option-icon svg { width: 19px; height: 19px; }
:where(body[data-page="app-detail"]) .detail-download-option-copy { display: flex; flex-direction: column; flex: 1; min-width: 0; line-height: 1.25; }
:where(body[data-page="app-detail"]) .detail-download-option-copy strong { font-size: 14px; font-weight: 600; color: #111827; }
:where(body[data-page="app-detail"]) .detail-download-option-copy small { margin-top: 3px; font-size: 11.5px; color: #8b93a1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
:where(body[data-page="app-detail"]) .detail-download-option.is-coin .detail-download-option-copy small { color: #16a34a; }
:where(body[data-page="app-detail"]) .detail-download-option.is-free .detail-download-option-copy small { color: #0077e6; }
:where(body[data-page="app-detail"]) .detail-download-option-tail { display: flex; color: #c4c9d2; transition: transform .24s ease, color .24s ease; }
:where(body[data-page="app-detail"]) .detail-download-option-tail svg { width: 16px; height: 16px; }
:where(body[data-page="app-detail"]) .detail-download-option:hover .detail-download-option-tail { transform: translateX(2px); color: #6b7280; }
:where(body[data-page="app-detail"]) .detail-download-option.is-coin:hover .detail-download-option-tail { color: #16a34a; }
:where(body[data-page="app-detail"]) .detail-download-option.is-free:hover .detail-download-option-tail { color: #0088ff; }
@keyframes detail-download-spin { to { transform: rotate(360deg); } }
:where(body[data-page="app-detail"]) .detail-download-wrap.is-open .detail-download-option { animation: detail-download-option-in .38s cubic-bezier(.16,1,.3,1) both; }
:where(body[data-page="app-detail"]) .detail-download-wrap.is-open .detail-download-option:nth-of-type(2) { animation-delay: .06s; }
@keyframes detail-download-option-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
:where(body[data-page="app-detail"]) .detail-secondary-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-width: 150px; height: 46px; padding: 0 16px; border-radius: 5px; background: #fff; color: #4b5563; font-family: inherit; font-size: 14px; font-weight: 600; border: 1px solid #e5e7eb; cursor: pointer; transition: background .2s, border-color .2s, color .2s, transform .2s, box-shadow .2s; }
:where(body[data-page="app-detail"]) .detail-secondary-button:hover { background: var(--uc-primary-soft, #eff6ff); border-color: color-mix(in srgb, var(--uc-primary, #007AFF) 35%, #fff); color: var(--uc-primary, #007AFF); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(15,23,42,.05); }
:where(body[data-page="app-detail"]) .detail-secondary-button:active { transform: translateY(0); }
:where(body[data-page="app-detail"]) .detail-secondary-button:focus-visible { outline: 2px solid var(--uc-primary, #007AFF); outline-offset: 2px; }
@media (max-width: 860px) {
:where(body[data-page="app-detail"]) .detail-hero { flex-direction: column; align-items: stretch; }
:where(body[data-page="app-detail"]) .detail-hero-actions { width: 100%; }
:where(body[data-page="app-detail"]) .detail-download-menu { left: 0; right: 0; width: auto; transform-origin: top center; }
:where(body[data-page="app-detail"]) .detail-download-menu::before { right: 50%; margin-right: -5px; }
}
@media (prefers-reduced-motion: reduce) {
:where(body[data-page="app-detail"]) .detail-primary-button, :where(body[data-page="app-detail"]) .detail-download-chevron, :where(body[data-page="app-detail"]) .detail-download-menu, :where(body[data-page="app-detail"]) .detail-download-option, :where(body[data-page="app-detail"]) .detail-download-option-icon, :where(body[data-page="app-detail"]) .detail-download-option-tail, :where(body[data-page="app-detail"]) .detail-secondary-button { transition: none; }
:where(body[data-page="app-detail"]) .detail-download-wrap.is-open .detail-download-option { animation: none; }
}
:where(body[data-page="app-detail"]) .detail-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; margin-top: 20px; align-items: start; }
:where(body[data-page="app-detail"]) .detail-main-column { min-width: 0; }
:where(body[data-page="app-detail"]) .detail-side-column { position: sticky; top: 92px; align-self: start; }
:where(body[data-page="app-detail"]) .detail-panel { background: #fff; border: 1px solid #ececec; border-radius: 5px; padding: 20px 22px; margin-bottom: 20px; }
:where(body[data-page="app-detail"]) .detail-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
:where(body[data-page="app-detail"]) .detail-section-heading h2 { font-size: 18px; font-weight: 700; }
:where(body[data-page="app-detail"]) .detail-section-heading .detail-pill { padding: 2px 8px; border-radius: 5px; background: #f0f2f5; color: #6b7280; font-size: 11px; font-weight: 600; }
:where(body[data-page="app-detail"]) .detail-preview-list { display: flex; align-items: stretch; gap: 14px; overflow-x: auto; padding-bottom: 6px; }
:where(body[data-page="app-detail"]) .detail-preview-list img { height: 320px; width: auto; border-radius: 5px; border: 1px solid #ececec; flex-shrink: 0; }
:where(body[data-page="app-detail"]) .detail-empty { color: #9ca3af; font-size: 14px; }
:where(body[data-page="app-detail"]) .detail-submitter-wrap { margin-bottom: 20px; }
:where(body[data-page="app-detail"]) .detail-submitter { display: flex; align-items: center; gap: 14px; padding: 14px 18px; border: 1px solid #ededf0; border-radius: 5px; background: linear-gradient(180deg, #fff 0%, #fcfdff 100%); transition: border-color .22s ease, box-shadow .22s ease, background-color .22s ease; }
:where(body[data-page="app-detail"]) .detail-submitter:hover { border-color: color-mix(in srgb, var(--uc-primary, #2563eb) 34%, #e8eaee); box-shadow: 0 8px 22px rgba(15, 23, 42, .07); }
:where(body[data-page="app-detail"]) .detail-submitter:focus-visible { outline: 2px solid color-mix(in srgb, var(--uc-primary, #2563eb) 55%, transparent); outline-offset: 2px; }
:where(body[data-page="app-detail"]) .detail-submitter-avatar { display: flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 50%; overflow: hidden; flex-shrink: 0; background: #f2f5f9; color: #a9b2c0; box-shadow: 0 0 0 1px rgba(15, 23, 42, .06), 0 2px 6px rgba(15, 23, 42, .05); }
:where(body[data-page="app-detail"]) .detail-submitter-avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }
:where(body[data-page="app-detail"]) .detail-submitter:hover .detail-submitter-avatar { box-shadow: 0 0 0 2px color-mix(in srgb, var(--uc-primary, #2563eb) 30%, transparent), 0 2px 8px rgba(15, 23, 42, .08); }
:where(body[data-page="app-detail"]) .detail-submitter-main { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 0; }
:where(body[data-page="app-detail"]) .detail-submitter-name { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: 15px; font-weight: 700; line-height: 1.25; color: #111827; }
:where(body[data-page="app-detail"]) .detail-submitter-name > #submitter-name { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; letter-spacing: -.01em; }
:where(body[data-page="app-detail"]) .detail-submitter-self { padding: 1px 6px; border-radius: 4px; background: var(--uc-primary-soft, #eff6ff); color: var(--uc-primary, #2563eb); font-size: 10px; font-weight: 600; line-height: 15px; }
:where(body[data-page="app-detail"]) .detail-submitter-badges { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 5px; }
:where(body[data-page="app-detail"]) .detail-submitter-badge { padding: 0 6px; border-radius: 4px; font-size: 10px; font-weight: 600; line-height: 16px; white-space: nowrap; }
:where(body[data-page="app-detail"]) .detail-submitter-badge-img { display: block; width: auto; height: 17px; }
:where(body[data-page="app-detail"]) .detail-submitter-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: 12px; line-height: 1.45; color: #8f97a5; font-variant-numeric: tabular-nums; }
:where(body[data-page="app-detail"]) .detail-submitter-meta b { color: #3f4753; font-weight: 700; }
:where(body[data-page="app-detail"]) .detail-submitter-dot { width: 3px; height: 3px; border-radius: 50%; background: #d8dde5; flex-shrink: 0; }
:where(body[data-page="app-detail"]) .detail-submitter-side { display: flex; flex-direction: column; align-items: flex-end; justify-content: center; gap: 6px; flex-shrink: 0; padding-left: 18px; border-left: 1px solid #f2f4f7; text-align: right; }
:where(body[data-page="app-detail"]) .detail-submitter-pill { padding: 1px 8px; border-radius: 999px; background: #f5f7fa; color: #a0a8b5; font-size: 11px; font-weight: 500; line-height: 17px; white-space: nowrap; }
:where(body[data-page="app-detail"]) .detail-submitter-go { display: inline-flex; align-items: center; gap: 3px; font-size: 12.5px; font-weight: 600; line-height: 18px; color: var(--uc-primary, #2563eb); white-space: nowrap; }
:where(body[data-page="app-detail"]) .detail-submitter-go svg { width: 13px; height: 13px; transition: transform .22s ease; }
:where(body[data-page="app-detail"]) .detail-submitter:hover .detail-submitter-go { text-decoration: underline; text-underline-offset: 3px; }
:where(body[data-page="app-detail"]) .detail-submitter:hover .detail-submitter-go svg { transform: translateX(3px); }
:where(body[data-page="app-detail"]) .detail-preview-add { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; flex: 0 0 auto; width: 200px; height: 320px; border: 1px dashed #d1d5db; border-radius: 5px; background: #f9fafb; color: #9ca3af; text-align: center; transition: border-color .2s, color .2s, background .2s; }
:where(body[data-page="app-detail"]) .detail-preview-add:hover { border-color: var(--uc-primary, #2563eb); color: var(--uc-primary, #2563eb); background: var(--uc-primary-soft, #eff6ff); }
:where(body[data-page="app-detail"]) .detail-preview-add-frame { display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 50%; background: #fff; border: 1px solid #e5e7eb; transition: border-color .2s, background .2s; }
:where(body[data-page="app-detail"]) .detail-preview-add:hover .detail-preview-add-frame { border-color: currentColor; }
:where(body[data-page="app-detail"]) .detail-preview-add-plus { display: flex; }
:where(body[data-page="app-detail"]) .detail-preview-add strong { font-size: 14px; font-weight: 600; }
:where(body[data-page="app-detail"]) .detail-preview-add small { font-size: 12px; color: #9ca3af; }
:where(body[data-page="app-detail"]) .detail-preview-add:hover small { color: inherit; }
:where(body[data-page="app-detail"]) .detail-description { font-size: 14px; line-height: 1.9; color: #374151; white-space: pre-wrap; word-break: break-word; }
:where(body[data-page="app-detail"]) .detail-changelog { font-size: 14px; line-height: 1.9; color: #374151; white-space: pre-wrap; word-break: break-word; }
:where(body[data-page="app-detail"]) .detail-info-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; }
:where(body[data-page="app-detail"]) .detail-info-grid > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; background: #f9fafb; border-radius: 5px; font-size: 13px; }
:where(body[data-page="app-detail"]) .detail-info-grid > div.is-wide { grid-column: 1 / -1; }
:where(body[data-page="app-detail"]) .detail-info-grid span { color: #9ca3af; flex-shrink: 0; }
:where(body[data-page="app-detail"]) .detail-info-grid strong { color: #111827; font-weight: 600; text-align: right; word-break: break-all; }
:where(body[data-page="app-detail"]) .detail-info-grid .device-compat { display: inline-flex; align-items: center; gap: 10px; justify-content: flex-end; flex-wrap: wrap; }
:where(body[data-page="app-detail"]) .device-chip { display: inline-flex; align-items: center; gap: 7px; padding: 5px 12px; border-radius: 5px; font-size: 13px; font-weight: 600; border: 1px solid transparent; }
:where(body[data-page="app-detail"]) .device-chip .device-name { color: #111827; font-weight: 600; }
:where(body[data-page="app-detail"]) .device-chip > i { flex-shrink: 0; }
:where(body[data-page="app-detail"]) .device-chip .device-status { display: inline-flex; align-items: center; padding: 1px 8px; border-radius: 9999px; font-size: 12px; font-weight: 600; }
:where(body[data-page="app-detail"]) .device-chip.is-ok { background: #f0fdf4; border-color: #bbf7d0; }
:where(body[data-page="app-detail"]) .device-chip.is-ok > i { color: #16a34a; }
:where(body[data-page="app-detail"]) .device-chip.is-ok .device-status { background: #dcfce7; color: #15803d; }
:where(body[data-page="app-detail"]) .device-chip.is-no { background: #fef2f2; border-color: #fecaca; }
:where(body[data-page="app-detail"]) .device-chip.is-no > i { color: #dc2626; }
:where(body[data-page="app-detail"]) .device-chip.is-no .device-status { background: #fee2e2; color: #b91c1c; }
:where(body[data-page="app-detail"]) .detail-hint { margin-top: 14px; font-size: 12px; color: #9ca3af; line-height: 1.7; }
:where(body[data-page="app-detail"]) .detail-review-summary { display: flex; align-items: center; gap: 24px; padding: 16px; background: #f9fafb; border-radius: 5px; margin-bottom: 16px; }
:where(body[data-page="app-detail"]) .detail-review-score { text-align: center; flex-shrink: 0; }
:where(body[data-page="app-detail"]) .detail-review-score .num { font-size: 40px; font-weight: 700; line-height: 1; }
:where(body[data-page="app-detail"]) .detail-review-score .sub { font-size: 12px; color: #9ca3af; margin-top: 4px; }
:where(body[data-page="app-detail"]) .detail-review-bars { flex: 1; display: flex; flex-direction: column; gap: 6px; }
:where(body[data-page="app-detail"]) .detail-review-bar { display: flex; align-items: center; gap: 8px; font-size: 12px; color: #6b7280; }
:where(body[data-page="app-detail"]) .detail-review-bar .track { flex: 1; height: 6px; border-radius: 5px; background: #e5e7eb; overflow: hidden; }
:where(body[data-page="app-detail"]) .detail-review-bar .fill { display: block; height: 100%; border-radius: 5px; background: var(--uc-primary, #2563eb); }
:where(body[data-page="app-detail"]) .detail-review-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
:where(body[data-page="app-detail"]) .detail-review-item { padding: 14px 16px; border: 1px solid #f0f0f0; border-radius: 5px; }
:where(body[data-page="app-detail"]) .detail-review-item .head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
:where(body[data-page="app-detail"]) .detail-review-item .name { font-size: 13px; font-weight: 600; }
:where(body[data-page="app-detail"]) .detail-review-item .stars { color: #f59e0b; font-size: 13px; }
:where(body[data-page="app-detail"]) .detail-review-item .text { font-size: 13px; color: #4b5563; line-height: 1.7; }
:where(body[data-page="app-detail"]) .detail-review-item .meta { margin-top: 8px; font-size: 12px; color: #9ca3af; }
:where(body[data-page="app-detail"]) .detail-version-list { display: flex; flex-direction: column; gap: 8px; max-height: min(450px, calc(100vh - 350px)); overflow-y: auto; }
:where(body[data-page="app-detail"]) .detail-version-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; padding: 11px 13px; border: 1px solid #ececec; border-radius: 5px; background: #fff; cursor: pointer; text-align: left; transition: border-color .2s, background .2s; }
:where(body[data-page="app-detail"]) .detail-version-row:hover { border-color: color-mix(in srgb, var(--uc-primary, #007AFF) 45%, #fff); background: #f8fafc; }
:where(body[data-page="app-detail"]) .detail-version-row.is-selected { border-color: var(--uc-primary, #007AFF); background: var(--uc-primary-soft, #eff6ff); }
:where(body[data-page="app-detail"]) .detail-version-row .v-name { display: block; font-size: 14px; font-weight: 700; color: #111827; }
:where(body[data-page="app-detail"]) .detail-version-row .v-sub { display: block; margin-top: 3px; font-size: 12px; color: #9ca3af; }
:where(body[data-page="app-detail"]) .detail-version-row .v-check { color: var(--uc-primary, #007AFF); opacity: 0; flex-shrink: 0; }
:where(body[data-page="app-detail"]) .detail-version-row.is-selected .v-check { opacity: 1; }
:where(body[data-page="app-detail"]) .detail-install-note { background: #fff; border: 1px solid #ececec; border-radius: 5px; padding: 18px 20px; }
:where(body[data-page="app-detail"]) .detail-install-note h2 { font-size: 15px; font-weight: 700; margin-bottom: 8px; }
:where(body[data-page="app-detail"]) .detail-install-note p { font-size: 13px; color: #6b7280; line-height: 1.8; }
:where(body[data-page="app-detail"]) .detail-fav-btn { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; height: 44px; margin: 12px auto 0; padding: 0 18px; border-radius: 5px; background: #f0f2f5; color: #374151; font-size: 14px; font-weight: 600; border: none; cursor: pointer; overflow: hidden; transition: width .3s ease, border-radius .3s ease, background-color .3s ease, color .3s ease; }
:where(body[data-page="app-detail"]) .detail-fav-btn:hover { background: #e5e7eb; }
:where(body[data-page="app-detail"]) .detail-fav-btn.is-active { background: #fef2f2; color: #dc2626; }
:where(body[data-page="app-detail"]) .detail-fav-btn.is-active .fav-heart { fill: #dc2626; }
:where(body[data-page="app-detail"]) .detail-fav-btn .fav-content { display: inline-flex; align-items: center; justify-content: center; gap: 6px; white-space: nowrap; }
:where(body[data-page="app-detail"]) .detail-fav-btn.is-loading, :where(body[data-page="app-detail"]) .detail-fav-btn.is-success { width: 44px; padding: 0; border-radius: 50%; cursor: default; }
:where(body[data-page="app-detail"]) .detail-fav-btn.is-loading:hover { background: #f0f2f5; }
:where(body[data-page="app-detail"]) .detail-fav-btn.is-success { background: #dcfce7; color: #16a34a; }
:where(body[data-page="app-detail"]) .detail-fav-btn.is-loading .fav-content, :where(body[data-page="app-detail"]) .detail-fav-btn.is-success .fav-content { display: none; }
:where(body[data-page="app-detail"]) .detail-fav-btn.is-loading .fav-spinner { display: block; }
:where(body[data-page="app-detail"]) .detail-fav-btn.is-success .fav-check { display: block; }
:where(body[data-page="app-detail"]) .fav-spinner { display: none; width: 18px; height: 18px; border: 2px solid #d1d5db; border-top-color: #6b7280; border-radius: 50%; animation: fav-spin .7s linear infinite; }
:where(body[data-page="app-detail"]) .fav-check { display: none; width: 22px; height: 22px; }
@keyframes fav-spin { to { transform: rotate(360deg); } }
/* ==================================================================
 * 截图递交页
 * ================================================================== */
:where(body[data-page="app-screenshots"]) .shot-wrap { max-width: 1120px; margin: 0 auto; padding: 24px 32px 64px; }
:where(body[data-page="app-screenshots"]) .shot-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 16px; font-size: 13px; color: #6b7280; }
:where(body[data-page="app-screenshots"]) .shot-breadcrumb a { color: #6b7280; transition: color .2s; }
:where(body[data-page="app-screenshots"]) .shot-breadcrumb a:hover { color: var(--uc-primary, #2563eb); }
:where(body[data-page="app-screenshots"]) .shot-breadcrumb .sep { color: #c7c7cc; }
:where(body[data-page="app-screenshots"]) .shot-head { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; }
:where(body[data-page="app-screenshots"]) .shot-head-icon { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; background: var(--uc-primary-soft, #eff6ff); color: var(--uc-primary, #2563eb); flex-shrink: 0; }
:where(body[data-page="app-screenshots"]) .shot-head-copy { min-width: 0; }
:where(body[data-page="app-screenshots"]) .shot-head-copy h1 { font-size: 34px; font-weight: 700; line-height: 1.15; color: #111827; }
:where(body[data-page="app-screenshots"]) .shot-head-copy p { margin-top: 6px; font-size: 13px; color: #6b7280; }
:where(body[data-page="app-screenshots"]) .shot-head-back { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; padding: 8px 14px; border-radius: 5px; background: #f0f2f5; color: #374151; font-size: 13px; font-weight: 600; flex-shrink: 0; transition: background .2s; }
:where(body[data-page="app-screenshots"]) .shot-head-back:hover { background: #e5e7eb; }
:where(body[data-page="app-screenshots"]) .shot-card { background: #fff; border: 1px solid #ececec; border-radius: 5px; padding: 20px 22px; margin-bottom: 20px; }
:where(body[data-page="app-screenshots"]) .shot-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
:where(body[data-page="app-screenshots"]) .shot-card-head h2 { font-size: 18px; font-weight: 700; color: #111827; }
:where(body[data-page="app-screenshots"]) .shot-pill { padding: 3px 10px; border-radius: 5px; background: #f3f4f6; color: #6b7280; font-size: 12px; font-weight: 600; }
:where(body[data-page="app-screenshots"]) .shot-pill strong { color: var(--uc-primary, #2563eb); }
:where(body[data-page="app-screenshots"]) .shot-app { display: flex; align-items: center; gap: 18px; }
:where(body[data-page="app-screenshots"]) .shot-app-icon { width: 72px; height: 72px; border-radius: 16px; object-fit: cover; flex-shrink: 0; box-shadow: 0 4px 12px rgba(0,0,0,.10); }
:where(body[data-page="app-screenshots"]) .shot-app-copy { min-width: 0; flex: 1; }
:where(body[data-page="app-screenshots"]) .shot-app-copy h2 { font-size: 20px; font-weight: 700; color: #111827; }
:where(body[data-page="app-screenshots"]) .shot-app-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 10px; font-size: 13px; color: #6b7280; }
:where(body[data-page="app-screenshots"]) .shot-app-meta span { display: inline-flex; align-items: center; gap: 6px; }
:where(body[data-page="app-screenshots"]) .shot-app-meta strong { color: #111827; font-weight: 600; }
:where(body[data-page="app-screenshots"]) .shot-progress { width: 190px; flex-shrink: 0; }
:where(body[data-page="app-screenshots"]) .shot-progress-num { font-size: 13px; color: #6b7280; text-align: right; }
:where(body[data-page="app-screenshots"]) .shot-progress-num strong { font-size: 20px; font-weight: 700; color: var(--uc-primary, #2563eb); }
:where(body[data-page="app-screenshots"]) .shot-progress-bar { height: 6px; margin-top: 8px; border-radius: 9999px; background: #e5e7eb; overflow: hidden; }
:where(body[data-page="app-screenshots"]) .shot-progress-bar span { display: block; height: 100%; border-radius: 9999px; background: var(--uc-primary, #2563eb); transition: width .3s; }
:where(body[data-page="app-screenshots"]) .shot-progress-hint { margin-top: 8px; font-size: 12px; color: #9ca3af; text-align: right; }
:where(body[data-page="app-screenshots"]) .shot-columns { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; align-items: stretch; }
:where(body[data-page="app-screenshots"]) .shot-col-main { display: flex; flex-direction: column; min-width: 0; }
:where(body[data-page="app-screenshots"]) .shot-col-main > .shot-card { flex: 1 1 auto; }
:where(body[data-page="app-screenshots"]) .shot-col-side { align-self: start; position: sticky; top: 92px; }
:where(body[data-page="app-screenshots"]) .shot-columns .shot-card { margin-bottom: 0; }
:where(body[data-page="app-screenshots"]) .shot-upload { display: flex; flex-direction: column; }
:where(body[data-page="app-screenshots"]) .shot-file-input { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
:where(body[data-page="app-screenshots"]) .shot-preview-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
:where(body[data-page="app-screenshots"]) .shot-preview-item { position: relative; height: 180px; border: 1px solid #e5e7eb; border-radius: 5px; background: #f9fafb; overflow: hidden; display: flex; align-items: center; justify-content: center; }
:where(body[data-page="app-screenshots"]) .shot-preview-item img { max-width: 100%; max-height: 100%; object-fit: contain; }
:where(body[data-page="app-screenshots"]) .shot-preview-remove { position: absolute; top: 6px; right: 6px; z-index: 3; display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; border: none; border-radius: 9999px; background: rgba(0,0,0,.5); color: #fff; cursor: pointer; transition: background .2s; }
:where(body[data-page="app-screenshots"]) .shot-preview-remove:hover { background: #dc2626; }
:where(body[data-page="app-screenshots"]) .shot-preview-remove svg { width: 14px; height: 14px; }
:where(body[data-page="app-screenshots"]) .shot-preview-overlay { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 8px; background: rgba(0,0,0,.6); color: #fff; text-align: center; opacity: 0; visibility: hidden; transition: opacity .2s; }
:where(body[data-page="app-screenshots"]) .shot-preview-item.is-loading .shot-preview-overlay, :where(body[data-page="app-screenshots"]) .shot-preview-item.is-ok .shot-preview-overlay, :where(body[data-page="app-screenshots"]) .shot-preview-item.is-fail .shot-preview-overlay { opacity: 1; visibility: visible; }
:where(body[data-page="app-screenshots"]) .shot-preview-item.is-ok .shot-preview-overlay { background: rgba(22, 163, 74, .88); }
:where(body[data-page="app-screenshots"]) .shot-preview-item.is-fail .shot-preview-overlay { background: rgba(220, 38, 38, .88); }
:where(body[data-page="app-screenshots"]) .shot-preview-overlay svg { width: 22px; height: 22px; display: none; }
:where(body[data-page="app-screenshots"]) .shot-preview-item.is-loading .shot-ov-loading, :where(body[data-page="app-screenshots"]) .shot-preview-item.is-ok .shot-ov-ok, :where(body[data-page="app-screenshots"]) .shot-preview-item.is-fail .shot-ov-fail { display: block; }
:where(body[data-page="app-screenshots"]) .shot-preview-msg { font-size: 11px; line-height: 1.5; }
:where(body[data-page="app-screenshots"]) .shot-spin { animation: shot-spin .8s linear infinite; }
@keyframes shot-spin { to { transform: rotate(360deg); } }
:where(body[data-page="app-screenshots"]) .shot-dropzone { height: 180px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 12px; border: 2px dashed #d1d5db; border-radius: 5px; background: #f9fafb; color: #6b7280; text-align: center; cursor: pointer; transition: border-color .2s, background .2s, color .2s; }
:where(body[data-page="app-screenshots"]) .shot-preview-row.is-empty { flex: 1 1 auto; grid-auto-rows: 1fr; }
:where(body[data-page="app-screenshots"]) .shot-preview-row.is-empty .shot-dropzone { grid-column: 1 / -1; height: auto; min-height: 150px; }
:where(body[data-page="app-screenshots"]) .shot-preview-row.is-full .shot-dropzone { display: none; }
:where(body[data-page="app-screenshots"]) .shot-dropzone:hover { border-color: var(--uc-primary, #2563eb); background: var(--uc-primary-soft, #eff6ff); color: var(--uc-primary, #2563eb); }
:where(body[data-page="app-screenshots"]) .shot-dropzone strong { font-size: 14px; font-weight: 600; }
:where(body[data-page="app-screenshots"]) .shot-dropzone small { font-size: 12px; color: #9ca3af; }
:where(body[data-page="app-screenshots"]) .shot-dropzone.is-over { border-color: var(--uc-primary, #2563eb); background: var(--uc-primary-soft, #eff6ff); color: var(--uc-primary, #2563eb); }
:where(body[data-page="app-screenshots"]) .shot-dropzone.is-hidden { display: none; }
:where(body[data-page="app-screenshots"]) .shot-dropzone-short { display: none; font-size: 13px; font-weight: 600; }
:where(body[data-page="app-screenshots"]) .shot-preview-row:not(.is-empty) .shot-dropzone-long { display: none; }
:where(body[data-page="app-screenshots"]) .shot-preview-row:not(.is-empty) .shot-dropzone-short { display: block; }
:where(body[data-page="app-screenshots"]) .shot-actions { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 16px; }
:where(body[data-page="app-screenshots"]) .shot-status { font-size: 13px; color: #6b7280; }
:where(body[data-page="app-screenshots"]) .shot-status.is-ok { color: #16a34a; }
:where(body[data-page="app-screenshots"]) .shot-status.is-warn { color: #f59e0b; }
:where(body[data-page="app-screenshots"]) .shot-status.is-fail { color: #dc2626; }
:where(body[data-page="app-screenshots"]) .shot-btn-primary { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 11px 22px; border: none; border-radius: 5px; background: var(--uc-primary, #2563eb); color: #fff; font-size: 14px; font-weight: 600; cursor: pointer; transition: background .2s; }
:where(body[data-page="app-screenshots"]) .shot-btn-primary:hover { background: var(--uc-primary-dark, #0069d9); }
:where(body[data-page="app-screenshots"]) .shot-btn-primary:disabled { opacity: .5; cursor: not-allowed; }
:where(body[data-page="app-screenshots"]) .shot-done { display: flex; align-items: center; gap: 14px; }
:where(body[data-page="app-screenshots"]) .shot-done > svg { flex-shrink: 0; color: #16a34a; }
:where(body[data-page="app-screenshots"]) .shot-done strong { font-size: 15px; font-weight: 700; color: #111827; }
:where(body[data-page="app-screenshots"]) .shot-done p { margin-top: 4px; font-size: 13px; color: #6b7280; }
:where(body[data-page="app-screenshots"]) .shot-rules { padding: 20px 20px 18px; }
:where(body[data-page="app-screenshots"]) .shot-rules h2 { font-size: 17px; font-weight: 700; color: #111827; }
:where(body[data-page="app-screenshots"]) .shot-rules-list { display: flex; flex-direction: column; gap: 14px; margin-top: 16px; }
:where(body[data-page="app-screenshots"]) .shot-rules-item { display: flex; align-items: flex-start; gap: 10px; }
:where(body[data-page="app-screenshots"]) .shot-rules-icon { display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 8px; background: var(--uc-primary-soft, #eff6ff); color: var(--uc-primary-ink, #2563eb); flex-shrink: 0; }
:where(body[data-page="app-screenshots"]) .shot-rules-icon svg { width: 15px; height: 15px; }
:where(body[data-page="app-screenshots"]) .shot-rules-text { padding-top: 3px; font-size: 13px; line-height: 1.75; color: #6b7280; }
:where(body[data-page="app-screenshots"]) .shot-rules-btn { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; margin-top: 20px; padding: 11px 16px; border-radius: 5px; background: var(--uc-primary-soft, #eff6ff); color: var(--uc-primary-ink, #2563eb); font-size: 13.5px; font-weight: 600; transition: background .2s, color .2s; }
:where(body[data-page="app-screenshots"]) .shot-rules-btn:hover { background: var(--uc-primary, #2563eb); color: #fff; }
/* ==================================================================
 * 首页
 * ================================================================== */

/* ==================================================================
 * 评分与点评页
 * ================================================================== */
:where(body[data-page="ratings-and-reviews"]) .detail-wrap { max-width: 1120px; margin: 0 auto; padding: 24px 32px 64px; }
:where(body[data-page="ratings-and-reviews"]) .detail-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 16px; font-size: 13px; color: #6b7280; }
:where(body[data-page="ratings-and-reviews"]) .detail-breadcrumb a { color: #6b7280; transition: color .2s; }
:where(body[data-page="ratings-and-reviews"]) .detail-breadcrumb a:hover { color: var(--uc-primary, #007AFF); }
:where(body[data-page="ratings-and-reviews"]) .detail-breadcrumb .sep { color: #c7c7cc; }
:where(body[data-page="ratings-and-reviews"]) .detail-hero { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 24px; background: #fff; border: 1px solid #ececec; border-radius: 5px; }
:where(body[data-page="ratings-and-reviews"]) .detail-hero-main { display: flex; align-items: center; gap: 20px; min-width: 0; }
:where(body[data-page="ratings-and-reviews"]) .detail-app-icon img { width: 112px; height: 112px; border-radius: 25px; object-fit: cover; box-shadow: 0 6px 18px rgba(0,0,0,.12); }
:where(body[data-page="ratings-and-reviews"]) .detail-title-line { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
:where(body[data-page="ratings-and-reviews"]) .detail-title-line h1 { font-size: 28px; font-weight: 700; line-height: 1.2; }
:where(body[data-page="ratings-and-reviews"]) .detail-cat-chip { display: inline-flex; align-items: center; padding: 2px 10px; border-radius: 5px; background: var(--uc-primary-soft, #eff6ff); color: var(--uc-primary, #2563eb); font-size: 12px; font-weight: 600; }
:where(body[data-page="ratings-and-reviews"]) .detail-cat-chip:hover { background: color-mix(in srgb, var(--uc-primary, #2563eb) 18%, #fff); }
:where(body[data-page="ratings-and-reviews"]) .detail-meta-line { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; margin-top: 14px; font-size: 13px; color: #6b7280; }
:where(body[data-page="ratings-and-reviews"]) .detail-meta-line span { display: inline-flex; align-items: center; gap: 6px; }
:where(body[data-page="ratings-and-reviews"]) .detail-meta-line strong { color: #111827; font-weight: 600; }
:where(body[data-page="ratings-and-reviews"]) .detail-hero-actions { display: flex; flex-direction: column; gap: 10px; flex-shrink: 0; }
:where(body[data-page="ratings-and-reviews"]) .detail-primary-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-width: 150px; padding: 12px 22px; border-radius: 5px; background: var(--uc-primary, #007AFF); color: #fff; font-size: 15px; font-weight: 600; border: none; cursor: pointer; transition: background .2s; text-decoration: none; }
:where(body[data-page="ratings-and-reviews"]) .detail-primary-button:hover { background: var(--uc-primary-dark, #0069d9); }
:where(body[data-page="ratings-and-reviews"]) .detail-secondary-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-width: 150px; padding: 12px 22px; border-radius: 5px; background: #f0f2f5; color: #374151; font-size: 15px; font-weight: 600; border: none; cursor: pointer; transition: background .2s; text-decoration: none; }
:where(body[data-page="ratings-and-reviews"]) .detail-secondary-button:hover { background: #e5e7eb; }
:where(body[data-page="ratings-and-reviews"]) .detail-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; margin-top: 20px; align-items: start; }
:where(body[data-page="ratings-and-reviews"]) .detail-main-column { min-width: 0; }
:where(body[data-page="ratings-and-reviews"]) .detail-side-column { position: sticky; top: 92px; align-self: start; display: flex; flex-direction: column; gap: 20px; }
:where(body[data-page="ratings-and-reviews"]) .detail-panel { background: #fff; border: 1px solid #ececec; border-radius: 5px; padding: 20px 22px; margin-bottom: 20px; }
:where(body[data-page="ratings-and-reviews"]) .detail-main-column > .detail-panel:last-child { margin-bottom: 0; }
:where(body[data-page="ratings-and-reviews"]) .detail-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
:where(body[data-page="ratings-and-reviews"]) .detail-section-heading h2 { font-size: 18px; font-weight: 700; }
:where(body[data-page="ratings-and-reviews"]) .detail-pill { padding: 2px 8px; border-radius: 5px; background: #f0f2f5; color: #6b7280; font-size: 11px; font-weight: 600; }
:where(body[data-page="ratings-and-reviews"]) .detail-empty { color: #9ca3af; font-size: 14px; }
:where(body[data-page="ratings-and-reviews"]) .detail-review-summary { display: flex; align-items: center; gap: 28px; padding: 18px 22px; background: #f9fafb; border-radius: 5px; }
:where(body[data-page="ratings-and-reviews"]) .detail-review-score { text-align: center; flex-shrink: 0; padding-right: 28px; border-right: 1px solid #ececec; }
:where(body[data-page="ratings-and-reviews"]) .detail-review-score .num { font-size: 48px; font-weight: 700; line-height: 1; }
:where(body[data-page="ratings-and-reviews"]) .detail-review-score .sub { font-size: 12px; color: #9ca3af; margin-top: 6px; }
:where(body[data-page="ratings-and-reviews"]) .detail-review-bars { flex: 1; display: flex; flex-direction: column; gap: 7px; min-width: 0; }
:where(body[data-page="ratings-and-reviews"]) .detail-review-bar { display: flex; align-items: center; gap: 10px; font-size: 12px; color: #6b7280; }
:where(body[data-page="ratings-and-reviews"]) .detail-review-bar .bar-label { width: 34px; flex-shrink: 0; }
:where(body[data-page="ratings-and-reviews"]) .detail-review-bar .track { flex: 1; height: 6px; border-radius: 5px; background: #e5e7eb; overflow: hidden; }
:where(body[data-page="ratings-and-reviews"]) .detail-review-bar .fill { display: block; height: 100%; border-radius: 5px; background: var(--uc-primary, #2563eb); }
:where(body[data-page="ratings-and-reviews"]) .detail-review-bar .bar-count { width: 52px; text-align: right; flex-shrink: 0; color: #9ca3af; }
:where(body[data-page="ratings-and-reviews"]) .detail-review-total { text-align: center; flex-shrink: 0; padding-left: 28px; border-left: 1px solid #ececec; }
:where(body[data-page="ratings-and-reviews"]) .detail-review-total .num { font-size: 34px; font-weight: 700; line-height: 1.1; }
:where(body[data-page="ratings-and-reviews"]) .detail-review-total .sub { font-size: 12px; color: #9ca3af; margin-top: 6px; }
:where(body[data-page="ratings-and-reviews"]) .review-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
:where(body[data-page="ratings-and-reviews"]) .review-item { position: relative; display: flex; flex-direction: column; padding: 16px; border: 1px solid #f0f0f0; border-radius: 5px; overflow: visible; transition: border-color .2s, box-shadow .2s; }
:where(body[data-page="ratings-and-reviews"]) .review-item:hover { border-color: #e5e7eb; box-shadow: 0 4px 14px rgba(0,0,0,.04); }
:where(body[data-page="ratings-and-reviews"]) .review-item.is-featured { border-color: color-mix(in srgb, var(--uc-primary, #2563eb) 30%, #fff); background: color-mix(in srgb, var(--uc-primary, #2563eb) 4%, #fff); }
:where(body[data-page="ratings-and-reviews"]) .review-item.is-featured:hover { border-color: color-mix(in srgb, var(--uc-primary, #2563eb) 45%, #fff); }
:where(body[data-page="ratings-and-reviews"]) .review-item.is-sand-deleting { pointer-events: none; z-index: 2; transform-origin: center bottom; will-change: height, transform, clip-path; }
:where(body[data-page="ratings-and-reviews"]) .review-sand-layer { position: fixed; inset: 0; z-index: 2147483647; pointer-events: none; overflow: visible; }
:where(body[data-page="ratings-and-reviews"]) .review-sand-particle { position: absolute; display: block; opacity: 0; box-shadow: 0 1px 2px rgba(15, 23, 42, .12); will-change: transform, opacity; }
:where(body[data-page="ratings-and-reviews"]) .review-item-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
:where(body[data-page="ratings-and-reviews"]) .review-avatar { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; background: #f0f2f5; flex-shrink: 0; }
:where(body[data-page="ratings-and-reviews"]) .review-who { min-width: 0; flex: 1; }
:where(body[data-page="ratings-and-reviews"]) .review-name-line { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
:where(body[data-page="ratings-and-reviews"]) .review-name { font-size: 14px; font-weight: 600; color: #111827; }
:where(body[data-page="ratings-and-reviews"]) .review-tag { display: inline-flex; align-items: center; padding: 1px 6px; border-radius: 4px; font-size: 11px; font-weight: 600; line-height: 1.7; }
:where(body[data-page="ratings-and-reviews"]) .review-tag.is-pro { background: #eef2ff; color: #4f46e5; }
:where(body[data-page="ratings-and-reviews"]) .review-tag.is-hot { background: #fff7ed; color: #ea580c; }
:where(body[data-page="ratings-and-reviews"]) .review-tag.is-mine { background: var(--uc-primary-soft, #eff6ff); color: var(--uc-primary, #2563eb); }
:where(body[data-page="ratings-and-reviews"]) .review-tag.is-pending { background: #fef9c3; color: #a16207; }
:where(body[data-page="ratings-and-reviews"]) .review-stars { display: inline-flex; align-items: center; gap: 1px; font-size: 13px; line-height: 1.4; margin-top: 2px; }
:where(body[data-page="ratings-and-reviews"]) .review-stars .on { color: #f59e0b; letter-spacing: 1px; }
:where(body[data-page="ratings-and-reviews"]) .review-stars .off { color: #e5e7eb; letter-spacing: 1px; }
:where(body[data-page="ratings-and-reviews"]) .review-stars .score-num { margin-left: 6px; font-size: 12px; color: #9ca3af; letter-spacing: 0; }
:where(body[data-page="ratings-and-reviews"]) .review-item-text { font-size: 13px; color: #4b5563; line-height: 1.85; word-break: break-word; flex: 1; }
:where(body[data-page="ratings-and-reviews"]) .review-item-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 12px; padding-top: 10px; border-top: 1px solid #f5f5f7; }
:where(body[data-page="ratings-and-reviews"]) .review-item-meta { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: #9ca3af; min-width: 0; }
:where(body[data-page="ratings-and-reviews"]) .review-item-meta .txt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
:where(body[data-page="ratings-and-reviews"]) .review-actions { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; }
:where(body[data-page="ratings-and-reviews"]) .review-vote { position: relative; display: inline-flex; align-items: center; gap: 4px; flex: 0 0 auto; padding: 4px 8px; border-radius: 5px; background: #f7f8fa; color: #6b7280; font-size: 12px; white-space: nowrap; border: none; cursor: pointer; overflow: visible; isolation: isolate; transform-origin: center; will-change: transform, background-color, color; transition: background .2s, color .2s; }
:where(body[data-page="ratings-and-reviews"]) .review-vote:hover { background: color-mix(in srgb, var(--uc-primary, #2563eb) 10%, #fff); color: var(--uc-primary, #2563eb); }
:where(body[data-page="ratings-and-reviews"]) .review-vote.is-active { background: color-mix(in srgb, var(--uc-primary, #2563eb) 18%, #fff); color: var(--uc-primary, #2563eb); }
:where(body[data-page="ratings-and-reviews"]) .review-vote.is-danger:hover { background: #fef2f2; color: #dc2626; }
:where(body[data-page="ratings-and-reviews"]) .review-vote.is-bursting { animation: reviewVotePop 600ms cubic-bezier(.2, 1.45, .35, 1) both; }
:where(body[data-page="ratings-and-reviews"]) .review-vote.is-bursting svg { animation: reviewVoteIconPop 600ms cubic-bezier(.2, 1.45, .35, 1) both; }
:where(body[data-page="ratings-and-reviews"]) .review-vote-particles { position: absolute; left: 50%; top: 50%; width: 0; height: 0; pointer-events: none; z-index: 3; }
:where(body[data-page="ratings-and-reviews"]) .review-vote-particle { position: absolute; width: 4px; height: 4px; border-radius: 50%; background: var(--uc-primary, #2563eb); opacity: 0; transform: translate(-50%, -50%) translate(0, 0) scale(.55); animation: reviewVoteParticle 600ms cubic-bezier(.2, .75, .25, 1) both; }
:where(body[data-page="ratings-and-reviews"]) .review-vote-particle.is-down { background: #64748b; }
@keyframes reviewVotePop {
        0% { transform: scale(1); }
        16% { transform: scale(.78); }
        42% { transform: scale(1.18); }
        63% { transform: scale(.94); }
        82% { transform: scale(1.04); }
        100% { transform: scale(1); }
    }
@keyframes reviewVoteIconPop {
        0% { transform: scale(1); }
        22% { transform: scale(.82); }
        48% { transform: scale(1.2) rotate(-7deg); }
        70% { transform: scale(.96) rotate(2deg); }
        100% { transform: scale(1) rotate(0); }
    }
@keyframes reviewVoteParticle {
        0% { opacity: 0; transform: translate(-50%, -50%) translate(0, 0) scale(.55); }
        18% { opacity: 1; }
        100% { opacity: 0; transform: translate(-50%, -50%) translate(var(--dx), var(--dy)) scale(.15); }
    }
:where(body[data-page="ratings-and-reviews"]) .review-vote-count { position: relative; display: inline-block; flex: 0 0 auto; min-width: 1ch; height: 1.15em; overflow: hidden; line-height: 1.15em; vertical-align: middle; }
:where(body[data-page="ratings-and-reviews"]) .review-count-sizer { display: block; visibility: hidden; min-width: 1ch; white-space: nowrap; }
:where(body[data-page="ratings-and-reviews"]) .review-count-number { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; white-space: nowrap; }
:where(body[data-page="ratings-and-reviews"]) .review-count-number.is-old { transform: translateY(0); }
:where(body[data-page="ratings-and-reviews"]) .review-count-number.is-new { transform: translateY(100%); }
:where(body[data-page="ratings-and-reviews"]) .review-count-number.is-old.is-leaving-up { animation: reviewCountOldUp 600ms cubic-bezier(.2, 1.35, .35, 1) both; }
:where(body[data-page="ratings-and-reviews"]) .review-count-number.is-new.is-entering-up { animation: reviewCountNewUp 600ms cubic-bezier(.2, 1.35, .35, 1) both; }
:where(body[data-page="ratings-and-reviews"]) .review-count-number.is-old.is-leaving-down { animation: reviewCountOldDown 600ms cubic-bezier(.2, 1.35, .35, 1) both; }
:where(body[data-page="ratings-and-reviews"]) .review-count-number.is-new.is-entering-down { animation: reviewCountNewDown 600ms cubic-bezier(.2, 1.35, .35, 1) both; }
@keyframes reviewCountOldUp { to { transform: translateY(-100%); opacity: .2; } }
@keyframes reviewCountNewUp { from { transform: translateY(100%); } to { transform: translateY(0); } }
@keyframes reviewCountOldDown { to { transform: translateY(100%); opacity: .2; } }
@keyframes reviewCountNewDown { from { transform: translateY(-100%); } to { transform: translateY(0); } }
:where(body[data-page="ratings-and-reviews"]) .review-pagination { margin-top: 20px; }
:where(body[data-page="ratings-and-reviews"]) .review-app-mini { display: flex; align-items: center; gap: 12px; }
:where(body[data-page="ratings-and-reviews"]) .review-app-mini img { width: 56px; height: 56px; border-radius: 13px; object-fit: cover; flex-shrink: 0; box-shadow: 0 3px 10px rgba(0,0,0,.08); }
:where(body[data-page="ratings-and-reviews"]) .review-app-mini .info { min-width: 0; }
:where(body[data-page="ratings-and-reviews"]) .review-app-mini .info strong { display: block; font-size: 15px; font-weight: 700; color: #111827; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
:where(body[data-page="ratings-and-reviews"]) .review-app-mini .info .detail-cat-chip { margin-top: 6px; }
:where(body[data-page="ratings-and-reviews"]) .review-info-grid { display: flex; flex-direction: column; gap: 10px; margin-top: 16px; }
:where(body[data-page="ratings-and-reviews"]) .review-info-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; background: #f9fafb; border-radius: 5px; font-size: 13px; }
:where(body[data-page="ratings-and-reviews"]) .review-info-row span { color: #9ca3af; flex-shrink: 0; }
:where(body[data-page="ratings-and-reviews"]) .review-info-row strong { color: #111827; font-weight: 600; text-align: right; word-break: break-all; }
:where(body[data-page="ratings-and-reviews"]) .review-tip-card { background: #fff; border: 1px solid #ececec; border-radius: 5px; padding: 18px 20px; }
:where(body[data-page="ratings-and-reviews"]) .review-tip-card h2 { font-size: 15px; font-weight: 700; margin-bottom: 8px; }
:where(body[data-page="ratings-and-reviews"]) .review-tip-card p { font-size: 13px; color: #6b7280; line-height: 1.8; }
:where(body[data-page="ratings-and-reviews"]) .review-tip-card .detail-primary-button, :where(body[data-page="ratings-and-reviews"]) .review-tip-card .detail-secondary-button { width: 100%; margin-top: 14px; }
:where(body[data-page="ratings-and-reviews"]) .review-modal-mask { position: fixed; inset: 0; background: rgba(17,24,39,.55); z-index: 80; display: flex; align-items: center; justify-content: center; padding: 16px; opacity: 0; transition: opacity .25s ease; }
:where(body[data-page="ratings-and-reviews"]) .review-modal-mask.hidden { display: none; }
:where(body[data-page="ratings-and-reviews"]) .review-modal { width: 100%; max-width: 520px; background: #fff; border-radius: 5px; box-shadow: 0 24px 60px rgba(0,0,0,.28); padding: 28px; transform: scale(.96); transition: transform .25s ease; }
:where(body[data-page="ratings-and-reviews"]) .review-modal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
:where(body[data-page="ratings-and-reviews"]) .review-modal-head h2 { font-size: 20px; font-weight: 700; }
:where(body[data-page="ratings-and-reviews"]) .review-modal-close { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 5px; color: #9ca3af; background: transparent; border: none; cursor: pointer; transition: background .2s, color .2s; }
:where(body[data-page="ratings-and-reviews"]) .review-modal-close:hover { background: #f0f2f5; color: #4b5563; }
:where(body[data-page="ratings-and-reviews"]) .review-field { margin-bottom: 18px; }
:where(body[data-page="ratings-and-reviews"]) .review-field > label { display: block; font-size: 13px; font-weight: 600; color: #374151; margin-bottom: 8px; }
:where(body[data-page="ratings-and-reviews"]) .review-starpicker { display: flex; align-items: center; gap: 6px; }
:where(body[data-page="ratings-and-reviews"]) .review-starpicker [data-star] { width: 30px; height: 30px; cursor: pointer; color: #d1d5db; transition: color .15s, transform .15s; }
:where(body[data-page="ratings-and-reviews"]) .review-starpicker [data-star]:hover { transform: translateY(-1px); }
:where(body[data-page="ratings-and-reviews"]) .review-starpicker [data-star].is-on { color: #f59e0b; fill: currentColor; }
:where(body[data-page="ratings-and-reviews"]) .review-textarea { width: 100%; min-height: 120px; padding: 12px 14px; border: 1px solid #e5e7eb; border-radius: 5px; background: #f9fafb; font-size: 14px; color: #374151; line-height: 1.7; resize: vertical; outline: none; transition: border-color .2s, background .2s; }
:where(body[data-page="ratings-and-reviews"]) .review-textarea:focus { border-color: var(--uc-primary, #007AFF); background: #fff; }
:where(body[data-page="ratings-and-reviews"]) .review-submit-wrap { display: flex; justify-content: center; width: 100%; }
:where(body[data-page="ratings-and-reviews"]) .review-submit-button { width: 100%; min-width: 0; height: 46px; margin: 0 auto; padding: 12px 22px; overflow: hidden; transition: width 300ms cubic-bezier(.2, .85, .25, 1), min-width 300ms cubic-bezier(.2, .85, .25, 1), height 300ms cubic-bezier(.2, .85, .25, 1), padding 300ms cubic-bezier(.2, .85, .25, 1), border-radius 300ms cubic-bezier(.2, .85, .25, 1), background-color 220ms ease, color 220ms ease; }
:where(body[data-page="ratings-and-reviews"]) .review-submit-button.is-loading, :where(body[data-page="ratings-and-reviews"]) .review-submit-button.is-success-icon { width: 46px; min-width: 46px; height: 46px; padding: 0; border-radius: 50%; }
:where(body[data-page="ratings-and-reviews"]) .review-submit-button.is-loading { cursor: wait; }
:where(body[data-page="ratings-and-reviews"]) .review-submit-button.is-success-icon, :where(body[data-page="ratings-and-reviews"]) .review-submit-button.is-complete { background: #16a34a; color: #fff; }
:where(body[data-page="ratings-and-reviews"]) .review-submit-button.is-complete { width: 100%; min-width: 0; }
:where(body[data-page="ratings-and-reviews"]) .review-submit-button .review-submit-state { display: none; align-items: center; justify-content: center; }
:where(body[data-page="ratings-and-reviews"]) .review-submit-button.is-loading .review-submit-label, :where(body[data-page="ratings-and-reviews"]) .review-submit-button.is-loading .review-submit-success-label, :where(body[data-page="ratings-and-reviews"]) .review-submit-button.is-success-icon .review-submit-label, :where(body[data-page="ratings-and-reviews"]) .review-submit-button.is-success-icon .review-submit-success-label, :where(body[data-page="ratings-and-reviews"]) .review-submit-button.is-complete .review-submit-label, :where(body[data-page="ratings-and-reviews"]) .review-submit-button.is-complete .review-submit-loading, :where(body[data-page="ratings-and-reviews"]) .review-submit-button.is-complete .review-submit-check { display: none; }
:where(body[data-page="ratings-and-reviews"]) .review-submit-button.is-loading .review-submit-loading, :where(body[data-page="ratings-and-reviews"]) .review-submit-button.is-success-icon .review-submit-check, :where(body[data-page="ratings-and-reviews"]) .review-submit-button.is-complete .review-submit-success-label { display: inline-flex; }
:where(body[data-page="ratings-and-reviews"]) .review-submit-loading svg { animation: reviewSubmitSpin 800ms linear infinite; }
:where(body[data-page="ratings-and-reviews"]) .review-submit-check svg { animation: reviewSubmitCheck 360ms cubic-bezier(.2, 1.35, .35, 1) both; }
:where(body[data-page="ratings-and-reviews"]) .review-submit-button.is-error { animation: reviewSubmitShake 360ms ease both; }
@keyframes reviewSubmitSpin { to { transform: rotate(360deg); } }
@keyframes reviewSubmitCheck { 0% { opacity: 0; transform: scale(.35) rotate(-25deg); } 65% { opacity: 1; transform: scale(1.18) rotate(5deg); } 100% { opacity: 1; transform: scale(1) rotate(0); } }
@keyframes reviewSubmitShake { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-5px); } 50% { transform: translateX(5px); } 75% { transform: translateX(-3px); } }
:where(body[data-page="ratings-and-reviews"]) .review-modal.is-submit-closing { transform: scale(.72); transition: transform 300ms cubic-bezier(.2, .8, .2, 1); }
/* ==================================================================
 * 搜索结果页
 * ================================================================== */
:where(body[data-page="search"]) .app-result-list img[src=""] {
        color: transparent;
        background-color: #f3f4f6;
    }
/* ==================================================================
 * 我的截图
 * ================================================================== */
:where(body[data-page="my-screenshots"]) .uc-shot-thumb {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 118px;
        height: 74px;
        flex: 0 0 118px;
        overflow: hidden;
        border: 1px solid var(--uc-border);
        border-radius: var(--uc-radius);
        background: var(--uc-surface-2);
    }
:where(body[data-page="my-screenshots"]) .uc-shot-thumb img { max-width: 100%; max-height: 100%; object-fit: contain; }
:where(body[data-page="my-screenshots"]) .uc-shot-thumb .uc-shot-none { display: flex; align-items: center; justify-content: center; color: var(--uc-faint); }
:where(body[data-page="my-screenshots"]) .uc-shot-thumb .uc-shot-none svg { width: 20px; height: 20px; opacity: .6; }
:where(body[data-page="my-screenshots"]) .uc-shot-badge { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 5px; font-size: 11.5px; font-weight: 600; white-space: nowrap; }
:where(body[data-page="my-screenshots"]) .uc-shot-badge svg { width: 12px; height: 12px; }
:where(body[data-page="my-screenshots"]) .uc-shot-badge.is-pending { background: var(--uc-amber-soft);  color: var(--uc-amber); }
:where(body[data-page="my-screenshots"]) .uc-shot-badge.is-approved { background: var(--uc-green-soft);  color: var(--uc-green); }
:where(body[data-page="my-screenshots"]) .uc-shot-badge.is-rejected { background: var(--uc-red-soft);    color: var(--uc-red); }
:where(body[data-page="my-screenshots"]) .uc-shot-tip { margin-top: 6px; font-size: 12px; color: var(--uc-faint); }
@media (max-width: 900px) {
:where(body[data-page="my-screenshots"]) .uc-shot-thumb { width: 92px; height: 60px; flex-basis: 92px; }
}
/* ==================================================================
 * 服务条款
 * ================================================================== */
:where(body[data-page="user-tos"]) .tos-section { scroll-margin-top: 100px; }
:where(body[data-page="user-tos"]) .tos-section + .tos-section { margin-top: 36px; padding-top: 36px; border-top: 1px solid #e5e7eb; }
:where(body[data-page="user-tos"]) .tos-alert { border-left: 3px solid #f59e0b; }
:where(body[data-page="user-tos"]) .tos-alert strong { font-weight: 600; color: #92400e; }
:where(body[data-page="user-tos"]) .tos-body h2 { font-size: 18px; font-weight: 700; color: #111827; }
:where(body[data-page="user-tos"]) .tos-body p { margin-top: 10px; font-size: 15px; line-height: 1.9; color: #374151; }
:where(body[data-page="user-tos"]) .tos-body strong { font-weight: 600; color: #111827; }
:where(body[data-page="user-tos"]) .tos-body ul { margin-top: 10px; padding: 0; list-style: none; }
:where(body[data-page="user-tos"]) .tos-body ul > li { position: relative; padding-left: 18px; font-size: 15px; line-height: 1.9; color: #374151; }
:where(body[data-page="user-tos"]) .tos-body ul > li + li { margin-top: 6px; }
:where(body[data-page="user-tos"]) .tos-body ul > li::before { content: "—"; position: absolute; left: 0; color: #9ca3af; }
/* ==================================================================
 * 递交应用页
 * ================================================================== */
:where(body[data-page="up-app"]) .uc-row-link {
        color: var(--uc-primary-ink);
        font-weight: 600;
    }
:where(body[data-page="up-app"]) .uc-row-link:hover { text-decoration: underline; }