*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#0b121b;color:#e5edf8;font:17px/1.65 system-ui,sans-serif}a{color:#88d9cf}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #ffcf70;outline-offset:5px}header,main,footer{max-width:1120px;margin:auto;padding:24px}header{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-bottom:1px solid #304054}nav{display:flex;gap:20px;flex-wrap:wrap}.eyebrow{color:#88d9cf;text-transform:uppercase;letter-spacing:.16em;font-size:12px}h1{font-size:clamp(42px,7vw,80px);line-height:1.07;letter-spacing:-.05em;max-width:850px;margin:22px 0}h2{font-size:32px;line-height:1.2}h3{font-size:21px}p{max-width:780px}.hero{padding:55px 0}.lede{font-size:21px;color:#b8c6da}.tag{display:inline-block;font-size:12px;border:1px solid #526178;border-radius:20px;padding:3px 12px;color:#ffcf70}.actions{display:flex;gap:14px;flex-wrap:wrap;margin:28px 0}.button,button{background:#88d9cf;color:#09171a;border:0;border-radius:7px;padding:12px 18px;font:inherit;font-weight:650;cursor:pointer;text-decoration:none}.secondary{background:#1c2a3c;color:#e5edf8}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.card,.demo{background:#121e2c;border:1px solid #304054;border-radius:12px;padding:24px}section{padding:35px 0;scroll-margin-top:20px}.card p{color:#b8c6da}code{font-size:.85em;overflow-wrap:anywhere;color:#b4e8df}li{margin:10px 0}table{width:100%;border-collapse:collapse}td,th{padding:15px;text-align:left;border-bottom:1px solid #304054;vertical-align:top}.table-wrap{overflow:auto}label{display:block;margin:15px 0}input[type=range]{width:min(100%,420px)}output{display:block;font:20px/1.5 ui-monospace,monospace;color:#ffcf70;margin:20px 0}svg{width:100%;height:auto}.muted,small{color:#aebed1}.rail{border-left:3px solid #88d9cf;padding-left:20px}.steps{display:flex;gap:10px;flex-wrap:wrap}.steps span{background:#203448;padding:12px;border-radius:6px}footer{border-top:1px solid #304054;margin-top:45px;font-size:14px}@media(max-width:700px){.grid{grid-template-columns:1fr}header,main,footer{padding:18px}h2{font-size:27px}.hero{padding:30px 0}td,th{min-width:170px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}pre{max-width:100%;overflow:auto;padding:18px;background:#09111c;border-radius:7px}.grid>*{min-width:0}
