@keyframes b4gl5l0{to{background-position-x:200%}}
@keyframes b4gl5l1{0%,to{transform:translateY(0)}50%{transform:translateY(-.16em)}}
@keyframes b4gl5l2{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes b4gl5l3{0%{opacity:0;transform:translate(-40px)}to{opacity:1;transform:translate(0)}}
@keyframes b4gl5l4{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes b4gl5l5{to{transform:rotate(360deg)}}
@keyframes b4gl5l6{0%,45%{opacity:1}50%,95%{opacity:0}to{opacity:1}}
@keyframes b4gl5l7{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}
.b4gl5l8{justify-content:center;align-items:center;gap:var(--space-xl);min-height:100dvh;padding:var(--space-lg);flex-direction:column;display:flex}
.b4gl5l9{z-index:2;width:176px;height:196px;animation-name:b4gl5l4;animation-duration:5s;animation-timing-function:ease-in-out;animation-iteration-count:infinite;position:relative;rotate:6deg}
.b4gl5la{border-radius:var(--radius-full);background:var(--color-surface);border:2px solid var(--color-border);z-index:0;width:140px;height:140px;position:absolute;bottom:0;left:8px;box-shadow:0 12px 32px -10px #5bcefa59}
.b4gl5la:before{content:"";border-radius:var(--radius-full);filter:blur(11px);opacity:.65;z-index:-1;background:conic-gradient(#5bcefa,#f5a9b8,#fff,#f5a9b8,#5bcefa);animation-name:b4gl5l5;animation-duration:9s;animation-timing-function:linear;animation-iteration-count:infinite;position:absolute;inset:-7px}
.b4gl5lb{z-index:1;object-fit:cover;transform-origin:bottom;width:190px;height:190px;transition:transform .3s;position:absolute;bottom:0;left:-7px;-webkit-mask-image:radial-gradient(70px at 85px 120px,#000 69px,#0000 70px),linear-gradient(#000,#000);mask-image:radial-gradient(70px at 85px 120px,#000 69px,#0000 70px),linear-gradient(#000,#000);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:100% 100%,100% 120px;mask-size:100% 100%,100% 120px;-webkit-mask-repeat:no-repeat,no-repeat;mask-repeat:no-repeat,no-repeat}
.b4gl5l9:hover .b4gl5lb{transform:scale(1.05)translateY(-2px)}
.b4gl5lc{text-align:center;align-items:center;gap:var(--space-sm);flex-direction:column;max-width:100%;animation:.6s both b4gl5l2;display:flex}
.b4gl5ld{justify-content:center;align-items:flex-end;gap:var(--space-sm);flex-flow:wrap;animation:.7s cubic-bezier(.2,.8,.2,1) both b4gl5l3;display:flex}
.b4gl5le{letter-spacing:-.02em;white-space:pre;color:#0000;filter:drop-shadow(0 0 14px #5bcefa47)drop-shadow(0 0 14px #f5a9b847);background-image:linear-gradient(90deg,#5bcefa,#f5a9b8,#fff,#f5a9b8,#5bcefa,#5bcefa);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;margin-bottom:-.25rem;margin-left:-1rem;font-size:clamp(2rem,6vw,3rem);font-weight:700;animation:6s linear infinite b4gl5l0}
.b4gl5lf{animation-name:b4gl5l1;animation-duration:2.2s;animation-timing-function:ease-in-out;animation-iteration-count:infinite;display:inline-block}
.b4gl5lg{color:var(--color-muted);font-size:1.05rem;font-family:var(--font-mono);text-align:center;width:100%;min-height:1.6em}
.b4gl5lh{color:var(--color-accent);margin-left:1px;font-weight:700;animation:1.1s step-end infinite b4gl5l6;display:inline-block}
.b4gl5li{gap:var(--space-md);grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));width:100%;max-width:40rem;display:grid}
.b4gl5lj{gap:var(--space-xs);padding:var(--space-lg);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);will-change:transform;transform-origin:bottom;flex-direction:column;transition:background .2s,border-color .2s,transform .25s cubic-bezier(.34,1.4,.5,1),box-shadow .2s;animation:.5s backwards b4gl5l2;display:flex;position:relative;overflow:hidden}
.b4gl5lj:after{content:"";pointer-events:none;background:linear-gradient(100deg,#0000,#f5a9b81f,#5bcefa1f,#0000);width:80%;height:100%;transition:left .6s;position:absolute;top:0;left:-120%;transform:skew(-18deg)}
.b4gl5lj:hover{background:var(--color-surfaceHover);border-color:var(--color-accent);transform:translateY(-6px) rotate(var(--tilt,0deg)) scale(1.03);z-index:3;box-shadow:0 14px 34px -12px #5bcefa66}
.b4gl5lj:hover:after{left:140%}
.b4gl5lk{align-items:center;gap:var(--space-xs);font-size:1.1rem;font-weight:600;display:flex}
.b4gl5ll{color:var(--color-accent);transition:transform .15s}
.b4gl5lj:hover .b4gl5ll{transform:translate(3px)}
.b4gl5lm{color:var(--color-muted);font-size:.9rem}
.b4gl5ln{top:var(--space-md);right:var(--space-md);gap:var(--space-xs);z-index:10;animation:.6s .2s both b4gl5l7;display:flex;position:fixed}
.b4gl5lo{padding:var(--space-xs) var(--space-md);color:#0a0b10;border-radius:var(--radius-full);background-image:linear-gradient(90deg,#5bcefa,#f5a9b8,#fff,#f5a9b8,#5bcefa);background-size:200% 100%;border:none;font-size:.9rem;font-weight:700;text-decoration:none;transition:transform .18s,box-shadow .18s;animation:6s linear infinite b4gl5l0}
.b4gl5lo:hover{transform:translateY(-2px);box-shadow:0 8px 22px -8px #f5a9b899}
.b4gl5lo:active{transform:translateY(0)}
.b4gl5lp{padding:var(--space-xs) var(--space-md);color:var(--color-text);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-full);font-size:.9rem;font-weight:600;text-decoration:none;transition:background .18s,border-color .18s,transform .18s,box-shadow .18s}
.b4gl5lp:hover{background:var(--color-surfaceHover);border-color:var(--color-accent);transform:translateY(-2px);box-shadow:0 8px 22px -10px #5bcefa73}
.b4gl5lp:active{transform:translateY(0)}
.b4gl5lq{color:var(--color-muted);font-size:.85rem;font-family:var(--font-mono);animation:.6s .5s both b4gl5l2}
@media (prefers-reduced-motion:reduce){.b4gl5l9,.b4gl5lc,.b4gl5ld,.b4gl5le{animation:none}.b4gl5lf{animation-name:none}.b4gl5lh,.b4gl5lj,.b4gl5ln,.b4gl5lo,.b4gl5lq{animation:none}}