/*
 * Future AI UI optimization — phase 1.
 *
 * Presentation-only overrides, loaded last for a clean rollback boundary.
 * Runtime state, graph rendering, navigation, and evidence generation are not
 * owned by this file.
 */

body[data-aya-page="future-ai"] .advisor-panel-v4 {
  border: 0 !important;
  border-radius: 14px !important;
  background: var(--aya-color-panel) !important;
  box-shadow: none !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-content-grid {
  gap: 0 !important;
  border-radius: inherit !important;
  background: transparent !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-summary,
body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence {
  min-width: 0 !important;
  padding: 14px !important;
  border: 0 !important;
  background: transparent !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence {
  background: color-mix(in srgb, var(--aya-color-panel-raised) 26%, transparent) !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-insights {
  gap: 16px !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-insights > section,
body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-insights > section + section {
  padding: 0 !important;
  border: 0 !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-insights > section > span,
body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-source-list > span {
  color: var(--aya-color-accent) !important;
  font: 760 0.7rem/1.25 var(--future-sans) !important;
  letter-spacing: 0.025em !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-meaning p {
  margin-top: 7px !important;
  color: var(--aya-color-text) !important;
  font-size: clamp(0.82rem, 1.5vw, 0.94rem) !important;
  font-weight: 560 !important;
  line-height: 1.55 !important;
  -webkit-line-clamp: 3 !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-watch-list {
  display: flex !important;
  gap: 7px !important;
  margin-top: 9px !important;
  padding: 0 0 2px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-watch-list::-webkit-scrollbar {
  display: none;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-watch-list button,
body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-watch-list button:nth-child(n) {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  min-height: 28px !important;
  align-items: center !important;
  padding: 5px 9px !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: color-mix(in srgb, var(--aya-color-accent) 7%, transparent) !important;
  color: var(--aya-color-text-muted) !important;
  font-size: 0.7rem !important;
  font-weight: 650 !important;
  white-space: nowrap !important;
  box-shadow: none !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-watch-list button:hover,
body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-watch-list button:focus-visible {
  outline: 1px solid color-mix(in srgb, var(--aya-color-accent) 56%, transparent) !important;
  outline-offset: -1px !important;
  background: color-mix(in srgb, var(--aya-color-accent) 11%, var(--aya-color-panel-muted)) !important;
  color: var(--aya-color-text) !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence > summary {
  position: static !important;
  display: flex !important;
  min-height: 24px !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  padding: 0 0 9px !important;
  border: 0 !important;
  list-style: none !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence > summary::-webkit-details-marker {
  display: none;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence > summary span {
  color: var(--aya-color-text-muted) !important;
  font: 720 0.7rem/1 var(--future-sans) !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence > summary strong {
  min-width: 22px !important;
  padding: 3px 6px !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--aya-color-accent) 13%, transparent) !important;
  color: var(--aya-color-accent) !important;
  font: 760 0.62rem/1 var(--future-sans) !important;
  text-align: center !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-source-list {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 7px !important;
  min-height: 0 !important;
  padding-top: 8px !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-source-list::before {
  content: "";
  position: absolute;
  top: 36px;
  bottom: 3px;
  left: 2px;
  width: 2px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--aya-color-accent) 18%, transparent);
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-source-list + .advisor-source-list {
  margin-top: 12px !important;
  padding-top: 12px !important;
  border-top: 0 !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-source-list button,
body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-source-list button:nth-child(n),
body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-source-list p {
  display: grid !important;
  min-height: 0 !important;
  gap: 4px !important;
  padding: 10px 11px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-source-list button,
body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-source-list p {
  margin-left: 10px !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-source-list button:nth-of-type(n + 2) {
  border-top: 1px solid color-mix(in srgb, var(--aya-color-border) 24%, transparent) !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-source-list button:hover,
body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-source-list button:focus-visible {
  outline: 1px solid color-mix(in srgb, var(--aya-color-accent) 48%, transparent) !important;
  outline-offset: -1px !important;
  background: color-mix(in srgb, var(--aya-color-accent) 8%, var(--aya-color-panel-muted)) !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-source-list button span {
  margin: 0 !important;
  color: var(--aya-color-accent) !important;
  font: 640 0.66rem/1.3 var(--future-sans) !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-source-list button strong {
  margin: 0 !important;
  color: var(--aya-color-text) !important;
  font-size: 0.8rem !important;
  font-weight: 680 !important;
  line-height: 1.38 !important;
  -webkit-line-clamp: 2 !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-source-original {
  color: var(--aya-color-text-muted) !important;
  font-size: 0.64rem !important;
  line-height: 1.35 !important;
}

/* State reads quietly; controls retain the visual contrast. */
body[data-aya-page="future-ai"] .graph-status-slot {
  opacity: 0.74;
}

body[data-aya-page="future-ai"] .graph-topbar {
  border-bottom: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

body[data-aya-page="future-ai"] .graph-topbar .graph-renderer-control {
  background: color-mix(in srgb, var(--aya-color-panel-raised) 72%, transparent) !important;
}

body[data-aya-page="future-ai"] .trend-window-control {
  margin-left: 4px !important;
}

body[data-aya-page="future-ai"] .graph-time-lens {
  top: 0 !important;
  right: 78px !important;
  left: auto !important;
  z-index: 146 !important;
  height: 30px !important;
  min-height: 0 !important;
  gap: 6px !important;
  padding: 2px 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  pointer-events: none !important;
}

body[data-aya-page="future-ai"] .trend-country-control,
body[data-aya-page="future-ai"] .trend-window-control {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body[data-aya-page="future-ai"] .graph-time-lens button,
body[data-aya-page="future-ai"] .graph-time-lens output {
  pointer-events: auto !important;
}

/* Phase 1.3: graph chrome reads as information on the canvas, not nested cards. */
body[data-aya-page="future-ai"] .graph-trend-signal,
body[data-aya-page="future-ai"] .graph-trend-signal.is-peek,
body[data-aya-page="future-ai"] .graph-trend-signal.is-minimized {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

body[data-aya-page="future-ai"] .graph-context-restore {
  min-height: 0 !important;
  padding: 3px 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body[data-aya-page="future-ai"] .graph-context-restore:hover,
body[data-aya-page="future-ai"] .graph-context-restore:focus-visible {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body[data-aya-page="future-ai"] .graph-context-restore:focus-visible,
body[data-aya-page="future-ai"] .graph-time-lens button:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--aya-color-accent) 72%, transparent) !important;
  outline-offset: 2px !important;
}

body[data-aya-page="future-ai"] .graph-time-lens output {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body[data-aya-page="future-ai"] .graph-v2-focus-readout,
body[data-aya-page="future-ai"] .graph-v1-focus-readout {
  min-height: 0 !important;
  padding: 3px 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

/* The graph remains a canvas, not another bordered panel. */
body[data-aya-page="future-ai"] .future-graph-stage {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body[data-aya-page="future-ai"][data-graph-renderer="v2"] .future-graph-stage {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

html[data-aya-theme="light"] body[data-aya-page="future-ai"] .graph-topbar,
html[data-aya-theme="light"] body[data-aya-page="future-ai"] .graph-time-lens,
html[data-aya-theme="light"] body[data-aya-page="future-ai"] .trend-country-control,
html[data-aya-theme="light"] body[data-aya-page="future-ai"] .trend-window-control,
html[data-aya-theme="light"] body[data-aya-page="future-ai"] .graph-trend-signal,
html[data-aya-theme="light"] body[data-aya-page="future-ai"] .graph-trend-signal.is-peek,
html[data-aya-theme="light"] body[data-aya-page="future-ai"] .graph-trend-signal.is-minimized,
html[data-aya-theme="light"] body[data-aya-page="future-ai"] .graph-context-restore,
html[data-aya-theme="light"] body[data-aya-page="future-ai"] .graph-v2-focus-readout,
html[data-aya-theme="light"] body[data-aya-page="future-ai"] .graph-v1-focus-readout {
  background: transparent !important;
}

html[data-aya-theme="light"] body[data-aya-page="future-ai"] .graph-trend-signal,
html[data-aya-theme="light"] body[data-aya-page="future-ai"] .graph-trend-signal.is-peek,
html[data-aya-theme="light"] body[data-aya-page="future-ai"] .graph-trend-signal.is-minimized,
html[data-aya-theme="light"] body[data-aya-page="future-ai"] .graph-context-restore,
html[data-aya-theme="light"] body[data-aya-page="future-ai"] .graph-v2-focus-readout,
html[data-aya-theme="light"] body[data-aya-page="future-ai"] .graph-v1-focus-readout {
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

html[data-aya-theme="light"] body[data-aya-page="future-ai"] .future-graph-stage,
html[data-aya-theme="light"] body[data-aya-page="future-ai"][data-graph-renderer="v2"] .future-graph-stage {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Phase 1.5: a compact instrument identity and role-based graph metadata. */
body[data-aya-page="future-ai"] .future-brand {
  gap: 10px !important;
}

body[data-aya-page="future-ai"] .future-live-radar-icon {
  width: 34px !important;
  height: 34px !important;
  flex-basis: 34px !important;
  padding: 2px;
  border: 1px solid color-mix(in srgb, var(--aya-color-accent) 42%, transparent);
  border-radius: 50%;
  background:
    radial-gradient(circle at 38% 40%, color-mix(in srgb, var(--aya-color-accent) 18%, transparent), transparent 56%),
    color-mix(in srgb, var(--aya-color-panel-raised) 70%, transparent);
  color: #72e8dc !important;
  filter: drop-shadow(0 0 8px color-mix(in srgb, var(--aya-color-accent) 42%, transparent)) !important;
}

body[data-aya-page="future-ai"] .future-live-radar-icon > circle:first-child {
  stroke: #7cebe0 !important;
  opacity: 0.96 !important;
}

body[data-aya-page="future-ai"] .future-live-radar-icon > path {
  stroke: #b8fff1 !important;
  transform-box: view-box;
  transform-origin: 16px 16px;
  animation: future-radar-sweep 5.5s linear infinite;
}

body[data-aya-page="future-ai"] .future-live-radar-blip {
  fill: #f4c978 !important;
  filter: drop-shadow(0 0 3px rgba(244, 201, 120, 0.9));
}

body[data-aya-page="future-ai"] .future-build-version {
  margin-left: 10px !important;
  padding-left: 10px !important;
  border-left-color: color-mix(in srgb, var(--aya-color-accent) 42%, transparent) !important;
  color: #b5e8e1 !important;
  font-size: 0.72rem !important;
  font-weight: 820 !important;
  letter-spacing: 0.055em !important;
}

@keyframes future-radar-sweep {
  to { transform: rotate(360deg); }
}

body[data-aya-page="future-ai"] .graph-status-slot {
  opacity: 0.92 !important;
}

body[data-aya-page="future-ai"] .graph-status-slot .graph-status-meta i {
  font-size: 0.66rem !important;
  text-shadow: 0 0 7px currentColor;
}

body[data-aya-page="future-ai"] .graph-status-slot .graph-status-meta i:nth-of-type(1) {
  color: #8bc8ff !important;
}

body[data-aya-page="future-ai"] .graph-status-slot .graph-status-meta i:nth-of-type(2) {
  color: #6de8cc !important;
}

body[data-aya-page="future-ai"] .graph-status-slot .graph-status-meta i:nth-of-type(3) {
  color: #f2c977 !important;
}

body[data-aya-page="future-ai"] .trend-country-control button {
  color: #91caff !important;
}

body[data-aya-page="future-ai"] .trend-country-control button[aria-pressed="true"] {
  background: rgba(88, 160, 226, 0.24) !important;
  color: #d6edff !important;
  box-shadow: inset 0 0 0 1px rgba(129, 195, 255, 0.24) !important;
}

body[data-aya-page="future-ai"] .trend-window-control button {
  color: #e4bd76 !important;
}

body[data-aya-page="future-ai"] .trend-window-control button[aria-pressed="true"] {
  background: rgba(233, 181, 88, 0.22) !important;
  color: #ffe2a6 !important;
  box-shadow: inset 0 0 0 1px rgba(244, 201, 120, 0.22) !important;
}

@media (max-width: 620px) {
  body[data-aya-page="future-ai"] .future-live-radar-icon {
    width: 31px !important;
    height: 31px !important;
    flex-basis: 31px !important;
  }

  body[data-aya-page="future-ai"] .future-build-version {
    font-size: 0.66rem !important;
  }
}

/* A phone-sized desktop/webview can report a 621–1080px portrait viewport.
   It must use the same fixed map/brief/query contract as a narrow handset;
   the older tablet rule used three auto-height rows and pulled the basic
   Radar brief upward before any search had started. */
@media (min-width: 621px) and (max-width: 1080px) and (orientation: portrait) {
  body[data-aya-page="future-ai"] .future-app,
  body[data-aya-page="future-ai"] .future-stage {
    height: 100svh !important;
    min-height: 0 !important;
    max-height: 100svh !important;
    overflow: hidden !important;
  }

  body[data-aya-page="future-ai"] .future-stage {
    padding-bottom: calc(6px + env(safe-area-inset-bottom)) !important;
    box-sizing: border-box !important;
  }

  body[data-aya-page="future-ai"] .conversation-surface {
    height: calc(100svh - 68px - env(safe-area-inset-bottom)) !important;
    min-height: 0 !important;
    max-height: none !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: minmax(0, 1fr) minmax(178px, 28svh) auto !important;
    grid-template-areas:
      "map"
      "brief"
      "query" !important;
    align-items: stretch !important;
    gap: 6px !important;
    overflow: hidden !important;
  }

  body[data-aya-page="future-ai"] .conversation-surface > .future-graph-stage {
    grid-area: map !important;
    align-self: stretch !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
  }

  body[data-aya-page="future-ai"] .conversation-surface > .conversation-stream,
  body[data-aya-page="future-ai"] .advisor-panel-v4 {
    grid-area: brief !important;
    align-self: stretch !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body[data-aya-page="future-ai"] .conversation-surface > .conversation-stream {
    display: block !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body[data-aya-page="future-ai"] .conversation-surface > .query-dock {
    position: static !important;
    grid-area: query !important;
    width: 100% !important;
    margin: 0 !important;
    transform: none !important;
  }
}

/* v531 evidence columns: tablet/landscape panes used the desktop two-column
   source grid even when the evidence column became narrow. That put the
   `직접 근거` heading beside the first article and clipped the subject/target
   facts at a fixed 72px row. Keep the summary/evidence panes side-by-side,
   but make the evidence rail a single readable column with a real scroll
   owner. */
@media (min-width: 621px) and (max-width: 1080px) {
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-evidence-facts {
    max-height: none !important;
    overflow: visible !important;
    flex: 0 0 auto !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-auto-flow: row !important;
    max-height: none !important;
    min-height: 0 !important;
    flex: 0 0 auto !important;
    height: clamp(56px, calc(100svh - 305px), 450px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    padding-top: 8px !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list > span {
    grid-column: 1 / -1 !important;
    min-height: 18px !important;
    height: auto !important;
  }
}

/* v532 narrow-landscape brief: the graph and result panel remain side by
   side, but a 360px result panel cannot also sustain two inner columns.
   Stack summary over evidence there and make the panel itself the scroll
   owner so neither the left summary nor the fact rail is cut off. */
@media (min-width: 621px) and (max-width: 1080px) and (orientation: landscape) {
  body[data-aya-page="future-ai"] .advisor-panel-v4 {
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    height: auto !important;
    flex: 0 0 auto !important;
    align-content: start !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-summary,
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence {
    min-width: 0 !important;
    overflow: visible !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list {
    height: auto !important;
    max-height: 220px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body[data-aya-page="future-ai"] .future-live-radar-icon > path {
    animation: none !important;
  }
}

/* Compact chrome: one quiet menu stroke, selection-only renderer treatment. */
body[data-aya-page="future-ai"] .future-settings-trigger {
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
}

body[data-aya-page="future-ai"] .future-settings-trigger:hover,
body[data-aya-page="future-ai"] .future-settings-trigger:focus-visible {
  background: color-mix(in srgb, var(--aya-color-accent) 12%, transparent) !important;
  box-shadow: none !important;
}

body[data-aya-page="future-ai"] .graph-renderer-control {
  gap: 2px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body[data-aya-page="future-ai"] .graph-renderer-control button {
  border: 0 !important;
  border-radius: 5px !important;
  box-shadow: none !important;
}

body[data-aya-page="future-ai"] .graph-renderer-control button[aria-pressed="true"] {
  box-shadow: none !important;
}

/* Quiet first paint: one clear message, with the dormant core kept in the background. */
body[data-aya-page="future-ai"] .conversation-surface.is-bootstrap-loading .future-core {
  opacity: 0.16 !important;
  filter: saturate(0.72) !important;
}

body[data-aya-page="future-ai"] .conversation-surface.is-bootstrap-loading .future-bootstrap-status {
  top: 50% !important;
  width: min(320px, 82%) !important;
  gap: 5px !important;
}

body[data-aya-page="future-ai"] .conversation-surface.is-bootstrap-loading .future-bootstrap-status span {
  color: var(--aya-color-accent) !important;
  font-size: 0.58rem !important;
  letter-spacing: 0.16em !important;
}

body[data-aya-page="future-ai"] .conversation-surface.is-bootstrap-loading .future-bootstrap-status strong {
  color: var(--aya-color-text) !important;
  font-size: clamp(0.94rem, 2.3vw, 1.12rem) !important;
  font-weight: 700 !important;
}

body[data-aya-page="future-ai"] .conversation-surface.is-bootstrap-loading .future-bootstrap-status em {
  color: var(--aya-color-text-muted) !important;
  font-size: 0.64rem !important;
}

body[data-aya-page="future-ai"] .conversation-surface.is-bootstrap-loading .future-bootstrap-status::after {
  width: 54px !important;
  height: 1px !important;
  margin-top: 5px !important;
  background: var(--aya-color-accent) !important;
}

/* Slim composer; focus keeps the interactive boundary discoverable. */
body[data-aya-page="future-ai"] .query-dock {
  padding: 6px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: color-mix(in srgb, var(--aya-color-panel) 92%, transparent) !important;
  box-shadow: none !important;
}

body[data-aya-page="future-ai"] #futureForm.query-dock {
  border-color: transparent !important;
  box-shadow: none !important;
}

body[data-aya-page="future-ai"] .query-dock:focus-within {
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--aya-color-accent) 58%, transparent) !important;
}

body[data-aya-page="future-ai"] .composer-row {
  gap: 6px !important;
}

body[data-aya-page="future-ai"] .query-input {
  min-height: 38px !important;
  padding: 8px 11px !important;
  border-radius: 8px !important;
  background: transparent !important;
  font-size: 0.86rem !important;
  line-height: 1.25 !important;
}

body[data-aya-page="future-ai"] .send-action {
  width: 38px !important;
  height: 38px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: var(--aya-color-accent) !important;
  color: var(--aya-color-page) !important;
  box-shadow: none !important;
}

body[data-aya-page="future-ai"] .send-action:hover,
body[data-aya-page="future-ai"] .send-action:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--aya-color-accent) 40%, transparent) !important;
  outline-offset: 2px !important;
  background: color-mix(in srgb, var(--aya-color-accent) 86%, white) !important;
}

@media (min-width: 621px) {
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-summary {
    border-right: 0 !important;
  }
}

@media (max-width: 620px) {
  body[data-aya-page="future-ai"] .conversation-surface,
  body[data-aya-page="future-ai"][data-surface="radar"] .conversation-surface.is-radar-overview {
    grid-template-rows: minmax(0, 1fr) minmax(240px, 40svh) auto !important;
  }

  body[data-aya-page="future-ai"] .conversation-surface > .conversation-stream,
  body[data-aya-page="future-ai"][data-surface="radar"] .conversation-surface.is-radar-overview > .conversation-stream {
    align-self: stretch !important;
    height: 100% !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    scroll-padding-block: 12px !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 {
    flex: 0 0 auto !important;
    align-self: flex-start !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    border-radius: 15px 15px 8px 8px !important;
    box-shadow: none !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-grid,
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-content-grid {
    flex: none !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    align-content: start !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-summary,
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence {
    display: block !important;
    height: auto !important;
    overflow: visible !important;
    padding: 11px 12px !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-summary {
    position: relative !important;
    padding-bottom: 12px !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence {
    position: relative !important;
    padding-top: 10px !important;
    border-top: 0 !important;
    border-radius: 0 !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-insights {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    height: auto !important;
    gap: 11px !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-insights p {
    margin-top: 6px !important;
    font-size: 0.84rem !important;
    line-height: 1.45 !important;
    -webkit-line-clamp: 2 !important;
  }

  /* Share the summary heading row with the category selector. */
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-summary > .radar-category-menu {
    position: absolute !important;
    z-index: 32 !important;
    top: 8px !important;
    right: 10px !important;
    width: auto !important;
    border: 0 !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-summary > .radar-category-menu > summary {
    min-height: 22px !important;
    gap: 4px !important;
    padding: 2px 4px 2px 6px !important;
    border: 0 !important;
    border-radius: 5px !important;
    background: color-mix(in srgb, var(--aya-color-panel-muted) 78%, transparent) !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-summary > .radar-category-menu > summary span {
    display: none !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-summary > .radar-category-menu > summary strong {
    font-size: 0.64rem !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-summary > .radar-category-menu .radar-controls {
    top: calc(100% + 4px) !important;
    right: 0 !important;
    left: auto !important;
    width: min(360px, calc(100vw - 34px)) !important;
  }

  /* Related exploration uses one label + horizontal chip row. */
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-explore {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    gap: 8px !important;
    align-items: center !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-explore .advisor-watch-list {
    min-width: 0 !important;
    margin-top: 0 !important;
  }

  /* Direct evidence and article count share one heading row. */
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence > summary {
    position: absolute !important;
    z-index: 2 !important;
    top: 10px !important;
    right: 12px !important;
    min-height: 22px !important;
    padding: 0 !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-source-list {
    padding-top: 0 !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-source-list > span {
    display: flex !important;
    min-height: 22px !important;
    align-items: center !important;
    padding-right: 92px !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-source-list,
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list {
    grid-template-columns: minmax(0, 1fr) !important;
    max-height: none !important;
    overflow: visible !important;
    scrollbar-gutter: auto !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-source-list button {
    min-height: 0 !important;
    padding: 9px 10px !important;
  }

  body[data-aya-page="future-ai"] .graph-time-lens {
    right: 78px !important;
    gap: 4px !important;
    padding-inline: 0 !important;
  }

  body[data-aya-page="future-ai"] .trend-window-control {
    margin-left: 3px !important;
  }

  body[data-aya-page="future-ai"] .graph-time-lens button {
    min-width: 24px !important;
    padding-inline: 4px !important;
  }

  body[data-aya-page="future-ai"] .query-dock {
    padding: 5px !important;
  }

  body[data-aya-page="future-ai"] .query-input {
    min-height: 36px !important;
    padding-block: 7px !important;
    font-size: 1rem !important;
  }

  body[data-aya-page="future-ai"] .send-action {
    width: 36px !important;
    height: 36px !important;
  }
}

html[data-aya-theme="light"] body[data-aya-page="future-ai"] .advisor-panel-v4 {
  background: #f7faf9 !important;
  box-shadow: none !important;
}

html[data-aya-theme="light"] body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-watch-list button,
html[data-aya-theme="light"] body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-source-list button,
html[data-aya-theme="light"] body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-source-list p {
  background: transparent !important;
}

html[data-aya-theme="light"] body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list button,
html[data-aya-theme="light"] body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list p {
  background: transparent !important;
}

html[data-aya-theme="light"] body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-watch-list button {
  background: rgba(24, 139, 116, 0.07) !important;
}

html[data-aya-theme="light"] body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence {
  background: rgba(226, 239, 234, 0.34) !important;
}

html[data-aya-theme="light"] body[data-aya-page="future-ai"] .query-dock {
  background: rgba(247, 250, 249, 0.96) !important;
  box-shadow: none !important;
}

html[data-aya-theme="light"] body[data-aya-page="future-ai"] #futureForm.query-dock {
  border-color: transparent !important;
  box-shadow: none !important;
}

@media (prefers-reduced-motion: reduce) {
  body[data-aya-page="future-ai"] .advisor-panel-v4 *,
  body[data-aya-page="future-ai"] .query-dock * {
    scroll-behavior: auto !important;
  }
}

/* Phase 1.4: keep build metadata in the overflow menu and fold long time ranges
   behind a native disclosure without changing the existing button events. */
body[data-aya-page="future-ai"] .future-settings-popover .future-build-version {
  display: block !important;
  justify-self: end !important;
  margin: 2px 2px 0 !important;
  padding: 0 !important;
  border: 0 !important;
  color: var(--aya-color-text-muted) !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.04em !important;
}

body[data-aya-page="future-ai"] .future-brand > .future-build-version {
  display: none !important;
}

body[data-aya-page="future-ai"] .trend-window-menu {
  position: relative;
  flex: 0 0 auto;
  pointer-events: auto;
}

body[data-aya-page="future-ai"] .trend-window-menu > summary {
  display: inline-flex;
  min-width: 29px;
  height: 24px;
  align-items: center;
  justify-content: center;
  gap: 2px;
  padding: 0 6px;
  border: 0;
  border-radius: 4px;
  color: #e4bd76;
  cursor: pointer;
  font: 760 0.61rem/1 var(--future-sans);
  list-style: none;
  pointer-events: auto;
  white-space: nowrap;
}

body[data-aya-page="future-ai"] .trend-window-menu > summary::-webkit-details-marker {
  display: none;
}

body[data-aya-page="future-ai"] .trend-window-menu > summary::before {
  content: "더 보기";
  color: var(--aya-color-text-muted);
  font-size: 0.54rem;
}

body[data-aya-page="future-ai"] .trend-window-menu:has([data-trend-window="48"][aria-pressed="true"]) > summary::before {
  content: "48h";
  color: #ffe2a6;
  font-size: 0.61rem;
}

body[data-aya-page="future-ai"] .trend-window-menu:has([data-trend-window="168"][aria-pressed="true"]) > summary::before {
  content: "7d";
  color: #ffe2a6;
  font-size: 0.61rem;
}

body[data-aya-page="future-ai"] .trend-window-menu[open] > summary,
body[data-aya-page="future-ai"] .trend-window-menu > summary:focus-visible {
  background: rgba(233, 181, 88, 0.16);
  outline: 2px solid color-mix(in srgb, var(--aya-color-accent) 72%, transparent);
  outline-offset: 1px;
}

body[data-aya-page="future-ai"] .trend-window-options {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  z-index: 180;
  display: grid;
  min-width: 58px;
  gap: 2px;
  padding: 3px;
  border: 1px solid color-mix(in srgb, var(--aya-color-border) 72%, transparent);
  border-radius: 6px;
  background: var(--aya-color-panel-raised);
  box-shadow: 0 9px 20px color-mix(in srgb, var(--aya-color-page) 38%, transparent);
}

body[data-aya-page="future-ai"] .trend-window-options button {
  min-width: 48px !important;
  height: 24px !important;
  padding: 0 6px !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: transparent !important;
  color: #e4bd76 !important;
  font: 760 0.61rem/1 var(--future-sans) !important;
}

body[data-aya-page="future-ai"] .trend-window-options button:hover,
body[data-aya-page="future-ai"] .trend-window-options button[aria-pressed="true"] {
  background: rgba(233, 181, 88, 0.2) !important;
  color: #ffe2a6 !important;
}

@media (max-width: 620px) {
  body[data-aya-page="future-ai"] .trend-window-menu > summary {
    min-width: 27px;
    padding-inline: 5px;
    font-size: 0.58rem;
  }

  body[data-aya-page="future-ai"] .trend-window-menu > summary::before,
  body[data-aya-page="future-ai"] .trend-window-menu:has([aria-pressed="true"]) > summary::before {
    font-size: 0.58rem;
  }
}

/* The active horizon is rendered by the semantic current-value span now.
   Disable the legacy pseudo-label or it produces the visible `48h 48h`. */
body[data-aya-page="future-ai"] .trend-window-menu > summary::before,
body[data-aya-page="future-ai"] .trend-window-menu:has([aria-pressed="true"]) > summary::before {
  content: none !important;
  display: none !important;
}

/* v529 compact graph chrome: the active country/horizon belongs to the
   canvas frame, not the middle of the graph. */
body[data-aya-page="future-ai"] .graph-time-lens {
  right: 8px !important;
}

/* Globe reading overlays begin directly beneath the graph chrome. The compact
 * time lens is 30px high, so these offsets remove the old visual dead space
 * without overlapping either the lens or the left-side Globe status. */
body[data-aya-page="future-ai"][data-graph-renderer="globe"] .graph-trend-signal {
  top: 22px !important;
}

body[data-aya-page="future-ai"] .globe-v2-trend-overlay {
  top: 32px;
}

/* Globe's transparent WebGL canvas must sit directly on the stage. The old
 * opaque .core-network gradient created a second rectangular surface that
 * became obvious as the sphere was zoomed out. */
body[data-aya-page="future-ai"][data-graph-renderer="globe"] .core-network.is-globe-v2 {
  background: transparent !important;
}

body[data-aya-page="future-ai"][data-surface="radar"][data-graph-renderer="globe"] .conversation-surface.is-radar-overview > .future-graph-stage,
body[data-aya-page="future-ai"][data-graph-renderer="globe"] .future-graph-stage {
  background: transparent !important;
  box-shadow: none !important;
}

html[data-aya-theme="light"] body[data-aya-page="future-ai"] .future-graph-stage {
  background-color: #e7f0ec !important;
  background-image:
    linear-gradient(rgba(30, 105, 88, 0.07), rgba(30, 105, 88, 0.07)),
    linear-gradient(90deg, rgba(30, 105, 88, 0.07), rgba(30, 105, 88, 0.07)),
    radial-gradient(circle at 50% 46%, rgba(89, 177, 151, 0.2), transparent 44%) !important;
}

html[data-aya-theme="light"] body[data-aya-page="future-ai"] .conversation-surface.is-radar-overview > .future-graph-stage {
  background-color: #e7f0ec !important;
  background-image:
    linear-gradient(rgba(30, 105, 88, 0.07), rgba(30, 105, 88, 0.07)),
    linear-gradient(90deg, rgba(30, 105, 88, 0.07), rgba(30, 105, 88, 0.07)),
    radial-gradient(circle at 50% 46%, rgba(89, 177, 151, 0.2), transparent 44%) !important;
}

@media (max-width: 620px) {
  body[data-aya-page="future-ai"][data-surface="radar"] .future-stage {
    padding-top: 48px !important;
  }
}

/* v530 shell alignment: the fixed top bar is 40px on narrow screens and
   44px elsewhere; keep only a small breathing gap before the graph canvas. */
body[data-aya-page="future-ai"][data-surface="radar"] .future-stage {
  padding-top: 48px !important;
}

/* v530 evidence flow: reserve a real heading row so `관련 기사` never sits
   on top of the first `직접 근거` item in the compact result column. */
@media (max-width: 620px) {
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence > summary {
    position: static !important;
    display: flex !important;
    width: 100% !important;
    min-height: 22px !important;
    margin: 0 0 6px !important;
    padding: 0 !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list {
    padding-top: 8px !important;
  }
}

/* v534 landscape brief order: preserve the outer summary/evidence split, but
   keep subject facts with the summary. The evidence rail is then a single,
   uninterrupted direct-source column that can use the full panel height. */
body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-facts {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 6px !important;
  padding: 8px 10px 10px !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-facts button {
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
  padding: 7px 8px !important;
  border: 1px solid rgba(150, 216, 204, 0.14) !important;
  border-radius: 5px !important;
  background: rgba(18, 43, 49, 0.42) !important;
  color: inherit !important;
  text-align: left !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-facts span {
  color: var(--brief-accent) !important;
  font-size: 0.61rem !important;
  font-weight: 760 !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-facts strong {
  overflow: hidden !important;
  color: rgba(237, 248, 247, 0.94) !important;
  font-size: 0.73rem !important;
  line-height: 1.25 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

@media (orientation: landscape), (min-width: 621px) {
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-grid {
    grid-template-columns: minmax(0, 0.84fr) minmax(0, 1.16fr) !important;
    grid-template-rows: minmax(0, 1fr) !important;
    align-items: stretch !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-summary {
    min-height: 0 !important;
    overflow-y: auto !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence {
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list {
    grid-template-columns: minmax(0, 1fr) !important;
    flex: 1 1 auto !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }
}

/* v535 radar shell: a landscape viewport is always a map + brief cockpit.
   Earlier responsive generations leave several one-column rules in the base
   sheet; when a resize and a data render overlap, one could win temporarily
   and put the brief below the graph. This terminal rule owns the outer grid.
   It deliberately does not change the inner summary/evidence two-column card. */
@media (min-width: 621px) and (orientation: landscape) {
  body[data-aya-page="future-ai"][data-surface="radar"] .conversation-surface.is-radar-overview {
    display: grid !important;
    grid-template-columns: minmax(0, 1.9fr) minmax(360px, 0.95fr) !important;
    grid-template-rows: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "map brief"
      "map query" !important;
    align-items: stretch !important;
    align-content: stretch !important;
    overflow: hidden !important;
  }

  body[data-aya-page="future-ai"][data-surface="radar"] .conversation-surface.is-radar-overview > .future-graph-stage {
    grid-area: map !important;
    align-self: stretch !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
  }

  body[data-aya-page="future-ai"][data-surface="radar"] .conversation-surface.is-radar-overview > .conversation-stream {
    grid-area: brief !important;
    display: flex !important;
    align-self: stretch !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
  }

  body[data-aya-page="future-ai"][data-surface="radar"] .conversation-surface.is-radar-overview > .query-dock {
    grid-area: query !important;
    position: static !important;
    align-self: start !important;
    width: 100% !important;
    margin: 8px 0 0 !important;
    transform: none !important;
  }
}

/* v536 portrait brief facts: keep the three compact facts from pushing the
   related-article rail below the first mobile viewport. Subject and target
   share the first row at a 3:7 width; the current stage gets a full-width
   second row. Landscape keeps the existing two-rail brief unchanged. */
@media (max-width: 620px) and (orientation: portrait) {
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-facts {
    grid-template-columns: minmax(0, 0.3fr) minmax(0, 0.7fr) !important;
    grid-template-areas:
      "subject target"
      "stage stage" !important;
    gap: 4px !important;
    padding: 6px 8px 8px !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-facts button {
    display: flex !important;
    min-height: 31px !important;
    align-items: baseline !important;
    gap: 5px !important;
    padding: 5px 6px !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-facts button:nth-child(1) {
    grid-area: subject;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-facts button:nth-child(2) {
    grid-area: target;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-facts button:nth-child(3) {
    grid-area: stage;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-facts span {
    flex: 0 0 auto !important;
    font-size: 0.56rem !important;
    line-height: 1.1 !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-facts strong {
    min-width: 0 !important;
    font-size: 0.68rem !important;
    line-height: 1.15 !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-summary {
    padding-bottom: 4px !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-facts {
    padding-bottom: 4px !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence {
    padding-top: 4px !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-evidence-heading {
    margin-bottom: 4px !important;
  }
}

/* Related articles are a permanent reading rail.  This heading intentionally
 * is not a <summary>: evidence must never disappear behind an accidental
 * disclosure state on a narrow touch screen. */
body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-evidence-heading {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  min-height: 27px !important;
  margin: 0 0 7px !important;
  padding: 0 !important;
  color: var(--brief-accent) !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-evidence-heading span {
  min-width: 0 !important;
  color: var(--brief-accent) !important;
  font: 740 0.68rem/1.15 var(--future-sans) !important;
}

body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-evidence-heading strong {
  flex: 0 0 auto !important;
  min-width: 21px !important;
  margin-left: 7px !important;
  padding: 2px 6px !important;
  border: 1px solid rgba(58, 220, 205, 0.24) !important;
  border-radius: 999px !important;
  color: #63e6d8 !important;
  font: 760 0.61rem/1 var(--future-sans) !important;
  text-align: center !important;
}

@media (min-width: 621px) and (orientation: landscape) and (min-height: 601px) {
  body[data-aya-page="future-ai"][data-surface="radar"] .conversation-surface.is-radar-overview {
    height: clamp(620px, calc(100svh - 108px), 760px) !important;
  }
}

@media (min-width: 621px) and (orientation: landscape) and (max-height: 600px) {
  body[data-aya-page="future-ai"][data-surface="radar"] .conversation-surface.is-radar-overview {
    height: calc(100svh - 72px) !important;
  }
}

/* Final portrait brief ownership.  Keep the decision brief and its related
 * articles in one 3:7 row; this must follow the older handset one-column
 * fallback above so neither column is reduced to a clipped remnant. */
@media (max-width: 620px) {
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-grid,
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-content-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 3fr) minmax(0, 7fr) !important;
    grid-template-rows: minmax(0, 1fr) !important;
    align-items: stretch !important;
    overflow: hidden !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-summary {
    display: flex !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence {
    display: block !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-summary,
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence {
    padding: 8px 9px !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-evidence-heading {
    position: static !important;
    display: flex !important;
    align-items: center !important;
    min-height: 25px !important;
    margin: 0 !important;
    padding: 0 !important;
    justify-content: space-between !important;
    color: var(--brief-accent) !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  /* The graph and brief keep one fixed handset contract for Radar, searches,
     and the transient search overlay.  A result must not fall back to the
     older 40svh stream row, which left an empty strip below the 3:7 brief. */
  body[data-aya-page="future-ai"] .conversation-surface,
  body[data-aya-page="future-ai"][data-surface="radar"] .conversation-surface.is-radar-overview {
    grid-template-rows: minmax(0, 7fr) minmax(0, 3fr) auto !important;
  }

  body[data-aya-page="future-ai"] .conversation-surface > .conversation-stream,
  body[data-aya-page="future-ai"][data-surface="radar"] .conversation-surface.is-radar-overview > .conversation-stream,
  body[data-aya-page="future-ai"] .advisor-panel-v4 {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  /* A 3:7 mobile brief must preserve readable text, not shrink it into a
     clipped chip cloud.  The left rail scrolls vertically while every label
     wraps inside its actual column. */
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-meaning p {
    display: block !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
    -webkit-line-clamp: unset !important;
    overflow-wrap: anywhere !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-watch-list {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    overflow: visible !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-watch-list button,
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-facts button {
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    overflow-wrap: anywhere !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-watch-list button:nth-child(n + 3) {
    display: block !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-facts {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas: none !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-facts button:nth-child(n) {
    grid-area: auto !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-facts strong {
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  /* The brief is a two-column reader, not two cards inside another padded
     card.  Both rails own their own scroll area so a long summary never
     pushes the article list out of view (and vice versa). */
  body[data-aya-page="future-ai"] .advisor-panel-v4,
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-grid,
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-content-grid {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
  }

  /* This element intentionally has both classes. An older handset rule gave
     it `flex: none`, so its intrinsic article height escaped the 3:7 brief
     slot and the parent clipped it. It must be the one shrinkable child of
     the fixed-height advisor panel. */
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-grid.advisor-content-grid {
    flex: 1 1 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 100% !important;
  }

  body[data-aya-page="future-ai"] .conversation-surface > .conversation-stream,
  body[data-aya-page="future-ai"][data-surface="radar"] .conversation-surface.is-radar-overview > .conversation-stream {
    display: flex !important;
    flex-direction: column !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 {
    flex: 1 1 0 !important;
    height: 0 !important;
    min-height: 0 !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-summary,
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence {
    min-height: 0 !important;
    padding: 0 !important;
    scrollbar-width: thin;
    overscroll-behavior: contain;
  }

  /* Source metadata and headline are separate reading lines.  Do not let
     inherited grid/clamp rules collapse the headline beneath the metadata. */
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list::before {
    display: none !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list button,
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list button:nth-child(n) {
    display: block !important;
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 7px 6px !important;
    text-align: left !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list button span,
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list button strong {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    -webkit-line-clamp: unset !important;
    overflow-wrap: anywhere !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list button span {
    margin-bottom: 3px !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list button strong {
    color: var(--aya-color-text) !important;
    font-size: 0.76rem !important;
    font-weight: 680 !important;
    line-height: 1.32 !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-summary {
    display: block !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence {
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-insights > section,
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-insights > section + section {
    margin: 0 !important;
    padding: 5px 6px !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-insights > section > span {
    margin-bottom: 2px !important;
  }

  /* The exploration heading is a row label, not a left-side column.  Its
     candidates belong directly underneath so the narrow summary rail does
     not waste half of its usable width on a permanent label gutter. */
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-explore {
    display: block !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-explore > span {
    display: block !important;
    margin: 0 0 3px !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-explore .advisor-watch-list {
    width: 100% !important;
    margin: 0 !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-evidence-heading {
    flex: 0 0 auto !important;
    min-height: 28px !important;
    margin: 0 !important;
    padding: 5px 7px !important;
    border-bottom: 1px solid rgba(149, 229, 220, 0.13) !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list {
    flex: 1 1 auto !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 5px 6px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
  }

  /* Each reader column owns its own scroll.  Do not move the article list
     into the parent rail: that was the later override that removed the
     independent right-column scroll bar on phones. */
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence {
    overflow-x: hidden !important;
    overflow-y: hidden !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list {
    flex: 1 1 auto !important;
    height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-facts {
    margin: 0 !important;
    padding: 5px 6px !important;
  }

  /* Article cards are a single vertical reading list. Grid auto-placement
     plus unconstrained multi-line headlines was the source of the overlapping
     text regression in a short 3:7 rail. */
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list button,
  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list button:nth-child(n) {
    position: relative !important;
    flex: 0 0 auto !important;
    min-height: 58px !important;
    box-sizing: border-box !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list button + button {
    border-top: 1px solid rgba(149, 229, 220, 0.13) !important;
  }

  body[data-aya-page="future-ai"] .advisor-panel-v4 .advisor-brief-evidence .advisor-source-list button strong {
    display: -webkit-box !important;
    overflow: hidden !important;
    line-height: 1.32 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
  }

  /* A committed result is wrapped in `.message`, while the temporary search
     brief is not. The former remained a zero-height grid after the 3:7 panel
     became a flex child, so finished searches had a real DOM panel with no
     visible pixels. The message wrapper owns the brief row's height. */
  body[data-aya-page="future-ai"] .conversation-surface > .conversation-stream > .message.is-assistant {
    display: flex !important;
    flex: 1 1 0 !important;
    width: 100% !important;
    height: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body[data-aya-page="future-ai"] .conversation-surface > .conversation-stream > .message.is-assistant > .advisor-panel-v4 {
    flex: 1 1 0 !important;
    align-self: stretch !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
  }

  body[data-aya-page="future-ai"] .conversation-surface > .conversation-stream > .message.is-assistant > .advisor-panel-v4 > .advisor-brief-grid.advisor-content-grid {
    flex: 1 1 0 !important;
    height: 100% !important;
    min-height: 0 !important;
  }
}