/* ============================================================
   style-gold-layout-pages.css — 功能 4 页专属布局覆盖层（员工C）
   作用页面：create.html / profile.html / moments.html / wallet.html
   加载顺序：style-gold.css → style-gold-layout.css(员工A 共享框架) → 本文件
   本轮任务：彻底重排 4 页布局与排版（分组卡片 / 双栏 sticky / 留白 / 字号层级）
   硬性约定：
     1. 只动结构与排版，不改任何颜色——新样式一律复用黑金既有取值
        （--p-surface / --p-surface2 / --border / rgba(212,175,55,…) 等）
     2. 不修改 style-gold.css / style-gold-pages.css / style-gold-layout.css
     3. 桌面容器：表单页 960px、动态流 640px、个人主页 1080px；
        移动端 ≤768px 全宽 + 16px 边距，≤390px 不溢出不遮挡
   ============================================================ */

/* ===== 1. 区块标题组件：金色小竖条 + 标题 + 金色细线 ===== */
.lp-section-title { display:flex; align-items:center; gap:10px; margin:0 0 24px; } /* GM 统一：下边距 24px */
.lp-section-title::before {
  content:''; flex-shrink:0; width:4px; height:16px; border-radius:2px;
  background:#d4af37; box-shadow:0 0 8px rgba(212,175,55,.5);
}
.lp-section-title h2 {
  margin:0; font-size:17px; font-weight:600; line-height:1.4;
  color:var(--p-text); letter-spacing:.5px;
}
.lp-section-title::after {
  content:''; flex:1 1 auto; height:1px; min-width:24px;
  background:linear-gradient(90deg, rgba(212,175,55,.45), rgba(212,175,55,0));
}

/* ===== 2. create.html：左表单分组 + 右 sticky 实时预览 + 底部提交栏 ===== */
.lp-create-page .navbar-glass .max-w-3xl { max-width:960px; }
.lp-create-wrap { max-width:960px; margin:0 auto; padding:36px 20px 130px; }
.lp-create-head { margin-bottom:36px; }
.lp-create-head .lp-page-title { font-size:28px; font-weight:700; line-height:1.3; margin-bottom:10px; }
.lp-create-head p { margin:0 auto; max-width:560px; }
.lp-create-grid { display:flex; align-items:flex-start; gap:32px; }
.lp-create-main { flex:1 1 auto; max-width:640px; min-width:0; }
.lp-form-group { margin-bottom:36px; }
.lp-form-group:last-child { margin-bottom:0; }
.lp-field-card { padding:20px; }
.lp-field-card + .lp-field-card { margin-top:14px; }

/* 右栏实时预览卡：sticky 随滚动固定 */
.lp-create-preview { width:320px; flex-shrink:0; }
.lp-create-preview .lp-preview-card {
  position:sticky; top:88px;
  background:var(--p-surface);
  border:1px solid rgba(212,175,55,.25);
  border-radius:18px;
  padding:24px 20px 20px;
  text-align:center;
  box-shadow:0 18px 44px rgba(0,0,0,.45);
}
.lp-preview-label { margin:0 0 14px; font-size:12px; letter-spacing:2px; color:var(--p-text2); }
.lp-create-preview #avatar-preview {
  display:block; width:96px; height:96px; object-fit:cover;
  border-radius:50%; margin:0 auto 14px;
  border:2px solid rgba(212,175,55,.45);
  box-shadow:0 0 18px rgba(212,175,55,.25);
}
.lp-create-preview #avatar-preview.hidden { display:none; }
.lp-preview-name { margin:0 0 4px; font-size:18px; font-weight:700; line-height:1.4; color:var(--p-text); }
.lp-preview-meta { margin:0 0 12px; font-size:12px; color:var(--p-text2); }
.lp-preview-hint { margin:0 0 16px; font-size:11px; color:var(--p-text2); opacity:.8; }
.lp-preview-status {
  margin:0; text-align:left; padding:12px 14px;
  background:rgba(10,10,12,.55);
  border:1px solid rgba(212,175,55,.16);
  border-radius:12px;
}
.lp-preview-status-label { margin:0 0 6px; font-size:12px; font-weight:600; color:var(--p-text2); }
.lp-preview-status-text {
  margin:0; font-size:12px; line-height:1.7; color:var(--p-text);
  white-space:pre-line; word-break:break-all;
  max-height:96px; overflow:hidden;
}

/* 底部 sticky 提交栏：保存按钮 + 辅助操作 */
.lp-submit-bar {
  position:fixed; left:0; right:0; bottom:0; z-index:40;
  background:rgba(10,8,6,.92);
  border-top:1px solid rgba(212,175,55,.18);
  -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
  padding:12px 20px calc(12px + env(safe-area-inset-bottom));
}
.lp-submit-bar-inner { max-width:960px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.lp-submit-tips {
  font-size:13px; color:var(--p-text2); text-decoration:none;
  display:inline-flex; align-items:center; gap:6px;
  padding:8px 12px; border-radius:10px; transition:background .2s;
}
.lp-submit-tips:hover { background:rgba(212,175,55,.08); color:#f5d78e; }
.lp-submit-save { padding:12px 44px; border-radius:14px; font-size:15px; font-weight:700; cursor:pointer; border:none; }
#create-tips { scroll-margin-top:120px; margin-top:36px; }

/* ===== 3. profile.html：封面英雄卡 + 桌面左 sticky 用户卡 / 右内容区 ===== */
.lp-profile-page { max-width:1080px; margin:0 auto; padding:24px 20px 60px; }
.lp-profile-page .navbar-glass .max-w-2xl { max-width:1080px; }
.lp-profile-grid { display:flex; align-items:flex-start; gap:32px; }
.lp-profile-side { width:300px; flex-shrink:0; position:sticky; top:84px; }
.lp-profile-main { flex:1 1 auto; min-width:0; }
/* 封面英雄卡：背景图全区 + 头像压封面 */
.lp-hero-card {
  background:var(--p-surface);
  border:1px solid rgba(212,175,55,.22);
  border-radius:20px; overflow:hidden;
  box-shadow:0 18px 44px rgba(0,0,0,.4);
}
.lp-hero-body { padding:0 20px 22px; }
.lp-hero-avatar-wrap { margin-top:-64px; position:relative; z-index:2; margin-bottom:12px; }
.lp-hero-name-row { margin-bottom:8px; }
/* 数据统计行 */
.lp-hero-stats {
  display:flex; margin-top:18px; padding:12px 8px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(212,175,55,.14);
  border-radius:14px;
}
.lp-stat { flex:1 1 0; text-align:center; }
.lp-stat-val { font-size:16px; font-weight:700; line-height:1.4; }
.lp-stat-lbl { font-size:12px; color:var(--p-text2); margin-top:2px; }
/* 操作按钮行 */
.lp-hero-actions { display:flex; gap:10px; margin-top:16px; flex-wrap:wrap; }
.lp-hero-actions button { flex:1 1 auto; min-width:96px; text-align:center; justify-content:center; }
/* Tab 切换内容区 */
.lp-profile-tabs {
  display:flex; gap:8px;
  border-bottom:1px solid rgba(212,175,55,.16);
  margin-bottom:24px;
}
.lp-profile-tabs .profile-tab { font-size:15px; padding:14px 0 12px; position:relative; }
.lp-profile-main #profile-char-grid { grid-template-columns:repeat(3,1fr) !important; gap:16px !important; }
.lp-profile-main #tab-activity { padding:0; }

/* ===== 4. moments.html：居中单列 640px 动态流 ===== */
.lp-moments-page .mom-guest-bar,
.lp-moments-page .mom-publish,
.lp-moments-page .mom-feed,
.lp-moments-page .mom-feed-status,
.lp-moments-page .mom-empty { max-width:640px; }
/* 顶部发布卡：留白分层 */
.mom-publish { padding:18px; }
.mom-publish textarea { min-height:88px; padding:12px 14px; }
.mom-publish .pub-tools { margin-top:12px; }
.pub-foot { display:flex; align-items:center; justify-content:flex-end; gap:14px; margin-top:12px; }
.pub-foot .pub-count { margin-left:0; }
.pub-foot .pub-submit { padding:10px 28px; font-size:14px; }
/* 动态卡片统一结构：作者头 / 文字 / 图片网格 / 操作栏 / 评论区缩进卡片 */
.mom-feed { gap:18px; }
.mom-card { padding:18px; border-radius:18px; }
.mom-card .head { gap:12px; }
.mom-card .head img { width:44px; height:44px; }
.mom-card .head .name { font-size:15px; }
.mom-card .content { margin-top:12px; font-size:15px; line-height:1.7; }
.mom-grid { gap:6px; margin-top:12px; }
.mom-video { margin-top:12px; }
.mom-actions { margin-top:14px; padding-top:14px; gap:8px; }
.mom-actions button { padding:7px 14px; }
/* 评论区：独立缩进卡片 */
.mom-comments {
  margin:12px 0 0 6px; padding:12px;
  background:rgba(10,10,12,.45);
  border:1px solid rgba(255,255,255,.05);
  border-radius:14px;
}
.mom-comments .mom-cmt { padding:10px 12px; margin-bottom:6px; border-radius:12px; }
.mom-comments .mom-cmt:last-child { margin-bottom:0; }
.mom-comments .mom-cmt-input { margin-top:10px; }
.mom-cmt-more { padding:8px 4px; }
/* 游客条弱化：不喧宾 */
.mom-guest-bar { padding:9px 16px; border-radius:10px; font-size:12px; opacity:.8; }
.mom-guest-bar a { font-size:12px; }
.mom-feed-status { padding:20px 0 34px; }

/* ===== 5. wallet.html：英雄余额卡 + 2×2 功能网格 + 下部统计流水 ===== */
.lp-wallet-page .navbar-glass .max-w-2xl { max-width:960px; }
.token-page { max-width:960px; padding:24px 20px 60px; }
.lp-wallet-page #wallet-login-guide { max-width:480px; margin:24px auto; }
/* 顶部英雄余额卡：两余额并排 + 金色大数字 */
.lp-wallet-hero {
  background:var(--p-surface);
  border:1px solid rgba(212,175,55,.3);
  border-radius:20px;
  padding:28px 24px 20px;
  margin-bottom:28px;
  box-shadow:0 18px 44px rgba(0,0,0,.4);
}
.lp-wallet-hero .balance-row { margin-bottom:6px; }
.lp-wallet-hero .balance-card {
  background:transparent; border:none; box-shadow:none;
  margin-bottom:0; padding:0 12px 12px;
}
.lp-wallet-hero .balance-card + .balance-card { border-left:1px solid rgba(212,175,55,.18); border-radius:0; }
.lp-wallet-hero .balance-big { font-size:40px; }
.lp-wallet-hero .refresh-btn { margin-top:4px; }
/* 中部功能模块 2×2 网格：签到日历 / 兑换码 / 转换 / 邀请 */
.lp-wallet-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-bottom:28px; }
.lp-wallet-grid .lp-module { margin-bottom:0; }
.lp-wallet-wide { margin-bottom:28px; }
/* 下部：Token 用量统计卡 + 流水 tab + 列表 */
.lp-wallet-bottom { display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:start; }
.lp-wallet-bottom .lp-module { margin-bottom:0; }
.lp-wallet-bottom .token-big { font-size:34px; }

/* ===== 6. 移动端（≤768px）：单栏堆叠、不溢出不遮挡 ===== */
@media (max-width: 768px) {
  /* create：预览卡上移紧凑展示，提交按钮固定底部（底部导航之上） */
  .lp-create-wrap { padding:20px 16px 170px; }
  .lp-create-head .lp-page-title { font-size:24px; }
  .lp-create-grid { flex-direction:column; gap:24px; }
  .lp-create-main { max-width:100%; }
  .lp-create-preview { order:-1; width:100%; }
  .lp-create-preview .lp-preview-card {
    position:static; padding:16px;
    display:flex; align-items:center; gap:14px; text-align:left;
  }
  .lp-create-preview #avatar-preview { width:72px; height:72px; margin:0; flex-shrink:0; }
  .lp-preview-label { display:none; }
  .lp-preview-info { flex:1 1 auto; min-width:0; }
  .lp-preview-name { font-size:16px; }
  .lp-preview-meta { margin-bottom:8px; }
  .lp-preview-hint { display:none; }
  .lp-preview-status { padding:10px 12px; }
  .lp-submit-bar { bottom:58px; padding:10px 16px calc(10px + env(safe-area-inset-bottom)); }
  .lp-submit-save { padding:11px 32px; font-size:14px; }

  /* profile：单栏堆叠 */
  .lp-profile-page { padding:16px 16px 140px; }
  .lp-profile-grid { display:block; }
  .lp-profile-side { width:100%; position:static; margin-bottom:20px; }
  .lp-profile-main #profile-char-grid { grid-template-columns:repeat(2,1fr) !important; gap:12px !important; }
  .lp-hero-card { border-radius:16px; }

  /* moments：全宽 + 16px 边距 */
  .mom-guest-bar, .mom-publish, .mom-feed {
    margin-left:16px; margin-right:16px;
    max-width:calc(100vw - 32px);
  }
  .mom-card { padding:14px; }

  /* wallet：单列堆叠 */
  .token-page { padding:16px 16px 50px; }
  .lp-wallet-hero { padding:20px 16px 16px; }
  .lp-wallet-hero .balance-big { font-size:34px; }
  .lp-wallet-grid { grid-template-columns:1fr; gap:16px; margin-bottom:24px; }
  .lp-wallet-wide { margin-bottom:24px; }
  .lp-wallet-bottom { grid-template-columns:1fr; gap:16px; }
}

/* ===== 7. 小屏（≤390px）微调：不溢出不遮挡 ===== */
@media (max-width: 390px) {
  .lp-field-card { padding:16px; }
  .lp-hero-actions button { min-width:88px; font-size:13px; }
  .lp-submit-tips { font-size:12px; padding:8px 6px; }
  .lp-wallet-hero .balance-card { padding:0 6px 10px; }
}