/* KeyCreator · 底部动作条按钮重画
   ------------------------------------------------------------------
   只作用于底部 publish-row 里的 #continueCreator（"进入原创作台继续编辑"）。
   .ghost 是公共基类（全站 5 处复用），本文件不改基类，避免波及其他按钮。
   独立文件，单独下线即可还原旧观感。

   旧观感的三处问题：
     1. .ghost 的 padding 是 0 15px，没有垂直内边距 → 按钮只有 24px 高，
        而旁边主按钮约 46px，并排高度差一倍。
     2. .publish-row 的按钮容器是 display:block，没有 gap → 两个按钮边框贴死。
     3. 白底 + 细粉边 + 14px/400 常规字重 + 无图标 → 没有"可点"的实体感。
   本文件按"次要但实体化、与主按钮等高"的目标重画。
   ------------------------------------------------------------------ */

/* 1. 按钮组：等高 + 留出间距，让两个按钮成为整齐的一组 */
.publish-row > div {
  display: flex;
  align-items: stretch;
  gap: 12px;
}

.publish-row > div > .primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 0 24px;
}

/* 2. 主视觉：白底实体按钮 + 左侧铅笔图标底片，红色系沿用小站主色 */
.publish-row #continueCreator.ghost {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 46px;
  padding: 0 19px 0 12px;
  border: 1.5px solid #ffccd5;
  border-radius: 12px;
  background: #fff;
  color: #ff2442;
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: .2px;
  white-space: nowrap;
  box-shadow: 0 1px 2px rgba(255, 36, 66, .05);
  transition: border-color .2s ease, background .2s ease,
              box-shadow .22s ease, transform .18s ease;
}

/* 图标底片：给它一个视觉锚点，也让"编辑"语义一眼可见 */
.publish-row #continueCreator .kc-continue-icon {
  display: grid;
  place-items: center;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  border-radius: 8px;
  background: #fff0f2;
  color: #ff2442;
  font-size: 0;
  line-height: 0;
  transition: background .2s ease, color .2s ease, box-shadow .2s ease;
}

.publish-row #continueCreator .kc-continue-icon svg {
  display: block;
}

/* 3. 交互反馈：上浮 + 描边加深 + 红晕，图标底片翻成红渐变 */
.publish-row #continueCreator:hover {
  border-color: #ff9dab;
  background: #fffafb;
  box-shadow: 0 8px 20px rgba(255, 36, 66, .15);
  transform: translateY(-1px);
}

.publish-row #continueCreator:hover .kc-continue-icon {
  background: linear-gradient(115deg, #ff2e51, #ff785d);
  color: #fff;
  box-shadow: 0 3px 10px rgba(255, 46, 81, .32);
}

.publish-row #continueCreator:active {
  transform: translateY(0);
  border-color: #ff8b9c;
  box-shadow: 0 2px 8px rgba(255, 36, 66, .14);
}

.publish-row #continueCreator:focus-visible {
  outline: none;
  border-color: #ff6b80;
  box-shadow: 0 0 0 3px rgba(255, 36, 66, .18);
}

/* 4. 窄屏：动作条改为纵向铺满，主按钮留在最下方（拇指区） */
@media (max-width: 640px) {
  .publish-row {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }

  .publish-row > div {
    flex-direction: column;
    gap: 10px;
  }

  .publish-row #continueCreator.ghost,
  .publish-row > div > .primary {
    width: 100%;
    justify-content: center;
  }
}

/* 5. 尊重系统减弱动效设置 */
@media (prefers-reduced-motion: reduce) {
  .publish-row #continueCreator,
  .publish-row #continueCreator .kc-continue-icon {
    transition: none;
  }

  .publish-row #continueCreator:hover {
    transform: none;
  }
}