:root{--bg:#030B1B;--glass:#0f172a77;--neon-1:#4DFFFF;--neon-2:#A275FF;--neon-3:#FF61D8;--accent:#FFB14D;--muted:rgba(255,255,255,.78);--glass-border:rgba(255,255,255,.08);font-family:Poppins,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;color:var(--muted);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#app{height:100%}body{margin:0;background:linear-gradient(120deg,#020915,#081633,#150b33 70%,#1b0b29);overflow-x:hidden;color:var(--muted)}#bg-canvas{position:fixed;inset:0;z-index:0;pointer-events:none}#app{position:relative;z-index:2;min-height:100vh;display:flex;flex-direction:column}.site-wrap{max-width:1100px;margin:3.5rem auto;padding:2rem;display:grid;grid-template-columns:1fr 380px;gap:2rem;align-items:start}.hero{padding:2.2rem;border-radius:16px;background:linear-gradient(165deg,#ffffff08,#ffffff03);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--glass-border);box-shadow:0 8px 32px #0003}.name{font-weight:800;font-size:clamp(2rem,4vw,3.2rem);margin:0 0 .25rem;background:linear-gradient(90deg,var(--neon-1),var(--neon-2),var(--neon-3));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 30px rgba(77,255,255,.2)}.role{font-weight:600;color:#ffffffd9;margin:0 0 1rem}.bio{color:#ffffffbf;line-height:1.6}.skills{color:#ffffffbf;line-height:1.8;margin-top:1rem}.actions{margin-top:1.25rem;display:flex;gap:1rem;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;gap:.6rem;padding:.7rem 1.1rem;border-radius:12px;border:1px solid transparent;background:linear-gradient(90deg,#ffffff08,#ffffff05);color:var(--muted);cursor:pointer;transition:all .22s}.btn.primary{background:linear-gradient(90deg,var(--neon-1),var(--neon-2),var(--neon-3));background-size:200% 100%;color:#061022;font-weight:700;box-shadow:0 8px 30px #a275ff26,0 2px 8px #4dffff1a;animation:gradientFlow 3s ease infinite}.btn.ghost{border:1px solid rgba(255,255,255,.06)}.btn:hover{transform:translateY(-4px)}.sidebar{position:relative;padding:1.6rem;border-radius:14px;background:linear-gradient(180deg,#ffffff05,#ffffff03);border:1px solid var(--glass-border);min-height:220px}.profile{display:flex;gap:1rem;align-items:center}.avatar{width:72px;height:72px;border-radius:14px;background:linear-gradient(135deg,var(--neon-1),var(--neon-2));box-shadow:0 8px 30px #0009;overflow:hidden;flex:0 0 auto}.avatar img{width:100%;height:100%;display:block;object-fit:cover;border-radius:12px}.meta{font-weight:600}.meta small{display:block;font-weight:400;color:#ffffffa6}.projects{margin-top:1.35rem;display:grid;grid-template-columns:1fr 1fr;gap:.9rem}.project{padding:1rem;border-radius:12px;background:linear-gradient(180deg,rgba(255,255,255,.01),transparent);border:1px solid rgba(255,255,255,.03);transition:transform .25s,box-shadow .25s}.project:hover{transform:translateY(-8px);box-shadow:0 20px 60px #07122399}.project .title{font-weight:700}.project .tag{font-size:.78rem;color:#fff9}.footer{margin:3rem 0 1rem;text-align:center;color:#ffffff73;font-size:.95rem}.glow{position:relative}.glow:after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:6px;border-radius:999px;background:linear-gradient(90deg,var(--neon-1),var(--neon-2));filter:blur(8px);opacity:.7}@media(max-width:940px){.site-wrap{grid-template-columns:1fr;padding:1.5rem}.projects{grid-template-columns:1fr}}@keyframes floaty{0%{transform:translateY(0)}50%{transform:translateY(-6px)}to{transform:translateY(0)}}.avatar{animation:floaty 4s ease-in-out infinite}.contact-form{margin-top:2rem;padding:1.5rem;border-radius:12px;background:linear-gradient(180deg,rgba(255,255,255,.01),transparent);border:1px solid rgba(255,255,255,.03)}.contact-form h2{font-size:1.5rem;margin:0 0 1rem;background:linear-gradient(90deg,var(--neon-1),var(--neon-2));-webkit-background-clip:text;background-clip:text;color:transparent}.form-group{margin-bottom:1rem}.form-group input,.form-group textarea{width:100%;padding:.8rem 1rem;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:#ffffff0d;color:var(--muted);font-family:inherit;font-size:1rem;transition:all .3s}.form-group textarea{min-height:120px;resize:vertical}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--neon-1);box-shadow:0 0 0 2px #00f0ff1a}.contact-form .btn{margin-top:1rem;width:100%;justify-content:center}@keyframes gradientFlow{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.muted{color:#ffffff8c}
