:root {
    --mask: rgba(0, 0, 0, 0.3);
    --nt-box-white-start: #949494;
    --nt-box-white-end: #fff;
    --col-bg-start: var(--nt-box-white-start);
    --col-bg-end: var(--nt-box-white-end);
    --fd-a-white: hsla(0, 0%, 72%, .1);
    --frosted-bg: var(--fd-a-white);
}

/* ============================================================
   高级质感卡片 - 带加载动画 + 悬浮动画
============================================================ */
.article-card {
    overflow: hidden;
    /* 加载动画 */
    animation: cardFadeInUp 3s cubic-bezier(0.2, 0.9, 0.4, 1.1) forwards;
    opacity: 0;
    transform: scale(0) translateY(10px);
    /* 基础阴影 */
    cursor: pointer;
    border: 1px solid #646464;
}
.article-card:hover {
    box-shadow: -9px 8px 8px var(--col-bg-start), 1px -1px 27px var(--col-bg-end);
}

.article-title {
    color: #2c3e50 !important;
}
.article-excerpt {
    color: #2c3e50 !important;
    font-size: smaller;
}

/* 延迟加载 - 依次出现 */
.article-card.delay-1 { animation-delay: 0.05s; }
.article-card.delay-2 { animation-delay: 0.1s; }
.article-card.delay-3 { animation-delay: 0.15s; }
.article-card.delay-4 { animation-delay: 0.2s; }
.article-card.delay-5 { animation-delay: 0.25s; }
.article-card.delay-6 { animation-delay: 0.3s; }
.article-card.delay-7 { animation-delay: 0.35s; }
.article-card.delay-8 { animation-delay: 0.4s; }
.article-card.delay-9 { animation-delay: 0.45s; }
.article-card.delay-10 { animation-delay: 0.5s; }
.article-card.delay-11 { animation-delay: 0.55s; }
.article-card.delay-12 { animation-delay: 0.6s; }

.card-category-name, .card-tag-name {
    cursor: pointer;
    border: 1px solid #646464;
    padding-left: 8px;
    padding-right: 8px;
}
.card-category-name:hover, .card-tag-name:hover {
    border: none;
    box-shadow: 4px 4px 6px var(--col-bg-start), -1px -2px 6px var(--col-bg-end);
}

.index-card-category {
    color: #d69d0a;
}
.index-card-tag {
    color: #6ba2f8;
}