Redesign shell with glass morphism and warm clay palette

Update design system: warm clay accent (#c96442), ink scale for text
hierarchy, glass surface tokens with alpha, redesigned spacing/radius
tokens. Restructure shell layout: sidebar and main pane as rounded
glass panels, pill-shaped omnibar inside main pane, workspace tiles,
section labels, profile avatar in sidebar footer.

crates/ely_design_system/src/colors.rs

@@ -1,14 +1,46 @@
-pub const PRIMARY: u32 = 0xf54e00;
-pub const PRIMARY_ACTIVE: u32 = 0xd04200;
-pub const INK: u32 = 0x26251e;
-pub const BODY: u32 = 0x5a5852;
-pub const MUTED: u32 = 0x807d72;
-pub const MUTED_SOFT: u32 = 0xa09c92;
-pub const HAIRLINE: u32 = 0xe6e5e0;
-pub const HAIRLINE_STRONG: u32 = 0xcfcdc4;
-pub const CANVAS: u32 = 0xf7f7f4;
+// Ink scale — text hierarchy with warm undertones
+pub const INK: u32 = 0x1d1c1a;
+pub const INK_2: u32 = 0x3a3733;
+pub const INK_3: u32 = 0x6b6660;
+pub const INK_4: u32 = 0x9a948c;
+pub const INK_5: u32 = 0xc8c2b8;
+
+// Glass surfaces — semi-transparent whites (use with rgba)
+pub const GLASS: u32 = 0xffffff9e; // 62% white
+pub const GLASS_2: u32 = 0xffffffc7; // 78% white
+pub const GLASS_3: u32 = 0xffffffeb; // 92% white
+pub const TINT: u32 = 0xffffff6b; // 42% white
+
+// Stroke & divider — subtle borders (use with rgba)
+pub const STROKE: u32 = 0x281e1414; // 8% warm dark
+pub const STROKE_2: u32 = 0x281e140a; // 4% warm dark
+pub const DIVIDER: u32 = 0x281e140f; // 6% warm dark
+
+// Accent — warm clay palette
+pub const ACCENT: u32 = 0xc96442;
+pub const ACCENT_LIGHT: u32 = 0xd97757;
+pub const ACCENT_HOVER: u32 = 0xc9644214; // 8% opacity for row highlights
+
+// Secondary accents
+pub const VIOLET: u32 = 0x7c6cf7;
+pub const ROSE: u32 = 0xec6a8e;
+pub const MINT: u32 = 0x4fb59a;
+
+// Canvas backgrounds (opaque fallbacks)
+pub const CANVAS: u32 = 0xf0eee9;
 pub const CANVAS_SOFT: u32 = 0xfafaf7;
 pub const SURFACE_CARD: u32 = 0xffffff;
-pub const SURFACE_STRONG: u32 = 0xe6e5e0;
-pub const SUCCESS: u32 = 0x1f8a65;
+
+// Semantic
+pub const SUCCESS: u32 = 0x2f7d68;
 pub const ERROR: u32 = 0xcf2d56;
+
+// Legacy aliases — preserved for compatibility during migration
+pub const PRIMARY: u32 = ACCENT;
+pub const PRIMARY_ACTIVE: u32 = 0xb55a3c;
+pub const BODY: u32 = INK_2;
+pub const MUTED: u32 = INK_3;
+pub const MUTED_SOFT: u32 = INK_4;
+pub const HAIRLINE: u32 = 0xe6e5e0;
+pub const HAIRLINE_STRONG: u32 = 0xcfcdc4;
+pub const SURFACE_STRONG: u32 = 0xe6e5e0;

crates/ely_design_system/src/lib.rs

@@ -22,10 +22,10 @@ pub const ELY_THEME: Theme = Theme {
     canvas_soft: colors::CANVAS_SOFT,
     surface: colors::SURFACE_CARD,
     ink: colors::INK,
-    body: colors::BODY,
-    muted: colors::MUTED,
+    body: colors::INK_2,
+    muted: colors::INK_3,
     hairline: colors::HAIRLINE,
-    accent: colors::PRIMARY,
+    accent: colors::ACCENT,
     success: colors::SUCCESS,
     error: colors::ERROR,
 };

crates/ely_design_system/src/spacing.rs

@@ -6,6 +6,18 @@ pub const MD: f32 = 20.0;
 pub const LG: f32 = 24.0;
 pub const XL: f32 = 32.0;
 pub const XXL: f32 = 48.0;
-pub const SIDEBAR_WIDTH: f32 = 280.0;
+
+pub const SIDEBAR_WIDTH: f32 = 256.0;
 pub const SIDEBAR_COLLAPSED_WIDTH: f32 = 56.0;
-pub const COMMAND_BAR_HEIGHT: f32 = 64.0;
+pub const SHELL_INSET: f32 = 16.0;
+pub const SIDEBAR_MAIN_GAP: f32 = 12.0;
+pub const TOPBAR_HEIGHT: f32 = 54.0;
+pub const OMNIBAR_HEIGHT: f32 = 36.0;
+pub const COMMAND_BAR_HEIGHT: f32 = 54.0;
+
+pub const RADIUS_CARD: f32 = 18.0;
+pub const RADIUS_PANE: f32 = 14.0;
+pub const RADIUS_PILL: f32 = 999.0;
+pub const RADIUS_NAV: f32 = 8.0;
+pub const RADIUS_BUTTON: f32 = 8.0;
+pub const RADIUS_INPUT: f32 = 9.0;

crates/ely_design_system/src/typography.rs

@@ -5,10 +5,14 @@ pub struct TypeToken {
     pub weight: u16,
 }
 
-pub const DISPLAY_MD: TypeToken = TypeToken { size_px: 26.0, line_height: 1.25, weight: 400 };
-
-pub const TITLE_MD: TypeToken = TypeToken { size_px: 18.0, line_height: 1.4, weight: 600 };
-
-pub const BODY_MD: TypeToken = TypeToken { size_px: 16.0, line_height: 1.5, weight: 400 };
-
-pub const CAPTION: TypeToken = TypeToken { size_px: 13.0, line_height: 1.4, weight: 400 };
+pub const HERO: TypeToken = TypeToken { size_px: 64.0, line_height: 1.05, weight: 400 };
+pub const DISPLAY_LG: TypeToken = TypeToken { size_px: 48.0, line_height: 1.05, weight: 400 };
+pub const DISPLAY_MD: TypeToken = TypeToken { size_px: 34.0, line_height: 1.1, weight: 400 };
+pub const TITLE_LG: TypeToken = TypeToken { size_px: 22.0, line_height: 1.3, weight: 400 };
+pub const TITLE_MD: TypeToken = TypeToken { size_px: 18.0, line_height: 1.4, weight: 500 };
+pub const BODY_LG: TypeToken = TypeToken { size_px: 16.0, line_height: 1.5, weight: 400 };
+pub const BODY_MD: TypeToken = TypeToken { size_px: 14.0, line_height: 1.5, weight: 400 };
+pub const LABEL: TypeToken = TypeToken { size_px: 13.0, line_height: 1.4, weight: 500 };
+pub const CAPTION: TypeToken = TypeToken { size_px: 12.0, line_height: 1.4, weight: 500 };
+pub const SECTION_LABEL: TypeToken = TypeToken { size_px: 10.5, line_height: 1.4, weight: 500 };
+pub const META: TypeToken = TypeToken { size_px: 10.0, line_height: 1.4, weight: 500 };