:root {
  --ca-glass-bg: linear-gradient(145deg, rgba(255,255,255,.28), rgba(255,255,255,.14));
  --ca-border: rgba(255,255,255,.55);
  --ca-shadow: 0 8px 24px rgba(0,0,0,.18);
  --ca-text: #fff;
  --ca-accent: rgba(255,170,220,.9);
}

/* non-interfering root that doesn't eat clicks outside the chip */
#ca-bar-root {
  position: fixed;
  left: 50%;
  bottom: 14px;
  transform: translateX(-50%);
  z-index: 9999;
  pointer-events: none; /* only the chip is clickable */
}

.ca-chip {
  pointer-events: auto;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .55rem .9rem;
  white-space: nowrap;
  border-radius: 999px;
  background: var(--ca-glass-bg);
  border: 1px solid var(--ca-border);
  box-shadow: var(--ca-shadow);
  backdrop-filter: blur(14px) saturate(120%);
  -webkit-backdrop-filter: blur(14px) saturate(120%);
  color: var(--ca-text);
  font-weight: 600;
  font-size: .9rem;
  letter-spacing: .02em;
  user-select: none;
  cursor: pointer;
  transition: transform .15s ease, box-shadow .2s ease, border-color .2s ease;
  max-width: calc(100vw - 32px);
}
.ca-chip:hover { transform: translateY(-1px); box-shadow: 0 10px 28px rgba(0,0,0,.22); }
.ca-chip:active { transform: translateY(0) scale(.98); }

.ca-dot {
  width: .5rem; height: .5rem; border-radius: 999px;
  background: radial-gradient(circle at 30% 30%, #fff, var(--ca-accent));
  box-shadow: 0 0 10px var(--ca-accent);
}
.ca-label { opacity: .85; font-weight: 700; }
.ca-address { opacity: .95; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace; }

.ca-toast {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 10px);
  transform: translateX(-50%) translateY(8px);
  opacity: 0;
  pointer-events: none;
  padding: .4rem .65rem;
  border-radius: 999px;
  background: var(--ca-glass-bg);
  border: 1px solid var(--ca-border);
  color: var(--ca-text);
  font-weight: 700;
  font-size: .8rem;
  backdrop-filter: blur(12px) saturate(120%);
  -webkit-backdrop-filter: blur(12px) saturate(120%);
  box-shadow: var(--ca-shadow);
  transition: opacity .18s ease, transform .18s ease;
}
.ca-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

@media (prefers-reduced-motion: reduce) {
  .ca-chip, .ca-toast { transition: none; }
}