/* Restore Moyai's purple identity over the current workspace layout.
   Keep typography, panel geometry, responsive rules and semantic errors intact. */
:root {
  --text: #28282b;
  --muted: #73717b;
  --line: #e9e5ef;
  --border: #e4dfea;
  --purple: #7155ba;
  --accent: #7155ba;
  --soft: #f3effa;
  --brand-hover: #60449f;
  --brand-selected: #e9e2f4;
}
button:focus-visible, a:focus-visible, summary:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline-color: var(--purple);
}
input[type="checkbox"], input[type="radio"] { accent-color: var(--purple); }
.rail { background: #f7f5fa; border-right-color: var(--line); }
.brand { color: #332842; flex: 1; }
.brand img { width: 27px; height: 27px; flex: 0 0 27px; filter: none; }
.brand-copy { display: flex; flex-direction: column; min-width: 0; line-height: 1.15; }
.brand-product { color: var(--purple); }
.brand #workspace-name { font-size: 10px; color: var(--muted); margin: 2px 0 0; }
.rail-tools { flex-shrink: 0; }
.welcome-mark { display: flex; color: #332842; }
.welcome-mark img, .message-label img { filter: none; }
.new-task, .new-task .nav-icon { color: var(--purple); }
button.quiet:hover, .icon-button:hover, .new-task:hover, .nav-button:hover,
.agent-disclosure:hover, .folder-toggle:hover, .folder-menu:hover, .folder-add:hover,
.parent-session:hover, .header-icon:hover, .panel-icon:hover,
.panel-tab [data-close]:hover { background: var(--soft); }
.nav-button.active, .parent-session:has(.selected), .parent-session:has(.selected):hover,
.header-icon.is-active, .header-icon[aria-expanded="true"], .panel-tab.is-active {
  background: var(--brand-selected); color: #543d79;
}
.nav-button.active .nav-icon, .panel-tab.is-active > button { color: #543d79; }
.child-session.selected { background: var(--brand-selected); }
.sessions-label #session-scope:not(:disabled):hover { background-color: var(--soft); }
.folder-sessions, .child-sessions, .panel-open > .workspace-panel { border-color: var(--line); }
.session-search.is-open, .session-search:focus-within, .session-search.has-query {
  box-shadow: inset 0 0 0 1px #d8cce8;
}
.session-dot.running, .session-dot.queued, .session-dot.provisioning,
.session-dot.saving, .session-dot.reconnecting, .session-dot.waiting_children,
.work-live-dot, .chat-working.busy:before { background: var(--purple); }
.is-live > .work-heading .work-indicator { border-color: #e9dff5; border-top-color: var(--purple); }
.work-action.running .work-action-state, .work-action.running .work-icon { color: var(--purple); }
.work-body { border-color: var(--line); }
.work-action summary:hover, .work-action details[open] { background: #faf9fc; border-color: var(--line); }
.chat-message.user { background: var(--soft); }
.composer, .reply-composer { border-color: #e4dfea; }
.composer:focus-within { border-color: #b4a4ca; box-shadow: 0 0 0 3px #b6a4d319; }
.send-button, button.primary { background: var(--purple); border-color: var(--purple); color: #fff; }
.send-button:hover, button.primary:hover { background: var(--brand-hover); border-color: var(--brand-hover); }
.message-queue { background: #faf9fc; border-color: var(--line); }
.queued-message + .queued-message { border-color: var(--line); }
.queue-editor textarea { border-color: #d7cbe3; }
.queue-edit-actions button:last-child { background: #ede7f4; border-color: #e1d8eb; color: #654a8d; }
.markdown a { color: var(--purple); text-decoration-color: #c6b9da; }
.markdown code { background: #f0eef4; color: #5d546e; }
.markdown blockquote { border-color: #dbd5e7; }
.code-block { background: #f8f7fa; border-color: var(--line); }
.code-header { background: #f1eff5; }
.code-header button, .code-block code { color: #645e70; }
.markdown th { background: #f8f7fa; }
.suggestions button { border-color: var(--line); color: #665476; }
.suggestions button:hover, .settings-link:hover { background: var(--soft); }
.settings-icon, .settings-group h2 > span { background: var(--soft); color: var(--purple); border-color: var(--line); }
.approval, #credential-requests .credential-request { border-color: #e4dfea; background: #faf8fd; }
.panel-resize:hover, .panel-resize:focus-visible { background: #7155ba33; }

/* Composer toolbar and sidebar account row.
   One type size (13px), one control height (28px), two spacing steps:
   4px between related controls, 12px between groups. Left: input actions.
   Right: engine (new sessions only) and model, then mic and send. */
.composer-toolbar, .reply-composer .composer-toolbar {
  display: flex; align-items: center; flex-wrap: wrap; gap: 4px;
  min-height: 0; padding: 4px 10px 10px;
}
.composer-toolbar > * { flex: none; }
.composer-toolbar button.quiet, .task-options summary, .model-picker, .composer-model {
  height: 28px; border-radius: 7px; font-size: 13px; line-height: 1; font-weight: 400; color: var(--muted);
}
.attach-button, .record-button.is-idle, .skill-picker-button {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  width: 28px; padding: 0 !important; border: 0; background: transparent;
}
.composer-toolbar .attach-button { width: auto; padding: 0 8px 0 6px !important; }
.task-options summary { display: inline-flex; align-items: center; gap: 6px; padding: 0 8px 0 6px; white-space: nowrap; }
.task-options summary > span { font-size: inherit; }
.attach-button:hover, .record-button.is-idle:hover, .skill-picker-button:hover,
.task-options summary:hover, .task-options[open] summary, .model-picker:hover {
  background: var(--soft); color: #654a8d;
}

/* Pickers: icon + value + chevron, styled as one quiet chip. */
.model-picker { position: relative; display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 0 6px 0 8px; min-width: 0; cursor: pointer; }
.model-picker .provider-logo { width: 14px; height: 14px; flex: none; object-fit: contain; }
.model-picker select {
  appearance: none; -webkit-appearance: none; field-sizing: content;
  width: auto; min-width: 0; max-width: 150px; height: 28px; margin: 0; padding: 0; border: 0;
  background: none; color: #3f3a47; font: inherit; font-size: 13px; text-overflow: ellipsis; cursor: pointer;
}
.model-picker select:hover { background: none; }
.model-picker select:focus-visible { outline: none; }
.model-picker:focus-within { outline: 2px solid var(--purple); outline-offset: 1px; }
.model-picker select:disabled { cursor: default; opacity: .55; }
.picker-chevron { display: inline-flex; color: #a9a4b1; pointer-events: none; }
.composer-model { display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 0 8px; color: #3f3a47; }
.composer-model .harness-logo { width: 14px; height: 14px; flex: none; }

/* Keep engine and model selection together beside the message actions. */
.composer-toolbar .model-picker, .reply-composer .composer-model { margin-left: auto; margin-right: 0; }
.composer-pickers { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; min-width: 0; margin-left: auto; }
.composer-pickers .model-picker { margin: 0; }
.composer-toolbar .harness-picker + .model-picker::before {
  content: ""; position: absolute; left: -3px; width: 1px; height: 14px; background: var(--line);
}
.composer-toolbar .record-button.is-idle { order: 5; margin-left: 8px; }
.composer-toolbar .send-button, .composer-toolbar .stop-button { order: 6; }
.send-button, .stop-button { width: 28px; height: 28px; flex: 0 0 28px; margin-left: 4px; border-radius: 50%; }
.send-button { background: var(--purple); color: #fff; }
.send-button:disabled { opacity: 1; background: #d6cbe7; }
.stop-button { background: var(--soft); color: #654a8d; font-size: 10px; }

@media (max-width: 480px) {
  .composer-toolbar .attach-button span, .task-options summary span { display: none; }
  .composer-toolbar .attach-button, .task-options summary { width: 28px; padding: 0 !important; justify-content: center; }
  .model-picker select { max-width: 104px; }
  .composer-toolbar .record-button.is-idle { margin-left: 0; }
}

@media (max-width: 600px) {
  #task-form .composer-pickers { order: -1; flex-basis: 100%; justify-content: flex-end; }
  #task-form .record-button.is-idle { margin-left: auto; }
}

/* Sidebar account row: identity left, icon actions right, one line. */
.rail-foot {
  display: flex; align-items: center; gap: 8px; flex-shrink: 0;
  margin: 0; padding: 8px 0 0 8px; border-top: 1px solid var(--line);
}
.rail-foot .rail-identity {
  flex: 1; min-width: 0; max-width: none; margin: 0; padding: 0;
  font-size: 13px; line-height: 28px; color: var(--muted);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.rail-account-actions { display: flex; align-items: center; gap: 2px; flex: none; margin-left: auto; }
.rail-foot .rail-settings, .rail-foot #logout {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; padding: 0; border: 0; border-radius: 7px;
  background: transparent; color: var(--muted);
}
.rail-foot .rail-settings:hover, .rail-foot .rail-settings.active, .rail-foot #logout:hover { background: var(--soft); color: #654a8d; }
.rail-foot #logout[hidden] { display: none; }