@import "https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&family=Sono:wght,MONO@200..800,1&family=Space+Grotesk:wght@300..700&display=swap";:root{--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;--space-24:96px;--wrapper-width:1200px;--text-xs:11px;--text-sm:13px;--text-base:15px;--text-md:18px;--text-lg:22px;--text-xl:28px;--text-2xl:36px;--text-3xl:48px;--background:#0e0f12;--surface:#17181d;--border:#24262d;--border-o50:#24262d80;--surface-elevated:#1f2028;--btn-primary-bg:var(--cyan);--btn-primary-text:#0a2e2d;--btn-ghost-border:var(--cyan);--btn-ghost-text:var(--cyan);--btn-subtle-bg:var(--cyan-o20);--btn-subtle-border:#6be4df40;--cyan:#6be4df;--purple:#767ee1;--red:#e7677b;--pink:#efa6c8;--cyan-o20:#6be4df33;--purple-o20:#767ee133;--red-o20:#e7677b33;--pink-o20:#efa6c833;--primary-text:#e6eaf0;--primary-text-o20:#e6eaf033;--body-text:#9aa3ad;--muted-text:#6b7280;--info:#6be4df;--info-bg:#6be4df14;--info-border:#6be4df33;--success:#28ca41;--success-bg:#28ca4114;--success-border:#28ca4133;--warning:#ffbd2e;--warning-bg:#ffbd2e14;--warning-border:#ffbd2e33;--danger:#e7677b;--danger-bg:#e7677a14;--danger-border:#e7677b33;color:var(--primary-text);background-color:var(--background);font-optical-sizing:auto;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Manrope,sans-serif;font-style:normal;font-weight:400;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}html,body,#root{height:100%}*{--webkit-text-box-trim:trim-both;margin:0;padding:0}h1,h2,h3,h4,h5,h6{letter-spacing:-1%;font-family:Space Grotesk;font-weight:800}p{color:var(--primary-text);font-family:Manrope}p.sono{font-family:Sono,monospace}p.muted{color:var(--muted-text)}p.body{color:var(--body-text)}.pill p{color:var(--primary-text)}#svg-fill{fill:var(--muted-text)}::selection{background-color:var(--primary-text);color:var(--surface)}#root{--typescript:#00a23c;--typescript-o20:#00a23c33;--expo:#b79ced;--expo-o20:#b79ced33;--info-ao20:#4077d133;text-align:center}main{padding-bottom:var(--space-20)}header,.header-side,ul,header a{display:flex}header{padding:var(--space-10)var(--space-10);border-bottom:7px solid var(--border);justify-content:space-between;align-items:center}header h1{font-size:var(--text-md);font-weight:bolder}nav,ul{gap:var(--space-16)}li{margin:auto;list-style:none}li a{color:var(--primary-text);font-weight:700;text-decoration:none}.header-side.icons{gap:var(--space-5)}.header-side.icons a{cursor:pointer;padding:var(--space-2);border:2px solid var(--primary-text);background-color:var(--primary-text-o20);border-radius:50%}.header-side.icons .icon-link.fill #svg-fill{fill:var(--primary-text)}.header-side.icons .icon-link.fill:hover #svg-fill{fill:var(--background)}.header-side.icons .icon-link:hover path{stroke:var(--background)}.ripple-heading{cursor:pointer;display:inline-block}.ripple-heading span{transition:transform .3s cubic-bezier(.25,1,.5,1);display:inline-block}.hero-section{flex-direction:column;justify-content:center;align-items:center;min-height:calc(100vh - 125px);display:flex}.hero-section .traveling-title{font-size:var(--text-3xl)}.reachout-btn{gap:var(--space-3);margin-top:var(--space-24);padding:var(--space-8)192px;border:5px solid var(--primary-text);background-color:var(--background);box-shadow:0 5px var(--background),0 10px var(--primary-text);cursor:pointer;border-radius:1.42em;transition:transform .11s;display:flex}.reachout-btn h2{font-size:var(--text-xl);align-self:center;margin:0}.reachout-btn .mail-icon{width:var(--space-10);height:var(--space-10)}.reachout-btn:hover .mail-icon path{stroke:var(--surface)}.reachout-btn:hover{transform:scale(1.02)}.reachout-btn:active{transform:translateY(10px)}section{padding-bottom:var(--space-20)}section .bar{margin:var(--space-12)0;background-color:var(--primary-text);height:5px;box-shadow:0 15px var(--primary-text)}section .section-title{padding-left:var(--space-3);font-size:var(--text-2xl)}.project-cards{gap:var(--space-16);flex-wrap:wrap;justify-content:center;width:100%}.card{width:650px;padding:var(--space-4);cursor:pointer;border:5px solid var(--primary-text);box-shadow:0 5px var(--background),0 10px var(--primary-text);border-radius:15px;align-items:center;margin:0;display:flex}.card svg{width:20px}.project-cards .card .body{gap:var(--space-4);flex-direction:column;width:100%;height:100%;display:flex}.project-cards .card .body .header{align-items:left;justify-content:space-between;row-gap:var(--space-3);flex-wrap:wrap;display:flex}.project-cards .card .footer{align-self:end;align-items:center;display:flex}.project-cards .card .footer #svg-fill{fill:var(--primary-text)}.project-cards .card .body .header .tags{gap:var(--space-3);display:flex}.project-cards .card .body .header .tags .tag{border:1px solid var(--primary-text);padding:var(--space-1)var(--space-8);font-size:var(--text-xs);background-color:var(--primary-text-o20);box-shadow:0 2px var(--primary-text);border-radius:50px;align-content:center;font-weight:400}.project-cards .card .content{text-align:left;margin-top:var(--space-1);font-weight:400}.project-cards .card .footer span{align-items:center;display:flex}.project-cards .card .project-link{width:100%;color:var(--primary-text);font-family:Manrope;font-weight:100;text-decoration:none}.nav-link a{transition:all .12s ease-out}.nav-link:hover a{transform:scale(1.2)}.project-cards .card{transition:all .13s ease-out}.project-cards .card:hover{transform:scale(1.05)}.project-cards .card:hover .body,.project-cards .card:hover .tag,.project-cards .card:hover .content p{color:var(--surface)}.project-cards .card:hover .header .tags .tag{box-shadow:0 2px var(--surface);border-color:var(--surface)}.project-cards .card:hover #svg-fill{fill:var(--surface)}.traveling-title span{transition:color .2s;display:inline-block}.jump{filter:drop-shadow(0 0 6px);animation:.35s jump}@keyframes jump{0%{transform:translateY(0)scale(1)}40%{transform:translateY(-8px)scale(1.05)}to{transform:translateY(0)scale(1)}}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--background)}::-webkit-scrollbar-thumb{background:var(--primary-text);border:2px solid var(--background);border-radius:8px}::-webkit-scrollbar-thumb:hover{background:linear-gradient(#6be4df,#767ee1,#f75f66,#f69dc8)}.hamburger,.mobile-drawer{display:none}@media (max-width:768px){.header .icon-link{display:none}header{padding:var(--space-5)}nav{gap:0}.desktop-nav{display:none}.header-side.icons{gap:var(--space-3)}.hamburger{border:2px solid var(--primary-text);background-color:var(--primary-text-o20);cursor:pointer;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:38px;height:38px;padding:0;display:flex}.ham-bar{background-color:var(--primary-text);border-radius:2px;width:14px;height:1.5px;transition:transform .25s,opacity .25s;display:block}.hamburger.is-open .ham-bar:first-child{transform:translateY(6.5px)rotate(45deg)}.hamburger.is-open .ham-bar:nth-child(2){opacity:0;transform:scaleX(0)}.hamburger.is-open .ham-bar:nth-child(3){transform:translateY(-6.5px)rotate(-45deg)}.mobile-drawer{background-color:var(--surface);border-bottom:3px solid var(--border);max-height:0;transition:max-height .3s;display:block;overflow:hidden}.mobile-drawer.is-open{max-height:350px}.mobile-nav-links{padding:var(--space-2)0;flex-direction:column;gap:0;display:flex}.mobile-nav-links li{border-bottom:.5px solid var(--border);width:100%;list-style:none}.mobile-nav-links li:last-child{border-bottom:none}.mobile-nav-links li a{padding:var(--space-4)var(--space-6);font-size:var(--text-base);color:var(--primary-text);font-weight:700;text-decoration:none;transition:color .15s;display:block}.mobile-nav-links li a:hover{color:var(--cyan)}.mobile-nav-reachout{width:100%;padding:var(--space-4)var(--space-6);font-size:var(--text-base);color:var(--primary-text);text-align:center;cursor:pointer;background:0 0;border:none;font-family:Manrope,sans-serif;font-weight:700;transition:color .15s;display:block}.mobile-nav-reachout:hover{color:var(--cyan)}.hero-section{padding:0 var(--space-5);min-height:calc(100vh - 90px)}.hero-section .traveling-title{font-size:38px}.reachout-btn{width:100%;padding:var(--space-5)var(--space-6);margin-top:var(--space-16);justify-content:center}.reachout-btn h2{font-size:var(--text-xl)}.card{width:min(650px,80%)}.project-cards .card .body .header .tags .tag{padding:var(--space-1)var(--space-3)}.project-cards .card .content p{color:var(--body-text);font-size:var(--text-sm)}.project-cards .card .body .header{align-items:flex-start}.project-cards .card .body .header h2{font-size:var(--text-lg)}.project-cards .card .body .header{flex-direction:column}.project-cards .card .footer{justify-content:flex-end}}@media (max-width:350px){.hero-section .traveling-title{font-size:var(--text-2xl)}}.about-me .info{border:2px solid var(--border);margin:var(--space-6);padding:var(--space-10);border-radius:var(--space-8);background-color:var(--surface);gap:20px;display:flex}.about-me .info .side{flex-direction:column;gap:20px;display:flex}@media (min-width:1025px){.about-me .info .side.me{max-width:20%}}.about-me .info .side.me{flex:1;place-items:center}.about-me .info .side.me .buttons{gap:var(--space-5);flex-direction:column;width:100%;display:flex}.about-me .info .side.me button #svg-fill{fill:var(--btn-primary-text)}.about-me .info .side.me button #svg-path path{stroke:var(--purple)}.about-me .info .side.me .buttons button{display:inherit;justify-content:center;align-items:center;gap:inherit;padding:var(--space-2)var(--space-8);border:1px solid var(--btn-primary-bg);border-radius:var(--space-2);background-color:var(--btn-primary-bg)}.about-me .info .side.me .buttons button p{font-size:var(--text-md);color:var(--btn-primary-text)}.about-me .info .side.me .buttons .ghost{border:1px solid var(--purple);background-color:var(--surface-elevated)}.about-me .info .side.me .buttons .ghost p{color:var(--purple)}.about-me .info .side.me button:hover{cursor:pointer;background-color:var(--surface-elevated);border:1px solid var(--btn-primary-bg)}.about-me .info .side.me button:hover p{color:var(--btn-primary-bg)}.about-me .info .side.me button:hover #svg-fill{fill:var(--btn-primary-bg)}.about-me .info .side.me .buttons .ghost:hover{background-color:var(--purple)}.about-me .info .side.me .buttons .ghost:hover p{color:var(--surface-elevated)}.about-me .info .side.me .buttons .ghost:hover #svg-path path{stroke:var(--surface-elevated)}.about-me .info .side.me .helpme{justify-content:flex-start;align-items:center;gap:var(--space-3);display:flex}.about-me .info .side.me .helpme .green-light{background-color:var(--success);border-radius:50%;width:.75rem;height:.75rem}.about-me .info .side.about .header{border-bottom:3px solid var(--border);padding-bottom:var(--space-4)}.about-me img{border-radius:var(--space-2);max-width:100%}.about-me .info .side{text-align:left;flex:1}.about-me .info .side.about .footer .pills{gap:var(--space-2);flex-wrap:wrap;display:flex}.about-me .info .side.about .footer .pills .pill{width:max-content}@media (max-width:768px){.about-me .info{flex-direction:column-reverse}}.modal-backdrop{z-index:1000;background:#000000a6;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{text-align:start;background-color:var(--background);width:100%;max-width:600px;color:var(--primary-text);border:5px solid var(--border);border-radius:10px;padding:100px 60px}.modal h2{margin:0;padding:0}form{flex-direction:column;gap:10px;margin-top:25px;display:flex}form input,textarea{background-color:var(--surface);border:3px solid var(--border);border-radius:5px;padding:5px}form input::placeholder,form textarea::placeholder{color:var(--muted-text)}form button{background-color:var(--surface);color:var(--primary-text);cursor:pointer;border:4px solid var(--muted-text);box-shadow:0 5px var(--surface),0 10px var(--muted-text);border-radius:4px;margin-top:15px;padding:10px 0;font-size:16px;font-weight:700}form button:hover{border-color:var(--body-text);box-shadow:0 5px var(--surface),0 10px var(--body-text)}.project-details{max-width:var(--wrapper-width);padding:var(--space-10)var(--space-8)var(--space-20);text-align:left;margin:0 auto;position:relative}.project-details.not-found{align-items:flex-start;gap:var(--space-6);flex-direction:column;min-height:60vh;display:flex}.project-details .backlink{font-family:JetBrains Mono,Fira Code,monospace;font-size:var(--text-sm);color:var(--muted-text);letter-spacing:.05em;margin-bottom:var(--space-10);opacity:.7;align-items:center;font-weight:500;text-decoration:none;transition:opacity .15s,color .15s;display:inline-flex}.project-details .backlink:hover{opacity:1;color:var(--cyan)}.project-details .detail-title-row{gap:var(--space-12);margin-bottom:var(--space-5);display:flex}.project-details .detail-title-row .title{font-size:clamp(var(--text-md),5vw,var(--text-3xl));letter-spacing:.1em;--webkit-text-box-trim:trim-both;font-weight:300}.project-details .detail-title-row .private-badge-lg{gap:var(--space-2);background-color:var(--danger-bg);border:1px solid var(--danger);border-radius:var(--space-3);padding:var(--space-4);font-size:var(--text-base);align-self:center;display:inline-flex}.project-details .detail-title-row .private-badge-lg svg{width:var(--space-5)}.project-details .detail-links{gap:var(--space-8);width:100%;margin-top:var(--space-2);margin-top:var(--space-6);display:flex}.project-details .detail-links .detail-link{background-color:var(--surface);border:2px solid var(--border);font-family:Mnarope,sans-serif;font-size:var(--text-sm);color:var(--muted);--webkit-corner-shape:squircle;white-space:nowrap;border-radius:12px;align-items:center;gap:12px;padding:8px 12px;text-decoration:none;display:inline-flex}.project-details .detail-links .detail-link svg{width:var(--space-5)}.detail-links .detail-link:hover{border-color:var(--cyan-o20);color:var(--cyan);box-shadow:0 0 5px #6be4df26}.detail-link.github:hover #svg-fill,.detail-link.live:hover #svg-fill{fill:var(--cyan)}.project-details .tech-stack svg{width:var(--space-4);height:var(--space-4);flex-shrink:0}.project-details .tech-stack{gap:var(--space-3);margin-top:var(--space-3);flex-flow:column wrap;display:flex}.project-details .tech-stack .pill{align-items:center;gap:var(--space-2);background-color:var(--surface);border:1px solid var(--border);border-radius:var(--space-12);padding:var(--space-2)var(--space-4);display:inline-flex}.project-details .tech-stack .pill p{font-size:var(--text-xs);color:var(--body-text);font-weight:400}.project-details .tech-stack .pill:hover{border-color:var(--purple);background-color:var(--pruple-o20)}.project-details .tech-stack .pill:hover p{color:var(--purple)}.project-details .tech-stack .pill:hover{box-shadow:0 0 15px #757ce133}.project-details .tech-stack .pill:hover #svg-fill{fill:var(--purple);opacity:.8}.project-details .tech-stack .pill:hover{cursor:default}.detail-screenshot{width:320px;margin-top:var(--space-10);flex-shrink:0;margin-inline:auto}.detail-screenshot .frame{border:1px solid var(--border);background:var(--surface);border-radius:10px;overflow:hidden}.detail-screenshot .frame .bar{border-bottom:1px solid var(--border);background:#ffffff08;align-items:center;gap:6px;padding:10px 14px;display:flex}.detail-screenshot .frame .bar .terminal-dot{border-radius:50%;width:10px;height:10px}.terminal-dot.red{background:#ff5f57}.terminal-dot.yellow{background:#ffbd2e}.terminal-dot.green{background:#28ca41}.detail-screenshot .frame img{object-fit:cover;width:100%;display:block}.project-details .detail-sections{gap:var(--space-12);margin-top:var(--space-10);flex-direction:column;display:flex}.project-details .detail-sections .section{gap:var(--space-5);background-color:var(--surface);padding:var(--space-12)var(--space-5);border:5px solid var(--border);border-radius:12px;flex-direction:column;display:flex}.detail-sections .section .label{letter-spacing:.12em;font-weight:100;font-size:var(--text-xl);color:var(--primary-text)}.project-details .accordion{background:var(--surface);border:2px solid var(--border);border-radius:8px;margin-bottom:10px;transition:all .2s;overflow:hidden}.project-details .accordion:hover{border-color:var(--purple)}.project-details .accordion-body{width:100%;color:inherit;cursor:pointer;font-size:var(--text-base);text-align:left;padding:var(--space-4);background:0 0;border:none;flex-direction:column;align-items:flex-start;display:flex}.project-details .accordion-header{align-items:center;gap:var(--space-4);width:100%;font-weight:600;font-size:var(--text-sm);letter-spacing:.04em;justify-content:space-between;display:flex}.project-details .accordion-header .arrow{border-right:3px var(--primary-text)solid;border-bottom:3px var(--primary-text)solid;flex-shrink:0;width:8px;height:8px;transition:transform .3s;transform:rotate(45deg)}.project-details .accordion.open .arrow{transform:rotate(225deg)}.project-details .accordion-content{opacity:0;max-height:0;transition:max-height .15s,opacity .15s;overflow:hidden}.accordion.open .accordion-content{opacity:1;margin-top:var(--space-5)}.tech-stack-grid{gap:var(--space-5);flex-wrap:wrap;display:flex}.pill{align-items:center;gap:var(--space-4);border:2px solid var(--border);padding:var(--space-2)var(--space-4);corner-shape:squircle;border-radius:8px;transition:all .15s;display:flex}.pill p{font-size:var(--text-xl);color:var(--body-text)}.pill svg{width:var(--space-12);height:var(--space-12);transition:fill .15s}.pill:hover{border-color:var(--cyan);background-color:var(--cyan-o20)}.pill:hover svg #svg-fill{fill:var(--cyan)}.pill:hover p{color:var(--primary-text)}.pill:hover{cursor:default}
