/* Captain Upgrade · floating guide
   Tokens match the site: paper, ink, deep, lime, coral, blue. */
.cap-root{
  --cap-paper:#f4f2ec; --cap-ink:#202925; --cap-deep:#17221f; --cap-soft:#5a6862;
  --cap-line:#d6d8d0; --cap-lime:#d7f58f; --cap-coral:#f19e8d; --cap-coral-ink:#b8563f; --cap-blue:#c7ddea;
  position:fixed; left:0; top:0; z-index:60;
  font-family:'Instrument Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  color:var(--cap-ink); font-size:15px; line-height:1.45;
}
.cap-root.is-hidden{display:none}
.cap-root.is-dragging, .cap-root.is-dragging *{cursor:grabbing!important;user-select:none}

/* Figure */
.cap-figure{
  position:relative; display:block; padding:0; margin:0; border:0; background:none;
  cursor:grab; touch-action:none; -webkit-tap-highlight-color:transparent;
}
.cap-figure:focus-visible{outline:3px solid var(--cap-coral-ink); outline-offset:4px; border-radius:12px}
.cap-img{width:100%; height:100%; object-fit:contain; display:block; pointer-events:none;
  filter:drop-shadow(0 10px 14px rgba(23,34,31,.22)); transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.cap-sprite{position:absolute; left:50%; bottom:0; width:125%; aspect-ratio:192/208; margin-left:-62.5%; background-repeat:no-repeat; background-size:800% 1100%; pointer-events:none; filter:drop-shadow(0 10px 14px rgba(23,34,31,.22)); transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.cap-figure.is-flip .cap-sprite{transform:scaleX(-1)}
.cap-root.is-running .cap-figure{animation:cap-bob .5s ease-in-out infinite alternate}
@keyframes cap-bob{from{transform:translateY(0)}to{transform:translateY(-4px)}}

/* Hide control */
.cap-hide{
  position:absolute; top:-8px; right:-8px; width:24px; height:24px; border-radius:50%;
  border:1.5px solid var(--cap-ink); background:var(--cap-paper); color:var(--cap-ink);
  font:500 15px/1 var(--cap-ink); cursor:pointer; padding:0; display:grid; place-items:center;
  box-shadow:0 1px 0 rgba(32,41,37,.12); opacity:.85;
}
.cap-hide:hover, .cap-hide:focus-visible{opacity:1; background:var(--cap-lime)}

/* Speech bubble */
.cap-bubble{
  position:absolute; right:0; bottom:100%; margin-bottom:30px; width:min(248px,72vw);
  background:var(--cap-paper); color:var(--cap-ink); border-radius:16px; padding:12px 34px 12px 14px;
  box-shadow:0 10px 30px rgba(23,34,31,.18); border:1px solid var(--cap-line);
  display:none; font-size:14px; line-height:1.4; text-align:left;
}
.cap-bubble.is-on{display:block; animation:cap-pop .25s cubic-bezier(.2,.7,.2,1)}
.cap-bubble::after{content:""; position:absolute; right:38px; bottom:-8px; width:14px; height:14px;
  background:var(--cap-paper); border-right:1px solid var(--cap-line); border-bottom:1px solid var(--cap-line); transform:rotate(45deg)}
.cap-bubble-x{position:absolute; top:6px; right:6px; width:22px; height:22px; border:0; background:none; cursor:pointer; font-size:18px; color:var(--cap-soft); padding:0}
@keyframes cap-pop{from{opacity:0; transform:translateY(6px) scale(.97)}to{opacity:1; transform:none}}

/* Chat panel */
.cap-panel{
  position:absolute; right:0; bottom:100%; margin-bottom:34px; width:348px; max-width:calc(100vw - 32px);
  max-height:min(680px,76vh); display:flex; flex-direction:column;
  background:var(--cap-paper); border:1px solid var(--cap-line); border-radius:20px;
  box-shadow:0 24px 60px rgba(23,34,31,.24); overflow:hidden;
}
.cap-panel[hidden]{display:none}
.cap-phead{display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:14px 16px; background:var(--cap-deep); color:#eef0ea}
.cap-phead strong{font-weight:600; font-size:15px; color:#eef0ea}
.cap-pclose{background:var(--cap-lime); color:var(--cap-deep); border:0; border-radius:999px; padding:6px 12px; font:600 13px/1 'Instrument Sans',sans-serif; cursor:pointer}
.cap-pclose:hover{background:#fff}
.cap-log{flex:1; overflow-y:auto; padding:14px; display:flex; flex-direction:column; gap:10px; min-height:160px}
.cap-msg{max-width:88%; padding:10px 12px; border-radius:14px}
.cap-msg p{margin:0}
.cap-bot{background:#fbfaf6; border:1px solid var(--cap-line); align-self:flex-start; border-bottom-left-radius:4px}
.cap-me{background:var(--cap-lime); align-self:flex-end; border-bottom-right-radius:4px}
.cap-link{display:inline-block; margin-top:8px; font-weight:600; color:var(--cap-coral-ink); text-decoration:none; border-bottom:1.5px solid currentColor; padding-bottom:1px}
.cap-link:hover{color:var(--cap-ink)}
.cap-chips{display:flex; flex-wrap:wrap; gap:6px; padding:0 14px 10px}
.cap-chips:empty{display:none}
.cap-chips-label{flex-basis:100%; margin:0 0 2px; font:500 11px/1.3 var(--mono,'JetBrains Mono',monospace); letter-spacing:.08em; text-transform:uppercase; color:var(--cap-soft)}
.cap-chip{border:1px solid var(--cap-ink); background:transparent; color:var(--cap-ink); border-radius:999px; padding:6px 11px; font:500 13px/1.2 'Instrument Sans',sans-serif; cursor:pointer; text-align:left}
.cap-chip:hover, .cap-chip:focus-visible{background:var(--cap-blue); outline:none}
.cap-form{display:flex; gap:8px; padding:10px; border-top:1px solid var(--cap-line); background:#fbfaf6}
.cap-input{flex:1; min-width:0; border:1px solid var(--cap-line); border-radius:999px; padding:10px 14px; font:400 15px 'Instrument Sans',sans-serif; background:#fff; color:var(--cap-ink)}
.cap-input:focus{outline:3px solid var(--cap-coral-ink); outline-offset:1px; border-color:transparent}
.cap-send{border:0; border-radius:999px; background:var(--cap-ink); color:var(--cap-paper); padding:0 16px; font:600 14px 'Instrument Sans',sans-serif; cursor:pointer}
.cap-send:hover{background:var(--cap-coral-ink)}

/* Phones: panel docks to the bottom of the screen */
@media (max-width:639px){
  .cap-panel{position:fixed; left:12px; right:12px; bottom:12px; width:auto; max-width:none; max-height:72vh; margin:0; z-index:61}
  .cap-root.is-open .cap-figure{visibility:hidden}
  .cap-bubble{width:min(214px,62vw); font-size:13px; padding:10px 30px 10px 12px}
}
@media (max-width:359px){
  .cap-panel{left:8px; right:8px; bottom:8px}
}
@media (prefers-reduced-motion:reduce){
  .cap-root.is-running .cap-img, .cap-bubble.is-on{animation:none}
}

/* Bring-back tab: shows only after he has been closed */
.cap-tab{
  position:fixed; right:16px; bottom:16px; z-index:62; display:none;
  background:#d7f58f; color:#17221f; border:0; border-radius:999px;
  padding:11px 16px; font:600 14px/1 'Instrument Sans',system-ui,sans-serif; cursor:pointer;
  box-shadow:0 10px 26px rgba(23,34,31,.25);
}
.cap-tab.is-on{display:block}
.cap-tab:hover, .cap-tab:focus-visible{background:#ffffff; outline:3px solid #b8563f; outline-offset:3px}