.article-detail{flex:1;}
.article-breadcrumb{margin-bottom:20px;font-size:var(--fs-sm);}
.article-breadcrumb a{color:#333;text-decoration:underline;text-decoration-color:#333;}
.article-breadcrumb a:hover{color:#1E88E5;text-decoration-color:#1E88E5;}
.breadcrumb-sep{margin:0 8px;color:#666;}
.breadcrumb-current{color:#333;font-weight:600;}
.article-header{margin-bottom:0;}

.article-meta{display:flex;align-items:center;gap:16px;margin-bottom:20px;flex-wrap:wrap;padding-bottom:12px;border-bottom:1px solid #e5e5e5;}

.article-category{padding-left:12px;background:transparent !important;}
.article-category[class*="article-category--"]{background:transparent !important;}
.article-date,.article-update{font-size:var(--fs-xs);color:#666;}

.article-share{display:flex;align-items:center;gap:12px;margin-left:auto;}
.share-btn{color:#666;display:inline-flex;align-items:center;justify-content:center;font-size:18px;text-decoration:none;transition:color 0.25s ease, transform 0.25s ease;}
.share-btn:hover{color:#1E88E5;transform:scale(1.08);}
.article-title{font-size:var(--fs-3xl);font-weight:700;color:#060606;line-height:1.4;margin:0 0 24px 0;}
.article-author{font-size:var(--fs-sm);color:#666;}
.article-thumbnail{margin-bottom:32px;border-radius:0;overflow:hidden;}
.article-thumbnail img{width:100%;height:auto;display:block;}
.article-content{font-size:var(--fs-base);line-height:1.8;color:#333;margin-bottom:40px;}
.article-content h2{font-size:var(--fs-2xl);font-weight:700;color:#060606;margin:32px 0 16px 0;padding-bottom:8px;border-bottom:2px solid #e5e5e5;}
.article-content h3{font-size:var(--fs-xl);font-weight:700;color:#060606;margin:24px 0 12px 0;}
.article-content p{margin-bottom:16px;}
.article-content ul,.article-content ol{margin:16px 0;padding-left:24px;}
.article-content li{margin-bottom:8px;}
.article-content a{color:#1E88E5;text-decoration:underline;}
.article-content a:hover{color:#1565C0;}
.article-tags{margin-top:40px;padding-top:32px;border-top:1px solid #e5e5e5;}
.tags-title{font-size:var(--fs-lg);font-weight:700;color:#060606;margin:0 0 16px 0;}
.tags-list{display:flex;flex-wrap:wrap;gap:8px;}
.tags-list .tag-item{display:inline-block;padding:6px 12px;background:transparent;color:#333;font-size:var(--fs-xs);text-decoration:none;border-radius:0;transition:color 0.25s ease;}
.tags-list .tag-item:hover{background:transparent;color:#1E88E5;}
.related-articles{margin-top:60px;padding-top:40px;border-top:2px solid #e5e5e5;}
.related-title{font-size:var(--fs-2xl);font-weight:700;color:#060606;margin:0 0 24px 0;}
.related-list{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.related-item{display:flex;flex-direction:column;transition:transform 0.25s ease;}
.related-item:hover{transform:translateY(-4px);}
.related-thumb{width:100%;aspect-ratio:4/3;border-radius:0;overflow:hidden;margin-bottom:12px;}
.related-thumb img{width:100%;height:100%;object-fit:cover;transition:transform 0.3s ease;}
.related-item:hover .related-thumb img{transform:scale(1.05);}
.related-content{flex:1;}
.related-date{font-size:var(--fs-xs);color:#999;margin-bottom:8px;}
.related-item-title{font-size:var(--fs-base);font-weight:600;line-height:1.5;margin:0;}
.related-item-title a{color:#060606;text-decoration:none;transition:color 0.25s ease;}
.related-item-title a:hover{color:#1E88E5;}
.contact-form-section{margin-top:60px;padding-top:40px;border-top:2px solid #e5e5e5;}
.contact-form-title{font-size:var(--fs-2xl);font-weight:700;color:#060606;margin:0 0 32px 0;}
.contact-form-wrapper{padding:24px;background:#fff;border:1px solid #e0e0e0;border-radius:6px;box-shadow:0 2px 8px rgba(0,0,0,0.04);}
.contact-form-group{margin-bottom:20px;}
.contact-form-label{display:block;font-size:var(--fs-sm);font-weight:600;color:#333;margin-bottom:8px;}
.contact-form-label .required{color:#e74c3c;margin-left:4px;}
.contact-form-input,.contact-form-textarea{width:100%;padding:12px 16px;font-size:var(--fs-base);font-family:inherit;line-height:1.6;color:#333;background:#fafafa;border:2px solid #e0e0e0;border-radius:6px;transition:all 0.25s ease;box-sizing:border-box;}
.contact-form-input:focus,.contact-form-textarea:focus{outline:none;border-color:#1E88E5;background:#fff;box-shadow:0 0 0 3px rgba(30,136,229,0.1);}
.contact-form-textarea{resize:vertical;min-height:150px;}
.contact-form-captcha{margin-bottom:20px;}
.contact-captcha-wrapper{display:flex;align-items:center;gap:12px;}
.contact-captcha-input{flex:0 0 120px;padding:8px 12px;font-size:var(--fs-sm);border:2px solid #e0e0e0;border-radius:6px;transition:all 0.25s ease;}
.contact-captcha-input:focus{outline:none;border-color:#1E88E5;box-shadow:0 0 0 3px rgba(30,136,229,0.1);}
.contact-captcha-image{height:38px;cursor:pointer;border:2px solid #e0e0e0;border-radius:6px;transition:all 0.25s ease;}
.contact-captcha-image:hover{border-color:#1E88E5;}
.contact-form-footer{display:flex;justify-content:flex-end;}
.contact-submit-btn{padding:14px 32px;font-size:var(--fs-base);font-weight:600;color:#fff;background:linear-gradient(135deg,#1E88E5 0%,#1565C0 100%);border:none;border-radius:6px;cursor:pointer;transition:all 0.25s ease;box-shadow:0 2px 4px rgba(30,136,229,0.2);}
.contact-submit-btn:hover{background:linear-gradient(135deg,#1565C0 0%,#0d47a1 100%);box-shadow:0 4px 8px rgba(30,136,229,0.3);transform:translateY(-1px);}
.contact-submit-btn:active{transform:translateY(0);}
.contact-submit-btn:disabled{background:#ccc;cursor:not-allowed;box-shadow:none;transform:none;}
.contact-message{padding:12px 16px;margin-bottom:16px;border-radius:6px;font-size:var(--fs-sm);transition:opacity 0.3s ease;}
.contact-message--success{background:#d4edda;color:#155724;border:1px solid #c3e6cb;}
.contact-message--error{background:#f8d7da;color:#721c24;border:1px solid #f5c6cb;}
.article-comments{margin-top:60px;padding-top:40px;border-top:2px solid #e5e5e5;}
.comments-title{font-size:var(--fs-2xl);font-weight:700;color:#060606;margin:0 0 32px 0;}
.comment-form-wrapper{margin-bottom:40px;padding:24px;background:#fff;border:1px solid #e0e0e0;border-radius:6px;box-shadow:0 2px 8px rgba(0,0,0,0.04);}
.comment-form-content{margin-bottom:16px;}
.comment-textarea{width:100%;padding:14px 16px;font-size:var(--fs-base);font-family:inherit;line-height:1.6;color:#333;background:#fafafa;border:2px solid #e0e0e0;border-radius:6px;resize:vertical;min-height:120px;transition:all 0.25s ease;}
.comment-textarea:focus{outline:none;border-color:#1E88E5;background:#fff;box-shadow:0 0 0 3px rgba(30,136,229,0.1);}
.comment-form-captcha{display:flex;align-items:center;gap:12px;margin-bottom:12px;}
.comment-captcha-input{flex:0 0 120px;padding:8px 12px;font-size:var(--fs-sm);border:2px solid #e0e0e0;border-radius:6px;transition:all 0.25s ease;}
.comment-captcha-input:focus{outline:none;border-color:#1E88E5;box-shadow:0 0 0 3px rgba(30,136,229,0.1);}
.comment-captcha-image{height:38px;cursor:pointer;border:2px solid #e0e0e0;border-radius:6px;transition:all 0.25s ease;}
.comment-captcha-image:hover{border-color:#1E88E5;}
.comment-form-footer{display:flex;justify-content:flex-end;}
.comment-submit-btn{padding:12px 28px;font-size:var(--fs-base);font-weight:600;color:#fff;background:linear-gradient(135deg,#1E88E5 0%,#1565C0 100%);border:none;border-radius:6px;cursor:pointer;transition:all 0.25s ease;box-shadow:0 2px 4px rgba(30,136,229,0.2);}
.comment-submit-btn:hover{background:linear-gradient(135deg,#1565C0 0%,#0d47a1 100%);box-shadow:0 4px 8px rgba(30,136,229,0.3);transform:translateY(-1px);}
.comment-submit-btn:active{transform:translateY(0);}
.comment-submit-btn:disabled{background:#ccc;cursor:not-allowed;box-shadow:none;transform:none;}
.comment-message{padding:12px 16px;margin-bottom:16px;border-radius:6px;font-size:var(--fs-sm);transition:opacity 0.3s ease;}
.comment-message--success{background:#d4edda;color:#155724;border:1px solid #c3e6cb;}
.comment-message--error{background:#f8d7da;color:#721c24;border:1px solid #f5c6cb;}
.comments-list{margin-top:32px;}
.comments-loading,.comments-empty{text-align:center;padding:20px;color:#999;font-size:var(--fs-base);}
.comment-item{padding:20px;margin-bottom:16px;background:#fff;border:1px solid #e8e8e8;border-radius:6px;transition:all 0.25s ease;}
.comment-item:hover{border-color:#d0d0d0;box-shadow:0 2px 8px rgba(0,0,0,0.06);}
.comment-item:last-child{margin-bottom:0;}
.comment-avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);display:flex;align-items:center;justify-content:center;font-size:var(--fs-base);font-weight:600;color:#fff;flex-shrink:0;box-shadow:0 2px 4px rgba(0,0,0,0.1);}
.comment-avatar:empty{display:none;}
.comment-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover;}
.comment-avatar i{font-size:20px;}
.comment-info{flex:1;}
.comment-author{font-size:var(--fs-base);font-weight:600;color:#060606;margin-bottom:4px;}
.comment-time{font-size:var(--fs-xs);color:#999;}
.comment-content{font-size:var(--fs-base);line-height:1.7;color:#333;margin:0;padding:0;word-wrap:break-word;}
.comment-reply-to{color:#1E88E5;font-weight:600;}
.comment-meta{display:flex;justify-content:space-between;align-items:center;margin-top:12px;}
.comment-actions{display:flex;gap:2px;align-items:center;}
.comment-action-btn{display:inline-flex;align-items:center;gap:4px;font-size:var(--fs-xs);color:#666;background:transparent;border:none;cursor:pointer;padding:2px 4px;transition:all 0.25s ease;line-height:1;}
.comment-action-btn i{font-size:var(--fs-xs);}
.comment-action-btn span{font-size:var(--fs-xs);color:inherit;line-height:1;}
.comment-action-btn .like-count{font-size:var(--fs-xs);color:inherit;}
.comment-action-btn .toggle-text{font-size:var(--fs-sm);color:#666;}
.comment-reply-btn:hover{color:#1E88E5;}
.comment-toggle-btn:hover{color:#1E88E5;}
.comment-like-btn:hover{color:#1E88E5;}
.comment-like-btn.liked{color:#1E88E5;}
.comment-like-btn.liked i{color:#1E88E5;}
.comment-replies{margin-top:16px;margin-left:20px;padding-left:0;border-left:none;}
.reply-item{padding:16px;margin-bottom:12px;background:#fff;border:1px solid #e8e8e8;border-radius:6px;transition:all 0.25s ease;}
.reply-item:hover{border-color:#d0d0d0;box-shadow:0 1px 4px rgba(0,0,0,0.04);}
.reply-item:last-child{margin-bottom:0;}
.reply-header{display:flex;align-items:center;gap:12px;margin-bottom:8px;}
.reply-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#f093fb 0%,#f5576c 100%);display:flex;align-items:center;justify-content:center;font-size:var(--fs-xs);font-weight:600;color:#fff;flex-shrink:0;box-shadow:0 2px 4px rgba(0,0,0,0.1);}
.reply-avatar:empty{display:none;}
.reply-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover;}
.reply-avatar i{font-size:16px;}
.reply-info{flex:1;}
.reply-author{font-size:var(--fs-sm);font-weight:600;color:#060606;}
.reply-time{font-size:var(--fs-xs);color:#999;}
.reply-content{font-size:var(--fs-sm);line-height:1.7;color:#333;margin:0;padding:0;word-wrap:break-word;}
.reply-actions{display:flex;gap:2px;align-items:center;}
.reply-reply-btn{font-size:var(--fs-xs);color:#1E88E5;background:rgba(30,136,229,0.1);border:none;border-radius:4px;cursor:pointer;padding:4px 10px;transition:all 0.25s ease;}
.reply-reply-btn:hover{color:#fff;background:#1E88E5;transform:translateY(-1px);box-shadow:0 2px 4px rgba(30,136,229,0.2);}
.reply-form-wrapper{margin-top:12px;padding:16px;background:#fafafa;border:1px solid #e0e0e0;border-radius:6px;box-shadow:0 2px 8px rgba(0,0,0,0.04);}
.reply-form{display:flex;flex-direction:column;gap:12px;}
.reply-form textarea{width:100%;padding:12px 14px;font-size:var(--fs-sm);font-family:inherit;line-height:1.5;color:#333;background:#fafafa;border:2px solid #e0e0e0;border-radius:6px;resize:vertical;min-height:80px;transition:all 0.25s ease;}
.reply-form textarea:focus{outline:none;border-color:#1E88E5;background:#fff;box-shadow:0 0 0 3px rgba(30,136,229,0.1);}
.reply-form-captcha{display:flex;align-items:center;gap:12px;}
.reply-captcha-input{flex:0 0 120px;padding:8px 12px;font-size:var(--fs-sm);border:2px solid #e0e0e0;border-radius:6px;transition:all 0.25s ease;}
.reply-captcha-input:focus{outline:none;border-color:#1E88E5;box-shadow:0 0 0 3px rgba(30,136,229,0.1);}
.reply-captcha-image{height:38px;cursor:pointer;border:2px solid #e0e0e0;border-radius:6px;transition:all 0.25s ease;}
.reply-captcha-image:hover{border-color:#1E88E5;}
.reply-form-footer{display:flex;justify-content:flex-end;gap:12px;}
.reply-form-cancel-btn{padding:8px 16px;font-size:var(--fs-sm);color:#666;background:#fff;border:1px solid #ddd;border-radius:6px;cursor:pointer;transition:all 0.25s ease;}
.reply-form-cancel-btn:hover{background:#f5f5f5;border-color:#bbb;}
.reply-form-submit-btn{padding:8px 20px;font-size:var(--fs-sm);font-weight:600;color:#fff;background:linear-gradient(135deg,#1E88E5 0%,#1565C0 100%);border:none;border-radius:6px;cursor:pointer;transition:all 0.25s ease;box-shadow:0 2px 4px rgba(30,136,229,0.2);}
.reply-form-submit-btn:hover{background:linear-gradient(135deg,#1565C0 0%,#0d47a1 100%);box-shadow:0 4px 8px rgba(30,136,229,0.3);transform:translateY(-1px);}
@media (max-width:1024px) and (min-width:769px){.posts-layout{grid-template-columns:1fr;}.article-sidebar{display:none !important;}.article-detail{padding:30px 20px;}.article-title{font-size:var(--fs-2xl);}.related-list{grid-template-columns:repeat(2,1fr);gap:20px;}}
@media (max-width:768px){.posts-layout{grid-template-columns:1fr;gap:24px;}.article-sidebar{display:none !important;}.article-detail{padding:20px 16px;}.article-breadcrumb{font-size:15px;margin-bottom:16px;}.article-header{}.article-meta{flex-direction:row;align-items:center;flex-wrap:wrap;gap:12px;padding-bottom:16px;}.article-share{margin-left:auto;}.article-title{font-size:var(--fs-2xl);line-height:1.3;}.article-thumbnail{margin-bottom:24px;}.article-content{font-size:var(--fs-sm);line-height:1.7;}.article-content h2{font-size:var(--fs-xl);margin:24px 0 12px 0;}.article-content h3{font-size:var(--fs-lg);margin:20px 0 10px 0;}.article-content p{margin-bottom:12px;}.article-content ul,.article-content ol{margin:12px 0;padding-left:20px;}.article-tags{margin-top:30px;padding-top:24px;}.tags-title{font-size:var(--fs-base);margin-bottom:12px;}.related-articles{margin-top:40px;padding-top:30px;}.related-title{font-size:var(--fs-xl);margin-bottom:20px;}.related-list{grid-template-columns:1fr;gap:20px;}.related-thumb{aspect-ratio:16/9;}.contact-form-section{margin-top:40px;padding-top:30px;}.contact-form-title{font-size:var(--fs-xl);margin-bottom:24px;}.contact-form-wrapper{padding:16px;}.contact-form-group{margin-bottom:16px;}.contact-form-input,.contact-form-textarea{padding:12px;font-size:var(--fs-sm);}.contact-form-textarea{min-height:120px;}.contact-submit-btn{padding:12px 24px;font-size:var(--fs-sm);width:100%;}.article-comments{margin-top:40px;padding-top:30px;}.comments-title{font-size:var(--fs-xl);margin-bottom:24px;}.comment-form-wrapper{padding:16px;}.comment-textarea{min-height:100px;padding:12px;font-size:var(--fs-sm);}.comment-submit-btn{padding:10px 20px;font-size:var(--fs-sm);width:100%;}.comment-item{padding:16px;margin-bottom:12px;}.comment-header{gap:10px;margin-bottom:10px;}.comment-avatar{width:36px;height:36px;font-size:12px;}.comment-author{font-size:var(--fs-sm);}.comment-content{font-size:var(--fs-sm);margin:10px 0;padding:10px 0;}.comment-replies{margin-left:0;padding-left:0;border-left:none;margin-top:16px;}.reply-item{padding:12px;margin-bottom:10px;}.reply-avatar{width:32px;height:32px;}.reply-content{margin-left:0;font-size:12px;}.reply-actions{margin-left:0;}.reply-form-wrapper{margin-left:0;padding:12px;}.reply-form textarea{min-height:70px;padding:10px;}}
@media (max-width:480px){.posts-layout{grid-template-columns:1fr;}.article-sidebar{display:none !important;}.article-detail{padding:16px 12px;}.article-breadcrumb{font-size:14px;}.article-title{font-size:var(--fs-xl);}.article-content{font-size:13px;}.article-content h2{font-size:var(--fs-lg);}.article-content h3{font-size:var(--fs-base);}.comment-form-wrapper{padding:12px;}.comment-item{padding:12px;}.comment-avatar{width:32px;height:32px;}.reply-item{padding:10px;}.reply-form-wrapper{padding:10px;}}