.script-dialog,
.script-center-dialog {
  max-height: calc(100vh - 32px);
  overflow: auto;
}
.script-center-dialog {
  width: min(1180px, calc(100vw - 32px));
}
.script-center-page {
  position: relative;
  align-content: start;
  max-height: min(840px, calc(100vh - 32px));
  overflow: auto;
  background: #f5f8ff;
}
.script-center-page > header small,
.script-results-head small,
.script-result-stats span,
.script-empty,
.script-contract-note {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.5;
}
.script-center-head,
.script-head-actions,
.script-results-head,
.script-result-controls,
.script-bulk-toolbar,
.script-insights header,
.script-editor-drawer header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.script-center-head strong {
  color: var(--ink);
  font-size: 22px;
  letter-spacing: 0;
}
.script-center-head strong em,
.script-results h2 em {
  color: #7b879b;
  font-style: normal;
  font-weight: 800;
}
.script-center-head small {
  display: block;
  margin-top: 6px;
}
.script-head-actions .notify-button { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border: 1px solid rgba(35, 49, 72, .12); border-radius: 12px; background: rgba(255, 255, 255, .78); color: #17263a; box-shadow: 0 10px 24px rgba(36, 52, 83, .06), inset 0 1px 0 rgba(255, 255, 255, .76); }
.script-head-actions .notify-button .aiv-button-icon { width: 21px; height: 21px; color: currentColor; }
.script-head-actions .notify-button::after { top: -5px; right: -5px; min-width: 18px; height: 18px; border: 2px solid #f8fbff; border-radius: 999px; background: #ff3040; color: #fff; font-size: 10px; font-weight: 950; line-height: 14px; text-align: center; box-shadow: 0 4px 10px rgba(255, 48, 64, .24); }
.script-top-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 420px);
  gap: 16px;
  margin-top: 16px;
}
.script-generator-card,
.script-generate-config,
.script-results,
.script-insights,
.script-editor-drawer {
  min-width: 0;
  border: 1px solid rgba(205, 216, 235, .78);
  border-radius: 18px;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 18px 40px rgba(31, 45, 61, .07);
}
.script-generator-card {
  display: grid;
  gap: 12px;
  padding: 14px;
}
.script-tabs {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0;
  min-height: 44px;
  border-bottom: 1px solid rgba(222, 228, 240, .92);
}

.script-tabs button {
  position: relative;
  border: 0;
  background: transparent;
  color: #263656;
  font: inherit;
  font-size: 14px;
  font-weight: 900;
  cursor: pointer;
}

.script-tabs button::after {
  position: absolute;
  right: 18px;
  bottom: -1px;
  left: 18px;
  height: 2px;
  border-radius: 99px;
  background: transparent;
  content: "";
}

.script-tabs button.active {
  color: #4d35ff;
}

.script-tabs button.active::after {
  background: linear-gradient(90deg, #7148ff, #0e8cff);
}

.script-prompt-wrap {
  position: relative;
  display: block;
}

.script-prompt-wrap textarea {
  width: 100%;
  min-height: 142px;
  padding: 16px 18px 32px;
  border: 1px solid rgba(211, 220, 236, .96);
  border-radius: 12px;
  background: linear-gradient(180deg, #fff, #fbfdff);
  color: #24324c;
  font: inherit;
  font-size: 14px;
  font-weight: 750;
  line-height: 1.8;
  resize: vertical;
}

.script-prompt-wrap span {
  position: absolute;
  right: 16px;
  bottom: 12px;
  color: #7c879a;
  font-size: 12px;
  font-weight: 850;
}

.script-topic-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.script-topic-strip span {
  color: #44516a;
  font-size: 13px;
  font-weight: 900;
}

.script-topic-strip button,
.script-chip-grid button,
.script-platform-choice button {
  min-height: 36px;
  border: 1px solid rgba(211, 220, 236, .96);
  border-radius: 8px;
  background: #fff;
  color: #39445c;
  font: inherit;
  font-size: 13px;
  font-weight: 850;
  cursor: pointer;
  transition: border-color .18s ease, box-shadow .18s ease, color .18s ease, transform .18s ease;
}

.script-topic-strip button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 0 16px; }
.script-topic-strip button i { width: 14px; height: 14px; }

.script-topic-strip button:hover,
.script-chip-grid button:hover,
.script-platform-choice button:hover {
  border-color: rgba(113, 72, 255, .42);
  box-shadow: 0 10px 22px rgba(60, 78, 126, .09);
  transform: translateY(-1px);
}

.script-generate-config {
  display: grid;
  gap: 12px;
  padding: 14px 16px;
}

.script-generate-config section {
  display: grid;
  gap: 10px;
}

.script-generate-config h2,
.script-results h2,
.script-insights h2,
.script-editor-drawer h2 {
  margin: 0;
  color: #111827;
  font-size: 15px;
  font-weight: 950;
  letter-spacing: 0;
}

.script-generate-config h2 small {
  color: #7c879a;
  font-size: 12px;
  font-weight: 800;
}

.script-chip-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.script-chip-grid.duration {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.script-chip-grid button,
.script-platform-choice button {
  padding: 0 10px;
}

.script-chip-grid button.active,
.script-platform-choice button.active {
  border-color: rgba(113, 72, 255, .72);
  background: linear-gradient(180deg, rgba(117, 77, 255, .1), rgba(13, 139, 255, .05));
  color: #4b32ff;
  box-shadow: inset 0 0 0 1px rgba(113, 72, 255, .18);
}

.script-platform-choice {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}

.script-platform-choice button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 34px;
  padding: 0 6px;
  font-size: 11px;
  white-space: nowrap;
}

.script-platform-badge {
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  overflow: hidden;
  border: 1px solid rgba(215, 223, 238, .9);
  border-radius: 7px;
  background: #fff;
  box-shadow: 0 5px 12px rgba(31, 45, 61, .06);
}

.script-platform-badge.platform-douyin,
.script-platform-badge.platform-tiktok {
  border-color: rgba(17, 24, 39, .16);
  background: #080b12;
}

.script-platform-badge.platform-xhs {
  border-color: rgba(255, 36, 44, .22);
  background: #ff2442;
}

.script-platform-badge.platform-wechat_channels {
  border-color: rgba(255, 128, 23, .22);
  background: #ff8a18;
}

.script-platform-badge.platform-bilibili {
  border-color: rgba(20, 161, 255, .22);
  background: #149dff;
}

.script-platform-badge.platform-kuaishou {
  border-color: rgba(255, 99, 18, .22);
  background: #ff6414;
}

.script-platform-badge img {
  width: 16px;
  height: 16px;
  display: block;
}

.script-platform-badge b {
  color: #fff;
  font-size: 12px;
  font-weight: 950;
}

.script-generate-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 46px;
  border-radius: 9px;
  background: linear-gradient(90deg, #9e45ff, #064cff 56%, #0789ff);
  box-shadow: 0 16px 32px rgba(68, 83, 255, .24);
}

.script-generate-submit i {
  width: 18px;
  height: 18px;
}

.script-contract-note {
  display: flex;
  justify-content: center;
  gap: 6px;
  align-items: center;
}

.script-contract-note strong {
  color: #5b6680;
  font-size: 13px;
}

.script-contract-note button {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border: 0;
  border-radius: 6px;
  background: #e7edff;
  color: #4d5bd6;
  font-weight: 950;
}

.script-results {
  display: grid;
  gap: 0;
  margin-top: 14px;
  min-height: 296px;
  overflow: hidden;
}

.script-results-head {
  align-items: center;
  min-height: 48px;
  padding: 8px 18px 6px;
  box-sizing: border-box;
}

.script-results-head > div:first-child {
  min-width: 0;
}

.script-results-head h2 {
  display: flex;
  gap: 8px;
  align-items: baseline;
}

.script-results-head small { display: none; }

.script-result-controls {
  align-items: end;
  position: relative;
  flex-wrap: nowrap;
}

.script-result-controls label {
  flex: 0 1 160px;
  display: grid;
  gap: 4px;
  min-width: 110px;
}

.script-result-controls .script-campaign-filter {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  pointer-events: none;
}

.script-result-controls .outline-button.compact {
  flex: 0 0 auto;
  width: auto;
}

.script-result-controls label span {
  display: none;
  color: #7c879a;
  font-size: 10px;
  font-weight: 900;
}

.script-result-controls select {
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid rgba(214, 223, 239, .95);
  border-radius: 9px;
  background: #fff;
  color: #34405a;
  font: inherit;
  font-size: 12px;
  font-weight: 850;
}

.script-result-stats {
  display: none;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  padding: 0 18px 12px;
}

.script-result-stats div {
  display: grid;
  gap: 3px;
  padding: 8px 10px;
  border: 1px solid rgba(222, 228, 240, .9);
  border-radius: 10px;
  background: #f8fbff;
}

.script-result-stats strong {
  color: #101828;
  font-size: 17px;
  line-height: 1;
}

.script-bulk-toolbar {
  display: flex;
  min-height: 0;
  max-height: 0;
  overflow: hidden;
  padding: 0 18px;
  border-top: 0 solid rgba(232, 236, 246, .95);
  background: #fbfdff;
  opacity: 0;
  transition: max-height .18s ease, min-height .18s ease, padding .18s ease, opacity .18s ease;
}

.script-bulk-toolbar.is-active {
  min-height: 42px;
  max-height: 58px;
  padding: 8px 18px;
  border-top-width: 1px;
  opacity: 1;
}

.script-bulk-toolbar label,
.script-select {
  color: #4b5568;
  font-size: 12px;
  font-weight: 900;
}

.script-bulk-toolbar label {
  display: flex;
  align-items: center;
  gap: 8px;
}

.script-bulk-toolbar > div {
  display: flex;
  gap: 8px;
}

.script-bulk-toolbar small {
  color: #7c879a;
  font-size: 12px;
  font-weight: 800;
}

.script-table-head,
.script-result-row {
  display: grid;
  grid-template-columns: minmax(300px, 1fr) 60px 116px 82px 136px 246px;
  gap: 12px;
  align-items: center;
}

.script-table-head {
  min-height: 34px;
  padding: 0 18px;
  border-top: 1px solid rgba(232, 236, 246, .95);
  border-bottom: 1px solid rgba(232, 236, 246, .95);
  background: linear-gradient(180deg, #f8fbff, #f1f5fb);
  color: #556173;
  font-size: 12px;
  font-weight: 950;
}

.script-list {
  height: 170px;
  max-height: 170px;
  overflow: auto;
}

.script-result-row {
  min-height: 42px;
  padding: 0 18px;
  border-bottom: 1px solid rgba(232, 236, 246, .82);
  background: #fff;
}

.script-result-title {
  display: grid;
  grid-template-columns: auto 30px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  min-width: 0;
}

.script-result-title input {
  accent-color: #7048ff;
}

.script-center-dialog:not(.script-bulk-select-mode) .script-result-title { grid-template-columns: 30px minmax(0, 1fr); }
.script-center-dialog:not(.script-bulk-select-mode) .script-result-title input { display: none; }
.script-center-dialog.script-bulk-select-mode .script-result-title { grid-template-columns: auto 30px minmax(0, 1fr); }
.script-result-title i {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 9px;
  background: linear-gradient(180deg, #f0ecff, #edf5ff);
  color: #5d3cff;
}

.script-result-title strong,
.script-result-title small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.script-result-title strong {
  color: #172033;
  font-size: 13px;
}

.script-result-title small {
  margin-top: 4px;
  color: #7a8495;
  font-size: 11px;
  font-weight: 800;
}

.script-duration {
  color: #44516a;
  font-size: 13px;
  font-weight: 850;
}

.script-row-platforms {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.script-score {
  display: grid;
  gap: 2px;
}

.script-score strong {
  color: #1d2738;
  font-size: 13px;
}

.script-score > span {
  color: #ffb100;
  font-size: 13px;
  letter-spacing: 0;
  white-space: nowrap;
}

.script-star-icons { display: inline-flex; gap: 1px; }

.script-star-icons [data-icon].script-star-icon.aiv-icon { width: 10px; height: 10px; color: #f7b500; }

.script-star-icons .script-star-icon.is-muted { opacity: .34; }

.script-star-icons .aiv-svg { fill: currentColor; stroke: currentColor; stroke-width: 1.25; }

.script-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.script-tags span {
  max-width: 72px;
  overflow: hidden;
  padding: 5px 8px;
  border-radius: 7px;
  background: #eef7ff;
  color: #2376ff;
  font-size: 11px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.script-tags span:first-child {
  background: #f4efff;
  color: #8050ff;
}

.script-tags span:nth-child(2) {
  background: #eafbf5;
  color: #13a879;
}

.script-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

.script-actions .compact {
  min-height: 28px;
  padding: 0 6px;
  border-radius: 7px;
  font-size: 11px;
}

.script-actions .primary-button {
  background: linear-gradient(180deg, #7b42ff, #5224f5);
}

.script-more-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 30px;
  border: 0;
  background: #fff;
  color: #4d35ff;
  font: inherit;
  font-size: 13px;
  font-weight: 950;
  cursor: pointer;
}

.script-more-button i {
  width: 13px;
  height: 13px;
}

.script-insights {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 18px;
  padding: 16px;
}

.script-insights header {
  grid-column: 1 / -1;
  justify-content: flex-start;
}

.script-insights article {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(222, 228, 240, .9);
  border-radius: 14px;
  background: #fff;
}

.script-insights article i {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  color: #fff;
  background: linear-gradient(135deg, #9d49ff, #4a73ff);
  box-shadow: 0 12px 22px rgba(82, 74, 255, .2);
}

.script-insights article:nth-of-type(2) i {
  background: linear-gradient(135deg, #22a6ff, #417bff);
}

.script-insights article:nth-of-type(3) i {
  background: linear-gradient(135deg, #16d5a1, #0aa36f);
}

.script-insights strong,
.script-insights span {
  display: block;
  min-width: 0;
}

.script-insights strong {
  color: #172033;
  font-size: 13px;
}

.script-insights span {
  margin-top: 5px;
  color: #617086;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.5;
}

.script-insights em {
  align-self: end;
  padding: 7px 10px;
  border-radius: 999px;
  background: #eef2ff;
  color: #4d35ff;
  font-size: 11px;
  font-style: normal;
  font-weight: 950;
  white-space: nowrap;
}

.script-empty {
  margin: 12px 18px;
  padding: 18px;
  border: 1px dashed rgba(191, 201, 219, .9);
  border-radius: 12px;
  background: #fbfdff;
}

.script-editor-drawer {
  margin-top: 18px;
  display: grid;
  gap: 12px;
  padding: 16px;
}

.script-editor-drawer[hidden] {
  display: none;
}

.script-editor-drawer label {
  display: grid;
  gap: 7px;
  min-width: 0;
  color: #53657a;
  font-size: 12px;
  font-weight: 900;
}

.script-editor-drawer input,
.script-editor-drawer textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid rgba(214, 223, 239, .95);
  border-radius: 9px;
  background: #fbfdff;
  color: var(--text);
  font: inherit;
}

.script-editor-drawer input {
  min-height: 38px;
  padding: 0 10px;
}

.script-editor-drawer textarea {
  padding: 10px;
  line-height: 1.6;
  resize: vertical;
}

.script-editor-drawer footer {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

@media (min-width: 961px) {
  .script-center-dialog {
    position: fixed;
    inset: 0 0 0 204px;
    width: auto;
    max-width: none;
    max-height: none;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 24px 0 0 24px;
    background: transparent;
    box-shadow: none;
    overflow: hidden;
  }

  .script-center-dialog::backdrop {
    background: transparent;
  }

  .script-center-page {
    height: 100vh;
    max-height: none;
    padding: 26px 28px 30px;
    overflow: auto;
    border-radius: 24px 0 0 24px;
    background:
      radial-gradient(circle at 22% 0%, rgba(214, 228, 255, .85), transparent 36%),
      radial-gradient(circle at 88% 4%, rgba(232, 239, 255, .92), transparent 34%),
      linear-gradient(180deg, #f5f8ff 0%, #eef4fb 100%);
  }

  .script-head-actions .icon-close { display: none !important; }
}

@media (min-width: 961px) and (max-height: 960px) { .script-center-page { padding: 20px 24px 24px; } .script-center-head { min-height: 48px; } .script-top-grid { gap: 14px; margin-top: 10px; } .script-generator-card { gap: 8px; padding: 10px; } .script-tabs { min-height: 36px; } .script-prompt-wrap textarea { min-height: 108px; padding: 11px 14px 24px; line-height: 1.5; } .script-prompt-wrap span { right: 14px; bottom: 9px; font-size: 11px; } .script-topic-strip { gap: 7px; } .script-topic-strip button, .script-chip-grid button, .script-platform-choice button { min-height: 30px; } .script-topic-strip button { padding: 0 12px; } .script-generate-config { gap: 8px; padding: 10px 12px; } .script-generate-config section { gap: 7px; } .script-chip-grid, .script-platform-choice { gap: 6px; } .script-generate-submit { min-height: 38px; } .script-contract-note strong { font-size: 12px; } .script-contract-note button { width: 18px; height: 18px; } .script-results { margin-top: 12px; } .script-insights { margin-top: 12px; padding: 12px; } .script-insights article { min-height: 72px; padding: 10px; } .script-insights article i { width: 34px; height: 34px; } .script-insights span { margin-top: 3px; line-height: 1.35; } }

@media (max-width: 1180px) and (min-width: 961px) {
  .script-top-grid { grid-template-columns: minmax(0, 1fr) 340px; }
  .script-table-head, .script-result-row { grid-template-columns: minmax(260px, 1fr) 54px 108px 76px 128px 224px; gap: 10px; }
}

@media (max-width: 960px) {
  .script-center-dialog {
    width: 100vw;
    max-width: 100vw;
    max-height: 100vh;
    border-radius: 0;
  }

  .script-center-page {
    max-height: 100vh;
    padding: 16px;
  }

  .script-center-head,
  .script-results-head,
  .script-bulk-toolbar,
  .script-insights header,
  .script-editor-drawer header {
    align-items: stretch;
    flex-direction: column;
  }

  .script-head-actions,
  .script-result-controls {
    width: 100%;
    justify-content: flex-start;
  }

  .script-top-grid,
  .script-insights,
  .script-result-stats {
    grid-template-columns: 1fr;
  }

  .script-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .script-platform-choice {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .script-table-head {
    display: none;
  }

  .script-list {
    height: auto;
    max-height: none;
  }

  .script-result-row {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 14px 18px;
  }

  .script-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
