/* ============================================================
   🌸✨ 月下百合 · 星夜梦幻圣殿 (终极满配版) ✨🌸
   融合「极光之夜」结构精度 + 「梦幻百合」粉色灵魂
   ============================================================ */

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

/* ============================================================
   🌷 [1] 聊天气泡 — 百合花瓣浮雕
   ============================================================ */
[class*="bg-gray-100"] {
    background: linear-gradient(135deg, #1a0a14 0%, #1e0f1e 30%, #1a0c1f 60%, #120a18 100%) !important;
    border: 1px solid rgba(255, 128, 171, 0.2) !important;
    border-radius: 20px !important;
    box-shadow: 
        0 0 0 1px rgba(255, 128, 171, 0.08),
        0 0 20px rgba(255, 100, 150, 0.08),
        0 8px 40px rgba(10, 5, 15, 0.5),
        inset 0 1px 0 rgba(255, 180, 200, 0.06) !important;
    padding: 16px !important;
    backdrop-filter: blur(10px) !important;
    transition: box-shadow 0.4s ease, transform 0.3s ease !important;
}

[class*="bg-gray-100"]:hover {
    box-shadow: 
        0 0 0 1.5px rgba(255, 128, 171, 0.25),
        0 0 30px rgba(255, 100, 150, 0.12),
        0 12px 50px rgba(10, 5, 20, 0.55),
        inset 0 1px 0 rgba(255, 180, 200, 0.1) !important;
    transform: translateY(-1px) !important;
}

/* ============================================================
   🌸 [2] 星辰背景层 — 粉色星空 (::before 闪烁星辰)
   ============================================================ */
.bg-gray-100\/90.relative.inline-block {
    background: linear-gradient(
        160deg,
        #1a0a14 0%,
        #1e0f1e 20%,
        #200e28 40%,
        #1a0c1f 60%,
        #150a1a 80%,
        #0f0812 100%
    ) !important;
    border: 1px solid rgba(255, 128, 171, 0.15) !important;
    box-shadow:
        0 0 0 1px rgba(255, 100, 150, 0.08),
        0 0 20px rgba(200, 80, 130, 0.10),
        0 8px 40px rgba(15, 5, 20, 0.50),
        inset 0 1px 0 rgba(255, 180, 210, 0.06) !important;
    border-radius: 20px !important;
    isolation: isolate !important;
    position: relative !important;
    overflow: hidden !important;
    transition: box-shadow 0.4s ease, transform 0.3s ease !important;
}

.bg-gray-100\/90.relative.inline-block:hover {
    box-shadow:
        0 0 0 1.5px rgba(255, 128, 171, 0.2),
        0 0 30px rgba(255, 100, 150, 0.15),
        0 12px 50px rgba(15, 5, 25, 0.55),
        inset 0 1px 0 rgba(255, 180, 210, 0.1) !important;
    transform: translateY(-1px) !important;
}

/* 闪烁粉色星辰 */
.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.85 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 500 350'%3E%3Ccircle cx='45' cy='30' r='1.2' fill='%23FFB6C1'%3E%3Canimate attributeName='opacity' values='0.2;1;0.2' dur='3s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='120' cy='80' r='1.5' fill='%23FF80AB'%3E%3Canimate attributeName='opacity' values='0.3;0.9;0.3' dur='4.2s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='1.5;2;1.5' dur='4.2s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='230' cy='25' r='1' fill='%23FFFFFF'%3E%3Canimate attributeName='opacity' values='0.15;0.85;0.15' dur='5s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='310' cy='110' r='1.8' fill='%23F8BBD0'%3E%3Canimate attributeName='opacity' values='0.2;0.95;0.2' dur='3.5s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='1.8;2.5;1.8' dur='3.5s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='420' cy='55' r='1' fill='%23FFE4EC'%3E%3Canimate attributeName='opacity' values='0.1;0.7;0.1' dur='6s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='470' cy='180' r='1.3' fill='%23FF80AB'%3E%3Canimate attributeName='opacity' values='0.25;0.85;0.25' dur='4.8s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='80' cy='200' r='0.8' fill='%23FFFFFF'%3E%3Canimate attributeName='opacity' values='0.3;1;0.3' dur='2.8s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='190' cy='160' r='1.6' fill='%23CE93D8'%3E%3Canimate attributeName='opacity' values='0.15;0.8;0.15' dur='5.5s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='1.6;2.2;1.6' dur='5.5s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='350' cy='230' r='1.1' fill='%23FFB6C1'%3E%3Canimate attributeName='opacity' values='0.2;0.9;0.2' dur='3.8s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='260' cy='280' r='1.4' fill='%23F48FB1'%3E%3Canimate attributeName='opacity' values='0.1;0.75;0.1' dur='4.5s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='440' cy='300' r='0.9' fill='%23FFFFFF'%3E%3Canimate attributeName='opacity' values='0.2;0.8;0.2' dur='3.2s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='30' cy='310' r='1.7' fill='%23E1BEE7'%3E%3Canimate attributeName='opacity' values='0.2;0.9;0.2' dur='6.5s' repeatCount='indefinite'/%3E%3Canimate attributeName='r' values='1.7;2.3;1.7' dur='6.5s' repeatCount='indefinite'/%3E%3C/circle%3E%3Cg transform='translate(380,60)'%3E%3Cline x1='-5' y1='0' x2='5' y2='0' stroke='%23FFB6C1' stroke-width='0.6'%3E%3Canimate attributeName='opacity' values='0.1;0.9;0.1' dur='4s' repeatCount='indefinite'/%3E%3C/line%3E%3Cline x1='0' y1='-5' x2='0' y2='5' stroke='%23FFB6C1' stroke-width='0.6'%3E%3Canimate attributeName='opacity' values='0.1;0.9;0.1' dur='4s' repeatCount='indefinite'/%3E%3C/line%3E%3C/g%3E%3Cg transform='translate(150,120)'%3E%3Cline x1='-4' y1='0' x2='4' y2='0' stroke='%23F8BBD0' stroke-width='0.5'%3E%3Canimate attributeName='opacity' values='0.15;0.8;0.15' dur='5.2s' repeatCount='indefinite'/%3E%3C/line%3E%3Cline x1='0' y1='-4' x2='0' y2='4' stroke='%23F8BBD0' stroke-width='0.5'%3E%3Canimate attributeName='opacity' values='0.15;0.8;0.15' dur='5.2s' repeatCount='indefinite'/%3E%3C/line%3E%3C/g%3E%3C/svg%3E") !important;
    background-size: cover !important;
    background-repeat: repeat !important;
}

/* 花瓣流星 */
.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.6 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 500 300'%3E%3Cdefs%3E%3ClinearGradient id='m1' x1='0' y1='0' x2='1' y2='0'%3E%3Cstop offset='0%25' stop-color='%23FFB6C1' stop-opacity='0.9'/%3E%3Cstop offset='100%25' stop-color='%23FFB6C1' stop-opacity='0'/%3E%3C/linearGradient%3E%3ClinearGradient id='m2' x1='0' y1='0' x2='1' y2='0'%3E%3Cstop offset='0%25' stop-color='%23CE93D8' stop-opacity='0.8'/%3E%3Cstop offset='100%25' stop-color='%23CE93D8' stop-opacity='0'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cline x1='0' y1='0' x2='40' y2='0' stroke='url(%23m1)' stroke-width='1.5' stroke-linecap='round' transform='rotate(35)'%3E%3CanimateTransform attributeName='transform' type='translate' values='-60,-20;520,340' dur='8s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='0;0;1;1;0;0;0;0;0;0' dur='8s' repeatCount='indefinite'/%3E%3C/line%3E%3Cline x1='0' y1='0' x2='30' y2='0' stroke='url(%23m2)' stroke-width='1' stroke-linecap='round' transform='rotate(40)'%3E%3CanimateTransform attributeName='transform' type='translate' values='50,-30;550,280' dur='12s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='0;0;0;0;0;1;1;0;0;0;0;0' dur='12s' repeatCount='indefinite'/%3E%3C/line%3E%3Cline x1='0' y1='0' x2='20' y2='0' stroke='url(%23m1)' stroke-width='0.8' stroke-linecap='round' transform='rotate(30)'%3E%3CanimateTransform attributeName='transform' type='translate' values='-30,40;480,320' dur='15s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='0;0;0;0;0;0;0;1;0.8;0;0;0;0;0;0' dur='15s' repeatCount='indefinite'/%3E%3C/line%3E%3C/svg%3E") !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}

/* ============================================================
   🌙 [3] 文本主体 — 月光百合色调
   ============================================================ */
.markdown-body {
    color: #F3E5F5 !important;
    font-family: system-ui, -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif !important;
    background: transparent !important;
    position: relative !important;
    z-index: 1 !important;
    line-height: 1.8 !important;
    letter-spacing: 0.02em !important;
}

/* 文字选区：粉色微光 */
.markdown-body ::selection {
    background: rgba(255, 128, 171, 0.3) !important;
    color: #ffffff !important;
    text-shadow: 0 0 5px rgba(255, 255, 255, 0.5) !important;
}

/* 对话前装饰 */
.markdown-body::before {
    content: "✦ " !important;
    color: #FF80AB !important;
    text-shadow: 0 0 8px rgba(255, 128, 171, 0.6) !important;
}

.markdown-body strong {
    color: #F48FB1 !important;
    font-weight: 700 !important;
    background: rgba(244, 143, 177, 0.1) !important;
    padding: 0 4px !important;
    border-radius: 4px !important;
}

/* 行内代码 — 百合紫调 */
.markdown-body code {
    background: rgba(206, 147, 216, 0.12) !important;
    color: #CE93D8 !important;
    border-radius: 5px !important;
    padding: 2px 6px !important;
    border: 1px solid rgba(206, 147, 216, 0.18) !important;
    font-size: 0.9em !important;
}

/* 链接 — 流光粉 */
.markdown-body a {
    color: #F48FB1 !important;
    text-decoration: none !important;
    border-bottom: 1px dashed rgba(244, 143, 177, 0.5) !important;
    transition: all 0.3s ease !important;
}
.markdown-body a:hover {
    color: #F8BBD0 !important;
    border-bottom: 1px solid #F8BBD0 !important;
    text-shadow: 0 0 8px rgba(248, 187, 208, 0.8) !important;
}

/* 星轨分割线 */
.markdown-body hr {
    height: 1px !important;
    background: linear-gradient(90deg, transparent, rgba(255, 128, 171, 0.8), transparent) !important;
    border: none !important;
    margin: 24px 0 !important;
    box-shadow: 0 0 10px rgba(255, 128, 171, 0.4) !important;
}

/* 列表标记 */
.markdown-body li::marker {
    color: #F48FB1 !important;
}

/* ============================================================
   💎 [4] 代码块 — 暗夜百合花园
   ============================================================ */
.markdown-body pre {
    background: rgba(15, 8, 20, 0.6) !important;
    border: 1px solid rgba(255, 128, 171, 0.12) !important;
    border-radius: 14px !important;
    box-shadow: 0 10px 30px rgba(10, 5, 15, 0.5) !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: rgba(30, 15, 25, 0.8) !important;
    border-bottom: 1px solid rgba(255, 128, 171, 0.08) !important;
    padding: 0 16px !important;
    height: 40px !important;
}

/* 语言标签 */
.markdown-body pre > div > div.flex.justify-between > div:first-child {
    color: #F48FB1 !important;
    font-weight: 600 !important;
    font-family: 'Consolas', monospace !important;
    text-transform: uppercase !important;
    font-size: 12px !important;
    letter-spacing: 1px !important;
}

/* 复制按钮 */
.markdown-body pre div[data-tooltip-id^="copy-tooltip"],
.markdown-body pre .copy-btn-legacy {
    background: rgba(255, 128, 171, 0.08) !important;
    border: 1px solid rgba(255, 128, 171, 0.15) !important;
    color: #F8BBD0 !important;
    border-radius: 6px !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-color: rgba(255, 128, 171, 0.2) !important;
    border-color: #FF80AB !important;
    box-shadow: 0 0 10px rgba(255, 128, 171, 0.3) !important;
}

/* 代码内容区 */
.markdown-body pre > div > div[node] {
    background: rgba(15, 8, 20, 0.5) !important;
    color: #F3E5F5 !important;
    padding: 20px !important;
    font-family: 'Fira Code', 'JetBrains Mono', 'Consolas', monospace !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

/* 代码块滚动条 */
.markdown-body pre > div > div[node]::-webkit-scrollbar {
    height: 8px !important; width: 8px !important;
}
.markdown-body pre > div > div[node]::-webkit-scrollbar-track {
    background: rgba(15, 8, 20, 0.5) !important;
}
.markdown-body pre > div > div[node]::-webkit-scrollbar-thumb {
    background: rgba(244, 143, 177, 0.3) !important;
    border-radius: 10px !important;
}
.markdown-body pre > div > div[node]::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 128, 171, 0.6) !important;
}

/* ============================================================
   🔮 [5] 折叠面板 — 秘密百合匣
   ============================================================ */
.markdown-body details {
    background: rgba(25, 12, 20, 0.5) !important;
    border: 1px solid rgba(255, 128, 171, 0.2) !important;
    border-radius: 12px !important;
    padding: 12px 16px !important;
    margin: 12px 0 !important;
    box-shadow: inset 0 0 15px rgba(10, 5, 15, 0.3) !important;
    transition: all 0.3s ease !important;
    position: relative !important;
    z-index: 1 !important;
}

.markdown-body details:hover {
    border-color: rgba(255, 128, 171, 0.45) !important;
    background: rgba(30, 15, 25, 0.6) !important;
}

.markdown-body summary {
    cursor: pointer !important;
    color: #F48FB1 !important;
    font-weight: 600 !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: #F8BBD0 !important;
    text-shadow: 0 0 8px rgba(248, 187, 208, 0.5) !important;
}

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

/* 折叠箭头：百合花苞 → 绽放 */
.markdown-body summary::before {
    content: "💮" !important;
    font-size: 14px !important;
    margin-right: 10px !important;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.markdown-body details[open] summary::before {
    content: "🌸" !important;
    transform: rotate(45deg) !important;
}

.markdown-body details[open] summary {
    margin-bottom: 12px !important;
    border-bottom: 1px dashed rgba(255, 128, 171, 0.3) !important;
    padding-bottom: 8px !important;
}

/* 展开内容淡入动画 */
.markdown-body details > *:not(summary) {
    animation: lilyBloom 0.4s ease-out !important;
}

@keyframes lilyBloom {
    from { opacity: 0; transform: translateY(-8px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ============================================================
   🎀 [6] 输入框 — 精准定位，不影响字数显示
   ============================================================ */

/* 主聊天输入区域 — 只针对聊天输入的 textarea */
#prompt-textarea,
[class*="chat"] textarea,
[class*="input"] textarea,
[role="textbox"],
form textarea {
    background: rgba(25, 12, 20, 0.7) !important;
    border: 1px solid rgba(255, 128, 171, 0.25) !important;
    border-radius: 16px !important;
    padding: 14px 20px !important;
    color: #F3E5F5 !important;
    font-family: system-ui, -apple-system, "PingFang SC", sans-serif !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
    outline: none !important;
    transition: all 0.3s ease !important;
    box-shadow: inset 0 2px 8px rgba(10, 5, 15, 0.3) !important;
    /* 关键：不改变 box-sizing，不加额外 margin/padding 撑大布局 */
    box-sizing: border-box !important;
}

/* 聚焦状态：百合绽放光晕 */
#prompt-textarea:focus,
[class*="chat"] textarea:focus,
[class*="input"] textarea:focus,
[role="textbox"]:focus,
form textarea:focus {
    border-color: #FF80AB !important;
    box-shadow: 
        0 0 20px rgba(255, 128, 171, 0.25),
        inset 0 0 8px rgba(255, 128, 171, 0.05) !important;
}

/* 占位符 */
#prompt-textarea::placeholder,
[class*="chat"] textarea::placeholder,
[class*="input"] textarea::placeholder,
form textarea::placeholder {
    color: rgba(244, 143, 177, 0.5) !important;
    font-style: italic !important;
}

/* 文本类 input（搜索框等）— 同样精准，不影响其他 input */
input[type="text"],
input[type="search"] {
    background: rgba(25, 12, 20, 0.6) !important;
    border: 1px solid rgba(255, 128, 171, 0.2) !important;
    border-radius: 12px !important;
    padding: 8px 16px !important;
    color: #F3E5F5 !important;
    outline: none !important;
    transition: all 0.3s ease !important;
    box-sizing: border-box !important;
}

input[type="text"]:focus,
input[type="search"]:focus {
    border-color: #FF80AB !important;
    box-shadow: 0 0 15px rgba(255, 128, 171, 0.2) !important;
}

/* ============================================================
   🌙 [7] 引用块 — 月下百合卷轴
   ============================================================ */
.markdown-body blockquote {
    border-left: 4px solid #FF80AB !important;
    background: linear-gradient(90deg, rgba(255, 128, 171, 0.08) 0%, transparent 100%) !important;
    padding: 12px 16px !important;
    margin: 16px 0 !important;
    border-radius: 0 12px 12px 0 !important;
    color: #E1BEE7 !important;
    font-style: italic !important;
    position: relative !important;
    z-index: 1 !important;
}

/* ============================================================
   💜 [8] 琉璃表格 — 暗夜紫晶
   ============================================================ */
.markdown-body table {
    border-collapse: collapse !important;
    width: 100% !important;
    margin: 16px 0 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 15px rgba(10, 5, 15, 0.3) !important;
    position: relative !important;
    z-index: 1 !important;
}
.markdown-body th {
    background: rgba(40, 20, 35, 0.8) !important;
    color: #F48FB1 !important;
    font-weight: 600 !important;
    padding: 12px !important;
    border: 1px solid rgba(255, 128, 171, 0.15) !important;
}
.markdown-body td {
    background: rgba(20, 10, 18, 0.4) !important;
    padding: 12px !important;
    border: 1px solid rgba(255, 128, 171, 0.08) !important;
    transition: background 0.3s ease !important;
}
.markdown-body tr:hover td {
    background: rgba(255, 128, 171, 0.1) !important;
}

/* ============================================================
   ✨ [9] 按钮与附加元素
   ============================================================ */
[class*="text-orange-500"],
button {
    color: #CE93D8 !important;
    transition: all 0.3s ease !important;
    position: relative !important;
    z-index: 1 !important;
}
button:hover {
    color: #F48FB1 !important;
    text-shadow: 0 0 5px rgba(244, 143, 177, 0.5) !important;
}

.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary {
    color: #CE93D8 !important;
    border-radius: 8px !important;
    transition: all 0.25s ease !important;
    position: relative !important;
    z-index: 1 !important;
}
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary:hover {
    color: #F48FB1 !important;
    background: rgba(255, 128, 171, 0.10) !important;
}

.text-orange-500 {
    color: #CE93D8 !important;
    position: relative !important;
    z-index: 1 !important;
}

/* 加载动画 — 脉动百合花核 + 环绕光圈 */
.style_dot-flashing__8L91Q.style_text__zGhNq {
    display: none !important; /* 关闭默认点点动画 */
}

.flex.items-center.justify-center.w-6.h-5 {
    position: relative !important;
    min-height: 40px !important;
    min-width: 40px !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: 36px !important;
    height: 36px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 50' width='50' height='50'%3E%3Cdefs%3E%3CradialGradient id='core' cx='50%25' cy='50%25' r='50%25'%3E%3Cstop offset='0%25' stop-color='%23FF80AB' stop-opacity='1' /%3E%3Cstop offset='40%25' stop-color='%23FF80AB' stop-opacity='0.8' /%3E%3Cstop offset='100%25' stop-color='%234060C0' stop-opacity='0' /%3E%3C/radialGradient%3E%3C/defs%3E%3Ccircle cx='25' cy='25' r='4' fill='url(%23core)'%3E%3Canimate attributeName='r' values='3;5.5;3' dur='2s' repeatCount='indefinite' /%3E%3Canimate attributeName='opacity' values='0.8;1;0.8' dur='2s' repeatCount='indefinite' /%3E%3C/circle%3E%3Ccircle cx='25' cy='12' r='1.5' fill='%23F48FB1' opacity='0.8'%3E%3CanimateTransform attributeName='transform' type='rotate' values='0 25 25;360 25 25' dur='3s' repeatCount='indefinite' /%3E%3Canimate attributeName='opacity' values='0.8;0.3;0.8' dur='1.5s' repeatCount='indefinite' /%3E%3C/circle%3E%3Ccircle cx='25' cy='38' r='1.2' fill='%23F8BBD0' opacity='0.7'%3E%3CanimateTransform attributeName='transform' type='rotate' values='180 25 25;540 25 25' dur='3s' repeatCount='indefinite' /%3E%3Canimate attributeName='opacity' values='0.7;0.25;0.7' dur='1.5s' repeatCount='indefinite' /%3E%3C/circle%3E%3Ccircle cx='12' cy='25' r='1' fill='%23FF80AB' opacity='0.6'%3E%3CanimateTransform attributeName='transform' type='rotate' values='90 25 25;450 25 25' dur='4s' repeatCount='indefinite' /%3E%3Canimate attributeName='opacity' values='0.6;0.2;0.6' dur='2s' 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: 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: 42px !important;
    height: 42px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 50' width='50' height='50'%3E%3Cellipse cx='25' cy='25' rx='20' ry='8' fill='none' stroke='%23F48FB1' stroke-width='0.5' opacity='0.4' stroke-dasharray='4 6'%3E%3CanimateTransform attributeName='transform' type='rotate' values='0 25 25;360 25 25' dur='8s' repeatCount='indefinite' /%3E%3Canimate attributeName='opacity' values='0.4;0.15;0.4' dur='4s' repeatCount='indefinite' /%3E%3C/ellipse%3E%3Cellipse cx='25' cy='25' rx='18' ry='6' fill='none' stroke='%23FF80AB' stroke-width='0.4' opacity='0.3' stroke-dasharray='3 5'%3E%3CanimateTransform attributeName='transform' type='rotate' values='60 25 25;420 25 25' dur='10s' repeatCount='indefinite' /%3E%3Canimate attributeName='opacity' values='0.3;0.1;0.3' dur='5s' repeatCount='indefinite' /%3E%3C/ellipse%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    z-index: 1 !important;
}

/* ============================================================
   📱 [11] 移动端适配优化
   ============================================================ */
@media (max-width: 480px) {
    .bg-gray-100,
    .bg-gray-100\/90.relative.inline-block {
        margin: 8px !important;
        border-radius: 16px !important;
        padding: 12px !important;
    }
    .flex.items-center.justify-center.w-6.h-5 {
        min-height: 32px !important;
        min-width: 32px !important;
    }
    .flex.items-center.justify-center.w-6.h-5::before {
        width: 28px !important;
        height: 28px !important;
    }
    .flex.items-center.justify-center.w-6.h-5::after {
        width: 34px !important;
        height: 34px !important;
    }
    #prompt-textarea,
    [class*="chat"] textarea,
    [class*="input"] textarea,
    form textarea {
        font-size: 14px !important;
        padding: 12px 16px !important;
    }
}

/* ============================================================
   ♻️ [12] 低动效偏好适配 (节能护眼)
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
    .bg-gray-100\/90.relative.inline-block::before,
    .bg-gray-100\/90.relative.inline-block::after {
        opacity: 0.4 !important;
        animation: none !important;
    }
    .bg-gray-100\/90.relative.inline-block:hover {
        transform: none !important;
        box-shadow: 0 0 5px rgba(255, 128, 171, 0.15) !important;
    }
    .flex.items-center.justify-center.w-6.h-5::before,
    .flex.items-center.justify-center.w-6.h-5::after {
        animation: none !important;
    }
}

/* ============================================================
   🌸 完 成 — 月下百合的终极梦幻护眼体验 🌸
   ============================================================ */