/*
 Theme Name: Sienna
 Theme URI: https://xinsenz.com
 Author: xinsenz
 Author URI: https://xinsenz.com
 Description: 单栏主题，卡片式，咖啡色配色；
 Version: 1.0
 License: GNU General Public License v2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain: Sienna
*/
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body {
    background-color: #f8f5f2;
    font-family: "Microsoft Yahei", system-ui, sans-serif;
    color: #333;
    line-height: 1.65;
    font-size: 14px;
    max-width: 880px;
    margin: 0 auto;
    padding: 12px 16px;
}
/* ========== 头部Banner ========== */
.site-header {
    background-color: #6B4F3A;
    background-image: linear-gradient(rgba(0,0,0,0.05), rgba(0,0,0,0.05)), url("./bg.jpg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    color: #ffffff;
    padding: 20px 24px;
    border-radius: 8px;
    margin-bottom: 12px;
}
.header-left h1 {
    font-size: 26px;
    font-weight: bold;
    color: #ffffff;
    line-height: 1.2;
    margin-bottom: 6px;
}
.header-left .desc {
    font-size: 13px;
    color: #ffffff;
    opacity: 0.92;
}
/* ========== 独立卡片导航栏 ========== */
.nav-card {
    background:#ffffff;
    border-radius:6px;
    padding:10px 14px;
    margin-bottom:12px;
    box-shadow: 0 2px 8px rgba(107, 79, 58, 0.12);
}
.nav-card > ul {
    list-style:none;
    padding:0;
    margin:0;
    display:flex;
    gap:20px;
    flex-wrap:wrap;
}
.nav-card > ul > li {
    list-style:none;
    padding:0;
    margin:0;
}
.nav-card > ul > li > a {
    color:#6B4F3A;
    text-decoration:none;
    font-size:14px;
    transition: color 0.2s ease;
}
.nav-card > ul > li > a:hover {
    color:#543c2b;
    text-decoration:underline;
}
/* ========== 文章列表卡片 ========== */
.post-item {
    background: #ffffff;
    border-radius: 6px;
    padding: 12px 14px;
    margin-bottom: 10px;
    transition: all 0.22s ease;
    transform: translateY(0);
    box-shadow: 0 1px 6px rgba(107, 79, 58, 0.10);
}
.post-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 14px rgba(107, 79, 58, 0.20);
}
/* 第一行头部：分类标签 和 标题‑时间同一行并排 */
.post-item-head {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin-bottom: 6px;
}
.post-cat-tag {
    background: #6B4F3A;
    color: #ffffff;
    padding: 2px 7px;
    border-radius: 4px;
    font-size: 12px;
    white-space: nowrap;
    flex-shrink: 0;
}
.post-cat-tag a {
    color: #ffffff;
    text-decoration: none;
}
.post-cat-tag a:hover {
    color: #ffffff;
    text-decoration: none;
}
.post-title-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 6px;
    flex: 1;
}
.post-title a {
    color: #6B4F3A;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;
}
.post-title a:hover {
    color:#543c2b;
}
.post-time {
    color: #777;
    font-size: 12px;
    white-space: nowrap;
    flex-shrink: 0;
}
/* 摘要：兄弟级，横跨卡片整宽度，文字顶最左侧 */
.post-excerpt {
    color: #666;
    font-size: 13px;
    margin-top: 0;
    padding-left:0;
    margin-left:0;
    text-indent:0;
}
.post-excerpt p {
    margin:0 !important;
    padding:0 !important;
    text-indent:0 !important;
}
/* ==========卡片底部元信息：标签 + 评论数【流式布局】========== */
.post-item-meta {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    margin-top:8px;
    padding-top:6px;
    border-top:1px solid #f0f0f0;
    font-size:12px;
    gap:6px;
}
.post-tags {
    display: flex;
    flex-wrap: wrap;
    gap:4px;
}
.post-comment-num {
    flex-shrink:0;
    white-space:nowrap;
    color:#6B4F3A;
}
.post-tags a{
    display:inline-block;
    background:#f8f5f2;
    color:#6B4F3A;
    padding:1px 6px;
    border-radius:3px;
    text-decoration:none;
    transition:color 0.2s ease;
}
.post-tags a:hover{
    color:#543c2b;
}
.post-comment-num a{
    color:#6B4F3A;
    text-decoration:none;
    transition:color 0.2s ease;
}
.post-comment-num a:hover{
    color:#543c2b;
}
/* ========== 单文章页：文章正文独立卡片 ========== */
.single-post-card {
    background: #ffffff;
    padding: 24px 28px;
    border-radius: 8px;
    box-shadow: 0 1px 6px rgba(107, 79, 58, 0.10);
    margin-bottom:16px;
}
.single-post-header {
    margin-bottom: 18px;
    border-bottom: 1px solid #eee;
    padding-bottom: 12px;
}
.single-post-title {
    font-size: 20px;
    color: #222;
    margin-bottom: 8px;
}
.single-meta {
    color: #777;
    font-size: 13px;
}
.single-meta a {
    color: #6B4F3A;
    text-decoration: none;
    transition: color 0.2s ease;
}
.single-meta a:hover {
    color:#543c2b;
    text-decoration: none;
}
.single-content {
    font-size: 15px;
    line-height: 1.8;
}
.single-content p {
    margin-bottom: 14px;
}
.single-content img {
    max-width: 100%;
    height: auto;
    border-radius: 4px;
}
/* ========== 评论区独立卡片 ========== */
.comments-card {
    background:#ffffff;
    border-radius:8px;
    padding:24px 28px;
    box-shadow: 0 1px 6px rgba(107, 79, 58, 0.10);
}
.comments-area {
    margin-top:0;
    padding-top:0;
    border-top:none;
}
/* ========== 页脚【改为卡片式，与主题统一】 ========== */
.site-footer {
    background:#ffffff;
    border-radius:6px;
    padding:12px 14px;
    margin-top:24px;
    text-align: center;
    font-size: 12px;
    color:#6B4F3A;
    box-shadow: 0 1px 6px rgba(107, 79, 58, 0.10);
    border-top:none;
}
.site-footer a{
    color:#6B4F3A;
    text-decoration:none;
    transition:color 0.2s ease;
}
.site-footer a:hover{
    color:#543c2b;
}
/* ========== 分页 ========== */
.pagination {
    text-align: center;
    margin: 16px 0;
}
.pagination a,
.pagination span {
    padding: 4px 16px;
    margin: 0 3px;
    background: #ffffff;
    border-radius: 4px;
    text-decoration: none;
    color: #6B4F3A;
    transition: color 0.2s ease;
}
.pagination a:hover{
    color:#543c2b;
}
.pagination .current {
    background: #7d5e48;
    color: #ffffff;
    padding: 4px 16px;
    margin: 0 3px;
    border-radius: 4px;
}
/* ========== 响应式手机 ========== */
@media (max-width: 640px) {
    .nav-card > ul {
        gap:12px;
    }
    .post-item-head {
        flex-direction: column;
        gap:6px;
    }
    .post-title-row {
        flex-direction: column;
    }
    .post-item:hover {
        transform: none;
        box-shadow: 0 2px 8px rgba(107, 79, 58, 0.14);
    }
    .comment-list .children {
        margin-left: 30px;
    }
    .single-post-card,
    .comments-card {
        padding:16px 14px;
    }
}
/* 文章详情页头部元信息 */
.single-meta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    font-size: 13px;
    color: #777;
    margin: 6px 0 12px;
}
.single-meta-row a {
    color: #6B4F3A;
    text-decoration: none;
}
.single-meta-row a:hover {
    color: #543c2b;
}
.meta-tags {
    display: inline-flex;
    gap: 4px;
}
/* ==========【评论区】一级评论带分割线，嵌套子回复无横线；Respond按钮缩小底色变浅 ========== */
.comments-title {
    font-size:16px;
    color:#6B4F3A;
    margin-bottom:20px;
}
.comment-list {
    list-style: none;
    padding:0;
    margin-bottom: 24px;
}
/* 只给.comment-list直接子级li（一级评论）加分隔线，子回复.children里面li不加 */
.comment-list > li {
    list-style:none;
    padding:14px 0;
    border-bottom: 1px solid #eee;
}
/* 子回复li清除边框，保留上下内边距 */
.comment-list .children li {
    list-style:none;
    padding:14px 0 0 0;
    border-bottom:none;
}
/* 单条评论容器 */
.comment-item {
    display:flex;
    gap:12px;
    align-items:flex-start;
}
/* 头像固定不压缩 */
.comment-avatar img.avatar {
    width:48px;
    height:48px;
    border-radius:50%;
    object-fit:cover;
    background:#f8f5f2;
    flex-shrink:0;
}
.comment-main-wrap {
    flex:1;
    min-width:0;
}
/* 元信息垂直排列：昵称一行，时间编辑一行 */
.comment-meta-info {
    display:flex;
    flex-direction:column;
    gap:4px;
}
/* 昵称行：昵称、作者标签、Respond按钮在同一行，横向排列 */
.comment-author-row {
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
}
/* 评论者名称链接：#6B4F3A，无下划线 */
.comment-author-name {
    font-size:14px;
    font-weight:500;
}
.comment-author-name a {
    color:#6B4F3A;
    text-decoration:none;
    transition:color 0.2s ease;
}
.comment-author-name a:hover {
    color:#543c2b;
}
.author-badge {
    display:inline-block;
    background:linear-gradient(135deg, #3498db 30%, #8c694f 100%);
    color:#ffffff;
    font-size:11px;
    padding:2px 4px;
    border-radius:4px;
    margin-left:4px;
}
/* 时间+编辑行 */
.comment-date-row {
    font-size:12px;
    color:#888;
}
.comment-date-row a {
    color:#888;
    text-decoration:none;
    margin-left:6px;
}
.comment-date-row a:hover {
    color:#6B4F3A;
}
/* Respond按钮：更小，底色变浅 #7d5e48 */
.comment-reply-btn a {
    background:#7d5e48;
    color:#fff !important;
    padding:2px 8px;
    border-radius:4px;
    text-decoration:none;
    font-size:11px;
    transition: background 0.2s ease;
    white-space:nowrap;
}
.comment-reply-btn a:hover {
    background:#6B4F3A;
}
/* 评论正文单独一行 */
.comment-content {
    font-size:14px;
    color:#333;
    line-height:1.65;
    margin-top:6px;
    word-break:break-all;
}
/* 清除默认子列表自带缩进 */
.comment-list .children {
    padding-left: 0;
    margin-left: 0;
    list-style: none;
}
/* 仅 depth=2【第一层嵌套回复】添加缩进 */
.comment-list li.depth-2 {
    margin-left: 40px;
}
/* depth >=3 所有更深层级评论，取消缩进，和depth=2对齐，不再叠加 */
.comment-list li.depth-3,
.comment-list li.depth-4,
.comment-list li.depth-5 {
    margin-left: 0 !important;
}
/*评论表单*/
.comment-form p {
    margin-bottom: 8px;
}
.comment-form input,
.comment-form textarea {
    width: 100%;
    padding: 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-family: inherit;
    font-size:14px;
}
.comment-form input[type="submit"] {
    width: auto;
    background: #6B4F3A;
    color: #ffffff;
    border: none;
    padding: 6px 14px;
    cursor: pointer;
    transition: background-color 0.22s ease;
    font-size:14px;
}
.comment-form input[type="submit"]:hover{
    background-color:#543c2b;
}
.comment-respond .logged-in-as a {
    color: #6B4F3A;
}
/* 评论数字分页 */
.comment-pagination {
    margin: 18px 0;
}
.comment-pagination ul {
    display: flex;
    gap: 8px;
    list-style: none;
    list-style-type: none;
    padding: 0;
    margin:0;
    flex-wrap: wrap;
    justify-content: flex-start;
}
.comment-pagination li {
    margin:0;
    padding:0;
}
.comment-pagination a.page-numbers,
.comment-pagination span.page-numbers {
    display: inline-block;
    padding: 2px 6px;
    font-size:13px;
    border-radius: 6px;
    text-decoration: none;
}
.comment-pagination a.page-numbers {
    color: #6B4F3A;
    border: 1px solid #6B4F3A;
}
.comment-pagination a.page-numbers:hover {
    background-color: #6B4F3A;
    color: #ffffff;
}
.comment-pagination span.page-numbers.current {
    background-color: #7d5e48;
    color: #ffffff;
    border:1px solid #6B4F3A;
}
/* ===== 存档页面 全部卡片式样式 ===== */
.archive-page{
    max-width: 880px;
    margin: 20px auto;
}
.archive-title{
    color:#6B4F3A;
    font-size:22px;
    margin-bottom:6px;
}
.archive-desc{
    color:#777;
    font-size:13px;
    margin-bottom:16px;
}
/* 每个独立区块卡片，和主题post-item完全一致风格 */
.archive-card {
    background: #ffffff;
    border-radius: 6px;
    padding:14px 16px;
    margin-bottom:12px;
    box-shadow: 0 1px 6px rgba(107, 79, 58, 0.10);
}
.archive-card-title {
    font-size:15px;
    color:#6B4F3A;
    margin-bottom:12px;
    font-weight:500;
}
/* 顶部统计三卡片 */
.archive-stats-row{
    display:flex;
    gap:12px;
    justify-content:center;
    flex-wrap:wrap;
}
.stat-card{
    width:100px;
    text-align:center;
    padding:12px 6px;
    border-radius:8px;
    background:#6B4F3A;
    color:#fff;
    box-shadow: 0 1px 6px #6B4F3A;
}
.stat-num{
    font-size:22px;
    font-weight:bold;
}
.stat-label{
    font-size:12px;
    opacity:0.9;
}
/* 分类两行两列 */
.archive-cat-row{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap:10px;
    padding-top: 10px;
}
.cat-card{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:10px 14px;
    border:1px solid #f0f0f0;
    border-radius:6px;
    text-decoration:none;
    color:#6B4F3A;
    box-shadow: 0px 1px 6px #d9c9bc;
}
.cat-card:hover{
    background:#f8f2ed;
}
.cat-name{
    font-weight:500;
}
/* 存档页分类元信息【独立class，隔离首页cat‑meta，禁止被flex挤压】 */
.cat-archive-meta{
    font-size:12px;
    color:#6B4F3A;
    flex-shrink: 0;
    white-space: nowrap;
}
/* 标签云 */
.tag-wrap{
    margin:0;
    padding:0;
    border-bottom:none;
}
.tag-wrap h4{
    display:inline-block;
    font-size:14px;
    margin:0 6px 0 0;
}
.tag-wrap a{
    color:#6B4F3A;
    margin:0 4px 6px 4px;
    text-decoration:none;
    font-size:13px;
    display:inline-block;
}
.tag-wrap a:hover{
    color:#543c2b;
    text-decoration:none;
}
.tag-wrap .tag-count {
    font-size:11px;
    color:#888;
}
/* 年份折叠归档 */
.year-archive-list{
    margin-top:0;
}
.year-item{
    border-bottom:1px solid #eee;
}
.year-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:10px 4px;
    cursor:pointer;
    user-select:none;
    border-bottom: 2px solid #6B4F3A
}
.year-text{
    font-size:16px;
    font-weight:500;
    color:#6B4F3A;
}
.year-count{
    color:#777;
    font-size:13px;
}
.year-arrow{
    color:#6B4F3A;
    font-size:12px;
}
.year-month-wrap{
    display:none;
    padding-left:12px;
}
.month-header{
    padding:8px 0 4px;
    color:#6B4F3A;
    font-size:14px;
    border-left:2px solid #6B4F3A;
    padding-left:8px;
    margin:14px 0;
}
.post-list{
    list-style:none;
    padding-left:12px;
    margin:0 0 10px;
}
.post-list li{
    display:flex;
    justify-content:space-between;
    padding:8px 0;
    border-bottom:1px dotted #eee;
    font-size:14px;
}
.post-list li a{
    color:#333;
    text-decoration:none;
}
.post-list li a:hover{
    color:#6B4F3A;
}
.post-meta-right {
    flex-shrink:0;
    white-space:nowrap;
}
.post-date{
    color:#999;
    font-size:12px;
    margin-right:6px;
}
.post-comment-count{
    color:#6B4F3A;
    font-size:12px;
}
/*手机适配*/
@media (max-width:640px){
    .archive-cat-row{
        grid-template-columns:1fr;
    }
    .archive-stats-row{
        gap:8px;
    }
    .stat-card{
        width:85px;
    }
}
/* ====== 存档页面 post‑list 棕色小圆点 ====== */
.archive-page .post-list {
    list-style: none;
    padding-left:14px;
}
.archive-page .post-list li {
    position: relative;
    padding-left:16px;
    margin:6px 0;
}
.archive-page .post-list li::before {
    content:"";
    position:absolute;
    left:0;
    top:9px;
    width:7px;
    height:7px;
    background-color:#6B4F3A;
    border-radius:100%;
}
.year-month-wrap .post-list li {
    position: relative;
    list-style: none;
    padding-left: 18px;
    margin: 6px 0;
    display: flex;
    align-items: center;
}
.year-month-wrap .post-list li::before {
    content: "";
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    width:7px;
    height:7px;
    background-color:#6B4F3A;
    border-radius: 50%;
}
/* ===== 友链页面样式 B方案：分组各自独立卡片 ===== */
.links-page{
    max-width: 880px;
    margin:20px auto;
}
.links-title{
    color:#6B4F3A;
    font-size:26px;
    margin-bottom:16px;
}
/* 每个友链分组 = 独立卡片，和archive-card完全统一 */
.links-group{
    background: #ffffff;
    border-radius: 6px;
    padding:14px 16px;
    margin-bottom:12px;
    box-shadow: 0 1px 6px rgba(107, 79, 58, 0.10);
}
.links-cat-title{
    font-size:18px;
    color:#777;
    font-weight:500;
    margin:0 0 16px 0;
}
.links-grid{
    display:grid;
    grid-template-columns: repeat(auto-fill, minmax(90px,1fr));
    gap:18px 10px;
}
.link-item{
    display:block;
    text-align:center;
    text-decoration:none;
}
.link-avatar{
    width:56px;
    height:56px;
    margin:0 auto 8px;
    border-radius:50%;
    overflow:hidden;
    background:#f5f5f5;
}
.link-avatar img{
    width:100%;
    height:100%;
    object-fit:cover;
}
.link-name{
    font-size:13px;
    color:#6B4F3A;
}
.link-item:hover .link-name{
    color:#543c2b;
}
.link-item:hover .link-avatar img{
    transform:scale(1.05);
    transition:0.2s ease;
}
.link-avatar img{
    transition:0.2s ease;
}
/* 手机适配 */
@media (max-width:640px){
    .links-grid{
        grid-template-columns: repeat(auto-fill, minmax(75px,1fr));
        gap:14px 6px;
    }
    .link-avatar{
        width:64px;
        height:64px;
    }
}
/* ===== Alu表情 ===== */
.comment-form-smilies {
    margin-bottom: 8px;
    padding:6px 8px;
    background:#f8f8f8;
    border-radius:4px;
}
.comment-form-smilies img {
    cursor:pointer;
    margin:0 3px;
    width:22px;
    height:22px;
    vertical-align:middle;
}
/* ===== 作者及评论等级 ===== */
/* 作者标签 */
.author-badge {
    display: inline-block;
    background:linear-gradient(135deg, #3498db 30%, #8c694f 100%);
    color:#ffffff;
    font-size:11px;
    padding:2px 4px;
    border-radius:4px;
    margin-left:4px;
}
/* 游客等级标签 Lv1‑Lv3，全部白字 */
.user-level-badge {
    display: inline-block;
    font-size:11px;
    padding:0px 2px 0px 2px;
    border-radius:4px;
    color:#ffffff;
    margin-left:4px;
}
.user-level-badge.level-Lv1 {
    background:#777777;
}
.user-level-badge.level-Lv2 {
    background:#f0d683;
}
.user-level-badge.level-Lv3 {
    background:#FF9670;
}
/* =========首页分类小卡片｜右侧简介弱化显示========== */
.home-cat-grid {
    display: flex;
    gap: 12px;
    margin-bottom: 12px;
    flex-wrap: nowrap;
}
.home-cat-item {
    flex: 1 1 0;
    min-width: 110px;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 10px;
    background: #ffffff;
    border-radius: 6px;
    padding: 14px 12px;
    text-decoration: none;
    box-shadow: 0 1px 6px rgba(107, 79, 58, 0.10);
    transition: all 0.22s ease;
}
.home-cat-item,
.home-cat-item:hover {
    text-decoration: none;
}
.home-cat-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 12px rgba(107, 79, 58, 0.18);
}
.cat-left {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.cat-name {
    font-size: 15px;
    color: #6B4F3A;
    font-weight: 500;
    word-break: break-all;
}
.cat-meta {
    font-size: 11px;
    color: #777;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
/* 右侧简介：浅灰、更小、右对齐，作为辅助信息 */
.cat-right-desc {
    flex-shrink: 1;
    max-width: 48%;
    font-size: 10px;
    color: #b0b0b0;
    text-align: right;
    line-height: 1.5;
    word-break: break-all;
}
/* 手机端：简介放下方左对齐 */
@media (max-width: 640px) {
    .home-cat-grid {
        flex-wrap: wrap;
    }
    .home-cat-item {
        flex: 1 1 120px;
        padding: 12px 10px;
        flex-direction: column;
        align-items: flex-start;
    }
    .cat-right-desc {
        max-width: 100%;
        text-align: left;
        margin-top: 6px;
    }
}
/* =========分类卡片右上角超大浅棕序号背景========== */
.home-cat-item {
    position: relative;
    overflow: hidden;
}
.cat-index {
    position: absolute;
    top: 1px;
    right: 6px;
    font-size: 56px;
    font-weight: 1000;
    line-height: 1;
    color: #f3ece6;
    pointer-events: none;
    user-select: none;
    z-index: 0;
}
.cat-left,
.cat-right-desc {
    position: relative;
    z-index: 1;
}
/* 只在桌面端显示，手机隐藏*/
@media(max-width:640px){
    .cat-index{
        display:none;
    }
}
/* 文章详情列表棕色圆点，同时匹配 ul>li 和直接子li */
.single-post-card .single-content li {
    list-style: none;
    position: relative;
    padding-left: 20px;
    margin-bottom: 6px;
}
.single-post-card .single-content li::before {
    content: "";
    position: absolute;
    left: 2px;
    top: 9px;
    width:7px;
    height:7px;
    background-color:#6B4F3A;
    border-radius: 100%;
}
/* 有序列表ol，不受上面样式影响，保留默认数字 */
.single-post-card .single-content ol li {
    list-style: decimal;
    padding-left:0;
}
.single-post-card .single-content ol li::before {
    display:none;
}
/* 间距兜底 */
.single-post-card .single-content ul,
.single-post-card .single-content li {
    margin: 10px 0;
}
.single-post-card .single-content li {
    list-style: none;
    position: relative;
    padding-left: 20px;
    margin-bottom: 6px;
}
/* li小点居中 */
.single-post-card .single-content li::before {
    content: "";
    position: absolute;
    left: 2px;
    top: 0.75em; /* 只在第一行高度，多行也不动 */
    width:7px;
    height:7px;
    background-color:#6B4F3A;
    border-radius: 50%;
}
/* 有序列表恢复默认数字，不显示棕圆点 */
.single-post-card .single-content ol li {
    list-style: decimal;
    padding-left: 0;
}
.single-post-card .single-content ol li::before {
    display: none;
}
/* ==========首页流水灯最新评论========== */
.home-marquee-comment-wrap {
    background: #fff;
    border-radius: 10px;
    padding: 10px 16px;
    margin: 14px 0;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}
.marquee-view {
    overflow: hidden;
    width:100%;
}
.marquee-track {
    display:flex;
    gap:10px;
    width:max-content;
    animation: marqueeScroll 28s linear infinite;
}
.marquee-track:hover {
    animation-play-state: paused;
}
@keyframes marqueeScroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
.comment-card {
    display:flex;
    align-items:center;
    gap:8px;
    min-width:210px;
    padding:6px 10px;
    background:#f8f5f2;
    border-radius:8px;
    border:1px solid #efe8e2;
    text-decoration:none;
    transition: all 0.25s;
}
.comment-card:hover {
    background:#f1e9e2;
    transform: translateY(-1px);
}
.home-marquee-comment-wrap .comment-avatar img.avatar {
    width:30px !important;
    height:30px !important;
    border-radius:50%;
}
.comment-info {
    display:flex;
    flex-direction:column;
    gap:1px;
}
.comment-name {
    font-size:13px;
    color:#333;
    font-weight:500;
    line-height:1.2;
}
.comment-text {
    font-size:12px;
    color:#666;
    line-height:1.25;
}
/*手机适配*/
@media(max-width:640px){
    .comment-card{
        min-width:170px;
        padding:4px 8px;
    }
    .home-marquee-comment-wrap .comment-avatar img.avatar {
        width:26px !important;
        height:26px !important;
    }
    .home-marquee-comment-wrap{
        padding:8px 12px;
    }
}