/* Shared effect hooks. Binary Glitch Sweep targets small text; display titles are excluded.
 * Every display heading, link and image/video shares these hooks.
 * Add one rule here to update that entire element family across all pages.
 * Keep reduced-motion and keyboard behaviour when effects are introduced.
 */
.fx-heading { /* display headings: optional shared text effect */ }
.fx-link { /* anchors, buttons and skill summaries: optional shared interaction */ }
.fx-media { /* images, videos and project iframes: optional shared visual effect */ }
@media(prefers-reduced-motion:reduce){
 /* Future motion alternatives belong here. */
}

/* Original text stays in flow, selectable and accessible during the visual reveal. */
.binary-text-active,.binary-text-active *{color:transparent!important;text-shadow:none!important}
.binary-sweep-layer{position:absolute;top:0;left:0;width:100%;height:0;pointer-events:none;z-index:100;overflow:visible}
.binary-sweep-glyph{position:absolute;display:block;text-align:left;white-space:pre;pointer-events:none;font-kerning:normal}

/* Lenis uses the native document scroll; no transformed content wrapper. */
html.lenis,html.lenis body{height:auto}
.lenis :is(dialog,.messages,[data-native-scroll]){overscroll-behavior:contain}

/* Queued Experience text keeps its space and accessible content. */
.binary-entry-pending{opacity:0!important}

/* A single viewport theme. Scroll only chooses a destination; time drives the fade. */
html[data-page-theme="light"] :is(body,.site-section){--surface:var(--light-background);--text:var(--black);--muted:rgb(0 0 0 / .6);--guide:rgb(0 0 0 / .08);--line:rgb(0 0 0 / .2)}
html[data-page-theme="dark"] :is(body,.site-section){--surface:var(--black);--text:var(--beige);--muted:rgb(223 210 203 / .6);--guide:rgb(255 255 255 / .08);--line:rgb(255 255 255 / .2)}
.section-theme-ready :is(body,.site-section){transition:background-color 650ms ease-in-out,color 650ms ease-in-out}
.section-theme-ready :is(.header-clock,.site-nav,.hero-description,.hero-scroll,.experience-date,.project-tags){transition:color 650ms ease-in-out}
.section-theme-ready .grid-guides span{transition:border-color 650ms ease-in-out}
html[data-page-theme="dark"] .link--solid{background:var(--beige);color:var(--black);border-color:var(--beige)}
.section-theme-ready .link--solid{transition:background-color 650ms ease-in-out,color 650ms ease-in-out,border-color 650ms ease-in-out}
@media(prefers-reduced-motion:reduce){.section-theme-ready :is(body,.site-section,.header-clock,.site-nav,.hero-description,.hero-scroll,.experience-date,.project-tags,.grid-guides span,.link--solid){transition:none}}

/* Image shader overlays do not capture links or affect document dimensions. */
.image-hover-canvas{position:absolute;display:block;pointer-events:none;z-index:2;border-radius:inherit}
img.image-hover-rendered{opacity:0}