.vol{flex:none;position:relative}.vol-pop{z-index:3;border:1px solid var(--color-white-20);border-radius:var(--radius-button);background:#0c0c0bf0;justify-items:center;gap:8px;padding:14px 6px 6px;display:grid;position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%)}.vol-pop.is-down{top:calc(100% + 10px);bottom:auto}.vol-range{writing-mode:vertical-lr;cursor:pointer;appearance:none;direction:rtl;background:0 0;width:22px;height:112px;margin:0}.vol-range::-webkit-slider-runnable-track{background:linear-gradient(to top, var(--color-white) var(--pct,100%), var(--color-white-20) var(--pct,100%));border-radius:2px;width:3px}.vol-range::-webkit-slider-thumb{-webkit-appearance:none;background:var(--color-white);border:0;border-radius:50%;width:12px;height:12px;margin-left:-4.5px}.vol-range::-moz-range-track{background:var(--color-white-20);border-radius:2px;width:3px}.vol-range::-moz-range-progress{background:var(--color-white);border-radius:2px;width:3px}.vol-range::-moz-range-thumb{background:var(--color-white);border:0;border-radius:50%;width:12px;height:12px}.vol-mute{border-radius:var(--radius-button);width:28px;height:28px;color:var(--color-white);cursor:pointer;background:0 0;border:1px solid #0000;place-items:center;padding:0;display:inline-grid}.vol-mute:hover{border-color:var(--color-white-20)}