/* 指南页面容器 */
 .guide-wrap {
   display: flex;
   gap: 30px;
   margin-top: 20px;
   position: relative;
 }

 /* 指南左侧固定导航 */
 .guide-left-nav {
   min-width: 200px;
   position: sticky;
   top: 92px;
   align-self: flex-start;
 }

 .guide-left-nav ul {
   list-style: none;
   display: flex;
   flex-direction: column;
   gap: 10px;
 }

 .guide-nav-item {
   padding: 12px 16px;
   border-radius: 6px;
   cursor: pointer;
   color: #b8b8d0;
   border: 1px solid transparent;
   transition: all 0.3s ease;
 }

 .guide-nav-item:hover {
   background: rgba(130, 90, 240, 0.18);
   color: #e0d0ff;
 }

 .guide-nav-item.active {
   background: linear-gradient(135deg, rgba(110, 70, 220, 0.22), rgba(60, 160, 255, 0.12));
   border: 1px solid rgba(140, 100, 255, 0.4);
   color: #d8c8ff;
   box-shadow: 0 0 8px rgba(120, 80, 240, 0.2);
 }

 /* 指南右侧内容区域 */
 .guide-content-box {
   flex: 1;
 }

 .guide-content-block {
   display: none;
 }

 .guide-content-block.show {
   display: block;
 }

 /* 移动端适配指南页 */
 @media screen and (max-width:768px) {
   .guide-wrap {
     flex-direction: column;
   }

   .guide-left-nav {
     position: static;
   }

   .guide-left-nav ul {
     flex-direction: row;
     flex-wrap: wrap;
   }
 }

 /* 旅行历程 整体区域样式 */
 .guide-content-block#gd-journey {
   width: 100%;
   padding: 10px;
 }

 /* 顶部大标题 */
 .timeline-main-title {
   text-align: center;
   font-size: 28px;
   margin: 0 auto 22px;
   background: linear-gradient(135deg, #63b8ff, #9470ff, #ffdd77);
   -webkit-background-clip: text;
   background-clip: text;
   color: transparent;
   letter-spacing: 1px;
 }

 /* 导航栏外层容器 居中约束宽度 */
 .tabs-nav-wrap {
   max-width: 940px;
   margin: 0 auto 30px;
   position: relative;
   padding: 8px 46px;
   border-bottom: 1px solid rgba(140, 120, 220, 0.2);
 }

 /* 左右翻页箭头 */
 .tab-arrow {
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
   width: 34px;
   height: 34px;
   background: transparent;
   border: none;
   color: #b8b0e2;
   font-size: 20px;
   cursor: pointer;
   transition: 0.2s all;
 }

 .tab-arrow.left {
   left: 6px;
 }

 .tab-arrow.right {
   right: 6px;
 }

 .tab-arrow:hover {
   color: #ffdd70;
 }

 /* 标签横向容器 */
 .tabs-list {
   display: flex;
   gap: 10px;
   justify-content: center;
   align-items: center;
 }

 /* 单个标签胶囊样式 */
 .tab-item {
   padding: 7px 16px;
   border-radius: 999px;
   cursor: pointer;
   transition: all 0.25s ease;
   white-space: nowrap;
 }

 .tab-text {
   font-size: 16px;
   color: #a8a8d0;
 }

 /* 未选中hover */
 .tab-item:not(.active):hover {
   background: rgba(130, 90, 220, 0.09);
 }

 .tab-item:not(.active):hover .tab-text {
   color: #d4c6ff;
 }

 /* 激活标签紫蓝渐变 */
 .tab-item.active {
   background: linear-gradient(120deg, #7845d7, #4085df);
   box-shadow: 0 2px 9px rgba(110, 60, 210, 0.28);
 }

 .tab-item.active .tab-text {
   color: #ffffff;
 }

 /* 下方内容容器 和导航同宽居中 */
 .tabs-content-wrap {
   max-width: 940px;
   margin: 0 auto;
 }

 /* 内容区块切换淡入动画 */
 .tab-content-block {
   display: none;
   opacity: 0;
   transform: translateY(5px);
   transition: opacity 0.32s ease, transform 0.32s ease;
 }

 .tab-content-block.show {
   display: block;
   opacity: 1;
   transform: translateY(0);
 }

 /* 内容内标题居中 */
 .tab-content-title {
   text-align: center;
   font-size: 24px;
   margin-bottom: 16px;
   background: linear-gradient(135deg, #63b8ff, #9470ff, #ffdd77);
   -webkit-background-clip: text;
   background-clip: text;
   color: transparent;
 }

 /* 内容描述文本 */
 .tab-content-desc {
   color: #c2c2e0;
   line-height: 1.7;
   text-align: center;
   font-size: 16px;
 }

 /* 移动端适配 */
 @media screen and (max-width: 980px) {

   .tabs-nav-wrap,
   .tabs-content-wrap {
     max-width: unset;
     width: 100%;
   }
 }

 @media screen and (max-width: 768px) {
   .timeline-main-title {
     font-size: 24px;
   }

   .tabs-nav-wrap {
     padding: 6px 34px;
   }

   .tabs-list {
     overflow-x: auto;
     justify-content: flex-start;
     padding-bottom: 4px;
   }

   .tab-item {
     flex-shrink: 0;
   }

   .tab-text {
     font-size: 14px;
   }

   .tab-content-title {
     font-size: 26px;
   }
 }

 /* 蒙德璃月1.0-1.6版本横向卡片容器 */
 .mond-liyue-version-wrap {
   width: 100%;
   display: flex;
   gap: 24px;
   justify-content: center;
   flex-wrap: wrap;
   margin-top: 36px;
 }

 /* 单个版本卡片 */
 .version-card {
   width: 281px;
   display: flex;
   flex-direction: column;
   align-items: center;
 }

 /* 版本封面图 */
 .version-img {
   width: 100%;
   height: 159px;
   object-fit: cover;
   border-radius: 10px;
   border: 1px solid rgba(160, 130, 240, 0.2);
   transition: 0.3s ease;
 }

 .version-img:hover {
   border-color: #ffdd7080;
   box-shadow: 0 0 14px rgba(255, 220, 100, 0.25);
   transform: translateY(-4px);
 }

 /* 版本标题 */
 .version-title {
   font-size: 17px;
   color: #fffef8;
   text-align: center;
   margin: 12px 0 6px;
   line-height: 1.4;
 }

 /* 版本描述文本 */
 .version-desc {
   font-size: 14px;
   color: #b8b8d8;
   text-align: center;
   line-height: 1.6;
 }

 /* 移动端自适应换行 */
 @media screen and (max-width:1080px) {
   .version-card {
     width: 210px;
   }

   .version-img {
     height: 120px;
   }
 }

 @media screen and (max-width:768px) {
   .mond-liyue-version-wrap {
     gap: 16px;
   }

   .version-card {
     width: 44%;
     min-width: 160px;
   }

   .version-title {
     font-size: 15px;
   }

   .version-desc {
     font-size: 13px;
   }
 }