Design a dark-mode web interface screen: dark obsidian telemetry calibrated with deep space gradients and luminescent electric blue computing accents.
LAYOUT
The workspace uses an asymmetric dashboard layout structured around a fixed left sidebar (approx. 240px wide) and a fluid main viewport. The top region holds a minimal global utility bar above an expansive hero banner. Below the banner sits a balanced 4-column metric stat row, followed by an asymmetric 3-column mid-tier (line chart, donut breakdown, activity list), resolving into a full-width dense tabular ledger at the page bottom.
PALETTE (use these exact hex values)
- #090d16 — Obsidian Ground: Primary application backdrop and baseline negative space.
- #0f1626 — Card Bed: Background fill for all modular panels, metric tiles, and data tables.
- #1e293b — Subtle Outline: 1px hairline strokes separating cards, list rows, and input perimeters.
- #1d63ed — Cobalt Lumina: Primary action triggers, hero highlight gradients, and active navigation indicators.
- #06b6d4 — Neon Cyan: Model performance telemetry lines and secondary analytics series indicators.
- #8b5cf6 — Signal Violet: Categorical tags, workspace avatar badges, and secondary chart metrics.
- #10b981 — Status Emerald: Positive delta trends, completed job badges, and live operational dots.
- #f43f5e — Thermal Coral: Negative delta metrics, trailing chart lines, and secondary resource alerts.
- #ffffff — Display Pure White: Hero statements, metric values, table titles, and focused text.
- #64748b — Muted Slate: Axis coordinates, subtitles, inactive nav labels, and table metadata.
TYPOGRAPHY
Typeface Inter (or system-ui, -apple-system, Roboto), weights 400/500/600/700. Sizes 11px caption, 12px body-sm, 13px body, 14px body-lg, 16px subheading, 20px heading, 28px display. Tracking -0.02em at display, 0 at body. The typographical voice is algorithmic, authoritative, and frictionless, relying on an ultra-clean neo-grotesque sans-serif. Tight negative letter-spacing on display headers (-0.02em to -0.03em) lends a technical software aesthetic, while body and caption text maintain standard tracking to ensure legible instrumentation data. Standard Inter or Roboto Mono for numbers provides an exact, accessible replacement.
GEOMETRY & SPACING
Corner radii — cards 14px, links 6px, inputs 8px, buttons 8px. Spacing on a 4px unit, 16px gaps, 24px between sections, 1440px container, comfortable density.
DEPTH
Depth is created through luminosity stacking rather than diffused drop shadows. A pure dark canvas (#090d16) supports slightly lightened slate-tinted panels (#0f1626), which are outlined with sharp 1px border lines (#1e293b) to define boundaries. Focal components use deep internal ambient glows, such as the electric blue backlighting behind 3D isometric assets.
IMAGERY
Visual imagery is restricted to dark, luminescent 3D isometric models representing abstract computing infrastructure (e.g., glass cubes, layered glowing nodes, fiber optic reflections). Photography is strictly avoided except for micro-sized circular user profile avatars (24px to 28px). Non-vector graphics must feature dark backgrounds with blue/cyan luminescence to prevent breaking canvas immersion.
SIGNATURE DETAIL — the thing that makes this design itself
The design's signature element is the dark luminescent hero card featuring an electric blue isometric glowing computation cube positioned alongside crisp white technical copy. It immediately reframes an otherwise utilitarian analytics screen into a high-end AI supercomputing workspace. Misusing it involves placing flat photography or high-saturation non-cyan illustrations that clash with the deep dark-mode aesthetic.
MUST
- Use deep obsidian (#090d16) as the baseline canvas and reserve pure white strictly for high-priority numbers and titles.
- Pair every metric card with a thin, low-amplitude sparkline gradient anchoring the bottom edge.
- Enforce a 1px border (#1e293b) across all cards to retain definition against the dark background.
- Keep border radiuses uniform at 14px for main panels and 8px for inner buttons.
AVOID
- Do not introduce pure black (#000000) or high-contrast white panel fills.
- Avoid heavy drop shadows; rely on hairline borders and subtle internal gradients for elevation.
- Do not use high-saturation warm colors (yellow, red) unless communicating system errors or negative trends.
- Never drop card border-radius below 10px or exceed 16px to prevent disrupting the compact engineering feel.
OUTPUT
Render as a clean, pixel-crisp UI design at roughly 3520:2336. Flat vector rendering, real legible text, no browser chrome, no device mockup frame, no watermark, no lorem ipsum placeholder blocks. Try in DraPub 
