diff --git a/sojorn_app/lib/screens/compose/image_editor_screen.dart b/sojorn_app/lib/screens/compose/image_editor_screen.dart
index dabe989..716421b 100644
--- a/sojorn_app/lib/screens/compose/image_editor_screen.dart
+++ b/sojorn_app/lib/screens/compose/image_editor_screen.dart
@@ -8,6 +8,7 @@ import 'package:path_provider/path_provider.dart';
 import 'package:pro_image_editor/pro_image_editor.dart';
 
 import '../../models/sojorn_media_result.dart';
+import '../../theme/tokens.dart';
 import '../../theme/app_theme.dart';
 
 class sojornImageEditor extends StatelessWidget {
@@ -32,8 +33,8 @@ class sojornImageEditor extends StatelessWidget {
   ThemeData _buildEditorTheme() {
     final baseTheme = ThemeData.dark(useMaterial3: true);
     final textTheme = GoogleFonts.interTextTheme(baseTheme.textTheme).apply(
-      bodyColor: Colors.white,
-      displayColor: Colors.white,
+      bodyColor: SojornColors.basicWhite,
+      displayColor: SojornColors.basicWhite,
     );
 
     return baseTheme.copyWith(
@@ -42,18 +43,18 @@ class sojornImageEditor extends StatelessWidget {
         primary: AppTheme.brightNavy,
         secondary: AppTheme.brightNavy,
         surface: _matteBlack,
-        onSurface: Colors.white,
+        onSurface: SojornColors.basicWhite,
       ),
       textTheme: textTheme,
-      iconTheme: const IconThemeData(color: Colors.white),
+      iconTheme: const IconThemeData(color: SojornColors.basicWhite),
       appBarTheme: const AppBarTheme(
         backgroundColor: _matteBlack,
-        foregroundColor: Colors.white,
+        foregroundColor: SojornColors.basicWhite,
         elevation: 0,
       ),
       sliderTheme: baseTheme.sliderTheme.copyWith(
         activeTrackColor: AppTheme.brightNavy,
-        inactiveTrackColor: Colors.white24,
+        inactiveTrackColor: SojornColors.basicWhite.withValues(alpha: 0.24),
         thumbColor: AppTheme.brightNavy,
         overlayColor: AppTheme.brightNavy.withOpacity(0.2),
       ),
@@ -211,7 +212,7 @@ class sojornImageEditor extends StatelessWidget {
       body: Center(
         child: Text(
           message,
-          style: const TextStyle(color: Colors.white),
+          style: const TextStyle(color: SojornColors.basicWhite),
         ),
       ),
     );
diff --git a/sojorn_app/lib/widgets/traditional_quips_sheet.dart b/sojorn_app/lib/widgets/traditional_quips_sheet.dart
index 4162e75..9740b53 100644
--- a/sojorn_app/lib/widgets/traditional_quips_sheet.dart
+++ b/sojorn_app/lib/widgets/traditional_quips_sheet.dart
@@ -12,6 +12,7 @@ import '../models/thread_node.dart';
 import '../providers/api_provider.dart';
 import '../services/auth_service.dart';
 import '../theme/app_theme.dart';
+import '../theme/tokens.dart';
 import '../widgets/media/signed_media_image.dart';
 import '../widgets/reactions/reactions_display.dart';
 import '../widgets/reactions/reaction_picker.dart';
@@ -187,7 +188,7 @@ class _TraditionalQuipsSheetState extends ConsumerState<TraditionalQuipsSheet> {
           TextButton(onPressed: () => Navigator.pop(context, false), child: const Text('Cancel')),
           TextButton(
             onPressed: () => Navigator.pop(context, true),
-            child: const Text('Delete', style: TextStyle(color: Colors.redAccent)),
+            child: const Text('Delete', style: TextStyle(color: SojornColors.destructive)),
           ),
         ],
       ),
@@ -270,7 +271,7 @@ class _TraditionalQuipsSheetState extends ConsumerState<TraditionalQuipsSheet> {
             borderRadius: const BorderRadius.vertical(top: Radius.circular(24)),
             boxShadow: [
               BoxShadow(
-                color: Colors.black.withOpacity(0.1),
+                color: SojornColors.overlayScrim,
                 blurRadius: 40,
                 offset: const Offset(0, -10),
               ),
@@ -376,7 +377,7 @@ class _TraditionalQuipsSheetState extends ConsumerState<TraditionalQuipsSheet> {
                   ),
                   const Spacer(),
                   IconButton(
-                    icon: const Icon(Icons.delete_outline, color: Colors.redAccent),
+                    icon: const Icon(Icons.delete_outline, color: SojornColors.destructive),
                     onPressed: _bulkDelete,
                   ),
                 ]
@@ -398,7 +399,7 @@ class _TraditionalQuipsSheetState extends ConsumerState<TraditionalQuipsSheet> {
           child: Column(
             mainAxisAlignment: MainAxisAlignment.center,
             children: [
-              const Icon(Icons.error_outline, color: Colors.redAccent, size: 48),
+              const Icon(Icons.error_outline, color: SojornColors.destructive, size: 48),
               const SizedBox(height: 16),
               Text('Error: $_error', style: TextStyle(color: AppTheme.navyText), textAlign: TextAlign.center),
             ],
@@ -543,8 +544,8 @@ class _TraditionalQuipsSheetState extends ConsumerState<TraditionalQuipsSheet> {
                     ],
                   ),
                   child: _isPosting 
-                    ? const SizedBox(width: 20, height: 20, child: CircularProgressIndicator(strokeWidth: 2, color: Colors.white))
-                    : const Icon(Icons.send, color: Colors.white, size: 20),
+                    ? const SizedBox(width: 20, height: 20, child: CircularProgressIndicator(strokeWidth: 2, color: SojornColors.basicWhite))
+                    : const Icon(Icons.send, color: SojornColors.basicWhite, size: 20),
                 ),
               ),
             ],
@@ -609,7 +610,7 @@ class _CommentTile extends StatelessWidget {
             boxShadow: [
               if (!isSelected)
                 BoxShadow(
-                  color: Colors.black.withOpacity(0.02),
+                  color: SojornColors.basicBlack.withValues(alpha: 0.02),
                   blurRadius: 10,
                   offset: const Offset(0, 4),
                 ),
@@ -705,7 +706,7 @@ class _CommentTile extends StatelessWidget {
                     icon: Icon(
                       node.post.isLiked == true ? Icons.favorite : Icons.favorite_border,
                       size: 20,
-                      color: node.post.isLiked == true ? Colors.redAccent : AppTheme.textSecondary.withOpacity(0.2),
+                      color: node.post.isLiked == true ? SojornColors.destructive : AppTheme.textSecondary.withOpacity(0.2),
                     ),
                     onPressed: () => onReaction('❤️'),
                     visualDensity: VisualDensity.compact,
@@ -768,9 +769,9 @@ class _CommentTile extends StatelessWidget {
             value: 'delete', 
             child: Row(
               children: [
-                Icon(Icons.delete_outline, size: 18, color: Colors.redAccent),
+                Icon(Icons.delete_outline, size: 18, color: SojornColors.destructive),
                 const SizedBox(width: 12),
-                const Text('Delete', style: TextStyle(color: Colors.redAccent)),
+                const Text('Delete', style: TextStyle(color: SojornColors.destructive)),
               ],
             )
           ),
diff --git a/sojorn_app/lib/widgets/video_player_with_comments.dart b/sojorn_app/lib/widgets/video_player_with_comments.dart
index dd72c65..13d1cb8 100644
--- a/sojorn_app/lib/widgets/video_player_with_comments.dart
+++ b/sojorn_app/lib/widgets/video_player_with_comments.dart
@@ -3,6 +3,7 @@ import 'package:google_fonts/google_fonts.dart';
 import 'package:video_player/video_player.dart';
 import '../../models/post.dart';
 import '../../theme/app_theme.dart';
+import '../../theme/tokens.dart';
 import 'video_comments_sheet.dart';
 import 'media/signed_media_image.dart';
 
@@ -70,7 +71,7 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
   @override
   Widget build(BuildContext context) {
     return Container(
-      color: Colors.black,
+      color: SojornColors.basicBlack,
       child: Stack(
         children: [
           // Video player
@@ -109,7 +110,7 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
             // Loading indicator
             const Center(
               child: CircularProgressIndicator(
-                valueColor: AlwaysStoppedAnimation<Color>(Colors.white),
+                valueColor: AlwaysStoppedAnimation<Color>(SojornColors.basicWhite),
               ),
             ),
           ],
@@ -147,10 +148,10 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
             begin: Alignment.topCenter,
             end: Alignment.bottomCenter,
             colors: [
-              Colors.black.withValues(alpha: 0.3),
-              Colors.transparent,
-              Colors.transparent,
-              Colors.black.withValues(alpha: 0.5),
+              const Color(0x4D000000),
+              SojornColors.transparent,
+              SojornColors.transparent,
+              const Color(0x80000000),
             ],
           ),
         ),
@@ -162,14 +163,14 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
                 children: [
                   IconButton(
                     onPressed: () => Navigator.of(context).pop(),
-                    icon: const Icon(Icons.arrow_back, color: Colors.white),
+                    icon: const Icon(Icons.arrow_back, color: SojornColors.basicWhite),
                   ),
                   const Spacer(),
                   IconButton(
                     onPressed: () {
                       // TODO: More options
                     },
-                    icon: const Icon(Icons.more_vert, color: Colors.white),
+                    icon: const Icon(Icons.more_vert, color: SojornColors.basicWhite),
                   ),
                 ],
               ),
@@ -192,7 +193,7 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
                     },
                     icon: Icon(
                       _isPlaying ? Icons.pause : Icons.play_arrow,
-                      color: Colors.white,
+                      color: SojornColors.basicWhite,
                       size: 48,
                     ),
                   ),
@@ -205,9 +206,9 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
                         _videoController!,
                         allowScrubbing: true,
                         colors: const VideoProgressColors(
-                          playedColor: Colors.white,
-                          backgroundColor: Colors.white24,
-                          bufferedColor: Colors.white38,
+                          playedColor: SojornColors.basicWhite,
+                          backgroundColor: SojornColors.basicWhite.withValues(alpha: 0.24),
+                          bufferedColor: SojornColors.basicWhite.withValues(alpha: 0.38),
                         ),
                       ),
                     ),
@@ -219,7 +220,7 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
                     child: Text(
                       _formatDuration(_videoController?.value.position) ?? '0:00',
                       style: GoogleFonts.inter(
-                        color: Colors.white,
+                        color: SojornColors.basicWhite,
                         fontSize: 12,
                       ),
                     ),
@@ -279,12 +280,12 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
           width: 48,
           height: 48,
           decoration: BoxDecoration(
-            color: Colors.black.withValues(alpha: 0.3),
+            color: const Color(0x4D000000),
             shape: BoxShape.circle,
           ),
           child: IconButton(
             onPressed: onTap,
-            icon: Icon(icon, color: Colors.white, size: 24),
+            icon: Icon(icon, color: SojornColors.basicWhite, size: 24),
           ),
         ),
         if (count != null) ...[
@@ -292,7 +293,7 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
           Text(
             count > 999 ? '${(count / 1000).toStringAsFixed(1)}k' : count.toString(),
             style: GoogleFonts.inter(
-              color: Colors.white,
+              color: SojornColors.basicWhite,
               fontSize: 12,
               fontWeight: FontWeight.w600,
             ),
@@ -336,7 +337,7 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
                               ? widget.post.author!.displayName![0].toUpperCase()
                               : '?',
                           style: GoogleFonts.inter(
-                            color: Colors.white,
+                            color: SojornColors.basicWhite,
                             fontWeight: FontWeight.bold,
                             fontSize: 12,
                           ),
@@ -350,7 +351,7 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
                   widget.post.author?.handle ?? 
                   'Anonymous',
                   style: GoogleFonts.inter(
-                    color: Colors.white,
+                    color: SojornColors.basicWhite,
                     fontWeight: FontWeight.w600,
                     fontSize: 14,
                   ),
@@ -365,7 +366,7 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
           Text(
             widget.post.body,
             style: GoogleFonts.inter(
-              color: Colors.white,
+              color: SojornColors.basicWhite,
               fontSize: 14,
               height: 1.4,
             ),
@@ -383,7 +384,7 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
     showModalBottomSheet(
       context: context,
       isScrollControlled: true,
-      backgroundColor: Colors.transparent,
+      backgroundColor: SojornColors.transparent,
       builder: (context) => VideoCommentsSheet(
         postId: widget.post.id,
         initialCommentCount: _commentCount,