:root{--bg-base:#0a1520;--bg-surface:#0f1f30;--bg-card:#132435;--bg-card-hover:#172b3c;--bg-pill:#ffffff0d;--accent:#c084fc;--accent-dim:#a855f7;--accent-glow:#c084fc2e;--teal:#2dd4bf;--teal-dim:#2dd4bf26;--text-primary:#f0f4f8;--text-secondary:#94a3b8;--text-muted:#4e6278;--border:#ffffff12;--border-hover:#c084fc4d;--radius-sm:8px;--radius-md:14px;--radius-lg:20px;--radius-xl:28px;--shadow-card:0 8px 32px #0006, 0 1px 0 #ffffff0a inset;--shadow-glow:0 0 40px #c084fc1f;--font-body:"Outfit", system-ui, sans-serif;--font-mono:"JetBrains Mono", monospace;--transition:.22s cubic-bezier(.4, 0, .2, 1)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}body{font-family:var(--font-body);background-color:var(--bg-base);color:var(--text-primary);-webkit-font-smoothing:antialiased;min-height:100vh;line-height:1.6;overflow-x:hidden}a{color:inherit;text-decoration:none}button{cursor:pointer;background:0 0;border:none;font-family:inherit}img{max-width:100%;display:block}#root{min-height:100vh}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--bg-base)}::-webkit-scrollbar-thumb{background:var(--text-muted);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}.app{flex-direction:column;justify-content:center;align-items:center;min-height:100vh;display:flex;position:relative}.bg-grid{z-index:0;pointer-events:none;background-image:linear-gradient(#ffffff06 1px,#0000 1px),linear-gradient(90deg,#ffffff06 1px,#0000 1px);background-size:48px 48px;position:fixed;inset:0}.bg-blob{pointer-events:none;z-index:0;background:radial-gradient(#c084fc14 0%,#2dd4bf0a 45%,#0000 70%);width:900px;height:600px;position:fixed;top:-20%;left:50%;transform:translate(-50%)}.main-content{z-index:1;width:100%;max-width:680px;margin:0;padding:24px;position:relative}.hero-card{border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-card);-webkit-backdrop-filter:blur(16px);transition:border-color var(--transition), box-shadow var(--transition);background:linear-gradient(135deg,#132435e6 0%,#0f1f30f2 100%);align-items:center;gap:32px;margin-bottom:0;padding:36px;display:flex;position:relative;overflow:hidden}.hero-card:before{content:"";pointer-events:none;background:repeating-linear-gradient(-35deg,#0000,#0000 18px,#ffffff03 18px 19px);position:absolute;inset:0}.hero-card:hover{border-color:var(--border-hover);box-shadow:var(--shadow-card), 0 12px 48px #00000080}.hero-text{flex:1;min-width:0}.hero-label{color:var(--accent);letter-spacing:.04em;font-size:13px;font-weight:500;font-family:var(--font-mono);margin-bottom:10px}.hero-name{color:var(--text-primary);letter-spacing:-.02em;margin-bottom:12px;font-size:clamp(28px,5vw,38px);font-weight:700;line-height:1.15}.hero-bio{color:var(--text-secondary);max-width:380px;font-size:15px;line-height:1.65}.hero-tags{flex-wrap:wrap;gap:8px;margin-top:20px;display:flex}.tag{color:var(--text-secondary);background:var(--bg-pill);border:1px solid var(--border);letter-spacing:.025em;transition:color var(--transition), border-color var(--transition), background var(--transition);border-radius:99px;padding:4px 12px;font-size:12px;font-weight:500}.tag:hover{color:var(--accent);border-color:var(--border-hover);background:var(--accent-glow)}.avatar-wrap{border-radius:var(--radius-md);border:1px solid var(--border);background:var(--bg-card);width:120px;height:120px;transition:transform var(--transition), box-shadow var(--transition), border-color var(--transition);flex-shrink:0;position:relative;overflow:hidden;box-shadow:0 4px 24px #0006}.avatar-wrap:hover{border-color:var(--border-hover);transform:translateY(-2px)scale(1.02);box-shadow:0 8px 32px #00000080,0 0 24px #c084fc33}.avatar-wrap img{object-fit:cover;width:100%;height:100%}.avatar-status{background:var(--teal);border:2px solid var(--bg-card);border-radius:50%;width:10px;height:10px;animation:2.4s ease-in-out infinite pulse-teal;position:absolute;bottom:8px;right:8px;box-shadow:0 0 8px #2dd4bf99}@keyframes pulse-teal{0%,to{box-shadow:0 0 8px #2dd4bf99}50%{box-shadow:0 0 16px #2dd4bfe6}}.section-grid{grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px;display:grid}.card{border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:transform var(--transition), border-color var(--transition), box-shadow var(--transition);background:linear-gradient(145deg,#132435d9 0%,#0f1c2ce6 100%);padding:28px;position:relative;overflow:hidden}.card:after{content:"";background:linear-gradient(90deg,#0000,#ffffff0f,#0000);height:1px;position:absolute;top:0;left:0;right:0}.card:hover{border-color:var(--border-hover);box-shadow:var(--shadow-card), 0 12px 40px #0000004d, 0 0 30px #c084fc14;transform:translateY(-3px)}.card-full{grid-column:1/-1}.card-label{font-size:11px;font-weight:600;font-family:var(--font-mono);color:var(--text-muted);letter-spacing:.1em;text-transform:uppercase;margin-bottom:16px}.card-title{color:var(--text-primary);letter-spacing:-.01em;margin-bottom:8px;font-size:18px;font-weight:600}.card-body{color:var(--text-secondary);font-size:14px;line-height:1.7}.project-list{flex-direction:column;gap:12px;display:flex}.project-item{background:var(--bg-pill);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:background var(--transition), border-color var(--transition), transform var(--transition);align-items:flex-start;gap:14px;padding:14px 16px;display:flex}.project-item:hover{border-color:var(--border-hover);background:#c084fc0f;transform:translate(3px)}.project-icon{border-radius:var(--radius-sm);background:var(--bg-card-hover);border:1px solid var(--border);flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;font-size:18px;display:flex}.project-info{flex:1;min-width:0}.project-name{color:var(--text-primary);margin-bottom:3px;font-size:14px;font-weight:600}.project-desc{color:var(--text-muted);font-size:12px;line-height:1.5}.project-arrow{color:var(--text-muted);transition:color var(--transition), transform var(--transition);align-self:center;font-size:16px}.project-item:hover .project-arrow{color:var(--accent);transform:translate(3px)}.skill-grid{flex-wrap:wrap;gap:8px;margin-top:4px;display:flex}.skill-pill{font-size:12px;font-weight:500;font-family:var(--font-mono);color:var(--teal);background:var(--teal-dim);transition:background var(--transition), border-color var(--transition), transform var(--transition);border:1px solid #2dd4bf33;border-radius:99px;padding:5px 12px}.skill-pill:hover{background:#2dd4bf33;border-color:#2dd4bf66;transform:translateY(-1px)}.social-row{flex-wrap:wrap;gap:10px;margin-top:16px;display:flex}.social-btn{color:var(--text-secondary);border:1px solid var(--border);background:var(--bg-pill);transition:color var(--transition), border-color var(--transition), background var(--transition), transform var(--transition);border-radius:99px;align-items:center;gap:7px;padding:7px 16px;font-size:13px;font-weight:500;display:inline-flex}.social-btn:hover{color:var(--accent);border-color:var(--border-hover);background:var(--accent-glow);transform:translateY(-1px)}.social-btn svg{flex-shrink:0}.status-bar{color:var(--text-muted);align-items:center;gap:8px;padding:10px 0 0;font-size:13px;display:flex}.status-dot{background:var(--teal);border-radius:50%;flex-shrink:0;width:7px;height:7px;animation:2.4s ease-in-out infinite pulse-teal;box-shadow:0 0 8px #2dd4bf99}.now-playing{align-items:center;gap:12px;display:flex}.eq-bars{align-items:flex-end;gap:2px;height:16px;display:flex}.eq-bar{background:var(--accent);width:3px;animation:eq-bounce var(--dur,.8s) ease-in-out infinite alternate;border-radius:2px}.eq-bar:first-child{--dur:.7s;height:6px;animation-delay:0s}.eq-bar:nth-child(2){--dur:.9s;height:12px;animation-delay:.1s}.eq-bar:nth-child(3){--dur:.6s;height:8px;animation-delay:.2s}.eq-bar:nth-child(4){--dur:1.1s;height:14px;animation-delay:50ms}@keyframes eq-bounce{0%{transform:scaleY(.3)}to{transform:scaleY(1)}}.footer{z-index:1;text-align:center;color:var(--text-muted);font-size:12px;font-family:var(--font-mono);padding:24px;position:absolute;bottom:0;left:0;right:0}@keyframes fade-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.fade-up{opacity:0;animation:.5s forwards fade-up}.delay-1{animation-delay:50ms}.delay-2{animation-delay:.12s}.delay-3{animation-delay:.2s}.delay-4{animation-delay:.28s}.delay-5{animation-delay:.36s}@media (width<=600px){.hero-card{flex-direction:column-reverse;padding:28px 24px}.avatar-wrap{align-self:flex-end;width:90px;height:90px}.section-grid{grid-template-columns:1fr}.main-content{padding:32px 16px 64px}}