/* =========================================================
   视图样式：总览 / 创作空间 / 链路页 / 生成台 / 剪辑 / 资产 / 交付 / 设置 / 抽屉 / 账号对话框
   ========================================================= */

/* ---------- 总览 ---------- */
body[data-zone="overview"] .view-root {
  position: relative;
  background:
    radial-gradient(760px 320px at 16% 0%, rgba(15, 23, 42, .055), transparent 62%),
    radial-gradient(820px 420px at 92% 10%, rgba(15, 23, 42, .055), transparent 62%),
    linear-gradient(180deg, rgba(252, 252, 252, .98), rgba(242, 243, 245, .98));
  overflow-x: hidden;
}
body[data-zone="overview"] .view-root::before,
body[data-zone="overview"] .view-root::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}
body[data-zone="overview"] .view-root::before {
  background:
    linear-gradient(90deg, rgba(15, 23, 42, .040) 1px, transparent 1px),
    linear-gradient(0deg, rgba(15, 23, 42, .034) 1px, transparent 1px),
    linear-gradient(112deg, transparent 0 42%, rgba(255, 255, 255, .72) 48%, transparent 56% 100%);
  background-size: 84px 84px, 84px 84px, 360px 100%;
  opacity: .52;
  animation: overviewGridDrift 24s linear infinite;
}

/* ---------- 复合首页 / 数据看板 ---------- */
.overview-dashboard { max-width: 1480px; margin: 0 auto; }
.overview-dashboard-head { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin: 4px 0 14px; }
.overview-dashboard-head h1 { margin: 3px 0 0; font-size: clamp(22px, 2vw, 30px); letter-spacing: -.04em; }
.text-switch { display: flex; align-items: center; gap: 22px; min-height: 38px; }
.text-switch button { position: relative; border: 0; background: transparent; color: var(--muted); padding: 8px 1px; font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.text-switch button::after { content: ""; position: absolute; left: 50%; right: 50%; bottom: 2px; height: 1.5px; background: var(--text); transition: left .22s var(--ease), right .22s var(--ease); }
.text-switch button:hover, .text-switch button.is-active { color: var(--text); }
.text-switch button:hover::after, .text-switch button.is-active::after { left: 0; right: 0; }
.overview-dashboard-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 14px; align-items: start; }
.overview-dashboard-main { min-width: 0; }
.overview-dashboard-assistant { position: sticky; top: 76px; min-width: 0; }
.overview-dashboard-assistant .ov-chat { min-height: 560px; max-height: calc(100dvh - 104px); display: grid; grid-template-rows: auto minmax(0, 1fr) auto; }
.overview-summary-line { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: 4px 2px 12px; }
.overview-summary-line h2 { margin: 3px 0 0; font-size: 20px; }
.overview-summary-line p { color: var(--muted); font-size: 12px; margin: 0; }
.dashboard-kpis { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 9px; }
.dashboard-kpis .ov-stat { min-height: 104px; box-shadow: none; }
.overview-chart-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(240px, .7fr); gap: 10px; margin: 10px 0; }
.overview-chart-grid > .card { padding: 14px; min-height: 172px; }
.overview-pipeline { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; padding-top: 12px; }
.overview-pipeline button { border: 0; background: transparent; padding: 0; text-align: left; cursor: pointer; }
.overview-pipeline span { display: flex; flex-direction: column; gap: 2px; }
.overview-pipeline b { font-size: 24px; letter-spacing: -.04em; }
.overview-pipeline em { color: var(--muted); font-size: 11px; font-style: normal; }
.overview-pipeline i, .overview-platform-bars i { display: block; position: relative; height: 3px; margin-top: 12px; background: var(--hairline); overflow: hidden; }
.overview-pipeline i::after, .overview-platform-bars i::after { content: ""; position: absolute; inset: 0 auto 0 0; width: var(--value); background: var(--text); }
.overview-platform-bars { display: grid; gap: 19px; padding-top: 15px; }
.overview-platform-bars span { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.overview-platform-bars b { font-size: 18px; }
.overview-platform-bars i::after { background: #747982; }
.overview-delivery-board { padding: 14px; }
.overview-delivery-board .ov-recent-list { max-height: calc(100dvh - 290px); overflow: auto; }
.overview-analytics-host .analytics-page { padding: 0; }
.overview-analytics-host .da-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.analytics-page.is-embedded .da-table-card { margin-top: 10px; }
@media (max-width: 1120px) {
  .overview-dashboard-layout { grid-template-columns: minmax(0, 1fr); }
  .overview-dashboard-assistant { position: static; }
  .overview-dashboard-assistant .ov-chat { min-height: 360px; max-height: 520px; }
}
@media (max-width: 760px) {
  .overview-dashboard-head, .overview-summary-line { align-items: flex-start; flex-direction: column; }
  .dashboard-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .overview-chart-grid { grid-template-columns: 1fr; }
}
body[data-zone="overview"] .view-root::after {
  inset: 0 -12%;
  background:
    radial-gradient(circle at 14% 24%, rgba(15, 23, 42, .09) 0 2px, transparent 3px),
    radial-gradient(circle at 72% 18%, rgba(15, 23, 42, .09) 0 2px, transparent 3px),
    radial-gradient(circle at 84% 70%, rgba(15, 23, 42, .07) 0 2px, transparent 3px),
    linear-gradient(100deg, transparent 0 44%, rgba(15, 23, 42, .04) 47%, transparent 53% 100%);
  background-size: 360px 260px, 420px 300px, 390px 280px, 780px 100%;
  opacity: .72;
  animation: overviewSignalSweep 12s ease-in-out infinite alternate;
}

.app-update-notice { position: fixed; z-index: 240; top: 16px; left: 16px; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 10px; width: min(360px, calc(100vw - 32px)); padding: 11px 12px 11px 14px; border: 1px solid rgba(15,23,42,.16); border-radius: 10px; background: rgba(252,252,252,.94); box-shadow: 0 18px 44px rgba(15,23,42,.16); backdrop-filter: blur(18px); opacity: 0; transform: translateY(-10px); transition: opacity .2s var(--ease), transform .2s var(--ease); }
.app-update-notice.is-visible { opacity: 1; transform: translateY(0); }
.app-update-notice > div { min-width: 0; display: grid; gap: 2px; }
.app-update-notice b { font-size: 12px; }
.app-update-notice span { color: var(--muted); font-size: 10.5px; }
.app-update-notice [data-update-refresh] { min-height: 30px; padding: 0 11px; border: 0; border-radius: 7px; color: #fff; background: var(--ink); font-weight: 750; cursor: pointer; }

#lgApply.lg-secondary { position: absolute; right: 28px; top: 22px; padding: 9px 1px; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
#lgApply.lg-secondary:hover { background: transparent; }
.overview {
  position: relative; z-index: 1;
  display: flex; flex-direction: column; gap: 12px;
  max-width: 1180px; min-height: calc(100vh - 150px);
  margin: 0 auto;
}
@keyframes overviewGridDrift { to { background-position: 84px 84px, 84px 84px, 360px 0; } }
@keyframes overviewSignalSweep { from { transform: translate3d(-2%, 0, 0); opacity: .52; } to { transform: translate3d(2%, 0, 0); opacity: .82; } }
.ov-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(330px, 430px); align-items: stretch; gap: 18px; padding: 18px 20px; animation: fadeUp .4s var(--ease); }
.ovh-left { align-self: center; }
.ovh-left h2 { font-size: 20px; margin: 6px 0 6px; }
.ovh-left p { font-size: 12.5px; color: var(--muted); }
.ovh-right { display: flex; flex-direction: column; align-items: flex-end; justify-content: center; gap: 10px; min-width: 0; }
.ovh-right .btn.primary { align-self: flex-end; box-shadow: 0 16px 36px rgba(15, 23, 42, .16); }
.ov-agent-band {
  position: relative; display: flex; align-items: center; gap: 14px; text-align: left;
  background: linear-gradient(135deg, rgba(5, 7, 13, .88), rgba(17, 24, 39, .82) 68%, rgba(47, 128, 255, .26));
  border-radius: var(--r-lg); padding: 16px 18px; min-width: 380px;
  border: 1px solid rgba(255, 255, 255, .14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 18px 46px rgba(15, 23, 42, .18);
  backdrop-filter: blur(24px) saturate(1.2);
  -webkit-backdrop-filter: blur(24px) saturate(1.2);
  overflow: hidden; transition: all var(--t-med);
}
.ov-agent-band:hover { transform: translateY(-2px); box-shadow: 0 20px 48px rgba(15, 23, 42, .24); border-color: rgba(109, 168, 255, .38); }
.oab-glow { position: absolute; inset: -40%; background: radial-gradient(420px 200px at 80% 20%, rgba(47, 128, 255, .26), transparent 60%), radial-gradient(380px 200px at 15% 90%, rgba(255, 255, 255, .18), transparent 60%); pointer-events: none; }
.oab-avatar { position: relative; filter: drop-shadow(0 6px 16px rgba(47, 128, 255, .38)); }
.oab-text { position: relative; flex: 1; }
.oab-text b { color: #fff; font-size: 14.5px; display: block; }
.oab-text em { font-style: normal; color: var(--d-muted); font-size: 11.5px; }
.oab-go { position: relative; color: #fff; font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; gap: 4px; background: rgba(255, 255, 255, .12); border-radius: 99px; padding: 6px 12px; transition: background var(--t-fast); }
.ov-agent-band:hover .oab-go { background: rgba(255, 255, 255, .2); }

.ov-stats { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; }
.ov-stat { padding: 13px 14px; text-align: left; transition: all var(--t-fast); animation: fadeUp .4s var(--ease) backwards; }
.ov-stat:nth-child(2) { animation-delay: 40ms; } .ov-stat:nth-child(3) { animation-delay: 80ms; }
.ov-stat:nth-child(4) { animation-delay: 120ms; } .ov-stat:nth-child(5) { animation-delay: 160ms; }
.ov-stat:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.ov-stat b { font-size: 24px; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; display: block; }
.ov-stat span { font-size: 12px; font-weight: 650; display: block; margin-top: 2px; }
.ov-stat em { font-style: normal; font-size: 10.5px; color: var(--faint); display: block; margin-top: 4px; }
.ov-stat.warn b { color: var(--warning); } .ov-stat.run b { color: var(--run); }
.ov-stat.review b { color: var(--info); } .ov-stat.fail b { color: var(--danger); }

.ov-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(330px, 430px); align-items: stretch; gap: 18px; }
.ov-cols {
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  gap: 12px;
  height: clamp(330px, calc(100vh - 500px), 460px);
  min-height: 0;
}
.ov-todo, .ov-recent { padding: 14px 16px 12px; display: flex; flex-direction: column; min-height: 0; }
.ov-todo-list, .ov-recent-list { display: flex; flex: 1; min-height: 0; flex-direction: column; gap: 2px; }
/* 限高滚动：不再无限向下撑开 */
.ov-scroll { max-height: none; overflow-y: auto; overflow-x: hidden; margin: 0 -6px; padding: 0 6px; }
.ov-scroll::-webkit-scrollbar { width: 6px; }
.ovt-row, .ovr-row {
  display: flex; align-items: center; gap: 10px; width: 100%;
  min-width: 0; max-width: 100%; overflow: hidden;
  min-height: 49px; padding: 7px 8px; border-radius: var(--r-md); text-align: left;
  border-bottom: 1px solid var(--hairline);
  transition: background var(--t-fast); cursor: pointer;
}
.ovt-row:last-child, .ovr-row:last-child { border-bottom: 0; }
.ovt-row:hover, .ovr-row:hover { background: var(--soft); }
.ovt-main { flex: 1 1 auto; min-width: 0; overflow: hidden; }
.ovt-main b { display: block; font-size: 12.5px; line-height: 1.25; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ovt-main em { display: block; margin-top: 4px; font-style: normal; font-size: 11px; line-height: 1.25; color: var(--faint); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ovt-row .status-pill, .ovr-row .status-pill, .shp-row .status-pill {
  flex: 0 0 auto !important;
  width: max-content !important;
  max-width: max-content;
  align-self: center;
  white-space: nowrap;
}
.ovr-cover { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; color: #fff; flex: none; overflow: hidden; background: var(--soft); border: 1px solid var(--hairline); }
.ovr-cover img { width: 100%; height: 100%; object-fit: cover; }
.ovr-cover.fallback { border: 0; background: var(--grad-brand); }
.ovr-row time { font-size: 10.5px; color: var(--faint); }
.ov-acc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(178px, 1fr)); gap: 7px; }
.ov-acc { display: flex; align-items: center; gap: 8px; padding: 7px 9px; border: 1px solid var(--hairline); border-radius: var(--r-sm); text-align: left; transition: all var(--t-fast); }
.ov-acc:hover { border-color: var(--line-2); box-shadow: var(--shadow-sm); transform: translateY(-1px); }
.ov-acc .ovt-main b { font-size: 12px; }
.ov-acc .ovt-main em { font-size: 10px; }
.ova-avatar { width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; color: #fff; font-weight: 700; font-size: 11.5px; flex: none; }

@keyframes fadeUp { from { opacity: 0; transform: translateY(8px); } }

/* ---------- 创作空间主页 ---------- */
.studio-home { display: flex; flex-direction: column; gap: 16px; max-width: 1100px; margin: 0 auto; }
.sh-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 20px 22px; flex-wrap: nowrap; }
.sh-id { display: flex; gap: 14px; align-items: flex-start; min-width: 0; flex: 1 1 auto; }
.sh-ref-stack { display: flex; flex-direction: column; gap: 8px; flex: none; }
.sh-ref-card {
  position: relative; width: 74px; height: 74px; border: 1px solid var(--hairline);
  border-radius: 18px; background: var(--surface); display: grid; place-items: center;
  overflow: hidden; box-shadow: var(--shadow-sm); color: var(--faint); transition: all var(--t-fast);
}
.sh-ref-card.avatar { width: 74px; height: 74px; }
.sh-ref-card.style { height: 82px; }
.sh-ref-card img, .sh-ref-card i { width: 100%; height: 100%; object-fit: cover; display: grid; place-items: center; color: #fff; font-size: 24px; font-style: normal; font-weight: 800; }
.sh-ref-card em { width: 100%; height: 100%; display: grid; place-items: center; background: var(--soft); color: var(--brand); font-style: normal; }
.sh-ref-card span {
  position: absolute; left: 6px; bottom: 6px; padding: 2px 6px; border-radius: 999px;
  background: rgba(10, 15, 30, .62); color: #fff; font-size: 10px; font-weight: 700;
}
.sh-ref-stack.can-edit .sh-ref-card { cursor: pointer; }
.sh-ref-stack.can-edit .sh-ref-card:hover, .sh-ref-stack.can-edit .sh-ref-card.drag-over { border-color: var(--brand); box-shadow: var(--ring); transform: translateY(-1px); }
.sh-avatar { width: 52px; height: 52px; border-radius: 16px; display: grid; place-items: center; color: #fff; font-size: 20px; font-weight: 800; flex: none; box-shadow: var(--shadow-sm); overflow: hidden; }
.sh-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sh-meta h2 { font-size: 18px; }
.sh-sub { display: flex; align-items: center; gap: 8px; margin-top: 5px; flex-wrap: wrap; }
.sh-pos { font-size: 12px; color: var(--muted); margin-top: 5px; max-width: 560px; }
.sh-actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; align-self: flex-start; flex: 0 0 auto; margin-left: auto; }
.sh-homepage-link { text-decoration: none; white-space: nowrap; }
.sh-homepage-link.is-disabled { color: var(--faint); border-color: var(--hairline); background: var(--soft); box-shadow: none; cursor: not-allowed; opacity: .66; }
.sh-ref-trigger { gap: 6px; white-space: nowrap; }
.sh-ref-trigger img { width: 20px; height: 20px; border-radius: 4px; object-fit: cover; }
.sh-ref-trigger.drag-over { border-color: var(--text); background: var(--soft); }
.sh-ref-trigger.is-disabled { opacity: .52; cursor: not-allowed; }
.sh-role-modal { display: grid; gap: 12px; padding: 6px 0 2px; }
.sh-role-drop {
  min-height: 300px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 9px;
  padding: 18px;
  border: 1px dashed var(--line-2);
  border-radius: 14px;
  background: var(--soft);
  color: var(--muted);
  overflow: hidden;
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}
.sh-role-drop.can-edit { cursor: pointer; }
.sh-role-drop.can-edit:hover,
.sh-role-drop.can-edit.drag-over {
  border-color: var(--brand);
  background: var(--tint);
  box-shadow: var(--ring);
  transform: translateY(-1px);
}
.sh-role-drop.has-image { position: relative; padding: 0; border-style: solid; background: #0f172a; }
.sh-role-drop.has-image img { width: 100%; max-height: 440px; min-height: 300px; object-fit: contain; display: block; }
.sh-role-drop.has-image span {
  position: absolute;
  right: 10px;
  bottom: 10px;
  padding: 5px 9px;
  border-radius: 999px;
  background: rgba(15, 23, 42, .72);
  color: #fff;
  font-size: 10.5px;
  font-weight: 750;
}
.sh-role-drop i { width: 54px; height: 54px; display: grid; place-items: center; border-radius: 16px; background: #fff; color: var(--brand); font-style: normal; box-shadow: var(--shadow-sm); }
.sh-role-drop b { color: var(--text); font-size: 13px; }
.sh-role-drop > span { font-size: 11px; }
.sh-role-modal > p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.65; }
.sh-flow { padding: 18px 18px 14px; }
.sh-flow-steps { display: flex; align-items: stretch; gap: 4px; overflow-x: auto; padding: 2px; }
.fs-card {
  display: flex; flex-direction: column; align-items: center; gap: 7px;
  min-width: 88px; padding: 13px 10px; border-radius: var(--r-md);
  border: 1px solid var(--hairline); background: var(--soft);
  transition: all var(--t-fast); animation: fadeUp .4s var(--ease) var(--d, 0ms) backwards;
}
.fs-card:hover { border-color: var(--brand); background: var(--tint); transform: translateY(-2px); box-shadow: var(--shadow-sm); }
.fs-ico { position: relative; width: 36px; height: 36px; border-radius: 11px; background: var(--surface); border: 1px solid var(--line); display: grid; place-items: center; color: var(--brand); }
.fs-num { position: absolute; top: -5px; right: -5px; width: 15px; height: 15px; border-radius: 50%; background: var(--ink); color: #fff; font-size: 9px; font-weight: 700; display: grid; place-items: center; font-style: normal; }
.fs-card b { font-size: 11.5px; }
.fs-arrow { display: grid; place-items: center; color: var(--faint); flex: none; }
.sh-prods, .sh-delivered, .sh-assets { padding: 18px 18px 12px; }
.sh-asset-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 8px; }
.sh-asset { position: relative; aspect-ratio: 1; border-radius: var(--r-md); overflow: hidden; border: 1px solid var(--hairline); background: var(--soft); cursor: pointer; transition: transform var(--t-fast), box-shadow var(--t-fast); }
.sh-asset:hover { transform: translateY(-2px); box-shadow: var(--shadow-sm); }
.sh-asset img, .sh-asset .ph { width: 100%; height: 100%; object-fit: cover; display: grid; place-items: center; color: #fff; }
.sh-asset-seq { position: absolute; left: 4px; top: 4px; font-size: 8.5px; font-weight: 700; font-family: var(--mono); color: #fff; background: rgba(10, 15, 30, .6); border-radius: 4px; padding: 1px 4px; }
.sh-asset.more { display: grid; place-items: center; font-size: 13px; font-weight: 700; color: var(--muted); background: var(--tint); border-style: dashed; }
.sh-asset-drop { display: flex; align-items: center; gap: 11px; border: 1.5px dashed var(--line-2); border-radius: var(--r-md); padding: 14px 16px; color: var(--muted); font-size: 12px; background: var(--soft); transition: all var(--t-fast); cursor: pointer; }
.sh-asset-drop:hover, .sh-asset-drop.drag-over { border-color: var(--brand); background: var(--tint); }
.sh-asset-drop span { color: var(--faint); }
.sh-prod-list { display: flex; flex-direction: column; }
.shp-row { display: flex; align-items: center; gap: 10px; min-width: 0; overflow: hidden; padding: 10px 8px; border-bottom: 1px solid var(--hairline); cursor: pointer; border-radius: var(--r-sm); transition: background var(--t-fast); }
.shp-row:hover { background: var(--soft); }
.shp-row:last-child { border-bottom: 0; }
.shp-stage { width: 28px; height: 28px; border-radius: 9px; background: var(--tint); color: var(--brand); display: grid; place-items: center; flex: none; }
.shp-main { flex: 1 1 auto; min-width: 0; overflow: hidden; }
.shp-main b { font-size: 12.5px; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.shp-main em { display: block; font-style: normal; font-size: 11px; color: var(--faint); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.shp-row .status-pill { flex: 0 0 auto; }
.sh-dl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.sh-dl { text-align: left; border: 1px solid var(--hairline); border-radius: var(--r-md); overflow: hidden; transition: all var(--t-fast); background: var(--surface); }
.sh-dl:hover { box-shadow: var(--shadow-sm); transform: translateY(-2px); }
.sh-dl img, .sh-dl i { width: 100%; height: 88px; object-fit: cover; display: grid; place-items: center; color: #fff; font-style: normal; font-weight: 700; }
.sh-dl b { display: block; font-size: 11.5px; padding: 7px 9px 1px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sh-dl em { display: block; font-style: normal; font-size: 10px; color: var(--faint); padding: 0 9px 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.img-factory { padding: 16px; margin-bottom: 14px; }
.imgf-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.imgf-head > div { display: flex; flex-direction: column; gap: 3px; }
.imgf-head b { display: flex; align-items: center; gap: 6px; font-size: 14px; }
.imgf-head em { font-style: normal; color: var(--muted); font-size: 12px; }
.imgf-grid { display: grid; grid-template-columns: minmax(180px, 1fr) 120px minmax(150px, .7fr); gap: 12px; align-items: end; }
.imgf-grid .full { grid-column: 1 / -1; }
.imgf-product-locked {
  min-width: 0;
  min-height: 42px;
  display: grid;
  gap: 4px;
  align-content: center;
  padding: 8px 11px;
  border: 1px solid rgba(37, 99, 235, .18);
  border-radius: var(--r-sm);
  color: #1d4ed8;
  background:
    linear-gradient(135deg, rgba(239,246,255,.94), rgba(255,255,255,.84));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.76), 0 8px 18px rgba(37,99,235,.06);
}
.imgf-product-locked span {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 800;
}
.imgf-product-locked em {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--faint);
  font-size: 10.5px;
  font-style: normal;
}
.imgf-mode-field { display: flex; flex-direction: column; gap: 7px; }
.imgf-copy-switch {
  height: 42px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 4px;
  border: 1px solid var(--hairline);
  border-radius: 14px;
  background: rgba(255, 255, 255, .72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75), 0 10px 24px rgba(15,23,42,.06);
  backdrop-filter: blur(16px) saturate(1.12);
}
.imgf-copy-switch button {
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  transition: background var(--t-fast), color var(--t-fast), box-shadow var(--t-fast), transform var(--t-fast);
}
.imgf-copy-switch button:hover { color: var(--text); }
.imgf-copy-switch button.is-active {
  color: #fff;
  background: linear-gradient(135deg, rgba(15,23,42,.96), rgba(42,67,105,.86));
  box-shadow: 0 8px 18px rgba(15,23,42,.16), inset 0 0 0 1px rgba(255,255,255,.18);
}
.imgf-copy-switch button:active { transform: scale(.98); }
.imgf-trend-field { margin-bottom: 12px; }
.trend-switch {
  height: 42px; display: inline-flex; align-items: center; gap: 9px; padding: 0 12px;
  border: 1px solid var(--line); border-radius: var(--r-sm); background: #fff; color: var(--text);
  font-size: 13px; font-weight: 750; white-space: nowrap;
}
.trend-switch input {
  appearance: none; width: 32px; height: 18px; border-radius: 999px; background: #dbe4f2;
  border: 1px solid #c9d3e4; position: relative; transition: background var(--t-fast), border-color var(--t-fast);
}
.trend-switch input::after {
  content: ""; position: absolute; width: 12px; height: 12px; border-radius: 50%;
  left: 2px; top: 2px; background: #fff; box-shadow: 0 1px 3px rgba(15,23,42,.18);
  transition: transform var(--t-fast);
}
.trend-switch input:checked { background: linear-gradient(135deg,#22c55e,#4f46e5); border-color: transparent; }
.trend-switch input:checked::after { transform: translateX(14px); }
.imgf-note { margin-top: 10px; font-size: 12px; color: var(--success); display: flex; align-items: center; gap: 6px; }
.imgf-note.muted { color: var(--faint); }
.copy-inline { padding: 14px 16px; margin: 0 0 14px; display: grid; gap: 10px; }
.copy-inline-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.copy-inline-head > div { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.copy-inline-head b { display: flex; align-items: center; gap: 6px; font-size: 14px; }
.copy-inline-head em { font-style: normal; color: var(--muted); font-size: 12px; }
.copy-inline .field { margin-bottom: 0; }
.copy-inline textarea { min-height: 118px; resize: vertical; }
.copy-inline.is-custom-copy #imgCopyTitle:placeholder-shown {
  border-color: rgba(96, 165, 250, .58);
  background:
    linear-gradient(135deg, rgba(239, 246, 255, .96), rgba(255, 255, 255, .92));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.86),
    0 0 0 3px rgba(59, 130, 246, .09),
    0 12px 24px rgba(37, 99, 235, .08);
  animation: requiredPulse 1.8s ease-in-out infinite;
}
.copy-inline.is-custom-copy #imgCopyTitle:focus {
  animation: none;
}
.trend-rewrite { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; padding: 14px; margin: 0 0 14px; }
.trend-card { min-width: 0; border: 1px solid var(--hairline); border-radius: var(--r-md); background: var(--soft); padding: 12px 13px; }
.trend-card.rewrite { background: #fff; border-color: rgba(61,91,255,.20); }
.trend-card b { display: block; font-size: 11px; color: var(--faint); margin-bottom: 6px; }
.trend-card h4 { font-size: 13px; line-height: 1.45; margin: 0 0 6px; overflow-wrap: anywhere; }
.trend-card em { display: block; font-style: normal; color: var(--faint); font-size: 10.5px; margin-bottom: 7px; }
.trend-card p { color: var(--muted); font-size: 12px; line-height: 1.65; white-space: pre-wrap; overflow-wrap: anywhere; }
.trend-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; }
.trend-link {
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid rgba(61, 91, 255, .16);
  background: rgba(61, 91, 255, .07);
  color: var(--brand-deep);
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 11px;
  font-weight: 700;
  text-decoration: none;
}
.trend-link:hover { border-color: rgba(61, 91, 255, .32); background: rgba(61, 91, 255, .12); }
.trend-edit-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.trend-edit-head b { margin-bottom: 0; }
.trend-card .field { margin-bottom: 8px; }
.trend-card textarea { min-height: 154px; resize: vertical; line-height: 1.65; }
.trend-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 9px; }
.trend-tags .tag { font-size: 10.5px; padding: 2px 7px; border-radius: 999px; background: rgba(61,91,255,.08); color: var(--brand-deep); }

/* ---------- 链路 stepper ---------- */
.chain-stepper {
  display: flex; align-items: center; gap: 2px;
  background: var(--surface); border: 1px solid var(--hairline); border-radius: 99px;
  padding: 6px 10px; margin: 0 auto 18px; max-width: 1100px;
  box-shadow: var(--shadow-xs); overflow-x: auto;
  position: sticky; top: 0; z-index: 10;
}
.cs-back { display: inline-flex; align-items: center; gap: 4px; padding: 5px 11px; margin-right: 4px; border-radius: 99px; flex: none; font-size: 12px; font-weight: 650; color: var(--brand); background: var(--tint); border: 1px solid transparent; white-space: nowrap; transition: all var(--t-fast); }
.cs-back:hover { background: var(--brand); color: #fff; }
.cs-step { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 99px; flex: none; transition: background var(--t-fast); }
.cs-step:hover { background: var(--soft); }
.cs-dot {
  width: 18px; height: 18px; border-radius: 50%; display: grid; place-items: center;
  background: var(--soft); border: 1px solid var(--line); color: var(--faint);
  font-size: 9.5px; font-weight: 700;
}
.cs-dot i { font-style: normal; }
.cs-label { font-size: 11.5px; font-weight: 650; color: var(--muted); }
.cs-step.is-done .cs-dot { background: var(--success-bg); border-color: transparent; color: var(--success); }
.cs-step.is-current .cs-dot { background: #171b22; border-color: transparent; color: #fff; box-shadow: 0 0 0 3px rgba(17, 24, 39, .10); }
.cs-step.is-current .cs-label { color: var(--ink); font-weight: 750; }
.cs-step.is-fail .cs-dot { background: var(--danger); color: #fff; }
.cs-link { width: 14px; height: 1.5px; background: var(--line); flex: none; }
.cs-link.on { background: var(--success); opacity: .5; }
.cs-spacer { flex: 1; min-width: 10px; }
.cs-prod { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; color: var(--faint); padding-right: 8px; flex: none; }
.view-root > .chain-stepper { display: none; }
body.workspace-shell-v2[data-zone="studio"] .view-root > .chain-stepper {
  position: sticky;
  top: 0;
  z-index: 28;
  display: flex !important;
  max-width: none;
  margin: 0 0 10px;
  padding: 5px 58px 5px 0;
  border: 0;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
}
body.workspace-shell-v2[data-zone="studio"] .view-root > .chain-stepper .cs-back {
  color: #343431;
  background: #f0f0ed;
}
body.workspace-shell-v2[data-zone="studio"] .view-root > .chain-stepper .cs-back:hover {
  color: #171716;
  background: #e6e6e2;
}
body.workspace-shell-v2[data-zone="studio"] .view-root > .chain-stepper .cs-origin {
  background: #f7f7f4;
}
body.workspace-shell-v2[data-zone="studio"] .view-root > .chain-stepper .cs-origin:hover {
  background: #ecece8;
}

/* ---------- 链路页布局 ---------- */
.chain-page { display: grid; grid-template-columns: minmax(0, 1fr) 270px; gap: 18px; max-width: 1100px; margin: 0 auto; }
.chain-page.solo { grid-template-columns: minmax(0, 1fr); }
.chain-main { min-width: 0; }
.chain-side { display: flex; flex-direction: column; gap: 12px; }
.page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; margin-bottom: 16px; flex-wrap: wrap; }
.page-head h2 { margin-top: 5px; }
.side-card { padding: 15px 16px 13px; }
.side-card h3 { display: flex; align-items: center; gap: 5px; margin-bottom: 10px; }
.side-card.hint { background: var(--tint); border-color: transparent; }
.side-card.hint p { font-size: 11.5px; color: var(--muted); line-height: 1.75; }
.pos-card .pc-row { display: flex; gap: 10px; padding: 5px 0; font-size: 12px; border-bottom: 1px dashed var(--hairline); }
.pos-card .pc-row:last-child { border-bottom: 0; }
.pos-card .pc-row span { color: var(--faint); flex: none; width: 32px; }
.pos-card .pc-row b { font-weight: 600; line-height: 1.55; }
.brief { padding: 16px 16px 12px; margin-bottom: 16px; }
.brief-row { display: flex; gap: 14px; align-items: flex-end; flex-wrap: wrap; }
.style-chips { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 7px; }
.table-head { display: flex; align-items: center; justify-content: space-between; margin: 4px 2px 9px; }
.optimize-bar { display: flex; gap: 8px; padding: 10px; margin-top: 14px; }
.seg-mini { font-size: 12px; color: var(--muted); line-height: 1.7; }
.seg-mini .sm-top { display: flex; justify-content: space-between; font-weight: 700; color: var(--text); }
.struct-tmpl .struct-row { display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: var(--muted); padding: 5px 0; }

/* ---------- 统一参考 / 槽位卡 ---------- */
.refbar {
  position: relative;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 14px;
  margin-bottom: 10px;
  overflow: hidden;
  flex-wrap: wrap;
  transition: transform 180ms ease, border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}
.refbar.img-ref-generation:hover {
  transform: translateY(-1px);
  border-color: rgba(61,91,255,.42);
  background: #fbfcff;
  box-shadow: 0 8px 24px rgba(61,91,255,.08);
}
.refbar.drag-over {
  transform: translateY(-2px) scale(1.006);
  border-color: var(--brand);
  background: #f3f6ff;
  box-shadow: 0 0 0 3px rgba(61,91,255,.13), 0 16px 34px rgba(61,91,255,.16);
}
.refbar-drop-cue {
  position: absolute;
  inset: 5px;
  z-index: 6;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px dashed rgba(61,91,255,.62);
  border-radius: 11px;
  background: rgba(247,249,255,.94);
  color: var(--brand-deep);
  opacity: 0;
  pointer-events: none;
  transform: scale(.97);
  transition: opacity 150ms ease, transform 180ms ease;
}
.refbar-drop-cue b { font-size: 13px; font-weight: 680; }
.refbar-drop-cue em { color: #78829a; font-size: 11px; font-style: normal; }
.refbar.img-ref-generation:hover .refbar-drop-cue {
  opacity: .5;
  transform: scale(1);
}
.refbar.drag-over .refbar-drop-cue {
  opacity: 1;
  transform: scale(1);
}
.refbar.drag-over .refbar-drop-cue svg {
  animation: refbarDropBounce 720ms ease-in-out infinite alternate;
}
.refbar.drag-over .refbar-left b svg {
  animation: refbarStarPulse 660ms ease-in-out infinite alternate;
}
.reference-attention {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-color: rgba(66,108,191,.2);
  animation: referenceAttentionBreath 2.8s ease-in-out infinite;
}
.reference-attention > * {
  position: relative;
  z-index: 1;
}
.reference-attention::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: -40% auto -40% -24%;
  width: 24%;
  background: linear-gradient(90deg, transparent, rgba(86,132,222,.11), transparent);
  transform: skewX(-14deg);
  animation: referenceAttentionSweep 3.6s ease-in-out infinite;
  pointer-events: none;
}
.reference-attention:hover,
.reference-attention:focus-within,
.reference-attention.drag-over {
  animation-play-state: paused;
  border-color: rgba(66,108,191,.34);
  box-shadow: 0 0 0 3px rgba(66,108,191,.07), 0 12px 30px rgba(36,62,110,.06);
}
@keyframes referenceAttentionBreath {
  0%, 100% { box-shadow: 0 0 0 0 rgba(66,108,191,0); }
  50% { box-shadow: 0 0 0 3px rgba(66,108,191,.055), 0 10px 24px rgba(36,62,110,.045); }
}
@keyframes referenceAttentionSweep {
  0%, 32% { left: -28%; opacity: 0; }
  42% { opacity: 1; }
  66%, 100% { left: 112%; opacity: 0; }
}
@keyframes refbarDropBounce {
  from { transform: translateY(2px); }
  to { transform: translateY(-3px); }
}
@keyframes refbarStarPulse {
  from { transform: scale(.92) rotate(-7deg); }
  to { transform: scale(1.16) rotate(7deg); }
}
@media (prefers-reduced-motion: reduce) {
  .refbar,
  .refbar-drop-cue { transition: none; }
  .refbar.drag-over .refbar-drop-cue svg,
  .refbar.drag-over .refbar-left b svg,
  .reference-attention,
  .reference-attention::after { animation: none; }
}

/* v132 · 用户主动分享的灵感社区：真实媒体、紧凑四列与尺寸自适应。 */
.product-home-miaoda .home-inspiration-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: start;
  gap: 10px;
  columns: auto !important;
}
.product-home-miaoda .home-inspiration-card {
  position: relative;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  display: block;
  border: 0;
  border-radius: 14px;
  background: transparent;
  box-shadow: none;
}
.product-home-miaoda .home-inspiration-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 30px rgba(31, 50, 78, .09);
}
.product-home-miaoda .home-inspiration-card:nth-child(n) .home-inspiration-media {
  width: 100%;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  display: block;
  aspect-ratio: var(--community-ratio, auto);
  border-radius: inherit;
  background: #f2f5f8;
}
.product-home-miaoda .home-inspiration-media img,
.product-home-miaoda .home-inspiration-media video {
  width: 100%;
  height: 100%;
  min-height: 132px;
  max-height: none;
  display: block;
  object-fit: cover;
  transition: transform 320ms cubic-bezier(.2,.75,.2,1), filter 180ms ease;
}
.product-home-miaoda .home-inspiration-card:hover .home-inspiration-media img,
.product-home-miaoda .home-inspiration-card:hover .home-inspiration-media video { transform: scale(1.018); }
.home-community-empty {
  grid-column: 1 / -1;
  min-height: 180px;
  padding: 32px;
  display: grid;
  place-content: center;
  gap: 7px;
  border: 1px dashed #dce3ec;
  border-radius: 16px;
  background: rgba(249,251,253,.72);
  color: #7f8996;
  text-align: center;
}
.home-community-empty b { color: #313a46; font-size: 14px; }
.home-community-empty span { font-size: 11px; }
button.home-community-empty { width: 100%; cursor: pointer; }
.home-inspiration-detail-media {
  align-content: center;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
  overflow: auto;
}
.home-inspiration-detail-media img,
.home-inspiration-detail-media video {
  width: 100%;
  height: auto;
  max-height: 430px;
  border-radius: 12px;
  object-fit: contain;
}
.home-inspiration-detail-copy small { margin: -6px 0 16px; color: #9aa2ad; }
.home-prompt-preview { max-height: 150px; overflow: auto; margin-bottom: 22px; padding: 12px; border-radius: 12px; background: #f5f7fa; color: #606976; white-space: pre-wrap; line-height: 1.55; }

.community-share-panel { width: min(680px, calc(100vw - 28px)); padding: 0 !important; overflow: hidden; }
.community-share-dialog { padding: 22px; display: grid; gap: 14px; }
.community-share-dialog > header { display: flex; align-items: flex-start; gap: 11px; }
.community-share-dialog > header > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; background: #edf5ff; color: #2974ca; }
.community-share-dialog h2 { margin: 0; font-size: 20px; }
.community-share-dialog header p { margin: 4px 0 0; color: #8b94a0; font-size: 11px; }
.community-share-preview { max-height: 210px; overflow: auto; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.community-share-preview img,
.community-share-preview video { width: 100%; height: 120px; display: block; border-radius: 10px; background: #eef2f6; object-fit: contain; }
.community-share-dialog label { display: grid; gap: 6px; color: #5b6470; font-size: 11px; }
.community-share-dialog input,
.community-share-dialog textarea,
.community-share-dialog select { width: 100%; min-height: 40px; padding: 9px 11px; border: 1px solid #dce2e9; border-radius: 11px; background: #fff; color: #20262e; font: inherit; resize: vertical; }
.community-share-dialog footer { display: flex; justify-content: flex-end; gap: 9px; }

.custom-tool-host { position: relative; }

@media (max-width: 1080px) {
  .product-home-miaoda .home-inspiration-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .product-home-miaoda .home-inspiration-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .community-share-preview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-inspiration-detail { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .product-home-miaoda .home-inspiration-grid { grid-template-columns: 1fr; }
}
.refbar-left b { display: flex; align-items: center; gap: 5px; font-size: 12.5px; }
.refbar-left em { font-style: normal; display: block; font-size: 11px; color: var(--faint); margin-top: 2px; }
.refbar-chip { flex: 1; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; min-width: 240px; }
.ref-chip { display: inline-flex; align-items: center; gap: 8px; background: var(--soft); border: 1px solid var(--line); border-radius: 99px; padding: 4px 10px 4px 4px; font-size: 12px; font-weight: 600; }
.ref-chip img, .ref-chip .ph { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; display: grid; place-items: center; color: #fff; font-size: 10px; }
.ref-x { width: 18px; height: 18px; border-radius: 50%; display: grid; place-items: center; color: var(--faint); }
.ref-x:hover { color: var(--danger); background: var(--danger-bg); }
.refbar-actions { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.video-cover-bar {
  display: grid;
  grid-template-columns: minmax(180px, 240px) minmax(0, 1fr) minmax(300px, 380px);
  align-items: center;
}
.video-cover-bar .ws-cover-fields { display: grid; gap: 8px; min-width: 0; }
.video-cover-bar #wsCoverPrompt { min-height: 46px; max-height: 74px; resize: vertical; line-height: 1.45; }
.cover-ref-strip { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; min-height: 24px; }
.cover-side {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.cover-actions { display: flex; align-items: center; align-content: center; gap: 6px; flex-wrap: wrap; }
.cover-actions .btn { flex: 1 1 92px; justify-content: center; min-height: 32px; padding: 6px 10px; }
.cover-frame {
  position: relative;
  width: 100%;
  max-width: 58px;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 14px;
  background:
    linear-gradient(145deg, rgba(255,255,255,.92), rgba(241,246,255,.72)),
    var(--surface);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.92), var(--shadow-xs);
  color: var(--muted);
}
.cover-frame:disabled { opacity: 1; cursor: default; }
.cover-frame.has-cover { cursor: zoom-in; background: #f8fbff; }
.cover-frame.has-cover:hover { transform: translateY(-1px); box-shadow: var(--shadow-sm); }
.cover-frame img,
.cover-frame .ph {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  object-fit: cover;
  border-radius: inherit;
  color: #fff;
}
.cover-frame.has-cover > span {
  position: absolute;
  left: 5px;
  right: 5px;
  bottom: 5px;
  padding: 3px 4px;
  border-radius: 999px;
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  text-align: center;
  background: rgba(15, 23, 42, .58);
  border: 1px solid rgba(255,255,255,.28);
  backdrop-filter: blur(12px);
}
.cover-empty,
.cover-loading {
  width: calc(100% - 10px);
  min-height: 48px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 4px;
  border: 1px dashed rgba(148, 163, 184, .52);
  border-radius: 12px;
  text-align: center;
  background: rgba(255,255,255,.38);
}
.cover-empty b,
.cover-loading b { color: var(--ink); font-size: 14px; line-height: 1; }
.cover-empty em,
.cover-loading em { font-style: normal; color: var(--faint); font-size: 10px; font-weight: 700; }
.cover-frame.is-loading {
  background:
    linear-gradient(115deg, rgba(255,255,255,.92) 0%, rgba(222,234,255,.7) 38%, rgba(255,255,255,.94) 56%, rgba(226,236,255,.72) 100%),
    var(--surface);
  background-size: 240% 100%;
  animation: coverSweep 1.25s ease-in-out infinite;
}
.cover-loading span {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 1px solid rgba(37, 99, 235, .2);
  background:
    radial-gradient(circle at 50% 50%, rgba(37,99,235,.24) 0 22%, transparent 24%),
    conic-gradient(from 0deg, transparent 0 32%, rgba(37,99,235,.62) 36% 62%, transparent 66% 100%);
  animation: coverSpin .9s linear infinite;
}
@keyframes coverSweep { 0% { background-position: 0% 50%; } 100% { background-position: 100% 50%; } }
@keyframes coverSpin { to { transform: rotate(360deg); } }
@media (max-width: 760px) {
  .video-cover-bar { grid-template-columns: 1fr; }
  .cover-side { grid-template-columns: 58px minmax(0, 1fr); align-items: center; }
}
.ref-chooser { padding: 12px; margin-bottom: 10px; }
.ref-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(86px, 1fr)); gap: 8px; }
.ref-item { position: relative; border: 1px solid var(--hairline); border-radius: var(--r-md); overflow: hidden; transition: all var(--t-fast); background: var(--surface); }
.ref-item:hover { border-color: var(--brand); transform: translateY(-2px); }
.ref-item.is-picked { border-color: var(--brand); box-shadow: var(--ring); background: var(--tint); }
.ref-item img, .ref-item .ph { width: 100%; height: 62px; object-fit: cover; display: grid; place-items: center; color: #fff; }
.ref-item span { display: block; font-size: 10px; padding: 5px 6px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ref-del {
  position: absolute; right: 5px; top: 5px; width: 21px; height: 21px;
  display: grid; place-items: center; border-radius: 7px;
  color: var(--danger); background: rgba(255,255,255,.9);
  border: 1px solid rgba(239,68,68,.18); opacity: 0;
  transition: all var(--t-fast);
}
.ref-item:hover .ref-del, .ref-del:focus-visible { opacity: 1; }

.mode-tabs {
  display: inline-flex; gap: 4px; background: var(--soft); border: 1px solid var(--line);
  border-radius: var(--r-md); padding: 4px; margin-bottom: 14px;
}
.mode-tabs.slim { margin-bottom: 16px; }
.mode-tab { display: flex; flex-direction: column; align-items: flex-start; padding: 7px 16px; border-radius: var(--r-sm); font-size: 12.5px; font-weight: 700; color: var(--muted); transition: all var(--t-fast); }
.mode-tab span { font-size: 10px; font-weight: 500; color: var(--faint); }
.mode-tab.is-active { background: var(--surface); color: var(--ink); box-shadow: var(--shadow-xs), inset 0 0 0 1px var(--line); }
.inhouse-controls { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; }

.external-panel { padding: 14px 15px; margin-bottom: 14px; }
.ep-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 10px; flex-wrap: wrap; }
.ep-head b { font-size: 13px; }
.ep-head em { display: block; margin-top: 2px; }
.ep-prompt {
  background: var(--soft); border: 1px solid var(--line); border-radius: var(--r-md);
  padding: 13px 14px; font-size: 12px; line-height: 1.8; white-space: pre-wrap;
  max-height: 260px; overflow-y: auto; outline: 0; font-family: var(--mono);
}
.ep-prompt:focus { border-color: var(--brand); box-shadow: var(--ring); }
.ep-return { margin-top: 12px; }
.ep-return, .ag-drop, .pd-drop { cursor: pointer; }
#cbDrop {
  display: flex; align-items: center; gap: 14px;
  border: 1.5px dashed var(--line-2); border-radius: var(--r-lg);
  padding: 16px 18px; background: var(--soft); transition: all var(--t-fast);
}
#cbDrop:hover, #cbDrop.drag-over { border-color: var(--brand); background: var(--tint); }
#cbDrop .epd-core { width: 44px; height: 44px; border-radius: 50%; background: var(--surface); border: 1px solid var(--line); display: grid; place-items: center; color: var(--brand); flex: none; }
#cbDrop .epd-text b { display: flex; align-items: center; font-size: 13px; }
#cbDrop .epd-text em { font-style: normal; display: block; font-size: 11px; color: var(--faint); margin-top: 3px; }
.dots i { animation: blink 1.4s infinite; font-style: normal; }
.dots i:nth-child(2) { animation-delay: .2s; } .dots i:nth-child(3) { animation-delay: .4s; }
@keyframes blink { 0%, 60%, 100% { opacity: .25; } 30% { opacity: 1; } }

.slot-cards { display: flex; flex-direction: column; gap: 10px; }
.generation-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 12px; margin-bottom: 14px; }
.generation-toolbar .mode-tabs { margin: 0; }
.img-ref-generation { align-items: center; gap: 12px; }
.img-ref-generation .refbar-actions { flex-wrap: wrap; justify-content: flex-end; }
.img-ref-generation #cbGenAllImages { min-height: 38px; margin-left: 4px; }
.generation-actions { margin-left: auto; display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.slot-card { display: flex; gap: 14px; padding: 13px 14px; align-items: stretch; animation: fadeUp .35s var(--ease) backwards; }
.sc-num { width: 22px; height: 22px; border-radius: 7px; background: var(--ink); color: #fff; font-size: 11px; font-weight: 700; display: grid; place-items: center; flex: none; align-self: flex-start; }
.sc-text { flex: 1; min-width: 0; }
.sc-line { font-size: 12.5px; font-weight: 650; margin-bottom: 6px; }
.sc-line em { font-style: normal; font-weight: 450; color: var(--faint); margin-left: 7px; font-size: 11.5px; }
.sc-prompt {
  font-size: 12px; line-height: 1.7; color: var(--muted);
  background: var(--soft); border: 1px solid var(--hairline); border-radius: var(--r-md);
  padding: 9px 11px; min-height: 38px; max-height: 176px; overflow-y: auto; outline: 0; white-space: pre-wrap;
}
.sc-prompt:focus { border-color: var(--brand); background: #fff; box-shadow: var(--ring); color: var(--text); }
.sc-prompt:empty::before { content: attr(data-ph); color: var(--faint); }
.sc-slot-refbar { display: flex; align-items: center; gap: 7px; min-height: 32px; margin-top: 7px; padding: 5px 7px; border: 1px dashed var(--line); border-radius: 8px; background: rgba(247,249,252,.72); transition: border-color var(--t-fast), background var(--t-fast), box-shadow var(--t-fast); }
.sc-slot-refbar.drag-over { border-color: var(--brand); background: var(--tint); box-shadow: var(--ring); }
.sc-slot-ref-label { flex: none; color: var(--faint); font-size: 10.5px; font-weight: 700; }
.sc-slot-ref-list { min-width: 0; flex: 1; display: flex; align-items: center; gap: 5px; overflow: hidden; }
.sc-slot-ref-list > em { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--faint); font-size: 10.5px; font-style: normal; }
.sc-slot-ref-chip { min-width: 0; max-width: 142px; display: inline-flex; align-items: center; gap: 4px; padding: 2px 4px 2px 2px; border: 1px solid var(--hairline); border-radius: 99px; background: #fff; color: var(--muted); font-size: 10px; }
.sc-slot-ref-chip > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sc-slot-ref-chip img, .sc-slot-ref-chip .ph { width: 20px; height: 20px; border-radius: 50%; object-fit: cover; display: grid; place-items: center; font-size: 8px; }
.sc-slot-ref-upload { flex: none; min-height: 26px; padding: 3px 7px; font-size: 10px; }
.sc-thumb { width: 92px; flex: none; border-radius: var(--r-md); overflow: hidden; position: relative; background: var(--soft); border: 1px solid var(--hairline); }
.sc-thumb img { width: 100%; height: 100%; object-fit: cover; cursor: zoom-in; }
.sc-thumb .ph { width: 100%; height: 100%; display: grid; place-items: center; color: #fff; font-size: 11px; }
.sc-badge {
  position: absolute; right: 5px; bottom: 5px; padding: 2px 6px; border-radius: 999px;
  font-size: 10px; font-weight: 800; color: #0f6f55; background: rgba(220, 252, 231, .92);
  border: 1px solid rgba(16, 185, 129, .26); box-shadow: 0 4px 12px rgba(15, 23, 42, .14);
}
.sc-empty, .sc-loading { width: 100%; height: 100%; display: grid; place-items: center; color: var(--faint); font-size: 11px; min-height: 92px; text-align: center; }
.sc-empty span { display: block; font-size: 18px; font-weight: 850; color: var(--muted); letter-spacing: 0; }
.sc-empty em { display: block; margin-top: 2px; font-style: normal; font-size: 10px; color: var(--faint); }
.sc-side { display: flex; flex-direction: column; gap: 6px; justify-content: center; flex: none; }
.slot-card.is-image-slot .sc-thumb { width: 120px; aspect-ratio: 3 / 4; }
.slot-card.is-image-slot .sc-empty,
.slot-card.is-image-slot .sc-loading { min-height: 0; height: 100%; }
.slot-card.is-generating { box-shadow: 0 0 0 1px rgba(80,100,255,.18), 0 10px 28px rgba(80,100,255,.08); }
.sc-error { margin-top: 8px; color: #ef4444; font-size: 12px; line-height: 1.45; }
@media (max-width: 900px) {
  .sh-head { flex-wrap: wrap; }
  .sh-actions { width: 100%; justify-content: flex-start; margin-left: 88px; }
  .generation-toolbar { align-items: stretch; flex-direction: column; }
  .generation-actions { margin-left: 0; justify-content: flex-start; }
  .sc-slot-refbar { align-items: flex-start; flex-wrap: wrap; }
  .sc-slot-ref-list { flex-basis: calc(100% - 106px); flex-wrap: wrap; overflow: visible; }
  .trend-rewrite { grid-template-columns: 1fr; }
}

/* ---------- 提示词卡 ---------- */
.prompt-card { margin-bottom: 12px; padding: 14px 16px; }
.pc-header { display: flex; align-items: center; gap: 9px; margin-bottom: 10px; flex-wrap: wrap; }
.pc-num { width: 20px; height: 20px; border-radius: 7px; background: var(--ink); color: #fff; font-size: 11px; font-weight: 700; display: grid; place-items: center; }
.pc-header b { flex: 1; }
.pc-body { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pc-block { background: var(--soft); border: 1px solid var(--hairline); border-radius: var(--r-md); padding: 11px 12px; }
.pb-label { display: flex; align-items: center; gap: 7px; font-size: 10.5px; color: var(--faint); margin-bottom: 7px; }
.pb-text { font-size: 11.5px; line-height: 1.75; color: var(--muted); white-space: pre-wrap; max-height: 220px; overflow-y: auto; outline: 0; }
.pb-text:focus { color: var(--text); }
@media (max-width: 900px) { .pc-body { grid-template-columns: 1fr; } }

/* ---------- 生成台（深色） ---------- */
.workbench {
  display: grid; grid-template-columns: 210px minmax(0, 1fr) auto;
  height: calc(100vh - 150px); min-height: 540px;
  background: linear-gradient(165deg, var(--d-bg), var(--d-bg-2) 55%, #121028);
  border-radius: var(--r-xl); overflow: hidden;
  border: 1px solid var(--d-line);
  box-shadow: var(--shadow-md);
  max-width: 1280px; margin: 0 auto;
  color: var(--d-text);
}
.wb-segs { border-right: 1px solid var(--d-line); padding: 14px 10px; overflow-y: auto; min-height: 0; overscroll-behavior: contain; scrollbar-gutter: stable; }
.wbs-head { padding: 2px 6px 12px; }
.wbs-head b { font-size: 13px; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wbs-head em { font-style: normal; font-size: 10.5px; color: var(--d-faint); }
.wbs-group { font-size: 10px; font-weight: 700; letter-spacing: .06em; color: var(--d-faint); padding: 10px 6px 5px; text-transform: uppercase; }
.wbs-item {
  display: flex; flex-direction: column; gap: 4px; width: 100%; text-align: left;
  padding: 9px 10px; border-radius: var(--r-md); border: 1px solid transparent;
  transition: all var(--t-fast);
}
.wbs-item:hover { background: rgba(255, 255, 255, .05); }
.wbs-item.is-active { background: rgba(80, 110, 255, .14); border-color: rgba(132, 152, 255, .35); }
.wbs-item em { font-style: normal; font-size: 10.5px; color: var(--d-muted); display: flex; align-items: center; gap: 5px; }
.wbs-assemble {
  margin-top: 12px; width: 100%; padding: 10px;
  border-radius: var(--r-md); font-size: 12px; font-weight: 700;
  background: linear-gradient(135deg, rgba(12, 166, 120, .25), rgba(34, 184, 207, .2));
  border: 1px solid rgba(54, 207, 160, .4); color: #7BEFCB;
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  animation: fadeUp .4s var(--ease);
}
.wbs-assemble:hover { background: rgba(12, 166, 120, .35); }
.wb-stage { display: flex; flex-direction: column; min-width: 0; min-height: 0; overflow: hidden; }
.wb-toolbar { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px 10px; gap: 10px; flex-wrap: wrap; }
.wb-toolbar h2 { color: #fff; font-size: 15px; margin-top: 3px; }
.wb-toolbar-right { display: flex; align-items: center; gap: 8px; }
.api-badge { font-size: 10.5px; font-weight: 700; border-radius: 99px; padding: 4px 10px; }
.api-badge.warn { background: rgba(232, 147, 12, .15); color: #F5B85C; border: 1px solid rgba(232, 147, 12, .35); }
.api-badge.ok { background: rgba(12, 166, 120, .15); color: #5BE0B0; border: 1px solid rgba(12, 166, 120, .35); }
.wb-flow { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; overflow-anchor: none; padding: 8px 18px 18px; display: flex; flex-direction: column; gap: 12px; scrollbar-gutter: stable; }
.wb-empty { margin: auto; text-align: center; color: var(--d-faint); display: flex; flex-direction: column; align-items: center; gap: 8px; }
.wb-empty b { color: var(--d-muted); font-size: 13.5px; }
.wb-empty p { font-size: 11.5px; }
.wb-msg.user { display: flex; justify-content: flex-end; }
.wb-bubble {
  max-width: 78%; background: rgba(80, 110, 255, .16);
  border: 1px solid rgba(132, 152, 255, .25);
  border-radius: 14px 14px 4px 14px; padding: 10px 13px;
  font-size: 12px; line-height: 1.7; white-space: pre-wrap; color: var(--d-text);
}
.wbr-row { display: flex; gap: 5px; margin-bottom: 7px; flex-wrap: wrap; }
.wbr img { width: 38px; height: 38px; border-radius: 8px; object-fit: cover; border: 1px solid var(--d-line-2); }
.wb-msg.sys { display: flex; }
.gen-card { width: min(330px, 90%); }
.gen-frame {
  position: relative; aspect-ratio: 9/14; max-height: 300px; border-radius: var(--r-lg); overflow: hidden;
  background: var(--d-surface); border: 1px solid var(--d-line);
  display: grid; place-items: center;
}
.gen-frame video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: #050816; }
/* 原生全屏播放按完整比例显示（否则继承上面的 object-fit:cover 会把视频裁切放大成局部）；两个伪类必须各写一条，合写会让整条规则在部分浏览器失效 */
video:fullscreen { object-fit: contain !important; width: 100% !important; height: 100% !important; background: #000; }
video:-webkit-full-screen { object-fit: contain !important; width: 100% !important; height: 100% !important; background: #000; }
.gen-frame .gf-grad { position: absolute; inset: 0; opacity: .8; filter: saturate(.9); }
.gen-frame .gf-grad::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(9, 13, 24, .1), rgba(9, 13, 24, .65)); }
.gf-center { position: relative; display: flex; flex-direction: column; align-items: center; gap: 9px; color: #fff; text-align: center; padding: 0 16px; }
.gf-center b { font-size: 12.5px; }
.gf-center em { font-style: normal; font-size: 10.5px; color: rgba(255, 255, 255, .65); line-height: 1.5; }
.gf-bar { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: rgba(255, 255, 255, .12); }
.gf-bar i { display: block; height: 100%; background: linear-gradient(90deg, #36CFA0, #3D5BFF); transition: width .5s; }
.gf-label { position: absolute; left: 12px; bottom: 12px; display: flex; align-items: center; gap: 7px; color: #fff; }
.gf-label b { font-size: 11.5px; font-weight: 600; }
.gf-play {
  position: absolute; width: 44px; height: 44px; border-radius: 50%;
  background: rgba(255, 255, 255, .14); backdrop-filter: blur(6px);
  display: grid; place-items: center; color: #fff;
  border: 1px solid rgba(255, 255, 255, .3);
}
.gen-frame.fail { border-color: rgba(224, 49, 49, .4); }
.gen-frame.fail .gf-center { color: #FF8787; }
.gen-meta { display: flex; gap: 8px; align-items: center; margin-top: 7px; font-size: 10.5px; color: var(--d-faint); }
.gen-meta span { background: rgba(255, 255, 255, .06); border-radius: 5px; padding: 1px 7px; }
.gen-actions { display: flex; gap: 6px; margin-top: 7px; flex-wrap: wrap; }
.gen-act {
  font-size: 11px; font-weight: 650; border-radius: 7px; padding: 5px 10px;
  background: rgba(255, 255, 255, .07); color: var(--d-muted);
  border: 1px solid var(--d-line); transition: all var(--t-fast);
}
.gen-act:hover { color: #fff; background: rgba(255, 255, 255, .12); }
.gen-act.primary { background: rgba(80, 110, 255, .25); border-color: rgba(132, 152, 255, .45); color: #BFD0FF; }
.gen-act.added { background: rgba(12, 166, 120, .18); border-color: rgba(12, 166, 120, .4); color: #5BE0B0; }

.wb-composer {
  margin: 0 18px 16px; border-radius: var(--r-lg);
  background: rgba(17, 26, 46, .9);
  border: 1px solid var(--d-line-2);
  box-shadow: 0 16px 40px rgba(0, 0, 0, .4);
  transition: border-color var(--t-fast);
  position: relative;
}
.wb-composer.drag-over { border-color: var(--brand-2); box-shadow: var(--d-glow); }
.wb-input {
  min-height: 58px; max-height: 150px; overflow-y: auto;
  padding: 13px 15px 6px; outline: 0;
  font-size: 12.5px; line-height: 1.75; color: var(--d-text);
}
.wb-input:empty::before { content: attr(data-ph); color: var(--d-faint); }
.inline-chip {
  display: inline-flex; align-items: center; gap: 5px; vertical-align: -6px;
  background: rgba(80, 110, 255, .2); border: 1px solid rgba(132, 152, 255, .4);
  border-radius: 7px; padding: 2px 7px 2px 3px; margin: 0 2px;
  font-size: 11px; color: #CBD8FF; max-width: 180px;
}
.inline-chip .ic-thumb img, .inline-chip .ic-thumb .ph { width: 18px; height: 18px; border-radius: 5px; object-fit: cover; display: grid; place-items: center; font-size: 8px; color: #fff; }
.inline-chip .ic-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.inline-chip .ic-x { cursor: pointer; opacity: .6; }
.inline-chip .ic-x:hover { opacity: 1; }
.wb-mention {
  position: absolute; left: 14px; bottom: 100%; margin-bottom: 8px;
  width: 280px; max-height: 240px; overflow-y: auto;
  background: var(--d-surface-2); border: 1px solid var(--d-line-2);
  border-radius: var(--r-md); box-shadow: var(--shadow-lg); z-index: 5;
}
.wbm-item { display: flex; gap: 9px; align-items: center; width: 100%; text-align: left; padding: 8px 10px; transition: background var(--t-fast); }
.wbm-item:hover { background: rgba(255, 255, 255, .06); }
.wbm-thumb img, .wbm-thumb .ph { width: 30px; height: 30px; border-radius: 8px; object-fit: cover; display: grid; place-items: center; color: #fff; font-size: 10px; }
.wbm-item b { display: block; font-size: 12px; color: var(--d-text); }
.wbm-item em { font-style: normal; font-size: 10px; color: var(--d-faint); }
.wb-tools { display: flex; align-items: center; gap: 7px; padding: 7px 10px 10px; flex-wrap: wrap; }
.tool-btn {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 11.5px; font-weight: 600; color: var(--d-muted);
  border: 1px solid var(--d-line); border-radius: 8px; padding: 5px 10px;
  transition: all var(--t-fast); cursor: pointer;
}
.tool-btn:hover { color: #fff; border-color: var(--d-line-2); }
.tool-sep { flex: 1; }
.tool-chip {
  font-size: 11px; font-weight: 700; color: var(--d-muted);
  background: rgba(255, 255, 255, .06); border-radius: 7px; padding: 5px 10px;
  font-variant-numeric: tabular-nums;
}
.tool-chip:not(.static):hover { color: #fff; cursor: pointer; }
.tool-select {
  appearance: none; height: 27px; border-radius: 7px; padding: 0 8px;
  font-size: 11px; font-weight: 700; color: var(--d-muted); font-variant-numeric: tabular-nums;
  background: rgba(255, 255, 255, .06); border: 1px solid var(--d-line);
}
.tool-select:focus { outline: 0; border-color: rgba(132, 152, 255, .55); color: #fff; }
.wb-send {
  display: inline-flex; align-items: center; gap: 6px;
  background: linear-gradient(135deg, var(--brand), #7A4DFF);
  color: #fff; font-size: 12.5px; font-weight: 700;
  border-radius: 10px; padding: 8px 18px;
  box-shadow: 0 6px 18px rgba(61, 91, 255, .4);
  transition: all var(--t-fast);
}
.wb-send:hover { transform: translateY(-1px); box-shadow: 0 10px 24px rgba(61, 91, 255, .5); }
.wb-assets { width: 250px; border-left: 1px solid var(--d-line); padding: 14px 12px; overflow-y: auto; }
.wba-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.wba-head b { font-size: 12.5px; }
.wb-assets .icon-btn { color: var(--d-muted); }
.wb-assets .icon-btn:hover { background: rgba(255, 255, 255, .08); color: #fff; }
.wba-list { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
.wba-item { position: relative; border-radius: var(--r-md); overflow: hidden; border: 1px solid var(--d-line); aspect-ratio: 1; transition: all var(--t-fast); }
.wba-item:hover { border-color: var(--brand-2); transform: translateY(-2px); }
.wba-item img, .wba-item .ph { width: 100%; height: 100%; object-fit: cover; display: grid; place-items: center; color: #fff; }
.wba-tag { position: absolute; left: 5px; bottom: 5px; font-size: 9px; background: rgba(0, 0, 0, .55); color: #fff; border-radius: 5px; padding: 1px 6px; }
.input-with-action { display: flex; align-items: center; gap: 6px; }
.input-with-action .input { min-width: 0; flex: 1; }
.voice-picker { position: relative; min-width: min(330px, 100%); flex: 1 1 280px; }
.voice-picker-btn {
  width: 100%; min-height: 36px;
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 4px 10px;
  padding: 5px 10px;
  border: 1px solid rgba(15, 23, 42, .10);
  border-radius: 10px;
  background: rgba(255, 255, 255, .72);
  color: var(--text);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.72), 0 12px 28px rgba(15,23,42,.06);
  backdrop-filter: blur(18px) saturate(1.2);
  text-align: left;
}
.voice-picker-btn span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12.5px; font-weight: 800; }
.voice-picker-btn em { grid-column: 1 / 2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10.5px; font-style: normal; color: var(--faint); }
.voice-picker-btn svg { grid-column: 2 / 3; grid-row: 1 / 3; color: var(--muted); }
.voice-picker-btn:hover { border-color: rgba(37, 99, 235, .20); background: rgba(255,255,255,.86); }
.voice-menu {
  position: absolute; z-index: 60; top: calc(100% + 8px); left: 0;
  width: min(430px, calc(100vw - 44px)); max-height: 330px; overflow: auto;
  padding: 8px;
  border: 1px solid rgba(15, 23, 42, .12);
  border-radius: 18px;
  background: rgba(248, 251, 255, .88);
  box-shadow: 0 24px 70px rgba(15, 23, 42, .18), inset 0 1px 0 rgba(255,255,255,.88);
  backdrop-filter: blur(26px) saturate(1.25);
}
.voice-menu-group + .voice-menu-group { margin-top: 8px; padding-top: 8px; border-top: 1px solid rgba(15,23,42,.08); }
.voice-menu-title { padding: 2px 4px 6px; font-size: 10.5px; font-weight: 800; color: var(--faint); letter-spacing: .04em; }
.voice-option {
  width: 100%;
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 9px 10px;
  border: 1px solid transparent;
  border-radius: 12px;
  color: var(--muted);
  transition: all var(--t-fast);
}
.voice-option span { min-width: 0; display: inline-flex; align-items: center; gap: 8px; }
.voice-option b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); font-size: 12px; }
.voice-option em { flex: 0 0 auto; font-size: 10.5px; font-style: normal; color: var(--faint); }
.voice-option:hover { background: rgba(255,255,255,.74); border-color: rgba(15,23,42,.08); transform: translateY(-1px); }
.voice-option.is-active {
  color: #0f172a;
  border-color: rgba(37,99,235,.20);
  background: rgba(255,255,255,.82);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.66), 0 10px 24px rgba(37,99,235,.08);
}
.voice-option.is-fav svg { color: #1f4f9a; }
.voice-action-active {
  border-color: rgba(37, 99, 235, .18) !important;
  background: rgba(255, 255, 255, .76) !important;
  color: #13233f !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.65), 0 10px 24px rgba(15,23,42,.06);
}
.voice-id-search { display: inline-flex; align-items: center; gap: 6px; min-width: min(320px, 100%); }
.voice-id-search .input { min-width: 180px; flex: 1; }
#wsBriefbar.video-briefbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 10px;
}
#wsBriefbar.video-briefbar > .refbar-left {
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 0 2px;
}
#wsBriefbar.video-briefbar > .refbar-left b {
  flex: none;
}
#wsBriefbar.video-briefbar > .refbar-left em {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#wsBriefbar.video-briefbar > .ws-brief-fields {
  width: 100%;
  min-width: 0;
}
#wsBriefbar.video-briefbar .ws-brief-fields {
  flex: none;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 7px;
  align-items: stretch;
  min-width: 0;
}
#wsBriefbar.video-briefbar .ws-topic-row {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(320px, 1fr) minmax(160px, 240px) minmax(116px, auto) minmax(118px, auto);
  gap: 8px;
  align-items: stretch;
  min-width: 0;
}
#wsBriefbar.video-briefbar .ws-topic-row.is-custom {
  grid-template-columns: minmax(0, 1fr) minmax(116px, 160px) minmax(118px, 180px);
  justify-content: end;
}
.ws-brief-heading {
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 0 2px;
}
.ws-brief-heading b {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex: none;
  font-size: 12.5px;
  color: var(--ink);
}
.ws-brief-heading em {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-style: normal;
  color: var(--faint);
  font-size: 11px;
}
#wsBriefGenerate {
  min-height: 42px;
  justify-content: center;
  white-space: nowrap;
}
.ws-topic-actions {
  display: flex;
  align-items: stretch;
  justify-content: flex-end;
  gap: 10px;
  min-width: 0;
}
.ws-topic-actions #wsBriefGenerate {
  min-width: 132px;
  flex: 0 0 auto;
}
.ws-topic-actions #wsNext {
  min-width: 220px;
  min-height: 42px;
  padding-inline: 22px;
  flex: 0 0 auto;
}
.ws-copy-mode {
  min-height: 42px;
  justify-content: center;
  white-space: nowrap;
}
.ws-copy-mode.is-active {
  border-color: rgba(37, 99, 235, .2);
  color: #1d4ed8;
  background: rgba(239, 246, 255, .86);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.72), 0 10px 22px rgba(37,99,235,.08);
}
.ws-brief-actions {
  display: flex;
  align-items: stretch;
  justify-content: flex-end;
  gap: 6px;
  min-width: 0;
  white-space: nowrap;
}
.ws-brief-actions .btn {
  min-height: 42px;
  padding-inline: 12px;
}
#wsBriefbar.video-briefbar .ws-copy-fields {
  grid-column: 1 / -1;
  flex: none;
  display: grid;
  grid-template-columns: minmax(220px, .36fr) minmax(0, 1fr);
  gap: 8px;
  align-items: stretch;
  min-width: 0;
}
#wsBriefbar.video-briefbar .ws-copy-fields .input { width: 100%; min-width: 0; min-height: 42px; }
#wsBriefbar.video-briefbar .ws-copy-fields #wsCopyTitle {
  min-height: 92px;
  max-height: 92px;
  resize: none;
  line-height: 1.55;
}
#wsBriefbar.video-briefbar .ws-copy-fields textarea {
  min-height: 56px;
  max-height: 92px;
  resize: vertical;
  line-height: 1.55;
}
#wsBriefbar.video-briefbar .ws-copy-fields #wsCopyBody {
  min-height: 92px;
}
#wsBriefbar.is-digital-human .ws-brief-fields {
  grid-template-columns: minmax(0, 1fr);
}
#wsBriefbar.is-digital-human .ws-topic-row,
#wsBriefbar.is-digital-human .ws-copy-fields,
#wsBriefbar.is-digital-human .ws-narration-inline,
#wsBriefbar.is-digital-human .ws-cover-inline {
  grid-column: 1 / -1;
  grid-row: auto;
}
#wsBriefbar.is-digital-human .ws-copy-fields {
  grid-template-columns: minmax(0, 1fr);
}
#wsBriefbar.is-digital-human .ws-copy-fields #wsCopyTitle {
  min-height: 58px;
  max-height: 76px;
}
#wsBriefbar.is-digital-human .ws-copy-fields #wsCopyBody {
  min-height: 112px;
  max-height: 180px;
}
#wsBriefbar.is-digital-human .ws-narration-inline textarea {
  min-height: 150px;
}
#wsBriefbar.is-digital-human .ws-cover-inline {
  min-height: 250px;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 250px);
}
#wsBriefbar.is-digital-human .ws-cover-inline .cover-frame,
#wsBriefbar.is-digital-human .ws-cover-inline .cover-empty,
#wsBriefbar.is-digital-human .ws-cover-inline .cover-loading {
  min-height: 220px;
}
#wsBriefbar.custom-copy-mode #wsCopyTitle:placeholder-shown {
  border-color: rgba(96, 165, 250, .55);
  background:
    linear-gradient(135deg, rgba(239, 246, 255, .96), rgba(255, 255, 255, .92));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.86),
    0 0 0 3px rgba(59, 130, 246, .09),
    0 12px 24px rgba(37, 99, 235, .08);
  animation: requiredPulse 1.8s ease-in-out infinite;
}
#wsBriefbar.custom-copy-mode #wsCopyTitle:focus {
  animation: none;
}
@keyframes requiredPulse {
  0%, 100% { box-shadow: inset 0 1px 0 rgba(255,255,255,.86), 0 0 0 3px rgba(59, 130, 246, .08), 0 12px 24px rgba(37, 99, 235, .07); }
  50% { box-shadow: inset 0 1px 0 rgba(255,255,255,.86), 0 0 0 5px rgba(59, 130, 246, .14), 0 14px 28px rgba(37, 99, 235, .1); }
}
.ws-narration-inline {
  grid-column: 1 / 2;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  align-items: stretch;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid rgba(15, 23, 42, .075);
  border-radius: 14px;
  background: rgba(255,255,255,.54);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.68);
}
.ws-inline-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-width: 0;
}
.ws-inline-label {
  display: flex;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
}
.ws-inline-label b {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: none;
  font-size: 12px;
  color: var(--ink);
}
.ws-inline-label em {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--faint);
  font-style: normal;
  font-size: 10.5px;
  line-height: 1.45;
}
.ws-narration-inline textarea {
  min-height: 126px;
  max-height: 190px;
  resize: vertical;
  line-height: 1.56;
}
#wsBriefbar.video-brief-coverbar {
  align-items: start;
}
#wsBriefbar.video-brief-coverbar > .refbar-left { padding-top: 2px; }
#wsBriefbar.video-brief-coverbar .ws-brief-fields { gap: 8px; }
.ws-cover-inline {
  grid-column: 2 / 3;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(132px, 172px);
  gap: 10px;
  align-items: stretch;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid rgba(15, 23, 42, .075);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(248,251,255,.78), rgba(255,255,255,.58));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.72);
}
.ws-cover-inline.drag-over {
  border-color: rgba(37, 99, 235, .28);
  background: rgba(238, 245, 255, .86);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .08), inset 0 1px 0 rgba(255,255,255,.78);
}
.ws-cover-inline .cover-frame {
  order: 2;
  width: 100%;
  max-width: none;
  min-height: 176px;
  border-radius: 12px;
}
.ws-cover-inline .cover-frame.drag-over {
  border-color: var(--brand);
  background: rgba(238, 245, 255, .94);
  box-shadow: var(--ring);
  transform: translateY(-1px);
}
.ws-cover-inline .cover-empty,
.ws-cover-inline .cover-loading {
  width: calc(100% - 8px);
  min-height: 148px;
  border-radius: 10px;
}
.ws-cover-inline .cover-frame.has-cover > span {
  left: 4px;
  right: 4px;
  bottom: 4px;
  font-size: 9px;
}
.ws-cover-fields {
  order: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
  min-width: 0;
}
.ws-cover-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  min-width: 0;
}
.ws-cover-label {
  display: flex;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
}
.ws-cover-label b {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex: none;
  font-size: 12px;
  color: var(--ink);
}
.ws-cover-label em {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-style: normal;
  color: var(--faint);
  font-size: 10.5px;
}
.ws-cover-inline #wsCoverPrompt {
  min-height: 42px;
  max-height: 68px;
  resize: vertical;
  line-height: 1.48;
}
.ws-cover-inline .cover-ref-strip {
  min-height: 22px;
  gap: 5px;
}
.ws-cover-inline .ref-chip {
  max-width: 190px;
}
.ws-cover-inline .ref-chip > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ws-cover-actions {
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  gap: 6px;
  min-width: 0;
  white-space: nowrap;
}
.ws-cover-actions .btn {
  min-height: 34px;
  padding: 5px 10px;
  justify-content: center;
}
#wsBriefbar.no-narration .ws-cover-inline {
  grid-column: 2 / 3;
  grid-row: 2;
  grid-template-columns: minmax(0, 1fr) minmax(156px, 220px);
  min-height: 356px;
  height: 356px;
  box-sizing: border-box;
}
#wsBriefbar.no-narration .ws-brief-fields {
  grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
  grid-template-rows: auto 356px;
  gap: 10px 12px;
}
#wsBriefbar.no-narration .ws-copy-fields {
  grid-column: 1 / 2;
  grid-row: 2;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: 86px minmax(0, 1fr);
  align-content: stretch;
  gap: 8px;
  align-self: stretch;
  min-height: 356px;
  height: 356px;
}
#wsBriefbar.no-narration .ws-copy-fields #wsCopyTitle {
  min-height: 86px;
  max-height: 86px;
}
#wsBriefbar.no-narration .ws-copy-fields #wsCopyBody {
  min-height: 0;
  max-height: none;
  height: 100%;
}
#wsBriefbar.no-narration .ws-copy-fields textarea {
  min-height: 0;
  max-height: none;
}
#wsBriefbar.no-narration .ws-cover-inline #wsCoverPrompt {
  min-height: 238px;
  max-height: 264px;
}
#wsBriefbar.no-narration .ws-cover-inline .cover-frame {
  min-height: 338px;
}
#wsBriefbar.no-narration .ws-cover-inline .cover-empty,
#wsBriefbar.no-narration .ws-cover-inline .cover-loading {
  min-height: 318px;
}
#wsBriefbar.no-narration .ws-cover-toolbar {
  grid-template-columns: minmax(0, 1fr);
}
#wsBriefbar.no-narration .ws-cover-actions {
  justify-content: flex-start;
  flex-wrap: wrap;
}
@media (max-width: 980px) {
  #wsBriefbar.no-narration .ws-brief-fields,
  #wsBriefbar.no-narration .ws-topic-row,
  #wsBriefbar.no-narration .ws-copy-fields,
  #wsBriefbar.no-narration .ws-cover-inline {
    grid-column: 1 / -1;
    grid-row: auto;
  }
  #wsBriefbar.no-narration .ws-brief-fields { grid-template-rows: auto; }
  #wsBriefbar.no-narration .ws-copy-fields,
  #wsBriefbar.no-narration .ws-cover-inline {
    min-height: 0;
    height: auto;
  }
  #wsBriefbar.no-narration .ws-cover-inline { grid-template-columns: minmax(0, 1fr); }
}

/* v127 homepage: unified sidebar + Miaoda-like creation stage + single animated mascot. */
.product-home-lovart.product-home-miaoda {
  --home-pointer-x: 50%;
  --home-pointer-y: 20%;
  min-height: 100%;
  overflow: hidden;
  background:
    radial-gradient(520px 310px at var(--home-pointer-x) var(--home-pointer-y), rgba(103, 164, 255, .13), transparent 72%),
    radial-gradient(540px 280px at calc(var(--home-pointer-x) + 12%) calc(var(--home-pointer-y) + 9%), rgba(221, 179, 86, .075), transparent 74%),
    #fff;
  color: #171b23;
  transition: background-position 120ms linear;
}
.product-home-miaoda .home-topline {
  position: fixed;
  top: 15px;
  left: auto;
  right: 22px;
  width: auto;
  padding: 0;
  justify-content: flex-end;
  border: 0;
  background: transparent;
  pointer-events: none;
  z-index: 74;
}
.product-home-miaoda .home-account-tools { pointer-events: auto; }
.product-home-miaoda .home-main {
  width: min(1120px, calc(100% - 48px));
  margin: 0 auto;
}
.product-home-miaoda .home-hero-composer {
  position: relative;
  min-height: 510px;
  padding: 82px 0 46px;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  isolation: isolate;
}
.home-hero-wordmark {
  position: absolute;
  top: 60px;
  left: 50%;
  z-index: -1;
  color: #7da9ef;
  font-family: "I.PenCrane-B", "Avenir Next", sans-serif;
  font-size: clamp(112px, 12vw, 178px);
  font-weight: 400;
  letter-spacing: -.055em;
  line-height: 1;
  opacity: .055;
  white-space: nowrap;
  transform: translateX(-50%);
  animation: homeWordmarkDrift 10s ease-in-out infinite alternate;
  user-select: none;
}
.home-hero-title {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
}
.product-home-miaoda .home-mascot-hero {
  width: 126px;
  height: 126px;
  margin: 0;
  flex: none;
}
.product-home-miaoda .home-pet {
  position: relative;
  width: 100%;
  height: 100%;
  display: block;
  filter: drop-shadow(0 14px 21px rgba(41, 112, 230, .18));
}
.product-home-miaoda .home-pet picture {
  width: 100%;
  height: 100%;
  display: block;
}
.product-home-miaoda .home-pet img {
  position: static;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  opacity: 1;
  transform-origin: 46% 64%;
  animation: homeMeteorDrift 4.8s cubic-bezier(.45,.04,.35,1) infinite;
}
.product-home-miaoda .home-hero-title-art {
  position: relative;
  width: min(440px, 48vw);
  aspect-ratio: 7.44 / 1;
  display: block;
  overflow: hidden;
  filter: drop-shadow(0 10px 20px rgba(40, 114, 229, .08));
}
.product-home-miaoda .home-hero-title-art img {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: auto;
  transform: translateY(-50%);
  animation: homeTitleBreath 5.8s ease-in-out infinite;
}
.product-home-miaoda .home-hero-title-art::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, transparent 22%, rgba(255,255,255,.96) 44%, rgba(247, 204, 106, .72) 50%, transparent 66%);
  background-size: 240% 100%;
  -webkit-mask: url("../assets/brand/starmatrix-hero-title-transparent.png") center / 100% auto no-repeat;
  mask: url("../assets/brand/starmatrix-hero-title-transparent.png") center / 100% auto no-repeat;
  mix-blend-mode: screen;
  animation: homeHeroShimmer 5.4s ease-in-out infinite;
  pointer-events: none;
}
.product-home-miaoda .home-hero-composer > p {
  margin: 10px 0 24px;
  color: #9aa1ad;
  font-family: "DFPHeiW3-GB", "华康黑体W3(P)", "PingFang SC", sans-serif;
  font-size: 13px;
  letter-spacing: .02em;
}
.home-composer-stage {
  position: relative;
  z-index: 2;
  width: min(760px, 100%);
  margin-top: 4px;
}
.home-composer-stage::before {
  content: "";
  position: absolute;
  z-index: -2;
  left: -62px;
  right: -62px;
  top: 48%;
  bottom: -100px;
  opacity: .58;
  background:
    linear-gradient(rgba(104, 159, 235, .085) 1px, transparent 1px),
    linear-gradient(90deg, rgba(224, 182, 92, .072) 1px, transparent 1px),
    radial-gradient(circle at 50% 15%, rgba(91, 155, 245, .17), transparent 63%);
  background-size: 34px 34px, 34px 34px, 100% 100%;
  transform: perspective(460px) rotateX(60deg) translateY(-6px);
  transform-origin: center top;
  -webkit-mask-image: linear-gradient(to bottom, #000, transparent 88%);
  mask-image: linear-gradient(to bottom, #000, transparent 88%);
  animation: homeGridTravel 11s linear infinite;
  pointer-events: none;
}
.home-lightfall {
  position: absolute;
  left: -76px;
  right: -76px;
  top: 22px;
  bottom: -96px;
  z-index: -1;
  overflow: hidden;
  border-radius: 46px;
  opacity: .95;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 18%, #000 76%, transparent 100%);
  mask-image: linear-gradient(to bottom, transparent 0%, #000 18%, #000 76%, transparent 100%);
}
.home-lightfall::after {
  content: "";
  position: absolute;
  inset: 12% 8% 0;
  border-radius: 50%;
  background: radial-gradient(ellipse at 50% 52%, rgba(120, 168, 255, .20), transparent 68%);
  filter: blur(22px);
}
.home-lightfall-canvas {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}
.product-home-miaoda .home-composer {
  position: relative;
  width: 100%;
  height: 166px;
  min-height: 0;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  padding: 14px 16px 13px;
  overflow: visible;
  border: 1px solid rgba(209, 215, 224, .92);
  border-radius: 25px;
  background: rgba(255, 255, 255, .96);
  box-shadow:
    0 22px 56px rgba(38, 57, 87, .11),
    0 0 0 5px rgba(112, 165, 255, .045);
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}
.home-drop-feedback {
  position: absolute;
  z-index: 12;
  inset: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border: 1.5px dashed #6aa9f1;
  border-radius: 19px;
  background: rgba(242, 248, 255, .96);
  color: #276bb9;
  font-size: 13px;
  opacity: 0;
  visibility: hidden;
  transform: scale(.985);
  transition: opacity 150ms ease, visibility 150ms ease, transform 150ms ease;
  pointer-events: none;
}
.product-home-miaoda .home-composer.is-dragging .home-drop-feedback {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
}
.product-home-miaoda .home-composer:focus-within,
.product-home-miaoda .home-composer.is-dragging {
  border-color: #8ebaff;
  box-shadow:
    0 25px 64px rgba(38, 72, 126, .14),
    0 0 0 5px rgba(105, 167, 255, .10);
  transform: translateY(-1px);
}
.product-home-miaoda .home-composer textarea {
  width: 100%;
  min-height: 0;
  padding: 8px 8px 6px;
  resize: none;
  border: 0;
  outline: 0;
  background: transparent;
  color: #242930;
  font-family: inherit;
  font-size: 15px;
  line-height: 1.65;
}
.product-home-miaoda .home-composer textarea::placeholder { color: #9299a4; opacity: 1; }
.product-home-miaoda .home-composer:has(.home-attachment-strip:not([hidden])) textarea {
  padding-top: 58px;
}
.product-home-miaoda .home-composer footer {
  min-width: 0;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 44px;
  align-items: center;
  gap: 9px;
}
.product-home-miaoda .home-composer-left {
  min-width: 0;
  display: flex;
  align-items: center;
}
.product-home-miaoda .home-add-file {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: #4f5660;
  cursor: pointer;
  transition: background 160ms ease, color 160ms ease, transform 160ms ease;
}
.product-home-miaoda .home-add-file:hover {
  background: #eef4fc;
  color: #2c70c9;
  transform: translateY(-1px);
}
.home-composer-tools {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
}
.product-home-miaoda .home-composer footer > .home-composer-tools {
  gap: 8px;
  color: inherit;
  font-size: inherit;
}
.product-home-miaoda .home-mode-switch {
  position: relative;
  width: 198px;
  height: 40px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  padding: 3px;
  border: 1px solid #dfe3e9;
  border-radius: 13px;
  background: #f7f8fa;
  box-shadow: none;
}
.product-home-miaoda .home-mode-switch > i {
  position: absolute;
  inset: 3px auto 3px 3px;
  width: calc(50% - 3px);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 4px 12px rgba(34, 44, 60, .08);
  transition: transform 220ms cubic-bezier(.2,.8,.2,1);
}
.product-home-miaoda .home-composer[data-mode="canvas"] .home-mode-switch > i { transform: translateX(100%); }
.product-home-miaoda .home-mode-switch button {
  position: relative;
  z-index: 1;
  min-width: 0;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 8px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #858c96;
  font-size: 12px;
  font-weight: 500;
  white-space: nowrap;
}
.product-home-miaoda .home-mode-switch button:hover,
.product-home-miaoda .home-mode-switch button.is-active { color: #252a31; transform: none; }
.product-home-miaoda .home-mode-switch button > em {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 11px);
  width: max-content;
  max-width: 235px;
  padding: 8px 10px;
  border-radius: 9px;
  background: rgba(24, 29, 38, .94);
  color: #fff;
  font-size: 10.5px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.45;
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, 5px);
  transition: opacity 150ms ease, transform 150ms ease, visibility 150ms ease;
  pointer-events: none;
}
.product-home-miaoda .home-mode-switch button:hover > em,
.product-home-miaoda .home-mode-switch button:focus-visible > em {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
}
.product-home-miaoda .home-video-mode {
  position: relative;
  width: 98px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
  flex: none;
  padding: 0 9px 0 11px;
  overflow: hidden;
  border: 1px solid #dfe3e9;
  border-radius: 12px;
  background: #fff;
  color: #353b43;
  box-shadow: none;
  transition: border-color 160ms ease, box-shadow 160ms ease, color 160ms ease;
}
.product-home-miaoda .home-video-mode[hidden] { display: none; }
.product-home-miaoda .home-video-mode:hover,
.product-home-miaoda .home-video-mode:focus-visible {
  border-color: #abc6e8;
  color: #1f67bd;
  box-shadow: 0 6px 16px rgba(42, 94, 157, .09);
  outline: 0;
}
.home-video-mode-wheel {
  width: 59px;
  height: 19px;
  overflow: hidden;
  display: block;
}
.home-video-mode-wheel b {
  height: 19px;
  display: flex;
  align-items: center;
  color: inherit;
  font-size: 11px;
  font-weight: 520;
  line-height: 19px;
  white-space: nowrap;
  transition: transform 300ms cubic-bezier(.16,1,.3,1), opacity 210ms ease;
}
.home-video-mode[data-mode="static"] .home-video-mode-wheel b {
  transform: translateY(-19px);
}
.home-video-mode > svg {
  flex: none;
  transition: transform 320ms cubic-bezier(.16,1,.3,1);
}
.home-video-mode[data-mode="static"] > svg {
  transform: rotate(180deg);
}
.product-home-miaoda .home-submit {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: #20242a;
  color: #fff;
  box-shadow: 0 8px 20px rgba(22, 28, 38, .20);
  transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease;
}
.product-home-miaoda .home-submit:hover {
  background: #2c70cc;
  box-shadow: 0 11px 25px rgba(44, 112, 204, .24);
  transform: translateY(-2px);
}
.product-home-miaoda .home-attachment-strip {
  top: 15px;
  left: 25px;
  right: 25px;
  max-width: none;
}
.product-home-miaoda .home-discovery {
  padding: 0 0 84px;
}
.product-home-miaoda .home-discovery > header h2 {
  font-size: 25px;
}
.product-home-miaoda .home-category-tabs {
  margin: 13px 0 12px;
  gap: 22px;
}
.product-home-miaoda .home-inspiration-grid {
  columns: 4;
  column-gap: 8px;
}
.product-home-miaoda .home-inspiration-card {
  margin: 0 0 8px;
  break-inside: avoid;
  border-radius: 15px;
}
.product-home-miaoda .home-inspiration-media {
  min-height: 0;
  border-radius: 15px;
}
.product-home-miaoda .home-inspiration-card:nth-child(n) .home-inspiration-media {
  min-height: 0;
}
@keyframes homeMeteorDrift {
  0%, 100% { transform: translate3d(-2px, 1px, 0) rotate(-2.2deg) scale(.985); filter: saturate(1) brightness(1); }
  42% { transform: translate3d(4px, -7px, 0) rotate(1.3deg) scale(1.018); filter: saturate(1.08) brightness(1.04); }
  68% { transform: translate3d(1px, -4px, 0) rotate(-.4deg) scale(1.005); }
}
@keyframes homeWordmarkDrift {
  from { transform: translateX(-51.2%); opacity: .044; }
  to { transform: translateX(-48.8%); opacity: .066; }
}
@keyframes homeTitleBreath {
  0%, 100% { transform: translateY(-50%) scale(.992); filter: saturate(.98) brightness(.99); }
  50% { transform: translateY(-50%) scale(1.008); filter: saturate(1.08) brightness(1.03); }
}
@keyframes homeHeroShimmer {
  0%, 20% { background-position: 130% 0; opacity: 0; }
  38% { opacity: .86; }
  68%, 100% { background-position: -90% 0; opacity: 0; }
}
@keyframes homeGridTravel {
  from { background-position: 0 0, 0 0, center; }
  to { background-position: 0 34px, 34px 0, center; }
}
@media (min-width: 1540px) {
  .product-home-miaoda .home-main { width: min(1440px, calc(100% - 64px)); }
}
@media (max-width: 1080px) {
  .product-home-miaoda .home-main { width: min(900px, calc(100% - 36px)); }
  .product-home-miaoda .home-inspiration-grid { columns: 3; }
}
@media (max-width: 760px) {
  .product-home-miaoda .home-topline { right: 12px; top: 10px; }
  .product-home-miaoda .home-main { width: calc(100% - 24px); }
  .product-home-miaoda .home-hero-composer { min-height: 540px; padding-top: 88px; }
  .home-hero-wordmark { top: 78px; font-size: 72px; }
  .home-hero-title { gap: 10px; }
  .product-home-miaoda .home-mascot-hero { width: 68px; height: 68px; }
  .product-home-miaoda .home-hero-title-art { width: min(330px, 66vw); }
  .product-home-miaoda .home-composer { height: 188px; padding-inline: 14px; }
  .product-home-miaoda .home-composer footer { grid-template-columns: 38px minmax(0, 1fr) 42px; gap: 7px; }
  .home-composer-tools { justify-content: flex-start; overflow-x: auto; scrollbar-width: none; }
  .product-home-miaoda .home-mode-switch { width: 190px; flex: 0 0 190px; }
  .product-home-miaoda .home-video-mode { width: 96px; flex: 0 0 96px; }
  .product-home-miaoda .home-inspiration-grid { columns: 2; }
  .home-lightfall { left: -18px; right: -18px; }
}
@media (max-width: 480px) {
  .product-home-miaoda .home-inspiration-grid { columns: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .home-hero-wordmark,
  .product-home-miaoda .home-pet img,
  .product-home-miaoda .home-hero-title-art img,
  .product-home-miaoda .home-hero-title-art::after,
  .home-composer-stage::before { animation: none !important; }
}
#wsAudioBar {
  position: relative;
  z-index: 24;
  overflow: visible;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  gap: 10px;
  padding-block: 14px;
}
#wsAudioBar:has(.voice-menu:not([hidden])) { z-index: 100; isolation: isolate; }
#wsAudioBar > .refbar-left {
  width: 100%;
  max-width: none;
  padding: 0 2px;
}
#wsAudioBar > .refbar-chip { width: 100%; min-width: 0; }
#wsAudioBar > .refbar-chip:empty { display: none; }
#wsAudioBar .refbar-actions.voice-audio-actions {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
  align-items: stretch;
  gap: 10px;
  justify-content: stretch;
}
.voice-main-controls {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-auto-rows: minmax(36px, auto);
  align-content: start;
  gap: 8px;
  min-width: 0;
}
.voice-account-fixed { min-height: 40px; display: flex; align-items: center; gap: 9px; padding: 7px 11px; border: 1px solid var(--line); border-radius: 9px; color: var(--muted); background: var(--soft); }
.voice-account-fixed > span { min-width: 0; display: grid; gap: 2px; }
.voice-account-fixed b { color: var(--text); font-size: 12px; }
.voice-account-fixed em { color: var(--faint); font-size: 10.5px; font-style: normal; }
.voice-main-controls .voice-picker { width: 100%; min-width: 0; flex: none; }
.voice-main-controls .voice-picker:has(.voice-menu:not([hidden])) { z-index: 30; }
.voice-main-controls .voice-id-search { width: 100%; min-width: 0; }
.voice-main-controls .voice-id-search .input,
.voice-main-controls .voice-id-search .btn { min-height: 36px; height: 36px; }
.voice-main-controls .voice-picker,
.voice-main-controls .voice-id-search,
.voice-main-controls .input,
.voice-side-actions .btn,
.voice-side-actions label.btn {
  border-radius: 10px !important;
}
.voice-side-actions {
  display: grid;
  grid-template-columns: minmax(78px, 92px) minmax(148px, 1fr);
  align-items: stretch;
  justify-content: flex-end;
  gap: 6px;
  min-width: 0;
}
.voice-side-actions .btn,
.voice-side-actions label.btn { min-height: 32px; padding-block: 5px; }
.voice-fav-btn {
  min-height: 32px !important;
  align-self: stretch;
  justify-content: center;
  border-radius: 10px !important;
}
.voice-stacked-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 6px;
  min-width: 0;
}
.voice-side-actions > .voice-stacked-actions:only-child { grid-column: 1 / -1; }
.voice-stacked-actions .btn,
.voice-stacked-actions label.btn {
  width: 100%;
  justify-content: center;
}
.voice-lookup-note {
  display: block;
  margin-top: 0;
  padding: 8px 10px;
  border-radius: 8px;
  background: var(--soft);
  color: var(--muted);
  font-size: 11.5px;
  line-height: 1.6;
  font-style: normal;
}
.voice-lookup-note.full { flex: 1 1 100%; margin-top: -4px; }

#wsCoverBar.is-detached-cover {
  width: 100%;
  margin-top: 12px;
  padding: 14px;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 250px);
  border: 1px solid var(--hairline);
  background: #fff;
}
#wsCoverBar.is-detached-cover .cover-frame,
#wsCoverBar.is-detached-cover .cover-empty,
#wsCoverBar.is-detached-cover .cover-loading { min-height: 220px; }

@media (max-width: 900px) {
  #wsBriefbar.video-briefbar {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  #wsBriefbar.video-briefbar .ws-topic-row,
  #wsBriefbar.video-briefbar .ws-copy-fields,
  #wsBriefbar.video-briefbar .ws-brief-fields,
  .ws-inline-head {
    grid-template-columns: 1fr;
    min-width: 100%;
  }
  .ws-narration-inline,
  .ws-cover-inline,
  #wsBriefbar.no-narration .ws-cover-inline {
    grid-column: 1 / -1;
  }
  .ws-inline-label {
    display: grid;
    gap: 4px;
  }
  .ws-brief-actions,
  .ws-cover-actions,
  .ws-topic-actions {
    justify-content: stretch;
    flex-wrap: wrap;
  }
  .ws-brief-actions .btn,
  .ws-cover-actions .btn,
  .ws-topic-actions .btn {
    flex: 1 1 140px;
  }
  #wsAudioBar .refbar-actions.voice-audio-actions {
    grid-template-columns: 1fr;
  }
  .voice-main-controls { grid-template-columns: 1fr; }
  #wsCoverBar.is-detached-cover { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .ws-cover-inline {
    grid-template-columns: 1fr;
  }
  .ws-cover-inline .cover-frame {
    order: 0;
    width: 100%;
    min-height: 122px;
  }
  .ws-cover-toolbar {
    grid-template-columns: 1fr;
  }
  .ws-cover-actions .btn {
    white-space: normal;
  }
}

/* ---------- 语音生成工作台 ---------- */
.voice-lab-page {
  max-width: 1500px;
  margin: 0 auto;
  height: calc(100dvh - 74px);
  min-height: 660px;
  padding: 0 clamp(10px, 1.4vw, 18px) 10px;
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  gap: 0;
  overflow: hidden;
}
.vl-topbar {
  min-height: 46px;
  width: min(100%, 980px);
  max-width: 100%;
  justify-self: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 6px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.topbar-voice-dock {
  position: absolute;
  left: 50%;
  top: 6px;
  z-index: 3;
  width: clamp(520px, 48vw, 760px);
  min-height: 40px;
  height: 40px;
  transform: translateX(-50%);
  justify-content: center;
  padding: 0;
  border-radius: 0;
  box-shadow: none;
}
.topbar-voice-dock .vl-mode-tabs button {
  min-width: 78px;
  padding: 7px 12px;
}
.topbar-voice-dock .vl-mode-liquid {
  width: 78px;
  transform: translateX(calc(var(--i, 0) * 82px));
}
.topbar-voice-dock .vl-mini-status {
  min-width: 210px;
  padding: 6px 10px;
}
.vl-mode-tabs {
  position: relative;
  display: inline-flex;
  gap: 4px;
  padding: 0;
  border-radius: 14px;
  isolation: isolate;
}
.vl-mode-tabs button {
  position: relative;
  z-index: 2;
  min-width: 82px;
  border-radius: 12px;
  padding: 9px 13px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
  transition: color 180ms ease, transform 160ms ease;
}
.vl-mode-tabs button:active { transform: scale(.985); }
.vl-mode-tabs button.is-active {
  color: #fff;
  background: transparent;
  box-shadow: none;
}
.vl-mode-liquid {
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0;
  width: 82px;
  height: 100%;
  border-radius: 13px;
  transform: translateX(calc(var(--i, 0) * 86px));
  background:
    radial-gradient(circle at 28% 18%, rgba(255,255,255,.38), transparent 32%),
    linear-gradient(135deg, rgba(17,24,39,.96), rgba(45,63,91,.84));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.24),
    inset 10px 0 18px rgba(255,255,255,.05),
    0 8px 18px rgba(15,23,42,.13);
  transition:
    transform 260ms cubic-bezier(.24,.86,.32,1),
    border-radius 180ms ease;
}
.vl-mini-status {
  min-width: 220px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 11px;
  border-radius: 0;
  border: 0;
  border-left: 1px solid var(--line);
  color: #111827;
  background: transparent;
  box-shadow: none;
  white-space: nowrap;
}
.vl-mini-status span {
  color: var(--faint);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.vl-mini-status b { color: var(--text); font-size: 12px; font-weight: 900; }
.vl-mini-status em { font-style: normal; color: var(--muted); font-size: 10.5px; font-weight: 700; }
.vl-workbench {
  display: grid;
  grid-template-columns: minmax(260px, .68fr) minmax(0, 1.22fr) minmax(310px, .72fr);
  gap: 0;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.58);
  min-height: 0;
}
@keyframes vlPanelIn {
  from { opacity: 0; transform: translateY(5px) scale(.998); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes vlPanelOut {
  from { opacity: 1; transform: translateY(0) scale(1); }
  to { opacity: 0; transform: translateY(3px) scale(.998); }
}
.vl-workbench > .glass-panel {
  min-height: 0;
  padding: 14px;
  border: 0;
  border-right: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: hidden;
  transition:
    box-shadow 220ms ease,
    background 220ms ease;
}
.vl-workbench > .glass-panel:last-child { border-right: 0; }
.vl-editor,
.vl-library,
.vl-side-panel {
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.vl-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 9px;
}
.vl-section-head.compact { align-items: center; }
.vl-console .vl-section-head.compact .vl-generate-action {
  margin-left: auto;
  margin-right: -20px;
  min-width: 146px;
  min-height: 42px;
}
.vl-console .vl-section-head.compact .vl-generate-action::before {
  border-radius: 13px;
}
.vl-console .vl-section-head.compact .vl-generate-action:hover::before {
  border-radius: 13px;
}
.vl-section-head > div { display: grid; gap: 4px; min-width: 0; }
.vl-section-head b { display: inline-flex; align-items: center; gap: 8px; color: var(--text); font-size: 15px; }
.vl-section-head em { color: var(--muted); font-size: 12px; font-style: normal; line-height: 1.45; }
.vl-section-head .vl-editor-head-actions {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}
.vl-mode-switch-label { color: var(--faint); font-size: 10.5px; font-weight: 750; white-space: nowrap; }
.vl-editor-mode-tabs {
  flex: 0 1 auto;
  min-width: 0;
}
.vl-editor-mode-tabs button {
  min-width: 62px;
  padding: 7px 8px;
  font-size: 11px;
}
.vl-editor-mode-tabs .vl-mode-liquid {
  width: 62px;
  transform: translateX(calc(var(--i, 0) * 66px));
}
.vl-textbox-wrap {
  position: relative;
  flex: 1;
  min-height: 0;
}
.vl-textarea {
  width: 100%;
  height: 100%;
  min-height: 0;
  resize: none;
  border: 1px solid rgba(15,23,42,.10);
  border-radius: 20px;
  background: rgba(255,255,255,.64);
  padding: 22px 24px;
  font: 700 16px/1.8 var(--font);
  color: var(--text);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
}
.vl-typewriter {
  pointer-events: none;
  position: absolute;
  left: 26px;
  top: 24px;
  color: rgba(15,23,42,.38);
  font-size: clamp(19px, 1.65vw, 28px);
  font-weight: 900;
  line-height: 1.35;
  opacity: 1;
  transition: opacity var(--t-fast);
}
.vl-typewriter span {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  white-space: nowrap;
  border-right: 2px solid rgba(15,23,42,.32);
  animation: vlTypeHint 5.2s steps(10, end) infinite;
}
.vl-textarea:focus + .vl-typewriter,
.vl-textbox-wrap.has-value .vl-typewriter,
.vl-textarea:not(:placeholder-shown) + .vl-typewriter { opacity: 0; }
@keyframes vlTypeHint {
  0%, 12% { width: 0; }
  42%, 62% { width: 10.5em; }
  90%, 100% { width: 0; }
}
.vl-textarea:focus,
.vl-field .input:focus { outline: 0; border-color: rgba(15,23,42,.24); box-shadow: 0 0 0 4px rgba(15,23,42,.05); }
.vl-editor-foot {
  display: flex;
  align-items: center;
  gap: 12px;
  justify-content: flex-end;
  color: var(--faint);
  font-size: 12px;
  margin-top: 7px;
}
.vl-editor-foot > span:first-child { margin-right: auto; }
.vl-audio-save-options { display: inline-flex; align-items: center; gap: 12px; }
.vl-save-audio { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: 11px; font-weight: 700; white-space: nowrap; }
.vl-save-audio input { accent-color: #171b22; }
.vl-current-voice {
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid rgba(15,23,42,.09);
  border-radius: 18px;
  background: rgba(255,255,255,.58);
}
.vl-current-voice.is-large { gap: 10px; }
.vl-current-voice b { font-size: 14px; }
.vl-current-voice em { color: var(--muted); font-style: normal; font-size: 11px; word-break: break-all; }
.vl-current-voice i { color: var(--faint); font-style: normal; font-size: 11px; }
.vl-current-voice > div { display: flex; flex-wrap: wrap; gap: 7px; }
.vl-sliders { display: grid; gap: 12px; margin-top: 13px; }
.vl-sliders label {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px 12px;
  font-size: 12px;
  font-weight: 800;
  color: var(--text);
}
.vl-sliders label span { color: var(--muted); font-variant-numeric: tabular-nums; }
.vl-sliders input { grid-column: 1 / -1; accent-color: #111827; }
.vl-tabs {
  display: inline-flex;
  gap: 4px;
  padding: 0 0 8px;
  margin-bottom: 10px;
  border-radius: 0;
  border: 0;
  border-bottom: 1px solid rgba(15,23,42,.08);
  background: transparent;
}
.vl-tabs button { min-width: 0; white-space: nowrap; }
.vl-tabs button {
  border-radius: 11px;
  padding: 8px 13px;
  font-size: 12px;
  font-weight: 850;
  color: var(--muted);
  transition: background 180ms ease, color 180ms ease, transform 150ms ease;
}
.vl-tabs button:active { transform: scale(.985); }
.vl-tabs button.is-active { background: #111827; color: #fff; box-shadow: none; }
.vl-voice-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  min-height: 0;
  overflow: auto;
  padding-right: 4px;
  align-content: start;
}
.vl-voice-card {
  position: relative;
  display: grid;
  gap: 5px;
  min-height: 88px;
  padding: 13px 14px;
  border: 0;
  border-bottom: 1px solid rgba(15,23,42,.08);
  border-radius: 0;
  background: transparent;
  text-align: left;
  cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.72);
  transition: transform 160ms ease, border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}
.vl-voice-card em:last-of-type { white-space: nowrap; }
.vl-voice-card:hover { border-color: rgba(15,23,42,.18); background: rgba(15,23,42,.035); }
.vl-voice-card:active { transform: scale(.992); }
.vl-voice-card.is-active { border-color: rgba(17,24,39,.36); background: rgba(17,24,39,.055); box-shadow: inset 3px 0 0 #171b22; }
.vl-voice-card.is-previewing { border-color: rgba(37,99,235,.34); box-shadow: inset 0 0 0 1px rgba(37,99,235,.12), 0 14px 28px rgba(37,99,235,.09); }
.vl-voice-core { display: inline-flex; align-items: center; gap: 8px; min-width: 0; }
.vl-voice-core b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); font-size: 13px; }
.vl-voice-card em {
  color: var(--muted);
  font-size: 10.5px;
  font-style: normal;
  word-break: break-all;
  padding-right: 92px;
}
.vl-voice-card i { color: var(--faint); font-style: normal; font-size: 10.5px; }
.vl-voice-card.is-fav .vl-voice-core svg { color: #1f4f9a; }
.vl-voice-actions {
  position: absolute;
  right: 10px;
  bottom: 10px;
  display: inline-flex;
  gap: 5px;
}
.icon-btn.tiny { width: 28px; height: 28px; border-radius: 9px; background: rgba(255,255,255,.7); border: 1px solid rgba(15,23,42,.08); }
.vl-empty {
  min-height: 112px;
  display: grid;
  place-items: center;
  padding: 22px 24px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.75;
  text-align: center;
  border: 1px dashed rgba(15,23,42,.13);
  border-radius: 18px;
  background: rgba(255,255,255,.42);
}
.vl-field { display: grid; gap: 8px; margin-bottom: 12px; color: var(--muted); font-size: 12px; font-weight: 800; }
.vl-design-form {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 0;
}
.vl-design-form .vl-field { margin-bottom: 0; }
.vl-design-form .vl-field.grow { flex: 1; min-height: 0; }
.vl-field textarea.input { min-height: auto; line-height: 1.7; resize: none; }
.vl-design-form .vl-field.grow textarea { height: 100%; min-height: 96px; }
.vl-design-form .vl-field:not(.grow) textarea { min-height: 72px; }
.vl-player {
  margin-top: 12px;
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  gap: 8px;
  padding: 12px;
  border: 1px solid rgba(15,23,42,.09);
  border-radius: 18px;
  background: rgba(255,255,255,.62);
}
.vl-player > div:first-child { min-width: 0; display: grid; gap: 2px; }
.vl-player b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); font-size: 13px; }
.vl-player em { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font-size: 11px; font-style: normal; }
.vl-player audio { width: 100%; height: 34px; }
.vl-player-actions { display: flex; justify-content: flex-start; gap: 7px; flex-wrap: wrap; min-width: 0; }
.vl-player-actions .btn { max-width: 100%; white-space: normal; line-height: 1.25; }
.vl-output-slot {
  display: grid;
  gap: 8px;
  min-height: 178px;
  margin-bottom: 12px;
  padding: 12px;
  border: 1px solid rgba(15,23,42,.10);
  border-radius: 18px;
  background: rgba(255,255,255,.48);
  overflow: hidden;
}
.vl-output-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.vl-output-title b { color: var(--text); font-size: 12.5px; }
.vl-output-status { display: grid; justify-items: end; gap: 5px; }
.vl-output-status > span { padding: 3px 7px; border-radius: 999px; color: var(--muted); background: var(--soft); font-size: 9.5px; font-weight: 800; }
.vl-output-quick-actions { display: inline-flex; align-items: center; justify-content: flex-end; gap: 5px; }
.vl-output-quick-actions a,
.vl-output-quick-actions button {
  min-height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 3px 7px;
  border: 1px solid var(--line);
  border-radius: 7px;
  color: var(--muted);
  background: rgba(255,255,255,.68);
  font: inherit;
  font-size: 10px;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
  transition: color 160ms ease, border-color 160ms ease, background 160ms ease, transform 160ms ease;
}
.vl-output-quick-actions a:hover,
.vl-output-quick-actions button:hover { color: var(--text); border-color: var(--line-2); background: #fff; transform: translateY(-1px); }
.vl-output-quick-actions button:hover { color: var(--danger); }
.vl-output-slot .vl-player { margin-top: 0; padding: 0; border: 0; border-radius: 0; background: transparent; }
.vl-output-slot .vl-player-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.vl-output-slot .vl-player-actions .btn { width: 100%; min-width: 0; min-height: 32px; justify-content: center; padding-inline: 7px; white-space: nowrap; }
.vl-output-empty, .vl-output-loading {
  min-height: 124px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 6px;
  padding: 18px;
  border: 1px dashed rgba(15,23,42,.14);
  border-radius: 14px;
  color: var(--muted);
  text-align: center;
}
.vl-output-empty b, .vl-output-loading b { color: var(--text); font-size: 12.5px; }
.vl-output-empty em, .vl-output-loading em { max-width: 230px; color: var(--faint); font-size: 10.5px; font-style: normal; line-height: 1.5; }
.vl-output-empty.is-error { color: var(--danger); border-color: rgba(220,38,38,.2); background: rgba(254,242,242,.48); }
.vl-output-spinner { width: 24px; height: 24px; border: 2px solid rgba(37,99,235,.16); border-top-color: var(--brand); border-radius: 50%; animation: vlOutputSpin .8s linear infinite; }
@keyframes vlOutputSpin { to { transform: rotate(360deg); } }
.view-root.vl-view-switching { overflow-anchor: none; }
.vl-side-panel.is-panel-switching-out { pointer-events: none; animation: vlPanelOut 150ms cubic-bezier(.4,0,1,1) both; }
.vl-side-panel.is-panel-switching-in { animation: vlPanelIn 300ms cubic-bezier(.16,1,.3,1) both; }
.topbar-voice-dock.is-switching { pointer-events: none; }
@media (prefers-reduced-motion: reduce) {
  .vl-side-panel.is-panel-switching-out,
  .vl-side-panel.is-panel-switching-in { animation-duration: 1ms; transform: none; }
}
.vl-design-confirm { display: flex; justify-content: flex-end; gap: 7px; margin-top: 8px; }
.vl-saved-note { margin-top: 10px; padding: 9px 0; color: var(--text); font-size: 12px; font-weight: 800; border-top: 1px solid var(--hairline); }
.vl-audio-library { min-height: 0; margin-top: 10px; overflow-y: auto; display: grid; align-content: start; gap: 12px; scrollbar-gutter: stable; }
.vl-audio-library section { min-width: 0; }
.vl-audio-library-head { min-height: 30px; display: flex; align-items: center; justify-content: space-between; gap: 10px; border-bottom: 1px solid var(--hairline); }
.vl-audio-library-head b { font-size: 12px; }
.vl-audio-library-head em { color: var(--muted); font-size: 10px; font-style: normal; }
.vl-reference-drop { min-height: 48px; display: flex; align-items: center; justify-content: center; gap: 7px; margin-top: 7px; border: 1px dashed rgba(15,23,42,.18); border-radius: 7px; color: var(--muted); background: rgba(255,255,255,.36); font-size: 11px; font-weight: 750; cursor: pointer; transition: border-color 160ms ease, background 160ms ease, color 160ms ease; }
.vl-reference-drop:hover, .vl-reference-drop.drag-over { border-color: rgba(15,23,42,.42); color: var(--text); background: rgba(255,255,255,.7); }
.vl-audio-item { position: relative; display: grid; grid-template-columns: minmax(0,1fr); gap: 5px; padding: 9px 34px 9px 0; border-bottom: 1px solid var(--hairline); }
.vl-audio-item > div { min-width: 0; display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center; gap: 3px 6px; }
.vl-audio-item b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11.5px; }
.vl-audio-item em { grid-column: 2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font-size: 10px; font-style: normal; }
.vl-audio-item audio { width: 100%; height: 28px; }
.vl-audio-item > button { position: absolute; right: 0; top: 10px; }
.vl-tool-note {
  margin-top: 12px;
  display: grid;
  gap: 6px;
  padding: 12px;
  border-radius: 18px;
  border: 1px solid rgba(15,23,42,.08);
  background: rgba(255,255,255,.48);
  color: var(--muted);
  font-size: 12px;
  line-height: 1.65;
}
.vl-tool-note b { color: var(--text); font-size: 13px; }
@media (max-width: 1080px) {
  .voice-lab-page { height: auto; min-height: 0; overflow: visible; }
  .vl-workbench { grid-template-columns: 1fr; }
  .vl-topbar { width: 100%; justify-content: space-between; }
  .topbar-voice-dock {
    position: static;
    width: auto;
    min-width: 0;
    transform: none;
    flex: 1;
  }
  .vl-mini-status { min-width: 0; }
  .vl-textarea { min-height: 280px; }
  .vl-voice-list { max-height: 360px; }
  .vl-section-head .vl-editor-head-actions {
    width: 100%;
    justify-content: space-between;
  }
}
@media (max-width: 720px) {
  .voice-lab-page { padding: 16px; }
  .vl-topbar { padding: 8px; border-radius: 18px; flex-direction: column; align-items: stretch; }
  .vl-mini-status { width: 100%; min-width: 0; justify-content: flex-start; }
  .vl-mode-tabs { width: 100%; overflow: auto; }
  .vl-section-head { flex-direction: column; }
  .vl-section-head .vl-editor-head-actions {
    align-items: stretch;
    flex-direction: column;
  }
  .vl-editor-mode-tabs { width: 100%; }
  .vl-editor-mode-tabs button { flex: 1 0 72px; }
  .vl-editor-head-actions #vlGenerate { width: 100%; }
  .vl-textarea { min-height: 260px; font-size: 15px; }
  .vl-voice-list { grid-template-columns: 1fr; }
}

/* ---------- 剪辑页 ---------- */
.view-root .chain-stepper.cut-stepper { display: flex; max-width: 1320px; margin: 0 auto 8px; top: 0; }
.view-root:has(.cut-page) { display: flex; padding-bottom: 10px; }
.cut-page { max-width: 1320px; width: 100%; margin: 0 auto; display: flex; flex: 1 1 auto; min-height: 0; flex-direction: column; gap: 8px; }
.cut-top { display: grid; flex: 1 1 auto; min-height: 0; grid-template-columns: minmax(0, 1fr) 258px; gap: 8px; align-items: stretch; }
.cut-preview { padding: 10px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; background: linear-gradient(165deg, #0B1020, #101831); min-height: 0; border-radius: 0; }
.cp-screen {
  position: relative; height: clamp(400px, 58vh, 620px); aspect-ratio: 9/16;
  border-radius: 0; overflow: hidden;
  border: 1px solid var(--d-line-2);
  background: #0A0E1A;
}
.cp-video {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; background: #050816; z-index: 0;
}
.cp-video-next { z-index: 1; opacity: 0; pointer-events: none; transition: opacity .08s linear; }
.cp-frame { position: absolute; inset: 0; z-index: 2; transition: background .3s; opacity: .85; pointer-events: none; }
.cp-frame::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(5, 8, 16, .12), rgba(5, 8, 16, .55) 80%); }
.cp-cliplabel { position: absolute; top: 10px; left: 12px; z-index: 3; font-size: 10.5px; color: rgba(255, 255, 255, .8); background: rgba(0, 0, 0, .35); border-radius: 6px; padding: 2px 8px; max-width: 80%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cp-play {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  z-index: 4;
  width: 54px; height: 54px; border-radius: 50%;
  background: rgba(255, 255, 255, .14); backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, .35); color: #fff;
  display: grid; place-items: center; transition: all var(--t-fast);
}
.cp-play:hover { transform: translate(-50%, -50%) scale(1.07); background: rgba(255, 255, 255, .22); }
.cp-zoom { position: absolute; right: 8px; top: 8px; z-index: 4; background: rgba(7, 12, 24, .48); border-color: rgba(255,255,255,.28); color: #fff; }
.cp-zoom:hover { background: rgba(7, 12, 24, .78); }
.cp-sub {
  position: absolute; left: 8%; right: 8%; bottom: 12%;
  z-index: 3;
  text-align: center; color: #fff; font-weight: 700; cursor: ns-resize;
  text-shadow: 0 1px 3px rgba(0, 0, 0, .8); white-space: pre-wrap; user-select: none;
}
.cp-bar { display: flex; align-items: center; gap: 12px; color: var(--d-muted); font-size: 11.5px; font-variant-numeric: tabular-nums; }
.cp-bar em { font-style: normal; color: var(--d-faint); font-size: 10.5px; }
.cut-side { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.cut-side .side-card { padding: 12px; }
.cut-side .side-card h3 { margin-bottom: 7px; font-size: 13px; }
.cut-page .side-card, .cut-page .tl-editor, .cut-page .tl-scroll, .cut-page .cut-bgm-drop { border-radius: 0; }
.cut-bgm-drop {
  margin-top: 8px; min-height: 38px; border: 1px dashed var(--line-2); border-radius: var(--r-md);
  width: 100%; min-width: 0; box-sizing: border-box;
  display: flex; align-items: center; justify-content: center; gap: 6px;
  color: var(--muted); font-size: 11.5px; cursor: pointer; background: var(--soft);
}
.cut-bgm-drop:hover, .cut-bgm-drop.drag-over { border-color: var(--brand); color: var(--brand); background: rgba(61, 91, 255, .06); }
.cut-bgm-select { align-items: center; }
.cut-bgm-select select {
  min-height: 36px;
  padding: 0 30px 0 10px;
  border-color: var(--line-2);
  border-radius: 7px;
  background: var(--surface);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.72);
}
.cut-bgm-select select:focus { border-color: var(--brand); box-shadow: var(--ring); }
.tl-editor { padding: 8px 10px; }
.tl-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.tlt-left { display: flex; align-items: baseline; gap: 9px; }
.tlt-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.tl-zoom { display: inline-flex; border: 1px solid var(--line); border-radius: var(--r-sm); overflow: hidden; }
.tl-zoom .icon-btn { border-radius: 0; }
.tl-scroll { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--soft); scrollbar-width: none; }
.tl-scroll::-webkit-scrollbar { display: none; }
.tl-inner { position: relative; min-width: 100%; width: max-content; padding-bottom: 4px; }
.tl-row { display: flex; align-items: stretch; }
.tl-label { width: 52px; flex: none; display: flex; align-items: center; gap: 4px; justify-content: center; font-size: 10px; color: var(--faint); border-right: 1px solid var(--line); background: var(--surface); position: sticky; left: 0; z-index: 3; }
.tl-body { position: relative; height: 44px; }
.tl-ruler { height: 26px; }
.tl-tick { position: absolute; top: 4px; font-size: 9.5px; color: var(--faint); border-left: 1px solid var(--line-2); padding-left: 3px; height: 18px; font-variant-numeric: tabular-nums; }
.tl-playhead {
  position: absolute; top: 0; bottom: 0; width: 2px; margin-left: -1px;
  background: var(--danger); z-index: 4; cursor: ew-resize;
}
.tl-playhead i { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 11px; height: 11px; background: var(--danger); border-radius: 3px 3px 6px 6px; }
.tl-subtrack { height: 36px; border-top: 1px solid var(--hairline); }
.tl-sub {
  position: absolute; top: 5px; height: 26px;
  background: linear-gradient(135deg, rgba(122, 77, 255, .16), rgba(61, 91, 255, .16));
  border: 1px solid rgba(122, 77, 255, .45);
  border-radius: 0; display: flex; align-items: center;
  padding: 0 14px; cursor: grab; user-select: none; box-sizing: border-box;
}
.tl-sub.is-compact { padding-inline: 3px; }
.tl-sub.is-compact .tl-sub-text { opacity: .72; }
.tl-sub.is-compact .tl-sub-resize { width: 4px; }
.tl-sub.is-active { border-color: var(--violet); box-shadow: 0 0 0 2px rgba(122, 77, 255, .25); z-index: 2; }
.tl-sub-text { font-size: 10.5px; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tl-sub-resize { position: absolute; top: 0; bottom: 0; width: 10px; cursor: ew-resize; }
.tl-sub-resize.left { left: 0; border-radius: 7px 0 0 7px; }
.tl-sub-resize.right { right: 0; border-radius: 0 7px 7px 0; }
.tl-sub-resize:hover { background: rgba(122, 77, 255, .35); }
.tl-cliptrack { height: 48px; border-top: 1px solid var(--hairline); }
.tl-clip {
  position: absolute; top: 5px; height: 36px;
  border-radius: 0; overflow: hidden; cursor: grab; user-select: none;
  background: #111a2e;
  border: 1px solid var(--line-2);
  display: flex; flex-direction: column; justify-content: center; padding: 0 14px;
  transition: box-shadow var(--t-fast);
}
.tl-clip-preview { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .52; pointer-events: none; }
.tl-clip::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7,12,24,.44), rgba(7,12,24,.12)); pointer-events: none; }
.tl-clip::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--g, var(--grad-brand)); z-index: 2; }
.tl-clip.is-selected { border-color: var(--brand); box-shadow: 0 0 0 2px rgba(61, 91, 255, .3); z-index: 2; }
.tl-clip.dragging { opacity: .5; }
.tl-clip.trimming { cursor: ew-resize; }
.tl-clip-name, .tl-clip-dur { position: relative; z-index: 1; }
.tl-clip-name { font-size: 11px; font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #fff; }
.tl-clip-dur { font-size: 9.5px; color: rgba(255,255,255,.78); font-variant-numeric: tabular-nums; }
.tl-trim { position: absolute; top: 0; bottom: 0; width: 9px; cursor: ew-resize; z-index: 2; }
.tl-trim.l { left: 0; } .tl-trim.r { right: 0; }
.tl-trim:hover { background: rgba(61, 91, 255, .25); }
.tl-empty { padding: 13px 16px; font-size: 11.5px; color: var(--faint); }
.tl-sub-editor { margin-top: 10px; }
.tse-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 6px 0; font-size: 12px; }
.tse-row.style { color: var(--muted); font-size: 11px; }
.tse-row.style input[type="range"] { width: 90px; }
.tse-row.style em { font-style: normal; color: var(--text); font-variant-numeric: tabular-nums; min-width: 46px; }
.tse-row textarea { min-height: 36px; }

/* ---------- 文案 / 审核 ---------- */
.cc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(76px, 1fr)); gap: 8px; }
.cc-grid.lg { grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); }
.cc-thumb { position: relative; border-radius: var(--r-md); overflow: hidden; border: 1px solid var(--hairline); aspect-ratio: 3/4; }
.cc-thumb img { width: 100%; height: 100%; object-fit: cover; cursor: zoom-in; }
.cc-thumb span { position: absolute; left: 5px; top: 5px; font-size: 9px; background: rgba(0, 0, 0, .5); color: #fff; border-radius: 5px; padding: 1px 6px; }
.cc-clip { display: flex; align-items: center; gap: 8px; font-size: 11.5px; padding: 5px 0; border-bottom: 1px dashed var(--hairline); }
.cc-clip em { font-style: normal; width: 16px; height: 16px; border-radius: 5px; background: var(--tint); color: var(--brand); font-size: 9.5px; display: grid; place-items: center; flex: none; }
.cc-clip b { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.cc-clip span { color: var(--faint); font-size: 10.5px; }
/* 成片预览（审核） */
.video-speed-tools,
.video-speed-versions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.video-speed-tools select {
  width: 92px;
}

.video-speed-versions > span {
  color: var(--muted);
  font-size: 12px;
}
.rv-preview.vid { display: flex; gap: 14px; align-items: flex-start; }
.rvp-screen { position: relative; width: 132px; aspect-ratio: 9/16; flex: none; border-radius: var(--r-md); overflow: hidden; background: #0a0e1a; border: 1px solid var(--d-line); }
.rvp-screen video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: #0a0e1a; z-index: 1; }
.rvp-frame { position: absolute; inset: 0; }
.rvp-frame img { width: 100%; height: 100%; object-fit: cover; opacity: .85; }
.rvp-frame::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(5,8,16,.1), rgba(5,8,16,.6)); }
.rvp-ratio { position: absolute; left: 7px; top: 7px; font-size: 9px; font-weight: 700; color: #fff; background: rgba(0,0,0,.45); border-radius: 5px; padding: 1px 6px; }
.rvp-time { position: absolute; right: 7px; top: 7px; font-size: 9px; font-weight: 700; color: #fff; background: rgba(0,0,0,.45); border-radius: 5px; padding: 1px 6px; }
.rvp-play { position: absolute; left: 50%; top: 44%; transform: translate(-50%,-50%); width: 38px; height: 38px; border-radius: 50%; background: rgba(255,255,255,.16); backdrop-filter: blur(6px); border: 1px solid rgba(255,255,255,.32); color: #fff; display: grid; place-items: center; }
.rvp-sub { position: absolute; left: 6%; right: 6%; bottom: 24px; text-align: center; color: #fff; font-size: 10.5px; font-weight: 700; text-shadow: 0 1px 3px rgba(0,0,0,.85); line-height: 1.4; }
.rvp-hint { position: absolute; left: 0; right: 0; bottom: 5px; text-align: center; color: rgba(255,255,255,.55); font-size: 8.5px; }
.rvp-screen video ~ .rvp-hint { z-index: 2; background: linear-gradient(180deg, transparent, rgba(5,8,16,.72)); padding-top: 20px; pointer-events: none; }
.rvp-strip { flex: 1; min-width: 0; display: flex; gap: 7px; flex-wrap: wrap; align-content: flex-start; }
.rvp-clip { width: 64px; }
.rvp-clip-thumb { width: 64px; height: 40px; border-radius: 7px; overflow: hidden; border: 1px solid var(--hairline); }
.rvp-clip-thumb img, .rvp-clip-thumb i { width: 100%; height: 100%; object-fit: cover; display: block; }
.rvp-clip span { display: block; font-size: 9.5px; color: var(--muted); margin-top: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rvp-clip em { font-style: normal; font-size: 9px; color: var(--faint); }
.rv-preview.img .rvp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(74px, 1fr)); gap: 8px; }
.rvp-cell { position: relative; aspect-ratio: 3/4; border-radius: var(--r-sm); overflow: hidden; border: 1px solid var(--hairline); }
.rvp-cell img { width: 100%; height: 100%; object-fit: cover; cursor: zoom-in; }
.rvp-cell span { position: absolute; left: 4px; top: 4px; font-size: 9px; background: rgba(0,0,0,.5); color: #fff; border-radius: 4px; padding: 0 5px; }
.pd-review .rv-preview { margin-bottom: 4px; }
.pd-review .rv-preview.vid .rvp-screen { width: 184px; }
.rv-preview.vid.is-landscape .rvp-screen,
.pd-review .rv-preview.vid.is-landscape .rvp-screen {
  width: min(100%, 420px);
  aspect-ratio: 16 / 9;
}
.pd-workshop-preview.is-composed .pd-video-grid { grid-template-columns: minmax(150px, 210px); justify-content: start; }
.pd-workshop-preview.is-composed .pd-video-grid video { width: 168px; }

.review-banner { display: flex; align-items: center; gap: 12px; padding: 14px 16px; margin-bottom: 14px; }
.review-banner.ok { color: var(--success); background: var(--success-bg); border-color: transparent; }
.review-banner.warn { color: var(--warning); background: var(--warning-bg); border-color: transparent; }
.review-banner b { display: block; font-size: 13px; }
.review-banner em { font-style: normal; font-size: 11.5px; opacity: .85; }
.review-sec { padding: 15px 16px 13px; margin-bottom: 12px; }
.review-page:not(.video-review-page) .chain-main { max-width: 1120px; margin: 0 auto; }
.review-page:not(.video-review-page) .review-banner { padding: 10px 14px; margin-bottom: 8px; }
.review-page:not(.video-review-page) .review-sec { padding: 12px 14px 11px; margin-bottom: 8px; }
.rv-shots { display: flex; flex-direction: column; }
.rv-line { display: flex; gap: 10px; font-size: 12px; padding: 5px 0; border-bottom: 1px dashed var(--hairline); }
.rv-line:last-child { border-bottom: 0; }
.rv-line em { font-style: normal; color: var(--faint); flex: none; min-width: 44px; font-variant-numeric: tabular-nums; }
.rv-line span { color: var(--muted); line-height: 1.6; }
.rv-copy b { font-size: 13.5px; display: block; margin-bottom: 8px; }
.rv-copy pre { font-family: inherit; font-size: 12px; color: var(--muted); white-space: pre-wrap; line-height: 1.8; }
.video-review-page { height: calc(100dvh - 104px); min-height: 0; overflow: hidden; padding-bottom: 12px; }
.video-review-page .chain-main, .video-review-shell { height: 100%; min-height: 0; }
.video-review-shell { display: grid; grid-template-rows: auto minmax(0, 1fr); gap: 10px; }
.video-review-shell .review-banner { margin: 0; padding: 10px 14px; }
.video-review-grid { display: grid; grid-template-columns: minmax(260px, .82fr) minmax(210px, .62fr) minmax(320px, 1.1fr); gap: 12px; min-height: 0; }
.video-review-panel { min-width: 0; min-height: 0; padding: 13px; display: flex; flex-direction: column; overflow: hidden; }
.video-review-media { flex: 1; min-height: 0; display: grid; place-items: center; }
.video-review-media .rv-preview { height: 100%; max-height: 100%; width: 100%; display: grid; place-items: center; }
.video-review-media .rvp-screen { height: 100%; width: auto; max-width: 100%; aspect-ratio: 9 / 16; }
.video-review-media .rv-preview.vid.is-landscape .rvp-screen {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
}
.video-review-cover-button { flex: 1; min-height: 0; border: 0; background: var(--soft); border-radius: var(--r-md); overflow: hidden; cursor: zoom-in; padding: 0; }
.video-review-cover-button img { width: 100%; height: 100%; object-fit: contain; display: block; }
.video-review-copy .rv-copy { min-height: 0; display: flex; flex-direction: column; }
.video-review-copy .rv-copy pre { min-height: 0; overflow: auto; margin: 0; padding-right: 4px; }
@media (max-width: 980px) {
  .video-review-page { height: auto; overflow: visible; }
  .video-review-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .video-review-copy { grid-column: 1 / -1; max-height: 320px; }
}

/* ---------- 资产库 ---------- */
.assets-page { max-width: 1180px; margin: 0 auto; }
.assets-page.drag-over::after {
  content: "松手上传到当前账号"; position: fixed; inset: 70px 30px 30px;
  border: 2px dashed var(--brand); border-radius: var(--r-xl);
  background: rgba(61, 91, 255, .06); color: var(--brand);
  display: grid; place-items: center; font-size: 15px; font-weight: 700; z-index: 50;
  pointer-events: none;
}
.filter-bar .fb-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.filter-bar .media-row {
  margin-top: 6px;
  padding: 8px 10px;
  border: 1px dashed var(--hairline);
  border-radius: var(--r-md);
  background: var(--soft);
}
.fb-caption {
  font-size: 11px;
  font-weight: 800;
  color: var(--faint);
  margin-right: 2px;
}
.filter-bar .account-row {
  max-height: 78px;
  overflow: hidden;
  align-content: flex-start;
  padding-top: 2px;
  transition: max-height .22s var(--ease);
}
.filter-bar .account-row.expanded { max-height: 220px; overflow-y: auto; }
.filter-bar .chip.ghost { color: var(--brand); background: var(--tint); border-color: rgba(61,91,255,.26); }
.asset-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)); gap: 12px; }
/* 资产库按账号分组折叠 */
.acc-sec { margin-bottom: 10px; }
.acc-sec-head {
  display: flex; align-items: center; gap: 9px; width: 100%; text-align: left;
  padding: 7px 10px; margin-bottom: 9px;
  background: var(--surface); border: 1px solid var(--hairline); border-radius: var(--r-md);
  box-shadow: var(--shadow-xs); transition: all var(--t-fast);
}
.acc-sec-head:hover { border-color: var(--line-2); }
.acc-sec-main {
  min-width: 0;
  flex: 1;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0;
  border: 0;
  background: transparent;
  text-align: left;
  cursor: pointer;
}
.acc-sec-head .chev { display: inline-flex; color: var(--faint); transition: transform var(--t-fast); }
.acc-sec.collapsed .chev { transform: rotate(-90deg); }
.acc-sec.collapsed .acc-sec-head { margin-bottom: 0; min-height: 38px; }
.acc-sec-ava { width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; color: #fff; font-weight: 700; font-size: 12px; flex: none; }
.acc-sec-head b { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.acc-sec-head em { font-style: normal; margin-left: auto; font-size: 11px; color: var(--faint); font-variant-numeric: tabular-nums; }
.asset-card { overflow: hidden; transition: all var(--t-fast); }
.asset-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.ac-thumb { position: relative; aspect-ratio: 4/3; background: var(--soft); }
.ac-thumb img { width: 100%; height: 100%; object-fit: cover; cursor: zoom-in; }
.ac-thumb .ph { width: 100%; height: 100%; display: grid; place-items: center; color: #fff; font-size: 15px; font-weight: 700; }
.ac-play { position: absolute; left: 8px; bottom: 8px; width: 24px; height: 24px; border-radius: 50%; background: rgba(0, 0, 0, .5); color: #fff; display: grid; place-items: center; }
.ac-seq { position: absolute; left: 8px; top: 8px; font-size: 10px; font-weight: 700; font-family: var(--mono); letter-spacing: .04em; color: #fff; background: rgba(10, 15, 30, .6); backdrop-filter: blur(4px); border-radius: 6px; padding: 2px 7px; }
.ac-hover {
  position: absolute; top: 6px; right: 6px; left: 6px;
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px;
  opacity: 0; transition: opacity var(--t-fast);
}
.asset-card:hover .ac-hover { opacity: 1; }
.ac-mini {
  width: 100%; min-width: 0; height: 26px; border-radius: 8px;
  background: rgba(10, 15, 30, .65); backdrop-filter: blur(6px); color: #fff;
  display: grid; place-items: center; font-size: 12px; transition: all var(--t-fast);
}
.ac-mini:hover { background: rgba(10, 15, 30, .9); }
.ac-mini.danger:hover { background: var(--danger); }
.ac-body { padding: 9px 11px 10px; }
.ac-name { font-size: 12px; font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ac-tags { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 6px; }

/* ---------- 交付中心 ---------- */
.delivery-page { max-width: 1100px; margin: 0 auto; }

/* 草稿箱（发布清单顶部） */
.draft-box { margin-bottom: 16px; }
.draft-box .card-head b { display: inline-flex; align-items: center; gap: 6px; }
.draft-groups { display: flex; flex-direction: column; gap: 12px; max-height: 340px; overflow: auto; }
.draft-acc-head { display: flex; align-items: center; gap: 8px; padding: 2px 2px 6px; }
.draft-acc-head b { font-size: 12.5px; }
.draft-acc-head em { font-style: normal; font-size: 11px; color: var(--faint); }
.draft-acc-head .dot.sm { width: 9px; height: 9px; border-radius: 50%; flex: none; }
.draft-row { display: flex; align-items: center; gap: 11px; padding: 9px 11px; border: 1px solid var(--hairline); border-radius: var(--r-md); margin-bottom: 6px; cursor: pointer; transition: background var(--t-fast), border-color var(--t-fast); }
.draft-row:hover { background: var(--soft); border-color: var(--line); }
.draft-row.fail { border-color: rgba(224, 49, 49, .35); }
.draft-cover { width: 44px; height: 32px; border-radius: 7px; overflow: hidden; flex: none; }
.draft-cover img, .draft-cover i { width: 100%; height: 100%; object-fit: cover; display: grid; place-items: center; color: #fff; font-style: normal; font-weight: 700; font-size: 11px; }
.draft-main { flex: 1 1 auto; min-width: 0; overflow: hidden; }
.draft-row .status-pill { flex: 0 0 auto; }
.draft-main b { display: block; font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.draft-main em { display: block; margin-top: 2px; font-style: normal; font-size: 10.5px; color: var(--faint); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 草稿箱独立页 */
.drafts-page { max-width: 1100px; margin: 0 auto; }
.draft-groups.page { max-height: none; overflow: visible; }
.draft-acc.card { padding: 12px 14px; margin-bottom: 12px; }
.draft-timeline { position: relative; padding-left: 26px; }
.draft-timeline::before { content: ""; position: absolute; left: 8px; top: 8px; bottom: 8px; width: 2px; background: var(--line-2); }
.draft-acc.card { position: relative; }
.draft-acc.card::before { content: ""; position: absolute; left: -25px; top: 19px; width: 11px; height: 11px; border: 2px solid var(--surface); border-radius: 50%; background: var(--brand); box-shadow: 0 0 0 1px var(--line-2); }
.draft-acc.card .draft-acc-head { width: 100%; padding: 0 2px 8px; border: 0; border-bottom: 1px solid var(--hairline); margin-bottom: 8px; background: transparent; cursor: pointer; text-align: left; }
.draft-acc.card.collapsed .draft-date-list { display: none; }
.draft-acc.card.collapsed .draft-acc-head svg { transform: rotate(-90deg); }
.draft-check { flex: none; accent-color: var(--brand); }
.draft-acc.card .draft-row:last-child { margin-bottom: 0; }

/* 发布序号 + 账号/审阅标签 */
.dv-seq { display: inline-block; font-size: 11px; font-weight: 800; color: var(--brand); background: rgba(61, 91, 255, .1); border-radius: 5px; padding: 0 5px; margin-right: 6px; vertical-align: 1px; }
.tag.acc { background: var(--soft); color: var(--muted); border: 1px solid var(--hairline); }
.tag.rev { background: rgba(34, 168, 110, .12); color: #1f9d63; }
.tag.pub { background: rgba(34, 168, 110, .12); color: #1f9d63; }
.tag.date { background: rgba(46, 156, 246, .1); color: #1f74c4; }
.dv-pubmeta { display: flex; flex-wrap: wrap; gap: 16px; font-size: 12px; color: var(--muted); padding: 8px 11px; background: var(--soft); border-radius: var(--r-sm); margin-bottom: 9px; }
.dv-pubmeta span { display: inline-flex; align-items: center; gap: 5px; }
.dv-pubmeta b { color: var(--text); font-variant-numeric: tabular-nums; }
.sup-table .c-seq, .sup-table .sup-seq { width: 52px; }
.sup-seq { font-weight: 800; color: var(--brand); font-size: 11.5px; }
.sup-by { display: block; font-style: normal; font-size: 10px; color: var(--faint); }
.sup-name em { display: block; }
.sup-plan { display: flex; align-items: center; gap: 3px; font-style: normal; font-size: 10px; color: #1f74c4; margin-top: 2px; }
.sup-pubnote { display: flex; align-items: center; gap: 3px; font-style: normal; font-size: 10px; color: var(--faint); margin-top: 1px; }

.dv-layout { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 18px; align-items: start; }
.dv-layout.is-filtered { grid-template-columns: minmax(0, 1fr); }
.creator-delivery-filters { display: flex; align-items: center; gap: 5px; margin-bottom: 10px; overflow-x: auto; scrollbar-width: none; }
.creator-delivery-filters button { min-height: 32px; padding: 0 11px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); background: rgba(255,255,255,.76); font-size: 11.5px; font-weight: 750; white-space: nowrap; cursor: pointer; }
.creator-delivery-filters button.on { color: #fff; border-color: #171b22; background: #171b22; }
.delivery-status-filters { display: inline-flex; align-items: center; gap: 5px; flex: 0 0 auto; padding: 3px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,255,255,.76); }
.delivery-status-group { display: inline-flex; align-items: center; gap: 3px; }
.delivery-status-caption { padding: 0 3px; color: var(--faint); font-size: 10px; font-style: normal; font-weight: 750; }
.delivery-status-divider { width: 1px; height: 18px; background: var(--line); }
.delivery-status-chip { min-height: 26px; padding: 0 9px; border: 0; border-radius: 5px; color: var(--muted); background: transparent; font-size: 11.5px; font-weight: 750; white-space: nowrap; cursor: pointer; transition: color .16s ease, background .16s ease, transform .16s ease; }
.delivery-status-chip:hover { color: var(--text); background: var(--soft); }
.delivery-status-chip:active { transform: scale(.98); }
.delivery-status-chip.on { color: #fff; background: #171b22; }
.creator-delivery-filters .delivery-status-chip { min-height: 26px; padding: 0 9px; border: 0; border-radius: 5px; background: transparent; }
.creator-delivery-filters .delivery-status-chip.on { color: #fff; border-color: transparent; background: #171b22; }
.dv-date-nav { position: sticky; top: 78px; display: flex; flex-direction: column; gap: 8px; padding: 8px 0 8px 14px; }
.dv-date-nav::before { content: ""; position: absolute; left: 3px; top: 0; bottom: 0; width: 1px; border-radius: 999px; background: #d8d8d3; opacity: .82; }
.dv-date-link { position: relative; border: 0; background: transparent; color: var(--muted); text-align: left; padding: 5px 6px 5px 8px; border-radius: 9px; cursor: pointer; transition: background var(--t-fast), color var(--t-fast); }
.dv-date-link::before { content: ""; position: absolute; left: -15px; top: 13px; width: 8px; height: 8px; border-radius: 50%; background: var(--surface); border: 2px solid var(--line-2); }
.dv-date-link:hover { background: var(--soft); color: var(--text); }
.dv-date-link span { display: block; font-size: 12px; font-weight: 800; }
.dv-date-link em { display: block; margin-top: 1px; font-size: 10px; font-style: normal; color: var(--faint); }
.dv-flow { position: relative; min-width: 0; }
.dv-day { position: relative; padding-left: 20px; }
.dv-day + .dv-day { margin-top: 18px; padding-top: 14px; border-top: 1px dashed var(--line); }
.dv-day::before { content: ""; position: absolute; left: 5px; top: 42px; bottom: 8px; width: 1px; background: #d8d8d3; border-radius: 2px; opacity: .9; }
.dv-day-head { width: 100%; display: flex; align-items: center; gap: 8px; border: 0; background: transparent; color: var(--text); padding: 0 0 10px; cursor: pointer; text-align: left; }
.dv-day-head span { font-weight: 900; font-size: 14px; }
.dv-day-head em { font-style: normal; font-size: 11px; color: var(--faint); margin-right: auto; }
.dv-day-head svg { color: var(--faint); transition: transform var(--t-fast); }
.dv-day.collapsed .dv-day-head svg { transform: rotate(-90deg); }
.dv-day.collapsed::before { opacity: .12; }
.dv-day-list {
  min-width: 0;
  display: grid;
  grid-template-rows: 1fr;
  opacity: 1;
  transition: grid-template-rows .24s var(--ease), opacity .18s var(--ease), margin .24s var(--ease);
}
.dv-day-list-inner { min-height: 0; overflow: hidden; }
.dv-day.collapsed .dv-day-list {
  grid-template-rows: 0fr;
  opacity: 0;
  margin-top: -4px;
  pointer-events: none;
}
.dv-item { position: relative; margin-bottom: 12px; animation: fadeUp .4s var(--ease) var(--d, 0ms) backwards; }
.dv-node { position: absolute; left: -20px; top: 22px; width: 12px; height: 12px; border-radius: 50%; background: var(--surface); border: 2.5px solid var(--line-2); }
.dv-node.latest { border-color: var(--brand); box-shadow: 0 0 0 4px rgba(61, 91, 255, .15); }
.dv-card { overflow: hidden; border-radius: 8px; }
.dv-head { display: flex; align-items: center; gap: 13px; padding: 13px 15px; cursor: pointer; transition: background var(--t-fast); }
.dv-head:hover { background: var(--soft); }
.dv-cover { position: relative; width: 58px; height: 42px; border-radius: 9px; overflow: hidden; flex: none; }
.dv-cover img, .dv-cover i { width: 100%; height: 100%; object-fit: cover; display: grid; place-items: center; color: #fff; font-style: normal; font-weight: 700; }
.dv-cover em { position: absolute; right: 3px; bottom: 3px; font-size: 8.5px; font-style: normal; background: rgba(0, 0, 0, .55); color: #fff; padding: 0 5px; border-radius: 4px; }
.dv-main { flex: 1; min-width: 0; }
.dv-main b { font-size: 13px; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dv-meta { display: flex; align-items: center; gap: 6px; margin-top: 4px; min-width: 0; }
.dv-tagline { display: inline-flex; align-items: center; gap: 5px; flex: 0 1 auto; flex-wrap: wrap; min-width: 0; max-width: min(62vw, 640px); }
.dv-tagline .plat-chip { width: 48px; justify-content: center; }
.dv-tagline .tag { max-width: 92px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dv-tagline .tag.date { max-width: 136px; }
.dv-tagline .tag.supplier-downloaded { max-width: 124px; color: var(--success); background: var(--success-bg); }
.dv-tagline .tag.supplier-pending { max-width: 124px; color: var(--warning); background: var(--warning-bg); }
.dv-meta em { flex: 1 1 auto; min-width: 80px; font-style: normal; font-size: 11px; color: var(--faint); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dv-meta > .tag { flex: 0 0 auto; }
.dv-chev { color: var(--faint); transition: transform var(--t-fast); }
.dv-card.open .dv-chev { transform: rotate(180deg); }
.dv-detail { padding: 12px 15px 15px; border-top: 1px solid var(--hairline); background: rgba(248,250,252,.72); }
.dv-detail-facts { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 10px; }
.dv-detail-facts span { padding: 5px 8px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); background: var(--surface); font-size: 10.5px; }
.dv-copy { font-family: inherit; font-size: 12px; color: var(--muted); white-space: pre-wrap; line-height: 1.8; background: var(--soft); border-radius: var(--r-md); padding: 11px 13px; margin: 10px 0; }
.dv-actions { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.sup-table-wrap { overflow: hidden; }
.sup-table { width: 100%; min-width: 0; table-layout: fixed; border-collapse: collapse; font-size: 12px; }
.sup-col-check { width: 32px; }
.sup-col-seq { width: 52px; }
.sup-col-name { width: 19%; }
.sup-col-product { width: 80px; }
.sup-col-account { width: 92px; }
.sup-col-platform { width: 68px; }
.sup-col-kind { width: 72px; }
.sup-col-tags { width: 70px; }
.sup-col-exposure { width: 70px; }
.sup-col-status { width: 70px; }
.sup-col-actions { width: 286px; }
.sup-table th { text-align: left; padding: 11px 13px; font-size: 10.5px; color: var(--faint); letter-spacing: .05em; border-bottom: 1px solid var(--line); background: var(--soft); white-space: nowrap; }
.sup-table td { padding: 11px 13px; border-bottom: 1px solid var(--hairline); vertical-align: middle; overflow: hidden; }
.sup-table tr[data-sup] { cursor: pointer; transition: background var(--t-fast); }
.sup-table tr[data-sup]:hover, .sup-table tr[data-sup].open { background: var(--soft); }
.sup-table tr:hover td { background: var(--soft); }
.sup-table .c-check { width: 30px; }
.sup-table th:nth-child(9), .sup-table td:nth-child(9) { text-align: center; }
.sup-table th:last-child, .sup-table td.sup-acts { text-align: right; }
.sup-name b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sup-name em { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-style: normal; font-size: 11px; color: var(--faint); }
.sup-status { font-size: 11px; font-weight: 700; color: var(--warning); white-space: nowrap; }
.sup-status.done { color: var(--success); }
.sup-acts { white-space: nowrap; overflow: hidden !important; }
.sup-actions-inner { display: flex; align-items: center; justify-content: flex-end; gap: 8px; min-width: 0; }
.sup-acts .btn { flex: 0 0 auto; min-width: 0; height: 30px; padding: 0 7px; font-size: 10.5px; }
.sup-acts .btn:first-child { width: 48px; }
.sup-acts .sup-row-jump-link { width: 66px; }
.sup-acts .delivery-remark-button { width: 50px; }
.sup-acts .btn:last-child { width: 66px; }
.sup-tags { display: flex; align-items: center; gap: 5px; flex-wrap: nowrap; max-width: 100%; overflow: hidden; }
.sup-tags .tag { flex: 0 0 auto; max-width: 58px; padding: 1px 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sup-tags .tag.more { max-width: none; padding-inline: 5px; color: var(--faint); background: var(--soft); }
/* 平台 / 形式 / 发布账号列不换行，状态与平台标签更整齐 */
.sup-table td:nth-child(4), .sup-table td:nth-child(5), .sup-table td:nth-child(6), .sup-table td:nth-child(7), .sup-table td:nth-child(8) { white-space: nowrap; }
.sup-table td:nth-child(5) b, .sup-by { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sup-table .chip { white-space: nowrap; }
.sup-empty { text-align: center; color: var(--faint); padding: 34px !important; }

/* ---------- 设置 ---------- */
.settings-page { max-width: 1320px; margin: 0 auto; display: flex; flex-direction: column; gap: 14px; }
.settings-page > .member-requests { order: 1; }
.settings-page > .member-accounts { order: 2; }
.settings-page > .api-usage-panel { order: 3; }
.settings-page > .product-library { order: 4; }
.settings-page > .data-management { order: 5; }
.set-cols { display: grid; grid-template-columns: 1.2fr .8fr; gap: 14px; }
.set-form, .set-list, .set-data { padding: 18px; }
.settings-page .set-data { border-color: rgba(148,163,184,.25); box-shadow: 0 12px 28px rgba(34,56,90,.035); }
.settings-page .card-head > span:first-child { min-width: 0; display: grid; gap: 3px; }
.settings-page .card-head > span:first-child > b { display: inline-flex; align-items: center; gap: 7px; }
.settings-page .card-head em { max-width: 760px; }
.set-status { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.cap { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 650; border-radius: 99px; padding: 5px 11px; }
.cap.ok { background: var(--success-bg); color: var(--success); }
.cap.warn { background: var(--warning-bg); color: var(--warning); }
.set-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.key-row { display: flex; align-items: center; gap: 11px; padding: 10px 0; border-bottom: 1px solid var(--hairline); }
.key-row:last-child { border-bottom: 0; }
.key-ico { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; color: #fff; font-weight: 700; font-size: 13px; flex: none; }
.mem-list { display: flex; flex-direction: column; }
.mem-row { display: flex; align-items: center; gap: 11px; padding: 10px 0; border-bottom: 1px solid var(--hairline); }
.mem-row:last-child { border-bottom: 0; }
.mem-ava { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; color: #fff; font-weight: 700; font-size: 13px; flex: none; }
.mem-me { font-style: normal; font-size: 10px; color: var(--brand); background: var(--tint); border-radius: 5px; padding: 0 6px; margin-left: 4px; }
.mem-role.tag.admin { background: var(--tint); color: var(--brand-deep); }
.mem-role.tag.reviewer { background: #E7F1FB; color: var(--info); }
.mem-role.tag.editor { background: var(--success-bg); color: var(--success); }
.mem-role.tag.supplier { background: var(--warning-bg); color: var(--warning); }
.mem-role.tag.supplier_parent { background: #f7ebff; color: #7a3cb1; }
.settings-member-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 8px; }
.settings-member-card { min-width: 0; display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; gap: 8px; align-items: center; min-height: 70px; padding: 10px; border: 1px solid var(--hairline); border-radius: 12px; background: linear-gradient(135deg, rgba(255,255,255,.95), rgba(247,249,253,.74)); }
.settings-member-avatar { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 10px; color: #2563eb; background: #eaf1ff; }
.settings-member-avatar img { width: 100%; height: 100%; border-radius: inherit; object-fit: cover; }
.settings-member-avatar.admin { color: #7648bc; background: #f2ebff; }
.settings-member-avatar.supplier_parent { color: #9a5b11; background: #fff5dd; }
.settings-member-card .ovt-main { min-width: 0; }
.settings-member-card .ovt-main b, .settings-member-card .ovt-main em { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.settings-member-card .mem-role { grid-column: 2; justify-self: start; margin-top: -3px; }
.settings-member-actions { display: inline-flex; align-items: center; gap: 5px; grid-row: 1 / span 2; grid-column: 3; }
body.workspace-shell-v2[data-zone="settings"] .view-root[data-settings-view="profile"] {
  display: grid;
  grid-template-rows: minmax(min-content, 1fr);
}
.creator-profile-page {
  display: grid;
  align-items: center;
  width: 100%;
  max-width: 520px;
  min-height: 100%;
  margin: 0 auto;
  padding-block: 10px 28px;
}
.creator-profile-card { overflow: hidden; padding: 0; border-radius: 22px; background: linear-gradient(155deg, #fff, #f8faff 72%, #f2f6ff); box-shadow: 0 18px 52px rgba(42,72,125,.09); }
.creator-profile-heading { display: grid; justify-items: center; gap: 8px; padding: 30px 28px 23px; text-align: center; border-bottom: 1px solid var(--hairline); background: radial-gradient(circle at 50% 0, rgba(81,125,239,.16), transparent 57%); }
.creator-profile-heading b, .creator-profile-heading em { display: block; }
.creator-profile-heading b { font-size: 19px; letter-spacing: .04em; }
.creator-profile-heading em { max-width: 330px; color: var(--muted); font-size: 11px; font-style: normal; line-height: 1.65; }
.creator-avatar-drop { position: relative; display: grid; place-items: center; width: 104px; height: 104px; cursor: pointer; }
.creator-avatar-drop input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.creator-profile-avatar { display: grid; place-items: center; width: 92px; height: 92px; overflow: hidden; border: 4px solid rgba(255,255,255,.94); border-radius: 50%; color: #2563eb; background: linear-gradient(145deg, #eaf1ff, #dce8ff); box-shadow: 0 9px 22px rgba(49,95,213,.22); font-size: 29px; font-weight: 800; transition: transform .2s ease, box-shadow .2s ease; }
.creator-profile-avatar img { width: 100%; height: 100%; object-fit: cover; }
.creator-avatar-edit { position: absolute; right: 0; bottom: 2px; display: inline-flex; align-items: center; gap: 3px; padding: 4px 7px; border: 1px solid rgba(255,255,255,.9); border-radius: 999px; color: #fff; background: #315fd5; box-shadow: 0 4px 12px rgba(49,95,213,.25); font-size: 9px; opacity: .92; transition: transform .2s ease, background .2s ease; }
.creator-avatar-drop:hover .creator-profile-avatar, .creator-avatar-drop.is-dragging .creator-profile-avatar { transform: translateY(-3px) scale(1.035); box-shadow: 0 14px 28px rgba(49,95,213,.32); }
.creator-avatar-drop:hover .creator-avatar-edit, .creator-avatar-drop.is-dragging .creator-avatar-edit { background: #224bc0; transform: translateY(-1px); }
.creator-avatar-drop:has(input:focus-visible) .creator-profile-avatar { outline: 3px solid rgba(49,95,213,.38); outline-offset: 3px; }
.creator-profile-form { display: grid; padding: 8px 24px 22px; }
.creator-profile-line { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; min-height: 59px; gap: 12px; border-bottom: 1px solid var(--hairline); color: var(--muted); font-size: 12px; transition: background .18s ease, padding .18s ease, color .18s ease; }
.creator-profile-line:hover, .creator-profile-line:focus-within { padding-inline: 8px; color: #315fd5; background: rgba(49,95,213,.045); }
.creator-profile-line .input { min-width: 0; height: 40px; padding: 0; border: 0; border-radius: 0; color: var(--text); background: transparent; box-shadow: none; font-weight: 650; outline: 0; }
.creator-profile-line .input::placeholder { color: var(--faint); font-weight: 500; }
.creator-profile-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 19px; color: var(--faint); font-size: 10.5px; line-height: 1.55; }
.creator-profile-actions > span { max-width: 225px; }
.api-usage-table { overflow: visible; }
.api-usage-empty { min-height: 76px; display: flex; align-items: center; padding: 12px 2px; }
.api-usage-overview { display: grid; gap: 11px; }
.api-usage-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.api-usage-kpi { display: grid; gap: 3px; min-width: 0; padding: 11px 12px; border: 1px solid var(--hairline); border-radius: 10px; background: linear-gradient(135deg, #fff, #f7f9ff); }
.api-usage-kpi b { color: var(--brand-deep); font-size: 18px; line-height: 1.1; font-variant-numeric: tabular-nums; }
.api-usage-kpi em, .api-usage-row-stat em { color: var(--faint); font-size: 10px; font-style: normal; white-space: nowrap; }
.api-usage-summary-list { overflow: hidden; border: 1px solid var(--hairline); border-radius: 10px; background: #fff; }
.api-usage-summary-label, .api-usage-summary-row { display: grid; grid-template-columns: minmax(150px, 1.25fr) repeat(4, minmax(104px, .75fr)) 34px; gap: 9px; align-items: center; min-width: 0; }
.api-usage-summary-label { padding: 8px 12px; color: var(--faint); background: #f8faff; font-size: 10px; font-weight: 700; }
.api-usage-summary-label > :not(:first-child), .api-usage-row-stat { text-align: right; }
.api-usage-summary-row { min-height: 58px; padding: 8px 12px; border-top: 1px solid var(--hairline); transition: background .16s ease; }
.api-usage-summary-row:hover { background: rgba(49, 95, 213, .035); }
.api-usage-member { min-width: 0; }
.api-usage-member b, .api-usage-member em { display: block; }
.api-usage-member b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.api-usage-member em { overflow: hidden; text-overflow: ellipsis; color: var(--faint); font-size: 10px; font-style: normal; white-space: nowrap; }
.api-usage-row-stat { display: grid; gap: 2px; min-width: 0; }
.api-usage-row-stat b { color: var(--brand-deep); font-size: 14px; line-height: 1.1; font-variant-numeric: tabular-nums; }
.api-usage-zero-members { border: 1px solid var(--hairline); border-radius: 10px; overflow: hidden; color: var(--muted); background: #fbfcff; }
.api-usage-zero-members > summary { padding: 10px 12px; cursor: pointer; font-size: 11px; font-weight: 650; }
.api-usage-zero-members[open] > summary { border-bottom: 1px solid var(--hairline); }
.api-usage-zero-members .is-quiet { border: 0; border-radius: 0; }
.api-usage-row { display: grid; grid-template-columns: minmax(148px, 1.55fr) repeat(4, minmax(66px, .7fr)) minmax(70px, .65fr); gap: 10px; align-items: center; min-width: 0; padding: 11px 2px; border-top: 1px solid var(--hairline); font-size: 11px; }
.api-usage-row:first-child { border-top: 0; }
.api-usage-row > span:first-child b, .api-usage-row > span:first-child em { display: block; }
.api-usage-row > span:first-child em, .api-usage-row time { margin-top: 2px; color: var(--faint); font-size: 10px; font-style: normal; }
.api-usage-row strong { color: var(--brand-deep); }
.api-usage-label { padding-top: 2px; color: var(--faint); font-size: 10px; font-weight: 700; }
.api-usage-actions { display: inline-flex; align-items: center; gap: 7px; margin-left: auto; }
.api-member-detail { justify-self: end; white-space: nowrap; }
.modal-panel.wide.api-usage-modal { width: min(1180px, calc(100vw - 48px)); }
.api-usage-detail-body { max-height: min(72vh, 720px); overflow-y: auto; overflow-x: hidden; padding: 2px 22px 22px; }
.api-detail-section + .api-detail-section { margin-top: 22px; }
.api-detail-title { display: grid; gap: 3px; margin: 4px 0 8px; }
.api-detail-title b { color: var(--text); font-size: 13px; }
.api-detail-title em { color: var(--faint); font-size: 10.5px; font-style: normal; }
.api-detail-table { overflow: visible; }
.api-detail-row { display: grid; grid-template-columns: minmax(190px, 1.45fr) repeat(4, minmax(72px, .66fr)) minmax(128px, .9fr); gap: 10px; align-items: center; min-width: 0; padding: 10px 2px; border-top: 1px solid var(--hairline); font-size: 11px; }
.api-detail-row > span:first-child b, .api-detail-row > span:first-child em, .api-detail-event-row > span:nth-child(2) b, .api-detail-event-row > span:nth-child(2) em { display: block; }
.api-detail-row em, .api-detail-row time { margin-top: 2px; color: var(--faint); font-size: 10px; font-style: normal; }
.api-detail-row strong { color: var(--brand-deep); }
.api-detail-label { color: var(--faint); font-size: 10px; font-weight: 700; }
.api-detail-event-row { grid-template-columns: minmax(118px, .9fr) minmax(184px, 1.25fr) repeat(3, minmax(72px, .65fr)) minmax(126px, .9fr); }
.api-detail-empty { padding: 14px 2px; }
.api-asset-table { overflow: visible; }
.api-asset-row { display: grid; grid-template-columns: minmax(220px, 1.7fr) minmax(82px, .55fr) minmax(100px, .7fr) minmax(128px, .9fr); gap: 10px; align-items: center; min-width: 0; padding: 10px 2px; border-top: 1px solid var(--hairline); font-size: 11px; }
.api-asset-row > span:first-child b, .api-asset-row > span:first-child em { display: block; }
.api-asset-row em, .api-asset-row time { margin-top: 2px; color: var(--faint); font-size: 10px; font-style: normal; }
.api-asset-row strong { color: var(--brand-deep); }
.api-usage-unresolved-row strong { overflow: hidden; color: var(--danger); text-overflow: ellipsis; white-space: nowrap; }
.api-asset-event-row { grid-template-columns: minmax(280px, 1.8fr) minmax(82px, .55fr) minmax(100px, .7fr) minmax(128px, .9fr); }
.product-library-actions { display: inline-flex; align-items: center; gap: 7px; margin-left: auto; }
.product-library:not(.is-open) { min-height: 72px; }
.product-library .prod-list { margin-top: 4px; animation: settingsReveal 190ms cubic-bezier(.2,.8,.2,1) both; }
.product-library-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 8px; }
.product-library-card { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 10px 11px; border: 1px solid var(--hairline); border-radius: 10px; background: #fff; }
.product-library-card .ovt-main { min-width: 0; flex: 1; }
.product-library-card .ovt-main b, .product-library-card .ovt-main em { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product-library-card .ovt-main em { color: var(--faint); font-size: 10px; font-style: normal; margin-top: 3px; }
.product-library-card-actions { display: inline-flex; flex: none; gap: 3px; }
@keyframes settingsReveal { from { opacity: 0; transform: translateY(-5px); } to { opacity: 1; transform: none; } }
@media (max-width: 820px) {
  .creator-profile-actions { align-items: flex-start; flex-direction: column; }
  .api-usage-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .api-usage-summary-label { display: none; }
  .api-usage-summary-row { grid-template-columns: minmax(112px, 1fr) repeat(4, auto) 30px; gap: 7px; padding-inline: 9px; }
  .api-usage-row-stat b { font-size: 12px; }
  .api-usage-row-stat em { max-width: 54px; overflow: hidden; text-overflow: ellipsis; }
  .product-library-grid { grid-template-columns: 1fr; }
  .api-usage-row { grid-template-columns: minmax(112px, 1fr) repeat(4, auto) auto; gap: 7px; font-size: 10px; }
  .api-usage-row > :nth-child(3), .api-usage-row > :nth-child(4) { display: none; }
  .api-detail-row { grid-template-columns: minmax(128px, 1fr) repeat(3, auto); gap: 7px; }
  .api-detail-row > :nth-child(3), .api-detail-row > :nth-child(4), .api-detail-row > :last-child { display: none; }
  .api-detail-event-row > :first-child { display: none; }
  .api-usage-actions { margin-left: 0; }
  .api-asset-row { grid-template-columns: minmax(146px, 1fr) auto auto; gap: 7px; }
  .api-asset-row > :last-child { display: none; }
}
.review-banner { display: flex; align-items: center; gap: 12px; }
.review-banner:not(.ok):not(.warn) { color: var(--info); }

/* ---------- 任务抽屉 ---------- */
#pdRoot { display: flex; flex-direction: column; height: 100%; }
.pd-head { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px 12px; }
.pd-title { display: flex; align-items: center; gap: 11px; min-width: 0; }
.pd-title b { font-size: 14.5px; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pd-title em { font-style: normal; font-size: 11.5px; color: var(--faint); display: flex; align-items: center; gap: 5px; margin-top: 3px; }
.pd-tabs { display: flex; gap: 2px; padding: 0 20px; border-bottom: 1px solid var(--hairline); }
.pd-tab { padding: 9px 13px; font-size: 12.5px; font-weight: 650; color: var(--muted); border-bottom: 2px solid transparent; margin-bottom: -1px; transition: all var(--t-fast); }
.pd-tab:hover { color: var(--text); }
.pd-tab.is-active { color: var(--brand-deep); border-bottom-color: var(--brand); }
.pd-body {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 16px 20px;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.pd-body::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.pd-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 20px; border-top: 1px solid var(--hairline); }
.pd-note { font-size: 11.5px; color: var(--muted); margin-bottom: 10px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.pd-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 40px 0; color: var(--faint); }
.pd-drop {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  border: 1.5px dashed var(--line-2); border-radius: var(--r-md);
  padding: 12px; font-size: 11.5px; color: var(--muted); background: var(--soft);
  margin-bottom: 12px; transition: all var(--t-fast);
}
.pd-drop:hover, .pd-drop.drag-over { border-color: var(--brand); background: var(--tint); color: var(--brand); }
.pd-slots { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pd-slot { position: relative; border: 1px solid var(--hairline); border-radius: var(--r-md); overflow: hidden; background: var(--soft); }
.pd-slot img { width: 100%; aspect-ratio: 3/4; object-fit: cover; cursor: zoom-in; }
.pds-ph { display: grid; place-items: center; aspect-ratio: 3/4; font-size: 22px; font-weight: 800; color: var(--line-2); }
.pds-cap { padding: 7px 9px; }
.pds-cap b { display: block; font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pds-cap em { font-style: normal; font-size: 10px; color: var(--faint); display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pds-tools {
  position: absolute; top: 6px; right: 6px;
  display: inline-flex; align-items: center; gap: 5px;
  opacity: 0; transform: translateY(-2px); transition: opacity var(--t-fast), transform var(--t-fast);
}
.pds-up, .pds-refine {
  font-size: 10px; font-weight: 700; color: #fff;
  background: rgba(10, 15, 30, .6); backdrop-filter: blur(4px);
  border-radius: 6px; padding: 3px 8px; cursor: pointer;
  transition: background var(--t-fast);
}
.pds-refine { display: inline-flex; align-items: center; gap: 4px; }
.pds-up:hover, .pds-refine:hover { background: rgba(10,15,30,.88); }
.pd-slot:hover .pds-tools, .pd-slot:focus-within .pds-tools { opacity: 1; transform: none; }
.pd-prompt { margin-bottom: 12px; }
.pdp-head { display: flex; align-items: center; gap: 8px; margin-bottom: 7px; }
.pdp-seg { background: var(--soft); border: 1px solid var(--hairline); border-radius: var(--r-md); padding: 9px 11px; margin-bottom: 7px; }
.pdp-seg pre { font-family: inherit; font-size: 11px; color: var(--muted); white-space: pre-wrap; line-height: 1.7; margin-top: 6px; max-height: 170px; overflow-y: auto; }
.pd-units { display: flex; flex-direction: column; gap: 6px; }
.pd-unit { display: flex; align-items: center; gap: 9px; font-size: 12px; padding: 8px 11px; border-radius: var(--r-sm); background: var(--soft); border-left: 3px solid var(--success); }
.pd-unit.i2v { border-left-color: var(--brand); }
.pd-unit b { font-family: var(--mono); font-size: 11px; color: var(--text); }
.pd-unit span { flex: 1; color: var(--muted); font-size: 11px; }
.pd-unit .ok { color: var(--success); }
.pd-jobs { display: flex; flex-direction: column; gap: 7px; }
.pdj { display: flex; align-items: center; gap: 10px; font-size: 12px; }
.pdj b { width: 130px; flex: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.pdj-bar { flex: 1; height: 5px; border-radius: 5px; background: var(--line); overflow: hidden; }
.pdj-bar i { display: block; height: 100%; background: var(--grad-brand); transition: width .4s; }
.pdj.failed .pdj-bar i { background: var(--danger); }
.pdj.succeeded .pdj-bar i { background: var(--success); }
.pdj em { font-style: normal; font-size: 10.5px; color: var(--faint); width: 52px; text-align: right; font-variant-numeric: tabular-nums; }
.pd-review { display: flex; flex-direction: column; gap: 12px; }
.pd-review.ok { align-items: center; padding: 30px 0; color: var(--success); }
.pd-review.ok p { color: var(--muted); font-size: 12px; }
.pdr-state { display: flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 700; }
.pdr-state.approved { color: var(--success); }
.pdr-state.rejected { color: var(--warning); }
.pdr-notes { background: var(--warning-bg); color: var(--warning); border-radius: var(--r-md); padding: 9px 12px; font-size: 12px; }
.pdr-sum { font-size: 12px; color: var(--muted); line-height: 1.7; }
.pdr-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.pd-copy-panel {
  border: 1px solid var(--hairline);
  border-radius: var(--r-lg);
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(247,249,252,.88));
  padding: 12px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
}
.pd-copy-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 9px; }
.pd-copy-panel-head b { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; }
.pd-copy-panel-head em { font-style: normal; color: var(--faint); font-size: 10.5px; }
.pd-copy-panel .field { margin-bottom: 9px; }
.pd-copy-panel .field:last-child { margin-bottom: 0; }
.pd-copy-panel textarea.input { resize: vertical; min-height: 136px; line-height: 1.75; }
.pd-ref-panel h4 { margin: 0 0 6px; font-size: 13.5px; line-height: 1.45; }
.pd-ref-meta { color: var(--faint); font-size: 11px; margin-bottom: 8px; }
.pd-ref-copy {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.75;
  white-space: pre-wrap;
  max-height: 154px;
  overflow-y: auto;
}
.pd-ref-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.pd-ref-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 9px; }

/* ---------- 账号对话框 ---------- */
.ad-body { max-height: calc(100vh - 250px); overflow-y: auto; padding-right: 4px; }
.ad-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.ad-voice-config, .ad-reference-audio { padding-block: 8px; border-top: 1px solid var(--hairline); }
.ad-voice-row { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr); gap: 8px; align-items: center; }
.ad-reference-audio-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px; align-items: center; }
.ad-reference-audio-row .btn { min-height: 38px; border-radius: 7px; }
.ad-body .seg-group { gap: 2px; border-bottom: 1px solid var(--hairline); }
.ad-body .seg-group button { min-height: 36px; border: 0; border-radius: 0; background: transparent; }
.ad-body .seg-group button::before { display: none; }
.ad-body .seg-group button:hover { color: var(--text); background: rgba(15,23,42,.035); transform: none; }
.ad-body .seg-group button.is-active { color: var(--text); background: transparent; box-shadow: inset 0 -2px 0 #171b22; }
#adSub { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
#adSub button { min-width: 0; justify-content: center; white-space: nowrap; }
#adSub .seg-sub { margin-left: 4px; overflow: hidden; text-overflow: ellipsis; }
.ad-grid .full, .ad-grid .field.full { grid-column: 1 / -1; }
.ad-block { border: 1px solid var(--hairline); border-radius: var(--r-lg); padding: 13px 14px; margin-top: 12px; background: var(--soft); }
.adb-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 9px; flex-wrap: wrap; }
.adb-head b { font-size: 12.5px; display: inline-flex; align-items: center; gap: 5px; }
.ad-char-row { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.ad-char-drop.drag-over { border-color: var(--brand); background: var(--tint); box-shadow: var(--ring); }
.ad-char-prev { width: 60px; height: 38px; object-fit: cover; border-radius: 8px; border: 1px solid var(--line); }
.ad-image-drop {
  min-height: 86px; border: 1.5px dashed var(--line-2); border-radius: var(--r-lg);
  background: var(--soft); display: flex; align-items: center; justify-content: center;
  gap: 12px; color: var(--muted); cursor: pointer; transition: all var(--t-fast);
  padding: 12px; overflow: hidden;
}
.ad-image-drop:hover, .ad-image-drop.drag-over { border-color: var(--brand); background: var(--tint); box-shadow: var(--ring); }
.ad-image-drop b { font-size: 12.5px; color: var(--text); }
.ad-image-drop.avatar { justify-content: flex-start; min-height: 74px; }
.ad-image-drop.avatar img, .ad-image-drop.avatar i {
  width: 52px; height: 52px; border-radius: 16px; object-fit: cover; flex: none;
  display: grid; place-items: center; font-style: normal; font-weight: 800; font-size: 18px;
  color: #fff; background: var(--grad-brand); box-shadow: var(--shadow-xs);
}
.ad-image-drop.style-ref { min-height: 124px; flex-direction: column; }
.ad-image-drop.style-ref img { width: 100%; max-height: 180px; object-fit: contain; border-radius: var(--r-md); background: #fff; }
.ad-ai-board { border-top: 1px dashed var(--line-2); padding-top: 11px; }
.ad-dir-row { display: flex; gap: 7px; align-items: center; margin-bottom: 9px; }
.ad-char-prompt {
  font-family: var(--mono); font-size: 10.5px; line-height: 1.7; color: var(--muted);
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md);
  padding: 11px; max-height: 180px; overflow-y: auto; white-space: pre-wrap; margin-bottom: 9px;
}
.ad-asset-grid { display: flex; gap: 8px; flex-wrap: wrap; }
.ad-thumb { position: relative; width: 64px; height: 64px; border-radius: var(--r-md); overflow: hidden; border: 1px solid var(--line); }
.ad-thumb img { width: 100%; height: 100%; object-fit: cover; }
.ad-thumb .ref-x { position: absolute; top: 2px; right: 2px; background: rgba(10, 15, 30, .6); color: #fff; }
.ad-naming { font-size: 11px; color: var(--muted); background: var(--tint); border-radius: var(--r-md); padding: 9px 12px; margin-top: 12px; }
.ad-naming b { font-family: var(--mono); font-size: 10.5px; }
.ad-import { display: flex; align-items: center; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.ad-batch {
  display: flex; align-items: center; gap: 14px; cursor: pointer;
  border: 1.5px dashed var(--line-2); border-radius: var(--r-lg);
  padding: 14px 16px; background: var(--soft); margin-bottom: 14px;
  transition: all var(--t-fast);
}
.ad-batch:hover, .ad-batch.drag-over { border-color: var(--brand); background: var(--tint); }
.adb-drop-core { width: 42px; height: 42px; border-radius: 12px; background: var(--surface); border: 1px solid var(--line); display: grid; place-items: center; color: var(--brand); flex: none; }
.adb-drop-text b { display: block; font-size: 13px; }
.adb-drop-text em { font-style: normal; font-size: 11px; color: var(--faint); display: block; margin-top: 2px; }
.ad-or { display: flex; align-items: center; gap: 12px; color: var(--faint); font-size: 11.5px; margin-bottom: 14px; }
.ad-or::before, .ad-or::after { content: ""; flex: 1; height: 1px; background: var(--hairline); }

@media (max-width: 980px) {
  .ov-stats { grid-template-columns: repeat(2, 1fr); }
  .overview { min-height: 0; }
  .ov-hero { grid-template-columns: 1fr; }
  .ovh-right { align-items: stretch; }
  .ovh-right .btn.primary { align-self: flex-start; }
  .ov-cols { height: auto; }
  .ov-scroll { max-height: 226px; }
  .ov-cols, .cut-top, .set-cols { grid-template-columns: 1fr; }
  .chain-page { grid-template-columns: 1fr; }
  .workbench { grid-template-columns: 170px minmax(0, 1fr); }
  .wb-assets { display: none; }
  #wsAudioBar .refbar-actions.voice-audio-actions { grid-template-columns: 1fr; }
  .voice-side-actions { justify-content: flex-start; }
}

/* ---------- 首页 · 数据问答 ---------- */
.ov-chat {
  width: 100%;
  padding: 12px 13px;
  border: 1px solid rgba(148, 163, 184, .24);
  border-radius: var(--r-lg);
  background: linear-gradient(180deg, rgba(255,255,255,.72), rgba(247,250,255,.48));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75);
  backdrop-filter: blur(18px) saturate(1.18);
  -webkit-backdrop-filter: blur(18px) saturate(1.18);
}
.ovc-head { display: flex; align-items: center; gap: 9px; margin-bottom: 8px; }
.ovc-ava { filter: drop-shadow(0 4px 12px rgba(61, 91, 255, .35)); }
.ovc-head b { font-size: 12.5px; display: block; }
.ovc-head em { font-style: normal; font-size: 10.5px; color: var(--faint); }
.ovc-msgs { display: flex; flex-direction: column; gap: 6px; height: 58px; overflow-y: auto; padding: 1px; }
.ovc-msgs:empty { height: auto; }
.ovc-sugs { display: flex; gap: 6px; flex-wrap: wrap; }
.ov-chat-mini .ovc-sugs .chip { padding: 5px 9px; font-size: 11px; }
.ovc-bubble {
  min-width: 0; max-width: 78%; border-radius: 13px; padding: 9px 13px;
  font-size: 12.5px; line-height: 1.7; width: fit-content;
  overflow-wrap: anywhere; word-break: break-word;
}
.ovc-bubble .ovc-link { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; overflow-wrap: anywhere; word-break: break-all; }
.ovc-bubble.agent .ovc-link { color: #2457b7; }
.ovc-bubble.user { align-self: flex-end; background: var(--grad-brand); color: #fff; border-radius: 13px 13px 4px 13px; }
.ovc-bubble.agent { align-self: flex-start; background: var(--soft); border: 1px solid var(--hairline); border-radius: 4px 13px 13px 13px; color: var(--text); }
.ovc-bubble.typing { display: flex; gap: 4px; padding: 12px 14px; }
.ovc-bubble.typing i { width: 5px; height: 5px; border-radius: 50%; background: var(--faint); animation: typing 1.2s infinite; }
.ovc-bubble.typing i:nth-child(2) { animation-delay: .15s; }
.ovc-bubble.typing i:nth-child(3) { animation-delay: .3s; }
.ovc-input { display: flex; gap: 7px; margin-top: 8px; }
.ovc-input input {
  flex: 1; background: var(--soft); border: 1px solid var(--line); border-radius: 99px;
  padding: 8px 13px; font-size: 12px; outline: 0; transition: all var(--t-fast);
}
.ovc-input input:focus { border-color: var(--brand); box-shadow: var(--ring); background: #fff; }
.ovc-send {
  width: 34px; height: 34px; border-radius: 50%; flex: none;
  background: var(--grad-brand); color: #fff; display: grid; place-items: center;
  box-shadow: 0 6px 16px rgba(61, 91, 255, .35);
  transition: all var(--t-fast);
}
.ovc-send:hover { transform: translateY(-1px) scale(1.05); }

/* ---------- 脚本页 · 口播音频 ---------- */
.tts-card { padding: 15px 16px; margin-top: 14px; }
.tts-done { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--success); margin-bottom: 10px; flex-wrap: wrap; }
.tts-done.estimate { color: var(--warning); }
.tts-done .muted { color: var(--faint); }
.tts-error {
  display: flex; align-items: flex-start; gap: 7px; flex-wrap: wrap;
  color: var(--danger); background: var(--danger-bg); border-radius: var(--r-md);
  padding: 8px 10px; margin: 0 0 10px; font-size: 12px; line-height: 1.5;
}
.tts-error span { color: var(--muted); flex: 1 1 260px; }
.tts-controls { display: flex; align-items: end; gap: 10px; margin: 8px 0 12px; flex-wrap: wrap; }
.tts-controls .field { flex: 1 1 320px; margin-bottom: 0; }
.tts-controls .field.preset { flex: 0 1 180px; }
.field.compact { margin-bottom: 0; }
.tts-audio {
  display: flex; align-items: center; gap: 8px; padding: 8px;
  border: 1px solid var(--hairline); border-radius: var(--r-md);
  background: var(--soft); margin: 8px 0 12px;
}
.tts-audio audio { flex: 1; min-width: 180px; height: 34px; }

/* ---------- 文案分镜 ---------- */
.material-mode-switch {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, .32);
  background: rgba(255,255,255,.66);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
  backdrop-filter: blur(16px);
}
.material-mode-switch button {
  min-height: 28px;
  padding: 0 12px;
  border-radius: 999px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  transition: background .18s ease, color .18s ease, transform .18s ease;
}
.material-mode-switch button:hover { color: var(--ink); transform: translateY(-1px); }
.material-mode-switch button.on {
  color: #fff;
  background: linear-gradient(135deg, rgba(17,24,39,.96), rgba(55,65,81,.82));
  box-shadow: 0 8px 22px rgba(15,23,42,.16);
}
.infoflow-panel { padding: 14px; }
.infoflow-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.infoflow-head b,
.if-storyboard-title b { display: inline-flex; align-items: center; gap: 6px; color: var(--ink); font-size: 13px; }
.infoflow-head em,
.if-storyboard-title em { display: block; margin-top: 3px; color: var(--muted); font-style: normal; font-size: 11.5px; }
.infoflow-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.workshop-chain-page { margin-top: -6px; }
.ws-ratio-control { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.ws-ratio-control > em { margin-right: 2px; color: var(--muted); font-size: 10.5px; font-style: normal; font-weight: 750; }
.ws-rt {
  min-height: 30px;
  padding: 3px 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: rgba(255,255,255,.72);
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease;
}
.ws-rt:hover { border-color: var(--line-2); color: var(--text); background: #fff; }
.ws-rt[aria-pressed="true"] { border-color: var(--brand); color: var(--brand); background: var(--tint); box-shadow: 0 0 0 2px rgba(61,91,255,.08); }
.infoflow-ref-row {
  display: grid;
  grid-template-columns: minmax(180px, 260px) minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  margin: 0 0 12px;
  padding: 10px 12px;
  border: 1px solid rgba(148,163,184,.26);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(255,255,255,.78), rgba(248,250,252,.56));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.86);
}
.infoflow-ref-row.drag-over { border-color: var(--brand); background: rgba(239,246,255,.84); box-shadow: var(--ring); }
.infoflow-ref-row > div:first-child b {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--ink);
  font-size: 12.5px;
}
.infoflow-ref-row > div:first-child em {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  line-height: 1.45;
}
.infoflow-segment-list { display: grid; gap: 12px; }
.if-segment-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(250px, 34%);
  gap: 12px;
  border: 1px solid rgba(148,163,184,.28);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(255,255,255,.88), rgba(244,248,255,.62));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.92), 0 14px 36px rgba(15,23,42,.06);
  padding: 12px;
  overflow: hidden;
}
.if-segment-copy { min-width: 0; }
.if-segment-copy > p { margin: 0 0 8px; color: var(--muted); font-size: 11.5px; line-height: 1.45; }
.if-segment-copy textarea { min-height: 206px; resize: vertical; line-height: 1.55; font-size: 12px; }
.if-segment-media {
  position: relative;
  min-height: 294px;
  display: grid;
  place-items: center;
  border: 1px dashed rgba(148,163,184,.34);
  border-radius: 13px;
  overflow: hidden;
  background: rgba(241,245,249,.78);
}
.if-segment-media.running { border-color: rgba(65,105,255,.35); background: linear-gradient(135deg, rgba(240,245,255,.95), rgba(226,237,255,.88)); }
.if-segment-media.done { border-style: solid; border-color: rgba(16,185,129,.36); background: #07101f; }
.if-segment-media.failed { border-color: rgba(248,113,113,.4); background: rgba(254,242,242,.85); }
.if-segment-media .if-video-frame { width: 100%; height: 100%; min-height: 294px; border: 0; border-radius: 0; cursor: zoom-in; }
.if-segment-media .if-video-frame > span { position: absolute; right: 10px; top: 10px; width: 32px; height: 32px; display: grid; place-items: center; color: #fff; border-radius: 8px; background: rgba(15,23,42,.62); }
.if-segment-media small { position: absolute; left: 12px; right: 12px; bottom: 10px; color: var(--danger); font-size: 10px; text-align: center; }
.if-card-top { display: flex; align-items: center; gap: 8px; margin-bottom: 7px; }
.if-card-top span {
  flex: none;
  padding: 3px 8px;
  border-radius: 999px;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  background: rgba(15,23,42,.9);
}
.if-card-top b { color: var(--ink); font-size: 13px; flex: 1; }
.if-card-top em { font-style: normal; color: var(--muted); font-size: 11px; font-variant-numeric: tabular-nums; }
.if-card-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid rgba(148,163,184,.18);
}
.if-card-actions span {
  min-width: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}
.if-storyboard-row {
  margin-top: 12px;
  display: grid;
  grid-template-columns: minmax(180px, 260px) minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 10px;
  border: 1px dashed rgba(148,163,184,.38);
  border-radius: 16px;
  background: rgba(255,255,255,.55);
}
.if-storyboard-row.drag-over { border-color: var(--brand); background: rgba(239,246,255,.88); box-shadow: var(--ring); }
.if-storyboards { display: flex; align-items: center; gap: 8px; min-width: 0; overflow-x: auto; padding: 2px; }
.if-board-thumb,
.if-board-empty {
  position: relative;
  flex: 0 0 74px;
  width: 74px;
  aspect-ratio: 3 / 4;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid rgba(148,163,184,.28);
  background: rgba(248,250,252,.9);
  box-shadow: var(--shadow-xs);
}
.if-board-thumb { cursor: zoom-in; }
.if-board-thumb img,
.if-board-thumb .ph { width: 100%; height: 100%; object-fit: cover; display: grid; place-items: center; color: #fff; }
.if-board-thumb span {
  position: absolute;
  left: 4px;
  right: 4px;
  bottom: 4px;
  padding: 2px 4px;
  border-radius: 999px;
  color: #fff;
  background: rgba(15,23,42,.55);
  font-size: 8px;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.if-board-thumb i {
  position: absolute;
  right: 4px;
  top: 4px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  background: rgba(15,23,42,.68);
  opacity: 0;
  transition: opacity .16s ease;
}
.if-board-thumb:hover i { opacity: 1; }
.if-board-empty {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 4px;
  color: var(--faint);
  border-style: dashed;
}
.if-board-empty b { color: var(--ink); font-size: 14px; }
.if-board-empty em { font-style: normal; font-size: 10px; }
.if-storyboards.is-loading .if-board-empty {
  background: linear-gradient(115deg, rgba(255,255,255,.95), rgba(222,234,255,.72), rgba(255,255,255,.95));
  background-size: 240% 100%;
  animation: coverSweep 1.25s ease-in-out infinite;
}
.if-video-status {
  margin-top: 12px;
  padding: 12px;
  border: 1px solid rgba(148,163,184,.28);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(255,255,255,.9), rgba(244,248,255,.7));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}
.if-video-status.compact { padding: 9px 12px; border-radius: 12px; }
.if-video-status.running {
  border-color: rgba(65,105,255,.28);
  background: linear-gradient(115deg, rgba(255,255,255,.95), rgba(230,238,255,.78), rgba(255,255,255,.95));
  background-size: 240% 100%;
  animation: coverSweep 1.35s ease-in-out infinite;
}
.if-video-status.done { border-color: rgba(16,185,129,.26); background: rgba(240,253,244,.72); }
.if-video-status.failed { border-color: rgba(248,113,113,.26); background: rgba(254,242,242,.72); }
.if-video-summary {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
}
.if-video-summary em {
  flex: 1;
  min-width: 0;
  color: var(--muted);
  font-style: normal;
  font-size: 11px;
  font-weight: 600;
}
.if-video-previews {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 10px;
}
.if-video-tile {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-width: 0;
  padding: 8px;
  border: 1px solid rgba(148,163,184,.22);
  border-radius: 14px;
  background: rgba(255,255,255,.72);
}
.if-video-tile.running .if-video-frame {
  border-color: rgba(65,105,255,.32);
  background: linear-gradient(135deg, rgba(15,23,42,.96), rgba(42,79,145,.9));
}
.if-video-tile.done .if-video-frame { border-color: rgba(16,185,129,.42); }
.if-video-tile.failed .if-video-frame { border-color: rgba(248,113,113,.42); background: rgba(254,226,226,.9); }
.if-video-frame {
  position: relative;
  width: 72px;
  aspect-ratio: 9 / 16;
  overflow: hidden;
  border: 1px solid rgba(148,163,184,.28);
  border-radius: 12px;
  background: #0b1220;
}
.if-video-frame video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: #050816; }
.if-video-placeholder {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 5px;
  padding: 8px;
  color: rgba(255,255,255,.92);
  text-align: center;
}
.if-segment-media > .if-video-placeholder { position: relative; inset: auto; color: var(--muted); }
.if-segment-media.done .if-video-placeholder { color: rgba(255,255,255,.9); }
.if-video-placeholder b { font-size: 11px; line-height: 1.15; }
.if-video-placeholder em { font-style: normal; font-size: 9px; color: rgba(255,255,255,.68); }
.if-segment-media > .if-video-placeholder em { color: var(--faint); }
@media (max-width: 900px) {
  .if-segment-row { grid-template-columns: 1fr; }
  .if-segment-media { min-height: 320px; }
}
.if-video-tile.failed .if-video-placeholder { color: var(--danger); }
.if-video-tile.failed .if-video-placeholder em { color: var(--danger); opacity: .72; }
.if-video-meta { min-width: 0; display: grid; gap: 4px; }
.if-video-meta b { color: var(--ink); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.if-video-meta span { color: var(--muted); font-size: 11px; font-weight: 700; }
.if-video-tile small {
  grid-column: 1 / -1;
  color: var(--danger);
  font-size: 10.5px;
  line-height: 1.4;
}
.if-video-pulse {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 2px solid rgba(87,119,255,.2);
  border-top-color: var(--brand);
  animation: spin 1s linear infinite;
}
@media (max-width: 980px) {
  .infoflow-grid,
  .if-storyboard-row,
  .if-video-previews,
  .infoflow-ref-row { grid-template-columns: 1fr; }
  .infoflow-head { align-items: flex-start; flex-direction: column; }
  .infoflow-actions { width: 100%; justify-content: flex-start; }
  .dh-plan-head { align-items: flex-start; flex-direction: column; }
  .dh-plan-head > .dh-plan-actions { width: 100%; justify-content: flex-start; flex-wrap: wrap; }
}
.ws-cards { display: flex; flex-direction: column; gap: 12px; }
.ws-card { padding: 13px 15px; transition: all var(--t-fast); }
.ws-card.drag-over { border-color: var(--brand); box-shadow: var(--ring); background: var(--tint); }
.ws-head { display: flex; align-items: center; gap: 9px; margin-bottom: 6px; }
.ws-head b { font-size: 13px; flex: 1; }
.ws-mode { display: inline-flex; align-items: center; gap: 3px; font-size: 10px; font-weight: 700; border-radius: 6px; padding: 2px 7px; }
.ws-mode.i2v { background: var(--tint); color: var(--brand-deep); }
.ws-mode.t2v { background: var(--success-bg); color: var(--success); }
.ws-card.i2v { border-left: 3px solid var(--brand); }
.ws-card.t2v { border-left: 3px solid var(--success); }
.ws-body.single { grid-template-columns: 1fr; }
.ws-dur { font-size: 10.5px; color: var(--muted); display: inline-flex; align-items: center; gap: 3px; background: var(--soft); border-radius: 6px; padding: 2px 8px; font-variant-numeric: tabular-nums; }
.ws-line { font-size: 11.5px; color: var(--muted); margin-bottom: 10px; display: flex; align-items: center; gap: 5px; }
.ws-body { display: grid; grid-template-columns: 1fr 132px 1fr; gap: 12px; }
.ws-body.i2v.has-prev { grid-template-columns: 1fr 132px 1fr 132px; }
.ws-label { font-size: 10.5px; font-weight: 700; color: var(--faint); margin-bottom: 6px; }
/* 分镜参考图（最多4张） */
.ws-refs { display: flex; flex-wrap: wrap; gap: 6px; }
.ws-ref { position: relative; width: 46px; height: 60px; border-radius: 7px; overflow: hidden; border: 1px solid var(--hairline); background: var(--soft); flex: none; }
.ws-ref img { width: 100%; height: 100%; object-fit: cover; cursor: zoom-in; }
.ws-ref-x { position: absolute; right: 2px; top: 2px; width: 15px; height: 15px; border-radius: 50%; background: rgba(0,0,0,.55); color: #fff; display: grid; place-items: center; opacity: 0; transition: opacity var(--t-fast); }
.ws-ref:hover .ws-ref-x { opacity: 1; }
.ws-ref.add { display: grid; place-items: center; color: var(--faint); border-style: dashed; cursor: pointer; }
.ws-ref.add:hover { border-color: var(--brand); color: var(--brand); }
/* 分镜图（放大到 9:16 定帧） */
.ws-boardcol { display: flex; flex-direction: column; }
.ws-board-frame { position: relative; width: 100%; max-width: 118px; aspect-ratio: 9/16; border-radius: var(--r-sm); overflow: hidden; border: 1px solid var(--line); display: grid; place-items: center; }
.ws-board-frame.empty { border-style: dashed; background: var(--soft); }
.ws-board-frame.drag-over { border-color: var(--brand); box-shadow: var(--ring); background: var(--tint); }
.ws-board-frame img { width: 100%; height: 100%; object-fit: cover; cursor: zoom-in; }
.ws-board-ph { display: flex; flex-direction: column; align-items: center; gap: 4px; color: var(--faint); font-size: 9.5px; padding: 6px; text-align: center; }
.ws-board-ph em { font-style: normal; }
.ws-board-acts { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }
.ws-thumbrow { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
.ws-thumb {
  width: 56px; height: 74px; border-radius: var(--r-sm); overflow: hidden; flex: none;
  background: var(--soft); border: 1px solid var(--hairline);
  display: grid; place-items: center;
}
.ws-thumb img { width: 100%; height: 100%; object-fit: cover; cursor: zoom-in; }
.ws-thumb-ph { font-size: 10px; color: var(--faint); }
.ws-jobrow { margin-top: 8px; }
.wsj { display: flex; align-items: center; gap: 8px; font-size: 11.5px; font-weight: 600; }
.wsj.run { color: var(--run); }
.wsj.ok { color: var(--success); }
.wsj.fail { color: var(--danger); }
.wsj .link-btn { font-size: 11px; }
.wsj-bar { flex: 1; height: 4px; border-radius: 4px; background: var(--line); overflow: hidden; max-width: 140px; }
.wsj-bar b { display: block; height: 100%; background: var(--grad-brand); transition: width .4s; }
.ws-dur.cap { background: rgba(230, 160, 30, .14); color: #b8800c; }

/* 口播 ↔ 画面对齐明细 */
.ws-align { margin-bottom: 10px; border: 1px solid var(--hairline); border-radius: var(--r-sm); padding: 7px 9px; background: var(--soft); }
.ws-al-head { font-size: 10.5px; font-weight: 700; color: var(--muted); display: flex; align-items: center; gap: 5px; margin-bottom: 4px; }
.ws-al { display: grid; grid-template-columns: 66px 1.1fr 1fr; gap: 8px; align-items: baseline; padding: 3px 0; border-top: 1px dashed var(--hairline); }
.ws-al:nth-of-type(1) { border-top: 0; }
.ws-al em { font-style: normal; font-variant-numeric: tabular-nums; color: var(--brand-deep); font-weight: 700; font-size: 10px; }
.ws-al b { font-weight: 600; font-size: 11px; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ws-al span { color: var(--faint); font-size: 10.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 成片预览（工坊单元就绪后） */
.ws-body.single.has-prev { grid-template-columns: 1fr 132px; }
.ws-prevcol { display: flex; flex-direction: column; }
.ws-prev-frame { position: relative; width: 100%; max-width: 118px; aspect-ratio: 9/16; border-radius: var(--r-sm); overflow: hidden; border: 1px solid var(--line); background: #0a0e1a; cursor: zoom-in; }
.ws-prev-frame img { width: 100%; height: 100%; object-fit: cover; opacity: .9; }
.ws-prev-frame video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: #050816; }
.ws-prev-frame.has-video { cursor: default; }
.ws-prev-frame::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(5,8,16,.05), rgba(5,8,16,.4)); }
.ws-prev-frame.has-video::after { pointer-events: none; background: linear-gradient(180deg, rgba(5,8,16,.02), rgba(5,8,16,.2)); }
.ws-prev-play { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 30px; height: 30px; border-radius: 50%; background: rgba(255,255,255,.18); backdrop-filter: blur(4px); border: 1px solid rgba(255,255,255,.4); color: #fff; display: grid; place-items: center; z-index: 1; }
.ws-prev-dur { position: absolute; right: 4px; bottom: 4px; font-size: 9px; font-weight: 700; color: #fff; background: rgba(0,0,0,.5); border-radius: 4px; padding: 0 5px; z-index: 1; }
.ws-prev-acts { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }
@media (max-width: 980px) { .ws-body, .ws-body.i2v, .ws-body.i2v.has-prev, .ws-body.single.has-prev { grid-template-columns: 1fr; } }

.ws-epgroup { margin-bottom: 12px; }
.ws-epgroup-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.ws-epgroup-head b { font-size: 12px; }
.ep-prompt.sm { max-height: 170px; font-size: 11px; }
@media (max-width: 860px) { .ws-body { grid-template-columns: 1fr; } }

/* ---------- 剪辑 · 声音轨 ---------- */
.cut-audio-row { display: flex; align-items: center; gap: 7px; font-size: 12px; padding: 5px 0; color: var(--muted); }
.cut-audio-row b { color: var(--text); font-variant-numeric: tabular-nums; }
.cut-audio-row em { font-style: normal; font-size: 10.5px; color: var(--faint); margin-left: auto; }
.cut-audio-row select { flex: 1; }
.cut-audio-row.vol input[type="range"] { flex: 1; }
.cut-audio-row.vol em { font-variant-numeric: tabular-nums; min-width: 34px; margin-left: 0; }
.tl-text-btn { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 14px; font-weight: 750; }
.input.sm { padding: 6px 9px; font-size: 12px; }

/* 真人/数字人文案分镜 */
.dh-mode {
  position: relative; display: inline-grid; grid-template-columns: 1fr 1fr; align-items: center;
  min-width: 148px; padding: 3px; border: 1px solid var(--hairline); border-radius: 999px;
  background: var(--soft); overflow: hidden;
}
.dh-mode i {
  position: absolute; top: 3px; bottom: 3px; left: 3px; width: calc(50% - 3px);
  border-radius: 999px; background: #171b22; box-shadow: 0 7px 18px rgba(15,23,42,.16);
  transition: transform .24s var(--ease), background-color .24s ease, box-shadow .24s ease;
}
.dh-mode.is-seedance i { transform: translateX(100%); background: #3f4650; box-shadow: 0 8px 22px rgba(15,23,42,.16); }
.dh-mode button {
  position: relative; z-index: 1; border: 0; background: transparent; color: var(--muted);
  border-radius: 999px; padding: 5px 10px; font-size: 11px; font-weight: 700; cursor: pointer;
  transition: color .18s ease, transform .18s ease;
}
.dh-mode button:hover { transform: translateY(-1px); }
.dh-mode button.on { color: #fff; }
.ws-mode-note {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin: -4px 0 14px; padding: 10px 14px;
  border: 1px solid var(--hairline); border-radius: var(--r-md);
  background: #fff; color: var(--muted); font-size: 12px;
}
.ws-mode-note b { color: var(--text); }
.ws-mode-note.digital { border-color: rgba(48, 118, 255, .18); background: linear-gradient(135deg, rgba(83, 112, 255, .08), rgba(255,255,255,.9)); }
.ws-mode-note.seedance { border-color: rgba(20, 184, 166, .18); background: linear-gradient(135deg, rgba(20, 184, 166, .08), rgba(255,255,255,.9)); }
.dh-plan { align-items: flex-start; }
.dh-plan-inline {
  grid-column: 1 / -1; width: 100%; margin-top: 12px; padding: 12px;
  border: 1px solid var(--hairline); border-radius: var(--r-md);
  background: linear-gradient(135deg, rgba(83,112,255,.07), rgba(255,255,255,.92));
}
.dh-plan-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.dh-plan-head > div { display: grid; gap: 2px; min-width: 0; }
.dh-plan-head b { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text); }
.dh-plan-head em { font-style: normal; color: var(--muted); font-size: 11px; }
.dh-plan-head > .dh-plan-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex: 0 0 auto; }
.dh-segs { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 8px; width: 100%; margin-top: 10px; }
.dh-seg { display: grid; grid-template-columns: auto auto minmax(0, 1fr) auto; gap: 6px; align-items: center; padding: 8px; border: 1px solid var(--hairline); border-radius: var(--r-sm); background: var(--soft); }
.dh-plan-inline .dh-segs { margin-top: 0; }
.dh-plan-empty { grid-column: 1 / -1; min-height: 108px; display: grid; place-items: center; align-content: center; gap: 6px; padding: 18px; border: 1px dashed var(--line); border-radius: var(--r-sm); color: var(--muted); background: rgba(255,255,255,.74); text-align: center; }
.dh-plan-empty b { color: var(--text); font-size: 12px; }
.dh-plan-empty em { max-width: 540px; color: var(--muted); font-size: 11px; font-style: normal; line-height: 1.6; }
.dh-plan-inline .dh-seg { background: #fff; }
.dh-plan-inline .dh-seg.is-generating {
  border-color: rgba(43, 110, 255, .38);
  background: linear-gradient(135deg, rgba(238, 245, 255, .92), #fff);
  box-shadow: 0 0 0 3px rgba(43, 110, 255, .08);
}
.dh-seg.ghost { opacity: .72; border-style: dashed; }
.dh-seg b { font-size: 11px; color: var(--text); }
.dh-seg span { font-size: 11px; color: var(--brand-deep); font-weight: 700; }
.dh-seg em { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font-style: normal; font-size: 10.5px; }
.dh-status {
  justify-self: end;
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--soft);
  color: var(--faint);
  font-style: normal;
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
}
.dh-status.running { background: rgba(43, 110, 255, .1); color: #2458c7; }
.dh-status.done { background: var(--success-bg); color: var(--success); }
.dh-status.failed { background: rgba(255, 77, 79, .1); color: #d32f2f; }
.dh-seg-drop { grid-column: 1 / -1; display: flex; align-items: center; gap: 6px; min-height: 34px; padding: 6px 8px; border: 1px dashed var(--hairline); border-radius: var(--r-sm); color: var(--muted); background: #fff; cursor: copy; }
.dh-seg-drop img { width: 28px; height: 28px; object-fit: cover; border-radius: 7px; }
.dh-seg-drop.drag-over { border-color: var(--brand); background: var(--tint); box-shadow: var(--ring); }
.dh-audio { grid-column: 1 / -1; width: 100%; height: 34px; margin-top: 2px; }
.dh-video { position: relative; z-index: 2; grid-column: 1 / -1; width: 100%; aspect-ratio: 9 / 16; max-height: 280px; border-radius: var(--r-sm); background: #0f172a; object-fit: contain; margin-top: 4px; pointer-events: auto; touch-action: manipulation; }
.dh-video-placeholder {
  grid-column: 1 / -1;
  display: grid;
  place-items: center;
  gap: 6px;
  width: 100%;
  min-height: 170px;
  aspect-ratio: 9 / 16;
  max-height: 280px;
  padding: 16px;
  border-radius: var(--r-sm);
  border: 1px dashed rgba(43, 110, 255, .32);
  background:
    radial-gradient(circle at 50% 28%, rgba(43, 110, 255, .14), transparent 38%),
    linear-gradient(135deg, rgba(238, 245, 255, .9), #fff);
  color: var(--text);
  text-align: center;
}
.dh-video-placeholder.idle {
  border-color: var(--hairline);
  background: var(--soft);
  color: var(--muted);
}
.dh-video-placeholder > b { font-size: 13px; color: var(--text); }
.dh-video-placeholder > em { font-style: normal; font-size: 11px; color: var(--muted); }
.dh-video-placeholder > i {
  width: min(150px, 78%);
  height: 5px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(43, 110, 255, .1);
}
.dh-video-placeholder > i > b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #5b6cff, #36c5f0);
  transition: width .3s ease;
}
.dh-audio-miss { grid-column: 1 / -1; color: var(--faint); font-size: 10.5px; }
.dh-error {
  grid-column: 1 / -1;
  color: var(--danger);
  background: var(--danger-bg);
  border-radius: var(--r-sm);
  padding: 7px 9px;
  font-size: 10.5px;
  line-height: 1.55;
}
.dh-seg-actions { grid-column: 1 / -1; display: flex; align-items: center; justify-content: flex-end; gap: 6px; margin-top: 2px; }
.dh-next-note { display: flex; align-items: center; gap: 10px; padding: 12px 14px; margin: 10px 0 14px; color: var(--muted); }
.dh-next-note b { display: inline-flex; align-items: center; gap: 6px; color: var(--text); white-space: nowrap; }
.dh-next-note span { font-size: 12px; }

.is-generating { position: relative; overflow: hidden; }
.is-generating::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(110deg, transparent 0%, rgba(255,255,255,.55) 45%, transparent 70%);
  transform: translateX(-110%); animation: genSweep 1.25s ease-in-out infinite;
}
@keyframes genSweep { to { transform: translateX(110%); } }

/* ---------- 发布清单 · 回传链接 ---------- */
.tag.pub { background: var(--success-bg); color: var(--success); border-color: transparent; }
.dv-published {
  display: flex; align-items: center; gap: 7px; flex-wrap: wrap;
  background: var(--success-bg); color: var(--success);
  border-radius: var(--r-md); padding: 9px 12px; margin: 10px 0;
  font-size: 12px; font-weight: 600;
}
.dv-published a { color: var(--success); text-decoration: underline; word-break: break-all; font-weight: 500; }
.dv-published em { font-style: normal; font-size: 10.5px; opacity: .75; }
.dv-supplier-note {
  display: flex; align-items: flex-start; gap: 7px;
  background: var(--soft); border: 1px solid var(--border);
  border-radius: var(--r-md); padding: 9px 12px; margin: 8px 0 10px;
  color: var(--text); font-size: 12px; line-height: 1.55;
}
.sup-status.pub { color: var(--success); }
.sup-views { border: 0; background: transparent; color: var(--text); font: inherit; cursor: pointer; white-space: nowrap; }
.sup-views:hover { color: var(--brand); }
.supplier-filters { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
body.workspace-shell-v2[data-zone="delivery"] .supplier-filters {
  padding-right: 58px;
}
.delivery-filter-controls { min-width: 0; display: flex; align-items: center; gap: 8px; flex: 1 1 auto; flex-wrap: wrap; }
.supplier-batch-download { margin-left: auto; }
.sup-table-wrap { min-height: 180px; overflow: hidden; }
.sup-table tbody tr[data-sup] { animation: sup-row-in 170ms cubic-bezier(.2,.8,.2,1) both; }
.sup-date-line { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin-top: 3px; }
.sup-date-line em { display: inline-flex; align-items: center; gap: 4px; margin: 0; }
.sup-created { color: var(--muted); }
@keyframes sup-row-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.supplier-filters select { width: auto; min-width: 132px; border-radius: 6px; }
.sup-actions-inner { display: flex; justify-content: flex-end; gap: 6px; white-space: nowrap; }
.sup-detail-row td { padding: 0 13px 13px; background: var(--soft); }
.sup-detail {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(180px, 34%);
  gap: 12px; padding: 12px; border: 1px solid var(--hairline);
  border-radius: var(--r-md); background: var(--surface);
}
.sup-detail-copy { min-width: 0; }
.sup-detail-copy b { display: block; margin-bottom: 7px; font-size: 13px; color: var(--text); }
.sup-detail-copy pre {
  max-height: 150px; overflow: auto; white-space: pre-wrap; line-height: 1.65;
  margin: 0; padding: 10px 12px; border-radius: var(--r-sm);
  background: var(--soft); color: var(--muted); font-family: inherit; font-size: 12px;
}
.sup-detail-copy p { color: var(--faint); font-size: 12px; }
.sup-detail-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.sup-detail-meta span { padding: 3px 8px; border-radius: 999px; background: var(--tint); color: var(--muted); font-size: 10.5px; }
.sup-detail-link-slot { min-height: 30px; margin-top: 9px; }
.sup-detail-link { width: fit-content; }
.sup-detail-imgs { display: grid; grid-template-columns: repeat(auto-fill, minmax(68px, 1fr)); gap: 8px; align-content: start; }
.sup-thumb { position: relative; border-radius: 10px; overflow: hidden; border: 1px solid var(--hairline); background: var(--soft); aspect-ratio: 3 / 4; }
.sup-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sup-thumb span { position: absolute; left: 5px; top: 5px; border-radius: 999px; background: rgba(15, 23, 42, .72); color: #fff; font-size: 9px; padding: 1px 5px; }
.sup-detail-empty { display: grid; place-items: center; min-height: 120px; border: 1px dashed var(--hairline); border-radius: var(--r-md); color: var(--faint); font-size: 12px; }
.sup-return-note {
  display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  color: var(--brand); font-style: normal;
}
.btn.danger-soft {
  color: var(--danger); border-color: rgba(239, 68, 68, .22); background: rgba(239, 68, 68, .05);
}

/* ---------- 供应商端 ---------- */
.supplier-shell { max-width: 1320px; margin: 0 auto; padding-bottom: 42px; }
.supplier-dashboard-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 0; }
.supplier-dashboard-stats button {
  position: relative; min-width: 0; min-height: 98px; padding: 14px 15px; border: 1px solid rgba(148,163,184,.24);
  border-radius: 12px; background: rgba(255,255,255,.78); text-align: left; cursor: pointer;
  box-shadow: 0 8px 30px rgba(34,56,90,.055); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.supplier-dashboard-stats button:hover { transform: translateY(-2px); border-color: rgba(37,99,235,.25); box-shadow: 0 14px 34px rgba(34,56,90,.09); }
.supplier-dashboard-stats button.is-accent { background: linear-gradient(135deg, #315fd5, #244bc0); color: #fff; }
.supplier-dashboard-stats span, .supplier-dashboard-stats em { display: block; font-style: normal; }
.supplier-dashboard-stats span { color: var(--muted); font-size: 12px; }
.supplier-dashboard-stats .is-accent span, .supplier-dashboard-stats .is-accent em { color: rgba(255,255,255,.75); }
.supplier-dashboard-stats b { display: block; margin: 7px 0 5px; font-size: 26px; line-height: 1; }
.supplier-dashboard-stats em { color: var(--faint); font-size: 10.5px; }
.supplier-dashboard-grid { --supplier-dashboard-height: clamp(480px, calc(100dvh - 104px), 680px); display: grid; grid-template-columns: minmax(0, 1fr) clamp(280px, 21vw, 310px); grid-auto-rows: max-content; gap: 14px; align-items: start; padding: 10px 8px 0; }
.supplier-dashboard-grid > .supplier-dashboard-main,
.supplier-dashboard-grid > .supplier-data-assistant { align-self: start; height: var(--supplier-dashboard-height); min-height: 0; margin-block: 0; }
.supplier-dashboard-main { min-width: 0; display: grid; align-content: start; height: var(--supplier-dashboard-height); min-height: 0; gap: 14px; }
.supplier-dashboard-visuals { display: grid; grid-template-columns: minmax(230px, .72fr) minmax(360px, 1.5fr); gap: 14px; }
.supplier-platform-chart, .supplier-trend-chart { min-height: 280px; padding: 20px; border-radius: 16px; text-align: left; overflow: visible; }
.supplier-chart-title { display: block; font-weight: 750; font-size: 14px; }
.supplier-donut { position: relative; display: grid; place-items: center; width: 152px; height: 152px; margin: 28px auto 20px; border-radius: 50%; transition: transform .22s ease; }
.supplier-platform-chart:hover .supplier-donut { transform: rotate(-3deg) scale(1.035); }
.supplier-donut > svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: hidden; transform: rotate(-90deg); }
.supplier-donut-track, .supplier-donut-segment { fill: none; }
.supplier-donut-track { stroke: #eff1f5; stroke-width: 20; }
.supplier-donut-segment { stroke-width: 20; stroke-linecap: butt; stroke-dasharray: var(--segment) calc(100 - var(--segment)); stroke-dashoffset: var(--offset); cursor: pointer; pointer-events: stroke; transition: stroke-width .18s ease, filter .18s ease, opacity .18s ease; }
.supplier-donut-segment.is-xhs { stroke: #315fd5; }
.supplier-donut-segment.is-video { stroke: #ed5978; }
.supplier-donut:has(.supplier-donut-segment.is-xhs:hover) .supplier-donut-segment.is-video, .supplier-donut:has(.supplier-donut-segment.is-xhs:focus-visible) .supplier-donut-segment.is-video, .supplier-donut:has(.supplier-donut-segment.is-video:hover) .supplier-donut-segment.is-xhs, .supplier-donut:has(.supplier-donut-segment.is-video:focus-visible) .supplier-donut-segment.is-xhs { opacity: .42; }
.supplier-donut-segment:hover, .supplier-donut-segment:focus-visible { stroke-width: 20; filter: drop-shadow(0 3px 5px rgba(30,45,72,.18)); outline: none; }
.supplier-donut::after { content: ""; width: 94px; height: 94px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 1px rgba(148,163,184,.12); }
.supplier-donut > i { position: absolute; z-index: 1; display: grid; text-align: center; font-style: normal; }
.supplier-donut b { font-size: 23px; }
.supplier-donut em { font-size: 10px; color: var(--faint); font-style: normal; }
.supplier-platform-legend { display: flex; align-items: center; justify-content: center; gap: 8px; color: var(--muted); font-size: 11px; }
.supplier-platform-legend button { display: inline-flex; align-items: center; gap: 5px; padding: 2px 4px; border: 0; border-radius: 5px; color: inherit; background: transparent; font: inherit; cursor: pointer; }
.supplier-platform-legend button:hover, .supplier-platform-legend button:focus-visible { color: var(--text); background: var(--soft); outline: none; }
.supplier-platform-legend i { width: 7px; height: 7px; border-radius: 50%; }
.supplier-platform-legend i.xhs { background: #315fd5; }
.supplier-platform-legend i.sph { background: #ed5978; }
.supplier-trend-scroll { min-width: 0; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; scrollbar-color: #cbd1d9 transparent; }
.supplier-trend-scroll::-webkit-scrollbar { height: 5px; }
.supplier-trend-scroll::-webkit-scrollbar-thumb { border-radius: 99px; background: #cbd1d9; }
.supplier-trend-canvas { width: max(100%, calc(var(--supplier-trend-points, 7) * 42px)); }
.supplier-trend-plot { position: relative; height: 178px; margin-top: 18px; }
.supplier-trend-plot svg { display: block; width: 100%; height: 100%; overflow: visible; }
.supplier-trend-node { position: absolute; z-index: 2; left: var(--x); top: var(--y); width: 12px; height: 12px; border: 2px solid #e83e62; border-radius: 50%; background: #fff; transform: translate(-50%, -50%); transition: transform .18s ease, background .18s ease; outline: 0; }
.supplier-trend-node:hover, .supplier-trend-node:focus-visible { background: #e83e62; transform: translate(-50%, -50%) scale(1.22); }
.supplier-trend-node i { position: absolute; left: 50%; bottom: calc(100% + 8px); width: max-content; max-width: 150px; padding: 5px 7px; border-radius: 7px; color: #fff; background: #202735; box-shadow: 0 7px 20px rgba(15,23,42,.18); font-size: 10px; font-style: normal; line-height: 1; opacity: 0; pointer-events: none; transform: translate(-50%, 4px); transition: opacity .16s ease, transform .16s ease; }
.supplier-trend-node:hover i, .supplier-trend-node:focus-visible i { opacity: 1; transform: translate(-50%, 0); }
.supplier-trend-labels { position: relative; display: block; height: 28px; margin-top: -5px; }
.supplier-trend-labels i { position: absolute; left: var(--x); display: grid; width: 42px; text-align: center; font-style: normal; transform: translateX(-50%); }
.supplier-trend-labels b { font-size: 10px; }
.supplier-trend-labels em { color: var(--faint); font-size: 9px; font-style: normal; }
.supplier-trend-chart > header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.supplier-trend-chart.is-trend-switching .supplier-trend-scroll { animation: trendChartIn .32s cubic-bezier(.16,.84,.34,1) both; }
.supplier-trend-actions { display: inline-flex; align-items: center; gap: 3px; }
.supplier-trend-actions button { padding: 3px 5px; border: 1px solid var(--line); border-radius: 5px; color: var(--muted); background: #fff; font-size: 9px; cursor: pointer; }
.supplier-trend-actions button:hover, .supplier-trend-actions button:focus-visible { color: var(--text); border-color: #9fb7eb; outline: none; }
.supplier-trend-detail-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 14px 18px 8px; border-bottom: 1px solid var(--line); }
.supplier-trend-detail-tools label { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: 11px; }
.supplier-trend-detail-tools input { padding: 5px 7px; border: 1px solid var(--line); border-radius: 6px; color: var(--text); font: inherit; }
.supplier-data-assistant { position: relative; top: auto; align-self: start; margin: 0; height: 100%; min-height: 0; display: grid; grid-template-rows: auto minmax(0, 1fr) auto auto; gap: 12px; padding: 18px; border-radius: 16px; overflow: hidden; }
.supplier-data-assistant header { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding-bottom: 13px; border-bottom: 1px solid var(--line); }
.supplier-data-assistant-icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; color: #315fd5; background: rgba(49,95,213,.09); flex: none; }
.supplier-data-assistant header > div { min-width: 0; flex: 1; }
.supplier-data-assistant header b, .supplier-data-assistant header em { display: block; }
.supplier-data-assistant header em { margin-top: 2px; color: var(--faint); font-size: 10.5px; font-style: normal; }
.supplier-today-link-actions { display: inline-flex; align-items: stretch; justify-content: flex-end; min-width: 0; height: 38px; margin-right: 18px; overflow: hidden; border: 1px solid #d5ddea; border-radius: 999px; background: #fff; box-shadow: 0 1px 2px rgba(15,23,42,.03); }
.supplier-today-links { min-width: 0; padding: 0 11px; border: 0; border-radius: 0; white-space: nowrap; box-shadow: none; }
.supplier-today-link-actions .icon-btn { width: 35px; height: 100%; flex: none; border: 0; border-left: 1px solid #e0e6ef; border-radius: 0; background: transparent; }
.supplier-today-link-actions .icon-btn:hover, .supplier-today-link-actions .icon-btn:focus-visible { background: rgba(49,95,213,.08); }
@media (max-width: 390px) {
  .supplier-data-assistant header { grid-template-columns: 34px minmax(0, 1fr); }
  .supplier-today-link-actions { grid-column: 1 / -1; justify-self: end; }
}
.supplier-data-messages { min-width: 0; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; display: flex; flex-direction: column; gap: 8px; padding: 2px; }
.supplier-data-bubble { max-width: 88%; min-width: 0; padding: 9px 11px; border-radius: 13px; font-size: 11.5px; line-height: 1.65; overflow-wrap: anywhere; word-break: break-word; }
.supplier-data-bubble.agent { align-self: flex-start; background: var(--soft); border-radius: 4px 13px 13px; }
.supplier-data-bubble.user { align-self: flex-end; background: #252a34; color: #fff; border-radius: 13px 13px 4px; }
.supplier-data-link { color: #2457b7; text-decoration: underline; text-underline-offset: 2px; overflow-wrap: anywhere; word-break: break-all; }
.supplier-data-link-wrap { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; }
.supplier-data-copy { display: inline-flex; flex: none; align-items: center; gap: 2px; padding: 1px 4px; border: 0; border-radius: 4px; background: rgba(49,95,213,.1); color: #2457b7; font-size: 9px; line-height: 1.4; cursor: pointer; }
.supplier-data-copy:hover { background: rgba(49,95,213,.18); }
.supplier-data-suggestions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; }
.supplier-data-suggestions button { min-width: 0; padding: 5px 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--muted); font-size: 9.5px; cursor: pointer; }
.supplier-data-assistant form { display: flex; gap: 7px; }
.supplier-data-assistant form input { min-width: 0; flex: 1; border: 1px solid var(--line); border-radius: 999px; padding: 9px 12px; outline: 0; }
.supplier-dashboard-detail-list { max-height: 62vh; overflow: auto; padding: 4px 18px 18px; }
.supplier-dashboard-detail-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 14px; align-items: center; padding: 13px 0; border-bottom: 1px solid var(--line); }
.supplier-dashboard-detail-row span, .supplier-dashboard-detail-row b, .supplier-dashboard-detail-row em { display: block; min-width: 0; }
.supplier-dashboard-detail-row b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.supplier-dashboard-detail-row em, .supplier-dashboard-detail-row time, .supplier-dashboard-detail-row i { color: var(--faint); font-size: 10.5px; font-style: normal; }
.supplier-dashboard-detail-row a { color: #2457b7; font-size: 11px; }
.supplier-loading, .supplier-empty { padding: 24px 4px; color: var(--faint); }
.supplier-stats { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-block: 1px solid var(--line); margin-bottom: 16px; }
.supplier-stats > div { padding: 18px 20px; border-right: 1px solid var(--line); background: var(--surface); }
.supplier-stats > div:last-child { border-right: 0; }
.supplier-stats b { display: block; font-size: 27px; line-height: 1; margin-bottom: 7px; }
.supplier-stats span { color: var(--muted); font-size: 12px; }
.supplier-stat-switch { display: flex; gap: 3px; margin-top: 8px; }
.supplier-stat-switch button { min-width: 0; padding: 3px 6px; border: 0; border-radius: 5px; background: transparent; color: var(--faint); font-size: 9.5px; font-weight: 700; cursor: pointer; }
.supplier-stat-switch button.on { color: #fff; background: var(--ink); }
.supplier-activity, .supplier-requests, .supplier-children { border-radius: 4px; }
.supplier-activity { position: relative; padding: 0 16px 16px; overflow: hidden; border: 1px solid rgba(148,163,184,.22); border-radius: 16px; box-shadow: 0 14px 34px rgba(34,56,90,.045); }
.supplier-log, .supplier-child-row { display: flex; align-items: center; gap: 12px; min-height: 58px; padding: 9px 14px; border-top: 1px solid var(--hairline); }
.supplier-log > i { width: 7px; height: 7px; border-radius: 50%; background: var(--success); flex: none; }
.supplier-log > span, .supplier-child-row > span:nth-child(2) { min-width: 0; flex: 1; }
.supplier-log b, .supplier-child-row b { display: block; font-size: 12.5px; }
.supplier-log em, .supplier-child-row em { display: block; color: var(--muted); font-size: 11px; font-style: normal; margin-top: 2px; }
.supplier-log time { color: var(--faint); font-size: 10.5px; }
.supplier-account-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(400px, 1fr)); border: 1px solid var(--line); background: var(--surface); }
.supplier-account-grid.is-switching { animation: supplierSwitchIn 220ms cubic-bezier(.2,.8,.2,1) both; }
@keyframes supplierSwitchIn { from { opacity: .55; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.supplier-activity-head { min-height: 48px; align-items: center; margin: 0; padding: 0; }
.supplier-activity-carousel { position: relative; min-height: 176px; overflow: hidden; perspective: 820px; transform-style: preserve-3d; }
.supplier-activity-carousel::after { content: ""; position: absolute; right: 0; bottom: 0; left: 0; height: 26px; pointer-events: none; background: linear-gradient(transparent, rgba(255,255,255,.94)); }
.supplier-activity-carousel.is-leaving > .supplier-log { animation: supplierActivityFlipOut .23s cubic-bezier(.4,0,.7,.2) both; animation-delay: calc(var(--supplier-activity-index, 0) * 28ms); }
.supplier-activity-carousel.is-entering > .supplier-log { animation: supplierActivityFlipIn .3s cubic-bezier(.16,.84,.34,1) both; animation-delay: calc(var(--supplier-activity-index, 0) * 34ms); }
@keyframes supplierActivityFlipOut { to { opacity: 0; transform: perspective(820px) rotateX(58deg) translateY(-10px); } }
@keyframes supplierActivityFlipIn { from { opacity: 0; transform: perspective(820px) rotateX(-56deg) translateY(12px); } to { opacity: 1; transform: none; } }
.supplier-activity-pagination { display: flex; align-items: center; justify-content: flex-end; gap: 7px; margin-top: 9px; color: var(--faint); font-size: 10.5px; }
.supplier-activity-pagination .icon-btn { width: 28px; height: 28px; }
.supplier-activity-modal-tools { display: flex; gap: 8px; padding: 0 18px 12px; }
.supplier-account { min-width: 0; display: grid; grid-template-columns: 42px minmax(0, 1fr) minmax(112px, 136px); align-items: center; gap: 10px; padding: 11px 12px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.supplier-account.is-disabled { background: rgba(255,239,242,.9); box-shadow: inset 0 0 0 1px rgba(210,61,84,.1); }
.supplier-account.is-disabled .supplier-account-avatar,
.supplier-account.is-disabled .supplier-account-copy { opacity: .58; filter: grayscale(.45); }
.supplier-account.is-new-account { position: relative; animation: supplierNewAccountGlow 2.8s ease-in-out infinite; }
.supplier-account.is-new-account::after { content: ""; position: absolute; inset: 5px; border: 1px solid rgba(53,101,214,.24); pointer-events: none; }
.supplier-new-account-badge { display: inline-grid; place-items: center; min-width: 18px; height: 18px; margin-left: 5px; padding: 0 4px; border-radius: 99px; color: #2d58b1; background: #e9f0ff; font-size: 9px; font-style: normal; vertical-align: 1px; }
.supplier-account-copy strong { color: #9c4b55; font: inherit; }
.supplier-account-avatar { width: 42px; height: 42px; border-radius: 6px; overflow: hidden; display: grid; place-items: center; color: #fff; font-weight: 700; }
.supplier-account-avatar img, .supplier-account-avatar > span { width: 100%; height: 100%; object-fit: cover; display: grid; place-items: center; }
.supplier-account-avatar.small { width: 30px; height: 30px; }
.supplier-account > div:nth-child(2) { min-width: 0; }
.supplier-account-copy { min-width: 0; }
.supplier-account b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.supplier-account em { display: block; margin-top: 3px; color: var(--muted); font-size: 11px; font-style: normal; }
.supplier-account > span { color: var(--faint); font-size: 11px; }
.supplier-account > span.assigned { color: var(--success); }
.supplier-account-tools { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.supplier-account-tools > label { width: min(340px, 100%); height: 38px; display: flex; align-items: center; gap: 8px; padding: 0 11px; border: 1px solid var(--line); background: var(--surface); }
.supplier-account-tools input { width: 100%; border: 0; outline: 0; background: transparent; color: var(--text); }
.supplier-filter-chips { display: flex; align-items: center; gap: 5px; overflow-x: auto; }
.supplier-filter-chips button { white-space: nowrap; min-height: 34px; padding: 0 10px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); background: var(--surface); font-weight: 700; cursor: pointer; }
.supplier-filter-chips button.on { color: #fff; border-color: var(--ink); background: var(--ink); }
.supplier-inline-assign { position: relative; flex: 0 0 76px; width: 76px; min-width: 0; padding-top: 9px; color: var(--faint); font-size: 9px; white-space: nowrap; }
.supplier-inline-assign > span:first-child { position: absolute; top: -5px; left: 2px; }
.supplier-inline-assign select { width: 100%; min-width: 0; height: 28px; padding: 0 22px 0 7px; border: 1px solid var(--line); border-radius: 6px; color: var(--text); background: var(--surface); font: inherit; font-size: 10px; font-weight: 700; }
.supplier-account-controls { min-width: 0; display: grid; gap: 5px; }
.supplier-account-control-row { min-width: 0; display: flex; align-items: flex-end; justify-content: flex-end; gap: 5px; }
.supplier-content-account-actions { min-width: 0; display: flex; align-items: center; justify-content: flex-end; gap: 4px; }
.supplier-content-account-actions .icon-btn.restore { color: #9c3142; border-color: rgba(201,55,78,.23); background: rgba(255,255,255,.66); }
.supplier-homepage-link, .supplier-homepage-empty { min-width: 0; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #3158aa; font-size: 10px; line-height: 1.25; }
.supplier-homepage-empty { color: var(--faint); }
.supplier-selection-count {
  display: inline-flex; align-items: center; gap: 4px; min-height: 32px; padding: 0 10px;
  border: 1px solid rgba(37,99,235,.2); border-radius: 999px; color: #3158aa;
  background: rgba(235,242,255,.82); font-size: 11px; font-weight: 650; white-space: nowrap;
}
.supplier-selection-count[hidden] { display: none; }
.supplier-selection-count b { color: #1f4ec2; font-size: 13px; }
@keyframes supplierNewAccountGlow { 0%,100% { background: transparent; } 50% { background: rgba(53,101,214,.055); } }
.ad-homepage-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; }
.supplier-child-editor { display: grid; gap: 8px; margin-bottom: 10px; }
.supplier-child-edit-row { display: grid; grid-template-columns: minmax(120px,.8fr) minmax(160px,1fr) minmax(150px,1fr) 36px; align-items: center; gap: 8px; }
.supplier-child-modal { width: min(720px, calc(100vw - 40px)); height: min(610px, calc(100dvh - 48px)); display: grid; grid-template-rows: auto minmax(0, 1fr) auto; overflow: hidden; }
.supplier-child-modal-body { min-height: 0; display: grid; grid-template-rows: minmax(0, 1fr) auto; gap: 12px; padding-block: 12px; overflow: hidden; }
.supplier-child-modal .supplier-child-editor { min-height: 0; margin: 0; padding: 2px 5px 2px 1px; overflow-y: auto; overflow-x: hidden; align-content: start; scrollbar-gutter: stable; }
.supplier-child-modal .supplier-child-add-row { justify-self: start; }
.supplier-child-submit-status { margin-right: auto; max-width: 330px; color: var(--muted); font-size: 12px; line-height: 1.4; }
.supplier-child-submit-status.is-loading { color: var(--text); }
.supplier-child-submit-status.is-success { color: #15945f; }
.supplier-child-submit-status.is-error { color: #c53b4a; }
.supplier-child-edit-row { max-height: 54px; transition: opacity 180ms ease, transform 180ms ease, max-height 180ms ease, margin 180ms ease; }
.supplier-child-edit-row.is-entering { opacity: 0; transform: translateY(7px); max-height: 0; }
.supplier-child-edit-row.is-leaving { opacity: 0; transform: translateX(8px); max-height: 0; margin-block: -4px; pointer-events: none; }
.supplier-child-row > span:nth-child(2) { min-width: 0; overflow: hidden; }
.supplier-child-row b, .supplier-child-row em { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 760px) { .supplier-account-tools { align-items: stretch; flex-direction: column; } .supplier-child-edit-row { grid-template-columns: 1fr; } .supplier-member-grid { grid-template-columns: 1fr; } }

/* v69 density pass: voice library and shared assets */
.vl-voice-filters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; margin: 8px 0; }
.vl-voice-filters label { min-width: 0; height: 34px; display: flex; align-items: center; gap: 7px; padding: 0 9px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,255,255,.72); color: var(--muted); }
.vl-voice-filters select { width: 100%; min-width: 0; border: 0; outline: 0; color: var(--text); background: transparent; font: inherit; font-size: 11.5px; font-weight: 700; }
.vl-voice-card { min-height: 76px; padding: 10px 108px 10px 10px; border-radius: 0; }
.vl-voice-card em { padding-right: 0; }
.vl-voice-actions { right: 9px; bottom: 50%; transform: translateY(50%); }
.vl-current-voice, .vl-tool-note { border-radius: 8px; }
.topbar-voice-dock { top: 3px; height: 36px; min-height: 36px; padding: 0; border-radius: 0; }
.topbar-voice-dock .vl-mini-status { min-height: 28px; padding: 3px 9px; border-radius: 0; }
.asset-grid { grid-template-columns: repeat(auto-fill, minmax(128px, 1fr)); gap: 9px; }
.asset-card { border-radius: 6px; }
.asset-card .ac-thumb { border-radius: 5px 5px 0 0; }
.asset-card .ac-body { padding: 8px; }
.asset-library-tabs { display: inline-flex; align-items: center; gap: 3px; padding: 3px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.asset-library-tabs button { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 0 11px; border: 0; border-radius: 6px; color: var(--muted); background: transparent; font-weight: 700; cursor: pointer; }
.asset-library-tabs button.on { color: #fff; background: var(--ink); box-shadow: var(--shadow-xs); }
.asset-library-tabs.text-switch { gap: 18px; padding: 0; border: 0; border-radius: 0; background: transparent; }
.asset-library-tabs.text-switch button,
.asset-library-tabs.text-switch button.on { min-height: 34px; padding: 7px 1px; border: 0; border-radius: 0; color: var(--muted); background: transparent; box-shadow: none; }
.asset-library-tabs.text-switch button:hover,
.asset-library-tabs.text-switch button.on { color: var(--text); }
.asset-mode-stage { animation: assetModeReveal 220ms cubic-bezier(.2,.76,.28,1) both; }
@keyframes assetModeReveal {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}

.creator-delivery-filters .select-shell { border-radius: 0; background: transparent; }
.creator-delivery-filters .select-shell::before { display: none; }
.view-root[data-drop-hint] { position: relative; }
.view-root[data-drop-hint].drag-over::after { content: attr(data-drop-hint); position: fixed; z-index: 120; inset: 78px 22px 22px 92px; display: grid; place-items: center; border: 1px dashed rgba(17,24,39,.55); background: rgba(255,255,255,.78); color: var(--text); font-size: 16px; font-weight: 800; backdrop-filter: blur(14px); pointer-events: none; }
body.workspace-shell-v2 .view-root[data-drop-hint].drag-over::after {
  position: absolute;
  inset: 0;
  border-radius: 10px;
}
.asset-card.is-audio .ac-thumb { aspect-ratio: 4 / 2.4; }
.asset-audio-thumb { width: 100%; height: 100%; min-height: 84px; display: grid; place-items: center; gap: 6px; padding: 12px; color: var(--text); background: var(--soft); }
.asset-audio-thumb audio { width: 100%; height: 28px; }
.supplier-assign-list { max-height: 54vh; overflow: auto; border: 1px solid var(--line); }
.supplier-assign-tools { display: flex; align-items: center; gap: 8px; margin-bottom: 9px; }
.supplier-assign-tools > label { min-width: 190px; flex: 1; height: 36px; display: flex; align-items: center; gap: 7px; padding: 0 10px; border: 1px solid var(--line); background: rgba(255,255,255,.55); }
.supplier-assign-tools input { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--text); }
.supplier-assign-empty { margin: 12px 0 0; color: var(--faint); text-align: center; font-size: 11px; }
.supplier-assign-list label { display: grid; grid-template-columns: 20px 30px minmax(0, 1fr) auto; gap: 9px; align-items: center; padding: 9px 12px; border-bottom: 1px solid var(--hairline); cursor: pointer; }
.supplier-assign-list label:last-child { border-bottom: 0; }
.supplier-assign-list em { color: var(--muted); font-size: 11px; font-style: normal; }
@media (max-width: 1100px) { .supplier-dashboard-grid { grid-template-columns: 1fr; } .supplier-dashboard-grid > .supplier-dashboard-main { height: auto; min-height: 0; } .supplier-dashboard-grid > .supplier-data-assistant { position: static; min-height: 420px; height: 420px; max-height: none; } }
@media (max-width: 900px) { .supplier-stats, .supplier-dashboard-stats { grid-template-columns: repeat(2, 1fr); } .supplier-dashboard-visuals { grid-template-columns: 1fr; } .supplier-account-grid { grid-template-columns: 1fr; } }
@media (max-width: 680px) { .supplier-activity-modal-tools { flex-wrap: wrap; } }
@media (prefers-reduced-motion: reduce) { .supplier-activity-carousel.is-leaving > .supplier-log, .supplier-activity-carousel.is-entering > .supplier-log { animation: none; } }

/* v84 integrated home: one cool-neutral dashboard, no mode tabs or page scrolling. */
body[data-zone="overview"] .view-root {
  padding: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
}
body[data-zone="overview"] .view-root::before,
body[data-zone="overview"] .view-root::after { display: none !important; }
.overview.overview-dashboard.overview-integrated {
  width: 100%;
  max-width: none;
  height: 100%;
  min-height: 0;
  box-sizing: border-box;
  margin: 0;
  padding: 8px 0 10px 16px;
  overflow: hidden;
  background: #fff;
}
.overview-integrated .overview-dashboard-layout {
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(292px, 23vw, 350px);
  grid-template-rows: minmax(0, 1fr);
  gap: 0;
  align-items: stretch;
}
.overview-integrated .overview-dashboard-main {
  --overview-data-columns: repeat(3, minmax(0, 1fr));
  --overview-data-gap: 10px;
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-rows: auto repeat(2, minmax(0, 1fr));
  gap: 6px;
  overflow: hidden;
  padding-right: 12px;
  background: #fff;
}

.supplier-account-total-views {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-width: 54px;
  height: 28px;
  padding: 0 9px;
  border: 1px solid #b9cdfd;
  border-radius: 999px;
  background: #eef4ff;
  color: #2d5fcd;
  font-size: 12px;
  font-weight: 700;
  cursor: default;
}
.overview-viz-card,
.overview-action-card,
.overview-account-strip {
  border: 1px solid #dbe2f0;
  border-radius: 8px;
  background: #fff;
  box-shadow: none;
}
.overview-viz-card,
.overview-action-card,
.overview-account-strip button {
  color: #16191e;
  font: inherit;
}
.overview-viz-card:hover,
.overview-action-card:hover { border-color: #8ba9ed; background: #fff; transform: translateY(-1px); }
.overview-viz-grid { min-height: 0; display: grid; grid-template-columns: var(--overview-data-columns); gap: var(--overview-data-gap); }
.overview-viz-grid > .overview-donut-card { grid-column: 1; }
.overview-viz-grid > .overview-trend-card { grid-column: 2 / span 2; }
.overview-viz-card { min-width: 0; min-height: 0; padding: 13px 14px; text-align: left; transition: border-color 180ms ease, background 180ms ease, transform 180ms ease; }
button.overview-viz-card { cursor: pointer; }
.overview-viz-card > header,
.overview-account-strip > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.overview-viz-card > header b,
.overview-account-strip > header b { font-size: 12px; }
.overview-viz-card > header em,
.overview-account-strip > header em { color: #8a9098; font-size: 9.5px; font-style: normal; }
.overview-gantt { height: calc(100% - 28px); min-height: 112px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; align-items: end; padding: 12px 3px 0; }
.overview-gantt button { min-width: 0; height: 100%; display: grid; grid-template-rows: auto minmax(48px, 1fr); gap: 6px; padding: 0; border: 0; color: inherit; background: transparent; text-align: left; cursor: pointer; }
.overview-gantt button > span { display: grid; gap: 2px; }
.overview-gantt button b { font-size: 18px; font-variant-numeric: tabular-nums; }
.overview-gantt button em { color: #777e87; font-size: 10px; font-style: normal; }
.overview-gantt button > i { position: relative; align-self: end; height: 100%; min-height: 48px; overflow: hidden; background: #eceef0; transition: background 180ms ease, transform 180ms ease; }
.overview-gantt button u { position: absolute; inset: auto 0 0; height: var(--value); background: #252a31; text-decoration: none; transform-origin: 50% 100%; transition: height 260ms ease, background 180ms ease, transform 180ms ease, box-shadow 180ms ease; }
.overview-gantt button:hover > i,
.overview-gantt button:focus-visible > i { background: #e1e5ea; transform: translateY(-2px); }
.overview-gantt button:hover u,
.overview-gantt button:focus-visible u { background: #505862; transform: scaleX(.86); box-shadow: 0 -5px 16px rgba(31,37,44,.16); }
.overview-donut-card { display: grid; grid-template-rows: auto minmax(0, 1fr); }
.overview-donut-wrap { min-height: 158px; display: grid; place-items: center; }
.overview-donut { position: relative; width: 140px; aspect-ratio: 1; display: grid; place-items: center; flex: none; border-radius: 50%; box-shadow: 0 10px 24px rgba(50,105,226,.12); }
.overview-donut > svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: hidden; transform: rotate(-90deg); }
.overview-donut-track { fill: none; stroke: #eff1f5; stroke-width: 16; }
.overview-donut-segment { fill: none; stroke-width: 16; stroke-linecap: butt; stroke-dasharray: var(--segment) calc(100 - var(--segment)); stroke-dashoffset: var(--offset); cursor: pointer; pointer-events: stroke; transition: stroke-width 180ms ease, filter 180ms ease, opacity 180ms ease; }
.overview-donut-segment.is-xhs { stroke: #3269e2; }
.overview-donut-segment.is-video { stroke: #e75a6c; }
.overview-donut:has(.overview-donut-segment.is-xhs:hover) .overview-donut-segment.is-video,
.overview-donut:has(.overview-donut-segment.is-xhs:focus-visible) .overview-donut-segment.is-video,
.overview-donut:has(.overview-donut-segment.is-video:hover) .overview-donut-segment.is-xhs,
.overview-donut:has(.overview-donut-segment.is-video:focus-visible) .overview-donut-segment.is-xhs { opacity: .42; }
.overview-donut-segment:hover,
.overview-donut-segment:focus-visible { stroke-width: 16; filter: drop-shadow(0 3px 5px rgba(30,45,72,.18)); outline: none; }
.overview-donut::after { content: ""; position: absolute; inset: 23px; border-radius: 50%; background: #fafafa; }
.overview-donut > i { position: relative; z-index: 1; display: grid; place-items: center; gap: 1px; font-style: normal; }
.overview-donut > i b { font-size: 22px; }
.overview-donut > i em { color: #8a9098; font-size: 9px; font-style: normal; }
.overview-trend-card { display: grid; grid-template-rows: auto minmax(0, 1fr); }
.overview-trend-card { overflow: hidden; }
.overview-trend-title { display: grid; gap: 2px; }
.overview-trend-title em { color: #8893a3; font-size: 8.5px; font-style: normal; }
.overview-trend-actions { display: inline-flex; align-items: center; gap: 4px; }
.overview-trend-nav,
.overview-trend-detail,
.overview-detail-filter { border: 1px solid #dce1e8; background: #fff; color: #59616d; font: inherit; cursor: pointer; transition: border-color 160ms ease, color 160ms ease, background 160ms ease, transform 160ms ease; }
.overview-trend-nav { width: 22px; height: 22px; display: grid; place-items: center; padding: 0; border-radius: 7px; font-size: 17px; line-height: 1; }
.overview-trend-detail { padding: 4px 7px; border-radius: 7px; font-size: 9px; font-weight: 700; }
.overview-trend-nav:hover,
.overview-trend-detail:hover,
.overview-detail-filter:hover { border-color: #9ca5b0; color: #1f252d; transform: translateY(-1px); }
.overview-trend-scroll { min-width: 0; display: grid; align-items: center; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; scrollbar-color: #cbd1d9 transparent; }
.overview-trend-scroll::-webkit-scrollbar { height: 5px; }
.overview-trend-scroll::-webkit-scrollbar-thumb { border-radius: 99px; background: #cbd1d9; }
.overview-trend-line { width: max(100%, var(--trend-chart-width, 648px)); min-height: 142px; display: grid; grid-template-rows: minmax(104px, 1fr) auto; align-content: center; gap: 4px; padding: 9px 0; }
.overview-trend-line svg { width: 100%; height: 100%; min-height: 94px; overflow: visible; }
.overview-trend-card.is-trend-switching .overview-trend-scroll { animation: trendChartIn .32s cubic-bezier(.16,.84,.34,1) both; }
@keyframes trendChartIn { from { opacity: .18; transform: translateY(7px) scale(.992); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .supplier-trend-chart.is-trend-switching .supplier-trend-scroll, .overview-trend-card.is-trend-switching .overview-trend-scroll { animation: none; } }
.overview-trend-line .grid { fill: none; stroke: #e6eaf0; stroke-width: 1; vector-effect: non-scaling-stroke; }
.overview-trend-line .trend-area { fill: url(#overviewTrendFill); pointer-events: none; }
.overview-trend-line .trend-curve { fill: none; stroke: #e5485d; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.overview-trend-line circle { fill: #ffffff; stroke: #e5485d; stroke-width: 1.7; vector-effect: non-scaling-stroke; transform-box: fill-box; transform-origin: center; cursor: pointer; transition: transform 180ms ease, fill 180ms ease, stroke 180ms ease, filter 180ms ease; }
.overview-trend-line circle:hover,
.overview-trend-line circle:focus-visible { fill: #e5485d; stroke: #ffffff; transform: scale(1.7); filter: drop-shadow(0 0 5px rgba(229,72,93,.38)); outline: none; }
.overview-trend-line > div { display: grid; grid-template-columns: repeat(var(--trend-points, 7), minmax(0, 1fr)); gap: 3px; }
.overview-trend-line > div > button { min-width: 0; display: grid; gap: 1px; padding: 2px; border: 0; border-radius: 6px; background: transparent; color: inherit; font: inherit; text-align: center; cursor: pointer; }
.overview-trend-line > div > button:hover,
.overview-trend-line > div > button:focus-visible { background: #f0f3f6; outline: none; }
.overview-trend-line > div b { font-size: 8.5px; font-variant-numeric: tabular-nums; }
.overview-trend-line > div em { overflow: hidden; color: #8a9098; font-size: 8px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.overview-detail-custom-range { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin-top: 10px; color: var(--muted); font-size: 11px; }
.overview-detail-custom-range > b { color: var(--text); }
.overview-detail-custom-range label { display: inline-flex; align-items: center; gap: 4px; }
.overview-detail-custom-range input { min-width: 0; padding: 5px 7px; border: 1px solid var(--line); border-radius: 6px; color: var(--text); background: #fff; font: inherit; }
.overview-detail-filter-section { display: grid; gap: 10px; padding: 2px 0 12px; border-bottom: 1px solid #edf0f3; }
.overview-detail-filter-section > div { display: flex; align-items: flex-start; gap: 10px; }
.overview-detail-filter-section > div > b { flex: 0 0 42px; padding-top: 5px; color: #6b737f; font-size: 11px; }
.overview-detail-filter-tags { display: flex; flex: 1; flex-wrap: wrap; gap: 6px; }
.overview-detail-filter-tags > em { padding: 5px 0; color: #9299a4; font-size: 11px; font-style: normal; }
.overview-detail-filter { padding: 4px 8px; border-radius: 999px; font-size: 10px; }
.overview-detail-filter.is-active { border-color: #252a31; background: #252a31; color: #fff; }
.overview-detail-summary { padding: 11px 0 4px; color: #6b737f; font-size: 11px; font-weight: 700; }
.overview-views-panel { width: min(1040px, calc(100vw - 44px)); max-width: 1040px; }
.overview-views-panel .overview-detail-filter-section { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
.overview-views-panel .overview-detail-custom-range { grid-column: 1 / -1; margin-top: 0; }
.overview-view-account { overflow: hidden; margin-top: 10px; border: 1px solid #e7ebf0; border-radius: 15px; background: #fff; }
.overview-view-account > header { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 12px; padding: 13px 15px; background: #f8fafc; }
.overview-view-account > header span { display: grid; gap: 3px; }
.overview-view-account > header em { color: #788291; font-size: 11px; font-style: normal; }
.overview-view-account > header .overview-view-account-total { justify-items: end; }
.overview-view-account > header .overview-view-account-total strong { color: #1f5ea8; font-size: 18px; font-variant-numeric: tabular-nums; }
.overview-view-deliveries { display: grid; }
.overview-view-delivery { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 11px 15px; border-top: 1px solid #edf0f4; }
.overview-view-delivery span { min-width: 0; display: grid; gap: 3px; }
.overview-view-delivery b { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.overview-view-delivery em { color: #89929f; font-size: 10px; font-style: normal; }
.overview-view-delivery strong { font-size: 14px; font-variant-numeric: tabular-nums; }
@media (max-width: 720px) {
  .overview-views-panel .overview-detail-filter-section { grid-template-columns: 1fr; }
  .overview-views-panel .overview-detail-custom-range { grid-column: auto; }
  .overview-view-account > header { grid-template-columns: minmax(0, 1fr) auto; }
  .overview-view-account > header .btn { grid-column: 1 / -1; justify-self: start; }
}
.overview-action-grid { display: grid; grid-template-columns: var(--overview-data-columns); gap: var(--overview-data-gap); }
.overview-action-card { min-width: 0; min-height: 58px; display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: 9px; padding: 8px 12px; text-align: left; cursor: pointer; transition: border-color 180ms ease, background 180ms ease, transform 180ms ease; }
.overview-action-icon { width: 30px; height: 30px; display: grid; place-items: center; color: #31363d; }
.overview-action-icon svg { overflow: visible; transition: transform 180ms cubic-bezier(.2,.8,.2,1); }
.overview-action-card:hover .overview-action-icon { color: #2d61d4; }
.overview-action-card:hover .overview-action-icon.is-views svg,
.overview-action-card:focus-visible .overview-action-icon.is-views svg { transform: translateY(-1px) scale(1.07); }
.overview-action-card:hover .overview-action-icon.is-views svg path:last-child,
.overview-action-card:focus-visible .overview-action-icon.is-views svg path:last-child { animation: overview-view-focus 720ms ease-in-out; }
.overview-action-card:hover .overview-action-icon.is-pulse svg path { animation: overview-pulse-draw 850ms ease-in-out infinite; }
.overview-action-card:hover .overview-action-icon.is-note svg path:nth-child(n + 3) { animation: overview-note-write 760ms ease-in-out infinite alternate; }
.overview-action-card:hover .overview-action-icon.is-link svg { transform-box: fill-box; transform-origin: center; animation: overview-link-turn 1.2s linear infinite; }
@keyframes overview-view-focus { 0%, 100% { opacity: 1; } 50% { opacity: .48; } }
@keyframes overview-pulse-draw { 0% { stroke-dasharray: 28; stroke-dashoffset: 28; opacity: .55; } 52% { stroke-dasharray: 28; stroke-dashoffset: 0; opacity: 1; } 100% { stroke-dasharray: 28; stroke-dashoffset: -28; opacity: .55; } }
@keyframes overview-note-write { 0%, 28% { opacity: .2; transform: scaleX(.25); transform-origin: left center; } 68%, 100% { opacity: 1; transform: scaleX(1); transform-origin: left center; } }
@keyframes overview-link-turn { to { transform: rotate(360deg); } }
.overview-action-card > div { min-width: 0; display: grid; gap: 3px; }
.overview-action-card > div b { font-size: 11px; }
.overview-action-card > div em { overflow: hidden; color: #8a9098; font-size: 9px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.overview-action-card > strong { font-size: 20px; font-variant-numeric: tabular-nums; }
.overview-account-strip { min-height: 0; padding: 9px 12px 10px; overflow: hidden; }
.overview-account-viewport { height: calc(100% - 22px); margin-top: 6px; overflow: hidden; }
.overview-account-page { height: 100%; min-height: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-rows: repeat(4, minmax(0, 1fr)); grid-auto-rows: minmax(0, 1fr); align-content: stretch; gap: 4px 8px; opacity: 1; transform: translateY(0); transition: opacity 150ms ease, transform 150ms ease; }
.overview-account-page.is-switching { opacity: 0; transform: translateY(-5px); }
.overview-account-strip button { min-width: 0; min-height: 0; height: auto; display: flex; align-items: center; align-self: stretch; gap: 6px; padding: 3px 2px; border: 0; border-radius: 0; background: transparent; text-align: left; cursor: pointer; transition: color 160ms ease; }
.overview-account-strip button:hover,
.overview-account-strip button:focus-visible { color: #315fbe; border: 0; outline: none; background: transparent; transform: none; }
.overview-account-strip button:focus-visible b { text-decoration: underline; text-underline-offset: 2px; }
.overview-account-avatar { width: 27px; height: 27px; display: grid; place-items: center; flex: none; overflow: hidden; border: 1px solid #d8e1f2; border-radius: 50%; background: linear-gradient(145deg, #e7efff, #f7f9ff); transition: border-color 160ms ease, transform 160ms ease; }
.overview-account-strip button:hover .overview-account-avatar,
.overview-account-strip button:focus-visible .overview-account-avatar { border-color: #9db6e6; transform: scale(1.04); }
.overview-account-avatar img { width: 100%; height: 100%; object-fit: cover; }
.overview-account-avatar i { color: #3769cb; font-size: 11px; font-style: normal; font-weight: 800; }
.overview-account-strip button > span { min-width: 0; display: grid; gap: 1px; }
.overview-account-strip button b,
.overview-account-strip button em { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.overview-account-strip button b { display: flex; align-items: center; gap: 4px; font-size: 10px; }
.overview-account-strip button b i { width: 13px; height: 13px; display: grid; place-items: center; flex: none; border-radius: 4px; color: #fff; background: #3d70d8; font-size: 7px; font-style: normal; }
.overview-account-strip button em { color: #8a9098; font-size: 8.5px; font-style: normal; }
.overview-account-detail-actions { display: flex; justify-content: flex-end; margin: 0 0 10px; }
.overview-account-detail-actions .btn[disabled] { border-color: #e1e5eb; color: #a9b0ba; background: #f6f7f9; cursor: not-allowed; opacity: 1; }
.overview-task-row.has-metrics { grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; }
.overview-task-metrics { max-width: 290px; overflow: hidden; color: #4f5660; font-size: 10px; font-weight: 700; line-height: 1.45; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.overview-detail-metrics { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; margin-bottom: 10px; }
.overview-detail-metrics > span { min-width: 0; display: grid; gap: 4px; padding: 10px 11px; border: 1px solid #e1e5e9; border-radius: 4px; background: #f6f7f8; }
.overview-detail-metrics em { color: #777e87; font-size: 9px; font-style: normal; }
.overview-detail-metrics b { overflow: hidden; font-size: 16px; font-variant-numeric: tabular-nums; text-overflow: ellipsis; }
.overview-integrated .overview-dashboard-assistant { position: static; min-width: 0; min-height: 0; overflow: hidden; border-left: 1px solid #dfe4ea; background: #fff; }
.overview-integrated .overview-dashboard-assistant .ov-chat { width: 100%; height: 100%; min-height: 0; max-height: none; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr) auto; align-items: stretch; gap: 10px; padding: 12px 14px 10px; border: 0; border-radius: 0; background: #ffffff; box-shadow: none; }
.overview-integrated .ovc-head { margin: 0; padding-bottom: 12px; border-bottom: 1px solid #e6e9ed; }
.overview-integrated .ovc-msgs { min-width: 0; height: auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; justify-content: start; align-content: start; }
.overview-integrated .ovc-msgs:has(.ovc-empty-guide) { display: grid; place-items: center; }
.overview-integrated .ovc-empty-guide { max-width: 220px; margin: 0; color: #a1a7af; font-size: 11px; line-height: 1.6; text-align: center; }
.overview-integrated .ovc-input { min-width: 0; margin: 0; }
.overview-integrated .ovc-input input { background: #f6f8fb; }
.overview-integrated .ovc-bubble.user { color: #fff; border: 1px solid #252a31; background: #252a31; box-shadow: none; }
.overview-integrated .ovc-bubble.agent { color: #20242a; border: 1px solid #dde1e6; background: #f1f3f5; box-shadow: none; }
.overview-chart-tooltip {
  position: fixed;
  z-index: 220;
  max-width: min(220px, calc(100vw - 32px));
  padding: 7px 9px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 4px;
  color: #fff;
  background: rgba(22,25,30,.94);
  box-shadow: 0 8px 20px rgba(15,23,42,.14);
  font-size: 10px;
  font-weight: 700;
  line-height: 1.35;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -100%) translateY(-4px);
  transition: opacity 140ms ease, transform 180ms cubic-bezier(.2,.8,.2,1);
}
.overview-chart-tooltip.is-visible { opacity: 1; transform: translate(-50%, -100%) translateY(-8px); }
@media (max-width: 1180px) {
  .overview-integrated .overview-dashboard-layout { grid-template-columns: minmax(0, 1fr) minmax(260px, 29vw); }
  .overview-donut { width: 116px; }
  .overview-detail-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .overview-task-row.has-metrics { grid-template-columns: minmax(0, 1fr) auto; }
  .overview-task-row.has-metrics .overview-task-metrics { grid-column: 1 / -1; max-width: none; text-align: left; }
}
@media (prefers-reduced-motion: reduce) {
  .overview-gantt button > i,
  .overview-gantt button u,
  .overview-trend-line circle,
  .overview-chart-tooltip,
  .overview-action-icon,
  .overview-action-icon * { transition: none !important; animation: none !important; }
}

/* v69 local QA: continuous workspaces and aligned operational tables */
.da-table { width: 100%; table-layout: fixed; border-collapse: collapse; }
.da-table th:not(:first-child), .da-table td:not(:first-child) { text-align: center; vertical-align: middle; }
.da-table .num, .da-table .da-time, .da-table .da-actions { padding-inline: 8px; font-variant-numeric: tabular-nums; }
.da-col-title { width: auto; }
.da-col-status { width: 92px; }
.da-col-num { width: 72px; }
.da-col-time { width: 86px; }
.da-col-action { width: 74px; }

.vl-workbench { width: 100%; grid-template-columns: minmax(230px,.62fr) minmax(0,1.25fr) minmax(260px,.68fr); overflow: hidden; }
.vl-workbench > .glass-panel { overflow: hidden; }
.vl-library { overflow: hidden; }
.vl-tabs {
  width: 100%; min-height: 42px; flex: 0 0 42px;
  display: grid; grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 4px; padding: 0 0 7px; margin: 0 0 8px;
  overflow: visible;
}
.vl-tabs button {
  position: static; width: 100%; min-width: 0; height: 34px;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0 5px; overflow: visible; line-height: 1;
  text-overflow: clip; white-space: nowrap; transform: none;
}
.vl-tabs button:active { transform: none; }
.vl-voice-list { width: 100%; min-height: 0; overflow-y: auto; overflow-x: hidden; padding-right: 2px; scrollbar-gutter: stable; }
.vl-voice-card { width: 100%; min-width: 0; min-height: 72px; padding: 9px 96px 9px 10px; overflow: visible; }
.vl-voice-card.is-mine { padding-right: 158px; }
.vl-voice-card.is-mine .vl-voice-actions { max-width: 150px; flex-wrap: nowrap; }
.vl-voice-card .vl-voice-core,
.vl-voice-card em,
.vl-voice-card i { max-width: 100%; min-width: 0; }
.vl-voice-card.is-previewing { border-color: rgba(17,24,39,.25); box-shadow: inset 3px 0 0 #171b22; }
.vl-current-voice, .vl-tool-note { padding: 9px 0; border: 0; border-bottom: 1px solid var(--hairline); border-radius: 0; background: transparent; box-shadow: none; }
.vl-tool-note { display: none; }
.vl-textarea { border-radius: 6px; background: rgba(255,255,255,.42); }
.voice-lab-page { width: 100%; overflow-x: hidden; }
.topbar-voice-dock { max-width: min(760px, calc(100vw - 390px)); overflow: hidden; }
.topbar-voice-dock .vl-mode-tabs { min-width: 0; }
.topbar-voice-dock .vl-mini-status { min-width: 0; overflow: hidden; }
.topbar-voice-dock .vl-mini-status > * { overflow: hidden; text-overflow: ellipsis; }

.supplier-child-editor { min-width: 0; overflow: hidden; }
.supplier-child-edit-row { grid-template-columns: minmax(0,.78fr) minmax(0,1fr) minmax(0,.88fr) 36px; width: 100%; min-width: 0; }
.supplier-child-edit-row .input { width: 100%; min-width: 0; }
.supplier-requests .card-head, .supplier-children .card-head { min-height: 52px; align-items: center; margin: 0; padding: 0; border-bottom: 0; }
.supplier-settings-panel { margin-bottom: 14px; padding: 14px 16px 16px; overflow: hidden; border: 1px solid rgba(148,163,184,.2); border-radius: 16px; background: linear-gradient(135deg, rgba(255,255,255,.92), rgba(248,250,253,.78)); box-shadow: 0 13px 30px rgba(34,56,90,.035); }
.supplier-settings-panel .card-head > span { min-width: 0; display: grid; gap: 3px; }
.supplier-settings-panel .card-head > span > b { display: inline-flex; align-items: center; gap: 7px; }
.supplier-settings-panel .supplier-child-row { margin-top: 6px; padding-inline: 8px; border-top: 0; border-radius: 10px; background: rgba(255,255,255,.55); }
.supplier-settings-panel .supplier-child-row + .supplier-child-row { border-top: 1px solid rgba(148,163,184,.12); }
.supplier-settings-panel .supplier-empty { margin: 0; padding: 28px 8px; }
.supplier-member-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(440px, 1fr)); gap: 8px; padding-top: 12px; }
.supplier-children .supplier-member-row { min-height: 62px; padding: 8px 10px; border: 1px solid var(--hairline); border-radius: 9px; background: rgba(255,255,255,.52); }
.supplier-children .supplier-member-row > span:nth-child(2) { min-width: 0; }
.supplier-children .supplier-member-row .btn { white-space: nowrap; }
.supplier-account-grid { view-transition-name: supplier-account-grid; }
::view-transition-old(supplier-account-grid), ::view-transition-new(supplier-account-grid) { animation-duration: 180ms; animation-timing-function: cubic-bezier(.2,.8,.2,1); }

/* v120 supplier workspace: compact, integrated panels */
.supplier-dashboard-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.supplier-shell:has(.supplier-dashboard-grid) {
  width: 100%;
  max-width: none;
  height: 100%;
  min-height: 0;
  box-sizing: border-box;
  margin: 0;
  padding: 8px 0 10px 16px;
  overflow: hidden;
  background: #fff;
}
.supplier-dashboard-grid {
  --supplier-dashboard-height: 100%;
  height: 100%;
  min-height: 0;
  grid-template-columns: minmax(0, 1fr) clamp(280px, 21vw, 310px);
  grid-template-rows: minmax(0, 1fr);
  gap: 0;
  align-items: stretch;
  padding: 0;
}
.supplier-dashboard-grid > .supplier-dashboard-main,
.supplier-dashboard-grid > .supplier-data-assistant,
.supplier-dashboard-main {
  height: 100%;
  min-height: 0;
}
.supplier-dashboard-main {
  grid-template-rows: auto repeat(2, minmax(0, 1fr));
  gap: 6px;
  overflow: hidden;
  padding-right: 12px;
}
.supplier-dashboard-stats { gap: 10px; }
.supplier-dashboard-stats button {
  min-height: 58px;
  padding: 8px 12px;
  border-color: #dbe2f0;
  border-radius: 8px;
  color: #16191e;
  background: #fff;
  box-shadow: none;
}
.supplier-dashboard-stats button.is-accent {
  color: #16191e;
  background: #fff;
}
.supplier-dashboard-stats .is-accent span,
.supplier-dashboard-stats .is-accent em { color: var(--muted); }
.supplier-dashboard-stats b { margin: 4px 0 2px; font-size: 20px; }
.supplier-dashboard-stats button:hover {
  border-color: #8ba9ed;
  background: #fff;
  box-shadow: none;
  transform: translateY(-1px);
}
.supplier-dashboard-visuals {
  min-height: 0;
  grid-template-columns: minmax(220px, 1fr) minmax(440px, 2fr);
  gap: 10px;
}
.supplier-platform-chart,
.supplier-trend-chart {
  height: 100%;
  min-height: 0;
  padding: 13px 14px;
  border: 1px solid #dbe2f0;
  border-radius: 8px;
  background: #fff;
  box-shadow: none;
}
.supplier-donut {
  width: 140px;
  height: 140px;
  margin: 16px auto 10px;
}
.supplier-activity {
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  padding: 0 12px 10px;
  border-color: #dbe2f0;
  border-radius: 8px;
  box-shadow: none;
}
.supplier-activity-carousel { min-height: 0; }
.supplier-data-assistant {
  align-self: stretch;
  grid-template-rows: auto minmax(0, 1fr) auto auto;
  height: 100%;
  max-height: none;
  padding: 12px 14px 10px;
  border: 0;
  border-left: 1px solid #dfe4ea;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
}
.supplier-data-messages { max-height: none; }
.supplier-account-platform-tabs {
  width: fit-content;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  margin: 2px 0 8px;
  padding: 3px;
  border-radius: 12px;
  background: #f3f3f1;
}
.supplier-account-platform-tabs button {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 11px;
  border: 0;
  border-radius: 9px;
  color: var(--muted);
  background: transparent;
  font: inherit;
  font-size: 11px;
  font-weight: 620;
  cursor: pointer;
  transition:
    color 220ms cubic-bezier(.16,.84,.34,1),
    background-color 220ms cubic-bezier(.16,.84,.34,1),
    box-shadow 220ms cubic-bezier(.16,.84,.34,1),
    transform 220ms cubic-bezier(.16,.84,.34,1);
}
.supplier-account-platform-tabs button:hover { color: var(--text); }
.supplier-account-platform-tabs button:active { transform: scale(.97); }
.supplier-account-platform-tabs button.is-active {
  color: var(--text);
  background: #fff;
  box-shadow: 0 1px 5px rgba(15,23,42,.09);
}
.supplier-account-platform-tabs em {
  color: var(--faint);
  font-size: 9.5px;
  font-style: normal;
  font-weight: 560;
}
.supplier-account-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  overflow: hidden;
  border: 0;
  background: transparent;
}
.supplier-account-grid.is-switching { transform-origin: 50% 0; }
.supplier-account-copy > em:not(.supplier-account-status) { display: none; }
.supplier-account {
  position: relative;
  width: 100%;
  min-width: 0;
  grid-template-columns: auto 34px minmax(0, 1fr) auto;
  min-height: 54px;
  gap: 8px;
  padding: 9px 8px;
  border-right: 0;
  border-bottom: 1px solid rgba(148,163,184,.16);
  border-radius: 0;
  background: transparent;
  transition: background-color 180ms ease;
}
.supplier-account[hidden] { display: none; }
.supplier-account:hover { background: rgba(31,41,55,.035); }
.supplier-account-sequence {
  position: absolute;
  top: 3px;
  left: 1px;
  z-index: 1;
  padding: 0 4px;
  border-radius: 999px;
  background: rgba(244, 246, 249, .92);
}
.supplier-account-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
}
.supplier-account-copy {
  overflow: hidden;
  white-space: nowrap;
}
.supplier-account-copy b {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  font-size: 12.5px;
  font-weight: 620;
}
.supplier-account-controls {
  min-width: max-content;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
  white-space: nowrap;
}
.supplier-account-control-row {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: nowrap;
}
.supplier-inline-assign {
  flex: 0 0 92px;
  width: 92px;
  padding-top: 0;
}
.supplier-inline-assign > span:first-child { display: none; }
.supplier-homepage-link {
  max-width: 108px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.supplier-account.is-search-focus,
.sup-table tr.is-search-focus {
  background: #f2f5fb;
  box-shadow: inset 0 0 0 1px rgba(47, 103, 230, .25);
  transition: background-color 180ms ease, box-shadow 180ms ease;
}
.supplier-platform-chart .supplier-donut {
  margin-top: 64px;
}
.supplier-trend-chart .supplier-trend-scroll {
  padding-top: 18px;
}
.supplier-account-filter-empty {
  margin: 0;
  padding: 34px 18px;
  color: var(--faint);
  text-align: center;
  font-size: 12px;
}
.sup-actions-inner {
  display: inline-flex;
  justify-content: flex-end;
  gap: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
}
.sup-acts .sup-actions-inner .btn {
  width: auto;
  min-width: 0;
  padding-inline: 9px;
  border: 0;
  border-left: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.sup-acts .sup-actions-inner .btn:first-child { width: auto; border-left: 0; }
.sup-acts .sup-actions-inner .btn:hover,
.sup-acts .sup-actions-inner .btn:focus-visible { background: #f3f3f1; }
.sup-acts .sup-actions-inner .btn.primary {
  color: #fff;
  border-left-color: #171b22;
  background: #171b22;
}
.sup-acts .sup-actions-inner .btn.primary:hover,
.sup-acts .sup-actions-inner .btn.primary:focus-visible {
  color: #fff;
  background: #2b2f35;
}
.supplier-settings-panel {
  padding: 4px 2px 10px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.supplier-settings-panel .supplier-child-row,
.supplier-children .supplier-member-row {
  border: 0;
  border-bottom: 1px solid rgba(148,163,184,.16);
  border-radius: 0;
  background: transparent;
}
@media (max-width: 900px) {
  .supplier-dashboard-stats,
  .supplier-dashboard-visuals { grid-template-columns: minmax(0, 1fr); }
  .supplier-shell:has(.supplier-dashboard-grid) { height: auto; overflow: visible; padding-left: 8px; }
  .supplier-dashboard-grid,
  .supplier-dashboard-grid > .supplier-dashboard-main,
  .supplier-dashboard-grid > .supplier-data-assistant,
  .supplier-dashboard-main { height: auto; }
  .supplier-dashboard-main { grid-template-rows: auto; overflow: visible; }
  .supplier-data-assistant { min-height: 420px; border-left: 0; border-top: 1px solid #dfe4ea; }
  .supplier-account-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (min-width: 901px) and (max-width: 1380px) {
  .supplier-account-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.ovc-send, .agw-send { background: #171b22; box-shadow: 0 6px 16px rgba(15,23,42,.16); }
.ovc-send:hover, .agw-send:hover { background: #2a303a; box-shadow: 0 8px 20px rgba(15,23,42,.2); }

@media (max-width: 1180px) {
  .vl-workbench { grid-template-columns: minmax(205px,.62fr) minmax(0,1.1fr) minmax(240px,.7fr); }
  .topbar-voice-dock .vl-mini-status em { display: none; }
}

/* unified compact filter controls */
.select-shell {
  position: relative;
  min-width: 148px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  color: var(--muted);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.72);
  transition: border-color var(--t-fast), box-shadow var(--t-fast), background var(--t-fast);
}
.select-shell:hover { border-color: var(--line-2); background: #fff; }
.select-shell:focus-within { border-color: var(--brand); box-shadow: var(--ring); }
.select-shell select {
  appearance: none;
  -webkit-appearance: none;
  flex: 1;
  min-width: 0;
  height: 100%;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.select-shell > svg:last-child { flex: none; pointer-events: none; color: var(--faint); }
.asset-smart-filters { display: grid; grid-template-columns: minmax(220px, 1fr) auto minmax(180px, 260px) auto; align-items: center; gap: 9px; }
.asset-smart-filters .fb-search { margin: 0; }
.asset-smart-filters .account-select { width: 100%; }
.asset-smart-filters.is-personal { grid-template-columns: minmax(220px, 1fr) auto auto; }
.asset-personal-source-filter { gap: 14px; padding-inline: 4px; white-space: nowrap; }
.asset-filter-action { min-height: 38px; white-space: nowrap; }
.batch-image-editor { display: grid; grid-template-columns: minmax(180px, 260px) minmax(0, 1fr); gap: 16px; align-items: start; }
.batch-image-editor > img { width: 100%; max-height: 360px; object-fit: contain; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--soft); }
.batch-image-editor-fields { min-width: 0; display: grid; gap: 14px; }
.batch-image-ref-section { min-width: 0; padding: 12px 8px 8px; border-top: 1px solid var(--hairline); border-radius: 12px; transition: border-color var(--t-fast), background var(--t-fast), box-shadow var(--t-fast); }
.batch-image-ref-section.drag-over { border-color: var(--brand); background: var(--brand-soft); box-shadow: var(--ring); }
.batch-image-ref-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 9px; }
.batch-image-ref-head > span { font-size: 12px; font-weight: 750; color: var(--text); }
.batch-image-ref-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.batch-image-ref-card { min-width: 0; padding: 7px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.batch-image-ref-card > img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 8px; background: var(--soft); }
.batch-image-ref-card > div { min-width: 0; display: grid; gap: 6px; margin-top: 7px; }
.batch-image-ref-card b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.batch-image-ref-card span { display: flex; align-items: center; gap: 8px; }
.batch-image-ref-card .link-btn { padding: 0; font-size: 10.5px; }
.batch-image-ref-empty { grid-column: 1 / -1; padding: 16px; border: 1px dashed var(--line); border-radius: 12px; color: var(--faint); font-size: 11px; text-align: center; background: var(--soft); }
.ws-account-lock { white-space: nowrap; }
.dh-seg-drop.is-locked { cursor: default; opacity: .82; }
.supplier-filters .select-shell { min-width: 150px; }
.supplier-filters .select-shell select { width: auto; }
.supplier-member-row { flex-wrap: nowrap; }
.supplier-member-form { display: grid; gap: 14px; }
.supplier-member-form label { display: grid; gap: 6px; color: var(--muted); font-size: 12px; font-weight: 700; }
.supplier-member-form p { margin: 0; color: var(--faint); font-size: 11px; line-height: 1.6; }
.page-head .head-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin-left: auto; }
.single-image-inline { display: grid; grid-template-columns: 1fr; gap: 12px; align-items: end; padding: 14px; }
.image-creation-mode { position: relative; isolation: isolate; width: max-content; display: grid; grid-template-columns: repeat(2, minmax(110px, 1fr)); gap: 4px; margin: 0; padding: 4px; border: 1px solid var(--line); border-radius: 9px; background: rgba(255,255,255,.64); overflow: hidden; }
.image-creation-mode::before { content: ""; position: absolute; z-index: -1; inset: 4px auto 4px 4px; width: calc(50% - 6px); border-radius: 6px; background: #171b22; box-shadow: 0 5px 14px rgba(15,23,42,.14); transform: translateX(0); transition: transform 260ms cubic-bezier(.22,.75,.2,1); }
.image-creation-mode[data-mode="single"]::before { transform: translateX(calc(100% + 4px)); }
.image-creation-mode button { min-height: 34px; padding: 0 14px; border-radius: 6px; color: var(--muted); background: transparent; font-size: 11.5px; font-weight: 800; transition: color 200ms ease; }
.image-creation-mode button.is-active { color: #fff; background: transparent; box-shadow: none; }
.image-mode-stage { min-width: 0; margin-bottom: 10px; }
.image-mode-stage.is-forward .image-mode-panel { animation: imageModeSlideForward 280ms cubic-bezier(.22,.75,.2,1) both; }
.image-mode-stage.is-backward .image-mode-panel { animation: imageModeSlideBack 280ms cubic-bezier(.22,.75,.2,1) both; }
@keyframes imageModeSlideForward { from { opacity: 0; transform: translateX(22px); } to { opacity: 1; transform: none; } }
@keyframes imageModeSlideBack { from { opacity: 0; transform: translateX(-22px); } to { opacity: 1; transform: none; } }
.single-image-inline .copy-inline-head { grid-column: 1 / -1; }
.single-image-inline .field { margin: 0; }
.single-image-inline .single-image-actions { display: flex; align-items: center; gap: 8px; }
.single-image-copy-result { grid-column: 1 / -1; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--soft); }
.single-image-copy-result b { display: block; margin-bottom: 4px; }
.single-image-copy-result p, .single-image-error { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.single-image-copy-result.is-empty { min-height: 92px; display: grid; align-content: center; color: var(--faint); background: rgba(248,250,252,.55); }
.copy-inline-head { flex-wrap: nowrap; }
.copy-inline-head > .copy-inline-actions { min-width: auto; margin-left: auto; display: flex; flex: 0 0 auto; flex-direction: row; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: nowrap; }
.copy-inline-actions .image-creation-mode { grid-template-columns: repeat(2, minmax(88px, 1fr)); }
.copy-inline-actions > .btn { min-height: 42px; white-space: nowrap; }
.image-count-select {
  min-height: 42px; display: inline-flex; align-items: center; gap: 6px; padding: 3px 5px 3px 10px;
  border: 1px solid var(--line); border-radius: 9px; background: rgba(255,255,255,.74);
  color: var(--muted); font-size: 10px; font-weight: 800; white-space: nowrap;
}
.image-count-select svg { color: var(--faint); }
.image-count-select select.input { width: 72px; height: 34px; padding: 0 25px 0 8px; border: 0; border-radius: 6px; background-color: var(--soft); box-shadow: none; font-weight: 800; }
.single-image-error { color: var(--danger); }
@media (max-width: 1180px) {
  .copy-inline-head { align-items: flex-start; overflow-x: auto; scrollbar-width: none; }
  .copy-inline-head::-webkit-scrollbar { display: none; }
}
@media (max-width: 760px) {
  .page-head .head-actions { width: 100%; justify-content: space-between; }
  .image-creation-mode { grid-template-columns: repeat(2, minmax(88px, 1fr)); }
  .single-image-inline { grid-template-columns: 1fr; }
}
.delivery-remark-dot { display: inline-block; width: 7px; height: 7px; margin-left: 6px; border-radius: 50%; background: #ef4444; box-shadow: 0 0 0 3px rgba(239,68,68,.12); vertical-align: middle; }
.delivery-remark-button { position: relative; }
.delivery-chat-head { border-bottom: 1px solid var(--hairline); }
.delivery-remark-modal { display: grid; grid-template-rows: minmax(280px, 1fr) auto; gap: 12px; min-height: 480px; padding-bottom: 10px; }
.delivery-remark-timeline { max-height: 410px; overflow: auto; display: grid; gap: 12px; align-content: start; padding: 16px 10px; border: 1px solid var(--hairline); border-radius: 10px; background: #f8fafc; scrollbar-gutter: stable; }
.delivery-remark-entry { max-width: 86%; display: grid; grid-template-columns: 28px minmax(0,1fr); gap: 8px; align-items: end; }
.delivery-remark-entry.is-mine { margin-left: auto; grid-template-columns: minmax(0,1fr) 28px; }
.delivery-remark-entry.is-mine .delivery-chat-avatar { grid-column: 2; grid-row: 1; }
.delivery-remark-entry.is-mine > div { grid-column: 1; grid-row: 1; }
.delivery-chat-avatar { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 8px; color: #fff; background: #64748b; font-size: 11px; font-style: normal; font-weight: 800; }
.delivery-remark-entry > div { min-width: 0; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px 10px 10px 3px; background: #fff; box-shadow: 0 3px 10px rgba(15,23,42,.04); }
.delivery-remark-entry.is-mine > div { border-color: #c9d8ff; border-radius: 10px 10px 3px 10px; background: #eaf1ff; }
.delivery-remark-entry header { display: flex; align-items: center; gap: 7px; margin-bottom: 5px; }
.delivery-remark-entry header b { font-size: 12px; }
.delivery-remark-entry header span, .delivery-remark-entry header time { color: var(--faint); font-size: 10px; }
.delivery-remark-entry header time { margin-left: auto; }
.delivery-remark-entry p { margin: 0; color: var(--text); font-size: 12px; line-height: 1.6; }
.delivery-remark-reply { display: grid; gap: 6px; font-size: 11px; font-weight: 750; }
.delivery-remark-reply textarea { min-height: 82px; resize: vertical; }
.delivery-chat-foot { border-top: 1px solid var(--hairline); }
.delivery-remark-empty { margin: auto; color: var(--muted); font-size: 12px; }
.delivery-remark-empty.is-error { color: var(--danger); }
.creator-remark-filter { margin-left: auto; }
@media (max-width: 760px) { .asset-smart-filters, .batch-image-editor { grid-template-columns: 1fr; } .batch-image-ref-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .select-shell { width: 100%; } }
/* 远端登录先进入外壳，重集合未到达前显示真实同步状态，避免 0 条/空列表闪现。 */
.remote-hydration-gate{min-height:calc(100vh - 132px);display:grid;place-items:center;text-align:center;padding:48px 24px;color:var(--ink)}
.remote-hydration-gate>div:last-child{max-width:520px;display:grid;justify-items:center;gap:10px}
.remote-hydration-gate span{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.remote-hydration-gate h2{margin:0;font-size:25px;letter-spacing:-.02em}
.remote-hydration-gate p{margin:0 0 6px;max-width:480px;color:var(--muted);line-height:1.7}
.remote-hydration-gate em{font-style:normal;font-size:12px;color:var(--muted)}
.remote-hydration-orbit{position:relative;width:54px;height:54px;margin-bottom:8px;border:1px solid color-mix(in srgb,var(--ink) 12%,transparent);border-radius:50%}
.remote-hydration-orbit:before{content:"";position:absolute;inset:8px;border:1px solid color-mix(in srgb,var(--ink) 8%,transparent);border-radius:50%}
.remote-hydration-orbit i{position:absolute;left:50%;top:50%;width:5px;height:5px;margin:-2.5px;border-radius:50%;background:currentColor;animation:remote-hydration-orbit 1.55s cubic-bezier(.4,0,.2,1) infinite}
.remote-hydration-orbit i:nth-child(2){animation-delay:-.5s;opacity:.62}.remote-hydration-orbit i:nth-child(3){animation-delay:-1s;opacity:.32}
@keyframes remote-hydration-orbit{from{transform:rotate(0) translateX(20px) rotate(0)}to{transform:rotate(360deg) translateX(20px) rotate(-360deg)}}
@media(prefers-reduced-motion:reduce){.remote-hydration-orbit i{animation:none}.remote-hydration-orbit i:nth-child(1){transform:translateX(20px)}.remote-hydration-orbit i:nth-child(2){transform:translate(-17px,10px)}.remote-hydration-orbit i:nth-child(3){transform:translate(-17px,-10px)}}
/* 商业化首页：官方事件与 Skill 社区占位。数据看板保留在 overview 路由。 */
.product-home {
  min-height: 100%;
  padding: clamp(34px, 5vw, 76px) clamp(28px, 5vw, 84px) 80px;
  color: #16191f;
  background:
    radial-gradient(circle at 82% 2%, rgba(202, 218, 255, .32), transparent 28%),
    #fff;
}
.product-home-hero {
  max-width: 1440px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(430px, .95fr);
  gap: clamp(48px, 8vw, 120px);
  align-items: end;
  min-height: 340px;
  padding: 36px 0 58px;
}
.product-home-kicker,
.home-section-heading span {
  display: block;
  margin-bottom: 14px;
  color: #8a909b;
  font-size: 11px;
  letter-spacing: .15em;
}
.product-home-hero h1 {
  margin: 0;
  max-width: 720px;
  font-size: clamp(48px, 6vw, 86px);
  font-weight: 540;
  letter-spacing: -.065em;
  line-height: .98;
}
.product-home-hero > div > p {
  margin: 28px 0 0;
  max-width: 620px;
  color: #6f7580;
  font-size: 17px;
  font-weight: 380;
  line-height: 1.75;
}
.product-home-quick {
  display: grid;
  gap: 6px;
  padding-bottom: 6px;
}
.product-home-quick button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 20px 4px;
  border: 0;
  border-bottom: 1px solid #eceef2;
  background: transparent;
  color: #1d2026;
  text-align: left;
  cursor: pointer;
  transition: padding .22s ease, color .22s ease;
}
.product-home-quick button::after { content: "↗"; color: #9aa0aa; font-size: 18px; }
.product-home-quick button:hover { padding-left: 12px; color: #355eea; }
.product-home-quick b { font-size: 17px; font-weight: 520; }
.product-home-quick em { margin-left: auto; margin-right: 20px; color: #999fa9; font-size: 13px; font-style: normal; font-weight: 380; }
.home-events,
.home-skills {
  max-width: 1440px;
  margin: 0 auto;
  padding-top: 62px;
}
.home-section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 28px;
  margin-bottom: 26px;
}
.home-section-heading h2 { margin: 0; font-size: 28px; font-weight: 520; letter-spacing: -.025em; }
.home-section-heading p { margin: 0; color: #9298a2; font-size: 13px; }
.home-event-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid #e9ebef;
  border-bottom: 1px solid #e9ebef;
}
.home-event-strip article { min-height: 150px; padding: 28px 32px 30px 0; }
.home-event-strip article + article { padding-left: 32px; border-left: 1px solid #e9ebef; }
.home-event-strip span { display: block; margin-bottom: 22px; color: #6680d9; font-size: 11px; }
.home-event-strip b { display: block; margin-bottom: 10px; font-size: 17px; font-weight: 520; }
.home-event-strip p { margin: 0; color: #8a909a; font-size: 13px; line-height: 1.65; }
.home-skill-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}
.home-skill-card {
  overflow: hidden;
  border: 1px solid #eceef1;
  border-radius: 26px;
  background: #fbfbfc;
  transition: transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s ease;
}
.home-skill-card:hover { transform: translateY(-5px); box-shadow: 0 22px 56px rgba(20, 25, 38, .09); }
.home-skill-media { position: relative; overflow: hidden; aspect-ratio: 16 / 8.8; background: #111; }
.home-skill-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, transparent 36%, rgba(126, 146, 255, .18));
  pointer-events: none;
}
.home-skill-media video { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.12); transform: scale(1.02); transition: transform .7s ease, filter .5s ease; }
.home-skill-card:hover video { transform: scale(1.075); filter: grayscale(.1) contrast(1.05); }
.home-skill-play {
  position: absolute;
  z-index: 2;
  left: 24px;
  bottom: 22px;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: rgba(255,255,255,.92);
  color: #111;
  font-size: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,.16);
}
.home-skill-lock { position: absolute; z-index: 2; right: 22px; top: 20px; padding: 7px 11px; border-radius: 99px; background: rgba(16,18,22,.72); color: #fff; font-size: 11px; backdrop-filter: blur(12px); }
.home-skill-copy { padding: 25px 26px 27px; }
.home-skill-copy > span { color: #898f99; font-size: 11px; }
.home-skill-copy h3 { margin: 9px 0 9px; font-size: 22px; font-weight: 520; letter-spacing: -.02em; }
.home-skill-copy p { min-height: 44px; margin: 0; color: #858b95; font-size: 13px; line-height: 1.65; }
.home-skill-actions { display: flex; gap: 8px; margin-top: 21px; }
.home-skill-actions button { padding: 10px 16px; border: 1px solid #dfe2e7; border-radius: 99px; background: #fff; color: #343942; cursor: pointer; }
.home-skill-actions button:first-child { border-color: #171a20; background: #171a20; color: #fff; }
.home-skill-actions button.is-saved { border-color: #cfd8ff; background: #f0f4ff; color: #315cdf; }

/* v125 首页：Lovart 式单入口 + 紧凑灵感瀑布流。 */
.product-home-lovart {
  min-height: 100%;
  padding: 0 0 90px;
  background:
    radial-gradient(circle at 50% 4%, rgba(119, 183, 255, .13), transparent 30%),
    linear-gradient(#fff, #fbfcff 58%, #fff);
}
.home-topline {
  position: sticky;
  z-index: 30;
  top: 0;
  min-height: 76px;
  padding: 14px clamp(24px, 4vw, 64px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: rgba(255,255,255,.86);
  border-bottom: 1px solid rgba(225,229,237,.72);
  backdrop-filter: blur(20px);
}
.home-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #15171c;
  text-decoration: none;
}
.home-brand img { width: 34px; height: 34px; object-fit: contain; }
.home-brand span { font-size: 16px; font-weight: 620; letter-spacing: -.02em; }
.home-account-tools { display: flex; align-items: center; gap: 11px; }
.home-team-join-button {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  gap: 7px;
  padding: 0 14px;
  border: 1px solid rgba(88, 139, 218, .22);
  border-radius: 14px;
  background: rgba(255,255,255,.88);
  color: #316ba9;
  box-shadow: 0 8px 24px rgba(45, 104, 177, .06);
  cursor: pointer;
}
.home-team-join-button:hover,
.home-team-join-button:focus-visible { border-color: rgba(51, 121, 211, .48); transform: translateY(-1px); }
.home-points-wrap,
.home-profile-wrap { position: relative; }
.home-points-button {
  min-height: 42px;
  padding: 0 15px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  border: 1px solid #e0e3e8;
  border-radius: 14px;
  background: rgba(255,255,255,.94);
  color: #262a31;
  box-shadow: 0 6px 20px rgba(31,42,62,.04);
  cursor: pointer;
}
.home-points-button i { width: 1px; height: 20px; background: #e0e3e8; }
.home-points-button span { font-size: 13px; }
.home-points-popover,
.home-profile-menu {
  position: absolute;
  z-index: 50;
  right: 0;
  top: calc(100% + 10px);
  width: 280px;
  padding: 14px;
  border: 1px solid #e7e9ed;
  border-radius: 18px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 22px 60px rgba(23,31,47,.14);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px) scale(.98);
  transition: opacity .18s ease, transform .18s ease, visibility .18s;
}
.home-points-wrap:hover .home-points-popover,
.home-points-wrap:focus-within .home-points-popover,
.home-profile-wrap.is-open .home-profile-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}
.home-points-popover header,
.home-profile-menu header { display: flex; align-items: center; gap: 10px; padding: 3px 3px 14px; border-bottom: 1px solid #eceef2; }
.home-points-popover header b { font-size: 17px; }
.home-points-popover header button { margin-left: auto; padding: 8px 14px; border: 0; border-radius: 10px; background: #202228; color: #fff; }
.home-points-popover p { margin: 16px 2px 0; display: flex; align-items: center; justify-content: space-between; }
.home-points-popover p span { display: inline-flex; align-items: center; gap: 8px; }
.home-points-popover small { display: block; margin: 9px 2px 2px 24px; color: #9a9fa9; }
.home-profile-button {
  width: 44px;
  height: 44px;
  padding: 0;
  overflow: hidden;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: #278cf2;
  color: #fff;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(31,125,227,.2);
}
.home-profile-button img,
.home-profile-menu header > img { width: 100%; height: 100%; object-fit: cover; }
.home-profile-menu header > img,
.home-profile-menu header > span:first-child { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: #278cf2; color: #fff; }
.home-profile-menu header > span:last-child { display: grid; gap: 3px; }
.home-profile-menu header em { color: #999ea7; font-size: 12px; font-style: normal; }
.home-profile-menu > button { width: 100%; min-height: 42px; padding: 0 10px; display: flex; align-items: center; gap: 11px; border: 0; border-radius: 10px; background: transparent; color: #30343a; text-align: left; cursor: pointer; }
.home-profile-menu > button:hover { background: #f1f2f4; }
.home-profile-menu > i { display: block; height: 1px; margin: 6px 0; background: #e9ebef; }
.home-profile-menu > button.is-danger { color: #d2343d; }
.home-main { width: min(1320px, calc(100% - 48px)); margin: 0 auto; }
.home-hero-composer { min-height: 540px; padding: 90px 0 66px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.home-mascot-hero { margin-bottom: 22px; }
.home-hero-composer h1 { margin: 0; font-size: clamp(38px, 4.5vw, 62px); font-weight: 560; letter-spacing: -.055em; line-height: 1.05; }
.home-hero-composer > p { margin: 15px 0 30px; color: #969ba4; font-size: 16px; }
.home-composer {
  width: min(860px, 100%);
  padding: 14px 16px 13px;
  border: 1px solid #e1e4e9;
  border-radius: 25px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 18px 54px rgba(31,44,67,.1), 0 2px 5px rgba(31,44,67,.04);
  text-align: left;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.home-composer:focus-within,
.home-composer.is-dragging { border-color: #84bfff; box-shadow: 0 22px 60px rgba(45,132,229,.15), 0 0 0 4px rgba(59,148,244,.08); }
.home-mode-switch { display: inline-flex; padding: 3px; border: 1px solid #e5e7eb; border-radius: 99px; background: #f7f8fa; }
.home-mode-switch button { min-height: 30px; padding: 0 13px; border: 0; border-radius: 99px; background: transparent; color: #7d828b; font-size: 12px; cursor: pointer; }
.home-mode-switch button.is-active { background: #22252b; color: #fff; box-shadow: 0 4px 12px rgba(20,25,34,.14); }
.home-composer textarea { width: 100%; min-height: 98px; padding: 19px 6px 10px; border: 0; outline: 0; resize: none; background: transparent; color: #25282e; font: inherit; font-size: 16px; line-height: 1.65; }
.home-composer footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.home-composer footer > div { display: flex; align-items: center; gap: 10px; color: #a0a5ad; font-size: 12px; }
.home-add-file { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; color: #383c43; cursor: pointer; }
.home-add-file:hover { background: #f0f2f5; }
.home-submit { width: 44px; height: 44px; display: grid; place-items: center; border: 0; border-radius: 50%; background: #22252b; color: #fff; cursor: pointer; transition: transform .18s ease, background .18s ease; }
.home-submit:hover { transform: translateY(-2px); background: #1177df; }
.home-attachment-strip { display: flex; gap: 8px; padding-top: 13px; overflow-x: auto; }
.home-attachment-chip { flex: 0 0 auto; max-width: 190px; height: 46px; padding: 4px 8px 4px 4px; display: flex; align-items: center; gap: 7px; border: 1px solid #e3e6eb; border-radius: 12px; background: #fafbfc; }
.home-attachment-chip img { width: 38px; height: 38px; border-radius: 9px; object-fit: cover; }
.home-attachment-chip b { overflow: hidden; color: #61666f; font-size: 11px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.home-attachment-chip button { margin-left: auto; border: 0; background: transparent; color: #9ba0a8; cursor: pointer; }
.home-discovery { padding-top: 28px; }
.home-discovery > header { display: flex; align-items: end; justify-content: space-between; gap: 20px; }
.home-discovery > header span { color: #9ca1aa; font-size: 10px; letter-spacing: .16em; }
.home-discovery > header h2 { margin: 8px 0 0; font-size: 30px; font-weight: 560; letter-spacing: -.035em; }
.home-discovery > header p { margin: 0 0 4px; color: #a0a5ae; font-size: 12px; }
.home-category-tabs { margin: 24px 0 20px; display: flex; gap: 8px; overflow-x: auto; }
.home-category-tabs button { flex: 0 0 auto; min-height: 36px; padding: 0 16px; border: 1px solid #e3e6eb; border-radius: 99px; background: #fff; color: #737983; cursor: pointer; }
.home-category-tabs button.is-active { border-color: #25282e; background: #25282e; color: #fff; }
.home-inspiration-grid { columns: 3; column-gap: 16px; }
.home-inspiration-card { width: 100%; margin: 0 0 16px; padding: 0; overflow: hidden; display: inline-block; break-inside: avoid; border: 1px solid #eaecf0; border-radius: 20px; background: #fff; color: #22252b; text-align: left; cursor: pointer; box-shadow: 0 5px 22px rgba(32,43,61,.035); transition: transform .24s ease, box-shadow .24s ease; }
.home-inspiration-card:hover { transform: translateY(-4px); box-shadow: 0 18px 44px rgba(32,43,61,.1); }
.home-inspiration-media { display: grid; place-items: center; min-height: 230px; padding: 22px; background: linear-gradient(145deg,#f3f8ff,#e8f3ff); }
.home-inspiration-card:nth-child(3n+2) .home-inspiration-media { min-height: 310px; }
.home-inspiration-card.tone-night .home-inspiration-media { background: radial-gradient(circle at 50% 42%, #163961, #17191d 72%); }
.home-inspiration-card.tone-ice .home-inspiration-media { background: linear-gradient(145deg,#fff,#edf7ff); }
.home-inspiration-media img { width: 100%; max-height: 300px; object-fit: contain; transition: transform .4s cubic-bezier(.2,.8,.2,1); }
.home-inspiration-card:hover img { transform: scale(1.035); }
.home-inspiration-copy { padding: 17px 18px 19px; display: grid; gap: 7px; }
.home-inspiration-copy em { color: #9ca1aa; font-size: 10px; font-style: normal; }
.home-inspiration-copy b { font-size: 16px; }
.home-inspiration-copy small { color: #858b95; line-height: 1.55; }
.home-inspiration-panel { width: min(920px, calc(100vw - 36px)); padding: 0 !important; overflow: hidden; border-radius: 24px !important; }
.home-inspiration-detail { display: grid; grid-template-columns: minmax(300px, .9fr) minmax(0, 1.1fr); min-height: 520px; }
.home-inspiration-detail-media { display: grid; place-items: center; padding: 34px; background: radial-gradient(circle at 50% 45%, #eaf5ff, #f7f9fc 72%); }
.home-inspiration-detail-media img { width: 100%; max-height: 430px; object-fit: contain; }
.home-inspiration-detail-copy { padding: 48px 42px; display: flex; flex-direction: column; }
.home-inspiration-detail-copy > span { color: #858b95; font-size: 11px; }
.home-inspiration-detail-copy h2 { margin: 11px 0 12px; font-size: 30px; }
.home-inspiration-detail-copy p { margin: 0 0 28px; color: #777d87; line-height: 1.7; }
.home-inspiration-detail-copy label { margin-bottom: 8px; color: #60656e; font-size: 12px; }
.home-prompt-preview { padding: 16px; border: 1px solid #e5e7eb; border-radius: 14px; background: #f8f9fb; color: #454a52; font-size: 13px; line-height: 1.75; }
.home-inspiration-detail-copy .btn { align-self: flex-start; margin-top: auto; }
@media (max-width: 900px) {
  .home-inspiration-grid { columns: 2; }
  .home-main { width: min(100% - 30px, 760px); }
  .home-hero-composer { min-height: 480px; padding-top: 66px; }
}
@media (max-width: 620px) {
  .home-brand span,
  .home-points-button span,
  .home-points-button i,
  .home-discovery > header p { display: none; }
  .home-topline { padding-inline: 16px; }
  .home-inspiration-grid { columns: 1; }
  .home-inspiration-detail { grid-template-columns: 1fr; }
  .home-inspiration-detail-media { min-height: 260px; }
}

/* v126 home refinement: floating chrome, pet states, fixed-height composer and image-only masonry. */
.product-home-lovart {
  position: relative;
  background:
    radial-gradient(circle at 50% 1%, rgba(119, 183, 255, .105), transparent 27%),
    linear-gradient(#fff, #fbfcff 56%, #fff);
}
.home-topline {
  position: absolute;
  z-index: 40;
  top: 20px;
  left: clamp(20px, 3vw, 50px);
  right: clamp(20px, 3vw, 50px);
  min-height: 0;
  padding: 0;
  background: transparent;
  border: 0;
  backdrop-filter: none;
  pointer-events: none;
}
.home-brand-wrap,
.home-account-tools { pointer-events: auto; }
.home-brand-wrap { position: relative; }
.home-brand {
  min-height: 46px;
  padding: 4px 8px 4px 4px;
  gap: 8px;
  border: 0;
  border-radius: 14px;
  background: rgba(255,255,255,.42);
  cursor: pointer;
  backdrop-filter: blur(12px);
  transition: background .18s ease, transform .18s ease;
}
.home-brand:hover { background: rgba(255,255,255,.9); transform: translateY(-1px); }
.home-brand img { width: 38px; height: 38px; }
.home-brand span { font-family: "I.PenCrane-B", "Avenir Next", sans-serif; font-size: 15px; font-weight: 400; }
.home-brand > svg { color: #7b818a; transition: transform .18s ease; }
.home-brand-wrap.is-open .home-brand > svg { transform: rotate(180deg); }
.home-workspace-menu {
  position: absolute;
  z-index: 80;
  width: 322px;
  padding: 8px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
  border: 1px solid #e5e8ed;
  border-radius: 18px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 22px 64px rgba(28,38,55,.16);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px) scale(.98);
  transition: opacity .18s ease, visibility .18s ease, transform .18s ease;
}
.home-workspace-menu-brand { top: calc(100% + 9px); left: 0; transform-origin: top left; }
.home-workspace-menu-composer { right: 0; bottom: calc(100% + 10px); transform-origin: bottom right; }
.home-brand-wrap.is-open .home-workspace-menu-brand,
.home-workspace-quick:hover .home-workspace-menu-composer,
.home-workspace-quick:focus-within .home-workspace-menu-composer {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}
.home-workspace-menu button {
  position: relative;
  min-width: 0;
  min-height: 62px;
  padding: 8px 9px 8px 40px;
  display: grid;
  align-content: center;
  gap: 2px;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: #282d34;
  text-align: left;
  cursor: pointer;
}
.home-workspace-menu button:hover,
.home-workspace-menu button:focus-visible { background: #f1f5fb; outline: 0; }
.home-workspace-menu button > span {
  position: absolute;
  left: 10px;
  top: 10px;
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: #eef4fd;
  color: #316db9;
}
.home-workspace-menu button > b { overflow: hidden; font-size: 11.5px; text-overflow: ellipsis; white-space: nowrap; }
.home-workspace-menu button > em { overflow: hidden; color: #949aa4; font-size: 9px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.home-workspace-menu button > svg { position: absolute; top: 10px; right: 8px; color: #a2a7af; }
.home-workspace-menu button.is-locked { opacity: .58; }
.home-main { width: min(1180px, calc(100% - 48px)); }
.home-hero-composer { min-height: 500px; padding: 108px 0 58px; }
.home-mascot-hero { width: 108px; height: 108px; margin-bottom: 13px; }
.home-pet {
  position: relative;
  width: 100%;
  height: 100%;
  display: block;
  filter: drop-shadow(0 16px 22px rgba(46,129,237,.16));
}
.home-pet img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
  transform-origin: 50% 65%;
  transition: opacity .22s ease, transform .28s cubic-bezier(.2,.8,.2,1);
}
.home-pet-normal { opacity: 1; animation: homePetFloat 3.8s ease-in-out infinite; }
.home-pet-idle { opacity: 0; animation: homePetIdle 12s ease-in-out infinite; }
.home-pet-hover,
.home-pet-working { opacity: 0; }
.home-mascot-hero:hover .home-pet-normal,
.home-mascot-hero:hover .home-pet-idle { opacity: 0; animation: none; }
.home-mascot-hero:hover .home-pet-hover { opacity: 1; transform: translateY(-3px) rotate(-2deg) scale(1.035); }
.home-pet.is-working .home-pet-normal,
.home-pet.is-working .home-pet-idle,
.home-pet.is-working .home-pet-hover { opacity: 0; }
.home-pet.is-working .home-pet-working { opacity: 1; animation: homePetWorking .8s ease-in-out infinite; }
@keyframes homePetFloat { 50% { transform: translateY(-5px) rotate(1.4deg); } }
@keyframes homePetIdle { 0%,68%,100% { opacity: 0; } 74%,91% { opacity: 1; } }
@keyframes homePetWorking { 50% { transform: translateY(-4px) rotate(1.8deg) scale(1.025); } }
.home-hero-composer h1 {
  display: flex;
  align-items: baseline;
  justify-content: center;
  flex-wrap: wrap;
  gap: .05em;
  color: #171b22;
  font-size: clamp(32px, 3.7vw, 47px);
  font-weight: 400;
  letter-spacing: -.045em;
}
.home-hero-composer h1 > span:first-child { font-family: "I.PenCrane-B", "Avenir Next", sans-serif; font-weight: 400; letter-spacing: -.025em; }
.home-hero-composer h1 > span:last-child { font-family: "DFPHeiW3-GB", "华康黑体W3(P)", "PingFang SC", sans-serif; font-weight: 400; }
.home-hero-composer > p { margin: 10px 0 24px; font-family: "DFPHeiW3-GB", "华康黑体W3(P)", "PingFang SC", sans-serif; font-size: 14px; }
.home-composer {
  position: relative;
  width: min(760px, 100%);
  height: 190px;
  padding: 15px 16px 12px;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  border-radius: 22px;
  box-shadow: 0 16px 45px rgba(31,44,67,.085), 0 2px 5px rgba(31,44,67,.04);
}
.home-composer textarea { min-height: 0; padding: 9px 7px 8px; font-size: 15px; }
.home-composer:has(.home-attachment-strip:not([hidden])) textarea { padding-top: 58px; }
.home-composer footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto minmax(0, 1fr);
  align-items: center;
  gap: 10px;
}
.home-composer-left,
.home-composer-right { display: flex; align-items: center; gap: 8px; color: #a0a5ad; font-size: 11px; }
.home-composer-right { justify-content: flex-end; }
.home-add-file,
.home-workspace-trigger {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #42474e;
  cursor: pointer;
  transition: background .16s ease, color .16s ease, transform .16s ease;
}
.home-add-file:hover { background: #f0f2f5; color: #276dbb; transform: translateY(-1px); }
.home-workspace-trigger:hover { background: #eef4fb; color: #276dbb; transform: translateY(-1px); }
.home-workspace-quick { position: relative; }
.home-submit { width: 42px; height: 42px; }
.home-mode-switch {
  position: relative;
  isolation: isolate;
  height: 36px;
  padding: 3px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border: 1px solid #e5e8ed;
  border-radius: 12px;
  background: #f6f7f9;
}
.home-mode-switch > i {
  position: absolute;
  z-index: -1;
  left: 3px;
  top: 3px;
  width: calc(50% - 3px);
  height: 28px;
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 3px 10px rgba(28,37,52,.09);
  transition: transform .25s cubic-bezier(.2,.8,.2,1);
}
.home-composer[data-mode="canvas"] .home-mode-switch > i { transform: translateX(100%); }
.home-mode-switch button {
  position: relative;
  min-width: 108px;
  min-height: 28px;
  padding: 0 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: #858b94;
  font-size: 11px;
  cursor: pointer;
  transition: color .18s ease, transform .18s ease;
}
.home-mode-switch button:hover { color: #2f5d98; transform: translateY(-1px); }
.home-mode-switch button.is-active { background: transparent; color: #22272e; box-shadow: none; }
.home-mode-switch button > em {
  position: absolute;
  z-index: 90;
  left: 50%;
  bottom: calc(100% + 11px);
  width: 220px;
  padding: 9px 11px;
  border: 1px solid #e3e7ed;
  border-radius: 11px;
  background: rgba(255,255,255,.98);
  color: #747b85;
  box-shadow: 0 14px 36px rgba(27,37,54,.13);
  font-size: 10px;
  font-style: normal;
  line-height: 1.5;
  text-align: left;
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, 5px);
  transition: opacity .16s ease, visibility .16s ease, transform .16s ease;
  pointer-events: none;
}
.home-mode-switch button:hover > em,
.home-mode-switch button:focus-visible > em { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.home-video-mode {
  position: relative;
  height: 36px;
  min-width: 96px;
  display: flex;
  align-items: center;
  border: 1px solid #e5e8ed;
  border-radius: 11px;
  background: #fff;
  color: #40454d;
  transition: border-color .16s ease, box-shadow .16s ease;
}
.home-video-mode:hover,
.home-video-mode:focus-within { border-color: #b9cae2; box-shadow: 0 5px 14px rgba(46,77,122,.08); }
.home-video-mode[hidden] { display: none; }
.home-video-mode select {
  width: 100%;
  height: 100%;
  padding: 0 29px 0 10px;
  appearance: none;
  border: 0;
  outline: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 11px;
  cursor: pointer;
}
.home-video-mode > svg { position: absolute; right: 9px; pointer-events: none; }
.home-attachment-strip {
  position: absolute;
  z-index: 2;
  top: 13px;
  left: 19px;
  right: 19px;
  height: 48px;
  padding: 0;
}
.home-attachment-strip[hidden] { display: none; }
.home-discovery { padding-top: 20px; }
.home-discovery > header h2 { font-family: "DFPHeiW3-GB", "华康黑体W3(P)", "PingFang SC", sans-serif; font-size: 27px; font-weight: 400; }
.home-category-tabs { margin: 20px 0 17px; gap: 22px; }
.home-category-tabs button {
  position: relative;
  min-height: 30px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #8b919a;
  font-size: 12px;
}
.home-category-tabs button::after { content: ""; position: absolute; left: 50%; right: 50%; bottom: 0; height: 1.5px; border-radius: 99px; background: #22262c; transition: left .18s ease, right .18s ease; }
.home-category-tabs button:hover,
.home-category-tabs button.is-active { border-color: transparent; background: transparent; color: #22262c; }
.home-category-tabs button:hover::after,
.home-category-tabs button.is-active::after { left: 0; right: 0; }
.home-inspiration-grid { columns: 4; column-gap: 12px; }
.home-inspiration-card {
  margin-bottom: 12px;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.home-inspiration-card:hover { transform: translateY(-3px); box-shadow: none; }
.home-inspiration-media { min-height: 0; aspect-ratio: 4 / 5; overflow: hidden; padding: 12%; border-radius: 15px; }
.home-inspiration-card:nth-child(4n+2) .home-inspiration-media { min-height: 0; aspect-ratio: 1 / 1.14; }
.home-inspiration-card:nth-child(4n+3) .home-inspiration-media { aspect-ratio: 1 / 1.34; }
.home-inspiration-card:nth-child(4n) .home-inspiration-media { aspect-ratio: 1 / .94; }
.home-inspiration-media img { width: 100%; height: 100%; max-height: none; object-fit: contain; }
@media (max-width: 900px) {
  .home-inspiration-grid { columns: 3; }
  .home-hero-composer { padding-top: 98px; }
  .home-workspace-menu-composer { right: -52px; }
}
@media (max-width: 620px) {
  .home-topline { left: 12px; right: 12px; top: 12px; padding: 0; }
  .home-main { width: calc(100% - 24px); }
  .home-inspiration-grid { columns: 2; }
  .home-hero-composer { padding-top: 90px; }
  .home-mascot-hero { width: 88px; height: 88px; }
  .home-hero-composer h1 { font-size: 30px; }
  .home-composer { height: 212px; }
  .home-composer footer { grid-template-columns: minmax(0, 1fr) auto auto; }
  .home-composer-left > span { display: none; }
  .home-mode-switch { grid-row: 2; grid-column: 1 / -1; }
  .home-composer-right { grid-column: 3; grid-row: 1; }
  .home-video-mode { grid-column: 2; grid-row: 1; }
  .home-workspace-menu { width: min(322px, calc(100vw - 24px)); }
  .home-workspace-menu-composer { right: -52px; }
}

.team-join-page {
  min-height: calc(100vh - 92px);
  display: grid;
  place-items: center;
  padding: 48px;
}
.team-join-card {
  width: min(680px, 100%);
  padding: 42px;
  border-color: #e4e6ea;
  box-shadow: 0 24px 72px rgba(24, 30, 42, .07);
}
.team-join-icon {
  display: grid;
  width: 50px;
  height: 50px;
  place-items: center;
  margin-bottom: 28px;
  border-radius: 16px;
  background: #11151b;
  color: #fff;
}
.team-join-heading b {
  display: block;
  font-size: 28px;
  font-weight: 560;
  letter-spacing: -.025em;
}
.team-join-heading em {
  display: block;
  margin-top: 10px;
  color: #858c97;
  font-size: 14px;
  font-style: normal;
  line-height: 1.7;
}
.team-join-form {
  display: grid;
  gap: 20px;
  margin-top: 34px;
}
.team-join-form .field { gap: 9px; color: #3b4049; font-weight: 500; }
.team-join-form .input { min-height: 50px; border-radius: 15px; background: #fbfbfc; }
.team-join-form textarea.input { padding-top: 14px; resize: vertical; }
.team-join-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: 4px;
}
.team-join-actions > span { max-width: 360px; color: #9399a2; font-size: 12px; line-height: 1.6; }
.team-join-status {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 32px 0 24px;
}
.team-join-status span {
  display: flex;
  min-height: 92px;
  flex-direction: column;
  justify-content: center;
  padding: 18px 20px;
  border-radius: 16px;
  background: #f6f7f8;
}
.team-join-status b { font-size: 14px; font-weight: 540; }
.team-join-status em { margin-top: 7px; color: #8e949d; font-size: 12px; font-style: normal; }
.team-rename-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 12px; margin: 0 0 18px; }
.team-rename-form .field { display: grid; gap: 8px; color: #555c67; font-size: 13px; }
.team-rename-form .input { min-height: 46px; border-radius: 14px; }
.team-rename-form .btn { min-height: 46px; }
.team-name-managed { margin: 0 0 18px; color: #9399a2; font-size: 12px; }
.home-team-join-dialog {
  width: min(620px, calc(100vw - 40px));
  max-width: 100%;
  min-width: 0;
  overflow-x: hidden;
  padding: 34px;
}
.home-team-join-dialog > *,
.home-team-join-dialog .field,
.home-team-join-dialog .input,
.home-team-join-dialog .team-join-heading { min-width: 0; max-width: 100%; }
.home-team-join-dialog .team-join-heading em,
.home-team-join-dialog [data-home-team-status],
.home-team-results > span { overflow-wrap: anywhere; word-break: break-word; }
.home-team-join-dialog .field { display: grid; gap: 8px; margin-top: 20px; color: #555c67; font-size: 13px; }
.home-team-join-dialog textarea.input { min-height: 86px; padding-top: 13px; resize: vertical; }
.home-team-results { display: grid; max-height: 230px; gap: 8px; margin-top: 10px; overflow: auto; }
.home-team-results > span { padding: 24px; border-radius: 14px; background: #f7f8fa; color: #9298a2; text-align: center; }
.home-team-result {
  display: flex;
  min-height: 62px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 15px;
  border: 1px solid #e5e8ed;
  border-radius: 14px;
  background: #fff;
  color: #242a33;
  text-align: left;
  cursor: pointer;
}
.home-team-result span { display: grid; gap: 4px; }
.home-team-result b { font-size: 14px; font-weight: 580; }
.home-team-result em { color: #9198a3; font-size: 11px; font-style: normal; }
.home-team-result:hover { border-color: #b8cce7; background: #f8fbff; }
.home-team-result.is-selected { border-color: #6fa7eb; background: #eef6ff; color: #236fbd; }
.settings-request-section + .settings-request-section { margin-top: 26px; padding-top: 24px; border-top: 1px solid #eceef1; }
.settings-request-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 2px 0 12px;
  color: #7d838d;
}
.settings-request-title b { color: #343941; font-size: 13px; font-weight: 540; }
.settings-request-title span { font-size: 11px; }
@media (max-width: 980px) {
  .product-home-hero { grid-template-columns: 1fr; min-height: auto; }
  .home-event-strip { grid-template-columns: 1fr; }
  .home-event-strip article + article { padding-left: 0; border-left: 0; border-top: 1px solid #e9ebef; }
  .home-skill-grid { grid-template-columns: 1fr; }
  .team-join-page { padding: 24px; }
  .team-join-card { padding: 30px; }
  .team-join-actions { align-items: stretch; flex-direction: column; }
  .team-join-actions .btn { width: 100%; }
}
@media (max-width: 620px) {
  .team-rename-form { grid-template-columns: 1fr; }
}

/* v129 · 首页与订阅：四列灵感、克制动效与纯本地方案预览。 */
.product-home-miaoda .home-hero-wordmark::before,
.product-home-miaoda .home-hero-wordmark::after {
  content: none !important;
  display: none !important;
}
.product-home-miaoda .home-hero-wordmark {
  color: #91afe1;
  font-family: "I.PenCrane-B", "Avenir Next", sans-serif;
  opacity: .047;
  animation: homeWordmarkSoftDrift 16s ease-in-out infinite alternate;
}
.product-home-miaoda .home-pet {
  isolation: isolate;
  animation: homeMeteorDiveFrame 5.6s cubic-bezier(.45,.05,.24,1) infinite;
}
.product-home-miaoda .home-pet picture {
  position: relative;
  z-index: 2;
}
.product-home-miaoda .home-pet img {
  animation: homeMeteorBodyDive 5.6s cubic-bezier(.45,.05,.24,1) infinite;
}
.product-home-miaoda .home-pet-trail {
  position: absolute;
  z-index: 1;
  top: 16%;
  right: 3%;
  width: 72%;
  height: 22%;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(101, 184, 255, .10) 34%, rgba(36, 121, 244, .32));
  filter: blur(8px);
  opacity: .46;
  transform: translate3d(42%, -24%, 0) rotate(-32deg) scaleX(.75);
  transform-origin: right center;
  animation: homeMeteorTrailPulse 5.6s ease-in-out infinite;
}
.product-home-miaoda .home-pet::after {
  content: "";
  position: absolute;
  z-index: 0;
  top: 23%;
  right: 8%;
  width: 54%;
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(251, 204, 105, .18), rgba(91, 166, 255, .44));
  filter: blur(2px);
  opacity: .42;
  transform: translate3d(56%, -38%, 0) rotate(-32deg);
  animation: homeMeteorTrailPulse 5.6s .12s ease-in-out infinite;
}
.product-home-miaoda .home-hero-title-art img {
  animation: homeTitleSoftBreath 7.2s ease-in-out infinite;
}
.product-home-miaoda .home-hero-title-art::after {
  background: linear-gradient(104deg, transparent 28%, rgba(255,255,255,.72) 46%, rgba(164, 210, 255, .36) 52%, transparent 68%);
  background-size: 260% 100%;
  opacity: .58;
  animation: homeHeroSoftShimmer 8.6s ease-in-out infinite;
}
.product-home-miaoda .home-points-button {
  min-height: 38px;
  padding: 0 12px;
  gap: 7px;
  border-color: rgba(216, 221, 229, .9);
  border-radius: 12px;
  background: rgba(255,255,255,.86);
  box-shadow: 0 7px 22px rgba(33, 45, 65, .045);
  backdrop-filter: blur(14px);
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease, color 160ms ease;
}
.product-home-miaoda .home-points-button:hover,
.product-home-miaoda .home-points-button:focus-visible {
  color: #245faa;
  border-color: #becfe5;
  box-shadow: 0 10px 28px rgba(38, 77, 128, .08);
  outline: 0;
  transform: translateY(-1px);
}
.product-home-miaoda .home-points-button b { font-size: 12px; font-weight: 590; }
.product-home-miaoda .home-points-button span { font-size: 12px; font-weight: 520; }
.product-home-miaoda .home-points-button i { height: 16px; }
.product-home-miaoda .home-points-popover {
  width: 268px;
  border-radius: 16px;
  box-shadow: 0 22px 58px rgba(25, 35, 52, .12);
}
.product-home-miaoda .home-points-popover header button {
  padding: 7px 11px;
  border-radius: 9px;
  background: #262b32;
  cursor: pointer;
}
.product-home-miaoda .home-video-mode { overflow: visible; }
.home-video-mode-hint {
  position: absolute;
  z-index: 100;
  left: 50%;
  bottom: calc(100% + 10px);
  width: 240px;
  padding: 9px 11px;
  border-radius: 10px;
  background: rgba(24, 29, 38, .95);
  color: rgba(255,255,255,.82);
  box-shadow: 0 14px 36px rgba(25, 35, 53, .16);
  font-size: 10.5px;
  font-weight: 400;
  line-height: 1.55;
  text-align: left;
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, 5px);
  transition: opacity 150ms ease, visibility 150ms ease, transform 150ms ease;
  pointer-events: none;
}
.home-video-mode-hint b { color: #fff; font-size: inherit; font-weight: 620; }
.product-home-miaoda .home-video-mode:hover .home-video-mode-hint,
.product-home-miaoda .home-video-mode:focus-visible .home-video-mode-hint {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
}
.product-home-miaoda .home-inspiration-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: start;
  gap: 8px;
  columns: auto !important;
}
.product-home-miaoda .home-inspiration-card {
  width: 100%;
  margin: 0;
  display: block;
}
.product-home-miaoda .home-inspiration-card:nth-child(n) .home-inspiration-media {
  aspect-ratio: 4 / 5;
}

@keyframes homeWordmarkSoftDrift {
  from { transform: translate3d(-50.7%, 0, 0); opacity: .064; }
  to { transform: translate3d(-49.3%, 2px, 0); opacity: .082; }
}
@keyframes homeMeteorDiveFrame {
  0%, 100% { transform: translate3d(-1px, -2px, 0) rotate(-1.5deg); }
  38% { transform: translate3d(4px, -7px, 0) rotate(.9deg); }
  58% { transform: translate3d(1px, 3px, 0) rotate(2.1deg); }
  76% { transform: translate3d(-2px, 0, 0) rotate(-.4deg); }
}
@keyframes homeMeteorBodyDive {
  0%, 100% { transform: scale(.992); filter: saturate(1) brightness(1); }
  38% { transform: scale(1.016); filter: saturate(1.06) brightness(1.025); }
  58% { transform: scale(.985, 1.018); filter: saturate(1.1) brightness(1.04); }
  76% { transform: scale(1.004); filter: saturate(1.03) brightness(1.015); }
}
@keyframes homeMeteorTrailPulse {
  0%, 100% { opacity: .16; transform: translate3d(42%, -24%, 0) rotate(-32deg) scaleX(.68); }
  38% { opacity: .38; transform: translate3d(50%, -32%, 0) rotate(-32deg) scaleX(.92); }
  58% { opacity: .64; transform: translate3d(58%, -38%, 0) rotate(-32deg) scaleX(1.12); }
  76% { opacity: .28; transform: translate3d(47%, -29%, 0) rotate(-32deg) scaleX(.8); }
}
@keyframes homeTitleSoftBreath {
  0%, 100% { transform: translateY(-50%) scale(.996); filter: saturate(.98) brightness(1); }
  50% { transform: translateY(-50%) scale(1.004); filter: saturate(1.035) brightness(1.015); }
}
@keyframes homeHeroSoftShimmer {
  0%, 32% { background-position: 135% 0; opacity: 0; }
  47% { opacity: .46; }
  68%, 100% { background-position: -95% 0; opacity: 0; }
}

body.workspace-shell-v2[data-zone="subscription"] .view-root {
  padding: 0;
  overflow: hidden;
}
.subscription-page {
  height: 100%;
  min-height: 0;
  padding: clamp(18px, 2.8vh, 34px) clamp(20px, 3vw, 46px);
  display: block;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 0, rgba(103, 168, 255, .10), transparent 35%),
    #f8f9fb;
  color: #20252c;
}
.subscription-content {
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: clamp(10px, 1.5vh, 15px);
}
.subscription-hero {
  position: relative;
  width: 100%;
  max-width: 1220px;
  margin: 0 auto;
  display: block;
  text-align: center;
}
.subscription-hero > div { width: min(720px, 100%); margin: 0 auto; text-align: center; }
.subscription-hero > div > span { color: #8b94a2; font-size: 10px; letter-spacing: .18em; }
.subscription-hero h1 { margin: 6px 0 7px; font-size: clamp(26px, 2.8vw, 38px); font-weight: 590; letter-spacing: -.045em; }
.subscription-hero p { max-width: 680px; margin: 0; color: #7e8692; font-size: 13px; line-height: 1.65; }
.subscription-hero aside {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  min-width: 250px;
  padding: 13px 15px;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 2px 9px;
  border: 1px solid #d8e7fb;
  border-radius: 14px;
  background: #f2f7fe;
  color: #2c6bb7;
}
.subscription-hero aside.is-premium {
  overflow: hidden;
  border-color: rgba(211, 160, 54, .42);
  background: linear-gradient(135deg, rgba(255, 251, 234, .98), rgba(247, 233, 187, .82));
  color: #8a6112;
  box-shadow: 0 12px 34px rgba(159, 107, 18, .12), inset 0 1px 0 rgba(255,255,255,.92);
}
.subscription-hero aside.is-premium::after {
  content: "";
  position: absolute;
  inset: -60% -30%;
  background: linear-gradient(105deg, transparent 38%, rgba(255,255,255,.72) 49%, transparent 60%);
  animation: subscriptionGoldSheen 4.8s ease-in-out infinite;
  pointer-events: none;
}
.subscription-hero aside.is-premium span { color: #9a7a3b; }
.subscription-toolbar {
  position: relative;
  width: 100%;
  max-width: 1220px;
  min-height: 44px;
  margin: 0 auto;
  display: grid;
  place-items: center;
}
.subscription-period {
  position: relative;
  width: min(334px, 100%);
  padding: 4px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  border: 1px solid #e0e5ec;
  border-radius: 999px;
  background: rgba(242, 245, 249, .9);
  isolation: isolate;
}
.subscription-period > i {
  position: absolute;
  z-index: 0;
  top: 4px;
  bottom: 4px;
  left: 4px;
  width: calc((100% - 8px) / 3);
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 6px 18px rgba(31, 48, 72, .10);
  transform: translateX(calc(var(--subscription-cycle-index, 0) * 100%));
  transition: transform 300ms cubic-bezier(.22, .82, .24, 1);
}
.subscription-period button {
  position: relative;
  z-index: 1;
  min-height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  background: transparent;
  color: #77808c;
  font-size: 11px;
  transition: color 220ms ease;
}
.subscription-period button.is-active { color: #2c3745; }
.subscription-period button:disabled { opacity: .58; cursor: default; }
.subscription-period em { margin-left: 4px; color: #b47a22; font-size: 9px; font-style: normal; }
.subscription-hero aside svg { grid-row: 1 / 3; margin-top: 2px; }
.subscription-hero aside b { font-size: 12px; }
.subscription-hero aside span { color: #7190b7; font-size: 10.5px; }
.subscription-topup-trigger {
  position: absolute;
  top: 50%;
  right: 0;
  min-width: 96px;
  min-height: 36px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px solid #dfe6ef;
  border-radius: 12px;
  background: rgba(255,255,255,.86);
  color: #2d3640;
  box-shadow: 0 9px 25px rgba(34, 53, 78, .055);
  cursor: pointer;
  transform: translateY(-50%);
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, color 180ms ease;
}
.subscription-topup-trigger:hover,
.subscription-topup-trigger:focus-visible { transform: translateY(calc(-50% - 2px)); border-color: #b9d1ef; color: #2269ba; box-shadow: 0 14px 30px rgba(34, 76, 131, .10); }
.subscription-topup-trigger > svg:first-child { color: #3278ca; }
.subscription-topup-trigger b { font-size: 12px; }
.subscription-plans {
  width: 100%;
  min-height: 0;
  height: 100%;
  max-width: 1220px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.subscription-plans.is-cycle-updating { animation: subscriptionCycleRefresh 220ms ease-out both; }
.subscription-plan {
  position: relative;
  min-width: 0;
  min-height: 0;
  height: 100%;
  padding: clamp(14px, 1.35vw, 19px);
  display: flex;
  flex-direction: column;
  border: 1px solid #e2e6ec;
  border-radius: 20px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 10px 30px rgba(31, 43, 61, .045);
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}
.subscription-plan:hover { transform: translateY(-3px); border-color: #bfd2ed; box-shadow: 0 18px 42px rgba(35, 63, 102, .09); }
.subscription-plan.is-featured { border-color: #a9c9f4; box-shadow: 0 16px 42px rgba(52, 111, 191, .10); }
.subscription-plan.is-current { border-color: #2d7bd6; box-shadow: 0 0 0 3px rgba(45, 123, 214, .10), 0 18px 42px rgba(35, 63, 102, .10); }
.subscription-plan.is-selected { border-color: #2d7bd6; box-shadow: 0 0 0 3px rgba(45, 123, 214, .10), 0 18px 42px rgba(35, 63, 102, .10); }
.subscription-plan header { display: block; }
.subscription-plan header span { display: inline-flex; min-height: 23px; padding: 0 8px; align-items: center; border-radius: 999px; background: #f0f3f7; color: #7a828d; font-size: 9px; }
.subscription-plan.is-featured header span { background: #e9f2ff; color: #2d70bf; }
.subscription-plan.is-current header span { background: #e8f2ff; color: #2169bb; }
.subscription-plan h3 { margin: 10px 0 5px; font-size: 18px; font-weight: 590; }
.subscription-plan header p { min-height: 32px; margin: 0; color: #8a919b; font-size: 10.5px; line-height: 1.5; }
.subscription-price { margin-top: 12px; display: flex; align-items: baseline; gap: 5px; }
.subscription-price b { font-size: clamp(25px, 2vw, 30px); letter-spacing: -.04em; }
.subscription-price em { color: #969ca5; font-size: 10px; font-style: normal; }
.subscription-billing-note {
  min-height: 16px;
  margin-top: 3px;
  display: block;
  color: #9299a3;
  font-size: 9px;
  line-height: 1.45;
}
.subscription-capacity { margin: 12px 0; padding: 11px 12px; display: grid; gap: 4px; border-radius: 13px; background: #f5f7fa; }
.subscription-capacity strong { color: #2c65aa; font-size: 14px; }
.subscription-capacity span { color: #858c96; font-size: 10px; }
.subscription-seats { margin: 0 0 12px; display: grid; gap: 7px; }
.subscription-seats label,
.subscription-seats small { display: flex; align-items: center; justify-content: space-between; gap: 9px; }
.subscription-seats label { color: #515b67; font-size: 10.5px; font-weight: 650; }
.subscription-seats output { color: #246dc0; font-variant-numeric: tabular-nums; }
.subscription-seats input { width: 100%; height: 16px; margin: 0; accent-color: #2d78ce; cursor: pointer; }
.subscription-seats input:disabled { opacity: .32; cursor: default; }
.subscription-seats small { color: #9299a3; font-size: 8.5px; }
.subscription-plan ul { margin: 0 0 12px; padding: 0; display: grid; gap: 7px; list-style: none; }
.subscription-plan li { display: flex; align-items: center; gap: 7px; color: #5f6670; font-size: 10.5px; }
.subscription-plan li svg { color: #4180c8; }
.subscription-plan > button {
  min-height: 38px;
  margin-top: auto;
  padding: 0 13px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid #dfe4eb;
  border-radius: 12px;
  background: #fff;
  color: #30363e;
  font-weight: 560;
  cursor: pointer;
}
.subscription-plan.is-featured > button { border-color: #2a74cc; background: #2a74cc; color: #fff; }
.subscription-plan > button:disabled { border-color: #e5e9ef; background: #f4f6f8; color: #949ba5; cursor: default; opacity: 1; }
.subscription-plan.is-current > button:disabled { border-color: #b7d0ef; background: #eef5fe; color: #286cba; }
.subscription-plan.is-team { background: linear-gradient(180deg, #f8fbff, #fff 28%); }
.subscription-plan.is-team-pro { border-color: #d9c18b; background: linear-gradient(180deg, #fffaf0, #fff 30%); }
.subscription-plan.is-team-pro:not(.is-current) { box-shadow: 0 15px 38px rgba(132, 91, 21, .075); }
.subscription-plan.is-team-pro.is-internal-current {
  border-color: #c6922e;
  box-shadow: 0 0 0 3px rgba(205, 151, 47, .13), 0 20px 48px rgba(128, 84, 16, .15);
}
.subscription-plan.is-internal-current::before,
.subscription-plan.is-internal-current::after {
  content: "";
  position: absolute;
  z-index: 0;
  pointer-events: none;
  filter: blur(9px);
  opacity: .52;
  animation: subscriptionPrestigeGlow 3.8s ease-in-out infinite alternate;
}
.subscription-plan.is-internal-current::before { width: 64px; height: 88px; top: -22px; right: 12px; background: radial-gradient(ellipse at 50% 100%, rgba(255, 192, 58, .85), transparent 68%); }
.subscription-plan.is-internal-current::after { width: 44px; height: 66px; top: -13px; right: 42px; background: radial-gradient(ellipse at 50% 100%, rgba(255, 228, 139, .9), transparent 68%); animation-delay: -1.4s; }
.subscription-plan.is-internal-current > * { position: relative; z-index: 1; }
.subscription-plan.is-internal-current header span { background: #fff1c5; color: #875b0c; }
.subscription-plan.is-internal-current .subscription-capacity { background: #fff8e4; }
.subscription-plan.is-internal-current .subscription-capacity strong,
.subscription-plan.is-internal-current .subscription-seats output { color: #936513; }
@keyframes subscriptionGoldSheen { 0%, 55% { transform: translateX(-42%); opacity: 0; } 70% { opacity: .82; } 100% { transform: translateX(46%); opacity: 0; } }
@keyframes subscriptionPrestigeGlow { from { transform: translateY(5px) scale(.9); opacity: .34; } to { transform: translateY(-5px) scale(1.08); opacity: .68; } }
@keyframes subscriptionCycleRefresh { from { opacity: .72; transform: translateY(2px); } to { opacity: 1; transform: translateY(0); } }
.subscription-topup-panel { width: min(620px, calc(100vw - 40px)); padding: 20px; }
.subscription-topup-modal > .mp-head { align-items: flex-start; margin-bottom: 16px; }
.subscription-topup-modal > .mp-head > div { display: grid; gap: 4px; }
.subscription-topup-modal > .mp-head span { color: #8d96a2; font-size: 9px; letter-spacing: .15em; }
.subscription-topup-modal > .mp-head b { font-size: 19px; }
.subscription-topup-modal > .mp-head p { margin: 0; color: #7f8792; font-size: 11px; }
.subscription-topup-options { max-height: min(440px, 60vh); overflow-y: auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.subscription-topup-option {
  min-height: 68px;
  padding: 12px 14px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 11px;
  border: 1px solid #e1e6ed;
  border-radius: 14px;
  background: #fff;
  cursor: pointer;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}
.subscription-topup-option:hover { transform: translateY(-1px); border-color: #bdd2ed; }
.subscription-topup-option.is-selected { border-color: #5e98d9; background: #f5f9ff; box-shadow: 0 0 0 3px rgba(45, 123, 214, .08); }
.subscription-topup-option:has(input:disabled) { opacity: .62; cursor: default; }
.subscription-topup-option input { width: 17px; height: 17px; margin: 0; accent-color: #2d78ce; }
.subscription-topup-option > span { display: grid; gap: 4px; }
.subscription-topup-option b { font-size: 13px; }
.subscription-topup-option small { color: #858d98; font-size: 9.5px; line-height: 1.45; }
.subscription-topup-option > strong { color: #1f5fa8; font-size: 17px; }
.subscription-topup-modal > .mp-foot { margin-top: 15px; }

@media (max-width: 1080px) {
  .product-home-miaoda .home-inspiration-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .subscription-page { overflow: hidden; }
  .subscription-plans {
    grid-template-columns: repeat(4, minmax(260px, 1fr));
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x proximity;
    scrollbar-width: thin;
  }
  .subscription-plan {
    min-height: 0;
    height: 100%;
    overflow-y: auto;
    scroll-snap-align: start;
    scrollbar-width: thin;
  }
  .subscription-hero aside {
    position: static;
    width: min(300px, 100%);
    margin: 12px auto 0;
    transform: none;
    text-align: left;
  }
}
@media (max-width: 760px) {
  .product-home-miaoda .home-inspiration-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .subscription-page { padding: 14px; }
  .subscription-content { overflow: hidden; }
  .subscription-hero { padding: 0; }
  .subscription-hero > div { text-align: center; }
  .subscription-hero aside,
  .subscription-topup-trigger { min-width: 0; }
  .subscription-toolbar { display: flex; justify-content: center; gap: 8px; }
  .subscription-period { width: min(310px, calc(100% - 100px)); }
  .subscription-period button { padding-inline: 7px; font-size: 10px; }
  .subscription-topup-trigger { position: static; flex: none; transform: none; }
  .subscription-topup-trigger:hover,
  .subscription-topup-trigger:focus-visible { transform: translateY(-2px); }
  .subscription-plans { grid-template-columns: repeat(4, minmax(260px, 84vw)); }
  .subscription-plan { min-height: 0; }
  .subscription-topup-options { grid-template-columns: 1fr; }
  .home-video-mode-hint { left: auto; right: 0; transform: translate(0, 5px); }
  .product-home-miaoda .home-video-mode:hover .home-video-mode-hint,
  .product-home-miaoda .home-video-mode:focus-visible .home-video-mode-hint { transform: translate(0, 0); }
}
@media (max-width: 480px) {
  .product-home-miaoda .home-inspiration-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .product-home-miaoda .home-hero-wordmark,
  .product-home-miaoda .home-pet,
  .product-home-miaoda .home-pet img,
  .product-home-miaoda .home-pet-trail,
  .product-home-miaoda .home-pet::after,
  .product-home-miaoda .home-hero-title-art img,
  .product-home-miaoda .home-hero-title-art::after { animation: none !important; }
  .product-home-miaoda .home-pet-trail,
  .product-home-miaoda .home-pet::after { display: none; }
}

/* v130 · 个人首页入口：缩短模式控件，并增强英文背景的低对比呼吸感。 */
.product-home-miaoda .home-mode-switch {
  width: 154px;
  height: 36px;
  flex: 0 0 154px;
  border-radius: 12px;
}
.product-home-miaoda .home-mode-switch button {
  height: 30px;
  gap: 5px;
  padding-inline: 7px;
  font-size: 11.5px;
}
.product-home-miaoda .home-video-mode {
  width: 60px;
  min-width: 60px;
  max-width: 60px;
  height: 32px;
  flex: 0 0 60px;
  gap: 0;
  padding: 0 18px 0 5px;
}
.home-video-mode-wheel { width: 26px; }
.home-video-mode-wheel b { font-size: 11px; }
.product-home-miaoda .home-video-mode > svg { right: 7px; }
.product-home-miaoda .home-hero-wordmark {
  opacity: .07;
}
@media (max-width: 760px) {
  .product-home-miaoda .home-mode-switch { width: 154px; flex-basis: 154px; }
  .product-home-miaoda .home-video-mode {
    width: 60px;
    min-width: 60px;
    max-width: 60px;
    flex-basis: 60px;
  }
}

/* 最终层：社区按 DOM 顺序横向优先，并用细网格回填不同媒体比例留下的空隙。 */
.product-home-miaoda .home-inspiration-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  grid-auto-flow: row dense !important;
  grid-auto-rows: 4px !important;
  align-items: start !important;
  gap: 10px !important;
  columns: auto !important;
}
.product-home-miaoda .home-inspiration-card {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  align-self: start;
  border: 0 !important;
  border-radius: 14px !important;
  background: transparent !important;
  box-shadow: none !important;
}
.product-home-miaoda .home-inspiration-card-author {
  position: absolute;
  z-index: 2;
  left: 9px;
  right: 9px;
  bottom: 8px;
  padding: 5px 8px;
  overflow: hidden;
  border-radius: 999px;
  color: #fff;
  background: rgba(17, 25, 37, .56);
  box-shadow: 0 4px 14px rgba(14, 23, 36, .16);
  backdrop-filter: blur(8px);
  font-size: 10px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
  opacity: .9;
  transition: opacity 160ms ease, transform 160ms ease;
}
.product-home-miaoda .home-inspiration-card:hover .home-inspiration-card-author,
.product-home-miaoda .home-inspiration-card:focus-visible .home-inspiration-card-author {
  opacity: 1;
  transform: translateY(-1px);
}
.product-home-miaoda .home-inspiration-card:nth-child(n) .home-inspiration-media {
  min-height: 0 !important;
  padding: 0 !important;
  display: block !important;
  overflow: hidden;
  aspect-ratio: var(--community-ratio, auto) !important;
  border-radius: inherit;
}
.product-home-miaoda .home-inspiration-media img,
.product-home-miaoda .home-inspiration-media video {
  width: 100% !important;
  height: auto !important;
  min-height: 0;
  max-height: none !important;
  display: block;
  object-fit: cover !important;
}
@media (max-width: 1080px) {
  .product-home-miaoda .home-inspiration-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
@media (max-width: 760px) {
  .product-home-miaoda .home-inspiration-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 480px) {
  .product-home-miaoda .home-inspiration-grid { grid-template-columns: 1fr !important; }
}

/* 社区详情：桌面端锁定左侧媒体，长文案只在右栏滚动。 */
.home-inspiration-panel { width: min(1180px, calc(100vw - 48px)); max-height: min(880px, calc(100vh - 48px)); overflow: hidden; }
.home-inspiration-detail { min-height: 0; height: min(820px, calc(100vh - 48px)); align-items: stretch; overflow: hidden; }
.home-inspiration-detail-media {
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 12px;
  padding: 24px;
  overflow: hidden;
}
.home-inspiration-detail-stage {
  min-width: 0;
  min-height: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
}
.home-inspiration-detail-stage .home-inspiration-detail-item {
  grid-area: 1 / 1;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: min(680px, calc(100vh - 190px));
  object-fit: contain;
  border-radius: 12px;
}
.home-inspiration-detail-stage img.home-inspiration-detail-item { cursor: zoom-in; }
.home-inspiration-detail-stage .home-inspiration-detail-item[hidden] { display: none; }
.home-inspiration-detail-thumbs { min-width: 0; display: flex; flex-wrap: nowrap; justify-content: flex-start; gap: 8px; overflow-x: auto; overscroll-behavior-inline: contain; }
.home-inspiration-detail-thumbs button {
  position: relative;
  width: 54px;
  height: 54px;
  padding: 0;
  overflow: hidden;
  border: 1px solid #dbe3ec;
  border-radius: 10px;
  background: #fff;
  opacity: .68;
  cursor: pointer;
}
.home-inspiration-detail-thumbs button.is-active { border-color: #4b96ed; box-shadow: 0 0 0 2px rgba(53, 135, 230, .15); opacity: 1; }
.home-inspiration-detail-thumbs img { width: 100%; height: 100%; display: block; object-fit: cover; }
.home-inspiration-detail-thumbs i { position: absolute; inset: 0; display: grid; place-items: center; color: #fff; background: rgba(14, 24, 39, .26); }
.home-inspiration-detail-copy { min-height: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.community-detail-head {
  position: static;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 0;
  padding: 0 0 12px;
  background: transparent;
}
.home-inspiration-detail-category { color: #858b95; font-size: 11px; }
.community-detail-actions { display: inline-flex; align-items: center; gap: 7px; }
.community-detail-action {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  display: inline-grid;
  place-items: center;
  padding: 0;
  border: 1px solid #dfe5ec;
  border-radius: 50%;
  background: rgba(255,255,255,.84);
  color: #7c8794;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(28,48,76,.06);
  transition: color 160ms ease, border-color 160ms ease, background 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}
.community-detail-action:hover,
.community-detail-action:focus-visible { transform: translateY(-1px); border-color: #b9c8da; color: #46586e; box-shadow: 0 7px 18px rgba(28,48,76,.11); }
.community-detail-action:disabled { cursor: wait; opacity: .56; transform: none; }
.community-detail-action[aria-pressed="true"] .ico path { fill: currentColor; }
.community-detail-action.is-like[aria-pressed="true"] { border-color: rgba(229,82,112,.28); background: #fff1f4; color: #dd4968; }
.community-detail-action.is-favorite[aria-pressed="true"] { border-color: rgba(47,126,224,.28); background: #edf5ff; color: #2879d8; }
.home-inspiration-detail-copy p,
.home-prompt-preview { white-space: pre-wrap; overflow-wrap: anywhere; }
.home-prompt-preview { max-height: none; overflow: visible; }
@media (max-width: 760px) {
  .home-inspiration-panel { width: min(96vw, 680px); overflow-y: auto; }
  .home-inspiration-detail { height: auto; overflow: visible; }
  .home-inspiration-detail-media { padding: 16px; overflow: visible; }
  .home-inspiration-detail-stage { min-height: min(52vh, 440px); }
  .home-inspiration-detail-stage .home-inspiration-detail-item { max-height: min(52vh, 440px); }
  .home-inspiration-detail-copy { overflow: visible; scrollbar-gutter: auto; }
  .community-detail-head { position: static; }
}

/* v133 · 整体资产：草稿优先、成员收藏夹、后台素材二级分类。 */
.asset-backend-kind {
  flex: 0 0 auto;
  min-width: 150px;
}
.asset-favorite-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 14px;
}
.asset-favorite-card {
  min-width: 0;
  padding: 0;
  overflow: hidden;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.asset-favorite-card:hover {
  transform: translateY(-3px);
  border-color: rgba(31, 126, 239, .26);
  box-shadow: 0 16px 34px rgba(28, 76, 136, .12);
}
.asset-favorite-preview {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: linear-gradient(145deg, #edf5ff, #f7faff);
}
.asset-favorite-preview img,
.asset-favorite-preview video {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}
.asset-favorite-preview > span {
  position: absolute;
  right: 9px;
  bottom: 9px;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(16, 28, 45, .72);
  color: #fff;
  font-size: 10px;
  backdrop-filter: blur(10px);
}
.asset-favorite-copy {
  display: grid;
  gap: 5px;
  padding: 12px 13px 14px;
}
.asset-favorite-copy em,
.asset-favorite-copy small {
  color: #8b96a5;
  font-size: 10px;
  font-style: normal;
}
.asset-favorite-copy b {
  overflow: hidden;
  color: #1f2937;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.asset-favorite-panel {
  width: min(1040px, calc(100vw - 40px));
  max-height: min(860px, calc(100vh - 40px));
  padding: 0 !important;
  overflow: hidden;
}
.asset-favorite-dialog {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(260px, .75fr);
  grid-template-rows: auto minmax(0, 1fr);
  height: min(800px, calc(100vh - 56px));
  max-height: min(840px, calc(100vh - 56px));
  overflow: hidden;
}
.asset-favorite-dialog > header {
  grid-column: 1 / -1;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding: 17px 19px;
  border-bottom: 1px solid #e7edf4;
}
.asset-favorite-dialog > header span,
.asset-favorite-dialog > header small { color: #8a95a3; font-size: 10px; }
.asset-favorite-dialog > header h2 { margin: 3px 0; font-size: 18px; }
.asset-favorite-dialog-tools { display: flex; align-items: center; gap: 10px; }
.asset-favorite-dialog-media {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 10px;
  min-height: 0;
  padding: 14px;
  overflow: hidden;
  background: #f4f7fb;
}
.asset-favorite-dialog-stage { min-width: 0; min-height: 0; display: grid; place-items: center; overflow: hidden; }
.asset-favorite-dialog-stage .asset-favorite-dialog-item { grid-area: 1 / 1; max-width: 100%; max-height: 100%; }
.asset-favorite-dialog-stage button.asset-favorite-dialog-item { width: 100%; height: 100%; padding: 0; display: grid; place-items: center; border: 0; border-radius: 12px; background: transparent; cursor: zoom-in; }
.asset-favorite-dialog-stage .asset-favorite-dialog-item[hidden] { display: none; }
.asset-favorite-dialog-stage img,
.asset-favorite-dialog-stage video { width: auto; height: auto; max-width: 100%; max-height: 100%; display: block; border-radius: 12px; object-fit: contain; }
.asset-favorite-dialog-thumbs { min-width: 0; display: flex; gap: 8px; overflow-x: auto; overscroll-behavior-inline: contain; }
.asset-favorite-dialog-thumbs button { position: relative; width: 52px; height: 52px; flex: 0 0 52px; padding: 0; overflow: hidden; border: 1px solid #dbe3ec; border-radius: 9px; background: #fff; opacity: .68; cursor: pointer; }
.asset-favorite-dialog-thumbs button.is-active { border-color: #4b96ed; box-shadow: 0 0 0 2px rgba(53,135,230,.15); opacity: 1; }
.asset-favorite-dialog-thumbs img { width: 100%; height: 100%; display: block; object-fit: cover; }
.asset-favorite-dialog-thumbs i { position: absolute; inset: 0; display: grid; place-items: center; color: #fff; background: rgba(14,24,39,.26); }
.asset-favorite-dialog-copy { min-height: 0; padding: 18px; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.asset-favorite-dialog-copy p,
.asset-favorite-dialog-copy pre { margin: 0 0 15px; color: #566171; font: inherit; font-size: 11px; line-height: 1.8; white-space: pre-wrap; overflow-wrap: anywhere; }
.asset-favorite-dialog-copy label { display: block; margin-bottom: 7px; color: #8b95a3; font-size: 10px; }

/* v133 · 发布清单：长文、多图和视频都在单一可滚动预览层内完整呈现。 */
.delivery-preview-panel {
  width: min(1120px, calc(100vw - 36px));
  max-height: min(900px, calc(100vh - 36px));
  padding: 0 !important;
  overflow: hidden;
}
.delivery-preview-dialog {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  max-height: min(880px, calc(100vh - 52px));
  min-height: 0;
}
.delivery-preview-dialog > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px 14px;
  border-bottom: 1px solid #e8edf3;
}
.delivery-preview-dialog > header span {
  color: #7c8794;
  font-size: 10px;
}
.delivery-preview-dialog > header h2 {
  margin: 4px 0 0;
  font-size: 18px;
}
.delivery-preview-media {
  min-height: 0;
  padding: 16px 18px;
  overflow: auto;
  overscroll-behavior: contain;
  background: #f6f8fb;
}
.delivery-preview-media.is-video video {
  width: 100%;
  max-height: min(66vh, 700px);
  display: block;
  margin: auto;
  border-radius: 14px;
  background: #0e1420;
  object-fit: contain;
}
.delivery-preview-media.is-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  align-items: start;
  gap: 12px;
}
.delivery-preview-media.is-gallery button {
  position: relative;
  min-width: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid #e0e7ef;
  border-radius: 12px;
  background: #fff;
  cursor: zoom-in;
}
.delivery-preview-media.is-gallery img {
  width: 100%;
  height: auto;
  max-height: 420px;
  display: block;
  object-fit: contain;
}
.delivery-preview-media.is-gallery button span {
  position: absolute;
  right: 8px;
  bottom: 8px;
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(18, 30, 48, .72);
  color: #fff;
  font-size: 10px;
}
.delivery-preview-copy {
  min-height: 0;
  padding: 13px 18px 17px;
  border-top: 1px solid #e8edf3;
  background: #fff;
}
.delivery-preview-copy b {
  display: block;
  margin-bottom: 7px;
  font-size: 11px;
}
.delivery-preview-copy pre {
  max-height: 190px;
  margin: 0;
  overflow: auto;
  color: #596473;
  font: inherit;
  font-size: 11px;
  line-height: 1.75;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.dv-copy {
  max-height: 220px;
  overflow: auto;
  overscroll-behavior: contain;
  overflow-wrap: anywhere;
}
.dv-actions .btn.is-shared,
.dv-actions .btn:disabled.is-shared {
  border-color: #d7dce2;
  background: #f0f2f4;
  color: #858d98;
  opacity: 1;
}
@media (max-width: 720px) {
  .asset-favorite-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .asset-favorite-panel { width: min(96vw, 720px); }
  .asset-favorite-panel { overflow-y: auto; }
  .asset-favorite-dialog { height: auto; max-height: none; display: block; overflow: visible; }
  .asset-favorite-dialog-media,
  .asset-favorite-dialog-copy { overflow: visible; }
  .asset-favorite-dialog-stage { min-height: min(52vh, 440px); }
  .asset-favorite-dialog-tools { align-items: flex-start; }
  .delivery-preview-panel { width: min(96vw, 720px); }
  .delivery-preview-media.is-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 460px) {
  .asset-favorite-grid,
  .delivery-preview-media.is-gallery { grid-template-columns: 1fr; }
}