/* ==========================================
   ❄ 雪花 · 蜕变主题 · 聊天框美化方案
   特点: 高级纯白、磨砂质感、飘落雪花、晶体蜕变加载
   ========================================== */

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

/* 2. 统一聊天框 — 高级象牙白磨砂 */
.bg-gray-100\/90.relative.inline-block {
    background: linear-gradient(
        145deg,
        #FFFFFF 0%,
        #FAFBFC 30%,
        #F4F6F8 55%,
        #FCFCFD 80%,
        #F7F8FA 100%
    ) !important;
    border: 1px solid rgba(210, 218, 226, 0.55) !important;
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.9),
        0 2px 12px rgba(148, 163, 184, 0.12),
        0 10px 36px rgba(100, 116, 139, 0.10),
        inset 0 1px 0 rgba(255, 255, 255, 0.95),
        inset 0 -1px 2px rgba(203, 213, 225, 0.25) !important;
    border-radius: 26px !important;
    isolation: isolate !important;
    position: relative !important;
    overflow: hidden !important;
    padding: 22px !important;
    backdrop-filter: blur(4px) saturate(1.05) !important;
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

.bg-gray-100\/90.relative.inline-block:hover {
    border-color: rgba(186, 200, 214, 0.7) !important;
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 1),
        0 4px 18px rgba(148, 163, 184, 0.18),
        0 16px 48px rgba(100, 116, 139, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 1) !important;
    transform: translateY(-2px) scale(1.004) !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.7 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 400'%3E%3Cg fill='%23B8C4D0'%3E%3Ccircle cx='80' cy='-10' r='2.5' opacity='0.6'%3E%3Canimate attributeName='cy' values='-10;410' dur='9s' repeatCount='indefinite'/%3E%3Canimate attributeName='cx' values='80;100;80' dur='9s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='0;0.6;0.6;0' dur='9s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='200' cy='-10' r='3' opacity='0.5'%3E%3Canimate attributeName='cy' values='-10;410' dur='12s' repeatCount='indefinite' begin='1s'/%3E%3Canimate attributeName='cx' values='200;175;200' dur='12s' repeatCount='indefinite' begin='1s'/%3E%3Canimate attributeName='opacity' values='0;0.5;0.5;0' dur='12s' repeatCount='indefinite' begin='1s'/%3E%3C/circle%3E%3Ccircle cx='340' cy='-10' r='2' opacity='0.55'%3E%3Canimate attributeName='cy' values='-10;410' dur='8s' repeatCount='indefinite' begin='2s'/%3E%3Canimate attributeName='cx' values='340;360;340' dur='8s' repeatCount='indefinite' begin='2s'/%3E%3Canimate attributeName='opacity' values='0;0.55;0.55;0' dur='8s' repeatCount='indefinite' begin='2s'/%3E%3C/circle%3E%3Ccircle cx='460' cy='-10' r='3.5' opacity='0.45'%3E%3Canimate attributeName='cy' values='-10;410' dur='14s' repeatCount='indefinite' begin='0.5s'/%3E%3Canimate attributeName='cx' values='460;435;460' dur='14s' repeatCount='indefinite' begin='0.5s'/%3E%3Canimate attributeName='opacity' values='0;0.45;0.45;0' dur='14s' repeatCount='indefinite' begin='0.5s'/%3E%3C/circle%3E%3Ccircle cx='540' cy='-10' r='2.5' opacity='0.5'%3E%3Canimate attributeName='cy' values='-10;410' dur='10s' repeatCount='indefinite' begin='3s'/%3E%3Canimate attributeName='cx' values='540;520;540' dur='10s' repeatCount='indefinite' begin='3s'/%3E%3Canimate attributeName='opacity' values='0;0.5;0.5;0' dur='10s' repeatCount='indefinite' begin='3s'/%3E%3C/circle%3E%3Ccircle cx='140' cy='-10' r='2' opacity='0.5'%3E%3Canimate attributeName='cy' values='-10;410' dur='11s' repeatCount='indefinite' begin='4s'/%3E%3Canimate attributeName='cx' values='140;160;140' dur='11s' repeatCount='indefinite' begin='4s'/%3E%3Canimate attributeName='opacity' values='0;0.5;0.5;0' dur='11s' repeatCount='indefinite' begin='4s'/%3E%3C/circle%3E%3Ccircle cx='400' cy='-10' r='2.5' opacity='0.5'%3E%3Canimate attributeName='cy' values='-10;410' dur='13s' repeatCount='indefinite' begin='2.5s'/%3E%3Canimate attributeName='cx' values='400;380;400' dur='13s' repeatCount='indefinite' begin='2.5s'/%3E%3Canimate attributeName='opacity' values='0;0.5;0.5;0' dur='13s' repeatCount='indefinite' begin='2.5s'/%3E%3C/circle%3E%3C/g%3E%3Cg stroke='%23CBD5E1' stroke-width='1.2' fill='none' opacity='0.45'%3E%3Cg transform='translate(280,90)'%3E%3Cpath d='M0,-14 L0,14 M-12,-7 L12,7 M-12,7 L12,-7'/%3E%3CanimateTransform attributeName='transform' type='rotate' values='0;360' dur='30s' repeatCount='indefinite' additive='sum'/%3E%3Canimate attributeName='opacity' values='0.45;0.7;0.45' dur='6s' repeatCount='indefinite'/%3E%3C/g%3E%3Cg transform='translate(500,250)'%3E%3Cpath d='M0,-10 L0,10 M-9,-5 L9,5 M-9,5 L9,-5'/%3E%3CanimateTransform attributeName='transform' type='rotate' values='360;0' dur='35s' repeatCount='indefinite' additive='sum'/%3E%3Canimate attributeName='opacity' values='0.4;0.65;0.4' dur='7s' repeatCount='indefinite'/%3E%3C/g%3E%3C/g%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%3Cg stroke='%23D1DAE3' stroke-width='1' fill='none'%3E%3Cpolygon points='90,200 110,188 130,200 130,224 110,236 90,224' opacity='0.4'%3E%3Canimate attributeName='opacity' values='0;0.4;0' dur='8s' repeatCount='indefinite'/%3E%3CanimateTransform attributeName='transform' type='scale' values='0.6;1.1;0.6' additive='sum' dur='8s' repeatCount='indefinite'/%3E%3C/polygon%3E%3Cpolygon points='420,110 440,98 460,110 460,134 440,146 420,134' opacity='0.35'%3E%3Canimate attributeName='opacity' values='0;0.35;0' dur='10s' repeatCount='indefinite' begin='2s'/%3E%3C/polygon%3E%3Cpolygon points='250,310 268,300 286,310 286,330 268,340 250,330' opacity='0.4'%3E%3Canimate attributeName='opacity' values='0;0.4;0' dur='9s' repeatCount='indefinite' begin='4s'/%3E%3C/polygon%3E%3C/g%3E%3Cg fill='%23E2E8F0'%3E%3Ccircle cx='180' cy='150' r='1.5' opacity='0.5'%3E%3Canimate attributeName='opacity' values='0.2;0.7;0.2' dur='5s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='360' cy='250' r='1.5' opacity='0.5'%3E%3Canimate attributeName='opacity' values='0.7;0.2;0.7' dur='6s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='480' cy='320' r='1.5' opacity='0.5'%3E%3Canimate attributeName='opacity' values='0.2;0.7;0.2' dur='4.5s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%3E%3C/svg%3E") !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}

/* 5. 主文本内容 — 石墨深色高对比 */
.markdown-body {
    color: #2B3440 !important;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans SC", "PingFang SC", sans-serif !important;
    background: transparent !important;
    position: relative !important;
    z-index: 1 !important;
    line-height: 1.85 !important;
    letter-spacing: 0.012em !important;
}

.markdown-body strong {
    color: #1E3A5F !important;
    font-weight: 700 !important;
    background: linear-gradient(180deg, transparent 62%, rgba(186, 200, 214, 0.35) 62%) !important;
    padding: 0 2px !important;
}

.markdown-body ::selection {
    background: rgba(186, 200, 214, 0.45) !important;
    color: #1A2530 !important;
}

.markdown-body::before {
    content: "❄ " !important;
    color: #94A3B8 !important;
    filter: drop-shadow(0 0 3px rgba(148, 163, 184, 0.4)) !important;
}

/* 行内代码 */
.markdown-body code {
    background: rgba(226, 232, 240, 0.55) !important;
    color: #334155 !important;
    border-radius: 6px !important;
    padding: 3px 7px !important;
    border: 1px solid rgba(203, 213, 225, 0.6) !important;
    font-size: 0.92em !important;
    font-weight: 500 !important;
}

/* 代码块 */
.markdown-body pre {
    background: rgba(255, 255, 255, 0.92) !important;
    border: 1px solid rgba(203, 213, 225, 0.6) !important;
    border-radius: 18px !important;
    box-shadow: 0 6px 22px rgba(100, 116, 139, 0.10) !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, #F8FAFC, #EEF2F6) !important;
    border-bottom: 1px solid rgba(203, 213, 225, 0.5) !important;
    padding: 0 18px !important;
    height: 42px !important;
}

.markdown-body pre > div > div.flex.justify-between > div:first-child {
    color: #475569 !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(226, 232, 240, 0.6) !important;
    border: 1px solid rgba(203, 213, 225, 0.7) !important;
    color: #475569 !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(186, 200, 214, 0.5) !important;
    border-color: #94A3B8 !important;
    box-shadow: 0 0 12px rgba(148, 163, 184, 0.3) !important;
}

.markdown-body pre > div > div[node] {
    background: #FCFDFE !important;
    color: #334155 !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: #F1F5F9 !important;
    border-radius: 5px !important;
}

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

.markdown-body pre > div > div[node]::-webkit-scrollbar-thumb:hover {
    background: rgba(100, 116, 139, 0.65) !important;
}

/* 引用块 */
.markdown-body blockquote {
    border-left: 4px solid #94A3B8 !important;
    background: linear-gradient(90deg, rgba(203, 213, 225, 0.25) 0%, transparent 100%) !important;
    padding: 14px 18px !important;
    margin: 18px 0 !important;
    border-radius: 0 14px 14px 0 !important;
    color: #3E4C59 !important;
    font-style: italic !important;
    position: relative !important;
    z-index: 1 !important;
}

/* 链接 */
.markdown-body a {
    color: #475569 !important;
    text-decoration: none !important;
    border-bottom: 1px solid rgba(148, 163, 184, 0.5) !important;
    transition: all 0.3s ease !important;
    font-weight: 500 !important;
}

.markdown-body a:hover {
    color: #1E3A5F !important;
    border-bottom: 1px solid #1E3A5F !important;
    filter: drop-shadow(0 0 5px rgba(148, 163, 184, 0.4)) !important;
}

/* 分割线 */
.markdown-body hr {
    height: 1px !important;
    background: linear-gradient(90deg, transparent, rgba(148, 163, 184, 0.5), transparent) !important;
    border: none !important;
    margin: 28px 0 !important;
    box-shadow: 0 0 8px rgba(148, 163, 184, 0.25) !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(100, 116, 139, 0.10) !important;
    position: relative !important;
    z-index: 1 !important;
}

.markdown-body th {
    background: linear-gradient(135deg, #F8FAFC, #EEF2F6) !important;
    color: #475569 !important;
    font-weight: 700 !important;
    padding: 14px !important;
    border: 1px solid rgba(203, 213, 225, 0.6) !important;
}

.markdown-body td {
    background: rgba(255, 255, 255, 0.75) !important;
    padding: 14px !important;
    border: 1px solid rgba(203, 213, 225, 0.4) !important;
    transition: background 0.3s ease !important;
}

.markdown-body tr:hover td {
    background: rgba(203, 213, 225, 0.25) !important;
}

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

/* 折叠块 */
.markdown-body details {
    background: rgba(255, 255, 255, 0.7) !important;
    border: 1px solid rgba(203, 213, 225, 0.6) !important;
    border-radius: 14px !important;
    padding: 14px 18px !important;
    margin: 14px 0 !important;
    box-shadow: 0 4px 12px rgba(100, 116, 139, 0.08) !important;
    transition: all 0.3s ease !important;
    position: relative !important;
    z-index: 1 !important;
}

.markdown-body details:hover {
    border-color: rgba(148, 163, 184, 0.7) !important;
    background: rgba(255, 255, 255, 0.9) !important;
}

.markdown-body summary {
    cursor: pointer !important;
    color: #475569 !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: #1E3A5F !important;
    filter: drop-shadow(0 0 4px rgba(148, 163, 184, 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: #94A3B8 !important;
    transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}

.markdown-body details[open] summary::before {
    transform: rotate(180deg) scale(1.15) !important;
    color: #64748B !important;
}

.markdown-body details[open] summary {
    margin-bottom: 14px !important;
    border-bottom: 1px dashed rgba(148, 163, 184, 0.4) !important;
    padding-bottom: 10px !important;
}

/* 6. 底部附加元素 */
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary,
button {
    color: #475569 !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: #1E3A5F !important;
    background: rgba(203, 213, 225, 0.4) !important;
    filter: drop-shadow(0 0 5px rgba(148, 163, 184, 0.3)) !important;
    transform: translateY(-1px) !important;
}

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

.text-orange-500 {
    color: #94A3B8 !important;
    position: relative !important;
    z-index: 1 !important;
    font-weight: 600 !important;
}
/* 7. 加载动画 — 雪花结晶蜕变 (SVG SMIL) */
.style-module__AtdJSq__dot-flashing.style-module__AtdJSq__text {
    display: none !important;
}

.flex.items-center.justify-center.w-6.h-5 {
    position: relative !important;
    min-height: 52px !important;
    min-width: 52px !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: 52px !important;
    height: 52px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80'%3E%3Cg transform='translate(40,40)'%3E%3Cg stroke='%2394A3B8' stroke-width='2.2' stroke-linecap='round' fill='none'%3E%3Cg%3E%3Cline x1='0' y1='0' x2='0' y2='-22'%3E%3Canimate attributeName='y2' values='-5;-22;-22;-5' keyTimes='0;0.4;0.85;1' dur='3s' repeatCount='indefinite'/%3E%3C/line%3E%3Cline x1='0' y1='-12' x2='-6' y2='-17'%3E%3Canimate attributeName='stroke-opacity' values='0;1;1;0' keyTimes='0;0.45;0.85;1' dur='3s' repeatCount='indefinite'/%3E%3C/line%3E%3Cline x1='0' y1='-12' x2='6' y2='-17'%3E%3Canimate attributeName='stroke-opacity' values='0;1;1;0' keyTimes='0;0.45;0.85;1' dur='3s' repeatCount='indefinite'/%3E%3C/line%3E%3CanimateTransform attributeName='transform' type='rotate' values='0;0' dur='3s' repeatCount='indefinite'/%3E%3C/g%3E%3Cg transform='rotate(60)'%3E%3Cline x1='0' y1='0' x2='0' y2='-22'%3E%3Canimate attributeName='y2' values='-5;-22;-22;-5' keyTimes='0;0.4;0.85;1' dur='3s' begin='0.15s' repeatCount='indefinite'/%3E%3C/line%3E%3Cline x1='0' y1='-12' x2='-6' y2='-17'%3E%3Canimate attributeName='stroke-opacity' values='0;1;1;0' keyTimes='0;0.45;0.85;1' dur='3s' begin='0.15s' repeatCount='indefinite'/%3E%3C/line%3E%3Cline x1='0' y1='-12' x2='6' y2='-17'%3E%3Canimate attributeName='stroke-opacity' values='0;1;1;0' keyTimes='0;0.45;0.85;1' dur='3s' begin='0.15s' repeatCount='indefinite'/%3E%3C/line%3E%3C/g%3E%3Cg transform='rotate(120)'%3E%3Cline x1='0' y1='0' x2='0' y2='-22'%3E%3Canimate attributeName='y2' values='-5;-22;-22;-5' keyTimes='0;0.4;0.85;1' dur='3s' begin='0.3s' repeatCount='indefinite'/%3E%3C/line%3E%3Cline x1='0' y1='-12' x2='-6' y2='-17'%3E%3Canimate attributeName='stroke-opacity' values='0;1;1;0' keyTimes='0;0.45;0.85;1' dur='3s' begin='0.3s' repeatCount='indefinite'/%3E%3C/line%3E%3Cline x1='0' y1='-12' x2='6' y2='-17'%3E%3Canimate attributeName='stroke-opacity' values='0;1;1;0' keyTimes='0;0.45;0.85;1' dur='3s' begin='0.3s' repeatCount='indefinite'/%3E%3C/line%3E%3C/g%3E%3Cg transform='rotate(180)'%3E%3Cline x1='0' y1='0' x2='0' y2='-22'%3E%3Canimate attributeName='y2' values='-5;-22;-22;-5' keyTimes='0;0.4;0.85;1' dur='3s' begin='0.45s' repeatCount='indefinite'/%3E%3C/line%3E%3Cline x1='0' y1='-12' x2='-6' y2='-17'%3E%3Canimate attributeName='stroke-opacity' values='0;1;1;0' keyTimes='0;0.45;0.85;1' dur='3s' begin='0.45s' repeatCount='indefinite'/%3E%3C/line%3E%3Cline x1='0' y1='-12' x2='6' y2='-17'%3E%3Canimate attributeName='stroke-opacity' values='0;1;1;0' keyTimes='0;0.45;0.85;1' dur='3s' begin='0.45s' repeatCount='indefinite'/%3E%3C/line%3E%3C/g%3E%3Cg transform='rotate(240)'%3E%3Cline x1='0' y1='0' x2='0' y2='-22'%3E%3Canimate attributeName='y2' values='-5;-22;-22;-5' keyTimes='0;0.4;0.85;1' dur='3s' begin='0.6s' repeatCount='indefinite'/%3E%3C/line%3E%3Cline x1='0' y1='-12' x2='-6' y2='-17'%3E%3Canimate attributeName='stroke-opacity' values='0;1;1;0' keyTimes='0;0.45;0.85;1' dur='3s' begin='0.6s' repeatCount='indefinite'/%3E%3C/line%3E%3Cline x1='0' y1='-12' x2='6' y2='-17'%3E%3Canimate attributeName='stroke-opacity' values='0;1;1;0' keyTimes='0;0.45;0.85;1' dur='3s' begin='0.6s' repeatCount='indefinite'/%3E%3C/line%3E%3C/g%3E%3Cg transform='rotate(300)'%3E%3Cline x1='0' y1='0' x2='0' y2='-22'%3E%3Canimate attributeName='y2' values='-5;-22;-22;-5' keyTimes='0;0.4;0.85;1' dur='3s' begin='0.75s' repeatCount='indefinite'/%3E%3C/line%3E%3Cline x1='0' y1='-12' x2='-6' y2='-17'%3E%3Canimate attributeName='stroke-opacity' values='0;1;1;0' keyTimes='0;0.45;0.85;1' dur='3s' begin='0.75s' repeatCount='indefinite'/%3E%3C/line%3E%3Cline x1='0' y1='-12' x2='6' y2='-17'%3E%3Canimate attributeName='stroke-opacity' values='0;1;1;0' keyTimes='0;0.45;0.85;1' dur='3s' begin='0.75s' repeatCount='indefinite'/%3E%3C/line%3E%3C/g%3E%3C/g%3E%3CanimateTransform attributeName='transform' type='rotate' values='0 0 0;360 0 0' dur='12s' repeatCount='indefinite' additive='sum'/%3E%3C/g%3E%3Ccircle cx='40' cy='40' r='3' fill='%2364748B'%3E%3Canimate attributeName='r' values='1.5;3.5;1.5' dur='3s' repeatCount='indefinite'/%3E%3Canimate attributeName='fill-opacity' values='0.5;1;0.5' dur='3s' 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: 60px !important;
    height: 60px !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='34' fill='none' stroke='%23B8C4D0' stroke-width='1.2' opacity='0.25' stroke-dasharray='3 9'%3E%3CanimateTransform attributeName='transform' type='rotate' values='0 40 40;360 40 40' dur='14s' repeatCount='indefinite'/%3E%3Canimate attributeName='opacity' values='0.25;0.1;0.25' dur='6s' repeatCount='indefinite'/%3E%3C/circle%3E%3Cg fill='%23CBD5E1'%3E%3Ccircle cx='40' cy='8' r='1.6'%3E%3Canimate attributeName='opacity' values='0.2;0.9;0.2' dur='3s' repeatCount='indefinite'/%3E%3CanimateTransform attributeName='transform' type='rotate' values='0 40 40;360 40 40' dur='14s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='72' cy='40' r='1.6'%3E%3Canimate attributeName='opacity' values='0.9;0.2;0.9' dur='3s' repeatCount='indefinite'/%3E%3CanimateTransform attributeName='transform' type='rotate' values='0 40 40;360 40 40' dur='14s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='40' cy='72' r='1.6'%3E%3Canimate attributeName='opacity' values='0.2;0.9;0.2' dur='3.5s' repeatCount='indefinite'/%3E%3CanimateTransform attributeName='transform' type='rotate' values='0 40 40;360 40 40' dur='14s' repeatCount='indefinite'/%3E%3C/circle%3E%3Ccircle cx='8' cy='40' r='1.6'%3E%3Canimate attributeName='opacity' values='0.9;0.2;0.9' dur='3.5s' repeatCount='indefinite'/%3E%3CanimateTransform attributeName='transform' type='rotate' values='0 40 40;360 40 40' dur='14s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/g%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.72 !important;
    }
    
    .markdown-body pre {
        border-radius: 14px !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: 44px !important;
        min-width: 44px !important;
    }
    
    .flex.items-center.justify-center.w-6.h-5::before {
        width: 44px !important;
        height: 44px !important;
    }
    
    .flex.items-center.justify-center.w-6.h-5::after {
        width: 52px !important;
        height: 52px !important;
    }
}

/* 9. 低动效偏好适配 */
@media (prefers-reduced-motion: reduce) {
    .bg-gray-100\/90.relative.inline-block::before {
        opacity: 0.45 !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-root.MuiButton-text.MuiButton-textPrimary:hover,
    button:hover {
        transform: none !important;
    }
}
/* ============================================
   角色扮演面板 · 雪花高级白主题
   ============================================ */

/* ---- 全局变量 ---- */
:root {
    --rs-bg: #fbfcfd;
    --rs-card: #ffffff;
    --rs-ink: #2b3440;
    --rs-sub: #64748b;
    --rs-line: #e8edf2;
    --rs-accent: #7c9cbf;
    --rs-accent-soft: #eaf1f7;
    --rs-pink: #d98aa3;
    --rs-radius: 16px;
    --rs-shadow: 0 6px 22px rgba(45,52,64,0.07);
}

/* ---- 时间/环境头 ---- */
time {
    display: block;
    background: linear-gradient(135deg, #f6f9fc, #eef3f8);
    border: 1px solid var(--rs-line);
    border-radius: var(--rs-radius);
    padding: 14px 18px;
    margin: 10px 0;
    font-size: 13.5px;
    line-height: 1.9;
    color: var(--rs-sub);
    box-shadow: var(--rs-shadow);
}

/* ---- 正文 ---- */
text {
    display: block;
    background: var(--rs-card);
    border: 1px solid var(--rs-line);
    border-radius: var(--rs-radius);
    padding: 22px 24px;
    margin: 12px 0;
    font-size: 15.5px;
    line-height: 1.85;
    color: var(--rs-ink);
    box-shadow: var(--rs-shadow);
}


/* ---- 折叠面板 ---- */
details {
    background: var(--rs-card);
    border: 1px solid var(--rs-line);
    border-radius: var(--rs-radius);
    margin: 10px 0;
    overflow: hidden;
    box-shadow: var(--rs-shadow);
}
details > summary {
    cursor: pointer; list-style: none;
    padding: 13px 18px;
    font-size: 14.5px; font-weight: 600;
    color: var(--rs-ink);
    background: linear-gradient(135deg, #f8fafc, #f1f5f9);
    border-bottom: 1px solid transparent;
    transition: background .2s;
}
details > summary::-webkit-details-marker { display: none; }
details > summary::after {
    content: "▾"; float: right; color: var(--rs-accent);
    transition: transform .25s;
}
details[open] > summary { border-bottom-color: var(--rs-line); }
details[open] > summary::after { transform: rotate(180deg); }
details > summary:hover { background: var(--rs-accent-soft); }


/* ---- 角色面板基础样式 ---- */
panel { 
    display: block; 
    padding: 16px 18px; 
    background: rgba(128, 128, 128, 0.05); /* 加一点极淡的背景色区分区块 */
    border-radius: 8px;
    margin-top: 8px;
}

ptitle {
    display: block; 
    font-size: 16px; 
    font-weight: 700;
    color: var(--rs-accent); 
    padding-bottom: 8px;
    border-bottom: 2px solid var(--rs-accent-soft);
    margin-bottom: 12px;
}

prow {
    display: flex; 
    gap: 12px; 
    padding: 7px 0;
    border-bottom: 1px dashed var(--rs-line);
    font-size: 14px; 
    line-height: 1.6;
}

prow:last-child { 
    border-bottom: none; 
}

/* 注意：修复了你原本代码里的 > 语法错误 */
prow > label {
    flex: 0 0 78px; 
    color: var(--rs-sub);
    font-weight: 600; 
    font-size: 13px;
}

prow > value { 
    flex: 1; 
    color: var(--rs-ink); 
}


/* === 性器官状态 === */
psection {
  display: block;
  margin-top: 16px;
  padding: 12px;
  background: rgba(255, 182, 193, 0.08);
  border-radius: 8px;
  border: 1px dashed rgba(255, 105, 180, 0.3);
}
stitle {
  display: block;
  font-size: 1em;
  font-weight: 700;
  color: #ff69b4;
  margin-bottom: 10px;
}
sitem {
  display: flex;
  margin: 6px 0;
  font-size: 0.9em;
}
slabel {
  min-width: 70px;
  color: #ff1493;
  font-weight: 600;
  flex-shrink: 0;
}
svalue {
  color: #555;
  flex: 1;
}
svalue i {
  display: block;
  margin-top: 4px;
  font-size: 0.85em;
  color: #ff69b4;
  opacity: 0.8;
}

/* ---- 小剧场 code ---- */
.theater pre,
.theater pre code,
details pre,
details pre code {
    background: #2b3440;
    color: #cbd5e1;
    border-radius: 10px;
    padding: 14px 16px;
    margin: 0;
    font-size: 13px;
    line-height: 1.7;
    font-family: "JetBrains Mono", "Cascadia Code", Consolas, monospace;
    overflow-x: auto;
    white-space: pre-wrap;      /* 自动换行，不横向溢出 */
    word-break: break-word;
}

/* ---- 记忆回廊表格 ---- */
mtitle {
    display: block; text-align: center;
    font-size: 14px; font-weight: 700;
    color: var(--rs-accent); margin: 14px 0 8px;
}
details table {
    width: 100%; border-collapse: collapse;
    font-size: 12.5px; margin: 4px 0;
}
details table th {
    background: var(--rs-accent-soft); color: var(--rs-ink);
    padding: 8px 6px; font-weight: 700;
    border: 1px solid var(--rs-line);
}
details table td {
    padding: 7px 6px; color: var(--rs-ink);
    border: 1px solid var(--rs-line); line-height: 1.5;
}
details table tr:nth-child(even) td { background: #fafcfe; }
details hr {
    border: none; border-top: 1px dashed var(--rs-line);
    margin: 14px 0;
}

/* ---- 行动选项 ---- */
options {
    display: block;
    background: linear-gradient(135deg, #f8fafc, #eef3f8);
    border: 1px solid var(--rs-line);
    border-radius: var(--rs-radius);
    padding: 16px 18px; margin: 12px 0;
    box-shadow: var(--rs-shadow);
}
otitle {
    display: block; font-size: 14.5px; font-weight: 700;
    color: var(--rs-accent); margin-bottom: 10px;
}
opt {
    display: block; padding: 11px 14px; margin: 7px 0;
    background: var(--rs-card); border: 1px solid var(--rs-line);
    border-radius: 10px; font-size: 14px; color: var(--rs-ink);
    cursor: pointer; transition: all .18s;
}
opt:hover {
    border-color: var(--rs-accent);
    background: var(--rs-accent-soft);
    transform: translateX(3px);
}

/* ============================================
   手机聊天面板（沿用前版，背景图 + 无头像）
   ============================================ */
.wx-phone {
    max-width: 330px; margin: 10px auto;
    border-radius: 38px; overflow: hidden; position: relative;
    background:
        linear-gradient(rgba(0,0,0,0.04), rgba(0,0,0,0.10)),
        url("https://img.remit.ee/api/file/BQACAgUAAyEGAASHRsPbAAEV1RRqN_J84UYi5HxDuybJX5MrF9hqLwACdCIAAqOTwVWhhmomUn1JtDwE.png") center/cover no-repeat;
    border: 1px solid rgba(0,0,0,0.10);
    box-shadow: 0 10px 34px rgba(0,0,0,0.25);
    font-family: system-ui, -apple-system, "PingFang SC", sans-serif;
}
.wx-notch { width: 120px; height: 24px; background: #000; border-radius: 0 0 16px 16px; margin: 0 auto; }
.wx-statusbar {
    display: flex; justify-content: space-between; align-items: center;
    padding: 6px 18px 2px; font-size: 12px; font-weight: 600;
    color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,0.4);
}
.wx-navbar {
    display: flex; justify-content: space-between; align-items: center;
    padding: 10px 16px; background: rgba(237,237,237,0.55);
    backdrop-filter: blur(8px);
    border-bottom: 1px solid rgba(0,0,0,0.06);
    font-size: 16px; color: #111;
}
.wx-navbar .wx-title { font-weight: 600; }
.wx-navbar .wx-back, .wx-navbar .wx-more { font-size: 20px; opacity: 0.8; }
.wx-chat {
    padding: 16px 12px 22px; display: flex; flex-direction: column;
    gap: 12px; min-height: 200px;
}
.wx-ts {
    align-self: center; font-size: 11px; color: #fff;
    background: rgba(0,0,0,0.30); padding: 2px 8px; border-radius: 6px;
}
.wx-row { display: flex; }
.wx-them { justify-content: flex-start; }
.wx-me { justify-content: flex-end; }
.wx-bubble {
    max-width: 72%; padding: 9px 13px; border-radius: 8px;
    font-size: 14.5px; line-height: 1.55; word-break: break-word;
    position: relative; box-shadow: 0 1px 2px rgba(0,0,0,0.10);
}
.wx-b-them { background: #ffffff; color: #1a1a1a; }
.wx-b-them::before {
    content: ""; position: absolute; left: -5px; top: 13px;
    border: 5px solid transparent; border-right-color: #ffffff;
}
.wx-b-me { background: #95EC69; color: #1a1a1a; }
.wx-b-me::before {
    content: ""; position: absolute; right: -5px; top: 13px;
    border: 5px solid transparent; border-left-color: #95EC69;
}

/* ---- 移动端 ---- */
@media (max-width: 480px) {
    text { padding: 16px; font-size: 15px; }
    prow { flex-direction: column; gap: 2px; }
    prow > label { flex: none; }
    .wx-phone { max-width: 100%; border-radius: 28px; }
    details table { font-size: 11.5px; }
}