/* Floating geometry stays underneath the site's readable, interactive content. */
body { isolation:isolate; }
body > .page, body > .band { position:relative; z-index:1; }
#geometry-background { position:fixed; inset:0; z-index:0; pointer-events:none; }
#scene { display:block; position:fixed; inset:0; width:100%; height:100%; pointer-events:none; }
#shape-targets { pointer-events:none; }
#shape-tip { position:fixed; z-index:10; pointer-events:none; max-width:280px; padding:7px 10px; background:var(--paper,#fff); border:1px solid var(--faint,#999); border-radius:4px; color:var(--ink,#000); font:12px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace; box-shadow:0 2px 8px #00000005; }
#shape-tip[hidden] { display:none; }
#shape-detail { display:block; color:var(--muted,#555); font-size:10px; margin-top:2px; }
.shape-hit { position:fixed; z-index:0; background:transparent; border:0; padding:0; border-radius:50%; cursor:default; outline:none; pointer-events:auto; }
.shape-hit:focus-visible { outline:1px dashed var(--faint,#999); outline-offset:5px; }