.app[data-view="hub"] .hub11{padding-top:8px}
.reel14{width:100%;max-width:800px;margin:0 auto 24px;outline-offset:5px}
.reel-viewport14{width:100%;aspect-ratio:16/10;overflow:hidden;position:relative;border-radius:12px;background:#fbfbf7;box-shadow:0 0 0 1px #c6d2bb,0 8px 30px #263b2410}
.reel-viewport14 iframe{position:absolute;top:0;left:0;width:1080px;height:675px;max-width:none;border:0;transform-origin:top left;pointer-events:none}
.reel-controls14{display:flex;align-items:center;gap:12px;padding:10px 0 0;min-height:54px}
.reel-controls14 button{height:42px;min-height:42px;border:1px solid transparent;background:transparent;padding:8px;color:#29452f;border-radius:999px;flex:none}
.reel-controls14 button:hover:not(:disabled){background:#e1e8d9;border-color:transparent}
.reel-controls14 button:disabled{background:transparent;color:#6c7a63}
.reel-controls14 svg{height:20px;width:20px;flex:none}
.reel-controls14 .reel-toggle14{min-width:93px;justify-content:flex-start;gap:8px;font-size:14px}
.reel-controls14 input{--reel-progress:0%;appearance:none;-webkit-appearance:none;flex:1;width:0;min-width:30px;height:42px;min-height:42px;margin:0;padding:0;border:0;background:transparent;cursor:pointer;border-radius:0;touch-action:pan-y}
.reel-controls14 input::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:linear-gradient(to right,#4d6b42 var(--reel-progress),#d4ddcb var(--reel-progress))}
.reel-controls14 input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:14px;height:14px;margin-top:-5px;border-radius:50%;border:2px solid #f9fbf3;background:#29452f;box-shadow:0 0 0 1px #29452f}
.reel-controls14 input::-moz-range-track{height:4px;border-radius:4px;background:#d4ddcb}.reel-controls14 input::-moz-range-progress{height:4px;background:#4d6b42}.reel-controls14 input::-moz-range-thumb{width:12px;height:12px;border:2px solid #f9fbf3;border-radius:50%;background:#29452f}
.reel-time14{font:400 12px/18px var(--sans);font-variant-numeric:tabular-nums;white-space:nowrap;color:#4c6145}
.reel14:fullscreen{background:#f1f2ec;width:100vw;height:100dvh;max-width:none;margin:0;padding:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:auto}
.reel14:fullscreen .reel-viewport14,.reel14:fullscreen .reel-controls14{flex-shrink:0;width:min(100%,calc((100dvh - 94px)*1.6))}
@media(max-width:760px){.app[data-view="hub"] .hub11{padding-top:0}.reel14{margin-bottom:22px}.reel-viewport14{border-radius:8px}.reel-controls14{gap:7px}.reel-controls14 .reel-toggle14{min-width:76px;padding-left:0;font-size:13px}.reel-controls14 input{min-width:24px}.reel-time14{font-size:11px}.reel-controls14 .reel-expand14{width:36px;padding:6px}.reel14:fullscreen{padding:12px}.reel14:fullscreen .reel-viewport14,.reel14:fullscreen .reel-controls14{width:min(100%,calc((100dvh - 78px)*1.6))}}

/* Keep the demo entrance header quiet and compact. */
.app.app11[data-view="hub"] .appbar{height:48px;min-height:48px;padding:0 24px;align-items:center}
.app.app11[data-view="hub"] .appbar-exit11{min-height:44px}
@media(max-width:760px){.app.app11[data-view="hub"] .appbar{height:48px;min-height:48px;padding:0 12px}.app.app11[data-view="hub"] .appbar-exit11{width:44px;min-width:44px}}