:root{font-family:system-ui,-apple-system,"Segoe UI",sans-serif;color:#173a33;background:#f8fcfa;line-height:1.7}*{box-sizing:border-box}body{margin:0}a{color:#047857;text-underline-offset:.2em}img{max-width:100%;height:auto}button,select{font:inherit}button,select,.button{min-height:44px}button{cursor:pointer}a:focus-visible,button:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #0369a1;outline-offset:4px}.nav{padding:16px 24px;background:#fff;border-bottom:1px solid #d4e7df;display:flex;justify-content:space-between;align-items:center;gap:20px}.brand{font-size:22px;font-weight:800;text-decoration:none;display:flex;align-items:center;gap:12px}.nav nav{display:flex;gap:20px;align-items:center;flex-wrap:wrap}.language{display:flex;gap:8px;align-items:center}select{max-width:180px;border:1px solid #a5cbbd;border-radius:8px;padding:6px;background:white}main{max-width:1120px;margin:auto;padding:48px 24px}h1{font-size:clamp(30px,4.6vw,56px);line-height:1.25;overflow-wrap:anywhere;letter-spacing:-.025em}h2{font-size:clamp(21px,2.6vw,30px);line-height:1.4;overflow-wrap:anywhere}p,li,dd{overflow-wrap:anywhere}p{max-width:80ch}li{margin-block:12px}ul,ol{padding-inline-start:1.6em}.hero{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:48px;align-items:start;margin-bottom:56px}.hero>img{width:100%;box-shadow:0 18px 40px #173a3320;border-radius:14px}.eyebrow{font-weight:600;color:#047857}.actions{display:flex;align-items:center;flex-wrap:wrap;gap:20px;margin-block:24px}.button,button{display:inline-flex;align-items:center;justify-content:center;border:1px solid #047857;border-radius:9px;background:#047857;color:white;padding:10px 18px;text-decoration:none}.card{padding:28px;margin-block:24px;background:#fff;border:1px solid #d4e7df;border-radius:16px}.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}.gallery{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:24px}.gallery img{border-radius:12px;border:1px solid #d4e7df}.tutorial-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,400px);gap:32px}.tutorial-grid>img{width:100%;border:1px solid #d4e7df;border-radius:12px}.demo-actions{display:flex;flex-direction:column;align-items:stretch;gap:12px}button[aria-pressed=true]{background:#064e3b;box-shadow:0 0 0 3px #6ee7b7}button[data-demo=reset]{background:white;color:#047857}.examples{display:grid;grid-template-columns:1fr 1fr;gap:20px}.examples>div{min-width:0;background:#f0fdf4;padding:14px;border-radius:8px}dt{font-weight:700}dd{margin:6px 0;direction:ltr;text-align:start}.screenshot{border-top:1px solid #d4e7df;padding-block:16px;margin-top:20px}.screenshot summary{cursor:pointer;color:#047857;font-weight:600;min-height:44px;padding-block:8px}.screenshot img{display:block;max-width:400px;width:100%;margin:16px auto;border:1px solid #d4e7df;border-radius:8px}kbd{font:600 .9em system-ui;background:#ecfdf5;border:1px solid #b5dccd;padding:3px 6px;border-radius:5px;box-decoration-break:clone;-webkit-box-decoration-break:clone}footer{padding:32px 24px;border-top:1px solid #d4e7df;display:flex;flex-wrap:wrap;justify-content:center;gap:24px;background:white}.intro{margin-bottom:40px}[dir=rtl] .hero,[dir=rtl] .tutorial-grid{text-align:start}@media(max-width:720px){.nav{padding:12px 16px;align-items:flex-start;flex-wrap:wrap}.nav nav{gap:12px;justify-content:space-between;width:100%}main{padding:28px 16px}.hero,.tutorial-grid,.gallery,.steps,.examples{grid-template-columns:1fr;gap:20px}.hero>img{max-width:360px;margin:auto}.card{padding:20px}.steps{padding-inline-start:1.6em;gap:4px}.hero{gap:28px}.tutorial-grid>img{max-width:400px;margin:auto}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#073e32;border-radius:12px}.video-card details{margin-top:16px}.video-card summary{cursor:pointer;min-height:44px;padding-block:8px}h1{text-wrap:balance}