@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;src:url('assets/inter-regular.ttf') format('truetype')}
@font-face{font-family:Inter;font-style:normal;font-weight:500;font-display:swap;src:url('assets/inter-medium.ttf') format('truetype')}
@font-face{font-family:Inter;font-style:normal;font-weight:600;font-display:swap;src:url('assets/inter-semibold.ttf') format('truetype')}
:root{--blue:#06a0ff;--ink:#1a171b;--paper:#fafafa;--line:#d8d8db}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Inter',Arial,sans-serif;-webkit-font-smoothing:antialiased}.page{max-width:1800px;margin:auto;padding:30px 48px 22px;min-height:100svh;display:flex;flex-direction:column}.mono{font:10px/1.65 'Inter',Arial,sans-serif;letter-spacing:.075em}.blue{color:var(--blue)}header{display:flex;align-items:center;justify-content:space-between;padding-bottom:27px;border-bottom:1px solid var(--ink)}.brand{display:block}.brand img{display:block;width:auto;height:46px}.header-note{margin-left:auto;margin-right:10vw}.status{display:flex;align-items:center;gap:9px}.status i{background:var(--blue);width:6px;height:6px;border-radius:50%;box-shadow:0 0 0 4px #06a0ff15}main{flex:1;display:flex;flex-direction:column}.eyebrow{padding-top:22px;display:flex;justify-content:space-between}.tiny-cross{font-size:20px;line-height:1}.hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:center;gap:2vw;flex:1;min-height:490px;padding:38px 0 54px}.headline{position:relative;z-index:1}h1{font-size:clamp(60px,7.9vw,142px);font-weight:600;line-height:.99;letter-spacing:-.075em;margin:0 0 32px;white-space:normal}.dot{color:var(--ink)}p{font-size:17px;line-height:1.5;letter-spacing:-.025em;margin:0 0 30px}.contact{display:inline-flex;gap:52px;align-items:center;font-size:15px;font-weight:500;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--ink);padding:0 0 9px;transition:color .2s,gap .2s}.contact span[aria-hidden]{color:var(--blue);font-size:25px;line-height:1}.contact:hover{color:var(--blue);gap:62px}.visual{height:440px;position:relative;background:radial-gradient(ellipse at center,#06a0ff07,transparent 65%);overflow:hidden}.visual:before{content:'';position:absolute;inset:30px;background-image:linear-gradient(#06a0ff0b 1px,transparent 1px),linear-gradient(90deg,#06a0ff0b 1px,transparent 1px);background-size:36px 36px;mask-image:radial-gradient(ellipse,#000,transparent 70%)}canvas{width:100%;height:100%;display:block}.visual-label{position:absolute;top:12px;left:15px;color:#747477}.visual-bottom{position:absolute;bottom:12px;left:15px;right:15px;display:flex;justify-content:space-between;color:#747477}.visual-bottom button{border:0;background:none;color:var(--blue);font:inherit;cursor:pointer;padding:0}.corner{width:8px;height:8px;position:absolute;border-color:#a6a6aa;border-style:solid}.tl{top:0;left:0;border-width:1px 0 0 1px}.tr{top:0;right:0;border-width:1px 1px 0 0}.bl{bottom:0;left:0;border-width:0 0 1px 1px}.br{bottom:0;right:0;border-width:0 1px 1px 0}.lower{display:grid;grid-template-columns:1fr 2fr 1fr;border-top:1px solid var(--line);padding:25px 0 32px;align-items:start}.state{display:flex;gap:15px;font-size:16px;line-height:1.5;letter-spacing:-.03em}.state small{font-size:13px;color:#777}.spinner{color:var(--blue);font-size:30px;line-height:1.3;animation:turn 16s linear infinite}.build{text-align:right;color:#777}footer{display:flex;justify-content:space-between;gap:15px;padding-top:17px;border-top:1px solid var(--ink)}footer a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible{outline:2px solid var(--blue);outline-offset:6px}footer a:hover{color:var(--blue)}@keyframes turn{to{transform:rotate(360deg)}}@media(min-width:1500px){.hero{min-height:650px}.visual{height:570px}}@media(max-width:1000px){.page{padding:24px}.header-note{display:none}.hero{grid-template-columns:minmax(0,1fr);padding-top:42px;gap:28px}h1{font-size:clamp(56px,12vw,96px)}.visual{height:360px}.lower{grid-template-columns:1fr 2fr;gap:15px}.build{display:none}footer{flex-wrap:wrap}footer>span:last-child{display:none}}@media(max-width:420px){.page{padding:20px}.brand img{width:auto;height:46px}.status{font-size:8px;letter-spacing:0}h1{font-size:13vw}.visual{height:310px}.lower{grid-template-columns:1fr}.state{font-size:15px}footer{font-size:9px}footer .mono{font-size:9px}}@media(prefers-reduced-motion:reduce){.spinner{animation:none}*{scroll-behavior:auto}}

canvas{cursor:grab;touch-action:none}canvas.dragging{cursor:grabbing;touch-action:none}

/* Decorative layers must not intercept interaction with the canvas. */
.visual::before,.visual-label,.corner{pointer-events:none}
.visual-bottom{pointer-events:none}
.visual-bottom button{pointer-events:auto}

canvas,canvas:focus,canvas:focus-visible{outline:none!important}

.hero-links{display:flex;gap:24px;width:460px;max-width:100%}
.hero-links .contact{flex:1;min-width:0;justify-content:space-between;gap:12px;white-space:normal}
.hero-links .contact:hover{gap:12px}
.touch-help{display:none}
@media(pointer:coarse){.desktop-help{display:none}.touch-help{display:inline}.visual-bottom button{min-height:44px;min-width:60px}.visual-bottom{align-items:center}}
@media(max-width:420px){.hero-links{gap:16px}.hero-links .contact{font-size:12px}.hero-links .contact span[aria-hidden]{font-size:21px}}

/* Keep grid children within the viewport, including mobile text resizing. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
main,.hero,.headline,.visual{min-width:0;max-width:100%}
.visual{width:100%}
.hero-links{width:100%;max-width:460px}
.hero-links .contact{flex:1 1 0;white-space:normal;overflow-wrap:anywhere}
.hero-links .contact>span[aria-hidden]{flex:0 0 auto}
canvas{max-width:100%}

/* Constrain every layout track; canvas bitmap dimensions never size its parent. */
.page{width:100%;min-width:0}
.hero{width:100%}
.headline h1{max-width:100%;overflow-wrap:anywhere}
.visual canvas{position:absolute;inset:0;width:100%;height:100%;min-width:0}
.hero-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;max-width:460px}
.hero-links .contact{width:100%;max-width:100%;min-width:0}
.link-label{min-width:0;overflow-wrap:anywhere}
header,footer,.lower{min-width:0;max-width:100%}
footer{flex-wrap:wrap}
footer>*{min-width:0;overflow-wrap:anywhere}
.lower{grid-template-columns:minmax(0,1fr) minmax(0,2fr) minmax(0,1fr)}
@media(max-width:1000px){.lower{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}}
@media(max-width:420px){.lower{grid-template-columns:minmax(0,1fr)}}