Redesign media details and home screens with cinematheque aesthetic

[arturseixas]

This PR implements a comprehensive visual redesign of the media details screen and home experience, adopting a cinematheque-inspired aesthetic with true black backgrounds, white typography, and minimal color accents.

Summary

The redesign shifts Sabuflix from a colorful interface to a curated streaming service aesthetic where film stills carry all the visual weight. The theme palette moves to true black (0xFF000000) with white text and a single electric blue accent reserved for primary actions. The media details screen is restructured to prominently display film metadata (directors, countries, runtime) and improved playback progress indicators.

Key Changes

Theme & Visual System

• Updated color palette to true black background with white text and minimal accent colors
• Changed border radius throughout to zero or minimal (2px) for print-like edges
• Adjusted all UI elements to work with the darker, more minimal aesthetic
• Updated the Sabuflix wordmark to include a decorative dot grid pattern

Media Details Screen

• Restructured metadata display with director/creator line, original title, and origin information
• Replaced simple rating display with new _AudienceRating widget showing vote count
• Redesigned action buttons as compact _ActionTile components in a wrap layout
• Improved progress indicator display with better visual hierarchy and remaining time info
• Dynamic expandedHeight calculation based on screen width (9:16 aspect ratio)
• Simplified gradient overlays on hero images with cleaner scrim design
• Enhanced typography with improved letter spacing and font weights

Home Screen & Navigation

• Added new NowShowingGrid widget for curated "Em Cartaz" (Now Showing) section
• Implemented daily rotation of featured film using deterministic date-based selection
• Updated navigation labels ("Explorar" instead of "Descobrir", grid icon instead of explore)
• Refined desktop navigation bar styling with border separator

Media Model Enhancements

• Added fields: originalTitle, tagline, directors, countries
• Implemented computed properties: distinctOriginalTitle, directorLine, originLine, starRating
• Enhanced JSON parsing to extract credits from TMDB API responses (crew, created_by)
• Added country name mapping with Portuguese translations

UI Components

• Updated HeroBanner with improved gradient design and customizable label
• Enhanced MediaCard with refined hover effects and focus states
• Improved ContinueWatchingRow and MediaRow with better spacing and typography
• Updated search screen with larger card layout and refined input styling

Testing & Utilities

• Added comprehensive test suite for media metadata parsing and formatting
• Implemented formatCount() utility for pt-BR thousands separator formatting
• Added country code to name mapping for production countries display

Notable Implementation Details

• The daily featured film rotates deterministically based on UTC date, ensuring consistency across users
• Director/creator information is extracted from multiple TMDB API sources (credits.crew, created_by) with fallback handling
• Progress indicators now display both watched percentage and remaining time in a more prominent layout
• The redesign maintains full backward compatibility with existing stored media data through proper JSON serialization

https://claude.ai/code/session_01N7PfACdeQQdY5duGjD4YHE