body{background:#f7f7f7;color:#171717}.lab{padding:2.5rem 0 5rem}.lab h1{font-size:clamp(2.2rem,5vw,4rem);font-weight:900}.lab-intro{max-width:52rem;color:#666;line-height:1.7}.lab-grid{display:grid;gap:1.25rem;margin-top:2rem}.lab-card{overflow:hidden;border:1px solid #d4d4d4;border-radius:1rem;background:#fff}.lab-card h2,.lab-card>p{padding-inline:1rem}.lab-card h2{padding-top:1rem;font-size:1.2rem;font-weight:900}.lab-card>p{margin:.35rem 0 1rem;color:#666;font-size:.85rem}.lab-card [data-subnav]{position:relative;top:auto}.lab-card .zone-subnav__track{width:100%}.lab-mobile{max-width:390px}.lab-section{margin-top:3rem;padding-top:2rem;border-top:1px solid #ccc}.lab-state{display:flex;gap:1rem;flex-wrap:wrap;margin-top:1rem}.lab-state span{padding:12px 14px}.lab-state .active{border-bottom:2px solid #171717;font-weight:900}.lab-state .focus{outline:2px solid #171717;outline-offset:-3px}.lab-note{font-size:.75rem;color:#737373}.placement-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.placement-demo{border:1px solid #bbb;border-radius:.8rem;background:#fff;padding:1rem}.placement-demo span{display:block;margin:.35rem 0;padding:.55rem;border:1px dashed #aaa}.placement-demo .chosen{border:2px solid #171717;font-weight:900}.scroll-demo{max-width:390px;border:8px solid #262626;border-radius:1rem;background:#fff;overflow:hidden}.scroll-demo div{display:flex;align-items:center;height:48px;padding:0 1rem;border-bottom:1px solid #ccc}.scroll-demo .demo-header{height:64px}.scroll-demo .demo-filter{justify-content:center;font-weight:900}.scroll-demo p{min-height:150px;padding:1rem;color:#666}@media(max-width:700px){.placement-grid{grid-template-columns:1fr}}