@import url("https://fonts.googleapis.com/css2?family=DotGothic16&family=Press+Start+2P&family=Share+Tech+Mono&display=swap");

/* 顶部色带隐藏 */
[class*="bg-[#F1CBCB]"],
[class*="bg-[#c9e1e9]"] {
    display: none !important;
}

/* 主聊天气泡 */

.bg-gray-100\/90.relative.inline-block {
    position: relative !important;
    isolation: isolate !important;
    overflow: hidden !important;
    background: linear-gradient(135deg, rgba(0, 240, 255, 0.08) 0%, rgba(180, 0, 255, 0.07) 48%, rgba(255, 42, 75, 0.05) 100%),
        radial-gradient(circle at 18% 8%, rgba(0, 240, 255, 0.12), transparent 34%),
        radial-gradient(circle at 88% 88%, rgba(180, 0, 255, 0.13), transparent 38%),
        #0A0F1A !important;
    color: #FFFFFF !important;
    border-radius: 0 !important;
    border: 2px solid #00F0FF !important;
    box-shadow: 0 0 0 2px #25003D,
        0 0 0 4px rgba(180, 0, 255, 0.72),
        0 0 18px rgba(0, 240, 255, 0.52),
        0 0 34px rgba(180, 0, 255, 0.34),
        inset 0 0 0 2px rgba(255, 255, 255, 0.08),
        inset 0 0 28px rgba(0, 240, 255, 0.08) !important;
    padding: 16px 18px 18px 18px !important;
    margin-top: 10px !important;
    margin-bottom: 16px !important;
    clip-path: polygon(
        0 0,
        calc(100% - 16px) 0,
        100% 16px,
        100% 100%,
        16px 100%,
        16px calc(100% - 8px),
        0 calc(100% - 8px)
    ) !important;
    image-rendering: pixelated !important;
}

.bg-gray-100\/90.relative.inline-block::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    opacity: 0.42 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='180' viewBox='0 0 260 180'%3E%3Crect width='260' height='180' fill='none'/%3E%3Cg opacity='.24' font-family='monospace' font-size='8'%3E%3Ctext x='8' y='-20' fill='%2300F0FF'%3E0101 ♜ 1100 0011%3Canimate attributeName='y' values='-20;200' dur='3.2s' repeatCount='indefinite'/%3E%3C/text%3E%3Ctext x='76' y='-80' fill='%23B400FF'%3E11 ♞ 0001 1010%3Canimate attributeName='y' values='-80;200' dur='4.1s' repeatCount='indefinite'/%3E%3C/text%3E%3Ctext x='148' y='-44' fill='%23FFD700'%3E♛ 1011 00 111%3Canimate attributeName='y' values='-44;200' dur='3.7s' repeatCount='indefinite'/%3E%3C/text%3E%3Ctext x='212' y='-120' fill='%23FF2A4B'%3EVOID 99%3Canimate attributeName='y' values='-120;200' dur='4.8s' repeatCount='indefinite'/%3E%3C/text%3E%3C/g%3E%3Cg opacity='.18'%3E%3Crect y='0' width='260' height='1' fill='%23FFFFFF'/%3E%3Crect y='4' width='260' height='1' fill='%2300F0FF'/%3E%3Crect y='8' width='260' height='1' fill='%23FFFFFF'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0 0;0 8;0 0' dur='1.1s' repeatCount='indefinite'/%3E%3C/g%3E%3C/svg%3E") !important;
    background-size: 260px 180px !important;
    background-repeat: repeat !important;
}

.bg-gray-100\/90.relative.inline-block::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    opacity: 0.30 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='104' height='104' viewBox='0 0 104 104'%3E%3Crect width='104' height='104' fill='none'/%3E%3Cg opacity='.36'%3E%3Crect x='2' y='6' width='2' height='2' fill='%23fff'/%3E%3Crect x='22' y='18' width='2' height='2' fill='%2300F0FF'/%3E%3Crect x='54' y='10' width='3' height='2' fill='%23B400FF'/%3E%3Crect x='82' y='34' width='2' height='2' fill='%23FFD700'/%3E%3Crect x='12' y='70' width='3' height='2' fill='%23FF2A4B'/%3E%3Crect x='64' y='82' width='2' height='2' fill='%23fff'/%3E%3Crect x='88' y='88' width='6' height='2' fill='%2300F0FF'/%3E%3Canimate attributeName='opacity' values='.16;.5;.22;.44;.16' dur='1.05s' repeatCount='indefinite'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0 0;2 0;-2 1;0 0' dur='.62s' repeatCount='indefinite'/%3E%3C/g%3E%3C/svg%3E") !important;
    background-size: 104px 104px !important;
    mix-blend-mode: screen !important;
}

.bg-gray-100\/90.relative.inline-block:not(.chat-answer-container .bg-gray-100\/90) {
    border-color: #FF2A4B !important;
    box-shadow: 0 0 0 2px #3A0010,
        0 0 0 4px rgba(255, 215, 0, 0.62),
        0 0 18px rgba(255, 42, 75, 0.42),
        0 0 30px rgba(255, 215, 0, 0.24),
        inset 0 0 24px rgba(255, 42, 75, 0.08) !important;
}

/* 主文本 */

.markdown-body {
    position: relative !important;
    z-index: 1 !important;
    background: transparent !important;
    color: #FFFFFF !important;
    font-family: "DotGothic16",
        "Share Tech Mono",
        "Cascadia Mono",
        "Consolas",
        "Menlo",
        "Microsoft YaHei",
        monospace !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
    letter-spacing: 0.018em !important;
    font-weight: 500 !important;
    text-rendering: geometricPrecision !important;
}

.markdown-body p {
    color: #FFFFFF !important;
    margin-top: 0.7em !important;
    margin-bottom: 0.7em !important;
}

.markdown-body strong,
.markdown-body b {
    color: #FFD700 !important;
    font-weight: 900 !important;
}

.markdown-body em {
    color: #00F0FF !important;
    font-style: normal !important;
    font-weight: 700 !important;
}

.markdown-body hr {
    height: 10px !important;
    border: 0 !important;
    margin: 18px 0 !important;
    background: linear-gradient(90deg, transparent 0%, #00F0FF 8%, #B400FF 42%, #FF2A4B 70%, #FFD700 92%, transparent 100%) !important;
    clip-path: polygon(
        0 45%,
        8% 45%,
        8% 25%,
        14% 25%,
        14% 65%,
        78% 65%,
        78% 35%,
        86% 35%,
        86% 55%,
        100% 55%,
        100% 75%,
        0 75%
    ) !important;
    box-shadow: 0 0 10px rgba(0, 240, 255, 0.55),
        0 0 18px rgba(180, 0, 255, 0.36) !important;
}

.markdown-body h1,
.markdown-body h2,
.markdown-body h3,
.markdown-body h4 {
    position: relative !important;
    color: #00F0FF !important;
    font-family: "Press Start 2P",
        "DotGothic16",
        "Cascadia Mono",
        "Microsoft YaHei",
        monospace !important;
    font-weight: 800 !important;
    font-size: 1em !important;
    line-height: 1.65 !important;
    border-bottom: 2px solid rgba(0, 240, 255, 0.55) !important;
    padding: 8px 10px !important;
    margin-top: 1em !important;
    margin-bottom: 0.75em !important;
    background: linear-gradient(90deg, rgba(0, 240, 255, 0.14), rgba(180, 0, 255, 0.08), transparent) !important;
    clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%) !important;
}

.markdown-body h1::before,
.markdown-body h2::before,
.markdown-body h3::before,
.markdown-body h4::before {
    content: "▶ " !important;
    color: #FFD700 !important;
}

/* 链接 */

.markdown-body a {
    color: #00F0FF !important;
    background: linear-gradient(90deg, rgba(0, 240, 255, 0.08), rgba(180, 0, 255, 0.12)) !important;
    border: 1px dashed #6C22A8 !important;
    border-radius: 0 !important;
    padding: 1px 6px !important;
    margin: 0 2px !important;
    text-decoration: none !important;
    font-weight: 800 !important;
    transition: color 80ms steps(2, end),
        border-color 80ms steps(2, end),
        background-color 80ms steps(2, end),
        transform 80ms steps(2, end) !important;
}

.markdown-body a::after {
    content: " [LINK ]" !important;
    color: #FFD700 !important;
    font-size: 0.78em !important;
    font-weight: 900 !important;
}

.markdown-body a:hover,
.markdown-body a:focus {
    color: #FFFFFF !important;
    border-color: #FFD700 !important;
    background: linear-gradient(45deg, rgba(255, 255, 255, 0.10) 25%, transparent 25%, transparent 75%, rgba(255, 255, 255, 0.10) 75%),
        linear-gradient(45deg, rgba(255, 215, 0, 0.18) 25%, transparent 25%, transparent 75%, rgba(255, 215, 0, 0.18) 75%),
        #16111F !important;
    background-size: 10px 10px !important;
    background-position: 0 0, 5px 5px !important;
    transform: translate(1px, -1px) !important;
}

/* 代码块 / 引用 / 表格 */

.markdown-body code {
    color: #00FF41 !important;
    background: #08130E !important;
    border: 1px solid rgba(0, 255, 65, 0.55) !important;
    border-radius: 0 !important;
    padding: 2px 5px !important;
    font-family: "Share Tech Mono", "Cascadia Mono", "Consolas", monospace !important;
}

.markdown-body pre {
    color: #EAFDFF !important;
    background: linear-gradient(90deg, rgba(0, 240, 255, 0.08), transparent 18%, transparent 82%, rgba(180, 0, 255, 0.08)),
        #050914 !important;
    border: 2px solid #173D55 !important;
    border-radius: 0 !important;
    box-shadow: inset 0 0 0 2px rgba(0, 240, 255, 0.12),
        0 0 16px rgba(0, 240, 255, 0.16) !important;
}

.markdown-body blockquote {
    color: #F0F0F0 !important;
    background: rgba(255, 42, 75, 0.08) !important;
    border-left: 6px solid #FF2A4B !important;
    border-radius: 0 !important;
    padding: 10px 14px !important;
    box-shadow: inset 0 0 0 1px rgba(255, 215, 0, 0.2) !important;
}

.markdown-body table {
    width: 100% !important;
    border-collapse: collapse !important;
    background: #070C16 !important;
    color: #FFFFFF !important;
    border: 2px solid #00F0FF !important;
    margin: 10px 0 !important;
    box-shadow: 0 0 12px rgba(0, 240, 255, 0.18),
        inset 0 0 0 1px rgba(180, 0, 255, 0.18) !important;
}

.markdown-body th {
    color: #FFD700 !important;
    background: rgba(180, 0, 255, 0.22) !important;
    border: 1px solid rgba(0, 240, 255, 0.55) !important;
    font-weight: 900 !important;
    padding: 8px !important;
}

.markdown-body td {
    color: #FFFFFF !important;
    border: 1px solid rgba(0, 240, 255, 0.32) !important;
    padding: 8px !important;
}

.markdown-body tr:nth-child(even) {
    background: rgba(0, 240, 255, 0.05) !important;
}

/* 游戏状态栏 */

.markdown-body .oreshura-board {
    position: relative !important;
    z-index: 1 !important;
    overflow: hidden !important;
    margin: 16px 0 18px 0 !important;
    padding: 14px !important;
    color: #FFFFFF !important;
    background: linear-gradient(135deg, rgba(0, 240, 255, 0.12), rgba(180, 0, 255, 0.10) 48%, rgba(255, 42, 75, 0.08)),
        #060A14 !important;
    border: 2px solid #00F0FF !important;
    border-radius: 0 !important;
    box-shadow: 0 0 0 2px rgba(180, 0, 255, 0.74),
        0 0 18px rgba(0, 240, 255, 0.42),
        0 0 34px rgba(180, 0, 255, 0.22),
        inset 0 0 0 2px rgba(255, 255, 255, 0.06),
        inset 0 0 28px rgba(0, 240, 255, 0.07) !important;
    clip-path: polygon(
        0 10px,
        10px 10px,
        10px 0,
        calc(100% - 18px) 0,
        100% 18px,
        100% calc(100% - 10px),
        calc(100% - 10px) calc(100% - 10px),
        calc(100% - 10px) 100%,
        18px 100%,
        0 calc(100% - 18px)
    ) !important;
}

.markdown-body .oreshura-board::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    opacity: 0.26 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='120' viewBox='0 0 220 120'%3E%3Crect width='220' height='120' fill='none'/%3E%3Cg opacity='.22'%3E%3Crect x='0' y='0' width='12' height='12' fill='%2300F0FF'/%3E%3Crect x='12' y='12' width='12' height='12' fill='%23B400FF'/%3E%3Crect x='24' y='0' width='12' height='12' fill='%2300F0FF'/%3E%3Crect x='36' y='12' width='12' height='12' fill='%23B400FF'/%3E%3CanimateTransform attributeName='transform' type='translate' values='0 0;24 0;0 0' dur='2.4s' repeatCount='indefinite'/%3E%3C/g%3E%3Cg font-family='monospace' font-size='7' opacity='.28'%3E%3Ctext x='12' y='-10' fill='%23FFD700'%3EDEPTH LV.99 // TEN COVENANTS%3Canimate attributeName='y' values='-10;136' dur='5s' repeatCount='indefinite'/%3E%3C/text%3E%3Ctext x='80' y='-60' fill='%2300F0FF'%3E空白 // STRATEGY TERMINAL%3Canimate attributeName='y' values='-60;136' dur='4.2s' repeatCount='indefinite'/%3E%3C/text%3E%3C/g%3E%3C/svg%3E") !important;
    background-size: 220px 120px !important;
    background-repeat: repeat !important;
}

.markdown-body .oreshura-board::after {
    content: "READY PLAYER { }" !important;
    position: absolute !important;
    right: 10px !important;
    bottom: 6px !important;
    z-index: 0 !important;
    color: rgba(255, 215, 0, 0.25) !important;
    font-family: "Press Start 2P", "Share Tech Mono", monospace !important;
    font-size: 9px !important;
    letter-spacing: 0.06em !important;
    pointer-events: none !important;
}

.markdown-body .hud-title {
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    margin: 0 0 12px 0 !important;
    padding: 9px 10px !important;
    color: #FFFFFF !important;
    background: linear-gradient(90deg, rgba(0, 240, 255, 0.24), rgba(180, 0, 255, 0.18), rgba(255, 42, 75, 0.12)) !important;
    border: 1px solid rgba(0, 240, 255, 0.64) !important;
    font-family: "Press Start 2P", "DotGothic16", "Microsoft YaHei", monospace !important;
    font-size: 0.78em !important;
    line-height: 1.6 !important;
    font-weight: 900 !important;
}

.markdown-body .hud-title::before {
    content: "◆" !important;
    color: #FFD700 !important;
    margin-right: 6px !important;
}

.markdown-body .hud-title::after {
    content: "LV.999" !important;
    color: #00FF41 !important;
    font-family: "Share Tech Mono", "Consolas", monospace !important;
    font-size: 0.92em !important;
    margin-left: auto !important;
}

.markdown-body .hud-grid {
    position: relative !important;
    z-index: 1 !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 10px !important;
}

.markdown-body .hud-card {
    position: relative !important;
    overflow: hidden !important;
    min-height: 70px !important;
    padding: 10px !important;
    color: #FFFFFF !important;
    background: linear-gradient(180deg, rgba(4, 9, 20, 0.94), rgba(11, 16, 32, 0.94)) !important;
    border: 1px solid rgba(0, 240, 255, 0.50) !important;
    border-radius: 0 !important;
    box-shadow: inset 0 0 0 1px rgba(180, 0, 255, 0.24),
        0 0 10px rgba(0, 240, 255, 0.14) !important;
}

.markdown-body .hud-card::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 18px !important;
    height: 18px !important;
    border-top: 3px solid #FFD700 !important;
    border-left: 3px solid #FFD700 !important;
    opacity: 0.86 !important;
}

.markdown-body .hud-card::after {
    content: "" !important;
    position: absolute !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 18px !important;
    height: 18px !important;
    border-right: 3px solid #FF2A4B !important;
    border-bottom: 3px solid #FF2A4B !important;
    opacity: 0.86 !important;
}

.markdown-body .hud-label {
    display: block !important;
    color: #00F0FF !important;
    font-family: "Share Tech Mono", "DotGothic16", monospace !important;
    font-size: 0.78em !important;
    font-weight: 900 !important;
    letter-spacing: 0.06em !important;
    margin-bottom: 6px !important;
}

.markdown-body .hud-value {
    display: block !important;
    color: #FFFFFF !important;
    font-family: "DotGothic16", "Microsoft YaHei", monospace !important;
    font-size: 1em !important;
    font-weight: 800 !important;
    line-height: 1.55 !important;
}

.markdown-body .hud-chip-row {
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 7px !important;
    margin-top: 12px !important;
}

.markdown-body .hud-chip {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 24px !important;
    padding: 3px 8px !important;
    color: #FFFFFF !important;
    background: linear-gradient(90deg, rgba(0, 240, 255, 0.14), rgba(180, 0, 255, 0.16)) !important;
    border: 1px solid rgba(0, 240, 255, 0.50) !important;
    border-radius: 0 !important;
    font-family: "Share Tech Mono", "DotGothic16", monospace !important;
    font-size: 0.82em !important;
    font-weight: 900 !important;
    letter-spacing: 0.03em !important;
    box-shadow: inset 2px 2px 0 rgba(255, 255, 255, 0.16),
        inset -2px -2px 0 rgba(0, 0, 0, 0.42) !important;
}

.markdown-body .hud-chip.gold {
    color: #120A00 !important;
    background: #FFD700 !important;
    border-color: #FFFFFF !important;
}

.markdown-body .hud-chip.red {
    color: #FFFFFF !important;
    background: #FF2A4B !important;
    border-color: #FFD700 !important;
}

.markdown-body .hud-chip.green {
    color: #001707 !important;
    background: #00FF41 !important;
    border-color: #FFFFFF !important;
}

.markdown-body .hud-chip.purple {
    color: #FFFFFF !important;
    background: #6E00C8 !important;
    border-color: #B400FF !important;
}

.markdown-body .hud-meter {
    position: relative !important;
    z-index: 1 !important;
    height: 14px !important;
    margin-top: 7px !important;
    overflow: hidden !important;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.01)),
        #050914 !important;
    border: 1px solid rgba(0, 240, 255, 0.55) !important;
    box-shadow: inset 0 0 0 1px rgba(180, 0, 255, 0.16),
        0 0 8px rgba(0, 240, 255, 0.16) !important;
}

.markdown-body .hud-meter > span {
    display: block !important;
    height: 100% !important;
    width: var(--value, 66%) !important;
    background: repeating-linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.34) 0 2px,
            transparent 2px 6px
        ),
        linear-gradient(90deg, #00F0FF, #B400FF) !important;
    box-shadow: 0 0 10px rgba(0, 240, 255, 0.52),
        0 0 14px rgba(180, 0, 255, 0.32) !important;
}

.markdown-body .hud-meter.hp > span {
    background: repeating-linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.34) 0 2px,
            transparent 2px 6px
        ),
        linear-gradient(90deg, #FF2A4B, #FFD700) !important;
}

.markdown-body .hud-meter.mp > span {
    background: repeating-linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.28) 0 2px,
            transparent 2px 6px
        ),
        linear-gradient(90deg, #00F0FF, #005DFF) !important;
}

.markdown-body .hud-meter.sync > span {
    background: repeating-linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.32) 0 2px,
            transparent 2px 6px
        ),
        linear-gradient(90deg, #00FF41, #FFD700) !important;
}

.markdown-body .hud-split {
    position: relative !important;
    z-index: 1 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    margin-top: 12px !important;
}

.markdown-body .hud-log {
    position: relative !important;
    z-index: 1 !important;
    padding: 10px 12px !important;
    color: #EAFDFF !important;
    background: linear-gradient(180deg, rgba(5, 9, 20, 0.94), rgba(7, 12, 26, 0.94)) !important;
    border: 1px solid rgba(0, 240, 255, 0.42) !important;
    box-shadow: inset 0 0 0 1px rgba(180, 0, 255, 0.18),
        0 0 10px rgba(0, 240, 255, 0.12) !important;
    font-family: "Share Tech Mono", "DotGothic16", "Microsoft YaHei", monospace !important;
    font-size: 0.92em !important;
    line-height: 1.65 !important;
}

.markdown-body .hud-log-title {
    display: block !important;
    color: #FFD700 !important;
    font-weight: 900 !important;
    margin-bottom: 6px !important;
    border-bottom: 1px dashed rgba(255, 215, 0, 0.38) !important;
    padding-bottom: 4px !important;
}

.markdown-body .hud-log-title::before {
    content: "▣ " !important;
    color: #00F0FF !important;
}

/* 叙事容器 */

.markdown-body .story-panel {
    position: relative !important;
    z-index: 1 !important;
    margin: 14px 0 !important;
    padding: 14px 15px !important;
    color: #FFFFFF !important;
    background: linear-gradient(180deg, rgba(8, 12, 24, 0.72), rgba(5, 9, 20, 0.72)) !important;
    border-left: 4px solid #00F0FF !important;
    border-right: 4px solid rgba(180, 0, 255, 0.72) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06),
        0 0 12px rgba(0, 240, 255, 0.12) !important;
}

.markdown-body .story-panel::before {
    content: "NARRATIVE STREAM" !important;
    display: block !important;
    color: #FFD700 !important;
    font-family: "Share Tech Mono", "Cascadia Mono", monospace !important;
    font-size: 0.78em !important;
    font-weight: 900 !important;
    letter-spacing: 0.08em !important;
    margin-bottom: 8px !important;
}

/* 档案/角色/关系网络 */

.markdown-body details summary {
    user-select: none !important;
}

.markdown-body details:has(summary) {
    color: #FFFFFF !important;
}

.markdown-body details summary:first-child {
    text-transform: none !important;
}

.markdown-body .profile-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    margin: 12px !important;
}

.markdown-body .profile-item {
    position: relative !important;
    padding: 8px 10px !important;
    color: #FFFFFF !important;
    background: rgba(5, 9, 20, 0.74) !important;
    border: 1px solid rgba(0, 240, 255, 0.30) !important;
    box-shadow: inset 2px 0 0 rgba(0, 240, 255, 0.54),
        inset -2px 0 0 rgba(180, 0, 255, 0.38) !important;
    font-family: "DotGothic16", "Microsoft YaHei", monospace !important;
}

.markdown-body .profile-item b {
    color: #FFD700 !important;
    font-weight: 900 !important;
}

.markdown-body .profile-section-title {
    margin: 14px 12px 8px 12px !important;
    padding: 7px 9px !important;
    color: #FFFFFF !important;
    background: linear-gradient(90deg, rgba(255, 42, 75, 0.24), rgba(180, 0, 255, 0.16), rgba(0, 240, 255, 0.12)) !important;
    border: 1px solid rgba(255, 215, 0, 0.50) !important;
    font-family: "Press Start 2P", "DotGothic16", "Microsoft YaHei", monospace !important;
    font-size: 0.72em !important;
    line-height: 1.7 !important;
    font-weight: 900 !important;
}

.markdown-body .profile-section-title::before {
    content: "◇ " !important;
    color: #FFD700 !important;
}

.markdown-body .relation-map {
    margin: 12px !important;
    padding: 12px !important;
    background: radial-gradient(circle at 20% 20%, rgba(0, 240, 255, 0.12), transparent 32%),
        radial-gradient(circle at 80% 80%, rgba(255, 42, 75, 0.10), transparent 32%),
        #050914 !important;
    border: 1px solid rgba(0, 240, 255, 0.45) !important;
    box-shadow: inset 0 0 0 1px rgba(180, 0, 255, 0.20),
        0 0 12px rgba(0, 240, 255, 0.14) !important;
}

.markdown-body .relation-node {
    display: block !important;
    margin: 7px 0 !important;
    padding: 7px 9px !important;
    color: #FFFFFF !important;
    background: linear-gradient(90deg, rgba(0, 240, 255, 0.10), rgba(180, 0, 255, 0.10)) !important;
    border-left: 4px solid #00F0FF !important;
    border-right: 4px solid #FF2A4B !important;
}

.markdown-body .relation-node b {
    color: #FFD700 !important;
}

.markdown-body cot,
.markdown-body .memory-cot {
    display: block !important;
    margin: 12px !important;
    padding: 9px 10px !important;
    color: #00FF41 !important;
    background: #041008 !important;
    border: 1px solid rgba(0, 255, 65, 0.52) !important;
    font-family: "Share Tech Mono", "Cascadia Mono", monospace !important;
    font-weight: 900 !important;
    letter-spacing: 0.03em !important;
    box-shadow: inset 0 0 0 1px rgba(0, 255, 65, 0.12),
        0 0 10px rgba(0, 255, 65, 0.12) !important;
}

.markdown-body .memory-panel {
    margin: 12px !important;
    padding: 12px !important;
    color: #FFFFFF !important;
    background: linear-gradient(180deg, rgba(5, 9, 20, 0.92), rgba(8, 12, 28, 0.92)) !important;
    border: 1px solid rgba(255, 215, 0, 0.42) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 42, 75, 0.16),
        0 0 12px rgba(255, 215, 0, 0.10) !important;
}

/* 选项按钮 */

.markdown-body .choice-row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin: 14px 0 4px 0 !important;
}

.markdown-body .choice-button,
.markdown-body button,
.markdown-body [role="button"] {
    min-height: 32px !important;
    color: #FFFFFF !important;
    background: #1A1F2E !important;
    border: 2px solid #522A8B !important;
    border-radius: 0 !important;
    padding: 6px 14px !important;
    margin: 4px 6px 4px 0 !important;
    font-family: "Press Start 2P",
        "DotGothic16",
        "Share Tech Mono",
        "Microsoft YaHei",
        monospace !important;
    font-size: 0.76em !important;
    line-height: 1.6 !important;
    font-weight: 900 !important;
    box-shadow: inset 2px 2px 0 rgba(255, 255, 255, 0.75),
        inset -3px -3px 0 rgba(0, 0, 0, 0.65),
        0 0 10px rgba(180, 0, 255, 0.20) !important;
    transition: transform 70ms steps(2, end),
        background-color 70ms steps(2, end),
        border-color 70ms steps(2, end),
        color 70ms steps(2, end) !important;
}

.markdown-body .choice-button:hover,
.markdown-body .choice-button:focus,
.markdown-body button:hover,
.markdown-body button:focus,
.markdown-body [role="button"]:hover,
.markdown-body [role="button"]:focus {
    color: #FFFFFF !important;
    border-color: #FFD700 !important;
    background: linear-gradient(45deg, rgba(0, 240, 255, 0.20) 25%, transparent 25%, transparent 75%, rgba(255, 42, 75, 0.20) 75%),
        #141B2A !important;
    background-size: 8px 8px !important;
    transform: translateY(-1px) !important;
}

.markdown-body .choice-button:active,
.markdown-body button:active,
.markdown-body [role="button"]:active {
    color: #001707 !important;
    background: #00FF41 !important;
    border-color: #00FF41 !important;
    transform: translate(2px, 2px) !important;
    box-shadow: inset -2px -2px 0 rgba(255, 255, 255, 0.55),
        inset 3px 3px 0 rgba(0, 0, 0, 0.75) !important;
}

/* 底部平台元素 */

.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary {
    position: relative !important;
    z-index: 2 !important;
    color: #EAEAEA !important;
    background: rgba(10, 15, 26, 0.78) !important;
    border: 1px solid rgba(0, 240, 255, 0.38) !important;
    border-radius: 0 !important;
    font-family: "Share Tech Mono", "Cascadia Mono", "Microsoft YaHei", monospace !important;
    font-weight: 700 !important;
    transition: color 80ms steps(2, end),
        border-color 80ms steps(2, end),
        background-color 80ms steps(2, end) !important;
}

.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary:hover {
    color: #FFD700 !important;
    background: rgba(0, 240, 255, 0.12) !important;
    border-color: #FFD700 !important;
}

.MuiTypography-root.MuiTypography-body2.css-6c0gf2 {
    position: relative !important;
    z-index: 2 !important;
    color: #EAEAEA !important;
    font-family: "Share Tech Mono", "Cascadia Mono", monospace !important;
    font-size: 12px !important;
    letter-spacing: 0.04em !important;
}

.text-orange-500 {
    position: relative !important;
    z-index: 2 !important;
    color: #FFD700 !important;
    font-family: "Share Tech Mono", "Cascadia Mono", monospace !important;
    font-weight: 900 !important;
}

/* 自定义 Loading */

.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: 176px !important;
    min-width: 176px !important;
    height: 28px !important;
    min-height: 28px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: visible !important;
    margin: 4px auto !important;
}

.flex.items-center.justify-center.w-6.h-5::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    width: 24px !important;
    height: 24px !important;
    transform: translateY(-50%) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Crect x='3' y='3' width='18' height='18' fill='%230A0F1A' stroke='%2300F0FF' stroke-width='2'/%3E%3Crect x='6' y='6' width='3' height='3' fill='%23FFD700'%3E%3Canimate attributeName='opacity' values='1;0;1;1' dur='.8s' repeatCount='indefinite'/%3E%3C/rect%3E%3Crect x='15' y='6' width='3' height='3' fill='%23FF2A4B'%3E%3Canimate attributeName='opacity' values='0;1;1;0' dur='.8s' repeatCount='indefinite'/%3E%3C/rect%3E%3Crect x='10.5' y='10.5' width='3' height='3' fill='%2300FF41'%3E%3Canimate attributeName='opacity' values='1;1;0;1' dur='.8s' repeatCount='indefinite'/%3E%3C/rect%3E%3Crect x='6' y='15' width='3' height='3' fill='%23B400FF'%3E%3Canimate attributeName='opacity' values='0;1;0;1' dur='.8s' repeatCount='indefinite'/%3E%3C/rect%3E%3Crect x='15' y='15' width='3' height='3' fill='%2300F0FF'%3E%3Canimate attributeName='opacity' values='1;0;1;0' dur='.8s' repeatCount='indefinite'/%3E%3C/rect%3E%3CanimateTransform attributeName='transform' type='rotate' values='0 12 12;0 12 12;90 12 12;90 12 12;180 12 12;180 12 12;270 12 12;360 12 12' dur='1.6s' repeatCount='indefinite'/%3E%3C/svg%3E") !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    image-rendering: pixelated !important;
}

.flex.items-center.justify-center.w-6.h-5::after {
    content: "" !important;
    position: absolute !important;
    left: 32px !important;
    right: 0 !important;
    top: 50% !important;
    height: 24px !important;
    transform: translateY(-50%) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='144' height='24' viewBox='0 0 144 24'%3E%3Crect x='1' y='8' width='98' height='8' fill='%23050A12' stroke='%23522A8B' stroke-width='2'/%3E%3Cg%3E%3Crect x='4' y='10' width='6' height='4' fill='%2300F0FF'/%3E%3Crect x='12' y='10' width='6' height='4' fill='%2300F0FF'/%3E%3Crect x='20' y='10' width='6' height='4' fill='%23B400FF'/%3E%3Crect x='28' y='10' width='6' height='4' fill='%2300F0FF'/%3E%3Crect x='36' y='10' width='6' height='4' fill='%23FFD700'/%3E%3Crect x='44' y='10' width='6' height='4' fill='%2300F0FF'/%3E%3Crect x='52' y='10' width='6' height='4' fill='%23B400FF'/%3E%3Crect x='60' y='10' width='6' height='4' fill='%2300F0FF'/%3E%3Crect x='68' y='10' width='6' height='4' fill='%23FF2A4B'/%3E%3Crect x='76' y='10' width='6' height='4' fill='%2300F0FF'/%3E%3Crect x='84' y='10' width='6' height='4' fill='%23FFD700'/%3E%3Canimate attributeName='opacity' values='.18;.4;.65;1;.35;.8;1' dur='1.4s' repeatCount='indefinite'/%3E%3CanimateTransform attributeName='transform' type='translate' values='-88 0;-56 0;-24 0;0 0;0 0' dur='1.4s' repeatCount='indefinite'/%3E%3C/g%3E%3Crect x='4' y='5' width='88' height='2' fill='%23FF2A4B' opacity='0'%3E%3Canimate attributeName='opacity' values='0;0;.8;0;0' dur='1.1s' repeatCount='indefinite'/%3E%3Canimate attributeName='x' values='4;16;4;22;4' dur='1.1s' repeatCount='indefinite'/%3E%3C/rect%3E%3Ctext x='104' y='15' font-family='monospace' font-size='7' fill='%23FFD700'%3ELOAD%3Canimate attributeName='opacity' values='1;.35;1' dur='.7s' repeatCount='indefinite'/%3E%3C/text%3E%3C/svg%3E") !important;
    background-size: 144px 24px !important;
    background-repeat: no-repeat !important;
    image-rendering: pixelated !important;
}

/* 响应式 */

@media (max-width: 720px) {
    .markdown-body .hud-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
    .markdown-body .hud-split {
        grid-template-columns: 1fr !important;
    }
    .markdown-body .profile-grid {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 480px) {
    .bg-gray-100\/90.relative.inline-block {
        padding: 13px 14px 15px 14px !important;
        border-width: 2px !important;
        box-shadow: 0 0 0 2px rgba(180, 0, 255, 0.72),
            0 0 14px rgba(0, 240, 255, 0.38),
            inset 0 0 18px rgba(0, 240, 255, 0.08) !important;
    }
    .markdown-body {
        font-size: 14px !important;
        line-height: 1.68 !important;
        letter-spacing: 0.01em !important;
    }
    .markdown-body .hud-grid {
        grid-template-columns: 1fr !important;
    }
    .markdown-body .oreshura-board {
        padding: 12px !important;
    }
    .markdown-body .hud-title {
        display: block !important;
        font-size: 0.72em !important;
    }
    .markdown-body .hud-title::after {
        display: block !important;
        margin-left: 0 !important;
        margin-top: 4px !important;
    }
    .flex.items-center.justify-center.w-6.h-5 {
        width: 148px !important;
        min-width: 148px !important;
        height: 28px !important;
        min-height: 28px !important;
    }
    .flex.items-center.justify-center.w-6.h-5::after {
        background-size: 128px 24px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .bg-gray-100\/90.relative.inline-block::before {
        opacity: 0.18 !important;
        background-size: 320px 220px !important;
    }
    .bg-gray-100\/90.relative.inline-block::after {
        opacity: 0.15 !important;
    }
    .markdown-body .oreshura-board::before {
        opacity: 0.14 !important;
        background-size: 300px 160px !important;
    }
    .MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary,
    .markdown-body a,
    .markdown-body button,
    .markdown-body [role="button"],
    .markdown-body .choice-button {
        transition-duration: 120ms !important;
    }
}

/* Details 动画模块 v2.2 */

.markdown-body details {
    --dt-bg-0: #050914;
    --dt-bg-1: #070C16;
    --dt-bg-2: #0A0F1A;

    --dt-cyan: #00F0FF;
    --dt-purple: #B400FF;
    --dt-red: #FF2A4B;
    --dt-gold: #FFD700;
    --dt-green: #00FF41;
    --dt-white: #FFFFFF;
    --dt-muted: #AEB8C8;

    --dt-main: #00F0FF;
    --dt-sub: #B400FF;
    --dt-accent: #FFD700;
    --dt-danger: #FF2A4B;

    --dt-main-soft: rgba(0, 240, 255, 0.42);
    --dt-sub-soft: rgba(180, 0, 255, 0.32);
    --dt-accent-soft: rgba(255, 215, 0, 0.34);

    position: relative !important;
    color: var(--dt-white) !important;
    background:
        linear-gradient(180deg, rgba(5, 9, 20, 0.98), rgba(8, 15, 31, 0.98)) !important;
    border: 2px solid rgba(82, 42, 139, 0.95) !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 13px 0 !important;
    box-shadow:
        inset 0 0 0 2px rgba(0, 240, 255, 0.10),
        0 0 14px rgba(180, 0, 255, 0.22) !important;
    overflow: hidden !important;
    clip-path: polygon(
        0 0,
        calc(100% - 12px) 0,
        100% 12px,
        100% 100%,
        12px 100%,
        0 calc(100% - 12px)
    ) !important;
}

.markdown-body details::before {
    content: "" !important;
    position: absolute !important;
    top: 4px !important;
    left: 4px !important;
    right: 4px !important;
    bottom: 4px !important;
    z-index: 0 !important;
    pointer-events: none !important;
    border: 1px solid rgba(0, 240, 255, 0.18) !important;
}

.markdown-body details[open] {
    border-color: var(--dt-main) !important;
    box-shadow:
        inset 0 0 0 2px rgba(0, 240, 255, 0.12),
        0 0 16px rgba(0, 240, 255, 0.26),
        0 0 28px rgba(180, 0, 255, 0.18) !important;
}

/* Summary 基础样式 */

.markdown-body details > summary {
    position: relative !important;
    z-index: 2 !important;
    cursor: pointer !important;

    display: grid !important;
    grid-template-columns: auto 1fr auto !important;
    align-items: center !important;
    gap: 9px !important;

    color: var(--dt-main) !important;
    background:
        linear-gradient(
            90deg,
            rgba(0, 240, 255, 0.16),
            rgba(180, 0, 255, 0.18),
            rgba(255, 42, 75, 0.08)
        ) !important;
    border-bottom: 2px solid rgba(0, 240, 255, 0.38) !important;

    padding: 9px 12px !important;
    min-height: 40px !important;

    font-family:
        "Press Start 2P",
        "DotGothic16",
        "Share Tech Mono",
        "Microsoft YaHei",
        monospace !important;
    font-size: 0.82em !important;
    line-height: 1.65 !important;
    font-weight: 900 !important;
    list-style: none !important;
    letter-spacing: 0.02em !important;

    overflow: hidden !important;
    transition:
        color 140ms steps(2, end),
        background-color 140ms steps(2, end),
        border-color 140ms steps(2, end),
        text-shadow 140ms steps(2, end) !important;
}

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

.markdown-body details > summary::marker {
    content: "" !important;
    display: none !important;
}

/* 左侧核心方块 */
.markdown-body details > summary::before {
    content: "" !important;
    display: inline-block !important;
    width: 13px !important;
    height: 13px !important;
    margin: 0 !important;

    background:
        linear-gradient(90deg, var(--dt-main) 0 3px, transparent 3px 5px, var(--dt-accent) 5px 8px, transparent 8px 10px, var(--dt-sub) 10px 13px) !important;
    border: 1px solid rgba(255, 255, 255, 0.55) !important;
    box-shadow:
        0 0 8px var(--dt-main-soft),
        inset 0 0 0 1px rgba(0, 0, 0, 0.55) !important;

    image-rendering: pixelated !important;
    transform-origin: center center !important;
    transition:
        transform 180ms steps(4, end),
        background-color 180ms steps(4, end),
        box-shadow 180ms steps(4, end) !important;
}

.markdown-body details > summary::after {
    content: "SEALED" !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 74px !important;
    min-height: 20px !important;
    padding: 2px 7px !important;

    color: var(--dt-muted) !important;
    background: rgba(5, 9, 20, 0.68) !important;
    border: 1px solid rgba(0, 240, 255, 0.30) !important;

    font-family: "Share Tech Mono", "Cascadia Mono", "Consolas", monospace !important;
    font-size: 0.78em !important;
    line-height: 1.35 !important;
    font-weight: 900 !important;
    letter-spacing: 0.06em !important;

    box-shadow:
        inset 2px 2px 0 rgba(255, 255, 255, 0.08),
        inset -2px -2px 0 rgba(0, 0, 0, 0.42) !important;

    transition:
        color 160ms steps(2, end),
        border-color 160ms steps(2, end),
        background-color 160ms steps(2, end),
        box-shadow 160ms steps(2, end) !important;
}

.markdown-body details > summary:hover {
    color: var(--dt-white) !important;
    text-shadow:
        0 0 6px rgba(0, 240, 255, 0.50),
        0 0 12px rgba(180, 0, 255, 0.28) !important;
}

.markdown-body details > summary:hover::before {
    transform: translateY(-1px) scale(1.08) !important;
    box-shadow:
        0 0 10px var(--dt-main-soft),
        0 0 16px var(--dt-sub-soft),
        inset 0 0 0 1px rgba(0, 0, 0, 0.55) !important;
}

.markdown-body details[open] > summary {
    color: var(--dt-white) !important;
    border-bottom-color: var(--dt-main-soft) !important;
}

.markdown-body details[open] > summary::before {
    transform: rotate(90deg) scale(1.12) !important;
    background:
        linear-gradient(90deg, var(--dt-green) 0 4px, var(--dt-accent) 4px 8px, var(--dt-main) 8px 13px) !important;
    box-shadow:
        0 0 10px rgba(0, 255, 65, 0.50),
        0 0 18px rgba(0, 240, 255, 0.32),
        inset 0 0 0 1px rgba(0, 0, 0, 0.55) !important;
}

.markdown-body details[open] > summary::after {
    content: "ACTIVE" !important;
    color: #001707 !important;
    background: var(--dt-green) !important;
    border-color: rgba(255, 255, 255, 0.72) !important;
    box-shadow:
        0 0 10px rgba(0, 255, 65, 0.32),
        inset 2px 2px 0 rgba(255, 255, 255, 0.38),
        inset -2px -2px 0 rgba(0, 0, 0, 0.35) !important;
}

.markdown-body details > summary > * {
    position: relative !important;
    z-index: 2 !important;
}

.markdown-body details > summary {
    background-size: 100% 100%, 220px 100% !important;
}

.markdown-body details > summary .summary-label {
    position: relative !important;
    z-index: 2 !important;
}

.markdown-body details[open] > :not(summary) {
    animation:
        dtDefaultReveal 260ms steps(5, end) both !important;
    transform-origin: top center !important;
}

.markdown-body details > p,
.markdown-body details > div,
.markdown-body details > table,
.markdown-body details > details,
.markdown-body details > ul,
.markdown-body details > ol,
.markdown-body details > blockquote,
.markdown-body details > pre {
    position: relative !important;
    z-index: 1 !important;
}

@keyframes dtDefaultReveal {
    0% {
        opacity: 0;
        transform: translateY(-8px) scaleY(0.96);
        filter: brightness(1.8) contrast(1.2);
    }
    45% {
        opacity: 0.72;
        transform: translateY(2px) scaleY(1.02);
        filter: brightness(1.35) contrast(1.15);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scaleY(1);
        filter: brightness(1) contrast(1);
    }
}

/* 默认 details：数据模块 */

.markdown-body details:not(.scene-box):not(.player-box):not(.npc-box):not(.relation-box):not(.memory-box) {
    --dt-main: #00F0FF;
    --dt-sub: #B400FF;
    --dt-accent: #FFD700;
}

.markdown-body details:not(.scene-box):not(.player-box):not(.npc-box):not(.relation-box):not(.memory-box) > summary::after {
    content: "DATA" !important;
}

.markdown-body details:not(.scene-box):not(.player-box):not(.npc-box):not(.relation-box):not(.memory-box)[open] > summary::after {
    content: "ONLINE" !important;
}

.markdown-body details:not(.scene-box):not(.player-box):not(.npc-box):not(.relation-box):not(.memory-box)[open] > summary {
    animation: dtDefaultHeaderPulse 520ms steps(4, end) both !important;
}

@keyframes dtDefaultHeaderPulse {
    0% {
        box-shadow: inset 0 -2px 0 rgba(0, 240, 255, 0.10);
    }
    45% {
        box-shadow:
            inset 0 -2px 0 rgba(0, 240, 255, 0.72),
            inset 0 0 18px rgba(180, 0, 255, 0.16);
    }
    100% {
        box-shadow: inset 0 -2px 0 rgba(0, 240, 255, 0.32);
    }
}

/* 类型一：SCENE DATA — 扫描门 / 场景载入 */

.markdown-body details.scene-box {
    --dt-main: #00F0FF;
    --dt-sub: #005DFF;
    --dt-accent: #FFD700;

    border-color: rgba(0, 240, 255, 0.58) !important;
    background:
        radial-gradient(circle at 12% 0%, rgba(0, 240, 255, 0.12), transparent 34%),
        linear-gradient(180deg, rgba(5, 9, 20, 0.98), rgba(7, 12, 24, 0.98)) !important;
}

.markdown-body details.scene-box > summary {
    color: var(--dt-main) !important;
    background:
        linear-gradient(90deg, rgba(0, 240, 255, 0.20), rgba(0, 93, 255, 0.10), rgba(180, 0, 255, 0.08)),
        #07101D !important;
}

.markdown-body details.scene-box > summary::after {
    content: "SCENE" !important;
    color: var(--dt-cyan) !important;
    border-color: rgba(0, 240, 255, 0.48) !important;
}

.markdown-body details.scene-box[open] > summary::after {
    content: "LOADED" !important;
    color: #00171A !important;
    background: var(--dt-cyan) !important;
}

.markdown-body details.scene-box[open] > summary {
    animation: dtSceneScanHeader 620ms steps(6, end) both !important;
}

.markdown-body details.scene-box[open] > :not(summary) {
    animation: dtSceneReveal 340ms steps(7, end) both !important;
}

.markdown-body details.scene-box[open]::after {
    content: "" !important;
    position: absolute !important;
    left: -35% !important;
    top: 40px !important;
    width: 35% !important;
    height: calc(100% - 40px) !important;
    z-index: 1 !important;
    pointer-events: none !important;
    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(0, 240, 255, 0.05),
            rgba(0, 240, 255, 0.22),
            rgba(255, 255, 255, 0.18),
            transparent
        ) !important;
    animation: dtSceneScanner 760ms steps(10, end) both !important;
}

@keyframes dtSceneScanHeader {
    0% {
        background-position: -120px 0;
        filter: brightness(1.8);
    }
    50% {
        filter: brightness(1.35);
    }
    100% {
        background-position: 0 0;
        filter: brightness(1);
    }
}

@keyframes dtSceneReveal {
    0% {
        opacity: 0;
        transform: translateX(-12px);
        clip-path: inset(0 100% 0 0);
        filter: brightness(1.6);
    }
    55% {
        opacity: 0.88;
        transform: translateX(2px);
        clip-path: inset(0 12% 0 0);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
        clip-path: inset(0 0 0 0);
        filter: brightness(1);
    }
}

@keyframes dtSceneScanner {
    0% {
        left: -40%;
        opacity: 0;
    }
    20% {
        opacity: 0.85;
    }
    100% {
        left: 105%;
        opacity: 0;
    }
}

/* 类型二：PLAYER PROFILE — 身份卡解锁 */

.markdown-body details.player-box {
    --dt-main: #FFD700;
    --dt-sub: #00F0FF;
    --dt-accent: #FFFFFF;

    border-color: rgba(255, 215, 0, 0.54) !important;
    background:
        radial-gradient(circle at 16% 0%, rgba(255, 215, 0, 0.12), transparent 36%),
        linear-gradient(180deg, rgba(9, 10, 16, 0.98), rgba(16, 13, 24, 0.98)) !important;
}

.markdown-body details.player-box > summary {
    color: var(--dt-gold) !important;
    background:
        linear-gradient(90deg, rgba(255, 215, 0, 0.16), rgba(0, 240, 255, 0.10), rgba(180, 0, 255, 0.08)),
        #0B0D16 !important;
    border-bottom-color: rgba(255, 215, 0, 0.36) !important;
}

.markdown-body details.player-box > summary::before {
    background:
        linear-gradient(90deg, var(--dt-gold) 0 4px, transparent 4px 6px, var(--dt-cyan) 6px 13px) !important;
    box-shadow:
        0 0 8px rgba(255, 215, 0, 0.42),
        inset 0 0 0 1px rgba(0, 0, 0, 0.55) !important;
}

.markdown-body details.player-box > summary::after {
    content: "ID LOCK" !important;
    color: var(--dt-gold) !important;
    border-color: rgba(255, 215, 0, 0.46) !important;
}

.markdown-body details.player-box[open] > summary::after {
    content: "VERIFIED" !important;
    color: #120A00 !important;
    background: var(--dt-gold) !important;
}

.markdown-body details.player-box[open] > summary {
    animation: dtPlayerUnlockHeader 720ms steps(7, end) both !important;
}

.markdown-body details.player-box[open] > :not(summary) {
    animation: dtPlayerCardReveal 360ms steps(6, end) both !important;
}

.markdown-body details.player-box[open]::after {
    content: "AUTH OK" !important;
    position: absolute !important;
    right: 10px !important;
    bottom: 7px !important;
    z-index: 0 !important;
    pointer-events: none !important;
    color: rgba(255, 215, 0, 0.22) !important;
    font-family: "Press Start 2P", "Share Tech Mono", monospace !important;
    font-size: 9px !important;
    letter-spacing: 0.08em !important;
    animation: dtPlayerStamp 620ms steps(5, end) both !important;
}

@keyframes dtPlayerUnlockHeader {
    0% {
        box-shadow: inset 0 0 0 rgba(255, 215, 0, 0);
        filter: brightness(1);
    }
    18% {
        transform: translateX(1px);
        filter: brightness(1.7);
    }
    32% {
        transform: translateX(-1px);
    }
    48% {
        transform: translateX(0);
        box-shadow:
            inset 0 0 18px rgba(255, 215, 0, 0.24),
            inset 0 -2px 0 rgba(255, 215, 0, 0.72);
    }
    100% {
        filter: brightness(1);
        box-shadow: inset 0 -2px 0 rgba(255, 215, 0, 0.40);
    }
}

@keyframes dtPlayerCardReveal {
    0% {
        opacity: 0;
        transform: perspective(480px) rotateX(-14deg) translateY(-8px);
        filter: brightness(1.5);
    }
    60% {
        opacity: 0.92;
        transform: perspective(480px) rotateX(3deg) translateY(1px);
    }
    100% {
        opacity: 1;
        transform: perspective(480px) rotateX(0) translateY(0);
        filter: brightness(1);
    }
}

@keyframes dtPlayerStamp {
    0% {
        transform: scale(1.45);
        opacity: 0;
    }
    50% {
        transform: scale(0.96);
        opacity: 0.28;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

/* 类型三：NPC PROFILE — 紫色故障 / 情报入侵 */

.markdown-body details.npc-box {
    --dt-main: #B400FF;
    --dt-sub: #00F0FF;
    --dt-accent: #FF2A4B;

    border-color: rgba(180, 0, 255, 0.56) !important;
    background:
        radial-gradient(circle at 90% 0%, rgba(180, 0, 255, 0.14), transparent 36%),
        linear-gradient(180deg, rgba(8, 7, 18, 0.98), rgba(12, 8, 28, 0.98)) !important;
}

.markdown-body details.npc-box > summary {
    color: var(--dt-purple) !important;
    background:
        linear-gradient(90deg, rgba(180, 0, 255, 0.18), rgba(0, 240, 255, 0.09), rgba(255, 42, 75, 0.10)),
        #0A0818 !important;
    border-bottom-color: rgba(180, 0, 255, 0.42) !important;
}

.markdown-body details.npc-box > summary::before {
    background:
        linear-gradient(90deg, var(--dt-purple) 0 4px, var(--dt-red) 4px 7px, transparent 7px 9px, var(--dt-cyan) 9px 13px) !important;
    box-shadow:
        0 0 8px rgba(180, 0, 255, 0.48),
        inset 0 0 0 1px rgba(0, 0, 0, 0.55) !important;
}

.markdown-body details.npc-box > summary::after {
    content: "TRACE" !important;
    color: var(--dt-purple) !important;
    border-color: rgba(180, 0, 255, 0.48) !important;
}

.markdown-body details.npc-box[open] > summary::after {
    content: "DECODED" !important;
    color: #FFFFFF !important;
    background: var(--dt-purple) !important;
    border-color: var(--dt-cyan) !important;
}

.markdown-body details.npc-box[open] > summary {
    animation: dtNpcGlitchHeader 640ms steps(2, end) both !important;
}

.markdown-body details.npc-box[open] > :not(summary) {
    animation: dtNpcGlitchReveal 380ms steps(5, end) both !important;
}

.markdown-body details.npc-box[open]::after {
    content: "" !important;
    position: absolute !important;
    inset: 40px 0 0 0 !important;
    z-index: 1 !important;
    pointer-events: none !important;
    opacity: 0 !important;
    background:
        repeating-linear-gradient(
            180deg,
            rgba(180, 0, 255, 0.00) 0 5px,
            rgba(180, 0, 255, 0.18) 5px 6px,
            rgba(0, 240, 255, 0.14) 6px 7px
        ) !important;
    mix-blend-mode: screen !important;
    animation: dtNpcNoise 520ms steps(4, end) both !important;
}

@keyframes dtNpcGlitchHeader {
    0% {
        transform: translate(0, 0);
        filter: hue-rotate(0deg) brightness(1.6);
    }
    14% {
        transform: translate(2px, 0);
    }
    28% {
        transform: translate(-2px, 1px);
        filter: hue-rotate(16deg) brightness(1.8);
    }
    42% {
        transform: translate(1px, -1px);
    }
    58% {
        transform: translate(0, 0);
        filter: hue-rotate(-10deg) brightness(1.35);
    }
    100% {
        transform: translate(0, 0);
        filter: hue-rotate(0deg) brightness(1);
    }
}

@keyframes dtNpcGlitchReveal {
    0% {
        opacity: 0;
        transform: translateX(10px);
        filter: blur(1px) brightness(1.7);
        clip-path: inset(0 0 100% 0);
    }
    30% {
        opacity: 0.52;
        transform: translateX(-4px);
        clip-path: inset(0 0 42% 0);
    }
    62% {
        opacity: 0.82;
        transform: translateX(2px);
        filter: blur(0) brightness(1.32);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
        filter: blur(0) brightness(1);
        clip-path: inset(0 0 0 0);
    }
}

@keyframes dtNpcNoise {
    0% {
        opacity: 0;
        transform: translateX(0);
    }
    18% {
        opacity: 0.42;
        transform: translateX(2px);
    }
    34% {
        opacity: 0.18;
        transform: translateX(-2px);
    }
    58% {
        opacity: 0.32;
        transform: translateX(1px);
    }
    100% {
        opacity: 0;
        transform: translateX(0);
    }
}

/* 类型四：RELATION MAP — 链路同步 */

.markdown-body details.relation-box {
    --dt-main: #00FF41;
    --dt-sub: #00F0FF;
    --dt-accent: #FFD700;

    border-color: rgba(0, 255, 65, 0.48) !important;
    background:
        radial-gradient(circle at 50% 0%, rgba(0, 255, 65, 0.10), transparent 38%),
        linear-gradient(180deg, rgba(4, 12, 8, 0.98), rgba(5, 14, 18, 0.98)) !important;
}

.markdown-body details.relation-box > summary {
    color: var(--dt-green) !important;
    background:
        linear-gradient(90deg, rgba(0, 255, 65, 0.14), rgba(0, 240, 255, 0.12), rgba(180, 0, 255, 0.08)),
        #041008 !important;
    border-bottom-color: rgba(0, 255, 65, 0.34) !important;
}

.markdown-body details.relation-box > summary::before {
    background:
        linear-gradient(90deg, var(--dt-green) 0 5px, transparent 5px 7px, var(--dt-cyan) 7px 13px) !important;
    box-shadow:
        0 0 8px rgba(0, 255, 65, 0.45),
        inset 0 0 0 1px rgba(0, 0, 0, 0.55) !important;
}

.markdown-body details.relation-box > summary::after {
    content: "LINK" !important;
    color: var(--dt-green) !important;
    border-color: rgba(0, 255, 65, 0.42) !important;
}

.markdown-body details.relation-box[open] > summary::after {
    content: "SYNCED" !important;
    color: #001707 !important;
    background: var(--dt-green) !important;
}

.markdown-body details.relation-box[open] > summary {
    animation: dtRelationHeaderPulse 720ms steps(6, end) both !important;
}

.markdown-body details.relation-box[open] > :not(summary) {
    animation: dtRelationReveal 420ms steps(7, end) both !important;
}

.markdown-body details.relation-box[open] .relation-node {
    animation: dtRelationNodePulse 680ms steps(5, end) both !important;
}

.markdown-body details.relation-box[open] .relation-node:nth-of-type(2n) {
    animation-delay: 80ms !important;
}

.markdown-body details.relation-box[open] .relation-node:nth-of-type(3n) {
    animation-delay: 140ms !important;
}

@keyframes dtRelationHeaderPulse {
    0% {
        box-shadow: inset 0 -2px 0 rgba(0, 255, 65, 0.10);
    }
    28% {
        box-shadow:
            inset 0 -2px 0 rgba(0, 255, 65, 0.74),
            inset 0 0 18px rgba(0, 255, 65, 0.18);
    }
    58% {
        box-shadow:
            inset 0 -2px 0 rgba(0, 240, 255, 0.64),
            inset 0 0 18px rgba(0, 240, 255, 0.14);
    }
    100% {
        box-shadow: inset 0 -2px 0 rgba(0, 255, 65, 0.36);
    }
}

@keyframes dtRelationReveal {
    0% {
        opacity: 0;
        transform: scale(0.98);
        filter: brightness(1.6);
    }
    40% {
        opacity: 0.68;
        transform: scale(1.012);
    }
    100% {
        opacity: 1;
        transform: scale(1);
        filter: brightness(1);
    }
}

@keyframes dtRelationNodePulse {
    0% {
        transform: translateX(-8px);
        opacity: 0;
        box-shadow: inset 0 0 0 rgba(0, 255, 65, 0);
    }
    42% {
        transform: translateX(2px);
        opacity: 0.78;
        box-shadow:
            inset 4px 0 0 rgba(0, 255, 65, 0.72),
            0 0 10px rgba(0, 255, 65, 0.18);
    }
    100% {
        transform: translateX(0);
        opacity: 1;
        box-shadow: inset 0 0 0 rgba(0, 255, 65, 0);
    }
}

/* 类型五：MEMORY ARCHIVE — 终端读取 */

.markdown-body details.memory-box {
    --dt-main: #00FF41;
    --dt-sub: #FFD700;
    --dt-accent: #00F0FF;

    border-color: rgba(0, 255, 65, 0.44) !important;
    background:
        radial-gradient(circle at 10% 0%, rgba(0, 255, 65, 0.10), transparent 35%),
        linear-gradient(180deg, rgba(3, 12, 7, 0.98), rgba(4, 16, 8, 0.98)) !important;
}

.markdown-body details.memory-box > summary {
    color: var(--dt-green) !important;
    background:
        linear-gradient(90deg, rgba(0, 255, 65, 0.14), rgba(255, 215, 0, 0.08), rgba(0, 240, 255, 0.08)),
        #041008 !important;
    border-bottom-color: rgba(0, 255, 65, 0.34) !important;
}

.markdown-body details.memory-box > summary::before {
    background:
        linear-gradient(90deg, var(--dt-green) 0 4px, transparent 4px 6px, var(--dt-gold) 6px 9px, var(--dt-cyan) 9px 13px) !important;
    box-shadow:
        0 0 8px rgba(0, 255, 65, 0.48),
        inset 0 0 0 1px rgba(0, 0, 0, 0.55) !important;
}

.markdown-body details.memory-box > summary::after {
    content: "ARCHIVE" !important;
    color: var(--dt-green) !important;
    border-color: rgba(0, 255, 65, 0.42) !important;
}

.markdown-body details.memory-box[open] > summary::after {
    content: "READING" !important;
    color: #001707 !important;
    background: var(--dt-green) !important;
}

.markdown-body details.memory-box[open] > summary {
    animation: dtMemoryBootHeader 760ms steps(8, end) both !important;
}

.markdown-body details.memory-box[open] > :not(summary) {
    animation: dtMemoryReveal 480ms steps(8, end) both !important;
}

.markdown-body details.memory-box[open]::after {
    content: "MEMORY STREAM // ACTIVE" !important;
    position: absolute !important;
    right: 10px !important;
    bottom: 7px !important;
    z-index: 0 !important;
    pointer-events: none !important;

    color: rgba(0, 255, 65, 0.24) !important;
    font-family: "Share Tech Mono", "Cascadia Mono", monospace !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    letter-spacing: 0.08em !important;

    animation: dtMemoryCursor 900ms steps(2, end) infinite !important;
}

@keyframes dtMemoryBootHeader {
    0% {
        filter: brightness(1.8);
        text-shadow: 0 0 0 rgba(0, 255, 65, 0);
    }
    20% {
        filter: brightness(1.1);
        text-shadow: 0 0 8px rgba(0, 255, 65, 0.42);
    }
    38% {
        filter: brightness(1.7);
    }
    56% {
        filter: brightness(1.18);
    }
    100% {
        filter: brightness(1);
        text-shadow: 0 0 6px rgba(0, 255, 65, 0.22);
    }
}

@keyframes dtMemoryReveal {
    0% {
        opacity: 0;
        transform: translateY(-6px);
        clip-path: inset(0 0 100% 0);
        filter: brightness(1.6) contrast(1.22);
    }
    24% {
        opacity: 0.42;
        clip-path: inset(0 0 72% 0);
    }
    52% {
        opacity: 0.74;
        clip-path: inset(0 0 28% 0);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
        clip-path: inset(0 0 0 0);
        filter: brightness(1) contrast(1);
    }
}

@keyframes dtMemoryCursor {
    0%,
    48% {
        opacity: 0.22;
    }
    49%,
    100% {
        opacity: 0.05;
    }
}

/* 嵌套 Details */

.markdown-body details details {
    margin: 10px 10px !important;
    border-width: 1px !important;
    border-color: rgba(255, 215, 0, 0.46) !important;
    background:
        linear-gradient(180deg, rgba(8, 10, 20, 0.98), rgba(16, 12, 28, 0.98)) !important;
    box-shadow:
        inset 0 0 0 1px rgba(255, 215, 0, 0.12),
        0 0 10px rgba(255, 215, 0, 0.12) !important;
}

.markdown-body details details > summary {
    min-height: 34px !important;
    padding: 7px 10px !important;
    color: var(--dt-gold) !important;
    background:
        linear-gradient(90deg, rgba(255, 215, 0, 0.12), rgba(255, 42, 75, 0.10), rgba(180, 0, 255, 0.10)) !important;
    border-bottom-color: rgba(255, 215, 0, 0.35) !important;
    font-size: 0.74em !important;
}

.markdown-body details details > summary::before {
    width: 10px !important;
    height: 10px !important;
    background:
        linear-gradient(90deg, var(--dt-gold) 0 4px, transparent 4px 6px, var(--dt-red) 6px 10px) !important;
    box-shadow:
        0 0 7px rgba(255, 215, 0, 0.36),
        inset 0 0 0 1px rgba(0, 0, 0, 0.55) !important;
}

.markdown-body details details > summary::after {
    min-width: 54px !important;
    min-height: 18px !important;
    content: "SUB" !important;
    color: var(--dt-gold) !important;
    border-color: rgba(255, 215, 0, 0.38) !important;
    font-size: 0.72em !important;
}

.markdown-body details details[open] > summary::after {
    content: "OPEN" !important;
    color: #120A00 !important;
    background: var(--dt-gold) !important;
}

.markdown-body details details[open] > :not(summary) {
    animation: dtNestedReveal 260ms steps(5, end) both !important;
}

@keyframes dtNestedReveal {
    0% {
        opacity: 0;
        transform: translateY(-5px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Details 内部间距兼容 */

.markdown-body details > p,
.markdown-body details > div,
.markdown-body details > table,
.markdown-body details > details,
.markdown-body details > ul,
.markdown-body details > ol,
.markdown-body details > blockquote,
.markdown-body details > pre {
    margin-left: 12px !important;
    margin-right: 12px !important;
}

.markdown-body details > p:last-child,
.markdown-body details > div:last-child,
.markdown-body details > table:last-child,
.markdown-body details > ul:last-child,
.markdown-body details > ol:last-child {
    margin-bottom: 13px !important;
}

.markdown-body details > .profile-grid,
.markdown-body details > .profile-id-card,
.markdown-body details > .relation-map,
.markdown-body details > .memory-panel,
.markdown-body details > .memory-index,
.markdown-body details > .table-wrap {
    margin-left: 12px !important;
    margin-right: 12px !important;
}

/* 关闭态微动效 */

.markdown-body details:not([open]) > summary:hover::after {
    color: var(--dt-white) !important;
    border-color: var(--dt-accent) !important;
    box-shadow:
        0 0 8px rgba(255, 215, 0, 0.20),
        inset 2px 2px 0 rgba(255, 255, 255, 0.10),
        inset -2px -2px 0 rgba(0, 0, 0, 0.42) !important;
}

.markdown-body details:not([open]) > summary:hover::before {
    animation: dtClosedCoreBlink 520ms steps(2, end) infinite !important;
}

@keyframes dtClosedCoreBlink {
    0%,
    48% {
        opacity: 1;
    }
    49%,
    100% {
        opacity: 0.58;
    }
}

/* 打开态持续脉冲 */

.markdown-body details[open] > summary::before {
    animation: dtOpenCorePulse 1200ms steps(4, end) infinite !important;
}

@keyframes dtOpenCorePulse {
    0% {
        box-shadow:
            0 0 8px rgba(0, 255, 65, 0.34),
            0 0 14px rgba(0, 240, 255, 0.18),
            inset 0 0 0 1px rgba(0, 0, 0, 0.55);
    }
    50% {
        box-shadow:
            0 0 12px rgba(0, 255, 65, 0.58),
            0 0 20px rgba(0, 240, 255, 0.32),
            inset 0 0 0 1px rgba(0, 0, 0, 0.55);
    }
    100% {
        box-shadow:
            0 0 8px rgba(0, 255, 65, 0.34),
            0 0 14px rgba(0, 240, 255, 0.18),
            inset 0 0 0 1px rgba(0, 0, 0, 0.55);
    }
}

/* 移动端适配 */

@media (max-width: 720px) {
    .markdown-body details > summary {
        grid-template-columns: auto 1fr !important;
        gap: 8px !important;
    }

    .markdown-body details > summary::after {
        grid-column: 1 / -1 !important;
        justify-self: start !important;
        margin-left: 22px !important;
        margin-top: 2px !important;
        min-width: 68px !important;
    }
}

@media (max-width: 480px) {
    .markdown-body details > summary {
        padding: 8px 10px !important;
        font-size: 0.72em !important;
        line-height: 1.6 !important;
    }

    .markdown-body details > summary::before {
        width: 11px !important;
        height: 11px !important;
    }

    .markdown-body details > summary::after {
        min-height: 18px !important;
        font-size: 0.70em !important;
        padding: 1px 6px !important;
    }

    .markdown-body details > p,
    .markdown-body details > div,
    .markdown-body details > table,
    .markdown-body details > details,
    .markdown-body details > ul,
    .markdown-body details > ol,
    .markdown-body details > blockquote,
    .markdown-body details > pre {
        margin-left: 10px !important;
        margin-right: 10px !important;
    }
}

/* 低动效偏好 */

@media (prefers-reduced-motion: reduce) {
    .markdown-body details,
    .markdown-body details *,
    .markdown-body details::before,
    .markdown-body details::after,
    .markdown-body details > summary,
    .markdown-body details > summary::before,
    .markdown-body details > summary::after {
        animation-duration: 1ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 1ms !important;
    }

    .markdown-body details[open] > :not(summary) {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
        clip-path: none !important;
    }

    .markdown-body details[open]::after {
        animation: none !important;
        opacity: 0.08 !important;
    }
}

/* Purple Theme — 顶部栏/开场白/按钮栏/底部栏/分页栏/评论区 */

/* 顶部栏 */
.sticky.w-full.top-0.flex.items-center {
  background:
    linear-gradient(90deg, rgba(24, 8, 46, 0.96), rgba(46, 12, 86, 0.94), rgba(17, 8, 38, 0.96)) !important;
  border-bottom: 1px solid rgba(201, 92, 255, 0.65) !important;
  box-shadow:
    0 0 18px rgba(168, 85, 247, 0.48),
    inset 0 -1px 0 rgba(255, 255, 255, 0.12) !important;
  backdrop-filter: blur(14px) saturate(150%) !important;
  color: #f7eaff !important;
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

#ai-model-selector .group.flex.items-center {
  background:
    linear-gradient(135deg, rgba(91, 33, 182, 0.72), rgba(168, 85, 247, 0.22)) !important;
  border: 1px solid rgba(216, 180, 254, 0.82) !important;
  border-radius: 10px !important;
  box-shadow:
    0 0 12px rgba(192, 132, 252, 0.52),
    inset 0 0 10px rgba(255, 255, 255, 0.08) !important;
  color: #ffffff !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease !important;
}

#ai-model-selector .group.flex.items-center:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(244, 114, 255, 1) !important;
  box-shadow:
    0 0 20px rgba(217, 70, 239, 0.78),
    0 0 36px rgba(124, 58, 237, 0.42),
    inset 0 0 12px rgba(255, 255, 255, 0.16) !important;
}

#ai-model-selector .truncate.text-\[13px\] {
  color: #fff7ff !important;
  text-shadow:
    0 0 5px rgba(244, 114, 255, 0.85),
    1px 1px 0 rgba(59, 7, 100, 0.9) !important;
  letter-spacing: 0.04em !important;
  font-weight: 700 !important;
}

#ai-model-selector .shrink-0.flex.items-center svg {
  color: #f0abfc !important;
  filter: drop-shadow(0 0 5px rgba(232, 121, 249, 0.9)) !important;
  transition: transform 0.18s ease, filter 0.18s ease !important;
}

#ai-model-selector .group.flex.items-center:hover .shrink-0.flex.items-center svg {
  transform: rotate(180deg) !important;
  filter: drop-shadow(0 0 8px rgba(255, 255, 255, 1)) !important;
}

.sticky.w-full.top-0 svg.lucide-clock-8,
.sticky.w-full.top-0 svg:has(use[href="#icon-icon-set"]),
#header-setting-button svg,
.sticky.w-full.top-0 button.MuiIconButton-root svg.lucide-music-2 {
  color: #f5d0fe !important;
  stroke: #f5d0fe !important;
  filter:
    drop-shadow(0 0 4px rgba(232, 121, 249, 0.95))
    drop-shadow(0 0 10px rgba(147, 51, 234, 0.6)) !important;
  transition: transform 0.18s ease, filter 0.18s ease, color 0.18s ease !important;
}

.sticky.w-full.top-0 svg.lucide-clock-8:hover,
.sticky.w-full.top-0 svg:has(use[href="#icon-icon-set"]):hover,
#header-setting-button:hover svg,
.sticky.w-full.top-0 button.MuiIconButton-root:hover svg.lucide-music-2 {
  color: #ffffff !important;
  stroke: #ffffff !important;
  transform: scale(1.12) rotate(-4deg) !important;
  filter:
    drop-shadow(0 0 7px rgba(255, 255, 255, 1))
    drop-shadow(0 0 14px rgba(217, 70, 239, 0.95)) !important;
}

#header-setting-button,
.sticky.w-full.top-0 button.MuiIconButton-root:has(svg.lucide-music-2) {
  background: rgba(88, 28, 135, 0.52) !important;
  border: 1px solid rgba(216, 180, 254, 0.5) !important;
  border-radius: 10px !important;
  box-shadow: inset 0 0 10px rgba(255, 255, 255, 0.06), 0 0 10px rgba(168, 85, 247, 0.35) !important;
  transition: background 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease !important;
}

#header-setting-button:hover,
.sticky.w-full.top-0 button.MuiIconButton-root:has(svg.lucide-music-2):hover {
  background: rgba(126, 34, 206, 0.72) !important;
  border-color: rgba(244, 114, 255, 0.95) !important;
  box-shadow: 0 0 18px rgba(217, 70, 239, 0.75), inset 0 0 12px rgba(255, 255, 255, 0.14) !important;
}

.sticky.w-full.top-0 span.MuiBadge-dot.md\:hidden {
  background: #22d3ee !important;
  box-shadow:
    0 0 6px rgba(34, 211, 238, 1),
    0 0 14px rgba(217, 70, 239, 0.9) !important;
}


/* 开场白选择器 */
div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"],
div.h-9.rounded-md.cursor-pointer.group:has(svg[data-icon="SlidersH"]) {
  background:
    linear-gradient(135deg, rgba(30, 10, 58, 0.96), rgba(88, 28, 135, 0.78), rgba(20, 8, 38, 0.96)) !important;
  border: 1px solid rgba(216, 180, 254, 0.76) !important;
  border-radius: 12px !important;
  color: #fdf4ff !important;
  box-shadow:
    0 0 14px rgba(168, 85, 247, 0.46),
    inset 0 0 12px rgba(255, 255, 255, 0.08) !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease !important;
}

div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"]:hover,
div.h-9.rounded-md.cursor-pointer.group:has(svg[data-icon="SlidersH"]):hover {
  transform: translateY(-1px) !important;
  border-color: rgba(34, 211, 238, 0.95) !important;
  box-shadow:
    0 0 16px rgba(34, 211, 238, 0.45),
    0 0 24px rgba(217, 70, 239, 0.55),
    inset 0 0 14px rgba(255, 255, 255, 0.13) !important;
}

div.flex.items-center.h-9.cursor-pointer.group svg[data-icon="SlidersH"],
div.flex.items-center.h-9.cursor-pointer.group svg[data-icon="ChevronDown"] {
  color: #f0abfc !important;
  stroke: #f0abfc !important;
  filter: drop-shadow(0 0 6px rgba(232, 121, 249, 0.9)) !important;
  transition: transform 0.18s ease, color 0.18s ease, filter 0.18s ease !important;
}

div.flex.items-center.h-9.cursor-pointer.group:hover svg[data-icon="SlidersH"] {
  transform: rotate(12deg) scale(1.08) !important;
  color: #67e8f9 !important;
  stroke: #67e8f9 !important;
}

div.flex.items-center.h-9.cursor-pointer.group:hover svg[data-icon="ChevronDown"] {
  transform: translateY(1px) scale(1.08) !important;
  color: #ffffff !important;
  stroke: #ffffff !important;
}


/* 按钮栏 */
#ai-mod-button2 {
  background:
    linear-gradient(90deg, rgba(17, 8, 38, 0.72), rgba(59, 7, 100, 0.45), rgba(17, 8, 38, 0.72)) !important;
  border: 1px solid rgba(168, 85, 247, 0.32) !important;
  border-radius: 14px !important;
  box-shadow: inset 0 0 16px rgba(168, 85, 247, 0.16) !important;
}

#ai-mod-button2 button.MuiButton-root {
  background:
    linear-gradient(135deg, rgba(76, 29, 149, 0.9), rgba(147, 51, 234, 0.58)) !important;
  color: #ffffff !important;
  border: 1px solid rgba(233, 213, 255, 0.62) !important;
  border-radius: 10px !important;
  text-shadow: 0 0 5px rgba(255, 255, 255, 0.65) !important;
  box-shadow:
    0 0 10px rgba(168, 85, 247, 0.42),
    inset 0 0 10px rgba(255, 255, 255, 0.08) !important;
  font-weight: 700 !important;
  letter-spacing: 0.03em !important;
  transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease, background 0.16s ease !important;
}

#ai-mod-button2 button.MuiButton-root:hover {
  transform: translateY(-2px) !important;
  background:
    linear-gradient(135deg, rgba(126, 34, 206, 0.96), rgba(217, 70, 239, 0.74)) !important;
  border-color: rgba(103, 232, 249, 0.95) !important;
  box-shadow:
    0 0 16px rgba(217, 70, 239, 0.85),
    0 0 26px rgba(34, 211, 238, 0.36),
    inset 0 0 12px rgba(255, 255, 255, 0.15) !important;
}

#ai-mod-button2 button.MuiButton-root svg {
  color: #f5d0fe !important;
  stroke: #f5d0fe !important;
  filter: drop-shadow(0 0 5px rgba(244, 114, 255, 0.9)) !important;
}


/* 底部栏 / 输入框 */
.bg-gradient-to-t {
  background:
    linear-gradient(to top, rgba(15, 5, 34, 0.98), rgba(39, 10, 70, 0.9), rgba(39, 10, 70, 0)) !important;
}

#ai-chat-bottom-input {
  background:
    linear-gradient(135deg, rgba(24, 8, 46, 0.96), rgba(74, 16, 120, 0.78), rgba(17, 8, 38, 0.96)) !important;
  border: 1px solid rgba(216, 180, 254, 0.72) !important;
  border-radius: 16px !important;
  box-shadow:
    0 0 18px rgba(168, 85, 247, 0.5),
    0 0 34px rgba(34, 211, 238, 0.14),
    inset 0 0 16px rgba(255, 255, 255, 0.08) !important;
  color: #ffffff !important;
  transition: box-shadow 0.18s ease, border-color 0.18s ease !important;
}

#ai-chat-bottom-input:focus-within {
  border-color: rgba(103, 232, 249, 0.98) !important;
  box-shadow:
    0 0 20px rgba(34, 211, 238, 0.56),
    0 0 34px rgba(217, 70, 239, 0.55),
    inset 0 0 18px rgba(255, 255, 255, 0.12) !important;
}

#ai-chat-input {
  color: #fff7ff !important;
  caret-color: #67e8f9 !important;
  text-shadow: 0 0 4px rgba(244, 114, 255, 0.35) !important;
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-weight: 600 !important;
}

#ai-chat-input::placeholder {
  color: rgba(240, 171, 252, 0.78) !important;
  text-shadow: 0 0 5px rgba(168, 85, 247, 0.45) !important;
}

#ai-chat-input::selection {
  background: rgba(34, 211, 238, 0.38) !important;
  color: #ffffff !important;
}


/* 分页栏 */
.MuiPaginationItem-root {
  background: rgba(39, 10, 70, 0.88) !important;
  color: #f5d0fe !important;
  border: 1px solid rgba(216, 180, 254, 0.45) !important;
  border-radius: 8px !important;
  box-shadow: 0 0 8px rgba(168, 85, 247, 0.28) !important;
  font-weight: 700 !important;
  transition: color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease !important;
}

.MuiPaginationItem-root:hover {
  background: rgba(126, 34, 206, 0.9) !important;
  color: #ffffff !important;
  border-color: rgba(103, 232, 249, 0.9) !important;
  box-shadow: 0 0 14px rgba(34, 211, 238, 0.42), 0 0 18px rgba(217, 70, 239, 0.35) !important;
}

.MuiPaginationItem-root.Mui-selected {
  background:
    linear-gradient(135deg, rgba(147, 51, 234, 1), rgba(217, 70, 239, 0.95)) !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.9) !important;
  box-shadow:
    0 0 14px rgba(217, 70, 239, 0.86),
    0 0 26px rgba(34, 211, 238, 0.32) !important;
}

.MuiPaginationItem-root.Mui-disabled {
  background: rgba(30, 10, 58, 0.42) !important;
  color: rgba(216, 180, 254, 0.36) !important;
  border-color: rgba(216, 180, 254, 0.2) !important;
  box-shadow: none !important;
}

.MuiPaginationItem-icon {
  color: currentColor !important;
  filter: drop-shadow(0 0 4px rgba(232, 121, 249, 0.75)) !important;
}

.MuiStack-root.css-1uwir8f {
  background: rgba(24, 8, 46, 0.82) !important;
  color: #f5d0fe !important;
  border: 1px solid rgba(168, 85, 247, 0.42) !important;
  border-radius: 10px !important;
  box-shadow: 0 0 10px rgba(168, 85, 247, 0.28) !important;
}

.MuiStack-root.css-1uwir8f .MuiBox-root {
  color: #f5d0fe !important;
  text-shadow: 0 0 5px rgba(168, 85, 247, 0.5) !important;
  font-weight: 700 !important;
}

.MuiInputBase-input {
  background: rgba(17, 8, 38, 0.88) !important;
  color: #ffffff !important;
  border: 1px solid rgba(216, 180, 254, 0.56) !important;
  border-radius: 8px !important;
  box-shadow: inset 0 0 8px rgba(168, 85, 247, 0.25) !important;
}

.MuiInputBase-input:focus {
  border-color: rgba(103, 232, 249, 0.96) !important;
  box-shadow:
    0 0 10px rgba(34, 211, 238, 0.44),
    inset 0 0 10px rgba(168, 85, 247, 0.28) !important;
}


/* 评论区 */
div[class*="w-full"][class*="bg-white"][class*="bottom-0"] {
  background:
    radial-gradient(circle at 12% 0%, rgba(217, 70, 239, 0.22), transparent 32%),
    radial-gradient(circle at 88% 12%, rgba(34, 211, 238, 0.16), transparent 34%),
    linear-gradient(180deg, rgba(25, 8, 49, 0.98), rgba(17, 8, 38, 0.98)) !important;
  color: #fdf4ff !important;
  border-color: rgba(216, 180, 254, 0.46) !important;
  box-shadow:
    0 -8px 28px rgba(168, 85, 247, 0.34),
    inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

div.text-lg.font-bold {
  color: #ffffff !important;
  text-shadow:
    0 0 8px rgba(244, 114, 255, 0.9),
    0 0 18px rgba(34, 211, 238, 0.36) !important;
  letter-spacing: 0.04em !important;
}

p.MuiTypography-body1.text-grey-600 {
  color: #f5d0fe !important;
  font-weight: 700 !important;
  text-shadow: 0 0 5px rgba(168, 85, 247, 0.55) !important;
}

span.MuiRating-root {
  filter: drop-shadow(0 0 6px rgba(217, 70, 239, 0.55)) !important;
}

span.MuiRating-iconEmpty svg {
  color: rgba(216, 180, 254, 0.48) !important;
  stroke: rgba(216, 180, 254, 0.75) !important;
}

span.MuiRating-iconFilled svg {
  color: #facc15 !important;
  filter:
    drop-shadow(0 0 5px rgba(250, 204, 21, 0.95))
    drop-shadow(0 0 10px rgba(217, 70, 239, 0.55)) !important;
}

span.text-orange-500 {
  color: #fde68a !important;
  text-shadow: 0 0 7px rgba(250, 204, 21, 0.75) !important;
  font-weight: 800 !important;
}

div.flex.flex-col.border-gray-200 {
  background: rgba(24, 8, 46, 0.88) !important;
  border: 1px solid rgba(216, 180, 254, 0.58) !important;
  border-radius: 14px !important;
  box-shadow:
    0 0 14px rgba(168, 85, 247, 0.35),
    inset 0 0 12px rgba(255, 255, 255, 0.06) !important;
}

textarea.rc-textarea {
  background: rgba(15, 5, 34, 0.72) !important;
  color: #fff7ff !important;
  caret-color: #67e8f9 !important;
  border-radius: 10px !important;
  text-shadow: 0 0 4px rgba(244, 114, 255, 0.32) !important;
  font-weight: 600 !important;
}

textarea.rc-textarea::placeholder {
  color: rgba(240, 171, 252, 0.72) !important;
}

textarea.rc-textarea:focus {
  outline: 1px solid rgba(103, 232, 249, 0.85) !important;
  box-shadow: 0 0 12px rgba(34, 211, 238, 0.38) !important;
}

div.bg-gray-100.text-gray-500 {
  background: rgba(39, 10, 70, 0.85) !important;
  color: #e9d5ff !important;
  border-top: 1px solid rgba(216, 180, 254, 0.24) !important;
}

div.cursor-pointer.group.flex.items-center.justify-center {
  background:
    linear-gradient(135deg, rgba(126, 34, 206, 0.95), rgba(217, 70, 239, 0.82)) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.72) !important;
  border-radius: 12px !important;
  box-shadow:
    0 0 12px rgba(217, 70, 239, 0.7),
    inset 0 0 10px rgba(255, 255, 255, 0.12) !important;
  transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease !important;
}

div.cursor-pointer.group.flex.items-center.justify-center:hover {
  transform: translateY(-1px) scale(1.02) !important;
  border-color: rgba(103, 232, 249, 1) !important;
  box-shadow:
    0 0 18px rgba(34, 211, 238, 0.56),
    0 0 28px rgba(217, 70, 239, 0.76),
    inset 0 0 12px rgba(255, 255, 255, 0.16) !important;
}

div[data-state="closed"] svg[data-icon="Send03"] {
  color: #ffffff !important;
  stroke: #ffffff !important;
  filter: drop-shadow(0 0 6px rgba(255, 255, 255, 0.95)) !important;
}

div.style_divider__mW0YX {
  background:
    linear-gradient(90deg, transparent, rgba(217, 70, 239, 0.85), rgba(34, 211, 238, 0.65), transparent) !important;
  box-shadow: 0 0 10px rgba(217, 70, 239, 0.65) !important;
}

.MuiStack-root.css-1dmzxoz {
  background: rgba(24, 8, 46, 0.62) !important;
  border: 1px solid rgba(168, 85, 247, 0.28) !important;
  border-radius: 12px !important;
  box-shadow: inset 0 0 12px rgba(168, 85, 247, 0.13) !important;
}

button.MuiButton-containedPrimary,
button.MuiButton-outlinedPrimary {
  border-radius: 10px !important;
  font-weight: 800 !important;
  letter-spacing: 0.03em !important;
  transition: background 0.16s ease, color 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease, transform 0.16s ease !important;
}

button.MuiButton-containedPrimary {
  background:
    linear-gradient(135deg, rgba(147, 51, 234, 1), rgba(217, 70, 239, 0.95)) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.76) !important;
  box-shadow:
    0 0 14px rgba(217, 70, 239, 0.78),
    0 0 22px rgba(34, 211, 238, 0.24) !important;
}

button.MuiButton-outlinedPrimary {
  background: rgba(39, 10, 70, 0.82) !important;
  color: #f5d0fe !important;
  border: 1px solid rgba(216, 180, 254, 0.58) !important;
  box-shadow: 0 0 8px rgba(168, 85, 247, 0.28) !important;
}

button.MuiButton-containedPrimary:hover,
button.MuiButton-outlinedPrimary:hover {
  transform: translateY(-1px) !important;
  color: #ffffff !important;
  border-color: rgba(103, 232, 249, 0.98) !important;
  box-shadow:
    0 0 16px rgba(34, 211, 238, 0.46),
    0 0 24px rgba(217, 70, 239, 0.56) !important;
}

div.p-3.overflow-y-auto {
  background: rgba(15, 5, 34, 0.28) !important;
  border-radius: 14px !important;
}

div.group.ml-0 {
  background:
    linear-gradient(135deg, rgba(30, 10, 58, 0.82), rgba(59, 7, 100, 0.42)) !important;
  border: 1px solid rgba(216, 180, 254, 0.32) !important;
  border-radius: 14px !important;
  box-shadow:
    0 0 12px rgba(168, 85, 247, 0.22),
    inset 0 0 10px rgba(255, 255, 255, 0.04) !important;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, background 0.16s ease !important;
}

div.group.ml-0:hover {
  background:
    linear-gradient(135deg, rgba(46, 16, 101, 0.92), rgba(88, 28, 135, 0.54)) !important;
  border-color: rgba(103, 232, 249, 0.64) !important;
  box-shadow:
    0 0 16px rgba(34, 211, 238, 0.28),
    0 0 22px rgba(217, 70, 239, 0.28),
    inset 0 0 12px rgba(255, 255, 255, 0.06) !important;
}

div.group img.rounded-full {
  border: 2px solid rgba(244, 114, 255, 0.86) !important;
  box-shadow:
    0 0 10px rgba(217, 70, 239, 0.8),
    0 0 18px rgba(34, 211, 238, 0.28) !important;
}

div.text-sm.text-grey-600 span.font-bold {
  color: #ffffff !important;
  text-shadow: 0 0 6px rgba(244, 114, 255, 0.72) !important;
  font-weight: 900 !important;
}

span.text-\[10px\] {
  color: #67e8f9 !important;
  background: rgba(8, 47, 73, 0.72) !important;
  border: 1px solid rgba(103, 232, 249, 0.48) !important;
  border-radius: 6px !important;
  text-shadow: 0 0 5px rgba(34, 211, 238, 0.7) !important;
}

div.break-all {
  color: #fdf4ff !important;
  line-height: 1.65 !important;
  text-shadow: 0 0 3px rgba(168, 85, 247, 0.26) !important;
}

div.text-xs.text-grey-600 {
  color: rgba(233, 213, 255, 0.74) !important;
}

button.text-gray-400 {
  color: #d8b4fe !important;
  background: rgba(39, 10, 70, 0.58) !important;
  border: 1px solid rgba(216, 180, 254, 0.28) !important;
  border-radius: 8px !important;
  box-shadow: 0 0 8px rgba(168, 85, 247, 0.2) !important;
  transition: color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease !important;
}

button.text-gray-400:hover {
  color: #ffffff !important;
  background: rgba(126, 34, 206, 0.78) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 0 12px rgba(217, 70, 239, 0.58) !important;
}

button.text-gray-400 svg {
  color: currentColor !important;
  stroke: currentColor !important;
  filter: drop-shadow(0 0 4px rgba(232, 121, 249, 0.65)) !important;
}

span.cursor-pointer {
  color: #67e8f9 !important;
  text-shadow: 0 0 5px rgba(34, 211, 238, 0.64) !important;
  font-weight: 700 !important;
  transition: color 0.16s ease, text-shadow 0.16s ease !important;
}

span.cursor-pointer:hover {
  color: #ffffff !important;
  text-shadow:
    0 0 6px rgba(255, 255, 255, 0.86),
    0 0 12px rgba(34, 211, 238, 0.72) !important;
}

div.ml-8.border-l {
  border-left-color: rgba(103, 232, 249, 0.55) !important;
  box-shadow: inset 3px 0 8px rgba(34, 211, 238, 0.12) !important;
}
details.action-panel {
  background:
    linear-gradient(135deg, rgba(20, 8, 38, 0.96), rgba(49, 12, 86, 0.92), rgba(17, 8, 38, 0.96)) !important;
  border: 1px solid rgba(216, 180, 254, 0.62) !important;
  border-radius: 16px !important;
  color: #fdf4ff !important;
  box-shadow:
    0 0 18px rgba(168, 85, 247, 0.42),
    inset 0 0 18px rgba(255, 255, 255, 0.06) !important;
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

details.action-panel summary {
  color: #ffffff !important;
  font-weight: 900 !important;
  letter-spacing: 0.06em !important;
  text-shadow:
    0 0 8px rgba(244, 114, 255, 0.95),
    0 0 16px rgba(34, 211, 238, 0.35) !important;
  cursor: pointer !important;
}

.action-option {
  position: relative !important;
  background:
    linear-gradient(135deg, rgba(39, 10, 70, 0.82), rgba(88, 28, 135, 0.36)) !important;
  border: 1px solid rgba(216, 180, 254, 0.38) !important;
  border-radius: 12px !important;
  color: #fdf4ff !important;
  box-shadow:
    0 0 10px rgba(168, 85, 247, 0.22),
    inset 0 0 10px rgba(255, 255, 255, 0.04) !important;
  transition:
    transform 0.18s ease,
    border-color 0.18s ease,
    box-shadow 0.18s ease,
    background 0.18s ease !important;
}

.action-option:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(103, 232, 249, 0.72) !important;
  background:
    linear-gradient(135deg, rgba(59, 7, 100, 0.9), rgba(126, 34, 206, 0.52)) !important;
  box-shadow:
    0 0 16px rgba(34, 211, 238, 0.34),
    0 0 22px rgba(217, 70, 239, 0.34),
    inset 0 0 12px rgba(255, 255, 255, 0.08) !important;
}

.action-option .option-label {
  color: #67e8f9 !important;
  font-weight: 900 !important;
  text-shadow:
    0 0 6px rgba(34, 211, 238, 0.82),
    0 0 12px rgba(217, 70, 239, 0.36) !important;
}

.action-option .option-text {
  color: #fff7ff !important;
  font-weight: 650 !important;
  line-height: 1.7 !important;
  text-shadow: 0 0 4px rgba(168, 85, 247, 0.28) !important;
}

/* 推荐选项核心样式 */
.action-option.recommended-option {
  background:
    radial-gradient(circle at 12% 0%, rgba(34, 211, 238, 0.2), transparent 34%),
    linear-gradient(135deg, rgba(76, 29, 149, 0.95), rgba(168, 85, 247, 0.58), rgba(39, 10, 70, 0.95)) !important;
  border: 1px solid rgba(244, 114, 255, 0.95) !important;
  box-shadow:
    0 0 18px rgba(217, 70, 239, 0.72),
    0 0 32px rgba(34, 211, 238, 0.24),
    inset 0 0 16px rgba(255, 255, 255, 0.1) !important;
}

.action-option.recommended-option::before {
  content: "RECOMMENDED" !important;
  position: absolute !important;
  top: -11px !important;
  right: 14px !important;
  background:
    linear-gradient(90deg, rgba(217, 70, 239, 1), rgba(34, 211, 238, 0.95)) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.72) !important;
  border-radius: 999px !important;
  padding: 2px 9px !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  letter-spacing: 0.08em !important;
  line-height: 1.4 !important;
  text-shadow: 0 0 5px rgba(255, 255, 255, 0.85) !important;
  box-shadow:
    0 0 10px rgba(217, 70, 239, 0.86),
    0 0 16px rgba(34, 211, 238, 0.5) !important;
}

.action-option.recommended-option::after {
  content: "" !important;
  position: absolute !important;
  inset: 3px !important;
  border-radius: 9px !important;
  border: 1px dashed rgba(255, 255, 255, 0.22) !important;
  pointer-events: none !important;
}

.action-option.recommended-option:hover {
  transform: translateY(-2px) scale(1.01) !important;
  border-color: rgba(103, 232, 249, 1) !important;
  box-shadow:
    0 0 20px rgba(34, 211, 238, 0.52),
    0 0 36px rgba(217, 70, 239, 0.86),
    inset 0 0 18px rgba(255, 255, 255, 0.14) !important;
}

.action-option.recommended-option .option-label {
  color: #ffffff !important;
  text-shadow:
    0 0 7px rgba(255, 255, 255, 0.95),
    0 0 14px rgba(34, 211, 238, 0.72),
    0 0 20px rgba(217, 70, 239, 0.62) !important;
}

.action-option.recommended-option .option-text {
  color: #ffffff !important;
  font-weight: 800 !important;
}

.action-separator {
  border: 0 !important;
  height: 1px !important;
  background:
    linear-gradient(90deg, transparent, rgba(217, 70, 239, 0.78), rgba(34, 211, 238, 0.52), transparent) !important;
  box-shadow: 0 0 8px rgba(217, 70, 239, 0.55) !important;
}