2323 --dream-task-immersive-sidebar : color-mix (in oklab, var (--dream-sidebar ) 72% , transparent);
2424 --dream-immersive-composer : color-mix (in oklab, var (--dream-surface-raised ) 76% , var (--dream-accent ) 4% );
2525 --dream-immersive-line : color-mix (in oklab, var (--dream-line ) 76% , transparent);
26- --dream-task-immersive-edge : color-mix (in oklab, var (--dream-surface ) 86% , transparent);
27- --dream-task-immersive-mid : color-mix (in oklab, var (--dream-surface ) 78% , transparent);
28- --dream-task-immersive-far : color-mix (in oklab, var (--dream-surface ) 66% , transparent);
26+ /* Lighter task wash so the wallpaper stays visible and text is not under a heavy fog. */
27+ --dream-task-immersive-edge : color-mix (in oklab, var (--dream-surface ) 62% , transparent);
28+ --dream-task-immersive-mid : color-mix (in oklab, var (--dream-surface ) 40% , transparent);
29+ --dream-task-immersive-far : color-mix (in oklab, var (--dream-surface ) 22% , transparent);
2930}
3031
3132: root .codex-dream-skin .dream-theme-dark {
5051 --dream-task-immersive-sidebar : color-mix (in oklab, var (--dream-sidebar ) 70% , transparent);
5152 --dream-immersive-composer : color-mix (in oklab, var (--dream-surface-raised ) 88% , var (--dream-accent ) 5% );
5253 --dream-immersive-line : color-mix (in oklab, var (--dream-line ) 82% , transparent);
53- --dream-task-immersive-edge : color-mix (in oklab, var (--dream-surface ) 82 % , transparent);
54- --dream-task-immersive-mid : color-mix (in oklab, var (--dream-surface ) 74 % , transparent);
55- --dream-task-immersive-far : color-mix (in oklab, var (--dream-surface ) 60 % , transparent);
54+ --dream-task-immersive-edge : color-mix (in oklab, var (--dream-surface ) 58 % , transparent);
55+ --dream-task-immersive-mid : color-mix (in oklab, var (--dream-surface ) 36 % , transparent);
56+ --dream-task-immersive-far : color-mix (in oklab, var (--dream-surface ) 18 % , transparent);
5657}
5758
5859html .codex-dream-skin body {
@@ -134,7 +135,7 @@ html.codex-dream-skin.dream-theme-dark [class~="group/application-menu-top-bar"]
134135}
135136
136137html .codex-dream-skin [role = "main" ] {
137- color : var (--dream-text );
138+ color : var (--dream-text ) !important ;
138139}
139140
140141/* Task routes use the art as a quiet atmospheric layer. Wide banners are shown
@@ -143,6 +144,7 @@ html.codex-dream-skin .dream-task {
143144 position : relative;
144145 isolation : isolate;
145146 min-height : 100% ;
147+ color : var (--dream-text ) !important ;
146148 background : var (--dream-surface ) !important ;
147149}
148150
@@ -187,9 +189,70 @@ html.codex-dream-skin .dream-task > * {
187189 z-index : 1 ;
188190}
189191
192+ /* Task message readability — force theme text over native purple/light tokens
193+ and give bubbles a light panel so copy is not painted directly on the wash. */
190194html .codex-dream-skin .dream-task article ,
191- html .codex-dream-skin .dream-task [data-message-author-role ] {
192- color : var (--dream-text );
195+ html .codex-dream-skin .dream-task [data-message-author-role ],
196+ html .codex-dream-skin [data-message-author-role ],
197+ html .codex-dream-skin article {
198+ color : var (--dream-text ) !important ;
199+ }
200+
201+ html .codex-dream-skin .dream-task article ,
202+ html .codex-dream-skin .dream-task [data-message-author-role ],
203+ html .codex-dream-skin .dream-art-wide : is (.dream-task-ambient , .dream-task-banner )
204+ main .main-surface : not (.dream-home-shell ) article ,
205+ html .codex-dream-skin .dream-art-wide : is (.dream-task-ambient , .dream-task-banner )
206+ main .main-surface : not (.dream-home-shell ) [data-message-author-role ] {
207+ border : 1px solid color-mix (in oklab, var (--dream-line ) 42% , transparent);
208+ border-radius : 16px ;
209+ background : color-mix (in oklab, var (--dream-surface ) 54% , transparent) !important ;
210+ box-shadow : 0 8px 24px color-mix (in oklab, var (--dream-canvas ) 12% , transparent);
211+ backdrop-filter : blur (8px ) saturate (1.04 );
212+ }
213+
214+ html .codex-dream-skin .dream-theme-light .dream-task article ,
215+ html .codex-dream-skin .dream-theme-light .dream-task [data-message-author-role ],
216+ html .codex-dream-skin .dream-theme-light .dream-art-wide : is (.dream-task-ambient , .dream-task-banner )
217+ main .main-surface : not (.dream-home-shell ) article ,
218+ html .codex-dream-skin .dream-theme-light .dream-art-wide : is (.dream-task-ambient , .dream-task-banner )
219+ main .main-surface : not (.dream-home-shell ) [data-message-author-role ] {
220+ background : color-mix (in oklab, var (--dream-surface ) 78% , transparent) !important ;
221+ }
222+
223+ html .codex-dream-skin .dream-task [class *= "text-token" ],
224+ html .codex-dream-skin .dream-art-wide : is (.dream-task-ambient , .dream-task-banner )
225+ main .main-surface : not (.dream-home-shell ) [class *= "text-token" ],
226+ html .codex-dream-skin .dream-art-wide : is (.dream-task-ambient , .dream-task-banner )
227+ main .main-surface : not (.dream-home-shell ) [class *= "_markdown" ] {
228+ color : inherit !important ;
229+ }
230+
231+ html .codex-dream-skin .dream-task [class *= "text-token-text-secondary" ],
232+ html .codex-dream-skin .dream-task [class *= "text-token-text-tertiary" ],
233+ html .codex-dream-skin .dream-task [class *= "text-token-text-secondary" ] * ,
234+ html .codex-dream-skin .dream-task [class *= "text-token-text-tertiary" ] * ,
235+ html .codex-dream-skin .dream-art-wide : is (.dream-task-ambient , .dream-task-banner )
236+ main .main-surface : not (.dream-home-shell ) [class *= "text-token-text-secondary" ],
237+ html .codex-dream-skin .dream-art-wide : is (.dream-task-ambient , .dream-task-banner )
238+ main .main-surface : not (.dream-home-shell ) [class *= "text-token-text-tertiary" ] {
239+ color : var (--dream-text-muted ) !important ;
240+ }
241+
242+ html .codex-dream-skin .dream-theme-dark .dream-art-wide : is (.dream-task-ambient , .dream-task-banner )
243+ main .main-surface : not (.dream-home-shell ) [role = "main" ],
244+ html .codex-dream-skin .dream-theme-dark .dream-art-wide : is (.dream-task-ambient , .dream-task-banner )
245+ main .main-surface : not (.dream-home-shell ) [class *= "_markdown" ] {
246+ text-shadow :
247+ 0 1px 2px color-mix (in oklab, var (--dream-canvas ) 70% , transparent),
248+ 0 0 10px color-mix (in oklab, var (--dream-canvas ) 40% , transparent);
249+ }
250+
251+ html .codex-dream-skin .dream-theme-light .dream-art-wide : is (.dream-task-ambient , .dream-task-banner )
252+ main .main-surface : not (.dream-home-shell ) [role = "main" ],
253+ html .codex-dream-skin .dream-theme-light .dream-art-wide : is (.dream-task-ambient , .dream-task-banner )
254+ main .main-surface : not (.dream-home-shell ) [class *= "_markdown" ] {
255+ text-shadow : none;
193256}
194257
195258/* The home route keeps the source image expressive, with a semantic safe-area
@@ -387,7 +450,7 @@ html.codex-dream-skin button[class~="bg-token-foreground"] {
387450
388451html .codex-dream-skin [data-message-author-role ],
389452html .codex-dream-skin article {
390- color : var (--dream-text );
453+ color : var (--dream-text ) !important ;
391454}
392455
393456/* A 16:9 or wider image is painted once on the native window. The sidebar,
@@ -471,6 +534,7 @@ html.codex-dream-skin.dream-art-wide main.main-surface > header.app-header-tint
471534
472535html .codex-dream-skin .dream-art-wide main .main-surface [role = "main" ] {
473536 background : transparent !important ;
537+ color : var (--dream-text ) !important ;
474538}
475539
476540html .codex-dream-skin .dream-art-wide main .main-surface .dream-home-shell
0 commit comments