/* 发卷页是一个明确的四步工作流：浅灰蓝工作区托起白卡片，不抢走表单本身的注意力。 */
#page-host.survey-builder {
  max-width: 896px;
  margin: 0 auto;
  padding: clamp(22px, 3vw, 36px);
  border: 1px solid #E7EDF6;
  border-radius: 28px;
  background: radial-gradient(circle at 8% 0, #FFF 0, #F5F7FA 45%, #EEF3FA 100%);
}

#page-host.survey-builder > .card {
  padding: clamp(24px, 4vw, 36px);
  border-color: rgba(15, 23, 42, .06);
  border-radius: 18px;
  box-shadow: 0 4px 24px rgba(15, 23, 42, .055);
}

#page-host.survey-builder > .card + .card { margin-top: 22px; }
#page-host.survey-builder .card__title { font-size: 20px; }
#page-host.survey-builder .field__hint { color: #52627C; line-height: 1.65; }

/* 顶部小步骤条让用户看到完整路径，但不用重型的“项目管理”式进度组件。 */
#page-host.survey-builder .builder-stepper {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  margin: 0 6px 26px;
}
#page-host.survey-builder .builder-stepper__item {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: #667085;
  font-size: 13px;
  font-weight: 650;
}
#page-host.survey-builder .builder-stepper__item:not(:last-child)::after {
  content: '';
  position: absolute;
  left: 30px;
  right: 8px;
  top: 13px;
  height: 1px;
  background: #CAD7E8;
}
#page-host.survey-builder .builder-stepper__no {
  position: relative;
  z-index: 1;
  display: inline-grid;
  place-items: center;
  width: 27px;
  height: 27px;
  flex: 0 0 27px;
  border-radius: 50%;
  background: #E7F0FF;
  color: #1769E0;
  font-size: 12px;
  font-weight: 800;
}
#page-host.survey-builder .builder-stepper__label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 信息输入区：较清楚的边界，键盘焦点有不依赖颜色的外圈。 */
#page-host.survey-builder .input,
#page-host.survey-builder .textarea {
  min-height: 44px;
  padding: 11px 14px;
  border-color: #E0E7F0;
  background: #FBFCFE;
  border-radius: 10px;
}
#page-host.survey-builder .input:hover,
#page-host.survey-builder .textarea:hover { border-color: #7894BA; }
#page-host.survey-builder .input:focus,
#page-host.survey-builder .textarea:focus {
  border-color: #1769E0;
  box-shadow: 0 0 0 4px rgba(23, 105, 224, .16);
  outline: 0;
}

/* 新建题目都使用轻量浅色底，悬停时变深；避免一排硬边框造成“工具面板”感。 */
#page-host.survey-builder .builder-add-btn {
  border-color: transparent;
  background: #EDF4FF;
  color: #173B72;
}
#page-host.survey-builder .builder-add-btn:hover {
  background: #DCEBFF;
  border-color: transparent;
  color: #0D47A1;
}
#page-host.survey-builder .builder-add-btn--identity {
  background: #F1F5FB;
  color: #334155;
}
#page-host.survey-builder .builder-add-btn--identity:hover {
  background: #E3ECF8;
  border-color: transparent;
  color: #173B72;
}

/* “复制已有问卷”是次级路径，用分隔线明确从新增题目操作中退出。 */
#page-host.survey-builder .builder-reuse {
  margin-top: 30px;
  padding-top: 26px;
  border-top: 1px solid #E5EAF1;
}
#page-host.survey-builder .builder-reuse .import-inline {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

/* 模板与导入就是“题目”这一环的快捷入口，紧贴第 2 步标题。 */
#page-host.survey-builder .builder-quick-import {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin-left: auto;
}
#page-host.survey-builder .builder-quick-import .btn { min-height: 34px; font-size: 13px; }

/* 分段控件：按钮组语义仍是 radio，视觉上只突出当前的保留期限。 */
#page-host.survey-builder .retention-segment {
  display: inline-flex;
  padding: 4px;
  gap: 3px;
  border: 1px solid #C7D3E4;
  border-radius: 999px;
  background: #F1F5FA;
}
#page-host.survey-builder .retention-segment__option {
  min-height: 36px;
  padding: 0 16px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #52627C;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}
#page-host.survey-builder .retention-segment__option:hover { background: #E1EAF6; color: #173B72; }
#page-host.survey-builder .retention-segment__option.is-active { background: #1769E0; color: #FFF; box-shadow: 0 3px 8px rgba(23, 105, 224, .25); }

/* 两种入口保持同一种端到端加密，只把“是否追加口令”说清楚。 */
#page-host.survey-builder .access-mode {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
#page-host.survey-builder .access-mode__option {
  min-height: 78px;
  padding: 14px;
  border: 1px solid #B8C6DA;
  border-radius: 14px;
  background: #FBFCFE;
  color: #52627C;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
#page-host.survey-builder .access-mode__option:hover { border-color: #1769E0; background: #F2F7FF; }
#page-host.survey-builder .access-mode__option strong,
#page-host.survey-builder .access-mode__option span { display: block; }
#page-host.survey-builder .access-mode__option strong { color: #173B72; font-size: 15px; }
#page-host.survey-builder .access-mode__option span { margin-top: 2px; font-size: 13px; }
#page-host.survey-builder .access-mode__option.is-active {
  border: 2px solid #1769E0;
  padding: 13px;
  background: #EAF2FF;
  box-shadow: 0 0 0 3px rgba(23, 105, 224, .12);
}

/* 发布是唯一的完成动作，尺寸和阴影只给它，不让导出抢走焦点。 */
#page-host.survey-builder .builder-publish-btn {
  min-height: 54px;
  padding: 0 26px;
  font-size: 17px;
  font-weight: 750;
  box-shadow: 0 8px 18px rgba(23, 105, 224, .28);
}
#page-host.survey-builder .builder-publish-btn:hover { box-shadow: 0 13px 26px rgba(13, 71, 161, .38); }
#page-host.survey-builder .builder-export-btn { color: #52627C; }

/* 导入、钥匙这类辅助操作淡化成文字按钮，主流程不会被它们分散注意。 */
#page-host.survey-builder .builder-reuse .card__actions .btn:not(.btn--primary) {
  min-height: 36px;
  padding: 0 4px;
  border-color: transparent;
  background: transparent;
  color: #52627C;
  font-size: 13px;
}
#page-host.survey-builder .builder-reuse .card__actions .btn:not(.btn--primary):hover {
  color: #1769E0;
  text-decoration: underline;
}

/* 页脚里的“邮箱：地址”作为一个句子排在同一行。 */
.site-footer__email .site-footer__mail {
  display: inline;
  margin: 0 0 0 4px;
}

/* 深蓝页脚内的站内链接必须使用浅色，避免默认链接蓝被背景吞掉。 */
.site-footer__note a {
  color: #D6E5FF;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.site-footer__note a:hover { color: #FFF; }

@media (max-width: 600px) {
  #page-host.survey-builder { margin: 0 calc(var(--page-pad) * -1); border-radius: 0; padding: 20px var(--page-pad) 28px; }
  #page-host.survey-builder > .card { padding: 22px 18px; }
  #page-host.survey-builder .builder-stepper { margin: 0 0 20px; }
  #page-host.survey-builder .builder-stepper__label { display: none; }
  #page-host.survey-builder .builder-stepper__item { justify-content: space-between; }
  #page-host.survey-builder .builder-stepper__item:not(:last-child)::after { right: 5px; }
  #page-host.survey-builder .builder-publish-btn { width: 100%; }
  #page-host.survey-builder .builder-export-btn { width: 100%; }
  #page-host.survey-builder .retention-segment { display: flex; width: 100%; }
  #page-host.survey-builder .retention-segment__option { flex: 1; padding: 0 8px; }
  #page-host.survey-builder .access-mode { grid-template-columns: 1fr; }
  #page-host.survey-builder .builder-quick-import { width: 100%; margin-left: 0; }
}