/* Stage 7a: D3 standalone pain finder. Search controls/cards live in components/search.css. */
[data-page="ai"] {
  --ai-page-size:clamp(40px,3.6vw,52px);
  --ai-page-phone-size:clamp(27px,7.7vw,30px);
  --ai-row-size:17.5px;
  --ai-pin-radius:50% 50% 0 50%;
  --line-on:var(--line);
  color:var(--ink);
}
.ai-tool-page .page-wrap { width:100%; max-width:var(--page-max); margin-inline:auto; padding-inline:var(--gutter); }
.ai-tool-page .page-head { padding:calc(var(--frame-rest-height) + 24px) 0 40px; }
.ai-tool-page .crumbs { display:flex; align-items:center; flex-wrap:wrap; gap:6px; margin-bottom:18px; color:var(--muted); font:var(--text-caption); }
.ai-tool-page .crumbs a { display:inline-flex; align-items:center; min-width:var(--tap-min); min-height:var(--tap-min); }
.ai-tool-page .crumbs [aria-hidden] { color:var(--faint); }
.ai-tool-page .crumbs [aria-current] { color:var(--ink-2); }
.ai-tool-page .page-head h1 { font:var(--text-title-page); font-size:var(--ai-page-size); letter-spacing:-.045em; text-wrap:balance; }
.ai-tool-page .page-lead { margin-top:12px; color:var(--ink-2); font:var(--text-lead); }
.ai-tool { padding-bottom:var(--sp-72); }
.ai-search { max-width:820px; margin:0 auto 48px; }
.ai-search-heading { margin-bottom:24px; }
.ai-search h2 { font:var(--text-title-content); letter-spacing:-.035em; }
.ai-search-heading p { margin-top:12px; color:var(--ink-2); font:var(--text-body); }
.ai-search .send { display:flex; align-items:center; justify-content:center; gap:16px; }
.ai-search .examples { justify-content:flex-start; }
.ai-hint { margin-top:12px; color:var(--ink); font:var(--text-caption); }
.ai-tool[data-hh-moment-only="true"] #search-hint { display:none; }
.ai-part-section { display:grid; grid-template-columns:minmax(0,440px) minmax(0,1fr); align-items:center; gap:var(--sp-72); padding-block:var(--sp-48); border-top:1px solid var(--line); }
.ai-parts { grid-column:2; grid-row:1; min-width:0; }
.ai-parts > h2 { font:var(--text-title-block); letter-spacing:-.03em; }
.ai-part-list { display:flex; flex-wrap:wrap; gap:12px 8px; margin-top:24px; }
.ai-body { position:relative; grid-column:1; grid-row:1; display:flex; flex-direction:column; width:100%; min-width:0; aspect-ratio:4/5; padding:24px; border-radius:var(--r-l); background:var(--tint); }
.ai-body-label { display:flex; align-items:center; justify-content:space-between; gap:8px; color:var(--navy); font:var(--text-caption); }
.ai-body-label [data-body-part] { padding:2px 8px; border-radius:var(--r-pill); background:var(--surface); font-weight:600; }
.ai-body-label [data-body-part]:empty { display:none; }
.ai-body .body-controls { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:8px; margin:4px 0; }
.ai-body .body-controls button { min-height:var(--tap-min); padding:8px 12px; border:1px solid var(--control-line); border-radius:var(--r-pill); background:var(--surface); color:var(--navy); font:var(--text-caption); }
.ai-body #pain-figure { display:block; flex:1; width:100%; height:0; min-height:0; margin:4px 0; touch-action:pan-y; mix-blend-mode:multiply; }
.ai-body figcaption { flex-shrink:0; color:var(--muted); font:var(--text-caption-phone); }
.ai-body .body-label { position:absolute; z-index:2; padding:5px 10px; border:1px solid var(--navy); border-radius:var(--r-pill); background:var(--surface); color:var(--navy); font:var(--text-caption); white-space:nowrap; pointer-events:none; }
.ai-body .body-sides { position:absolute; inset:auto 24px 48px; display:flex; justify-content:space-between; color:var(--muted); font:var(--text-tag); pointer-events:none; }
.ai-results { display:grid; gap:var(--sp-48); min-width:0; padding-top:var(--sp-48); border-top:1px solid var(--line); }
.ai-answer .ai-result { position:relative; margin:0; padding:0; border:0; background:none; color:var(--ink); font:var(--text-title-sub); font-weight:400; }
.ai-answer .hh-out-k { padding-right:120px; }
.has-answer .hh-out-n { display:none; }
.ai-progress { position:absolute; top:0; right:0; display:flex; align-items:center; gap:5px; color:var(--muted); font:var(--text-caption); }
.ai-progress > span { display:inline-flex; align-items:center; gap:3px; }
.ai-progress .is-filled { color:var(--navy); }
.ai-progress i { display:inline-flex; align-items:center; justify-content:center; width:16px; height:16px; font:var(--text-tag); }
.ai-progress .is-filled i { border-radius:var(--r-pill); background:var(--navy); color:var(--surface); }
.ai-answer .hh-fix { color:var(--navy); }
.ai-answer-card > .s2c { display:none; }
.ai-answer-card .body-say { position:static; margin:0; padding:18px 0; border-top:1px solid var(--line); color:var(--ink); font:var(--text-list); }
.ai-answer-card .s2-say-k, .ai-answer-card [data-hh-say-text] { display:block; }
.ai-answer-card .s2-say-k { color:var(--muted); font:var(--text-caption); opacity:1; }
.ai-answer-card .s2x-links, .ai-answer-card .s2x-acts { display:flex; flex-wrap:wrap; align-items:center; gap:4px 20px; margin-top:12px; color:var(--navy); font:var(--text-caption); }
.ai-answer-card .s2x-links a, .ai-answer-card .s2x-back { display:inline-flex; align-items:center; min-height:var(--tap-min); text-decoration:underline; text-underline-offset:4px; }
.ai-answer-card .s2x-call { display:inline-flex; align-items:center; min-height:var(--tap-min); padding:8px 16px; border-radius:var(--r-pill); background:var(--lime); color:var(--navy); font-variant-numeric:tabular-nums; }
.ai-answer-card .s2x-back { padding:8px; background:transparent; }
.ai-conditions { min-width:0; }
.ai-conditions h3 { font:var(--text-title-content); letter-spacing:-.035em; text-wrap:balance; }
.ai-conditions .cond-lead { margin-top:12px; color:var(--ink-2); font:var(--text-body); }
.ai-result-count { margin-top:20px; color:var(--navy); font:var(--text-caption); }
.ai-conditions .cond-note { display:flex; align-items:baseline; gap:8px; margin:8px 0 24px; color:var(--muted); font:var(--text-caption); }
.ai-conditions .cond-note::before { content:none; flex:none; padding:4px 7px; border:1px dashed var(--tbd-border); border-radius:var(--r-tag); background:var(--surface); font:var(--text-tag); }
.ai-tool .ai-note { margin-top:28px; }
.ai-tool:has([data-hh-conds]:not([hidden]) .s2c-n) .ai-note { display:none; }
.ai-tool-page .page-bottom { padding:24px 0 104px; }
.ai-tool-page .page-visit-links { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 48px; }
.ai-tool-page .page-visit-links a { display:grid; grid-template-columns:auto minmax(0,1fr) auto; grid-template-rows:auto auto; gap:2px 16px; align-items:center; min-height:104px; padding:22px 4px 22px 0; border-top:2px solid var(--navy); }
.ai-tool-page .pvl-t { color:var(--navy); font:var(--text-link-title); letter-spacing:-.02em; }
.ai-tool-page .pvl-s { grid-column:2; color:var(--muted); font:var(--text-tab-pill); line-height:1.6; font-variant-numeric:tabular-nums; }
.ai-tool-page .pvl-ico { grid-row:1/3; position:relative; width:24px; height:24px; color:var(--navy); }
.ai-tool-page .pvl-clock { border:1.6px solid currentColor; border-radius:var(--r-pill); }
.ai-tool-page .pvl-clock::after { content:''; position:absolute; top:5px; left:10px; width:5px; height:7px; border-left:1.6px solid currentColor; border-bottom:1.6px solid currentColor; }
.ai-tool-page .pvl-pin { width:20px; height:20px; margin:0 2px 4px; border:1.6px solid currentColor; border-radius:var(--ai-pin-radius); transform:rotate(45deg); }
.ai-tool-page .pvl-pin::after { content:''; position:absolute; top:6px; left:5px; width:7px; height:7px; border:1.6px solid currentColor; border-radius:var(--r-pill); }
.ai-tool-page .page-visit-links .arrow { grid-column:3; grid-row:1/3; }
@media (hover:hover) {
  .ai-tool-page .crumbs a:hover { color:var(--navy); }
  .ai-body .body-controls button:hover { border-color:var(--navy); }
  .ai-tool-page .page-visit-links a:hover .pvl-t { text-decoration:underline; text-underline-offset:4px; }
}
@media (max-width:1100px) { .ai-part-section { grid-template-columns:minmax(0,40%) minmax(0,1fr); gap:40px; } }
@media (max-width:860px) {
  .ai-tool-page .page-head { padding:calc(var(--frame-rest-height) + 16px) 0 32px; }
  .ai-tool-page .crumbs { margin-bottom:16px; font:var(--text-caption-phone); }
  .ai-tool-page .page-head h1 { font:var(--text-title-page-phone); }
  .ai-tool-page .page-lead { font:var(--text-lead-phone); }
  .ai-search { margin-bottom:32px; }
  .ai-search h2, .ai-conditions h3 { font:var(--text-title-content-phone); }
  .ai-part-section { grid-template-columns:minmax(0,1fr); gap:28px; padding-block:32px; }
  .ai-parts { grid-column:1; grid-row:1; }
  .ai-parts > h2 { font:var(--text-title-block-phone); }
  .ai-body { grid-column:1; grid-row:2; height:480px; aspect-ratio:auto; padding:20px; }
  .ai-body .body-sides { inset-inline:20px; bottom:48px; }
  .ai-results { gap:32px; padding-top:32px; }
  .ai-tool-page .page-bottom { padding:8px 0 56px; }
  .ai-tool-page .page-visit-links { grid-template-columns:minmax(0,1fr); gap:0; border-top:2px solid var(--navy); }
  .ai-tool-page .page-visit-links a { min-height:84px; padding:16px 2px 16px 0; border-top:0; border-bottom:1px solid var(--line); column-gap:14px; }
  .ai-tool-page .pvl-t { font:var(--text-title-sub-phone); font-weight:500; }
  .ai-tool-page .pvl-s { font:var(--text-caption); font-variant-numeric:tabular-nums; }
}
@media (max-width:600px) {
  .ai-tool-page .page-head h1 { font-size:var(--ai-page-phone-size); }
  .ai-search .send { gap:8px; padding-inline:12px; }
  .ai-part-list { gap:8px; }
  .ai-part { padding-inline:12px; }
  .ai-body { height:380px; padding:16px; }
  .ai-body .body-sides { inset-inline:16px; bottom:48px; }
  .ai-progress { position:static; margin-top:8px; }
  .ai-answer .hh-out-k { padding-right:0; }
  .ai-answer-card .body-say { font:var(--text-list-phone); }
}
