Design a dark-mode website section: radar telemetry through frosted midnight glass, illuminated by luminous cyan telemetry and crisp engineering grids.
LAYOUT
The layout features a centered header hierarchy (eyebrow, display title, two-line subhead) occupying the top vertical band. Directly beneath sits a 5-column horizontal pipeline of cards separated by equidistant gaps and directional chevrons. The section concludes with a wide, single-row results summary card anchoring the base.
PALETTE (use these exact hex values)
- #040810 — Deep Midnight Base: Primary screen canvas backing the entire section.
- #0A1322 — Translucent Card Surface: Background fill for the process cards and bottom summary dock.
- #15253D — Subtle Card Border: Crisp 1px border encapsulating individual stage cards and bottom bar.
- #38BDF8 — Electric Cyan: Numbered step badges, tracker icons, and eyebrow label highlights.
- #34D399 — Telemetry Neon Green: Success metrics, positive deltas, and validation indicator strokes.
- #FFFFFF — Primary Heading Text: Main section titles and step card heading labels.
- #879BB5 — Secondary Body Text: Explanatory copy beneath titles and telemetry card descriptions.
- #273952 — Muted Icon Chevron: Horizontal step flow transition chevrons between cards.
TYPOGRAPHY
Typeface Inter (or Geist Sans,SF Pro Display,Roboto), weights 400/500/600. Sizes 11px caption, 12px body-sm, 13px body, 16px body-lg, 18px subheading, 20px heading, 42px display. Tracking -0.02em on headings, 0.05em on uppercase eyebrow. The typographic tone is ultra-precise, technical, and restrained, relying on a clean geometric neo-grotesque like Inter. Letter spacing is compressed on display sizes (-0.025em) and expanded on microcaps (+0.08em) to evoke precision aerospace telemetry. Geist Sans or SF Pro provide seamless drops-in without losing the austere character.
GEOMETRY & SPACING
Corner radii — cards 12px, links 4px, inputs 8px, buttons 999px. Spacing on a 4px unit, 16px gaps, 80px between sections, 1280px container, comfortable density.
DEPTH
Depth is completely non-skeuomorphic, achieved without drop shadows. Contrast is formed exclusively through 1px border strokes (#15253D) against subtle card fills (#0A1322) overlaid on the deep midnight base (#040810). Visual telemetry insets recede further into near-black negative space.
IMAGERY
Imagery strictly consists of synthetic perception data: vehicle bounding boxes in 3D wireframe perspective, FMCW radar point clouds, line graph metrics, and bird's-eye autonomous driving concentric sensor rings. Realistic photographic car renders would clash entirely with the mathematical, engineering-grade telemetry tone.
SIGNATURE DETAIL — the thing that makes this design itself
The distinctive horizontal 5-stage telemetry pipeline where each dark container pairs technical microcopy with an embedded AV sensor visualizer (radar circles, point clouds, road grid, metric sparklines), united by subtle directional chevrons and capped by a unified 'Result' bar.
MUST
- Use solid bright cyan #38BDF8 for step numerals inside circular pills to maintain instant scanning.
- Render radar and vehicle visualizers in wireframe style with dark blues, cyans, and minimal neon accents.
- Keep card stroke borders at 1px with #15253D to preserve delicate glasslike outlines.
- Maintain strict left alignment for text inside cards while keeping the overall hero header centered.
AVOID
- Never use bright solid white backgrounds or light mode panels anywhere in this layout.
- Do not use drop shadows; define all card boundaries through subtle 1px border strokes.
- Avoid photographic imagery of real cars; only use vector wireframes, point clouds, and LiDAR top-downs.
- Do not omit the directional sequence chevrons between process cards.
OUTPUT
Render as a clean, pixel-crisp UI design at roughly 1792:1024. Flat vector rendering, real legible text, no browser chrome, no device mockup frame, no watermark, no lorem ipsum placeholder blocks. 在 DraPub 中尝试 
