game/2d/ui/screenshaker.scss
root {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    pointer-events: none;
    z-index: 0;
}

.screen-shake {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    pointer-events: none;
}

.screen-shake.shake-small  { animation: shake-small  0.25s ease-out; }
.screen-shake.shake-medium { animation: shake-medium 0.35s ease-out; }
.screen-shake.shake-strong { animation: shake-strong 0.45s ease-out; }
.screen-shake.shake-insane { animation: shake-insane 0.55s ease-out; }

@keyframes shake-small {
    0%,100% { transform: translate(0,0); }
    25%     { transform: translate(-2px, 1px); }
    50%     { transform: translate(2px, -1px); }
    75%     { transform: translate(-1px, 2px); }
}
@keyframes shake-medium {
    0%,100% { transform: translate(0,0); }
    20%     { transform: translate(-4px, 2px) rotate(-0.3deg); }
    40%     { transform: translate(4px,-3px)  rotate(0.3deg); }
    60%     { transform: translate(-3px, 3px) rotate(-0.2deg); }
    80%     { transform: translate(3px,-2px)  rotate(0.2deg); }
}
@keyframes shake-strong {
    0%,100% { transform: translate(0,0); }
    15%     { transform: translate(-6px, 3px) rotate(-0.5deg); }
    30%     { transform: translate(6px,-4px)  rotate(0.5deg); }
    45%     { transform: translate(-5px, 5px) rotate(-0.4deg); }
    60%     { transform: translate(5px,-4px)  rotate(0.4deg); }
    75%     { transform: translate(-3px, 2px); }
    90%     { transform: translate(2px,-2px); }
}
@keyframes shake-insane {
    0%,100% { transform: translate(0,0); }
    10%     { transform: translate(-9px, 5px)  rotate(-0.7deg); }
    20%     { transform: translate(9px,-6px)   rotate(0.7deg); }
    30%     { transform: translate(-8px, 7px)  rotate(-0.6deg); }
    40%     { transform: translate(8px,-6px)   rotate(0.6deg); }
    50%     { transform: translate(-6px, 5px)  rotate(-0.4deg); }
    60%     { transform: translate(6px,-5px)   rotate(0.4deg); }
    70%     { transform: translate(-4px, 3px); }
    80%     { transform: translate(3px,-3px); }
    90%     { transform: translate(-1px, 1px); }
}