/* Ask Julian (web/ask.js): the chat panel at the right edge (a full-screen sheet on phones). The deck's look:
   Fira Sans, Congress Blue and cyan, spaced uppercase kickers, square corners. */
.ask{position:fixed;top:0;right:0;bottom:0;z-index:120;width:min(420px,100vw);display:flex;flex-direction:column;
  background:#fff;color:var(--ink,#111418);font-family:"Fira Sans",Arial,sans-serif;border-left:4px solid var(--blue,#004388);
  box-shadow:-24px 0 60px rgba(0,0,0,.35);transform:translateX(104%);transition:transform .32s var(--ease,ease)}
.ask.on{transform:none}
.ask[hidden]{display:none}
@media (prefers-reduced-motion:reduce){.ask{transition:none}}

.ask-h{display:flex;align-items:flex-start;gap:14px;padding:18px 16px 16px 20px;border-bottom:1px solid var(--line,#DCE3EA)}
.ask-av{flex:none;width:48px;height:48px;border-radius:50%;background:#1b2430 url(/theme/img/presenter.webp) no-repeat;
  background-size:560% auto;background-position:69.5% 19%;box-shadow:0 0 0 2px #fff,0 0 0 4px var(--cyan,#00A6E2)}
.ask-ht{flex:1 1 auto;min-width:0}
.ask-k{margin:2px 0 3px;font-size:11px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;color:var(--cyan,#00A6E2)}
.ask-h h2{margin:0;font-size:24px;line-height:1.05;font-weight:900;letter-spacing:.5px;text-transform:uppercase;color:var(--blue,#004388)}
.ask-d{margin:6px 0 0;font-size:14px;font-weight:300;line-height:1.35;color:var(--grey,#6B7785)}
.ask-x{flex:none;width:40px;height:40px;margin:-4px -4px 0 0;display:inline-flex;align-items:center;justify-content:center;
  border:0;border-radius:3px;background:transparent;color:var(--ink,#111418);cursor:pointer}
.ask-x:hover{background:var(--pale,#F2F6FA)}
.ask .ai{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}

.ask-log{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:20px 20px 8px;display:flex;
  flex-direction:column;gap:16px;background:linear-gradient(180deg,var(--pale,#F2F6FA),#fff 140px)}
.ask-log:focus-visible{outline-offset:-3px}
.ask-m{max-width:88%;display:flex;flex-direction:column;gap:4px;animation:ask-in .24s var(--ease,ease) both}
@media (prefers-reduced-motion:reduce){.ask-m{animation:none}}
@keyframes ask-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.ask-who{font-size:10.5px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--grey,#6B7785)}
.ask-tx{margin:0;font-size:15.5px;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere}
.ask-m.j{align-self:flex-start}
.ask-m.j .ask-who{color:var(--cyan,#00A6E2)}
.ask-m.j .ask-tx{padding:2px 0 2px 14px;border-left:3px solid var(--cyan,#00A6E2);color:var(--ink,#111418)}
.ask-m.u{align-self:flex-end;align-items:flex-end}
.ask-m.u .ask-tx{padding:10px 14px;background:var(--blue,#004388);color:#fff;border-radius:3px}
.ask-m.s{align-self:stretch;max-width:none;padding:12px 14px;background:#fff;border:1px solid var(--line,#DCE3EA);border-radius:3px}
.ask-m.s .ask-tx{font-size:14.5px;color:var(--ink,#111418)}
.ask-fb{align-self:flex-start;margin-top:8px;height:38px;padding:0 16px;border:0;border-radius:3px;background:var(--cyan,#00A6E2);
  color:#fff;font:700 12.5px/1 "Fira Sans",Arial,sans-serif;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer}
.ask-fb:hover{background:#0095cc}
.ask-dots{display:inline-flex;gap:5px;align-items:center;height:22px}
.ask-dots i{width:7px;height:7px;border-radius:50%;background:var(--cyan,#00A6E2);animation:ask-dot 1.1s infinite ease-in-out}
.ask-dots i:nth-child(2){animation-delay:.15s}.ask-dots i:nth-child(3){animation-delay:.3s}
@keyframes ask-dot{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
@media (prefers-reduced-motion:reduce){.ask-dots i{animation:none;opacity:.7}}
.ask-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.ask-form{flex:none;padding:12px 16px 4px 20px;border-top:1px solid var(--line,#DCE3EA);background:#fff}
.ask-form[hidden]{display:none}
.ask-row{display:flex;align-items:flex-end;gap:8px}
.ask-in{flex:1 1 auto;min-width:0;min-height:44px;max-height:132px;resize:none;padding:11px 12px;border:1px solid var(--line,#DCE3EA);
  border-radius:3px;font:400 15.5px/1.4 "Fira Sans",Arial,sans-serif;color:var(--ink,#111418);background:#fff}
.ask-in::placeholder{color:#8792a0}
.ask-in:focus{outline:none;border-color:var(--cyan,#00A6E2);box-shadow:0 0 0 3px rgba(0,166,226,.18)}
.ask-send{flex:none;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:3px;
  background:var(--blue,#004388);color:#fff;cursor:pointer}
.ask-send:hover{background:#00366e}
.ask-send:disabled{opacity:.4;cursor:default}
.ask-meta{display:flex;justify-content:space-between;gap:12px;margin-top:6px;font-size:12px;color:var(--grey,#6B7785)}
.ask-count{font-variant-numeric:tabular-nums;white-space:nowrap}
.ask-count.near{color:var(--red,#C8102E);font-weight:600}
.ask-note{margin:4px 0 0;min-height:0;font-size:12.5px;color:var(--blue,#004388);font-weight:600}
.ask-note:empty{display:none}
.ask-foot{flex:none;margin:0;padding:6px 20px 14px;font-size:11.5px;line-height:1.35;color:var(--grey,#6B7785);background:#fff}

/* phones: a full-screen sheet */
@media (max-width:600px){
  .ask{width:100vw;border-left:0;border-top:4px solid var(--blue,#004388);transform:translateY(104%);height:100dvh;bottom:auto}
  .ask-h{padding:14px 12px 12px 16px}
  .ask-h h2{font-size:21px}
  .ask-log{padding:16px 16px 8px}
  .ask-form{padding:10px 12px 4px 16px;padding-bottom:max(4px,env(safe-area-inset-bottom))}
  .ask-meta #ask-hint{display:none}
  .ask-foot{padding:4px 16px 12px}
}

/* the launchers (made by web/app.js): the top bar button and the line on the talk slide */
.taskline{margin:14px 0 0;font-size:17px;font-weight:300;color:var(--grey,#6B7785)}
.askcta{display:inline-flex;align-items:center;gap:8px;height:36px;margin-left:6px;padding:0 14px;border:1.5px solid var(--cyan,#00A6E2);
  border-radius:3px;background:#fff;color:var(--blue,#004388);font:700 13px/1 "Fira Sans",Arial,sans-serif;letter-spacing:1.5px;
  text-transform:uppercase;cursor:pointer;vertical-align:middle}
.askcta:hover{background:rgba(0,166,226,.1)}
.askcta svg.i{width:16px;height:16px}
.talkin .tbtn.askl{margin-left:auto;border-color:transparent;background:transparent;color:var(--cyan,#00A6E2);padding:0 .4em;
  text-decoration:underline;text-underline-offset:3px}
.talkin .tbtn.askl:hover{color:#fff;border-color:transparent}
