.roll-button{height:50px;color:var(--paper);background:var(--ink);font-family:var(--font-mono);letter-spacing:-.02em;text-transform:uppercase;white-space:nowrap;flex:none;justify-content:center;align-items:center;gap:12px;padding:18px;font-size:14px;font-weight:400;line-height:16.8px;text-decoration:none;display:inline-flex;position:relative;overflow:clip}.roll-button__viewport{flex-direction:column;align-items:center;height:14px;display:flex;overflow:clip}.roll-button__track{will-change:transform;flex-direction:column;align-items:center;gap:10px;transition:transform .4s cubic-bezier(1,0,0,1);display:flex}.roll-button__track span{height:16.8px;display:block}.roll-button:focus-visible .roll-button__track,.roll-button:active .roll-button__track{transform:translateY(-29.6px)}@media (hover:hover){.roll-button:hover .roll-button__track{transform:translateY(-29.6px)}}@media (prefers-reduced-motion:reduce){.roll-button__track{transition:none}}.roll-button--light{background:var(--paper);color:var(--ink)}.roll-button--small{height:40px;padding:0 16px;font-size:12px;line-height:14.4px}.roll-button--small .roll-button__viewport{height:12px}.roll-button--small .roll-button__track span{align-items:center;gap:8px;height:14.4px;display:flex}.roll-button--small:focus-visible .roll-button__track,.roll-button--small:active .roll-button__track{transform:translateY(-26.8px)}@media (hover:hover){.roll-button--small:hover .roll-button__track{transform:translateY(-26.8px)}}