/* ============ 公开页样式（第 8 笔：服务端渲染页 <style> 全部迁入） ============
   tokens 唯一定义处：/static/tokens.css（对齐 docs/design/DESIGN.md）
   这里只允许引用 var(--*)；页面模板不再写 <style> 或内联 style。 */
@import url("/static/tokens.css");

/* ---------- 基础 ---------- */
body.pub {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font:
    var(--fs-base) / 1.8 -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    "PingFang SC",
    "Microsoft YaHei",
    sans-serif;
}
.pub .wrap {
  max-width: 820px;
  margin: 0 auto;
  padding: var(--sp-8) var(--sp-4) var(--sp-12);
}
.pub h1 {
  font-size: var(--fs-xl);
  line-height: 1.35;
  margin: var(--sp-2) 0;
  color: var(--text);
}
.pub h2 {
  font-size: var(--fs-md);
  margin: var(--sp-6) 0 var(--sp-2);
  color: var(--text);
}
.pub h3 {
  font-size: var(--fs-base);
  margin: var(--sp-4) 0 var(--sp-1);
  color: var(--text);
}
.pub p,
.pub li {
  color: var(--muted);
}
.pub a {
  color: var(--accent);
  text-decoration: none;
}
.pub a:hover {
  color: var(--accent2);
}
.pub .muted {
  color: var(--muted);
  font-size: var(--fs-sm);
}
.pub .small {
  font-size: var(--fs-xs);
  color: var(--muted);
}
.pub .box {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: var(--sp-4);
  margin: var(--sp-4) 0;
}
.pub .cta {
  display: inline-block;
  background: var(--grad);
  color: var(--on-accent);
  padding: var(--sp-2) var(--sp-4);
  border-radius: var(--r-md);
  text-decoration: none;
  font-weight: 600;
  margin-top: var(--sp-4);
}
.pub table {
  width: 100%;
  border-collapse: collapse;
  margin: var(--sp-2) 0;
}
.pub th,
.pub td {
  border: 1px solid var(--border);
  padding: var(--sp-2) var(--sp-3);
  text-align: left;
  font-size: var(--fs-sm);
}
.pub th {
  background: var(--panel2);
  color: var(--muted);
}
.pub .foot {
  color: var(--muted);
  font-size: var(--fs-xs);
  margin-top: var(--sp-6);
}
.pub .foot a {
  color: var(--muted);
}
.pub .warn {
  background: rgba(245, 158, 11, 0.08);
  border: 1px solid rgba(245, 158, 11, 0.35);
  color: var(--warn);
  padding: var(--sp-2) var(--sp-3);
  margin: var(--sp-3) 0;
}
/* 替代内联 style 的小工具类 */
.pub .mt-2 {
  margin-top: var(--sp-2);
}
.pub .pub-muted-link {
  color: var(--muted);
}
.pub .pub-crumb {
  font-size: var(--fs-xs);
}
.pub .pub-tiny {
  font-size: var(--fs-xs);
  color: var(--muted);
}
.pub .pub-note {
  font-size: var(--fs-xs);
  color: var(--muted);
}
.pub .pub-foot {
  color: var(--muted);
  font-size: var(--fs-xs);
  margin-top: var(--sp-6);
}
/* 投稿/报错小标题（公开页空态） */
.pub .empty {
  color: var(--muted);
}

/* ---------- 各页差异（用 body 上的页面类收敛） ---------- */
.pub-msg .wrap {
  max-width: 620px;
  padding-top: var(--sp-12);
}
.pub-wait .wrap {
  max-width: 820px;
  padding-top: var(--sp-8);
}
.pub-msg h1,
.pub-wait h1 {
  font-size: var(--fs-xl);
  margin: 0 0 var(--sp-2);
}
.pub-pool .wrap {
  max-width: 680px;
}
.pub-pool .k {
  color: var(--warn);
  font-size: var(--fs-sm);
  letter-spacing: 0.08em;
}
.pub-pool h1 {
  font-size: var(--fs-2xl);
  line-height: 1.35;
  margin: var(--sp-2) 0;
  color: var(--text);
}
.pub-pool .tags {
  display: flex;
  gap: var(--sp-1);
  flex-wrap: wrap;
  margin: var(--sp-3) 0;
}
.pub-pool .tags span {
  border: 1px solid var(--border);
  color: var(--muted);
  border-radius: var(--r-pill);
  padding: 3px var(--sp-2);
  font-size: var(--fs-xs);
}
.pub-pool .cond-list {
  margin: var(--sp-2) 0 0 var(--sp-4);
  padding: 0;
  color: var(--text);
}
.pub-pool .cond-list li {
  margin: var(--sp-1) 0;
}
.pub-pool .rowline {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--sp-2);
}
.pub-pool .stocks {
  margin-top: var(--sp-2);
  color: var(--text);
  font-size: var(--fs-base);
  line-height: 1.9;
}
.pub-pool .linkrow {
  display: flex;
  gap: var(--sp-2);
  margin-top: var(--sp-2);
}
.pub-pool .linkrow input {
  flex: 1;
  min-width: 0;
  background: var(--panel2);
  border: 1px solid var(--input);
  color: var(--text);
  border-radius: var(--r-md);
  padding: var(--sp-2) var(--sp-3);
  font-size: var(--fs-xs);
}
.pub-pool .linkrow button {
  background: var(--accent);
  color: var(--on-accent);
  border: 0;
  border-radius: var(--r-md);
  padding: var(--sp-3) var(--sp-4);
  font-weight: 600;
  min-height: 44px;
  cursor: pointer;
}
.pub-pool .btn {
  display: block;
  text-align: center;
  background: var(--grad);
  color: var(--on-accent);
  text-decoration: none;
  font-weight: 600;
  border-radius: var(--r-lg);
  padding: var(--sp-3);
  margin-top: var(--sp-4);
}
.pub-pool .cond-list li.off {
  color: var(--muted);
  text-decoration: line-through;
}
.pub-pool .offtag {
  color: var(--danger);
  font-size: var(--fs-xs);
  text-decoration: none;
  margin-left: var(--sp-1);
}
.pub-list .wrap {
  max-width: 820px;
}
.pub-list h1 {
  font-size: var(--fs-xl);
}
.pub-list li {
  margin: var(--sp-3) 0;
  padding: var(--sp-3) 0;
  border-bottom: 1px solid var(--border);
}
.pub-list li div {
  color: var(--muted);
  font-size: var(--fs-sm);
}
.pub-status .wrap {
  max-width: 680px;
}
.pub-status .n {
  font-size: var(--fs-2xl);
  color: var(--text);
  font-weight: 600;
}
.pub-about .wrap {
  max-width: 820px;
  padding-top: var(--sp-8);
}
.pub-about .hero {
  width: 100%;
  border-radius: var(--r-lg);
  border: 1px solid var(--border);
  margin: 0 0 var(--sp-4);
  display: block;
}
.pub-about .small {
  margin-top: var(--sp-6);
  border-top: 1px solid var(--border);
  padding-top: var(--sp-3);
}