.nb-flipflop-button{--elastic-ease-out:linear( 0, 0.5737 7.6%, 0.8382 11.87%, 0.9463 14.19%, 1.0292 16.54%, 1.0886 18.97%, 1.1258 21.53%, 1.137 22.97%, 1.1424 24.48%, 1.1423 26.1%, 1.1366 27.86%, 1.1165 31.01%, 1.0507 38.62%, 1.0219 42.57%, 0.9995 46.99%, 0.9872 51.63%, 0.9842 58.77%, 1.0011 81.26%, 1 );--smooth-ease:cubic-bezier(.32, .72, 0, 1);--color-ease:cubic-bezier(.216, .62, .356, 1);transition:transform var(--flipflop-duration) var(--elastic-ease-out);-webkit-tap-highlight-color:#fff0;-webkit-user-select:none;user-select:none;cursor:pointer;width:fit-content}.nb-flipflop-button__inner{pointer-events:none;perspective:var(--perspective);transform-style:preserve-3d;display:grid}.nb-flipflop-button__back{transition:translate calc(var(--flipflop-duration) * 1.9) var(--elastic-ease-out),rotate calc(var(--flipflop-duration) * 1.8) var(--elastic-ease-out),opacity calc(var(--flipflop-duration) * 0.33) ease-out;opacity:0;translate:0 2em -6em;rotate:1 0 0 -90deg}.nb-flipflop-button__back{grid-area:1 / 1;justify-content:center;place-self:center;align-items:center;width:calc(100% - .125em);height:calc(100% - .125em);display:flex;translate:0 .5em -3.5em}.nb-flipflop-button__back::before{--index:1;content:attr(data-text);display:contents}.nb-flipflop-button__front{transition:translate calc(var(--flipflop-duration) * 1.9) var(--elastic-ease-out),rotate calc(var(--flipflop-duration) * 1.8) var(--elastic-ease-out),opacity calc(var(--flipflop-duration) * 0.33) ease-out}.nb-flipflop-button__front{grid-area:1 / 1;display:grid}.nb-flipflop-button__bg{transition:background-color calc(var(--flipflop-duration) * 0.4) var(--color-ease)}.nb-flipflop-button__bg{grid-area:1 / 1;display:grid}.nb-flipflop-button__text{transition:translate calc(var(--flipflop-duration) * 1.8) var(--elastic-ease-out)}.nb-flipflop-button__text{grid-area:1 / 1}.nb-flipflop-button__bg{transition:background-color .2s var(--color-ease)}.nb-flipflop-button__front{transition:translate calc(var(--flipflop-duration) * 1.9) var(--elastic-ease-out),rotate calc(var(--flipflop-duration) * 1.8) var(--elastic-ease-out),opacity calc(var(--flipflop-duration) * 0.33) ease-out}.nb-flipflop-button__text{transition:translate calc(var(--flipflop-duration) * 1.8) var(--elastic-ease-out)}.nb-flipflop-button__back::before{transition:translate calc(var(--flipflop-duration) * 1.8) var(--elastic-ease-out);translate:0 .75em 0}.nb-flipflop-button__back{transition:translate calc(var(--flipflop-duration) * 1.9) var(--elastic-ease-out),rotate calc(var(--flipflop-duration) * 1.8) var(--elastic-ease-out),opacity calc(var(--flipflop-duration) * 0.33) ease-out;opacity:0;translate:0 2em -6em;rotate:1 0 0 -90deg}.nb-flipflop-button__back::before{--index:1;content:attr(data-text);display:contents}@media (hover:hover) and (pointer:fine){.nb-flipflop-button:is(:hover,:focus-visible) .nb-flipflop-button__front{translate:0 -2em -6em;rotate:1 0 0 85deg;opacity:0}.nb-flipflop-button:is(:hover,:focus-visible) .nb-flipflop-button__text{translate:0 -.75em 0;transition-delay:0s}.nb-flipflop-button:is(:hover,:focus-visible) .nb-flipflop-button__back{transition:translate calc(var(--flipflop-duration) * 1.9) var(--elastic-ease-out),rotate calc(var(--flipflop-duration) * 1.8) var(--elastic-ease-out),opacity calc(var(--flipflop-duration) * 0.33) ease-in;rotate:1 0 0 0deg;translate:0 0 0;opacity:1}.nb-flipflop-button:is(:hover,:focus-visible) :is(.nb-flipflop-button__back::before){translate:0 0 0;transition-delay:calc(var(--index) * .012s)}}