/* V2.1 shell polish. Reuse real connection state and all existing theme tokens. */
#chat .entry-response { line-height: 1.7; }
#chat .entry-response .md-h { color: var(--ink); line-height: 1.35; }
#chat .entry-response .md-h1 { font-size: 21px; }
#chat .entry-response .md-h2 { font-size: 18px; }
#chat .entry-response .md-h3,
#chat .entry-response .md-h4 { font-size: 16px; }
#chat .entry-response .prose { margin: 0 0 14px; }
#chat .entry-response .prose:last-child { margin-bottom: 0; }
#chat .entry-response li { margin-block: 5px; }
#chat .entry-response blockquote { margin-inline: 0; padding-inline: 16px; border-left: 2px solid var(--signal); color: var(--ink-dim); }
#chat .entry-actions { gap: 5px; }
#chat .entry-actions button:focus-visible,
.bottom-nav button:focus-visible { outline: 2px solid var(--signal); outline-offset: 2px; }
.desktop-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.desktop-toolbar button { min-height: 40px; }
.desktop-toolbar [role="status"] { flex: 1 1 220px; font-size: 13px; }
.desktop-screen { min-height: 180px; background: var(--paper); overflow: auto; }
.desktop-screen:fullscreen { display: grid; place-items: center; background: #111; }
.desktop-screen img { display: block; width: 100%; height: auto; touch-action: manipulation; }
.desktop-screen img[hidden] { display: none; }
.desktop-screen:fullscreen img { max-width: 100%; max-height: 100%; width: auto; object-fit: contain; }
.desktop-input { display: flex; align-items: end; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.desktop-input[hidden] { display: none; }
.desktop-input label:first-child { flex: 1 1 280px; }
.desktop-input textarea { width: 100%; }

@media (max-width: 880px) {
  .topbar { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; row-gap: 8px !important; }
  .topbar .brand-row { grid-column: 1; grid-row: 1; }
  .topbar .top-actions { grid-column: 2; grid-row: 1; width: auto !important; margin-left: auto; align-self: center; }
  .topbar .topbar-status {
    order: 3;
    grid-column: 1 / -1;
    grid-row: 2;
    flex: 1 0 100% !important;
    overflow: visible !important;
    gap: 8px;
  }
  .topbar-status .brain-pill,
  .topbar-status .embedded-pill,
  .topbar-status .model-pill { display: none !important; }
  .topbar .status-pill .status-pill-label { display: inline !important; font-size: 10px; letter-spacing: 0; }
  .topbar .status-pill { min-height: 28px; padding: 5px 9px; gap: 6px; }
  .topbar .status-pill-value { font-size: 10px; }
  #bottomNav.bottom-nav {
    left: max(10px, env(safe-area-inset-left, 0px));
    right: max(10px, env(safe-area-inset-right, 0px));
    bottom: calc(8px + env(safe-area-inset-bottom, 0px));
    padding: 5px;
    border: 1px solid var(--rule-bright);
    border-radius: 999px;
    box-shadow: 0 6px 24px rgb(0 0 0 / 18%);
  }
  #bottomNav .bn-tab { min-height: 48px; border-radius: 999px; padding: 5px 2px; transition: background-color 160ms ease, color 160ms ease; }
  #bottomNav .bn-tab.is-active { background: var(--paper-3); color: var(--signal); }
  #bottomNav .bn-label { font-size: 10px; letter-spacing: 0; }
  #chat .entry-response { font-size: 15px; }
}

@media (prefers-reduced-motion: reduce) {
  #bottomNav .bn-tab { transition: none; }
}