:root{--text:#9ca3af;--text-h:#f3f4f6;--bg:#16171d;--panel-bg:#100c1a;--border:#2e303a;--code-bg:#1f2028;--accent:#ceb9ff;--accent-secondary:#4f3a83;--accent-bg:#aa3bff1a;--accent-border:#241447;--social-bg:#f4f3ec80;--shadow:#0000001a 0 10px 15px -3px, #0000000d 0 4px 6px -2px;--sans:ui-monospace, Andale Mono, monospace;--heading:ui-monospace, Andale Mono, monospace;--mono:ui-monospace, Consolas, monospace;font:clamp(.8125rem, .75rem + .25vw, .9375rem) / 150% var(--sans);letter-spacing:clamp(.02em,.1vw,.08rem);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);background-image:linear-gradient(135deg, var(--accent-bg), var(--accent-border));font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-attachment:fixed}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}#root{width:100%;max-width:1200px;margin:0 auto;padding:0}body{margin:0}h1,h2,.title-link{font-family:var(--heading);color:var(--accent);font-weight:700}h2{font-family:var(--heading);color:var(--text-h);font-weight:600}h3{font-family:var(--heading);color:var(--text);font-weight:500}h1{margin:0 0 .15em;font-size:clamp(2rem,5vw,3.6rem);line-height:90%}h2{letter-spacing:-.24px;margin:0 0 .4em;font-size:clamp(1.25rem,2.5vw,2rem);line-height:110%}.title-link{letter-spacing:-.24px;margin:0 0 8px;font-size:clamp(1.25rem,2.5vw,2rem);line-height:118%}h3{letter-spacing:-.24px;margin:0 0 8px;font-size:clamp(1rem,1.8vw,1.5rem);line-height:118%}p{margin:0;line-height:170%}@media (width<=480px){:root{letter-spacing:.02em}}.smaller-heading{font-family:var(--heading);color:var(--accent);font-weight:500}.secondary-heading{color:var(--text);opacity:.75;margin:0;font-size:clamp(.9rem,1.3vw,1.1rem);font-weight:400}.web-app{background:var(--panel-bg);grid-template-columns:30% 1fr;min-height:100vh;display:grid}#left-panel{box-sizing:border-box;flex-direction:column;gap:2em;height:100vh;padding:clamp(2em,4vw,4em);display:flex;position:sticky;top:0;overflow-y:auto}#right-panel{box-sizing:border-box;flex-direction:column;gap:clamp(2em,3vw,4em);padding:clamp(2em,4vw,4em);display:flex;overflow:hidden}.info{flex-direction:column;gap:.6em;display:flex}.links{flex-direction:row;align-items:center;gap:1em;display:flex}.about-desc{font-size:clamp(.9rem,1vw,1.05rem);line-height:175%}.experience{border-top:1px solid var(--border);flex-flow:wrap;gap:0 clamp(1em,4vw,4em);padding-top:clamp(1.5em,2vw,2.5em);display:flex}.projects{border-top:1px solid var(--border);padding-top:clamp(1.5em,2vw,2.5em)}.project-list{flex-direction:column;gap:clamp(.5em,1vw,1em);display:flex}a{color:var(--accent);text-decoration:none}.github-logo{width:clamp(1.5rem,3vw,3rem)}.github-logo-path{fill:#fff}.github-logo:hover>.github-logo-path{fill:var(--accent)}.linkedin-logo{width:clamp(2rem,4.3vw,4.3rem)}.linkedin-logo-path{fill:#fff}.linkedin-logo:hover>.linkedin-logo-path{fill:var(--accent)}.about-desc+.about-desc{margin-top:1em}.custom-dropdown{width:fit-content;position:relative}.dropdown-trigger{background:var(--code-bg);border:1.5px solid var(--border);color:var(--accent);font-family:var(--heading);cursor:pointer;letter-spacing:.05em;border-radius:10px;align-items:center;gap:.4em;padding:.55em 1.1em;font-size:1.15rem;font-weight:600;line-height:1;transition:border-color .2s,box-shadow .2s,background .2s;display:flex}.dropdown-trigger:hover{border-color:var(--accent);background:#ceb9ff0d;box-shadow:0 0 14px #ceb9ff33}.dropdown-arrow{font-size:1em;line-height:1;transition:transform .2s}.dropdown-arrow.open{transform:rotate(180deg)}.dropdown-menu{background:var(--code-bg);border:1.5px solid var(--border);z-index:10;border-radius:10px;width:100%;animation:.15s ease-out dropdownIn;position:absolute;top:calc(100% + 6px);left:0;overflow:hidden;box-shadow:0 8px 24px #0006}@keyframes dropdownIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.dropdown-item{width:100%;color:var(--text);font-family:var(--heading);cursor:pointer;text-align:center;letter-spacing:.05em;background:0 0;border:none;padding:.55em 1.1em;font-size:1.15rem;font-weight:600;line-height:1;transition:background .15s,color .15s;display:block}.dropdown-item:hover{background:var(--accent-bg);color:var(--accent)}.dropdown-item.active{color:var(--accent)}#introduction{flex-direction:row;display:flex}@media (width<=1024px){.web-app{grid-template-columns:35% 1fr}#left-panel,#right-panel{padding:clamp(1.5em,3vw,3em) clamp(1.5em,2vw,2em)}}@media (width<=768px){.web-app{grid-template-columns:1fr}#left-panel{border-bottom:1px solid var(--border);gap:1.5em;height:auto;padding:2em 1.5em;position:static}#right-panel{gap:2em;padding:1.5em}}@media (width<=480px){#left-panel{padding:1.5em 1em}#right-panel{gap:1.5em;padding:1em}.experience{flex-direction:column;gap:.75em}}.arrow-up-right{z-index:1;width:clamp(1.25rem,1.5vw,1.75rem);height:clamp(1.25rem,1.5vw,1.75rem);margin:.5em .5em 0 0;position:absolute;top:0;right:0}.arrow-up-right-path{stroke:var(--accent)}@media (width<=480px){.arrow-up-right{width:1.25rem;height:1.25rem}}.experience-item{color:var(--text);border-radius:5px;flex-direction:row;gap:clamp(1em,2vw,2em);padding:1em clamp(1em,2vw,2em);text-decoration:none;display:flex;position:relative}.experience-title{flex-direction:row;align-items:center;display:flex}.experience-item:hover{background-color:#ffffff10}.experience-date{flex-shrink:0;min-width:7em}.experience-date>h3{color:var(--accent);margin:0;font-size:clamp(.85rem,1vw,1.05rem)}.experience-info>h2{margin:0 0 .3em;font-size:clamp(1.1rem,1.5vw,1.5rem);line-height:130%}.experience-info>p{font-size:clamp(.85rem,.9vw,1rem);line-height:165%}@media (width<=768px){.experience-item{gap:1.25em;padding:1em}}@media (width<=480px){.experience-item{flex-direction:column;gap:.4em;padding:.75em}.experience-date{min-width:auto}}.project-item{color:var(--text);border-radius:5px;padding:1em clamp(1em,2vw,2em);text-decoration:none;position:relative}.project-title{flex-direction:row;align-items:center;display:flex}.project-item:hover{background-color:#ffffff10}.project-info>h2{margin:0 0 .3em;font-size:clamp(1.1rem,1.5vw,1.5rem);line-height:130%}.project-info>p{font-size:clamp(.85rem,.9vw,1rem);line-height:165%}@media (width<=768px){.project-item{padding:1em}}@media (width<=480px){.project-item{padding:.75em}}