:root{color-scheme:dark}*{box-sizing:border-box}body{margin:0;min-height:100vh;display:grid;place-items:center;background:radial-gradient(60rem 40rem at 50% 35%,#101010,#050505 70%);color:#f2f2f2;font:400 16px/1.5 -apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif}.stage{display:grid;place-items:center;padding:3rem 1.5rem}.send-halo{--knob-size: 116px;--disc-inset: 7%;--bezel: 0px;--bar-pad: 12px;--bar-lead: 30px;--bar-width: 375px;--tool-size: 74px;--tool-gap: 26px;--disc-top: #2e2e2e;--disc-bottom: #0e0e0e;display:flex;align-items:center;width:min(var(--bar-width),100%);padding:var(--bar-pad);padding-left:var(--bar-lead);border:1px solid #171717;border-radius:999px;background:linear-gradient(180deg,#070707,#0e0e0e);box-shadow:inset 0 1px #ffffff0a,0 30px 70px -24px #000000f2}.send-halo__tools{display:flex;align-items:center;gap:var(--tool-gap)}.send-halo__icon{width:var(--tool-size);height:var(--tool-size)}.send-halo__spacer{flex:1 1 auto}.send-halo__button{padding:0;border:0;border-radius:50%;background:none;color:inherit;font:inherit;cursor:pointer}.send-halo__knob{position:relative;display:grid;place-items:center;width:var(--knob-size);height:var(--knob-size);flex:none}.send-halo__knob:before{content:"";position:absolute;inset:var(--disc-inset);border-radius:50%;background:linear-gradient(180deg,#2f2f2f,#292929,#212121,#1b1b1b,#1a1a1a 40%,#1b1b1b,#101010,#0c0c0c,#090909,#040404 65%,#010101 75%,#000 80%,#000);box-shadow:inset 0 1px 1px #ffffff0f}.send-halo__knob:after{content:"";position:absolute;inset:calc(var(--disc-inset) + var(--bezel));border-radius:50%;border:1px solid #070707;box-shadow:inset 0 -1px #ffffff0d;pointer-events:none}.send-halo__ring{position:absolute;top:50%;left:50%;width:180%;height:180%;transform:translate(-50%,-50%);display:block;pointer-events:none}.sprite{position:absolute;width:0;height:0;overflow:hidden}.send-halo__glyph{position:relative;width:30%;height:30%;filter:drop-shadow(0 -1px 0 rgb(0 0 0 / .8)) drop-shadow(0 1px 0 rgb(255 255 255 / .07))}