/* [project]/src/components/sites/aiefp-cc-9ac4c359/root-1567d901/styles.css [app-client] (css) */
.ai-page {
  max-width: 21.8667rem;
  min-height: 100vh;
  font-family: var(--font-site-sans);
  background: #f5f7fb;
  margin: 0 auto;
  padding-bottom: 1.5467rem;
  position: relative;
}

.ai-page, .ai-page *, .ai-page :before, .ai-page :after {
  box-sizing: content-box;
}

.top-nav {
  z-index: 30;
  background: #fff;
  padding: .2667rem .4267rem;
  position: sticky;
  top: 0;
  box-shadow: 0 .0185rem #0f172a0a;
}

.nav-container {
  justify-content: space-between;
  align-items: center;
  height: .8533rem;
  display: flex;
}

.logo-container {
  align-items: center;
  gap: .2133rem;
  display: flex;
}

.logo-mark {
  color: #fff;
  background-image: linear-gradient(145deg, #2f80ff, #1a5cff);
  border-radius: .2133rem;
  justify-content: center;
  align-items: center;
  width: .7998rem;
  height: .7998rem;
  font-size: .3467rem;
  font-weight: 800;
  display: flex;
  box-shadow: 0 .1067rem .2667rem #1a5cff47;
}

.logo-text {
  letter-spacing: .2px;
  color: #111827;
  font-size: .4533rem;
  font-weight: 800;
}

.nav-right {
  align-items: center;
  gap: .2133rem;
  display: flex;
}

.wallet-btn {
  color: #374151;
  white-space: nowrap;
  background: #f3f4f6;
  border-radius: 26.64rem;
  max-width: 3.1467rem;
  padding: .16rem .32rem;
  font-size: .32rem;
  font-weight: 600;
  display: block;
  overflow: hidden;
}

.wallet-btn i {
  margin-right: .1013rem;
}

.nav-icon {
  color: #4b5563;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: .8533rem;
  height: .8533rem;
  font-size: .48rem;
  display: flex;
  position: relative;
}

.notice-dot {
  background: #ef4444;
  border: 1px solid #fff;
  border-radius: 50%;
  width: .1867rem;
  height: .1867rem;
  position: absolute;
  top: .16rem;
  right: .16rem;
}

.banner-section {
  padding: .32rem .4267rem 0;
}

.banner-swipe {
  aspect-ratio: 2;
  border-radius: .4267rem;
  position: relative;
  overflow: hidden;
  box-shadow: 0 .2133rem .64rem #0f172a1f;
}

.swipe-track {
  height: 100%;
  transition: transform .5s;
  display: flex;
}

.swipe-item {
  flex: 0 0 100%;
  height: 100%;
  position: relative;
}

.banner-slide {
  background: #0b1220;
  width: 100%;
  height: 100%;
  position: relative;
}

.banner-img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.banner-copy {
  z-index: 2;
  background-image: linear-gradient(90deg, #0208178c, #02081747 70%, #02081700);
  flex-direction: column;
  justify-content: center;
  width: 58%;
  padding: .3733rem .3733rem .64rem .4267rem;
  display: flex;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
}

.banner-title {
  letter-spacing: .5px;
  color: #fff;
  font-size: .48rem;
  font-weight: 800;
  line-height: .5998rem;
}

.banner-subtitle {
  color: #ffffffeb;
  margin-top: .16rem;
  font-size: .32rem;
  font-weight: 600;
  line-height: .4479rem;
}

.banner-desc {
  color: #bad2ffe6;
  margin-top: .16rem;
  font-size: .2933rem;
  font-weight: 400;
  line-height: .4106rem;
}

.swipe-indicators {
  align-items: center;
  display: flex;
  position: absolute;
  bottom: .2667rem;
  left: 50%;
  transform: translateX(-50%);
}

.swipe-indicator {
  cursor: pointer;
  background: #ffffff73;
  border: 0;
  border-radius: 50%;
  width: .1597rem;
  height: .1597rem;
  margin-right: .16rem;
  padding: 0;
  transition: opacity .2s, background-color .2s;
  display: block;
}

.swipe-indicator:last-child {
  margin-right: 0;
}

.swipe-indicator--active {
  background: #fff6;
  border-radius: 26.64rem;
  width: .4267rem;
}

.quick-section {
  background: #fff;
  border-radius: .4267rem;
  justify-content: space-around;
  margin: .3733rem .4267rem 0;
  padding: .4267rem .2133rem;
  display: flex;
  box-shadow: 0 .1067rem .4267rem #0f172a0d;
}

.quick-item {
  flex-direction: column;
  align-items: center;
  gap: .2133rem;
  width: 1.7067rem;
  display: flex;
}

.quick-icon {
  color: #fff;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 1.2267rem;
  height: 1.2267rem;
  font-size: .5867rem;
  display: flex;
  box-shadow: 0 .16rem .3733rem #2563eb2e;
}

.quick-icon.tone-green {
  background-image: linear-gradient(145deg, #34d399, #10b981);
}

.quick-icon.tone-orange {
  background-image: linear-gradient(145deg, #fb923c, #f97316);
}

.quick-icon.tone-purple {
  background-image: linear-gradient(145deg, #a78bfa, #7c3aed);
}

.quick-icon.tone-blue {
  background-image: linear-gradient(145deg, #4da3ff, #1a73e8);
}

.quick-name {
  color: #374151;
  font-size: .3467rem;
  font-weight: 600;
}

.section-head {
  justify-content: space-between;
  align-items: center;
  margin-bottom: .32rem;
  display: flex;
}

.section-title {
  color: #111827;
  align-items: center;
  gap: .2133rem;
  font-size: .4533rem;
  font-weight: 800;
  display: flex;
}

.section-more {
  color: #9ca3af;
  align-items: center;
  font-size: .32rem;
  font-weight: 400;
  display: flex;
}

.product-section {
  margin: .48rem .4267rem 0;
}

.product-tier + .product-tier {
  margin-top: .4267rem;
}

.tier-head {
  align-items: center;
  gap: .2133rem;
  margin-bottom: .2667rem;
  display: flex;
}

.tier-badge {
  color: #1f2937;
  align-items: center;
  gap: .1067rem;
  font-size: .3467rem;
  font-weight: 700;
  display: flex;
}

.tier-badge i {
  font-size: .3733rem;
}

.tier-badge.theme-blue i {
  color: #f59e0b;
}

.tier-badge.theme-purple i {
  color: #8b5cf6;
}

.tier-desc {
  color: #9ca3af;
  font-size: .32rem;
  font-weight: 400;
}

.product-grid {
  gap: .2667rem;
  display: grid;
}

.product-grid.cols-3 {
  grid-template-columns: repeat(3, 1fr);
}

.product-grid.cols-2 {
  grid-template-columns: repeat(2, 1fr);
}

.product-card {
  text-align: center;
  border: 1px solid #0000;
  border-radius: .3733rem;
  flex-direction: column;
  align-items: center;
  padding: .32rem .2667rem;
  display: flex;
  position: relative;
  overflow: hidden;
  box-shadow: 0 .1067rem .3733rem #0f172a0d;
}

.product-card.theme-blue {
  background-image: linear-gradient(#f4f9ff, #fff 48%);
}

.product-card.theme-purple {
  background-image: linear-gradient(#f7f3ff, #fff 48%);
}

.card-title {
  color: #111827;
  font-size: .3467rem;
  font-weight: 800;
  line-height: .4158rem;
}

.card-sub {
  color: #9ca3af;
  margin-top: .1067rem;
  font-size: .2667rem;
  font-weight: 400;
}

.coin-stack {
  margin: .2667rem 0 .2133rem;
  position: relative;
}

.coin-stack.theme-blue {
  width: 1.92rem;
  height: 1.5467rem;
}

.coin-stack.theme-purple {
  width: 2.3467rem;
  height: 1.76rem;
}

.coin {
  color: #fff;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  font-weight: 800;
  display: flex;
  position: absolute;
  left: 50%;
  box-shadow: inset 0 -.08rem #0000001f, 0 .1067rem .2133rem #1a5cff33;
}

.coin-stack.theme-blue .coin {
  background-image: radial-gradient(circle at 35% 30%, #7ec2ff, #1a73e8 55%, #0b4fcc);
  font-size: .2933rem;
}

.coin-stack.theme-purple .coin {
  background-image: radial-gradient(circle at 35% 30%, #c4b5fd, #7c3aed 55%, #5b21b6);
}

.coin-back {
  opacity: .45;
  width: 1.0667rem;
  height: 1.0667rem;
  transform: translateX(-.5333rem);
}

.coin-mid {
  opacity: .7;
  width: 1.1733rem;
  height: 1.1733rem;
  top: .16rem;
  transform: translateX(-.5867rem);
}

.coin-front {
  width: 1.2267rem;
  height: 1.2267rem;
  top: .32rem;
  transform: translateX(-.6133rem);
}

.coin-stack.theme-blue .coin-back {
  bottom: .48rem;
}

.coin-stack.theme-blue .coin-mid {
  bottom: .2133rem;
}

.coin-stack.theme-blue .coin-front {
  bottom: 0;
}

.coin-stack.theme-purple .coin-back {
  bottom: .6933rem;
}

.coin-stack.theme-purple .coin-mid {
  bottom: .4267rem;
}

.coin-stack.theme-purple .coin-front {
  width: 1.44rem;
  height: 1.44rem;
  font-size: .3467rem;
  bottom: 0;
  transform: translateX(-.72rem);
}

.card-price {
  margin-bottom: .2133rem;
  font-family: Times New Roman, serif;
  font-size: .4rem;
  font-weight: 800;
  line-height: .5185rem;
}

.coin-front span {
  font-family: Times New Roman, serif;
}

.card-price.theme-blue {
  color: #1a73e8;
}

.card-price.theme-purple {
  color: #7c3aed;
}

.buy-btn {
  box-sizing: border-box;
  color: #fff;
  cursor: pointer;
  border: 0;
  border-radius: .2133rem;
  width: 100%;
  height: .7998rem;
  padding: 1px 6px;
  font-size: .32rem;
  font-weight: 700;
  display: block;
}

.buy-btn.theme-blue {
  background-image: linear-gradient(135deg, #3b82f6, #1a73e8);
}

.buy-btn.theme-purple {
  background-image: linear-gradient(135deg, #8b5cf6, #6d28d7);
}

.advantage-section {
  margin: .48rem .4267rem 0;
}

.advantage-list {
  flex-direction: column;
  gap: .2667rem;
  display: flex;
}

.advantage-item {
  background: #fff;
  border-radius: .3733rem;
  align-items: center;
  gap: .32rem;
  padding: .3733rem .32rem;
  display: flex;
  box-shadow: 0 .1067rem .3733rem #0f172a0a;
}

.advantage-icon {
  color: #fff;
  border-radius: .2667rem;
  flex: none;
  justify-content: center;
  align-items: center;
  width: .96rem;
  height: .96rem;
  font-size: .48rem;
  display: flex;
}

.advantage-body {
  flex: 1;
  min-width: 0;
}

.advantage-name {
  color: #111827;
  margin-bottom: .1067rem;
  font-size: .3733rem;
  font-weight: 800;
}

.advantage-desc {
  color: #6b7280;
  font-size: .2933rem;
  font-weight: 400;
  line-height: .4254rem;
}

.advantage-art {
  opacity: .85;
  border-radius: .32rem;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 1.28rem;
  height: 1.28rem;
  font-size: .5867rem;
  display: flex;
}

.advantage-icon.tone-blue, .tone-blue.advantage-art-color {
  background: #3b82f6;
}

.advantage-icon.tone-green {
  background: #10b981;
}

.advantage-icon.tone-orange {
  background: #f97316;
}

.advantage-icon.tone-purple {
  background: #8b5cf6;
}

.advantage-icon.tone-cyan {
  background: #0ea5e9;
}

.advantage-art.tone-blue {
  color: #3b82f6;
  background: #eff6ff;
}

.advantage-art.tone-green {
  color: #10b981;
  background: #ecfdf5;
}

.advantage-art.tone-orange {
  color: #f97316;
  background: #fff7ed;
}

.advantage-art.tone-purple {
  color: #8b5cf6;
  background: #f5f3ff;
}

.advantage-art.tone-cyan {
  color: #0ea5e9;
  background: #ecfeff;
}

.ai-tabbar {
  z-index: 40;
  background: #fff;
  justify-content: space-around;
  align-items: center;
  width: 100%;
  max-width: 21.8667rem;
  height: 1.5467rem;
  display: flex;
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

.tab-item {
  color: #9ca3af;
  flex-direction: column;
  align-items: center;
  gap: .0533rem;
  width: 1.4933rem;
  font-size: .2933rem;
  font-weight: 400;
  display: flex;
}

.tab-item i {
  font-size: .5333rem;
}

.tab-item.active {
  color: #1a73e8;
  font-weight: 700;
}

/* [project]/src/app/interactions.css [app-client] (css) */
.ai-page button {
  cursor: pointer;
}

.ai-page button:focus-visible {
  outline-offset: 4px;
  outline: 3px solid #2563eb;
}

.ai-page .quick-item, .ai-page .tab-item, .ai-page .section-more, .ai-page .nav-icon {
  color: inherit;
  background: none;
  border: 0;
  padding: 0;
  font-family: inherit;
}

.ai-page .tab-item.active {
  color: #2563eb;
}

.ai-page .wallet-btn {
  border: 0;
  font-family: inherit;
}

.ai-page .swipe-indicators {
  z-index: 3;
  bottom: 0;
}

.ai-page .swipe-indicator {
  background: none;
  border-radius: 0;
  width: 44px;
  height: 44px;
  margin: 0;
  position: relative;
}

.ai-page .swipe-indicator:after {
  content: "";
  background: #ffffff73;
  border-radius: 99px;
  width: .1597rem;
  height: .1597rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.ai-page .swipe-indicator--active:after {
  background: #fff;
  width: .4267rem;
}

#productSection {
  scroll-margin-top: 100px;
}

.ai-page .account-view {
  background: #fff;
  border-radius: 16px;
  min-height: 55vh;
  margin: 24px;
  padding: 24px;
  font-size: 16px;
}

.account-view h1 {
  font-size: 24px;
  font-weight: 700;
}

.account-view p {
  color: #64748b;
  margin: 24px 0;
}

.ai-page .action-dialog {
  color: #172033;
  background: #fff;
  border: 0;
  border-radius: 18px;
  width: min(440px, 100vw - 32px);
  max-height: 85dvh;
  margin: auto;
  padding: 0;
  font-size: 16px;
  line-height: 1.6;
  position: fixed;
  inset: 0;
  box-shadow: 0 24px 80px #0004;
}

.action-dialog::backdrop {
  background: #0f172a80;
}

.dialog-content {
  overflow-wrap: anywhere;
  padding: 24px;
}

.dialog-content header {
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  display: flex;
}

.dialog-content h2 {
  font-size: 22px;
  font-weight: 700;
}

.dialog-content p {
  margin: 16px 0;
}

.dialog-content button, .account-view button {
  color: #1d4ed8;
  background: #eff6ff;
  border-radius: 10px;
  min-height: 44px;
  margin: 4px;
  padding: 8px 16px;
  font-size: 16px;
}

.dialog-content input {
  box-sizing: border-box;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  width: 100%;
  padding: 10px;
  font-size: 14px;
}

.dialog-content .dialog-done {
  color: #fff;
  background: #2563eb;
  margin: 16px 0 0;
  display: block;
}

.plan-list {
  margin-top: 16px;
  display: grid;
}

/*# sourceMappingURL=src_1fx_ygj._.css.map*/