diff --git a/web/src/api/backend/embed.ts b/web/src/api/backend/embed.ts
index 8f9d617..37df461 100644
--- a/web/src/api/backend/embed.ts
+++ b/web/src/api/backend/embed.ts
@@ -92,3 +92,35 @@ export function saveGameRtp(data: SaveGameRtpPayload) {
         }
     )
 }
+
+export function domainStatus() {
+    return createAxios({
+        url: '/admin/embed.Embed/domainStatus',
+        method: 'get',
+    })
+}
+
+export interface SaveDomainPayload {
+    header_image_url: string
+    custom_config: Record<string, unknown>
+    base_color: string
+    border_color: string
+    online_color: string
+    offline_color: string
+    title_color: string
+    text_color: string
+    tag_color: string
+}
+
+export function saveDomain(data: SaveDomainPayload) {
+    return createAxios(
+        {
+            url: '/admin/embed.Embed/saveDomain',
+            method: 'post',
+            data,
+        },
+        {
+            showSuccessMessage: true,
+        }
+    )
+}
diff --git a/web/src/views/backend/embed/domainStatus.vue b/web/src/views/backend/embed/domainStatus.vue
index 4d896c7..0f2d86c 100644
--- a/web/src/views/backend/embed/domainStatus.vue
+++ b/web/src/views/backend/embed/domainStatus.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="default-main domain-status-page">
+    <div v-loading="loading" class="default-main domain-status-page">
         <section class="setting-grid">
             <div class="panel setting-panel">
                 <div class="panel-title">{{ t('embed.domainStatus.settingTitle') }}</div>
@@ -28,7 +28,7 @@
                         </div>
                     </div>
 
-                    <el-button type="success" class="save-button" @click="saveSettings">
+                    <el-button type="success" class="save-button" :loading="saving" @click="saveSettings">
                         {{ t('embed.domainStatus.save') }}
                     </el-button>
                 </div>
@@ -49,45 +49,23 @@
                 <div v-for="domain in domains" :key="domain.id" class="domain-row">
                     <span class="domain-icon" aria-hidden="true"></span>
                     <span>{{ domain.name }}</span>
-                    <el-tag :type="domain.online ? 'success' : 'danger'" effect="plain">
-                        {{ domain.online ? t('embed.domainStatus.online') : t('embed.domainStatus.offline') }}
-                    </el-tag>
                 </div>
                 <el-empty v-if="domains.length === 0" :description="t('embed.domainStatus.empty')" :image-size="60" />
             </div>
         </section>
 
-        <el-button link type="primary" class="edit-link" @click="domainDialogVisible = true">
+        <el-button link type="primary" class="edit-link" @click="editDomainList">
             {{ t('embed.domainStatus.editDomainList') }}
         </el-button>
-
-        <el-dialog v-model="domainDialogVisible" :title="t('embed.domainStatus.editTitle')" width="620px">
-            <div class="domain-editor">
-                <div v-for="(domain, index) in domainDraft" :key="domain.id" class="domain-edit-row">
-                    <el-input v-model="domain.name" placeholder="example.com" />
-                    <el-switch
-                        v-model="domain.online"
-                        :active-text="t('embed.domainStatus.online')"
-                        :inactive-text="t('embed.domainStatus.offline')"
-                    />
-                    <el-button type="danger" link @click="domainDraft.splice(index, 1)">
-                        {{ t('embed.domainStatus.delete') }}
-                    </el-button>
-                </div>
-                <el-button class="add-domain-button" @click="addDomain">{{ t('embed.domainStatus.addDomain') }}</el-button>
-            </div>
-            <template #footer>
-                <el-button @click="resetDomainDraft">{{ t('embed.domainStatus.cancel') }}</el-button>
-                <el-button type="primary" @click="saveDomains">{{ t('embed.domainStatus.confirm') }}</el-button>
-            </template>
-        </el-dialog>
     </div>
 </template>
 
 <script setup lang="ts">
 import { ElMessage } from 'element-plus'
-import { reactive, ref, watch } from 'vue'
+import { onMounted, reactive, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
+import { useRouter } from 'vue-router'
+import { domainStatus, saveDomain } from '/@/api/backend/embed'
 
 defineOptions({
     name: 'embed/domainStatus',
@@ -96,12 +74,24 @@ defineOptions({
 interface DomainRow {
     id: number
     name: string
-    online: boolean
+}
+
+interface DomainSetting {
+    header_image_url?: string | null
+    custom_config?: string | Record<string, unknown> | null
+    base_color?: string | null
+    border_color?: string | null
+    online_color?: string | null
+    offline_color?: string | null
+    title_color?: string | null
+    text_color?: string | null
+    tag_color?: string | null
 }
 
 type ColorSettingKey = 'baseColor' | 'borderColor' | 'onlineColor' | 'offlineColor' | 'titleColor' | 'textColor' | 'labelColor'
 
 const { t } = useI18n()
+const router = useRouter()
 
 const configTemplate = `{
     "hideDomain": [
@@ -172,12 +162,37 @@ const embedCode = ref(`<div style="position: relative;max-width: 1000px;margin:
     <\/script>
 </div>`)
 
-const saveSettings = () => {
+const saving = ref(false)
+
+const saveSettings = async () => {
+    let customConfig: Record<string, unknown> = {}
     try {
-        if (settings.customConfig) JSON.parse(settings.customConfig)
-        ElMessage.success(t('embed.domainStatus.saved'))
+        if (settings.customConfig.trim()) {
+            const parsed = JSON.parse(settings.customConfig)
+            if (!parsed || Array.isArray(parsed) || typeof parsed !== 'object') throw new Error()
+            customConfig = parsed
+        }
     } catch {
         ElMessage.error(t('embed.domainStatus.invalidConfig'))
+        return
+    }
+
+    saving.value = true
+    try {
+        await saveDomain({
+            header_image_url: settings.headerImage,
+            custom_config: customConfig,
+            base_color: settings.baseColor,
+            border_color: settings.borderColor,
+            online_color: settings.onlineColor,
+            offline_color: settings.offlineColor,
+            title_color: settings.titleColor,
+            text_color: settings.textColor,
+            tag_color: settings.labelColor,
+        })
+        await loadDomainStatus()
+    } finally {
+        saving.value = false
     }
 }
 
@@ -190,37 +205,53 @@ const copyEmbedCode = async () => {
     }
 }
 
-const domains = ref<DomainRow[]>([{ id: 1, name: '1xaud.com', online: true }])
-const domainDraft = ref<DomainRow[]>([])
-const domainDialogVisible = ref(false)
+const domains = ref<DomainRow[]>([])
+const loading = ref(false)
 
-const cloneDomains = () => domains.value.map((domain) => ({ ...domain }))
-
-watch(domainDialogVisible, (visible) => {
-    if (visible) domainDraft.value = cloneDomains()
-})
-
-const addDomain = () => {
-    const nextId = Math.max(0, ...domainDraft.value.map((domain) => domain.id)) + 1
-    domainDraft.value.push({ id: nextId, name: '', online: true })
+const formatCustomConfig = (value: DomainSetting['custom_config']) => {
+    if (!value) return ''
+    return typeof value === 'string' ? value : JSON.stringify(value, null, 2)
 }
 
-const resetDomainDraft = () => {
-    domainDraft.value = cloneDomains()
-    domainDialogVisible.value = false
+const normalizeDomainList = (value: unknown): DomainRow[] => {
+    const list = Array.isArray(value) ? value : typeof value === 'string' ? value.split(/[\n,;]+/) : []
+    return list
+        .map((item) => (typeof item === 'object' && item ? String((item as any).domain ?? (item as any).name ?? '') : String(item)))
+        .map((name) => name.trim())
+        .filter(Boolean)
+        .map((name, index) => ({ id: index + 1, name }))
 }
 
-const saveDomains = () => {
-    const cleaned = domainDraft.value.map((domain) => ({ ...domain, name: domain.name.trim() })).filter((domain) => domain.name)
-    const names = cleaned.map((domain) => domain.name.toLowerCase())
-    if (new Set(names).size !== names.length) {
-        ElMessage.error(t('embed.domainStatus.duplicateDomain'))
-        return
+const applyDomainSetting = (domain?: DomainSetting) => {
+    if (!domain) return
+    settings.headerImage = domain.header_image_url ?? ''
+    settings.customConfig = formatCustomConfig(domain.custom_config)
+    settings.baseColor = domain.base_color ?? ''
+    settings.borderColor = domain.border_color ?? ''
+    settings.onlineColor = domain.online_color ?? ''
+    settings.offlineColor = domain.offline_color ?? ''
+    settings.titleColor = domain.title_color ?? ''
+    settings.textColor = domain.text_color ?? ''
+    settings.labelColor = domain.tag_color ?? ''
+}
+
+const loadDomainStatus = async () => {
+    loading.value = true
+    try {
+        const response = await domainStatus()
+        const data = response.data ?? response
+        applyDomainSetting(data?.domain)
+        domains.value = normalizeDomainList(data?.domain_list)
+    } finally {
+        loading.value = false
     }
-    domains.value = cleaned
-    domainDialogVisible.value = false
-    ElMessage.success(t('embed.domainStatus.domainsSaved'))
 }
+
+const editDomainList = () => {
+    router.push({ name: 'routine/config' })
+}
+
+onMounted(loadDomainStatus)
 </script>
 
 <style scoped lang="scss">
@@ -348,10 +379,6 @@ const saveDomains = () => {
     &:last-child {
         border-bottom: 0;
     }
-
-    .el-tag {
-        margin-left: auto;
-    }
 }
 
 .domain-icon {