@font-face{font-family:Sora;src:url(/fonts/sora.ttf)format("truetype");font-style:normal;font-weight:100 800;font-display:swap}@font-face{font-family:Inter;src:url(/fonts/inter.woff2)format("woff2");font-style:normal;font-weight:100 900;font-display:swap}@font-face{font-family:JetBrains Mono;src:url(/fonts/jetbrains-mono.woff2)format("woff2");font-style:normal;font-weight:100 800;font-display:swap}:root{color-scheme:dark;--canvas:#111;--surface:#171717;--raised:#202020;--line:#303030;--text:#f2f2f2;--muted:#aaa;--accent:#b495ff;--display:Sora, sans-serif;--sans:Inter, sans-serif;--mono:"JetBrains Mono", monospace;font-family:var(--sans);font-synthesis:none;scroll-behavior:smooth;background:var(--canvas);color:var(--text);-webkit-font-smoothing:antialiased;scroll-padding-top:40px}*{box-sizing:border-box}body,h1,h2,h3,p{margin:0}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button,input,a{touch-action:manipulation}svg,img{display:block}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--accent);outline-offset:6px}::selection{color:#111;background:var(--accent)}.section-wrap{width:min(1280px,100% - 96px);margin-inline:auto}.skip-link{z-index:30;color:#111;background:var(--accent);padding:12px;position:fixed;top:12px;left:12px;transform:translateY(-200%)}.skip-link:focus{transform:none}.site-header{z-index:3;grid-template-columns:1fr auto 1fr;align-items:center;gap:32px;height:112px;display:grid;position:absolute;top:0;left:0;right:0}.brand{align-items:center;display:inline-flex}.brand svg{width:auto;height:30px}.site-header .brand{justify-self:start}.site-header nav{white-space:nowrap;align-items:center;gap:40px;display:flex}.header-source{white-space:nowrap;justify-self:end}.site-header nav a,.header-source{font-size:16px;font-weight:450}.site-header nav a{color:var(--muted);transition:color .2s}.site-header nav a:hover{color:var(--text)}.header-source{border:1px solid var(--line);border-radius:8px;align-items:center;gap:10px;padding:12px 18px;transition:background .2s,border-color .2s;display:inline-flex}.github-mark{flex:none;width:1.15em;height:1.15em}.header-source:hover{background:var(--raised);border-color:#666}.hero{isolation:isolate;background:#030303;flex-direction:column;padding-top:112px;display:flex;position:relative;overflow:clip}.hero-glow{pointer-events:none;mix-blend-mode:screen;height:1000px;transition:transform 1.3s cubic-bezier(.16,1,.3,1);position:absolute;inset:0 0 auto}.hero-glow>span{filter:blur(24px);background:radial-gradient(38% 30% at 34% 30%,#b495ff24,#0000 70%),radial-gradient(32% 26% at 68% 22%,#d6dceb0f,#0000 70%),radial-gradient(44% 30% at 54% 58%,#7e5cdc17,#0000 72%);animation:24s ease-in-out infinite alternate drift;position:absolute;inset:-10%}.hero-copy{z-index:2;text-align:center;padding-top:80px;position:relative}.hero h1{font-family:var(--display);letter-spacing:-.072em;margin-top:0;font-size:clamp(72px,8vw,128px);font-weight:450;line-height:1.08}.hero h1>span{color:#969399}.hero-description{color:var(--muted);letter-spacing:-.12px;margin-top:32px;font-size:20px;line-height:1.7}.hero-actions{justify-content:center;align-items:center;gap:32px;margin-top:40px;display:flex}.button{border-radius:8px;justify-content:center;align-items:center;gap:28px;min-height:56px;padding:16px 22px;font-size:16px;font-weight:550;transition:background .2s,transform .2s;display:inline-flex}.button-primary{color:#111;background:var(--accent)}.button-secondary{border:1px solid var(--line);gap:12px;transition:background .2s,border-color .2s}.button-secondary:hover{background:var(--raised);border-color:#666}.button .github-mark{width:20px;height:20px}.button-primary:has(.github-mark){gap:12px}.button-primary:hover{background:#c7afff;transform:translateY(-2px)}.hero-art{z-index:-1;aspect-ratio:1672/941;pointer-events:none;width:100%;margin-top:calc(64px - 10.7vw);position:relative;mask-image:linear-gradient(#0000,#000 12%)}.hero-art:after{content:"";background:linear-gradient(transparent, var(--canvas));height:18%;position:absolute;inset:auto 0 0}.hero-art-inner{width:100%;height:100%;transition:transform 1.3s cubic-bezier(.16,1,.3,1);transform:scale(1.06)}.hero-art img{object-fit:cover;width:100%;height:100%}.hero-entrance{animation:1s cubic-bezier(.16,1,.3,1) both enter}.hero h1.hero-entrance{animation-delay:.1s}.hero-description.hero-entrance{animation-delay:.2s}.hero-actions.hero-entrance{animation-delay:.3s}.experience{padding-top:160px;padding-bottom:140px}.section-heading{justify-content:space-between;align-items:flex-end;gap:50px;margin-bottom:56px;display:flex}.section-heading h2,.principles h2{font:450 60px/1.15 var(--display);letter-spacing:-.058em;margin-top:0}.section-heading h2 span,.principles h2 span{color:#8f8b94}.section-description{color:var(--muted);padding-bottom:4px;font-size:18px;line-height:1.8}.handoff{background:#141414;border:1px solid #292929;border-radius:14px;overflow:hidden}.handoff-controls{border-bottom:1px solid #252525;justify-content:space-between;align-items:center;gap:20px;min-height:68px;padding:16px 25px;display:flex}.stage-tabs{flex:1;grid-template-columns:repeat(3,1fr);gap:24px;display:grid}.stage-tabs button{color:#929095;text-align:left;background:0 0;border:0;flex-direction:column;align-items:stretch;gap:12px;padding:0;font-size:16px;transition:color .2s;display:flex}.stage-tabs button[aria-selected=true]{color:var(--text)}.tab-progress{background:#2c2c2c;border-radius:2px;height:2px;overflow:hidden}.tab-progress>span{background:var(--accent);transform-origin:0;height:100%;display:block;transform:scaleX(0)}.stage-tabs button[aria-selected=true] .tab-progress>span{animation:6s linear forwards progress}.is-paused .stage-tabs button[aria-selected=true] .tab-progress>span{animation-play-state:paused}.device-stage{margin:0 42px;padding:65px 0 110px;position:relative}.desktop-device{background:#111;border:1px solid #3b3b3b;border-radius:10px;width:82%;transition:opacity .8s,transform .8s cubic-bezier(.16,1,.3,1);position:relative;overflow:hidden;box-shadow:0 18px 70px #0006,0 2px 4px #0004}.connection-line{background:#36303f;width:180px;height:1px;position:absolute;bottom:92px;left:52%}.connection-line>span{background:var(--accent);opacity:0;border-radius:50%;width:5px;height:5px;display:block;position:absolute;top:-2px;left:0}.handoff[data-stage=pocket] .connection-line>span{animation:2s cubic-bezier(.4,0,.2,1) transfer}.phone-device{background:#111;border:5px solid #303033;border-radius:36px;width:240px;height:510px;transition:transform .8s cubic-bezier(.16,1,.3,1),opacity .8s;position:absolute;bottom:35px;right:18px;overflow:hidden;transform:translateY(8px);box-shadow:0 20px 55px #0009,inset 0 0 0 1px #080808}.desktop-screen{width:100%;height:auto;display:block}.screen-working{opacity:0;transition:opacity .6s;position:absolute;inset:0}.phone-screen{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.phone-answer,.phone-complete{display:none}.handoff[data-stage=desk] .phone-device{opacity:.78}.handoff[data-stage=pocket] .desktop-device{opacity:.5;transform:translateY(4px)}.handoff[data-stage=pocket] .phone-device{transform:translateY(-12px)}.handoff[data-stage=pocket] .phone-attention,.handoff[data-stage=continue] .phone-attention{display:none}.handoff[data-stage=pocket] .phone-answer,.handoff[data-stage=continue] .phone-complete{display:block}.handoff[data-stage=continue] .screen-working{opacity:1}.handoff-caption{border-top:1px solid #252525;justify-content:space-between;align-items:center;gap:25px;min-height:80px;padding:24px 32px;display:flex}.handoff-caption>p{color:#bbb;font-size:16px;line-height:1.7}.principles{padding-top:90px;padding-bottom:140px}.principles-intro{max-width:700px}.principle-list{grid-template-columns:repeat(3,1fr);gap:56px;margin-top:64px;display:grid}.principle{border-top:1px solid #303030;padding-top:32px}.principle-icon{color:#bfb7ca;width:32px;height:32px;margin-bottom:32px}.principle-icon>svg{stroke:currentColor;fill:none;stroke-width:1.25px;stroke-linecap:round;stroke-linejoin:round;width:100%;height:100%}.principle h3{letter-spacing:-.3px;margin-bottom:16px;font-size:22px;font-weight:500}.principle>p{color:#999;font-size:16px;line-height:1.75}.closing{text-align:center;padding-top:170px;padding-bottom:170px}.closing-mark{justify-content:center;margin-bottom:32px;display:flex}.closing-mark svg{width:56px;height:52px;color:var(--accent)}.closing h2{font:450 clamp(48px, 6vw, 84px)/1.12 var(--display);letter-spacing:-.065em;margin-top:0}.closing h2>span{color:#96909e}.closing-description{color:#999;margin-top:28px;font-size:18px}.closing-actions{justify-content:center;align-items:center;gap:32px;margin-top:40px;display:flex}.site-footer{border-top:1px solid #292929;justify-content:space-between;align-items:center;gap:30px;min-height:120px;display:flex}.site-footer .brand svg{width:auto;height:26px}.footer-credit{color:var(--muted);font-size:16px}.footer-credit a{color:var(--text);transition:color .2s}.footer-credit a:hover{color:var(--accent)}.will-reveal{opacity:0;transform:translateY(20px)}.reveal{transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1)}.reveal.is-visible{opacity:1;transform:none}.principle:nth-child(2){transition-delay:80ms}.principle:nth-child(3){transition-delay:.16s}@keyframes enter{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}@keyframes drift{to{transform:translate(3%,2%)rotate(4deg)scale(1.05)}}@keyframes progress{to{transform:none}}@keyframes transfer{0%{opacity:0;transform:translate(0)}15%{opacity:1}85%{opacity:1}to{opacity:0;transform:translate(175px)}}@media (width<=1050px){.section-wrap{width:calc(100% - 64px)}.site-header{grid-template-columns:1fr auto auto}.site-header nav{gap:28px}.hero h1{font-size:84px}.section-heading h2,.principles h2{font-size:50px}.device-stage{margin-inline:25px;padding-top:58px}.desktop-device{width:86%}.phone-device{width:200px;height:423px;right:0}.principle-list{gap:30px}.handoff-controls{padding-inline:20px}.stage-tabs{gap:17px}.connection-line{left:49%}}@media (width<=760px){.hero-art{width:170%;margin-top:calc(40px - 18.2vw);margin-left:-35%}:root{scroll-padding-top:24px}.section-wrap{width:calc(100% - 40px)}.site-header{gap:20px;height:79px}.brand{gap:7px}.brand svg{width:auto;height:24px}.site-header nav{display:none}.header-source{padding:9px 11px;font-size:14px}.hero{overflow:clip}.hero-copy{padding-top:48px}.hero h1{letter-spacing:-.073em;margin-top:0;font-size:clamp(48px,13vw,80px);line-height:1.13}.hero-description{margin-top:23px;font-size:17px;line-height:1.8}.hero-actions{flex-direction:column;gap:12px;margin-top:32px}.hero-actions>.button{width:min(100%,280px)}.button{gap:18px;min-height:48px;padding:13px 16px;font-size:15px}.experience{padding-top:65px;padding-bottom:70px}.section-heading{flex-direction:column;align-items:flex-start;gap:22px;margin-bottom:30px}.section-heading h2,.principles h2{margin-top:0;font-size:38px;line-height:1.2}.section-heading>.section-description{font-size:16px;line-height:1.8}.handoff{border-radius:10px}.handoff-controls{flex-wrap:wrap;gap:15px;padding:15px 13px}.stage-tabs{gap:12px}.stage-tabs button{gap:10px;font-size:14px}.device-stage{margin-inline:12px;padding:27px 0 284px}.desktop-device{border-radius:6px;width:100%}.phone-device{border-width:4px;border-radius:25px;width:159px;height:335px;bottom:33px;right:8px}.connection-line{width:100px;bottom:186px;left:17px}.handoff-caption{flex-direction:column;align-items:flex-start;gap:9px;padding:15px}.handoff-caption>p{font-size:15px;line-height:1.8}.principles{padding-top:45px;padding-bottom:65px}.principle-list{grid-template-columns:1fr;gap:30px;margin-top:37px}.principle{grid-template-columns:26px 1fr;gap:0 20px;padding-top:25px;display:grid}.principle-icon{grid-row:1/4;width:23px;height:23px;margin:0}.principle h3{margin:2px 0 10px;font-size:20px}.principle>p{font-size:15px}.closing{padding-top:100px;padding-bottom:100px}.closing-mark{margin-bottom:28px}.closing-mark svg{width:37px;height:37px}.closing h2{letter-spacing:-.065em;margin-top:20px;font-size:clamp(36px,10vw,56px);line-height:1.22}.closing-description{margin-top:22px;font-size:16px}.closing-actions{gap:24px;margin-top:27px}.site-footer{flex-wrap:wrap;gap:20px;min-height:155px;padding-top:25px;padding-bottom:25px}.footer-credit{font-size:14px}}@media (width<=370px){.section-wrap{width:calc(100% - 32px)}.stage-tabs{gap:8px}.stage-tabs button{font-size:13px}.device-stage{margin-inline:9px}.closing h2{font-size:34px}}@media (prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*,:before,:after{transition:none!important;animation:none!important}.stage-tabs button[aria-selected=true] .tab-progress>span{transform:none}.will-reveal{opacity:1;transform:none}.hero-art-inner{transform:scale(1.06)!important}}