.gdemo-card{border:1px solid var(--color-hairline);background:var(--color-surface);border-radius:1rem;position:relative;overflow:hidden;box-shadow:0 30px 60px #00000073,0 8px 18px #0000004d;container-type:inline-size}.gdemo-card>*{transition:opacity .15s}.gdemo-card.is-moving>*{opacity:0}.gdemo-chrome{background:var(--color-surface-raised);border-bottom:1px solid var(--color-hairline);flex:none;align-items:center;gap:.875rem;height:2.5rem;padding:0 .875rem;display:flex}.gdemo-dots{gap:.375rem;display:flex}.gdemo-dots i{background:#3d465a;border-radius:50%;width:.625rem;height:.625rem}.gdemo-url{background:var(--color-rich-black);min-width:0;max-width:20rem;height:1.5rem;color:var(--color-cadet-gray);white-space:nowrap;border-radius:.375rem;flex:1;justify-content:center;align-items:center;gap:.375rem;margin:0 auto;font-size:.75rem;display:flex;overflow:hidden}.gdemo-spacer{flex:none;width:2.625rem}.gdemo-screen{--gdemo-reserved:972px;height:var(--gdemo-content,var(--gdemo-reserved));min-height:26rem;position:relative;overflow:hidden}@container (max-width:481px){.gdemo-screen{--gdemo-reserved:1160px}}@container (max-width:401px){.gdemo-screen{--gdemo-reserved:1150px}}@container (max-width:310px){.gdemo-screen{--gdemo-reserved:1256px}}@media (min-width:1024px){.gdemo-screen{height:38.75rem}.gdemo-card[data-fit] .gdemo-screen{height:clamp(20rem,100vh - 23.5rem,38.75rem)}}.gdemo-frame{background:var(--color-surface);opacity:0;border:0;width:100%;height:100%;transition:opacity .4s;position:absolute;top:0;left:0}.gdemo-frame.is-loaded{opacity:1}@keyframes gdemoBreathe{50%{opacity:.45}}.gdemo-loading{flex-direction:column;padding:.625rem;transition:opacity .4s;display:flex;position:absolute;inset:0;overflow:hidden}.gdemo-loading.is-done{opacity:0}.gdemo-loading i,.gdemo-loading b{background:var(--color-surface-raised);flex:none;animation:1.6s ease-in-out infinite gdemoBreathe;display:block}.gdemo-loading.is-done i,.gdemo-loading.is-done b{animation:none}.gdemo-loading-steps{flex:none;justify-content:space-around;align-items:flex-start;height:2.875rem;display:flex}.gdemo-loading-steps i{border-radius:50%;width:2rem;height:2rem}.gdemo-loading-title{border-radius:.5rem;align-self:center;width:60%;height:2.75rem;margin-top:1.5rem}.gdemo-loading-group{border:1px solid var(--color-hairline);border-radius:.75rem;flex:none;margin-top:1.5rem;padding:1rem}.gdemo-loading-title+.gdemo-loading-group{margin-top:.75rem}.gdemo-loading-group b{border-radius:.375rem;width:9rem;height:1.125rem;margin-bottom:1.4375rem}.gdemo-loading-group div{grid-template-columns:repeat(4,1fr);gap:.75rem;display:grid}.gdemo-loading-group i{border-radius:.5rem;height:5.1875rem}.gdemo-loading-group:last-of-type i{animation-delay:.2s}.gdemo-loading-action{border-radius:.5rem;height:2.5rem;margin-top:.625rem}.gdemo-loading-group+.gdemo-loading-action{margin-top:1.4375rem}@container (max-width:481px){.gdemo-loading-group div{grid-template-columns:repeat(3,1fr)}}@container (max-width:401px){.gdemo-loading-group div{grid-template-columns:repeat(2,1fr)}.gdemo-loading-group i{height:4.25rem}}@container (max-width:310px){.gdemo-loading-group i{height:5.1875rem}}.gdemo-backdrop{z-index:90;opacity:0;background:#080b12f7;transition:opacity .35s;position:fixed;inset:0}.gdemo-toolbar{z-index:96;opacity:0;align-items:center;gap:.75rem;height:4.5rem;padding:0 1.25rem;transition:opacity .3s,transform .3s;display:flex;position:fixed;top:0;left:0;right:0;transform:translateY(-.5rem)}.gdemo-backdrop.is-shown{opacity:1}.gdemo-toolbar.is-shown{opacity:1;transform:none}.gdemo-seg{border:1px solid var(--color-hairline);background:var(--color-surface);border-radius:.75rem;gap:.125rem;padding:.25rem;display:inline-flex}.gdemo-seg button,.gdemo-tool{min-height:2.75rem;color:var(--color-cadet-gray);cursor:pointer;border-radius:.5rem;justify-content:center;align-items:center;gap:.5rem;padding:0 .875rem;font-size:.875rem;font-weight:600;transition:background-color .2s,color .2s;display:inline-flex}.gdemo-seg button:hover,.gdemo-tool:hover{color:var(--color-ghost-white)}.gdemo-seg button[aria-selected=true]{background:var(--color-surface-raised);color:var(--color-ghost-white);box-shadow:inset 0 0 0 1px var(--color-field-edge)}.gdemo-tool{border:1px solid var(--color-hairline);background:var(--color-surface)}.gdemo-card[data-expanded]{z-index:95;flex-direction:column;margin:0;display:flex;position:fixed}.gdemo-card.is-animating{transition:top .42s cubic-bezier(.2,.8,.2,1),left .42s cubic-bezier(.2,.8,.2,1),width .42s cubic-bezier(.2,.8,.2,1),height .42s cubic-bezier(.2,.8,.2,1),border-radius .42s,padding .42s}.gdemo-card[data-expanded] .gdemo-screen{flex:auto;height:auto;min-height:0}.gdemo-status{display:none}.gdemo-card[data-kind=phone]{background:#0b0e15;border-color:#3a4252;border-radius:3.25rem;padding:.6875rem}.gdemo-card[data-kind=phone] .gdemo-chrome,.gdemo-card[data-kind=bare] .gdemo-chrome{display:none}.gdemo-card[data-kind=phone] .gdemo-status{background:var(--color-rich-black);height:2.875rem;color:var(--color-ghost-white);border-radius:2.625rem 2.625rem 0 0;flex:none;justify-content:space-between;align-items:center;padding:0 1.875rem 0 2.125rem;font-size:.9375rem;font-weight:600;display:flex;position:relative}.gdemo-island{background:#000;border-radius:.875rem;width:6rem;height:1.625rem;margin-left:-3rem;position:absolute;top:.6875rem;left:50%}.gdemo-icons{align-items:center;gap:.375rem;display:flex}.gdemo-icons svg{width:auto;height:.75rem}.gdemo-card[data-kind=phone] .gdemo-screen{border-radius:0 0 2.625rem 2.625rem}.gdemo-card[data-kind=bare]{box-shadow:none;border:0;border-radius:0}@media (prefers-reduced-motion:reduce){.gdemo-loading i,.gdemo-loading b{animation:none}.gdemo-loading,.gdemo-frame,.gdemo-card>*,.gdemo-backdrop,.gdemo-toolbar,.gdemo-card.is-animating{transition:none}}