/* Destination apps follow the browser appearance; the galaxy stays on brand. */
#demo-window .app-window { color-scheme: light; }


@media (prefers-color-scheme: dark) {
  #demo-window .app-context[data-scene] {
    --preview-paper: #1c1c1e;
    --preview-chrome: #2c2c2e;
    --preview-sidebar: #252527;
    --preview-raised: #353538;
    --preview-line: #454549;
    --preview-ink: #f0f0f2;
    --preview-muted: #b0b0b8;
    --preview-selection: #554923;
  }
  #demo-window .app-context[data-scene="journal"],
  #demo-window .app-context[data-scene="reminders"] {
    --preview-selection: #443950;
  }
  #demo-window .app-context[data-scene="docs"] {
    --preview-paper: #202124;
    --preview-chrome: #292a2d;
    --preview-sidebar: #17181b;
    --preview-raised: #36383d;
    --preview-line: #4b4e55;
    --preview-selection: #304664;
  }
  #demo-window .app-context[data-scene] .app-window {
    color-scheme: dark;
    background: var(--preview-chrome);
    color: var(--preview-ink);
    border-color: var(--preview-line);
  }
  #demo-window .app-context[data-scene] .app-toolbar,
  #demo-window .app-context[data-scene] .browser-bar,
  #demo-window .app-context[data-scene] .docs-menu {
    background: var(--preview-chrome);
    border-color: var(--preview-line);
  }
  #demo-window .app-context[data-scene] .app-workspace,
  #demo-window .app-context[data-scene] .app-sidebar {
    background: var(--preview-sidebar);
    border-color: var(--preview-line);
  }
  #demo-window .app-context[data-scene] .note-pane {
    background: var(--preview-paper);
    border-color: var(--preview-line);
  }
  #demo-window .app-context[data-scene] .note-output > p,
  #demo-window .app-context[data-scene][data-complete="true"] .scene-title,
  #demo-window .app-context[data-scene] .scene-brand,
  #demo-window .app-context[data-scene] .docs-document-name,
  #demo-window .app-context[data-scene] .messages-contact-name {
    color: var(--preview-ink);
  }
  #demo-window .app-context[data-scene] :is(
    .scene-tools, .app-toolbar-detail, .sidebar-label, .notes-list-date,
    .note-toolbar, .journal-editor-header, .journal-editor-tools,
    .mail-envelope, .message-timestamp, .messages-contact-header, .contact-chevron
  ) { color: var(--preview-muted); }
  #demo-window .app-context[data-scene] .notes-list {
    background: var(--preview-sidebar);
    border-color: var(--preview-line);
  }
  #demo-window .app-context[data-scene] :is(.scene-search, .browser-address, .format-size, .docs-format, .reminder-filter) {
    background: var(--preview-raised);
    color: var(--preview-ink);
    border-color: var(--preview-line);
  }
  #demo-window .app-context[data-scene] :is(.sidebar-selected, .notes-list-selection, .reminder-filter.selected) {
    background: var(--preview-selection);
    color: var(--preview-ink);
  }
  #demo-window .app-context[data-scene] .docs-share {
    background: #accbfa;
    color: #152c4c;
  }
  #demo-window .app-context[data-scene] .docs-format i:empty,
  #demo-window .app-context[data-scene] .mail-envelope > div,
  #demo-window .app-context[data-scene="mail"] .scene-title,
  #demo-window .app-context[data-scene="reminders"] .note-output {
    border-color: var(--preview-line);
  }
  #demo-window .app-context[data-scene="mail"] .scene-title::before { color: var(--preview-muted); }
  #demo-window .app-context[data-scene="reminders"] .reminders-list-header,
  #demo-window .app-context[data-scene="reminders"] .scene-brand::after {
    color: #bba2e6;
  }
  #demo-window .app-context[data-scene="reminders"] .note-output::after { border-color: #9a96a3; }
  #demo-window .app-context[data-scene="reminders"] .reminder-filter .scene-icon { color: #81afff; }
  #demo-window .app-context[data-scene="reminders"] .reminder-filter:nth-child(2) .scene-icon { color: #ff9189; }

  #demo-window .app-context[data-scene="messages"] .app-toolbar {
    background: linear-gradient(to right, var(--preview-sidebar) 210px, var(--preview-paper) 210px);
  }
  #demo-window .app-context[data-scene="messages"] .message-incoming {
    background: #38383b;
    color: var(--preview-ink);
  }
  #demo-window .app-context[data-scene="messages"] .note-output,
  #demo-window .app-context[data-scene="messages"] .messages-add {
    background: var(--preview-paper);
    border-color: var(--preview-line);
    color: var(--preview-ink);
  }
  #demo-window .app-context[data-scene="messages"] .messages-conversation {
    scrollbar-color: #62626a transparent;
  }
  #demo-window .app-context[data-scene] :is(
    #cleaned-text:not(:has(.revealed-word)), #cleaned-text > .revealed-word
  )::after { border-color: #79b1ff; }
}
@media (prefers-color-scheme: dark) and (max-width: 1100px) and (min-width: 701px) {
  #demo-window .app-context[data-scene="messages"] .app-toolbar {
    background: linear-gradient(to right, var(--preview-sidebar) 170px, var(--preview-paper) 170px);
  }
}
@media (prefers-color-scheme: dark) and (max-width: 700px),
       (prefers-color-scheme: dark) and (max-height: 600px) {
  #demo-window .app-context[data-scene="messages"] .app-toolbar { background: var(--preview-paper); }
}