/* ==================================================================
   主题系统 — 默认 :root = 暖米文艺；html[data-theme="x"] 覆盖即换肤。
   全站 10 个页面共用本文件，主题由 theme.js 设到 <html data-theme>。
   新增主题只需在此追加一个 html[data-theme="..."] 覆盖块即可。
   ================================================================== */
:root {
  color-scheme: light;
  --bg: #f6f3ed;
  --paper: #fffdf9;
  --ink: #1e2329;
  --muted: #6b7280;
  --line: #ddd6cc;
  --accent: #1d6f8f;
  --accent-strong: #0f4d64;
  --warn: #b64b3b;
  --soft: #e8f3f6;
  --shadow: 0 18px 45px rgba(54, 45, 35, 0.12);
  --accent-contrast: #ffffff;
  --radius: 10px;
  --radius-lg: 16px;
  --radius-pill: 999px;
  --bg-layer: none;
  --card-bg: var(--paper);
  --card-border: 1px solid var(--line);
  --card-blur: none;
  --shadow-sm: 0 1px 2px rgba(18, 20, 28, 0.05), 0 4px 12px rgba(18, 20, 28, 0.05);
  --shadow-md: 0 8px 20px rgba(18, 20, 28, 0.08), 0 18px 44px rgba(18, 20, 28, 0.09);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
}

/* ============================================================
   Claude 官网风 — 暖米纸感 + 陶土橙 + 深炭排版，文档式工作台。
   大圆角文档卡 / 药丸描边导航 / 陶土实心按钮 / 深炭代码面板。
   ============================================================ */
html[data-theme="claude"] {
  color-scheme: light;
  --bg: #ece8e0;
  --paper: #faf8f4;
  --ink: #2a2724;
  --muted: #6f6a60;
  --line: #e4ddce;
  --accent: #c96442;
  --accent-strong: #b5573a;
  --warn: #b5573a;
  --soft: #f2e9e1;
  --shadow: 0 14px 36px rgba(90, 70, 55, 0.09);
  --accent-contrast: #ffffff;
  --radius: 14px;
  --radius-lg: 20px;
}
html[data-theme="claude"] body {
  background: var(--bg);
  color: var(--ink);
}
html[data-theme="claude"] .topbar,
html[data-theme="claude"] .profile-card,
html[data-theme="claude"] .demo-card,
html[data-theme="claude"] .stat-card,
html[data-theme="claude"] .glass-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
}
html[data-theme="claude"] h1,
html[data-theme="claude"] h2 {
  color: var(--ink);
  letter-spacing: -0.4px;
}
html[data-theme="claude"] .btn-accent,
html[data-theme="claude"] button.primary {
  background: var(--accent);
  color: #fff;
  border: none;
  border-radius: var(--radius);
  font-weight: 600;
  box-shadow: none;
}
html[data-theme="claude"] .btn-accent:hover {
  background: var(--accent-strong);
}
html[data-theme="claude"] .nav-button,
html[data-theme="claude"] button {
  background: var(--paper);
  border: 1px solid var(--line);
  color: var(--ink);
  border-radius: var(--radius-pill);
}
html[data-theme="claude"] .nav-button:hover,
html[data-theme="claude"] button:hover {
  border-color: var(--accent);
}
html[data-theme="claude"] th {
  background: var(--soft);
  color: var(--accent-strong);
  border-color: var(--line);
}
html[data-theme="claude"] td {
  border-color: var(--line);
  color: var(--ink);
}
html[data-theme="claude"] .chip,
html[data-theme="claude"] .theme-card-tag {
  background: var(--soft);
  color: var(--accent-strong);
}
html[data-theme="claude"] a {
  color: var(--accent);
}
html[data-theme="claude"] .code-panel {
  background: #2b2825;
  color: #ece7df;
  border: 1px solid #3a3631;
  border-radius: var(--radius);
}

/* ============================================================
   Gemini 官网风 — 高呼吸留白 + 蓝紫粉渐变 + 圆润药丸 + 柔光晕。
   超大圆角白卡 / 角落彩色光晕 / 渐变大标题 / 药丸蓝按钮。
   ============================================================ */
html[data-theme="gemini"] {
  color-scheme: light;
  --bg: #f6f8fc;
  --paper: #ffffff;
  --ink: #1f1f24;
  --muted: #5f6368;
  --line: #e6ebf3;
  --accent: #4285f4;
  --accent-strong: #1a73e8;
  --warn: #d93025;
  --soft: #eaf1fe;
  --shadow: 0 14px 44px rgba(60, 90, 160, 0.1);
  --accent-contrast: #ffffff;
  --radius: 18px;
  --radius-lg: 28px;
  --grad: linear-gradient(90deg, #4285f4 0%, #9b72cb 45%, #d96570 100%);
}
html[data-theme="gemini"] body {
  background:
    radial-gradient(900px 460px at 88% -8%, rgba(155, 114, 203, 0.16), transparent 60%),
    radial-gradient(820px 420px at 0% 6%, rgba(66, 133, 244, 0.14), transparent 58%),
    radial-gradient(720px 520px at 62% 112%, rgba(217, 101, 112, 0.1), transparent 60%),
    var(--bg);
  background-attachment: fixed;
  color: var(--ink);
}
html[data-theme="gemini"] .topbar,
html[data-theme="gemini"] .profile-card,
html[data-theme="gemini"] .demo-card,
html[data-theme="gemini"] .stat-card,
html[data-theme="gemini"] .glass-card {
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(255, 255, 255, 0.75);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
html[data-theme="gemini"] h1 {
  background: var(--grad);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  letter-spacing: -0.5px;
  font-weight: 700;
}
html[data-theme="gemini"] h2,
html[data-theme="gemini"] h3 {
  color: var(--ink);
}
html[data-theme="gemini"] .btn-accent,
html[data-theme="gemini"] button.primary {
  background: var(--accent);
  color: #fff;
  border: none;
  border-radius: var(--radius-pill);
  font-weight: 600;
  box-shadow: 0 6px 18px rgba(66, 133, 244, 0.32);
}
html[data-theme="gemini"] .btn-accent:hover,
html[data-theme="gemini"] button.primary:hover {
  background: var(--accent-strong);
  color: var(--accent-contrast); /* 同 sage：不写会被后面的通用 button:hover 抢成同色，字消失 */
}
html[data-theme="gemini"] .nav-button,
html[data-theme="gemini"] button {
  background: rgba(255, 255, 255, 0.7);
  border: 1px solid var(--line);
  color: var(--ink);
  border-radius: var(--radius-pill);
}
html[data-theme="gemini"] .nav-button:hover,
html[data-theme="gemini"] button:hover {
  border-color: var(--accent);
  color: var(--accent-strong);
}
html[data-theme="gemini"] th {
  background: var(--soft);
  color: var(--accent-strong);
  border-color: var(--line);
}
html[data-theme="gemini"] td {
  border-color: var(--line);
  color: var(--ink);
}
html[data-theme="gemini"] .chip,
html[data-theme="gemini"] .theme-card-tag {
  background: var(--soft);
  color: var(--accent-strong);
}
html[data-theme="gemini"] a {
  color: var(--accent);
}
html[data-theme="gemini"] .theme-card {
  border-radius: var(--radius-lg);
}

/* ============================================================
   深夜球场风 — 藏青黑球场底 + 柠檬绿主色 + 蓝金点缀 + 球场顶光泛光。
   参考体育转播视觉：泛光灯径向渐变 / 蓝调细线 / 柠檬胶囊按钮带辉光。
   ============================================================ */
html[data-theme="xai"] {
  color-scheme: dark;
  --bg: #06080c;
  --paper: #0d131d;
  --ink: #e9eff8;
  --muted: #8da3bf;
  --line: rgba(151, 178, 216, 0.12);
  --accent: #b6f24a;
  --accent-strong: #c8ff5c;
  --accent2: #58b0ff;
  --gold: #f3c969;
  --warn: #e84a4a;
  --soft: rgba(151, 178, 216, 0.07);
  --shadow: 0 24px 64px rgba(0, 0, 0, 0.62);
  --accent-contrast: #11210a;
  --radius: 12px;
  --radius-lg: 16px;
}
html[data-theme="xai"] body {
  background:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.012) 0 1px, transparent 1px 3px),
    radial-gradient(900px 500px at 10% -10%, rgba(182, 242, 74, 0.075), transparent 60%),
    radial-gradient(900px 500px at 90% -10%, rgba(88, 176, 255, 0.06), transparent 60%),
    radial-gradient(1200px 760px at 50% 120%, rgba(15, 160, 90, 0.07), transparent 62%),
    #06080c;
  background-attachment: fixed;
  color: var(--ink);
  position: relative;
}
/* 球场中圈:底部大圆弧装饰(转播开场机位) */
html[data-theme="xai"] body::after {
  content: ""; position: fixed; left: 50%; bottom: -360px; z-index: 0; pointer-events: none;
  width: 720px; height: 720px; transform: translateX(-50%);
  border: 1.5px solid rgba(182, 242, 74, 0.055); border-radius: 50%;
}
html[data-theme="xai"] .topbar,
html[data-theme="xai"] .admin-header,
html[data-theme="xai"] .profile-card,
html[data-theme="xai"] .demo-card,
html[data-theme="xai"] .stat-card,
html[data-theme="xai"] .glass-card {
  background: linear-gradient(180deg, #121a28, #0d131d);
  border: 1px solid rgba(151, 178, 216, 0.14);
  border-radius: var(--radius-lg);
  box-shadow: inset 0 1px 0 rgba(151, 178, 216, 0.07), var(--shadow);
  transition: border-color 0.22s, transform 0.22s;
}
html[data-theme="xai"] .demo-card:hover,
html[data-theme="xai"] .stat-card:hover {
  border-color: rgba(182, 242, 74, 0.4);
  transform: translateY(-2px);
}
html[data-theme="xai"] h1,
html[data-theme="xai"] h2 {
  color: #fff;
  letter-spacing: 0.5px;
  font-weight: 800;
}
html[data-theme="xai"] h3 {
  color: var(--ink);
  letter-spacing: 0.3px;
}
html[data-theme="xai"] .btn-accent,
html[data-theme="xai"] button.primary {
  background: var(--accent);
  color: var(--accent-contrast);
  border: 1px solid var(--accent);
  border-radius: 99px;
  font-weight: 700;
  letter-spacing: 0.5px;
  box-shadow: 0 6px 28px rgba(182, 242, 74, 0.28);
  transition: 0.22s;
}
html[data-theme="xai"] .btn-accent:hover,
html[data-theme="xai"] button.primary:hover {
  background: var(--accent-strong);
  /* xai 的 accent / accent-strong 都是亮柠檬绿，被通用 button:hover 抢成 var(--accent) 后
     等于亮绿字压亮绿底，同样看不清。accent-contrast 在这套主题里是深色 #11210a。 */
  color: var(--accent-contrast);
  filter: brightness(1.07);
  transform: translateY(-1px);
}
html[data-theme="xai"] .nav-button,
html[data-theme="xai"] button {
  background: transparent;
  border: 1px solid rgba(151, 178, 216, 0.22);
  color: var(--ink);
  border-radius: 99px;
  transition: 0.22s;
}
html[data-theme="xai"] .nav-button:hover,
html[data-theme="xai"] button:hover {
  border-color: var(--accent);
  color: var(--accent);
  background: rgba(182, 242, 74, 0.06);
  transform: translateY(-1px);
}
html[data-theme="xai"] input,
html[data-theme="xai"] select,
html[data-theme="xai"] textarea {
  background: #0d131d;
  border: 1px solid rgba(151, 178, 216, 0.18);
  color: var(--ink);
}
html[data-theme="xai"] input:focus,
html[data-theme="xai"] select:focus,
html[data-theme="xai"] textarea:focus {
  border-color: rgba(182, 242, 74, 0.55);
  outline: none;
  box-shadow: 0 0 0 3px rgba(182, 242, 74, 0.12);
}
html[data-theme="xai"] th {
  background: #121a28;
  color: var(--muted);
  border-color: rgba(151, 178, 216, 0.12);
  letter-spacing: 1px;
  font-size: 12px;
  text-transform: uppercase;
}
html[data-theme="xai"] td {
  border-color: rgba(151, 178, 216, 0.09);
  color: var(--ink);
}
html[data-theme="xai"] .chip,
html[data-theme="xai"] .theme-card-tag {
  background: #121a28;
  border: 1px solid rgba(151, 178, 216, 0.16);
  border-radius: 99px;
  color: var(--muted);
}
html[data-theme="xai"] a {
  color: var(--accent);
}
html[data-theme="xai"] a:hover {
  color: var(--accent-strong);
}
html[data-theme="xai"] .code-panel {
  background: #0a0f18;
  border: 1px solid rgba(151, 178, 216, 0.14);
  border-radius: var(--radius);
  color: #cdd9ea;
  font-family: "SFMono-Regular", Consolas, monospace;
}
html[data-theme="xai"] .theme-card {
  background: #0d131d;
  border-color: rgba(151, 178, 216, 0.14);
}
html[data-theme="xai"] .theme-card.active {
  border-color: var(--accent);
  box-shadow: 0 0 0 2px rgba(182, 242, 74, 0.35), 0 6px 24px rgba(182, 242, 74, 0.14);
}
/* 金色点缀:徽标/高亮数值(参照转播记分牌) */
html[data-theme="xai"] .stat-card b,
html[data-theme="xai"] .stat-card strong {
  color: var(--accent);
}
html[data-theme="xai"] .hub-hero .hub-hero-title,
html[data-theme="xai"] .topbar-title {
  letter-spacing: 1px;
}

/* ===== 个人中心 · 外观风格选择器 ===== */
.appearance-intro {
  margin: 0 0 18px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.7;
}
.theme-picker {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(216px, 1fr));
  gap: 16px;
}
.theme-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 14px;
  border: 1.5px solid var(--line);
  border-radius: 16px;
  background: var(--paper);
  cursor: pointer;
  text-align: left;
  min-height: auto;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.theme-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow);
  border-color: var(--accent);
}
.theme-card.active {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent);
}
.theme-card.active::after {
  content: "✓";
  position: absolute;
  top: 10px;
  right: 12px;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--accent);
  color: var(--accent-contrast);
  font-size: 13px;
  font-weight: 700;
}
.theme-swatch {
  height: 100px;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, currentColor 10%, transparent);
  padding: 13px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
}
.theme-swatch-bar {
  height: 11px;
  width: 62%;
  border-radius: 999px;
}
.theme-swatch-chips {
  display: inline-flex;
  gap: 7px;
}
.theme-swatch-chips i {
  width: 20px;
  height: 20px;
  border-radius: var(--radius);
  display: block;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.06);
}
.theme-card-meta {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.theme-card-name {
  font-weight: 700;
  font-size: 15px;
  color: var(--ink);
}
.theme-card-desc {
  font-size: 12.5px;
  color: var(--muted);
  line-height: 1.5;
}
.theme-card-tag {
  align-self: flex-start;
  margin-top: 1px;
  font-size: 11px;
  padding: 1px 9px;
  border-radius: 999px;
  background: var(--soft);
  color: var(--accent-strong);
}
.appearance-status {
  margin-top: 16px;
  font-size: 13px;
  color: var(--accent-strong);
  min-height: 18px;
}

[hidden] {
  display: none !important;
}

* {
  box-sizing: border-box;
}

/* 全站精致细滚动条（thumb 跟随主题文字色，半透明） */
* {
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--ink) 22%, transparent) transparent;
}
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--ink) 20%, transparent);
  border-radius: 999px;
  border: 2px solid transparent;
  background-clip: padding-box;
}
::-webkit-scrollbar-thumb:hover {
  background: color-mix(in srgb, var(--ink) 34%, transparent);
}
::-webkit-scrollbar-track {
  background: transparent;
}

html {
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  min-height: 100vh;
  font-family:
    Inter, "Noto Sans CJK SC", "PingFang SC", system-ui, -apple-system,
    BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--bg);
  overflow-x: hidden;
}

.server-mode-banner {
  padding: 10px 16px;
  background: #fff4cf;
  border-bottom: 1px solid #e2c56a;
  color: #644f07;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
}

button,
input,
select,
textarea {
  font: inherit;
  min-width: 0;
}

button {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--card-bg);
  color: var(--ink);
  min-height: 38px;
  padding: 0 14px;
  cursor: pointer;
  transition: border-color 0.18s var(--ease-out), background 0.18s var(--ease-out), color 0.18s var(--ease-out);
}

.file-action {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  width: auto;
  flex: 0 0 auto;
  margin: 0;
  padding: 0 14px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--card-bg);
  color: var(--ink);
  cursor: pointer;
  font-size: 14px;
  font-weight: 400;
}

.file-action input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

.hidden-file-input {
  display: none;
}

button:hover {
  border-color: var(--accent);
}

.nav-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 0 11px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--card-bg);
  color: var(--ink);
  font-size: 13px;
  text-decoration: none;
}

.nav-button:hover {
  border-color: var(--accent);
}

.nav-button-accent {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
  font-weight: 600;
}

.nav-button-accent:hover {
  background: var(--accent-strong);
  border-color: var(--accent-strong);
}

.primary {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.primary:hover {
  background: var(--accent-strong);
  border-color: var(--accent-strong);
}

.danger {
  color: var(--warn);
}

.big {
  min-height: 46px;
  font-weight: 700;
}

.app-shell {
  display: grid;
  grid-template-columns: 1fr;
  min-height: 100vh;
}

.sidebar {
  border-right: 1px solid var(--line);
  background: var(--card-bg);
  padding: 24px;
  overflow-y: auto;
}

.brand {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 22px;
}

.brand-mark {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 8px;
  background: var(--accent-strong);
  color: #fff;
  font-weight: 800;
}

h1,
h2,
h3,
p {
  margin: 0;
}

h1 {
  font-size: 22px;
}

h2 {
  font-size: 19px;
}

h3 {
  font-size: 16px;
}

p,
small {
  color: var(--muted);
  line-height: 1.55;
}

.panel,
.controls,
.result-area,
.agent-chat {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
}

.panel {
  padding: 18px;
}

.panel-heading,
.result-toolbar,
.topbar,
.button-row,
.topbar-actions,
.assist-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.topbar-actions,
.assist-actions {
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 8px;
}

.topbar-account {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}

.topbar-account small {
  color: var(--muted);
  font-weight: 700;
}

.compact-row {
  margin-top: 12px;
  justify-content: flex-start;
}

.generate-actions {
  align-items: center;
}

.icon-button {
  width: 34px;
  min-height: 34px;
  padding: 0;
  font-size: 22px;
  line-height: 1;
}

label {
  display: grid;
  gap: 7px;
  margin-top: 14px;
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
}

/* ★排除勾选框：全宽 + 边框那套是给文本输入的，套在 checkbox/radio 上
   会把它拉成一整行的空白方块。作用域版（.memory-page-v2 / .profile-page-v2）
   一直是排除的，只有这条全局的漏了 —— 于是 .login-agree / .profile-checkbox-row
   / .footer-image-check 各写了一遍绕过它。修根上这条，那些补丁只是变冗余，不会坏。 */
input:not([type="checkbox"]):not([type="radio"]),
select,
textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--card-bg);
  color: var(--ink);
  padding: 10px 12px;
  outline: none;
  transition: border-color 0.18s var(--ease-out), box-shadow 0.18s var(--ease-out);
}

textarea {
  min-height: 105px;
  resize: vertical;
  line-height: 1.45;
}

#profileNote {
  min-height: 64px;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent);
}

.two-col,
.param-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.size-note {
  grid-column: 1 / -1;
  margin: -4px 0 0;
  font-size: 11px;
  line-height: 1.25;
  color: var(--muted);
  white-space: nowrap;
}

.range-with-value {
  position: relative;
}

.range-value {
  position: absolute;
  top: 0;
  right: 0;
  min-width: 42px;
  text-align: right;
  font-size: 12px;
  font-weight: 700;
  color: var(--accent);
}

.range-with-value input[type="range"] {
  margin-top: 8px;
}

.site-footer {
  padding: 18px 16px 24px;
  text-align: center;
  font-size: 12px;
  color: var(--muted);
}

.site-footer a {
  color: inherit;
  text-decoration: none;
}

.site-footer a:hover {
  color: var(--accent-strong);
}

.prompt-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 10px;
}

.prompt-toolbar button {
  min-height: 34px;
  padding: 0 11px;
  font-size: 12px;
}

.prompt-tool-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.prompt-library-button {
  margin-left: auto;
  font-weight: 800;
}

.prompt-field-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 24px;
}

.prompt-field-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.prompt-clear-button {
  min-height: 25px;
  padding: 0 8px;
  border-radius: var(--radius);
  font-size: 12px;
}

.prompt-favorite-button {
  display: grid;
  width: 25px;
  min-height: 25px;
  padding: 0;
  place-items: center;
  border-color: rgba(214, 106, 80, 0.28);
  background: var(--card-bg);
  color: var(--accent);
  font-size: 18px;
  line-height: 1;
}

.prompt-favorite-button:hover,
.prompt-favorite-button:focus-visible {
  background: var(--soft);
  color: #bb4f39;
}

.prompt-favorite-button:disabled {
  border-color: rgba(108, 116, 122, 0.18);
  background: var(--card-bg);
  color: rgba(108, 116, 122, 0.45);
  cursor: not-allowed;
}

.prompt-sites {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
  font-size: 13px;
  color: var(--muted);
}

.prompt-sites a,
.prompt-sites button {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--card-bg);
  color: var(--accent-strong);
  font-size: 13px;
  text-decoration: none;
}

.prompt-library-dialog {
  width: min(1080px, calc(100vw - 28px));
  max-height: min(88vh, 960px);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0;
}

.prompt-library-dialog::backdrop {
  background: rgba(20, 24, 28, 0.48);
}

.prompt-library-shell {
  display: grid;
  gap: 14px;
  padding: 18px;
  max-height: inherit;
  overflow: auto;
  background: var(--paper);
}

.prompt-library-toolbar {
  position: sticky;
  top: -18px;
  z-index: 6;
  margin: -18px -18px 0;
  padding: 18px;
  border-bottom: 1px solid var(--line);
  background: var(--paper);
}

.prompt-library-bar,
.prompt-library-item-head,
.prompt-library-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.prompt-square-meta {
  color: var(--muted);
  font-size: 12px;
}

.prompt-square-edited {
  color: color-mix(in srgb, var(--accent, #1d6f8f) 78%, var(--muted));
  font-style: italic;
}

.prompt-library-actions button.liked {
  color: #d6336c;
  border-color: color-mix(in srgb, #d6336c 40%, transparent);
  background: color-mix(in srgb, #d6336c 10%, transparent);
}

.prompt-library-actions button.danger-text {
  color: var(--warn, #c4453b);
}

.prompt-library-bar label {
  flex: 1 1 190px;
  margin-top: 0;
}

.prompt-library-add-button {
  align-self: end;
}

.prompt-library-tabs button {
  min-width: 104px;
}

.prompt-editor-panel {
  display: grid;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 12px;
  background: var(--card-bg);
}

.prompt-editor-grid {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) minmax(160px, 1fr);
  gap: 10px;
}

.prompt-editor-wide {
  grid-column: 1 / -1;
}

.prompt-library-list {
  display: grid;
  gap: 10px;
}

.prompt-library-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  min-height: 36px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.prompt-library-pagination:empty {
  display: none;
}

/* 提示词库分页条 —— 与客户系统(ledger)同款：刷新 / 共N条 / 每页条数 / 页码 / 跳至。
   ledger 那套样式在 ledger/styles.css，主站够不着，这里按主站变量重做一份。 */
.pg-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  width: 100%;
  padding: 4px 2px;
  font-size: 13px;
  font-weight: 500;
  color: var(--muted);
}
.pg-bar .pg-total { opacity: .85; }
.pg-bar select {
  padding: 5px 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--card-bg);
  color: var(--text);
  font-size: 13px;
}
.pg-pages { display: flex; align-items: center; gap: 5px; margin-left: auto; }
.pg-btn {
  min-width: 32px;
  height: 30px;
  padding: 0 9px;
  border: 1px solid var(--line);
  background: var(--card-bg);
  color: var(--text);
  border-radius: 7px;
  cursor: pointer;
  font-size: 13px;
  transition: border-color .12s, color .12s;
}
.pg-btn:hover:not(:disabled) { border-color: var(--accent); color: var(--accent); }
.pg-btn.active { background: var(--accent); color: #fff; border-color: var(--accent); }
.pg-btn:disabled { opacity: .4; cursor: default; }
.pg-gap { opacity: .6; padding: 0 2px; }
.pg-jump {
  width: 54px;
  padding: 5px 6px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--card-bg);
  color: var(--text);
  font-size: 13px;
}

.prompt-library-item {
  display: grid;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 12px;
  background: var(--card-bg);
}

.prompt-library-item-head {
  justify-content: space-between;
}

.prompt-library-item-head strong {
  margin-right: 8px;
}

.prompt-library-item-head span {
  color: var(--muted);
  font-size: 12px;
}

.prompt-library-item pre {
  max-height: 180px;
  margin: 0;
  padding: 10px;
  overflow: auto;
  border-radius: 6px;
  background: var(--card-bg);
  white-space: pre-wrap;
  word-break: break-word;
}

.prompt-library-item small,
.prompt-library-empty {
  color: var(--muted);
}

.prompt-library {
  margin-top: 10px;
}

.memory-prompt-library-shell {
  min-height: min(620px, calc(100vh - 80px));
}

.prompt-samples {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.prompt-samples button {
  min-height: 34px;
  padding: 0 10px;
  font-size: 13px;
}

.workspace {
  padding: 24px;
  overflow: auto;
}

.topbar {
  margin-bottom: 22px;
  align-items: flex-start;
}

.topbar > div:first-child {
  min-width: 220px;
}

.topbar p,
.admin-header p {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  max-width: 760px;
}

.business-hub {
  display: grid;
  gap: 18px;
  margin-bottom: 24px;
}

.home-shell .workspace {
  background:
    linear-gradient(135deg, rgba(29, 111, 143, 0.1) 0 18%, transparent 18% 100%),
    linear-gradient(165deg, transparent 0 62%, rgba(255, 255, 255, 0.16) 62% 78%, transparent 78% 100%),
    repeating-linear-gradient(90deg, rgba(35, 49, 61, 0.025) 0 1px, transparent 1px 26px),
    linear-gradient(180deg, rgba(248, 246, 241, 0.9), rgba(246, 243, 237, 1) 360px),
    var(--bg);
}

.home-bento {
  gap: 16px;
}

.hub-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
  gap: 22px;
  align-items: stretch;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(29, 111, 143, 0.08), rgba(255, 255, 255, 0.72)),
    var(--paper);
  box-shadow: var(--shadow);
}

.home-bento .hub-hero {
  position: relative;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
  gap: 14px;
  min-height: 330px;
  padding: 0;
  overflow: hidden;
  border-color: #ded7cb;
  background:
    linear-gradient(125deg, rgba(255, 253, 249, 0.98) 0%, rgba(255, 253, 249, 0.86) 52%, rgba(232, 243, 246, 0.95) 100%);
  box-shadow: 0 18px 42px rgba(37, 42, 47, 0.1);
}

.home-bento .hub-hero::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 5px;
  background: linear-gradient(90deg, var(--accent), var(--accent), var(--accent), var(--accent));
  content: "";
}

.home-bento .hub-hero::after {
  position: absolute;
  right: 31%;
  bottom: -44px;
  width: 210px;
  height: 210px;
  border: 1px solid rgba(29, 111, 143, 0.12);
  border-radius: 50%;
  background: repeating-linear-gradient(45deg, rgba(29, 111, 143, 0.05) 0 7px, transparent 7px 15px);
  content: "";
  pointer-events: none;
}

.hub-hero-main {
  display: grid;
  align-content: center;
  padding: 34px;
}

.home-bento .hub-hero h1 {
  max-width: 840px;
  margin-top: 10px;
  margin-bottom: 12px;
  font-size: clamp(30px, 4.2vw, 56px);
  line-height: 1.04;
  letter-spacing: 0;
  color: var(--ink);
}

.home-bento .hub-hero p {
  max-width: 760px;
  font-size: 14px;
}

.hub-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 24px;
}

.primary-link {
  border-color: var(--accent);
  background: linear-gradient(135deg, var(--accent), var(--accent-strong));
  color: #fff;
  box-shadow: 0 10px 22px rgba(29, 111, 143, 0.22);
}

.primary-link:hover {
  border-color: var(--accent-strong);
  background: var(--accent-strong);
  color: #fff;
}

.hub-actions .module-link {
  min-height: 40px;
  padding: 0 16px;
  border-color: rgba(29, 111, 143, 0.28);
  background: var(--card-bg);
  box-shadow: 0 8px 18px rgba(37, 42, 47, 0.06);
  transition:
    transform 160ms ease,
    border-color 160ms ease,
    background 160ms ease,
    box-shadow 160ms ease,
    color 160ms ease;
}

.hub-actions .module-link:hover {
  transform: translateY(-2px);
  border-color: var(--accent);
  background: var(--soft);
  color: var(--accent-strong);
  box-shadow: 0 14px 24px rgba(29, 111, 143, 0.14);
}

.hub-actions .primary-link:hover {
  border-color: var(--accent-strong);
  background: linear-gradient(135deg, var(--accent-strong), var(--accent-strong));
  color: #fff;
  box-shadow: 0 16px 28px rgba(29, 111, 143, 0.24);
}

.hub-status {
  position: relative;
  display: grid;
  align-content: start;
  gap: 18px;
  min-height: 100%;
  padding: 22px;
  border-left: 1px solid var(--line);
  background:
    radial-gradient(circle at 85% 10%, rgba(255, 255, 255, 0.18), transparent 42%),
    linear-gradient(135deg, var(--accent), var(--accent-strong));
  color: var(--accent-contrast);
  overflow: hidden;
}

/* xAI 的 accent 是白色，不能当底——单独覆盖成深玻璃卡 */
html[data-theme="xai"] .hub-announcement {
  background: rgba(255, 255, 255, 0.035);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #f4f4f6;
}

.hub-announcement::before {
  content: "";
  position: absolute;
  inset: -40% auto auto -20%;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.22), transparent 68%);
  pointer-events: none;
  animation: announcement-ambient 7s ease-in-out infinite;
}

.hub-announcement::after {
  content: "";
  position: absolute;
  inset: auto -10% -30% auto;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.24), transparent 70%);
  pointer-events: none;
  animation: announcement-ambient 9s ease-in-out infinite reverse;
}

.hub-status-head {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 8px;
}

.hub-status-head span,
.home-focus-card span {
  color: var(--accent-strong);
  font-size: 12px;
  font-weight: 850;
}

.hub-announcement .hub-status-head span {
  color: rgba(255, 255, 255, 0.85);
}

.hub-announcement .hub-announcement-title {
  margin: 0;
  max-width: 100%;
  color: #fff;
  font-size: 28px;
  line-height: 1.12;
  letter-spacing: 0.04em;
  font-weight: 900;
  color: #fff;
  text-shadow:
    0 0 10px rgba(255, 255, 255, 0.55),
    0 0 24px rgba(255, 255, 255, 0.45),
    0 0 42px rgba(255, 255, 255, 0.28);
  filter: drop-shadow(0 8px 18px rgba(0, 0, 0, 0.18));
}

.hub-announcement-list {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 12px;
  margin-top: 4px;
}

.announcement-item {
  position: relative;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  min-height: 56px;
  padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 10px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.06)),
    rgba(255, 255, 255, 0.08);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.28),
    0 10px 24px rgba(8, 18, 28, 0.18);
  backdrop-filter: blur(10px);
  overflow: hidden;
}

.announcement-item::before {
  content: "";
  position: absolute;
  inset: -60% auto -60% -35%;
  width: 42%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.34), transparent);
  transform: skewX(-18deg);
  animation: announcement-sweep 5.5s ease-in-out infinite;
  pointer-events: none;
}

.announcement-item:nth-child(2)::before {
  animation-delay: 1.2s;
}

.announcement-item:nth-child(3)::before {
  animation-delay: 2.4s;
}

.announcement-item:nth-child(4)::before {
  animation-delay: 0.8s;
}

.announcement-item:nth-child(5)::before {
  animation-delay: 1.8s;
}

.announcement-item:nth-child(6)::before {
  animation-delay: 2.8s;
}

.announcement-item-index {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.28), rgba(255, 255, 255, 0.08));
  color: #fff;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0.06em;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.42),
    0 0 16px rgba(255, 255, 255, 0.28);
  text-shadow: 0 0 10px rgba(255, 255, 255, 0.65);
}

.announcement-item-text {
  margin: 0;
  min-width: 0;
  color: rgba(255, 255, 255, 0.96);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.45;
  text-shadow:
    0 0 8px rgba(255, 255, 255, 0.28),
    0 0 18px rgba(255, 255, 255, 0.22);
}

.announcement-empty {
  margin: 0;
  padding: 14px;
  border: 1px dashed rgba(255, 255, 255, 0.24);
  border-radius: 10px;
  color: rgba(255, 255, 255, 0.72);
  font-size: 13px;
  text-align: center;
}

.hub-announcement.announcement-updated {
  animation: announcement-panel-flash 3.2s ease;
}

.hub-announcement.announcement-updated .announcement-item {
  animation: announcement-item-pop 0.72s ease both;
}

.hub-announcement.announcement-updated .announcement-item:nth-child(2) {
  animation-delay: 0.08s;
}

.hub-announcement.announcement-updated .announcement-item:nth-child(3) {
  animation-delay: 0.16s;
}

.hub-announcement.announcement-updated .announcement-item:nth-child(4) {
  animation-delay: 0.24s;
}

.hub-announcement.announcement-updated .announcement-item:nth-child(5) {
  animation-delay: 0.32s;
}

.hub-announcement.announcement-updated .announcement-item:nth-child(6) {
  animation-delay: 0.4s;
}

@keyframes announcement-sweep {
  0%,
  100% {
    transform: translateX(-140%) skewX(-18deg);
    opacity: 0;
  }
  18%,
  42% {
    opacity: 1;
  }
  62% {
    transform: translateX(320%) skewX(-18deg);
    opacity: 0;
  }
}

@keyframes announcement-ambient {
  0%,
  100% {
    transform: translate(0, 0) scale(1);
    opacity: 0.72;
  }
  50% {
    transform: translate(8px, -6px) scale(1.06);
    opacity: 1;
  }
}

@keyframes announcement-panel-flash {
  0% {
    box-shadow: inset 0 0 0 rgba(255, 255, 255, 0);
  }
  18% {
    box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.72);
  }
  100% {
    box-shadow: inset 0 0 0 rgba(255, 255, 255, 0);
  }
}

@keyframes announcement-item-pop {
  0% {
    transform: translateY(8px) scale(0.98);
    opacity: 0.35;
  }
  100% {
    transform: translateY(0) scale(1);
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hub-announcement::before,
  .hub-announcement::after,
  .announcement-item::before,
  .hub-announcement.announcement-updated,
  .hub-announcement.announcement-updated .announcement-item {
    animation: none !important;
  }
}

.hub-visual-board {
  position: relative;
  display: grid;
  min-height: 150px;
  margin: 26px 0 18px;
  padding: 10px;
}

.hub-visual-line {
  position: absolute;
  top: 50%;
  right: 24px;
  left: 24px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.16), var(--accent), #7fd0b0, rgba(255, 255, 255, 0.2));
}

.hub-visual-card {
  position: absolute;
  display: grid;
  gap: 3px;
  width: 118px;
  min-height: 62px;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.14);
  box-shadow: 0 18px 28px rgba(16, 23, 30, 0.2);
  backdrop-filter: blur(12px);
}

.hub-visual-card small {
  color: rgba(255, 255, 255, 0.72);
  font-size: 11px;
  line-height: 1.2;
}

.hub-visual-card b {
  color: #fff;
  font-size: 17px;
}

.visual-project {
  top: 4px;
  left: 0;
}

.visual-content {
  top: 54px;
  left: 50%;
  transform: translateX(-50%);
}

.visual-design {
  right: 0;
  bottom: 4px;
}

.hub-status-list {
  display: grid;
  gap: 10px;
  margin-top: 24px;
}

.home-focus-grid {
  display: grid;
  grid-template-columns: 1.15fr 1fr 1fr;
  gap: 18px;
}

/* 页面加载：焦点卡 + 模块卡错落淡入上移 */
@keyframes hb-rise {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: none; }
}
.home-bento .home-focus-card,
.home-bento .module-card {
  animation: hb-rise 0.55s var(--ease-out) both;
}
.home-bento .home-focus-card:nth-child(2) { animation-delay: 0.06s; }
.home-bento .home-focus-card:nth-child(3) { animation-delay: 0.12s; }
.home-bento .module-card:nth-child(1) { animation-delay: 0.1s; }
.home-bento .module-card:nth-child(2) { animation-delay: 0.16s; }
.home-bento .module-card:nth-child(3) { animation-delay: 0.22s; }
.home-bento .module-card:nth-child(4) { animation-delay: 0.28s; }
.home-bento .module-card:nth-child(5) { animation-delay: 0.34s; }
.home-bento .module-card:nth-child(6) { animation-delay: 0.4s; }
.home-bento .module-card:nth-child(7) { animation-delay: 0.46s; }
.home-bento .module-card:nth-child(n + 8) { animation-delay: 0.52s; }
@media (prefers-reduced-motion: reduce) {
  .home-bento .home-focus-card,
  .home-bento .module-card { animation: none; }
}

.home-focus-card {
  position: relative;
  display: grid;
  gap: 10px;
  min-height: 120px;
  align-content: space-between;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--card-bg);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}

.home-focus-card::before {
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  background: linear-gradient(90deg, var(--accent), var(--accent));
  content: "";
}

.home-focus-card:first-child {
  border-color: rgba(29, 111, 143, 0.28);
  background: var(--card-bg);
}

.home-focus-card:nth-child(2)::before {
  background: linear-gradient(90deg, var(--accent), var(--accent));
}

.home-focus-card:nth-child(3)::before {
  background: linear-gradient(90deg, var(--accent), var(--accent));
}

.home-focus-card strong {
  max-width: 520px;
  color: var(--ink);
  font-size: 17px;
  line-height: 1.42;
}

.eyebrow {
  color: var(--accent-strong);
  font-size: 13px;
  font-weight: 800;
}

.hub-hero h1 {
  margin-top: 8px;
  margin-bottom: 10px;
  font-size: clamp(24px, 3vw, 38px);
  line-height: 1.15;
}

.hub-hero p {
  max-width: 780px;
}

.hub-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.hub-metrics div {
  display: grid;
  gap: 6px;
  align-content: center;
  min-height: 92px;
  padding: 14px;
  border: 1px solid rgba(29, 111, 143, 0.18);
  border-radius: 8px;
  background: var(--card-bg);
}

.hub-metrics strong {
  color: var(--accent);
  font-size: 24px;
}

.hub-metrics span {
  color: var(--ink);
  font-weight: 700;
}

.module-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.module-card {
  display: grid;
  gap: 12px;
  min-height: 210px;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--paper);
}

.home-bento .module-grid {
  grid-auto-flow: dense;
}

.home-bento .module-card {
  position: relative;
  min-height: 224px;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition:
    transform 240ms var(--ease-out),
    border-color 240ms var(--ease-out),
    box-shadow 240ms var(--ease-out);
}

.home-bento .module-card.featured {
  grid-column: span 2;
}

.home-bento .module-card::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 4px;
  background: var(--card-accent, var(--accent));
  content: "";
}

.home-bento .module-card:nth-child(1) {
  --card-accent: var(--accent);
}

.home-bento .module-card:nth-child(2) {
  --card-accent: var(--accent);
}

.home-bento .module-card:nth-child(3) {
  --card-accent: var(--accent);
}

.home-bento .module-card:nth-child(4) {
  --card-accent: var(--accent);
}

.home-bento .module-card:nth-child(5) {
  --card-accent: var(--accent);
}

.home-bento .module-card:nth-child(6) {
  --card-accent: var(--accent);
}

.home-bento .module-card:nth-child(7) {
  --card-accent: var(--accent);
}

.home-bento .module-card:nth-child(8) {
  --card-accent: var(--accent-strong);
}

.home-bento .module-card:hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb, var(--accent) 38%, var(--line));
  box-shadow: var(--shadow-md);
}

.home-bento .module-card h3 {
  font-size: 18px;
}

.home-bento .module-card p {
  font-size: 13px;
}

.module-card.active {
  border-color: rgba(29, 111, 143, 0.42);
  background: linear-gradient(180deg, #ffffff, #f4fbfd);
}

.module-card > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border: 1px solid color-mix(in srgb, var(--accent) 24%, var(--line));
  border-radius: 13px;
  color: var(--accent);
  background: var(--soft);
}
.module-card > span svg {
  width: 23px;
  height: 23px;
}

.module-card ul {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: auto 0 0;
  padding: 0;
  list-style: none;
}

.module-card li {
  padding: 4px 8px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  color: var(--muted);
  background: var(--card-bg);
  font-size: 12px;
}

.module-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: start;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid var(--accent);
  border-radius: var(--radius);
  color: var(--accent-strong);
  background: var(--card-bg);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.workflow-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.workflow-strip div {
  display: grid;
  gap: 4px;
  padding: 12px;
  border-left: 3px solid var(--accent);
  background: var(--card-bg);
}

.workflow-strip strong {
  font-size: 14px;
}

.workflow-strip span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.section-title {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.section-title h2 {
  margin: 4px 0;
  font-size: 22px;
}

.creator {
  display: grid;
  grid-template-columns: minmax(420px, 560px) minmax(360px, 1fr);
  gap: 22px;
  align-items: start;
}

.controls,
.result-area {
  padding: 20px;
}

.account-panel {
  margin-bottom: 16px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.account-login,
.account-models {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 8px;
  align-items: end;
  margin-top: 12px;
}

/* 只有绘图模型一项时单列铺满，并把「绘图模型」标题放大到和原「模型选择」小标题一样 */
.account-models-single {
  grid-template-columns: 1fr;
  margin-top: 0;
}

.account-model-title {
  display: block;
  margin-bottom: 8px;
  font-size: 16px;
  font-weight: 600;
  color: var(--text);
}

@media (max-width: 680px) {
  .account-login,
  .account-models {
    grid-template-columns: 1fr;
  }

  .profile-shell {
    padding: 12px;
  }

  .profile-grid,
  .profile-main-grid,
  .profile-security-grid,
  .profile-prompt-layout,
  .project-layout,
  .project-form-grid {
    grid-template-columns: 1fr;
  }

  .profile-daily-bars {
    grid-template-columns: repeat(7, minmax(26px, 1fr));
    row-gap: 14px;
  }

  .profile-bar-head,
  .profile-list-item {
    align-items: flex-start;
    flex-direction: column;
  }

  .profile-attachment-main {
    width: 100%;
  }
}

@media (min-width: 681px) and (max-width: 1180px) {
  .profile-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .profile-settings {
    grid-column: 1 / -1;
  }

  .profile-main-grid {
    grid-template-columns: 1fr;
  }
}

/* 居中但**不能把内容顶出屏幕**：
   原来是 grid + place-items:center，内容一旦高过视口（注册页字段多、或小屏），
   卡片顶部会溢出到视口上方且滚不回去 —— 表现就是「错位、看不到」。
   改成 flex + margin:auto + 上下 padding：内容矮时居中，内容高时从顶部开始并能正常滚动。 */
.login-page {
  display: flex;
  min-height: 100vh;
  justify-content: center;
  padding: 24px 16px;
  box-sizing: border-box;
}

.login-shell {
  width: min(440px, 100%);
  margin: auto; /* 关键：内容矮时垂直居中，内容高时退化成正常文档流，不会截顶 */
}

.login-card {
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper);
  box-shadow: var(--shadow);
}

.profile-shell {
  min-height: 100vh;
  padding: 24px;
}

.profile-topbar {
  margin-bottom: 18px;
}

.profile-subnav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: -4px 0 16px;
}

.profile-subnav button {
  min-height: 38px;
  padding: 0 14px;
  background: var(--card-bg);
  color: var(--ink);
  font-weight: 800;
}

.profile-subnav button.active {
  border-color: rgba(29, 111, 143, 0.42);
  background: var(--soft);
  color: var(--accent-strong);
}

.profile-grid,
.profile-main-grid {
  display: grid;
  gap: 14px;
}

.profile-grid {
  grid-template-columns: minmax(260px, 1.5fr) repeat(5, minmax(136px, 1fr));
  margin-bottom: 14px;
}

.profile-main-grid {
  grid-template-columns: minmax(0, 1.4fr) minmax(340px, 0.8fr);
  margin-bottom: 14px;
}

.profile-card {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper);
  box-shadow: var(--shadow);
}

.profile-summary-card,
.profile-security-card,
.profile-security-form,
.profile-verified-email,
.profile-email-prompt-content {
  display: grid;
  gap: 12px;
}

.profile-summary-card p,
.profile-email-prompt-content p {
  margin: 0;
  color: var(--muted);
}

.profile-security-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  align-items: start;
}

.profile-security-grid .profile-settings {
  grid-column: 1 / -1;
}

.profile-security-form label {
  margin-top: 0;
}

.profile-security-form button.primary {
  justify-self: start;
}

.profile-verified-email {
  padding: 14px;
  border: 1px solid rgba(47, 143, 91, 0.24);
  border-radius: 8px;
  background: var(--soft);
}

.profile-verified-email strong {
  overflow-wrap: anywhere;
}

.profile-verified-email span {
  color: #267451;
  font-size: 13px;
  font-weight: 800;
}

.profile-attachments-card {
  min-height: 320px;
}

.profile-attachment-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 12px;
  margin-bottom: 10px;
}

.profile-attachment-filter {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-size: 13px;
}

.profile-attachment-filter select {
  min-width: 148px;
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
  color: var(--text);
  font-size: 13px;
}

.profile-attachment-hint {
  margin: 0 0 12px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}

.profile-retention-badge {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  margin-right: 6px;
  padding: 0 7px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
}

.profile-retention-badge.long {
  background: var(--soft);
  color: #2f6b3a;
}

.profile-retention-badge.generated {
  background: var(--soft);
  color: #74459a;
}

.profile-retention-badge.workflow {
  background: var(--soft);
  color: var(--accent);
}

.profile-retention-badge.canvas,
.profile-source-badge.canvas {
  background: var(--soft);
  color: var(--accent);
}

.profile-retention-badge.ppt,
.profile-source-badge.ppt {
  background: var(--soft);
  color: #9a5b16;
}

.profile-ledger-card {
  min-height: 320px;
}

.profile-email-prompt {
  width: min(520px, calc(100vw - 28px));
}

.profile-prompt-layout {
  display: grid;
  grid-template-columns: minmax(230px, 0.72fr) minmax(320px, 1fr) minmax(360px, 1.05fr);
  gap: 14px;
  align-items: start;
}

.profile-prompt-manager,
.profile-prompt-editor,
.profile-prompt-list,
.profile-prompt-category-list {
  display: grid;
  gap: 10px;
}

.profile-prompt-scopes {
  display: flex;
  flex-wrap: wrap;
  grid-template-columns: none;
}
.profile-prompt-scopes button {
  flex: 1 1 auto;
  white-space: nowrap; /* 「房地产提示词」不换行 */
}

.profile-prompt-category-list button,
.profile-prompt-item button {
  width: 100%;
  height: auto;
  min-height: 42px;
  text-align: left;
  background: var(--card-bg);
}

.profile-prompt-category-list button.active,
.profile-prompt-item.active button {
  border-color: rgba(29, 111, 143, 0.42);
  background: var(--soft);
}

.profile-prompt-page {
  display: grid;
  gap: 14px;
}

.profile-prompt-page .profile-prompt-scopes {
  max-width: 480px;
}

.profile-prompt-filter {
  display: grid;
  grid-template-columns: minmax(0, 0.7fr) minmax(0, 0.7fr) minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
}

.profile-prompt-filter button {
  min-height: 40px;
}

.profile-prompt-page .profile-prompt-list {
  max-height: none;
}

.profile-prompt-page .admin-prompt-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}

.profile-prompt-page .admin-prompt-pagination span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

@media (max-width: 720px) {
  .profile-prompt-filter { grid-template-columns: 1fr 1fr; }
}

.profile-prompt-bulkbar {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  padding: 9px 11px;
  border-radius: 10px;
  background: var(--soft);
  font-size: 13px;
}

.profile-prompt-bulkbar label {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  margin: 0;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
}

.profile-prompt-bulkbar input[type="checkbox"] {
  width: auto;
  min-height: 0;
  margin: 0;
  cursor: pointer;
}

.profile-prompt-bulkbar select {
  min-width: 110px;
}

.profile-prompt-bulkbar button[disabled] {
  opacity: 0.45;
  cursor: default;
}

.profile-prompt-item {
  display: flex;
  align-items: stretch;
  gap: 8px;
}

.profile-prompt-check {
  width: auto !important;
  min-height: 0 !important;
  margin: 14px 0 0 4px !important;
  flex: none;
  cursor: pointer;
}

.profile-prompt-item button {
  display: grid;
  gap: 4px;
  flex: 1;
  min-width: 0;
}

.prompt-scene-badge {
  display: inline-flex;
  align-items: center;
  padding: 0 7px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent) 15%, transparent);
  color: var(--accent-strong, var(--accent));
  font-size: 11px;
  font-weight: 700;
}

.profile-prompt-item small {
  overflow-wrap: anywhere;
}

.profile-square-item {
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  flex-wrap: wrap;
}
.profile-square-info {
  display: grid;
  gap: 4px;
  flex: 1 1 240px;
  min-width: 0;
}
.profile-square-info strong { overflow-wrap: anywhere; }
.profile-square-info small {
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.profile-square-ops {
  display: flex;
  gap: 8px;
  flex: 0 0 auto;
  margin-left: auto;
  flex-wrap: wrap;
  justify-content: flex-end;
}
/* 覆盖 .profile-prompt-item button 的 width:100%，否则三个按钮各占一行竖排 */
.profile-square-ops button {
  width: auto;
  min-height: 32px;
  height: 32px;
  padding: 0 12px;
  white-space: nowrap;
  flex: 0 0 auto;
}

.profile-checkbox-row {
  display: flex !important;
  align-items: center;
  gap: 9px;
}
/* hidden 属性要能盖过上面的 !important，否则广场编辑里分享框藏不掉 */
.profile-checkbox-row[hidden] {
  display: none !important;
}

.profile-checkbox-row input {
  width: 16px;
  height: 16px;
  margin: 0;
}

.profile-bot-layout {
  display: grid;
  grid-template-columns: minmax(280px, 0.85fr) minmax(360px, 1.15fr);
  gap: 14px;
  align-items: start;
}

.profile-bot-list-card,
.profile-bot-editor,
.profile-bot-list {
  display: grid;
  gap: 10px;
}

.profile-bot-item button {
  width: 100%;
  min-height: 62px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  text-align: left;
  background: var(--card-bg);
}

.profile-bot-item.active button {
  border-color: rgba(29, 111, 143, 0.42);
  background: var(--soft);
}

.profile-bot-item strong,
.profile-bot-item small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.profile-bot-meta {
  display: grid;
  justify-items: end;
  gap: 5px;
  color: var(--muted);
}

.profile-bot-status {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
  line-height: 1;
}

.profile-bot-status.enabled {
  background: rgba(47, 143, 91, 0.12);
  color: #267451;
}

.profile-bot-status.disabled {
  background: rgba(138, 126, 108, 0.14);
  color: var(--muted);
}

.profile-bot-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.profile-bot-channel-hint {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}

.profile-bot-mode-switch {
  grid-column: 1 / -1;
  display: inline-grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: min(100%, 420px);
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--soft);
}

.profile-bot-mode-switch button {
  min-height: 34px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.profile-bot-mode-switch button.active {
  background: var(--card-bg);
  color: var(--text);
  box-shadow: 0 1px 3px rgba(31, 27, 22, 0.1);
}

.profile-bot-runtime-line {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 42px;
  padding: 9px 12px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--card-bg);
  color: var(--muted);
  font-size: 13px;
}

.profile-bot-runtime-line strong {
  color: var(--text);
}

.profile-bot-runtime-line[data-state="connected"] {
  border-color: rgba(47, 143, 91, 0.42);
  background: rgba(47, 143, 91, 0.05);
}

.profile-bot-advanced-fields {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--soft);
}

.profile-bot-advanced-fields > summary {
  grid-column: 1 / -1;
  cursor: pointer;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.profile-bot-advanced-fields > small {
  grid-column: 1 / -1;
  color: var(--muted);
  line-height: 1.5;
}

.profile-wechat-connect {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.profile-wechat-connect[data-status="connected"] {
  border-color: rgba(47, 143, 91, 0.42);
  background: rgba(47, 143, 91, 0.045);
}

.profile-wechat-qr-wrap {
  display: grid;
  place-items: center;
  min-width: 0;
}

.profile-wechat-qr,
.profile-wechat-qr-placeholder {
  width: 200px;
  height: 200px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.profile-wechat-qr {
  display: block;
  object-fit: contain;
}

.profile-wechat-qr-placeholder {
  display: grid;
  place-items: center;
  padding: 20px;
  color: var(--muted);
  font-size: 13px;
  text-align: center;
}

.profile-wechat-connect-info {
  display: grid;
  justify-items: start;
  gap: 10px;
  min-width: 0;
}

.profile-wechat-connect-info > strong {
  font-size: 17px;
}

.profile-wechat-connect-info > p,
.profile-wechat-connect-info > small {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.profile-wechat-verify {
  display: grid;
  gap: 7px;
  width: min(100%, 380px);
}

.profile-wechat-verify > span {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.profile-wechat-verify button {
  min-width: 92px;
}

@media (max-width: 860px) {
  .profile-bot-layout,
  .profile-bot-fields,
  .profile-bot-item button {
    grid-template-columns: 1fr;
  }

  .profile-bot-meta {
    justify-items: start;
  }

  .profile-wechat-connect {
    grid-template-columns: 1fr;
  }

  .profile-bot-advanced-fields {
    grid-template-columns: 1fr;
  }
}
.prompt-title-hover {
  position: relative;
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 6px;
}

.prompt-title-hover strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.prompt-title-hover img {
  position: absolute;
  bottom: calc(100% + 8px);
  left: 0;
  z-index: 8;
  display: none;
  /* 用户反馈 168px 悬停图看不清 → 放大到 240px；存储缩略图也同步提到 320px/q80 保证不糊 */
  width: 240px;
  height: 240px;
  object-fit: cover;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
  box-shadow: var(--shadow);
}

.prompt-title-hover:hover img,
.prompt-title-hover:focus-within img {
  display: block;
}

.project-layout {
  display: grid;
  grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.project-subnav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: -8px 0 16px;
}

.project-subnav a {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
  color: var(--ink);
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
}

.project-subnav a.active {
  border-color: rgba(29, 111, 143, 0.42);
  background: var(--soft);
  color: var(--accent-strong);
}

.project-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding-top: 4px;
}

.project-pagination span {
  color: var(--muted);
  font-size: 14px;
  font-weight: 700;
}

.project-list-panel,
.project-editor-panel,
.project-context-box {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper);
  box-shadow: var(--shadow);
}

.project-list {
  display: grid;
  gap: 10px;
}

.project-list-item {
  display: grid;
  gap: 5px;
  width: 100%;
  height: auto;
  min-height: 82px;
  padding: 12px;
  text-align: left;
  background: var(--card-bg);
}

.project-list-item.active {
  border-color: var(--accent);
  background: var(--soft);
}

.project-list-item strong,
.project-list-item span,
.project-list-item small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-form {
  display: grid;
  gap: 16px;
}

.project-form-section {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.project-form-section h4 {
  margin: 0;
}

.project-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.wide-field,
.workflow-model-field {
  grid-column: 1 / -1;
}

.project-context-box {
  margin-top: 16px;
  box-shadow: none;
}

.project-context-box pre {
  max-height: 340px;
  margin: 0;
  padding: 14px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #182028;
  color: #f6fbff;
  white-space: pre-wrap;
  word-break: break-word;
}

.project-permission-note,
.project-import-box,
.project-summary-editor,
.project-images-box,
.project-updates-box {
  display: grid;
  gap: 14px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.home-bento .workflow-strip {
  padding: 10px;
  box-shadow: 0 10px 28px rgba(37, 42, 47, 0.05);
}

.home-bento .workflow-strip div {
  border-left-color: transparent;
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(180deg, var(--accent), var(--accent)) border-box;
  border-left: 3px solid transparent;
}

.home-bento .workflow-strip div:nth-child(2) {
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(180deg, var(--accent), var(--accent)) border-box;
}

.home-bento .workflow-strip div:nth-child(3) {
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(180deg, var(--accent), var(--accent)) border-box;
}

.home-bento .workflow-strip div:nth-child(4) {
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(180deg, var(--accent), var(--accent)) border-box;
}

.home-bento .workflow-strip div:nth-child(5) {
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(180deg, var(--accent), var(--accent)) border-box;
}

.project-permission-note {
  border-color: rgba(29, 111, 143, 0.24);
  background: var(--soft);
  color: var(--accent-strong);
  font-weight: 800;
}

.project-summary-editor {
  align-items: start;
}

.project-summary-editor textarea {
  min-height: 110px;
}

.project-updates-list {
  display: grid;
  gap: 10px;
}

.project-image-layout {
  align-items: start;
}

.project-image-file-label {
  grid-column: 1 / -1;
}

.project-image-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 14px;
}

.project-image-pending-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 10px;
}

.project-image-pending-item {
  display: grid;
  justify-items: stretch;
  gap: 6px;
  min-width: 0;
  height: auto;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
  text-align: left;
  position: relative;
}

.project-image-pending-remove {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 22px;
  height: 22px;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.55);
  color: #fff;
  font-size: 13px;
  line-height: 22px;
  text-align: center;
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.15s;
  z-index: 2;
}

.project-image-pending-item:hover .project-image-pending-remove {
  opacity: 1;
}

.project-image-pending-remove:hover {
  background: rgba(200, 40, 40, 0.85);
}

.project-image-pending-item img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 6px;
  background: #f7f3eb;
}

.project-image-pending-item span,
.project-image-pending-item small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-image-pending-item small {
  color: var(--muted);
  font-size: 12px;
}

.project-image-card {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.project-image-preview {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f7f3eb;
}

.project-image-preview img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.project-image-body {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.project-image-body input,
.project-image-body textarea {
  width: 100%;
}

.project-image-body small {
  color: var(--muted);
  overflow-wrap: anywhere;
}

.project-image-preview-dialog {
  width: min(94vw, 1080px);
  max-width: 1080px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
}

.project-image-preview-dialog::backdrop {
  background: rgba(24, 32, 40, 0.72);
}

.project-image-preview-dialog-content {
  display: grid;
  gap: 12px;
  padding: 16px;
  border-radius: 8px;
  background: var(--paper);
}

.project-image-preview-stage {
  display: grid;
  place-items: center;
  min-height: 240px;
  max-height: 78vh;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f7f3eb;
}

.project-image-preview-stage img {
  max-width: 100%;
  max-height: 78vh;
  object-fit: contain;
}

.project-update-item {
  display: grid;
  gap: 4px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.project-update-item p {
  white-space: pre-wrap;
}

.profile-settings label {
  margin-top: 12px;
}

.profile-stat-card {
  display: flex;
  min-height: 150px;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
}

.profile-stat-card span,
.profile-stat-card small,
.profile-card small,
.form-hint,
.empty-note {
  color: var(--muted);
}

.profile-stat-card strong {
  font-size: 28px;
  color: var(--ink);
}

#profileRoleBadge {
  padding: 5px 10px;
  border-radius: 999px;
  background: var(--soft);
  color: #267451;
  font-size: 12px;
  font-weight: 700;
}

.profile-bars {
  display: grid;
  gap: 14px;
  margin-top: 16px;
}

.profile-bar-row {
  display: grid;
  gap: 7px;
}

.profile-bar-head,
.profile-list-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.profile-bar-head strong,
.profile-list-item strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.profile-bar-head span {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 13px;
}

.profile-bar-track {
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--card-bg);
}

.profile-bar-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: hsl(calc(185 + var(--bar-index) * 28), 70%, 42%);
}

.profile-daily-bars {
  display: grid;
  min-height: 190px;
  grid-template-columns: repeat(14, minmax(26px, 1fr));
  align-items: end;
  gap: 8px;
  padding-top: 18px;
}

.profile-day {
  display: grid;
  align-items: end;
  gap: 8px;
  text-align: center;
}

.profile-day i {
  display: block;
  width: 100%;
  border-radius: 6px 6px 2px 2px;
  background: linear-gradient(180deg, var(--accent), var(--accent));
}

.profile-day span {
  color: var(--muted);
  font-size: 12px;
}

.profile-list {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.profile-list-item {
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.profile-list-item:last-child {
  border-bottom: 0;
}

.profile-list-item div {
  display: grid;
  min-width: 0;
  gap: 4px;
}

.profile-list-item .cost {
  color: #c0392b;
  font-weight: 700;
}

.profile-list-item .income {
  color: #267451;
  font-weight: 700;
}

.profile-source-badge {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  margin-right: 6px;
  padding: 0 7px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
}

.profile-source-badge.attachment {
  background: var(--soft);
  color: var(--accent);
}

.profile-source-badge.generated {
  background: var(--soft);
  color: #74459a;
}

.profile-source-badge.workflow {
  background: var(--soft);
  color: var(--accent);
}

.profile-attachment-item {
  align-items: center;
  gap: 12px;
}

.profile-attachment-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 6px;
  flex: 0 0 auto;
  margin-left: auto;
}

.profile-attachment-expiry {
  max-width: 180px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  text-align: right;
}

.attachment-quota-dialog {
  width: min(460px, calc(100vw - 28px));
}

.attachment-quota-dialog-content .attachment-quota-note {
  font-size: 13px;
  color: var(--text-secondary, #737373);
  margin-top: 8px;
}

.attachment-quota-dialog-content .attachment-quota-breakdown {
  font-size: 13px;
  color: var(--text-helper, #737373);
}

.attachment-quota-dialog-content p {
  margin: 0;
  line-height: 1.6;
}

.profile-attachment-actions button {
  min-height: 32px;
  padding: 6px 10px;
  font-size: 13px;
  white-space: nowrap;
}

.profile-attachment-main {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.attachment-thumb,
.attachment-file-icon {
  width: 58px;
  height: 58px;
  flex: 0 0 auto;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.attachment-thumb {
  display: block;
  padding: 0;
  cursor: zoom-in;
}

.attachment-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.attachment-file-icon {
  display: grid;
  place-items: center;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.login-actions {
  margin-top: 18px;
}

.login-links {
  margin-top: 16px;
  font-size: 13px;
}

.segmented {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.segmented button {
  border: 0;
  background: transparent;
  min-height: 36px;
}

.segmented button.active {
  background: var(--card-bg);
  box-shadow: 0 2px 8px rgba(46, 39, 31, 0.1);
  color: var(--accent-strong);
  font-weight: 800;
}

.file-drop {
  display: grid;
  gap: 12px;
  padding: 14px;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  border: 1px dashed #adc4cc;
  border-radius: 8px;
  background: var(--soft);
}

.file-drop label {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin-top: 0;
}

.file-drop input,
.file-drop select {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.file-drop input[type="file"] {
  inline-size: 100%;
  min-inline-size: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.upload-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.upload-actions button {
  flex: 0 1 auto;
  max-width: 100%;
}

.upload-actions small,
#fileHint {
  display: block;
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.uploaded-image-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(92px, 1fr));
  gap: 10px;
}

.uploaded-image-item {
  display: grid;
  gap: 6px;
  position: relative;
}

.uploaded-image-item img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--card-bg);
  cursor: zoom-in;
}

.uploaded-image-remove {
  position: absolute;
  top: 6px;
  right: 6px;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  min-width: 24px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.85);
  border-radius: 999px;
  background: rgba(21, 30, 36, 0.72);
  color: #fff;
  font-size: 18px;
  line-height: 1;
  box-shadow: 0 6px 14px rgba(21, 30, 36, 0.22);
}

.uploaded-image-remove:hover {
  background: #b42318;
  border-color: rgba(255, 255, 255, 0.95);
}

.uploaded-image-item small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

details {
  margin-top: 14px;
  border-top: 1px solid var(--line);
  padding-top: 14px;
}

summary {
  cursor: pointer;
  font-weight: 800;
}

.advanced {
  margin-top: 8px;
}

.preview-box {
  display: grid;
  min-height: 420px;
  align-content: start;
  gap: 12px;
  margin-top: 16px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
  overflow: auto;
}

/* 生图成功后，接口返回的原始 JSON 折叠收起，避免图片下面跟着一大坨返回文本 */
.preview-raw-details > summary {
  cursor: pointer;
  width: fit-content;
  color: var(--muted);
  font-size: 12px;
  user-select: none;
  list-style: none;
}
.preview-raw-details > summary::-webkit-details-marker {
  display: none;
}
.preview-raw-details > summary::before {
  content: "▸ ";
}
.preview-raw-details[open] > summary::before {
  content: "▾ ";
}
.preview-raw-details > pre {
  margin-top: 8px;
}

.assist-actions {
  margin-top: 14px;
}

.agent-chat {
  margin-top: 16px;
  padding: 16px;
  box-shadow: none;
}

.agent-chat-list {
  display: grid;
  gap: 10px;
  max-height: 260px;
  margin-top: 12px;
  overflow: auto;
}

.agent-message {
  max-width: 92%;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.agent-message.user {
  justify-self: end;
  background: var(--soft);
  border-color: #b8d1da;
}

.agent-message.assistant {
  justify-self: start;
}

.agent-message strong {
  display: block;
  margin-bottom: 5px;
  font-size: 12px;
  color: var(--muted);
}

.log-panel {
  margin-top: 16px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #252a30;
  color: #f7f2e9;
}

.log-panel h3 {
  color: #fff;
}

.log-panel pre {
  max-height: 260px;
  margin-top: 12px;
  overflow: auto;
  color: #f7f2e9;
}

.settings-dialog {
  width: min(760px, calc(100vw - 28px));
  max-height: calc(100vh - 28px);
  border: 0;
  border-radius: 10px;
  padding: 0;
  background: transparent;
}

.settings-dialog.fallback-open,
.image-viewer.fallback-open,
.mask-dialog.fallback-open {
  position: fixed;
  inset: 14px;
  z-index: 20;
  display: block;
  margin: auto;
}

.settings-dialog::backdrop {
  background: rgba(28, 28, 28, 0.42);
}

.settings-content {
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--paper);
  box-shadow: var(--shadow);
}

.settings-content textarea {
  min-height: 130px;
}

.image-result {
  display: grid;
  gap: 8px;
}

.image-result-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.preview-box img,
.history-item img {
  cursor: zoom-in;
}

.preview-box img {
  /* 输出区按等比例缩小，长边最多 800px（小屏则不超过容器宽度），点开看原图 */
  max-width: min(100%, 800px);
  max-height: 800px;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 6px;
  border: 1px solid var(--line);
  background: var(--card-bg);
}

.preview-working {
  min-height: 320px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 12px;
  color: var(--muted);
  text-align: center;
}

.preview-working strong {
  color: var(--ink);
  font-size: 18px;
}

.preview-working p {
  max-width: 420px;
  margin: 0;
  color: var(--muted);
  line-height: 1.7;
}

.preview-working-spinner {
  width: 34px;
  height: 34px;
  border: 3px solid #eadfce;
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: previewSpin 0.8s linear infinite;
}

@keyframes previewSpin {
  to {
    transform: rotate(360deg);
  }
}

.image-viewer {
  width: min(1180px, calc(100vw - 24px));
  height: min(860px, calc(100vh - 24px));
  border: 0;
  border-radius: 10px;
  padding: 0;
  background: transparent;
}

.image-viewer::backdrop {
  background: rgba(13, 17, 20, 0.72);
}

.mask-dialog {
  width: min(1180px, calc(100vw - 24px));
  height: min(860px, calc(100vh - 24px));
  border: 0;
  border-radius: 10px;
  padding: 0;
  background: #111820;
}

.mask-dialog::backdrop {
  background: rgba(13, 17, 20, 0.72);
}

.mask-editor {
  display: grid;
  grid-template-rows: auto 1fr;
  height: 100%;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 10px;
  background: #111820;
  color: #fff;
}

.mask-editor-stage {
  display: grid;
  place-items: center;
  min-height: 0;
  padding: 14px;
  overflow: auto;
}

#maskCanvas {
  max-width: 100%;
  max-height: 100%;
  cursor: crosshair;
  touch-action: none;
  background: #05070a;
}

#maskBrushSize {
  width: 130px;
}

.image-viewer-content {
  display: grid;
  grid-template-rows: auto 1fr;
  height: 100%;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 10px;
  background: #101418;
  color: #fff;
}

.image-viewer-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.image-viewer-toolbar p {
  color: #c8d0d8;
}

.image-viewer-stage {
  display: grid;
  place-items: center;
  min-height: 0;
  padding: 14px;
  overflow: auto;
}

.image-viewer-stage img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

pre {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 12px;
  line-height: 1.55;
}

#statusBadge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  border-radius: 999px;
  padding: 0 10px;
  background: var(--card-bg);
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

#statusBadge.busy {
  background: #fff4cf;
}

#statusBadge.ok {
  background: #dff2df;
  color: #23602f;
}

#statusBadge.error {
  background: #fde4df;
  color: #a33628;
}

.history-wrap {
  margin-top: 18px;
}

.history-list {
  display: grid;
  gap: 10px;
  max-height: 280px;
  overflow: auto;
  margin-top: 12px;
}

.history-item {
  display: grid;
  grid-template-columns: 74px 1fr;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.history-item img {
  width: 74px;
  height: 74px;
  object-fit: cover;
  border-radius: 6px;
  background: var(--card-bg);
}

.history-item strong {
  display: block;
  margin-bottom: 5px;
}

.history-item p {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.history-meta-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.history-meta-row small:first-child {
  min-width: 0;
}

.history-model-name {
  color: var(--muted);
  max-width: 50%;
  overflow: hidden;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.memory-shell {
  height: 100vh;
  padding: 24px;
  overflow: hidden;
}

.memory-topbar {
  margin-bottom: 18px;
}

.memory-layout {
  display: grid;
  grid-template-columns: minmax(260px, 320px) minmax(380px, 1fr) minmax(260px, 340px);
  gap: 16px;
  align-items: stretch;
  height: calc(100vh - 128px);
  min-height: 0;
}

.memory-side,
.memory-main,
.memory-panel {
  min-width: 0;
  min-height: 0;
  padding: 16px;
  box-shadow: none;
}

.memory-side,
.memory-panel {
  overflow: auto;
}

.memory-side {
  display: grid;
  /* 只分两行：上半区(智能体选择/操作按钮，自然高度)+对话记录区(占满剩余空间并内部滚动)。
     用包裹容器而不是按子元素个数数行，避免 memoryAgentMeta 等条件性 display:none 元素
     导致实际子元素数与写死的行数对不上，把最后一行错位成一段空白 */
  grid-template-rows: auto minmax(200px, 1fr);
  align-content: stretch;
  overflow: hidden;
}

.memory-side-top {
  min-height: 0;
}

.memory-side-list-wrap {
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}

.memory-side-list-wrap .memory-conversation-list {
  flex: 1;
  min-height: 0;
}

.memory-identity-models {
  margin-bottom: 18px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.memory-main {
  display: grid;
  grid-template-rows: auto auto 1fr auto auto;
  gap: 12px;
}

.memory-project-picker {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 500px);
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(29, 111, 143, 0.24);
  border-radius: 8px;
  background: var(--soft);
}

.memory-project-picker strong {
  display: block;
  margin-bottom: 3px;
  color: var(--ink);
  font-size: 13px;
}

.memory-project-picker small {
  color: var(--muted);
  font-size: 11.5px;
}

.memory-project-picker select {
  width: 100%;
}

.memory-project-controls {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(120px, 150px);
  gap: 8px;
  align-items: end;
}

.memory-search-mode-control {
  display: grid;
  gap: 4px;
  margin: 0;
}

.memory-search-mode-control span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.memory-meta {
  display: grid;
  gap: 6px;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
  color: var(--muted);
  font-size: 13px;
}

.memory-meta strong {
  color: var(--ink);
  font-size: 15px;
}

.memory-meta span,
.memory-meta p {
  overflow-wrap: anywhere;
}

.memory-heading-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}

.memory-heading-actions button {
  min-height: 34px;
  padding: 0 10px;
  white-space: nowrap;
}

.memory-mobile-shortcuts {
  display: none;
}

.memory-mobile-shortcuts button {
  min-height: 32px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--accent-strong);
  background: var(--card-bg);
  text-decoration: none;
  font-size: 13px;
  font-weight: 800;
}

.memory-mobile-panel-close {
  display: none;
}

.memory-action-row {
  justify-content: flex-start;
  gap: 8px;
  flex-wrap: nowrap;
  margin-top: 12px;
  overflow-x: auto;
  padding-bottom: 2px;
}

.memory-action-row button {
  flex: 0 0 auto;
  min-height: 34px;
  padding: 0 9px;
  font-size: 13px;
  line-height: 1;
  white-space: nowrap;
}

.memory-list-heading {
  margin-top: 18px;
}

.memory-agent-list { display: grid; align-content: start; gap: 6px; margin: 10px 0 4px; max-height: 172px; overflow-y: auto; padding-right: 2px; }
.memory-agent-item { display: flex; align-items: center; border: 1px solid var(--line); border-radius: 8px; background: var(--card-bg); overflow: hidden; flex-shrink: 0; transition: border-color .15s, background .15s; }
.memory-agent-item.active { border-color: var(--accent); background: var(--soft); }
.memory-agent-item-main { flex: 1; display: grid; justify-items: start; gap: 2px; padding: 9px 10px; background: none; border: none; cursor: pointer; text-align: left; min-width: 0; color: inherit; font: inherit; }
.memory-agent-name { font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.memory-agent-item.active .memory-agent-name { color: var(--accent); }
.memory-agent-sub { font-size: 11px; opacity: .6; }
.memory-agent-ops { display: flex; align-items: center; gap: 2px; padding-right: 5px; }
.memory-agent-ops button { width: 24px; height: 24px; border: none; background: none; cursor: pointer; opacity: .45; border-radius: 5px; font-size: 12px; color: inherit; transition: opacity .15s, background .15s; }
.memory-agent-ops button:hover { opacity: 1; background: var(--soft); }

.memory-conversation-list {
  display: grid;
  /* 列宽必须 minmax(0,1fr)：否则长标题会把隐式列撑得比容器宽，行内操作图标被顶出可视区 */
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  gap: 8px;
  margin-top: 10px;
  min-height: 0;
  max-height: none;
  overflow: auto;
  padding-right: 4px;
}

.memory-conversation {
  display: flex;
  align-items: center;
  gap: 6px;
  height: auto;
  min-width: 0;
  min-height: 40px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
  text-align: left;
  cursor: pointer;
}

.memory-conversation:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.memory-conversation.active {
  border-color: var(--accent);
  background: var(--soft);
}

.memory-conversation strong,
.memory-conversation span,
.memory-conversation small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.memory-conversation strong {
  flex: 1;
  min-width: 0;
  font-size: 13px;
  font-weight: 600;
}

/* 对话记录行内的小图标操作(转交/改名/删除):与智能体行一致,平时半透明、悬停浮现 */
.memory-conversation-ops {
  display: flex;
  align-items: center;
  gap: 2px;
  flex: 0 0 auto;
}

.memory-conversation-ops .memory-conversation-edit {
  border: none;
  background: none;
  opacity: 0.4;
}

.memory-conversation:hover .memory-conversation-ops .memory-conversation-edit,
.memory-conversation.active .memory-conversation-ops .memory-conversation-edit {
  opacity: 0.75;
}

.memory-conversation-ops .memory-conversation-edit:hover {
  opacity: 1;
  background: var(--soft);
}

.memory-conversation span,
.memory-conversation small,
.memory-empty {
  color: var(--muted);
  font-size: 12px;
}

.memory-messages {
  display: grid;
  align-content: start;
  gap: 10px;
  max-width: 100%;
  min-height: 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
  overflow-x: hidden;
  overflow-y: auto;
}

.memory-chat-search {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 220px;
}

.memory-chat-search input {
  width: 168px;
  min-height: 30px;
  padding: 6px 9px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--card-bg);
  font-size: 12px;
}

.memory-chat-search button {
  min-height: 30px;
  padding: 5px 9px;
  font-size: 12px;
  white-space: nowrap;
}

.memory-history-loader {
  justify-self: center;
  padding: 6px 12px;
  border: 1px solid #d8dee9;
  border-radius: 999px;
  background: var(--card-bg);
  color: var(--muted);
  font-size: 12px;
}

.memory-message {
  display: grid;
  gap: 6px;
  min-width: 0;
  max-width: 88%;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
  line-height: 1.55;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.memory-message > div {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.memory-message > div > :first-child,
.memory-fullscreen-text > :first-child {
  margin-top: 0;
}

.memory-message > div > :last-child,
.memory-fullscreen-text > :last-child {
  margin-bottom: 0;
}

.memory-message h3,
.memory-message h4,
.memory-message h5,
.memory-message h6,
.memory-fullscreen-text h3,
.memory-fullscreen-text h4,
.memory-fullscreen-text h5,
.memory-fullscreen-text h6 {
  margin: 14px 0 7px;
  color: var(--ink);
  line-height: 1.35;
}

.memory-message h3,
.memory-fullscreen-text h3 {
  font-size: 16px;
}

.memory-message h4,
.memory-fullscreen-text h4 {
  font-size: 15px;
}

.memory-message h5,
.memory-message h6,
.memory-fullscreen-text h5,
.memory-fullscreen-text h6 {
  font-size: 14px;
}

.memory-message p,
.memory-fullscreen-text p {
  margin: 6px 0;
}

.memory-message ul,
.memory-message ol,
.memory-fullscreen-text ul,
.memory-fullscreen-text ol {
  margin: 7px 0;
  padding-left: 20px;
}

.memory-message li,
.memory-fullscreen-text li {
  margin: 3px 0;
  padding-left: 2px;
}

.memory-message blockquote,
.memory-fullscreen-text blockquote {
  margin: 9px 0;
  padding: 7px 10px;
  border-left: 3px solid #a7c8ce;
  background: var(--card-bg);
  color: var(--muted);
}

.memory-message hr,
.memory-fullscreen-text hr {
  height: 1px;
  margin: 14px 0;
  border: 0;
  background: var(--card-bg);
}

.memory-message code,
.memory-fullscreen-text code {
  padding: 1px 5px;
  border-radius: 5px;
  background: var(--card-bg);
  color: var(--accent);
  font-family: Consolas, "Courier New", monospace;
  font-size: 0.92em;
}

.memory-code-block {
  position: relative;
  max-width: 100%;
  margin: 10px 0;
}

.memory-copy-code {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 1;
  min-height: 28px;
  padding: 0 9px;
  border-color: #b9d0d1;
  border-radius: var(--radius);
  background: var(--card-bg);
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
  box-shadow: 0 4px 10px rgba(31, 59, 66, 0.08);
}

.memory-copy-code:hover {
  border-color: #7fb4bc;
  background: var(--card-bg);
}

.memory-copy-code:disabled {
  cursor: default;
  opacity: 0.85;
}

.memory-message pre,
.memory-fullscreen-text pre {
  max-width: 100%;
  margin: 0;
  padding: 42px 14px 12px;
  overflow-x: hidden;
  overflow-y: auto;
  border: 1px solid #d7e4e3;
  border-left: 4px solid #7fb4bc;
  border-radius: 8px;
  background: var(--card-bg);
  color: var(--ink);
  line-height: 1.7;
}

.memory-message pre code,
.memory-fullscreen-text pre code {
  display: block;
  padding: 0;
  background: transparent;
  color: inherit;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.memory-markdown-table-wrap {
  max-width: 100%;
  margin: 10px 0;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.memory-markdown-table-wrap table {
  width: 100%;
  min-width: 460px;
  border-collapse: collapse;
  font-size: 13px;
}

.memory-markdown-table-wrap th,
.memory-markdown-table-wrap td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}

.memory-markdown-table-wrap th {
  background: var(--soft);
  color: var(--ink);
  font-weight: 800;
}

.memory-markdown-table-wrap tr:last-child td {
  border-bottom: 0;
}

.memory-message.user {
  justify-self: end;
  border-color: #b8d1da;
  background: var(--soft);
}

.memory-message.assistant {
  justify-self: start;
}

.memory-message.search-match {
  border-color: #d9902f;
  box-shadow: 0 0 0 2px rgba(217, 144, 47, 0.12);
}

.memory-search-highlight {
  padding: 0 2px;
  border-radius: 3px;
  background: #ffe08a;
  color: #47320a;
}

.memory-message-role,
.memory-message > small {
  color: var(--muted);
  font-size: 12px;
}

.memory-message > div strong,
.memory-fullscreen-text strong {
  color: var(--ink);
  font-weight: 850;
}

.memory-skill-used {
  display: inline-flex;
  max-width: 100%;
  margin-top: 4px;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.4;
  overflow-wrap: anywhere;
  background: linear-gradient(90deg, var(--accent), var(--accent), var(--accent));
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}

.memory-search-note {
  width: fit-content;
  max-width: 100%;
  padding: 4px 8px;
  border-radius: 999px;
  background: var(--soft);
  color: var(--muted);
  font-size: 12px;
}

.memory-search-sources {
  width: min(760px, 100%);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: color-mix(in srgb, var(--soft) 72%, var(--card-bg));
}

.memory-search-sources > summary {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  padding: 8px 10px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 760;
  cursor: pointer;
  list-style: none;
}

.memory-search-sources > summary::-webkit-details-marker {
  display: none;
}

.memory-search-sources > summary small {
  flex: none;
  color: var(--accent);
  font-size: 11px;
}

.memory-research-quality {
  display: grid;
  gap: 8px;
  margin: 0 8px 8px;
  padding: 9px 10px 10px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--card-bg) 84%, var(--soft));
}

.memory-research-quality-head {
  display: flex;
  gap: 7px;
  align-items: center;
  min-width: 0;
}

.memory-research-quality-head > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 760;
}

.memory-research-quality-head > strong {
  padding: 2px 7px;
  border-radius: 999px;
  font-size: 11px;
  line-height: 1.45;
}

.memory-research-quality.level-high .memory-research-quality-head > strong {
  background: color-mix(in srgb, #16845b 12%, transparent);
  color: #11704c;
}

.memory-research-quality.level-medium .memory-research-quality-head > strong {
  background: color-mix(in srgb, #b87812 14%, transparent);
  color: #94600d;
}

.memory-research-quality.level-low .memory-research-quality-head > strong {
  background: color-mix(in srgb, #c14949 12%, transparent);
  color: #a23b3b;
}

.memory-research-quality-head > b {
  display: grid;
  width: 27px;
  height: 27px;
  flex: none;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--ink);
  font-size: 10px;
}

.memory-research-quality-head > small {
  min-width: 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.memory-research-checks {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
}

.memory-research-check {
  display: inline-grid;
  grid-template-columns: 6px auto;
  column-gap: 5px;
  align-items: center;
  padding: 4px 7px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--card-bg);
}

.memory-research-check i {
  width: 6px;
  height: 6px;
  grid-row: 1 / span 2;
  border-radius: 50%;
  background: #16845b;
}

.memory-research-check.partial i {
  background: #bd7b14;
}

.memory-research-check.missing i {
  background: #c14949;
}

.memory-research-check b {
  color: var(--ink);
  font-size: 10px;
  line-height: 1.25;
}

.memory-research-check small {
  color: var(--muted);
  font-size: 9px;
  line-height: 1.25;
}

.memory-research-alert,
.memory-research-conflicts {
  display: grid;
  gap: 4px;
  padding-left: 8px;
  border-left: 2px solid #bd7b14;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.45;
}

.memory-research-alert > strong,
.memory-research-conflicts > strong {
  color: var(--ink);
  font-size: 10px;
}

.memory-research-alert ul {
  display: grid;
  gap: 2px;
  margin: 0;
  padding-left: 16px;
}

.memory-research-conflicts {
  border-left-color: #c14949;
}

.memory-research-conflicts p {
  display: flex;
  gap: 6px;
  align-items: baseline;
  margin: 0;
  flex-wrap: wrap;
}

.memory-research-conflicts p b {
  color: var(--ink);
}

.memory-research-conflicts p small {
  color: var(--muted);
}

.memory-search-source-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  padding: 0 8px 8px;
}

.memory-search-source-card {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 8px;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--card-bg);
  color: var(--ink);
  text-decoration: none;
}

.memory-search-source-card:hover {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--line));
}

.memory-search-source-card > span:last-child {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.memory-search-source-card strong,
.memory-search-source-card small,
.memory-search-source-card em {
  overflow: hidden;
  text-overflow: ellipsis;
}

.memory-search-source-card strong {
  display: block;
  white-space: nowrap;
  font-size: 12px;
}

.memory-search-source-card small {
  white-space: nowrap;
  color: var(--muted);
  font-size: 10px;
}

.memory-search-source-card em {
  display: -webkit-box;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.memory-search-source-index {
  display: grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border-radius: 50%;
  background: var(--soft);
  color: var(--accent);
  font-size: 11px;
  font-weight: 850;
}

.memory-search-source-card.image {
  grid-template-columns: 72px minmax(0, 1fr);
}

.memory-search-source-card.image img {
  width: 72px;
  height: 58px;
  object-fit: cover;
  border-radius: 5px;
  background: var(--soft);
}

.memory-search-empty {
  grid-column: 1 / -1;
  margin: 0;
  padding: 8px;
  color: var(--muted);
  font-size: 12px;
}

@media (max-width: 720px) {
  .memory-research-quality-head {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .memory-research-quality-head > small {
    width: 100%;
    white-space: normal;
  }

  .memory-search-source-grid {
    grid-template-columns: 1fr;
  }
}

.typing-dots {
  display: inline-flex;
  gap: 4px;
  align-items: center;
  min-height: 18px;
}

.typing-dots span {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--muted);
  animation: typing-dot 1.1s infinite ease-in-out;
}

.typing-dots span:nth-child(2) {
  animation-delay: 0.16s;
}

.typing-dots span:nth-child(3) {
  animation-delay: 0.32s;
}

@keyframes typing-dot {
  0%,
  80%,
  100% {
    opacity: 0.35;
    transform: translateY(0);
  }

  40% {
    opacity: 1;
    transform: translateY(-3px);
  }
}

.memory-generated-images {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, min(220px, 100%)));
  gap: 8px;
  max-width: 100%;
}

.memory-search-image-gallery {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.memory-search-image-gallery > header {
  display: flex;
  gap: 10px;
  align-items: baseline;
  justify-content: space-between;
}

.memory-search-image-gallery > header strong {
  font-size: 13px;
}

.memory-search-image-gallery > header small {
  color: var(--muted);
  font-size: 11px;
}

.memory-search-image-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
  gap: 8px;
}

.memory-search-image-item {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.memory-search-image-preview {
  display: grid;
  place-items: center;
  min-height: 112px;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: #fff;
}

.memory-search-image-preview img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.memory-search-image-meta {
  display: grid;
  gap: 4px;
  padding: 8px;
}

.memory-search-image-meta strong,
.memory-search-image-meta small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.memory-search-image-meta strong {
  font-size: 12px;
}

.memory-search-image-meta small {
  color: var(--muted);
  font-size: 10px;
}

.memory-search-image-meta a {
  width: max-content;
  color: var(--accent);
  font-size: 11px;
  text-decoration: none;
}

.memory-search-image-meta a:hover {
  text-decoration: underline;
}

@media (max-width: 640px) {
  .memory-search-image-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .memory-search-image-gallery > header {
    align-items: flex-start;
    flex-direction: column;
    gap: 2px;
  }
}

.memory-generated-image-card {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.memory-generated-image-card > button:first-child {
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
  cursor: zoom-in;
}

.memory-generated-image-card img {
  display: block;
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
}

.memory-generated-reference {
  min-height: 30px;
  padding: 0 10px;
  font-size: 12px;
}

.memory-input-bar {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
}

.memory-command-palette {
  position: absolute;
  left: 0;
  right: 56px;
  bottom: calc(100% + 8px);
  z-index: 30;
  max-height: min(360px, 48vh);
  overflow-y: auto;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
  box-shadow: 0 14px 36px rgba(16, 24, 40, 0.16);
}

.memory-command-palette[hidden] {
  display: none;
}

.memory-command-option {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  width: 100%;
  min-height: 42px;
  padding: 8px 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--ink);
  text-align: left;
}

.memory-command-option:hover,
.memory-command-option.active {
  background: var(--soft);
}

.memory-command-option strong {
  font-size: 13px;
}

.memory-command-option span {
  color: var(--muted);
  font-size: 12px;
}

.memory-send-button {
  position: relative;
  display: grid;
  place-items: center;
  justify-self: end;
  width: 46px;
  height: 46px;
  min-height: 46px;
  padding: 0;
  border: 1px solid #111820;
  border-radius: 999px;
  background: #111820;
  color: #fff;
  box-shadow: 0 8px 18px rgba(17, 24, 32, 0.16);
}

.memory-send-button::before,
.memory-send-button::after {
  content: "";
  position: absolute;
  left: 50%;
  display: block;
  pointer-events: none;
}

.memory-send-button::before {
  top: 15px;
  width: 11px;
  height: 11px;
  border-top: 2.5px solid #fff;
  border-left: 2.5px solid #fff;
  transform: translateX(-50%) rotate(45deg);
}

.memory-send-button::after {
  top: 16px;
  width: 2.5px;
  height: 18px;
  border-radius: 999px;
  background: var(--card-bg);
  transform: translateX(-50%);
}

.memory-send-button:hover {
  border-color: var(--ink);
  background: #25313a;
}

.memory-send-button.is-stopping {
  border-color: var(--ink);
  background: var(--card-bg);
  color: var(--ink);
  box-shadow: none;
}

.memory-send-button.is-stopping::before {
  top: 50%;
  width: 15px;
  height: 15px;
  border: 0;
  border-radius: 3px;
  background: #111820;
  transform: translate(-50%, -50%);
}

.memory-send-button.is-stopping::after {
  display: none;
}

.memory-send-button:disabled {
  cursor: wait;
  opacity: 0.7;
}

.memory-prompt-inspiration {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 32px;
  padding: 0 2px;
  color: var(--muted);
  font-size: 13px;
}

.memory-prompt-inspiration button {
  min-height: 28px;
  padding: 0 10px;
  border-color: #b8d1da;
  background: var(--soft);
  color: var(--accent);
  font-size: 13px;
  font-weight: 800;
}

.memory-prompt-inspiration .memory-favorite-prompt-btn {
  margin-left: auto;
}

.memory-attachments {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.memory-attachment-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.memory-attachment-actions div {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.memory-attachment-actions button {
  min-height: 32px;
  padding: 0 10px;
  font-size: 13px;
  white-space: nowrap;
}

.memory-temp-attachment-option {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  margin-top: 2px;
  color: var(--muted);
  font-size: 13px;
}

.memory-temp-attachment-option input {
  width: 16px;
  height: 16px;
  margin: 0;
}

.memory-attachment-list {
  display: flex;
  align-items: stretch;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 2px;
  scrollbar-width: thin;
}

.memory-attachment-list:empty {
  display: none;
}

.memory-attachment-list::-webkit-scrollbar {
  height: 8px;
}

.memory-attachment-list::-webkit-scrollbar-thumb {
  background: rgba(18, 24, 31, 0.18);
  border-radius: 999px;
}

.memory-attachment-list::-webkit-scrollbar-track {
  background: transparent;
}

.memory-attachment-list > span {
  color: var(--muted);
  font-size: 13px;
}

.memory-attachment-item {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  flex: 0 0 238px;
  width: 238px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.memory-attachment-item.is-document {
  grid-template-columns: 44px minmax(0, 1fr) auto;
  flex-basis: 220px;
}

.memory-attachment-thumb {
  display: block;
  width: 64px;
  height: 64px;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--card-bg);
  cursor: zoom-in;
}

.memory-attachment-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.memory-attachment-file-icon {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--card-bg);
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
}

.memory-attachment-copy {
  min-width: 0;
}

.memory-attachment-item strong,
.memory-attachment-item small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.memory-attachment-item small {
  color: var(--muted);
}

.memory-attachment-item button {
  min-height: 30px;
  padding: 0 9px;
  font-size: 12px;
}

.memory-attachment-item button.memory-attachment-thumb {
  min-height: 0;
  padding: 0;
}

.memory-input-bar textarea {
  min-height: 78px;
  max-height: 180px;
}

#memoryCostBadge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  border-radius: 999px;
  padding: 0 10px;
  background: var(--card-bg);
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.memory-chat-tools {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

#memoryChatTitle {
  display: inline;
  cursor: text;
}

.memory-conversation-title-row {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.memory-conversation-title-row strong {
  min-width: 0;
  flex: 1;
}

.memory-conversation-edit {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  min-height: 22px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--card-bg);
  color: var(--accent-strong);
  font-size: 12px;
  line-height: 1;
}

.memory-conversation-edit:hover {
  border-color: var(--accent);
  background: var(--soft);
}

.memory-longterm-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 8px;
}

#memoryText {
  max-height: 180px;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
  overflow: auto;
  white-space: pre-wrap;
  color: var(--muted);
  font-size: 12px;
}

.memory-toggle-button {
  justify-self: start;
  min-height: 30px;
  margin-top: 8px;
  padding: 4px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--card-bg);
  color: var(--accent-strong);
  font-size: 12px;
  font-weight: 700;
}

.memory-help p {
  margin-top: 8px;
  font-size: 13px;
}

.memory-consolidation-details > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.memory-consolidation-details > summary em {
  padding: 3px 7px;
  border-radius: 999px;
  background: var(--soft);
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}

.memory-consolidation-details > summary em.has-pending {
  background: rgba(47, 143, 91, 0.12);
  color: #267451;
}

.memory-consolidation-details > p {
  margin: 10px 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
}

.memory-consolidation-dialog {
  width: min(920px, calc(100vw - 28px));
  max-height: calc(100dvh - 28px);
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
}

.memory-consolidation-dialog::backdrop {
  background: rgba(28, 28, 28, 0.46);
}

.memory-consolidation-dialog.fallback-open {
  position: fixed;
  inset: 14px;
  z-index: 35;
  display: block;
  margin: auto;
}

.memory-consolidation-shell {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  max-height: calc(100dvh - 28px);
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper);
  box-shadow: var(--shadow);
}

.memory-consolidation-list {
  display: grid;
  gap: 12px;
  margin-top: 14px;
  overflow: auto;
}

.memory-consolidation-card {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.memory-consolidation-card > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.memory-consolidation-card > header > div {
  display: grid;
  gap: 3px;
}

.memory-consolidation-card > header small,
.memory-consolidation-card > header > span,
.memory-consolidation-scope {
  color: var(--muted);
  font-size: 12px;
}

.memory-consolidation-card > header > span {
  flex: 0 0 auto;
}

.memory-consolidation-card pre {
  max-height: 320px;
  margin: 0;
  padding: 12px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--soft);
  color: var(--text);
  font: inherit;
  font-size: 13px;
  line-height: 1.65;
  white-space: pre-wrap;
}

.memory-consolidation-conflicts {
  padding: 10px 12px;
  border-left: 3px solid #c68a27;
  background: rgba(198, 138, 39, 0.08);
  color: var(--text);
  font-size: 12px;
}

.memory-consolidation-conflicts p,
.memory-consolidation-empty p {
  margin: 5px 0 0;
  color: var(--muted);
  line-height: 1.55;
}

.memory-consolidation-empty {
  padding: 28px 18px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  text-align: center;
}

.memory-skills-dialog {
  width: min(820px, calc(100vw - 28px));
  max-height: calc(100vh - 28px);
  border: 0;
  border-radius: 10px;
  padding: 0;
  background: transparent;
}

.memory-skills-dialog::backdrop {
  background: rgba(28, 28, 28, 0.42);
}

.memory-skills-dialog.fallback-open {
  position: fixed;
  inset: 14px;
  z-index: 30;
  display: block;
  margin: auto;
}

.memory-skills-content {
  display: grid;
  gap: 14px;
  max-height: calc(100vh - 28px);
  padding: 18px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--paper);
  box-shadow: var(--shadow);
}

.memory-fullscreen-dialog {
  width: 100vw;
  max-width: none;
  height: 100dvh;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: var(--card-bg);
}

.memory-fullscreen-dialog::backdrop {
  background: rgba(18, 20, 22, 0.55);
}

.memory-fullscreen-dialog.fallback-open {
  position: fixed;
  inset: 0;
  z-index: 40;
  display: block;
}

.memory-fullscreen-content {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  height: 100dvh;
  background: var(--card-bg);
}

.memory-fullscreen-toolbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 24px;
  border-bottom: 1px solid var(--line);
  background: var(--card-bg);
  box-shadow: 0 8px 22px rgba(21, 30, 36, 0.08);
}

.memory-fullscreen-toolbar h3 {
  margin: 0;
}

.memory-fullscreen-toolbar small {
  color: var(--muted);
}

.memory-fullscreen-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-shrink: 0;
}

.memory-fullscreen-scroll {
  min-height: 0;
  overflow: auto;
}

.memory-fullscreen-body {
  width: min(820px, calc(100vw - 72px));
  min-height: calc(100dvh - 142px);
  margin: 32px auto 54px;
  padding: 44px min(56px, 6vw);
  border: 1px solid #ded7cb;
  background: var(--card-bg);
  box-shadow: 0 18px 38px rgba(21, 30, 36, 0.12);
  color: var(--ink);
  font-size: 14px;
  line-height: 1.78;
}

.memory-fullscreen-empty {
  margin: 0;
  color: var(--muted);
}

.memory-fullscreen-message {
  display: grid;
  gap: 8px;
  padding: 15px 0;
  border-bottom: 1px solid #eee7dc;
}

.memory-fullscreen-message.user {
  margin: 12px -18px;
  padding: 14px 18px;
  border: 1px solid #b8d1da;
  border-radius: 8px;
  background: var(--soft);
}

.memory-fullscreen-message:first-child {
  padding-top: 0;
}

.memory-fullscreen-message.user:first-child {
  padding-top: 14px;
}

.memory-fullscreen-message:last-child {
  border-bottom: 0;
}

.memory-fullscreen-message header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  color: var(--muted);
  font-size: 12px;
}

.memory-fullscreen-message header strong {
  color: var(--accent);
  font-size: 13px;
}

.memory-fullscreen-message.user header strong {
  color: var(--accent);
}

.memory-fullscreen-text {
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.memory-fullscreen-images {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.memory-fullscreen-images a {
  display: block;
  width: 128px;
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  background: var(--card-bg);
}

.memory-fullscreen-images img {
  display: block;
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
}

.memory-prompt-browser-dialog {
  width: min(1180px, calc(100vw - 36px));
  height: min(820px, calc(100dvh - 36px));
  max-width: none;
  max-height: none;
  padding: 0;
  border: 0;
  border-radius: 10px;
  background: transparent;
}

.memory-prompt-browser-dialog::backdrop {
  background: rgba(18, 20, 22, 0.55);
}

.memory-prompt-browser-dialog.fallback-open {
  position: fixed;
  inset: 18px;
  z-index: 42;
  display: block;
  margin: auto;
}

.memory-prompt-browser-content {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  width: 100%;
  height: 100%;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--paper);
  box-shadow: 0 18px 42px rgba(21, 30, 36, 0.22);
}

.memory-prompt-browser-toolbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
  background: var(--card-bg);
}

.memory-prompt-browser-toolbar h3 {
  margin: 0;
}

.memory-prompt-browser-toolbar small {
  color: var(--muted);
}

.memory-prompt-browser-content iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: var(--card-bg);
}

.memory-skills-body {
  display: grid;
  gap: 16px;
}

.memory-skill-group {
  display: grid;
  gap: 10px;
}

.memory-skill-group h4 {
  margin: 0;
}

.memory-skill-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.memory-skill-card.is-disabled {
  border-color: #edd1d1;
  background: #fff8f8;
}

.memory-skill-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.memory-skill-card-head > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.memory-skill-toggle {
  flex: 0 0 auto;
  min-height: 30px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 850;
  white-space: nowrap;
}

.memory-skill-toggle.is-enabled {
  border-color: #9fd1b2;
  background: var(--soft);
  color: #1f7a43;
}

.memory-skill-toggle.is-disabled {
  border-color: #efb2b2;
  background: #fff0f0;
  color: #bd3434;
}

.memory-skill-toggle:disabled {
  cursor: wait;
  opacity: 0.72;
}

.memory-skill-card span,
.memory-skill-card small,
.memory-skill-card p {
  color: var(--muted);
}

.memory-skill-detail {
  display: grid;
  gap: 8px;
}

.memory-skill-detail summary {
  width: fit-content;
  max-width: 100%;
  padding: 6px 10px;
  border: 1px solid #b8d1da;
  border-radius: 8px;
  background: var(--soft);
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  user-select: none;
}

.memory-skill-detail summary::marker {
  content: "";
}

.memory-skill-detail summary::-webkit-details-marker {
  display: none;
}

.memory-skill-detail[open] summary {
  border-color: #d7c1d8;
  background: var(--soft);
  color: #8a3f78;
}

.memory-skill-card p {
  margin: 0;
  line-height: 1.55;
}

.memory-skill-card small {
  overflow-wrap: anywhere;
}

.memory-skill-mine .memory-skill-card {
  border-color: color-mix(in srgb, var(--accent, #b8794a) 45%, var(--card-border, #e3ddd2));
}

.memory-skill-card-acts {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.memory-skill-edit,
.memory-skill-delete {
  border: 1px solid var(--card-border, #e3ddd2);
  background: transparent;
  color: var(--muted-text, #7a7266);
  border-radius: 999px;
  padding: 4px 12px;
  font-size: 12px;
  cursor: pointer;
}

.memory-skill-edit:hover {
  border-color: var(--accent, #b8794a);
  color: var(--accent, #b8794a);
}

.memory-skill-delete:hover {
  border-color: #d9534f;
  color: #d9534f;
}

.memory-skill-content {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  margin: 6px 0;
  padding: 8px 10px;
  background: color-mix(in srgb, var(--card-bg, #fff) 60%, transparent);
  border-radius: 8px;
  font-family: inherit;
  font-size: 13px;
  line-height: 1.55;
}

.memory-skill-form {
  display: grid;
  gap: 10px;
  margin-top: 12px;
  padding: 14px;
  border: 1px dashed color-mix(in srgb, var(--accent, #b8794a) 55%, var(--card-border, #e3ddd2));
  border-radius: 12px;
  background: color-mix(in srgb, var(--accent, #b8794a) 6%, transparent);
}

.memory-skill-form-head {
  font-weight: 600;
  color: var(--strong-text, #3a352d);
}

.memory-skill-form label {
  display: grid;
  gap: 4px;
  font-size: 13px;
  color: var(--muted-text, #7a7266);
}

.memory-skill-form input,
.memory-skill-form textarea {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--card-border, #e3ddd2);
  border-radius: 8px;
  background: var(--card-bg, #fff);
  color: var(--strong-text, #3a352d);
  font-family: inherit;
  font-size: 13px;
}

.memory-skill-form-acts {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.memory-skill-form-hint {
  font-size: 12px;
  color: var(--muted-text, #7a7266);
}

/* ===== 技能选择：两列拖拽选择器（记忆智能体弹窗） ===== */
.memory-skills-head-acts {
  display: flex;
  align-items: center;
  gap: 8px;
}

.skill-select-board {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.skill-select-col {
  display: flex;
  flex-direction: column;
  min-height: 220px;
  border: 1px solid var(--card-border, #e3ddd2);
  border-radius: 12px;
  background: color-mix(in srgb, var(--card-bg, #fff) 55%, transparent);
  overflow: hidden;
}

.skill-select-col[data-col="selected"] {
  border-color: color-mix(in srgb, var(--accent, #b8794a) 45%, var(--card-border, #e3ddd2));
  background: color-mix(in srgb, var(--accent, #b8794a) 7%, transparent);
}

.skill-select-col-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 12px;
  font-size: 13px;
  border-bottom: 1px solid var(--card-border, #e3ddd2);
}

.skill-select-count {
  min-width: 22px;
  text-align: center;
  padding: 1px 8px;
  border-radius: 999px;
  font-size: 12px;
  background: color-mix(in srgb, var(--accent, #b8794a) 18%, transparent);
  color: var(--strong-text, #3a352d);
}

.skill-select-list {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px;
  overflow-y: auto;
  transition: background 0.12s;
}

.skill-select-list.drop-hover {
  background: color-mix(in srgb, var(--accent, #b8794a) 12%, transparent);
}

.skill-select-chip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 11px;
  border: 1px solid var(--card-border, #e3ddd2);
  border-radius: 9px;
  background: var(--card-bg, #fff);
  cursor: grab;
  user-select: none;
}

.skill-select-chip:hover {
  border-color: var(--accent, #b8794a);
}

.skill-select-chip.dragging {
  opacity: 0.5;
}

.skill-select-chip .chip-name {
  font-size: 13px;
  color: var(--strong-text, #3a352d);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.skill-select-chip .chip-tag {
  flex: none;
  font-size: 11px;
  padding: 1px 8px;
  border-radius: 999px;
  color: var(--muted-text, #7a7266);
  background: color-mix(in srgb, var(--muted-text, #7a7266) 12%, transparent);
}

.skill-select-chip .chip-tag.is-mine {
  color: var(--accent, #b8794a);
  background: color-mix(in srgb, var(--accent, #b8794a) 15%, transparent);
}

.skill-select-empty {
  margin: auto;
  font-size: 12px;
  color: var(--muted-text, #7a7266);
  text-align: center;
  padding: 10px;
}

.skill-select-hint {
  margin: 10px 2px 0;
  font-size: 12px;
  color: var(--muted-text, #7a7266);
}

/* ===== 个人中心 · 技能管理 ===== */
.skill-upload-box {
  margin: 6px 0 14px;
}

.skill-upload-drop {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 20px;
  border: 1.5px dashed color-mix(in srgb, var(--accent, #b8794a) 55%, var(--card-border, #e3ddd2));
  border-radius: 12px;
  background: color-mix(in srgb, var(--accent, #b8794a) 6%, transparent);
  cursor: pointer;
  text-align: center;
}

.skill-upload-drop:hover {
  background: color-mix(in srgb, var(--accent, #b8794a) 11%, transparent);
}

.skill-upload-drop strong {
  color: var(--strong-text, #3a352d);
}

.skill-upload-drop span {
  font-size: 12px;
  color: var(--muted-text, #7a7266);
}

.my-skills-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.my-skill-card {
  border: 1px solid var(--card-border, #e3ddd2);
  border-radius: 12px;
  padding: 14px;
  background: color-mix(in srgb, var(--card-bg, #fff) 55%, transparent);
}

.my-skill-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.my-skill-head strong {
  color: var(--strong-text, #3a352d);
}

.my-skill-meta {
  display: block;
  margin-top: 2px;
  font-size: 12px;
  color: var(--muted-text, #7a7266);
}

.my-skill-ops {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.my-skill-ops button {
  border: 1px solid var(--card-border, #e3ddd2);
  background: transparent;
  color: var(--muted-text, #7a7266);
  border-radius: 999px;
  padding: 4px 12px;
  font-size: 12px;
  cursor: pointer;
}

.my-skill-ops button:hover {
  border-color: var(--accent, #b8794a);
  color: var(--accent, #b8794a);
}

.my-skill-ops button.danger:hover {
  border-color: #d9534f;
  color: #d9534f;
}

.my-skill-detail {
  margin-top: 8px;
  font-size: 13px;
}

.my-skill-detail summary {
  cursor: pointer;
  color: var(--muted-text, #7a7266);
}

.my-skill-content {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  margin: 8px 0 0;
  padding: 10px;
  background: color-mix(in srgb, var(--card-bg, #fff) 65%, transparent);
  border-radius: 8px;
  font-family: inherit;
  font-size: 13px;
  line-height: 1.55;
}

.my-skill-edit {
  display: grid;
  gap: 8px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px dashed var(--card-border, #e3ddd2);
}

.my-skill-edit label {
  display: grid;
  gap: 4px;
  font-size: 13px;
  color: var(--muted-text, #7a7266);
}

.my-skill-edit input,
.my-skill-edit textarea {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--card-border, #e3ddd2);
  border-radius: 8px;
  background: var(--card-bg, #fff);
  color: var(--strong-text, #3a352d);
  font-family: inherit;
  font-size: 13px;
}

.my-skill-edit-acts {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.my-skill-edit-acts .form-hint {
  margin-right: auto;
}

@media (max-width: 640px) {
  .skill-select-board {
    grid-template-columns: 1fr;
  }
}

.memory-presets {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}

.memory-presets button {
  min-height: 34px;
  padding: 0 8px;
  font-size: 13px;
}

.workflow-layout {
  display: grid;
  grid-template-columns: minmax(260px, 320px) minmax(0, 1fr) minmax(300px, 380px);
  gap: 16px;
  align-items: start;
}

.workflow-list-panel,
.workflow-run-panel,
.workflow-editor-panel,
.workflow-result-box,
.workflow-run-form {
  position: relative;
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--card-bg);
  box-shadow: var(--shadow-sm);
}

.workflow-source-article-field textarea {
  min-height: 320px;
  line-height: 1.8;
  font-size: 15px;
  letter-spacing: 0.02em;
}

.workflow-source-article-field .field-hint {
  display: block;
  margin-top: 7px;
}

.workflow-list {
  display: grid;
  gap: 10px;
}

.workflow-list-item {
  display: grid;
  gap: 5px;
  width: 100%;
  min-height: 92px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
  text-align: left;
  transition:
    transform 160ms ease,
    border-color 160ms ease,
    background 160ms ease,
    box-shadow 160ms ease;
}

.workflow-list-item:hover {
  transform: translateY(-2px);
  border-color: rgba(29, 111, 143, 0.35);
  box-shadow: 0 14px 26px rgba(37, 42, 47, 0.08);
}

.workflow-list-item.active {
  border-color: var(--accent);
  background: var(--soft);
}

.workflow-list-item.disabled {
  opacity: 0.62;
}

.workflow-list-item strong,
.workflow-list-item span,
.workflow-list-item small {
  overflow: hidden;
  text-overflow: ellipsis;
}

.workflow-result {
  display: grid;
  gap: 12px;
  min-height: 160px;
  color: var(--muted);
}

.workflow-result-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.workflow-result-summary strong,
.workflow-result-summary span {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid rgba(29, 111, 143, 0.18);
  border-radius: 999px;
  background: var(--card-bg);
  color: var(--accent-strong);
  font-size: 12px;
  font-weight: 800;
}

.workflow-article-theme-field {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #faf9f6;
}

.workflow-article-theme-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 14px;
}

.workflow-article-theme-heading > div {
  display: grid;
  gap: 3px;
}

.workflow-article-theme-heading small {
  color: var(--muted);
  font-size: 12px;
}

.workflow-article-theme-heading label {
  display: grid;
  min-width: 220px;
  gap: 5px;
  color: var(--muted);
  font-size: 12px;
}

.workflow-article-theme-preview {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.workflow-article-theme-card {
  display: grid;
  min-width: 0;
  gap: 5px;
  padding: 10px;
  border: 1px solid var(--article-theme-primary);
  border-radius: 8px;
  background: var(--article-theme-primary);
  color: var(--article-theme-light);
  text-align: left;
  cursor: pointer;
}

.workflow-article-theme-card:hover,
.workflow-article-theme-card.active {
  border-color: var(--article-theme-primary);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--article-theme-primary) 14%, transparent);
}

.workflow-article-theme-card strong,
.workflow-article-theme-card small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workflow-article-theme-card strong { font-size: 13px; }
.workflow-article-theme-card small { color: color-mix(in srgb, var(--article-theme-light) 76%, transparent); font-size: 11px; }

.workflow-article-theme-swatch {
  display: grid;
  grid-template-columns: 1.3fr .7fr .7fr;
  height: 28px;
  overflow: hidden;
  border-radius: 4px;
}

.workflow-article-theme-swatch i { background: var(--article-theme-primary); }
.workflow-article-theme-swatch b { background: var(--article-theme-accent); }
.workflow-article-theme-swatch em { background: var(--article-theme-bg); }

@media (max-width: 760px) {
  .workflow-article-theme-heading { align-items: stretch; flex-direction: column; }
  .workflow-article-theme-heading label { min-width: 0; }
  .workflow-article-theme-preview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.workflow-brand-mode-panel {
  display: grid;
  gap: 8px;
  margin: 12px 0 0;
  padding: 12px 14px;
  border: 1px solid rgba(201, 168, 107, 0.45);
  border-radius: 10px;
  background: linear-gradient(180deg, #fffdf8 0%, #fff 100%);
}

.workflow-preview-steps > li .workflow-brand-mode-panel {
  margin-top: 14px;
}

.workflow-brand-editor {
  margin-top: 14px;
  border: 1px solid var(--line, #e3ddd2);
  border-radius: 10px;
  background: #fffdfa;
  overflow: hidden;
}
.workflow-brand-editor > summary {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 12px 14px;
  cursor: pointer;
  color: var(--ink, #292622);
  font-weight: 700;
}
.workflow-brand-editor > summary span {
  color: var(--muted, #80786e);
  font-size: 12px;
  font-weight: 400;
}
.workflow-brand-editor-body {
  padding: 2px 14px 14px;
  border-top: 1px solid var(--line, #e3ddd2);
}
.workflow-brand-editor-top,
.workflow-brand-editor-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 0;
}
.workflow-brand-editor-top p { margin: 4px 0 0; }
.workflow-brand-editor-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 12px;
}
.workflow-brand-editor-grid label {
  display: grid;
  gap: 5px;
  color: var(--muted, #756d63);
  font-size: 12px;
}
.workflow-brand-editor-grid input {
  min-width: 0;
  height: 34px;
  padding: 0 10px;
  border: 1px solid var(--line, #ded6ca);
  border-radius: 7px;
  background: #fff;
  color: var(--ink, #292622);
}
.workflow-brand-editor-actions { align-items: flex-start; }
.workflow-brand-editor-actions .form-hint { flex: 1; margin: 0; }
@media (max-width: 680px) {
  .workflow-brand-editor-grid { grid-template-columns: 1fr; }
  .workflow-brand-editor-top,
  .workflow-brand-editor-actions { align-items: flex-start; flex-direction: column; }
}

.workflow-brand-mode-panel strong {
  color: var(--accent-strong);
  font-size: 14px;
}

.workflow-brand-mode-options {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
}

.workflow-brand-mode-options label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--text);
  cursor: pointer;
}

.workflow-preview-steps {
  display: grid;
  gap: 10px;
  margin: 0;
  padding-left: 22px;
}

.workflow-preview-steps li {
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.workflow-preview-steps p {
  margin-top: 4px;
  font-size: 12px;
}

.workflow-run-steps li.is-failed {
  border-color: rgba(182, 75, 59, 0.4);
  background: var(--soft);
}

.workflow-run-steps details {
  margin-top: 8px;
}

.workflow-run-steps summary {
  cursor: pointer;
  color: var(--accent-strong);
  font-size: 12px;
  font-weight: 800;
}

.workflow-step-output {
  margin-top: 8px;
  padding: 10px;
  border: 1px solid rgba(29, 111, 143, 0.14);
  border-radius: 8px;
  background: var(--card-bg);
  color: var(--ink);
  font-size: 13px;
  line-height: 1.7;
  white-space: pre-wrap;
  word-break: break-word;
}

.workflow-gallery-intent-line {
  display: inline-block;
  margin: 2px 0;
  padding: 3px 7px;
  border-left: 3px solid var(--accent);
  border-radius: 6px;
  background: rgba(29, 111, 143, 0.1);
  color: var(--accent);
  font-weight: 800;
}

.workflow-step-status {
  margin-left: 6px;
  color: var(--muted);
  font-size: 11px;
}

.workflow-image-results {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 10px;
  margin: 12px 0;
}

.workflow-image-results.small {
  grid-template-columns: repeat(auto-fill, minmax(96px, 140px));
}

.workflow-image-card {
  position: relative;
  display: grid;
  gap: 6px;
  margin: 0;
}

.workflow-image-results a {
  display: block;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.workflow-image-results img {
  display: block;
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
}

.workflow-image-card figcaption {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.workflow-image-remove {
  position: absolute;
  top: 6px;
  right: 6px;
  display: grid;
  width: 26px;
  height: 26px;
  min-height: 0;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(0, 0, 0, 0.18);
  border-radius: 999px;
  background: var(--card-bg);
  color: #a33a2b;
  font-size: 18px;
  line-height: 1;
  box-shadow: 0 2px 8px rgba(28, 38, 43, 0.14);
}

.workflow-image-download {
  justify-self: stretch;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 6px 10px;
  min-height: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
  color: var(--text, #1c262b);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
}

.workflow-image-download:hover {
  border-color: var(--accent, #2b7a78);
  color: var(--accent, #2b7a78);
}

.workflow-step-actions-inline {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}

.workflow-step-actions-inline button {
  min-height: 30px;
  padding: 0 10px;
  font-size: 12px;
}

.workflow-article-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 10px 0;
}

.workflow-article-toolbar button {
  min-height: 32px;
  padding: 0 14px;
  font-size: 13px;
}

.workflow-article-toolbar button.primary {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.workflow-article-toolbar button.flash {
  background: #16a34a;
  border-color: #16a34a;
  color: #fff;
}

.workflow-article-tip {
  flex: 1 1 100%;
  margin: 4px 0 0;
}

.workflow-article-quality {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
}

.workflow-article-quality.is-passed { background: #e7f3eb; color: #28623d; }
.workflow-article-quality.is-warning { background: #fff1e8; color: #9c4e24; }

.workflow-article-preview {
  margin-top: 10px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--card-bg);
  max-height: min(1100px, 82vh);
  overflow: auto;
}

.article-img-wrap {
  position: relative;
  display: block;
}

.article-img-actions {
  position: absolute;
  top: 10px;
  right: 10px;
  display: flex;
  gap: 6px;
}

.article-img-actions button {
  min-height: 0;
  padding: 5px 11px;
  font-size: 12px;
  line-height: 1.2;
  background: rgba(20, 22, 30, 0.72);
  color: #fff;
  border: none;
  border-radius: var(--radius);
  cursor: pointer;
}

.article-img-actions button:hover {
  background: rgba(20, 22, 30, 0.92);
}

/* 配图位置调整的 ↑ ↓：和换图按钮同一条工具条，但只放一个箭头，收窄一点 */
.article-img-actions button[data-art-img^="up:"],
.article-img-actions button[data-art-img^="down:"] {
  padding: 5px 9px;
  font-size: 14px;
  line-height: 1;
}

.workflow-skill-feedback {
  margin-top: 12px;
  padding: 10px 12px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.workflow-skill-feedback-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 8px 0;
}

.workflow-skill-feedback-actions button.active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.workflow-skill-feedback-form {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.workflow-skill-feedback-form input {
  flex: 1 1 220px;
  min-width: 180px;
}

.workflow-skill-feedback-status {
  font-size: 12px;
  color: var(--muted);
}

.danger-text {
  color: #a33a2b;
}

.workflow-editor-section {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.workflow-editor-section h4 {
  margin: 0;
}

.workflow-step-editor {
  display: grid;
  gap: 10px;
}

.workflow-step-config {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.workflow-step-head {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}

.workflow-step-head > span {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  background: var(--accent-strong);
  color: #fff;
  font-size: 13px;
  font-weight: 850;
}

.workflow-step-head small {
  display: block;
  margin-top: 3px;
}

.workflow-empty {
  padding: 14px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  color: var(--muted);
}

.workflow-subnav button {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
  color: var(--ink);
  font-size: 14px;
  font-weight: 800;
}

.workflow-subnav button.active {
  border-color: var(--accent);
  background: linear-gradient(135deg, var(--accent), var(--accent-strong));
  color: #fff;
  box-shadow: 0 10px 22px rgba(29, 111, 143, 0.18);
}

.workflow-tab-page {
  display: grid;
  gap: 16px;
}

.workflow-run-layout {
  grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
}

.workflow-skill-layout {
  grid-template-columns: minmax(0, 1fr) minmax(300px, 420px);
}

.workflow-step-head {
  grid-template-columns: 34px minmax(0, 1fr) auto auto;
}

.workflow-step-head input {
  min-height: 36px;
  padding: 8px 10px;
  font-weight: 800;
}

.workflow-step-actions {
  display: flex;
  gap: 6px;
  align-items: center;
}

.workflow-step-actions button {
  min-height: 32px;
  padding: 0 9px;
  font-size: 12px;
}

.workflow-skill-list {
  display: grid;
  gap: 10px;
}

.workflow-skill-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card-bg);
}

.workflow-skill-item small,
.workflow-skill-item p {
  display: block;
  margin-top: 4px;
  font-size: 12px;
}

.workflow-skill-item-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.workflow-skill-item-actions button {
  min-height: 28px;
  padding: 0 10px;
  font-size: 12px;
}

/* Unified Bento visual system for application pages. */
.login-page,
.profile-page,
.project-page,
.image-page,
.workflow-page,
.memory-page,
.admin-dashboard {
  background:
    linear-gradient(135deg, rgba(29, 111, 143, 0.09) 0 18%, transparent 18% 100%),
    linear-gradient(165deg, transparent 0 63%, rgba(255, 255, 255, 0.14) 63% 78%, transparent 78% 100%),
    repeating-linear-gradient(90deg, rgba(35, 49, 61, 0.024) 0 1px, transparent 1px 28px),
    var(--bg);
}

.profile-shell,
.memory-shell,
.image-page .workspace {
  background: transparent;
}

.topbar,
.memory-topbar,
.profile-topbar,
.admin-header {
  position: relative;
  padding: 16px;
  overflow: hidden;
  border: 1px solid rgba(221, 214, 204, 0.86);
  border-radius: 8px;
  background:
    linear-gradient(115deg, rgba(255, 253, 249, 0.98), rgba(255, 253, 249, 0.86) 58%, rgba(232, 243, 246, 0.92)),
    var(--paper);
  box-shadow: 0 14px 32px rgba(37, 42, 47, 0.08);
}

.topbar::before,
.memory-topbar::before,
.profile-topbar::before,
.admin-header::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--accent), var(--accent), var(--accent), var(--accent));
  content: "";
}

.admin-header h1 {
  color: var(--ink);
}

.topbar .topbar-title {
  color: var(--ink);
  font-size: 19px;
  font-weight: 700;
  line-height: 1.2;
}

.skip-link {
  position: absolute;
  left: 12px;
  top: -64px;
  z-index: 2000;
  padding: 10px 16px;
  border-radius: var(--radius);
  background: var(--accent);
  color: var(--accent-contrast);
  font-weight: 700;
  text-decoration: none;
  box-shadow: var(--shadow-md);
  transition: top 160ms var(--ease-out);
}

.skip-link:focus,
.skip-link:focus-visible {
  top: 12px;
}

.nav-button,
.project-subnav a,
.admin-tab,
.module-link {
  transition:
    transform 160ms ease,
    border-color 160ms ease,
    background 160ms ease,
    box-shadow 160ms ease,
    color 160ms ease;
}

.nav-button:hover,
.project-subnav a:hover,
.admin-tab:hover,
.module-link:hover {
  transform: translateY(-1px);
  border-color: rgba(29, 111, 143, 0.42);
  background: var(--soft);
  color: var(--accent-strong);
  box-shadow: 0 10px 20px rgba(29, 111, 143, 0.1);
}

.project-subnav {
  padding: 10px;
  border: 1px solid rgba(221, 214, 204, 0.8);
  border-radius: 8px;
  background: var(--card-bg);
  box-shadow: 0 10px 24px rgba(37, 42, 47, 0.05);
}

.project-subnav a.active,
.admin-tab.active {
  border-color: var(--accent);
  background: linear-gradient(135deg, var(--accent), var(--accent-strong));
  color: #fff;
  box-shadow: 0 10px 22px rgba(29, 111, 143, 0.18);
}

.profile-card,
.project-list-panel,
.project-editor-panel,
.project-context-box,
.workflow-list-panel,
.workflow-run-panel,
.workflow-editor-panel,
.workflow-result-box,
.workflow-run-form,
.project-import-box,
.project-summary-editor,
.project-images-box,
.project-updates-box,
.memory-side,
.memory-main,
.memory-panel,
.controls,
.result-area,
.agent-chat,
.account-panel,
.admin-card {
  position: relative;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--card-bg);
  box-shadow: var(--shadow-sm);
}

/* 卡片顶部彩条与 --section-accent 已整体移除：统一为干净表面 + 细边(var(--line)) + 柔和阴影，
   向首页与 AI 官网的克制风格看齐，并彻底清掉会污染其它主题的装饰色。 */

.project-list-item,
.project-image-card,
.project-update-item,
.history-item,
.memory-conversation,
.memory-skill-card,
.admin-item,
.admin-stat {
  border-color: var(--line);
  background: var(--card-bg);
  box-shadow: var(--shadow-sm);
  transition:
    transform 160ms var(--ease-out),
    border-color 160ms var(--ease-out),
    background 160ms var(--ease-out),
    box-shadow 160ms var(--ease-out);
}

.project-list-item:hover,
.project-image-card:hover,
.project-update-item:hover,
.history-item:hover,
.memory-conversation:hover,
.memory-skill-card:hover,
.admin-item:hover,
.admin-stat:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--accent) 42%, transparent);
  box-shadow: var(--shadow-md);
}

.project-list-item.active,
.memory-conversation.active {
  border-color: var(--accent);
  background: var(--soft);
}

.primary,
button.primary {
  border-color: var(--accent);
  background: linear-gradient(135deg, var(--accent), var(--accent-strong));
  color: #fff;
  box-shadow: 0 10px 22px color-mix(in srgb, var(--accent) 22%, transparent);
}

.primary:hover,
button.primary:hover {
  transform: translateY(-1px);
  border-color: var(--accent-strong);
  background: linear-gradient(135deg, var(--accent-strong), var(--accent-strong));
  color: #fff;
  box-shadow: 0 14px 26px color-mix(in srgb, var(--accent) 26%, transparent);
}

button:not(.primary):not(.danger):hover,
.file-action:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--accent) 40%, transparent);
  background: var(--soft);
  box-shadow: 0 8px 18px color-mix(in srgb, var(--accent) 12%, transparent);
}

input:focus,
select:focus,
textarea:focus {
  background: var(--card-bg);
}

.login-page {
  position: relative;
  /* 只禁横向滚动。原来是 overflow:hidden，把整页纵向滚动也锁死了：
     手机上「注册 / 找回密码」字段多、内容超出一屏，底部按钮就点不到。 */
  overflow-x: hidden;
}

.login-page::before {
  position: fixed;
  inset: 0;
  background:
    linear-gradient(120deg, rgba(35, 49, 61, 0.08) 0 26%, transparent 26%),
    linear-gradient(145deg, transparent 0 58%, rgba(29, 111, 143, 0.18) 58% 72%, transparent 72%);
  content: "";
  pointer-events: none;
}

.login-shell {
  position: relative;
  z-index: 1;
  width: min(940px, calc(100vw - 32px));
}

.login-card {
  display: grid;
  grid-template-columns: minmax(280px, 0.9fr) minmax(300px, 1fr);
  gap: 18px 22px;
  align-items: end;
  padding: 0;
  overflow: hidden;
  border-color: rgba(221, 214, 204, 0.88);
  background: var(--card-bg);
  box-shadow: 0 22px 50px rgba(37, 42, 47, 0.14);
}

.login-card .brand {
  grid-row: 1 / -1;
  align-self: stretch;
  display: grid;
  align-content: center;
  gap: 16px;
  margin: 0;
  padding: 34px;
  background:
    linear-gradient(145deg, rgba(35, 49, 61, 0.96), rgba(29, 111, 143, 0.9));
  color: #fff;
}

.login-card .brand h1,
.login-card .brand p {
  color: #fff;
}

.login-card .brand p {
  color: rgba(255, 255, 255, 0.76);
}

.login-card .brand-mark {
  background: linear-gradient(135deg, var(--accent), var(--accent));
  box-shadow: 0 14px 28px rgba(16, 23, 30, 0.28);
}

.login-card > label,
.login-card .login-captcha-field,
.login-card .login-actions,
.login-card #loginStatus,
.login-card .login-links {
  grid-column: 2;
  margin-right: 24px;
}

.login-captcha-row {
  display: grid;
  grid-template-columns: minmax(88px, auto) 1fr auto;
  gap: 8px;
  align-items: center;
  margin-top: 8px;
}

.login-captcha-question {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 10px;
  border-radius: 8px;
  border: 1px dashed var(--line);
  background: var(--card-bg);
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 0.02em;
  color: var(--accent-strong);
  white-space: nowrap;
}

.login-captcha-row input {
  min-width: 0;
}

.login-captcha-row .ghost {
  min-height: 42px;
  padding: 0 12px;
  white-space: nowrap;
}

.login-card > label:first-of-type {
  margin-top: 28px;
}

.login-card .login-links {
  margin-bottom: 24px;
}

.login-captcha-question.needs-answer {
  border-color: rgba(194, 73, 61, 0.72);
  background: rgba(194, 73, 61, 0.1);
  color: #c2493d;
}

.login-captcha-row input.needs-answer {
  border-color: rgba(194, 73, 61, 0.72);
  box-shadow: 0 0 0 3px rgba(194, 73, 61, 0.12);
}

.login-card .login-mode-tabs {
  grid-column: 2;
  margin: 28px 24px 0 0;
}

.login-card .login-mode-tabs button {
  min-width: 0;
}

.login-field-hint {
  display: block;
  margin-top: 6px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.login-email-code-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  align-items: center;
  margin-top: 8px;
}

.login-email-code-row input {
  min-width: 0;
}

.login-email-code-row .ghost {
  min-height: 42px;
  min-width: 112px;
  padding: 0 12px;
  white-space: nowrap;
}

.login-actions {
  margin-top: 16px;
}

.login-links a {
  color: var(--accent-strong);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.memory-project-picker,
.memory-meta,
.project-permission-note {
  border-color: rgba(29, 111, 143, 0.18);
  background:
    linear-gradient(90deg, rgba(232, 243, 246, 0.9), rgba(255, 253, 249, 0.92));
}

.profile-bar-track,
.profile-day i {
  box-shadow: inset 0 0 0 1px rgba(35, 49, 61, 0.04);
}

.admin-shell {
  max-width: 1280px !important;
  padding: 24px !important;
}

.admin-header {
  margin-bottom: 16px !important;
}

.admin-card {
  border-radius: 8px !important;
  background: var(--card-bg) !important;
}

.admin-tabs {
  padding: 10px !important;
  border: 1px solid rgba(221, 214, 204, 0.8);
  border-radius: 8px;
  background: var(--card-bg);
}

.admin-stat {
  border-radius: 8px !important;
  background: var(--card-bg) !important;
}

@media (max-width: 1080px) {
  .app-shell,
  .creator {
    grid-template-columns: 1fr;
  }

  .hub-hero,
  .module-grid,
  .workflow-strip,
  .project-layout,
  .workflow-layout {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .memory-layout {
    grid-template-columns: 1fr;
  }

  #memoryText {
    max-height: none;
  }

  .memory-side {
    max-height: min(560px, calc(100dvh - 96px));
  }

  .memory-conversation-list {
    max-height: none;
  }

  .sidebar {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .home-bento .hub-hero,
  .home-focus-grid {
    grid-template-columns: 1fr;
  }

  .home-bento .module-card.featured {
    grid-column: span 1;
  }

  .hub-status {
    border-top: 1px solid var(--line);
    border-left: 0;
  }
}

@media (max-width: 680px) {
  .workspace,
  .sidebar {
    padding: 14px;
  }

  .controls,
  .result-area,
  .panel,
  .file-drop {
    min-width: 0;
  }

  .file-drop {
    padding: 12px;
  }

  .workspace {
    padding-bottom: calc(92px + env(safe-area-inset-bottom, 0px));
  }

  .business-hub {
    gap: 14px;
    margin-bottom: 18px;
  }

  .hub-hero,
  .module-grid,
  .workflow-strip,
  .project-layout,
  .workflow-layout,
  .workflow-run-layout,
  .workflow-skill-layout,
  .project-form-grid {
    grid-template-columns: 1fr;
  }

  .hub-hero {
    padding: 18px;
  }

  .home-bento .hub-hero {
    min-height: 0;
    padding: 0;
  }

  .hub-hero-main,
  .hub-status {
    padding: 18px;
  }

  .home-bento .hub-hero h1 {
    font-size: 30px;
    line-height: 1.12;
  }

  .hub-actions,
  .hub-actions .module-link {
    width: 100%;
  }

  .home-focus-card {
    min-height: 0;
    padding: 14px;
  }

  .workflow-step-head {
    grid-template-columns: 34px minmax(0, 1fr);
  }

  .workflow-step-actions {
    grid-column: 1 / -1;
  }

  .workflow-step-head > .danger {
    grid-column: 1 / -1;
    width: 100%;
  }

  .login-card {
    grid-template-columns: 1fr;
  }

  .login-card .brand {
    grid-row: auto;
    padding: 24px;
  }

  .login-card > label,
  .login-card .login-captcha-field,
  .login-card .login-mode-tabs,
  .login-card .login-actions,
  .login-card #loginStatus,
  .login-card .login-links {
    grid-column: auto;
    margin-right: 18px;
    margin-left: 18px;
  }

  .login-card .login-mode-tabs {
    margin-top: 18px;
  }

  .login-card > label:first-of-type {
    margin-top: 0;
  }

  .login-card .login-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .admin-shell {
    padding: 14px !important;
  }

  .module-card {
    min-height: 0;
    padding: 14px;
  }

  .memory-shell {
    min-height: 100dvh;
    padding: 14px;
    overflow: auto;
  }

  .memory-layout {
    display: grid;
    height: auto;
    gap: 14px;
    min-height: auto;
  }

  .memory-topbar {
    margin-bottom: 14px;
  }

  .memory-side,
  .memory-main,
  .memory-panel {
    padding: 14px;
  }

  .memory-main {
    order: 1;
  }

  .memory-chat-search {
    width: 100%;
    min-width: 0;
  }

  .memory-chat-search input {
    width: 100%;
    flex: 1;
  }

  .memory-side {
    order: 2;
  }

  .memory-panel {
    order: 3;
  }

  .memory-main {
    min-height: calc(100dvh - 122px);
  }

  .memory-project-picker {
    grid-template-columns: 1fr;
  }

  .memory-project-controls {
    grid-template-columns: minmax(0, 1fr) minmax(112px, 138px);
  }

  .memory-messages {
    min-height: calc(100dvh - 340px);
    padding: 12px;
  }

  .memory-message {
    max-width: 96%;
  }

  .memory-input-bar {
    position: sticky;
    bottom: 0;
    z-index: 10;
    grid-template-columns: minmax(0, 1fr) 52px;
    margin: 0 -14px -14px;
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid var(--line);
    background: var(--card-bg);
    backdrop-filter: blur(10px);
  }

  .memory-input-bar textarea {
    min-height: 54px;
    max-height: 120px;
  }

  .memory-attachment-actions {
    display: grid;
    align-items: stretch;
  }

  .memory-attachment-actions div {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .memory-input-bar .memory-send-button {
    width: 48px;
    height: 48px;
    min-height: 48px;
  }

  .nav-button {
    width: 100%;
  }

  .memory-action-row {
    display: grid;
    grid-template-columns: 1.4fr 0.8fr;
    overflow-x: visible;
  }

  .memory-action-row button {
    width: 100%;
    min-height: 40px;
    padding: 0 8px;
    font-size: 13px;
  }

  .memory-conversation-list {
    max-height: 260px;
  }

  .memory-conversation {
    min-height: 62px;
  }

  .memory-presets {
    grid-template-columns: 1fr;
  }

  .memory-heading-actions {
    width: 100%;
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .memory-skills-dialog {
    width: 100vw;
    max-width: 100vw;
    height: 100dvh;
    max-height: 100dvh;
    border-radius: 0;
  }

  .memory-skills-content {
    min-height: 100dvh;
    max-height: 100dvh;
    border-radius: 0;
  }

  .memory-skill-card > div:not(.memory-skill-card-head) {
    display: grid;
  }

  .memory-skill-card .memory-skill-card-head {
    display: flex;
  }

  .creator {
    gap: 14px;
  }

  .controls,
  .result-area {
    padding: 14px;
    box-shadow: none;
  }

  .topbar,
  .topbar-actions,
  .topbar-account {
    align-items: stretch;
    flex-direction: column;
    gap: 10px;
  }

  .topbar-account small {
    text-align: right;
  }

  .topbar {
    margin-bottom: 14px;
  }

  .topbar .topbar-title {
    font-size: 18px;
  }

  .topbar p {
    font-size: 12px;
    line-height: 1.35;
  }

  .account-panel {
    position: sticky;
    top: 0;
    z-index: 8;
    margin: -14px -14px 14px;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
    background: rgba(248, 251, 251, 0.96);
    backdrop-filter: blur(10px);
  }

  .account-panel .panel-heading {
    align-items: flex-start;
  }

  .account-models {
    grid-template-columns: 1fr;
  }

  .account-models label {
    margin-top: 0;
  }

  #logoutBtn {
    width: 100%;
  }

  .segmented {
    margin: 0 -2px 12px;
  }

  .segmented button {
    min-height: 42px;
    padding: 6px 4px;
    line-height: 1.2;
    white-space: normal;
  }

  #prompt {
    min-height: 150px;
  }

  .prompt-toolbar {
    display: grid;
    grid-template-columns: 1fr;
  }

  .prompt-tool-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .prompt-toolbar button,
  .prompt-samples button,
  .prompt-sites a,
  .prompt-sites button {
    width: 100%;
  }

  .prompt-library-dialog {
    width: 100vw;
    max-height: 100dvh;
    border-radius: 0;
  }

  .prompt-editor-grid {
    grid-template-columns: 1fr;
  }

  .prompt-samples {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .prompt-samples button {
    min-height: 40px;
    height: auto;
    padding: 8px;
    white-space: normal;
  }

  .prompt-sites {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .prompt-sites span {
    grid-column: 1 / -1;
  }

  .two-col,
  .param-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .file-action,
  .upload-actions button {
    width: 100%;
  }

  .file-drop input[type="file"]::file-selector-button {
    min-height: 38px;
    margin-right: 10px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--card-bg);
    color: var(--ink);
  }

  .upload-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .upload-actions small {
    grid-column: 1 / -1;
  }

  .uploaded-image-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .generate-actions {
    position: sticky;
    right: -14px;
    bottom: 0;
    left: -14px;
    z-index: 12;
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin: 16px -14px -14px;
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid var(--line);
    background: var(--card-bg);
    backdrop-filter: blur(10px);
  }

  .generate-actions button {
    width: 100%;
    min-height: 46px;
  }

  .preview-box {
    min-height: 260px;
    max-height: none;
    padding: 12px;
  }

  .preview-box img {
    max-height: 440px;
  }

  .result-toolbar,
  .assist-actions,
  .agent-chat .button-row,
  .image-result-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .assist-actions button,
  .agent-chat .button-row button,
  .image-result-actions button {
    width: 100%;
  }

  .agent-chat {
    padding: 12px;
  }

  .agent-chat-list {
    max-height: 220px;
  }

  .history-list {
    max-height: none;
  }

  .history-item {
    grid-template-columns: 64px 1fr;
  }

  .history-item img {
    width: 64px;
    height: 64px;
  }

  .settings-dialog,
  .image-viewer,
  .mask-dialog {
    width: 100vw;
    max-width: 100vw;
    height: 100dvh;
    max-height: 100dvh;
    border-radius: 0;
  }

  .settings-content {
    min-height: 100dvh;
    max-height: 100dvh;
    overflow: auto;
    border-radius: 0;
    padding: 16px;
  }

  .image-viewer-content,
  .mask-editor {
    border-radius: 0;
  }

  .image-viewer-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .image-viewer-toolbar .topbar-actions {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
  }

  .image-viewer-stage {
    padding: 8px;
  }

  .mask-editor-stage {
    padding: 8px;
  }

  .log-panel pre {
    max-height: 220px;
  }

  .profile-shell {
    padding: 12px;
  }

  .profile-grid,
  .profile-main-grid,
  .profile-security-grid,
  .profile-prompt-layout {
    grid-template-columns: 1fr;
  }

  .profile-daily-bars {
    grid-template-columns: repeat(7, minmax(26px, 1fr));
    row-gap: 14px;
  }

  .profile-bar-head,
  .profile-list-item {
    align-items: flex-start;
    flex-direction: column;
  }

  .profile-attachment-main {
    width: 100%;
  }

  .profile-attachment-actions {
    width: 100%;
    align-items: stretch;
  }

  .profile-attachment-expiry {
    max-width: none;
    text-align: left;
  }

  .profile-attachment-actions button {
    width: 100%;
  }

  .memory-heading-actions {
    max-width: 100%;
    min-width: 0;
  }

  .memory-panel > .panel-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .memory-heading-actions button {
    flex: 1 1 120px;
    min-width: 0;
  }

  body.memory-page {
    height: 100dvh;
    overflow: hidden;
  }

  .memory-page .memory-shell {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    height: 100dvh;
    min-height: 0;
    padding: 0;
    overflow: hidden;
  }

  .memory-page .memory-topbar {
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: space-between;
    gap: 8px;
    margin: 0;
    padding: 10px 12px;
    border-bottom: 1px solid var(--line);
    background: var(--card-bg);
  }

  .memory-page .memory-topbar .topbar-title {
    font-size: 16px;
  }

  .memory-page .memory-topbar p {
    display: none;
  }

  .memory-page .memory-topbar .topbar-account {
    display: flex;
    align-items: center;
    flex: 1 1 auto;
    min-width: 0;
  }

  .memory-page .memory-topbar .topbar-account small {
    display: none;
  }

  .memory-page .memory-topbar .topbar-actions {
    display: flex;
    align-items: center;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 6px;
    width: 100%;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .memory-page .memory-topbar .topbar-actions::-webkit-scrollbar {
    display: none;
  }

  .memory-page .memory-topbar .nav-button,
  .memory-page .memory-topbar button {
    flex: 0 0 auto;
    width: auto;
    min-height: 34px;
    padding: 0 9px;
    white-space: nowrap;
  }

  .memory-page .memory-layout {
    height: 100%;
    min-height: 0;
    padding: 12px 12px calc(36px + env(safe-area-inset-bottom, 0px));
    overflow: hidden;
    overscroll-behavior: contain;
  }

  .memory-page .memory-main {
    height: calc(100dvh - 76px);
    min-height: 0;
    padding: 10px 10px calc(124px + env(safe-area-inset-bottom, 0px));
    border-radius: 0;
    gap: 8px;
    grid-template-rows: auto auto minmax(210px, 1fr) auto auto;
  }

  .memory-page .memory-main > .panel-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .memory-page .memory-main > .panel-heading .memory-chat-tools {
    align-self: flex-start;
  }

  .memory-page .memory-mobile-shortcuts {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
  }

  .memory-mobile-panel-close {
    display: inline-flex;
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 2;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: auto;
    min-width: 76px;
    min-height: 34px;
    padding: 0 14px;
    border-color: #16313a;
    border-radius: 999px;
    background: #17333c;
    color: #fff;
    font-size: 14px;
    font-weight: 850;
  }

  .memory-page #memoryModelPanel,
  .memory-page #memoryIdentityPanel {
    position: fixed;
    top: calc(58px + env(safe-area-inset-top, 0px));
    right: 12px;
    bottom: calc(112px + env(safe-area-inset-bottom, 0px));
    left: 12px;
    z-index: 80;
    display: none;
    overflow: auto;
    padding: 58px 14px 14px;
    border-radius: 16px;
    background: var(--card-bg);
    box-shadow: 0 18px 42px rgba(17, 24, 31, 0.22);
    -webkit-overflow-scrolling: touch;
  }

  .memory-page.mobile-memory-model-open #memoryModelPanel,
  .memory-page.mobile-memory-identity-open #memoryIdentityPanel {
    display: block;
  }

  .memory-page.mobile-memory-panel-open .memory-main::after {
    position: fixed;
    inset: 0;
    z-index: 70;
    background: rgba(24, 28, 31, 0.24);
    content: "";
  }

  .memory-fullscreen-toolbar {
    padding: 12px 14px;
  }

  .memory-fullscreen-body {
    width: min(100vw - 28px, 820px);
    min-height: calc(100dvh - 118px);
    margin: 14px auto 32px;
    padding: 28px 20px;
    font-size: 13px;
  }

  .memory-page .memory-messages {
    min-height: min(42dvh, 320px);
    height: auto;
    max-height: none;
    padding: 10px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .memory-page .memory-side .panel-heading,
  .memory-page .memory-panel .panel-heading {
    align-items: center;
    flex-direction: row;
    justify-content: space-between;
    gap: 8px;
  }

  .memory-page .memory-side .panel-heading h3,
  .memory-page .memory-panel .panel-heading h3 {
    min-width: 0;
    white-space: nowrap;
  }

  .memory-page .memory-side .memory-heading-actions,
  .memory-page .memory-panel .memory-heading-actions {
    flex: 0 0 auto;
    width: auto;
    padding-right: 88px;
  }

  .memory-page #memoryModelPanel label,
  .memory-page #memoryIdentityPanel label {
    margin-top: 10px;
  }

  .memory-page .memory-attachments {
    gap: 6px;
    margin-bottom: 2px;
    padding: 8px;
  }

  .memory-page .memory-attachment-actions {
    align-items: center;
    grid-template-columns: auto 1fr;
  }

  .memory-page .memory-attachment-actions strong {
    font-size: 15px;
  }

  .memory-page .memory-attachment-actions div {
    display: flex;
    justify-content: flex-end;
  }

  .memory-page .memory-attachment-actions button {
    min-height: 34px;
    padding: 0 10px;
  }

  .memory-page .memory-prompt-inspiration {
    min-height: 30px;
    margin-bottom: 2px;
    gap: 6px;
    flex-wrap: wrap;
  }

  .memory-page .memory-prompt-inspiration button {
    min-height: 30px;
    padding: 0 10px;
  }

  .memory-page .memory-project-picker {
    gap: 8px;
    padding: 10px;
  }

  .memory-page .memory-project-picker small {
    display: none;
  }

  .memory-page .memory-input-bar {
    position: fixed;
    right: 12px;
    bottom: calc(12px + var(--memory-input-bottom, 0px) + env(safe-area-inset-bottom, 0px));
    left: 12px;
    z-index: 50;
    grid-template-columns: minmax(0, 1fr) 52px;
    margin: 0;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--card-bg);
    box-shadow: 0 -10px 24px rgba(21, 30, 36, 0.08);
    backdrop-filter: blur(12px);
  }

  .memory-page .memory-input-bar textarea {
    min-height: 48px;
    max-height: 132px;
    border-radius: 18px;
    resize: none;
  }

  .memory-page .memory-input-bar .memory-send-button {
    width: 48px;
    height: 48px;
    min-height: 48px;
    border-radius: 999px;
  }

  .memory-prompt-browser-dialog {
    width: 100vw;
    height: 100dvh;
    border-radius: 0;
  }

  .memory-prompt-browser-content {
    border-radius: 0;
  }

  .memory-prompt-browser-toolbar {
    flex-direction: column;
    gap: 8px;
  }
}

@media (max-width: 390px) {
  .two-col,
  .prompt-toolbar,
  .prompt-samples,
  .prompt-sites,
  .param-grid,
  .upload-actions,
  .generate-actions {
    grid-template-columns: 1fr;
  }

  .memory-shell {
    padding: 10px;
  }

  .memory-side,
  .memory-main,
  .memory-panel {
    padding: 12px;
  }

  .memory-action-row {
    grid-template-columns: 1fr;
  }

  .memory-input-bar {
    grid-template-columns: minmax(0, 1fr) 52px;
    margin-right: -12px;
    margin-bottom: -12px;
    margin-left: -12px;
    padding-right: 12px;
    padding-left: 12px;
  }

  .memory-input-bar .memory-send-button {
    width: 48px;
  }

  .memory-page .memory-input-bar {
    right: 10px;
    left: 10px;
    grid-template-columns: minmax(0, 1fr) 52px;
    margin: 0;
    padding-right: 10px;
    padding-left: 10px;
  }

  .memory-page .memory-input-bar .memory-send-button {
    width: 48px;
  }

  .image-viewer-toolbar .topbar-actions {
    grid-template-columns: 1fr;
  }
}

/* 参考图选择器 */
.workflow-reference-picker-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

.workflow-reference-picker {
  background: var(--card-bg);
  border-radius: 12px;
  padding: 20px;
  max-width: 720px;
  width: calc(100vw - 40px);
  max-height: calc(100vh - 60px);
  overflow-y: auto;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
}

.workflow-reference-picker h4 {
  margin: 0 0 6px;
  font-size: 16px;
}

.workflow-reference-search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 8px;
  margin-top: 10px;
}

.workflow-reference-search input {
  min-width: 0;
}

.workflow-reference-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 10px;
  margin: 14px 0;
}

.workflow-reference-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  min-height: 34px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.workflow-reference-pagination:empty {
  display: none;
}

.workflow-reference-card {
  cursor: pointer;
  border: 2px solid transparent;
  border-radius: 8px;
  overflow: hidden;
  transition: border-color 0.15s;
  margin: 0;
}

.workflow-reference-card:hover,
.workflow-reference-card:focus-within {
  border-color: var(--accent, #2b6ff0);
}

.workflow-reference-card.is-highlighted {
  border-color: var(--accent, #2b6ff0);
  box-shadow: 0 0 0 2px var(--accent, #2b6ff0);
}

.workflow-reference-card img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
}

.workflow-reference-card figcaption {
  padding: 6px 8px;
  font-size: 12px;
  color: #555;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.workflow-reference-cancel {
  display: block;
  margin: 0 auto;
  min-width: 100px;
  min-height: 34px;
  border: 1px solid var(--line, #ccc);
  background: var(--card-bg);
  border-radius: 6px;
  cursor: pointer;
  font-size: 13px;
}

/* 参考图权重滑块 */
.workflow-reference-strength {
  margin: 14px 0 8px;
  padding: 10px 12px;
  background: var(--card-bg);
  border-radius: 8px;
}

.workflow-reference-strength label {
  display: flex;
  justify-content: space-between;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 6px;
}

.workflow-strength-value {
  color: var(--accent, #2b6ff0);
}

.workflow-strength-slider {
  width: 100%;
  accent-color: var(--accent, #2b6ff0);
}

.workflow-strength-hints {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: #999;
  margin-top: 2px;
}

.workflow-reference-buttons {
  display: flex;
  gap: 8px;
  justify-content: center;
  margin-top: 12px;
}

.workflow-reference-confirm {
  min-width: 120px;
  min-height: 34px;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  background: var(--accent, #2b6ff0);
  color: #fff;
}

.workflow-reference-confirm:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.workflow-reference-card.is-selected {
  border-color: var(--accent, #2b6ff0);
  box-shadow: 0 0 0 2px var(--accent, #2b6ff0);
}

/* 合规检查 diff 视图 */
.compliance-diff {
  margin-top: 8px;
  padding: 12px;
  background: var(--card-bg);
  border: 1px solid var(--line, #e0e0e0);
  border-radius: 8px;
  font-size: 13px;
  line-height: 1.7;
}

.compliance-diff-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.compliance-risk-badge {
  padding: 2px 10px;
  border-radius: 10px;
  font-size: 12px;
  font-weight: 600;
  color: #fff;
}

.compliance-risk-badge.risk-high { background: #d93025; }
.compliance-risk-badge.risk-mid { background: #e37400; }
.compliance-risk-badge.risk-low { background: #188038; }

.compliance-diff-hint {
  font-size: 11px;
  color: #999;
}

.compliance-diff-body {
  background: var(--card-bg);
  border: 1px solid #e8e8e8;
  border-radius: 6px;
  padding: 10px 12px;
  margin-bottom: 10px;
}

.compliance-diff-label {
  font-size: 11px;
  color: #888;
  margin-bottom: 4px;
}

.compliance-diff-text {
  white-space: pre-wrap;
  word-break: break-all;
}

.diff-added {
  background: #d2f5d2;
  color: #1a5c1a;
  padding: 0 1px;
  border-radius: 2px;
}

.diff-removed {
  background: #fdd;
  color: #a33;
  text-decoration: line-through;
  padding: 0 1px;
  border-radius: 2px;
}

.compliance-issues {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 6px;
}

.compliance-issue {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 10px;
  padding: 6px 10px;
  background: var(--card-bg);
  border-left: 3px solid #e0e0e0;
  border-radius: 4px;
  font-size: 12px;
}

.compliance-issue.severity-高 { border-left-color: #d93025; }
.compliance-issue.severity-中 { border-left-color: #e37400; }
.compliance-issue.severity-低 { border-left-color: #188038; }

.compliance-issue-type {
  font-weight: 600;
  min-width: 70px;
}

.compliance-issue-original {
  color: #a33;
}

.compliance-issue-suggestion {
  color: #188038;
}

/* ============================================================
   xAI 深色兜底 — 文件末尾定义，确保顺序与特异性能覆盖各页面专属的
   残留浅色。把外壳/卡片/区块统一压成深色玻璃，保证全站深色可读。
   ============================================================ */
html[data-theme="xai"] .app-shell {
  background: var(--bg);
}
html[data-theme="xai"] .workspace,
html[data-theme="xai"] .home-shell .workspace {
  background:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.012) 0 1px, transparent 1px 3px),
    radial-gradient(900px 500px at 10% -10%, rgba(182, 242, 74, 0.075), transparent 60%),
    radial-gradient(900px 500px at 90% -10%, rgba(88, 176, 255, 0.06), transparent 60%),
    radial-gradient(1200px 760px at 50% 120%, rgba(15, 160, 90, 0.07), transparent 62%),
    var(--bg);
}
html[data-theme="xai"] .home-shell .topbar,
html[data-theme="xai"] .topbar,
html[data-theme="xai"] .admin-header {
  background: rgba(13, 19, 29, 0.72);
  border: 1px solid rgba(151, 178, 216, 0.13);
  backdrop-filter: blur(10px);
}
html[data-theme="xai"] .hub-hero,
html[data-theme="xai"] .home-bento .hub-hero,
html[data-theme="xai"] .hub-status,
html[data-theme="xai"] .hub-announcement,
html[data-theme="xai"] .project-permission-note,
html[data-theme="xai"] .memory-project-picker,
html[data-theme="xai"] .memory-meta,
html[data-theme="xai"] [class*="-card"],
html[data-theme="xai"] [class*="-cell"],
html[data-theme="xai"] [class*="-tile"],
html[data-theme="xai"] [class*="-panel"],
html[data-theme="xai"] [class*="-box"],
html[data-theme="xai"] [class*="-module"],
html[data-theme="xai"] [class*="-bento"],
html[data-theme="xai"] [class*="-note"],
html[data-theme="xai"] [class*="-picker"],
html[data-theme="xai"] [class*="-summary"],
html[data-theme="xai"] [class*="-banner"],
html[data-theme="xai"] [class*="-notice"],
html[data-theme="xai"] [class*="-intro"],
html[data-theme="xai"] [class*="-editor"] {
  background: rgba(18, 26, 40, 0.62);
  border-color: rgba(151, 178, 216, 0.13);
  box-shadow: none;
}
/* 提示横幅/摘要类内部文字强制浅色（防深字配深底看不清） */
html[data-theme="xai"] .project-permission-note,
html[data-theme="xai"] .memory-project-picker,
html[data-theme="xai"] [class*="-note"],
html[data-theme="xai"] [class*="-banner"],
html[data-theme="xai"] [class*="-notice"],
html[data-theme="xai"] [class*="-summary"] {
  color: var(--ink);
}
html[data-theme="xai"] .home-bento .hub-hero {
  background:
    radial-gradient(620px 320px at 24% 38%, rgba(182, 242, 74, 0.28), transparent 62%),
    radial-gradient(540px 300px at 74% 64%, rgba(88, 176, 255, 0.2), transparent 60%),
    linear-gradient(180deg, rgba(18, 26, 40, 0.85), rgba(13, 19, 29, 0.85));
}
html[data-theme="xai"] .hub-hero h1,
html[data-theme="xai"] .hub-hero p,
html[data-theme="xai"] .hub-hero h2 {
  color: var(--ink);
}
html[data-theme="xai"] [class*="-chip"],
html[data-theme="xai"] [class*="-tag"],
html[data-theme="xai"] [class*="-badge"] {
  background: #121a28;
  color: var(--muted);
  border-color: rgba(151, 178, 216, 0.16);
}
/* 选中态：tab/子栏目/列表项被选中时用深色高亮，防"浅灰底 + 白字"看不清 */
html[data-theme="xai"] .module-card.active,
html[data-theme="xai"] .profile-subnav button.active,
html[data-theme="xai"] .profile-prompt-category-list button.active,
html[data-theme="xai"] .profile-prompt-item.active button,
html[data-theme="xai"] .project-subnav a.active,
html[data-theme="xai"] .project-list-item.active,
html[data-theme="xai"] .segmented button.active,
html[data-theme="xai"] .memory-conversation.active,
html[data-theme="xai"] .workflow-list-item.active,
html[data-theme="xai"] .workflow-subnav button.active,
html[data-theme="xai"] .workflow-skill-feedback-actions button.active,
html[data-theme="xai"] .admin-tab.active,
html[data-theme="xai"] [aria-selected="true"] {
  background: color-mix(in srgb, var(--accent) 18%, transparent);
  color: #ffffff;
  border-color: color-mix(in srgb, var(--accent) 55%, transparent);
}
/* 首页流程步骤条 .workflow-strip 的步骤是裸 div(无类名) + linear-gradient(#fff,#fff) 白填充，单独覆盖 */
html[data-theme="xai"] .workflow-strip,
html[data-theme="xai"] .home-bento .workflow-strip,
html[data-theme="xai"] .workflow-strip div,
html[data-theme="xai"] .home-bento .workflow-strip div {
  background: rgba(18, 26, 40, 0.62);
  border: 1px solid rgba(151, 178, 216, 0.13);
}
html[data-theme="xai"] .workflow-strip strong {
  color: #ffffff;
}

/* ============================================================
   OpenAI 官网风 — 纯净黑白极简：浅色画布、黑字、黑按钮、细边框、极淡阴影。
   依据 docs/design-styles/openai-design-style.md。
   ============================================================ */
html[data-theme="openai"] {
  color-scheme: light;
  --bg: #ffffff;
  --paper: #f7f7f8;
  --ink: #0d0d0d;
  --muted: #6e6e80;
  --line: #e3e3e8;
  --accent: #0d0d0d;
  --accent-strong: #000000;
  --warn: #c4322b;
  --soft: #f0f0f2;
  --accent-contrast: #ffffff;
  --shadow: 0 1px 3px rgba(13, 13, 13, 0.07);
  --radius: 10px;
  --radius-lg: 14px;
}
html[data-theme="openai"] body {
  background: var(--bg);
  color: var(--ink);
}
html[data-theme="openai"] .btn-accent,
html[data-theme="openai"] button.primary {
  background: #0d0d0d;
  color: #fff;
  border: none;
  border-radius: var(--radius-pill);
  font-weight: 600;
  box-shadow: none;
}
html[data-theme="openai"] .btn-accent:hover {
  background: #000;
}
html[data-theme="openai"] .nav-button,
html[data-theme="openai"] button {
  background: #ffffff;
  border: 1px solid var(--line);
  color: var(--ink);
  border-radius: var(--radius-pill);
}
html[data-theme="openai"] .nav-button:hover,
html[data-theme="openai"] button:hover {
  border-color: #0d0d0d;
}
html[data-theme="openai"] .topbar,
html[data-theme="openai"] .profile-card,
html[data-theme="openai"] .demo-card,
html[data-theme="openai"] .stat-card,
html[data-theme="openai"] .hub-hero,
html[data-theme="openai"] [class*="-card"] {
  background: var(--paper);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
}
html[data-theme="openai"] h1,
html[data-theme="openai"] h2 {
  color: var(--ink);
  letter-spacing: -0.5px;
}
html[data-theme="openai"] th {
  background: var(--soft);
  color: var(--ink);
  border-color: var(--line);
}
html[data-theme="openai"] a {
  color: var(--ink);
}
html[data-theme="openai"] .chip,
html[data-theme="openai"] [class*="-chip"],
html[data-theme="openai"] [class*="-tag"] {
  background: var(--soft);
  color: var(--ink);
}
/* hero 浅彩极光光晕（白底版，标题保持黑字可读） */
html[data-theme="openai"] .home-bento .hub-hero {
  background:
    radial-gradient(640px 320px at 22% 36%, rgba(16, 163, 127, 0.14), transparent 60%),
    radial-gradient(560px 300px at 76% 64%, rgba(59, 130, 246, 0.12), transparent 60%),
    var(--paper);
}
/* 网站公告：黑底白字 → 青绿到蓝的彩色渐变深底（白发光字仍可读） */
html[data-theme="openai"] .hub-announcement {
  background:
    radial-gradient(circle at 85% 12%, rgba(255, 255, 255, 0.22), transparent 44%),
    linear-gradient(140deg, #0d8a6a 0%, #1559c9 100%);
  border: none;
  color: #fff;
}

/* ====== 外部机器人 - 接入指南 ====== */
.profile-bot-tutorial {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.bot-tutorial-platform {
  border: 1px solid var(--border, #e6e6ed);
  border-radius: 12px;
  background: var(--surface-soft, rgba(255, 255, 255, 0.6));
  overflow: hidden;
  transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

.bot-tutorial-platform[open] {
  border-color: var(--accent, #3b6ef7);
  box-shadow: 0 4px 16px rgba(59, 110, 247, 0.08);
}

.bot-tutorial-platform > summary {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  cursor: pointer;
  list-style: none;
  user-select: none;
  font-size: 14px;
  position: relative;
}
.bot-tutorial-platform > summary::-webkit-details-marker { display: none; }
.bot-tutorial-platform > summary::after {
  content: "▾";
  margin-left: auto;
  font-size: 12px;
  opacity: 0.5;
  transition: transform 0.2s ease;
}
.bot-tutorial-platform[open] > summary::after { transform: rotate(180deg); }

.bot-tutorial-platform > summary > strong {
  font-size: 15px;
  font-weight: 600;
}

.bot-tutorial-icon {
  font-size: 20px;
  line-height: 1;
}

.bot-tutorial-tag {
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 999px;
  font-weight: 500;
}
.bot-tutorial-tag.tag-ready {
  background: rgba(34, 174, 110, 0.12);
  color: #1f8e57;
}
.bot-tutorial-tag.tag-blocked {
  background: rgba(220, 90, 90, 0.12);
  color: #c64545;
}
.bot-tutorial-tag.tag-coming {
  background: rgba(150, 150, 165, 0.16);
  color: #686878;
}

.bot-tutorial-meta {
  font-size: 12px;
  color: var(--text-muted, #999);
}

.bot-tutorial-body {
  padding: 0 20px 18px;
  font-size: 13.5px;
  line-height: 1.7;
  color: var(--text-secondary, #555);
}

.bot-tutorial-hint {
  background: rgba(245, 180, 60, 0.08);
  border-left: 3px solid #d99500;
  padding: 10px 14px;
  border-radius: 0 8px 8px 0;
  margin: 4px 0 16px;
  font-size: 13px;
  line-height: 1.65;
}
.bot-tutorial-hint code {
  background: rgba(0, 0, 0, 0.05);
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 12.5px;
}

.bot-tutorial-steps {
  list-style: none;
  counter-reset: bot-step;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.bot-tutorial-steps > li {
  counter-increment: bot-step;
  position: relative;
  padding: 12px 14px 14px 52px;
  background: var(--surface, #fff);
  border: 1px solid var(--border, #ececf2);
  border-radius: 10px;
}
.bot-tutorial-steps > li::before {
  content: counter(bot-step);
  position: absolute;
  left: 12px;
  top: 12px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--accent, #3b6ef7);
  color: #fff;
  font-weight: 600;
  font-size: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  letter-spacing: 0;
}

.bot-step-title {
  font-weight: 600;
  color: var(--text, #222);
  font-size: 14px;
  margin-bottom: 4px;
}
.bot-step-body {
  color: var(--text-secondary, #555);
  font-size: 13.5px;
}
.bot-step-body code {
  background: rgba(0, 0, 0, 0.05);
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 12.5px;
  color: #b53d8a;
}
.bot-step-body a {
  color: var(--accent, #3b6ef7);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

.bot-step-pitfall {
  display: block;
  margin-top: 8px;
  padding: 8px 10px;
  background: rgba(220, 90, 90, 0.07);
  border-left: 3px solid #d96060;
  border-radius: 0 6px 6px 0;
  font-size: 12.5px;
  line-height: 1.6;
  color: #844;
}

.bot-step-list {
  margin: 6px 0 0;
  padding-left: 20px;
  font-size: 13px;
}
.bot-step-list li { margin: 2px 0; }

.bot-step-copybox {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 8px 0;
  padding: 8px 10px;
  background: rgba(0, 0, 0, 0.04);
  border-radius: 8px;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
}
.bot-step-copybox code {
  flex: 1;
  background: transparent;
  padding: 0;
  font-size: 12.5px;
  color: var(--text, #222);
  word-break: break-all;
}

.profile-bot-tutorial .bot-step-copy,
button.bot-step-copy {
  flex-shrink: 0;
  padding: 5px 16px;
  min-width: 64px;
  height: auto;
  line-height: 1.5;
  font-size: 12px;
  background: var(--accent, #3b6ef7);
  color: #fff;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-family: inherit;
  font-weight: 500;
  transition: transform 0.1s ease, opacity 0.15s ease;
  box-shadow: none;
}
.profile-bot-tutorial .bot-step-copy:hover,
button.bot-step-copy:hover { opacity: 0.9; background: var(--accent, #3b6ef7); color: #fff; }
.profile-bot-tutorial .bot-step-copy:active,
button.bot-step-copy:active { transform: scale(0.96); }
.profile-bot-tutorial .bot-step-copy.copied,
button.bot-step-copy.copied {
  background: #1f8e57;
}
.profile-bot-tutorial .bot-step-copy-inline,
button.bot-step-copy-inline {
  padding: 2px 10px;
  font-size: 11.5px;
  margin-left: 4px;
  min-width: 48px;
}

.bot-tutorial-footer {
  margin: 16px 0 0;
  padding: 10px 14px;
  background: rgba(59, 110, 247, 0.06);
  border-radius: 8px;
  font-size: 12.5px;
  color: var(--text-secondary, #555);
  line-height: 1.6;
}

.bot-tutorial-advanced-note {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--border, #e6e6ed);
  color: var(--text-muted, #777);
  font-size: 12px;
  line-height: 1.6;
}

.bot-tutorial-advanced-note code {
  word-break: break-all;
}

/* 深色主题适配 */
html[data-theme="midnight"] .bot-tutorial-platform,
html[data-theme="claude"] .bot-tutorial-platform {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(255, 255, 255, 0.08);
}
html[data-theme="midnight"] .bot-tutorial-steps > li,
html[data-theme="claude"] .bot-tutorial-steps > li {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.08);
}
html[data-theme="midnight"] .bot-step-body code,
html[data-theme="claude"] .bot-step-body code,
html[data-theme="midnight"] .bot-step-copybox,
html[data-theme="claude"] .bot-step-copybox {
  background: rgba(255, 255, 255, 0.06);
  color: #f0d0a8;
}

/* 移动端 */
@media (max-width: 720px) {
  .bot-tutorial-platform > summary {
    flex-wrap: wrap;
    gap: 6px;
  }
  .bot-tutorial-meta { flex-basis: 100%; margin-left: 30px; }
  .bot-tutorial-body { padding: 0 14px 14px; }
  .bot-tutorial-steps > li { padding: 10px 12px 12px 46px; }
  .bot-tutorial-steps > li::before { left: 10px; top: 10px; width: 24px; height: 24px; font-size: 12px; }
}

/* ====== 记忆智能体消息长按/双击菜单 ====== */
/* 允许选择文本(默认浏览器允许,但有些主题/样式覆盖了) */
.memory-message,
.memory-message * {
  -webkit-user-select: text;
  user-select: text;
}
/* 长按触发时禁用浏览器默认 callout/highlight(避免跟自定义菜单打架) */
.memory-message {
  -webkit-touch-callout: none;
}
/* 选取模式时反而允许 callout(让系统选择手柄可见) */
.memory-message-selecting {
  -webkit-touch-callout: default !important;
  background: rgba(59, 110, 247, 0.06);
  outline: 2px dashed rgba(59, 110, 247, 0.5);
  outline-offset: 2px;
  border-radius: 8px;
  transition: background 0.2s ease;
}

/* 浮动菜单 */
.memory-msg-menu {
  position: fixed;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  min-width: 140px;
  padding: 6px;
  background: var(--paper, #fff);
  border: 1px solid var(--line, #e5e5ec);
  border-radius: 12px;
  box-shadow: 0 10px 32px rgba(0, 0, 0, 0.18), 0 2px 8px rgba(0, 0, 0, 0.08);
  font-size: 14px;
  user-select: none;
  -webkit-user-select: none;
  animation: memoryMenuPop 0.12s ease-out;
}
@keyframes memoryMenuPop {
  from { opacity: 0; transform: scale(0.94); }
  to { opacity: 1; transform: scale(1); }
}
.memory-msg-menu[hidden] { display: none; }

.memory-msg-menu button {
  appearance: none;
  background: transparent;
  border: none;
  text-align: left;
  padding: 9px 14px;
  font-size: 14px;
  color: var(--ink, #1f1f24);
  border-radius: 8px;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.12s ease;
}
.memory-msg-menu button:hover,
.memory-msg-menu button:focus-visible {
  background: rgba(59, 110, 247, 0.1);
  outline: none;
}
.memory-msg-menu button.danger {
  color: #c64545;
}
.memory-msg-menu button.danger:hover,
.memory-msg-menu button.danger:focus-visible {
  background: rgba(220, 90, 90, 0.1);
}

/* status flash 提示样式 */
.memory-status-flash {
  color: var(--accent, #3b6ef7);
  font-weight: 500;
  transition: color 0.2s ease;
}

/* 右键菜单跟随主题(修 20260725)
   原来两个问题:①用了 --surface/--border/--text,这三个变量本项目没有(本项目是 --paper/--line/--ink),
   于是只能吃写死的兜底色;②主题级的 `html[data-theme] button {…}` 优先级(0,2,1)高于
   `.memory-msg-menu button`(0,1,1),把菜单项刷成白色药丸+描边,深色面板上就成了「黑底白丸」。
   这里统一用项目变量,并用 html + [data-msg-action] 把优先级提到 0,2,2 压过主题规则。 */
html .memory-msg-menu {
  background: var(--paper, #fff);
  border: 1px solid var(--line, #e5e5ec);
  color: var(--ink, #1f1f24);
}
html .memory-msg-menu button[data-msg-action] {
  background: transparent;
  border: none;
  box-shadow: none;
  border-radius: 8px;
  color: var(--ink, #1f1f24);
  text-align: left;
  padding: 9px 14px;
  font-size: 14px;
  font-weight: 500;
}
html .memory-msg-menu button[data-msg-action]:hover,
html .memory-msg-menu button[data-msg-action]:focus-visible {
  background: var(--soft, rgba(0, 0, 0, 0.06));
  color: var(--ink, #1f1f24);
  outline: none;
}
html .memory-msg-menu button.danger[data-msg-action] { color: var(--danger, #c64545); }
html .memory-msg-menu button.danger[data-msg-action]:hover {
  background: color-mix(in srgb, var(--danger, #c64545) 12%, transparent);
  color: var(--danger, #c64545);
}

/* ============================================================
   全站统一打磨层(20260702):细节质感,不改主题结构。
   焦点态/选区/滚动条/过渡,五主题(warm/claude/gemini/xai/openai)通用。
   ============================================================ */
::selection { background: color-mix(in srgb, var(--accent) 24%, transparent); }
/* 键盘可达性:统一焦点环(仅键盘聚焦时出现,鼠标点击不打扰) */
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--accent) 50%, transparent);
  outline-offset: 2px;
  border-radius: 4px;
}
/* 细滚动条(与台账一致) */
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--muted) 32%, transparent); border-radius: 8px; border: 2px solid transparent; background-clip: content-box; }
::-webkit-scrollbar-thumb:hover { background: color-mix(in srgb, var(--muted) 52%, transparent); border: 2px solid transparent; background-clip: content-box; }
::-webkit-scrollbar-track { background: transparent; }
/* 按钮/输入的柔和过渡与按压反馈(不覆盖已有 transition 的元素) */
button:not([class*="transition"]) { transition: background-color .15s var(--ease-out, ease), color .15s, border-color .15s, box-shadow .18s, transform .1s; }
button:active:not(:disabled) { transform: scale(.985); }
input, select, textarea { transition: border-color .15s, box-shadow .18s; }
/* 字体渲染 */
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
/* 尊重系统减少动效偏好 */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* ============================================================
   玫瑰粉软拟态(rose) — 粉灰软浮雕 + 蕾丝玫瑰。
   软拟态要点:卡片比背景亮一档、双向柔阴影(亮上暗下)、
   按钮药丸圆润、输入框内凹;文字保持高对比,可用性不打折。
   ============================================================ */
html[data-theme="rose"] {
  color-scheme: light;
  --bg: #f2eaec;
  --paper: #fbf6f7;
  --ink: #3d2e34;
  --muted: #8d7680;
  --line: #e8d8dd;
  --accent: #c1798f;
  --accent-strong: #a95f78;
  --warn: #c4453b;
  --soft: #f0dde3;
  --accent-contrast: #ffffff;
  --shadow: 4px 4px 10px rgba(178, 142, 154, 0.28), -3px -3px 8px rgba(255, 255, 255, 0.9);
  --shadow-sm: 2px 2px 6px rgba(178, 142, 154, 0.22), -2px -2px 5px rgba(255, 255, 255, 0.85);
  --shadow-md: 5px 5px 14px rgba(178, 142, 154, 0.3), -4px -4px 10px rgba(255, 255, 255, 0.9);
  --card-bg: #fbf6f7;
  --card-border: 1px solid rgba(232, 216, 221, 0.6);
  --radius: 14px;
  --radius-lg: 20px;
}
html[data-theme="rose"] body {
  background: var(--bg);
  color: var(--ink);
}
html[data-theme="rose"] .btn-accent,
html[data-theme="rose"] button.primary {
  background: var(--accent);
  color: #fff;
  border: none;
  border-radius: var(--radius-pill);
  font-weight: 600;
  box-shadow: 3px 3px 8px rgba(178, 142, 154, 0.35);
}
html[data-theme="rose"] .btn-accent:hover,
html[data-theme="rose"] button.primary:hover {
  background: var(--accent-strong);
  color: var(--accent-contrast); /* 同 sage：不写会被后面的通用 button:hover 抢成同色，字消失 */
}
html[data-theme="rose"] .nav-button,
html[data-theme="rose"] button {
  background: var(--paper);
  border: none;
  color: var(--ink);
  border-radius: var(--radius-pill);
  box-shadow: var(--shadow-sm);
}
html[data-theme="rose"] .nav-button:hover,
html[data-theme="rose"] button:hover {
  color: var(--accent-strong);
  box-shadow: var(--shadow);
}
html[data-theme="rose"] .topbar,
html[data-theme="rose"] .profile-card,
html[data-theme="rose"] .demo-card,
html[data-theme="rose"] .stat-card,
html[data-theme="rose"] .hub-hero,
html[data-theme="rose"] [class*="-card"] {
  background: var(--paper);
  border: 1px solid rgba(232, 216, 221, 0.55);
  box-shadow: var(--shadow);
  border-radius: var(--radius-lg);
}
html[data-theme="rose"] input,
html[data-theme="rose"] select,
html[data-theme="rose"] textarea {
  background: #f6eef1;
  border: 1px solid transparent;
  border-radius: 12px;
  box-shadow: inset 2px 2px 5px rgba(178, 142, 154, 0.22), inset -2px -2px 4px rgba(255, 255, 255, 0.7);
  color: var(--ink);
}
html[data-theme="rose"] input:focus,
html[data-theme="rose"] select:focus,
html[data-theme="rose"] textarea:focus {
  border-color: rgba(193, 121, 143, 0.45);
}
html[data-theme="rose"] h1,
html[data-theme="rose"] h2 {
  color: var(--ink);
}
html[data-theme="rose"] th {
  background: var(--soft);
  color: #7a4f5f;
  border-color: var(--line);
}
html[data-theme="rose"] a {
  color: var(--accent-strong);
}
html[data-theme="rose"] .chip,
html[data-theme="rose"] [class*="-chip"],
html[data-theme="rose"] [class*="-tag"] {
  background: var(--soft);
  color: #8d4f63;
  border-radius: var(--radius-pill);
}

/* ============================================================
   鼠尾草绿软拟态(sage) — 灰调鼠尾草绿软浮雕。
   软拟态要点:卡片比背景亮一档、双向柔阴影(亮上暗下)、
   按钮药丸圆润、输入框内凹;文字保持高对比,可用性不打折。
   ============================================================ */
html[data-theme="sage"] {
  color-scheme: light;
  --bg: #e8ece4;
  --paper: #f4f7f1;
  --ink: #2f3b2c;
  --muted: #7c8874;
  --line: #dbe2d5;
  --accent: #6b8f5c;
  --accent-strong: #557548;
  --warn: #c4453b;
  --soft: #dde6d6;
  --accent-contrast: #ffffff;
  --shadow: 4px 4px 10px rgba(120, 138, 108, 0.26), -3px -3px 8px rgba(255, 255, 255, 0.9);
  --shadow-sm: 2px 2px 6px rgba(120, 138, 108, 0.2), -2px -2px 5px rgba(255, 255, 255, 0.85);
  --shadow-md: 5px 5px 14px rgba(120, 138, 108, 0.28), -4px -4px 10px rgba(255, 255, 255, 0.9);
  --card-bg: #f4f7f1;
  --card-border: 1px solid rgba(219, 226, 213, 0.6);
  --radius: 14px;
  --radius-lg: 20px;
}
html[data-theme="sage"] body {
  background: var(--bg);
  color: var(--ink);
}
html[data-theme="sage"] .btn-accent,
html[data-theme="sage"] button.primary {
  background: var(--accent);
  color: #fff;
  border: none;
  border-radius: var(--radius-pill);
  font-weight: 600;
  box-shadow: 3px 3px 8px rgba(107, 143, 92, 0.4);
}
html[data-theme="sage"] .btn-accent:hover,
html[data-theme="sage"] button.primary:hover {
  background: var(--accent-strong);
  /* ★必须显式声明 color：下面那条通用 `button:hover` 把文字设成 var(--accent-strong)，
     它和本条特异度相同(都是 0,2,2)、又写在后面，会赢下 color —— 于是文字色和这里的背景色
     变成同一个值，主按钮一悬停字就消失。默认主题的 .primary:hover 就是靠自带 color 幸免的。 */
  color: var(--accent-contrast);
}
html[data-theme="sage"] .nav-button,
html[data-theme="sage"] button {
  background: var(--paper);
  border: none;
  color: var(--ink);
  border-radius: var(--radius-pill);
  box-shadow: var(--shadow-sm);
}
html[data-theme="sage"] .nav-button:hover,
html[data-theme="sage"] button:hover {
  color: var(--accent-strong);
  box-shadow: var(--shadow);
}
html[data-theme="sage"] .topbar,
html[data-theme="sage"] .profile-card,
html[data-theme="sage"] .demo-card,
html[data-theme="sage"] .stat-card,
html[data-theme="sage"] .hub-hero,
html[data-theme="sage"] [class*="-card"] {
  background: var(--paper);
  border: 1px solid rgba(219, 226, 213, 0.6);
  box-shadow: var(--shadow);
  border-radius: var(--radius-lg);
}
html[data-theme="sage"] input,
html[data-theme="sage"] select,
html[data-theme="sage"] textarea {
  background: #e8ece4;
  border: 1px solid transparent;
  border-radius: 12px;
  box-shadow: inset 2px 2px 5px rgba(120, 138, 108, 0.28), inset -2px -2px 4px rgba(255, 255, 255, 0.7);
  color: var(--ink);
}
html[data-theme="sage"] input:focus,
html[data-theme="sage"] select:focus,
html[data-theme="sage"] textarea:focus {
  border-color: rgba(107, 143, 92, 0.45);
}
html[data-theme="sage"] h1,
html[data-theme="sage"] h2 {
  color: var(--ink);
}
html[data-theme="sage"] th {
  background: var(--soft);
  color: #45573b;
  border-color: var(--line);
}
html[data-theme="sage"] a {
  color: var(--accent-strong);
}
html[data-theme="sage"] .chip,
html[data-theme="sage"] [class*="-chip"],
html[data-theme="sage"] [class*="-tag"] {
  background: var(--soft);
  color: #45573b;
  border-radius: var(--radius-pill);
}

/* ============================================================
   首页 v2 「编辑部作战图」— 全部基于主题令牌(--bg/--paper/--ink/
   --muted/--line/--accent/--soft/--shadow)，六主题自动各有气质。
   类名 hm-* 独立作用域，避开旧首页类与通配兜底的干扰。
   ============================================================ */
.home-v2 .workspace { max-width: 1280px; margin: 0 auto; padding: 0 28px 40px; }
.home-v2 #mainContent { outline: none; }

/* ── 氛围底:主题色微光(xai 已有球场光,其余主题这里补一层) ── */
.home-v2 #mainContent {
  background:
    radial-gradient(760px 380px at 8% 0%, color-mix(in srgb, var(--accent) 6%, transparent), transparent 62%),
    radial-gradient(720px 400px at 96% 12%, color-mix(in srgb, var(--accent) 4%, transparent), transparent 60%);
}

/* ── 顶部导航 ── */
.home-v2 .hm-nav {
  display: flex; align-items: center; justify-content: space-between; gap: 18px;
  padding: 18px 4px 16px; border-bottom: 1px solid var(--line);
  position: sticky; top: 0; z-index: 30;
  background: color-mix(in srgb, var(--bg) 82%, transparent);
  backdrop-filter: blur(12px);
}
.home-v2 .hm-brand { display: flex; align-items: baseline; gap: 10px; white-space: nowrap; }
.home-v2 .hm-brand-dot {
  width: 11px; height: 11px; background: var(--accent); border-radius: 3px;
  transform: rotate(45deg) translateY(-1px); display: inline-block;
  box-shadow: 0 0 14px color-mix(in srgb, var(--accent) 55%, transparent);
}
.home-v2 .hm-brand-name { font-size: 19px; font-weight: 900; color: var(--ink); letter-spacing: 1px; }
.home-v2 .hm-brand-sub { font-family: Georgia, "Times New Roman", serif; font-style: italic; font-size: 11px; letter-spacing: 3px; color: var(--muted); }
.home-v2 .hm-links { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; justify-content: flex-end; }
.home-v2 .hm-link {
  padding: 7px 13px; border-radius: 99px; font-size: 13.5px; color: var(--muted);
  text-decoration: none; border: 1px solid transparent; transition: 0.18s; white-space: nowrap;
}
.home-v2 .hm-link:hover { color: var(--ink); background: var(--soft); transform: none; }
.home-v2 .hm-link.is-here { color: var(--accent-contrast); background: var(--accent); font-weight: 700; }
html[data-theme="xai"] .home-v2 .hm-link.is-here { color: #11210a; }
.home-v2 .hm-logout {
  padding: 7px 15px; border-radius: 99px; font-size: 13.5px; cursor: pointer;
  background: transparent; border: 1px solid var(--line); color: var(--muted); transition: 0.18s;
}
.home-v2 .hm-logout:hover { border-color: var(--accent); color: var(--accent); background: transparent; }

/* ── 英雄区 ── */
.home-v2 .hm-hero {
  display: grid; grid-template-columns: 1.18fr 0.82fr; gap: 34px; align-items: stretch;
  padding: 58px 4px 44px;
}
.home-v2 .hm-eyebrow {
  display: flex; align-items: center; gap: 10px; margin: 0 0 18px;
  font-size: 12.5px; letter-spacing: 4px; color: var(--muted); font-weight: 600;
}
.home-v2 .hm-eyebrow i { width: 26px; height: 2px; background: var(--accent); display: inline-block; }
.home-v2 .hm-title {
  margin: 0 0 18px; font-size: clamp(32px, 4.6vw, 56px); line-height: 1.16;
  font-weight: 900; color: var(--ink); letter-spacing: 0.5px;
}
.home-v2 .hm-title em {
  font-style: normal; color: var(--accent);
  background: linear-gradient(120deg, var(--accent), color-mix(in srgb, var(--accent-strong, var(--accent)) 80%, var(--ink)));
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
  border-bottom: 5px solid color-mix(in srgb, var(--accent) 32%, transparent);
  padding-bottom: 2px;
}
.home-v2 .hm-sub { margin: 0 0 30px; max-width: 560px; font-size: 15px; line-height: 1.95; color: var(--muted); }
.home-v2 .hm-cta { display: flex; gap: 12px; flex-wrap: wrap; }
.home-v2 .hm-btn-main {
  display: inline-flex; align-items: center; gap: 8px; padding: 13px 26px;
  background: var(--accent); color: var(--accent-contrast); border-radius: 99px;
  font-size: 15px; font-weight: 800; text-decoration: none; letter-spacing: 0.5px;
  box-shadow: 0 8px 28px color-mix(in srgb, var(--accent) 32%, transparent); transition: 0.22s;
}
.home-v2 .hm-btn-main span { transition: transform 0.22s; }
.home-v2 .hm-btn-main:hover { transform: translateY(-2px); filter: brightness(1.06); }
.home-v2 .hm-btn-main:hover span { transform: translateX(4px); }
.home-v2 .hm-btn-ghost {
  display: inline-flex; align-items: center; padding: 13px 22px; border-radius: 99px;
  border: 1px solid var(--line); color: var(--ink); font-size: 14.5px; text-decoration: none; transition: 0.2s;
}
.home-v2 .hm-btn-ghost:hover { border-color: var(--accent); color: var(--accent); transform: translateY(-2px); }

/* ── 公告牌 ── */
.home-v2 aside.hm-board {
  background: var(--paper); border: 1px solid var(--line); border-radius: 18px;
  padding: 22px 22px 14px; box-shadow: var(--shadow); align-self: center;
  display: flex; flex-direction: column; max-height: 320px; width: 100%;
}
html[data-theme="xai"] .home-v2 aside.hm-board { background: linear-gradient(180deg, #121a28, #0d131d); border-color: rgba(151, 178, 216, 0.15); }
.home-v2 .hm-board-head { display: flex; align-items: center; gap: 9px; margin-bottom: 12px; }
.home-v2 .hm-board-head h2 { margin: 0; font-size: 15px; font-weight: 800; color: var(--ink); letter-spacing: 1px; }
.home-v2 .hm-board-pulse { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); animation: hmPulse 1.8s infinite; }
@keyframes hmPulse {
  0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent) 50%, transparent); }
  55% { box-shadow: 0 0 0 8px transparent; }
}
.home-v2 .hm-board-list { overflow-y: auto; }
.home-v2 .hm-board-list .announcement-item {
  display: grid; grid-template-columns: 34px 1fr; gap: 10px; align-items: baseline;
  padding: 9px 0; border-top: 1px solid color-mix(in srgb, var(--line) 60%, transparent);
  background: transparent; border-left: none; border-right: none; border-bottom: none; box-shadow: none;
}
.home-v2 .hm-board-list .announcement-item:first-child { border-top: none; }
.home-v2 .hm-board-list .announcement-item-index {
  font-family: Georgia, "Times New Roman", serif; font-style: italic;
  font-size: 17px; color: var(--accent); font-weight: 700; background: transparent;
}
.home-v2 .hm-board-list .announcement-item-text { margin: 0; font-size: 13px; line-height: 1.75; color: var(--muted); }
.home-v2 .hm-board-list .announcement-empty { margin: 6px 0; font-size: 13px; color: var(--muted); }
.home-v2 aside.hm-board.announcement-updated { animation: hmBoardFlash 3.2s ease; }
@keyframes hmBoardFlash {
  0% { box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 55%, transparent); }
  100% { box-shadow: var(--shadow); }
}

/* ── 五步流程脊柱 ── */
.home-v2 .hm-spine {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px;
  position: relative; padding: 26px 4px 30px; counter-reset: spine;
}
.home-v2 .hm-spine::before {
  content: ""; position: absolute; left: 4px; right: 4px; top: 36px; height: 1px;
  background: linear-gradient(90deg, transparent, var(--line) 12%, var(--line) 88%, transparent);
}
.home-v2 .hm-spine-step { position: relative; padding-top: 24px; counter-increment: spine; }
.home-v2 .hm-spine-step::before {
  content: ""; position: absolute; top: 6px; left: 2px; width: 9px; height: 9px;
  border-radius: 50%; background: var(--accent);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 16%, transparent);
}
.home-v2 .hm-spine-step::after {
  content: counter(spine, decimal-leading-zero); position: absolute; top: -2px; left: 22px;
  font-family: Georgia, "Times New Roman", serif; font-style: italic;
  font-size: 13px; color: color-mix(in srgb, var(--muted) 70%, transparent);
}
.home-v2 .hm-spine-step b { display: block; font-size: 15px; color: var(--ink); margin-bottom: 3px; letter-spacing: 0.5px; }
.home-v2 .hm-spine-step span { font-size: 12.5px; color: var(--muted); }

/* ── 模块矩阵 ── */
.home-v2 .hm-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 18px; padding: 6px 0 8px; }
.home-v2 .hm-mod {
  grid-column: span 4; display: flex; flex-direction: column; gap: 10px; min-height: 168px;
  background: var(--paper); border: 1px solid var(--line); border-radius: 18px;
  padding: 22px 22px 18px; text-decoration: none; position: relative; overflow: hidden;
  transition: transform 0.22s, border-color 0.22s, box-shadow 0.22s;
}
html[data-theme="xai"] .home-v2 .hm-mod { background: linear-gradient(180deg, #121a28, #0d131d); border-color: rgba(151, 178, 216, 0.14); }
.home-v2 .hm-mod:hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb, var(--accent) 55%, var(--line));
  box-shadow: 0 14px 40px color-mix(in srgb, var(--accent) 10%, rgba(0, 0, 0, 0.12));
}
.home-v2 .hm-mod-xl { grid-column: span 6; min-height: 196px; }
.home-v2 .hm-no {
  font-family: Georgia, "Times New Roman", serif; font-style: italic; font-weight: 700;
  font-size: 44px; line-height: 1; color: color-mix(in srgb, var(--accent) 26%, transparent);
  transition: color 0.22s;
}
.home-v2 .hm-mod:hover .hm-no { color: color-mix(in srgb, var(--accent) 70%, transparent); }
.home-v2 .hm-mod-body h3 { margin: 2px 0 8px; font-size: 18px; font-weight: 800; color: var(--ink); letter-spacing: 0.5px; }
.home-v2 .hm-mod-body p { margin: 0; font-size: 13.5px; line-height: 1.8; color: var(--muted); }
.home-v2 .hm-mini-flow { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.home-v2 .hm-mini-flow i {
  font-style: normal; font-size: 11.5px; color: var(--muted);
  padding: 4px 10px; border-radius: 99px; background: var(--soft);
  display: inline-flex; align-items: center;
}
.home-v2 .hm-mini-flow i:not(:last-child)::after { content: "→"; margin-left: 8px; margin-right: -2px; opacity: 0.5; }
.home-v2 .hm-go {
  margin-top: auto; padding-top: 12px; font-size: 13px; font-weight: 700;
  color: var(--accent); opacity: 0.78; transition: 0.2s;
}
.home-v2 .hm-mod:hover .hm-go { opacity: 1; letter-spacing: 1px; }

/* ── 在建路线 ── */
.home-v2 .hm-roadmap {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  margin: 26px 0 8px; padding: 14px 20px;
  border: 1px dashed color-mix(in srgb, var(--muted) 38%, transparent); border-radius: 99px;
}
.home-v2 .hm-roadmap-cap { font-size: 12px; letter-spacing: 3px; color: var(--accent); font-weight: 800; }
.home-v2 .hm-roadmap-item { font-size: 13px; color: var(--muted); display: flex; align-items: center; gap: 16px; }
.home-v2 .hm-roadmap-item:not(:last-child)::after { content: "·"; opacity: 0.5; }

/* ── 页脚 ── */
.home-v2 .site-footer { text-align: center; padding: 26px 0 8px; }
.home-v2 .site-footer a { color: color-mix(in srgb, var(--muted) 75%, transparent); font-size: 12px; text-decoration: none; }

/* ── 入场编排:整屏一次交错揭幕 ── */
@keyframes hmUp { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
.home-v2 .hm-hero, .home-v2 .hm-spine, .home-v2 .hm-roadmap { animation: hmUp 0.65s cubic-bezier(0.2, 0.7, 0.2, 1) both; }
.home-v2 .hm-spine { animation-delay: 0.12s; }
.home-v2 .hm-roadmap { animation-delay: 0.55s; }
.home-v2 .hm-grid .hm-mod { animation: hmUp 0.6s cubic-bezier(0.2, 0.7, 0.2, 1) both; }
.home-v2 .hm-grid .hm-mod:nth-child(1) { animation-delay: 0.18s; }
.home-v2 .hm-grid .hm-mod:nth-child(2) { animation-delay: 0.24s; }
.home-v2 .hm-grid .hm-mod:nth-child(3) { animation-delay: 0.3s; }
.home-v2 .hm-grid .hm-mod:nth-child(4) { animation-delay: 0.34s; }
.home-v2 .hm-grid .hm-mod:nth-child(5) { animation-delay: 0.38s; }
.home-v2 .hm-grid .hm-mod:nth-child(6) { animation-delay: 0.42s; }
.home-v2 .hm-grid .hm-mod:nth-child(7) { animation-delay: 0.46s; }
.home-v2 .hm-grid .hm-mod:nth-child(8) { animation-delay: 0.5s; }
@media (prefers-reduced-motion: reduce) {
  .home-v2 .hm-hero, .home-v2 .hm-spine, .home-v2 .hm-roadmap, .home-v2 .hm-grid .hm-mod { animation: none; }
  .home-v2 .hm-board-pulse { animation: none; }
}

/* ── 响应式 ── */
@media (max-width: 1080px) {
  .home-v2 .hm-hero { grid-template-columns: 1fr; padding-top: 40px; }
  .home-v2 aside.hm-board { max-height: 260px; }
  .home-v2 .hm-mod-xl { grid-column: span 12; }
  .home-v2 .hm-mod { grid-column: span 6; }
}
@media (max-width: 720px) {
  .home-v2 .workspace { padding: 0 16px 32px; }
  .home-v2 .hm-nav { flex-direction: column; align-items: flex-start; gap: 10px; }
  .home-v2 .hm-links { justify-content: flex-start; }
  .home-v2 .hm-spine { grid-template-columns: 1fr 1fr; }
  .home-v2 .hm-spine::before { display: none; }
  .home-v2 .hm-mod { grid-column: span 12; }
  .home-v2 .hm-roadmap { border-radius: 18px; }
}

/* 首页 v2:压掉各主题的整行 h1 渐变签名(如 gemini),标题保持墨色、只让 em 短语上渐变强调 */
html[data-theme] .home-v2 .hm-title {
  background: none;
  -webkit-text-fill-color: var(--ink);
  color: var(--ink);
  letter-spacing: 0.5px;
  font-weight: 900;
}
html[data-theme] .home-v2 .hm-title em {
  background: linear-gradient(120deg, var(--accent), color-mix(in srgb, var(--accent-strong, var(--accent)) 80%, var(--ink)));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* 首页 v2:公告编号回归衬线斜体裸数字,清掉旧版的玻璃方块效果 */
.home-v2 .hm-board-list .announcement-item-index {
  display: inline; width: auto; height: auto; border-radius: 0;
  background: transparent; box-shadow: none; text-shadow: none;
  letter-spacing: 0;
}

/* 首页 v2:压掉旧版 workspace 的米青对角装饰(固定色,与各主题打架);氛围光由 #mainContent 的主题色微光承担 */
.home-shell.home-v2 .workspace { background: var(--bg); }
html[data-theme="xai"] .home-shell.home-v2 .workspace {
  background:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.012) 0 1px, transparent 1px 3px),
    radial-gradient(900px 500px at 10% -10%, rgba(182, 242, 74, 0.075), transparent 60%),
    radial-gradient(900px 500px at 90% -10%, rgba(88, 176, 255, 0.06), transparent 60%),
    radial-gradient(1200px 760px at 50% 120%, rgba(15, 160, 90, 0.07), transparent 62%),
    var(--bg);
}

/* ============================================================
   楼盘资料库 v2 「编辑部工作台」— 全部基于主题令牌，六主题自动换色。
   类名 pv2-* 独立作用域，仅在 .project-page-v2 下生效，不影响
   project-images.html / project-updates.html 现有样式。
   ============================================================ */
.project-page-v2 { background: var(--bg); }
.project-page-v2 .workspace,
.project-page.project-page-v2 { background: var(--bg); }

.project-page-v2 .pv2-subnav {
  display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 18px; padding: 0;
  border: none; background: none;
}
.project-page-v2 .pv2-subnav a,
.project-page-v2 .pv2-subnav button {
  font-size: 13px; font-weight: 600; color: var(--muted);
  padding: 8px 16px; border-radius: var(--radius-pill, 999px);
  background: var(--paper); box-shadow: var(--shadow-sm, 0 1px 2px rgba(0,0,0,.06));
  text-decoration: none; border: none; transition: .18s;
  flex-shrink: 0; white-space: nowrap; min-height: 0;
}
.project-page-v2 .pv2-subnav a.active,
.project-page-v2 .pv2-subnav button.active {
  background: var(--accent); color: var(--accent-contrast, #fff);
  box-shadow: 0 4px 14px color-mix(in srgb, var(--accent) 35%, transparent);
}
.project-page-v2 .pv2-subnav a:hover:not(.active),
.project-page-v2 .pv2-subnav button:hover:not(.active) {
  color: var(--accent-strong, var(--accent));
}

.project-page-v2 .pv2-layout {
  display: grid; grid-template-columns: 260px 1fr; gap: 20px; align-items: start;
}
@media (max-width: 980px) {
  .project-page-v2 .pv2-layout { grid-template-columns: 1fr; }
}

/* ── 左侧项目列表 ── */
.project-page-v2 .pv2-list-panel {
  background: var(--paper); border-radius: var(--radius-lg, 16px);
  padding: 16px; box-shadow: var(--shadow); border: var(--card-border, 1px solid var(--line));
  position: sticky; top: 16px;
}
.project-page-v2 .pv2-panel-head {
  display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px;
}
.project-page-v2 .pv2-panel-title {
  font-size: 14px; font-weight: 700; color: var(--ink);
}
.project-page-v2 .pv2-search {
  width: 100%; box-sizing: border-box; margin-bottom: 12px; padding: 9px 12px;
  font-size: 13px; border-radius: 10px; border: 1px solid transparent;
  background: var(--bg); color: var(--ink);
  box-shadow: inset 0 0 0 1px var(--line);
}
.project-page-v2 .pv2-search:focus { outline: none; border-color: var(--accent); }
.project-page-v2 .pv2-list {
  display: flex; flex-direction: column; gap: 8px; max-height: 62vh; overflow-y: auto; padding-right: 2px;
}
.project-page-v2 .pv2-list .project-list-item,
.project-page-v2 .pv2-list .workflow-list-item {
  display: flex; flex-direction: column; gap: 3px; text-align: left;
  padding: 11px 13px; border-radius: 12px; border: none; cursor: pointer;
  background: var(--bg); box-shadow: var(--shadow-sm, 0 1px 2px rgba(0,0,0,.05));
  border-left: 3px solid transparent; transition: .18s;
  flex-shrink: 0;
}
.project-page-v2 .pv2-list .project-list-item:hover,
.project-page-v2 .pv2-list .workflow-list-item:hover {
  transform: translateY(-1px); box-shadow: var(--shadow);
}
.project-page-v2 .pv2-list .project-list-item.active,
.project-page-v2 .pv2-list .workflow-list-item.active {
  border-left-color: var(--accent); background: var(--paper); box-shadow: var(--shadow);
}
.project-page-v2 .pv2-list .project-list-item.disabled,
.project-page-v2 .pv2-list .workflow-list-item.disabled {
  opacity: .5;
}
.project-page-v2 .pv2-list .project-list-item strong,
.project-page-v2 .pv2-list .workflow-list-item strong {
  font-size: 13.5px; font-weight: 700; color: var(--ink);
}
.project-page-v2 .pv2-list .project-list-item span,
.project-page-v2 .pv2-list .workflow-list-item span {
  font-size: 11.5px; color: var(--accent-strong, var(--accent));
}
.project-page-v2 .pv2-list .project-list-item small,
.project-page-v2 .pv2-list .workflow-list-item small {
  font-size: 11px; color: var(--muted);
}
.project-page-v2 .pv2-list .empty-note { font-size: 12.5px; color: var(--muted); padding: 8px 2px; }

/* ── 营销工作流 v2:结果面板 + 步骤编辑器 + Skill 列表,复用 pv2 卡片语言 ── */
.project-page-v2 .workflow-result-box,
.project-page-v2 .workflow-run-form {
  background: var(--paper); border-radius: var(--radius-lg, 16px);
  padding: 18px 20px; box-shadow: var(--shadow); border: none;
}
.project-page-v2 .workflow-result {
  background: var(--bg); border-radius: 10px; padding: 14px 16px;
  box-shadow: inset 0 0 0 1px var(--line); color: var(--ink); line-height: 1.75;
}
.project-page-v2 .workflow-step-editor,
.project-page-v2 .workflow-editor-section {
  background: var(--bg); border-radius: 12px; padding: 14px 16px;
  box-shadow: inset 0 0 0 1px var(--line); margin-top: 10px;
}
.project-page-v2 .workflow-skill-list .workflow-skill-item,
.project-page-v2 .workflow-skill-list > * {
  background: var(--bg); border-radius: 10px; box-shadow: inset 0 0 0 1px var(--line);
}

/* ── 通用胶囊按钮(沿用主题 accent) ── */
.project-page-v2 .pv2-pill-btn {
  border: none; border-radius: var(--radius-pill, 999px); font-size: 13px; font-weight: 600;
  padding: 8px 16px; cursor: pointer; white-space: nowrap;
  background: var(--accent); color: var(--accent-contrast, #fff);
  box-shadow: 0 4px 12px color-mix(in srgb, var(--accent) 30%, transparent);
}
.project-page-v2 .pv2-pill-btn:hover { filter: brightness(1.04); }
.project-page-v2 .pv2-pill-ghost {
  background: var(--bg); color: var(--ink); box-shadow: var(--shadow-sm, 0 1px 2px rgba(0,0,0,.05));
}
.project-page-v2 .pv2-pill-danger {
  background: color-mix(in srgb, var(--warn, #c4453b) 12%, var(--bg));
  color: var(--warn, #c4453b); box-shadow: none;
}

/* ── 右侧主区块通用卡片 ── */
.project-page-v2 .pv2-editor-panel { display: flex; flex-direction: column; gap: 18px; }
.project-page-v2 .pv2-import-bar,
.project-page-v2 .pv2-summary-editor,
.project-page-v2 .pv2-context-box {
  background: var(--paper); border-radius: var(--radius-lg, 16px);
  padding: 18px 20px; box-shadow: var(--shadow); border: var(--card-border, 1px solid var(--line));
}
.project-page-v2 .pv2-card-title { display: block; font-size: 14px; font-weight: 700; color: var(--ink); }
.project-page-v2 .pv2-card-hint { display: block; font-size: 11.5px; color: var(--muted); margin-top: 2px; }

/* 上传资料条:紧凑工具栏 */
.project-page-v2 .pv2-import-head {
  display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 12px;
}
.project-page-v2 .pv2-import-grid {
  display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 10px; margin-bottom: 8px;
}
.project-page-v2 .pv2-import-grid .pv2-wide { grid-column: 1 / -1; }
@media (max-width: 860px) {
  .project-page-v2 .pv2-import-grid { grid-template-columns: 1fr 1fr; }
}

/* 整理后资料:分组小标题 + 分隔线 */
.project-page-v2 .pv2-summary-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 16px;
  flex-wrap: wrap;
}
.project-page-v2 .pv2-summary-acts { flex-shrink: 0; }
.project-page-v2 .pv2-group-label {
  display: flex; align-items: center; gap: 10px; margin: 18px 0 10px;
}
.project-page-v2 .pv2-group-label:first-of-type { margin-top: 0; }
.project-page-v2 .pv2-group-label span {
  font-size: 11.5px; font-weight: 700; letter-spacing: 1.5px; color: var(--accent-strong, var(--accent));
  white-space: nowrap;
}
.project-page-v2 .pv2-group-label i {
  flex: 1; height: 1px; background: var(--line); font-style: normal;
}
.project-page-v2 .pv2-form-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px 12px;
}
@media (max-width: 860px) {
  .project-page-v2 .pv2-form-grid { grid-template-columns: 1fr 1fr; }
}
.project-page-v2 .pv2-form-grid label,
.project-page-v2 .pv2-solo {
  display: flex; flex-direction: column; gap: 5px; font-size: 12px; color: var(--muted);
}
.project-page-v2 .pv2-solo { margin: 10px 0 0; }
.project-page-v2 .pv2-solo-textarea { margin-top: 0; }
.project-page-v2 .pv2-form-grid input,
.project-page-v2 .pv2-form-grid select,
.project-page-v2 .pv2-solo input,
.project-page-v2 .pv2-import-grid input,
.project-page-v2 .pv2-import-grid select {
  font-size: 13px; padding: 8px 10px; border-radius: 9px; border: 1px solid transparent;
  background: var(--bg); color: var(--ink); box-shadow: inset 0 0 0 1px var(--line);
}
.project-page-v2 .pv2-solo-textarea textarea {
  font-size: 13px; line-height: 1.75; padding: 12px 13px; border-radius: 10px; border: 1px solid transparent;
  background: var(--bg); color: var(--ink); box-shadow: inset 0 0 0 1px var(--line);
  resize: vertical; font-family: inherit;
}
.project-page-v2 input:focus,
.project-page-v2 select:focus,
.project-page-v2 textarea:focus {
  outline: none; box-shadow: inset 0 0 0 1.5px var(--accent);
}

/* 上下文预览:引用块质感 */
.project-page-v2 .pv2-context-box pre {
  margin: 12px 0 0; padding: 14px 16px; border-radius: 10px;
  background: var(--bg); box-shadow: inset 0 0 0 1px var(--line);
  color: var(--ink); font-size: 12px; line-height: 1.7; white-space: pre-wrap; word-break: break-word;
  font-family: "SFMono-Regular", Consolas, monospace;
}

.project-page-v2 .project-permission-note {
  background: var(--soft); color: var(--ink); border-radius: 10px; padding: 10px 14px; font-size: 12.5px;
}
.project-page-v2 .project-permission-note:empty { display: none; }

/* ── 图片资料库 v2:图片卡片 + 待上传预览网格,复用 pv2 卡片语言 ── */
.project-page-v2 .pv2-image-grid { gap: 16px; }
.project-page-v2 .project-image-card {
  background: var(--bg); border: none; border-radius: 12px; padding: 10px;
  box-shadow: inset 0 0 0 1px var(--line);
}
.project-page-v2 .project-image-preview,
.project-page-v2 .project-image-pending-item img {
  border: none; border-radius: 9px;
}
.project-page-v2 .project-image-pending-item {
  background: var(--bg); border: none; border-radius: 10px;
  box-shadow: inset 0 0 0 1px var(--line);
}
.project-page-v2 .project-image-body input,
.project-page-v2 .project-image-body textarea {
  font-size: 12px; padding: 7px 9px; border-radius: 8px; border: 1px solid transparent;
  background: var(--paper); color: var(--ink); box-shadow: inset 0 0 0 1px var(--line);
}
.project-page-v2 .project-pagination {
  margin-top: 14px;
}
.project-page-v2 .project-pagination button {
  background: var(--paper); color: var(--ink); border: none; border-radius: var(--radius-pill, 999px);
  box-shadow: var(--shadow-sm, 0 1px 2px rgba(0,0,0,.05));
}

/* ── 更新记录 v2:时间线条目卡片 ── */
.project-page-v2 .project-updates-list { gap: 10px; }
.project-page-v2 .project-update-item {
  background: var(--paper); border-radius: 12px; padding: 12px 16px;
  box-shadow: var(--shadow-sm, 0 1px 2px rgba(0,0,0,.05)); border: none;
}

/* ============================================================
   登录页 v2 — 品牌面板用主题 accent 渐变(替换硬编码深蓝),
   卡片/按钮/验证码/分段控件统一用 pv2 软拟态语言,全部基于令牌。
   ============================================================ */
.login-page-v2.login-page { background: var(--bg); }
.login-page-v2.login-page::before { display: none; }
.login-page-v2 .login-card {
  border: none; border-radius: var(--radius-lg, 20px);
  box-shadow: var(--shadow-md, 0 22px 50px rgba(37,42,47,.14));
  background: var(--paper);
}
.login-page-v2 .login-card .brand {
  background: linear-gradient(150deg, var(--accent-strong, var(--accent)), var(--accent));
  color: var(--accent-contrast, #fff);
}
.login-page-v2 .login-card .brand h1,
.login-page-v2 .login-card .brand p {
  color: var(--accent-contrast, #fff);
}
.login-page-v2 .login-card .brand p { opacity: 0.82; }
.login-page-v2 .lv2-eyebrow {
  display: flex; align-items: center; gap: 8px; margin: 0 0 4px;
  font-size: 11.5px; letter-spacing: 3px; opacity: 0.85; font-weight: 600;
}
.login-page-v2 .lv2-eyebrow i { width: 18px; height: 2px; background: currentColor; display: inline-block; opacity: 0.7; }
.login-page-v2 .login-card .brand-mark {
  background: color-mix(in srgb, var(--accent-contrast, #fff) 20%, transparent);
  box-shadow: none; color: var(--accent-contrast, #fff);
}
.login-page-v2 .segmented.login-mode-tabs {
  background: var(--bg); border-radius: var(--radius-pill, 999px); padding: 4px; gap: 2px;
  box-shadow: inset 0 0 0 1px var(--line);
}
.login-page-v2 .segmented.login-mode-tabs button {
  border-radius: var(--radius-pill, 999px); border: none; background: transparent;
  color: var(--muted); font-weight: 600; transition: .18s;
}
.login-page-v2 .segmented.login-mode-tabs button.active {
  background: var(--accent); color: var(--accent-contrast, #fff);
  box-shadow: 0 3px 10px color-mix(in srgb, var(--accent) 35%, transparent);
}
.login-page-v2 .login-card input {
  background: var(--bg); border: 1px solid transparent; border-radius: 10px;
  box-shadow: inset 0 0 0 1px var(--line); color: var(--ink);
}
.login-page-v2 .login-card input:focus {
  outline: none; box-shadow: inset 0 0 0 1.5px var(--accent);
}
.login-page-v2 .login-captcha-question {
  background: var(--bg); border: none; box-shadow: inset 0 0 0 1px var(--line);
  color: var(--accent-strong, var(--accent));
}
.login-page-v2 .login-card .ghost,
.login-page-v2 .login-card button:not(.primary):not(.active) {
  background: var(--bg); border: none; box-shadow: inset 0 0 0 1px var(--line);
  color: var(--ink); border-radius: var(--radius-pill, 999px);
}
.login-page-v2 .login-actions .primary {
  border: none; border-radius: var(--radius-pill, 999px); background: var(--accent);
  color: var(--accent-contrast, #fff); font-weight: 700;
  box-shadow: 0 6px 20px color-mix(in srgb, var(--accent) 30%, transparent);
}
.login-page-v2 .login-actions .primary:hover { filter: brightness(1.05); }
.login-page-v2 .login-links a { color: var(--accent-strong, var(--accent)); }

/* ============================================================
   生图工作台 v2 — 纯样式精修(DOM 结构不动,id 全部保留),
   卡片/按钮/输入框统一软拟态语言,去掉旧对角装饰。
   ============================================================ */
.image-page.image-page-v2::before { display: none; }
.image-page.image-page-v2 .workspace { background: var(--bg); }

.image-page-v2 .panel,
.image-page-v2 .controls,
.image-page-v2 .result-area,
.image-page-v2 .agent-chat {
  background: var(--paper); border: none; border-radius: var(--radius-lg, 16px);
  box-shadow: var(--shadow);
}
.image-page-v2 .account-panel {
  background: var(--bg); border: none; border-radius: 12px;
  box-shadow: inset 0 0 0 1px var(--line);
}

.image-page-v2 .segmented {
  background: var(--bg); border-radius: var(--radius-pill, 999px); padding: 4px; gap: 2px;
  box-shadow: inset 0 0 0 1px var(--line); display: inline-flex; border: none;
}
.image-page-v2 .segmented button {
  border-radius: var(--radius-pill, 999px); border: none; background: transparent;
  color: var(--muted); font-weight: 600; transition: .18s;
}
.image-page-v2 .segmented button.active {
  background: var(--accent); color: var(--accent-contrast, #fff);
  box-shadow: 0 3px 10px color-mix(in srgb, var(--accent) 35%, transparent);
}

.image-page-v2 input,
.image-page-v2 select,
.image-page-v2 textarea {
  background: var(--bg); border: 1px solid transparent; border-radius: 9px;
  box-shadow: inset 0 0 0 1px var(--line); color: var(--ink);
}
.image-page-v2 input:focus,
.image-page-v2 select:focus,
.image-page-v2 textarea:focus {
  outline: none; box-shadow: inset 0 0 0 1.5px var(--accent);
}
.image-page-v2 input[type="range"] { background: none; box-shadow: none; }
.image-page-v2 input[type="file"] { box-shadow: none; background: none; border: 1px dashed var(--line); }

.image-page-v2 button.primary,
.image-page-v2 button.primary.big {
  background: var(--accent); color: var(--accent-contrast, #fff); border: none;
  border-radius: var(--radius-pill, 999px); font-weight: 700;
  box-shadow: 0 6px 20px color-mix(in srgb, var(--accent) 30%, transparent);
}
.image-page-v2 button.primary:hover { filter: brightness(1.05); }
.image-page-v2 button.danger {
  background: color-mix(in srgb, var(--warn, #c4453b) 12%, var(--paper));
  color: var(--warn, #c4453b); border: none; border-radius: var(--radius-pill, 999px);
}
.image-page-v2 .controls button:not(.primary):not(.danger):not(.segmented button):not(.active),
.image-page-v2 .result-area button:not(.primary):not(.danger):not(.segmented button):not(.active),
.image-page-v2 .upload-actions button,
.image-page-v2 .prompt-tool-actions button,
.image-page-v2 .prompt-library-button,
.image-page-v2 .prompt-clear-button,
.image-page-v2 .prompt-favorite-button {
  background: var(--bg); color: var(--ink); border: none; border-radius: var(--radius-pill, 999px);
  box-shadow: inset 0 0 0 1px var(--line);
}

.image-page-v2 .prompt-samples button {
  background: var(--bg); border: none; border-radius: 999px; color: var(--accent-strong, var(--accent));
  box-shadow: inset 0 0 0 1px var(--line);
}

.image-page-v2 .uploaded-image-grid > * {
  border-radius: 10px; overflow: hidden; box-shadow: inset 0 0 0 1px var(--line);
}

.image-page-v2 .preview-box {
  background: var(--bg); border-radius: 12px; box-shadow: inset 0 0 0 1px var(--line);
}

.image-page-v2 .history-item {
  background: var(--bg); border: none; border-radius: 12px;
  box-shadow: inset 0 0 0 1px var(--line);
}

.image-page-v2 #statusBadge {
  background: var(--soft); color: var(--accent-strong, var(--accent));
  border-radius: 999px; padding: 4px 12px; font-size: 12px; font-weight: 700;
}

.image-page-v2 dialog,
.image-page-v2 .settings-dialog,
.image-page-v2 .mask-dialog,
.image-page-v2 .image-viewer,
.image-page-v2 .prompt-library-dialog {
  border: none; border-radius: var(--radius-lg, 16px);
  background: var(--paper); color: var(--ink);
  box-shadow: 0 24px 64px rgba(0,0,0,.2);
}
.image-page-v2 dialog::backdrop { background: rgba(10,10,10,.45); }
.image-page-v2 .prompt-library-tabs.segmented,
.image-page-v2 .prompt-library-tabs { background: var(--bg); box-shadow: inset 0 0 0 1px var(--line); }

/* ── 营销工作流 v2:workflow-page 去旧对角装饰;editor-panel 直接作为卡片(内部字段非独立盒) ── */
.workflow-page.workflow-page-v2::before { display: none; }
.workflow-page.workflow-page-v2 .workflow-shell { background: transparent; }
.project-page-v2 .workflow-editor-panel {
  background: var(--paper); border-radius: var(--radius-lg, 16px);
  padding: 18px 20px; box-shadow: var(--shadow); border: none;
  display: flex; flex-direction: column; gap: 4px;
}
.project-page-v2 .workflow-editor-section h4 { display: none; }
/* Skill 页 DOM 顺序是"表单在前、列表在后",视觉上改用 order 让列表回到左侧窄列(跟其它两个 tab 一致),不动 DOM/JS */
.project-page-v2 .workflow-skill-layout .workflow-list-panel { order: 1; }
.project-page-v2 .workflow-skill-layout .workflow-editor-panel { order: 2; }

/* ============================================================
   记忆智能体 v2 — 纯样式精修(DOM 结构不动,id 全部保留),
   三栏软拟态卡片 + 气泡/按钮统一主题色,去掉旧对角装饰。
   ============================================================ */
.memory-page.memory-page-v2::before { display: none; }
.memory-page.memory-page-v2 .memory-shell { background: var(--bg); }

.memory-page-v2 .memory-side,
.memory-page-v2 .memory-main,
.memory-page-v2 .memory-panel {
  background: var(--paper); border: none; border-radius: var(--radius-lg, 16px);
  box-shadow: var(--shadow);
}

.memory-page-v2 .memory-project-picker {
  border: none; background: var(--bg); box-shadow: inset 0 0 0 1px var(--line);
  border-radius: 12px;
}

.memory-page-v2 .memory-meta {
  border: none; background: var(--bg); box-shadow: inset 0 0 0 1px var(--line);
  border-radius: 10px;
}

.memory-page-v2 .memory-agent-item {
  border: none; background: var(--bg); border-radius: 10px;
  box-shadow: inset 0 0 0 1px var(--line);
}
.memory-page-v2 .memory-agent-item.active {
  background: var(--soft); box-shadow: inset 0 0 0 1.5px var(--accent);
}
.memory-page-v2 .memory-agent-item.active .memory-agent-name { color: var(--accent-strong, var(--accent)); }

.memory-page-v2 .memory-conversation {
  border-radius: 10px;
}
.memory-page-v2 .memory-conversation.active {
  background: var(--soft); box-shadow: inset 0 0 0 1.5px var(--accent);
}

.memory-page-v2 .memory-message {
  border: none; border-radius: 12px; background: var(--bg);
  box-shadow: inset 0 0 0 1px var(--line);
}
.memory-page-v2 .memory-message.user {
  background: color-mix(in srgb, var(--accent) 12%, var(--paper));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 35%, transparent);
}

.memory-page-v2 .memory-input-bar textarea {
  background: var(--bg); border: 1px solid transparent; border-radius: 12px;
  box-shadow: inset 0 0 0 1px var(--line); color: var(--ink);
}
.memory-page-v2 .memory-input-bar textarea:focus {
  outline: none; box-shadow: inset 0 0 0 1.5px var(--accent);
}

.memory-page-v2 .memory-send-button {
  border: none; background: var(--accent); box-shadow: 0 6px 18px color-mix(in srgb, var(--accent) 35%, transparent);
}
.memory-page-v2 .memory-send-button:hover { background: var(--accent-strong, var(--accent)); border-color: transparent; }
.memory-page-v2 .memory-send-button::before { border-color: var(--accent-contrast, #fff); }
.memory-page-v2 .memory-send-button::after { background: var(--accent-contrast, #fff); }
.memory-page-v2 .memory-send-button.is-stopping {
  background: var(--bg); box-shadow: inset 0 0 0 1px var(--line);
}
.memory-page-v2 .memory-send-button.is-stopping::before { background: var(--ink); }

.memory-page-v2 button.primary {
  background: var(--accent); color: var(--accent-contrast, #fff); border: none;
  border-radius: var(--radius-pill, 999px); font-weight: 700;
  box-shadow: 0 6px 18px color-mix(in srgb, var(--accent) 30%, transparent);
}
.memory-page-v2 button.primary:hover { filter: brightness(1.05); }
.memory-page-v2 button.danger {
  background: color-mix(in srgb, var(--warn, #c4453b) 12%, var(--paper));
  color: var(--warn, #c4453b); border: none; border-radius: var(--radius-pill, 999px);
}
.memory-page-v2 .memory-side button:not(.primary):not(.danger):not(.memory-send-button):not(.active):not(.memory-agent-item-main):not(.memory-agent-ops button):not(.memory-conversation-edit),
.memory-page-v2 .memory-main button:not(.primary):not(.danger):not(.memory-send-button):not(.active):not(.memory-agent-item-main):not(.memory-agent-ops button):not(.memory-conversation-edit),
.memory-page-v2 .memory-panel button:not(.primary):not(.danger):not(.memory-send-button):not(.active):not(.memory-agent-item-main):not(.memory-agent-ops button):not(.memory-conversation-edit) {
  background: var(--bg); color: var(--ink); border: none; border-radius: var(--radius-pill, 999px);
  box-shadow: inset 0 0 0 1px var(--line);
}
/* 列表项内部的小图标按钮(改名/转交/删除)保持原生极简样式,不套外层胶囊卡片框 */
.memory-page-v2 .memory-agent-item-main {
  background: none; border: none; box-shadow: none; border-radius: 0;
}
.memory-page-v2 .memory-agent-ops button,
.memory-page-v2 .memory-conversation-edit {
  background: none; border: none; box-shadow: none;
}
.memory-page-v2 .memory-presets button.active {
  background: var(--accent); color: var(--accent-contrast, #fff); box-shadow: none;
}

.memory-page-v2 select,
.memory-page-v2 input:not([type="file"]):not([type="checkbox"]) {
  background: var(--bg); border: 1px solid transparent; border-radius: 9px;
  box-shadow: inset 0 0 0 1px var(--line); color: var(--ink);
}

.memory-page-v2 dialog {
  border: none; border-radius: var(--radius-lg, 16px);
  background: var(--paper); color: var(--ink);
  box-shadow: 0 24px 64px rgba(0,0,0,.2);
}
.memory-page-v2 dialog::backdrop { background: rgba(10,10,10,.45); }

.memory-page-v2 pre#memoryText {
  background: var(--bg); border-radius: 10px; padding: 12px 14px;
  box-shadow: inset 0 0 0 1px var(--line); color: var(--ink);
}

/* ============================================================
   个人中心 v2 — 纯样式精修(DOM 结构不动,id 全部保留),
   卡片/子栏目/按钮/输入框统一软拟态语言,去掉旧对角装饰。
   profile-* 类只在本页使用,可直接原地覆盖不需要额外作用域,
   仍加 profile-page-v2 便于统一管理与关闭旧装饰。
   注意选择器顺序:通用 button 兜底规则必须写在前面,
   子栏目/激活态等更具体状态放后面,避免同优先级下被兜底规则覆盖。
   ============================================================ */
.profile-page.profile-page-v2::before { display: none; }
.profile-page.profile-page-v2 .profile-shell { background: var(--bg); }

.profile-page-v2 .profile-card {
  border: none; border-radius: var(--radius-lg, 16px); box-shadow: var(--shadow);
  background: var(--paper);
}

.profile-page-v2 input:not([type="checkbox"]),
.profile-page-v2 select,
.profile-page-v2 textarea {
  background: var(--bg); border: 1px solid transparent; border-radius: 9px;
  box-shadow: inset 0 0 0 1px var(--line); color: var(--ink);
}
.profile-page-v2 input:focus,
.profile-page-v2 select:focus,
.profile-page-v2 textarea:focus {
  outline: none; box-shadow: inset 0 0 0 1.5px var(--accent);
}

.profile-page-v2 button.primary {
  background: var(--accent); color: var(--accent-contrast, #fff); border: none;
  border-radius: var(--radius-pill, 999px); font-weight: 700;
  box-shadow: 0 6px 18px color-mix(in srgb, var(--accent) 30%, transparent);
}
.profile-page-v2 button.primary:hover { filter: brightness(1.05); }
.profile-page-v2 button:not(.primary):not(.theme-card):not(.segmented button):not(.active) {
  background: var(--bg); color: var(--ink); border: none; border-radius: var(--radius-pill, 999px);
  box-shadow: inset 0 0 0 1px var(--line);
}
.profile-page-v2 .segmented button.active {
  background: var(--accent); color: var(--accent-contrast, #fff); box-shadow: none;
}

/* 以下是更具体的状态覆盖,必须排在通用 button 兜底规则之后 */
.profile-page-v2 .profile-subnav button {
  background: var(--paper); box-shadow: var(--shadow-sm, 0 1px 2px rgba(0,0,0,.05)); color: var(--muted); font-weight: 600;
}
.profile-page-v2 .profile-subnav button.active {
  background: var(--accent); color: var(--accent-contrast, #fff);
  box-shadow: 0 4px 14px color-mix(in srgb, var(--accent) 35%, transparent);
}
.profile-page-v2 .profile-prompt-category-list button.active,
.profile-page-v2 .profile-prompt-item.active button,
.profile-page-v2 .profile-bot-item.active button {
  background: var(--soft); box-shadow: inset 0 0 0 1.5px var(--accent); color: var(--accent-strong, var(--accent));
}

.profile-page-v2 #profileRoleBadge {
  background: var(--soft); color: var(--accent-strong, var(--accent));
}

.profile-page-v2 .profile-bar-track { background: var(--bg); box-shadow: inset 0 0 0 1px var(--line); }
.profile-page-v2 .profile-list-item { border-bottom-color: var(--line); }

.profile-page-v2 dialog {
  border: none; border-radius: var(--radius-lg, 16px);
  background: var(--paper); color: var(--ink);
  box-shadow: 0 24px 64px rgba(0,0,0,.2);
}
.profile-page-v2 dialog::backdrop { background: rgba(10,10,10,.45); }

/* ============================================================
   黑金奢华 (gold) — 曜石黑底 + 香槟金点缀，高端盘售楼处气质。
   深色主题：结构参照暗夜绿茵(xai)，含基础变量与深色兜底两部分。
   ============================================================ */
html[data-theme="gold"] {
  color-scheme: dark;
  --bg: #0b0b0d;
  --paper: #141417;
  --ink: #ece9e0;
  --muted: #9b968a;
  --line: rgba(214, 205, 182, 0.13);
  --accent: #d4af37;
  --accent-strong: #e6c860;
  --accent2: #b08d57;
  --gold: #d4af37;
  --warn: #e05747;
  --soft: rgba(212, 175, 55, 0.1);
  --shadow: 0 24px 64px rgba(0, 0, 0, 0.6);
  --shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.45);
  --shadow-md: 0 14px 36px rgba(0, 0, 0, 0.55);
  --accent-contrast: #1a1503;
  --radius: 12px;
  --radius-lg: 16px;
}
html[data-theme="gold"] body {
  background:
    radial-gradient(900px 480px at 14% -12%, rgba(212, 175, 55, 0.07), transparent 60%),
    radial-gradient(860px 460px at 88% -10%, rgba(176, 141, 87, 0.05), transparent 58%),
    radial-gradient(1200px 720px at 50% 118%, rgba(212, 175, 55, 0.045), transparent 62%),
    #0b0b0d;
  background-attachment: fixed;
  color: var(--ink);
  position: relative;
}
/* 顶部一条极细金线：售楼处水牌质感 */
html[data-theme="gold"] body::after {
  content: ""; position: fixed; top: 0; left: 0; right: 0; z-index: 2000; pointer-events: none;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(212, 175, 55, 0.75) 18% 82%, transparent);
}
html[data-theme="gold"] .topbar,
html[data-theme="gold"] .admin-header,
html[data-theme="gold"] .profile-card,
html[data-theme="gold"] .demo-card,
html[data-theme="gold"] .stat-card,
html[data-theme="gold"] .glass-card {
  background: linear-gradient(180deg, #18181c, #121215);
  border: 1px solid rgba(214, 205, 182, 0.14);
  border-radius: var(--radius-lg);
  box-shadow: inset 0 1px 0 rgba(236, 233, 224, 0.05), var(--shadow);
  transition: border-color 0.22s, transform 0.22s;
}
html[data-theme="gold"] .demo-card:hover,
html[data-theme="gold"] .stat-card:hover {
  border-color: rgba(212, 175, 55, 0.45);
  transform: translateY(-2px);
}
html[data-theme="gold"] h1,
html[data-theme="gold"] h2 {
  color: #f6f2e8;
  letter-spacing: 0.5px;
  font-weight: 800;
}
html[data-theme="gold"] h3 {
  color: var(--ink);
  letter-spacing: 0.3px;
}
html[data-theme="gold"] .btn-accent,
html[data-theme="gold"] button.primary {
  background: linear-gradient(180deg, #e6c860, #d4af37);
  color: var(--accent-contrast);
  border: 1px solid rgba(212, 175, 55, 0.7);
  border-radius: 99px;
  font-weight: 700;
  letter-spacing: 0.5px;
  box-shadow: 0 6px 26px rgba(212, 175, 55, 0.28);
  transition: 0.22s;
}
html[data-theme="gold"] .btn-accent:hover,
html[data-theme="gold"] button.primary:hover {
  filter: brightness(1.07);
  transform: translateY(-1px);
}
html[data-theme="gold"] .nav-button,
html[data-theme="gold"] button {
  background: transparent;
  border: 1px solid rgba(214, 205, 182, 0.22);
  color: var(--ink);
  border-radius: 99px;
  transition: 0.22s;
}
html[data-theme="gold"] .nav-button:hover,
html[data-theme="gold"] button:hover {
  border-color: var(--accent);
  color: var(--accent-strong);
  background: rgba(212, 175, 55, 0.07);
  transform: translateY(-1px);
}
html[data-theme="gold"] input,
html[data-theme="gold"] select,
html[data-theme="gold"] textarea {
  background: #101013;
  border: 1px solid rgba(214, 205, 182, 0.18);
  color: var(--ink);
}
html[data-theme="gold"] input:focus,
html[data-theme="gold"] select:focus,
html[data-theme="gold"] textarea:focus {
  border-color: rgba(212, 175, 55, 0.6);
  outline: none;
  box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.13);
}
html[data-theme="gold"] th {
  background: #17171b;
  color: var(--muted);
  border-color: rgba(214, 205, 182, 0.12);
  letter-spacing: 1px;
  font-size: 12px;
  text-transform: uppercase;
}
html[data-theme="gold"] td {
  border-color: rgba(214, 205, 182, 0.09);
  color: var(--ink);
}
html[data-theme="gold"] .chip,
html[data-theme="gold"] .theme-card-tag {
  background: #17171b;
  border: 1px solid rgba(214, 205, 182, 0.16);
  border-radius: 99px;
  color: var(--muted);
}
html[data-theme="gold"] a {
  color: var(--accent-strong);
}
html[data-theme="gold"] a:hover {
  color: #f2dc8e;
}
html[data-theme="gold"] .code-panel {
  background: #0e0e11;
  border: 1px solid rgba(214, 205, 182, 0.14);
  border-radius: var(--radius);
  color: #d8d3c6;
  font-family: "SFMono-Regular", Consolas, monospace;
}
html[data-theme="gold"] .theme-card {
  background: #101013;
  border-color: rgba(214, 205, 182, 0.14);
}
html[data-theme="gold"] .theme-card.active {
  border-color: var(--accent);
  box-shadow: 0 0 0 2px rgba(212, 175, 55, 0.35), 0 6px 24px rgba(212, 175, 55, 0.14);
}
html[data-theme="gold"] .stat-card b,
html[data-theme="gold"] .stat-card strong {
  color: var(--accent);
}
html[data-theme="gold"] .hub-hero .hub-hero-title,
html[data-theme="gold"] .topbar-title {
  letter-spacing: 1px;
}

/* ── 黑金深色兜底：把各页面残留浅色压成深色曜石面，保证全站可读 ── */
html[data-theme="gold"] .app-shell {
  background: var(--bg);
}
html[data-theme="gold"] .workspace,
html[data-theme="gold"] .home-shell .workspace {
  background:
    radial-gradient(900px 480px at 14% -12%, rgba(212, 175, 55, 0.07), transparent 60%),
    radial-gradient(860px 460px at 88% -10%, rgba(176, 141, 87, 0.05), transparent 58%),
    radial-gradient(1200px 720px at 50% 118%, rgba(212, 175, 55, 0.045), transparent 62%),
    var(--bg);
}
html[data-theme="gold"] .home-shell .topbar,
html[data-theme="gold"] .topbar,
html[data-theme="gold"] .admin-header {
  background: rgba(20, 20, 23, 0.74);
  border: 1px solid rgba(214, 205, 182, 0.13);
  backdrop-filter: blur(10px);
}
html[data-theme="gold"] .hub-hero,
html[data-theme="gold"] .home-bento .hub-hero,
html[data-theme="gold"] .hub-status,
html[data-theme="gold"] .hub-announcement,
html[data-theme="gold"] .project-permission-note,
html[data-theme="gold"] .memory-project-picker,
html[data-theme="gold"] .memory-meta,
html[data-theme="gold"] [class*="-card"],
html[data-theme="gold"] [class*="-cell"],
html[data-theme="gold"] [class*="-tile"],
html[data-theme="gold"] [class*="-panel"],
html[data-theme="gold"] [class*="-box"],
html[data-theme="gold"] [class*="-module"],
html[data-theme="gold"] [class*="-bento"],
html[data-theme="gold"] [class*="-note"],
html[data-theme="gold"] [class*="-picker"],
html[data-theme="gold"] [class*="-summary"],
html[data-theme="gold"] [class*="-banner"],
html[data-theme="gold"] [class*="-notice"],
html[data-theme="gold"] [class*="-intro"],
html[data-theme="gold"] [class*="-editor"] {
  background: rgba(22, 22, 26, 0.62);
  border-color: rgba(214, 205, 182, 0.13);
  box-shadow: none;
}
html[data-theme="gold"] .project-permission-note,
html[data-theme="gold"] .memory-project-picker,
html[data-theme="gold"] [class*="-note"],
html[data-theme="gold"] [class*="-banner"],
html[data-theme="gold"] [class*="-notice"],
html[data-theme="gold"] [class*="-summary"] {
  color: var(--ink);
}
html[data-theme="gold"] .home-bento .hub-hero {
  background:
    radial-gradient(620px 320px at 24% 38%, rgba(212, 175, 55, 0.24), transparent 62%),
    radial-gradient(540px 300px at 74% 64%, rgba(176, 141, 87, 0.18), transparent 60%),
    linear-gradient(180deg, rgba(24, 24, 28, 0.86), rgba(18, 18, 21, 0.86));
}
html[data-theme="gold"] .hub-hero h1,
html[data-theme="gold"] .hub-hero p,
html[data-theme="gold"] .hub-hero h2 {
  color: var(--ink);
}
html[data-theme="gold"] [class*="-chip"],
html[data-theme="gold"] [class*="-tag"],
html[data-theme="gold"] [class*="-badge"] {
  background: #17171b;
  color: var(--muted);
  border-color: rgba(214, 205, 182, 0.16);
}
html[data-theme="gold"] .module-card.active,
html[data-theme="gold"] .profile-subnav button.active,
html[data-theme="gold"] .profile-prompt-category-list button.active,
html[data-theme="gold"] .profile-prompt-item.active button,
html[data-theme="gold"] .project-subnav a.active,
html[data-theme="gold"] .project-list-item.active,
html[data-theme="gold"] .segmented button.active,
html[data-theme="gold"] .memory-conversation.active,
html[data-theme="gold"] .workflow-list-item.active,
html[data-theme="gold"] .workflow-subnav button.active,
html[data-theme="gold"] .workflow-skill-feedback-actions button.active,
html[data-theme="gold"] .admin-tab.active,
html[data-theme="gold"] [aria-selected="true"] {
  background: color-mix(in srgb, var(--accent) 18%, transparent);
  color: #fff7df;
  border-color: color-mix(in srgb, var(--accent) 55%, transparent);
}
html[data-theme="gold"] .workflow-strip,
html[data-theme="gold"] .home-bento .workflow-strip,
html[data-theme="gold"] .workflow-strip div,
html[data-theme="gold"] .home-bento .workflow-strip div {
  background: rgba(22, 22, 26, 0.62);
  border: 1px solid rgba(214, 205, 182, 0.13);
}
html[data-theme="gold"] .workflow-strip strong {
  color: #f6f2e8;
}


/* 文案局部改写：选中一句 → AI 只改这一句 → diff 接受/丢弃 */
.workflow-rewrite-panel {
  margin: 10px 0;
  padding: 12px;
  border: 1px solid var(--line, #d8c4ad);
  border-radius: 8px;
  background: var(--card-bg, #fff);
  box-shadow: 0 5px 16px rgba(22, 30, 38, 0.05);
  color: var(--text, #2f3439);
  font-size: 12px;
}
.workflow-rewrite-text {
  width: 100%;
  margin-top: 9px;
  padding: 9px 10px;
  border: 1px solid var(--line, #d8c4ad);
  border-radius: 6px;
  background: var(--input-bg, #fffdf9);
  color: var(--text, #2f3439);
  font-size: 13px;
  line-height: 1.75;
  font-family: inherit;
  resize: vertical;
}
.workflow-rewrite-sel {
  margin-top: 6px;
  padding: 5px 8px;
  border-radius: 5px;
  background: var(--bg2, #f6f2ea);
  color: var(--muted, #7d858c);
  font-size: 11px;
  line-height: 1.5;
  word-break: break-all;
}
.workflow-rewrite-diff {
  margin-top: 10px;
  padding: 10px;
  border: 1px dashed var(--line, #d8c4ad);
  border-radius: 6px;
  background: var(--bg2, #faf7f1);
}
.workflow-rewrite-diff-row {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 8px;
  align-items: start;
  line-height: 1.7;
  font-size: 13px;
}
.workflow-rewrite-diff-row + .workflow-rewrite-diff-row { margin-top: 6px; }
.workflow-rewrite-diff-tag {
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 700;
  text-align: center;
  white-space: nowrap;
}
.workflow-rewrite-diff-tag.is-old { background: rgba(192, 57, 43, 0.12); color: #b0392b; }
.workflow-rewrite-diff-tag.is-new { background: rgba(39, 141, 88, 0.14); color: #1f7a4a; }
.workflow-rewrite-diff del { color: #b0392b; text-decoration-color: rgba(176, 57, 43, 0.5); }
.workflow-rewrite-diff ins { color: #1f7a4a; text-decoration: none; font-weight: 600; }
.workflow-rewrite-diff-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 10px;
}
.workflow-rewrite-diff-actions button { min-height: 30px; font-size: 12px; }

/* 工作流可编辑设计稿：明确分成对象、AI指令、快捷操作三行 */
.workflow-article-revise,
.workflow-poster-panel {
  margin: 10px 0;
  padding: 12px;
  border: 1px solid var(--line, #d8c4ad);
  border-radius: 8px;
  background: var(--card-bg, #fff);
  box-shadow: 0 5px 16px rgba(22, 30, 38, 0.05);
  color: var(--text, #2f3439);
  font-size: 12px;
}
.workflow-edit-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 9px;
  border-bottom: 1px solid var(--line, #e3ddd2);
}
.workflow-edit-card-head > div { display: grid; gap: 2px; }
.workflow-edit-card-head strong { color: var(--strong, #242a30); font-size: 13px; line-height: 1.3; }
.workflow-edit-card-head span { color: var(--muted, #7d858c); font-size: 11px; line-height: 1.45; }
.workflow-edit-target-row,
.workflow-edit-command-row {
  display: grid;
  grid-template-columns: 72px minmax(180px, 1fr) minmax(150px, 190px);
  gap: 8px;
  align-items: center;
  padding-top: 9px;
}
.workflow-edit-command-row { grid-template-columns: 72px minmax(240px, 1fr) auto; }
.workflow-edit-row-label {
  color: var(--muted, #778089);
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
.workflow-edit-target-row select,
.workflow-edit-command-row input[type="text"] {
  width: 100%;
  min-width: 0;
  min-height: 32px;
  padding: 5px 9px;
  border-radius: 6px;
  font-size: 12px;
}
.workflow-edit-command-row button,
.workflow-edit-card-head > button,
.workflow-edit-tool-row button,
.workflow-edit-image-actions button,
.workflow-article-direct-actions button {
  min-height: 30px;
  padding: 0 10px;
  border-radius: 6px;
  font-size: 12px;
  white-space: nowrap;
}
.workflow-article-direct-tools,
.workflow-article-direct-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 9px; }
.workflow-edit-tool-row { padding-top: 9px; border-top: 1px dashed var(--line, #e3ddd2); }
.workflow-edit-tool-row .workflow-edit-row-label { flex: 0 0 66px; }
.workflow-edit-image-row {
  display: grid;
  grid-template-columns: 72px minmax(180px, 1fr) auto;
  gap: 8px;
  align-items: center;
  margin-top: 9px;
  padding-top: 9px;
  border-top: 1px dashed var(--line, #e3ddd2);
}
.workflow-edit-image-actions { display: flex; align-items: center; justify-content: flex-end; gap: 6px; flex-wrap: wrap; }
.workflow-article-direct-actions { padding: 7px 9px; border-left: 3px solid var(--brand, #b06a3e); background: var(--brand-soft, rgba(176,106,62,.08)); font-size: 12px; }
.workflow-article-direct-actions[hidden] { display:none; }
.workflow-revise-picked {
  display: block;
  min-width: 0;
  overflow: hidden;
  color: var(--muted, #7d858c);
  font-size: 11px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.workflow-revise-picked.is-picked { color: var(--brand, #e2725b); font-weight: 700; }
.workflow-article-revise > [data-revise-status],
.workflow-poster-panel > [data-poster-status] { display: block; min-height: 16px; margin-top: 6px; font-size: 11px; }

.article-logo-dialog { width:min(560px,calc(100vw - 28px)); font-size:12px; }
.article-logo-dialog-head { display:flex;align-items:flex-start;justify-content:space-between;gap:16px; }
.article-logo-dialog-head h4 { margin:0 0 3px;font-size:15px; }
.article-logo-dialog-head p { margin:0; }
.article-logo-dialog-head > button { width:30px;height:30px;min-height:30px;padding:0;font-size:18px; }
.article-logo-preview { min-height:104px;margin:10px 0 8px;padding:12px;display:flex;align-items:center;justify-content:center;background:var(--soft,#f4f5f6);border:1px solid var(--line,#ddd);border-radius:7px;overflow:hidden; }
.article-logo-preview img { display:block;height:auto;object-fit:contain; }
.article-logo-dialog button { min-height:30px;padding:0 10px;font-size:12px; }
.article-logo-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 10px;margin-top:10px; }
.article-logo-grid label { display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:600; }
.article-logo-grid select { width:100%;min-height:32px;padding:4px 8px;font-size:12px; }
.article-logo-size,.article-logo-color { grid-column:1/-1; }
.article-logo-color { flex-direction:row!important;align-items:center;justify-content:space-between; }
.article-logo-color input[type="color"] { width:46px;height:30px;padding:2px; }
@media (max-width:760px){
  .workflow-edit-target-row { grid-template-columns:68px minmax(0,1fr); }
  .workflow-edit-target-row select { grid-column:2; }
  .workflow-edit-command-row { grid-template-columns:68px minmax(0,1fr) auto; }
  .workflow-edit-image-row { grid-template-columns:68px minmax(0,1fr); }
  .workflow-edit-image-actions { grid-column:2; justify-content:flex-start; }
}
@media (max-width:560px){
  .workflow-edit-card-head { align-items:flex-start; }
  .workflow-edit-target-row,.workflow-edit-command-row,.workflow-edit-image-row { grid-template-columns:1fr;gap:6px; }
  .workflow-edit-target-row select { grid-column:auto; }
  .workflow-edit-command-row button { width:100%; }
  .workflow-edit-image-actions { grid-column:auto; justify-content:flex-start; }
  .workflow-edit-image-actions button { flex:1 1 auto; }
  .workflow-edit-tool-row .workflow-edit-row-label { flex-basis:100%; }
  .article-logo-grid{grid-template-columns:1fr}
  .article-logo-size,.article-logo-color{grid-column:auto}
}

/* AI 设计预览:点块选中(悬停高亮/选中描边) */
.workflow-article-preview.od-pickable [data-od-id] { cursor: pointer; transition: outline-color .12s; outline: 2px dashed transparent; outline-offset: 2px; }
.workflow-article-preview.od-pickable [data-od-id]:hover { outline-color: var(--brand, #e2725b); background-clip: padding-box; }
.workflow-article-preview.od-pickable .od-picked { outline: 3px solid var(--brand, #e2725b) !important; outline-offset: 2px; }
.workflow-article-preview .article-direct-editing { cursor:text!important;outline:3px solid #2e7d5b!important;box-shadow:0 0 0 6px rgba(46,125,91,.12); }
.workflow-article-preview .article-direct-editing:focus { outline:3px solid #2e7d5b!important; }
/* AI 设计海报面板 */
/* 海报设计稿内联预览：强隔离，防止设计稿的布局/绘制牵连整页反复回流(卡死)或深色背景溢出到页面右侧(黑屏) */
.workflow-poster-preview {
  position: relative;
  overflow: auto;
  max-width: 100%;
  max-height: min(70vh, 900px);
  contain: layout paint style;
  isolation: isolate;
  background: #fff;
}
.workflow-poster-preview * { max-width: 100%; }
.workflow-poster-preview img[data-img-slot] { cursor: pointer; transition: outline-color .12s, box-shadow .12s; outline: 3px solid transparent; outline-offset: -3px; }
.workflow-poster-preview img[data-img-slot]:hover { box-shadow: inset 0 0 0 3px rgba(46, 125, 91, .72); }
.workflow-poster-preview img.poster-image-picked { outline: 4px solid #2e7d5b !important; outline-offset: -4px; box-shadow: 0 0 0 4px rgba(46, 125, 91, .18); }
.workflow-poster-preview-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 8px 0; }
.workflow-poster-preview-bar button { min-height: 34px; }
.workflow-poster-img { max-width: 480px; width: 100%; border-radius: 10px; border: 1px solid var(--line, #ddd); display: block; margin-bottom: 8px; }
.workflow-poster-error { margin: 10px 0; padding: 12px 14px; border: 1px solid #e5a5a5; border-radius: 10px; background: rgba(200, 60, 40, 0.06); }
.workflow-poster-error strong { color: #a33a2b; }
.workflow-poster-error p { margin: 6px 0; }
.workflow-poster-error button { margin-top: 6px; }

/* Keep the operational workflow UI on a stable sans-serif stack even when a generated design preview carries its own typography. */
body.workflow-page {
  font-family: "Noto Sans CJK SC", "PingFang SC", "Segoe UI", Arial, sans-serif !important;
}
body.workflow-page button,
body.workflow-page input,
body.workflow-page select,
body.workflow-page textarea {
  font-family: inherit !important;
}

/* The workflow also carries the shared pv2-layout class. Keep its operational canvas centred instead of letting that shared two-column rule stretch across an ultrawide window. */
body.workflow-page.workflow-page-v2 .workflow-shell {
  box-sizing: content-box;
  width: calc(100% - 48px);
  max-width: 1900px;
  margin: 0 auto;
}
body.workflow-page.workflow-page-v2 .workflow-run-layout {
  grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
}
@media (max-width: 980px) {
  body.workflow-page.workflow-page-v2 .workflow-run-layout {
    grid-template-columns: 1fr;
  }
}

/* 换配图·就地生成进度徽标 */
.article-img-loading { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: rgba(20,20,24,.82); color: #fff; padding: 8px 14px; border-radius: 20px; font-size: 13px; font-weight: 600; z-index: 5; white-space: nowrap; box-shadow: 0 2px 10px rgba(0,0,0,.3); }

/* AI 生图提示词编辑弹框 */
.img-prompt-dialog { max-width: 520px; }
.img-prompt-textarea { width: 100%; box-sizing: border-box; resize: vertical; min-height: 96px; padding: 10px 12px; border: 1px solid var(--line, #d8c4ad); border-radius: 8px; font-size: 14px; line-height: 1.6; font-family: inherit; }
.img-prompt-textarea:focus { outline: none; border-color: var(--brand, #b06a3e); box-shadow: 0 0 0 2px var(--brand-soft, rgba(176,106,62,.25)); }
.img-prompt-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 14px; }
.img-prompt-actions .primary { padding: 8px 18px; }

/* 公众号底图选择 */
.footer-image-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 4px; }
.footer-image-check { display: inline-flex; align-items: center; gap: 4px; font-weight: 400; }
#workflowFooterThumb { height: 40px; border-radius: 6px; border: 1px solid var(--line, #ddd); }

/* 📱 手机预览弹框 */
.phone-preview-shell { background: #1c1c22; border-radius: 34px; padding: 14px 12px 10px; width: 399px; max-width: calc(100vw - 32px); box-shadow: 0 18px 60px rgba(0,0,0,.45); display: flex; flex-direction: column; }
.phone-preview-top { display: flex; align-items: center; justify-content: space-between; padding: 0 8px 10px; }
.phone-preview-title { color: #e8e8ee; font-size: 13px; font-weight: 600; }
.phone-preview-close { background: rgba(255,255,255,.12); border: none; color: #fff; width: 28px; height: 28px; border-radius: 50%; cursor: pointer; font-size: 14px; line-height: 1; }
.phone-preview-close:hover { background: rgba(255,255,255,.22); }
.phone-preview-frame { background: #fff; border-radius: 22px; overflow: hidden; height: min(78vh, 812px); }
.phone-preview-iframe { width: 375px; max-width: 100%; height: 100%; border: none; display: block; }
.phone-preview-hint { text-align: center; color: #9a9aa6; margin: 8px 0 2px; }
.phone-preview-hint.is-warning { color: #d9792b; }

/* 短视频文案提取:视频下载链接 */
.workflow-video-download { margin: 8px 0; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.workflow-video-download a { display: inline-block; padding: 6px 14px; background: var(--brand, #b06a3e); color: #fff; border-radius: 8px; text-decoration: none; font-size: 13px; font-weight: 600; }
.workflow-video-download a:hover { opacity: .9; }
.workflow-video-field textarea { min-height: 76px; font-size: 15px; padding: 10px 14px; line-height: 1.6; resize: vertical; width: 100%; box-sizing: border-box; }

/* ============================================================
   首页 v2 · 自定义入口 — 接替五步脊柱的位置。与 hm-* 家族同一
   气质：主题令牌配色、胶囊/圆角、Georgia 斜体点缀。
   ============================================================ */
.home-v2 .hm-entries {
  padding: 26px 4px 30px;
  position: relative; z-index: 40; /* 弹层要压过下方带动画堆叠上下文的模块卡 */
  animation: hmUp 0.65s cubic-bezier(0.2, 0.7, 0.2, 1) 0.12s both;
}
.home-v2 .hm-entries-head { display: flex; align-items: baseline; gap: 14px; margin-bottom: 14px; }
.home-v2 .hm-entries-cap { font-size: 12px; letter-spacing: 3px; color: var(--accent); font-weight: 800; }
.home-v2 .hm-entries-hint { font-size: 12px; color: color-mix(in srgb, var(--muted) 75%, transparent); }
.home-v2 .hm-entries-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(216px, 1fr)); gap: 12px; }

/* —— 入口卡：斜体编号 + 名字，呼应五步脊柱与下方编号模块卡。
      hover 不位移(只亮边框和阴影)，操作件绝对定位，绝无移位。 —— */
.home-v2 .hm-entry {
  position: relative; display: flex; align-items: center; gap: 11px;
  min-height: 60px; padding: 10px 58px 10px 16px;
  background: var(--paper); border: 1px solid var(--line); border-radius: 16px;
  text-decoration: none; overflow: hidden;
  transition: border-color 0.22s, box-shadow 0.22s;
}
html[data-theme="xai"] .home-v2 .hm-entry { background: linear-gradient(180deg, #121a28, #0d131d); border-color: rgba(151, 178, 216, 0.14); }
.home-v2 .hm-entry::after {
  /* 底部主题色细线，hover 时从左划入 */
  content: ""; position: absolute; left: 0; right: 100%; bottom: 0; height: 2px;
  background: linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 30%, transparent));
  transition: right 0.28s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.home-v2 .hm-entry:hover {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--line));
  box-shadow: 0 8px 24px color-mix(in srgb, var(--accent) 9%, rgba(0, 0, 0, 0.08));
}
.home-v2 .hm-entry:hover::after { right: 0; }
.home-v2 .hm-entry.is-dragging { opacity: 0.45; border-style: dashed; }
.home-v2 .hm-entry-no {
  flex: none; font-family: Georgia, "Times New Roman", serif; font-style: italic; font-weight: 700;
  font-size: 22px; line-height: 1; color: color-mix(in srgb, var(--accent) 30%, transparent);
  transition: color 0.22s; user-select: none;
}
.home-v2 .hm-entry:hover .hm-entry-no { color: color-mix(in srgb, var(--accent) 75%, transparent); }
.home-v2 .hm-entry-name {
  font-size: 14.5px; font-weight: 800; color: var(--ink); letter-spacing: 0.4px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.home-v2 .hm-entry-ops {
  position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
  display: flex; align-items: center; gap: 2px;
  opacity: 0; transition: opacity 0.18s;
}
.home-v2 .hm-entry:hover .hm-entry-ops, .home-v2 .hm-entry-ops:focus-within { opacity: 1; }
.home-v2 .hm-entry-drag {
  width: 20px; height: 20px; display: grid; place-items: center;
  color: color-mix(in srgb, var(--muted) 60%, transparent);
  font-size: 14px; line-height: 1; cursor: grab; user-select: none;
}
.home-v2 .hm-entry-del {
  width: 20px; height: 20px; border-radius: 50%; border: none; cursor: pointer;
  display: grid; place-items: center; font-size: 14px; line-height: 1; padding: 0 0 1px;
  background: transparent; color: color-mix(in srgb, var(--muted) 70%, transparent);
  transition: background 0.18s, color 0.18s;
}
.home-v2 .hm-entry-del:hover {
  background: color-mix(in srgb, #c0504a 14%, transparent); color: #c0504a;
}

/* —— 添加入口卡 + 弹层 —— */
.home-v2 .hm-entry-addwrap { position: relative; }
.home-v2 .hm-entry-add {
  width: 100%; min-height: 58px; display: flex; align-items: center; justify-content: center; gap: 8px;
  border: 1px dashed color-mix(in srgb, var(--muted) 45%, transparent); border-radius: 14px;
  background: transparent; color: var(--muted); font-size: 14px; font-weight: 600;
  cursor: pointer; transition: 0.2s;
}
.home-v2 .hm-entry-add i { font-style: normal; font-size: 17px; line-height: 1; transition: transform 0.2s; }
.home-v2 .hm-entry-add:hover, .home-v2 .hm-entry-add[aria-expanded="true"] {
  border-color: var(--accent); color: var(--accent);
  background: color-mix(in srgb, var(--accent) 5%, transparent);
}
.home-v2 .hm-entry-add:hover i { transform: rotate(90deg); }
.home-v2 .hm-entry-pop {
  position: absolute; top: calc(100% + 8px); left: 0; z-index: 60;
  width: min(340px, calc(100vw - 48px));
  background: var(--paper); border: 1px solid var(--line); border-radius: 16px;
  padding: 14px 16px 16px; box-shadow: 0 18px 48px color-mix(in srgb, var(--accent) 8%, rgba(0, 0, 0, 0.16));
  animation: hmUp 0.22s cubic-bezier(0.2, 0.7, 0.2, 1) both;
}
html[data-theme="xai"] .home-v2 .hm-entry-pop { background: linear-gradient(180deg, #131b2a, #0e141f); border-color: rgba(151, 178, 216, 0.18); }
.home-v2 .hm-entry-pop.pop-align-right { left: auto; right: 0; }
.home-v2 .hm-pop-tabs { display: flex; gap: 18px; border-bottom: 1px solid var(--line); margin-bottom: 12px; }
.home-v2 .hm-pop-tab {
  padding: 4px 2px 9px; border: none; background: transparent; cursor: pointer;
  font-size: 13.5px; font-weight: 600; color: var(--muted);
  border-bottom: 2px solid transparent; margin-bottom: -1px; transition: 0.18s;
}
.home-v2 .hm-pop-tab:hover { color: var(--ink); }
.home-v2 .hm-pop-tab.on { color: var(--accent); border-bottom-color: var(--accent); font-weight: 800; }
.home-v2 .hm-pop-search { position: relative; margin-bottom: 12px; }
.home-v2 .hm-pop-search input, .home-v2 .hm-pop-input {
  width: 100%; box-sizing: border-box; padding: 9px 34px 9px 12px;
  border: 1px solid var(--line); border-radius: 10px; background: var(--bg);
  color: var(--ink); font-size: 13.5px; transition: border-color 0.18s;
}
.home-v2 .hm-pop-input { padding-right: 12px; margin-bottom: 10px; }
.home-v2 .hm-pop-search input:focus, .home-v2 .hm-pop-input:focus {
  outline: none; border-color: color-mix(in srgb, var(--accent) 60%, var(--line));
}
.home-v2 .hm-pop-search span {
  position: absolute; right: 11px; top: 50%; transform: translateY(-50%);
  color: var(--muted); font-size: 15px; pointer-events: none;
}
.home-v2 .hm-pop-cap { font-size: 11.5px; letter-spacing: 2px; color: var(--muted); margin-bottom: 8px; }
.home-v2 .hm-pop-chips { display: flex; flex-wrap: wrap; gap: 8px; max-height: 176px; overflow-y: auto; }
.home-v2 .hm-pop-chip {
  display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px;
  border: none; border-radius: 99px; background: var(--soft); color: var(--ink);
  font-size: 12.5px; cursor: pointer; transition: 0.18s;
}
.home-v2 .hm-pop-chip i { font-style: normal; color: var(--accent); font-weight: 800; }
.home-v2 .hm-pop-chip:hover:not(:disabled) {
  background: color-mix(in srgb, var(--accent) 14%, var(--soft));
  transform: translateY(-1px);
}
.home-v2 .hm-pop-chip.is-added { opacity: 0.5; cursor: default; }
.home-v2 .hm-pop-empty, .home-v2 .hm-pop-err { margin: 4px 0 0; font-size: 12.5px; color: var(--muted); }
.home-v2 .hm-pop-err { color: #c0504a; }
.home-v2 .hm-pop-add {
  width: 100%; padding: 9px 0; border: none; border-radius: 99px; cursor: pointer;
  background: var(--accent); color: var(--accent-contrast); font-size: 13.5px; font-weight: 800;
  letter-spacing: 1px; transition: 0.2s;
}
html[data-theme="xai"] .home-v2 .hm-pop-add { color: #11210a; }
.home-v2 .hm-pop-add:hover { filter: brightness(1.06); transform: translateY(-1px); }

@media (prefers-reduced-motion: reduce) {
  .home-v2 .hm-entries, .home-v2 .hm-entry-pop { animation: none; }
}
@media (max-width: 720px) {
  .home-v2 .hm-entries-grid { grid-template-columns: 1fr 1fr; }
  .home-v2 .hm-entry-ops { opacity: 1; } /* 触屏无 hover，常显操作件 */
  .home-v2 .hm-entry-pop { left: auto; right: 0; }
}

/* ── 登录页：同意协议勾选 ────────────────────────────────────── */
/* 注册/找回密码时显示（登录只在底部给一行说明，不强制勾，免得老用户每次都要点） */
.login-agree {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 2px 0 -4px;
  font-size: 13px;
  line-height: 1.6;
  color: var(--muted);
  cursor: pointer;
  user-select: none;
}
.login-agree input[type="checkbox"] {
  width: 16px;
  height: 16px;
  margin: 2px 0 0;
  flex: none;
  accent-color: var(--accent);
  cursor: pointer;
  box-shadow: none;
}
.login-agree span { flex: 1; }
.login-agree a { color: var(--accent); text-decoration: none; }
.login-agree a:hover { text-decoration: underline; }
/* 未勾选就提交时抖一下 + 标红，比纯文字提示更容易被注意到 */
.login-agree.shake { animation: loginAgreeShake .4s; }
.login-agree.shake span { color: var(--danger, #d9534f); }
@keyframes loginAgreeShake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-5px); }
  75% { transform: translateX(5px); }
}

.login-legal {
  margin: 14px 0 0;
  text-align: center;
  font-size: 12px;
  line-height: 1.7;
  color: var(--muted);
  opacity: .85;
}
.login-legal a { color: var(--muted); text-decoration: underline; text-underline-offset: 2px; }
.login-legal a:hover { color: var(--accent); }

/* ── 协议页 ──────────────────────────────────────────────── */
.agreement-page {
  min-height: 100vh;
  background: var(--bg);
  padding: 24px 16px;
  box-sizing: border-box;
}
.agreement-shell { width: min(760px, 100%); margin: 0 auto; }
.agreement-card {
  background: var(--paper);
  border-radius: var(--radius-lg, 20px);
  box-shadow: var(--shadow-md, 0 22px 50px rgba(37, 42, 47, .14));
  padding: 28px 26px 22px;
}
.agreement-head h1 { margin: 0 0 14px; font-size: 22px; color: var(--ink); }
.segmented.agreement-tabs {
  display: inline-flex;
  background: var(--bg);
  border-radius: var(--radius-pill, 999px);
  padding: 4px;
  gap: 2px;
  box-shadow: inset 0 0 0 1px var(--line);
  margin-bottom: 18px;
}
.agreement-tabs button {
  border: none;
  background: transparent;
  border-radius: var(--radius-pill, 999px);
  padding: 7px 16px;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--muted);
  cursor: pointer;
  transition: .18s;
}
.agreement-tabs button.active {
  background: var(--accent);
  color: var(--accent-contrast, #fff);
}
.agreement-body { color: var(--ink); }
.agreement-body h2 {
  margin: 20px 0 8px;
  font-size: 15px;
  font-weight: 700;
  color: var(--ink);
}
.agreement-body p {
  margin: 0 0 10px;
  font-size: 14px;
  line-height: 1.85;
  color: var(--muted);
}
.agreement-body b { color: var(--ink); font-weight: 600; }
.agreement-foot {
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  text-align: center;
}
.agreement-foot a { color: var(--accent); text-decoration: none; font-size: 14px; }
.agreement-foot a:hover { text-decoration: underline; }

/* ── 生图工作台：结构化提示词蓝图编辑器 ─────────────────────── */
.prompt-library-actions-inline {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}

.prompt-library-actions-inline .prompt-library-button { margin-left: 0; }

.image-page-v2 .structured-prompt-entry {
  border: 0;
  border-radius: var(--radius-pill, 999px);
  background: color-mix(in srgb, var(--accent) 11%, var(--paper));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 46%, var(--line));
  color: var(--accent-strong, var(--accent));
  font-weight: 800;
}

.image-page-v2 .structured-prompt-entry:hover {
  background: color-mix(in srgb, var(--accent) 17%, var(--paper));
  transform: translateY(-1px);
}

.structured-prompt-dialog {
  width: min(1120px, calc(100vw - 32px));
  max-width: none;
  max-height: min(92vh, 920px);
  padding: 0;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--line));
  border-radius: 18px;
  background: var(--paper);
  color: var(--ink);
  box-shadow: 0 28px 90px rgba(15, 28, 38, 0.28);
}

.structured-prompt-dialog::backdrop {
  background: rgba(11, 18, 25, 0.56);
  backdrop-filter: blur(6px);
}

.structured-prompt-shell {
  display: flex;
  max-height: min(92vh, 920px);
  flex-direction: column;
  background:
    linear-gradient(color-mix(in srgb, var(--accent) 5%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--accent) 5%, transparent) 1px, transparent 1px),
    var(--paper);
  background-size: 28px 28px;
}

.structured-prompt-head,
.structured-prompt-footer {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  background: color-mix(in srgb, var(--paper) 94%, transparent);
  backdrop-filter: blur(12px);
}

.structured-prompt-head {
  padding: 20px 22px 16px;
  border-bottom: 1px solid var(--line);
}

.structured-prompt-head h2 {
  margin: 3px 0 4px;
  font-size: clamp(20px, 2.2vw, 28px);
  letter-spacing: -0.03em;
}

.structured-prompt-head p,
.structured-prompt-footer p { margin: 0; color: var(--muted); font-size: 13px; }

.structured-prompt-kicker {
  color: var(--accent);
  font: 800 10px/1.2 ui-monospace, SFMono-Regular, Consolas, monospace;
  letter-spacing: 0.19em;
}

.structured-prompt-head > button {
  width: 36px;
  min-width: 36px;
  height: 36px;
  padding: 0;
  border-radius: 50%;
  font-size: 20px;
}

.structured-prompt-source-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 190px;
  gap: 12px 18px;
  padding: 16px 22px;
  background: color-mix(in srgb, var(--soft) 52%, var(--paper));
  border-bottom: 1px solid var(--line);
}

.structured-prompt-source-panel > label { grid-row: span 2; }
.structured-prompt-source-panel textarea { min-height: 88px; resize: vertical; }
.structured-prompt-source-actions { display: flex; flex-direction: column; justify-content: center; gap: 8px; }
.structured-prompt-source-actions small { color: var(--muted); font-size: 11px; line-height: 1.5; }

.structured-prompt-modebar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 22px 8px;
}

.structured-prompt-tabs { width: fit-content; }
.structured-prompt-validity {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #2d7a51;
  font-size: 12px;
  font-weight: 700;
}
.structured-prompt-validity::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.structured-prompt-validity.error { color: var(--warn); }

.structured-prompt-visual,
.structured-prompt-code {
  flex: 1;
  min-height: 0;
  padding: 8px 22px 22px;
  overflow: auto;
  overscroll-behavior: contain;
}

.structured-prompt-section {
  margin-top: 12px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: color-mix(in srgb, var(--paper) 97%, var(--accent));
  box-shadow: var(--shadow-sm);
}

.structured-prompt-section:first-child { margin-top: 0; }
.structured-prompt-section > h3,
.structured-prompt-section-head h3 { margin: 0 0 12px; font-size: 14px; letter-spacing: 0.01em; }

.structured-prompt-section-head,
.structured-prompt-entity-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.structured-prompt-section-head button,
.structured-prompt-entity-head button { min-height: 30px; padding: 0 10px; font-size: 12px; }

.structured-prompt-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.structured-prompt-grid label,
.structured-prompt-source-panel label,
.structured-prompt-code label {
  display: grid;
  align-content: start;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.structured-prompt-grid input,
.structured-prompt-grid select,
.structured-prompt-grid textarea,
.structured-prompt-source-panel textarea,
.structured-prompt-code textarea { width: 100%; box-sizing: border-box; }

.structured-prompt-wide { grid-column: 1 / -1; }
.structured-prompt-entities { display: grid; gap: 12px; }
.structured-prompt-entity {
  padding: 13px;
  border: 1px dashed color-mix(in srgb, var(--accent) 34%, var(--line));
  border-radius: 11px;
  background: color-mix(in srgb, var(--soft) 35%, var(--paper));
}
.structured-prompt-entity-head { margin-bottom: 10px; }
.structured-prompt-entity-head strong { color: var(--accent-strong, var(--accent)); font-size: 13px; }

.structured-prompt-code textarea {
  min-height: 520px;
  resize: vertical;
  background: #152028;
  color: #dcebf2;
  border-color: #314653;
  box-shadow: none;
  font: 13px/1.65 ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  tab-size: 2;
}

.structured-prompt-footer {
  padding: 13px 22px;
  border-top: 1px solid var(--line);
}
.structured-prompt-footer-actions { display: flex; align-items: center; gap: 8px; }

@media (max-width: 720px) {
  .prompt-toolbar { align-items: flex-start; }
  .prompt-library-actions-inline { width: 100%; margin-left: 0; }
  .prompt-library-actions-inline button { flex: 1; }
  .structured-prompt-dialog { width: calc(100vw - 12px); max-height: calc(100vh - 12px); border-radius: 13px; }
  .structured-prompt-shell { max-height: calc(100vh - 12px); }
  .structured-prompt-head { padding: 15px 15px 12px; }
  .structured-prompt-head p { display: none; }
  .structured-prompt-source-panel { grid-template-columns: 1fr; padding: 13px 15px; }
  .structured-prompt-source-panel > label { grid-row: auto; }
  .structured-prompt-source-actions { align-items: stretch; }
  .structured-prompt-modebar { padding: 10px 15px 6px; }
  .structured-prompt-visual, .structured-prompt-code { padding: 6px 15px 16px; }
  .structured-prompt-grid { grid-template-columns: 1fr; }
  .structured-prompt-wide { grid-column: auto; }
  .structured-prompt-section { padding: 13px; }
  .structured-prompt-footer { align-items: stretch; flex-direction: column; padding: 11px 15px; }
  .structured-prompt-footer-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .structured-prompt-footer-actions .primary { grid-column: 1 / -1; }
}

/* ───────── 记忆 V2：结构化记忆卡片 / 候选审核 / 来源 ───────── */

.memory-entry-panel {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 10px;
}

.memory-entry-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 12px;
  opacity: 0.75;
}

.memory-entry-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  /* 记忆多了之后侧栏会被撑得很长，这里自己滚，不带着整页滚 */
  max-height: 420px;
  overflow-y: auto;
}

.memory-entry-card,
.memory-v2-candidate-card {
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 10px;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  background: rgba(148, 163, 184, 0.06);
}

.memory-entry-body {
  font-size: 13px;
  line-height: 1.6;
  /* 长内容不撑破卡片，也不横向滚整页 */
  word-break: break-word;
}

.memory-entry-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  font-size: 11px;
  opacity: 0.7;
}

.memory-entry-meta span {
  border: 1px solid rgba(148, 163, 184, 0.3);
  border-radius: 999px;
  padding: 1px 8px;
  white-space: nowrap;
}

.memory-entry-acts {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.memory-entry-acts button {
  font-size: 12px;
  padding: 3px 10px;
}

.memory-v2-hold {
  font-size: 12px;
  margin: 0;
  color: #b45309;
}

.memory-v2-candidates {
  margin-bottom: 14px;
}

.memory-v2-candidates h4 {
  margin: 0 0 8px;
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.memory-v2-candidates h4 em {
  font-style: normal;
  font-size: 12px;
  opacity: 0.7;
}

.memory-v2-candidate-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.memory-source-dialog {
  border: none;
  border-radius: 14px;
  padding: 0;
  width: min(680px, 92vw);
}

.memory-source-shell {
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.memory-source-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 60vh;
  overflow-y: auto;
}

.memory-source-entry {
  border-left: 3px solid rgba(59, 130, 246, 0.6);
  padding-left: 10px;
  font-size: 13px;
  line-height: 1.6;
}

.memory-source-item {
  display: flex;
  gap: 10px;
  font-size: 12px;
  line-height: 1.6;
  border-bottom: 1px dashed rgba(148, 163, 184, 0.25);
  padding-bottom: 6px;
}

.memory-source-time {
  flex: 0 0 auto;
  opacity: 0.6;
  white-space: nowrap;
}

.memory-source-text {
  word-break: break-word;
}

.memory-source-item.is-deleted .memory-source-text {
  opacity: 0.55;
  font-style: italic;
}

.memory-citations {
  font-size: 12px;
  margin-top: 4px;
}

.memory-citations summary {
  cursor: pointer;
  opacity: 0.7;
}

.memory-citations ul {
  margin: 6px 0 0;
  padding-left: 16px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.memory-citation-scope {
  margin-right: 8px;
  opacity: 0.7;
}

.memory-citation-jump {
  font-size: 11px;
  padding: 1px 8px;
}

.memory-citation-gone {
  opacity: 0.55;
  font-style: italic;
}

/* 手机端：四个按钮排一行会被压到 40px 宽，「彻底删除」四个字都挤没了。
   ★flex-shrink 必须是 0 —— 写 `flex: 1 1 45%` 的话浏览器仍会把它们压扁塞进一行，
   基准宽度形同虚设。0 才能强制两个一行。 */
@media (max-width: 480px) {
  .memory-entry-list { max-height: none; }
  .memory-entry-acts button { flex: 1 0 calc(50% - 3px); padding: 6px 8px; }
  .memory-source-item { flex-direction: column; gap: 2px; }
}

.memory-v2-candidates-note {
  margin: 0 0 8px;
  font-size: 12px;
  line-height: 1.6;
  opacity: 0.7;
}

/* ===== 个人中心 · 知识库（统一个人知识库 · Task 10）=====
   ★全部用 knowledge- 前缀，不动通用 table/input/button —— 个人中心里
     别的板块共用那些样式，一改就是全站波及。 */
.knowledge-layout {
  display: grid;
  grid-template-columns: minmax(220px, 280px) 1fr;
  gap: 16px;
  align-items: start;
}

.knowledge-base-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.knowledge-base-item {
  display: grid;
  gap: 2px;
  text-align: left;
  padding: 10px 12px;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 10px;
  background: var(--card-bg, #fff);
  cursor: pointer;
}

.knowledge-base-item.active {
  border-color: var(--accent, #2563eb);
  box-shadow: 0 0 0 1px var(--accent, #2563eb) inset;
}

.knowledge-base-name { font-weight: 600; }

.knowledge-base-tag {
  justify-self: start;
  font-size: 12px;
  padding: 1px 6px;
  border-radius: 999px;
  background: var(--tag-bg, #eef2ff);
  color: var(--tag-fg, #3730a3);
}

.knowledge-base-meta { opacity: 0.7; }

.knowledge-empty {
  opacity: 0.7;
  padding: 12px;
}

.knowledge-detail {
  display: grid;
  gap: 12px;
}

.knowledge-detail-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.knowledge-detail-actions {
  display: flex;
  gap: 8px;
}

/* 拖拽区。★是个 label，包着隐藏的 file input —— 只能拖不能点的话键盘用户用不了 */
.knowledge-drop {
  display: grid;
  gap: 4px;
  justify-items: center;
  padding: 20px;
  border: 1px dashed var(--border, #cbd5e1);
  border-radius: 12px;
  cursor: pointer;
  text-align: center;
}

.knowledge-drop.dragging {
  border-color: var(--accent, #2563eb);
  background: var(--accent-soft, #eff6ff);
}

.knowledge-drop input[type="file"] {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.knowledge-status {
  min-height: 20px;
  font-size: 13px;
  opacity: 0.85;
}

.knowledge-doc-list {
  display: grid;
  gap: 6px;
}

.knowledge-doc {
  display: grid;
  grid-template-columns: 1fr auto auto auto;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 8px;
}

.knowledge-doc-name {
  font-weight: 500;
  overflow-wrap: anywhere;
}

.knowledge-doc-meta {
  font-size: 12px;
  opacity: 0.7;
}

/* ★状态不能只靠颜色区分：文字本身就写清楚了，颜色只是辅助 */
.knowledge-doc-status {
  font-size: 12px;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--tag-bg, #f1f5f9);
}

.knowledge-status-ready { background: #dcfce7; color: #166534; }
.knowledge-status-error { background: #fee2e2; color: #991b1b; }
.knowledge-status-needs_ocr { background: #fef3c7; color: #92400e; }

.knowledge-doc-error {
  grid-column: 1 / -1;
  color: #991b1b;
  font-size: 12px;
}

.knowledge-query {
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 10px;
  padding: 10px 12px;
}

.knowledge-query-row {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}

.knowledge-query-row input {
  flex: 1;
}

.knowledge-query-results {
  display: grid;
  gap: 10px;
  margin-top: 10px;
}

.knowledge-hit {
  border-left: 3px solid var(--accent, #2563eb);
  padding-left: 10px;
}

.knowledge-hit-head {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  font-size: 12px;
  opacity: 0.8;
}

.knowledge-hit-key { font-weight: 700; }

.knowledge-hit-body {
  margin: 4px 0 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.knowledge-dialog {
  border: none;
  border-radius: 12px;
  padding: 18px 20px;
  min-width: min(420px, 90vw);
}

.knowledge-dialog label {
  display: grid;
  gap: 4px;
  margin: 10px 0;
}

.knowledge-dialog menu {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin: 14px 0 0;
  padding: 0;
}

.knowledge-dialog-hint { font-size: 12px; opacity: 0.75; }
.knowledge-dialog-warn { font-size: 13px; color: #991b1b; }

/* ★窄屏：两栏改一栏，文档行从表格变卡片（横向挤在一起会全部截断） */
@media (max-width: 720px) {
  .knowledge-layout { grid-template-columns: 1fr; }
  .knowledge-doc {
    grid-template-columns: 1fr;
    gap: 4px;
  }
  .knowledge-detail-actions { width: 100%; }
  .knowledge-query-row { flex-direction: column; }
}

/* 知识库列表上方的「已归档」开关 */
.knowledge-archived-toggle {
  display: flex; align-items: center; gap: 6px; padding: 2px 0 8px;
  font-size: 12px; color: var(--muted, #667); cursor: pointer; user-select: none;
}
.knowledge-archived-toggle input[type="checkbox"] { flex: none; margin: 0; }

/* 助手「本轮可用的知识库」的一行：勾选框 + 名称 + 来源标签 */
.assistant-kb-row { display: flex; align-items: center; gap: 8px; padding: 5px 0; cursor: pointer; }
.assistant-kb-row input[type="checkbox"] { flex: none; margin: 0; }
.assistant-kb-row .assistant-kb-name { flex: 1 1 auto; min-width: 0; }
.assistant-kb-row .assistant-kb-tag {
  flex: none; font-size: 11px; padding: 1px 6px; border-radius: 3px; white-space: nowrap;
  background: var(--chip-bg, #eef1f4); color: var(--muted, #667);
}

/* 记忆智能体的知识库选择（统一个人知识库 · Task 13） */
.memory-knowledge-list { display: grid; gap: 6px; margin: 10px 0; max-height: 320px; overflow: auto; }
.memory-knowledge-row { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 10px; padding: 6px 8px; border: 1px solid var(--line, #e5e7eb); border-radius: 8px; }
/* 来源标签：分出「我的 / 同事共享的 / 楼盘自动同步的」，避免勾错别人的库 */
.memory-knowledge-source { font-size: 11px; padding: 1px 6px; border-radius: 3px; white-space: nowrap;
  background: var(--chip-bg, #eef1f4); color: var(--muted, #667); }
.memory-knowledge-mode { padding: 4px 8px; }
.memory-knowledge-status { min-height: 18px; font-size: 12px; opacity: .85; }
.memory-knowledge-actions { display: flex; gap: 8px; justify-content: flex-end; padding: 0; margin: 12px 0 0; }
@media (max-width: 720px) {
  .memory-knowledge-row { grid-template-columns: auto 1fr auto; }
  .memory-knowledge-mode { grid-column: 1 / -1; }
}

/* 运行面板：楼盘和参考知识库都没选时的提示。
   ★走主题变量 --warn，9 套主题（含深色）自动跟随；
   自己写死 #fff8e6 在深色主题下会是一块刺眼的白。 */
.workflow-reference-warning {
  margin: 0;
  padding: 10px 12px;
  border: 1px solid color-mix(in srgb, var(--warn) 35%, transparent);
  border-radius: var(--radius, 10px);
  background: color-mix(in srgb, var(--warn) 8%, var(--card-bg, var(--paper)));
  color: var(--warn);
  font-size: 13px;
  line-height: 1.7;
}
.workflow-reference-warning strong { font-weight: 600; }

/* 分步向导（20260921）：顶部步数条 + 一步一页 */
.workflow-wizard-steps { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 14px; }
.workflow-wizard-steps[hidden] { display: none; }
.workflow-wizard-step { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px solid var(--line, #e2d9c9); border-radius: 999px; background: transparent; color: inherit; font-size: 12.5px; cursor: pointer; }
.workflow-wizard-step .workflow-wizard-mark { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: 50%; border: 1px solid var(--line, #e2d9c9); font-size: 11px; }
.workflow-wizard-step.is-current { border-color: var(--brand, #2f5d7c); color: var(--brand, #2f5d7c); font-weight: 600; }
.workflow-wizard-step.is-done .workflow-wizard-mark { background: var(--brand, #2f5d7c); border-color: var(--brand, #2f5d7c); color: #fff; }
.workflow-wizard-step.is-stale .workflow-wizard-mark { background: #e0a23c; border-color: #e0a23c; color: #fff; }
.workflow-wizard-step.is-failed .workflow-wizard-mark { background: #c0504d; border-color: #c0504d; color: #fff; }
.workflow-wizard-step.is-locked { opacity: .45; cursor: not-allowed; }
.workflow-wizard-nav { margin-top: 14px; justify-content: flex-end; }
.workflow-wizard-stale { margin: 0 0 10px; padding: 8px 12px; border-radius: 8px; background: rgba(224, 162, 60, .14); color: #8a5a12; font-size: 12.5px; }
.workflow-wizard-final .workflow-wizard-copy { margin-top: 14px; }
.workflow-wizard-final pre { white-space: pre-wrap; word-break: break-word; margin: 0 0 10px; font-family: inherit; font-size: 13.5px; line-height: 1.8; }
@media (max-width: 680px) {
  .workflow-wizard-step { font-size: 12px; padding: 5px 10px; }
}

/* 向导模式：步骤卡不再自己编号（顶部步数条已经在数了），也不要「执行结果」那圈外壳 */
body.workflow-wizard-on .workflow-run-steps { list-style: none; padding-left: 0; margin: 0; }
body.workflow-wizard-on .workflow-result-box { border: 0; padding: 0; background: transparent; box-shadow: none; }
body.workflow-wizard-on .workflow-run-steps > li { margin: 0; }

/* 文案候选：几条备选选一条 */
.workflow-copy-picks { display: grid; gap: 10px; margin: 0 0 14px; }
.workflow-copy-pick { border: 1px solid var(--line, #e2d9c9); border-radius: 12px; padding: 12px 14px; background: var(--panel, #fff); }
.workflow-copy-pick.is-picked { border-color: var(--brand, #2f5d7c); box-shadow: 0 0 0 1px var(--brand, #2f5d7c) inset; }
.workflow-copy-pick header { display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; margin-bottom: 8px; }
.workflow-copy-pick header span { font-size: 11px; font-weight: 400; color: var(--brand, #2f5d7c); }
.workflow-copy-pick pre { white-space: pre-wrap; word-break: break-word; margin: 0 0 10px; font-family: inherit; font-size: 13px; line-height: 1.75; }
.workflow-copy-pick button { padding: 6px 14px; border-radius: 8px; }
.workflow-copy-pick.is-picked button { background: var(--brand, #2f5d7c); color: #fff; border-color: var(--brand, #2f5d7c); }

/* 工作流里的图片：跟记忆智能体同一套查看器（点图放大 → 顶部工具进画布） */
.workflow-viewer-grid { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 12px; }
/* ★只有图片本身可点：按钮必须按内容收缩（width:auto 在 display:block 下等于撑满整行，
   旁边那一大片空白就都成了「放大查看」的可点区）。选择器要比 memory-image-viewer.css
   的 `html body.memory-workspace button.miv-inline` 更具体，否则被它盖回 block 全宽。 */
/* ★点击目标就是图片本身：不套 <button> 外壳，外壳盒子会比图片宽出一条，那条空白也能点 */
html body .workflow-viewer-grid { align-items: flex-start; }
html body .workflow-viewer-grid .workflow-viewer-image { flex: 0 0 auto; cursor: zoom-in; display: block; }
html body .workflow-viewer-grid .workflow-viewer-image { width: 190px; max-width: 100%; height: auto; border-radius: 10px; }
/* 成品图放大显示：原来 190px 太小，看不清底部信息栏的字 */
html body .workflow-viewer-grid.is-large .workflow-viewer-image { width: min(420px, 100%); border-radius: 12px; }
/* 成品页：只看不改，点图开原图 */
html body .workflow-viewer-grid.is-viewonly a { display: inline-block; line-height: 0; }
html body .workflow-viewer-grid.is-viewonly img { width: min(420px, 100%); height: auto; border-radius: 12px; display: block; cursor: zoom-in; }
@media (max-width: 680px) {
  .workflow-viewer-grid .workflow-viewer-image { width: 140px; }
  .workflow-viewer-grid.is-large .workflow-viewer-image { width: 100%; }
}
.workflow-copy-more { margin-top: 4px; font-size: 12.5px; }

/* AI 改写对比：只标改动处 */
.workflow-rewrite-diff-summary { margin: 0 0 8px; font-size: 12.5px; color: var(--muted, #6b6257); }
.workflow-rewrite-diff-summary del, .workflow-rewrite-diff-body del { background: rgba(192, 80, 77, .14); color: #a33; text-decoration: line-through; }
.workflow-rewrite-diff-summary ins, .workflow-rewrite-diff-body ins { background: rgba(60, 140, 90, .16); color: #2c6b46; text-decoration: none; }
.workflow-rewrite-diff-body { font-size: 13px; line-height: 1.85; word-break: break-word; }

/* 操作回执：绿色，几秒后自动撤掉 */
.workflow-result-summary.is-flash { background: rgba(60, 140, 90, .12); border-color: rgba(60, 140, 90, .3); color: #2c6b46; }

.workflow-rewrite-save-row { display: flex; align-items: center; gap: 10px; }
.workflow-rewrite-saved { font-size: 12.5px; color: #2c6b46; background: rgba(60,140,90,.12); border-radius: 999px; padding: 4px 10px; white-space: nowrap; }

/* 合规建议：一键应用 */
.compliance-issue-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.compliance-issue-actions button { font-size: 12px; padding: 4px 10px; border-radius: 8px; }

.compliance-issue-state { font-size: 12px; margin-left: 6px; }
.compliance-issue-state.state-done { color: #2e7d32; }
.compliance-issue-state.state-open { color: #b26a00; }

/* 合规修订：恢复入口和逐条操作 */
.compliance-diff-header { flex-wrap: wrap; }
.compliance-restore-all { margin-left: auto; font-size: 12px; padding: 6px 12px; border-radius: 8px; }
.compliance-issue-actions { flex-basis: 100%; }
.compliance-issue-actions button { min-height: 32px; cursor: pointer; }