.demo-shortcuts{margin:14px 0;border:1px solid #4d3869;border-radius:10px;background:#0b102080}.demo-shortcuts>summary{padding:13px 15px;cursor:pointer;font:600 14px/1.4 Arial,sans-serif;color:#d8c2f4}.demo-shortcuts .p3-demo-nav{margin:8px 12px 12px}.demo-shortcuts>summary:focus-visible{outline:2px solid #d7b2ff;outline-offset:-3px}.c04-demo-container{margin:32px auto!important}.c04-demo-container>summary{padding:16px!important}.c04-demo-container[open]>summary{border-bottom:1px solid #4d3869}.demo-home-hint{font:600 14px/1.5 Arial,sans-serif;color:#d8baff;margin:12px 0}.p3-demo .hs-clip{position:relative}.p3-demo[data-home-view=true] .hs-clip{aspect-ratio:2304/1440}.demo-home-layer{position:absolute;inset:0;z-index:2}.demo-home-layer[hidden]{display:none}.p3-demo button.demo-home-spot{position:absolute;min-height:0!important;padding:0!important;border:2px solid #d2a36735!important;border-radius:14px;background:transparent!important;cursor:pointer;max-width:none;transition:box-shadow .2s,border-color .2s}.p3-demo button.demo-home-spot:hover,.p3-demo button.demo-home-spot:focus-visible{border-color:#e3b5ff!important;box-shadow:inset 0 0 22px #b67aff40,0 0 15px #b67aff75;outline:2px solid #fff;outline-offset:2px}.demo-home-pointer{position:absolute;left:7%;top:39.7%;width:32px;height:40px;pointer-events:none;z-index:4;filter:drop-shadow(0 3px 7px #000a);animation:demo-pointer-move 3s ease-in-out infinite}.demo-home-pointer:after{content:'';position:absolute;left:-8px;top:-10px;width:32px;height:32px;border:2px solid #efc6ff;border-radius:50%;animation:demo-pointer-ring 3s ease-out infinite}.demo-home-pointer[hidden]{display:none}.demo-home-pointer svg{width:100%;height:100%}.demo-finger{display:none}.p3-demo [data-demo-back]:disabled{opacity:.55;cursor:default}@keyframes demo-pointer-move{0%,12%{transform:translate(28px,16px);opacity:0}25%,50%{transform:translate(0,0);opacity:1}56%{transform:translate(0,0) scale(.82);opacity:1}65%,83%{transform:translate(0,0);opacity:1}100%{transform:translate(0,0);opacity:0}}@keyframes demo-pointer-ring{0%,50%{opacity:0;transform:scale(.4)}56%{opacity:1;transform:scale(.6)}80%,100%{opacity:0;transform:scale(1.7)}}@media(pointer:coarse){.demo-mouse{display:none}.demo-finger{display:block}.demo-home-pointer{width:27px;height:34px}.demo-home-spot.secondary{display:none}}@media(prefers-reduced-motion:reduce){.demo-home-pointer{animation:none;transform:none}.demo-home-pointer:after{display:none}.demo-home-spot{transition:none!important}}
.demo-image-back{position:absolute;z-index:12;border:0;background:transparent;cursor:pointer;border-radius:6px;padding:0}.demo-image-back[hidden]{display:none}.demo-image-back:hover,.demo-image-back:focus-visible{outline:2px solid #efc18a;background:#efc18a22}

.demo-theme-controls{display:flex;gap:8px;margin:10px 0}.demo-theme-controls button{cursor:pointer;padding:8px 14px;border:1px solid #8b728e;border-radius:20px;background:#171522;color:#eee}.demo-theme-controls button[aria-pressed=true]{border-color:#efc18a;color:#efc18a}.demo-theme-spot{position:absolute;z-index:13;background:transparent;border:0;border-radius:8px;cursor:pointer}.demo-theme-spot[hidden]{display:none}.demo-theme-spot:hover,.demo-theme-spot:focus-visible{outline:2px solid #efc18a}

/* Screenshot hotspots must not inherit ordinary demo button styling. */
.p3-demo button.demo-image-back,.p3-demo button.demo-theme-spot{min-height:0!important;min-width:0!important;max-width:none!important;padding:0!important;margin:0!important;border:0!important;background:transparent!important;box-shadow:none!important;appearance:none!important;-webkit-appearance:none!important;line-height:0!important;color:transparent!important}
.p3-demo button.demo-image-back:hover,.p3-demo button.demo-theme-spot:hover{background:transparent!important;outline:none!important}
.p3-demo button.demo-image-back:focus-visible,.p3-demo button.demo-theme-spot:focus-visible{outline:2px solid #efc18a!important;outline-offset:0!important}
.p3-demo .demo-theme-controls button[aria-pressed=true]{color:#201607!important;background:#f4cb82!important;border-color:#f4cb82!important;opacity:1!important}
body.demo-in-view #floating-cta,body.demo-in-view #p3fab-pill{visibility:hidden!important;pointer-events:none!important}