:root{--bg-gradient-start: rgb(0, 0, 80);--bg-gradient-end: rgb(7, 0, 135);--card-gradient-start: rgb(255, 68, 238);--card-gradient-mid: rgb(23, 0, 213);--card-gradient-end: rgb(23, 0, 213);--text-color: #ffffff;--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--grid-gap: 1.5rem;--border-radius: 50px}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;background-color:#000050}body{font-family:var(--font-family);background:#000050;color:var(--text-color);height:100vh;overflow:hidden;display:flex;justify-content:center;align-items:center;padding:0}.main-container{width:100%;max-width:600px;height:100%;display:flex;flex-direction:column;gap:1.5rem;padding:2rem;box-sizing:border-box;justify-content:center}.profile-header{text-align:center;display:flex;flex-direction:column;align-items:center;gap:1rem;margin-bottom:1rem}.avatar-container{width:100px;height:100px;border-radius:50%;overflow:hidden;box-shadow:0 4px 15px #0000004d;transition:transform .3s ease}.avatar-container:hover{transform:scale(1.1) rotate(5deg)}.avatar-img{width:100%;height:100%;object-fit:cover}.profile-info h1{font-size:2rem;font-weight:700;margin:0}.tagline{font-size:1rem;opacity:.9}.grid-layout{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);gap:var(--grid-gap);width:100%;height:60vh;max-height:600px;perspective:1000px}.card-float-wrapper{width:100%;height:100%}@keyframes gradient-move{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.grid-card{background:linear-gradient(-45deg,#f4e,#1700d5 40%,#1700d5 60%,#f4e);background-size:300% 300%;animation:gradient-move 8s ease infinite;border-radius:var(--border-radius);text-decoration:none;color:var(--text-color);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5rem;transition:all .3s cubic-bezier(.25,.8,.25,1);position:relative;overflow:hidden;width:100%;height:100%}.card-content{display:flex;flex-direction:column;align-items:center;gap:1.5rem;width:100%;justify-content:center}.icon-img{width:48px;height:48px;filter:brightness(0) invert(1);transition:transform .3s ease}.label{font-weight:600;font-size:1.4rem}.grid-card:hover{transform:translateY(-5px) scale(1.02);filter:brightness(1.2)}.grid-card:hover .icon-img{transform:scale(1.1)}.grid-card:active{transform:scale(.95)!important;transition:transform .1s}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-4px)}to{transform:translateY(0)}}.card-float-wrapper:nth-child(1){animation:float 8s ease-in-out infinite;animation-delay:0s}.card-float-wrapper:nth-child(2){animation:float 9s ease-in-out infinite;animation-delay:1s}.card-float-wrapper:nth-child(3){animation:float 7.5s ease-in-out infinite;animation-delay:2s}.card-float-wrapper:nth-child(4){animation:float 8.5s ease-in-out infinite;animation-delay:.5s}.card-float-wrapper:nth-child(1) .grid-card{animation-duration:20s;animation-delay:0s}.card-float-wrapper:nth-child(2) .grid-card{animation-duration:16s;animation-delay:-4s;background-image:linear-gradient(-45deg,#f4e,#1700d5 40%,#1700d5 60%,#f4e)}.card-float-wrapper:nth-child(3) .grid-card{animation-duration:24s;animation-delay:-10s;background-image:linear-gradient(-45deg,#f4e,#1700d5 40%,#1700d5 60%,#f4e)}.card-float-wrapper:nth-child(4) .grid-card{animation-duration:18s;animation-delay:-2s;background-image:linear-gradient(-45deg,#f4e,#1700d5 40%,#1700d5 60%,#f4e)}.shop{grid-column:span 1}.shop .grid-card{background-image:linear-gradient(-45deg,#f4e,#1700d5 40%,#1700d5 60%,#f4e)}@media (max-width: 500px){.grid-layout{grid-template-columns:1fr;grid-template-rows:repeat(4,1fr);height:65vh;gap:.8rem}.grid-card{background-image:linear-gradient(-45deg,#f4e,#1700d5 22%,#1700d5 78%,#f4e)!important;flex-direction:row;justify-content:center;padding:0 1.5rem}.card-content{flex-direction:row;gap:1rem}.icon-img{width:28px;height:28px}.label{font-size:1.1rem}.shop{grid-column:span 1}}.decoration-card{background:#ffffff1a;border:2px dashed rgba(255,255,255,.2);display:flex;justify-content:center;align-items:center;pointer-events:none}
