.vbf-film{isolation:isolate;background:#eee;border-radius:20px;width:100%;position:relative}.vbf-portrait{aspect-ratio:9/16}.vbf-landscape{aspect-ratio:16/9}.vbf-surface,.vbf-stage{width:100%;height:100%}.vbf-stage{background:#181818;border-radius:20px;position:relative;overflow:hidden}.vbf-stage video{object-fit:contain;width:100%;height:100%;display:block}.vbf-stage .vbf-poster{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.vbf-glass{color:#fff;-webkit-backdrop-filter:blur(28px)saturate(140%);backdrop-filter:blur(28px)saturate(140%);cursor:pointer;background:#2a282694;border:1px solid #ffffff42;border-radius:999px;justify-content:center;align-items:center;width:30px;height:30px;padding:8px;display:flex}.vbf-glass svg{flex-shrink:0;width:14px;height:14px}.vbf-glass:hover{background:#464441b3}.vbf-glass:focus-visible,.vbf-controls input:focus-visible{outline-offset:3px;outline:2px solid #fa6b1b}.vbf-start{width:42px;height:42px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.vbf-start svg{width:17px;height:17px}.vbf-controls{color:#fff;background:linear-gradient(#0000,#0009);padding:24px 10px 8px;position:absolute;bottom:0;left:0;right:0}.vbf-control-row{align-items:center;gap:6px;display:flex}.vbf-time{font:400 10px var(--font-poppins),sans-serif;white-space:nowrap;margin-right:auto}.vbf-controls input{appearance:none;cursor:pointer;background:0 0;border:0;width:100%;height:22px;margin:2px 0 0;padding:0;display:block}.vbf-error{background:#222d;border-radius:10px;padding:10px;position:absolute;top:12px;left:12px;right:12px;color:#fff!important;font-size:12px!important}.vbf-film:has(.vbf-expanded){isolation:auto}.vbf-expanded{z-index:1000;background:#000a;justify-content:center;align-items:center;width:auto;height:auto;padding:64px 24px 24px;display:flex;position:fixed;inset:0}.vbf-expanded .vbf-stage{aspect-ratio:16/9;width:min(1200px,94vw);height:auto;max-height:calc(100dvh - 100px)}.vbf-portrait .vbf-expanded .vbf-stage{aspect-ratio:9/16;width:min(90vw,56.25dvh - 56.25px)}.vbf-expanded video{max-height:calc(100dvh - 100px)}.vbf-close{width:32px;height:32px;position:absolute;top:16px;right:20px}.vbf-film:has(.vbf-expanded){z-index:1000}@media (max-width:650px){.vbf-stage,.vbf-film{border-radius:16px}.vbf-controls{padding:20px 6px 6px}.vbf-controls .vbf-glass{width:28px;height:28px;padding:7px}.vbf-control-row{flex-wrap:nowrap;gap:3px}.vbf-time{font-size:9px}.vbf-expanded{padding-inline:12px}}.portfolio-chapter:has(.vbf-expanded){isolation:auto;z-index:1000}.portfolio-feature .project-card:has(.vbf-expanded){z-index:1000;overflow:visible}.portfolio-feature .vbf-film{aspect-ratio:1}.portfolio-feature .project-card:has(.vbf-film) .project-caption{pointer-events:none}.portfolio-feature .project-card:has(.vbf-controls) .project-caption{display:none}.portfolio-feature:has(.vbf-expanded){z-index:1000;position:relative;opacity:1!important;transform:none!important}@media (max-width:650px){.vbf-surface:not(.vbf-expanded) .vbf-duration{display:none}}.vbf-controls input::-webkit-slider-runnable-track{background:linear-gradient(to right,#fff var(--played),#fff5 var(--played));border-radius:999px;height:2px}.vbf-controls input::-webkit-slider-thumb{appearance:none;background:#fff;border:0;border-radius:50%;width:6px;height:6px;margin-top:-2px}.vbf-controls input::-moz-range-track{background:#fff5;border:0;border-radius:999px;height:2px}.vbf-controls input::-moz-range-progress{background:#fff;border-radius:999px;height:2px}.vbf-controls input::-moz-range-thumb{background:#fff;border:0;border-radius:50%;width:6px;height:6px}.vbf-quality{width:62px;min-width:0;height:28px;font:400 10px var(--font-poppins),sans-serif;appearance:auto;padding:2px 5px}.vbf-quality option{color:#fff;background:#333}@media (max-width:650px){.vbf-controls .vbf-quality{width:57px;height:26px;padding:2px;font-size:9px}}.vbf-stage{container-type:inline-size}.vbf-time{color:#fff;pointer-events:none;font-variant-numeric:tabular-nums;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#25232180;border-radius:999px;margin:0;padding:4px 7px;position:absolute;top:10px;left:10px}.vbf-control-row{flex-wrap:nowrap;justify-content:flex-end}.vbf-control-row>button:first-child{margin-right:auto}.vbf-control-row>.vbf-glass{box-sizing:border-box;flex-shrink:0}.vbf-controls .vbf-quality{appearance:none;color:#fff;-webkit-text-fill-color:#fff;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;text-align:left;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='m1 1 4 4 4-4' fill='none' stroke='white' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:right 8px center;background-repeat:no-repeat;background-size:9px 6px;width:68px;height:30px;padding:0 21px 0 9px;font-size:10px;line-height:normal;display:block}.vbf-quality:focus-visible{outline-offset:3px;outline:2px solid #fa6b1b}@container (max-width:190px){.vbf-controls{padding:20px 6px 6px}.vbf-control-row{gap:2px}.vbf-controls .vbf-glass{width:24px;height:28px;padding:6px}.vbf-controls .vbf-glass svg{width:11px;height:11px}.vbf-controls .vbf-quality{background-position:right 5px center;background-size:7px 5px;width:54px;height:28px;padding:0 15px 0 6px;font-size:9px}.vbf-time{font-size:9px;top:8px;left:8px}}@container (max-width:140px){.vbf-controls{padding-inline:4px}.vbf-control-row{gap:1px}.vbf-controls .vbf-glass{width:20px;padding:4px}.vbf-controls .vbf-quality{width:49px;padding-left:4px}}.vbf-loading{z-index:3;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fff;text-align:center;pointer-events:none;background:#2228;border-radius:16px;width:140px;padding:14px 18px;font-size:12px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.vbf-loading-track{background:#ffffff35;border-radius:2px;height:2px;margin-top:10px;display:block;overflow:hidden}.vbf-loading-track:after{content:"";background:#fff;width:40%;height:100%;animation:1.3s ease-in-out infinite vbf-loading-slide;display:block}@keyframes vbf-loading-slide{0%{transform:translate(-100%)}to{transform:translate(350%)}}@media (prefers-reduced-motion:reduce){.vbf-loading-track:after{opacity:.6;width:100%;animation:none}}