Design a dark-mode web interface screen: a midnight aerospace console orchestrating celestial mechanics across luminous dark surfaces with telemetry precision.
LAYOUT
The interface is structured in an asymmetrical desktop dashboard layout with a fixed 240px dark sidebar on the left and a responsive telemetry grid on the right. The top main area leads with a header bar, primary title, simulation actions, and a 4-column metric strip. Below sits a dominant 12-column visualization viewport split 9:3 with floating HUD controls, followed by a secondary 3-column analytics row and a full-width simulation history table.
PALETTE (use these exact hex values)
- #060c18 — Obsidian Deep Base: foundational background fill across the entire viewport and window canvas
- #0c1527 — Card Surface Slate: primary container fill for data panels, telemetry tiles, and simulator stage
- #0e192f — Control Float Surface: semi-elevated overlay panel background for viewport controls and toolbars
- #172338 — Panel Perimeter Line: structural 1px boundary stroke defining cards, dividers, and table rows
- #fbbf24 — Solar Gold: indicates sun status, sun path vectors, and high-noon telemetry metrics
- #38bdf8 — Cosmic Cyan: primary active states, selected tab pills, simulation rings, and daylight segments
- #818cf8 — Twilight Indigo: secondary orbital lines, twilight category tags, and celestial icons
- linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%) — Upgrade Violet Gradient: full background for the premium upgrade CTA button in sidebar
- #f8fafc — Telemetry Pure: high-contrast titles, primary numbers, and active navigation labels
- #94a3b8 — Muted Nebula: card subheadings, table column headers, units, and inactive items
TYPOGRAPHY
Typeface Inter match (or Geist Sans, SF Pro Display, Plus Jakarta Sans), weights 400/500/600/700. Sizes 10px caption, 12px body-sm, 14px body, 16px subheading, 22px heading, 28px display. Tracking -0.02em at display, 0.08em at micro-headers. The typographic tone is ultra-technical, clinical, and scientific, evoking modern aerospace mission control consoles. Tabular numeral tracking ensures coordinates and timestamps align with surgical precision across data tables. Inter (or SF Pro / Geist Sans) provides neutral legibility without distracting stylistic flourishes, balancing micro-scale telemetry labels with punchy bold figures.
GEOMETRY & SPACING
Corner radii — cards 12px, links 4px, inputs 8px, buttons 8px. Spacing on a 4px unit, 16px gaps, 24px between sections, 1440px container, comfortable density.
DEPTH
Elevation is achieved through luminance stepping and crisp 1px borders rather than diffuse drop shadows. The deep canvas (#060c18) sits lowest, cards rise via #0c1527 with #172338 borders, and floating viewport controls hover at #0e192f with subtle internal edge highlights. Interactive states emit ambient radial glows in their respective accent color (cyan or amber) rather than dark drop shadows.
IMAGERY
Imagery is strictly vector-astronomical and 3D simulation based, centered around a detailed orthographic planar Earth projection featuring luminous cyan light-cones and orbital tracks. Surrounding celestial bodies (sun and moon) use stylized geometric forms with localized ambient corona glows. Photography or human imagery is entirely absent and would break the mission-control simulation aesthetic.
SIGNATURE DETAIL — the thing that makes this design itself
The signature element is the focal planar 3D celestial disc illuminated by dual micro-orbiting solar and lunar beacons inside a deep cosmic starfield. This projection stage bridges real-time astrophysics telemetry cards with interactive simulation overlays, characterized by glowing cyan atmospheric rim lighting and concentric trajectory paths.
MUST
- Strictly reserve solar amber (#fbbf24) for sun metrics, solar arcs, and daytime indicators.
- Use 10px or 11px uppercase type with +0.08em letter-spacing for category headers and sub-labels.
- Enclose all data cards in exactly 1px solid borders (#172338) with a 12px corner radius.
- Pair numeric values with their unit symbols (°, %, m) rendered at the same weight and size.
AVOID
- Do not introduce light grey backgrounds or white container cards anywhere on the canvas.
- Never use solar yellow (#fbbf24) for system success or error notifications.
- Avoid thick rounded buttons; keep action buttons strictly at 8px radius or fully rounded pills.
- Do not drop drop-shadows that diffuse widely; rely on 1px borders (#172338) for boundary definition.
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 中尝试 
