/* Shared by the chat, management preview and offline shell. */
.chat-theme[data-theme="purple"] {
  --canvas: #171321;
  --panel-bg: #211d30;
  --control-bg: #292337;
  --text: #f2eefb;
  --text-dim: #c2bbd4;
  --panel-border: #625673;
  --accent: #8b7cf6;
  --accent-hover: #a295ff;
  --button-ink: #1c1538;
  --user-bubble: #57448a;
  --ai-bubble: #30293f;
  --input-area: #262033;
  color-scheme: dark;
}
.chat-theme[data-theme="white"] {
  --canvas: #f0f3f7;
  --panel-bg: #ffffff;
  --control-bg: #e9eef4;
  --text: #202d3d;
  --text-dim: #526071;
  --panel-border: #9aa8b8;
  --accent: #34485e;
  --accent-hover: #25394f;
  --button-ink: #ffffff;
  --user-bubble: #dae5f1;
  --ai-bubble: #edf1f6;
  --input-area: #f5f7fa;
  color-scheme: light;
}
.chat-theme[data-theme="blue"] {
  --canvas: #eaf2fc;
  --panel-bg: #ffffff;
  --control-bg: #dfecfb;
  --text: #142d4b;
  --text-dim: #46617e;
  --panel-border: #8aa7c6;
  --accent: #175da8;
  --accent-hover: #104a8a;
  --button-ink: #ffffff;
  --user-bubble: #d7e8fb;
  --ai-bubble: #edf4fd;
  --input-area: #f1f6fd;
  color-scheme: light;
}
.chat-theme[data-theme="pink"] {
  --canvas: #fff0f5;
  --panel-bg: #fffafc;
  --control-bg: #f9e3ed;
  --text: #4d2337;
  --text-dim: #795166;
  --panel-border: #ba91a5;
  --accent: #a42e63;
  --accent-hover: #87244f;
  --button-ink: #ffffff;
  --user-bubble: #f6d9e6;
  --ai-bubble: #fff0f5;
  --input-area: #fce8f0;
  color-scheme: light;
}
.chat-theme[data-theme="green"] {
  --canvas: #edf7f0;
  --panel-bg: #fcfffd;
  --control-bg: #dfeee4;
  --text: #1c3b2a;
  --text-dim: #4b6b57;
  --panel-border: #8ca995;
  --accent: #236947;
  --accent-hover: #185235;
  --button-ink: #ffffff;
  --user-bubble: #d7eadd;
  --ai-bubble: #eaf4ed;
  --input-area: #eff7f2;
  color-scheme: light;
}
.chat-theme[data-theme="orange"] {
  --canvas: #fff5e9;
  --panel-bg: #fffdf9;
  --control-bg: #f7e8d6;
  --text: #482b16;
  --text-dim: #77553c;
  --panel-border: #bba083;
  --accent: #9d4c0c;
  --accent-hover: #7d3a07;
  --button-ink: #ffffff;
  --user-bubble: #f4e0c7;
  --ai-bubble: #faf0e3;
  --input-area: #fff4e6;
  color-scheme: light;
}
.chat-theme[data-theme="charcoal"] {
  --canvas: #15191e;
  --panel-bg: #20262d;
  --control-bg: #2d3641;
  --text: #f0f3f6;
  --text-dim: #bbc4cf;
  --panel-border: #657489;
  --accent: #8fbee8;
  --accent-hover: #aed3f3;
  --button-ink: #102337;
  --user-bubble: #354f68;
  --ai-bubble: #2c3540;
  --input-area: #242d36;
  color-scheme: dark;
}

#app.chat-theme, .theme-preview.chat-theme, body.chat-theme { background: var(--canvas); color: var(--text); }
#app.chat-theme :is(.chat-panel, .settings, .loading-box, .status), .first-run-setup.chat-theme { background: var(--panel-bg); color: var(--text); border-color: var(--panel-border); }
#app.chat-theme :is(.msg-ai, .answer-sources) { background: var(--ai-bubble); color: var(--text); }
#app.chat-theme .msg-user { background: var(--user-bubble); color: var(--text); }
#app.chat-theme .chat-input-row { background: var(--input-area); }
#app.chat-theme :is(.chat-input, .field input, .field select, .field select option) { background: var(--panel-bg); color: var(--text); border-color: var(--panel-border); }
#app.chat-theme :is(.icon-btn.hud-action-btn, .camera-help, .prompt-suggestion, .header-action, .voice-stop-btn, .guide-player button, .mic-btn), .first-run-setup.chat-theme button { background: var(--control-bg); color: var(--text); border-color: var(--panel-border); }
#app.chat-theme :is(.send-btn, .settings-save), #app.chat-theme .guide-player button[aria-pressed=true], #app.chat-theme .situation-segment input:checked + span { background: var(--accent); color: var(--button-ink); border-color: var(--accent); }
#app.chat-theme :is(.send-btn, .settings-save):hover:not(:disabled) { background: var(--accent-hover); }
#app.chat-theme :is(.msg-voice-preparing, .field-hint, .legal-links a, .ad-label, .mic-status) { color: var(--text-dim); }
#app.chat-theme :is(.settings a, .guide-player a, .answer-sources summary, .msg-markdown a) { color: var(--accent-hover); }
#app.chat-theme :is(button, a, input, select, textarea, summary):focus-visible, .first-run-setup.chat-theme :focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
#app.chat-theme .mic-btn.active { background: #b8324d; color: #fff; }
#app.chat-theme #app.chat-theme .fullscreen-mic-status, #app.chat-theme .fullscreen-latest { background: var(--panel-bg); color: var(--text); border-color: var(--panel-border); }
#app.chat-theme #fullscreen-chat-btn.has-unread::after { background: var(--accent); }
#app.chat-theme .chat-log::-webkit-scrollbar-thumb { background: var(--panel-border); }
.theme-preview { padding: 20px; border-radius: 12px; display: grid; gap: 12px; border: 1px solid var(--panel-border); margin: 16px 0; }
.theme-preview p { padding: 12px 16px; margin: 0; border-radius: 12px; background: var(--ai-bubble); color: var(--text); justify-self: start; }
.theme-preview p:last-child { background: var(--user-bubble); justify-self: end; }
.theme-palette { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.theme-palette button { min-height: 44px; padding: 8px 12px; display: inline-flex; align-items: center; gap: 8px; border: 1px solid #9ba3b1; border-radius: 8px; background: white; color: #273141; cursor: pointer; }
.theme-palette button[aria-pressed=true] { border: 2px solid #443761; padding: 7px 11px; font-weight: 700; }
.theme-palette i { width: 16px; height: 16px; background: var(--swatch); border-radius: 50%; border: 1px solid #758093; }
body.chat-theme button { background: var(--control-bg); color: var(--text); border-color: var(--panel-border); }
body.chat-theme #notice { color: var(--text-dim); }
#app.chat-theme .guide-player { flex: 1 1 220px; min-height: 80px; max-height: 45%; }
#app.chat-theme .has-guide .chat-log { flex: 1 1 100px; min-height: 48px; }