:root {
  --scene-tint:rgba(120,100,70,.06); --scene-line:#c3b49a;
}

@media (prefers-color-scheme: dark) {
  :root {
    --scene-tint:rgba(255,238,205,.038); --scene-line:#544c3e;
  }
}

/* Scene markers + banding — a scene reads as one tinted band running from its
   start marker down through its messages to the end marker, tied together by a
   left rail (--scene-line). The feed lays items out with a flex gap, so each
   item inside a scene draws a ::before sliver that fills the gap above it,
   keeping the rail unbroken from marker to marker. */
.scene-marker { display:flex; align-items:center; gap:.45rem; padding:.3rem .5rem .3rem .4rem; border-radius:0 3px 3px 0;
  background:var(--bg2); border:1px solid var(--border); border-left:2px solid var(--scene-line); color:var(--text2); flex-shrink:0; }
.scene-toggle { background:none; border:none; color:var(--accent); cursor:pointer; font-size:10px; padding:.1rem .3rem; border-radius:4px; flex-shrink:0; line-height:1; }
.scene-toggle:hover { background:var(--bg3); }
.scene-icon { flex-shrink:0; font-size:11px; opacity:.75; }
.scene-label { flex:1; font-size:12.5px; font-style:italic; color:var(--text2); }
.scene-edit { opacity:0; background:none; border:none; color:var(--text3); font-size:12px; cursor:pointer; padding:.1rem .3rem; border-radius:4px; }
.scene-marker:hover .scene-edit { opacity:1; }
.scene-edit:hover { background:var(--bg3); color:var(--text); }
.scene-marker-end { position:relative; background:none; border:none; border-left:2px solid var(--scene-line);
  border-top:1px dashed var(--border); border-radius:0; padding:.25rem .5rem .05rem .5rem; }
.scene-end-label { text-align:center; color:var(--text3); font-size:10px; }

/* Content messages inside a scene: faint tint + rail + text inset. */
.msg.in-scene { position:relative; background:var(--scene-tint); border-left:2px solid var(--scene-line);
  border-radius:0 5px 5px 0; padding:.45rem .55rem .45rem .6rem; }
/* Fill the feed's .65rem flex gap above every non-opening scene item so the
   left rail is continuous rather than a stack of dashes. */
.msg.in-scene::before, .scene-marker-end::before { content:''; position:absolute; left:-2px; top:-.65rem; width:2px; height:.65rem; background:var(--scene-line); }
/* A message inside a hidden scene — same dimming as a directly-hidden message. */
.msg.scene-is-hidden { opacity:.5; }