/* The comparison tools are available on demand in every direction. */
.header-actions{display:flex;gap:26px;align-items:center}
.theme-menu-button{display:inline-flex;align-items:center;gap:18px;min-height:44px;padding:8px 14px;background:transparent;border:1px solid currentColor;color:inherit;font:inherit;font-size:12px;cursor:pointer;border-radius:4px}
.theme-menu-button[hidden]{display:none}
.theme-menu-button span{font-size:20px;transition:transform .2s}
.theme-menu-button[aria-expanded=true] span{transform:rotate(45deg)}
.theme-menu-button:focus-visible{outline:3px solid var(--accent);outline-offset:5px}
.review-controls{left:auto;right:4.5vw;top:94px;bottom:auto;transform:none;flex-wrap:wrap;gap:14px;width:max-content;max-width:calc(100vw - 24px);box-shadow:0 16px 55px #0002}
.review-controls label span{min-height:36px;display:grid;place-items:center}
.future-background,.future-only{display:none}
.future-background[hidden]{display:none}

/* One coherent holographic material, with theme-independent depth and motion. */
html[data-energy=futuristic]{--paper:#eaf4fa;--ink:#122f51;--muted:#3c5973;--accent:#1656bb;--on-accent:#f2faff;--wash:#d4e7f180;--line:#12529c35;--display:Arial,Helvetica,sans-serif}
html[data-energy=futuristic][data-theme=dark]{--paper:#050e20;--ink:#e1f6ff;--muted:#adc5d9;--accent:#70f5df;--on-accent:#062527;--wash:#142c4280;--line:#7ccde039}
html[data-energy=futuristic] body{isolation:isolate}
html[data-energy=futuristic] .future-background{display:block;position:fixed;inset:0;z-index:-1;pointer-events:none;width:100%;height:100%}
html[data-energy=futuristic] .future-background[hidden]{display:none}
html[data-energy=futuristic] h2{font-weight:500;letter-spacing:-.055em}
html[data-energy=futuristic] h2 em{font-style:normal;font-weight:300}
html[data-energy=futuristic] .opening{background:transparent}
html[data-energy=futuristic] .hero-grain{background:linear-gradient(90deg,var(--paper),transparent 95%);opacity:.55}
html[data-energy=futuristic] .hero-kicker{letter-spacing:.23em}
html[data-energy=futuristic] .opening h1{font-family:Arial,Helvetica,sans-serif;font-weight:300;font-size:clamp(105px,13.4vw,215px);letter-spacing:-.08em;line-height:.88}
html[data-energy=futuristic] .opening h1 span{font-style:normal;font-weight:650}
html[data-energy=futuristic] .hero-sigil{right:9vw;top:27%;width:29vw;color:var(--accent);transform:translate3d(var(--parallax-x,0px),calc(var(--parallax-y,0px) + var(--scroll-shift,0px)),0) rotate(-6deg);will-change:transform}
html[data-energy=futuristic] .hero-sigil::before{display:none}
html[data-energy=futuristic] .hero-sigil svg{overflow:visible;filter:drop-shadow(0 0 22px color-mix(in srgb,var(--accent),transparent 65%))}
html[data-energy=futuristic] .human-head,html[data-energy=futuristic] .human-body{fill:url(#human-wire);stroke:currentColor;stroke-width:1;vector-effect:non-scaling-stroke}
html[data-energy=futuristic] .sigil-cut{stroke:currentColor;opacity:.65;stroke-width:1}
html[data-energy=futuristic] .future-only{display:block}
.hologram-rings{stroke:currentColor;stroke-width:.5;opacity:.7;transform-origin:120px 162px}
.hologram-scan{fill:currentColor;opacity:.22;transform-origin:120px 162px}
html[data-energy=futuristic] .hero-bottom h2{font-size:clamp(28px,3vw,46px)}
html[data-energy=futuristic] .connections{background:var(--wash);backdrop-filter:blur(4px)}
html[data-energy=futuristic] .map-grid{opacity:.5}
html[data-energy=futuristic] .map-orbits{stroke:var(--accent);stroke-dasharray:2 8;opacity:.45;transform-origin:550px 312px}
html[data-energy=futuristic] .map-lines{stroke:var(--accent);opacity:.6;stroke-width:1}
html[data-energy=futuristic] .person-disc{transform:translate3d(calc(var(--parallax-x,0px) * -.3),calc(var(--parallax-y,0px) * -.3),0)}
html[data-energy=futuristic] .person-disc>circle:first-child{fill:var(--paper);stroke:var(--accent);stroke-width:1.5;filter:drop-shadow(0 0 15px color-mix(in srgb,var(--accent),transparent 50%))}
html[data-energy=futuristic] .person-head,html[data-energy=futuristic] .person-body{fill:var(--accent)}
html[data-energy=futuristic] .node-disc,html[data-energy=futuristic] .consent-gate rect{fill:var(--paper);stroke-width:1}
html[data-energy=futuristic] .app-node rect{rx:6;fill:var(--paper);stroke:var(--accent);stroke-width:1}
html[data-energy=futuristic] .app-node path{stroke:var(--accent)}
html[data-energy=futuristic] .proof-orbit{border:1px dashed var(--accent);transform:rotate(-25deg) scaleX(1.2)}
html[data-energy=futuristic] .proof-orbit.second{transform:rotate(40deg) scaleX(.7);opacity:.5}
html[data-energy=futuristic] .large-proof{font-family:Arial,Helvetica,sans-serif;font-weight:200;text-shadow:0 0 35px color-mix(in srgb,var(--accent),transparent 30%)}
html[data-energy=futuristic] .key-composition svg{stroke-width:1.5;filter:drop-shadow(0 0 13px color-mix(in srgb,var(--accent),transparent 50%))}
html[data-energy=futuristic] .key-composition span{font-family:Arial,Helvetica,sans-serif;font-style:normal;font-weight:300}
html[data-energy=futuristic] .consent{background:var(--paper);color:var(--ink);border-block:1px solid var(--line)}
html[data-energy=futuristic] .consent h2 em{color:var(--accent);opacity:1}
html[data-energy=futuristic] .permission{border-color:var(--accent);color:var(--accent);box-shadow:0 0 35px color-mix(in srgb,var(--accent),transparent 88%)}
html[data-energy=futuristic] .merge-composition span{border:1px dashed var(--accent)}
html[data-energy=futuristic] .merge-composition b{font-family:Arial,Helvetica,sans-serif;font-weight:300}
html[data-energy=futuristic] .closing{background:var(--wash);border-block:1px solid var(--line);backdrop-filter:blur(4px)}
html[data-energy=futuristic] .primary-link{background:var(--accent);color:var(--on-accent);border:1px solid var(--accent);box-shadow:0 0 35px color-mix(in srgb,var(--accent),transparent 85%)}
html[data-energy=futuristic] .review-controls{background:var(--paper);border-color:var(--accent)}
@keyframes hologram-orbit{to{transform:rotate(360deg)}}
@keyframes hologram-scan{from{transform:translateY(-20px)}to{transform:translateY(300px)}}
@keyframes signal-flow{to{stroke-dashoffset:-100}}
@media(prefers-reduced-motion:no-preference){
  html[data-energy=futuristic] .hologram-rings{animation:hologram-orbit 50s linear infinite}
  html[data-energy=futuristic] .hologram-scan path{animation:hologram-scan 6s linear infinite}
  html[data-energy=futuristic] .map-orbits{animation:hologram-orbit 70s linear infinite}
  html[data-energy=futuristic] .map-lines{stroke-dasharray:5 8;animation:signal-flow 8s linear infinite}
}
html[data-energy=futuristic][data-future-motion=paused] .hologram-rings,
html[data-energy=futuristic][data-future-motion=paused] .hologram-scan path,
html[data-energy=futuristic][data-future-motion=paused] .map-orbits,
html[data-energy=futuristic][data-future-motion=paused] .map-lines{animation:none}
@media(max-width:900px){html[data-energy=futuristic] .hero-sigil{width:33vw;right:9vw;top:32%}}
@media(max-width:600px){
  .header-actions{gap:12px}
  .theme-menu-button{font-size:11px;gap:8px;padding:7px 9px}
  .theme-menu-button span{font-size:16px}
  .review-controls{top:82px;right:12px;left:auto;padding:14px;width:280px;gap:13px}
  .review-controls fieldset{width:100%}
  .review-controls .control-divider{display:none}
  .review-controls label span{min-height:40px;padding-inline:14px}
  .opening,html[data-energy=bold] .opening{padding-bottom:45px}
  html[data-energy=futuristic] .opening{padding-bottom:45px}
  html[data-energy=futuristic] .opening h1{font-size:23vw}
  html[data-energy=futuristic] .hero-sigil{width:30vw;top:44%;right:17vw}
  html[data-energy=futuristic] .hero-bottom h2{font-size:29px}
  html[data-energy=futuristic] .proof-orbit{width:180px;height:180px}
}
@media(max-width:380px){
  .masthead{gap:8px}
  .masthead .wordmark{font-size:15px;white-space:nowrap}
  .masthead .brand-symbol{font-size:24px;margin-right:0}
  .header-actions{gap:10px}
  .header-entry{font-size:10px;gap:5px}
  .header-entry span{font-size:15px}
  .theme-menu-button{font-size:10px;padding:7px;gap:5px}
}
@media(prefers-reduced-motion:reduce){
  html[data-energy=futuristic] .hero-sigil,html[data-energy=futuristic] .person-disc{transform:none;will-change:auto}
  .hologram-scan{display:none!important}
}
