.blog-demo{margin-inline:0;color:var(--site-text);overflow-wrap:normal;margin-bottom:0;line-height:1.4}.blog-demo:first-child{margin-top:0}.blog-demo p{margin:0}.blog-demo .blog-demo-code{background:var(--site-fill);color:var(--site-text);font-family:var(--site-font-mono);border-radius:6px;padding:2px 6px;font-size:13px}.blog-prose .blog-demo a.lg-button{color:revert-layer;text-decoration:none}.blog-demo-stage{background:var(--site-wallpaper) center / cover no-repeat;border-radius:22px;position:relative;overflow:hidden}.blog-demo-stage.lg-scene{background:0 0}.blog-demo-stage--scene{--blog-demo-card:min(240px, calc(100cqi - 40px));--blog-demo-drop:clamp(76px, 24cqi, 116px);height:300px;container-type:inline-size}.blog-demo-hero-card{width:var(--blog-demo-card);min-height:112px;padding:18px;position:absolute;top:20px;left:20px}.blog-demo-eyebrow{font-size:12px;font-weight:600}.blog-demo .blog-demo-headline{margin-top:6px;font-size:22px;font-weight:700;line-height:1.15}.blog-demo-drop{top:calc(300px - 20px - var(--blog-demo-drop));left:calc(100cqi - 20px - var(--blog-demo-drop));width:var(--blog-demo-drop);height:var(--blog-demo-drop);transition:top .7s var(--lg-spring), left .7s var(--lg-spring);border-radius:50%;position:absolute}.blog-demo-stage[data-merged=true] .blog-demo-drop{top:calc(20px + 112px - var(--blog-demo-drop) * .4);left:calc(20px + var(--blog-demo-card) - var(--blog-demo-drop) * .35)}.blog-demo-hero-action{position:absolute;bottom:20px;left:20px}.blog-demo-stage--native{place-items:center;min-height:300px;padding:28px 20px;display:grid}.blog-demo-native-card{border-radius:24px;gap:14px;width:min(320px,100%);padding:22px;display:grid}.blog-demo-row{justify-content:space-between;align-items:center;gap:12px;display:flex}.blog-demo-title{font-size:17px;font-weight:600}.blog-demo .blog-demo-title--large{font-size:22px}.blog-demo-muted,.blog-demo-hint{color:var(--site-text-2);font-size:14px}.blog-demo-time{font-family:var(--site-font-mono);font-variant-numeric:tabular-nums;font-size:14px}.blog-demo-stage[data-blur-target=none] :is(.lg-glass-surface,.lg-button,.lg-button *),.blog-demo-stage[data-blur-target=none] .lg-glass-surface:before{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}.blog-demo-controls{flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:16px;font-size:15px;display:flex}.blog-demo-control{align-items:center;gap:10px;display:flex}.blog-demo-control--slider{flex:200px}.blog-demo-control--slider>:last-child{flex:1}.blog-demo-readout{flex-wrap:wrap;flex-basis:100%;align-items:baseline;gap:6px 12px;display:flex}.blog-demo-renderer{font-weight:600}.blog-demo-caption{color:var(--site-text-2);margin-top:12px;font-size:14px;line-height:1.5}@media (prefers-reduced-motion:reduce){.blog-demo-drop{transition:none}}