/*!*********************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/less-loader/dist/cjs.js!./app/web/page/mcpLanding/index.less ***!
  \*********************************************************************************************************************************************************/
/**
 * 需求来源：MCP/chatgptMCP_version2.html
 * 注意事项：
 * 1. 纯 LESS 1:1 还原源 Tailwind-CDN 稿，适配 React CSS Modules（自动 scope）。
 * 2. tailwind.config 的设计 token（颜色/圆角/间距/字号）落为 .chatgptPage 上的 CSS 变量。
 * 3. body 的圆点底纹与背景色只挂在 .chatgptPage 上，避免泄漏到站点 header/footer。
 * 4. 断点对齐源 md=768px / lg=1024px 的 md:/lg: 工具类。
 */
.index__chatgptPage___EbEHD {
  /* ---- design tokens (from source tailwind.config) ---- */
  --tertiary: #505f76;
  --on-primary: #ffffff;
  --on-secondary-container: #636262;
  --error: #ba1a1a;
  --surface-container-low: #f2f4f6;
  --background: #f7f9fb;
  --inverse-surface: #2d3133;
  --surface-container-lowest: #ffffff;
  --surface-container: #eceef0;
  --primary-container: #ff7700;
  --secondary-container: #e2dfde;
  --tertiary-container: #90a0b9;
  --surface-variant: #e0e3e5;
  --secondary: #5f5e5e;
  --surface-container-highest: #e0e3e5;
  --on-background: #191c1e;
  --on-surface: #191c1e;
  --on-error: #ffffff;
  --surface: #f7f9fb;
  --inverse-on-surface: #eff1f3;
  --surface-dim: #d8dadc;
  --primary: #9b4600;
  --surface-container-high: #e6e8ea;
  --outline-variant: #e0c0b0;
  --radius-lg: 0.5rem;
  --radius-xl: 0.75rem;
  --container-max: 1280px;
  --margin-desktop: 48px;
  --margin-mobile: 16px;
  /* full-bleed so the page background covers viewport width inside #react-content */
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  overflow: hidden;
  color: var(--on-surface);
  background-color: var(--background);
  background-image: radial-gradient(circle at 1px 1px, rgba(0, 0, 0, 0.05) 1px, transparent 0);
  background-size: 32px 32px;
  font-family: Arial, 'Open Sans', Helvetica, sans-serif;
  font-size: 16px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
.index__chatgptPage___EbEHD *,
.index__chatgptPage___EbEHD *::before,
.index__chatgptPage___EbEHD *::after {
  box-sizing: border-box;
}
.index__chatgptPage___EbEHD h1,
.index__chatgptPage___EbEHD h2,
.index__chatgptPage___EbEHD h3,
.index__chatgptPage___EbEHD p {
  margin: 0 auto;
}
/* ---- typography helpers (from fontSize tokens) ---- */
.index__headlineXl___1VtBY {
  font-size: 40px;
  line-height: 48px;
  letter-spacing: -0.02em;
  font-weight: 700;
}
.index__headlineLg___iWWAJ {
  font-size: 32px;
  line-height: 40px;
  letter-spacing: -0.01em;
  font-weight: 600;
}
.index__headlineMd___Oi-SK {
  font-size: 24px;
  line-height: 32px;
  font-weight: 600;
}
.index__bodyLg___2dY5Z {
  font-size: 18px;
  line-height: 28px;
  font-weight: 400;
}
.index__bodyMd___HKcDS {
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
}
.index__labelMd___14-yh {
  /* 按钮文字：14px 放大 1.2 倍 → 17px（取整），行高同步 20px → 24px */
  font-size: 17px;
  line-height: 24px;
  letter-spacing: 0.01em;
  font-weight: 500;
}
.index__labelSm___3sgLJ {
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0.03em;
  font-weight: 600;
}
/* 桌面版 header 还会把悬浮下拉菜单 portal 到 body（触屏上不可用），同样会撑宽页面；
 * 页面级锁定横向滚动（仅 /chatgpt 加载此 CSS）。页内跳转用 rAF 手动滚动，不受 overflow 影响 */
html,
body {
  overflow-x: hidden;
}
/* 图标已改用站点全局 alicdn iconfont（.iconfont，layout 注入），
   原 Material Symbols 本地字体与 .materialSymbols 基础类移除；
   字号/颜色由下方各容器作用域的 :global(.iconfont) 规则控制 */
/* ---- shared shells ---- */
.index__container___Bqj-0 {
  width: 100%;
  max-width: var(--container-max);
  margin: 0 auto;
  /* 移动端用 16px 边距，≥768px 恢复 48px（见下方媒体查询） */
  padding: 0 var(--margin-mobile);
}
.index__glassCard___2b9pp {
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.5);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.03);
}
/* ====================================================== HERO */
.index__hero___mRGkj {
  position: relative;
  overflow: hidden;
  padding: 80px 0 80px;
  background: radial-gradient(circle at top right, rgba(255, 119, 0, 0.08), transparent 40%), radial-gradient(circle at bottom left, rgba(255, 119, 0, 0.05), transparent 30%);
}
.index__heroInner___j2kSJ {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 var(--margin-mobile);
  text-align: center;
}
.index__heroBadge___-SWWo {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 16px;
  border-radius: 9999px;
  background: rgba(255, 119, 0, 0.1);
  color: var(--primary-container);
  margin-bottom: 24px;
  animation: index__cjmcpFadeIn___1Ju_1 0.5s ease-out forwards;
}
.index__heroBadge___-SWWo .iconfont {
  font-size: 18px;
  line-height: 1;
}
.index__heroBadge___-SWWo span:last-child {
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.index__heroTitle___1rcO- {
  margin: 0 auto 24px;
  max-width: 56rem;
  font-size: 40px;
  line-height: 48px;
  letter-spacing: -0.02em;
  font-weight: 700;
}
.index__heroTitle___1rcO- span {
  color: var(--primary-container);
}
.index__heroSubtitle___3DsqP {
  color: var(--tertiary);
  margin: 0 auto 40px;
  max-width: 42rem;
}
.index__heroButtons___1rM-k {
  display: flex;
  flex-direction: column;
  gap: 16px;
  justify-content: center;
  align-items: center;
  margin-top: 16px;
  margin-bottom: 64px;
}
.index__btnPrimary___vUMjB {
  background: #ff7700;
  color: #fff;
  padding: 16px 40px;
  border: none;
  border-radius: var(--radius-xl);
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 10px 15px -3px rgba(249, 115, 22, 0.2);
  transition: all 0.2s ease;
}
.index__btnPrimary___vUMjB:hover {
  opacity: 0.9;
}
.index__btnPrimary___vUMjB:active {
  transform: scale(0.95);
}
.index__btnSecondary___o0cK0 {
  display: inline-block;
  background: #fff;
  color: var(--on-surface);
  border: 1px solid var(--outline-variant);
  padding: 16px 40px;
  border-radius: var(--radius-xl);
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s ease;
  text-decoration: none;
  /* 兼容 <a> 形态，覆盖全局链接样式 */
}
.index__btnSecondary___o0cK0:hover,
.index__btnSecondary___o0cK0:focus {
  background: var(--surface);
  color: var(--on-surface);
  text-decoration: none;
}
/* ===== Hero split 布局（左插图 / 右文字）：Codex 等无聊天预览的页面使用。
   移动端纵向堆叠（插图在上），≥1024px 横向左右、文字左对齐。 */
.index__heroSplit___1E2Ag {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
}
.index__heroSplitMedia___3APbb {
  width: 100%;
  max-width: 520px;
  filter: drop-shadow(0 24px 48px rgba(229, 106, 0, 0.18));
}
.index__heroSplitMedia___3APbb svg {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 20px;
}
.index__heroSplitText___3aD72 {
  width: 100%;
}
/* split 文字区内：去掉按钮下方为预览预留的大间距 */
.index__heroSplitText___3aD72 .index__heroButtons___1rM-k {
  margin-bottom: 0;
}
/* 头部插图动画（作用域内全局类，对应 codex插图.html 的 .line/.cursor/.steam） */
.index__heroSplitMedia___3APbb .line {
  opacity: 0;
  animation: index__cjmcpRise___3dpLE 0.5s ease forwards;
}
.index__heroSplitMedia___3APbb .line:nth-child(1) {
  animation-delay: 0.2s;
}
.index__heroSplitMedia___3APbb .line:nth-child(2) {
  animation-delay: 0.6s;
}
.index__heroSplitMedia___3APbb .line:nth-child(3) {
  animation-delay: 1s;
}
.index__heroSplitMedia___3APbb .line:nth-child(4) {
  animation-delay: 1.4s;
}
.index__heroSplitMedia___3APbb .line:nth-child(5) {
  animation-delay: 1.8s;
}
.index__heroSplitMedia___3APbb .cursor {
  animation: index__cjmcpBlink___3s6iV 1.1s steps(1) infinite;
}
.index__heroSplitMedia___3APbb .steam {
  animation: index__cjmcpSteam___1cc3u 2.6s ease-in-out infinite;
  transform-origin: center bottom;
}
.index__heroSplitMedia___3APbb .steam.b {
  animation-delay: 1.1s;
}
@keyframes index__cjmcpRise___3dpLE {
  from {
    opacity: 0;
    transform: translateY(4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes index__cjmcpBlink___3s6iV {
  50% {
    opacity: 0;
  }
}
@keyframes index__cjmcpSteam___1cc3u {
  0% {
    opacity: 0;
    transform: translateY(0) scaleY(0.6);
  }
  40% {
    opacity: 0.55;
  }
  100% {
    opacity: 0;
    transform: translateY(-14px) scaleY(1.1);
  }
}
/* Claude 头部插图动画（对应 claude-cj-mcp插图.html 的 .seq/.bar/.spark/.bolt，.steam 复用上方规则） */
.index__heroSplitMedia___3APbb .seq {
  opacity: 0;
  animation: index__cjmcpRise___3dpLE 0.5s ease forwards;
}
.index__heroSplitMedia___3APbb .seq:nth-of-type(1) {
  animation-delay: 0.2s;
}
.index__heroSplitMedia___3APbb .seq:nth-of-type(2) {
  animation-delay: 0.6s;
}
.index__heroSplitMedia___3APbb .seq:nth-of-type(3) {
  animation-delay: 1s;
}
.index__heroSplitMedia___3APbb .seq:nth-of-type(4) {
  animation-delay: 1.4s;
}
.index__heroSplitMedia___3APbb .bar {
  transform-box: fill-box;
  transform-origin: bottom;
  transform: scaleY(0);
  animation: index__cjmcpGrow___3LHRS 1s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}
.index__heroSplitMedia___3APbb .bar:nth-of-type(1) {
  animation-delay: 0.8s;
}
.index__heroSplitMedia___3APbb .bar:nth-of-type(2) {
  animation-delay: 0.95s;
}
.index__heroSplitMedia___3APbb .bar:nth-of-type(3) {
  animation-delay: 1.1s;
}
.index__heroSplitMedia___3APbb .bar:nth-of-type(4) {
  animation-delay: 1.25s;
}
.index__heroSplitMedia___3APbb .bar:nth-of-type(5) {
  animation-delay: 1.4s;
}
.index__heroSplitMedia___3APbb .bar:nth-of-type(6) {
  animation-delay: 1.55s;
}
.index__heroSplitMedia___3APbb .spark {
  transform-box: fill-box;
  transform-origin: center;
  animation: index__cjmcpTwinkle___2d45x 2.2s ease-in-out infinite;
}
.index__heroSplitMedia___3APbb .spark.b {
  animation-delay: 0.7s;
}
.index__heroSplitMedia___3APbb .spark.c {
  animation-delay: 1.3s;
}
.index__heroSplitMedia___3APbb .bolt {
  transform-box: fill-box;
  transform-origin: center;
  animation: index__cjmcpPulse___1axkN 1.8s ease-in-out infinite;
}
@keyframes index__cjmcpGrow___3LHRS {
  to {
    transform: scaleY(1);
  }
}
@keyframes index__cjmcpTwinkle___2d45x {
  0%,
  100% {
    opacity: 0.35;
    transform: scale(0.7);
  }
  50% {
    opacity: 1;
    transform: scale(1.1);
  }
}
@keyframes index__cjmcpPulse___1axkN {
  0%,
  100% {
    transform: scale(1);
    opacity: 0.9;
  }
  50% {
    transform: scale(1.12);
    opacity: 1;
  }
}
/* hero preview */
.index__heroPreviewWrap___3bc52 {
  position: relative;
  max-width: 64rem;
  /* 移动端拉宽：负 margin 抵消 .heroInner 的 16px 内边距，距屏幕边缘仅留 10px */
  margin: 48px calc(10px - var(--margin-mobile)) 0;
}
.index__heroPreviewCard___1AUsm {
  border-radius: 32px;
  padding: 8px;
  overflow: hidden;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}
.index__heroPreviewInner___2zTXk {
  background: #fff;
  border-radius: 24px;
  border: 1px solid var(--surface-variant);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.index__previewBar___3uGG3 {
  height: 48px;
  border-bottom: 1px solid var(--surface-variant);
  display: flex;
  align-items: center;
  padding: 0 24px;
  background: var(--surface-container-low);
  justify-content: space-between;
}
.index__previewDots___OT7zz {
  display: flex;
  gap: 8px;
}
.index__previewDot___pzr6w {
  width: 12px;
  height: 12px;
  border-radius: 50%;
}
.index__dotRed___2MoIr {
  background: #f87171;
}
.index__dotYellow___QWsD0 {
  background: #facc15;
}
.index__dotGreen___3GNh2 {
  background: #4ade80;
}
.index__previewBarTitle___1U_Vs {
  color: var(--tertiary);
  font-weight: 500;
}
.index__previewBarSpacer___IYW_n {
  width: 48px;
}
.index__previewBody___224TI {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  padding: 24px;
  text-align: left;
  background: #fcfdfe;
}
.index__chatRow___2O9OM {
  display: flex;
  gap: 16px;
  margin-bottom: 32px;
}
.index__chatRow___2O9OM:last-child {
  margin-bottom: 0;
}
.index__chatAvatar___3BaZQ {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.index__chatAvatar___3BaZQ .iconfont {
  color: #fff;
  font-size: 20px;
  line-height: 1;
}
.index__avatarUser___Z2EYe {
  background: var(--primary-container);
}
.index__avatarBot___Y0p8_ {
  background: #1e293b;
}
.index__userBubble___3uK52 {
  background: var(--surface-container-high);
  padding: 16px;
  border-radius: 16px;
  border-top-left-radius: 0;
  max-width: 28rem;
}
.index__botBubble___3ztcU {
  background: #fff;
  border: 1px solid var(--surface-variant);
  padding: 20px;
  border-radius: 16px;
  border-top-left-radius: 0;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  max-width: 42rem;
}
.index__botBubble___3ztcU > p {
  margin-bottom: 16px;
}
.index__botProductGrid___LEN0q {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}
.index__botProductCard___3_Xhy {
  border: 1px solid var(--surface-variant);
  border-radius: var(--radius-xl);
  padding: 12px;
  display: flex;
  gap: 12px;
}
.index__botProductThumb___3tQLH {
  width: 64px;
  height: 64px;
  background: var(--surface);
  border-radius: var(--radius-lg);
  flex-shrink: 0;
  object-fit: cover;
}
.index__botProductName___oHquw {
  font-weight: 700;
  font-size: 14px;
  /* 最多两行，溢出省略号 */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.index__botProductPrice___zjN9q {
  color: var(--primary-container);
  font-weight: 700;
  font-size: 12px;
}
.index__botProductShip___3ufMB {
  color: var(--tertiary);
  font-size: 10px;
}
.index__heroBlob___1DsB9 {
  position: absolute;
  border-radius: 50%;
  filter: blur(48px);
  z-index: -10;
}
.index__heroBlob1___3nZXW {
  top: -40px;
  right: -40px;
  width: 160px;
  height: 160px;
  background: rgba(255, 119, 0, 0.1);
}
.index__heroBlob2___2DWC- {
  bottom: -80px;
  left: -80px;
  width: 240px;
  height: 240px;
  background: rgba(255, 119, 0, 0.05);
}
/* ====================================================== SHARED SECTION HEAD */
.index__sectionHeadCenter___2-c0p {
  text-align: center;
  margin-bottom: 64px;
}
.index__sectionHeadCenter___2-c0p h2 {
  margin-bottom: 16px;
}
.index__sectionHeadCenter___2-c0p p {
  color: var(--tertiary);
}
.index__sectionHeadCenter___2-c0p .index__narrow___2wejV {
  max-width: 42rem;
  margin: 0 auto;
}
/* ======================================== RECOMMENDED PROMPTS
 * 样式参考 MCP/chatgptMCP_version1.html「不知道怎么开始？试试这样问」区块：
 * pill 徽标 + 玻璃卡 chip（左主题色类目图标 / 中文案 / 右复制态图标），
 * hover 主题色描边+阴影，复制成功态橙色描边+浅橙底。 */
.index__prompts___1hce0 {
  padding: 96px 0;
  background: var(--surface-container-lowest);
  border-top: 1px solid rgba(0, 0, 0, 0.05);
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}
.index__promptGrid___1AwbL {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}
/* 每条提问是一个可点击卡片：点击复制到剪贴板。整卡可点，左类目图标 / 右复制态反馈。 */
.index__promptCard___1GPJa {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  width: 100%;
  text-align: left;
  padding: 24px;
  border: 1px solid rgba(0, 0, 0, 0.05);
  border-radius: var(--radius-xl);
  cursor: pointer;
  color: var(--on-surface);
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}
.index__promptCard___1GPJa:hover {
  transform: translateY(-2px);
  border-color: rgba(255, 119, 0, 0.4);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.08);
}
/* 左侧类目图标：主题色，顶部对齐（items-start + 微调 mt）。
   内容图标在 20px 基础上放大 2px → 22px。 */
.index__promptLeadIcon___2wJPG {
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  margin-top: 2px;
  display: block;
  color: var(--primary-container);
}
.index__promptText___2Bst2 {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 18px;
  /* 内容文字从 16px 调整为 18px（覆盖 .bodyMd） */
  line-height: 1.5;
  word-break: break-word;
}
/* 右侧复制态：默认灰、hover/复制成功转主题色 */
.index__promptCopy___GqeBf {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 2px;
  color: var(--tertiary);
  transition: color 0.2s ease;
}
.index__promptCard___1GPJa:hover .index__promptCopy___GqeBf {
  color: var(--primary-container);
}
.index__promptCopyIcon___36dgb {
  width: 18px;
  height: 18px;
  display: block;
}
/* 复制成功文案：跟随 .promptCopy 转主题色，字号与玻璃卡内容协调 */
.index__promptCopyLabel___249Mh {
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
}
/* 默认复制按钮：站点 iconfont 字形 iconfuzhijianyue（字号控制大小，颜色继承 .promptCopy） */
.index__promptCopyGlyph___3yIMg {
  font-size: 18px;
  line-height: 1;
}
/* 复制成功瞬时态：整卡橙色描边 + 浅橙底，反馈区转主题色。 */
.index__promptCardCopied___ztR0B {
  border-color: var(--primary-container);
  background: rgba(255, 119, 0, 0.06);
}
.index__promptCardCopied___ztR0B .index__promptCopy___GqeBf {
  color: var(--primary-container);
}
/* ====================================================== CAPABILITIES */
.index__capabilities___xT_af {
  padding: 96px 0;
  background: var(--surface-container-lowest);
}
.index__capHead___KlRna {
  max-width: 48rem;
  margin-bottom: 80px;
}
.index__capHead___KlRna h2 {
  margin-bottom: 24px;
}
.index__capHead___KlRna h2 span {
  color: var(--primary-container);
}
.index__capHead___KlRna p {
  color: var(--tertiary);
}
.index__capGrid___3dY-v {
  display: grid;
  grid-template-columns: 1fr;
  column-gap: 48px;
  row-gap: 80px;
}
.index__capCard___2LKag {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.index__capImageWrap___3XK_t {
  width: 100%;
  aspect-ratio: 1;
  border-radius: 40px;
  background: var(--surface-container-low);
  border: 2px solid var(--surface-container-low);
  /* 边框与容器背景同色系 */
  margin-bottom: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.index__capImageWrap___3XK_t img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}
.index__capImageWrap___3XK_t img:hover {
  transform: scale(1.05);
}
.index__capCard___2LKag h3 {
  margin-bottom: 12px;
}
.index__capCard___2LKag p {
  color: var(--tertiary);
  line-height: 1.625;
}
/* ====================================================== OPERATION */
.index__operation___5YGw7 {
  padding: 96px 0;
  background: var(--surface);
  scroll-margin-top: 72px;
  /* 锚点滚动时为站点顶栏预留空间（桌面/移动通用） */
}
.index__operationLayout___3-0Yk {
  display: flex;
  flex-direction: column;
  gap: 48px;
  align-items: flex-start;
}
.index__operationNav___3i44j {
  /* 移动端隐藏纵向步骤列表，改用 .operationStepper 横向步骤条；≥1024px 恢复显示 */
  display: none;
  width: 100%;
  flex-direction: column;
  gap: 16px;
}
/* ------------------------------ 移动端横向步骤条 */
.index__operationStepper___2va1Q {
  width: 100%;
  background: #fff;
  border-radius: var(--radius-xl);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  padding: 16px;
}
.index__stepperTop___21z34 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}
.index__stepperBar___3zS9J {
  width: 56px;
  height: 6px;
  border-radius: 3px;
  background: #c7c4f4;
  overflow: hidden;
  display: block;
}
.index__stepperBarFill___Aa2I3 {
  display: block;
  height: 100%;
  border-radius: 3px;
  background: #4f46e5;
  transition: width 0.3s ease;
}
.index__stepperCount___3_brL {
  background: var(--surface-container-low);
  color: var(--tertiary);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.05em;
  border-radius: 999px;
  padding: 4px 12px;
}
.index__stepperTrack___1WLi3 {
  display: flex;
  align-items: center;
}
.index__stepperLine___1d5Y0 {
  flex: 1;
  height: 2px;
  background: var(--surface-variant);
  min-width: 8px;
}
.index__stepperLineDone___tH8I_ {
  background: #34b27d;
}
.index__stepperDot___35lz1 {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: none;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 14px;
  cursor: pointer;
  background: var(--surface-container);
  color: var(--tertiary);
  transition: all 0.2s ease;
}
.index__stepperDotDone___3aXZ7 {
  background: #34b27d;
  color: #fff;
}
.index__stepperDotActive___10Mmg {
  background: var(--primary-container);
  color: #fff;
  box-shadow: 0 0 0 5px #ffeede;
}
.index__stepperCurrent___20JYv {
  margin-top: 16px;
  text-align: center;
}
.index__stepBtn____8-Oc {
  width: 100%;
  text-align: left;
  padding: 24px;
  border-radius: 16px;
  border: 1px solid transparent;
  background: transparent;
  cursor: pointer;
  transition: all 0.2s ease;
}
.index__stepBtn____8-Oc:hover {
  background: var(--surface-container-low);
}
.index__stepBtnActive___1UKB0 {
  background: #fff;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  border-left: 4px solid #ff7700;
}
.index__stepRow___2nvBs {
  display: flex;
  align-items: center;
  gap: 16px;
}
.index__stepNum___2Q5ph {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  background: var(--secondary-container);
  color: var(--on-secondary-container);
  flex-shrink: 0;
}
.index__stepBtnActive___1UKB0 .index__stepNum___2Q5ph {
  background: var(--primary-container);
  color: #fff;
}
.index__stepTitle___33tNh {
  font-size: 18px;
  font-weight: 600;
  line-height: 1.3;
}
.index__stepLabel___1TCOV {
  color: var(--tertiary);
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0.03em;
  font-weight: 600;
}
.index__operationContent___3iFeK {
  width: 100%;
  border-radius: 40px;
  padding: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.index__operationFade___1YkZc {
  width: 100%;
  animation: index__cjmcpFadeIn___1Ju_1 0.5s ease-out forwards;
}
.index__operationImg___3FiqD {
  width: 100%;
  /* 移动端：按源图宽高比（1600×908）占位，高度随宽度自适应（auto）。
     切换步骤时容器先占好高度，避免新图加载前塌陷、加载后回弹造成的「闪一下」。
     桌面端（≥1024px）改为固定高度 350px，见下方媒体查询。 */
  aspect-ratio: 1.76211454;
  height: auto;
  object-fit: cover;
  background: var(--surface-variant);
  border-radius: 16px;
  border: 1px solid var(--surface-variant);
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  display: block;
  cursor: zoom-in;
  /* 点击放大 */
}
/* 操作步骤的代码块/终端形态（step.code）：无截图的命令/配置步骤（如 Codex 改 config.toml）。
   桌面端与 .operationImg 同为固定高度 350px（见媒体查询），超出滚动；移动端高度自适应。 */
.index__operationCode___OBvjb {
  width: 100%;
  margin: 0;
  padding: 20px;
  border-radius: 16px;
  /* 浅色系代码块：浅灰底 + 深色文字（替换原黑底终端配色） */
  background: var(--surface-container-low);
  color: var(--on-surface);
  border: 1px solid var(--surface-variant);
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.08);
  overflow: auto;
  font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
  font-size: 13px;
  line-height: 1.7;
  white-space: pre;
  tab-size: 2;
}
.index__operationCode___OBvjb code {
  font-family: inherit;
}
.index__operationDescWrap___2CJxj {
  margin-top: 32px;
  text-align: center;
  padding: 0 16px;
}
.index__operationDesc___3EYUU {
  font-weight: 500;
}
/* desc 内嵌的内联 <code>（如 curl / accessToken / config.toml）：
   去掉站点全局 code 的特殊（粉色）配色，跟随正文同色系，仅保留等宽与轻微底色以作区分。 */
.index__operationDesc___3EYUU code {
  color: inherit;
  background: rgba(0, 0, 0, 0.05);
  padding: 1px 6px;
  border-radius: 6px;
  font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
  font-size: 0.92em;
}
/* desc 内嵌的 HTML 链接（如 server URL） */
.index__operationDesc___3EYUU a {
  color: var(--primary-container);
  font-weight: 700;
  text-decoration: underline;
  word-break: break-word;
}
.index__operationDesc___3EYUU a:hover {
  opacity: 0.8;
}
/* 点击放大遮罩：全屏居中大图。
   z-index 取极大值，盖过站点固定头部（z≤1800）、客服悬浮件与 iframe（z≈1e5）。 */
.index__lightbox___1nZAn {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(0, 0, 0, 0.8);
  backdrop-filter: blur(4px);
  cursor: zoom-out;
  animation: index__cjmcpFadeIn___1Ju_1 0.2s ease-out forwards;
}
.index__lightboxImg___3T3ei {
  max-width: 95vw;
  max-height: 90vh;
  width: auto;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
  cursor: default;
}
.index__lightboxClose___1KFyA {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.15);
  color: #fff;
  cursor: pointer;
  transition: background 0.2s ease;
}
.index__lightboxClose___1KFyA:hover {
  background: rgba(255, 255, 255, 0.3);
}
.index__lightboxCloseIcon___4K0M2 {
  width: 24px;
  height: 24px;
  display: block;
}
/* ====================================================== FAQ */
.index__faq___1lUIF {
  padding: 96px 0;
  background: #fff;
}
.index__faqInner___3tT7v {
  max-width: 56rem;
  margin: 0 auto;
  padding: 0 var(--margin-mobile);
}
.index__faqList___31ofk {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.index__faqItem___1vHOm {
  border: 1px solid var(--surface-variant);
  border-radius: 16px;
  overflow: hidden;
}
.index__faqQuestion___2MI08 {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 24px;
  text-align: left;
  background: transparent;
  border: none;
  cursor: pointer;
  transition: background 0.2s ease;
  font-size: 18px;
  font-weight: 600;
  color: inherit;
}
.index__faqQuestion___2MI08:hover {
  background: var(--surface-container-low);
}
.index__faqIcon___3mEws {
  color: var(--primary-container);
  transition: transform 0.3s ease;
}
.index__faqIconOpen___ppj5J {
  transform: rotate(180deg);
}
.index__faqAnswer___2lZ3k {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  color: var(--tertiary);
  line-height: 1.625;
  transition: max-height 0.4s ease, opacity 0.3s ease, padding 0.3s ease;
  padding: 0 24px;
}
.index__faqAnswerOpen___7r_vU {
  max-height: 400px;
  opacity: 1;
  padding: 12px 24px 24px;
  border-top: 1px solid rgba(224, 227, 229, 0.3);
}
/* ====================================================== CTA */
.index__cta___1wH5Y {
  /* 移动端不需要大间距，固定 10px；≥768px 恢复桌面间距 */
  padding: 10px;
}
.index__ctaCard___njYuU {
  max-width: 64rem;
  margin: 0 auto;
  border-radius: 48px;
  padding: 48px;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.index__ctaBg___1SVnB {
  position: absolute;
  inset: 0;
  background: rgba(255, 119, 0, 0.05);
  z-index: -10;
}
.index__ctaInner___1bC2A {
  position: relative;
  z-index: 10;
}
.index__ctaCard___njYuU h2 {
  margin-bottom: 24px;
}
.index__ctaSubtitle____u5ap {
  color: var(--tertiary);
  margin: 0 auto 40px;
  max-width: 36rem;
}
/* 邮箱表单已移除，仅保留操作文档按钮（<a> 形态） */
.index__ctaButton___32qXC {
  display: inline-block;
  margin-top: 16px;
  background: var(--primary-container);
  color: #fff;
  padding: 16px 32px;
  border: none;
  border-radius: 16px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 10px 15px -3px rgba(249, 115, 22, 0.2);
  transition: opacity 0.2s ease;
  text-decoration: none;
}
.index__ctaButton___32qXC:hover,
.index__ctaButton___32qXC:focus {
  opacity: 0.9;
  color: #fff;
  text-decoration: none;
}
.index__ctaButton___32qXC:active {
  transform: scale(0.95);
}
/* ====================================================== ANIMATIONS */
@keyframes index__cjmcpFadeIn___1Ju_1 {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* ====================================================== RESPONSIVE */
@media (min-width: 640px) {
  .index__heroButtons___1rM-k {
    flex-direction: row;
  }
  .index__heroPreviewCard___1AUsm {
    padding: 16px;
  }
  .index__previewBody___224TI {
    padding: 40px;
  }
  .index__botProductGrid___LEN0q {
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 768px) {
  .index__container___Bqj-0,
  .index__heroInner___j2kSJ,
  .index__faqInner___3tT7v {
    padding: 0 var(--margin-desktop);
  }
  .index__hero___mRGkj {
    padding: 96px 0 128px;
  }
  .index__heroPreviewWrap___3bc52 {
    margin: 48px auto 0;
  }
  .index__heroTitle___1rcO- {
    font-size: 64px;
    line-height: 1.1;
  }
  .index__promptGrid___1AwbL {
    grid-template-columns: 1fr 1fr;
  }
  .index__capGrid___3dY-v {
    grid-template-columns: 1fr 1fr;
  }
  .index__cta___1wH5Y {
    padding: 96px var(--margin-desktop);
  }
  .index__ctaCard___njYuU {
    padding: 80px;
  }
}
@media (min-width: 1024px) {
  .index__capGrid___3dY-v {
    grid-template-columns: repeat(3, 1fr);
  }
  /* Hero split：桌面横向左右，文字左对齐 */
  .index__heroSplit___1E2Ag {
    flex-direction: row;
    align-items: center;
    gap: 56px;
    text-align: left;
  }
  .index__heroSplitMedia___3APbb {
    flex: 1 1 48%;
    max-width: none;
  }
  .index__heroSplitText___3aD72 {
    flex: 1 1 52%;
  }
  .index__heroSplitText___3aD72 .index__heroTitle___1rcO-,
  .index__heroSplitText___3aD72 .index__heroSubtitle___3DsqP {
    margin-left: 0;
    margin-right: 0;
  }
  .index__heroSplitText___3aD72 .index__heroButtons___1rM-k {
    justify-content: flex-start;
  }
  .index__operationLayout___3-0Yk {
    flex-direction: row;
  }
  .index__operationNav___3i44j {
    display: flex;
    width: 33.333%;
    position: sticky;
    top: 96px;
  }
  .index__operationStepper___2va1Q {
    display: none;
  }
  .index__operationContent___3iFeK {
    width: 66.666%;
    padding: 32px;
    min-height: 500px;
    /* 仅桌面端保留最小高度，移动端随内容自适应 */
  }
  /* 桌面端步骤图固定高度 350px（移动端仍按宽高比 auto） */
  .index__operationImg___3FiqD {
    height: 350px;
    aspect-ratio: auto;
  }
  /* 代码块步骤桌面端同样固定 350px，内容超出滚动 */
  .index__operationCode___OBvjb {
    height: 350px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .index__chatgptPage___EbEHD *,
  .index__chatgptPage___EbEHD *::before,
  .index__chatgptPage___EbEHD *::after {
    animation: none !important;
    transition: none !important;
  }
}