.plot-time-panel { margin:0 0 20px; padding:18px 20px; background:var(--card); border:1px solid var(--border); border-radius:14px; color:var(--text); }
.plot-time-panel[hidden] { display:none; }
.plot-time-head { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.plot-time-eyebrow { display:inline-block; margin-right:10px; font-size:11px; color:var(--text-sub); margin-bottom:5px; letter-spacing:.08em; }
.plot-time-head strong { font-size:19px; }
.plot-time-mode { display:flex; align-items:center; gap:8px; color:var(--text-sub); font-size:12px; }
.plot-time-mode select { width:auto; max-width:160px; background:var(--card-2); color:var(--text); border:1px solid var(--border); border-radius:8px; padding:8px 10px; }
.plot-time-track { display:flex; align-items:flex-start; gap:14px; margin:12px 0 10px; }
.plot-time-track button { flex:none; width:30px; height:30px; border:1px solid var(--border); background:var(--card-2); color:var(--text); border-radius:8px; font-size:22px; cursor:pointer; }
.plot-time-track button:disabled { opacity:.35; cursor:default; }
.plot-time-range { display:block; flex:1; min-width:0; padding-top:3px; }
.plot-time-range input { width:100%; padding:0; height:24px; margin:0; accent-color:var(--brand, #235b50); cursor:ew-resize; }
.plot-time-range input:disabled { cursor:default; }
.plot-time-endpoints { display:flex; justify-content:space-between; color:var(--text-sub); font-size:11px; }
.plot-time-story { padding-top:12px; border-top:1px solid var(--border); }
.plot-time-story p { margin:0 0 6px; font-size:13px; line-height:1.8; overflow-wrap:anywhere; }
.plot-time-story small { display:block; font-size:11.5px; color:var(--text-sub); line-height:1.8; }
.plot-time-people { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-top:10px; font-size:11px; }
.plot-time-people span { color:var(--text-sub); margin-right:4px; }
.plot-time-people b { background:var(--card-2); border:1px solid var(--border); border-radius:5px; padding:3px 7px; font-weight:500; }
.plot-time-emotion-list { margin-top:14px; border-top:1px solid var(--border); padding-top:12px; }
.plot-time-emotion-list summary { font-size:12px; color:var(--text-sub); cursor:pointer; }
.plot-time-emotion-list article { margin-top:12px; }
.plot-time-emotion-list article>div { display:flex; flex-wrap:wrap; align-items:center; gap:8px; font-size:12px; }
.plot-time-emotion-list article span, .plot-emotion-plan summary>span { color:var(--brand,#235b50); border:1px solid var(--border); background:var(--card-2); border-radius:5px; padding:2px 6px; font-size:11px; }
.plot-time-emotion-list article b { font-weight:400; color:var(--text-sub); }
.plot-time-emotion-list article p { margin:5px 0 0; font-size:12px; color:var(--text-sub); line-height:1.8; }
.plot-time-map-names { fill:var(--brand,#235b50); font-size:10px; font-weight:700; paint-order:stroke; stroke:var(--card); stroke-width:3px; pointer-events:none; }
.plot-time-map-owner { fill:var(--text-sub); font-size:9px; paint-order:stroke; stroke:var(--card); stroke-width:3px; pointer-events:none; }
.plot-mnode.is-time-active .plot-mnode-halo { stroke:var(--brand,#235b50); stroke-width:2.5px; opacity:1; }
.plot-gnode.is-time-active circle { stroke:var(--brand,#235b50)!important; stroke-width:3px!important; }
.plot-emotion-plan details { margin:14px 0; padding:16px; border:1px solid var(--border); border-radius:10px; background:var(--card); }
.plot-emotion-plan summary { font-weight:600; font-size:14px; cursor:pointer; }
.plot-emotion-plan details>p { color:var(--text-sub); font-size:12px; }
.plot-emotion-plan ol { list-style:none; padding:0; margin:12px 0 0; }
.plot-emotion-plan li { display:flex; gap:16px; border-top:1px solid var(--border); padding:12px 0; font-size:12px; line-height:1.8; }
.plot-emotion-plan li>b { flex:none; color:var(--text-sub); font-weight:500; min-width:56px; }
.plot-emotion-plan li p { margin:4px 0 0; color:var(--text-sub); }
@media(max-width:650px) {
    .plot-time-panel { padding:14px 12px; border-radius:10px; }
    .plot-time-mode { font-size:0; }
    .plot-time-mode select { font-size:12px; max-width:132px; }
    .plot-time-track { gap:8px; }
}

.plot-time-range .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.plot-time-emotion-list summary>span { margin-left:10px; color:var(--text); font-size:12px; }