.volume-control{color:#bcc5d2;align-items:center;max-width:100%;display:inline-flex}.volume-control__panel{z-index:2000;box-sizing:border-box;background:#282f39;border:1px solid #2b3038;border-radius:10px;align-items:center;gap:12px;width:220px;max-width:calc(100vw - 20px);padding:6px 14px;animation:.14s ease-out volume-control-in;display:flex;position:fixed;box-shadow:0 14px 34px #00000073}.volume-control__panel:before{content:"";height:10px;position:absolute;inset:100% 0 auto}.volume-control__panel:after{content:"";left:var(--volume-arrow,50%);pointer-events:none;background:#282f39;border-bottom:1px solid #2b3038;border-right:1px solid #2b3038;width:8px;height:8px;position:absolute;bottom:-5px;transform:translate(-50%)rotate(45deg)}[dir=rtl] .volume-control__panel:after{border-left:1px solid #2b3038;transform:translate(50%)rotate(-45deg)}.volume-control__panel_below:before{inset:auto 0 100%}.volume-control__panel_below:after{top:-5px;bottom:auto;transform:translate(-50%)rotate(225deg)}[dir=rtl] .volume-control__panel_below:after{transform:translate(50%)rotate(-225deg)}@media (prefers-reduced-motion:reduce){.volume-control__panel{animation:none}}.volume-control__slider{accent-color:#4b83ff;cursor:pointer;flex:1;width:140px;min-width:0;height:44px;margin:0;padding:0}.volume-control__slider:focus-visible{outline-offset:2px;border-radius:4px;outline:2px solid #4b83ff}.volume-control__value{font-variant-numeric:tabular-nums;text-align:end;min-width:4ch;font-size:12px}@keyframes volume-control-in{0%{opacity:0}to{opacity:1}}