.demo-open{display:block;position:relative;width:100%;padding:0;border:0;border-radius:24px;background:none;color:#f7f7ed;cursor:zoom-in;font:inherit;text-align:left;isolation:isolate}.demo-open img{display:block;width:100%;height:auto}.demo-expand{position:absolute;right:14px;bottom:14px;width:38px;height:38px;display:grid;place-items:center;font:24px/1 var(--font);border-radius:50%;background:#c4edaa;color:#223521;box-shadow:0 4px 20px #0005;opacity:0;translate:0 8px;transition:opacity .25s,translate .35s;pointer-events:none;z-index:3}.demo-open:hover .demo-expand,.demo-open:focus-visible .demo-expand{opacity:1;translate:0 0}.landing .phone .demo-open{border-radius:30px}.landing .tour-strip .demo-open img{border-radius:22px}.demo-viewer{position:fixed;inset:0;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;overflow:hidden;background:transparent;color:#f7f7ed;font-family:var(--font);color-scheme:dark}.demo-viewer[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:12px}.demo-viewer::backdrop{background:transparent}.viewer-scrim{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 45%,#29382af5,#0b110df7 70%);backdrop-filter:blur(24px);z-index:-1}.viewer-header{display:flex;align-items:center;justify-content:space-between;padding:24px 36px 0;gap:20px}.viewer-eyebrow{font-size:10px;letter-spacing:.2em;color:#acbaa8}.viewer-count{font-size:13px;margin:8px 0 0;font-variant-numeric:tabular-nums;color:#d1e9c1}.viewer-close,.viewer-arrow{display:grid;place-items:center;width:48px;height:48px;border:1px solid #ffffff30;border-radius:50%;background:#ffffff08;color:#f5faef;cursor:pointer;transition:background .25s,transform .25s}.viewer-close{font:32px/1 var(--font)}.viewer-close:hover,.viewer-arrow:hover{background:#c4edaa;color:#203121;transform:scale(1.08)}.viewer-stage{position:relative;display:flex;justify-content:center;align-items:center;min-height:0;margin:0 90px}.viewer-image{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;aspect-ratio:auto;border-radius:18px;box-shadow:0 30px 100px #0008;user-select:none;touch-action:pan-y pinch-zoom;transform-origin:center;will-change:transform,opacity}.viewer-arrow{position:fixed;top:calc(50% - 24px);font:24px/1 var(--font);z-index:3}.viewer-prev{left:32px}.viewer-next{right:32px}.viewer-footer{padding:0 24px 22px;text-align:center}.viewer-caption{font-size:12px;line-height:1.6;max-width:660px;margin:0 auto 14px;color:#e2ebdc;text-wrap:balance}.viewer-dots{display:flex;justify-content:center;gap:2px}.viewer-dots button{position:relative;width:30px;height:28px;border:0;background:none;cursor:pointer;padding:0}.viewer-dots button:after{content:'';display:block;width:5px;height:5px;margin:auto;border-radius:9px;background:#81937b;transition:width .3s,background .3s}.viewer-dots button[aria-current=true]:after{width:23px;background:#c4edaa}.viewer-tip{display:block;font-size:9px;color:#9ead97;letter-spacing:.04em;margin-top:7px}.demo-viewer button:focus-visible{outline:2px solid #c4edaa;outline-offset:4px}
@media(max-width:699px){.demo-expand{opacity:1;translate:none;width:30px;height:30px;right:10px;bottom:10px;font-size:21px}.viewer-header{padding:16px 20px 0}.viewer-eyebrow{font-size:8px}.viewer-count{font-size:11px}.viewer-close{width:40px;height:40px}.viewer-stage{margin:0 20px}.viewer-image{max-width:calc(100vw - 40px);border-radius:14px}.viewer-arrow{width:36px;height:36px;top:auto;bottom:24px;font-size:20px}.viewer-prev{left:14px}.viewer-next{right:14px}.viewer-footer{padding:0 54px max(18px,env(safe-area-inset-bottom))}.viewer-caption{font-size:10px;margin-bottom:8px}.viewer-tip{font-size:8px}.viewer-dots button{width:24px;height:25px}.viewer-dots button[aria-current=true]:after{width:18px}}
@media(prefers-reduced-motion:reduce){.demo-viewer *, .demo-expand{transition:none!important}}
/* Keep the dialog footer independent of the public site's footer styling. */
.landing .demo-viewer .viewer-footer{padding:0 24px 22px;background:none;border:0}
.landing .demo-viewer .viewer-caption{font-size:12px;line-height:1.6;max-width:660px;margin:0 auto 14px}
@media(max-width:699px){.landing .demo-viewer .viewer-footer{padding:0 54px max(18px,env(safe-area-inset-bottom))}.landing .demo-viewer .viewer-caption{font-size:10px;max-width:100%;margin-bottom:8px}}