body::after{content:"";position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at 50% 42%,transparent 40%,var(--vignette) 100%)}
.sentence{padding:12px 18px;border-top:1px solid var(--edge);border-bottom:1px solid var(--edge);background:linear-gradient(90deg,transparent,var(--bg) 14% 86%,transparent)}
.node{filter:drop-shadow(0 0 8px var(--glow))}
/* The engine now fits the tree via viewBox + preserveAspectRatio="meet" and
   reshapes it to the viewport aspect, so the SVG stays full-bleed at every size
   (no more height/top hack). Lift the sentence clear of the tree on short
   screens so they never overlap. */
svg{overflow:visible}
@media(max-width:600px){.sentence{font-size:13px;bottom:max(20px,env(safe-area-inset-bottom))}}
