*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
  :root {
    --navy: #050A18; --navy-2: #0A1128; --navy-3: #0F1A3A;
    --violet: #7C3AED; --violet-light: #9D5CF6; --lavender: #C4B5FD;
    --mint: #34D399; --mint-dim: #10B981;
    --white: #F8F7FF; --white-dim: rgba(248,247,255,0.68); --white-faint: rgba(248,247,255,0.1);
    --glow-v: rgba(124,58,237,0.35);
  }
  html { scroll-behavior: smooth; }
  body { background: var(--navy); color: var(--white); font-family: 'Inter', sans-serif; line-height: 1.6; cursor: none; overflow-x: hidden; }

  /* CURSOR */
  .cursor { position: fixed; top:0; left:0; z-index:9999; pointer-events:none; }
  .cursor-dot { width:7px; height:7px; background:var(--mint); border-radius:50%; position:absolute; transform:translate(-50%,-50%); }
  .cursor-ring { width:34px; height:34px; border:1.5px solid var(--lavender); border-radius:50%; position:absolute; transform:translate(-50%,-50%); transition:all .15s ease; opacity:.65; }
  .cursor-ring.hov { width:52px; height:52px; border-color:var(--mint); opacity:1; background:rgba(52,211,153,.07); }

  /* NAV */
  nav { position:fixed; top:0; left:0; right:0; z-index:100; padding:1.1rem 4rem; display:flex; align-items:center; justify-content:space-between; backdrop-filter:blur(20px); background:rgba(5,10,24,.75); border-bottom:1px solid rgba(124,58,237,.12); }
  .nav-logo { font-family:'Space Mono',monospace; font-size:1rem; color:var(--lavender); }
  .nav-logo span { color:var(--mint); }
  .nav-links { display:flex; gap:2.2rem; list-style:none; }
  .nav-links a { font-family:'Space Grotesk',sans-serif; font-size:.82rem; font-weight:500; color:var(--white-dim); text-decoration:none; letter-spacing:.07em; text-transform:uppercase; position:relative; transition:color .2s; }
  .nav-links a::after { content:''; position:absolute; bottom:-3px; left:0; right:0; height:1px; background:var(--mint); transform:scaleX(0); transform-origin:right; transition:transform .28s; }
  .nav-links a:hover { color:var(--white); }
  .nav-links a:hover::after { transform:scaleX(1); transform-origin:left; }
  .nav-cta { font-family:'Space Grotesk',sans-serif; font-size:.82rem; font-weight:600; padding:.55rem 1.3rem; border:1.5px solid var(--violet); border-radius:6px; color:var(--lavender); text-decoration:none; transition:all .25s; }
  .nav-cta:hover { background:var(--violet); color:var(--white); box-shadow:0 0 22px var(--glow-v); }

  /* HERO */
  #hero { position:relative; min-height:100vh; display:flex; align-items:center; padding:7rem 4rem 4rem; overflow:hidden; }
  #heroCanvas { position:absolute; inset:0; width:100%; height:100%; z-index:0; }
  .hero-content { position:relative; z-index:2; max-width:720px; }
  .hero-eyebrow { font-family:'Space Mono',monospace; font-size:.75rem; color:var(--mint); letter-spacing:.18em; text-transform:uppercase; margin-bottom:1.4rem; opacity:0; animation:fadeUp .8s .3s forwards; }
  .hero-name { font-family:'Space Grotesk',sans-serif; font-size:clamp(3.2rem,8vw,6.5rem); font-weight:700; line-height:1; letter-spacing:-.03em; margin-bottom:.4rem; opacity:0; animation:fadeUp .9s .5s forwards; }
  .hero-name .last { display:block; background:linear-gradient(135deg,var(--violet-light),var(--mint)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
  .hero-title { font-family:'Space Grotesk',sans-serif; font-size:clamp(1rem,2.5vw,1.35rem); font-weight:300; color:var(--lavender); margin-bottom:1.6rem; opacity:0; animation:fadeUp .9s .7s forwards; }
  .hero-desc { font-size:.97rem; color:var(--white-dim); max-width:520px; line-height:1.8; margin-bottom:2.6rem; opacity:0; animation:fadeUp .9s .9s forwards; }
  .hero-actions { display:flex; gap:1rem; flex-wrap:wrap; opacity:0; animation:fadeUp .9s 1.1s forwards; }
  .btn-primary { padding:.85rem 2rem; background:linear-gradient(135deg,var(--violet),var(--mint-dim)); color:var(--white); font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:.9rem; border:none; border-radius:8px; text-decoration:none; transition:all .3s; box-shadow:0 0 28px var(--glow-v); }
  .btn-primary:hover { transform:translateY(-2px); box-shadow:0 0 48px var(--glow-v),0 8px 20px rgba(0,0,0,.3); }
  .btn-outline { padding:.85rem 2rem; background:transparent; color:var(--white); font-family:'Space Grotesk',sans-serif; font-weight:500; font-size:.9rem; border:1.5px solid var(--white-faint); border-radius:8px; text-decoration:none; transition:all .3s; }
  .btn-outline:hover { border-color:var(--lavender); color:var(--lavender); transform:translateY(-2px); }
  .scroll-hint { position:absolute; bottom:2.2rem; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:.4rem; z-index:2; opacity:0; animation:fadeIn 1s 1.8s forwards; }
  .scroll-hint span { font-family:'Space Mono',monospace; font-size:.6rem; letter-spacing:.18em; color:rgba(248,247,255,.2); text-transform:uppercase; }
  .scroll-line { width:1px; height:44px; background:linear-gradient(to bottom,var(--violet),transparent); animation:pulse 2s infinite; }
  @keyframes pulse { 0%,100%{opacity:.35} 50%{opacity:1} }

  /* SHARED */
  .sec { padding:7rem 4rem; max-width:1200px; margin:0 auto; }
  .sec-full { padding:7rem 4rem; max-width:100%; }
  .sec-inner { max-width:1200px; margin:0 auto; }
  .lbl { font-family:'Space Mono',monospace; font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:var(--mint); margin-bottom:.7rem; }
  .ttl { font-family:'Space Grotesk',sans-serif; font-size:clamp(1.9rem,4vw,2.8rem); font-weight:700; letter-spacing:-.02em; line-height:1.1; margin-bottom:1rem; }
  .ttl em { font-style:normal; background:linear-gradient(135deg,var(--violet-light),var(--lavender)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
  .divider { width:44px; height:2px; background:linear-gradient(90deg,var(--violet),var(--mint)); margin-bottom:3.2rem; border-radius:2px; }

  /* ABOUT */
  #about { border-top:1px solid var(--white-faint); }
  .about-grid { display:grid; grid-template-columns:1fr 1.6fr; gap:5rem; align-items:center; }
  .portrait-frame { aspect-ratio:3/4; max-width:320px; border-radius:16px; background:linear-gradient(135deg,var(--navy-3),var(--navy-2)); border:1px solid rgba(124,58,237,.28); display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; }
  .portrait-frame::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 30% 20%,rgba(124,58,237,.13),transparent 60%); }
  .portrait-glow { position:absolute; width:100px; height:100px; border-radius:50%; background:var(--violet); filter:blur(55px); opacity:.3; bottom:20%; left:20%; }
  .portrait-initials { font-family:'Space Grotesk',sans-serif; font-size:5rem; font-weight:700; background:linear-gradient(135deg,var(--violet-light),var(--mint)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; position:relative; z-index:1; }
  .about-text p { color:var(--white-dim); line-height:1.85; margin-bottom:1.1rem; font-size:.98rem; }
  .about-text p strong { color:var(--lavender); font-weight:500; }
  .about-links { display:flex; gap:.8rem; margin-top:1.8rem; flex-wrap:wrap; }
  .alink { display:inline-flex; align-items:center; gap:.5rem; padding:.5rem 1.1rem; border-radius:8px; border:1px solid var(--white-faint); color:var(--white-dim); text-decoration:none; font-size:.82rem; font-family:'Space Grotesk',sans-serif; transition:all .25s; }
  .alink:hover { border-color:var(--mint); color:var(--mint); background:rgba(52,211,153,.07); }

  /* SKILLS */
  .skills-bg { background:var(--navy-2); }
  .skills-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); gap:1.3rem; margin-top:3rem; }
  .sg { background:var(--navy); border:1px solid var(--white-faint); border-radius:13px; padding:1.6rem; transition:all .3s; position:relative; overflow:hidden; }
  .sg::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background:linear-gradient(90deg,var(--violet),var(--mint)); opacity:0; transition:opacity .3s; }
  .sg:hover::before { opacity:1; }
  .sg:hover { border-color:rgba(124,58,237,.38); transform:translateY(-4px); box-shadow:0 10px 36px rgba(0,0,0,.35); }
  .sg-icon { font-size:1.6rem; margin-bottom:.7rem; }
  .sg-title { font-family:'Space Grotesk',sans-serif; font-size:.8rem; font-weight:600; color:var(--lavender); letter-spacing:.08em; text-transform:uppercase; margin-bottom:.9rem; }
  .pills { display:flex; flex-wrap:wrap; gap:.45rem; }
  .pill { font-family:'Space Mono',monospace; font-size:.68rem; padding:.28rem .75rem; border-radius:100px; border:1px solid var(--white-faint); color:var(--white-dim); transition:all .2s; }
  .pill:hover { border-color:var(--mint); color:var(--mint); background:rgba(52,211,153,.07); }
  .pill.hi { border-color:rgba(124,58,237,.45); color:var(--lavender); background:rgba(124,58,237,.09); }

  /* PROJECTS */
  .projects-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:1.4rem; margin-top:3rem; }
  .pc { background:var(--navy-2); border:1px solid var(--white-faint); border-radius:15px; padding:1.8rem; display:flex; flex-direction:column; transition:all .32s; position:relative; overflow:hidden; }
  .pc::after { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at top right,rgba(124,58,237,.09),transparent 60%); opacity:0; transition:opacity .3s; }
  .pc:hover::after { opacity:1; }
  .pc:hover { border-color:rgba(124,58,237,.45); transform:translateY(-5px); box-shadow:0 18px 50px rgba(0,0,0,.45); }
  .pc-icon { font-size:2rem; margin-bottom:1.1rem; }
  .pc-title { font-family:'Space Grotesk',sans-serif; font-size:1.08rem; font-weight:700; color:var(--white); margin-bottom:.5rem; }
  .pc-desc { font-size:.88rem; color:var(--white-dim); line-height:1.75; flex:1; margin-bottom:1rem; }
  .pc-stat { font-family:'Space Mono',monospace; font-size:.74rem; color:var(--mint); margin-bottom:.9rem; }
  .pc-stack { display:flex; flex-wrap:wrap; gap:.38rem; }
  .stag { font-size:.66rem; font-family:'Space Mono',monospace; padding:.18rem .55rem; border-radius:4px; background:rgba(52,211,153,.07); color:var(--mint-dim); border:1px solid rgba(52,211,153,.18); }
  .pc-gh { display:inline-flex; align-items:center; gap:.4rem; margin-top:1rem; font-size:.75rem; font-family:'Space Grotesk',sans-serif; color:var(--lavender); text-decoration:none; opacity:.7; transition:opacity .2s; }
  .pc-gh:hover { opacity:1; }

  /* RESEARCH — one card, same weight as others */
  .research-card { background:var(--navy-2); border:1px solid var(--white-faint); border-radius:15px; padding:2rem; margin-top:3rem; transition:all .3s; }
  .research-card:hover { border-color:rgba(124,58,237,.4); box-shadow:0 12px 40px rgba(0,0,0,.4); }
  .rc-header { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-bottom:1.2rem; }
  .rc-title { font-family:'Space Grotesk',sans-serif; font-size:1.08rem; font-weight:700; color:var(--white); }
  .rc-date { font-family:'Space Mono',monospace; font-size:.68rem; color:var(--mint); white-space:nowrap; margin-top:.25rem; }
  .rc-desc { font-size:.9rem; color:var(--white-dim); line-height:1.75; margin-bottom:1rem; }
  .tag-row { display:flex; flex-wrap:wrap; gap:.4rem; }
  .tag { font-family:'Space Mono',monospace; font-size:.66rem; padding:.22rem .65rem; border-radius:4px; background:rgba(124,58,237,.14); color:var(--lavender); border:1px solid rgba(124,58,237,.28); }

  /* EDU */
  .edu-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.3rem; margin-top:3rem; }
  .ec { background:var(--navy-2); border:1px solid var(--white-faint); border-radius:13px; padding:1.8rem; transition:all .28s; }
  .ec:hover { border-color:rgba(196,181,253,.35); transform:translateY(-4px); box-shadow:0 10px 36px rgba(0,0,0,.38); }
  .ec-deg { font-family:'Space Grotesk',sans-serif; font-size:1rem; font-weight:700; color:var(--white); margin-bottom:.2rem; }
  .ec-field { font-size:.83rem; color:var(--lavender); margin-bottom:.15rem; }
  .ec-school { font-size:.8rem; color:var(--white-dim); }
  .ec-date { font-family:'Space Mono',monospace; font-size:.68rem; color:var(--mint); margin:.5rem 0 .9rem; }
  .ec-tags { display:flex; flex-wrap:wrap; gap:.38rem; margin-top:.7rem; }
  .ctag { font-size:.65rem; font-family:'Space Mono',monospace; padding:.18rem .55rem; border-radius:4px; background:var(--white-faint); color:var(--white-dim); }

  /* CONTACT */
  #contact { text-align:center; padding:8rem 4rem; position:relative; overflow:hidden; }
  #contact::before { content:''; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:500px; height:500px; border-radius:50%; background:radial-gradient(ellipse,rgba(124,58,237,.1),transparent 70%); pointer-events:none; }
  .contact-inner { position:relative; z-index:1; max-width:580px; margin:0 auto; }
  .c-title { font-family:'Space Grotesk',sans-serif; font-size:clamp(1.7rem,4vw,2.6rem); font-weight:700; line-height:1.2; margin-bottom:.9rem; }
  .c-sub { color:var(--white-dim); font-size:.97rem; line-height:1.75; margin-bottom:2.6rem; }
  .c-links { display:flex; gap:.9rem; justify-content:center; flex-wrap:wrap; margin-bottom:2.2rem; }
  .cl { display:flex; align-items:center; gap:.55rem; padding:.75rem 1.4rem; border-radius:9px; border:1px solid var(--white-faint); color:var(--white-dim); text-decoration:none; font-family:'Space Grotesk',sans-serif; font-size:.87rem; font-weight:500; transition:all .28s; }
  .cl:hover { border-color:var(--mint); color:var(--mint); background:rgba(52,211,153,.07); transform:translateY(-2px); }
  .domain { display:inline-block; font-family:'Space Mono',monospace; font-size:.78rem; padding:.45rem 1.1rem; border-radius:100px; background:linear-gradient(135deg,rgba(124,58,237,.18),rgba(52,211,153,.08)); border:1px solid rgba(124,58,237,.38); color:var(--lavender); letter-spacing:.1em; }

  footer { text-align:center; padding:1.8rem; border-top:1px solid var(--white-faint); font-family:'Space Mono',monospace; font-size:.68rem; color:rgba(248,247,255,.22); letter-spacing:.07em; }
  footer span { color:var(--mint); }

  /* ANIMS */
  @keyframes fadeUp { from{opacity:0;transform:translateY(28px)} to{opacity:1;transform:translateY(0)} }
  @keyframes fadeIn { from{opacity:0} to{opacity:1} }
  .reveal { opacity:0; transform:translateY(24px); transition:opacity .65s ease,transform .65s ease; }
  .reveal.visible { opacity:1; transform:translateY(0); }
  .d1{transition-delay:.1s} .d2{transition-delay:.18s} .d3{transition-delay:.26s} .d4{transition-delay:.34s}

  @media(max-width:768px){
    nav{padding:1rem 1.5rem} .nav-links{display:none}
    #hero,.sec,.sec-full{padding:5rem 1.4rem 4rem}
    .about-grid,.edu-grid{grid-template-columns:1fr; gap:2rem}
    #contact{padding:5rem 1.4rem}
  }
  @media(prefers-reduced-motion:reduce){ *,*::before,*::after{animation:none!important;transition:none!important} }