/* === ai === */
/* === 基础样式 === */
:root {
    --ai-primary: #4361EE;
    --ai-secondary: #3B82F6;
    --ai-light: #f8faff;
    --ai-shadow-light: rgba(255, 255, 255, 0.6);
    --ai-shadow-dark: rgba(0, 0, 0, 0.15);
    --ai-glow: rgba(67, 97, 238, 0.4);
}

/* === 模态框样式 === */
#deepseek-ai-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

#deepseek-ai-modal.active {
    opacity: 1;
    visibility: visible;
}

#deepseek-ai-container {
    width: calc(100% - 40px);
    max-width: 1200px;
    height: 90vh;
    max-height: 850px;
    display: flex;
    border-radius: 28px;
    overflow: hidden;
    transform: scale(0.85) translateY(40px) rotateX(2deg);
    opacity: 0;
    transition: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.92) 100%);
    backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
    border: 1px solid rgba(255, 255, 255, 0.8);
    box-shadow:
        0 30px 70px rgba(0, 0, 0, 0.15),
        0 10px 30px rgba(0, 0, 0, 0.08),
        inset 0 2px 10px rgba(255, 255, 255, 0.8),
        inset 0 -2px 10px rgba(0, 0, 0, 0.03),
        0 0 0 1px rgba(255, 255, 255, 0.5);
    position: relative;
}

#deepseek-ai-container::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.8), transparent);
}

#deepseek-ai-container::after {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle at 30% 30%, rgba(67, 97, 238, 0.03) 0%, transparent 50%);
    pointer-events: none;
}

#deepseek-ai-modal.active #deepseek-ai-container {
    transform: scale(1) translateY(0) rotateX(0);
    opacity: 1;
}

body.night #deepseek-ai-container {
    background: linear-gradient(135deg, rgba(20, 25, 40, 0.9) 0%, rgba(15, 20, 35, 0.95) 100%);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow:
        0 30px 70px rgba(0, 0, 0, 0.5),
        0 10px 30px rgba(0, 0, 0, 0.3),
        inset 0 2px 10px rgba(255, 255, 255, 0.1),
        inset 0 -2px 10px rgba(0, 0, 0, 0.3),
        0 0 0 1px rgba(255, 255, 255, 0.05);
}

body.night #deepseek-ai-container::after {
    background: radial-gradient(circle at 30% 30%, rgba(90, 143, 255, 0.05) 0%, transparent 50%);
}

#deepseek-ai-container.fullscreen {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: none !important;
    border-radius: 0 !important;
}

/* === 侧边栏样式 === */
.ai-sidebar {
    width: 320px;
    min-width: 320px;
    padding: 28px 22px;
    overflow-y: auto;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.4) 100%);
    backdrop-filter: blur(25px);
    -webkit-backdrop-filter: blur(25px);
    border-right: 1px solid rgba(255, 255, 255, 0.5);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.9),
        inset 0 -1px 0 rgba(0, 0, 0, 0.02);
    position: relative;
}

.ai-sidebar::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 1px;
    height: 100%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0.08) 50%, rgba(0, 0, 0, 0.05) 100%);
}

body.night .ai-sidebar {
    background: linear-gradient(180deg, rgba(30, 35, 50, 0.8) 0%, rgba(25, 30, 45, 0.85) 100%);
    border-right: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        inset 0 -1px 0 rgba(0, 0, 0, 0.2);
}

body.night .ai-sidebar::before {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.05) 50%, rgba(255, 255, 255, 0.02) 100%);
}

.ai-logo {
    text-align: center;
    margin-bottom: 35px;
    padding-bottom: 25px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    position: relative;
}

.ai-logo::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 50%;
    transform: translateX(-50%);
    width: 60%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(0, 0, 0, 0.1), transparent);
}

body.night .ai-logo {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.ai-icon {
    width: 110px;
    height: 110px;
    border-radius: 50%;
    margin: 0 auto 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0.7) 100%);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.6);
    box-shadow:
        0 12px 35px rgba(0, 0, 0, 0.08),
        0 5px 15px rgba(0, 0, 0, 0.05),
        inset 0 3px 12px rgba(255, 255, 255, 1),
        inset 0 -3px 8px rgba(0, 0, 0, 0.03),
        0 0 0 1px rgba(255, 255, 255, 0.4);
    position: relative;
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.ai-icon::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: conic-gradient(from 0deg at 50% 50%, transparent 0deg, rgba(67, 97, 238, 0.08) 180deg, transparent 360deg);
    animation: rotate 8s linear infinite;
}

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

.ai-icon:hover {
    transform: scale(1.08) translateY(-3px);
    box-shadow:
        0 18px 50px rgba(67, 97, 238, 0.15),
        0 8px 25px rgba(67, 97, 238, 0.1),
        inset 0 4px 15px rgba(255, 255, 255, 1),
        inset 0 -4px 10px rgba(0, 0, 0, 0.04),
        0 0 0 1px rgba(255, 255, 255, 0.5);
}

body.night .ai-icon {
    background: linear-gradient(145deg, rgba(40, 45, 60, 0.6) 0%, rgba(30, 35, 50, 0.7) 100%);
    border: 1px solid rgba(255, 255, 255, 0.15);
    box-shadow:
        0 12px 35px rgba(0, 0, 0, 0.3),
        0 5px 15px rgba(0, 0, 0, 0.2),
        inset 0 3px 12px rgba(255, 255, 255, 0.1),
        inset 0 -3px 8px rgba(0, 0, 0, 0.3),
        0 0 0 1px rgba(255, 255, 255, 0.08);
}

body.night .ai-icon:hover {
    box-shadow:
        0 18px 50px rgba(0, 0, 0, 0.4),
        0 8px 25px rgba(0, 0, 0, 0.25),
        inset 0 4px 15px rgba(255, 255, 255, 0.15),
        inset 0 -4px 10px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(255, 255, 255, 0.12);
}

#ai-logo-img {
    width: 88px;
    height: 88px;
    border-radius: 50%;
    object-fit: cover;
    box-shadow:
        0 8px 30px rgba(0, 0, 0, 0.18),
        0 4px 15px rgba(0, 0, 0, 0.12),
        0 0 0 5px rgba(255, 255, 255, 0.4),
        inset 0 2px 8px rgba(255, 255, 255, 0.3),
        inset 0 -2px 8px rgba(0, 0, 0, 0.1);
    border: 3px solid rgba(255, 255, 255, 0.5);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    z-index: 1;
}

#ai-logo-img:hover {
    transform: scale(1.08) translateY(-3px) rotate(3deg);
    box-shadow:
        0 15px 45px rgba(0, 0, 0, 0.25),
        0 8px 25px rgba(0, 0, 0, 0.18),
        0 0 0 7px rgba(255, 255, 255, 0.5),
        inset 0 3px 12px rgba(255, 255, 255, 0.4),
        inset 0 -3px 12px rgba(0, 0, 0, 0.12);
}

body.night #ai-logo-img {
    box-shadow:
        0 8px 30px rgba(0, 0, 0, 0.4),
        0 4px 15px rgba(0, 0, 0, 0.25),
        0 0 0 5px rgba(255, 255, 255, 0.2),
        inset 0 2px 8px rgba(255, 255, 255, 0.15),
        inset 0 -2px 8px rgba(0, 0, 0, 0.2);
}

body.night #ai-logo-img:hover {
    box-shadow:
        0 15px 45px rgba(0, 0, 0, 0.5),
        0 8px 25px rgba(0, 0, 0, 0.35),
        0 0 0 7px rgba(255, 255, 255, 0.25),
        inset 0 3px 12px rgba(255, 255, 255, 0.2),
        inset 0 -3px 12px rgba(0, 0, 0, 0.25);
}

#ai-title {
    font-size: 28px;
    font-weight: 900;
    background: linear-gradient(135deg, var(--ai-primary) 0%, var(--ai-secondary) 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    margin: 15px 0 10px;
    text-shadow:
        0 4px 20px rgba(67, 97, 238, 0.4),
        0 0 0 1px rgba(67, 97, 238, 0.15);
    letter-spacing: 0.8px;
    animation: shimmer 3s ease-in-out infinite;
    position: relative;
}

@keyframes shimmer {
    0%, 100% { background-position: 0% center; }
    50% { background-position: 200% center; }
}

body.night #ai-title {
    text-shadow:
        0 4px 20px rgba(90, 143, 255, 0.5),
        0 0 0 1px rgba(90, 143, 255, 0.2);
}

.data-panel, .recent-posts {
    margin-bottom: 32px;
}

.data-panel h4, .recent-posts h4 {
    font-size: 17px;
    font-weight: 700;
    background: linear-gradient(135deg, var(--ai-primary), var(--ai-secondary));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 18px;
    padding-bottom: 10px;
    border-bottom: 2px solid rgba(255, 255, 255, 0.12);
    display: flex;
    align-items: center;
    letter-spacing: 0.3px;
}

body.night .data-panel h4, 
body.night .recent-posts h4 {
    border-bottom: 2px solid rgba(255, 255, 255, 0.06);
}

.ai-stats {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
}

.stat-card {
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0.8) 100%);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-radius: 20px;
    padding: 22px 18px;
    text-align: center;
    box-shadow:
        0 8px 25px rgba(0, 0, 0, 0.06),
        0 4px 12px rgba(0, 0, 0, 0.04),
        inset 0 2px 8px rgba(255, 255, 255, 0.9),
        inset 0 -2px 6px rgba(0, 0, 0, 0.02);
    border: 1px solid rgba(0, 0, 0, 0.08);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
}

.stat-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.9), transparent);
}

.stat-card:hover {
    transform: translateY(-5px) scale(1.02);
    box-shadow:
        0 15px 40px rgba(67, 97, 238, 0.12),
        0 8px 20px rgba(0, 0, 0, 0.08),
        inset 0 3px 12px rgba(255, 255, 255, 1),
        inset 0 -3px 8px rgba(0, 0, 0, 0.04),
        0 0 0 2px rgba(67, 97, 238, 0.1);
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.88) 100%);
    border-color: rgba(67, 97, 238, 0.2);
}

body.night .stat-card {
    background: linear-gradient(145deg, rgba(35, 40, 55, 0.7) 0%, rgba(30, 35, 50, 0.75) 100%);
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow:
        0 8px 25px rgba(0, 0, 0, 0.2),
        0 4px 12px rgba(0, 0, 0, 0.15),
        inset 0 2px 8px rgba(255, 255, 255, 0.1),
        inset 0 -2px 6px rgba(0, 0, 0, 0.2);
}

body.night .stat-card:hover {
    box-shadow:
        0 15px 40px rgba(90, 143, 255, 0.2),
        0 8px 20px rgba(0, 0, 0, 0.25),
        inset 0 3px 12px rgba(255, 255, 255, 0.15),
        inset 0 -3px 8px rgba(0, 0, 0, 0.25),
        0 0 0 2px rgba(90, 143, 255, 0.15);
    border-color: rgba(90, 143, 255, 0.2);
}

.stat-value {
    font-size: 26px;
    font-weight: 800;
    background: linear-gradient(135deg, var(--ai-primary) 0%, var(--ai-secondary) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 8px;
    transition: all 0.3s ease;
}

.stat-card:hover .stat-value {
    transform: scale(1.1);
    filter: drop-shadow(0 4px 12px rgba(67, 97, 238, 0.4));
}

body.night .stat-value {
    filter: none;
}

.stat-label {
    font-size: 13px;
    color: #6b7280;
    font-weight: 500;
    letter-spacing: 0.3px;
}

body.night .stat-label {
    color: #9ca3af;
}

/* === 最近文章 === */
.recent-post {
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.85) 0%, rgba(255, 255, 255, 0.75) 100%);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border-radius: 18px;
    padding: 20px 18px;
    margin-bottom: 14px;
    box-shadow:
        0 6px 20px rgba(0, 0, 0, 0.04),
        0 3px 10px rgba(0, 0, 0, 0.02),
        inset 0 2px 6px rgba(255, 255, 255, 0.9),
        inset 0 -2px 6px rgba(0, 0, 0, 0.01);
    border: 1px solid rgba(0, 0, 0, 0.06);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
}

.recent-post::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: linear-gradient(180deg, var(--ai-primary) 0%, var(--ai-secondary) 100%);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.recent-post:hover::before {
    opacity: 1;
}

.recent-post:hover {
    transform: translateY(-4px) translateX(3px);
    box-shadow:
        0 12px 35px rgba(67, 97, 238, 0.1),
        0 6px 18px rgba(0, 0, 0, 0.06),
        inset 0 3px 10px rgba(255, 255, 255, 0.95),
        inset 0 -3px 8px rgba(0, 0, 0, 0.02),
        0 0 0 2px rgba(67, 97, 238, 0.1);
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.88) 100%);
    border-color: rgba(67, 97, 238, 0.15);
}

body.night .recent-post {
    background: linear-gradient(145deg, rgba(30, 35, 50, 0.6) 0%, rgba(25, 30, 45, 0.65) 100%);
    border: 1px solid rgba(255, 255, 255, 0.06);
    box-shadow:
        0 6px 20px rgba(0, 0, 0, 0.15),
        0 3px 10px rgba(0, 0, 0, 0.1),
        inset 0 2px 6px rgba(255, 255, 255, 0.08),
        inset 0 -2px 6px rgba(0, 0, 0, 0.2);
}

body.night .recent-post:hover {
    box-shadow:
        0 12px 35px rgba(90, 143, 255, 0.15),
        0 6px 18px rgba(0, 0, 0, 0.18),
        inset 0 3px 10px rgba(255, 255, 255, 0.12),
        inset 0 -3px 8px rgba(0, 0, 0, 0.25),
        0 0 0 2px rgba(90, 143, 255, 0.12);
    border-color: rgba(90, 143, 255, 0.12);
}

.post-title {
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 10px;
    color: #1f2937;
    line-height: 1.5;
    transition: color 0.3s ease;
}

.recent-post:hover .post-title {
    color: var(--ai-primary);
}

body.night .post-title {
    color: #e5e7eb;
}

body.night .recent-post:hover .post-title {
    color: #5a8fff;
}

.post-meta {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    color: #6b7280;
    font-weight: 500;
}

body.night .post-meta {
    color: #9ca3af;
}

/* === 聊天区域 === */
.ai-chat {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.15) 100%);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    position: relative;
    min-height: 0;
}

body.night .ai-chat {
    background: linear-gradient(180deg, rgba(20, 25, 40, 0.7) 0%, rgba(15, 20, 35, 0.75) 100%);
}

.chat-header {
    padding: 22px 28px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.3) 100%);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03);
}

body.night .chat-header {
    background: linear-gradient(90deg, rgba(25, 30, 45, 0.8) 0%, rgba(20, 25, 40, 0.85) 100%);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

#ai-chat-title {
    font-size: 20px;
    font-weight: 700;
    margin-left: 12px;
    background: linear-gradient(135deg, var(--ai-primary) 0%, var(--ai-secondary) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    letter-spacing: 0.3px;
}

body.night #ai-chat-title {
    filter: brightness(1.2);
}

.chat-header i {
    font-size: 22px;
    color: var(--ai-primary);
    transition: all 0.3s ease;
}

.chat-header i:hover {
    transform: scale(1.15) rotate(5deg);
    filter: drop-shadow(0 4px 12px rgba(67, 97, 238, 0.4));
}

body.night .chat-header i {
    color: #5a8fff;
}

.chat-actions {
    display: flex;
    gap: 14px;
}

.action-btn {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.95) 0%, rgba(248, 250, 255, 0.9) 100%);
    border: 1px solid rgba(0, 0, 0, 0.1);
    color: var(--ai-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    font-size: 15px;
    box-shadow:
        0 4px 15px rgba(0, 0, 0, 0.06),
        0 2px 6px rgba(0, 0, 0, 0.03),
        inset 0 1px 0 rgba(255, 255, 255, 0.9),
        inset 0 -1px 0 rgba(0, 0, 0, 0.02);
    position: relative;
    overflow: hidden;
}

.action-btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.8), transparent);
    transition: left 0.5s ease;
}

.action-btn:hover::before {
    left: 100%;
}

.action-btn:hover {
    transform: rotate(8deg) scale(1.12) translateY(-2px);
    background: linear-gradient(145deg, rgba(67, 97, 238, 0.1) 0%, rgba(67, 97, 238, 0.05) 100%);
    border-color: rgba(67, 97, 238, 0.3);
    box-shadow:
        0 8px 25px rgba(67, 97, 238, 0.2),
        0 4px 12px rgba(67, 97, 238, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.7),
        inset 0 -1px 0 rgba(0, 0, 0, 0.04);
}

.action-btn:active {
    transform: rotate(4deg) scale(0.98);
    box-shadow:
        0 2px 8px rgba(67, 97, 238, 0.15),
        inset 0 2px 4px rgba(0, 0, 0, 0.08);
}

body.night .action-btn {
    background: linear-gradient(145deg, rgba(45, 50, 65, 0.95) 0%, rgba(35, 40, 55, 0.9) 100%);
    border: 1px solid rgba(60, 65, 80, 0.8);
    color: #5a8fff;
    box-shadow:
        0 4px 15px rgba(0, 0, 0, 0.2),
        0 2px 6px rgba(0, 0, 0, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        inset 0 -1px 0 rgba(0, 0, 0, 0.2);
}

body.night .action-btn:hover {
    background: linear-gradient(145deg, rgba(90, 143, 255, 0.2) 0%, rgba(90, 143, 255, 0.1) 100%);
    border-color: rgba(90, 143, 255, 0.3);
    box-shadow:
        0 8px 25px rgba(90, 143, 255, 0.25),
        0 4px 12px rgba(90, 143, 255, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        inset 0 -1px 0 rgba(0, 0, 0, 0.22);
}

.chat-history {
    flex: 1;
    padding: 28px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 26px;
    scrollbar-width: thin;
    scrollbar-color: rgba(67, 97, 238, 0.3) transparent;
}

.chat-history::-webkit-scrollbar {
    width: 8px;
}

.chat-history::-webkit-scrollbar-track {
    background: transparent;
}

.chat-history::-webkit-scrollbar-thumb {
    background: rgba(67, 97, 238, 0.3);
    border-radius: 4px;
    transition: background 0.3s ease;
}

.chat-history::-webkit-scrollbar-thumb:hover {
    background: rgba(67, 97, 238, 0.5);
}

body.night .chat-history::-webkit-scrollbar-thumb {
    background: rgba(90, 143, 255, 0.3);
}

body.night .chat-history::-webkit-scrollbar-thumb:hover {
    background: rgba(90, 143, 255, 0.5);
}

/* 消息样式 */
.message {
    max-width: 85%;
    display: flex;
    flex-direction: column;
    animation: messageSlideIn 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes messageSlideIn {
    from { 
        opacity: 0; 
        transform: translateY(20px) scale(0.95); 
    }
    to { 
        opacity: 1; 
        transform: translateY(0) scale(1); 
    }
}

.message.ai {
    align-self: flex-start;
}

.message.user {
    align-self: flex-end;
}

.message-header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 12px;
    font-size: 14px;
    font-weight: 700;
    padding: 0 4px;
}

.message-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow:
        0 4px 15px rgba(0, 0, 0, 0.12),
        0 2px 6px rgba(0, 0, 0, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
    transition: all 0.3s ease;
}

.message-avatar:hover {
    transform: scale(1.1) rotate(5deg);
}

.message-avatar i {
    font-size: 18px;
}

.message.ai .message-avatar {
    background: linear-gradient(135deg, var(--ai-primary) 0%, var(--ai-secondary) 100%);
    color: white;
    box-shadow:
        0 6px 20px rgba(67, 97, 238, 0.3),
        0 3px 10px rgba(67, 97, 238, 0.2),
        inset 0 2px 0 rgba(255, 255, 255, 0.3);
}

.message.user .message-avatar {
    background: linear-gradient(135deg, #4cd0c5 0%, #66bbff 100%);
    color: white;
    box-shadow:
        0 6px 20px rgba(76, 208, 197, 0.3),
        0 3px 10px rgba(76, 208, 197, 0.2),
        inset 0 2px 0 rgba(255, 255, 255, 0.3);
}

.message-content {
    padding: 18px 24px;
    border-radius: 22px;
    line-height: 1.7;
    font-size: 15.5px;
    position: relative;
    overflow-wrap: break-word;
    transition: all 0.3s ease;
    box-shadow:
        0 6px 20px rgba(0, 0, 0, 0.08),
        0 3px 10px rgba(0, 0, 0, 0.05);
}

.message.ai .message-content {
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.9) 100%);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom-left-radius: 8px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow:
        0 8px 30px rgba(0, 0, 0, 0.06),
        0 4px 15px rgba(0, 0, 0, 0.04),
        inset 0 2px 8px rgba(255, 255, 255, 0.9),
        inset 0 -2px 6px rgba(0, 0, 0, 0.02);
    color: #1f2937;
}

.message.ai .message-content:hover {
    transform: translateY(-2px);
    box-shadow:
        0 12px 40px rgba(67, 97, 238, 0.08),
        0 6px 20px rgba(0, 0, 0, 0.06),
        inset 0 3px 12px rgba(255, 255, 255, 0.95),
        inset 0 -3px 8px rgba(0, 0, 0, 0.02);
    border-color: rgba(67, 97, 238, 0.15);
}

.message.user .message-content {
    background: linear-gradient(145deg, rgba(67, 97, 238, 0.12) 0%, rgba(59, 130, 246, 0.08) 100%);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom-right-radius: 8px;
    border: 1px solid rgba(67, 97, 238, 0.2);
    box-shadow:
        0 8px 30px rgba(67, 97, 238, 0.12),
        0 4px 15px rgba(67, 97, 238, 0.08),
        inset 0 2px 8px rgba(255, 255, 255, 0.3),
        inset 0 -2px 6px rgba(0, 0, 0, 0.02);
    color: #1f2937;
}

.message.user .message-content:hover {
    transform: translateY(-2px);
    box-shadow:
        0 12px 40px rgba(67, 97, 238, 0.18),
        0 6px 20px rgba(67, 97, 238, 0.12),
        inset 0 3px 12px rgba(255, 255, 255, 0.4),
        inset 0 -3px 8px rgba(0, 0, 0, 0.03);
    border-color: rgba(67, 97, 238, 0.3);
}

body.night .message.ai .message-content {
    background: linear-gradient(145deg, rgba(35, 40, 55, 0.85) 0%, rgba(30, 35, 50, 0.9) 100%);
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow:
        0 8px 30px rgba(0, 0, 0, 0.2),
        0 4px 15px rgba(0, 0, 0, 0.15),
        inset 0 2px 8px rgba(255, 255, 255, 0.1),
        inset 0 -2px 6px rgba(0, 0, 0, 0.2);
    color: #e5e7eb;
}

body.night .message.ai .message-content:hover {
    box-shadow:
        0 12px 40px rgba(90, 143, 255, 0.15),
        0 6px 20px rgba(0, 0, 0, 0.18),
        inset 0 3px 12px rgba(255, 255, 255, 0.15),
        inset 0 -3px 8px rgba(0, 0, 0, 0.25);
    border-color: rgba(90, 143, 255, 0.15);
}

body.night .message.user .message-content {
    background: linear-gradient(145deg, rgba(67, 97, 238, 0.3) 0%, rgba(59, 130, 246, 0.25) 100%);
    border: 1px solid rgba(67, 97, 238, 0.35);
    box-shadow:
        0 8px 30px rgba(67, 97, 238, 0.2),
        0 4px 15px rgba(67, 97, 238, 0.15),
        inset 0 2px 8px rgba(255, 255, 255, 0.15),
        inset 0 -2px 6px rgba(0, 0, 0, 0.15);
    color: #e5e7eb;
}

body.night .message.user .message-content:hover {
    box-shadow:
        0 12px 40px rgba(67, 97, 238, 0.3),
        0 6px 20px rgba(67, 97, 238, 0.22),
        inset 0 3px 12px rgba(255, 255, 255, 0.2),
        inset 0 -3px 8px rgba(0, 0, 0, 0.2);
    border-color: rgba(90, 143, 255, 0.25);
}

/* 输入区域 */
.input-area {
    padding: 28px;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.08) 100%);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
}

body.night .input-area {
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    background: linear-gradient(180deg, rgba(20, 25, 40, 0.6) 0%, rgba(15, 20, 35, 0.65) 100%);
}

.input-wrapper {
    display: flex;
    gap: 18px;
    position: relative;
    align-items: flex-end;
}

#ai-chat-input {
    flex: 1;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.9) 100%);
    backdrop-filter: blur(25px);
    -webkit-backdrop-filter: blur(25px);
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 24px;
    color: #1f2937;
    padding: 22px 28px;
    min-height: 100px;
    max-height: 220px;
    outline: none;
    resize: vertical;
    font-size: 16px;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    line-height: 1.7;
    box-shadow:
        0 8px 30px rgba(0, 0, 0, 0.04),
        0 4px 15px rgba(0, 0, 0, 0.02),
        inset 0 3px 12px rgba(255, 255, 255, 0.95),
        inset 0 -3px 8px rgba(0, 0, 0, 0.01),
        0 0 0 1px rgba(255, 255, 255, 0.5);
    position: relative;
}

#ai-chat-input::placeholder {
    color: rgba(31, 41, 55, 0.4);
    font-weight: 400;
}

#ai-chat-input:focus {
    border-color: var(--ai-primary);
    background: linear-gradient(145deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.98) 100%);
    box-shadow:
        0 0 0 5px rgba(67, 97, 238, 0.1),
        0 12px 40px rgba(67, 97, 238, 0.08),
        0 6px 20px rgba(0, 0, 0, 0.04),
        inset 0 4px 15px rgba(255, 255, 255, 1),
        inset 0 -4px 10px rgba(0, 0, 0, 0.02),
        0 0 0 1px rgba(255, 255, 255, 0.6);
    transform: translateY(-2px);
}

body.night #ai-chat-input {
    background: linear-gradient(145deg, rgba(40, 45, 60, 0.7) 0%, rgba(35, 40, 55, 0.75) 100%);
    border: 1px solid rgba(255, 255, 255, 0.15);
    color: #e5e7eb;
    box-shadow:
        0 8px 30px rgba(0, 0, 0, 0.25),
        0 4px 15px rgba(0, 0, 0, 0.18),
        inset 0 3px 12px rgba(255, 255, 255, 0.1),
        inset 0 -3px 8px rgba(0, 0, 0, 0.2),
        0 0 0 1px rgba(255, 255, 255, 0.08);
}

body.night #ai-chat-input::placeholder {
    color: rgba(229, 231, 235, 0.4);
}

body.night #ai-chat-input:focus {
    background: linear-gradient(145deg, rgba(50, 55, 70, 0.75) 0%, rgba(45, 50, 65, 0.8) 100%);
    border-color: #5a8fff;
    box-shadow:
        0 0 0 5px rgba(90, 143, 255, 0.15),
        0 12px 40px rgba(90, 143, 255, 0.12),
        0 6px 20px rgba(0, 0, 0, 0.25),
        inset 0 4px 15px rgba(255, 255, 255, 0.15),
        inset 0 -4px 10px rgba(0, 0, 0, 0.25),
        0 0 0 1px rgba(255, 255, 255, 0.12);
}

#ai-send-btn {
    width: 68px;
    height: 68px;
    border-radius: 24px;
    background: linear-gradient(145deg, var(--ai-primary) 0%, var(--ai-secondary) 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    flex-shrink: 0;
    font-size: 24px;
    box-shadow:
        0 12px 35px rgba(67, 97, 238, 0.3),
        0 6px 18px rgba(67, 97, 238, 0.2),
        inset 0 3px 12px rgba(255, 255, 255, 0.3),
        inset 0 -3px 8px rgba(0, 0, 0, 0.1),
        0 0 0 1px rgba(255, 255, 255, 0.2);
    position: relative;
    overflow: hidden;
}

#ai-send-btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.35) 0%, rgba(255, 255, 255, 0.1) 100%);
    pointer-events: none;
    transition: opacity 0.3s ease;
}

#ai-send-btn::after {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: conic-gradient(from 0deg at 50% 50%, transparent 0deg, rgba(255, 255, 255, 0.3) 180deg, transparent 360deg);
    animation: rotate 4s linear infinite;
    opacity: 0;
    transition: opacity 0.3s ease;
}

#ai-send-btn:hover::after {
    opacity: 1;
}

#ai-send-btn:hover {
    transform: scale(1.12) rotate(6deg) translateY(-4px);
    box-shadow:
        0 18px 50px rgba(67, 97, 238, 0.4),
        0 10px 28px rgba(67, 97, 238, 0.3),
        inset 0 4px 15px rgba(255, 255, 255, 0.4),
        inset 0 -4px 10px rgba(0, 0, 0, 0.12),
        0 0 0 2px rgba(255, 255, 255, 0.3);
}

#ai-send-btn:active {
    transform: scale(0.96) rotate(3deg) translateY(-1px);
    box-shadow:
        0 6px 20px rgba(67, 97, 238, 0.25),
        0 3px 10px rgba(67, 97, 238, 0.18),
        inset 0 3px 8px rgba(0, 0, 0, 0.15),
        inset 0 -3px 5px rgba(255, 255, 255, 0.1),
        0 0 0 1px rgba(255, 255, 255, 0.15);
}

body.night #ai-send-btn {
    box-shadow:
        0 12px 35px rgba(67, 97, 238, 0.35),
        0 6px 18px rgba(67, 97, 238, 0.25),
        inset 0 3px 12px rgba(255, 255, 255, 0.2),
        inset 0 -3px 8px rgba(0, 0, 0, 0.2),
        0 0 0 1px rgba(255, 255, 255, 0.15);
}

body.night #ai-send-btn:hover {
    box-shadow:
        0 18px 50px rgba(67, 97, 238, 0.45),
        0 10px 28px rgba(67, 97, 238, 0.35),
        inset 0 4px 15px rgba(255, 255, 255, 0.3),
        inset 0 -4px 10px rgba(0, 0, 0, 0.25),
        0 0 0 2px rgba(255, 255, 255, 0.25);
}

body.night #ai-send-btn:active {
    box-shadow:
        0 6px 20px rgba(67, 97, 238, 0.3),
        0 3px 10px rgba(67, 97, 238, 0.22),
        inset 0 3px 8px rgba(0, 0, 0, 0.25),
        inset 0 -3px 5px rgba(255, 255, 255, 0.05),
        0 0 0 1px rgba(255, 255, 255, 0.1);
}

/* 状态栏 */
.status-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 28px 20px;
    font-size: 14px;
    color: #6b7280;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.01) 100%);
    font-weight: 500;
}

body.night .status-bar {
    color: #9ca3af;
    background: linear-gradient(180deg, rgba(20, 25, 40, 0.5) 0%, rgba(15, 20, 35, 0.55) 100%);
}

.typing-indicator {
    display: flex;
    align-items: center;
    gap: 12px;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.typing-indicator.active {
    opacity: 1;
}

.typing-dots {
    display: flex;
    gap: 8px;
}

.dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--ai-primary) 0%, var(--ai-secondary) 100%);
    animation: dotPulse 1.4s infinite ease-in-out;
    box-shadow:
        0 3px 10px rgba(67, 97, 238, 0.4),
        0 1px 4px rgba(67, 97, 238, 0.3);
}

@keyframes dotPulse {
    0%, 100% { transform: translateY(0) scale(1); opacity: 0.8; }
    50% { transform: translateY(-5px) scale(1.1); opacity: 1; }
}

.dot:nth-child(2) { animation-delay: 0.2s; }
.dot:nth-child(3) { animation-delay: 0.4s; }

body.night .dot {
    background: linear-gradient(135deg, #5a8fff 0%, #7aa2ff 100%);
    box-shadow:
        0 3px 10px rgba(90, 143, 255, 0.4),
        0 1px 4px rgba(90, 143, 255, 0.3);
}

/* 响应式设计 */
@media (max-width: 1200px) {
    #deepseek-ai-container {
        width: calc(100% - 30px);
        max-width: 1000px;
    }
    
    .ai-sidebar {
        width: 280px;
        min-width: 280px;
        padding: 24px 18px;
    }
    
    .ai-stats {
        gap: 14px;
    }
    
    .stat-card {
        padding: 18px 14px;
    }
}

@media (max-width: 1100px) {
    #deepseek-ai-container {
        flex-direction: column;
        max-width: 760px;
        height: min(78vh, 720px);
        max-height: 720px;
        border-radius: 22px;
    }
    
    .ai-sidebar {
        display: none;
        width: 100%;
        max-height: 35%;
        min-width: 100%;
        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.18);
        padding: 20px 24px;
        overflow-y: auto;
    }
    
    .ai-sidebar::before {
        top: 0;
        right: 0;
        bottom: 0;
        left: auto;
        width: 1px;
        height: 100%;
        background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.3), transparent);
    }
    
    body.night .ai-sidebar {
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }
    
    body.night .ai-sidebar::before {
        background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.1), transparent);
    }
    
    .ai-logo {
        margin-bottom: 20px;
        padding-bottom: 15px;
        text-align: center;
    }
    
    .ai-icon {
        width: 90px;
        height: 90px;
        margin: 0 auto 12px;
    }
    
    #ai-logo-img {
        width: 72px;
        height: 72px;
    }
    
    #ai-title {
        font-size: 24px;
    }
    
    .ai-stats {
        grid-template-columns: repeat(4, 1fr);
        gap: 12px;
    }
    
    .stat-card {
        padding: 14px 10px;
    }
    
    .stat-value {
        font-size: 20px;
    }
    
    .stat-label {
        font-size: 11px;
    }
    
    .recent-posts {
        display: none;
    }
    
    .chat-history {
        padding: 16px;
        gap: 16px;
        min-height: 0;
    }
    
    .input-area {
        padding: 14px 16px;
    }
    
    #ai-chat-input {
        min-height: 64px;
        padding: 14px 16px;
    }
    
    #ai-send-btn {
        width: 48px;
        height: 48px;
        font-size: 18px;
    }
}

@media (max-width: 768px) {
    #deepseek-ai-modal {
        padding: 10px;
    }
    
    #deepseek-ai-container {
        width: calc(100% - 12px);
        height: calc(100dvh - 20px);
        height: -webkit-fill-available;
        max-height: calc(100dvh - 20px);
        border-radius: 22px;
    }
    
    #deepseek-ai-container.fullscreen {
        border-radius: 0;
    }
    
    .chat-header {
        padding: 16px 20px;
    }
    
    #ai-chat-title {
        font-size: 18px;
    }
    
    .action-btn {
        width: 38px;
        height: 38px;
        font-size: 14px;
    }
    
    .chat-history {
        padding: 16px;
        gap: 16px;
        min-height: 0;
    }
    
    .message {
        max-width: 92%;
    }
    
    .message-header {
        gap: 10px;
        margin-bottom: 8px;
        font-size: 13px;
    }
    
    .message-avatar {
        width: 34px;
        height: 34px;
    }
    
    .message-avatar i {
        font-size: 15px;
    }
    
    .message-content {
        padding: 14px 18px;
        font-size: 14.5px;
        line-height: 1.6;
        border-radius: 18px;
    }
    
    .input-area {
        padding: 16px;
    }
    
    #ai-chat-input {
        padding: 14px 18px;
        min-height: 70px;
        max-height: 150px;
        font-size: 15px;
        border-radius: 20px;
    }
    
    #ai-send-btn {
        width: 52px;
        height: 52px;
        font-size: 18px;
        border-radius: 18px;
    }
    
    .status-bar {
        padding: 0 20px 16px;
        font-size: 13px;
    }
}

@supports (-webkit-touch-callout: none) {
    #deepseek-ai-modal {
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
        background: rgba(0, 0, 0, 0.5);
    }

    #deepseek-ai-container {
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
        transform: none;
        transition: opacity 0.25s ease;
    }

    #deepseek-ai-container::after {
        display: none;
    }

    #deepseek-ai-modal.active #deepseek-ai-container {
        transform: none;
    }

    .ai-sidebar,
    .ai-chat,
    .chat-header {
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
    }
}

@media (max-width: 480px) {
    .ai-sidebar {
        max-height: 30%;
        padding: 16px 18px;
    }
    
    .ai-logo {
        margin-bottom: 16px;
        padding-bottom: 12px;
    }
    
    .ai-icon {
        width: 80px;
        height: 80px;
    }
    
    #ai-logo-img {
        width: 64px;
        height: 64px;
    }
    
    #ai-title {
        font-size: 22px;
    }
    
    .ai-stats {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }
    
    .stat-card {
        padding: 12px 8px;
        border-radius: 16px;
    }
    
    .stat-value {
        font-size: 18px;
    }
    
    .stat-label {
        font-size: 10px;
    }
    
    .chat-header {
        padding: 14px 16px;
    }
    
    #ai-chat-title {
        font-size: 16px;
    }
    
    .chat-actions {
        gap: 10px;
    }
    
    .action-btn {
        width: 34px;
        height: 34px;
        font-size: 13px;
        border-radius: 12px;
    }
    
    .chat-history {
        padding: 14px;
        gap: 14px;
    }
    
    .message {
        max-width: 90%;
    }
    
    .message-header {
        gap: 8px;
        margin-bottom: 6px;
        font-size: 12px;
    }
    
    .message-avatar {
        width: 30px;
        height: 30px;
    }
    
    .message-avatar i {
        font-size: 13px;
    }
    
    .message-content {
        padding: 12px 16px;
        font-size: 14px;
        line-height: 1.5;
        border-radius: 16px;
    }
    
    .input-area {
        padding: 14px;
    }
    
    .input-wrapper {
        gap: 12px;
    }
    
    #ai-chat-input {
        padding: 12px 16px;
        min-height: 60px;
        max-height: 120px;
        font-size: 14px;
        border-radius: 18px;
    }
    
    #ai-send-btn {
        width: 48px;
        height: 48px;
        font-size: 16px;
        border-radius: 16px;
    }
    
    .status-bar {
        padding: 0 16px 14px;
        font-size: 12px;
    }
    
    .dot {
        width: 8px;
        height: 8px;
    }
}

@media (max-width: 360px) {
    .ai-stats {
        grid-template-columns: 1fr;
    }
    
    .stat-card {
        padding: 10px 12px;
    }
    
    .chat-actions {
        gap: 8px;
    }
    
    .action-btn {
        width: 32px;
        height: 32px;
        font-size: 12px;
    }
    
    #ai-send-btn {
        width: 44px;
        height: 44px;
        font-size: 15px;
    }
}

/* 横屏模式优化 */
@media (max-height: 600px) and (orientation: landscape) {
    #deepseek-ai-container {
        height: 100vh;
        max-height: none;
    }
    
    .ai-sidebar {
        max-height: 25%;
    }
    
    .ai-logo {
        margin-bottom: 12px;
        padding-bottom: 8px;
    }
    
    .ai-icon {
        width: 70px;
        height: 70px;
        margin: 0 auto 8px;
    }
    
    #ai-logo-img {
        width: 56px;
        height: 56px;
    }
    
    #ai-title {
        font-size: 20px;
        margin: 8px 0 6px;
    }
    
    .chat-header {
        padding: 12px 20px;
    }
    
    .chat-history {
        padding: 16px;
        gap: 14px;
    }
    
    .input-area {
        padding: 14px 20px;
    }
    
    #ai-chat-input {
        min-height: 50px;
        max-height: 100px;
        padding: 12px 18px;
        font-size: 14px;
    }
    
    #ai-send-btn {
        width: 50px;
        height: 50px;
        font-size: 18px;
    }
    
    .status-bar {
        display: none;
    }
}




body.night .display-switcher[pandaTab] .anchor{ box-shadow: 0 8px 13px #000 inset, 0 1px #3f4d68 !important}

.display-switcher[pandaTab] > ul.menu{position:relative}
.display-switcher[pandaTab] > ul.menu > li.anchor{top:0;bottom:0;margin:auto 0;height:34px;border-radius:10px;background:linear-gradient(#d8e0ea, #f9fafc);pointer-events:none}
body.night .display-switcher[pandaTab] > ul.menu > li.anchor{background:linear-gradient(#34425a,#28364a)}

.coverflow-wrapper.nirvana-coverflow-bg{position:relative}
.coverflow-wrapper.nirvana-coverflow-bg:before{content:"";position:absolute;inset:0;background-image:var(--nirvana-coverflow-bg);background-size:cover;background-position:center;filter:blur(28px);opacity:.85;transform:scale(1.12);z-index:0}
.coverflow-wrapper.nirvana-coverflow-bg>*{position:relative;z-index:1}




/* ====================
   右侧滚动条
   ==================== */

:root {
  --scrollbar-light: #ffffffa6;
  --scrollbar-dark: #ffffffa6;
  --scrollbar-glow: #ffffffa6;
}

/* 夜间模式适配 */
body.night {
  --scrollbar-light: #00000099;
  --scrollbar-dark: #00000099;
  --scrollbar-glow: #00000099;
}

/* 主容器 */
::-webkit-scrollbar {
  width: 6px; /* 加宽显示立体效果 */
  background-color: none;
}

/* 隐藏轨道 */
::-webkit-scrollbar-track {
  background: linear-gradient(
    to right,
    var(--scrollbar-dark) 0%,
    var(--scrollbar-light) 50%,
    var(--scrollbar-dark) 100%
  );
}

/* 3D金属滑块 */
::-webkit-scrollbar-thumb {
  background: linear-gradient(
    to right,
    var(--scrollbar-dark) 0%,
    var(--scrollbar-light) 50%,
    var(--scrollbar-dark) 100%
  );
  border-radius: 4px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  box-shadow: 
    inset 2px 2px 5px rgba(0, 0, 0, 0.2),
    inset -2px -2px 5px rgba(255, 255, 255, 0.1);
  position: relative;
}

/* 金属反光动画 */
::-webkit-scrollbar-thumb::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(
    180deg,
    transparent 40%,
    var(--scrollbar-glow) 50%,
    transparent 60%
  );
  animation: metal-shine 3s infinite;
  mix-blend-mode: overlay;
}

/* 端点光泽 */
::-webkit-scrollbar-thumb::before {
  content: '';
  position: absolute;
  top: -5px;
  right: 0;
  width: 100%;
  height: 10px;
  background: radial-gradient(
    circle at center,
    rgba(255, 255, 255, 0.8) 0%,
    rgba(255, 255, 255, 0) 70%
  );
}

/* 悬停放大效果 */
::-webkit-scrollbar-thumb:hover {
  transform: scaleX(1.2);
  transform-origin: right;
}

/* 金属反光动画 */
@keyframes metal-shine {
  0% { transform: translateY(-150%) skewY(-10deg); }
  70% { transform: translateY(150%) skewY(-10deg); }
  100% { transform: translateY(150%) skewY(-10deg); }
}

/* 平滑滚动 */
html {
  scroll-behavior: smooth;
}

/* 适配移动端 */
@media (max-width: 768px) {
  ::-webkit-scrollbar {
    width: 4px;
  }
}















body.night .postLists.hfg .card .cover[style*="background-image"]{
    box-shadow: 1px 0 #28374a, -1px 0 #28374a, 0 1px #34425a;
}

.black-color{
    color: none !important;
}



/* 解决方案3：防止背景穿透（终极方案） */
body {
    background-color: #fff !important; /* 改为闪动时看到的背景色 */
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
}










/* 菜单文字图标动画 */
  @keyframes iconJump {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-3px); }
  }
  
  @keyframes colorGlow {
    0% { filter: drop-shadow(0 0 0 currentColor); }
    100% { filter: drop-shadow(0 0 6px currentColor); }
  }
  /* 基础样式 */
  .icon-group {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
  }
  
  .icon-unit {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    padding: 6px 0;
    border-bottom: 1px dashed transparent;
    transition: all 0.3s;
  }
  
  .icon-unit i {
    font-size: 16px;
    transition: all 0.2s;
  }
  
  .icon-unit span {
    font-size: 14px;
    color: #333;
    transition: all 0.3s;
  }
  /* 悬停特效 */
  .icon-unit:hover {
    border-bottom-color: currentColor;
  }
  
  .icon-unit:hover i {
    animation: iconJump 0.6s ease, colorGlow 0.8s alternate infinite;
  }
  
  .icon-unit:hover span {
    color: #000;
    letter-spacing: 0.5px;
  }
  /* 文章系列特殊处理 */
  .icon-unit.articles:hover i {
    transform: rotate(-5deg);
  }
  
  
 /* 公共动画 */
  @keyframes colorPulse {
    0% { filter: brightness(100%); }
    100% { filter: brightness(130%) drop-shadow(0 0 2px currentColor); }
  }
  
  /* 容器样式 */
  .icon-container {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-right: 15px;
    cursor: pointer;
    font-family: 'Segoe UI', sans-serif;
  }
  .icon-container span {
    font-size: 14px;
    color: #333;
    transition: color 0.3s;
  }
  .icon-container:hover span {
    color: #666;
  }












/* 一言核心玻璃拟物化样式 */
.glass-3d-container {
  position: fixed;
  bottom: 50px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 99999;
  opacity: 0;
  transition: opacity 0.8s, transform 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}

.glass-3d-container[data-state="visible"] {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

.glass-3d-card {
  min-width: 300px;
  max-width: 80vw;
  padding: 20px 30px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow:
    0 10px 35px rgba(0, 0, 0, 0.15),
    inset 0 0 15px rgba(255, 255, 255, 0.1);
  transform-style: preserve-3d;
  transform: translateZ(20px);
}

body.night .glass-3d-card {
  background: rgba(0, 0, 0, 0.15);
  border-color: rgba(0, 0, 0, 0.1);
}

.glass-content {
  transform: translateZ(30px);
}

#hitokoto-content {
  font-size: 18px;
  line-height: 1.5;
  color: #333;
  text-align: center;
  margin: 0;
  text-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
  font-weight: 500;
}

body.night #hitokoto-content {
  color: #f0f0f0;
}

#hitokoto-source {
  font-size: 14px;
  color: #666;
  text-align: right;
  margin: 10px 0 0;
  font-style: italic;
}

body.night #hitokoto-source {
  color: #aaa;
}

/* 打字动画 */
.typing-animation {
  display: inline-block;
  position: relative;
}

.typing-animation::after {
  content: "|";
  position: absolute;
  right: -5px;
  animation: blink 1s infinite;
}

@keyframes blink {
  0%, 100% { opacity: 0; }
  50% { opacity: 1; }
}









/* 底部进度条3D玻璃拟物容器 */
          .progress-glass {
            position: fixed;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 3px;
            z-index: 9999;
            background: linear-gradient(
              to bottom,
              rgba(255, 255, 255, 0.15) 0%,
              rgba(255, 255, 255, 0) 50%
            );
            backdrop-filter: blur(5px);
            -webkit-backdrop-filter: blur(5px);
            border-top: 1px solid rgba(255, 255, 255, 0.4);
            box-shadow: 
              0 -2px 10px rgba(0, 0, 0, 0.3),
              0 1px 0 rgba(255, 255, 255, 0.2) inset; /* 内凹阴影 */
          }

          /* 金属轨道 */
          .progress-track {
            position: absolute;
            top: 1px;
            left: 1px;
            right: 1px;
            bottom: 1px;
            background: rgba(0, 0, 0, 0.2);
            border-radius: 2px;
            overflow: hidden;
          }

          /* 液态金属进度条 */
          .progress-bar {
            height: 100%;
            width: 0%;
            position: relative;
            background: linear-gradient(
              to right,
              rgba(255, 255, 255, 0.3) 0%,
              rgba(255, 255, 255, 0.8) 50%,
              rgba(255, 255, 255, 0.3) 100%
            );
            transition: width 0.2s cubic-bezier(0.33, 1, 0.68, 1);
          }

          /* 金属反光颗粒 */
          .progress-bar::after {
            content: '';
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            background: linear-gradient(
              90deg,
              rgba(255, 255, 255, 0) 40%,
              rgba(255, 255, 255, 0.5) 50%,
              rgba(255, 255, 255, 0) 60%
            );
            animation: metal-shine 3s infinite;
            mix-blend-mode: overlay;
          }

          /* 液态端点光泽 */
          .progress-bar::before {
            content: '';
            position: absolute;
            top: 0;
            right: -3px;
            width: 6px;
            height: 100%;
            background: radial-gradient(
              circle at center,
              rgba(255, 255, 255, 0.9) 0%,
              rgba(255, 255, 255, 0) 70%
            );
          }

          /* 物理反弹效果 */
          .progress-bounce {
            transition: width 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
          }

          @keyframes metal-shine {
            0% { transform: translateX(-150%) skewX(-30deg); }
            70% { transform: translateX(150%) skewX(-30deg); }
            100% { transform: translateX(150%) skewX(-30deg); }
          }
          
          @media (max-width: 768px) {
  .progress-glass {
    height: 2px;
  }
}

body.night .progress-glass {
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0.08) 0%,
    rgba(255, 255, 255, 0) 50%
  );
}



















/* 玻璃门加载动画  容器（适配夜间模式） */
        .door-loading {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 9999;
            overflow: hidden;
            pointer-events: none;
            display: flex;
            align-items: center;
            justify-content: center;
            background: transparent;
            opacity: 1;
            transition: opacity 3s ease;
        }

        body.night .door-loading {
            background: rgba(0, 0, 0, 0.1);
        }

        /* 玻璃门样式 */
        .door {
            position: absolute;
            top: 0;
            width: 50%;
            height: 100%;
            background: rgba(255, 255, 255, 0.25);
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
            border: 1px solid rgba(255, 255, 255, 0.18);
            transition: transform 0.8s cubic-bezier(0.65, 0, 0.35, 1);
        }

        /* 夜间模式微调 */
        body.night .door {
            background: rgba(255, 255, 255, 0.2);
        }
        .door-left {
            left: 0;
            transform: translateX(0);
        }

        .door-right {
            right: 0;
            transform: translateX(0);
        }

        /* 开门动画 */
        .content-visible .door-left {
            transform: translateX(-100%) !important;
        }

        .content-visible .door-right {
            transform: translateX(100%) !important;
        }

        /* 加载文字动画 */
        .loader {
            position: relative;
            z-index: 10;
        }

        .glitch {
          position: relative;
          font-size: 25px;
          font-weight: 700;
          line-height: 1.2;
          color: #fff;
          letter-spacing: 5px;
          z-index: 1;
          animation: shift 1s ease-in-out infinite alternate;
          text-shadow: 0 0 10px rgba(255,255,255,0.4);
        }

        .glitch:before,
        .glitch:after {
          display: block;
          content: attr(data-glitch);
          position: absolute;
          top: 0;
          left: 0;
          opacity: 0.8;
        }

        .glitch:before {
          animation: glitch 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) both infinite;
          color: #8b00ff;
          z-index: -1;
        }

        .glitch:after {
          animation: glitch 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) reverse both infinite;
          color: #00e571;
          z-index: -2;
        }

        @keyframes glitch {
          0% { transform: translate(0); }
          20% { transform: translate(-3px, 3px); }
          40% { transform: translate(-3px, -3px); }
          60% { transform: translate(3px, 3px); }
          80% { transform: translate(3px, -3px); }
          to { transform: translate(0); }
        }

        @keyframes shift {
          0%, 40%, 44%, 58%, 61%, 65%, 69%, 73%, 100% { transform: skewX(0deg); }
          41% { transform: skewX(10deg); }
          42% { transform: skewX(-10deg); }
          59% { transform: skewX(40deg) skewY(10deg); }
          60% { transform: skewX(-40deg) skewY(-10deg); }
          63% { transform: skewX(10deg) skewY(-5deg); }
          70% { transform: skewX(-50deg) skewY(-20deg); }
          71% { transform: skewX(10deg) skewY(-10deg); }
        }

        /* 加载完成后的淡出效果 */
        .content-visible {
            opacity: 0;
        }

        /* 移动端调整 */
        @media (max-width: 768px) {
            .glitch {
                font-size: 18px;
                letter-spacing: 3px;
            }
        }
        
        
        
        
        
        
        
        

/* 鼠标右键基础样式 */
.panda-context-menu {
    position: fixed;
    min-width: 220px;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.2);
    padding: 8px 0;
    z-index: 9999;
    opacity: 0;
    transform: scale(0.9);
    transform-origin: top left;
    transition: opacity 0.2s ease, transform 0.2s ease;
    display: none;
    overflow: hidden;
}

.panda-context-menu.show {
    opacity: 1;
    transform: scale(1);
    display: block;
}

.context-menu-header {
    display: flex;
    align-items: center;
    padding: 10px 16px;
    font-size: 14px;
    font-weight: bold;
    color: #333;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    margin-bottom: 8px;
}

.context-menu-header i {
    margin-right: 10px;
    color: #555;
}

.panda-context-items {
    list-style: none;
    padding: 0;
    margin: 0;
}

.context-menu-item {
    display: flex;
    align-items: center;
    padding: 8px 16px;
    cursor: pointer;
    transition: all 0.2s ease;
    margin: 0 8px;
    border-radius: 8px;
}

.context-menu-item:hover {
    background: rgba(255, 255, 255, 0.3);
}

.context-menu-item:active {
    background: rgba(255, 255, 255, 0.4);
}





.context-menu-item i {
    width: 20px;
    margin-right: 10px;
    text-align: center;
    color: #555;
}

.context-menu-item span {
    font-size: 13px;
}

.context-menu-item.disabled {
    opacity: 0.5;
    pointer-events: none;
}

.menu-divider {
    height: 1px;
    background: rgba(0, 0, 0, 0.1);
    margin: 8px 16px;
}

/* 夜间模式 */


body.night .panda-context-items .context-menu-item span {
    color: #f9f3f3cc !important;
}

body.night .panda-context-items .context-menu-item i {
    color: #f9f3f3cc !important;
}



body.night .panda-context-menu {
    background: rgba(40, 40, 40, 0.25);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}

body.night .context-menu-header {
    color: #eee;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

body.night .context-menu-header i,
body.night .context-menu-item i {
    color: #eee;
}

body.night .context-menu-item:hover {
    background: rgba(255, 255, 255, 0.1);
}

body.night .context-menu-item:active {
    background: rgba(255, 255, 255, 0.15);
}

body.night .menu-divider {
    background: rgba(255, 255, 255, 0.1);
}

/* 响应式微调 */
@media (max-width: 480px) {
    .panda-context-menu {
        min-width: 180px;
    }
}































/* 登陆注册补充样式开始 */



body .pandastudio_framework_login {
    z-index: 999 !important;
}



/* 左右抖动动画 - 更强烈的震动效果 */
@keyframes shakedd {
  0%, 100% {
    transform: translateX(0);
  }
  10%, 30%, 50%, 70%, 90% {
    transform: translateX(-10px); /* 向左偏移 */
  }
  20%, 40%, 60%, 80% {
    transform: translateX(10px); /* 向右偏移 */
  }
}

.pandastudio-shake-animate {
  animation: shakedd 0.6s cubic-bezier(.36,.07,.19,.97) both;
  /* 可以加上这些增强效果 */
  backface-visibility: hidden; /* 防止抖动时出现闪烁 */
  -webkit-font-smoothing: subpixel-antialiased; /* 字体平滑 */
}






/* 在原有CSS中添加这两条规则 */
.pandastudio_framework_login__container {
    pointer-events: none; /* 允许点击穿透到父级 */
}

.pandastudio_framework_login__card, 
.pandastudio_framework_register__card {
    pointer-events: auto; /* 卡片内部元素可交互 */
}

#loginModal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5); /* 半透明背景 */
    z-index: 99;
}
#loginCard, #registerCard {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 999;
}
/* ======= 修复弹窗居中的关键CSS ======= */
/* 修复点击事件的关键CSS */
.pandastudio_framework_login {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999; /* 修正为999 */
    background-color: rgba(0, 0, 0, 0.5);
    display: none;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    will-change: opacity;
    transition: opacity .22s ease, visibility 0s linear .22s;
}

.pandastudio_framework_login.is-open {
    opacity: 1;
    visibility: visible;
    transition: opacity .22s ease, visibility 0s;
}

.pandastudio_framework_login.is-closing {
    opacity: 0;
    visibility: visible;
}

/* 确保没有其他地方定义了更高的z-index */
.pandastudio_framework_login * {
    z-index: inherit !important; /* 强制子元素继承 */
}

/* 取消可能存在的!important覆盖 */
.pandastudio_framework_login__container {
    z-index: 999 !important; /* 保持与父元素一致 */
}


.pandastudio_framework_login__container {
    position: fixed; /* 改为fixed定位 */
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(0,0,0,0.5); /* 背景色移到容器 */
}

.pandastudio_framework_login__card,
.pandastudio_framework_register__card {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 270px;
    background: #f0f2f7;
    padding: 30px 25px;
    border-radius: 20px;
    box-shadow: 0 1px 1px #fff inset, 0 15px 20px rgba(31,45,64,0.35);
    transform-style: preserve-3d;
    backface-visibility: hidden;
    opacity: 0;
    will-change: transform, opacity;
    pointer-events: none;
    transition: transform .62s cubic-bezier(.22,1,.36,1), opacity .24s ease;
}

#loginCard {
    transform: translate3d(-50%,-50%,0) translate3d(0,10px,0) rotateY(-92deg) scale(.985);
}

#registerCard {
    transform: translate3d(-50%,-50%,0) translate3d(0,10px,0) rotateY(92deg) scale(.985);
}

.pandastudio_framework_login.is-open #loginCard.is-active,
.pandastudio_framework_login.is-open #registerCard.is-active {
    opacity: 1;
    transform: translate3d(-50%,-50%,0) translate3d(0,0,0) rotateY(0deg) scale(1);
    pointer-events: auto;
}

.pandastudio_framework_login.is-open #loginCard.is-leaving {
    opacity: 0;
    transform: translate3d(-50%,-50%,0) translate3d(0,-10px,0) rotateY(92deg) scale(.985);
    pointer-events: none;
}

.pandastudio_framework_login.is-open #registerCard.is-leaving {
    opacity: 0;
    transform: translate3d(-50%,-50%,0) translate3d(0,-10px,0) rotateY(-92deg) scale(.985);
    pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
    .pandastudio_framework_login {
        transition: none;
    }
    .pandastudio_framework_login__card,
    .pandastudio_framework_register__card {
        transition: none;
        transform: none;
    }
}
/* ======= 3D旋转动画 ======= */
.rotate-in {
    animation: rotateIn 0.6s cubic-bezier(0.5, 1.5, 0.5, 1.5) forwards;
}
.rotate-out {
    animation: rotateOut 0.6s cubic-bezier(0.5, 1.5, 0.5, 1.5) forwards;
}
@keyframes rotateIn {
    0% { transform: rotateY(-90deg); opacity: 0; }
    100% { transform: rotateY(0); opacity: 1; }
}
@keyframes rotateOut {
    0% { transform: rotateY(0); opacity: 1; }
    100% { transform: rotateY(90deg); opacity: 0; }
}

.pandastudio_framework_login__card,
.pandastudio_framework_register__card {
    transform-style: preserve-3d;
    backface-visibility: hidden;
}






/* ======= 表单元素动画 ======= */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}
.form-element {
    opacity: 0;
    transform: translateY(20px);
}

/* 错误状态样式 */
.inputer.error input {
    border-color: #ff4d4f !important;
    box-shadow: 0 0 0 2px rgba(255,77,79,0.2);
}
.inputer.error .title {
    color: #ff4d4f !important;
}

/* 抖动动画 */
.shake-animation {
    animation: shake 0.6s cubic-bezier(.36,.07,.19,.97) both;
}
@keyframes shake {
    10%, 90% { transform: translateX(-1px); }
    20%, 80% { transform: translateX(2px); }
    30%, 50%, 70% { transform: translateX(-4px); }
    40%, 60% { transform: translateX(4px); }
}

/* 旋转动画 */
.rotate-animation {
    animation: rotate 0.1s ease-out forwards;
}
@keyframes rotate {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
/* 登陆注册补充样式结束 */




/* 侧边栏鼠标点击特效 */
/* ================= 拟物化开关核心样式 ================= */
.ios-switch {
  position: relative;
  display: inline-block;
  width: 54px;  /* 加宽增加拟物感 */
  height: 32px; /* 加高增加立体感 */
}

.ios-switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* 滑动轨道 - 3D凹槽效果 */
.ios-switch .slider123 {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #e0e3e7;
  transition: all 0.4s cubic-bezier(0.2, 0.85, 0.32, 1.2);
  border-radius: 20px;
  box-shadow:
    inset 0 2px 4px rgba(0,0,0,0.1),
    inset 0 -2px 2px rgba(255,255,255,0.8),
    0 1px 2px rgba(0,0,0,0.1);
  border: 1px solid #d0d3d6;
}

/* 滑块 - 3D按钮效果 */
.ios-switch .slider123:before {
  position: absolute;
  content: "";
  height: 24px;
  width: 25px;
  background: linear-gradient(180deg, #ffffff 0%, #f5f7f9 100%);
  transition: all 0.4s cubic-bezier(0.2, 0.85, 0.32, 1.2);
  border-radius: 50%;
  box-shadow:
    0 2px 5px rgba(0,0,0,0.2),
    0 1px 1px rgba(255,255,255,0.8),
    inset 0 -1px 2px rgba(0,0,0,0.1);
  z-index: 2;
}

/* 滑块光泽效果 */
.ios-switch .slider123:after {
  content: "";
  position: absolute;
  width: 20px;
  height: 12px;
  background: rgba(255,255,255,0.5);
  border-radius: 60% 60% 10% 10% / 80% 80% 20% 20%;
  left: 6px;
  top: 4px;
  filter: blur(0.5px);
  z-index: 3;
  transition: all 0.4s ease;
}

/* 激活状态的轨道颜色 */
.ios-switch input:checked + .slider123 {
  background: linear-gradient(180deg, #4CD964 0%, #3BB950 100%);
  box-shadow:
    inset 0 2px 4px rgba(0,0,0,0.1),
    inset 0 -2px 2px rgba(255,255,255,0.4);
}

/* 激活状态的滑块位置 */
.ios-switch input:checked + .slider123:before {
  transform: translateX(22px);
  box-shadow:
    0 2px 5px rgba(0,0,0,0.2),
    0 1px 1px rgba(255,255,255,0.8),
    inset 0 -1px 2px rgba(0,0,0,0.1);
}

/* 激活状态的光泽位置 */
.ios-switch input:checked + .slider123:after {
  left: 28px;
}

/* 按压动画效果 */
.ios-switch input:active + .slider123:before {
  transform: translateX(11px) scale(0.9);
}
.ios-switch input:checked:active + .slider123:before {
  transform: translateX(13px) scale(0.9);
}

/* 禁用状态样式 */
.ios-switch input:disabled + .slider123 {
  opacity: 0.6;
  cursor: not-allowed;
}

/* ================= 深色模式适配 ================= */
body.night .ios-switch .slider123 {
  background: #404450;
  box-shadow:
    inset 0 2px 5px rgba(0,0,0,0.3),
    inset 0 -2px 2px rgba(255,255,255,0.05),
    0 1px 2px rgba(0,0,0,0.3);
  border-color: #4a4f5e;
}

body.night .ios-switch input:checked + .slider123 {
  background: linear-gradient(180deg, #3BB950 0%, #2EA043 100%);
  box-shadow:
    inset 0 2px 5px rgba(0,0,0,0.3),
    inset 0 -2px 2px rgba(255,255,255,0.1);
}

body.night .ios-switch .slider123:before {
  box-shadow:
    0 2px 5px rgba(0,0,0,0.4),
    0 1px 1px rgba(255,255,255,0.1),
    inset 0 -1px 2px rgba(0,0,0,0.2);
}
/* 新增烟花预览样式 */
.firework-preview {
  background: radial-gradient(circle, #ff3366 20%, #ffcc00 50%, transparent 70%);
}

/* 替换原来的 .unavailable 样式 */
.assistance-wrapper {
    z-index: 1;
  position: fixed;
  /* 保留你原有的定位样式 */
  transition: opacity 0.3s ease, transform 0.3s ease, visibility 0s;
  visibility: visible;
}
.assistance-wrapper.unavailable {
  opacity: 0;
  visibility: hidden;
  pointer-events: none; /* 防止隐藏时还能点击 */
  transition: opacity 0.3s ease, transform 0.3s ease, visibility 0s linear 0.3s;
}

/* ================= 深色模式样式 ================= */
body.night #effectsPanel.assistance-wrapper {
    background: linear-gradient(#34425a,#28364a);
    box-shadow: 0 10px 20px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.05);
}
body.night #sliderPanel.assistance-wrapper {
    background: linear-gradient(#34425a,#28364a);
    box-shadow: 0 10px 20px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.05);
}
body.night #sliderPanel:before{ background: linear-gradient(#34425a,#28364a);border-left: 5px solid #34425a;
    box-shadow: 0 10px 20px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.05); }
body.night #effectsPanel:before {
    border-left-color: rgb(51 65 89) !important;
}
body.night #effectsPanel:after {
    border-left-color: rgb(51 65 89) !important;
}
/* 标题栏 */
body.night .panel-header {
    border-bottom-color: #3f4c5d !important;

}
body.night .panel-header i {
    color: #aaa !important;
}
body.night .panel-header span {
    color: #eee !important;
}
body.night .close-panel {
    color: #aaa !important;
}
body.night .close-panel:hover {
    color: #fff !important;
}
/* 内容区域 */
body.night #effectsOptions {
 
    color: #ddd;
}

body.night .global-control {
    border-top-color: #3f4c5d !important
 
}
/* 选项交互 */
body.night .effect-option {
    color: #eee;
}
body.night .effect-option:hover {
    background: rgba(255, 255, 255, 0.05) !important;
}
body.night .effect-option.selected {
    background: rgba(0, 90, 220, 0.3) !important;
}
body.night .follow-option {
    color: #eee;
}
body.night .follow-option:hover {
    background: rgba(255, 255, 255, 0.05) !important;
}
body.night .follow-option.selected {
    background: rgba(0, 90, 220, 0.3) !important;
}
body.night .bg-option {
    color: #eee;
}
body.night .bg-option:hover {
    background: rgba(255, 255, 255, 0.05) !important;
}
body.night .bg-option.selected {
    background: rgba(0, 90, 220, 0.3) !important;
}

body.night .ios-switch input:checked + .slider123 {
    background-color: #2e7d32 !important;
}
/* 特效预览颜色调整（在深色背景下更醒目） */
body.night .bubble-preview {
    background: radial-gradient(circle, rgba(0, 200, 255, 0.8), transparent 70%) !important;
}
body.night .particle-preview {
    background: radial-gradient(circle, rgba(34,197,94,.75), rgba(96,165,250,.65), rgba(249,115,22,.55), transparent 70%) !important;
}
body.night .petals-preview {
    background: radial-gradient(circle, rgba(255,255,255,.7), rgba(255,255,255,0) 70%) !important;
}
body.night .confetti-preview {
    background: linear-gradient(135deg, #06b6d4, #f97316) !important;
}
body.night .star-preview {
    background: radial-gradient(circle, #facc15, transparent 70%) !important;
}
body.night .ink-preview {
    background: radial-gradient(circle, rgba(59,130,246,.55), rgba(15,23,42,0) 70%) !important;
}
body.night .aurora-preview {
    background: linear-gradient(135deg, rgba(34,211,238,.45), rgba(168,85,247,.45)) !important;
}
body.night .bgstars-preview {
    background: radial-gradient(circle, rgba(250,204,21,.55), rgba(250,204,21,0) 70%) !important;
}
body.night .net-preview {
    background: linear-gradient(135deg, rgba(34,211,238,.45), rgba(168,85,247,.35)) !important;
}
body.night .water-preview {
    background: radial-gradient(circle, rgba(56,189,248,.45), rgba(56,189,248,0) 70%) !important;
}
body.night .mist-preview {
    background: radial-gradient(circle, rgba(255,255,255,.35), rgba(255,255,255,0) 70%) !important;
}
body.night .grid-preview {
    background: linear-gradient(135deg, rgba(34,211,238,.35), rgba(168,85,247,.35)) !important;
}
body.night .lines-preview {
    background: conic-gradient(from 180deg, rgba(34,211,238,.45), rgba(168,85,247,.35), rgba(34,211,238,.45)) !important;
}
body.night .bubblesbg-preview {
    background: radial-gradient(circle, rgba(34,211,238,.35), rgba(168,85,247,.25), rgba(34,211,238,0) 70%) !important;
}
body.night .snow-preview {
    background: radial-gradient(circle, rgba(255,255,255,.55), rgba(255,255,255,0) 70%) !important;
}
body.night .sakura-preview {
    background: radial-gradient(circle, rgba(255,183,197,.55), rgba(255,183,197,0) 70%) !important;
}
body.night .noise-preview {
    background: radial-gradient(circle, rgba(255,255,255,.25), rgba(255,255,255,0) 70%) !important;
}
/* 启用按钮图标适配 */
body.night #toggleEffectsIcon {
    background: #444 !important;
}
body.night #toggleEffectsIcon i {
    color: #bbb !important;
}
body.night input:checked ~ #toggleEffectsIcon {
    background: #388e3c !important;
}
body.night input:checked ~ #toggleEffectsIcon i {
    color: #fff !important;
}

/* 匹配客服模态框主样式 */
#effectsPanel.assistance-wrapper {
    background:#f0f2f7;
    background:-webkit-gradient(linear,left top,left bottom,from(#f0f2f7),to(#fff));
    background:-webkit-linear-gradient(#f0f2f7,#fff);
    background:linear-gradient(#f0f2f7,#fff);
    width:400px;
    position:fixed;
    z-index:10;
    border-radius:8px;
    box-shadow:0 15px 20px rgba(31,45,61,.2),0 0 0 2px rgba(166,172,182,.5),0 0 0 1px #fff inset;
    transform-origin:calc(100% + 10px) calc(100% - 18px);
    transition:.5s cubic-bezier(.5,1.65,.5,1);
}
#sliderPanel.assistance-wrapper {
    background:#f0f2f7;
    background:-webkit-gradient(linear,left top,left bottom,from(#f0f2f7),to(#fff));
    background:-webkit-linear-gradient(#f0f2f7,#fff);
    background:linear-gradient(#f0f2f7,#fff);
    width:400px;
    position:fixed;
    z-index:10;
    border-radius:8px;
    box-shadow:0 15px 20px rgba(31,45,61,.2),0 0 0 2px rgba(166,172,182,.5),0 0 0 1px #fff inset;
    transform-origin:calc(100% + 10px) calc(100% - 18px);
    transition:.5s cubic-bezier(.5,1.65,.5,1);
}

#effectsPanel.unavailable {
    visibility:hidden;
    transform:scale(0);
    opacity:0;
}
#sliderPanel.unavailable {
    visibility:hidden;
    transform:scale(0);
    opacity:0;
}

/* 添加以下修正规则 */
#effectsPanel:before,
#effectsPanel:after {
    content: ""; /* 必须设置content属性 */
    position: absolute;
    display: block;
}
#sliderPanel:before,
#sliderPanel:after {
    content: "";
    position: absolute;
    display: block;
}

#effectsPanel:before {
    right: -5px;
    bottom: 15px;
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 5px solid #eef1f6;
    z-index: 1;
}
#sliderPanel:before {
    right: -5px;
    bottom: 15px;
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 5px solid #eef1f6;
    z-index: 1;
}

#effectsPanel:after {
    right: -7px;
    bottom: 14px;
    width: 0;
    height: 0;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 6px solid rgba(31,45,61,.15);
}
#sliderPanel:after {
    right: -7px;
    bottom: 14px;
    width: 0;
    height: 0;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 6px solid rgba(166,172,182,.5);
    z-index: 0;
}


/* 优化选项交互样式 */
.effect-option {
  display: flex;
  align-items: center;
  border-radius: 8px;
  transition: background 0.2s;
}
.effect-option:hover {
  background: rgba(0,0,0,0.03);
}
.effect-option.selected {
  background: rgba(0,120,255,0.08);
}
.effect-preview {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  margin-right: 12px;
}
/* 保持原有特效预览样式 */
.bubble-preview {
  background: radial-gradient(circle, rgba(0,168,255,0.8), transparent 70%);
}
.particle-preview {
  background: radial-gradient(circle, rgba(34,197,94,.75), rgba(96,165,250,.65), rgba(249,115,22,.55), transparent 70%);
}
.petals-preview {
  background: radial-gradient(circle, rgba(255,255,255,.75), rgba(255,255,255,0) 70%);
}
.confetti-preview {
  background: linear-gradient(135deg, #06b6d4, #f97316);
}
.star-preview {
  background: radial-gradient(circle, #facc15, transparent 70%);
}
.ink-preview {
  background: radial-gradient(circle, rgba(59,130,246,.55), rgba(15,23,42,0) 70%);
}
.aurora-preview {
  background: linear-gradient(135deg, rgba(34,211,238,.45), rgba(168,85,247,.45));
}
.bgstars-preview {
  background: radial-gradient(circle, rgba(250,204,21,.55), rgba(250,204,21,0) 70%);
}
.net-preview {
  background: linear-gradient(135deg, rgba(34,211,238,.45), rgba(168,85,247,.35));
}
.water-preview {
  background: radial-gradient(circle, rgba(56,189,248,.45), rgba(56,189,248,0) 70%);
}
.mist-preview {
  background: radial-gradient(circle, rgba(255,255,255,.45), rgba(255,255,255,0) 70%);
}
.grid-preview {
  background: linear-gradient(135deg, rgba(34,211,238,.35), rgba(168,85,247,.35));
}
.lines-preview {
  background: conic-gradient(from 180deg, rgba(34,211,238,.45), rgba(168,85,247,.35), rgba(34,211,238,.45));
}
.bubblesbg-preview {
  background: radial-gradient(circle, rgba(34,211,238,.35), rgba(168,85,247,.25), rgba(34,211,238,0) 70%);
}
.snow-preview {
  background: radial-gradient(circle, rgba(255,255,255,.55), rgba(255,255,255,0) 70%);
}
.sakura-preview {
  background: radial-gradient(circle, rgba(255,183,197,.55), rgba(255,183,197,0) 70%);
}
.noise-preview {
  background: radial-gradient(circle, rgba(2,6,23,.18), rgba(2,6,23,0) 70%);
}

.follow-option {
  display: flex;
  align-items: center;
  border-radius: 8px;
  transition: background 0.2s;
}
.follow-option:hover {
  background: rgba(0,0,0,0.03);
}
.follow-option.selected {
  background: rgba(0,120,255,0.08);
}
.follow-preview {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  margin-right: 12px;
  position: relative;
  background: rgba(0,0,0,0.06);
}
.follow-dot-preview::after {
  content: "";
  position: absolute;
  inset: 9px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(32,160,255,.95), rgba(32,160,255,0) 70%);
}
.follow-ring-preview::after {
  content: "";
  position: absolute;
  inset: 6px;
  border-radius: 999px;
  border: 2px solid rgba(32,160,255,.55);
}
.follow-comet-preview::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 11px;
  width: 14px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(32,160,255,.95), rgba(32,160,255,0));
}
.follow-stream-preview::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 11px;
  width: 16px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(34,211,238,.95), rgba(168,85,247,.65), rgba(34,211,238,0));
  box-shadow: 0 10px 18px rgba(34,211,238,.22);
}
.follow-gold-preview::after {
  content: "";
  position: absolute;
  inset: 7px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(250,204,21,.95), rgba(250,204,21,0) 72%);
  box-shadow: 0 10px 18px rgba(250,204,21,.22);
}
.follow-flow-preview::after {
  content: "";
  position: absolute;
  left: 4px;
  top: 11px;
  width: 18px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(34,211,238,.75), rgba(168,85,247,.55), rgba(34,211,238,0));
  box-shadow: 0 10px 18px rgba(34,211,238,.16);
}
.follow-rainbow-preview::after {
  content: "";
  position: absolute;
  inset: 6px;
  border-radius: 999px;
  background: conic-gradient(from 180deg, #ff2d55, #f97316, #facc15, #22c55e, #06b6d4, #60a5fa, #a855f7, #ff2d55);
}
.follow-neon-preview::after {
  content: "";
  position: absolute;
  inset: 6px;
  border-radius: 999px;
  box-shadow: 0 0 0 2px rgba(168,85,247,.45), 0 0 10px rgba(34,211,238,.45);
}

.bg-option {
  display: flex;
  align-items: center;
  border-radius: 8px;
  transition: background 0.2s;
}
.bg-option:hover {
  background: rgba(0,0,0,0.03);
}
.bg-option.selected {
  background: rgba(0,120,255,0.08);
}

#effectsPanel .effects-scroll::-webkit-scrollbar {
  width: 6px;
}
#effectsPanel .effects-scroll::-webkit-scrollbar-thumb {
  background: rgba(0,0,0,0.18);
  border-radius: 999px;
}
body.night #effectsPanel .effects-scroll::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,0.18);
}
/* iOS开关样式保持原有 */
.ios-switch {
  position: relative;
  display: inline-block;
  width: 50px;
  height: 26px;
}
.ios-switch input {
  opacity: 0;
  width: 0;
  height: 0;
}


.ios-switch.big .slider123:before {
  width: 24px;
  height: 24px;
}
/* 新增烟花预览样式 */
.firework-preview {
  background: radial-gradient(circle, #ff3366 20%, #ffcc00 50%, transparent 70%);
}












/* 侧边栏音乐播放器 */
/* 深色模式适配 */
body.night #musicPanel {
  background: linear-gradient(#34425a, #28364a) !important;
  box-shadow: rgba(0, 0, 0, 0.22) 0px 10px 20px, rgba(255, 255, 255, 0.05) 0px 1px 0px inset !important;
}

body.night #musicPanel:before {
  border-left-color: rgb(51 65 89) !important;
}

body.night #musicPanel:after {
  border-left-color: rgb(51 65 89) !important;
}



/* 适配音乐播放器在模态框中的样式 */
#musicPanel .music-player-wrapper {
  padding: 0;
  margin: 0;
  background: transparent;
  box-shadow: none;
}

#musicPanel .player-main {
  position: static;
  transform: none;
  box-shadow: none;
  width: 100%;
  height: auto;
}


/* ============== 统一的面板动画样式 ============== */
#musicPanel, #effectsPanel {
  --nirvana-arrow-top: 15px;
  background: #f0f2f7;
  background: linear-gradient(#f0f2f7, #fff);
  position: fixed;
  z-index: 9999;
  border-radius: 8px;
  box-shadow: 0 15px 20px rgba(31,45,61,.2), 0 0 0 2px rgba(166,172,182,.5), 0 0 0 1px #fff inset;
  transform-origin: calc(100% + 10px) calc(100% - 18px);
  transition: .5s cubic-bezier(.5,1.65,.5,1);
}

/* 统一隐藏状态 */
#musicPanel.unavailable, 
#effectsPanel.unavailable {
  visibility: hidden;
  transform: scale(0);
  opacity: 0;
  pointer-events: none;
}

/* 统一显示状态 */
#musicPanel:not(.unavailable),
#effectsPanel:not(.unavailable) {
  visibility: visible;
  transform: scale(1);
  opacity: 1;
}

/* 统一箭头指示器 */
#musicPanel:before, #musicPanel:after,
#effectsPanel:before, #effectsPanel:after {
  content: "";
  position: absolute;
  display: block;
}

#musicPanel:before, #effectsPanel:before {
  right: -5px;
  bottom: 15px;
  width: 0;
  height: 0;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 5px solid #eef1f6;
  z-index: 1;
}

#musicPanel:after, #effectsPanel:after {
  right: -7px;
  bottom: 14px;
  width: 0;
  height: 0;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 6px solid rgba(31,45,61,.15);
}

/* 音乐播放器内部调整 */
#musicPanel .music-player-wrapper {
  border-radius: 8px;
  overflow: hidden;
}



















/* ========== 玻璃拟物化公告系统 ========== */
:root {
  --glass-bg: rgb(194 220 239 / 50%); /* 提高不透明度让白色背景下更清晰 */
  --glass-border: rgba(255, 255, 255, 0.4);
  --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
  --glass-highlight: rgba(255, 255, 255, 0.2);
  --primary-color: #4a80f0;
  --text-color: #f9fafc;
  --accent-color: #ff6b6b;
}
/* 弹窗蹦跳动画 */
@keyframes popIn {
  0% {
    transform: scale(0.8) translateY(50px);
    opacity: 0;
  }
  50% {
    transform: scale(1.1) translateY(-10px);
    opacity: 1;
  }
  100% {
    transform: scale(1) translateY(0);
  }
}

/* 公告弹窗容器 - 改为flex布局 */
#panda-announcement-modal {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(8px);
  z-index: 9999;
  display: none;
  opacity: 0;
  align-items: center;
  justify-content: center;
  transition: opacity 0.3s ease;
}


#panda-announcement-modal.active {
  display: flex;
  opacity: 1;
}

#panda-announcement-container {
  width: 800px;
  max-width: 95vw;
  max-height: 90vh;
  background: #f0f2f7;
  background-image: linear-gradient(rgb(255 255 255 / 38%) 14px,rgb(255 255 255 / 12%)),radial-gradient(at center left,rgb(255 255 255 / 38%),#fffefe00);
  border: 1px solid var(--frame-border);
  border-radius: 12px;
  padding: 20px;
  animation: frameIn 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
  transform-origin: top center;
  overflow: hidden;
  box-shadow: 
    0 0 0 10px rgba(0, 0, 0, 0.03),
    0 15px 40px var(--shadow-color),
    inset 0 0 15px rgba(0, 0, 0, 0.05),
    0 0 0 1px rgba(255, 255, 255, 0.2) inset;
  backdrop-filter: blur(10px);
  display: flex;
  flex-direction: column;
}


#panda-announcement-modal.active #panda-announcement-container {
  transform: scale(1);
  opacity: 1;
}

/* 关闭按钮 */
#panda-announcement-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(5px);
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  cursor: pointer;
  z-index: 10;
  transition: all 0.3s ease;
  border: 1px solid rgba(255, 255, 255, 0.3);
}

#panda-announcement-close:hover {
  background: var(--accent-color);
  transform: rotate(90deg);
}

/* 3D玻璃头部 */
.panda-announcement-header {
  background: linear-gradient(145deg, #f9fafc, #f9fafc4a);
  backdrop-filter: blur(15px);
  border-radius: 14px;
  padding: 20px;
  margin-bottom: 20px;
  position: relative;
  box-shadow:0 8px 32px rgba(0, 0, 0, 0.1), inset 0 0 0 1px rgba(255, 255, 255, 0.2), inset 0 -10px 20px rgba(0, 0, 0, 0.05);
  transform-style: preserve-3d;
  transform: perspective(800px) rotateX(1deg);
  border: 1px solid var(--frame-border);
}

body.night .panda-announcement-header h3{    color: rgba(255, 255, 255, .9); }
.panda-announcement-header h3 {
  font-size: 22px;
  margin: 0 0 8px;
  color: #8492a6;
  text-shadow: 
    0 1px 2px rgba(0, 0, 0, 0.1),
    0 0 10px rgba(255, 255, 255, 0.4);
}
.panda-announcement-header p {
  font-size: 14px;
  margin: 0;
  opacity: 0.9;
  color: #8492a6;
}


.panda-announcement-header i {
  background: linear-gradient(135deg, rgba(30, 202, 228, 0.8), rgba(24, 177, 208, 0.9));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));
}
body.night .panda-announcement-content {  background: linear-gradient(135deg, #dddddd5c 0%, #f9fafc00 100%);}
/* 内容区域 */
.panda-announcement-content {
  display: flex;
  flex: 1;
  min-height: 0;
  background: linear-gradient(135deg, #f1ecec2b 0%, #f0f2f7 100%);
  backdrop-filter: blur(12px);
  border-radius: 12px;
  border: 1px solid var(--frame-border);
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.1),
    inset 0 0 0 1px rgba(255, 255, 255, 0.2),
    inset 0 -10px 20px rgba(0, 0, 0, 0.05);
}
body.night .announcement-list {  background: rgba(0, 0, 0, 0.03);}
/* 公告列表 */
.announcement-list {
  width: 30%;
  padding: 15px;
  border-right: 1px solid var(--divider);

  overflow-y: auto;
}
.announcement-item {
  padding: 12px 15px;
  margin-bottom: 8px;
  border-radius: 8px;
  background: var(--highlight);
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  box-shadow: 0 10px 20px #99a9bf99, inset 0 1px 0 rgba(255, 255, 255, .9);
}

body.night .announcement-list-header {     border-bottom: 1px solid #5e646d; color: white;}
.announcement-list-header {
  font-size: 16px;
  font-weight: bold;
  color: #8492a6;
  margin-bottom: 15px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--glass-border);
}



.announcement-item::after {
  content: "";
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 6px;
  background: var(--primary-color);
  border-radius: 50%;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.announcement-item:hover {
  background: rgba(74, 128, 240, 0.1);
  transform: translateX(2px);
}

.announcement-item.active {
  background: linear-gradient(90deg, rgba(74, 128, 240, 0.2), transparent);
  border-left: 2px solid var(--primary-color);
}


.announcement-item.active::after {
  opacity: 1;
}


body.night .announcement-item .title {  color: white;}
.announcement-item .title {
  font-weight: 500;
  color: #8492a6;
  margin-bottom: 4px;
}
body.night .announcement-item .date {  color: rgba(255, 255, 255, 0.6);}
.announcement-item .date {
  font-size: 12px;
  color: #8492a6;
}

/* 右侧详情区域 - 70%宽度 */
/* 详情区域 */
.announcement-detail {
  width: 70%;
  padding: 20px;
  overflow-y: auto;
}

.announcement-page {
  display: none;
}

.announcement-page.active {
  display: block;
  animation: fadeIn 0.5s ease;
}

.announcement-page h4 {
  font-size: 18px;
  margin-top: 0;
  color: #8492a6;
}
.announcement-page .content {
  color: #8492a6;
  line-height: 1.6;
}
.announcement-page h4 i {
  margin-right: 10px;
  color: var(--primary-color);
}


.announcement-page .content p {
  margin-bottom: 15px;
}

.announcement-page .content a {
   color: #8492a6;
  text-decoration: none;
  position: relative;
}



.announcement-page .content a:hover {
  text-decoration: underline;
}

/* 底部按钮区域 */
/* 底部按钮 */
.panda-form-submit {
  text-align: center;
  padding-top: 20px;
  margin-top: 20px;
  border-top: 1px solid var(--divider);
}
body.night .panda-metal-btn {background:linear-gradient(145deg, #1f2a3d, #766e77) !important}
.panda-metal-btn {
   padding: 12px 28px;
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    backdrop-filter: blur(10px);
 background: linear-gradient(145deg, #e0e5ed00, #3d4143a3) !important;
    box-shadow:
        0 4px 15px rgba(0, 0, 0, 0.2),
        0 0 0 1px rgba(255, 255, 255, 0.3) inset,
        0 0 20px rgba(255, 255, 255, 0.1) inset !important;
}
.panda-metal-btn:hover {
  transform: translateY(-2px);
  box-shadow: 
    0 6px 20px rgba(0, 0, 0, 0.25),
    0 0 0 1px rgba(255, 255, 255, 0.4) inset,
    0 0 30px rgba(255, 255, 255, 0.2) inset;
}
/* 关闭按钮 */
#panda-announcement-close {
  position: absolute;
  top: 15px;
  right: 15px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgba(255,255,255,0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  z-index: 9999;
  border: 1px solid rgba(255,255,255,0.3);
}
#panda-announcement-close:hover {
  background: rgba(255,255,255,0.2);
  transform: rotate(90deg);
}


.panda-metal-btn:active {
  transform: translateY(0);
  box-shadow: 0 2px 10px rgba(74, 128, 240, 0.3);
}

.panda-metal-btn i {
  margin-right: 8px;
}

/* 页面指示器 */
.panda-page-indicator {
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
}

/* 添加关闭动画 */
@keyframes frameOut {
  0% {
    transform: perspective(1000px) rotateX(0);
    opacity: 1;
  }
  100% {
    transform: perspective(1000px) rotateX(90deg);
    opacity: 0;
  }
}

/* 添加关闭动画 - 与打开动画完全对称 */
@keyframes popOut {
  0% {
    transform: scale(1) translateY(0);
    opacity: 1;
  }
  50% {
    transform: scale(1.1) translateY(-10px);
    opacity: 1;
  }
  100% {
    transform: scale(0.8) translateY(50px);
    opacity: 0;
  }
}

/* 添加关闭状态 */
#panda-announcement-modal.closing {
  opacity: 0;
  transition: opacity 0.3s ease;
}

/* 新增关闭状态 */
#panda-announcement-modal.closing {
  opacity: 0;
  transition: opacity 0.3s ease 0.3s; /* 延迟0.3s让容器动画先执行 */
}

#panda-announcement-modal.closing #panda-announcement-container {
  animation: frameOut 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

/* 动画效果 */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

/* 夜间模式适配 */
body.night #panda-announcement-container {
  background: #28374a;
  border: 1px solid rgba(255, 255, 255, 0.1);
}

body.night .panda-announcement-header {
  background: rgba(0, 0, 0, 0.3);
}

body.night .announcement-list {
  background: rgba(0, 0, 0, 0.2);
}

body.night .announcement-detail {
  background: rgba(0, 0, 0, 0.15);
}

body.night .panda-metal-btn {
  background: linear-gradient(145deg, rgba(74, 128, 240, 0.6), rgba(58, 100, 204, 0.7));
}


/* 响应式设计 */
@media (max-width: 768px) {
  #panda-announcement-container {
    width: 92vw;
    max-height: 85vh;
  }
  
  .panda-announcement-content {
    flex-direction: column;
  }
  
  .announcement-list, .announcement-detail {
    width: 100%;
  }
  
  .announcement-list {
    max-height: 150px;
    border-right: none;
    border-bottom: 1px solid var(--divider);
  }
  
  .announcement-detail {
    max-height: calc(85vh - 150px - 120px);
  }
}
/* 动画效果 */
@keyframes frameIn {
  0% { transform: perspective(1000px) rotateX(-90deg); opacity: 0; }
  100% { transform: perspective(1000px) rotateX(0); opacity: 1; }
}
@keyframes frameOut {
  0% { transform: perspective(1000px) rotateX(0); opacity: 1; }
  100% { transform: perspective(1000px) rotateX(90deg); opacity: 0; }
}
/* 夜间模式适配 */
body.night #panda-announcement-container {
  background: rgba(40, 40, 55, 0.85);
  --frame-border: rgba(255, 255, 255, 0.08);
}
body.night .panda-announcement-header {
  background: linear-gradient(145deg, rgba(205, 205, 209, 0.3), rgba(66, 66, 69, 0.2));
}
body.night .announcement-list {
  background: rgba(0, 0, 15, 0.1);
}
body.night .announcement-item {
  background: rgba(50, 50, 65, 0.3);
      box-shadow: 0 10px 20px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .05);
}
body.night .announcement-item.active {
  background: linear-gradient(90deg, rgba(74, 128, 240, 0.3), transparent);
}












































/* 友情链接申请 */

/* 错误状态样式 */
.error-field {
    border-color: #ff4444 !important;
    box-shadow: 0 0 0 2px rgba(255, 68, 68, 0.2) !important;
    animation: shake 0.5s ease-in-out;
}

@keyframes shake {
    0%, 100% { transform: translateX(0); }
    20%, 60% { transform: translateX(-5px); }
    40%, 80% { transform: translateX(5px); }
}


#panda-friendly-link-form {
    background: linear-gradient(
        135deg, 
        #dddddd5c 0%, 
        #f9fafc00 100%
    );
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-radius: 12px;
    border: 1px solid var(--frame-border);
    padding: 20px;
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.1),
        inset 0 0 0 1px rgba(255, 255, 255, 0.2),
        inset 0 -10px 20px rgba(0, 0, 0, 0.05);
    position: relative;
    overflow: auto;
    flex: 1 1 auto;
    min-height: 0;
    -webkit-overflow-scrolling: touch;
}

/* 玻璃边缘高光效果 */
#panda-friendly-link-form::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.4) 50%,
        rgba(255, 255, 255, 0) 100%
    );
}

/* 日间/夜间模式适配 */
:root #panda-friendly-link-form {
    --form-glass-bg: rgba(255, 255, 255, 0.25);
    --form-glass-highlight: rgba(255, 255, 255, 0.3);
}

body.night #panda-friendly-link-form {
    --form-glass-bg: rgba(40, 40, 55, 0.3);
    --form-glass-highlight: rgba(255, 255, 255, 0.1);
}

/* 表单项内部玻璃效果 */
.panda-form-group {
    background: var(--form-glass-bg);
    backdrop-filter: blur(8px);
    border-radius: 8px;
    padding: 8px 12px;
    margin-bottom: 12px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow:
        0 2px 8px rgba(0, 0, 0, 0.05),
        inset 0 0 10px rgba(255, 255, 255, 0.05);
    transition: all 0.3s ease;
}

/* 输入框玻璃效果 */
.panda-input, .panda-select {
    background: rgba(255, 255, 255, 0.15) !important;
    backdrop-filter: blur(5px);
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    box-shadow:
        inset 0 1px 3px rgba(0, 0, 0, 0.1),
        0 1px 0 rgba(255, 255, 255, 0.1);
}

/* 夜间模式调整 */
body.night .panda-input,
body.night .panda-select {
    background: rgba(40, 40, 55, 0.4) !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
}

/* 按钮增强玻璃效果 */
body.night .panda-btn {background: linear-gradient(145deg, #1f2a3d, #766e77) !important}
.panda-btn {
   
    box-shadow:
        0 4px 15px rgba(0, 0, 0, 0.2),
        0 0 0 1px rgba(255, 255, 255, 0.3) inset,
        0 0 20px rgba(255, 255, 255, 0.1) inset !important;
}

/* 悬浮增强效果 */
.panda-form-group:hover {
    background: var(--form-glass-highlight);
    transform: translateY(-1px);
    box-shadow:
        0 4px 12px rgba(0, 0, 0, 0.1),
        inset 0 0 10px rgba(255, 255, 255, 0.1);
}

.panda-btn:hover {
    box-shadow:
        0 6px 20px rgba(0, 0, 0, 0.25),
        0 0 0 1px rgba(255, 255, 255, 0.4) inset,
        0 0 30px rgba(255, 255, 255, 0.2) inset !important;
    transform: translateY(-1px);
}


/* 夜间模式变量 */
body.night {
    --frame-bg: rgba(40, 40, 55, 0.85);
    --frame-border: rgba(255, 255, 255, 0.08);
    --text-color: #f0f0f0;
    --input-bg: rgba(50, 50, 60, 0.8);
    --input-border: rgba(255, 255, 255, 0.1);
    --shadow-color: rgba(0, 0, 0, 0.5);
    --btn-bg: linear-gradient(145deg, #2a8596, #1e6b7c);
    --highlight: rgba(255, 255, 255, 0.1);
    --divider: rgba(255, 255, 255, 0.1);
}

/* 日间模式变量 */
:root {
    --frame-bg: rgba(255, 255, 255, 0.95);
    --frame-border: rgba(0, 0, 0, 0.1);
    --text-color: #333;
    --input-bg: rgba(255, 255, 255, 0.9);
    --input-border: rgba(0, 0, 0, 0.1);
    --shadow-color: rgba(0, 0, 0, 0.2);
    --btn-bg: linear-gradient(145deg, #1ecae4, #18b1d0);
    --highlight: rgba(0, 0, 0, 0.05);
    --divider: rgba(0, 0, 0, 0.1);
}

/* 3D相框效果 */
.panda-frame {
    position: relative;
    background: var(--frame-bg);
    border: 1px solid var(--frame-border);
    border-radius: 12px;
    padding: 20px;
    box-shadow: 
        0 0 0 10px rgba(0, 0, 0, 0.03),
        0 15px 40px var(--shadow-color),
        inset 0 0 15px rgba(0, 0, 0, 0.05),
        0 0 0 1px rgba(255, 255, 255, 0.2) inset;
    backdrop-filter: blur(10px);
}

.panda-frame::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 15px;
    background: linear-gradient(to bottom, rgba(255,255,255,0.3), transparent);
    border-radius: 12px 12px 0 0;
}

/* 弹窗容器 */
#panda-friendly-link-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(8px);
    z-index: 9999;
    display: none;
    opacity: 0;
    align-items: center;
    justify-content: center;
    transition: opacity 0.3s ease;
}

/* 替换原有的frameDrop动画 */
@keyframes frameIn {
    0% { transform: perspective(1000px) rotateX(-90deg); opacity: 0; }
    100% { transform: perspective(1000px) rotateX(0); opacity: 1; }
}

@keyframes frameOut {
    0% { transform: perspective(1000px) rotateX(0); opacity: 1; }
    100% { transform: perspective(1000px) rotateX(90deg); opacity: 0; }
}

#panda-friendly-link-container {
    width: 480px;
    max-height: 90vh;
    animation: frameIn 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
    transform-origin: top center;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

#panda-friendly-link-container.closing {
    animation: frameOut 0.5s cubic-bezier(0.6, -0.3, 0.74, 0.05) forwards;
}

/* 一行式表单布局 */
.panda-form-group {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}

.panda-form-group label {
    width: 100px;
    flex-shrink: 0;
    font-size: 14px;
    color: var(--text-color);
    display: flex;
    align-items: center;
}

.panda-form-group label i {
    margin-right: 8px;
    width: 16px;
    text-align: center;
}

.panda-input, .panda-select, .panda-textarea {
    flex: 1;
    padding: 10px 15px;
    background: var(--input-bg);
    border: 1px solid var(--input-border);
    border-radius: 6px;
    font-size: 14px;
    color: var(--text-color);
    transition: all 0.3s ease;
}

/* 标题样式 */
.panda-friendly-link-header {
    text-align: center;
    padding-bottom: 15px;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--divider);
}

.panda-friendly-link-header h3 {
    font-size: 20px;
    margin: 0 0 5px;
    color: var(--text-color);
    font-weight: 600;
}

.panda-friendly-link-header p {
    font-size: 13px;
    color: var(--text-color);
    opacity: 0.7;
    margin: 0;
}

/* 底部提交按钮 */
.panda-form-submit {
    text-align: center;
    padding-top: 15px;
    margin-top: 20px;
    border-top: 1px solid var(--divider);
}

.panda-btn {
    padding: 12px 28px;
    background: 
        linear-gradient(145deg, 
            rgba(30, 202, 228, 0.8), 
            rgba(24, 177, 208, 0.9));
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    backdrop-filter: blur(10px);
    box-shadow: 
        0 4px 15px rgba(0, 0, 0, 0.1),
        0 0 0 1px rgba(255, 255, 255, 0.2) inset,
        0 0 20px rgba(255, 255, 255, 0.1) inset;
}

.panda-btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(
        135deg, 
        rgba(255, 255, 255, 0.3) 0%, 
        transparent 50%, 
        rgba(255, 255, 255, 0.2) 100%
    );
    opacity: 0.6;
}


/* 关闭按钮 */
/* 修复关闭按钮层级问题 */
#panda-friendly-link-close {
    position: absolute;
    top: 15px;
    right: 15px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: rgba(255,255,255,0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    z-index: 9999; /* 添加确保在最顶层 */
    border: 1px solid rgba(255,255,255,0.3); /* 增强可见性 */
    box-shadow: 0 0 10px rgba(0,0,0,0.2);
}

/* 增强关闭按钮交互反馈 */
#panda-friendly-link-close:hover {
    background: rgba(255,255,255,0.2);
    transform: rotate(90deg);
    box-shadow: 0 0 15px rgba(0,0,0,0.3);
}

#panda-friendly-link-close i {
    font-size: 14px;
    color: inherit;
    position: relative;
    z-index: 1;
}


/* 响应式设计 */
/* 更新移动端响应式样式 */
@media (max-width: 768px) {
    #panda-friendly-link-container {
        width: 92vw !important;
        max-width: none;
 
    }
    
    /* 保持表单元素在一行 */
    .panda-form-group {
        display: flex !important; /* 强制保持flex布局 */
        flex-wrap: nowrap !important; /* 禁止换行 */
        overflow-x: auto; /* 允许横向滚动 */
        padding-bottom: 5px; /* 为滚动条留空间 */
    }
    
    .panda-form-group::-webkit-scrollbar {
        height: 3px;
    }
    
    .panda-form-group label {
        width: auto !important; /* 自动宽度 */
        min-width: 80px; /* 最小宽度 */
        margin-right: 10px;
        margin-bottom: 0 !important;
    }
    
    .panda-input, .panda-select {
        min-width: 180px; /* 输入框最小宽度 */
    }
    
    /* 颜色选择器特殊处理 */
    .panda-color-picker {
        min-width: 220px;
    }
    
    /* 调整关闭按钮位置 */
    #panda-friendly-link-close {
        top: 10px;
        right: 10px;
    }
}




/* 在移动端样式块中添加 */
.panda-form-group {
    scrollbar-width: thin;
    scrollbar-color: rgba(0,0,0,0.2) transparent;
}








/* 紧凑型颜色选择器组件 */
.panda-color-picker {
    display: flex;
    flex: 1;
    align-items: center;
    gap: 8px;
}

.panda-color-picker .panda-input {
    flex: 1;
    min-width: 100px;
}

.color-preview {
    width: 25px;
    height: 25px;
    border-radius: 4px;
    border: 1px solid var(--input-border);
    cursor: pointer;
}

#site_color_picker {
    width: 30px;
    height: 30px;
    padding: 0;
    border: none;
    background: transparent;
    cursor: pointer;
}

#site_color_picker::-webkit-color-swatch {
    border-radius: 4px;
    border: 1px solid var(--input-border);
}

#site_color_picker::-webkit-color-swatch-wrapper {
    padding: 0;
}




/* 3D玻璃表头特效 */
.panda-friendly-link-header {
    background: linear-gradient(
        145deg, 
        rgb(215 206 206 / 25%), 
        rgba(255, 255, 255, 0.15)
    );
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    border-radius: 14px;
    padding: 20px;
    margin-bottom: 25px;
    position: relative;
    overflow: hidden;
    box-shadow:
        0 16px 30px -10px rgba(0, 0, 0, 0.2),
        0 0 0 1px rgba(255, 255, 255, 0.3) inset,
        0 -10px 20px -5px rgba(255, 255, 255, 0.1) inset;
    transform-style: preserve-3d;
    transform: perspective(800px) rotateX(1deg);
    border: 1px solid rgba(255, 255, 255, 0.3);
    transition: all 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}


/* 底部3D厚度模拟 */
.panda-friendly-link-header::after {
    content: '';
    position: absolute;
    bottom: -8px;
    left: 8px;
    right: 8px;
    height: 8px;
    background: linear-gradient(
        to bottom,
        rgba(0, 0, 0, 0.1),
        transparent
    );
    border-radius: 0 0 14px 14px;
    filter: blur(5px);
    transform: translateZ(-10px);
    z-index: -1;
}

/* 标题文字特效 */
.panda-friendly-link-header h3 {
    font-size: 22px;
    font-weight: 700;
    margin: 0 0 8px;
    color: var(--text-color);
    text-shadow: 
        0 1px 2px rgba(0, 0, 0, 0.1),
        0 0 10px rgba(255, 255, 255, 0.4);
    letter-spacing: 0.5px;
    position: relative;
}

.panda-friendly-link-header p {
    font-size: 14px;
    margin: 0;
    opacity: 0.9;
    color: var(--text-color);
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}

/* 图标特殊处理 */
.panda-friendly-link-header i {
    background: linear-gradient(
        135deg,
        rgba(30, 202, 228, 0.8),
        rgba(24, 177, 208, 0.9)
    );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));
}

/* 鼠标悬停动态响应 */
.panda-friendly-link-header:hover {
    transform: perspective(800px) rotateX(2deg) translateY(-2px);
    box-shadow:
        0 20px 40px -10px rgba(0, 0, 0, 0.25),
        0 0 0 1px rgba(255, 255, 255, 0.4) inset,
        0 -15px 25px -5px rgba(255, 255, 255, 0.15) inset;
}

/* 光效动画 */
@keyframes glassShine {
    0% { transform: rotate(45deg) translate(-100%, -100%); }
    100% { transform: rotate(45deg) translate(100%, 100%); }
}

/* 夜间模式适配 */
body.night .panda-friendly-link-header {
    background:linear-gradient(
        145deg, 
        rgb(205 205 209 / 30%), 
        rgb(66 66 69 / 20%)
    );
    box-shadow:
        0 16px 30px -10px rgba(0, 0, 0, 0.3),
        0 0 0 1px rgba(255, 255, 255, 0.1) inset,
        0 -10px 20px -5px rgba(255, 255, 255, 0.05) inset;
}

body.night .panda-friendly-link-header::after {
    background: linear-gradient(
        to bottom,
        rgba(0, 0, 0, 0.3),
        transparent
    );
}

body.night .panda-friendly-link-header i {
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3));
}

/* 友情链接申请结束 */





















body.night a[href]{color:#f0f2f7}
a[href]{color:#5b646b}


/* 轮播图按钮特效 */
#coverflow .content .read-more a {
    position: relative;
    display: inline-block;
    padding: 8px 25px;
    color: white;
    text-decoration: none;
    border-radius: 50px;
    overflow: hidden;
    font-weight: 600;
    letter-spacing: 1px;
    background: transparent;
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    transition: all 0.4s ease;
    z-index: 1;
}

/* 流光环绕效果 */
#coverflow .content .read-more a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border: 2px solid transparent;
    border-radius: 50px;
    background: linear-gradient(
        90deg, 
        transparent 20%,
        rgba(255,255,255,0.4) 50%,
        transparent 80%
    );
    background-size: 200% 100%;
    background-position: -100% 0;
    animation: lightLoop 3s linear infinite;
    pointer-events: none;
    filter: blur(1px);
}

/* 悬停3D效果 */
#coverflow .content .read-more a:hover {
    transform: perspective(500px) rotateX(5deg) scale(1.05);
    box-shadow: 
        0 8px 25px rgba(0,0,0,0.3),
        inset 0 0 15px rgba(255,255,255,0.2);
}

/* 悬停高光效果 */
#coverflow .content .read-more a:hover::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: radial-gradient(
        circle at var(--mouse-x) var(--mouse-y),
        rgba(255,255,255,0.6) 0%,
        transparent 70%
    );
    pointer-events: none;
}

/* 动画定义 */
@keyframes lightLoop {
    0% {
        background-position: -100% 0;
    }
    100% {
        background-position: 200% 0;
    }
}




/* dgg调整原有样式 */


.text-bulge-error, 
.text-bulge-primary,
.text-bulge-success {
  padding: 4px 10px; /* 统一内间距 */
  min-width: 10px; /* 设置最小宽度 */
  display: inline-flex; /* 保持行内特性但可使用flex属性 */
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中 */
}



/* 轮播图文字美化 */
#coverflow .content h1, #coverflow .content h2{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}

#coverflow .content .category{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}



.pf_user_info .meta .name{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}


.pf_user_info .meta .description{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}


.post-iteme.carde .title{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;}


.post-iteme .tags span, .post-iteme .tags a{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}
.post-card .title span{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}


.post-card .metas{
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}


.post-card-col .pf_card1 .title h4{
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}


.post-card-wrapper2 .main-title{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}


.post-card-nested-col .post-card.is-nested .title span{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}
.product-card-wrapper .card .title{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}
.product-card-wrapper .card .title{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}
    
    
    .categoryNav[pandaTab]>.menu>li>a{
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}
    
    .topNav[pandaTab]>.menu>li>a{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}
    .main-nav .login .vcard .name{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}
    
    #coverflow .content .read-more a{
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}
    .postLists.hfg .card h2{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;
    }
.postLists.hfg .card .tags a{
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}
    
    .postLists.hfg .card .meta .date{
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}
    
    
    .postLists .card .summary span{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}
    
    
    
    .neo-3d-text{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}
    
    .neo-glass-title{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}

    .music-player-wrapper .play-list li .index{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}
    
    .music__info .music__info--singer, .music__info .music__info--title{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;}
    body.night .main-nav .login .vcard .name{color: #dbe0e7 !important;}
    body.night .beian a, body.night .pf_user_info .meta .name{color: #dbe0e7 !important;}
    body.night .pf_user_info .meta .description{color: #dbe0e7 !important;}
body.night .topNav[pandaTab]>.menu>li>a{color: #dbe0e7 !important;}
    body.night  .categoryNav[pandaTab]>.menu>li>a{ color: #d8e0ea;}
    body.night  .product-card-wrapper .card .description{
        color: #d8e0ea;
    }
    .product-card-wrapper .card .description{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;
    
    }
    
    
    body.night .categoryNav[pandaTab]>.menu>li.active>a{
        color: #d8e0ea !important;
        background:linear-gradient(#435367, #101a3d) !important;
        box-shadow: 0 0 0 1px #34425a inset, 0 5px 4px #151f2d, 0 5px 4px #2c3a51 !important;
    }
.display-switcher[pandaTab]>.menu>li>a{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}
/* 前端样式切换：激活态高亮 */
.display-switcher[pandaTab]>.menu>li.active>a{
    color:#475669 !important;
 
}
body.night .display-switcher[pandaTab]>.menu>li.active>a{
    color:#d8e0ea !important;
   
}
    body.night .long-model .model-title{color: #f0f2f7; }
    .long-model .model-title{
    -webkit-mask: linear-gradient(#000 20%,rgba(0,0,0,.6) 70%) 0 0/100% 1.3em !important;
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}
    
 
    .postLists .readMore a{
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}
    
    body.night .normal_searchBtn{color: #dbe0e7;}
    .normal_searchBtn{
    text-shadow: 0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;}
    

    
/* 公告 */


body.night .neo-glass-panel {
    -webkit-box-shadow: 0 15px 20px rgba(31, 45, 61, .2), 0 0 0 1px rgba(166, 172, 182, .5), 0 0 0 1px #34425a inset;
    box-shadow: 0 15px 20px rgba(31, 45, 61, .2), 0 0 0 1px rgba(166, 172, 182, .5), 0 0 0 1px #34425a inset;
    background: #34425a;
    background: -webkit-gradient(linear, left top, left bottom, from(#34425a), to(#28374a));
    background: -webkit-linear-gradient(#34425a, #28374a);
    background: linear-gradient(#34425a, #28374a)
}

body.night .neo-connector-column{background:rgb(44 56 69 / 59%)}
body.night .postLists.hfg .card .tags a{background:rgb(44 56 69 / 59%)}

body.night .post-card-wrapper2{box-shadow:0 0 0 1px #505c6d inset, 0 1px #453b3b inset, 0 0.75em 1em rgb(15 15 16 / 39%);
background:linear-gradient(#28374a,rgba(31,45,61,.2) 20%,#202733 95%,#334148)
    
}
body.night .post-iteme.carde .inner{
-webkit-box-shadow:0 6px 6px #17202d, 0 6px 5px #1b2129, 0 -1px 2px #34425a inset !important}

body.night .post-card-col .pf_card1 .metas{
-webkit-box-shadow:0 6px 6px #17202d, 0 6px 5px #1b2129, 0 -1px 2px #34425a inset !important}
body.night .post-card-wrapper2 .card{box-shadow: 0 0 0 1px #34393f, 0 0 0 1px #495567 inset}



























/*登录*/


.s-vcard-moudle img {
    vertical-align: top
}

.s-vcard-moudle {
    position: absolute;
    right: 45px;
    top: 0;
    cursor: pointer;
    -webkit-transition: .25s ease .25s;
    transition: .25s ease .25s
}

.s-vcard-moudle i {
    font-size: 22px;
    line-height: 22px;
    color: #99a9bf
}

.s-vcard-moudle img {
    height: 22px;
    width: 22px;
    border-radius: 7px;
    background-color: #fff;
    box-shadow: 0 4px 4px rgba(0, 0, 0, .15)
}

@media (min-width:992px) {
  #coverflow .content h1, 
  #coverflow .content h2 {
    /* 重置原有单行样式 */
    white-space: normal;
    text-overflow: clip;
    
    /* 新增强制两行布局 */
    display: -webkit-box;
    -webkit-line-clamp: 2;  /* 限制两行 */
    -webkit-box-orient: vertical;
    line-height: 1.3;       /* 行高建议调整为1.3-1.5倍字号 */
    max-height: calc(2em * 1.3); /* 两行高度计算值 */
  }
}
    
@media(max-width:991px) {
    .post-iteme.carde .tags{
         width: 100%;            /* 或者固定 px 值，比如 200px */  
    white-space: nowrap;    /* 强制不换行 */  
    overflow: hidden;       /* 隐藏溢出的内容 */  
    text-overflow: ellipsis; /* 超出显示 "..." */  
    }
    #coverflow .content h1, #coverflow .content h2{
            width: 100%;            /* 或者固定 px 值，比如 200px */  
    white-space: nowrap;    /* 强制不换行 */  
    overflow: hidden;       /* 隐藏溢出的内容 */  
    text-overflow: ellipsis; /* 超出显示 "..." */  
    }
    .post-card2 .tags{
        
         width: 100%;            /* 或者固定 px 值，比如 200px */  
    white-space: nowrap;    /* 强制不换行 */  
    overflow: hidden;       /* 隐藏溢出的内容 */  
    text-overflow: ellipsis; /* 超出显示 "..." */  
    }
    .menu-wrap-visible .mobileNavMenuBtn .s-vcard-moudle.login-button-mobile {
        visibility: hidden;
        opacity: 0;
        -webkit-transform: translateX(20px);
        transform: translateX(20px);
        -webkit-transition: .25s;
        transition: .25s
    }
}





.main-nav .login {
    position: relative;
    padding: 0;
    flex-shrink: 0;
    height: 58px;
    transition: .35s
}

.main-nav .login .vcard {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    transition: .5s;
    width: calc(100% - 0px) !important
}

.main-nav .login .vcard .avatar {
    height: 30px;
    width: 30px;
    border-radius: 7px;
    background-color: #fff;
    margin-right: 9px;
    transition: .5s
}

.main-nav .login .vcard .caret {
    transition: .5s
}

.main-nav .login .login-main {
    position: absolute;
    right: 0;
    top: 63px;
    box-shadow: 0 4px 8px rgba(31, 45, 61, .2);
    background: #fff;
    border-radius: 6px;
    transform-origin: 0 -5px;
    transform: scaleY(0);
    opacity: 0;
    visibility: hidden;
    width: 150px;
    transition: .25s
}

.main-nav .login .login-main:before {
    content: "";
    position: absolute;
    display: block;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid #fff;
    top: -5px;
    right: 18px
}

.main-nav .login .login-main:after {
    content: "";
    position: absolute;
    display: block;
    top: -5px;
    left: 0;
    right: 0;
    height: 5px
}

.main-nav .login .login-main.mobile-show {
    visibility: visible;
    opacity: 1;
    transform: scaleY(1)
}

.main-nav .login .login-main .user-type {
    color: #657487;
    padding: 15px;
    border-bottom: 1px solid #eff2f7
}

.main-nav .login .login-main .operation {
    padding: 6px
}

.main-nav .login .login-main .operation a {
    display: flex;
    padding: 7px 9px;
    color: #20a0ff;
    border-radius: 4px;
    cursor: pointer;
    transition: .25s
}

.main-nav .login .login-main .operation a:hover {
    background: rgba(32, 160, 255, .1);
    transition: 0s
}

.main-nav .login .login-main .operation a i {
    width: 16px;
    text-align: center;
    margin-right: 5px
}

.main-nav .login .vcard {
    color: #8492a6;
    text-shadow: none;
    cursor: pointer;
    height: 58px
}

.main-nav .login .vcard .avatar {
    box-shadow: inset 0 0 transparent, 0 8px 8px rgba(31, 45, 61, .1)
}

.main-nav .login .vcard .caret {
    opacity: 1
}

.main-nav .login .vcard .name {
    margin-right: 0 !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.main-nav .login .nir-nav-dd {
    position: relative;
}

.main-nav .login .nir-nav-dd-trigger {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    height: 52px;
}

.main-nav .login .nir-nav-dd-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    margin-left: 6px;
    cursor: pointer;
    color: #99a9bf;
    transition: .2s;
}

.main-nav .login .nir-nav-dd.is-open .nir-nav-dd-icon {
    transform: rotate(180deg);
}

.main-nav .login .nir-nav-dd-menu {
    display: block;
    position: absolute;
    right: 0;
    top: calc(100% + 6px);
    padding: 6px;
    border: 0;
    border-radius: 6px;
    box-shadow: 0 4px 8px rgba(31, 45, 61, .2);
    background: #fff;
    min-width: 170px;
    z-index: 9999;
    opacity: 0;
    transform: translateY(-6px) scale(.985);
    transform-origin: top right;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .18s ease, transform .18s ease, visibility 0s linear .18s;
    will-change: opacity, transform;
}

.main-nav .login .nir-nav-dd.is-open .nir-nav-dd-menu {
    opacity: 1;
    transform: translateY(0) scale(1);
    visibility: visible;
    pointer-events: auto;
    transition: opacity .18s ease, transform .18s ease, visibility 0s;
}

.main-nav .login .nir-nav-dd-menu:before {
    content: "";
    position: absolute;
    display: block;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #fff;
    top: -6px;
    right: 18px;
}

.main-nav .login .nir-nav-dd-head {
    color: #657487;
    padding: 10px 12px;
    border-bottom: 1px solid #eff2f7;
    margin: -6px -6px 6px;
}

.main-nav .login .nir-nav-dd-body {
    padding: 2px 0;
}

.main-nav .login .nir-nav-dd-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 4px;
    color: #20a0ff;
    transition: .25s;
}

.main-nav .login .nir-nav-dd-item i {
    width: 16px;
    text-align: center;
}

.main-nav .login .nir-nav-dd-item:hover {
    background: rgba(32, 160, 255, .1);
}

.main-nav .login .nir-nav-dd-divider {
    height: 1px;
    background: #eff2f7;
    margin: 6px 0;
}

body.night .main-nav .login .nir-nav-dd-menu {
    background: linear-gradient(#132235 calc(100% - 1.5em), #34425a);
}

body.night .main-nav .login .nir-nav-dd-menu:before {
    border-bottom: 6px solid #181f2d;
    
}

body.night .nir-nav-uc-name{ color: #f9fafc; }
body.night .nir-nav-uc-tab{ color: #f9fafc;}
body.night .nir-nav-uc-card{    background: linear-gradient(#132235 calc(100% - 1.5em), #34425a) !important;
    color: #f9fafc !important; }
body.night .main-nav .login .nir-nav-dd-head {
    color: #9aa4b2;
    border-bottom-color: rgba(255, 255, 255, .08);
}

body.night .main-nav .login .nir-nav-dd-item {
    color: #7cc4ff;
}

body.night .main-nav .login .nir-nav-dd-divider {
    background: rgba(255, 255, 255, .08);
}

@media (max-width: 991px) {
    .mobileNavMenuBtn .nir-nav-dd-menu {
        position: fixed;
        top: 62px;
        left: 12px;
        right: auto;
        z-index: 999999;
        max-width: calc(100vw - 24px);
    }
}




























/*背景流光*/

body.night::after {
  content: "";
  position: fixed;
  top: 0;
  left: -25%;
  width: 25%;
  height: 100%;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(166, 172, 182, 0.15) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  transform: skewX(-25deg);
  animation: sweep 5s infinite cubic-bezier(0.4, 0, 0.2, 1);
  filter: blur(5px);
  opacity: 0;
  z-index: 0;
}

@keyframes sweep {
  0% {
    transform: translateX(-50%) translateY(-50%) rotate(30deg);
  }
  100% {
    transform: translateX(50%) translateY(50%) rotate(30deg);
  }
}

body::after {
  content: "";
  position: fixed;
  top: 0;
  left: -25%;
  width: 25%;
  height: 100%;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.15) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  transform: skewX(-25deg);
  animation: sweep 5s infinite cubic-bezier(0.4, 0, 0.2, 1);
  filter: blur(5px);
  opacity: 0;
  z-index: 0;
}

.nir-glow-host{
	position:relative;
	overflow:hidden
}
.nir-glow-host>.nir-follow-glow{
	position:absolute;
	inset:0;
	border-radius:inherit;
	pointer-events:none;
	opacity:0;
	transition:opacity .2s;
	background:radial-gradient(circle at var(--nir-glow-x,50%) var(--nir-glow-y,50%), rgba(255,255,255,.35), rgba(255,255,255,0) 60%)
}
body.night .nir-glow-host>.nir-follow-glow{
	background:radial-gradient(circle at var(--nir-glow-x,50%) var(--nir-glow-y,50%), rgba(255,255,255,.16), rgba(255,255,255,0) 60%)
}
.nir-glow-host.is-glowing>.nir-follow-glow{
	opacity:1
}

@keyframes sweep {
  0% { left: -25%; opacity: 0; }
  20% { opacity: 0.6; }
  90% { opacity: 0; }
  100% { left: 125%; opacity: 0; }
}



html {
    --primary-color: #1f8bff;
    --primary-opacity-0: rgba(31, 139, 255, 0);
    --primary-opacity-05: rgba(31, 139, 255, .05);
    --primary-opacity-1: rgba(31, 139, 255, .1);
    --primary-opacity-15: rgba(31, 139, 255, .15);
    --primary-opacity-2: rgba(31, 139, 255, .2);
    --primary-opacity-25: rgba(31, 139, 255, .25);
    --primary-opacity-3: rgba(31, 139, 255, .3);
    --primary-opacity-35: rgba(31, 139, 255, .35);
    --primary-opacity-4: rgba(31, 139, 255, .4);
    --primary-opacity-45: rgba(31, 139, 255, .45);
    --primary-opacity-5: rgba(31, 139, 255, .5);
    --primary-opacity-55: rgba(31, 139, 255, .55);
    --primary-opacity-6: rgba(31, 139, 255, .6);
    --primary-opacity-65: rgba(31, 139, 255, .65);
    --primary-opacity-7: rgba(31, 139, 255, .7);
    --primary-opacity-75: rgba(31, 139, 255, .75);
    --primary-opacity-8: rgba(31, 139, 255, .8);
    --primary-opacity-85: rgba(31, 139, 255, .85);
    --primary-opacity-9: rgba(31, 139, 255, .9);
    --primary-opacity-95: rgba(31, 139, 255, .95);
    --primary-gray: #5578a1;
    --primary-gray-opacity-0: rgba(85, 120, 161, 0);
    --primary-gray-opacity-05: rgba(85, 120, 161, .05);
    --primary-gray-opacity-1: rgba(85, 120, 161, .1);
    --primary-gray-opacity-15: rgba(85, 120, 161, .15);
    --primary-gray-opacity-2: rgba(85, 120, 161, .2);
    --primary-gray-opacity-25: rgba(85, 120, 161, .25);
    --primary-gray-opacity-3: rgba(85, 120, 161, .3);
    --primary-gray-opacity-35: rgba(85, 120, 161, .35);
    --primary-gray-opacity-4: rgba(85, 120, 161, .4);
    --primary-gray-opacity-45: rgba(85, 120, 161, .45);
    --primary-gray-opacity-5: rgba(85, 120, 161, .5);
    --primary-gray-opacity-55: rgba(85, 120, 161, .55);
    --primary-gray-opacity-6: rgba(85, 120, 161, .6);
    --primary-gray-opacity-65: rgba(85, 120, 161, .65);
    --primary-gray-opacity-7: rgba(85, 120, 161, .7);
    --primary-gray-opacity-75: rgba(85, 120, 161, .75);
    --primary-gray-opacity-8: rgba(85, 120, 161, .8);
    --primary-gray-opacity-85: rgba(85, 120, 161, .85);
    --primary-gray-opacity-9: rgba(85, 120, 161, .9);
    --primary-gray-opacity-95: rgba(85, 120, 161, .95);
    --primary-dark: #32465e;
    --analogous-color: #33bbff;
    --analogous-opacity-1: rgba(51, 187, 255, .1);
    --analogous-opacity-2: rgba(51, 187, 255, .2);
    --analogous-opacity-3: rgba(51, 187, 255, .3);
    --analogous-opacity-4: rgba(51, 187, 255, .4);
    --analogous-opacity-5: rgba(51, 187, 255, .5);
    --analogous-opacity-6: rgba(51, 187, 255, .6);
    --analogous-opacity-7: rgba(51, 187, 255, .7);
    --analogous-opacity-8: rgba(51, 187, 255, .8);
    --analogous-opacity-9: rgba(51, 187, 255, .9);
    --white-default: #fff;
    --white-opacity-0: rgba(255, 255, 255, 0);
    --white-opacity-05: rgba(255, 255, 255, .05);
    --white-opacity-1: rgba(255, 255, 255, .1);
    --white-opacity-15: rgba(255, 255, 255, .15);
    --white-opacity-2: rgba(255, 255, 255, .2);
    --white-opacity-25: rgba(255, 255, 255, .25);
    --white-opacity-3: rgba(255, 255, 255, .3);
    --white-opacity-35: rgba(255, 255, 255, .35);
    --white-opacity-4: rgba(255, 255, 255, .4);
    --white-opacity-45: rgba(255, 255, 255, .45);
    --white-opacity-5: rgba(255, 255, 255, .5);
    --white-opacity-55: rgba(255, 255, 255, .55);
    --white-opacity-6: rgba(255, 255, 255, .6);
    --white-opacity-65: rgba(255, 255, 255, .65);
    --white-opacity-7: rgba(255, 255, 255, .7);
    --white-opacity-75: rgba(255, 255, 255, .75);
    --white-opacity-8: rgba(255, 255, 255, .8);
    --white-opacity-85: rgba(255, 255, 255, .85);
    --white-opacity-9: rgba(255, 255, 255, .9);
    --white-opacity-95: rgba(255, 255, 255, .95);
    --success-color: #67c23a;
    --success-opacity-1: rgba(103, 194, 58, .1);
    --success-opacity-2: rgba(103, 194, 58, .2);
    --success-opacity-3: rgba(103, 194, 58, .3);
    --success-opacity-4: rgba(103, 194, 58, .4);
    --success-opacity-5: rgba(103, 194, 58, .5);
    --success-opacity-6: rgba(103, 194, 58, .6);
    --success-opacity-7: rgba(103, 194, 58, .7);
    --success-opacity-8: rgba(103, 194, 58, .8);
    --success-opacity-9: rgba(103, 194, 58, .9);
    --warning-color: #e6a23c;
    --warning-opacity-1: rgba(230, 162, 60, .1);
    --warning-opacity-2: rgba(230, 162, 60, .2);
    --warning-opacity-3: rgba(230, 162, 60, .3);
    --warning-opacity-4: rgba(230, 162, 60, .4);
    --warning-opacity-5: rgba(230, 162, 60, .5);
    --warning-opacity-6: rgba(230, 162, 60, .6);
    --warning-opacity-7: rgba(230, 162, 60, .7);
    --warning-opacity-8: rgba(230, 162, 60, .8);
    --warning-opacity-9: rgba(230, 162, 60, .9);
    --error-color: #f56c6c;
    --error-opacity-1: rgba(245, 108, 108, .1);
    --error-opacity-2: rgba(245, 108, 108, .2);
    --error-opacity-3: rgba(245, 108, 108, .3);
    --error-opacity-4: rgba(245, 108, 108, .4);
    --error-opacity-5: rgba(245, 108, 108, .5);
    --error-opacity-6: rgba(245, 108, 108, .6);
    --error-opacity-7: rgba(245, 108, 108, .7);
    --error-opacity-8: rgba(245, 108, 108, .8);
    --error-opacity-9: rgba(245, 108, 108, .9);
    --gray-0: #001e3c;
    --gray-opacity-0: rgba(0, 30, 60, 0);
    --gray-opacity-05: rgba(0, 30, 60, .05);
    --gray-opacity-1: rgba(0, 30, 60, .1);
    --gray-opacity-15: rgba(0, 30, 60, .15);
    --gray-opacity-2: rgba(0, 30, 60, .2);
    --gray-opacity-25: rgba(0, 30, 60, .25);
    --gray-opacity-3: rgba(0, 30, 60, .3);
    --gray-opacity-35: rgba(0, 30, 60, .35);
    --gray-opacity-4: rgba(0, 30, 60, .4);
    --gray-opacity-45: rgba(0, 30, 60, .45);
    --gray-opacity-5: rgba(0, 30, 60, .5);
    --gray-opacity-55: rgba(0, 30, 60, .55);
    --gray-opacity-6: rgba(0, 30, 60, .6);
    --gray-opacity-65: rgba(0, 30, 60, .65);
    --gray-opacity-7: rgba(0, 30, 60, .7);
    --gray-opacity-75: rgba(0, 30, 60, .75);
    --gray-opacity-8: rgba(0, 30, 60, .8);
    --gray-opacity-85: rgba(0, 30, 60, .85);
    --gray-opacity-9: rgba(0, 30, 60, .9);
    --gray-opacity-95: rgba(0, 30, 60, .95);
    --gray-1: #324057;
    --gray-2: #475669;
    --gray-3: #8492A6;
    --gray-4: #99A9BF;
    --gray-5: #C0CCDA;
    --gray-6: #D3DCE6;
    --gray-7: #E5E9F2;
    --gray-8: #EFF2F7;
    --gray-9: #f2f7fc;
    --text-color: #324057;
    --text-color-2: #475669;
    --text-color-3: #758397;
    --text-color-4: #8492A6;
    --border-color-0: #cad4e0;
    --border-color: #D3DCE6;
    --border-color-2: #E5E9F2;
    --border-color-3: #EFF2F7;
    --bg-color: #e8f0fa;
    --text-shadow: rgba(255, 255, 255, .6);
}




.pandastudio_framework_register__card___back .pf_back{background: url(data:image/svg+xml;base64,PHN2ZyBhcmlhLWhpZGRlbj0idHJ1ZSIgZGF0YS1wcmVmaXg9ImZhcyIgZGF0YS1pY29uPSJzaWduLWluIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiBjbGFzcz0ic3ZnLWlubGluZS0tZmEgZmEtc2lnbi1pbiBmYS13LTE2IGZhLTJ4Ij48cGF0aCBmaWxsPSIjRkZGIiBkPSJNMTM3LjIgMTEwLjNsMjEuOS0yMS45YzkuMy05LjMgMjQuNS05LjQgMzMuOS0uMUwzNDQuOSAyMzljOS41IDkuNCA5LjUgMjQuNyAwIDM0LjFMMTkzIDQyMy43Yy05LjQgOS4zLTI0LjUgOS4zLTMzLjktLjFsLTIxLjktMjEuOWMtOS43LTkuNy05LjMtMjUuNC44LTM0LjdsNzcuNi03MS4xSDI0Yy0xMy4zIDAtMjQtMTAuNy0yNC0yNHYtMzJjMC0xMy4zIDEwLjctMjQgMjQtMjRoMTkxLjVsLTc3LjYtNzEuMWMtMTAtOS4xLTEwLjQtMjQuOS0uNy0zNC41ek01MTIgMzUyVjE2MGMwLTUzLTQzLTk2LTk2LTk2aC04NGMtNi42IDAtMTIgNS40LTEyIDEydjQwYzAgNi42IDUuNCAxMiAxMiAxMmg4NGMxNy43IDAgMzIgMTQuMyAzMiAzMnYxOTJjMCAxNy43LTE0LjMgMzItMzIgMzJoLTg0Yy02LjYgMC0xMiA1LjQtMTIgMTJ2NDBjMCA2LjYgNS40IDEyIDEyIDEyaDg0YzUzIDAgOTYtNDMgOTYtOTZ6Ii8+PC9zdmc+) no-repeat 50%/contain;}







/* 页脚改样式 */
#footer{background:linear-gradient(var(--white-opacity-8),var(--white-opacity-15) 16px,transparent 16px),linear-gradient(var(--primary-gray-opacity-2) 40%,var(--primary-gray-opacity-0)) !important}
















/* 基础卡片样式 - 提高下方高度 */


body.night .postLists.hfg .card{
    border: 1px solid #33415a;
    background: linear-gradient(#2a394c calc(100% - 1.5em),#34425a);
    box-shadow: 0 1em 1em #1f2d3d1a;
    text-shadow: 0 1px #fff0;
}



.postLists.hfg .card a[showas="img"],
.postLists.hfg .card img.cover {
    width: calc(100% - 0.75em);
    margin: 0.375em auto 0;
    object-fit: cover; /* 确保图片填充 */
    border-radius: 0.75em;
}



.postLists.hfg .card {
    position: relative;
    width: 100%;
    aspect-ratio: 3/4; /* 调整为3:4比例，增加高度 */
    border: 1px solid var(--white-default);
    border-radius: 1em;
    background: linear-gradient(hsl(213, 40%, 97%) calc(100% - 2em), hsl(213, 40%, 93%));
    box-shadow: 0 1em 1em #1f2d3d26;
    text-align: center;
    text-shadow: 0 1px var(--white-default);
    transition: all .25s ease;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* 封面图片容器 - 占55%高度 */
.postLists.hfg .card .cover[style*="background-image"] {
    position: relative;
    width: calc(100% - 0.75em);
    margin: 0.375em auto 0;
    
      /* 关键魔法组合 */
    height: 0;
    padding-bottom: min(77.66%, 100%); /* 最大不超过容器66.66% */
    min-height: 100px; /* 安全回退 */
    
      /* 创建包含块 */
    display: flex;
    align-items: center;
    justify-content: center;
    
    
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: .75em;
    box-shadow: 0 6px 6px rgba(29, 140, 224, .1), 0 2px 2px rgb(240 242 247 / 95%), 0 -1px 2px #d8e0ea inset;
    transition: all .25s ease;
    overflow: hidden;
}

/* 封面图片光晕效果 */
.postLists.hfg .card .cover[style*="background-image"]::before {
    content: "";
     width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: inherit;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: .75em;
    opacity: .3;
    filter: blur(1em);
    transition: all .25s ease;
    z-index: 0;
}

/* 隐藏备用图片元素 */
.postLists.hfg .card a[showas="img"],
.postLists.hfg .card img.cover {
    display: none !important;
}

/* 元信息区域 - 占45%高度 */
.postLists.hfg .card .meta {
    padding: 0 0.75em;
    height: 45%; /* 内容区域占45%高度 */
    display: flex;
    flex-direction: column;
    position: relative;
    justify-content:center;
}

/* 日期样式 - 默认隐藏 */
.postLists.hfg .card .meta .date {
    transform: scale(1.06);
    display: flex;
    background: linear-gradient(to top, rgba(0,0,0,0.7), transparent);
    height: 3em;
    justify-content: center;
    align-items: flex-end;
    column-gap: .25em;
    font-size: 14px;
    color: #fff;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .5);
    position: absolute;
    bottom: 100%;
    left: 0.75em;
    right: 0.75em;
    opacity: 0;
    transition: all .25s ease;
    z-index: 2;
    padding-bottom: 0.5em;
    border-radius: 0 0 .75em .75em;
}

/* 悬停时的调整 */
.postLists.hfg .card:hover .summary,
.postLists.hfg .card:hover .tags {
    opacity: 1 !important;
    visibility: visible !important;
}

/* 标题样式 */
.postLists.hfg .card h2 {
    padding: 0 .5em;
    margin: 1em 0 0;
    white-space: nowrap;
    overflow: hidden;
    max-width: 100%;
    text-overflow: ellipsis;
    text-shadow: 0 1px var(--white-default);
    transition: all .25s ease;
}

/* 中间内容区域 - 标签和统计数据共用 */
.postLists.hfg .card .content-area {
    min-height: 3.5em; /* 增加高度容纳两行内容 */
    margin: 0 0 0.5em;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

body.night .postLists.hfg .card .summary {color: #fff;}
/* 统计数据区域 */
.postLists.hfg .card .summary {
    display: flex;
    justify-content: center;
    gap: 1.2em;
    font-size: 14px;
    opacity: 1 !important;
    visibility: visible !important;
    margin-bottom: 0.5em; /* 增加下边距 */
}

/* 标签容器 - 始终显示 */
.postLists.hfg .card .tags {
     margin: calc(0.5vw + 0.25em) 0; /* 基础0.25em + 动态根据视窗宽度缩放 */
position: relative;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 0 1em;
    opacity: 1 !important;
    visibility: visible !important;
    width: 100%;
    max-height: 2.5em;
    overflow: hidden;
    flex-direction: column;
    align-content: center;
    
    
}

/* 单个标签样式调整 */
.postLists.hfg .card .tags a {
    display: inline-block;
    padding: 0.25em 0.8em;
    border-radius: 1em;
    font-size: 13px;
    background: rgba(255,255,255,0.9);
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    text-decoration: none;
    transition: all .2s ease;
    margin: 2px 0;
    line-height: 1.4;
    
    /* 新增防止换行代码 */
    white-space: nowrap;    /* 强制文字不换行 */
    overflow: hidden;       /* 隐藏溢出内容（可选）*/
    text-overflow: ellipsis; /* 超出显示省略号...（可选）*/
    max-width: 140px;       /* 限制最大宽度（按需调整） */
}






/* 描述文字（默认隐藏） */
.postLists.hfg .card .description {
    display: none;
}

/* 悬停效果 */
.postLists.hfg .card:hover {
    transform: translateY(-0.5em);
    box-shadow: 0 0.5em 1.5em #1f2d3d33;
}

.postLists.hfg .card:hover .cover[style*="background-image"] {
    transform: scale(1.02);
}

.postLists.hfg .card:hover .cover[style*="background-image"]::before {
    opacity: 0;
}

/* 悬停时显示日期 */
.postLists.hfg .card:hover .meta .date {
    opacity: 1;
    transform: scale(1.06);
}

/* 悬停时隐藏.summary显示.tags */
.postLists.hfg .card .summary {
    opacity: 1;
    visibility: visible;
}

.postLists.hfg .card .tags {
    opacity: 0;
    visibility: hidden;
}

.postLists.hfg .card:hover .summary {
    opacity: 0;
    visibility: hidden;
}

.postLists.hfg .card:hover .tags {
    opacity: 1;
    visibility: visible;
}

/* 响应式设计 */
@media (max-width: 768px) {
  
    
    .postLists.hfg .card h2 {
        font-size: 14px;

    }
    
    .postLists.hfg .card .summary,
    .postLists.hfg .card .read-more-btn,
    .postLists.hfg .card .tags a {
        font-size: 12px;
    }
}

@media (min-width: 768px) {
    .postLists.hfg .card h2 {
        font-size: 17px;
    }
}

@media (max-width: 365px) {
    .postLists.hfg .card .meta {
        padding: 0 0 0 ;
    }
}










/* 为卡片添加底部间距 */

.postLists.hfg .card:last-child {
  margin-bottom: 30px !important;
}







/* 侧翻转卡片开始 */
.post-iteme .tags {
	padding-left:.625rem;
	padding-right:.625rem;
	margin-top:.375rem;
	font-size:1rem;
	line-height:1.25rem;
	text-align:left
}
.post-iteme .tags span,.post-iteme .tags a {
	color:#8c9cae;
	transition:.35s;
	text-decoration:none
}
.post-iteme .tags span:hover,.post-iteme .tags a:hover {
	color:#007dff
}
.post-iteme.carde { display: flex;
    flex-direction: column; /* 垂直排列子元素 */}
    
.post-iteme.carde .inner {
	-webkit-box-shadow:0 6px 6px rgba(29, 140, 224, .1), 0 10px 10px rgb(0 0 0 / 20%), 0 -1px 2px #d8e0ea inset;
	border-radius:10px;
	padding-bottom:89.45313%
}
body.night .post-iteme.carde .inner .info{
    text-shadow: 0 1px 1px #000000;
}
body.night .inputer input{
    border: 1px solid #434d59f5;
}
.post-iteme.carde .inner .info {
	opacity:0;
	transform:translate(-2rem);
	top:0;
	right:0;
	bottom:0;
	left:0;
	transition-duration:.5s;
	text-shadow:0 1px 1px #fff;
	place-items:end;
	align-content:center;
	display:grid
}
.post-iteme.carde .inner .info .likes,.post-iteme.carde .inner .info .comments,.post-iteme.carde .inner .info .views,.post-iteme.carde .inner .info .detail {
	font-size:.8125rem;
	line-height:1rem;
	margin-right:-1rem
}
.post-iteme.carde .inner .info .likes, .post-iteme.carde .inner .info .comments, .post-iteme.carde .inner .info .views, .post-iteme.carde .inner .info .detail{display: inline-flex;}
    
    
.post-iteme.carde .inner .info .likes i,.post-iteme.carde .inner .info .comments i,.post-iteme.carde .inner .info .views i,.post-iteme.carde .inner .info .detail i {
	height:2rem;
	transform:scale(0);
	font-style:normal;
	transition:.25s;
	width:2rem;
	margin-left:.375rem;
	box-shadow:inset .3536rem .3536rem .625rem #fffc,inset -.1326rem -.1326rem .25rem #ffffff4d,inset -.3536rem -.3536rem .625rem #3664981a,.4419rem .4419rem 1rem #3664984d;
	background-color:#f1f1f147;
	border-radius:9999px;
	justify-content:center;
	-webkit-font-smoothing:antialiased;
	align-items:center;
	display:inline-grid;
	cursor:pointer
}
.post-iteme.carde .inner .info .likes {
	color:#f56c6c
}
.post-iteme.carde .inner .info .comments {
	color:#1f8bff;
	margin-top:.5rem
}
.post-iteme.carde .inner .info .views {
	color:#67c23a;
	margin-top:.5rem
}
.post-iteme.carde .inner .info .detail {
	margin-top:.5rem;
	margin-right:-1.25rem
}
.post-iteme.carde .inner .info .detail i {
	height:2.5rem;
	width:2.5rem;
	font-size:1.125rem;
	margin-left:.375rem;
	color:#007dff
}
.post-iteme.carde .inner .info .detail a {
	text-decoration:none;
	font-size:.9rem;
	font-weight:500
}
.post-iteme.carde .inner .info .detail a:hover i {
	transform:scale(1.2)!important;
	transition:.25s
}
.post-iteme.carde .cover {
	border:.125rem solid #e8f0fa;
	transform-origin:left;
	transform:perspective(59rem) rotateY(0);
	transition:.35s;
	flex-shrink:0;
	flex-grow:0;
	top:0;
	right:0;
	bottom:0;
	left:0;
	border-radius:.9375rem;
	background-repeat:no-repeat;
	background-position:50%;
	background-size:cover;
	display:block;
	position:absolute
}
@media (max-width:700px) {
    .product-card-wrapper{min-width: 50%;}
    .post-card.is-nested{width: 90%;}
}
@media (max-width:991px) {
    .post-iteme.carde .title {	
        -webkit-line-clamp:1;
	-webkit-box-orient:vertical;}
    
    .post-card-col .pf_card1 .title h4 {	
        -webkit-line-clamp:1;
	-webkit-box-orient:vertical;}
}
	
	
	
.post-iteme.carde .title {
	padding:0 .5em;
	margin-top:.625rem;
	text-align:left;
	max-width:100%;
	width:100%;
	text-shadow:0.1053em 0.1053em rgba(255,255,255,.2), 0.1842em 0.1842em 0.2em rgba(0,0,0,.2) !important;
	transition:.25s;
	color:#5a6f87;
	overflow:hidden;
	text-overflow:ellipsis;
	display:-webkit-box;

	font-weight:500
}
@media (max-width:768px) {
	.post-iteme.carde .title {
	font-size:14px;
	/* 单行截断关键属性 */
  white-space: nowrap;      /* 强制不换行 */
  overflow: hidden;         /* 隐藏溢出内容 */
  text-overflow: ellipsis;  /* 超出显示省略号 */
}
}

@media (min-width:768px) {
	
}.post-iteme.carde .tags {
    margin: 0 0 2em;
	width:100%;
	transform-origin:right;
	padding:0 .5em
}
.post-iteme.list {
	grid-template-columns:auto calc(100% - 5.5rem);
	align-items:center;
	gap:1rem;
	display:grid
}
.post-iteme.list .cover {
	width:4.75rem;
	height:4.25rem;
	box-shadow:0 0 0 .125rem #e8f0fa,.442rem .442rem .625rem #36649833,-.442rem -.442rem .625rem #ffffffb3;
	transition-duration:.25s;
	border-radius:.5rem;
	background-repeat:no-repeat;
	background-position:50%;
	background-size:cover
}
.post-iteme.list:hover .cover {
	transform:scale(1.1)
}
.post-iteme.list .title {
	margin:0;
	font-size:1rem;
	line-height:1.5rem;
	font-weight:500;
	text-align:left
}
.post-iteme.list .title a {
	max-width:100%;
	text-shadow:.12rem .12rem .2rem #bec9d5,-1px -1px 1px hsla(0,0%,100%,.8);
	overflow:hidden;
	text-overflow:ellipsis;
	display:-webkit-box;
	-webkit-line-clamp:2;
	-webkit-box-orient:vertical;
	flex-shrink:0;
	flex-grow:0;
	transition-duration:.35s;
	transition:.25s;
	color:#5a6f87;
	text-decoration:none
}
.post-iteme.list .title a:hover {
	color:#007dff;
	text-shadow:.1326rem .1326rem .1875rem rgba(0,125,255,.5),-1px -1px 1px hsla(0,0%,100%,.8)
}
@media (max-width:768px) {
	.post-iteme.list .title {
	font-size:14px
}
}@media (min-width:768px) {
	.post-iteme.list .title {
	font-size:17px
}
}.post-iteme.list .tags {
	margin-top:.375rem;
	color:#8c9cae;
	font-size:.875rem;
	line-height:1.25rem;
	padding-left:0
}





/* 所有分辨率都有打开动画 */
	.post-iteme.carde:hover i {
	transform:scale(1)!important
}
.post-iteme.carde:hover .inner {
	box-shadow:-0.44rem -0.44rem 0.625rem #d8e0ea, 0.44rem 0.44rem 0.625rem #3664981a, inset 0 0 0 transparent, inset 0 0 0 transparent;
	border-radius:.9375rem
}
.post-iteme.carde:hover .inner .info {
	opacity:1;
	transform:translate(0)
}
.post-iteme.carde:hover .cover {
	transform:perspective(89rem) rotateY(-59deg);
	box-shadow:2.5rem 2rem 3rem #3664984d;
	transition:.5s cubic-bezier(.5,1.5,.6,1)
}







.post-info .tags {
	display:flex;
	flex-wrap:wrap;
	grid-gap:.45em;
	margin-top:.8em
}
.post-info .tags a {
	z-index:0;
	text-decoration:none;
	border:1px solid;
	border-radius:.375rem;
	font-size:87.5%;
	color:#73869a;
	border-color:#36649826;
	background-color:#ecf2fb;
	text-shadow:0 1px var(--white-default);
	padding:.25em .9em .25em .6em;
	border-radius:.5em;
	box-shadow:-.1768rem -.1768rem .25rem #ffffff59,.1326rem .1326rem .3rem #36649826,inset 0 0 0 transparent,inset max(1px,.125rem) max(1px,.125rem) max(1px,.25rem) #fff9;
	transition:.25s;
	display:flex;
	align-items:center;
	grid-gap:.35em
}
.post-info .tags a:hover {
	color:#007dff;
	text-shadow:.1326rem .1326rem .1875rem rgba(0,125,255,.5),-1px -1px 1px hsla(0,0%,100%,.8);
	border-color:transparent;
	box-shadow:min(-1px,-.0625rem) min(-1px,-.0625rem) #fff9,max(1px,.0625rem) max(1px,.0625rem) #36649833,inset .1875rem .1875rem .1875rem #36649833,inset -.125rem -.125rem .1875rem #fff9
}
/* 侧翻转卡片结束 */























/* 翻转卡片开始 */

.post-card-col .pf_card1{
    transform-style:preserve-3d;
    transition:transform .65s cubic-bezier(.4,1.5,.6,1);
}
.post-card-col .pf_card1 .post-thumbnail{
    display:block;
    width:100%;
    padding-top:89.5%;
    background-color:#cbd0da;
    background-color:var(--gray_7);
    background-repeat:no-repeat;
    background-position:50%;
    background-size:cover;
    box-shadow:inset 0 0 0 1px rgba(48,52,63,.2),inset 0 0 0 2px hsla(0,0%,100%,.4),0 5px 8px rgba(48,52,63,.2);
    box-shadow:0 0 0 1px var(--gray_opacity_2) inset,0 0 0 2px hsla(0,0%,100%,.4) inset,0 5px 8px var(--gray_opacity_2);
    margin-top:calc(-89.5% + 2px);
    border-radius:12px;
    transition:0s .1s
}
body.night .post-card-col .pf_card1 .metas{    background:rgb(86 91 97 / 44%);}
.post-card-col .pf_card1 .metas{
    -webkit-box-shadow:0 6px 6px #8492a6, 0 10px 10px rgb(0 0 0 / 20%), 0 -1px 2px #d8e0ea inset;
    position:relative;
    width:93%;
    border-radius:12px;
    margin:auto;
    padding-top:91%;
    border:1px solid #cbd0da;
    border:1px solid var(--gray_7);
    box-sizing:border-box;
    background:#f9fafc;
    transform:rotateY(180deg) translateZ(.1px)
}
.post-card-col .pf_card1 .metas .meta-container{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display:flex;
    flex-direction:column
}
.post-card-col .pf_card1 .metas .meta-container .m-title{
    display:flex;
    min-height: 2.4em; /* 保留2行空间 */
    padding:15px;
    align-items:center;
    flex-shrink:0;
    flex-grow:0
}
.post-card-col .pf_card1 .metas .meta-container .m-title .m-thumbnail{
    width:40px;
    height:36px;
    flex-shrink:0;
    flex-grow:0;
    background-size:cover;
    background-position:50%;
    box-shadow:inset 0 0 0 1px rgba(0,0,0,.3),inset 0 0 0 2px hsla(0,0%,100%,.3);
    margin-right:15px;
    transform:translateX(-20px);
    opacity:0;
    border-radius:4px;
    transition:0s .2s
}
@media (min-width:1510px){
    .post-card-col .pf_card1 .metas .meta-container .m-title .m-thumbnail{
        width:64px;
        height:57px
    }
}


body.night .post-card-col .pf_card1 .metas .meta-container .m-title .m-text{color: #f9fafc}
.post-card-col .pf_card1 .metas .meta-container .m-title .m-text{
    font-size: 14px;
    line-height: 1.2;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    transform: translateX(20px);
    opacity: 0;
    transition: 0s .2s;
    width: 100%; /* 确保宽度不溢出 */
}
@media (min-width:1510px){
    .post-card-col .pf_card1 .metas .meta-container .m-title .m-text{
        font-size:15px
    }
}
.post-card-col .pf_card1 .metas .meta-container .m-infos{
    background:#000;
    flex-grow:1;
    margin-left:-1px;
    margin-right:-1px;
    margin-bottom:-1px;
    box-shadow:inset 0 0 0 1px rgba(0,0,0,.4),inset 0 0 0 2px hsla(0,0%,100%,.1);
    display:flex;
    flex-direction:column;
    justify-content:space-evenly;
    opacity:0;
    transition:.2s;
    padding:10px 0 15px;
    border-radius:0 0 12px 12px
}
.post-card-col .pf_card1 .metas .meta-container .m-infos .infos{
    color:rgba(225,240,255,.75);
    text-shadow:0 -1px rgba(0,0,0,.3);
    text-align:center;
    margin-bottom:5px
}
.post-card-col .pf_card1 .metas .meta-container .m-infos .infos i{
    margin-right:4px
}
.post-card-col .pf_card1 .metas .meta-container .m-infos .infos>span+span{
    margin-left:8px
}
.post-card-col .pf_card1 .metas .meta-container .m-read-more{
    display:flex;
    justify-content:center
}
.post-card-col .pf_card1 .metas .meta-container .m-read-more a{
    padding:0 15px;
    height:36px;
    display:flex;
    align-items:center;
    border-radius:99px;
    background:linear-gradient(hsla(0,0%,100%,.1),hsla(0,0%,100%,0));
    text-shadow:0 -1px rgba(0,0,0,.2);
    border:1px solid hsla(0,0%,100%,.25);
    box-shadow:0 3px hsla(0,0%,100%,.25),0 4px rgba(0,0,0,.2),0 7px 7px rgba(0,0,0,.2),inset 0 0 0 1px rgba(0,0,0,.1);
    color:hsla(0,0%,100%,.8);
    font-size:14px;
    transition:.25s
}
.post-card-col .pf_card1 .metas .meta-container .m-read-more a:active{
    box-shadow:0 -3px hsla(0,0%,100%,.25),0 0 rgba(0,0,0,.2),0 0 0 transparent,inset 0 0 0 1px rgba(0,0,0,.1);
    transform:translateY(3px);
    transition:.1s
}
.post-card-col .pf_card1 .metas .meta-container .m-read-more a:hover{
    padding-left:23px;
    padding-right:23px
}
.post-card-col .pf_card1 .metas .meta-container .m-read-more a .icon{
    margin-left:5px
}
.post-card-col .pf_card1 .title{
    transform-style:preserve-3d;
    text-align:center;
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden
}

body.night .post-card-col .pf_card1 .title h4{color:#f0f2f7;}
.post-card-col .pf_card1 .title h4{
    font-size:14px;
    font-weight:400;
    margin:3px 10px 13px;
    display:inline-block;
    border-radius:8px;
    color:#34425a;
    text-shadow:0 1px #fff;
    text-shadow:0 1px var(--white_default);
    padding:7px 0 0;
    line-height:1.3em;
    
    
    /* 2行截断关键属性 */
    display: -webkit-box;          /* 弹性盒子布局（WebKit内核支持） */
   
    overflow: hidden;              /* 隐藏超出部分 */
    text-overflow: ellipsis;       /* 超出时显示省略号 */
    /* 兼容旧版浏览器（可选） */
    max-height: calc(1.6em * 2);   /* line-height × 2 */
    white-space: normal;           /* 允许多行文本 */
    
    
}


/* 所有分辨率都有打开动画 */
    .post-card-col.show-back .pf_card1,.post-card-col:hover .pf_card1{
        transform:rotateY(180deg) translateY(3px)
    }
    .post-card-col.show-back .pf_card1 .post-thumbnail,.post-card-col:hover .pf_card1 .post-thumbnail{
        transform:scaleX(.91) translateY(-3px)
    }
    .post-card-col.show-back .pf_card1 .metas .meta-container .m-title .m-thumbnail,.post-card-col:hover .pf_card1 .metas .meta-container .m-title .m-thumbnail{
        transform:translateX(0);
        opacity:1;
        transition:.5s .25s
    }
    .post-card-col.show-back .pf_card1 .metas .meta-container .m-title .m-text,.post-card-col:hover .pf_card1 .metas .meta-container .m-title .m-text{
        transform:translateX(0);
        opacity:1;
        transition:.5s .4s
    }
    .post-card-col.show-back .pf_card1 .metas .meta-container .m-infos,.post-card-col:hover .pf_card1 .metas .meta-container .m-infos{
        opacity:1;
        transition:.5s
    }


/* 翻转卡片结束 */






/* 1200px 以上强制 5 列 */
@media (min-width: 1200px) {
  /* 覆盖 Bootstrap 的 col-md-3 */
  .col-md-3 {
    flex: 0 0 20% !important; /* 100% / 5 = 20% */
    max-width: 20% !important;
  }
  

}




.nav-category-row{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  width:100%;
}

.categoryNav-wrapper {
  flex: 1 1 auto;
  width: auto !important;
  height: 57px;
  overflow-x: auto;
  white-space: nowrap;
}

/* 子元素保持内联（如导航项） */
.categoryNav-wrapper > * {
  display: inline-block;      /* 或 flex/inline-flex 取决于您的布局 */
  white-space: nowrap;        /* 防止内容换行 */
}



.display-switcher-wrapper {
  flex: 0 0 233px;
  width: 233px !important;
  height: 57px;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: rgba(202, 207, 213, 0.5) transparent;
}

/* 子元素保持内联（如导航项） */
.display-switcher-wrapper > * {
  display: inline-block;      /* 或 flex/inline-flex 取决于您的布局 */
  white-space: nowrap;        /* 防止内容换行 */
}

@media (max-width: 991px) {
  .display-switcher-wrapper {
    flex-basis: 120px;
    width: 120px !important;
  }
}

@media (max-width: 480px) {
  .display-switcher-wrapper {
    flex-basis: 110px;
    width: 110px !important;
  }
}

.categoryNav-wrapper::-webkit-scrollbar,
.display-switcher-wrapper::-webkit-scrollbar {
  height: 2px;
  background: transparent;
}

.categoryNav-wrapper::-webkit-scrollbar-thumb,
.display-switcher-wrapper::-webkit-scrollbar-thumb {
  background: rgba(202, 207, 213, 0);
  border-radius: 2px;
}

body.night .categoryNav-wrapper::-webkit-scrollbar-thumb,
body.night .display-switcher-wrapper::-webkit-scrollbar-thumb {
  background: rgba(216, 224, 234, 0);
}

.categoryNav-wrapper:hover::-webkit-scrollbar-thumb,
.categoryNav-wrapper.scrolling::-webkit-scrollbar-thumb,
.display-switcher-wrapper:hover::-webkit-scrollbar-thumb,
.display-switcher-wrapper.scrolling::-webkit-scrollbar-thumb {
  background: rgba(202, 207, 213, 0.6);
}

body.night .categoryNav-wrapper:hover::-webkit-scrollbar-thumb,
body.night .categoryNav-wrapper.scrolling::-webkit-scrollbar-thumb,
body.night .display-switcher-wrapper:hover::-webkit-scrollbar-thumb,
body.night .display-switcher-wrapper.scrolling::-webkit-scrollbar-thumb {
  background: rgba(216, 224, 234, 0.35);
}

.postLists .nirvana-variant {
  display: none;
}

.postLists.flip .nirvana-type-flip,
.postLists.hfg .nirvana-type-hfg,
.postLists.dgg .nirvana-type-dgg,
.postLists.fzkp .nirvana-type-fzkp,
.postLists.cards .nirvana-type-cards,
.postLists.lists .nirvana-type-lists {
  display: block;
}
.postLists.hfg .post-iteme.carde .title{
	line-height:1.4;
	min-height:calc(1.4em*2);
	max-height:calc(1.4em*2);
	overflow:hidden;
	display:-webkit-box;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:2
}
.postLists.hfg .post-iteme.carde .tags{
	line-height:1.4;
	min-height:calc(1.4em*2);
	max-height:calc(1.4em*2);
	overflow:hidden;
	display:-webkit-box;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:2
}
.postLists.hfg .post-iteme.carde .detail a{
	background:none!important;
	background-image:none!important;
	-webkit-box-shadow:none!important;
	box-shadow:none!important
}
.postLists.hfg .post-iteme.carde .inner .info .detail{
	margin-right:-1rem
}
.postLists.hfg .post-iteme.carde .inner .info>div{
	margin-right:-1rem!important
}
.postLists.hfg .post-iteme.carde .inner .info .detail a{
	display:inline-flex;
	align-items:center;
	line-height:1rem
}
.postLists.hfg .post-iteme.carde .inner .info .detail i{
	width:2rem;
	height:2rem;
	font-size:1rem
}
.postLists.fzkp .post-card-col .pf_card1 .title h4{
	line-height:1.3em;
	padding-top:0!important;
	padding-bottom:0!important;
	min-height:calc(1.3em*2);
	max-height:calc(1.3em*2);
	overflow:hidden;
	display:-webkit-box;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:2
}
.postLists.fzkp .post-card-col .pf_card1 .metas .meta-container .m-read-more a.pd-ripple,
.postLists.fzkp .post-card-col .pf_card1 .metas .meta-container .m-read-more a.pd-ripple-trigger{
	padding:0 15px!important;
	height:36px!important;
	display:flex!important;
	align-items:center!important;
	border-radius:99px!important;
	background:linear-gradient(hsla(0,0%,100%,.1),hsla(0,0%,100%,0))!important;
	text-shadow:0 -1px rgba(0,0,0,.2)!important;
	border:1px solid hsla(0,0%,100%,.25)!important;
	box-shadow:0 3px hsla(0,0%,100%,.25),0 4px rgba(0,0,0,.2),0 7px 7px rgba(0,0,0,.2),inset 0 0 0 1px rgba(0,0,0,.1)!important;
	color:hsla(0,0%,100%,.8)!important;
	transition:.25s!important
}
.postLists.fzkp .post-card-col .pf_card1 .metas .meta-container .m-read-more a.pd-ripple:hover,
.postLists.fzkp .post-card-col .pf_card1 .metas .meta-container .m-read-more a.pd-ripple-trigger:hover{
	padding-left:23px!important;
	padding-right:23px!important
}
.postLists.fzkp .post-card-col .pf_card1 .metas .meta-container .m-read-more a.pd-ripple:active,
.postLists.fzkp .post-card-col .pf_card1 .metas .meta-container .m-read-more a.pd-ripple-trigger:active{
	box-shadow:0 -3px hsla(0,0%,100%,.25),0 0 rgba(0,0,0,.2),0 0 0 transparent,inset 0 0 0 1px rgba(0,0,0,.1)!important;
	transform:translateY(3px)!important;
	transition:.1s!important
}
.postLists.dgg .post-card2 .main-title{
	line-height:1.4;
	min-height:calc(1.4em*2);
	max-height:calc(1.4em*2);
	overflow:hidden;
	display:-webkit-box;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:2
}
.postLists.dgg .post-card2+.metas .tags{
	line-height:1.4;
	min-height:calc(1.4em*2);
	max-height:calc(1.4em*2);
	overflow:hidden;
	display:-webkit-box;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:2
}
.postLists.dgg .post-card2 .post-card-wrapper2 .card{
	position:relative;
	overflow:hidden
}
.postLists.dgg .post-card2 .post-card-wrapper2 .card:before{
	content:"";
	position:absolute;
	inset:-45%;
	background:linear-gradient(120deg,transparent 35%,rgba(255,255,255,.38),transparent 65%);
	transform:translateX(-65%) rotate(12deg);
	opacity:0;
	transition:opacity .25s,transform .7s;
	pointer-events:none
}
.postLists.dgg .post-card2:hover .post-card-wrapper2 .card:before{
	opacity:1;
	transform:translateX(65%) rotate(12deg)
}

@media (min-width: 992px) {
  body[data-sidebar-pos="left"] .nirvana-main-col {
    float: right;
  }

  body[data-sidebar-pos="left"] .nirvana-sidebar-col {
    float: left;
  }
}

.nirvana-sidebar-col .sidebar {
  border-left: 0 !important;
  border-right: 0 !important;
}

.nirvana-sidebar-col .sidebarMenu {
  display: block;
}

body[data-sidebar-pos="right"] .nirvana-sidebar-col .sidebarMenu {
  text-align: right;
}

body[data-sidebar-pos="left"] .nirvana-sidebar-col .sidebarMenu {
  text-align: left;
}

.nirvana-sidebar-col .sidebarMenu>ul.menu {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
}

body[data-sidebar-pos="right"] .nirvana-sidebar-col .sidebarMenu>ul.menu {
  text-align: right;
}

body[data-sidebar-pos="left"] .nirvana-sidebar-col .sidebarMenu>ul.menu {
  text-align: left;
}





















/* rev滚动条 */

/* 滚动条默认隐藏，触摸时显示 */
#out,
.nirvana-book-out {
  scrollbar-width: none; /* Firefox */
  overflow-x: auto;
  overflow-y: hidden;
    -webkit-overflow-scrolling: touch; /* iOS 顺滑滚动 */
  --nir-book-card-w: clamp(168px, 18vw, 210px);
  --nir-book-overlap: clamp(-92px, -6.2vw, -62px);
  --nir-book-expand: clamp(104px, 10.2vw, 132px);
}

#inside,
.nirvana-book-inside {
  display: flex;
  flex-wrap: nowrap;
  width: max-content;
  height: clamp(238px, 26vw, 300px);
  overflow: hidden;
}

#inside .post-card-nested-col,
.nirvana-book-inside .post-card-nested-col {
  flex: 0 0 auto;
}

/* Chrome/Safari 滚动条样式 */
#out::-webkit-scrollbar,
.nirvana-book-out::-webkit-scrollbar {
  height: 4px; /* 滚动条高度 */
  background: transparent; /* 默认透明 */
}

/* 滚动条滑块样式 */
#out::-webkit-scrollbar-thumb,
.nirvana-book-out::-webkit-scrollbar-thumb {
  background: rgba(202,207,213,0); /* 默认透明 */
  border-radius: 2px;
}

/* 触摸/滚动时显示滚动条 */
#out.touching::-webkit-scrollbar,
#out.scrolling::-webkit-scrollbar,
.nirvana-book-out.touching::-webkit-scrollbar,
.nirvana-book-out.scrolling::-webkit-scrollbar {
  background: rgba(202,207,213,0.2); /* 轨道背景 */
}

#out.touching::-webkit-scrollbar-thumb,
#out.scrolling::-webkit-scrollbar-thumb,
.nirvana-book-out.touching::-webkit-scrollbar-thumb,
.nirvana-book-out.scrolling::-webkit-scrollbar-thumb {
  background: rgba(202,207,213,0.6); /* 滑块颜色 */
}


/* 手动拖动时才显示滚动条 */
#out.dragging::-webkit-scrollbar-thumb,
.nirvana-book-out.dragging::-webkit-scrollbar-thumb {
  background: rgba(150, 150, 150, 0.6);
}
#out.dragging::-webkit-scrollbar,
.nirvana-book-out.dragging::-webkit-scrollbar {
  background: rgba(150, 150, 150, 0.1);
}


/* 移动端优化 */
@media (max-width: 767px) {
  #out,
  .nirvana-book-out {
    width: 100%;
    margin-left: 0;
    padding-bottom: 8px; /* 给滚动条留空间 */
  }
  
  #inside,
  .nirvana-book-inside {
    width: max-content !important;
    padding: 0 10px;
  }
}



































/* nvpress卡片开始 */

.post-card2 { 
    position: relative;
    margin-bottom: 20px;
      transition: transform 0.3s ease, box-shadow 0.3s ease
}
.post-card-wrapper2 {
  
    border-radius: 8px;
}



.card-container {
    position: relative;
      transform-style: preserve-3d; /* 新增 */
}

.post-card2:hover .block.img {
  transform: scale(1.05); /* 图片放大 */
}

.block.img {
    display: block;
    padding-top: 100%;
    aspect-ratio:3/3;
    background-size: cover;
    background-position: center;
      transition: transform 0.4s ease;
}

.main-title.type-1 {

    font-weight: bold;

    transition: color 0.3s ease;
}

.post-card2:hover .highlight {
  opacity: 1; /* 悬停显示 */
}


.highlight {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    opacity: 0;
    background: rgba(255,255,255,0.1);
    transition: opacity 0.3s;
    transform: translateZ(10px); /* 轻微抬升增强立体感 */
  pointer-events: none;
}



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

.text-xs { font-size: 12px; }
.text-center { text-align: center; }
.text-primary-gray { color: #666; }
.text-embossed { text-shadow: 0 1px 1px rgba(0,0,0,0.2); }


.absolute { position: absolute; }
.inset-0 { top: 0; right: 0; bottom: 0; left: 0; }
.flex { display: flex; }
.justify-center { justify-content: center; }


.text-error { color: #ff4d4f; }
.text-bulge-error:hover { transform: scale(1.1); }
.text-success { color: #52c41a; }


.fa-bookmark:before { content: "\f02e"; }




/* 元信息动画（点赞/评论/浏览数） */
.text-bulge-error,
.text-bulge-primary,
.text-bulge-success {
  transition: transform 0.2s ease;
}


.post-card2:hover .text-bulge-error {
  transform: scale(1.1); /* 点赞图标轻微放大 */
}





/* 卡片启用 3D 变换 */
.post-card2[data-tilt] {
position: relative;
  transform-style: preserve-3d;
  perspective: 2000px; /* 修正单位 */
  transition: transform 0.1s linear;
  z-index: 1; /* 维持原有层级 */
}



/* 高亮层需要跟随 3D 变形 */
.highlight {
  transform: translateZ(0); /* 强制启用 GPU 加速 */
}









.post-card2 {
	z-index:1
}
.post-card2 .tags {
	transition:.25s
}
.post-card2 .infos {
	opacity:0;
	transform:translateY(0) scale(.8);
	pointer-events:none;
	transition:.25s
}
.post-card2:hover {
    transform: translateY(-5px); /* 悬停上浮 */
 
	z-index:2
}
.post-card2 .post-card-wrapper2:hover+.metas .tags {
	opacity:0;
	transform:translateY(1em) scale(1.25)
}
.post-card2 .post-card-wrapper2:hover+.metas .infos {
	opacity:1;
	transform:translateY(1em) scale(1)
}
.post-card-wrapper2 {
	--card-padding:6px;
	--card-radius:12px;
	cursor:pointer;
	padding:var(--card-padding);
	background:linear-gradient(#fff,transparent 20%,transparent 95%,rgba(255,255,255,.3));
	border-radius:var(--card-radius);
	box-shadow:0 6px 6px rgba(31, 45, 61, .15), 0 10px 10px rgba(31,45,61,.1), 0 -1px 2px #d8e0ea inset;
	will-change:transform,box-shadow
}
.post-card-wrapper2:hover {
	z-index:1;
	box-shadow:0 0 0 1px #fffc inset,0 1px #fff inset,0 1.5em 2em var(--gray-opacity-25)
}
.post-card-wrapper2 .card {
	position:relative;
	overflow:hidden;
	background:var(--bg) radial-gradient(at 10% 0%,rgba(255,255,255,.4),rgba(255,255,255,0) 60%);
	border-radius:calc(var(--card-radius) - var(--card-padding) / 2 - 1px);
	padding-top:40%;
	box-shadow:0 0 0 1px #fffc,0 0 0 1px #00000012 inset
}
.post-card-wrapper2 .img {
	background-size:cover;
	background-repeat:no-repeat;
	-webkit-mask:radial-gradient(circle farthest-side at bottom,#000 33%,transparent),linear-gradient(transparent,#000);
	mask:radial-gradient(circle farthest-side at bottom,#000 33%,transparent),linear-gradient(transparent,#000)
}
.post-card-wrapper2 .highlight {
	position:absolute;
	display:block;
	background:radial-gradient(farthest-side at 100% 0%,rgba(255,255,255,.3),transparent) no-repeat 100% 100% / 35% 100%;
	right:0;
	top:0;
	bottom:0;
	width:200%;
	pointer-events:none;
	clip-path:polygon(0 0,100% 0,75% 100%,0 100%);
	transition:transform 1s,opacity .5s
}
body.night .post-iteme.carde .title{color: #f0f2f7 !important;}
body.night p{color: #f9fafc !important;}
body.night .glass-light .gnb-navigation{border-color: rgb(255 255 255 / 15%);}
body.night .post-iteme.carde .cover{border: .125rem solid #58606ba8;}
body.night .glass-light .gnb-footer{border-color: rgb(255 255 255 / 15%);}
body.night .gnb-footer{color: #b0b1b6;}
body.night .gnb-toc-title{color: #929fb3;}
body.night .glass-light .gnb-toc-item a{background: rgb(255 251 251 / 6%);color: #dfdfdf87;}
body.night .gnb-content-title{color: #dfdfdf87;}
body.night .glass-light .gnb-nav-button{color: #a0adc0;}
body.night .gnb-page-indicator{color: #8692a7;}
body.night .gnb-cover-title{color: #e1dddd !important}
body.night .music__info .music__info--singer, .music__info .music__info--title{color: #b6c2d5;}
body.night .black-color{color: #bac3d0;}
body.night .post-card-wrapper2 .main-title {color:#f0f2f7;}
.post-card-wrapper2 .main-title {
	position:absolute;
	z-index:1;
	left:20px;
	top:38px;
	right:16px;
	margin:0;
	width:unset;
	color:rgb(0 0 0 / 55%);
	font-size:1.75em;

		-webkit-line-clamp: 2;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-box-orient: vertical;
}
.post-card-wrapper2 .main-title>div {
	margin-right:.3em
}
.post-card-wrapper2 .main-title>div:nth-child(2) {
	font-size:15px;
	font-family:Play,微软雅黑,Microsoft YaHei UI,Microsoft YaHei,PingFang SC,Helvetica Neue,Helvetica,Arial,"sans-serif"!important
}
.post-card-wrapper2 .metas,.post-card-wrapper2 .date {
	margin-top:.5em;
	opacity:.5
}
.post-card-wrapper2.is-dark .main-title {
	color:#fff
}
@media (min-width:1200px) and (max-width:1450px),(min-width:991px) and (max-width:1160px),(min-width:768px) and (max-width:820px) {
	.post-card-wrapper2 .main-title {
	font-size:1.3em;
	left:16px;
	top:28px;
	right:12px
}
.post-card-wrapper2 .main-title>div:nth-child(2) {
	font-size:14px
}
}@media (max-width:555px) {
	.post-card-wrapper2 {
	--card-padding:5px
}
.post-card-wrapper2 .main-title {
	font-size:1.1em;
	left:14px;
	top:25px;
	right:10px
}
.post-card-wrapper2 .main-title>div:nth-child(2) {
	font-size:13px
}
}


/* nvpress卡片结束 */


























/*卡片767翻转启动*/
@media (max-width:767px) {
    .topNav[pandaTab]>.menu>li>a{
        -webkit-mask:0
    }
    .post-card-col.show-back .pf_card,.post-card-col:hover .pf_card {
	transform:rotateY(180deg) translateY(3px) !important
}
    
    .post-card-col.show-back .pf_card .post-thumbnail,.post-card-col:hover .pf_card .post-thumbnail {
	transform:scaleX(.91) translateY(-3px)
}
.post-card-col.show-back .pf_card .metas .meta-container .m-title .m-thumbnail,.post-card-col:hover .pf_card .metas .meta-container .m-title .m-thumbnail {
	transform:translateX(0);
	opacity:1;
	transition:.5s .25s
}
.post-card-col.show-back .pf_card .metas .meta-container .m-title .m-text,.post-card-col:hover .pf_card .metas .meta-container .m-title .m-text {
	transform:translateX(0);
	opacity:1;
	transition:.5s .4s
}
.post-card-col.show-back .pf_card .metas .meta-container .m-infos,.post-card-col:hover .pf_card .metas .meta-container .m-infos {
	opacity:1;
	transition:.5s
}
    
}







/*768手机最新文章分辨率*/
@media screen and (max-width:767px) {
.post-mixed-col:first-child .pf_mixed{
	padding-top: calc(64% + 1px) !important;
}
}


/*wordpress美化模块hover特效*/
.product-card-wrapper1:hover{
    -webkit-transform:translateY(-10px);-ms-transform:translateY(-10px);transform:translateY(-10px);-webkit-transition:all .25s linear;-o-transition:all .25s linear;transition:all .25s linear
}

.product-card-wrapper1 {
    transition: .25s;
}




/*日志hover特效*/
.post-blog-col .blog-thumbnail{
    transition: .25s;
}

.post-blog-col .blog-thumbnail:hover{
    -webkit-transform:translateY(13px);
    transform:translateY(13px);

}

.post-blog-col .blog-info .calendar .calendar-wrapper{
    transition: .25s;
}

.post-blog-col .blog-info .calendar .calendar-wrapper:hover{
    -webkit-transform:translateY(13px);
    transform:translateY(13px);
    -webkit-box-shadow:0 3px 5px rgba(31,45,61,.2);
    box-shadow:0 3px 5px rgba(31,45,61,.2) 
}

/*随便看看hover特效*/
.main-container.random .pf_random .post-thumbnail:hover{
    -webkit-transform:translateY(13px);
    transform:translateY(13px);
    -webkit-box-shadow:0 3px 5px rgba(31,45,61,.2);
    box-shadow:0 3px 5px rgba(31,45,61,.2)
}









/*文章页文章推荐手机端尺寸优化/分隔缝*/
@media (min-width:300px) and (max-width:450px) {

    .single-post.relate .thumb_img{
            width: 108% !important;
    margin-left: -7px;
    }

}

.title1234:after{
        height: 1px;
    width: 200%;
    background: rgb(202 207 213 / 44%);
    bottom: 0;
    left: -115px;
}

/*文章页文章推荐只显示3个*/
@media (min-width:768px) and (max-width:1199px) {
    .col-sm-4:nth-child(n+5){
        display: none !important;
    }

}








/*nir文章推荐模块*/
.relate-posts {
	color:#657487;
	padding:15px 60px 40px;
	background:#fff;
	border-radius:13px;
	box-shadow:0 13px 15px rgba(31,45,61,.1);
	margin-bottom:30px;
	overflow:hidden
}
.relate-posts .posts {
	margin-left:-15px;
	margin-right:-15px
}
.single-post.relate .thumb_img {
	width:100%;
	opacity: .8;
	padding-top:89.453125%;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	border-radius:10px;
	overflow:hidden;
	position:relative;
	-webkit-box-shadow:0 10px 13px rgba(31,45,61,.15);
	box-shadow:0 10px 13px rgba(31,45,61,.15);
	-webkit-transition:.3s;
	transition:.3s;
}
.single-post.relate .thumb_img:after {
	background:-webkit-gradient(linear,left top,left bottom,from(rgba(31,45,62,.6)),to(rgba(31,45,62,.2)));
	background:-webkit-linear-gradient(rgba(31,45,62,.6),rgba(31,45,62,.2));
	background:linear-gradient(rgba(31,45,62,.6),rgba(31,45,62,.2));
	border-radius:4px;
	display:block;
	height:200%;
	left:0;
	position:absolute;
	top:0;
	width:100%;
	opacity:1;
	-webkit-transition:.5s;
	transition:.5s
}
.single-post.relate .thumb_img:hover:after {
	height:0%;
	opacity:0
}
.single-post.relate .thumb_img:hover {
	-webkit-transform:translateY(15px);
	transform:translateY(15px);
	-webkit-box-shadow:0 3px 3px rgba(31,45,61,.3);
	box-shadow:0 3px 3px rgba(31,45,61,.3);
	opacity: 1;
}
.single-post.relate {
	max-width:100%;
	    margin-top: 20px;
	-webkit-transition:.25s;
	transition:.25s
}
.single-post.relate .thumb_img .meta {
	position:absolute;
	left:10px;
	right:10px;
	top:0;
	bottom:0;
	z-index:1;
	-webkit-box-orient:vertical;
	-webkit-box-direction:normal;
	-ms-flex-direction:column;
	flex-direction:column
}
.single-post.relate .thumb_img .meta h3 {
	font-size:16px;
	color:#fff;
	margin-top:35%;
	text-align:center;
	text-shadow:0 2px 4px rgba(0,0,0,.5);
	opacity:1;
	-webkit-transform:translateY(0);
	transform:translateY(0);
	-webkit-transition:.25s ease .1s;
	transition:.25s ease .1s;
	text-overflow: -o-ellipsis-lastline;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.single-post.relate .thumb_img .meta .date {
	color:#fff;
	text-shadow:0 1px 2px rgba(0,0,0,.5);
	font-size:12px;
	opacity:.5;
	-webkit-transform:translateY(0);
	transform:translateY(0);
	-webkit-transition:.25s;
	transition:.25s
}
.single-post.relate .thumb_img:hover .meta h3 {
	opacity:0;
	-webkit-transform:translateY(15px);
	transform:translateY(15px);
	-webkit-transition:.25s ease;
	transition:.25s ease
}
.single-post.relate .thumb_img:hover .meta .date {
	opacity:0;
	-webkit-transform:translateY(30px);
	transform:translateY(30px);
	-webkit-transition:.25s ease;
	transition:.25s ease
}
.pageLoader {
	position:fixed;
	top:0;
	right:0;
	bottom:0;
	left:0;
	background:#e1e5eb;
	background:-webkit-radial-gradient(50% 50%,ellipse 70% 70%,#f0f2f7,#8492A6);
	background:radial-gradient(ellipse 70% 70% at 50% 50%,#f0f2f7,#8492A6);
	opacity:0;
	visibility:hidden;
	z-index:2000;
	-webkit-transition:1s;
	transition:1s
}
.pageLoader.loading {
	opacity:.85;
	visibility:visible
}
.pageLoader div {
	height:30px;
	width:4px;
	background:#8492A6;
	border-radius:3px;
	display:inline-block;
	margin:0 2px;
	-webkit-box-shadow:0 1px #fff;
	box-shadow:0 1px #fff;
	-webkit-animation:.4s loadingShorting ease-in infinite alternate;
	animation:.4s loadingShorting ease-in infinite alternate
}
.pageLoader div:nth-child(1) {
	-webkit-animation-delay:-.3s;
	animation-delay:-.3s
}
.pageLoader div:nth-child(2) {
	-webkit-animation-delay:-.2s;
	animation-delay:-.2s
}
.pageLoader div:nth-child(3) {
	-webkit-animation-delay:-.1s;
	animation-delay:-.1s
}
@-webkit-keyframes loadingShorting {
	0% {
	height:30px
}
100% {
	height:4px;
	opacity:.1
}
}@keyframes loadingShorting {
	0% {
	height:30px
}
100% {
	height:4px;
	opacity:.1
}
}.floatTools {
	position:fixed;
	bottom:90px;
	right:10px;
	z-index:3
}
.floatTools .tool-button {
	width:34px;
	height:34px;
	line-height:34px;
	text-align:center;
	border-radius:6px;
	color:#8b9bb0;
	text-shadow:0 1px rgba(255,255,255,1);
	cursor:pointer;
	background:rgba(255,255,255,1);
	background:-webkit-gradient(linear,left top,left bottom,from(#fff),to(#f0f2f4));
	background:-webkit-linear-gradient(#fff,#f0f2f4);
	background:linear-gradient(#fff,#f0f2f4);
	border:1px solid rgba(0,40,83,.2);
	-webkit-box-shadow:0 2px 2px rgba(31,45,62,.1),0 0 0 1px #fff inset;
	box-shadow:0 2px 2px rgba(31,45,62,.1),0 0 0 1px #fff inset;
	-webkit-transition:.25s;
	transition:.25s;
	margin:5px auto 3px
}
.floatTools .tool-button.backToTop i {
	-webkit-transform:rotate(-45deg);
	transform:rotate(-45deg)
}
.floatTools .tool-button.unavailable {
	height:0;
	width:0;
	opacity:0;
	visibility:hidden;
	font-size:0;
	margin-top:0;
	margin-bottom:0
}
.floatTools .tool-button:hover {
	border-color:#20a0ff;
	color:#fff;
	text-shadow:0 -1px #0087ec;
	-webkit-box-shadow:0 3px 3px rgba(32,160,255,.35),0 0 3px 16px rgba(32,160,255,1) inset;
	box-shadow:0 3px 3px rgba(32,160,255,.35),0 0 3px 16px rgba(32,160,255,1) inset
}
#assistance {
	background:#f0f2f7;
	background:-webkit-gradient(linear,left top,left bottom,from(#f0f2f7),to(#fff));
	background:-webkit-linear-gradient(#f0f2f7,#fff);
	background:linear-gradient(#f0f2f7,#fff);
	width:400px;
	position:fixed;
	z-index:10;
	border-radius:8px;
	-webkit-box-shadow:0 15px 20px rgba(31,45,61,.2),0 0 0 2px rgba(166,172,182,.5),0 0 0 1px #fff inset;
	box-shadow:0 15px 20px rgba(31,45,61,.2),0 0 0 2px rgba(166,172,182,.5),0 0 0 1px #fff inset;
	-webkit-transform-origin:calc(100% + 10px) calc(100% - 18px);
	transform-origin:calc(100% + 10px) calc(100% - 18px);
	-webkit-transition:.5s cubic-bezier(.5,1.65,.5,1);
	transition:.5s cubic-bezier(.5,1.65,.5,1)
}
#assistance.unavailable {
	visibility:hidden;
	-webkit-transform:scale(0);
	transform:scale(0);
	opacity:0
}
#assistance:before {
	position:absolute;
	right:-5px;
	bottom:15px;
	border-top:5px solid transparent;
	border-bottom:5px solid transparent;
	border-left:5px solid #eef1f6;
	z-index:1
}
#assistance:after {
	position:absolute;
	right:-7px;
	bottom:14px;
	border-top:6px solid transparent;
	border-bottom:6px solid transparent;
	border-left:6px solid rgba(31,45,61,.15)
}
#chatTemplate {
	max-height:400px;
	overflow:auto;
	-webkit-overflow-scrolling:touch;
	padding:15px 15px 0
}
.chatList .headimg {
	width:32px;
	height:32px;
	background-color:#fff;
	border-radius:50%;
	-webkit-box-shadow:0 10px 15px rgba(31,45,61,.15);
	box-shadow:0 10px 15px rgba(31,45,61,.15);
	background-position:center center;
	background-size:cover;
	background-repeat:no-repeat
}
.chatList.server .headimg {
	float:left;
	background-image:url(../imgs/chat_server.png)
}
.chatList.me .headimg {
	float:right;
	background-image:url(../imgs/chat_me.png)
}
.chatList .chat_pop {
	max-width:calc(100% - 45px);
	margin-bottom:15px;
	padding:10px;
	border-radius:6px;
	position:relative
}
.chatList.server .chat_pop {
	float:left;
	margin-left:13px;
	background:#fff;
	border:1px solid #D3DCE6;
	-webkit-box-shadow:0 3px 6px rgba(31,45,61,.1);
	box-shadow:0 3px 6px rgba(31,45,61,.1)
}
.chatList.me .chat_pop:before,.chatList.server .chat_pop:after,.chatList.server .chat_pop:before {
	border-top:5px solid transparent;
	border-bottom:5px solid transparent;
	position:absolute;
	top:10px;
	content:""
}
.chatList.server .chat_pop:before {
	border-right:5px solid #fff;
	z-index:1;
	left:-4px
}
.chatList.server .chat_pop:after {
	border-right:5px solid #D3DCE6;
	z-index:0;
	left:-5px
}
.chatList.me .chat_pop {
	float:right;
	color:#fff;
	background:#20a0ff;
	background:-webkit-linear-gradient(350deg,#20b8ff,#20a0ff);
	background:linear-gradient(100deg,#20b8ff,#20a0ff);
	-webkit-box-shadow:0 3px 6px rgba(32,160,255,.3);
	box-shadow:0 3px 6px rgba(32,160,255,.3);
	margin-right:13px
}
.chatList.me .chat_pop:before {
	border-left:5px solid #20a0ff;
	z-index:1;
	right:-4px
}
.chatList .chat_pop p {
	margin:0
}
.chatList .chat_pop ol {
	margin:5px 0 0;
	padding-left:20px
}
.chatList .chat_pop li {
	cursor:pointer;
	-webkit-transition:.25s;
	transition:.25s
}
.chatList .chat_pop li:hover {
	color:#20a0ff;
	-webkit-transition:0s;
	transition:0s
}
.chatList .chat_pop p+* {
	margin-top:10px
}
.chatList .chat_pop h4 {
	margin-top:0
}
.chatList .loading span {
	display:inline-block;
	width:6px;
	height:6px;
	background:#C0CCDA;
	border-radius:50%;
	margin:2px;
	-webkit-animation:chatLoading 1s infinite;
	animation:chatLoading 1s infinite
}
.chatList .loading span:nth-child(1) {
	-webkit-animation-delay:-.5s;
	animation-delay:-.5s
}
.chatList .loading span:nth-child(2) {
	-webkit-animation-delay:-.4s;
	animation-delay:-.4s
}
.chatList .loading span:nth-child(3) {
	-webkit-animation-delay:-.3s;
	animation-delay:-.3s
}
@-webkit-keyframes chatLoading {
	0%,100% {
	-webkit-transform:scale(1.1) translateY(-2px);
	transform:scale(1.1) translateY(-2px)
}
50% {
	-webkit-transform:scale(0) translateY(3px);
	transform:scale(0) translateY(3px);
	opacity:0
}
}@keyframes chatLoading {
	0%,100% {
	-webkit-transform:scale(1.1) translateY(-2px);
	transform:scale(1.1) translateY(-2px)
}
50% {
	-webkit-transform:scale(0) translateY(3px);
	transform:scale(0) translateY(3px);
	opacity:0
}
}.chat_form {
	border-top:1px solid #c9d4e0;
	border-radius:0 0 8px 8px;
	-webkit-box-shadow:0 1px #fff inset,0 -1px rgba(255,255,255,.3) inset,0 -2px 1px rgba(31,45,61,.03);
	box-shadow:0 1px #fff inset,0 -1px rgba(255,255,255,.3) inset,0 -2px 1px rgba(31,45,61,.03);
	background:-webkit-gradient(linear,left top,left bottom,from(#f9fafc),to(#E0E4EC));
	background:-webkit-linear-gradient(#f9fafc,#E0E4EC);
	background:linear-gradient(#f9fafc,#E0E4EC)
}
.chat_form .chat_input {
	float:left;
	margin:5px 0 5px 5px;
	width:calc(100% - 60px);
	padding:0 8px;
	line-height:20px;
	height:30px;
	text-shadow:0 1px #fff;
	border-radius:5px;
	border:1px solid #c9d4e0;
	background:linear-gradient(#f0f2f7,#fff);
	-webkit-box-shadow:0 1px #fff,0 2px 2px rgba(31,45,61,.06) inset;
	box-shadow:0 1px #fff,0 2px 2px rgba(31,45,61,.06) inset
}
.chat_form button {
	float:right;
	margin-right:6px;
	height:30px;
	margin-top:5px;
	border-radius:5px;
	color:#8492A6;
	text-shadow:0 1px #fff;
	background:#fff;
	background:-webkit-gradient(linear,left top,left bottom,from(#f9fafc),to(#E0E4EC));
	background:-webkit-linear-gradient(#f9fafc,#E0E4EC);
	background:linear-gradient(#f9fafc,#E0E4EC);
	-webkit-box-shadow:0 1px #fff inset,0 1px #fff;
	box-shadow:0 1px #fff inset,0 1px #fff;
	border:1px solid #c9d4e0;
	width:42px!important;
	padding:0!important;
	font-size:13px;
	-webkit-transition:.25s;
	transition:.25s
}
.chat_form button:hover {
	background:-webkit-gradient(linear,left top,left bottom,from(#f9fafc),to(#C0CCDA));
	background:-webkit-linear-gradient(#f9fafc,#C0CCDA);
	background:linear-gradient(#f9fafc,#C0CCDA)
}
.fullscreen_search {
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100vh;
	padding-top:10vh;
	padding-bottom:10vh;
	box-sizing:border-box;
	z-index:2000;
	visibility:hidden;
	opacity:0;
	overflow-y:auto;
	overflow-x:hidden;
	-webkit-overflow-scrolling:touch;
	-webkit-transition:padding-top .5s,visibility .5s,opacity .5s;
	transition:padding-top .5s,visibility .5s,opacity .5s
}
.fullscreen_search.visible {
	padding-top:0;
	visibility:visible;
	opacity:1;
	-webkit-transition:padding-top .5s,visibility .5s,opacity .5s;
	transition:padding-top .5s,visibility .5s,opacity .5s
}
.fullscreen_search .close_btn,.wechat-cover-wrapper .close_btn {
	float:right;
	margin-top:15px;
	margin-right:15px;
	cursor:pointer;
	font-size:24px;
	opacity:.5;
	color:#fff;
	-webkit-transition:.25s;
	transition:.25s
}
.fullscreen_search .close_btn:hover,.wechat-cover-wrapper .close_btn:hover {
	opacity:1
}
.fullscreen_search .searchbox {
	margin:30vh auto 0;
	color:#fff;
	min-width:290px;
	width:50%;
	position:relative;
	background:rgba(255,255,255,.15);
	border-radius:50px;
	padding:4px;
	-webkit-box-shadow:0 13px 15px rgba(0,0,0,.15),0 0 0 1px rgba(255,255,255,.5) inset;
	box-shadow:0 13px 15px rgba(0,0,0,.15),0 0 0 1px rgba(255,255,255,.5) inset;
	-webkit-transition:.5s;
	transition:.5s
}
.fullscreen_search .searchbox:focus-within {
	background:#fff;
	color:#475669
}
.fullscreen_search .searchbox input {
	width:calc(100% - 34px);
	height:34px;
	border:none;
	border-radius:16px 0 0 16px;
	padding:0 15px;
	float:left;
	background:0 0
}
.fullscreen_search .searchbox .button {
	width:34px;
	height:34px;
	border-radius:50%;
	border:none;
	float:right;
	background:#20a0ff;
	color:#fff;
	text-align:center;
	line-height:34px;
	padding:0;
	cursor:pointer;
	-webkit-transition:.25s;
	transition:.25s
}
.fullscreen_search .searchbox:focus-within .button {
	-webkit-box-shadow:0 3px 4px rgba(32,160,255,.5);
	box-shadow:0 3px 4px rgba(32,160,255,.5)
}
.fullscreen_search .advanced {
	margin-top:10px;
	text-align:center;
	color:#fff;
	font-size:14px
}
.fullscreen_search .advanced i {
	-webkit-transition:.25s;
	transition:.25s
}
.fullscreen_search .advanced span {
	cursor:pointer
}
.fullscreen_search .advanced.open i {
	-webkit-transform:rotate(180deg);
	transform:rotate(180deg)
}
.fullscreen_search .checkbox-group {
	text-align:center;
	position:relative;
	color:#fff
}
.fullscreen_search .checkbox-group .jv-checkbox+label {
	margin-left:10px
}
.fullscreen_search .checkbox-group .jv-checkbox+label+label {
	margin-right:10px
}
.fullscreen_search .postLists {
	opacity:0;
	visibility:hidden;
	padding-top:5vh;
	-webkit-transition:.3s;
	transition:.3s
}
.fullscreen_search .postLists.visible {
	opacity:1;
	visibility:visible;
	padding-top:0
}
.fullscreen_search .nodata {
	text-align:center;
	font-size:20px;
	color:#fff;
	opacity:.5;
	margin-top:50px
}
.fullscreen_search .postLists.cards .card {
	-webkit-box-shadow:0 15px 20px rgba(31,45,61,.5);
	box-shadow:0 15px 20px rgba(31,45,61,.5)
}
.fullscreen_search .postLists.cards .card:hover {
	-webkit-box-shadow:0 5px 8px rgba(31,45,61,.75);
	box-shadow:0 5px 8px rgba(31,45,61,.75)
}
.low_cpu_card {
	-webkit-box-shadow:0 13px 15px rgba(31,45,61,5);
	box-shadow:0 13px 15px rgba(31,45,61,5);
	border-radius:13px;
	margin-bottom:30px
}
.low_cpu_card img {
	width:100%;
	border-radius:13px 13px 0 0
}
.low_cpu_card .meta {
	padding:8px 15px;
	background:#fff;
	border-radius:0 0 13px 13px
}
.low_cpu_card h2 {
	font-size:16px;
	color:#475669;
	margin:6px 0 0;
	-webkit-transition:color .25s;
	transition:color .25s
}
.low_cpu_card h2:hover {
	color:#20a0ff
}
.low_cpu_card a {
	color:inherit;
	text-decoration:none
}
.low_cpu_card .tags {
	margin-top:10px;
	-webkit-transition:.25s;
	transition:.25s
}
.low_cpu_card .tags a {
	display:inline-block;
	font-size:10px;
	line-height:20px;
	padding:0 10px;
	color:#20a0ff;
	position:relative
}
.low_cpu_card .tags a:before {
	content:"";
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
	color:inherit;
	background:currentColor;
	border-radius:20px;
	opacity:.15
}
.wechat-cover-wrapper {
	position:fixed;
	z-index:2000;
	top:0;
	right:0;
	bottom:0;
	left:0;
	overflow:auto;
	-webkit-overflow-scrolling:touch;
	-webkit-transition:.5s ease .25s;
	transition:.5s ease .25s
}
.wechat-cover .cover {
	position:relative
}
.wechat-cover-wrapper.unavailable {
	visibility:hidden;
	opacity:0;
	margin-top:10vh;
	-webkit-transition:.5s;
	transition:.5s
}
.wechat-cover {
	width:400px;
	max-width:calc(100% - 30px);
	margin:auto
}
.wechat-cover .renderCoverImg {
	-webkit-box-shadow:0 13px 20px rgba(0,0,0,.3);
	box-shadow:0 13px 20px rgba(0,0,0,.3);
	border-radius:13px;
	overflow:hidden
}
.wechat-cover img {
	width:100%
}
.wechat-cover .cover .title {
	position:absolute;
	bottom:0;
	left:0;
	right:0;
	padding:15px;
	color:#fff;
	text-shadow:0 3px 3px rgba(0,0,0,.3);
	background:-webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,0)),to(rgba(0,0,0,.5)));
	background:-webkit-linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.5));
	background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.5));
	font-size:22px;
	text-align:center
}
.wechat-cover .meta {
	background:#fff
}
.wechat-cover .description {
	padding:20px;
	font-size:14px;
	color:#657487
}
.wechat-cover .qrcode {
	margin:auto;
	width:120px;
	padding:10px;
	background:#fff;
	height:120px
}
.wechat-cover .muted {
	text-align:center;
	color:#99A9BF;
	font-size:12px;
	padding:15px 0
}
.wechat-cover .wait {
	text-align:center
}
.wechat-cover .wait span {
	margin-top:30px;
	display:inline-block;
	padding:8px 18px;
	background:#20a0ff;
	background:-webkit-gradient(linear,left top,right top,from(#20a0ff),to(#20b8ff));
	background:-webkit-linear-gradient(left,#20a0ff,#20b8ff);
	background:linear-gradient(90deg,#20a0ff,#20b8ff);
	-webkit-box-shadow:0 13px 20px rgba(0,0,0,.3);
	box-shadow:0 13px 20px rgba(0,0,0,.3);
	color:#fff;
	border-radius:20px
}
.wechat-cover .wait span.success {
	background:#67C23A;
	background:-webkit-gradient(linear,left top,right top,from(#9bd330),to(#67C23A));
	background:-webkit-linear-gradient(left,#9bd330,#67C23A);
	background:linear-gradient(90deg,#9bd330,#67C23A)
}
article .gallery_title {
	margin-top:-10px
}
.tag-title {
	margin-bottom:15px!important
}
.favlinks_title {
	font-size:20px
}

.nirvana-favlinks-page {
	padding:0 0 10px
}

.nirvana-favlinks-grid {
	--nirvana-favlink-gap:12px;
	display:grid !important;
	grid-template-columns:repeat(5,minmax(0,1fr)) !important;
	gap:var(--nirvana-favlink-gap) !important;
	margin:0 0 18px !important;
	padding:0 !important;
	width:100% !important;
	align-items:start !important;
	justify-items:stretch !important
}

.nirvana-favlinks-grid:before,
.nirvana-favlinks-grid:after {
	content:none !important;
	display:none !important
}

.nirvana-favlink-card {
	position:relative;
	display:grid !important;
	grid-template-columns:25% 1fr !important;
	align-items:center !important;
	align-content:start !important;
	gap:10px !important;
	min-height:70px !important;
	height:auto !important;
	max-height:120px !important;
	padding:12px 12px !important;
	border-radius:16px !important;
	border:1px solid rgba(202,207,213,.55) !important;
	border-top:3px solid var(--nirvana-favlink-accent,#1ecae4) !important;
	background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(243,247,252,.74)) !important;
	box-shadow:0 14px 30px rgba(31,45,61,.12),inset 0 1px 0 rgba(255,255,255,.92),inset 0 -1px 0 rgba(0,0,0,.04) !important;
	-webkit-backdrop-filter:blur(12px);
	backdrop-filter:blur(12px);
	transition:transform .18s ease,box-shadow .18s ease,filter .18s ease,background .18s ease,border-color .18s ease;
	overflow:hidden !important;
	text-decoration:none !important;
	color:inherit !important;
	align-self:start !important
}

.nirvana-favlink-card:hover {
	transform:translateY(2px) scale(.995);
	box-shadow:0 10px 18px rgba(31,45,61,.10),inset 0 6px 18px rgba(0,0,0,.10),inset 0 1px 0 rgba(255,255,255,.55) !important
}

.nirvana-favlink-icon {
	grid-column:1;
	display:flex;
	align-items:center;
	justify-content:center;
	width:clamp(48px,4.6vw,64px);
	height:clamp(48px,4.6vw,64px);
	max-width:100%;
	border-radius:16px;
	color:#fff;
	font-weight:800;
	overflow:hidden;
	box-shadow:0 12px 22px rgba(0,0,0,.14),inset 0 2px 0 rgba(255,255,255,.35)
}

.nirvana-favlink-logo {
	display:block;
	width:auto !important;
	height:auto !important;
	max-width:78%;
	max-height:78%;
	object-fit:contain;
	margin:0 auto
}

.nirvana-favlink-meta {
	display:flex;
	flex-direction:column;
	justify-content:center;
	min-width:0
}

.nirvana-favlink-title {
	display:-webkit-box;
	font-size:13px;
	font-weight:700;
	line-height:1.2;
	margin-bottom:6px;
	-webkit-line-clamp:1;
	-webkit-box-orient:vertical;
	overflow:hidden;
	text-overflow:ellipsis
}

.nirvana-favlink-description {
	font-size:11px;
	line-height:1.45;
	opacity:.72;
	display:-webkit-box;
	-webkit-line-clamp:2;
	-webkit-box-orient:vertical;
	overflow:hidden
}

.nirvana-favlink-card--apply {
	border-style:dashed !important;
	cursor:pointer
}

.nirvana-favlink-card--apply .nirvana-favlink-icon {
	background:linear-gradient(135deg,#1ecae4,#5cb6ff);
	box-shadow:0 16px 26px rgba(32,160,255,.22),inset 0 2px 0 rgba(255,255,255,.4)
}

body.night .nirvana-favlink-card {
	border-color:rgba(255,255,255,.10) !important;
	background:linear-gradient(180deg,rgba(33,38,48,.78),rgba(18,20,26,.68)) !important;
	box-shadow:0 28px 56px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.08) !important;
	color:#d8e0ea !important
}

body.night .nirvana-favlink-icon {
	box-shadow:0 18px 30px rgba(0,0,0,.62),inset 0 2px 0 rgba(255,255,255,.10)
}

@media (max-width:1399px) {
	.nirvana-favlinks-grid {
		grid-template-columns:repeat(4,minmax(0,1fr)) !important
	}
}

@media (max-width:1199px) {
	.nirvana-favlinks-grid {
		grid-template-columns:repeat(3,minmax(0,1fr)) !important
	}
}

@media (max-width:991px) {
	.nirvana-favlinks-grid {
		grid-template-columns:repeat(2,minmax(0,1fr)) !important
	}
}

@media (max-width:575px) {
	.nirvana-favlinks-grid {
		grid-template-columns:repeat(1,minmax(0,1fr)) !important
	}
	.nirvana-favlink-card {
		max-height:140px !important
	}
}

.favlinks-group.clearfix {
	--favlink-gap:12px;
	display:grid !important;
	grid-template-columns:repeat(5,minmax(0,1fr)) !important;
	gap:var(--favlink-gap) !important;
	margin:0 !important;
	padding:0 !important;
	width:100% !important;
	align-items:start;
	grid-auto-rows:minmax(0,auto)
}

.favlinks-group.clearfix:before,
.favlinks-group.clearfix:after {
	content:none !important;
	display:none !important
}

.favlinks-group.clearfix>[class*=col-] {
	padding-left:0 !important;
	padding-right:0 !important;
	margin:0 !important;
	width:auto !important;
	max-width:none !important;
	flex:none !important;
	float:none !important;
	height:auto !important;
	align-self:start
}

.favlink-card {
	position:relative;
	display:grid;
	grid-template-columns:25% 1fr;
	align-items:center;
	align-content:start;
	gap:10px;
	min-height:70px;
	height:auto;
	padding:12px 12px;
	border-radius:16px;
	border:1px solid rgba(202,207,213,.55);
	background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(243,247,252,.74));
	box-shadow:0 14px 30px rgba(31,45,61,.12),inset 0 1px 0 rgba(255,255,255,.92),inset 0 -1px 0 rgba(0,0,0,.04);
	-webkit-backdrop-filter:blur(12px);
	backdrop-filter:blur(12px);
	transition:transform .18s ease,box-shadow .18s ease,filter .18s ease,background .18s ease,border-color .18s ease;
	overflow:hidden;
	transform:translateZ(0);
	align-self:start
}

.favlink-card:before {
	content:"";
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	background:radial-gradient(180px 120px at 20% 0,rgba(255,255,255,.66),rgba(255,255,255,0) 64%),radial-gradient(260px 160px at 110% 120%,rgba(32,160,255,.10),rgba(32,160,255,0) 60%);
	pointer-events:none
}

.favlink-apply-card {
	text-decoration:none !important;
	cursor:pointer
}

.favlink-apply-card .favlink-meta,
.favlink-apply-card .icon {
	pointer-events:none
}

.main-nav.nav-scrolled {
	left:var(--nirvana-nav-indent,10px) !important;
	right:var(--nirvana-nav-indent,10px) !important;
	top:var(--nirvana-nav-top,10px) !important;
	border-radius:var(--nirvana-nav-radius,18px) !important;
	background:linear-gradient(#f9fafc calc(100% - 1.5em), rgb(202 207 213 / 44%)) !important;
	border:1px solid rgba(255,255,255,.65) !important;
	box-shadow:0 16px 40px rgba(31,45,61,.14),inset 0 1px 0 rgba(255,255,255,.8) !important
}

@supports ((-webkit-backdrop-filter: none) or (backdrop-filter:none)) {
	.main-nav.nav-scrolled {
		-webkit-backdrop-filter:blur(12px);
		backdrop-filter:blur(12px)
	}
}

body.night .main-nav.nav-scrolled {
	background:linear-gradient(#132235 calc(100% - 1.5em), #325075ba) !important;
	border-color:rgba(255,255,255,.08) !important;
	box-shadow:0 22px 56px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.06) !important
}

@media (max-width:768px) {
	.main-nav.nav-scrolled {
		left:var(--nirvana-nav-indent,6px) !important;
		right:var(--nirvana-nav-indent,6px) !important;
		top:var(--nirvana-nav-top,8px) !important;
		border-radius:var(--nirvana-nav-radius,16px) !important
	}
}

.favlink-card>a,
.favlink-card a {
	position:relative;
	z-index:1
}

.favlink-card .title {
	display:-webkit-box;
	position:relative;
	z-index:1;
	font-size:13px;
	font-weight:700;
	color:inherit;
	line-height:1.2;
	margin-bottom:6px;
	-webkit-line-clamp:1;
	-webkit-box-orient:vertical;
	overflow:hidden;
	text-overflow:ellipsis
}

.favlink-card .description {
	position:relative;
	z-index:1;
	font-size:11px;
	line-height:1.45;
	opacity:.72;
	display:-webkit-box;
	-webkit-line-clamp:2;
	-webkit-box-orient:vertical;
	overflow:hidden
}

.favlink-card .favlink-meta {
	display:flex;
	flex-direction:column;
	justify-content:center;
	min-width:0;
	flex:1 1 auto
}

.favlink-card .icon {
	position:relative;
	left:auto;
	top:auto;
	transform:none;
	grid-column:1;
	display:flex;
	align-items:center;
	justify-content:center;
	width:clamp(48px,4.6vw,64px);
	height:clamp(48px,4.6vw,64px);
	max-width:100%;
	border-radius:16px;
	color:#fff;
	text-decoration:none;
	font-weight:800;
	box-shadow:0 12px 22px rgba(0,0,0,.14),inset 0 2px 0 rgba(255,255,255,.35);
	transition:box-shadow .18s ease,filter .18s ease;
	overflow:hidden
}

.favlink-card .icon .favlink-logo,
.favlink-card .icon img {
	display:block;
	width:auto !important;
	height:auto !important;
	max-width:78%;
	max-height:78%;
	object-fit:contain;
	margin:0 auto
}

.favlink-card .title,
.favlink-card .description {
	flex:1 1 auto;
	min-width:0
}

.favlink-card .title,
.favlink-card .description {
	max-width:100%
}

.favlink-card:hover {
	transform:translateY(2px) scale(.995);
	box-shadow:0 10px 18px rgba(31,45,61,.10),inset 0 6px 18px rgba(0,0,0,.10),inset 0 1px 0 rgba(255,255,255,.55)
}

.favlink-card.favlink-apply-card {
	cursor:pointer;
	border-style:dashed
}

.favlink-card.favlink-apply-card .icon {
	background:linear-gradient(135deg,#1ecae4,#5cb6ff);
	box-shadow:0 16px 26px rgba(32,160,255,.22),inset 0 2px 0 rgba(255,255,255,.4)
}

.favlink-card.favlink-apply-card .icon i {
	font-size:18px
}

body.night .favlink-card {
	border-color:rgba(255,255,255,.10);
	background:linear-gradient(180deg, rgb(51 63 85 / 78%), rgba(18, 20, 26, .68));
	box-shadow:0 28px 56px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.08);
	color:#d8e0ea
}

body.night .favlink-card:before {
	background:radial-gradient(180px 120px at 20% 0,rgba(255,255,255,.10),rgba(255,255,255,0) 64%),radial-gradient(260px 160px at 110% 120%,rgba(32,160,255,.10),rgba(32,160,255,0) 60%)
}

body.night .favlink-card .icon {
	box-shadow:0 18px 30px rgba(0,0,0,.62),inset 0 2px 0 rgba(255,255,255,.10)
}

@media (max-width:767px) {
	.favlink-card {
		border-radius:16px;
		padding:12px 12px;
		gap:12px
	}
	.favlink-card .icon {
		width:clamp(56px,16vw,78px);
		height:clamp(56px,16vw,78px);
		border-radius:18px
	}
	.favlink-card .title {
		font-size:14px
	}
}

@media (max-width:1399px) {
	.favlinks-group.clearfix>[class*=col-] {
		flex-basis:auto
	}
	.favlinks-group.clearfix {
		grid-template-columns:repeat(4,minmax(0,1fr)) !important
	}
}

@media (max-width:1199px) {
	.favlinks-group.clearfix>[class*=col-] {
		flex-basis:auto
	}
	.favlinks-group.clearfix {
		grid-template-columns:repeat(3,minmax(0,1fr)) !important
	}
}

@media (max-width:991px) {
	.favlinks-group.clearfix>[class*=col-] {
		flex-basis:auto
	}
	.favlinks-group.clearfix {
		grid-template-columns:repeat(2,minmax(0,1fr)) !important
	}
}

@media (max-width:575px) {
	.favlinks-group.clearfix>[class*=col-] {
		flex-basis:100%;
	}
	.favlinks-group.clearfix {
		grid-template-columns:repeat(1,minmax(0,1fr)) !important
	}
}

.links_wrapper.post {
	color:#657487;
	padding:30px 60px;
	background:#fff;
	border-radius:13px;
	box-shadow:0 13px 15px rgba(31,45,61,.1);
	margin-bottom:30px;
	position:relative;
	overflow:hidden
}
.favlink-card-mini {
	display:flex;
	align-items:center;
	margin-bottom:20px
}
.favlink-card-mini .site_icon {
	width:48px;
	height:48px;
	background-position:50%;
	background-repeat:no-repeat;
	background-size:contain;
	display:block;
	border-radius:6px 0 0 6px
}
.favlink-card-mini .metas {
	background:#fff;
	box-shadow:0 5px 15px rgba(31,45,61,.1),inset 0 0 0 1px hsla(0,0%,100%,.06);
	border-radius:6px;
	height:60px;
	padding:0 15px;
	display:flex;
	justify-content:center;
	flex-direction:column;
	width:calc(100% - 48px);
	text-shadow:0 1px #fff;
	position:relative
}
.favlink-card-mini .metas .background {
	position:absolute;
	left:1px;
	top:1px;
	right:1px;
	bottom:1px;
	border-radius:5px;
	opacity:0;
	transition:opacity .25s
}
.favlink-card-mini .metas .background.reverse {
	transform:scaleY(-1)
}
.favlink-card-mini .metas .title {
	position:relative;
	z-index:1;
	color:#657487;
	font-size:14px;
	font-weight:700;
	transition:.25s
}
.favlink-card-mini .metas .description {
	position:relative;
	z-index:1;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis
}
.favlink-card-mini:hover .metas .background {
	opacity:.15
}
.favlink-card-mini .site_icon.add_new {
	background-image:radial-gradient(circle farthest-side at 75% 25%,#3dc3ff,#0394ff);
	background-color:#20a0ff;
	box-shadow:0 5px 8px rgba(32,160,255,.3)!important
}
.cursor-hand {
	cursor:pointer!important
}
.mu_register.wp-signup-container {
	padding:15px 30px;
	margin:40px auto;
	border-radius:10px;
	max-width:500px;
	background:#fff;
	-webkit-box-shadow:0 13px 15px rgba(31,45,62,.1);
	box-shadow:0 13px 15px rgba(31,45,62,.1)
}
.mu_register.wp-signup-container h2 {
	font-size:16px
}
.mu_register.wp-signup-container input {
	border-radius:4px;
	border:1px solid #ddd;
	padding:7px 12px;
	font-size:14px!important;
	-webkit-transition:.25s;
	transition:.25s
}
.mu_register.wp-signup-container input:focus {
	border-color:#20a0ff
}
.mu_register.wp-signup-container input.submit {
	max-width:100px;
	color:#fff;
	background:#20a0ff;
	border-color:#20a0ff
}
.container.four04 {
	text-align:center
}
.container.four04 img {
	max-width:100%
}
.lightbox_wrapper {
	position:fixed;
	top:0;
	right:0;
	bottom:0;
	left:0;
	background-color:rgba(31,45,62,.75);
	padding:40px;
	z-index:999;
	-webkit-transition:.5s;
	transition:.5s
}
.lightbox_wrapper.unvisible {
	background-color:rgba(31,45,62,0)
}
.lightbox_wrapper img {
	max-width:100%;
	max-height:100%;
	-webkit-transform:scale(1);
	transform:scale(1);
	opacity:1;
	-webkit-box-shadow:0 15px 15px rgba(31,45,62,.25);
	box-shadow:0 15px 15px rgba(31,45,62,.25);
	background:rgba(31,45,62,.75);
	-webkit-transition:all cubic-bezier(.4,1.5,.55,1) .5s,-webkit-transform-origin 0s;
	transition:all cubic-bezier(.4,1.5,.55,1) .5s,-webkit-transform-origin 0s;
	transition:all cubic-bezier(.4,1.5,.55,1) .5s,transform-origin 0s;
	transition:all cubic-bezier(.4,1.5,.55,1) .5s,transform-origin 0s,-webkit-transform-origin 0s
}
.lightbox_wrapper img.unvisible {
	-webkit-transform:scale(0);
	transform:scale(0);
	opacity:0
}
.pf_user_center #app {
	margin:15px 0 30px;
	border-radius:8px;
	-webkit-box-shadow:0 15px 15px rgba(31,45,62,.15);
	box-shadow:0 15px 15px rgba(31,45,62,.15);
	overflow:hidden
}
.pf_user_center .user-center-wrapper {
	min-height:calc(100vh - 58px - 85px - 55px)
}
.post-password-form {
	text-align:center;
	padding:30px 0 100px
}
.post-password-form p {
	font-size:14px
}
.post-password-form input[name=post_password] {
	height:30px;
	border:1px solid transparent;
	border-radius:5px;
	background:#f0f2f7;
	padding:0 9px;
	-webkit-transition:.25s;
	transition:.25s
}
.post-password-form input[name=post_password]:focus {
	background:#fff;
	border-color:#20a0ff;
	-webkit-box-shadow:0 0 0 3px rgba(32,160,255,.2)!important;
	box-shadow:0 0 0 3px rgba(32,160,255,.2)!important;
	-webkit-transition:.25s;
	transition:.25s
}
.post-password-form input[name=Submit] {
	border:none;
	height:30px;
	background:-webkit-gradient(linear,left top,right top,from(#20a0ff),to(#20b8ff));
	background:-webkit-linear-gradient(left,#20a0ff,#20b8ff);
	background:linear-gradient(90deg,#20a0ff,#20b8ff);
	color:#fff;
	padding:0 15px;
	border-radius:6px;
	margin-left:6px;
	-webkit-box-shadow:0 3px 5px rgba(32,160,255,.5);
	box-shadow:0 3px 5px rgba(32,160,255,.5)
}
@media screen and (max-width:767px) {
	.entry-format,.entry-star {
	display:none
}
.coverflow-wrapper {
	padding:0
}
.coverflow.container {
	height:auto;
	overflow:hidden;
	-webkit-box-orient:vertical;
	-webkit-box-direction:reverse;
	-ms-flex-direction:column-reverse;
	flex-direction:column-reverse
}
#coverflow[type=image] .coverflow.container {
	-webkit-box-orient:horizontal;
	-webkit-box-direction:normal;
	-ms-flex-direction:row;
	flex-direction:row
}
.coverflow>.content {
	-webkit-box-align:center;
	-ms-flex-align:center;
	align-items:center
}
#coverflow .showBox {
	margin-top:30px
}
#coverflow.unfull,#coverflow[type=image] .showBox {
	margin-top:0
}
#coverflow,#coverflow.unfull {
	border-radius:0;
	-webkit-box-shadow:none;
	box-shadow:none
}
#coverflow.unfull .content {
	padding:0 10px
}
#coverflow .content {
	width:100%;
	padding-left:0
}
.dark-slider #coverflow .content{
	color:#fff
}
#coverflow .imgBlur{
	position:absolute;
	left:-10px;
	top:-50px;
	right:-50px;
	bottom:-50px;
	background-size:cover;
	background-position:center;
	opacity:.28;
	animation:10s bgAnimation ease-out forwards
}
#coverflow[type=image] .imgBlur{display:none!important}
#coverflow .imgColor{
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0
}
#coverflow #canvas{position:absolute;bottom:0;z-index:3;pointer-events:none}
#coverflow[type=image] #canvas{z-index:0!important}
@keyframes bgAnimation{
	0%{background-position:top left}
	100%{background-position:bottom right}
}
#coverflow .content h1,#coverflow .content h2 {
	font-size:20px;
	margin-top:20px;
	margin-bottom:20px;
	text-align:center
}
#coverflow .image {
	width:370px
}
#coverflow .image .card {
	width:170px;
	height:152px;
	border-radius:6px
}
#coverflow .content .category {
	margin-top:20px
}
#coverflow .content .category:after {
	content:"";
	display:block;
	left:calc(50% - 15px);
	position:absolute
}
#coverflow>.anchor {
	display:none
}
#coverflow.gallery>.anchor {
	display:block
}
#coverflow.gallery>.navigator,#coverflow>.navigator {
	display:none
}
#coverflow[type=image] .coverflow {
	height:160px
}
#coverflow[type=image],#coverflow[type=image].unfull {
	height:160px;
	padding-top:0
}
#coverflow[type=auto] .content {
	width:100%
}
#coverflow[type=auto] .page.hasHeadImg .image {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex
}
#coverflow[type=auto] .imgBlur.useHeadImg {
	-webkit-animation-duration:15s!important;
	animation-duration:15s!important
}
#coverflow[type=auto] h2 {
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
	width:100%;
	line-height:1.6;
	margin-bottom:8px
}
#coverflow[type=auto]>.anchor {
	display:block
}
#flatflow .future2,#flatflow .past2,#flatflow+.navigator,#flatflow>.anchor,.postLists.lists .card .description {
	display:none
}
#flatflow {
	height:150px
}
#flatflow .current .page,#flatflow .page {
	height:110px;
	left:0;
	width:100%
}
#flatflow .past0 .page {
	left:-100%;
	margin-left:-1px
}
#flatflow .past1 .page {
	left:-200%;
	margin-left:-2px
}
#flatflow .future0 .page {
	left:100%;
	margin-left:1px
}
#flatflow .future1 .page {
	left:200%;
	margin-left:2px
}
#flatflow .page .cover {
	width:120px;
	height:107px;
	left:15px;
	bottom:-15px
}
#flatflow .page .title {
	font-size:13px;
	margin-left:150px;
	margin-right:15px
}
#flatflow .page .title:after {
	width:20px
}
#flatflow .page .description {
	font-size:16px;
	margin-top:10px;
	margin-left:150px;
	margin-right:15px;
	line-height:1.2em;
	max-height:2.4em
}
#flatflow .future0 .page .cover,#flatflow .past0 .page .cover {
	opacity:0;
	-webkit-transition:.25s;
	transition:.25s
}
#flatflow .current .page .cover {
	opacity:1;
	-webkit-transition:.25s;
	transition:.25s
}
.postLists.cards .card {
	margin-bottom:16px
}
.postLists.cards .card .meta {
	padding:8px 10px
}
.postLists.cards .card .date {
	font-size:11px
}
.postLists.cards .card h2 {
	font-size:15px;
	margin:6px 0 0
}
.postLists.cards .card .tags {
	margin-top:4px
}
.postLists.cards .card .tags a {
	font-size:9.5px;
	line-height:16px;
	padding:0 6px
}
.fullscreen_search .postLists.cards .post-card-wrapper,.long-model-wrapper .postLists.cards .post-card-wrapper,.postListsModel .postLists.cards .post-card-wrapper {
	padding-left:8px;
	padding-right:8px
}
.postLists.cards .card .summary {
	bottom:8px;
	font-size:11px
}
.flex-shrink-0{flex-shrink:0}
.postLists .post-item .metas{font-size:13px;display:flex;transform-origin:left;transition:.25s}
.postLists .post-item .metas span{display:flex;column-gap:.25em;justify-content:center;align-items:center}
.postLists .post-item .metas .likes{color:#f56c6c}
.postLists .post-item .metas .comments{color:#1f8bff}
.postLists .post-item .metas .views{color:#67c23a}
.postLists .post-item .tags{white-space:nowrap;overflow:hidden;mask-image:linear-gradient(90deg,#000 calc(100% - 1em),transparent calc(100% - .2em));transition:.25s}
.postLists .post-item .tags a,.postLists .post-item .tags span{text-decoration:none;font-size:13px;display:inline;margin-right:.5em;padding:.2em .5em;border-radius:9em}
.postLists .post-item .tags .color-0{color:#8492a6!important;background:rgba(132,146,166,.15)}
.postLists .post-item .tags .color-1,.postLists .post-item .tags .color-5{color:#20a0ff!important;background:rgba(32,160,255,.15)}
.postLists .post-item .tags .color-2,.postLists .post-item .tags .color-6{color:#39c408!important;background:rgba(57,196,8,.15)}
.postLists .post-item .tags .color-3,.postLists .post-item .tags .color-7{color:#ff8400!important;background:rgba(255,132,0,.15)}
.postLists .post-item .tags .color-4,.postLists .post-item .tags .color-8{color:#837adc!important;background:rgba(131,122,220,.15)}
.postLists.cards .post-item.m-card{display:flex;align-items:center;flex-direction:column;border:1px solid #fff;border-radius:1em;background:linear-gradient(#f4f7fa calc(100% - 1.5em),#e6ecf4);box-shadow:0 1em 1em #1f2d3d26;text-align:center;text-shadow:0 1px #fff;transition:.25s;margin-bottom:4.75rem}
.postLists.cards .post-item.m-card .img,.postLists.cards .post-item.m-card .img::before{background-position:center;background-size:cover;background-repeat:no-repeat;border-radius:.75em;transition:.25s}
.postLists.cards .post-item.m-card:hover{transform:translateY(1em);box-shadow:0 .2em .4em #1f2d3d33}
.postLists.cards .post-item.m-card .img{position:relative;display:block;margin-top:-.625em;width:calc(100% - .85em);padding-top:calc(89.45% - .67em);background-position:center;background-size:cover;background-repeat:no-repeat;border-radius:.75em;box-shadow:1px 0 rgba(255,255,255,.5),-1px 0 rgba(255,255,255,.5),0 1px rgba(255,255,255,.5),0 .5em 1.2em var(--s-color);-webkit-box-shadow:1px 0 rgba(255,255,255,.5),-1px 0 rgba(255,255,255,.5),0 1px rgba(255,255,255,.5),0 .5em 1.2em var(--s-color);transform:translateZ(0);transition:.25s}
.postLists.cards .post-item.m-card:hover .img{transform:translateY(1em) translateZ(0);box-shadow:none;-webkit-box-shadow:none}
.postLists.cards .post-item.m-card .img .date{display:flex;background:rgba(0,0,0,.2);border-radius:0 0 .75em .75em;height:3em;justify-content:center;column-gap:.25em;font-size:14px;align-items:center;text-decoration:none;color:#fff;text-shadow:0 3px 3px rgba(0,0,0,.3);position:absolute;bottom:0;left:0;right:0;opacity:0;transition:.25s}
.postLists.cards .post-item.m-card:hover .img::before{opacity:0}
.postLists.cards .post-item.m-card .img .date{display:flex;background:rgba(0,0,0,.2);border-radius:0 0 .75em .75em;height:3em;justify-content:center;column-gap:.25em;align-items:center;text-decoration:none;position:absolute;bottom:0;left:0;right:0;opacity:0;transition:.25s;font-size:14px;color:#fff;text-shadow:0 3px 3px rgba(0,0,0,.3)}
.postLists.cards .post-item.m-card:hover .img .date{opacity:1}
.postLists.cards .post-item.m-card .infos{width:100%}
.postLists.cards .post-item.m-card .title{font-size: 16px;/*padding: 0 .5em;*/margin: 1em 0 .5em;overflow: hidden;max-width: 100%;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;text-overflow: ellipsis;text-shadow: 0 1px #fff;transition: .25s;white-space: normal;line-height:1.4;min-height:calc(1.4em * 2)}
.postLists.cards .post-item.m-card:hover .title{transform:translateY(.5em)}
.postLists.cards .post-item.m-card .infos .date,.postLists.cards .post-item.m-card a.title,.postLists.lists .post-item.m-card .go,.postLists.lists .post-item.m-card .img .date,.postLists.lists .post-item.m-card div.title{display:none}
.postLists.cards .post-item.m-card .metas{column-gap:1.2em;justify-content:center}
.postLists.cards .post-item.m-card:hover .metas{transform:translateY(.8em) scale(.8);opacity:0}
.postLists.cards .post-item.m-card .tags{width:100%;transform-origin:right;padding:0 .5em;opacity:0;visibility:hidden;transform:scale(.8);margin-top:-.7em}
.postLists.cards .post-item.m-card:hover .tags{transform:scale(1);opacity:1;visibility:visible}
.postLists.cards .post-item.m-card .go{display:inline-block;min-width:50%;background:linear-gradient(90deg,var(--d-color),var(--l-color));box-shadow:0 .5em 1.2em var(--s-color);font-size:14px;margin:.3em 0 1.5em;padding:.45em 1.5em;border-radius:9em;text-decoration:none;color:#fff;text-shadow:0 2px 3px var(--s-color);transition:.25s}
.postLists.cards .post-item.m-card:hover .go{transform:translateY(.3em)}
.postLists.cards .post-item.m-card .go:hover{min-width:60%}
.postLists.lists .post-item.m-card{display:flex;overflow:hidden;border:1px solid #fff;border-radius:1em;background:linear-gradient(rgba(255,255,255,.6),transparent);box-shadow:0 .5em .5em #1f2d3d1a;text-shadow:0 1px #fff;padding:.125em;transition:.25s;margin-bottom:2.25rem}
.postLists.lists .post-item.m-card:hover{transform:translateY(.5em);box-shadow:0 .15em .2em #1f2d3d26}
.postLists.lists .post-item.m-card .img{display:block;position:relative;width:6.75em;height:6.75em;background-position:center;background-size:cover;background-repeat:no-repeat;border-radius:.825em;margin-right:1.05em}
.postLists.lists .post-item.m-card .infos{display:flex;flex-direction:column;justify-content:center;width:calc(100% - 7.85em);line-height:1.6}
.postLists.lists .post-item.m-card a.title{padding-right:.3em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 -1px #fff,0 2px 2px rgba(31,45,61,.3);text-decoration:none;color:#475669;font-size:15px;margin:0 0 .2em;transition:.25s}
.postLists.lists .post-item.m-card a.title:hover{color:#20a0ff}
.postLists.lists .post-item.m-card .metas{column-gap:.8em}
.postLists.lists .post-item.m-card:hover .metas{transform:scale(.8);opacity:0}
.postLists.lists .post-item.m-card .tags{margin-top:-1.6em;opacity:0;visibility:hidden;transform:scale(1.2);transform-origin:left}
.postLists.lists .post-item.m-card:hover .tags{transform:scale(1);opacity:1;visibility:visible}
.postLists.lists .post-item.m-card .date{font-size:14px;color:#8492A6;margin-top:.125em}
.postLists.cards .post-item.m-card .badage-list{position:absolute;top:1em;right:.75rem}
.postLists.lists .post-item.m-card .badage-list{position:absolute;top:.25em;left:.25rem}
.postLists .post-item.m-card .badage-list .badage{background-color:rgb(255 241 242 / 1);color:rgb(225 29 72 / 1);position:relative;cursor:pointer;border-radius:9999px;padding:.35rem .75rem;font-size:1rem;line-height:1rem;transition-property:color,background-color,border-color,fill,stroke,-webkit-text-decoration-color;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,-webkit-text-decoration-color;transition-duration:.15s}
body.night .postLists.cards .post-item.m-card,body.night .postLists.lists .post-item.m-card{border:1px solid #33415a;background:linear-gradient(#2a394c calc(100% - 1.5em),#34425a);box-shadow:0 1em 1em #1f2d3d1a;text-shadow:0 1px #fff0}
body.night .postLists.cards .post-item.m-card .title,body.night .postLists.lists .post-item.m-card a.title{text-shadow:0 1px 0 #fff0;color:#8e9db4}
body.night .postLists.lists .post-item.m-card a.title:hover{color:#20a0ff}
.row.postLists.cards {
	margin-right:-7px;
	margin-left:-7px
}
.row.postLists.flip,
.row.postLists.hfg,
.row.postLists.dgg,
.row.postLists.fzkp{
	display:flex;
	flex-wrap:wrap
}
.row.postLists.flip:before,
.row.postLists.hfg:before,
.row.postLists.dgg:before,
.row.postLists.fzkp:before,
.row.postLists.flip:after,
.row.postLists.hfg:after,
.row.postLists.dgg:after,
.row.postLists.fzkp:after{
	display:none
}
.row.postLists.flip>.post-card-wrapper,
.row.postLists.hfg>.post-card-wrapper,
.row.postLists.dgg>.post-card-wrapper,
.row.postLists.fzkp>.post-card-wrapper{
	float:none;
	min-width:0;
	flex:0 0 auto
}
.row.postLists.nir-rsp-grid{
	display:grid;
	grid-template-columns:repeat(var(--nir-cols,4),minmax(0,1fr));
	grid-column-gap:0;
	grid-row-gap:0
}
.row.postLists.nir-rsp-grid:before,
.row.postLists.nir-rsp-grid:after{
	content:none!important;
	display:none!important
}
.row.postLists.nir-rsp-grid>.post-card-wrapper{
	width:auto
}
.article_wrapper.post,.article_wrapper.post .share-modal,.article_wrapper.post article .alignfull,.flexContainer,.relate-posts {
	margin-left:-15px;
	margin-right:-15px
}
.postLists.lists .card .cover {
	width:80px;
	padding-top:72px
}
.postLists.lists .card .meta {
	width:calc(100% - 80px);
	padding-left:15px
}
.postLists.lists .card h2 {
	font-size:15px;
	top:8px;
	left:15px;
	width:calc(100% - 15px)
}
.postLists.lists .card .date {
	font-size:11px;
	top:28px;
	left:15px
}
.postLists.lists .card .tags a {
	font-size:9.5px;
	line-height:16px;
	padding:0 6px
}
.postLists.lists .card .tags {
	top:46px;
	left:15px;
	width:calc(100% - 15px)
}
[single][posttype=post] {
	padding-top:0
}
.article_wrapper.post {
	border-radius:0;
	padding:0 15px
}
.article_wrapper.post article .wp-block-image.alignfull img {
	width:calc(100% + 30px);
	max-width:calc(100% + 30px)
}
.article_wrapper.post .share-modal {
	padding-left:15px;
	padding-right:15px
}

.flexContainer {
	-webkit-box-orient:vertical;
	-webkit-box-direction:normal;
	-ms-flex-direction:column;
	flex-direction:column
}
.block.text {
	padding:0 15px
}
.commentlist .children {
	padding-left:0
}
.single .postListsModel {
	padding-top:0
}
.article_wrapper.post {
	margin-bottom:4px;
	-webkit-box-shadow:none;
	box-shadow:none
}
#chatTemplate {
	max-height:calc(100vh - 177px)
}
#assistance {
	width:320px;
	max-width:calc(100vw - 52px)
}
.relate-posts {
	margin-bottom:4px;
	-webkit-box-shadow:none;
	box-shadow:none;
	border-radius:0;
	padding:0 15px
}
.relate-posts .posts>.single-post-container {
	padding-bottom:20px
}
.single-post.relate .thumb_img .meta h3 {
	font-size:14px
}
.lightbox_wrapper {
	padding:15px
}
}








@media (min-width:768px) {
	.postLists.lists>.post-card-wrapper {
	width:50%
}
}@media (min-width:768px) and (max-width:1199px) {
	.relate-posts .posts>.single-post-container:nth-child(4) {
	display:none
}
}












/*上一篇下一篇文章模块 */

.entry-navigation {
    position: relative;
}
.entry-page-next, .entry-page-prev {
    margin: 0;
    display: flex;
    padding: 0;
    position: relative;
    align-items: center;
    min-height: 60px;
    margin-top: 20px;
    margin-bottom: 30px;
    background-size: cover;
    background-position: 50%;
    background-repeat: no-repeat;
    color: #fff;
    border: 2px solid rgb(202 207 213 / 44%);
    border-radius: 4px;
    box-shadow: 0 0 0 1px rgb(202 207 213 / 44%),3px 4px 8px 2px var(--gray_opacity_2);
    text-shadow: 0 1px 3px rgb(0 0 0 / .8);
}
.entry-page-next:before, .entry-page-prev:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    background-color: rgba(0, 0, 0, 0.5);
    content: "";
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
}
.entry-page-next:hover, .entry-page-prev:hover {
    border-color: #e6e6e6;
}
.entry-page-next .entry-page-icon, .entry-page-prev .entry-page-icon {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    color: #ffffff;
    margin: 0;
    display: block;
    padding: 15px;
    font-size: 16px;
    -o-transition: color 250ms ease;
    transition: color 250ms ease;
    -moz-transition: color 250ms ease;
    -webkit-transition: color 250ms ease;
    z-index: 1;
}
.entry-page-info {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin: 0;
    display: block;
    padding: 16px;
    z-index: 1;
}
.entry-page-next .entry-page-info {
    text-align: left;
}
.entry-page-prev .entry-page-info {
    text-align: right;
}
.entry-page-prev .entry-page-icon {
    padding-right: 0;
}
.entry-page-next .entry-page-icon {
    padding-left: 0;
}
.entry-page-info .title {
    font-size: 14px;
    color: #fff;
    overflow: hidden;
    display: -webkit-box !important;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    white-space: normal;
    height: 18px;
    line-height: 18px;
}
.entry-page-info .rnav {
    font-size: 12px;
    line-height: 1.625;
    color: #ffffff;
}
@media (max-width: 768px) {
    .entry-page-next, .entry-page-prev {
        min-height: 42px;
        margin-bottom: 15px;
    }
    .entry-page-next .entry-page-icon, .entry-page-prev .entry-page-icon {
        padding: 0 16px;
    }
}
/*.entry-navigation end 上一篇下一篇结束*/

/*.entry-navigation 上一篇下一篇2*/

.entry-navigation {
    position: relative;
        padding-bottom: 10px;
}
.entry-page-next, .entry-page-prev {
    margin: 0;
    display: flex;
    padding: 0;
    position: relative;
    align-items: center;
    min-height: 60px;
    margin-top: 20px;
    margin-bottom: 30px;
    background-size: cover;
    background-position: 50%;
    background-repeat: no-repeat;
    color: #fff;
    border: 2px solid rgb(202 207 213 / 44%);
    border-radius: 4px;
    text-shadow: 0 1px 3px rgb(0 0 0 / 0.8);
}
.entry-page-next:before, .entry-page-prev:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    background-color: rgba(0, 0, 0, 0.5);
    content: "";
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
}
.entry-page-next:hover, .entry-page-prev:hover {
    border-color: var(--primary_dark_1);
}
.entry-page-next .entry-page-icon, .entry-page-prev .entry-page-icon {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    color: #ffffff;
    margin: 0;
    display: block;
    padding: 15px;
    font-size: 16px;
    -o-transition: color 250ms ease;
    transition: color 250ms ease;
    -moz-transition: color 250ms ease;
    -webkit-transition: color 250ms ease;
    z-index: 1;
}
.entry-page-info {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin: 0;
    display: block;
    padding: 16px;
    z-index: 1;
}
.entry-page-next .entry-page-info {
    text-align: left;
}
.entry-page-prev .entry-page-info {
    text-align: right;
}
.entry-page-prev .entry-page-icon {
    padding-right: 0;
}
.entry-page-next .entry-page-icon {
    padding-left: 0;
}
.entry-page-info .title {
    font-size: 14px;
    color: #fff;
    overflow: hidden;
    display: -webkit-box !important;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    white-space: normal;
    height: 18px;
    line-height: 18px;
}
.entry-page-info .rnav {
    font-size: 12px;
    line-height: 1.625;
    color: #ffffff;
}
@media (max-width: 768px) {
    .entry-page-next, .entry-page-prev {
        min-height: 42px;
        margin-bottom: 15px;
    }
    .entry-page-next .entry-page-icon, .entry-page-prev .entry-page-icon {
        padding: 0 16px;
    }
}
/*.entry-navigation end  上一篇下一篇2结束*/
















/*分辨率模块优化比例*/
@media (min-width:480px) and (max-width:767px) {
    	.post-card-col .pf_card{
	    transform: scale(0.9);
	}
	.post-list-col .pf_list{
	        transform: scale(0.96);
	}
	
	.post-blog-col .pf_blog{
	        transform: scale(0.96);
	}
	
	.favlink-card{
	        transform: none !important;
	}
	.product-card-wrapper .card .description{
            line-height: 2.5em !important;
}
}



/*首页模块文字内容修复*/
@media (max-width:1199px) and (min-width:768px) {
	.blog-slider__content{
	    width: 37%;
	        margin-left: 1%;
	}
	
	
   .recommend_panels_wrapper .recommend_panels>div{
       height: 290px;
   }
	
	    .product-card-wrapper1{
    width: 26% !important;
    margin-left: 2% !important;
    margin-right: 5% !important;
}
        .post-card-nested-col1{
    width: 29% !important;
    margin-left: 2.2% !important;
}

    .post-card-nested-col1:nth-child(n+4){
        display: none;
    }
    
    /*翻盖768显示三个*/
    .recommend_panels  :nth-child(n+4){
       opacity: 0;
   
    }
    
    .c_award1{
        display:inline !important;
    }
	
	
	
}


/*优化首页商城模块文字bug*/
.product-card-wrapper .card .description{
    height: 3.2em !important;
}

/*限制首页商城手机端显示数量*/
@media (max-width: 1199px){
.product-card-wrapper .card .description{
    display: inline !important;
}
.style-card :nth-child(n+5) {
            /* color: green; */
            display: none;
        }

}


/*限制首页wordpress美化模块的显示数量*/
@media (min-width:768px) and (max-width:1199px) {
    .product-card-wrapper1:nth-child(n+4){
        display: none !important;
    }

}









/*rev滑块修复左边距离*/
.post-card-nested-col:first-child{
    margin-left: 0px;
}

@media (max-width: 1199px) and (min-width: 768px){
.post-card-nested-col:first-child{
    margin-left: 14px;
}}

























/*闪光*/ 
@keyframes fade1 {
from {opacity: 1.0;}50% {opacity: 0.4;}to {opacity: 1.0;}}



/*翻盖SVG旋转*/
.sidebar-panel .music_box_wrapper .album .icon .disc {
 animation: rotate 1s linear infinite; 
}


/*旋转动画*/
@keyframes rotate123 {
    0%{-webkit-transform:rotate(0deg);}
    25%{-webkit-transform:rotate(90deg);}
    50%{-webkit-transform:rotate(180deg);}
    75%{-webkit-transform:rotate(270deg);}
    100%{-webkit-transform:rotate(360deg);}
}




/*淡出放大动画*/
@-webkit-keyframes scaleout {
	0% {
	-webkit-transform:scale(1.0)
}
100% {
	-webkit-transform:scale(2.1);
	opacity:0;
}
}@keyframes scaleout {
	0% {
	transform:scale(1.0);
	-webkit-transform:scale(1.0);
	opacity:0;
}
10% {
	transform:scale(1.0);
	-webkit-transform:scale(1.0);
	opacity:1;
}
100% {
	transform:scale(2.1);
	-webkit-transform:scale(2.1);
	opacity:0;
}
}





/*
* REV翻盖透明度
*/
.post-card:hover .post-thumbnail-wrapper img {
	opacity:1
}




/*
* 修复卡片文字BUG
*/
.post-card-col .pf_card .metas .meta-container .m-title .m-text{overflow: hidden;
-webkit-line-clamp: 2;
line-clamp: 2;
-webkit-box-orient: vertical;
box-orient: vertical;
display: -webkit-box;
display: box;
}

@media (max-width: 479px){
.post-card-col .pf_card .metas .meta-container .m-title .m-text{
    overflow: hidden;

text-overflow: ellipsis;

white-space: nowrap; 
}
}










/*REV轮播*/  

@media (max-width: 479px), (max-width: 767px) and (min-width: 480px){
  
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox {
    margin-top: 45px !important;
}
.single-thumbnail {
    height: 240px;
    
     
}
#cardFlip .navigator .next, #cardFlip .navigator .prev{ background: rgb(202 207 213 / 44%) !important; box-shadow: 0 -1px rgb(202 207 213 / 44%) inset !important;    bottom: 40px!important;}

#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .page{

    max-width: 195px !important;
}
[data-color-scheme=dark] #cardFlip .navigator>div{transform: rotate(90deg);}
}


.cardFlip-outer {
	margin-top:-35px
}
#cardFlip {
	box-shadow:0 6px 6px #8492a6, 0 10px 10px #99a9bf, 0 -1px 2px #d8e0ea inset ;
	position:relative;
	z-index:1;
	border-radius:0 0 12px 12px;

	color:rgb(202 207 213 / 44%);
	transition:box-shadow .5s
}
#cardFlip .slider-wrapper {
	height:330px;
	transition:.5s
}
#cardFlip .slider-wrapper .cardFlip-slider {
	display:none
}
#cardFlip .slider-wrapper .cardFlip-slider[init] {
	display:block
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox {
	margin-top:74px;
	transition:.5s
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox>* {
	height:0;
	position:relative;
	transition:.5s
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .page {
	box-shadow:0 7px 10px #d8e0ea,0 0 0 1px rgb(202 207 213 / 44%) inset;
	max-width:230px;
	width:100%;
	background:#fff;
	background:var(--white_default);
	padding:10px;
	border-radius:10px;
	margin:auto;
	transform-origin:bottom;
	transition:.5s ease-out
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .page .title {
	height:54px;
	margin-bottom:3px;
	margin-top:2px;
	margin-left:2px;
	display:flex;
	flex-direction:column;
	justify-content:center
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .page .title .type {
	color:#657487;
	color:rgb(202 207 213 / 44%);
	font-size:16px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .page .title .type i {
	margin-right:6px;
	vertical-align:-.15em
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .page .title .type .post-type span:not(.post_meta_number) {
	margin-right:15px;
	cursor:default
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .page .title .type .post-type .reads {
	color:#67c23a
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .page .title .type .post-type .likes {
	color:#ff4949
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .page .title .type .post-type .comments {
	color:#20a0ff;
	color:var(--primary_default)
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .page .title .post {
	color:#8492a6;
	color:rgb(202 207 213 / 44%);
	display:none;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .page .img {
	display:block;
	padding-top:89.453125%;
	background-size:cover;
	background-repeat:no-repeat;
	background-position:50%;
	border-radius:6px;
	box-shadow:0 3px 6px rgba(31,45,61,.3);
	box-shadow:0 3px 6px var(--gray_opacity_3);
	transition:.3s
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .page .img[href] {
	cursor:pointer
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .page .collapseCards {
	display:none
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .future2 {
	z-index:1
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .future2 .page {
	transform:scale(.7) translateY(-140px);
	opacity:0
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .future1 {
	z-index:2
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .future1 .page {
	transform:scale(.8) translateY(-88px);
	opacity:.15
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .future0 {
	z-index:3
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .future0 .page {
	transform:scale(.9) translateY(-40px);
	opacity:.3
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .current {
	z-index:4;
	perspective:800px
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .current .page {
	position:relative;
	box-shadow:0 13px 20px rgba(31,45,61,.2),inset 0 0 0 1px hsla(0,0%,100%,.1);
	box-shadow:0 13px 20px var(--gray_opacity_2),0 0 0 1px hsla(0,0%,100%,.1) inset;
	transition:all .5s ease-out,opacity .25s
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .current .page .img {
	transition:.3s
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .current .page:not([disable-expand]):hover .img {
	transform:translateY(-58px)
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .current .page .collapseCards {
	display:block;
	visibility:hidden;
	position:absolute;
	bottom:18px;
	text-align:center;
	left:50px;
	right:50px;
	cursor:pointer;
	line-height:30px;
	border:1px solid;
	border-radius:100px;
	opacity:0;
	transition:all .25s,bottom 0s ease .25s
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .current .page .collapseCards:hover {
	left:35px;
	right:35px
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .current .page:hover .collapseCards {
	bottom:19px;
	opacity:1;
	visibility:visible;
	transition:bottom .3s ease .25s,opacity .3s ease .25s,left .25s,right .25s
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .past0 {
	z-index:5;
	perspective:800px;
	visibility:hidden
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .past0 .page {
	transform-origin:bottom;
	transform:rotateX(-74.7deg);
	opacity:0;
	visibility:hidden;
	transition:all .5s,opacity .3s ease-out .2s
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .past1,#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .past2 {
	display:none
}
#cardFlip .meta-wrapper {
	height:330px;
	display:flex;
	align-items:center
}
#cardFlip .meta-wrapper .meta {
	position:relative;
	z-index:1;
	color:#fff;
	width:100%;
	will-change:margin-left;
	transition:.25s
}
#cardFlip .meta-wrapper .meta.is-disappearing {
	transform:translateX(30px);
	opacity:0
}
#cardFlip .meta-wrapper .meta.is-showing {
	transform:translateX(-30px);
	opacity:0;
	transition:0s
}
#cardFlip .meta-wrapper .meta .title {
	font-size:28px;
	max-height:80px;
	overflow:hidden;
	text-shadow:0 4px 5px rgba(31,45,61,.5);
	text-shadow:0 4px 5px var(--gray_opacity_5)
}
#cardFlip .meta-wrapper .meta .taxonomy {
	position:relative;
	padding-top:15px;
	text-shadow:0 2px 3px rgba(31,45,61,.5);
	text-shadow:0 2px 3px var(--gray_opacity_5);
	opacity:.6;
	max-height:55px;
	overflow:hidden
}
#cardFlip .meta-wrapper .meta .taxonomy:before {
	content:"";
	position:absolute;
	width:20px;
	height:1px;
	background:#fff;
	left:0;
	top:6px
}
#cardFlip .meta-wrapper .meta .taxonomy i {
	margin-right:6px;
	vertical-align:-.15em
}
#cardFlip .meta-wrapper .meta .goto {
	display:inline-block;
	padding:5px 10px 5px 15px;
	margin-top:15px;
	text-decoration:none;
	border-radius:100px;
	opacity:.6;
	color:#fff;
	border:1px solid #fff;
	transition:.25s
}
#cardFlip .meta-wrapper .meta .goto:hover {
	opacity:1;
	padding:5px 20px 5px 25px
}
#cardFlip .meta-wrapper .meta .goto i {
	vertical-align:bottom
}
#cardFlip .navigator {
	position:absolute;
	left:-15px;
	bottom: -250px;
	z-index:6
}
#cardFlip .navigator>div {
    transform: rotate(90deg); 
	display:block;
	width:30px;
	height:30px;
	background-image:linear-gradient(#fff,#eff2f7);
	background-image:linear-gradient(var(--white_default),rgb(202 207 213 / 44%));
	box-shadow:-5px 0 10px rgba(31,45,61,.1);
	box-shadow:-5px 0 10px #d8e0ea;
	border-radius:50%;
	text-align:center;
	line-height:30px;
	font-size:16px;
	margin-top:8px;
	cursor:pointer
}
#cardFlip .navigator>div i {
	display:block;
	transition:.5s;
	
}
#cardFlip .navigator .collapseCards {
	transform:scale(0);
	visibility:hidden;
	transition:.25s
}
#cardFlip .background>* {
	height:0;
	transition:1s
}
#cardFlip .background>* .head-img {
	height:330px;
	border-radius:0 0 12px 12px;
	overflow:hidden
}
#cardFlip .background>* .head-img .img {
	background-size:cover;
	background-position:0;
	height:330px;
	opacity:.9
}
#cardFlip .background>* .head-img.use-cover-img .img {
	filter:blur(10px);
	transform:scale(1.08);
	opacity:.3
}
#cardFlip .background .default-background {
	visibility:hidden;
	opacity:0
}
#cardFlip .background .default-background .head-img {
	background:url(/) 0/cover,linear-gradient(45deg,#0073c9,#03b1ff);
	background:url(/) 0/cover,linear-gradient(45deg,rgb(202 207 213 / 44%),var(--analogous_dark_1));
	background-blend-mode:overlay;
}
#cardFlip .background .is-disappearing {
	opacity:0;
	visibility:hidden
}
#cardFlip .background .canvas-wrapper {
	position:relative;
	z-index:1;
	mix-blend-mode:overlay
}
#cardFlip .background .canvas-wrapper .canvas {
	height:330px
}
@media (min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px),(min-width:1200px) and (max-width:1509px),(min-width:1510px) {
	.top-nav.always-stay+#main #cardFlip .meta-wrapper .meta {
	margin-top:50px
}
#cardFlip.expand .slider-wrapper {
	width:32%;
	padding:0;
	margin-left:2%
}
#cardFlip.expand .slider-wrapper .cardFlip-slider[init] .showBox .page {
	box-shadow:0 13px 20px rgba(31,45,61,.2);
	box-shadow:0 13px 20px var(--gray_opacity_2)
}
#cardFlip.expand .slider-wrapper .cardFlip-slider[init] .showBox .page .title .post {
	display:block
}
#cardFlip.expand .slider-wrapper .cardFlip-slider[init] .showBox .future2 {
	z-index:1;
	transform:none;
	margin-left:2%;
	margin-right:2%
}
#cardFlip.expand .slider-wrapper .cardFlip-slider[init] .showBox .future2 .page {
	max-width:208px;
	transform:none;
	opacity:0
}
#cardFlip.expand .slider-wrapper .cardFlip-slider[init] .showBox .future1 {
	z-index:2;
	transform:none;
	margin-left:2%;
	margin-right:2%
}
#cardFlip.expand .slider-wrapper .cardFlip-slider[init] .showBox .future1 .page {
	max-width:230px;
	transform:none;
	opacity:1
}
#cardFlip.expand .slider-wrapper .cardFlip-slider[init] .showBox .future0 {
	z-index:3;
	margin-left:102%;
	margin-right:-98%;
	transform:none
}
#cardFlip.expand .slider-wrapper .cardFlip-slider[init] .showBox .future0 .page {
	max-width:230px;
	transform:none;
	opacity:1
}
#cardFlip.expand .slider-wrapper .cardFlip-slider[init] .showBox .current {
	z-index:4;
	margin-left:202%;
	margin-right:-198%;
	transform:none
}
#cardFlip.expand .slider-wrapper .cardFlip-slider[init] .showBox .current .page {
	box-shadow:0 13px 20px rgba(31,45,61,.2);
	box-shadow:0 13px 20px var(--gray_opacity_2);
	transition:all .5s ease-out
}
#cardFlip.expand .slider-wrapper .cardFlip-slider[init] .showBox .current .page:hover .img {
	transform:none
}
#cardFlip.expand .slider-wrapper .cardFlip-slider[init] .showBox .current .page .collapseCards {
	display:none
}
#cardFlip.expand .slider-wrapper .cardFlip-slider[init] .showBox .past0 {
	z-index:1;
	transform:none;
	margin-left:202%;
	margin-right:-198%
}
#cardFlip.expand .slider-wrapper .cardFlip-slider[init] .showBox .past0 .page {
	transform:none;
	opacity:0;
	transition:all .5s ease-out
}
#cardFlip.expand .meta-wrapper {
	display:none
}
#cardFlip.expand .navigator .next i,#cardFlip.expand .navigator .prev i {
	transform:rotate(-90deg)
}
#cardFlip.expand .navigator .collapseCards {
	transform:scale(1);
	visibility:visible
}
#cardFlip.expand .background .default-background {
	visibility:visible;
	opacity:1
}
}@media (min-width:992px) and (max-width:1199px) {
	#cardFlip.expand .slider-wrapper .cardFlip-slider[init] .showBox {
	margin-top:96px
}
}
@media (max-width:479px),(min-width:480px) and (max-width:767px),(min-width:768px) and (max-width:991px) {
	#cardFlip .meta-wrapper .meta {
	margin-top:50px
}
#cardFlip.expand .slider-wrapper .cardFlip-slider[init] .showBox {
	margin-top:88px
}
}@media (max-width:479px),(min-width:480px) and (max-width:767px) {
	.cardFlip-outer {
	margin:0 -15px 40px
}
#cardFlip .slider-wrapper {
	padding-top:.1px
}
#cardFlip {
	margin:-34px;
	box-shadow:none!important
}
#cardFlip,#cardFlip .background .head-img {
	border-radius:0
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .current .page:hover .img {
	transform:none!important
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .current .page:hover .collapseCards {
	visibility:hidden
}
#cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .page .title .post {
	display:block
}
#cardFlip .navigator {
	left:0;
	bottom:35%;
	width:100%;
	height:0
}
#cardFlip .navigator .prev {
	left:6px;
	animation:navigator_prev_ani 1s linear infinite
}
#cardFlip .navigator .next {
	right:25px;
	animation:navigator_prev_ani 1s linear infinite reverse
}
#cardFlip .navigator .next,#cardFlip .navigator .prev {
	position:absolute;
	bottom:0;
	background-image:none;
	background:transparent;
	box-shadow:none
}
#cardFlip .navigator i {
	
	color:#fff !important;
	font-size:20px
}}

@keyframes navigator_prev_ani {
	0% {
	transform:translateX(20px);
	opacity:0
}
50% {
	transform:translateX(10px);
	opacity:.4
}
to {
	transform:translateX(0);
	opacity:0
}
}#wrapper.low-performance-mac.low-performance-safari #cardFlip .navigator>div {
	background:#fff;
	background:var(--white_default)
}
.is-safari #cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .current .page:hover .img {
	transform:none!important
}
.is-safari #cardFlip .slider-wrapper .cardFlip-slider[init] .showBox .current .page:hover .collapseCards {
	visibility:hidden
}
.is-safari #cardFlip .background .current {
	opacity:1;
	animation:cardFlip_current_opacity_bling_for_safari_bug 1s infinite
}
@keyframes cardFlip_current_opacity_bling_for_safari_bug {
	0% {
	opacity:.99
}
50% {
	opacity:1
}
to {
	opacity:.99
}
}[data-color-scheme=dark] #cardFlip .navigator>div {
	background:rgba(31,45,61,.2);
	background:var(--gray_opacity_2);
	box-shadow:inset 0 0 0 1px hsla(0,0%,100%,.1)
}

.gallery.carousel .item img {
    min-width: calc(100% - 10px);
    min-height: calc(100% - 10px);
    box-shadow: 0 10px 13px rgba(31,45,62,.35);
    border-radius: 4px;
}






/** 鼠标样式 开始**/
/** 普通指针样式**/
body {
cursor: url(../imgs/S1.cur), default;
}
/** 链接指针样式**/
a:hover{cursor:url(../imgs/S2.cur), pointer;}
/** 鼠标样式 结束**/

/* 这段必须有 */
.iconfont{
  font-family:"iconfont" !important;
  font-style:normal;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-width: 0.2px;
  -moz-osx-font-smoothing: grayscale;
}	




.modular-title-3 .section-title {
    font-size: 14px;
    letter-spacing: .8px;
    margin-bottom: 50px;
    position: relative;
}

.modular-title-3 .section-title:after {
    background-color: #6c757d;
    bottom: -15px;
    content: "";
    height: 3px;
    left: 0;
    position: absolute;
    width: 20px;
}



/*catbox-carousel*/
.catbox-carousel {
    position: relative;
}

.catbox-carousel .catbox-bg {
    height: 240px;
    border-radius: 4px;
    overflow: hidden;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50%;
}

.catbox-carousel .catbox-block {
    bottom: 0;
    left: 0;
    outline: none;
    position: absolute;
    right: 0;
    top: 0;
    border-radius: 4px;
  
}

.catbox-carousel .catbox-bg:hover .catbox-block {
    opacity: 0.8;
}

.catbox-carousel .catbox-content {
    position: absolute;
    bottom: 10px;
    width: 100%;
    left: 0;
    padding: 10px 20px;
}

.catbox-carousel .catbox-content p {
    line-height: 1.2;
    color: #ffffff;
    font-size: 12px;
    word-break: break-all;
    opacity: 0.6;
}

.catbox-carousel .catbox-title {
    width: 100%;
    font-size: 16px;
    font-weight: 500;
    color: #eaebf4;
    line-height: 26px;
    margin: 0;
}










.post-card-nested-col1 {
	position: relative;
	z-index: 1;
 
	display: inline-block;
	vertical-align: bottom;

    margin-right: 2.8%;
	transition: .25s;

	opacity: 0;
    width: 21.8%;

}

.post-card-nested-col1 .post-card.is-nested .title span {
	white-space: normal
}

.post-card-nested-col1:first-child {
	
}



.post-card-nested-col1:nth-last-child(n+2) .post-card.is-nested:before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	border-radius: 10px;
	 /*background-image: linear-gradient(90deg,rgba(31,45,61,0) 50%,rgba(31,45,61,.1));
	background-image: linear-gradient(90deg,var(--gray_opacity_0) 50%,#d8e0ea);*/
	z-index: 2;
	transition: .25s;

}

.post-card-nested-col1:hover {
	transform: translateY(-15px)
}

.post-card-nested-col1:hover .post-card.is-nested {

	box-shadow: 0 10px 15px #d8e0ea,0 0 0 1px rgb(202 207 213 / 44%) inset 
}

.post-card-nested-col1:hover .post-card.is-nested:before {
	visibility: hidden;
	opacity: 0
}

.post-card-nested-col1:hover .post-card.is-nested .title span {
	color: #657487;
}

.post-card-nested-col1:hover~.post-card-nested-col {
	transform: translateX(118px)
}





/* REV */

.pandastudio-custom-icons-cart:before {
	content:"\ea01"
}
.pandastudio-custom-icons-store:before {
	content:"\ea02"
}



body.night .product-card-wrapper .card {background:linear-gradient(to right,#334055,#3f4e69);
    
	box-shadow:0 6px 6px rgba(29, 140, 224, .1), 0 10px 10px rgb(0 0 0 / 20%), 0 -1px 2px rgba(255, 255, 255, .5) inset;}
	
.product-card-wrapper .card {
	background:linear-gradient(hsl(213, 40%, 97%) calc(100% - 2em), hsl(213, 40%, 93%));
	box-shadow:0 6px 6px rgba(29, 140, 224, .1), 0 10px 10px rgb(0 0 0 / 20%), 0 -1px 2px rgba(255, 255, 255, .5) inset;
	border-radius:8px;
	position:relative;
	z-index:1;
	padding:2px 0;
	transition:.25s;
	

}
.product-card-wrapper .card .badage {
	position:absolute;
	right:0;
	bottom:0;
	z-index:1
}
.product-card-wrapper .card .badage>div {
	display:inline-block;
	position:relative;
	margin:0 -6px 8px 0;
	filter:drop-shadow(-5px 5px 3px rgba(126,129,132,.3))
}
.product-card-wrapper .card .badage>div:before {
	content:"";
	display:block;
	position:absolute;
	right:0;
	top:-6px;
	border-color:transparent transparent #7d8185 #7d8185;
	border-style:solid;
	border-width:3px;
	transform-origin:bottom;
	transform:scaleY(.75)
}
.product-card-wrapper .card .badage>div:after {
	content:"";
	display:block;
	border-color:transparent #7e8184 #7e8184 transparent;
	border-style:solid;
	border-width:16px 5px;
	position:absolute;
	top:0;
	left:-10px
}
.product-card-wrapper .card .badage>div>.content {
	display:inline-block;
	margin:0;
	color:#fff;
	background:linear-gradient(90deg,#7e8184,#9ca3a9 calc(100% - 6px),#bcc0c4);
	font-size:14px;
	line-height:32px;
	height:32px;
	padding:0 18px 0 10px;
	border-bottom-right-radius:5px
}
.product-card-wrapper .card .badage>div.red {
	filter:drop-shadow(-5px 5px 3px rgba(255,73,73,.3))
}
.product-card-wrapper .card .badage>div.red:before {
	border-left-color:#ca1f1e;
	border-bottom-color:#ca1f1e
}
.product-card-wrapper .card .badage>div.red:after {
	border-right-color:#ff4949;
	border-bottom-color:#ff4949
}
.product-card-wrapper .card .badage>div.red>.content {
	background:linear-gradient(90deg,#ff4949,#ff7849 calc(100% - 6px),#ffb350)
}
.product-card-wrapper .card .badage>div.green {
	filter:drop-shadow(-5px 5px 3px rgba(86,175,51,.3))
}
.product-card-wrapper .card .badage>div.green:before {
	border-left-color:#5ea636;
	border-bottom-color:#5ea636
}
.product-card-wrapper .card .badage>div.green:after {
	border-right-color:#5ea636;
	border-bottom-color:#5ea636
}
.product-card-wrapper .card .badage>div.green>.content {
	background:linear-gradient(90deg,#5ea636,#97c22d calc(100% - 6px),#bcd540)
}
.product-card-wrapper .card .badage>div.yellow {
	filter:drop-shadow(-5px 5px 3px rgba(238,118,28,.3))
}
.product-card-wrapper .card .badage>div.yellow:before {
	border-left-color:#ff7800;
	border-bottom-color:#ff7800
}
.product-card-wrapper .card .badage>div.yellow:after {
	border-right-color:#ff7800;
	border-bottom-color:#ff7800
}
.product-card-wrapper .card .badage>div.yellow>.content {
	background:linear-gradient(90deg,#ff7800,#f18c1a calc(100% - 6px),#f5c01b)
}
.product-card-wrapper .card .badage>div.blue {
	filter:drop-shadow(-5px 5px 3px rgba(39,145,255,.3))
}
.product-card-wrapper .card .badage>div.blue:before {
	border-left-color:#2791ff;
	border-bottom-color:#2791ff
}
.product-card-wrapper .card .badage>div.blue:after {
	border-right-color:#2791ff;
	border-bottom-color:#2791ff
}
.product-card-wrapper .card .badage>div.blue>.content {
	background:linear-gradient(90deg,#2791ff,#40acff calc(100% - 6px),#78deff)
}
.product-card-wrapper .card .product_thumbnail {
	    width: 100px;
    height: 89px;
    background-position: 50%;
    background-size: cover;
    border-radius: 6px;
    box-shadow: 0 0 0 3px #fff, -10px 0 15px 3px rgba(31,45,61,.1);
    box-shadow: 0 0 0 3px rgb(202 207 213 / 44%),-3px 0 7px 3px var(--gray_opacity_3);
    margin: 13px 0 13px -8px;
    float: left;
}

body.night  .product-card-wrapper .card .title {color:#d0d8e3;}
.product-card-wrapper .card .title {
	float:left;
	width:100%;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	font-size:18px;
	margin:15px 0 8px 15px;
	font-weight:700;
	color:#475669;
}
.product-card-wrapper .card .description {
	float:left;
	width:calc(100% - 120px);
	margin-left:13px;
	line-height:1.5em;
	height:4.5em;
	overflow:hidden;
	position:relative;
	 font-size: 16px; /* 默认字体大小 */
    font-weight: 400; /* 默认字体粗细 */
}
.product-card-wrapper .card .description:after {
	content:"";
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	height:1.75em;
	background:linear-gradient(hsla(0,0%,100%,.5),#fff 90%);
	background:linear-gradient(var(--white_opacity_5),var(--white_default) 90%)
}
.product-card-wrapper .slide {
	height:44px;
	background:#ff7800;
	box-shadow:0 8px 15px rgba(255,120,0,.4),inset 0 0 0 1px rgba(0,0,0,.15),inset 0 0 0 2px hsla(0,0%,100%,.3);
	overflow:hidden;
	margin:-2px 8px 0;
	border-radius:0 0 6px 6px;
	transform:translateY(-60px);
	opacity:0;
	visibility:hidden;
	transition:.35s
}
.product-card-wrapper .slide .price {
	float:left;
	color:#fff;
	margin:8px 0 0 15px
}
.product-card-wrapper .slide .price .price_unit {
	display:inline-block;
	font-size:14px;
	margin-left:3px
}
.product-card-wrapper .slide .price .price_value {
	display:inline-block;
	font-size:20px;
	font-weight:700
}
.product-card-wrapper .slide .buy {
	display:block;
	float:right;
	background:hsla(0,0%,100%,.2);
	border-radius:99px;
	color:#fff;
	line-height:28px;
	font-size:14px;
	padding:0 16px;
	margin:8px 15px 0 0;
	transition:.25s;
	font-weight:700
}
.product-card-wrapper .slide .buy i {
	margin-right:4px;
	vertical-align:-.12em;
	font-weight:400
}
.product-card-wrapper .slide .buy:hover {
	background:#fff;
	color:#ff7800
}
@keyframes buy_heartbeat_animation {
	0% {
	transform:scale(1)
}
50% {
	transform:scale(1.2)
}
to {
	transform:scale(1)
}
}.product-card-wrapper:hover {
	cursor:default
}
.product-card-wrapper:hover .card {
	/* 按压状态 */
  transform: 
    translateY(4px) 
    scale(0.98) 
    rotateX(5deg);
  box-shadow: 
    0 2px 4px rgba(0, 0, 0, 0.1),
    inset 0 -1px 3px rgba(0, 0, 0, 0.1),
    inset 0 1px 1px rgba(255, 255, 255, 0.6); 
}
.product-card-wrapper:hover .slide {
	transform:translateY(0);
	opacity:1;
	visibility:visible
}
.product-card-wrapper:hover .slide .buy {
	animation:buy_heartbeat_animation .8s infinite
}
@media (max-width:479px),(min-width:480px) and (max-width:767px) {
	.product-card-wrapper .card {
	box-shadow:0 10px 10px rgba(31,45,61,.2),inset 0 0 0 1px hsla(0,0%,100%,.06);
	box-shadow:0 7px 10px #d8e0ea,0 0 0 1px rgb(202 207 213 / 44%) inset
}
.product-card-wrapper .slide {
	transform:translateY(0);
	opacity:1;
	visibility:visible
}
.product-card-wrapper .slide .buy {
	animation:buy_heartbeat_animation .8s infinite
}
}.cardFlip-outer.cardFlip-background+.categoryNav {
	margin-top:-15px
}
















/* REV模块 */
.col-xxs-1,.col-xxs-2,.col-xxs-3,.col-xxs-4,.col-xxs-5,.col-xxs-6,.col-xxs-7,.col-xxs-8,.col-xxs-9,.col-xxs-10,.col-xxs-11,.col-xxs-12 {
	min-height: 1px;
	padding-left: 15px;
	padding-right: 15px;
	position: relative
}

@media (max-width:479px) {
	.col-xxs-1,.col-xxs-2,.col-xxs-3,.col-xxs-4,.col-xxs-5,.col-xxs-6,.col-xxs-7,.col-xxs-8,.col-xxs-9,.col-xxs-10,.col-xxs-11,.col-xxs-12 {
		float: left
	}

	.col-xxs-12 {
		width: 100%
	}

	.col-xxs-11 {
		width: 91.66666667%
	}

	.col-xxs-10 {
		width: 83.33333333%
	}

	.col-xxs-9 {
		width: 75%
	}

	.col-xxs-8 {
		width: 66.66666667%
	}

	.col-xxs-7 {
		width: 58.33333333%
	}

	.col-xxs-6 {
		width: 50%
	}

	.col-xxs-5 {
		width: 41.66666667%
	}

	.col-xxs-4 {
		width: 33.33333333%
	}

	.col-xxs-3 {
		width: 25%
	}

	.col-xxs-2 {
		width: 16.66666667%
	}

	.col-xxs-1 {
		width: 8.33333333%
	}

	.col-xxs-pull-12 {
		right: 100%
	}

	.col-xxs-pull-11 {
		right: 91.66666667%
	}

	.col-xxs-pull-10 {
		right: 83.33333333%
	}

	.col-xxs-pull-9 {
		right: 75%
	}

	.col-xxs-pull-8 {
		right: 66.66666667%
	}

	.col-xxs-pull-7 {
		right: 58.33333333%
	}

	.col-xxs-pull-6 {
		right: 50%
	}

	.col-xxs-pull-5 {
		right: 41.66666667%
	}

	.col-xxs-pull-4 {
		right: 33.33333333%
	}

	.col-xxs-pull-3 {
		right: 25%
	}

	.col-xxs-pull-2 {
		right: 16.66666667%
	}

	.col-xxs-pull-1 {
		right: 8.33333333%
	}

	.col-xxs-pull-0 {
		right: auto
	}

	.col-xxs-push-12 {
		left: 100%
	}

	.col-xxs-push-11 {
		left: 91.66666667%
	}

	.col-xxs-push-10 {
		left: 83.33333333%
	}

	.col-xxs-push-9 {
		left: 75%
	}

	.col-xxs-push-8 {
		left: 66.66666667%
	}

	.col-xxs-push-7 {
		left: 58.33333333%
	}

	.col-xxs-push-6 {
		left: 50%
	}

	.col-xxs-push-5 {
		left: 41.66666667%
	}

	.col-xxs-push-4 {
		left: 33.33333333%
	}

	.col-xxs-push-3 {
		left: 25%
	}

	.col-xxs-push-2 {
		left: 16.66666667%
	}

	.col-xxs-push-1 {
		left: 8.33333333%
	}

	.col-xxs-push-0 {
		left: auto
	}

	.col-xxs-offset-12 {
		margin-left: 100%
	}

	.col-xxs-offset-11 {
		margin-left: 91.66666667%
	}

	.col-xxs-offset-10 {
		margin-left: 83.33333333%
	}

	.col-xxs-offset-9 {
		margin-left: 75%
	}

	.col-xxs-offset-8 {
		margin-left: 66.66666667%
	}

	.col-xxs-offset-7 {
		margin-left: 58.33333333%
	}

	.col-xxs-offset-6 {
		margin-left: 50%
	}

	.col-xxs-offset-5 {
		margin-left: 41.66666667%
	}

	.col-xxs-offset-4 {
		margin-left: 33.33333333%
	}

	.col-xxs-offset-3 {
		margin-left: 25%
	}

	.col-xxs-offset-2 {
		margin-left: 16.66666667%
	}

	.col-xxs-offset-1 {
		margin-left: 8.33333333%
	}

	.col-xxs-offset-0 {
		margin-left: 0
	}
}







.post-card-col:hover {
	position: relative;
	z-index: 1
}




.product-card-wrapper{margin-bottom:20px;}

@media (min-width: 1200px)
{.product-card-wrapper1 {
      float: left !important;
     margin-right: 5%;
width:20%;}
    
    
    .product-card-wrapper {
      float: left !important;
          margin-left: 8%;
       margin:20px auto;

       	 margin-bottom: -0.5%;
width:25%;}
    
}


body.night .post-card {
	background: linear-gradient(to right,#334055,#3f4e69);

	-webkit-box-shadow:0 6px 6px #162029, 0 10px 10px #36434d, 0 -1px 2px #2b333f inset;


	
}

		
.post-card {
    background: linear-gradient(hsl(213, 40%, 97%) calc(100% - 2em), hsl(213, 40%, 93%));
    -webkit-box-shadow: 0 6px 6px rgba(29, 140, 224, .1), 0 10px 10px rgb(0 0 0 / 20%), 0 -1px 2px #d8e0ea inset;
    border-radius: 10px;
    padding: 0 8px 8px;
    perspective: 650px;
    position: relative;
    z-index: 0;
    margin: 0 0 3em;
    margin-bottom: 17%;
    /* margin-left: 8%; */
    /* margin-right: 3%; */
	transition: background .25s;
			
	/*width: 110% ;*/

	
}











@media (min-width:480px) and (max-width:546px) {
    .postLists.hfg .card .meta{
        padding: 0;
        height: 62%;
    }
}


.post-card svg.award-badage {
	position: absolute;
	right: -18px;
	top: -12px
}

.post-card .title {
	font-size: 15px;
	line-height: 1.15em;
	height: 66px;
	display: flex;
	justify-content: center;
	flex-direction: column;
}
body.night .post-card .title span {color: #f0f2f7;}
.post-card .title span {
	margin-top: 5px;
	display: block;
	line-height: 1.3em;
	max-height: 2.8em;
	overflow: hidden;
	color: #657487;
	margin-left: -8px;
	padding: 2px 8px;
	border-left: 2px solid var(--post-card-accent, rgb(202 207 213 / 44%));
	-webkit-line-clamp: 2;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	transition: .35s;

overflow: hidden;
}

@media (max-width:479px),(min-width:480px) and (max-width:767px) {
	.post-card .title span {
		font-size: 14px
	}
}

.post-card .post-thumbnail-wrapper {
	display: block;
	padding-bottom: 89.453125%;
	position: relative;
	overflow: hidden;
	border-radius: 6px;

	transform-origin: top;
	box-shadow: 0 6px 6px rgba(29, 140, 224, .1), 0 4px 2px rgb(0 0 0 / 20%), 0 -1px 2px #d8e0ea inset !important;
	transition: transform .35s,background-color .1s ease .25s
}

.post-card .post-thumbnail-wrapper img {
	position: absolute;
	width: 100%;
	height: 100%;
	-o-object-fit: cover !important;
	object-fit: cover;
	transition: .35s
}

.post-card:hover .post-thumbnail-wrapper {
	background-color: rgb(202 207 213 / 44%);
	transition: transform .5s cubic-bezier(.3,1.5,.5,1),background-color .1s
}


	.post-card:hover .post-thumbnail-wrapper {
		transform: translateY(-51px) rotateX(47px)
	}

@media (min-width:1510px) {
	.post-card:hover .post-thumbnail-wrapper {
		transform: translateY(-51px) rotateX(47deg)
	}
	

	
}

@media (min-width:1200px) and (max-width:1509px) {
	.post-card:hover .post-thumbnail-wrapper {
		transform: translateY(-51px) rotateX(47deg)
	}
}

@media (min-width:992px) and (max-width:1199px) {
	.post-card:hover .post-thumbnail-wrapper {
		transform: translateY(-51px) rotateX(46deg)
	}
}

@media (min-width:768px) and (max-width:991px) {
	.post-card:hover .post-thumbnail-wrapper {
		transform: translateY(-51px) rotateX(44deg)
	}
}

@media (min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px),(min-width:1200px) and (max-width:1509px),(min-width:1510px) {
	.post-card:hover .post-thumbnail-wrapper img {
		transform: translateY(-51px) rotateX(46px)
	}
}



@media (min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px),(min-width:1200px) and (max-width:1509px),(min-width:1510px) {
	#wrapper.low-performance-safari .post-card:hover .post-thumbnail-wrapper img {
		transform: translateY(-51px) rotateX(46px)
	}
}

@media (min-width:100px) and (max-width:767px) {
	.post-card:hover .post-thumbnail-wrapper {
		transform: translateY(-51px) rotateX(44deg)
	}
}

.post-card .metas {
	z-index: -1;
	position: absolute;
	bottom: 0;
	left: 15px;
	right: 15px;

	text-align: center;
	font-size: 12px;
	visibility: hidden;
	opacity: 0;
	transform: scale(.9);
	transition: .25s;
	color: #8492a6;
}



.post-card .metas .info {
	margin-top: 5px;
	font-size: 12px
}

.post-card .metas .info span {
	margin: 0 3px
}

.post-card .metas .info span i {
	margin-right: 3px
}

.post-card .metas .info span.reads {
	color: #67c23a
}

.post-card .metas .info span.likes {
	color: #ff4949
}

.post-card .metas .info span.likes i {
	vertical-align: -1px
}

.post-card .metas .info span.comments {
	color: #20a0ff;
	color: var(--primary_default)
}

.post-card .metas .info span.comments i {
	vertical-align: -2px
}

.post-card .metas .read-more {
	margin-top: 8px;
	font-size: 14px;
	display: inline-block;
	padding: 7px 15px;
	min-width: 60%;
	color: #fff;
	background-image: linear-gradient(90deg,#20a0ff,#3dc3ff);
	background-image: linear-gradient(90deg,var(--primary_default),var(--analogous_light_1));
	box-shadow: 0 6px 6px rgba(32,160,255,.3);
	box-shadow: 0 6px 6px var(--primary_opacity_3);
	border-radius: 100px;
	transition: .25s
}

.post-card .metas .read-more:hover {
	min-width: 75%
}

.post-card:hover .metas {
	visibility: visible;
	opacity: 1;
	transform: translateY(-15px) scale(1);
	transition: .4s ease .1s
}

.post-card-nested-col {
	position: relative;
	z-index: 1;
 
	display: inline-block;
	vertical-align: bottom;
	width: var(--nir-book-card-w, 195px) !important;
	margin-left: var(--nir-book-overlap, -103px);
	padding-left: 0;

	transition: .25s;
  
	opacity: 0;
   

}

.post-card-nested-col .post-card.is-nested .title span {
	white-space: normal
}

/**.post-card-nested-col:first-child {
	margin-left: 15px
}**/

.post-card-nested-col:nth-child(n+2) .post-card.is-nested {
	/*box-shadow: -5px 5px 15px rgba(31,45,61,.2),inset 0 0 0 1px hsla(0,0%,100%,.06);
	box-shadow: -5px 5px 15px var(--gray_opacity_2),0 0 0 1px hsla(0,0%,100%,.06) inset*/
}

.post-card-nested-col:nth-last-child(n+2) .post-card.is-nested:before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	border-radius: 10px;
	background-image: linear-gradient(90deg,rgba(31,45,61,0) 50%,rgba(31,45,61,.1));
	background-image: linear-gradient(90deg,var(--gray_opacity_0) 50%,#d8e0ea);
	z-index: 2;
	transition: .25s;

}

.post-card-nested-col:hover {
	transform: translateY(-15px)
}

.post-card-nested-col:hover .post-card.is-nested {

box-shadow: 0 10px 15px #3f4e69,0 0 0 1px rgb(202 207 213 / 44%) inset 
}

.post-card-nested-col:hover .post-card.is-nested:before {
	visibility: hidden;
	opacity: 0
}

body.night .post-card-nested-col:hover .post-card.is-nested .title span {
	color: #ffffff;

}
.post-card-nested-col:hover .post-card.is-nested .title span {
	color: #504747;

}
.post-card-nested-col:hover~.post-card-nested-col {
	transform: translateX(var(--nir-book-expand, 118px))
}

.post-card-nested-row {



	white-space: nowrap;
	-webkit-mask-image: linear-gradient(90deg,transparent,#000 15px,#000);
	mask-image: linear-gradient(90deg,transparent,#000 15px,#000)
}









@media (max-width: 479px) and (min-width: 220px){

    .post-card .metas .read-more{
        min-width: 80% !important;
    }
    .post-card .metas .read-more:hover{
        min-width: 90% !important;
    }
	.post-card-nested-col1 {
   position: relative;
    z-index: 1;
    display: inline-block;
    vertical-align: bottom;
    transition: .25s;
    opacity: 0;
    margin-right: 4%;
    margin-left: 2.5% !important;
    width: 42% !important;
}

}


@media (min-width:480px) and (max-width:767px) {
	.post-card-nested-row {
		margin: 0 -15px;
		-webkit-mask-image: none;
		mask-image: none
	}
	
	.post-card-nested-col1 {
    position: relative;
    z-index: 1;
    display: inline-block;
    vertical-align: bottom;
    margin-right: 1%;
    transition: .25s;
    opacity: 0;
    margin-right: 3.1% !important;
    width: 46% !important;
        transform: scale(0.9);
}
	
	
}

@media (min-width:768px) and (max-width:991px) {
	.post-card-nested-row {
		margin: 0 calc(360px - 50vw);
		-webkit-mask-image: none;
		mask-image: none
	}
	
	
.post-card-nested-col1 {
    position: relative;
    z-index: 1;
    display: inline-block;
    vertical-align: bottom;
    margin-right: 2%;
    transition: .25s;
    opacity: 0;
        margin-left: 2.1%;
    width: 20.7%;
}
	
}

@media (min-width:992px) and (max-width:1199px) {
	.post-card-nested-row {
		margin-right: calc(470px - 50vw)
	}
	
	.post-card-nested-col1 {
    position: relative;
    z-index: 1;
    display: inline-block;
    vertical-align: bottom;
    margin-right: 2%;
    transition: .25s;
    opacity: 0;
    width: 20.9%;
        margin-left: 2.1%;
}
	
}

@media (min-width:1200px) and (max-width:1509px) {
	.post-card-nested-row {
		margin-right: calc(570px - 50vw)
	}
	
		.post-card-nested-col1 {
    position: relative;
    z-index: 1;
    display: inline-block;
    vertical-align: bottom;
    margin-right: 4%;
    transition: .25s;
    opacity: 0;
    width: 20.9% !important;
   
}
	
	


	
}

@media (min-width:1510px) {

			.post-card-nested-row {
		margin-right: calc(725px - 50vw)
	}
	

}

.post-card-nested-row.native-scroll {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch
}

.post-card.is-nested {
	    margin-bottom: 20px;
    transition: .25s;
    margin-top: 20px;
    width: 100%;
    display: inline-block;
    float: left;
}




body.night .post-card.is-nested .title span {color: #d8e0ea;}
.post-card.is-nested .title span {
	color: #657487;
	transition: .25s
}

.post-card.is-nested .post-thumbnail-wrapper,.post-card.is-nested .post-thumbnail-wrapper img {
	transition: 0s
}

.post-card.is-nested:hover .post-thumbnail-wrapper {
	transform: none;
	background-color: transparent;
	transition: 0s
}

.post-card.is-nested:hover .post-thumbnail-wrapper img {
	opacity: 1
}

.post-card.is-nested .metas {
	display: none
}

#wrapper.low-performance-safari .post-card:hover .post-thumbnail-wrapper {
	background-color: unset
}



/* REV模块结束 */











/*vuedoc*/

.content[data-v-04c20494] {
	padding:20px 0
}
.content[data-v-71acd4b6] {
	padding:20px 0
}
.shelf[data-v-663caaa0] {
	display:flex;
	flex-wrap:wrap;
	justify-content:space-around;
}
.shelf-bar[data-v-663caaa0] {
	position:absolute;
	z-index:4;
	width:calc(100% + 40px);
	height:10px;
	border-radius:9px;
	box-shadow:0 1px rgb(202 207 213 / 44%) inset,0 10px 30px rgba(31,45,62,.65),0 1px 1px rgba(31,45,62,.15);
	border:1px solid rgb(202 207 213 / 44%);
	border-bottom:none;
	background:rgb(202 207 213 / 44%);
	margin:15px -20px 20px
}
.shelf-bar[data-v-663caaa0]:before {
	content:"";
	display:block;
	height:30px;
	width:100%;
	background:linear-gradient(rgb(202 207 213 / 44%),rgb(202 207 213 / 44%));
	transform:perspective(400px) rotateX(45deg);
	transform-origin:bottom;
	position:absolute;
	bottom:10px;
	border-radius:5px
}
.shelf-bar.isDark[data-v-663caaa0] {
	border:none;
	box-shadow:none;
	background:linear-gradient(#303235,#202225)
}
.shelf-bar.isDark[data-v-663caaa0]:before {
	background:linear-gradient(#15191f,#202225)
}
.post[data-v-663caaa0] {
	position:relative;
	z-index:1;
	width:100%;
	margin-bottom:30px;
	padding-left: 50px;
	height:100%;
	text-align:center;
	cursor:pointer;
	perspective:700px;
	transition:.25s
}
.post .book-face[data-v-663caaa0] {
	position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 0 5px 5px 0;
    background: radial-gradient(circle at top right,rgb(202 207 213 / 44%),rgba(255,255,255,0) 180px),linear-gradient(90deg,rgb(202 207 213 / 44%) 1px,rgb(202 207 213 / 44%) 4px,rgb(202 207 213 / 44%) 6px,rgb(202 207 213 / 44%) 7px,rgb(202 207 213 / 44%) 9px,rgb(202 207 213 / 44%));
    box-shadow: 0 1px rgb(202 207 213 / 44%) inset, 0 -1px rgb(202 207 213 / 44%) inset, -1px 0 rgb(202 207 213 / 44%) inset, 0 1px 2px rgba(31,45,61,.1), -160px 0 rgba(31,45,61,0) inset;
    text-align: center;
    cursor: pointer;
    transform-origin: left;
    z-index: 1;
    will-change: transform,box-shadow;
    transition: .35s;
}
.post .book-page0[data-v-663caaa0] {
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	top:0;
	background: rgb(202 207 213 / 44%);
    box-shadow: 0 -1px 1px rgba(31,45,61,.1), -10px 0 10px rgba(31,45,61,.1), 0 0 0 1px rgb(202 207 213 / 44%) inset;
	border-radius:0 5px 5px 0;
	z-index:0;
	transform-origin:bottom;
	transition:.25s;
	display:flex;
	padding:10px 0;
	text-align:right;
	flex-direction:column;
	justify-content:center;
	align-items:flex-end
}
.post .book-page1[data-v-663caaa0] {
	position:absolute;
	left:0;
	right:3px;
	bottom:2px;
	top:-2px;
	background:rgb(202 207 213 / 44%);
	border-radius:0 5px 5px 0;
	z-index:-1;
	transform-origin:bottom;
	box-shadow:0 -1px 2px rgba(31,45,61,.1);
	border-left:1px solid rgb(202 207 213 / 44%);
	transition:.25s
}
.post .title[data-v-663caaa0] {
	display:inline-block;
	position:relative;
	font-size:16px;
	margin-top:30px;
	margin-left:15px;
	margin-right:15px;
	transition:.25s
}
.post .title[data-v-663caaa0]:after {
	content:"";
	position:absolute;
	bottom:-3px;
	height:1px;
	left:0;
	right:0;
	background:currentColor;
	box-shadow:0 1px #fff,0 2px #fff;
	opacity:.2;
	transition:.25s
}
.post .title span[data-v-663caaa0] {
	max-height:4.2em;
	display:inline-block;
	overflow:hidden;
	color:var(--text-color-2)
}
.post .order[data-v-663caaa0] {
	margin-top:15px
}
.post .action[data-v-663caaa0] {
	color:var(--primary_opacity_9);
	font-size:16px;
	margin-right:30px;
	opacity:0;
	transition:.35s
}
.post .go-reading[data-v-663caaa0] {
	opacity:0;
	margin:15px 0;
	transition:.35s
}
.post .go-reading span[data-v-663caaa0] {
	color:var(--primary_opacity_9);
	margin-right:8px;
	vertical-align:middle
}
.post .enter[data-v-663caaa0] {
	background:var(--analogous_opacity_9);
	width:46px;
	height:46px;
	color:#fff;
	border-radius:50%;
	border:none;
	font-size:26px;
	transition:.5s;
	vertical-align:middle;
	animation:enterWaver-663caaa0 2s infinite;
	padding:0
}
.post .enter .n-icon[data-v-663caaa0] {
	display:flex;
	justify-content:center;
	align-items:center;
	margin:auto
}
@keyframes enterWaver-663caaa0 {
	0% {
	box-shadow:0 3px 5px var(--analogous_opacity_4),0 0 0 0 var(--analogous_opacity_5),0 0 0 -50px var(--analogous_opacity_6)
}
100% {
	box-shadow:0 3px 5px var(--analogous_opacity_4),0 0 0 25px transparent,0 0 0 35px transparent
}
}.post.isDark .book-face[data-v-663caaa0] {
	background:linear-gradient(90deg,#282828 1px,#444 4px,#1e1e1e 6px,#424242 7px,#202225 9px,#303235);
	box-shadow:0 0 0 1px rgba(255,255,255,.1) inset
}
.post.isDark .book-page0[data-v-663caaa0] {
	background:#202225;
	box-shadow:0 -1px 1px rgba(31,45,61,.1),-10px 0 10px rgba(31,45,61,.1),0 0 0 1px rgba(255,255,255,.1) inset
}
.post.isDark .book-page1[data-v-663caaa0] {
	background:#202225;
	border-left:1px solid #000
}
.post.isDark .title[data-v-663caaa0] {
	text-shadow:0 -1px #000,0 -2px 1px #000
}
.post.isDark .title[data-v-663caaa0]:after {
	box-shadow:0 -1px #000,0 -2px #000
}
.post:hover .book-face[data-v-663caaa0] {
	transform:rotateY(-57deg);
	box-shadow:0 1px rgba(255,255,255,.75) inset,0 -1px rgba(255,255,255,.1) inset,-1px 0 rgba(255,255,255,.5) inset,0 1px 2px rgba(31,45,61,.05),-360px 0 rgba(31,45,61,.2) inset,30px 20px 55px -10px rgba(31,45,61,.35),5px 0 0 -2px #c0ccda;
	transition:cubic-bezier(0,1.6,.5,1) .75s
}
.post:hover .action[data-v-663caaa0] {
	opacity:1;
	transform:translateX(15px)
}
.post:hover .go-reading[data-v-663caaa0] {
	opacity:1;
	transform:translateX(23px)
}
.post:hover.isDark .book-face[data-v-663caaa0] {
	box-shadow:0 0 0 1px rgba(255,255,255,.1) inset,5px 0 0 -2px #404245,30px 20px 55px -10px #000
}
.allow-presentation[data-v-663caaa0] {
	position:absolute;
	right:10px;
	bottom:10px;
	font-size:32px;
	color:var(--primary-opacity-2);
	text-shadow:0 1px rgba(255,255,255,.5);
	z-index:-1
}
.isDark .allow-presentation[data-v-663caaa0] {
	text-shadow:0 -1px rgba(0,0,0,.5)
}
.shelf-menu .n-menu-item .n-menu-item-content__icon .n-icon {
	opacity:.5;
	transition:opacity .4s
}
.shelf-menu .n-menu-item.n-menu-item--selected .n-menu-item-content__icon .n-icon,.shelf-menu .n-menu-item:hover .n-menu-item-content__icon .n-icon {
	opacity:1
}

body.night .post-iteme.carde .inner .info .likes i, 
body.night .post-iteme.carde .inner .info .comments i, 
body.night .post-iteme.carde .inner .info .views i, 
body.night .post-iteme.carde .inner .info .detail i {
    box-shadow: inset 0.3536rem 0.3536rem 0.625rem #34425a, 
               inset -0.1326rem -0.1326rem 0.25rem #00000096, 
               inset -0.3536rem -0.3536rem 0.625rem #00000085, 
               0.4419rem 0.4419rem 1rem #34425a;
}


body.night .chat_form .chat_input{
    background:linear-gradient(#28374a, #34425a) !important ;
    box-shadow:0 1px #7e8997, 0 2px 2px #000 inset !important;
    text-shadow: 0 1px #28374a;
}

body.night .chat_form{
    border-top: 1px solid #28374a !important;
   background: linear-gradient(#34425a,#34425a) !important;
   
}

body.night .chat_form button{background: linear-gradient(#28374a, #28374a) !important;
    text-shadow: 0 0px #f9fafc !important;
    box-shadow: 0 1px #3c4c61 inset, 0 1px #28374a !important;
    border: 1px solid #404f63 !important;}


@media (max-width: 344px) {
    .post-card .metas .info{
                  flex-wrap: nowrap;    /* 禁止换行 */
  white-space: nowrap;  /* 禁止文本换行 */
  overflow: hidden;     /* 隐藏超出部分 */
  text-overflow: ellipsis; /* 超出显示省略号（可选） */
    }
    .postLists.hfg .card .summary{
          flex-wrap: nowrap;    /* 禁止换行 */
  white-space: nowrap;  /* 禁止文本换行 */
  overflow: hidden;     /* 隐藏超出部分 */
  text-overflow: ellipsis; /* 超出显示省略号（可选） */
    }
    .postLists.hfg .card .cover[style*="background-image"]{
        padding-bottom:min(80.66%, 100%);
    }
    .postLists.hfg .card h2{
        margin:1em 0 0.5em;
    }
    .postLists.hfg .card .tags{
        margin:0;
        max-height:0.1em;
        opacity:0;
    }
    
    .postLists .card .summary span{padding-right: 5px;}
}

@media (max-width: 400px) {
    
     .text-bulge-error, .text-bulge-primary, .text-bulge-success{
        padding:0px 4px;
    }
    .post-card .metas .info span{
            margin:0 0px;}

    .post-card-col .pf_card1 .metas .meta-container .m-infos .infos{
  flex-wrap: nowrap;    /* 禁止换行 */
  white-space: nowrap;  /* 禁止文本换行 */
  overflow: hidden;     /* 隐藏超出部分 */
  text-overflow: ellipsis; /* 超出显示省略号（可选） */
    }
    
    .post-card .metas .info span{
        margin:0 1px;
    }
    
    .postLists.hfg .card .cover[style*="background-image"]{
        padding-bottom:min(70.66%, 100%);
    }
    
        .postLists .card .summary span{padding-right: 5px;}
  
}

@media (min-width: 1200px) and (max-width: 1300px) {
.postLists.hfg .card .cover[style*="background-image"]{
    padding-bottom:min(69.66%, 100%);
}
}

@media (min-width: 480px) and (max-width: 620px) {
    .text-bulge-error, .text-bulge-primary, .text-bulge-success{
        padding:0px 4px;
    }
    .post-card .metas .info span{
            margin:0 0px;}

    .post-card-col .pf_card1 .metas .meta-container .m-infos .infos{
  flex-wrap: nowrap;    /* 禁止换行 */
  white-space: nowrap;  /* 禁止文本换行 */
  overflow: hidden;     /* 隐藏超出部分 */
  text-overflow: ellipsis; /* 超出显示省略号（可选） */
    }
    .post-card-col .pf_card1 .metas .meta-container .m-title{
        padding:7px;
    }
    
    .postLists.hfg .card:hover .summary, .postLists.hfg .card:hover .tags{opacity:0 !important;margin:0 !important;}
    .postLists.hfg .card .tags{margin:0 !important;}
.postLists.hfg .card .cover[style*="background-image"]{
    padding-bottom:min(100%, 100%);
}

.postLists.hfg .card .tags{opacity: 0 !important;}
.postLists.hfg .card .summary{
    opacity:0 !important;
}
.postLists.hfg .card h2{
    padding:2px 8px;
    overflow:hidden;
}
}

































body.night .postLists.hfg .card .cover[style*="background-image"]{
    box-shadow: 1px 0 #28374a, -1px 0 #28374a, 0 1px #34425a;
}






html, body {
    overflow-x: hidden; /* 直接砍掉横向滚动条 */
    width: 100%;       /* 确保不超出视口宽度 */
    max-width: 100%;   /* 双重保险 */
}
.long-model-wrapper>.long-model:nth-child(odd){background:rgb(255 255 255 / 24%) !important;}
body.night .long-model-wrapper>.long-model:nth-child(odd){background:rgb(67 74 81 / 20%) !important}