/* MoeApk App Web 原型设计系统
 * 二次元风格「MoeApk」主题（2026-09-25 风格改版）：色彩取自吉祥物安卓娘设定图——
 * 樱粉（蝴蝶结）/ 抹茶绿（裙）/ 天空蓝（鞋）/ 奶茶棕（发）。
 * 表现语言：柔和渐变底色 + 半透明玻璃质感 + 彩色软阴影 + 小面积发光点缀。
 * 明/暗双主题（App 跟随系统，原型可手动切换便于对比；App 侧 dynamic color 的
 * fallback 即本套，种子色由 #E8A562 纸箱橙更换为 #E94E8A 樱粉）。
 * 性能预算：backdrop-filter 模糊只用于 chrome 层（顶栏/底栏/抽屉/对话框/悬浮条），
 * 列表卡片仅半透明不模糊；动画只用 transform/opacity。
 */
@font-face {
  font-family: 'MoeApk';
  src: url('../assets/MoeApk.ttf') format('truetype');
  font-display: swap;
}
:root {
  /* ---------- 品牌色板（取色自安卓娘） ---------- */
  --c-pink: #E94E8A;          /* 樱粉 · 主色 */
  --c-pink-deep: #C93A72;
  --c-pink-soft: #FFD6E6;
  --c-mint: #2FAE7D;          /* 抹茶绿 · 辅助 */
  --c-mint-soft: #C9F0DD;
  --c-sky: #5B8FD9;           /* 天空蓝 · 辅助 */
  --c-sky-soft: #D5E5F9;
  --c-violet: #9370DB;        /* 紫藤 · 点缀 */
  --c-cream: #FFF6EF;

  /* ---------- 渐变 ---------- */
  --grad-primary: linear-gradient(135deg, #FF9DBE 0%, #E94E8A 100%);
  --grad-mint: linear-gradient(135deg, #7FDDB4 0%, #2FAE7D 100%);
  --grad-text: linear-gradient(120deg, #E94E8A 10%, #9370DB 90%);
  --grad-hero: linear-gradient(118deg, #FFD9E8 0%, #DFF3EA 52%, #DCE8FB 100%);
  --grad-soft: linear-gradient(135deg, rgba(255,157,190,.16), rgba(147,112,219,.10));

  /* ---------- M3 角色映射（沿用旧令牌名，值已二次元化） ---------- */
  --bg: #FBF3F1;
  --surface: rgba(255,255,255,.60);            /* 玻璃表面（顶栏等，配 blur 使用） */
  --surface-low: rgba(255,255,255,.55);        /* 卡片玻璃 */
  --surface-container: rgba(255,255,255,.42);  /* 更浅的容器 */
  --surface-high: rgba(255,255,255,.72);       /* 悬浮层 */
  --surface-highest: rgba(255,255,255,.85);
  --on-surface: #453A52;
  --on-surface-variant: #746A82;
  --outline: #A99BB8;
  --outline-variant: rgba(130,105,150,.22);
  --primary: var(--c-pink);
  --on-primary: #FFFFFF;
  --primary-container: var(--c-pink-soft);
  --on-primary-container: #8A2A52;
  --secondary-container: rgba(233,78,138,.13); /* 选中态浅粉底 */
  --on-secondary-container: #B03064;
  --error: #D64560;
  --on-error: #FFFFFF;
  --error-container: #FFD9DF;
  --on-error-container: #8C1D30;
  --inverse-surface: rgba(56,44,72,.92);
  --inverse-on-surface: #F7EFF7;
  --shadow: rgba(120,70,110,.16);

  /* ---------- 玻璃与光效令牌 ---------- */
  --glass-brd: rgba(255,255,255,.65);   /* 玻璃卡描边 */
  --glass-chrome: rgba(255,251,253,.58);/* chrome 层底（顶/底栏，配 blur） */
  --blur-chrome: saturate(1.5) blur(18px);
  --shadow-card: 0 6px 24px -8px rgba(200,90,145,.20), 0 2px 6px -2px rgba(110,80,140,.10);
  --shadow-float: 0 12px 36px -10px rgba(190,80,140,.30), 0 4px 10px -4px rgba(110,80,140,.14);
  --glow-primary: 0 6px 18px -4px rgba(233,78,138,.48);
  --glow-soft: 0 4px 14px -4px rgba(233,78,138,.32);
  --ring-focus: 0 0 0 3px rgba(233,78,138,.20);

  /* ---------- chrome 尺寸令牌（第十轮：顶栏 64→52 / 底栏 80→64 减薄） ---------- */
  --topbar-h: 52px;
  --navbar-h: 64px;

  /* ---------- 系统栏安全区（第十三轮）----------
     真机系统栏不归 App 画，但**会吃掉落在其上的触摸**。沉浸式页面（素材查看器 /
     点云舞台）内容边到边铺满，交互元素若贴顶 8px 就会整颗压在状态栏下——实机表现为
     「按钮看得见却点不动」。故凡沉浸式页面内的悬浮元素，一律以本令牌偏移。
     数值取真机典型值（412dp 框：状态栏 32dp / 手势条 16dp）。 */
  --statusbar-h: 32px;
  --gesture-h: 16px;

  /* ---------- 背景（多层柔光 mesh） ---------- */
  --bg-mesh:
    radial-gradient(120% 70% at 8% -4%, rgba(255,214,230,.85) 0%, transparent 55%),
    radial-gradient(100% 60% at 96% 6%, rgba(201,240,221,.75) 0%, transparent 52%),
    radial-gradient(110% 70% at 88% 102%, rgba(213,229,249,.8) 0%, transparent 55%),
    radial-gradient(100% 70% at 4% 96%, rgba(255,240,222,.8) 0%, transparent 52%),
    linear-gradient(160deg, #FDF5F3 0%, #FBF3F6 45%, #F5F3FA 100%);
}
[data-theme="dark"] {
  /* ---------- 星夜配色 ---------- */
  --grad-primary: linear-gradient(135deg, #FFB0C9 0%, #F0628F 100%);
  --grad-mint: linear-gradient(135deg, #8FE8C0 0%, #43C795 100%);
  --grad-text: linear-gradient(120deg, #FF9DBE 10%, #B79CED 90%);
  --grad-hero: linear-gradient(118deg, rgba(240,98,143,.34) 0%, rgba(67,199,149,.26) 52%, rgba(91,143,217,.30) 100%);
  --grad-soft: linear-gradient(135deg, rgba(255,157,190,.14), rgba(147,112,219,.12));

  --bg: #17131F;
  --surface: rgba(43,36,62,.55);
  --surface-low: rgba(46,39,66,.48);
  --surface-container: rgba(46,39,66,.36);
  --surface-high: rgba(58,50,82,.62);
  --surface-highest: rgba(72,63,100,.72);
  --on-surface: #F2EAF6;
  --on-surface-variant: #B8ACCA;
  --outline: #8A7DA0;
  --outline-variant: rgba(190,170,220,.16);
  --primary: #FF8FB0;
  --on-primary: #4A1230;
  --primary-container: rgba(240,98,143,.28);
  --on-primary-container: #FFD0DE;
  --secondary-container: rgba(255,143,176,.20);
  --on-secondary-container: #FFC2D4;
  --error: #FF8FA3;
  --on-error: #5A1020;
  --error-container: rgba(214,69,96,.26);
  --on-error-container: #FFD9DF;
  --inverse-surface: rgba(247,239,247,.92);
  --inverse-on-surface: #3A2C4A;
  --shadow: rgba(0,0,0,.42);

  --glass-brd: rgba(255,255,255,.10);
  --glass-chrome: rgba(26,21,42,.55);
  --shadow-card: 0 8px 28px -10px rgba(0,0,0,.50), 0 2px 8px -3px rgba(240,98,143,.10);
  --shadow-float: 0 14px 40px -10px rgba(0,0,0,.60), 0 4px 14px -6px rgba(240,98,143,.18);
  --glow-primary: 0 6px 22px -4px rgba(255,143,176,.50);
  --glow-soft: 0 4px 16px -4px rgba(255,143,176,.34);
  --ring-focus: 0 0 0 3px rgba(255,143,176,.26);

  --bg-mesh:
    radial-gradient(120% 70% at 8% -4%, rgba(94,42,86,.55) 0%, transparent 55%),
    radial-gradient(100% 60% at 96% 6%, rgba(28,72,64,.45) 0%, transparent 52%),
    radial-gradient(110% 70% at 88% 102%, rgba(36,48,94,.55) 0%, transparent 55%),
    radial-gradient(100% 70% at 4% 96%, rgba(72,42,58,.45) 0%, transparent 52%),
    linear-gradient(160deg, #1A1426 0%, #17131F 45%, #141822 100%);
}
* { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; }
html, body { height: 100%; }
body {
  font-family: Roboto, 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;
  background: radial-gradient(140% 100% at 50% 0%, #221a30 0%, #120f18 60%);
  color: var(--on-surface);
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
/* 桌面端手机框；窄屏（真机/开发者工具移动视图）全屏 */
.phone {
  position: relative;
  width: 412px; height: min(880px, 96vh);
  background: var(--bg-mesh), var(--bg); color: var(--on-surface);
  border-radius: 36px; overflow: hidden;
  box-shadow: 0 24px 72px -12px rgba(150,80,180,.35), 0 8px 28px rgba(0,0,0,.5), inset 0 0 0 1px rgba(255,255,255,.10);
  display: flex; flex-direction: column;
  container-type: inline-size; /* 横屏/平板断点的查询容器（App 侧对应 WindowSizeClass） */
}
/* 原型横屏预览框（proto-bar 切换，真机由真实视口宽度驱动同一套断点） */
.phone.land { width: min(1024px, 96vw); height: min(680px, 92vh); border-radius: 28px; }
@media (max-width: 500px), (max-height: 700px) {
  body { background: var(--bg); }
  .phone { width: 100vw; height: 100dvh; border-radius: 0; box-shadow: none; }
  .phone.land { width: 100vw; height: 100dvh; border-radius: 0; }
}
/* 原型工具条（非 App 内容：主题切换等调试入口） */
.proto-bar {
  position: fixed; top: 6px; right: 8px; z-index: 99;
  display: flex; gap: 6px; align-items: center;
  font: 11px/1 sans-serif; color: #aaa;
  background: rgba(30,20,44,.45); backdrop-filter: blur(6px);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 999px; padding: 3px 8px;
}
.proto-bar button {
  border: 0; background: none; color: #ddd;
  border-radius: 999px; padding: 3px 8px; cursor: pointer; font-size: 11px;
}
/* 沉浸式全屏子页（素材查看器）：隐藏调试条，退到普通页自动恢复 */
body.has-full .proto-bar { opacity: 0; pointer-events: none; transition: opacity .2s; }

/* ---------- 模拟软键盘（第四轮：验证"输入区贴键盘、零多余间隙"定案） ---------- */
.kbdemo {
  flex: none;
  background: var(--glass-chrome); backdrop-filter: var(--blur-chrome);
  border-top: 1px solid var(--glass-brd);
  padding: 4px 6px 8px;
}
.kb-tag { text-align: center; font-size: 10px; color: var(--outline); padding: 2px 0 4px; }
.kb-row { display: flex; gap: 4px; justify-content: center; margin-bottom: 4px; }
.kb-key {
  flex: none; min-width: 30px; height: 38px; padding: 0 6px;
  border: 1px solid var(--glass-brd); border-radius: 10px; cursor: pointer;
  background: var(--surface-highest); color: var(--on-surface);
  font-size: 14px; box-shadow: 0 2px 4px -2px var(--shadow);
}
.kb-key.wide { min-width: 52px; }
.kb-key.space { flex: 1; max-width: 240px; }
.kb-key.accent { background: var(--grad-primary); color: #fff; border-color: transparent; box-shadow: var(--glow-soft); }
[data-theme="dark"] .kb-key.accent { color: #3D0E26; }
.kb-key:active { opacity: .75; }

/* 模型中心标签行（第四轮：用途/格式标签） */
.tag-row { display: flex; gap: 4px; margin-top: 4px; flex-wrap: wrap; }
.tag-row .achip { font-size: 10px; padding: 1px 7px; }
.tag-row .tag-kind { background: var(--secondary-container); color: var(--on-secondary-container); border-color: transparent; }

/* ---------- 顶栏（CenterAlignedTopAppBar · 玻璃模糊） ---------- */
#app { display: flex; flex-direction: column; height: 100%; overflow: hidden; position: relative; }
.topbar {
  height: var(--topbar-h); flex: none;
  display: flex; align-items: center; padding: 0 8px;
  background: var(--glass-chrome);
  backdrop-filter: var(--blur-chrome); -webkit-backdrop-filter: var(--blur-chrome);
  border-bottom: 1px solid var(--glass-brd);
  position: relative; z-index: 7;
}
.topbar-title {
  flex: 1; text-align: center;
  font-size: 22px; font-weight: 600; line-height: 28px; letter-spacing: .5px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  background: var(--grad-text); -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.icbtn {
  width: 48px; height: 48px; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  background: none; border: 0; color: var(--on-surface); cursor: pointer; border-radius: 50%;
  transition: background .15s, transform .1s;
}
.icbtn:active { background: rgba(233,78,138,.14); transform: scale(.92); }
.ic { width: 24px; height: 24px; }

/* ---------- 内容区 ---------- */
.content {
  flex: 1; overflow-y: auto; overscroll-behavior: contain;
  padding: 8px 16px 24px;
  scrollbar-width: none;
}
.content::-webkit-scrollbar { display: none; }
.ptr-hint { text-align: center; color: var(--on-surface-variant); font-size: 12px; padding: 8px 0 0; }
/* 下拉刷新指示器（第十二轮修订，对应 App PullToRefreshBox）：**只换主题色**——
 * 实色圆底（surface-highest，近不透明）+ 主题樱粉圆环，圆形与升降交给 M3 Indicator。
 * 教训（App 0.11.2 真机事故）：**不要**给指示器加 backdrop 模糊与悬浮阴影——
 * 模糊取样的是内容层、阴影是外部绘制层，都不随指示器自身的隐藏一起消失，
 * 会在列表顶部留下常驻残影；半透明圆底再与 elevation 叠加，还会把正圆糊成灰边。 */
.ptr-indicator {
  position: absolute; top: calc(var(--topbar-h) + 8px); left: 50%; transform: translateX(-50%); z-index: 8;
  width: 40px; height: 40px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--surface-highest);
}
.ptr-indicator .spinner { width: 20px; height: 20px; border-width: 2.5px; }

/* ---------- 底部导航（NavigationBar · 玻璃模糊 + 发光选中） ---------- */
.navbar {
  flex: none; height: var(--navbar-h); padding-bottom: 4px;
  display: flex;
  background: var(--glass-chrome);
  backdrop-filter: var(--blur-chrome); -webkit-backdrop-filter: var(--blur-chrome);
  border-top: 1px solid var(--glass-brd);
  position: relative; z-index: 7;
}
.nav-item {
  flex: 1; border: 0; background: none; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  color: var(--on-surface-variant); font-size: 12px;
  transition: color .18s;
}
.nav-item .ic {
  width: 22px; height: 22px; padding: 4px 18px; box-sizing: content-box;
  border-radius: 999px;
  transition: background .2s, color .2s, box-shadow .2s, transform .2s;
}
.nav-item:active .ic { transform: scale(.9); }
.nav-item.on { color: var(--primary); font-weight: 600; }
.nav-item.on .ic {
  background: var(--grad-primary); color: #fff;
  box-shadow: var(--glow-primary);
}
[data-theme="dark"] .nav-item.on .ic { color: #3D0E26; }

/* ---------- 通用 · 玻璃卡 ---------- */
.card {
  background: var(--surface-low);
  border: 1px solid var(--glass-brd);
  border-radius: 18px;
  padding: 14px;
  margin-top: 10px;
  box-shadow: var(--shadow-card);
}
.card.tight { padding: 4px 0; } /* 内装 ListItem 时 */
.muted { color: var(--on-surface-variant); }
.small { font-size: 12px; }
.center { text-align: center; }
.nowrap { white-space: nowrap; }
.mono { font-family: ui-monospace, Consolas, monospace; }
/* 分组标题（I3 吸顶；第八轮定案：玻璃胶囊）——
 * ① 组前 26px 大留白（原 14px 与「标题→卡片」间距雷同，分组边界不辨）；
 * ② 玻璃底收缩为文字宽胶囊（原满宽负 margin 横带），滚动吸顶时不再整带压住卡片软阴影；
 * ③ top: 6px 悬浮（原 -8px 顶死滚动区上沿），滑过内容在胶囊上下留有缝隙。 */
.section-title {
  position: sticky; top: 6px; z-index: 3;
  width: fit-content; max-width: 100%;
  margin: 26px 0 0 4px; padding: 6px 13px;
  font-size: 13px; font-weight: 700; letter-spacing: .3px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  color: var(--primary);
  background: var(--glass-chrome);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border: 1px solid var(--glass-brd);
  border-radius: 999px;
}
.section-title::before { content: '✦'; margin-right: 6px; font-size: 10px; }
/* 页首首个分组标题上方无卡片，组前留白收敛 */
.content > .section-title:first-child { margin-top: 14px; }
/* 模型中心（第十一轮）：吸顶分类行（top:-8px 满宽横带）与吸顶分组标题胶囊错位共存——
 * 分组标题吸在分类行下沿（分类行可见高度 ≈ 42px），否则两者同区重叠互压。 */
.mdl-page .section-title { top: 44px; }
.sec-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 4px 2px; }
.sec-title {
  font-size: 14px; font-weight: 600;
  background: var(--grad-text); -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.sec-title::before { content: '✦'; margin-right: 6px; font-size: 11px; color: var(--primary); -webkit-text-fill-color: var(--primary); }
.center-hint { text-align: center; color: var(--on-surface-variant); font-size: 14px; padding: 48px 24px; }
.spin-wrap { display: flex; justify-content: center; padding: 22px; }
.spinner {
  width: 22px; height: 22px; border-radius: 50%;
  border: 3px solid var(--primary); border-top-color: transparent;
  animation: rot .8s linear infinite;
}
@keyframes rot { to { transform: rotate(360deg); } }

/* ---------- EntryCard ---------- */
.card.entry { cursor: pointer; transition: background .15s, transform .12s, box-shadow .18s; }
.card.entry:active { background: var(--surface-high); transform: scale(.985); }
.entry-head { display: flex; align-items: stretch; gap: 12px; min-height: 48px; }
/* 图标槽固定 48×48（第九轮定案）：App 侧真实图标同样锁 48dp +
 * ContentScale.Crop，不得用内容推断高度（曾出现图标随卡宽失控放大）。 */
.avatar {
  flex: none; width: 48px; height: 48px; border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 22px; font-weight: 500;
  background: linear-gradient(140deg, hsl(var(--ah, 330), 68%, 68%), hsl(calc(var(--ah, 330) + 38), 58%, 55%));
  box-shadow: 0 4px 12px -4px hsla(var(--ah, 330), 60%, 55%, .45);
  text-shadow: 0 1px 3px rgba(60,20,50,.3);
}
.avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.entry-titles { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; justify-content: center; }
.entry-title { font-size: 16px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.entry-ver { font-size: 12px; color: var(--on-surface-variant); }
.entry-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.achip {
  font-size: 12px; color: var(--on-surface-variant);
  background: var(--surface-container);
  border: 1px solid var(--outline-variant); border-radius: 999px; padding: 2px 10px;
  white-space: nowrap; /* 永不竖排折行；空间不够由 .entry-chips 的 flex-wrap 整颗换行 */
}
.entry-summary {
  font-size: 14px; color: var(--on-surface-variant);
  margin-top: 8px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
/* 详情页（.full）：简介不截断，完整展示 App 介绍（列表模式仍两行 clamp） */
.entry-summary.full { display: block; -webkit-line-clamp: unset; overflow: visible; }
.entry-meta { font-size: 12px; color: var(--on-surface-variant); margin-top: 6px; }

/* ---------- 按钮（渐变 + 发光） ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border: 0; border-radius: 999px; cursor: pointer;
  background: var(--grad-primary); color: var(--on-primary);
  font-size: 14px; font-weight: 600; padding: 12px 24px; min-height: 44px;
  box-shadow: var(--glow-primary);
  transition: transform .12s, box-shadow .18s, filter .18s;
}
[data-theme="dark"] .btn { text-shadow: 0 1px 2px rgba(255,255,255,.15); }
.btn:active { transform: scale(.96); filter: brightness(1.06); }
.btn.block { display: flex; width: 100%; }
.btn.flex { flex: 1; }
.btn.ghost {
  background: var(--surface-high); color: var(--primary);
  border: 1px solid var(--outline-variant); box-shadow: none;
}
.btn.danger { background: linear-gradient(135deg, #FF8B9D, #D64560); color: #fff; box-shadow: 0 6px 18px -4px rgba(214,69,96,.45); }
.btn.small { min-height: 36px; padding: 8px 16px; font-size: 13px; }
.btn:disabled { opacity: .38; pointer-events: none; box-shadow: none; }
.tbtn {
  border: 0; background: none; cursor: pointer;
  color: var(--primary); font-size: 14px; font-weight: 600;
  padding: 8px 10px; border-radius: 999px;
  transition: background .15s;
}
.tbtn:active { background: rgba(233,78,138,.12); }
.tbtn.danger { color: var(--error); }

/* ---------- ListItem（设置页模式） ---------- */
.li {
  display: flex; align-items: center; gap: 14px;
  padding: 10px 16px; min-height: 56px; cursor: pointer;
  overflow: hidden; border-radius: 14px;
  transition: background .15s;
}
.li:active { background: rgba(233,78,138,.08); }
.li.danger { background: var(--error-container); color: var(--on-error-container); }
.li.danger .li-sub { color: var(--on-error-container); opacity: .75; }
.li-icon { color: var(--on-surface-variant); display: inline-flex; }
.li-body { flex: 1; min-width: 0; }
.li-title { font-size: 14px; font-weight: 500; }
.li-sub { font-size: 12px; color: var(--on-surface-variant); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; }
.li-arrow { color: var(--on-surface-variant); display: inline-flex; }
.hr { height: 1px; background: var(--outline-variant); opacity: .7; margin: 0 16px; }

/* ---------- Chip 行（全圆角 + 选中发光） ----------
 * 第九轮：chip 收紧为 32px 高（原 34 + 更宽 padding，激活时显得过高）；
 * 行内上下留白对称（原 10/0/6 上松下紧，选中光晕在滚动容器下沿被裁）。 */
.chip-row { display: flex; gap: 8px; padding: 8px 0; overflow-x: auto; scrollbar-width: none; }
.chip-row::-webkit-scrollbar { display: none; }
/* APK 顶部分类标签行：贯通屏宽（负 margin 抵消内容 padding），上下留白给激活光晕 */
.chip-row.apk-tabs { margin: 0 -16px; padding: 6px 16px 10px; }
.chip {
  flex: none; border: 1px solid var(--outline-variant);
  background: var(--surface-container); backdrop-filter: none;
  color: var(--on-surface-variant); border-radius: 999px;
  font-size: 13px; padding: 6px 14px; cursor: pointer; min-height: 32px;
  transition: background .18s, color .18s, box-shadow .18s, border-color .18s;
}
.chip.on {
  background: var(--grad-primary); color: #fff; border-color: transparent; font-weight: 600;
  box-shadow: var(--glow-soft);
}
[data-theme="dark"] .chip.on { color: #3D0E26; }

/* ---------- 表单（玻璃输入框 + 聚焦光环） ---------- */
.field { display: block; margin-top: 14px; }
.field-label { font-size: 12px; color: var(--on-surface-variant); padding-left: 14px; }
.field-input {
  display: block; width: 100%; margin-top: 4px;
  border: 1px solid var(--outline-variant); border-radius: 14px;
  background: var(--surface-container); color: var(--on-surface);
  font-size: 15px; padding: 13px 14px; outline: none;
  transition: border-color .18s, box-shadow .18s, background .18s;
}
.field-input:focus { border-color: var(--primary); box-shadow: var(--ring-focus); background: var(--surface-high); }
.field-err { display: block; font-size: 12px; color: var(--error); padding: 4px 14px 0; }
.form-pad { padding: 12px 8px; }
.headline {
  font-size: 28px; font-weight: 600; line-height: 36px;
  background: var(--grad-text); -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.sub { font-size: 14px; color: var(--on-surface-variant); margin-top: 8px; line-height: 20px; }

/* ---------- Switch / Radio / Slider ---------- */
.switch {
  flex: none; width: 52px; height: 32px; border-radius: 999px; border: 1px solid var(--outline-variant); cursor: pointer;
  background: var(--surface-highest); position: relative;
  transition: background .2s, border-color .2s, box-shadow .2s;
}
.switch .knob {
  position: absolute; top: 3px; left: 3px; width: 24px; height: 24px; border-radius: 50%;
  background: var(--outline); transition: left .2s, background .2s;
  box-shadow: 0 2px 5px var(--shadow);
}
.switch.on { background: var(--grad-primary); border-color: transparent; box-shadow: var(--glow-soft); }
.switch.on .knob { left: 23px; background: #fff; }
.radio { flex: none; width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--outline); position: relative; transition: border-color .18s; }
.radio.on { border-color: var(--primary); }
.radio.on::after {
  content: ''; position: absolute; inset: 3px; border-radius: 50%;
  background: var(--grad-primary); box-shadow: 0 0 8px rgba(233,78,138,.5);
}
.slider-row { display: block; padding: 10px 4px; }
.slider { width: 100%; accent-color: var(--primary); margin-top: 8px; }

/* ---------- 进度条（渐变 + 流光） ---------- */
.pbar { height: 6px; border-radius: 999px; background: var(--surface-highest); overflow: hidden; margin-top: 10px; border: 1px solid var(--outline-variant); }
.pbar-fill {
  height: 100%; background: var(--grad-primary); border-radius: 999px;
  box-shadow: 0 0 10px rgba(233,78,138,.45);
  transition: width .3s;
}
.pbar.ind .pbar-fill { width: 40%; animation: ind 1.1s ease-in-out infinite; }
@keyframes ind { 0% { margin-left: -40%; } 100% { margin-left: 100%; } }
.dl-status { font-size: 12px; color: var(--on-surface-variant); }
.dl-row { display: flex; align-items: center; gap: 8px; }

/* ---------- 对话框（玻璃 + 模糊） ---------- */
.dlg-mask {
  position: absolute; inset: 0; z-index: 70; /* 高于全屏查看器（.g-viewer 60）：长按菜单须压在查看器上 */
  background: rgba(40,26,52,.38);
  backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);
  display: flex; align-items: center; justify-content: center; padding: 32px;
}
.dlg {
  width: 100%; max-width: 360px;
  background: var(--surface-high);
  backdrop-filter: saturate(1.5) blur(24px); -webkit-backdrop-filter: saturate(1.5) blur(24px);
  border: 1px solid var(--glass-brd);
  border-radius: 26px; padding: 24px;
  box-shadow: var(--shadow-float);
  animation: dlgIn .18s cubic-bezier(.2, 1.4, .4, 1);
}
@keyframes dlgIn { from { transform: scale(.9) translateY(8px); opacity: 0; } }
.dlg-title { font-size: 20px; font-weight: 600; line-height: 26px; }
.dlg-body { font-size: 14px; line-height: 20px; color: var(--on-surface-variant); margin-top: 12px; max-height: 50vh; overflow-y: auto; }
.dlg-body .mono-block {
  font-family: ui-monospace, Consolas, monospace; font-size: 13px;
  background: var(--surface-highest); border: 1px solid var(--outline-variant);
  border-radius: 12px; padding: 12px; margin: 8px 0;
  word-break: break-all; color: var(--on-surface);
}
.dlg-actions { display: flex; justify-content: flex-end; gap: 4px; margin-top: 20px; flex-wrap: wrap; }
.warn-card {
  background: var(--error-container); color: var(--on-error-container);
  border: 1px solid rgba(214,69,96,.25);
  border-radius: 14px; padding: 12px; font-size: 13px; margin-top: 10px;
}

/* ---------- Toast（SnackBar 语义 · 深色玻璃） ---------- */
.toast-wrap {
  position: absolute; left: 16px; right: 16px; bottom: calc(var(--navbar-h) + 16px); z-index: 50;
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  pointer-events: none;
}
.toast {
  background: var(--inverse-surface); color: var(--inverse-on-surface);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 999px; padding: 12px 20px; font-size: 14px;
  box-shadow: 0 8px 24px -6px rgba(20,10,30,.45);
  animation: toastIn .2s cubic-bezier(.2, 1.2, .4, 1);
}
@keyframes toastIn { from { transform: translateY(12px) scale(.96); opacity: 0; } }

/* ---------- 许可展开 / 关于 ---------- */
.expander .li { min-height: 48px; }
.license-text { font-family: ui-monospace, Consolas, monospace; font-size: 12px; color: var(--on-surface-variant); padding: 0 16px 14px; white-space: pre-wrap; }

/* ---------- 壁纸预览 ----------
   仅 `.wp-preview` 存活（预览对话框用）；原「壁纸中心」网格样式
   （.wp-grid/.wp-cell/.wp-add/.wp-thumb）随 0.9.5 素材统一下线清理。 */
.wp-preview { height: min(280px, 30vh); aspect-ratio: 9/16; margin: 10px auto; border-radius: 18px; box-shadow: var(--shadow-float); }

/* ---------- 素材中心 ---------- */
.as-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px; margin: 10px -16px 0; }
.as-cell { position: relative; aspect-ratio: 1; overflow: hidden; cursor: pointer; border-radius: 4px; }
.as-add {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  background: var(--surface-container); color: var(--on-surface-variant);
  border: 1.5px dashed var(--outline); font-size: 12px;
}

/* ---------- 素材查看器（相册式，沉浸式全屏：无顶栏，见 ui.js full 选项） ---------- */
.av-stage {
  position: absolute; inset: 0; z-index: 5;
  background: radial-gradient(120% 90% at 50% 10%, #241c38 0%, #120e1c 60%, #0a0712 100%);
  overflow: hidden;
  display: flex; align-items: center; justify-content: center;
}
.av-media {
  width: min(86%, 340px); aspect-ratio: 9/16; border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 12px 40px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.08);
}
.av-counter {
  position: absolute; top: calc(var(--statusbar-h) + 12px); left: 0; right: 0; text-align: center;
  color: rgba(255,255,255,.75); font-size: 12px;
  text-shadow: 0 1px 4px rgba(0,0,0,.5);
}
.av-nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(255,255,255,.16); cursor: pointer;
  background: rgba(255,255,255,.12); backdrop-filter: blur(8px);
  color: rgba(255,255,255,.9);
  display: flex; align-items: center; justify-content: center;
  transition: background .15s, transform .12s;
}
.av-nav:active { transform: translateY(-50%) scale(.9); }
.av-nav.left { left: 10px; }
.av-nav.left .ic { transform: rotate(180deg); }
.av-nav.right { right: 10px; }
.proc-bar {
  position: absolute; left: 12px; right: 12px; bottom: 92px; z-index: 7;
  display: flex; align-items: center; gap: 10px;
  background: rgba(30,24,48,.78); backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 16px; padding: 12px 14px; color: #EAE4F2;
  box-shadow: 0 10px 28px rgba(0,0,0,.45);
}
.proc-bar .dl-status { color: rgba(234,228,242,.8); }
.av-toolbar {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 6;
  display: flex; justify-content: space-around;
  background: rgba(18,14,30,.72); backdrop-filter: blur(14px);
  border-top: 1px solid rgba(255,255,255,.10);
  padding: 10px 6px calc(2px + var(--gesture-h));
}
.tool {
  border: 0; background: none; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  color: rgba(255,255,255,.85); font-size: 11px; min-width: 56px;
  transition: opacity .15s, transform .12s;
}
.tool:active { opacity: .6; transform: scale(.92); }
.tool-ic { width: 40px; height: 30px; display: flex; align-items: center; justify-content: center; }
.tool-ic .ic { width: 22px; height: 22px; }
/* 主标签禁折行：任何备注都不并入主标签（曾因「3D 点云（旗舰芯）」撑宽按钮致邻键错位；
   定案为按钮文案不带备注，nowrap 只作布局兜底） */
.tool-label { white-space: nowrap; }

/* ---------- 素材查看器：点云 / 音频 ---------- */
.av-cloud {
  position: absolute; inset: 0; overflow: hidden;
  background: radial-gradient(120% 90% at 50% 20%, #2b2140 0%, #120e1c 60%, #060409 100%);
}
.av-cloud-inner {
  position: absolute; inset: 0; transform-style: preserve-3d; perspective: 600px;
}
.av-cloud-inner.sway { animation: cloudSway 7s ease-in-out infinite alternate; }
@keyframes cloudSway {
  from { transform: rotateX(-4deg) rotateY(-6deg); }
  to { transform: rotateX(4deg) rotateY(6deg); }
}
.av-cloud-dot { position: absolute; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #ffd9a8, #b46a3c 70%, transparent 75%); }
.cloud-panel {
  /* 顶部面板（对齐 App PointCloudStage：TopStart + statusBarsPadding + top 56dp）
     ——原为底部 bottom: 86px，与 Compose 实现相反，第十三轮真机走查后对齐。 */
  position: absolute; left: 10px; right: 10px; top: calc(var(--statusbar-h) + 56px); z-index: 7;
  background: rgba(16,12,28,.82); backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 16px; padding: 8px 12px 10px; color: #cfd2e0;
  max-height: 46vh; overflow-y: auto;
}
.cloud-toggle {
  position: absolute; right: 12px; top: calc(var(--statusbar-h) + 8px); z-index: 7;
  width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(255,255,255,.16); cursor: pointer;
  background: rgba(255,255,255,.12); backdrop-filter: blur(8px); color: rgba(255,255,255,.9);
  display: flex; align-items: center; justify-content: center;
}
/* 第十四轮：点云加载态——缓存预览图（原型为色调渐变占位）压暗模糊打底 +
   粒子聚合浮动 + 环形指示；数据就绪后整台 .reveal 淡入（只动 opacity，
   不与 inner 的 sway/inline transform 冲突） */
.av-cloud.reveal { animation: cloudIn .45s ease-out; }
@keyframes cloudIn { from { opacity: 0; } }
.av-load-bg { position: absolute; inset: -20px; filter: blur(10px) brightness(.55); transform: scale(1.06); }
.av-load { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; }
.av-load-dot {
  position: absolute; border-radius: 50%; background: rgba(255,255,255,.8);
  box-shadow: 0 0 8px rgba(255,255,255,.35);
  animation: loadDot 1.25s ease-in-out infinite alternate;
}
@keyframes loadDot { from { transform: translateY(7px) scale(.65); opacity: .22; } to { transform: translateY(-7px) scale(1); opacity: .9; } }
.av-load-text { color: rgba(255,255,255,.85); font-size: 13px; text-shadow: 0 1px 4px rgba(0,0,0,.5); }
/* 平面平移演示：摇摆从旋转改为位移 */
.av-cloud-inner.sway-flat { animation: cloudSwayFlat 7s ease-in-out infinite alternate; }
@keyframes cloudSwayFlat { from { transform: translate(-9px, 7px); } to { transform: translate(9px, -7px); } }
/* 网格渲染演示：点更实（对应 App mesh+原图纹理的锐利观感） */
.av-cloud-dot.crisp { background: radial-gradient(circle at 35% 30%, #ffd9a8 32%, #b46a3c 64%, transparent 70%); }
/* 点云壁纸设置页（pcwall）底部调整面板：与 .cloud-panel 同玻璃质感但锚底 */
.pcw-panel {
  position: absolute; left: 10px; right: 10px; bottom: calc(10px + var(--gesture-h)); z-index: 7;
  background: rgba(16,12,28,.82); backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 16px; padding: 6px 12px 10px; color: #cfd2e0;
  max-height: 52vh; overflow-y: auto;
}
/* 面板标题行 + 收起柄（2026-09-30：面板可整块隐藏，露出舞台判断取景） */
.pcw-panel-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 2px 0 6px; font-size: 12px; color: rgba(207,210,224,.75);
}
.pcw-panel-hide {
  display: inline-flex; align-items: center; border: 0; cursor: pointer;
  background: rgba(255,255,255,.10); color: rgba(255,255,255,.75);
  border-radius: 50%; width: 26px; height: 26px; justify-content: center;
}
.pcw-panel-hide .ic { width: 18px; height: 18px; }
.pcw-panel-hide:hover { background: rgba(255,255,255,.18); }
/* 面板隐藏态：底部「调整参数」小药丸 */
.pcw-panel-toggle {
  position: absolute; left: 50%; transform: translateX(-50%);
  bottom: calc(16px + var(--gesture-h)); z-index: 7;
  display: inline-flex; align-items: center; gap: 4px;
  background: rgba(255,255,255,.14); backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.16); border-radius: 20px;
  color: rgba(255,255,255,.9); font-size: 12px; padding: 8px 16px; cursor: pointer;
}
.pcw-panel-toggle .ic { width: 16px; height: 16px; }
.av-audio {
  display: flex; flex-direction: column; align-items: center; gap: 18px;
}
.wave { display: flex; align-items: center; gap: 3px; height: 64px; }
.wave i { width: 4px; border-radius: 2px; background: linear-gradient(to top, #FF9DBE, #B79CED); display: block; }
.av-audio .bigplay {
  width: 64px; height: 64px; border-radius: 50%; border: 1px solid rgba(255,255,255,.2); cursor: pointer;
  background: rgba(255,255,255,.14); backdrop-filter: blur(6px); color: #fff;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 0 24px rgba(255,157,190,.3);
}

/* ---------- LLM 对话页：对话区 + 底部输入区 + 侧边菜单 ---------- */
.chat-page { height: 100%; display: flex; flex-direction: column; }
#chat { flex: 1; overflow-y: auto; min-height: 0; padding-top: 8px; }
.chat-empty { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 40px 28px; color: var(--on-surface-variant); text-align: center; }
.chat-empty .ic { width: 42px; height: 42px; opacity: .45; }
.composer { flex: none; padding: 10px 0 4px; border-top: 1px solid var(--glass-brd); }
.composer-top { display: flex; align-items: center; gap: 10px; min-width: 0; }
.model-chip { display: inline-flex; align-items: center; gap: 4px; max-width: 180px; overflow: hidden; }
.model-chip > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.model-chip .ic { width: 15px; height: 15px; flex: none; opacity: .8; }
.composer .ctx { flex: 1; display: flex; align-items: center; gap: 6px; min-width: 0; }
.composer .ctx > span { font-size: 11px; color: var(--on-surface-variant); white-space: nowrap; }
.composer .ctx .pbar { flex: 1; }
.composer .msg-row { margin-top: 10px; }
/* 输入区提示行：与 App 端 InputArea 的互斥提示同规则（未选模型/加载中/不支持/发送后可知），最多一行 */
.composer-hint { margin-top: 6px; font-size: 11px; color: var(--on-surface-variant); }
/* 输入框单行 56px 起步：对齐 App 端 56dp 最小高（App 端多行长高至 180dp 后内部滚动） */
.composer .field-input { min-height: 56px; }

/* 侧边抽屉：会话列表 + 底部设置（玻璃模糊） */
.drawer-mask { position: absolute; inset: 0; z-index: 40; background: rgba(40,26,52,.38); backdrop-filter: blur(2px); display: flex; }
.drawer {
  width: 80%; max-width: 300px; height: 100%;
  background: var(--glass-chrome);
  backdrop-filter: saturate(1.5) blur(22px); -webkit-backdrop-filter: saturate(1.5) blur(22px);
  border-right: 1px solid var(--glass-brd);
  display: flex; flex-direction: column;
  box-shadow: 8px 0 28px rgba(30,15,45,.30);
}
.d-head { display: flex; justify-content: space-between; align-items: center; padding: 18px 16px 10px; font-weight: 600; }
.d-list { flex: 1; overflow-y: auto; padding: 0 8px; }
.d-sess { display: flex; align-items: center; gap: 4px; padding: 10px; border-radius: 14px; cursor: pointer; transition: background .15s; }
.d-sess.on { background: var(--secondary-container); }
.d-body { flex: 1; min-width: 0; }
.d-title { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.d-sub { font-size: 11px; color: var(--on-surface-variant); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.d-del { flex: none; border: 0; background: none; color: var(--on-surface-variant); cursor: pointer; display: inline-flex; padding: 4px; border-radius: 50%; }
.d-del .ic { width: 15px; height: 15px; }
.d-thumb { width: 38px; height: 38px; border-radius: 10px; flex: none; }
.d-foot { flex: none; display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-top: 1px solid var(--glass-brd); cursor: pointer; font-size: 14px; color: var(--on-surface); }

/* ---------- LLM 会话 ---------- */
.sess-row { display: flex; gap: 6px; overflow-x: auto; padding: 8px 0 2px; scrollbar-width: none; align-items: center; }
.sess-row::-webkit-scrollbar { display: none; }
.sess {
  flex: none; display: inline-flex; align-items: center; gap: 4px;
  border: 1px solid var(--outline-variant); border-radius: 999px;
  background: var(--surface-container); color: var(--on-surface-variant);
  font-size: 12px; padding: 5px 10px; cursor: pointer; max-width: 140px;
  transition: background .18s, color .18s;
}
.sess.on { background: var(--secondary-container); color: var(--on-secondary-container); border-color: transparent; font-weight: 600; }
.sess .t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sess .x { display: inline-flex; opacity: .7; }
.ctx-bar { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
.ctx-bar span { flex: none; font-size: 11px; color: var(--on-surface-variant); }
.ctx-bar .pbar { flex: 1; }
.pbar-fill.hot { background: linear-gradient(135deg, #FF8B9D, #D64560); box-shadow: 0 0 10px rgba(214,69,96,.5); }
.msg-img { width: 120px; aspect-ratio: 1; border-radius: 12px; margin-top: 6px; }
.attach-chip {
  display: inline-flex; align-items: center; gap: 6px; margin-top: 6px;
  background: var(--surface-high); border: 1px solid var(--outline-variant);
  border-radius: 999px; padding: 4px 10px; font-size: 12px;
  cursor: pointer; color: var(--on-surface-variant);
}
.attach-chip .th { width: 28px; height: 28px; border-radius: 8px; flex: none; }
.attach-chip > span { display: inline-flex; }

/* ---------- 素材挑选对话框网格 ---------- */
.pick-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; padding: 6px 0; }
.pick-cell { aspect-ratio: 1; border-radius: 12px; cursor: pointer; border: 2px solid transparent; transition: border-color .15s, transform .12s; }
.pick-cell:active { transform: scale(.95); }
.pick-cell.on { border-color: var(--primary); box-shadow: var(--glow-soft); }

/* ---------- 点云统计卡 ----------
   名字保留 pc- 前缀（历史），实际挂在素材查看器的 .cloud-panel 内：
   定位与宽度由面板内的 inline 样式接管（position:static），此处只管视觉。
   旧 .pc-stage / .pc-controls / .pc-dot 于第十三轮清理。 */
.pc-stats {
  background: rgba(16,12,28,.75); backdrop-filter: blur(6px); color: #cfd2e0;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 12px;
  font-family: ui-monospace, Consolas, monospace; font-size: 10px; line-height: 1.7; padding: 8px 10px;
}

/* ---------- 更新卡 / 徽标 ---------- */
.update-card {
  border-left: 4px solid var(--primary);
  background: linear-gradient(120deg, rgba(255,157,190,.22), rgba(255,255,255,.45));
  box-shadow: var(--shadow-card), var(--glow-soft);
}
[data-theme="dark"] .update-card { background: linear-gradient(120deg, rgba(240,98,143,.24), rgba(46,39,66,.5)); }
.badge {
  display: inline-block; font-size: 11px; border-radius: 999px; padding: 2px 10px;
  background: var(--error-container); color: var(--on-error-container); font-weight: 600;
}
.badge.soft { background: var(--secondary-container); color: var(--on-secondary-container); }
.changes li, .dlg-body li { margin: 4px 0 4px 18px; }
.msg-row { display: flex; gap: 8px; margin-top: 8px; align-items: flex-end; }
.msg-row > .field-input { min-width: 0; }
.msg-row > .btn, .msg-row > .icbtn { flex: none; }
.msg-card { border-radius: 18px; padding: 10px 14px; max-width: 82%; font-size: 14px; line-height: 20px; }
.msg-card.user {
  background: var(--grad-primary); color: #fff; margin-left: auto;
  border-bottom-right-radius: 6px;
  box-shadow: var(--glow-soft);
}
[data-theme="dark"] .msg-card.user { color: #3D0E26; }
.msg-card.ai {
  background: var(--surface-high); color: var(--on-surface);
  border: 1px solid var(--glass-brd);
  border-bottom-left-radius: 6px;
  box-shadow: var(--shadow-card);
}
.msg-card.sys { background: transparent; color: var(--on-surface-variant); font-size: 12px; padding: 2px 6px; margin: 0 auto; }
/* AI 消息的吉祥物小头像（功能性装饰：助手即安卓娘） */
.msg-mascot {
  flex: none; width: 30px; height: 30px; border-radius: 50%;
  object-fit: cover; object-position: center 18%;
  background: var(--grad-hero);
  border: 1px solid var(--glass-brd);
  box-shadow: 0 2px 8px -2px rgba(120,60,100,.35);
}
.stat-grid { display: flex; gap: 16px; flex-wrap: wrap; font-size: 12px; color: var(--on-surface-variant); margin-top: 6px; }

/* ---------- 空态插画（ enlarged icon + 说明 ） ---------- */
.empty-illust { text-align: center; color: var(--on-surface-variant); padding: 72px 28px 32px; }
.empty-illust .ic { width: 72px; height: 72px; opacity: .4; margin-bottom: 14px; color: var(--primary); }
.empty-illust .empty-title { font-size: 15px; color: var(--on-surface); margin-bottom: 4px; font-weight: 600; }
.empty-illust .empty-sub { font-size: 12px; }

/* ---------- 角标（计数 / 进行中） ---------- */
.count-badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px;
  background: var(--grad-primary); color: #fff;
  font-size: 11px; font-weight: 700; line-height: 1;
  box-shadow: var(--glow-soft);
}
[data-theme="dark"] .count-badge { color: #3D0E26; }
.count-badge.dot { min-width: 10px; width: 10px; height: 10px; padding: 0; border-radius: 50%; }

/* ---------- 素材查看器返回键 ---------- */
.av-back {
  position: absolute; left: 10px; top: calc(var(--statusbar-h) + 8px); z-index: 8;
  width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(255,255,255,.16); cursor: pointer;
  background: rgba(255,255,255,.12); backdrop-filter: blur(8px); color: rgba(255,255,255,.92);
  display: flex; align-items: center; justify-content: center;
  transition: opacity .15s, transform .12s;
}
.av-back:active { opacity: .6; transform: scale(.9); }

/* ---------- 生图进度预览（模糊→清晰） ---------- */
.diff-preview {
  position: relative; aspect-ratio: 1; border-radius: 16px; overflow: hidden;
  background: linear-gradient(135deg, hsl(26,62%,64%), hsl(86,48%,30%));
  box-shadow: var(--shadow-card);
}
.diff-preview .diff-img {
  position: absolute; inset: 0;
  background: linear-gradient(135deg, hsl(340,62%,64%), hsl(40,48%,30%));
  filter: blur(14px) saturate(.7); transform: scale(1.06);
  transition: filter .3s, transform .3s;
}
.diff-preview .diff-pct {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,.92); font-size: 20px; font-weight: 600;
  text-shadow: 0 1px 6px rgba(0,0,0,.5);
}

/* ---------- LLM 停止生成按钮 ---------- */
.btn.stop { background: linear-gradient(135deg, #FF8B9D, #D64560); color: #fff; box-shadow: 0 6px 18px -4px rgba(214,69,96,.45); }

/* ---------- 批量导入选择格 ---------- */
.as-cell .as-check {
  position: absolute; top: 6px; right: 6px; z-index: 2;
  width: 22px; height: 22px; border-radius: 50%;
  background: rgba(255,255,255,.9); color: var(--primary);
  box-shadow: 0 2px 6px rgba(0,0,0,.2);
  display: flex; align-items: center; justify-content: center;
}
.as-cell .as-check .ic { width: 16px; height: 16px; }
.as-cell.selected { outline: 3px solid var(--primary); outline-offset: -3px; }
.batch-bar {
  position: sticky; bottom: 0; z-index: 5;
  display: flex; align-items: center; gap: 10px;
  background: var(--glass-chrome);
  backdrop-filter: var(--blur-chrome); -webkit-backdrop-filter: var(--blur-chrome);
  border: 1px solid var(--glass-brd);
  border-radius: 18px; padding: 10px 14px;
  margin-top: 10px; box-shadow: var(--shadow-float);
}

/* ---------- 主题切换过渡（I8：Compose 侧对应 animateColor） ---------- */
body, .card, .li, .topbar, .navbar, .chip, .btn, .tbtn, .field-input,
.content, .composer, .msg-card, .drawer, .dlg, .toast, .switch, .as-cell,
.batch-bar, .onboard, .d-sess, .empty-illust, .section-title {
  transition: background-color .22s ease, color .22s ease, border-color .22s ease, background .22s ease;
}

/* ---------- toast 动作按钮（I2 撤销） ---------- */
.toast { display: flex; align-items: center; gap: 12px; }
.toast-act {
  flex: none; border: 0; background: none; cursor: pointer;
  color: var(--c-pink-soft); font-size: 13px; font-weight: 700; padding: 4px 2px;
}
[data-theme="dark"] .toast-act { color: #C93A72; }

/* ---------- 回顶按钮（I3） ---------- */
.to-top {
  position: absolute; right: 14px; bottom: calc(var(--navbar-h) + 4px); z-index: 8;
  width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--glass-brd); cursor: pointer;
  background: var(--glass-chrome);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  color: var(--primary);
  box-shadow: var(--shadow-float);
  display: flex; align-items: center; justify-content: center;
  opacity: 0; pointer-events: none; transform: translateY(8px);
  transition: opacity .2s, transform .2s;
}
.to-top.on { opacity: 1; pointer-events: auto; transform: none; }
.to-top:active { transform: scale(.9); }
.to-top .ic { width: 20px; height: 20px; }

/* ---------- 首次引导横幅（I1） ---------- */
.onboard {
  position: absolute; left: 14px; right: 14px; bottom: calc(var(--navbar-h) - 2px); z-index: 9;
  display: flex; align-items: center; gap: 10px;
  background: var(--grad-soft), var(--surface-high);
  border: 1px solid var(--glass-brd);
  color: var(--on-surface);
  border-radius: 18px; padding: 12px 14px; cursor: pointer;
  box-shadow: var(--shadow-float);
  font-size: 13px; line-height: 18px;
}
.onboard .ic { width: 20px; height: 20px; flex: none; color: var(--primary); }
.onboard span { flex: 1; }
.onboard b { flex: none; color: var(--primary); font-weight: 700; }

/* ---------- 吸顶分区标题（I3）----------
 * 样式已并入上方 .section-title 主定义（第八轮胶囊化），此节不再重复声明。 */

/* ---------- 搜索与筛选（F1；第九轮：APK 列表搜索迁入独立子页，列表只留标签行） ---------- */
.search-row { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
.search-row .field-input { flex: 1; min-width: 0; padding-left: 36px; border-radius: 999px; }
.search-box { position: relative; flex: 1; min-width: 0; }
.search-box > .ic {
  position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
  width: 18px; height: 18px; color: var(--on-surface-variant); pointer-events: none;
}
/* 搜索框右侧清空键（有词时出现） */
.search-box .search-clear {
  position: absolute; right: 4px; top: 50%; transform: translateY(-50%);
  width: 36px; height: 36px; color: var(--on-surface-variant);
}
.search-box .search-clear .ic { width: 18px; height: 18px; }

/* ---------- 骨架屏（I4） ---------- */
.skel {
  border-radius: 14px; min-height: 72px; margin-top: 10px;
  background: linear-gradient(90deg, var(--surface-container) 25%, var(--surface-highest) 50%, var(--surface-container) 75%);
  background-size: 200% 100%; animation: shimmer 1.2s infinite;
}
@keyframes shimmer { to { background-position: -200% 0; } }

/* ---------- 素材列表视图 / 工具行（F5/F6） ---------- */
.as-tools { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
.as-tools .chip-row { flex: 1; padding: 0; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
.as-list .as-row {
  display: flex; align-items: center; gap: 12px; padding: 8px 16px; margin: 0 -16px;
  cursor: pointer; min-height: 64px;
  transition: background .15s;
}
.as-list .as-row:active { background: rgba(233,78,138,.08); }
.as-list .as-thumb {
  width: 52px; height: 52px; border-radius: 12px; flex: none; position: relative; overflow: hidden;
  box-shadow: 0 3px 10px -3px rgba(60,30,60,.25);
}
.as-list .as-thumb .as-check { top: 3px; right: 3px; width: 18px; height: 18px; }
.as-row.selected .as-thumb { outline: 3px solid var(--primary); outline-offset: -3px; }

/* ---------- 消息操作行（F8） ---------- */
.msg-actions { display: flex; gap: 2px; margin: 2px 4px 0; }
.msg-actions button {
  border: 0; background: none; cursor: pointer; color: var(--on-surface-variant);
  width: 32px; height: 28px; border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background .15s;
}
.msg-actions button:active { background: rgba(233,78,138,.12); }
.msg-actions .ic { width: 16px; height: 16px; }
.msg-row + .msg-actions { justify-content: flex-start; }
.msg-card.user ~ .msg-actions { justify-content: flex-end; }

/* ---------- 空态 CTA（I5） ---------- */
.empty-cta { display: flex; gap: 10px; justify-content: center; margin-top: 18px; flex-wrap: wrap; }

/* ---------- 节点状态（F14） ---------- */
.node-row { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--on-surface-variant); }
.node-dot { width: 8px; height: 8px; border-radius: 50%; background: #35C48A; flex: none; box-shadow: 0 0 6px rgba(53,196,138,.6); }
.node-dot.slow { background: #FFB42E; box-shadow: 0 0 6px rgba(255,180,46,.6); }
.node-dot.down { background: var(--error); box-shadow: 0 0 6px rgba(214,69,96,.6); }

/* ============================================================
 * 吉祥物与二次元装饰（2026-09-25 新增）
 * 图片使用克制：全应用仅 3 张透明素材（立绘 / Q 版 / 头像），
 * 装饰一律 CSS 渐变与字符，不占额外资源。
 * ============================================================ */

/* 我的页 · 渐变横幅 + 立绘 */
.moe-hero {
  position: relative; margin-top: 10px;
  border-radius: 22px; overflow: hidden;
  background: var(--grad-hero);
  border: 1px solid var(--glass-brd);
  box-shadow: var(--shadow-card);
  min-height: 138px;
  display: flex; align-items: center;
}
.moe-hero-text { flex: 1; min-width: 0; padding: 18px 108px 18px 20px; position: relative; z-index: 2; }
.moe-hero-title { font-size: 18px; font-weight: 700; letter-spacing: .5px; }
.moe-hero-sub { font-size: 12px; color: var(--on-surface-variant); margin-top: 6px; line-height: 18px; }
/* Grok Bot 大头：底边对齐坐在卡片下沿；暗色主题换睡衣睡帽版 */
.moe-hero-img {
  position: absolute; right: 10px; bottom: 0; z-index: 1;
  height: calc(100% - 12px); pointer-events: none;
  filter: drop-shadow(0 6px 14px rgba(120,60,100,.28));
}
/* 明暗双图切换工具类（同一构图两版素材，暗色=睡帽睡衣） */
.n-only { display: none; }
[data-theme="dark"] .n-only { display: inline-block; }
[data-theme="dark"] .d-only { display: none; }
.moe-brand { font-family: 'MoeApk', sans-serif; letter-spacing: 1px; }

/* 闪烁星点（仅 hero 区 2–3 颗，transform/opacity 动画） */
.sparkle {
  position: absolute; z-index: 2; pointer-events: none;
  color: #fff; text-shadow: 0 0 8px rgba(255,180,210,.9), 0 0 2px rgba(255,255,255,.9);
  animation: twinkle 2.6s ease-in-out infinite;
}
.sparkle.s2 { animation-delay: .9s; }
.sparkle.s3 { animation-delay: 1.7s; }
@keyframes twinkle {
  0%, 100% { opacity: .25; transform: scale(.8) rotate(0deg); }
  50% { opacity: 1; transform: scale(1.15) rotate(20deg); }
}

/* 登录页 · Q 版迎宾 */
.login-mascot { display: flex; justify-content: center; padding: 18px 0 2px; }
.login-mascot img {
  width: 128px; pointer-events: none;
  filter: drop-shadow(0 8px 16px rgba(120,60,100,.30));
  animation: floaty 3.2s ease-in-out infinite;
}
@keyframes floaty {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}

/* AI 枢纽入口图标着色（按 ai-ent-* class，入口卡增减不受顺序影响） */
.ai-grid .card .li-icon { padding: 9px; border-radius: 14px; }
.ai-grid .ai-ent-models .li-icon { color: var(--c-violet); background: rgba(147,112,219,.14); }
.ai-grid .ai-ent-llm .li-icon { color: var(--c-pink); background: rgba(233,78,138,.13); }
.ai-grid .ai-ent-diff .li-icon { color: var(--c-mint); background: rgba(47,174,125,.14); }
.ai-grid .ai-ent-tts .li-icon { color: var(--c-sky); background: rgba(91,143,217,.14); }
.ai-grid .ai-ent-prompts .li-icon { color: #D9932B; background: rgba(217,147,43,.14); }
[data-theme="dark"] .ai-grid .ai-ent-models .li-icon { color: #B79CED; background: rgba(147,112,219,.20); }
[data-theme="dark"] .ai-grid .ai-ent-llm .li-icon { color: #FF9DBE; background: rgba(240,98,143,.20); }
[data-theme="dark"] .ai-grid .ai-ent-diff .li-icon { color: #7FDDB4; background: rgba(67,199,149,.18); }
[data-theme="dark"] .ai-grid .ai-ent-tts .li-icon { color: #8FB8EC; background: rgba(91,143,217,.20); }
[data-theme="dark"] .ai-grid .ai-ent-prompts .li-icon { color: #F2C078; background: rgba(217,147,43,.20); }

/* 减弱动态（无障碍 & 低端机）：停掉一切循环动画 */
@media (prefers-reduced-motion: reduce) {
  .sparkle, .login-mascot img, .av-cloud-inner.sway, .av-cloud-inner.sway-flat,
  .av-load-dot, .av-cloud.reveal { animation: none !important; }
}

/* ============================================================
 * 横屏 / 平板适配（App 侧对应 WindowSizeClass 与 NavigationSuiteScaffold）
 * 断点与 JS 侧 isRail()/isWide() 阈值一致（720 / 920，取 .phone 容器宽）：
 *   <720  竖屏手机：现状（NavigationBar 底栏）
 *   ≥720  横屏手机 / 小平板：NavigationRail 左栏
 *   ≥920  平板横屏 / 桌面全屏：双栏 master-detail + 多列网格
 * ============================================================ */

/* ---------- ≥720px：NavigationRail ---------- */
@container (min-width: 720px) {
  #app.has-nav .navbar {
    position: absolute; left: 0; top: var(--topbar-h); bottom: 0; width: 84px;
    flex-direction: column; height: auto; padding: 12px 0;
    border-top: 0; border-right: 1px solid var(--glass-brd);
    z-index: 6;
  }
  #app.has-nav .nav-item { flex: none; width: 84px; height: 62px; }
  #app.has-nav .content { margin-left: 84px; }
  #app.has-nav .onboard { left: 98px; }
  /* 素材网格负边距在右移后收敛回内容区内 */
  #app.has-nav .as-grid { margin-left: 0; }
}

/* ---------- ≥920px：双栏与多列 ---------- */
@container (min-width: 920px) {
  /* 素材网格按宽度自适应列数 */
  .as-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); margin-left: 0; margin-right: 0; }
  /* APK 应用/游戏/开源列表两列 */
  .two-col { display: grid; grid-template-columns: 1fr 1fr; column-gap: 12px; align-items: start; }
  /* AI 枢纽入口两列 */
  .ai-grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 12px; }
  /* 双栏 master-detail：历史/会话列表常驻左栏（LLM / 生图 / 合成） */
  .chat-page.two-pane { flex-direction: row; gap: 12px; }
  .chat-page.two-pane .pane-side {
    width: 300px; flex: none; display: flex; flex-direction: column; min-height: 0;
    background: var(--surface-low); border: 1px solid var(--glass-brd);
    border-radius: 18px; overflow: hidden;
  }
  .chat-page.two-pane .pane-side .d-head { padding-top: 14px; }
  .chat-page.two-pane .pane-main { flex: 1; min-width: 0; display: flex; flex-direction: column; min-height: 0; }
  /* 主区内容（进度/结果卡）在宽栏里限宽，避免一行拉太长 */
  .chat-page.two-pane .pane-main > .card,
  .chat-page.two-pane .pane-main > div[style*="padding-top:8px"] { max-width: 640px; width: 100%; margin-left: auto; margin-right: auto; }
  .chat-page.two-pane .composer { max-width: 640px; width: 100%; margin-left: auto; margin-right: auto; }
}

/* ============================================================
 * 宅物陈列室（2026-10 新增板块，对应 js/screens/goods.js）
 * 策展语言：无价格红字、无促销标签、无销量信息；
 * 展品图为 emoji + 色相渐变占位（真实环境为 AI 筛选后的商品图）。
 * ============================================================ */

/* 展品封面占位（通用）：--gh 传色相；v1/v2 为详情页多图变体 */
.g-cover {
  display: flex; align-items: center; justify-content: center; overflow: hidden;
  background: linear-gradient(var(--ga, 135deg), hsl(var(--gh), 64%, 78%) 0%, hsl(calc(var(--gh) + 36), 56%, 62%) 100%);
}
.g-cover span { font-size: 44px; filter: drop-shadow(0 4px 10px rgba(60, 25, 55, .25)); transition: transform .2s; }
/* 真实商品图（淘宝 CDN）：绝对定位覆盖渐变占位；加载失败由 onerror 移除 img 回落占位 */
.g-cover img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* 宽扁槽位（fit）：方形商品图完整呈现，两侧露渐变底 */
.g-cover.fit img { object-fit: contain; }
/* 焦点对齐（focus 字段，cover 裁剪时保商品主体） */
.g-cover[data-focus="top"] img { object-position: center top; }
.g-cover[data-focus="bottom"] img { object-position: center bottom; }
.g-cover.v1 { --ga: 160deg; }
.g-cover.v2 { --ga: 108deg; }
.g-cover.v1 span { transform: scale(1.35) rotate(-8deg); }
.g-cover.v2 span { transform: scale(.8) rotate(10deg) translateY(6%); }
[data-theme="dark"] .g-cover {
  background: linear-gradient(var(--ga, 135deg), hsl(var(--gh), 44%, 34%) 0%, hsl(calc(var(--gh) + 36), 40%, 24%) 100%);
}

/* ---------- 主页 · 策展头 ---------- */
.g-hero {
  margin-top: 8px; padding: 16px 18px;
  border-radius: 22px; background: var(--grad-hero);
  border: 1px solid var(--glass-brd); box-shadow: var(--shadow-card);
}
.g-hero-title { font-size: 20px; font-weight: 700; letter-spacing: .5px; }
.g-hero-sub { font-size: 12px; color: var(--on-surface-variant); margin-top: 4px; }

/* ---------- 主页 · 新入荷横滑条（只署名不标价） ---------- */
.g-fresh {
  display: flex; gap: 10px; overflow-x: auto; scrollbar-width: none;
  margin: 2px -16px 0; padding: 6px 16px 10px;
}
.g-fresh::-webkit-scrollbar { display: none; }
.g-fresh-card { flex: none; width: 104px; cursor: pointer; position: relative; }
.g-fresh-card .g-cover {
  aspect-ratio: 1; border-radius: 14px;
  border: 1px solid var(--glass-brd); box-shadow: var(--shadow-card);
  transition: transform .15s;
}
.g-fresh-card:active .g-cover { transform: scale(.95); }
.g-fresh-name {
  font-size: 12px; font-weight: 600; margin-top: 6px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.g-fresh-cat { font-size: 10px; color: var(--on-surface-variant); margin-top: 1px; }

/* ---------- 主页 · 杂志错落分类墙（6 列网格，span/高度按节奏表） ---------- */
.g-mosaic { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; grid-auto-flow: dense; margin-top: 2px; }
.g-mos-card {
  position: relative; border-radius: 18px; overflow: hidden; cursor: pointer;
  border: 1px solid var(--glass-brd); box-shadow: var(--shadow-card);
  transition: transform .15s, box-shadow .2s;
}
.g-mos-card:active { transform: scale(.965); }
.g-mos-card .g-cover { position: absolute; inset: 0; }
/* 拼贴感：封面微旋转（scale 补边），左右交替 */
.g-mos-card:nth-child(odd) .g-cover { transform: rotate(.7deg) scale(1.07); }
.g-mos-card:nth-child(even) .g-cover { transform: rotate(-.7deg) scale(1.07); }
.g-mos-label {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 26px 12px 10px;
  background: linear-gradient(transparent, rgba(28, 14, 38, .62));
  color: #fff;
}
.g-mos-name { font-size: 15px; font-weight: 700; text-shadow: 0 1px 6px rgba(30, 10, 40, .5); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.g-mos-sub { font-size: 10px; opacity: .85; margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---------- 展厅（分类页） ---------- */
.g-cat-hero { display: flex; align-items: center; gap: 14px; padding: 14px 4px 4px; }
.g-cat-emoji {
  flex: none; width: 56px; height: 56px; border-radius: 18px;
  display: flex; align-items: center; justify-content: center; font-size: 28px;
  background: var(--grad-soft), var(--surface-high);
  border: 1px solid var(--glass-brd); box-shadow: var(--shadow-card);
}
.g-cat-name { font-size: 19px; font-weight: 700; }
.g-cat-sub { font-size: 11px; color: var(--on-surface-variant); margin-top: 1px; }
.g-cat-blurb { font-size: 12px; color: var(--on-surface-variant); margin-top: 4px; }

/* 双列瀑布流（小红书式）；卡片比例按 id 哈希错开 */
.g-falls { column-count: 2; column-gap: 10px; margin-top: 4px; }
.g-fall-card {
  break-inside: avoid; margin-bottom: 10px; border-radius: 16px; overflow: hidden; cursor: pointer;
  background: var(--surface-low); border: 1px solid var(--glass-brd); box-shadow: var(--shadow-card);
  transition: transform .12s; position: relative;
}
.g-fall-card:active { transform: scale(.97); }
.g-fall-card .g-cover span { font-size: 40px; }
.g-fall-body { padding: 10px 12px 12px; }
.g-fall-title {
  font-size: 13px; font-weight: 600; line-height: 18px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
/* 列表价格弱化：小号普通色，不用电商红 */
.g-fall-meta { display: flex; align-items: baseline; justify-content: space-between; margin-top: 6px; font-size: 11px; color: var(--on-surface-variant); }
.g-fall-price { font-weight: 600; }

/* ---------- 展品卡（详情） ---------- */
/* 顶部图片 pager：scroll-snap 横滑，负 margin 满宽 */
.g-pager-wrap { position: relative; margin: 4px -16px 0; }
.g-pager {
  display: flex; overflow-x: auto; scrollbar-width: none;
  scroll-snap-type: x mandatory; overscroll-behavior-x: contain;
}
.g-pager::-webkit-scrollbar { display: none; }
.g-shot { flex: none; width: 100%; aspect-ratio: 1; scroll-snap-align: center; position: relative; }
.g-shot .g-cover { width: 100%; height: 100%; }
.g-shot .g-cover span { font-size: 96px; }
.g-dots { position: absolute; bottom: 12px; left: 0; right: 0; display: flex; justify-content: center; gap: 6px; pointer-events: none; }
.g-dot { width: 6px; height: 6px; border-radius: 999px; background: rgba(255, 255, 255, .55); box-shadow: 0 1px 3px rgba(30, 10, 40, .3); transition: width .2s, background .2s; }
.g-dot.on { width: 16px; background: #fff; }

.g-d-title { font-size: 19px; font-weight: 700; line-height: 26px; margin-top: 14px; }
.g-d-meta { font-size: 11px; color: var(--on-surface-variant); margin-top: 4px; }
/* 价格移入底部 CTA 行（.g-cta-price，见 CTA 节） */

/* 陈列备注（展品说明牌）：柔和渐变底卡片 */
.g-note {
  margin-top: 12px; padding: 12px 14px; border-radius: 16px;
  background: var(--grad-soft), var(--surface-low);
  border: 1px solid var(--glass-brd); box-shadow: var(--shadow-card);
  font-size: 13px; line-height: 20px;
}
.g-note-label { font-size: 11px; font-weight: 700; color: var(--primary); margin-bottom: 4px; letter-spacing: .3px; }
.g-attrs { padding-bottom: 2px; }
/* IP 标签与实体页：与规格芯片/展厅分类区分，沿既有 chip 与 surface 令牌 */
.g-ip-tags { padding-top: 6px; }
.g-ip-tags .chip { color: var(--primary); }
.g-ip-filter { align-items: center; }
.g-ip-hero {
  margin-top: 10px; padding: 14px 16px; border-radius: 18px;
  background: var(--grad-soft), var(--surface-low);
  border: 1px solid var(--glass-brd); box-shadow: var(--shadow-card);
}
.g-ip-kind { font-size: 11px; color: var(--on-surface-variant); }
.g-ip-name { font-size: 20px; font-weight: 700; margin-top: 3px; }
.g-ip-summary { font-size: 12px; line-height: 19px; color: var(--on-surface-variant); margin-top: 6px; }
.g-ip-lineage { display: flex; flex-wrap: wrap; align-items: center; gap: 3px; margin-top: 7px; color: var(--on-surface-variant); font-size: 11px; line-height: 17px; }
.g-ip-lineage i { font-style: normal; color: var(--outline); }
.g-ip-lineage .current { color: var(--primary); font-weight: 600; }
.g-ip-tree-entry {
  width: 100%; margin: 4px 0 8px; padding: 12px 14px;
  display: flex; align-items: center; gap: 10px; text-align: left;
  border: 1px solid var(--glass-brd); border-radius: 18px;
  background: var(--grad-soft), var(--surface-low); color: var(--on-surface);
  box-shadow: var(--shadow-card); font: inherit; cursor: pointer;
}
.g-ip-tree-entry:active { transform: scale(.985); }
.g-ip-tree-entry > .ic { flex: none; width: 20px; color: var(--on-surface-variant); }
.g-ip-tree-icon { flex: none; width: 38px; height: 38px; border-radius: 13px; display: flex; align-items: center; justify-content: center; color: var(--primary); background: var(--secondary-container); }
.g-ip-tree-icon .ic { width: 20px; height: 20px; }
.g-ip-tree-copy { flex: 1; min-width: 0; }
.g-ip-tree-copy strong { display: block; font-size: 14px; line-height: 20px; }
.g-ip-tree-copy > span { display: block; margin-top: 2px; color: var(--on-surface-variant); font-size: 11px; line-height: 17px; }
.g-ip-tree-copy small { display: block; margin-top: 4px; color: var(--primary); font-size: 10px; line-height: 16px; }
.g-ip-count { margin: 8px 2px 4px; font-size: 12px; color: var(--on-surface-variant); }

/* 首页 IP 展厅：作品策展与精确角色并列，和下方物品形态墙明确分区 */
.g-sec-note { font-size: 10px; color: var(--on-surface-variant); }
.g-ip-halls {
  display: flex; gap: 10px; overflow-x: auto; scrollbar-width: none;
  margin: 2px -16px 0; padding: 6px 16px 10px;
}
.g-ip-halls::-webkit-scrollbar { display: none; }
.g-ip-hall-card {
  --ih-accent: var(--primary);
  flex: none; width: 218px; min-height: 154px; padding: 13px 14px;
  display: flex; flex-direction: column; text-align: left; font: inherit; color: var(--on-surface);
  border: 1px solid var(--glass-brd); border-top: 3px solid var(--ih-accent); border-radius: 18px;
  background: var(--surface-low); box-shadow: var(--shadow-card); cursor: pointer;
  transition: transform .15s, background-color .22s ease, border-color .22s ease;
}
.g-ip-hall-card.character { --ih-accent: var(--c-sky); }
.g-ip-hall-card:active { transform: scale(.97); }
.g-ip-hall-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.g-ip-hall-emoji { font-size: 28px; line-height: 32px; }
.g-ip-hall-kind {
  padding: 2px 7px; border: 1px solid var(--outline-variant); border-radius: 999px;
  color: var(--ih-accent); font-size: 10px; font-weight: 600;
}
.g-ip-hall-title { margin-top: 8px; font-size: 15px; font-weight: 700; line-height: 21px; }
.g-ip-hall-blurb {
  margin-top: 3px; min-height: 34px; font-size: 11px; line-height: 17px; color: var(--on-surface-variant);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.g-ip-hall-meta { margin-top: auto; padding-top: 9px; font-size: 10px; color: var(--on-surface-variant); }

/* 统一 IP 页三视图 */
.g-ip-tabs {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px;
  margin: 12px 0; padding: 4px; border: 1px solid var(--outline-variant); border-radius: 16px;
  background: var(--surface-container);
}
.g-ip-tab {
  min-width: 0; min-height: 42px; padding: 6px 4px; border: 0; border-radius: 12px;
  display: flex; align-items: center; justify-content: center; gap: 4px;
  background: transparent; color: var(--on-surface-variant); font: inherit; font-size: 12px; cursor: pointer;
}
.g-ip-tab .ic { width: 17px; height: 17px; flex: none; }
.g-ip-tab.on { color: var(--primary); background: var(--surface-highest); box-shadow: var(--shadow-card); font-weight: 600; }
.g-ip-curation {
  margin-top: 10px; padding: 12px 14px; border: 1px solid var(--glass-brd); border-radius: 16px;
  background: var(--grad-soft), var(--surface-low); box-shadow: var(--shadow-card);
}
.g-ip-curation-head { display: flex; align-items: center; gap: 11px; }
.g-ip-curation-emoji { flex: none; font-size: 30px; }
.g-ip-curation-title { font-size: 14px; font-weight: 700; }
.g-ip-curation-blurb { margin-top: 2px; font-size: 11px; line-height: 17px; color: var(--on-surface-variant); }
.g-ip-curation-rule {
  display: flex; align-items: center; gap: 5px; margin-top: 10px; padding-top: 8px;
  border-top: 1px dashed var(--outline-variant); color: var(--primary); font-size: 11px;
}
.g-ip-curation-rule .ic { width: 15px; height: 15px; }

/* appears_in + part_of / belongs_to 分层关系图：SVG 只画线，原生按钮承载节点与点击 */
.g-graph-legend {
  display: flex; align-items: flex-start; gap: 8px; margin-top: 10px; padding: 10px 12px;
  border: 1px dashed var(--outline-variant); border-radius: 14px; background: var(--surface-container);
  color: var(--on-surface-variant); font-size: 12px; line-height: 18px;
}
.g-graph-legend > .ic { flex: none; width: 17px; height: 17px; margin-top: 1px; color: var(--c-violet); }
.g-graph-legend span { min-width: 0; }
.g-graph-legend b { color: var(--on-surface); }
.g-graph-legend small { display: block; margin-top: 2px; font-size: 10px; }
.g-graph-caption { margin: 12px 2px 6px; font-size: 11px; color: var(--on-surface-variant); }
.g-graph-stage {
  position: relative; max-width: 760px; margin: 0 auto; overflow: hidden;
  border: 1px solid var(--glass-brd); border-radius: 18px; background: var(--surface-container);
}
.g-graph-svg { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; }
.g-graph-line { stroke: var(--outline); stroke-width: 1.5; opacity: .65; }
.g-graph-line.highlight { stroke: var(--primary); stroke-width: 2.5; opacity: 1; }
.g-graph-node {
  position: absolute; z-index: 1; transform: translate(-50%, -50%); width: 36%; min-height: 66px;
  padding: 8px 9px; border: 1px solid var(--outline-variant); border-top: 2px solid var(--primary);
  border-radius: 14px; background: var(--surface-highest); color: var(--on-surface); box-shadow: var(--shadow-card);
  display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
  font: inherit; cursor: pointer; transition: transform .15s, border-color .2s, box-shadow .2s;
}
.g-graph-node.character { border-top-color: var(--c-sky); }
.g-graph-node.group { border-top-color: var(--c-mint); }
.g-graph-node.media { border-top-color: var(--c-violet); }
.g-graph-node.root { cursor: default; background: var(--grad-soft), var(--surface-highest); }
.g-graph-node.highlight { border: 2px solid var(--primary); box-shadow: var(--ring-focus), var(--shadow-card); }
.g-graph-node:not(.root):active { transform: translate(-50%, -50%) scale(.96); }
.g-graph-node-kind { font-size: 9px; line-height: 13px; color: var(--on-surface-variant); }
.g-graph-node strong { max-width: 100%; margin: 2px 0; font-size: 12px; line-height: 17px; overflow-wrap: anywhere; }
.g-graph-node small { font-size: 9px; line-height: 12px; color: var(--on-surface-variant); }
/* 有同 IP 媒介的作品根：当前作品置顶，左媒介 / 右角色同屏分区，不共享资料条目 */
.g-graph-stage.dual .g-graph-node { width: 40%; min-height: 68px; padding: 7px 6px; }
.g-graph-stage.dual .g-graph-node.root { width: 44%; }
.g-graph-lane-label {
  position: absolute; z-index: 1; transform: translateX(-50%); width: 46%;
  color: var(--on-surface-variant); font-size: 10px; font-weight: 600; line-height: 14px; text-align: center;
}
.g-graph-lane-label.media { color: var(--c-violet); }
.g-graph-lane-label.character { color: var(--c-sky); }
.g-graph-line.media { stroke: var(--c-violet); }
.g-graph-line.character { stroke: var(--c-sky); }
.g-graph-line.character.highlight { stroke: var(--primary); }
.g-graph-empty {
  position: absolute; transform: translate(-50%, -50%); width: 38%; padding: 10px 4px;
  color: var(--on-surface-variant); font-size: 10px; line-height: 16px; text-align: center;
}
.g-graph-progress { margin-top: 8px; text-align: center; font-size: 11px; color: var(--on-surface-variant); }
.g-graph-progress.dual-progress { display: flex; flex-wrap: wrap; justify-content: center; gap: 3px 14px; }
.g-graph-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 10px 0 2px; }
.g-graph-actions .btn { max-width: 100%; }
.g-graph-raw { flex-basis: 100%; }
.g-graph-raw .ic { width: 15px; height: 15px; vertical-align: -3px; }

/* 联盟发现：独立原始结果，醒目的未策展披露，不沿用策展展品卡 */
.g-raw-warning {
  display: flex; align-items: flex-start; gap: 10px; margin-top: 10px; padding: 12px 14px;
  border: 1px solid var(--error); border-radius: 16px;
  background: var(--error-container); color: var(--on-error-container);
}
.g-raw-warning > .ic { flex: none; width: 22px; height: 22px; }
.g-raw-warning-title { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; font-size: 13px; }
.g-raw-warning-title span { opacity: .65; }
.g-raw-warning p { margin-top: 5px; font-size: 11px; line-height: 17px; }
.g-raw-query {
  display: flex; align-items: center; gap: 12px; margin-top: 10px; padding: 12px 14px;
  border: 1px solid var(--glass-brd); border-radius: 16px; background: var(--surface-low);
}
.g-raw-query > .ic { flex: none; width: 22px; height: 22px; color: var(--primary); }
.g-raw-query div { display: flex; flex-direction: column; min-width: 0; }
.g-raw-query span { font-size: 11px; color: var(--on-surface-variant); }
.g-raw-query strong { margin: 2px 0; font-size: 15px; }
.g-raw-query small { font-size: 10px; color: var(--on-surface-variant); }
.g-raw-count { margin: 12px 2px 6px; font-size: 11px; color: var(--on-surface-variant); }
.g-raw-list { display: grid; gap: 10px; }
.g-raw-card {
  min-width: 0; padding: 12px 14px; border: 1px solid var(--glass-brd); border-radius: 16px;
  background: var(--surface-low); box-shadow: var(--shadow-card);
}
.g-raw-card-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 10px; color: var(--on-surface-variant); }
.g-raw-card-top b { padding: 2px 6px; border-radius: 6px; background: var(--error-container); color: var(--on-error-container); font-size: 9px; }
.g-raw-title { margin: 8px 0; font-size: 13px; font-weight: 600; line-height: 19px; }
.g-raw-meta { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; font-size: 11px; color: var(--on-surface-variant); }
.g-raw-meta strong { color: var(--on-surface); font-size: 15px; }
.g-raw-promo {
  display: inline-block; margin-top: 8px; padding: 3px 7px; border: 1px dashed var(--outline-variant);
  border-radius: 8px; font-size: 10px; color: var(--on-surface-variant);
}
.g-raw-foot { padding: 12px 4px 2px; font-size: 10px; line-height: 16px; color: var(--on-surface-variant); }

/* 原始标题直展（坦诚区；提炼对照） */
.g-org-text {
  margin-top: 6px; padding: 10px 12px; border-radius: 12px;
  background: var(--surface-container); border: 1px solid var(--outline-variant);
  font-size: 12px; line-height: 18px; color: var(--on-surface-variant);
}

/* 可能存在的优惠（坦诚区；每条目一张虚线小卡 + SVG 图标，弱化不催促） */
.g-promo { margin-top: 10px; }
.g-promo-label { font-size: 11px; color: var(--on-surface-variant); margin-bottom: 6px; }
.g-promo-list { display: flex; flex-wrap: wrap; gap: 6px; }
.g-promo-card {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 6px 10px; border-radius: 10px;
  border: 1px dashed var(--outline-variant); background: var(--surface-container);
  font-size: 12px; line-height: 18px; color: var(--on-surface);
}
.g-promo-card .ic { width: 15px; height: 15px; color: var(--primary); flex-shrink: 0; }
/* CTA 价格的「约」（预估到手价，坦诚口径） */
.g-cta-about { font-size: 11px; font-weight: 400; color: var(--on-surface-variant); margin-right: 1px; }

/* 披露小字（详情页底部固定，合规 + 坦诚路线） */
.g-legal { font-size: 11px; line-height: 17px; color: var(--on-surface-variant); padding: 16px 6px 4px; opacity: .85; }

/* 可能已失效提示条（详情页，CTA 上方；保留展示 + 引导搜同款）；
   预售提示条同款视觉（坦诚区中性虚线盒，非警告色） */
.g-stale, .g-presale {
  display: flex; align-items: flex-start; gap: 8px;
  margin-top: 12px; padding: 10px 12px; border-radius: 12px;
  background: var(--surface-container); border: 1px dashed var(--outline-variant);
  font-size: 12px; line-height: 18px; color: var(--on-surface-variant);
}
.g-stale .ic, .g-presale .ic { width: 16px; height: 16px; flex-shrink: 0; margin-top: 1px; }
/* 瀑布卡失效淡标记 */
.g-fall-stale { font-size: 10px; color: var(--on-surface-variant); border: 1px solid var(--outline-variant); border-radius: 6px; padding: 0 4px; margin-left: 6px; }
/* 详情页数据落灰度已并入 meta 行（此物…前缀），不再单独占行 */

/* 底部 CTA：sticky 玻璃条（沿用 batch-bar 模式） */
.g-cta {
  position: sticky; bottom: 0; z-index: 5;
  display: flex; align-items: center; gap: 10px;
  background: var(--glass-chrome);
  backdrop-filter: var(--blur-chrome); -webkit-backdrop-filter: var(--blur-chrome);
  border: 1px solid var(--glass-brd); border-radius: 18px;
  padding: 10px 12px; margin-top: 10px; box-shadow: var(--shadow-float);
}
.g-cta-copy {
  border: 1px solid var(--outline-variant); border-radius: 14px;
  width: 44px; height: 44px; color: var(--on-surface-variant);
}
.btn.g-buying { opacity: .7; pointer-events: none; }
/* CTA 行内价格块（居右）：主价 + 划线价（为淘宝标价） */
.g-cta-price { margin-left: 6px; text-align: right; font-size: 17px; font-weight: 700; line-height: 1.15; white-space: nowrap; }
.g-cta-price s { display: block; font-size: 11px; font-weight: 400; color: var(--on-surface-variant); }

/* 原始标题直展（坦诚区；不再折叠） */
.g-org-label { margin-top: 14px; font-size: 12px; color: var(--on-surface-variant); }

/* 共享元素转场克隆体（卡片→详情 / 详情→卡片） */
.g-hero-anim {
  position: absolute; z-index: 90; pointer-events: none; overflow: hidden;
  border-radius: 14px;
  transition: left .3s cubic-bezier(.2, .9, .25, 1), top .3s cubic-bezier(.2, .9, .25, 1),
    width .3s cubic-bezier(.2, .9, .25, 1), height .3s cubic-bezier(.2, .9, .25, 1),
    opacity .14s ease;
}
.g-hero-anim.out { opacity: 0; }

/* 全屏查看器（挂 .phone 上，render 不销毁）：单击/X/Esc 退出，横滑切换，长按菜单 */
.g-viewer {
  position: absolute; inset: 0; z-index: 60;
  background: rgba(10, 7, 14, .97);
  opacity: 0; transition: opacity .18s ease;
  display: flex;
}
.g-viewer.on { opacity: 1; }
.g-viewer-strip {
  display: flex; width: 100%; height: 100%;
  overflow-x: auto; scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.g-viewer-strip::-webkit-scrollbar { display: none; }
.g-viewer-slide {
  flex: none; width: 100%; height: 100%; scroll-snap-align: center;
  display: flex; align-items: center; justify-content: center; position: relative;
}
.g-viewer-slide img { max-width: 100%; max-height: 100%; object-fit: contain; user-select: none; }
.g-viewer-ph {
  width: 66vmin; height: 66vmin; border-radius: 28px;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(150deg, hsl(var(--gh, 300), 62%, 62%), hsl(calc(var(--gh, 300) + 60), 52%, 32%));
}
.g-viewer-ph span { font-size: 96px; filter: drop-shadow(0 8px 18px rgba(0, 0, 0, .35)); }
.g-viewer-x {
  position: absolute; top: calc(10px + env(safe-area-inset-top, 0px)); left: 10px; z-index: 2;
  width: 38px; height: 38px; border-radius: 50%; border: none; cursor: pointer;
  background: rgba(255, 255, 255, .12); color: #fff;
  display: flex; align-items: center; justify-content: center;
}
.g-viewer-x .ic { width: 20px; height: 20px; }
.g-viewer-idx {
  position: absolute; bottom: calc(14px + env(safe-area-inset-bottom, 0px)); left: 0; right: 0;
  text-align: center; font-size: 12px; color: rgba(255, 255, 255, .65); pointer-events: none;
}

/* 主题切换过渡补入宅物卡片 */
.g-fall-card, .g-mos-card, .g-cover, .g-note, .g-hero, .g-cat-emoji,
.g-ip-hall-card, .g-ip-curation, .g-ip-tree-entry, .g-graph-stage, .g-graph-node, .g-raw-card {
  transition: background-color .22s ease, color .22s ease, border-color .22s ease;
}

/* 窄移动窗口（含 360px）：三标签与关系节点保持可点、文字不溢出 */
@container (max-width: 380px) {
  .g-ip-tab { gap: 2px; font-size: 11px; }
  .g-ip-tab .ic { width: 15px; height: 15px; }
  .g-ip-hall-card { width: 202px; }
  .g-graph-node { padding-left: 6px; padding-right: 6px; }
  .g-graph-stage.dual .g-graph-node { padding-left: 4px; padding-right: 4px; }
  .g-ip-tree-entry { padding-left: 11px; padding-right: 11px; }
}
@container (min-width: 720px) {
  .g-ip-tabs { max-width: 560px; margin-left: auto; margin-right: auto; }
  .g-raw-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .g-ip-hall-card { width: 236px; }
}

/* ---------- 宅物 · 横屏 / 平板 ---------- */
@container (min-width: 920px) {
  /* 瀑布三列 */
  .g-falls { column-count: 3; }
  /* 详情页 pager 不再满宽出血，收为圆角大图居中 */
  .g-pager-wrap { margin: 8px 0 0; border-radius: 20px; overflow: hidden; max-width: 640px; margin-left: auto; margin-right: auto; }
}

/* ============================================================
 * AI 功能改进（2026-10 第十八轮：LLM / 生图 / 提示词库）
 * ============================================================ */
/* AI 枢纽设备状态摘要行（推理设备 / 息屏保频 / RAM 余量） */
.ai-devline { padding: 0 16px 12px; font-size: 11px; color: var(--on-surface-variant); }
/* AI 消息用量行（tokens / tps / 投机接受率） */
.msg-meta { margin: 2px 4px 0 38px; font-size: 10px; color: var(--on-surface-variant); }
/* 深度思考气泡（虚线弱化，与正文区分） */
.msg-card.think { border-style: dashed; color: var(--on-surface-variant); font-style: italic; }
/* 字段说明小字（nightmare 式 caption：一句话人话说明） */
.field-cap { font-size: 11px; color: var(--on-surface-variant); margin-top: 2px; line-height: 16px; }
/* seed 锁 chip（锁定后紫藤高亮） */
.seed-chip.on { color: var(--c-violet); border-color: var(--c-violet); }
/* GGUF 自检能力徽章（视觉 / MTP / MoE） */
.achip.cap { background: rgba(147,112,219,.14); color: var(--c-violet); border-color: transparent; }
[data-theme="dark"] .achip.cap { background: rgba(147,112,219,.20); color: #B79CED; }
/* tag 工具栏（权重 / 删除 / 撤销重做 / 反推） */
.tag-toolbar { display: flex; align-items: center; gap: 4px; margin-top: 4px; }
.tag-toolbar .tbtn { font-size: 11px; padding: 4px 8px; }
.tag-toolbar .icbtn { width: 28px; height: 28px; }
.tag-toolbar .ic { width: 16px; height: 16px; }
/* 补全 chip 行（横滑，最多 12 个） */
.suggest-row { display: flex; gap: 6px; overflow-x: auto; padding: 6px 0 2px; scrollbar-width: none; }
.suggest-row::-webkit-scrollbar { display: none; }
.suggest-row .chip { flex: none; font-size: 11px; padding: 4px 10px; }
.suggest-row .sug-cn { font-size: 10px; opacity: .65; margin-left: 4px; }
/* 批量/扫描 chip 独立成行（拥挤时换行不裁切） */
.chip-row.wrap { flex-wrap: wrap; overflow-x: visible; }
/* 局部重绘遮罩涂抹层（canvas 覆盖在底图上） */
.mask-wrap { position: relative; aspect-ratio: 1; border-radius: 12px; overflow: hidden; margin-top: 6px; }
.mask-base { position: absolute; inset: 0; }
.mask-canvas { position: absolute; inset: 0; width: 100%; height: 100%; touch-action: none; cursor: crosshair; }
.mask-toolbar { display: flex; align-items: center; gap: 4px; margin-top: 6px; }
.mask-toolbar .slider-row { margin: 0; }
/* 结果卡收藏角标 */
.fav-corner {
  position: absolute; top: 8px; right: 8px; width: 34px; height: 34px; border-radius: 50%;
  background: rgba(255,255,255,.78); color: var(--c-pink); box-shadow: var(--shadow-card);
  display: flex; align-items: center; justify-content: center; cursor: pointer;
}
.fav-corner .ic { width: 18px; height: 18px; }
.fav-mark { color: var(--c-pink); display: inline-flex; }
.fav-mark .ic { width: 14px; height: 14px; }
/* 分阶段耗时 / 换载成本提示 */
.timing-line { margin-top: 6px; font-size: 11px; color: var(--on-surface-variant); }
.cost-note { margin-bottom: 8px; font-size: 11px; color: var(--on-surface-variant); }
/* 错误卡（失败阶段 + 原因 + 可行动建议） */
.err-card { border-left: 4px solid var(--error); }
.err-title { display: flex; align-items: center; gap: 6px; color: var(--error); font-weight: 600; font-size: 14px; }
.err-title .ic { width: 18px; height: 18px; }
.err-body { margin-top: 6px; font-size: 13px; color: var(--on-surface); }
.err-hint { margin-top: 4px; font-size: 12px; color: var(--on-surface-variant); }
/* 反推结果文本框 */
.caption-result { margin-top: 8px; padding: 10px 12px; border-radius: 12px; background: var(--surface-container); border: 1px solid var(--outline-variant); font-size: 13px; line-height: 20px; word-break: break-all; }
/* 扫描组卡（聚合多次扫描结果） */
.d-group .d-title { font-weight: 600; }
/* textarea 输入（系统提示词 / 提示词编辑） */
textarea.field-input { min-height: 84px; resize: vertical; font-family: inherit; line-height: 20px; padding-top: 12px; padding-bottom: 12px; }