/* 剧情正文卡片样式 */
plot {
  display: block;
  font-size: 15px;
  background-color: #ffffff;
  font-family: 'Garamond', 'serif';
  color: #333333;
  border-radius: 12px;
  padding: 18px 20px;             /* 稍微增加内边距，让呼吸感更好 */
  margin: 2px;
  box-shadow: 0 0 25px rgba(0, 0, 0, 0.1);
  border: 1px solid #e0e0e0;
  line-height: 1.6;
  position: relative;            /* 如果未来需要角标仍可扩展 */
}

/* 左上角“📖 剧情正文”标识 + 渐变分割线 */
plot::before {
  content: "📖 剧情正文";
  display: block;                /* 占满一行，自然流动 */
  font-size: 16px;               /* 比正文大一点 */
  font-weight: bold;
  color: #4b3f72;                /* 雅致的深紫，与参考风格呼应 */
  letter-spacing: 0.5px;
  margin-bottom: 12px;           /* 标识与正文的间距 */
  padding-bottom: 10px;          /* 文字与线的距离 */
  background: linear-gradient(to right, #0a1931, #4b3f72) left bottom / 100% 2px no-repeat;
                                  /* 渐变分割线，从左至右由深蓝过渡到深紫 */
}

/* ========== 自定义标签「基础信息」卡片 ========== */
info {
  display: block;
  font-size: 15px;
  background-color: #ffffff;
  font-family: 'Garamond', serif;
  color: #333333;
  border-radius: 12px;
  padding: 18px 20px;
  margin: 16px 0px;
  box-shadow: 0 0 25px rgba(0, 0, 0, 0.1);
  border: 1px solid #e0e0e0;
  line-height: 1.7;
  position: relative;
}

/* 左上角标识 + 渐变分割线 */
info::before {
  content: "📋 基础信息";
  display: block;
  font-size: 16px;
  font-weight: bold;
  color: #4b3f72;
  letter-spacing: 0.5px;
  margin-bottom: 12px;
  padding-bottom: 10px;
  background: linear-gradient(to right, #0a1931, #4b3f72) 
              left bottom / 100% 2px no-repeat;
}

/* 各项信息行 */
time, place, env {
  display: block;
  margin-bottom: 6px;
}

/* 图标自动插入 */
time::before  { content: "🕘 "; }
place::before { content: "🏞️ "; }
env::before   { content: "🎭 "; }
time::before,
place::before,
env::before {
  font-size: 16px;
  margin-right: 2px;
}

/* 标签标题（时间：/ 地点：/ 周围：） */
la {
  font-weight: bold;
  color: #4b3f72;
  margin-right: 4px;
}

/* 空状态隐藏 */
info:empty { display: none; }








/* 全局重置 */
qx,qn,qm,qb,qc,qd,qe,qe2,qf,qg,qh,qi,qj,ql,qa,qo,qp,qq,qr,qs,qt,qu,qv,qw,qz,qy,qx details,qx summary,ua,nb,mc,ca,cb,cc,ma,mb,ms,qn2,na-r,na-t,na-a,tg-r,if-g,npc-r,th-b,pr-b,pr-i{box-sizing:border-box;margin:0;padding:0;}

qx{
--z1:#8e7dff;--z2:#6c5ce7;--z3:#74b9ff;--z4:#0984e3;
--z5:#ff7675;--z6:#d63031;--z7:#fdcb6e;--z8:#ffeaa7;
--z9:#2d3436;--za:#636e72;--zb:#a4b0be;--zc:#b2bec3;
--zd:#eaecf0;--ze:#fcfaff;--zf:#f6f0ff;--zg:#f4f7ff;
--zh:#ebf0ff;--zi:#fff2f6;--zj:#ffe6ee;--zk:#ffdae6;
--zl:rgba(142,125,255,.15);--zm:rgba(116,185,255,.2);
--zn:rgba(255,118,117,.2);--zo:rgba(255,255,255,.8);
--gold:#f39c12;--dark:#2c3e50;--purple:#9b59b6;
--zs:0 8px 24px rgba(142,125,255,.08),inset 0 0 0 1px var(--zo);
--zt:0 8px 24px rgba(116,185,255,.06),inset 0 0 0 1px var(--zo);
display:block;
font-family:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
margin:20px auto;
position:relative;
}

qx::after{content:'TFX';position:absolute;bottom:0;right:2px;font-size:6px;color:rgba(0,0,0,.03);letter-spacing:2px;pointer-events:none;user-select:none;}

/* ===== 折叠按钮 ===== */
qn{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:12px;}
qx details{display:block;}
qx summary{
display:flex;flex-direction:column;align-items:center;justify-content:center;
padding:10px 0;width:100%;
font-size:.65rem;font-weight:700;
color:var(--za);background:#fff;
border:1px solid var(--zd);border-radius:14px;
cursor:pointer;transition:all .25s;
user-select:none;gap:4px;list-style:none;outline:none;
letter-spacing:.5px;
box-shadow:0 2px 6px rgba(0,0,0,.04);
}
summary::-webkit-details-marker{display:none;}
summary[a]::before{content:'👤';font-size:1.3rem;line-height:1;}
summary[b]::before{content:'💞';font-size:1.3rem;line-height:1;}
summary[c]::before{content:'🌍';font-size:1.3rem;line-height:1;}
summary:hover{
background:linear-gradient(135deg,#f0f8ff,#e6f2ff);
border-color:var(--z3);
color:var(--z4);
transform:translateY(-1px);
box-shadow:0 4px 10px rgba(116,185,255,0.15);
}
qx details[open]>summary{
background:linear-gradient(135deg,#e6f2ff,#d4ebff);
color:var(--z4);
border-color:var(--z3);
box-shadow:0 4px 12px rgba(116,185,255,.25);
}

/* 面板显隐 */
ua,nb,mc{display:none;}
qx:has(qn>details:nth-of-type(1)[open])>ua,
qx:has(qn>details:nth-of-type(2)[open])>nb,
qx:has(qn>details:nth-of-type(3)[open])>mc{
display:block;animation:qzfx .3s ease forwards;
}
@keyframes qzfx{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:translateY(0);}}
ua,nb,mc{
background:linear-gradient(to bottom, #fff, #fafafa);
border-radius:0 0 16px 16px;
border:1px solid var(--zd);border-top:none;
box-shadow:0 10px 30px rgba(0,0,0,.08);
padding:16px 0;
}
qy{display:none;}

/* ===== 卡片基底 ===== */
qb{
display:block;margin:8px 20px 16px;padding:18px;
background:var(--ze);border-radius:16px;
border:1px solid var(--zl);box-shadow:var(--zs);
position:relative;overflow:hidden;transition:all .2s;
}
qb:hover{
box-shadow:0 6px 20px rgba(142,125,255,.15);
border-color:var(--purple);transform:translateY(-2px);
}

/* 性别胶囊(租客卡片) */
qb::before{
content:attr(g);position:absolute;top:14px;right:14px;
padding:4px 10px;font-size:.75rem;font-weight:800;
border-radius:16px;
background:linear-gradient(135deg, var(--z5), var(--z6));
color:#fff;box-shadow:0 2px 8px rgba(255,118,117,0.3);
border:1px solid rgba(255,255,255,0.3);
}
qb.sex-m::before{
content:'♂';
background:linear-gradient(135deg, var(--z3), var(--z4));
box-shadow:0 2px 8px rgba(116,185,255,0.3);
}
qb.sex-f::before{
content:'♀';
background:linear-gradient(135deg, var(--z5), var(--z6));
box-shadow:0 2px 8px rgba(255,118,117,0.3);
}
qb.card-sex-m::before,
qb.card-sex-f::before{display:none;}

/* 视角徽章 */
qf{
position:absolute;top:14px;right:14px;
font-size:.7rem;font-weight:700;color:#fff;
background:linear-gradient(135deg, var(--z3), var(--z4));
padding:4px 12px;border-radius:20px;
box-shadow:0 3px 10px rgba(116,185,255,.2);
letter-spacing:.5px;
}
qf[a]{background:linear-gradient(135deg, var(--z3), var(--z4));}
qf[j]{background:linear-gradient(135deg, var(--z8), var(--z7));color:#d35400;}

/* 姓名行 */
na-r{
display:flex;align-items:baseline;
margin-bottom:14px;padding-bottom:10px;
border-bottom:1px dashed rgba(142,125,255,.2);
}
na-t{
font-size:.9rem;font-weight:800;
background:linear-gradient(135deg, var(--dark), #34495e);
-webkit-background-clip:text;background-clip:text;color:transparent;
margin-right:2px;
}
na-a{font-size:.75rem;font-weight:500;color:var(--za);}

/* 用户卡片姓名 */
qc{
display:flex;align-items:center;
margin-bottom:12px;padding-bottom:10px;
border-bottom:1px dashed rgba(142,125,255,.2);
}
qd{
font-size:1.2rem;font-weight:800;
background:linear-gradient(135deg, var(--dark), #34495e);
-webkit-background-clip:text;background-clip:text;color:transparent;
margin-right:2px;
}
qe{font-size:1.1rem;font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,.05);margin-right:8px;}
qe[d]{color:var(--z5);}
qe[c]{color:var(--z3);}
qe2{font-size:.8rem;font-weight:500;color:var(--za);}

/* 性格标签行 */
tg-r{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px;}
qr{
display:inline-block;
background:linear-gradient(135deg, rgba(116,185,255,0.12), rgba(142,125,255,0.08));
border:1px solid rgba(116,185,255,0.25);color:#0984e3;
padding:4px 12px;border-radius:14px;font-size:.7rem;font-weight:600;
box-shadow:0 2px 6px rgba(116,185,255,.08);transition:all .2s;
}
qr:hover{
background:linear-gradient(135deg, rgba(116,185,255,0.18), rgba(142,125,255,0.12));
border-color:rgba(116,185,255,0.4);transform:translateY(-1px);
box-shadow:0 3px 8px rgba(116,185,255,.15);
}
.sex-f qr{
background:linear-gradient(135deg, rgba(253,121,168,0.12), rgba(255,118,117,0.08));
border:1px solid rgba(253,121,168,0.25);color:#e84393;
box-shadow:0 2px 6px rgba(253,121,168,.08);
}
.sex-f qr:hover{
background:linear-gradient(135deg, rgba(253,121,168,0.18), rgba(255,118,117,0.12));
border-color:rgba(253,121,168,0.4);box-shadow:0 3px 8px rgba(253,121,168,.15);
}

/* 信息行 */
if-g{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:10px;}
if-g npc-r{margin-bottom:0;}
npc-r{
display:flex;align-items:baseline;
font-size:.75rem;line-height:1.5;margin-bottom:10px;color:#4b4b4b;
}
npc-r::before{
content:attr(label);color:transparent;
background:linear-gradient(135deg, var(--gold), #e67e22);
-webkit-background-clip:text;background-clip:text;
font-weight:700;width:3em;flex-shrink:0;margin-right:-2px;
}
npc-r[label="身份"]::before{background:linear-gradient(135deg, #8e7dff, #6c5ce7);-webkit-background-clip:text;}
npc-r[label="风格"]::before{background:linear-gradient(135deg, #00b894, #00cec9);-webkit-background-clip:text;}
npc-r[label="外貌"]::before{background:linear-gradient(135deg, var(--gold), #e67e22);-webkit-background-clip:text;}
npc-r[label="关系"]::before{background:linear-gradient(135deg, #fd79a8, #e84393);-webkit-background-clip:text;}
npc-r[label="服饰"]::before{background:linear-gradient(135deg, #fdcb6e, #f39c12);-webkit-background-clip:text;}
npc-r[label="状态"]::before{background:linear-gradient(135deg, #ff7675, #d63031);-webkit-background-clip:text;}

/* 用户信息网格 */
qg{display:grid;grid-template-columns:1fr;gap:8px;margin-bottom:14px;}
qh{
display:flex;align-items:baseline;
font-size:.75rem;color:#4b4b4b;line-height:1.5;margin-bottom:10px;
}
qh[e]{grid-column:1/-1;}
qh::before{
content:attr(data-label);color:transparent;
background:linear-gradient(135deg, var(--gold), #e67e22);
-webkit-background-clip:text;background-clip:text;
font-weight:700;width:3em;margin-right:-2px;flex-shrink:0;
}

/* 内心独白 */
th-b{
display:block;
margin:14px 0;padding:10px 14px 10px 18px;
background:rgba(142,125,255,.03);
border:1px solid rgba(142,125,255,.1);
border-left:3px solid rgba(142,125,255,.3);
border-radius:0 6px 6px 0;
font-size:.73rem;line-height:1.65;color:#6b7280;font-style:italic;
}

/* 私密状态块 */
pr-b{
display:block;
background:linear-gradient(135deg, #ffedf2, #ffe0e8);
border:2px solid #ffc1d1;border-radius:10px;
padding:12px 14px;margin-top:12px;
font-size:.7rem;line-height:1.6;
box-shadow:0 3px 10px rgba(214,48,49,.08);
}
pr-i{
display:flex;align-items:center;
margin-bottom:6px;color:#2d3436;
background:rgba(255,255,255,0.6);
padding:6px 10px;border-radius:6px;
border:1px solid rgba(255,118,117,.2);transition:all .2s;
}
pr-i:hover{background:#fff;border-color:rgba(255,118,117,.5);transform:translateX(3px);}
pr-i:last-child{margin-bottom:0;}
pr-i::before{
content:attr(p);
background:linear-gradient(135deg, var(--z5), var(--z6));
color:#fff;font-weight:800;width:4em;text-align:center;
border-radius:6px;margin-right:10px;flex-shrink:0;
padding:2px 0;letter-spacing:1px;
}

/* 规则块 */
rb{
display:block;margin-top:16px;padding:14px 16px;
background:linear-gradient(135deg, rgba(142,125,255,0.04), rgba(142,125,255,0.01));
border:1px solid var(--zl);border-radius:12px;
}
rt{
display:flex;align-items:center;font-size:.78rem;font-weight:800;
color:var(--z2);margin-bottom:10px;padding-bottom:8px;
border-bottom:1px dashed rgba(142,125,255,0.25);
}
rt::before{content:'📜';margin-right:6px;font-size:.95rem;}
ri{
display:flex;align-items:flex-start;font-size:.73rem;line-height:1.55;
color:#3d3d4d;background:#fff;border-radius:8px;
padding:8px 10px 8px 12px;margin-bottom:8px;
border-left:4px solid var(--z3);box-shadow:0 2px 6px rgba(0,0,0,.03);
}
ri:last-child{margin-bottom:0;}
/* 颜色循环 */
ri:nth-child(2){border-left-color:#00b894;}
ri:nth-child(3){border-left-color:var(--gold);}
ri:nth-child(4){border-left-color:#e84393;}
ri:nth-child(5){border-left-color:var(--purple);}
ri:nth-child(5n+1){border-left-color:var(--z3);}
ri:nth-child(5n+2){border-left-color:#00b894;}
ri:nth-child(5n+3){border-left-color:var(--gold);}
ri:nth-child(5n+4){border-left-color:#e84393;}
ri:nth-child(5n+5){border-left-color:var(--purple);}
rn{
flex-shrink:0;width:1.5em;height:1.5em;line-height:1.5em;text-align:center;
font-size:.65rem;font-weight:800;color:#fff;border-radius:50%;
margin-right:8px;background:var(--z3);
}
ri:nth-child(2) rn{background:#00b894;}
ri:nth-child(3) rn{background:var(--gold);}
ri:nth-child(4) rn{background:#e84393;}
ri:nth-child(5) rn{background:var(--purple);}
ri:nth-child(5n+1) rn{background:var(--z3);}
ri:nth-child(5n+2) rn{background:#00b894;}
ri:nth-child(5n+3) rn{background:var(--gold);}
ri:nth-child(5n+4) rn{background:#e84393;}
ri:nth-child(5n+5) rn{background:var(--purple);}

/* 关系网络 */
qm[a]{
display:block;margin:0 20px 16px;padding:18px 20px;
background:var(--zg);border:1px solid var(--zm);
border-radius:16px;box-shadow:var(--zt);position:relative;
}
qn2[a]{
display:flex;align-items:center;color:var(--z4);
font-size:.8rem;font-weight:800;margin-bottom:14px;padding-bottom:10px;
border-bottom:1px dashed rgba(116,185,255,.3);
}
qn2[a]::before{content:'🔗';font-size:1rem;margin-right:6px;}
qt{display:flex;flex-direction:column;gap:8px;}
qu[a]{
display:flex;align-items:center;font-size:.75rem;line-height:1.5;
background:rgba(255,255,255,.7);border:1px solid var(--zm);
border-radius:8px;padding:8px 12px;
box-shadow:0 2px 8px rgba(9,132,227,.03);transition:all .2s;
}
qu[a]:hover{
background:#fff;border-color:rgba(116,185,255,.4);
transform:translateY(-1px);box-shadow:0 4px 12px rgba(9,132,227,.08);
}
qv[a]{
background:linear-gradient(135deg, var(--z3), var(--z4));
color:#fff;font-weight:800;width:5em;padding:3px 0;text-align:center;
border-radius:6px;margin-right:10px;flex-shrink:0;
box-shadow:0 2px 6px rgba(9,132,227,.3);
text-shadow:0 1px 2px rgba(0,0,0,.2);
letter-spacing:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
qw{color:var(--z9);flex:1;}

/* 记忆系统 */
mc{padding:0;}
ms{
display:block;margin:8px 20px 16px;padding:18px 20px;
background:var(--ze);border-radius:16px;
border:1px solid var(--zl);
box-shadow:0 8px 24px rgba(0,0,0,.04),inset 0 0 0 1px var(--zo);
position:relative;overflow:hidden;
}
ca{display:block;margin-bottom:18px;}
ca:last-child{margin-bottom:0;}
cb{
display:flex;justify-content:space-between;align-items:baseline;
font-size:.72rem;font-weight:800;color:var(--z9);
margin-bottom:10px;padding-bottom:6px;
border-bottom:1px solid rgba(234,236,240,.8);
}
cb qz{
font-size:.63rem;font-weight:600;color:var(--zc);
background:rgba(0,0,0,.03);padding:2px 8px;border-radius:10px;
}
cc{
display:block;font-size:.675rem;line-height:1.5;
background:rgba(255,255,255,.6);
padding:8px 12px 10px;border-radius:8px;
box-shadow:0 2px 8px rgba(0,0,0,.02);border-top:1px solid var(--zo);
}
/* 行内流式记忆条:序号→时间｜地点｜事件,自动换行 */
mb{
display:block;line-height:1.8;word-break:break-word;
padding:7px 6px;border-bottom:1px solid rgba(234,236,240,.5);
border-radius:6px;transition:all .2s;margin:0 -4px;
}
mb:last-child{border-bottom:none;}
mb:hover{background:rgba(142,125,255,.06);}
mb i,mb t,mb l,mb e{display:inline;}
/* 序号圆球样式 */
mb i{
display:inline-block;
width:1.4em;height:1.4em;line-height:1.4em;
text-align:center;font-style:normal;font-weight:700;
color:#fff;font-size:.62rem;
background:linear-gradient(135deg, rgba(142,125,255,0.85), rgba(108,92,231,0.9));
border-radius:50%;margin-right:7px;
box-shadow:0 2px 5px rgba(142,125,255,0.25);
vertical-align:.10em;
}
mb t{font-weight:600;color:var(--z1);font-family:monospace;}
mb l{color:var(--za);}
mb e{color:var(--z9);}
/* 分隔符:时间、地点之后各插一个 | */
mb t::after,mb l::after{
content:'｜';color:#2d3436;font-weight:500;
margin:0 6px;font-family:'Inter',sans-serif;
}
/* 三档记忆颜色区分 */
ms>ca:nth-of-type(1) cb{color:#3498db;}
ms>ca:nth-of-type(1) cc{background:linear-gradient(90deg, rgba(52,152,219,.04), transparent);}
ms>ca:nth-of-type(1) cc t{color:#3498db;}
ms>ca:nth-of-type(1) mb i{background:linear-gradient(135deg, #74b9ff, #3498db);box-shadow:0 2px 5px rgba(52,152,219,0.3);}
ms>ca:nth-of-type(2) cb{color:#f39c12;}
ms>ca:nth-of-type(2) cc{background:linear-gradient(90deg, rgba(243,156,18,.04), transparent);}
ms>ca:nth-of-type(2) cc t{color:#f39c12;}
ms>ca:nth-of-type(2) mb i{background:linear-gradient(135deg, #fdcb6e, #f39c12);box-shadow:0 2px 5px rgba(243,156,18,0.3);}
ms>ca:nth-of-type(3) cb{color:#9b59b6;}
ms>ca:nth-of-type(3) cc{background:linear-gradient(90deg, rgba(155,89,182,.04), transparent);}
ms>ca:nth-of-type(3) cc t{color:#9b59b6;}
ms>ca:nth-of-type(3) mb i{background:linear-gradient(135deg, #b39ddb, #9b59b6);box-shadow:0 2px 5px rgba(155,89,182,0.3);}





/* 直播间样式 - 完整修复版 */

/* 容器：负责裁剪可视区域 */
l1 {
  display: block;
  background: #000a;
  padding: 10px;
  border-radius: 5px;
  margin: 10px 0;
  margin-bottom: 20px;
  overflow: hidden;    /* 容器裁剪，没问题 */
  position: relative;  /* 建立定位上下文 */
}

/* ★ 关键修复：滚动轨道 */
m1, m2, m3 {
  display: inline-block;   /* 改为 inline-block，宽度由内容决定 */
  white-space: nowrap;
  /* 移除 overflow: hidden，让内容完整存在 */
  margin-bottom: 10px;
  padding-left: 100%;      /* 初始位置推到容器右侧外 */
  animation: scroll linear infinite;
}

/* 各轨道速度 - 因为移动距离变了，适当调整时长 */
m1 { animation-duration: 18s; }
m2 { animation-duration: 24s; }
m3 { animation-duration: 21s; }

/* 弹幕条目 */
m1 span, m2 span, m3 span {
  display: inline-block;
  margin-right: 50px;
  padding: 2px 5px;
  border-radius: 3px;
  animation: fadeIn 0.5s;
}

/* 礼物样式 */
.gift {
  background: linear-gradient(45deg, #ffd700, #ffa500);
  color: #000;
  padding: 3px 8px;
  border-radius: 15px;
}

/* 高亮弹幕 */
.highlight {
  text-shadow: 0 0 5px #fff;
}

/* ★ 关键修复：滚动动画 */
@keyframes scroll {
  from { transform: translateX(0); }       /* 起点：padding-left 已经把内容推到右边 */
  to   { transform: translateX(-100%); }   /* 终点：移动自身完整宽度（含 padding） */
}

/* 淡入动画 */
@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}



/* 主容器 */
e1 {
  display: block;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.04);
  margin: 20px auto;
  overflow: hidden;
  border: 1px solid #eaecf0;
  padding: 12px 20px;
  padding-top: 0;
}

/* 用伪元素生成标题栏 */
e1::before {   /* 原来是 c1::before */
  content: attr(t);
  display: flex;
  align-items: center;
  padding: 16px 20px;
  margin: 0 -20px 12px -20px;
  background: #ffffff;
  border-bottom: 1px solid #eaecf0;
  font-size: 15px;
  font-weight: 700;
  color: #2d3436;
  position: relative;
  padding-left: 30px;
}

/* 选项项 */
e1 > x {   /* 原来是 c1 > x */
  display: block;
  background: #fff;
  padding: 10px 14px;
  margin-bottom: 8px;
  border-radius: 6px;
  border: 1px solid #e5e7eb;
  color: #374151;
  font-size: 0.875rem;
  line-height: 1.5;
  cursor: pointer;
  transition: all 0.3s ease;
}

e1 > x:last-child {
  margin-bottom: 0;
}

e1 > x:hover {
  background: #fdf2f8;
  border-color: #e11d48;
  box-shadow: 0 0 8px rgba(225, 29, 72, 0.15);
  transform: translateX(2px);
}