# VESPER — Find your moment. ## Current verification — 11 November 2026 Final visual refinements keep the existing glass material and round Play unchanged: drawer tabs follow their tool colours, navigation arrows no longer cast decorative pools of light, transcript text has stronger reading contrast, time labels use tabular numerals, and content cards share a restrained contact shadow. Chromium checks at 320 px, 768 px and the default desktop viewport covered the expanded rail, Scenes, transcript search and jumping to its result. No page-width overflow was observed at 320 px; the main playback controls retain 44 px touch targets. These refinements were checked with viewport resizing, not a new physical-device session. The final review passes 45 automated tests, syntax checks and the production build. Chromium UI checks covered all four recordings, real transcript search, sentence repeat, Jog cancellation with restoration of the previous loop, source replacement at 240p with time/rate/pause preserved, bookmark save/rename/delete/undo, real thumbnail previews, volume keyboard controls, fullscreen, four drawer docks at 320 px, 768 px tablet layout, pin/idle behavior, TV focus navigation, and contrast/reduced-motion settings. All 62 referenced demo media/track/storyboard assets exist and are non-empty. Review fixes: optional tools stay hidden in every dock; Jog restores its loop checkpoint on cancellation and dismisses when another control or dialog takes focus; holding J cannot toggle Jog repeatedly; bookmark Undo returns focus to the restored item; cancelling rename discards the draft without closing Explore; the tools popover opens within the viewport with focus inside; an explicitly chosen warm palette survives reload. Jog instructions are also available in Shortcuts. Screen-reader-only Jog help and announcements use a clipped one-pixel style so they remain accessible without appearing over the film. Desktop checks use the in-app Chromium browser and viewport resizing. A physical Samsung SM-A045F running Android 14 and Chrome was also tested with USB-injected native touch events. Other Android models, iOS/Safari, physical TV remotes, a screen-reader session, and device-specific frame-rate/battery measurements remain outside this environment's verification. Earlier notes below describe prior revision checks. An original Video.js v10 skin with an edge-docking, pinnable control rail, searchable transcripts, local personal bookmarks, and frame-aware A–B repeat. The coloured-glass revision overlays a translucent petrol-blue rail on the video. Ice blue play, turquoise sound, lavender transcript, coral bookmarks, sage repeat, and amber pin controls keep a restrained, familiar Video.js layout. ## Run and build Node.js 22+ required. ```sh npm ci npm run check npm test npm run build npm run dev ``` The demo serves at the printed local URL. The `dist/` folder deploys to any static host. The preview supports byte ranges for reliable media seeking. Set `PORT` to choose a different preview port. ## Source and architecture - `src/skin.js`: reusable player interface, icons and chapter data. - `src/main.js`: `VesperTools` custom component using the Video.js `UIElement`, `PlayerController`, `selectTime` and `selectPlayback` APIs. - `src/state.js`: transcript parsing/search, bookmark validation and loop boundary rules. - `src/docking.js`: pointer capture, touch hold, cancellation, edge hit testing, keyboard docking and saved positions. - `src/media.js`: allowlisted demo catalog and independent video identities. - `src/branding.js`: validated colour presets, local brand preferences, contrast checking and optional tool switches. - `src/original-demos.js`: generated meeting and product video descriptors. - `src/styles.css`: responsive skin, presentation, keyboard focus, reduced-motion and forced-colors styles. - `src/panel.css`, `src/branding.css`, and `src/glass.css`: docked controls, compact layouts, demo chooser, brand editor, and coloured glass. The build combines all four style files. The playback, seeking, volume, captions, playback rate, picture-in-picture and fullscreen controls are real Video.js components. Custom controls dispatch Video.js feature actions. The A–B scheduler uses `requestVideoFrameCallback` when available, with an animation-frame fallback. It suppresses duplicate seeks, pauses outside-range loops on manual seeking, and leaves paused playback paused. ## Main features - Dock the controls to bottom, top, left or right using the grip. Mouse: drag past the movement threshold. Touch/pen: hold for 280 ms before dragging. Moving too soon cancels the hold. Pointer cancellation, lost capture, Escape and disconnect clean up the drag. A cancelled drag never changes the saved position. - Click the grip to choose an edge in a keyboard-operable dialog, or focus the grip and press an arrow key. Vertical rails use the actual Video.js vertical seek slider; seeking still uses Video.js. - Pin/unpin the panel with the pin icon. Pinning is remembered across reloads and demo changes. Unpinned controls fade after 2.8 seconds during playback, but stay visible while paused, hovered, keyboard-focused, dragged or using an open tool/dialog. Pointer movement or interaction wakes them. Native controls remain in the keyboard order while faded. - The compact tools panel contains caption toggle, speed, seek steps, bookmarks, position and accessibility settings, plus A–B repeat. Escape closes it and returns focus. - Search real English subtitle text, click a result to seek and play it, or repeat that sentence in one click. - Save up to 50 video-specific bookmarks in local storage. Rename, remove, undo removal, and restore them after reload. Malformed stored data is rejected, and user labels are safely rendered as text. If storage is blocked, the current session remains usable. - Set A, advance the film, set B, and toggle or clear repeat. The interval must be at least one second. Seeking outside an active interval turns repeat off. - Choose Watch mode for a wider film, Explore for the transcript/moments/chapters, or Access for actual subtitle styling and motion/contrast preferences. - The TV view enlarges controls and adds directional focus navigation; it is a browser view, not a native smart-TV application. - Open **Brand & tools** above the player for five presets, a brand label and three editable colours. Text and accent must each reach 4.5:1 contrast against the chosen panel surface before applying. This checks these colour pairs, not whole-product accessibility certification. - Show or hide transcript, bookmarks, repeat, chapters, speed, ten-second steps, picture-in-picture and TV view. Essential playback and access controls stay available. Hiding bookmarks preserves data; hiding repeat stops an active loop. Disabling all Explore tools falls back to Watch. Settings persist locally across videos. - Access can move native subtitles to the top or bottom. The product example starts with top subtitles, keeping its lower-third information visible. Panel placement is manual; the skin does not detect faces, logos or text automatically. ## Media and source distribution The chooser switches between a 140-second Sintel dialogue excerpt (original subtitles rebased from 01:40) and NASA Goddard's approximately 118-second Understanding Lunar Eclipses lesson (original narration and time-linked English captions). NASA's SRT is converted by changing timestamp separators only; narration punctuation is preserved. Navigation chapters for the NASA lesson are authored for this demo. Bookmarks and resume positions use distinct per-video keys; panel position and pin preference are shared. All media and fonts are hosted with the demo; no runtime CDN or paid service is necessary. See `public/credits.txt` for attribution and changes. The short demo checks the media host's byte-range support. On hosts without it, the approximately 8 MB clip is downloaded once into a Blob URL before the play button appears. This restores actual random-access seeking for transcript jumps and A–B repeat. That demo fallback is separate from the reusable skin; use a range-capable server or streaming provider for long-form production media. Set `VESPER_PREVIEW_NO_RANGE=1` to exercise the fallback in the local preview. The chooser also includes an original 84-second scripted meeting and a 57-second fictional desk-light presentation. Both use original graphics and explicitly disclosed synthetic English narration. Meeting speaker names, decisions and action items are fictional. Search “decision” to jump to the meeting decision or “brightness” in the product demo. Captions are time-linked to the generated audio; this demo does not upload recordings or automatically transcribe speech. The downloadable source archive excludes the MP4 media files. To rebuild a downloaded copy, retrieve `assets/sintel-excerpt.mp4`, `assets/nasa-eclipse.mp4`, `assets/meeting-demo.mp4` and `assets/product-demo.mp4` from the live demo and place them in `public/assets/`, run `node scripts/create-renditions.mjs` with ffmpeg/ffprobe on PATH to create the lower-resolution copies, then build. Images and subtitle tracks are included. Alternatively, regenerate the two original demos on Windows with Microsoft Zira Desktop installed and ffmpeg/ffprobe on PATH: run `scripts/create-demo-media.ps1`, then `node scripts/finalize-demo-media.mjs`. Scripts are in `scripts/demo-scripts.json`. Brand colours remain available as CSS variables for integration; the editor is a local demo preference, not a multi-tenant administration service. ## Competition notes The public site https://vesper-player.pages.dev/, a design screenshot and a short written description are the primary submission artifacts. The Sintel film in the main player is hosted on Mux (public playback ID FBksOjY8S0100i62vgc9q6jp1B2DAn85rb6UzsRfFAJc00); a substantive real-site integration is not claimed by this standalone, self-hosted demo. No entry is submitted automatically. Physical phone/tablet/TV checks and native browser differences should remain distinct from desktop browser emulation in any validation report. Original code: Apache License 2.0. Media and fonts retain their own licenses. ## Verification on 2026-11-10 At the original baseline, eighteen Node tests passed for subtitle parsing, accent/case-insensitive search, malformed bookmark storage, safe text rendering, loop boundaries, actual rectangle-based docking, mouse drag commit and click suppression, touch hold/early-move cancellation, abort cleanup, brand validation/contrast, feature whitelisting and distinct allowlisted video identities. Syntax checks and the production build pass. The in-app Chromium browser exercised real video playback; searching "dragon" and jumping to 43.4 seconds; saving, renaming, restoring after reload, removing and undoing a bookmark; one-click sentence looping across 7.25–10.5 seconds after more than two loop lengths; keyboard selection of a manual 0–10 second range while preserving paused state; native fullscreen entry and exit; a subtitle-size setting; dialog Escape and focus return; and 320/390px viewport layouts without toolbar or loop overflow. Browser viewport emulation is not a physical device test. Safari/iOS, physical TV remotes, and a screen-reader session have not been independently certified. Use the capability-aware controls and test the actual target device before promising support on a specific platform. The static-host fallback was additionally exercised against a preview server deliberately returning no byte-range support: the video source became a Blob URL, the browser reported the full 0–140 second seekable range, a transcript jump reached 43.4 seconds, and the 43.4–45 second sentence loop worked. The docking revision was exercised in Chromium: mouse drag from top to right without opening the position dialog, arrow-key docking to every edge, a position dialog selection, vertical keyboard seeking to 10 seconds while paused, pin persistence after reload and across videos, and automatic fading during playback when unpinned. At 320px and 390px viewport widths the rail fits the film shell, no horizontal page overflow is present, and visible core buttons have 44×44px targets. The NASA transcript search for “shadow” returned six results and jumped to the first matching explanation at 20.03 seconds. Touch hold is covered by event-level tests; physical-device touch remains a separate validation task. The four-demo revision also exercised the scripted meeting search “decision”, a real jump and sentence loop at 46.5 seconds, an independent bookmark, invalid low-contrast rejection, preset/label/colour persistence, hiding and restoring optional tools without deleting bookmarks, all-Explore-tools-off fallback, and native top/bottom subtitle relocation. Brand editor layouts were inspected at 320px and 390px without horizontal dialog overflow. ## Coloured-glass revision The rail overlays the video, with an opaque fallback when backdrop blur is unavailable. Transcript, bookmark and repeat shortcuts appear when there is room; compact layouts keep them in the existing tools and Explore panels. Captions recalculate their safe area when the panel moves, resizes or the subtitle size changes. The former default palette upgrades without removing bookmarks, panel preferences or feature choices; custom brands remain intact. Chromium checks covered product playback, searching brightness and jumping to 19.2 seconds, saving a bookmark, a manual 22.7–32.7 second A–B range while paused, and a 19.2–28.7 second sentence repeat continuing for more than two cycle lengths. Four keyboard dock positions, pin persistence, new shortcut feature visibility, the glass preset and 320/390/768px emulated layouts were checked. The 320px rail keeps all six core 44px targets inside its bounds without page overflow. Physical-device testing remains outstanding. The colour refinement strengthens each button's tinted glass gradient, coloured rim and pale icon while retaining the rail's 78% translucent surface and 20px blur. Sound is turquoise, transcript lavender, bookmarks coral, repeat sage and pin amber; captions, tools and fullscreen use distinct cool tints. The speed button now reads Speed with its current multiplier. Chromium checks covered light/product and dark/Sintel scenes, a real speed change to 1.25×, and a 320px tools panel without horizontal overflow. That revision preceded the real quality selector described below. ## Real resolution and direct speed controls Quality and Speed are always on the movable rail, including compact and vertical layouts. Each of the four videos has an original, 360p, and 240p H.264/AAC MP4. The originals are 960×540 for the education, meeting and product demos, and 960×410 for the widescreen Sintel excerpt. No 720p/1080p or Auto choice is advertised: the source does not contain that resolution, and manual file selection is not adaptive streaming. The rendition generator measures output dimensions and verifies duration alignment. Changing quality fetches a range-capable URL or a Blob fallback, then changes the actual video source. Time, paused/playing state, speed, volume, mute, captions and current repeat range are preserved. Failed changes restore the previous source when possible and report the outcome. Selections are disabled during startup/source replacement; quality defaults to the original on a new page. The source download contains the generator and exact rendition catalog. The glass now uses a 68% petrol tint and 14px blur, with a coloured border and speech-bubble transcript / ellipsis tools icons closer to the approved concept. The film shell follows the original video's aspect ratio. Extra quality and speed controls require a second rail row at smaller widths; wide horizontal players use one row. A/B labels appear on the repeated range. This is a responsive implementation of the concept, not a pixel-identical copy of the generated image. The latest refinement balances the button hierarchy, uses low-profile rounded Quality/Speed controls, strengthens per-button hover and keyboard focus, preserves persistent pin/repeat states, and contains the desktop transcript so it cannot stretch blank rows beneath the film. Quality switching was exercised at 19.3 seconds while paused at 1.5× (540p to 360p), and while playing a sentence loop with mute enabled (to 240p). A byte-range-disabled preview additionally switched through a Blob URL from 540p to 240p and back to 540p, preserving 19.22 seconds and 1.5×. The 320px horizontal/vertical layouts kept both selectors accessible without page or rail overflow. Unit checks also cover source replacement state, decode failure/cancellation, missing files and the allowlisted measured catalog. Physical device validation is still separate. ## Original VESPER identity revision The player now has a newly structured rail: a continuous full-width timeline, a primary playback group, directly available quality/speed selectors, and an open-icon action group. Only Play has a permanent filled circle; icon colours, hover/focus surfaces, and persistent pin/repeat states provide hierarchy. The panel and film frame share asymmetric rounded/cut corners. Compact layouts keep the six core controls and both selectors; side docking reflows the same DOM groups. Existing Video.js playback, source switching, search, bookmarks and loops remain in use. Original assets are in src/vesper-icons.js (27 SVG glyphs), scripts/create-vesper-type.mjs (105-glyph Vesper Display alphabet with Turkish support), and the generated public/design/ library. These are original drawings rather than recoloured stock icons or traced type. Vesper Display is a title/short-label small-cap display face; licensed DM Sans remains the long-text face. Font stroke outlines are geometrically united before OpenType serialization and checked for duplicate character mappings. Run npm run design to regenerate the font, wordmark and downloadable SVG library. Build-time OpenType.js and polygon-clipping do not ship in app.js. The original assets follow the project's Apache 2.0 license. The new layout was checked at 320px without page or rail overflow, on all four dock edges, with vertical keyboard seeking while paused, and with real 240p switching at 1.25× during a 43.4–45-second sentence loop. Short A/B ranges use one combined marker to avoid overlapping labels. Physical-device and screen-reader certification remain separate. The identity revision also verified actual mouse drag from bottom to right without opening the position dialog, native vertical keyboard seeking from 0 to 1 second while paused, 320px horizontal/side layouts without rail overflow, and font loading in Chromium after checking and uniting original contours. The local design library shows the original drawings and provides individual SVG/OTF downloads. Long-form copy remains in DM Sans for readability. Eighteen automated tests pass. The reduced-transparency, higher-contrast, forced-colors and reduced-motion fallbacks remain available. ## Liquid glass panel The panel material is implemented in `src/liquid.css`: a blurred, brand-tinted body, soft colour light, restrained icon glow and a convex play control. The bright double perimeter has been replaced by a single, quiet 1 px blue-grey hairline; a soft shadow separates the glass from the video. All layers are CSS; the generated concept image is never used as a fake player surface. The actual scene remains visible through the panel. Content choices now follow the player so the controls lead the page. The design reference is available at `/design/index.html`; its generated mockup is explicitly labelled as a concept, separate from live UI. Existing Video.js controls, docking, pinning, transcript, bookmarks, A–B repeat, quality and direct speed remain functional. Higher contrast and reduced transparency use an opaque brand surface with no decorative glass layers; forced colours uses system colours. Checked at 320 px and 390 px phone widths and 1280 px desktop width, including all four dock positions. Core phone targets remain 44 px or larger. Physical device and TV remote testing is still pending. ## Neon timeline The time slider now has a turquoise curve, a luminous playhead and a short light projection. The x axis (or bottom-to-top y axis in side docking) still maps linearly to actual video time; the base contour is decorative; VESPER Pulse overlays real recorded audio, without claiming engagement data. `src/neon-timeline.js` uses the same geometry for the drawing and playhead. A bounded MutationObserver follows Video.js fill/pointer values and disconnects with the player. It never writes playback state or starts an animation loop. Native seeking, keyboard steps, buffers, previews and A–B markers are retained. Higher contrast and forced colours use the native straight bar. Validation: 24 tests pass, including playhead/path alignment, drag preview and observer teardown. Browser checks covered click and drag seeking while paused, side docking and a 320 px layout with a 44 px-high seek target. The current and total readouts are integrated as open-ended glass terminals, with short illuminated bridges into the curve. On phones the terminals shrink to 38 px; the native seek target stays 44 px high. Side docking uses a single top terminal and a vertical bridge. ## VESPER Pulse All four demo recordings now include sound-reactive playback timelines. `scripts/create-pulse-data.mjs` extracts timestamp-aligned mono PCM and RMS data from each original MP4 with FFmpeg; compact sidecars are stored under `public/tracks/pulse`. Each contains the original recording SHA-256. Audio packets copied into the alternative resolutions contain the same recorded soundtrack. This is genuine recorded audio data, synchronised by `video.currentTime`, rather than a random or synthetic waveform. Regenerate sidecars after replacing a video: `node scripts/create-pulse-data.mjs` (requires FFmpeg and FFprobe). `src/pulse.js` renders a bounded local ripple around the playhead at up to 30 fps. The time axis and playhead stay fixed on the base curve. Pointer entry, touch dragging and keyboard seeking restore the quiet curve. Pause, mute, zero volume, hidden/offscreen controls, reduced motion and higher contrast suppress the movement. Access includes an independent Sound-reactive timeline switch. The native video remains the only audio player; Pulse does not reroute audio or request microphone access. Unavailable sidecars fall back to the regular timeline. Verification: 24 tests pass. The new checks cover recording identity, malformed data, real sample-dependent shapes, silence/mute, playhead alignment and motion policy. Browser checks confirmed click/drag/keyboard seeking, pause, mute, the Access switches, 360p replacement at 1.5x, vertical docking and a 320 px phone layout. Physical-device testing is still pending. The playback icons are now 21 px (23 px for Play). Desktop pointer controls use compact 40 px targets and a 44 px Play control. Phone targets remain at least 44 px and TV targets retain their larger size. Hover changes colour and light only; there is no magnification. ## Sound Wing volume control The native Video.js volume slider now uses 13 tapered light strokes with a small glass handle. The filled strokes map directly to the actual volume; mute clears the fill and restoring sound keeps the selected level. A percentage readout appears on hover, focus and dragging without enlarging the control. Keyboard and wheel input remain native. The 54 x 44 px control appears where the horizontal rail has enough room; small phones and side docking retain the sound button. Platform volume unavailability is respected through the native hidden state. Browser validation covered 65% volume, mute/restore and the percentage readout. ## Timeline frame previews Every demo includes genuine image previews at one-second intervals. Hovering only moves the preview; it never seeks or pauses the main video. The native Video.js time slider and thumbnail component use WebVTT metadata with JPEG sprite coordinates. Images are loaded on demand, without a second video decoder or another audio source. The card includes the target time and chapter, opens inward for all four dock edges, and is constrained at the timeline endpoints. Touch dragging and keyboard navigation use the same native slider; the touch card closes after release. A missing image leaves the target-time caption available. Run `node scripts/create-frame-previews.mjs` after replacing an original recording (requires FFmpeg and FFprobe). The four recordings yield 402 thumbnails in 14 small storyboard pages, about 980 KB altogether. The source catalog records the original MP4 SHA-256. Tests verify recording identity, continuous coverage including the exact endpoint, unique image tiles, and in-bounds crop coordinates. Validation: all 28 tests pass. Chromium checks covered hover without changing the main video time, keyboard Home/End and arrows, the final frame, a 240p source replacement, all four dock edges, and a 320 px phone-size layout without horizontal page overflow. Phone-size emulation does not certify physical touch devices. ## Coordinated studio polish The player, chapter ribbon, transcript, saved moments, A–B tools and preference dialogs share the same dark blue material, typography, icon language and spacing. The rail uses a translucent petrol-blue base, feathered inward bevels, directional blue/violet/rose edge reflections and a dark rear lip. Play uses a round illuminated blue lens, a dark glyph and shallow elevation; pressing lowers it by 1 px. Bright reflection is concentrated in the glass edge rather than a white spot in the Play face. The rejected travelling border trace remains absent. These are CSS optical treatments, not hardware ray tracing or physical refraction. Coloured reflections under secondary icons move on a gentle staggered 6.8-second cycle. Hover/focus pauses that drift and clarifies the light, without scaling the icon or target. Reduced motion removes movement; higher contrast, reduced transparency and forced colours remove decorative light/depth. Sound Wing stays in the cool blue family. Elapsed and total time use pale turquoise and pale blue. Curved underlines connect their labels to the native time rail without changing seeking geometry. Timeline spill is restrained, and genuine recorded-audio Pulse stays still while seeking. Native frame previews remain available. The chapter ribbon uses actual scene images with readable image-backed labels, start-time badges and a static selected indicator. Phones use a horizontally scrollable contact sheet. Saved moments now show the actual frame at the stored timestamp through the native Video.js thumbnail component and the same on-demand storyboard assets as timeline previews. No second decoder or audio player is added. Names, times, rename and removal remain accessible. The A–B shortcut opens focused repeat controls. The full menu retains extra playback actions. Popup placement follows the actual video area and panel edge, including a right dock beside the Explore sidebar; available height is constrained and scrollable. Quality and speed remain native selections. The library uses real poster covers for all four content types. Build output fingerprints script and stylesheet URLs with content hashes so releases load matching assets despite browser caching. The design specimen preserves pseudo-element, hover and active selectors from the live Play material. Validation: all 28 existing tests pass. Browser checks covered transcript search/jump, a named bookmark and its frame, real 240p switching while preserving time and speed, A–B controls, all four panel positions, 320 px phone and 768 px tablet layouts, and higher-contrast/reduced-motion preferences. Responsive browser checks do not certify physical touch devices. ### Optical material refinement The latest user-selected liquid-glass mockup is the material reference. A 13 px backdrop blur supports a dark translucent face, a 1.25 px directional meniscus and a feathered 7 px inward bevel. A concentrated upper-left highlight and lower-right rose reflection describe the curved cross-section. The inside corner receives a soft blue reflected plane; the middle stays dark and readable. Play is fully circular with a filled blue lens, dark centred glyph, inner rim and shallow pressed elevation. Its diameter is 48 px in the regular horizontal rail, 44 px in compact/side layouts and 64 px when a desktop film is at least 980 px wide. Its three-stage layout progressively reveals more tools while preserving this optical material. The opening Play uses the same blue material. Quality and speed retain the shared recessed surface and divider explicitly liked by the user, with native selections and 44 px select targets on phones. Explore uses the reference's underlined tabs, dark blue surface and larger desktop text. The design specimen now reads the rail surface, optical edge, depth and Play material from the live CSS. ### Icon reflections and reading hierarchy Secondary icons use colour-specific reflections, a soft 10 px two-stage falloff and 3 px blur (12 px reflection height on wide desktop rails). A subpixel drift and slow staggered breathing remain; hover/focus pauses the drift and clarifies the reflection without scaling the button or icon. Time values, quality/speed values, scene names, transcript lines and saved-moment labels have clearer type sizes and numeric spacing. Phone chapter cards reserve at least 90 px in height so two-line titles stay separated from time badges. TV view preserves a larger 16 px reading scale, with 14 px time values and 26 px icons where the film has room. Browser checks covered 360p playback, preserved paused state and 1.25× speed, a fixed 25-second comparison frame, wide Watch/Explore layouts, side-docked controls and tools, 320 px native targets, and contrast/motion fallbacks. Strong-contrast modes remove optical decoration and keep opaque readable controls; reduced motion freezes the decorative light. ## Three-stage integrated panel The default Watch level shows a bare Play/Pause glyph, current/duration, the real Pulse timeline, fullscreen and a disclosure button. Touch targets remain at least 44 px even though the compact Play has no blue disc. Expanding reveals the full tools; the SAME native Play component moves before Sound and regains its round blue glass lens. It is never duplicated and playback is not reset. Transcript, Moments and Scenes open between the timeline and utilities, inside one continuous optical enclosure. The former external sidebar and duplicate scene ribbon are removed. Bookmarks open their saved collection rather than creating a bookmark on every shortcut click; Save this moment is explicit inside the drawer. Scenes retains all four image cards, timestamps and native seeking. Selected tool icons expose their expanded/pressed state. Closing returns focus to the opening tool; Escape closes the drawer, then collapses utilities. Hidden tools stay outside keyboard navigation. The whole enclosure adapts to all four docks. Horizontal drawers reserve their height in the player so the original video area stays the same size; caption clearance uses the actual video stage. Side docking expands inward into two columns. Narrow side drawers use labelled icon tabs and horizontally scrollable scene cards. Fullscreen uses the existing viewport and a scrollable drawer. Opening Explore keeps controls visible without changing the saved pin preference. Player tools and Explore are mutually exclusive. Validation: all 28 tests pass, including reserved video geometry, narrow side bounds and fullscreen budgets. Browser checks covered native Play while moving between levels, direct fullscreen from level 1, transcript search/jump, existing thumbnail bookmarks, quality/rate preservation, all four dock edges with the drawer open, 320 px layouts, keyboard closing/focus, and controls remaining visible while the video plays with focus outside the panel. Phone checks emulate viewport size; physical touch devices are not certified. ## VESPER Jog Tap Play as usual. Hold it for 420 ms to reveal a temporary glass jog ring and a genuine one-second storyboard preview. Turn clockwise to seek forward and counterclockwise to seek back; straight horizontal dragging is also supported for narrow touchscreens. Moving farther from the button slows rotary seeking for finer selection. The captured pointer stays attached until release, including outside the button. Early movement cancels a pending hold. On release the selected time is kept, with playing/paused state preserved and the generated click suppressed. With Play focused, J opens keyboard Jog. Arrows seek one second; Shift + arrows seek five. Enter commits, Escape restores the starting position, and Tab commits then moves focus normally. Resizing, changing dock, fullscreen transitions, loss of window focus and pointer cancellation dismiss Jog safely without starting playback. The ring fits available space at each edge, and the preview stays within the player. No microphone, extra audio stream, haptic permission or simulated video frames are used. Pointer lifecycle, angular seam, direction, bounds, fine sensitivity, real preview cells and keyboard behavior are covered by the Jog tests. ## Physical Android review — 11 November 2026 On the connected Samsung SM-A045F (Android 14, 720 × 1600), Chrome playback, native touch Jog in both rotary directions and linear sliding, paused-state preservation, long-press docking to the bottom and both sides, the initial top dock, transcript search with the Samsung keyboard, a result jump to 43.4 seconds, and portrait fullscreen entry/exit were exercised. Test input was injected over an authorized USB connection on the actual handset. This found an on-screen-keyboard occlusion: Chrome shrinks its visual viewport while the page layout stays larger. The keyboard-viewport controller now keeps the active drawer field and useful results above that keyboard using page scrolling. Browser toolbar changes and pinch zoom do not trigger that correction. Keyboard dismissal, drawer closure and fullscreen exit bring the film and controls back into view; the full film is preferred when it fits. Four new geometry regressions cover occluded fields, panned viewports, zoom/toolbar changes and panels outside the visible screen. The original dock, playback and loop state are retained.