@font-face{font-family:Geist;src:url('/assets/geist-latin.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:Hedvig;src:url('/assets/hedvig-latin.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'Geist Mono';src:url('/assets/geist-mono-latin.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'Clash Grotesk';src:url('/assets/clash-grotesk-medium.woff2') format('woff2');font-style:normal;font-weight:500;font-display:swap}
:root{--card-exit-ms:420;--card-enter-ms:720;--secondary-exit-ms:300;--secondary-enter-ms:560;font-family:Geist,Arial,sans-serif;color:#4a4a4a;background-color:#ebebeb;font-synthesis:none}
*{box-sizing:border-box}
html,body{margin:0;min-width:0;min-height:100%;overflow-x:hidden;background-color:#ebebeb}
html{scrollbar-width:none;-ms-overflow-style:none}
body{background:transparent}
html::-webkit-scrollbar{display:none}
button,a{font:inherit;-webkit-tap-highlight-color:transparent}
button{cursor:pointer;-webkit-appearance:none;appearance:none}
a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible{outline:2px solid #2e4a7b;outline-offset:4px}
.app-view{display:flow-root;min-height:100svh}
.surface{background:#fafafa;border-radius:10px;box-shadow:0 1px 1px rgba(0,0,0,.025)}
.home-left{position:fixed;inset:12px auto 12px 12px;width:467px;display:grid;grid-template-rows:minmax(0,1fr) 46px;gap:8px}
.home-card{display:flex;flex-direction:column;justify-content:space-between;padding:35px;min-height:0;background-image:url('/assets/card-desktop-home.png');background-position:center;background-size:cover;background-repeat:no-repeat}
.home-intro{max-width:380px;margin:0;font-family:Hedvig,Geist,sans-serif;color:#777;font-size:15px;line-height:1.48;letter-spacing:-.02em}
.home-identity h1{margin:0;color:#303030;font-size:24px;font-weight:500;letter-spacing:-.04em;line-height:1.2}
.home-identity p{margin:8px 0 0;color:#777;font-family:Hedvig,Geist,sans-serif;font-size:16px;line-height:1.35}
.social-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}
.social-tile{display:grid;place-items:center;min-width:0;border-radius:10px;background:#fafafa;transition:background .2s ease,transform .2s ease}
.social-tile img{display:block;width:14px;height:14px;opacity:.65}
.social-tile img[src$="letterboxd-logo.svg"]{width:27px;height:27px;opacity:.5}
.social-tile:hover{background:#fff;transform:translateY(-2px)}
.home-main{min-height:100svh;margin-left:479px;display:grid;place-items:center;position:relative}
.menu{width:310px;transform:translateX(4px)}
.menu-row{width:100%;height:41px;display:flex;align-items:center;justify-content:space-between;padding:0;border:0;background:none;text-align:left;color:#4a4a4a;font-size:17px;line-height:1.2;letter-spacing:-.02em}
.menu-row img{width:15px;height:15px;flex:none;transition:transform .25s ease,opacity .25s ease}
.menu-row:hover{color:#222}
.menu-row:hover img{transform:scale(1.18);opacity:.72}
.footer-links{position:absolute;left:50%;bottom:18px;display:flex;gap:38px;transform:translateX(-50%);white-space:nowrap;color:#606060;font-family:'Geist Mono',monospace;font-size:12px;letter-spacing:-.03em}
.footer-links span{cursor:default}
.detail-sidebar{position:fixed;inset:12px auto 12px 12px;width:467px;padding:35px;display:flex;flex-direction:column;justify-content:space-between;background-position:center;background-size:cover;background-repeat:no-repeat}
.seedcore-view .detail-sidebar{background-image:url('/assets/card-desktop-seedcore.png')}
.about-view .detail-sidebar{background-image:url('/assets/card-desktop-about.png')}
.projects-view .detail-sidebar{background-image:url('/assets/card-desktop-projects.png')}
.skills-view .detail-sidebar{background-image:url('/assets/card-desktop-skills.png')}
.contact-view .detail-sidebar{background-image:url('/assets/card-desktop-contact.png')}
.detail-top{display:flex;align-items:center;justify-content:space-between;min-height:30px}
.back-button{width:24px;height:30px;display:grid;place-items:center;padding:0;border:0;background:none;color:#555;transition:transform .2s ease,opacity .2s ease}
.back-button img{display:block;width:19px;height:19px}
.back-button:hover{transform:translateX(-3px);opacity:.65}
.detail-tag{font-size:16px;line-height:1.2}
.about-view .detail-tag,.about-view .detail-title{color:#d94141}
.seedcore-view .detail-tag,.seedcore-view .detail-title{color:#2b4371}
.projects-view .detail-tag,.projects-view .detail-title{color:#78a1de}
.skills-view .detail-tag,.skills-view .detail-title{color:#42a641}
.contact-view .detail-tag,.contact-view .detail-title{color:#a641a2}
.detail-bottom{max-width:100%}
.detail-title{margin:0;font-size:24px;font-weight:500;letter-spacing:-.045em;line-height:1.2}
.detail-subtitle{margin:10px 0 0;color:#777;font-size:16px;line-height:1.45;letter-spacing:-.025em}
.detail-subtitle{max-width:360px;font-family:Hedvig,Geist,sans-serif}
.seedcore-logo{display:block;width:31px;height:31px;object-fit:contain;margin-bottom:12px}
.seedcore-button{display:inline-flex;align-items:center;gap:12px;height:30px;margin-top:26px;padding:0 17px;border-radius:5px;background:#2e4a7b;color:#fff;font-size:14px;line-height:1;transition:background .2s ease,transform .2s ease}
.seedcore-button:hover{background:#21395f;transform:translateY(-2px)}
.seedcore-button .arrow{font-size:17px;font-weight:300}
.detail-main{position:relative;min-height:100svh;margin-left:479px;padding:1px 28px 70px;display:flex;justify-content:center}
.detail-column{width:min(100%,400px);margin-left:8px}
.about-column{padding-top:111px}
.about-portrait{display:block;width:86px;height:96px;margin:0 auto 36px;object-fit:cover;border-radius:5px;filter:grayscale(1)}
.detail-copy{margin:0;color:#4a4a4a;font-size:16px;line-height:1.5;letter-spacing:-.03em}
.detail-copy+.detail-copy{margin-top:26px}
.seedcore-column{padding-top:111px}
.seedcore-column h1{margin:0 0 10px;color:#2e4a7b;font-family:'Clash Grotesk',Geist,sans-serif;font-size:16px;font-weight:500;line-height:24px}
.projects-column,.skills-column{padding-top:100px}
.skills-column{padding-top:111px}
.project-list{display:grid;gap:0}
.project-row{height:44px;display:flex;align-items:center;justify-content:space-between;color:#4a4a4a;font-size:17px;letter-spacing:-.025em}
.project-row img{display:block;width:15px;height:15px;transform:rotate(180deg);opacity:.8}
.skills-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.skill-tile{height:151px;display:grid;place-items:center;border:1px solid #d2d2d2;border-radius:6px;color:#777;font-size:14px;letter-spacing:-.02em;transition:border-color .2s ease,background .2s ease,transform .2s ease}
.skill-tile:hover{border-color:#bcbcbc;background:#f1f1f1;transform:translateY(-2px)}
.contact-column{width:min(100%,360px);padding-top:169px}
.contact-form{display:grid;gap:22px}
.contact-form label{display:grid;gap:9px;color:#888;font-size:12px;font-weight:500;line-height:1.2}
.contact-form input,.contact-form textarea{display:block;width:100%;border:0;border-radius:10px;background:#fafafa;color:#4a4a4a;font:14px Geist,Arial,sans-serif;outline-offset:3px;padding:10px 12px}
.contact-form input{height:40px}
.contact-form textarea{height:100px;min-height:100px;resize:vertical}
.contact-form button{height:40px;border:0;border-radius:9px;background:#777;color:#fff;font-size:14px;font-weight:500;transition:background .2s ease,transform .2s ease}
.contact-form button:hover{background:#666;transform:translateY(-1px)}
.form-feedback{min-height:0;margin:0;color:#777;font-size:12px;line-height:1.4}
.form-feedback:empty{display:none}
.essay-link{display:inline-flex;align-items:center;gap:15px;margin-top:24px;color:#4a4a4a;font-size:14px;font-weight:500;line-height:21px;cursor:default}
.essay-link .arrow{font-size:19px;font-weight:300}
.detail-main .footer-links{bottom:18px}
.reveal-words{opacity:1;transform:none}
.transition-ghost-view{position:fixed;inset:0;z-index:10;width:100%;height:100%;overflow:hidden;pointer-events:none}
.transition-ghost-view .reveal-words{animation:none!important;opacity:1;transform:none}
.card-pending,.secondary-pending{visibility:hidden;opacity:0;pointer-events:none}
.primary-card.card-exit,.primary-card.card-enter,.transition-secondary.secondary-exit,.transition-secondary.secondary-enter{will-change:transform,opacity;backface-visibility:hidden}
.primary-card.card-exit{pointer-events:none;transform-origin:center left;animation:card-out calc(var(--card-exit-ms)*1ms) cubic-bezier(.55,.02,.82,.36) both}
.primary-card.card-enter{transform-origin:center left;animation:card-in calc(var(--card-enter-ms)*1ms) .06s cubic-bezier(.16,1,.3,1) both}
.transition-secondary.secondary-exit{pointer-events:none;animation:secondary-out calc(var(--secondary-exit-ms)*1ms) cubic-bezier(.4,0,.8,.4) both}
.transition-secondary.secondary-enter{animation:secondary-in calc(var(--secondary-enter-ms)*1ms) .12s cubic-bezier(.16,1,.3,1) both}
@keyframes card-out{from{opacity:1;transform:translate3d(0,0,0)}to{opacity:0;transform:translate3d(-56px,0,0)}}
@keyframes card-in{from{opacity:0;transform:translate3d(-52px,0,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes secondary-out{to{opacity:0;transform:translate3d(0,-6px,0)}}
@keyframes secondary-in{from{opacity:0;transform:translate3d(0,12px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@media(max-width:1199.98px){
  :root{--card-exit-ms:320;--card-enter-ms:560;--secondary-exit-ms:220;--secondary-enter-ms:440}
  .primary-card.card-exit{animation-name:mobile-card-out}
  .primary-card.card-enter{animation-name:mobile-card-in}
  .home-left{position:relative;inset:auto;width:auto;margin:12px 12px 0;grid-template-rows:284px 32px;gap:7px}
  .home-card{padding:18px;background-image:url('/assets/card-mobile-home.png')}
  .home-intro{order:2;max-width:310px;font-size:15px;line-height:1.42}
  .home-identity{order:1}
  .home-identity h1{font-size:20px}
  .home-identity p{margin-top:3px;font-size:14px}
  .social-row{gap:6px}
  .social-tile{border-radius:8px}
  .social-tile img{width:14px;height:14px}
  .home-main{min-height:calc(100svh - 347px);margin-left:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}
  .menu{width:min(286px,calc(100% - 82px));margin-top:51px;transform:none}
  .menu-row{height:36px;font-size:16px}
  .menu-row img{width:14px;height:14px}
  .footer-links{position:static;transform:none;margin-top:auto;padding-bottom:22px;gap:34px;font-size:11px}
  .detail-sidebar{position:relative;inset:auto;width:auto;height:284px;margin:12px;padding:22px 18px 16px}
  .seedcore-view .detail-sidebar{background-image:url('/assets/card-mobile-seedcore.png')}
  .about-view .detail-sidebar{background-image:url('/assets/card-mobile-about.png')}
  .projects-view .detail-sidebar{background-image:url('/assets/card-mobile-projects.png')}
  .skills-view .detail-sidebar{background-image:url('/assets/card-mobile-skills.png')}
  .contact-view .detail-sidebar{background-image:url('/assets/card-mobile-contact.png')}
  .detail-tag{font-size:14px}
  .detail-title{font-size:23px}
  .detail-subtitle{font-size:14px;line-height:1.4;margin-top:6px}
  .seedcore-logo{width:30px;height:30px;margin-bottom:10px}
  .seedcore-button{margin-top:18px}
  .detail-main{min-height:0;margin-left:0;padding:72px 30px 0;display:block}
  .detail-column{width:min(100%,557px);margin:0 auto}
  .about-column,.seedcore-column,.projects-column,.skills-column,.contact-column{padding-top:0}
  .about-portrait{width:76px;height:85px;margin-bottom:29px}
  .detail-copy{font-size:15px;line-height:1.5}
  .seedcore-column h1{font-size:14px}
  .detail-main .footer-links{position:static;justify-content:center;margin:150px 0 0;padding-bottom:24px}
  .projects-view .detail-main,.skills-view .detail-main,.contact-view .detail-main{min-height:calc(100svh - 308px);padding:11px 30px 0;display:flex;flex-direction:column}
  .projects-view .detail-column,.skills-view .detail-column,.contact-view .detail-column{width:100%}
  .projects-view .detail-main{padding-top:4px}
  .project-row{height:44px;font-size:16px}
  .project-row img{width:20px;height:20px;opacity:1}
  .skills-grid{gap:8px}
  .skills-view .detail-subtitle{max-width:310px}
  .skill-tile{height:118px}
  .contact-form{gap:21px}
  .projects-view .detail-main .footer-links,.skills-view .detail-main .footer-links,.contact-view .detail-main .footer-links{margin-top:auto;padding-top:80px}
  @keyframes mobile-card-out{from{opacity:1;transform:translate3d(0,0,0)}to{opacity:0;transform:translate3d(0,-36px,0)}}
  @keyframes mobile-card-in{from{opacity:0;transform:translate3d(0,-38px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
}
@media(max-width:359px){.detail-main{padding-left:24px;padding-right:24px}.menu{width:calc(100% - 70px)}.footer-links{gap:20px;font-size:10px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.reveal-words{opacity:1;transform:none}}
