html,body{margin:0;padding:0;position:relative}canvas.webgl{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1}.buttonContainer{position:absolute;left:20px;display:flex;flex-direction:column;z-index:2;top:20px}.addButtonsContainer,.removeButtonsContainer{display:flex;flex-direction:row;justify-content:space-between;padding:5px}.otherButtonsContainer{display:flex;flex-direction:column;padding:5px}.addButton,.rmButton,.scatterButton,.multiplyAddButton,.multiplyRemoveButton{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}#sharkSpeed{top:309px}#sharkSpeedValue{top:307px}label[for=sharkSpeed]{top:300px}#fearOfShark{top:349px}#fearOfSharkValue{top:347px}label[for=fearOfShark]{top:340px}.addButton:hover,.rmButton:hover,.scatterButton:hover,.multiplyAddButton:hover,.multiplyRemoveButton:hover{background:#28375a8c;transform:translateY(-1px);box-shadow:0 12px 28px #00000059}.addButton:active,.rmButton:active,.scatterButton:active,.multiplyRemoveButton:active,.multiplyAddButton:active{transform:translateY(0);box-shadow:0 6px 18px #00000040}.scatterButton{padding:10px}.githubLink{position:fixed;right:20px;bottom:20px;z-index:3;display:inline-flex}.githubLogo{width:38px;height:38px;display:block;opacity:.9;transition:transform .2s ease,opacity .2s ease}.githubLink:hover .githubLogo{opacity:1;transform:scale(1.05)}