/* =========================================
   沧澜夜色 - 【暗夜呢喃 · 无框小说沉浸版】UI
   ========================================= */

/* ———— 1. 角色专属对话 (剥离气泡，纯净文字流) ———— */
[class^="chat-"] {
    margin: 14px 0; /* 舒适的段落呼吸感 */
    font-size: 1.08em; /* 稍微放大一点点字体，更适合纯文本阅读 */
    font-weight: 500;
    line-height: 1.7; /* 拉开行高，护眼必备 */
    letter-spacing: 0.5px;
    /* 核心手术：斩断所有气泡框属性 */
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important; 
    text-shadow: none !important; 
    text-align: left !important; /* 取消玩家的右对齐，像小说一样统一左对齐 */
    transition: color 0.3s ease;
}

/* 🟢 沈冬语：隐性病娇（深邃且迷离的幽夜紫） 
   高饱和度但亮度适中，在深色背景下极度清晰且带有病娇的冷感 */
.chat-shen {
    color: #c5a3ff !important; 
}

/* 🔴 柳春盈：惹火纹身师（成熟媚态的暗玫瑰红） 
   不刺眼的深红，像干涸的红酒，极具侵略性 */
.chat-liu {
    color: #ff7373 !important; 
}

/* ⚪ 玩家(我)：直女防线（冰冷清透的冷灰蓝） 
   与红紫形成鲜明对比的冷色调，象征摇摇欲坠的理智 */
.chat-me {
    color: #9abed9 !important; 
}

/* 加点赛博小花活：鼠标/手指悬停在对话上时，颜色微微提亮，增强互动感 */
.chat-shen:hover { color: #d4b8ff !important; }
.chat-liu:hover { color: #ff8c8c !important; }
.chat-me:hover { color: #b0d4f1 !important; }


/* ———— 2. 状态栏终端 (赛博情欲监控外壳) 保留上一版的压迫感 ———— */
.canglan-box {
    background: linear-gradient(180deg, rgba(12, 8, 16, 0.95), rgba(5, 5, 8, 0.98));
    border: 1px solid rgba(255, 85, 85, 0.5);
    border-radius: 8px;
    box-shadow: 0 0 15px rgba(255, 85, 85, 0.2), inset 0 0 20px rgba(189, 147, 249, 0.05);
    margin: 30px 0;
    overflow: hidden;
}

.canglan-box summary {
    list-style: none;
    padding: 16px 20px;
    background: linear-gradient(90deg, rgba(255, 85, 85, 0.25), rgba(189, 147, 249, 0.1), transparent);
    color: #ff79c6;
    font-size: 1.15em;
    font-weight: bold;
    letter-spacing: 1px;
    cursor: pointer;
    border-bottom: 2px solid rgba(255, 85, 85, 0.6);
    user-select: none;
}
.canglan-box summary::-webkit-details-marker { display: none; }
.canglan-box summary::before {
    content: '⚠️';
    margin-right: 12px;
    animation: alert-pulse 2s infinite;
}
@keyframes alert-pulse {
    0% { opacity: 0.5; text-shadow: 0 0 5px #ff5555; }
    50% { opacity: 1; text-shadow: 0 0 15px #ff5555, 0 0 25px #ff79c6; }
    100% { opacity: 0.5; text-shadow: 0 0 5px #ff5555; }
}

/* ———— 3. 核心数据防弹面板 ———— */
.canglan-box .panel-voice {
    border-left: 3px solid #bd93f9;
    background: rgba(189, 147, 249, 0.1);
    margin: 14px 16px; 
    padding: 10px 14px; 
    border-radius: 0 6px 6px 0;
}
.canglan-box .panel-voice p { margin: 6px 0; color: #d4b8ff; text-shadow: none; }

.canglan-box .panel-msg {
    border-left: 3px solid #50fa7b;
    background: rgba(80, 250, 123, 0.08);
    margin: 14px 16px; 
    padding: 10px 14px; 
    border-radius: 0 6px 6px 0;
}
.canglan-box .panel-msg p { margin: 0; color: #a3f7b5; text-shadow: none; }

.canglan-box .panel-data {
    background: rgba(0, 0, 0, 0.6);
    border: 1px dashed #6272a4;
    border-left: 4px solid #ff79c6;
    margin: 16px; 
    padding: 14px 16px; 
    border-radius: 4px;
    transition: all 0.3s ease;
}
.canglan-box .panel-data:hover {
    border-color: #ff79c6;
    background: rgba(20, 10, 20, 0.8);
    box-shadow: inset 0 0 15px rgba(255, 121, 198, 0.15);
}
.canglan-box .panel-data p { 
    margin: 7px 0; 
    font-size: 0.92em; 
    color: #ffb86c; 
    font-family: 'Consolas', 'Courier New', monospace;
    text-shadow: none;
}
.canglan-box b { 
    color: #ff79c6; 
    font-weight: 700;
    text-shadow: none;
}
/* =========================================
   全局护眼容器（旁白与正文的基础底色）
   ========================================= */
text.canglan-bg {
    display: block; /* 必须将<div>转为块级元素，背景才能铺满 */
    background: #11141a; /* 极度深邃的暗灰蓝背景，绝不刺眼，暗示夜色深沉 */
    color: #a4adc0; /* 旁白专属：柔和的莫兰迪灰蓝色，降低对比度保护视力 */
    padding: 16px 12px; /* 给文字一点呼吸空间，不要贴着屏幕边缘 */
    border-radius: 6px; /* 边缘微圆角 */
    font-size: 1.05em; 
    line-height: 1.7; /* 舒适的行高 */
    box-shadow: inset 0 0 40px rgba(0,0,0,0.5); /* 内阴影，增加一种“房间角落”的幽闭感 */
}