   p {
       margin-bottom: 2em;
       line-height: 1.8;
   }

   .log a {
       color: rgb(0, 55, 255);
   }

   footer {
       text-align: center;
       padding: 20px;
       font-size: 0.9em;
       line-height: 1.5em;
       color: #333;
       background: linear-gradient(180deg, rgba(245, 247, 251, 0.68), rgba(245, 247, 251, 0.9));
       border-top: 1px solid rgba(15, 23, 42, 0.08);
       backdrop-filter: blur(14px);
       -webkit-backdrop-filter: blur(14px);
    }

   body {
       font-family:
           -apple-system,
           BlinkMacSystemFont,
           "SF Pro Text",
           "SF Pro Display",
           "Avenir",
           "Helvetica Neue",
           Arial, sans-serif;
       color: #222;
       background-color: #ffffff;
       margin: 0;
       overflow-x: hidden;
    }

   .page-shell {
       min-height: 100vh;
       min-height: 100dvh;
       display: flex;
       flex-direction: column;
       background-color: #f5f7fb;
       background-image:
           radial-gradient(circle, rgba(71, 168, 242, 0.18), transparent 70%),
           radial-gradient(circle, rgba(71, 168, 242, 0.18), transparent 70%);
       background-repeat: no-repeat;
       background-size: 520px 520px, 520px 520px;
       background-position: left -140px top -180px, right -140px bottom -220px;
    }

   .page-shell>footer {
       flex-shrink: 0;
    }

   html.viewer-open,
   body.viewer-open {
       overflow: hidden;
       overscroll-behavior: none;
       touch-action: none;
   }

   .home-shell {
       background-color: #ffffff;
       background-image: none;
   }

   .home-shell>#index {
       flex: 0 0 auto;
       min-height: 100vh;
       min-height: 100lvh;
   }

   body:lang(zh) {
       font-family:
           -apple-system,
           BlinkMacSystemFont,
           "PingFang SC",
           "SF Pro Text",
           "SF Pro Display",
           "Microsoft YaHei",
           "Noto Sans CJK SC",
           sans-serif;
   }

   #index .text a {
       color: #0b4b9b;
       text-decoration: underline;
   }

   :not(#index)>.text a {
       color: #0b4b9b;
       text-decoration: underline;
   }

   .lang-dropdown:hover {
       border-color: #333;
   }

   .hero-title {
       font-size: 2.4rem;
       margin: 20px 0 10px;
       font-weight: 600;
       color: #111;
   }

   .privacy-section {
       padding: 60px 20px;
       text-align: center;
       color: #111 !important;
   }

   .privacy-title {
       font-size: 2.4rem;

       font-weight: 600;

   }

   .app-icon-div {
       display: flex;
       justify-content: center;
       align-items: center;
   }

   .app-icon {
       width: 10em;
       border-radius: 22%;
       box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2);
       display: block;
       margin: 0 auto;
   }

   .hero-section {
       text-align: center;
       display: flex;
       flex-direction: column;
       align-items: center;
       gap: 12px;
   }

   .hero-text {
       color: #333;
       font-size: 1.1rem;
       margin-bottom: 30px;
   }

   .appstore-wrapper {
       margin: 20px 0;
   }

   .appstore-badge {
       height: 3.5em;
   }

   .error-section {
       display: flex;
       flex-direction: column;
       align-items: center;
       gap: 16px;
   }

   .error-badge {
       padding: 6px 14px;
       border-radius: 999px;
       font-size: 0.85rem;
       letter-spacing: 0.08em;
       font-weight: 600;
       background: #f0f2f6;
       color: #222;
       border: 1px solid rgba(15, 23, 42, 0.08);
       backdrop-filter: blur(12px);
   }

   .error-image {
       width: min(320px, 80%);
       border-radius: 22px;
       box-shadow: 0 16px 32px rgba(0, 0, 0, 0.2);
   }

   .error-cta {
       margin-top: 8px;
       padding: 10px 22px;
       border-radius: 999px;
       border: 1px solid #c9cdd6;
       background: #ffffff;
       color: #111;
       font-weight: 500;
       text-decoration: none;
       transition: transform 0.2s ease, box-shadow 0.2s ease;
   }

   .error-cta:hover {
       transform: translateY(-2px);
       box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
   }


   #privacy.text {
       text-align: left !important;
       max-width: 900px;
       margin: 0 auto;
       line-height: 1.8;
   }

   #privacy.text strong {
       display: block;
       margin: 1.2em 0 0.4em;
       font-size: 1.1em;
   }

   .avatar img {
       display: flex;
       justify-content: center;
       margin: auto;
       border-radius: 50%;
       width: 300px;
       height: 300px;
       object-fit: cover;
       margin-top: 2em;
       margin-bottom: 2em;
   }

   .logo a {
       display: flex;
       align-items: center;
       gap: 10px;
       text-decoration: none;
       color: inherit;
   }

   .logo {
       font-size: 1.4em;
       font-weight: 600;
       color: #111;
   }

   .logo-img {
       height: 1.5em;
       width: auto;
       display: block;
   }

   .logo-text {
       letter-spacing: 0.02em;
   }

   .contact-points {
       width: min(720px, calc(100% - 2rem));
       margin: 0 auto 3rem;
       display: grid;
       grid-template-columns: repeat(2, minmax(0, 1fr));
       gap: 14px;
   }

   #contact {
       flex: 1 0 auto;
   }

   .contact-point {
       position: relative;
       display: flex;
       flex-direction: column;
       gap: 0.45rem;
       padding: 0.9rem 1rem 0.95rem;
       border-radius: 20px;
       color: #122033;
       text-decoration: none;
       background: linear-gradient(145deg, rgba(255, 255, 255, 0.84), rgba(236, 241, 249, 0.72));
       border: 1px solid rgba(255, 255, 255, 0.74);
       box-shadow:
           0 18px 38px rgba(15, 23, 42, 0.1),
           inset 0 1px 0 rgba(255, 255, 255, 0.8);
       backdrop-filter: blur(16px);
       -webkit-backdrop-filter: blur(16px);
       transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
       overflow: hidden;
   }

   .contact-point::before {
       content: "";
       position: absolute;
       inset: 1px;
       border-radius: inherit;
       background: linear-gradient(180deg, rgba(255, 255, 255, 0.34), rgba(255, 255, 255, 0.08) 48%, rgba(148, 163, 184, 0.12));
       pointer-events: none;
   }

   .contact-point:hover {
       transform: translateY(-2px);
       border-color: rgba(160, 177, 201, 0.4);
       box-shadow:
           0 22px 44px rgba(15, 23, 42, 0.14),
           inset 0 1px 0 rgba(255, 255, 255, 0.84);
   }

   .contact-point-label,
   .contact-point-value {
       position: relative;
       z-index: 1;
   }

   .contact-point-label {
       font-size: 0.74rem;
       font-weight: 700;
       letter-spacing: 0.1em;
       text-transform: uppercase;
       color: rgba(11, 43, 74, 0.62);
   }

   .contact-point-value {
       font-size: clamp(0.96rem, 0.45vw + 0.86rem, 1.08rem);
       font-weight: 600;
       line-height: 1.35;
       word-break: break-word;
   }

   .back-button {
       margin: 1.5em 1em 0;
       display: inline-flex;
       align-items: center;
       gap: 0.4em;
       font-size: 1.1em;
       font-weight: 500;
       color: #0b4b9b;
       background: transparent;
       border: none;
       cursor: pointer;
   }

   .back-button::before {
       content: "←";
       font-size: 1em;
   }

   .photo-viewer {
       position: fixed;
       inset: 0;
       background-color: rgba(0, 0, 0, 0.85);
       display: flex;
       justify-content: center;
       align-items: center;
       z-index: 2000;
       touch-action: none;
    }

   .photo-viewer-overlay {
       position: absolute;
       inset: 0;
    }

   .photo-viewer-loader {
       position: absolute;
       inset: 0;
       display: flex;
       align-items: center;
       justify-content: center;
       pointer-events: none;
       z-index: 2;
   }

   .photo-viewer-spinner {
       width: 58px;
       height: 58px;
       border-radius: 50%;
       border: 3px solid rgba(255, 255, 255, 0.2);
       border-top-color: rgba(255, 255, 255, 0.95);
       box-shadow: 0 10px 24px rgba(0, 0, 0, 0.28);
       animation: photoViewerSpin 0.75s linear infinite;
   }

   .photo-viewer img {
       position: relative;
       z-index: 1;
       max-width: 92%;
       max-height: 92%;
       object-fit: contain;
       box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
       border-radius: 18px;
       transition: opacity 0.2s ease;
   }

   .photo-viewer img.is-loading {
       opacity: 0.28;
   }

   .glass-icon-button {
       position: relative;
       border: 1px solid rgba(255, 255, 255, 0.4);
       background: linear-gradient(145deg, rgba(255, 255, 255, 0.72), rgba(219, 226, 238, 0.42));
       color: #0f172a;
       padding: 0;
       line-height: 0;
       cursor: pointer;
       display: flex;
       align-items: center;
       justify-content: center;
       box-shadow:
           0 14px 30px rgba(15, 23, 42, 0.24),
           inset 0 1px 0 rgba(255, 255, 255, 0.74),
           inset 0 -1px 0 rgba(148, 163, 184, 0.18);
       backdrop-filter: blur(18px) saturate(135%);
       -webkit-backdrop-filter: blur(18px) saturate(135%);
       transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
       overflow: hidden;
   }

   .glass-icon-button::before {
       content: "";
       position: absolute;
       inset: 1px;
       border-radius: inherit;
       background: linear-gradient(180deg, rgba(255, 255, 255, 0.34), rgba(255, 255, 255, 0.06) 42%, rgba(148, 163, 184, 0.12));
       pointer-events: none;
   }

   .glass-icon-button:hover:not(:disabled) {
       transform: translateY(-1px) scale(1.02);
       background: linear-gradient(145deg, rgba(255, 255, 255, 0.82), rgba(230, 236, 246, 0.54));
       box-shadow:
           0 18px 36px rgba(15, 23, 42, 0.28),
           inset 0 1px 0 rgba(255, 255, 255, 0.8),
           inset 0 -1px 0 rgba(148, 163, 184, 0.16);
   }

   .glass-icon-button:disabled {
       opacity: 0.38;
       box-shadow:
           inset 0 1px 0 rgba(255, 255, 255, 0.45),
           inset 0 -1px 0 rgba(148, 163, 184, 0.08);
   }

   .close-button {
       position: absolute;
       top: 24px;
       right: 24px;
       width: 46px;
       height: 46px;
       border-radius: 50%;
       z-index: 3;
   }

    .arrow.left,
    .arrow.right {
        position: absolute;
       top: 50%;
       transform: translateY(-50%);
       width: 48px;
       height: 48px;
       border-radius: 50%;
       z-index: 3;
    }

    .arrow.left {
       left: 20px;
    }

   .arrow.right {
       right: 20px;
    }

   .viewer-button-icon {
       position: relative;
       z-index: 1;
       width: 18px;
       height: 18px;
       flex: none;
       stroke: currentColor;
       stroke-width: 2.6;
       fill: none;
       stroke-linecap: round;
       stroke-linejoin: round;
   }

   .close-button .viewer-button-icon {
       width: 17px;
       height: 17px;
   }

   .carousel-arrow {
       position: relative;
       display: inline-flex;
   }

   .carousel-arrow .viewer-button-icon {
       width: 15px;
       height: 15px;
   }

   .arrow.left:hover,
   .arrow.right:hover {
       transform: translateY(-50%) scale(1.02);
       background: linear-gradient(145deg, rgba(255, 255, 255, 0.84), rgba(228, 235, 246, 0.56));
       box-shadow:
           0 20px 38px rgba(15, 23, 42, 0.28),
           inset 0 1px 0 rgba(255, 255, 255, 0.8),
           inset 0 -1px 0 rgba(148, 163, 184, 0.14);
   }

   @keyframes photoViewerSpin {
       to {
           transform: rotate(360deg);
       }
   }
