/* A quiet, progressively enhanced player using the portfolio theme. */
.video-player{overflow:hidden;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink);isolation:isolate}.video-player:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.player-screen{position:relative;background:#121314}.project-demo .video-player video{width:100%;height:auto;aspect-ratio:1.6;object-fit:contain;border:0;border-radius:0;background:#121314}.player-start{position:absolute;inset:0;margin:auto;width:64px;height:64px;display:none;align-items:center;justify-content:center;border:1px solid #ffffff55;border-radius:50%;background:#7737e9;color:#fff;box-shadow:0 3px 18px #0003;cursor:pointer;transition:background .15s,transform .15s}.is-enhanced .player-start{display:flex}.player-start:hover{background:#6530c9;transform:scale(1.04)}.player-icon{width:20px;height:20px;display:block;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}.player-start .player-icon{width:25px;height:25px;margin-left:3px}.player-controls{padding:8px 12px 7px;border-top:1px solid var(--line)}.player-toolbar{display:flex;align-items:center;gap:7px;min-width:0}.player-control{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;flex:0 0 40px;border:0;border-radius:5px;background:transparent;color:var(--ink);cursor:pointer;padding:0}.player-control:hover{background:var(--soft);color:var(--accent)}.player-control:focus-visible,.player-start:focus-visible,.player-range:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.player-time{font-size:11px;line-height:1.5;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}.player-time b{font-weight:550;color:var(--ink)}.player-spacer{flex:1}.player-range{--fill:0%;appearance:none;-webkit-appearance:none;display:block;border:0;margin:0;background:transparent;cursor:pointer;touch-action:pan-y;color:var(--accent)}.player-seek{width:100%;height:22px}.player-volume{width:65px;height:40px;flex:0 1 65px}.player-range::-webkit-slider-runnable-track{height:3px;border-radius:10px;background:linear-gradient(to right,var(--accent) 0 var(--fill),var(--line) var(--fill) 100%)}.player-range::-moz-range-track{height:3px;border-radius:10px;background:var(--line)}.player-range::-moz-range-progress{height:3px;background:var(--accent);border-radius:10px}.player-range::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:11px;height:11px;border:2px solid var(--paper);border-radius:50%;background:var(--accent);margin-top:-4px;box-shadow:0 0 0 1px var(--accent)}.player-range::-moz-range-thumb{width:8px;height:8px;border:2px solid var(--paper);border-radius:50%;background:var(--accent);box-shadow:0 0 0 1px var(--accent)}.player-range:disabled{opacity:.45;cursor:default}.player-pause-icon,.player-muted-icon{display:none}.is-playing .player-play-icon,.is-muted .player-sound-icon{display:none}.is-playing .player-pause-icon,.is-muted .player-muted-icon{display:block}.player-status{font-size:12px;line-height:1.7;color:var(--muted);padding:0 12px}.player-status:not(:empty){padding-bottom:10px}.player-fallback{font-size:12px;color:var(--accent);padding:0 12px 12px;display:block;text-decoration:underline}.video-player:is(:fullscreen,:-webkit-full-screen){width:100%;height:100%;border:0;border-radius:0;display:flex;flex-direction:column;background:#121314}.video-player::backdrop{background:#121314}.video-player:is(:fullscreen,:-webkit-full-screen) .player-screen{flex:1;min-height:0;display:flex;align-items:center;justify-content:center}.project-demo .video-player:is(:fullscreen,:-webkit-full-screen) video{height:100%;width:100%;aspect-ratio:auto}.video-player:is(:fullscreen,:-webkit-full-screen) .player-controls{flex-shrink:0;background:var(--paper)}
@media(max-width:640px){.player-control{width:44px;height:44px;flex-basis:44px}.player-controls{padding:6px 9px}.player-toolbar{gap:5px}.player-time{font-size:11px}.player-start{width:58px;height:58px}.player-seek{height:26px}}
@media(max-width:480px){.player-volume{display:none}}
@media(prefers-reduced-motion:reduce){.player-start{transition:none}}