:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#e9eff9;background:#070b13;font-family:Inter,ui-sans-serif,system-ui,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(circle at 80% -20%,#18345a,#0000 40rem),#070b13;min-width:320px;margin:0}a{color:inherit}.site-header,main,footer{width:min(1120px,100% - 2rem);margin:auto}.site-header{border-bottom:1px solid #263449;justify-content:space-between;align-items:center;gap:1rem;min-height:72px;display:flex}.wordmark{letter-spacing:-.06em;font-size:1.35rem;font-weight:750;text-decoration:none}nav{gap:1.2rem;display:flex}nav a{color:#a9bad0;text-decoration:none}nav a[aria-current=page],nav a:hover{color:#f3f7ff}@media (width<=480px){.site-header{flex-wrap:wrap;padding-block:1rem}nav{flex-wrap:wrap;gap:.55rem;font-size:.9rem}}.hero{max-width:800px;padding:clamp(5rem,16vw,11rem) 0 6rem}.eyebrow{color:#7ed6cc;letter-spacing:.12em;text-transform:uppercase;font-size:.75rem;font-weight:750}h1{letter-spacing:-.065em;margin:.4rem 0 1.2rem;font-size:clamp(2.7rem,7vw,5.4rem);line-height:.95}h2{letter-spacing:-.035em;font-size:1.7rem}h3{margin-top:0}.lede,.demo-copy p{color:#b9c7da;max-width:660px;font-size:1.15rem;line-height:1.65}.actions{flex-wrap:wrap;gap:.7rem;margin-top:2rem;display:flex}.button{border:1px solid #476184;border-radius:999px;padding:.65rem 1rem;text-decoration:none}.button.primary{color:#052521;background:#7ed6cc;border-color:#7ed6cc;font-weight:700}.principles,.packages{border-top:1px solid #263449;padding:3.5rem 0}.card-grid,.package-grid{grid-template-columns:repeat(3,1fr);gap:1rem;display:grid}.card-grid article,.package-grid a{background:#0d1522aa;border:1px solid #263449;border-radius:.7rem;padding:1.25rem}.card-grid p,.package-grid span{color:#a9bad0;line-height:1.5}.package-grid{grid-template-columns:repeat(2,1fr)}.package-grid a{gap:.5rem;text-decoration:none;display:grid}.package-grid a:hover{border-color:#7ed6cc}code{color:#98e6de}.demo-page{grid-template-columns:minmax(260px,.8fr) minmax(0,1.2fr);align-items:stretch;gap:2rem;min-height:calc(100vh - 150px);padding:4rem 0;display:grid}.demo-page h1{font-size:clamp(2.5rem,5vw,4.4rem)}.hint{color:#7ed6cc!important;font-size:.9rem!important}.molecule-canvas{touch-action:none;background:#09101d;border:1px solid #2f486a;border-radius:1rem;min-height:540px;position:relative;overflow:hidden}.molecule-canvas canvas{touch-action:none;width:100%;height:100%;display:block}.molecule-canvas p{color:#a9bad0;position:absolute;inset:auto 1rem 1rem}footer{color:#71829a;border-top:1px solid #263449;padding:2rem 0;font-size:.9rem}.demo-assertion{color:#b7c8db;font-size:.92rem!important}.demo-links{flex-wrap:wrap;gap:.35rem .7rem;margin-top:1.4rem;display:flex}.demo-links a{color:#8ccef7;font-size:.83rem}.demo-links a[aria-current=page]{color:inherit;text-decoration-thickness:2px}.timeline-control{color:#b9c7da;align-items:center;gap:.55rem;display:flex}fieldset.timeline-control{flex-wrap:wrap;min-width:0}.measure-readout{font-variant-numeric:tabular-nums;flex-direction:column;align-items:flex-start;gap:.2rem}.measure-readout p{margin:0}.timeline-control input{accent-color:#7ed6cc}.timeline-control output{font-variant-numeric:tabular-nums}.timeline-control button{color:#e2edf7;cursor:pointer;background:#16283d;border:1px solid #45627f;border-radius:.4rem;padding:.35rem .65rem}.timeline-control button:hover{border-color:#7ed6cc}.timeline-control button:focus-visible{outline-offset:2px;outline:2px solid #7ed6cc}.demo-source{background:#09101d;border:1px solid #2f486a;border-radius:1rem;grid-column:1/-1;padding:.8rem 1rem;position:relative}.demo-source summary{cursor:pointer;color:#b9c7da}.demo-source button{color:#e2edf7;cursor:pointer;background:#16283d;border:1px solid #45627f;border-radius:.4rem;padding:.3rem .65rem;position:absolute;top:.6rem;right:1rem}.demo-source:not([open]) button{display:none}.demo-source pre{max-height:32rem;margin:.8rem 0 0;font-size:.82rem;line-height:1.45;overflow:auto}@media (width<=720px){.card-grid,.package-grid,.demo-page{grid-template-columns:1fr}.molecule-canvas{min-height:400px}}.dual-range{vertical-align:middle;width:9rem;height:1.2rem;display:inline-block;position:relative}.dual-range input{pointer-events:none;background:0 0;width:100%;margin:0;position:absolute;inset:0}.dual-range input::-webkit-slider-thumb{pointer-events:auto}.dual-range input::-moz-range-thumb{pointer-events:auto}.dual-range input+input::-webkit-slider-runnable-track{background:0 0}