/* 首页产品演示 V2 · 任务执行与工作应用
 * 只补充两个模块的页面布局；顶栏、活动栏、分区和结果语法由 product-demo-v2.css 提供。
 */

.tt-product-demo--work-v2 {
  --tt-work-v2-blue: var(--tt-v2-accent, #397bd6);
  --tt-work-v2-blue-soft: var(--tt-v2-accent-soft, #eaf2fd);
  --tt-work-v2-ink: var(--tt-v2-ink, #27313d);
  --tt-work-v2-muted: var(--tt-v2-muted, #76808b);
  --tt-work-v2-line: var(--tt-v2-line, rgba(52, 70, 94, 0.08));
}

.tt-product-demo--work-v2 .tt-work-v2-workspace {
  display: grid;
  grid-template-columns: 17.2cqw minmax(0, 1fr) 23.5cqw;
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow: hidden;
}

.tt-product-demo--work-v2 .tt-work-v2-sidebar {
  padding: 0.9cqw 0.72cqw;
}

.tt-product-demo--work-v2 .tt-work-v2-sidebar__head,
.tt-product-demo--work-v2 .tt-work-v2-main__head,
.tt-product-demo--work-v2 .tt-work-v2-detail__head {
  display: flex;
  align-items: center;
  min-height: 2.25cqw;
  color: var(--tt-work-v2-muted);
  font-size: clamp(7px, 0.68cqw, 10px);
  font-weight: 600;
  letter-spacing: 0.04em;
}

.tt-product-demo--work-v2 .tt-work-v2-sidebar__head span,
.tt-product-demo--work-v2 .tt-work-v2-detail__head span {
  margin-left: auto;
  color: #9da6b0;
  font-weight: 500;
}

.tt-product-demo--work-v2 .tt-work-v2-task-list {
  display: grid;
  gap: 0.38cqw;
  margin-top: 0.45cqw;
}

.tt-product-demo--work-v2 .tt-work-v2-task {
  display: grid;
  grid-template-columns: 1.3cqw minmax(0, 1fr);
  align-items: center;
  gap: 0.58cqw;
  min-height: 3.4cqw;
  padding: 0.5cqw 0.62cqw;
  border-radius: 0.62cqw;
  color: #68737f;
  font-size: clamp(7px, 0.72cqw, 11px);
  line-height: 1.35;
}

.tt-product-demo--work-v2 .tt-work-v2-task > svg {
  width: 1.05cqw;
  height: 1.05cqw;
  color: #98a1ab;
}

.tt-product-demo--work-v2 .tt-work-v2-task > span {
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.tt-product-demo--work-v2 .tt-work-v2-task.is-current {
  background: #fff;
  color: var(--tt-work-v2-ink);
  font-weight: 600;
  box-shadow: inset 0 0 0 1px rgba(57, 123, 214, 0.08);
}

.tt-product-demo--work-v2 .tt-work-v2-task.is-current > svg {
  color: var(--tt-work-v2-blue);
}

.tt-product-demo--work-v2 .tt-work-v2-main {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: 0.85cqw;
  padding: 1cqw 1.2cqw 1.1cqw;
}

.tt-product-demo--work-v2 .tt-work-v2-main__head {
  min-height: 2cqw;
  color: var(--tt-work-v2-ink);
  font-size: clamp(8px, 0.82cqw, 12px);
  letter-spacing: 0;
}

.tt-product-demo--work-v2 .tt-work-v2-brief {
  display: grid;
  gap: 0.48cqw;
  min-width: 0;
}

.tt-product-demo--work-v2 .tt-work-v2-agent-state {
  display: flex;
  align-items: center;
  gap: 0.52cqw;
  min-width: 0;
}

.tt-product-demo--work-v2 .tt-work-v2-agent-state > i {
  display: grid;
  place-items: center;
  width: 1.7cqw;
  height: 1.7cqw;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--tt-work-v2-blue-soft);
  color: var(--tt-work-v2-blue);
  font-style: normal;
  font-weight: 700;
}

.tt-product-demo--work-v2 .tt-work-v2-agent-state > span {
  display: grid;
  min-width: 0;
}

.tt-product-demo--work-v2 .tt-work-v2-agent-state strong {
  color: var(--tt-work-v2-ink);
  font-size: clamp(8px, 0.78cqw, 12px);
  font-weight: 600;
}

.tt-product-demo--work-v2 .tt-work-v2-agent-state small {
  color: var(--tt-work-v2-muted);
  font-size: clamp(6px, 0.6cqw, 9px);
}

.tt-product-demo--work-v2 .tt-work-v2-prompt {
  margin-left: 2.22cqw;
  padding: 0.72cqw 0.82cqw;
  border-radius: 0.68cqw;
  background: #f3f5f7;
  color: #505a65;
  font-size: clamp(7px, 0.72cqw, 11px);
  line-height: 1.55;
}

.tt-product-demo--work-v2 .tt-work-v2-runtime {
  align-self: stretch;
  min-height: 0;
  padding: 0.82cqw;
  border-radius: 0.72cqw;
  background: #f7f9fb;
}

.tt-product-demo--work-v2 .tt-work-v2-runtime__title {
  display: flex;
  align-items: center;
  gap: 0.48cqw;
  color: #5c6672;
  font-size: clamp(7px, 0.68cqw, 10px);
  font-weight: 600;
}

.tt-product-demo--work-v2 .tt-work-v2-runtime__title > svg {
  width: 0.95cqw;
  height: 0.95cqw;
  color: var(--tt-work-v2-blue);
}

.tt-product-demo--work-v2 .tt-work-v2-runtime__title > span {
  margin-left: auto;
  color: #87919c;
  font-weight: 500;
}

.tt-product-demo--work-v2 .tt-work-v2-steps {
  display: grid;
  gap: 0.24cqw;
  margin-top: 0.52cqw;
}

.tt-product-demo--work-v2 .tt-work-v2-step {
  display: grid;
  grid-template-columns: 1.15cqw minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.5cqw;
  min-height: 2.18cqw;
  padding: 0 0.48cqw;
  border-radius: 0.46cqw;
  color: #596470;
  font-size: clamp(7px, 0.66cqw, 10px);
}

.tt-product-demo--work-v2 .tt-work-v2-step > i {
  display: grid;
  place-items: center;
  width: 1.08cqw;
  height: 1.08cqw;
  border-radius: 50%;
  background: var(--tt-work-v2-blue-soft);
  color: var(--tt-work-v2-blue);
  font-size: clamp(5px, 0.54cqw, 8px);
  font-style: normal;
  font-weight: 700;
}

.tt-product-demo--work-v2 .tt-work-v2-step > small {
  color: #8a949f;
  font-size: clamp(6px, 0.58cqw, 9px);
}

.tt-product-demo--work-v2 .tt-work-v2-detail {
  display: flex;
  min-width: 0;
  min-height: 0;
  flex-direction: column;
  padding: 1cqw 0.9cqw;
}

.tt-product-demo--work-v2 .tt-work-v2-deliverable {
  display: grid;
  min-height: 0;
  flex: 1;
  align-content: start;
  padding: 0.86cqw;
  border-radius: 0.72cqw;
  background: #fff;
}

.tt-product-demo--work-v2 .tt-work-v2-preview {
  display: grid;
  grid-template-rows: 1.15cqw minmax(0, 1fr);
  height: 9.2cqw;
  overflow: hidden;
  border-radius: 0.58cqw;
  background: linear-gradient(145deg, #eef4fc, #fff 58%, #f4f6f8);
  box-shadow: inset 0 0 0 1px var(--tt-work-v2-line);
}

.tt-product-demo--work-v2 .tt-work-v2-preview__bar {
  display: flex;
  align-items: center;
  gap: 0.28cqw;
  padding: 0 0.5cqw;
  background: rgba(255, 255, 255, 0.72);
}

.tt-product-demo--work-v2 .tt-work-v2-preview__bar i {
  width: 0.3cqw;
  height: 0.3cqw;
  border-radius: 50%;
  background: #b8c2ce;
}

.tt-product-demo--work-v2 .tt-work-v2-preview__body {
  display: grid;
  grid-template-columns: 32% minmax(0, 1fr);
  gap: 0.72cqw;
  padding: 0.8cqw;
}

.tt-product-demo--work-v2 .tt-work-v2-preview__body::before,
.tt-product-demo--work-v2 .tt-work-v2-preview__body::after {
  content: '';
  border-radius: 0.42cqw;
  background: rgba(255, 255, 255, 0.84);
  box-shadow: inset 0 0 0 1px rgba(57, 123, 214, 0.08);
}

.tt-product-demo--work-v2 .tt-work-v2-result {
  margin-top: auto;
  padding-top: 0.82cqw;
}

.tt-product-demo--work-v2 .tt-work-v2-result strong {
  display: block;
  color: #244d82;
  font-size: clamp(8px, 0.82cqw, 12px);
  font-weight: 650;
}

.tt-product-demo--work-v2 .tt-work-v2-result span {
  display: block;
  margin-top: 0.26cqw;
  color: #58708d;
  font-size: clamp(7px, 0.64cqw, 10px);
  line-height: 1.45;
}

.tt-product-demo--apps-v2 {
  --tt-apps-v2-blue: var(--tt-v2-accent, #397bd6);
  --tt-apps-v2-blue-soft: var(--tt-v2-accent-soft, #eaf2fd);
  --tt-apps-v2-green: #3d9b70;
  --tt-apps-v2-ink: var(--tt-v2-ink, #27313d);
  --tt-apps-v2-muted: var(--tt-v2-muted, #76808b);
  --tt-apps-v2-line: var(--tt-v2-line, rgba(52, 70, 94, 0.08));
}

.tt-product-demo--apps-v2 .tt-apps-v2-workspace {
  display: grid;
  grid-template-columns: 28cqw minmax(0, 1fr);
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow: hidden;
}

.tt-product-demo--apps-v2 .tt-apps-v2-sidebar {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: 0.68cqw;
  padding: 1cqw;
}

.tt-product-demo--apps-v2 .tt-apps-v2-task-label {
  color: var(--tt-apps-v2-muted);
  font-size: clamp(6px, 0.62cqw, 9px);
  font-weight: 600;
  letter-spacing: 0.05em;
}

.tt-product-demo--apps-v2 .tt-apps-v2-task-title {
  color: var(--tt-apps-v2-ink);
  font-size: clamp(9px, 0.94cqw, 14px);
  font-weight: 650;
  line-height: 1.35;
}

.tt-product-demo--apps-v2 .tt-apps-v2-process {
  display: grid;
  align-content: start;
  gap: 0.52cqw;
  margin-top: 0.4cqw;
}

.tt-product-demo--apps-v2 .tt-apps-v2-process-item {
  display: grid;
  grid-template-columns: 2.05cqw minmax(0, 1fr);
  align-items: center;
  gap: 0.66cqw;
  min-height: 4.25cqw;
  padding: 0.58cqw 0.7cqw;
  border-radius: 0.62cqw;
  background: rgba(255, 255, 255, 0.72);
}

.tt-product-demo--apps-v2 .tt-apps-v2-app-mark {
  display: grid;
  place-items: center;
  width: 2.05cqw;
  height: 2.05cqw;
  border-radius: 0.52cqw;
  background: var(--tt-apps-v2-blue-soft);
  color: var(--tt-apps-v2-blue);
}

.tt-product-demo--apps-v2 .tt-apps-v2-app-mark > svg {
  width: 1.05cqw;
  height: 1.05cqw;
}

.tt-product-demo--apps-v2 .tt-apps-v2-app-mark--data {
  background: #eaf5f0;
  color: #438b70;
}

.tt-product-demo--apps-v2 .tt-apps-v2-app-mark--person {
  border-radius: 50%;
  background: #eff2f5;
  color: #536171;
  font-size: clamp(7px, 0.72cqw, 11px);
  font-weight: 700;
}

.tt-product-demo--apps-v2 .tt-apps-v2-process-copy {
  display: grid;
  min-width: 0;
}

.tt-product-demo--apps-v2 .tt-apps-v2-process-copy strong {
  overflow: hidden;
  color: #44505c;
  font-size: clamp(7px, 0.72cqw, 11px);
  font-weight: 600;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.tt-product-demo--apps-v2 .tt-apps-v2-process-copy small {
  overflow: hidden;
  margin-top: 0.12cqw;
  color: #87919c;
  font-size: clamp(6px, 0.58cqw, 9px);
  white-space: nowrap;
  text-overflow: ellipsis;
}

.tt-product-demo--apps-v2 .tt-apps-v2-main {
  display: grid;
  grid-template-rows: 3.5cqw 2.5cqw minmax(0, 1fr) auto;
  min-width: 0;
  min-height: 0;
}

.tt-product-demo--apps-v2 .tt-apps-v2-tabs {
  display: flex;
  align-items: center;
  gap: 0.32cqw;
  min-width: 0;
  padding: 0 0.82cqw;
  border-bottom: 1px solid var(--tt-apps-v2-line);
}

.tt-product-demo--apps-v2 .tt-apps-v2-tab {
  display: flex;
  align-items: center;
  gap: 0.42cqw;
  min-width: 0;
  height: 2.2cqw;
  padding: 0 0.72cqw;
  border-radius: 0.58cqw;
  color: #707b87;
  font-size: clamp(7px, 0.7cqw, 10px);
  white-space: nowrap;
}

.tt-product-demo--apps-v2 .tt-apps-v2-tab > svg {
  width: 0.92cqw;
  height: 0.92cqw;
}

.tt-product-demo--apps-v2 .tt-apps-v2-tab.is-active {
  background: var(--tt-apps-v2-blue-soft);
  color: #2f64a9;
  font-weight: 600;
}

.tt-product-demo--apps-v2 .tt-apps-v2-sync {
  display: flex;
  align-items: center;
  gap: 0.52cqw;
  min-width: 0;
  padding: 0 1.08cqw;
  border-bottom: 1px solid var(--tt-apps-v2-line);
  color: var(--tt-apps-v2-muted);
  font-size: clamp(6px, 0.62cqw, 9px);
}

.tt-product-demo--apps-v2 .tt-apps-v2-sync > i {
  width: 0.42cqw;
  height: 0.42cqw;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--tt-apps-v2-green);
}

.tt-product-demo--apps-v2 .tt-apps-v2-sync > span:last-child {
  margin-left: auto;
}

.tt-product-demo--apps-v2 .tt-apps-v2-resource-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 16.5cqw;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.tt-product-demo--apps-v2 .tt-apps-v2-document {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  padding: 1.18cqw 1.42cqw;
  background: #fff;
}

.tt-product-demo--apps-v2 .tt-apps-v2-document h4 {
  max-width: 30cqw;
  margin: 0;
  color: var(--tt-apps-v2-ink);
  font-size: clamp(10px, 1.16cqw, 17px);
  font-weight: 650;
  line-height: 1.28;
}

.tt-product-demo--apps-v2 .tt-apps-v2-document-meta {
  display: flex;
  align-items: center;
  gap: 0.46cqw;
  margin-top: 0.48cqw;
  color: #8a949f;
  font-size: clamp(6px, 0.58cqw, 9px);
}

.tt-product-demo--apps-v2 .tt-apps-v2-document-meta > i {
  display: grid;
  place-items: center;
  width: 1.18cqw;
  height: 1.18cqw;
  border-radius: 50%;
  background: #edf1f5;
  color: #526071;
  font-size: clamp(5px, 0.52cqw, 8px);
  font-style: normal;
  font-weight: 700;
}

.tt-product-demo--apps-v2 .tt-apps-v2-summary {
  margin-top: 1.1cqw;
  padding-top: 0.9cqw;
  border-top: 1px solid var(--tt-apps-v2-line);
}

.tt-product-demo--apps-v2 .tt-apps-v2-summary h5 {
  margin: 0;
  color: #3d4854;
  font-size: clamp(8px, 0.82cqw, 12px);
  font-weight: 650;
}

.tt-product-demo--apps-v2 .tt-apps-v2-summary ul {
  display: grid;
  gap: 0.34cqw;
  margin: 0.58cqw 0 0;
  padding: 0;
}

.tt-product-demo--apps-v2 .tt-apps-v2-summary li {
  display: grid;
  grid-template-columns: 0.42cqw minmax(0, 1fr);
  gap: 0.46cqw;
  color: #68737f;
  font-size: clamp(7px, 0.68cqw, 10px);
  line-height: 1.45;
}

.tt-product-demo--apps-v2 .tt-apps-v2-summary li::before {
  content: '';
  width: 0.34cqw;
  height: 0.34cqw;
  margin-top: 0.5em;
  border-radius: 50%;
  background: #8ba9cf;
}

.tt-product-demo--apps-v2 .tt-apps-v2-source {
  padding: 1cqw 0.82cqw;
}

.tt-product-demo--apps-v2 .tt-apps-v2-source__label {
  color: var(--tt-apps-v2-muted);
  font-size: clamp(6px, 0.58cqw, 9px);
  font-weight: 600;
}

.tt-product-demo--apps-v2 .tt-apps-v2-source-card {
  margin-top: 0.62cqw;
  padding: 0.76cqw;
  border-radius: 0.62cqw;
  background: #fff;
}

.tt-product-demo--apps-v2 .tt-apps-v2-source-card__head {
  display: flex;
  align-items: center;
  gap: 0.48cqw;
  color: #3f4a56;
  font-size: clamp(7px, 0.7cqw, 10px);
  font-weight: 600;
}

.tt-product-demo--apps-v2 .tt-apps-v2-source-card__head > svg {
  width: 1cqw;
  height: 1cqw;
  color: #438b70;
}

.tt-product-demo--apps-v2 .tt-apps-v2-source-card > strong {
  display: block;
  margin-top: 0.65cqw;
  color: #2e6b54;
  font-size: clamp(12px, 1.45cqw, 20px);
  font-weight: 650;
}

.tt-product-demo--apps-v2 .tt-apps-v2-source-card > small {
  display: block;
  color: #7f8a94;
  font-size: clamp(6px, 0.58cqw, 9px);
}

.tt-product-demo--apps-v2 .tt-apps-v2-source-rows {
  display: grid;
  gap: 0.3cqw;
  margin-top: 0.72cqw;
}

.tt-product-demo--apps-v2 .tt-apps-v2-source-rows i {
  height: 0.72cqw;
  border-radius: 0.24cqw;
  background: #edf2f0;
}

.tt-product-demo--apps-v2 .tt-apps-v2-source-rows i:nth-child(2) {
  width: 78%;
}

.tt-product-demo--apps-v2 .tt-apps-v2-source-rows i:nth-child(3) {
  width: 62%;
}

.tt-product-demo--apps-v2 .tt-apps-v2-result {
  margin: 0.72cqw 0.82cqw 0.82cqw;
}

.tt-product-demo--apps-v2 .tt-apps-v2-result strong {
  color: #285d48;
  font-size: clamp(8px, 0.78cqw, 12px);
  font-weight: 650;
}

.tt-product-demo--apps-v2 .tt-apps-v2-result span {
  margin-left: 0.5cqw;
  color: #5d766b;
  font-size: clamp(7px, 0.64cqw, 10px);
}

@media (prefers-reduced-motion: no-preference) {
  .tt-product-demo--work-v2 [data-demo-step],
  .tt-product-demo--apps-v2 [data-demo-step] {
    opacity: 0;
    transform: translate3d(0, 0.42cqw, 0);
  }

  .feat__media.is-demo-active .tt-product-demo--work-v2 [data-demo-step],
  .feat__media.is-demo-active .tt-product-demo--apps-v2 [data-demo-step] {
    animation: tt-work-apps-v2-step-in 560ms cubic-bezier(0.22, 1, 0.36, 1) both;
  }

  .feat__media.is-demo-active .tt-product-demo--work-v2 [data-demo-step='1'],
  .feat__media.is-demo-active .tt-product-demo--apps-v2 [data-demo-step='1'] {
    animation-delay: 180ms;
  }

  .feat__media.is-demo-active .tt-product-demo--work-v2 [data-demo-step='2'],
  .feat__media.is-demo-active .tt-product-demo--apps-v2 [data-demo-step='2'] {
    animation-delay: 480ms;
  }

  .feat__media.is-demo-active .tt-product-demo--work-v2 [data-demo-step='3'],
  .feat__media.is-demo-active .tt-product-demo--apps-v2 [data-demo-step='3'] {
    animation-delay: 820ms;
  }

  .feat__media.is-demo-active .tt-product-demo--work-v2 [data-demo-step='4'],
  .feat__media.is-demo-active .tt-product-demo--apps-v2 [data-demo-step='4'] {
    animation-delay: 1180ms;
  }
}

@media (prefers-reduced-motion: reduce) {
  .tt-product-demo--work-v2 [data-demo-step],
  .tt-product-demo--apps-v2 [data-demo-step] {
    opacity: 1;
    transform: none;
    animation: none;
  }
}

@container (max-width: 760px) {
  .tt-product-demo--work-v2 .tt-work-v2-workspace {
    grid-template-columns: minmax(0, 1fr) 31cqw;
  }

  .tt-product-demo--work-v2 .tt-work-v2-sidebar {
    display: none;
  }

  .tt-product-demo--work-v2 .tt-work-v2-detail {
    display: flex;
  }

  .tt-product-demo--work-v2 .tt-work-v2-main {
    padding-left: 1.4cqw;
  }

  .tt-product-demo--apps-v2 .tt-apps-v2-workspace {
    grid-template-columns: 22cqw minmax(0, 1fr);
  }

  .tt-product-demo--apps-v2 .tt-apps-v2-process-item {
    grid-template-columns: 1.7cqw minmax(0, 1fr);
    min-height: 3.7cqw;
  }

  .tt-product-demo--apps-v2 .tt-apps-v2-app-mark {
    width: 1.7cqw;
    height: 1.7cqw;
  }

  .tt-product-demo--apps-v2 .tt-apps-v2-resource-body {
    grid-template-columns: minmax(0, 1fr) 14cqw;
  }
}

@container (max-width: 480px) {
  .tt-product-demo--work-v2 .tt-work-v2-workspace {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 5.8cqw minmax(0, 1fr) 10.5cqw;
  }

  .tt-product-demo--work-v2 .tt-work-v2-sidebar {
    display: block;
    padding: 0.35cqw 1.2cqw;
    border-right: 0;
    border-bottom: 1px solid var(--tt-work-v2-line);
  }

  .tt-product-demo--work-v2 .tt-work-v2-sidebar__head,
  .tt-product-demo--work-v2 .tt-work-v2-task:not(.is-current) {
    display: none;
  }

  .tt-product-demo--work-v2 .tt-work-v2-task-list {
    margin: 0;
  }

  .tt-product-demo--work-v2 .tt-work-v2-task.is-current {
    min-height: 5cqw;
    padding: 0 0.5cqw;
    background: transparent;
    box-shadow: none;
  }

  .tt-product-demo--work-v2 .tt-work-v2-main {
    gap: 0.24cqw;
    padding: 0.42cqw 1.2cqw 0.36cqw;
  }

  .tt-product-demo--work-v2 .tt-work-v2-main__head,
  .tt-product-demo--work-v2 .tt-work-v2-prompt,
  .tt-product-demo--work-v2 .tt-work-v2-agent-state small {
    display: none;
  }

  .tt-product-demo--work-v2 .tt-work-v2-brief {
    gap: 0;
  }

  .tt-product-demo--work-v2 .tt-work-v2-agent-state > i {
    width: 1.35cqw;
    height: 1.35cqw;
  }

  .tt-product-demo--work-v2 .tt-work-v2-runtime {
    padding: 0.35cqw 0.5cqw;
  }

  .tt-product-demo--work-v2 .tt-work-v2-steps {
    gap: 0;
    margin-top: 0.12cqw;
  }

  .tt-product-demo--work-v2 .tt-work-v2-step {
    min-height: 1.52cqw;
    padding: 0 0.35cqw;
  }

  .tt-product-demo--work-v2 .tt-work-v2-detail {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    padding: 0.6cqw 1.2cqw;
  }

  .tt-product-demo--work-v2 .tt-work-v2-detail__head,
  .tt-product-demo--work-v2 .tt-work-v2-preview {
    display: none;
  }

  .tt-product-demo--work-v2 .tt-work-v2-deliverable,
  .tt-product-demo--work-v2 .tt-work-v2-result {
    min-height: 0;
    margin: 0;
    padding: 0;
  }

  .tt-product-demo--work-v2 .tt-work-v2-deliverable {
    padding-bottom: 1.1cqw;
  }

  .tt-product-demo--apps-v2 .tt-apps-v2-workspace {
    grid-template-columns: minmax(0, 1fr);
  }

  .tt-product-demo--apps-v2 .tt-apps-v2-sidebar {
    position: absolute;
    z-index: 2;
    top: calc(var(--tt-shell-topbar-height, 4.08cqw) + 0.55cqw);
    left: calc(var(--tt-activity-rail-width, 3.72cqw) + 0.55cqw);
    display: block;
    width: 31cqw;
    min-height: 0;
    padding: 0.5cqw 0.62cqw;
    border-radius: 0.62cqw;
    background: rgba(245, 248, 251, 0.92);
  }

  .tt-product-demo--apps-v2 .tt-apps-v2-task-label,
  .tt-product-demo--apps-v2 .tt-apps-v2-process-copy small {
    display: none;
  }

  .tt-product-demo--apps-v2 .tt-apps-v2-task-title {
    overflow: hidden;
    font-size: clamp(7px, 0.78cqw, 10px);
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .tt-product-demo--apps-v2 .tt-apps-v2-process {
    display: grid;
    gap: 0.24cqw;
    margin-top: 0.24cqw;
  }

  .tt-product-demo--apps-v2 .tt-apps-v2-process-item {
    grid-template-columns: 1.45cqw minmax(0, 1fr);
    min-height: 0;
    gap: 0.34cqw;
    padding: 0.22cqw 0.28cqw;
    border-radius: 0.36cqw;
  }

  .tt-product-demo--apps-v2 .tt-apps-v2-app-mark {
    width: 1.45cqw;
    height: 1.45cqw;
    border-radius: 0.34cqw;
    font-size: 7px;
  }

  .tt-product-demo--apps-v2 .tt-apps-v2-app-mark > svg {
    width: 0.82cqw;
    height: 0.82cqw;
  }

  .tt-product-demo--apps-v2 .tt-apps-v2-process-copy strong {
    font-size: 7px;
  }

  .tt-product-demo--apps-v2 .tt-apps-v2-main {
    padding-left: 0;
  }

  .tt-product-demo--apps-v2 .tt-apps-v2-tab {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .tt-product-demo--apps-v2 .tt-apps-v2-resource-body {
    grid-template-columns: minmax(0, 1fr) 20cqw;
  }

  .tt-product-demo--apps-v2 .tt-apps-v2-document {
    padding-top: 1cqw;
  }

  .tt-product-demo--apps-v2 .tt-apps-v2-document h4 {
    max-width: 36cqw;
  }
}

@keyframes tt-work-apps-v2-step-in {
  from {
    opacity: 0;
    transform: translate3d(0, 0.42cqw, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

/* 02 · 一起编辑：复用当前 Electron 壳，并在同一工作面展示表格与文档。 */
#apps .tt-product-demo--apps-current {
  --tt-apps-current-blue: #397bd6;
  --tt-apps-current-green: #35a36d;
  --tt-apps-current-ink: #282d34;
  --tt-apps-current-muted: #7c838c;
  --tt-apps-current-surface: #f5f7fa;
  container-type: inline-size;
  min-height: 0;
  height: 100%;
  aspect-ratio: auto;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  text-align: left;
  user-select: none;
}

.tt-product-demo--apps-current *,
.tt-product-demo--apps-current *::before,
.tt-product-demo--apps-current *::after {
  box-sizing: border-box;
}

#apps .feat__media--shot:has(.tt-product-demo--apps-current) {
  aspect-ratio: 1.62;
  background:
    radial-gradient(circle at 10% 4%, rgba(214, 230, 250, 0.96), transparent 38%),
    radial-gradient(circle at 91% 94%, rgba(244, 225, 204, 0.68), transparent 37%),
    linear-gradient(124deg, #eef4fb 0%, #f6f3ef 58%, #f5f7fa 100%);
}

#apps .feat__media--shot:has(.tt-product-demo--apps-current) .feat__media-art {
  opacity: 0;
}

#apps .feat__media-product:has(> .tt-product-demo--apps-current) {
  width: min(94%, 1220px);
  aspect-ratio: 1.74;
  border: 0;
  border-radius: 1.25cqw;
  box-shadow:
    0 0.18cqw 0.7cqw rgba(45, 58, 77, 0.05),
    0 2.15cqw 5.8cqw rgba(45, 58, 77, 0.14);
}

.tt-product-demo--apps-current .tt-apps-current-body {
  min-height: 0;
  grid-template-columns: 3rem 13.5rem minmax(0, 1fr);
}

.tt-product-demo--apps-current .tt-apps-current-sidebar {
  min-height: 0;
}

.tt-product-demo--apps-current .tt-apps-current-workspace {
  display: grid;
  min-width: 0;
  min-height: 0;
  grid-template-rows: 3.35cqw minmax(0, 1fr);
  padding: 0.48cqw;
  background: var(--tt-apps-current-surface);
}

.tt-product-demo--apps-current .tt-apps-current-header {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 0.72cqw;
  padding: 0 0.82cqw;
  border-radius: 0.68cqw 0.68cqw 0 0;
  background: rgba(255, 255, 255, 0.92);
}

.tt-product-demo--apps-current .tt-apps-current-title {
  display: grid;
  min-width: 0;
}

.tt-product-demo--apps-current .tt-apps-current-title strong {
  overflow: hidden;
  color: var(--tt-apps-current-ink);
  font-size: clamp(8px, 0.84cqw, 12px);
  font-weight: 650;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.tt-product-demo--apps-current .tt-apps-current-title small {
  overflow: hidden;
  color: var(--tt-apps-current-muted);
  font-size: clamp(6px, 0.58cqw, 9px);
  white-space: nowrap;
  text-overflow: ellipsis;
}

.tt-product-demo--apps-current .tt-apps-current-sync {
  display: flex;
  margin-left: auto;
  align-items: center;
  gap: 0.34cqw;
  color: #4c856e;
  font-size: clamp(6px, 0.6cqw, 9px);
  white-space: nowrap;
}

.tt-product-demo--apps-current .tt-apps-current-sync > i {
  width: 0.42cqw;
  height: 0.42cqw;
  border-radius: 50%;
  background: var(--tt-apps-current-green);
}

.tt-product-demo--apps-current .tt-apps-current-people {
  display: flex;
  align-items: center;
  padding-left: 0.26cqw;
}

.tt-product-demo--apps-current .tt-apps-current-people > i {
  display: grid;
  width: 1.45cqw;
  height: 1.45cqw;
  margin-left: -0.26cqw;
  place-items: center;
  border: 0.1cqw solid #fff;
  border-radius: 50%;
  background: #dfe9f6;
  color: #59708c;
  font-size: clamp(5px, 0.52cqw, 8px);
  font-style: normal;
  font-weight: 650;
}

.tt-product-demo--apps-current .tt-apps-current-people > i:nth-child(2) {
  background: #f0e3d3;
  color: #80684f;
}

.tt-product-demo--apps-current .tt-apps-current-people > small {
  margin-left: 0.38cqw;
  color: var(--tt-apps-current-muted);
  font-size: clamp(6px, 0.56cqw, 8px);
  white-space: nowrap;
}

.tt-product-demo--apps-current .tt-apps-current-surfaces {
  display: grid;
  min-width: 0;
  min-height: 0;
  grid-template-columns: minmax(0, 43%) minmax(0, 57%);
  gap: 0.48cqw;
}

.tt-product-demo--apps-current .tt-apps-current-data,
.tt-product-demo--apps-current .tt-apps-current-doc {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  background: #fff;
}

.tt-product-demo--apps-current .tt-apps-current-data {
  border-radius: 0 0 0 0.68cqw;
}

.tt-product-demo--apps-current .tt-apps-current-doc {
  border-radius: 0 0 0.68cqw 0;
}

.tt-product-demo--apps-current .tt-apps-current-surface-head {
  display: flex;
  min-width: 0;
  height: 3.3cqw;
  align-items: center;
  gap: 0.54cqw;
  padding: 0 0.72cqw;
  background: #fbfcfd;
}

.tt-product-demo--apps-current .tt-apps-current-app-icon {
  display: grid;
  width: 1.55cqw;
  height: 1.55cqw;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 0.42cqw;
  background: #eaf2fd;
  color: #397bd6;
  font-size: clamp(7px, 0.68cqw, 10px);
  font-weight: 650;
}

.tt-product-demo--apps-current .tt-apps-current-app-icon.is-data {
  background: #e8f4ef;
  color: #3d8e6b;
}

.tt-product-demo--apps-current .tt-apps-current-surface-head > span:nth-child(2) {
  display: grid;
  min-width: 0;
}

.tt-product-demo--apps-current .tt-apps-current-surface-head strong {
  color: #343b44;
  font-size: clamp(7px, 0.74cqw, 11px);
  font-weight: 650;
}

.tt-product-demo--apps-current .tt-apps-current-surface-head small {
  color: #8a929c;
  font-size: clamp(6px, 0.56cqw, 8px);
}

.tt-product-demo--apps-current .tt-apps-current-surface-head > b {
  margin-left: auto;
  padding: 0.3cqw 0.55cqw;
  border-radius: 0.4cqw;
  background: #f1f4f7;
  color: #78818b;
  font-size: clamp(6px, 0.56cqw, 8px);
  font-weight: 550;
  white-space: nowrap;
}

.tt-product-demo--apps-current .tt-apps-current-table-tools {
  display: flex;
  height: 2.25cqw;
  align-items: center;
  gap: 0.36cqw;
  padding: 0 0.62cqw;
  color: #737d87;
  font-size: clamp(6px, 0.57cqw, 8px);
}

.tt-product-demo--apps-current .tt-apps-current-table-tools > span {
  padding: 0.24cqw 0.44cqw;
  border-radius: 0.34cqw;
  background: #f3f5f7;
}

.tt-product-demo--apps-current .tt-apps-current-table-tools > span:first-child {
  background: #eaf4ef;
  color: #367f5f;
}

.tt-product-demo--apps-current .tt-apps-current-table-tools > small {
  margin-left: auto;
  color: #4d779f;
}

.tt-product-demo--apps-current .tt-apps-current-table {
  display: grid;
  gap: 0.16cqw;
  padding: 0.2cqw 0.52cqw 0.72cqw;
}

.tt-product-demo--apps-current .tt-apps-current-row {
  display: grid;
  min-width: 0;
  height: 2.15cqw;
  grid-template-columns: 1.45fr 1.1fr 0.8fr 0.5fr;
  align-items: center;
  border-radius: 0.34cqw;
  color: #606a75;
  font-size: clamp(6px, 0.61cqw, 9px);
}

.tt-product-demo--apps-current .tt-apps-current-row > span {
  min-width: 0;
  overflow: hidden;
  padding: 0 0.42cqw;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.tt-product-demo--apps-current .tt-apps-current-row.is-head {
  height: 1.8cqw;
  background: #f3f5f7;
  color: #8b939c;
  font-size: clamp(5px, 0.55cqw, 8px);
  font-weight: 600;
}

.tt-product-demo--apps-current .tt-apps-current-row.is-selected {
  background: #edf4fd;
  color: #3f5f84;
}

.tt-product-demo--apps-current .tt-apps-current-row span:first-child {
  display: flex;
  align-items: center;
  gap: 0.34cqw;
}

.tt-product-demo--apps-current .tt-apps-current-row span:first-child > i {
  width: 0.62cqw;
  height: 0.62cqw;
  flex: 0 0 auto;
  border-radius: 0.18cqw;
  background: #82a7db;
}

.tt-product-demo--apps-current .tt-apps-current-row span:first-child > i.is-green { background: #71b69a; }
.tt-product-demo--apps-current .tt-apps-current-row span:first-child > i.is-orange { background: #e4a06f; }
.tt-product-demo--apps-current .tt-apps-current-row span:first-child > i.is-violet { background: #9d8dc8; }
.tt-product-demo--apps-current .tt-apps-current-row span:first-child > i.is-cyan { background: #65b4c0; }

.tt-product-demo--apps-current .tt-apps-current-row em {
  padding: 0.18cqw 0.4cqw;
  border-radius: 999px;
  background: #eef2f5;
  color: #6d7781;
  font-size: clamp(5px, 0.53cqw, 8px);
  font-style: normal;
}

.tt-product-demo--apps-current .tt-apps-current-doc-tools {
  display: flex;
  height: 2.25cqw;
  align-items: center;
  gap: 0.14cqw;
  padding: 0 0.68cqw;
  color: #6c747e;
}

.tt-product-demo--apps-current .tt-apps-current-doc-tools > span {
  display: grid;
  min-width: 1.35cqw;
  height: 1.35cqw;
  place-items: center;
  border-radius: 0.32cqw;
  font-size: clamp(6px, 0.6cqw, 9px);
  font-weight: 600;
}

.tt-product-demo--apps-current .tt-apps-current-doc-tools > span:nth-child(4) {
  width: auto;
  padding: 0 0.42cqw;
  background: #f2f4f6;
  font-weight: 500;
}

.tt-product-demo--apps-current .tt-apps-current-doc-tools > small {
  margin-left: auto;
}

.tt-product-demo--apps-current .tt-apps-current-paper {
  position: relative;
  min-height: 0;
  height: calc(100% - 6.25cqw);
  margin: 0 0.7cqw 0.7cqw;
  padding: 1.05cqw 1.3cqw;
  border-radius: 0.58cqw;
  background: #fafbfc;
}

.tt-product-demo--apps-current .tt-apps-current-kicker {
  color: #4b82c9;
  font-size: clamp(5px, 0.54cqw, 8px);
  font-weight: 650;
  letter-spacing: 0.08em;
}

.tt-product-demo--apps-current .tt-apps-current-paper h4 {
  max-width: 31cqw;
  margin: 0.38cqw 0 0;
  color: var(--tt-apps-current-ink);
  font-size: clamp(10px, 1.15cqw, 17px);
  font-weight: 650;
  line-height: 1.28;
}

.tt-product-demo--apps-current .tt-apps-current-paper > p {
  max-width: 34cqw;
  margin: 0.62cqw 0 0;
  color: #68727d;
  font-size: clamp(6px, 0.66cqw, 10px);
  line-height: 1.55;
}

.tt-product-demo--apps-current .tt-apps-current-reference {
  display: grid;
  max-width: 31cqw;
  grid-template-columns: 1.55cqw minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.54cqw;
  margin-top: 0.78cqw;
  padding: 0.58cqw 0.66cqw;
  border-radius: 0.5cqw;
  background: #eef5f2;
}

.tt-product-demo--apps-current .tt-apps-current-reference > span:nth-child(2) {
  display: grid;
  min-width: 0;
}

.tt-product-demo--apps-current .tt-apps-current-reference strong {
  color: #3c6556;
  font-size: clamp(6px, 0.64cqw, 9px);
}

.tt-product-demo--apps-current .tt-apps-current-reference small {
  color: #779086;
  font-size: clamp(5px, 0.54cqw, 8px);
}

.tt-product-demo--apps-current .tt-apps-current-reference > b {
  color: #357a5c;
  font-size: clamp(8px, 0.86cqw, 12px);
  font-weight: 650;
}

.tt-product-demo--apps-current .tt-apps-current-paper h5 {
  margin: 0.85cqw 0 0;
  color: #3e4853;
  font-size: clamp(7px, 0.72cqw, 10px);
}

.tt-product-demo--apps-current .tt-apps-current-paper ul {
  display: grid;
  gap: 0.28cqw;
  margin: 0.45cqw 0 0;
  padding: 0;
  list-style: none;
}

.tt-product-demo--apps-current .tt-apps-current-paper li {
  display: grid;
  grid-template-columns: 0.38cqw minmax(0, 1fr);
  gap: 0.42cqw;
  color: #69737e;
  font-size: clamp(6px, 0.62cqw, 9px);
  line-height: 1.45;
}

.tt-product-demo--apps-current .tt-apps-current-paper li::before {
  content: '';
  width: 0.3cqw;
  height: 0.3cqw;
  margin-top: 0.52em;
  border-radius: 50%;
  background: #82a7d8;
}

.tt-product-demo--apps-current .tt-apps-current-caret {
  position: absolute;
  right: 1.05cqw;
  bottom: 1cqw;
  width: 0.12cqw;
  height: 1.35cqw;
  background: #397bd6;
}

.tt-product-demo--apps-current .tt-apps-current-caret > i {
  position: absolute;
  right: 0;
  bottom: 100%;
  padding: 0.2cqw 0.36cqw;
  border-radius: 0.28cqw 0.28cqw 0 0.28cqw;
  background: #397bd6;
  color: #fff;
  font-size: clamp(5px, 0.5cqw, 7px);
  font-style: normal;
}

@container (max-width: 760px) {
  .tt-product-demo--apps-current .tt-apps-current-body {
    grid-template-columns: 3rem 11.5rem minmax(0, 1fr);
  }

  .tt-product-demo--apps-current .tt-apps-current-surfaces {
    grid-template-columns: 45% 55%;
  }

  .tt-product-demo--apps-current .tt-apps-current-people > small {
    display: none;
  }
}

@container (max-width: 560px) {
  .tt-product-demo--apps-current .tt-apps-current-body {
    grid-template-columns: 2.7rem minmax(0, 1fr);
  }

  .tt-product-demo--apps-current .electron-showcase__sidebar {
    display: none;
  }

  .tt-product-demo--apps-current .tt-apps-current-sync {
    margin-left: auto;
  }

  .tt-product-demo--apps-current .tt-apps-current-title small,
  .tt-product-demo--apps-current .tt-apps-current-people {
    display: none;
  }
}