.choices-area display: flex; flex-direction: column; gap: 14px; margin-top: 20px;
// add theme subscription const originalNotify = player._notify.bind(player); player._notify = function() originalNotify(); const node = this.getCurrentNode(); if (node) applyNodeTheme(node.id); ; player._notify(); // re-bind listeners after override? but subscriptions already safe, just refresh player.subscribe((p) => applyNodeTheme(p.getCurrentNode().id); ); // ensure initial theme applyNodeTheme(player.getCurrentNode().id); xstoryplayer
// set text with immersive quote mark styling storyTextEl.innerHTML = <span class="quote-mark">“</span>$currentNode.text<span class="quote-mark">”</span> ; .choices-area display: flex
/* progress / history indicator */ .progress-indicator margin-left: auto; font-size: 0.75rem; background: #0b1020; padding: 5px 12px; border-radius: 30px; display: inline-flex; align-items: center; gap: 8px; player._notify = function() originalNotify()