@font-face{font-family:Space;src:url(SpaceGrotesk-Regular.ttf) format("truetype");font-display:swap}
:root{color-scheme:dark;--ink:#1b1c1a;--chalk:#ecebdd;--mint:#95baa8}
*{box-sizing:border-box}
html{background:var(--ink)}
body{margin:0;color:var(--chalk);font-family:Space,Arial,sans-serif;-webkit-font-smoothing:antialiased}
button,a{-webkit-tap-highlight-color:transparent}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.landing{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr);place-items:center;min-height:100svh;overflow:hidden;padding-bottom:50px;background:radial-gradient(ellipse at 57% 35%,#282d27 0,#1b1e1a 48%,#171a17 100%)}
.hero{position:relative;width:min(1120px,94vw,calc(177.778svh - 177.778px));aspect-ratio:800/450}
.mark-button{display:block;width:100%;height:100%;padding:0;border:0;background:none;color:inherit;cursor:pointer;touch-action:manipulation}
.mark-button:disabled{cursor:default}
.mark{display:block;width:100%;height:auto;overflow:visible;stroke-linecap:butt;stroke-linejoin:round;pointer-events:none}
.face{opacity:.98}
.light{display:none}
.js .face{animation:draw 1.8s cubic-bezier(.4,0,.2,1) both}
.js .light{display:block;animation:trace 11s linear infinite}
.mark-button:focus-visible{outline:none}
.mark-button:focus-visible .face{stroke:var(--mint);stroke-width:4}
.connect{position:absolute;left:50%;bottom:max(20px,env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;align-items:center;gap:9px;min-height:44px;padding:10px 14px;color:var(--chalk);text-decoration:none;font-size:12px;letter-spacing:.02em}
.connect span{color:var(--mint);font-size:16px;transition:transform .25s}
.connect:hover span{transform:translate(2px,-2px)}
.connect:hover{color:var(--mint)}
.connect:focus-visible{outline:2px solid var(--mint);outline-offset:3px}
.paused .light{animation-play-state:paused}
.settled .face{animation:none}
@keyframes draw{from{stroke-dasharray:1;stroke-dashoffset:1}to{stroke-dasharray:1;stroke-dashoffset:0}}
@keyframes trace{0%,68%{stroke-dashoffset:1;opacity:0}70%{opacity:.9}93%{opacity:.9}99%,100%{stroke-dashoffset:0;opacity:0}}
@media(max-width:700px){.hero{width:min(148vw,calc(177.778svh - 177.778px));max-width:810px}.landing{padding-bottom:40px}.connect{bottom:max(16px,env(safe-area-inset-bottom))}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.light{display:none!important}}
.reduced *,.reduced *:before,.reduced *:after{animation:none!important;transition:none!important}.reduced .light{display:none}