/* ================= Page glow + lens under the mouse ================= */
/* A faint orb that only shows while the lens is bending content; the warp is SVG #page-warp (glow.js). */
.page-glow {
    --glow: 0;
    position: fixed; left: 0; top: 0; z-index: calc(var(--z-nav) - 1); pointer-events: none;
    width: 120px; height: 120px; margin: -60px 0 0 -60px; border-radius: 50%;
    background: radial-gradient(closest-side, color-mix(in srgb, var(--interactive) calc(var(--glow) * 16%), transparent), transparent 75%);
    opacity: 0; transition: opacity 240ms var(--ease-out);
    will-change: transform, opacity;
    mix-blend-mode: multiply;
}
.page-glow.is-on { opacity: 1; }
[data-theme="dark"] .page-glow { mix-blend-mode: screen; background: radial-gradient(closest-side, color-mix(in srgb, var(--interactive) calc(var(--glow) * 24%), transparent), transparent 75%); }
/* only the block under the pointer carries the warp filter */
.is-warping { will-change: filter; }

/* ================= CB: square controls everywhere ================= */
:root { --r-pill: 0px; }
button:not([role="switch"]), .btn, .ask-trigger, .theme-toggle, [type="submit"], [type="button"] { border-radius: 0 !important; }

/* ================= Intro composition: pieces wait hidden until the intro brings them in ================= */
/* failsafe: if the intro never runs, everything shows after 4s anyway */
@keyframes v2-compose-failsafe { to { opacity: 1; } }
html.js:not(.is-composed) [data-nav],
html.js:not(.is-composed) [data-compose] { opacity: 0; animation: v2-compose-failsafe 0.4s 4s forwards; }
@media (prefers-reduced-motion: reduce) { html.js:not(.is-composed) [data-nav], html.js:not(.is-composed) [data-compose] { opacity: 1; animation: none; } }

/* headings no longer slide up through a mask: lines surface out of depth, so they must not clip */
.split-line { overflow: visible; }
/* elements waiting to surface start slightly scaled up; clip (not hidden) so they never add a
   sideways scroll, without creating a scroll container that would break sticky and pins */
html, body { overflow-x: clip; }
