:root {
    --heo-maskbgdeep:#fff
}
#rightmenu-mask {
    pointer-events:none
}
.heoblogIcon {
    font-size:24px;
    color:var(--text_color);
    transition:color 0.3s
}
#rightMenu.kk-menu-anim {
    transition:transform 0.3s cubic-bezier(.28,.69,.38,.99),opacity 0.16s
}
.rightMenu-group {
    padding:1rem 0.3rem
}
.rightMenu-group:not(:nth-last-child(1)) {
    border-bottom:1px dashed var(--tf-rightmenu-hover-bg, var(--theme-color))
}
.rightMenu-item {
    border-radius:8px;
    border:1px solid transparent;
    transition:background-color .3s,color .3s,box-shadow .3s,border-color .3s,transform .3s;
    cursor:pointer;
    line-height:2rem;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    user-select:none;
    position:relative;
    background:none;
    box-shadow:none !important;
    padding-left:0.5rem
}
.rightMenu-item:hover {
    background-color:var(--tf-rightmenu-hover-bg, var(--theme-color));
    border-color:var(--tf-rightmenu-hover-bg, var(--theme-color));
    color:var(--tf-rightmenu-hover-text, #fff);
    box-shadow:0 6px 18px var(--tf-rightmenu-hover-shadow, rgba(66,90,239,.18)) !important
}
#rightMenu .rightMenu-item:hover,
#rightMenu .rightMenu-item:hover a,
#rightMenu .rightMenu-item:hover span,
#rightMenu .rightMenu-item:hover i,
#rightMenu .rightMenu-item:hover .heoblogIcon {
    color:var(--tf-rightmenu-hover-text, #fff) !important
}
.rightMenu-item i {
    display:inline-block;
    text-align:center;
    font-size:19px;
    margin-right:8px;
    margin-left:0;
    padding:0;
    color:#222 !important;
    transition:color 0.3s
}
.rightMenu-item span {
    display:inline-block;
    vertical-align:middle;
    font-size:15px
}
#rightMenu {
    display:none;
    position:fixed;
    padding:0 1rem;
    width:18rem;
    height:fit-content;
    top:10%;
    left:10%;
    border-radius:12px;
    z-index: 10010 !important;
    border:1px solid rgba(255,255,255,0.2);
    background:rgba(255,255,255,0.7);
    backdrop-filter:blur(10px)!important;
    -webkit-backdrop-filter:blur(10px);
    box-shadow:0 8px 32px rgba(0,0,0,0.1);
    overflow:visible;
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
    left:0 !important;
    top:0 !important;
    transform:translate(0,0);
    transition:transform 0.26s cubic-bezier(.28,.69,.38,.99),opacity 0.2s,border-color 0.68s ease,box-shadow 0.68s ease
}
#rightMenu:hover {
    border:1px solid var(--tf-rightmenu-hover-bg, var(--theme-color));
    box-shadow:0 10px 40px var(--tf-rightmenu-hover-shadow, rgba(66,90,239,0.08));
    -webkit-box-shadow:0 10px 40px var(--tf-rightmenu-hover-shadow, rgba(66,90,239,0.08));
    -moz-box-shadow:0 10px 40px var(--tf-rightmenu-hover-shadow, rgba(66,90,239,0.08));
    transition:border-color 0.68s ease,box-shadow 0.68s ease
}
#rightMenu .rightMenu-group.rightMenu-small {
    display:flex;
    justify-content:space-between;
    gap:0.5rem
}
#rightMenu .rightMenu-group.rightMenu-small .rightMenu-item {
    flex:1 1 0;
    margin:0 0.2rem;
    padding:0.5rem 0;
    font-size:18px;
    justify-content:center
}
#rightMenu .rightMenu-group.rightMenu-small .rightMenu-item i {
    margin:0;
    padding:0;
    font-size:22px;
    color:#222 !important
}
#rightMenu .rightMenu-group.rightMenu-small .rightMenu-item:hover i {
    color:var(--tf-rightmenu-hover-text, #fff) !important
}
#rightMenu .rightMenu-line .rightMenu-item {
    margin:1rem 0;
    padding:0.8rem 0 0.8rem 0.5rem;
    display:flex;
    align-items:center;
    justify-content:flex-start
}
#rightMenu .rightMenu-line .rightMenu-item i {
    margin:0 8px 0 0
}
#rightmenu-mask {
    position:fixed;
    width:100vw;
    height:100vh;
    top:0;
    left:0;
    display:none;
    z-index: 10009 !important; 
    margin:0 !important
}
#rightMenu .rightMenu-item,#rightMenu .rightMenu-item a,#rightMenu .rightMenu-item span {
    text-decoration:none !important
}
.rightMenu-item[heotip]:hover::after {
    display:none
}
#tf-rightmenu-tip {
    position:fixed;
    left:0;
    top:0;
    transform:translate(-9999px,-9999px);
    background:rgba(60,60,60,0.95);
    color:#fff;
    padding:3px 10px;
    border-radius:5px;
    font-size:13px;
    line-height:1.3;
    white-space:nowrap;
    pointer-events:none;
    opacity:0;
    z-index:2147483647;
    box-shadow:0 2px 8px rgba(0,0,0,0.12);
    transition:opacity .15s ease
}
#tf-rightmenu-tip.show {
    opacity:1
}
@media (prefers-color-scheme:dark) {
    #rightMenu {
        background:rgba(30,30,30,0.85);
        border:1px solid rgba(255,255,255,0.1);
        color:#eee;
        box-shadow:0 8px 32px rgba(0,0,0,0.25);
        backdrop-filter:blur(10px)!important;
        -webkit-backdrop-filter:blur(10px)
    }
    #rightMenu .rightMenu-item,#rightMenu .rightMenu-item a,#rightMenu .rightMenu-item span {
        color:#eee !important
    }
}
@keyframes barrageIn {
    from {
        opacity:0;
        transform:translate3d(0, 16px, 0)
    }
    to {
        opacity:1;
        transform:translate3d(0, 0, 0)
    }
}
@keyframes barrageOut {
    from {
        opacity:1;
        transform:translate3d(0, 0, 0)
    }
    to {
        opacity:0;
        transform:translate3d(0, 16px, 0)
    }
}
#wniui-popup-window {
    min-width:0 !important;
    max-width:none !important;
    width:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    bottom:20px !important;
    right:20px !important;
    position:fixed !important;
    border:none !important;
    border-radius:0 !important;
    background:transparent !important;
    color:var(--heo-fontcolor, #363636);
    z-index:2147483647 !important;
    box-shadow:none !important;
    overflow:visible !important;
    opacity:0;
    transform:translateY(20px);
    transition:opacity .3s ease, transform .3s ease;
    cursor:default
}
#wniui-popup-window:hover {
    border:none !important
}
#wniui-popup-window.wniui-show {
    opacity:1;
    transform:translateY(0)
}
#wniui-popup-window .comment-barrage-item {
    min-width:300px;
    max-width:300px;
    width:fit-content;
    min-height:80px;
    max-height:150px;
    margin:4px;
    padding:8px 14px;
    background:var(--heo-card-bg, #fff);
    border-radius:8px;
    color:var(--heo-fontcolor, #363636);
    animation:barrageIn .6s cubic-bezier(.42, 0, .3, 1.11);
    transition:.3s;
    display:flex;
    flex-direction:column;
    border:var(--style-border, 1px solid #e8edf5);
    position:relative;
    box-shadow:var(--heo-shadow-border, 0 10px 30px rgba(24,39,75,.12));
    overflow:hidden
}
#wniui-popup-window .comment-barrage-item:hover {
    border:1px solid var(--tf-hot-hover-border, var(--style-border-hover, var(--tf-rightmenu-hover-bg, var(--theme-color))));
    box-shadow:0 8px 20px var(--tf-hot-hover-shadow, rgba(24,39,75,.18))
}
#wniui-popup-window .comment-barrage-item.out {
    opacity:0;
    animation:barrageOut .6s cubic-bezier(.42, 0, .3, 1.11)
}
#wniui-popup-window .comment-barrage-item.hovered {
    opacity:0
}
#wniui-popup-window .comment-barrage-item .comment-barrage-close {
    color:var(--heo-secondtext, #7b8794);
    cursor:pointer;
    line-height:1;
    margin:4px
}
#wniui-popup-window .comment-barrage-item .comment-barrage-close:hover {
    color:var(--tf-hot-hover-bg, var(--tf-rightmenu-hover-bg, var(--theme-color)))
}
#wniui-popup-window .comment-barrage-item .comment-barrage-close .heoblogIcon {
    font-size:12px !important;
    color:var(--heo-fontcolor, #363636);
    transition:.3s
}
#wniui-popup-window .comment-barrage-item .comment-barrage-close:hover .heoblogIcon {
    color:var(--tf-hot-hover-bg, var(--tf-rightmenu-hover-bg, var(--theme-color)))
}
#wniui-popup-window .comment-barrage-item pre {
    display:none
}
#wniui-popup-window .comment-barrage-item li {
    display:none
}
#wniui-popup-window .comment-barrage-item p img:not(.tk-owo-emotion):not(.smilie-icon):not(.wp-smiley):not(.smilies) {
    display:none
}
#wniui-popup-window .comment-barrage-item p img.tk-owo-emotion,
#wniui-popup-window .comment-barrage-item p img.smilie-icon,
#wniui-popup-window .comment-barrage-item p img.wp-smiley,
#wniui-popup-window .comment-barrage-item p img.smilies {
    width:auto !important;
    height:24px !important;
    max-width:30px;
    max-height:24px;
    object-fit:contain;
    display:inline-block;
    padding:0;
    margin:0;
    transform:translateY(4px)
}
#wniui-popup-window .comment-barrage-item blockquote {
    display:none
}
#wniui-popup-window .comment-barrage-item br {
    display:none
}
#wniui-popup-window .comment-barrage-item .barrageHead {
    height:30px;
    line-height:30px;
    font-size:12px;
    border-bottom:var(--style-border, 1px solid #e8edf5);
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-weight:700;
    padding:0 0 6px
}
#wniui-popup-window .comment-barrage-item .barrageHead .barrageUser {
    display:flex;
    align-items:center;
    gap:8px;
    min-width:0
}
#wniui-popup-window .comment-barrage-item .barrageHead .barrageActions {
    display:flex;
    align-items:center;
    gap:6px;
    flex-shrink:0
}
#wniui-popup-window .comment-barrage-item .barrageHead .barrageTitle {
    color:var(--heo-fontcolor, #363636);
    background:var(--heo-secondbg, #f3f5f9);
    line-height:1;
    padding:4px;
    border-radius:4px;
    border:none;
    white-space:nowrap;
    text-decoration:none;
    transition:background-color .2s ease,color .2s ease
}
#wniui-popup-window .comment-barrage-item .barrageHead .barrageTitle:hover {
    background:var(--tf-hot-hover-bg, var(--tf-rightmenu-hover-bg, var(--theme-color)));
    color:var(--tf-hot-hover-text, #fff)
}
#wniui-popup-window .comment-barrage-item .barrageAvatar {
    width:16px;
    height:16px;
    margin:0;
    border-radius:50%;
    background:var(--heo-secondbg, #f3f5f9)
}
#wniui-popup-window .comment-barrage-item .barrageNick {
    max-width:140px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
#wniui-popup-window .comment-barrage-item .barrageContent {
    font-size:14px !important;
    font-weight:400 !important;
    height:calc(100% - 30px);
    overflow:hidden;
    width:100%;
    max-height:48px;
    text-decoration:none;
    color:inherit;
    cursor:pointer;
    background:transparent !important;
    box-shadow:none !important;
    transition:none
}
#wniui-popup-window .comment-barrage-item .barrageContent:hover {
    color:inherit;
    background:transparent !important;
    box-shadow:none !important
}
#wniui-popup-window .comment-barrage-item .barrageContent p,
#wniui-popup-window .comment-barrage-item .barrageContent p span,
#wniui-popup-window .comment-barrage-item .barrageContent p a {
    color:var(--heo-fontcolor, #363636);
    transition:color .2s ease
}
#wniui-popup-window .comment-barrage-item .barrageContent:hover p,
#wniui-popup-window .comment-barrage-item .barrageContent:hover p span,
#wniui-popup-window .comment-barrage-item .barrageContent:hover p a {
    color:var(--tf-hot-hover-bg, var(--tf-rightmenu-hover-bg, var(--theme-color)))
}
#wniui-popup-window .comment-barrage-item .barrageContent a {
    pointer-events:none;
    font-size:14px !important
}
#wniui-popup-window .comment-barrage-item .barrageContent::-webkit-scrollbar {
    height:0;
    width:4px
}
#wniui-popup-window .comment-barrage-item .barrageContent::-webkit-scrollbar-button {
    display:none
}
#wniui-popup-window .comment-barrage-item p {
    margin:8px 0;
    line-height:1.3;
    overflow:hidden;
    text-overflow:ellipsis;
    -webkit-line-clamp:2;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    font-size:14px;
    max-width:270px
}
#wniui-popup-window .comment-barrage-item .barrageContent h1,
#wniui-popup-window .comment-barrage-item .barrageContent h2,
#wniui-popup-window .comment-barrage-item .barrageContent h3,
#wniui-popup-window .comment-barrage-item .barrageContent h4 {
    font-size:14px !important;
    font-weight:400 !important;
    margin:8px 0 !important
}
@media screen and (max-width:768px) {
    #wniui-popup-window {
        display:none !important
    }
}
.wniui-popup-header,
.wniui-popup-window-divider,
.wniui-popup-window-content,
.wniui-popup-title,
.wniui-popup-author,
.wniui-popup-avatar {
    display:none !important
}