/* ============ TAKE X · 亮色高级主题 ============ */
:root {
  --bg: #f6f7fb;
  --bg-2: #ffffff;
  --bg-1: #f2f3f8;
  --menu-bg: #ffffff;
  --card: #ffffff;
  --card-border: #e8eaf2;
  --text: #1a1a2e;
  --text-dim: #5b6478;
  --text-faint: #9aa3b5;
  --text-body: #33384d;
  --primary: #7c5cff;
  --primary-2: #6d4aff;
  --primary-soft: #f0edff;
  --accent: #f5c453;
  --green: #10b981;
  --green-soft: #ecfdf5;
  --bg-soft: #f8f8fc;
  --bg-soft-2: #f5f5fa;
  --bg-hover: #fafafe;
  --warn-bg: #fffbeb;
  --warn-text: #92400e;
  --warn-border: rgba(245,196,83,0.3);
  --nav-bg: rgba(255,255,255,0.82);
  --shadow: 0 1.8px 10.6px rgba(26, 26, 46, 0.06);
  --shadow-hover: 0 7px 26.4px rgba(124, 92, 255, 0.12);
  --radius: 14.1px;
}
/* 深色模式 */
[data-theme="dark"] {
  --bg: #0a0a12;
  --bg-2: #14141f;
  --bg-1: #1c1c2a;
  --menu-bg: #22222f;
  --card: rgba(255,255,255,0.04);
  --card-border: rgba(255,255,255,0.09);
  --text: #f8fafc;
  --text-dim: #94a3b8;
  --text-faint: #64748b;
  --text-body: #d8dce8;
  --primary: #8b7bff;
  --primary-2: #7c5cff;
  --primary-soft: rgba(124,92,255,0.14);
  --accent: #f5c453;
  --green: #34d399;
  --green-soft: rgba(52,211,153,0.15);
  --bg-soft: rgba(255,255,255,0.05);
  --bg-soft-2: rgba(255,255,255,0.06);
  --bg-hover: rgba(255,255,255,0.03);
  --warn-bg: rgba(245,196,83,0.08);
  --warn-text: #f5c453;
  --warn-border: rgba(245,196,83,0.25);
  --nav-bg: rgba(10,10,18,0.82);
  --shadow: 0 1.8px 10.6px rgba(0,0,0,0.4);
  --shadow-hover: 0 7px 26.4px rgba(124,92,255,0.25);
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: "PingFang SC", "Noto Sans SC", -apple-system, sans-serif;
  background: var(--bg); color: var(--text); min-height: 100vh; overflow-x: hidden;
}
/* 背景光效（浅色） */
.bg-glow {
  position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(616px 281.6px at 12% 0%, rgba(124,92,255,0.10), transparent 60%),
    radial-gradient(528px 264px at 88% 8%, rgba(139,92,246,0.07), transparent 60%),
    radial-gradient(792px 440px at 50% 100%, rgba(124,92,255,0.05), transparent 60%);
}
.hidden { display: none !important; }

/* ============ 导航 ============ */
.nav { position: sticky; top: 0; z-index: 100; background: var(--nav-bg); backdrop-filter: blur(14.1px); border-bottom: 0.9px solid var(--card-border); }
.nav-inner { max-width: 950.4px; margin: 0 auto; padding: 14.1px 21.1px; display: flex; justify-content: space-between; align-items: center; }
.logo { font-size: 15.8px; font-weight: 800; letter-spacing: 0.3px; color: var(--text); }
.logo span { background: linear-gradient(90deg, #7c5cff, #a78bfa); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.nav-links { display: flex; align-items: center; gap: 21.1px; }
.nav-links a { color: var(--text-dim); text-decoration: none; font-size: 12.3px; transition: color 0.2s; }
.nav-links a:hover { color: var(--primary); }

/* ============ Hero ============ */
.hero { max-width: 1126.4px; margin: 0 auto; padding: 61.6px 21.1px 44px; text-align: center; }
.hero-badge {
  display: inline-block; font-size: 11.4px; color: var(--primary); background: var(--primary-soft);
  border: 0.9px solid rgba(124,92,255,0.2); padding: 5.3px 14.1px; border-radius: 88px; margin-bottom: 21.1px;
}
.hero h1 { font-size: 45.8px; font-weight: 800; line-height: 1.15; letter-spacing: -0.9px; margin-bottom: 15.8px; color: var(--text); }
.grad { background: linear-gradient(90deg, #7c5cff, #a78bfa, #f5c453); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.hero-sub { font-size: 14.1px; color: var(--text-dim); line-height: 1.9; margin-bottom: 31.7px; }
.hero-sub b { color: var(--primary); font-weight: 600; }

/* 输入框 */
.input-shell {
  background: var(--bg-2); border: 0.9px solid var(--card-border);
  border-radius: 17.6px; padding: 7px;
  max-width: 915.2px; margin: 0 auto; /* 主框适中宽度居中(2026-09-03 俊导:长度加一点点 1000→1040) */
  box-shadow: 0 17.6px 52.8px rgba(26,26,46,0.08);
  transition: border-color 0.25s, box-shadow 0.25s;
}
.input-shell:focus-within { border-color: rgba(124,92,255,0.5); box-shadow: 0 17.6px 52.8px rgba(26,26,46,0.10), 0 0 0 3.5px rgba(124,92,255,0.08); }

/* 模式切换 */
/* 即梦式工具栏：选项靠左紧凑，提示文字+生成按钮最右（单行不换行） */
.hero-toolbar { display: flex; align-items: center; gap: 8.8px; padding: 3.5px 12.3px 10.6px; flex-wrap: nowrap; }
@media (max-width: 990px) { .hero-toolbar .input-hint { display: none; } .hero-toolbar { gap: 7px; } }
.hero-toolbar .input-hint {
  margin-left: auto; max-width: 167.2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: 10.1px; color: var(--text-faint); flex-shrink: 1;
}
.hero-toolbar .btn-generate { flex-shrink: 0; }
/* 自定义下拉（即梦式） */
.sel-wrap { position: relative; display: inline-block; }
.sel-btn {
  background: var(--bg-1); border: 0.9px solid var(--card-border); color: var(--text);
  border-radius: 88px; padding: 6.2px 12.3px; font-size: 11.4px; cursor: pointer;
  transition: all 0.2s; user-select: none; display: inline-flex; align-items: center; gap: 5.3px;
}
.sel-btn:hover { border-color: rgba(124,92,255,0.4); color: var(--primary); }
.sel-btn .caret { font-size: 8.8px; color: var(--text-faint); transition: transform 0.2s; }
.sel-wrap.open .sel-btn { border-color: rgba(124,92,255,0.5); color: var(--primary); box-shadow: 0 0 0 2.6px rgba(124,92,255,0.12); }
.sel-wrap.open .caret { transform: rotate(180deg); }
.sel-menu {
  position: absolute; top: calc(100% + 5.3px); left: 0; min-width: 140.8px;
  background: var(--menu-bg); border: 0.9px solid var(--card-border); border-radius: 10.6px;
  box-shadow: 0 10.6px 35.2px rgba(0,0,0,0.16); padding: 5.3px; z-index: 50;
  animation: selIn 0.15s ease;
}
@keyframes selIn { from { opacity: 0; transform: translateY(-3.5px); } to { opacity: 1; transform: none; } }
.sel-item {
  padding: 7.9px 10.6px; font-size: 11.4px; color: var(--text); border-radius: 7px; cursor: pointer;
  transition: background 0.15s; user-select: none; display: flex; align-items: center; gap: 7px;
}
.sel-item:hover { background: var(--primary-soft); color: var(--primary); }
.sel-item.active { background: linear-gradient(135deg, #7c5cff, #6d4aff); color: #fff; }
.sel-btn.locked { opacity: 0.72; cursor: not-allowed; border-style: dashed; pointer-events: none; }
.sel-btn.locked .caret { display: none; }
.opt-label { font-size: 10.6px; color: var(--text-faint); white-space: nowrap; }
.opt-label b { color: var(--primary); font-size: 12.3px; }
/* 时长弹窗（即梦式：选择视频生成时长） */
.dur-menu { width: 264px; padding: 12.3px; }
.dur-title { font-size: 11.4px; font-weight: 700; color: var(--text); margin-bottom: 14.1px; }
.dur-val {
  position: absolute; top: 10.6px; right: 10.6px; font-size: 10.6px; color: var(--primary);
  font-weight: 700; background: var(--primary-soft); border-radius: 88px; padding: 1.8px 8.8px;
}
.dur-range-row { display: flex; align-items: center; gap: 8.8px; }
.dur-range-col { flex: 1; }
.dur-smart {
  font-size: 10.6px; font-weight: 700; color: var(--primary); white-space: nowrap;
  background: var(--primary-soft); border-radius: 7px; padding: 3.5px 7px;
}
#durRange { width:100%; height:3.5px; margin:0; cursor:pointer; appearance:none; -webkit-appearance:none; border:0; border-radius:879.1px; outline:0; background:linear-gradient(90deg,#7c5cff 0 var(--dur-progress,0%),#e6e4ee var(--dur-progress,0%) 100%); }
#durRange::-webkit-slider-thumb { -webkit-appearance:none; appearance:none; width:12.3px; height:12.3px; border:2.6px solid #fff; border-radius:50%; background:#7c5cff; box-shadow:0 0.9px 4.4px rgba(74,54,180,.35); }
#durRange::-moz-range-thumb { width:8.8px; height:8.8px; border:2.6px solid #fff; border-radius:50%; background:#7c5cff; box-shadow:0 0.9px 4.4px rgba(74,54,180,.35); }
/* 刻度（照即梦：0 5 10 15 20 25 30） */
.dur-scale { display: flex; justify-content: space-between; padding: 1.8px 1.8px 0; font-size: 8.8px; color: var(--text-faint); user-select: none; }
.material-row { display: flex; align-items: center; gap: 7px; padding: 10.6px 12.3px 1.8px; flex-wrap: wrap; }
.material-row.hidden { display: none; }
.material-label { font-size: 10.6px; color: var(--text-faint); }
.chip-sm { padding: 3.5px 10.6px; font-size: 10.6px; }
.chip-sm.active { border-color: rgba(124,92,255,0.5); color: var(--primary); background: var(--primary-soft); }
#input {
  width: 100%; background: transparent; border: none; outline: none; resize: none;
  color: var(--text); font-size: 15px; font-family: inherit; padding: 14.1px 15.8px 7px; line-height: 1.6;
}
#input::placeholder { color: var(--text-faint); }
.input-footer { display: flex; justify-content: space-between; align-items: center; padding: 8.8px 10.6px 7px; gap: 10.6px; flex-wrap: wrap; }
.input-hint { font-size: 10.6px; color: var(--text-faint); }
.btn-generate {
  background: linear-gradient(135deg, #7c5cff, #6d4aff); color: #fff; border: none;
  border-radius: 10.6px; padding: 10.6px 21.1px; font-size: 13.2px; font-weight: 700; cursor: pointer;
  transition: all 0.2s; box-shadow: 0 3.5px 17.6px rgba(124,92,255,0.3);
}
.btn-generate .btn-text { display: inline-flex; align-items: center; gap: 7px; }
.btn-generate .cost-num { font-size: 11.4px; font-weight: 800; color: #ffe08a; opacity: 0.95; }
.btn-generate .btn-main { font-size: 13.2px; }
.btn-generate:hover { transform: translateY(-0.9px); box-shadow: 0 7px 26.4px rgba(124,92,255,0.4); }
.btn-generate:disabled { opacity: 0.6; cursor: not-allowed; transform: none; }
.loading { display: inline-flex; align-items: center; gap: 7px; }
.spinner { width: 13.2px; height: 13.2px; border: 1.8px solid rgba(255,255,255,0.4); border-top-color: #fff; border-radius: 50%; animation: spin 0.8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* 片型 chips */
.chips { display: flex; flex-wrap: wrap; gap: 8.8px; justify-content: center; margin-top: 24.6px; }
.chip {
  background: var(--bg-2); border: 0.9px solid var(--card-border);
  border-radius: 88px; padding: 7px 15.8px; font-size: 11.4px; color: var(--text-dim); cursor: pointer;
  transition: all 0.2s; box-shadow: 0 0.9px 3.5px rgba(26,26,46,0.04);
}
.chip:hover { border-color: rgba(124,92,255,0.4); color: var(--primary); background: var(--primary-soft); transform: translateY(-0.9px); }

/* 案例库横幅 */
/* 案例库 + 风格画廊并排(2026-09-02 俊导要求) */
.banner-row { display: flex; gap: 35.2px; align-items: stretch; justify-content: center; flex-wrap: wrap; margin-top: 26.4px; }
.banner-row .case-banner { flex: 0 1 369.6px; max-width: 369.6px; margin: 0; }
.case-banner {
  display: flex; align-items: center; gap: 12.3px; max-width: 492.8px; margin: 22.9px auto 0;
  padding: 12.3px 19.4px; border-radius: 14.1px; text-decoration: none;
  background: linear-gradient(135deg, rgba(124,92,255,0.14), rgba(79,195,247,0.10));
  border: 0.9px solid rgba(124,92,255,0.35);
  transition: all .25s; position: relative; overflow: hidden;
}
.case-banner::after {
  content: ''; position: absolute; top: -60%; left: -30%; width: 40%; height: 220%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent);
  transform: rotate(20deg); animation: cb-shine 3.2s infinite;
}
@keyframes cb-shine { 0% { left: -40%; } 60%, 100% { left: 130%; } }
.case-banner:hover { transform: translateY(-1.8px); box-shadow: 0 7px 26.4px rgba(124,92,255,0.25); border-color: rgba(124,92,255,0.6); }
.cb-icon { font-size: 26.4px; flex-shrink: 0; }
.cb-text { flex: 1; display: flex; flex-direction: column; gap: 1.8px; }
.cb-text b { font-size: 13.2px; color: var(--primary); font-weight: 800; }
.cb-sub { font-size: 10.6px; color: var(--text-faint); }
.cb-arrow { font-size: 17.6px; color: var(--primary); transition: transform .2s; }
.case-banner:hover .cb-arrow { transform: translateX(3.5px); }

/* 上传按钮 + 浮层 */
.input-left { display: flex; align-items: center; gap: 10.6px; flex-wrap: wrap; }
.upload-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 33.4px; height: 33.4px; border-radius: 50%; flex-shrink: 0;
  background: var(--bg-2); border: 0.9px solid var(--card-border);
  font-size: 17.6px; font-weight: 700; color: var(--primary); line-height: 1;
  cursor: pointer; transition: all .2s;
}
.upload-btn:hover { border-color: rgba(124,92,255,0.5); color: #fff; background: linear-gradient(135deg, #7c5cff, #6d4aff); transform: translateY(-0.9px) scale(1.05); }
.up-badge { position: relative; width: 38.7px; height: 54.6px; margin: 5.3px 10.6px 3.5px; }
.up-badge.hidden { display: none; }
/* 即梦式：多张图完全叠住（只看到最上面一张竖版图），hover 时依次向右滑出展开 */
.up-badge-item {
  position: absolute; left: 0; top: 0; width: 38.7px; height: 54.6px; border-radius: 7px;
  border: 1.8px solid var(--bg); background: var(--bg-2);
  box-shadow: 0 3.5px 10.6px rgba(0,0,0,0.18);
  overflow: hidden; transition: transform .28s cubic-bezier(.34,1.4,.64,1), box-shadow .2s;
}
.up-badge-item:nth-child(1) { z-index: 9; }
.up-badge-item:nth-child(2) { z-index: 8; }
.up-badge-item:nth-child(3) { z-index: 7; }
.up-badge-item:nth-child(4) { z-index: 6; }
.up-badge-item:nth-child(5) { z-index: 5; }
.up-badge-item:nth-child(6) { z-index: 4; }
.up-badge-item img { width: 100%; height: 100%; object-fit: cover; display: block; cursor: pointer; }
/* 默认完全叠住：只看到第 1 张 */
.up-badge-item { transform: translateX(0); }
/* hover / open：自动展开——每张依次向右滑出（浮层，不占布局空间） */
.up-badge:hover .up-badge-item, .up-badge.open .up-badge-item {
  transform: translateX(calc(var(--i, 0) * 45.8px));
  box-shadow: 0 5.3px 15.8px rgba(0,0,0,0.28);
}
/* 文件名：收起时第 1 张底部显示；展开后每张显示自己的 */
.up-badge-item .us-name {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 5;
  background: linear-gradient(transparent, rgba(0,0,0,0.75));
  color: #fff; font-size: 8.8px; line-height: 1.4; padding: 8.8px 3.5px 2.6px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: center;
}
.up-badge:hover .up-badge-item:nth-child(1) .us-name { opacity: 1; }
.up-badge-item .us-del {
  position: absolute; top: 1.8px; right: 1.8px; width: 14.1px; height: 14.1px;
  background: rgba(0,0,0,0.72); color: #fff; border: none; border-radius: 50%;
  font-size: 7.9px; line-height: 1; cursor: pointer; z-index: 20;
  display: none; align-items: center; justify-content: center; padding: 0;
}
.up-badge:hover .up-badge-item .us-del, .up-badge.open .up-badge-item .us-del { display: flex; }
.up-badge-item .us-del:hover { background: #ff2d55; }
/* 大图预览（hover 单张放大查看） */
.up-badge-item .us-zoom {
  display: none; position: absolute; bottom: calc(100% + 8.8px); left: 50%; transform: translateX(-50%);
  width: 158.4px; border-radius: 10.6px; overflow: hidden; z-index: 50;
  box-shadow: 0 12.3px 31.7px rgba(0,0,0,0.5); border: 0.9px solid var(--card-border); background: var(--bg);
  pointer-events: auto; cursor: zoom-in; /* 预览浮层可点击：点击直接放大 */
}
.up-badge-item .us-zoom img { width: 100%; height: auto; max-height: 211.2px; object-fit: cover; }
.up-badge-item:hover .us-zoom { display: block; }
/* ＋继续添加（隐藏：已去掉右下角＋，改用工具栏＋） */
.upload-mask {
  position: fixed; inset: 0; z-index: 60; background: rgba(5,6,15,0.7);
  display: flex; align-items: center; justify-content: center; padding: 17.6px;
}
.upload-mask.hidden { display: none; }
.upload-panel {
  background: var(--bg); border: 0.9px solid var(--card-border); border-radius: 17.6px;
  width: 100%; max-width: 404.8px; padding: 21.1px; box-shadow: 0 26.4px 70.4px rgba(0,0,0,0.4);
}
.up-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 7px; }
.up-head b { font-size: 15px; color: var(--text); }
.up-close { background: none; border: none; font-size: 15.8px; color: var(--text-faint); cursor: pointer; }
.up-close:hover { color: var(--text); }
.up-tip { font-size: 10.6px; color: var(--text-faint); line-height: 1.7; margin-bottom: 12.3px; }
.up-drop {
  border: 1.8px dashed var(--card-border); border-radius: 12.3px; padding: 22.9px 14.1px;
  text-align: center; cursor: pointer; transition: all .2s; color: var(--text-dim); font-size: 11.4px;
}
.up-drop:hover, .up-drop.dragover { border-color: rgba(124,92,255,0.6); background: var(--primary-soft); }
.up-icon { font-size: 26.4px; display: block; margin-bottom: 7px; }
.up-drop small { color: var(--text-faint); }
/* 首尾帧双槽位 */
.up-fl { display: flex; gap: 10.6px; }
.up-fl-slot { flex: 1; text-align: center; }
.up-fl-label { font-size: 11.4px; font-weight: 700; color: var(--text); display: block; margin-bottom: 7px; }
.up-fl-box {
  border: 1.8px dashed var(--card-border); border-radius: 12.3px; padding: 15.8px 8.8px;
  cursor: pointer; transition: all .2s; color: var(--text-dim); font-size: 11.4px;
  position: relative; overflow: hidden; min-height: 96.8px; display: flex; align-items: center; justify-content: center;
}
.up-fl-box:hover, .up-fl-box.dragover { border-color: rgba(124,92,255,0.6); background: var(--primary-soft); }
.up-fl-box.has-img { border-style: solid; border-color: rgba(124,92,255,0.5); padding: 0; }
.up-fl-thumb { width: 100%; height: 96.8px; object-fit: cover; display: block; }
.up-fl-empty { color: var(--text-faint); font-size: 11.4px; }
.up-fl-box.has-img .up-fl-empty { display: none; }
.up-fl-tip { font-size: 9.7px; color: var(--text-faint); display: block; margin-top: 5.3px; }
.up-list { margin-top: 12.3px; display: flex; flex-wrap: wrap; gap: 10.6px; max-height: none; overflow: visible; }
.up-thumb { position: relative; width: 49.3px; height: 49.3px; cursor: zoom-in; }
.up-thumb > img { width: 49.3px; height: 49.3px; object-fit: cover; border-radius: 8.8px; border: 0.9px solid var(--card-border); display: block; background: var(--bg-2); }
.up-thumb .up-doc { width: 49.3px; height: 49.3px; border-radius: 8.8px; border: 0.9px solid var(--card-border); background: var(--bg-2); display: flex; align-items: center; justify-content: center; font-size: 19.4px; }
.up-thumb .up-preview {
  display: none; position: absolute; bottom: 58.1px; left: 50%; transform: translateX(-50%);
  width: 193.6px; border-radius: 10.6px; overflow: hidden; z-index: 60;
  box-shadow: 0 12.3px 31.7px rgba(0,0,0,0.45); border: 0.9px solid var(--card-border); background: var(--bg);
}
.up-thumb .up-preview img { width: 100%; display: block; max-height: 228.8px; object-fit: cover; }
.up-thumb .up-name {
  display: none; position: absolute; top: 56.3px; left: 50%; transform: translateX(-50%);
  background: rgba(10,10,20,0.85); color: #fff; font-size: 9.7px; line-height: 1.5;
  padding: 2.6px 7.9px; border-radius: 6.2px; white-space: nowrap; z-index: 60;
  max-width: 167.2px; overflow: hidden; text-overflow: ellipsis;
}
.up-thumb:hover .up-preview { display: block; }
.up-thumb:hover .up-name { display: block; }
.up-thumb .up-del {
  position: absolute; top: -6.2px; right: -6.2px; width: 17.6px; height: 17.6px;
  background: rgba(0,0,0,0.65); color: #fff; border: none; border-radius: 50%;
  font-size: 9.7px; line-height: 1; cursor: pointer; z-index: 61;
  display: flex; align-items: center; justify-content: center;
}
.up-thumb .up-del:hover { background: #ff2d55; }
.up-actions { display: flex; justify-content: space-between; align-items: center; margin-top: 14.1px; }
.up-count { font-size: 10.6px; color: var(--text-faint); }
.up-clear{border:0;background:transparent;color:#6658e8;font-size:10.6px;cursor:pointer;padding:5.3px 8.8px;border-radius:6.2px}.up-clear:hover{background:rgba(102,88,232,.08)}.up-clear:disabled{opacity:.4;cursor:default;background:transparent}
.up-ref-status{position:absolute;left:45.8px;top:17.6px;display:flex;align-items:center;gap:6.2px;white-space:nowrap;padding:4.4px 7px;border-radius:7px;background:#f0edff;color:#5748d8;font-size:9.7px;font-weight:650;z-index:12;box-shadow:0 1.8px 7px rgba(45,39,100,.1)}.up-ref-status button{border:0;background:transparent;color:#d13b54;font:inherit;cursor:pointer;padding:0}
.up-submit { padding: 8.8px 29.9px; font-size: 12.3px; }
.up-busy { opacity: 0.6; pointer-events: none; }

/* 信任条 */
.trust-bar { display: flex; justify-content: center; align-items: center; gap: 17.6px; margin-top: 38.7px; flex-wrap: wrap; }
.trust-bar span { font-size: 11.4px; color: var(--text-faint); }
.trust-bar b { color: var(--text); font-size: 14.1px; }
.trust-bar i { width: 3.5px; height: 3.5px; border-radius: 50%; background: var(--text-faint); display: inline-block; }

/* ============ 优势区 ============ */
.features { max-width: 950.4px; margin: 0 auto; padding: 52.8px 21.1px; }
.section-title { text-align: center; margin-bottom: 38.7px; }
.section-title h2 { font-size: 28.2px; font-weight: 800; margin-bottom: 8.8px; }
.section-title p { color: var(--text-dim); font-size: 13.2px; }
.feature-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(281.6px, 1fr)); gap: 17.6px; }
.feature-card {
  background: var(--card); border: 0.9px solid var(--card-border); border-radius: 17.6px;
  padding: 24.6px; transition: all 0.25s; position: relative; overflow: hidden; box-shadow: var(--shadow);
}
.feature-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1.8px;
  background: linear-gradient(90deg, transparent, rgba(124,92,255,0.6), transparent); opacity: 0; transition: opacity 0.25s;
}
.feature-card:hover { border-color: rgba(124,92,255,0.3); transform: translateY(-2.6px); box-shadow: var(--shadow-hover); }
.feature-card:hover::before { opacity: 1; }
.f-icon { font-size: 28.2px; margin-bottom: 12.3px; }
.feature-card h3 { font-size: 15.8px; font-weight: 700; margin-bottom: 8.8px; }
.feature-card p { font-size: 12.3px; color: var(--text-dim); line-height: 1.8; }
.feature-card p b { color: var(--primary); font-weight: 600; }
.f-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 14.1px; }
.f-tags span { font-size: 9.7px; color: var(--text-dim); background: var(--bg-soft-2); border: 0.9px solid var(--card-border); padding: 3.5px 8.8px; border-radius: 88px; }

/* ============ 工作流 ============ */
.workflow { max-width: 950.4px; margin: 0 auto; padding: 35.2px 21.1px 70.4px; }
.wf-steps { display: flex; align-items: center; justify-content: center; gap: 17.6px; flex-wrap: wrap; }
.wf-step {
  background: var(--card); border: 0.9px solid var(--card-border); border-radius: 17.6px;
  padding: 24.6px; text-align: center; flex: 1; min-width: 211.2px; max-width: 264px; box-shadow: var(--shadow);
}
.wf-num {
  width: 38.7px; height: 38.7px; margin: 0 auto 12.3px; border-radius: 10.6px; display: flex; align-items: center; justify-content: center;
  background: var(--primary-soft); border: 0.9px solid rgba(124,92,255,0.25);
  color: var(--primary); font-weight: 800; font-size: 14.1px;
}
.wf-step h3 { font-size: 14.1px; margin-bottom: 7px; }
.wf-step p { font-size: 11.4px; color: var(--text-dim); line-height: 1.7; }
.wf-arrow { color: var(--text-faint); font-size: 21.1px; }

/* ============ 结果区 ============ */
.result-section { max-width: 792px; margin: 0 auto; padding: 26.4px 21.1px; }
.result-head { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 21.1px; gap: 10.6px; flex-wrap: wrap; }
.result-head h2 { font-size: 21.1px; margin-bottom: 7px; }
.res-meta { display: flex; flex-wrap: wrap; gap: 7px; }
.res-meta span { font-size: 10.6px; color: var(--primary); background: var(--primary-soft); border: 0.9px solid rgba(124,92,255,0.2); padding: 3.5px 10.6px; border-radius: 88px; font-weight: 600; }
.result-actions { display: flex; gap: 8.8px; align-items: center; }
.btn-ghost { background: var(--bg-2); border: 0.9px solid var(--card-border); border-radius: 8.8px; padding: 7.9px 14.1px; font-size: 11.4px; cursor: pointer; color: var(--text-dim); transition: all 0.2s; }
.btn-ghost:hover { border-color: rgba(124,92,255,0.4); color: var(--primary); }
.btn-copy-all { background: linear-gradient(135deg, #7c5cff, #6d4aff); color: #fff; border: none; border-radius: 8.8px; padding: 8.8px 15.8px; font-size: 11.4px; font-weight: 600; cursor: pointer; transition: all 0.2s; }
.btn-copy-all:hover { box-shadow: 0 3.5px 17.6px rgba(124,92,255,0.35); }
.btn-to-canvas { display:inline-flex;align-items:center;gap:6.2px;background:var(--bg-2);color:var(--primary);border:0.9px solid rgba(124,92,255,.34);border-radius:8.8px;padding:7.9px 12.3px;font-size:11.4px;font-weight:650;cursor:pointer;transition:all .2s; }
.btn-to-canvas:hover { background:var(--primary-soft);border-color:var(--primary);box-shadow:0 3.5px 14.1px rgba(124,92,255,.14);transform:translateY(-0.9px); }
.btn-copy-sm { background: var(--primary-soft); color: var(--primary); border: 0.9px solid rgba(124,92,255,0.3); border-radius: 7px; padding: 7px 12.3px; font-size: 11.4px; font-weight: 600; cursor: pointer; margin-top: 10.6px; transition: all 0.2s; }
.btn-copy-sm:hover { background: rgba(124,92,255,0.15); }

/* 分镜卡片 */
#shots { position: relative; padding-left: 0; }
.shot-card {
  background: var(--card); border: 0.9px solid var(--card-border); border-radius: 17.6px;
  padding: 21.1px 22.9px; margin-bottom: 15.8px; position: relative; transition: border-color 0.2s, box-shadow 0.2s; box-shadow: var(--shadow);
}
.shot-card:hover { border-color: rgba(124,92,255,0.3); box-shadow: var(--shadow-hover); }
.shot-head { display: flex; align-items: center; gap: 10.6px; margin-bottom: 14.1px; flex-wrap: wrap; }
.shot-num {
  width: 28.2px; height: 28.2px; border-radius: 8.8px; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #7c5cff, #6d4aff); color: #fff; font-size: 13.2px; font-weight: 800; flex-shrink: 0;
}
.shot-name { font-size: 15px; font-weight: 700; }
.shot-tags { display: flex; gap: 7px; margin-left: auto; flex-wrap: wrap; }
.shot-tags span { font-size: 9.7px; color: var(--text-dim); background: var(--bg-soft-2); border: 0.9px solid var(--card-border); padding: 2.6px 8.8px; border-radius: 88px; }
.shot-tags .tag-rec { color: var(--warn-text); border-color: var(--warn-border); background: var(--warn-bg); }

.prompt-block { margin-bottom: 12.3px; }
.prompt-label { display: flex; justify-content: space-between; align-items: center; font-size: 11.4px; font-weight: 700; color: var(--primary); margin-bottom: 7px; }
.prompt-label.video { color: var(--green); }
.copy-btn { background: var(--primary-soft); color: var(--primary); border: 0.9px solid rgba(124,92,255,0.25); border-radius: 7px; padding: 4.4px 12.3px; font-size: 10.6px; cursor: pointer; transition: all 0.15s; }
.copy-btn:hover { background: rgba(124,92,255,0.18); }
.copy-btn.copied { background: var(--green-soft); color: var(--green); border-color: rgba(16,185,129,0.4); }
.prompt-label.video .copy-btn { background: var(--green-soft); color: var(--green); border-color: rgba(16,185,129,0.3); }
.prompt-label.video .copy-btn:hover { background: rgba(52,211,153,0.2); }
.prompt-box {
  background: var(--bg-soft); border-left: 2.6px solid var(--primary); border-radius: 8.8px;
  padding: 12.3px 14.1px; font-size: 12.3px; line-height: 1.8; white-space: pre-wrap; word-break: break-word; color: var(--text-body);
}
.prompt-box.video { border-left-color: var(--green); }
.shot-extra { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 10.6px; }
.shot-extra span { font-size: 10.6px; color: var(--text-dim); background: var(--bg-soft-2); border: 0.9px solid var(--card-border); padding: 3.5px 8.8px; border-radius: 7px; }
.shot-why { font-size: 10.6px; color: var(--warn-text); background: var(--warn-bg); border: 0.9px solid var(--warn-border); border-radius: 8.8px; padding: 8.8px 12.3px; margin-top: 10.6px; line-height: 1.7; }

/* 解说词/建议 */
.card { background: var(--card); border: 0.9px solid var(--card-border); border-radius: 17.6px; padding: 21.1px 22.9px; margin-bottom: 15.8px; box-shadow: var(--shadow); }
.card-title { font-size: 15px; font-weight: 700; margin-bottom: 12.3px; }
table { width: 100%; border-collapse: collapse; font-size: 12.3px; }
th { text-align: left; color: var(--text); padding: 8.8px 12.3px; font-weight: 600; border-bottom: 1.8px solid var(--primary-soft); background: var(--primary-soft); }
td { padding: 8.8px 12.3px; border-bottom: 0.9px solid var(--card-border); color: var(--text-body); }
tr:hover td { background: var(--bg-hover); }
.tips-card ul { padding-left: 17.6px; font-size: 12.3px; line-height: 2.2; color: var(--text-dim); }

/* 对话调整 */
.refine-card { border: 0.9px solid rgba(124,92,255,0.2); background: linear-gradient(180deg, var(--bg-2), var(--bg-2)); }
.refine-hint { font-size: 10.6px; color: var(--text-faint); font-weight: 400; margin-left: 7px; }
.chat-box {
  max-height: 211.2px; overflow-y: auto; padding: 10.6px; margin-bottom: 10.6px;
  background: var(--bg-soft); border: 0.9px solid var(--card-border); border-radius: 10.6px; display: flex; flex-direction: column; gap: 8.8px;
}
.chat-msg { max-width: 85%; padding: 8.8px 12.3px; border-radius: 10.6px; font-size: 11.4px; line-height: 1.7; white-space: pre-wrap; word-break: break-word; }
.chat-msg.user { align-self: flex-end; background: linear-gradient(135deg, #7c5cff, #6d4aff); color: #fff; border-bottom-right-radius: 3.5px; }
.chat-msg.ai { align-self: flex-start; background: #fff; color: var(--text-body); border: 0.9px solid var(--card-border); border-bottom-left-radius: 3.5px; }
.chat-input-wrap { display: flex; gap: 8.8px; }
#chatInput {
  flex: 1; background: var(--bg-2); border: 0.9px solid var(--card-border);
  border-radius: 10.6px; padding: 10.6px 14.1px; color: var(--text); font-size: 12.3px; outline: none; font-family: inherit;
  resize: none; line-height: 1.5; max-height: 105.6px; overflow-y: auto;
  display: block; box-sizing: border-box;
}
#chatInput:focus { border-color: rgba(124,92,255,0.5); }
#chatInput::placeholder { color: var(--text-faint); }
.btn-refine {
  background: linear-gradient(135deg, #7c5cff, #6d4aff); color: #fff; border: none; border-radius: 10.6px;
  padding: 0 21.1px; font-size: 12.3px; font-weight: 700; cursor: pointer; transition: all 0.2s;
}
.btn-refine:hover { box-shadow: 0 3.5px 17.6px rgba(124,92,255,0.35); }
.btn-refine:disabled { opacity: 0.6; cursor: not-allowed; }
.refine-tips { display: flex; align-items: center; gap: 7px; margin-top: 10.6px; flex-wrap: wrap; }
.refine-tips > span:first-child { font-size: 10.6px; color: var(--text-faint); }
.rt-chip {
  font-size: 10.6px; color: var(--text-dim); background: #fff; border: 0.9px solid var(--card-border);
  padding: 3.5px 10.6px; border-radius: 88px; cursor: pointer; transition: all 0.15s;
}
.rt-chip:hover { border-color: rgba(124,92,255,0.4); color: var(--primary); }

/* ============ 历史 ============ */
.history-section { max-width: 792px; margin: 0 auto; padding: 26.4px 21.1px; }
.history-section h2 { font-size: 21.1px; margin-bottom: 17.6px; }
.history-item {
  background: var(--card); border: 0.9px solid var(--card-border); border-radius: 12.3px;
  padding: 14.1px 17.6px; margin-bottom: 8.8px; cursor: pointer; transition: all 0.15s;
  display: flex; justify-content: space-between; align-items: center; gap: 8.8px; box-shadow: var(--shadow);
}
.history-item:hover { border-color: rgba(124,92,255,0.4); }
.history-item .h-title { font-size: 12.3px; font-weight: 600; flex: 1; }
.history-item .h-meta { font-size: 10.6px; color: var(--text-faint); }

/* Footer */
.footer { text-align: center; padding: 35.2px 21.1px 52.8px; border-top: 0.9px solid var(--card-border); }
.footer p { font-size: 12.3px; color: var(--text-dim); }
.footer .f-sub { font-size: 10.6px; color: var(--text-faint); margin-top: 7px; }

@media (max-width: 720px) {
  .hero h1 { font-size: 31.7px; }
  .nav-links a { display: none; }
  .result-head { flex-direction: column; }
  .wf-steps { flex-direction: column; }
  .wf-arrow { transform: rotate(90deg); }
}

/* 深色模式背景光效 */
[data-theme="dark"] .bg-glow {
  background:
    radial-gradient(616px 281.6px at 12% 0%, rgba(124,92,255,0.16), transparent 60%),
    radial-gradient(528px 264px at 88% 8%, rgba(139,92,246,0.10), transparent 60%),
    radial-gradient(792px 440px at 50% 100%, rgba(124,92,255,0.06), transparent 60%);
}
/* 主题切换按钮 */
.theme-toggle {
  background: var(--bg-soft-2); border: 0.9px solid var(--card-border); border-radius: 8.8px;
  width: 31.7px; height: 31.7px; font-size: 14.1px; cursor: pointer; transition: all 0.2s; line-height: 1;
}
.theme-toggle:hover { border-color: rgba(124,92,255,0.4); }

/* ============ 登录/弹窗 ============ */
.btn-login { background: linear-gradient(135deg, #7c5cff, #6d4aff); color: #fff; border: none; border-radius: 8.8px; padding: 7.9px 15.8px; font-size: 11.4px; font-weight: 600; cursor: pointer; transition: all 0.2s; }
.btn-login:hover { box-shadow: 0 3.5px 14.1px rgba(124,92,255,0.35); }
.user-info { display: flex; align-items: center; gap: 7px; font-size: 10.6px; color: var(--text-dim); }
.user-info .u-name { font-weight: 700; color: var(--primary); max-width: 79.2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; transition: color 0.15s; }
.user-info .u-name:hover { color: var(--primary-2); text-decoration: underline; }
.user-info .u-quota { background: var(--primary-soft); border: 0.9px solid rgba(124,92,255,0.2); padding: 2.6px 8.8px; border-radius: 88px; color: var(--primary); font-weight: 600; cursor: pointer; }
.user-info .u-quota.vip { background: #fffbeb; border-color: rgba(245,196,83,0.5); color: #b45309; }
.user-info .u-logout { background: none; border: none; color: var(--text-faint); cursor: pointer; font-size: 10.6px; }
.user-info .u-logout:hover { color: #ef4444; }

.modal-mask { position: fixed; inset: 0; background: rgba(10,10,20,0.6); backdrop-filter: blur(3.5px); z-index: 999; display: flex; align-items: center; justify-content: center; padding: 17.6px; }
.modal { background: var(--bg-2); border: 0.9px solid var(--card-border); border-radius: 17.6px; padding: 24.6px; width: 100%; max-width: 369.6px; box-shadow: 0 26.4px 70.4px rgba(0,0,0,0.3); }
.modal-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15.8px; }
.modal-head h3 { font-size: 17.6px; }
.modal-close { background: var(--bg-soft-2); border: 0.9px solid var(--card-border); border-radius: 7px; width: 26.4px; height: 26.4px; cursor: pointer; color: var(--text-dim); font-size: 12.3px; }
.modal-close:hover { color: var(--text); }
.auth-tabs { display: flex; gap: 7px; margin-bottom: 15.8px; }
.auth-tab { flex: 1; text-align: center; padding: 8.8px; border-radius: 8.8px; cursor: pointer; color: var(--text-dim); border: 0.9px solid var(--card-border); font-size: 12.3px; font-weight: 600; transition: all 0.2s; }
.auth-tab.active { background: var(--primary-soft); color: var(--primary); border-color: rgba(124,92,255,0.3); }
.auth-form { display: flex; flex-direction: column; gap: 10.6px; }
.auth-form input { background: var(--bg-soft); border: 0.9px solid var(--card-border); border-radius: 10.6px; padding: 11.4px 14.1px; font-size: 12.3px; color: var(--text); outline: none; font-family: inherit; }
.auth-form input:focus { border-color: rgba(124,92,255,0.5); }
.auth-tip { font-size: 10.6px; color: var(--text-faint); text-align: center; }
.auth-tip b { color: var(--primary); }
.btn-primary-auth { background: linear-gradient(135deg, #7c5cff, #6d4aff); color: #fff; border: none; border-radius: 10.6px; padding: 12.3px; font-size: 13.2px; font-weight: 700; cursor: pointer; transition: all 0.2s; }
.btn-primary-auth:hover { box-shadow: 0 5.3px 17.6px rgba(124,92,255,0.35); }
.btn-primary-auth:disabled { opacity: 0.6; cursor: not-allowed; }
.auth-error { font-size: 10.6px; color: #ef4444; text-align: center; min-height: 14.1px; }

/* 付费弹窗 */
.pay-modal { max-width: 774.4px; max-height: calc(100vh - 49.3px); overflow-y: auto; scrollbar-width: thin; }
/* ═══ 会员充值 · 极简高级风（参考可灵会员页：黑底白字、克制零装饰）═══ */
.pay-dark {
  background: linear-gradient(180deg, #101014 0%, #121218 60%, #0e0e12 100%);
  border: 0.9px solid rgba(255,255,255,0.08);
  box-shadow: 0 26.4px 70.4px rgba(0,0,0,0.6), inset 0 0.9px 0 rgba(255,255,255,0.05);
}
.pay-dark .modal-head { border-bottom: 0.9px solid rgba(255,255,255,0.07); padding-bottom: 12.3px; }
.pay-dark .modal-head h3 { color: #fff; font-size: 15px; font-weight: 700; letter-spacing: 0.4px; }
.pay-dark .modal-head h3 small { display: block; font-size: 9.7px; color: rgba(255,255,255,0.35); font-weight: 400; margin-top: 2.6px; letter-spacing: 0.3px; }
.pay-dark .modal-close { background: rgba(255,255,255,0.05); border: 0.9px solid rgba(255,255,255,0.08); color: rgba(255,255,255,0.5); }
/* 顶部一行简洁促销文案（无背景块） */
/* LibTV 风：标题 + 倒计时 + 宣传行 */
.pay-hero { text-align: center; margin: 3.5px 0 14.1px; }
.pay-hero-title { font-size: 15px; font-weight: 700; color: #fff; letter-spacing: 0.4px; }
.pay-hero-title b { color: #a78bfa; font-style: normal; }
.pay-countdown { margin: 7px 0 5.3px; font-size: 9.7px; color: rgba(255,255,255,0.4); }
.pay-countdown .cd { display: inline-block; min-width: 22.9px; padding: 2.6px 4.4px; margin: 0 1.8px; background: rgba(124,92,255,0.15); border: 0.9px solid rgba(124,92,255,0.35); border-radius: 5.3px; color: #c4b5fd; font-size: 11.4px; font-weight: 700; font-variant-numeric: tabular-nums; }
.pay-hero-sub { font-size: 9.7px; color: rgba(255,255,255,0.35); letter-spacing: 0.3px; }

.pay-tabs { display: flex; gap: 1.8px; margin-bottom: 15.8px; background: rgba(255,255,255,0.05); border: 0.9px solid rgba(255,255,255,0.07); border-radius: 10.6px; padding: 2.6px; }
.pay-tab { flex: 1; padding: 7px 0; border-radius: 7.9px; border: none; background: transparent; color: rgba(255,255,255,0.45); font-size: 11.4px; font-weight: 500; cursor: pointer; transition: all 0.2s; }
.pay-tab b { color: rgba(255,255,255,0.35); font-weight: 500; margin-left: 1.8px; }
.pay-tab.active { background: rgba(124,92,255,0.18); color: #fff; box-shadow: 0 1.8px 7px rgba(0,0,0,0.3); }
.pay-tab.active b { color: #a78bfa; }

/* 套餐卡：深色卡片 + 细边框，克制 */
.pay-plans { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8.8px; }
.pay-plans { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10.6px; }
.pay-plan { position: relative; background: #191920; border: 0.9px solid rgba(255,255,255,0.08); border-radius: 14.1px; padding: 14.1px 12.3px 12.3px; text-align: center; transition: all 0.2s; display: flex; flex-direction: column; }
.pay-plan::before { content: ''; position: absolute; top: -0.9px; left: 50%; transform: translateX(-50%); width: 29.9px; height: 2.6px; border-radius: 0 0 2.6px 2.6px; background: var(--tier, #7d7d8a); opacity: 0.9; }
.pay-plan:hover { border-color: rgba(167,139,250,0.35); transform: translateY(-1.8px); background: #1d1d25; }
.pay-plan.featured { border-color: rgba(167,139,250,0.35); background: #1b1b23; box-shadow: 0 0 0 0.9px rgba(124,92,255,0.2), 0 8.8px 26.4px rgba(0,0,0,0.35); }
.pay-plan.featured::before { background: #7c5cff; box-shadow: 0 0 8.8px rgba(124,92,255,0.5); }
.tier-silver { --tier: #8f9bb3; }
.tier-blue { --tier: #5fa8ff; }
.tier-purple { --tier: #a78bfa; }
.tier-gold { --tier: #f5c453; }
/* 折扣角标（LibTV 风，紫色框） */
.plan-name-row { display: flex; align-items: center; justify-content: center; gap: 5.3px; margin-bottom: 8.8px; white-space: nowrap; }
.plan-off { display: inline-flex; align-items: center; font-size: 8.8px; font-weight: 600; color: #1a1a2e; background: #f4f4f6; border: 0.9px solid rgba(255,255,255,0.4); border-radius: 5.3px; padding: 0.9px 5.3px; letter-spacing: 0.3px; white-space: nowrap; flex-shrink: 0; }
.plan-tag { display: inline-block; font-size: 8.8px; font-weight: 600; color: rgba(255,255,255,0.6); background: rgba(255,255,255,0.06); border: 0.9px solid rgba(255,255,255,0.1); border-radius: 879.1px; padding: 1.8px 8.8px; margin-bottom: 8.8px; letter-spacing: 0.4px; }
.plan-tag.hot { color: #ff8a6b; border-color: rgba(255,107,74,0.4); background: rgba(255,107,74,0.08); }
.tier-gold .plan-tag { color: #ffc65c; border-color: rgba(255,198,92,0.35); background: rgba(255,198,92,0.08); }
.plan-name { font-size: 13.2px; font-weight: 700; color: #fff; letter-spacing: 0.9px; }
.plan-price { font-size: 24.6px; font-weight: 700; color: #fff; margin-bottom: 1.8px; letter-spacing: -0.4px; line-height: 1; }
.plan-price .cur { font-size: 13.2px; font-weight: 500; vertical-align: 9.7px; margin-right: 0.9px; color: rgba(255,255,255,0.7); }
.plan-price span { font-size: 10.6px; color: rgba(255,255,255,0.35); font-weight: 400; letter-spacing: 0.4px; }
.plan-old { display: block; font-size: 9.2px; color: rgba(255,255,255,0.28); text-decoration: line-through; margin: 2.6px 0 0; font-weight: 400; }
.plan-monthly { display: block; font-size: 11px; color: rgba(255,255,255,0.8); margin: 3.5px 0 0; font-weight: 500; }
.plan-monthly b { color: #f5c453; font-size: 12.3px; font-weight: 800; }
/* LibTV 风：积分/月 + 生成量 + 权益列表 + 续费 + 积分单价 */
.plan-credits { font-size: 11.4px; color: rgba(255,255,255,0.75); margin-top: 8.8px; }
.plan-credits b { color: #f5c453; font-size: 14.1px; font-weight: 800; }
.plan-gen { font-size: 9.7px; color: rgba(255,255,255,0.35); margin-top: 1.8px; }
.plan-gen b { color: rgba(255,255,255,0.7); font-weight: 600; }
.plan-feats { list-style: none; margin: 8.8px 0 0; padding: 8.8px 7px; border-top: 0.9px dashed rgba(255,255,255,0.09); border-bottom: 0.9px dashed rgba(255,255,255,0.09); text-align: left; flex: 1; }
.plan-feats li { font-size: 9.7px; color: rgba(255,255,255,0.55); line-height: 1.9; }
.plan-feats li:first-child { color: rgba(255,255,255,0.75); font-weight: 600; }
.plan-renew { font-size: 8.8px; color: rgba(255,255,255,0.3); margin-top: 7px; }
.plan-value { font-size: 8.8px; color: rgba(124,92,255,0.75); margin-top: 2.6px; }
/* 按钮：主推亮色，其余克制描边 */
.btn-buy { width: 100%; background: rgba(255,255,255,0.07); color: rgba(255,255,255,0.85); border: 0.9px solid rgba(255,255,255,0.12); border-radius: 9.7px; padding: 8.8px; font-size: 11.4px; font-weight: 600; cursor: pointer; transition: all 0.2s; letter-spacing: 0.9px; margin-top: 10.6px; }
.btn-buy:hover { background: rgba(255,255,255,0.12); }

.pay-note { font-size: 9.7px; color: rgba(255,255,255,0.28); text-align: center; margin-top: 14.1px; letter-spacing: 0.3px; }

/* 短信验证码 */
.sms-row { display: flex; gap: 8.8px; }
.sms-row input { flex: 1; }
.btn-sms { background: var(--primary-soft); color: var(--primary); border: 0.9px solid rgba(124,92,255,0.3); border-radius: 10.6px; padding: 0 15.8px; font-size: 11.4px; font-weight: 600; cursor: pointer; white-space: nowrap; transition: all 0.2s; }
.btn-sms:hover { background: rgba(124,92,255,0.18); }
.btn-sms:disabled { opacity: 0.5; cursor: not-allowed; }
.auth-error { font-size: 10.6px; color: #ef4444; text-align: center; min-height: 14.1px; }

/* 会员 + 积分包分栏 */
.pay-section-label { font-size: 11.4px; font-weight: 700; color: var(--text-dim); margin-bottom: 10.6px; }
.pay-credits { margin-top: 14.1px; padding-top: 12.3px; border-top: 0.9px solid rgba(255,255,255,0.07); }
.credits-title { font-size: 10.6px; color: rgba(255,255,255,0.45); margin-bottom: 8.8px; font-weight: 600; letter-spacing: 0.4px; }
.credits-row { display: flex; gap: 8.8px; flex-wrap: wrap; }
.credit-item {
  flex: 1; min-width: 88px; background: #191920; border: 0.9px solid rgba(255,255,255,0.08);
  border-radius: 10.6px; padding: 8.8px 12.3px; cursor: pointer; text-align: center; transition: all 0.2s;
}
.credit-item b { display: block; font-size: 14.1px; color: #fff; font-weight: 700; }
.credit-item span { font-size: 9.2px; color: rgba(255,255,255,0.4); line-height: 1.6; }
.credit-item:hover { border-color: rgba(255,255,255,0.2); transform: translateY(-1.8px); background: #1d1d25; }

/* 个人中心 */
.profile-info { display: flex; flex-direction: column; gap: 12.3px; margin-bottom: 17.6px; }
.p-row { display: flex; align-items: center; gap: 10.6px; font-size: 12.3px; }
.p-row label { width: 66.9px; color: var(--text-faint); font-size: 11.4px; flex-shrink: 0; }
.p-row span { color: var(--text); }
.p-row input {
  flex: 1; background: var(--bg-soft); border: 0.9px solid var(--card-border); border-radius: 8.8px;
  padding: 8.8px 12.3px; font-size: 12.3px; color: var(--text); outline: none; font-family: inherit;
}
.p-row input:focus { border-color: rgba(124,92,255,0.5); }
.btn-save-nick { background: var(--primary-soft); color: var(--primary); border: 0.9px solid rgba(124,92,255,0.3); border-radius: 8.8px; padding: 7.9px 14.1px; font-size: 11.4px; font-weight: 600; cursor: pointer; white-space: nowrap; transition: all 0.2s; }
.btn-save-nick:hover { background: rgba(124,92,255,0.18); }
.btn-save-nick:disabled { opacity: 0.5; cursor: not-allowed; }

/* ============ 个人中心（即梦风） ============ */
.profile-modal { max-width: 352px; }
.profile-hero { display: flex; flex-direction: column; align-items: center; padding: 7px 0 17.6px; }
.avatar-wrap {
  position: relative; width: 77.4px; height: 77.4px; border-radius: 50%; margin-bottom: 12.3px;
  cursor: pointer; overflow: hidden; border: 2.6px solid rgba(124,92,255,0.25);
}
.avatar-wrap .avatar { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; }
.avatar-mask {
  position: absolute; inset: 0; background: rgba(10,10,20,0.55); color: #fff;
  display: flex; align-items: center; justify-content: center; flex-direction: column;
  font-size: 9.7px; line-height: 1.5; opacity: 0; transition: opacity 0.2s; border-radius: 50%;
}
.avatar-wrap:hover .avatar-mask { opacity: 1; }
.profile-name-row { display: flex; gap: 7px; align-items: center; margin-bottom: 5.3px; }
.profile-name-row input {
  width: 140.8px; background: var(--bg-soft); border: 0.9px solid var(--card-border); border-radius: 8.8px;
  padding: 7.9px 12.3px; font-size: 12.3px; color: var(--text); outline: none; font-family: inherit; text-align: center; font-weight: 600;
}
.profile-name-row input:focus { border-color: rgba(124,92,255,0.5); }
.profile-phone { font-size: 10.6px; color: var(--text-faint); }
.profile-quota-card {
  display: flex; align-items: center; background: var(--bg-soft); border: 0.9px solid var(--card-border);
  border-radius: 14.1px; padding: 14.1px 8.8px; margin-bottom: 7px;
}
.q-item { flex: 1; text-align: center; }
.q-label { display: block; font-size: 9.7px; color: var(--text-faint); margin-bottom: 5.3px; }
.q-value { font-size: 15.8px; font-weight: 800; color: var(--text); }
.q-value.vip { color: #b45309; }
.q-divider { width: 0.9px; height: 26.4px; background: var(--card-border); }
.profile-plan-expire { text-align: center; font-size: 9.7px; color: var(--text-faint); margin-bottom: 12.3px; }

/* 导航栏小头像 */
.u-avatar { width: 21.1px; height: 21.1px; border-radius: 50%; object-fit: cover; vertical-align: middle; margin-right: 3.5px; border: 0.9px solid rgba(124,92,255,0.3); }

/* ========== LibTV 风：顶部余额 hover 弹层 ========== */
.u-quota { position: relative; }
.u-quota.has-pop .quota-pop {
  position: absolute; top: calc(100% + 7px); right: 0; z-index: 200;
  width: 211.2px; background: #17171d; border: 0.9px solid rgba(255,255,255,0.1);
  border-radius: 12.3px; padding: 12.3px; box-shadow: 0 10.6px 35.2px rgba(0,0,0,0.55);
  opacity: 0; visibility: hidden; transform: translateY(-5.3px); transition: all 0.18s ease;
  text-align: left; color: #e8e8ec; font-weight: 400;
}
.u-quota.has-pop:hover .quota-pop,
.u-quota.has-pop:focus-within .quota-pop { opacity: 1; visibility: visible; transform: translateY(0); }
.quota-pop::before { content: ''; position: absolute; top: -4.4px; right: 22.9px; width: 8.8px; height: 8.8px; background: #17171d; border-left: 0.9px solid rgba(255,255,255,0.1); border-top: 0.9px solid rgba(255,255,255,0.1); transform: rotate(45deg); }
.quota-pop .qp-title { font-size: 12.3px; font-weight: 700; color: #fff; margin-bottom: 1.8px; }
.quota-pop .qp-expire { font-size: 9.7px; color: #8b8b94; margin-bottom: 8.8px; }
.quota-pop .qp-grid { border-top: 0.9px solid rgba(255,255,255,0.07); padding-top: 7px; }
.quota-pop .qp-row { display: flex; justify-content: space-between; align-items: center; padding: 3.5px 0; font-size: 10.6px; color: #a5a5af; }
.quota-pop .qp-row b { color: #f5c453; font-weight: 700; }
.quota-pop .qp-row .qp-total { font-size: 13.2px; color: #fff; }
.quota-pop .qp-next { margin-top: 5.3px; padding: 5.3px 7px; background: rgba(110,168,255,0.12); border-radius: 7px; color: #8fb8ff; font-size: 10.6px; }
.quota-pop .qp-tip { margin-top: 7px; font-size: 9.2px; color: #6f6f79; line-height: 1.5; }

/* ========== LibTV 风：个人中心会员卡 ========== */
.vip-card { margin: 10.6px 0 12.3px; border-radius: 14.1px; overflow: hidden; border: 0.9px solid rgba(255,255,255,0.1); }
.vip-card.vip-active { background: linear-gradient(160deg, #1b2745 0%, #14182a 60%, #1a1f33 100%); border-color: rgba(110,168,255,0.3); }
.vip-card:not(.vip-active) { background: #17171d; }
.vip-head { display: flex; align-items: center; gap: 8.8px; padding: 12.3px 14.1px 8.8px; }
.vip-badge { width: 37px; height: 37px; border-radius: 10.6px; background: rgba(255,255,255,0.07); display: flex; align-items: center; justify-content: center; font-size: 19.4px; flex-shrink: 0; }
.vip-card.vip-active .vip-badge { background: rgba(110,168,255,0.15); }
.vip-info { flex: 1; min-width: 0; }
.vip-title { font-size: 14.1px; font-weight: 700; color: #fff; }
.vip-expire { font-size: 9.7px; color: #8b8b94; margin-top: 1.8px; }
.vip-upgrade { background: linear-gradient(135deg, #6ea8ff, #8a6cff); border: none; color: #fff; font-size: 10.6px; font-weight: 600; padding: 6.2px 12.3px; border-radius: 88px; cursor: pointer; flex-shrink: 0; }
.vip-upgrade:hover { filter: brightness(1.12); }
.vip-credits { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 0.9px solid rgba(255,255,255,0.07); }
.vc-item { padding: 10.6px 3.5px 8.8px; text-align: center; cursor: default; transition: background 0.15s; position: relative; }
.vc-item:hover { background: rgba(255,255,255,0.04); }
.vc-item + .vc-item { border-left: 0.9px solid rgba(255,255,255,0.07); }
.vc-num { font-size: 17.6px; font-weight: 800; color: #f5c453; }
.vc-item .vc-total { color: #fff; font-size: 19.4px; }
.vc-unit { font-size: 8.8px; color: #8b8b94; margin-left: 1.8px; }
.vc-label { display: block; font-size: 9.2px; color: #8b8b94; margin-top: 2.6px; }
.vip-next { padding: 6.2px 14.1px 8.8px; font-size: 10.1px; color: #8fb8ff; }

/* 历史记录标题行：左标题 + 右返回 */
.history-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14.1px; }
.history-head h2 { margin: 0; }

/* 历史分类标签：生成模式 / Pro 模式 */
.history-tabs { display: flex; gap: 8px; margin-bottom: 12.3px; }
.history-tab {
  display: inline-flex; align-items: center; gap: 5.3px;
  padding: 7px 14.1px; border: 0.9px solid var(--card-border); border-radius: 999px;
  background: var(--card); color: var(--text-faint); font: inherit; font-size: 12.3px; font-weight: 600;
  cursor: pointer; transition: border-color .18s, color .18s, background .18s;
}
.history-tab .ic { width: 13.2px; height: 13.2px; }
.history-tab:hover { border-color: rgba(124,92,255,0.4); color: var(--text); }
.history-tab.active { background: var(--primary-soft); border-color: rgba(124,92,255,0.45); color: var(--primary); }
.h-tag {
  display: inline-block; margin-right: 5.3px; padding: 1.8px 6.2px; border-radius: 5.3px;
  font-size: 9.7px; font-weight: 600; background: var(--primary-soft); color: var(--primary);
}
.h-tag.pro { background: rgba(46,168,120,0.13); color: #2ea878; }

/* 统一顶部账户区：会员、积分、头像。主题按钮保持导航栏原位。 */
.user-info { gap: 8px; align-items:center; }
.user-info button { font: inherit; }
.user-info .u-member,.user-info .u-quota { height: 34px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid #ded9ef; border-radius: 11px; padding: 0 12px; background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(247,245,255,.94)); color:#403a56; box-shadow:inset 0 1px rgba(255,255,255,.9),0 3px 10px rgba(62,40,116,.05); cursor: pointer; white-space: nowrap; transition:border-color .18s,background .18s,box-shadow .18s,color .18s; }
.user-info .u-member:hover,.user-info .u-quota:hover { border-color:rgba(124,92,255,.38);box-shadow:inset 0 1px rgba(255,255,255,.9),0 5px 16px rgba(84,58,160,.1); }
.user-info .u-member .ic,.user-info .u-quota .ic { width: 13.2px; height: 13.2px; }
.user-info .u-member { color:#8b6217; }
.user-info .u-member .ic { color: #e29a19; }
.user-info .u-quota { color:#3d3850;font-weight:700; }
.user-info .u-quota .ic { color:#7754f6; }
.user-info .u-profile { width: 36px; height: 36px; padding: 2px; border: 2px solid #8060f4; border-radius: 50%; background: #fff; position: relative; cursor: pointer;box-shadow:0 3px 10px rgba(83,54,174,.1); }
.user-info .u-profile .u-avatar { width: 100%; height: 100%; margin: 0; border: 0; display: grid; place-items: center; }
.u-avatar-fallback { color: #fff; background: linear-gradient(145deg,#20264d,#896bff); font-weight: 700; }
.u-status-dot { position: absolute; right: -1.8px; top: -1.8px; width: 7px; height: 7px; border-radius: 50%; background: #ff4e61; border: 1.8px solid var(--nav-bg); }
.u-profile-wrap { position: relative; display:flex; }

/* 头像悬停菜单：统一细线图标。 */
.u-profile-wrap.has-pop .profile-pop { position:absolute;top:calc(100% + 8px);right:0;z-index:210;width:264px;padding:10.6px;background:var(--bg-2);border:.9px solid var(--card-border);border-radius:15px;box-shadow:0 14px 44px rgba(22,13,51,.2);opacity:0;visibility:hidden;transform:translateY(-5px);transition:opacity .18s,visibility .18s,transform .18s;text-align:left;color:var(--text); }
.u-profile-wrap.has-pop:hover .profile-pop,.u-profile-wrap.has-pop:focus-within .profile-pop { opacity:1;visibility:visible;transform:translateY(0); }
.pp-identity { display:grid;grid-template-columns:39px minmax(0,1fr) 16px;gap:9px;align-items:center;padding:9px;background:var(--bg-soft);border-radius:11px; }
.pp-avatar { width:39px;height:39px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:linear-gradient(145deg,#22284f,#8768f7);color:#fff;font-weight:700; }
.pp-avatar img { width:100%;height:100%;object-fit:cover; }
.pp-identity b,.pp-identity small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.pp-identity b { font-size:12.3px; }.pp-identity small { font-size:9.7px;color:var(--text-faint);margin-top:2px; }.pp-next { width:13px;height:13px;color:var(--text-faint); }
.pp-plan { display:flex;align-items:center;gap:7px;margin:8px 0;padding:8px 9px;border-radius:10px;background:rgba(245,196,83,.1);font-size:10.6px; }
.pp-plan>.ic { width:14px;height:14px;color:#d89220; }.pp-plan small { margin-left:auto;color:var(--text-faint);font-size:8.8px; }
.pp-menu { display:grid;gap:1.8px; }
.pp-menu button { display:grid;grid-template-columns:29px minmax(0,1fr) 14px;align-items:center;min-height:38px;padding:3.5px 7px;border:0;border-radius:8.8px;background:none;color:var(--text-dim);text-align:left;cursor:pointer;font:inherit;font-size:11.4px; }
.pp-menu button:hover { background:var(--primary-soft);color:var(--primary); }.pp-icon { width:27px;height:27px;display:grid;place-items:center; }.pp-icon .ic { width:15.8px;height:15.8px; }
.pp-menu .pp-logout { border-top:.9px solid var(--card-border);border-radius:0;margin-top:4px;color:#d45268; }.pp-menu .pp-logout:hover { background:rgba(239,68,68,.07);color:#ef4444; }
[data-theme="dark"] .user-info .u-member,
[data-theme="dark"] .user-info .u-quota { background:linear-gradient(180deg,rgba(31,31,45,.96),rgba(22,22,34,.96));border-color:rgba(255,255,255,.12);box-shadow:inset 0 1px rgba(255,255,255,.05),0 5px 18px rgba(0,0,0,.24); }
[data-theme="dark"] .user-info .u-member { color:#f1bf58; }
[data-theme="dark"] .user-info .u-member .ic { color:#f3ad2f; }
[data-theme="dark"] .user-info .u-quota { color:#f3f0ff; }
[data-theme="dark"] .user-info .u-quota .ic { color:#9b82ff;filter:drop-shadow(0 0 5px rgba(124,92,255,.45)); }
[data-theme="dark"] .user-info .u-member:hover,[data-theme="dark"] .user-info .u-quota:hover { border-color:rgba(139,123,255,.38);background:linear-gradient(180deg,rgba(38,37,55,.98),rgba(25,24,39,.98)); }
[data-theme="dark"] .user-info .u-profile { background:#171722;border-color:#9178ff;box-shadow:0 0 0 1px rgba(255,255,255,.04),0 0 16px rgba(124,92,255,.2); }
[data-theme="dark"] .u-status-dot { border-color:#0a0a12; }
[data-theme="dark"] .u-profile-wrap.has-pop .profile-pop { box-shadow:0 16px 48px rgba(0,0,0,.42); }

/* 普通生成和 Pro 模式混排的统一历史。 */
.history-item .h-title strong,.history-item .h-title small { display:block; }
.history-item .h-title small { margin-top:4px;color:var(--text-faint);font-size:10.6px;font-weight:400;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.history-unified { display:grid;grid-template-columns:35px minmax(0,1fr) auto; }
.history-type-icon { width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:var(--primary-soft);color:var(--primary); }
.history-type-icon .ic { width:15px;height:15px; }.history-empty { color:var(--text-faint);font-size:12.3px; }.h-tag.gen { background:var(--primary-soft);color:var(--primary); }

@media(max-width:720px){
  .user-info .u-member{display:none}
  .history-unified{grid-template-columns:32px minmax(0,1fr)}
  .history-unified .h-meta{grid-column:2}
  .u-profile-wrap.has-pop .profile-pop{position:fixed;top:66px;right:12px;width:min(264px,calc(100vw - 24px))}
}

/* ============ 图片放大查看（即梦式 Lightbox） ============ */
.lightbox {
  position: fixed; inset: 0; z-index: 1000;
  display: flex; align-items: center; justify-content: center;
}
.lightbox.hidden { display: none; }
.lb-backdrop {
  position: absolute; inset: 0;
  background: rgba(5,6,15,0.88);
  backdrop-filter: blur(5.3px);
  animation: lb-fade .22s ease both;
}
@keyframes lb-fade { from { opacity: 0; } to { opacity: 1; } }
.lb-stage {
  position: relative; z-index: 2;
  max-width: 88vw; max-height: 86vh;
  display: flex; align-items: center; justify-content: center;
  animation: lb-pop .3s cubic-bezier(.22,1.2,.36,1) both;
}
@keyframes lb-pop {
  from { transform: scale(.86); opacity: 0; }
  to   { transform: scale(1);   opacity: 1; }
}
.lb-stage img {
  max-width: 88vw; max-height: 86vh;
  border-radius: 12.3px; object-fit: contain;
  box-shadow: 0 21.1px 70.4px rgba(0,0,0,0.6);
  background: #000;
  cursor: zoom-out;
}
.lb-close {
  position: absolute; top: 17.6px; right: 17.6px; z-index: 3;
  width: 37px; height: 37px; border-radius: 50%;
  background: rgba(255,255,255,0.14); color: #fff;
  border: 0.9px solid rgba(255,255,255,0.25); font-size: 15px;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: all .2s; backdrop-filter: blur(7px);
}
.lb-close:hover { background: #ff2d55; border-color: #ff2d55; transform: rotate(90deg); }

/* ═══ 鼠标光标：只有缩略图区域是手型，其余恢复浏览器默认 ═══ */
.up-badge-item, .up-badge-item img, .us-name, .up-thumb, .up-thumb img, .us-zoom, .us-zoom img, .up-preview, .up-preview img, .us-del, .up-del {
  cursor: pointer !important;
}

/* 全站禁止文本选中 → 点击/双击不再出现竖杠编辑光标（输入框保留可输入） */
body { user-select: none; -webkit-user-select: none; }
input, textarea { user-select: text; -webkit-user-select: text; }
/* 对话内容、分镜文本等可复制区域：恢复可选中（俊导要求能复制对话文字） */
.chat-msg, .chat-msg *, .shot-card, .shot-card *, .prompt-box, .prompt-box *, .story-text, .story-text *, .result-text, .result-text *, .copyable, .copyable * {
  user-select: text; -webkit-user-select: text;
}

/* 📚 知识库快捷入口（第 2 行 chips，2026-09-02 新增） */
.chips-kb { margin-top: 10.6px; }
.chip-kb {
  background: linear-gradient(135deg, rgba(124,92,255,0.08), rgba(0,200,170,0.06));
  border-color: rgba(124,92,255,0.28);
  font-size: 10.6px; padding: 5.3px 12.3px;
}
.chip-kb:hover { border-color: rgba(0,200,170,0.5); color: #00b8a0; background: rgba(0,200,170,0.08); }
.kb-label { display: block; text-align: center; margin-top: 15.8px; font-size: 10.6px; color: var(--text-dim); letter-spacing: 0.9px; }
.kb-label b { color: var(--primary); }

/* 📚 精准调用徽标（结果页，2026-09-02 新增） */
.kb-badge {
  width: 100%; display: flex; flex-wrap: wrap; gap: 5.3px; align-items: center;
  margin-top: 7px; font-size: 10.6px; color: #00b8a0;
  background: rgba(0,200,170,0.07); border: 0.9px solid rgba(0,200,170,0.25);
  padding: 5.3px 10.6px; border-radius: 8.8px;
}
.kb-tag {
  background: rgba(0,200,170,0.12); color: #00a88f; border: 0.9px solid rgba(0,200,170,0.3);
  padding: 1.8px 8.8px; border-radius: 88px; font-weight: 600; font-size: 9.7px;
}

/* ⚡ Skill 驱动徽标(核心卖点,2026-09-02 新增) */
.kb-badge-skill { background: rgba(124,92,255,0.08); border-color: rgba(124,92,255,0.3); color: var(--primary); }
.kb-tag-skill { background: rgba(124,92,255,0.12); color: var(--primary); border-color: rgba(124,92,255,0.35); }

/* 🎨 风格画廊已选案例条(2026-09-02) */
/* 🎨 风格画廊已选案例条：主框(hero-toolbar)内左下角紧凑条 */
.gallery-sel { display: inline-flex; align-items: center; gap: 5.3px; max-width: 211.2px; background: #eef2ff; border: 0.9px solid #c7d2fe; border-radius: 879.1px; padding: 1.8px 3.5px 1.8px 5.3px; font-size: 10.6px; color: #3730a3; flex-shrink: 1; min-width: 0; }
.gallery-sel img { width: 17.6px; height: 17.6px; border-radius: 50%; object-fit: cover; border: 0.9px solid #c7d2fe; flex-shrink: 0; }
.gallery-sel .gs-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gallery-sel .gs-clear { border: 0; background: transparent; color: #6d28d9; cursor: pointer; padding: 1.8px 4.4px; border-radius: 879.1px; display: inline-flex; align-items: center; flex-shrink: 0; }
.gallery-sel .gs-clear .ic { width: 10.6px; height: 10.6px; }
.gallery-sel .gs-clear:hover { background: #e0e7ff; }

/* ⚔ 对照生成(2026-09-02) */
.cmp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14.1px; max-width: 950.4px; margin: 0 auto; }
.cmp-card { position: relative; }
.cmp-head { display: flex; align-items: center; gap: 7px; font-size: 13.2px; margin-bottom: 5.3px; }
.cmp-tag { font-size: 9.7px; background: #f1f0ff; color: #6d28d9; padding: 1.8px 7px; border-radius: 879.1px; font-weight: 400; }
.cmp-engine .cmp-tag { background: #ecfdf5; color: #047857; }
.cmp-desc { font-size: 10.6px; color: #888; margin: 0 0 8.8px; line-height: 1.6; }
.cmp-prompt-title { font-size: 10.6px; font-weight: 600; color: #555; margin: 8.8px 0 3.5px; }
.cmp-engine .prompt-box { min-height: 79.2px; }
.cmp-plain .prompt-box { min-height: 193.6px; }
.cmp-card .copy-btn { margin-top: 7px; }
@media (max-width: 800px) { .cmp-grid { grid-template-columns: 1fr; } }

/* ============ 2026-09-02 线性图标体系（Lucide，替代 emoji 图标） ============ */
.ic { width: 14.1px; height: 14.1px; flex-shrink: 0; vertical-align: -0.18em; display: inline-block; }
.ic-sm { width: 12.3px; height: 12.3px; }
.ic-lg { width: 17.6px; height: 17.6px; }
button .ic, a .ic { pointer-events: none; }
/* logo 徽标 */
.logo { display: inline-flex; align-items: center; gap: 8.8px; }
.logo .lg-ic {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22.9px; height: 22.9px; border-radius: 7px;
  background: linear-gradient(135deg, #7c5cff, #6d4aff);
  color: #fff; box-shadow: 0 1.8px 8.8px rgba(124,92,255,0.35);
}
.logo .lg-ic { -webkit-text-fill-color: initial; }
.logo .lg-ic .ic { width: 13.2px; height: 13.2px; }
/* 行内图标按钮统一 */
.theme-toggle, .btn-ghost, .btn-copy-all, .g-use, .gs-clear { display: inline-flex; align-items: center; gap: 6.2px; justify-content: center; }
.sel-btn { display: inline-flex; align-items: center; gap: 6.2px; }
.sel-btn .ic { color: var(--text-dim); }
.sel-btn:hover .ic { color: var(--primary); }
.sel-item { display: flex; align-items: center; gap: 7px; width: 100%; justify-content: flex-start; text-align: left; }
.hero-badge { display: inline-flex; align-items: center; gap: 6.2px; }
.hero-badge .ic { width: 12.3px; height: 12.3px; color: var(--primary); }
.btn-generate .ic { color: #fff; }
/* 功能卡 / 横幅 / 上传 / VIP 图标容器（emoji 大字 → 线性图标居中） */
.f-icon { display: flex; align-items: center; justify-content: center; width: 49.3px; height: 49.3px; border-radius: 14.1px; background: var(--primary-soft); color: var(--primary); margin-bottom: 12.3px; }
.f-icon .ic { width: 22.9px; height: 22.9px; }
.cb-icon { display: inline-flex; align-items: center; justify-content: center; width: 49.3px; height: 49.3px; border-radius: 12.3px; background: var(--primary-soft); color: var(--primary); }
.cb-icon .ic { width: 22.9px; height: 22.9px; }
.up-icon { display: flex; align-items: center; justify-content: center; color: var(--primary); margin-bottom: 7px; }
.up-icon .ic { width: 29.9px; height: 29.9px; }
.vip-badge .ic { width: 17.6px; height: 17.6px; color: var(--primary); }
.vip-card.vip-active .vip-badge .ic { color: #6ea8ff; }

/* H3 中文对照折叠框(2026-09-02 俊导:中文翻译单独框,不随复制) */
.zh-note { margin-top: 8.8px; border: 0.9px dashed #d5d7e8; border-radius: 8.8px; background: #f8f8fc; padding: 0; overflow: hidden; }
.zh-note summary { cursor: pointer; font-size: 10.6px; color: #7a7a92; padding: 7px 10.6px; user-select: none; list-style: none; display: flex; align-items: center; gap: 5.3px; }
.zh-note summary::before { content: '▸'; transition: transform 0.15s; font-size: 8.8px; }
.zh-note[open] summary::before { transform: rotate(90deg); }
.zh-note summary:hover { background: #f0f0f8; }
.zh-note div { font-size: 11.4px; line-height: 1.7; color: #55556e; padding: 3.5px 12.3px 10.6px; white-space: pre-wrap; }

/* ========== 左侧导航栏 · 导演画布入口（2026-09-04） ========== */
.lab-rail{position:fixed;left:12.3px;top:50%;transform:translateY(-50%);z-index:200;display:flex;flex-direction:column;align-items:center;gap:3.5px;padding:8.8px 4.4px;border-radius:17.6px;background:rgba(15,15,22,.66);backdrop-filter:blur(14.1px);-webkit-backdrop-filter:blur(14.1px);border:0.9px solid rgba(255,255,255,.08);box-shadow:0 8.8px 29.9px rgba(0,0,0,.22)}
.lab-rail a{position:relative;color:#c7cdd9;text-decoration:none;transition:color .15s}
.lab-rail .rail-top{width:31.7px;height:31.7px;border-radius:10.6px;display:flex;align-items:center;justify-content:center;color:#8f97a8}
.lab-rail .rail-top:hover{color:#fff;background:rgba(255,255,255,.09)}
.lab-rail .rail-sep{width:21.1px;height:0.9px;background:rgba(255,255,255,.09);margin:2.6px 0}
.rail-item{width:45.8px;padding:6.2px 0 5.3px;border-radius:13.2px;display:flex;flex-direction:column;align-items:center;gap:3.5px;font-size:8.8px;letter-spacing:.2.6px}
.rail-item .ra-ic{width:33.4px;height:33.4px;border-radius:11.4px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#8b5cf6,#6d28d9);box-shadow:0 5.3px 15.8px rgba(124,92,255,.42)}
.rail-item .ra-ic svg{width:17.6px;height:17.6px;stroke:#fff}
.rail-item:hover{background:rgba(255,255,255,.07);color:#fff}
.rail-item:hover .ra-ic{filter:brightness(1.15)}
.rail-tip{position:absolute;left:calc(100% + 10.6px);top:50%;transform:translateY(-50%) translateX(-3.5px);background:#22222e;border:0.9px solid rgba(255,255,255,.1);color:#f1f5f9;font-size:10.6px;line-height:1.55;padding:6.2px 10.6px;border-radius:8.8px;white-space:nowrap;opacity:0;pointer-events:none;transition:.16s;box-shadow:0 7px 22.9px rgba(0,0,0,.4);z-index:5}
.rail-tip::before{content:"";position:absolute;right:100%;top:50%;transform:translateY(-50%);border:5.3px solid transparent;border-right-color:#22222e}
.rail-item:hover .rail-tip{opacity:1;transform:translateY(-50%) translateX(0)}
.rail-tip b{display:block;color:#c4b5fd;font-size:11px;margin-bottom:1.8px}
@media(max-width:860px){.lab-rail{display:none}}

/* ============================================================
   首页左侧栏（MiniMax Design 式浅色导航，2026-09-04）
   ============================================================ */
body.home-app .lab-rail{display:none}
body.home-app{padding-left:0}
.app-side{position:fixed;left:0;top:0;bottom:0;width:207.7px;z-index:190;
  background:#efeff2;display:flex;flex-direction:column;
  border-right:0.9px solid rgba(0,0,0,.045);user-select:none}
.app-side .as-inner{display:flex;flex-direction:column;height:100%;overflow-y:auto;overflow-x:hidden;padding:15.8px 10.6px 12.3px}
.app-side .as-inner::-webkit-scrollbar{width:3.5px}
.app-side .as-inner::-webkit-scrollbar-thumb{background:rgba(0,0,0,.12);border-radius:3.5px}
.as-brand{display:flex;align-items:center;gap:8.8px;padding:1.8px 7px 14.1px;text-decoration:none}
.as-brand .as-logo{width:26.4px;height:26.4px;border-radius:7.9px;flex:none;
  background:linear-gradient(135deg,#8d7bff,#6c5ce7);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 1.8px 7px rgba(108,92,231,.35)}
.as-brand .as-logo svg{width:14.1px;height:14.1px;stroke:#fff}
.as-brand .as-name{font-size:12.8px;font-weight:650;color:#1a1a20;letter-spacing:.1.8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.as-new{display:flex;align-items:center;gap:8.8px;margin:1.8px 0 5.3px;padding:7px 8.8px;border-radius:9.7px;
  text-decoration:none;transition:background .14s}
.as-new:hover{background:rgba(0,0,0,.05)}
.as-new .as-new-ic{width:19.4px;height:19.4px;border-radius:6.2px;flex:none;
  background:linear-gradient(135deg,#8d7bff,#6c5ce7);
  display:flex;align-items:center;justify-content:center;box-shadow:0 0.9px 3.5px rgba(108,92,231,.35)}
.as-new .as-new-ic svg{width:10.6px;height:10.6px;stroke:#fff;stroke-width:2.4}
.as-new span.as-new-t{font-size:12.8px;color:#1a1a20;font-weight:500;letter-spacing:.2.6px}
.as-g{display:flex;align-items:center;padding:12.3px 8.8px 5.3px;font-size:9.7px;font-weight:600;
  color:#9a9aa2;letter-spacing:1.3px}
.as-item{display:flex;align-items:center;gap:8.8px;padding:6.2px 8.8px;border-radius:8.8px;
  text-decoration:none;color:#33333a;font-size:12.3px;transition:background .13s;position:relative}
.as-item .as-ic{width:15.8px;height:15.8px;flex:none;display:flex;align-items:center;justify-content:center}
.as-item .as-ic svg{width:14.1px;height:14.1px;stroke:#51505a;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}
.as-item:hover{background:rgba(0,0,0,.055)}
.as-item.act{background:#fff;color:#16161c;font-weight:600;box-shadow:0 0.9px 2.6px rgba(20,20,35,.07)}
.as-item.act .as-ic svg{stroke:#6c5ce7}
.as-proj{display:flex;align-items:center;gap:8.8px;padding:5.3px 8.8px;border-radius:7.9px;
  text-decoration:none;color:#3a3a42;font-size:11.4px;transition:background .13s;position:relative}
.as-proj .as-p-ic{width:15.8px;height:15.8px;flex:none;display:flex;align-items:center;justify-content:center;
  border-radius:5.3px;background:rgba(0,0,0,.06)}
.as-proj .as-p-ic svg{width:10.6px;height:10.6px;stroke:#6a6a74;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
.as-proj .as-p-nm{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.as-proj:hover{background:rgba(0,0,0,.055)}
.as-empty{padding:1.8px 8.8px 3.5px;font-size:10.6px;color:#a2a2ab;line-height:1.7}
.as-foot{margin-top:auto;padding:10.6px 7px 0;display:flex;align-items:center;gap:7.9px}
.as-foot .as-u-av{width:22.9px;height:22.9px;border-radius:50%;background:#e3e2ee;color:#4a4a55;
  font-size:10.6px;font-weight:600;display:flex;align-items:center;justify-content:center;flex:none}
.as-foot .as-u-nm{flex:1;font-size:11px;color:#55555e;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.as-foot .as-u-in{font-size:10.6px;color:#6c5ce7;background:none;border:none;cursor:pointer;padding:3.5px;border-radius:6.2px}
.as-foot .as-u-in:hover{background:rgba(108,92,231,.1)}
@media(max-width:900px){body.home-app{padding-left:0}.app-side{display:none}}

/* ========== 首页：仅保留已确认的控件 UI（2026-09-05） ========== */
/* 登录/注册：对应确认稿的深墨色按钮。 */
.home-app .btn-login{height:31.7px;border-radius:8.8px;padding:0 11.4px;background:#171827;color:#fff;box-shadow:0 4.4px 10.6px rgba(23,24,39,.16);font-weight:700;letter-spacing:.4.4px}
.home-app .btn-login:hover{background:#28293a;transform:translateY(-0.9px);box-shadow:0 7px 14.1px rgba(23,24,39,.22)}
/* 输入主框与工具栏：与确认稿一致的白色表面、细描边、底部工具带。 */
.home-app .input-shell{padding:7px;border:0.9px solid #e2e4ed;border-radius:17.6px;background:#fff;box-shadow:0 12.3px 29.9px rgba(46,42,86,.07)}
.home-app .input-shell textarea{min-height:102.1px;padding:14.1px 10.6px 10.6px}.home-app .hero-toolbar{min-height:45.8px;padding:9.7px 8.8px 2.6px;border-top:0.9px solid #e6e7ee;gap:7px}
/* 上传素材、视频提示词、模型选择、智能时长：对应确认稿的小型实体控件。 */
.home-app .upload-btn{display:inline-flex;align-items:center;justify-content:center;gap:6.2px;width:auto;height:31.7px;padding:0 10.6px;border:0.9px solid #e0e1ec;border-radius:8.8px;background:#f8f8fc;color:#6658e8;box-shadow:none;font-size:10.6px;font-weight:600;white-space:nowrap}
.home-app .upload-btn .ic{width:13.2px;height:13.2px;stroke-width:2.2}.home-app .upload-btn:hover{background:#f0edff;border-color:#cfc8ff;transform:none;box-shadow:none}
.home-app #modeSel .sel-btn,.home-app #modelSel .sel-btn,.home-app #durSel .sel-btn{height:31.7px;border-radius:8.8px;padding:0 9.7px;background:#f8f8fc;border-color:#e0e1ec;box-shadow:none;font-size:10.6px;font-weight:500;color:#65677a}
.home-app #modeSel .sel-btn .ic,.home-app #modelSel .sel-btn .ic,.home-app #durSel .sel-btn .ic{width:13.2px;height:13.2px;color:#6d5ff0}.home-app #modeSel.open .sel-btn,.home-app #modelSel.open .sel-btn,.home-app #durSel.open .sel-btn{background:#f0edff;border-color:#c8c0ff;box-shadow:0 0 0 2.6px rgba(124,92,255,.09)}
/* 生成按钮：确认稿中的亮紫色、积分胶囊与紧凑尺寸。 */
.home-app .btn-generate{height:35.2px;min-height:35.2px;padding:0 12.3px;border-radius:9.7px;background:linear-gradient(135deg,#8067ed,#6248df);box-shadow:0 6.2px 13.2px rgba(99,72,222,.25);font-size:10.6px}.home-app .btn-generate .cost-num{background:rgba(255,255,255,.2);border-radius:5.3px;padding:2.6px 4.4px;color:#fff}.home-app .btn-generate:hover{box-shadow:0 7.9px 16.7px rgba(99,72,222,.34)}
.home-app .generation-cost{height:26.4px;display:inline-flex;align-items:center;gap:3.5px;padding:0 6.2px;color:#7365e9;font-size:10.6px;font-weight:700;white-space:nowrap}.home-app .generation-cost .ic{width:12.3px;height:12.3px;color:#8067ed}.home-app .btn-generate{min-width:81px;justify-content:center}.home-app .btn-generate .btn-main{font-size:10.6px;font-weight:700}
/* 深色模式：去掉浅色内描边，改为墨色表面和低对比描边。 */
[data-theme="dark"] .home-app .input-shell{background:#17181f;border-color:rgba(255,255,255,.11);box-shadow:0 14.1px 33.4px rgba(0,0,0,.32)}
[data-theme="dark"] .home-app .hero-toolbar{border-top-color:rgba(255,255,255,.09)}
[data-theme="dark"] .home-app #modeSel .sel-btn,[data-theme="dark"] .home-app #modelSel .sel-btn,[data-theme="dark"] .home-app #durSel .sel-btn,[data-theme="dark"] .home-app .upload-btn{background:#24252f;border-color:rgba(255,255,255,.1);color:#d7d5e4;box-shadow:none}
[data-theme="dark"] .home-app .upload-btn .ic,[data-theme="dark"] .home-app #modeSel .sel-btn .ic,[data-theme="dark"] .home-app #modelSel .sel-btn .ic,[data-theme="dark"] .home-app #durSel .sel-btn .ic{color:#afa3ff}

/* ========== 首页双模式：生成 + 画布（2026-09-05） ========== */
.home-mode-switch{display:inline-flex;align-items:center;gap:2.6px;padding:3.5px;margin:-6.2px 0 19.4px;border:0.9px solid var(--card-border);border-radius:10.6px;background:var(--bg-1);box-shadow:0 1.8px 7px rgba(31,26,75,.05)}
.home-mode{height:27.3px;min-width:81px;border:0;border-radius:7px;background:transparent;color:var(--text-faint);display:inline-flex;align-items:center;justify-content:center;gap:6.2px;font-size:10.6px;font-weight:650;cursor:pointer;transition:all .22s ease}.home-mode .ic{width:12.3px;height:12.3px;pointer-events:none}.home-mode:hover{color:var(--primary)}.home-mode.active{background:var(--card);color:var(--primary);box-shadow:0 1.8px 6.2px rgba(33,28,84,.1)}
.canvas-launch{width:100%;max-width:915.2px;margin:0 auto;animation:canvasLaunchIn .32s cubic-bezier(.2,.8,.2,1)}@keyframes canvasLaunchIn{from{opacity:0;transform:translateY(8.8px)}to{opacity:1;transform:none}}
.canvas-new-project{position:relative;isolation:isolate;width:100%;min-height:146.1px;overflow:hidden;border:0.9px solid rgba(124,92,255,.19);border-radius:15.8px;background:linear-gradient(135deg,rgba(248,247,255,.98),rgba(255,255,255,.96));color:var(--text);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6.2px;cursor:pointer;transition:transform .24s cubic-bezier(.2,.8,.2,1),border-color .24s,box-shadow .24s}.canvas-new-project:before{content:"";position:absolute;inset:0;z-index:-1;opacity:.55;background-image:radial-gradient(circle,rgba(111,88,226,.2) 0.9px,transparent 1.1px);background-size:15.8px 15.8px;mask-image:linear-gradient(to bottom,transparent,black 28%,black 72%,transparent)}.canvas-new-project:hover{transform:translateY(-2.6px);border-color:rgba(112,82,235,.42);box-shadow:0 15.8px 28.2px rgba(70,49,159,.12)}.canvas-new-plus{width:31.7px;height:31.7px;border-radius:9.7px;display:grid;place-items:center;background:var(--primary);color:#fff;box-shadow:0 7px 13.2px rgba(105,78,226,.28);transition:transform .22s}.canvas-new-plus .ic-lg{width:16.7px;height:16.7px}.canvas-new-project:hover .canvas-new-plus{transform:rotate(90deg) scale(1.05)}.canvas-new-project b{font-size:12.3px;letter-spacing:.01em}.canvas-new-project small{font-size:9.7px;color:var(--text-faint)}
.canvas-quick-input{max-width:633.6px;margin:12.3px auto 21.1px;border:0.9px solid var(--card-border);border-radius:12.3px;background:var(--card);padding:6.2px 8.8px 6.2px 12.3px;box-shadow:0 7px 19.4px rgba(31,26,75,.045);transition:border-color .22s,box-shadow .22s,padding .22s}.canvas-quick-input:focus-within{padding:10.6px 11.4px;border-color:rgba(124,92,255,.5);box-shadow:0 0 0 2.6px rgba(124,92,255,.09),0 10.6px 22px rgba(38,27,99,.06)}.canvas-quick-input textarea{box-sizing:border-box;display:block;width:100%;height:27.3px;min-height:27.3px;max-height:128.5px;resize:none;border:0;outline:0;background:transparent;color:var(--text);font:10.6px/1.65 inherit;padding:3.5px 0;transition:height .22s,min-height .22s}.canvas-quick-input:focus-within textarea{height:73.9px;min-height:73.9px}.canvas-quick-footer{display:none;align-items:center;gap:7.9px;padding-top:6.2px;color:var(--text-faint);font-size:8.8px}.canvas-quick-input:focus-within .canvas-quick-footer{display:flex;animation:canvasFooterIn .2s ease both}@keyframes canvasFooterIn{from{opacity:0;transform:translateY(-3.5px)}to{opacity:1;transform:none}}.canvas-quick-footer span{flex:1}.canvas-quick-footer button{width:27.3px;height:27.3px;border:0;border-radius:7.9px;display:grid;place-items:center;cursor:pointer}.canvas-quick-upload{background:var(--primary-soft);color:var(--primary)}.canvas-quick-send{background:var(--primary);color:#fff;box-shadow:0 3.5px 8.8px rgba(124,92,255,.25)}.canvas-quick-input .ic{width:13.2px;height:13.2px}
.canvas-recent-wrap{margin-top:3.5px}.canvas-recent-head{display:flex;align-items:center;justify-content:space-between;margin:0 0 8.8px;text-align:left}.canvas-recent-head span{font-size:11.4px;font-weight:700}.canvas-recent-head button{border:0;background:transparent;color:var(--primary);font-size:10.6px;cursor:pointer}.canvas-recent{display:grid;grid-template-columns:repeat(4,1fr);gap:8.8px;text-align:left}.canvas-recent-item{min-height:82.7px;border:0.9px solid var(--card-border);border-radius:11.4px;background:var(--card);padding:11.4px;cursor:pointer;transition:.2s}.canvas-recent-item:hover{border-color:rgba(124,92,255,.34);transform:translateY(-1.8px)}.canvas-recent-icon{width:22.9px;height:22.9px;border-radius:7px;display:grid;place-items:center;background:var(--primary-soft);color:var(--primary);margin-bottom:7.9px}.canvas-recent-icon .ic{width:12.3px;height:12.3px}.canvas-recent-item b{display:block;font-size:9.7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.canvas-recent-item small{font-size:8.8px;color:var(--text-faint);display:block;margin-top:4.4px}.canvas-recent-empty{grid-column:1/-1;border:0.9px dashed var(--card-border);border-radius:11.4px;padding:15.8px;color:var(--text-faint);font-size:10.6px}
#inputSection.canvas-mode #generateShell,#inputSection.canvas-mode #chips,#inputSection.canvas-mode .kb-label,#inputSection.canvas-mode #chipsKb,#inputSection.canvas-mode .banner-row,#inputSection.canvas-mode .trust-bar{display:none}#inputSection.canvas-mode{padding-bottom:33.4px}#inputSection.canvas-mode .hero-sub{margin-bottom:19.4px}
[data-theme="dark"] .home-mode-switch{background:#20202c;border-color:rgba(255,255,255,.1)}[data-theme="dark"] .home-mode.active{background:#32313f;color:#b7adff;box-shadow:0 1.8px 6.2px rgba(0,0,0,.28)}[data-theme="dark"] .canvas-new-project{background:linear-gradient(135deg,#20202b,#181920);border-color:rgba(255,255,255,.08)}[data-theme="dark"] .canvas-new-project:before{background-image:radial-gradient(circle,rgba(186,174,255,.2) 0.9px,transparent 1.1px)}[data-theme="dark"] .canvas-quick-input,[data-theme="dark"] .canvas-recent-item{background:#191a22;border-color:rgba(255,255,255,.1)}
@media(max-width:860px){.canvas-recent{grid-template-columns:repeat(2,1fr)}.home-mode-switch{margin-bottom:15px}}@media(max-width:500px){.home-mode{min-width:68.6px}.canvas-new-project{min-height:125px}.canvas-new-project small{padding:0 13.2px}.canvas-quick-footer span{display:none}.canvas-recent{grid-template-columns:1fr}}

/* ========== 交互质感：柔和层级、状态反馈与画布网络脉冲 ========== */
@media (prefers-reduced-motion:no-preference){
  .home-app button,.home-app a,.canvas-launch button{transition-property:transform,box-shadow,border-color,background-color,color,opacity;transition-duration:.22s;transition-timing-function:cubic-bezier(.2,.8,.2,1)}
  .home-app button:active,.canvas-launch button:active{transform:scale(.975)}
  .home-mode-switch{position:relative;overflow:hidden}.home-mode.active{animation:modeSettle .32s cubic-bezier(.2,.8,.2,1)}@keyframes modeSettle{0%{transform:scale(.92);opacity:.55}100%{transform:scale(1);opacity:1}}
  .canvas-new-project{transform:translateZ(0)}.canvas-new-project:after{content:"";position:absolute;inset:-55% -30%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at center,rgba(124,92,255,.14),transparent 54%);opacity:0;transform:scale(.68);transition:opacity .45s ease,transform .7s cubic-bezier(.2,.8,.2,1)}.canvas-new-project:hover:after{opacity:1;transform:scale(1)}
  .canvas-network{position:absolute;inset:0;width:100%;height:100%;z-index:-1;opacity:.46;pointer-events:none}.network-lines path{fill:none;stroke:rgba(111,84,231,.24);stroke-width:1;stroke-dasharray:5 16;stroke-linecap:round;animation:networkFlow 12s linear infinite}.network-lines path:nth-child(2n){animation-duration:15s;animation-direction:reverse}.network-dots circle{fill:#876ff0;opacity:.3;filter:drop-shadow(0 0 2.6px rgba(117,91,239,.42));animation:networkPulse 5.8s ease-in-out infinite}.network-dots circle:nth-child(3n){animation-delay:-1.7s}.network-dots circle:nth-child(4n){animation-delay:-3.3s}@keyframes networkFlow{to{stroke-dashoffset:-170}}@keyframes networkPulse{0%,100%{opacity:.18;transform:scale(1)}50%{opacity:.72;transform:scale(1.5)}}
  .canvas-new-project:hover .network-lines path{stroke:rgba(101,71,233,.5);animation-duration:4.5s}.canvas-new-project:hover .network-dots circle{opacity:.78;animation-duration:2.6s}
  .canvas-quick-input{position:relative}.canvas-quick-input:focus-within:before{content:"";position:absolute;left:17.6px;right:17.6px;bottom:-0.9px;height:0.9px;background:linear-gradient(90deg,transparent,#8064ee,transparent);animation:inputBeam 1.3s ease both}@keyframes inputBeam{from{opacity:0;transform:scaleX(.15)}to{opacity:1;transform:scaleX(1)}}
  .canvas-recent-item{position:relative;overflow:hidden}.canvas-recent-item:after{content:"";position:absolute;width:70.4px;height:70.4px;right:-31.7px;bottom:-40.5px;border-radius:50%;background:rgba(124,92,255,.1);transform:scale(.25);transition:transform .35s cubic-bezier(.2,.8,.2,1)}.canvas-recent-item:hover:after{transform:scale(1.5)}.canvas-recent-item>*{position:relative;z-index:1}
  .input-shell:focus-within{transform:translateY(-0.9px);transition:transform .24s cubic-bezier(.2,.8,.2,1)}.input-shell:focus-within .btn-generate{transform:translateY(-0.9px);box-shadow:0 8.8px 19.4px rgba(99,72,222,.33)}
  .chips .chip,.case-banner,.feature-card,.workflow-step{transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .2s ease,border-color .2s ease}.chips .chip:hover{transform:translateY(-1.8px);box-shadow:0 4.4px 10.6px rgba(55,42,143,.1)}.case-banner:hover,.feature-card:hover{transform:translateY(-2.6px);box-shadow:0 12.3px 24.6px rgba(41,30,112,.09)}
}
[data-theme="dark"] .network-lines path{stroke:rgba(185,171,255,.28)}[data-theme="dark"] .network-dots circle{fill:#b7aaff}.home-app button:focus-visible,.home-app a:focus-visible,.canvas-launch button:focus-visible{outline:2.6px solid rgba(124,92,255,.32);outline-offset:2.6px}

/* ---------- 创作历史：删除单条 / 清空全部（俊导 2026-09-16） ---------- */
.history-head-actions{display:flex;align-items:center;gap:10px}
.history-item .h-del{flex:none;margin-left:6px;padding:6px 12px;font:inherit;font-size:10.6px;line-height:1;color:#e5484d;background:#fff;border:1px solid rgba(229,72,77,.34);border-radius:9px;cursor:pointer;transition:background .18s,color .18s,border-color .18s}
.history-item .h-del:hover{background:#e5484d;color:#fff;border-color:#e5484d}
.history-item:after{pointer-events:none}
.btn-ghost.btn-danger{color:#e5484d;border-color:rgba(229,72,77,.34)}
.btn-ghost.btn-danger:hover{background:#e5484d;color:#fff;border-color:#e5484d}
[data-theme="dark"] .history-item .h-del{background:transparent;color:#ff6b6f;border-color:rgba(255,107,111,.42)}
[data-theme="dark"] .history-item .h-del:hover{background:#e5484d;color:#fff}

/* 📌 操作指引条（2026-09-16 俊导要求）：操作教程从提示词里移出，放在「文生图提示词」与「图生视频提示词」两个框中间 */
.tl-guide{display:flex;gap:8px;align-items:flex-start;margin:12px 0 6px;padding:10px 13px;border:1px dashed #cdc4f5;border-radius:10px;background:#f7f6fe;font-size:13.2px;line-height:1.62;color:#4a4468}
.tl-guide b{flex:0 0 auto;color:#5b4bd6;font-weight:700;white-space:nowrap}
.tl-guide span{flex:1 1 auto;min-width:0}
[data-theme="dark"] .tl-guide{background:#1e1b30;border-color:#3c3760;color:#c9c4e0}
[data-theme="dark"] .tl-guide b{color:#b3a6ff}
@media (max-width:560px){.tl-guide{flex-direction:column;gap:4px}.tl-guide b{white-space:normal}}