/* =========================================================================
   弧光TV / Aura Arc TV —— 深色设计系统（Phase-1）
   Token 前缀统一为 --aura-*（ARCHITECTURE §6.5）。
   层级用深灰 + 玻璃层区分，避免纯黑；Desktop First（1280/1440/1920）。
   ========================================================================= */

/* ── `hidden` 属性必须真的隐藏 ────────────────────────────────────────────────
   HTML 的 `hidden` 属性**自身不带样式** —— 它靠 UA 样式表的 `[hidden]{display:none}`
   生效，而**作者样式表里任何 `display` 声明都会盖掉它**（UA 优先级低于作者样式）。
   本仓踩过一次：`.icon-btn{display:grid}` 盖掉了 `#admin-btn` 的 hidden，
   导致**未登录访客也能在顶栏看到 ⚙ 管理后台入口**。
   线上实测证据：该按钮 `hidden` 属性为 true，但 computed `display` 仍是 `grid`、
   且 `getBoundingClientRect()` 有尺寸（真的占据布局盒）。
   ⇒ 统一在此兜底，**不要**再逐个组件补 `[hidden]` 变体（那是把同一件事写 N 遍，
     漏一个就复发 —— 本次就是这么漏掉 `.icon-btn` 的）。
   历史上 `.notify-panel[hidden]` 与 `.auth-panel[hidden]` 各自单写过，现均由本规则覆盖。 */
[hidden] { display: none !important; }

:root {
  /* ---- 背景层级 ---- */
  --aura-bg-base: #0B0B0F;
  --aura-bg-elevated: #121218;
  --aura-bg-panel: #17171F;
  --aura-bg-panel-2: #1E1E28;
  --aura-bg-glass: rgba(28, 28, 38, 0.55);
  --aura-bg-glass-strong: rgba(34, 34, 46, 0.72);

  /* ---- 边框 / 分割 ---- */
  --aura-border-soft: rgba(255, 255, 255, 0.06);
  --aura-border-mid: rgba(255, 255, 255, 0.10);
  --aura-border-strong: rgba(255, 255, 255, 0.16);

  /* ---- 文本 ---- */
  --aura-text-primary: #F3F3F7;
  --aura-text-secondary: #B8B8C6;
  --aura-text-muted: #7C7C90;
  --aura-text-faint: #55556A;

  /* ---- 主色 ---- */
  --aura-accent: #7C5CFF;
  --aura-accent-strong: #6A48F5;
  --aura-accent-soft: rgba(124, 92, 255, 0.14);
  --aura-accent-glow: rgba(124, 92, 255, 0.38);
  --aura-accent-2: #35D6C6;
  --aura-accent-2-soft: rgba(53, 214, 198, 0.14);

  /* ---- 语义色 ---- */
  --aura-ok: #3ED598;
  --aura-ok-soft: rgba(62, 213, 152, 0.14);
  --aura-warn: #F5B942;
  --aura-warn-soft: rgba(245, 185, 66, 0.14);
  --aura-danger: #FF5C7A;
  --aura-danger-soft: rgba(255, 92, 122, 0.14);

  /* ---- 阴影 ---- */
  --aura-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
  --aura-shadow-md: 0 8px 24px rgba(0, 0, 0, 0.45);
  --aura-shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.55);
  --aura-shadow-glow: 0 0 0 1px var(--aura-accent-soft), 0 12px 40px rgba(124, 92, 255, 0.22);

  /* ---- 圆角刻度 ---- */
  --aura-radius-xs: 6px;
  --aura-radius-sm: 10px;
  --aura-radius-md: 14px;
  --aura-radius-lg: 20px;
  --aura-radius-xl: 28px;
  --aura-radius-pill: 999px;

  /* ---- 间距刻度 ---- */
  --aura-space-1: 4px;
  --aura-space-2: 8px;
  --aura-space-3: 12px;
  --aura-space-4: 16px;
  --aura-space-5: 24px;
  --aura-space-6: 32px;
  --aura-space-7: 48px;
  --aura-space-8: 64px;

  /* ---- 字号刻度 ---- */
  --aura-fs-xs: 12px;
  --aura-fs-sm: 13px;
  --aura-fs-md: 15px;
  --aura-fs-lg: 18px;
  --aura-fs-xl: 24px;
  --aura-fs-2xl: 34px;
  --aura-fs-3xl: 52px;

  /* ---- 结构与动效 ---- */
  --aura-font-sans: "PingFang SC", "Microsoft YaHei", "Segoe UI", system-ui, -apple-system, sans-serif;
  --aura-font-mono: "SFMono-Regular", "JetBrains Mono", Consolas, monospace;
  --aura-nav-h: 64px;
  --aura-inspector-w: 360px;
  --aura-drawer-w: 440px;
  --aura-content-max: 1400px;
  --aura-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* ---- 基础 ---- */
* { box-sizing: border-box; }

html, body { margin: 0; padding: 0; }

body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background:
    radial-gradient(1200px 600px at 15% -10%, rgba(124, 92, 255, 0.16), transparent 60%),
    radial-gradient(900px 500px at 95% 0%, rgba(53, 214, 198, 0.10), transparent 55%),
    var(--aura-bg-base);
  color: var(--aura-text-primary);
  font-family: var(--aura-font-sans);
  font-size: var(--aura-fs-md);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: var(--aura-border-mid); border-radius: 999px; }
::-webkit-scrollbar-track { background: transparent; }

a { color: inherit; }
button { font-family: inherit; }

/* =========================================================================
   顶部导航
   ========================================================================= */
.topnav {
  position: sticky;
  top: 0;
  z-index: 20;
  height: var(--aura-nav-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--aura-space-4);
  padding: 0 var(--aura-space-6);
  background: var(--aura-bg-glass-strong);
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  border-bottom: 1px solid var(--aura-border-soft);
}
.topnav__left { display: flex; align-items: center; gap: var(--aura-space-6); min-width: 0; }
.topnav__right { display: flex; align-items: center; gap: var(--aura-space-3); }

.brand { display: flex; align-items: center; gap: var(--aura-space-3); text-decoration: none; color: inherit; }
/* 品牌标记 = 正式 logo 的**去背景横向版**（`aura-arc-mark-nav.png`，RGBA）。
   它与方形角标版 `aura-arc-mark.png` 的区别：
     · 方形版保留原图深色渐变底 ⇒ 在顶栏上是一块可见的暗色方块，标记只占方图 ~61%，偏小；
     · 本版已去背景 ⇒ 标记直接浮在顶栏上，同高度下更醒目（去背景判据见
       `qa/brand-assets/generate-nav-mark.py` 文件头）。
   高度固定 38px、宽度按比例自适应（约 60px）；**不要**给它背景色或圆角 ——
   那会把去掉的方块又贴回来。logo 自带发光，故不再叠加 box-shadow。 */
.brand__mark {
  display: block; flex: 0 0 auto;
  height: 38px; width: auto;
  object-fit: contain;
}
/* 中英两行的间距：用户反馈「英文和中文贴太近了」。
   原来只有 `line-height: 1.1` —— 那是给**同字号**多行文本用的紧凑行高，
   而这里是「16px 中文 + 11px 英文」两种字号叠放，行高各自算完仍然贴在一起。
   改用 flex `gap` 显式给行间距：比继续调 `line-height` 可控 ——
   line-height 会同时改变每行自身的高度，把两行一起撑开，测不准该调多少。 */
.brand__text { display: flex; flex-direction: column; gap: 4px; line-height: 1.15; }
.brand__zh { font-size: var(--aura-fs-lg); font-weight: 700; letter-spacing: 0.5px; }
.brand__en { font-size: var(--aura-fs-xs); color: var(--aura-text-muted); letter-spacing: 1.5px; text-transform: uppercase; }

.nav { display: flex; align-items: center; gap: var(--aura-space-1); overflow-x: auto; scrollbar-width: none; }
.nav::-webkit-scrollbar { display: none; }
.nav__item {
  padding: var(--aura-space-2) var(--aura-space-3);
  border-radius: var(--aura-radius-pill);
  color: var(--aura-text-secondary); text-decoration: none;
  font-size: var(--aura-fs-md); white-space: nowrap;
  transition: background 0.18s var(--aura-ease), color 0.18s var(--aura-ease);
}
.nav__item:hover { background: var(--aura-border-soft); color: var(--aura-text-primary); }
.nav__item.is-active { background: var(--aura-accent-soft); color: var(--aura-text-primary); box-shadow: inset 0 0 0 1px var(--aura-border-mid); }

.pill {
  display: flex; align-items: center; gap: var(--aura-space-2);
  padding: var(--aura-space-2) var(--aura-space-3);
  border-radius: var(--aura-radius-pill);
  background: var(--aura-bg-panel); border: 1px solid var(--aura-border-soft);
  font-size: var(--aura-fs-sm); color: var(--aura-text-secondary);
}
.pill__icon { color: var(--aura-accent-2); }
.pill__value { color: var(--aura-text-primary); font-weight: 600; }

.icon-btn {
  position: relative; display: grid; place-items: center; width: 36px; height: 36px;
  border-radius: var(--aura-radius-sm); background: var(--aura-bg-panel);
  border: 1px solid var(--aura-border-soft); cursor: pointer; font-size: var(--aura-fs-md);
  color: var(--aura-text-secondary);
  transition: border-color 0.18s var(--aura-ease), background 0.18s var(--aura-ease);
}
.icon-btn:hover { border-color: var(--aura-border-strong); background: var(--aura-bg-panel-2); }

/* 管理后台入口（**仅管理员可见**，显隐由 topnav.js 按 sm_is_admin() 决定）。
   比普通 icon-btn 更显眼：带文字标签 + 主题色描边。
   原因：它原先只是个 ⚙ 小图标，连管理员自己都常找不到入口（用户反馈「管理员后台配置系统在哪」）。
   非管理员时该按钮始终带 hidden ⇒ 普通用户看到的顶栏与加这条样式之前完全一致。 */
.admin-entry {
  display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 12px;
  border-radius: var(--aura-radius-sm); cursor: pointer; font-size: var(--aura-fs-sm);
  background: var(--aura-accent-soft); border: 1px solid var(--aura-accent);
  color: var(--aura-text-primary);
}
.admin-entry:hover { background: var(--aura-accent); color: #fff; }
.admin-entry__glyph { font-size: var(--aura-fs-md); line-height: 1; }
.admin-entry__label { font-weight: 600; white-space: nowrap; }
.icon-btn__dot {
  position: absolute; top: 7px; right: 8px; width: 7px; height: 7px; border-radius: 50%;
  background: var(--aura-accent); box-shadow: 0 0 0 2px var(--aura-bg-panel);
}
.avatar {
  display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%;
  background: linear-gradient(135deg, var(--aura-bg-panel-2), var(--aura-bg-panel));
  border: 1px solid var(--aura-border-mid); color: var(--aura-text-secondary);
  font-weight: 700; cursor: pointer; user-select: none;
}

/* 通知面板（#notify-btn 展开；锚定于 .topnav） */
.notify-panel {
  position: absolute; top: calc(var(--aura-nav-h) - 6px); right: var(--aura-space-6);
  width: 320px; max-height: 60vh; overflow-y: auto; z-index: 60;
  padding: var(--aura-space-3); border-radius: var(--aura-radius-md);
  background: var(--aura-bg-panel); border: 1px solid var(--aura-border-mid);
  box-shadow: var(--aura-shadow-lg);
}
.notify-panel[hidden] { display: none; }
.notify-panel__head { display: flex; align-items: center; justify-content: space-between; padding: 0 4px var(--aura-space-2); }
.notify-panel__title { font-size: var(--aura-fs-sm); color: var(--aura-text-primary); font-weight: 600; }
.notify-panel__empty { margin: 0; padding: var(--aura-space-4) 0; text-align: center; color: var(--aura-text-muted); font-size: var(--aura-fs-sm); }
.notify-item { display: flex; gap: var(--aura-space-2); padding: var(--aura-space-2); border-radius: var(--aura-radius-sm); }
.notify-item:hover { background: var(--aura-bg-panel-2); }
.notify-item.is-unread { background: var(--aura-accent-soft); }
.notify-item__dot { flex: 0 0 8px; width: 8px; height: 8px; margin-top: 6px; border-radius: 50%; background: var(--aura-text-muted); }
.notify-item__dot--success { background: var(--aura-ok); }
.notify-item__dot--danger { background: var(--aura-danger); }
.notify-item__dot--warn { background: var(--aura-warn); }
.notify-item__main { min-width: 0; }
.notify-item__title { font-size: var(--aura-fs-sm); color: var(--aura-text-primary); }
.notify-item__msg { font-size: var(--aura-fs-xs); color: var(--aura-text-secondary); word-break: break-word; }

/* =========================================================================
   Shell（视图 + Inspector）
   ========================================================================= */
.shell { flex: 1; display: flex; align-items: stretch; width: 100%; min-height: 0; }
.view-root { flex: 1 1 auto; min-width: 0; }
.inspector-root {
  flex: 0 0 var(--aura-inspector-w);
  width: var(--aura-inspector-w);
  border-left: 1px solid var(--aura-border-soft);
  background: var(--aura-bg-panel);
  overflow-y: auto;
  padding: var(--aura-space-5);
  transition: flex-basis 0.22s var(--aura-ease), width 0.22s var(--aura-ease), opacity 0.22s var(--aura-ease), padding 0.22s var(--aura-ease);
}
.inspector-root.is-collapsed { flex-basis: 0; width: 0; padding: 0; opacity: 0; border-left: none; overflow: hidden; }

/* =========================================================================
   通用视图骨架
   ========================================================================= */
.view { width: 100%; padding: var(--aura-space-6) var(--aura-space-6) var(--aura-space-7); display: flex; flex-direction: column; gap: var(--aura-space-6); }
.view--home { max-width: 1080px; margin: 0 auto; }
.view--projects, .view--assets, .view--skills, .view--agents, .view--models, .view--templates, .view--community, .view--create { max-width: var(--aura-content-max); margin: 0 auto; }

.page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--aura-space-5); flex-wrap: wrap; }
.page-title { margin: 0 0 var(--aura-space-1); font-size: var(--aura-fs-2xl); font-weight: 800; letter-spacing: -0.5px; }
.page-sub { margin: 0; color: var(--aura-text-muted); font-size: var(--aura-fs-md); }
.page-actions { display: flex; align-items: center; gap: var(--aura-space-3); flex-wrap: wrap; }

.block { display: flex; flex-direction: column; gap: var(--aura-space-4); }
.block__head { display: flex; align-items: center; justify-content: space-between; }
.block__title { margin: 0; font-size: var(--aura-fs-xl); font-weight: 700; }
.link-btn { background: none; border: none; color: var(--aura-accent); cursor: pointer; font-size: var(--aura-fs-md); padding: 0; }
.link-btn:hover { color: var(--aura-accent-2); }

/* =========================================================================
   首页 Hero
   ========================================================================= */
.hero { text-align: center; display: flex; flex-direction: column; align-items: center; }
.hero__eyebrow {
  display: inline-block; margin: 0 0 var(--aura-space-3);
  padding: var(--aura-space-1) var(--aura-space-3); border-radius: var(--aura-radius-pill);
  background: var(--aura-accent-soft); border: 1px solid var(--aura-border-mid);
  color: var(--aura-text-secondary); font-size: var(--aura-fs-xs); letter-spacing: 2px;
}
.hero__title {
  margin: 0 0 var(--aura-space-3); font-size: var(--aura-fs-3xl); font-weight: 800; letter-spacing: -1px;
  background: linear-gradient(120deg, #FFFFFF 10%, var(--aura-accent) 60%, var(--aura-accent-2) 100%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.hero__sub { margin: 0 auto var(--aura-space-6); max-width: 620px; color: var(--aura-text-muted); font-size: var(--aura-fs-lg); }

.composer {
  width: 100%; max-width: 760px; margin: 0 auto; padding: var(--aura-space-4);
  border-radius: var(--aura-radius-lg); background: var(--aura-bg-glass);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border: 1px solid var(--aura-border-mid); box-shadow: var(--aura-shadow-lg); text-align: left;
}
.composer__input {
  width: 100%; min-height: 84px; resize: vertical; padding: var(--aura-space-4);
  border-radius: var(--aura-radius-md); background: var(--aura-bg-elevated);
  border: 1px solid var(--aura-border-soft); color: var(--aura-text-primary);
  font-family: inherit; font-size: var(--aura-fs-md); line-height: 1.6; outline: none;
  transition: border-color 0.18s var(--aura-ease), box-shadow 0.18s var(--aura-ease);
}
.composer__input::placeholder { color: var(--aura-text-faint); }
.composer__input:focus { border-color: var(--aura-accent); box-shadow: 0 0 0 3px var(--aura-accent-soft); }
.composer__actions { margin-top: var(--aura-space-4); display: flex; align-items: center; justify-content: space-between; gap: var(--aura-space-3); flex-wrap: wrap; }
.composer__hint { color: var(--aura-text-faint); font-size: var(--aura-fs-xs); }

.chips { margin: var(--aura-space-6) auto 0; max-width: 860px; display: flex; flex-wrap: wrap; gap: var(--aura-space-2); justify-content: center; }
.chip {
  padding: var(--aura-space-2) var(--aura-space-4); border-radius: var(--aura-radius-pill);
  background: var(--aura-bg-panel); border: 1px solid var(--aura-border-soft);
  color: var(--aura-text-secondary); font-size: var(--aura-fs-sm); cursor: pointer;
  transition: all 0.18s var(--aura-ease);
}
.chip:hover { border-color: var(--aura-border-strong); color: var(--aura-text-primary); transform: translateY(-1px); }
.chip.is-active { background: var(--aura-accent-2-soft); border-color: var(--aura-accent-2); color: var(--aura-text-primary); }

/* =========================================================================
   按钮
   ========================================================================= */
.btn, .primary-btn, .ghost-btn, .mini-btn {
  font-family: inherit; cursor: pointer; border-radius: var(--aura-radius-pill);
  transition: all 0.16s var(--aura-ease); white-space: nowrap;
}
.btn { padding: var(--aura-space-3) var(--aura-space-5); font-size: var(--aura-fs-md); border: 1px solid var(--aura-border-mid); background: transparent; color: var(--aura-text-secondary); }
.btn:hover { border-color: var(--aura-accent); color: var(--aura-text-primary); background: var(--aura-accent-soft); }
.btn--sm { padding: var(--aura-space-2) var(--aura-space-3); font-size: var(--aura-fs-sm); }
.btn--block { width: 100%; display: block; text-align: center; }
.btn--primary { background: linear-gradient(135deg, var(--aura-accent), var(--aura-accent-strong)); border: none; color: #fff; font-weight: 700; box-shadow: var(--aura-shadow-glow); }
.btn--primary:hover { filter: brightness(1.08); background: linear-gradient(135deg, var(--aura-accent), var(--aura-accent-strong)); color: #fff; }
.btn--danger { background: var(--aura-danger-soft); border-color: rgba(255, 92, 122, 0.4); color: var(--aura-danger); }
.btn--danger:hover { background: var(--aura-danger); color: #fff; border-color: var(--aura-danger); }
.btn--ghost { background: transparent; }
.btn:disabled, .primary-btn:disabled, .mini-btn:disabled { opacity: 0.45; cursor: not-allowed; filter: none; }

.primary-btn { padding: var(--aura-space-3) var(--aura-space-6); border: none; background: linear-gradient(135deg, var(--aura-accent), var(--aura-accent-strong)); color: #fff; font-size: var(--aura-fs-md); font-weight: 700; box-shadow: var(--aura-shadow-glow); }
.primary-btn:hover { filter: brightness(1.08); transform: translateY(-1px); }
.ghost-btn { padding: var(--aura-space-2) var(--aura-space-3); border-radius: var(--aura-radius-pill); background: transparent; border: 1px solid var(--aura-border-mid); color: var(--aura-text-secondary); font-size: var(--aura-fs-sm); }
.ghost-btn:hover { border-color: var(--aura-accent); color: var(--aura-text-primary); background: var(--aura-accent-soft); }
.mini-btn { padding: var(--aura-space-1) var(--aura-space-3); border-radius: var(--aura-radius-pill); background: var(--aura-accent-soft); border: 1px solid var(--aura-border-mid); color: var(--aura-text-primary); font-size: var(--aura-fs-xs); }
.mini-btn:hover { border-color: var(--aura-accent); }
.mini-btn--ghost { background: transparent; color: var(--aura-text-muted); }

/* =========================================================================
   卡片 / 网格
   ========================================================================= */
.grid { display: grid; gap: var(--aura-space-4); }
.grid--projects, .grid--assets, .grid--templates, .grid--community { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.grid--agents, .grid--models { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }

.card {
  position: relative; display: flex; flex-direction: column; text-align: left;
  background: var(--aura-bg-panel); border: 1px solid var(--aura-border-soft);
  border-radius: var(--aura-radius-lg); overflow: hidden; color: inherit; padding: 0;
  transition: transform 0.18s var(--aura-ease), border-color 0.18s var(--aura-ease), box-shadow 0.18s var(--aura-ease);
}
.card--hoverable { cursor: pointer; }
.card--hoverable:hover { transform: translateY(-3px); border-color: var(--aura-border-strong); box-shadow: var(--aura-shadow-md); }
.card__cover {
  position: relative; height: 116px; display: grid; place-items: center;
  background: linear-gradient(135deg, var(--aura-bg-panel-2), var(--aura-bg-elevated));
  border-bottom: 1px solid var(--aura-border-soft);
}
.card__cover-glyph { font-size: 30px; color: var(--aura-text-muted); }
.card__check { position: absolute; top: 10px; left: 10px; width: 16px; height: 16px; accent-color: var(--aura-accent); cursor: pointer; }
.card__body { padding: var(--aura-space-4); display: flex; flex-direction: column; gap: var(--aura-space-2); }
.card__title { margin: 0; font-size: var(--aura-fs-lg); font-weight: 700; }
.card__title-row { display: flex; align-items: center; justify-content: space-between; gap: var(--aura-space-2); }
.card__meta { margin: 0; color: var(--aura-text-muted); font-size: var(--aura-fs-sm); }
.card__desc { margin: 0; color: var(--aura-text-secondary); font-size: var(--aura-fs-sm); }
.card__tags { display: flex; flex-wrap: wrap; gap: var(--aura-space-2); align-items: center; }
.card__kv { display: flex; justify-content: space-between; color: var(--aura-text-muted); font-size: var(--aura-fs-xs); }
.card__flag { margin-top: var(--aura-space-2); color: var(--aura-warn); font-size: var(--aura-fs-xs); }
.card__overlay {
  position: absolute; right: var(--aura-space-3); bottom: var(--aura-space-3);
  display: flex; gap: var(--aura-space-2); opacity: 0; transform: translateY(4px);
  transition: opacity 0.18s var(--aura-ease), transform 0.18s var(--aura-ease);
}
.card:hover .card__overlay { opacity: 1; transform: translateY(0); }

.tag { display: inline-block; padding: 2px var(--aura-space-2); border-radius: var(--aura-radius-xs); background: var(--aura-bg-panel-2); border: 1px solid var(--aura-border-soft); color: var(--aura-text-secondary); font-size: var(--aura-fs-xs); }

.badge { display: inline-block; padding: 2px var(--aura-space-3); border-radius: var(--aura-radius-pill); font-size: var(--aura-fs-xs); font-weight: 700; letter-spacing: 0.4px; border: 1px solid var(--aura-border-mid); color: var(--aura-text-secondary); background: var(--aura-bg-panel-2); }
.badge--accent { color: var(--aura-text-primary); background: var(--aura-accent-soft); border-color: rgba(124, 92, 255, 0.4); }
.badge--ok { color: var(--aura-ok); background: var(--aura-ok-soft); border-color: rgba(62, 213, 152, 0.35); }
.badge--warn { color: var(--aura-warn); background: var(--aura-warn-soft); border-color: rgba(245, 185, 66, 0.3); }
.badge--danger { color: var(--aura-danger); background: var(--aura-danger-soft); border-color: rgba(255, 92, 122, 0.35); }
.badge--muted { color: var(--aura-text-muted); }

/* =========================================================================
   空态 / 面板 / 横幅
   ========================================================================= */
.empty { grid-column: 1 / -1; padding: var(--aura-space-7); text-align: center; border: 1px dashed var(--aura-border-mid); border-radius: var(--aura-radius-lg); background: var(--aura-bg-panel); }
.empty__text { margin: 0 0 var(--aura-space-2); font-size: var(--aura-fs-lg); color: var(--aura-text-secondary); }
.empty__hint { margin: 0; color: var(--aura-text-muted); font-size: var(--aura-fs-sm); }

.panel { padding: var(--aura-space-5); border-radius: var(--aura-radius-lg); background: var(--aura-bg-panel); border: 1px solid var(--aura-border-soft); display: flex; flex-direction: column; gap: var(--aura-space-4); }
.panel--compose { max-width: 820px; }

.p1-banner { display: flex; align-items: center; gap: var(--aura-space-3); padding: var(--aura-space-3) var(--aura-space-4); border-radius: var(--aura-radius-md); background: var(--aura-bg-panel-2); border: 1px solid var(--aura-border-soft); color: var(--aura-text-secondary); font-size: var(--aura-fs-sm); }

/* =========================================================================
   筛选栏 / 批量栏
   ========================================================================= */
.filterbar { display: flex; flex-wrap: wrap; gap: var(--aura-space-5); align-items: center; padding: var(--aura-space-3) 0; border-top: 1px solid var(--aura-border-soft); border-bottom: 1px solid var(--aura-border-soft); }
.filterbar__group { display: flex; align-items: center; gap: var(--aura-space-2); flex-wrap: wrap; }
.filterbar__label { color: var(--aura-text-muted); font-size: var(--aura-fs-xs); text-transform: uppercase; letter-spacing: 1px; }
.pill-tab { padding: var(--aura-space-1) var(--aura-space-3); border-radius: var(--aura-radius-pill); background: transparent; border: 1px solid var(--aura-border-soft); color: var(--aura-text-secondary); font-size: var(--aura-fs-sm); cursor: pointer; }
.pill-tab:hover { border-color: var(--aura-border-strong); color: var(--aura-text-primary); }
.pill-tab.is-active { background: var(--aura-accent-soft); border-color: var(--aura-accent); color: var(--aura-text-primary); }

.bulkbar { display: flex; align-items: center; gap: var(--aura-space-3); padding: var(--aura-space-3) var(--aura-space-4); border-radius: var(--aura-radius-md); background: var(--aura-accent-soft); border: 1px solid var(--aura-border-mid); }
.bulkbar__count { font-weight: 700; }

/* =========================================================================
   表单
   ========================================================================= */
.field { display: flex; flex-direction: column; gap: var(--aura-space-2); }
.field__label { color: var(--aura-text-secondary); font-size: var(--aura-fs-sm); }
.field__input {
  width: 100%; padding: var(--aura-space-3); border-radius: var(--aura-radius-sm);
  background: var(--aura-bg-elevated); border: 1px solid var(--aura-border-soft);
  color: var(--aura-text-primary); font-family: inherit; font-size: var(--aura-fs-md); outline: none;
  transition: border-color 0.16s var(--aura-ease), box-shadow 0.16s var(--aura-ease);
}
.field__input::placeholder { color: var(--aura-text-faint); }
.field__input:focus { border-color: var(--aura-accent); box-shadow: 0 0 0 3px var(--aura-accent-soft); }
.field__input--sm { padding: var(--aura-space-2) var(--aura-space-3); font-size: var(--aura-fs-sm); }
.field__error { margin: 0; color: var(--aura-danger); font-size: var(--aura-fs-xs); min-height: 16px; }
.form { display: flex; flex-direction: column; gap: var(--aura-space-4); }

/* =========================================================================
   Skills 分栏
   ========================================================================= */
.split { display: grid; grid-template-columns: 340px 1fr; gap: var(--aura-space-5); align-items: start; }
.split__left, .split__right { min-width: 0; }
.tabs { display: flex; gap: var(--aura-space-2); margin-bottom: var(--aura-space-4); }
.tab { padding: var(--aura-space-2) var(--aura-space-4); border-radius: var(--aura-radius-pill); background: var(--aura-bg-panel); border: 1px solid var(--aura-border-soft); color: var(--aura-text-secondary); cursor: pointer; font-size: var(--aura-fs-sm); }
.tab.is-active { background: var(--aura-accent-soft); border-color: var(--aura-accent); color: var(--aura-text-primary); }
.list { display: flex; flex-direction: column; gap: var(--aura-space-2); }
.list__item { text-align: left; padding: var(--aura-space-3); border-radius: var(--aura-radius-md); background: var(--aura-bg-panel); border: 1px solid var(--aura-border-soft); color: inherit; cursor: pointer; display: flex; flex-direction: column; gap: var(--aura-space-1); }
.list__item:hover { border-color: var(--aura-border-strong); }
.list__item.is-active { border-color: var(--aura-accent); background: var(--aura-accent-soft); }
.list__item-head { display: flex; align-items: center; justify-content: space-between; gap: var(--aura-space-2); }
.list__item-title { font-weight: 700; }
.list__item-sub { margin: 0; color: var(--aura-text-muted); font-size: var(--aura-fs-xs); font-family: var(--aura-font-mono); }

/* =========================================================================
   详情（抽屉 / 右侧面板）
   ========================================================================= */
.detail { display: flex; flex-direction: column; gap: var(--aura-space-5); }
.detail__hero { display: flex; gap: var(--aura-space-4); align-items: flex-start; }
.detail__cover { width: 64px; height: 64px; border-radius: var(--aura-radius-md); display: grid; place-items: center; font-size: 26px; background: linear-gradient(135deg, var(--aura-bg-panel-2), var(--aura-bg-elevated)); border: 1px solid var(--aura-border-soft); color: var(--aura-text-muted); }
.detail__title { margin: 0 0 var(--aura-space-1); font-size: var(--aura-fs-xl); }
.detail__desc { margin: 0 0 var(--aura-space-2); color: var(--aura-text-muted); font-size: var(--aura-fs-sm); }
.detail__badges { display: flex; flex-wrap: wrap; gap: var(--aura-space-2); }
.detail__actions { display: flex; gap: var(--aura-space-3); flex-wrap: wrap; }

/* =========================================================================
   Inspector
   ========================================================================= */
.insp { display: flex; flex-direction: column; gap: var(--aura-space-5); }
.insp--empty { align-items: center; justify-content: center; height: 100%; text-align: center; }
.insp__head { display: flex; flex-direction: column; gap: var(--aura-space-2); }
.insp__name { margin: 0; font-size: var(--aura-fs-lg); font-weight: 700; }
.insp__meta { display: flex; flex-wrap: wrap; gap: var(--aura-space-2); }
.insp__section { border-top: 1px solid var(--aura-border-soft); padding-top: var(--aura-space-3); }
.insp__title { margin: 0 0 var(--aura-space-3); font-size: var(--aura-fs-xs); text-transform: uppercase; letter-spacing: 1.2px; color: var(--aura-text-muted); }
.insp__content { display: flex; flex-direction: column; gap: var(--aura-space-2); }
.insp__empty { margin: 0; color: var(--aura-text-faint); font-size: var(--aura-fs-sm); }
.insp__hint { margin: 0; color: var(--aura-text-faint); font-size: var(--aura-fs-xs); }

.kv { display: flex; justify-content: space-between; gap: var(--aura-space-3); font-size: var(--aura-fs-sm); }
.kv__k { color: var(--aura-text-muted); flex: 0 0 auto; }
.kv__v { color: var(--aura-text-primary); text-align: right; word-break: break-word; }

.dna__row { display: grid; grid-template-columns: 96px 1fr auto; align-items: center; gap: var(--aura-space-2); }
.dna__label { color: var(--aura-text-secondary); font-size: var(--aura-fs-sm); overflow: hidden; text-overflow: ellipsis; }
.dna__input { width: 100%; padding: var(--aura-space-2); border-radius: var(--aura-radius-xs); background: var(--aura-bg-elevated); border: 1px solid var(--aura-border-soft); color: var(--aura-text-primary); font-size: var(--aura-fs-sm); outline: none; }
.dna__input:focus { border-color: var(--aura-accent); }
.dna__lock { width: 30px; height: 30px; border-radius: var(--aura-radius-xs); background: var(--aura-bg-panel-2); border: 1px solid var(--aura-border-soft); cursor: pointer; font-size: var(--aura-fs-sm); }
.dna__lock.is-locked { border-color: var(--aura-warn); background: var(--aura-warn-soft); }

.rel__list { display: flex; flex-direction: column; gap: var(--aura-space-2); }
.rel__row { display: flex; align-items: center; justify-content: space-between; gap: var(--aura-space-2); font-size: var(--aura-fs-sm); }
.rel__text { color: var(--aura-text-secondary); }
.rel__form { display: grid; grid-template-columns: 1fr 1fr auto; gap: var(--aura-space-2); margin-top: var(--aura-space-2); }

/* =========================================================================
   模态框
   ========================================================================= */
.modal { position: fixed; inset: 0; z-index: 75; display: flex; align-items: center; justify-content: center; padding: var(--aura-space-6); background: rgba(4, 4, 8, 0); backdrop-filter: blur(0px); transition: background 0.18s var(--aura-ease), backdrop-filter 0.18s var(--aura-ease); }
/* 🔴 层级纪律：模态框必须**高于浮动面板**，否则会被面板压住。
   实测缺陷：`nodeComposer` 的「查看结果图片」用 `openModal` 打开，而模态当时只有 z-index 60，
   生成面板却是 70/71 ⇒ **大图预览被提示词框遮住**（DOM 里有、看得见才怪）。
   现取 75：高于 `.aura-composer-layer`(70) / `.aura-composer`(71)、低于 `.toast-layer`(80，提示必须最上层)。 */
.modal.is-open { background: rgba(4, 4, 8, 0.62); backdrop-filter: blur(6px); }
.modal__panel { width: 100%; max-width: 520px; max-height: 86vh; overflow: auto; background: var(--aura-bg-panel); border: 1px solid var(--aura-border-mid); border-radius: var(--aura-radius-lg); box-shadow: var(--aura-shadow-lg); padding: var(--aura-space-5); display: flex; flex-direction: column; gap: var(--aura-space-4); opacity: 0; transform: translateY(10px) scale(0.98); transition: opacity 0.18s var(--aura-ease), transform 0.18s var(--aura-ease); }
.modal.is-open .modal__panel { opacity: 1; transform: none; }
.modal__panel--sm { max-width: 420px; }
.modal__panel--lg { max-width: 760px; }
.modal__panel--danger { border-color: rgba(255, 92, 122, 0.35); }
.modal__title { margin: 0; font-size: var(--aura-fs-lg); font-weight: 700; }
.modal__desc { margin: var(--aura-space-2) 0 0; color: var(--aura-text-muted); font-size: var(--aura-fs-sm); }
.modal__body { color: var(--aura-text-secondary); }
.modal__foot { display: flex; justify-content: flex-end; gap: var(--aura-space-3); }
.confirm__msg { margin: 0 0 var(--aura-space-3); }
.confirm__details { margin: 0; padding-left: var(--aura-space-5); color: var(--aura-text-muted); font-size: var(--aura-fs-sm); display: flex; flex-direction: column; gap: var(--aura-space-1); }

/* =========================================================================
   抽屉
   ========================================================================= */
.drawer-host { position: fixed; inset: 0; z-index: 55; pointer-events: none; }
.drawer-backdrop { position: absolute; inset: 0; background: rgba(4, 4, 8, 0); transition: background 0.2s var(--aura-ease); pointer-events: none; }
.drawer-host.is-open .drawer-backdrop { background: rgba(4, 4, 8, 0.5); pointer-events: auto; }
.drawer { position: absolute; top: 0; right: 0; height: 100%; max-width: 92vw; background: var(--aura-bg-panel); border-left: 1px solid var(--aura-border-mid); box-shadow: var(--aura-shadow-lg); display: flex; flex-direction: column; transform: translateX(100%); transition: transform 0.22s var(--aura-ease); pointer-events: auto; }
.drawer-host.is-open .drawer { transform: none; }
.drawer__head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--aura-space-3); padding: var(--aura-space-5); border-bottom: 1px solid var(--aura-border-soft); }
.drawer__title { margin: 0; font-size: var(--aura-fs-lg); }
.drawer__subtitle { margin: var(--aura-space-1) 0 0; color: var(--aura-text-muted); font-size: var(--aura-fs-sm); }
.drawer__body { flex: 1; overflow-y: auto; padding: var(--aura-space-5); }
.drawer__foot { padding: var(--aura-space-4) var(--aura-space-5); border-top: 1px solid var(--aura-border-soft); display: flex; gap: var(--aura-space-3); justify-content: flex-end; }
.drawer__foot:empty { display: none; }

/* =========================================================================
   Toast
   ========================================================================= */
.toast-layer { position: fixed; left: 50%; bottom: var(--aura-space-7); transform: translateX(-50%); z-index: 80; display: flex; flex-direction: column; gap: var(--aura-space-2); align-items: center; pointer-events: none; }
.toast-msg { display: flex; align-items: center; gap: var(--aura-space-3); padding: var(--aura-space-3) var(--aura-space-4); border-radius: var(--aura-radius-pill); background: var(--aura-bg-glass-strong); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border: 1px solid var(--aura-border-mid); box-shadow: var(--aura-shadow-lg); color: var(--aura-text-primary); font-size: var(--aura-fs-sm); opacity: 0; transform: translateY(12px); transition: opacity 0.2s var(--aura-ease), transform 0.2s var(--aura-ease); pointer-events: auto; }
.toast-msg.is-visible { opacity: 1; transform: none; }
.toast-msg--success { border-color: rgba(62, 213, 152, 0.4); }
.toast-msg--warn { border-color: rgba(245, 185, 66, 0.4); }
.toast-msg--danger { border-color: rgba(255, 92, 122, 0.45); }
.toast-msg__text { white-space: pre-wrap; }
.toast-msg__action { background: none; border: none; color: var(--aura-accent); cursor: pointer; font-size: var(--aura-fs-sm); }
.toast-msg__close { background: none; border: none; color: var(--aura-text-muted); cursor: pointer; font-size: var(--aura-fs-lg); line-height: 1; padding: 0 2px; }

/* =========================================================================
   任务胶囊（右下常驻）
   ========================================================================= */
.task-pill-root { position: fixed; right: var(--aura-space-5); bottom: var(--aura-space-5); z-index: 50; }
.tp { width: 300px; background: var(--aura-bg-glass-strong); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border: 1px solid var(--aura-border-mid); border-radius: var(--aura-radius-lg); box-shadow: var(--aura-shadow-lg); overflow: hidden; }
.tp__head { width: 100%; display: flex; align-items: center; gap: var(--aura-space-2); padding: var(--aura-space-3) var(--aura-space-4); background: none; border: none; color: inherit; cursor: pointer; }
.tp__summary { display: flex; align-items: center; gap: var(--aura-space-2); width: 100%; }
.tp__glyph { color: var(--aura-accent-2); }
.tp__label { flex: 1; text-align: left; font-size: var(--aura-fs-sm); color: var(--aura-text-secondary); }
.tp__count { font-size: var(--aura-fs-xs); color: var(--aura-text-muted); }
.tp__chevron { color: var(--aura-text-muted); font-size: var(--aura-fs-xs); }
.tp__bar { grid-column: 1 / -1; height: 4px; border-radius: 999px; background: var(--aura-bg-panel-2); overflow: hidden; margin-top: var(--aura-space-2); }
.tp__bar-fill { display: block; height: 100%; background: linear-gradient(90deg, var(--aura-accent), var(--aura-accent-2)); transition: width 0.3s var(--aura-ease); }
.tp__list { max-height: 320px; overflow-y: auto; border-top: 1px solid var(--aura-border-soft); padding: var(--aura-space-3); display: flex; flex-direction: column; gap: var(--aura-space-3); }
.tp__empty { margin: 0; color: var(--aura-text-muted); font-size: var(--aura-fs-sm); }
.tp__row { display: flex; flex-direction: column; gap: var(--aura-space-2); padding: var(--aura-space-3); border-radius: var(--aura-radius-md); background: var(--aura-bg-panel); border: 1px solid var(--aura-border-soft); }
.tp__row-main { display: flex; align-items: center; justify-content: space-between; gap: var(--aura-space-2); }
.tp__id { font-family: var(--aura-font-mono); font-size: var(--aura-fs-xs); color: var(--aura-text-secondary); }
.tp__prompt { color: var(--aura-text-muted); font-size: var(--aura-fs-xs); }
.tp__bar--row { margin-top: 0; }
.tp__row-actions { display: flex; gap: var(--aura-space-2); justify-content: flex-end; }

/* =========================================================================
   错误面板
   ========================================================================= */
.error-panel { max-width: 720px; margin: var(--aura-space-8) auto; padding: var(--aura-space-6); border-radius: var(--aura-radius-lg); background: var(--aura-bg-panel); border: 1px solid rgba(255, 92, 122, 0.35); }
.error-panel__title { margin: 0 0 var(--aura-space-2); font-size: var(--aura-fs-xl); }
.error-panel__path { margin: 0 0 var(--aura-space-3); color: var(--aura-text-muted); font-family: var(--aura-font-mono); font-size: var(--aura-fs-sm); }
.error-panel__msg { margin: 0 0 var(--aura-space-3); padding: var(--aura-space-3); border-radius: var(--aura-radius-sm); background: var(--aura-bg-elevated); color: var(--aura-danger); font-family: var(--aura-font-mono); font-size: var(--aura-fs-xs); white-space: pre-wrap; overflow-x: auto; }
.error-panel__hint { margin: 0; color: var(--aura-text-muted); font-size: var(--aura-fs-sm); }

/* =========================================================================
   响应式（Desktop First：1280 / 1440 / 1920）
   ========================================================================= */
@media (max-width: 1440px) {
  :root { --aura-inspector-w: 340px; }
}
@media (max-width: 1180px) {
  .split { grid-template-columns: 1fr; }
  .inspector-root { flex-basis: 300px; width: 300px; }
}
@media (max-width: 900px) {
  .topnav { padding: 0 var(--aura-space-4); }
  .topnav__left { gap: var(--aura-space-3); }
  .nav { display: none; }
  .brand__en { display: none; }
  .view { padding: var(--aura-space-5) var(--aura-space-4) var(--aura-space-6); }
  .inspector-root { display: none; }
  .tp { width: 260px; }
}
@media (max-width: 720px) {
  :root { --aura-fs-3xl: 36px; --aura-fs-2xl: 26px; }
  .composer__actions { flex-direction: column; align-items: stretch; }
  .primary-btn { width: 100%; }
}

/* =========================================================================
   账户 / 登录面板（#avatar 展开；锚定于 .topnav）
   ========================================================================= */
.auth-panel {
  position: absolute; top: calc(var(--aura-nav-h) - 6px); right: var(--aura-space-6);
  width: 320px; z-index: 61; display: flex; flex-direction: column; gap: var(--aura-space-3);
  padding: var(--aura-space-4); border-radius: var(--aura-radius-md);
  background: var(--aura-bg-panel); border: 1px solid var(--aura-border-mid);
  box-shadow: var(--aura-shadow-lg);
}
.auth-panel[hidden] { display: none; }
.auth-panel__head { display: flex; align-items: center; justify-content: space-between; }
.auth-panel__title { font-size: var(--aura-fs-md); font-weight: 600; color: var(--aura-text-primary); }
.auth-panel__tabs { display: flex; flex-wrap: wrap; gap: var(--aura-space-2); }
.auth-panel__tab {
  padding: var(--aura-space-1) var(--aura-space-3); border-radius: var(--aura-radius-pill);
  background: transparent; border: 1px solid var(--aura-border-soft);
  color: var(--aura-text-secondary); font-size: var(--aura-fs-sm); cursor: pointer;
}
.auth-panel__tab:hover { border-color: var(--aura-border-strong); color: var(--aura-text-primary); }
.auth-panel__tab.is-active { background: var(--aura-accent-soft); border-color: var(--aura-accent); color: var(--aura-text-primary); }
.auth-panel__field { display: flex; flex-direction: column; gap: var(--aura-space-1); }
.auth-panel__label { font-size: var(--aura-fs-xs); color: var(--aura-text-muted); }
.auth-panel__input {
  width: 100%; padding: var(--aura-space-2) var(--aura-space-3); border-radius: var(--aura-radius-sm);
  background: var(--aura-bg-base); border: 1px solid var(--aura-border-mid);
  color: var(--aura-text-primary); font-size: var(--aura-fs-sm);
}
.auth-panel__input:focus { outline: none; border-color: var(--aura-accent); }
.auth-panel__row { display: flex; align-items: flex-end; gap: var(--aura-space-2); }
.auth-panel__row .auth-panel__field { flex: 1 1 auto; }
.auth-panel__notice { margin: 0; font-size: var(--aura-fs-xs); padding: var(--aura-space-2); border-radius: var(--aura-radius-xs); }
.auth-panel__notice--ok { color: var(--aura-ok); background: var(--aura-ok-soft); }
.auth-panel__notice--danger { color: var(--aura-danger); background: var(--aura-danger-soft); }
.auth-panel__notice--muted { color: var(--aura-text-muted); background: var(--aura-bg-panel-2); }
.auth-panel__user { display: flex; flex-direction: column; gap: 2px; }
.auth-panel__email { margin: 0; font-size: var(--aura-fs-sm); color: var(--aura-text-primary); word-break: break-all; }
.auth-panel__hint { margin: 0; font-size: var(--aura-fs-xs); color: var(--aura-text-muted); }
.auth-panel__foot { margin: 0; font-size: var(--aura-fs-xs); color: var(--aura-text-faint); }

/* =========================================================================
   管理后台（view--admin）
   ========================================================================= */
.admin-body { display: flex; flex-direction: column; gap: var(--aura-space-5); }

/* ── 功能开关面板（管理后台最常用的一块）────────────────────────────────────
   面板本身只是 UI；开关的**清单与语义**在 shared/featureFlags.js（唯一事实源）。 */
.admin-flags { display: flex; flex-direction: column; gap: var(--aura-space-3); }
.block__hint { margin: 0; font-size: var(--aura-fs-xs); color: var(--aura-text-muted); line-height: 1.7; }
.admin-flags__group { font-size: var(--aura-fs-xs); letter-spacing: .06em; color: var(--aura-text-muted);
  margin-top: var(--aura-space-2); }
.admin-flag { display: flex; gap: var(--aura-space-3); align-items: flex-start; cursor: pointer;
  padding: var(--aura-space-3); border-radius: var(--aura-radius-sm);
  background: var(--aura-bg-panel); border: 1px solid var(--aura-border-soft); }
.admin-flag:hover { border-color: var(--aura-border-mid); }
.admin-flag__box { margin-top: 3px; width: 16px; height: 16px; accent-color: var(--aura-accent); flex: 0 0 auto; }
.admin-flag__body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.admin-flag__head { display: flex; align-items: center; gap: var(--aura-space-2); flex-wrap: wrap; }
.admin-flag__name { font-size: var(--aura-fs-sm); font-weight: 600; color: var(--aura-text-primary); }
.admin-flag__desc { font-size: var(--aura-fs-xs); color: var(--aura-text-secondary); line-height: 1.7; }
.admin-flag__key { font-size: 11px; color: var(--aura-text-faint); font-family: var(--aura-font-mono, ui-monospace, monospace); }

/* 界面管理（一级导航配置）：每行复用 .admin-flag 骨架，右侧再加一列上移/下移/删除操作。 */
.admin-navcfg__ops { display: flex; gap: var(--aura-space-2); align-items: center; flex: 0 0 auto; margin-left: auto; }
.admin-flag__body .aura-admin__input { margin-top: 2px; }

/* ═══════════════════════════════════════════════════════════════════════════
   节点生成面板 —— 提示词发送器 / 结果接收器
   结构与职责见 web/js/ui/nodeComposer.js。

   ⚠️ 类名是 `aura-genpanel` **不是** `composer` —— 这里曾用 `.composer`，
   与首页/新建页的提示词卡片（views/home.js、views/create.js 用的 `.composer`）
   **撞名**，两条规则互相污染（画布面板被限成 max-width:760px 居中，
   首页卡片则被套上 height:100% + flex）。同一个类名代表两个不同组件是隐患，
   故本组件独立命名；`.composer*` 那套留给首页/新建页。

   位置：**挂在被点节点的正下方，并跟着节点走**（平移/缩放/拖节点都会重新定位）。
   只在选中单个节点时出现（用户要求「不要常驻」）。
   ⚠️ 沿革（别再改回去）：一度做成"贴节点右侧"→ 又改成"画布区最底部停靠条"，
   两次都不是用户要的。用户 2026-09-25 明确：「我要的是**贴着节点（窗口）下方**，
   你放这么下面干嘛，**高度给多一点不要小气**」⇒ 终解 = 锚在节点下方 + 给足高度。
   ═══════════════════════════════════════════════════════════════════════════ */

/* 浮动层本身不拦事件，否则会盖住画布导致点不到节点；
   只有面板本体（.aura-genpanel）恢复可交互。 */
.aura-composer-layer { position: fixed; inset: 0; z-index: 70; pointer-events: none; }
.aura-composer-layer > * { pointer-events: auto; }

.aura-genpanel {
  position: fixed; z-index: 71; display: flex; flex-direction: column; gap: 8px;
  padding: 10px 12px; box-sizing: border-box;
  width: min(900px, calc(100vw - 32px));
  background: var(--aura-bg-elevated, #171724);
  border: 1px solid var(--aura-border-strong, #3a3a52);
  border-radius: 14px; box-shadow: 0 18px 48px rgba(0, 0, 0, .5);
  color: var(--aura-text-primary);
}

/* 提示词框高度 —— 用变量单点控制，放大态 = 紧凑态 × 2（**正好一倍**）。
   ⚠️ 用户要求：「点击放大需要**默认输入框高度设置放大一倍**」+
      「放大和缩小**不仅输入框变宽了，高度也要分别独立**」⇒ 宽、高**各有一个值**。

   🔴 高度必须由 `height` **钉死**在变量上，不能只给 `min-height`：
      只给 min-height 时，textarea 的 `rows` 会算出更高的内在高度（实测 188px ≠ 变量 170px），
      于是"放大 = 变量×2 = 340"与"紧凑实际 188"不成倍数关系 —— 用户要的是**翻倍**，不是"变高一点"。
      钉死之后：紧凑 190 → 放大 380，正好一倍。 */
.aura-genpanel { --gp-prompt-h: 190px; }

/* 放大态：**宽度与高度各自独立加大**
   （宽度 900 → 1180；输入框高度由下面的 calc 正好翻倍） */
.aura-genpanel--expanded {
  width: min(1180px, calc(100vw - 32px));
  --gp-prompt-h: 380px;
}
/* 放大态的参数区：空间够了，允许它换行成多列（紧凑态仍强制一行，见 .aura-genpanel__row 注释） */
.aura-genpanel--expanded .aura-genpanel__row { flex-wrap: wrap; }

/* 指向被点节点的小箭头 —— 让"这个面板属于那个节点"一眼可见。
   `data-arrow` 由 JS 按最终方位设置：up = 面板在节点下方（箭头朝上）；
   down = 面板翻到了节点上方（箭头朝下）。错位时 JS 会把它隐藏。 */
.aura-genpanel__arrow { position: absolute; width: 14px; height: 8px; margin-left: -7px;
  background: var(--aura-bg-elevated, #171724); pointer-events: none; }
.aura-genpanel[data-arrow="up"] .aura-genpanel__arrow {
  top: -8px; clip-path: polygon(50% 0, 100% 100%, 0 100%); }
.aura-genpanel[data-arrow="down"] .aura-genpanel__arrow {
  bottom: -8px; clip-path: polygon(0 0, 100% 0, 50% 100%); }
.aura-genpanel__arrow[hidden] { display: none; }
/* ⚙ 通道未配置时的警示态：让"为什么点发送没结果"一眼可见（而不是等报错才知道） */
.aura-genpanel__icon-btn.is-unconfigured { color: var(--aura-warn, #f0b429); border-color: var(--aura-warn, #f0b429); }

/* ── 「图片 / 视频模型通道设置」表单 ────────────────────────────────────────
   字段表由 generationChannels.js#CHANNEL_FIELDS 驱动（不在样式/界面里另抄一份）。 */
.aura-chanform { display: flex; flex-direction: column; gap: 14px; max-height: 60vh; overflow: auto; }
.aura-chanform__group { border: 1px solid var(--aura-border-mid); border-radius: 10px; padding: 10px 12px; margin: 0; }
.aura-chanform__group legend { padding: 0 6px; color: var(--aura-text-secondary); font-size: 12px; font-weight: 600; }
.aura-chanform__row { display: grid; grid-template-columns: 140px minmax(0, 1fr); align-items: center; gap: 8px; margin-bottom: 8px; }
.aura-chanform__label { color: var(--aura-text-secondary); font-size: 12px; }
.aura-chanform__row input, .aura-chanform__row select {
  width: 100%; box-sizing: border-box; padding: 6px 8px; border-radius: 8px;
  border: 1px solid var(--aura-border-mid); background: var(--aura-bg-panel-2);
  color: var(--aura-text-primary); font-size: 12px; font-family: inherit;
}
.aura-chanform__hint { grid-column: 2; color: var(--aura-text-faint); font-size: 11px; line-height: 1.5; }

/* ── 从桌面拖文件进画布时的落点高亮 ────────────────────────────────────────
   没有视觉反馈的话，用户不知道"能不能拖到这里"，会以为是没反应。 */
.aura-ws__canvas-wrap.is-drop-target { outline: 2px dashed var(--aura-accent, #7c5cff); outline-offset: -6px; }
.aura-ws__canvas-wrap.is-drop-target::after {
  content: '松手即可放入画布';
  position: absolute; top: 12px; left: 50%; transform: translateX(-50%);
  padding: 6px 14px; border-radius: 999px; pointer-events: none;
  background: var(--aura-accent, #7c5cff); color: #fff; font-size: 12px;
}

/* ── 「历史记录」入口 + 面板 ──────────────────────────────────────────────── */
.aura-ws__history-btn {
  position: absolute; top: 10px; right: 12px; z-index: 5;
  padding: 6px 12px; border-radius: 999px; cursor: pointer;
  border: 1px solid var(--aura-border-strong, #3a3a52);
  background: var(--aura-bg-elevated, #171724); color: var(--aura-text-secondary, #9a9ab0);
  font-size: 12px; font-family: inherit;
}
.aura-ws__history-btn:hover { color: var(--aura-text-primary); border-color: var(--aura-accent, #7c5cff); }

.aura-history { max-height: 58vh; overflow: auto; }
.aura-history__empty { color: var(--aura-text-muted); font-size: 13px; padding: 18px 4px; text-align: center; }
.aura-history__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px; }
.aura-history__card {
  border: 1px solid var(--aura-border-mid); border-radius: 10px; overflow: hidden;
  cursor: pointer; background: var(--aura-bg-panel-2); transition: border-color .15s;
}
.aura-history__card:hover { border-color: var(--aura-accent, #7c5cff); }
.aura-history__thumb {
  height: 84px; display: flex; align-items: center; justify-content: center;
  font-size: 26px; background: var(--aura-node-thumb, #101018);
  background-size: cover; background-position: center;
}
.aura-history__meta {
  padding: 6px 8px; font-size: 11px; color: var(--aura-text-secondary);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* ── 视频播放器弹窗 ──────────────────────────────────────────────────────── */
.aura-player { width: 100%; }
.aura-player__video {
  width: 100%; max-height: 62vh; border-radius: 10px; background: #000; display: block;
}

.aura-genpanel__head { display: flex; align-items: center; justify-content: space-between;
  gap: 8px; flex: 0 0 auto; }
.aura-genpanel__head-left { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; min-width: 0; }
.aura-genpanel__target { font-size: 13px; font-weight: 600; color: var(--aura-text-primary);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 220px; }
.aura-genpanel__kind { font-size: 11px; color: var(--aura-text-muted); }
.aura-genpanel__refs { font-size: 11px; color: var(--aura-text-faint); }

/* 视频**参考图模式**选择器（综合参考 / 首尾帧）—— 在抬头**左边**、标题左侧。
   由 nodeComposer.js#renderRefMode 按需填充：容器常驻但为空时**完全零宽**
   （`:empty` 兜住"没摆控件时不占任何横向间距"），只有真正有得选时才出现那个 <select>。 */
.aura-genpanel__refmode-wrap { display: inline-flex; align-items: center; flex: 0 0 auto; }
.aura-genpanel__refmode-wrap:empty { display: none; }
.aura-genpanel__refmode { height: 24px; max-width: 108px; padding: 0 4px; border-radius: 6px;
  border: 1px solid var(--aura-border-soft); background: var(--aura-bg-panel);
  color: var(--aura-text-primary); font-size: 11px; font-family: inherit; cursor: pointer; }
.aura-genpanel__refmode option { background: var(--aura-bg-panel); color: var(--aura-text-primary); }
.aura-genpanel__refmode:disabled { opacity: .55; cursor: default; }

/* 连线引用的**可见列表**（chip 带）。由 nodeComposer.js#renderRefs 填充。
   ⚠️ 布局约束（用户："占用空间不能超过一行"）：
      `flex-wrap: nowrap` + `overflow-x: auto` ⇒ 无论引用多少项都只占**一行**高度，
      放不下就横向滚动；**没有引用时元素带 `hidden`**（`display:none`）⇒ 完全不占高度。 */
.aura-genpanel__refs-list { display: flex; align-items: center; gap: 6px; flex: 0 0 auto;
  flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden;
  scrollbar-width: thin; padding-bottom: 2px; }
.aura-genpanel__refs-list[hidden] { display: none; }
.aura-genpanel__ref-chip { display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto;
  height: 24px; padding: 0 9px; border-radius: 999px; white-space: nowrap;
  border: 1px solid var(--aura-border-soft); background: var(--aura-bg-panel);
  font-size: 11px; color: var(--aura-text-secondary); }
.aura-genpanel__ref-chip-cat { color: var(--aura-text-muted); }
.aura-genpanel__ref-chip-label { color: var(--aura-text-primary); font-weight: 600;
  max-width: 120px; overflow: hidden; text-overflow: ellipsis; }
.aura-genpanel__ref-chip-sum { color: var(--aura-text-faint);
  max-width: 160px; overflow: hidden; text-overflow: ellipsis; }
/* 引用 chip 上的「取消引用」× 按钮（用户点名要的）：
     「在引用列表的节点名称旁边增加个 × 按钮可以直接取消引用」。
   语义 = **删掉这条连线**（引用 = 连线；见 nodeComposer#renderRefs / views/workspace#onUnlinkRef）。
   ⚠️ 不把 chip（定高 24px、内容盒 22px）撑高：16×16 + flex:0 0 auto + line-height:1。
   ⚠️ 必须**看得出来能点**（不是装饰）：hover 变危险色 + 圆形底 + `cursor:pointer`。 */
.aura-genpanel__ref-chip-x { flex: 0 0 auto; width: 16px; height: 16px; padding: 0;
  display: grid; place-items: center; border-radius: 50%; line-height: 1;
  border: 1px solid var(--aura-border-soft); background: transparent;
  color: var(--aura-text-muted); font-size: 12px; font-family: inherit; cursor: pointer; }
.aura-genpanel__ref-chip-x:hover { color: var(--aura-danger); border-color: var(--aura-danger);
  background: var(--aura-danger-soft); }
/* 引用 chip 里的**小方块缩略图**（用户：「引用的素材最好有个小方块略缩图，不再是文件名」）。
   ⚠️ 布局约束：必须**不把 chip 撑高**（chip 定高 24px、内容盒 22px）——
      故 20×20 + `flex:0 0 auto`（不参与拉伸）+ `display:block`（消除 img 基线空隙）。
      `object-fit: cover` 让非方形素材也填满方块、不拉变形。 */
.aura-genpanel__ref-thumb { width: 20px; height: 20px; flex: 0 0 auto; display: block;
  object-fit: cover; border-radius: 4px; background: var(--aura-bg-panel-2); }
.aura-genpanel__head-actions { display: flex; gap: 4px; flex: 0 0 auto; }
/* 右上角的「放大 / 关闭」—— 图标按钮，hover 才明显 */
.aura-genpanel__icon-btn { width: 26px; height: 26px; display: grid; place-items: center;
  border-radius: 7px; cursor: pointer; font-size: 13px; line-height: 1;
  border: 1px solid var(--aura-border-soft); background: var(--aura-bg-panel);
  color: var(--aura-text-secondary); }
.aura-genpanel__icon-btn:hover { border-color: var(--aura-border-strong); color: var(--aura-text-primary); }

.aura-genpanel__notice { font-size: 12px; padding: 5px 8px; border-radius: 7px; flex: 0 0 auto; }
.aura-genpanel__notice--ok { color: var(--aura-ok); background: var(--aura-ok-soft); }
.aura-genpanel__notice--warn { color: var(--aura-warn); background: var(--aura-warn-soft); }
.aura-genpanel__notice--danger { color: var(--aura-danger); background: var(--aura-danger-soft); }

/* ── 结果区（面板作为"接收器"的落点，见 nodeComposer.js#renderResult）──────
   面板主体（提示词框）**下方**的独立块：显示文本结果 / 图片缩略图（可点开大图）/ 失败原因。
   ⚠️ 它**不进**底部参数行（那里 `nowrap` 强制一行，"不超过一行"只约束那一行）；
   ⚠️ **没有结果时整块 `hidden`**（`display:none`）⇒ 零高度，不撑破布局（同 `.aura-genpanel__refs-list`）。 */
.aura-genpanel__result { display: flex; flex-direction: column; gap: 6px; flex: 0 0 auto; }
.aura-genpanel__result[hidden] { display: none; }
.aura-genpanel__result-error { font-size: 12px; line-height: 1.6; padding: 5px 8px; border-radius: 7px;
  color: var(--aura-danger); background: var(--aura-danger-soft); word-break: break-word; }
.aura-genpanel__result-media { display: flex; align-items: flex-start; }
.aura-genpanel__result-img { max-width: 100%; max-height: 180px; border-radius: 8px; cursor: zoom-in;
  border: 1px solid var(--aura-border-soft); background: var(--aura-bg-panel); display: block; }
.aura-genpanel__result-cap { font-size: 12px; color: var(--aura-text-secondary); }
.aura-genpanel__result-text { font-size: 12px; line-height: 1.6; padding: 8px 10px; border-radius: 8px;
  border: 1px solid var(--aura-border-soft); background: var(--aura-bg-panel-2);
  color: var(--aura-text-primary); white-space: pre-wrap; word-break: break-word;
  max-height: 200px; overflow: auto; margin: 0; }
.aura-genpanel__preview { display: flex; justify-content: center; }
.aura-genpanel__preview-img { max-width: 100%; max-height: 70vh; border-radius: 10px; display: block; }

/* 提示词输入框 —— 参考图里那个"浅色框"，是这一整块的主体。
   高度由 `--gp-prompt-h` **钉死**（紧凑 190px / 放大 380px，正好一倍）；
   `resize:vertical` 允许用户再手动拉大。 */
.aura-genpanel__prompt { flex: 0 0 auto; height: var(--gp-prompt-h); min-height: var(--gp-prompt-h);
  width: 100%; resize: vertical; box-sizing: border-box;
  padding: 10px 12px; border-radius: 10px; border: 1px solid var(--aura-border-mid);
  background: var(--aura-bg-panel-2); color: var(--aura-text-primary);
  font-size: 13px; line-height: 1.6; font-family: inherit; cursor: text;
  /* 🔴 它现在是 `contenteditable`（div），不再是 textarea：
     · `overflow-y:auto` 是 `resize:vertical` 出现拖拽手柄的**前提**（overflow:visible 无手柄）；
     · `pre-wrap` 让 `\n` 文本节点真的换行（Enter 换行的落点，见 nodeComposer#insertPlainTextAtCaret）；
     · `word-break` 防止长地址把框撑破。 */
  overflow-y: auto; white-space: pre-wrap; word-break: break-word; }
/* 占位文案：`contenteditable` 没有原生 placeholder ⇒ 空框时用 `::before` 撑。
   `is-empty` 由 nodeComposer 的 syncPromptFromDom / renderPromptDom 维护（真为空才加）。 */
.aura-genpanel__prompt.is-empty::before { content: attr(data-placeholder); color: var(--aura-text-faint);
  pointer-events: none; }
.aura-genpanel__prompt:focus { outline: none; border-color: var(--aura-accent); }
/* 生成期间不可编辑（contenteditable="false" 由 setBusy 落地）——给一点视觉提示。 */
.aura-genpanel__prompt.is-busy { opacity: .6; cursor: default; }

/* ── `@` 引用 chip（提示词框**内**的模块框）──────────────────────────────────
   用户诉求②③：「成功引用后要以模块框的格式体现而不是文字」「回删时删掉一整个引用」。
   chip 是 `contenteditable="false"` 的内联元素 ⇒ 浏览器把它当**一个编辑单元**，
   一次 Backspace 整块删除（**不写任何 caret 位移算术**，见 nodeComposer#buildAtChip）。
   ⚠️ 必须 `inline-flex` + `vertical-align: middle`：内联原子元素不能换行、不许把行高撑高。 */
.aura-at-chip { display: inline-flex; align-items: center; gap: 4px; vertical-align: middle;
  height: 18px; padding: 0 6px; margin: 0 1px; border-radius: 5px; white-space: nowrap;
  border: 1px solid var(--aura-border-strong); background: var(--aura-accent-soft, rgba(124, 92, 255, .16));
  font-size: 12px; line-height: 1; color: var(--aura-text-primary); user-select: none; }
/* chip 里的**小方块缩略图**（用户诉求④：「引用的素材最好有个小方块略缩图，不再是文件名」）。
   ⚠️ 16×16 + `object-fit:cover` + `flex:0 0 auto`：小方块、非方形素材不拉变形、
   且**不把 chip / 输入框行高撑高**（18px chip 内留 1px 余量）。 */
.aura-at-chip__thumb { width: 16px; height: 16px; flex: 0 0 auto; display: block;
  object-fit: cover; border-radius: 3px; background: var(--aura-bg-panel-2); }
.aura-at-chip__label { max-width: 160px; overflow: hidden; text-overflow: ellipsis; }

/* ── `@` 引用菜单（2026-10-02 形态重做：锚在 **caret 右侧**、竖排、带缩略图）──────
   用户原话第二段：「输入 @ 以后在**输入光标右边**出现一个候选框，**竖直排列**，可以鼠标单击，
   显示的是**节点名称加上节点略缩图**」。
   🔴 `left/top` 由 nodeComposer.js 的 `placeAtMenu()` 按 **caret 的视口坐标**算好（含翻转）⇒
      这里必须 `position: fixed`：这样 `left/top` 直接是视口坐标，与 caret 同一坐标系，
      也**不随面板移动**（面板移动时 JS 会重摆，见 `reposition()`）。
   🔴 旧实现锚在"提示词框下沿、与框同宽"—— 面板底部停靠时菜单落到视口之外，
      用户按 @ 什么都看不到（这就是"没有任何提示"的真因）。
   ⚠️ `z-index` 要比提示词框高，否则菜单会被输入框盖住（面板内同为定位元素比层级）。 */
.aura-genpanel__atmenu { position: fixed; z-index: 3; max-height: 240px; overflow-y: auto;
  box-sizing: border-box; padding: 4px; border-radius: 10px;
  width: max-content; max-width: 320px; min-width: 160px;
  background: var(--aura-bg-panel-2, #1d1d2c); border: 1px solid var(--aura-border-strong, #3a3a52);
  box-shadow: 0 12px 32px rgba(0, 0, 0, .5); }
/* `hidden` 必须能压住上面的 `position: fixed`（否则 hidden 元素照样显示） */
.aura-genpanel__atmenu[hidden] { display: none; }
/* 每一项自带缩略图 + 名称，天然**竖直堆叠**（块级 div 逐行排列） */
.aura-genpanel__atmenu-item { display: flex; align-items: center; gap: 8px;
  padding: 5px 8px; border-radius: 7px; cursor: pointer; }
.aura-genpanel__atmenu-item:hover, .aura-genpanel__atmenu-item.is-active {
  background: var(--aura-accent-soft, rgba(124, 92, 255, .16)); }
/* 缩略图的小方块（用户要"节点略缩图"）：固定 28×28、cover 不拉变形、失败即被移除 */
.aura-genpanel__atmenu-thumb-wrap { flex: 0 0 auto; width: 28px; height: 28px; display: block;
  border-radius: 5px; overflow: hidden; background: var(--aura-bg-panel); }
.aura-genpanel__atmenu-thumb { width: 28px; height: 28px; display: block; object-fit: cover; }
.aura-genpanel__atmenu-cat { flex: 0 0 auto; font-size: 11px; color: var(--aura-text-muted); }
.aura-genpanel__atmenu-label { min-width: 0; font-size: 12px; font-weight: 600;
  color: var(--aura-text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 没有候选时的**不可选**说明行：让"为什么按了 @ 是空的"一眼可见 */
.aura-genpanel__atmenu-empty { padding: 7px 8px; font-size: 12px; color: var(--aura-text-muted); }
/* 候选的**分组标题**（「已引用」/「未连线（选中即连线）」）：不可点，只做分隔说明 */
.aura-genpanel__atmenu-group { padding: 6px 8px 2px; font-size: 11px; font-weight: 600;
  color: var(--aura-text-muted); letter-spacing: .02em; }

/* ── 底部那一行：模型 + **全部调整** + 上传/发送。──────────────
   ⚠️ 用户明确要求「所有的调整需要简洁，**占用空间不能超过一行**」⇒
      `flex-wrap: nowrap` 强制单行；参数多到一行放不下时**横向滚动**，
      绝不换行（换行就变成两行了，直接违反要求）。
      说明文字（hint）因此不进版面，改挂 `title` 悬浮提示。 */
.aura-genpanel__row { display: flex; align-items: center; gap: 6px; flex: 0 0 auto;
  flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden;
  scrollbar-width: thin; padding-bottom: 2px; }
.aura-genpanel__params { display: flex; align-items: center; gap: 6px; flex-wrap: nowrap; flex: 0 0 auto; }
.aura-genpanel__spacer { flex: 1 1 auto; min-width: 8px; }

/* 单个参数的紧凑控件：小标签 + 窄输入，整体高度与按钮一致（30px） */
.aura-genpanel__chip { display: inline-flex; align-items: center; gap: 3px; flex: 0 0 auto;
  height: 30px; padding: 0 6px; border-radius: 8px;
  border: 1px solid var(--aura-border-soft); background: var(--aura-bg-panel); }
.aura-genpanel__chip-k { font-size: 11px; color: var(--aura-text-muted); white-space: nowrap; }
.aura-genpanel__chip-v { height: 24px; border: none; background: transparent; outline: none;
  color: var(--aura-text-primary); font-size: 12px; font-family: inherit;
  padding: 0; max-width: 72px; }
.aura-genpanel__chip-v option { background: var(--aura-bg-panel); color: var(--aura-text-primary); }
/* 数值型：窄到刚够 4 位数，避免它把整行撑宽 */
.aura-genpanel__chip-num { width: 54px; max-width: 54px; text-align: right;
  font-variant-numeric: tabular-nums; }
.aura-genpanel__chip-check { width: 14px; height: 14px; margin: 0; flex: 0 0 auto; }
.aura-genpanel__chip--toggle { cursor: pointer; }
/* 时长 chip：鼠标**一悬停**就显示 ←→（可拖提示），拖动期间保持（.--dragging）。
   ⚠️ 只挂在时长 chip 的 `--draggable` 上，不加在通用 `.aura-genpanel__chip`
   （否则 select / toggle 等其它 chip 也会变成 ←→）。 */
.aura-genpanel__chip--draggable { cursor: ew-resize; }
.aura-genpanel__chip--draggable .aura-genpanel__chip-num { cursor: ew-resize; }
/* 拖动进行中：保持 ←→（见 nodeComposer.js#attachDurationDrag）。 */
.aura-genpanel__chip--dragging { cursor: ew-resize; }
.aura-genpanel__chip--dragging .aura-genpanel__chip-num { cursor: ew-resize; }

/* 模型选择在**左下角**（用户明确要求），故它在 row 的第一个位置 */
.aura-genpanel__model { max-width: 132px; }

/* 「一个已配置模型都没有」时的中文原因（由 nodeComposer.js 按 `data-role="model-hint"` 写入）。
   ⚠️ 它**不进**底部那一行（那里 `nowrap` 强制单行，长句会把整行撑破），
   而是单独占一行放在面板底部；只在真的没有可选模型时出现。 */
.aura-genpanel__model-hint { font-size: 12px; line-height: 1.6; flex: 0 0 auto;
  padding: 5px 8px; border-radius: 7px;
  color: var(--aura-warn); background: var(--aura-warn-soft); }

/* 「从弧光侧引入剧本」列表（模态内）——数据来自 arc_list_pushed_content。 */
.aura-pushed { display: flex; flex-direction: column; gap: 10px; }
.aura-pushed__note { font-size: 12px; line-height: 1.6; color: var(--aura-warn);
  background: var(--aura-warn-soft); padding: 6px 9px; border-radius: 7px; }
.aura-pushed__state { font-size: 13px; line-height: 1.7; color: var(--aura-text-secondary);
  white-space: pre-wrap; }
.aura-pushed__state--error { color: var(--aura-danger); }
.aura-pushed__list { display: flex; flex-direction: column; gap: 8px; }
.aura-pushed__row { display: flex; flex-direction: column; gap: 3px; align-items: flex-start;
  text-align: left; padding: 9px 11px; border-radius: 8px; cursor: pointer;
  border: 1px solid var(--aura-border-soft); background: var(--aura-bg-panel);
  color: var(--aura-text-primary); }
.aura-pushed__row:hover { border-color: var(--aura-accent); }
.aura-pushed__row-title { font-size: 13px; font-weight: 600; }
.aura-pushed__row-meta { font-size: 12px; color: var(--aura-text-secondary); }

.aura-genpanel__btn { height: 30px; padding: 0 11px; border-radius: 8px; cursor: pointer; font-size: 12px;
  flex: 0 0 auto; border: 1px solid var(--aura-border-soft); background: var(--aura-bg-panel);
  color: var(--aura-text-primary); }
.aura-genpanel__btn:hover { border-color: var(--aura-border-strong); }
.aura-genpanel__btn--send { background: var(--aura-accent); border-color: var(--aura-accent);
  color: #fff; font-weight: 600; }
.aura-genpanel__btn:disabled { opacity: .5; cursor: not-allowed; }
.admin-gate { display: flex; flex-direction: column; gap: var(--aura-space-3); align-items: flex-start;
  padding: var(--aura-space-6); border: 1px dashed var(--aura-border-mid);
  border-radius: var(--aura-radius-lg); background: var(--aura-bg-panel); }
.admin-gate__hint { margin: 0; color: var(--aura-text-secondary); font-size: var(--aura-fs-sm); }
.admin-form { gap: var(--aura-space-3); }
.admin-roster { gap: var(--aura-space-3); }
.admin-field { display: flex; flex-direction: column; gap: var(--aura-space-1); }
.admin-field--inline { flex-direction: row; align-items: center; gap: var(--aura-space-2); }
.admin-label { font-size: var(--aura-fs-xs); color: var(--aura-text-muted); }
.admin-input, .admin-textarea {
  width: 100%; padding: var(--aura-space-2) var(--aura-space-3); border-radius: var(--aura-radius-sm);
  background: var(--aura-bg-base); border: 1px solid var(--aura-border-mid);
  color: var(--aura-text-primary); font-size: var(--aura-fs-sm); font-family: inherit;
}
.admin-textarea { font-family: var(--aura-font-mono, ui-monospace, monospace); resize: vertical; }
.admin-input:focus, .admin-textarea:focus { outline: none; border-color: var(--aura-accent); }
.admin-actions { display: flex; gap: var(--aura-space-3); }
.admin-table { display: flex; flex-direction: column; border: 1px solid var(--aura-border-soft); border-radius: var(--aura-radius-md); overflow: hidden; }
.admin-row { display: grid; grid-template-columns: 1.4fr 2.6fr 0.7fr 1.1fr; gap: var(--aura-space-3); align-items: center;
  padding: var(--aura-space-3); border-bottom: 1px solid var(--aura-border-soft); }
.admin-row:last-child { border-bottom: none; }
.admin-row--head { background: var(--aura-bg-panel-2); font-size: var(--aura-fs-xs); color: var(--aura-text-muted); }
.admin-cell { min-width: 0; }
.admin-cell--key { font-weight: 600; color: var(--aura-text-primary); word-break: break-all; }
.admin-cell--val { margin: 0; font-family: var(--aura-font-mono, ui-monospace, monospace); font-size: var(--aura-fs-xs);
  color: var(--aura-text-secondary); white-space: pre-wrap; word-break: break-word; max-height: 160px; overflow: auto; }
.admin-cell--act { display: flex; gap: var(--aura-space-2); justify-content: flex-end; }
.admin-diag__lead { margin: 0; font-size: var(--aura-fs-sm); color: var(--aura-text-secondary); }
.admin-diag__result { padding-top: var(--aura-space-2); }
.admin-diag__pending { color: var(--aura-text-muted); font-size: var(--aura-fs-sm); }

/* =========================================================================
   管理后台：左侧子菜单 + 右侧内容区（`.aura-admin__*`）
   ⛔ 本次**只新增** `.aura-admin__*` 系列，不动 `.aura-genpanel*` / `.aura-node*` /
   `.composer*` / `.admin-*` 等既有规则（另有同事在改那些，避免冲突）。
   ========================================================================= */

.aura-admin__shell { display: grid; grid-template-columns: 208px minmax(0, 1fr); gap: var(--aura-space-5);
  align-items: start; }
.aura-admin__sidebar { display: flex; flex-direction: column; gap: var(--aura-space-4);
  padding: var(--aura-space-4); border: 1px solid var(--aura-border-soft);
  border-radius: var(--aura-radius-lg); background: var(--aura-bg-panel);
  position: sticky; top: var(--aura-space-4); }
.aura-admin__brand { display: flex; align-items: baseline; gap: var(--aura-space-2); }
.aura-admin__brand-name { font-weight: 700; font-size: var(--aura-fs-sm); color: var(--aura-text-primary); letter-spacing: .04em; }
.aura-admin__brand-tag { font-size: 10px; color: var(--aura-accent); border: 1px solid var(--aura-border-mid);
  border-radius: 999px; padding: 1px 6px; }
.aura-admin__nav { display: flex; flex-direction: column; gap: 2px; }

/* 子菜单项：靠 `data-section` 标识定位（外部探针用），类名只管外观 */
.aura-admin__nav-item { display: flex; align-items: center; gap: var(--aura-space-2);
  padding: 7px var(--aura-space-3); border-radius: var(--aura-radius-sm);
  color: var(--aura-text-secondary); font-size: var(--aura-fs-sm); text-decoration: none;
  border: 1px solid transparent; cursor: pointer; }
.aura-admin__nav-item:hover { background: var(--aura-bg-panel-2); color: var(--aura-text-primary); }
.aura-admin__nav-item--active { background: var(--aura-bg-panel-2); color: var(--aura-text-primary);
  border-color: var(--aura-border-mid); font-weight: 600; }
.aura-admin__nav-icon { width: 16px; text-align: center; opacity: .85; }
.aura-admin__nav-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.aura-admin__side-foot { display: flex; flex-direction: column; gap: 4px; align-items: flex-start;
  padding-top: var(--aura-space-3); border-top: 1px solid var(--aura-border-soft); }
.aura-admin__side-note { font-size: var(--aura-fs-xs); color: var(--aura-text-muted); line-height: 1.5; }

.aura-admin__main { display: flex; flex-direction: column; gap: var(--aura-space-4); min-width: 0; }
.aura-admin__page { display: flex; flex-direction: column; gap: var(--aura-space-4); }
.aura-admin__section { display: flex; flex-direction: column; gap: var(--aura-space-3); }
.aura-admin__panel-title { margin: 0; font-size: var(--aura-fs-sm); font-weight: 600; color: var(--aura-text-primary); }
.aura-admin__pending { margin: 0; font-size: var(--aura-fs-sm); color: var(--aura-text-muted); }
.aura-admin__note { margin: 0; padding: var(--aura-space-2) var(--aura-space-3);
  border: 1px dashed var(--aura-border-mid); border-radius: var(--aura-radius-sm);
  font-size: var(--aura-fs-xs); color: var(--aura-text-secondary); background: var(--aura-bg-panel-2); }
.aura-admin__hint-inline { font-size: var(--aura-fs-xs); color: var(--aura-text-muted); }
/* 计费页的「缺单价」醒目提示：这不是普通注释，是要管理员**立刻动手**的事 ——
   缺单价会让用户端生成被拦住。故用警示色 + 边框，与普通 hint 明确区分。 */
.aura-admin__alert { margin: 8px 0; padding: 10px 12px; border: 1px solid #FF7A7A; border-radius: 8px;
  background: rgba(255, 122, 122, .08); color: #FFB4B4; font-size: var(--aura-fs-sm); line-height: 1.6; }

/* ── KPI 卡片 ───────────────────────────────────────────────────────────── */
.aura-admin__kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: var(--aura-space-3); }
.aura-admin__kpi { display: flex; flex-direction: column; gap: 2px; padding: var(--aura-space-3);
  border: 1px solid var(--aura-border-soft); border-radius: var(--aura-radius-md); background: var(--aura-bg-panel-2); }
.aura-admin__kpi-value { font-size: 20px; font-weight: 700; color: var(--aura-text-primary); font-variant-numeric: tabular-nums; }
.aura-admin__kpi-label { font-size: var(--aura-fs-xs); color: var(--aura-text-muted); }
.aura-admin__stat { margin: 0; font-size: var(--aura-fs-sm); color: var(--aura-text-secondary); }
.aura-admin__stat-num { font-weight: 700; color: var(--aura-text-primary); font-variant-numeric: tabular-nums; }

/* ── 模型接入：tab + 面板 ───────────────────────────────────────────────── */
.aura-admin__tabs { display: flex; flex-wrap: wrap; gap: var(--aura-space-2); }
.aura-admin__tab { display: inline-flex; align-items: center; gap: 6px; padding: 6px var(--aura-space-3);
  border-radius: 999px; border: 1px solid var(--aura-border-mid); background: var(--aura-bg-panel-2);
  color: var(--aura-text-secondary); font-size: var(--aura-fs-sm); text-decoration: none; cursor: pointer; }
.aura-admin__tab:hover { color: var(--aura-text-primary); border-color: var(--aura-border-strong); }
.aura-admin__tab--active { color: #fff; background: var(--aura-accent); border-color: var(--aura-accent); font-weight: 600; }
.aura-admin__tab-icon { opacity: .9; }
.aura-admin__panel { display: flex; flex-direction: column; gap: var(--aura-space-3);
  padding: var(--aura-space-3); border: 1px solid var(--aura-border-soft);
  border-radius: var(--aura-radius-md); background: var(--aura-bg-panel-2); }
.aura-admin__panel-head { display: flex; align-items: center; gap: var(--aura-space-3); flex-wrap: wrap; }
.aura-admin__secret { font-size: var(--aura-fs-xs); color: var(--aura-text-muted);
  font-family: var(--aura-font-mono, ui-monospace, monospace); }
.aura-admin__secret-block { display: flex; flex-direction: column; gap: 4px;
  padding: var(--aura-space-3); border: 1px dashed var(--aura-border-mid);
  border-radius: var(--aura-radius-sm); background: var(--aura-bg-panel); }
.aura-admin__secret-hint { margin: 0; font-size: var(--aura-fs-xs); color: var(--aura-text-muted); line-height: 1.5; }

/* ── 表单 ───────────────────────────────────────────────────────────────── */
.aura-admin__form { display: flex; flex-direction: column; gap: var(--aura-space-3); }
.aura-admin__field { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.aura-admin__field-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--aura-space-3); }
.aura-admin__field--inline { flex-direction: row; align-items: center; gap: var(--aura-space-2); }
.aura-admin__label { font-size: var(--aura-fs-xs); color: var(--aura-text-muted); }
.aura-admin__input { width: 100%; padding: 7px var(--aura-space-3); border-radius: var(--aura-radius-sm);
  background: var(--aura-bg-base); border: 1px solid var(--aura-border-mid);
  color: var(--aura-text-primary); font-size: var(--aura-fs-sm); font-family: inherit; }
.aura-admin__input:focus { outline: none; border-color: var(--aura-accent); }
.aura-admin__input--num { max-width: 120px; font-variant-numeric: tabular-nums; }
.aura-admin__select { width: 100%; padding: 7px var(--aura-space-3); border-radius: var(--aura-radius-sm);
  background: var(--aura-bg-base); border: 1px solid var(--aura-border-mid);
  color: var(--aura-text-primary); font-size: var(--aura-fs-sm); font-family: inherit; }
.aura-admin__actions { display: flex; flex-wrap: wrap; gap: var(--aura-space-3); align-items: center; }
.aura-admin__result { margin: 0; font-size: var(--aura-fs-sm); padding: 7px var(--aura-space-3);
  border-radius: var(--aura-radius-sm); border: 1px solid var(--aura-border-soft); word-break: break-word; }
.aura-admin__result--ok { color: #57D9A3; border-color: rgba(87, 217, 163, .35); background: rgba(87, 217, 163, .10); }
.aura-admin__result--err { color: #FF7A7A; border-color: rgba(255, 122, 122, .35); background: rgba(255, 122, 122, .10); }

/* ── 表格（每类一套列宽变体） ───────────────────────────────────────────── */
.aura-admin__table { display: flex; flex-direction: column; border: 1px solid var(--aura-border-soft);
  border-radius: var(--aura-radius-md); overflow: hidden; }
.aura-admin__row { display: grid; gap: var(--aura-space-3); align-items: center;
  padding: var(--aura-space-2) var(--aura-space-3); border-bottom: 1px solid var(--aura-border-soft); }
.aura-admin__row:last-child { border-bottom: none; }
.aura-admin__row--head { background: var(--aura-bg-panel-2); font-size: var(--aura-fs-xs); color: var(--aura-text-muted); }
/* 用户表 10 列：新增「UID」（对外显示 UID，等宽对齐）紧邻「用户」，身份信息聚在一起 */
.aura-admin__row--users { grid-template-columns: 1.1fr .7fr 1.3fr .6fr .7fr .6fr 1fr .6fr 1fr 1.4fr; }
.aura-admin__row--ledger { grid-template-columns: 1.2fr 1fr .6fr .9fr .8fr 1.6fr; }
.aura-admin__row--audit { grid-template-columns: 1.1fr 1.2fr 1fr 1.1fr 1.2fr 2fr; }
.aura-admin__row--rates { grid-template-columns: 1.4fr 1.2fr .8fr; }
/* 供应商汇总 7 列：新增「判定来源」（必须让"服务端判定 / 本地判定"一眼可辨） */
.aura-admin__row--providers { grid-template-columns: 1.2fr 1.2fr 1.6fr .7fr .6fr 1.2fr 1.5fr; }
/* 「该类已有配置」行列表 7 列（显示名/模型/base_url/协议/启用/可用性/操作） */
/* 9 列 = 显示名 / 模型 / base_url / 协议 / 启用 / 密钥（每行独立） / 计费模式 / 可用性 / 操作
   ⚠️ 计费模式列**只对 video 行**有内容，但非 video 行也发一个**空单元格**占位 —— 否则那两行
   的整体列宽会飘（列错位不报错，只让人读错）。 */
.aura-admin__row--providerRows { grid-template-columns: .9fr 1fr 1.4fr .5fr .5fr 1.2fr 1.9fr .7fr .55fr; }
/* 「计费」区块「按模型的扣费模式」子表 2 列 = 模型 / 计费模式。
   ⚠️ 列数必须与表头单元格数（cell('模型') + cell('计费模式') = 2）严格一致 ——
   列错位不报错、只让人读错；由 test/model-rate-in-billing.test.js 静态钉住。
   第 2 列装的是控件（.aura-admin__cell--rate，已 overflow:visible + flex-wrap），
   不能沿用文本单元的 nowrap + ellipsis（那会把输入框与按钮静默裁掉）。 */
.aura-admin__row--billingRates { grid-template-columns: 1.4fr 2.6fr; }
/* 状态时间戳：让「到底同步了没有」肉眼可判（配完密钥却看不到变化 = 真实 bug 的症状） */
.aura-admin__stamp { font-size: var(--aura-fs-xs); color: var(--aura-text-muted); white-space: nowrap; }
.aura-admin__cell { min-width: 0; font-size: var(--aura-fs-sm); color: var(--aura-text-secondary);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 等宽：8 位 UID 要能逐位对齐才好核对（比例字体下对不齐） */
.aura-admin__cell--mono { font-family: var(--aura-font-mono, ui-monospace, monospace);
  letter-spacing: .04em; color: var(--aura-text-primary); }
/* 测试号标记：跟在 UID 后面，字号更小，不破坏 8 位数字的左对齐 */
.aura-admin__test-badge { margin-left: 6px; padding: 0 5px; border-radius: 4px;
  font-family: inherit; font-size: 10px; letter-spacing: 0;
  color: #E0A34A; border: 1px solid rgba(224, 163, 74, .4); background: rgba(224, 163, 74, .12); }
.aura-admin__cell--wrap { white-space: normal; word-break: break-word; line-height: 1.5; }
.aura-admin__cell--num { font-variant-numeric: tabular-nums; text-align: right; }
.aura-admin__cell--act { display: flex; gap: 6px; justify-content: flex-end; }
/* 「密钥」「显示名」与「计费模式」三个单元装的是**控件**，不是文本。
   ⚠️ 不能沿用文本单元的 `overflow:hidden + nowrap + ellipsis` —— 那会把输入框与按钮直接裁掉
   （控件还在 DOM 里、探针也找得到，但用户看不见 ⇒ 「有 UI 用不了」等于没有）。 */
.aura-admin__cell--secret,
.aura-admin__cell--label,
.aura-admin__cell--rate {
  overflow: visible;
  white-space: normal;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.aura-admin__secret-state,
.aura-admin__rate-state { font-size: var(--aura-fs-xs); color: var(--aura-text-muted); flex-basis: 100%; }
.aura-admin__input--secret { max-width: 190px; }
.aura-admin__select--rate { max-width: 132px; }
.aura-admin__cell--rate .aura-admin__input { max-width: 148px; }
/* 「显示名」单元里的输入框（与保存按钮同格）：给个上限，避免撑破 `.9fr` 那一列。 */
.aura-admin__cell--label .aura-admin__input { max-width: 150px; }
/* 超分倍率的 placeholder 较长（{"none":1,"2x":3}），比档位单价那一格给宽一点，避免被裁。 */
.aura-admin__cell--rate .aura-admin__input[data-role="model-rate-upscale"] { max-width: 188px; }
.aura-admin__num--plus { color: #57D9A3; }
.aura-admin__num--minus { color: #FF7A7A; }
.aura-admin__code { font-family: var(--aura-font-mono, ui-monospace, monospace); font-size: 11px;
  color: var(--aura-text-muted); margin-left: 6px; }

/* ── 在线 / 离线徽章 ────────────────────────────────────────────────────── */
.aura-admin__badge { display: inline-flex; align-items: center; gap: 4px; font-size: var(--aura-fs-xs);
  padding: 1px 7px; border-radius: 999px; border: 1px solid transparent; }
.aura-admin__badge--online { color: #57D9A3; border-color: rgba(87, 217, 163, .35); background: rgba(87, 217, 163, .12); }
.aura-admin__badge--offline { color: var(--aura-text-muted); border-color: var(--aura-border-mid); background: var(--aura-bg-panel-2); }
.aura-admin__flags { display: flex; flex-direction: column; gap: var(--aura-space-3); }

@media (max-width: 1024px) {
  .aura-admin__shell { grid-template-columns: minmax(0, 1fr); }
  .aura-admin__sidebar { position: static; }
  .aura-admin__nav { flex-direction: row; flex-wrap: wrap; }
  .aura-admin__field-row { grid-template-columns: minmax(0, 1fr); }
  .aura-admin__row--users, .aura-admin__row--audit, .aura-admin__row--ledger { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* 「来源含糊比不显示更危险」：本地判定时的提示条加重左侧色条，一眼可辨 */
.aura-admin__note--source { border-left: 2px solid #E0A34A; }

/* ── 账号卡（工作台「设置」页）：对外显示 UID ────────────────────────────────
   复用工作台既有的 .aura-ws__card / .aura-ws__row-sub 外观，此处**只加**等宽号
   与复制按钮两处样式，不改动既有类。 */
.aura-account__row { display: flex; align-items: center; gap: 8px; margin-top: 6px; flex-wrap: wrap; }
.aura-account__uid { font-family: var(--aura-font-mono, ui-monospace, monospace);
  font-size: 16px; letter-spacing: .08em; color: var(--aura-text-primary, #e8e8f0);
  padding: 2px 8px; border-radius: 6px; background: var(--aura-bg-canvas, #0e0e16);
  border: 1px solid var(--aura-border, #26263a); user-select: all; }
.aura-account__copy { height: 26px; padding: 0 10px; border-radius: 6px; cursor: pointer;
  font-size: 12px; font-family: inherit; color: var(--aura-text-primary, #e8e8f0);
  background: var(--aura-bg-panel, #12121a); border: 1px solid var(--aura-border, #26263a); }
.aura-account__copy:hover { border-color: var(--aura-accent, #7c5cff); }
.aura-account__copy:disabled { opacity: .5; cursor: not-allowed; }

/* ── 个人中心入口（顶栏账号区）───────────────────────────────────────────────
   与 `.admin-entry` 同形但**不共用类**：管理后台是「仅管理员可见的高亮入口」，
   个人中心是所有用户可见的常规入口，两者的视觉语义不该被同一个类绑死。
   稳定标识是 `data-action="open-profile"`（样式不承担定位职责）。 */
.profile-entry {
  display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 12px;
  border-radius: var(--aura-radius-sm); cursor: pointer; font-size: var(--aura-fs-sm);
  background: var(--aura-bg-panel); border: 1px solid var(--aura-border-mid);
  color: var(--aura-text-secondary);
}
.profile-entry:hover { border-color: var(--aura-accent); color: var(--aura-text-primary); background: var(--aura-accent-soft); }
.profile-entry__glyph { font-size: var(--aura-fs-md); line-height: 1; }
.profile-entry__label { font-weight: 600; white-space: nowrap; }

/* ── 个人中心（视图）─────────────────────────────────────────────────────────
   新增类一律带 `.aura-profile__` 前缀，**不改动任何既有类**。 */
.aura-profile__roles { display: flex; align-items: center; gap: var(--aura-space-2); flex-wrap: wrap; margin-top: var(--aura-space-4); }
.aura-profile__badge { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 999px;
  font-size: var(--aura-fs-xs); font-weight: 600;
  border: 1px solid var(--aura-border-mid); background: var(--aura-bg-panel); color: var(--aura-text-secondary); }
.aura-profile__badge.is-admin { color: var(--aura-text-primary); border-color: var(--aura-accent); background: var(--aura-accent-soft); }
/* 未接入档：斜体 + 虚线边框（一眼可辨"这不是你的身份，是缺数据源"） */
.aura-profile__badge.is-soft { font-style: italic; color: var(--aura-text-muted); border-style: dashed; cursor: help; }

.aura-profile__card { margin-top: var(--aura-space-4); padding: var(--aura-space-4) var(--aura-space-5);
  border: 1px solid var(--aura-border); border-radius: var(--aura-radius-md); background: var(--aura-bg-panel); }
.aura-profile__card-title { margin: 0 0 var(--aura-space-3); font-size: var(--aura-fs-md); font-weight: 700; color: var(--aura-text-primary); }

.aura-profile__head { display: flex; align-items: flex-start; gap: var(--aura-space-4); flex-wrap: wrap; }
.aura-profile__avatar { flex: 0 0 auto; width: 52px; height: 52px; border-radius: 16px;
  display: grid; place-items: center; font-size: 22px; font-weight: 700;
  background: linear-gradient(135deg, var(--aura-bg-panel-2), var(--aura-bg-canvas));
  border: 1px solid var(--aura-border-mid); color: var(--aura-text-secondary); user-select: none; }
.aura-profile__id { display: flex; flex-direction: column; gap: 6px; min-width: 0; flex: 1 1 320px; }
.aura-profile__name-row { display: flex; align-items: center; gap: var(--aura-space-3); flex-wrap: wrap; }
.aura-profile__name { font-size: 16px; font-weight: 600; color: var(--aura-text-primary); }
.aura-profile__id-row { display: flex; align-items: baseline; gap: var(--aura-space-3); flex-wrap: wrap; margin-top: 2px; }
.aura-profile__id-label { color: var(--aura-text-muted); font-size: var(--aura-fs-sm); }
/* 等宽：8 位 UID 要逐位对齐才好核对（比例字体下对不齐） */
.aura-profile__uid { font-family: var(--aura-font-mono, ui-monospace, monospace); font-size: 16px; letter-spacing: .08em;
  color: var(--aura-text-primary); padding: 2px 8px; border-radius: 6px;
  background: var(--aura-bg-canvas); border: 1px solid var(--aura-border); user-select: all; }
.aura-profile__balance { flex: 0 0 auto; margin-left: auto; text-align: right; }
.aura-profile__balance-value { font-size: 24px; font-weight: 700; color: var(--aura-text-primary); font-variant-numeric: tabular-nums; }
.aura-profile__balance-label { font-size: var(--aura-fs-xs); color: var(--aura-text-muted); }
.aura-profile__balance-sub { margin-top: 4px; font-size: var(--aura-fs-xs); color: var(--aura-text-muted); }

.aura-profile__bind-grid { display: flex; flex-direction: column; }
.aura-profile__bind-row { display: grid; grid-template-columns: 92px minmax(0, 1fr) auto; align-items: center;
  gap: var(--aura-space-3); padding: var(--aura-space-2) 0; border-bottom: 1px solid var(--aura-border-soft); }
.aura-profile__bind-row:last-child { border-bottom: none; }
.aura-profile__bind-label { width: 92px; color: var(--aura-text-muted); font-size: var(--aura-fs-sm); }
.aura-profile__bind-value { min-width: 0; color: var(--aura-text-primary); font-size: var(--aura-fs-sm);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 未绑定：斜体灰（与弧光侧 `.is-soft` 口径一致） */
.aura-profile__bind-value.is-soft { font-style: italic; color: var(--aura-text-muted); }
.aura-profile__bind-action { white-space: nowrap; }

.aura-profile__note { font-size: var(--aura-fs-xs); color: var(--aura-text-muted); line-height: 1.6; }
.aura-profile__unavailable { display: flex; flex-direction: column; gap: 4px; padding: var(--aura-space-2) 0; }
.aura-profile__unavailable-value { font-size: var(--aura-fs-sm); font-style: italic; color: var(--aura-text-muted); }

.aura-profile__actions { display: flex; align-items: center; gap: var(--aura-space-3); flex-wrap: wrap; margin-top: var(--aura-space-4); }

.aura-profile__credits { display: flex; flex-direction: column; gap: var(--aura-space-3); }
.aura-profile__kv { display: grid; grid-template-columns: auto auto auto auto; gap: 4px var(--aura-space-4);
  align-items: baseline; justify-content: start; }
.aura-profile__kv-k { color: var(--aura-text-muted); font-size: var(--aura-fs-sm); }
.aura-profile__kv-v { color: var(--aura-text-primary); font-size: var(--aura-fs-md); font-weight: 700; font-variant-numeric: tabular-nums; }
.aura-profile__ledger { display: flex; flex-direction: column; }
.aura-profile__ledger-row { display: grid; grid-template-columns: 1.3fr .9fr .5fr .5fr 2fr; gap: var(--aura-space-3); align-items: center;
  padding: 6px 0; border-bottom: 1px solid var(--aura-border-soft); font-size: var(--aura-fs-sm); }
.aura-profile__ledger-row:last-child { border-bottom: none; }
.aura-profile__ledger-time { color: var(--aura-text-muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.aura-profile__ledger-kind { color: var(--aura-text-secondary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.aura-profile__ledger-delta { font-variant-numeric: tabular-nums; font-weight: 700; color: var(--aura-text-primary); text-align: right; }
.aura-profile__ledger-delta.is-plus { color: #57D9A3; }
.aura-profile__ledger-delta.is-minus { color: #FF7A7A; }
.aura-profile__ledger-balance { color: var(--aura-text-secondary); font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.aura-profile__ledger-reason { color: var(--aura-text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.aura-profile__member { display: flex; flex-direction: column; gap: var(--aura-space-2); }

@media (max-width: 720px) {
  .aura-profile__balance { margin-left: 0; text-align: left; }
  .aura-profile__ledger-row { grid-template-columns: 1.1fr .8fr .5fr .5fr; }
  .aura-profile__ledger-reason { display: none; }
}