:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#fff}body{margin:auto;display:flex;place-items:center;min-width:320px;max-width:800px;min-height:100vh;padding:20px}#root{width:100%}.ripple-container{position:absolute;overflow:hidden;inset:0;pointer-events:none;z-index:0}.holder{position:absolute;box-sizing:border-box;z-index:1;overflow:hidden;pointer-events:none;border-radius:var(--ripple-border-radius, 0%);border-style:solid;border-color:transparent;border-width:var(--ripple-border-width, 0px)}.ripple{position:absolute;transform:scale(0);border-radius:var(--ripple-border-radius, 0%);background-color:var(--ripple-color, rgba(0, 0, 0, .2));animation:ripple var(--ripple-duration, .6s) ease-out;pointer-events:none}@keyframes ripple{to{transform:scale(var(--ripple-scale, 4))}}