/* ============ 字幕样式：选择器 ============ */
.caption-picker { border:0;padding:0;margin:12px 0;min-width:0; }
.caption-picker legend { font-size:14px;font-weight:650;margin-bottom:8px;display:flex;align-items:center;gap:10px;width:100%; }
.caption-picker .cs-more { font-size:12px;font-weight:400;margin-left:auto; }
.caption-choices { display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;max-height:460px;overflow:auto;padding:2px; }
.caption-choice { display:grid;grid-template-columns:18px 1fr;gap:5px 8px;padding:10px;border:1px solid var(--line);border-radius:10px;cursor:pointer;min-width:0;background:var(--bg-2); }
.caption-choice:hover { border-color:var(--line-2); }
.caption-choice:has(input:checked) { border-color:var(--accent,#7875f5);box-shadow:0 0 0 1px var(--accent,#7875f5); }
.caption-choice:focus-within { outline:2px solid var(--accent,#7875f5);outline-offset:2px; }
.caption-choice input { width:15px;height:15px;margin:3px 0;accent-color:var(--accent,#7875f5); }
.caption-choice strong { font-size:13px;grid-column:2; }
.caption-choice small { color:var(--muted);font-size:11px;line-height:1.5;grid-column:2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden; }
.caption-sample { grid-column:2;grid-row:1;display:block;aspect-ratio:16/9;width:100%;border-radius:6px;overflow:hidden; }
.caption-sample.auto-sample { display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--accent-soft,#2a2f55),var(--bg-3));color:var(--accent);font-weight:800;font-size:18px;letter-spacing:.1em; }
.caption-choice.auto { align-content:start; }
.cs-own { font-style:normal;font-size:10.5px;font-weight:500;color:var(--accent);border:1px solid currentColor;border-radius:4px;padding:0 4px;margin-left:4px; }
.caption-sync { border-top:1px solid var(--line);margin-top:12px;padding-top:4px; }
.caption-style-details { width:100%;margin:8px 0; }
.caption-style-details summary { cursor:pointer;font-size:13px; }

/* ============ 预览舞台（与成片同比例的“口播画面”） ============ */
.cps-stage { position:relative;overflow:hidden;width:100%;aspect-ratio:16/9;container-type:inline-size;
  background: radial-gradient(120% 80% at 70% 0%, rgba(255,190,130,.20), transparent 55%),
              radial-gradient(90% 70% at 10% 100%, rgba(80,140,255,.18), transparent 60%),
              linear-gradient(160deg,#4a5260 0%,#262b34 52%,#101217 100%); }
.cps-stage[data-aspect="9:16"] { aspect-ratio:9/16; }
.cps-stage[data-aspect="1:1"] { aspect-ratio:1/1; }
.cps-project-image { position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none; }
.cps-project-empty { position:absolute;inset:12% 8% 35%;display:flex;align-items:center;justify-content:center;text-align:center;color:#e3e8f1;font-size:12px;line-height:1.6; }
.cps-project-note { position:absolute;right:8px;top:8px;max-width:65%;padding:2px 6px;background:rgba(0,0,0,.55);color:#fff;font-size:10px;line-height:1.5;border-radius:4px;z-index:3;pointer-events:none; }
.cps-project-note.cps-note-bottom { top:auto;bottom:8px; }
.cps-project-image[hidden],.cps-project-empty[hidden],.cps-project-note[hidden] { display:none!important; }
.cs-project-row { display:flex;align-items:center;flex-wrap:wrap;gap:8px 16px;margin:12px 0; }
.cs-project-row label { display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;white-space:nowrap; }
.cs-project-row select { max-width:360px;min-width:160px; }
.cps-cap { position:absolute;display:flex;justify-content:center;align-items:center;text-align:center;white-space:nowrap;line-height:1.25;
  font-family:"PingFang SC","Noto Sans SC","Noto Sans CJK SC","Microsoft YaHei",system-ui,sans-serif;will-change:opacity,transform;z-index:2; }
.cps-line { display:inline-flex;align-items:baseline;white-space:nowrap;box-sizing:border-box; }
.cps-line .w { display:inline-block;transform-origin:50% 80%; }

/* ============ 样式库 ============ */
.cs-toolbar { display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;margin-bottom:6px; }
.cs-toolbar .chips { margin:0;flex:1 1 420px; }
.cs-tools { display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-left:auto; }
.cs-search { display:flex;align-items:center;gap:6px;background:var(--bg-3);border:1px solid var(--line);border-radius:8px;padding:0 10px;height:32px;color:var(--dim); }
.cs-search input { border:0;background:transparent;outline:0;color:var(--ink);width:170px;padding:0;height:30px; }
.cs-tools .seg span { cursor:pointer; }
.cs-rule { font-size:12.5px;margin:6px 0 14px; }
.cs-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(272px,1fr));gap:16px; }
.cs-grid.tall { grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); }
.cs-card { background:var(--bg-2);border:1px solid var(--line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;transition:border-color .15s,box-shadow .15s,transform .15s; }
.cs-card:hover { border-color:var(--line-2);box-shadow:0 8px 28px rgba(0,0,0,.18);transform:translateY(-1px); }
.cs-stage-wrap { position:relative; }
.cs-badge { position:absolute;left:10px;top:10px;font-size:11px;padding:2px 8px;border-radius:999px;background:rgba(0,0,0,.45);color:#fff;backdrop-filter:blur(6px);z-index:3; }
.cs-badge.own { background:var(--accent-2,#5b6cff); }
.cs-body { padding:12px 14px 14px;display:flex;flex-direction:column;gap:6px;flex:1; }
.cs-nm { display:flex;align-items:baseline;gap:8px; }
.cs-nm strong { font-size:15px;font-weight:650; }
.cs-nm code { font-size:11px;color:var(--dim);background:var(--bg-3);padding:1px 6px;border-radius:4px; }
.cs-ds { color:var(--muted);font-size:12.5px;line-height:1.55;min-height:2.9em; }
.cs-meta { display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:11.5px;color:var(--muted); }
.cs-meta > span:not(.cs-sw) { background:var(--bg-3);border-radius:5px;padding:1px 7px; }
.cs-sw { display:inline-flex;gap:3px;margin-right:2px; }
.cs-sw i { width:14px;height:14px;border-radius:4px;border:1px solid var(--line-2);display:inline-block; }
.cs-tags { display:flex;flex-wrap:wrap;gap:5px; }
.cs-tags span { font-size:11px;color:var(--dim); }
.cs-tags span::before { content:"#"; opacity:.6; }
.cs-acts { display:flex;gap:6px;margin-top:auto;padding-top:6px;flex-wrap:wrap; }
.cs-acts .btn { flex:1 1 auto;justify-content:center; }

/* ============ 编辑器 ============ */
.cs-ed-head { display:flex;align-items:flex-start;gap:14px;margin-bottom:16px;flex-wrap:wrap; }
.cs-ed-head h2 { margin:0;font-size:17px;font-weight:650; }
.cs-ed-head .sub { color:var(--muted);font-size:12.5px;margin-top:3px; }
.cs-ed-btns { margin-left:auto;display:flex;gap:8px; }
.cs-dirty { color:var(--warn,#f0b429);font-size:12px;align-self:center; }
.cs-ed-layout { display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,440px);gap:20px;align-items:start; }
.cs-ed-fields { display:flex;flex-direction:column;gap:12px;min-width:0; }
.cs-sec { border:1px solid var(--line);background:var(--bg-2);border-radius:12px;padding:12px 16px 14px;margin:0;min-width:0; }
.cs-sec legend { font-weight:650;font-size:13.5px;padding:0 6px;display:flex;align-items:center;gap:8px; }
.cs-sec legend em { font-style:normal;font-weight:400;color:var(--dim);font-size:12px; }
.cs-sec legend .n { width:20px;height:20px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:inline-flex;align-items:center;justify-content:center;font-size:11.5px; }
.cs-g2, .cs-g3 { display:grid;gap:12px 14px;align-items:end; }
.cs-g2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.cs-g3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.cs-g2 .full, .cs-g3 .full { grid-column:1/-1; }
.cs-sec label .lb em { font-style:normal;color:var(--dim);margin-left:6px; }
.cs-sec input[type=text], .cs-sec select { width:100%;box-sizing:border-box; }
.cs-color .cs-cin { display:flex;gap:6px;align-items:center; }
.cs-color input[type=color] { width:36px;height:32px;padding:2px;border:1px solid var(--line-2);border-radius:7px;background:var(--bg-3);cursor:pointer;flex:none; }
.cs-color input[type=text] { font-family:ui-monospace,Menlo,monospace;font-size:12px;text-transform:uppercase; }
.cs-range input { width:100%;accent-color:var(--accent-2); }
.cs-range .lb { display:flex;justify-content:space-between; }
.cs-range .lb em { font-family:ui-monospace,Menlo,monospace; }
.cs-checks { display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;min-height:32px; }
.cs-check { display:inline-flex;align-items:center;gap:6px;font-size:13px;cursor:pointer;white-space:nowrap; }
.cs-sec label.off { opacity:.4;pointer-events:none; }
.cs-grad[hidden] { display:none!important; }
.cs-grad:not([hidden]) { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 14px; }
.cs-quick { display:flex;flex-wrap:wrap;gap:6px; }
.cs-q { border:1px solid var(--line-2);background:var(--bg-3);color:var(--ink);border-radius:999px;padding:4px 11px;font-size:12px;cursor:pointer; }
.cs-q:hover { border-color:var(--accent);color:var(--accent); }
.cs-anims { display:flex;flex-direction:column;gap:8px; }
.cs-ag { display:flex;flex-wrap:wrap;gap:6px;align-items:center; }
.cs-ag > span { width:72px;color:var(--dim);font-size:12px;flex:none; }
.cs-anim { position:relative;cursor:pointer; }
.cs-anim input { position:absolute;opacity:0;pointer-events:none; }
.cs-anim b { display:inline-block;font-weight:500;font-size:12.5px;padding:5px 11px;border-radius:8px;border:1px solid var(--line-2);background:var(--bg-3); }
.cs-anim input:checked + b { border-color:var(--accent);background:var(--accent-soft);color:var(--ink);box-shadow:0 0 0 1px var(--accent); }
.cs-anim input:focus-visible + b { outline:2px solid var(--accent);outline-offset:2px; }
.cs-pos { display:flex;gap:10px;flex-wrap:wrap; }
.cs-posopt { display:flex;flex-direction:column;align-items:center;gap:6px;font-size:12.5px;cursor:pointer;padding:8px 14px;border:1px solid var(--line-2);border-radius:10px;background:var(--bg-3); }
.cs-posopt:has(input:checked) { border-color:var(--accent);box-shadow:0 0 0 1px var(--accent); }
.cs-posopt input { position:absolute;opacity:0;pointer-events:none; }
.cs-posopt i { width:54px;height:32px;border-radius:4px;background:linear-gradient(160deg,#4a5260,#14171d);position:relative; }
.cs-posopt i::after { content:"";position:absolute;left:18%;right:18%;height:4px;border-radius:2px;background:#fff; }
.cs-posopt i.p-bottom::after { bottom:5px; } .cs-posopt i.p-middle::after { top:14px; } .cs-posopt i.p-top::after { top:5px; }
.cs-ed-preview { position:sticky;top:12px;background:var(--bg-2);border:1px solid var(--line);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:10px; }
.cs-pv-head { display:flex;align-items:center;gap:10px; }
.cs-pv-head .seg span { cursor:pointer; }
.cs-pv-head .btn { margin-left:auto; }
.cs-pv-box { display:flex;justify-content:center;background:#07080a;border-radius:8px;overflow:hidden; }
.cs-pv-box > div { width:100%; }
.cs-pv-box > .cps-stage[data-aspect="9:16"] { width:min(100%,260px); }
.cs-pv-box > .cps-stage[data-aspect="1:1"] { width:min(100%,360px); }
.cs-sample input { width:100%;box-sizing:border-box; }
.cs-sample .lb em { font-style:normal;color:var(--dim);margin-left:6px; }
.cs-spec-row { display:grid;grid-template-columns:auto 1fr auto 1fr;gap:4px 10px;font-size:12px;color:var(--muted); }
.cs-spec-row b { color:var(--ink);font-weight:500; }
.cs-spec .hint { font-size:12px;margin:6px 0 0; }

@media (max-width: 1100px) { .cs-ed-layout { grid-template-columns:1fr; } .cs-ed-preview { position:static;order:-1; } }
@media (max-width: 700px) {
  .cs-g3 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cs-g2 { grid-template-columns:1fr; }
  .cs-tools { margin-left:0;width:100%; } .cs-search { flex:1; } .cs-search input { width:100%; }
  .caption-choices { grid-template-columns:repeat(2,minmax(0,1fr)); } .caption-choice { padding:8px;gap:4px; }
}
@media (prefers-reduced-motion: reduce) { .cs-card, .cs-card:hover { transition:none;transform:none; } }