body.front-page.project-mode.project-storyboard-step.storyboard-progress-open .storyboard-progress-center {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto auto auto !important;
  align-content: center !important;
  gap: 16px !important;
}

.storyboard-progress-bar,
body.front-page.project-mode.project-storyboard-step.storyboard-progress-open .storyboard-progress-bar {
  --progress: 1;
  position: relative !important;
  width: min(620px, 100%) !important;
  height: 34px !important;
  display: block !important;
  overflow: hidden !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, .09) !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  box-shadow: inset 0 1px 12px rgba(0, 0, 0, .34), 0 16px 34px rgba(255, 47, 115, .14) !important;
}

.storyboard-progress-fill,
body.front-page.project-mode.project-storyboard-step.storyboard-progress-open .storyboard-progress-fill {
  position: absolute !important;
  inset: 0 auto 0 0 !important;
  width: calc(var(--progress) * 1%) !important;
  min-width: 18px !important;
  border-radius: inherit !important;
  background: linear-gradient(90deg, #ff2f73, #ff6aa0) !important;
  box-shadow: 0 0 22px rgba(255, 47, 115, .45) !important;
  transition: width .45s ease !important;
}

.storyboard-progress-bar b,
body.front-page.project-mode.project-storyboard-step.storyboard-progress-open .storyboard-progress-bar b {
  position: absolute !important;
  inset: 0 !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
  z-index: 1 !important;
}

body.front-page.project-mode.project-storyboard-step.storyboard-assets-open .storyboard-asset-model-row {
  display: grid !important;
  grid-template-columns: minmax(560px, 1.15fr) minmax(360px, .85fr) !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 8px 12px !important;
}

body.front-page.project-mode.project-storyboard-step.storyboard-assets-open .storyboard-asset-config-col {
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
}

body.front-page.project-mode.project-storyboard-step.storyboard-assets-open .storyboard-asset-config-col > span {
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}

body.front-page.project-mode.project-storyboard-step.storyboard-assets-open .storyboard-asset-model-control {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 8px !important;
  align-items: center !important;
}

body.front-page.project-mode.project-storyboard-step.storyboard-assets-open .storyboard-asset-config-col select,
body.front-page.project-mode.project-storyboard-step.storyboard-assets-open .storyboard-asset-model-control select {
  height: 38px !important;
  width: 100% !important;
  min-width: 0 !important;
}

body.front-page.project-mode.project-storyboard-step.storyboard-assets-open .style-col {
  grid-template-columns: auto 190px minmax(180px, 1fr) !important;
}

body.front-page.project-mode.project-storyboard-step.storyboard-assets-open #storyboardCustomStyleInput {
  height: 38px !important;
  min-width: 0 !important;
  border-radius: 10px !important;
  border: 1px solid rgba(255, 47, 115, .45) !important;
  background: rgba(5, 8, 13, .75) !important;
  color: #fff !important;
  padding: 0 12px !important;
  outline: none !important;
}

body.front-page.project-mode.project-storyboard-step.storyboard-assets-open #storyboardCustomStyleInput.hidden {
  display: none !important;
}

body.front-page.project-mode.project-storyboard-step.storyboard-assets-open .style-col:has(#storyboardCustomStyleInput.hidden) {
  grid-template-columns: auto minmax(0, 1fr) !important;
}

body.front-page.project-mode.project-storyboard-step.storyboard-assets-open .storyboard-asset-model-control .link-like {
  height: 38px !important;
  min-width: 118px !important;
  padding: 0 12px !important;
  white-space: nowrap !important;
}

body.front-page.project-mode.project-storyboard-step.storyboard-assets-open .storyboard-inline-style-cards {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body.front-page.project-mode.project-storyboard-step.storyboard-assets-open .storyboard-inline-style-cards button {
  min-height: 38px !important;
  padding: 7px 8px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  background: rgba(255, 255, 255, .04) !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
}

body.front-page.project-mode.project-storyboard-step.storyboard-assets-open .storyboard-inline-style-cards button.active {
  border-color: #ff2f73 !important;
  background: rgba(255, 47, 115, .24) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 47, 115, .28), 0 12px 28px rgba(255, 47, 115, .12) !important;
}

body.front-page.project-mode.project-storyboard-step.storyboard-assets-open .storyboard-section-head button[data-asset-ai] {
  width: auto !important;
  min-width: 138px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  white-space: nowrap !important;
}

@media (max-width: 1200px) {
  body.front-page.project-mode.project-storyboard-step.storyboard-assets-open .storyboard-asset-model-row {
    grid-template-columns: 1fr !important;
  }
}

.doc-detail-preview .doc-preview-table-wrap {
  max-height: 520px;
  overflow: auto;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 8px;
  background: rgba(10, 12, 18, .48);
}

.doc-detail-preview .doc-preview-table {
  width: 100%;
  min-width: 980px;
  border-collapse: collapse;
  font-size: 13px;
  line-height: 1.5;
}

.doc-detail-preview .doc-preview-table th,
.doc-detail-preview .doc-preview-table td {
  padding: 9px 10px;
  border-bottom: 1px solid rgba(255, 255, 255, .07);
  text-align: left;
  vertical-align: top;
}

.doc-detail-preview .doc-preview-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  color: #ff4f8f;
  background: #151821;
  white-space: nowrap;
}

.doc-detail-preview .doc-preview-table td {
  color: rgba(255, 255, 255, .88);
}

.doc-detail-preview .doc-preview-table td:nth-child(1),
.doc-detail-preview .doc-preview-table td:nth-child(3),
.doc-detail-preview .doc-preview-table td:nth-child(7) {
  white-space: nowrap;
}

.doc-detail-preview .doc-preview-note,
.doc-detail-preview .doc-preview-more {
  padding: 12px 14px;
  color: rgba(255, 255, 255, .72);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 8px;
  background: rgba(10, 12, 18, .46);
}

.doc-detail-preview .doc-preview-more {
  margin-top: 8px;
  border-color: rgba(255, 47, 125, .24);
  color: #ff8ab6;
}