:root {
      --cyan: #00d4ff;
      --purple: #a855f7;
      --green: #22c55e;
      --spacing: 0.25rem;
    }

    * { box-sizing: border-box; }


    .w-64 {
    width: 16rem;
}

.right-0 {
    right: 0px;
}

    html { scroll-behavior: smooth; }
    #resources, #domain, #servers, #ai, #faq {
      scroll-margin-top: 68px;
    }
    @media (min-width: 640px) {
      #resources, #domain, #servers, #ai, #faq {
        scroll-margin-top: 82px;
      }
    }

    body {
      background: #080b14;
      color: #e2e8f0;
      font-family: -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
      min-height: 100vh;
      overflow-x: hidden;
    }

    [x-cloak] { display: none !important; }
    .sr-only {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }

    /* ── 动态网格背景 ── */
    .grid-bg {
      position: fixed;
      inset: 0;
      z-index: 0;
      background-image:
        linear-gradient(rgba(0, 212, 255, .035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 212, 255, .035) 1px, transparent 1px);
      background-size: 48px 48px;
      animation: gridMove 24s linear infinite;
      pointer-events: none;
    }

    @keyframes gridMove {
      0%   { background-position: 0 0; }
      100% { background-position: 48px 48px; }
    }

    /* ── 辉光球 ── */
    .orb {
      position: fixed;
      border-radius: 50%;
      filter: blur(90px);
      pointer-events: none;
      z-index: 0;
    }
    .orb-1 {
      width: 600px; height: 600px;
      top: -250px; left: -200px;
      background: radial-gradient(circle, rgba(168,85,247,.13), transparent 70%);
    }
    .orb-2 {
      width: 500px; height: 500px;
      bottom: -150px; right: -150px;
      background: radial-gradient(circle, rgba(0,212,255,.10), transparent 70%);
    }
    .orb-3 {
      width: 300px; height: 300px;
      top: 60%; left: 50%;
      transform: translateX(-50%);
      background: radial-gradient(circle, rgba(168,85,247,.07), transparent 70%);
    }

    /* ── 毛玻璃卡片 ── */
    .glass {
      background: rgba(255,255,255,.04);
      border: 1px solid rgba(255,255,255,.08);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border-radius: 1rem;
    }
    .glass-hover {
      transition: background .2s, border-color .2s, transform .2s, box-shadow .2s;
    }
    .glass-hover:hover {
      background: rgba(255,255,255,.07);
      border-color: rgba(0,212,255,.25);
      transform: translateY(-3px);
      box-shadow: 0 12px 40px rgba(0,212,255,.08);
    }

    /* ── 渐变按钮 ── */
    .btn-primary {
      background: linear-gradient(135deg, var(--cyan), var(--purple));
      color: #fff;
      font-weight: 600;
      border: none;
      border-radius: .625rem;
      cursor: pointer;
      transition: opacity .2s, transform .15s, box-shadow .2s;
    }
    .btn-primary:hover {
      opacity: .9;
      transform: translateY(-1px);
      box-shadow: 0 8px 24px rgba(0,212,255,.25);
    }
    .btn-primary:active { transform: translateY(0); }
    .btn-primary:disabled { opacity: .5; cursor: not-allowed; transform: none; }

    /* ── 渐变文字 ── */
    .grad-text {
      background: linear-gradient(135deg, var(--cyan), var(--purple));
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }

    /* ── 入场动画 ── */
    .fade-up {
      opacity: 0;
      transform: translateY(24px);
      animation: fadeUp .6s ease forwards;
    }
    @keyframes fadeUp {
      to { opacity: 1; transform: translateY(0); }
    }
    .delay-1 { animation-delay: .1s; }
    .delay-2 { animation-delay: .2s; }
    .delay-3 { animation-delay: .3s; }
    .delay-4 { animation-delay: .4s; }
    .delay-5 { animation-delay: .5s; }

    /* ── 章节标题 ── */
    .section-title {
      font-size: 2rem;
      font-weight: 700;
      line-height: 1.2;
    }
    @media (max-width: 640px) {
      .section-title { font-size: 1.5rem; }
    }

    .footer-link {
      color: rgba(255,255,255,.35);
      font-size: .75rem;
      transition: color .2s, transform .2s;
    }
    .mobile-dock-wrap {
      position: fixed;
      left: 0;
      right: 0;
      bottom: max(12px, env(safe-area-inset-bottom));
      z-index: 40;
      display: flex;
      justify-content: center;
      pointer-events: none;
    }
    .mobile-dock {
      pointer-events: auto;
      display: grid;
      grid-template-columns: repeat(5, minmax(0, 1fr));
      gap: .12rem;
      width: min(calc(100vw - 18px), 410px);
      padding: .32rem;
      border-radius: 1.3rem;
      background: rgba(12,16,28,.72);
      border: 1px solid rgba(255,255,255,.08);
      box-shadow:
        0 18px 40px rgba(0,0,0,.28),
        inset 0 1px 0 rgba(255,255,255,.08);
      backdrop-filter: blur(22px) saturate(135%);
      -webkit-backdrop-filter: blur(22px) saturate(135%);
    }
    .mobile-dock-item {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: .22rem;
      min-height: 50px;
      border-radius: 1rem;
      color: rgba(255,255,255,.42);
      transition: color .2s ease, transform .2s ease, background .2s ease;
    }
    .mobile-dock-item span {
      font-size: 10px;
      line-height: 1;
      white-space: nowrap;
    }
    .mobile-dock-item:hover,
    .mobile-dock-item:focus {
      color: #fff;
      transform: translateY(-1px);
      background: rgba(255,255,255,.05);
    }
    .frontend-site-header {
      transition: transform .28s ease, opacity .28s ease;
    }
    @media (max-width: 767px) {
      body.user-mobile-focus .frontend-site-header {
        transform: translateY(-100%);
        opacity: 0;
        pointer-events: none;
      }
      html.theme-light body.user-mobile-focus {
        background: #f8fafc;
      }
      html.theme-light .user-mobile-panel {
        background: #f8fafc !important;
      }
      html.theme-light .user-mobile-topbar {
        background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.94)) !important;
        border-bottom: 1px solid rgba(148,163,184,.22) !important;
        box-shadow: 0 10px 30px rgba(15,23,42,.06);
      }
    }
    .footer-link:hover,
    .footer-link:focus {
      color: #fff;
      transform: translateY(-1px);
    }
    .tool-scroll::-webkit-scrollbar {
      width: 6px;
    }
    .tool-scroll::-webkit-scrollbar-thumb {
      background: rgba(255,255,255,.12);
      border-radius: 999px;
    }
    .tool-scroll::-webkit-scrollbar-track {
      background: transparent;
    }
    .thin-scrollbar {
      scrollbar-width: thin;
      scrollbar-color: rgba(255,255,255,.16) transparent;
    }
    .thin-scrollbar::-webkit-scrollbar {
      width: 6px;
      height: 6px;
    }
    .thin-scrollbar::-webkit-scrollbar-thumb {
      background: rgba(255,255,255,.16);
      border-radius: 999px;
      border: 1px solid transparent;
      background-clip: padding-box;
    }
    .thin-scrollbar::-webkit-scrollbar-track {
      background: transparent;
    }
    .user-center-outline-btn {
      border: 1px solid rgba(255,255,255,.12);
      box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
    }
    .promotion-subtab {
      background: rgba(255,255,255,.06);
      border: 1px solid rgba(255,255,255,.1);
      color: rgba(255,255,255,.74);
      box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
    }
    .promotion-subtab.is-active {
      background: rgba(168,85,247,.16);
      border-color: rgba(168,85,247,.22);
      color: #f5d0fe;
    }
    .user-center-permission-wrap {
      background: rgba(255,255,255,.04);
      border: 1px solid rgba(255,255,255,.08);
    }
    .user-center-permission-title {
      color: rgba(255,255,255,.45);
    }
    .user-center-permission-card {
      background: rgba(255,255,255,.04);
      border: 1px solid rgba(255,255,255,.08);
      box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
    }
    .user-center-permission-label {
      color: rgba(255,255,255,.36);
    }
    .user-center-permission-value {
      color: #fff;
    }
    .user-center-permission-status-on {
      color: #86efac;
    }
    .user-center-permission-status-off {
      color: #fca5a5;
    }
    html.theme-light .thin-scrollbar {
      scrollbar-color: rgba(148,163,184,.46) transparent;
    }
    html.theme-light .thin-scrollbar::-webkit-scrollbar-thumb {
      background: rgba(148,163,184,.46);
    }
    html.theme-light .user-center-outline-btn {
      border-color: rgba(148,163,184,.28) !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.45);
    }
    html.theme-light .promotion-subtab {
      background: rgba(255,255,255,.92) !important;
      border-color: rgba(203,213,225,.72) !important;
      color: #334155 !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
    }
    html.theme-light .promotion-subtab.is-active {
      background: rgba(139,92,246,.14) !important;
      border-color: rgba(139,92,246,.28) !important;
      color: #6d28d9 !important;
    }
    html.theme-light .user-center-permission-wrap {
      background: #fff !important;
      border-color: rgba(229,231,235,1) !important;
    }
    html.theme-light .user-center-permission-title {
      color: #6b7280 !important;
    }
    html.theme-light .user-center-permission-card {
      background: rgba(249,250,251,.8) !important;
      border-color: rgba(229,231,235,1) !important;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.55);
    }
    html.theme-light .user-center-permission-label {
      color: #9ca3af !important;
    }
    html.theme-light .user-center-permission-value {
      color: #111827 !important;
    }
    html.theme-light .user-center-permission-status-on {
      color: #059669 !important;
    }
    html.theme-light .user-center-permission-status-off {
      color: #f43f5e !important;
    }
    .user-center-shell .overflow-y-auto,
    .user-center-overlay .overflow-y-auto,
    .info-modal-shell .overflow-y-auto,
    .shop-qr-shell .overflow-y-auto,
    .tool-frame-shell .overflow-y-auto {
      scrollbar-width: thin;
      scrollbar-color: rgba(255,255,255,.16) transparent;
    }
    .user-center-shell .overflow-y-auto::-webkit-scrollbar,
    .user-center-overlay .overflow-y-auto::-webkit-scrollbar,
    .info-modal-shell .overflow-y-auto::-webkit-scrollbar,
    .shop-qr-shell .overflow-y-auto::-webkit-scrollbar,
    .tool-frame-shell .overflow-y-auto::-webkit-scrollbar {
      width: 6px;
      height: 6px;
    }
    .user-center-shell .overflow-y-auto::-webkit-scrollbar-thumb,
    .user-center-overlay .overflow-y-auto::-webkit-scrollbar-thumb,
    .info-modal-shell .overflow-y-auto::-webkit-scrollbar-thumb,
    .shop-qr-shell .overflow-y-auto::-webkit-scrollbar-thumb,
    .tool-frame-shell .overflow-y-auto::-webkit-scrollbar-thumb {
      background: rgba(255,255,255,.16);
      border-radius: 999px;
    }
    .user-center-shell .overflow-y-auto::-webkit-scrollbar-track,
    .user-center-overlay .overflow-y-auto::-webkit-scrollbar-track,
    .info-modal-shell .overflow-y-auto::-webkit-scrollbar-track,
    .shop-qr-shell .overflow-y-auto::-webkit-scrollbar-track,
    .tool-frame-shell .overflow-y-auto::-webkit-scrollbar-track {
      background: transparent;
    }
    .tool-frame-close {
      color: #fff !important;
      font-weight: 700;
      text-shadow: 0 0 0 rgba(255,255,255,.95);
    }
    html.theme-light .user-center-shell .overflow-y-auto,
    html.theme-light .user-center-overlay .overflow-y-auto,
    html.theme-light .info-modal-shell .overflow-y-auto,
    html.theme-light .shop-qr-shell .overflow-y-auto,
    html.theme-light .tool-frame-shell .overflow-y-auto {
      scrollbar-color: rgba(148,163,184,.46) transparent;
    }
    html.theme-light .user-center-shell .overflow-y-auto::-webkit-scrollbar-thumb,
    html.theme-light .user-center-overlay .overflow-y-auto::-webkit-scrollbar-thumb,
    html.theme-light .info-modal-shell .overflow-y-auto::-webkit-scrollbar-thumb,
    html.theme-light .shop-qr-shell .overflow-y-auto::-webkit-scrollbar-thumb,
    html.theme-light .tool-frame-shell .overflow-y-auto::-webkit-scrollbar-thumb {
      background: rgba(148,163,184,.46);
    }
    .no-scrollbar::-webkit-scrollbar { display: none; }
    .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

    /* ── 输入框 ── */
    .inp {
      background: rgba(255,255,255,.06);
      border: 1px solid rgba(255,255,255,.12);
      border-radius: .5rem;
      color: #e2e8f0;
      padding: .625rem .875rem;
      width: 100%;
      font-size: .875rem;
      transition: border-color .2s;
      outline: none;
    }
    .inp::placeholder { color: rgba(255,255,255,.3); }
    .inp:focus { border-color: var(--cyan); }
    .touch-target {
      min-width: 44px;
      min-height: 44px;
    }

    /* ── 支付方式选择 ── */
    .pay-btn {
      border: 1px solid rgba(255,255,255,.12);
      border-radius: .5rem;
      padding: .5rem .875rem;
      font-size: .8125rem;
      cursor: pointer;
      transition: border-color .2s, background .2s;
      background: rgba(255,255,255,.04);
      color: #cbd5e1;
    }
    .pay-btn.active {
      border-color: var(--cyan);
      background: rgba(0,212,255,.1);
      color: var(--cyan);
      box-shadow: inset 0 0 0 1px rgba(0,212,255,.18), 0 8px 20px rgba(0,212,255,.12);
      position: relative;
    }

    /* ── 产品卡片选中 ── */
    .product-card { transition: border-color .2s, background .2s, transform .2s; }
    .product-card.selected {
      border-color: var(--cyan) !important;
      background: rgba(0,212,255,.07) !important;
    }

    /* ── 分隔线 ── */
    .section-divider {
      border: none;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,.08), transparent);
      margin: 0;
    }

    /* ── 导航 ── */
    .nav-link {
      color: rgba(255,255,255,.6);
      font-size: .875rem;
      text-decoration: none;
      transition: color .2s;
    }
    .nav-link:hover { color: var(--cyan); }

    /* 适度抬高默认主题常用弱文字的对比度，避免 Lighthouse 因过低透明度持续扣分。 */
    [style*="color:rgba(255,255,255,.22);"],
    [style*="color:rgba(255,255,255,.28);"],
    [style*="color:rgba(255,255,255,.3);"],
    [style*="color:rgba(255,255,255,.32);"],
    [style*="color:rgba(255,255,255,.34);"],
    [style*="color:rgba(255,255,255,.35);"],
    [style*="color:rgba(255,255,255,.36);"],
    [style*="color:rgba(255,255,255,.38);"],
    [style*="color:rgba(255,255,255,.4);"],
    [style*="color:rgba(255,255,255,.42);"],
    [style*="color:rgba(255,255,255,.45);"],
    [style*="color:rgba(255,255,255,.46);"],
    [style*="color:rgba(255,255,255,.48);"],
    [style*="color:rgba(255,255,255,.5);"],
    [style*="color:rgba(255,255,255,.54);"],
    [style*="color:rgba(255,255,255,.56);"],
    [style*="color:rgba(255,255,255,.58);"] {
      color: rgba(255,255,255,.76) !important;
    }
    .text-white\/20,
    .text-white\/30,
    .text-white\/40,
    .text-white\/45,
    .text-white\/50,
    .text-white\/60,
    .text-white\/70 {
      color: rgba(255,255,255,.78) !important;
    }

    /* ── FAQ 折叠 ── */
    .faq-item { border-bottom: 1px solid rgba(255,255,255,.07); }
    .faq-item:last-child { border-bottom: none; }

    html.theme-light body {
  background: #f6f8fb;
  color: #0f172a;
}
html.theme-light .grid-bg {
  background-image:
    linear-gradient(rgba(15, 23, 42, .04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15, 23, 42, .04) 1px, transparent 1px);
}
html.theme-light .orb-1 {
  background: radial-gradient(circle, rgba(14,165,233,.10), transparent 70%);
}
html.theme-light .orb-2 {
  background: radial-gradient(circle, rgba(99,102,241,.08), transparent 70%);
}
html.theme-light .orb-3 {
  background: radial-gradient(circle, rgba(56,189,248,.05), transparent 70%);
}
html.theme-light .glass {
  background: rgba(255,255,255,.84);
  border-color: rgba(15,23,42,.08);
  box-shadow: 0 18px 40px rgba(15,23,42,.06);
}
html.theme-light .glass-hover:hover {
  background: rgba(255,255,255,.96);
  border-color: rgba(14,165,233,.18);
  box-shadow: 0 12px 32px rgba(15,23,42,.08);
}
html.theme-light .text-white {
  color: #0f172a !important;
}
html.theme-light .text-white\/60,
html.theme-light .text-white\/50,
html.theme-light .text-white\/40,
html.theme-light .text-white\/30,
html.theme-light .text-white\/20 {
  color: rgba(15,23,42,.58) !important;
}
html.theme-light [style*="color:rgba(255,255,255"] {
  color: rgba(15,23,42,.62) !important;
}
html.theme-light [style*="color:#fff"] {
  color: #0f172a !important;
}
html.theme-light [style*="background:rgba(255,255,255,.04)"] {
  background: rgba(255,255,255,.86) !important;
}
html.theme-light [style*="background:rgba(255,255,255,.05)"] {
  background: rgba(255,255,255,.9) !important;
}
html.theme-light [style*="border:1px solid rgba(255,255,255,.08)"] {
  border-color: rgba(15,23,42,.08) !important;
}
html.theme-light [style*="border:1px solid rgba(255,255,255,.15)"] {
  border-color: rgba(148,163,184,.38) !important;
}
html.theme-light [style*="border:1px solid rgba(255,255,255,.14)"] {
  border-color: rgba(148,163,184,.35) !important;
}
html.theme-light [style*="border:1px solid rgba(255,255,255,.12)"] {
  border-color: rgba(148,163,184,.32) !important;
}
html.theme-light [style*="border:1px solid rgba(255,255,255,.07)"] {
  border-color: rgba(148,163,184,.22) !important;
}
html.theme-light [style*="border:1px solid rgba(255,255,255,.06)"] {
  border-color: rgba(148,163,184,.18) !important;
}
html.theme-light [style*="border-color:rgba(255,255,255,.08)"] {
  border-color: rgba(15,23,42,.08) !important;
}
html.theme-light .footer-link,
html.theme-light .nav-link,
html.theme-light .mobile-dock-item {
  color: rgba(15,23,42,.58);
}
html.theme-light .mobile-dock {
  background: rgba(255,255,255,.82);
  border-color: rgba(15,23,42,.08);
  box-shadow:
    0 18px 40px rgba(15,23,42,.12),
    inset 0 1px 0 rgba(255,255,255,.7);
}
html.theme-light .mobile-dock-item:hover,
html.theme-light .mobile-dock-item:focus {
  color: #0f172a;
  background: rgba(15,23,42,.05);
}
html.theme-light .inp {
  background: rgba(255,255,255,.98);
  border-color: rgba(148,163,184,.35);
  color: #0f172a;
}
html.theme-light .inp::placeholder {
  color: rgba(15,23,42,.32);
}
html.theme-light .pay-btn {
  background: rgba(255,255,255,.88);
  border-color: rgba(148,163,184,.35);
  color: rgba(15,23,42,.68);
}
html.theme-light .pay-btn.active {
  background: linear-gradient(135deg, rgba(14,165,233,.12), rgba(99,102,241,.10));
  border-color: rgba(14,165,233,.42);
  color: #0369a1;
  box-shadow: inset 0 0 0 1px rgba(14,165,233,.22), 0 10px 24px rgba(14,165,233,.12);
}
html.theme-light .section-divider {
  background: linear-gradient(90deg, transparent, rgba(15,23,42,.08), transparent);
}
html.theme-light .faq-item {
  border-bottom-color: rgba(148,163,184,.26);
}
html.theme-light .user-center-overlay {
  background: rgba(248, 250, 252, .78) !important;
  backdrop-filter: blur(10px);
}
html.theme-light .user-center-shell {
  background:
    radial-gradient(circle at top, rgba(14,165,233,.12), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.94)) !important;
  border-color: rgba(148,163,184,.22) !important;
  box-shadow:
    0 24px 60px rgba(15,23,42,.12),
    inset 0 1px 0 rgba(255,255,255,.82) !important;
}
html.theme-light .user-center-login-card {
  background: rgba(255,255,255,.88) !important;
  border-color: rgba(148,163,184,.18) !important;
  box-shadow: 0 14px 30px rgba(15,23,42,.06);
}
html.theme-light .user-center-topbar {
  background: linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,0)) !important;
  border-color: rgba(148,163,184,.18) !important;
}
html.theme-light .user-center-tabs {
  background: rgba(255,255,255,.72) !important;
  border-color: rgba(148,163,184,.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85);
}
html.theme-light .join-btn {
  background: rgba(255, 255, 255, .52) !important;
}
html.theme-light .user-center-empty,
html.theme-light .agency-note,
html.theme-light .agency-desc,
html.theme-light .agency-card-desc,
html.theme-light .agency-card-days {
  color: rgba(51,65,85,.72) !important;
}
html.theme-light .agency-group-card {
  background: rgba(255,255,255,.82) !important;
  border-color: rgba(148,163,184,.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.78);
}
html.theme-light .user-agency-shell .text-white\/45,
html.theme-light .user-agency-shell .hover\:text-white,
html.theme-light .user-agency-shell button[style*="rgba(255,255,255,.82)"] {
  color: rgba(51,65,85,.82) !important;
}
html.theme-light .user-agency-shell button[style*="border:1px solid rgba(255,255,255,.1)"] {
  border-color: rgba(148,163,184,.22) !important;
  background: rgba(255,255,255,.88) !important;
}
html.theme-light .agency-arrow {
  background: rgba(255,255,255,.88) !important;
  border-color: rgba(148,163,184,.22) !important;
  color: rgba(51,65,85,.78) !important;
}
html.theme-light .domain-price-list .glass {
  background: transparent !important;
  box-shadow: none !important;
}
html.theme-light .shop-buy-overlay,
html.theme-light .shop-qr-overlay {
  background: rgba(248, 250, 252, .78) !important;
  backdrop-filter: blur(10px);
}
html.theme-light [x-show="$store.toolFrame.show"] {
  background: rgba(241, 245, 249, .68) !important;
  backdrop-filter: blur(12px) saturate(125%) !important;
}
html.theme-light .shop-buy-shell,
html.theme-light .shop-qr-shell,
html.theme-light .tool-frame-shell,
html.theme-light .info-modal-shell {
  background:
    radial-gradient(circle at top, rgba(14,165,233,.10), transparent 40%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.95)) !important;
  border-color: rgba(148,163,184,.22) !important;
  box-shadow:
    0 24px 60px rgba(15,23,42,.12),
    inset 0 1px 0 rgba(255,255,255,.82) !important;
}
html.theme-light .tool-frame-close {
  color: #fff !important;
}
html.theme-light .user-account-hero {
  background:
    radial-gradient(circle at top, rgba(14,165,233,.14), transparent 40%),
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(241,245,249,.96)) !important;
  border: 1px solid rgba(148,163,184,.22) !important;
  box-shadow: 0 18px 40px rgba(15,23,42,.06);
}
html.theme-light .tool-frame-shell [style*="background:linear-gradient(180deg, rgba(10,14,24,.86)"] {
  background: linear-gradient(180deg, rgba(255,255,255,.82), rgba(241,245,249,.88)) !important;
}
html.theme-light .shop-qr-title {
  color: #0f172a !important;
}
html.theme-light .shop-qr-close,
html.theme-light .shop-qr-meta,
html.theme-light .shop-qr-helper,
html.theme-light .shop-qr-countdown,
html.theme-light .shop-qr-orderlabel,
html.theme-light .shop-qr-orderno,
html.theme-light .shop-qr-delivery-head,
html.theme-light .shop-qr-delivery-empty {
  color: rgba(51, 65, 85, .72) !important;
}
html.theme-light .shop-qr-tip {
  background: rgba(14,165,233,.10) !important;
  border-color: rgba(14,165,233,.18) !important;
  color: #334155 !important;
}
html.theme-light .shop-qr-pending {
  background: rgba(255,255,255,.86) !important;
  border-color: rgba(148,163,184,.22) !important;
  color: rgba(51,65,85,.72) !important;
}
html.theme-light .shop-qr-success {
  background: rgba(34,197,94,.10) !important;
  border-color: rgba(34,197,94,.18) !important;
  color: #166534 !important;
}
html.theme-light .shop-qr-fulfill {
  background: rgba(14,165,233,.10) !important;
  border-color: rgba(14,165,233,.18) !important;
  color: #334155 !important;
}
html.theme-light .shop-qr-delivery,
html.theme-light .shop-qr-orderbox {
  background: rgba(255,255,255,.82) !important;
  border-color: rgba(148,163,184,.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.72);
}
html.theme-light .shop-qr-delivery-item {
  background: rgba(248,250,252,.92) !important;
  border-color: rgba(148,163,184,.16) !important;
}
html.theme-light .shop-qr-delivery-text {
  color: rgba(15,23,42,.84) !important;
}
html.theme-light .info-modal-overlay,
html.theme-light .whois-modal-overlay {
  background: rgba(248, 250, 252, .78) !important;
  backdrop-filter: blur(10px);
}
html.theme-light .whois-modal-shell {
  background:
    radial-gradient(circle at top, rgba(14,165,233,.08), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.95)) !important;
  border: 1px solid rgba(148,163,184,.22) !important;
  box-shadow:
    0 24px 60px rgba(15,23,42,.12),
    inset 0 1px 0 rgba(255,255,255,.82) !important;
}
html.theme-light .whois-modal-title {
  color: #0f172a !important;
}
html.theme-light .whois-modal-subtitle,
html.theme-light .whois-modal-close {
  color: rgba(71, 85, 105, .72) !important;
}
html.theme-light .whois-modal-body {
  background: rgba(255,255,255,.82) !important;
  border: 1px solid rgba(148,163,184,.2) !important;
  color: rgba(30,41,59,.86) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.65);
}
html.theme-light .whois-modal-body a {
  color: #0f766e !important;
}
html.theme-light .info-modal-shell [x-html] {
  color: #334155;
}
html.theme-light .info-modal-shell [x-html] h3,
html.theme-light .info-modal-shell [x-html] h4,
html.theme-light .info-modal-shell [x-html] .text-slate-900 {
  color: #0f172a !important;
}
html.theme-light .info-modal-shell [x-html] p,
html.theme-light .info-modal-shell [x-html] div,
html.theme-light .info-modal-shell [x-html] li,
html.theme-light .info-modal-shell [x-html] .text-slate-700 {
  color: #334155 !important;
}
html.theme-light .info-modal-shell [x-html] .text-slate-500 {
  color: #64748b !important;
}
html.theme-light .info-modal-shell [x-html] .bg-slate-50\/80,
html.theme-light .info-modal-shell [x-html] .bg-slate-50,
html.theme-light .info-modal-shell [x-html] .dark\:bg-white\/5 {
  background: rgba(248, 250, 252, 0.92) !important;
}
html.theme-light .info-modal-shell [x-html] .border-slate-200,
html.theme-light .info-modal-shell [x-html] .dark\:border-white\/10 {
  border-color: rgba(148, 163, 184, 0.22) !important;
}
html.theme-light .info-modal-shell [x-html] .text-emerald-500 {
  color: #16a34a !important;
}
html.theme-light .info-modal-shell [x-html] .text-rose-500 {
  color: #e11d48 !important;
}
html.theme-light .info-modal-shell [x-html] code {
  color: #0369a1 !important;
  background: rgba(226, 232, 240, 0.7) !important;
}
    /** ══ 彩虹渐变背景 ══ */
    .text-grass {background: linear-gradient(90deg, #ff4d4d, #e63535, #ff6347, #ff0000, #ff7f50, #ff4500, #ff1493, #ff8c00, #ff00ff, #ff00ff, #9932cc, #8a2be2, #4b0082, #483d8b, #0000ff, #000080);}
    
    
/* ========== 信息弹窗正文：黑色主题 ========== */
.info-modal-shell [x-html] {
  color: rgba(255, 255, 255, 0.82);
}

.info-modal-shell [x-html] h3,
.info-modal-shell [x-html] h4,
.info-modal-shell [x-html] .text-slate-900 {
  color: rgba(255, 255, 255, 0.96) !important;
}

.info-modal-shell [x-html] p,
.info-modal-shell [x-html] div,
.info-modal-shell [x-html] li,
.info-modal-shell [x-html] .text-slate-700 {
  color: rgba(255, 255, 255, 0.76) !important;
}

.info-modal-shell [x-html] .text-slate-500 {
  color: rgba(255, 255, 255, 0.46) !important;
}

.info-modal-shell [x-html] .bg-slate-50\/80,
.info-modal-shell [x-html] .bg-slate-50,
.info-modal-shell [x-html] .dark\:bg-white\/5 {
  background: rgba(255, 255, 255, 0.045) !important;
}

.info-modal-shell [x-html] .border-slate-200,
.info-modal-shell [x-html] .dark\:border-white\/10 {
  border-color: rgba(255, 255, 255, 0.08) !important;
}

.info-modal-shell [x-html] .text-emerald-500 {
  color: #86efac !important;
}

.info-modal-shell [x-html] .text-rose-500 {
  color: #fda4af !important;
}

.info-modal-shell [x-html] code {
  color: #7dd3fc !important;
  background: rgba(255, 255, 255, 0.06) !important;
  padding: 0.1rem 0.35rem;
  border-radius: 0.35rem;
}

:root {
      --cyan: #00d4ff;
      --purple: #a855f7;
      --green: #22c55e;
    }

    * {
      box-sizing: border-box;
    }

    body {
      background: #080b14;
      color: #e2e8f0;
      font-family: -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
      min-height: 100vh;
      overflow-x: hidden;
    }

    html.theme-light body {
  background: #f6f8fb;
  color: #0f172a;
}
html.theme-light .grid-bg {
  background-image:
    linear-gradient(rgba(15, 23, 42, .04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15, 23, 42, .04) 1px, transparent 1px);
}
html.theme-light .orb-1 {
  background: radial-gradient(circle, rgba(14,165,233,.10), transparent 70%);
}
html.theme-light .orb-2 {
  background: radial-gradient(circle, rgba(99,102,241,.08), transparent 70%);
}
html.theme-light .orb-3 {
  background: radial-gradient(circle, rgba(56,189,248,.05), transparent 70%);
}
html.theme-light .glass {
  background: rgba(255,255,255,1);
  border-color: rgba(15,23,42,.08);
  box-shadow: 0 18px 40px rgba(15,23,42,.06);
  margin-top: 10px;
}
html.theme-light .glass-hover:hover {
  background: rgba(255,255,255,.96);
  border-color: rgba(14,165,233,.18);
  box-shadow: 0 12px 32px rgba(15,23,42,.08);
}
html.theme-light .text-white {
  color: #0f172a !important;
}
html.theme-light .text-white\/60,
html.theme-light .text-white\/50,
html.theme-light .text-white\/40,
html.theme-light .text-white\/30,
html.theme-light .text-white\/20 {
  color: rgba(15,23,42,.58) !important;
}
html.theme-light [style*="color:rgba(255,255,255"] {
  color: rgba(15,23,42,.62) !important;
}
html.theme-light [style*="color:#fff"] {
  color: #0f172a !important;
}
html.theme-light [style*="background:rgba(255,255,255,.04)"] {
  background: rgba(255,255,255,.86) !important;
}
html.theme-light [style*="background:rgba(255,255,255,.05)"] {
  background: rgba(255,255,255,.9) !important;
}
html.theme-light [style*="border:1px solid rgba(255,255,255,.08)"] {
  border-color: rgba(15,23,42,.08) !important;
}
html.theme-light [style*="border:1px solid rgba(255,255,255,.15)"] {
  border-color: rgba(148,163,184,.38) !important;
}
html.theme-light [style*="border:1px solid rgba(255,255,255,.14)"] {
  border-color: rgba(148,163,184,.35) !important;
}
html.theme-light [style*="border:1px solid rgba(255,255,255,.12)"] {
  border-color: rgba(148,163,184,.32) !important;
}
html.theme-light [style*="border:1px solid rgba(255,255,255,.07)"] {
  border-color: rgba(148,163,184,.22) !important;
}
html.theme-light [style*="border-color:rgba(255,255,255,.08)"] {
  border-color: rgba(15,23,42,.08) !important;
}
html.theme-light .nav-link,
html.theme-light .footer-link {
  color: rgba(15,23,42,.58);
}
html.theme-light .nav-link:hover,
html.theme-light .footer-link:hover,
html.theme-light .footer-link:focus {
  color: #0f172a;
}
html.theme-light .inp,
html.theme-light .input-tech {
  background: rgba(255,255,255,.98);
  border-color: rgba(148,163,184,.35);
  color: #0f172a;
  box-shadow: none;
}
html.theme-light .inp::placeholder,
html.theme-light .input-tech::placeholder {
  color: rgba(15,23,42,.32);
}
html.theme-light .pay-btn {
  background: rgba(255,255,255,.88);
  border-color: rgba(148,163,184,.35);
  color: rgba(15,23,42,.68);
}
html.theme-light .pay-btn.active {
  background: linear-gradient(135deg, rgba(14,165,233,.12), rgba(99,102,241,.10));
  border-color: rgba(14,165,233,.42);
  color: #0369a1;
  box-shadow: inset 0 0 0 1px rgba(14,165,233,.22), 0 10px 24px rgba(14,165,233,.12);
}
html.theme-light .section-label {
  background: rgba(255,255,255,.84);
  border-color: rgba(148,163,184,.24);
  color: rgba(15,23,42,.46);
}
html.theme-light .step-card {
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(248,250,252,.96));
  border-color: rgba(148,163,184,.18);
  box-shadow: 0 12px 32px rgba(15,23,42,.06);
}
html.theme-light .step-dot {
  border-color: rgba(148,163,184,.28);
  color: rgba(15,23,42,.42);
  background: rgba(255,255,255,.84);
}
html.theme-light .step-line {
  background: rgba(148,163,184,.22);
}
html.theme-light .faq-item {
  border-bottom-color: rgba(148,163,184,.20);
}
html.theme-light .faq-q {
  color: rgba(15,23,42,.82);
}
html.theme-light .faq-q:hover {
  color: #0369a1;
}
html.theme-light .faq-a {
  color: rgba(15,23,42,.62);
}
html.theme-light .text-white\/45 {
  color: rgba(15,23,42,.56) !important;
}
html.theme-light .text-white\/35 {
  color: rgba(15,23,42,.42) !important;
}
html.theme-light .text-white\/40.text-sm {
  color: rgba(15,23,42,.48) !important;
}
html.theme-light .shop-buy-overlay,
html.theme-light .shop-qr-overlay,
html.theme-light .info-modal-overlay {
  background: rgba(248, 250, 252, .78) !important;
  backdrop-filter: blur(10px);
}
html.theme-light .shop-buy-shell,
html.theme-light .shop-qr-shell,
html.theme-light .info-modal-shell {
  background:
    radial-gradient(circle at top, rgba(14,165,233,.10), transparent 40%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.95)) !important;
  border-color: rgba(148,163,184,.22) !important;
  box-shadow:
    0 24px 60px rgba(15,23,42,.12),
    inset 0 1px 0 rgba(255,255,255,.82) !important;
}

    /* ── 动态网格背景 ── */
    .grid-bg {
      position: fixed;
      inset: 0;
      z-index: 0;
      background-image:
        linear-gradient(rgba(0, 212, 255, .035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 212, 255, .035) 1px, transparent 1px);
      background-size: 48px 48px;
      animation: gridMove 24s linear infinite;
    }

    @keyframes gridMove {
      0% {
        background-position: 0 0;
      }

      100% {
        background-position: 48px 48px;
      }
    }

    /* 辉光球 */
    .orb {
      position: fixed;
      border-radius: 50%;
      filter: blur(90px);
      pointer-events: none;
      z-index: 0;
    }

    .orb-1 {
      width: 600px;
      height: 600px;
      top: -250px;
      left: -200px;
      background: radial-gradient(circle, rgba(168, 85, 247, .13), transparent 70%);
    }

    .orb-2 {
      width: 500px;
      height: 500px;
      bottom: -150px;
      right: -150px;
      background: radial-gradient(circle, rgba(0, 212, 255, .10), transparent 70%);
    }

    .orb-3 {
      width: 300px;
      height: 300px;
      top: 60%;
      left: 50%;
      background: radial-gradient(circle, rgba(34, 197, 94, .06), transparent 70%);
    }

    /* ── 通用卡片 ── */
    .glass {
      background: rgba(255, 255, 255, .04);
      border: 1px solid rgba(255, 255, 255, .08);
      backdrop-filter: blur(12px);
      border-radius: 16px;
    }

    .glass-hover:hover {
      border-color: rgba(0, 212, 255, .28);
      background: rgba(0, 212, 255, .04);
      box-shadow: 0 0 28px rgba(0, 212, 255, .08);
      transition: all .2s;
    }

    /* ── 商品卡选中状态 ── */
    .product-card.selected {
      border-color: var(--cyan) !important;
      background: rgba(0, 212, 255, .08) !important;
      box-shadow: 0 0 32px rgba(0, 212, 255, .18);
    }

    /* ── 渐变按钮 ── */
    .btn-primary {
      background: linear-gradient(135deg, #00d4ff, #a855f7);
      color: #fff;
      border: none;
      border-radius: 10px;
      font-weight: 600;
      cursor: pointer;
      transition: opacity .2s, transform .1s;
      position: relative;
      overflow: hidden;
    }

    .btn-primary::after {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(135deg, #a855f7, #00d4ff);
      opacity: 0;
      transition: opacity .3s;
    }

    .btn-primary:hover::after {
      opacity: 1;
    }

    .btn-primary>* {
      position: relative;
      z-index: 1;
    }

    .btn-primary:active {
      transform: scale(.98);
    }

    .nav-link {
      color: rgba(255,255,255,.6);
      font-size: .875rem;
      text-decoration: none;
      transition: color .2s;
    }

    .nav-link:hover {
      color: var(--cyan);
    }

    .footer-link {
      color: rgba(255,255,255,.35);
      font-size: .75rem;
      transition: color .2s, transform .2s;
    }

    .footer-link:hover,
    .footer-link:focus {
      color: #fff;
      transform: translateY(-1px);
    }

    .btn-primary:disabled {
      opacity: .45;
      cursor: not-allowed;
    }

    /* ── 步骤指示器 ── */
    .step-dot {
      width: 28px;
      height: 28px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 12px;
      font-weight: 700;
      border: 1.5px solid rgba(255, 255, 255, .15);
      color: rgba(255, 255, 255, .4);
      transition: all .3s;
    }

    .step-dot.active {
      border-color: var(--cyan);
      color: var(--cyan);
      box-shadow: 0 0 12px rgba(0, 212, 255, .4);
    }

    .step-dot.done {
      background: var(--cyan);
      border-color: var(--cyan);
      color: #080b14;
    }

    .step-line {
      flex: 1;
      height: 1px;
      background: rgba(255, 255, 255, .1);
      transition: background .3s;
    }

    .step-line.done {
      background: var(--cyan);
    }

    /* ── 输入框 ── */
    .input-tech {
      background: rgba(255, 255, 255, .05);
      border: 1px solid rgba(255, 255, 255, .1);
      border-radius: 10px;
      color: #e2e8f0;
      padding: 12px 16px;
      width: 100%;
      font-size: 15px;
      transition: border-color .2s, box-shadow .2s;
      outline: none;
    }

    .input-tech::placeholder {
      color: rgba(255, 255, 255, .3);
    }

    .input-tech:focus {
      border-color: var(--cyan);
      box-shadow: 0 0 0 3px rgba(0, 212, 255, .12);
    }

    .inp {
      background: rgba(255, 255, 255, .05);
      border: 1px solid rgba(255, 255, 255, .1);
      border-radius: 10px;
      color: #e2e8f0;
      padding: 12px 16px;
      width: 100%;
      font-size: 15px;
      transition: border-color .2s, box-shadow .2s;
      outline: none;
    }

    .inp::placeholder {
      color: rgba(255, 255, 255, .3);
    }

    .inp:focus {
      border-color: var(--cyan);
      box-shadow: 0 0 0 3px rgba(0, 212, 255, .12);
    }

    /* ── 支付按钮（与首页共享弹窗保持一致） ── */
    .pay-btn {
      border: 1px solid rgba(255, 255, 255, .12);
      border-radius: .5rem;
      padding: .5rem .875rem;
      font-size: .8125rem;
      cursor: pointer;
      transition: border-color .2s, background .2s;
      background: rgba(255, 255, 255, .04);
      color: #cbd5e1;
    }

    .pay-btn:hover {
      border-color: rgba(0, 212, 255, .5);
      background: rgba(0, 212, 255, .06);
    }

    .pay-btn.active {
      border-color: var(--cyan);
      background: rgba(0, 212, 255, .1);
      color: var(--cyan);
      box-shadow: inset 0 0 0 1px rgba(0,212,255,.18), 0 8px 20px rgba(0,212,255,.12);
      position: relative;
    }
    /* ── 标签 ── */
    .badge-hot {
      background: linear-gradient(135deg, #f59e0b, #ef4444);
      color: #fff;
      font-size: 10px;
      font-weight: 700;
      padding: 2px 7px;
      border-radius: 20px;
      text-transform: uppercase;
      letter-spacing: .5px;
    }

    .badge-new {
      background: linear-gradient(135deg, #00d4ff, #a855f7);
      color: #fff;
      font-size: 10px;
      font-weight: 700;
      padding: 2px 7px;
      border-radius: 20px;
      letter-spacing: .5px;
    }

    /* ── 弹窗遮罩 ── */
    .modal-bg {
      position: fixed;
      inset: 0;
      z-index: 100;
      background: rgba(0, 0, 0, .72);
      backdrop-filter: blur(6px);
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 16px;
    }

    /* ── QR 发光框 ── */
    .qr-frame {
      padding: 12px;
      background: #fff;
      border-radius: 14px;
      box-shadow: 0 0 40px rgba(0, 212, 255, .3);
    }

    /* ── 授权码 ── */
    .license-key {
      font-family: 'SF Mono', 'Fira Code', monospace;
      font-size: 13px;
      background: rgba(0, 212, 255, .08);
      border: 1px solid rgba(0, 212, 255, .25);
      border-radius: 8px;
      padding: 10px 14px;
      word-break: break-all;
      color: var(--cyan);
      letter-spacing: .5px;
    }

    /* ── 特性条 ── */
    .feature-item {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      padding: 16px;
      border-radius: 12px;
      background: rgba(255, 255, 255, .03);
      border: 1px solid rgba(255, 255, 255, .06);
      transition: all .2s;
    }

    .feature-item:hover {
      background: rgba(0, 212, 255, .04);
      border-color: rgba(0, 212, 255, .15);
    }

    .feature-icon {
      width: 36px;
      height: 36px;
      border-radius: 10px;
      flex-none;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    /* ── 步骤卡片 ── */
    .step-card {
      position: relative;
      padding: 24px;
      border-radius: 16px;
      background: rgba(255, 255, 255, .03);
      border: 1px solid rgba(255, 255, 255, .06);
    }

    .step-num {
      position: absolute;
      top: -12px;
      left: 20px;
      width: 28px;
      height: 28px;
      border-radius: 50%;
      background: linear-gradient(135deg, #00d4ff, #a855f7);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 13px;
      font-weight: 700;
      color: #080b14;
    }

    /* ── FAQ 折叠 ── */
    .faq-item {
      border-bottom: 1px solid rgba(255, 255, 255, .06);
    }

    .faq-q {
      width: 100%;
      text-align: left;
      padding: 18px 0;
      font-size: 14px;
      font-weight: 500;
      color: rgba(255, 255, 255, .85);
      display: flex;
      align-items: center;
      justify-content: space-between;
      cursor: pointer;
      background: none;
      border: none;
    }

    .faq-q:hover {
      color: #fff;
    }

    .faq-a {
      font-size: 13px;
      line-height: 1.8;
      color: rgba(255, 255, 255, .5);
      padding-bottom: 18px;
    }

    /* ── 警告框 ── */
    .notice-box {
      border-radius: 12px;
      padding: 16px;
      border-left: 3px solid;
    }

    .notice-warning {
      background: rgba(251, 191, 36, .05);
      border-color: #fbbf24;
    }

    .notice-info {
      background: rgba(0, 212, 255, .05);
      border-color: var(--cyan);
    }

    .notice-success {
      background: rgba(34, 197, 94, .05);
      border-color: var(--green);
    }

    /* ── section 标题 ── */
    .section-label {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 1.5px;
      text-transform: uppercase;
      padding: 5px 12px;
      border-radius: 20px;
      background: rgba(255, 255, 255, .06);
      border: 1px solid rgba(255, 255, 255, .1);
      color: rgba(255, 255, 255, .5);
      margin-bottom: 14px;
    }

    /* ── 动画 ── */
    @keyframes fadeUp {
      from {
        opacity: 0;
        transform: translateY(24px);
      }

      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    .fade-up {
      animation: fadeUp .6s ease forwards;
    }

    @keyframes pulse-glow {

      0%,
      100% {
        box-shadow: 0 0 8px rgba(0, 212, 255, .3);
      }

      50% {
        box-shadow: 0 0 28px rgba(0, 212, 255, .7);
      }
    }

    .pulse {
      animation: pulse-glow 2s ease-in-out infinite;
    }

    @keyframes float {

      0%,
      100% {
        transform: translateY(0);
      }

      50% {
        transform: translateY(-6px);
      }
    }

    /* ── 分隔线 ── */
    .divider {
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .08), transparent);
      margin: 0;
    }

    [x-cloak] {
      display: none !important;
    }

    .text-\[9px\] {
    font-size: 9px;
}
.text-\[8px\] {
    font-size: 9px;
}
.mt-2 {
    margin-top: 0.5rem;}
  </style>







<style>*, ::before, ::after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/* ! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com */*,::after,::before{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}::after,::before{--tw-content:''}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.inset-0{inset:0px}.right-2{right:0.5rem}.top-0{top:0px}.top-2{top:0.5rem}.bottom-6{bottom:1.5rem}.left-1\/2{left:50%}.z-10{z-index:10}.z-20{z-index:20}.z-40{z-index:40}.z-\[110\]{z-index:110}.z-\[120\]{z-index:120}.z-\[70\]{z-index:70}.z-\[95\]{z-index:95}.z-50{z-index:50}.m-0{margin:0px}.mx-auto{margin-left:auto;margin-right:auto}.mb-0\.5{margin-bottom:0.125rem}.mb-1{margin-bottom:0.25rem}.mb-1\.5{margin-bottom:0.375rem}.mb-10{margin-bottom:2.5rem}.mb-12{margin-bottom:3rem}.mb-2{margin-bottom:0.5rem}.mb-3{margin-bottom:0.75rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.ml-4{margin-left:1rem}.mt-0\.5{margin-top:0.125rem}.mt-1{margin-top:0.25rem}.mt-1\.5{margin-top:0.375rem}.mt-2{margin-top:0.5rem}.mt-24{margin-top:6rem}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.hidden{display:none}.h-1\.5{height:0.375rem}.h-14{height:3.5rem}.h-3{height:0.75rem}.h-4{height:1rem}.h-44{height:11rem}.h-5{height:1.25rem}.h-7{height:1.75rem}.h-8{height:2rem}.h-full{height:100%}.max-h-\[90vh\]{max-height:90vh}.min-h-0{min-height:0px}.w-1\.5{width:0.375rem}.w-3{width:0.75rem}.w-4{width:1rem}.w-44{width:11rem}.w-5{width:1.25rem}.w-7{width:1.75rem}.w-8{width:2rem}.w-full{width:100%}.w-px{width:1px}.min-w-0{min-width:0px}.max-w-2xl{max-width:42rem}.max-w-3xl{max-width:48rem}.max-w-4xl{max-width:56rem}.max-w-5xl{max-width:64rem}.max-w-6xl{max-width:72rem}.max-w-lg{max-width:32rem}.max-w-md{max-width:28rem}.max-w-none{max-width:none}.max-w-sm{max-width:24rem}.max-w-xl{max-width:36rem}.flex-1{flex:1 1 0%}.flex-none{flex:none}.flex-shrink-0{flex-shrink:0}.shrink-0{flex-shrink:0}.-translate-x-1\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes pulse{50%{opacity:.5}}.animate-pulse{animation:pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite}@keyframes spin{to{transform:rotate(360deg)}}.animate-spin{animation:spin 1s linear infinite}.grid-cols-2{grid-template-columns:repeat(2, minmax(0, 1fr))}.grid-cols-1{grid-template-columns:repeat(1, minmax(0, 1fr))}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:0.25rem}.gap-2{gap:0.5rem}.gap-3{gap:0.75rem}.gap-5{gap:1.25rem}.gap-6{gap:1.5rem}.gap-x-6{column-gap:1.5rem}.gap-y-3{row-gap:0.75rem}.space-y-2 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.5rem * var(--tw-space-y-reverse))}.space-y-4 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.whitespace-nowrap{white-space:nowrap}.rounded-2xl{border-radius:1rem}.rounded-\[24px\]{border-radius:24px}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:0.5rem}.rounded-xl{border-radius:0.75rem}.border{border-width:1px}.border-2{border-width:2px}.border-white\/15{border-color:rgb(255 255 255 / 0.15)}.border-t-cyan-300{--tw-border-opacity:1;border-top-color:rgb(103 232 249 / var(--tw-border-opacity, 1))}.bg-cyan-400{--tw-bg-opacity:1;background-color:rgb(34 211 238 / var(--tw-bg-opacity, 1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.bg-white\/10{background-color:rgb(255 255 255 / 0.1)}.bg-clip-text{-webkit-background-clip:text;background-clip:text}.p-2{padding:0.5rem}.p-2\.5{padding:0.625rem}.p-3{padding:0.75rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-6{padding:1.5rem}.px-1{padding-left:0.25rem;padding-right:0.25rem}.px-3{padding-left:0.75rem;padding-right:0.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.px-8{padding-left:2rem;padding-right:2rem}.py-1\.5{padding-top:0.375rem;padding-bottom:0.375rem}.py-2{padding-top:0.5rem;padding-bottom:0.5rem}.py-20{padding-top:5rem;padding-bottom:5rem}.py-3{padding-top:0.75rem;padding-bottom:0.75rem}.py-3\.5{padding-top:0.875rem;padding-bottom:0.875rem}.py-8{padding-top:2rem;padding-bottom:2rem}.pb-10{padding-bottom:2.5rem}.pb-16{padding-bottom:4rem}.pb-4{padding-bottom:1rem}.pt-1{padding-top:0.25rem}.pt-20{padding-top:5rem}.pt-5{padding-top:1.25rem}.text-left{text-align:left}.text-center{text-align:center}.font-mono{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-base{font-size:1rem;line-height:1.5rem}.text-sm{font-size:0.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:0.75rem;line-height:1rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.leading-7{line-height:1.75rem}.leading-none{line-height:1}.leading-relaxed{line-height:1.625}.leading-tight{line-height:1.25}.tracking-\[0\.18em\]{letter-spacing:0.18em}.tracking-tight{letter-spacing:-0.025em}.text-cyan-400{--tw-text-opacity:1;color:rgb(34 211 238 / var(--tw-text-opacity, 1))}.text-cyan-400\/70{color:rgb(34 211 238 / 0.7)}.text-green-400{--tw-text-opacity:1;color:rgb(74 222 128 / var(--tw-text-opacity, 1))}.text-purple-400{--tw-text-opacity:1;color:rgb(192 132 252 / var(--tw-text-opacity, 1))}.text-red-400{--tw-text-opacity:1;color:rgb(248 113 113 / var(--tw-text-opacity, 1))}.text-transparent{color:transparent}.text-white{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.text-white\/20{color:rgb(255 255 255 / 0.2)}.text-white\/30{color:rgb(255 255 255 / 0.3)}.text-white\/35{color:rgb(255 255 255 / 0.35)}.text-white\/40{color:rgb(255 255 255 / 0.4)}.text-white\/45{color:rgb(255 255 255 / 0.45)}.text-white\/50{color:rgb(255 255 255 / 0.5)}.text-white\/55{color:rgb(255 255 255 / 0.55)}.text-white\/60{color:rgb(255 255 255 / 0.6)}.line-through{-webkit-text-decoration-line:line-through;text-decoration-line:line-through}.shadow-xl{--tw-shadow:0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.duration-200{transition-duration:200ms}.hover\:border-white\/25:hover{border-color:rgb(255 255 255 / 0.25)}.hover\:text-white:hover{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.hover\:text-white\/70:hover{color:rgb(255 255 255 / 0.7)}.hover\:opacity-85:hover{opacity:0.85}.focus\:border-cyan-400:focus{--tw-border-opacity:1;border-color:rgb(34 211 238 / var(--tw-border-opacity, 1))}.focus\:ring-4:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)}.focus\:ring-cyan-400\/15:focus{--tw-ring-color:rgb(34 211 238 / 0.15)}@media (min-width: 640px){.sm\:flex{display:flex}.sm\:flex-row{flex-direction:row}}@media (min-width: 768px){.md\:grid-cols-4{grid-template-columns:repeat(4, minmax(0, 1fr))}.md\:px-6{padding-left:1.5rem;padding-right:1.5rem}.md\:text-3xl{font-size:1.875rem;line-height:2.25rem}.md\:text-5xl{font-size:3rem;line-height:1}}@media (min-width: 1024px){.lg\:text-6xl{font-size:3.75rem;line-height:1}}