/* ============================================
   个人博客 · 简约纯色主题
   ============================================ */
:root{
  --primary:#2c3e50;
  --text:#333;
  --muted:#8a8f99;
  --border:#ececec;
  --bg:#f5f6f8;
  --card:#ffffff;
  --radius:10px;
  --shadow:0 1px 3px rgba(0,0,0,.05);
}
*{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;
  color:var(--text);
  background:var(--bg);
  line-height:1.7;
  font-size:15px;
  position:relative;
  min-height:100%;
}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
.container{max-width:1080px;margin:0 auto;padding:0 20px;}

/* 壁纸 */
.bg-wallpaper{position:fixed;inset:0;z-index:-2;background-size:cover;background-position:center;}
.bg-wallpaper-video{position:fixed;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;}
body.wp-image::before,body.wp-video::before{content:"";position:fixed;inset:0;z-index:-1;background:rgba(255,255,255,.75);}

/* 顶栏 */
.topbar{background:var(--card);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:10;}
.topbar-inner{display:grid;grid-template-columns:auto 1fr auto;align-items:center;height:60px;gap:16px;}
.topbar-left{order:3;justify-self:end;}
.logo{order:1;justify-self:start;font-size:20px;font-weight:700;color:var(--primary);letter-spacing:.5px;}
.nav{order:2;display:flex;justify-content:center;gap:18px;font-size:14px;}
.nav a{color:var(--muted);transition:color .2s;}
.nav a:hover{color:var(--primary);}

/* 左上角搜索 */
.search-box{display:flex;align-items:center;background:var(--bg);border:1px solid var(--border);border-radius:20px;overflow:hidden;}
.search-box input{border:none;background:transparent;padding:7px 14px;font-size:13px;outline:none;width:150px;}
.search-box button{border:none;background:var(--primary);color:#fff;padding:7px 14px;font-size:13px;cursor:pointer;}

/* 布局 */
.main-layout{display:flex;gap:24px;padding-top:26px;padding-bottom:40px;align-items:flex-start;}
.content-area{flex:1;min-width:0;}
.sidebar{width:280px;flex-shrink:0;}

/* 卡片 */
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px;margin-bottom:20px;}
.empty{text-align:center;color:var(--muted);padding:40px 20px;}
.page-head{margin-bottom:18px;}
.page-head h2{font-size:20px;color:var(--primary);border-left:4px solid var(--primary);padding-left:12px;}

/* 文章列表 */
.article-item{padding:0;overflow:hidden;display:flex;flex-direction:column;}
.art-cover img{width:100%;height:200px;object-fit:cover;}
.art-body{padding:20px;}
.art-title{font-size:19px;margin-bottom:10px;}
.art-title a:hover{color:var(--primary);}
.art-meta{display:flex;flex-wrap:wrap;gap:14px;color:var(--muted);font-size:13px;margin-bottom:12px;}
.art-summary{color:#666;font-size:14px;margin-bottom:12px;}
.read-more{color:var(--primary);font-size:14px;font-weight:600;}

/* 文章详情 */
.article-detail{padding:30px;}
.detail-title{font-size:26px;margin-bottom:14px;color:var(--primary);}
.detail-cover{width:100%;border-radius:8px;margin:16px 0;}
.detail-content{font-size:16px;line-height:1.9;color:#444;margin-top:16px;}
.detail-content p{margin:14px 0;}
.detail-content img{border-radius:6px;margin:14px 0;}
.detail-content h1,.detail-content h2,.detail-content h3{margin:20px 0 10px;}
.detail-tags{margin-top:24px;display:flex;flex-wrap:wrap;gap:8px;}
.tag{background:var(--bg);color:var(--muted);padding:4px 12px;border-radius:14px;font-size:12px;}

/* 点赞 */
.like-area{margin-top:30px;text-align:center;}
.like-btn{background:#fff;border:1px solid var(--primary);color:var(--primary);padding:10px 30px;border-radius:24px;font-size:15px;cursor:pointer;transition:all .2s;}
.like-btn:hover{background:var(--primary);color:#fff;}
.like-btn.liked{background:#e74c3c;border-color:#e74c3c;color:#fff;cursor:default;}

/* 侧边栏 */
.profile-card{text-align:center;}
.avatar{width:80px;height:80px;border-radius:50%;object-fit:cover;margin:0 auto 12px;}
.avatar-default{background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:32px;font-weight:700;}
.blogger-name{font-size:17px;margin-bottom:6px;}
.blogger-bio{font-size:13px;color:var(--muted);}
.social-links{display:flex;justify-content:center;gap:14px;margin-top:14px;}
.social-link{width:36px;height:36px;border-radius:50%;background:var(--bg);color:var(--primary);display:flex;align-items:center;justify-content:center;transition:all .2s;}
.social-link:hover{background:var(--primary);color:#fff;}
.social{margin-top:12px;}
.card-title{font-size:15px;font-weight:700;color:var(--primary);margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid var(--border);}
.hitokoto{font-size:14px;color:#666;font-style:italic;}
.notice{font-size:14px;color:#666;}
.cat-list{list-style:none;}
.cat-list li{margin-bottom:8px;}
.cat-list a{display:flex;justify-content:space-between;font-size:14px;color:#555;padding:4px 0;}
.cat-list a:hover{color:var(--primary);}
.cat-list span{background:var(--bg);color:var(--muted);border-radius:10px;padding:0 8px;font-size:12px;}

/* 分页 */
.pagination{display:flex;gap:8px;justify-content:center;margin-top:20px;}
.pagination a{background:var(--card);border:1px solid var(--border);border-radius:6px;padding:6px 12px;font-size:14px;color:#555;}
.pagination a.active,.pagination a:hover{background:var(--primary);color:#fff;border-color:var(--primary);}

/* 相册 */
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.gallery-item{cursor:pointer;border-radius:8px;overflow:hidden;background:var(--card);border:1px solid var(--border);}
.gallery-item img{width:100%;height:180px;object-fit:cover;transition:transform .3s;}
.gallery-item:hover img{transform:scale(1.05);}
.gallery-item figcaption{padding:8px 10px;font-size:13px;color:var(--muted);}
.lightbox{display:none;position:fixed;inset:0;background:rgba(0,0,0,.85);z-index:100;align-items:center;justify-content:center;padding:30px;}
.lightbox img{max-width:90%;max-height:90%;border-radius:6px;}

/* 友链 */
.links-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;}
.link-item{display:flex;align-items:center;gap:14px;padding:16px;margin-bottom:0;transition:transform .2s;}
.link-item:hover{transform:translateY(-2px);}
.link-logo{width:48px;height:48px;border-radius:10px;object-fit:cover;flex-shrink:0;}
.link-logo-default{background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:700;}
.link-name{font-weight:600;}
.link-desc{font-size:13px;color:var(--muted);}

/* 留言 & 表单 */
.form input,.form textarea,.form select{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:6px;font-size:14px;margin-bottom:12px;font-family:inherit;}
.form input:focus,.form textarea:focus{outline:none;border-color:var(--primary);}
.form-row{display:flex;gap:12px;}
.form-row input{flex:1;}
.btn{background:var(--primary);color:#fff;border:none;border-radius:6px;padding:11px 26px;font-size:15px;cursor:pointer;}
.btn:hover{opacity:.9;}
.alert{padding:11px 14px;border-radius:6px;font-size:14px;margin-bottom:14px;}
.alert.ok{background:#eafaf1;color:#1e8449;}
.alert.err{background:#fdeaea;color:#c0392b;}
.message-item .msg-head{display:flex;justify-content:space-between;margin-bottom:8px;}
.msg-nick{font-weight:600;color:var(--primary);}
.msg-time{font-size:12px;color:var(--muted);}
.msg-content{font-size:14px;color:#555;}
.msg-reply{margin-top:10px;background:var(--bg);padding:10px 12px;border-radius:6px;font-size:13px;color:#666;}

/* 聊天室（旧 moments 兼容样式） */
.moments-post .form{margin-bottom:0;}
.moments-post textarea{margin-bottom:12px;}
.moments-post-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.moments-file{flex:1;min-width:160px;margin-bottom:0;}
.moments-tip{text-align:center;color:var(--muted);}
.moments-tip a{color:var(--primary);}
.moments-list{margin-top:0;}
.moment-item .moment-head{display:flex;align-items:center;gap:10px;margin-bottom:8px;}
.moment-user{font-weight:600;color:var(--primary);}
.moment-time{font-size:12px;color:var(--muted);}
.moment-content{font-size:14px;color:#555;white-space:pre-wrap;}
.moment-img{margin-top:10px;}
.moment-img img{border-radius:8px;max-height:360px;object-fit:cover;}

/* 认证页 */
.auth-card{max-width:420px;margin:0 auto;}
.auth-tip{text-align:center;margin-top:14px;font-size:14px;color:var(--muted);}
.auth-tip a{color:var(--primary);}

/* about */
.about-content{font-size:15px;line-height:1.9;color:#444;}

/* 底部 */
.footer{border-top:1px solid var(--border);background:var(--card);padding:20px 0;text-align:center;color:var(--muted);font-size:13px;}

/* 移动端底部菜单栏 */
.mobile-tabbar{display:none;}
.tab-icon{font-size:20px;line-height:1;}
.tab-label{font-size:11px;}

/* 悬浮菜单（移动端右下角） */
.float-menu{display:none;}
.float-fab{
  position:fixed;right:14px;bottom:72px;z-index:60;width:52px;height:52px;border:none;border-radius:50%;
  background:var(--primary);color:#fff;font-size:26px;line-height:1;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.2);
}
.float-panel{
  position:fixed;right:14px;bottom:132px;z-index:60;display:none;flex-direction:column;gap:8px;
  background:var(--card);border:1px solid var(--border);border-radius:12px;padding:8px;box-shadow:0 6px 20px rgba(0,0,0,.16);min-width:120px;
}
.float-panel.open{display:flex;}
.float-item{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:8px;color:var(--text);font-size:14px;white-space:nowrap;}
.float-item:active{background:var(--bg);}
.float-item.active{color:var(--primary);}
.float-ico{font-size:18px;}

/* 聊天室 */
.chat-room{display:flex;flex-direction:column;height:70vh;min-height:420px;}
.chat-box{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:14px;background:var(--bg);border-radius:8px;}
.chat-msg{display:flex;gap:10px;align-items:flex-start;}
.chat-av{width:38px;height:38px;border-radius:50%;object-fit:cover;flex-shrink:0;}
.chat-av-default{background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;}
.chat-body{max-width:75%;}
.chat-name{font-size:12px;color:var(--muted);margin-bottom:3px;}
.chat-text{background:var(--card);padding:8px 12px;border-radius:10px;font-size:14px;color:#444;word-break:break-word;}
.chat-form{display:flex;gap:10px;margin-top:12px;}
.chat-form input{flex:1;}
.chat-tip{text-align:center;color:var(--muted);padding:10px;}
.chat-tip a{color:var(--primary);}

/* 留言板对话框 */
.guestbook-chat{display:flex;flex-direction:column;gap:14px;}
.gb-row{display:flex;gap:10px;align-items:flex-start;}
.gb-av{width:40px;height:40px;border-radius:50%;object-fit:cover;flex-shrink:0;}
.gb-av-default{background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;}
.gb-msg{flex:1;}
.gb-head{display:flex;align-items:center;gap:8px;margin-bottom:4px;}
.gb-name{font-weight:600;color:var(--primary);}
.gb-time{font-size:12px;color:var(--muted);}
.gb-bubble{background:var(--bg);padding:10px 14px;border-radius:10px;font-size:14px;color:#444;width:fit-content;max-width:100%;}
.gb-reply{margin-top:6px;background:#eaf6ff;padding:6px 10px;border-radius:8px;font-size:13px;color:#555;width:fit-content;}
.guestbook-form .form{margin-bottom:0;}
.guestbook-tip{text-align:center;color:var(--muted);}
.guestbook-tip a{color:var(--primary);}

/* 文章评论 */
.comments{margin-top:24px;}
.comments-title{font-size:18px;margin-bottom:14px;}
.comment-form{display:flex;flex-direction:column;gap:10px;margin-bottom:18px;}
.comment-form textarea{margin-bottom:0;}
.comment-tip{color:var(--muted);}
.comment-tip a{color:var(--primary);}
.comment-list{display:flex;flex-direction:column;gap:14px;}
.comment-item{display:flex;gap:10px;align-items:flex-start;padding-bottom:14px;border-bottom:1px solid var(--border);}
.comment-av{width:38px;height:38px;border-radius:50%;object-fit:cover;flex-shrink:0;}
.comment-av-default{background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;}
.comment-body{flex:1;}
.comment-head{display:flex;gap:8px;align-items:center;margin-bottom:4px;}
.comment-name{font-weight:600;color:var(--primary);}
.comment-time{font-size:12px;color:var(--muted);}
.comment-content{font-size:14px;color:#555;white-space:pre-wrap;}

/* 收藏按钮 */
.fav-btn{display:inline-flex;align-items:center;gap:4px;margin-left:14px;color:var(--muted);text-decoration:none;font-size:14px;}
.fav-btn.faved{color:#f1c40f;}

/* 我的 */
.me-profile{text-align:center;}
.me-avatar{width:84px;height:84px;border-radius:50%;object-fit:cover;margin:0 auto 10px;}
.me-avatar-default{background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:34px;font-weight:600;}
.me-name{margin-bottom:14px;}
.me-info{list-style:none;padding:0;margin:0 auto 16px;max-width:280px;text-align:left;}
.me-info li{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--border);font-size:14px;}
.me-info li span{color:var(--muted);}
.me-section{margin-top:24px;}
.me-sub{font-size:18px;margin-bottom:14px;}
.me-fav-list{display:flex;flex-direction:column;gap:12px;}
.me-fav-item{display:flex;gap:12px;align-items:center;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:10px;color:var(--text);text-decoration:none;}
.me-fav-item img{width:64px;height:64px;border-radius:8px;object-fit:cover;flex-shrink:0;}
.me-fav-title{font-weight:600;margin-bottom:4px;}
.me-fav-meta{font-size:12px;color:var(--muted);}

/* 响应式 */
@media(max-width:860px){
  body{padding-bottom:64px;}
  .main-layout{flex-direction:column;}
  .sidebar{width:100%;}
  .gallery-grid{grid-template-columns:repeat(2,1fr);}
  .links-grid{grid-template-columns:1fr;}
  .nav{display:none;}
  .search-box input{width:110px;}
  /* 移动端菜单栏：固定底部，支持跳转到相册/公告/文章/关于我/注册/首页 */
  .mobile-tabbar{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:50;
    background:var(--card);border-top:1px solid var(--border);height:56px;
    box-shadow:0 -2px 10px rgba(0,0,0,.06);
  }
  .mobile-tabbar-inner{display:flex;width:100%;}
  .tab-item{
    flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:2px;color:var(--muted);font-size:11px;
  }
  .tab-item:active{background:var(--bg);}
  .tab-item.active{color:var(--primary);}

  /* 移动端：留言板、我的 隐藏右侧栏（首页/博主信息） */
  .page-guestbook .sidebar,
  .page-me .sidebar{display:none;}
  /* 悬浮菜单仅在移动端显示 */
  .float-menu{display:block;}

  /* 移动端首页：隐藏文章列表（改由底部菜单“文章”进入） */
  .page-home .article-list,
  .page-home .pagination{display:none;}
  /* 移动端：文章/相册/关于我/注册/搜索 隐藏右侧栏（博主信息、今日一言、公告、分类） */
  .page-article .sidebar,
  .page-articles .sidebar,
  .page-gallery .sidebar,
  .page-about .sidebar,
  .page-register .sidebar,
  .page-search .sidebar,
  .page-moments .sidebar{display:none;}

  /* 移动端顶栏恢复左右分布（导航已隐藏） */
  .topbar-inner{display:flex;justify-content:space-between;grid-template-columns:none;}
  .topbar-left{order:0;justify-self:auto;}
  .logo{order:0;justify-self:auto;}
  .nav{order:0;}

  /* 移动端聊天室：去掉卡片框，适配全屏 */
  .page-moments .main-layout{padding-top:0;padding-bottom:0;}
  .page-moments .page-head{display:none;}
  .page-moments .chat-room{
    border:none;box-shadow:none;border-radius:0;padding:0;
    background:transparent;
    height:calc(100vh - 116px);min-height:0;margin-bottom:0;
  }
  .page-moments .chat-box{
    background:transparent;border-radius:0;padding:12px 14px;
  }
  .page-moments .chat-form{padding:0 14px 14px;margin-top:10px;}
}