.page{max-width:960px;margin:0 auto;padding:32px 16px 64px}.page-header{justify-content:space-between;align-items:flex-start;display:flex}.github-link{color:#6d645d;padding:4px;transition:color .2s}.github-link:hover{color:#955f3b}.eyebrow{letter-spacing:.08em;text-transform:uppercase;color:#955f3b;margin:0 0 8px;font:12px/1.2 SF Mono,ui-monospace,monospace}h1{margin:0;font:700 34px/1.08 Georgia,Times New Roman,serif}.intro{color:#6d645d;max-width:62ch;margin:10px 0 0;line-height:1.5}.intro a{color:#955f3b;text-decoration:underline}.intro code{background:#955f3b14;border-radius:4px;padding:1px 5px;font-size:.9em}.examples-grid{grid-template-columns:repeat(3,1fr);gap:24px;margin-top:32px;display:grid}.example-card{background:#faf8f6;border:1px solid #e8e2db;border-radius:17px;transition:box-shadow .2s,border-color .2s;overflow:hidden}.example-card:hover{border-color:#d8cec3;box-shadow:0 4px 16px #00000014}.example-header{padding:16px 16px 12px}.example-title{color:#201b18;margin:0 0 4px;font:600 16px/1.3 Helvetica Neue,Helvetica,Arial,sans-serif}.example-description{color:#6d645d;margin:0;font:400 13px/1.4 Helvetica Neue,Helvetica,Arial,sans-serif}.example-preview{background:#faf8f6;overflow:hidden}.example-preview iframe,.example-preview>div{width:100%;height:100%}@media (max-width:900px){.examples-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:600px){.page{padding-top:22px}.examples-grid{grid-template-columns:1fr;gap:16px}.example-title{font-size:15px}.example-description{font-size:12px}}