@charset "UTF-8";
@import url("./营销首页.css");
@import url("./我的任务.css");
:root {
  font-family: "Microsoft YaHei UI", "Microsoft YaHei", "PingFang SC", sans-serif;
  font-synthesis: none;
  color: #ecebe7;
  background: #17181b;
  --强调: #dcb28b;
  --文字次: #747477;
  --描边: #ffffff12;
  --侧栏: 72px;
  --顶栏: 72px;
  --配置栏: 75px;
  --视频工具栏: 44px;
  --基础栏: 240px;
  --提示栏: 260px;
  --背景透明度: .19;
}
* { box-sizing: border-box; }
body { margin: 0; }
h1, h2 { margin: 0; }
[v-cloak] { display: none; }
.应用 {
  height: 100dvh;
  min-width: 560px;
  min-height: 470px;
  display: grid;
  grid-template-columns: var(--侧栏) minmax(0, 1fr);
  grid-template-rows: var(--顶栏) var(--配置栏) minmax(0, 1fr);
  background: #17181b;
}
.顶栏 {
  grid-column: 1 / -1;
  grid-row: 1;
  display: grid;
  grid-template-columns: minmax(160px,1fr) auto minmax(160px,1.35fr);
  align-items: center;
  gap: 0;
  padding: 0 26px 0 20px;
  border-bottom: 1px solid var(--描边);
  background: #1a1b1d;
}
.品牌 {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  font-size: 22px;
  font-weight: 650;
  letter-spacing: 1px;
}
.品牌 img { width: 43px; height: 43px; object-fit: contain; }
.品牌TV { color: #d5b08e; letter-spacing: -.5px; margin-left: 2px; }
.区域名称 { font-size: 13px; font-weight: 400; color: #bbb4ac; letter-spacing: 1px; }
.占位说明 { color: var(--文字次); font-size: 11px; font-weight: 400; }
.顶栏说明 { justify-self: end; }
.系统导航 { display: flex; align-items: stretch; gap: 48px; height: 100%; }
.系统导航项 { position: relative; display: flex; align-items: center; padding: 0; font-family: "DengXian", "等线", "Microsoft YaHei", sans-serif; font-size: 18px; font-weight: 400; letter-spacing: 1px; white-space: nowrap; color: #c9c6c0; cursor: pointer; }
.系统导航项:hover,.系统导航项:focus-visible { color: #ecebe7; }
.系统导航项.当前导航 { color: #ead1b6; }
.当前导航::after { content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 26px; height: 2px; background: #d5b08e; }
@media(max-width:900px) { .顶栏 { grid-template-columns: minmax(160px,1fr) auto minmax(12px,.3fr); } .顶栏说明 { display: none; } .系统导航 { gap: 28px; } }
.空白页面 { grid-column: 1 / -1; grid-row: 2 / -1; display: grid; place-items: center; min-height: 0; background: #17181b; }
.占位页说明 { color: #77736e; text-align: center; }
.占位页说明 h1 { font-size: 24px; font-weight: 500; letter-spacing: 2px; }
.占位页说明 p { margin: 12px 0 0; font-size: 12px; color: #56575a; }
@media(max-width:720px) { .顶栏 { grid-template-columns: minmax(150px,1fr) auto; gap: 14px; padding-inline: 16px; } .系统导航 { gap: 18px; } .系统导航项 { font-size: 18px; } }
.素材区 {
  grid-column: 1;
  grid-row: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15px;
  padding-top: 28px;
  border-right: 1px solid var(--描边);
  background: #1b1c1e;
  min-height: 0;
  overflow-y: auto;
}
.素材区 .区域名称 { font-size: 12px; letter-spacing: 0; }
.素材分类 { display: flex; flex-direction: column; align-items: center; gap: 14px; width: 100%; }
.素材入口 { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 57px; padding: 8px 0; color: #a9a49e; font-size: 11px; cursor: pointer; }
.素材入口 svg { color: #bcb2a7; }
.素材入口:hover,.素材入口[aria-pressed="true"] { color: #edc39b; background: #dcb28b0b; }
.素材入口[aria-pressed="true"] svg { color: #edc39b; }
.素材入口[aria-pressed="true"] { box-shadow: inset 2px 0 #dcb28b; }
.作品分类 { display:flex; flex-direction:column; align-items:center; gap:14px; width:100%; margin-top:20px; padding-top:20px; border-top:1px solid var(--描边); }
.作品完成时间 { display:block; padding:4px 80px 3px 1px; color:#8f8983; font-size:11px; }
.素材管理操作 { position:absolute; right:0; bottom:0; display:flex; align-items:center; gap:8px; }
.文件位置按钮 { display:grid; place-items:center; width:28px; height:28px; color:#a49b90; cursor:pointer; }
.文件位置按钮:hover { color:#edc39b; }
.文件位置按钮:focus-visible { outline:1px solid #d8b48f; outline-offset:2px; }
.预览位置错误 { position:absolute; top:66px; left:28px; right:28px; color:#dcac8e; font-size:12px; z-index:2; }
.工作区 {
  grid-column: 2;
  grid-row: 3;
  min-width: 0;
  min-height: 0;
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: var(--视频工具栏) minmax(0, 1fr) 0;
}
.背景, .背景遮罩 { position: absolute; inset: 0; pointer-events: none; }
.背景 {
  background: url('/静态资源/宣传背景.png') center / cover no-repeat;
  opacity: var(--背景透明度);
  z-index: -2;
}
.背景遮罩 {
  background: linear-gradient(180deg, #17181b20, #17181b15 70%, #17181b60);
  z-index: -1;
}
.配置区 {
  grid-column: 1 / -1;
  grid-row: 2;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  padding: 6px 28px;
  border-bottom: 1px solid var(--描边);
  background: #1d1e2166;
}
.视频区 {
  grid-column: 1;
  grid-row: 2;
  min-width: 0;
  min-height: 0;
  position: relative;
  padding: 24px 28px;
  overflow: auto;
}
.视频工具栏 {
  grid-column: 1;
  grid-row: 1;
  padding: 0 28px;
  border-bottom: 1px solid var(--描边);
  background: #1d1e2173;
}
.宣传画面 { position: absolute; inset: 35px 28px 25px; display: grid; place-items: center; z-index: -1; pointer-events: none; }
.宣传画面 img { width: min(490px, 75%); height: auto; max-height: 100%; object-fit: contain; opacity: .28; }
.提示词区 {
  grid-column: 1;
  grid-row: 3;
  display: flex;
  flex-direction: column;
  min-height: 0;
  gap: 12px;
  padding: 16px 28px 14px;
  border-top: 1px solid var(--描边);
  background: #222324f5;
  position: relative;
  z-index: 5;
}
.基础设置区 {
  grid-column: 2;
  grid-row: 1 / -1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 15px;
  padding: 28px 24px;
  border-left: 1px solid var(--描边);
  background: #1d1e21b3;
}
@media (max-width: 900px) {
  :root { --基础栏: 190px; }
}
@media (max-width: 620px) {
  :root { --侧栏: 60px; --基础栏: 150px; --顶栏: 64px; }
  .顶栏 { gap: 22px; padding-inline: 14px; }
  .品牌 { font-size: 18px; gap: 6px; }
  .品牌 img { width: 35px; height: 35px; }
  .配置区, .视频工具栏, .视频区, .提示词区 { padding-inline: 20px; }
  .基础设置区 { padding-inline: 18px; }
}
@media (max-height: 600px) { :root { --提示栏: 178px; } }

button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:transparent}
button:disabled,select:disabled{opacity:.4;cursor:default}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--强调);outline-offset:3px}
select{color-scheme:dark;background:transparent;border:0;font-size:12px;cursor:pointer;padding:4px 20px 4px 4px}
select option{background:#242529;color:#ddd}
.工作区.编辑中{grid-template-rows:var(--视频工具栏) minmax(0,1fr) minmax(0,min(var(--提示栏),calc(100% - var(--视频工具栏) - 40px)))}
.工作区.编辑中:has(.有引用){--提示栏:324px}
.工作区.编辑中:has(.有帧绑定){--提示栏:300px}
.工作区.编辑中:has(.有引用.有帧绑定){--提示栏:364px}
.工作区.编辑中.提示词展开:has(.提示词区){--提示栏:min(620px,76dvh)}
.工作区.基础展开{grid-template-columns:minmax(0,1fr) var(--基础栏)}
.项目行,.新建行{display:flex;align-items:center;gap:17px;min-width:0;min-height:26px;font-size:12px}
.项目行 label{color:#b8afa7;white-space:nowrap}
.项目行 select{max-width:450px;min-width:180px;text-overflow:ellipsis}
.文字按钮{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:4px 0;font-size:12px;color:#bcb4ab;white-space:nowrap}
.文字按钮:hover:not(:disabled){color:#f0d4b7}
.文字按钮 svg{flex-shrink:0;vertical-align:middle}
.强调文字{color:var(--强调)}
.行分隔{width:1px;height:13px;background:var(--描边);margin-inline:3px}
.新建行 .占位说明{margin-left:auto;font-size:10px;white-space:nowrap}
.区域眉题{display:flex;align-items:center;gap:18px;margin-bottom:21px;position:relative;z-index:1;pointer-events:none}
.操作提示{font-size:12px;line-height:1.6;color:#c4ad92;position:relative;z-index:2;margin:0 0 16px;padding:9px 0;display:flex;gap:16px;align-items:center}
.错误提示{color:#e3aa95}
.保存失败通知{position:fixed;z-index:40;top:calc(var(--顶栏) + 10px);right:24px;max-width:min(600px,calc(100% - 48px));padding:14px 18px;background:#322b29;border:1px solid #936f5d;border-radius:8px;box-shadow:0 8px 30px #0005;color:#eed1bf;font-size:12px;line-height:1.6;overflow-wrap:anywhere}
.保存失败通知 strong{font-weight:500}
.保存失败通知 p{margin:3px 0 9px;color:#c7afa2}
.保存失败操作{display:flex;gap:22px;justify-content:flex-end}
.保存失败操作 .文字按钮{font-size:12px}
.生成失败通知{position:fixed;z-index:40;top:calc(var(--顶栏) + 10px);right:24px;width:min(460px,calc(100% - 48px));max-height:calc(100dvh - var(--顶栏) - 32px);overflow:auto;padding:16px 20px;background:#322b29;border:1px solid #936f5d;border-radius:8px;box-shadow:0 8px 30px #0005;color:#eed1bf;font-size:13px;line-height:1.7;overflow-wrap:anywhere}
.生成失败通知 strong{display:block;padding-right:24px;font-weight:500}
.生成失败通知 p{margin:8px 0 10px;white-space:pre-wrap}
.关闭生成提示{position:absolute;top:12px;right:12px;padding:4px}
.卡片生成错误{margin:0;padding:0 14px 12px;color:#e3aa95;font-size:12px;line-height:1.6;overflow-wrap:anywhere;white-space:pre-wrap}
.创作网格{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,330px),1fr));gap:24px;padding-bottom:12px}
.创作卡片{position:relative;min-width:0;width:100%;max-width:400px;display:block;text-align:left;padding:0;background:#202125bd;border-radius:8px;overflow:hidden;box-shadow:0 5px 18px #0002;cursor:pointer}
.卡片编辑{display:block;width:100%;padding:0;text-align:left}
.成片预览{position:relative;overflow:hidden;background:#16171a}
.成片预览 video{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;background:#16171a;pointer-events:none}
.成片选择{position:absolute;inset:0;width:100%;height:100%;padding:0;cursor:pointer}
.成片播放按钮{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#17191bc9;color:#f5e8d8;box-shadow:0 2px 16px #0005;opacity:0;pointer-events:none;transition:opacity .15s,background .15s}
.成片播放按钮:hover{background:#323031e6}
.成片播放按钮:focus-visible,.成片控制条 button:focus-visible{outline:2px solid #d8b48f;outline-offset:3px}
.成片控制条{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;gap:12px;padding:30px 12px 9px;background:linear-gradient(transparent,#08090bc7);opacity:0;pointer-events:none;transition:opacity .15s;color:#eee}
.成片控制条 .成片进度{position:absolute;left:12px;top:18px;width:calc(100% - 24px);height:3px;padding:0;margin:0;accent-color:#d8b48f;cursor:pointer}
.成片控制条 .成片时间{font-size:10px;color:#e0d9d2;font-variant-numeric:tabular-nums;margin-right:auto}
.成片控制条 button{width:24px;height:24px;display:grid;place-items:center;padding:0}
.成片预览:hover .成片播放按钮,.成片预览:has(:focus-visible) .成片播放按钮,.成片预览:hover .成片控制条,.成片预览:has(:focus-visible) .成片控制条{opacity:1;pointer-events:auto}
.成片预览:fullscreen{width:100%;height:100%;aspect-ratio:auto}
.成片预览 .成片播放错误{position:absolute;left:10px;right:10px;bottom:52px;text-align:center;font-size:11px;color:#f0c1ad;pointer-events:none}
@media(hover:none){.成片播放按钮,.成片控制条{opacity:1;pointer-events:auto}}
.任务状态{position:absolute;top:10px;left:12px;max-width:75%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;color:#e4d2be;background:#17181cbb;padding:3px 7px;border-radius:4px;pointer-events:none}
.卡片画面{position:relative}
.生成状态层{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:30px 24px;pointer-events:none;text-align:center;color:#e5c5a3;background:radial-gradient(ellipse at center,#d1aa7f0c,transparent 70%)}
.生成状态层 strong{font-size:16px;font-weight:500;letter-spacing:1px}
.生成阶段{font-size:12px;color:#b5a89b;line-height:1.7;overflow-wrap:anywhere}
.排队位置{display:block;margin-top:4px;color:#988b7e}
.生成转圈{width:24px;height:24px;border:2px solid #d8b48f25;border-top-color:#d8b48f;border-radius:50%;animation:生成旋转 1.2s linear infinite}
.等待状态 .生成转圈{border-style:dotted;animation-duration:3s}
@keyframes 生成旋转{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.生成转圈{animation:none}}
.提示词底栏 .未接入提示{max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.卡片删除{position:absolute;right:8px;top:8px;z-index:1;width:24px;height:24px;padding:5px;color:#b8b3ac;opacity:.7;display:grid;place-items:center}
.卡片删除:hover:not(:disabled){opacity:1;color:#f2c7ad}
.创作卡片.已选{outline:1px solid #dcb28b99;outline-offset:2px}
.创作卡片:hover{background:#28292dbd}
.创作预览{aspect-ratio:16/9;display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:center;color:#a493815e;background:linear-gradient(135deg,#34302b4d,#1c202733)}
.创作预览 span{font-size:10px;color:#8e8377}
.创作信息{display:flex;align-items:center;flex-wrap:wrap;gap:4px 9px;min-height:44px;padding:9px 14px;font-size:12px;color:#b5afa8;white-space:nowrap}
.创作信息 strong{font-weight:400;color:#ded4c9;flex-shrink:0}
.创作方式{min-width:0;overflow:hidden;text-overflow:ellipsis}
.画幅信息,.时长信息{flex-shrink:0}
.生成耗时{flex-basis:100%;font-size:11px;color:#a49a8d}
.卡片生成{margin-left:auto;flex-shrink:0;font-size:12px;color:#dcb28b}
.提示词工具栏{display:flex;align-items:center;gap:20px;width:100%;min-height:24px;flex-shrink:0;font-size:11px;color:#827e79}
.提示词工具栏 .文字按钮{font-size:12px;gap:6px}
.提示词工具栏 .当前编辑{margin-left:8px;color:#aca398}
.保存状态{font-size:10px;color:#8e9a8b}
.提示词工具栏 .展开提示词{margin-left:auto}
.文件选择{display:none}
.提示词正文{display:flex;flex:1;flex-direction:column;gap:12px;min-height:0;overflow-y:auto;scrollbar-width:thin}
.提示词编辑框{position:relative;flex:1;min-height:120px}
.提示词着色,.提示词区 textarea{position:absolute;inset:0;width:100%;height:100%;resize:none;border:0;background:transparent;line-height:1.7;font-size:13px;padding:2px 0;font-family:inherit;letter-spacing:normal;white-space:pre-wrap;overflow-wrap:break-word;word-break:normal;overflow:auto;scrollbar-gutter:stable;scrollbar-width:thin}
.提示词着色{pointer-events:none;color:#e1ddd7;scrollbar-color:transparent transparent}
.提示词着色 mark{color:#f1c795;background:#af815331;border-radius:3px;text-decoration:underline;text-decoration-color:#c59a6270;text-underline-offset:3px}
.提示词区 textarea{color:transparent;caret-color:#f0e7dc}
.提示词区 textarea::selection{color:transparent;background:#a880554d}
.提示词区 textarea::placeholder{color:#77767b}
.提示词底栏{display:flex;align-items:center;gap:14px;min-width:0;min-height:34px;flex-shrink:0;white-space:nowrap;font-size:11px;color:#b9b1a8}
.提示词选项{display:flex;align-items:center;gap:14px;flex:1;min-width:0;overflow-x:auto;scrollbar-width:thin;padding:3px 0}
.提示词选项:focus-visible{outline:1px solid var(--强调);outline-offset:2px}
.生成选择{display:inline-flex;align-items:center;gap:5px;flex-shrink:0}
.生成选择 svg{color:#a79a8d;flex-shrink:0}
.生成选择 select{font-size:12px;padding:4px 14px 4px 0;max-width:124px}
.画质选择{gap:8px}
.时长入口{font-size:12px;gap:8px;padding:4px 0}
.时长弹层{position:fixed;transform:translateY(-100%);z-index:40;width:240px;padding:16px 18px;border-radius:9px;background:#2b2b2e;box-shadow:0 10px 36px #0007;color:#d7cec4;font-size:12px}
.时长标题,.时长刻度{display:flex;align-items:center;justify-content:space-between}
.时长标题 strong{font-weight:500;color:#e5bb93}
.时长弹层 input[type=range]{display:block;width:100%;height:20px;margin:15px 0 5px;padding:0;accent-color:#dcb28b;cursor:pointer}
.时长刻度{font-size:10px;color:#a79b8e}
.时长弹层 p{margin:12px 0 0;font-size:10px;color:#a79b8e}
.画质选择 select:disabled{opacity:.65}
.未接入提示{margin-left:auto;font-size:10px;color:#77726c}
.提示词生成{font-size:13px;color:#e5bb93;flex-shrink:0;gap:8px;padding:5px 0 5px 12px}
.引用素材行{display:flex;align-items:center;gap:8px;min-height:42px;flex-shrink:0;overflow-x:auto;padding:2px 0}
.引用缩略图{width:52px;height:38px;border-radius:4px;position:relative;display:grid;place-items:center;flex-shrink:0;background:#35332f;color:#bca68d;overflow:hidden}
.引用缩略图 img,.引用缩略图 video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.引用缩略图>span{position:absolute;bottom:0;left:0;right:0;background:#181818b3;color:#d5cbbf;font-size:9px;line-height:13px;padding:0 3px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.引用缩略图 button{position:absolute;top:1px;right:1px;width:15px;height:15px;padding:2px;border-radius:50%;background:#171717b8;color:#eee;display:grid;place-items:center}
.素材错误{margin:0;color:#e3aa95;font-size:11px;flex-shrink:0;max-height:30px;overflow:auto}
.素材选择器{position:absolute;left:28px;bottom:calc(100% + 10px);width:360px;max-width:calc(100% - 56px);max-height:min(360px,calc(100dvh - 340px));display:flex;flex-direction:column;gap:10px;padding:16px;border-radius:10px;background:#29292cf7;box-shadow:0 12px 48px #0007;font-size:12px}
.素材选择标题{display:flex;align-items:center;justify-content:space-between;color:#d5c8ba}
.素材选择器 input{border:0;border-radius:4px;background:#202124;color:#ddd;padding:8px 10px;font-size:12px;width:100%}
.素材选择器>p{font-size:11px;color:#a19a92;line-height:1.7;margin:4px 0}
.素材选项列表{display:flex;flex-direction:column;gap:4px;overflow:auto;min-height:0}
.素材选项列表>button{display:flex;align-items:center;gap:10px;text-align:left;padding:7px;border-radius:5px;min-height:50px;flex-shrink:0;color:#c6beb4}
.素材选项列表>button:hover,.素材选项列表>button.当前选项{background:#3a3835}
.素材选项列表 img{width:42px;height:34px;object-fit:cover;border-radius:3px;flex-shrink:0}
.素材选项列表>button>svg:first-child{margin:0 10px;flex-shrink:0}
.素材选项名称{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.素材选项名称 small{display:block;color:#89837d;font-size:9px;margin-top:4px}
.项目遮罩{position:fixed;inset:0;z-index:50;background:#0b0c0eaa;backdrop-filter:blur(6px);display:grid;place-items:center;padding:24px}
.项目弹窗{width:440px;max-width:100%;background:#242529;border:1px solid var(--描边);border-radius:12px;padding:30px;box-shadow:0 20px 90px #0006}
.项目弹窗 h2{font-size:21px;font-weight:400;margin:0 0 25px}
.项目弹窗 label{display:block;font-size:12px;color:#b7aea5;margin-bottom:10px}
.项目弹窗 input{width:100%;background:#1d1e21;border:1px solid #ffffff20;border-radius:5px;padding:10px 12px;font-size:14px}
.项目弹窗 p{font-size:11px;color:#96908a;line-height:1.7;margin:14px 0 0}
.项目弹窗 p.错误提示{color:#e3aa95}
.项目弹窗 .项目目录{overflow-wrap:anywhere;color:#726d68;margin-top:5px}
.弹窗操作{display:flex;justify-content:flex-end;gap:28px;margin-top:26px}
.删除确认弹窗 p{font-size:14px;color:#c1b9b0;line-height:1.8}
.删除确认弹窗 .文字按钮{font-size:13px;padding-block:6px}
.素材库打开>.视频工具栏,.素材库打开>.视频区,.素材库打开>.提示词区,.素材库打开>.基础设置区{visibility:hidden}
.素材库面板{position:absolute;inset:0;z-index:20;display:grid;grid-template-rows:72px minmax(0,1fr);min-width:0;min-height:0;overflow:hidden;background:#1b1c1f}
.素材库顶栏{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 28px;border-bottom:1px solid var(--描边);min-width:0;min-height:64px}
.素材库标题{display:flex;align-items:baseline;gap:18px;min-width:0}
.素材库标题 h2{font-size:19px;font-weight:500;letter-spacing:1px;white-space:nowrap}
.素材库标题>span{font-size:11px;color:#88827b;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.素材库顶栏 .文字按钮{flex-shrink:0}
.素材库内容{min-height:0;overflow:auto;padding:25px 28px}
.素材库网格{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr));gap:25px 20px}
.素材展示项{position:relative;min-width:0}
.素材展示卡{display:block;width:100%;min-width:0;text-align:left;padding:0;color:#c5bdb3}
.素材删除按钮{position:absolute;right:6px;top:6px;z-index:2;width:27px;height:27px;padding:0;display:grid;place-items:center;border-radius:50%;background:#17181bbd;color:#d4ccc3;cursor:pointer}
.素材删除按钮:hover{background:#3e2727e6;color:#ffccc1}
.素材删除按钮:focus-visible{outline:2px solid #d8b48f;outline-offset:2px}
.播放提示{position:absolute;bottom:6px;left:28px;right:28px;text-align:center;color:#d5b597;font-size:12px;pointer-events:none}
.素材库消息,.素材库错误{margin:0 0 18px;font-size:12px;line-height:1.7;color:#c7ae93}
.素材库错误{color:#e6a89a}
.素材上传按钮{font-size:12px;color:#d7b28c}
.素材展示画面{position:relative;aspect-ratio:16/10;display:grid;place-items:center;background:#25262a;border-radius:6px;overflow:hidden;color:#aa9682}
.素材展示画面 img,.素材展示画面 video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.素材展示卡:hover .素材展示画面{background:#2d2c2d}
.素材展示卡:hover .素材展示名称{color:#e9c6a2}
.素材展示名称{display:block;padding:11px 78px 3px 1px;font-size:12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.视频播放标记{display:grid;place-items:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:38px;height:38px;border-radius:50%;background:#17181bc7;color:#e3d4c2}
.音频封面{background:linear-gradient(140deg,#302c2a,#22262b)}
.素材预览失败{display:grid;gap:10px;place-items:center;font-size:11px;color:#8d8276}
.素材库空态{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#8d8378;text-align:center;padding:24px}
.素材库空态 p{margin:6px 0 0;font-size:14px;color:#afa49a}
.素材库空态>span{font-size:11px;color:#756f68}
.素材放大预览{position:absolute;inset:0;z-index:1;display:grid;grid-template-rows:64px minmax(0,1fr);background:#17181b;min-height:0;min-width:0}
.素材放大预览 h3{font-size:13px;font-weight:400;margin:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.媒体查看区{min-height:0;min-width:0;display:flex;align-items:center;justify-content:center;padding:22px 28px;overflow:hidden;container-type:size}
.素材预览框{position:relative;display:flex;align-items:center;justify-content:center;width:min(100cqw,calc(100cqh * var(--素材比例)));height:min(100cqh,calc(100cqw / var(--素材比例)));max-width:100%;max-height:100%}
.素材预览框.音频预览框{width:min(520px,100%);height:auto;padding-top:38px}
.关闭素材预览{position:absolute;z-index:2;top:8px;right:8px;width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:#17181bbf;color:#fff;cursor:pointer}
.关闭素材预览:hover{background:#17181be6;color:#f5c99e}
.关闭素材预览:focus-visible{outline:2px solid #d8b48f;outline-offset:2px}
.放大图片,.素材预览框>video{display:block;width:100%;height:100%;min-height:0;object-fit:contain}
.音频播放器{display:flex;flex-direction:column;align-items:center;gap:26px;width:min(520px,100%);color:#d3b392}
.音频播放器>span{font-size:14px;color:#d1c4b6;max-width:100%;overflow-wrap:anywhere;text-align:center}
.音频播放器 audio{width:min(520px,100%);max-width:100%;min-width:240px;color-scheme:dark}
.媒体预览错误{font-size:13px;color:#c9ad93;line-height:1.8;max-width:520px;text-align:center}
@media(max-width:720px){.素材库顶栏{padding-inline:20px;gap:15px}.素材库标题{gap:12px}.素材库标题 h2{font-size:17px}.素材库内容{padding:20px}.素材库网格{gap:18px 14px}.媒体查看区{padding:16px}}
@media(max-width:1000px){.创作网格{gap:16px}}
@media(max-height:760px){.创作卡片{max-width:320px}}
@media(max-width:720px){.新建行 .占位说明{display:none}.项目行,.新建行{gap:12px}.项目行 select{min-width:130px;max-width:220px}.提示词工具栏{gap:12px}.提示词工具栏 .保存状态{display:none}.提示词底栏{gap:10px}.未接入提示{display:none}.提示词生成{margin-left:auto}.提示词底栏 .行分隔{display:none}}

/* 首尾帧仅增加明确用途的选择，不按图片顺序自动绑定。 */
.首尾帧绑定{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:4px 0 8px;color:#b8ada1;font-size:12px}
.首尾帧绑定 label{display:flex;align-items:center;gap:8px;min-width:0}
.首尾帧绑定 select{max-width:200px;background:transparent;color:inherit;border:0;font:inherit;cursor:pointer}
.首尾帧绑定 option{background:#262626;color:#ddd}
.首尾帧绑定>span{font-size:11px;color:#8b837b}
.生成图片预览{position:relative;aspect-ratio:16/9;background:#141518}
.生成图片预览>.卡片编辑{height:100%;display:grid;place-items:center;color:#bcb3a7}
.生成图片预览>.卡片编辑 img{display:block;width:100%;height:100%;object-fit:contain;min-height:0}
.图片放大入口{position:absolute;right:12px;bottom:12px;padding:7px;border-radius:6px;background:#15171dcc;color:#ecebe7;opacity:0}
.生成图片预览:hover .图片放大入口,.生成图片预览:focus-within .图片放大入口{opacity:1}
.生图查看窗口{position:fixed;inset:0;margin:auto;width:94vw;height:92vh;max-width:none;max-height:none;padding:36px 16px 30px;background:#17181b;border:0;color:#ddd}
.生图查看窗口::backdrop{background:#000c}
.生图查看窗口>img{display:block;width:100%;height:calc(100% - 24px);object-fit:contain}
.生图查看窗口>p{text-align:center;font-size:12px;color:#bdb3a7}
.原图关闭{position:absolute;right:14px;top:10px;padding:4px}
.生图基础设置{font-size:12px;line-height:1.7}
.生图基础设置 label{display:block;margin-top:18px}
.生图基础设置 input{display:block;width:100%;margin-top:6px;padding:8px;background:#202124;border:1px solid #ffffff18;border-radius:4px;color:#ecebe7}
