:root{color-scheme:dark;font:100%/1.55 system-ui,sans-serif;background:#081512;color:#eff9f4}*{box-sizing:border-box}body{margin:0}a{color:inherit}a:focus-visible,select:focus-visible{outline:3px solid #ffc277;outline-offset:5px}header{display:flex;align-items:center;flex-wrap:wrap;gap:1rem 2rem;padding:1rem max(5vw,1rem);border-bottom:1px solid #32564c;background:#0b1e18}header>a:first-child{font-weight:800;text-decoration:none}header select{margin-inline-start:auto;max-width:100%;padding:.4rem}main{max-width:81rem;margin:auto;padding:clamp(1rem,5vw,5rem)}h1,h2,p{margin:0}h1{font-size:clamp(2rem,5.5vw,4.4rem);line-height:1.08;overflow-wrap:anywhere}h2{font-size:clamp(1.15rem,2vw,1.65rem);line-height:1.25}p{margin-top:.7rem;color:#c1d8cf;max-width:52ch}.intro,.hero{margin-bottom:2rem}.intro{padding:clamp(1rem,5vw,4rem) 0}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));gap:1.25rem}.tile,.hero,.example{background:#112a23;border:1px solid #365b50;border-radius:1.25rem;overflow:hidden}.tile{display:block;text-decoration:none}.tile:hover{border-color:#82e3c5}.tile div,.example,.hero>div{padding:clamp(1.1rem,3vw,2.5rem)}img{display:block;width:100%;height:auto;object-fit:cover;aspect-ratio:800/540}.hero{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,24rem),1fr));align-items:center}.actions{display:flex;flex-wrap:wrap;align-items:center;gap:.85rem;margin-top:1.5rem}.cta,.badge{display:inline-block;border-radius:.6rem;padding:.65rem 1rem;background:#89e9c9;color:#0a241b;font-weight:750;text-decoration:none}.badge{background:#ffc277}.secondary{padding:.6rem}.example dl{max-width:45rem;margin-bottom:0}.example dl div{display:flex;justify-content:space-between;gap:1rem;padding:.7rem 0;border-bottom:1px solid #41665a}.example dd{margin:0;white-space:nowrap}

/* Fictional walkthroughs and unreleased app teasers. */
.walkthrough,.coming{margin-block:2rem;padding:clamp(1rem,3vw,2rem);border:1px solid #365b50;border-radius:1.25rem;background:#0d211b}
.demo-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr));gap:1rem;margin:1.4rem 0 0;padding:0;list-style:none;counter-reset:walk}
.demo-steps li{counter-increment:walk;min-width:0;padding:.9rem;border:1px solid #41665a;border-radius:1rem;background:#132e25}
.demo-steps strong{display:flex;gap:.5rem;align-items:baseline;overflow-wrap:anywhere}
.demo-steps strong::before{content:counter(walk,decimal-leading-zero);color:#ffc277;font-size:.8em}
.demo-scene{display:flex;min-height:7.8rem;align-items:center;justify-content:center;gap:.85rem;padding:.75rem;margin-block-end:.75rem;border-radius:.75rem;background:radial-gradient(ellipse at 35% 30%,#275b4b,#091c16 78%)}
.demo-icon{display:grid;place-items:center;width:3.75rem;aspect-ratio:1;border-radius:.8rem;background:#285847;color:#a7f6db;flex:none}
.demo-icon svg{width:60%;height:60%}
.demo-shapes{display:grid;gap:.4rem;max-width:5rem;width:100%}
.demo-shapes i{display:block;background:#91d9bf;height:.3rem;border-radius:.3rem}
.demo-shapes.file i:last-child{width:65%}
.demo-shapes.cards i{height:1rem;border:1px solid #64a78f;background:#173d31}
.demo-shapes.cards i:first-child,.demo-shapes.ticks i:nth-child(2){background:#ffc277}
.demo-shapes.levels,.demo-shapes.wave{grid-auto-flow:column;align-items:end;height:3rem}
.demo-shapes.wave{align-items:center}
.demo-shapes.levels i,.demo-shapes.wave i{height:26%}
.demo-shapes.levels i:nth-child(2),.demo-shapes.wave i:nth-child(4){height:45%}
.demo-shapes.levels i:nth-child(3),.demo-shapes.wave i:nth-child(2){height:68%}
.demo-shapes.levels i:last-child,.demo-shapes.wave i:nth-child(3){height:100%;background:#ffc277}
.demo-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,11rem),1fr));gap:.75rem;margin:1.25rem 0 0}
.demo-metrics>div{min-width:0;border:1px solid #41665a;border-radius:.75rem;padding:.75rem}
.demo-metrics dd{margin:0;font-size:1.3rem;font-weight:750}
.demo-track{display:block;height:.5rem;border-radius:1rem;background:#2d4d43;margin-block-start:.5rem}
.demo-track i{display:block;width:var(--bar);height:100%;border-radius:inherit;background:#89e9c9}
.demo-metrics>div:last-child .demo-track i{background:#ffc277}
.coming .grid{margin-block-start:1.25rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr))}
.teaser-art{display:grid;place-items:center;min-height:8rem;aspect-ratio:800/540;background:radial-gradient(circle at 50% 35%,#2d5849,#10221b 70%);color:#a8cbbc}
.teaser-art svg{width:24%;max-width:5rem;filter:drop-shadow(0 .3rem .6rem #071511)}