/* ==========================================
   👑 王子主题 · 聊天框美化方案
   特点: 白金色调、金色星芒、高贵典雅
   ========================================== */

/* 1. 移除默认顶部装饰条 */
[class*="bg-[#F1CBCB]"], 
[class*="bg-[#c9e1e9]"] {
    display: none !important;
}

/* 2. 统一聊天框 — 白金渐变 */
.bg-gray-100\/90.relative.inline-block {
    background: linear-gradient(
        135deg,
        #F5F5F5 0%,
        #FFF9E6 20%,
        #FFFEF7 40%,
        #FFF8DC 60%,
        #FAF0E6 80%,
        #F0F0F0 100%
    ) !important;
    border: 2px solid rgba(212, 175, 55, 0.4) !important;
    box-shadow:
        0 0 0 1px rgba(212, 175, 55, 0.25),
        0 4px 16px rgba(184, 134, 11, 0.15),
        0 8px 32px rgba(218, 165, 32, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.9),
        inset 0 -1px 0 rgba(212, 175, 55, 0.1) !important;
    border-radius: 24px !important;
    isolation: isolate !important;
    position: relative !important;
    overflow: hidden !important;
    padding: 20px !important;
    transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}

.bg-gray-100\/90.relative.inline-block:hover {
    box-shadow:
        0 0 0 2px rgba(218, 165, 32, 0.5),
        0 6px 24px rgba(184, 134, 11, 0.25),
        0 12px 48px rgba(212, 175, 55, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 1),
        inset 0 -1px 0 rgba(212, 175, 55, 0.2) !important;
    transform: translateY(-2px) scale(1.005) !important;
}

/* 3. 背景装饰 — 金色星芒与皇冠 (SVG SMIL) */
.bg-gray-100\/90.relative.inline-block::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 0 !important;
    pointer-events: none !important;
    opacity: 0.5 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 400'%3E%3Cpolygon points='80,60 84,68 92,68 86,73 88,81 80,76 72,81 74,73 68,68 76,68' fill='%23D4AF37' opacity='0.4'%3E%3Canimate attributeName='opacity' values='0.4;0.75;0.4' dur='3.5s' repeatCount='indefinite'/%3E%3CanimateTransform attributeName='transform' type='rotate' values='0 80 70;360 80 70' dur='20s' repeatCount='indefinite'/%3E%3C/polygon%3E%3Cpolygon points='200,100 206,112 218,112 208,119 212,131 200,123 188,131 192,119 182,112 194,112' fill='%23B8860B' opacity='0.35'%3E%3Canimate attributeName='opacity' values='0.35;0.7;0.35' dur='4s' repeatCount='indefinite'/%3E%3CanimateTransform attributeName='transform' type='rotate' values='0 200 115;360 200 115' dur='22s' repeatCount='indefinite'/%3E%3C/polygon%3E%3Cpolygon points='350,80 355,90 365,90 357,96 360,106 350,100 340,106 343,96 335,90 345,90' fill='%23DAA520' opacity='0.38'%3E%3Canimate attributeName='opacity' values='0.38;0.72;0.38' dur='3.8s' repeatCount='indefinite'/%3E%3CanimateTransform attributeName='transform' type='rotate' values='0 350 93;360 350 93' dur='18s' repeatCount='indefinite'/%3E%3C/polygon%3E%3Cpolygon points='480,140 485,150 495,150 487,156 490,166 480,160 470,166 473,156 465,150 475,150' fill='%23C5A572' opacity='0.36'%3E%3Canimate attributeName='opacity' values='0.36;0.68;0.36' dur='4.2s' repeatCount='indefinite'/%3E%3CanimateTransform attributeName='transform' type='rotate' values='0 480 153;360 480 153' dur='24s' repeatCount='indefinite'/%3E%3C/polygon%3E%3Cpolygon points='550,70 554,78 562,78 556,83 558,91 550,86 542,91 544,83 538,78 546,78' fill='%23D4AF37' opacity='0.42'%3E%3Canimate attributeName='opacity' values='0.42;0.78;0.42' dur='3.3s' repeatCount='indefinite'/%3E%3CanimateTransform attributeName='transform' type='rotate' values='0 550 80;360 550 80' dur='19s' repeatCount='indefinite'/%3E%3C/polygon%3E%3Cpath d='M 120,250 L 110,270 L 100,250 L 80,250 L 95,235 L 90,215 L 110,225 L 130,215 L 125,235 L 140,250 Z' fill='%23B8860B' opacity='0.3'%3E%3Canimate attributeName='opacity' values='0.3;0.6;0.3' dur='5s' repeatCount='indefinite'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0,0;0,-12;0,0' dur='6s' repeatCount='indefinite'/%3E%3C/path%3E%3Cpath d='M 300,300 L 290,320 L 280,300 L 260,300 L 275,285 L 270,265 L 290,275 L 310,265 L 305,285 L 320,300 Z' fill='%23DAA520' opacity='0.32'%3E%3Canimate attributeName='opacity' values='0.32;0.62;0.32' dur='5.5s' repeatCount='indefinite'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0,0;0,-15;0,0' dur='6.5s' repeatCount='indefinite'/%3E%3C/path%3E%3Cpath d='M 450,280 L 440,300 L 430,280 L 410,280 L 425,265 L 420,245 L 440,255 L 460,245 L 455,265 L 470,280 Z' fill='%23C5A572' opacity='0.28'%3E%3Canimate attributeName='opacity' values='0.28;0.58;0.28' dur='4.8s' repeatCount='indefinite'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0,0;0,-10;0,0' dur='5.8s' repeatCount='indefinite'/%3E%3C/path%3E%3C/svg%3E") !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}

/* 4. 背景装饰 — 权杖与宝石 (SVG SMIL) */
.bg-gray-100\/90.relative.inline-block::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 0 !important;
    pointer-events: none !important;
    opacity: 0.35 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 400'%3E%3Ccircle cx='50' cy='80' r='6' fill='%23D4AF37' opacity='0.4'%3E%3Canimate attributeName='r' values='6;8;6' dur='4s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='0.4;0.7;0.4' dur='4s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='180' cy='130' r='8' fill='%23DAA520' opacity='0.36'%3E%3Canimate attributeName='r' values='8;10;8' dur='4.5s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='0.36;0.68;0.36' dur='4.5s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='320' cy='90' r='5' fill='%23B8860B' opacity='0.38'%3E%3Canimate attributeName='r' values='5;7;5' dur='3.8s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='0.38;0.72;0.38' dur='3.8s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='460' cy='160' r='7' fill='%23C5A572' opacity='0.35'%3E%3Canimate attributeName='r' values='7;9;7' dur='5s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='0.35;0.65;0.35' dur='5s' repeatCount='indefinite'/%3E%3C/circle%3E%3Crect x='100' y='240' width='12' height='80' rx='6' fill='%23B8860B' opacity='0.3'%3E%3Canimate attributeName='opacity' values='0.3;0.55;0.3' dur='6s' repeatCount='indefinite'/%3E%3C/rect%3E%3Ccircle cx='106' cy='235' r='18' fill='%23D4AF37' opacity='0.35'%3E%3Canimate attributeName='opacity' values='0.35;0.65;0.35' dur='6s' repeatCount='indefinite'/%3E%3CanimateTransform attributeName='transform' type='rotate' values='0 106 235;360 106 235' dur='12s' repeatCount='indefinite'/%3E%3C/circle%3E%3Cpolygon points='106,220 110,230 120,230 112,236 115,246 106,240 97,246 100,236 92,230 102,230' fill='%23FFD700' opacity='0.45'%3E%3Canimate attributeName='opacity' values='0.45;0.8;0.45' dur='6s' repeatCount='indefinite'/%3E%3C/polygon%3E%3Crect x='280' y='260' width='12' height='80' rx='6' fill='%23DAA520' opacity='0.32'%3E%3Canimate attributeName='opacity' values='0.32;0.58;0.32' dur='6.5s' repeatCount='indefinite'/%3E%3C/rect%3E%3Ccircle cx='286' cy='255' r='18' fill='%23C5A572' opacity='0.36'%3E%3Canimate attributeName='opacity' values='0.36;0.66;0.36' dur='6.5s' repeatCount='indefinite'/%3E%3CanimateTransform attributeName='transform' type='rotate' values='0 286 255;360 286 255' dur='14s' repeatCount='indefinite'/%3E%3C/circle%3E%3Cpolygon points='286,240 290,250 300,250 292,256 295,266 286,260 277,266 280,256 272,250 282,250' fill='%23FFD700' opacity='0.42'%3E%3Canimate attributeName='opacity' values='0.42;0.75;0.42' dur='6.5s' repeatCount='indefinite'/%3E%3C/polygon%3E%3C/svg%3E") !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}

/* 5. 主文本内容 — 深灰棕金高对比 */
.markdown-body {
    color: #2C2C2C !important;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans SC", "PingFang SC", "Source Han Sans", sans-serif !important;
    background: transparent !important;
    position: relative !important;
    z-index: 1 !important;
    line-height: 1.8 !important;
    letter-spacing: 0.015em !important;
    font-weight: 500 !important;
}

.markdown-body strong {
    color: #8B6914 !important;
    font-weight: 700 !important;
    background: rgba(212, 175, 55, 0.15) !important;
    padding: 1px 5px !important;
    border-radius: 5px !important;
}

.markdown-body ::selection {
    background: rgba(218, 165, 32, 0.35) !important;
    color: #1A1A1A !important;
}

.markdown-body::before {
    content: "♔ " !important;
    color: #B8860B !important;
    filter: drop-shadow(0 0 4px rgba(184, 134, 11, 0.4)) !important;
}

/* 行内代码 */
.markdown-body code {
    background: rgba(212, 175, 55, 0.18) !important;
    color: #6B5321 !important;
    border-radius: 6px !important;
    padding: 3px 7px !important;
    border: 1px solid rgba(184, 134, 11, 0.3) !important;
    font-size: 0.92em !important;
    font-weight: 600 !important;
}

/* 代码块 */
.markdown-body pre {
    background: rgba(255, 255, 255, 0.92) !important;
    border: 2px solid rgba(212, 175, 55, 0.3) !important;
    border-radius: 16px !important;
    box-shadow: 0 6px 20px rgba(184, 134, 11, 0.15) !important;
    overflow: hidden !important;
    margin: 1.5em 0 !important;
    position: relative !important;
    z-index: 1 !important;
}

.markdown-body pre > div > div.flex.justify-between.h-8,
.markdown-body pre > div > div.border-b {
    background: linear-gradient(135deg, #FFF9E6, #FAF0E6) !important;
    border-bottom: 1px solid rgba(212, 175, 55, 0.25) !important;
    padding: 0 18px !important;
    height: 42px !important;
}

.markdown-body pre > div > div.flex.justify-between > div:first-child {
    color: #8B6914 !important;
    font-weight: 700 !important;
    font-family: 'Consolas', 'Monaco', monospace !important;
    text-transform: uppercase !important;
    font-size: 13px !important;
    letter-spacing: 1.2px !important;
}

.markdown-body pre div[data-tooltip-id^="copy-tooltip"],
.markdown-body pre .copy-btn-legacy {
    background: rgba(212, 175, 55, 0.15) !important;
    border: 1px solid rgba(184, 134, 11, 0.35) !important;
    color: #8B6914 !important;
    border-radius: 8px !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.markdown-body pre div[data-tooltip-id^="copy-tooltip"]:hover,
.markdown-body pre .copy-btn-legacy:hover {
    background: rgba(218, 165, 32, 0.28) !important;
    border-color: #DAA520 !important;
    box-shadow: 0 0 12px rgba(218, 165, 32, 0.4) !important;
}

.markdown-body pre > div > div[node] {
    background: #FEFEFE !important;
    color: #333333 !important;
    padding: 22px !important;
    font-family: 'Fira Code', 'JetBrains Mono', 'Consolas', monospace !important;
    font-size: 14.5px !important;
    line-height: 1.75 !important;
    overflow-x: auto !important;
}

.markdown-body pre > div > div[node]::-webkit-scrollbar {
    height: 10px !important;
    width: 10px !important;
}

.markdown-body pre > div > div[node]::-webkit-scrollbar-track {
    background: #FFF9E6 !important;
    border-radius: 5px !important;
}

.markdown-body pre > div > div[node]::-webkit-scrollbar-thumb {
    background: rgba(212, 175, 55, 0.5) !important;
    border-radius: 5px !important;
}

.markdown-body pre > div > div[node]::-webkit-scrollbar-thumb:hover {
    background: rgba(184, 134, 11, 0.7) !important;
}

/* 引用块 */
.markdown-body blockquote {
    border-left: 5px solid #B8860B !important;
    background: linear-gradient(90deg, rgba(212, 175, 55, 0.12) 0%, transparent 100%) !important;
    padding: 14px 18px !important;
    margin: 18px 0 !important;
    border-radius: 0 14px 14px 0 !important;
    color: #5C4A1A !important;
    font-style: italic !important;
    position: relative !important;
    z-index: 1 !important;
}

/* 链接 */
.markdown-body a {
    color: #8B6914 !important;
    text-decoration: none !important;
    border-bottom: 2px solid rgba(139, 105, 20, 0.35) !important;
    transition: all 0.3s ease !important;
    font-weight: 600 !important;
}

.markdown-body a:hover {
    color: #6B5321 !important;
    border-bottom: 2px solid #6B5321 !important;
    filter: drop-shadow(0 0 6px rgba(107, 83, 33, 0.4)) !important;
}

/* 分割线 */
.markdown-body hr {
    height: 2px !important;
    background: linear-gradient(90deg, transparent, rgba(212, 175, 55, 0.6), transparent) !important;
    border: none !important;
    margin: 28px 0 !important;
    box-shadow: 0 0 8px rgba(184, 134, 11, 0.3) !important;
}

/* 表格 */
.markdown-body table {
    display: block !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    border-collapse: collapse !important;
    width: 100% !important;
    margin: 18px 0 !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 16px rgba(184, 134, 11, 0.15) !important;
    position: relative !important;
    z-index: 1 !important;
}

.markdown-body th {
    background: linear-gradient(135deg, #FFF9E6, #FAF0E6) !important;
    color: #6B5321 !important;
    font-weight: 700 !important;
    padding: 14px !important;
    border: 1px solid rgba(212, 175, 55, 0.3) !important;
}

.markdown-body td {
    background: rgba(255, 255, 255, 0.8) !important;
    padding: 14px !important;
    border: 1px solid rgba(212, 175, 55, 0.2) !important;
    transition: background 0.3s ease !important;
    color: #2C2C2C !important;
}

.markdown-body tr:hover td {
    background: rgba(218, 165, 32, 0.12) !important;
}

.markdown-body li::marker {
    color: #B8860B !important;
}

/* 折叠块 */
.markdown-body details {
    background: rgba(255, 255, 255, 0.7) !important;
    border: 2px solid rgba(212, 175, 55, 0.3) !important;
    border-radius: 14px !important;
    padding: 14px 18px !important;
    margin: 14px 0 !important;
    box-shadow: 0 4px 12px rgba(184, 134, 11, 0.12) !important;
    transition: all 0.3s ease !important;
    position: relative !important;
    z-index: 1 !important;
}

.markdown-body details:hover {
    border-color: rgba(184, 134, 11, 0.5) !important;
    background: rgba(255, 255, 255, 0.85) !important;
}

.markdown-body summary {
    cursor: pointer !important;
    color: #6B5321 !important;
    font-weight: 700 !important;
    list-style: none !important;
    display: flex !important;
    align-items: center !important;
    outline: none !important;
    transition: color 0.3s ease !important;
}

.markdown-body summary:hover {
    color: #8B6914 !important;
    filter: drop-shadow(0 0 5px rgba(139, 105, 20, 0.3)) !important;
}

.markdown-body summary::-webkit-details-marker {
    display: none !important;
}

.markdown-body summary::before {
    content: "▶" !important;
    font-size: 13px !important;
    margin-right: 12px !important;
    color: #B8860B !important;
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}

.markdown-body details[open] summary::before {
    transform: rotate(90deg) !important;
    color: #DAA520 !important;
}

.markdown-body details[open] summary {
    margin-bottom: 14px !important;
    border-bottom: 1px dashed rgba(212, 175, 55, 0.3) !important;
    padding-bottom: 10px !important;
}

/* 6. 底部附加元素 */
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary,
button {
    color: #8B6914 !important;
    border-radius: 10px !important;
    transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
    position: relative !important;
    z-index: 1 !important;
    font-weight: 600 !important;
}

.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary:hover,
button:hover {
    color: #6B5321 !important;
    background: rgba(212, 175, 55, 0.18) !important;
    filter: drop-shadow(0 0 6px rgba(139, 105, 20, 0.35)) !important;
    transform: translateY(-1px) !important;
}

.MuiTypography-root.MuiTypography-body2.css-6c0gf2 {
    color: #8B6914 !important;
    font-style: italic !important;
    position: relative !important;
    z-index: 1 !important;
    font-weight: 600 !important;
}

.text-orange-500 {
    color: #A67C00 !important;
    position: relative !important;
    z-index: 1 !important;
    font-weight: 600 !important;
}
/* 7. 加载动画 — 白金三球跳跃 (SVG SMIL) 【完整版】 */
.style_dot-flashing__8L91Q.style_text__zGhNq {
    display: none !important;
}

.flex.items-center.justify-center.w-6.h-5 {
    position: relative !important;
    min-height: 48px !important;
    min-width: 48px !important;
}

.flex.items-center.justify-center.w-6.h-5::before {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 48px !important;
    height: 48px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80'%3E%3Cdefs%3E%3CradialGradient id='g1' cx='50%25' cy='50%25' r='50%25'%3E%3Cstop offset='0%25' stop-color='%23F5F5F5'/%3E%3Cstop offset='50%25' stop-color='%23E8E8E8'/%3E%3Cstop offset='100%25' stop-color='%23D4AF37'/%3E%3C/radialGradient%3E%3CradialGradient id='g2' cx='50%25' cy='50%25' r='50%25'%3E%3Cstop offset='0%25' stop-color='%23FFF9E6'/%3E%3Cstop offset='50%25' stop-color='%23FAF0E6'/%3E%3Cstop offset='100%25' stop-color='%23DAA520'/%3E%3C/radialGradient%3E%3CradialGradient id='g3' cx='50%25' cy='50%25' r='50%25'%3E%3Cstop offset='0%25' stop-color='%23FFFEF7'/%3E%3Cstop offset='50%25' stop-color='%23F0F0F0'/%3E%3Cstop offset='100%25' stop-color='%23B8860B'/%3E%3C/radialGradient%3E%3C/defs%3E%3Ccircle cx='20' cy='50' r='6' fill='url(%23g1)' stroke='%23D4AF37' stroke-width='0.5'%3E%3Canimate attributeName='cy' values='50;25;50' dur='1.2s' repeatCount='indefinite' begin='0s'/%3E%3Canimate attributeName='r' values='6;7;6' dur='1.2s' repeatCount='indefinite' begin='0s'/%3E%3C/circle%3E%3Cellipse cx='20' cy='62' rx='5' ry='2' fill='%23000000' opacity='0.12'%3E%3Canimate attributeName='opacity' values='0.12;0.04;0.12' dur='1.2s' repeatCount='indefinite' begin='0s'/%3E%3Canimate attributeName='rx' values='5;6.5;5' dur='1.2s' repeatCount='indefinite' begin='0s'/%3E%3C/ellipse%3E%3Ccircle cx='40' cy='50' r='6' fill='url(%23g2)' stroke='%23DAA520' stroke-width='0.5'%3E%3Canimate attributeName='cy' values='50;25;50' dur='1.2s' repeatCount='indefinite' begin='0.2s'/%3E%3Canimate attributeName='r' values='6;7;6' dur='1.2s' repeatCount='indefinite' begin='0.2s'/%3E%3C/circle%3E%3Cellipse cx='40' cy='62' rx='5' ry='2' fill='%23000000' opacity='0.12'%3E%3Canimate attributeName='opacity' values='0.12;0.04;0.12' dur='1.2s' repeatCount='indefinite' begin='0.2s'/%3E%3Canimate attributeName='rx' values='5;6.5;5' dur='1.2s' repeatCount='indefinite' begin='0.2s'/%3E%3C/ellipse%3E%3Ccircle cx='60' cy='50' r='6' fill='url(%23g3)' stroke='%23B8860B' stroke-width='0.5'%3E%3Canimate attributeName='cy' values='50;25;50' dur='1.2s' repeatCount='indefinite' begin='0.4s'/%3E%3Canimate attributeName='r' values='6;7;6' dur='1.2s' repeatCount='indefinite' begin='0.4s'/%3E%3C/circle%3E%3Cellipse cx='60' cy='62' rx='5' ry='2' fill='%23000000' opacity='0.12'%3E%3Canimate attributeName='opacity' values='0.12;0.04;0.12' dur='1.2s' repeatCount='indefinite' begin='0.4s'/%3E%3Canimate attributeName='rx' values='5;6.5;5' dur='1.2s' repeatCount='indefinite' begin='0.4s'/%3E%3C/ellipse%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    z-index: 2 !important;
}

.flex.items-center.justify-center.w-6.h-5::after {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 56px !important;
    height: 56px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80'%3E%3Ccircle cx='40' cy='40' r='32' fill='none' stroke='%23D4AF37' stroke-width='1.5' opacity='0.25' stroke-dasharray='8 12'%3E%3CanimateTransform attributeName='transform' type='rotate' values='0 40 40;360 40 40' dur='8s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='0.25;0.1;0.25' dur='4s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='40' cy='40' r='28' fill='none' stroke='%23B8860B' stroke-width='1' opacity='0.18' stroke-dasharray='6 10'%3E%3CanimateTransform attributeName='transform' type='rotate' values='360 40 40;0 40 40' dur='10s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='0.18;0.06;0.18' dur='5s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    z-index: 1 !important;
}

/* 8. 移动端适配 */
@media (max-width: 480px) {
    .bg-gray-100\/90.relative.inline-block {
        margin: 10px !important;
        border-radius: 20px !important;
        padding: 16px !important;
    }
    
    .markdown-body {
        font-size: 15px !important;
        line-height: 1.7 !important;
    }
    
    .markdown-body pre {
        border-radius: 12px !important;
        margin: 1em 0 !important;
    }
    
    .markdown-body pre > div > div[node] {
        padding: 16px !important;
        font-size: 13px !important;
    }
    
    .flex.items-center.justify-center.w-6.h-5 {
        min-height: 40px !important;
        min-width: 40px !important;
    }
    
    .flex.items-center.justify-center.w-6.h-5::before {
        width: 40px !important;
        height: 40px !important;
    }
    
    .flex.items-center.justify-center.w-6.h-5::after {
        width: 48px !important;
        height: 48px !important;
    }
}

/* 9. 低动效偏好适配 */
@media (prefers-reduced-motion: reduce) {
    .bg-gray-100\/90.relative.inline-block::before {
        opacity: 0.35 !important;
    }
    
    .bg-gray-100\/90.relative.inline-block::after {
        opacity: 0.22 !important;
    }
    
    .bg-gray-100\/90.relative.inline-block:hover {
        transform: translateY(-1px) scale(1.002) !important;
    }
    
    .MuiButtonBase-root.MuiButton-text.MuiButton-textPrimary:hover,
    button:hover {
        transform: none !important;
    }
}