:root{--bg:#0b0a1a;--bg-2:#12102a;--panel:#171531;--panel-2:#201d42;--ink:#fff;--muted:#b4b2d2;--faint:#ffffff14;--line:#ffffff21;--iris:#8f7bff;--cyan:#4de1ff;--pink:#ff6ec7;--amber:#ffc24d;--grad:linear-gradient(92deg, var(--iris) 0%, var(--cyan) 48%, var(--pink) 100%);--font-display:"Clash Display", sans-serif;--font-body:"Satoshi", sans-serif;--font-mono:"IBM Plex Mono", monospace;--container:1240px;--pad:clamp(20px, 4vw, 56px)}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:auto;-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--ink);font-family:var(--font-body);-webkit-font-smoothing:antialiased;font-size:17px;line-height:1.65;overflow-x:hidden}::selection{background:var(--cyan);color:#0b0a1a}a,button,.key{-webkit-tap-highlight-color:transparent;touch-action:manipulation}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer;color:inherit;background:0 0;border:none}.aurora{z-index:0;pointer-events:none;background:radial-gradient(52% 44% at 12% 8%,#8f7bff47,#0000 70%),radial-gradient(46% 40% at 88% 24%,#4de1ff29,#0000 70%),radial-gradient(50% 44% at 78% 88%,#ff6ec729,#0000 70%),radial-gradient(40% 36% at 22% 78%,#4de1ff1a,#0000 70%);position:fixed;inset:0}#webgl{z-index:0;pointer-events:none;position:fixed;inset:0}.noise{z-index:30;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:8s steps(10,end) infinite grain;position:fixed;inset:-50%}@keyframes grain{0%,to{transform:translate(0)}10%{transform:translate(-5%,-8%)}30%{transform:translate(3%,-12%)}50%{transform:translate(8%,4%)}70%{transform:translate(-9%,6%)}90%{transform:translate(4%,10%)}}main{z-index:2;position:relative}.container{width:min(var(--container), 100% - 2 * var(--pad));margin-inline:auto}section{padding:clamp(90px,12vh,160px) 0;position:relative}.mono{font-family:var(--font-mono);letter-spacing:.18em;text-transform:uppercase;font-size:12px;font-weight:500}.mono-dim{color:var(--muted)}.grad-text{background:var(--grad);color:#0000;-webkit-background-clip:text;background-clip:text}.section-head{align-items:baseline;gap:18px;margin-bottom:clamp(40px,6vh,72px);display:flex;overflow:hidden}.section-head .num{font-family:var(--font-mono);color:var(--cyan);letter-spacing:.2em;font-size:13px}.section-head h2{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.01em;font-size:clamp(32px,5.2vw,60px);font-weight:600;line-height:1}.section-head .rule{background:linear-gradient(90deg, var(--line), transparent);flex:1;align-self:center;height:1px}.nav{z-index:20;padding:18px var(--pad);justify-content:space-between;align-items:center;display:flex;position:fixed;top:0;left:0;right:0}.nav:before{content:"";pointer-events:none;background:linear-gradient(#0b0a1ad9,#0000);position:absolute;inset:0}.nav>*{position:relative}.nav .logo{font-family:var(--font-display);letter-spacing:.05em;font-size:19px;font-weight:700}.nav .logo em{background:var(--grad);color:#0000;-webkit-background-clip:text;background-clip:text;font-style:normal}.nav-links{gap:28px;display:flex}.nav-links a{font-family:var(--font-mono);letter-spacing:.18em;color:var(--muted);font-size:11px;transition:color .25s}.nav-links a:hover{color:var(--cyan)}.badge{font-family:var(--font-mono);letter-spacing:.16em;color:#dcd7ff;background:linear-gradient(#8f7bff38,#8f7bff14);border:1px solid #8f7bff73;border-radius:100px;align-items:center;gap:8px;padding:8px 14px;font-size:10px;display:inline-flex;box-shadow:inset 0 1px #ffffff2e,0 4px 14px #0006}.badge .dot{background:var(--cyan);width:6px;height:6px;box-shadow:0 0 8px var(--cyan);border-radius:50%;animation:2s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.75)}}.hero{flex-direction:column;justify-content:center;min-height:100svh;padding-top:120px;display:flex}.hero .status{color:var(--cyan);margin-bottom:26px}.hero-name{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.005em;font-size:clamp(56px,13vw,158px);font-weight:700;line-height:.94}.hero-name .line{display:block;overflow:hidden}.hero-name .line span{display:inline-block}.hero-name .line.grad span{background:var(--grad);color:#0000;-webkit-background-clip:text;background-clip:text}.hero-sub{flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:34px;display:flex}.hero-role{font-family:var(--font-mono);letter-spacing:.24em;color:var(--ink);border:1px solid var(--line);background:#171531bf;border-radius:8px;padding:10px 16px;font-size:13px;box-shadow:inset 0 1px #ffffff1a}.hero-tagline{color:#cfcde6;max-width:540px;font-size:clamp(15px,1.4vw,18px)}.hero-cta{flex-wrap:wrap;gap:18px;margin-top:44px;display:flex}.hero-scroll{color:var(--muted);flex-direction:column;align-items:center;gap:10px;display:flex;position:absolute;bottom:34px;left:50%;transform:translate(-50%)}.hero-scroll .wheel{border:1.5px solid var(--muted);border-radius:12px;width:22px;height:36px;position:relative}.hero-scroll .wheel:after{content:"";background:var(--cyan);border-radius:3px;width:3px;height:7px;margin-left:-1.5px;animation:1.8s ease-in-out infinite wheel;position:absolute;top:6px;left:50%}@keyframes wheel{0%{opacity:1;transform:translateY(0)}70%{opacity:0;transform:translateY(12px)}to{opacity:0;transform:translateY(0)}}.btn{--btn-face:linear-gradient(180deg, #2b2852, #1b1938);--btn-base:#0a0920;font-family:var(--font-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--ink);background:var(--btn-face);box-shadow:inset 0 1px 0 #ffffff2e, inset 0 -2px 4px #00000059, 0 6px 0 -1px var(--btn-base), 0 14px 24px #00000080;border:1px solid #ffffff24;border-radius:12px;align-items:center;gap:10px;padding:16px 28px;font-size:12px;font-weight:600;transition:transform .12s,box-shadow .12s,color .2s;display:inline-flex;transform:translateY(0)}.btn:hover{color:var(--cyan)}.btn:active{box-shadow:inset 0 1px 0 #ffffff1f, inset 0 2px 6px #00000073, 0 1px 0 -1px var(--btn-base), 0 4px 10px #00000059;transform:translateY(5px)}.btn-primary{--btn-face:linear-gradient(115deg, #a695ff 0%, #6fe6ff 55%, #ff8ed3 115%);--btn-base:#37277d;color:#14103a;text-shadow:0 1px #ffffff59;border-color:#ffffff80}.btn-primary:hover{color:#14103a;filter:brightness(1.06)}.about-statement{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.005em;max-width:1020px;font-size:clamp(26px,3.8vw,48px);font-weight:600;line-height:1.22}.about-statement .word{opacity:.22}.about-grid{grid-template-columns:1.2fr 1fr;align-items:start;gap:clamp(32px,5vw,80px);margin-top:clamp(48px,7vh,90px);display:grid}.about-copy p{color:var(--muted);max-width:560px;margin-bottom:18px;font-size:17px}.about-side{gap:22px;display:grid}.portrait{background:linear-gradient(180deg, var(--panel-2), var(--panel));border:1px solid var(--line);border-radius:20px;padding:14px 14px 12px;box-shadow:inset 0 1px #ffffff1f,inset 0 -10px 20px #00000040,0 20px 40px #00000073}.portrait img,.portrait-empty{aspect-ratio:4/5;object-fit:cover;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:10px;width:100%;display:flex}.portrait-empty{background:repeating-linear-gradient(-45deg,#0000 0 14px,#ffffff08 14px 28px),radial-gradient(80% 60% at 50% 40%,#4de1ff0f,#0000);border:1.5px dashed #4de1ff66;box-shadow:inset 0 2px 10px #0006}.portrait-empty .mono:first-child{color:var(--cyan)}.portrait-label{text-align:center;color:var(--muted);letter-spacing:.24em;padding-top:12px;font-size:10px}.stats{gap:16px;display:grid}.stat{background:linear-gradient(180deg, var(--panel-2), var(--panel));border:1px solid var(--line);border-radius:16px;justify-content:space-between;align-items:baseline;gap:20px;padding:22px 26px;display:flex;box-shadow:inset 0 1px #ffffff1f,0 12px 28px #0006}.stat .value{font-family:var(--font-display);background:var(--grad);color:#0000;-webkit-background-clip:text;background-clip:text;font-size:clamp(30px,3.4vw,44px);font-weight:700}.stat .label{color:var(--muted);text-align:right}.projects-grid{grid-template-columns:repeat(2,1fr);gap:clamp(22px,3vw,40px);display:grid}.projects-grid .card-slot:nth-child(2n){margin-top:clamp(0px,5vw,64px)}.project-card{--tint:var(--iris);--mx:50%;--my:50%;background:radial-gradient(600px 300px at var(--mx) var(--my), #ffffff12, transparent 55%), linear-gradient(165deg, var(--panel-2) 0%, var(--panel) 55%, #131129 100%);border:1px solid var(--line);transform-style:preserve-3d;will-change:transform;border-radius:22px;padding:30px 30px 34px;transition:border-color .3s;position:relative;box-shadow:inset 0 1px #ffffff21,inset 0 -14px 28px #0000004d,0 24px 48px #00000080}.project-card:before{content:"";background:linear-gradient(140deg, var(--tint), transparent 40%, transparent 70%, var(--tint));-webkit-mask-composite:xor;opacity:0;pointer-events:none;border-radius:23px;padding:1px;transition:opacity .35s;position:absolute;inset:-1px;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.project-card:hover:before{opacity:.9}.project-card .top{justify-content:space-between;align-items:center;margin-bottom:60px;display:flex}.project-card .idx{font-family:var(--font-mono);letter-spacing:.2em;color:var(--tint);font-size:12px}.project-card .chip3d{background:linear-gradient(145deg,#34305e,#1d1a3c);border:1px solid #ffffff29;border-radius:8px;width:44px;height:34px;position:relative;box-shadow:inset 0 1px #ffffff38,inset 0 -3px 6px #00000073,0 4px 10px #00000059}.project-card .chip3d:after{content:"";background:linear-gradient(90deg,#0000 46%,#ffffff26 50%,#0000 54%),linear-gradient(#0000 46%,#ffffff26 50%,#0000 54%);border:1px solid #ffffff2e;border-radius:4px;position:absolute;inset:7px}.project-card h3{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.01em;margin-bottom:14px;font-size:clamp(23px,2.4vw,31px);font-weight:600}.project-card p{color:var(--muted);min-height:3.2em;margin-bottom:26px;font-size:15.5px}.project-card .tags{flex-wrap:wrap;gap:8px;margin-bottom:26px;display:flex}.tag{font-family:var(--font-mono);letter-spacing:.14em;color:#c9c6e8;border:1px solid var(--line);background:#ffffff0d;border-radius:6px;padding:6px 10px;font-size:10px;box-shadow:inset 0 1px #ffffff14}.project-card .open{font-family:var(--font-mono);letter-spacing:.18em;color:var(--tint);align-items:center;gap:8px;font-size:11px;font-weight:600;display:inline-flex}.project-card .open .arrow{transition:transform .3s}.project-card:hover .open .arrow{transform:translate(4px,-4px)}.project-card .open.soon{color:var(--muted)}.project-card .open.soon .arrow{color:var(--tint);animation:2s ease-in-out infinite pulse}.tint-iris{--tint:var(--iris)}.tint-cyan{--tint:var(--cyan)}.tint-pink{--tint:var(--pink)}.tint-amber{--tint:var(--amber)}.skills-groups{gap:clamp(36px,5vh,56px);display:grid}.skill-group .mono{color:var(--cyan);margin-bottom:20px;display:block}.keys{flex-wrap:wrap;gap:14px;display:flex}.key{font-family:var(--font-mono);letter-spacing:.06em;color:var(--ink);cursor:default;-webkit-user-select:none;user-select:none;background:linear-gradient(#2e2a56,#1b1938);border:1px solid #ffffff24;border-radius:12px;padding:14px 22px;font-size:13px;font-weight:500;transition:transform .1s,box-shadow .1s,color .2s;transform:translateY(0);box-shadow:inset 0 1px #fff3,inset 0 -3px 5px #0006,0 7px 0 -1px #080716,0 14px 20px #00000073}.key:hover{color:var(--cyan)}.key:active{transform:translateY(6px);box-shadow:inset 0 1px #ffffff1f,inset 0 3px 6px #00000073,0 1px 0 -1px #080716,0 4px 8px #0000004d}.timeline{gap:18px;max-width:860px;display:grid}.entry{background:linear-gradient(180deg, var(--panel-2), var(--panel));border:1px solid var(--line);border-radius:18px;grid-template-columns:160px 1fr;gap:26px;padding:28px 30px;transition:border-color .3s,transform .3s;display:grid;box-shadow:inset 0 1px #ffffff1f,0 16px 32px #0006}.entry:hover{border-color:#4de1ff73;transform:translate(6px)}.entry .period{font-family:var(--font-mono);letter-spacing:.14em;color:var(--cyan);padding-top:4px;font-size:12px}.entry h3{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.01em;margin-bottom:4px;font-size:20px;font-weight:600}.entry .org{font-family:var(--font-mono);letter-spacing:.14em;color:var(--pink);margin-bottom:12px;font-size:11px}.entry p{color:var(--muted);font-size:15.5px}.contact{text-align:center;flex-direction:column;justify-content:center;min-height:90svh;display:flex}.contact-title{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.005em;font-size:clamp(40px,7.6vw,94px);font-weight:700;line-height:.97}.contact-title .accent{color:var(--pink)}.contact-sub{color:var(--muted);max-width:470px;margin:28px auto 44px}.contact-actions{flex-wrap:wrap;justify-content:center;gap:18px;display:flex}.contact-email{letter-spacing:.22em;margin-top:22px}.socials{flex-wrap:wrap;justify-content:center;gap:30px;margin-top:60px;display:flex}.socials a{font-family:var(--font-mono);letter-spacing:.2em;color:var(--muted);align-items:center;gap:8px;font-size:11px;transition:color .25s;display:inline-flex}.socials a:hover{color:var(--cyan)}.socials a:before{content:"↗";color:var(--pink)}.socials .soon-link{color:var(--muted);opacity:.65;cursor:default}.footer{border-top:1px solid var(--line);padding:28px var(--pad);z-index:2;background:#0b0a1ab3;flex-wrap:wrap;justify-content:space-between;gap:16px;display:flex;position:relative}[data-reveal]{opacity:0;transform:translateY(44px)}@media (width<=900px){.about-grid,.projects-grid{grid-template-columns:1fr}.projects-grid .card-slot:nth-child(2n){margin-top:0}.nav-links{display:none}.entry{grid-template-columns:1fr;gap:8px}.project-card p{min-height:0}.hero{padding-top:96px}.hero-cta .btn{padding:15px 22px}}@media (height<=720px){.hero-scroll{display:none}}@media (prefers-reduced-motion:reduce){.noise,.hero-scroll .wheel:after,.badge .dot{animation:none}}