
/* Research/Self/Fit/Money: a compact command row and readable, deliberately opened
   discovery panel. Learn keeps its independently reviewed presentation. */
/* Only #sheet-scroll is a scroller. Hidden overflow still lets browser focus or
   scrollIntoView move this outer frame and its title/Close controls. Clip keeps
   the rounded frame fixed without changing the inner reader's scrolling. */
html:is([data-map-product="research"], [data-map-product="self"], [data-map-product="fit"], [data-map-product="money"]) #sheet {
  overflow: clip;
}
html:is([data-map-product="research"], [data-map-product="self"], [data-map-product="fit"], [data-map-product="money"]) #bezel {
  max-width: 1180px;
  margin-inline: auto;
  padding: 0.85rem 1rem 1rem;
}
html:is([data-map-product="research"], [data-map-product="self"], [data-map-product="fit"], [data-map-product="money"]) #bezel .value-line {
  display: block;
  margin: 0 0 0.85rem;
  max-width: 65ch;
  overflow: visible;
  font-size: 0.9rem;
  line-height: 1.5;
}
html:is([data-map-product="research"], [data-map-product="self"], [data-map-product="fit"], [data-map-product="money"]) .browse-group-label {
  margin: 0.8rem 0 0.45rem;
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 700;
}
html:is([data-map-product="research"], [data-map-product="self"], [data-map-product="fit"], [data-map-product="money"]) :is(.hot-searches, .family-filters) {
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0;
  overflow: visible;
}
html:is([data-map-product="research"], [data-map-product="self"], [data-map-product="fit"], [data-map-product="money"]) :is(.hot-chip, .family-chip) {
  min-height: 44px;
  padding: 0.55rem 0.8rem;
  border-style: solid;
  border-radius: 12px;
  font: inherit;
  font-size: 0.9rem;
  white-space: normal;
  text-align: left;
}
html:is([data-map-product="research"], [data-map-product="self"], [data-map-product="fit"], [data-map-product="money"]) #bezel .legend {
  margin: 1rem 0 0;
}
html:is([data-map-product="research"], [data-map-product="self"], [data-map-product="fit"], [data-map-product="money"]) .popular-section-head {
  position: relative;
  display: block;
  padding-right: 0;
}
html:is([data-map-product="research"], [data-map-product="self"], [data-map-product="fit"], [data-map-product="money"]) .popular-section-head :is(.section-kicker, h2) {
  padding-right: 6.5rem;
}
html:is([data-map-product="research"], [data-map-product="self"], [data-map-product="fit"], [data-map-product="money"]) .popular-count {
  position: absolute;
  top: 0;
  right: 1rem;
}
html:is([data-map-product="research"], [data-map-product="self"], [data-map-product="fit"], [data-map-product="money"]) .checked-source-list {
  display: grid;
  gap: 1rem;
  padding-left: 1.1rem;
}
html:is([data-map-product="research"], [data-map-product="self"], [data-map-product="fit"], [data-map-product="money"]) .checked-source-list a {
  color: var(--signal);
  text-decoration: underline;
  text-underline-offset: 0.2em;
  overflow-wrap: anywhere;
}
.community-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.checked-source-list p { margin: 0.35rem 0; }
.checked-source-meta { font-size: 0.85rem; color: var(--ink-muted); }
.reader-community-picture {
  margin: 0.65rem 0 0;
  color: var(--ink-muted);
  font-size: 1rem;
  line-height: 1.6;
}
/* Family and discussion label already remain in the persistent sheet header. */
html:is([data-map-product="self"], [data-map-product="fit"], [data-map-product="money"]) #sheet-chips {
  display: none;
}
.community-update {
  margin-top: 1.1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--rule);
  font-size: 1rem;
  line-height: 1.6;
}
.community-update h4 { margin: 0 0 0.65rem; font-size: 1rem; color: var(--signal); }
.community-update p { margin: 0.75rem 0; }
.community-clarification { padding: 0.8rem; border-left: 3px solid var(--signal); background: var(--paper-elevated); }
.community-clarification p { margin: 0.4rem 0; }
.community-earlier-note { margin-top: 0.5rem; color: var(--ink-muted); }
.community-earlier-note summary { min-height: 44px; padding-block: 0.65rem; cursor: pointer; }
.community-earlier-note summary:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.community-reference-links { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.25rem; }
.community-reference {
  min-height: 44px;
  padding: 0.35rem 0.55rem;
  border: 1px solid var(--rule-strong);
  border-radius: 8px;
  color: var(--signal);
  background: var(--paper-elevated);
  font: inherit;
  font-size: 0.9rem;
  cursor: pointer;
}
.community-reference:is(:hover, :focus-visible) { border-color: var(--signal); }
.community-reference:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.checked-source-list li { scroll-margin-top: 1rem; }
html[data-map-product="research"] .dossier-badges .summary-notes-link {
  margin: 0 0 0 auto;
  font-size: 0.95rem;
}
html[data-map-product="research"] :is(.audience-paths, .quick-filters) {
  flex-wrap: wrap;
  overflow: visible;
  gap: 0.5rem;
}
html[data-map-product="research"] #bezel :is(.path-chip, .filter-chip) {
  min-height: 44px;
  padding: 0.55rem 0.8rem;
  border-radius: 12px;
  white-space: normal;
  font-size: 0.9rem;
  text-align: left;
}
html:is([data-map-product="research"], [data-map-product="self"], [data-map-product="fit"], [data-map-product="money"]) #browse-toggle {
  width: auto;
  min-width: 80px;
  min-height: 44px;
  border-radius: 12px;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 650;
  text-transform: none;
}
@media (max-width: 639.98px) {
  html:is([data-map-product="research"], [data-map-product="self"], [data-map-product="fit"], [data-map-product="money"]) .search-row,
  html:is([data-map-product="research"], [data-map-product="self"], [data-map-product="fit"], [data-map-product="money"]) .search-row:has(#clear-filters[hidden]) {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.5rem;
  }
  html:is([data-map-product="research"], [data-map-product="self"], [data-map-product="fit"], [data-map-product="money"]) .search-wrap { grid-column: 1; }
  html:is([data-map-product="research"], [data-map-product="self"], [data-map-product="fit"], [data-map-product="money"]) #clear-filters { grid-column: 1 / -1; }
}
