feat: ipapi.is as primary geo source (city/locality precision, graceful fallback), move WebRTC card after locale formatting for balanced layout

Author: ChuwuYo

src/detect/collectors.js

@@ -385,6 +385,21 @@ export const collectLocaleFormattingInfo = () => {
  * 多源链式回退（均为免费无 key 的公益服务）
  */
 const IP_GEO_ENDPOINTS = [
+	{
+		url: "https://api.ipapi.is/",
+		normalize: (data) => {
+			// 兼容扁平与嵌套 location 两种形状
+			const loc = data?.location || data || {};
+			return {
+				ip: data?.ip || "",
+				timezone: loc.timeZone || data?.timeZone || "N/A",
+				country: loc.country || data?.country || "N/A",
+				region: loc.region || data?.region || "",
+				city: [loc.city, loc.locality].filter(Boolean).join(" / ") || data?.city || "",
+				organization: data?.organization?.name || data?.organization || data?.org || "",
+			};
+		},
+	},
 	{
 		url: "https://ipwhois.app/json/",
 		normalize: (data) => {

src/detect/detect.html

@@ -262,25 +262,25 @@ <h4 class="mb-1" id="aiDiagnosisTitle" data-i18n="ai_diagnosis_title"></h4>
       </div>
       <div class="col-md-6">
         <div class="card mb-3">
-          <div class="card-header bg-body-tertiary" id="webRtcTitle" data-i18n="webrtc_detection"></div>
+          <div class="card-header bg-body-tertiary" id="browserFingerprintTitle" data-i18n="browser_fingerprint"></div>
           <div class="card-body">
-            <div id="webRtcInfo" data-i18n="detecting"></div>
+            <div id="fingerprintInfo" data-i18n="detecting"></div>
           </div>
         </div>
       </div>
       <div class="col-md-6">
         <div class="card mb-3">
-          <div class="card-header bg-body-tertiary" id="browserFingerprintTitle" data-i18n="browser_fingerprint"></div>
+          <div class="card-header bg-body-tertiary" id="localeFormattingTitle" data-i18n="locale_formatting_title"></div>
           <div class="card-body">
-            <div id="fingerprintInfo" data-i18n="detecting"></div>
+            <div id="localeFormattingInfo" data-i18n="detecting"></div>
           </div>
         </div>
       </div>
       <div class="col-md-6">
         <div class="card mb-3">
-          <div class="card-header bg-body-tertiary" id="localeFormattingTitle" data-i18n="locale_formatting_title"></div>
+          <div class="card-header bg-body-tertiary" id="webRtcTitle" data-i18n="webrtc_detection"></div>
           <div class="card-body">
-            <div id="localeFormattingInfo" data-i18n="detecting"></div>
+            <div id="webRtcInfo" data-i18n="detecting"></div>
           </div>
         </div>
       </div>