/* Lucide icons add a second cue alongside the existing text and colors. */
.icon {
  display: inline-block;
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  vertical-align: middle;
  pointer-events: none;
}
.site-header nav { gap: 22px; min-width: 0; }
.site-header nav a { gap: 8px; flex-shrink: 0; }
.site-header nav .icon { width: 16px; height: 16px; color: #89a8b9; }
.site-header nav a.active .icon,
.site-header nav a:hover .icon { color: #9ddce7; }
.saved-nav > .icon { width: 18px; height: 18px; stroke-width: 1.7; }
.arrow { display: inline-flex; flex: 0 0 auto; align-items: center; }
.arrow .icon, .text-link > .icon { width: 16px; height: 16px; }
.button > .icon { width: 17px; height: 17px; }
.track-top .icon { width: 26px; height: 26px; stroke-width: 1.7; color: #8bc8d5; }
.index-stat > .icon { stroke-width: 1.7; }
.search-wrap .icon { stroke-width: 1.7; }

.badge { gap: 7px; padding: 6px 8px; }
.badge .icon { width: 13px; height: 13px; stroke-width: 1.8; }
.source-row .badge { font-size: 10px; line-height: 1.4; }
.source-type-icon { display: inline-flex; align-items: center; flex: 0 0 auto; }
.source-type-icon .icon { width: 17px; height: 17px; }
.source-type-icon[data-type='intelligence'] { color: #a5cbbb; }
.source-type-icon[data-type='research'] { color: #8ac9d7; }
.source-type-icon[data-type='investigation'] { color: #d8b984; }
.source-type-icon[data-type='legal'] { color: #b8add6; }
.source-type-icon[data-type='platform'] { color: #9bbada; }
.source-key li > span:first-child { gap: 10px; }
.filter-label-content { display: flex; gap: 8px; align-items: flex-start; min-width: 0; }
.filter-label-content .icon { width: 15px; height: 15px; margin-top: 1px; }
.filter-label-content > span { min-width: 0; }
.filter-count { margin-left: auto; flex-shrink: 0; }
.filters-disclosure > summary > .icon { width: 14px; height: 14px; margin-right: 8px; }

.bookmark { min-width: 32px; min-height: 36px; border-radius: 4px; }
.source-row, .library-results .source-row { grid-template-columns: minmax(0, 1fr) max-content; }
.bookmark .icon { width: 19px; height: 19px; stroke-width: 1.7; }
.bookmark.is-saved .icon { fill: none; stroke: #71c7d6; }
.bookmark:hover { background: #182a35; }
.icon-heading { display: flex; align-items: center; gap: 11px; }
.icon-heading .icon { width: 22px; height: 22px; color: #8bc8d5; }
.limitation-box .icon-heading .icon { color: #d6ad6a; }
.study-facts dt { display: flex; align-items: center; gap: 8px; }
.study-facts dt .icon { width: 14px; height: 14px; }
.persuasion-study .study-method { display: flex; align-items: flex-start; gap: 7px; }
.study-method .icon { width: 15px; height: 15px; margin-top: 1px; }
.study-outcome > .icon { width: 14px; height: 14px; margin-right: 6px; vertical-align: -2px; }
.study-details > summary { display: flex; align-items: center; gap: 9px; list-style: none; }
.study-details > summary::-webkit-details-marker { display: none; }
.study-details > summary > .icon { width: 16px; height: 16px; }
.disclosure-indicator { display: inline-flex; margin-left: auto; flex: 0 0 auto; }
.disclosure-indicator .icon { width: 15px; height: 15px; }
.study-details[open] .disclosure-indicator { transform: rotate(180deg); }
.stage-tab > .icon { width: 20px; height: 20px; }
.stage-tab.active > .icon { color: #92d6e2; }
.emotion-cycle > li > span,
.emotion-branches > div > span { display: inline-flex; align-items: center; gap: 9px; }
.emotion-cycle > li > span .icon { width: 20px; height: 20px; }
.emotion-branches > div > span .icon { width: 17px; height: 17px; }
.empty-state > .icon { width: 36px; height: 36px; margin-bottom: 20px; color: #7eb8c9; }

@media (min-width: 901px) and (max-width: 1100px) {
  .site-header nav { gap: 15px; }
  .site-header nav a { gap: 6px; font-size: 11px; }
  .saved-nav { padding-left: 16px; }
  .saved-nav .saved-label { display: none; }
}
@media (max-width: 900px) {
  .site-header nav { gap: 23px; }
}
@media (max-width: 560px) {
  .site-header nav { gap: 20px; }
  .site-header nav a { gap: 7px; }
  .site-header nav .icon { width: 15px; height: 15px; }
  .source-row .badge { font-size: 9px; }
  .badge .icon { width: 12px; height: 12px; }
  .bookmark { min-width: 28px; }
  .icon-heading { gap: 9px; }
  .icon-heading .icon { width: 20px; height: 20px; }
}
