.demo-timeline{display:flex;gap:clamp(14px,2.6vw,32px);width:100%;list-style:none;margin:0;padding:0 0 20px;color:#aaa9a5;font-family:Switzer,system-ui,sans-serif;-webkit-user-select:none;user-select:none;pointer-events:none}.demo-timeline__chapter{flex-basis:0;min-width:0}.demo-timeline__body{display:block;width:100%;margin:0;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:left;-webkit-appearance:none;appearance:none}.demo-timeline.is-switchable .demo-timeline__body{pointer-events:auto;cursor:pointer}.demo-timeline.is-switchable .demo-timeline__body:hover .demo-timeline__label,.demo-timeline.is-switchable .demo-timeline__body:focus-visible .demo-timeline__label{color:#f0eee6}.demo-timeline.is-switchable .demo-timeline__body:hover .demo-timeline__track,.demo-timeline.is-switchable .demo-timeline__body:focus-visible .demo-timeline__track{background:#4b4b45}.demo-timeline__body:focus-visible{outline:2px solid #d97757;outline-offset:5px;border-radius:4px}.demo-timeline__mark{width:15px;height:15px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.demo-timeline__heading{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:11px;line-height:1.25}.demo-timeline__label{display:inline-flex;align-items:center;gap:7px;min-width:0;font-size:16px;font-weight:500;letter-spacing:-.015em;white-space:nowrap;transition:color .16s ease-out}.demo-timeline__duration{font-size:12px;font-weight:400;font-variant-numeric:tabular-nums;white-space:nowrap}.demo-timeline__track{display:block;height:3px;overflow:hidden;border-radius:2px;background:#33332f}.demo-timeline__fill{display:block;height:100%;width:100%;background:#d97757;transform:scaleX(0);transform-origin:left center}.demo-timeline__chapter[data-state=active] .demo-timeline__label{color:#f0eee6}.demo-timeline__chapter[data-state=complete] .demo-timeline__fill{background:#b0aaa0}video.demo-film{pointer-events:none;cursor:default;user-select:none;-webkit-user-select:none}video.demo-film::-webkit-media-controls{display:none!important}@media(max-width:600px){.demo-timeline{gap:14px;padding-bottom:14px}.demo-timeline__heading{gap:5px;margin-bottom:9px}.demo-timeline__label{font-size:12px;gap:5px}.demo-timeline__duration{font-size:10px}.demo-timeline__mark{width:12px;height:12px}}@media(max-width:390px){.demo-timeline__heading{flex-direction:column;align-items:flex-start;gap:3px}}@media(prefers-reduced-motion:reduce){.demo-timeline__label{transition:none}}.product-film.is-walkthrough [data-story-toggle]{display:none}.demo-reel{--reel-row: 34px;display:flex;flex-direction:column;align-items:center;gap:14px;padding:0 0 22px;font-family:Switzer,system-ui,sans-serif;-webkit-user-select:none;user-select:none}.demo-reel__window{position:relative;height:calc(var(--reel-row) * 3);width:100%;overflow:hidden;-webkit-mask:linear-gradient(transparent,#000 30%,#000 70%,transparent);mask:linear-gradient(transparent,#000 30%,#000 70%,transparent)}.demo-reel__strip{list-style:none;margin:0;padding:0;will-change:transform}.demo-reel__strip.is-rolling{transition:transform .82s cubic-bezier(.3,1.45,.45,1),filter .82s ease-out;animation:demo-reel-blur .82s ease-out}@keyframes demo-reel-blur{0%{filter:blur(0)}25%{filter:blur(1.4px)}70%{filter:blur(0)}}.demo-reel__row{height:var(--reel-row);display:flex;align-items:center;justify-content:center}.demo-reel__label{display:inline-flex;align-items:center;gap:8px;margin:0;padding:0 6px;border:0;background:none;color:#f0eee6;opacity:.32;font:500 16px/1 Switzer,system-ui,sans-serif;letter-spacing:-.015em;white-space:nowrap;cursor:pointer;transition:opacity .3s ease-out,color .3s ease-out,font-size .3s ease-out}.demo-reel__label:hover{opacity:.6}.demo-reel__label:focus-visible{outline:2px solid #d97757;outline-offset:4px;border-radius:4px}.demo-reel__row.is-current .demo-reel__label{opacity:1;color:#e04444;font-size:22px;font-weight:600}.demo-reel__label .demo-timeline__mark{width:1em;height:1em}.demo-reel__track{display:block;width:280px;max-width:70%;height:3px;overflow:hidden;border-radius:2px;background:#33332f}.demo-reel__fill{display:block;height:100%;width:100%;background:#e04444;transform:scaleX(0);transform-origin:left center}.product-hero .demo-reel{display:none}.demo-frame{position:relative}.demo-next{position:absolute;top:18px;right:18px;z-index:2;display:inline-flex;align-items:center;gap:6px;padding:9px 12px 9px 16px;border:1px solid rgba(255,255,255,.22);border-radius:999px;background:#0c0c0e9e;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;font:600 14px/1 Switzer,system-ui,sans-serif;cursor:pointer;transition:background .2s,transform .2s}.demo-next svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}.demo-next:hover{background:#e04444eb;border-color:transparent}.demo-next:hover svg{transform:translate(2px)}.demo-next:active{transform:scale(.96)}.demo-next:focus-visible{outline:2px solid #d97757;outline-offset:3px}.product-hero .demo-next{display:none}@media(max-width:600px){.demo-reel{--reel-row: 28px;gap:10px;padding-bottom:16px}.demo-reel__label{font-size:13px}.demo-reel__row.is-current .demo-reel__label{font-size:18px}.demo-reel__track{width:200px}.demo-next{top:10px;right:10px;padding:7px 9px 7px 12px;font-size:12px}.demo-next svg{width:13px;height:13px}}@media(prefers-reduced-motion:reduce){.demo-reel__strip.is-rolling{transition:none;animation:none}.demo-reel__label{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/14/assets/film-playback.css.map */