.demo-intro{max-width:1140px;margin:0 auto 26px;padding:26px 28px;background:#edf3e5;border:1px solid #dce6d4;border-radius:22px}.demo-intro-top{display:flex;justify-content:space-between;align-items:center;gap:22px}.demo-eyebrow{display:block;color:#617955;letter-spacing:.08em;font-size:11px;font-weight:600;margin-bottom:8px}.demo-intro h1{font-size:30px;margin:0;line-height:1.2}.demo-controls{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:22px}.demo-role{display:grid;grid-template-columns:1fr 1fr;position:relative;isolation:isolate;width:390px;max-width:100%;padding:5px;border:1px solid #d3dfca;border-radius:15px;background:#fff8}.demo-role-thumb{position:absolute;top:5px;bottom:5px;left:5px;width:calc(50% - 5px);background:#25533f;border-radius:11px;z-index:-1;box-shadow:0 3px 8px #24443519;transition:transform .22s ease}.demo-role[data-role=parent] .demo-role-thumb{transform:translateX(100%)}.demo-role button{background:transparent;border:0;border-radius:11px;padding:13px 10px;min-width:0;min-height:48px;font-size:14px;font-weight:500;color:#426049;transition:color .18s}.demo-role button[aria-checked=true]{color:white}.demo-hint{margin:17px 0 7px;max-width:740px;font-size:14px;color:#3d5d43}.demo-disclaimer{font-size:12px;color:#6c7d64;margin:0}.demo-controls>.link-button{background:transparent;border-color:#d3dfca}.demo-intro-top>.button{white-space:nowrap}body[data-demo=true] .site-header #install{display:none!important}@media(max-width:1199px){.demo-intro{margin-left:30px;margin-right:30px}}@media(max-width:700px){.demo-intro{margin:0 16px 20px;padding:21px 18px;border-radius:19px}.demo-intro-top{align-items:flex-start;flex-direction:column;gap:15px}.demo-intro h1{font-size:26px}.demo-intro-top>.button{font-size:12px;padding:10px 14px;min-height:40px}.demo-controls{gap:10px;margin-top:19px}.demo-role{width:100%}.demo-role button{font-size:12px;padding:12px 6px;min-height:46px}.demo-controls>.link-button{font-size:12px;min-height:36px;padding:8px 12px}.demo-hint{font-size:13px}.demo-disclaimer{font-size:11px}}@media(prefers-reduced-motion:reduce){.demo-role-thumb,.demo-role button{transition:none}}