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

    * { box-sizing: border-box; }

    .w-64 {
    width: calc(var(--spacing) * 45);
}

.right-0 {
    right: calc(var(--spacing) * 0);
}


    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 {
      background: rgba(248, 250, 252, .78) !important;
      backdrop-filter: blur(10px);
    }
    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;
    }
    /** ══ 彩虹渐变背景 ══ */
    .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;
}

/* ========== 信息弹窗正文：浅色主题覆盖 ========== */
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;
}