/* Surface ownership: a light board stays light with dark ink, even in a dark surround.
   Do not apply blanket foreground changes to puzzle cells, tokens, SVGs or canvas. */
html body[data-play-game]{--ui-surface:#f5f6e9;--ui-raised:#fffaf0;--ui-ink:#233d35;--ui-muted:#466357;--ui-border:#718a78;--ui-action:#285c4c;--ui-action-ink:#ffffff;--ui-focus:#9b3450}
html[data-mode=dark] body[data-play-game]{--ui-surface:#142e26;--ui-raised:#203e32;--ui-ink:#f3f8e8;--ui-muted:#c4d7c7;--ui-border:#7a9c88;--ui-action:#285c4c;--ui-action-ink:#ffffff;--ui-focus:#ffd09b}
/* Legacy puzzle shells consume one consistent token set in Original and seasonal scenery. */
html body[data-play-game]:is([data-play-game=chroma],[data-play-game=cross],[data-play-game=logic],[data-play-game=sudoku],[data-play-game=mind]){
 --ink:var(--ui-ink);--muted:var(--ui-muted);--paper:var(--ui-surface);--panel:var(--ui-raised);--line:var(--ui-border);
}
html body[data-play-game] :is(.shell,.game-shell):not(.universe-shell){color:var(--ui-ink)!important;background:var(--ui-surface)!important}
html body[data-play-game]:not(.eyes-universe) :is(.shell,.game-shell) :is(.panel,.play-panel,.aside,.game-guide){background:var(--ui-surface)!important;color:var(--ui-ink)!important;border-color:var(--ui-border)!important}
html body[data-play-game]:not(.eyes-universe) :is(.shell,.game-shell) :is(.hero,.intro,.aside,.game-guide,.panel,.play-panel) :is(h1,h2,h3,p,li,label,summary,.small,.rule,.message,.timer,.statusline,.run-status,.cross-stats,.eyebrow,.edition):not(:where(button *,a *,#board *,#cross-board *,.palette *)){
 color:var(--ui-ink)!important;-webkit-text-fill-color:var(--ui-ink)!important;opacity:1;
}
/* Ordinary controls own both their background and every label, including native options. */
html body[data-play-game] :is(.shell,.game-shell,.glade-page) :is(.toolbar,.tools,.bottom-tools,.brushes,.game-tabs,.dialogactions,.launch,.start-bar,.pot-options,.lesson-actions,.detail-actions) :is(button,select),
html body[data-play-game=glade] :is(.layout,.start-bar,nav[aria-label=Activity]) :is(button,select){
 background:var(--ui-raised)!important;background-image:none!important;color:var(--ui-ink)!important;-webkit-text-fill-color:var(--ui-ink)!important;border-color:var(--ui-border)!important;opacity:1;
}
html body[data-play-game] :is(.shell,.game-shell) :is(.toolbar,.tools,.bottom-tools,.brushes,.game-tabs,.dialogactions,.launch) :is(button,select) :is(span,small,b,strong),
html body[data-play-game=glade] :is(.layout,.start-bar) button :is(span,small,b,strong){color:inherit!important;-webkit-text-fill-color:inherit!important}
html body[data-play-game] :is(.shell,.game-shell) :is(.tools,.brushes,.game-tabs) button:is([aria-pressed=true],.active),
html body[data-play-game] :is(.shell,.game-shell) button.primary,
html body[data-play-game=glade] :is(.layout,.start-bar,nav[aria-label=Activity]) button:is([aria-pressed=true],.gold,.play-now){
 background:var(--ui-action)!important;color:var(--ui-action-ink)!important;-webkit-text-fill-color:var(--ui-action-ink)!important;border-color:var(--ui-border)!important;
}
html body[data-play-game] :is(.shell,.game-shell) :is(.toolbar,.tools,.bottom-tools,.brushes,.game-tabs) button:disabled{opacity:1!important;background:#dce3d7!important;color:#40594c!important;-webkit-text-fill-color:#40594c!important;border-style:dashed!important}
/* Stable light gameplay islands. The original colour values remain untouched. */
html body[data-play-game]:is([data-play-game=chroma],[data-play-game=cross],[data-play-game=logic],[data-play-game=sudoku]) #board{background:#fffdf8;color:#23433a}
html body[data-play-game]:is([data-play-game=chroma],[data-play-game=cross],[data-play-game=logic],[data-play-game=sudoku]) :is(.palette,.swatch){color:#23433a!important;-webkit-text-fill-color:#23433a!important}
html body[data-play-game] .palette :is(small,.label,.key,.count){color:#23433a!important;-webkit-text-fill-color:#23433a!important}
html body[data-play-game] .palette :is(button,.swatch){background:#fffaf0!important;color:#23433a!important;-webkit-text-fill-color:#23433a!important}
html body[data-play-game] #board :is(.digit,.notes,.pencil i){color:#23433a!important;-webkit-text-fill-color:#23433a!important}
html body[data-play-game=cross] #cross-board .cross-clue{background:#eaf0e3!important;color:#23433a!important;-webkit-text-fill-color:#23433a!important}
html body[data-play-game=cross] #cross-board .cross-clue.done{background:#d4e5c7!important;color:#215d39!important;-webkit-text-fill-color:#215d39!important}
html body[data-play-game]:is([data-play-game=chroma],[data-play-game=cross],[data-play-game=logic],[data-play-game=sudoku]) :is(#finish,#end,.win,#pause-veil,.veil,#example){background:#e8f0df!important;color:#23433a!important;-webkit-text-fill-color:#23433a!important}
html body[data-play-game]:is([data-play-game=chroma],[data-play-game=cross],[data-play-game=logic],[data-play-game=sudoku]) :is(#finish,#end,.win,#pause-veil,.veil,#example) :is(h2,h3,p,span,small,b,strong){color:#23433a!important;-webkit-text-fill-color:#23433a!important}
/* Mind Lab: fixed dark puzzle surface, paired light ink and input text. */
html body[data-play-game=mind] .wrap{background:var(--ui-surface)!important;color:var(--ui-ink)!important;--lime:var(--ui-ink)}
html body[data-play-game=mind] :is(.hero,.launch,.how,.modes,.run-toolbar,.run-stats) :is(h1,h2,h3,p,label,summary,small,.small,.eyebrow,.key){color:var(--ui-ink)!important;-webkit-text-fill-color:var(--ui-ink)!important}
html body[data-play-game=mind] .modes article{background:var(--ui-raised)!important;color:var(--ui-ink)!important}
html body[data-play-game=mind] .challenge{background:#20382f!important;--ink:#f3f8e8;--muted:#c4d7c7;--lime:#d0dfa9;color:#f3f8e8!important}
html body[data-play-game=mind] .challenge :is(h2,h3,p,label,.small,.operations span,.feedback,.feedback b){color:#f3f8e8!important;-webkit-text-fill-color:#f3f8e8!important}
html body[data-play-game=mind] input:not([type=checkbox]):not([type=radio]){background:#14251f!important;color:#f3f8e8!important;-webkit-text-fill-color:#f3f8e8!important;caret-color:#f3f8e8}
html body[data-play-game=mind] input::placeholder{color:#c4d7c7!important;opacity:1}
html body[data-play-game=mind] .challenge .feedback.error{background:#482e2b!important;color:#ffe4dc!important;-webkit-text-fill-color:#ffe4dc!important}
/* Glade: themed text panels; forest artwork and dark dialogs retain light labels. */
html body[data-play-game=glade] :is(.layout>section,.layout>aside,.start-bar,.path,.choice,.journal div){background:var(--ui-surface)!important;color:var(--ui-ink)!important;border-color:var(--ui-border)!important}
html body[data-play-game=glade] :is(.layout,.start-bar) :is(h2,h3,p,li,summary,label,strong,small,.fine,.goal,.family,#message,#lesson-position){color:var(--ui-ink)!important;-webkit-text-fill-color:var(--ui-ink)!important}
html body[data-play-game=glade] #inventory span{background:#203e32!important;color:#f3f8e8!important;-webkit-text-fill-color:#f3f8e8!important}
html body[data-play-game=glade] dialog{background:#142f29!important;color:#f3f8e8!important}
html body[data-play-game=glade] dialog :is(h2,h3,p,label,li,small,strong,summary,#lesson-position){color:#f3f8e8!important;-webkit-text-fill-color:#f3f8e8!important}
html body[data-play-game=glade] dialog .forage-memory>span{background:#fffaf0!important;color:#23433a!important;-webkit-text-fill-color:#23433a!important}
html body[data-play-game=glade] dialog .forage-memory small{color:#23433a!important;-webkit-text-fill-color:#23433a!important}
/* STILL drawing controls stay light regardless of the surrounding theme or canvas palette. */
html body[data-play-game=still] #toolbar{background:#fffaf0!important;color:#23433a!important}
html body[data-play-game=still] #toolbar :is(label,output,.studio-actions>span){color:#23433a!important;-webkit-text-fill-color:#23433a!important}
html body[data-play-game=still] #toolbar :is(select,option){background:#fffaf0!important;color:#23433a!important;-webkit-text-fill-color:#23433a!important;color-scheme:light}
html body[data-play-game=still] #toolbar button:not(.studio-swatch){background:#fffaf0!important;color:#23433a!important;-webkit-text-fill-color:#23433a!important;border-color:#718a78!important}
html body[data-play-game=still] #toolbar button:not(.studio-swatch):is([aria-pressed=true],.studio-save){background:#285c4c!important;color:#ffffff!important;-webkit-text-fill-color:#ffffff!important}
html body[data-play-game=still] #toolbar button:not(.studio-swatch):disabled{background:#dce3d7!important;color:#40594c!important;-webkit-text-fill-color:#40594c!important;opacity:1!important;border-style:dashed!important}
/* Different Eyes: pale gameplay panels need dark labels, but lenses own dark surfaces. */
html body[data-play-game=eyes].eyes-playing :is(.panel,.aside){background:#f1f2e6!important;color:#23433a!important}
html body[data-play-game=eyes].eyes-playing .panel :is(.top,.caption,#lives,#roomtag,#roomtitle,#roomstory,#steps,#best,#boardview,.bridge-note){color:#23433a!important;-webkit-text-fill-color:#23433a!important}
html body[data-play-game=eyes].eyes-playing .panel select{background:#fffaf0!important;color:#23433a!important;-webkit-text-fill-color:#23433a!important;color-scheme:light}
html body[data-play-game=eyes].eyes-playing .lens{background:#233c38!important;color:#f3f8e8!important;-webkit-text-fill-color:#f3f8e8!important}
html body[data-play-game=eyes].eyes-playing .lens small{color:#f3f8e8!important;-webkit-text-fill-color:#f3f8e8!important}
html body[data-play-game=eyes].eyes-playing .lens.on{background:#d6e4b6!important;color:#23433a!important;-webkit-text-fill-color:#23433a!important;outline:2px solid #23433a}
html body[data-play-game=eyes].eyes-playing .lens.on small{color:#23433a!important;-webkit-text-fill-color:#23433a!important}
/* Native menus and dialogs must not inherit mismatched OS or page foreground colours. */
html body[data-play-game] #play-appearance{background:var(--ui-surface)!important;color:var(--ui-ink)!important}
html body[data-play-game] #play-appearance select{background:var(--ui-raised)!important;color:var(--ui-ink)!important;-webkit-text-fill-color:var(--ui-ink)!important}
html[data-mode=dark] body[data-play-game] #play-appearance select{color-scheme:dark}
html[data-mode=light] body[data-play-game] #play-appearance select{color-scheme:light}
html body[data-play-game] :is(.shell,.game-shell) dialog{background:var(--ui-surface)!important;color:var(--ui-ink)!important}
html body[data-play-game] :is(.shell,.game-shell) dialog :is(h2,h3,p,label,li,small){color:var(--ui-ink)!important;-webkit-text-fill-color:var(--ui-ink)!important}
html body[data-play-game] :is(.shell,.game-shell) dialog button{background:var(--ui-raised)!important;color:var(--ui-ink)!important;-webkit-text-fill-color:var(--ui-ink)!important}
/* Small helper cards are intentionally cream inside either appearance. */
html body[data-play-game] :is(.shell,.game-shell) :is(.panel,.play-panel) :is(.hint-coach,.character-preview){background:#fffaf0!important;color:#23433a!important}
html body[data-play-game] :is(.shell,.game-shell) :is(.panel,.play-panel) :is(.hint-coach,.character-preview) :is(p,b,span,small){color:#23433a!important;-webkit-text-fill-color:#23433a!important}
html body[data-play-game] .premium-controls :is(label,.statline,.muted){color:var(--ui-ink)!important;-webkit-text-fill-color:var(--ui-ink)!important}
html body[data-play-game] .premium-controls :is(button,select){background:var(--ui-raised)!important;color:var(--ui-ink)!important;-webkit-text-fill-color:var(--ui-ink)!important;border-color:var(--ui-border)!important}
html body[data-play-game] .premium-controls button[aria-pressed=true]{background:#285c4c!important;color:#ffffff!important;-webkit-text-fill-color:#ffffff!important}
html body[data-play-game=mind] :is(.run-toolbar,.run-stats,.final-score),html body[data-play-game=mind] .run-toolbar span{color:var(--ui-ink)!important;-webkit-text-fill-color:var(--ui-ink)!important}
html body[data-play-game=mind] .wrap button.primary{background:#285c4c!important;color:#ffffff!important;-webkit-text-fill-color:#ffffff!important;border-color:#7a9c88!important}
html body[data-play-game=mind] dialog{background:#20382f!important;color:#f3f8e8!important;--ink:#f3f8e8;--muted:#c4d7c7;--lime:#d0dfa9}
html body[data-play-game=mind] dialog :is(h2,h3,p,li,small,label,.final-score){color:#f3f8e8!important;-webkit-text-fill-color:#f3f8e8!important}
html body[data-play-game] :is(.run-status,.statusline) .lost{color:#9b3343!important;-webkit-text-fill-color:#9b3343!important}
html[data-mode=dark] body[data-play-game] :is(.run-status,.statusline) .lost{color:#ffc9bc!important;-webkit-text-fill-color:#ffc9bc!important}
html body[data-play-game=cross] #end.failed{background:#fff0e9!important;color:#87303c!important;-webkit-text-fill-color:#87303c!important}
html body[data-play-game=cross] #end.failed :is(h2,p,span,small){color:#87303c!important;-webkit-text-fill-color:#87303c!important}
html body[data-play-game] :is(.shell,.game-shell,.wrap) :is(button,select,input):focus-visible{outline:3px solid var(--ui-focus)!important;outline-offset:3px}
