Design a dark-mode web interface screen: dense nocturnal logistics command bathed in cyan vectors, soft telemetry badges, and crisp geometric data tiles.
LAYOUT
The screen uses a fixed 240px left-hand navigation sidebar paired with a flexible multi-panel dashboard grid. Below the global search header, four uniform KPI cards establish the operational baseline. The middle band is split 65/35 between an interactive global transit map and a dedicated shipment tracking panel, while the bottom tiers organize three analytical micro-charts above a full-width dense tabular ledger.
PALETTE (use these exact hex values)
- #080d1a — Canvas Void: Root application background and sidebar surface.
- #0d1527 — Module Surface: Background fill for all analytics cards, map containers, and modular panels.
- #1b253b — Border Hairline: 1px borders outlining panels, tables, search bar, and chart axes.
- #38bdf8 — Telemetry Cyan: Primary brand accent, main CTA background, route vectors, active tracking links, and progress bars.
- #10b981 — Telemetry Emerald: On-time delivery markers, live radar indicators, and positive trend percentages.
- #8b5cf6 — Telemetry Violet: Active routes metric icon badge and donut chart distribution segment.
- #f43f5e — Telemetry Crimson: Exception metric badge, delayed shipment pills, and destination waypoint pins.
- #ffffff — Text Crisp: Primary metric numerals, main headings, and active table cells.
- #94a3b8 — Text Secondary: Navigation labels, body paragraphs, and secondary data values.
- #64748b — Text Dim: Table headers, chart tick labels, timestamps, and search placeholder text.
TYPOGRAPHY
Typeface Inter (or Plus Jakarta Sans, SF Pro Display, Roboto), weights 400/500/600/700. Sizes 11px caption, 12px body-sm, 13px body, 14px body-lg, 16px subheading, 20px heading, 24px display. Tracking -0.01em at display, 0 at body, 0.05em at uppercase micro. The type choice (Inter or similar neo-grotesque) feels engineered, surgical, and unflinching. Neutral letterforms with clean geometric apertures prioritize legibility at 11px and 12px micro scales. For implementation, Inter or Plus Jakarta Sans freely provides the required weights (400 through 700) with robust tabular figure support.
GEOMETRY & SPACING
Corner radii — cards 12px, links 999px, inputs 8px, buttons 8px. Spacing on a 4px unit, 16px gaps, 24px between sections, 1440px container, tight density.
DEPTH
Depth is rendered entirely without drop shadows, using border illumination and surface stacking instead. Cards rest on level 1 navy (#0d1527) against level 0 canvas (#080d1a), demarcated by 1px borders (#1b253b). Floating UI elements such as map toolbars and status overlays use level 2 slate (#111b33) with crisp perimeter lines to sit atop interactive canvases.
IMAGERY
Visual assets are strictly schematic and vector-based: a silhouette world map filled in dark muted navy, crisp flag emojis or micro SVG national emblems, and outline vector icons. Photographic imagery and illustrative graphics are entirely absent to sustain an austere command-center aesthetic.
SIGNATURE DETAIL — the thing that makes this design itself
The glowing cyan vector flight-arc arching across a dark midnight-blue topographical map, anchored by flag-bearing nodes and a live transit beacon. This visual centerpiece immediately communicates an executive supply-chain command hub; misusing it by adding complex multi-colored routes or realistic satellite terrain would destroy the minimal radar-like clarity.
MUST
- Anchor card boundaries with exactly 1px borders in #1b253b to preserve structure on dark backgrounds.
- Use solid electric cyan (#38bdf8) exclusively for the primary CTA, active navigation, and primary map vectors.
- Encase status labels in fully rounded pills (999px radius) with soft 15% opacity matching tints.
- Keep typography strictly sans-serif and tabular numerals enabled for all operational metric counts.
AVOID
- Do not use drop shadows or heavy blur elevation; structure must be achieved purely through border lines and fill contrast.
- Avoid stark saturated red or green fills for large surfaces; confine them to micro badges, dots, and graph segments.
- Do not use serif or expressive display typography anywhere in telemetry readouts.
- Never place white card backgrounds on this canvas; all modules must remain deep navy-slate.
OUTPUT
Render as a clean, pixel-crisp UI design at roughly 2784:2960. Flat vector rendering, real legible text, no browser chrome, no device mockup frame, no watermark, no lorem ipsum placeholder blocks. 在 DraPub 中尝试 
