.independent-survey {
  font-family: 'Segoe UI', 'Microsoft YaHei', sans-serif;
}
.independent-survey .top-content { gap: 12px; }
.independent-survey .top-actions { gap: 9px; }
.independent-survey h1 small { color: var(--muted); font: 600 .43em/1.2 'Segoe UI', sans-serif; white-space: nowrap; }
.independent-survey [aria-pressed='true'].survey-option { color: var(--accent); border-color: #7da797; background: var(--pale); }
.independent-survey .step-nav button[aria-current='false'] { color: var(--ink); background: #f8faf8; box-shadow: none; }
html[lang='zh-CN'] .independent-survey h1,
html[lang='zh-CN'] .independent-survey .score-header h2 {
  font-family: 'Microsoft YaHei', 'PingFang SC', 'Noto Sans CJK SC', sans-serif;
  font-weight: 600;
  letter-spacing: 0;
}
.language-label { color: var(--muted); font-size: .87rem; }
.independent-survey input[type='number'],
.independent-survey select {
  min-height: 34px;
  background: #fff;
  border: 1px solid var(--line);
  padding: 4px 8px;
  border-radius: 6px;
  color: var(--ink);
}
.survey-card { width: min(690px, 100%); margin: clamp(24px, 6vw, 76px) auto 0; padding: clamp(18px, 4vw, 36px); }
.survey-card p { margin-top: 11px; max-width: 64ch; color: var(--muted); }
.survey-card .actions { margin-top: 19px; }
.survey-card details { margin-top: 20px; }
.survey-card ul { padding-inline-start: 22px; }
.survey-card .survey-response-panel textarea { width: 100%; margin-top: 8px; font: 16px/1.4 monospace; }
.survey-card .survey-response-panel .actions { margin-top: 8px; }
.survey-card .survey-response-panel [role='status']:empty { display: none; }
.survey-card li > .actions { margin-top: 4px; margin-bottom: 8px; }
.survey-copy-panel textarea { user-select: text; -webkit-user-select: text; }
.survey-profile { display: flex; flex-wrap: wrap; gap: 12px; margin: 19px 0 0; border: 1px solid var(--line); border-radius: 8px; padding: 10px 13px; }
.survey-profile legend { font-weight: 600; padding: 0 4px; }
.survey-profile label { display: grid; gap: 4px; font-size: .87rem; }
.survey-profile label > input { width: min(180px, 65vw); }
.survey-example-tags, .survey-options { margin-top: 13px; }
.independent-survey .tag.borderline {
  border-color: #c8a361;
  background: #fff5df;
  color: #634716;
}
.score .voice-labels { pointer-events: none; }
.score .voice-labels rect { fill: white; }
.score .voice-labels rect, .score .voice-labels line {
  stroke: currentColor;
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}
.score .voice-labels line { opacity: .75; }
.score .voice-labels text {
  fill: currentColor;
  text-anchor: middle;
  dominant-baseline: central;
  font: 700 var(--label-size) 'Segoe UI', sans-serif;
}
.review-body .survey-reason { margin-top: 13px; color: var(--ink); }
.survey-new-layer {
  padding: 9px;
  border: 1px dashed #7da797;
  border-radius: 7px;
  background: #fcfdfc;
  color: var(--accent);
  font-size: .87rem;
}
.survey-new-layer:hover, .survey-drop-active { background: var(--pale); }
.survey-new-layer small { display: block; margin-top: 2px; color: var(--muted); }
.survey-drop-active { outline: 2px solid var(--accent); }
.independent-survey [data-drag-voice] {
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}
.survey-touch-drag {
  position: fixed;
  z-index: 20;
  pointer-events: none;
  transform: translate(-50%, calc(-100% - 8px));
  padding: 5px 9px;
  border-radius: 6px;
  background: var(--accent);
  color: #fff;
  font-size: .85rem;
  font-weight: 650;
}
.independent-survey .unassigned { border-style: dashed; }
.independent-survey .layer-head button.layer-id { padding: 2px 6px; border-radius: 4px; color: var(--accent); background: var(--pale); }
.survey-role-help { margin-top: 12px; font-size: .87rem; }
.survey-role-help dt { font-weight: 650; }
.survey-role-help dd { margin: 1px 0 6px; color: var(--muted); }
.survey-role-select { display: flex; justify-content: space-between; gap: 10px; align-items: center; padding: 0 7px 5px; font-size: .86rem; }
.survey-pilot-review { margin-top: 16px; }
.survey-pilot-review p { margin: 0 5px 9px; font-size: .86rem; }
.survey-pilot-review .survey-role-select { flex-wrap: wrap; }
.survey-pilot-review select { max-width: 100%; }
.survey-comment { display: block; margin-top: 14px; font-size: .87rem; font-weight: 600; }
.survey-comment textarea { font-weight: 400; }
.review-body .survey-error { margin-top: 8px; color: var(--danger); }
.survey-error:empty { display: none; }
.survey-error + .review-actions { margin-top: 13px; }
#survey-help {
  position: fixed;
  z-index: 10;
  width: min(340px, calc(100vw - 16px));
  max-height: calc(100dvh - 16px);
  overflow: auto;
  padding: 10px 12px;
  border: 1px solid #aac0b4;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 6px 20px #10272226;
  font-size: .84rem;
}
#survey-help p, #survey-help figcaption { color: var(--muted); }
#survey-help .survey-example-note { margin-top: 7px; font-size: .79rem; }
#survey-help .survey-tag-judgments { margin-top: 8px; }
#survey-help .survey-tag-judgments [aria-pressed='true'] { border-color: #7da797; background: var(--pale); }
#survey-help figure { margin: 6px 0 0; border-top: 1px solid var(--line); }
#survey-help svg { display: block; width: 100%; height: auto; }
#survey-help figcaption { font-size: .79rem; }
#survey-help[data-kind='tag'] {
  width: min(450px, calc(100vw - 24px));
  overscroll-behavior: contain;
}
#survey-help[data-touch='true'] {
  right: 12px;
  bottom: max(12px, env(safe-area-inset-bottom));
  top: auto;
  max-height: min(65dvh, 540px);
  touch-action: pan-y;
  -webkit-touch-callout: none;
}
#survey-help .survey-tag-header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
#survey-help[data-touch='true'] button { min-height: 44px; }
#survey-help[data-touch='true'] .survey-tag-judgments { justify-content: flex-start; }
@media (max-width: 550px) {
  .independent-survey .step-nav button { min-height: 44px; }
  .independent-survey .language-label { display: none; }
  .independent-survey .score-header { flex-wrap: wrap; }
  .independent-survey .score svg { min-width: min(100%, 340px); }
}