/* 页面级样式 — 每条规则带 .pg-<key> 祖先限定（样式隔离契约） */

/* ---- 登录 ---- */
.pg-login { display: flex; align-items: center; justify-content: center; min-height: 100vh; padding: calc(var(--spacing) * 4); }
.pg-login .box { width: 100%; max-width: 340px; }
.pg-login .box h1 { font-size: 22px; font-weight: 600; letter-spacing: -0.02em; margin: 0 0 calc(var(--spacing) * 1); }
.pg-login .box .sub { font-size: 13px; color: hsl(var(--muted-foreground)); margin: 0 0 calc(var(--spacing) * 5); }
.pg-login .err { color: hsl(var(--destructive)); font-size: 12px; min-height: 18px; margin-bottom: calc(var(--spacing) * 2); }

/* ---- 工作台 ---- */
.pg-home .steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(var(--spacing) * 2.5); margin-bottom: calc(var(--spacing) * 4); }
.pg-home .step { padding: calc(var(--spacing) * 3); }
.pg-home .step .n { font-size: 11px; color: hsl(var(--muted-foreground)); font-family: ui-monospace, monospace; }
.pg-home .step .t { font-size: 13px; font-weight: 600; margin-top: calc(var(--spacing) * 1); }
.pg-home .step .d { font-size: 12px; color: hsl(var(--muted-foreground)); margin-top: calc(var(--spacing) * 1); }
.pg-home .pubs { display: grid; grid-template-columns: repeat(4, 1fr); gap: calc(var(--spacing) * 2.5); margin-bottom: calc(var(--spacing) * 4); }
.pg-home .pub {
  display: flex; flex-direction: column; gap: calc(var(--spacing) * 1.5);
  padding: calc(var(--spacing) * 3.5); border: 1px solid hsl(var(--border));
  border-radius: var(--radius); text-decoration: none; color: hsl(var(--foreground));
  transition: transform .18s ease-out, background-color .18s ease-out;
}
.pg-home .pub:hover { transform: translateY(-2px); background: color-mix(in srgb, hsl(var(--foreground)) 3%, transparent); }
.pg-home .pub .ic { width: 32px; height: 32px; border-radius: calc(var(--radius) - 2px);
  background: color-mix(in srgb, hsl(var(--foreground)) 5%, transparent);
  display: flex; align-items: center; justify-content: center; }
.pg-home .pub .ic svg { width: 16px; height: 16px; }
.pg-home .pub .t { font-size: 13px; font-weight: 600; }
.pg-home .pub .d { font-size: 12px; color: hsl(var(--muted-foreground)); }
.pg-home .cols { display: grid; grid-template-columns: 1fr 1fr; gap: calc(var(--spacing) * 3); }
.pg-home .cols h3 { font-size: 13px; font-weight: 600; margin: 0 0 calc(var(--spacing) * 2); }
@media (max-width: 900px) {
  .pg-home .steps, .pg-home .pubs { grid-template-columns: 1fr 1fr; }
  .pg-home .cols { grid-template-columns: 1fr; }
}

/* ---- 发布页（dynamic/video/podcast 共用骨架） ---- */
.pg-pub .sec { margin-bottom: calc(var(--spacing) * 4); }
.pg-pub .sec > .lb { font-size: 13px; font-weight: 500; margin-bottom: calc(var(--spacing) * 2); display: block; }
.pg-pub .file-chip {
  display: inline-flex; align-items: center; gap: calc(var(--spacing) * 1.5);
  font-size: 12px; font-family: ui-monospace, monospace;
  background: color-mix(in srgb, hsl(var(--foreground)) 5%, transparent);
  border-radius: calc(var(--radius) - 4px); padding: calc(var(--spacing) * 1.5) calc(var(--spacing) * 2.5);
  margin: calc(var(--spacing) * 1) calc(var(--spacing) * 1) 0 0;
}
.pg-pub .file-chip button { border: 0; background: none; cursor: pointer; color: hsl(var(--muted-foreground)); padding: 0 2px; font-size: 13px; }
.pg-pub .cover-row { display: flex; gap: calc(var(--spacing) * 2.5); flex-wrap: wrap; }
.pg-pub .cover-box { width: calc(var(--spacing) * 34); }
.pg-pub .cover-box img { width: 100%; border-radius: calc(var(--radius) - 2px); display: block; }
.pg-pub .tags { display: flex; flex-wrap: wrap; gap: calc(var(--spacing) * 1.5); }
.pg-pub .tag { display: inline-flex; align-items: center; gap: 4px; font-size: 12px;
  background: hsl(var(--muted)); border-radius: 999px; padding: calc(var(--spacing) * 1) calc(var(--spacing) * 2.5); }
.pg-pub .tag button { border: 0; background: none; cursor: pointer; color: hsl(var(--muted-foreground)); }
.pg-pub video.preview, .pg-pub audio.preview { max-width: 320px; width: 100%; border-radius: calc(var(--radius) - 2px); display: block; margin-top: calc(var(--spacing) * 2); }
.pg-pub .pub-state { display: flex; align-items: center; gap: calc(var(--spacing) * 2); font-size: 13px; color: hsl(var(--muted-foreground)); }
.pg-pub .pub-state .dot { width: 8px; height: 8px; border-radius: 50%; background: hsl(var(--success)); }

/* ---- 文章编辑 ---- */
.pg-article .title-in {
  width: 100%; border: 0; outline: none; background: transparent;
  font-size: 24px; font-weight: 600; letter-spacing: -0.02em; color: hsl(var(--foreground));
  padding: 0; margin-bottom: calc(var(--spacing) * 2);
}
.pg-article .title-in::placeholder { color: color-mix(in srgb, hsl(var(--muted-foreground)) 60%, transparent); }
.pg-article .editor-cols { display: flex; gap: 0; border: 1px solid hsl(var(--border)); border-radius: var(--radius); overflow: hidden; min-height: 420px; }
.pg-article .editor-cols > * { flex: 1; min-width: 0; }
.pg-article .editor-cols > :nth-child(2) { border-left: 1px solid color-mix(in srgb, hsl(var(--border)) 60%, transparent); }
.pg-article .md-src { border: 0; border-radius: 0; min-height: 420px; }
.pg-article .md-src:focus { box-shadow: none; }
.pg-article .preview { padding: calc(var(--spacing) * 3.5); font-size: 14px; line-height: 1.7; overflow-y: auto; max-height: 560px; }
.pg-article .preview img { max-width: 100%; }
.pg-article .preview pre { background: hsl(var(--muted)); padding: calc(var(--spacing) * 2.5); border-radius: calc(var(--radius) - 2px); overflow-x: auto; font-size: 12.5px; }
.pg-article .preview code { font-family: ui-monospace, monospace; font-size: .9em; }
.pg-article .toolbar { display: flex; gap: calc(var(--spacing) * 1); align-items: center; flex-wrap: wrap; margin-bottom: calc(var(--spacing) * 2); }
.pg-article .toolbar .sep { width: 1px; height: 18px; background: hsl(var(--border)); }
.pg-article .toolbar .cnt { margin-left: auto; font-size: 12px; color: hsl(var(--muted-foreground)); font-family: ui-monospace, monospace; }

/* ---- 草稿/历史 ---- */
.pg-list .row .badge { flex-shrink: 0; }

/* ---- 扩展页 ---- */
.pg-ext .hero { max-width: 520px; }
.pg-ext .status-ic { width: 44px; height: 44px; border-radius: var(--radius);
  display: flex; align-items: center; justify-content: center; margin-bottom: calc(var(--spacing) * 3); }
.pg-ext .status-ic.ok { background: color-mix(in srgb, hsl(var(--success)) 12%, transparent); color: hsl(var(--success)); }
.pg-ext .status-ic.warn { background: color-mix(in srgb, hsl(var(--warning)) 12%, transparent); color: hsl(var(--warning)); }
.pg-ext .status-ic.err { background: color-mix(in srgb, hsl(var(--destructive)) 10%, transparent); color: hsl(var(--destructive)); }
.pg-ext .status-ic svg { width: 22px; height: 22px; }
.pg-ext code { background: hsl(var(--muted)); padding: 1px 6px; border-radius: 4px; font-size: 12px; }

/* ---- 账号 ---- */
.pg-accounts .pf-item { cursor: default; }
.pg-accounts .pf-item img.avatar { width: 24px; height: 24px; border-radius: 50%; }

/* ---- 设置 ---- */
.pg-settings .sec { max-width: 480px; }
.pg-settings .sec h3 { font-size: 13px; font-weight: 600; margin: 0 0 calc(var(--spacing) * 2); }