/* ============================================================================
   Varelyno v11: smoothness. Nothing here changes how a settled screen looks;
   it only removes work the browser does while things move.
   ========================================================================== */

/* A freshly drawn map shows its fog and depth at once: without this every
   circle faded its colour in over half a second, about twenty at a time. */
html.vs-drawing .graph-node{transition:none!important}

/* While the window is being resized or moved between screens, decorative
   motion holds still and nothing glides: the browser only has to lay out. */
html.vs-resizing *,html.vs-resizing *::before,html.vs-resizing *::after{
  animation-play-state:paused!important;transition:none!important}

/* The focus project's halo pulsed its shadow, which repaints every frame for
   as long as the map is open. The same glow, painted once, now fades instead. */
html.v-universe[data-motion=full] .graph-world:not(.polish-large) .graph-node.project-node.focus:before,
html.v-universe[data-motion=full] .universe-studio-orb:before{
  animation:vs-halo 5s ease-in-out infinite;
  box-shadow:0 0 30px color-mix(in srgb,var(--node,var(--v-accent)) 28%,transparent)}
@keyframes vs-halo{0%,100%{opacity:.4}50%{opacity:.85}}

/* The warm glow behind busy projects is blurred: give it its own layer so its
   breathing moves a finished picture instead of blurring it again each frame. */
.graph-node.project-node::before{will-change:transform,opacity}

/* Every scrolling area takes the theme accent, like the menu. */
/* set once on the page: it passes down to every element (set on each one,
   elements that transition "all" would animate it on every redraw) */
html{scrollbar-color:color-mix(in srgb,var(--nhs) 45%,transparent) transparent}
html *{scrollbar-width:thin}
html ::-webkit-scrollbar{width:8px;height:8px}
html ::-webkit-scrollbar-track{background:transparent}
html ::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--nhs) 45%,transparent);border-radius:999px;border:2px solid transparent;background-clip:padding-box}
html ::-webkit-scrollbar-thumb:hover{background-color:color-mix(in srgb,var(--nhs) 75%,transparent)}
html ::-webkit-scrollbar-corner{background:transparent}

@media(prefers-reduced-motion:reduce){
  html.v-universe[data-motion=full] .graph-world:not(.polish-large) .graph-node.project-node.focus:before,
  html.v-universe[data-motion=full] .universe-studio-orb:before{animation:none}
}
