.portfolio-video{isolation:isolate;color:#fff;background:#151617;border-radius:6px;width:100%;position:relative;overflow:hidden}.portfolio-video video{object-fit:contain;width:100%;height:100%;display:block}.portfolio-video__surface{border-radius:inherit;width:100%;height:100%;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;place-items:center;display:grid;position:absolute;inset:0}.portfolio-video__main-action{background:#000000ad;border-radius:50%;place-items:center;width:56px;height:56px;display:grid;box-shadow:0 0 0 1px #fff3}.portfolio-video__tools{z-index:2;background:#000000c2;border-radius:6px;align-items:center;gap:2px;max-width:calc(100% - 24px);padding:2px;display:flex;position:absolute;bottom:12px;right:12px}.portfolio-video__main-action,.portfolio-video__tools{opacity:0;transition:opacity .15s}.portfolio-video__tools{pointer-events:none}.portfolio-video[data-controls=visible] .portfolio-video__main-action,.portfolio-video[data-controls=visible] .portfolio-video__tools{opacity:1}.portfolio-video:has(:focus-visible) .portfolio-video__main-action{opacity:1}.portfolio-video:has(:focus-visible) .portfolio-video__tools{opacity:1}.portfolio-video[data-controls=visible] .portfolio-video__tools{pointer-events:auto}.portfolio-video:has(:focus-visible) .portfolio-video__tools{pointer-events:auto}@media (hover:hover){.portfolio-video:hover .portfolio-video__main-action,.portfolio-video:hover .portfolio-video__tools{opacity:1}.portfolio-video:hover .portfolio-video__tools{pointer-events:auto}}.portfolio-video__icon{width:44px;height:44px;color:inherit;cursor:pointer;background:0 0;border:0;border-radius:4px;flex:0 0 44px;place-items:center;display:grid}.portfolio-video__icon:hover{background:#ffffff29}.portfolio-video button:focus-visible{outline-offset:-4px;outline:2px solid #fff}.portfolio-video__seek{align-items:center;width:108px;min-width:48px;height:44px;display:flex}.portfolio-video__seek-popover{background:#000000d1;border-radius:6px;align-items:center;gap:4px;padding:0 8px 0 16px;display:flex;position:absolute;bottom:calc(100% + 8px);right:0}.portfolio-video__seek input{accent-color:#fff;cursor:pointer;width:100%;margin:0}.portfolio-video__seek input:focus-visible{outline-offset:4px;outline:2px solid #fff}.portfolio-video__time{font-variant-numeric:tabular-nums;white-space:nowrap;padding:0 8px;font:400 11px/1.4 system-ui,sans-serif}.portfolio-video__message{text-align:center;pointer-events:none;font-size:14px;position:absolute;inset:24px 16px auto}.portfolio-video__loading{pointer-events:none;border:2px solid #fff6;border-top-color:#fff;border-radius:50%;width:16px;height:16px;animation:.8s linear infinite video-spin;position:absolute;top:16px;right:16px}.portfolio-video:fullscreen{border-radius:0;width:100%;height:100%}.video-sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@keyframes video-spin{to{transform:rotate(360deg)}}@media (max-width:480px){.portfolio-video__tools{max-width:calc(100% - 16px);bottom:8px;right:8px}.portfolio-video__seek{width:64px}.portfolio-video__main-action{width:48px;height:48px}}@media (prefers-reduced-motion:reduce){.portfolio-video__main-action,.portfolio-video__tools{transition:none}.portfolio-video__loading{animation:none}}