/* Ask keeps its own purposeful frame. This layer changes presentation only:
   search scope, location consent, free discovery and private search are intact. */
html body #mappiIntelligenceDialog.mappi-intelligence-dialog {
  --mi-line: #cddfe4;
  --mi-muted: #526d79;
  background: #f5fafb;
  border-radius: 24px;
  box-shadow: 0 20px 52px #001d3030;
}
html body #mappiIntelligenceDialog .mi-header {
  padding: 16px 20px;
  gap: 10px;
}
html body #mappiIntelligenceDialog .mi-header .mi-mark {
  width: 38px;
  height: 44px;
  flex: 0 0 38px;
  border-radius: 13px;
  background: #ffffff0d;
}
html body #mappiIntelligenceDialog .mi-close {
  width: 44px;
  height: 44px;
  min-height: 44px;
  flex: 0 0 44px;
  background: #e8f6f2;
  color: #00243f;
  border-color: #c0dcd7;
}
html body #mappiIntelligenceDialog .mi-tabs {
  margin: 12px 20px;
  padding: 3px;
  gap: 3px;
  border: 1px solid #d3e2e7;
  border-radius: 15px;
  background: #eaf2f4;
}
html body #mappiIntelligenceDialog .mi-tabs button {
  min-height: 44px;
  padding: 8px 10px;
  overflow-wrap: anywhere;
}
html body #mappiIntelligenceDialog .mi-tabs [aria-selected="true"] {
  border-radius: 11px;
  box-shadow: 0 1px 3px #00243f0d;
}
html body #mappiIntelligenceDialog .mi-scroll {
  padding: 0 20px 20px;
  scrollbar-gutter: stable;
}
html body #mappiIntelligenceDialog .mi-question-label {
  font-size: 1.375rem;
  line-height: 1.25;
  text-wrap: balance;
}
html body #mappiIntelligenceDialog .mi-composer-hint {
  margin: 8px 0 14px;
}
html body #mappiIntelligenceDialog .mi-search-target {
  padding: 3px;
  gap: 3px;
  margin-bottom: 10px;
  background: #eaf2f4;
  border: 1px solid #d3e2e7;
  border-radius: 14px;
}
html body #mappiIntelligenceDialog .mi-search-target button {
  min-height: 44px;
  padding: 8px 10px;
  border-radius: 10px;
  overflow-wrap: anywhere;
}
html body #mappiIntelligenceDialog .mi-area-control {
  margin-bottom: 10px;
}
html body #mappiIntelligenceDialog .mi-area-control summary {
  min-height: 44px;
  padding: 10px 12px;
  border-radius: 12px;
  font-size: .8125rem;
  background: #edf8f4;
  border-color: #c7e0d9;
}
html body #mappiIntelligenceDialog .mi-area-change {
  flex: 0 0 auto;
  font-weight: 650;
  color: #236c68;
}
html body #mappiIntelligenceDialog .mi-composer-box {
  border-radius: 18px;
  box-shadow: 0 3px 12px #00243f05;
}
html body #mappiIntelligenceDialog .mi-ask-actions {
  gap: 8px;
  align-items: stretch;
}
html body #mappiIntelligenceDialog .mi-ask-actions button {
  min-height: 44px;
  padding: 10px 12px;
  overflow-wrap: anywhere;
}
html body #mappiIntelligenceDialog #miVoiceButton {
  background: #eef5f6;
  border-color: #d9e6e9;
}
html body #mappiIntelligenceDialog #miVoiceButton[aria-pressed="true"] {
  background: var(--mi-mint);
  border-color: #287e9a;
}
html body #mappiIntelligenceDialog .mi-prompt-label {
  margin: 18px 0 10px;
}
html body #mappiIntelligenceDialog :is(.mi-prompts, .mi-refinements) {
  gap: 6px;
}
html body #mappiIntelligenceDialog .mi-how summary {
  min-height: 44px;
}
@media (max-width: 480px) {
  html body #mappiIntelligenceDialog .mi-header { padding: 12px 16px; }
  html body #mappiIntelligenceDialog .mi-tabs { margin: 10px 16px; }
  html body #mappiIntelligenceDialog .mi-scroll { padding: 0 16px 16px; }
}
/* Keep the two selector rows compact, then put the question and both actions
   on one aligned workspace. The area disclosure follows in the same scroll
   flow, so opening it or increasing text size never overlays the prompt. */
@media (orientation: landscape) and (max-height: 500px) {
  html body #mappiIntelligenceDialog .mi-header { padding: 8px 14px; gap: 8px; }
  html body #mappiIntelligenceDialog .mi-header .mi-mark {
    width: 32px;
    flex-basis: 32px;
    border-radius: 10px;
  }
  html body #mappiIntelligenceDialog .mi-tabs { margin: 4px 14px 6px; }
  html body #mappiIntelligenceDialog .mi-scroll { padding: 0 14px 12px; }
  html body #mappiIntelligenceDialog .mi-search-target { margin: 0 0 6px; }
  html body #mappiIntelligenceDialog .mi-composer-box {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(7.75rem, .32fr);
    align-items: stretch;
    gap: 6px;
    padding: 5px;
    border-radius: 16px;
  }
  html body #mappiIntelligenceDialog textarea {
    min-height: max(96px, 3em);
    height: 100%;
    padding: 10px;
  }
  html body #mappiIntelligenceDialog .mi-ask-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
    padding: 0;
  }
  html body #mappiIntelligenceDialog .mi-ask-actions button {
    min-width: 0;
    padding: 9px 10px;
  }
  html body #mappiIntelligenceDialog #miVoiceButton { min-width: 0; }
  html body #mappiIntelligenceDialog .mi-area-control { margin: 8px 0 0; }
  html body #mappiIntelligenceDialog .mi-area-control summary { width: 100%; }
  html body #mappiIntelligenceDialog .mi-prompt-label { margin-top: 14px; }
  html body #mappiIntelligenceDialog .mi-footer { padding: 8px 14px; }
}
@media (orientation: landscape) and (max-height: 360px) {
  html body #mappiIntelligenceDialog .mi-header { padding-top: 4px; padding-bottom: 4px; }
  html body #mappiIntelligenceDialog .mi-tabs { margin-top: 3px; margin-bottom: 4px; }
}
/* The existing visual-viewport controller owns keyboard geometry. Preserve its
   single scroll surface and visible Close, rather than inventing another one. */
html body.keyboard-open #mappiIntelligenceDialog .mi-header { padding: 8px 16px; }
html body.keyboard-open #mappiIntelligenceDialog .mi-tabs { margin: 6px 16px; }
html body.keyboard-open #mappiIntelligenceDialog .mi-scroll {
  padding-bottom: 12px;
  scrollbar-gutter: auto;
}
html body.keyboard-open #mappiIntelligenceDialog textarea {
  height: max(64px, 3em);
  min-height: max(64px, 3em);
}
@media (orientation: landscape) and (max-height: 360px) {
  html body.keyboard-open #mappiIntelligenceDialog .mi-header {
    padding-top: 4px;
    padding-bottom: 4px;
  }
}