/* Local reactions belong to the illustration, with no change to live data. */
.reactive-surface{--parallax-x:0px;--parallax-y:0px;--tilt-x:0deg;--tilt-y:0deg;isolation:isolate}
.reactive-surface:is(.holder-visual,.watch-visual){transform:perspective(1000px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y));transition:transform .18s ease-out,border-color .25s,box-shadow .3s}
.reactive-surface.is-pointed,.reactive-surface:focus-within{border-color:#ffffff65;box-shadow:0 20px 70px #0006,inset 0 0 55px #ffffff05}
.reactive-surface:before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(180px circle at var(--mx,50%) var(--my,50%),#e6e6ff15,transparent 75%);opacity:0;transition:opacity .25s}
.reactive-surface.is-pointed:before,.reactive-surface:focus-within:before{opacity:1}
.surface-effects{position:absolute;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none;z-index:5}
.surface-ring{position:absolute;border:1px solid #eeeefeaa;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 22px #dfdfff22,inset 0 0 16px #dfdfff18;pointer-events:none}
.surface-spark{fill:#f5f3ff;stroke:none;filter:drop-shadow(0 0 4px #e6e0ff);pointer-events:none}
.holder-visual :is(.visual-core,.holder-sat),.watch-radar{color:#e5e5f2;padding:0;cursor:pointer;font:inherit;appearance:none}
.holder-visual :is(.visual-core,.holder-sat){transition:scale .25s,background .25s,border-color .25s,box-shadow .25s}
.holder-visual .visual-core{translate:calc(var(--parallax-x)*1.3) calc(var(--parallax-y)*1.3)}
.holder-visual .visual-orbit{translate:calc(var(--parallax-x)*-.45) calc(var(--parallax-y)*-.45);transition:translate .2s}
.holder-visual .visual-core:hover,.holder-visual .visual-core:focus-visible{scale:1.12;background:#24242d;box-shadow:0 0 65px #e6e6ff32,inset 0 0 25px #ffffff13}
.holder-visual .holder-sat:is(:hover,:focus-visible,.is-traced){scale:1.2;background:#2d2d36;border-color:#f0f0ff;box-shadow:0 0 30px #dddfff40,0 0 0 6px #ffffff06}
.holder-visual :is(.holder-sat,.visual-core):focus-visible{outline:2px solid #ececff;outline-offset:6px}
.holder-lines{pointer-events:none;overflow:visible}.holder-lines [data-holder-link]{transition:stroke .2s,stroke-width .2s,filter .2s}
.holder-visual:hover .holder-lines [data-holder-link]{stroke:#ffffff7a}.holder-lines [data-holder-link].is-traced{stroke:#eeeefe;stroke-width:2.3;filter:drop-shadow(0 0 5px #e4e4ff)}
.holder-visual[data-trace]:not([data-trace="-1"]) .visual-core{border-color:#ececff;box-shadow:0 0 55px #dadaff28,inset 0 0 20px #ffffff15}
.holder-visual .visual-captions{transition:translate .25s;translate:calc(var(--parallax-x)*-.3) 0}

.study-visual{overflow:hidden}.study-visual .thread-map{position:relative;translate:calc(var(--parallax-x)*.5) calc(var(--parallax-y)*.5);transition:translate .2s}
.thread-map .graph-node{cursor:pointer;outline:none;pointer-events:all}
.thread-map .graph-node>circle:not(.token-orbit){transition:scale .25s,fill .25s,stroke-width .25s;transform-box:fill-box;transform-origin:center}
.thread-map .graph-node.is-traced,.thread-map .graph-node:focus-visible{opacity:1!important;filter:drop-shadow(0 0 9px #ffffff70)}
.thread-map .graph-node:is(.is-traced,:focus-visible)>circle:not(.token-orbit){scale:1.2;fill:#272932;stroke-width:2}
.thread-map .graph-node:focus-visible>circle:not(.node-dot){stroke:#fff;stroke-dasharray:3 3}
.thread-study .thread-edge.is-traced{opacity:1!important;stroke:#f2f1ff;stroke-width:3;filter:drop-shadow(0 0 6px #eae9ff);stroke-dasharray:9 5;animation:connection-charge .8s linear infinite}
.thread-map .token-orbit{transform-box:fill-box;transform-origin:center;transition:scale .3s}.thread-map .node-token.is-traced .token-orbit{scale:1.18;stroke:#dedeee;animation:token-inspection 12s linear infinite}
.study-visual.is-pointed .ghost-links{opacity:.28}.ghost-links{transition:opacity .3s}
@keyframes connection-charge{to{stroke-dashoffset:-28}}@keyframes token-inspection{to{rotate:360deg}}

.watch-radar{border:0;background:transparent;translate:calc(var(--parallax-x)*-.6) calc(var(--parallax-y)*-.6);transition:scale .3s,translate .2s,filter .3s;z-index:1}
.watch-radar:hover,.watch-radar:focus-visible{scale:1.08;filter:drop-shadow(0 0 15px #ffffff18)}.watch-radar:focus-visible{outline:1px dashed #e6e6ee;outline-offset:5px;border-radius:50%}
.watch-radar:hover>span,.watch-radar:focus-visible>span{border-color:#ffffff77}.watch-radar>span{transition:border-color .25s}
.watch-radar .radar-sweep{background:conic-gradient(transparent 250deg,#ffffff02 290deg,#eeecff88 359deg,transparent);animation:none;pointer-events:none}
.watch-links{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;fill:none;z-index:1}.watch-signal{stroke:#e6e4ff55;stroke-width:1.2;transition:stroke .3s,stroke-width .3s}.watch-visual:is(:hover,:focus-within) .watch-signal{stroke:#e6e4ffbb;stroke-width:2}
.watch-visual .signal-line{display:none}.watch-visual .notification{cursor:pointer;z-index:2;translate:var(--parallax-x) var(--parallax-y);transition:scale .3s,border-color .25s,box-shadow .25s;outline:none}
.watch-visual .notification:is(:hover,:focus-visible){scale:1.035;border-color:#e4e4ffb0;box-shadow:0 0 40px #ddddff17,0 20px 50px #0008}.watch-visual .notification:focus-visible{outline:2px solid #eee;outline-offset:5px}
.watch-visual:is(:hover,:focus-within) .watch-grid{opacity:1;filter:brightness(1.6)}.watch-grid{transition:filter .3s}

.lookup-preview{position:relative;display:block;width:min(100%,320px);padding:0;margin-top:20px;background:none;border:0;color:#e3e3eb;cursor:pointer;border-radius:12px}
.lookup-preview>svg{display:block;width:100%;height:auto;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.2}
.lookup-preview:focus-visible{outline:1px dashed #e8e8ee;outline-offset:4px}
.lookup-preview :is(.scan-source>rect,.scan-result>rect,.scan-center>circle:first-child){fill:#14151a;transition:fill .25s,stroke .25s}
.scan-source,.scan-result{transition:translate .25s;translate:calc(var(--parallax-x)*.4) calc(var(--parallax-y)*.35)}
.scan-link{stroke:#92939e;stroke-dasharray:3 5;transition:stroke .3s}.scan-branch{stroke:#ffffff1f;transition:stroke .3s}.scan-orbit{stroke:#787b88;stroke-dasharray:2 5;transform-origin:160px 45px}.scan-beam{stroke:#efefff;opacity:.55}
.lookup-preview:is(:hover,:focus-visible) .scan-center,.lookup-section.is-scanning .scan-center{filter:drop-shadow(0 0 7px #ffffff60)}
.lookup-section:is(.is-pointed,.is-scanning) .scan-branch{stroke:#ffffff45}.lookup-section.is-scanning .scan-link{stroke:#eeeefe;animation:connection-charge 1.4s linear infinite}
.lookup-section.is-scanning .scan-orbit{animation:token-inspection 10s linear infinite}.lookup-section.is-scanning .scan-beam{opacity:1;animation:scan-reading 1.4s ease-in-out infinite alternate}
.lookup-input{position:relative}.lookup-input:after{content:'';position:absolute;left:0;bottom:-1px;height:1px;width:calc(var(--address-progress,0)*100%);background:#ececff;box-shadow:0 0 8px #eee5;pointer-events:none;transition:width .15s}
@keyframes scan-reading{from{translate:0 -7px}to{translate:0 7px}}
@media(max-width:700px){.lookup-preview{max-width:260px;margin-top:14px}.holder-visual .holder-sat{min-width:44px;min-height:44px}.holder-visual .visual-core{min-width:76px;min-height:76px}.surface-ring{box-shadow:none}.watch-visual .notification:active{scale:1.025}}
html[data-motion=paused] .reactive-surface,html[data-motion=paused] .reactive-surface *{animation:none!important;transition:none!important}
html[data-motion=paused] .reactive-surface:is(.holder-visual,.watch-visual){transform:none}
html[data-motion=paused] .reactive-surface :is(.visual-core,.holder-sat,.graph-node>circle,.watch-radar,.notification){scale:1!important}
@media(prefers-reduced-motion:reduce){.reactive-surface,.reactive-surface *{animation:none!important;transition:none!important}.reactive-surface:is(.holder-visual,.watch-visual){transform:none}.reactive-surface :is(.visual-core,.holder-sat,.graph-node>circle,.watch-radar,.notification){scale:1!important}}

.holder-visual,.study-visual,.watch-visual{cursor:crosshair}.holder-visual :is(.holder-sat,.visual-core):is(:hover,:focus-visible),.watch-visual .notification:is(:hover,:focus-visible){animation-play-state:paused}

.notification-flare{position:absolute;inset:-1px;border:1px solid #f0f1ff;border-radius:inherit;box-shadow:0 0 45px #dadaff40;opacity:0;pointer-events:none}