fantasia-ui 0.4.0 → 0.6.1

package/dist/fantasia-ui.css

@@ -3552,6 +3552,7 @@
   padding: 20px;
   backdrop-filter: blur(2px);
   transition: background-color 0.25s ease;
+  touch-action: none;
 }
 
 .f-dialog {
@@ -3627,10 +3628,15 @@
   color: #606266;
   font-size: 14px;
   line-height: 1.6;
+  overflow: hidden;
+  -webkit-overflow-scrolling: touch;
 }
 .f-dialog__body :deep(.f-scrollbar) {
   height: 100%;
 }
+.f-dialog__body :deep(.f-scrollbar__wrap) {
+  -webkit-overflow-scrolling: touch;
+}
 .f-dialog__body :deep(.f-scrollbar__view) {
   padding: 0;
 }
@@ -3695,6 +3701,24 @@
   transform: scale(1) translateY(0);
 }
 
+@media (max-width: 768px) {
+  .f-dialog-overlay {
+    padding: 10px;
+  }
+  .f-dialog {
+    width: 95vw;
+    max-height: 85vh;
+  }
+  .f-dialog__header {
+    padding: 16px 16px 12px;
+  }
+  .f-dialog__body {
+    padding: 16px;
+  }
+  .f-dialog__footer {
+    padding: 12px 16px;
+  }
+}
 .f-divider {
   position: relative;
 }
@@ -4806,37 +4830,22 @@
 }
 
 .f-marquee {
+  position: relative;
+  width: 100%;
   overflow: hidden;
-  white-space: nowrap;
-  background: linear-gradient(90deg, #fff1f8, #fdf2f8, #fff7ed);
-  border: 1px solid #f9d8ea;
-  border-radius: 8px;
-  padding: 8px 0;
 }
-.f-marquee__track {
-  display: inline-flex;
-  align-items: center;
-  width: max-content;
-  min-width: 100%;
-  animation: f-marquee-scroll var(--duration, 28s) linear infinite;
-  animation-direction: var(--dir, normal);
-  font-size: 14px;
-  font-weight: 600;
-  color: #9d174d;
-  letter-spacing: 0.04em;
+.f-marquee--left, .f-marquee--right {
+  height: auto;
 }
-.f-marquee.is-pause:hover .f-marquee__track {
-  animation-play-state: paused;
+.f-marquee--up, .f-marquee--down {
+  height: 100%;
+  min-height: 20px;
 }
-
-@keyframes f-marquee-scroll {
-  from {
-    transform: translateX(0);
-  }
-  to {
-    transform: translateX(-50%);
-  }
+.f-marquee__content {
+  display: inline-block;
+  will-change: transform;
 }
+
 .f-dialog-mask {
   position: fixed;
   top: 0;
@@ -5551,6 +5560,12 @@
   overflow: auto;
 }
 
+.f-select-wrapper {
+  display: inline-block;
+  position: relative;
+  width: 100%;
+}
+
 .f-select {
   display: inline-flex;
   align-items: center;
@@ -5722,6 +5737,55 @@
     opacity: 0;
   }
 }
+/* ---------- 下拉面板 ---------- */
+.f-select-dropdown {
+  position: fixed;
+  background: #fff;
+  border-radius: 4px;
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.12);
+  z-index: 2000;
+}
+.f-select-dropdown__content {
+  padding: 4px 0;
+}
+
+/* ---------- 选项 ---------- */
+.f-select-option {
+  padding: 8px 12px;
+  font-size: 14px;
+  line-height: 1.5;
+  color: #606266;
+  cursor: pointer;
+  transition: all 0.2s;
+  user-select: none;
+}
+.f-select-option:hover:not(.is-disabled) {
+  background-color: #f5f7fa;
+}
+.f-select-option.is-selected {
+  color: #ec4899;
+  font-weight: 500;
+  background-color: #fdf2f8;
+}
+.f-select-option.is-disabled {
+  color: #c0c4cc;
+  cursor: not-allowed;
+}
+.f-select-option.is-empty {
+  text-align: center;
+  color: #909399;
+  cursor: default;
+}
+.f-select-option.is-empty:hover {
+  background-color: transparent;
+}
+.f-select-option__label {
+  display: block;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
 /* ---------- 新增选项按钮 ---------- */
 .f-select__add-option {
   display: flex;
@@ -5741,6 +5805,18 @@
   background-color: #fce7f3;
 }
 
+/* ---------- 下拉动画 ---------- */
+.f-select-dropdown-enter-active,
+.f-select-dropdown-leave-active {
+  transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+}
+
+.f-select-dropdown-enter-from,
+.f-select-dropdown-leave-to {
+  opacity: 0;
+  transform: scaleY(0.9);
+}
+
 :root {
   --f-slider-track-color: #333338;
   --f-slider-bar-color: #6366f1;
@@ -8101,7 +8177,12 @@ to {
   color: var(--text-muted);
   border: 1px solid var(--border2);
 }
-.f-select[data-v-f556487f] {
+.f-select-wrapper[data-v-476d8dd3] {
+  display: inline-block;
+  position: relative;
+  width: 100%;
+}
+.f-select[data-v-476d8dd3] {
   display: inline-flex;
   align-items: center;
   justify-content: space-between;
@@ -8120,66 +8201,66 @@ to {
   transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
   /* ---------- 多选：标签 ---------- */
 }
-.f-select[data-v-f556487f]:hover:not(.is-disabled) {
+.f-select[data-v-476d8dd3]:hover:not(.is-disabled) {
   border-color: #ec4899;
 }
-.f-select.is-open[data-v-f556487f]:not(.is-disabled), .f-select[data-v-f556487f]:focus-within:not(.is-disabled) {
+.f-select.is-open[data-v-476d8dd3]:not(.is-disabled), .f-select[data-v-476d8dd3]:focus-within:not(.is-disabled) {
   border-color: #ec4899;
   background: #fff;
   box-shadow: 0 0 0 2px rgba(236, 72, 153, 0.2274509804);
 }
-.f-select.is-open:not(.is-disabled) .f-select__arrow[data-v-f556487f], .f-select:focus-within:not(.is-disabled) .f-select__arrow[data-v-f556487f] {
+.f-select.is-open:not(.is-disabled) .f-select__arrow[data-v-476d8dd3], .f-select:focus-within:not(.is-disabled) .f-select__arrow[data-v-476d8dd3] {
   transform: rotate(180deg);
 }
-.f-select.is-active .f-select__label[data-v-f556487f] {
+.f-select.is-active .f-select__label[data-v-476d8dd3] {
   color: #1e293b;
 }
-.f-select.is-disabled[data-v-f556487f] {
+.f-select.is-disabled[data-v-476d8dd3] {
   cursor: not-allowed;
   background-color: #f5f7fa;
   border-color: #e4e7ed;
   color: #c0c4cc;
 }
-.f-select.is-disabled .f-select__label[data-v-f556487f],
-.f-select.is-disabled .f-select__arrow[data-v-f556487f] {
+.f-select.is-disabled .f-select__label[data-v-476d8dd3],
+.f-select.is-disabled .f-select__arrow[data-v-476d8dd3] {
   cursor: not-allowed;
 }
-.f-select.is-disabled .f-select__tag[data-v-f556487f] {
+.f-select.is-disabled .f-select__tag[data-v-476d8dd3] {
   opacity: 0.6;
 }
-.f-select--small[data-v-f556487f] {
+.f-select--small[data-v-476d8dd3] {
   height: 32px;
   font-size: 13px;
 }
-.f-select--small .f-select__label[data-v-f556487f] {
+.f-select--small .f-select__label[data-v-476d8dd3] {
   font-size: 13px;
 }
-.f-select--medium[data-v-f556487f] {
+.f-select--medium[data-v-476d8dd3] {
   height: 36px;
   font-size: 14px;
 }
-.f-select--large[data-v-f556487f] {
+.f-select--large[data-v-476d8dd3] {
   height: 40px;
   font-size: 16px;
 }
-.f-select--large .f-select__label[data-v-f556487f] {
+.f-select--large .f-select__label[data-v-476d8dd3] {
   font-size: 16px;
 }
-.f-select.is-multiple[data-v-f556487f] {
+.f-select.is-multiple[data-v-476d8dd3] {
   height: auto;
   padding-top: 3px;
   padding-bottom: 3px;
 }
-.f-select.is-multiple.f-select--small[data-v-f556487f] {
+.f-select.is-multiple.f-select--small[data-v-476d8dd3] {
   min-height: 32px;
 }
-.f-select.is-multiple.f-select--medium[data-v-f556487f] {
+.f-select.is-multiple.f-select--medium[data-v-476d8dd3] {
   min-height: 36px;
 }
-.f-select.is-multiple.f-select--large[data-v-f556487f] {
+.f-select.is-multiple.f-select--large[data-v-476d8dd3] {
   min-height: 40px;
 }
-.f-select__label[data-v-f556487f] {
+.f-select__label[data-v-476d8dd3] {
   font-size: 14px;
   line-height: 1.5;
   color: #1e293b;
@@ -8189,20 +8270,20 @@ to {
   text-overflow: ellipsis;
   transition: color 0.2s;
 }
-.f-select__label.is-placeholder[data-v-f556487f] {
+.f-select__label.is-placeholder[data-v-476d8dd3] {
   color: #94a3b8;
 }
-.f-select__suffix[data-v-f556487f] {
+.f-select__suffix[data-v-476d8dd3] {
   display: grid;
   place-items: center;
   width: 14px;
   height: 14px;
   flex-shrink: 0;
 }
-.f-select__suffix[data-v-f556487f] > * {
+.f-select__suffix[data-v-476d8dd3] > * {
   grid-area: 1/1;
 }
-.f-select__clear[data-v-f556487f] {
+.f-select__clear[data-v-476d8dd3] {
   font-size: 14px;
   color: #94a3b8;
   cursor: pointer;
@@ -8210,25 +8291,25 @@ to {
   pointer-events: none;
   transition: opacity 0.2s, color 0.2s;
 }
-.f-select__clear[data-v-f556487f]:hover {
+.f-select__clear[data-v-476d8dd3]:hover {
   color: #64748b;
 }
-.f-select__arrow[data-v-f556487f] {
+.f-select__arrow[data-v-476d8dd3] {
   font-size: 14px;
   color: #94a3b8;
   transition: transform 0.3s, color 0.2s, opacity 0.2s;
 }
-.f-select:hover:not(.is-disabled) .f-select__arrow[data-v-f556487f] {
+.f-select:hover:not(.is-disabled) .f-select__arrow[data-v-476d8dd3] {
   color: #64748b;
 }
-.f-select.is-clearable:hover:not(.is-disabled) .f-select__clear[data-v-f556487f] {
+.f-select.is-clearable:hover:not(.is-disabled) .f-select__clear[data-v-476d8dd3] {
   opacity: 1;
   pointer-events: auto;
 }
-.f-select.is-clearable:hover:not(.is-disabled) .f-select__arrow[data-v-f556487f] {
+.f-select.is-clearable:hover:not(.is-disabled) .f-select__arrow[data-v-476d8dd3] {
   opacity: 0;
 }
-.f-select__input[data-v-f556487f] {
+.f-select__input[data-v-476d8dd3] {
   flex: 1;
   min-width: 0;
   padding: 0;
@@ -8239,16 +8320,16 @@ to {
   line-height: 1.5;
   color: #1e293b;
 }
-.f-select__input[data-v-f556487f]::placeholder {
+.f-select__input[data-v-476d8dd3]::placeholder {
   color: #94a3b8;
 }
-.f-select__input.has-value[data-v-f556487f]::placeholder {
+.f-select__input.has-value[data-v-476d8dd3]::placeholder {
   color: #64748b;
 }
-.f-select__input.is-multiple[data-v-f556487f] {
+.f-select__input.is-multiple[data-v-476d8dd3] {
   min-width: 60px;
 }
-.f-select__tags[data-v-f556487f] {
+.f-select__tags[data-v-476d8dd3] {
   flex: 1;
   min-width: 0;
   display: flex;
@@ -8256,23 +8337,72 @@ to {
   gap: 4px;
   align-items: center;
 }
-.f-select__tag[data-v-f556487f] {
+.f-select__tag[data-v-476d8dd3] {
   max-width: 200px;
 }
-.f-select__tag[data-v-f556487f] .f-tag {
+.f-select__tag[data-v-476d8dd3] .f-tag {
   max-width: 100%;
 }
 @media (hover: none) {
-.f-select.is-clearable .f-select__clear[data-v-f556487f] {
+.f-select.is-clearable .f-select__clear[data-v-476d8dd3] {
     opacity: 1;
     pointer-events: auto;
 }
-.f-select.is-clearable .f-select__arrow[data-v-f556487f] {
+.f-select.is-clearable .f-select__arrow[data-v-476d8dd3] {
     opacity: 0;
 }
 }
+/* ---------- 下拉面板 ---------- */
+.f-select-dropdown[data-v-476d8dd3] {
+  position: fixed;
+  background: #fff;
+  border-radius: 4px;
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.12);
+  z-index: 2000;
+}
+.f-select-dropdown__content[data-v-476d8dd3] {
+  padding: 4px 0;
+}
+
+/* ---------- 选项 ---------- */
+.f-select-option[data-v-476d8dd3] {
+  padding: 8px 12px;
+  font-size: 14px;
+  line-height: 1.5;
+  color: #606266;
+  cursor: pointer;
+  transition: all 0.2s;
+  user-select: none;
+}
+.f-select-option[data-v-476d8dd3]:hover:not(.is-disabled) {
+  background-color: #f5f7fa;
+}
+.f-select-option.is-selected[data-v-476d8dd3] {
+  color: #ec4899;
+  font-weight: 500;
+  background-color: #fdf2f8;
+}
+.f-select-option.is-disabled[data-v-476d8dd3] {
+  color: #c0c4cc;
+  cursor: not-allowed;
+}
+.f-select-option.is-empty[data-v-476d8dd3] {
+  text-align: center;
+  color: #909399;
+  cursor: default;
+}
+.f-select-option.is-empty[data-v-476d8dd3]:hover {
+  background-color: transparent;
+}
+.f-select-option__label[data-v-476d8dd3] {
+  display: block;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
 /* ---------- 新增选项按钮 ---------- */
-.f-select__add-option[data-v-f556487f] {
+.f-select__add-option[data-v-476d8dd3] {
   display: flex;
   align-items: center;
   gap: 8px;
@@ -8283,11 +8413,22 @@ to {
   border-top: 1px solid #e0e0e6;
   transition: all 0.2s ease;
 }
-.f-select__add-option[data-v-f556487f]:hover {
+.f-select__add-option[data-v-476d8dd3]:hover {
   background-color: #fdf2f8;
 }
-.f-select__add-option[data-v-f556487f]:active {
+.f-select__add-option[data-v-476d8dd3]:active {
   background-color: #fce7f3;
+}
+
+/* ---------- 下拉动画 ---------- */
+.f-select-dropdown-enter-active[data-v-476d8dd3],
+.f-select-dropdown-leave-active[data-v-476d8dd3] {
+  transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+}
+.f-select-dropdown-enter-from[data-v-476d8dd3],
+.f-select-dropdown-leave-to[data-v-476d8dd3] {
+  opacity: 0;
+  transform: scaleY(0.9);
 }.f-date-picker[data-v-0f901824] {
   position: relative;
   width: 100%;
@@ -13177,35 +13318,408 @@ to {
 .fade-enter-from[data-v-a2989c99],
 .fade-leave-to[data-v-a2989c99] {
   opacity: 0;
-}.f-marquee[data-v-83eeea3d] {
+}.f-marquee[data-v-454360ad] {
+  position: relative;
+  width: 100%;
   overflow: hidden;
-  white-space: nowrap;
-  background: linear-gradient(90deg, #fff1f8, #fdf2f8, #fff7ed);
-  border: 1px solid #f9d8ea;
-  border-radius: 8px;
-  padding: 8px 0;
 }
-.f-marquee__track[data-v-83eeea3d] {
+.f-marquee--left[data-v-454360ad], .f-marquee--right[data-v-454360ad] {
+  height: auto;
+}
+.f-marquee--up[data-v-454360ad], .f-marquee--down[data-v-454360ad] {
+  height: 100%;
+  min-height: 20px;
+}
+.f-marquee__content[data-v-454360ad] {
+  display: inline-block;
+  will-change: transform;
+}
+/* 样式变量定义，默认不启用 */
+.f-slider-captcha[data-v-7b80ef8b] {
   display: inline-flex;
+  flex-direction: column;
+  background-color: #fff;
+  border-radius: 4px;
+  padding: 10px;
+  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
+  border: 1px solid #f0f0f0;
+  width: 320px;
+  user-select: none;
+}
+.f-slider-captcha .captcha-imgs[data-v-7b80ef8b] {
+  position: relative;
+  width: 300px;
+  height: 150px;
+  border-radius: 4px;
+  overflow: hidden;
+  background-color: #f7fafc;
+  margin-bottom: 10px;
+}
+.f-slider-captcha .captcha-imgs .bg-canvas[data-v-7b80ef8b] {
+  display: block;
+}
+.f-slider-captcha .captcha-imgs .fragment-canvas[data-v-7b80ef8b] {
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 10;
+  pointer-events: none;
+  /* 确保拖拽时平滑 */
+  will-change: transform;
+}
+.f-slider-captcha .captcha-imgs .loading-overlay[data-v-7b80ef8b] {
+  position: absolute;
+  inset: 0;
+  background: #f5f5f5;
+  z-index: 20;
+}
+.f-slider-captcha .captcha-imgs .refresh-btn[data-v-7b80ef8b] {
+  position: absolute;
+  top: 8px;
+  right: 8px;
+  font-size: 20px;
+  color: rgba(255, 255, 255, 0.4509803922);
+  z-index: 11;
+  transition: all 0.2s;
+}
+.f-slider-captcha .captcha-imgs .refresh-btn[data-v-7b80ef8b]:hover {
+  color: #fff;
+}
+.f-slider-captcha .slider-track[data-v-7b80ef8b] {
+  position: relative;
+  height: 44px;
+  background-color: #f0f2f5;
+  border-radius: 4px;
+  border: 1px solid #e6e8eb;
+  overflow: hidden;
+}
+.f-slider-captcha .slider-track .slider-progress[data-v-7b80ef8b] {
+  position: absolute;
+  left: 2px;
+  height: 40px;
+  z-index: 2;
+  border-radius: 4px;
+}
+.f-slider-captcha .slider-track .slider-progress.moving[data-v-7b80ef8b] {
+  background-color: #4a5568;
+}
+.f-slider-captcha .slider-track .slider-progress.success[data-v-7b80ef8b] {
+  background-color: #48bb78;
+}
+.f-slider-captcha .slider-track .slider-progress.error[data-v-7b80ef8b] {
+  background-color: #ff4d4f;
+}
+.f-slider-captcha .slider-track .track-tip[data-v-7b80ef8b] {
+  position: relative;
+  z-index: 1;
+  font-size: 13px;
+  color: #999;
+  pointer-events: none;
+}
+.f-slider-captcha .slider-track .slider-handle[data-v-7b80ef8b] {
+  position: absolute;
+  left: 2px;
+  width: 40px;
+  height: 40px;
+  background-color: #fff;
+  border-radius: 4px;
+  cursor: grab;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
+  z-index: 3;
+  touch-action: none;
+  transition: background-color 0.3s, box-shadow 0.3s, transform 0.3s;
+}
+.f-slider-captcha .slider-track .slider-handle .status-default[data-v-7b80ef8b] {
+  display: flex;
+  gap: 4px;
   align-items: center;
-  width: max-content;
-  min-width: 100%;
-  animation: f-marquee-scroll-83eeea3d var(--duration, 28s) linear infinite;
-  animation-direction: var(--dir, normal);
-  font-size: 14px;
+  justify-content: center;
+  transition: all 0.3s;
+}
+.f-slider-captcha .slider-track .slider-handle .status-default .stripe[data-v-7b80ef8b] {
+  width: 2px;
+  height: 20px;
+  background-color: #ccc;
+  border-radius: 2px;
+  transition: all 0.3s;
+}
+.f-slider-captcha .slider-track .slider-handle[data-v-7b80ef8b]:hover, .f-slider-captcha .slider-track .slider-handle.dragging[data-v-7b80ef8b] {
+  background-color: #4a5568;
+}
+.f-slider-captcha .slider-track .slider-handle:hover .status-default .stripe[data-v-7b80ef8b]:first-child, .f-slider-captcha .slider-track .slider-handle.dragging .status-default .stripe[data-v-7b80ef8b]:first-child {
+  width: 0;
+  height: 0;
+  background-color: transparent;
+  border-top: 4px solid transparent;
+  border-bottom: 4px solid transparent;
+  border-right: 6px solid #fff;
+  transform: translateX(-2px);
+}
+.f-slider-captcha .slider-track .slider-handle:hover .status-default .stripe[data-v-7b80ef8b]:last-child, .f-slider-captcha .slider-track .slider-handle.dragging .status-default .stripe[data-v-7b80ef8b]:last-child {
+  width: 0;
+  height: 0;
+  background-color: transparent;
+  border-top: 4px solid transparent;
+  border-bottom: 4px solid transparent;
+  border-left: 6px solid #fff;
+  transform: translateX(2px);
+}
+.f-slider-captcha .slider-track .slider-handle:hover .status-default .stripe[data-v-7b80ef8b]:nth-child(2), .f-slider-captcha .slider-track .slider-handle.dragging .status-default .stripe[data-v-7b80ef8b]:nth-child(2) {
+  width: 4px;
+  height: 4px;
+  border-radius: 50%;
+  background-color: #fff;
+}
+.f-slider-captcha .slider-track .slider-handle.dragging[data-v-7b80ef8b] {
+  cursor: grabbing;
+}.f-carousel[data-v-187b78d3] {
+  position: relative;
+  width: 100%;
+  overflow: hidden;
+  border-radius: 4px;
+}
+.f-carousel--horizontal[data-v-187b78d3] {
+  aspect-ratio: 16/9;
+  height: var(--f-carousel-height, 400px);
+}
+.f-carousel--vertical[data-v-187b78d3] {
+  height: var(--f-carousel-height, 300px);
+}
+.f-carousel__container[data-v-187b78d3] {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+.f-carousel__track[data-v-187b78d3] {
+  display: flex;
+  width: 100%;
+  height: 100%;
+  transition: transform 0.5s ease;
+}
+.f-carousel--horizontal .f-carousel__track[data-v-187b78d3] {
+  flex-direction: row;
+}
+.f-carousel--vertical .f-carousel__track[data-v-187b78d3] {
+  flex-direction: column;
+}
+.f-carousel__item[data-v-187b78d3] {
+  flex: 0 0 100%;
+  position: relative;
+  width: 100%;
+  height: 100%;
+}
+.f-carousel__image[data-v-187b78d3] {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+.f-carousel__html-content[data-v-187b78d3], .f-carousel__content[data-v-187b78d3] {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 20px;
+}
+.f-carousel__content[data-v-187b78d3] {
+  font-size: 18px;
+  color: #333;
+  background: #f5f5f5;
+}
+.f-carousel__overlay[data-v-187b78d3] {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  padding: 20px;
+  background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);
+  color: white;
+}
+.f-carousel__title[data-v-187b78d3] {
+  font-size: 24px;
   font-weight: 600;
-  color: #9d174d;
-  letter-spacing: 0.04em;
+  margin-bottom: 8px;
+}
+.f-carousel__description[data-v-187b78d3] {
+  font-size: 14px;
+  opacity: 0.9;
 }
-.f-marquee.is-pause:hover .f-marquee__track[data-v-83eeea3d] {
-  animation-play-state: paused;
+.f-carousel__empty[data-v-187b78d3] {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #999;
+  font-size: 16px;
+  background: #f5f5f5;
 }
-@keyframes f-marquee-scroll-83eeea3d {
-from {
-    transform: translateX(0);
+.f-carousel__controls[data-v-187b78d3] {
+  position: absolute;
+  top: 50%;
+  left: 0;
+  right: 0;
+  transform: translateY(-50%);
+  display: flex;
+  justify-content: space-between;
+  padding: 0 16px;
+  pointer-events: none;
+  z-index: 2;
 }
-to {
-    transform: translateX(-50%);
+.f-carousel__control[data-v-187b78d3] {
+  width: 40px;
+  height: 40px;
+  border-radius: 50%;
+  background: rgba(255, 255, 255, 0.8);
+  border: none;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #333;
+  transition: all 0.3s;
+  pointer-events: all;
+}
+.f-carousel__control[data-v-187b78d3]:hover:not(:disabled) {
+  background: white;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+}
+.f-carousel__control[data-v-187b78d3]:disabled {
+  opacity: 0.3;
+  cursor: not-allowed;
+}
+.f-carousel__control[data-v-187b78d3] svg {
+  width: 20px;
+  height: 20px;
+}
+.f-carousel__indicators[data-v-187b78d3] {
+  position: absolute;
+  display: flex;
+  gap: 8px;
+  z-index: 2;
+}
+.f-carousel__indicators--top[data-v-187b78d3] {
+  top: 16px;
+  left: 50%;
+  transform: translateX(-50%);
+}
+.f-carousel--indicator-top .f-carousel__indicators[data-v-187b78d3] {
+  top: 16px;
+  left: 50%;
+  transform: translateX(-50%);
+}
+.f-carousel--indicator-bottom .f-carousel__indicators[data-v-187b78d3] {
+  bottom: 16px;
+  left: 50%;
+  transform: translateX(-50%);
+}
+.f-carousel--indicator-left .f-carousel__indicators[data-v-187b78d3] {
+  left: 16px;
+  top: 50%;
+  transform: translateY(-50%);
+  flex-direction: column;
+}
+.f-carousel--indicator-right .f-carousel__indicators[data-v-187b78d3] {
+  right: 16px;
+  top: 50%;
+  transform: translateY(-50%);
+  flex-direction: column;
+}
+.f-carousel__indicator[data-v-187b78d3] {
+  border: none;
+  background: none;
+  cursor: pointer;
+  padding: 4px;
+  transition: all 0.3s;
+}
+.f-carousel__indicator--dot[data-v-187b78d3] {
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  background: rgba(255, 255, 255, 0.6);
+}
+.f-carousel__indicator--dot[data-v-187b78d3]:hover, .f-carousel__indicator--dot.f-carousel__indicator--active[data-v-187b78d3] {
+  background: white;
+}
+.f-carousel__indicator--line[data-v-187b78d3] {
+  width: 24px;
+  height: 3px;
+  background: rgba(255, 255, 255, 0.6);
+}
+.f-carousel__indicator--line[data-v-187b78d3]:hover, .f-carousel__indicator--line.f-carousel__indicator--active[data-v-187b78d3] {
+  background: white;
+}
+.f-carousel__indicator--number[data-v-187b78d3] {
+  width: 24px;
+  height: 24px;
+  border-radius: 4px;
+  background: rgba(0, 0, 0, 0.5);
+  color: white;
+  font-size: 12px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.f-carousel__indicator--number[data-v-187b78d3]:hover, .f-carousel__indicator--number.f-carousel__indicator--active[data-v-187b78d3] {
+  background: rgba(0, 0, 0, 0.8);
+}
+.f-carousel__play-control[data-v-187b78d3] {
+  position: absolute;
+  top: 16px;
+  right: 16px;
+  z-index: 2;
+}
+.f-carousel__play-button[data-v-187b78d3] {
+  width: 32px;
+  height: 32px;
+  border-radius: 50%;
+  background: rgba(0, 0, 0, 0.5);
+  border: none;
+  color: white;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: all 0.3s;
+}
+.f-carousel__play-button[data-v-187b78d3]:hover {
+  background: rgba(0, 0, 0, 0.7);
+}
+.f-carousel__play-button[data-v-187b78d3] svg {
+  width: 16px;
+  height: 16px;
+}
+.f-carousel--fade .f-carousel__track[data-v-187b78d3] {
+  display: block;
+}
+.f-carousel--fade .f-carousel__item[data-v-187b78d3] {
+  position: absolute;
+  top: 0;
+  left: 0;
+  opacity: 0;
+  transition: opacity 1s ease;
+}
+.f-carousel--fade .f-carousel__item[data-v-187b78d3]:nth-child(1) {
+  opacity: 1;
+}
+@media (max-width: 768px) {
+.f-carousel--horizontal[data-v-187b78d3] {
+    height: var(--f-carousel-height, 300px);
+}
+.f-carousel--vertical[data-v-187b78d3] {
+    height: var(--f-carousel-height, 250px);
+}
+.f-carousel__title[data-v-187b78d3] {
+    font-size: 20px;
+}
+.f-carousel__control[data-v-187b78d3] {
+    width: 32px;
+    height: 32px;
+}
+.f-carousel__control[data-v-187b78d3] svg {
+    width: 16px;
+    height: 16px;
 }
 }.f-steps[data-v-39ce5b1c] {
   display: flex;
@@ -13535,7 +14049,7 @@ to {
 }
 .f-timeline-item--large .f-timeline-item__tail[data-v-d4425329] {
   left: 11px;
-}.f-dialog-overlay[data-v-26ecd364] {
+}.f-dialog-overlay[data-v-7a2da7c7] {
   position: fixed;
   top: 0;
   left: 0;
@@ -13549,8 +14063,9 @@ to {
   padding: 20px;
   backdrop-filter: blur(2px);
   transition: background-color 0.25s ease;
+  touch-action: none;
 }
-.f-dialog[data-v-26ecd364] {
+.f-dialog[data-v-7a2da7c7] {
   position: relative;
   background: #fff;
   border-radius: 8px;
@@ -13564,7 +14079,7 @@ to {
   will-change: transform, opacity;
   transform-origin: center;
 }
-.f-dialog__close[data-v-26ecd364] {
+.f-dialog__close[data-v-7a2da7c7] {
   position: absolute;
   top: 16px;
   right: 16px;
@@ -13582,20 +14097,20 @@ to {
   z-index: 1;
   padding: 0;
 }
-.f-dialog__close[data-v-26ecd364]:hover {
+.f-dialog__close[data-v-7a2da7c7]:hover {
   background: #f5f7fa;
   color: #606266;
 }
-.f-dialog__header[data-v-26ecd364] {
+.f-dialog__header[data-v-7a2da7c7] {
   padding: 20px 20px 16px;
   display: flex;
   align-items: center;
   gap: 12px;
 }
-.f-dialog__header.has-divider[data-v-26ecd364] {
+.f-dialog__header.has-divider[data-v-7a2da7c7] {
   border-bottom: 1px solid #e4e7ed;
 }
-.f-dialog__icon[data-v-26ecd364] {
+.f-dialog__icon[data-v-7a2da7c7] {
   flex-shrink: 0;
   width: 28px;
   height: 28px;
@@ -13604,11 +14119,11 @@ to {
   justify-content: center;
   border-radius: 50%;
 }
-.f-dialog__icon[data-v-26ecd364] svg {
+.f-dialog__icon[data-v-7a2da7c7] svg {
   width: 20px;
   height: 20px;
 }
-.f-dialog__title[data-v-26ecd364] {
+.f-dialog__title[data-v-7a2da7c7] {
   flex: 1;
   margin: 0;
   font-size: 18px;
@@ -13616,74 +14131,97 @@ to {
   color: #303133;
   line-height: 1.4;
 }
-.f-dialog__body[data-v-26ecd364] {
+.f-dialog__body[data-v-7a2da7c7] {
   flex: 1;
   min-height: 0;
   padding: 20px;
   color: #606266;
   font-size: 14px;
   line-height: 1.6;
+  overflow: hidden;
+  -webkit-overflow-scrolling: touch;
 }
-.f-dialog__body[data-v-26ecd364] .f-scrollbar {
+.f-dialog__body[data-v-7a2da7c7] .f-scrollbar {
   height: 100%;
 }
-.f-dialog__body[data-v-26ecd364] .f-scrollbar__view {
+.f-dialog__body[data-v-7a2da7c7] .f-scrollbar__wrap {
+  -webkit-overflow-scrolling: touch;
+}
+.f-dialog__body[data-v-7a2da7c7] .f-scrollbar__view {
   padding: 0;
 }
-.f-dialog__body p[data-v-26ecd364] {
+.f-dialog__body p[data-v-7a2da7c7] {
   margin: 0;
 }
-.f-dialog__footer[data-v-26ecd364] {
+.f-dialog__footer[data-v-7a2da7c7] {
   padding: 16px 20px;
   display: flex;
   align-items: center;
   justify-content: flex-end;
   gap: 12px;
 }
-.f-dialog__footer.has-divider[data-v-26ecd364] {
+.f-dialog__footer.has-divider[data-v-7a2da7c7] {
   border-top: 1px solid #e4e7ed;
 }
-.f-dialog--info .f-dialog__icon[data-v-26ecd364] {
+.f-dialog--info .f-dialog__icon[data-v-7a2da7c7] {
   background: #ecf5ff;
   color: #409eff;
 }
-.f-dialog--success .f-dialog__icon[data-v-26ecd364] {
+.f-dialog--success .f-dialog__icon[data-v-7a2da7c7] {
   background: #f0f9ff;
   color: #67c23a;
 }
-.f-dialog--warning .f-dialog__icon[data-v-26ecd364] {
+.f-dialog--warning .f-dialog__icon[data-v-7a2da7c7] {
   background: #fef0e6;
   color: #e6a23c;
 }
-.f-dialog--error .f-dialog__icon[data-v-26ecd364] {
+.f-dialog--error .f-dialog__icon[data-v-7a2da7c7] {
   background: #fef0f0;
   color: #f56c6c;
 }
-.f-dialog--confirm .f-dialog__icon[data-v-26ecd364] {
+.f-dialog--confirm .f-dialog__icon[data-v-7a2da7c7] {
   background: #fef0e6;
   color: #e6a23c;
 }
-.dialog-fade-enter-active[data-v-26ecd364],
-.dialog-fade-leave-active[data-v-26ecd364] {
+.dialog-fade-enter-active[data-v-7a2da7c7],
+.dialog-fade-leave-active[data-v-7a2da7c7] {
   transition: opacity 0.25s ease;
 }
-.dialog-fade-enter-from[data-v-26ecd364],
-.dialog-fade-leave-to[data-v-26ecd364] {
+.dialog-fade-enter-from[data-v-7a2da7c7],
+.dialog-fade-leave-to[data-v-7a2da7c7] {
   opacity: 0;
 }
-.dialog-enter-active[data-v-26ecd364],
-.dialog-leave-active[data-v-26ecd364] {
+.dialog-enter-active[data-v-7a2da7c7],
+.dialog-leave-active[data-v-7a2da7c7] {
   transition: opacity 0.25s ease, transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
 }
-.dialog-enter-from[data-v-26ecd364],
-.dialog-leave-to[data-v-26ecd364] {
+.dialog-enter-from[data-v-7a2da7c7],
+.dialog-leave-to[data-v-7a2da7c7] {
   opacity: 0;
   transform: scale(0.88) translateY(6px);
 }
-.dialog-enter-to[data-v-26ecd364],
-.dialog-leave-from[data-v-26ecd364] {
+.dialog-enter-to[data-v-7a2da7c7],
+.dialog-leave-from[data-v-7a2da7c7] {
   opacity: 1;
   transform: scale(1) translateY(0);
+}
+@media (max-width: 768px) {
+.f-dialog-overlay[data-v-7a2da7c7] {
+    padding: 10px;
+}
+.f-dialog[data-v-7a2da7c7] {
+    width: 95vw;
+    max-height: 85vh;
+}
+.f-dialog__header[data-v-7a2da7c7] {
+    padding: 16px 16px 12px;
+}
+.f-dialog__body[data-v-7a2da7c7] {
+    padding: 16px;
+}
+.f-dialog__footer[data-v-7a2da7c7] {
+    padding: 12px 16px;
+}
 }.f-drawer-backdrop[data-v-c7209ade] {
   position: fixed;
   inset: 0;