/* ============================
   TRAE AI Forum - 主样式表
   ============================ */

/* 全局重置 */
* { word-wrap: break-word; margin: 0; padding: 0; }
body { font: 12px/1.5 "Microsoft YaHei", Arial, sans-serif; color: #444; background: #f5f7fa; }
body, ul, ol, li, dl, dd, p, h1, h2, h3, h4, h5, h6, form, fieldset { margin: 0; padding: 0; }
table { empty-cells: show; border-collapse: collapse; }
ul li { list-style: none; }
h1, h2, h3, h4, h5, h6 { font-size: 1em; }
em, cite, i { font-style: normal; }
a { color: #369; text-decoration: none; }
a:hover { color: #f60; text-decoration: underline; }
img { border: none; }
input, button, select, textarea { font-family: inherit; font-size: 12px; }

/* 通用类 */
.wp { width: 960px; margin: 0 auto; }
.cl:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.cl { zoom: 1; }
.z { float: left; }
.y { float: right; }
.xi1 { color: #369 !important; }
.xi2 { color: #369; }
.xi2 a { color: #369; }
.xg1 { color: #999; }
.xw0 { font-weight: 400; }
.xw1 { font-weight: 700; }
.pipe { margin: 0 5px; color: #ccc; }
.mtn { margin-top: 10px; }
.mbm { margin-bottom: 10px; }
.ptm { padding-top: 10px; }
.pbm { padding-bottom: 10px; }

/* 顶部导航栏 */
#toptb { background: #f7f7f7; border-bottom: 1px solid #e5e5e5; line-height: 30px; height: 30px; }
#toptb a { color: #666; }
#toptb a:hover { color: #369; }

/* 头部 */
#hd { background: #fff; border-bottom: 3px solid #4a90d9; padding: 15px 0 0; }
.hdc { padding: 10px 0; }
.hdc h2 { float: left; }
.hdc h2 a { font-size: 28px; color: #4a90d9; font-weight: bold; text-decoration: none; }
.hdc h2 a:hover { color: #357abd; }
.hdc-r { float: right; margin-top: 8px; }
.search-form { display: flex; }
.search-form input { width: 200px; padding: 6px 10px; border: 1px solid #ddd; border-right: none; border-radius: 3px 0 0 3px; outline: none; }
.search-form input:focus { border-color: #4a90d9; }
.search-form button { padding: 6px 15px; background: #4a90d9; color: #fff; border: none; border-radius: 0 3px 3px 0; cursor: pointer; }
.search-form button:hover { background: #357abd; }

/* 主导航 */
#nv { margin-top: 15px; height: 40px; }
#nv ul { display: flex; }
#nv li { list-style: none; }
#nv a { display: block; padding: 0 25px; line-height: 40px; font-size: 14px; color: #333; text-decoration: none; font-weight: bold; }
#nv a:hover { color: #4a90d9; }
#nv .a a { color: #fff; background: #4a90d9; }
#nv .a a:hover { color: #fff; }

/* 面包屑 */
#pt { padding: 10px 0; line-height: 24px; font-size: 13px; }
#pt a { color: #666; }
#pt a:hover { color: #369; }
#pt em { margin: 0 8px; color: #ccc; font-style: normal; }
#pt .nvhm { color: #369; font-weight: bold; }

/* 首页四格 - 强制横排 */
#grid4 { margin-bottom: 10px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; margin-left: -4px; margin-right: -4px; }
.grid4-item { -webkit-box-flex: 1; -ms-flex: 1 1 25%; flex: 1 1 25%; min-width: 0; background: #fff; border: 1px solid #e5e5e5; border-radius: 4px; overflow: hidden; margin: 0 4px; }
.grid4-h { padding: 0 10px; height: 36px; line-height: 36px; background: linear-gradient(135deg, #4a90d9, #357abd); border-radius: 4px 4px 0 0; white-space: nowrap; overflow: hidden; }
.grid4-h h3 { font-size: 13px; color: #fff; font-weight: bold; }
.grid4-list { padding: 8px 10px; }
.grid4-list li { padding: 5px 0; border-bottom: 1px dashed #f0f0f0; line-height: 22px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
.grid4-list li:last-child { border-bottom: none; }
.grid4-list li a { color: #555; font-size: 12px; text-decoration: none; -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.grid4-list li a:hover { color: #4a90d9; }
.grid4-author { -ms-flex-negative: 0; flex-shrink: 0; color: #bbb; font-size: 11px; padding-left: 6px; white-space: nowrap; max-width: 60px; overflow: hidden; text-overflow: ellipsis; }

/* 图片轮播格 */
.grid4-slider-wrap { position: relative; height: 220px; overflow: hidden; }
.grid4-slider-track { display: -webkit-box; display: -ms-flexbox; display: flex; height: 100%; -webkit-transition: -webkit-transform 0.5s ease; transition: transform 0.5s ease; }
.grid4-slide { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; width: 100%; height: 100%; position: relative; }
.grid4-slide a { display: block; width: 100%; height: 100%; }
.grid4-slide img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; -o-object-fit: contain; object-fit: contain; -o-object-position: center; object-position: center; display: block; background: #f5f5f5; }
.grid4-slide-title { position: absolute; bottom: 0; left: 0; right: 0; padding: 6px 10px; background: rgba(0,0,0,0.5); color: #fff; font-size: 12px; line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.grid4-slider-btn { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); width: 26px; height: 26px; line-height: 26px; text-align: center; background: rgba(0,0,0,0.4); color: #fff; border: none; cursor: pointer; font-size: 14px; border-radius: 50%; padding: 0; }
.grid4-slider-btn:hover { background: rgba(0,0,0,0.6); }
.grid4-slider-prev { left: 5px; }
.grid4-slider-next { right: 5px; }
.grid4-slider-dots { position: absolute; bottom: 30px; left: 0; right: 0; text-align: center; }
.grid4-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,0.5); margin: 0 3px; cursor: pointer; }
.grid4-dot.active { background: #fff; }
.grid4-slider-empty { height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; color: #999; font-size: 12px; }

/* 区块 */
.bm { background: #fff; border: 1px solid #e5e5e5; border-radius: 4px; margin-bottom: 10px; }
.bm_h { padding: 0 15px; height: 40px; line-height: 40px; background: #f8f9fa; border-bottom: 1px solid #e5e5e5; border-radius: 4px 4px 0 0; }
.bm_h h2 { font-size: 14px; color: #333; font-weight: bold; float: left; }
.bm_h h2 a { color: #333; }
.bm_h h2 a:hover { color: #369; }
.bm_h .o { float: right; }
.bm_c { padding: 15px; }

/* 统计条 */
.chart { line-height: 24px; color: #666; }
.chart em { color: #f60; font-weight: bold; font-style: normal; }

/* 分类和板块列表 */
.fl_tb { width: 100%; }
.fl_tb td { padding: 15px; vertical-align: middle; border-bottom: 1px solid #f0f0f0; }
.fl_tb tr:last-child td { border-bottom: none; }
.fl_icn { width: 50px; text-align: center; }
.fl_icn .forum-icon { display: inline-block; width: 36px; height: 36px; line-height: 36px; border-radius: 50%; background: #4a90d9; color: #fff; font-size: 18px; text-align: center; }
.fl_g { display: flex; align-items: flex-start; }
.fl_g .fl_icn_g { margin-right: 12px; }
.fl_g .forum-icon { display: inline-block; width: 40px; height: 40px; line-height: 40px; border-radius: 50%; background: #e8f0fe; color: #4a90d9; font-size: 20px; text-align: center; }
.fl_g dl dt { font-size: 14px; font-weight: bold; margin-bottom: 4px; }
.fl_g dl dt a { color: #333; }
.fl_g dl dt a:hover { color: #369; }
.fl_g dl dd { color: #999; font-size: 12px; line-height: 1.8; }
.fl_g dl dd em { color: #666; font-style: normal; }
.fl_i { text-align: center; width: 100px; color: #999; }
.fl_i span { font-size: 16px; color: #f60; font-weight: bold; }
.fl_by { width: 180px; color: #999; font-size: 12px; }
.fl_by cite { display: block; color: #bbb; margin-top: 2px; }

/* 帖子列表 */
.thread-list { background: #fff; border: 1px solid #e5e5e5; border-radius: 4px; }
.thread-list-header { display: flex; padding: 10px 15px; background: #f8f9fa; border-bottom: 1px solid #e5e5e5; font-weight: bold; color: #666; }
.thread-list-header .col-title { flex: 1; }
.thread-list-header .col-author { width: 100px; text-align: center; }
.thread-list-header .col-reply { width: 80px; text-align: center; }
.thread-list-header .col-view { width: 80px; text-align: center; }
.thread-list-header .col-last { width: 160px; }

.thread-item { display: flex; padding: 12px 15px; border-bottom: 1px solid #f0f0f0; align-items: center; }
.thread-item:hover { background: #fafbfc; }
.thread-item:last-child { border-bottom: none; }
.thread-item .col-title { flex: 1; }
.thread-item .thread-icon { display: inline-block; width: 20px; text-align: center; margin-right: 8px; }
.thread-item .thread-icon.top { color: #f60; }
.thread-item .thread-icon.hot { color: #28a745; }
.thread-item .thread-title { font-size: 14px; color: #333; }
.thread-item .thread-title:hover { color: #369; }
.thread-item .thread-title.is_new::after { content: ' NEW'; color: #f60; font-size: 10px; font-weight: bold; }
.thread-item .col-author { width: 100px; text-align: center; color: #999; }
.thread-item .col-author a { color: #666; }
.thread-item .col-reply { width: 80px; text-align: center; }
.thread-item .col-reply em { color: #f60; font-weight: bold; font-style: normal; }
.thread-item .col-view { width: 80px; text-align: center; color: #999; }
.thread-item .col-last { width: 160px; font-size: 12px; color: #999; }
.thread-item .col-last a { color: #666; }

/* 发布按钮 */
.post-btn { text-align: right; margin-bottom: 10px; }
.post-btn a { display: inline-block; padding: 8px 20px; background: #f60; color: #fff; border-radius: 4px; text-decoration: none; font-weight: bold; }
.post-btn a:hover { background: #e55a00; color: #fff; }

/* ===== 帖子详情页（17bb 风格：横向扁平布局） ===== */
.thread-view { background: #fff; border: 1px solid #e5e9f0; border-radius: 2px; margin-bottom: 10px; }

/* 标题区 */
.thread-head { padding: 18px 20px 14px; border-bottom: 1px solid #f0f2f5; }
.thread-topbar { font-size: 12px; color: #999; margin-bottom: 10px; }
.thread-topbar a { color: #4a90d9; }
.thread-topbar .topbar-item { margin-right: 15px; }
.thread-head h1 { font-size: 20px; line-height: 1.5; color: #1a1a1a; font-weight: 700; margin-bottom: 12px; }
.thread-meta { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 12px; color: #999; }
.thread-meta .meta-avatar { width: 28px; height: 28px; border-radius: 50%; background: #4a90d9; color: #fff; line-height: 28px; text-align: center; font-size: 13px; margin-right: 8px; }
.thread-meta .meta-author { color: #4a90d9; font-weight: bold; font-size: 13px; margin-right: 12px; }
.thread-meta .meta-pm { color: #999; margin-right: 15px; padding: 1px 8px; border: 1px solid #e0e0e0; border-radius: 2px; font-size: 11px; }
.thread-meta .meta-pm:hover { color: #4a90d9; border-color: #4a90d9; text-decoration: none; }
.thread-meta .meta-sep { margin: 0 8px; color: #ddd; }
.thread-meta .meta-views { color: #e67e22; font-weight: bold; }
.thread-closed-tag { color: #fff; background: #e74c3c; padding: 1px 8px; border-radius: 2px; font-size: 11px; margin-left: 8px; }

/* 楼层（横向：头部信息行 + 正文） */
.post-item { border-bottom: 1px solid #f0f2f5; }
.post-item:last-child { border-bottom: none; }
.post-head { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 12px 20px; background: #fafbfc; border-bottom: 1px solid #f0f2f5; font-size: 12px; }
.post-head .p-avatar { width: 34px; height: 34px; border-radius: 50%; background: #4a90d9; color: #fff; line-height: 34px; text-align: center; font-size: 15px; margin-right: 10px; -ms-flex-negative: 0; flex-shrink: 0; }
.post-head .p-user { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; margin-right: 15px; }
.post-head .p-name { color: #4a90d9; font-weight: bold; font-size: 13px; line-height: 1.4; }
.post-head .p-level { font-size: 11px; color: #999; line-height: 1.4; }
.post-head .p-level.admin { color: #e67e22; }
.post-head .p-right { margin-left: auto; text-align: right; color: #bbb; }
.post-head .p-floor { color: #4a90d9; font-weight: bold; margin-right: 12px; }
.post-head .p-time { color: #999; }

.post-body-wrap { padding: 18px 20px; }
.post-body { font-size: 14px; line-height: 1.9; color: #333; word-break: break-word; }
.post-body p { margin-bottom: 12px; }
.post-body img { max-width: 100%; height: auto; border-radius: 2px; margin: 8px 0; display: block; }
.post-body h2, .post-body h3 { font-size: 16px; font-weight: bold; margin: 18px 0 10px; color: #1a1a1a; }
.post-body ul, .post-body ol { margin: 10px 0; padding-left: 24px; }
.post-body li { margin-bottom: 6px; }
.post-edit-note { margin-top: 16px; padding-top: 10px; border-top: 1px dashed #eee; color: #bbb; font-size: 12px; font-style: italic; }
.post-sign { margin-top: 14px; padding-top: 10px; border-top: 1px dashed #eee; color: #999; font-size: 12px; }

/* 相关跟贴 */
.related-posts { background: #fff; border: 1px solid #e5e9f0; border-radius: 2px; margin-bottom: 10px; }
.related-posts .rp-head { padding: 12px 20px; border-bottom: 1px solid #f0f2f5; font-size: 14px; font-weight: bold; color: #333; }
.related-posts ul { padding: 5px 20px; }
.related-posts li { padding: 10px 0; border-bottom: 1px dashed #f0f2f5; font-size: 13px; line-height: 1.6; }
.related-posts li:last-child { border-bottom: none; }
.related-posts .rp-title { color: #4a90d9; }
.related-posts .rp-title:hover { color: #f60; }
.related-posts .rp-meta { color: #bbb; font-size: 12px; margin-left: 8px; }

/* 回复框 */
.reply-box { background: #fff; border: 1px solid #e5e9f0; border-radius: 2px; padding: 20px; margin-top: 10px; }
.reply-box h3 { font-size: 15px; margin-bottom: 15px; color: #333; font-weight: bold; }
.reply-box textarea { width: 100%; height: 140px; padding: 12px; border: 1px solid #ddd; border-radius: 2px; resize: vertical; font-size: 14px; line-height: 1.7; box-sizing: border-box; font-family: inherit; }
.reply-box textarea:focus { outline: none; border-color: #4a90d9; }
.reply-box .reply-submit { text-align: right; margin-top: 12px; }
.reply-box button { padding: 9px 32px; background: #4a90d9; color: #fff; border: none; border-radius: 2px; cursor: pointer; font-size: 14px; }
.reply-box button:hover { background: #357abd; }
.reply-login-tip { text-align: center; padding: 30px 20px; color: #999; font-size: 14px; }
.reply-login-tip a { color: #4a90d9; }

/* 编辑器工具栏 */
.editor-toolbar { padding: 8px 10px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: #fafbfc; border: 1px solid #ddd; border-bottom: none; border-radius: 2px 2px 0 0; }
.editor-btn { padding: 5px 12px; background: #fff; border: 1px solid #d0d8e0; border-radius: 2px; cursor: pointer; font-size: 12px; color: #555; -webkit-transition: all 0.15s; transition: all 0.15s; margin-right: 6px; }
.editor-btn:hover { background: #4a90d9; color: #fff; border-color: #4a90d9; }
.editor-hint { color: #aaa; font-size: 11px; margin-left: auto; }

/* 分页 */
.pagination { text-align: center; padding: 20px 0; }
.pagination a, .pagination span { display: inline-block; padding: 5px 12px; margin: 0 3px; border: 1px solid #e5e5e5; border-radius: 3px; background: #fff; color: #666; text-decoration: none; }
.pagination a:hover { border-color: #4a90d9; color: #4a90d9; }
.pagination .current { background: #4a90d9; color: #fff; border-color: #4a90d9; }

/* 提示框 */
.alert { padding: 12px 15px; border-radius: 4px; margin-bottom: 15px; font-size: 14px; }
.alert-success { background: #d4edda; color: #155724; border: 1px solid #c3e6cb; }
.alert-error { background: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; }
.alert-info { background: #d1ecf1; color: #0c5460; border: 1px solid #bee5eb; }
.alert-warning { background: #fff3cd; color: #856404; border: 1px solid #ffeeba; }

/* 表单 */
.form-group { margin-bottom: 15px; }
.form-group label { display: block; margin-bottom: 6px; font-size: 13px; color: #555; }
.form-group input[type=text],
.form-group input[type=email],
.form-group input[type=password],
.form-group textarea,
.form-group select {
    width: 100%; padding: 8px 10px; border: 1px solid #ddd; border-radius: 4px;
    font-size: 14px; box-sizing: border-box;
}
.form-group input:focus, .form-group textarea:focus { outline: none; border-color: #4a90d9; }
.form-group .hint { font-size: 12px; color: #999; margin-top: 5px; }

.btn { display: inline-block; padding: 8px 20px; border: none; border-radius: 4px; cursor: pointer; font-size: 14px; text-decoration: none; transition: all 0.3s; }
.btn-primary { background: #4a90d9; color: #fff; }
.btn-primary:hover { background: #357abd; }
.btn-success { background: #28a745; color: #fff; }
.btn-success:hover { background: #218838; }
.btn-warning { background: #ffc107; color: #333; }
.btn-warning:hover { background: #e0a800; }
.btn-danger { background: #dc3545; color: #fff; }
.btn-danger:hover { background: #c82333; }
.btn-secondary { background: #6c757d; color: #fff; }
.btn-secondary:hover { background: #5a6268; }

/* 登录注册页面 */
.auth-wrap { width: 400px; margin: 50px auto; background: #fff; border: 1px solid #e5e5e5; border-radius: 8px; padding: 30px; }
.auth-wrap h2 { text-align: center; font-size: 20px; margin-bottom: 25px; color: #333; }
.auth-wrap .btn { width: 100%; padding: 12px; font-size: 16px; }
.auth-wrap .auth-footer { text-align: center; margin-top: 20px; color: #999; font-size: 13px; }

/* 验证码 */
.captcha-row { display: flex; gap: 10px; align-items: center; }
.captcha-input { flex: 1; }
.captcha-q { display: inline-block; padding: 8px 14px; background: #f0f4f8; border: 1px solid #d0dce8; border-radius: 4px; font-size: 16px; font-weight: bold; color: #369; white-space: nowrap; flex-shrink: 0; }

/* 个人中心 */
.profile-wrap { background: #fff; border: 1px solid #e5e5e5; border-radius: 4px; padding: 20px; }
.profile-header { display: flex; align-items: center; padding-bottom: 20px; border-bottom: 1px solid #eee; margin-bottom: 20px; }
.profile-header .avatar { width: 100px; height: 100px; border-radius: 50%; background: #4a90d9; color: #fff; line-height: 100px; font-size: 40px; text-align: center; margin-right: 20px; }
.profile-header .info h2 { font-size: 20px; color: #333; margin-bottom: 10px; }
.profile-header .info p { color: #666; margin-bottom: 5px; }

/* 公告 */
.announcement { background: #fff3cd; border: 1px solid #ffeeba; border-radius: 4px; padding: 10px 15px; margin-bottom: 10px; color: #856404; }
.announcement strong { margin-right: 10px; }

/* 底部 */
#lewei_ft { background: #fff; border-top: 1px solid #e5e5e5; margin-top: 20px; padding: 20px 0; }
#ft { text-align: center; color: #999; font-size: 12px; }
#ft a { color: #666; }
#ft a:hover { color: #369; }
#flk p { margin-bottom: 8px; }
#frt p { margin-top: 5px; }

/* 返回顶部 */
#backToTop {
    position: fixed; right: 30px; bottom: 80px; width: 45px; height: 45px;
    background: #4a90d9; color: #fff; text-align: center; line-height: 45px;
    font-size: 20px; border-radius: 4px; cursor: pointer; opacity: 0.8;
    transition: all 0.3s; z-index: 999;
}
#backToTop:hover { background: #357abd; opacity: 1; }

/* 侧边栏样式 */
.sd { float: right; width: 260px; }
.mn { float: left; width: 690px; }
.ct2 .mn { width: 690px; }
.ct2 .sd { width: 260px; }

/* DZX 风格侧边栏 */
.sd .sd_bm { background: #fff; border: 1px solid #cdd9e4; border-radius: 0; margin-bottom: 10px; overflow: hidden; }
.sd .bm_h { height: 33px; line-height: 33px; padding: 0 12px; background: linear-gradient(to bottom, #f6f9fc 0%, #e8f0f7 100%); border-bottom: 1px solid #cdd9e4; border-radius: 0; }
.sd .bm_h h2 { font-size: 13px; font-weight: bold; color: #369; }
.sd .bm_c { padding: 10px 12px; }

/* 侧边栏用户面板 */
.sd_user { text-align: center; padding: 10px 0; }
.sd_avatar { width: 48px; height: 48px; line-height: 48px; border-radius: 50%; background: #4a90d9; color: #fff; font-size: 20px; margin: 0 auto 8px; text-align: center; }
.sd_uname { font-size: 14px; font-weight: bold; color: #333; margin-bottom: 4px; }
.sd_ustats { font-size: 12px; color: #999; margin-bottom: 10px; }
.sd_ustats em { color: #f60; font-style: normal; font-weight: bold; }
.sd_ulink { margin-top: 8px; }

/* 侧边栏登录面板 */
.sd_login { text-align: center; padding: 15px 0; }
.sd_login_tip { color: #666; font-size: 12px; margin-bottom: 12px; }
.sd_login_btns { display: flex; gap: 8px; justify-content: center; }

/* 侧边栏按钮 */
.sd_btn { display: inline-block; padding: 5px 16px; font-size: 12px; color: #fff; background: #4a90d9; border: 1px solid #3a7bc4; border-radius: 2px; text-decoration: none; cursor: pointer; }
.sd_btn:hover { background: #357abd; color: #fff; text-decoration: none; }
.sd_btn2 { background: #f5f5f5; color: #666; border-color: #ddd; }
.sd_btn2:hover { background: #e8e8e8; color: #333; }

/* 侧边栏列表 */
.sd_list li { padding: 6px 0; border-bottom: 1px dashed #e5edf2; line-height: 22px; overflow: hidden; }
.sd_list li:last-child { border-bottom: none; }
.sd_list li a { color: #555; font-size: 12px; text-decoration: none; display: inline-block; max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
.sd_list li a:hover { color: #369; }
.sd_list .sd_num { float: right; color: #bbb; font-size: 11px; padding-left: 5px; }

/* 发帖页面（17bb 风格） */
.new-thread-wrap { background: #fff; border: 1px solid #e5e9f0; border-radius: 2px; padding: 24px; }
.new-thread-wrap h2 { font-size: 18px; margin-bottom: 22px; padding-bottom: 14px; border-bottom: 1px solid #f0f2f5; color: #1a1a1a; font-weight: 700; }
.new-thread-wrap .form-group { margin-bottom: 18px; }
.new-thread-wrap label { display: block; font-size: 13px; color: #555; font-weight: bold; margin-bottom: 8px; }
.new-thread-wrap select, .new-thread-wrap input[type="text"] { width: 100%; padding: 10px 12px; border: 1px solid #ddd; border-radius: 2px; font-size: 14px; box-sizing: border-box; background: #fff; }
.new-thread-wrap select:focus, .new-thread-wrap input[type="text"]:focus { outline: none; border-color: #4a90d9; }
.new-thread-wrap textarea { width: 100%; padding: 12px; border: 1px solid #ddd; border-radius: 2px; resize: vertical; font-size: 14px; line-height: 1.7; box-sizing: border-box; font-family: inherit; }
.new-thread-wrap textarea:focus { outline: none; border-color: #4a90d9; }
.form-submit { text-align: right; margin-top: 20px; padding-top: 16px; border-top: 1px solid #f0f2f5; }
.btn-publish { padding: 11px 40px; background: #4a90d9; color: #fff; border: none; border-radius: 2px; cursor: pointer; font-size: 15px; font-weight: bold; -webkit-transition: background 0.15s; transition: background 0.15s; }
.btn-publish:hover { background: #357abd; }
.btn-cancel { display: inline-block; padding: 11px 24px; color: #999; text-decoration: none; font-size: 14px; margin-right: 10px; }
.btn-cancel:hover { color: #666; }

/* ============================================
   响应式 - 平板 (max-width: 960px)
   ============================================ */
@media (max-width: 960px) {
    .wp { width: 100%; padding: 0 10px; box-sizing: border-box; }
    .mn { float: none; width: 100%; }
    .sd { float: none; width: 100%; }
    #grid4 { flex-wrap: nowrap; }
    .grid4-item { flex: 1 1 25%; }
    .grid4-h h3 { font-size: 11px; }
    .grid4-list li a { font-size: 11px; }
    .grid4-author { font-size: 10px; }
    .fl_by, .fl_i { display: none; }
    .thread-item .col-author, .thread-item .col-view { display: none; }
    .thread-list-header .col-author, .thread-list-header .col-view { display: none; }
    .post-head .p-avatar { width: 30px; height: 30px; line-height: 30px; font-size: 13px; }
    .auth-wrap { width: 90%; margin: 20px auto; padding: 20px; }
    /* 论坛表格改为单列 */
    table.fl_tb td { display: block; width: 100% !important; }
}

/* ============================================
   响应式 - 手机 (max-width: 640px)
   ============================================ */
@media (max-width: 640px) {
    /* 基础 */
    body { font-size: 13px; }
    .wp { padding: 0 8px; }

    /* 顶部导航栏 */
    #toptb { line-height: 28px; height: auto; padding: 2px 0; }
    #toptb .z span { font-size: 11px; }
    #toptb .y { font-size: 12px; }
    #toptb .y a { margin: 0 2px; }
    .pipe { margin: 0 3px; }

    /* 头部 */
    #hd { padding: 8px 0 0; border-bottom: 2px solid #4a90d9; }
    .hdc { padding: 5px 0; }
    .hdc h2 { float: none; text-align: center; margin-bottom: 5px; }
    .hdc h2 a { font-size: 20px; }
    .hdc h2 a img { height: 50px !important; }
    .hdc-r { float: none; margin-top: 5px; }
    .search-form { width: 100%; }
    .search-form input { flex: 1; width: auto; padding: 7px 10px; font-size: 13px; }
    .search-form button { padding: 7px 14px; font-size: 13px; }

    /* 主导航 - 横向滚动 */
    #nv { margin-top: 8px; height: 38px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    #nv ul { flex-wrap: nowrap; white-space: nowrap; }
    #nv li { flex-shrink: 0; }
    #nv a { padding: 0 16px; line-height: 38px; font-size: 13px; }

    /* 面包屑 */
    #pt { padding: 6px 0; font-size: 12px; line-height: 20px; }

    /* 首页四格 - 2x2 网格 */
    #grid4 { flex-wrap: wrap; gap: 6px; }
    .grid4-item { flex: 1 1 calc(50% - 3px); }
    .grid4-h { height: 32px; line-height: 32px; padding: 0 8px; }
    .grid4-h h3 { font-size: 12px; }
    .grid4-list { padding: 6px 8px; }
    .grid4-list li { padding: 4px 0; line-height: 20px; }
    .grid4-list li a { font-size: 11px; }
    .grid4-author { font-size: 10px; max-width: 50px; }

    /* 区块通用 */
    .bm { margin-bottom: 8px; border-radius: 3px; }
    .bm_h { height: 36px; line-height: 36px; padding: 0 10px; }
    .bm_h h2 { font-size: 13px; }
    .bm_c { padding: 8px 10px; }

    /* 统计信息 */
    .chart { font-size: 12px; }
    .chart em { font-weight: bold; }

    /* 论坛列表 - 卡片式 */
    .fl_tb { display: block; }
    .fl_tb tr { display: block; }
    .fl_tb td { display: block; width: 100% !important; padding: 8px 0; border-bottom: 1px solid #f0f0f0; }
    .fl_g { display: flex; align-items: flex-start; }
    .fl_icn_g { margin-right: 8px; flex-shrink: 0; }
    .fl_icn_g .forum-icon { font-size: 20px; }
    .fl_g dl { flex: 1; }
    .fl_g dt { font-size: 13px; }
    .fl_g dt a { font-weight: bold; }
    .fl_g dd { font-size: 11px; margin-top: 2px; }
    .fl_g dd:last-child { display: none; }

    /* 侧边栏 */
    .sd_bm { margin-bottom: 8px; }
    .sd_avatar { width: 36px; height: 36px; line-height: 36px; font-size: 16px; margin-bottom: 5px; }
    .sd_uname { font-size: 13px; }
    .sd_ustats { font-size: 11px; }
    .sd_ulink { margin-top: 8px; }
    .sd_btn { padding: 5px 12px; font-size: 12px; }
    .sd_login_tip { font-size: 12px; margin-bottom: 8px; }
    .sd_list li { padding: 4px 0; }
    .sd_list li a { max-width: 140px; font-size: 12px; }
    .sd_num { font-size: 10px; }

    /* 帖子详情 - 横向布局适配 */
    .thread-head { padding: 14px 12px 10px; }
    .thread-head h1 { font-size: 16px; line-height: 1.4; margin-bottom: 10px; }
    .thread-meta { font-size: 11px; }
    .thread-meta .meta-pm { display: none; }
    .post-head { padding: 10px 12px; }
    .post-head .p-avatar { width: 28px; height: 28px; line-height: 28px; font-size: 13px; margin-right: 8px; }
    .post-head .p-name { font-size: 12px; }
    .post-head .p-level { font-size: 10px; }
    .post-head .p-floor, .post-head .p-time { font-size: 11px; }
    .post-body-wrap { padding: 12px; }
    .post-body { font-size: 13px; line-height: 1.75; }
    .related-posts .rp-head { padding: 10px 12px; font-size: 13px; }
    .related-posts ul { padding: 4px 12px; }
    .related-posts li { font-size: 12px; }
    .related-posts .rp-meta { display: block; margin-left: 0; margin-top: 2px; }

    /* 回复框 */
    .reply-box { padding: 12px; }
    .reply-box h3 { font-size: 14px; }
    .reply-box textarea { height: 110px; font-size: 13px; }
    .reply-box button { padding: 8px 24px; font-size: 13px; }
    .editor-hint { display: none; }

    /* 分页 - 更大的触摸区域 */
    .pagination { padding: 12px 0; }
    .pagination a, .pagination span { padding: 8px 12px; margin: 2px; font-size: 13px; }

    /* 登录注册 */
    .auth-wrap { width: 100%; margin: 10px auto; padding: 15px; border-radius: 4px; }
    .auth-wrap h2 { font-size: 18px; margin-bottom: 15px; }
    .auth-wrap .btn { padding: 10px; font-size: 14px; }

    /* 表单 */
    .form-group input, .form-group textarea { font-size: 13px; padding: 10px; }
    .btn { padding: 10px 16px; font-size: 13px; }

    /* 搜索结果 */
    .thread-item { padding: 8px; }
    .thread-item .col-title a { font-size: 13px; }
    .thread-item .col-title .meta { font-size: 11px; }

    /* 发帖页面 */
    .new-thread-wrap { padding: 12px; }
    .new-thread-wrap h2 { font-size: 16px; }

    /* 公告 */
    .announcement { padding: 6px 0; font-size: 12px; }
    .announcement strong { font-size: 13px; }

    /* 友情链接 */
    #footer-links li { display: inline-block; margin-right: 10px; font-size: 12px; }

    /* 页脚 */
    #ft { padding: 10px 0; font-size: 11px; line-height: 1.6; }
    #ft .pipe { display: inline; }

    /* 面包屑隐藏部分 */
    #pt { font-size: 11px; }

    /* 表格通用滚动 */
    .bm_c table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* ============================================
   响应式 - 小屏手机 (max-width: 380px)
   ============================================ */
@media (max-width: 380px) {
    #toptb .z span { display: none; }
    .grid4-author { display: none; }
    .auth-wrap { padding: 10px; }
    .post-head .p-level { display: none; }
    .thread-meta .meta-sep { display: none; }
    .btn-publish { padding: 10px 24px; font-size: 14px; }
}
