:root{color:#fff;background:#000;font-family:Alpino,monospace}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}html,body{min-height:100vh;background:#000;color:#fff;-ms-overflow-style:none;scrollbar-width:none}html::-webkit-scrollbar,body::-webkit-scrollbar{display:none}a{color:#fff;text-decoration:none;width:fit-content;border-bottom:1px solid rgba(255,255,255,.35);padding-bottom:.15rem;transition:border-color .12s ease,opacity .12s ease}a:focus-visible{outline:2px solid rgba(255,255,255,.55);outline-offset:.35rem}a:hover{opacity:.8;border-color:#ffffffd9}.nav-link{display:inline-flex;align-items:center;gap:.65rem;transition:color .14s ease,border-color .14s ease,opacity .14s ease}.nav-link svg{width:1rem;height:1rem;transition:color .14s ease,filter .14s ease}.nav-link:hover{color:var(--hover-color, #ffffff);border-color:var(--hover-color, rgba(255, 255, 255, .85))}.nav-link:hover svg{color:var(--hover-color, #ffffff);filter:drop-shadow(0 0 .35rem color-mix(in srgb,var(--hover-color, #ffffff) 45%,transparent))}.page-shell{min-height:100vh;display:block;padding:4.5rem 2rem 3rem}.hero{position:relative;width:min(100%,36rem);margin:0 auto;text-align:center}.hero h1{margin:0 0 2rem;font-size:clamp(1.35rem,3vw,2.1rem);font-weight:500;letter-spacing:.01em}.scroll-hint{display:inline-grid;place-items:center;margin:0 0 2.25rem;color:#ffffff57}.scroll-hint svg{width:1rem;height:1rem;animation:scroll-float 2.8s ease-in-out infinite}.link-groups{display:grid;gap:2rem;justify-items:center;margin-bottom:3rem}.link-group{position:relative;display:grid;gap:.85rem;justify-items:center}.project-preview{position:relative;display:grid;justify-items:center;z-index:20}.project-link{position:relative;z-index:2}.preview-card{position:absolute;z-index:30;top:-.35rem;left:calc(100% + 2rem);width:min(42vw,30rem);min-width:22rem;max-width:30rem;overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:1.35rem;background:radial-gradient(circle at top,color-mix(in srgb,var(--hover-color, #ffffff) 20%,transparent),transparent 48%),#0a0a0cf0;box-shadow:0 1.5rem 4rem #00000080,0 0 0 1px #ffffff0a inset;opacity:0;pointer-events:none;transform:translate(-.6rem) scale(.98);transform-origin:left top;transition:opacity .22s ease,transform .24s ease,border-color .18s ease,box-shadow .18s ease}.project-preview:hover .preview-card,.project-preview:focus-within .preview-card{opacity:1;transform:translate(0) scale(1);border-color:color-mix(in srgb,var(--hover-color, #ffffff) 28%,rgba(255,255,255,.12));box-shadow:0 1.8rem 4.5rem #00000094,0 0 1.4rem color-mix(in srgb,var(--hover-color, #ffffff) 18%,transparent)}.preview-image-wrap{overflow:hidden;border-bottom:1px solid rgba(255,255,255,.08);background:#ffffff08}.preview-image{display:block;width:100%;height:auto;aspect-ratio:1400 / 891;object-fit:contain;filter:saturate(.95) contrast(1.02);transform:scale(1.02);transition:transform .28s ease,filter .22s ease}.project-preview:hover .preview-image,.project-preview:focus-within .preview-image{transform:scale(1.05);filter:saturate(1.02) contrast(1.06)}.preview-copy{display:grid;gap:.45rem;padding:1rem 1rem 1.1rem;text-align:left}.preview-title,.preview-description{margin:0}.preview-title{font-size:.76rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:color-mix(in srgb,var(--hover-color, #ffffff) 72%,#ffffff)}.preview-description{font-size:.96rem;line-height:1.55;color:#ffffffc7}.link-group h2{margin:0;font-size:1rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em}.stack-sections{position:relative;z-index:1;display:grid;gap:1.75rem;content-visibility:auto;contain-intrinsic-size:1200px}.stack-placeholder{min-height:18rem}.stack-section{display:grid;gap:.65rem}.stack-section h2{margin:0;font-size:1rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;opacity:0;animation:fade-in-up .56s ease forwards}.tech-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem}.tech-item{display:inline-flex;align-items:center;gap:.6rem;padding:.55rem .85rem;border:1px solid rgba(255,255,255,.16);border-radius:999px;color:#ffffffe0;background:#ffffff08;opacity:0;animation:fade-in-up .56s ease forwards;transition:color .14s ease,border-color .14s ease,background-color .14s ease}.tech-item:hover{color:var(--hover-color, #ffffff);border-color:color-mix(in srgb,var(--hover-color, #ffffff) 55%,rgba(255,255,255,.16));background:color-mix(in srgb,var(--hover-color, #ffffff) 10%,rgba(255,255,255,.03))}.tech-icon{display:inline-grid;place-items:center;width:2rem;height:2rem;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:#ffffff0f;transition:color .14s ease,border-color .14s ease,background-color .14s ease,filter .14s ease}.tech-item:hover .tech-icon{color:var(--hover-color, #ffffff);border-color:color-mix(in srgb,var(--hover-color, #ffffff) 45%,rgba(255,255,255,.22));background:color-mix(in srgb,var(--hover-color, #ffffff) 14%,rgba(255,255,255,.06));filter:drop-shadow(0 0 .4rem color-mix(in srgb,var(--hover-color, #ffffff) 32%,transparent))}.tech-icon svg{width:1.05rem;height:1.05rem}.stack-section:nth-of-type(1) h2{animation-delay:.2s}.stack-section:nth-of-type(2) h2{animation-delay:.28s}.stack-section:nth-of-type(3) h2{animation-delay:.36s}.stack-section:nth-of-type(4) h2{animation-delay:.44s}.stack-section:nth-of-type(5) h2{animation-delay:.52s}.stack-section:nth-of-type(1) .tech-item{animation-delay:.14s}.stack-section:nth-of-type(2) .tech-item{animation-delay:.22s}.stack-section:nth-of-type(3) .tech-item{animation-delay:.3s}.stack-section:nth-of-type(4) .tech-item{animation-delay:.38s}.stack-section:nth-of-type(5) .tech-item{animation-delay:.46s}@keyframes fade-in-up{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes scroll-float{0%,to{transform:translateY(0);opacity:.45}50%{transform:translateY(.38rem);opacity:.8}}@media(prefers-reduced-motion:reduce){.hero h1,.scroll-hint,.link-group h2,.stack-section h2,.nav-link,.tech-item{opacity:1;animation:none;transition:color .14s ease,border-color .14s ease,background-color .14s ease,opacity .14s ease}.preview-card,.preview-image{transition:none}.scroll-hint svg{animation:none}}@media(max-width:980px){.preview-card{top:calc(100% + 1rem);left:50%;width:min(78vw,28rem);min-width:0;transform:translate(-50%) translateY(-.35rem) scale(.98);transform-origin:top center}.project-preview:hover .preview-card,.project-preview:focus-within .preview-card{transform:translate(-50%) translateY(0) scale(1)}}@media(max-width:640px){.page-shell{padding:3rem 1rem}.hero{width:min(100%,34rem)}.preview-card{width:min(88vw,26rem)}}