html,body{margin:0;padding:0;position:relative}canvas.webgl{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1}.addButton,.rmButton{position:absolute;left:20px;z-index:2;padding:10px 16px;border:1px solid rgba(255,255,255,.35);border-radius:999px;background:#14192373;color:#eef3ff;font:600 14px/1.2 Inter,Segoe UI,sans-serif;letter-spacing:.2px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 8px 24px #00000040;cursor:pointer;transition:transform .2s ease,background .2s ease,box-shadow .2s ease}input[type=range]{position:absolute;right:20px;z-index:2;width:150px;height:6px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#ffffff26;border-radius:10px;outline:none;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.2);cursor:pointer;transition:all .3s ease}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;background:#ffffffe6;border-radius:50%;cursor:pointer;box-shadow:0 2px 8px #0000004d;transition:all .2s ease}input[type=range]::-webkit-slider-thumb:hover{background:#fff;transform:scale(1.2);box-shadow:0 4px 12px #0006}input[type=range]::-moz-range-thumb{width:16px;height:16px;background:#ffffffe6;border-radius:50%;cursor:pointer;border:none;box-shadow:0 2px 8px #0000004d;transition:all .2s ease}input[type=range]::-moz-range-thumb:hover{background:#fff;transform:scale(1.2);box-shadow:0 4px 12px #0006}label{position:absolute;right:20px;z-index:3;color:#eef3ff;font:600 14px/1.2 Inter,Segoe UI,sans-serif;letter-spacing:.2px;background:#141923a6;padding:8px 16px;border-radius:999px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.25);box-shadow:0 4px 16px #0003;cursor:pointer;transition:opacity .3s ease,background .3s ease;width:150px;text-align:center;box-sizing:border-box}.sliderValue{position:absolute;right:180px;z-index:3;width:36px;text-align:right;color:#eef3ffa6;font:500 13px/1.2 Inter,Segoe UI,sans-serif;letter-spacing:.2px;pointer-events:none}label:hover{opacity:0;pointer-events:none}input[type=range]:hover+label{opacity:0;pointer-events:none}#current{top:29px}#currentValue{top:27px}label[for=current]{top:20px}#separation{top:69px}#separationValue{top:67px}label[for=separation]{top:60px}#cohesion{top:109px}#cohesionValue{top:107px}label[for=cohesion]{top:100px}#alignment{top:149px}#alignmentValue{top:147px}label[for=alignment]{top:140px}#speed{top:189px}#speedValue{top:187px}label[for=speed]{top:180px}#random{top:229px}#randomValue{top:227px}label[for=random]{top:220px}#boundary{top:269px}#boundaryValue{top:267px}label[for=boundary]{top:260px}.addButton{top:20px}.rmButton{top:60px}.addButton:hover,.rmButton:hover{background:#28375a8c;transform:translateY(-1px);box-shadow:0 12px 28px #00000059}.addButton:active,.rmButton:active{transform:translateY(0);box-shadow:0 6px 18px #00000040}