/* Motion-only surfaces: boot dissolve, pixel dissolve */

.boot-cover{ z-index:var(--z-boot-cover); background:var(--ink); pointer-events:none; position:fixed; inset:0; }
html[data-booted] .boot-cover{ display:none; }
.boot-canvas{ pointer-events:none; position:fixed; inset:0; z-index:var(--z-boot-canvas); }

/* ponytail fix (kept from source): the overlay must match the section's own box
   exactly (inset:0 + cells that flex to fill), not a fixed-height band pinned to
   the top — otherwise a slow scrub-linked dissolve (js/dissolve.js) can leave an
   empty panel floating above the real content it's meant to be curtaining. */
.pixel-overlay{ position:absolute; inset:0; z-index:2; pointer-events:none; color:var(--ink); }
.pixel-panel{ display:flex; flex-direction:row; width:100%; height:100%; }
.pixel-col{ display:flex; flex-direction:column; flex:1 1 0%; min-width:0; }
.pixel-cell{ flex:1 1 0%; width:100%; background:currentColor; will-change:opacity; }