/* Shared shell stylesheet; native window rules are scoped to the bridge. */
html:has(body.native-desktop), body.native-desktop { background: transparent; overflow: hidden; height: 100%; }
body.native-desktop .desktop-preview, body.native-desktop .floating-hint { display: none; }
body.native-desktop .floating-avatar { position: fixed; left: 12px; top: 12px; filter: drop-shadow(0 3px 4px #244d4533); }
body.native-desktop .bubble-aura { display: none; }
body.native-desktop .floating-avatar .avatar-surface { box-shadow: 0 0 0 1px #b3cdbb; }
body.native-desktop .bubble-name { font-size: 12px; }
body.native-desktop.popup-open .floating-avatar { display: none; }
body.native-desktop .app-shell { left: 0; top: 0; width: 100%; max-width: none; height: 100dvh; max-height: none; border-radius: 16px; box-shadow: none; }
body.native-desktop .app-shell[hidden] { display: none; }
body.native-desktop .workspace { height: 100%; min-height: 0; padding: 0 20px; }
body.native-desktop .popup-chrome { -webkit-app-region: drag; app-region: drag; padding: 12px 0; user-select: none; }
body.native-desktop .popup-window-actions { display: flex; gap: 2px; -webkit-app-region: no-drag; app-region: no-drag; }
body.native-desktop .popup-window-actions button { width: 30px; min-height: 32px; font-size: 17px; }
body.native-desktop .topbar { height: 49px; }
body.native-desktop .nav-button { min-height: 49px; font-size: 12px; }
body.native-desktop .topbar nav { gap: 20px; }
body.native-desktop #page-talk { padding-bottom: 8px; }
body.native-desktop .chat-data-note { font-size: 10px; }
body.native-desktop .composer textarea { height: 72px; min-height: 72px; max-height: 110px; }
body.native-desktop .page { padding-bottom: 16px; }
body.native-desktop dialog { max-width: calc(100vw - 28px); max-height: calc(100dvh - 28px); }
body.native-desktop .toast { max-width: calc(100vw - 28px); left: 50%; bottom: 14px; }
@media (max-height: 600px) {
  body.native-desktop #page-talk > h1, body.native-desktop #page-talk > .page-lead, body.native-desktop .starter-row, body.native-desktop .chat-data-note { display: none; }
  body.native-desktop .popup-chrome { padding: 8px 0; }
  body.native-desktop .composer textarea { min-height: 38px; height: 38px; }
  body.native-desktop .composer { padding: 8px; }
  body.native-desktop .chat-history { min-height: 0; }
  body.native-desktop .chat-status { max-height: 24px; }
}

/* Ice-blue canvas with clear blue outlines, shared by all chat shells. */
.app-shell:has(#page-talk:not([hidden])) {
  background: #eff7ff;
  border: 2px solid #3985cd;
  color-scheme: light;
}
.workspace:has(#page-talk:not([hidden])) {
  --ink: #173657;
  --muted: #536d89;
  --teal: #0875a5;
  --line: #c3d8ef;
  color: var(--ink);
  background: radial-gradient(ellipse at 100% 0, #cae6ff99, transparent 55%), #eff7ff;
  scrollbar-color: #80b5df #eff7ff;
}
.workspace:has(#page-talk:not([hidden])) .popup-chrome {
  background: transparent;
  border-color: #c3d8ef;
}
.workspace:has(#page-talk:not([hidden])) .popup-identity h2 { color: #173657; }
.workspace:has(#page-talk:not([hidden])) :is(.popup-identity small, .popup-identity h2 > span, .private-label) { color: #536d89; }
.workspace:has(#page-talk:not([hidden])) .popup-portrait { box-shadow: 0 0 0 2px #49c9ff66; }
.workspace:has(#page-talk:not([hidden])) .popup-window-actions button { color: #315d89; }
.workspace:has(#page-talk:not([hidden])) .popup-window-actions button:hover { background: #d8ebff; border-color: #72a6d3; }
.workspace:has(#page-talk:not([hidden])) .nav-button[aria-current=page] { color: #086eaf; }
.workspace:has(#page-talk:not([hidden])) .count { background: #d5eaff; color: #245d93; }
#page-talk { color: #173657; }
#page-talk :is(.eyebrow, .page-lead, .chat-data-note, #voice-status, .starter-row, .message-state) { color: #536d89; }
#page-talk h1 em { color: #0875a5; }
#page-talk .mode-bar button { background: #fff; border-color: #85b3dc; color: #315d89; }
#page-talk .mode-bar button[aria-pressed=true] { background: #154d85; border-color: #3bacf1; color: #e9faff; }
#page-talk .mode-bar button:hover { border-color: #0875a5; }
#page-talk #chat-connection { color: #08749b; }
#page-talk .chat-history { scrollbar-color: #80b5df #eff7ff; }
#page-talk .from-user {
  background: linear-gradient(135deg, #195db7, #12457e);
  border: 1px solid #368bd2;
  color: #f5fbff;
}
#page-talk .from-nol { background: #fff; border-color: #98bde3; border-left: 3px solid #4884d5; color: #173657; box-shadow: 0 3px 10px #2357860a; }
#page-talk .message-author { color: #226aa9; }
#page-talk .from-user .message-author { color: #ceefff; }
#page-talk .chat-status { color: #536d89; }
#page-talk .composer {
  background: #fff;
  border: 1.5px solid #498fd0;
  box-shadow: 0 5px 18px #2768a312;
}
#page-talk .composer:focus-within { border-color: #067cbb; box-shadow: 0 0 0 3px #22a9e52b; }
#page-talk .composer textarea { color: #173657; caret-color: #0875a5; }
#page-talk .composer textarea::placeholder { color: #607b96; }
#page-talk :is(.text-button, .voice-settings-button) { color: #126da7; }
#page-talk .memory-link { color: #315d89; }
#page-talk .memory-link > span:first-child { color: #0875a5; }
#page-talk .primary-button {
  background: linear-gradient(120deg, #1562d2, #087399);
  border-color: #5bcaff;
  color: #fff;
  box-shadow: 0 3px 12px #1683ee33;
}
#page-talk .primary-button:hover { background: linear-gradient(120deg, #2869df, #0c779f); }
#page-talk :is(.secondary-button, .voice-button, .starter-row button) { background: #e5f2ff; color: #285f92; border-color: #86b4dc; }
#page-talk :is(.secondary-button, .voice-button, .starter-row button):hover { background: #d3eaff; border-color: #0875a5; }
#page-talk .voice-button[aria-pressed=true] { background: #ffe9f0; border-color: #d27c9b; color: #96354e; }
#page-talk .voice-playback { color: #285f92; }
#page-talk .prepared-panel { background: #e5f2ff; border-color: #86b4dc; }
#page-talk .prepared-panel :is(p, .handoff-hint) { color: #536d89; }
#page-talk .prepared-panel textarea { background: #fff; border-color: #86b4dc; color: #173657; }
#page-talk .talk-bottom { border-color: #c3d8ef; color: #536d89; }
#page-talk :is(button, a):focus-visible { outline: 2px solid #0875a5; outline-offset: 3px; }
#page-talk ::selection { background: #286fbd; color: #fff; }
body:has(#page-talk:not([hidden])) :is(#voice-settings, #context-dialog, #suggestions-dialog) {
  --ink: #173657;
  --teal: #126da7;
  background: #eff7ff;
  border-color: #498fd0;
  color: #173657;
  color-scheme: light;
}
body:has(#page-talk:not([hidden])) :is(#voice-settings, #context-dialog, #suggestions-dialog) :is(label, p, .voice-description, .memory-description, .memory-origin) { color: #536d89; }
body:has(#page-talk:not([hidden])) :is(#voice-settings, #context-dialog, #suggestions-dialog) :is(select, textarea, .context-item, .suggestion-card) { background: #fff; border-color: #86b4dc; color: #173657; }
body:has(#page-talk:not([hidden])) :is(#suggestion-status, #pending-memory-count) { color: #126da7; }
body:has(#page-talk:not([hidden])) :is(#voice-settings, #context-dialog, #suggestions-dialog) :is(.secondary-button, .icon-button) { color: #285f92; border-color: #86b4dc; }
body:has(#page-talk:not([hidden])) :is(#voice-settings, #context-dialog, #suggestions-dialog) .secondary-button:hover { background: #d3eaff; }
body:has(#page-talk:not([hidden])) :is(#voice-settings, #context-dialog, #suggestions-dialog) .primary-button { background: #256cf0; color: #fff; }
body:has(#page-talk:not([hidden])) .toast { background: #173f69; border: 1px solid #397caf; color: #edf7ff; }
body:has(#page-talk:not([hidden])) .toast button { color: #a3e5ff; }
