/* The AI help chat (help-chat.js): a lime bubble, bottom right, that opens a navy-headed panel.
   Uses the tokens from app.css (loaded first on every page that has it). */
.hc-launch { position: fixed; z-index: 55; right: calc(16px + env(safe-area-inset-right)); bottom: calc(16px + env(safe-area-inset-bottom));
  display: inline-flex; align-items: center; gap: 8px; min-height: 56px; padding: 0 20px 0 16px; border-radius: 999px; border: 0;
  background: #C6F432; color: #0B1530; font: 800 .95rem/1 var(--font, "Manrope", system-ui, sans-serif); cursor: pointer;
  box-shadow: 0 10px 30px rgba(11, 21, 48, .28), 0 2px 6px rgba(11, 21, 48, .18); transition: transform 140ms ease, background 140ms ease; }
.hc-launch:hover { background: #B0DE1E; transform: translateY(-1px); }
.hc-launch:focus-visible { outline: 3px solid #0B1530; outline-offset: 3px; box-shadow: 0 0 0 6px #C6F432; }
.hc-launch svg { width: 22px; height: 22px; flex: none; }
.hc-launch[aria-expanded="true"] { display: none; }
body.has-tabbar .hc-launch { bottom: calc(var(--tabbar, 64px) + 12px + env(safe-area-inset-bottom)); }
body.has-actions .hc-launch { bottom: calc(84px + env(safe-area-inset-bottom)); }
@media (max-width: 480px) { .hc-launch .hc-launch-text { display: none; } .hc-launch { width: 56px; padding: 0; justify-content: center; } }
@media (min-width: 900px) { body.has-tabbar .hc-launch { bottom: calc(24px + env(safe-area-inset-bottom)); } }

.hc-panel { position: fixed; z-index: 65; right: calc(16px + env(safe-area-inset-right)); bottom: calc(16px + env(safe-area-inset-bottom));
  width: min(400px, calc(100vw - 32px)); height: min(620px, calc(100dvh - 32px)); display: flex; flex-direction: column;
  background: var(--surface, #fff); color: var(--text, #0B1530); border-radius: 20px; overflow: hidden;
  box-shadow: 0 24px 64px rgba(11, 21, 48, .32), 0 2px 8px rgba(11, 21, 48, .12); border: 1px solid var(--line, #E1E6EF);
  font-family: var(--font, "Manrope", system-ui, sans-serif); animation: hc-in 220ms cubic-bezier(.2, .7, .2, 1) both; }
.hc-panel[hidden] { display: none; }
@keyframes hc-in { from { opacity: 0; transform: translateY(12px) scale(.98); } }
@media (max-width: 560px) {
  .hc-panel { inset: 0; width: 100%; height: 100dvh; border-radius: 0; border: 0; }
}
@media (prefers-reduced-motion: reduce) { .hc-panel, .hc-dot { animation: none !important; } .hc-launch { transition: none; } }

.hc-head { display: flex; align-items: center; gap: 12px; padding: 14px 12px 14px 16px; padding-top: calc(14px + env(safe-area-inset-top));
  background: #0B1530; color: #EEF1F8; flex: none; }
.hc-head .hc-mark { width: 36px; height: 36px; flex: none; }
.hc-head .hc-title { flex: 1; min-width: 0; }
.hc-head h2 { margin: 0; font-size: 1rem; font-weight: 800; color: #EEF1F8; letter-spacing: -.2px; }
.hc-head p { margin: 2px 0 0; font-size: .8rem; color: #AEB6CC; display: flex; align-items: center; gap: 6px; }
.hc-head p::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #C6F432; }
.hc-icon-btn { width: 44px; height: 44px; flex: none; display: grid; place-items: center; border-radius: 12px; border: 1px solid #2A3658;
  background: #142046; color: #EEF1F8; cursor: pointer; }
.hc-icon-btn:hover { border-color: #8C96B3; }
.hc-icon-btn:focus-visible { outline: 3px solid #C6F432; outline-offset: 2px; }
.hc-icon-btn svg { width: 20px; height: 20px; }

.hc-log { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 10px; overscroll-behavior: contain;
  background: var(--bg, #F5F7FB); }
.hc-msg { max-width: 86%; padding: 10px 14px; border-radius: 16px; font-size: .95rem; line-height: 1.5; overflow-wrap: anywhere; }
.hc-msg p { margin: 0; }
.hc-msg p + p, .hc-msg p + ul, .hc-msg ul + p { margin-top: 8px; }
.hc-msg ul { margin: 0; padding-left: 20px; }
.hc-msg a { color: inherit; font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
.hc-bot { align-self: flex-start; background: var(--surface, #fff); color: var(--text, #0B1530); border: 1px solid var(--line, #E1E6EF); border-bottom-left-radius: 6px; }
.hc-user { align-self: flex-end; background: #0B1530; color: #EEF1F8; border-bottom-right-radius: 6px; }
.hc-error { align-self: stretch; max-width: none; background: var(--danger-soft, #FBE6E3); color: var(--danger, #B4261D); border: 1px solid transparent; }
.hc-error button { margin-top: 8px; }
.hc-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.hc-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.hc-chip { min-height: 40px; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--line-strong, #C9D1DF); background: var(--surface, #fff);
  color: var(--text, #0B1530); font: 600 .88rem/1.2 var(--font, "Manrope", system-ui, sans-serif); cursor: pointer; text-align: left; }
.hc-chip:hover { border-color: var(--text, #0B1530); }
.hc-chip:focus-visible, .hc-link-btn:focus-visible { outline: 3px solid var(--focus, #0B1530); outline-offset: 2px; }

.hc-typing { align-self: flex-start; display: inline-flex; gap: 5px; padding: 14px 16px; }
.hc-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--muted, #59637F); animation: hc-bounce 1s infinite ease-in-out; }
.hc-dot:nth-child(2) { animation-delay: .15s; } .hc-dot:nth-child(3) { animation-delay: .3s; }
@keyframes hc-bounce { 0%, 80%, 100% { opacity: .35; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-3px); } }

.hc-form { flex: none; display: flex; gap: 8px; align-items: flex-end; padding: 12px; border-top: 1px solid var(--line, #E1E6EF); background: var(--surface, #fff); }
.hc-form textarea { flex: 1; min-height: 44px; max-height: 120px; resize: none; padding: 11px 14px; border-radius: 14px; border: 1px solid var(--line-strong, #C9D1DF);
  background: var(--surface, #fff); color: var(--text, #0B1530); font: 400 1rem/1.4 var(--font, "Manrope", system-ui, sans-serif); }
.hc-form textarea:focus-visible { outline: 3px solid var(--focus, #0B1530); outline-offset: 1px; border-color: transparent; }
.hc-send { width: 44px; height: 44px; flex: none; display: grid; place-items: center; border-radius: 12px; border: 0; background: #0B1530; color: #C6F432; cursor: pointer; }
.hc-send:disabled { opacity: .45; cursor: default; }
.hc-send:focus-visible { outline: 3px solid var(--focus, #0B1530); outline-offset: 2px; box-shadow: 0 0 0 2px #fff inset; }
.hc-send svg { width: 20px; height: 20px; }
.hc-foot { flex: none; padding: 0 12px calc(10px + env(safe-area-inset-bottom)); background: var(--surface, #fff); font-size: .76rem; color: var(--muted, #59637F); }
.hc-foot a { color: inherit; font-weight: 700; }
.hc-count { font-variant-numeric: tabular-nums; float: right; }
.hc-count.over { color: var(--danger, #B4261D); font-weight: 700; }
.hc-link-btn { background: none; border: 0; padding: 0; font: inherit; font-weight: 700; color: inherit; text-decoration: underline; cursor: pointer; }

@media (prefers-color-scheme: dark) {
  .hc-panel { border-color: #2A3658; }
  .hc-user { background: #C6F432; color: #0B1530; }
  .hc-send { background: #C6F432; color: #0B1530; }
  .hc-error { background: #3A1C22; color: #FFB4AB; }
  .hc-dot { background: #AEB6CC; }
  .hc-send:focus-visible, .hc-chip:focus-visible, .hc-link-btn:focus-visible, .hc-form textarea:focus-visible { outline-color: #C6F432; }
}