/*laolicms 网站综合管理系统 v1.0.0 前台会员/论坛/申请/排行榜公共样式
/* 作者：丿king　　联系 QQ：1735737677
/* 文件路径：application/template/laoli/public/pc/css/page.css
/* 说明：登录注册、会员中心、论坛、提交收录、友链、排行榜这些新页面共用这一份样式，
/*        配色跟 laoli.css 一致（主色 #165dff，卡片白底 + 8px 圆角），夜间模式跟 body.dark-mode。*/

/* ===================== 表单 ===================== */
.dhny_form_body { padding: 20px; }
.dhny_form_headline { font-size: 15px; color: #666; margin: 0 0 16px; }
.dhny_form_alt { margin-top: 14px; font-size: 14px; color: #666; }
.dhny_form_alt a { color: #165dff; text-decoration: none; }
.dhny_form_alt a:hover { text-decoration: underline; }
.dhny_form_row { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 14px; }
.dhny_form_row > label { flex: 0 0 92px; padding-top: 9px; font-size: 14px; color: #333; text-align: right; }
.dhny_form_input {
    flex: 1;
    min-width: 0;
    padding: 9px 12px;
    font-size: 14px;
    color: #333;
    background: #f8f8f8;
    border: 1px solid #eaecef;
    border-radius: 6px;
    outline: none;
    font-family: inherit;
    transition: all .3s ease;
}
textarea.dhny_form_input { resize: vertical; line-height: 1.7; }
/* 文件选择框自带「选择文件」按钮，浏览器给的最小宽度比栏位宽，窄屏会顶出容器，强制跟随栏位宽度 */
input[type=file].dhny_form_input { width: 100%; max-width: 100%; }
.dhny_form_input:focus { background: #fff; border-color: #165dff; box-shadow: 0 0 0 3px rgba(22, 93, 255, .1); }
.dhny_form_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 26px;
    margin-left: 102px;
    font-size: 15px;
    color: #fff;
    background: linear-gradient(90deg, #165dff, #4080ff);
    border: 0;
    border-radius: 6px;
    cursor: pointer;
    transition: all .3s ease;
}
.dhny_form_btn:hover { box-shadow: 0 4px 12px rgba(22, 93, 255, .3); transform: translateY(-1px); }
.dhny_form_btn.is-inline { margin-left: 0; padding: 8px 18px; font-size: 14px; }
.dhny_form_note { margin: 12px 0 0 102px; font-size: 13px; color: #999; line-height: 1.7; }
.dhny_form_tip { padding: 10px 14px; margin-bottom: 15px; font-size: 14px; border-radius: 6px; }
.dhny_form_tip.is-ok { color: #0a7d3c; background: #f0fff4; border: 1px solid #b7f0c8; }
.dhny_form_tip.is-err { color: #d4380d; background: #fff3ec; border: 1px solid #ffd6bf; }
.user-admin-tip { padding: 10px 14px; margin-bottom: 15px; font-size: 13px; color: #8a6100; background: #fffbe6; border: 1px solid #ffe58f; border-radius: 6px; }

/* ===================== 算式验证码（内核 form_code() 输出，两套版式共用类名） ===================== */
.un_code_row { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 10px; align-items: start; }
.un_code_row .un_code_box, .un_code_row .un_code_tip { grid-column: 2; }
.un_code_box { display: flex; align-items: stretch; gap: 8px; min-width: 0; }
.un_code_box .dhny_form_input { flex: 1 1 0; min-width: 0; }
.un_code_q { flex: 0 0 auto; padding: 0 16px; font-size: 15px; font-weight: 600; line-height: 1.4; color: #165dff;
             background: #f2f6ff; border: 1px solid #cfe0ff; border-radius: 6px; cursor: pointer; white-space: nowrap; }
.un_code_q:hover { background: #e6efff; }
.un_code_tip { font-size: 12px; color: #999; line-height: 1.6; }
.dark-mode .un_code_q { color: #7aa7ff; background: #23262b; border-color: #2f3339; }
.dark-mode .un_code_tip { color: #7c828c; }
@media (max-width: 768px) {
    .un_code_row { grid-template-columns: minmax(0, 1fr); }
    .un_code_row .un_code_box, .un_code_row .un_code_tip { grid-column: 1; }
}

/* ===================== 会员中心 ===================== */
.user-layout { display: flex; gap: 20px; align-items: flex-start; }
.user-side { flex: 0 0 240px; width: 240px; }
.user-main { flex: 1; min-width: 0; }
.user-side-top { display: flex; align-items: center; gap: 12px; padding: 20px; border-bottom: 1px solid #eaecef; }
.user-side-avatar { width: 52px; height: 52px; border-radius: 50%; object-fit: cover; background: #f8f8f8; flex-shrink: 0; }
.user-side-name { font-size: 16px; font-weight: 600; color: #333; word-break: break-all; }
.user-side-level { display: flex; align-items: center; gap: 6px; margin-top: 6px; font-size: 12px; color: #999; }
.user-side-out { font-size: 12px; color: #999; text-decoration: none; white-space: nowrap; }
.user-side-out:hover { color: #165dff; }
.lv-admin { padding: 1px 6px; font-size: 12px; color: #d4380d; background: #fff1ec; border-radius: 4px; }
.user-side-menu { padding: 10px 0; }
.user-side-menu li { list-style: none; }
.user-side-menu a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 20px;
    font-size: 14px;
    color: #333;
    text-decoration: none;
    transition: all .2s ease;
}
.user-side-menu a:hover { color: #165dff; background: #f5f7ff; }
.user-side-menu li.active a { color: #fff; background: linear-gradient(90deg, #165dff, #4080ff); }
.user-side-menu i { width: 16px; text-align: center; }

.user-stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px,1fr)); gap: 12px; padding: 20px; }
.user-stat { display: block; padding: 14px; text-align: center; text-decoration: none; background: #f8f8f8; border-radius: 8px; transition: all .3s ease; }
.user-stat:hover { background: #f5f7ff; transform: translateY(-2px); }
.user-stat b { display: block; font-size: 22px; color: #165dff; }
.user-stat span { font-size: 13px; color: #666; }
.user-level-box { padding: 0 20px 20px; }
.user-level-line { display: flex; justify-content: space-between; margin-bottom: 8px; font-size: 13px; color: #666; }
.user-level-bar { height: 8px; background: #f0f0f0; border-radius: 4px; overflow: hidden; }
.user-level-bar i { display: block; height: 100%; background: linear-gradient(90deg, #165dff, #4080ff); border-radius: 4px; }

.user-sign-box { padding: 20px; border-top: 1px solid #eaecef; }
.user-sign-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.user-sign-num { font-size: 14px; color: #333; }
.user-sign-num b { font-size: 20px; color: #ff7d00; }
.user-sign-tip { margin-top: 10px; font-size: 13px; color: #999; }
.user-sign-done { padding: 12px 0; font-size: 14px; color: #0a7d3c; }

.user-row-list { padding: 6px 20px 16px; }
.user-row { display: flex; gap: 12px; align-items: flex-start; padding: 14px 0; border-bottom: 1px dashed #eaecef; }
.user-row:last-child { border-bottom: 0; }
.user-row-thumb { width: 56px; height: 56px; object-fit: contain; background: #f8f8f8; border-radius: 6px; flex-shrink: 0; }
.user-row-main { flex: 1; min-width: 0; }
.user-row-title { display: block; font-size: 15px; color: #333; text-decoration: none; }
.user-row-title:hover { color: #165dff; }
.user-row-desc { margin-top: 4px; font-size: 13px; color: #999; line-height: 1.6; word-break: break-all; }
.user-row-meta { font-size: 12px; color: #bbb; white-space: nowrap; }
.user-row-op { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; flex-shrink: 0; }
.user-tag { padding: 2px 8px; font-size: 12px; border-radius: 4px; }
.user-tag.is-ok { color: #0a7d3c; background: #f0fff4; }
.user-tag.is-no { color: #d4380d; background: #fff1ec; }
.user-tag.is-wait { color: #8a6100; background: #fffbe6; }
.user-chip { padding: 2px 8px; font-size: 12px; color: #165dff; background: #f0f5ff; border-radius: 4px; }
.user-empty { padding: 32px 20px; text-align: center; font-size: 14px; color: #999; }
.user-empty a { color: #165dff; }
.user-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 14px;
    font-size: 13px;
    color: #fff;
    background: linear-gradient(90deg, #165dff, #4080ff);
    border: 0;
    border-radius: 5px;
    cursor: pointer;
    text-decoration: none;
    transition: all .2s ease;
}
.user-btn:hover { box-shadow: 0 3px 9px rgba(22, 93, 255, .3); }
.user-btn.is-plain { color: #666; background: #f5f6f7; }
.user-btn.is-plain:hover { color: #165dff; background: #f0f5ff; }
.user-btn-form { display: inline-block; margin: 0 0 0 6px; }
.user-avatar-edit { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; background: #f8f8f8; }

/* ===================== 论坛 ===================== */
.forum-top { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between;
    padding: 14px 18px; margin-bottom: 20px; background: #fff; border: 1px solid #eaecef; border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .05); }
.forum-top-stat { display: flex; flex-wrap: wrap; gap: 18px; font-size: 14px; color: #666; }
.forum-top-stat i { color: #165dff; margin-right: 4px; }
.forum-top-op { display: flex; align-items: center; gap: 10px; }
.forum-search { display: flex; }
.forum-search input { width: 210px; padding: 8px 12px; font-size: 14px; border: 1px solid #eaecef; border-right: 0;
    border-radius: 6px 0 0 6px; outline: none; background: #f8f8f8; color: #333; }
.forum-search input:focus { background: #fff; border-color: #165dff; }
.forum-search button { padding: 0 14px; font-size: 14px; color: #fff; background: #165dff; border: 0;
    border-radius: 0 6px 6px 0; cursor: pointer; }
.forum-new-btn { padding: 8px 16px; font-size: 14px; color: #fff; background: linear-gradient(90deg, #ff7d00, #ffb042);
    border-radius: 6px; text-decoration: none; }
.forum-new-btn:hover { box-shadow: 0 3px 9px rgba(255, 125, 0, .3); }

.forum-board-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px,1fr)); gap: 14px; padding: 18px; }
.forum-board { display: flex; align-items: center; gap: 12px; padding: 14px; background: #f8f8f8; border: 1px solid #eaecef;
    border-radius: 8px; text-decoration: none; transition: all .3s ease; }
.forum-board:hover { background: #f5f7ff; border-color: rgba(22, 93, 255, .3); transform: translateY(-2px); }
.forum-board-icon { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; flex-shrink: 0;
    font-size: 17px; color: #165dff; background: #fff; border-radius: 8px; }
.forum-board-main { flex: 1; min-width: 0; }
.forum-board-name { display: block; font-size: 15px; color: #333; }
.forum-board-intro { display: block; margin-top: 3px; font-size: 12px; color: #999; font-style: normal; }
.forum-board-num { font-size: 12px; color: #bbb; white-space: nowrap; }

.forum-two-col { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px,1fr)); gap: 20px; }
.forum-line-list { padding: 8px 18px 16px; }
.forum-line-list li { list-style: none; display: flex; align-items: baseline; gap: 10px; padding: 9px 0;
    border-bottom: 1px dashed #eaecef; }
.forum-line-list li:last-child { border-bottom: 0; }
.forum-line-title { flex: 1; min-width: 0; font-size: 14px; color: #333; text-decoration: none; }
.forum-line-title:hover { color: #165dff; }
.forum-line-meta { font-size: 12px; color: #bbb; white-space: nowrap; }

.forum-post-list { padding: 6px 18px 16px; }
.forum-post { display: flex; gap: 14px; padding: 16px 0; border-bottom: 1px dashed #eaecef; }
.forum-post:last-child { border-bottom: 0; }
.forum-post-avatar { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; background: #f8f8f8; flex-shrink: 0; }
.forum-post-main { flex: 1; min-width: 0; }
.forum-post-title { display: block; font-size: 16px; color: #333; text-decoration: none; }
.forum-post-title:hover { color: #165dff; }
.forum-post-desc { margin-top: 5px; font-size: 13px; color: #999; line-height: 1.6; }
.forum-post-meta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; font-size: 12px; color: #bbb; }
.forum-post-count { flex-shrink: 0; width: 62px; text-align: center; font-size: 12px; color: #bbb; }
.forum-post-count b { display: block; font-size: 17px; color: #165dff; }
.forum-post-count i { display: block; margin-top: 6px; font-size: 15px; font-style: normal; color: #666; }
.forum-badge { display: inline-block; padding: 1px 7px; margin-right: 6px; font-size: 12px; font-style: normal;
    border-radius: 4px; vertical-align: middle; }
.forum-badge.is-top { color: #fff; background: #d4380d; }
.forum-badge.is-good { color: #8a6100; background: #fffbe6; }
.forum-card-op { margin-left: auto; font-size: 14px; font-weight: 400; color: #165dff; text-decoration: none; }

.forum-topic-head { padding: 20px 20px 0; }
.forum-topic-title { font-size: 22px; color: #333; line-height: 1.5; }
.forum-topic-meta { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 12px; font-size: 13px; color: #999; }
.forum-topic-body { padding: 18px 20px; font-size: 15px; color: #333; line-height: 1.9; word-break: break-word; }
.forum-topic-op { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; padding: 14px 20px;
    border-top: 1px solid #eaecef; }
.forum-edit-box { display: inline-block; margin-left: 6px; }
.forum-edit-box summary { list-style: none; }
.forum-edit-box form { margin-top: 12px; }

.forum-reply-list { padding: 4px 18px 12px; }
.forum-reply { display: flex; gap: 14px; padding: 16px 0; border-bottom: 1px dashed #eaecef; }
.forum-reply:last-child { border-bottom: 0; }
.forum-reply-side { flex: 0 0 84px; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.forum-reply-avatar { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; background: #f8f8f8; }
.forum-reply-name { max-width: 84px; overflow: hidden; font-size: 12px; color: #666; text-overflow: ellipsis; white-space: nowrap; }
.forum-reply-main { flex: 1; min-width: 0; }
.forum-reply-floor { font-size: 12px; color: #bbb; }
.forum-reply-body { margin-top: 8px; font-size: 14px; color: #333; line-height: 1.8; word-break: break-word; }
.forum-reply-op { flex-shrink: 0; }

/* ===================== 排行榜 / 友链 ===================== */
.rank-tabs { display: flex; flex-wrap: wrap; gap: 10px; padding: 16px 18px 0; }
.rank-tabs.is-sub { padding-top: 12px; }
.rank-tab { padding: 7px 16px; font-size: 14px; color: #333; background: #f8f8f8; border-radius: 6px;
    text-decoration: none; transition: all .3s ease; }
.rank-tab:hover { color: #165dff; background: #f5f7ff; }
.rank-tab.active { color: #fff; background: #165dff; }
.rank-list { padding: 6px 18px 18px; }
.rank-row { display: flex; align-items: center; gap: 14px; padding: 12px 0; border-bottom: 1px dashed #eaecef;
    text-decoration: none; }
.rank-row:last-child { border-bottom: 0; }
.rank-no { flex-shrink: 0; width: 26px; font-size: 15px; font-weight: 700; color: #bbb; text-align: center; }
/* 前三名标色只能用 nth-child：模板里的 {if v.i lt 4} 取的是行数组的 i 键，循环序号并不在数组里，判断永远成立 */
.rank-list .rank-row:nth-child(-n+3) .rank-no { color: #ff7d00; }
.rank-thumb { width: 46px; height: 46px; object-fit: contain; background: #f8f8f8; border-radius: 6px; flex-shrink: 0; }
.rank-word { flex-shrink: 0; width: 46px; height: 46px; display: flex; align-items: center; justify-content: center;
    font-size: 15px; color: #165dff; background: #f0f5ff; border-radius: 6px; }
.rank-main { flex: 1; min-width: 0; }
.rank-title { display: block; font-size: 15px; color: #333; }
.rank-row:hover .rank-title { color: #165dff; }
.rank-desc { display: block; margin-top: 4px; font-size: 12px; color: #999; font-style: normal; }
/* 卡片标题旁边那句「按什么排名、多少条上榜」 */
.rank-tip { margin-left: 8px; font-size: 12px; font-weight: 400; color: #999; }
/* 全站聚合榜里每行标出来源栏目与分类 */
.rank-sys, .rank-cat { display: inline-block; margin-right: 6px; padding: 1px 6px; font-size: 12px;
    color: #165dff; background: #f0f5ff; border-radius: 4px; }
.rank-cat { color: #ff7d00; background: #fff5eb; }
.rank-num { flex-shrink: 0; display: flex; gap: 14px; font-size: 12px; color: #bbb; font-style: normal; }

.link-card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px,1fr)); gap: 14px; padding: 18px; }
.link-card { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 14px 10px;
    background: #f8f8f8; border: 1px solid #eaecef; border-radius: 8px; text-decoration: none; transition: all .3s ease; }
.link-card:hover { background: #f5f7ff; border-color: rgba(22, 93, 255, .3); transform: translateY(-2px); }
.link-card-logo { width: 40px; height: 40px; object-fit: contain; }
.link-card-word { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;
    font-size: 14px; color: #165dff; background: #fff; border-radius: 8px; }
.link-card-name { max-width: 100%; overflow: hidden; font-size: 13px; color: #333; text-overflow: ellipsis; white-space: nowrap; }

/* ===================== 夜间模式 ===================== */
.dark-mode .dhny_form_body,
.dark-mode .forum-top,
.dark-mode .dhny_card_header.forum-card-op { color: #c9ced6; }
.dark-mode .dhny_form_row > label,
.dark-mode .user-row-title,
.dark-mode .forum-post-title,
.dark-mode .forum-line-title,
.dark-mode .forum-topic-title,
.dark-mode .rank-title,
.dark-mode .forum-board-name,
.dark-mode .link-card-name { color: #c9ced6; }
.dark-mode .dhny_form_input,
.dark-mode .forum-search input { color: #c9ced6; background: #23262b; border-color: #2f3339; }
.dark-mode .dhny_form_input:focus,
.dark-mode .forum-search input:focus { background: #1a1d21; }
.dark-mode .dhny_form_note,
.dark-mode .user-row-desc,
.dark-mode .forum-post-desc,
.dark-mode .rank-desc { color: #7c828c; }
.dark-mode .user-stat,
.dark-mode .forum-board,
.dark-mode .link-card,
.dark-mode .rank-tab,
.dark-mode .rank-sys,
.dark-mode .rank-cat,
.dark-mode .user-btn.is-plain,
.dark-mode .link-card-word,
.dark-mode .forum-board-icon { color: #c9ced6; background: #23262b; }
.dark-mode .user-row,
.dark-mode .forum-reply,
.dark-mode .forum-post,
.dark-mode .rank-row,
.dark-mode .forum-line-list li,
.dark-mode .user-side-top,
.dark-mode .user-sign-box,
.dark-mode .forum-topic-op { border-color: #2f3339; }
.dark-mode .forum-topic-body,
.dark-mode .forum-reply-body { color: #c9ced6; }
.dark-mode .forum-top,
.dark-mode .rank-word,
.dark-mode .user-chip { background: #23262b; }
.dark-mode .rank-word,
.dark-mode .user-chip { color: #7aa5ff; }

/* ===================== 移动端 ===================== */
@media (max-width: 1024px) {
    .user-layout { flex-direction: column; }
    .user-side { flex: none; width: 100%; }
    /* 竖排后 .user-layout 是 align-items:flex-start，不写宽度的话 .user-main 会按内容收缩、右侧被裁 */
    .user-main { width: 100%; }
}
@media (max-width: 768px) {
    .dhny_form_row { flex-direction: column; gap: 6px; }
    .dhny_form_row > label { flex: none; padding-top: 0; text-align: left; }
    .dhny_form_btn,
    .dhny_form_note { margin-left: 0; }
    .forum-top { flex-direction: column; align-items: stretch; }
    .forum-top-op { justify-content: space-between; }
    .forum-search input { width: 100%; }
    .forum-reply-side { flex: 0 0 56px; }
    .forum-post-count { width: auto; }
}

/* ===================== 会员中心 v2：头像与装扮 ===================== */
.u-avatar { display: inline-flex; align-items: center; justify-content: center; position: relative; flex-shrink: 0;
    overflow: hidden; border-radius: 50%; background: #f0f2f5; vertical-align: middle; }
.u-avatar img { width: 100%; height: 100%; object-fit: cover; }
.u-avatar-fb::after { content: "\f007"; font-family: "Font Awesome 6 Free", "Font Awesome 5 Free"; font-weight: 900;
    font-style: normal; font-size: 46%; color: #b6bcc7; }
.u-avatar-b { font-size: 42%; font-weight: 700; color: #fff; font-style: normal; }
.u-avatar-b[data-b="1"]  { background: linear-gradient(135deg, #165dff, #4080ff); }
.u-avatar-b[data-b="2"]  { background: linear-gradient(135deg, #ff7d00, #ffb042); }
.u-avatar-b[data-b="3"]  { background: linear-gradient(135deg, #0a7d3c, #34c759); }
.u-avatar-b[data-b="4"]  { background: linear-gradient(135deg, #d4380d, #ff7875); }
.u-avatar-b[data-b="5"]  { background: linear-gradient(135deg, #722ed1, #b37feb); }
.u-avatar-b[data-b="6"]  { background: linear-gradient(135deg, #08979c, #36cfc9); }
.u-avatar-b[data-b="7"]  { background: linear-gradient(135deg, #c41d7f, #f759ab); }
.u-avatar-b[data-b="8"]  { background: linear-gradient(135deg, #1d39c4, #597ef7); }
.u-avatar-b[data-b="9"]  { background: linear-gradient(135deg, #ad6800, #d4b106); }
.u-avatar-b[data-b="10"] { background: linear-gradient(135deg, #262626, #595959); }
.u-avatar-b[data-b="11"] { background: linear-gradient(135deg, #0050b3, #1890ff); }
.u-avatar-b[data-b="12"] { background: linear-gradient(135deg, #389e0d, #95de64); }
.user-side-main { flex: 1; min-width: 0; }
.user-side-group { padding: 14px 20px 6px; font-size: 12px; color: #b6bcc7; letter-spacing: 1px; list-style: none; }
.user-dot { display: inline-block; min-width: 18px; padding: 0 5px; margin-left: 6px; font-size: 11px; line-height: 18px;
    color: #fff; text-align: center; background: #d4380d; border-radius: 9px; }
.user-side-menu li.active .user-dot { color: #ff7875; background: #fff; }
.lv-name { padding: 1px 7px; font-size: 12px; color: #165dff; background: #f0f5ff; border-radius: 4px; }
.lv-vip { padding: 1px 7px; margin-left: 6px; font-size: 12px; color: #7a4b00; background: linear-gradient(90deg, #ffd072, #ffab1d);
    border-radius: 4px; }
.user-level-tip { padding: 0 20px 14px; font-size: 13px; color: #999; line-height: 1.7; }
.user-remark { margin-top: 6px; padding: 6px 10px; font-size: 12px; color: #8a6100; background: #fffbe6;
    border-left: 3px solid #faad14; border-radius: 0 4px 4px 0; }
.user-card-right { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 400; color: #999; }
.user-card-right b { color: #ff7d00; }
.user-row.is-peer { align-items: center; }
.user-row.is-now { background: #f5f7ff; box-shadow: inset 3px 0 0 #165dff; border-radius: 0 6px 6px 0; padding-left: 10px; }
.user-peer-avatar { flex-shrink: 0; text-decoration: none; }
.user-avatar-now { padding: 4px 20px 16px; }
.avatar-builtin-grid { display: flex; flex-wrap: wrap; gap: 10px; padding: 0 20px 16px; }
.avatar-builtin { width: 44px; height: 44px; padding: 0; font-size: 15px; font-weight: 700; color: #fff; border: 2px solid transparent;
    border-radius: 50%; cursor: pointer; transition: all .2s ease; }
.avatar-builtin:hover { transform: scale(1.08); }
.avatar-builtin[data-b="1"]  { background: linear-gradient(135deg, #165dff, #4080ff); }
.avatar-builtin[data-b="2"]  { background: linear-gradient(135deg, #ff7d00, #ffb042); }
.avatar-builtin[data-b="3"]  { background: linear-gradient(135deg, #0a7d3c, #34c759); }
.avatar-builtin[data-b="4"]  { background: linear-gradient(135deg, #d4380d, #ff7875); }
.avatar-builtin[data-b="5"]  { background: linear-gradient(135deg, #722ed1, #b37feb); }
.avatar-builtin[data-b="6"]  { background: linear-gradient(135deg, #08979c, #36cfc9); }
.avatar-builtin[data-b="7"]  { background: linear-gradient(135deg, #c41d7f, #f759ab); }
.avatar-builtin[data-b="8"]  { background: linear-gradient(135deg, #1d39c4, #597ef7); }
.avatar-builtin[data-b="9"]  { background: linear-gradient(135deg, #ad6800, #d4b106); }
.avatar-builtin[data-b="10"] { background: linear-gradient(135deg, #262626, #595959); }
.avatar-builtin[data-b="11"] { background: linear-gradient(135deg, #0050b3, #1890ff); }
.avatar-builtin[data-b="12"] { background: linear-gradient(135deg, #389e0d, #95de64); }
.avatar-album-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(88px,1fr)); gap: 12px; padding: 0 20px 16px; }
.avatar-album-item { position: relative; padding: 6px; background: #f8f8f8; border: 1px solid #eaecef; border-radius: 8px; text-align: center; }
.avatar-album-item img { width: 100%; height: 66px; object-fit: cover; border-radius: 6px; }
.avatar-album-item .user-btn { margin-top: 6px; }

/* ===================== 积分 / 商城 / VIP / 勋章 / 头像框 ===================== */
.user-money-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px,1fr)); gap: 12px; padding: 20px; }
.user-money { padding: 14px; text-align: center; background: #f8f8f8; border-radius: 8px; }
.user-money b { display: block; font-size: 22px; color: #165dff; }
.user-money span { font-size: 12px; color: #666; }
.user-money.is-in b { color: #0a7d3c; }
.user-money.is-out b { color: #d4380d; }
.user-btn.is-main { color: #fff; background: linear-gradient(90deg, #ff7d00, #ffb042); }
.shop-grid, .vip-grid, .badge-grid, .frame-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px,1fr));
    gap: 14px; padding: 18px 20px; }
.badge-grid.is-wall { grid-template-columns: repeat(auto-fill, minmax(96px,1fr)); }
.badge-grid.is-min { grid-template-columns: repeat(auto-fill, minmax(80px,1fr)); padding: 14px; }
.shop-item, .vip-item, .badge-item, .frame-item { position: relative; display: flex; flex-direction: column; align-items: center;
    gap: 6px; padding: 16px 12px; background: #f8f8f8; border: 1px solid #eaecef; border-radius: 8px; text-align: center;
    transition: all .3s ease; }
.shop-item:hover, .vip-item:hover, .frame-item:hover { border-color: rgba(22, 93, 255, .3); background: #f5f7ff; transform: translateY(-2px); }
.badge-item.is-have { background: #fffdf5; border-color: #ffe58f; }
.badge-item.is-wear { background: #f0f5ff; border-color: #165dff; box-shadow: 0 0 0 1px #165dff inset; }
.badge-item:not(.is-have) { opacity: .55; }
.badge-item > i { font-size: 26px; color: #c9ced6; }
.badge-item > em { font-size: 13px; font-style: normal; color: #333; }
.badge-item-cond { font-size: 12px; color: #999; line-height: 1.6; }
.shop-item-icon, .shop-frame-prev, .frame-preview { display: inline-flex; align-items: center; justify-content: center;
    width: 56px; height: 56px; font-size: 24px; color: #165dff; background: #fff; border-radius: 50%; }
.shop-frame-prev { color: #b6bcc7; }
.frame-preview { width: 66px; height: 66px; font-size: 0; }
.frame-preview img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.shop-item-name, .vip-item-name, .frame-item-name { font-size: 15px; font-weight: 600; color: #333; }
.shop-item-intro, .vip-item-days, .frame-item-intro { font-size: 12px; color: #999; line-height: 1.6; }
.shop-item-price, .vip-item-price { font-size: 14px; color: #ff7d00; font-weight: 600; }
.user-switch-line { margin-bottom: 14px; }
.user-switch { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; margin-right: 8px; font-size: 13px;
    color: #333; background: #f8f8f8; border: 1px solid #eaecef; border-radius: 6px; cursor: pointer; }
.user-switch input { accent-color: #165dff; }
.user-qr-thumb { max-width: 140px; margin-top: 6px; border: 1px solid #eaecef; border-radius: 6px; }
.dhny_form_input.is-mini { flex: 0 0 auto; width: 120px; padding: 7px 10px; }
.dhny_card_header.is-sub { padding: 12px 14px; font-size: 14px; border-bottom: 1px solid #eaecef; }
.user-side-box { margin-bottom: 20px; background: #fff; border: 1px solid #eaecef; border-radius: 8px; overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .05); }
.user-side-list { padding: 12px 14px; font-size: 13px; color: #666; line-height: 2; word-break: break-all; }
.user-side-list p { margin-bottom: 4px; }
.user-side-list i { width: 18px; color: #165dff; }
.user-empty.is-in { padding: 16px 0; text-align: left; }

/* ===================== 详情页积分解锁 ===================== */
.unlock-box .unlock-item + .unlock-item, .unlock-box .unlock-item + .unlock-done, .unlock-box .unlock-done + .unlock-item {
    margin-top: 14px; padding-top: 14px; border-top: 1px dashed #eaecef; }
.unlock-item { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; padding: 4px 0; }
.unlock-item-name { font-size: 15px; color: #333; }
.unlock-item-name i { color: #ff7d00; margin-right: 6px; }
.unlock-item-price { font-size: 14px; color: #666; }
.unlock-item-price b { color: #ff7d00; font-size: 18px; }
.unlock-item-tip { flex: 1 1 100%; font-size: 13px; color: #999; line-height: 1.7; }
.unlock-item-tip b { color: #d4380d; }
.unlock-form { flex: 1 1 100%; }
.unlock-hide-blur { flex: 1 1 100%; padding: 18px; font-size: 14px; color: #b6bcc7; text-align: center; letter-spacing: 2px;
    background: repeating-linear-gradient(135deg, #f8f8f8, #f8f8f8 8px, #f0f2f5 8px, #f0f2f5 16px); border-radius: 6px;
    user-select: none; }
.unlock-hide-body { padding: 14px 0 4px; font-size: 14px; color: #333; line-height: 1.9; word-break: break-word; }
.unlock-done { padding: 4px 0; }
.unlock-done-tip { margin-bottom: 10px; font-size: 13px; color: #0a7d3c; }
.unlock-down-btn { display: inline-flex; align-items: center; gap: 8px; padding: 11px 28px; font-size: 15px; color: #fff;
    background: linear-gradient(90deg, #ff7d00, #ffb042); border-radius: 6px; text-decoration: none; }
.unlock-down-btn:hover { color: #fff; box-shadow: 0 4px 12px rgba(255, 125, 0, .32); }
.unlock-down-url { margin-top: 8px; font-size: 12px; color: #999; word-break: break-all; }
.dhny_site_go_button.is-lock { background: linear-gradient(90deg, #ff7d00, #ffb042); }

/* ===================== 会员主页 / 交友广场 ===================== */
.home-card { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; padding: 22px; margin-bottom: 20px;
    background: #fff; border: 1px solid #eaecef; border-radius: 8px; box-shadow: 0 2px 8px rgba(0, 0, 0, .05); }
.home-card-avatar { flex-shrink: 0; }
.home-card-main { flex: 1 1 320px; min-width: 0; }
.home-card-name { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 8px; font-size: 20px; color: #333; }
.home-card-badge { padding: 2px 8px; font-size: 12px; color: #8a6100; background: #fffbe6; border-radius: 4px; }
.home-card-intro { font-size: 14px; color: #666; line-height: 1.7; word-break: break-word; }
.home-card-meta { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 8px; font-size: 12px; color: #999; }
.home-card-stat { display: grid; grid-template-columns: repeat(4, minmax(64px,1fr)); gap: 10px; text-align: center; }
.home-card-stat b { display: block; font-size: 20px; color: #165dff; }
.home-card-stat span { font-size: 12px; color: #999; }
.home-card-op { flex: 1 1 100%; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; padding-top: 14px;
    border-top: 1px dashed #eaecef; }
.home-reward-line { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: #666; }
.friends-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px,1fr)); gap: 14px; padding: 18px 20px; }
.friends-item { display: flex; align-items: flex-start; gap: 10px; padding: 14px; background: #f8f8f8; border: 1px solid #eaecef;
    border-radius: 8px; transition: all .3s ease; }
.friends-item:hover { background: #f5f7ff; border-color: rgba(22, 93, 255, .3); transform: translateY(-2px); }
.friends-avatar { flex-shrink: 0; }
.friends-main { flex: 1; min-width: 0; }
.friends-name { display: flex; align-items: center; gap: 6px; font-size: 15px; }
.friends-name a { color: #333; text-decoration: none; }
.friends-name a:hover { color: #165dff; }
.friends-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 5px; font-size: 12px; color: #bbb; }
.friends-intro { margin-top: 5px; font-size: 13px; color: #999; line-height: 1.6; word-break: break-word; }
.friends-op { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; flex-shrink: 0; }
.friends-search { display: inline-flex; gap: 6px; }

/* ===================== 会员中心 v2 夜间模式 ===================== */
.dark-mode .u-avatar { background: #2f3339; }
.dark-mode .lv-name { color: #7aa5ff; background: #23262b; }
.dark-mode .user-side-group { color: #6b7280; }
.dark-mode .user-side-box { background: #1a1d21; border-color: #2f3339; }
.dark-mode .user-side-list { color: #9aa2ad; }
.dark-mode .user-side-list i { color: #7aa5ff; }
.dark-mode .user-remark { color: #e8c26a; background: #2a2415; border-color: #b8860b; }
.dark-mode .user-level-tip, .dark-mode .unlock-item-tip, .dark-mode .friends-intro, .dark-mode .home-card-intro { color: #9aa2ad; }
.dark-mode .shop-item, .dark-mode .vip-item, .dark-mode .badge-item, .dark-mode .frame-item,
.dark-mode .friends-item, .dark-mode .home-card, .dark-mode .user-money,
.dark-mode .avatar-album-item, .dark-mode .user-switch { color: #c9ced6; background: #23262b; border-color: #2f3339; }
.dark-mode .shop-item-icon, .dark-mode .shop-frame-prev, .dark-mode .frame-preview,
.dark-mode .badge-item > i { background: #1a1d21; }
.dark-mode .badge-item > em, .dark-mode .shop-item-name, .dark-mode .vip-item-name, .dark-mode .frame-item-name,
.dark-mode .friends-name a, .dark-mode .home-card-name, .dark-mode .unlock-item-name,
.dark-mode .unlock-hide-body { color: #c9ced6; }
.dark-mode .badge-item.is-have { background: #2a2415; border-color: #6b5417; }
.dark-mode .badge-item.is-wear { background: #1b2334; border-color: #165dff; }
.dark-mode .user-row.is-now { background: #1b2334; }
.dark-mode .unlock-hide-blur { color: #6b7280; background: repeating-linear-gradient(135deg, #23262b, #23262b 8px, #1a1d21 8px, #1a1d21 16px); }
.dark-mode .unlock-box .unlock-item + .unlock-item, .dark-mode .unlock-box .unlock-item + .unlock-done,
.dark-mode .unlock-box .unlock-done + .unlock-item, .dark-mode .home-card-op { border-color: #2f3339; }
.dark-mode .unlock-down-url, .dark-mode .friends-meta, .dark-mode .home-card-meta, .dark-mode .home-card-stat span { color: #7c828c; }
.dark-mode .user-qr-thumb { border-color: #2f3339; }

/* ===================== 会员中心 v2 自适应 ===================== */
@media (max-width: 1024px) {
    .home-card-stat { grid-template-columns: repeat(4, minmax(56px,1fr)); }
    .shop-grid, .vip-grid, .badge-grid, .frame-grid { grid-template-columns: repeat(auto-fill, minmax(150px,1fr)); }
    .friends-grid { grid-template-columns: repeat(auto-fill, minmax(220px,1fr)); }
}
@media (max-width: 768px) {
    .home-card { flex-direction: column; align-items: flex-start; gap: 12px; padding: 16px; }
    .home-card-stat { grid-template-columns: repeat(4, 1fr); width: 100%; }
    .home-card-op { flex-direction: column; align-items: stretch; }
    .home-card-op .user-btn-form { width: 100%; }
    .home-card-op .dhny_form_btn { width: 100%; }
    .home-reward-line { flex-wrap: wrap; }
    .shop-grid, .vip-grid, .badge-grid, .frame-grid, .friends-grid, .avatar-album-grid { grid-template-columns: repeat(auto-fill, minmax(132px,1fr)); }
    .badge-grid.is-wall, .badge-grid.is-min { grid-template-columns: repeat(auto-fill, minmax(76px,1fr)); }
    .friends-item { flex-wrap: wrap; }
    .friends-op { flex-direction: row; width: 100%; justify-content: flex-end; }
    .user-row { flex-wrap: wrap; }
    .user-row-op { flex-direction: row; width: 100%; justify-content: flex-end; }
    .user-money-grid { grid-template-columns: repeat(2, 1fr); padding: 14px; }
    .dhny_form_input.is-mini { width: 100%; flex: 1 1 100%; }
    .friends-search { display: flex; flex-wrap: wrap; width: 100%; }
    .user-card-right { flex-wrap: wrap; }
    .unlock-item { gap: 8px; }
    .unlock-form .dhny_form_btn { width: 100%; }
}