/* =========================================
   Stranger Things x D&D 1980s RPG Style
   (Ultimate Edition with 6-Core Stats)
   ========================================= */

/* 1. 隐藏顶部的颜色装饰条 */
[class*="bg-[#F1CBCB]"], 
[class*="bg-[#c9e1e9]"] {
    display: none !important;
}

/* 2. 统一聊天框主体：复古羊皮纸与D&D微型网格 */
.bg-gray-100\/90.relative.inline-block {
    background-color: #f4ebd0 !important; /* 泛黄老旧纸张底色 */
    background-image: 
        linear-gradient(90deg, rgba(139, 0, 0, 0.08) 1px, transparent 1px),
        linear-gradient(rgba(139, 0, 0, 0.08) 1px, transparent 1px) !important;
    background-size: 20px 20px !important; /* 跑团地图网格 */
    border: 3px solid #1a1a1a !important;
    border-radius: 2px !important;
    box-shadow: 6px 6px 0px rgba(26, 26, 26, 0.9) !important; /* 80年代硬阴影 */
    padding: 20px !important;
}

/* 3. 核心文本排版：打字机字体与绝对高对比度 */
.markdown-body {
    color: #1a1a1a !important; 
    font-family: 'Courier New', Courier, monospace !important; /* 80年代打字机感 */
    font-size: 15px !important;
    line-height: 1.65 !important;
}
.markdown-body p {
    margin-bottom: 14px !important;
    text-align: justify !important;
}
.markdown-body strong {
    color: #a31515 !important; /* 怪奇物语暗红强调色 */
    font-weight: 900 !important;
}

/* 列表样式优化（针对天赋、物品清单） */
.markdown-body ul {
    list-style-type: none !important;
    padding-left: 24px !important;
    margin-bottom: 14px !important;
}
.markdown-body ul li {
    position: relative !important;
    margin-bottom: 8px !important;
}
.markdown-body ul li::before {
    content: "►" !important; 
    color: #ff003c !important; 
    position: absolute !important;
    left: -20px !important;
    top: 2px !important;
    font-size: 12px !important;
}

/* 4. Current Situation 专属美化 (DM绝密档案卡) */
.markdown-body details:first-of-type {
    background: #fff9e6 !important;
    border: 2px dashed #a31515 !important; 
    box-shadow: inset 0 0 15px rgba(0,0,0,0.05), 3px 3px 0px rgba(163, 21, 21, 0.3) !important;
    margin-bottom: 24px !important;
    border-radius: 0 !important;
}
.markdown-body details:first-of-type summary {
    background: #a31515 !important;
    color: #f4ebd0 !important;
    font-size: 1.1em !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    text-align: center !important;
    padding: 6px !important;
    pointer-events: none !important; 
    list-style: none !important;
    letter-spacing: 2px !important;
}
.markdown-body details:first-of-type summary::-webkit-details-marker {
    display: none !important;
}
.markdown-body details:first-of-type > *:not(summary) {
    padding: 15px !important;
    background-image: repeating-linear-gradient(transparent, transparent 29px, rgba(0,0,0,0.1) 29px, rgba(0,0,0,0.1) 30px) !important; 
    line-height: 30px !important;
}

/* 5. 其他板块折叠按钮：D&D 属性手册风格 */
.markdown-body details:not(:first-of-type) {
    background: rgba(255, 255, 255, 0.6) !important;
    border: 2px solid #1a1a1a !important;
    margin-bottom: 14px !important;
    box-shadow: 4px 4px 0px #1a1a1a !important;
    transition: all 0.2s ease !important;
}
.markdown-body details:not(:first-of-type) summary {
    background: #1a1a1a !important;
    color: #f4ebd0 !important;
    padding: 10px 15px !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    list-style: none !important;
    position: relative !important;
}
.markdown-body details:not(:first-of-type) summary:hover {
    background: #a31515 !important;
    color: #fff !important;
}
.markdown-body details:not(:first-of-type) summary::-webkit-details-marker {
    display: none !important;
}
.markdown-body details:not(:first-of-type) summary::after {
    content: '[ + ]' !important;
    position: absolute !important;
    right: 15px !important;
    color: #ff003c !important; 
}
.markdown-body details[open]:not(:first-of-type) summary::after {
    content: '[ - ]' !important;
}
.markdown-body details:not(:first-of-type) > *:not(summary) {
    padding: 15px !important;
    border-top: 2px solid #1a1a1a !important;
}

/* 6. 表格美化 (记忆回溯) */
.markdown-body table {
    border-collapse: collapse !important;
    width: 100% !important;
    border: 2px solid #1a1a1a !important;
    margin-top: 10px !important;
    margin-bottom: 10px !important;
    background: #fff !important;
}
.markdown-body th {
    background: #1a1a1a !important;
    color: #f4ebd0 !important;
    border: 1px solid #1a1a1a !important;
    padding: 8px !important;
    text-transform: uppercase !important;
}
.markdown-body td {
    border: 1px solid #1a1a1a !important;
    padding: 8px !important;
}

/* 7. 底部附加元素：80年代街机/科幻操作台按钮 */
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary {
    background: #1a1a1a !important;
    color: #ff003c !important;
    border: 1px solid #ff003c !important;
    border-radius: 0px !important;
    font-family: 'Courier New', Courier, monospace !important;
    font-weight: bold !important;
    margin: 4px !important;
    padding: 4px 12px !important;
    box-shadow: 2px 2px 0px #ff003c !important;
    text-transform: uppercase !important;
    transition: all 0.1s ease !important;
}
.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary:hover {
    background: #ff003c !important;
    color: #1a1a1a !important;
    box-shadow: 0px 0px 0px #ff003c !important;
    transform: translate(2px, 2px) !important;
}

.MuiTypography-root.MuiTypography-body2.css-6c0gf2,
.text-orange-500 {
    color: #1a1a1a !important;
    background: rgba(255, 255, 255, 0.5) !important;
    padding: 2px 6px !important;
    border: 1px dashed #1a1a1a !important;
    font-family: 'Courier New', Courier, monospace !important;
    font-weight: bold !important;
}

/* =========================================
   8. 专属加载动画：掷 D20 骰子 (SMIL SVG)
   ========================================= */
.style-module__AtdJSq__dot-flashing.style-module__AtdJSq__text {
    display: none !important;
}
.flex.items-center.justify-center.w-6.h-5 {
    position: relative !important;
    width: 30px !important;
    height: 30px !important;
}
.flex.items-center.justify-center.w-6.h-5::before {
    content: "" !important;
    position: absolute !important;
    top: -15px !important;
    left: -15px !important;
    width: 50px !important;
    height: 50px !important;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><g><animateTransform attributeName="transform" type="translate" values="0,0; 0,-15; 0,0" dur="0.7s" repeatCount="indefinite" additive="sum"/><animateTransform attributeName="transform" type="rotate" values="0 50 50; 360 50 50" dur="1.4s" repeatCount="indefinite" additive="sum"/><g stroke="%23ff003c" stroke-width="4" fill="%231a1a1a" stroke-linejoin="round"><polygon points="50,5 95,25 95,75 50,95 5,75 5,25" /><polygon points="50,5 25,45 75,45" /><polygon points="25,45 50,95 75,45" /><line x1="5" y1="25" x2="25" y2="45" /><line x1="95" y1="25" x2="75" y2="45" /><line x1="5" y1="75" x2="25" y2="45" /><line x1="95" y1="75" x2="75" y2="45" /><text x="50" y="62" fill="%23ff003c" font-size="24" font-family="Courier New, monospace" font-weight="bold" text-anchor="middle" stroke="none">20</text></g></g></svg>') no-repeat center center !important;
    background-size: contain !important;
    z-index: 10 !important;
}

/* 移动端适配 */
@media (max-width: 480px) {
    .bg-gray-100\/90.relative.inline-block {
        padding: 15px !important;
        box-shadow: 4px 4px 0px rgba(26, 26, 26, 0.9) !important;
    }
    .markdown-body blockquote {
        font-size: 14px !important;
        padding: 10px 5px !important;
    }
}
think { display: none; }
/* ==========================================
   黑板与粉笔字风格代码块美化 (全局接管)
   ========================================== */

/* 1. 为代码块整体主容器添加木质边框与阴影 */
.markdown-body pre > div {
    border: 8px solid #4a2f1d !important; /* 深色实木边框 */
    border-radius: 6px !important;
    box-shadow: 3px 5px 15px rgba(0, 0, 0, 0.4) !important;
    background-color: #173324 !important; /* 统一底色以防穿透 */
}

/* 2. 头部栏 - 伪装成木质边框的顶部内嵌 */
.markdown-body pre > div > div.flex.justify-between.h-8,
.markdown-body pre > div > div.border-b {
    background-color: #4a2f1d !important;
    border-bottom: 2px solid #2d1c11 !important;
}

/* 3. 头部栏文本(语言标签) - 浅木色粉笔字 */
.markdown-body pre > div > div.flex.justify-between > div.text-\[13px\] {
    color: #d4ba94 !important;
    font-family: 'Chalkboard SE', 'Comic Sans MS', cursive !important;
    font-weight: bold !important;
    letter-spacing: 1px !important;
}

/* 4. 复制按钮图标颜色联动 (SVG颜色继承适配) */
.markdown-body pre svg.lucide-copy,
.markdown-body pre div[data-tooltip-id^="copy-tooltip"] > svg {
    color: #d4ba94 !important;
}
.markdown-body pre .group:hover svg.lucide-copy,
.markdown-body pre div[data-tooltip-id^="copy-tooltip"]:hover > svg {
    color: #ffffff !important;
    filter: drop-shadow(0px 0px 3px rgba(255,255,255,0.8)) !important;
}

/* 5. 代码内容区 - 深绿色黑板背景与SVG粉笔灰噪点滤镜 */
.markdown-body pre > div > div[node] {
    background-color: #173324 !important; /* 经典黑板绿 */
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.15'/%3E%3C/svg%3E") !important;
    padding: 1.5rem !important;
}

/* 6. 代码字体 - 强制使用手写体 */
.markdown-body pre code,
.markdown-body pre > code[node] {
    font-family: 'Chalkboard SE', 'Comic Sans MS', 'Comic Neue', cursive !important;
    font-size: 15px !important;
    line-height: 1.8 !important;
    letter-spacing: 0.5px !important;
}

/* 7. 语法高亮覆盖 - 统一渲染为粉笔白，带有粉笔粉末晕开的阴影特效 */
.markdown-body pre code[class^="language-"] > span,
.markdown-body pre > div > div[node] > code > span,
.markdown-body pre > code[node] {
    color: #f4f5f0 !important; 
    text-shadow: 0px 0px 2px rgba(255, 255, 255, 0.4), 0px 0px 5px rgba(255, 255, 255, 0.15) !important;
}

/* ==========================================
   兼容您提供的原生 HTML 节点类名直出渲染
   ========================================== */
.markdown-body .blackboard {
    background-color: #173324;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.15'/%3E%3C/svg%3E");
    border: 8px solid #4a2f1d;
    border-radius: 6px;
    padding: 1.5rem;
    box-shadow: 3px 5px 15px rgba(0, 0, 0, 0.4);
    margin: 1em 0;
}

.markdown-body .chalk-text {
    font-family: 'Chalkboard SE', 'Comic Sans MS', 'Comic Neue', cursive;
    color: #f4f5f0;
    text-shadow: 0px 0px 2px rgba(255, 255, 255, 0.4), 0px 0px 5px rgba(255, 255, 255, 0.15);
    font-size: 1.1em;
    line-height: 1.8;
    margin: 8px 0;
    letter-spacing: 0.5px;
}
/* 字母墙彩灯闪烁特效 */
.stranger-wall {
    background-color: #2b2b2b; /* 模拟暗处的墙纸背景 */
    padding: 15px;
    border-radius: 5px;
    text-align: center;
    font-family: 'Courier New', Courier, monospace;
    letter-spacing: 10px; /* 字母之间的间距 */
}
.bulb {
    font-size: 24px;
    font-weight: bold;
    animation: blink 0.8s infinite alternate; /* 闪烁动画 */
}
.red { color: #ff4d4d; text-shadow: 0 0 10px #ff4d4d; }
.green { color: #4dff4d; text-shadow: 0 0 10px #4dff4d; }
.blue { color: #4da6ff; text-shadow: 0 0 10px #4da6ff; }

@keyframes blink {
    0% { opacity: 0.3; text-shadow: none; }
    100% { opacity: 1; }
}