@layer normalize{html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}}@font-face{font-family:Geist Sans;src:url(https://assets.codepen.io/605876/GeistVF.ttf) format("truetype")}*,*:after,*:before{box-sizing:border-box}body{display:grid;place-items:center;min-height:100vh;font-family:Geist Sans,SF Pro Text,SF Pro Icons,AOS Icons,Helvetica Neue,Helvetica,Arial,sans-serif,system-ui;background:#242424;overflow:hidden}:root{--hue: 320;--height: 56px;--width: 246px;--glow: var(--hue, 24) 90% 60%;--accent: var(--hue, 24) 100% calc((60 + ((var(--value, 0) / 100) * 40)) * 1%);--outset: -.5rem;--thickness: 4px;--update: .1s}@layer reset{.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}[type=range]:hover{cursor:-webkit-grab}[type=range]:active{cursor:-webkit-grabbing}[type=range]:focus-visible{outline-offset:.25rem;outline-color:transparent}[type=range]{width:var(--width);opacity:1;height:var(--height);overflow:hidden;touch-action:none;border:0;padding:0;margin:0;opacity:0}[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;height:var(--height);width:var(--height);background:#0d4073bf;margin-top:0}[type=range]::-moz-range-thumb{height:var(--height);background:#0d407380;width:var(--height);margin-top:30px}[type=range]::-webkit-slider-runnable-track{-webkit-appearance:none;appearance:none;height:var(--height);background:#1980e633}[type=range]::-moz-range-track{height:var(--height);background:#1980e633}.control:focus-within,.control:hover{--active: 1}}@layer controls{.control{position:relative;height:var(--height)}.control:before{content:"";width:1px;height:calc(var(--height) * 1.75);border-radius:2px;background:#000;position:absolute;left:50%;top:50%;translate:-50% -50%;pointer-events:none;z-index:2;-webkit-mask:linear-gradient(white calc(50% - (var(--height) * .14)),transparent calc(50% - (var(--height) * .14)) calc(50% + (var(--height) * .14)),white calc(50% + (var(--height) * .14)));mask:linear-gradient(white calc(50% - (var(--height) * .14)),transparent calc(50% - (var(--height) * .14)) calc(50% + (var(--height) * .14)),white calc(50% + (var(--height) * .14)))}.control__track{pointer-events:none;height:28%;width:100%;background:#0a0a0a;position:absolute;top:50%;left:50%;border-radius:100px;translate:-50% -50%;box-shadow:0 0 2px #000 inset,-1px 1px 1px -1px #ffffff80}.control__thumb{pointer-events:none;height:var(--height);aspect-ratio:1;background:red;border-radius:50%;position:absolute;top:0;left:calc(var(--value, 0) * 1%);translate:calc((-50% + (var(--height) * .14)) - ((var(--value, 0) / 100) * (var(--height) * .28))) 0%;z-index:3}.control__thumb:after{content:"";height:100%;aspect-ratio:1;border:1px solid transparent;background:linear-gradient(#0000001a,#0000) padding-box,linear-gradient(#666,#666) padding-box,linear-gradient(90deg,hsl(var(--hue) 80% 50% / calc(var(--value) / 150)) 25%,transparent 60%) border-box,linear-gradient(60deg,#292929 40%,#fff) border-box;box-shadow:4px 0 4px -2px hsl(var(--hue) 80% 50% / calc(var(--value, 0) / 150)) inset,-2px 2px 4px -1px #ffffff80 inset,1px 0 2px #1a1a1a inset,1px -1px 1px #333 inset,4px -4px 4px #33333380 inset;border-radius:50%;position:absolute;top:50%;left:50%;translate:-50% -50%}.control__thumb:before{content:"";position:absolute;height:200%;width:100%;background:radial-gradient(hsl(0 0% 0% / .25),transparent 75%);transform-origin:50% calc(var(--height) * .5);rotate:55deg}.control__led{height:24%;aspect-ratio:1;border-radius:50%;position:absolute;top:50%;left:50%;translate:-50% -50%;background:radial-gradient(calc(var(--height) * .2) calc(var(--height) * .2) at 65% 75%,hsl(0 0% 100% / .15) 10%,transparent 60%),hsl(var(--hue) 80% 50% / calc(.5 + (var(--value, 0) / 100)));z-index:2;box-shadow:0 0 2px #000 inset,.5px -.5px #fffc inset,0 0 calc((var(--value, 0) / 100) * 10px) calc((var(--value, 0) / 100) * 5px) hsl(var(--hue) 80% 50% / .5)}.control__beam{box-shadow:0 2px 4px #000 inset,0 -1px 2px #ffffff80 inset;height:100%;width:100%;border-radius:100px;position:relative}.control__beam:before,.control__beam:after{width:calc(var(--value, 0) * 1%);height:100%;content:"";border-radius:100px;position:absolute;top:0;left:0;background:hsl(var(--hue) 80% 50% / calc(.25 + (var(--value, 0) / 100)));z-index:-1}.control__beam:after{opacity:.15;filter:brightness(1.25) blur(8px) drop-shadow(0 0 20px hsl(var(--hue) 100% 50%));z-index:2}}@property --value{initial-value: 0; syntax: "<integer>"; inherits: true;}@layer scrolls{@supports (animation-timeline: scroll()){:root{timeline-scope:--thumb}@keyframes sync{to{--value: 100}}.control{animation:sync both linear reverse;animation-timeline:--thumb;animation-range:contain}[type=range]::-webkit-slider-thumb{view-timeline-name:--thumb;view-timeline-axis:inline}}}@layer socials{.x-link,.bear-link{color:#fff;position:fixed;bottom:1rem;left:1rem;width:48px;aspect-ratio:1;display:grid;place-items:center;opacity:.8}.bear-link{bottom:unset;top:1rem}:where(.x-link,.bear-link):is(:hover,:focus-visible){opacity:1}.bear-link svg{width:75%}.x-link svg{width:50%}}div.tp-dfwv{z-index:9999}div.tp-dfwv .tp-rotv{max-height:calc(100vh - 16px);overflow:auto;border-radius:var(--bs-br)}div.tp-dfwv .tp-rotv>.tp-rotv_b{position:sticky;top:0;z-index:2;background:#45474c}