.site-head{position:fixed;top:var(--sa-t);left:0;right:0;z-index:40;height:var(--head-h);transition:background var(--d3),box-shadow var(--d3)}
.site-head.solid{background:rgba(253,253,254,.86);-webkit-backdrop-filter:blur(.875rem) saturate(1.3);backdrop-filter:blur(.875rem) saturate(1.3);box-shadow:0 1px 0 var(--line)}
.head-in{height:100%;max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter);display:flex;align-items:center;gap:2.5rem}
.brand{display:inline-flex;align-items:center;gap:.5625rem;font-weight:720;font-size:1.0625rem;letter-spacing:-.025em;transition:opacity var(--d3)}
.brand img{width:2.125rem;height:auto}
.brand b{font-weight:720;color:var(--pink)}
body[data-route="home"] .site-head:not(.solid) .brand{opacity:0;pointer-events:none}
.nav{display:flex;gap:1.875rem;font-size:.9062rem;line-height:1.375rem;color:var(--muted);font-weight:500}
.nav a{position:relative;transition:color var(--d2)}
.nav a::before{content:"";position:absolute;left:50%;top:-.75rem;width:1px;height:.375rem;background:rgba(22,19,26,.28);transform:scaleY(0);transform-origin:50% 0;opacity:0;transition:transform .6s var(--ease),opacity 1.2s}
.intro .nav.is-struct a::before{transform:scaleY(1);opacity:1}
.intro .nav.is-set a::before{opacity:0}
.nav a:hover,.nav a[aria-current]{color:var(--fg)}
.nav{position:relative}
.nav-ink{position:absolute;left:0;bottom:-.5625rem;width:1rem;height:.125rem;border-radius:.125rem;background:var(--pink);opacity:0;transform:translateX(var(--x,0)) scaleX(var(--k,1));transition:transform .55s var(--ease),opacity .3s;pointer-events:none}
.nav-ink.on{opacity:1}
.nav a{padding:.375rem 0}
.nav{margin:-.375rem 0}
.intro .nav:not(.is-set) .nav-ink{opacity:0}
.head-act{margin-left:auto;display:flex;align-items:center;gap:.625rem}
.nav-cta{display:none}
.btn-login{min-width:5.75rem}
.btn-login,.btn-access{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;height:2.5rem;padding:0 1.125rem;border-radius:1.25rem;font-size:.875rem;font-weight:600;letter-spacing:-.005em;white-space:nowrap}
.btn-login .pill,.btn-access .pill{position:absolute;inset:0;z-index:-1;border-radius:inherit;transition:opacity .5s linear,background var(--d2),border-color var(--d2)}
.btn-login .pill{border:1px solid var(--line);background:rgba(255,255,255,.75)}
.btn-login:hover .pill{border-color:var(--line-strong)}
.btn-access{color:#fff}
.btn-access .pill{background:var(--fg)}
.btn-access:hover .pill{background:#000}
.hline{position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,rgba(22,19,26,.08) 12%,rgba(22,19,26,.08) 88%,transparent);transition:transform 1.8s var(--ease),opacity var(--d3)}
.intro .hline:not(.is-in){transform:scaleX(0)}
.site-head.solid .hline{opacity:0}

body{display:flex;flex-direction:column}
#main{flex:1 0 auto;display:flex;flex-direction:column}
.view{flex:1 0 auto}
#view{padding-top:calc(var(--head-h) + var(--sa-t))}
#view:not([hidden]){display:flex;flex-direction:column}
#view>.page{flex:1 0 auto}
.nf-page,.access-page{display:flex;align-items:center}
.nf-page>.wrap,.access-page>.wrap{flex:1}
.mini-cv{position:fixed;inset:0;width:100%;height:100%;z-index:72;pointer-events:none}
.mini-veil{position:fixed;inset:0;z-index:70;display:none;background:var(--bg)}
.boot .mini-veil{display:block;animation:mini-failsafe .4s linear 4s forwards}
.mini-veil::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(22,19,26,.075) 1px,transparent 1.25px);background-size:1.375rem 1.375rem;-webkit-mask-image:radial-gradient(ellipse 58% 52% at 50% 50%,#000 18%,transparent 72%);mask-image:radial-gradient(ellipse 58% 52% at 50% 50%,#000 18%,transparent 72%)}
.mini-veil::after{content:"";position:absolute;left:50%;top:50%;width:min(44rem,90vw);height:min(26rem,60vh);transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(255,31,122,.09),transparent);opacity:0;transition:opacity 1.2s var(--ease)}
.mini-veil.ready::after{opacity:1}
.mini-veil.out{opacity:0;transition:opacity .7s var(--ease)}
@keyframes mini-failsafe{to{opacity:0;visibility:hidden}}
.mini-mark{position:fixed;left:50%;top:50%;z-index:71;width:clamp(6rem,10vw,8.75rem);transform:translate(-50%,-50%);opacity:0;pointer-events:none;transition:opacity .34s var(--ease)}
.mini-mark img{display:block;width:100%;height:auto}
.mini-mark.on{opacity:1}
.mini-mark::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 32%,rgba(255,255,255,.8) 50%,transparent 68%) no-repeat;background-size:260% 100%;background-position:130% 0;-webkit-mask:url(/assets/mark.svg) center/100% 100% no-repeat;mask:url(/assets/mark.svg) center/100% 100% no-repeat;opacity:0}
.mini-mark.breath{animation:mini-breath 2.6s ease-in-out infinite}
.mini-mark.breath::after{opacity:1;animation:mini-sheen 2.1s cubic-bezier(.45,0,.2,1) .2s infinite}
@keyframes mini-breath{50%{transform:translate(-50%,-50%) scale(1.035)}}
@keyframes mini-sheen{from{background-position:130% 0}60%,to{background-position:-30% 0}}
.mini-prog{position:fixed;left:50%;top:calc(50% + clamp(3.5rem,5.6vw,4.75rem));z-index:71;display:flex;align-items:center;gap:.75rem;width:11rem;transform:translateX(-50%);opacity:0;pointer-events:none;transition:opacity .4s var(--ease)}
.mini-prog.on{opacity:1}
.mini-prog i{position:relative;flex:1;height:2px;border-radius:2px;background:var(--line);overflow:hidden}
.mini-prog i::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,var(--fg),var(--pink));transform-origin:left;transform:scaleX(var(--p,0));transition:transform .6s var(--ease)}
.mini-prog.det i::after{transition:transform .1s linear}
.mini-prog span{min-width:2.25rem;font:500 .6875rem/1 var(--mono);font-variant-numeric:tabular-nums;text-align:right;color:var(--faint)}
.mini-prog:not(.det) i::after{right:auto;width:38%;transform:none;animation:mini-ind 1.15s ease-in-out infinite}
.mini-prog:not(.det) span{display:none}
@keyframes mini-ind{from{transform:translateX(-110%)}to{transform:translateX(290%)}}
@media (prefers-reduced-motion:reduce){.mini-mark.breath,.mini-mark.breath::after,.mini-prog:not(.det) i::after{animation:none}}
[data-enter]{opacity:0;transform:translateY(1rem);transition:opacity .62s var(--ease),transform .78s var(--ease)}
[data-enter].in{opacity:1;transform:none}
[data-enter]::before{content:none}
@media(prefers-reduced-motion:reduce){[data-enter]{transition:none;opacity:1;transform:none}}

.site-foot{border-top:1px solid var(--line);background:var(--bg)}
.intro .site-foot{display:none}
.foot-in{display:flex;align-items:center;flex-wrap:wrap;gap:.75rem 2rem;padding-top:1.25rem;padding-bottom:max(1.25rem,env(safe-area-inset-bottom));font-size:.7812rem;color:var(--faint)}
.foot-copy{display:flex;align-items:center;gap:.625rem;min-width:0;flex:1 1 22rem}
.foot-copy img{width:1.5rem;height:auto;flex:none}
.foot-meta{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem}
.foot-meta a{color:var(--muted);transition:color var(--d2)}
.foot-meta a:hover{color:var(--pink-deep)}
body[data-route="docs"] .foot-meta{display:none}
.fp-note{display:flex;align-items:center;gap:.4375rem;margin-top:1rem;font-size:.75rem;color:var(--muted)}
.fp-note svg,.foot-fp svg{width:.875rem;height:.875rem;flex:none;fill:none;stroke:var(--pink);stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round}
.foot-fp{display:inline-flex;align-items:center;gap:.4375rem;flex:none;color:var(--muted);transition:color var(--d2)}
.foot-fp:hover{color:var(--fg)}

.page{padding:4rem 0 var(--s9)}
.page-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:2rem;padding-bottom:2.5rem}
.page-head .h1{margin-top:.875rem}
.page-head .lead{margin-top:1rem;max-width:38.75rem}
.section{padding:var(--sec) 0}
.section+.section{border-top:1px solid var(--line-2)}
.sec-head{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,4.5rem);align-items:end;margin-bottom:clamp(1.75rem,2.6vw,2.75rem)}
.sec-head .h2{margin-top:.875rem;max-width:35rem}
.sec-head>p{font:var(--t-body);color:var(--muted);max-width:35rem}
.src-note{display:inline-flex;align-items:center;gap:.5rem;font:var(--t-meta);letter-spacing:.06em;color:var(--faint)}
.src-note i{width:.375rem;height:.375rem;border-radius:50%;background:var(--ok)}
.src-note.snap i{background:var(--idle)}
.mono-mark{display:inline-grid;place-items:center;border-radius:.375rem;background:linear-gradient(145deg,var(--surface-3),#e7e3ec);font:700 .6875rem/1 var(--sans);color:var(--fg-2);flex:none}
.mono-mark.px{background:none}
.mono-mark.px svg{width:78%;height:78%;fill:var(--fg)}