.interview-page { max-width: 1180px; margin: auto; padding: 24px 32px 64px; }
.interview-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 36px; font-size: .9rem; }
.interview-header a { color: inherit; padding: 12px 0; }
.interview-page h1 { margin: 0 0 12px; font-size: clamp(1.7rem, 4vw, 2.4rem); }
.interview-intro { margin: 0 0 8px; }
.interview-note { font-size: .82rem; color: #626262; line-height: 1.9; }
.interview-layout { display: grid; grid-template-columns: minmax(250px, .9fr) minmax(0, 1.3fr); gap: 40px; margin-top: 28px; align-items: start; }
.interview-layout h2, .interview-sources h2 { margin: 0 0 20px; font-size: 1.15rem; }
.interview-layout h2 small { font-size: .8rem; font-weight: 400; margin-left: 8px; }
.interview-page input[type=search], .interview-page select, .interview-page textarea { width: 100%; min-height: 44px; border: 1px solid #b5b5b5; border-radius: 6px; background: white; color: #333; padding: 12px; font: inherit; font-size: .9rem; box-sizing: border-box; }
.interview-page textarea { resize: vertical; line-height: 1.7; }
.audience-list { max-height: 650px; overflow-y: auto; padding: 3px; }
.audience-option { display: flex; align-items: start; gap: 12px; padding: 16px 10px; border-top: var(--border); cursor: pointer; }
.audience-option:has(:checked) { background: #f0f0f0; }
.audience-option:has(:disabled) { color: #707070; cursor: default; }
.audience-option input { margin: 5px 0 0; width: 20px; height: 20px; flex: 0 0 auto; accent-color: #333; }
.audience-option strong { font-size: .94rem; display: block; }
.audience-option small { display: block; font-size: .76rem; margin-top: 6px; color: #666; }
.selection-count { font-size: .8rem; margin: 8px 0; }
.interview-compose > label { display: block; font-size: .9rem; font-weight: 700; margin: 20px 0 8px; }
.optional { font-size: .8rem; font-weight: 400; color: #666; }
.question-examples { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.interview-page button { min-height: 44px; padding: 9px 14px; border: 1px solid #aaa; border-radius: 6px; background: white; color: #333; cursor: pointer; font-size: .85rem; }
.interview-page button:hover { background: #eee; }
.interview-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.interview-page .primary-action { background: #333; color: white; border-color: #333; }
.interview-page .primary-action:hover { background: #111; }
.interview-page button:disabled { opacity: .5; cursor: not-allowed; }
.interview-status { min-height: 28px; font-size: .9rem; }
.prompt-preview { margin: 16px 0; }
.prompt-preview summary { min-height: 44px; padding: 10px 0; cursor: pointer; font-size: .85rem; }
#prompt-preview { font-size: .78rem; }
.interview-sources { margin-top: 48px; padding-top: 32px; border-top: var(--border); }
.interview-sources article { padding: 18px 0; border-bottom: var(--border); }
.interview-sources a { color: #333; overflow-wrap: anywhere; font-weight: 700; font-size: .9rem; }
.interview-sources p { margin: 8px 0 0; font-size: .85rem; }
@media (max-width: 700px) { .interview-page { padding: 20px 18px 40px; } .interview-layout { grid-template-columns: 1fr; gap: 28px; } .audience-list { max-height: 300px; } .interview-header { margin-bottom: 24px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; } }
.interview-page { width:100%; }
.interview-layout > * { min-width:0; }
.interview-audience .filter-fields { grid-template-columns:repeat(2,minmax(0,1fr)); }
.interview-audience .filter-fields label:first-child { grid-column:1/-1; }
.interview-audience .needs-stages { grid-template-columns:1fr; }
.interview-page input[type=text] { width:100%; min-height:44px; border:1px solid #aaa; border-radius:6px; padding:12px; font:inherit; }
.interview-page input[type=search],.interview-page input[type=text],.interview-page select,.interview-page textarea { font-size:16px; min-width:0; }
.interview-page .filter-fields select { font-size:16px; }
.audience-option img { width:44px; height:44px; flex:none; border-radius:50%; object-fit:cover; background:#f5f5f5; }
.audience-option > span { min-width:0; overflow-wrap:anywhere; }
.audience-option { gap:10px; padding:12px 4px; min-height:72px; }
.audience-option strong { font-size:.87rem; }
.audience-option small { font-size:.73rem; }
.selected-chips { display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.selected-chips button { font-size:.73rem; padding:8px; max-width:100%; overflow-wrap:anywhere; text-align:left; background:#f2f2f2; }
.audience-list { overscroll-behavior:contain; scrollbar-gutter:stable; }
@media (max-width:900px) {
  .interview-layout { grid-template-columns:minmax(260px,1fr) minmax(0,1fr); gap:24px; }
  .interview-page { padding:20px 24px 40px; }
}
@media (max-width:740px) {
  .interview-layout { grid-template-columns:1fr; gap:28px; }
  .interview-page { padding:16px 16px 32px; }
  .audience-list { max-height:min(420px,55dvh); }
  .interview-compose { padding-top:24px; border-top:var(--border); }
  .interview-actions { display:grid; grid-template-columns:1fr; }
  .interview-page h1 { font-size:1.65rem; }
}