.demo-reel{display:flex;flex-direction:column;height:100%;text-align:left}.demo-reel__tablist{position:relative;display:flex;flex:0 0 auto;gap:6px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}.demo-reel__chip{min-width:-moz-fit-content;min-width:fit-content;flex-shrink:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;border-radius:6px;padding:8px 12px;text-align:left;cursor:pointer;background:var(--app-grey-100,#f9fafb);transition:background-color .3s ease}.demo-reel__chip:hover,.demo-reel__chip[data-active=true]{background:var(--app-grey-200,#f4f6f8)}.demo-reel__chip:focus-visible{outline:2px solid var(--app-color-primary-main,#13537c);outline-offset:2px}.demo-reel__chip-label{display:block;white-space:nowrap;font-size:11px;line-height:1.4;letter-spacing:.02em;text-transform:uppercase;color:var(--app-color-text-secondary,#637381);transition:color .3s ease}.demo-reel__chip:hover .demo-reel__chip-label,.demo-reel__chip[data-active=true] .demo-reel__chip-label{color:var(--app-color-text-primary,#212b36)}.demo-reel__chip-track{display:block;overflow:hidden;width:100%;height:2px;margin-top:6px;border-radius:999px;background:var(--app-color-divider,rgba(145,158,171,.2))}.demo-reel__chip-fill{display:block;width:100%;height:100%;transform:scaleX(0);transform-origin:left center;background:var(--app-color-text-primary,#212b36)}.demo-reel__hint{flex:0 0 auto;height:20px;margin:2px 0 4px;text-align:right;font-size:11px;line-height:18px;color:var(--app-color-text-secondary,#637381)}.demo-reel__stage{position:relative;flex:1 1 auto;min-height:0}.demo-reel__slot{width:100%;height:100%}.demo-reel__slot[data-active=true]{animation:appdemo-reel-slot-in .32s both}@keyframes appdemo-reel-slot-in{0%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion:reduce){.demo-reel__slot[data-active=true]{animation:none}.demo-reel__chip,.demo-reel__chip-label{transition-duration:.01ms}}