*{box-sizing:border-box}
body{margin:0;min-height:100vh;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 40%,#1a1b26,#0a0a10 70%);color:#fff;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;overflow:hidden}
#bg3d{position:fixed;inset:0;width:100%;height:100%;z-index:0}
main{transition:transform .25s ease-out;position:relative;z-index:1;padding:2.2rem;border-radius:28px;background:rgba(20,21,30,.55);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);box-shadow:0 30px 80px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.15);animation:in .8s cubic-bezier(.2,.8,.2,1)}
@keyframes in{from{opacity:0;transform:translateY(18px) scale(.97)}}
.gbtn{display:flex;align-items:center;gap:.8rem;padding:.95rem 1.8rem;border-radius:14px;background:#fff;color:#1f1f1f;text-decoration:none;font-weight:600;font-size:1rem;box-shadow:0 6px 24px rgba(0,0,0,.35);transition:transform .2s,box-shadow .2s}
.gbtn:hover{transform:translateY(-2px);box-shadow:0 12px 34px rgba(0,0,0,.5)}
.gbtn:active{transform:none}
@media (prefers-reduced-motion:reduce){*{animation:none!important}}