/* In brief film: scoped styles */
.rb-film{position:relative;left:50%;transform:translateX(-50%);width:min(1080px,calc(100vw - 32px));margin:8px 0 34px;display:grid;gap:14px;font-family:'Inter',system-ui,sans-serif}
.rb-film .screen{position:relative;aspect-ratio:16/9;width:100%;border:1px solid var(--hair,#ddd8ca);border-radius:10px;overflow:hidden;background:#f3efe6}
.rb-film canvas{display:block;width:100%;height:100%}
.rb-film .overlay{position:absolute;inset:0;display:grid;place-items:center;background:rgba(243,239,230,.35);border:0;margin:0;padding:0;cursor:pointer;color:#1a1a17;font:inherit}
.rb-film .overlay[hidden]{display:none}
.rb-film .inner{display:grid;justify-items:center;gap:12px}
.rb-film .disc{width:clamp(54px,8vw,78px);height:clamp(54px,8vw,78px);border-radius:50%;background:#1a1a17;display:grid;place-items:center;transition:transform .25s ease}
.rb-film .disc svg{width:34%;height:34%;margin-left:8%}
.rb-film .overlay:hover .disc,.rb-film .overlay:focus-visible .disc{transform:scale(1.08)}
.rb-film .overlay:focus-visible{outline:2px solid #1a1a17;outline-offset:-5px}
.rb-film .label{font-size:12.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase}
.rb-film .controls{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.rb-film .ctl{display:inline-flex;align-items:center;gap:8px;background:transparent;color:var(--ink,#1a1a17);border:1px solid var(--hair,#ddd8ca);border-radius:8px;padding:8px 13px;font:500 13px 'Inter',system-ui,sans-serif;cursor:pointer}
.rb-film .ctl:hover{border-color:var(--quiet,#55524a)}
.rb-film .ctl svg{width:10px;height:10px}
.rb-film #scrub{flex:1 1 200px;min-width:0;accent-color:var(--ink,#1a1a17)}
.rb-film .time{font-size:13px;font-weight:500;font-variant-numeric:tabular-nums;color:var(--quiet,#55524a)}
.rb-film .screen:fullscreen{border:0;border-radius:0;background:#f3efe6}
.rb-film .screen:fullscreen canvas{object-fit:contain}
.rb-film .screen:-webkit-full-screen{border:0;border-radius:0;background:#f3efe6}
.rb-film .screen:-webkit-full-screen canvas{object-fit:contain}
@media (max-width:560px){.rb-film .label{display:none}.rb-film .controls{gap:8px}.rb-film .ctl{padding:9px 12px}.rb-film #scrub{order:5;flex-basis:100%}}