/* ===== Cygnix assistant (chat.js) ===== */
.chat{width:min(400px,calc(100vw - 24px));max-height:min(640px,calc(100vh - 110px))}
.chat-b{scroll-behavior:smooth;overscroll-behavior:contain;min-height:120px}
.msg{animation:msgIn .22s ease-out both;word-wrap:break-word}
.msg .try{color:var(--muted);font-size:12.5px}
.msg.typing{display:inline-flex;gap:4px;align-items:center;width:auto;padding:12px 14px}
.msg.typing i{width:7px;height:7px;border-radius:50%;background:var(--cyan2);opacity:.35;animation:dot 1s infinite}
.msg.typing i:nth-child(2){animation-delay:.15s}.msg.typing i:nth-child(3){animation-delay:.3s}
@keyframes dot{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
@keyframes msgIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.chips.after,.chips.rel{margin-top:-2px}
.chip{text-decoration:none!important;line-height:1.3}
.chip-p{background:rgba(56,189,248,.16);border-color:var(--cyan);color:#E0F2FE;font-weight:700}
.chat-sug{display:flex;gap:6px;overflow-x:auto;padding:0 10px 8px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.chat-sug::-webkit-scrollbar{display:none}
.chat-sug .chip{flex:none;white-space:nowrap;font-size:12px;padding:5px 10px}
.chat-act{display:flex;gap:6px;padding:0 10px 8px;flex-wrap:wrap}
.chat-act .ca{flex:1 1 auto;background:#10203A;border:1px solid var(--line);color:var(--text);border-radius:10px;padding:7px 9px;font:inherit;font-size:12px;font-weight:600;cursor:pointer}
.chat-act .ca:hover{border-color:rgba(56,189,248,.5)}
.chat-f input{min-width:0;flex:1}
.chat-note{padding:0 10px 8px}
@media (max-width:560px){
 .chat{left:8px;right:8px;width:auto;bottom:74px;max-height:min(60vh,500px);max-height:min(60svh,500px);border-radius:16px}
 .chat-h{padding:9px 12px}.chat-h img{width:32px;height:32px}.chat-h small{font-size:11px}
 .chat-b{padding:10px;gap:8px;min-height:90px}.msg{font-size:13.5px;padding:9px 11px;max-width:92%}
 .chat-f{padding:8px}.chat-f input{font-size:16px;padding:9px 11px}
 .chat-act{padding:0 8px 6px;flex-wrap:nowrap}.chat-act .ca{font-size:11.5px;padding:6px 7px;white-space:nowrap}
 .chat-note{display:none}
 .chat-fab{right:12px;bottom:12px}
}

/* ===== Page explainer: the eagle explains this page ===== */
.explain{padding:56px 0 24px}
.ex{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:34px;align-items:center;padding:28px 30px;border-radius:22px;position:relative;overflow:hidden}
.ex:before{content:"";position:absolute;inset:auto -10% -60% 30%;height:120%;background:radial-gradient(closest-side,rgba(56,189,248,.18),transparent);pointer-events:none}
.ex-stage{position:relative;height:300px;perspective:900px;--rx:0deg;--ry:0deg}
.ex-3d{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(var(--rx)) rotateY(var(--ry));transition:transform .25s ease-out}
.ex-ring{position:absolute;left:50%;top:56%;width:230px;height:230px;margin:-115px 0 0 -115px;border-radius:50%;border:2px solid rgba(56,189,248,.45);transform:rotateX(72deg) translateZ(-40px);box-shadow:0 0 40px rgba(56,189,248,.35),inset 0 0 30px rgba(56,189,248,.25);animation:exSpin 14s linear infinite}
.ex-ring.r2{width:170px;height:170px;margin:-85px 0 0 -85px;border-style:dashed;border-color:rgba(125,211,252,.35);animation-duration:9s;animation-direction:reverse}
.ex-orb{position:absolute;left:50%;top:44%;width:180px;height:180px;margin:-90px 0 0 -90px;border-radius:50%;background:radial-gradient(circle at 35% 30%,rgba(125,211,252,.35),rgba(15,26,46,.2) 60%,transparent 70%);transform:translateZ(10px)}
.ex-eagle{position:absolute;left:50%;top:6%;width:132px;height:234px;margin-left:-66px;object-fit:cover;object-position:50% 22%;border-radius:70px 70px 60px 60px;transform:translateZ(60px);filter:drop-shadow(0 18px 30px rgba(0,0,0,.6)) drop-shadow(0 0 22px rgba(56,189,248,.35));animation:exFloat 4.2s ease-in-out infinite}
.ex-shadow{position:absolute;left:50%;bottom:8%;width:120px;height:18px;margin-left:-60px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.6),transparent);animation:exShadow 4.2s ease-in-out infinite}
.ex-tag{position:absolute;font-size:11.5px;font-weight:700;padding:5px 10px;border-radius:999px;background:#0F1A2E;border:1px solid rgba(56,189,248,.35);color:var(--cyan2);transform:translateZ(90px);opacity:.35;transition:opacity .4s,transform .4s}
.ex-tag.t0{left:0;top:14%}.ex-tag.t1{right:0;top:30%}.ex-tag.t2{left:2%;bottom:24%}.ex-tag.t3{right:4%;bottom:12%}
.ex-stage[data-step="0"] .t0,.ex-stage[data-step="1"] .t1,.ex-stage[data-step="2"] .t2,.ex-stage[data-step="3"] .t3,.ex-stage[data-step="4"] .ex-tag{opacity:1;transform:translateZ(110px) scale(1.06)}
.ex-stage.talk .ex-eagle{animation:exFloat 4.2s ease-in-out infinite,exNod .5s ease-out}
@keyframes exSpin{to{transform:rotateX(72deg) translateZ(-40px) rotateZ(360deg)}}
@keyframes exFloat{0%,100%{translate:0 0}50%{translate:0 -10px}}
@keyframes exShadow{0%,100%{transform:scale(1);opacity:.9}50%{transform:scale(.82);opacity:.6}}
@keyframes exNod{0%{rotate:0deg}35%{rotate:-4deg}70%{rotate:2deg}100%{rotate:0deg}}
.ex-copy h2{margin:.2em 0 .5em}
.ex-bubble{display:none;position:relative;background:#13213A;border:1px solid rgba(56,189,248,.35);border-radius:16px;border-top-left-radius:4px;padding:14px 16px 14px 16px;min-height:86px;margin-bottom:14px}
.ex-bubble:before{content:"";position:absolute;left:-9px;top:14px;border:8px solid transparent;border-right-color:rgba(56,189,248,.35);border-left:0}
.ex-n{position:absolute;right:12px;top:8px;font-size:11px;color:var(--muted);font-weight:700}
.ex-say{margin:0;font-size:16.5px;line-height:1.55;font-weight:600;color:#E2E8F0;padding-right:28px}
.ex-say:after{content:"▍";color:var(--cyan);animation:blink 1s steps(1) infinite;margin-left:1px}
@keyframes blink{50%{opacity:0}}
.ex-steps{list-style:none;margin:0;padding:0;display:grid;gap:8px;counter-reset:ex}
.ex-steps li{counter-increment:ex;position:relative;padding:8px 12px 8px 40px;border-radius:12px;border:1px solid var(--line);font-size:14px;color:var(--muted);line-height:1.45}
.ex-steps li:before{content:counter(ex);position:absolute;left:10px;top:8px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:800;background:#13213A;color:var(--cyan2)}
.ex-steps li b{color:var(--text)}
.explain.js .ex-bubble{display:block}
.explain.js .ex-steps{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}
.explain.js .ex-steps li{cursor:pointer;font-size:0;padding:8px 10px 8px 36px;min-height:38px;display:flex;align-items:center;transition:border-color .2s,background .2s}
.explain.js .ex-steps li b{font-size:12.5px}
.explain.js .ex-steps li.on{border-color:var(--cyan);background:rgba(56,189,248,.1)}
.explain.js .ex-steps li.done:before{content:"✓";color:var(--green)}
.ex-ctl{display:none;align-items:center;gap:8px;margin-top:12px}
.explain.js .ex-ctl{display:flex}
.ex-ctl button{background:#10203A;border:1px solid var(--line);color:var(--text);border-radius:999px;padding:6px 12px;font:inherit;font-size:12.5px;font-weight:700;cursor:pointer}
.ex-bar{flex:1;height:4px;border-radius:4px;background:rgba(148,197,255,.12);overflow:hidden}.ex-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--cyan),var(--cyan2))}
.ex-note{font-size:11.5px;color:var(--muted);margin:10px 0 0}
@media (max-width:760px){
 .explain{padding:36px 0 8px}
 .ex{grid-template-columns:96px 1fr;gap:14px;padding:16px;align-items:start}
 .ex-stage{height:150px}.ex-ring{width:110px;height:110px;margin:-55px 0 0 -55px;animation:none;transform:rotateX(72deg)}.ex-ring.r2,.ex-tag,.ex-orb{display:none}
 .ex-eagle{width:76px;height:134px;margin-left:-38px;top:0;animation:none;filter:drop-shadow(0 8px 14px rgba(0,0,0,.5))}.ex-shadow{display:none}
 .ex-copy h2{font-size:22px}.ex-say{font-size:14.5px}.ex-bubble{min-height:96px;padding:12px}
 .explain.js .ex-steps{grid-template-columns:repeat(5,1fr);gap:5px;grid-column:1/-1}
 .explain.js .ex-steps li{padding:0;justify-content:center;min-height:30px}.explain.js .ex-steps li b{display:none}.explain.js .ex-steps li:before{position:static}
 .ex-copy{display:contents}.ex-head{grid-column:2}.ex-bubble,.ex-ctl,.ex-note{grid-column:1/-1}
}
@media (prefers-reduced-motion:reduce){.ex-ring,.ex-eagle,.ex-shadow,.msg,.msg.typing i{animation:none!important}.ex-say:after{display:none}}
.chat-f,.chat-sug,.chat-act,.chat-note,.chat-h{flex-shrink:0}
.chat-sug{padding-top:2px;padding-bottom:8px;min-height:38px;align-items:center}
.ex-copy,.ex-copy .ex-head{text-align:left}.ex-copy h2,.ex-copy .eyebrow{text-align:left;margin-left:0;margin-right:0;max-width:none}
