Flighty

Flighty's design system evokes a sense of technical precision and clarity, balancing a stark white canvas with deep, almost inky, dark surfaces. Typography is compact and precise, utilizing system fonts to create a direct and functional aesthetic. Accents of vivid blue and yellow serve as functional highlights for interactions and status, contrasting against the monochromatic background to guide user attention. Components are lightweight with subtle, layered shadows, prioritizing content over heavy UI chrome. Use Canvas White #ffffff as the default page and card background, reserving Deep Space #05010d or Abyssal Black #010a1a for intentional dark sections or contrast. Apply Midnight Ink #000000 for all primary text and clear borders on light backgrounds, ensuring high contrast and precise visual definition. Utilize system-ui for all body and heading typography, carefully applying the detected letter-spacing values like -1.4px at 56px to maintain a compact, precise appearance. Employ Ocean Blue #007bff for primary action button backgrounds, ensuring it stands out as the main interactive element. Implement soft, layered shadows on Standard Cards using rgba(0,0,0,0.04) 0px 0px 0px 1px, ... to create subtle depth without heavy visual weight. Round corners with 40px for buttons and 12px for cards, and 999px for pill-shaped elements to maintain a consistent friendly yet precise aesthetic. Use Goldenrod #f7be00 sparingly as an accent for active navigation states or important links, contrasting with the dominant neutrals. Avoid using harsh, opaque drop shadows; instead, prefer the subtle, layered shadow style for :hover or active states to maintain visual lightness. Do not deviate from the specified tight letter-spacing for system-ui headings; generic 'normal' spacing will compromise the intended precise aesthetic. Do not use Ocean Blue #007bff for anything other than primary actions; its impact is diminished if overused for decorative purposes. Avoid large, uncontained images; all imagery should either be contained within cards with 12px or 20px radii or serve as full-bleed background elements for distinct sections. Do not introduce new color gradients; adhere to Twilight Gradient and Nebula Gradient for specific feature sections only. Refrain from using bulky or heavily outlined components; the system favors lightweight surfaces and subtle borders. Do not stretch content beyond the inherent compact density; allow for appropriate 10px element gaps and 20px card padding, but avoid overly spacious layouts.