/* Cursor-lit binary/ASCII fragments, behind content rather than over the interface. */
.code-surface{position:relative;isolation:isolate}
.code-reveal{
 position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;
 opacity:0;transition:opacity .45s ease;
 -webkit-mask-image:radial-gradient(circle 190px at var(--code-x,-300px) var(--code-y,-300px),#000 0%,#000000b3 45%,#0000 100%);
 mask-image:radial-gradient(circle 190px at var(--code-x,-300px) var(--code-y,-300px),#000 0%,#000000b3 45%,#0000 100%);
}
.code-reveal pre{
 position:absolute;inset:0 auto auto 0;visibility:hidden;
 margin:0;padding:22px 20px;color:#135b43;opacity:.38;
 font:400 12px/1.65 ui-monospace,SFMono-Regular,Consolas,'Liberation Mono',monospace;
 letter-spacing:.045em;white-space:pre;user-select:none;min-width:2800px;
 animation:binary-frame-cycle 2.2s steps(1,end) infinite;
 animation-delay:calc(var(--code-frame,0) * .55s);
 animation-play-state:paused;
}
.code-active>.code-reveal{opacity:1}
.code-active>.code-reveal pre{animation-play-state:running}
@keyframes binary-frame-cycle{
 0%,24.99%{visibility:visible}
 25%,100%{visibility:hidden}
}
.code-surface>.hero-copy,.code-surface>.hero-demo,
.code-surface>.scene-heading,.code-surface>.scene-canvas,.code-surface>figcaption,
.code-surface>.fitness-ui,.code-surface>.auto-ui,.code-surface>.art-note{position:relative;z-index:1}
.code-surface>.art-note{position:absolute}
.hero>.code-reveal{inset:0}
.hero>.code-reveal pre{font-size:12px;line-height:1.65;padding:22px 20px;min-width:2800px;opacity:.34}
body.motion-paused .code-reveal{opacity:0!important}
body.motion-paused .code-reveal pre{animation-play-state:paused!important}
@media(hover:none),(pointer:coarse),(prefers-reduced-motion:reduce){.code-reveal{display:none}}