@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap";:root{--bg-color:#0f172a;--card-bg:#1e293bb3;--card-border:#ffffff1a;--text-primary:#f8fafc;--text-secondary:#94a3b8;--accent-color:#6366f1;--accent-hover:#818cf8;--discord-color:#5865f2;--spotify-color:#1db954;--radius-lg:24px;--radius-md:16px;--radius-sm:8px;--transition-fast:.2s ease;--transition-smooth:.4s cubic-bezier(.16, 1, .3, 1)}*{box-sizing:border-box;margin:0;padding:0}body{color:var(--text-primary);background-color:#000;justify-content:center;align-items:center;min-height:100vh;padding:2rem;font-family:Inter,sans-serif;display:flex;overflow-x:hidden}.xmb-bg{z-index:-1;background:linear-gradient(135deg,#240b36 0%,#3a1c71 50%,#1c0a2b 100%);width:100vw;height:100vh;position:fixed;top:0;left:0;overflow:hidden}.xmb-line{transform-origin:50%;border:1px solid #ffffff26;border-radius:45%;width:150vw;height:150vw;animation:35s linear infinite xmb-spin;position:absolute;top:30vh;left:-25vw;box-shadow:0 0 30px #ffffff0d,inset 0 0 30px #ffffff0d}.xmb-line:nth-child(2){border:1px solid #ffffff14;width:160vw;height:145vw;animation:45s linear infinite reverse xmb-spin;top:32vh}.xmb-line:nth-child(3){border:1px solid #ffffff0a;width:170vw;height:150vw;animation:55s linear infinite xmb-spin;top:28vh}@keyframes xmb-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.bento-container{grid-template-columns:repeat(4,1fr);grid-auto-rows:minmax(150px,auto);gap:1.5rem;width:100%;max-width:1000px;display:grid}.bento-item{background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(12px);transition:box-shadow var(--transition-smooth), border-color var(--transition-smooth);flex-direction:column;padding:1.5rem;display:flex;position:relative;overflow:hidden}.bento-item:hover{border-color:#fff3;box-shadow:0 20px 40px #0000004d}.bento-item:after{content:"";z-index:2;pointer-events:none;background:linear-gradient(90deg,#fff0 0%,#ffffff26 50%,#fff0 100%);width:50%;height:100%;position:absolute;top:0;left:-150%;transform:skew(-25deg)}.bento-item:hover:after{animation:.75s ease-out .4s shine}@keyframes shine{0%{left:-150%}to{left:250%}}.glow-effect:before{content:"";border-radius:inherit;background:radial-gradient(800px circle at var(--mouse-x,0) var(--mouse-y,0), #ffffff0f, transparent 40%);opacity:0;pointer-events:none;z-index:1;transition:opacity .5s;position:absolute;inset:0}.bento-item:hover:before{opacity:1}.profile-card{text-align:center;grid-area:span 2/span 2;justify-content:center;align-items:center}.spotify-card{grid-area:span 1/span 2}.socials-card{grid-area:span 2/span 1}.about-card{grid-area:span 2/span 2;justify-content:center}.tech-card{grid-area:span 2/span 1}.github-activity-card{grid-area:span 1/span 2}.letterboxd-card{grid-area:span 1/span 2;justify-content:center}.steam-games-card{grid-area:span 1/span 2}.steam-games a{transition:transform var(--transition-fast)}.steam-games a:hover{transform:translateY(-3px)scale(1.05)}.letterboxd-content:hover img{transform:scale(1.05)}.letterboxd-content img{transition:transform var(--transition-fast)}h1{letter-spacing:-.05em;background:linear-gradient(270deg,#c084fc,#ec4899,#818cf8,#c084fc) 0 0/300% 300%;-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:.5rem;font-size:2.5rem;font-weight:800;animation:6s infinite gradient-text}@keyframes gradient-text{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}h2{color:var(--text-primary);margin-bottom:1rem;font-size:1.2rem;font-weight:600}p{color:var(--text-secondary);font-size:.95rem;line-height:1.6}.profile-header{margin-bottom:1.5rem;position:relative}.avatar{border:4px solid var(--card-bg);width:120px;height:120px;transition:transform var(--transition-smooth);border-radius:50%;box-shadow:0 10px 25px #00000080}.profile-card:hover .avatar{transform:scale(1.05)rotate(-3deg)}.status-indicator{border:4px solid var(--card-bg);border-radius:50%;width:24px;height:24px;position:absolute;bottom:5px;right:5px}.status-indicator.online{background-color:#43b581}.status-indicator.idle{background-color:#faa61a}.status-indicator.dnd{background-color:#f04747}.status-indicator.offline{background-color:#747f8d}.tagline{color:var(--text-secondary);margin-bottom:1rem;font-size:1.1rem}.discord-tag{color:var(--discord-color);background:#5865f226;border:1px solid #5865f24d;border-radius:20px;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.9rem;font-weight:600;display:inline-flex}.card-header{color:var(--text-secondary);align-items:center;gap:.5rem;margin-bottom:1rem;font-size:.9rem;font-weight:600;display:flex}.spotify-icon{color:var(--spotify-color);font-size:1.2rem}.profile-header{align-items:center;gap:1.5rem;display:flex;position:relative}.avatar-container{border:2px solid #ffffff1a;border-radius:50%;width:115px;height:115px;position:relative;overflow:hidden;box-shadow:0 4px 15px #0000004d}.avatar-container .avatar,.avatar-container .avatar-hover{object-fit:cover;width:100%;height:100%;transition:opacity .4s;position:absolute;top:0;left:0}.avatar-container .avatar-hover{opacity:0;z-index:2}.avatar-container:hover .avatar-hover{opacity:1}.avatar-container:hover .avatar{opacity:0}.spotify-content{align-items:center;gap:1rem;margin-bottom:1rem;display:flex}.album-art{border-radius:var(--radius-sm);background-color:#ffffff1a;width:60px;height:60px;box-shadow:0 4px 10px #0000004d}.track-info{flex:1}.track-name{margin-bottom:.3rem;font-size:1.1rem;font-weight:600}.artist-name{color:var(--text-secondary);font-size:.9rem}.social-links{flex-direction:column;flex:1;justify-content:space-evenly;gap:.8rem;display:flex}.social-btn{border-radius:var(--radius-md);width:100%;color:var(--text-primary);transition:all var(--transition-fast);background:#ffffff0d;justify-content:center;align-items:center;padding:1rem;font-size:1.5rem;text-decoration:none;display:flex}.social-btn:hover{background:#ffffff26;transform:scale(1.05)}.social-btn.github:hover{color:#fff}.social-btn.steam:hover{color:#66c0f4}.social-btn.linkedin:hover{color:#0a66c2}.social-btn.instagram:hover{color:#e1306c}.about-content{flex-direction:column;gap:1.2rem;display:flex}.about-intro{color:var(--text-secondary);font-size:.95rem;line-height:1.6}.about-intro strong{color:var(--text-primary);font-size:1.05rem}.about-list{grid-template-columns:1fr 1fr;gap:.8rem;padding:0;list-style:none;display:grid}.about-list li{border-radius:var(--radius-sm);color:var(--text-secondary);background:#ffffff08;border:1px solid #ffffff0d;align-items:flex-start;gap:.5rem;padding:.6rem .8rem;font-size:.85rem;line-height:1.4;display:flex}.about-list li strong{color:var(--text-primary);margin-bottom:.1rem;display:inline-block}.about-list .emoji{margin-top:.1rem;font-size:1.1rem}.tech-grid{flex-wrap:wrap;flex:1;place-content:space-evenly center;gap:.8rem;padding-top:.5rem;display:flex}.tech-icon{color:#ffffff4d;transition:all var(--transition-smooth);cursor:pointer;border-radius:var(--radius-sm);padding:.4rem;font-size:2rem;display:flex}.tech-icon:hover{background:#ffffff0d;transform:translateY(-8px)scale(1.15)}.tech-icon.html:hover{color:#e34f26;filter:drop-shadow(0 0 12px #e34f2699)}.tech-icon.css:hover{color:#1572b6;filter:drop-shadow(0 0 12px #1572b699)}.tech-icon.js:hover{color:#f7df1e;filter:drop-shadow(0 0 12px #f7df1e99)}.tech-icon.ts:hover{color:#3178c6;filter:drop-shadow(0 0 12px #3178c699)}.tech-icon.react:hover{color:#61dafb;filter:drop-shadow(0 0 12px #61dafb99)}.tech-icon.vue:hover{color:#4fc08d;filter:drop-shadow(0 0 12px #4fc08d99)}.tech-icon.node:hover{color:#393;filter:drop-shadow(0 0 12px #3939)}.tech-icon.php:hover{color:#777bb4;filter:drop-shadow(0 0 12px #777bb499)}.tech-icon.java:hover{color:#007396;filter:drop-shadow(0 0 12px #00739699)}.tech-icon.c:hover{color:#a8b9cc;filter:drop-shadow(0 0 12px #a8b9cc99)}.tech-icon.git:hover{color:#f05032;filter:drop-shadow(0 0 12px #f0503299)}.tech-icon.pwsh:hover{color:#5391fe;filter:drop-shadow(0 0 12px #5391fe99)}.skeleton-text{color:#0000;background:linear-gradient(90deg,#ffffff0d 25%,#ffffff1a 50%,#ffffff0d 75%) 0 0/200% 100%;border-radius:4px;height:16px;margin-bottom:8px;animation:1.5s infinite shimmer}.skeleton-text.short{width:60%}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@media (width<=900px){.bento-container{grid-template-columns:repeat(2,1fr)}.profile-card,.spotify-card,.about-card,.github-activity-card,.letterboxd-card,.steam-games-card{grid-column:span 2}.socials-card,.tech-card{grid-area:span 1/span 1}.social-links{flex-flow:wrap}.social-btn{width:calc(50% - .4rem)}.about-list{grid-template-columns:1fr}}@media (width<=500px){.bento-container{grid-template-columns:1fr}.bento-item{grid-column:span 1!important}}