/* 受法条约束：L-8(颜色/间距/圆角只许 var(--g-*)，字号 rem，间距只取 4/8/12/16/24)
   法典/01_宪法_六条铁律.md · 04_UI风格规范.md 的『U-9』 · 05_设计系统底座.md 的『S-4』
   本文件：hall + publish 任务大厅与发布表单（类名前缀 hall-，禁与 base.css 重名）
   任务卡/展开详情/搜索条复用 base.css 的 .q-card/.q-exp/.it-search-bar，不重复定义 */

/* ── 页面骨架：与 .wb-page 同理，冲掉 #app 内边距铺满整屏 ── */
.hall-page {
  margin: calc(var(--g-pad) * -1);
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  padding: var(--g-pad);
  box-sizing: border-box;
}

/* ── 顶栏：← 返回 ＋ 页名 ── */
.hall-top { display: flex; align-items: center; gap: var(--g-gap); padding: var(--g-pad-sm) 0; }
.hall-back {
  border: 0; background: none; padding: var(--g-pad-xs) 0;
  font-family: var(--g-font-family); font-size: var(--g-font-size-sm);
  color: var(--g-text-sub); cursor: pointer;
}
.hall-title { font-size: var(--g-font-size-lg); font-weight: 700; }

/* 刷新按钮（任务大厅与工作台完善方案 §七） */
.hall-refresh {
  border: 0; background: none; padding: var(--g-pad-xs);
  font-size: var(--g-font-size); cursor: pointer;
  color: var(--g-text-sub);
}
.hall-refresh:hover { color: var(--g-accent); }

/* 大厅分段标题 */
.hall-section { margin-bottom: var(--g-gap-lg); }
.hall-section-title {
  display: flex; align-items: center; justify-content: space-between;
  padding: var(--g-pad-xs) 0;
  font-size: var(--g-font-size-sm); font-weight: 700; color: var(--g-text);
}
.hall-section-count {
  font-size: var(--g-font-size-tiny); color: var(--g-text-sub);
  background: var(--g-card-hover); padding: 2px var(--g-pad-xs);
  border-radius: var(--g-radius-sm);
}

/* 审核人搜索下拉 */
.hall-reviewer-wrap { position: relative; }
.hall-reviewer-dropdown {
  position: absolute; top: 100%; left: 0; right: 0; z-index: 100;
  max-height: 200px; overflow-y: auto;
  background: var(--g-card); border: 1px solid var(--g-card-border);
  border-radius: var(--g-radius-sm); margin-top: 4px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}
.hall-reviewer-item {
  padding: var(--g-pad-sm); cursor: pointer;
  font-size: var(--g-font-size-sm); color: var(--g-text);
  border-bottom: 1px solid var(--g-card-border);
}
.hall-reviewer-item:last-child { border-bottom: 0; }
.hall-reviewer-item:hover { background: var(--g-card-hover); }

/* ── NPC 问候：头像＋气泡（U-9 一屏一主角，气泡用近白卡） ── */
.hall-npc { display: flex; align-items: flex-start; gap: var(--g-gap-lg); margin: var(--g-gap) 0; }
.hall-npc-av {
  width: 44px; height: 44px; flex-shrink: 0; overflow: hidden;
  border-radius: 50%; border: 1px solid var(--g-card-border);
  background: var(--g-card-hover);
}
.hall-npc-av img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hall-npc-bubble {
  flex: 1; padding: var(--g-pad-sm) var(--g-pad);
  background: var(--g-card); border: 1px solid var(--g-card-border);
  border-radius: var(--g-radius);
  font-size: var(--g-font-size-sm); color: var(--g-text-sub); line-height: 1.5;
}

/* ── 两级筛选 chips：选中态高亮（accent=能点能拿钱，U-9 第1条） ── */
.hall-fgroup { margin-bottom: var(--g-gap); }
.hall-fgroup-label { font-size: var(--g-font-size-tiny); color: var(--g-text-sub); margin-bottom: 4px; }
.hall-fchips { display: flex; flex-wrap: wrap; gap: var(--g-gap); }
.hall-chip {
  padding: 4px var(--g-pad-sm);
  border: 1px solid var(--g-card-border); border-radius: var(--g-radius-sm);
  background: var(--g-card); color: var(--g-text-sub);
  font-family: var(--g-font-family); font-size: var(--g-font-size-tiny);
  cursor: pointer;
}
.hall-chip.is-on {
  background: var(--g-accent-bg); color: var(--g-accent);
  border-color: var(--g-accent); font-weight: 600;
}

/* ── 卡上「我发的」标（my_rel==='posted'，见 法典/03_数据字典.md 的『D-43』） ── */
.hall-mine {
  flex-shrink: 0; padding: 0 var(--g-pad-xs);
  border-radius: var(--g-radius-sm);
  background: var(--g-accent-bg); color: var(--g-accent);
  font-size: var(--g-font-size-micro); font-weight: 600;
}

/* ── 任务状态标签（U-28 刀1：进行中/已满/已结） ── */
.q-status {
  flex-shrink: 0; padding: 0 var(--g-pad-xs);
  border-radius: var(--g-radius-sm);
  font-size: var(--g-font-size-micro); font-weight: 600;
  background: var(--g-card-hover); color: var(--g-text-sub);
}
.q-status--active { background: var(--g-blue-bg); color: var(--g-blue); }
.q-status--settled { background: var(--g-green-bg); color: var(--g-green); }

/* ── 认领键：能点能拿钱 = accent（U-9 第1条） ── */
.hall-claim {
  flex-shrink: 0; border: 0; padding: 4px var(--g-pad-sm);
  border-radius: var(--g-radius-sm);
  background: var(--g-accent); color: var(--g-text-on-dark);
  font-family: var(--g-font-family); font-size: var(--g-font-size-sm); font-weight: 700;
  line-height: 1.2; cursor: pointer;
}

/* ── 列表区 ── */
.hall-list { flex: 1; padding-bottom: var(--g-gap); }

/* ── 底部发布条：吸底，别让「+ 发布委托」滚没影 ── */
.hall-foot {
  position: sticky; bottom: 0; margin-top: auto;
  display: flex; align-items: stretch; gap: var(--g-gap-lg);
  padding: var(--g-pad-sm) 0;
  background: var(--g-topbar-bg);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  border-top: 1px solid var(--g-card-border);
}

/* ── O-28 底栏「我的」白胶囊：左头像 28px 墨绿描边圆＋名字，点进工作台 ── */
.hall-me {
  flex-shrink: 0; display: flex; align-items: center; gap: var(--g-pad-xs);
  padding: 4px var(--g-pad-sm) 4px 4px;
  background: var(--g-card); border: 1px solid var(--g-card-border);
  border-radius: var(--g-radius-xl); cursor: pointer;
  font-family: var(--g-font-family);
}
.hall-me-av {
  width: 28px; height: 28px; flex-shrink: 0; overflow: hidden;
  border-radius: 50%; border: var(--g-avatar-ring) solid var(--g-accent);
  background: var(--g-card-hover);
}
.hall-me-av img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hall-me-name {
  max-width: 5em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: var(--g-font-size-sm); font-weight: 600; color: var(--g-text);
}
.hall-pub {
  flex: 1; min-width: 0; min-height: 44px; border: 0;
  border-radius: var(--g-radius-sm);
  background: var(--g-accent); color: var(--g-text-on-dark);
  font-family: var(--g-font-family); font-size: var(--g-font-size);
  font-weight: 700; cursor: pointer;
}

/* ── O-5 任务卡类型配色：tone 来自 DICT.TASK_TYPE_COLORS（system 蓝/community 橙/main 墨绿/side 绿/daily 灰/personal 蓝）── */
.hall-left--blue   { background: var(--g-blue-bg); }
.hall-left--warn   { background: var(--g-warn-bg); }
.hall-left--accent { background: var(--g-accent-bg); }
.hall-left--green  { background: var(--g-green-bg); }
.hall-left--dim    { background: var(--g-card-hover); }
.hall-tag--blue   { color: var(--g-blue);   background: var(--g-blue-bg); }
.hall-tag--warn   { color: var(--g-warn);   background: var(--g-warn-bg); }
.hall-tag--accent { color: var(--g-accent); background: var(--g-accent-bg); }
.hall-tag--green  { color: var(--g-green);  background: var(--g-green-bg); }
.hall-tag--dim    { color: var(--g-text-sub); background: var(--g-card-hover); }

/* ═══ publish 草稿箱（O-6）═══ */
.hall-drafts { margin-top: var(--g-gap-lg); padding-top: var(--g-gap); border-top: 1px dashed var(--g-card-border); }
.hall-drafts-title { font-size: var(--g-font-size-sm); font-weight: 700; color: var(--g-warn); margin-bottom: var(--g-gap); }
.hall-draft-row { display: flex; align-items: center; gap: var(--g-pad-xs); padding: var(--g-pad-xs) 0; cursor: pointer; }
.hall-draft-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--g-font-size-sm); color: var(--g-text); }
.hall-draft-time { flex-shrink: 0; font-size: var(--g-font-size-xs); color: var(--g-text-dim); }
.hall-draft-del { flex-shrink: 0; border: 0; background: none; cursor: pointer; font-family: var(--g-font-family); font-size: var(--g-font-size-sm); color: var(--g-text-sub); padding: 0 var(--g-pad-xs); }
.hall-drafts-empty { padding: var(--g-pad-sm) 0; font-size: var(--g-font-size-sm); color: var(--g-text-dim); }

/* ═══ publish 发布表单 ═══ */
.hall-form { display: flex; flex-direction: column; gap: var(--g-gap-lg); padding-bottom: var(--g-pad); }
.hall-row { display: flex; gap: var(--g-gap-lg); }
.hall-row .hall-field { flex: 1; min-width: 0; }
.hall-label {
  display: block; margin-bottom: 4px;
  font-size: var(--g-font-size-tiny); font-weight: 600; color: var(--g-text-sub);
}
.hall-input, .hall-select, .hall-textarea {
  width: 100%; padding: var(--g-pad-sm);
  border: 1px solid var(--g-card-border); border-radius: var(--g-radius-sm);
  background: var(--g-card); color: var(--g-text);
  font-family: var(--g-font-family); font-size: var(--g-font-size-sm);
  outline: none; box-sizing: border-box;
}
.hall-input:focus, .hall-select:focus, .hall-textarea:focus { border-color: var(--g-accent); }
.hall-select { min-height: 40px; }
.hall-textarea { resize: vertical; line-height: 1.5; }

.hall-checks { display: flex; flex-wrap: wrap; gap: var(--g-gap); align-items: center; }
.hall-check {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: var(--g-font-size-sm); color: var(--g-text);
  cursor: pointer; padding: var(--g-pad-xs) 0;
}
.hall-count {
  width: 44px; padding: 0 4px; box-sizing: border-box;
  border: 1px solid var(--g-card-border); border-radius: var(--g-radius-sm);
  font-family: var(--g-font-family); font-size: var(--g-font-size-sm);
  text-align: center; color: var(--g-text);
}

.hall-acts { display: flex; gap: var(--g-gap-lg); }
.hall-btn {
  flex: 1; min-height: 44px; cursor: pointer;
  border: 1px solid var(--g-card-border); border-radius: var(--g-radius-sm);
  font-family: var(--g-font-family); font-size: var(--g-font-size-sm); font-weight: 700;
}
.hall-btn--sec { background: var(--g-card); color: var(--g-text-sub); }
.hall-btn--pri { background: var(--g-accent); color: var(--g-text-on-dark); border-color: var(--g-accent); }