.demo-card{left:calc(var(--gr-screen-inset-x) * 2 + var(--gr-screen-left) + var(--gr-safe-left));box-sizing:border-box;width:var(--gr-demo-width);padding:var(--gr-demo-pad);border-radius:var(--gr-screen-card-radius);background:linear-gradient(to bottom, var(--gr-demo-gold-top), var(--gr-demo-gold-bottom));box-shadow:var(--gr-demo-shadow);color:var(--gr-demo-ink);font-family:var(--gr-font);transform-origin:0 100%;position:fixed}html.gr-phone .demo-card{left:calc(var(--gr-screen-inset-x) + var(--gr-safe-left));right:calc(var(--gr-screen-inset-x) + var(--gr-safe-right));margin-bottom:var(--gr-demo-gap-above-sheet);transition:opacity var(--gr-screen-sheet-ms) var(--gr-ease);flex-wrap:wrap;justify-content:space-between;align-items:center;display:flex}.demo-card[data-aside]{opacity:0;pointer-events:none}.demo-mark{margin:0 0 var(--gr-demo-mark-gap);color:var(--gr-demo-ink-muted);font-size:var(--gr-demo-mark);font-weight:var(--gr-weight-strong);letter-spacing:var(--gr-demo-mark-tracking)}html.gr-phone .demo-mark{flex:1 0 100%}.demo-card[data-line] .demo-mark{color:var(--gr-demo-ink);font-size:var(--gr-demo-line);letter-spacing:0}.demo-title{margin:0 0 var(--gr-demo-title-gap);font-size:var(--gr-demo-title);font-weight:var(--gr-weight-strong);line-height:var(--gr-demo-title-line)}html.gr-phone .demo-title{margin:0 var(--gr-demo-title-space) var(--gr-demo-title-gap) 0;flex:1}.demo-action{box-sizing:border-box;min-height:var(--gr-demo-action-height);padding:var(--gr-demo-action-pad);border-radius:calc(var(--gr-demo-action-height) / 2);background:var(--gr-demo-action-fill);color:var(--gr-demo-action-ink);font:inherit;font-size:var(--gr-demo-action-text);font-weight:var(--gr-weight-strong);cursor:pointer;border:0;justify-content:center;align-items:center;text-decoration:none;display:inline-flex}.demo-action:disabled{border:var(--gr-rule-width) solid var(--gr-demo-action-line);color:var(--gr-demo-ink-muted);cursor:default;background:0 0}.demo-action:focus,.demo-close:focus{outline:var(--gr-focus-width) solid var(--gr-focus);outline-offset:var(--gr-focus-offset)}@media (prefers-reduced-motion:no-preference){.demo-card[data-pulse]{animation:demo-pulse var(--gr-demo-pulse-ms) var(--gr-ease)}.demo-card[data-line] .demo-mark{animation:demo-line var(--gr-demo-line-ms) var(--gr-ease)}}@keyframes demo-pulse{30%{transform:scale(var(--gr-demo-pulse-scale));box-shadow:var(--gr-demo-pulse)}}@keyframes demo-line{0%{opacity:0}}.demo-close{box-sizing:border-box;width:var(--gr-screen-full-size);height:var(--gr-screen-full-size);margin-left:var(--gr-screen-head-gap);border:var(--gr-rule-width) solid var(--gr-screen-head-rule);border-radius:var(--gr-screen-full-radius);background:var(--gr-screen-full-fill);color:var(--gr-screen-ink);cursor:pointer;pointer-events:auto;flex:none;justify-content:center;align-items:center;padding:0;display:flex}.demo-close svg{width:var(--gr-demo-close-icon);height:var(--gr-demo-close-icon);fill:none;stroke:currentColor;stroke-width:var(--gr-demo-close-stroke);stroke-linecap:round}