*,*:before,*:after{box-sizing:border-box}a{all:unset;display:inline-flex;cursor:pointer;color:inherit;text-decoration:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}button{all:unset;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font:inherit;color:inherit;background-color:transparent;padding:0;margin:0;border:none;outline:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}video{outline:none}:root{--bg: #111;--text: #f7f7f7;--text-muted: #6a6a6a;--border: #3d3d3d;height:100%}@media (prefers-color-scheme: light){:root{--bg: white;--text: black;--text-muted: #777;--border: oklch(90% 0 0)}}body{margin:0;display:flex;flex-direction:column;width:100%;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;font-size:16px;font-weight:400;line-height:28px;font-feature-settings:"kern","frac","ss02";text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;background-color:var(--bg);color:var(--text);height:100%;overflow:hidden;color-scheme:dark}@media (prefers-color-scheme: light){body{color-scheme:light}}#root{position:relative;width:100%;height:100%}h1{font-size:16px;font-weight:500;line-height:28px;font-feature-settings:"kern","calt","case";margin:0 0 28px}.profile{display:flex;align-items:center;justify-content:space-between;gap:32px}.profile h1{margin-bottom:12px}.profile p{margin-bottom:0}.avatar{width:72px;height:72px;flex-shrink:0;border-radius:50%;object-fit:cover;object-position:center 15%;border:1px solid var(--border)}h2{font-size:14px;font-weight:400;line-height:20px;color:var(--text-muted);margin:0}p{margin:0 0 28px}p:last-child{margin-bottom:0}em{font-style:italic}a{color:var(--text)}.nav-back{display:flex;align-items:center;gap:.25rem;margin-bottom:28px;color:var(--text-muted)}.nav-back svg{width:16px;height:16px}.nav-back:hover{color:var(--text)}.text-muted{color:var(--text-muted)}#grid{display:block;height:5rem;width:100%}.page>:has(#grid){margin-block:36px 64px;flex-shrink:0}.columns{display:flex}.columns>*+*{margin-left:32px}.column{width:192px;min-width:0}.column ul{margin:12px 0 0;padding:0;list-style:none}.column li+li{margin-top:24px}.column li{min-height:84px}.column li a{display:inline-flex;align-items:center;gap:6px;color:var(--text);text-decoration:underline;text-decoration-color:var(--border);text-underline-offset:2.5px;text-decoration-thickness:1px}.column li a .icon{width:20px;height:20px;flex-shrink:0}.column li a .icon-social{box-sizing:border-box;padding:3px;color:var(--text-muted)}.column li a:hover{color:var(--text)}.column li p{font-size:14px;line-height:20px;color:var(--text-muted)}.ext{width:18px;height:18px;color:var(--text-muted);flex-shrink:0}.prose{margin-top:64px}.prose h2{font-size:16px;font-weight:500;line-height:28px;color:var(--text);margin:0 0 28px}.prose a{display:inline;text-decoration:underline;text-decoration-color:var(--border);text-underline-offset:3px}.prose a:hover{text-decoration-color:var(--text-muted)}.page>:has(+footer){margin-bottom:48px}footer{position:relative;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--border);padding:1rem 0;color:var(--text-muted);font-size:14px;line-height:20px;margin-top:auto;flex-shrink:0}footer:before{position:absolute;content:"";width:100%;top:-26px;height:25px;background:linear-gradient(to top,var(--bg),transparent);z-index:1;pointer-events:none}.footer-meta{display:flex;align-items:center;gap:.5rem;font-variant-numeric:tabular-nums}.clock{--now-h: 0;--now-m: 0;--now-s: 0;--seconds-deg: calc((var(--now-s) / 60) * 360);--minutes-deg: calc( ((var(--now-m) / 60) * 360) + ((var(--now-s) / 60) * 6) );--hours-deg: calc(((var(--now-h) / 12) * 360) + ((var(--now-m) / 60) * 30));--width: 1px;--color: var(--text-muted);width:20px;height:20px;border:1px solid var(--border);border-radius:50%;display:flex;justify-content:center;align-items:center;position:relative;transform:rotate(180deg)}.clock:before{content:"";background:var(--color);z-index:1;border-radius:50%;width:.5px;height:.5px;position:absolute}.clock>*{top:50%;left:calc(50% - var(--width) / 2);width:var(--width);height:var(--height);background-color:var(--color);border-radius:calc(var(--width) / 2);transform-origin:50% 0;position:absolute}.clock .second{--height: 8px;--width: .5px;transform:rotate(calc(var(--seconds-deg) * 1deg))}.clock .minute{--height: 7px;transform:rotate(calc(var(--minutes-deg) * 1deg))}.clock .hour{--height: 5px;transform:rotate(calc(var(--hours-deg) * 1deg))}.group{display:flex;align-items:center;gap:.5rem}.page{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;height:100%;width:100%;padding:0 2rem;opacity:0;transition:opacity .4s;overflow-y:auto;overflow-x:hidden}.page>*{width:100%;max-width:640px;margin-inline:auto}.page:before{content:"";pointer-events:none;position:sticky;top:0;z-index:2;flex-shrink:0;height:96px;margin-bottom:32px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);opacity:.95;-webkit-mask-image:linear-gradient(to bottom,#000 25%,transparent);mask-image:linear-gradient(to bottom,#000 25%,transparent);background:linear-gradient(to bottom,var(--bg),transparent)}.page[active]{opacity:1;z-index:1000}.project.page{background-color:var(--bg);color:var(--text)}.project.page .date{color:var(--text-muted);font-size:14px}.project.page video{margin-block:28px;aspect-ratio:16/9;width:100%;border-radius:6px;object-fit:cover;border:1px solid var(--border)}.project.page .title{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-bottom:8px;width:100%}.project.page .title h1{margin:0;line-height:28px}.project.page .title .icon{width:24px;height:24px;flex-shrink:0}.project.page header{display:flex;flex-direction:column;align-items:start;width:100%}.project.page header>span{font-size:16px;line-height:28px}.btn{display:flex;align-items:center;justify-content:center;width:fit-content;max-width:100%;margin-bottom:28px;padding:.5rem 1rem;font-weight:500;background-color:var(--text);color:var(--bg);border-radius:6px}.btn svg{width:16px;height:16px;stroke-width:2.5}.btn svg:last-child{margin-left:.5rem}@media (prefers-reduced-motion: no-preference){.page[active] [data-animate]{animation:enter .6s ease both;animation-delay:calc(var(--stagger, 0) * .12s)}.page[active] .avatar[data-animate]{animation-name:enter-avatar;animation-duration:.7s;animation-timing-function:cubic-bezier(.16,1,.3,1)}.page[active] footer[data-animate]{animation-name:enter-fade}}@keyframes enter{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes enter-avatar{0%{opacity:0;transform:scale(.72)}to{opacity:1;transform:none}}@keyframes enter-fade{0%{opacity:0}to{opacity:1}}@media screen and (max-width: 768px){.page{padding-inline:max(2rem,env(safe-area-inset-left)) max(2rem,env(safe-area-inset-right))}.page:before{margin-bottom:-32px}.columns{flex-direction:column}.columns>*+*{margin-left:0;margin-top:48px}.column{width:100%}.column li{min-height:0}footer{flex-direction:column}.project.page .title{flex-direction:column;align-items:flex-start}}