.demo-palpite{position:absolute;z-index:5;inset:4% 4% 28%;display:flex;align-items:center;pointer-events:none;container-type:inline-size;text-align:left;font:400 1rem/1.5 Inter,system-ui,sans-serif}
.demo-palpite[hidden]{display:none!important}
.demo-palpite *,.demo-palpite *::before,.demo-palpite *::after{box-sizing:border-box;border-width:0;border-style:solid}
.demo-palpite p{margin:0}
.demo-palpite button{margin:0;font:inherit;background:transparent;text-transform:none;cursor:pointer}
.demo-palpite svg{display:block;vertical-align:middle;flex-shrink:0}
.demo-palpite [data-palpite-panel]{max-height:100%;overflow-y:auto;overscroll-behavior:contain;pointer-events:auto;scrollbar-width:thin}
.demo-palpite :is(button):focus-visible,.demo-transport:focus-visible{outline:3px solid #7dd3fc;outline-offset:2px}
.demo-transport{position:absolute;z-index:3;inset:0;width:100%;height:100%;border:0;border-radius:inherit;background:transparent;color:inherit;cursor:pointer}
.demo-player-surface{cursor:default!important}
.demo-player-surface .cl-hero-player-console{pointer-events:none}
.demo-player-surface:has(.demo-palpite:not([hidden])) .cl-hero-cover-copy{visibility:hidden}
.demo-player-surface:has(.demo-palpite:not([hidden])) .cl-hero-transcript{display:none!important}
.demo-transport:focus-visible{outline-offset:-4px}
.demo-palpite-inline{position:relative;inset:auto;margin-top:1rem;max-height:24rem}
/* Same card and type sizes as /app. Only its placement adapts to the cover. */
@container(max-width:360px){
  .demo-palpite [data-palpite-header]{display:grid;grid-template-columns:minmax(0,1fr) auto}
  .demo-palpite [data-palpite-reward]{grid-row:2;grid-column:1/-1}
}
@media(max-width:639px){
  .demo-player-surface .cl-player-viewport{min-height:var(--demo-palpite-stage-height,0px)}
  .demo-player-surface .cl-player-viewport:has(.demo-palpite:not([hidden]))>img,.demo-player-surface .cl-player-viewport[data-palpite-stage]>img{position:absolute;inset:0;height:100%!important;aspect-ratio:auto!important;object-fit:cover}
  .demo-player-surface .demo-palpite:not([hidden]){position:relative;inset:auto;display:block;margin:1.2rem .7rem 7.5rem;max-height:none}
  .demo-player-surface .demo-palpite [data-palpite-panel]{max-height:none;overflow:visible}
}
@media(prefers-reduced-motion:reduce){.demo-palpite .animate-slide-up,.demo-palpite .animate-pulse{animation:none}}