.hip-button{background-color:#fff;color:#000;border-radius:10em;font-size:clamp(1rem,2vmin,1.5rem);font-weight:600;padding:.75em 1.5em;cursor:pointer;transition:all .3s ease-in-out;--btn_outline: black;--btn_text: black;border:calc(2px * var(--dpi_comp, 1)) solid var(--btn_outline);box-shadow:0 0 0 0 var(--btn_outline);outline:none;white-space:nowrap}.hip-button:hover{transform:translateY(calc(-4px * var(--dpi_comp, 1))) translate(calc(-2px * var(--dpi_comp, 1)));box-shadow:calc(2px * var(--dpi_comp, 1)) calc(5px * var(--dpi_comp, 1)) 0 0 var(--btn_outline)}.hip-button:active{transform:translateY(calc(2px * var(--dpi_comp, 1))) translate(calc(1px * var(--dpi_comp, 1)));box-shadow:0 0 0 0 var(--btn_outline)}.hip-button.primary{background-color:#00d2ff;color:#0f172a;--btn_outline: #00AAC8}.hip-button.secondary{background-color:#ffbe5a;color:#0f172a;--btn_outline: #B45309}.hip-button.success{background-color:#8cdc96;color:#0f172a;--btn_outline: #4CA656}.hip-button.danger{background-color:#ff3f7f;color:#fff;--btn_outline: #9C1F55}.chip-selected{background-color:#00d2ff;border:2px solid #00AAC8;color:#0f172a}.ui-container{border:2px solid #0f172a;border-radius:2em;transition:box-shadow .2s ease,border-color .2s ease}.ui-container:focus-within{box-shadow:0 0 0 3px #00d2ff40;border-color:#00d2ff}.text-\[12vmin\]{font-size:20vmin}
