/* Compact header; native select semantics with a shared visual treatment. */
.overview h1 { font-size:1.05rem; letter-spacing:.06em; }
.overview .made-by { font-size:.66rem; }
.overview-head { padding-bottom:12px; }
.overview-actions .header-action {
  display:inline-flex; align-items:center; justify-content:center;
  min-height:44px; min-width:152px; padding:10px 16px;
  border:1px solid #dfdfdf; border-radius:10px;
  background:#fafafa; color:#474747; font-family:inherit;
  font-size:.73rem; font-weight:400; line-height:1.5;
  letter-spacing:.025em; text-decoration:none; cursor:pointer;
}
.overview-actions .header-action:hover { background:#f1f1f1; border-color:#c1c1c1; }
.overview .search-field { font-size:.75rem; }
.overview .search-field input { font-size:.85rem; border-radius:10px; }
.filter-summary { font-size:.7rem; }
.filter-fields { grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.filter-fields label { font-size:.72rem; }
.filter-fields select,.interview-page select {
  appearance:none; -webkit-appearance:none;
  background-color:#f9f9f9;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23686868' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-position:right 16px center; background-repeat:no-repeat; background-size:16px;
  border:1px solid #e0e0e0; border-radius:10px;
  padding:11px 44px 11px 14px; min-height:46px;
  color:#3b3b3b; font-size:.85rem; line-height:1.5; cursor:pointer;
  text-overflow:ellipsis; transition:border-color 120ms,background-color 120ms;
}
.filter-fields select:hover,.interview-page select:hover { border-color:#acacac; background-color:#f3f3f3; }
.filter-fields select:focus-visible,.interview-page select:focus-visible { outline:2px solid #6a6a6a; outline-offset:2px; border-color:#6a6a6a; }
select option { color:#3b3b3b; background:white; }
.filter-panel > summary,.needs-guide > summary,.category-guide > summary,.prompt-preview > summary {
  position:relative; display:block; list-style:none; min-height:44px;
  padding:12px 44px 12px 16px; font-size:.77rem; line-height:1.6;
  cursor:pointer; border-radius:10px;
}
summary::-webkit-details-marker { display:none; }
.filter-panel > summary { margin:0 -16px; }
.filter-panel > summary::after,.needs-guide > summary::after,.category-guide > summary::after,.prompt-preview > summary::after {
  content:''; position:absolute; right:18px; top:17px; width:7px; height:7px;
  border-right:1.5px solid #696969; border-bottom:1.5px solid #696969; transform:rotate(45deg);
}
details[open] > summary::after { transform:translateY(4px) rotate(225deg); }
summary:hover { background:#f8f8f8; }
.category-guide { grid-column:1/-1; border-top:1px solid #e9e9e9; font-size:.76rem; }
.category-guide p { margin:10px 0; line-height:1.9; }
.category-tag {
  display:inline-flex; align-items:center; width:fit-content; max-width:100%;
  border-radius:6px; padding:4px 9px; font-size:.7rem; font-weight:700;
  color:var(--category-color,#555); background:var(--category-tint,#f3f3f3);
}
.persona-card[data-category] { background:linear-gradient(180deg,var(--category-tint),#fff 75%); border-color:var(--category-tint); }
.persona-card[data-category] .card-photo { outline-color:var(--category-tint); }
.modal-card[data-category] { border-top:1px solid #ddd; }
.audience-option[data-category] { border-left:3px solid var(--category-color); padding-left:9px; }
.audience-option[data-category]:has(:checked) { background:var(--category-tint); }
.audience-option small.category-tag { margin:0 0 6px; color:var(--category-color); font-size:.68rem; }
.interview-header { font-size:.76rem; margin-bottom:24px; }
.interview-page h1 { font-size:clamp(1.35rem,3vw,1.85rem); }
.interview-intro { font-size:.9rem; }
@media (max-width:600px) {
  .overview-actions .header-action { min-width:0; width:100%; padding:10px 8px; font-size:.7rem; }
  .overview .search-field input,.filter-fields select,.interview-page select { font-size:16px; }
  .filter-fields { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .filter-fields label:first-child { grid-column:auto; }
  .filter-fields label:has([data-filter=need]) { grid-column:1/-1; }
}
@media (forced-colors:active) {
  .filter-fields select,.interview-page select { appearance:auto; background-image:none; }
  .category-tag { border:1px solid CanvasText; }
}
.needs-guide-link { display:block; padding:12px 4px; font-size:12px; color:#606060; line-height:1.7; text-decoration:none; }
.needs-guide-link:hover { color:#222; text-decoration:underline; text-underline-offset:4px; }
.needs-guide-link:focus-visible { outline:2px solid #555; outline-offset:3px; }
