/* UI surfaces only. Canvas palettes come from separate stage settings. */
:is(.tour, .zoo-dialog, .wave-floating, #sim-links) {
  background: var(--ui-column-background);
  color: var(--ui-pane-text-start);
  --tour-paper: var(--ui-column-start); --tour-ink: var(--ui-pane-text-start); --tour-muted: var(--ui-pane-text-start); --tour-label: var(--ui-pane-text-start);
  --zoo-ink: var(--ui-pane-text-start); --zoo-muted: var(--ui-pane-text-start);
}
#sim-links { border-radius: 10px; }
.tour.is-collapsed { background: transparent; }
:is(.tour-settings, .tour-now, .zoo-field-notes, .zoo-explore, .experiment-visual, .experiment-stats, .experiment-person, .experiment-joke, .zoo-visual, .wave-study) { background: var(--ui-pane-background); }
:is(.tour, .zoo-dialog) :is(h2, h3, h4, p, li, dt, dd, label, .zoo-symbol, .zoo-tile-name, .experiment-tile > span, .experiment-tile > strong, .experiment-meta, .zoo-eyebrow):not(.sim-hud *, .deck-tip *),
#sim-links a, .tour-kicker, .tour-settings > summary, .zoo-field-notes > summary, .stage-explainers-toggle > span {
  color: var(--ui-pane-text-start); background-image: var(--ui-pane-text-paint);
  background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.tour-settings > summary, .tour-now {
  background-image: var(--ui-pane-text-paint), var(--ui-pane-paint);
  background-clip: text, padding-box; -webkit-background-clip: text, padding-box;
}
:is(.tour, .zoo-dialog, .wave-controls, .sim-touch-controls) button,
:is(.tour, .zoo-dialog, .wave-controls, .sim-touch-controls) button:hover,
.tour .tour-tab, .tour .tour-primary, .tour .tour-action, .zoo-table .zoo-tile,
.wave-floating .wave-mode[aria-pressed="true"], .wave-controls .wave-mode[aria-pressed="true"],
.experiment-stages button[aria-pressed="true"],
.zoo-wording button[aria-pressed="true"] {
  color: var(--ui-button-text-start) !important; border-color: var(--ui-button-start);
  background: var(--ui-button-start); background-image: var(--ui-button-text-paint), var(--ui-button-paint);
  background-clip: text, padding-box; -webkit-background-clip: text, padding-box; -webkit-text-fill-color: transparent;
}
:is(.tour, .zoo-dialog, .wave-controls, .sim-touch-controls) button :is(span, strong, small, b) {
  color: inherit; background: none; -webkit-text-fill-color: inherit;
}
:is(.tour, .zoo-dialog, .wave-controls, .sim-touch-controls) button:hover:not(:disabled) { filter: brightness(1.08); }
:is(.tour, .zoo-dialog, .wave-controls) button:is([aria-pressed="true"], [aria-current="step"]) { box-shadow: inset 0 -3px 0 var(--ui-button-text-start); font-weight: 750; }
.tour-dot[aria-current="step"] { outline: 2px solid var(--ui-button-start); outline-offset: 2px; }
:is(.tour, .zoo-dialog, .wave-controls) select { background: var(--ui-column-start); color: var(--ui-pane-text-start); }
.zoo-table .zoo-tile { border-top-color: var(--zoo-accent); }
.zoo-table .zoo-tile svg { filter: none; }
/* The explicit Colors folder stays available alongside the depiction controls. */
#left-deck .deck-folder-tabs { display: flex; }
#left-deck[data-folder="colors"] .wave-deck-controls { display: none; }
.sim-hud[data-custom-text="true"] :is(.sim-hud-head, .sim-hud-line, .sim-hud-term, .sim-hud-text, th) {
  color: var(--stage-text-start); background-image: var(--stage-text-paint);
  background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.sim-hud[data-custom-text="true"] .sim-hud-badge .sim-hud-text { color: #ffb020; background: none; -webkit-text-fill-color: currentColor; }
html[data-stage-text-custom="true"] .wave-heading :is(strong, span, small) {
  color: var(--stage-text-start); background-image: var(--stage-text-paint);
  background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
@media (forced-colors: active) {
  :is(.tour, .zoo-dialog, .wave-controls, .sim-touch-controls, #sim-links) * { -webkit-text-fill-color: currentColor !important; }
}