/* Setup has one appearance, independent of the dashboard palette. */
html[data-palette] .onboarding-overlay {
  color-scheme: light;
  --bg: #e8e8e8;
  --ink: #171717;
  --ink-2: #454545;
  --ink-3: #656565;
  --ink-4: #7c7c7c;
  --violet: #242424;
  --magenta: #242424;
  --glass: #f2f2f2;
  --glass-2: #f5f5f5;
  --glass-strong: #f8f8f8;
  --border: rgba(23, 23, 23, .16);
  --border-soft: rgba(23, 23, 23, .10);
  --border-hi: rgba(23, 23, 23, .34);
  --accent: #242424;
  --accent-muted-bg: rgba(23, 23, 23, .08);
  --accent-muted-text: #242424;
  background: #e8e8e8 !important;
  color: var(--ink);
}

html[data-palette] .onboarding-overlay :is(.onboarding-shell, .onboarding-intro-shell, .onboarding-template-shell),
html[data-palette] .onboarding-overlay :is(.onboarding-preview, .onboarding-catalog, .onboarding-template-stage) {
  background: #e8e8e8 !important;
  color: var(--ink) !important;
  border-color: var(--border-soft) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

html[data-palette] .onboarding-overlay .onboarding-brand-lockup .brand-logo-ink { display: block !important; }
html[data-palette] .onboarding-overlay .onboarding-brand-lockup .brand-logo-white { display: none !important; }

html[data-palette] .onboarding-overlay :is(.onboarding-topbar, .onboarding-footer) {
  border-color: var(--border-soft) !important;
}

html[data-palette] .onboarding-overlay :is(.onboarding-top-title strong, .onboarding-section-head h2, .onboarding-template-head h1, .onboarding-intro-content h1, .onboarding-intro-content h1 time) {
  color: #171717 !important;
  -webkit-text-fill-color: #171717 !important;
  text-shadow: none !important;
}

html[data-palette] .onboarding-overlay :is(.onboarding-intro-content > p, .onboarding-template-head p, .onboarding-section-head p) {
  color: #454545 !important;
}

html[data-palette] .onboarding-overlay :is(.onboarding-brand > div > span, .onboarding-top-title .mono, .onboarding-intro-kicker, .onboarding-template-head > .mono, .onboarding-section-head > .mono) {
  color: #626262 !important;
  -webkit-text-fill-color: #626262 !important;
}

html[data-palette] .onboarding-overlay .onboarding-step-dot { background: #c7c7c7 !important; }
html[data-palette] .onboarding-overlay .onboarding-step-dot.active { background: #171717 !important; }

html[data-palette] .onboarding-overlay .onboarding-close {
  background: #f3f3f3 !important;
  border-color: var(--border) !important;
  color: #303030 !important;
}

html[data-palette] .onboarding-overlay .onboarding-intro-prompt {
  background: #171717 !important;
  border-color: #303030 !important;
  box-shadow: none !important;
  color: #f4f4f4 !important;
}

html[data-palette] .onboarding-overlay .onboarding-intro-prompt:is(:focus-within, .is-listening) {
  border-color: #727272 !important;
  box-shadow: 0 0 0 1px #727272 !important;
}

html[data-palette] .onboarding-overlay .onboarding-intro-prompt textarea {
  background: transparent !important;
  border: 0 !important;
  color: #f4f4f4 !important;
  -webkit-text-fill-color: #f4f4f4 !important;
  caret-color: #f4f4f4 !important;
}

html[data-palette] .onboarding-overlay .onboarding-intro-prompt textarea::placeholder {
  color: #929292 !important;
  -webkit-text-fill-color: #929292 !important;
}

html[data-palette] .onboarding-overlay .onboarding-intro-prompt-foot {
  border-color: rgba(255, 255, 255, .12) !important;
}

html[data-palette] .onboarding-overlay :is(.onboarding-intro-prompt-foot > .mono, .onboarding-intro-voice, .onboarding-intro-voice .ritual-voice-mark) {
  color: #b6b6b6 !important;
  -webkit-text-fill-color: #b6b6b6 !important;
}

html[data-palette] .onboarding-overlay :is(.onboarding-intro-transcript, .onboarding-intro-transcript::before) {
  color: #dadada !important;
}

html[data-palette] .onboarding-overlay .onboarding-footer {
  background: #111111 !important;
  color: #f2f2f2 !important;
}

html[data-palette] .onboarding-overlay :is(.onboarding-footer .mono, .onboarding-footer strong, .onboarding-footer .onboarding-secondary) {
  color: #c8c8c8 !important;
  -webkit-text-fill-color: #c8c8c8 !important;
}

html[data-palette] .onboarding-overlay .onboarding-secondary {
  border-color: rgba(255, 255, 255, .20) !important;
  background: transparent !important;
}

html[data-palette] .onboarding-overlay .onboarding-secondary:hover {
  background: rgba(255, 255, 255, .09) !important;
}

html[data-palette] .onboarding-overlay .onboarding-primary {
  background: #f4f4f4 !important;
  border-color: #f4f4f4 !important;
  color: #171717 !important;
  -webkit-text-fill-color: #171717 !important;
  box-shadow: none !important;
}

html[data-palette] .onboarding-overlay .onboarding-primary:hover { background: #fff !important; }

html[data-palette] .onboarding-overlay :is(.onboarding-real-block, .onboarding-template-card, .onboarding-catalog-row) {
  --ink: #f4f4f4;
  --ink-2: #c9c9c9;
  --ink-3: #a5a5a5;
  --ink-4: #898989;
  --border: rgba(255, 255, 255, .18);
  --border-soft: rgba(255, 255, 255, .10);
  --border-hi: rgba(255, 255, 255, .44);
  background: #191919 !important;
  border-color: var(--border) !important;
  color: #f4f4f4 !important;
  box-shadow: none !important;
}

html[data-palette] .onboarding-overlay :is(.onboarding-real-block, .onboarding-template-card, .onboarding-catalog-row) :is(strong, .mono, h2, h3, h4) {
  color: #f4f4f4 !important;
  -webkit-text-fill-color: #f4f4f4 !important;
}

html[data-palette] .onboarding-overlay :is(.onboarding-real-block, .onboarding-template-card, .onboarding-catalog-row) :is(p, small, em) {
  color: #c9c9c9 !important;
  -webkit-text-fill-color: #c9c9c9 !important;
}

html[data-palette] .onboarding-overlay :is(.onboarding-template-card.selected, .onboarding-catalog-row.selected) {
  border-color: #767676 !important;
  background: #242424 !important;
  box-shadow: 0 0 0 1px rgba(23, 23, 23, .16) !important;
}

html[data-palette] .onboarding-overlay .onboarding-template-icon {
  background: #303030 !important;
  border-color: rgba(255, 255, 255, .18) !important;
  color: #f4f4f4 !important;
}

html[data-palette] .onboarding-overlay .onboarding-template-thumb,
html[data-palette] .onboarding-overlay .onboarding-focus-now,
html[data-palette] .onboarding-overlay .onboarding-email-actions span {
  background: #2a2a2a !important;
  border-color: rgba(255, 255, 255, .14) !important;
}

html[data-palette] .onboarding-overlay .onboarding-template-thumb-row .accent,
html[data-palette] .onboarding-overlay .onboarding-mini-meter i {
  background: #bdbdbd !important;
}

html[data-palette] .onboarding-overlay :is(.onboarding-email-actions i, .onboarding-real-foot button, .onboarding-focus-now em) {
  background: #303030 !important;
  border-color: rgba(255, 255, 255, .18) !important;
  color: #d9d9d9 !important;
}

html[data-palette] .onboarding-overlay .onboarding-focus-timer {
  border-color: #444 !important;
  border-bottom-color: #bdbdbd !important;
}

html[data-palette] .onboarding-overlay .onboarding-habit-mini-row span.checked {
  background: #e6e6e6 !important;
  color: #171717 !important;
}

html[data-palette] .onboarding-overlay :is(.onboarding-row-icon, .onboarding-add-circle) {
  color: #f4f4f4 !important;
  border-color: rgba(255, 255, 255, .25) !important;
}
