/* 莒县故事·club 社区样式 */
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'PingFang SC','Microsoft YaHei','Helvetica Neue',sans-serif; background:#f4f3ee; color:#1a1b1c; font-size:14px; }

/* 顶栏 */
.club-top { background:#fff; border-bottom:1px solid #e4e3dd; position:sticky; top:0; z-index:10; }
.club-top-inner { max-width:1060px; margin:0 auto; display:flex; align-items:center; height:56px; padding:0 16px; gap:20px; }
.club-logo { font-size:18px; font-weight:700; color:#8b5e3c; text-decoration:none; }
.club-logo span { color:#c8a06a; }
.club-top-right { margin-left:auto; display:flex; align-items:center; gap:12px; }
.club-btn { display:inline-block; background:#8b5e3c; color:#fff; border:none; border-radius:20px; padding:7px 18px; font-size:13px; cursor:pointer; text-decoration:none; }
.club-btn:hover { opacity:.9; }
.club-btn-outline { background:#fff; color:#8b5e3c; border:1px solid #c8a06a; }
.club-user { font-size:13px; color:#555; }
.club-user-link { font-size:13px; color:#8b5e3c; text-decoration:none; border:1px solid #c8a06a; border-radius:14px; padding:3px 12px; }
.club-user-link:hover { background:#8b5e3c; color:#fff; }

/* 布局 */
.club-wrap { max-width:1060px; margin:20px auto; padding:0 16px; display:flex; gap:20px; align-items:flex-start; }
.club-main { flex:1; min-width:0; }
.club-side { width:260px; flex-shrink:0; }

/* 分类tab */
.club-tabs { display:flex; gap:8px; background:#fff; border:1px solid #e4e3dd; border-radius:10px; padding:10px; margin-bottom:14px; flex-wrap:wrap; }
.club-tab { padding:6px 16px; border-radius:16px; cursor:pointer; font-size:13px; color:#555; background:#f4f3ee; border:1px solid transparent; }
.club-tab.on { background:#8b5e3c; color:#fff; }

/* 帖子卡片 */
.club-card { background:#fff; border:1px solid #e4e3dd; border-radius:10px; padding:16px; margin-bottom:12px; }
.club-card-head { display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.club-avatar { width:36px; height:36px; border-radius:50%; background:#c8a06a; color:#fff; display:flex; align-items:center; justify-content:center; font-size:15px; font-weight:600; }
.club-card-meta { flex:1; min-width:0; }
.club-card-nick { font-size:13px; font-weight:600; }
.club-card-time { font-size:12px; color:#999; margin-top:2px; }
.club-badge { font-size:11px; padding:2px 8px; border-radius:10px; background:#f0f9eb; color:#52c41a; border:1px solid #b7eb8f; }
.club-badge.adopted { background:#fff7e6; color:#d48806; border-color:#ffd591; }
.club-card-title { font-size:16px; font-weight:600; color:#1a1b1c; margin:6px 0 6px; line-height:1.4; }
.club-card-title a { color:inherit; text-decoration:none; }
.club-card-title a:hover { color:#8b5e3c; }
.club-card-content { font-size:13.5px; color:#444; line-height:1.7; max-height:72px; overflow:hidden; }
.club-card-foot { display:flex; gap:18px; margin-top:10px; font-size:12px; color:#999; }
.club-card-foot i { font-style:normal; }
.club-cat { display:inline-block; font-size:11px; padding:2px 8px; border-radius:4px; background:#f4f3ee; color:#8b5e3c; margin-right:6px; }

/* 侧栏 */
.club-panel { background:#fff; border:1px solid #e4e3dd; border-radius:10px; padding:14px; margin-bottom:14px; }
.club-panel h3 { font-size:14px; font-weight:600; margin-bottom:10px; color:#8b5e3c; }
.club-panel p, .club-panel li { font-size:12.5px; color:#666; line-height:1.8; }
.club-panel ul { list-style:none; }

/* 详情页 */
.club-detail { background:#fff; border:1px solid #e4e3dd; border-radius:10px; padding:24px; }
.club-detail h1 { font-size:22px; line-height:1.4; margin:10px 0 12px; }
.club-detail-meta { font-size:13px; color:#999; padding-bottom:14px; border-bottom:1px solid #f0efe9; margin-bottom:16px; }
.club-detail-content { font-size:15px; line-height:1.9; color:#2c2c2c; }
.club-detail-content img { max-width:100%; border-radius:8px; margin:8px 0; }
.club-detail-content p { margin:10px 0; }
.club-like-btn { display:inline-flex; align-items:center; gap:6px; background:#fff7e6; color:#d48806; border:1px solid #ffd591; border-radius:18px; padding:8px 22px; font-size:14px; cursor:pointer; }
.club-like-btn.liked { background:#d48806; color:#fff; }
.club-comment-box { margin-top:16px; }
.club-comment-input { width:100%; border:1px solid #e4e3dd; border-radius:8px; padding:10px; font-size:13px; resize:vertical; min-height:60px; font-family:inherit; }
.club-comment-item { padding:10px 0; border-bottom:1px solid #f0efe9; }
.club-comment-nick { font-size:12.5px; font-weight:600; }
.club-comment-time { font-size:11px; color:#bbb; margin-left:8px; }
.club-comment-text { font-size:13.5px; color:#333; margin-top:4px; line-height:1.6; }

/* 表单 */
.club-form { background:#fff; border:1px solid #e4e3dd; border-radius:10px; padding:24px; }
.club-form label { display:block; font-size:13px; color:#555; margin:14px 0 6px; }
.club-form label:first-child { margin-top:0; }
.club-input, .club-textarea, .club-select { width:100%; border:1px solid #e4e3dd; border-radius:8px; padding:9px 12px; font-size:13.5px; font-family:inherit; background:#fff; }
.club-textarea { min-height:160px; resize:vertical; line-height:1.7; }
.club-form-row { display:flex; gap:12px; }
.club-form-row > div { flex:1; }
.club-form .club-btn { margin-top:20px; padding:10px 34px; font-size:14px; }

/* 登录浮层 */
.club-mask { position:fixed; inset:0; background:rgba(0,0,0,.45); display:none; align-items:center; justify-content:center; z-index:999; padding:16px; box-sizing:border-box; }
.club-mask.show { display:flex; }
.club-login { background:#fff; border-radius:12px; padding:26px; width:320px; max-width:100%; max-height:calc(100vh - 32px); overflow-y:auto; box-sizing:border-box; }
.club-login h3 { font-size:16px; margin-bottom:14px; }
.club-login .tip { font-size:12px; color:#999; margin-top:10px; }

/* 后台 */
.club-admin-nav { display:flex; gap:10px; margin-bottom:14px; flex-wrap:wrap; }
.club-admin-nav .club-tab { background:#fff; }
.club-admin-nav .club-tab.on { background:#409eff; }
.club-table { width:100%; border-collapse:collapse; background:#fff; border:1px solid #e4e3dd; border-radius:10px; overflow:hidden; font-size:13px; }
.club-table th, .club-table td { padding:10px 12px; border-bottom:1px solid #f0efe9; text-align:left; }
.club-table th { background:#faf9f5; color:#555; font-weight:600; }
.club-table tr:last-child td { border-bottom:none; }
.club-ok-btn { background:#52c41a; color:#fff; border:none; border-radius:4px; padding:4px 12px; cursor:pointer; font-size:12px; }
.club-err-btn { background:#ea6668; color:#fff; border:none; border-radius:4px; padding:4px 12px; cursor:pointer; font-size:12px; }
.club-warn-btn { background:#d48806; color:#fff; border:none; border-radius:4px; padding:4px 12px; cursor:pointer; font-size:12px; }
.club-empty { text-align:center; color:#999; padding:40px 0; }

/* 移动端 */
@media (max-width:760px) {
    .club-wrap { flex-direction:column; }
    .club-side { width:100%; order:2; }
    .club-top-inner { height:48px; }
    .club-logo { font-size:16px; }
    .club-detail { padding:14px; }
    .club-detail h1 { font-size:18px; }
    .club-form-row { flex-direction:column; gap:0; }
    /* 首屏 hero 移动端堆叠 */
    .club-hero { flex-direction:column; gap:16px; padding:22px 18px; }
    .club-hero-stats { width:100%; }
    .club-hero-title { font-size:20px; }
    .club-hero-actions { flex-wrap:wrap; }
}

/* ===== 首页布局增强（P4） ===== */

/* 首屏 Hero */
.club-hero {
    display:flex; align-items:center; justify-content:space-between; gap:28px;
    background:linear-gradient(135deg,#faf5ee 0%,#f2e8da 100%);
    border:1px solid #ecdfcc; border-radius:14px;
    padding:28px 30px; margin-bottom:16px; flex-wrap:wrap;
}
.club-hero-text { flex:1; min-width:240px; }
.club-hero-tag { display:inline-block; font-size:12px; color:#8b5e3c; background:#fff; border:1px solid #dcc8ae; border-radius:12px; padding:2px 12px; margin-bottom:10px; }
.club-hero-title { font-size:24px; font-weight:700; color:#5b3a1e; line-height:1.4; }
.club-hero-sub { font-size:13px; color:#8a7a66; line-height:1.8; margin-top:8px; max-width:520px; }
.club-hero-actions { display:flex; gap:10px; margin-top:16px; }
.club-hero-actions .club-btn { padding:9px 22px; font-size:14px; }
.club-hero-stats { display:flex; gap:26px; background:rgba(255,255,255,.75); border:1px solid #ecdfcc; border-radius:12px; padding:16px 22px; }
.club-hero-stat { text-align:center; min-width:64px; }
.club-hero-stat .v { font-size:24px; font-weight:700; color:#8b5e3c; }
.club-hero-stat .k { font-size:12px; color:#999; margin-top:4px; }

/* 分类彩色标签 */
.club-badge.cat-history { background:#fdf0e6; color:#8b5e3c; border-color:#e8cdb2; }
.club-badge.cat-now { background:#e8f6ec; color:#2e7d32; border-color:#b7e0c0; }
.club-badge.cat-company { background:#e8f1fc; color:#1565c0; border-color:#b9d4f0; }
.club-badge.cat-help { background:#fff3e6; color:#e65100; border-color:#ffd9ad; }
.club-badge.cat-chat { background:#f2f2f2; color:#757575; border-color:#ddd; }

/* 帖子卡片细节 */
.club-card { transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.club-card:hover { transform:translateY(-2px); box-shadow:0 6px 18px rgba(91,58,30,.08); border-color:#dcc8ae; }
.club-card-title { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.club-card-content { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

/* 侧栏等级迷你面板 */
.club-level-mini li { font-size:12.5px; color:#666; line-height:2; }
.club-level-mini b { color:#8b5e3c; }
.club-more-link { display:inline-block; font-size:12px; color:#8b5e3c; margin-top:6px; text-decoration:none; }
.club-more-link:hover { text-decoration:underline; }

/* 空态 */
.club-empty-icon { font-size:34px; margin-bottom:8px; }

/* 页脚 */
.club-footer { border-top:1px solid #e4e3dd; background:#fff; margin-top:30px; }
.club-footer-inner { max-width:1060px; margin:0 auto; padding:18px 16px; font-size:12px; color:#999; display:flex; gap:8px; flex-wrap:wrap; }
.club-footer .dot { color:#ddd; }

/* ===== 个人中心（P4 重设计） ===== */
.me-hero {
    display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
    background:linear-gradient(135deg,#faf5ee 0%,#f0e2d0 100%);
    border:1px solid #ecdfcc; border-radius:14px; padding:24px 26px; margin-bottom:14px;
}
.me-hero-user { display:flex; align-items:center; gap:14px; }
.me-avatar {
    width:60px; height:60px; border-radius:50%; background:#8b5e3c; color:#fff; font-size:26px;
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
    border:3px solid #fff; box-shadow:0 2px 8px rgba(91,58,30,.18);
}
.me-name { font-size:18px; font-weight:700; color:#5b3a1e; }
.me-meta { font-size:12px; color:#8a7a66; margin-top:4px; }
.me-hero-right { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.me-level-badge {
    display:inline-block; color:#fff; font-size:13px; border-radius:14px; padding:4px 14px;
    box-shadow:0 2px 6px rgba(0,0,0,.12);
}

/* 面板 */
.me-panel { background:#fff; border:1px solid #e4e3dd; border-radius:12px; padding:16px 18px; margin-bottom:14px; }
.me-panel-title { font-size:13px; font-weight:600; color:#8b5e3c; margin-bottom:12px; }

/* 今日发帖配额条 */
.me-quota { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.me-quota-num { font-size:16px; font-weight:600; color:#1a1b1c; min-width:60px; }
.me-quota-num span { font-size:20px; color:#8b5e3c; }
.me-quota-bar { flex:1; min-width:120px; height:8px; background:#f0e9df; border-radius:4px; overflow:hidden; }
.me-quota-bar i { display:block; height:100%; background:linear-gradient(90deg,#c8a06a,#8b5e3c); border-radius:4px; transition:width .3s; }
.me-quota-tip { font-size:12px; color:#999; }
.me-block {
    background:#fff1f0; color:#cf1322; font-size:13px; border-radius:10px; padding:10px 12px; margin-top:10px;
    border:1px solid #ffd7d4;
}

/* 指标卡 */
.me-grid { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:14px; }
.me-card {
    flex:1 1 130px; min-width:0; background:#fff; border:1px solid #e4e3dd; border-radius:12px; padding:14px;
    box-sizing:border-box; text-align:center;
}
.me-card .k { font-size:12px; color:#999; }
.me-card .v { font-size:22px; font-weight:700; color:#8b5e3c; margin-top:6px; }
.me-card .v small { font-size:12px; color:#999; font-weight:400; }

/* 等级路径图 */
.me-path { display:flex; align-items:flex-start; }
.me-node-wrap { display:flex; flex-direction:column; align-items:center; min-width:0; flex:1; }
.me-node {
    width:46px; height:46px; border-radius:50%; background:#fff; border:2px solid #e4e3dd;
    display:flex; align-items:center; justify-content:center; font-size:20px; position:relative;
}
.me-node.done { border-color:#c8a06a; background:#fdf6ec; }
.me-node.cur { transform:scale(1.12); box-shadow:0 3px 10px rgba(91,58,30,.25); }
.me-node-check {
    position:absolute; top:-4px; right:-4px; width:16px; height:16px; border-radius:50%;
    background:#52c41a; color:#fff; font-size:10px; line-height:16px; text-align:center;
}
.me-node-name { font-size:12px; color:#555; margin-top:8px; white-space:nowrap; font-weight:600; }
.me-node.cur + .me-node-name, .me-node-name { }
.me-node-quota { font-size:11px; color:#999; margin-top:2px; white-space:nowrap; }
.me-node-cur {
    font-size:10px; color:#fff; background:#8b5e3c; border-radius:8px; padding:1px 8px; margin-top:4px;
}
.me-node-line { flex:0 0 18px; height:2px; background:#e4e3dd; margin-top:22px; }
.me-node-line.done { background:#c8a06a; }
.me-path-tip { font-size:12px; color:#999; margin-top:12px; text-align:center; }

/* 升级进度 */
.me-up-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.me-up-head span:first-child { font-size:13px; font-weight:600; color:#555; }
.me-up-head span:last-child { font-size:12px; color:#8b5e3c; background:#faf5ee; border:1px solid #ecdfcc; border-radius:10px; padding:2px 10px; }
.me-bar { height:8px; background:#f0e9df; border-radius:4px; overflow:hidden; }
.me-bar i { display:block; height:100%; background:linear-gradient(90deg,#c8a06a,#8b5e3c); border-radius:4px; transition:width .3s; }
.me-up-tip { font-size:12px; color:#999; margin-top:8px; }

/* 权益表 */
.me-levels { width:100%; border-collapse:collapse; }
.me-levels td { padding:9px 6px; border-bottom:1px solid #f4f3ee; font-size:12.5px; color:#555; }
.me-levels td:first-child { width:118px; font-weight:600; color:#1a1b1c; }
.me-levels td:last-child { width:86px; text-align:right; color:#8b5e3c; font-weight:600; }
.me-levels tr:last-child td { border-bottom:none; }
.me-levels tr.cur td { background:#faf5ee; color:#8b5e3c; }

/* 快捷入口导航（个人中心顶部） */
.me-nav { display:flex; gap:12px; margin-bottom:14px; }
.me-nav-item {
    flex:1; display:flex; flex-direction:column; align-items:center; gap:6px;
    background:#fff; border:1px solid #e4e3dd; border-radius:12px; padding:14px 8px;
    text-decoration:none; color:#555; font-size:13px; transition:transform .15s, border-color .15s, box-shadow .15s;
}
.me-nav-item:hover { transform:translateY(-2px); border-color:#c8a06a; box-shadow:0 4px 12px rgba(91,58,30,.08); color:#8b5e3c; }
.me-nav-icon { font-size:22px; }

/* 个人中心移动端 */
@media (max-width:760px) {
    .me-hero { padding:18px 16px; }
    .me-hero-right { width:100%; justify-content:space-between; }
    .me-avatar { width:52px; height:52px; font-size:22px; }
    .me-path { overflow-x:auto; padding-bottom:4px; }
    .me-node-line { flex:0 0 10px; }
    .me-node { width:40px; height:40px; font-size:17px; }
    .me-node-name { font-size:11px; }
    .me-node-quota { font-size:10px; }
}

/* 详情页状态条（作者查看自己待审/驳回/下架帖子时显示） */
.club-status-bar { padding:10px 12px; border-radius:10px; font-size:12.5px; margin-bottom:12px; }
.club-status-bar.s0 { background:#f4f3ee; color:#777; }
.club-status-bar.s2 { background:#fff1f0; color:#cf1322; }
.club-status-bar.s4 { background:#f4f3ee; color:#777; }

/* 详情页分类头（横幅） */
.club-cat-head { display:flex; align-items:center; gap:10px; padding:12px 14px; border-radius:12px; color:#fff; margin-bottom:12px; }
.club-cat-head-icon { font-size:20px; line-height:1; }
.club-cat-head-name { font-size:15px; font-weight:600; }
.club-cat-head-desc { font-size:12px; opacity:.88; margin-left:auto; }

/* 详情页导航条：返回列表 + 板块切换 */
.club-detail-nav { display:flex; flex-wrap:wrap; gap:10px 14px; align-items:center; margin-bottom:12px; font-size:13px; }
.club-detail-back { color:#2e7d32; text-decoration:none; font-weight:600; }
.club-detail-back:hover { opacity:.8; }
.club-detail-cats { display:flex; gap:6px; margin-left:auto; flex-wrap:wrap; justify-content:flex-end; }
.club-detail-cats a { padding:3px 12px; border:1px solid #e4e3dd; border-radius:999px; color:#777; text-decoration:none; font-size:12px; white-space:nowrap; background:#fff; }
.club-detail-cats a:hover { color:#2e7d32; border-color:#2e7d32; }

/* 个人中心 Hero 卡"去发故事"按钮（墨绿，与 L2 青苗徽章同色系） */
.me-go-btn { background:#2e7d32; }
.me-go-btn:hover { opacity:.9; }

/* 移动端补强（P4-2）：PC 版页面窄屏兜底 */
@media (max-width:760px) {
    /* Tab 栏窄屏适配：字号压缩、允许横向滚动 */
    .me-tabbar { gap:4px; padding:5px; overflow-x:auto; -webkit-overflow-scrolling:touch; }
    .me-tabbar .me-tab { flex:0 0 auto; min-width:72px; padding:9px 10px; font-size:12px; }
    /* 等级权益表窄屏横向滚动 */
    .me-levels { display:block; overflow-x:auto; white-space:nowrap; }
    .me-levels td { white-space:normal; }
    /* 指标卡固定两列 */
    .me-grid { display:grid; grid-template-columns:repeat(2, 1fr); gap:10px; }
    .me-card { flex:none; }
    /* 登录浮层贴边 */
    .club-login { width:auto; max-width:88vw; }
    /* 顶栏右侧间距收紧 */
    .club-top-inner { gap:10px; padding:0 12px; }
    .club-top-right { gap:8px; }
    .club-user-link { padding:2px 8px; font-size:12px; }
    .club-link-switch { padding:2px 8px; font-size:12px; }
    /* 个人中心面板内边距收紧 */
    .me-panel { padding:14px; }
    /* 帖子卡片标题窄屏字号 */
    .club-card-title { font-size:15px; }
    /* Hero 统计两列换行 */
    .club-hero-stats { flex-wrap:wrap; gap:14px; }
    .club-hero-stat { min-width:52px; }
    .club-hero-stat .v { font-size:20px; }
    /* 我的故事面板头：窄屏统计换行、按钮全宽 */
    .me-panel-head { flex-direction:column; align-items:stretch; }
    .me-panel-stats { justify-content:flex-start; }
    .me-panel-stats .st { font-size:12px; padding:5px 10px; }
    .me-panel-head .me-post-entry { width:100%; }
    .me-panel-head .me-post-back { width:100%; }
}

/* ===== PC/Mobile 切换入口 ===== */
.club-link-switch { font-size:12px; color:#8b5e3c; text-decoration:none; border:1px solid #dcc8ae; border-radius:12px; padding:3px 10px; background:#fff; }
.club-link-switch:hover { background:#8b5e3c; color:#fff; }

/* ===== 发布故事入口（归属"我的故事"栏目） ===== */
.me-panel-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; flex-wrap:wrap; }
.me-panel-stats { display:flex; gap:10px; flex-wrap:wrap; }
.me-panel-stats .st {
    font-size:12.5px; color:#666; background:#faf9f5; border:1px solid #ece9e1;
    border-radius:10px; padding:6px 12px; white-space:nowrap;
    cursor:pointer; user-select:none; transition:background .15s,color .15s,border-color .15s;
}
.me-panel-stats .st:hover { border-color:#c8a06a; color:#8b5e3c; }
.me-panel-stats .st.on { background:#8b5e3c; border-color:#8b5e3c; color:#fff; }
.me-panel-stats .st.on b { color:#fff; }
.me-panel-stats .st b { color:#8b5e3c; font-size:14px; }
.me-panel-stats .st.st-rej b { color:#cf1322; }
.me-panel-head .me-post-entry { width:auto; padding:10px 22px; margin:0; }
.me-panel-head .me-post-back {
    width:auto; padding:10px 22px; margin:0;
    background:#fff; color:#8b5e3c; border:1px solid #c8a06a;
}
.me-panel-head .me-post-back:hover { background:#faf5ee; }
.me-post-entry {
    width:100%; display:block; background:#8b5e3c; color:#fff; border:none; border-radius:10px;
    padding:12px; font-size:14px; cursor:pointer; font-weight:600; text-align:center;
}
.me-post-entry:hover { opacity:.9; }
.me-form-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }
.me-form-head .me-panel-title { margin-bottom:0; }
.me-form-head a { font-size:12.5px; color:#8b5e3c; text-decoration:none; }
.me-form-head a:hover { text-decoration:underline; }