/*! Tactile Push Button · Community submission by 少荃 (Douyin: 宝龙体育优品小铺). */body{width:100%;height:var(--motion-height, 100vh);margin:0;padding:0;display:flex;align-items:center;justify-content:center;font-size:3rem;background-color:#e1e1e1;font-family:Inter,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden}.tactile-button{--button-font-size: 48px;--button-padding-x: 1.5em;--button-padding-y: 1em;--button-surface-start: #e6e6e6;--button-surface-end: #b4b4b4;--button-text-start: #191919;--button-text-end: #4b4b4b;--button-press-scale: .93;--button-hover-text-scale: .975;--button-motion-speed: 1;all:unset;font-size:var(--button-font-size);font-family:Inter,sans-serif;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0);position:relative;border-radius:999vw;background-color:#000000bf;box-shadow:-.15em -.15em .15em -.075em #05050540,.0375em .0375em .0675em #0505051a}.tactile-button:after{pointer-events:none;content:"";position:absolute;z-index:0;width:calc(100% + .3em);height:calc(100% + .3em);top:-.15em;left:-.15em;border-radius:inherit;background:linear-gradient(-135deg,rgba(5,5,5,.5),transparent 20%,transparent 100%);filter:blur(.0125em);opacity:.25;mix-blend-mode:multiply}.tactile-button .button-outer{display:block;position:relative;z-index:1;border-radius:inherit;transition:box-shadow calc(.3s/clamp(.25,var(--button-motion-speed),3)) ease;will-change:box-shadow;box-shadow:0 .05em .05em -.01em #050505,0 .01em .01em -.01em #05050580,.15em .3em .1em -.01em #05050540}.tactile-button:hover .button-outer{box-shadow:0 0 #050505,0 0 #05050580,0 0 #05050540}.tactile-button .button-inner{display:block;position:relative;z-index:1;border-radius:inherit;padding:var(--button-padding-y) var(--button-padding-x);background-image:linear-gradient(135deg,var(--button-surface-start),var(--button-surface-end));transition:box-shadow calc(.3s/clamp(.25,var(--button-motion-speed),3)) ease,clip-path calc(.25s/clamp(.25,var(--button-motion-speed),3)) ease,background-image calc(.25s/clamp(.25,var(--button-motion-speed),3)) ease,transform calc(.25s/clamp(.25,var(--button-motion-speed),3)) ease;will-change:box-shadow,clip-path,background-image,transform;overflow:clip;clip-path:inset(0 0 0 0 round 999vw);box-shadow:0 0 inset #0505051a,-.05em -.05em .05em inset #05050540,0 0 inset #0505051a,0 0 .05em .2em inset #ffffff40,.025em .05em .1em inset #fff,.12em .12em .12em inset #ffffff40,-.075em -.25em .25em .1em inset #05050540}.tactile-button:hover .button-inner{clip-path:inset(clamp(1px,.0625em,2px) clamp(1px,.0625em,2px) clamp(1px,.0625em,2px) clamp(1px,.0625em,2px) round 999vw);box-shadow:.1em .15em .05em inset #050505bf,-.025em -.03em .05em .025em inset #05050580,.25em .25em .2em inset #05050580,0 0 .05em .5em inset #ffffff26,0 0 inset #fff,.12em .12em .12em inset #ffffff40,-.075em -.12em .2em .1em inset #05050540}.tactile-button .button-inner span{white-space:pre-wrap;text-align:center;position:relative;z-index:4;font-family:Inter,sans-serif;letter-spacing:-.05em;font-weight:500;color:#0000;background-image:linear-gradient(135deg,var(--button-text-start),var(--button-text-end));-webkit-background-clip:text;background-clip:text;transition:transform calc(.25s/clamp(.25,var(--button-motion-speed),3)) ease;display:block;will-change:transform;text-shadow:rgba(0,0,0,.1) 0 0 .1em;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.tactile-button:hover .button-inner span{transform:scale(clamp(.8,var(--button-hover-text-scale),1.05))}.tactile-button:active .button-inner{transform:scale(clamp(.8,var(--button-press-scale),1.05))}.tactile-button:focus-visible{outline:3px solid #23785c;outline-offset:.2em}@media(prefers-reduced-motion:reduce){.tactile-button .button-outer,.tactile-button .button-inner,.tactile-button .button-inner span{transition:none}}