/* 经营户对外看板（hub）的样式。
 *
 * 字体只走 Noto Sans SC + 系统栈（合规那条线：不外引第三方字体、不内嵌 @font-face）。
 * 这一份里出现的是**排版尺寸**，不是口径 —— 口径那类数（几组、几项、几小时、几个上限）
 * 一律住在 `v3/hub.py`，界面上摆出来的每一个数都从后端现取。
 */
:root {
  --ink: #14171c; --mut: #6b7480; --line: #e4e7ec; --bg: #f6f7f9;
  --card: #fff; --ok: #1a7f4b; --warn: #b25b00; --bad: #b3261e; --grey: #7a828e;
}
* { box-sizing: border-box; }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font: 15px/1.75 "Noto Sans SC", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
}
header#hd {
  position: sticky; top: 0; z-index: 5; background: var(--card);
  border-bottom: 1px solid var(--line); padding: 10px 14px;
}
.hd-a { display: flex; align-items: baseline; gap: 8px; }
.hd-a b { font-size: 17px; }
.hd-b { font-size: 12px; color: var(--mut); margin-top: 2px; }
nav#tabs {
  display: flex; gap: 6px; overflow-x: auto; padding: 8px 12px;
  background: var(--card); border-bottom: 1px solid var(--line);
}
button.tab {
  flex: none; border: 1px solid var(--line); background: var(--bg); color: var(--ink);
  border-radius: 999px; padding: 6px 12px; font: inherit; font-size: 13px;
}
button.tab.on { background: var(--ink); color: #fff; border-color: var(--ink); }
main { padding: 14px; max-width: 900px; margin: 0 auto; }
/* 只写 `section.hide` 的话，那颗「清除筛选」（是个 button）挂上这个类照样摆着 —— 没筛选也点得动。
   同一条理由再往前一步：`.bar` 自己写着 `display: flex`，与这一条同权重、又排在后面，光挂个
   `.hide` 照样收不起来（没有邀请码那一支要整行收掉筛子，靠的就是这一条；真机量出来的：
   `is_visible()` 说它还在）。所以类名写两遍，把权重抬到所有单类规则之上。 */
.hide.hide { display: none; }
h2.q { font-size: 17px; margin: 4px 0 10px; }
h3 { font-size: 15px; margin: 20px 0 8px; }
.mut { color: var(--mut); font-size: 12.5px; }
.bar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 10px 0; }
input[type=search], input[type=text], input[type=date], textarea {
  font: inherit; font-size: 14px; padding: 9px 11px; border: 1px solid var(--line);
  border-radius: 10px; background: var(--card); color: var(--ink);
}
textarea { width: 100%; min-height: 96px; resize: vertical; }
#q { flex: 1 1 220px; }
button { font: inherit; cursor: pointer; }
.bar button, .row-cta button, #msg-send, #consult-send {
  border: 1px solid var(--ink); background: var(--ink); color: #fff;
  border-radius: 10px; padding: 9px 14px; font-size: 14px;
}
button.ghost { background: var(--card); color: var(--ink); border-color: var(--line); }
button.back {
  border: 1px solid var(--line); background: var(--card); color: var(--mut);
  border-radius: 8px; padding: 5px 10px; font-size: 13px; margin-bottom: 8px;
}
label.ck { display: inline-flex; gap: 6px; align-items: center; font-size: 13px; color: var(--mut); }
.chips { display: flex; flex-wrap: wrap; gap: 7px; margin: 6px 0 2px; }
button.chip {
  border: 1px solid var(--line); background: var(--card); border-radius: 10px;
  padding: 7px 10px; font-size: 13px; text-align: left; line-height: 1.4;
}
button.chip.on { border-color: var(--ink); background: #eef1f5; }
button.chip .cw { display: block; font-weight: 600; }
button.chip .cs { display: block; color: var(--mut); font-size: 11.5px; }
.state .st { padding: 10px 12px; border-radius: 10px; font-size: 13.5px; margin: 8px 0; }
.st-loading { background: #eef1f5; color: var(--mut); }
.st-err { background: #fdeceb; color: var(--bad); border: 1px solid #f4c9c6; }
.st-none { background: #fbf4e8; color: var(--warn); border: 1px solid #eddcb8; }
.st-ok { background: #eaf5ec; color: var(--ok); border: 1px solid #c6e3cd; }
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: 12px; margin-top: 10px; }
.card { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 12px; }
article.card { padding: 0; overflow: hidden; cursor: pointer; }
article.card > div { padding: 0 12px; }
article.card > .cover, article.card > .cover-fail { width: 100%; padding: 0; }
img.cover { width: 100%; height: 150px; object-fit: contain; background: #f0f2f5; display: block; }
.cover-fail {
  height: 60px; display: flex; align-items: center; justify-content: center;
  background: #f0f2f5; color: var(--mut); font-size: 12px; padding: 6px; text-align: center;
}
.cn { margin-top: 10px; font-size: 15px; }
.line { margin-top: 4px; font-size: 13.5px; }
.pill { display: inline-block; border-radius: 999px; padding: 3px 9px; font-size: 12px; margin-top: 8px; }
.pill.grey { background: #edeff2; color: var(--grey); }
.pw-allow { background: #e6f4ec; color: var(--ok); }
.pw-deny { background: #fdeceb; color: var(--bad); }
.pw-needs { background: #fbf4e8; color: var(--warn); }
.cav { display: block; color: var(--mut); font-size: 11.5px; margin-top: 8px; padding-bottom: 12px; }
.warn { color: var(--bad); font-size: 13px; margin-top: 6px; }
.grid article.rk-basis_only, .grid article.rk-no_letter { opacity: .96; }
.kv { display: flex; gap: 10px; padding: 8px 0; border-bottom: 1px dashed var(--line); font-size: 13.5px; }
.kv .k { flex: none; width: 104px; color: var(--mut); font-size: 12.5px; }
.kv .v { flex: 1; }
.card.proof { margin: 12px 0; }
.card.proof h3 { margin: 2px 0 6px; }
.win.st-soon .v, .win.st-expired .v, .win.st-before .v { color: var(--bad); font-weight: 600; }
.grow { padding: 9px 0; border-bottom: 1px solid var(--line); font-size: 13.5px; }
.grow .cav { display: inline; margin: 0 0 0 6px; }
.rline { padding: 10px 0; border-bottom: 1px solid var(--line); }
.quote { background: #f4f6f8; border-left: 3px solid var(--line); padding: 7px 10px; margin: 5px 0; font-size: 13.5px; }
.blocks { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; }
img.blk { width: 100%; height: 96px; object-fit: contain; background: #f0f2f5; border: 1px solid var(--line); border-radius: 10px; }
.crow { margin: 9px 0; }
.mrow { margin: 8px 0; }
.row-cta { display: flex; gap: 8px; margin: 14px 0 6px; }
.seg { display: flex; gap: 8px; margin-bottom: 8px; }
.card.form textarea, .card.form input { margin-bottom: 8px; }
footer { padding: 18px 14px 40px; max-width: 900px; margin: 0 auto; border-top: 1px solid var(--line); font-size: 13px; }
footer .mut { margin-top: 6px; }