@charset "UTF-8";*{box-sizing:border-box;margin:0;padding:0}::selection{background:#ffffff26;color:#fafafa}body{background-color:#0c0c0e;color:#71717a;font-family:Inter,sans-serif;line-height:1.6;overflow-x:hidden;cursor:default}a{text-decoration:none;color:inherit;transition:color .2s;cursor:pointer}ul{list-style:none}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-thumb{background:#3f3f46;border-radius:2px}::-webkit-scrollbar-track{background:transparent}#navbar{display:flex;justify-content:space-between;align-items:center;padding:28px 60px;position:fixed;width:100%;top:0;z-index:1000;transition:all .3s}#navbar.scrolled{background:#0c0c0eeb;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.07);padding:20px 60px}#navbar .logo{font-family:Syne,sans-serif;font-weight:800;font-size:1.05rem;color:#fafafa;letter-spacing:-.5px;z-index:1001}#navbar .nav-links{display:flex;gap:36px}#navbar .nav-links li a{font-family:DM Mono,monospace;font-size:12px;color:#71717a;transition:color .2s}#navbar .nav-links li a:hover{color:#fafafa}#navbar .hamburger{display:none;font-size:1.3rem;color:#fafafa;cursor:pointer;z-index:1001}.mobile-menu-overlay{position:fixed;top:0;right:-100%;width:100%;height:100vh;background:#0c0c0efa;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);z-index:9999;display:flex;justify-content:center;align-items:center;transition:right .35s cubic-bezier(.645,.045,.355,1)}.mobile-menu-overlay.active{right:0}.mobile-menu-overlay .close-btn{position:absolute;top:28px;right:28px;font-size:1.5rem;color:#71717a;cursor:pointer;transition:color .2s}.mobile-menu-overlay .close-btn:hover{color:#fafafa}.mobile-menu-overlay ul{text-align:center}.mobile-menu-overlay ul li{margin:22px 0}.mobile-menu-overlay ul a{font-family:Syne,sans-serif;font-size:2rem;font-weight:700;color:#3f3f46;transition:color .2s}.mobile-menu-overlay ul a:hover{color:#fafafa}#hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:0 60px;max-width:1100px;margin:0 auto}#hero .hero-tag{font-family:DM Mono,monospace;font-size:13px;color:#3f3f46;margin-bottom:20px;letter-spacing:.5px}#hero .name{font-family:Syne,sans-serif;font-size:clamp(56px,10vw,100px);font-weight:800;line-height:1.05;letter-spacing:-1px;color:#fafafa;margin-bottom:24px}#hero .subtitle{font-family:Syne,sans-serif;font-size:clamp(20px,3.5vw,36px);font-weight:700;color:#71717a;line-height:1.25;margin-bottom:36px;letter-spacing:-.2px}#hero .subtitle .cursor{font-weight:300;color:#3f3f46;animation:blink 1s step-end infinite}#hero .desc{max-width:520px;margin-bottom:56px;font-size:15px;color:#71717a;line-height:1.8}#hero .desc strong{color:#fafafa;font-weight:500}#hero #cta-btn{padding:13px 26px;background:#fafafa;border:none;color:#0c0c0e;border-radius:4px;font-family:DM Mono,monospace;font-size:13px;cursor:pointer;transition:all .2s ease;width:fit-content;display:flex;align-items:center;gap:8px}#hero #cta-btn:hover{background:#e4e4e7;transform:translateY(-2px)}#hero #cta-btn i{font-size:11px;transition:transform .2s}#hero #cta-btn:hover i{transform:translate(4px)}@keyframes blink{50%{opacity:0}}#about{padding:120px 60px 80px;max-width:1100px;margin:0 auto}#skills{padding:80px 60px;max-width:1100px;margin:0 auto}#skills .skills-grid{display:flex;flex-direction:column;gap:24px}#skills .skills-row{display:grid;grid-template-columns:120px 1fr;gap:16px;align-items:start;opacity:0;transform:translateY(16px)}#skills .skills-row-label{font-family:DM Mono,monospace;font-size:11px;color:#3f3f46;letter-spacing:.5px;padding-top:6px}#skills .skills-row-tags{display:flex;flex-wrap:wrap;gap:8px}.skill-tag{font-family:DM Mono,monospace;font-size:12px;color:#71717a;border:1px solid rgba(255,255,255,.07);padding:4px 12px;border-radius:3px;transition:all .2s;cursor:default}.skill-tag:hover{color:#fafafa;border-color:#3f3f46}.section-header{display:flex;align-items:baseline;gap:14px;margin-bottom:52px}.section-header .section-num{font-family:DM Mono,monospace;font-size:11px;color:#3f3f46;letter-spacing:1px}.section-header h3{font-family:Syne,sans-serif;font-size:clamp(18px,2.2vw,22px);font-weight:700;color:#fafafa;opacity:0;transform:translateY(20px)}#projects{padding:80px 60px;max-width:1100px;margin:0 auto}.project-group+.project-group{margin-top:48px}.project-group-label{font-family:DM Mono,monospace;font-size:11px;color:#3f3f46;letter-spacing:1px;text-transform:uppercase;margin-bottom:0;padding:10px 0;border-top:1px solid rgba(255,255,255,.07)}.project-list{border-top:none}.project-row{display:grid;grid-template-columns:36px 1fr auto auto 20px;align-items:center;gap:24px;padding:24px 0;border-bottom:1px solid rgba(255,255,255,.07);cursor:pointer}.project-row:hover .proj-title{color:#fafafa}.project-row:hover .proj-arrow{opacity:1;transform:translate(4px)}.project-row .proj-num{font-family:DM Mono,monospace;font-size:11px;color:#3f3f46}.project-row .proj-main{min-width:0}.project-row .proj-main .proj-title{font-family:Syne,sans-serif;font-size:clamp(15px,1.8vw,19px);font-weight:700;color:#a1a1aa;margin-bottom:4px;transition:color .2s}.project-row .proj-main .proj-summary{font-size:13px;color:#3f3f46;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.project-row .proj-category,.project-row .proj-year{font-family:DM Mono,monospace;font-size:11px;color:#3f3f46;white-space:nowrap}.project-row .proj-arrow{color:#3f3f46;font-size:12px;opacity:0;transition:all .2s}#contact{min-height:50vh;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:80px 60px 100px;max-width:1100px;margin:0 auto}#contact .contact-title{font-family:Syne,sans-serif;font-size:clamp(36px,6vw,64px);font-weight:800;letter-spacing:-1px;color:#fafafa;margin-bottom:24px;line-height:1.05;opacity:0;transform:translateY(20px)}#contact .contact-desc{margin-bottom:44px;font-size:15px;color:#71717a;line-height:1.8;max-width:440px;opacity:0;transform:translateY(20px)}#contact .contact-email{font-family:DM Mono,monospace;font-size:15px;color:#fafafa;border-bottom:1px solid #3f3f46;padding-bottom:3px;transition:border-color .2s;opacity:0;transform:translateY(20px);display:inline-block}#contact .contact-email:hover{border-color:#fafafa}#contact .social-links{margin-top:44px;display:flex;gap:24px;opacity:0;transform:translateY(20px)}#contact .social-links a{color:#3f3f46;font-size:18px;transition:color .2s}#contact .social-links a:hover{color:#fafafa}body.modal-open{overflow:hidden}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:10000;display:flex;justify-content:flex-end;animation:modal-fade .2s ease}.modal-panel{width:min(580px,100%);height:100dvh;background:#111113;border-left:1px solid rgba(255,255,255,.07);overflow-y:auto;padding:52px 44px 60px;position:relative;animation:modal-slide .32s cubic-bezier(.34,1.1,.64,1)}.modal-panel::-webkit-scrollbar{width:3px}.modal-panel::-webkit-scrollbar-thumb{background:#3f3f46;border-radius:2px}.modal-panel::-webkit-scrollbar-track{background:transparent}@keyframes modal-fade{0%{opacity:0}to{opacity:1}}@keyframes modal-slide{0%{transform:translate(100%)}to{transform:translate(0)}}.modal-close{position:absolute;top:20px;right:22px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.07);border-radius:3px;color:#3f3f46;background:transparent;cursor:pointer;font-size:12px;transition:all .2s}.modal-close:hover{color:#fafafa;border-color:#3f3f46}.modal-category-badge{display:inline-block;font-family:DM Mono,monospace;font-size:11px;color:#3f3f46;border:1px solid rgba(255,255,255,.07);padding:3px 10px;border-radius:3px;margin-bottom:18px}.modal-title{font-family:Syne,sans-serif;font-size:1.6rem;font-weight:800;color:#fafafa;line-height:1.2;margin-bottom:20px;letter-spacing:-.5px}.modal-meta{display:flex;gap:20px;margin-bottom:28px}.modal-meta span{font-family:DM Mono,monospace;font-size:12px;color:#3f3f46;display:flex;align-items:center;gap:7px}.modal-meta span i{color:#71717a}.modal-divider{height:1px;background:#ffffff12;margin:24px 0}.modal-section{margin-bottom:24px}.modal-section h5{font-family:DM Mono,monospace;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:#3f3f46;margin-bottom:10px}.modal-section p{font-size:.93rem;color:#71717a;line-height:1.75}.modal-highlights{display:flex;flex-direction:column;gap:10px}.modal-highlights li{display:flex;align-items:flex-start;gap:10px;font-size:.9rem;color:#71717a}.modal-highlights li:before{content:"—";color:#3f3f46;flex-shrink:0}.modal-tech-stack{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}.modal-tech-stack span{font-family:DM Mono,monospace;font-size:11px;color:#71717a;border:1px solid rgba(255,255,255,.07);padding:4px 12px;border-radius:3px}.modal-links{display:flex;gap:10px;margin-top:32px}.modal-links a{display:inline-flex;align-items:center;gap:8px;padding:11px 20px;border-radius:4px;font-family:DM Mono,monospace;font-size:12px;transition:all .2s}.modal-links .modal-link-github{border:1px solid rgba(255,255,255,.07);color:#71717a}.modal-links .modal-link-github:hover{border-color:#3f3f46;color:#fafafa}.modal-links .modal-link-external{background:#fafafa;color:#0c0c0e;border:1px solid #fafafa}.modal-links .modal-link-external:hover{background:#e4e4e7}footer{text-align:center;padding:24px;font-family:DM Mono,monospace;font-size:11px;color:#3f3f46;border-top:1px solid rgba(255,255,255,.07)}@media screen and (max-width: 768px){#navbar{padding:20px 24px}#navbar .nav-links{display:none!important}#navbar .hamburger{display:block}#navbar.scrolled{padding:16px 24px}#hero{padding:0 24px}#hero .name{letter-spacing:-2px}#hero .desc{font-size:14px;margin-bottom:40px}#about{padding:80px 24px}#about .about-body{grid-template-columns:1fr;gap:24px}#skills{padding:80px 24px}#skills .skills-row{grid-template-columns:1fr;gap:10px}#projects{padding:80px 24px}#contact{padding:80px 24px 100px}.project-row{grid-template-columns:28px 1fr auto;gap:16px;padding:20px 0}.project-row .proj-year,.project-row .proj-arrow{display:none}.modal-panel{padding:44px 20px 50px}.modal-title{font-size:1.3rem}.modal-links{flex-direction:column}}@media screen and (max-width: 480px){.project-row{grid-template-columns:28px 1fr}.project-row .proj-category{display:none}}