Vigloo - Premier Short Dramas

Colors

• #000000background-black · Screen background · Media player background
• #FFFFFFtext-primary-white · Gesture instruction text · Icon glyphs
• #8E8E93text-secondary-gray · Action rail labels · Episode navigation label · Synopsis text
• #D4A843gold-accent · Crown icon fill · Banner CTA text
• #241F14gold-surface-dark · Banner CTA background fill
• #333333border-subtle · Progress bar track · Divider rule

Type

• Gesture HeadlineSF Pro Text · 54px · 700 · #FFFFFF
• Gesture SubheadSF Pro Text · 44px · 700 · #FFFFFF
• Media TitleSF Pro Text · 34px · 700 · #E5E5EA
• Synopsis TextSF Pro Text · 28px · 400 · #8E8E93
• Action Rail LabelSF Pro Text · 24px · 500 · #8E8E93
• Banner CTA LabelSF Pro Text · 32px · 600 · #D4A843

Elements

• Top App Bar · navigation_bar

  Fixed at top beneath status bar; chevron '<' and 'EP.1' aligned left, hourglass timer icon pinned top-right · Monochrome icons and gray text on transparent/black background

• Swipe Tutorial Overlay · illustration

  Centered vertically and horizontally; rounded rect phone wireframe with play triangle and white hand cursor pointing up · Semi-transparent gray border and fill for simulated device; solid white hand silhouette with subtle drop shadow

• Right Vertical Action Rail · action_group

  Right margin stack; vertically spaced items with centered icon above small caption ('Save', 'Episodes', 'Share', 'More') · Outlined monochrome icons (bookmark, stacked layers, export square, triple horizontal dots)

• Metadata & Playback Info · container

  Bottom-left region above progress line; contains title with chevron and truncated two-line description · Plain text with clickable 'More' affordance in matching gray

• Playback Progress Bar · progress_bar

  Horizontal line spanning screen width, slightly indented, below media metadata · Thin subtle dark gray line with light progress indicator

• Unlock CTA Button · button

  Horizontal banner button pinned near bottom edge; full-width with outer padding · Deep gold/brown rounded rectangle fill with gold crown icon and bold label

Layout

Full-screen vertical video playback container. Navigation items overlay top corners, vertical action toolbar on bottom-right, metadata and progress bar overlay bottom-left, gesture tutorial centered, and persistent unlock CTA at bottom.

Notes

Visual styling closely aligns with standard iOS typography (SF Pro Text). Exact video content is absent or obscured by black playback buffer.