/* AI helper scene (TASK-134 mock v2). Sits in section.au-final#contact, on top of static/css/aurora.css.
   A standing person talks to the visitor: no chat window, one speech bubble at a time.
   Classes are .ch-* (scene) and .av-* (avatar); colours come from the --au-* tokens. Only transform and opacity animate. */

.ch { container-type: inline-size; max-width: 1000px; margin: 0 auto; text-align: left; }
.ch-stage { display: grid; grid-template-columns: 1fr; gap: 6px; align-items: end; }
@container (min-width: 640px) { .ch-stage { grid-template-columns: 290px minmax(0, 1fr); gap: 12px; } }

/* ---- the person ---- */
.ch-avatar { position: relative; justify-self: center; width: 200px; align-self: end; }
@container (min-width: 640px) { .ch-avatar { width: 290px; justify-self: end; margin-bottom: 4px; } }
.ch-ground { position: absolute; left: -10%; right: -10%; bottom: 2px; height: 28px; border-radius: 50%; z-index: -1;
  background: radial-gradient(closest-side, rgba(122,107,255,.45), transparent); }
.av { display: block; width: 100%; height: auto; overflow: visible; }
.av g, .av path, .av ellipse { transform-box: view-box; }
.av-all, .av-head, .av-upR, .av-upL, .av-foreR, .av-foreL, .av-w, .av-bL, .av-bR, .av-look, .av-eyes, .av-clip, .m, .av-fx circle { transition: transform .75s cubic-bezier(.34,1.35,.5,1), opacity .35s; }
.av-all { transform-origin: 120px 400px; animation: av-breathe 4s ease-in-out infinite; }
.av-head { transform-origin: 120px 140px; }
.av-upR { transform-origin: 74px 168px; } .av-foreR { transform-origin: 74px 228px; } .av-foreR .av-w { transform-origin: 74px 228px; }
.av-upL { transform-origin: 166px 168px; } .av-foreL { transform-origin: 166px 228px; } .av-foreL .av-w { transform-origin: 166px 228px; }
.av-bL { transform-origin: 104px 84px; } .av-bR { transform-origin: 136px 84px; }
.av-eyes { transform-origin: 120px 96px; animation: av-blink 5.2s infinite; }
.av-shadow { transform-origin: 120px 406px; animation: av-shadow 4s ease-in-out infinite; }
.m { opacity: 0; } .m-open { transform-origin: 120px 117px; }
.av-clip { opacity: 0; transform-origin: 170px 290px; }
.av-fx circle { opacity: 0; }

@keyframes av-breathe { 50% { transform: translateY(-3px) scale(1.004); } }
@keyframes av-shadow { 50% { transform: scaleX(.95); opacity: .85; } }
@keyframes av-blink { 0%, 94%, 100% { transform: scaleY(1); } 97% { transform: scaleY(.08); } }
@keyframes av-wave { 0%, 100% { transform: rotate(-24deg); } 50% { transform: rotate(26deg); } }
@keyframes av-gesture { 0%, 100% { transform: rotate(-12deg); } 50% { transform: rotate(12deg); } }
@keyframes av-talk { 0%, 100% { transform: scaleY(.35); } 50% { transform: scaleY(1); } }
@keyframes av-hop { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
@keyframes av-spark { 0% { opacity: 0; transform: translateY(14px) scale(.4); } 30% { opacity: 1; } 100% { opacity: 0; transform: translateY(-34px) scale(1); } }

/* mouth shown per pose */
[data-pose="greet"] .m-smile, [data-pose="listen"] .m-smile, [data-pose="think"] .m-smile, [data-pose="offer"] .m-smile, [data-pose="bye"] .m-smile { opacity: 1; }
[data-pose="talk"] .m-open { opacity: 1; animation: av-talk .32s ease-in-out infinite; }
[data-pose="shrug"] .m-frown { opacity: 1; }
[data-pose="cheer"] .m-big { opacity: 1; }

/* greet: right arm up, waving */
[data-pose="greet"] .av-upR { transform: rotate(158deg); }
[data-pose="greet"] .av-foreR .av-w { animation: av-wave .9s ease-in-out infinite; }
[data-pose="greet"] .av-bL, [data-pose="greet"] .av-bR { transform: translateY(-2px); }
/* listen: head tilted, eyes down toward the reply field, brows up */
[data-pose="listen"] .av-head { transform: rotate(-7deg) translateY(3px); }
[data-pose="listen"] .av-look { transform: translateY(4px); }
[data-pose="listen"] .av-bL, [data-pose="listen"] .av-bR { transform: translateY(-4px); }
[data-pose="listen"] .av-upR { transform: rotate(10deg); } [data-pose="listen"] .av-upL { transform: rotate(-10deg); }
/* think: hand to chin, eyes up and aside */
[data-pose="think"] .av-upL { transform: rotate(42deg); } [data-pose="think"] .av-foreL { transform: rotate(132deg); }
[data-pose="think"] .av-head { transform: rotate(5deg); }
[data-pose="think"] .av-look { transform: translate(-4px, -4px); }
[data-pose="think"] .av-bR { transform: translateY(-5px) rotate(-6deg); }
/* talk: a hand gestures while the mouth moves */
[data-pose="talk"] .av-upR { transform: rotate(32deg); } [data-pose="talk"] .av-foreR { transform: rotate(-70deg); }
[data-pose="talk"] .av-foreR .av-w { animation: av-gesture 1.3s ease-in-out infinite; }
[data-pose="talk"] .av-upL { transform: rotate(-12deg); }
[data-pose="talk"] .av-head { transform: rotate(-2deg); }
/* shrug: sorry, palms up */
[data-pose="shrug"] .av-upR { transform: rotate(38deg); } [data-pose="shrug"] .av-foreR { transform: rotate(98deg); }
[data-pose="shrug"] .av-upL { transform: rotate(-38deg); } [data-pose="shrug"] .av-foreL { transform: rotate(-98deg); }
[data-pose="shrug"] .av-head { transform: rotate(-8deg) translateY(2px); }
[data-pose="shrug"] .av-bL { transform: rotate(-14deg) translateY(-1px); } [data-pose="shrug"] .av-bR { transform: rotate(14deg) translateY(-1px); }
/* offer: holds out a clipboard with the details */
[data-pose="offer"] .av-upL { transform: rotate(-22deg); } [data-pose="offer"] .av-foreL { transform: rotate(-84deg); }
[data-pose="offer"] .av-clip { opacity: 1; transform: rotate(84deg) translate(-4px, -6px); }
[data-pose="offer"] .av-upR { transform: rotate(8deg); }
[data-pose="offer"] .av-head { transform: rotate(3deg); }
/* cheer: both arms up, a little hop, sparkles */
[data-pose="cheer"] .av-all { animation: av-hop .7s ease-in-out infinite; }
[data-pose="cheer"] .av-upR { transform: rotate(168deg); } [data-pose="cheer"] .av-upL { transform: rotate(-168deg); }
[data-pose="cheer"] .av-bL, [data-pose="cheer"] .av-bR { transform: translateY(-4px); }
[data-pose="cheer"] .av-fx circle { animation: av-spark 1.6s ease-out infinite; }
[data-pose="cheer"] .av-fx circle:nth-child(2) { animation-delay: .25s; } [data-pose="cheer"] .av-fx circle:nth-child(3) { animation-delay: .5s; }
[data-pose="cheer"] .av-fx circle:nth-child(4) { animation-delay: .75s; } [data-pose="cheer"] .av-fx circle:nth-child(5) { animation-delay: 1s; } [data-pose="cheer"] .av-fx circle:nth-child(6) { animation-delay: 1.25s; }
/* bye: slow, kind wave, head tilted */
[data-pose="bye"] .av-upR { transform: rotate(150deg); }
[data-pose="bye"] .av-foreR .av-w { animation: av-wave 1.8s ease-in-out infinite; }
[data-pose="bye"] .av-head { transform: rotate(-5deg); }

/* ---- what they say ---- */
.ch-say { min-width: 0; display: flex; flex-direction: column; gap: 12px; padding-bottom: 6px; }
.ch-who { display: flex; align-items: center; gap: 9px; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--au-mute); margin: 0; }
.ch-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--au-or); box-shadow: 0 0 0 0 rgba(255,106,0,.7); animation: au-ping 2.4s infinite; }

.ch-bubble { position: relative; min-height: 132px; background: #1b1833 !important; padding: 22px 26px; border-radius: 28px 28px 28px 8px; font-size: 19px; line-height: 1.5;
  background: rgba(255,255,255,.1); border: 1px solid var(--au-line); backdrop-filter: blur(16px);
  box-shadow: 0 30px 80px -30px rgba(122,107,255,.55); display: flex; align-items: center; }
.ch-bubble > p { margin: 0; overflow-wrap: anywhere; }
/* the tail points at the person: left on wide layouts, up on narrow ones */
.ch-bubble::before { content: ""; position: absolute; width: 22px; height: 22px; border: 1px solid var(--au-line); backdrop-filter: none;
  border-right: 0; border-top: 0; left: -11px; bottom: 34px; transform: rotate(45deg); border-radius: 0 0 0 6px; background: #1b1833; }
@container (max-width: 639px) {
  .ch-bubble { border-radius: 28px; font-size: 17px; padding: 18px 20px; min-height: 120px; }
  .ch-bubble::before { left: 50%; top: -11px; bottom: auto; margin-left: -11px; border: 1px solid var(--au-line); border-right: 0; border-bottom: 0; border-radius: 6px 0 0 0; }
}
.ch-words.reveal span { opacity: 0; animation: ch-word .4s ease-out forwards; }
@keyframes ch-word { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }
.ch-think i { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--au-or2); margin-right: 7px; animation: ch-bounce 1s infinite; }
.ch-think i:nth-child(2) { animation-delay: .15s; } .ch-think i:nth-child(3) { animation-delay: .3s; margin: 0; }
@keyframes ch-bounce { 40% { transform: translateY(-7px); } 0%, 80%, 100% { transform: none; } }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.ch-sentbadge { position: absolute; top: -13px; right: 18px; margin: 0; padding: 4px 12px; border-radius: 999px; font-size: 13px; font-weight: 700;
  background: linear-gradient(135deg, var(--au-or), var(--au-or2)); color: #1a0900; }

/* what the visitor said last: a small line, not a bubble */
.ch-you { margin: -2px 6px 0; font-size: 14px; color: var(--au-mute); overflow-wrap: anywhere; }

/* ---- the reply field: the visitor's turn to talk ---- */
.ch-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.ch-chips button { font: inherit; font-size: 14px; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--au-line);
  background: var(--au-glass); color: #d4d0e8; cursor: pointer; transition: border-color .2s, color .2s, transform .2s; min-height: 40px; }
.ch-chips button:hover { border-color: rgba(255,152,56,.6); color: var(--au-ink); transform: translateY(-1px); }
.ch-chips[hidden], .ch-reply[hidden], .ch-card[hidden], .ch-note[hidden], .ch-you[hidden], .ch-think[hidden], .ch-words[hidden], .ch-sentbadge[hidden] { display: none; }
.ch-form { display: flex; gap: 10px; align-items: flex-end; }
.ch-form textarea { flex: 1; min-width: 0; resize: none; height: 52px; min-height: 0; max-height: 120px; padding: 14px 20px; border-radius: 26px 26px 26px 8px;
  border: 1px solid rgba(255,152,56,.45); background: rgba(255,255,255,.06); color: var(--au-ink); font: inherit; font-size: 16px; line-height: 1.4; }
.ch-form textarea::placeholder { color: #8d88a8; }
.ch-form textarea:focus-visible { outline: 2px solid rgba(255,152,56,.85); outline-offset: 2px; }
.ch-form textarea:disabled { opacity: .5; cursor: not-allowed; border-color: var(--au-line); }
.ch-send { flex: none; width: 52px; height: 52px; border-radius: 50%; border: 0; cursor: pointer; display: grid; place-items: center;
  background: linear-gradient(135deg, var(--au-or), var(--au-or2)); color: #1a0900; font-size: 22px; font-weight: 700; transition: transform .2s; }
.ch-send:hover:not(:disabled) { transform: scale(1.07); }
.ch-send:disabled { opacity: .4; cursor: not-allowed; }
.ch-send:focus-visible, .ch-chips button:focus-visible, .ch-fold summary:focus-visible, .ch-card input:focus-visible,
.ch-card textarea:focus-visible, .ch-card-actions .au-btn:focus-visible { outline: 2px solid var(--au-or2); outline-offset: 3px; }
.ch-count { display: flex; justify-content: space-between; gap: 12px; padding: 6px 8px 0; font-size: 12px; color: var(--au-mute); min-height: 22px; }
.ch-count .warn { color: #ff9a82; }
/* privacy notice: always visible under the input, never hidden behind a click */
.au-footer .au-chatnote { margin: 14px auto 0; max-width: 62ch; font-size: 13px; line-height: 1.5; color: var(--au-mute); }

/* ---- details card: the person hands over a clipboard ---- */
.ch-card { border: 1px solid rgba(255,152,56,.45); border-radius: 22px; padding: 18px; animation: ch-in .5s cubic-bezier(.16,1,.3,1) both;
  background: linear-gradient(135deg, rgba(255,106,0,.14), rgba(122,107,255,.14)); }
.ch-card h4 { font-size: 16px; margin: 0 0 12px; }
.ch-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ch-grid .full { grid-column: 1 / -1; }
.ch-card label { display: block; font-size: 12px; color: var(--au-mute); margin-bottom: 4px; }
.ch-card input, .ch-card textarea { width: 100%; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--au-line);
  background: rgba(255,255,255,.07); color: var(--au-ink); font: inherit; font-size: 15px; min-height: 44px; }
.ch-card textarea { min-height: 64px; resize: vertical; }
.ch-card .bad input { border-color: #ff7a5c; background: rgba(255,122,92,.08); }
.ch-card-actions { display: flex; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
.ch-card-actions .au-btn { padding: 11px 22px; border: 0; cursor: pointer; font: inherit; font-weight: 700; min-height: 44px; color: #1a0900; }
.ch-card-actions .au-btn.au-ghost { color: var(--au-ink); border: 1px solid var(--au-line); background: transparent; }
@keyframes ch-in { from { opacity: 0; transform: translateY(10px); } }

/* ---- error and cap: a quiet strip under the bubble (third person, not the person speaking) ---- */
.ch-note { display: flex; gap: 12px; align-items: flex-start; padding: 13px 16px; border-radius: 14px; font-size: 14.5px; animation: ch-in .45s cubic-bezier(.16,1,.3,1) both; }
.ch-note p { margin: 0; }
.ch-note > span:first-child { flex: none; width: 18px; height: 18px; border-radius: 50%; display: inline-grid; place-items: center; font-size: 12px; font-weight: 700; margin-top: 2px; color: #1a0900; }
.ch-note.err { background: rgba(255,122,92,.12); border: 1px solid #ff7a5c; } .ch-note.err > span:first-child { background: #ff7a5c; }
.ch-note.cap { background: rgba(255,152,56,.1); border: 1px solid rgba(255,152,56,.5); } .ch-note.cap > span:first-child { background: var(--au-or2); }
.ch-note a { color: var(--au-or2); }

/* ---- form fallback, folded ---- */
.ch-fold { margin-top: 18px; }
.ch-fold summary { cursor: pointer; display: block; width: max-content; margin-left: auto; text-align: right; color: var(--au-or2); font-size: 15px; list-style: none; padding: 10px; min-height: 44px; }
.ch-fold summary::-webkit-details-marker { display: none; }
.ch-fold summary::after { content: " ▾"; } .ch-fold[open] summary::after { content: " ▴"; }
.ch-fold .au-form { margin-top: 12px; }
.ch-fold .au-btn.au-submit { text-align: center; }

/* ---- states board (review only, not part of the page) ---- */
.bd { max-width: 1480px; margin: 0 auto; padding: 32px 28px 80px; }
.bd h1 { font-size: 34px; margin: 0 0 8px; max-width: none; letter-spacing: -.02em; }
.bd > p { color: var(--au-mute); max-width: 80ch; margin-bottom: 36px; }
.bd-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 640px), 1fr)); gap: 44px 32px; }
.bd-cell h2 { font-size: 15px; letter-spacing: .02em; margin: 0 0 4px; max-width: none; }
.bd-cell small { display: block; color: var(--au-mute); font-size: 13px; margin-bottom: 14px; max-width: 70ch; }
.bd-cell *, .bd-cell *::before { animation-play-state: running; }
body.aurora:has(.bd) { background: #0b0a16; } body.aurora:has(.bd)::after, body.aurora:has(.bd) .au-sky { display: none; }

@media (prefers-reduced-motion: reduce) {
  .ch *, .ch *::before, .bd * { animation: none !important; transition: none !important; }
  .ch-think i { opacity: .8; }                       /* three still dots keep the "typing" cue */
  [data-pose="cheer"] .av-fx circle { opacity: 1; }  /* sparkles shown still */
}
.ch .ch-form textarea { min-height: 52px; height: 52px; }
.ch, .bd { overflow-x: clip; }
.ch-form textarea { box-sizing: border-box; }
.ch-card input, .ch-card textarea { box-sizing: border-box; }

/* ---- v3 figure geometry (avatar.js): origins and pose angles tuned to the natural-proportion figure ---- */
.av-head { transform-origin: 120px 88px; }
.av-upR { transform-origin: 71px 102px; } .av-foreR, .av-foreR .av-w { transform-origin: 71px 166px; }
.av-upL { transform-origin: 169px 102px; } .av-foreL, .av-foreL .av-w { transform-origin: 169px 166px; }
.av-bL { transform-origin: 109px 40px; } .av-bR { transform-origin: 131px 40px; }
.av-eyes { transform-origin: 120px 50px; } .m-open { transform-origin: 120px 75px; }
.av-clip { transform-origin: 169px 240px; }
.av-look { transition: transform .5s; }
.av-all { animation-name: av-breathe; }
[data-pose="greet"] .av-upR { transform: rotate(104deg); } [data-pose="greet"] .av-foreR { transform: rotate(74deg); }
[data-pose="listen"] .av-head { transform: rotate(-6deg) translateY(2px); }
[data-pose="listen"] .av-look { transform: translateY(2px); }
[data-pose="listen"] .av-upR { transform: rotate(8deg); } [data-pose="listen"] .av-upL { transform: rotate(-8deg); }
[data-pose="think"] .av-upL { transform: rotate(36deg); } [data-pose="think"] .av-foreL { transform: rotate(150deg); }
[data-pose="think"] .av-look { transform: translate(-2px, -2px); }
[data-pose="talk"] .av-upR { transform: rotate(34deg); } [data-pose="talk"] .av-foreR { transform: rotate(62deg); }
[data-pose="shrug"] .av-upR { transform: rotate(38deg); } [data-pose="shrug"] .av-foreR { transform: rotate(100deg); }
[data-pose="shrug"] .av-upL { transform: rotate(-38deg); } [data-pose="shrug"] .av-foreL { transform: rotate(-100deg); }
[data-pose="offer"] .av-upL { transform: rotate(-24deg); } [data-pose="offer"] .av-foreL { transform: rotate(-78deg); }
[data-pose="offer"] .av-clip { opacity: 1; transform: rotate(102deg) translate(-8px, -8px); }
[data-pose="cheer"] .av-upR { transform: rotate(125deg); } [data-pose="cheer"] .av-foreR { transform: rotate(50deg); }
[data-pose="cheer"] .av-upL { transform: rotate(-125deg); } [data-pose="cheer"] .av-foreL { transform: rotate(-50deg); }
[data-pose="bye"] .av-upR { transform: rotate(104deg); } [data-pose="bye"] .av-foreR { transform: rotate(74deg); }
.ch-fold .au-form input, .ch-fold .au-form textarea { box-sizing: border-box; }

/* v4: calmer thinking pose (open hand, "let me see"), narrower shoulders live in avatar.js */
[data-pose="think"] .av-upL { transform: rotate(-14deg); } [data-pose="think"] .av-foreL { transform: rotate(-62deg); }
[data-pose="think"] .av-head { transform: rotate(6deg); }
[data-pose="think"] .av-look { transform: translate(-2px, -1.5px); }
[data-pose="think"] .av-bL { transform: translateY(-3px); } [data-pose="think"] .av-bR { transform: translateY(-5px) rotate(-5deg); }
/* links inside assistant replies (chat-links.js) */
.ch-words a { color: var(--au-or2); text-decoration: underline; text-underline-offset: 2px; overflow-wrap: anywhere; }
.ch-words a:hover { text-decoration-thickness: 2px; }
.ch-words a:focus-visible { outline: 2px solid var(--au-or2); outline-offset: 2px; border-radius: 3px; }