.cubi-btn{--k-purple:oklch(55% .2 285);--k-teal:oklch(65% .13 210);--k-green:oklch(60% .18 145);--k-orange:oklch(70% .2 45);--k-yellow:oklch(88% .16 95);--k-purple-bright:oklch(70% .22 285);--k-teal-bright:oklch(78% .16 210);--k-green-bright:oklch(78% .2 145);--k-orange-bright:oklch(82% .22 45);--k-yellow-bright:oklch(94% .18 95);--w:148px;--h:80px;--radius:22px;width:var(--w);height:var(--h);border-radius:var(--radius);cursor:pointer;isolation:isolate;background:0 0;border:0;justify-content:center;align-items:center;padding:0;font-family:Geist,ui-sans-serif,system-ui,sans-serif;transition:transform .3s cubic-bezier(.16,1,.3,1);display:inline-flex;position:relative}.cubi-btn:focus-visible{outline:2px solid var(--cubi-fill-bright);outline-offset:6px}.cubi-body{border-radius:var(--radius);background:var(--cubi-fill);width:100%;height:100%;box-shadow:inset 0 -10% 0 oklch(0% 0 0/.06), 0 4px 14px var(--cubi-shadow);z-index:5;justify-content:center;align-items:center;transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s,background .35s;display:flex;position:relative;overflow:hidden}.cubi-btn:hover .cubi-body{box-shadow:inset 0 -10% 0 oklch(0% 0 0/.08), 0 8px 24px var(--cubi-shadow);transform:scale(1.03)}.cubi-label{z-index:2;letter-spacing:-.015em;color:var(--cubi-text);text-align:center;align-items:center;gap:8px;padding:0 12px;font-family:Instrument Serif,serif;font-size:19px;font-weight:500;line-height:1;transition:color .35s;display:inline-flex;position:relative}.cubi-label .change{font-style:italic}.cubi-label .design{letter-spacing:.06em;text-transform:uppercase;color:var(--cubi-text);background:oklch(0% 0 0/.1);border-radius:999px;padding:3px 7px;font-family:Geist,ui-sans-serif,system-ui,sans-serif;font-size:11px;font-style:normal;font-weight:600}.cubi-pen{width:14px;height:14px;color:var(--cubi-text);opacity:0;flex-shrink:0;margin-right:-4px;transition:opacity .25s,transform .35s cubic-bezier(.16,1,.3,1);transform:translate(-4px)}.cubi-btn:hover .cubi-pen{opacity:.85;transform:translate(0)}.cubi-halo{border-radius:calc(var(--radius) + 8px);z-index:1;pointer-events:none;position:absolute;inset:-8px}.cubi-halo>*{position:absolute}.cubi-orbit{offset-path:path("M 26 0 H 138 A 26 26 0 0 1 164 26 V 70 A 26 26 0 0 1 138 96 H 26 A 26 26 0 0 1 0 70 V 26 A 26 26 0 0 1 26 0 Z");offset-rotate:0deg;width:164px;height:96px;inset:0}@keyframes cubi-orbit-loop{to{offset-distance:100%}}@keyframes cubi-aura-spin{to{transform:rotate(360deg)}}.cubi-v1 .ring-base{background:conic-gradient(from 0deg, var(--k-purple) 0%, var(--k-teal) 25%, var(--k-green) 50%, var(--k-orange) 75%, var(--k-purple) 100%);-webkit-mask-composite:xor;opacity:.18;filter:blur(.3px);border-radius:26px;padding:1.5px;transition:opacity .4s,padding .4s;inset:0;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.cubi-v1.cubi-btn:hover .ring-base{opacity:.55;padding:2px}.cubi-v1 .head{width:11px;height:11px;box-shadow:0 0 6px #fff, 0 0 14px var(--cubi-fill-bright), 0 0 24px var(--cubi-fill-bright);z-index:3;opacity:0;background:#fff;border-radius:50%;margin:-5.5px 0 0 -5.5px;transition:opacity .3s;animation:3.6s linear infinite paused cubi-orbit-loop}.cubi-v1 .trail{z-index:2;filter:blur(.3px);opacity:0;border-radius:50%;transition:opacity .3s;animation:3.6s linear infinite paused cubi-orbit-loop}.cubi-v1 .trail.t1{background:var(--k-green-bright);width:9px;height:9px;box-shadow:0 0 10px var(--k-green-bright);margin:-4.5px 0 0 -4.5px;animation-delay:-.06s}.cubi-v1 .trail.t2{background:var(--k-teal-bright);width:8px;height:8px;box-shadow:0 0 10px var(--k-teal-bright);margin:-4px 0 0 -4px;animation-delay:-.14s}.cubi-v1 .trail.t3{background:var(--k-teal);width:7px;height:7px;box-shadow:0 0 8px var(--k-teal);margin:-3.5px 0 0 -3.5px;animation-delay:-.22s}.cubi-v1 .trail.t4{background:var(--k-purple);width:6px;height:6px;box-shadow:0 0 8px var(--k-purple);margin:-3px 0 0 -3px;animation-delay:-.3s}.cubi-v1 .trail.t5{background:var(--k-orange);width:5px;height:5px;box-shadow:0 0 6px var(--k-orange);margin:-2.5px 0 0 -2.5px;animation-delay:-.38s}.cubi-v1 .trail.t6{background:var(--k-orange-bright);width:4px;height:4px;box-shadow:0 0 4px var(--k-orange-bright);margin:-2px 0 0 -2px;animation-delay:-.46s}.cubi-v1 .spark{width:4px;height:4px;box-shadow:0 0 8px var(--cubi-fill-bright);opacity:0;background:#fff;border-radius:50%;margin:-2px 0 0 -2px;animation:3.6s linear infinite paused cubi-orbit-loop,.6s ease-out infinite paused cubi-spark-puff}.cubi-v1 .spark.s1{animation-delay:0s,0s}.cubi-v1 .spark.s2{animation-delay:-1.2s,-.2s}.cubi-v1 .spark.s3{animation-delay:-2.4s,-.4s}@keyframes cubi-spark-puff{0%{opacity:0;transform:scale(.4)}20%{opacity:1;transform:scale(1.6)}to{opacity:0;transform:scale(.2)}}.cubi-v1 .inner-aura{background:conic-gradient(from 0deg, var(--k-purple), var(--k-teal), var(--k-green), var(--k-orange), var(--k-purple));filter:blur(8px);opacity:0;z-index:0;border-radius:20px;transition:opacity .5s;animation:7.2s linear infinite paused cubi-aura-spin;inset:6px}.cubi-v1.cubi-btn:hover .head,.cubi-v1.cubi-btn:hover .trail{opacity:1;animation-play-state:running}.cubi-v1.cubi-btn:hover .trail.t2{opacity:.85}.cubi-v1.cubi-btn:hover .trail.t3{opacity:.75}.cubi-v1.cubi-btn:hover .trail.t4{opacity:.65}.cubi-v1.cubi-btn:hover .trail.t5{opacity:.5}.cubi-v1.cubi-btn:hover .trail.t6{opacity:.3}.cubi-v1.cubi-btn:hover .spark{animation-play-state:running,running}.cubi-v1.cubi-btn:hover .inner-aura{opacity:.2;animation-play-state:running}.cubi-v2 .ring-base{background:conic-gradient(from 0deg, var(--k-teal) 0deg, var(--k-green) 90deg, var(--k-orange) 180deg, var(--k-purple) 270deg, var(--k-teal) 360deg);-webkit-mask-composite:xor;opacity:.16;border-radius:26px;padding:1px;transition:opacity .4s,padding .4s;inset:0;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.cubi-v2.cubi-btn:hover .ring-base{opacity:.45;padding:1.5px;animation:3.2s ease-in-out infinite cubi-ring-breathe}@keyframes cubi-ring-breathe{0%,to{opacity:.3}50%{opacity:.55}}.cubi-v2 .comet-a,.cubi-v2 .comet-b{z-index:3;opacity:0;background:#fff;border-radius:50%;width:10px;height:10px;margin:-5px 0 0 -5px;transition:opacity .3s;animation:3s linear infinite paused cubi-orbit-loop}.cubi-v2 .comet-a{box-shadow:0 0 5px #fff, 0 0 12px var(--k-teal-bright), 0 0 22px var(--k-teal-bright)}.cubi-v2 .comet-b{box-shadow:0 0 5px #fff, 0 0 12px var(--k-orange-bright), 0 0 22px var(--k-orange-bright);animation-direction:reverse}.cubi-v2 .trail-a,.cubi-v2 .trail-b{z-index:2;filter:blur(.4px);opacity:0;border-radius:50%;transition:opacity .3s;animation:3s linear infinite paused cubi-orbit-loop}.cubi-v2 .trail-b{animation-direction:reverse}.cubi-v2 .trail-a.a1{background:var(--k-teal);width:8px;height:8px;box-shadow:0 0 8px var(--k-teal);margin:-4px 0 0 -4px;animation-delay:-.07s}.cubi-v2 .trail-a.a2{background:var(--k-purple);width:7px;height:7px;box-shadow:0 0 7px var(--k-purple);margin:-3.5px 0 0 -3.5px;animation-delay:-.14s}.cubi-v2 .trail-a.a3{background:var(--k-purple);width:6px;height:6px;box-shadow:0 0 6px var(--k-purple);margin:-3px 0 0 -3px;animation-delay:-.21s}.cubi-v2 .trail-a.a4{background:var(--k-purple);width:5px;height:5px;margin:-2.5px 0 0 -2.5px;animation-delay:-.28s}.cubi-v2 .trail-b.b1{background:var(--k-orange);width:8px;height:8px;box-shadow:0 0 8px var(--k-orange);margin:-4px 0 0 -4px;animation-delay:-.07s}.cubi-v2 .trail-b.b2{background:var(--k-green);width:7px;height:7px;box-shadow:0 0 7px var(--k-green);margin:-3.5px 0 0 -3.5px;animation-delay:-.14s}.cubi-v2 .trail-b.b3{background:var(--k-green);width:6px;height:6px;box-shadow:0 0 6px var(--k-green);margin:-3px 0 0 -3px;animation-delay:-.21s}.cubi-v2 .trail-b.b4{background:var(--k-green);width:5px;height:5px;margin:-2.5px 0 0 -2.5px;animation-delay:-.28s}.cubi-v2 .cross-flash{opacity:0;pointer-events:none;border-radius:28px;animation:1.5s ease-in-out infinite paused cubi-cross-flash;inset:-2px;box-shadow:0 0 0 1.5px oklch(100% 0 0/.6),0 0 24px oklch(95% .1 145/.5)}@keyframes cubi-cross-flash{0%,30%,60%,to{opacity:0}45%,90%{opacity:.7;transform:scale(1.02)}}.cubi-v2.cubi-btn:hover .comet-a,.cubi-v2.cubi-btn:hover .comet-b,.cubi-v2.cubi-btn:hover .trail-a,.cubi-v2.cubi-btn:hover .trail-b{opacity:1;animation-play-state:running}.cubi-v2.cubi-btn:hover .trail-a.a2,.cubi-v2.cubi-btn:hover .trail-b.b2{opacity:.85}.cubi-v2.cubi-btn:hover .trail-a.a3,.cubi-v2.cubi-btn:hover .trail-b.b3{opacity:.55}.cubi-v2.cubi-btn:hover .trail-a.a4,.cubi-v2.cubi-btn:hover .trail-b.b4{opacity:.3}.cubi-v2.cubi-btn:hover .cross-flash{animation-play-state:running}.cubi-v3.cubi-btn{--w:132px;--h:132px;--radius:26px}.cubi-v3 .cubi-halo{inset:-8px}.cubi-v3 .cubi-orbit{offset-path:path("M 30 0 H 118 A 30 30 0 0 1 148 30 V 118 A 30 30 0 0 1 118 148 H 30 A 30 30 0 0 1 0 118 V 30 A 30 30 0 0 1 30 0 Z");width:148px;height:148px}.cubi-v3 .ring-rainbow,.cubi-v3 .ring-glint{border-radius:34px}.cubi-v3 .inner-rim{border-radius:26px}.cubi-v3 .ring-rainbow{background:conic-gradient(from 0deg, var(--k-purple), var(--k-teal), var(--k-green), var(--k-orange), var(--k-purple));-webkit-mask-composite:xor;opacity:.55;filter:drop-shadow(0 0 4px oklch(75% .18 145/.2));padding:2px;transition:opacity .4s,padding .4s,filter .4s;animation:8s linear infinite paused cubi-aura-spin;inset:-1px;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.cubi-v3.cubi-btn:hover .ring-rainbow{opacity:1;filter:drop-shadow(0 0 6px oklch(75% .18 145/.45));padding:2.5px;animation-play-state:running}.cubi-v3 .ring-glint{-webkit-mask-composite:xor;opacity:0;filter:blur(.2px)drop-shadow(0 0 8px #fff);mix-blend-mode:screen;background:conic-gradient(#0000 0deg 320deg,oklch(100% 0 0/0) 335deg,oklch(100% 0 0/.85) 355deg,#fff 360deg);padding:2.5px;transition:opacity .3s;animation:2s linear infinite paused cubi-aura-spin;inset:-1px;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.cubi-v3.cubi-btn:hover .ring-glint{opacity:1;animation-play-state:running}.cubi-v3 .cubi-label{flex-direction:column;gap:0;padding:0;line-height:1}.cubi-v3 .cubi-label .change{letter-spacing:-.01em;color:var(--cubi-text);text-transform:none;opacity:.85;background:0 0;border-radius:0;margin-bottom:2px;padding:0;font-family:Instrument Serif,serif;font-size:19px;font-style:italic;font-weight:500}.cubi-v3 .cubi-label .design{letter-spacing:-.025em;text-transform:none;color:var(--cubi-text);background:0 0;border-radius:0;padding:0;font-family:Instrument Serif,serif;font-size:30px;font-style:normal;font-weight:700}.cubi-v3 .cubi-pen{display:none}.cubi-v3 .ray{opacity:0;border-radius:999px;width:2px;height:18px;animation-play-state:paused}.cubi-v3 .ray.r1{background:linear-gradient(to top, var(--k-purple) 0%, transparent 100%);animation:4s ease-out infinite cubi-ray-top;top:-18px;left:50%;transform:translate(-50%)scaleY(.2)}.cubi-v3 .ray.r2{background:linear-gradient(to top, var(--k-teal) 0%, transparent 100%);transform-origin:50%;animation:4s ease-out 1s infinite cubi-ray-right;top:50%;right:-18px;transform:translateY(-50%)rotate(90deg)scaleY(.2)}.cubi-v3 .ray.r3{background:linear-gradient(to top, var(--k-green) 0%, transparent 100%);animation:4s ease-out 2s infinite cubi-ray-bottom;bottom:-18px;left:50%;transform:translate(-50%)rotate(180deg)scaleY(.2)}.cubi-v3 .ray.r4{background:linear-gradient(to top, var(--k-orange) 0%, transparent 100%);transform-origin:50%;animation:4s ease-out 3s infinite cubi-ray-left;top:50%;left:-18px;transform:translateY(-50%)rotate(-90deg)scaleY(.2)}.cubi-v3.cubi-btn:hover .ray{animation-play-state:running}@keyframes cubi-ray-top{0%,80%,to{opacity:0;transform:translate(-50%,4px)scaleY(.2)}10%{opacity:1;transform:translate(-50%,-2px)scaleY(1.4)}30%{opacity:0;transform:translate(-50%,-8px)scaleY(.6)}}@keyframes cubi-ray-right{0%,80%,to{opacity:0;transform:translate(-4px,-50%)rotate(90deg)scaleY(.2)}10%{opacity:1;transform:translate(2px,-50%)rotate(90deg)scaleY(1.4)}30%{opacity:0;transform:translate(8px,-50%)rotate(90deg)scaleY(.6)}}@keyframes cubi-ray-bottom{0%,80%,to{opacity:0;transform:translate(-50%,-4px)rotate(180deg)scaleY(.2)}10%{opacity:1;transform:translate(-50%,2px)rotate(180deg)scaleY(1.4)}30%{opacity:0;transform:translate(-50%,8px)rotate(180deg)scaleY(.6)}}@keyframes cubi-ray-left{0%,80%,to{opacity:0;transform:translate(4px,-50%)rotate(-90deg)scaleY(.2)}10%{opacity:1;transform:translate(-2px,-50%)rotate(-90deg)scaleY(1.4)}30%{opacity:0;transform:translate(-8px,-50%)rotate(-90deg)scaleY(.6)}}.cubi-v3 .inner-rim{background:conic-gradient(from 180deg, var(--k-orange), var(--k-green), var(--k-teal), var(--k-purple), var(--k-orange));filter:blur(4px);opacity:0;z-index:0;transition:opacity .5s;animation:10s linear infinite reverse paused cubi-aura-spin;inset:4px}.cubi-v3.cubi-btn:hover .inner-rim{opacity:.22;animation-play-state:running}