/* «Спроси Ассоциацию» (public/ask.js). Только токены приложения — светлая
   и тёмная темы работают сами. */
.ask-mark{ width:32px; height:32px; border-radius:var(--r-control); background:var(--accent-bg); color:var(--accent-text);
  display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; }
.ask-mark svg{ width:18px; height:18px; }
.ask-mark.sm{ width:28px; height:28px; }
.ask-mark.sm svg{ width:16px; height:16px; }
.ask-title{ display:flex; align-items:center; gap:var(--s2); }
.ask-page{ display:flex; flex-direction:column; gap:var(--s4); }
.ask-page > .page-lede{ margin:0; }
.ask-page .section-head{ margin-top:0; }

.ask-box{ display:flex; flex-direction:column; gap:var(--s3); }
.ask-input{ width:100%; min-height:64px; padding:var(--s3); border-radius:var(--r-control); border:var(--border-w) solid var(--border);
  background:var(--bg); color:var(--text); font-family:inherit; font-size:16px; line-height:24px; resize:vertical; }
.ask-input:focus{ border-color:var(--accent); outline:none; }
.ask-input::placeholder{ color:var(--text-faint); }
.ask-box-row{ display:flex; gap:var(--s3); align-items:flex-end; }
.ask-ex{ flex:1; min-width:0; }
.ask-ex .chip{ max-width:100%; flex-shrink:1; height:auto; min-height:30px; padding:5px var(--s3); white-space:normal; text-align:left; line-height:18px; }
.ask-box .btn.primary svg{ width:16px; height:16px; }

.ask-loading{ display:flex; align-items:center; gap:var(--s3); color:var(--text-muted); font-weight:500; }
.ask-spin{ color:var(--accent-text); display:inline-flex; animation:askPulse 1.2s ease-in-out infinite; }
@keyframes askPulse{ 0%,100%{ opacity:.35; transform:scale(.9); } 50%{ opacity:1; transform:scale(1.08); } }

.ask-answer{ display:flex; flex-direction:column; gap:var(--s3); border-color:var(--accent-bg); padding:var(--s5); }
.ask-label{ display:inline-flex; align-items:center; gap:6px; color:var(--accent-text); font-size:var(--fs-label); line-height:var(--lh-label);
  font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
.ask-label svg{ width:16px; height:16px; }
.ask-text{ font-size:var(--fs-body); line-height:24px; color:var(--text); }
.ask-text p{ margin:0 0 var(--s2); }
.ask-text p:last-child{ margin-bottom:0; }
.ask-text ul{ margin:0 0 var(--s2); padding-left:20px; }
.ask-text li{ margin:4px 0; }

.ask-ref{ display:inline-flex; align-items:center; gap:5px; vertical-align:-4px; max-width:100%; height:24px; padding:0 8px 0 6px; margin:0 1px;
  border-radius:12px; background:var(--surface-hover); border:var(--border-w) solid var(--border); color:var(--text);
  font-size:var(--fs-caption); font-weight:500; line-height:1; white-space:nowrap; text-decoration:none; }
.ask-ref span{ overflow:hidden; text-overflow:ellipsis; }
.ask-ref svg{ flex-shrink:0; width:14px; height:14px; color:var(--text-faint); }
.ask-ref.ask-ref-p{ padding-left:3px; }
.ask-ref:hover{ border-color:var(--accent); color:var(--accent-text); }
.avatar.a18{ width:18px; height:18px; font-size:8px; }

.ask-note{ display:flex; align-items:flex-start; gap:var(--s2); padding:var(--s3) var(--s4); border-radius:var(--r-card);
  background:var(--surface); border:var(--border-w) dashed var(--border); color:var(--text-muted); font-size:var(--fs-caption); line-height:var(--lh-caption); }
.ask-note svg{ flex-shrink:0; width:16px; height:16px; color:var(--accent-text); margin-top:1px; }

.ask-people{ overflow:hidden; }
.ask-people > .btn{ margin:0; border-radius:0; border-top:var(--border-w) solid var(--border); height:40px; }
.ask-person{ display:flex; gap:var(--s3); padding:var(--s3) var(--s4); align-items:flex-start; border-top:var(--border-w) solid var(--border);
  text-decoration:none; color:inherit; }
.ask-people > .ask-person:first-child{ border-top:0; }
.ask-more > .ask-person:first-child{ border-top:var(--border-w) solid var(--border); }
.ask-person:hover{ background:var(--surface-hover); }
.ask-person-b{ min-width:0; flex:1; display:flex; flex-direction:column; gap:2px; }
.ask-person .n{ font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ask-h{ color:var(--text-muted); font-size:var(--fs-caption); line-height:var(--lh-caption); }
.ask-why{ font-size:var(--fs-caption); line-height:var(--lh-caption); color:var(--text); overflow-wrap:anywhere; }
.ask-via{ color:var(--text-faint); font-weight:500; }

.ask-items{ gap:var(--s2); }
.ask-items .card + .card{ margin-top:0; }
.ask-more{ display:contents; }
.ask-more[hidden]{ display:none; }
.ask-item{ display:flex; flex-direction:column; gap:6px; text-decoration:none; color:inherit; }
.ask-item:hover{ border-color:var(--accent-bg); background:var(--surface-hover); }
.ask-item-top{ display:flex; align-items:center; flex-wrap:wrap; gap:var(--s2); }
.ask-kind{ display:inline-flex; align-items:center; gap:5px; font-size:var(--fs-label); line-height:var(--lh-label); font-weight:600;
  letter-spacing:.06em; text-transform:uppercase; color:var(--text-faint); }
.ask-kind svg{ width:14px; height:14px; }
.ask-badge{ font-size:var(--fs-label); line-height:var(--lh-label); font-weight:600; padding:2px 8px; border-radius:var(--r-pill);
  background:var(--good-bg); color:var(--good); }
.ask-item-t{ font-weight:500; }
.ask-snip{ font-size:var(--fs-body-sm); line-height:var(--lh-body-sm); color:var(--text); overflow-wrap:anywhere;
  display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }
.ask-page mark{ background:var(--warn-bg); color:inherit; border-radius:3px; padding:0 1px; }

.ask-hist{ display:flex; flex-direction:column; }
.ask-hist-i{ display:flex; align-items:center; gap:var(--s3); padding:var(--s2) 0; border-top:var(--border-w) solid var(--border); }
.ask-hist-i:first-child{ border-top:0; padding-top:0; }
.ask-hist-i a{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-decoration:none; }
.ask-hist-i a:hover{ color:var(--accent-text); }
.ask-x{ flex-shrink:0; }

/* Строка на главной под баннерами */
.ask-home{ display:flex; align-items:center; gap:var(--s2); padding:var(--s2) var(--s2) var(--s2) var(--s3); margin-bottom:var(--s4); }
.ask-home input{ flex:1; min-width:0; height:36px; border:0; background:none; color:var(--text); font-family:inherit; font-size:var(--fs-body); outline:none; }
.ask-home input::placeholder{ color:var(--text-faint); }
.ask-home:focus-within{ border-color:var(--accent); }

@media (max-width:640px){
  .ask-box-row{ flex-direction:column; align-items:stretch; }
  .ask-box #askBtn{ width:100%; height:44px; }
  .ask-answer{ padding:var(--s4); }
  .ask-home .btn{ padding:0 var(--s3); }
}
@media (prefers-reduced-motion: reduce){ .ask-spin{ animation:none; } }
