html{background:var(--board)}body{background:var(--board);min-height:100vh;color:var(--ink);font:14px/20px var(--typeface-regular)}html.show-grid body{background-image:linear-gradient(to bottom, var(--grid-major) 1px, transparent 1px), linear-gradient(to right, var(--grid-major) 1px, transparent 1px), linear-gradient(to bottom, var(--grid-minor) 1px, transparent 1px), linear-gradient(to right, var(--grid-minor) 1px, transparent 1px);background-size:80px 80px,80px 80px,20px 20px,20px 20px}.strong{font-family:var(--typeface-medium)}.muted{color:var(--ink-muted)}.small{font-size:12px}.page{width:1120px;margin-left:max(20px,round(down,50% - 560px,20px))}.topbar{align-items:flex-end;gap:40px;height:40px;font-size:12px;display:flex}.topbar .sample{background:var(--raised);color:var(--ink-muted);margin-left:auto;padding:0 8px}.layout{grid-template-columns:600px 420px;align-items:start;gap:100px;display:grid}.hero{padding-top:80px}h1{font:40px/40px var(--typeface-medium);letter-spacing:-.03em;margin:0 0 20px}.lead{max-width:560px;margin:0;font-size:15px}.open{grid-template-columns:120px 1fr;gap:20px;margin-top:40px;display:grid}.qr{background:var(--surface);width:120px;height:120px;color:var(--ink)}.qr svg{display:block}.open-text{grid-auto-rows:min-content;align-content:start;display:grid}.app-link{color:var(--ink);text-underline-offset:4px}.block{background:var(--surface);margin-top:40px;padding:40px}h2{font:15px/20px var(--typeface-medium);margin:0 0 20px;display:flex}.num{width:20px;color:var(--ink-muted);flex:none}h3{font:14px/20px var(--typeface-medium);margin:40px 0 20px}.block p{margin:0 0 20px}.block p:last-child{margin-bottom:0}.steps{counter-reset:step;margin:0 0 20px;padding:0;list-style:none}.steps li{padding-left:20px;position:relative}.steps li:before{content:"–";color:var(--ink-muted);position:absolute;left:0}.steps.numbered li:before{counter-increment:step;content:counter(step)}.steps:last-child{margin-bottom:0}.lang-switch{align-items:center;height:40px;display:flex}.lang-switch .muted{width:160px;font-size:12px}.lang-switch button{background:var(--raised);width:100px;height:40px}.lang-switch button.on{background:var(--ink);color:var(--on-ink)}.facts{grid-template-columns:repeat(3,160px);gap:20px;display:grid}.facts>div{grid-auto-rows:min-content;font-size:12px;display:grid}.fact{font:32px/40px var(--typeface-medium);color:var(--ink)}code{font:12px/20px ui-monospace,SFMono-Regular,Menlo,monospace}.code{background:var(--raised);margin:0 0 20px;padding:20px;overflow-x:auto}.zoom-figure{margin:0 0 20px}.zoom{background:var(--board);width:520px;height:240px;position:relative;overflow:hidden}.zoom grid-line-chart{transform-origin:0 0;width:130px;transform:scale(4)}.zoom canvas{image-rendering:pixelated;pointer-events:none}figcaption{font-size:12px}.compare{border-collapse:collapse;width:100%;margin:0 0 20px}.compare th,.compare td{text-align:left;vertical-align:middle;height:40px;box-shadow:inset 0 1px 0 var(--line);padding:0 20px 0 0}.compare th{font:12px/20px var(--typeface-regular);color:var(--ink-muted);box-shadow:none}.compare td:first-child{width:45%}.options{gap:20px;display:grid}.option{box-shadow:inset 0 0 0 1px var(--line);padding:20px}.option p{margin:0}.foot{max-width:520px;margin:40px 0 80px;font-size:12px}.device-column{padding-top:80px;position:sticky;top:20px}.device{width:420px;height:calc(var(--device-height,840px) + 40px);box-shadow:0 0 0 1px var(--line-strong);background:#0b0b0c;border-radius:60px;padding:20px 15px}.device ws-app{width:390px;height:var(--device-height,840px);border-radius:44px}.device-link{text-align:center;height:40px;color:var(--ink);text-underline-offset:4px;line-height:40px;display:block}@media (width<=1159px){.page{width:auto;margin:0 20px}.layout{grid-template-columns:minmax(0,600px)}.device-column,.qr,.lang-switch,.topbar .muted{display:none}.hero{padding-top:40px}h1{font-size:32px}.open{grid-template-columns:1fr}.app-link{background:var(--ink);height:40px;color:var(--on-ink);font-family:var(--typeface-medium);justify-content:center;align-items:center;margin:20px 0;text-decoration:none;display:flex}.block{padding:20px}.facts{grid-template-columns:1fr}.zoom{width:100%}.compare td:first-child{width:auto}}