/* BD Knowledge Assistant - the mascot. v1.11.0.
   ---------------------------------------------------------------------------
   A self-contained stylesheet for the chatbot mascot that sits above the
   launcher button. It adds nothing to the chat itself: the mascot is a
   decorative figure that hovers and blinks.

   v1.11.0 - THE FIGURE IS WHOLE. v1.10.0 cut the raised arm out of the artwork
   to save weight; the owner rightly rejected that. The raised hand is part of
   the character, so the mascot is the approved figure as drawn, shipped as ONE
   whole-figure layer. There is no arm layer, no wave and no rotation. The
   mascot is now a real <button> (it opens the chat, has an accessible name and
   is keyboard operable), so it is no longer aria-hidden and the button chrome
   is reset below.

   The two effects run from CSS ALONE, so they work with JavaScript disabled:
     - the BLINK  - an opacity animation on the blink overlay, at an irregular
                    ~7.5s cadence with one quick double-blink; and
     - the HOVER  - a slow, gentle vertical float of the whole figure.
   Both animate only transform and opacity, so they stay on the compositor.
   Under prefers-reduced-motion BOTH are switched off and the mascot holds its
   correct static pose (eyes open, no float). The float and the blink are paused
   together when the tab is hidden or the mascot is off-screen (a class the
   script adds; with no script they simply keep running).

   v1.11.6 - THE RESTORE IS A SMALL GREEN CIRCLE WITH THE ARROW AND NO TEXT. The
   figure is not touched by this at all: no size, no position, no artwork, no
   blink, no hover, no click behaviour, no avatar. Only the restore control's
   paint changes - see the last section of this file.
   --------------------------------------------------------------------------- */

/* ---------- sizing, carried on the launcher so the panel can read it -------
   The whole figure is 1117 x 1409 px, aspect 0.7928; the box is 127 x 160,
   aspect 0.79375, so the figure fills the box at every step below. */
.bdka-launch {
  --bdka-mascot-w: 127px;
  --bdka-mascot-h: 160px;
  --bdka-mascot-gap: 0.55rem;
}

/* A little smaller on shorter DESKTOP screens, so the mascot keeps clear of the
   theme's bottom-corner furniture. Scoped to desktop widths so it cannot
   override the phone sizes below. */
@media (min-width: 721px) and (max-height: 820px) {
  .bdka-launch { --bdka-mascot-w: 108px; --bdka-mascot-h: 136px; }
}
@media (min-width: 721px) and (max-height: 680px) {
  .bdka-launch { --bdka-mascot-w: 89px; --bdka-mascot-h: 112px; }
}
/* SMALLER ON PHONES ONLY. Desktop keeps 127 x 160; a phone is a width query, so
   the desktop height steps above never reach it. */
@media (max-width: 720px) {
  .bdka-launch { --bdka-mascot-w: 96px; --bdka-mascot-h: 121px; }
}
/* A short phone gets one more step down. */
@media (max-width: 720px) and (max-height: 700px) {
  .bdka-launch { --bdka-mascot-w: 84px; --bdka-mascot-h: 106px; }
}

/* ---------- the mascot box ----------
   It is a <button>, so the UA chrome is reset first and then the box is laid
   out exactly as before. */
.bdka-mascot {
  position: absolute;
  right: 0;
  bottom: calc(100% + var(--bdka-mascot-gap));
  width: var(--bdka-mascot-w);
  height: var(--bdka-mascot-h);
  display: block;
  margin: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  -webkit-appearance: none;
  appearance: none;
  text-align: inherit;
  /* The mascot is clickable (it opens the chat) and it is a keyboard control.
     It never blocks the launcher button or the chat: it sits above the button
     with a gap, and it is switched off as a target while the panel is open
     (see the desktop rule below). */
  pointer-events: auto;
  cursor: pointer;
  z-index: 1;             /* below the panel, so it can never cover the chat */
  -webkit-user-select: none;
  user-select: none;
}
.bdka-mascot:focus-visible {
  outline: 2px solid var(--gold, #145a43);
  outline-offset: 3px;
  border-radius: 6px;
}
.bdka-launch--left .bdka-mascot { right: auto; left: 0; }

/* The hover: a slow vertical float on an inner wrapper, so the mascot box itself
   is never moved and the panel clearance stays stable. */
.bdka-mascot__float {
  display: block;
  width: 100%;
  height: 100%;
  animation: bdka-mascot-float 6.5s ease-in-out infinite;
  will-change: transform;
}

.bdka-mascot__stage {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  /* A soft shadow lifts the figure off the page. This is a shadow, not a
     background panel: the mascot keeps a fully transparent body in both modes.
     The dark-mode rule swaps it for a faint light halo so a black gown on a
     near-black page still reads. */
  filter: drop-shadow(0 8px 16px rgba(0, 0, 0, 0.28));
}
html[data-bd-theme="dark"] .bdka-mascot__stage {
  filter: drop-shadow(0 0 10px rgba(170, 255, 220, 0.16)) drop-shadow(0 8px 18px rgba(0, 0, 0, 0.55));
}

/* Both layers share the one box and are sized identically. */
.bdka-mascot__layer {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}
.bdka-mascot__layer img {
  display: block;
  width: 100%;
  height: 100%;
}

/* The blink overlay rests invisible and is driven entirely by the keyframes
   below - no script is involved. */
.bdka-mascot__layer--blink {
  opacity: 0;
  animation: bdka-mascot-blink 7.5s linear infinite;
  will-change: opacity;
}

/* ---------- the hover ---------- */
@keyframes bdka-mascot-float {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-7px); }
}

/* ---------- the blink ----------
   One 7.5s cycle. The eyes shut four times at uneven spacing (1.4s, 3.6s, and a
   quick double at 5.2s + 5.5s), so it reads as alive rather than as a metronome,
   and more often than the old 2.2-6.4s cadence. Only opacity is animated. */
@keyframes bdka-mascot-blink {
  0%, 17.6%     { opacity: 0; }
  18.67%, 20.4% { opacity: 1; }
  21.47%, 46.93% { opacity: 0; }
  48%, 49.73%   { opacity: 1; }
  50.8%, 68.27% { opacity: 0; }
  69.33%, 71.07% { opacity: 1; }
  72.13%, 72.8% { opacity: 0; }
  73.33%, 75.07% { opacity: 1; }
  76.13%, 100%  { opacity: 0; }
}

/* ---------- paused when the tab is hidden or the mascot is off-screen ------ */
.bdka-mascot--paused .bdka-mascot__float,
.bdka-mascot--paused .bdka-mascot__layer--blink {
  animation-play-state: paused;
}

/* ---------- reduced motion: static pose, no float and no blink ------------- */
@media (prefers-reduced-motion: reduce) {
  .bdka-mascot__float { animation: none; }
  .bdka-mascot__layer--blink { animation: none; opacity: 0; }
}

/* The panel must always paint above the mascot. The panel has no z-index of its
   own, so a positive one on the mascot would otherwise put the mascot on top of
   the open chat - which on a phone (where the panel is a full sheet) means the
   mascot sits over the transcript. This one line keeps the chat in front. */
.bdka-launch__panel { z-index: 3; }

/* ---------- the launcher mascot tucks away while the chat is open ----------
   The desktop panel is 70vh and sits above the launcher button, so it paints
   over the mascot. Without this the bottom edge of the mascot would show as a
   sliver just below the panel. The mascot fades out when the panel is open and
   fades back in when it closes. Desktop only: on phones the panel is a full
   sheet and simply covers it.

   Two selectors so it works with or without :has() support: the script also
   toggles .bdka-launch--open.

   v1.11.0 - the mascot is a button now, so while it is faded out it must also
   leave the tab order. The script sets tabindex="-1" and aria-hidden on it in
   the same step that adds .bdka-launch--open; this rule keeps the pointer out
   with or without :has(). */
@media (min-width: 721px) {
  .bdka-launch:has(.bdka-launch__panel:not([hidden])) .bdka-mascot,
  .bdka-launch--open .bdka-mascot {
    opacity: 0;
    pointer-events: none;   /* and not a click target while the chat is open */
    transition: opacity 0.18s ease;
  }
}

/* ==========================================================================
   v1.11.3 - ONE ENTRY POINT, AND A DISMISS THAT LASTS THE VISIT
   --------------------------------------------------------------------------
   THE FAULT (content audit, finding 11): every page carried TWO chat entry
   points, the "Chat With Us" launcher button and the mascot above it, both
   anchored to the right edge, both opening the same chat. The mascot had no
   close control, so once it rendered it stayed for the whole session and, at
   narrow widths, competed with the theme's float rail.

   THE FIX, in two halves and no more:
     1. The mascot is now the single entry point. While it is on the page the
        separate text launcher button is not shown. It is hidden with
        visibility:hidden rather than display:none ON PURPOSE: display:none
        would collapse the launcher's own box, and the mascot is positioned
        from the top of that box, so the mascot would drop by the height of the
        button and land where the button was. visibility:hidden keeps the box
        exactly as it is - so the mascot, its size, its hover, its blink and its
        clearance are pixel-identical to v1.11.2 - while taking the button out
        of the tab order, out of the accessibility tree and out of reach of the
        pointer. One entry point is visible; the other is not there at all.
     2. The mascot gains a dismiss. Pressing it hides the mascot for the rest
        of the browser session (a sessionStorage flag, applied before paint by
        the inline script in BDKA_Mascot::session_state()) and the text launcher
        button becomes the entry point, so the chat is never unreachable. On the
        next visit the mascot is back: "for the session" is what was asked for.

   NOTHING about the figure changes here: no size, no position, no artwork, no
   blink, no hover, no click behaviour. The only new box is the dismiss button,
   and it is a SIBLING of the mascot, positioned at the mascot's top-right
   corner out of the same two custom properties the mascot already uses, so the
   two cannot drift apart if the mascot is resized at any breakpoint. */

/* ---------- 1. one visible entry point ---------- */
.bdka-launch:not(.bdka-launch--mascot-dismissed) .bdka-launch__btn {
  visibility: hidden;
  pointer-events: none;
}

/* Once the mascot is dismissed it is gone for the session, and the text button
   above is the entry point. display:none also removes the mascot from the tab
   order, so a dismissed control can never be focused or announced. */
.bdka-launch--mascot-dismissed .bdka-mascot,
.bdka-launch--mascot-dismissed .bdka-mascot__dismiss {
  display: none;
}

/* ---------- 2. the dismiss and the restore ----------
   Both are anchored to the mascot's own top-right corner. The mascot's box
   starts at bottom: calc(100% + --bdka-mascot-gap) and is --bdka-mascot-h
   tall, so its top edge is that sum; each control is pulled 0.7rem down into
   the corner so it reads as belonging to the figure rather than floating above
   it. They share one box so the restore lands exactly where the dismiss was:
   the two are never on screen together (see the display rules below), so one
   footprint serves both. */
.bdka-mascot__dismiss,
.bdka-mascot__restore {
  position: absolute;
  right: -0.15rem;
  bottom: calc(100% + var(--bdka-mascot-gap) + var(--bdka-mascot-h) - 0.7rem);
  z-index: 2;                 /* above the mascot, below the panel (3) */
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
  font: inherit;
  font-size: 1rem;
  line-height: 1;
  color: #23281f;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(0, 0, 0, 0.18);
  border-radius: 50%;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.22);
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  /* Always visible, never hover-only: a control that appears only on hover
     cannot be found on a touch screen or by a keyboard user. It is kept quiet
     so it does not compete with the figure. */
  opacity: 0.85;
}
.bdka-mascot__dismiss:hover,
.bdka-mascot__dismiss:focus-visible,
.bdka-mascot__restore:hover,
.bdka-mascot__restore:focus-visible { opacity: 1; }
.bdka-mascot__dismiss:focus-visible,
.bdka-mascot__restore:focus-visible {
  outline: 2px solid var(--gold, #145a43);
  outline-offset: 2px;
}
html[data-bd-theme="dark"] .bdka-mascot__dismiss,
html[data-bd-theme="dark"] .bdka-mascot__restore {
  color: #edf1ef;
  background: rgba(20, 26, 22, 0.92);
  border-color: rgba(255, 255, 255, 0.28);
}
.bdka-launch--left .bdka-mascot__dismiss,
.bdka-launch--left .bdka-mascot__restore { right: auto; left: -0.15rem; }

/* While the chat is open the mascot is faded out on desktop (see the rule
   above); the dismiss goes with it, so no control is left hovering over the
   panel. On phones the panel is a full sheet and covers both. */
@media (min-width: 721px) {
  .bdka-launch:has(.bdka-launch__panel:not([hidden])) .bdka-mascot__dismiss,
  .bdka-launch--open .bdka-mascot__dismiss,
  .bdka-launch:has(.bdka-launch__panel:not([hidden])) .bdka-mascot__restore,
  .bdka-launch--open .bdka-mascot__restore {
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.18s ease;
  }
}

/* ==========================================================================
   v1.11.4 - THE WAY BACK
   --------------------------------------------------------------------------
   v1.11.3 could hide the mascot and never bring it back: the sessionStorage
   flag was written and read, and nothing ever cleared it, so once dismissed the
   mascot was gone until the browser session ended. The owner asked for exactly
   one thing more - a way back that does not make the mascot a nuisance again.

   THE RESTORE. A small, quiet button in the mascot's own corner, from the same
   two custom properties, so it sits where the mascot was at every breakpoint.
   It is display:none while the mascot is on the page and display:flex only
   under .bdka-launch--mascot-dismissed - the SAME class the v1.11.3 dismiss
   already sets and the same class the inline session script already applies
   before paint. So the state needs no new flag, no new storage key and no new
   script in the head: the two controls are two faces of one class.

   THE PILL. The text launcher button is hidden only while the mascot is on the
   page (rule 1 above, unchanged), so it is visible for the whole time the
   mascot is hidden and the chat stays one click away.

   NOTHING about the figure changes: no size, no position, no artwork, no
   blink, no hover, no click behaviour, no avatar. */

/* The restore is not on the page while the mascot is. */
.bdka-mascot__restore { display: none; }

/* ...and it takes the mascot's place the moment the mascot is dismissed. The
   dismiss is display:none in that same state (rule 2 above), so exactly one
   control is present at a time and the two never overlap or both take focus. */
.bdka-launch--mascot-dismissed .bdka-mascot__restore { display: flex; }

/* Reduced motion: neither control animates. The only transition either one has
   is the fade that goes with the open panel, and that is switched off here too,
   so a visitor who asked for less motion gets an instant, static control. The
   open-panel selectors are repeated at their own weight on purpose: they are
   more specific than the bare class, so a plain .bdka-mascot__restore rule here
   would lose to them however late it came. */
@media (prefers-reduced-motion: reduce) {
  .bdka-mascot__dismiss,
  .bdka-mascot__restore,
  .bdka-launch--open .bdka-mascot__dismiss,
  .bdka-launch--open .bdka-mascot__restore,
  .bdka-launch:has(.bdka-launch__panel:not([hidden])) .bdka-mascot__dismiss,
  .bdka-launch:has(.bdka-launch__panel:not([hidden])) .bdka-mascot__restore {
    transition: none;
  }
}

/* ==========================================================================
   v1.11.6 - THE RESTORE IS A GREEN CIRCLE WITH THE ARROW, AND NOTHING ELSE
   --------------------------------------------------------------------------
   THE FAULT (the owner's report, fourth round on this one control): the 1.11.5
   pill is understood - that part worked - but it is too prominent. It is as
   loud as the launcher it stands over, and a labelled control in that corner is
   more annoying than helpful to him. He knows what the control means and has
   said exactly what he wants: a small GREEN CIRCLE containing the restore arrow
   and no text at all. This file now does that and nothing more.

   WHAT CHANGED, AND ONLY THIS. Same element, same class, same data attribute,
   same sibling position, same script (assets/bdka-mascot.js is untouched and
   byte-identical), same focus moves. What changes is the paint: a 40px circle
   in the plugin's own green, the arrow glyph (U+21BA) in white and centred, and
   the visible text gone.

   THE SIZE, and why 40px. 1.11.4 was 24px, under the comfortable touch
   minimum; 1.11.5 was a ~146 x 31px pill, which is what he rejected as taking
   too much room. 40px is the middle and is chosen for a reason: it clears WCAG
   2.5.8's 24px minimum by a wide margin, it is within 4px of the theme's own
   44px back-to-top target so it feels like a member of that corner, and its
   footprint - 40 x 40 - is a third of the 96 x 121 block the mascot occupied on
   a phone, so it does not take the mascot's space back.

   THE ANCHOR is the one the 1.11.5 pill used, kept deliberately: right 0 (the
   mascot's right edge, which is also the launcher pill's right edge) and
   bottom calc(100% + the mascot gap), which is the mascot's bottom edge. So the
   circle stands in the mascot's slot, directly above the "Chat With Us" pill,
   where the eye looks for the mascot.

   WHY IT CANNOT COLLIDE. Nothing here touches the launcher's own offsets, so
   the stack fixed in 1.11.2 is intact: the launcher's bottom edge is the
   back-to-top button's top edge + 8px, and the contact rail is below that. The
   circle is the only thing above the launcher, and it is 40px tall against the
   mascot's 121px (phone) / 160px (desktop), so its top edge sits ~81px BELOW
   where the mascot's top edge was. The measurements are in the changelog.

   Overrides only. The pair rule that still sizes the DISMISS (a small round x,
   unchanged) is untouched, and every rule below is later in the file than the
   one it overrides.
   ========================================================================== */

.bdka-mascot__restore {
  /* --- where it sits: the mascot's slot, exactly as 1.11.5 had it --- */
  right: 0;
  bottom: calc(100% + var(--bdka-mascot-gap));

  /* --- the circle: 40px, border included, so 40px is the whole target --- */
  width: 40px;
  height: 40px;
  box-sizing: border-box;
  padding: 0;
  border-radius: 50%;
  font-size: 1.25rem;       /* the glyph is ~20px, centred in the 40px circle */
  line-height: 1;
  color: #fff;
  background: var(--gold, #145a43);
  border: 1px solid var(--gold, #145a43);
  box-shadow: 0 6px 16px -6px rgba(0, 0, 0, 0.45);
  /* Full strength. It is a solid green disc now, not a washed-out corner glyph:
     a half-transparent green reads as a disabled control. The open-panel fade
     below is more specific and still wins, so it still fades with the mascot. */
  opacity: 1;
  transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

/* The glyph is the whole content of the button: white, centred, one line. It is
   aria-hidden in the markup, so it is never announced as a character - the
   button's aria-label is its name. */
.bdka-mascot__restore-icon {
  display: block;
  flex: 0 0 auto;
  font-size: 1.25rem;
  line-height: 1;
  color: inherit;
}

/* Hover and keyboard focus: the launcher pill's deepened green and the same
   shadow lift, so it behaves like the rest of the corner. Focus keeps the
   family's gold ring from the rule above. */
.bdka-mascot__restore:hover,
.bdka-mascot__restore:focus-visible {
  background: var(--gold-deep, #104532);
  border-color: var(--gold-deep, #104532);
  box-shadow: 0 10px 22px -8px rgba(0, 0, 0, 0.55);
  opacity: 1;
}

/* Dark mode: the launcher button's own swap - emerald-light with the dark ink
   on it. The glyph follows to #10231b because white on #7fd8b4 is a ~1.7:1
   contrast, which is not readable; this is the same pairing the launcher uses. */
html[data-bd-theme="dark"] .bdka-mascot__restore {
  color: #10231b;
  background: var(--emerald-light, #7fd8b4);
  border-color: var(--emerald-light, #7fd8b4);
}
html[data-bd-theme="dark"] .bdka-mascot__restore:hover,
html[data-bd-theme="dark"] .bdka-mascot__restore:focus-visible {
  background: #9ae7c9;
  border-color: #9ae7c9;
}

/* The left-handed launcher: the circle keeps the launcher's own edge. */
.bdka-launch--left .bdka-mascot__restore { right: auto; left: 0; }

/* No per-breakpoint steps: a 40px circle and a 20px glyph are the same
   comfortable target on a phone as on a desktop, and the v1.11.5 padding and
   type steps existed only to keep a pill in proportion with the launcher pill.
   There is no pill any more. */

/* Reduced motion: the disc does not animate its colours either. Repeated here
   because this block comes after the v1.11.4 reduced-motion rule and would
   otherwise put the transition back. */
@media (prefers-reduced-motion: reduce) {
  .bdka-mascot__restore { transition: none; }
}

/* ==========================================================================
   v1.11.7 - THE RESTORE STANDS BESIDE THE PILL, NOT ON TOP OF IT
   --------------------------------------------------------------------------
   THE OWNER'S INSTRUCTION, literally: the restore button sits on top of the
   "Chat With Us" pill; move it BESIDE the pill. Everything else about the
   control stays exactly as 1.11.6 left it - a 40px green circle, the U+21BA
   glyph and nothing else, the theme's green tokens, the accessible name kept
   for screen readers. Nothing is added and nothing is taken away.

   WHAT CHANGED, AND ONLY THIS: the anchor. 1.11.6 anchored the circle to the
   mascot's slot (right:0, bottom:calc(100% + gap)), which put it directly ABOVE
   the pill. It is anchored to the pill's own row now:

     right: calc(100% + var(--bdka-mascot-gap));

   .bdka-launch is position:fixed with only `right` set, so its width is
   shrink-to-fit and is exactly the pill's width - measured 119px at 360px and
   390px, 138.3px at 768px and 1024px. `right:100%` therefore puts the circle's
   RIGHT edge on the pill's LEFT edge, and the added mascot gap (0.55rem =
   8.8px) is the space between them. The gap is measured from the pill itself,
   not copied in as a number, so the circle cannot drift off the pill if the
   label text or the theme's font-size changes.

   VERTICALLY CENTRED ON THE PILL, WITHOUT ASSUMING ITS HEIGHT: top:50% with
   translateY(-50%). .bdka-launch's own box is exactly the pill's box - the
   panel is position:fixed and the mascot, the dismiss and this circle are all
   position:absolute, so none of them adds height (measured: the container's
   height equals the pill's at every width - 40.1px at 360/390, 47.9px at
   768/1024). So 50% of the container IS the pill's centre line, and the
   circle's centre lands on it at every breakpoint with no per-breakpoint number
   to get wrong or to drift.

   WHAT THAT COMES TO, from the measured boxes (headless Chromium, no safe-area
   inset, label "Chat With Us"):
     width   pill (w x h)      circle: bottom / top above the viewport bottom
     360px   119   x 40.1      bottom 63.0   top 103.0   (pill 63.0 -> 103.1)
     390px   119   x 40.1      bottom 63.0   top 103.0   (identical - every
                                                        number comes from the
                                                        max-width:720px block)
     768px   138.3 x 47.9      bottom 75.2   top 115.2   (pill 71.2 -> 119.1)
     1024px  138.3 x 47.9      bottom 75.2   top 115.2   (identical - both are
                                                        on the 721-1024px step)
   At 360/390 the circle is 0.1px taller than the pill, so it stands 0.05px
   proud of it at top and bottom; at 768/1024 the pill is 7.9px taller, so the
   circle sits 3.95px inside it at top and bottom. Either way the circle never
   leaves the pill's row, and that is what keeps it clear of everything below.

   THE COLLISION CHECK is in the changelog. Short version: the circle pushes
   LEFTWARDS, into empty page, and stays inside the pill's vertical band, which
   already sits 8px above the back-to-top button's top edge and further above
   the contact dock. It reaches neither at any of the four widths, and the whole
   cluster (circle + gap + pill) is 167.8px of the 360px viewport at its widest.

   THE MASCOT'S SLOT IS NOW EMPTY when the mascot is dismissed, and nothing is
   put in it: the owner asked for "beside the pill" and that is all this does.
   The corner therefore reads as the pill with a small green circle to its left,
   and the space above is plain page - quieter than 1.11.6, which stood a
   control in the slot. While the mascot is NOT dismissed the restore is
   display:none and the slot holds the mascot exactly as before.

   The 1.11.6 block above is left in place and is simply overridden here: every
   rule below is later in the file and equally or more specific.
   ========================================================================== */

.bdka-mascot__restore {
  /* --- beside the pill: one mascot gap to its left, on the pill's own row --- */
  right: calc(100% + var(--bdka-mascot-gap));
  bottom: auto;
  top: 50%;
  transform: translateY(-50%);
}

/* The left-handed launcher: there the pill's outer edge is the screen's left,
   so the circle goes to its RIGHT by the same gap, and the pair still reads as
   one row. */
.bdka-launch--left .bdka-mascot__restore {
  right: auto;
  left: calc(100% + var(--bdka-mascot-gap));
}

/* ==========================================================================
   v1.11.8 - THE RESTORE MUST BE CLICKABLE WHEREVER IT IS PAINTED
   --------------------------------------------------------------------------
   The fault this release fixes is in assets/bdka-mascot.js, not here: the
   restore handler returned early whenever the sessionStorage flag could not be
   cleared, so the circle took the click and did nothing. See that file's
   v1.11.8 note and the changelog.

   ONE DEFENSIVE DECLARATION, because a fix that only works when nothing else is
   on screen is not a fix. pointer-events is an INHERITED property, so a theme
   rule on any ancestor - a disabled overlay, a scroll-lock class, a container
   switched off while a modal is open - would otherwise leave the circle
   painted but not hit-testable. This states it for the circle itself.

   Nothing about the control's appearance moves: no size, no colour, no
   position, no radius, no glyph. It is the same 40px green circle standing one
   mascot gap to the left of the pill, in the pill's row, exactly as 1.11.7
   placed it. The open-panel rule above is more specific (.bdka-launch--open /
   :has()) and still wins while the chat is open, so the circle still fades out
   with the mascot on desktop; and on a phone the panel is a full sheet painted
   over it (z-index 3 against 2), so it is still not reachable behind the chat.
   ========================================================================== */

.bdka-mascot__restore {
  pointer-events: auto;
}