/* Help agent: the one floating help button, its first-visit bubble and the chooser (assets/js/assistant.js),
   plus the typed chat sheet. The Report button keeps its place (app.css .fab-float). */

/* Base (phones and tablets): compact pill; the rules further down turn it into a small icon above the Report button. */
.as-fab{position:fixed;left:16px;bottom:calc(var(--tabs) + env(safe-area-inset-bottom,0px) + 14px);z-index:46;display:inline-flex;align-items:center;gap:10px;height:54px;max-width:calc(50vw - 24px);padding:0 18px 0 7px;border:1px solid var(--acc);border-radius:27px;background:rgba(13,24,43,.92);backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);color:var(--fg);font:700 15px/1.15 var(--body);text-align:left;box-shadow:0 10px 28px rgba(2,6,15,.55),0 0 0 4px rgba(6,12,24,.55),0 0 22px rgba(214,178,110,.18);cursor:pointer;transition:border-color .2s,box-shadow .25s,transform .12s}
.as-fab-ic{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--grad-gold);color:var(--acc-ink)}
.as-fab-ic .ic{width:21px;height:21px;stroke-width:2}
.as-fab-tx{display:grid;gap:2px;min-width:0}
.as-fab-tx b{font-weight:700;white-space:nowrap}
.as-fab-sub{display:none;font:500 13px/1.3 var(--body);color:var(--muted)}
.as-fab:hover,.as-fab:focus-visible{border-color:var(--acc-hi);box-shadow:0 10px 28px rgba(2,6,15,.55),0 0 0 4px rgba(214,178,110,.16),0 0 30px rgba(214,178,110,.3)}
.as-fab:active{transform:scale(.97)}
/* Desktop: bottom-right, with the sub-line. */
@media (min-width:1024px){
  .as-fab{left:auto;right:24px;bottom:24px;height:auto;min-height:64px;max-width:min(360px,calc(100vw - var(--rail) - 48px));padding:10px 22px 10px 10px;border-radius:34px;gap:12px}
  .as-fab-ic{width:44px;height:44px}
  .as-fab-tx b{font-size:16px}
  .as-fab-sub{display:block}
}
/* Phones and tablets, every page but the map: a small round icon stacked right above the Report button,
   so it never covers the Report button or buttons at the bottom-left of a page. The name stays for screen
   readers (aria-label on the button, and the label text is only visually hidden). */
@media (max-width:1023px){
  body:not([data-page="map"]) .as-fab{left:auto;right:19px;bottom:calc(var(--tabs) + env(safe-area-inset-bottom,0px) + 14px + 54px + 12px);width:48px;max-width:48px;height:48px;min-height:48px;padding:0;gap:0;justify-content:center;border-radius:50%}
  body:not([data-page="map"]) .as-fab-ic{width:38px;height:38px}
  body:not([data-page="map"]) .as-fab-ic .ic{width:19px;height:19px}
  body:not([data-page="map"]) .as-fab-tx{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
  body:not([data-page="map"]) .hp-bubble{left:auto;right:16px;bottom:calc(var(--tabs) + env(safe-area-inset-bottom,0px) + 14px + 54px + 12px + 48px + 12px)}
  body:not([data-page="map"]) .hp-bubble::after{left:auto;right:22px}
  /* Room under the last thing on a page, so the two floating buttons never sit on top of it. */
  body:not([data-page="map"]) .foot{padding-bottom:calc(44px + 54px + 12px + 48px + 16px)}
}
/* Live map, phones: a small tile at the top of the map's own right-hand column (above the locate and
   Report here buttons), clear of the legend (which stops 90px from the right edge) and the zoom buttons. */
@media (max-width:1023px){
  body[data-page="map"] .as-fab{left:auto;right:12px;bottom:calc(var(--tabs) + env(safe-area-inset-bottom,0px) + 134px);width:64px;max-width:64px;height:auto;min-height:64px;padding:7px 4px 6px;flex-direction:column;justify-content:center;gap:3px;border-radius:18px;text-align:center}
  body[data-page="map"] .as-fab-ic{width:30px;height:30px}
  body[data-page="map"] .as-fab-ic .ic{width:17px;height:17px}
  body[data-page="map"] .as-fab-tx b{font-size:11.5px;line-height:1.1;white-space:normal}
}
/* Live map, desktop: same column, above locate and Report here. */
@media (min-width:1024px){
  body[data-page="map"] .as-fab{right:12px;bottom:134px}
}
@media print{.as-fab,.hp-bubble{display:none!important}}
body[data-page="admin"] .hp-bubble{display:none}

/* First-visit bubble, just above the button. */
.hp-bubble{position:fixed;z-index:47;left:16px;bottom:calc(var(--tabs) + env(safe-area-inset-bottom,0px) + 80px);display:flex;align-items:flex-start;gap:4px;width:min(340px,calc(100vw - 32px));padding:6px 6px 6px 4px;border:1px solid var(--acc-line);border-radius:16px;background:var(--cream);color:var(--cream-ink);box-shadow:var(--shadow),0 0 0 4px rgba(6,12,24,.45);animation:hp-in .35s var(--ease) both}
.hp-bubble::after{content:"";position:absolute;left:30px;bottom:-8px;width:14px;height:14px;background:inherit;border-right:1px solid var(--acc-line);border-bottom:1px solid var(--acc-line);transform:rotate(45deg)}
.hp-bub-go{flex:1;min-width:0;min-height:44px;padding:8px 10px;border:0;background:transparent;color:inherit;font:600 15px/1.4 var(--body);text-align:left;cursor:pointer}
.hp-bub-x{flex:none;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:transparent;color:inherit;cursor:pointer}
.hp-bub-x .ic{width:17px;height:17px}
.hp-bub-x:hover,.hp-bub-x:focus-visible{background:rgba(0,0,0,.08)}
@keyframes hp-in{0%{opacity:0;transform:translateY(8px)}100%{opacity:1;transform:translateY(0)}}
@media (min-width:1024px){
  .hp-bubble{left:auto;right:24px;bottom:104px;width:340px}
  .hp-bubble::after{left:auto;right:44px}
}
body[data-page="map"] .hp-bubble{display:none}

/* Chooser sheet */
.hp{display:flex;flex-direction:column;min-width:0}
.hp-h{margin:6px 48px 6px 0}
.hp-lead{max-width:52ch;font-size:15.5px}
.hp-opts{display:grid;gap:10px;margin-top:16px}
.hp-entry{margin:0}
.hp-opt{display:flex;align-items:center;gap:14px;width:100%;min-height:72px;padding:12px 16px;border:1px solid var(--line2);border-radius:var(--r-sm);background:var(--panel);color:var(--fg);font:inherit;text-align:left;cursor:pointer;transition:border-color .2s,background .2s}
.hp-opt:hover,.hp-opt:focus-visible{border-color:var(--acc);background:var(--acc-dim)}
.hp-opt:active{transform:scale(.99)}
.hp-opt[disabled]{cursor:progress;opacity:.85}
.hp-talk{border-color:rgba(214,178,110,.6);background:linear-gradient(160deg,rgba(214,178,110,.16),var(--panel) 75%)}
.hp-opt-ic{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;border:1px solid var(--acc-line);color:var(--acc)}
.hp-talk .hp-opt-ic{border:0;background:var(--grad-gold);color:var(--acc-ink)}
.hp-opt-ic .ic{width:22px;height:22px;stroke-width:1.9}
.hp-talk[aria-busy="true"] .hp-opt-ic{animation:vc-breathe 1.2s ease-in-out infinite}
.hp-opt-tx{display:grid;gap:3px;min-width:0}
.hp-opt-tx b{font-weight:700;font-size:17px;line-height:1.25}
.hp-opt-tx span{color:var(--muted);font-size:14px;line-height:1.4;overflow-wrap:anywhere}
.hp-can{margin-top:18px}
.hp-can-h{margin:0 0 8px;font:500 12px/1.2 var(--label);letter-spacing:.16em;text-transform:uppercase;color:var(--acc)}
.hp-can ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.hp-can li{display:flex;align-items:flex-start;gap:10px;font-size:15.5px;line-height:1.4}
.hp-can li .ic{flex:none;width:18px;height:18px;margin-top:2px;color:var(--acc);stroke-width:2.2}
.hp-int{margin:12px 0 0;padding:10px 12px;border-left:2px solid var(--acc);background:var(--acc-dim);border-radius:0 var(--r-sm) var(--r-sm) 0;font-weight:600;font-size:15px}
.hp .as-911{margin-top:14px}
.hp-note{margin-top:10px}

/* Sheet */
.as{display:flex;flex-direction:column;min-width:0}
.as-h{margin:6px 0 6px}
.as-sub{max-width:52ch}
.as-911{display:flex;align-items:center;gap:8px;margin-top:10px;padding:8px 12px;border:1px solid rgba(239,74,79,.45);background:var(--red-dim);border-radius:var(--r-sm);color:var(--fg)}
.as-911 .ic{width:16px;height:16px;flex:none;color:#ff9b9e}
.as-911 a{color:#ffb4b6;font-weight:600}

.as-log{display:flex;flex-direction:column;gap:10px;margin:16px 0 4px;min-width:0}
.as-log[hidden]{display:none}
.as-msg{scroll-margin:16px 0 110px;max-width:90%;padding:12px 16px;border-radius:18px;font-size:16px;line-height:1.5;overflow-wrap:anywhere;min-width:0}
.as-msg p{margin:0}
.as-me{align-self:flex-end;background:rgba(214,178,110,.14);border:1px solid rgba(214,178,110,.42);border-bottom-right-radius:6px;color:var(--fg)}
.as-bot{align-self:flex-start;background:var(--panel);border:1px solid var(--line);border-bottom-left-radius:6px}
.as-em{border-color:rgba(239,74,79,.65);background:var(--red-dim)}
.as-em p{font-weight:500}
.as-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.as-links .btn{white-space:normal;text-align:left;min-height:44px;padding:9px 16px;font-size:14.5px;max-width:100%;line-height:1.3}
.as-links .btn .ic{width:16px;height:16px;flex:none}

.as-typing{display:flex;gap:5px;align-items:center;padding:14px 16px}
.as-typing i{width:7px;height:7px;border-radius:50%;background:var(--muted);animation:as-dot 1.1s infinite ease-in-out}
.as-typing i:nth-child(2){animation-delay:.15s}
.as-typing i:nth-child(3){animation-delay:.3s}
@keyframes as-dot{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}

.as-starters{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.as-starters .chip{height:auto;min-height:44px;padding:8px 16px;color:var(--fg);font-size:14.5px;white-space:normal;text-align:left}
.as-starters.as-compact{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px;margin-top:12px;max-width:100%}
.as-starters.as-compact::-webkit-scrollbar{display:none}
.as-starters.as-compact .chip{white-space:nowrap;flex:none;color:var(--muted)}

.as-form{position:sticky;bottom:calc(-24px - env(safe-area-inset-bottom,0px));display:flex;gap:8px;margin-top:14px;padding:10px 0 4px;background:var(--bg2);box-shadow:0 -12px 18px var(--bg2)}
.as-in{flex:1;min-width:0;font-size:16px}
.as-send{flex:none;padding:9px 18px}
.as-send .ic{width:18px;height:18px}
.as-note{margin-top:8px}
@media (min-width:720px){.as-form{bottom:-30px}}
@media (max-width:380px){.as-send span{display:none}.as-send{padding:9px 13px}}