/* 写信页局部视觉优化：保留原有快速/深度解读功能与 React 交互。 */
.letter-workbench {
  --letter-control-line: #cfd6cd;
  --letter-control-paper: rgba(255, 255, 255, 0.42);
  --letter-control-active: #edf1e7;
  align-self: start;
  min-width: 0;
}

.letter-workbench .letter-mode-switch {
  gap: 10px;
  border: 0;
  background: transparent;
}

.letter-workbench .letter-mode-switch button {
  position: relative;
  min-width: 0;
  min-height: 84px;
  padding: 17px 20px 15px;
  border: 1px solid var(--letter-control-line);
  background: var(--letter-control-paper);
  color: var(--letter-muted);
  text-align: left;
  transition: border-color 0.18s ease, background-color 0.18s ease,
    color 0.18s ease;
}

.letter-workbench .letter-mode-switch button:last-child {
  border-right: 1px solid var(--letter-control-line);
}

.letter-workbench .letter-mode-switch button::after {
  display: block;
  margin-top: 8px;
  color: var(--letter-muted);
  font-size: 11px;
  font-weight: 400;
  line-height: 1.45;
}

.letter-workbench .letter-mode-switch button:first-child::after {
  content: "直接进入七轮选卡";
}

.letter-workbench .letter-mode-switch button:last-child::after {
  content: "先通过对话问清背景";
}

.letter-workbench .letter-mode-switch button:hover {
  border-color: #aeb9aa;
  color: var(--letter-ink);
}

.letter-workbench .letter-mode-switch button.is-active {
  border-color: var(--letter-sage);
  background: var(--letter-control-active);
  color: var(--letter-sage);
  box-shadow: inset 0 -3px var(--letter-sage);
}

.letter-workbench .letter-mode-switch strong {
  display: block;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
}

.letter-workbench .letter-form {
  padding-top: 30px;
}

.letter-workbench .letter-form label {
  margin-bottom: 12px;
  color: var(--letter-ink);
  font-size: 13px;
  letter-spacing: 0.02em;
}

.letter-workbench .letter-form textarea {
  min-height: 248px;
  padding: 21px 22px;
  border-color: #aeb6aa;
  background: rgba(255, 255, 255, 0.5);
  line-height: 1.8;
}

.letter-workbench .letter-form textarea:hover {
  border-color: #8f9b8c;
}

.letter-workbench .letter-counter {
  margin: 9px 0 22px;
  color: #737b72;
  font-variant-numeric: tabular-nums;
}

.letter-workbench .letter-primary {
  min-width: 168px;
  min-height: 52px;
  padding: 0 28px;
  font-size: 14px;
}

.letter-workbench .letter-status {
  margin-top: 11px;
}

@media (max-width: 760px) {
  .letter-workbench .letter-mode-switch {
    gap: 8px;
  }

  .letter-workbench .letter-mode-switch button {
    min-height: 80px;
    padding: 14px 13px 13px;
  }

  .letter-workbench .letter-mode-switch button::after {
    margin-top: 6px;
    font-size: 10px;
  }

  .letter-workbench .letter-mode-switch strong {
    font-size: 14px;
  }

  .letter-workbench .letter-form {
    padding-top: 26px;
  }

  .letter-workbench .letter-form textarea {
    width: 100%;
    min-height: 220px;
    height: 220px;
    padding: 18px;
  }

  .letter-workbench .letter-counter {
    margin-bottom: 18px;
  }

  .letter-workbench .letter-primary {
    width: 100%;
    min-width: 0;
    min-height: 52px;
  }
}

@media (max-width: 359px) {
  .letter-workbench .letter-mode-switch {
    grid-template-columns: 1fr;
  }

  .letter-workbench .letter-mode-switch button {
    min-height: 68px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .letter-workbench .letter-mode-switch button {
    transition: none;
  }
}

/* 回信结果只呈现用户内容，不展示模式、判断结构和系统边界小字。 */
.letter-result > header .letter-result-mode,
.letter-result .letter-boundary,
.letter-result .letter-structure,
.letter-result .letter-follow-answer small,
.letter-result .letter-feedback > div:first-child p,
.letter-result .letter-trace {
  display: none !important;
}

.letter-result .letter-body {
  margin-bottom: 44px;
}

.letter-result .letter-follow-answer {
  padding-bottom: 6px;
}

@media (max-width: 760px) {
  .letter-result .letter-body {
    margin-bottom: 32px;
  }
}
