@property --orb-n{syntax:"<number>";inherits:true;initial-value:100}.bal-orb{--orb-size:52px;--orb-n:64;--orb-away:calc((100 - var(--orb-n)) / 100);--orb-length:calc((.077 + var(--orb-away) * .365) * var(--orb-size));--orb-blur:calc(1.2px + var(--orb-away) * 1.6px);--orb-glow-radius:calc(var(--orb-n) / 100 * .135 * var(--orb-size));--orb-light-y:calc(22% + var(--orb-away) * 24%);--orb-glow-alpha:calc(.1 + var(--orb-n) / 100 * .75);--orb-needle-lit:min(1, calc(.92 + var(--orb-n) / 100 * .2));--orb-needle-w:calc(.058 * var(--orb-size));--orb-needle-h:calc(.4 * var(--orb-size));--orb-shadow-h:max(3px, calc(.077 * var(--orb-size)));--orb-foot-x:38%;--orb-foot-y:64%;--orb-tilt:22deg;--orb-focus:rgb(var(--c3));width:var(--orb-size);height:var(--orb-size);cursor:pointer;transition:--orb-n var(--t-kamer) var(--ease), transform var(--t-vinger) ease;background:0 0;border:0;border-radius:999px;padding:0;display:block;position:relative}.bal-orb__plate{background:radial-gradient(circle at 50% var(--orb-light-y), rgb(var(--orb-plate-lit)), rgb(var(--orb-plate-rim)) 74%);box-shadow:var(--orb-box);transition:box-shadow var(--t-vinger) ease, background var(--t-kamer) var(--ease);border-radius:999px;position:absolute;inset:0}.bal-orb__shadow{left:var(--orb-foot-x);top:var(--orb-foot-y);margin-top:calc(var(--orb-shadow-h) / -2);width:var(--orb-length);height:var(--orb-shadow-h);background:linear-gradient(90deg, rgb(var(--orb-shadow-ink) / .56), rgb(var(--orb-shadow-ink) / 0));filter:blur(var(--orb-blur));transform-origin:0;border-radius:99px;position:absolute;transform:rotate(24deg)}.bal-orb__needle{left:var(--orb-foot-x);top:var(--orb-foot-y);width:var(--orb-needle-w);height:var(--orb-needle-h);margin-left:calc(var(--orb-needle-w) / -2);background:linear-gradient(180deg, rgb(var(--orb-needle-top)), rgb(var(--orb-needle-foot)));filter:brightness(var(--orb-needle-lit));transform-origin:50% 100%;transform:translateY(-100%) rotate(var(--orb-tilt));box-shadow:0 0 var(--orb-glow-radius) rgb(var(--orb-glow) / var(--orb-glow-alpha));transition:height var(--t-vinger) var(--ease), top var(--t-vinger) var(--ease), box-shadow var(--t-kamer) ease;border-radius:99px;position:absolute}.bal-orb:hover .bal-orb__plate{box-shadow:var(--orb-box-hover)}.bal-orb:hover{transform:translateY(-2px)}.bal-orb:hover .bal-orb__shadow{width:calc(var(--orb-length) * .82);filter:blur(calc(var(--orb-blur) * .78))}.bal-orb:active{transition-duration:var(--t-tik);transform:scale(.97)}.bal-orb:active .bal-orb__needle{height:calc(var(--orb-needle-h) - 2px);box-shadow:none;transition-duration:var(--t-tik)}.bal-orb:active .bal-orb__shadow{width:calc(var(--orb-length) * .64);filter:blur(calc(var(--orb-blur) * .61))}.bal-orb:active .bal-orb__plate{box-shadow:var(--orb-box-press)}.bal-orb:focus-visible{outline:2px solid var(--orb-focus);outline-offset:6px}.bal-orb[data-state=denkt] .bal-orb__shadow{animation:bal-orb-veeg var(--loop-veeg) ease-in-out infinite}.bal-orb__dot{right:calc(var(--orb-size) * .135);bottom:calc(var(--orb-size) * .212);width:calc(var(--orb-size) * .115);height:calc(var(--orb-size) * .115);background:rgb(var(--orb-dot));opacity:0;transition:opacity var(--t-vlak) ease;border-radius:999px;position:absolute}.bal-orb[data-state=inzicht] .bal-orb__dot{opacity:1;animation:bal-orb-puls var(--loop-puls) ease-in-out infinite}.bal-orb[data-state=gedimd]{pointer-events:none}.bal-orb[data-state=gedimd] .bal-orb__plate{background:rgb(var(--orb-dim-plate));box-shadow:inset 0 0 0 1px #241f1814}.bal-orb[data-state=gedimd] .bal-orb__needle{background:rgb(var(--orb-dim-needle));filter:none;box-shadow:none}.bal-orb[data-state=gedimd] .bal-orb__shadow,.bal-orb[data-state=gedimd] .bal-orb__dot{display:none}.dark .bal-orb[data-state=gedimd]{opacity:.5}.dark .bal-orb[data-state=gedimd] .bal-orb__plate{box-shadow:0 0 0 1px #fff6e11a}.bal-orb[data-orb=merk] .bal-orb__plate{box-shadow:var(--orb-box-merk)}.bal-orb[data-orb=besturing] .bal-orb__shadow,.bal-orb[data-orb=besturing] .bal-orb__dot{display:none}.bal-orb[data-orb=besturing] .bal-orb__needle{box-shadow:none}[data-rest=on] .bal-orb__shadow,[data-rest=on] .bal-orb__dot{animation:none}[data-rest=on] .bal-orb__needle{box-shadow:0 0 calc(var(--orb-glow-radius) * .5) rgb(var(--orb-glow) / .3)}[data-rest=on] .bal-orb__plate{filter:saturate(.86)brightness(.98);transition:none}@keyframes bal-orb-veeg{0%,to{transform:rotate(16deg)}50%{transform:rotate(32deg)}}@keyframes bal-orb-puls{0%,to{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.25)}}.bal-orb[data-quiet=true] .bal-orb__shadow,.bal-orb[data-quiet=true] .bal-orb__dot{animation:none}@media (prefers-reduced-motion:reduce){.bal-orb__shadow,.bal-orb__dot{animation:none!important}}
