@font-face{font-family:"DM Sans";src:url("assets/fonts/dm-sans-regular.ttf") format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:"DM Sans";src:url("assets/fonts/dm-sans-semibold.ttf") format("truetype");font-weight:600;font-display:swap}
:root{--paper:#fff;--ink:#171717;--muted:#666;--wine:#6e303b;--line:#e5dfe0;--frame-size:6px;--frame-left:24px;--gutter:clamp(22px,3vw,42px);--ease:cubic-bezier(.22,1,.36,1);--settle:cubic-bezier(.2,.8,.25,1.08);font:400 14px/1.7 "DM Sans",Arial,sans-serif;color:var(--ink);background:var(--paper);color-scheme:light;font-synthesis:none;scroll-behavior:smooth;scroll-padding-top:30px}
*{box-sizing:border-box}body{margin:0;min-height:100svh;padding-left:calc(var(--frame-left) + var(--gutter));padding-right:calc(var(--frame-size) + var(--gutter));-webkit-font-smoothing:antialiased}h1,h2,p,dl,dd{margin:0}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}a,button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button{cursor:pointer}a:focus-visible,button:focus-visible{outline:2px solid var(--wine);outline-offset:5px}::selection{color:#52232c;background:#f1e7e9}
.frame{position:fixed;inset:0;z-index:20;border:var(--frame-size) solid var(--ink);border-left-width:var(--frame-left);pointer-events:none}
.directory{--nav-width:var(--frame-left);position:fixed;top:var(--frame-size);bottom:var(--frame-size);left:0;width:var(--nav-width);z-index:40;color:white;transition:width 240ms var(--settle)}
.directory::before{content:"";position:absolute;inset:0;background:var(--ink);border-radius:0 3px 3px 0;transition:box-shadow 240ms}
.directory[data-open="true"]{--nav-width:144px}
.directory[data-open="true"]::before{box-shadow:9px 0 28px #17171712}
.directory-toggle{position:absolute;top:15px;left:0;display:grid;align-content:center;gap:3px;width:44px;height:44px;border:0;padding:0 0 0 7px;background:none;z-index:2}
.menu-stroke{display:block;width:10px;height:1px;background:#ddd;transform-origin:center;transition:transform 200ms var(--ease),opacity 160ms}
.directory[data-open="true"] .menu-stroke:first-child{transform:translateY(4px) rotate(45deg)}.directory[data-open="true"] .menu-stroke:nth-child(2){opacity:0}.directory[data-open="true"] .menu-stroke:last-child{transform:translateY(-4px) rotate(-45deg)}
.directory-links{position:absolute;top:42%;left:0;width:100%;transform:translateY(-50%);display:grid;gap:5px}
.directory-link{position:relative;display:flex;align-items:center;gap:16px;width:max(44px,100%);height:44px;white-space:nowrap;color:#bdb8b9;isolation:isolate}
.directory-link::before{content:"";position:absolute;left:0;top:3px;width:var(--nav-width);height:38px;z-index:-1;background:var(--wine);opacity:0;transition:opacity 160ms,width 240ms var(--settle)}
.directory-link[aria-current="location"]{color:#fff}.directory-link[aria-current="location"]::before{opacity:1}
.nav-number{flex:0 0 var(--frame-left);text-align:center;font-size:8px;font-variant-numeric:tabular-nums;line-height:44px}
.nav-label{font-size:12px;opacity:0;visibility:hidden;transform:translateX(-5px) scale(.96);transform-origin:left center;transition:opacity 160ms,transform 240ms var(--settle),visibility 160ms}
.directory[data-open="true"] .nav-label{opacity:1;visibility:visible;transform:none}
.directory a:focus-visible,.directory button:focus-visible{outline:1px solid white;outline-offset:-3px}
.directory-foot{position:absolute;bottom:20px;left:0;width:var(--frame-left);text-align:center;font-size:7px;letter-spacing:.07em;writing-mode:vertical-rl;line-height:var(--frame-left);color:#888}
.page{width:min(100%,820px);margin-inline:auto;padding:50px 0 38px}.identity{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}.identity-copy{min-width:0;flex:1}.identity-title{display:flex;flex-wrap:wrap;align-items:center;column-gap:20px;row-gap:13px}.identity-name{display:flex;align-items:center;gap:10px}.name-mark{width:29px;height:29px;flex:0 0 auto}h1{font-size:23px;line-height:32px;font-weight:600;letter-spacing:-.04em}.name-dot{color:var(--wine)}.identity-note{margin-top:11px;font-size:13px;line-height:23px;color:var(--muted)}.site-mark{width:40px;height:40px;flex:0 0 auto;margin-top:-2px}
.university-marks{display:flex;align-items:center;gap:15px;padding-left:18px;border-left:1px solid var(--line)}.university-marks img{display:block;object-fit:contain;filter:brightness(0)}.columbia-mark{width:24px;height:24px}.rmit-mark{width:72px;height:auto}
main{margin-top:34px}main,section{scroll-margin-top:30px}main:focus,section:focus{outline:none}h2{font-size:12px;line-height:20px;font-weight:600;color:var(--wine)}.section-content{margin-top:14px;min-width:0}
.project-link{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;border-radius:4px;isolation:isolate;transform-origin:left center;transition:transform 260ms var(--settle),color 160ms}.project-link::before{content:"";position:absolute;inset:-6px -10px;z-index:-1;background:#f6eff1;border-radius:6px;opacity:0;transition:opacity 160ms}.project-copy{display:grid;gap:6px;min-width:0}.project-name{font-size:28px;line-height:36px;letter-spacing:-.045em}.project-description{font-size:13px;line-height:23px;color:var(--muted)}.project-open{display:grid;place-items:center;width:44px;height:44px;flex:0 0 44px}.arrow{width:17px;height:17px;color:var(--wine);flex-shrink:0;transition:transform 220ms var(--settle)}.project-link:focus-visible::before{opacity:1}.project-link:focus-visible .arrow,.email-link:focus-visible .arrow,.github-link:focus-visible .arrow{transform:translate(2px,-2px)}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:18px;padding:18px 22px;background:var(--wine);color:white;border-radius:2px}.metric{display:flex;flex-direction:column-reverse;gap:4px}.metric+.metric{border-left:1px solid #ad858d;padding-left:24px}.metric dd{font-size:30px;line-height:34px;letter-spacing:-.04em;font-variant-numeric:tabular-nums}.metric dt{font-size:11px;line-height:18px;color:#f4eaec}.project-meta{font-size:11px;line-height:20px;color:var(--muted);margin-top:12px}.about{margin-top:28px}.about p{font-size:14px;line-height:26px;color:var(--muted);text-wrap:pretty;max-width:60ch}.connect{position:relative;margin-top:24px}.email-row{display:flex;align-items:center;gap:8px}.email-link,.github-link{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-size:14px;line-height:22px}.github-row{margin-top:0}.github-link{color:var(--wine)}.github-icon{width:15px;height:15px;flex-shrink:0}.github-handle{color:var(--muted);font-size:11px}.copy-button{position:relative;display:grid;place-items:center;width:44px;height:44px;flex:0 0 44px;padding:0;border:0;border-radius:7px;background:transparent;color:var(--wine);transition:background 150ms,transform 260ms var(--settle)}.copy-button[hidden]{display:none}.copy-button:focus-visible{background:#f3e9ec}.copy-button:active{transform:scale(.94);transition-duration:70ms}.copy-icon,.check-icon{grid-area:1/1;width:16px;height:16px;transition:opacity 120ms,transform 220ms var(--settle)}.check-icon{opacity:0;transform:scale(.65)}.copy-button[data-copied=true] .copy-icon{opacity:0;transform:scale(.65)}.copy-button[data-copied=true] .check-icon{opacity:1;transform:scale(1)}.copy-hint{position:absolute;bottom:calc(100% + 5px);left:50%;transform:translate(-50%,3px);padding:3px 8px;border-radius:4px;background:var(--ink);color:white;font-size:10px;line-height:18px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity 120ms,transform 180ms var(--ease),visibility 120ms}.copy-button:focus-visible:not([data-copied]) .copy-hint{opacity:1;visibility:visible;transform:translate(-50%,0)}.copy-status{position:absolute;top:100%;left:0;color:var(--wine);font-size:11px;line-height:18px}
.footer{display:flex;justify-content:space-between;gap:20px;margin-top:30px;padding-top:14px;border-top:1px solid var(--line);font-size:10px;line-height:20px;color:var(--muted)}.skip-link{position:fixed;left:44px;top:18px;z-index:50;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);padding:0;background:var(--wine);color:#fff}.skip-link:focus{width:auto;height:auto;overflow:visible;clip-path:none;padding:10px 16px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(hover:hover) and (pointer:fine){.directory-link:hover{color:#fff}.directory-link:hover .nav-label{transform:scale(1.065)}.project-link:hover{transform:scale(1.012);color:var(--wine)}.project-link:hover::before{opacity:1}.project-link:hover .arrow,.email-link:hover .arrow,.github-link:hover .arrow{transform:translate(2px,-2px)}.email-link:hover{color:var(--wine)}.copy-button:hover{background:#f3e9ec}.copy-button:hover:not([data-copied]) .copy-hint{opacity:1;visibility:visible;transform:translate(-50%,0);transition-delay:180ms}}
@keyframes arrive{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:no-preference){.enter{animation:arrive 360ms var(--ease) both;animation-delay:calc(var(--step,0)*35ms)}}
@media(max-width:600px){:root{--frame-size:4px;--frame-left:18px;--gutter:26px}.directory-toggle{padding-left:4px}.nav-number{font-size:7px}.directory-foot{font-size:6px}.identity{gap:14px}.identity-title{gap:14px}.university-marks{padding-left:0;border:0}.identity-note{font-size:12px;line-height:21px}.site-mark{width:34px;height:34px}.email-link,.github-link{font-size:12px;gap:7px}.email-row{gap:3px}.github-handle{font-size:10px}.page{padding-top:34px;padding-bottom:30px}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.project-link,.arrow,.copy-button:active,.nav-label{transform:none!important}}
