/* Extracted from index.html. Growth handbook, learning center editor, survey admin UI, TOC, and history dock styles. */

#ai-handbook {
  padding: 0;
  margin-top: -16px;
  background: #fff;
  isolation: isolate;
}
:root {
  /* 自主学习中心：主列宽与 .container 内容区一致（宽屏下 container 1280 含左右 20px padding → 内宽 1240），避免 1280 子块撑破父级导致视觉偏右 */
  --growth-center-inner-width: 1040px;
}
.handbook-home-layout {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  margin: 0;
  position: relative;
  padding: 32px 0 28px;
  --handbook-hero-overlay-height: 220px;
  /* 背景走通栏 ::before（与正文区一致），不要用 overflow:hidden 裁切宽幅光斑 */
  background: transparent;
}
.handbook-home-layout::before {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100vw + 100px);
  top: -6px;
  height: var(--handbook-hero-overlay-height);
  z-index: 2;
  pointer-events: none;
  background-image: url("/photos/macos-tahoe-26-bai.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
/* 须高于 .panel h2（28px），否则字号被覆盖 */
#ai-handbook.panel h2.handbook-home-title {
  margin: 10px auto 8px;
  max-width: var(--growth-center-inner-width);
  width: 100%;
  box-sizing: border-box;
  font-size: 48px;
  line-height: 1.08;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #1d1d1f;
  position: relative;
  z-index: 3;
}
.handbook-home-top {
  display: flex;
  justify-content: flex-start;
  gap: 30px;
  max-width: var(--growth-center-inner-width);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
  padding: 8px 0 10px;
  border-radius: 0;
  background: transparent;
  align-items: flex-start;
  position: relative;
  z-index: 3;
}
.handbook-home-tab {
  padding: 2px 0 10px;
  border: 0;
  background: transparent;
  color: #1d1d1f;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.2;
  cursor: pointer;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  opacity: 0.68;
  transform: scale(1);
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.handbook-home-tab:hover {
  opacity: 1;
  transform: scale(1.05);
}
.handbook-home-tab-icon {
  width: 30px;
  height: 30px;
  display: block;
  color: #1d1d1f;
}
.handbook-home-tab-icon svg {
  width: 100%;
  height: 100%;
  display: block;
}
.handbook-home-tab.is-active {
  border-bottom: 0;
  opacity: 1;
  transform: scale(1.05);
}
.handbook-home-tab-label {
  display: inline-block;
  padding-bottom: 2px;
  position: relative;
}
.handbook-home-tab-label::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 2px;
  bottom: -8px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 0.22s ease;
}
.handbook-home-tab.is-active > .handbook-home-tab-label::after,
.handbook-home-tab.is-active > .handbook-home-tab-main > .handbook-home-tab-label::after {
  transform: scaleX(1);
}
.handbook-home-tab--learn {
  flex-direction: row;
  align-items: flex-start;
  gap: 0;
  overflow: hidden;
  padding-right: 0;
  transform-origin: left center;
  transition: gap 0.42s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.2s ease;
}
.handbook-home-tab-main {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  min-width: 54px;
  transform-origin: center;
  transition: transform 0.2s ease;
}
.handbook-home-tab--learn.is-active {
  transform: none;
}
.handbook-home-tab--learn.is-active .handbook-home-tab-main {
  transform: scale(1.05);
}
.handbook-home-learn-expand {
  display: inline-flex;
  align-items: flex-start;
  gap: 30px;
  max-width: 0;
  opacity: 0;
  transform: translateX(-4px);
  margin-top: -2px;
  overflow: hidden;
  white-space: nowrap;
  pointer-events: none;
  visibility: hidden;
  will-change: max-width, opacity, transform;
  transition:
    max-width 0.42s cubic-bezier(0.22, 1, 0.36, 1),
    opacity 0.24s ease,
    transform 0.42s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s linear 0.42s;
}
.handbook-home-tab--learn:hover .handbook-home-learn-expand {
  max-width: 520px;
  opacity: 1;
  transform: translateX(0);
  pointer-events: auto;
  visibility: visible;
  transition-delay: 0s, 0s, 0s, 0s;
}
.handbook-home-tab--learn:hover {
  gap: 30px;
}
.handbook-home-learn-item {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 2px 0 10px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.2;
  opacity: 0.68;
  transform: scale(1);
  transition: opacity 0.2s ease, transform 0.2s ease;
  white-space: nowrap;
  cursor: pointer;
}
.handbook-home-learn-item svg {
  width: 100%;
  height: 100%;
  display: block;
}
.handbook-home-learn-item:hover {
  opacity: 1;
  transform: scale(1.05);
}
.handbook-home-learn-item.is-active {
  opacity: 1;
  transform: scale(1.05);
}
.handbook-home-learn-item.is-active .handbook-home-tab-label::after {
  transform: scaleX(1);
}
.handbook-home-content {
  margin-top: 0;
  width: 100%;
  min-height: 520px;
  padding: 48px 0 72px;
  position: relative;
  isolation: isolate;
  background: #fff;
}
.handbook-home-content::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: calc(100vw + 100px);
  transform: translateX(-50%);
  background: #fff;
  z-index: -1;
}
.handbook-home-content::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: var(--growth-center-inner-width);
  transform: translateX(-50%);
  border-bottom: 1px solid color-mix(in srgb, var(--text) 10%, transparent);
  pointer-events: none;
}
.handbook-home-content-inner {
  width: var(--growth-center-inner-width);
  margin: 0 auto;
  position: relative;
  z-index: 1;
  box-sizing: border-box;
}
.growth-dev-survey-stack {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 4px 2px 8px;
}
.growth-dev-survey-stack[hidden] {
  display: none !important;
}
.growth-dev-survey-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.growth-dev-survey-title {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
}
.growth-dev-survey-summary {
  font-size: 12px;
  color: var(--muted);
}
.growth-dev-survey-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}
.growth-dev-survey-icon-btn {
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 12px;
  background: rgba(240, 238, 233, .86);
  color: #1d1d1f;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7), 0 8px 18px rgba(29,29,31,.06);
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease, color .18s ease;
}
.growth-dev-survey-icon-btn:hover {
  transform: translateY(-1px);
  background: #e8e5de;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.74), 0 10px 22px rgba(29,29,31,.1);
}
.growth-dev-survey-icon-btn:active {
  transform: translateY(0) scale(.98);
}
.growth-dev-survey-icon-btn svg {
  width: 18px;
  height: 18px;
  transition: transform .2s ease;
}
#growth-dev-survey-collapse-toggle[aria-expanded="true"] svg {
  transform: rotate(90deg);
}
.growth-dev-survey-icon-btn.is-success {
  background: #1d1d1f;
  color: #fff;
}
html.theme-dark .growth-dev-survey-icon-btn {
  background: rgba(255,255,255,.1);
  color: var(--text);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 10px 24px rgba(0,0,0,.22);
}
html.theme-dark .growth-dev-survey-icon-btn:hover {
  background: rgba(255,255,255,.14);
}
.growth-dev-survey-share-modal {
  position: fixed;
  inset: 0;
  z-index: 1600;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 22px;
  background: rgba(29, 29, 31, .42);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.growth-dev-survey-share-modal.is-open {
  display: flex;
}
.growth-dev-survey-share-card {
  width: min(520px, calc(100vw - 44px));
  border-radius: 24px;
  background: rgba(255, 255, 255, .94);
  border: 1px solid rgba(255, 255, 255, .72);
  box-shadow: 0 30px 80px rgba(0, 0, 0, .2);
  padding: 24px;
  display: grid;
  gap: 16px;
  transform: translateY(10px) scale(.98);
  opacity: 0;
  animation: growth-dev-survey-share-in .22s cubic-bezier(.2,.85,.22,1) forwards;
}
@keyframes growth-dev-survey-share-in {
  to {
    transform: translateY(0) scale(1);
    opacity: 1;
  }
}
.growth-dev-survey-share-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}
.growth-dev-survey-share-title {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0;
}
.growth-dev-survey-share-sub {
  margin: 6px 0 0;
  font-size: 13px;
  color: var(--muted);
}
.growth-dev-survey-share-close {
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 999px;
  background: rgba(29, 29, 31, .08);
  color: #1d1d1f;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform .18s ease, background .18s ease, color .18s ease;
}
.growth-dev-survey-share-close:hover {
  transform: scale(1.06);
  background: #FF5C60;
  color: #fff;
}
.growth-dev-survey-share-close svg {
  width: 14px;
  height: 14px;
}
.growth-dev-survey-share-field {
  display: grid;
  gap: 8px;
}
.growth-dev-survey-share-label {
  font-size: 12px;
  font-weight: 650;
  color: rgba(29, 29, 31, .58);
}
.growth-dev-survey-share-input,
.growth-dev-survey-share-textarea {
  width: 100%;
  border: 1px solid rgba(29, 29, 31, .1);
  border-radius: 14px;
  background: rgba(245, 245, 247, .92);
  color: #1d1d1f;
  font: inherit;
  outline: none;
  box-sizing: border-box;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.growth-dev-survey-share-input {
  height: 42px;
  padding: 0 13px;
  font-size: 13px;
}
.growth-dev-survey-share-textarea {
  min-height: 118px;
  resize: vertical;
  padding: 12px 13px;
  line-height: 1.55;
  font-size: 14px;
}
.growth-dev-survey-share-input:focus,
.growth-dev-survey-share-textarea:focus {
  border-color: rgba(0, 113, 227, .42);
  box-shadow: 0 0 0 4px rgba(0, 113, 227, .1);
  background: #fff;
}
.growth-dev-survey-share-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.growth-dev-survey-share-status {
  min-height: 20px;
  font-size: 13px;
  color: #2f7d4a;
}
.growth-dev-survey-share-copy {
  min-width: 112px;
  height: 38px;
  border: 0;
  border-radius: 999px;
  background: #1d1d1f;
  color: #fff;
  cursor: pointer;
  font-size: 14px;
  font-weight: 650;
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}
.growth-dev-survey-share-copy:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(29, 29, 31, .16);
}
html.theme-dark .growth-dev-survey-share-card {
  background: rgba(32, 32, 32, .94);
  border-color: rgba(255, 255, 255, .12);
}
html.theme-dark .growth-dev-survey-share-close {
  background: rgba(255,255,255,.1);
  color: var(--text);
}
html.theme-dark .growth-dev-survey-share-label {
  color: rgba(255,255,255,.62);
}
html.theme-dark .growth-dev-survey-share-input,
html.theme-dark .growth-dev-survey-share-textarea {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.12);
  color: var(--text);
}
html.theme-dark .growth-dev-survey-share-input:focus,
html.theme-dark .growth-dev-survey-share-textarea:focus {
  background: rgba(255,255,255,.12);
}
.growth-dev-survey-action-btn {
  height: 36px;
  min-width: 92px;
  border-radius: 10px;
}
.growth-dev-survey-action-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.growth-dev-survey-btn-spinner {
  width: 14px;
  height: 14px;
  border-radius: 999px;
  border: 2px solid rgba(29,29,31,.18);
  border-top-color: currentColor;
  animation: growth-dev-survey-btn-spin .75s linear infinite;
}
.growth-dev-survey-btn-spinner[hidden] {
  display: none !important;
}
@keyframes growth-dev-survey-btn-spin {
  to { transform: rotate(360deg); }
}
.growth-dev-survey-group-composer {
  display: flex;
  align-items: center;
  gap: 8px;
  max-width: 420px;
}
.growth-dev-survey-group-composer .growth-dev-survey-admin-input {
  height: 36px;
  padding-top: 0;
  padding-bottom: 0;
}
.growth-dev-survey-group-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 4px;
}
.growth-dev-survey-group-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  padding: 4px 8px 4px 10px;
  border: 1px solid rgba(0,0,0,.1);
  border-radius: 999px;
  background: var(--soft);
  color: var(--text);
  font-size: 13px;
  line-height: 1.2;
}
html.theme-dark .growth-dev-survey-group-chip {
  border-color: rgba(255,255,255,.1);
}
.growth-dev-survey-group-delete {
  width: 18px;
  height: 18px;
  border: 0;
  border-radius: 999px;
  background: rgba(0,0,0,.08);
  color: var(--muted);
  font: inherit;
  font-size: 14px;
  line-height: 18px;
  padding: 0;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transition: opacity .14s ease, background .14s ease, color .14s ease;
}
.growth-dev-survey-group-chip:hover .growth-dev-survey-group-delete,
.growth-dev-survey-group-delete:focus-visible {
  opacity: 1;
  pointer-events: auto;
}
.growth-dev-survey-group-delete:hover {
  background: rgba(255, 59, 48, .14);
  color: #d70015;
}
html.theme-dark .growth-dev-survey-group-delete {
  background: rgba(255,255,255,.1);
}
.growth-dev-survey-list {
  display: grid;
  gap: 12px;
}
.growth-dev-survey-record-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  margin-top: 12px;
  padding-top: 14px;
  border-top: 1px solid rgba(0,0,0,.08);
}
html.theme-dark .growth-dev-survey-record-head {
  border-top-color: rgba(255,255,255,.08);
}
.growth-dev-survey-record-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--text);
}
.growth-dev-survey-record-meta {
  margin-top: 4px;
  font-size: 12px;
  color: var(--muted);
}
.growth-dev-survey-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}
.growth-dev-survey-stat {
  min-width: 0;
  padding: 13px 14px;
  border: 1px solid rgba(0,0,0,.07);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(255,255,255,.86), rgba(250,250,252,.68));
  box-shadow: 0 10px 24px rgba(29,29,31,.045);
}
html.theme-dark .growth-dev-survey-stat {
  border-color: rgba(255,255,255,.08);
  background: rgba(255,255,255,.045);
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
}
.growth-dev-survey-stat-label {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.35;
}
.growth-dev-survey-stat-value {
  margin-top: 6px;
  color: var(--text);
  font-size: 22px;
  font-weight: 760;
  line-height: 1;
  letter-spacing: 0;
}
.growth-dev-survey-record-tools {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  padding: 8px 0 2px;
  border: 0;
  background: transparent;
}
html.theme-dark .growth-dev-survey-record-tools {
  background: transparent;
}
.growth-dev-survey-filter-group {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
}
.growth-dev-survey-filter-input,
.growth-dev-survey-filter-select {
  height: 32px;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 9px;
  background: rgba(255,255,255,.66);
  color: var(--text);
  padding: 0 9px;
  font: inherit;
  font-size: 12px;
  outline: none;
}
.growth-dev-survey-filter-input {
  width: 170px;
}
.growth-dev-survey-filter-select {
  min-width: 118px;
}
html.theme-dark .growth-dev-survey-filter-input,
html.theme-dark .growth-dev-survey-filter-select {
  border-color: rgba(255,255,255,.12);
  background: rgba(255,255,255,.07);
  color: var(--text);
}
.growth-dev-survey-export-btn {
  height: 32px;
  padding: 0 13px;
  border: 0;
  border-radius: 999px;
  background: #1d1d1f;
  color: #fff;
  font: inherit;
  font-size: 12px;
  font-weight: 650;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease;
}
.growth-dev-survey-export-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(29,29,31,.16);
}
.growth-dev-survey-item {
  position: relative;
  display: grid;
  grid-template-columns: minmax(160px, .7fr) minmax(0, 1.8fr) 28px;
  align-items: center;
  gap: 14px;
  width: 100%;
  text-align: left;
  background: rgba(255,255,255,.74);
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  padding: 13px 14px 13px 16px;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
html.theme-dark .growth-dev-survey-item {
  border-color: rgba(255,255,255,.08);
  background: rgba(255,255,255,.045);
}
.growth-dev-survey-item:hover {
  transform: translateY(-1px);
  border-color: rgba(0,0,0,.14);
  background: rgba(255,255,255,.9);
  box-shadow: 0 12px 26px rgba(0,0,0,.055);
}
html.theme-dark .growth-dev-survey-item:hover {
  border-color: rgba(255,255,255,.16);
  box-shadow: 0 12px 26px rgba(0,0,0,.18);
}
.growth-dev-survey-item-top {
  min-width: 0;
}
.growth-dev-survey-item-name {
  font-size: 16px;
  font-weight: 760;
  color: var(--text);
  line-height: 1.2;
}
.growth-dev-survey-item-meta {
  margin-top: 6px;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.35;
}
.growth-dev-survey-item-summary {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  flex-wrap: wrap;
  min-width: 0;
}
.growth-dev-survey-pill {
  max-width: 100%;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 30px;
  padding: 0 10px;
  border: 1px solid rgba(0,0,0,.07);
  border-radius: 999px;
  background: rgba(245,245,247,.82);
  color: var(--text);
  font-size: 12px;
  font-weight: 650;
  line-height: 1;
  white-space: nowrap;
}
html.theme-dark .growth-dev-survey-pill {
  border-color: rgba(255,255,255,.08);
  background: rgba(255,255,255,.07);
}
.growth-dev-survey-pill span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.growth-dev-survey-pill strong {
  flex: 0 0 auto;
  font-weight: 720;
}
.growth-dev-survey-pill--ok {
  background: rgba(52, 199, 89, .1);
  border-color: rgba(52, 199, 89, .18);
  color: #1f7a3b;
}
.growth-dev-survey-pill--muted {
  color: var(--muted);
}
.growth-dev-survey-item-arrow {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--muted);
  background: rgba(0,0,0,.035);
  transition: transform .18s ease, background .18s ease, color .18s ease;
}
.growth-dev-survey-item-arrow::before {
  content: "";
  width: 7px;
  height: 7px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: rotate(45deg);
  margin-left: -2px;
}
.growth-dev-survey-item:hover .growth-dev-survey-item-arrow {
  transform: translateX(2px);
  background: rgba(29,29,31,.08);
  color: var(--text);
}
@media (max-width: 860px) {
  .growth-dev-survey-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .growth-dev-survey-item {
    grid-template-columns: 1fr 28px;
  }
  .growth-dev-survey-item-summary {
    grid-column: 1 / -1;
  }
}
.growth-dev-survey-detail-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(0,0,0,.08);
}
html.theme-dark .growth-dev-survey-detail-actions {
  border-top-color: rgba(255,255,255,.08);
}
.growth-dev-survey-delete-btn,
.growth-dev-survey-confirm-btn {
  height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid rgba(255,92,96,.24);
  background: rgba(255,92,96,.08);
  color: #FF5C60;
  font: inherit;
  font-size: 13px;
  font-weight: 650;
  cursor: pointer;
  transition: transform .18s ease, background .18s ease, border-color .18s ease;
}
.growth-dev-survey-delete-btn:hover,
.growth-dev-survey-confirm-btn:hover {
  transform: translateY(-1px);
  background: rgba(255,92,96,.14);
  border-color: rgba(255,92,96,.34);
}
.growth-dev-survey-confirm-btn {
  background: #FF5C60;
  color: #fff;
}
.growth-dev-survey-cancel-btn {
  height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.1);
  background: rgba(255,255,255,.62);
  color: var(--text);
  font: inherit;
  font-size: 13px;
  font-weight: 650;
  cursor: pointer;
}
html.theme-dark .growth-dev-survey-cancel-btn {
  border-color: rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
}
.growth-dev-survey-report {
  display: grid;
  gap: 14px;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: start;
  gap: 14px;
}
.growth-dev-survey-report-hero {
  display: grid;
  gap: 10px;
  padding: 16px;
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(245,245,247,.96), rgba(255,255,255,.72));
  border: 1px solid rgba(0,0,0,.06);
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-hero {
  grid-column: 1 / -1;
  position: sticky;
  top: 0;
  z-index: 2;
  grid-template-columns: minmax(190px, .42fr) minmax(0, 1.58fr);
  grid-template-areas:
    "profile insights"
    "meta insights";
  align-items: center;
  column-gap: 18px;
  row-gap: 6px;
  padding: 14px 16px;
  border-radius: 16px;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
html.theme-dark .growth-dev-survey-report-hero {
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.08);
}
.growth-dev-survey-report-name {
  font-size: 19px;
  font-weight: 760;
  color: var(--text);
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-name {
  grid-area: profile;
  font-size: 24px;
  line-height: 1.25;
}
.growth-dev-survey-report-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  color: var(--muted);
  font-size: 12px;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-meta {
  grid-area: meta;
  gap: 10px;
  font-size: 14px;
  line-height: 1.35;
}
.growth-dev-survey-report-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.growth-dev-survey-report-chip {
  max-width: 100%;
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(29,29,31,.06);
  color: var(--text);
  font-size: 11px;
  font-weight: 650;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-chip {
  padding: 7px 10px;
  font-size: 13px;
  line-height: 1.35;
}
html.theme-dark .growth-dev-survey-report-chip {
  background: rgba(255,255,255,.08);
}
.growth-dev-survey-hero-insights {
  grid-area: insights;
  display: grid;
  grid-template-columns: minmax(128px, .58fr) minmax(360px, 1.65fr) minmax(136px, .62fr);
  gap: 10px;
  align-items: stretch;
}
.growth-dev-survey-hero-card {
  position: relative;
  min-width: 0;
  min-height: 112px;
  padding: 11px 12px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 15px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,.035)),
    rgba(255,255,255,.04);
  overflow: visible;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.growth-dev-survey-hero-card:hover,
.growth-dev-survey-hero-card:focus-visible,
.growth-dev-survey-hero-bar:hover,
.growth-dev-survey-hero-bar:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(255,255,255,.22);
  box-shadow: 0 18px 34px rgba(0,0,0,.24);
  outline: none;
}
.growth-dev-survey-hero-card::after,
.growth-dev-survey-hero-bar::after {
  content: attr(data-detail);
  position: absolute;
  left: 12px;
  right: 12px;
  top: calc(100% + 8px);
  z-index: 5;
  padding: 9px 10px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 12px;
  background: rgba(24,24,24,.94);
  color: rgba(255,255,255,.88);
  font-size: 12px;
  line-height: 1.45;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-6px);
  transition: opacity .16s ease, transform .16s ease;
  box-shadow: 0 16px 32px rgba(0,0,0,.28);
}
.growth-dev-survey-hero-card:hover::after,
.growth-dev-survey-hero-card:focus-visible::after,
.growth-dev-survey-hero-bar:hover::after,
.growth-dev-survey-hero-bar:focus-visible::after {
  opacity: 1;
  transform: translateY(0);
}
.growth-dev-survey-hero-card-kicker {
  color: var(--muted);
  font-size: 12px;
  font-weight: 760;
  letter-spacing: 0;
}
.growth-dev-survey-hero-card-title {
  margin-top: 6px;
  color: var(--text);
  font-size: 15px;
  font-weight: 780;
  line-height: 1.25;
}
.growth-dev-survey-ai-orbit {
  --score: 50%;
  width: 58px;
  height: 58px;
  margin-top: 8px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at center, rgba(42,42,42,.96) 0 54%, transparent 55%),
    conic-gradient(from -130deg, #8bd3ff 0 var(--score), rgba(255,255,255,.11) var(--score) 100%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08), 0 12px 24px rgba(0,0,0,.22);
}
.growth-dev-survey-ai-orbit span {
  color: var(--text);
  font-size: 18px;
  font-weight: 820;
}
.growth-dev-survey-hero-card--ai.is-high .growth-dev-survey-ai-orbit {
  background:
    radial-gradient(circle at center, rgba(42,42,42,.96) 0 54%, transparent 55%),
    conic-gradient(from -130deg, #78f0bf 0 var(--score), rgba(255,255,255,.11) var(--score) 100%);
}
.growth-dev-survey-hero-card--ai.is-low .growth-dev-survey-ai-orbit {
  background:
    radial-gradient(circle at center, rgba(42,42,42,.96) 0 54%, transparent 55%),
    conic-gradient(from -130deg, #ffd26a 0 var(--score), rgba(255,255,255,.11) var(--score) 100%);
}
.growth-dev-survey-hero-bars {
  display: grid;
  gap: 5px;
  margin-top: 8px;
}
.growth-dev-survey-hero-bar {
  position: relative;
  display: grid;
  grid-template-columns: minmax(72px, .55fr) minmax(120px, 1fr) 34px;
  align-items: center;
  gap: 8px;
  padding: 1px 0;
  border-radius: 10px;
  transition: transform .18s ease;
}
.growth-dev-survey-hero-bar::after {
  left: 84px;
  right: 0;
  min-width: 220px;
}
.growth-dev-survey-hero-bar-name {
  min-width: 0;
  color: var(--text);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
}
.growth-dev-survey-hero-bar-track {
  height: 7px;
  border-radius: 999px;
  background: rgba(255,255,255,.1);
  overflow: hidden;
}
.growth-dev-survey-hero-bar-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #79d6ff, #8df2bd);
  box-shadow: 0 0 16px rgba(121,214,255,.28);
}
.growth-dev-survey-hero-bar-value {
  color: var(--muted);
  font-size: 12px;
  font-weight: 760;
  text-align: right;
}
.growth-dev-survey-product-signal {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
}
.growth-dev-survey-product-signal span {
  width: 34px;
  height: 34px;
  border-radius: 12px;
  background: linear-gradient(135deg, #78f0bf, #79d6ff);
  box-shadow: 0 12px 24px rgba(120,240,191,.18);
}
.growth-dev-survey-product-signal strong {
  color: var(--text);
  font-size: 16px;
  font-weight: 820;
}
.growth-dev-survey-hero-card--product.is-missing .growth-dev-survey-product-signal span {
  background: linear-gradient(135deg, #ffd26a, #ff8f70);
}
.growth-dev-survey-hero-empty {
  margin-top: 10px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
}
@media (max-width: 1080px) {
  .tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-hero {
    grid-template-columns: 1fr;
    grid-template-areas:
      "profile"
      "meta"
      "insights";
  }
  .growth-dev-survey-hero-insights {
    grid-template-columns: 1fr;
  }
}
.growth-dev-survey-report-section {
  padding: 10px 11px;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 13px;
  background: rgba(255,255,255,.62);
  min-width: 0;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-section {
  padding: 14px 16px;
  border-radius: 15px;
}
.growth-dev-survey-fixed-block {
  grid-column: 1 / -1;
  display: grid;
  gap: 8px;
  padding: 11px;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  background: rgba(255,255,255,.58);
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-fixed-block {
  gap: 12px;
  padding: 16px;
  border-radius: 16px;
}
html.theme-dark .growth-dev-survey-fixed-block {
  border-color: rgba(255,255,255,.08);
  background: rgba(255,255,255,.045);
}
.growth-dev-survey-fixed-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: var(--text);
  font-size: 13px;
  font-weight: 760;
  line-height: 1.25;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-fixed-title {
  font-size: 16px;
  line-height: 1.35;
}
.growth-dev-survey-fixed-sub {
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
}
.growth-dev-survey-fixed-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  align-items: start;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-fixed-grid {
  gap: 12px;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-fixed-grid:not(.growth-dev-survey-fixed-grid--two) {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.growth-dev-survey-fixed-grid--two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.growth-dev-survey-path-card {
  border-left: 3px solid rgba(29,29,31,.16);
}
html.theme-dark .growth-dev-survey-path-card {
  border-left-color: rgba(255,255,255,.18);
}
.growth-dev-survey-review-table {
  display: grid;
  gap: 6px;
}
.growth-dev-survey-review-row {
  display: grid;
  grid-template-columns: minmax(140px, .85fr) minmax(96px, .55fr) 54px;
  align-items: center;
  gap: 8px;
  min-height: 54px;
  padding: 7px 8px;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 11px;
  background: rgba(255,255,255,.58);
}
html.theme-dark .growth-dev-survey-review-row {
  border-color: rgba(255,255,255,.08);
  background: rgba(255,255,255,.045);
}
.growth-dev-survey-review-name {
  min-width: 0;
  color: var(--text);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
}
.growth-dev-survey-review-choice {
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
}
.growth-dev-survey-review-row img {
  width: 48px;
  height: 48px;
  object-fit: cover;
  border-radius: 9px;
  cursor: zoom-in;
  background: rgba(0,0,0,.04);
}
.growth-dev-survey-notes-reserved {
  grid-column: 1 / -1;
  padding: 12px;
  border: 1px dashed rgba(29,29,31,.18);
  border-radius: 14px;
  background: rgba(245,245,247,.5);
}
html.theme-dark .growth-dev-survey-notes-reserved {
  border-color: rgba(255,255,255,.16);
  background: rgba(255,255,255,.04);
}
.growth-dev-survey-notes-title {
  color: var(--text);
  font-size: 13px;
  font-weight: 760;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-notes-title {
  font-size: 16px;
}
.growth-dev-survey-notes-empty {
  margin-top: 6px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-notes-empty {
  font-size: 14px;
  line-height: 1.6;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-section:has(.growth-dev-survey-product-card),
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-section.is-wide {
  grid-column: 1 / -1;
}
html.theme-dark .growth-dev-survey-report-section {
  border-color: rgba(255,255,255,.08);
  background: rgba(255,255,255,.045);
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-section.is-empty {
  padding-top: 8px;
  padding-bottom: 8px;
  background: rgba(248,248,250,.48);
  opacity: .72;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-section.is-empty .growth-dev-survey-report-a {
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-review-table {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-review-row {
  grid-template-columns: minmax(130px, 1fr) minmax(72px, auto) 52px;
  min-height: 58px;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 12px;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-review-name {
  font-size: 14px;
  line-height: 1.35;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-review-choice {
  justify-self: start;
  font-size: 14px;
  line-height: 1.35;
  white-space: nowrap;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-review-row .growth-dev-survey-report-thumbs {
  justify-content: flex-end;
  gap: 0;
  margin-top: 0;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-review-row .growth-dev-survey-record-meta {
  justify-self: end;
  font-size: 12px;
  white-space: nowrap;
}
.growth-dev-survey-report-q {
  margin-bottom: 5px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-q {
  margin-bottom: 7px;
  font-size: 13px;
  line-height: 1.4;
}
.growth-dev-survey-report-a {
  color: var(--text);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.45;
  white-space: pre-wrap;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-a {
  font-size: 15px;
  line-height: 1.6;
}
.growth-dev-survey-report-desc {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.42;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-desc {
  margin-top: 6px;
  font-size: 14px;
  line-height: 1.55;
}
.growth-dev-survey-report-thumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 7px;
}
.growth-dev-survey-report-thumbs img {
  width: 74px;
  height: 74px;
  border-radius: 12px;
  object-fit: cover;
  background: rgba(0,0,0,.04);
  cursor: zoom-in;
  transition: transform .18s ease, box-shadow .18s ease;
}
.growth-dev-survey-report-thumbs img:hover {
  transform: scale(1.04);
  box-shadow: 0 10px 22px rgba(29,29,31,.14);
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-thumbs img {
  width: 58px;
  height: 58px;
  border-radius: 10px;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-review-row .growth-dev-survey-report-thumbs img {
  width: 52px;
  height: 52px;
  border-radius: 9px;
}
.growth-dev-survey-product-card {
  margin-top: 7px;
  padding: 9px;
  border-radius: 12px;
  background: rgba(245,245,247,.76);
}
html.theme-dark .growth-dev-survey-product-card {
  background: rgba(255,255,255,.045);
}
.growth-dev-survey-product-title {
  font-size: 13px;
  font-weight: 720;
  color: var(--text);
  margin-bottom: 5px;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-product-title {
  font-size: 15px;
  line-height: 1.35;
}
.growth-dev-survey-product-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 10px;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-product-card {
  display: grid;
  grid-template-columns: minmax(180px, .8fr) minmax(0, 1.6fr);
  gap: 10px;
  align-items: start;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-product-grid {
  margin-top: 0;
}
.growth-dev-survey-product-label {
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  margin-bottom: 4px;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-product-label {
  font-size: 13px;
}
@media (max-width: 720px) {
  .tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report {
    grid-template-columns: 1fr;
  }
  .growth-dev-survey-hero-insights {
    grid-template-columns: 1fr;
  }
  .growth-dev-survey-hero-card::after,
  .growth-dev-survey-hero-bar::after {
    left: 0;
    right: 0;
  }
  .growth-dev-survey-fixed-grid,
  .growth-dev-survey-fixed-grid--two {
    grid-template-columns: 1fr;
  }
  .tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-review-table,
  .tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-review-row {
    grid-template-columns: 1fr;
  }
  .tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-review-choice,
  .tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-review-row .growth-dev-survey-record-meta {
    white-space: normal;
  }
  .tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-review-row .growth-dev-survey-report-thumbs {
    justify-content: flex-start;
  }
  .growth-dev-survey-product-grid {
    grid-template-columns: 1fr;
  }
  .tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-product-card {
    grid-template-columns: 1fr;
  }
}

/* Survey detail redesign: bento profile dashboard */
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report {
  grid-template-columns: 1fr;
  gap: 14px;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-hero {
  display: grid;
  grid-template-columns: minmax(250px, .34fr) minmax(0, 1fr);
  gap: 12px;
  align-items: stretch;
  padding: 12px;
  border-radius: 24px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.025)),
    rgba(29,31,37,.86);
  border-color: rgba(255,255,255,.08);
  box-shadow: 0 18px 48px rgba(0,0,0,.2);
}
.growth-dev-survey-report-profile {
  min-height: 126px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 18px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 18px;
  background:
    radial-gradient(circle at 12% 20%, rgba(143,240,196,.14), transparent 38%),
    rgba(255,255,255,.035);
}
.growth-dev-survey-avatar {
  width: 42px;
  height: 42px;
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 14px;
  background: linear-gradient(135deg, #8ff0c4, #79d9ff);
  color: #101417;
  font-size: 18px;
  font-weight: 900;
  box-shadow: 0 18px 32px rgba(121,217,255,.18);
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-name {
  font-size: 30px;
  line-height: 1;
  font-weight: 820;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-meta {
  margin-top: 14px;
  gap: 8px;
  font-size: 13px;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-meta span {
  padding: 6px 9px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 999px;
  background: rgba(255,255,255,.055);
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-hero-insights {
  grid-template-columns: 132px minmax(0, 1fr) 230px;
  gap: 12px;
  align-items: stretch;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-hero-card {
  height: 100%;
  min-height: 126px;
  padding: 13px;
  border-color: rgba(255,255,255,.095);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,.025)),
    rgba(255,255,255,.035);
  transition: transform .22s ease, border-color .22s ease, background .22s ease, box-shadow .22s ease;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-hero-card--ai,
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-hero-card--product {
  display: flex;
  flex-direction: column;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-hero-card--ai {
  align-items: center;
  justify-content: center;
  text-align: center;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-hero-card--product {
  justify-content: center;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-hero-card:hover,
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-hero-card:focus-visible {
  transform: translateY(-3px);
  border-color: rgba(143,240,196,.34);
  box-shadow: 0 22px 42px rgba(0,0,0,.24);
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-hero-card-title {
  margin-top: 7px;
  font-size: 17px;
  font-weight: 820;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-ai-orbit {
  width: 66px;
  height: 66px;
  margin: 10px 0 7px;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-ai-orbit span {
  font-size: 19px;
  font-weight: 860;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-hero-card--quality {
  padding: 13px 14px;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-hero-card--quality .growth-dev-survey-hero-bars {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
  min-width: 0;
  align-items: stretch;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-hero-bar {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 32px 7px 14px;
  align-content: space-between;
  align-items: start;
  gap: 0;
  min-width: 0;
  min-height: 72px;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 14px;
  background: rgba(255,255,255,.04);
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-hero-bar:hover,
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-hero-bar:focus-visible {
  transform: translateY(-2px);
  background: rgba(255,255,255,.065);
  border-color: rgba(121,217,255,.3);
  box-shadow: none;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-hero-bar::after {
  left: 10px;
  right: 10px;
  min-width: 210px;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-hero-bar-name {
  min-width: 0;
  min-height: 32px;
  font-size: 12px;
  font-weight: 780;
  line-height: 1.25;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-hero-bar-track {
  width: 100%;
  min-width: 0;
  height: 7px;
  margin-top: 8px;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-hero-bar-value {
  display: block;
  margin-top: 7px;
  font-size: 11px;
  font-weight: 740;
  text-align: left;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-product-signal {
  gap: 10px;
  margin-top: 18px;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-product-signal span {
  width: 42px;
  height: 42px;
  border-radius: 15px;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-product-signal strong {
  font-size: 18px;
}
.growth-dev-survey-detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 14px;
  align-items: start;
}
.growth-dev-survey-detail-main {
  display: grid;
  gap: 14px;
}
.growth-dev-survey-side-panel {
  position: sticky;
  top: 150px;
  display: grid;
  gap: 14px;
}
.growth-dev-survey-note-card {
  padding: 16px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 22px;
  background: rgba(31,33,38,.76);
}
.growth-dev-survey-note-title {
  margin-bottom: 10px;
  color: var(--text);
  font-size: 16px;
  font-weight: 800;
}
.growth-dev-survey-note-copy {
  color: rgba(255,255,255,.67);
  font-size: 13px;
  line-height: 1.65;
}
.growth-dev-survey-timeline {
  display: grid;
  gap: 10px;
}
.growth-dev-survey-step {
  display: grid;
  grid-template-columns: 16px 1fr;
  gap: 10px;
  align-items: start;
}
.growth-dev-survey-step span {
  width: 9px;
  height: 9px;
  margin-top: 5px;
  border-radius: 50%;
  background: #8ff0c4;
  box-shadow: 0 0 0 5px rgba(143,240,196,.1);
}
.growth-dev-survey-step p {
  margin: 0;
  color: rgba(255,255,255,.67);
  font-size: 13px;
  line-height: 1.45;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-section,
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-fixed-block {
  border-color: rgba(255,255,255,.08);
  background:
    linear-gradient(135deg, rgba(255,255,255,.055), rgba(255,255,255,.025)),
    rgba(255,255,255,.035);
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-section:hover,
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-fixed-block:hover {
  transform: translateY(-2px);
  border-color: rgba(121,217,255,.22);
  background: rgba(255,255,255,.055);
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-section {
  display: flex;
  flex-direction: column;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-q {
  min-height: 38px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-a {
  min-height: 24px;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-desc {
  min-height: 44px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-thumbs {
  margin-top: 12px;
}
.growth-dev-notes-module {
  gap: 14px;
}
.growth-dev-notes-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
}
.growth-dev-notes-status {
  flex: 0 0 auto;
  padding: 6px 9px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 999px;
  background: rgba(255,255,255,.05);
  color: var(--muted);
  font-size: 12px;
  font-weight: 720;
}
.growth-dev-note-form {
  display: grid;
  gap: 9px;
  padding: 12px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  background: rgba(255,255,255,.035);
}
.growth-dev-note-input,
.growth-dev-note-textarea {
  width: 100%;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 13px;
  background: rgba(0,0,0,.16);
  color: var(--text);
  font: inherit;
  font-size: 13px;
  outline: none;
}
.growth-dev-note-input {
  height: 38px;
  padding: 0 11px;
}
.growth-dev-note-textarea {
  min-height: 92px;
  padding: 10px 11px;
  resize: vertical;
  line-height: 1.55;
}
.growth-dev-note-form-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.growth-dev-note-form-row span {
  color: var(--muted);
  font-size: 12px;
}
.growth-dev-note-form-row button,
.growth-dev-note-actions button {
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 999px;
  background: rgba(255,255,255,.075);
  color: var(--text);
  font: inherit;
  font-size: 12px;
  font-weight: 760;
  padding: 7px 10px;
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}
.growth-dev-note-form-row button:hover,
.growth-dev-note-actions button:hover {
  transform: translateY(-1px);
  border-color: rgba(143,240,196,.32);
  background: rgba(143,240,196,.12);
}
.growth-dev-note-list {
  display: grid;
  gap: 10px;
}
.growth-dev-note-item {
  padding: 12px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  background: rgba(255,255,255,.035);
}
.growth-dev-note-item.is-highlighted {
  border-color: rgba(143,240,196,.35);
  background: rgba(143,240,196,.07);
}
.growth-dev-note-item.is-pinned {
  box-shadow: inset 3px 0 0 rgba(143,240,196,.75);
}
.growth-dev-note-top {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 10px;
}
.growth-dev-note-top strong {
  color: var(--text);
  font-size: 13px;
}
.growth-dev-note-top span,
.growth-dev-note-top b {
  margin-left: 7px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 720;
}
.growth-dev-note-top b {
  color: #8ff0c4;
}
.growth-dev-note-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}
.growth-dev-note-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}
.growth-dev-note-tags span {
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(121,217,255,.11);
  color: rgba(255,255,255,.78);
  font-size: 12px;
  font-weight: 720;
}
.growth-dev-note-text {
  margin-top: 9px;
  color: rgba(255,255,255,.76);
  font-size: 13px;
  line-height: 1.65;
  white-space: pre-wrap;
}
.growth-dev-note-images img {
  width: 58px;
  height: 58px;
  border-radius: 12px;
}
@media (max-width: 1180px) {
  .tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-report-hero,
  .growth-dev-survey-detail-layout {
    grid-template-columns: 1fr;
  }
  .tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-hero-insights,
  .tool-modal-card.growth-dev-survey-detail-modal-card .growth-dev-survey-hero-card--quality .growth-dev-survey-hero-bars {
    grid-template-columns: 1fr;
  }
  .growth-dev-survey-side-panel {
    position: static;
  }
}
.growth-dev-survey-empty {
  color: var(--muted);
  font-size: 13px;
  padding: 18px 0 6px;
}
.growth-dev-survey-admin {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 12px;
  background: var(--surface);
}
html.theme-dark .growth-dev-survey-admin {
  border-color: rgba(255,255,255,.08);
}
.growth-dev-survey-admin-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
}
.growth-dev-survey-admin-body {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  align-items: start;
}
.growth-dev-survey-admin-title {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
}
.growth-dev-survey-admin-sub {
  font-size: 12px;
  color: var(--muted);
  margin-top: 4px;
}
.growth-dev-survey-admin-grid {
  display: grid;
  gap: 12px;
}
.growth-dev-survey-admin-field {
  display: grid;
  gap: 6px;
}
.growth-dev-survey-admin-label {
  font-size: 13px;
  font-weight: 600;
}
.growth-dev-survey-admin-input,
.growth-dev-survey-admin-textarea,
.growth-dev-survey-admin-select {
  width: 100%;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
  color: var(--text);
  border-radius: 8px;
  font: inherit;
  font-size: 14px;
  padding: 10px 12px;
}
html.theme-dark .growth-dev-survey-admin-input,
html.theme-dark .growth-dev-survey-admin-textarea,
html.theme-dark .growth-dev-survey-admin-select {
  background: #242424;
  border-color: rgba(255,255,255,.12);
}
.growth-dev-survey-admin-textarea {
  min-height: 82px;
  resize: vertical;
}
.growth-dev-survey-section-title {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-top: 4px;
  font-size: 15px;
  font-weight: 800;
  color: var(--text);
}
.growth-dev-survey-section-title span {
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
}
.growth-dev-survey-default-card {
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 12px;
  padding: 12px;
  background: rgba(255,255,255,.58);
  display: grid;
  gap: 12px;
}
html.theme-dark .growth-dev-survey-default-card {
  background: rgba(255,255,255,.04);
  border-color: rgba(255,255,255,.08);
}
.growth-dev-survey-default-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
@media (max-width: 860px) {
  .growth-dev-survey-default-grid {
    grid-template-columns: 1fr;
  }
}
.growth-dev-survey-add-option-row {
  display: flex;
  justify-content: center;
  margin-top: 2px;
}
.growth-dev-survey-add-main-row {
  display: flex;
  justify-content: center;
  padding: 4px 0 2px;
}
.growth-dev-survey-add-option-btn {
  width: auto;
  min-width: 112px;
  height: 38px;
  padding: 0 16px;
  border: 1px solid rgba(0,0,0,.1);
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  color: var(--text);
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(36,42,54,.06), inset 0 1px 0 rgba(255,255,255,.72);
  transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.growth-dev-survey-add-option-btn:hover {
  transform: translateY(-1px);
  border-color: rgba(0,0,0,.16);
  background: rgba(255,255,255,.9);
  box-shadow: 0 12px 24px rgba(36,42,54,.08), inset 0 1px 0 rgba(255,255,255,.86);
}
.growth-dev-survey-add-option-btn:active {
  transform: translateY(0) scale(.98);
}
html.theme-dark .growth-dev-survey-add-option-btn {
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.1);
  box-shadow: 0 8px 20px rgba(0,0,0,.18);
}
html.theme-dark .growth-dev-survey-add-option-btn:hover {
  background: rgba(255,255,255,.1);
  border-color: rgba(255,255,255,.16);
}
.growth-dev-survey-review-option-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.growth-dev-survey-review-option-card {
  display: grid;
  gap: 10px;
  min-width: 0;
}
.growth-dev-survey-review-option-card .growth-dev-survey-option-image-row {
  width: 100%;
}
@media (max-width: 980px) {
  .growth-dev-survey-review-option-grid {
    grid-template-columns: 1fr;
  }
}
.growth-dev-survey-option-image-row {
  position: relative;
  width: min(240px, 100%);
  aspect-ratio: 1 / 1;
}
.growth-dev-survey-compare-image-host .growth-dev-survey-option-image-row {
  width: min(180px, 100%);
}
.growth-dev-survey-option-image-row--multi {
  width: 100%;
  aspect-ratio: 1 / 1;
}
.growth-dev-survey-option-image-stage {
  width: 100%;
  height: 100%;
  border-radius: 18px;
  border: 1px solid rgba(0,0,0,.08);
  background: var(--soft);
  display: block;
  overflow: hidden;
  position: relative;
  cursor: pointer;
}
.growth-dev-survey-option-image-stage input[type="file"] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
  z-index: 3;
}
html.theme-dark .growth-dev-survey-option-image-stage {
  border-color: rgba(255,255,255,.08);
}
.growth-dev-survey-option-image-stage img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  position: absolute;
  inset: 0;
  z-index: 1;
}
.growth-dev-survey-option-image-placeholder {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  border: 0;
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(245,245,247,.92));
  color: var(--muted);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 42px;
  font-weight: 300;
  line-height: 1;
  cursor: pointer;
  user-select: none;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 10px 22px rgba(36,42,54,.05);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  z-index: 2;
}
.growth-dev-survey-option-image-placeholder[hidden] {
  display: none !important;
}
.growth-dev-survey-option-image-placeholder:hover {
  transform: translateY(-1px);
  border-color: rgba(0,0,0,.18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.96), 0 14px 26px rgba(36,42,54,.07);
}
html.theme-dark .growth-dev-survey-option-image-placeholder {
  border-color: rgba(255,255,255,.1);
  background: linear-gradient(180deg, rgba(34,34,36,.96), rgba(28,28,30,.94));
  color: rgba(255,255,255,.72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 10px 22px rgba(0,0,0,.18);
}
.growth-dev-survey-option-image-clear {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 24px;
  height: 24px;
  border: 0;
  border-radius: 999px;
  background: rgba(0,0,0,.56);
  color: #fff;
  font-size: 16px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0,0,0,.16);
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease, background-color .18s ease;
  z-index: 4;
}
.growth-dev-survey-option-image-row:hover .growth-dev-survey-option-image-clear {
  opacity: 1;
  pointer-events: auto;
}
.growth-dev-survey-option-image-clear:hover {
  background: rgba(205,49,49,.92);
}
.growth-dev-survey-multi-image-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
@media (max-width: 980px) {
  .growth-dev-survey-multi-image-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.growth-dev-survey-multi-image-tile {
  display: grid;
  gap: 8px;
}
.growth-dev-survey-multi-image-head {
  font-size: 12px;
  color: var(--muted);
  font-weight: 600;
}
.growth-dev-survey-multi-actions-editor {
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 10px;
  padding: 12px;
  background: rgba(255,255,255,.54);
  display: grid;
  gap: 10px;
}
html.theme-dark .growth-dev-survey-multi-actions-editor {
  background: rgba(255,255,255,.04);
  border-color: rgba(255,255,255,.08);
}
.growth-dev-survey-multi-actions-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
@media (max-width: 720px) {
  .growth-dev-survey-multi-actions-grid {
    grid-template-columns: 1fr;
  }
}
.growth-dev-survey-question-list,
.growth-dev-survey-option-list,
.growth-dev-survey-next-list {
  display: grid;
  gap: 10px;
}
.growth-dev-survey-question-card,
.growth-dev-survey-option-card,
.growth-dev-survey-next-card {
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 10px;
  padding: 12px;
  background: var(--soft);
  display: grid;
  gap: 10px;
}
.growth-dev-survey-question-card {
  position: relative;
  background: rgba(255,255,255,.72);
  border-color: rgba(0,0,0,.12);
}
.growth-dev-survey-question-card.is-collapsed {
  background: rgba(255,255,255,.48);
}
.growth-dev-survey-question-card.is-expanded {
  border-color: rgba(25,25,28,.24);
  box-shadow: 0 12px 34px rgba(36,42,54,.08);
}
.growth-dev-survey-question-card.is-expanded::before {
  content: "";
  position: absolute;
  left: 0;
  top: 12px;
  bottom: 12px;
  width: 4px;
  border-radius: 999px;
  background: #1d1d1f;
}
.growth-dev-survey-question-card.is-collapsed .growth-dev-survey-question-head {
  margin-bottom: 0;
}
.growth-dev-survey-question-card .growth-dev-survey-question-head {
  cursor: pointer;
  border-radius: 8px;
  transition: background .18s ease;
}
.growth-dev-survey-question-card .growth-dev-survey-question-head:hover {
  background: rgba(0,0,0,.03);
}
.growth-dev-survey-question-toggle {
  width: 30px;
  height: 30px;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  color: var(--muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: transform .18s ease, background .18s ease;
}
.growth-dev-survey-question-toggle::before {
  content: "";
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translate(-1px,-1px);
}
.growth-dev-survey-question-card.is-collapsed .growth-dev-survey-question-toggle::before {
  transform: rotate(-45deg);
}
.growth-dev-survey-question-body[hidden] {
  display: none !important;
}
.growth-dev-survey-option-card {
  position: relative;
  margin-left: 14px;
  border-style: dashed;
  background: rgba(255,255,255,.46);
}
.growth-dev-survey-option-card::before,
.growth-dev-survey-next-card::before {
  content: "";
  position: absolute;
  left: -15px;
  top: -10px;
  bottom: -10px;
  width: 2px;
  border-radius: 999px;
  background: rgba(0,0,0,.08);
}
.growth-dev-survey-next-card {
  position: relative;
  margin-left: 18px;
  background: rgba(244,246,250,.8);
  border-color: rgba(0,0,0,.07);
}
.growth-dev-survey-level-chip {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  background: rgba(0,0,0,.07);
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  margin-bottom: 5px;
}
.growth-dev-survey-question-card > .growth-dev-survey-question-head .growth-dev-survey-level-chip {
  background: rgba(28,28,30,.1);
  color: var(--text);
}
.growth-dev-survey-option-card .growth-dev-survey-level-chip {
  background: rgba(92,110,142,.12);
}
.growth-dev-survey-next-card .growth-dev-survey-level-chip {
  background: rgba(124,91,58,.12);
}
@media (max-width: 720px) {
  .growth-dev-survey-option-card,
  .growth-dev-survey-next-card {
    margin-left: 10px;
  }
  .growth-dev-survey-option-card::before,
  .growth-dev-survey-next-card::before {
    left: -11px;
  }
}
html.theme-dark .growth-dev-survey-question-card,
html.theme-dark .growth-dev-survey-option-card,
html.theme-dark .growth-dev-survey-next-card {
  border-color: rgba(255,255,255,.08);
}
html.theme-dark .growth-dev-survey-question-card {
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.12);
}
html.theme-dark .growth-dev-survey-question-card.is-expanded::before {
  background: rgba(255,255,255,.82);
}
html.theme-dark .growth-dev-survey-question-card .growth-dev-survey-question-head:hover {
  background: rgba(255,255,255,.04);
}
html.theme-dark .growth-dev-survey-question-toggle {
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.1);
}
html.theme-dark .growth-dev-survey-option-card {
  background: rgba(255,255,255,.035);
}
html.theme-dark .growth-dev-survey-next-card {
  background: rgba(255,255,255,.045);
}
html.theme-dark .growth-dev-survey-option-card::before,
html.theme-dark .growth-dev-survey-next-card::before {
  background: rgba(255,255,255,.1);
}
.growth-dev-survey-question-head,
.growth-dev-survey-option-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}
.growth-dev-survey-question-name,
.growth-dev-survey-option-name {
  font-size: 14px;
  font-weight: 600;
}
.growth-dev-survey-question-meta,
.growth-dev-survey-option-meta {
  font-size: 12px;
  color: var(--muted);
}
.growth-dev-survey-admin-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
@media (max-width: 860px) {
  .growth-dev-survey-admin-row { grid-template-columns: 1fr; }
}
.growth-dev-survey-admin-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
}
.growth-dev-survey-admin-actions .btn {
  height: 30px;
  min-width: 30px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--text) 12%, transparent);
  background: color-mix(in srgb, var(--surface) 96%, var(--bg));
  color: var(--text);
  font-size: 12px;
  font-weight: 600;
  box-shadow: none;
  transition: transform .15s ease, background-color .15s ease, border-color .15s ease, opacity .15s ease;
}
.growth-dev-survey-admin-actions .btn:hover {
  transform: translateY(-1px);
  background: color-mix(in srgb, var(--surface) 88%, var(--bg));
  border-color: color-mix(in srgb, var(--text) 18%, transparent);
  box-shadow: 0 6px 14px rgba(36,42,54,.06);
}
.growth-dev-survey-admin-actions .btn:disabled {
  opacity: .38;
  transform: none;
  box-shadow: none;
}
html.theme-dark .growth-dev-survey-admin-actions .btn {
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.12);
}
html.theme-dark .growth-dev-survey-admin-actions .btn:hover {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.18);
}
.growth-dev-survey-admin-spacer {
  height: 1px;
  background: rgba(0,0,0,.06);
}
html.theme-dark .growth-dev-survey-admin-spacer {
  background: rgba(255,255,255,.08);
}
.handbook-nonlearn-placeholder {
  box-sizing: border-box;
  min-height: 360px;
  padding: 48px 24px 64px;
  border-radius: 16px;
  border: 1px dashed color-mix(in srgb, var(--text) 18%, transparent);
  background: color-mix(in srgb, var(--surface) 92%, var(--bg));
  color: var(--muted);
  text-align: center;
}
.handbook-nonlearn-placeholder-title {
  margin: 0 0 10px;
  font-size: 18px;
  font-weight: 650;
  color: var(--text);
  letter-spacing: -0.02em;
}
.handbook-nonlearn-placeholder-desc {
  margin: 0;
  font-size: 14px;
  line-height: 1.65;
  max-width: 420px;
  margin-left: auto;
  margin-right: auto;
}
.handbook-home-content-title {
  margin: 0 0 14px;
  font-size: 34px;
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -0.015em;
  color: var(--text);
}
.handbook-home-content-sub {
  margin: 0;
  font-size: 15px;
  color: var(--muted);
}
.growth-editor-toolbar {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 16px;
}
.growth-editor-toolbar--status-only {
  gap: 0;
  min-height: 0;
}
.growth-editor-toolbar--status-only:has(#growth-editor-status:empty) {
  margin: 0 0 6px;
}
.growth-editor-toolbar[hidden] {
  display: none !important;
}
.growth-editor-btn,
.growth-editor-select {
  height: 32px;
  border-radius: 8px;
  border: 1px solid color-mix(in srgb, var(--text) 12%, transparent);
  background: color-mix(in srgb, var(--surface) 94%, var(--bg));
  color: var(--text);
  font-size: 13px;
}
.growth-editor-btn:focus,
.growth-editor-select:focus {
  outline: none;
  box-shadow: none;
  border-color: color-mix(in srgb, var(--text) 20%, transparent);
}
.growth-editor-btn {
  padding: 0 12px;
  cursor: pointer;
}
.growth-style-bubble {
  position: fixed;
  z-index: 1200;
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: nowrap;
  gap: 2px;
  padding: 4px 6px;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--text) 14%, transparent);
  background: color-mix(in srgb, var(--surface) 96%, var(--bg));
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.14);
  pointer-events: auto;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.growth-style-bubble-item {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  min-width: 36px;
  padding: 0;
  margin: 0;
  border: none;
  border-radius: 8px;
  background: transparent;
  box-shadow: none;
  color: var(--text);
  cursor: pointer;
}
.growth-style-bubble-item:hover {
  background: color-mix(in srgb, var(--text) 7%, transparent);
}
.growth-style-bubble-item:focus {
  outline: none;
  background: color-mix(in srgb, var(--text) 9%, transparent);
}
.growth-style-bubble-icon {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: color-mix(in srgb, var(--text) 72%, transparent);
}
.growth-style-bubble-icon svg {
  width: 22px;
  height: 22px;
  display: block;
}
.growth-style-bubble-icon svg text {
  fill: currentColor;
}
.growth-style-bubble-sep {
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  padding: 0 2px 0 8px;
  margin-left: 4px;
  color: color-mix(in srgb, var(--text) 30%, transparent);
  font-size: 15px;
  font-weight: 300;
  line-height: 1;
  user-select: none;
  pointer-events: none;
}
.growth-style-bubble.growth-style-bubble--visible {
  opacity: 1;
  transform: translateY(0);
}
.growth-style-bubble[hidden] {
  display: none !important;
}
.growth-file-input-offscreen {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.growth-cmd-image-with-menu {
  position: relative;
  display: flex;
  align-items: stretch;
  gap: 2px;
}
.growth-editor-batch-gallery {
  flex: 1 1 100%;
  width: 100%;
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  column-gap: 12px;
  row-gap: 10px;
  align-items: start;
  justify-items: stretch;
  margin: 0 !important;
  margin-block-end: var(--growth-gap-after-body) !important;
  padding: 4px 0;
  box-sizing: border-box;
  user-select: none;
  -webkit-user-select: none;
}
@media (max-width: 640px) {
  .growth-editor-batch-gallery {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.growth-batch-thumb {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding: 0;
  margin: 0;
  min-width: 0;
  width: 100%;
  max-height: 200px;
  border: none;
  border-radius: 10px;
  overflow: hidden;
  background: color-mix(in srgb, var(--text) 4%, transparent);
  cursor: zoom-in;
}
.growth-batch-thumb:focus {
  outline: 2px solid var(--blue, #0a84ff);
  outline-offset: 2px;
}
.growth-batch-thumb:focus:not(:focus-visible) {
  outline: none;
}
.growth-batch-thumb img {
  display: block;
  box-sizing: border-box;
  max-width: 100%;
  max-height: 192px;
  width: auto;
  height: auto;
  object-fit: contain;
  vertical-align: middle;
  pointer-events: none;
  border-radius: 10px;
}
html.theme-dark .growth-batch-thumb {
  background: color-mix(in srgb, var(--text) 7%, transparent);
}
.growth-img-layout-bubble {
  gap: 8px;
  padding: 6px 8px;
  flex-wrap: wrap;
}
.growth-img-layout-bubble .growth-img-layout-bubble-sep {
  opacity: 0.45;
  margin: 0 2px;
  user-select: none;
  align-self: center;
}
.growth-img-layout-btn {
  padding: 6px 12px;
  margin: 0;
  border: none;
  border-radius: 8px;
  background: transparent;
  box-shadow: none;
  color: var(--text);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
  line-height: 1.3;
}
.growth-img-layout-btn:hover {
  background: color-mix(in srgb, var(--text) 8%, transparent);
}
.growth-img-layout-btn:focus {
  outline: none;
  background: color-mix(in srgb, var(--text) 10%, transparent);
}
.growth-editor-select {
  padding: 0 8px;
}
.growth-editor-status {
  min-width: 80px;
  font-size: 13px;
  color: var(--muted);
}
.growth-editor {
  min-height: 380px;
  padding: 2px 0;
  line-height: 1.75;
  font-size: 16px;
  color: #1d1d1f !important;
  outline: none;
  display: flex;
  flex-wrap: wrap;
  column-gap: 10px;
  /* 块间距由下方 margin-block-end 控制，避免与浏览器默认标题外边距叠加成「大小不一」的空档 */
  row-gap: 0;
  --growth-gap-after-heading: 18px;
  --growth-gap-after-body: 14px;
  align-content: flex-start;
}
.growth-editor h1,
.growth-editor h2,
.growth-editor h3,
.growth-editor h4,
.growth-editor h5,
.growth-editor h6 {
  margin: 0 !important;
  margin-block-end: var(--growth-gap-after-heading) !important;
  scroll-margin-top: 56px;
}
/* 压住全局 .panel h2（28px）/.panel p（17px）；与样式气泡预设一致；若块上已有内联字号（预设写入），仍以内联为准 */
#growth-editor h1 {
  font-size: 28px;
  font-weight: 800;
  line-height: 1.45;
}
#growth-editor h2 {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.45;
}
#growth-editor h3 {
  font-size: 20px;
  font-weight: 600;
  line-height: 1.45;
}
#growth-editor h4 {
  font-size: 18px;
  font-weight: 500;
  line-height: 1.45;
}
#growth-editor h5,
#growth-editor h6 {
  font-size: 16px;
  font-weight: 500;
  line-height: 1.45;
}
/* 浏览（非编辑）模式：大纲章节号仅存于预览态 DOM，不写回服务端 */
#growth-editor[contenteditable="false"] h1[data-growth-browse-num]::before,
#growth-editor[contenteditable="false"] h2[data-growth-browse-num]::before,
#growth-editor[contenteditable="false"] h3[data-growth-browse-num]::before,
#growth-editor[contenteditable="false"] h4[data-growth-browse-num]::before,
#growth-editor[contenteditable="false"] h5[data-growth-browse-num]::before,
#growth-editor[contenteditable="false"] h6[data-growth-browse-num]::before {
  content: attr(data-growth-browse-num) ". ";
  font-weight: 100;
  font-variation-settings: "wght" 100;
  font-size: 0.62em;
  letter-spacing: 0.06em;
  color: inherit;
  opacity: 0.7;
  margin-inline-end: 0.38em;
  position: relative;
  top: -0.04em;
  -webkit-font-smoothing: antialiased;
}
#growth-editor p.growth-note-text {
  font-size: 9px;
  line-height: 1.6;
}
.growth-editor p:not(.growth-editor-img-block) {
  margin: 0 !important;
  margin-block-end: var(--growth-gap-after-body) !important;
  line-height: 1.75;
  font-size: 16px;
  font-weight: 400;
}
.growth-editor ul,
.growth-editor ol {
  margin: 0 0 var(--growth-gap-after-body) 0 !important;
  padding-left: 1.35em;
  line-height: 1.75;
}
.growth-editor li {
  margin: 0 !important;
}
.growth-editor li + li {
  margin-block-start: 0.35em !important;
}
/* 外层为 div 时，按回车常插入 div 正文块；必须与 p 同色距，否则段落间/段后接下一段标题会塌成一行距 */
.growth-editor > div:not(.growth-editor-img-dual-row) {
  margin: 0 !important;
  margin-block-end: var(--growth-gap-after-body) !important;
  line-height: 1.75;
  font-size: 16px;
  font-weight: 400;
}
/* 默认占满一行；图片独占块由 .growth-editor-img-block + --full/--half 控制（编辑时点图可选满屏/半屏） */
.growth-editor > * {
  flex: 1 1 100%;
  min-width: 0;
}
.growth-editor p.growth-editor-img-block.growth-editor-img-block--half,
.growth-editor p.growth-editor-img-block.growth-editor-img-block--full {
  margin: 0 !important;
  margin-block-end: var(--growth-gap-after-body) !important;
}
.growth-editor > .growth-editor-img-block.growth-editor-img-block--half {
  flex: 0 0 calc((100% - 10px) / 2);
  max-width: calc((100% - 10px) / 2);
  margin: 0;
  margin-block-end: var(--growth-gap-after-body);
  padding: 0;
  min-width: 0;
}
.growth-editor > .growth-editor-img-block.growth-editor-img-block--full {
  flex: 1 1 100%;
  max-width: 100%;
  margin: 0;
  margin-block-end: var(--growth-gap-after-body);
  padding: 0;
  min-width: 0;
}
.growth-editor * {
  color: #1d1d1f !important;
}
.growth-editor .growth-note-text,
.growth-editor .growth-note-text * {
  color: #8a8a8e !important;
}
.growth-editor .growth-collapsible-heading {
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
}
#growth-editor h2.growth-collapsible-heading,
#growth-editor h3.growth-collapsible-heading {
  user-select: none !important;
  -webkit-user-select: none !important;
}
#growth-editor h2.growth-collapsible-heading::selection,
#growth-editor h3.growth-collapsible-heading::selection {
  background: transparent;
}
.growth-editor .growth-collapsed-hidden {
  max-height: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
  visibility: hidden;
  pointer-events: none;
  margin-block: 0 !important;
  padding-block: 0 !important;
  border-width: 0 !important;
  min-height: 0 !important;
}
.growth-editor[contenteditable="true"]:empty::before {
  content: "在这里编辑学习中心内容...";
  color: var(--muted);
}
.growth-editor img {
  max-width: 100%;
  height: auto;
  border-radius: 10px;
  vertical-align: top;
}
.growth-editor > .growth-editor-img-block img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
}
.growth-editor .growth-editor-img-placeholder-wrap {
  outline: none;
}
.growth-editor .growth-editor-img-placeholder {
  box-sizing: border-box;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  min-height: 160px;
  width: 100%;
  margin: 0;
  padding: 16px;
  border-radius: 12px;
  border: 2px dashed color-mix(in srgb, var(--text) 22%, var(--line));
  background: color-mix(in srgb, var(--surface) 88%, var(--bg));
  cursor: default;
  user-select: none;
  -webkit-user-select: none;
  color: color-mix(in srgb, var(--text) 58%, var(--muted)) !important;
  transition: border-color 0.15s ease, background 0.15s ease;
  max-height: min(70vh, 560px);
}
.growth-editor-img-placeholder-main {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 96px;
  width: 100%;
  cursor: pointer;
}
.growth-placeholder-toolbar {
  align-self: stretch;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0 0 4px;
  cursor: default;
}
.growth-placeholder-toolbar-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
}
.growth-placeholder-aspect-btn,
.growth-placeholder-size-btn {
  margin: 0;
  padding: 4px 8px;
  border: 1px solid color-mix(in srgb, var(--text) 14%, var(--line));
  border-radius: 7px;
  background: color-mix(in srgb, var(--surface) 96%, var(--bg));
  color: color-mix(in srgb, var(--text) 82%, var(--muted)) !important;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
}
.growth-placeholder-aspect-btn:hover,
.growth-placeholder-size-btn:hover {
  background: color-mix(in srgb, var(--blue) 10%, var(--surface));
  border-color: color-mix(in srgb, var(--blue) 32%, var(--line));
  color: var(--text) !important;
}
.growth-placeholder-aspect-btn.is-active,
.growth-placeholder-size-btn.is-active {
  background: color-mix(in srgb, var(--blue) 22%, var(--surface));
  border-color: color-mix(in srgb, var(--blue) 45%, var(--line));
  color: var(--text) !important;
}
.growth-placeholder-row-size .growth-placeholder-size-btn {
  min-width: 44px;
}
.growth-editor .growth-editor-img-placeholder[class*="growth-editor-img-placeholder--ar-"] {
  min-height: 0;
  /* 否则 max-height 压扁高度、宽度仍 100%，与 aspect-ratio 冲突，1:1 会变成长条 */
  max-height: none;
}
/* 不用「>」：contenteditable 常在块外包一层 div；窄/中图用 width + flex 控制 */
.growth-editor .growth-editor-img-block.growth-editor-img-block--full.growth-placeholder-medium {
  width: 66.6667% !important;
  max-width: 66.6667% !important;
  box-sizing: border-box !important;
  flex: 0 0 66.6667% !important;
  align-self: flex-start !important;
}
.growth-editor .growth-editor-img-block.growth-editor-img-block--full.growth-placeholder-small,
.growth-editor .growth-editor-img-block.growth-editor-img-block--full.growth-placeholder-narrow {
  width: 48% !important;
  max-width: 48% !important;
  box-sizing: border-box !important;
  flex: 0 0 48% !important;
  align-self: flex-start !important;
}
.growth-editor .growth-editor-img-placeholder--ar-1-1 {
  aspect-ratio: 1;
}
.growth-editor .growth-editor-img-placeholder--ar-3-2 {
  aspect-ratio: 3 / 2;
}
.growth-editor .growth-editor-img-placeholder--ar-16-9 {
  aspect-ratio: 16 / 9;
}
.growth-editor .growth-editor-img-placeholder--ar-21-9 {
  aspect-ratio: 21 / 9;
}
.growth-editor .growth-editor-img-placeholder--ar-2-3 {
  aspect-ratio: 2 / 3;
}
.growth-editor .growth-editor-img-placeholder--ar-9-16 {
  aspect-ratio: 9 / 16;
}
.growth-editor > .growth-editor-img-dual-row {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-start;
  column-gap: 10px;
  row-gap: 14px;
  flex: 1 1 100%;
  width: 100%;
  min-width: 0;
  margin: 0;
  margin-block-end: var(--growth-gap-after-body);
  padding: 0;
}
.growth-editor > .growth-editor-img-dual-row > .growth-editor-img-placeholder-wrap {
  flex: 0 0 calc((100% - 10px) / 2);
  max-width: calc((100% - 10px) / 2);
  min-width: 0;
}
.growth-editor .growth-editor-img-placeholder:hover,
.growth-editor .growth-editor-img-placeholder:focus {
  border-color: color-mix(in srgb, var(--blue) 55%, var(--line));
  background: color-mix(in srgb, var(--blue) 6%, var(--surface));
  outline: none;
}
.growth-editor .growth-editor-img-placeholder-plus {
  font-size: 42px;
  font-weight: 300;
  line-height: 1;
  color: color-mix(in srgb, var(--text) 45%, var(--muted)) !important;
}
.growth-editor .growth-editor-img-placeholder-hint {
  font-size: 14px;
  font-weight: 500;
  color: color-mix(in srgb, var(--text) 52%, var(--muted)) !important;
}
html.theme-dark .growth-editor .growth-editor-img-placeholder {
  border-color: color-mix(in srgb, #f0eee9 28%, transparent);
  background: color-mix(in srgb, #1a1a1c 92%, #000);
}
html.theme-dark .growth-editor,
html.theme-dark .growth-editor * {
  color: #F0EEE9 !important;
}
html.theme-dark .growth-editor .growth-note-text,
html.theme-dark .growth-editor .growth-note-text * {
  color: #B8B8BE !important;
}
html.theme-dark .growth-placeholder-aspect-btn,
html.theme-dark .growth-placeholder-size-btn {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.18);
  color: #e8e6e1 !important;
}
html.theme-dark .growth-placeholder-aspect-btn:hover,
html.theme-dark .growth-placeholder-size-btn:hover {
  background: rgba(255, 255, 255, 0.1);
}
html.theme-dark .growth-placeholder-aspect-btn.is-active,
html.theme-dark .growth-placeholder-size-btn.is-active {
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(120, 170, 255, 0.45);
}
html.theme-dark .growth-editor .growth-editor-img-placeholder-hint,
html.theme-dark .growth-editor .growth-editor-img-placeholder-plus {
  color: color-mix(in srgb, #f0eee9 70%, #6e6e73) !important;
}
.growth-editor p:not(.growth-editor-img-block) img,
.growth-editor td img,
.growth-editor th img {
  display: block;
  margin: var(--growth-gap-after-body) 0;
  max-width: 100%;
}
.growth-editor table {
  width: 100%;
  border-collapse: collapse;
  margin: 0 0 var(--growth-gap-after-body) 0;
}
.growth-editor td,
.growth-editor th {
  border: 1px solid var(--line);
  padding: 8px 10px;
  min-width: 80px;
  vertical-align: top;
}
html.theme-dark #ai-handbook.panel h2.handbook-home-title {
  color: #F0EEE9;
}
html.theme-dark .handbook-home-tab {
  color: #F0EEE9;
}
html.theme-dark .handbook-home-tab-icon {
  color: #F0EEE9;
}
html.theme-dark .handbook-home-learn-item {
  background: transparent;
  border: 0;
}
html.theme-dark .handbook-nonlearn-placeholder {
  border-color: rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.04);
}
html.theme-dark #ai-handbook .handbook-home-layout::before {
  background-image: url("/photos/macos-tahoe-26-hei.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
html.theme-dark #ai-handbook {
  background: color-mix(in srgb, var(--surface) 90%, #0a0a0c);
}
html.theme-dark #ai-handbook .handbook-home-content::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: calc(100vw + 100px);
  transform: translateX(-50%);
  background: color-mix(in srgb, var(--surface) 90%, #0a0a0c);
  z-index: -1;
}

/* 学习中心：单项容器——同一外壳收起/展开，无并排双盒子 */
.growth-learn-toc-dock {
  position: fixed;
  left: 0;
  top: 52px;
  bottom: 20px;
  z-index: 9980;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  pointer-events: none;
  width: auto;
  max-width: calc(100vw - 12px);
}
/* 须有：否则 .growth-learn-toc-dock{display:flex} 会盖掉原生 [hidden]，目录会出现在超级香蕉/案例库等页 */
.growth-learn-toc-dock[hidden] {
  display: none !important;
}
.growth-learn-toc-dock:not([hidden]) .growth-learn-toc-inner {
  pointer-events: auto;
}
.growth-learn-toc-inner {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  overflow: hidden;
  box-sizing: border-box;
  width: 34px;
  max-height: 128px;
  min-height: 108px;
  height: auto;
  border-radius: 0 14px 14px 0;
  border: 1px solid color-mix(in srgb, var(--blue) 48%, var(--line));
  border-left: none;
  background: linear-gradient(
    165deg,
    color-mix(in srgb, var(--blue) 38%, var(--surface)) 0%,
    color-mix(in srgb, var(--blue) 12%, var(--surface)) 100%
  );
  box-shadow:
    2px 0 18px rgba(0, 0, 0, 0.07),
    1px 0 0 rgba(0, 0, 0, 0.04);
  color: var(--text);
  transition:
    width 0.38s cubic-bezier(0.22, 1, 0.36, 1),
    max-height 0.42s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.35s ease;
}
.growth-learn-toc-dock:hover .growth-learn-toc-inner,
.growth-learn-toc-dock:focus-within .growth-learn-toc-inner {
  width: min(280px, calc(100vw - 20px));
  max-height: min(480px, calc(100vh - 88px));
  box-shadow:
    6px 8px 32px rgba(0, 0, 0, 0.09),
    1px 0 0 rgba(0, 0, 0, 0.05);
}
.growth-learn-toc-compact-visual {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex: 1 1 auto;
  min-width: 0;
  padding: 8px 0 10px;
  gap: 8px;
  user-select: none;
  cursor: default;
  background: transparent;
  border: 0;
}
.growth-learn-toc-compact-vertical {
  font-size: 11px;
  font-weight: 750;
  letter-spacing: 0.42em;
  writing-mode: vertical-rl;
  text-orientation: upright;
  line-height: 1;
  opacity: 0.95;
  white-space: nowrap;
  color: inherit;
}
.growth-learn-toc-compact-dots {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--text) 52%, transparent);
  opacity: 0.82;
  box-shadow:
    0 7px 0 0 color-mix(in srgb, var(--text) 52%, transparent),
    0 14px 0 0 color-mix(in srgb, var(--text) 52%, transparent);
}
.growth-learn-toc-dock:hover .growth-learn-toc-compact-dots,
.growth-learn-toc-dock:focus-within .growth-learn-toc-compact-dots {
  opacity: 0.62;
}
.growth-learn-toc-panel {
  flex: 0 0 auto;
  min-width: 0;
  width: 0;
  max-width: 0;
  min-height: 0;
  opacity: 0;
  visibility: hidden;
  overflow: hidden;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  display: flex;
  flex-direction: column;
  gap: 6px;
  transition:
    opacity 0.26s ease 0.04s,
    visibility 0s linear 0.32s;
}
.growth-learn-toc-dock:hover .growth-learn-toc-panel,
.growth-learn-toc-dock:focus-within .growth-learn-toc-panel {
  flex: 1 1 auto;
  width: auto;
  max-width: none;
  min-width: 0;
  opacity: 1;
  visibility: visible;
  padding: 10px 12px 12px 10px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.78);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition:
    opacity 0.26s ease 0.06s,
    visibility 0s linear 0s;
}
.growth-learn-toc-dock:hover .growth-learn-toc-compact-visual,
.growth-learn-toc-dock:focus-within .growth-learn-toc-compact-visual {
  display: none;
}
.growth-learn-toc-head {
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--text) 52%, var(--muted));
  padding: 2px 0 4px 4px;
  white-space: nowrap;
}
.growth-learn-toc-list {
  list-style: none;
  margin: 0;
  padding: 0 4px 2px 0;
  overflow-y: auto;
  overflow-x: hidden;
  flex: 1 1 auto;
  min-height: 0;
  -webkit-overflow-scrolling: touch;
}
.growth-learn-toc-item + .growth-learn-toc-item {
  margin-top: 2px;
}
.growth-learn-toc-link {
  display: block;
  width: 100%;
  text-align: left;
  margin: 0;
  padding: 5px 6px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--text);
  font-size: 12.5px;
  font-weight: 450;
  line-height: 1.35;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}
.growth-learn-toc-browse-num {
  display: inline;
  font-size: 10.5px;
  font-weight: 100;
  font-variation-settings: "wght" 100;
  letter-spacing: 0.05em;
  color: var(--muted);
  margin-inline-end: 0.28em;
  -webkit-font-smoothing: antialiased;
}
.growth-learn-toc-link:hover {
  background: color-mix(in srgb, var(--blue) 10%, transparent);
  color: var(--text);
}
.growth-learn-toc-level-1 .growth-learn-toc-link {
  font-weight: 630;
  font-size: 13px;
}
.growth-learn-toc-level-2 .growth-learn-toc-link {
  padding-left: 10px;
}
.growth-learn-toc-level-3 .growth-learn-toc-link {
  padding-left: 16px;
  font-weight: 400;
  color: color-mix(in srgb, var(--text) 92%, var(--muted));
  font-size: 12px;
}
.growth-learn-toc-level-4 .growth-learn-toc-link,
.growth-learn-toc-level-5 .growth-learn-toc-link,
.growth-learn-toc-level-6 .growth-learn-toc-link {
  padding-left: 22px;
  font-weight: 400;
  color: color-mix(in srgb, var(--text) 88%, var(--muted));
  font-size: 12px;
}
.growth-learn-toc-empty {
  padding: 8px 6px;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.4;
}
.growth-learn-toc-item--branch .growth-learn-toc-link {
  position: relative;
  padding-left: 22px;
}
.growth-learn-toc-item--branch .growth-learn-toc-link[data-growth-toc-branch="1"]::before {
  content: "›";
  position: absolute;
  left: 5px;
  top: 50%;
  transform: translateY(-50%) rotate(0deg);
  font-size: 14px;
  font-weight: 650;
  line-height: 1;
  opacity: 0.52;
  transition: transform 0.2s ease, opacity 0.2s ease;
}
.growth-learn-toc-link[data-growth-toc-branch="1"].is-expanded::before {
  transform: translateY(-50%) rotate(90deg);
  opacity: 0.88;
}
html.theme-dark .growth-learn-toc-item--branch .growth-learn-toc-link[data-growth-toc-branch="1"]::before {
  opacity: 0.58;
}
html.theme-dark .growth-learn-toc-inner {
  border-color: rgba(140, 180, 255, 0.32);
  background: linear-gradient(
    165deg,
    color-mix(in srgb, #5b8dff 42%, rgba(42, 42, 46, 0.96)) 0%,
    color-mix(in srgb, #5b8dff 12%, rgba(28, 28, 31, 0.98)) 100%
  );
  box-shadow:
    2px 0 22px rgba(0, 0, 0, 0.35),
    1px 0 0 rgba(255, 255, 255, 0.06);
  color: #f0eee9;
}
html.theme-dark .growth-learn-toc-dock:hover .growth-learn-toc-inner,
html.theme-dark .growth-learn-toc-dock:focus-within .growth-learn-toc-inner {
  box-shadow:
    8px 10px 40px rgba(0, 0, 0, 0.42),
    1px 0 0 rgba(255, 255, 255, 0.07);
}
html.theme-dark .growth-learn-toc-compact-dots {
  background: rgba(240, 238, 233, 0.55);
  box-shadow:
    0 7px 0 0 rgba(240, 238, 233, 0.55),
    0 14px 0 0 rgba(240, 238, 233, 0.55);
}
html.theme-dark .growth-learn-toc-dock:hover .growth-learn-toc-panel,
html.theme-dark .growth-learn-toc-dock:focus-within .growth-learn-toc-panel {
  background: color-mix(in srgb, var(--surface) 76%, transparent);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
html.theme-dark .growth-learn-toc-link:hover {
  background: rgba(255, 255, 255, 0.06);
}
html.theme-dark .growth-section-history-dock-inner {
  background: linear-gradient(
    195deg,
    color-mix(in srgb, #5b8dff 40%, rgba(42, 42, 46, 0.96)) 0%,
    color-mix(in srgb, #5b8dff 16%, rgba(28, 28, 31, 0.98)) 100%
  );
  box-shadow:
    -2px 0 22px rgba(0, 0, 0, 0.35),
    -1px 0 0 rgba(255, 255, 255, 0.06);
  color: #f0eee9;
}
html.theme-dark .growth-section-history-dock:hover .growth-section-history-dock-inner,
html.theme-dark .growth-section-history-dock:focus-within .growth-section-history-dock-inner,
html.theme-dark .growth-section-history-dock.is-expanded .growth-section-history-dock-inner {
  box-shadow:
    -8px 10px 40px rgba(0, 0, 0, 0.42),
    -1px 0 0 rgba(255, 255, 255, 0.07);
}
html.theme-dark .growth-section-history-dock:hover .growth-section-history-dock-panel,
html.theme-dark .growth-section-history-dock:focus-within .growth-section-history-dock-panel,
html.theme-dark .growth-section-history-dock.is-expanded .growth-section-history-dock-panel {
  background: color-mix(in srgb, var(--surface) 76%, transparent);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

/* 避免某处 display 覆盖 [hidden]，离开学习中心后仍露出富文本区 */
#growth-learning-stack[hidden] {
  display: none !important;
}
.growth-learning-stack:not([hidden]) {
  display: flex;
  flex-direction: column;
}
/* 学习中心历史备份：viewport 右侧固定（与左侧目录坞对齐垂直范围），不参与内容区滚动 */
.growth-section-history-dock {
  position: fixed;
  right: max(0px, env(safe-area-inset-right, 0px));
  top: 52px;
  bottom: max(20px, env(safe-area-inset-bottom, 0px));
  z-index: 9978;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  pointer-events: none;
  width: auto;
  max-width: calc(100vw - 12px - env(safe-area-inset-right, 0px) - env(safe-area-inset-left, 0px));
}
.growth-section-history-dock[hidden],
.growth-section-history-dock[aria-hidden="true"] {
  display: none !important;
}
.growth-section-history-dock:not([hidden]) .growth-section-history-dock-inner {
  pointer-events: auto;
}
.growth-section-history-dock-inner {
  position: relative;
  display: flex;
  flex-direction: row-reverse;
  align-items: stretch;
  overflow: hidden;
  box-sizing: border-box;
  width: 36px;
  max-height: 128px;
  min-height: 108px;
  height: auto;
  border-radius: 14px 0 0 14px;
  border: 1px solid color-mix(in srgb, var(--blue) 48%, var(--line));
  border-right: none;
  background: linear-gradient(
    195deg,
    color-mix(in srgb, var(--blue) 30%, var(--surface)) 0%,
    color-mix(in srgb, var(--blue) 10%, var(--surface)) 100%
  );
  box-shadow:
    -2px 0 18px rgba(0, 0, 0, 0.07),
    -1px 0 0 rgba(0, 0, 0, 0.04);
  color: var(--text);
  transition:
    width 0.38s cubic-bezier(0.22, 1, 0.36, 1),
    max-height 0.42s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.35s ease;
}
.growth-section-history-dock:hover .growth-section-history-dock-inner,
.growth-section-history-dock:focus-within .growth-section-history-dock-inner,
.growth-section-history-dock.is-expanded .growth-section-history-dock-inner {
  width: min(312px, calc(100vw - 20px));
  max-height: min(540px, calc(100vh - 170px));
  box-shadow:
    -6px 8px 32px rgba(0, 0, 0, 0.09),
    -1px 0 0 rgba(0, 0, 0, 0.05);
}
.growth-section-history-dock-handle {
  flex: 0 0 36px;
  width: 36px;
  margin: 0;
  padding: 10px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  cursor: pointer;
  box-sizing: border-box;
  line-height: 1;
}
.growth-section-history-dock-handle:hover {
  background: color-mix(in srgb, var(--text) 7%, transparent);
}
.growth-section-history-dock-handle:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: -2px;
}
.growth-section-history-dock-panel {
  flex: 0 0 auto;
  min-width: 0;
  width: 0;
  max-width: 0;
  min-height: 0;
  opacity: 0;
  visibility: hidden;
  overflow: hidden;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  display: flex;
  flex-direction: column;
  gap: 6px;
  transition:
    opacity 0.26s ease 0.04s,
    visibility 0s linear 0.32s;
}
.growth-section-history-dock:hover .growth-section-history-dock-panel,
.growth-section-history-dock:focus-within .growth-section-history-dock-panel,
.growth-section-history-dock.is-expanded .growth-section-history-dock-panel {
  flex: 1 1 auto;
  width: auto;
  max-width: none;
  min-width: 0;
  opacity: 1;
  visibility: visible;
  padding: 10px 10px 12px 12px;
  overflow: hidden;
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition:
    opacity 0.26s ease 0.06s,
    visibility 0s linear 0s;
}
.growth-section-history-dock-head {
  font-size: 12px;
  font-weight: 650;
  color: var(--muted);
  margin: 0 0 8px;
  letter-spacing: 0.06em;
}
.growth-section-history-dock-scope {
  display: block;
  margin-top: 5px;
  font-size: 11px;
  font-weight: 500;
  color: var(--muted);
  letter-spacing: 0.02em;
  line-height: 1.35;
}
.growth-section-history-loading {
  font-size: 12px;
  color: var(--muted);
  margin: 6px 0;
}
.growth-section-history-list {
  list-style: none;
  margin: 0;
  padding: 0;
  overflow-y: auto;
  overflow-x: hidden;
  flex: 1 1 auto;
  min-height: 0;
  -webkit-overflow-scrolling: touch;
}
.growth-section-history-item {
  margin: 0 0 4px;
}
.growth-section-history-item-btn {
  width: 100%;
  margin: 0;
  padding: 8px 10px;
  text-align: left;
  border: 1px solid color-mix(in srgb, var(--text) 10%, transparent);
  border-radius: 8px;
  background: color-mix(in srgb, var(--surface) 94%, var(--bg));
  color: inherit;
  font-size: 12px;
  line-height: 1.35;
  cursor: pointer;
  box-sizing: border-box;
}
.growth-section-history-item-btn:hover {
  background: color-mix(in srgb, var(--text) 6%, transparent);
}
.growth-section-history-item-btn:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--text) 28%, transparent);
  outline-offset: 1px;
}
.growth-section-history-item-btn.is-current-preview {
  border-color: color-mix(in srgb, #0a67d4 42%, transparent);
  background: color-mix(in srgb, #0a67d4 14%, transparent);
}
.growth-section-history-item-main {
  display: block;
  font-weight: 540;
  word-break: break-all;
  font-family: ui-monospace, monospace;
  font-size: 11px;
}
.growth-section-history-item-sub {
  display: block;
  margin-top: 3px;
  font-size: 11px;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.growth-section-history-empty {
  font-size: 12px;
  color: var(--muted);
  margin: 12px 0 8px;
}
.growth-history-preview-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 14px;
  padding: 10px 14px;
  margin-top: 14px;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, #0a67d4 28%, transparent);
  background: color-mix(in srgb, #0a67d4 10%, transparent);
  color: var(--text);
  position: relative;
  z-index: 30;
}
.growth-history-preview-bar[hidden],
.growth-history-preview-bar[aria-hidden="true"] {
  display: none !important;
}
.growth-history-preview-bar-msg {
  font-size: 13px;
  font-weight: 550;
  line-height: 1.4;
}
.growth-history-preview-bar-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.growth-history-preview-btn {
  padding: 7px 14px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 550;
  border: none;
  cursor: pointer;
}
.growth-history-preview-btn-cancel {
  background: color-mix(in srgb, var(--text) 8%, transparent);
  color: var(--text);
}
.growth-history-preview-btn-confirm {
  background: #0a67d4;
  color: #fff;
}
.growth-history-preview-btn:hover {
  opacity: 0.92;
}