.blog-overlay-modes-demo__frame{position:relative}.blog-overlay-modes-demo__frame .home-overlay-demo{border-radius:0;min-height:360px}.blog-overlay-modes-demo__frame--expanded .home-overlay-demo{min-height:360px}.blog-overlay-modes-demo__frame .home-overlay-demo__overlay-position{inset:auto 14px 14px auto}.blog-overlay-modes-demo__frame .home-overlay-demo__overlay-slot{width:420px;min-height:0}.blog-overlay-modes-demo__frame .home-overlay-demo__overlay-slot--passive{width:auto;min-height:48px}.blog-overlay-modes-demo__frame .home-overlay-demo__scale{align-items:flex-end;width:100%}.blog-overlay-modes-demo__frame .home-overlay-demo .overlay{margin-left:auto}.blog-overlay-modes-demo__frame .home-overlay-demo--blog{background-color:#fafafa;background-position:100% 100%;background-repeat:no-repeat;background-size:auto}.blog-overlay-modes-demo__frame .home-overlay-demo--blog:before{content:"";z-index:0;pointer-events:none;background:linear-gradient(90deg,#fafafad1 0%,#fafafa85 48%,#fafafa38 100%);position:absolute;inset:0}.blog-overlay-modes-demo__frame .home-overlay-demo--blog .home-overlay-demo__stage{z-index:1}@media (prefers-color-scheme:dark){.blog-overlay-modes-demo__frame .home-overlay-demo--blog{background-color:#0a0a0a}.blog-overlay-modes-demo__frame .home-overlay-demo--blog:before{background:linear-gradient(90deg,#0a0a0ad1 0%,#0a0a0a85 48%,#0a0a0a38 100%)}}.blog-overlay-modes-demo__frame .overlay--readonly{pointer-events:none}
.blog-reposition-demo__frame .home-overlay-demo{height:300px;min-height:300px}.blog-reposition-demo__frame .home-overlay-demo--blog{background-color:#fafafa;background-position:100% 100%;background-repeat:no-repeat;background-size:auto}.blog-reposition-demo__frame .home-overlay-demo--blog:before{content:"";z-index:0;pointer-events:none;background:linear-gradient(90deg,#fafafad1 0%,#fafafa85 48%,#fafafa38 100%);position:absolute;inset:0}.blog-reposition-demo__frame .home-overlay-demo--blog .home-overlay-demo__stage{z-index:1}@media (prefers-color-scheme:dark){.blog-reposition-demo__frame .home-overlay-demo--blog{background-color:#0a0a0a}.blog-reposition-demo__frame .home-overlay-demo--blog:before{background:linear-gradient(90deg,#0a0a0ad1 0%,#0a0a0a85 48%,#0a0a0a38 100%)}}.blog-reposition-demo__frame .home-overlay-demo__stage{cursor:default;overflow:hidden}.blog-reposition-demo__float{touch-action:none;opacity:1;width:420px;max-width:calc(100% - 28px);transition:opacity .45s;position:absolute;bottom:14px;right:14px}.blog-reposition-demo__float--hidden{opacity:0;pointer-events:none}.blog-reposition-demo__float--animated{transition:opacity .45s,transform 1s ease-in-out}.blog-reposition-demo__float .overlay__frame{position:relative}.blog-reposition-demo__reposition-hint{white-space:nowrap;opacity:1;visibility:visible;transition:opacity .15s,visibility .15s;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%)}.blog-reposition-demo__reposition-hint--hidden{opacity:0;visibility:hidden}.blog-reposition-demo__float .overlay--repositioning{cursor:default}.blog-reposition-demo__cursor{z-index:5;pointer-events:none;background:#fffffff2;border:2px solid #171717;border-radius:9999px;width:14px;height:14px;transition:left .45s,top .45s,transform .12s;position:absolute;transform:translate(-20%,-20%);box-shadow:0 1px 3px #0000002e}.blog-reposition-demo__cursor--pressing{transform:translate(-20%,-20%)scale(.82)}.blog-reposition-demo__icon-press{transform:scale(.92)}.blog-reposition-demo__frame .overlay--readonly{pointer-events:none}
.blog-send-pic-demo__frame .home-overlay-demo{height:300px;min-height:300px}.blog-send-pic-demo__frame .home-overlay-demo--blog{background-color:#fafafa;background-position:100% 100%;background-repeat:no-repeat;background-size:auto}.blog-send-pic-demo__frame .home-overlay-demo--blog:before{content:"";z-index:0;pointer-events:none;background:linear-gradient(90deg,#fafafad1 0%,#fafafa85 48%,#fafafa38 100%);position:absolute;inset:0}.blog-send-pic-demo__frame .home-overlay-demo--blog .home-overlay-demo__stage{z-index:1}@media (prefers-color-scheme:dark){.blog-send-pic-demo__frame .home-overlay-demo--blog{background-color:#0a0a0a}.blog-send-pic-demo__frame .home-overlay-demo--blog:before{background:linear-gradient(90deg,#0a0a0ad1 0%,#0a0a0a85 48%,#0a0a0a38 100%)}}.blog-send-pic-demo__frame .home-overlay-demo__overlay-position{inset:auto 14px 14px auto}.blog-send-pic-demo__frame .home-overlay-demo__overlay-slot{width:420px;height:auto;min-height:0}.blog-send-pic-demo__frame .home-overlay-demo__scale{flex:none;align-items:flex-end;width:100%;height:auto}.blog-send-pic-demo__frame .home-overlay-demo .overlay{margin-left:auto}.blog-send-pic-demo__frame .home-overlay-demo__stage{cursor:default;overflow:hidden}.blog-send-pic-demo__cursor{z-index:5;pointer-events:none;background:#fffffff2;border:2px solid #171717;border-radius:9999px;width:14px;height:14px;transition:left .45s,top .45s,transform .12s;position:absolute;transform:translate(-20%,-20%);box-shadow:0 1px 3px #0000002e}.blog-send-pic-demo__cursor--pressing{transform:translate(-20%,-20%)scale(.82)}.blog-send-pic-demo__frame .overlay--readonly{pointer-events:none}.blog-send-pic-demo__frame .home-overlay-demo .overlay__frame{height:auto}.blog-send-pic-demo__frame .home-overlay-demo .overlay__panel{flex:none;height:auto;max-height:none}.blog-send-pic-demo__frame .home-overlay-demo .overlay__content{flex:none;min-height:0}