/* 首页 Q2 关系详情面板（relation_detail.js）。类名都带 rd- 前缀；颜色变量来自 .workspace.xv（app.css）。 */
.rd-head { flex: none; padding: 8px 14px 0; border-bottom: 1px solid var(--line); background: var(--white); }
.rd-title { display: flex; align-items: center; gap: 8px; }
.rd-title h3 { margin: 0; font: 600 17px "Songti SC", Georgia, serif; flex: 1; min-width: 0; }
.rd-x { border: 1px solid var(--line); background: var(--white); border-radius: 7px; padding: 1px 8px; font-size: 12px; line-height: 20px; color: var(--muted); cursor: pointer; }
.rd-x:hover { border-color: var(--cinnabar); color: var(--cinnabar); }
.rd-chips { display: flex; flex-wrap: wrap; gap: 5px; margin: 6px 0 4px; }
.rd-chips .tag { line-height: 20px; }
.rd-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 5px; vertical-align: middle; flex: none; }
.rd-tabs { display: flex; gap: 2px; margin-top: 4px; overflow-x: auto; }
.rd-tabs button { border: 0; background: none; padding: 7px 11px; font: 13px system-ui, sans-serif; color: var(--muted); border-bottom: 2px solid transparent; white-space: nowrap; cursor: pointer; }
.rd-tabs button[aria-selected="true"] { color: var(--ink); font-weight: 600; border-bottom-color: var(--cinnabar); }
.rd-n { font-size: 11px; color: var(--muted); margin-left: 3px; }
.rd-body { flex: 1; min-height: 0; overflow: auto; padding: 12px 16px 18px; font: 13.5px/1.65 system-ui, "PingFang SC", sans-serif; color: var(--ink); }
.rd-sum { margin: 0 0 12px; padding: 10px 12px; border-left: 3px solid var(--forest); background: rgba(41,77,66,.07); border-radius: 0 9px 9px 0; font-size: 14.5px; line-height: 1.8; color: var(--ink); white-space: normal; }
.rd-sum small { display: block; margin-top: 4px; color: var(--muted); font-size: 11.5px; }
.rd-kv { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 0 0 10px; color: var(--muted); font-size: 12.5px; }
.rd-kv b { color: var(--ink); font-weight: 600; }
.rd-sec { margin: 14px 0 8px; font-size: 12px; color: var(--muted); font-weight: 600; letter-spacing: .04em; display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.rd-dim { color: var(--muted); font-size: 12.5px; padding: 6px 0; }
.rd-note { margin: 0 0 8px; color: var(--muted); font-size: 12.5px; white-space: normal; }
.rd-meta { color: var(--muted); font-size: 12px; margin: 0; }
.rd-sp { flex: 1; }
.rd-tl { position: relative; margin: 0; padding: 0 0 0 22px; list-style: none; }
.rd-tl::before { content: ""; position: absolute; left: 7px; top: 6px; bottom: 6px; width: 2px; background: var(--line); }
.rd-tl li { position: relative; margin: 0 0 8px; }
.rd-tl li::before { content: ""; position: absolute; left: -20px; top: 7px; width: 12px; height: 12px; border-radius: 50%; background: var(--rd-c, #888); border: 2px solid var(--white); box-shadow: 0 0 0 1px var(--line); }
.rd-tl li.rd-chap { margin: 10px 0 6px -22px; padding-left: 22px; font-size: 11.5px; font-weight: 700; color: var(--forest); letter-spacing: .06em; }
.rd-tl li.rd-chap::before { display: none; }
.rd-item { width: 100%; text-align: left; border: 1px solid transparent; background: none; border-radius: 9px; padding: 4px 8px; cursor: pointer; font: inherit; color: inherit; }
.rd-item:hover { border-color: var(--line); background: rgba(41,77,66,.07); }
.rd-d { display: block; color: var(--muted); font-size: 12.5px; }
.rd-card { border: 1px solid var(--line); border-radius: 10px; margin: 0 0 9px; background: #fffefb; }
.rd-card.flash { animation: rd-flash 1.6s ease-out; border-color: var(--cinnabar); }
@keyframes rd-flash { 0% { box-shadow: 0 0 0 4px rgba(181,85,60,.3); } 100% { box-shadow: 0 0 0 0 rgba(181,85,60,0); } }
.rd-ch { width: 100%; text-align: left; border: 0; background: none; padding: 9px 11px; display: grid; grid-template-columns: auto 1fr auto; gap: 4px 8px; align-items: start; border-radius: 10px; cursor: pointer; font: inherit; color: inherit; }
.rd-ch:hover { background: rgba(41,77,66,.07); }
.rd-ch .rd-dot { margin-top: 7px; }
.rd-ct { font-weight: 600; }
.rd-cm { color: var(--muted); font-size: 12px; font-weight: 400; margin-left: 6px; }
.rd-cdesc { grid-column: 2; color: #3d4640; font-size: 13.5px; line-height: 1.7; }
.rd-car { color: var(--muted); font-size: 12px; align-self: center; }
.rd-card.open .rd-car { transform: rotate(90deg); }
.rd-evs { padding: 0 11px 11px 29px; display: none; }
.rd-card.open .rd-evs { display: block; }
.rd-ev { margin: 6px 0 0; }
.rd-evl { font-size: 11.5px; color: var(--muted); display: flex; justify-content: space-between; gap: 8px; margin-bottom: 3px; }
.rd-para { font: 15px/1.95 "Songti SC", "Noto Serif SC", Georgia, serif; padding: 9px 12px; border-radius: 8px; background: #faf5e8; border: 1px solid rgba(189,138,67,.25); color: #2c3430; overflow-wrap: anywhere; white-space: normal; }
.rd-body mark { background: var(--mark); color: inherit; border-radius: 3px; padding: 1px 0; box-shadow: 0 0 0 2px rgba(220,170,60,.25); }
.rd-lk { border: 0; background: none; color: var(--cinnabar); font: 12px system-ui, sans-serif; padding: 0; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.rd-mini { border: 1px solid var(--line); background: var(--white); border-radius: 7px; font: 12px system-ui, sans-serif; padding: 2px 9px; color: var(--forest); cursor: pointer; }
.rd-mini:hover:not(:disabled) { border-color: var(--cinnabar); color: var(--cinnabar); }
.rd-mini:disabled { opacity: .45; cursor: default; }
.rd-people { display: grid; gap: 6px; }
.rd-people button { display: flex; align-items: center; gap: 8px; text-align: left; border: 1px solid var(--line); background: #fffefb; border-radius: 9px; padding: 7px 10px; cursor: pointer; font: inherit; color: inherit; }
.rd-people button:hover { border-color: var(--cinnabar); }
.rd-people .rd-dot { margin: 0; }
.rd-evrow, .rd-brow { border: 1px solid var(--line); border-radius: 10px; padding: 8px 11px; margin: 0 0 8px; background: #fffefb; }
.rd-evrow details { margin-top: 4px; font-size: 12.5px; } .rd-evrow summary { cursor: pointer; color: var(--cinnabar); font-size: 12px; }
.rd-other { margin-top: 10px; } .rd-other > summary { cursor: pointer; color: var(--muted); font-size: 12.5px; margin-bottom: 8px; }
.rd-bar { position: sticky; top: -12px; z-index: 2; display: flex; align-items: center; gap: 8px; margin: -12px -16px 8px; padding: 10px 16px 8px; background: var(--white); border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.rd-reader { font: 16.5px/2.05 "Songti SC", "Noto Serif SC", Georgia, serif; padding: 14px 18px; border-radius: 10px; background: #faf5e8; border: 1px solid rgba(189,138,67,.28); color: #2c3430; overflow-wrap: anywhere; white-space: normal; margin-top: 6px; }
.rd-reader mark.me { background: rgba(220,170,60,.6); }
.rd-reader mark.other { background: rgba(220,170,60,.25); box-shadow: none; }
.rd-desc { margin: 0 0 10px; padding: 8px 12px; border-left: 3px solid var(--forest); background: rgba(41,77,66,.07); border-radius: 0 8px 8px 0; font-size: 13.5px; }