/*
Theme Name: 神人佛8客 - 移动端内容卡片主题
Theme URI: https://example.com/
Author: 神人佛8客
Author URI: https://example.com/
Description: 移动端双列文章卡片瀑布流主题，清淡灰绿配色，内置浏览量统计、置顶管理、分类标签、底部五栏导航、前端投稿、消息通知、钱包积分、用户中心、头像上传、文章海报生成、小工具区域、后台全功能设置面板。兼容WordPress 6.2.9 / PHP 7.3+。
Version: 3.2.5
Requires at least: 5.8
Tested up to: 6.4
Requires PHP: 7.3
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: shenrenfo8-theme
Tags: 移动端, 双列布局, 瀑布流, 卡片式, 清淡配色, 内容展示, 自定义背景, 自定义菜单
*/

/**
 * 神人佛8客主题 - 主样式表
 * 复刻移动端双列文章卡片瀑布流模板
 */

:root {
    --srf8-primary: #7a9e9f;
    --srf8-primary-light: #a8c5c6;
    --srf8-tag: #c4956a;
    --srf8-bg: #f7f8f9;
    --srf8-card-bg: #ffffff;
    --srf8-text: #3d4a4f;
    --srf8-text-light: #8a9a9f;
    --srf8-border: #e8ecee;
    --srf8-radius: 10px;
    --srf8-shadow: 0 1px 8px rgba(61, 74, 79, 0.06);
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
    background: var(--srf8-bg);
    color: var(--srf8-text);
    line-height: 1.6;
    padding-bottom: 70px;
    -webkit-font-smoothing: antialiased;
}

a { text-decoration: none; color: inherit; }
img { max-width: 100%; height: auto; display: block; }
ul, ol { list-style: none; }

/* ========== 顶部导航栏 ========== */
.srf8-top-header {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--srf8-border);
    padding: 10px 16px;
}

.srf8-header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 1200px;
    margin: 0 auto;
}

.srf8-menu-btn {
    background: none;
    border: none;
    padding: 6px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.srf8-menu-btn span {
    display: block;
    width: 22px;
    height: 2.5px;
    background: #555;
    border-radius: 2px;
}

.srf8-site-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1;
    justify-content: center;
}

.srf8-site-logo {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    object-fit: cover;
}

.srf8-site-logo-placeholder {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--srf8-primary), var(--srf8-primary-light));
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: bold;
}

.srf8-site-info {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.srf8-site-name {
    font-size: 20px;
    font-weight: 700;
    color: var(--srf8-text);
    margin: 0;
    letter-spacing: 1px;
}

.srf8-site-qq {
    font-size: 13px;
    color: var(--srf8-text-light);
}

.srf8-search-btn {
    background: none;
    border: none;
    padding: 6px;
    cursor: pointer;
    color: #555;
}

/* ========== 搜索弹窗 ========== */
.srf8-search-overlay {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.5);
    z-index: 200;
    align-items: flex-start;
    justify-content: center;
    padding-top: 80px;
}

.srf8-search-overlay.srf8-active { display: flex; }

.srf8-search-box {
    background: white;
    border-radius: 12px;
    padding: 16px;
    width: 90%;
    max-width: 400px;
    position: relative;
}

.srf8-search-box form {
    display: flex;
    gap: 8px;
}

.srf8-search-box input {
    flex: 1;
    padding: 10px 12px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 14px;
    outline: none;
}

.srf8-search-box input:focus { border-color: var(--srf8-primary); }

.srf8-search-box button {
    padding: 10px 18px;
    background: var(--srf8-primary);
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    cursor: pointer;
}

.srf8-search-close {
    position: absolute;
    top: 8px;
    right: 12px;
    background: none;
    border: none;
    font-size: 22px;
    color: #999;
    cursor: pointer;
}

/* ========== 侧边栏菜单 ========== */
.srf8-sidebar-overlay {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.5);
    z-index: 150;
}

.srf8-sidebar-overlay.srf8-active { display: block; }

.srf8-sidebar {
    position: fixed;
    top: 0;
    left: -280px;
    width: 280px;
    height: 100%;
    background: white;
    z-index: 151;
    transition: left 0.3s ease;
    display: flex;
    flex-direction: column;
}

.srf8-sidebar.srf8-active { left: 0; }

.srf8-sidebar-header {
    padding: 24px 20px;
    background: linear-gradient(135deg, var(--srf8-primary), var(--srf8-primary-light));
    color: white;
    display: flex;
    align-items: center;
    gap: 12px;
    position: relative;
    overflow: hidden;
}
.srf8-sidebar-header::before {
    content: '';
    position: absolute;
    top: -30px;
    right: -30px;
    width: 100px;
    height: 100px;
    background: rgba(255,255,255,0.08);
    border-radius: 50%;
}

.srf8-sidebar-logo {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
}

.srf8-sidebar-header h3 {
    font-size: 18px;
    font-weight: 600;
}

.srf8-sidebar-menu {
    flex: 1;
    overflow-y: auto;
    padding: 10px 0;
}

.srf8-mobile-menu li a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 20px;
    color: #333;
    font-size: 15px;
    border-bottom: 1px solid #f5f5f5;
    transition: background 0.2s;
    text-decoration: none;
}

.srf8-mobile-menu li a svg {
    flex-shrink: 0;
    color: #999;
}

.srf8-mobile-menu li a span {
    flex: 1;
}

.srf8-mobile-menu li a:hover {
    background: #f9f9f9;
    color: var(--srf8-primary);
}

.srf8-mobile-menu li a:hover svg {
    color: var(--srf8-primary);
}

.srf8-mobile-menu li.srf8-menu-divider {
    padding: 10px 20px 6px;
    font-size: 12px;
    color: #999;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    background: #fafafa;
}

.srf8-mobile-menu li.srf8-menu-divider span {
    display: block;
}

.srf8-sidebar-footer {
    padding: 16px 20px;
    border-top: 1px solid #eee;
}

.srf8-login-btn, .srf8-logout-btn {
    display: block;
    text-align: center;
    padding: 10px;
    background: var(--srf8-primary);
    color: white;
    border-radius: 8px;
    font-size: 14px;
}

/* ========== 首页广告语横幅 ========== */
.srf8-ad-banner {
    margin: 0 12px 12px;
    border-radius: 10px;
    overflow: hidden;
}
.srf8-ad-banner a {
    text-decoration: none;
    display: block;
}
.srf8-ad-banner-inner {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    background: linear-gradient(135deg, var(--srf8-primary), var(--srf8-primary-light));
    color: white;
    font-size: 14px;
    line-height: 1.5;
}
.srf8-ad-banner-icon {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: rgba(255,255,255,0.2);
    display: flex;
    align-items: center;
    justify-content: center;
}
.srf8-ad-banner-text {
    flex: 1;
    font-weight: 500;
    word-break: break-all;
}
.srf8-ad-banner:hover .srf8-ad-banner-inner {
    opacity: 0.92;
}

/* ========== 主内容区 ========== */
.srf8-main-content {
    max-width: 1200px;
    margin: 0 auto;
}

/* ========== 文章卡片网格 ========== */
.srf8-article-grid {
    display: grid;
    gap: 12px;
    padding: 12px;
}

.srf8-columns-1 { grid-template-columns: 1fr; }
.srf8-columns-2 { grid-template-columns: repeat(2, 1fr); }
.srf8-columns-3 { grid-template-columns: repeat(3, 1fr); }

@media (max-width: 480px) {
    .srf8-columns-3 { grid-template-columns: repeat(2, 1fr); }
}

/* ========== 单篇文章卡片 ========== */
.srf8-article-card {
    background: var(--srf8-card-bg);
    border-radius: var(--srf8-radius);
    overflow: hidden;
    box-shadow: var(--srf8-shadow);
    border: 1px solid var(--srf8-border);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.srf8-article-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.srf8-card-link {
    text-decoration: none;
    color: inherit;
    display: block;
}

.srf8-card-thumb {
    position: relative;
    width: 100%;
    padding-top: 75%;
    overflow: hidden;
    background: #f0f0f0;
}

.srf8-card-thumb img {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.srf8-sticky-badge {
    position: absolute;
    top: 0; left: 0;
    background: var(--srf8-primary);
    color: white;
    font-size: 11px;
    font-weight: 500;
    padding: 3px 10px;
    border-radius: 0 0 10px 0;
    letter-spacing: 1px;
    z-index: 2;
}

.srf8-card-title {
    font-size: 14px;
    font-weight: 500;
    color: var(--srf8-text);
    line-height: 1.5;
    margin: 10px 12px 8px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 42px;
    letter-spacing: 0.3px;
}

.srf8-card-tag {
    display: inline-block;
    background: rgba(var(--srf8-tag-rgb), 0.08);
    color: var(--srf8-tag);
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 10px;
    margin: 0 12px 8px;
    font-weight: 500;
}

.srf8-card-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 12px 12px;
    font-size: 12px;
    color: var(--srf8-text-light);
    flex-wrap: wrap;
}

.srf8-card-author img,
.srf8-card-author svg {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    vertical-align: middle;
}

.srf8-card-date {
    font-size: 12px;
    color: var(--srf8-text-light);
}

.srf8-card-views {
    display: flex;
    align-items: center;
    gap: 3px;
    margin-left: auto;
}

/* ========== 分页 ========== */
.srf8-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
    padding: 20px 12px 30px;
    flex-wrap: wrap;
}

.srf8-page-num, .srf8-page-prev, .srf8-page-next {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 34px;
    padding: 0 10px;
    background: #fff;
    color: var(--srf8-text-light);
    border-radius: 8px;
    border: 1px solid var(--srf8-border);
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    transition: all 0.2s;
}

.srf8-page-num:hover, .srf8-page-prev:hover, .srf8-page-next:hover {
    background: var(--srf8-bg);
    color: var(--srf8-primary);
    border-color: var(--srf8-primary);
}

.srf8-page-num.srf8-current {
    background: var(--srf8-primary);
    color: white;
}

.srf8-page-dots { color: #999; padding: 0 4px; }

/* ========== 底部导航栏 ========== */
.srf8-bottom-nav {
    position: fixed;
    bottom: 0; left: 0; right: 0;
    background: #ffffff;
    border-top: 1px solid var(--srf8-border);
    display: flex;
    justify-content: space-around;
    align-items: flex-end;
    padding: 6px 0 calc(6px + env(safe-area-inset-bottom));
    z-index: 99;
    box-shadow: 0 -1px 8px rgba(61, 74, 79, 0.04);
}

.srf8-nav-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    text-decoration: none;
    color: #999;
    font-size: 11px;
    flex: 1;
    position: relative;
    padding: 4px 0;
    transition: color 0.2s;
}

.srf8-nav-item:hover, .srf8-nav-item.srf8-nav-active {
    color: var(--srf8-primary);
}

.srf8-nav-publish {
    flex: 0 0 auto;
    margin-top: -20px;
}

.srf8-publish-btn {
    width: 46px;
    height: 46px;
    border-radius: 14px;
    background: var(--srf8-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 3px 10px rgba(var(--srf8-primary-rgb), 0.25);
    transition: transform 0.2s;
}

.srf8-publish-btn:hover { transform: scale(1.08); }

.srf8-nav-badge {
    position: absolute;
    top: 0;
    right: 50%;
    transform: translateX(16px);
    background: #ff4757;
    color: white;
    font-size: 10px;
    min-width: 16px;
    height: 16px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    font-weight: 600;
}



/* ========== 返回顶部 ========== */
.srf8-back-to-top {
    position: fixed;
    right: 16px;
    bottom: 80px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: white;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
    display: none;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 98;
    border: none;
    color: #666;
}

.srf8-back-to-top.srf8-visible { display: flex; }

/* ========== 弹窗 ========== */
.srf8-modal-overlay {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.srf8-modal-overlay.srf8-active { display: flex; }

.srf8-modal {
    background: white;
    border-radius: 16px;
    width: 100%;
    max-width: 420px;
    max-height: 80vh;
    display: none;
    flex-direction: column;
    overflow: hidden;
    animation: srf8ModalIn 0.25s ease;
}

.srf8-modal.srf8-active { display: flex; }

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

.srf8-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid var(--srf8-border);
    position: relative;
}

.srf8-modal-header h3 {
    margin: 0;
    font-size: 17px;
    font-weight: 600;
}

.srf8-modal-close {
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
    color: #999;
    line-height: 1;
    padding: 0 4px;
}

.srf8-modal-close:hover { color: #333; }

.srf8-mark-all-read {
    position: absolute;
    right: 50px;
    background: none;
    border: none;
    color: var(--srf8-primary);
    font-size: 13px;
    cursor: pointer;
}

.srf8-modal-body {
    padding: 16px 20px;
    overflow-y: auto;
    flex: 1;
}

/* ========== 表单 ========== */
.srf8-form-group { margin-bottom: 16px; }

.srf8-form-group label {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: #555;
    margin-bottom: 6px;
}

.srf8-form-group input, .srf8-form-group textarea, .srf8-form-group select {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 14px;
    box-sizing: border-box;
    outline: none;
    transition: border-color 0.2s;
}

.srf8-form-group input:focus, .srf8-form-group textarea:focus, .srf8-form-group select:focus {
    border-color: var(--srf8-primary);
}

.srf8-form-group textarea { resize: vertical; min-height: 100px; }

.srf8-submit-btn {
    width: 100%;
    padding: 12px;
    background: var(--srf8-primary);
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.2s;
}

.srf8-submit-btn:hover { opacity: 0.9; }
.srf8-submit-btn:disabled { opacity: 0.6; cursor: not-allowed; }

/* ========== 消息列表 ========== */
.srf8-msg-item {
    padding: 12px 0;
    border-bottom: 1px solid #f0f0f0;
    cursor: pointer;
}

.srf8-msg-item:last-child { border-bottom: none; }

.srf8-msg-unread {
    background: rgba(var(--srf8-primary-rgb), 0.04);
    margin: 0 -20px;
    padding: 12px 20px;
    border-left: 3px solid var(--srf8-primary);
}

.srf8-msg-title {
    font-size: 14px;
    font-weight: 600;
    color: #333;
    margin-bottom: 4px;
}

.srf8-msg-content {
    font-size: 13px;
    color: #666;
    line-height: 1.5;
    margin-bottom: 4px;
}

.srf8-msg-time {
    font-size: 11px;
    color: #aaa;
}

/* ========== 钱包 ========== */
.srf8-wallet-balance {
    border-radius: 12px;
    padding: 20px;
    text-align: center;
    margin-bottom: 16px;
    color: white;
}

.srf8-balance-label {
    display: block;
    font-size: 13px;
    opacity: 0.9;
    margin-bottom: 6px;
}

.srf8-balance-amount {
    display: block;
    font-size: 28px;
    font-weight: 700;
}

.srf8-wallet-log-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid #f0f0f0;
}

.srf8-log-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.srf8-log-desc { font-size: 14px; color: #333; }
.srf8-log-time { font-size: 11px; color: #aaa; }

.srf8-log-amount {
    font-size: 15px;
    font-weight: 600;
}

.srf8-amount-plus { color: #00b894; }
.srf8-amount-minus { color: #ff4757; }

/* ========== 通用 ========== */
.srf8-loading, .srf8-empty {
    text-align: center;
    padding: 30px;
    color: #999;
    font-size: 14px;
}

.srf8-no-posts {
    text-align: center;
    padding: 60px 20px;
    color: #999;
}

/* ========== 文章详情页 ========== */
.srf8-single-wrap {
    padding: 12px;
    max-width: 800px;
    margin: 0 auto;
}

.srf8-single-article {
    background: white;
    border-radius: var(--srf8-radius);
    padding: 20px;
    box-shadow: var(--srf8-shadow);
}

.srf8-single-title {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: 12px;
    color: #222;
}

.srf8-single-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 13px;
    color: #999;
    flex-wrap: wrap;
    padding-bottom: 16px;
    border-bottom: 1px solid #f0f0f0;
    margin-bottom: 16px;
}

.srf8-single-author {
    display: flex;
    align-items: center;
    gap: 6px;
}

.srf8-single-author img {
    width: 24px;
    height: 24px;
    border-radius: 50%;
}

.srf8-single-views {
    display: flex;
    align-items: center;
    gap: 3px;
}

.srf8-single-thumb {
    margin-bottom: 16px;
    border-radius: 10px;
    overflow: hidden;
}

.srf8-single-content {
    font-size: 16px;
    line-height: 1.8;
    color: #333;
}

.srf8-single-content p { margin-bottom: 16px; }
.srf8-single-content img { border-radius: 8px; margin: 12px 0; }
.srf8-single-content h2, .srf8-single-content h3 { margin: 20px 0 12px; }

.srf8-single-tags {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid #f0f0f0;
}

.srf8-tag-label { color: #999; font-size: 13px; }

.srf8-single-tags a {
    display: inline-block;
    padding: 3px 10px;
    background: #f5f5f5;
    border-radius: 4px;
    font-size: 12px;
    color: #666;
    margin-right: 6px;
    margin-bottom: 4px;
}

.srf8-single-nav {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid #f0f0f0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.srf8-prev-post a, .srf8-next-post a {
    font-size: 14px;
    color: #666;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.srf8-prev-post a:hover, .srf8-next-post a:hover { color: var(--srf8-primary); }

/* ========== 评论区 ========== */
.srf8-comments-area {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid #f0f0f0;
}

.srf8-comments-title {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 16px;
}

.srf8-comment-list { list-style: none; }

.srf8-comment-item {
    display: flex;
    gap: 10px;
    padding: 12px 0;
    border-bottom: 1px solid #f5f5f5;
}

.srf8-comment-avatar img {
    width: 36px;
    height: 36px;
    border-radius: 50%;
}

.srf8-comment-body { flex: 1; }

.srf8-comment-meta {
    display: flex;
    gap: 10px;
    font-size: 12px;
    color: #999;
    margin-bottom: 4px;
}

.srf8-comment-author { color: #333; font-weight: 500; }

.srf8-comment-text {
    font-size: 14px;
    color: #444;
    line-height: 1.6;
}

.srf8-comment-actions {
    margin-top: 4px;
    font-size: 12px;
}

.srf8-comment-actions a { color: var(--srf8-primary); }

.srf8-no-comments {
    text-align: center;
    padding: 20px;
    color: #999;
}

#respond { margin-top: 20px; }
.comment-form-comment textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 14px;
    box-sizing: border-box;
}

.srf8-comment-submit {
    padding: 10px 24px;
    background: var(--srf8-primary);
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    cursor: pointer;
    margin-top: 10px;
}

/* ========== 归档/搜索页 ========== */
.srf8-archive-header {
    padding: 16px 12px 0;
    text-align: center;
}

.srf8-archive-title {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin-bottom: 4px;
}

.srf8-archive-desc, .srf8-search-count {
    font-size: 13px;
    color: #999;
}

/* ========== 404页面 ========== */
.srf8-404-wrap {
    text-align: center;
    padding: 80px 20px;
}

.srf8-404-code {
    font-size: 80px;
    font-weight: 800;
    color: var(--srf8-primary);
    line-height: 1;
    margin-bottom: 16px;
}

.srf8-404-title {
    font-size: 20px;
    color: #333;
    margin-bottom: 8px;
}

.srf8-404-desc {
    font-size: 14px;
    color: #999;
    margin-bottom: 24px;
}

.srf8-404-home {
    display: inline-block;
    padding: 12px 32px;
    background: var(--srf8-primary);
    color: white;
    border-radius: 8px;
    font-size: 15px;
}

/* ========== WordPress默认样式修正 ========== */
.alignleft { float: left; margin: 0 16px 8px 0; }
.alignright { float: right; margin: 0 0 8px 16px; }
.aligncenter { display: block; margin: 0 auto 16px; }
.wp-caption { max-width: 100%; }
.wp-caption-text { font-size: 12px; color: #999; text-align: center; padding: 4px 0; }
.sticky { /* 置顶文章样式已通过卡片标签实现 */ }
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); }

/* ========== 小屏幕自适应优化 ========== */
@media (max-width: 360px) {
    .srf8-site-name { font-size: 17px; }
    .srf8-site-qq { font-size: 11px; }
    .srf8-site-logo, .srf8-site-logo-placeholder { width: 36px; height: 36px; }
    .srf8-site-logo-placeholder { font-size: 17px; }
    .srf8-card-title { font-size: 14px; min-height: 38px; }
    .srf8-card-tag { font-size: 11px; padding: 2px 8px; }
    .srf8-card-meta { font-size: 11px; gap: 6px; }
    .srf8-nav-item { font-size: 10px; }
    .srf8-publish-btn { width: 44px; height: 44px; }
    .srf8-publish-btn svg { width: 24px; height: 24px; }
    .srf8-article-grid { gap: 8px; padding: 8px; }
    .srf8-single-title { font-size: 19px; }
    .srf8-single-content { font-size: 15px; }
}

@media (max-width: 320px) {
    .srf8-site-name { font-size: 15px; }
    .srf8-card-title { font-size: 13px; min-height: 36px; }
    .srf8-nav-item { font-size: 9px; }
}

/* 确保底部导航不被浏览器工具栏遮挡 */
body {
    padding-bottom: calc(70px + env(safe-area-inset-bottom));
}

/* 横屏适配 */
@media (min-width: 600px) and (max-width: 900px) {
    .srf8-article-grid { padding: 16px; gap: 16px; }
    .srf8-card-title { font-size: 16px; }
}

/* 确保图片不溢出 */
.srf8-card-thumb img, .srf8-single-thumb img {
    max-width: 100%;
}

/* 弹窗在小屏幕上占满宽度 */
@media (max-width: 480px) {
    .srf8-modal { max-width: 100%; margin: 0 10px; }
    .srf8-modal-body { padding: 12px 16px; }
    .srf8-modal-header { padding: 12px 16px; }
}

/* 防止文字溢出 */
.srf8-card-title, .srf8-msg-title, .srf8-log-desc {
    word-break: break-all;
}

/* ========== 媒体上传器 ========== */
.srf8-media-uploader { margin-top: 4px; }

.srf8-media-btn {
    display: inline-block;
    padding: 8px 16px;
    background: #f5f5f5;
    color: #555;
    border: 1px dashed #ccc;
    border-radius: 8px;
    font-size: 13px;
    cursor: pointer;
    transition: all 0.2s;
}

.srf8-media-btn:hover {
    background: var(--srf8-primary);
    color: white;
    border-color: var(--srf8-primary);
}

.srf8-media-preview {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.srf8-media-item {
    position: relative;
    width: 70px;
    height: 70px;
    border-radius: 8px;
    overflow: hidden;
    background: #f0f0f0;
}

.srf8-media-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.srf8-media-file {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4px;
    text-align: center;
}

.srf8-file-icon { font-size: 24px; margin-bottom: 2px; }

.srf8-file-name {
    font-size: 10px;
    color: #666;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
}

.srf8-media-remove {
    position: absolute;
    top: 2px;
    right: 2px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.6);
    color: white;
    border: none;
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.srf8-media-remove:hover { background: #ff4757; }

/* ========== 用户中心 ========== */
.srf8-user-profile {
    text-align: center;
    padding-bottom: 16px;
    border-bottom: 1px solid #f0f0f0;
    margin-bottom: 16px;
}

.srf8-user-avatar-wrap {
    position: relative;
    display: inline-block;
    margin-bottom: 10px;
}

.srf8-user-avatar {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    overflow: hidden;
    margin: 0 auto;
}

.srf8-user-avatar img,
.srf8-user-avatar svg {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.srf8-avatar-upload-btn {
    display: block;
    margin: 8px auto 0;
    padding: 4px 12px;
    background: var(--srf8-primary);
    color: white;
    border: none;
    border-radius: 12px;
    font-size: 12px;
    cursor: pointer;
}

.srf8-avatar-upload-btn:hover { opacity: 0.9; }

.srf8-user-name {
    font-size: 17px;
    font-weight: 600;
    color: #333;
    margin-bottom: 2px;
}

.srf8-user-email {
    font-size: 13px;
    color: #999;
    margin-bottom: 14px;
}

.srf8-user-stats {
    display: flex;
    justify-content: center;
    gap: 24px;
}

.srf8-stat-item {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.srf8-stat-num {
    font-size: 18px;
    font-weight: 700;
    color: var(--srf8-primary);
}

.srf8-stat-label {
    font-size: 12px;
    color: #999;
    margin-top: 2px;
}

.srf8-user-links { margin-bottom: 16px; }

.srf8-user-links-title {
    font-size: 14px;
    font-weight: 600;
    color: #333;
    margin-bottom: 10px;
}

.srf8-user-links-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

.srf8-user-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 12px 6px;
    background: #f8f8f8;
    border-radius: 10px;
    text-decoration: none;
    transition: all 0.2s;
}

.srf8-user-link:hover {
    background: var(--srf8-primary);
    transform: translateY(-2px);
}

.srf8-user-link:hover .srf8-user-link-name { color: white; }

.srf8-user-link-icon { font-size: 24px; margin-bottom: 4px; }

.srf8-user-link-name {
    font-size: 12px;
    color: #555;
    text-align: center;
}

.srf8-user-actions {
    display: flex;
    gap: 10px;
}

.srf8-user-action-btn {
    flex: 1;
    text-align: center;
    padding: 10px;
    background: #f5f5f5;
    color: #555;
    border-radius: 8px;
    font-size: 14px;
    text-decoration: none;
    transition: all 0.2s;
}

.srf8-user-action-btn:hover { background: #eee; }

.srf8-user-action-btn.srf8-logout {
    background: #fff0f0;
    color: #ff4757;
}

.srf8-user-action-btn.srf8-logout:hover {
    background: #ff4757;
    color: white;
}

@media (max-width: 360px) {
    .srf8-user-links-grid { grid-template-columns: repeat(2, 1fr); }
    .srf8-media-item { width: 60px; height: 60px; }
}

/* ========== 小工具区域 ========== */
.srf8-widget-area { padding: 12px; margin: 0; }
.srf8-home-top-widgets { padding-top: 12px; padding-bottom: 0; }
.srf8-home-bottom-widgets { padding-top: 0; padding-bottom: 12px; }
.srf8-single-widgets { padding: 16px 12px; }
.srf8-global-bottom-widgets { padding: 12px; padding-bottom: 0; }
.srf8-sidebar-widgets { padding: 12px 16px; border-top: 1px solid #f0f0f0; }

.srf8-widget {
    background: white;
    border-radius: 12px;
    padding: 14px;
    margin-bottom: 12px;
    font-size: 14px;
    color: #333;
    word-break: break-word;
}
.srf8-widget:last-child { margin-bottom: 0; }
.srf8-widget-title {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin: 0 0 10px 0;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--srf8-primary);
    display: inline-block;
    padding-bottom: 4px;
}
.srf8-widget ul { margin: 0; padding-left: 18px; }
.srf8-widget li { margin-bottom: 6px; line-height: 1.5; }
.srf8-widget a { color: var(--srf8-primary); text-decoration: none; }
.srf8-widget a:hover { text-decoration: underline; }
.srf8-widget img { max-width: 100%; height: auto; border-radius: 8px; }
.srf8-widget p { margin: 0 0 8px 0; line-height: 1.6; }
.srf8-sidebar .srf8-widget { background: #f8f8f8; }

/* ========== 生成分享海报 ========== */
.srf8-poster-section { text-align: center; padding: 20px 12px; }
.srf8-poster-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 24px;
    background: linear-gradient(135deg, var(--srf8-primary), var(--srf8-primary-light));
    color: white;
    border: none;
    border-radius: 24px;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(var(--srf8-primary-rgb), 0.3);
    transition: all 0.2s;
}
.srf8-poster-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(var(--srf8-primary-rgb), 0.4); }
.srf8-poster-btn:active { transform: translateY(0); }

.srf8-poster-modal {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    z-index: 99999; display: flex; align-items: center; justify-content: center;
}
.srf8-poster-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); }
.srf8-poster-box { position: relative; width: 90%; max-width: 360px; max-height: 90vh; display: flex; flex-direction: column; align-items: center; }
.srf8-poster-header { width: 100%; display: flex; justify-content: space-between; align-items: center; color: white; font-size: 14px; margin-bottom: 12px; }
.srf8-poster-close {
    width: 32px; height: 32px; border-radius: 50%; background: rgba(255,255,255,0.2);
    color: white; border: none; font-size: 20px; line-height: 1; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
}
.srf8-poster-close:hover { background: rgba(255,255,255,0.3); }
.srf8-poster-canvas-wrap { width: 100%; border-radius: 12px; overflow: hidden; background: white; box-shadow: 0 8px 32px rgba(0,0,0,0.3); }
.srf8-poster-canvas-wrap canvas { width: 100%; display: block; }
.srf8-poster-tip { color: rgba(255,255,255,0.8); font-size: 13px; margin-top: 12px; text-align: center; }

/* 投稿表单分类下拉样式 */
#srf8PostCategory {
    width: 100%; padding: 10px 12px; border: 1px solid #e0e0e0;
    border-radius: 8px; font-size: 14px; background: white; color: #333;
}
#srf8PostCategory:focus { outline: none; border-color: var(--srf8-primary); }

/* ========== 侧边栏头像优化 ========== */
.srf8-sidebar-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 20px 16px;
    background: linear-gradient(135deg, var(--srf8-primary), var(--srf8-primary-light));
    color: white;
}
.srf8-sidebar-avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    border: 2px solid rgba(255,255,255,0.5);
    background: rgba(255,255,255,0.2);
}
.srf8-sidebar-avatar img,
.srf8-sidebar-avatar svg {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    display: block;
}
.srf8-sidebar-user-info {
    flex: 1;
    min-width: 0;
}
.srf8-sidebar-username {
    font-size: 17px;
    font-weight: 600;
    margin: 0 0 2px 0;
    color: white;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.srf8-sidebar-site {
    font-size: 12px;
    margin: 0;
    color: rgba(255,255,255,0.85);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ========== 投稿表单美化 ========== */
.srf8-form-label {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: #333;
    margin-bottom: 8px;
}
.srf8-required {
    color: #ff4757;
    margin-left: 2px;
}
.srf8-form-input {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    font-size: 14px;
    background: #fafafa;
    color: #333;
    transition: all 0.2s;
    box-sizing: border-box;
}
.srf8-form-input:focus {
    outline: none;
    border-color: var(--srf8-primary);
    background: #fff;
    box-shadow: 0 0 0 3px rgba(var(--srf8-primary-rgb), 0.1);
}
.srf8-form-textarea {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    font-size: 14px;
    background: #fafafa;
    color: #333;
    resize: vertical;
    transition: all 0.2s;
    box-sizing: border-box;
    font-family: inherit;
    line-height: 1.6;
}
.srf8-form-textarea:focus {
    outline: none;
    border-color: var(--srf8-primary);
    background: #fff;
    box-shadow: 0 0 0 3px rgba(var(--srf8-primary-rgb), 0.1);
}
.srf8-form-tip {
    font-size: 12px;
    color: #999;
    margin-top: 6px;
    text-align: right;
}
.srf8-form-row {
    display: flex;
    gap: 12px;
}
.srf8-form-half {
    flex: 1;
    min-width: 0;
}
/* 标签类型按钮组 */
.srf8-tag-type-group {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}
.srf8-tag-type-item {
    flex: 1;
    min-width: 0;
    cursor: pointer;
}
.srf8-tag-type-item input {
    display: none;
}
.srf8-tag-type-item span {
    display: block;
    text-align: center;
    padding: 8px 4px;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    font-size: 13px;
    color: #666;
    background: #fafafa;
    transition: all 0.2s;
}
.srf8-tag-type-item input:checked + span {
    background: var(--srf8-primary);
    border-color: var(--srf8-primary);
    color: #fff;
    font-weight: 500;
}
/* 媒体上传按钮美化 */
.srf8-media-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    padding: 12px;
    border: 2px dashed #d0d0d0;
    border-radius: 10px;
    background: #fafafa;
    color: #666;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.2s;
}
.srf8-media-btn:hover {
    border-color: var(--srf8-primary);
    color: var(--srf8-primary);
    background: #fff5f9;
}
/* 提交按钮 */
.srf8-submit-btn {
    width: 100%;
    padding: 13px;
    background: linear-gradient(135deg, var(--srf8-primary), var(--srf8-primary-light));
    color: #fff;
    border: none;
    border-radius: 10px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    margin-top: 8px;
    transition: all 0.2s;
    box-shadow: 0 4px 12px rgba(var(--srf8-primary-rgb), 0.25);
}
.srf8-submit-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(var(--srf8-primary-rgb), 0.35);
}
.srf8-submit-btn:active {
    transform: translateY(0);
}
.srf8-submit-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}
.srf8-form-notice {
    text-align: center;
    font-size: 12px;
    color: #999;
    margin-top: 10px;
}
/* 小屏幕适配 */
@media (max-width: 360px) {
    .srf8-form-row { flex-direction: column; gap: 0; }
    .srf8-tag-type-item span { font-size: 12px; padding: 7px 2px; }
}

/* 钱包充值按钮 */
.srf8-wallet-recharge-btn {
    display: inline-block;
    margin-top: 12px;
    padding: 8px 20px;
    background: rgba(255,255,255,0.25);
    color: #fff;
    border-radius: 20px;
    font-size: 13px;
    text-decoration: none;
    border: 1px solid rgba(255,255,255,0.4);
    transition: all 0.2s;
}
.srf8-wallet-recharge-btn:hover {
    background: rgba(255,255,255,0.35);
}

/* 侧边栏管理员后台按钮 */
.srf8-admin-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    padding: 10px;
    background: linear-gradient(135deg, #667eea, #764ba2);
    color: #fff;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.2s;
    margin-bottom: 8px;
}
.srf8-admin-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(102,126,234,0.4);
}

/* ========== 用户中心大弹窗 ========== */
.srf8-modal-large {
    width: 100%;
    max-width: 100%;
    height: 100%;
    max-height: 100%;
    top: 0 !important;
    left: 0 !important;
    transform: none !important;
    border-radius: 0 !important;
    display: flex;
    flex-direction: column;
}
.srf8-modal-large .srf8-modal-header {
    flex-shrink: 0;
}
.srf8-modal-large .srf8-modal-body {
    flex: 1;
    overflow-y: auto;
    padding: 0 !important;
}

/* 用户中心头部 */
.srf8-user-header {
    display: flex;
    align-items: center;
    padding: 20px 16px;
    background: linear-gradient(135deg, var(--srf8-primary), var(--srf8-primary-light));
    color: #fff;
    position: relative;
}
.srf8-user-avatar-large {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    overflow: hidden;
    border: 3px solid rgba(255,255,255,0.3);
    flex-shrink: 0;
}
.srf8-user-avatar-large img,
.srf8-user-avatar-large svg {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}
.srf8-user-info-main {
    flex: 1;
    margin-left: 14px;
    min-width: 0;
}
.srf8-user-name-large {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 4px;
}
.srf8-user-email {
    font-size: 13px;
    opacity: 0.85;
    margin-bottom: 2px;
}
.srf8-user-meta {
    font-size: 12px;
    opacity: 0.7;
}
.srf8-user-header .srf8-avatar-upload-btn {
    position: absolute;
    top: 16px;
    right: 16px;
    padding: 5px 12px;
    background: rgba(255,255,255,0.25);
    color: #fff;
    border: 1px solid rgba(255,255,255,0.4);
    border-radius: 14px;
    font-size: 12px;
    cursor: pointer;
}

/* 统计行 */
.srf8-user-stats-row {
    display: flex;
    background: #fff;
    border-bottom: 8px solid #f5f5f7;
}
.srf8-stat-block {
    flex: 1;
    text-align: center;
    padding: 16px 8px;
    border-right: 1px solid #f0f0f0;
}
.srf8-stat-block:last-child {
    border-right: none;
}
.srf8-stat-num-large {
    display: block;
    font-size: 22px;
    font-weight: 700;
    color: var(--srf8-primary);
    margin-bottom: 4px;
}
.srf8-stat-block .srf8-stat-label {
    font-size: 12px;
    color: #999;
}

/* 菜单列表 */
.srf8-user-menu-list {
    background: #fff;
    margin-bottom: 8px;
}
.srf8-user-menu-title {
    padding: 12px 16px 8px;
    font-size: 13px;
    color: #999;
    font-weight: 500;
}
.srf8-user-menu-item {
    display: flex;
    align-items: center;
    padding: 14px 16px;
    text-decoration: none;
    color: #333;
    border-bottom: 1px solid #f5f5f5;
    transition: background 0.2s;
}
.srf8-user-menu-item:last-child {
    border-bottom: none;
}
.srf8-user-menu-item:active {
    background: #f8f8f8;
}
.srf8-menu-icon {
    font-size: 20px;
    margin-right: 12px;
    width: 24px;
    text-align: center;
}
.srf8-menu-text {
    flex: 1;
    font-size: 15px;
}
.srf8-menu-arrow {
    color: #ccc;
    font-size: 20px;
    font-weight: 300;
}
.srf8-logout-item .srf8-menu-text {
    color: #ff4757;
}




/* ========== 首页三图信息流卡片模式（精准还原参考图） ========== */
.srf8-columns-1 {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    padding: 16px 12px !important;
}
.srf8-card-feed {
    border-radius: 18px !important;
    background: #ffffff !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
    overflow: hidden !important;
}
.srf8-card-feed:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 14px rgba(0,0,0,0.07) !important;
}
.srf8-card-feed .srf8-card-link {
    display: block !important;
    padding: 20px 20px 18px !important;
}
.srf8-card-feed .srf8-card-title {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    line-height: 1.35 !important;
    margin: 0 0 14px !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    min-height: auto !important;
    letter-spacing: 0.2px !important;
}
.srf8-card-feed .srf8-card-images {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
    margin-bottom: 14px !important;
}
.srf8-card-feed .srf8-card-img-item {
    position: relative !important;
    width: 100% !important;
    padding-top: 75% !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    background: #f0f0f0 !important;
}
.srf8-card-feed .srf8-card-img-item img {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}
.srf8-card-feed .srf8-card-tag-row {
    margin-bottom: 14px !important;
}
.srf8-card-feed .srf8-card-tag {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    background: rgba(9, 132, 227, 0.08) !important;
    color: #0984e3 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    padding: 5px 12px !important;
    border-radius: 6px !important;
    margin: 0 !important;
    line-height: 1 !important;
}
.srf8-card-feed .srf8-card-tag svg {
    flex-shrink: 0 !important;
    width: 15px !important;
    height: 15px !important;
}
.srf8-card-feed .srf8-card-meta {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 0 !important;
    font-size: 14px !important;
    color: #999 !important;
}
.srf8-card-feed .srf8-card-author img,
.srf8-card-feed .srf8-card-author svg {
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
    vertical-align: middle !important;
}
.srf8-card-feed .srf8-card-dot {
    width: 8px !important;
    height: 8px !important;
    border-radius: 50% !important;
    background: #e84393 !important;
    flex-shrink: 0 !important;
}
.srf8-card-feed .srf8-card-date {
    font-size: 14px !important;
    color: #999 !important;
}
.srf8-card-feed .srf8-card-views {
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
    margin-left: auto !important;
    font-size: 16px !important;
    color: #999 !important;
    font-weight: 500 !important;
}
.srf8-card-feed .srf8-card-views svg {
    width: 17px !important;
    height: 17px !important;
}
/* 小屏适配 */
@media (max-width: 400px) {
    .srf8-card-feed .srf8-card-title {
        font-size: 20px !important;
    }
    .srf8-card-feed .srf8-card-link {
        padding: 18px 16px 16px !important;
    }
    .srf8-columns-1 {
        padding: 14px 10px !important;
        gap: 14px !important;
    }
}

/* ========== 首页卡片摘要样式 ========== */
.srf8-card-feed .srf8-card-excerpt {
    font-size: 14px;
    color: #666;
    line-height: 1.6;
    margin-bottom: 14px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
@media (max-width: 400px) {
    .srf8-card-feed .srf8-card-excerpt {
        font-size: 13px;
    }
}

/* ========== 卡片文章标签和评论数样式 ========== */
.srf8-card-feed .srf8-card-tag-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    margin-bottom: 14px !important;
}
.srf8-card-feed .srf8-card-post-tags {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    justify-content: flex-end;
    flex: 1;
}
.srf8-card-feed .srf8-card-post-tag {
    font-size: 12px;
    color: #999;
    background: #f5f5f5;
    padding: 3px 8px;
    border-radius: 4px;
    line-height: 1.4;
    white-space: nowrap;
}
.srf8-card-feed .srf8-card-comments {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 14px;
    color: #999;
}
.srf8-card-feed .srf8-card-comments svg {
    width: 15px;
    height: 15px;
}
@media (max-width: 400px) {
    .srf8-card-feed .srf8-card-post-tag {
        font-size: 11px;
        padding: 2px 6px;
    }
    .srf8-card-feed .srf8-card-comments {
        font-size: 13px;
    }
}

/* ========== 卡片更新时间样式 ========== */
.srf8-card-feed .srf8-card-updated {
    display: flex;
    align-items: center;
    gap: 3px;
    font-size: 12px;
    color: #00b894;
    white-space: nowrap;
}
.srf8-card-feed .srf8-card-updated svg {
    width: 13px;
    height: 13px;
}

/* ========== 卡片密度：紧凑模式 ========== */
.srf8-card-feed.srf8-density-compact .srf8-card-link {
    padding: 14px 14px 12px !important;
}
.srf8-card-feed.srf8-density-compact .srf8-card-title {
    font-size: 18px !important;
    margin-bottom: 10px !important;
}
.srf8-card-feed.srf8-density-compact .srf8-card-images {
    gap: 5px !important;
    margin-bottom: 10px !important;
}
.srf8-card-feed.srf8-density-compact .srf8-card-img-item {
    border-radius: 8px !important;
}
.srf8-card-feed.srf8-density-compact .srf8-card-tag-row {
    margin-bottom: 10px !important;
}
.srf8-card-feed.srf8-density-compact .srf8-card-tag {
    font-size: 12px !important;
    padding: 3px 8px !important;
}
.srf8-card-feed.srf8-density-compact .srf8-card-post-tag {
    font-size: 11px !important;
    padding: 2px 6px !important;
}
.srf8-card-feed.srf8-density-compact .srf8-card-excerpt {
    font-size: 13px !important;
    margin-bottom: 10px !important;
    -webkit-line-clamp: 1 !important;
}
.srf8-card-feed.srf8-density-compact .srf8-card-meta {
    font-size: 12px !important;
    gap: 6px !important;
}
.srf8-card-feed.srf8-density-compact .srf8-card-author img,
.srf8-card-feed.srf8-density-compact .srf8-card-author svg {
    width: 22px !important;
    height: 22px !important;
}
.srf8-card-feed.srf8-density-compact .srf8-card-dot {
    width: 6px !important;
    height: 6px !important;
}
.srf8-card-feed.srf8-density-compact .srf8-card-date,
.srf8-card-feed.srf8-density-compact .srf8-card-comments,
.srf8-card-feed.srf8-density-compact .srf8-card-updated {
    font-size: 12px !important;
}
.srf8-card-feed.srf8-density-compact .srf8-card-views {
    font-size: 13px !important;
}
.srf8-card-feed.srf8-density-compact .srf8-card-views svg {
    width: 14px !important;
    height: 14px !important;
}

/* ========== 卡片密度：宽松模式 ========== */
.srf8-card-feed.srf8-density-loose .srf8-card-link {
    padding: 24px 22px 22px !important;
}
.srf8-card-feed.srf8-density-loose .srf8-card-title {
    font-size: 24px !important;
    margin-bottom: 16px !important;
}
.srf8-card-feed.srf8-density-loose .srf8-card-images {
    gap: 10px !important;
    margin-bottom: 16px !important;
}
.srf8-card-feed.srf8-density-loose .srf8-card-img-item {
    border-radius: 14px !important;
}
.srf8-card-feed.srf8-density-loose .srf8-card-tag-row {
    margin-bottom: 16px !important;
}
.srf8-card-feed.srf8-density-loose .srf8-card-tag {
    font-size: 15px !important;
    padding: 6px 14px !important;
}
.srf8-card-feed.srf8-density-loose .srf8-card-post-tag {
    font-size: 13px !important;
    padding: 4px 10px !important;
}
.srf8-card-feed.srf8-density-loose .srf8-card-excerpt {
    font-size: 15px !important;
    margin-bottom: 16px !important;
}
.srf8-card-feed.srf8-density-loose .srf8-card-meta {
    font-size: 15px !important;
    gap: 10px !important;
}
.srf8-card-feed.srf8-density-loose .srf8-card-author img,
.srf8-card-feed.srf8-density-loose .srf8-card-author svg {
    width: 32px !important;
    height: 32px !important;
}
.srf8-card-feed.srf8-density-loose .srf8-card-dot {
    width: 9px !important;
    height: 9px !important;
}
.srf8-card-feed.srf8-density-loose .srf8-card-date,
.srf8-card-feed.srf8-density-loose .srf8-card-comments,
.srf8-card-feed.srf8-density-loose .srf8-card-updated {
    font-size: 14px !important;
}
.srf8-card-feed.srf8-density-loose .srf8-card-views {
    font-size: 17px !important;
}
.srf8-card-feed.srf8-density-loose .srf8-card-views svg {
    width: 18px !important;
    height: 18px !important;
}

/* 紧凑模式下网格间距也缩小 */
.srf8-columns-1:has(.srf8-density-compact) {
    gap: 10px !important;
    padding: 10px !important;
}
/* 宽松模式下网格间距也放大 */
.srf8-columns-1:has(.srf8-density-loose) {
    gap: 20px !important;
    padding: 20px 14px !important;
}

/* ========== 优化meta栏布局：缩小字体，确保一行整齐 ========== */
.srf8-card-feed .srf8-card-meta {
    font-size: 12px !important;
    gap: 6px !important;
    flex-wrap: nowrap !important;
    overflow: hidden !important;
}
.srf8-card-feed .srf8-card-author img,
.srf8-card-feed .srf8-card-author svg {
    width: 22px !important;
    height: 22px !important;
}
.srf8-card-feed .srf8-card-dot {
    width: 6px !important;
    height: 6px !important;
}
.srf8-card-feed .srf8-card-date {
    font-size: 12px !important;
    white-space: nowrap !important;
}
.srf8-card-feed .srf8-card-comments {
    font-size: 12px !important;
    gap: 3px !important;
    white-space: nowrap !important;
}
.srf8-card-feed .srf8-card-comments svg {
    width: 13px !important;
    height: 13px !important;
}
.srf8-card-feed .srf8-card-updated {
    font-size: 11px !important;
    gap: 3px !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
}
.srf8-card-feed .srf8-card-updated svg {
    width: 12px !important;
    height: 12px !important;
}
.srf8-card-feed .srf8-card-views {
    font-size: 13px !important;
    gap: 3px !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
}
.srf8-card-feed .srf8-card-views svg {
    width: 14px !important;
    height: 14px !important;
}
/* 紧凑模式下进一步缩小 */
.srf8-card-feed.srf8-density-compact .srf8-card-meta {
    font-size: 11px !important;
    gap: 4px !important;
}
.srf8-card-feed.srf8-density-compact .srf8-card-updated {
    font-size: 10px !important;
}
.srf8-card-feed.srf8-density-compact .srf8-card-views {
    font-size: 12px !important;
}

/* ========== 重新设计搜索弹窗 ========== */
.srf8-search-overlay {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.5);
    z-index: 200;
    align-items: flex-start;
    justify-content: center;
}
.srf8-search-overlay.srf8-active {
    display: flex;
    animation: srf8FadeIn 0.2s ease;
}
@keyframes srf8FadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
.srf8-search-modal {
    background: #fff;
    width: 100%;
    max-width: 100%;
    border-radius: 0 0 16px 16px;
    overflow: hidden;
    animation: srf8SlideDown 0.25s ease;
    box-shadow: 0 4px 20px rgba(0,0,0,0.1);
}
@keyframes srf8SlideDown {
    from { transform: translateY(-100%); }
    to { transform: translateY(0); }
}
.srf8-search-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border-bottom: 1px solid #f0f0f0;
}
.srf8-search-form {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
}
.srf8-search-input-wrap {
    flex: 1;
    display: flex;
    align-items: center;
    background: #f5f5f7;
    border-radius: 20px;
    padding: 8px 14px;
    gap: 8px;
    transition: background 0.2s;
}
.srf8-search-input-wrap:focus-within {
    background: #fff;
    box-shadow: 0 0 0 2px rgba(122,158,159,0.3);
}
.srf8-search-icon {
    color: #999;
    flex-shrink: 0;
}
.srf8-search-input {
    flex: 1;
    border: none;
    background: transparent;
    font-size: 15px;
    outline: none;
    padding: 0;
    color: #333;
}
.srf8-search-input::placeholder {
    color: #bbb;
}
.srf8-search-clear {
    background: none;
    border: none;
    color: #bbb;
    cursor: pointer;
    padding: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.srf8-search-clear:hover {
    color: #999;
}
.srf8-search-submit {
    background: var(--srf8-primary, #7a9e9f);
    color: #fff;
    border: none;
    padding: 8px 18px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    white-space: nowrap;
    transition: opacity 0.2s;
}
.srf8-search-submit:hover {
    opacity: 0.9;
}
.srf8-search-cancel {
    background: none;
    border: none;
    color: #666;
    font-size: 15px;
    cursor: pointer;
    padding: 6px 4px;
    white-space: nowrap;
}
.srf8-search-cancel:hover {
    color: #333;
}
.srf8-search-body {
    padding: 16px;
    max-height: 60vh;
    overflow-y: auto;
}
.srf8-search-hot-title {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 600;
    color: #333;
    margin-bottom: 12px;
}
.srf8-search-hot-title svg {
    color: #ff9f43;
}
.srf8-search-hot-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.srf8-hot-tag {
    display: inline-block;
    padding: 6px 14px;
    background: #f5f5f7;
    color: #555;
    font-size: 13px;
    border-radius: 16px;
    text-decoration: none;
    transition: all 0.2s;
}
.srf8-hot-tag:hover {
    background: var(--srf8-primary, #7a9e9f);
    color: #fff;
}
/* 覆盖旧的搜索框样式 */
.srf8-search-box {
    display: none !important;
}

/* ========== 修复卡片间距和自适应 ========== */
.srf8-columns-1 {
    gap: 12px !important;
    padding: 12px !important;
}
.srf8-card-feed {
    margin: 0 !important;
}
/* 确保卡片内容不会溢出 */
.srf8-card-feed .srf8-card-link {
    overflow: hidden !important;
}
.srf8-card-feed .srf8-card-excerpt {
    word-break: break-all !important;
    overflow: hidden !important;
}
